/*
Website Design/Build:
Kevin Snell
Formulate Communicative Design
www.formulate.ca
*/


/* GLOBAL */

.hsh_green { color:#CAD4C5; }
.hsh_dark_green { color:#738F73; }

html,body { margin:0; padding:0; color:#687586; font-size:18px; }

input:focus { outline: none; }

h1, h2, h3, h4 { font-family: 'Montserrat', sans-serif; color:#738F73; font-weight:300; }
h1 { letter-spacing:1px; line-height:1.2em; font-weight:300; font-size:40px; }
h2 { font-size:30px; }
h3 { font-size:26px; }

a { color:#738F73; }
a:hover { text-decoration:none; color:#053B03; }

em { color:#687586; }

hr { margin:50px 0; border:none; border-top:1px solid #CAD4C5; }

.uk-button { margin:5px 0; padding:0 40px; background:#738F73; color:#fff; border:1px solid #fff; font-size:15px; font-weight:300; letter-spacing:1px; text-transform:uppercase; height:40px; line-height:38px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
.uk-button:hover { background:#fff; border:1px solid #CAD4C5; color:#738F73; }

.align_center { text-align:center; }

.padded { padding:0 40px; }

.map { overflow:hidden; padding-bottom:50%; position:relative; height:0; }
.map iframe{ left:0; top:0; height:100%; width:100%; position:absolute; }

#editpage { position: fixed; top: 4px; left: 49%;  z-index:9999; }
#editpage a { float:left; padding: 3px 6px 5px 6px; background: #db1174; color: #FFB8DB; display: block; font-weight: normal; font-size:14px; z-index:9999; margin:0 1px; text-decoration:none; line-height:1em; stroke-width:2px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
#editpage a:hover { background: #ffffcc; color: #000; text-decoration:none; }


/* STYLES */

#header { padding:20px; background:#CAD4C5; }

#header .logo img { width:100%; max-width:320px; }

#header .menu a { font-size:16px; text-transform:uppercase; color:#575757; font-family: 'Montserrat', sans-serif; letter-spacing:1px; }
#header .menu a:hover { color:#053B03; }
#header .menu i.uk-icon { position:relative; top:-1px; }
#header .menu ul { float:right; margin:0; padding:0; list-style:none; width:fit-content; }
#header .menu ul li { display:inline; padding:0 12px; }
#header .menu ul li.instagram { padding:0 10px !important; }

#menu ul { margin:0; padding:0; list-style:none; text-align:center; }
#menu ul li { padding:5px 0; }
#menu ul li a { font-size:26px; font-weight:300; letter-spacing:1px; }

#hero img { width:100%; }

#title { padding:22px; background:transparent url('/site/templates/assets/images/green_plant_bkg.png') repeat-x top center; }
#title h1 { margin:0; padding:0; opacity:.9; font-weight:300; text-align:center; font-size:42px; }

#layout { width:100%; max-width:1100px; margin:0 auto; padding:40px 0 0 0; }
.page1 #layout { max-width:100%; padding:0; }

#content { padding:0 40px; }
.page1 #content { padding:60px 0 0 0; max-width:1100px; margin:0 auto; text-align:center; }

#content table { border:none; width:100% !important; margin:0 auto; }
#content tr:nth-child(odd) { background:#f2f2f2; }
#content table td { padding:5px; border:none; font-size:14px; line-height:1.2em; }

#ctas { background:transparent url('/site/templates/assets/images/green_plant_bkg.png') repeat-x top center; }
#ctas .uk-grid { margin:0 auto; max-width:1200px; }
#ctas .item { margin-top:-40px; margin-bottom:40px; padding:0 30px 20px 30px; text-align:center; }
#ctas .item img { width:100%; max-width:280px; border:5px solid #fff; border-radius:50%; }
#ctas .item h2 { margin:15px 0 0 0; text-transform:uppercase; font-size:28px; }
#ctas .item p { margin:5px 0 10px 0; font-size:18px; }

#testimonials { width:100%; max-width:800px; margin:0 auto; text-align:center; }
#testimonials h2 { margin:30px 0 -10px 0; padding:0; border-top:2px solid #CAD4C5; }
#testimonials h2 img { position:relative; top:-27px; width:90px; padding:0 20px; background:#fff; }
#testimonials p { margin:0 0 25px 0; color:#738F73; font-size:24px; line-height:1.3em; font-family: 'Montserrat', sans-serif; }

#stylists { text-align:center; }
#stylists .item { margin:50px 0; }
#stylists .item .photo img { width:100%; max-width:280px; border:5px solid #fff; border-radius:50%; }
#stylists .item .text { padding:25px 0 0 0; }
#stylists .item .text h2 { margin:-15px 0 3px 0; font-size:26px; }
#stylists .item .text h3 { margin:0; font-size:17px; }
#stylists .item .text p { margin:10px 0; font-size:16px; }

#products { text-align:center; }
#products h3 { margin:30px 0 -5px 0; color:#000; font-weight:400; border-bottom:1px dotted #ccc; padding-bottom:10px; }
#products img { width:100%; max-width:350px; padding:30px; }

#gallery { width:100%; max-width:1000px; margin:50px auto; }
#gallery img { padding:5px; }
.page1 #gallery { margin:10px auto 60px auto; }

#footer { position:relative; z-index:2; min-height:335px; background:#CAD4C5; }
#footer #tagline { background:#fff; padding:80px 40px 0 40px; }
#footer #tagline h2 { position:relative; z-index:4; top:30px; background:#fff; margin:0 auto; max-width:980px; padding:15px 0; text-align:center; border:1px solid #CAD4C5; font-size:17px; }
#footer #book { position:relative; z-index:4; padding:0 40px; text-align:center; }
#footer #book h3 { margin:50px 0 0 0; text-transform:uppercase; font-size:23px; }
#footer #book p { margin:5px 0 0 0; font-size:16px; color:#698067; }
#footer #book .phone { color:#000; font-size:22px; padding:0 20px; }
#footer #overlay { position:absolute; z-index:3; top:0; right:0; width:50%; min-height:335px; background:transparent url('/site/templates/assets/images/footer_bkg.png') no-repeat bottom right; background-size:contain; }

#copyright { padding:15px 40px; background:#788679; color:#fff; font-size:13px; text-align:center; }
#copyright span.credit { display:block; margin-top:5px; }
#copyright span.credit img { position:relative; top:-2px; width:18px; height:18px; margin-right:4px; }
#copyright a { color:#CAD4C5; }
#copyright a:hover { color:#fff; }
#copyright a.instagram i { position:relative; top:-2px; margin-right:8px; }


/* MEDIA QUERIES */

@media only screen and (min-width: 640px) {   
  
  #header { padding:25px; }
  
  #content table { width:85% !important; }
  #content table td { font-size:15px; line-height:1.4em; }
  
  #stylists .item { text-align:left; }
  #stylists .item .text { padding:3% 0 0 5%; }
  
  #footer #tagline h2 { font-size:18px; }
  #footer #book { text-align:left; }
  #footer #book h3 { margin:55px 0 0 0; font-size:26px; }
  #footer #book .phone { padding:0 20px 0 0; }
  
  #copyright { text-align:left; }
  #copyright span.credit { float:right; margin:0; text-align:right; }

}

@media only screen and (min-width: 960px) { 
  
  #header { padding:30px 30px 30px 40px; }
  
  #content table { width:80% !important; }
  #content table td { padding:6px; font-size:16px; }
 
  #footer #tagline h2 { padding:0 30px; height:60px; line-height:60px; font-size:26px; }
  #footer #overlay { width:100%; }

}

@media only screen and (min-width: 1024px) {  
  
  #header .menu ul li { padding:0 14px; }

}

@media only screen and (min-width: 1200px) {  
 
    #header .menu a { font-size:18px; }
    #header .menu ul li { padding:0 20px; }
    
    #footer #tagline h2 { font-size:30px; }

}

@media only screen and (min-width: 1400px) {   
}

@media only screen and (min-width: 1600px) { 
}

