*{resize:none; box-sizing:border-box; outline:none; font-family: inherit;}

body{margin:0; padding:0; font-family: 'Arial', sans-serif; font-weight: normal;}

h1, h2, h3, h4, h5, h6{font-family: 'Oswald', sans-serif; font-weight: normal;}
p, ul, a{font-size: 13px;}
a{text-decoration: none; color: inherit;}

button, a, .util-qdd, .efeito-escuro, .prog{transition: all 300ms; -webkit-transition:all 300ms;}

.largura-site{width: 98%; max-width: 1200px; margin: 0 auto; position: relative; z-index: 2;}
.flex{display: flex; flex-wrap: wrap; justify-content: space-between;}

.topo { position:fixed; bottom:0; right:10px; z-index:9999; width:50px; height:50px; cursor:pointer; display:none; font:20px/50px 'FontAwesome'; color:#ffffff; background:#15BDA4; text-align:center; }

#topo{padding: 10px 0; align-items: center;}
.logo img { display: block; margin: 0 auto; width: 100%; max-width: 250px;}
.end-topo p {font-family: 'Oswald', sans-serif; color:#333333; font-weight: 300; text-align: right;}
.end-topo p i{color:#50B8BF; font-size: 20px; margin:0 15px;}
.end-topo p a:hover{color:#50B8BF;}

nav{width:100%;}
nav select{width: 98%; color: #333333; font:16px 'Oswald', sans-serif; font-weight: 300; padding: 25px 0; display: none; border: 0; border-radius: 3px; padding: 15px 5px;  margin: 10px auto; background: #f4f4f4;}

.menu{padding: 0; background: #f4f4f4; border-top: 4px solid #dddddd; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom: 4px solid #50B8BF;}
.menu li{list-style: none; text-align: center; flex-grow: 1;}
.menu li a{color: #333333; font:14px 'Oswald', sans-serif; font-weight: 400; display: block; padding: 25px 0;}
.menu li a:hover{background: #dddddd;}
.menu li:first-child a:hover{border-top-left-radius: 5px; }
.menu li:last-child a:hover{border-top-right-radius: 5px; }

#banner{padding: 50px 0; background: url(banner/banner01.jpg) center; background-size: cover;  display: flex; align-items: center; position: relative;}
#banner:before{position: absolute; content:""; width: 100%; height: 100%; background: rgba(0,0,0,.4); top:0; left: 0;}
#banner .largura-site{ display: flex; flex-direction: column;}
.setas{ display: flex; justify-content: center;}

.link-orcamento {background:#eee; color:#333; border-radius:20px; margin:30px auto 5px; padding:15px 20px; font:20px 'Oswald', sans-serif; font-weight: 400; text-align: center;}
.link-orcamento i.fa { margin-right: 10px;}

.proximo, .anterior{text-align:center; cursor:pointer; color:#ffffff; margin:0 10px; font:40px/40px 'FontAwesome';}
.proximo:hover, .anterior:hover{color:#15BDA4;}
.proximo:before{content:"\f0da"; }
.anterior:before{content:"\f0d9"; }

.frases{width: 100%; text-align: center; margin-top: 20px;}
.frases p{font: 40px 'Josefin Sans', sans-serif; font-weight: 600; color:#ffffff; text-shadow:2px 2px 2px #333333; width: 100%; margin: 0;}
.frases p small{font-size: 60%; font-weight: 400;}

.msystem form{width: 100%;}
.msystem input{width:calc(50% - 4px); border-radius: 3px; border: 1px solid #dddddd; padding:10px; color:#333333; margin:2px; font:14px 'Oswald', sans-serif; font-weight: 300;}
.msystem button{/*width:calc(50% / 3 - 4px);*/ background:#dddddd; color:#333333; cursor:pointer; border-radius:3px; margin:5px 2px; padding:15px 35px; font:14px 'Oswald', sans-serif; font-weight: 300; border:none;}
.msystem button:hover{background:#cccccc;}
.msystem button.adm{background:#50B8BF; color:#ffffff;}
.msystem button.adm:hover{background:#439AA0; }
.msystem button.adm:before{ font: 14px 'FontAwesome'; content:"\f13e"; margin-right:15px;}

.utilitarios{margin: 20px auto 40px;}
.util{width: 32%; align-items: flex-start; position: relative; text-align: center}
.util-qdd{width: 90%; margin: 0 auto; background: #f4f4f4; outline-offset: -8px; outline: 1px solid #cccccc; padding: 15px; position: relative; top:-50px; margin-bottom: -50px; min-height: 155px;}
.util-qdd h3{color:#15BDA4; font-weight: 400;}
.img-qdd{position: relative; overflow: hidden; max-height: 223px}
.efeito-escuro{width: 100%; height: 100%; position: absolute; background: rgba(0,0,0,.5); bottom: -100%; display: flex; justify-content: center; align-items: center;}
.efeito-escuro a{color:#ffffff; display: inline-block; width: 100px; line-height: 30px; border: 1px solid #ffffff;}
.efeito-escuro a:hover{background: #ffffff; color: #333333;}
.util:hover .efeito-escuro{bottom: 0;}

.conteudo{margin: 50px auto;}
.conteudo h2{font-weight: 400; color:#333333; text-transform: uppercase;}
.conteudo p{color:#333333; text-align: justify;}
.conteudo p a{color:#50B8BF;}
.conteudo p a:hover{ text-decoration: underline;}
/*.conteudo ul{color:#333333; list-style: none; padding: 0;}*/

.programacoes{background: #333333; padding: 80px 0;}
.prog{background: #ffffff; flex:1; text-align: center; display: flex; flex-wrap:wrap; margin: 10px; cursor: pointer;}
.prog:hover{background: #50B8BF;}
.prog:hover.prog h2{color: #ffffff;}

.prog-icone{background: #50B8BF; padding: 30px; margin-right: 15px; display: flex; align-items: center;}
.prog-icone i{color: #ffffff;}
.prog-desc{text-align: left; display: flex; align-items: center;}
.prog h2{color:#333333; font-weight: 400; margin: 0;}
.prog h2 span{display: block; font-size: 80%; font-weight: 300;}

.consultas-cont {margin: 50px auto;}
.consultas-cont h2 {width: 100%; color:#50B8BF; text-align: center; font-weight: 400; border-bottom: 1px dotted #dddddd; padding: 15px 0; text-transform: uppercase;}
.consultas{width: 24.5%; text-align: center;}
.consultas a{color: #333333; display: block; font:16px 'Oswald', sans-serif; font-weight: 300; padding: 15px 20px; text-align: right;}
.consultas a:nth-child(odd){background: #dddddd;}
.consultas a:nth-child(even){background: #eeeeee;}
.consultas a:before{content: "\f101"; font:20px 'FontAwesome'; float: left; color:#439AA0;}
.consultas a:hover{background: #333333; color:#ffffff;}

.txt-rodape{background: #333333; padding: 80px 0;}
.txt-rodape .largura-site{ align-items: center;}
.txt-rodape .frase{font: 30px 'Josefin Sans', sans-serif; font-weight: 600; color:#cccccc;}
.txt-rodape .redes{text-align: right;}

.txt-rodape .redes a{background: rgba(255,255,255,.1); text-align: center; color:#ffffff; font-size: 25px; padding: 15px 25px; }
.txt-rodape .redes a:hover{background: rgba(255,255,255,.3);}

.divformulario { font-family: sans-serif; }
.divformulario *:not(.fa) { font-family: inherit; }

#formcontato { width: 100%; }
#formcontato input, #formcontato textarea { width: 100%; resize: none; border-radius: 3px; border: 1px solid #dddddd; padding:10px; color:#333333; margin:2px; font:14px 'Oswald', sans-serif; font-weight: 300}
#formcontato input:focus, #formcontato textarea:focus { color: #333333; }
#formcontato button { width:150px; background:#dddddd; color:#333333; cursor:pointer; border-radius:3px; margin:10px 2px; padding:10px 5px; font:14px 'Oswald', sans-serif; font-weight: 300; border:none; }
#formcontato button:hover { background: #f5f5f5; }
#formcontato #loading { font-size: 12px; }

#result { padding: 15px; margin: 20px 0; display: none; border-radius: 3px; }
.error { color: #a94442; background-color: #f2dede; border: 2px solid #ebccd1; }
.success { color: #3c763d; background-color: #dff0d8; border: 2px solid #d6e9c6; }

.rodape{background: #222222; padding: 10px 0;}
.rodape h4{font-weight: 300; color:#cccccc; text-align: center;}

.servicos { display: flex; margin-bottom: 10px; padding: 20px;}
.servicos:nth-child(odd) { background: #f8f8f8;}
.servicos:nth-child(even) { background: #efefef;}
.img_servicos { display: block; width: 150px; height: auto; margin-right: 10px; border-radius: 5px;}
.servico_conteudo { display: none; overflow: hidden;}
.servico_titulo { cursor: pointer; color: #50B8BF !important;}


@media screen and (max-width:1023px){
    .logo{width: 100%; margin: 0 auto;}
    .end-topo{width: 100%;}
    .end-topo p {text-align: center;}
    .txt-rodape .frase{width: 100%; text-align: center;}
    .txt-rodape .redes{text-align: center; width: 100%; max-width: 290px; margin: 30px auto 0;}    
    .consultas{width: 49.5%;}
}

@media screen and (max-width:767px){
    nav select{display: block;}
    .menu li {display: none;}
    .menu{border:none;}
    
    .util{width: 80%; margin: 15px auto;}
    .prog{flex:1 100%;}
    .end-topo span{display: block;}
    
    .parceiros { text-align: center;}
}

@media screen and (max-width:599px){
    .img_servicos { width: 100px;}
}

@media screen and (max-width:479px){
    .prog-icone{width: 100%; margin: 0 auto; justify-content: center;}
    .prog-desc{width: 100%; justify-content: center; text-align: center; padding: 10px 0;}
    .consultas{width: 98%; margin: 0 auto;}
    .frases, .proximo, .anterior{display: none;}
    #banner{min-height: 250px;}
}