_   __                              __     _____                 __                 __
   / | / /___ _____  _______  __       / /    / ___/____ _____  ____/ /___ _   ______ _/ /
  /  |/ / __ `/ __ \/ ___/ / / /  __  / /     \__ \/ __ `/ __ \/ __  / __ \ | / / __ `/ / 
 / /|  / /_/ / / / / /__/ /_/ /  / /_/ /     ___/ / /_/ / / / / /_/ / /_/ / |/ / /_/ / /  
/_/ |_/\__,_/_/ /_/\___/\__, /   \____(_)   /____/\__,_/_/ /_/\__,_/\____/|___/\__,_/_/   
                       /____/                                                             

/* Design + Code by Gabe Abadilla / www.gabadilla.com / gabadilla@gmail.com */

/* RESETS */
html,button,input,select,textarea {color: #222;}
body {font-size: 1em; line-height: 1.4;}
::-moz-selection {background: #b3d4fc;text-shadow: none;}
::selection {background: #b3d4fc; text-shadow: none;}
hr {display: block;height: 1px;border: 0;border-top: 1px solid #ccc;margin: 1em 0;padding: 0;}
img {vertical-align: middle;}
fieldset {border: 0;margin: 0;padding: 0;}
textarea {resize: vertical;}
.chromeframe {margin: 0.2em 0;background: #ccc;color: #000;padding: 0.2em 0;}

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin:0; padding:0;}
table { border-collapse:collapse;border-spacing:0;}
fieldset,img { margin:0; padding:0; border:0;}
address,caption,cite,code,dfn,em,strong,th,var {font-style:normal;font-weight:normal;}
ol,ul {list-style:none;}
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6 {font-size:100%;font-weight:normal;}
q:before,q:after {content:'';}
abbr,acronym { border:0;}

/* COMMON */
html{background:#fff}
body{color:#5A503B; font-family:"articulat-cf-thin", sans-serif; font-weight: 500;  -webkit-font-smoothing:antialiased}
a, a img, a:hover, a:hover img, .animate{ -webkit-transition: all .3s ease-out; -moz-transition: all .3s ease-out; -ms-transition: all .3s ease-out;-o-transition: all .3s ease-out; transition: all .3s ease-out; text-decoration: none;}
a.quick, a.quick img, a.quick:hover, a.quick:hover img, .animate:hover{ -webkit-transition: all .2s ease-out; -moz-transition: all .2s ease-out; -ms-transition: all .2s ease-out;-o-transition: all .2s ease-out; transition: all .2s ease-out;}
img.imageScale{max-width:100%;}
div.wrapper{position:relative; margin:0 auto;}

div.container{width:90%; margin:0 auto;}
span.circleDot{display:inline-block; height:8px; width:8px; background:#D57D63; border-radius:100px; margin:0 10px 0 0; vertical-align:middle; }
p.standard{font-size:112.5%; line-height:140%; color:#5A503B}
span.sup{ vertical-align: 75%; line-height: 5px;
 font-size:11px;}

/* NAV */
div.nav{position:absolute; top:0px; width:100%; z-index:100; border-top:6px solid #D57D63; background:#F2EFE8}
div.nav div.container{position: relative; height:148px; margin:0 auto; width:90%; display: flex; justify-content:space-between; align-items:center; }
div.nav div.logo{vertical-align: middle; width:280px;}
div.nav ul.navLinks{}
div.nav ul.navLinks li{display: inline; margin:0 0 0 28px; }
div.nav ul.navLinks li a{font-size:112.5%; font-weight:700; color: #362521; padding:2px 0; display:inline-block}
div.nav ul.navLinks li a:hover{color: #D57D63}
div.nav ul.navLinks li a.active{border-bottom:2px solid rgba(213, 125, 99, 0.5)}
div.nav ul.navLinks li a.active:hover{}

/* FOOTER */
div.footer{padding:40px 0}
div.footer div.footerContent{text-align:center;}
div.footer ul.footerLinks{display:inline-block; margin: 0 auto; text-align:center;}
div.footer ul.footerLinks li{display:inline-block; margin:0 20px;}
div.footer ul.footerLinks li a{display:inline-block; color:#362521; font-weight:700;}
div.footer ul.footerLinks li a:hover{text-decoration:none; color:#D57D63}
div.footer ul.footerLinks li a img{padding:0 12px}
div.footer p.copyright{margin:24px auto 0; color:#89806C; font-size: 75%; text-align:center;}

/* HOME */
div.intro{background:#F2EFE8; padding:258px 0 0 0}
div.intro div.introContent{height:382px;}
div.intro div.introContent h1{font-size: 450%; font-weight: 700; letter-spacing: -1.5px; color:#362521;}
div.intro div.introContent p.introParagraph{font-size: 150%; font-weight: 500; letter-spacing: 0; margin:8px 0 0 0;}
div.intro div.introContent div.buttonContainer{display: flex; column-gap:16px; margin:28px 0 0 0; }
div.intro div.introContent div.buttonContainer a.primaryButton{display:inline-block; color: #ffffff; background:#D57D63; padding:0 32px; height: 54px; font-size:112.5%; line-height:54px; font-weight:700; border-radius: 100px; border:1px solid #D57D63 }
div.intro div.introContent div.buttonContainer a.primaryButton:hover{background:#A1462B; border:1px solid #A1462B}
div.intro div.introContent div.buttonContainer a.secondaryButton{display:inline-block; color:#362521; padding:0 32px; height: 54px; font-size:112.5%; line-height:54px; font-weight:700; border-radius: 100px; border:1px solid #362521; }
div.intro div.introContent div.buttonContainer a.secondaryButton:hover{background:#A1462B; border:1px solid #A1462B; color:#ffffff}

div.services{padding:80px 0 40px 0; background:#F8F6F2; }
div.servicesContainer{display:inline-flex;}
div.services div.servicesTitle{width:33.3%;}
div.services div.servicesTitle h2{color:#362521; font-size:250%; font-weight:700; letter-spacing:-.6px; width:75%}
div.services div.servicesContent{width:66.6%;}
div.services div.servicesContent div.serviceItem{float:left;width:50%; margin:0 0 40px 0}
div.services div.servicesContent div.serviceItem h3{margin:0 0 8px 0; color:#362521; font-size:137.5%; font-weight:700; letter-spacing:-.4px; width:90%}
div.services div.servicesContent div.serviceItem p{width:90%}

/* ABOUT */
div.about{background:#F8F6F2; padding:224px 0 80px 0}

div.bioContainer{width:100%; margin:0 0 60px 0; display: inline-flex; gap: 0px;}
div.bioImage{width:25%}
div.bioImage span.imageContainer{display:inline-block; overflow:hidden; border-radius:8px}

div.bioContent{width:75%}
div.bioContent p.largeParagraph{font-size:250%; font-weight:700; line-height:125%; color:#362521; margin:0 0 28px 0;}
div.bioContent p.standard{margin:0 0 24px 0}
div.bioContent p.standard:last-child{margin:0}

div.highlightsContainer{width:100%; margin:0 0 60px 0; display: inline-flex; gap: 0px; }
div.highlightsTitle{width:25%;}
div.highlightsTitle h3.dotTitle{font-size:127.5%; font-weight:700; color:#362521; }
div.highlightsContent{width:75%;}
div.highlightsContent ul{width:100%; list-style-type: disc; list-style-position: outside; padding:0 0 0 20px; }
div.highlightsContent ul li{margin:0 0 5px 0}
div.highlightsContent ul li p{display:inline}

div.engagementsContainer{width:100%; display: inline-flex; gap: 0px; }
div.engagementsTitle{width:25%}
div.engagementsTitle h3.dotTitle{font-size:127.5%; font-weight:700; color:#362521;}
div.engagementsContent{width:75%}
div.engagementsContent p.engagementsIntro{margin:0 0 24px 0; font-size:112.5%; line-height:140%; color:#5A503B}
div.engagementsContent div.engagementItems{display: flex; flex-wrap: wrap; gap: 0px;}
div.engagementsContent div.engagementItem{flex: 50%; margin-bottom:20px;}
div.engagementsContent div.engagementItem p{width:90%;}
div.engagementsContent div.engagementItem p strong{font-weight:700; color:#362521;}

/* CONTACT */
div.contact{background:#F8F6F2; padding:224px 0 80px 0; min-height:500px}
div.contactContainer{width:100%; margin:0 0 60px 0; display: inline-flex; gap: 0px;}
div.contactTitle{width:33.3%}
div.contactTitle h2{color:#362521; font-size:250%; font-weight:700; letter-spacing:-.6px; width:75%}
div.contactContent{width:66.6%}
div.contactContent p{margin:0 0 40px 0}
div.contactContent div.contactList{display:flex; flex-direction:column; gap: 20px;}
div.contactContent div.contactList div.contactItem{display: inline-flex;}
div.contactContent div.contactList div.contactItem div.contactLabel{font-size:112.5%; width:120px; line-height:140%; color:#362521; font-weight:700}
div.contactContent div.contactList div.contactItem div.contactInfo{font-size:112.5%; line-height:140%; color:#362521}
div.contactContent div.contactList div.contactItem div.contactInfo a{color:#362521}
div.contactContent div.contactList div.contactItem div.contactInfo a:hover{color:#D57D63}
div.contactContent div.contactList div.contactItem div.contactInfo span.note{font-size:70%; text-transform:uppercase; letter-spacing:1.25px; font-weight:900; color:#D57D63}

/* MEDIA QUERIES*/

@media only screen and (max-width : 767px) and (min-width : 320px) {
	/* VIEWPORT: MOBILE */
 	div.container{width:90%;}
	p.standard{font-size:100%;}
	span.circleDot{display:none}
	
	div.nav div.container{position: relative; height:auto; width:90%;  margin:0 auto; padding:24px 0; display: flex; flex-direction: column; row-gap:16px;}
	div.nav div.logo{vertical-align: middle; width:240px;}
	div.nav ul.navLinks li{display: inline; margin:0 10px; }
	div.nav ul.navLinks li a{font-size:100%; padding:2px 0;}
	div.footer ul.footerLinks li{margin:0 10px;}
	
	/* HOME */
	div.intro{background:#F2EFE8; padding:180px 0 60px 0}
	div.intro div.introContent{height:auto; text-align:center;}
	div.intro div.introContent h1{font-size: 200%;letter-spacing: -1px; text-align:center;}
	div.intro div.introContent p.introParagraph{font-size: 112.5%; margin:8px 0 0 0; text-align:center;}
	div.intro div.introContent div.buttonContainer{display: inline-flex; column-gap:12px; margin:20px auto 0;}
	div.intro div.introContent div.buttonContainer a.primaryButton{display:inline-block; background:#D57D63; padding:0 20px; height: 40px; font-size:100%; line-height:40px;}
	div.intro div.introContent div.buttonContainer a.secondaryButton{display:inline-block; padding:0 20px; height: 40px; font-size:100%; line-height:40px;}
	
	div.services{padding:40px 0 20px 0; }
	div.servicesContainer{display: flex; flex-direction: column; row-gap:24px;}
	div.services div.servicesTitle{width:100%;}
	div.services div.servicesTitle h2{color:#362521; font-size:140%; letter-spacing:-.5px; width:100%}
	div.services div.servicesContent{width:100%;}
	div.services div.servicesContent div.serviceItem{float:left;width:100%; margin:0 0 20px 0}
	div.services div.servicesContent div.serviceItem h3{margin:0 0 2px 0; color:#362521; font-size:100%; font-weight:700; letter-spacing:-.3px; width:100%}
	div.services div.servicesContent div.serviceItem p{width:100%}	
	
	
	/* ABOUT */
	div.about{background:#F8F6F2; padding:200px 0 40px 0}
	div.bioContent p.largeParagraph{font-size:200%; font-weight:700; line-height:125%; color:#362521; margin:0 0 28px 0;}

	div.bioContainer{width:100%; margin:0 0 40px 0; display: flex; flex-direction: column; row-gap:24px;}
	div.bioImage{width:100%; max-width:180px; margin:0 auto}
	div.bioImage span.imageContainer{width:100%; display:inline-block; overflow:hidden; border-radius:8px}
	
	div.bioContent{width:100%}
	div.bioContent p.largeParagraph{font-size:140%; font-weight:700; line-height:120%; color:#362521; margin:0 0 28px 0;}
	div.bioContent p.standard{margin:0 0 24px 0}
	div.bioContent p.standard:last-child{margin:0}

	div.highlightsContainer{width:100%; margin:0 0 40px 0; display: flex; flex-direction: column; row-gap:16px;}
	div.highlightsTitle{width:100%;}
	div.highlightsTitle h3.dotTitle{font-size:120%; font-weight:700; color:#362521; }
	div.highlightsContent{width:100%}
	div.highlightsContent ul{width:100%;}
	div.highlightsContent ul li{margin:0 0 5px 0}
	div.highlightsContent ul li p{display:inline}
	
	div.engagementsContainer{width:100%; display: flex; flex-direction: column; row-gap:16px; }
	div.engagementsTitle{width:100%}
	div.engagementsTitle h3.dotTitle{font-size:120%; font-weight:700; color:#362521;}
	div.engagementsContent{width:100%}
	div.engagementsContent p.engagementsIntro{margin:0 0 16px 0; font-size:100%; line-height:140%; color:#5A503B}
	div.engagementsContent div.engagementItem{flex: 100%; margin-bottom:15px;}
	div.engagementsContent div.engagementItem{width:100%;}
	div.engagementsContent div.engagementItem p{width:100%;}

	
	/* CONTACT */
	div.contact{background:#F8F6F2; padding:200px 0 40px 0; min-height:100px}
	div.contactContainer{width:100%; margin:0 0 0 0; flex; flex-direction: column; row-gap:16px;}
	div.contactTitle{width:100%}
	div.contactTitle h2{color:#362521; font-size:140%; letter-spacing:-.5px; width:100%}
	div.contactContent{width:100%}
	div.contactContent p{margin:0 0 40px 0}
	div.contactContent div.contactList{display:flex; flex-direction:column; gap: 20px;}
	div.contactContent div.contactList div.contactItem{display: inline-flex;}
	div.contactContent div.contactList div.contactItem div.contactLabel{font-size:100%; width:90px;}
	div.contactContent div.contactList div.contactItem div.contactInfo{font-size:100%;}

	/* FOOTER */
	div.footer div.footerContent{text-align:center;}
	div.footer ul.footerLinks{display:block; text-align:left;}
	div.footer ul.footerLinks li{display:block; margin:0 0 20px 0;}
	div.footer ul.footerLinks li a{display:inline-block; color:#362521; font-weight:700;}
	div.footer ul.footerLinks li a:hover{text-decoration:none; color:#D57D63}
	div.footer ul.footerLinks li a img{width:32px; padding:0 12px 0 0}
	div.footer p.copyright{margin:24px auto 0; color:#89806C; font-size: 75%; text-align:left;}

}
@media only screen and (max-width : 1023px) and (min-width : 768px) {
    /* VIEWPORT: TABLET PORTRAIT */
    div.container{width:94%;}
	div.nav div.container{width:94%;; margin:0 auto;}
	div.footer ul.footerLinks li{margin:0 10px;}
	
	/* HOME */
	div.intro div.introContent h1{font-size: 400%;letter-spacing: -1px;}
	div.services div.servicesTitle h2{font-size:180%; letter-spacing:-.5px; width:90%}
	
	/* ABOUT */
	div.bioImage{width:25%}
	div.bioImage span.imageContainer{width:80%}
	div.bioContent p.largeParagraph{font-size:180%; font-weight:700; line-height:125%; color:#362521; margin:0 0 28px 0;}
	
	/* CONTACT */
	div.contactTitle h2{font-size:200%; letter-spacing:-.5px; width:100%}
	
	
}
@media only screen and (max-width : 1279px) and (min-width : 1024px) {
    /* VIEWPORT: SMALL DESKTOP/TABLET LANDSCAPE */
    div.container{width:94%;}
	div.nav div.container{width:94%;; margin:0 auto;}

	/* HOME */
	div.intro div.introContent h1{font-size: 400%;letter-spacing: -1px;}
	div.services div.servicesTitle h2{font-size:180%; letter-spacing:-.5px; width:90%}
	
	/* ABOUT */
	div.bioImage{width:25%}
	div.bioImage span.imageContainer{width:80%}

}
@media only screen and (max-width : 1799px) and (min-width : 1280px) {
    /* VIEWPORT: TYPICAL DESKTOP */
}
@media only screen and (min-width : 1800px) {
    /* VIEWPORT: LARGE DESKTOP */
    div.container{width:1440px; margin:0 auto;}
	div.nav div.container{width:1440px; margin:0 auto;}
}

@media print {
    * {background: transparent !important; color: #000 !important; /* Black prints faster: h5bp.com/s */ box-shadow: none !important; text-shadow: none !important;}
    a, a:visited { text-decoration: underline;}
    a[href]:after { content: " (" attr(href) ")";}
    abbr[title]:after { content: " (" attr(title) ")";}
    .ir a:after,a[href^="javascript:"]:after,a[href^="#"]:after {content: "";}
    pre, blockquote { border: 1px solid #999; page-break-inside: avoid;}
    thead {display: table-header-group; /* h5bp.com/t */}
    tr, img {page-break-inside: avoid;}
    img {max-width: 100% !important;}
    @page {margin: 0.5cm;}
    p, h2, h3 { orphans: 3; widows: 3;}
    h2, h3 { page-break-after: avoid;}
}

/* CLEARFIX */
.clearfix:after {content: ".";display: block;clear: both;visibility: hidden;line-height: 0;height: 0;}
.clearfix {display: inline-block;}
html[xmlns] .clearfix {display: block;}
* html .clearfix {height: 1%;}