/*
** Desenvolvido por Agencia Mxmais. 
** http://www.mxmais.com.br 
*/

@charset "UTF-8";

/*** Corpo do Site ***/
header, center, footer { width: 100%; max-width: 1366px; margin: 0px auto; display: table; }
/*** Corpo do Site ***/

/*** Header ***/
header { background: url(../_img/bg-header.jpg) center top; background-size: 100%; border-top: solid 5px #2C2A2B; }

header .logo { width: 20%; float: left; }
header .logo img { width: 100%; margin: 10px 0; }

header .info { width: 30%; float: right; }
header .info p { width: auto; font-weight: 500; margin: 40px auto; font-size:17px; text-align: left; display: table; text-shadow:1px 1px 2px #000000; }
header .info a { color: #000000; }

header .menu { width: 100%; background: url(../_img/bg-menu.jpg) center no-repeat #2C2A2B; background-size: 100%; display: table; }
header .menu ul { width: auto; margin: auto; list-style: none; display: table; }
header .menu ul li { position: relative; float: left; display: table; padding: 8px 10px; }
header .menu ul li a { font-size: 14px; font-weight: 600; padding: 8px 10px; color: #FFFFFF; display: block; border-radius:6px; }
header .menu ul li:hover a { color: #FFFF00; background: #4A454B; box-shadow:1px 1px 2px #000000; }
.sobre a { background: #4A454B; padding: 8px 10px; border-radius:6px; color: #FFFF00; box-shadow:1px 1px 2px #000000;}
/*** Header ***/
/*** Slider ***/
/*** keyframes ***/
@-webkit-keyframes fading { 
    0% { opacity: 0; }
    10% { opacity: 1; }
    90% { opacity: 1; }
    100% { opacity: 0; }
}

@keyframes fading { 
    0% { opacity: 0; }
    10% { opacity: 1; }
    90% { opacity: 1; }
    100% { opacity: 0; }
}
/*** keyframes ***/

.whatsapp1 { width: 30%; margin: 50px auto; display: table; }
.whatsapp1 img { width: 100%; border-radius: 100px; }

/* Whatsapp */
.whatsapp-p { 
    position: fixed; width: 76px; height: 76px; margin: 0; padding: 0px; 
    right: 30px; bottom: 30px; display: table; z-index: 10000;
    box-shadow: 0 0 0 0px rgba(40,135,106,1); background: #fff; border-radius: 100%;
    animation: pulse 1s; animation-iteration-count: infinite;
}
.whatsapp-p img { width: 60%; padding: 20%; z-index: 100; }
/* Whatsapp */
/* Keyframe Whatsapp*/
@keyframes pulse {
    from { box-shadow: 0 0 0 0px rgba(40,135,106,1); }
    to { box-shadow: 0 0 0 45px rgba(40,135,106,0); }
}

/* Keyframe Whatsapp*/

.container_slider { position: relative; width: 95%; height:auto; max-width: 1920px; margin: 0px auto; }
.container_slider ul { list-style: none; }

.slider { width: 100%; -webkit-animation: fading 20s infinite; animation: fading 20s infinite; }
.slider img { width: 100%; height: 450px; border-radius: 16px; margin:5px 0px 0px 0px; }

.curva { position: absolute; width: 100%; left: 0px; bottom: 0px; }

.caption { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); text-align: center; }
.caption h1, .caption h2, .caption a { text-align: left; color: #FFFFFF; }
.caption h1 { font-size: 32px; font-weight: 600; text-shadow: 3px 3px 3px #000000; }
.caption h2 { font-size: 19px; font-weight: 600; text-shadow: 1px 1px 1px #000000; }
.caption a { border: solid 2px #000; margin: 0px auto; font-size: 17px; color:#333; padding: 7px; background: #FFFF00; display: table; border-radius:5px; }
.caption a:hover { background: #FFFFFF; color: #FFFF00; }

.container_bullets { position: absolute; left: 50%; transform: translate(-50%,-150%); }
.bullets { display: inline-block; padding: 6px; text-align: center; border-radius: 50%; background: #CCCCCC; }
.bullets:hover { background: #FFFF00; cursor: pointer; }
.bullet_activated { background: #FFFF00; }

.prev { position: absolute; top: 50%; left: 45px; transform: translate(25%,-100%); border-radius:7px; }
.next { position: absolute; top: 50%; right: 45px; transform: translate(-25%,-100%); border-radius:7px; }

.button_floating { 
    font-size: 25px; 
    color: #FFFFFF; background: rgba(0, 0, 0, .5); 
    width: 40px; height: 40px; 
    line-height: 40px; 
    display: inline-block; 
    text-align: center; 
    overflow: hidden;
    cursor: pointer;
}

.button_floating:hover { color: #FFFF00; background: #FFFFFF; }
/*** Slider ***/
/*** banner ***/
.banner { width: 90%; max-width: 1366px; height: 230px; position: relative; margin:5px auto; display: table; border-radius:6px; }
/*** banner ***/

/*** Center ***/
center { }

.destaque { width: 24%; margin: .5%; float: left; text-align: left; }
.destaque:hover { opacity: .7; }
.destaque img { width: 100%; border-radius: 15px; }
.destaque h4 { margin: 10px 0; }

.servico { width: 100%; margin: 50px 0; display: table; }
.servico img { width: 20%; border-radius: 15px; float: left; margin: 10px 30px 10px 0; }
.servico h4 { text-align: left; }
.servico p { text-align: justify; }

#galeria {  }
#galeria a { position: relative; width: 11.5%; margin: .5%; display: block; float: left; }
#galeria img { width: 100%; border-radius: 15px; }

/*** mais informações ***/
.mais_info { width: 100%; max-width: 1366px; margin: auto; background: url(../_img/bg-header.jpg) center top; background-size: 100%; display: table; }
.mais_info section { margin: 0px auto; }
.mais_info .cont_left { width: 70%; margin: 30px 0px; float: left; } .mais_info p { font-size: 18px; color: #F3F3F3; text-align: left; }
.mais_info .cont_right { width: 30%; float: right; }
.mais_info .cont_left h5 { font-size: 16px; color: #2C2A2B; }


.bt { font-weight: 600; float: right; margin: 20px 0px; padding: 15px; border: solid 4px #2C2A2B; color: #2C2A2B; border-radius: 9px;}
.bt:hover { background: #2C2A2B; color: #FFFF00; }
/*** mais informações ***/

/*** Formulario de Contato ***/
iframe { width: 100%; height: 400px; border: 0; }

.contato { width: 100%; display: table; }

.contato label { width: 20%; height: 30px; margin: 5px 0; float: left; text-align: left; }

.contato input, .contato select, .contato textarea { width: 80%; margin: 5px 0; padding: 5px; border: solid 1px #A4A4A4; color: #A4A4A4; }
.contato input:hover, .contato select:hover, .contato textarea:hover { border: solid 1px #333333; color: #333333; }

.contato input       { height:  30px; }
.contato select      { height:  30px; }
.contato textarea    { height: 100px; }

.contato input:focus       { border: solid 1px #333333; color: #333333; }
.contato textarea:focus    { border: solid 1px #333333; color: #333333; }

#bt { width: auto; height: auto; padding: 10px; float: right;}

@media only screen and (max-width: 800px) {
    .contato label, .contato input, .contato select, .contato textarea { width: 50%; }
}

/*** Center ***/

/*** Footer ***/
footer { position: relative; background: #2C2A2B; }
footer p { color: #FFFF00; }
footer a { color: #FFFF00; }
/*** Footer ***/

/*** Responsive ***/
/* Tablet */
@media only screen and (max-width: 930px){
    /*** header ***/
    header .logo { width: 50%; }
    header .info { width: 50%; }
    /*** header ***/
    
    /*** slider ***/
    .caption h1 { font-size: 26px; }
    .caption h2 { font-size: 12px; }
    /*** slider ***/
        
    /*** center ***/

    /*** center ***/
}

/* Celular */
@media only screen and (max-width: 640px){
    /*** header ***/
    header .logo { width: 100%; }
    header .info { width: 100%; }
    header .menu { width: 100%; }
	.banner { height: 130px;}
    /*** header ***/
    
    /*** slider ***/
    .caption { display: none; }
    /*** slider ***/
    
	.whatsapp { display: table; }
    /*** center ***/
    .destaque { width: 49%; }
    
    .servico img { width: 50%; }
    
    .mais_info .cont_left { width: 100%; margin: 15px 0; }
    .mais_info .cont_right { width: 100%; margin: 15px 0; }
    /*** center ***/
}

@media only screen and (max-width: 450px){
    /*** Header ***/
    header .menu ul li { float: none; width: 100%; text-align: center; }
    /*** Header ***/
    
    /*** center ***/
    .destaque { width: 100%; margin: 0; }
    
    .servico img { width: 100%; margin: 10px 0 10px 0; }
    /*** center ***/
}
/*** Responsive ***/