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

body {	   
   font-size:16px;    
   font-weight:normal;
   line-height: 33px;  
   font-family: "Montserrat", sans-serif;
   font-weight: 300;
}

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

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

.box-page{
    margin: 0 0 40px 0;
    padding: 25px;
    
}

.videos{
    padding: 70px 0;
       background: #673ab7; /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #673ab7, #512da8); /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #673ab7, #512da8); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */   
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
}

.videos span{
    display: block;
    margin: 0 auto 40px 0;
    text-align: center;
    font-size: 36px;
    color: #fff;
}

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


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

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

p.titulo-page{
    font-size:24px;    
    margin: 0 0 20px 0;
    font-weight: 400;
}


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


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

.call-action{
    padding:70px 0;
    background: #06beb6;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #48b1bf, #06beb6);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #48b1bf, #06beb6); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */



    
}
.call-action p{
    font-weight:normal;
    text-align: center;
    font-size:36px;
     color: #fff;
    margin: 0 0 40px 0;
    line-height: 50px;
    font-weight: 300
    
}

a.btn-call{
    border-radius: 52px;
    padding: 15px 60px;
    display: table;
    margin:  0 auto;
    background: #128C7E;    
    color: #fff;
    text-decoration: none;
    font-weight: normal
}
a:hover.btn-call{
    opacity: 0.8;
     color: #fff;
}


.galeria{
    padding: 70px 0;
}

.galeria img{
    display: block;
    margin: 0 auto 40px;
    border-radius: 4px;
}



.footer-call-action{
    padding: 70px 0;
}

.footer-call-action span{
    display: block;
    margin: 0 auto 25px 0;
    font-size: 36px;
    color:#4C419A;
    line-height: 48px;
}

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


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

.page-header h1{
    text-align: center;
    color:#CECAAA;    
    margin: 0;    
    font-weight: lighter;
    font-size: 42px;
}

.page-header img{
    display: block;
    margin: 0 auto 15px;
}

.page-header h1.center{
    text-align: center;
}

/*--------------------------------------------------------------
#  Sidebar
--------------------------------------------------------------*/

span.sidebar-titulo{
    display: block;
    margin: 0 0 25px 0;
    font-weight:bold;
    font-size: 21px;
    text-align: center
}

ul.sidebar-menu{
    padding: 0;
    margin: 0 0 40px 0;
    
}
ul.sidebar-menu li{
    list-style: none; 
    display: block;
   
}
ul.sidebar-menu li a{
    display: block;
    color:#b67861; 
    padding: 12px 0;   
    border-radius: 52px;
    margin: 0 0 10px 0;
    text-decoration: none;
    text-align: center;
    background:#12163A;
}
ul.sidebar-menu li a:hover{
    opacity: 0.8;
}



/*--------------------------------------------------------------
# Layout
--------------------------------------------------------------*/



/*--------------------------------------------------------------
# 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:52px;
    text-align: center;  
    display: table;   
    font-weight:normal;      
}

a.btn-menu{background:none; color:#CECAAA}
a:hover.btn-menu{ opacity: 0.8; color:#CECAAA;   }

a.btn-whats{background:#128C7E;  color:#fff}
a:hover.btn-whats{ opacity: 0.8; color:#fff }


a.btn-footer{
    width: 21%;
    background:#128C7E;
    padding:10px 0;
    text-align: center;
    color: #fff;
    text-decoration: none;      
    position: fixed;
    right:2%;
    bottom:2%;
	border-radius: 52px; 	
}


a.btn-saibamais{
    padding:14px 100px;
    text-decoration:none;    
    text-align: center;  
    display: table;   
    margin: 25px auto;       
    color: #fff;
    background:#DA9963;  
   
}

a:hover.btn-saibamais{
    opacity: 0.8; 
    color: #DA9963;
}






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

.container-header{
     background: #4C419A url(images/bg.png) no-repeat center center;
}

.header{	
	padding:35px 0;    
}



.banner-header{    
    padding:25px 0;   
}

.banner-header h1{
   color:#fff;
    font-size: 21px;
    margin: 0 0 15px 0;
    font-weight:lighter;
}

.banner-header span{
    font-size:42px;
    display: block;
    color:#fff;
    text-align:left;
    line-height:65px;
    font-weight: lighter; 
    margin: 0 0 25px 0
    
}

a.btn-banner{
    padding: 15px 60px;
    background:#128C7E;
    display: table;
    margin: 0 0 25px 0;
    border-radius: 52px;
    text-decoration: none;
    font-weight: normal;
    color: #fff;
}
a:hover.btn-banner{
    opacity: 0.9;
    color: #fff;
}

.banner-header img{
   
}




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

.sobre{
    padding: 70px 0;
    background: #DA9963;
    margin:100px 0 350px 0;
    position: relative;
    
    
}
.foto-sobre{
    margin: -130px 0 0 0;
    position: relative;
    z-index: 1;
}

.box-flutuando{
    float: right;
    width: 45%;
    position: relative;
    z-index: 2;
    background: #F4F4F4;
    padding: 50px;
    margin: -150px 0 0 0;
    
}
.box-flutuando span{
    font-size: 36px;
    display: block;
    color:#545128;
    margin: 0 0 25px 0;
    line-height: 44px;
}
.box-flutuando span strong{
    font-style: italic
}

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

.titulos_prod{
     padding:25px 0;
}

.titulos_prod span{
    text-align: center;
    display: block;
    font-size: 36px;
    color:#545128;
    line-height: 44px;
   
}
.titulos_prod span strong{
    font-style: italic;
}


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

.prod{    
    padding: 70px 0;
    background: #333;
}

.prod span{
    text-align: center;
    display: block;
    font-size: 36px;
    color:#CECAAA;
    line-height: 44px;
    margin: 0 0 40px 0
}

.prod-container{
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;   
    
}
.destaque span strong{
    font-style: italic;
}

.box-p{
    padding:25px;
    margin: 0 15px 40px 0;  
    flex: 0 0 309px; 
    padding:25px;
      
}

.box-p span{
    font-size:21px;
    margin: 0 0 15px 0 !important;
    color:#CECAAA;
    text-align: left;
    display: block;
    line-height:38px !important;
}

.box-p span a{
    color:#CECAAA;
}
.box-p span a:hover{
    opacity: 0.8;
}


.box-p img{
    display: block;
    margin: 0 auto 25px;    
}
.box-p img:hover{
    opacity: 0.8;
    cursor: pointer
}
.box-p p{
    text-align:left;
    font-weight: 300;   
    color: #fff;
}




/* =  Copy 
-------------------------------------------------------------- */

.copy{
    padding:100px 0;
    background: #545128 url(images/background-1.jpg) no-repeat center center;
}

.copy span{
    text-align: center;
    display: block;
    font-size:36px;
    margin: 0 0 25px 0;
    color: #545128;   
    font-weight: bold;
    font-style: italic
}

.copy p{
    text-align: center;
    color: #545128;
    font-size: 21px;
   
}

a.btn-copy{
    padding:14px 35px;
    color: #fff;
    background:#545128;
    border-radius: 52px;
    text-align: center;
    text-decoration: none;
    margin: 25px auto;
    display: table;
}
a:hover.btn-copy{
    opacity: 0.8;  
    color: #fff;
}


/* ---------------------------------------------------
   destaques Box
--------------------------------------------------- */

.destaque{
    padding: 70px 0;
    background:#fff;
}

.destaque-container{
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;   
    
}
.destaque span{
    text-align: center;
    font-size: 36px;
    margin: 0 0 40px 0;
    display: block;
    color:#333; 
    line-height: 50px;
}
.destaque span strong{
    font-style: italic;
}

.box-dest{
    padding:25px;
    margin: 0 15px 40px 0;  
    flex: 0 0 309px; 
     background: #673ab7; /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #673ab7, #512da8); /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #673ab7, #512da8); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */   
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
   


}

.box-dest img{
    display: block;
    margin: 0 auto 15px;
}

.box-dest span{
    text-align: center;
    font-size:21px;
    margin: 0 0 15px 0 !important;
    display: block;
    color:#CECAAA; 
    line-height: 40px;
   
}

.box-dest p{
    color:#CECAAA;
    text-align: left;
    margin: 0;
    font-size:18px;
}

.box-dest a{
    color: #CECAAA;
}
.box-dest a:hover{
    opacity: 0.8;
    color: #CECAAA;    
}
.portfolio{
    padding: 70px 0;
}
.portfolio span{
    text-align: center;
    display: block;
    margin: 0 0 40px 0;
    font-size: 36px;    
}
.box-portfolio{
    margin: 0 0 40px 0;
    padding: 15px;
}
.box-portfolio img{
    display: block;
    margin: 0 auto 25px;
}

.box-portfolio p{
    text-align: center;
    font-size:18px;
}

/* = Comentários
-------------------------------------------------------------- */

.dp{
    padding: 70px 0;
}
.dp span{
    text-align: center;
    display: block;
    font-size:36px;
    margin: 0 0 40px 0;
    color: #333;
}

.box-dp{
    padding: 25px;
    margin: 0 0 40px 0;
}

.box-dp img{
    display: block;
    margin: 0 auto 15px;
}

.box-dp p{
    text-align: center;
}
.box-dp cite{
    text-align: center;
    font-style: italic;
    font-size: 13px;
    font-weight: normal;
    display: block
}

.dp p.center1{
    text-align: center !important;
    font-weight: normal
}

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

.footer{
    padding:20px 0;
    background: #4C419A;   
}

.box-footer{
    margin: 0 0 40px 0;
    padding: 25px;
}
.box-footer span{
    display: block;
    margin: 0 0 25px 0;
    color: #fff;
    font-size: 21px;
    text-align: center;
    font-weight: 300;
}

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

.box-footer p, .box-footer address{
    text-align: center;  
    font-style: normal;
    color: #fff;
      
}

.footer a{
    color: #fff;
}

.footer a:hover{
    color: #fff
}




/* ---------------------------------------------------
    Redes Sociais
--------------------------------------------------- */

.redes{
    padding: 25px 0;
    background: #4C419A
}
.redes p{
    text-align: center;    
    color: #fff;
}

.redes ul{
    display:table;
    margin: 0 auto;
}
.redes ul li{
    list-style: none;
    margin: 0 10px;
    float: left;
}

.redes ul li img{
    display: block;
    margin: 0 auto 15px;
}

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

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

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

.close {
  color:#fff;
  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:#fff;
}

.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;  
    background:#12163A;
   
}



/*  Menu dentro do Modal Header  */

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

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

ul.nav-header li a{
    display: block;
    padding:4px 20px;
    text-decoration: none;
    border-radius: 52px;
    border:2px solid #fff;
    margin: 0 0 5px 0;
    color: #fff;
    font-size: 12px;
}
ul.nav-header li a:hover{
    opacity: 0.8;
    color:#fff    
}
p.titulo-menu-modal{
    display: block;
    margin: 0 0 5px 0;   
    text-align: center;
    text-transform: uppercase;
    color: #fff;
    font-size: 12px;
}


/* = SELO
-------------------------------------------------------------- */

.selo{
    background: #000;
    padding: 25px 0;
}
.selo img{
    display: block;
    margin: 0 auto;
}


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

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

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

.credito{
    padding: 25px 0;
    background: #4C419A;
}
.credito p{
    text-align: center;
    font-size: 13px;
}
.credito a{
    color: #fff;    
}



.dest-sessao-1{
    padding:40px 0 100px;
    background: #333;
}
.dest-sessao-1 span{
    display: block;
    margin: 0 0 40px 0;
    color: #CECAAA;
    font-size: 36px;
    text-align: center;
    line-height: 50px;
}

/* = Slider
-------------------------------------------------------------- */

.box-slider{
    padding:0;
    width: 100%;
    background: #fff;
   
    
}
.box-slider span{
    display: block;
    margin: 0 0 25px 0;
    font-size:36px;
    color:#CECAAA;
    text-align: left;
    font-weight: normal;
}
.box-slider p{
    text-align: left;
}

@media only screen and (max-width: 720px) {
    
    
    
    .margin-menu{
        margin: 0 0 25px 0;
    }
    
    img.logotipo{
        margin: 0 auto 25px;
        display: block;
    }
    
   
    a.btn-footer{
        width:90%;        
        right:1%;
        bottom:1%;
        	
    }
    
    
    .box-p{
  
    margin: 0 0 40px 0;  
    flex: 0 0 84%; 
       
}
    
    .box-dest{   
    margin: 0 0 40px 0;  
    flex: 0 0 84%; 
    
}
    
    .box-slider{
        background: none;
        
    }
    
    .box-slider p{
      padding:10px;
      color:#CECAAA;
       
   
    
}
.box-slider span{
       font-size:26px;
       padding:0 10px 0 10px;
       margin: 0 0 5px 0
   
}

    
   
    }

@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 812px)
and (-webkit-device-pixel-ratio : 3) {
    
 


    
   
       .margin-menu{
        margin: 0 0 25px 0;
    }
    
    img.logotipo{
        margin: 0 auto 25px;
        display: block;
    }
    
   
    a.btn-footer{
        width:90%;        
        right:1%;
        bottom:1%;
        	
    }
    
    
    .box-p{
  
    margin: 0 0 40px 0;  
    flex: 0 0 84%; 
       
}
    
    .box-dest{   
    margin: 0 0 40px 0;  
    flex: 0 0 84%; 
    
}
    
    .box-slider{
        background: none;
        
    }
    
    .box-slider p{
      padding:10px;
      color:#CECAAA;
       
   
    
}
.box-slider span{
       font-size:26px;
       padding:0 10px 0 10px;
       margin: 0 0 5px 0
   
}
	
}