<style>
  *{  padding:0;  margin:0;  box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box;  }
  *:before,*:after{  box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box;  } 
  *:focus { outline:0;  outline:none; }
  html,body{  padding:0;  margin:0;  font-family: "Kantumruy Pro", serif; font-optical-sizing: auto; font-size:16px;  color: #555;-webkit-user-select:none; -khtml-user-select:none; -moz-user-select:none; -ms-user-select:none; -o-user-select:none;  user-select:none;  box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; -webkit-tap-highlight-color:transparent;  scroll-behavior:smooth; overflow-x: hidden;}
  a { text-decoration: none; color: inherit; }  a:visited, a:hover, a:active { color: inherit; text-decoration: none;}
  .alinhamento{ display: block; position: relative; width: 100%; max-width: 1100px; margin: 0 auto;}
  
  .menu-container { display: flex; justify-content: flex-end; align-items: center; padding: 0; margin: -65px 0 0 0; position: relative; z-index:50;}
  .menu-toggle { background: none; border: none; cursor: pointer; position: absolute; top: 15px; right: 25px; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; z-index: 10; }
  .menu-icon { width: 30px; height: 25px; position: relative; }
  .menu-icon span { display: block; position: absolute; width: 100%; height: 3px; background: white; transition: 0.3s ease-in-out; }
  .menu-icon span:nth-child(1) { border-radius:2px;top: 0; }
  .menu-icon span:nth-child(2) { border-radius:2px;top: 10px; }
  .menu-icon span:nth-child(3) { border-radius:2px;top: 20px; }
  .menu-toggle.active .menu-icon span:nth-child(1) {transform: translateY(10px) rotate(45deg);        }
  .menu-toggle.active .menu-icon span:nth-child(2) {opacity: 0;        }
  .menu-toggle.active .menu-icon span:nth-child(3) {transform: translateY(-10px) rotate(-45deg);        }
  #menu {list-style: none;display: flex;justify-content: center; gap:10px; padding: 0;}
  #menu li {color: white;font-size: 18px;cursor: pointer; padding: 10px 12px;transition: 0.3s;}
  #menu li:hover {background-color: #97a482;border-radius: 5px; color:#000;}
  #menu img{ width:20px; height:20px; margin: 0px 0 -4px 0;}
  @media (max-width: 900px) {
    .menu-toggle { display: block;}
    #menu { flex-direction: column; align-items: left; display: none; width: 200px; position: absolute; top: 50px; right: 20px; background-color: #172b22; padding: 10px 0; border-radius: 8px;  box-shadow:2px 2px 26px -1px #858585; -webkit-box-shadow:2px 2px 26px -1px #858585; -moz-box-shadow:2px 2px 26px -1px #858585;}
    #menu li:hover {border-radius: 0px;}
    #menu.show {display: flex; }
  }
  @media (min-width: 901px) {
    .menu-toggle { display: none;}
  }

  #topoinicio{ position: relative;  display: block;  width: 100%; height: 600px;  margin: 0; padding: 0; background-color: #172b22; background-image:url(/web/images/bannertopo.jpg); background-size: 1600px; background-repeat: no-repeat; background-position: center; }
  #logohome{ display: block; position: relative; width:300px; padding: 50px 0 0 30px; cursor:pointer;}
  #logohome img{ width:300px; }
  #t1{ display: block;  margin: 260px 0 0 30px; font-size: 50px; font-weight:900; color:#FFFFFF; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; }
  #t2{ display: block;  margin: 0 0 0 30px; font-size: 45px; color:#FFFFFF; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box;}
  #t3{ display: block;  margin: 0 0 0 30px; font-size: 28px; font-weight:500; color:#FFFFFF; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box;}
  #cta1{ display: block; float:right; margin: 0 20px 0 0; padding: 10px 15px; background-color: #97a482; border-radius: 5px; color:#000; font-size: 18px;cursor: pointer; transition: 0.3s; }
  #cta1:hover{ background-color: #172b22; color:#dbdbb9; }

  #sobre{ position: relative;  display: block;  width: 100%; min-height: 200px;  margin: 0; padding: 0; background-color: #ffffff;       /* background-image:url(/web/images/bannertopo.jpg); */    background-size: center; background-repeat: no-repeat; background-position: center; }
  .esquerda{ display: block; position: relative; float: left; width: 50%; padding: 60px 20px; box-sizing: border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box;}
  #ch1{ display: block; position: relative; background-color: #3e5b49; padding: 20px; border-radius: 8px; color: #97a482; }
  .h1{ font-size: 22px;  padding: 9px 0 15px 0; color:#FFFFFF;}
  
  .vorticep{ display: block; float: right; width: 50px; animation:roda 10s linear infinite;}
  @-moz-keyframes roda { 100% { -moz-transform: rotate(360deg); } }
  @-webkit-keyframes roda { 100% { -webkit-transform: rotate(360deg); } }
  @keyframes roda { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
  
  .hline{ border-bottom: solid 3px #97a482;}
  .beauty{ display: block; position: relative; padding: 60px 20px 60px 20px;  font-size: 22px; font-weight: bold;}
  .beautyl{ border-bottom: solid 3px #97a482;}
  .beauty .num{ font-size: 40px;}
  
  .beauty .plus{ display: block; position:relative; float:right; z-index:5; width:75px; margin: -25px -10px 0 0; animation:roda2 80s linear infinite;}
  .beauty .pplus{ display: block; position:relative; float:right; z-index:15; width:50px; margin: -18px -70px 0 0; animation:roda3 30s linear infinite;}
  @-moz-keyframes roda2 { 100% { -moz-transform: rotate(-360deg); } }  @-webkit-keyframes roda2 { 100% { -webkit-transform: rotate(-360deg); } }  @keyframes roda2 { 100% { -webkit-transform: rotate(-360deg); transform:rotate(-360deg); } }
  @-moz-keyframes roda3 { 100% { -moz-transform: rotate(360deg); } }  @-webkit-keyframes roda3 { 100% { -webkit-transform: rotate(360deg); } }  @keyframes roda3 { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }

  #preta{ position: relative;  display: block;  width: 100%;  margin: 0; padding: 0; background-color: #000000; background-image:url(/web/images/bigvortice.jpg); background-repeat: no-repeat; background-position: center top;}
  .h2p{ font-size: 22px; margin:0; padding: 60px 0 0 10px; color:#FFFFFF; text-align: center;}
  .l{text-align: left; margin: 0 0 0 30px;}
  .paragrafo{  display: block; width:60%; color: #F0F0F0; padding: 40px; box-sizing: border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box;}

  #servicos{ position: relative;  display: block;  width: 100%; min-height: 600px;  margin: 0; padding: 0; background-color: #dbdbb9;    background-image:url(/web/images/vorticegrande.svg);    background-size: 800px; background-repeat: no-repeat; background-position: 100% 10%; background-attachment: fixed; }
  .centro{ display: block; position: relative; float: left; width: 100%; padding: 40px 20px; box-sizing: border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box;}
  .h2{ font-size: 22px; margin:0; padding: 40px 0 20px 10px; color:#3e5b49; text-align: center;}
  .hline2{ border-bottom: solid 3px #3e5b49;}
  h3{ font-size: 22px; border-bottom: solid 3px #3e5b49; margin:0; padding: 40px 0 15px 0; color:#3e5b49; text-align: center;}
  .iconservice{ display:block; height:70px; margin: 0 auto;}
  .sbox{ border-radius: 8px; font-size: 18px; height: 290px; padding: 20px;}
  .sbox:hover{ background-color: #FFFFFF; cursor:pointer;}
  .sbox span{ display: block; padding: 20px 20px 20px 40px; }

  #contato{ position: relative;  display: block;  width: 100%; margin: 0; padding: 0; background-color: #172b22;  }
  .bgContato{ height: 400px; background-image:url(/web/images/bgcontato.jpg); background-size: center; background-repeat: no-repeat; background-position: top right;}
  .h2c{ font-size: 22px; margin:0; padding: 60px 0 0 40px; color:#3e5b49; text-align: left;}
  .cardcontato{ display: block; position: relative; width:45%; background:#F0F0F0; margin: 30px 0 0 40px; padding:20px; border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; border-radius:8px; box-shadow:8px 8px 10px -10px #000000; -webkit-box-shadow:8px 8px 10px -10px #000000; -moz-box-shadow:8px 8px 10px -10px #000000; }
  .cardcontato a{ display: block; position: relative; height:50px; line-height: 50px; }
  .cardcontato img{height:20px; margin: 0px 0 -4px 0;}
  #rodape{ position: relative;  display: block;  width: 100%; height: 100px;  margin: 0; padding: 0; background-color: #FFFFFF;   }
  #logorodape{ display: block; position: relative;  float:left; width:300px; padding: 20px 30px; cursor:pointer;}
  #logorodape img{ width:200px; }
  #creditos{ display: block; position:relative; float:right; width:300px; font-size: 13px; padding: 20px 0 20px 0; text-align:center;}
  
  @media (max-width: 900px) {  /* tablet paisagem */
    #menu{ display: none;}
    .direita{ width: 100%; }
    .esquerda{ width: 100%;  padding: 20px 20px; }
    #preta{background-position: 60% top; }
    .cardcontato{ width:60%; }
  }
  @media (max-width: 650px) {  /* tablet vertical*/
    #logohome{ margin:0 0 0 -5px;} 
    #logohome img{ display:block; width:95%;    }
    .menu-container{ margin:-58px 0 0 0;}
    #topoinicio{ height: 500px; background-size: 1300px; background-position: -600px 0px; }
    #t1{ margin: 260px 0 0 0px; font-size: 30px; text-align:center; }
    #t2{ margin: 0 0 0 0px; font-size: 25px; text-align:center; }
    #t3{ margin: 0 0 0 0px; font-size: 18px; text-align:center; }
    #cta1{ float:none; width: 120px; margin: 30px auto;}
    #preta{background-position: 65% -15%; }
    .paragrafo{ width:100%; padding: 40px;}
    .h2p{padding: 170px 0 0 10px; color:#FFFFFF; text-align: left;}
    .cardcontato{ width:85%; font-size:15px;}
    .cardcontato img{height:18px; margin: 0px 0 -4px 0;}
    #logorodape{ width:100%; padding: 35px 0 0 0px; } 
    #logorodape img{ display:block; margin: 0 auto;   }
    #creditos{ width:100%; text-align: center;}
    #servicos{ background-attachment:scroll; background-size: 1000px; background-position: center; background-repeat: repeat-y;}
  }

  @media (max-width: 400px) {  /* celular*/
    #logohome{ padding: 55px 0 0 25px; } 
    #logohome img{ display:block; width:75%;    }
    .menu-container{ margin:-51px 0 0 0;}
    #topoinicio{ height: 500px; background-size: 1300px; background-position: -600px 0px; }
    #t1{ margin: 260px 0 0 0px; font-size: 26px; text-align:center; }
    #t2{ margin: 0 0 0 0px; font-size: 22px; text-align:center; }
    #t3{ margin: 0 0 0 0px; font-size: 16px; text-align:center; }
    #preta{background-position: 65% -15%; }
    .sbox{ font-size: 14px; height: 320px;}
    .cardcontato{ width:92%; margin: 30px 0 0 10px; font-size:13px;}
    .cardcontato img{height:14px; margin: 0px 0 -4px 0;}
    #creditos{ font-size: 12px;}
  }

.cbh{
    clear:both 
  }
</style>