body {
  margin: 0;
  font-family: 'Open Sans', sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  text-align: left;
  background-color: #fff;
}

ul{list-style-type: none; margin: 0px; padding: 0px;}
a{text-decoration: none;}

.container {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}


@media (min-width: 576px) {
  .container {
    max-width: 540px;
  }
}

@media (min-width: 768px) {
  .container {
    max-width: 720px;
  }
}

@media (min-width: 992px) {
  .container {
    max-width: 960px;
  }
}

@media (min-width: 1200px) {
  .container {
    max-width: 1140px;
  }
}


.fundo-topo{width: 100%; height: 120px; background-color: #003060;}
.logo{z-index: 50; width: 250px; height: auto; margin-top: 2%; float: left; position: absolute;}
.logo img{width: 280px; height: auto;}

.menu{position: relative; z-index: 20000; float: right; margin-top: 2.5%;}
.menu ul {padding-top: 15px;}
.menu ul li{float: left; margin-right: 30px; font-size: 22px;}
.menu ul li a{color: #FFFFFF; border-bottom: 1px solid transparent; transition: 0.3s; padding-bottom: 1px;}
.menu ul li a:hover{border-bottom: 1px solid #FFFFFF;}

.icon{display: none;}

.telefone{z-index: 10; position: absolute; width: 530px; left: 50%; margin-left: 50px; margin-top: 50px;}
.telefone p{color: #232323; font-size: 21px; font-weight: bold; padding: 0px; margin: 0px;}
.telefone a span{color: #232323;font-size: 37px; padding-top: 6px;}

.banner{width: 100%; background: #FFFFFF;}

.banner img{width: 100%; height: auto; margin: 0 auto; object-fit: fill;  z-index: 10; background: #FFFFFF;}
.banner-texto{z-index: 100; position: absolute; width: 100%;  background: rgb(0,0,0,0.15); color: #FFFFFF; font-size: 55px; font-weight: bold; font-family: 'Istok Web', sans-serif; text-align: center; line-height: 65px; top: 0px; padding-top: 50px; padding-bottom: 40px;}

.banner-button{width: 100%; position: absolute; top: 0px; text-align: center;}
.banner-button button{background: #00d630; border: none; color: #FFFFFF; font-size: 45px; border-radius: 5px; padding: 10px 40px 15px 40px; transition: 1s; cursor: pointer;}
.banner-button button:hover{background: #01b329;}

.banner-responsivo{display: none;}
.banner-responsivo img{width: 100%; height: auto; object-fit: fill;  z-index: 10; background: #FFFFFF;}

#nav {display: block; width: auto !important;padding: 0;height: 17px;z-index: 999;position: absolute;right: 0;margin-left: 110px;margin-right: 0px;padding-top: 560px;}
#nav a {display: block;float: left;width: 15px;text-align: center;height: 13px;text-decoration: none;font-size: 1.2em;padding-top: 3px;color: transparent;background: transparent; border-radius: 50%; box-shadow: 0 0 1px 1px #eeeeee;margin-right: 10px;}
#nav a.activeSlide {background: #00d630;color: transparent;}

.conheca-home{width: 100%; padding-top: 20px;}
.img-conheca-home{float: left; position: absolute; width: 45%; max-width: 648px;}
.img-conheca-home img{width: 100%; height: auto;}
.txt-conheca-home{width: 50%; float: right; padding-top: 50px;}
.txt-conheca-home h1{font-size: 40px; font-weight: bold; margin-bottom: 0px;}
.txt-conheca-home h3{font-size: 28px; font-weight: normal; line-height: 36px; margin-top: 0px;}
.txt-conheca-home p{font-size: 18px; font-weight: normal;}


.vantagens{width: 100%; height: 590px; background: #003060; position: relative; color: #FFFFFF; text-align: center;}
.vantagens h1{font-size: 45px; font-weight: bold; padding-top: 100px;  margin-bottom: 30px;}
.vantagens ul li{float: left; width: 25%; text-align: center; }
.vantagens ul li h2{font-size: 26px; line-height: 36px; font-weight: bold;padding-left: 13px; padding-right: 13px;}
.vantagens ul li p{font-size: 18px; line-height: 28px; font-weight: normal; padding-left: 13px; padding-right: 13px;}

.nossos-servicos{text-align: center;}
.nossos-servicos h1{color: #232323; font-size: 45px; font-weight: bold; padding-top: 85px;  margin-bottom: 45px;}
.nossos-servicos ul li{z-index: 10; width: 23%; margin-left: 2.6%; float: left; text-align: center; }
.nossos-servicos ul li a{cursor:  context-menu;}
.nossos-servicos ul li a img{width: 100%; height: auto; max-width: 270px; z-index: 10; transition: 0.3s }
.nossos-servicos ul li a h2{color: #232323; font-size: 26px; line-height: 36px;}

.desc{display: none; margin-top: -280px; color: #000; z-index: 100;}
.desc button{padding: 20px 40px; transition: 0.3s; cursor: pointer !important; background: transparent; border: 1px solid #FFFFFF; color: #FFFFFF; border-radius:15px; font-size: 18px;}
.desc button:hover{color: #232323; background: #FFFFFF; }

.nossos-servicos ul li:hover .desc{display: block; z-index: 100 !important}
.nossos-servicos ul li:hover img{filter: brightness(40%); z-index: -1 !important}

.map-container iframe{width: 100%; display: block; position: relative; margin-top: 100px;}
.map-container iframe.clicked{pointer-events: auto;}

.fundo-rodape{width: 100%; height: 300px; background: #003060; z-index: -1; color: #FFFFFF; padding-top: 50px;}
.fundo-rodape p{font-size: 22px; line-height: 32px; padding: 0px; margin: 0px;}

.rodape-1{float: left; width: 271px;}
.rodape-1 img {width: 200px; height: auto;}
.rodape-2{float: left; width: 365px; margin-left: 150px;}
.rodape-3{float: right; width: 265px;}
.rodape-3 a{color: #FFFFFF;}

.interna {width: 100%; background: #f7f7f7; height: auto; padding-top: 50px; padding-bottom: 50px; color: #707070; font-size: 16px}
.interna h1 {font-size: 40px; color: #404040; text-align: center; padding-top: 15px; padding-bottom: 25px; width: 100%; font-weight: bold; text-transform: uppercase;}
.interna a{color: #707070}
.interna a:hover{text-decoration: underline;}

.contato-fundo{width: 100%; background: #f7f7f7; height: 500px;}
.texto-contanto{width: 32%; margin-left: 8%; float: left; padding-top: 40px; text-align: left}
.texto-contanto h1{margin-bottom: 0px; font-weight: bold; color: #272727;  font-size: 38px; line-height: 48px; text-align: left}
.texto-contanto p{margin-bottom: 35px; color: #898989; font-size: 16px; line-height: 26px;}

.formulario-contato{width: 40%; float: left; margin-left: 5%; padding-top: 80px;}
.formulario-contato label{color: #898989 !important}
.contato-tema{width: 100%;}
.contato-tema button{width: 49%; margin-bottom: 20px;}

.campo-obrigatorio{float: none; margin-left: 5px; color: red; display: none;}

.btn-enviar-contato{width: 80%; margin: 0 auto; text-align: center;}
.bg-enviar-contato{cursor: pointer;  transition: all 0.3s linear; margin-top: 25px; width: 100%; padding-top: 15px; padding-bottom: 10px; background: #232323; color: #FFFFFF; text-transform: uppercase; font-size: 20px; font-weight:500;  border: none;}
.bg-enviar-contato:hover{background: #00d631; color: #FFFFFF;}

#msg-final{width: 80%; margin: 0 auto; display: none; transition: 2s; margin-top: 50px; border: 1px solid #272727; color: #73459b; text-align: center; font-size: 18px; border-radius: 15px; padding-top: 25px; padding-bottom: 20px;}
#msg-final h1{color: #272727; font-size: 36px; font-weight: bold; margin-bottom: 15px;}
#msg-final p{color: #272727; font-weight: 300; font-size: 16px; text-align: center; text-transform: none}
#msg-final a{color: #272727;}

.bg-modelo{color: #898989; background: #FFFFFF; border: 1px solid #dddddd;}
.bg-modelo:hover{background: #ffff00; color: #313131; border-color:#ffff00}
.active{background: #ffff00; color: #313131}
.active:hover{background: #ffff00; color: #313131}

.btn-voltar-topo{visibility: hidden; transition: all 0.5s ease-out; cursor: pointer; opacity: 0.5; position: fixed; z-index: 9999; right: 0px; margin-right: 50px; bottom: 0px; margin-bottom: 50px; border: 0px solid transparent; background: rgba(0,0,0,0.6); color: #FFFFFF; font-size: 24px; padding-top: 7px; padding-bottom: 5px; padding-left: 17px; padding-right: 17px;}
.btn-voltar-topo:hover{opacity: 1;}

.form-control {
  display: block;
  width: 100%;
  height: calc(1.5rem + 2px);
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  line-height: 1.5;
  color: #495057;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
form-control:focus {
  color: #495057;
  background-color: #fff;
  border-color: #80bdff;
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

textarea.form-control{
  height: calc(5.5rem + 2px);
}

.form-group {
  margin-bottom: 1rem;
}

.remove-margin {margin-left: 0px !important;}
.remove-margin-dir {margin-right: 0px !important;} 
input#control-nav {visibility: hidden; position: absolute; left: -9999px; opacity: 0;}

.fa {padding: 10px; text-align: center;  text-decoration: none; background: white;  color: #003060 !important; font-size: 20px;  width: 20px; margin: 5px 2px;  border-radius: 50%; }
.menu .fa {padding: 12px; width: 22px;}
.fa:hover {opacity: 0.9; text-decoration: none !important;}
.fa-whatsapp {background: #a4c639;color: white !important; font-size: 40px;  width: 40px;}

.btn-whatsapp {position:fixed; bottom: 20px; float: right; z-index: 9999; display: block; right: 0; margin-right: 20px}


@media screen and (min-width: 1900px) {
  .img-conheca-home{float: left; position: absolute; margin-left: 300px; margin-top: 140px; width: 45%; max-width: 648px;}
  #nav {margin-right: 15% !important;}
}

@media screen and (min-width: 1680px) {
  #nav {position: absolute; right: 0; margin-right: 10%; margin-left: 0px; margin-top: 60px; }
}

@media screen and (max-width: 1380px) {
  #nav {padding-top: 490px;}
  .banner-texto{font-size: 45px; line-height: 55px; padding-top: 30px; padding-bottom: 20px;}

}

@media screen and (max-width: 1200px) {
  #nav {padding-top: 400px;}

  .telefone{left: 40%; margin-left: 7%; margin-top: 50px;}
  .rodape-2{float: left; width: 365px; margin-left: 25px;}
}

@media screen and (max-width: 992px){
  .fundo-menu{display: none;}
  .menu{width: 10%;}
  .menu span{position: absolute; right: -525px; top: 100px; visibility: visible; color: #fff; font-size: 0.95em; font-weight: bold; text-transform:uppercase;}

  .menu ul{left: 0%; top: 0%; background: #003060; padding-top: 50px;}
  .menu ul li{margin-right: 0px; padding-bottom: 10px; padding-top: 15px; float: none; border-right: none; text-align: left;}
  .menu ul li a{padding-left: 25px; color: #f9fbfa;}
  .menu ul li a:hover{color: #ccc; border-bottom: 1px solid transparent;}
  .menu ul li span{visibility: hidden;}

  header .control-nav{float: right; margin-right: 10px; margin-top: 50px; display: block; width: 30px; padding: 5px 0; border: solid #fff; border-width: 4px 0; z-index: 20000; cursor: pointer;}
  header .control-nav:before{content: ""; display: block; height: 4px; background: #fff;}
  header .control-nav-close {position: fixed; right: 0; top: 0; bottom: 0; left: 0; display: block; z-index: 20000; background: rgba(245, 239, 239, 0.4); -webkit-transition: all 500ms ease;  transition: all 500ms ease; -webkit-transform: translate(100%, 0); -ms-transform: translate(100%, 0); transform: translate(100%, 0);} 
  header .menu nav {position: fixed; top: 0;  right: 0; bottom: 0; width: 210px; border-left: 1px solid #ccc; background: #003060; overflow-x: auto; z-index: 20000; -webkit-transition: all 500ms ease; transition: all 500ms ease; -webkit-transform: translate(100%, 0);  -ms-transform: translate(100%, 0); transform: translate(100%, 0);}
  #control-nav:checked ~ .control-nav-close {-webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0);}
  #control-nav:checked ~ nav {-webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0);}

  .telefone{display: none;}


  .banner img{width: 100%; height: 500px; object-fit: cover; object-position: center;}
  #nav {right: 0; margin-left: 0px; margin-right: 0px;padding-top: 460px;}
  #nav a{margin-left: 15px;}
  .banner-texto{font-size: 38px; line-height: 48px; padding-top: 50px; padding-bottom: 40px;}
  .banner-button button{font-size: 32px;  padding: 10px 40px 15px 40px;}

  .conheca-home{width: 100%; padding-top: 20px; padding-bottom: 20px;}
  .img-conheca-home{display: none; float: none; position: static; width: 100%; text-align: center;}
  .txt-conheca-home{width: 90%; float: none; padding-top: 20px;}
  .txt-conheca-home h1{font-size: 38px;}
  .txt-conheca-home h3{font-size: 20px; line-height: 30px;} 
  .txt-conheca-home p{font-size: 16px;}

  .vantagens h1{font-size: 38px; padding-top: 60px;}
  .vantagens ul li{float: left; width: 25%; text-align: center; }
  .vantagens ul li h2{font-size: 26px; line-height: 36px; font-weight: bold;padding-left: 13px; padding-right: 13px;}
  .vantagens ul li p{font-size: 18px; line-height: 28px; font-weight: normal; padding-left: 13px; padding-right: 13px;}

  .nossos-servicos h1{font-size: 38px; padding-top: 45px;}
  .nossos-servicos ul li{width: 24%; margin-left: 1.3%;}
  .nossos-servicos ul li a{cursor: pointer}
  .nossos-servicos ul li a h2{color: #232323; font-size: 20px; line-height: 30px;}

  .nossos-servicos ul li:hover .desc{display: none; z-index: 100 !important}
  .nossos-servicos ul li:hover img{filter: none; z-index: -1 !important}

  .map-container iframe{margin-top: 50px;}

  .fundo-rodape{height: 330px; text-align: center}
  .fundo-rodape p{font-size: 22px; line-height: 32px; padding: 0px; margin: 0px;}

  .rodape-1{float: none; width: 100%; text-align: center; margin-bottom: 20px;}
  .rodape-2{float: none; width: 100%; margin-left: 0px;margin-bottom: 20px;}
  .rodape-3{float: none; width: 100%;}
  .rodape-3 a{color: #FFFFFF;}

  .texto-contanto{width: 100%; margin-left: 0%; float: none; padding-top: 30px; text-align: center}

  .contato-fundo{height: 1300px;}
  .formulario-contato{width: 100%; margin-left: 0%; padding-top: 50px;}
  .contato-tema{width: 100%;}
  .contato-tema button{width: 49%;}
  .texto-contanto-comissoes{width: 100%; margin-left: 0%; float: none; padding-top: 50px;}
  .btn-enviar-contato{width: 100%;}
  #msg-final{width: 100%;}
}

@media screen and (max-width: 767px){
  .banner-texto{padding-top: 25px; padding-bottom: 15px;}
  .txt-conheca-home{width: 100%;}
  .vantagens{height: 1000px;}
  .vantagens h1{font-size: 38px; padding-top: 60px;}
  .vantagens ul li{float: left; width: 50%; margin-bottom: 50px; }

  .nossos-servicos h1{font-size: 38px; padding-top: 45px;}
  .nossos-servicos ul li{width: 45%; margin-left: 5%; margin-bottom: 15px;}
  .nossos-servicos ul li a h2{color: #232323; font-size: 20px; line-height: 30px;}
  .map-container iframe{margin-top: 50px;}

  .remove-margin {margin-left: 5% !important;}
  .fundo-rodape{height: 430px;}
}

@media screen and (max-width: 670px){
  .container{max-width: 90%;}
}


@media screen and (max-width: 480px){
  .banner-texto{font-size: 28px; line-height: 38px; padding-top: 30px; padding-bottom: 20px;}
  .banner-button button{font-size: 24px;}

  .banner img{width: 100%; height: 400px; object-fit: cover; object-position: center;}
  #nav {padding-top: 380px;}

  .conheca-home{padding-top: 0px;}
  .img-conheca-home{display: none; float: none; position: static; width: 100%; text-align: center;}
  .txt-conheca-home{width: 90%; float: none; padding-top: 20px;}
  .txt-conheca-home h1{font-size: 34px;}
  .txt-conheca-home h3{font-size: 20px; line-height: 30px;} 
  .txt-conheca-home p{font-size: 16px;}

  .vantagens{height: 1000px; margin-left: 0px; padding-left: 0px;}
  .vantagens h1{font-size: 38px; padding-top: 60px;}
  .vantagens ul li{float: left; width: 50%; margin-bottom: 50px; }

  .nossos-servicos h1{font-size: 38px; padding-top: 0px;}
  .nossos-servicos ul li{width: 40%; margin-left: 5%; margin-bottom: 35px;}
  .nossos-servicos ul li a h2{color: #232323; font-size: 19px; line-height: 30px;}
  .map-container iframe{margin-top: 50px;}

  .form-control {width: 90%;}

    .fundo-rodape{height: 500px;}
}

@media screen and (max-width: 440px){
  .banner-texto{font-size: 24px; line-height: 34px; padding-top: 25px; padding-bottom: 15px;}
  .banner-button button{font-size: 24px;}
  .logo{z-index: 50; width: 270px; height: 67px; margin-top: 25px; float: left; position: absolute;}
  .logo img{width: 100%; height: auto;}
  header .control-nav{margin-right: -5px;}
}

@media screen and (max-width: 376px){
  .banner-texto{font-size: 24px; line-height: 34px; padding-top: 30px; padding-bottom: 25px;}
  .banner-button button{font-size: 24px;}

  .conheca-home{padding-top: 30px;}
  .vantagens{height: 1850px; margin-left: 0px; padding-left: 0px;}
  .vantagens ul li{float: left; width: 100%; margin-bottom: 50px; }
  .nossos-servicos ul li{width: 90%; }

}

@media screen and (max-width: 360px){

}