html {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

body {	   
   font-size:14px;    
   font-weight:normal;
   line-height: 34px;  
    font-family: "Raleway", sans-serif;
    font-weight: normal;
    letter-spacing: 2px;
}

.wrap {
  box-sizing: border-box;
  max-width: 1200px;
  margin: 0 auto;
}


.site-main-op1{
    padding:70px 0;
    clear: both;
    width:100%;
    background:#5B4F45;
}

.site-main-op1 h2 {
    text-align:center
}

.site-main-op1 p{
    text-align:justify;
    color:#EEEDE6;
}


.site-main{
    padding:70px 0;
    clear: both;
    width:100%;
    background:#EEEDE6;
}

.site-main h2 {
    text-align:center
}

.site-main p{
    text-align: left
}

.site-main p strong{
    color: #8E8A87;
}

p.center{
    text-align: center    
}

.img-center{
    display: block;
    margin: 0 auto 25px
}


.nopadding {
   padding: 0 !important;
   margin: 0 !important;
	
}




/*--------------------------------------------------------------
#  Menu
--------------------------------------------------------------*/

.topo{
   background:#5A4E45; 
    padding: 15px 0
}

.nav{
    
}
.nav img{
    display:block;
    margin: 0 auto;
}


.menu ul{
    display: table;
    margin: 0 auto;
    padding: 0;
}
.menu ul li{
    list-style: none;
    text-align: center;
    float: left;
}
.menu ul li a{
    color:#EEEDE6;
    float: left;
    text-transform: uppercase;
    padding: 10px 20px;
    text-align: center;
    text-decoration: none;
    font-family: "Raleway", sans-serif;
    font-weight: 400;
  
}
.menu ul li a:hover{
    opacity: 0.8;
     color:#EEEDE6;
    text-decoration-line: overline
}




/*--------------------------------------------------------------
#  Call Action
--------------------------------------------------------------*/

.action-center{
    padding:70px 0;
    background:#EEEDE6; 
    position: relative;
}
.action-center p{
    color:#5B4F45;
    font-size:32px;
    font-weight: normal;   
    margin: 0;
    line-height:50px;
    font-family: "Source Serif 4", serif;
    text-transform: uppercase
}



/*--------------------------------------------------------------
#  Titulo pagina interna
--------------------------------------------------------------*/


.page-header{
    padding:30px 0;    
}

.page-header h1{
    text-align: center;
    color:#5B4F45;    
    margin: 0;      
    font-size: 42px;
    font-family: "Source Serif 4", serif;
    text-transform: uppercase
}

.page-header-op1{
     padding:30px 0; 
}
.page-header-op1 h1{
    text-align: center;
    color:#EEEDE6;    
    margin: 0;      
    font-size: 42px;
    font-family: "Source Serif 4", serif;
    text-transform: uppercase
}


/*--------------------------------------------------------------
# Links
--------------------------------------------------------------*/

a {
	color: #111;
	text-decoration: underline;
}

a:focus {
	outline: thin dotted;
}

a:hover,
a:active {
	color: #333;
	outline: 0;
}

/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/


img {
	height: auto;	
	max-width: 100%;	
	vertical-align: middle;
}

img,
video {
	height: auto;
	max-width: 100%; 
}


embed,
iframe,
object {
	margin:0;
	padding:0;
	max-width: 100%;
}


/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/

h1,
h2,
h3,
h4,
h5,
h6 {
	line-height: 1.5;
	margin: 0 0 25px 0;	
    font-weight:400; 
	padding: 0;
}


h1 {
	font-size: 36px;
	
}

h2, h3, h4, h5, h6 {
	font-size:26px;

}

p {
	margin: 0 0 15px 0;
	padding: 0;
}

dfn,
cite,
em,
i {
	font-style: italic;
}

blockquote {
	font-size:27px;	
	line-height: 1.1;
	margin: 0;
	overflow: hidden;
	padding: 0;   
}

blockquote cite {
	display: block;
	font-style: normal;
	font-weight: 600;
	margin-top: 0.5em;
}

address {
	margin: 0 0 25px 0;
}

pre {
	background: #fafafa;
	font-size: 15px;
	font-size: 0.9375rem;
	line-height: 1.6;
	margin-bottom: 1.6em;
	max-width: 100%;
	overflow: auto;
	padding: 1.6em;
}

code,
kbd,
tt,
var {
	font-size: 15px;
	font-size: 0.9375rem;
}

abbr,
acronym {
	border-bottom: 1px dotted #fafafa;
	cursor: help;
}

mark,
ins {
	background: #fafafa;
	text-decoration: none;
}

big {
	font-size: 125%;
}

blockquote {
	quotes: "" "";
}

q {
	quotes: "“" "”" "‘" "’";
}

blockquote:before,
blockquote:after {
	content: "";
}

:focus {
	outline: none;
}


/*--------------------------------------------------------------
# Listas
--------------------------------------------------------------*/

ul,
ol {
	margin: 0 0 1.5em 20px;
	padding: 0;
}

ul {
	list-style: disc;
}

ol {
	counter-reset: item;
}

ol li {
	display: block;
	position: relative;
    font-size: 14px;

}

dt {
	font-weight: 700;
}

dd {
	margin: 0 1.5em 1.5em;
}

/*--------------------------------------------------------------
# Tables
--------------------------------------------------------------*/

table {
	border-collapse: collapse;
	margin: 0 0 1.5em;
	width: 100%;
}

thead th {
	border-bottom: 2px solid #eaeaea;
	padding-bottom: 0.5em;
}

th {
	padding: 0.4em;
	text-align: left;
}

tr {
	border-bottom: 1px solid #eaeaea;
}

td {
	padding: 0.4em;
}

th:first-child,
td:first-child {
	padding-left: 0;
}

th:last-child,
td:last-child {
	padding-right: 0;
}



/* = Ação
-------------------------------------------------------------- */

a.btn{
    padding:12px 0;
    width: 100%;
    text-decoration:none;
    border-radius:4px;
    text-align: center;  
    display: table;   
    font-weight:300;      
}

a.btn-menu{background:none; color:#DCDAD3; text-transform: uppercase; text-decoration: none}
a:hover.btn-menu{ opacity: 0.8; color:#DCDAD3;   }

a.btn-whats{background:none; border: 1px solid #DCDAD3; color:#DCDAD3 }
a:hover.btn-whats{ opacity: 0.8; color:#DCDAD3 }


a.btn-whats-1{
    padding:12px 0;
    width: 60%;
    text-decoration:none;
    border-radius:52px;
    text-align: center;  
    display: table;   
    font-weight:normal;    
    border: 1px solid #3C352F;
    color:#3C352F;
    text-transform: uppercase;    
}
a:hover.btn-whats-1{
    opacity: 0.8; 
   color:#3C352F;
}


a.btn-whats-2{
    padding:12px 0;
    width:100%;
    text-decoration:none;
    border-radius:52px;
    text-align: center;  
    display: table;
    margin: 15px auto;      
    border: 2px solid #5B4F45;
    color:#5B4F45;
    text-transform: uppercase;
    font-size: 18px;
    
}
a:hover.btn-whats-2{
    opacity: 0.8; 
    color:#5B4F45
}


a.btn-footer{        
    position: fixed;
    right:1%;
    bottom:1%;
	 	
}
a.btn-footer img{
    float:right;
}


/* = Header
-------------------------------------------------------------- */

.header{	
	padding:15px 0;    
}

.banner-header{    
    padding:15px 0 0 0;
    background:#CAC8C2 url('images/background-1.png') no-repeat center center;
    
}

.banner-header span{
    font-size:62px;
    display: block;
    color:#3C352F;
    text-align:left;
    line-height:65px;        
    margin: 0 0 25px 0; 
    font-family: "Source Serif 4", serif;
}

.img-logo{
    padding: 15px 0;
    margin: 0 0 15px 0;
}

.img-logo-footer{
    display: block;
    margin:25px auto;
}

/* = Footer
-------------------------------------------------------------- */

.footer{
    padding:20px 0;
    background:#5B4F45;   
}

.box-footer{
    margin: 0 0 15px 0;
    padding: 25px;
}
.box-footer span{
    display: block;
    margin: 0 0 5px 0;
    color:#EEEDE6;
    font-size:18px;
    text-align: center;
    text-transform: uppercase;
    font-weight: bold
}

.box-footer img{
    display: block;
    margin: 0 auto 25px;
}

.box-footer p, .box-footer address{
    text-align: center;  
    font-style: normal;
    color:#EEEDE6;      
}
.footer a{
    color: #DCDAD3;
}
.footer a:hover{
    color:#DCDAD3;
    opacity: 0.9;
}



/* = Sobre
-------------------------------------------------------------- */

.sobre{
    padding:70px 0;
    background: #EEEDE6; 
}

.sobre h2{
    text-transform: uppercase;
    font-weight:normal;
    margin: 0 0 25px 0;
    color:#3C352F;
    font-size:42px;
    line-height: 50px;
    font-family: "Source Serif 4", serif;
}
.sobre p{
    color:#3C352F;   
    text-align:justify
}
.sobre img{
    display: block;
    margin:25px auto 25px;
}

.bloco-sobre{
    padding:70px 0;
    background: #5B4F45; 
}

.bloco-sobre span{
    display:block;
    font-size: 42px;
    margin: 0 0 25px 0;
    color: #EEEDE6;
    line-height: 55px;
    font-family: "Source Serif 4", serif;
}
.bloco-sobre p{
    color: #EEEDE6;
    text-align:justify
    
}
.bloco-sobre img{
    display: block;
    margin: 25px auto 25px;
}

/* = Sobre
-------------------------------------------------------------- */


.galeria{
    padding: 70px 0;
    background:#EEEDE6;
}

.galeria span{
    display: block;
    margin: 0 0 40px 0;
    color:#5B4F45;
    text-align: center;
    font-size: 36px;
    text-transform: uppercase;
    font-family: "Source Serif 4", serif;
}

.box-foto{
    margin: 15px 8px;
}

/* ---------------------------------------------------
   Produtos 
--------------------------------------------------- */ 

.prod{
    background: #5B4F45;
    padding:0    
}

.prod span{
    display: block;
    margin: 0 0 25px 0;
    color:#EEEDE6;
    text-align:left;
    font-size: 36px;
    text-transform: uppercase;
    text-align: center;
    font-family: "Source Serif 4", serif;
}


.prod img{
    float: right
}

.box-prod{
    padding:50px 100px 50px;
}

.box-prod ul{
   padding: 0;
   margin: 0 0 25px 0;
}

.box-prod ul li{
    list-style: none;
    text-transform: uppercase;
    color:#EEEDE6;
     display:block;
    width: 100%;   
    text-align: center;
    font-family: "Source Serif 4", serif;
    padding:15px 0;
}
.box-prod ul li a{
    color:#EEEDE6;   
    display:block;    
    width: 100%;
    text-decoration: none;
    background-image: url ('/images/linha.png') no-repeat center bottom;
    position: relative;
  
      
        
}

.box-prod ul li a:hover{
    opacity: 0.8;
    color:#EEEDE6; 
    text-decoration: overline
}


.box-prod p{
    text-align: center;
}

a.saibamais{
    display: table;
    margin:25px auto;
    border-radius: 52px;
    text-transform: uppercase;
    text-align: center;
    color:#EEEDE6;
    text-decoration: none;
    border: 1px solid #EEEDE6;
    padding: 14px 60px;
    font-size: 14px;
    
}

a:hover.saibamais{
    opacity: 0.8; 
    color:#EEEDE6;
}

/* ---------------------------------------------------
  Modal  
--------------------------------------------------- */ 

.modal {
  display: none;
  position: fixed;
  z-index: 1; 
  left: 0;
  top: 0;
  width: 100%; 
  height: 100%; 
  overflow: auto; 
  
}

.modal-content {
  background:#DCDAD3;
  margin:1% auto; 
  padding:25px 25px 45px 25px;
  border: 1px solid #DCDAD3;
  width: 80%;  
}

.close {
  color:#8E8A87;
  font-size:22px;
  font-weight: bold;
  display: block;
  text-align:right;
  padding: 25px;
}

.close:hover,
.close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
  color:#333;
}

.modalDialog {
    position: fixed;   
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.8);
    z-index: 99999;
    opacity:0;
    -webkit-transition: opacity 400ms ease-in;
    -moz-transition: opacity 400ms ease-in;
    transition: opacity 400ms ease-in;
    pointer-events: none;
}
.modalDialog:target {
    opacity:1;
    pointer-events: auto;
}
.modalDialog > div {
    width: 450px;
    position: relative;
    margin:2% auto;
    padding:15px;  
    
   
}



/*  Menu dentro do Modal Header  */

ul.nav-header {
    padding: 0;
    margin: 0;
}

ul.nav-header li {
   list-style: none;  
    text-align: center;    
}

ul.nav-header li a{
    display: block;
    padding:10px 20px;
    text-decoration: none;
    border-radius: 52px;
    background: #5B4F45;
    margin: 0 0 20px 0;
    color: #EEEDE6;
    font-weight: normal;
    text-transform: uppercase
    
}
ul.nav-header li a:hover{
    opacity: 0.8;
    color: #EEEDE6; 
}





/* = Credito
-------------------------------------------------------------- */

.credito{
    padding:10px 0;
    background:#5B4F45;
}
.credito p{
    text-align: center;
    font-size: 12px;
    margin: 0;
}
.credito a{
    color:#EEEDE6;  
    text-decoration: none
}


/* = Btn Pagina
-------------------------------------------------------------- */

a.btn-page-d{
    float: right;
    border-radius: 52px;
    border: 1px solid #EEEDE6;
    text-transform: uppercase;
    color: #EEEDE6;
    text-align: center;
    padding: 10px 40px; 
    margin: 40px 0;
    text-decoration: none;
    font-size: 12px;
}
a:hover.btn-page-d{
    opacity: 0.8;
    color: #EEEDE6;    
}

a.btn-page-e{
    float:left;
    border-radius: 52px;
    border: 1px solid #EEEDE6;
    text-transform: uppercase;
    color: #EEEDE6;
    text-align: center;
    padding: 10px 40px; 
    margin: 40px 0;
    text-decoration: none;
    font-size: 12px;
}
a:hover.btn-page-e{
    opacity: 0.8;
    color: #EEEDE6;    
}



/* = Tratamentos Hover Imagem
-------------------------------------------------------------- */

.div-overlay{  
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  background-color: rgba(0,0,0,0.5); /*dim the background*/
}



.tratamentos{
    background:#EEEDE6;
    padding: 0 0 80px 0
}


.box-tratamentos{
    padding:0;
    margin: 0 0 25px 0;
    position: relative;
}

.box-tratamentos img{
   display:block;
    margin: 0 auto;
}


.box-tratamentos span{
    text-align: center;
   
}
.box-tratamentos span a{
    position: absolute;
    top:0; 
    left: 0;
    color: #EEEDE6;
    text-transform: uppercase;
    width: 100%; 
    height:53%;
    font-weight: normal;
    z-index: 11;
    position: absolute;
    left: 0;       
    z-index: 10;
    background-color: rgba(0,0,0,0.5); /*dim the background*/
    text-decoration: none;
    padding:35% 0 0 0;
}

.box-tratamentos span a:hover{
    opacity: 0.8;
    color: #EEEDE6;
}


.nav{
    display: none;
}



/* Exact aspect ratio */
@media (aspect-ratio: 2/1) {
    
    
  .img-logo {
     
    display: block;
    margin: 25px auto 15px;
}
    
   .banner-header span{
       font-size:42px;
     
}
    
    .topo{
        display:none;
    }
    
    .nav{
        display:inline !important;
        position: absolute;
        top: 0;
        right:0;
        background:#5A4E45;
        width: 100%;        
        padding:10px 0;
    }
    
    .nav img{
        float: right;
        margin: 0 10px 0 0
    }
    
    .footer{
        padding-bottom:150px;
    }
    
    .box-footer{
        padding: 0;
    }
    
     a.btn-footer{
        width:90%;        
        left:2%;
        bottom:5%;
        	
    }
    
    .menu{
        display: none;
    }
    
    a.btn-whats-1{
  
    width: 100%;   
    display: table;
        margin: 15px auto 15px;
    
}
    
     .modalDialog > div {
        width: auto;    
        margin: 5% auto;
        padding: 30px 25px 30x 25px;
  
     }
    
    .box-prod{
        padding: 25px
    }
    
    
    a.saibamais {
     padding: 14px 10px;
        font-size: 11px;
    
}
    
    
 a.btn-page-d, a.btn-page-e{
    float: none;
    display: table;
    width: 100%;   
    margin: 40px auto;
    padding: 14px 0
   
}
    
    
   
    }


/* Maximum aspect ratio */
@media (max-aspect-ratio: 8/5) {
    
    
    .img-logo {
     
    display: block;
    margin: 25px auto 15px;
}
    
   .banner-header span{
       font-size:42px;
     
}
    
    .topo{
        display:none;
    }
    
    .nav{
        display:inline !important;
        position: absolute;
        top: 0;
        right:0;
        background:#5A4E45;
        width: 100%;        
        padding:10px 0;
    }
    
    .nav img{
        float: right;
        margin: 0 10px 0 0
    }
    
    .footer{
        padding-bottom:150px;
    }
    
    .box-footer{
        padding: 0;
    }
    
     a.btn-footer{
        width:90%;        
        left:2%;
        bottom:5%;
        	
    }
    
    .nav{
        display: none;
    }
    
    a.btn-whats-1{
  
    width: 100%;   
    display: table;
        margin: 15px auto 15px;
    
}
    
     .modalDialog > div {
        width: auto;    
        margin: 5% auto;
        padding: 30px 25px 30x 25px;
  
     }
    
    .box-prod{
        padding: 25px
    }
    
    
    a.saibamais {
     padding: 14px 10px;
        font-size: 11px;
    
}
    
    
    a.btn-page-d, a.btn-page-e{
    float: none;
    display: table;
    width: 100%;   
    margin: 40px auto;
    padding: 14px 0
   
}
      
	
}



@media screen and (max-width: 736px) and (orientation: landscape) {
     .img-logo {
     
    display: block;
    margin: 25px auto 15px;
}
    
   .banner-header span{
       font-size:26px;
       text-align: center;
       display: block
     
}
    
    .menu ul li a {        
        padding: 10px 5px;
        font-size: 12px;
        
    }
    
    a.btn-whats-1 {
   
    width: 100%;
   
}
    
    .banner-header img{
        display: block;
        margin: 0 auto;
    }
    
    
}