/*
** 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 { border-top: 4px solid #008000; }

header .logo { width: 15%; float: left; }
header .logo img { width: 100%; margin: 25px auto; }

header .slogan { width: 65%; float: left; }
header .slogan h3 { width: 70%; margin: 40px auto; font-size: 25px; }

header .info { width: 20%; float: right; }
header .info h4 { border-radius: 15px; font-size: 19px; margin: 35px auto 0 auto; float: right; padding: 5px 7px; background: #008000; color: #FFFFFF; display: table; }
header .info .icon { width: 25px; height: 25px; margin-bottom: -5px; }

header .menu { width: 100%; background: linear-gradient(to top, #C8C8C8, #FFFFFF); display: table; }
header .menu #menu ul { width: auto; margin: auto; list-style: none; display: table; }
header .menu #menu ul li { position: relative; float: left; display: table; }
header .menu #menu ul li a { border-radius: 5px; font-size: 14px; font-weight: 0; padding: 10px 5px; margin: 5px; color: #008000; display: block; }
header .menu #menu ul li:hover a { background: #008000; color: #FFFFFF; text-decoration: underline; }
header .menu #menu ul li .ativo { background: #008000; color: #FFFFFF; text-decoration: underline; }
/*** 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 ***/

.container_slider { position: relative; width: 100%; max-width: 1366px; margin: 0px auto; background: #333333; }
.container_slider ul { list-style: none; }

.slider { width: 100%; -webkit-animation: fading 2.5s infinite; animation: fading 2.5s infinite; }
.slider img { width: 100%; height: auto; }

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

.prev { position: absolute; top: 55%; left: 45px; transform: translate(25%,-150%); }
.next { position: absolute; top: 55%; right: 45px; transform: translate(-25%,-150%); }

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

.button_floating:hover { color: #008000; background: #FFFFFF; }
/*** slider ***/
/*** banner ***/
.banner { position: relative; width: 100%; max-width: 1366px; height: auto; margin: 0px auto; display: block; }
/*** banner ***/

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

/*** cases ***/
.cases img { width: 10%; float: left; }

/*** destaque ***/
.destaque { width: 29%; margin: 25px 2%; float: left; text-align: justify; }
.destaque img { width: 100%; }
.destaque h4 { margin: 15px 0; color: #008000; }
.destaque p { font-size: 16px; color: #333333; }
.destaque .link { font-size: 17px; }
/*** destaque ***/

/*** mais informações ***/
.mais_info { width: 90%; padding: 0px 5%; background: #008000; display: table; }
.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; }

.bt { font-weight: 600; float: right; margin: 30px 0px; padding: 15px; border: solid 4px #F3F3F3; color: #F3F3F3; }
.bt:hover { background: #F3F3F3; color: #008000; }
/*** mais informações ***/

/*** Contato ***/
.fone_contato { font-size: 20px; }

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

.contato input       { width: 97%; height:  35px; border: solid 1px #CCCCCC; display: block; margin: .5% 0px; padding: .5%; }
.contato textarea    { width: 97%; height: 150px; border: solid 1px #CCCCCC; display: block; margin: .5% 0px; padding: .5%; color: #008000; }

.contato input:focus       { border: #008000; }
.contato textarea:focus    { border: #008000; }

.contato #bt { width: 150px; float: right; margin: 1.5%; }
/*** Contato ***/
/*** Center ***/

/*** Footer ***/
footer { position: relative; background: #222222; }
footer p { color: #FFFFFF; font-size: 14px; }
footer a { color: #008000; }
/*** Footer ***/

/*** Responsive ***/
/* Tablet */
@media only screen and (max-width: 930px){
    * { font-weight: 600; }
    /*** header ***/
    header .logo    { width: 30%; }
    header .slogan  { width: 70%; }
    header .info    { width: 100%; }
    header .info h4 { float: none; margin: 25px auto; }
    /*** header ***/
    
    /*** center ***/

    /*** center ***/
}

/* Celular */
@media only screen and (max-width: 640px){
    /*** header ***/
    header .logo { width: 100%; }
    header .logo img { width: 80%; margin: 10%; }
    header .info { width: 100%; }
	header .slogan { width: 100%; float: left; }
    header .slogan h3 { width: 90%; margin: 40px auto; }
    /*** header ***/
    
    /*** center ***/
    /*** cases ***/
    .cases img { width: 33.333%; float: left; }

    .destaque { width: 98%; margin: 25px 1%; }
    
    .mais_info .cont_left, .mais_info .cont_right { width: 100%; }
    .mais_info .cont_left p { text-align: center; }
    .bt { float: none; display: inline-block; }
    /*** center ***/
    
    /*** footer ***/
    footer p { width: 100%; text-align: center; }
    /*** footer ***/
}
/*** Responsive ***/