* { margin: 0; padding: 0; box-sizing: border-box; font-family: 'Roboto'; text-decoration: none; letter-spacing: .06em; }

::-webkit-scrollbar-track{background-color:#f1f1f1;}::-webkit-scrollbar{width:1.2em; }::-webkit-scrollbar-thumb{background:#7c7c7c;}

#full {position: relative; width: 100%; left: 0; right: 0; margin: 0 auto; display: grid; grid-template-areas: "topo" "slid" "soluc" "clt"  "mtve" "orc" "roda"; }

.fullFULL {position:absolute; top:0; right:0; width: 0 !important; height: 0 !important; font-size: 1.7em; opacity: 0; overflow: hidden;}

.hide {margin-top: -5em;
  transition: all .2s; opacity: 0;
}

header {position: fixed; width: 100%; height: auto; left: 0; right: 0; margin: 0 auto; grid-area: topo; display: flex; z-index: 99999; background: #fff; place-items: center; padding: 1em; transition: all .3s; box-shadow: 0 0 .4em #979797;} 

#idt {position: relative; width: 110px; height: 45px; top: 0; left: 22%; background-image: url(../imgs/desentupidora-win-fulldynamic.webp); background-position: center; background-repeat: no-repeat; background-size: 100%; }

#menu {position: relative; width: auto; height: auto; top: 0; left: 11%;} #menu input[type="checkbox"] {position: absolute; display: none;}  

#menu a {position: relative; top: -.065em; left: 2%; font-size: 1em; margin: 0 .5em; color: #17A64F; font-weight: bold; width: auto; height: auto; padding: 1em 1em;  } #menu a:hover {background: #17A64F; color: #fff; text-align: center;}

#menu label {position:relative; width:auto; height:auto; font-size: 1em; color: #fff; font-weight: bold; background: #17A64F !important; cursor: pointer; transition: all .1s;
  background: none;  border: .2em solid #17A64F;
  box-sizing: border-box;
  padding: .5em 1em;
}

#menu label span {color: #fff;} #menu input:checked ~ label { padding-bottom: 1em; z-index: 100; color: #17A64F; background: #fff !important; } #menu input:checked ~ label span {color: #17A64F;}

#menu input {padding: .5em; margin-left: 3em; transform: translateY(-.5em); } .iconsINPUT {background: #fff; padding: .35em; position: absolute; margin-top: -.35em; margin-left: .1em; }

#exttSUBMENU {position: absolute; width: auto; height: auto; left: 0; top: 3em; transform: scale(0); display: grid;  background: #fff; padding: 2em 1em 1em 1em; transition: all .2s; display: grid; grid-template-areas: "subm1 subm2 subm3"; box-shadow: 0 0 .3em #b1b1b1; }

#exttSUBMENU a {width:14em; height: 7em; padding-top: 1em; text-align: center; margin:0 .5em .7em .5em; color: #010101; font-size: .9em; display: grid; place-items: center; border: .1em solid #b1b1b1; border-radius: .5em; }  #exttSUBMENU a:hover {box-shadow: 0 0 .3em #7c7c7c;} #exttSUBMENU a:hover span {transform: scale(1.1); margin-top: -11px;}

#submenu:checked ~ #exttSUBMENU {visibility: visible; transform: scale(1);}

#exttSUBMENU span {position:relative;text-align: center; font-size:1.6em;line-height:2em; color: #010101; opacity: .8; }

.titPADR {
  position: relative;
  width: 100%;
  left: 0;
  right: 0;
  margin: 1em auto 0 auto;
  padding: 2em 0;
  font-weight: 600;
  font-size: 1.8em;
  color: #020202;
  text-align: center;
  grid-area: titIVT;
}

#slid {position: relative; width: 100%; height: 93vh; top: 15px; left: 0; right: 0; margin: 0 auto; grid-area: slid; background-image: url(../imgs/capa-desentupidora-win.webp);  background-position: center; background-repeat: no-repeat; background-size: 100%;}

.titSLID {position:relative; width: 35%; height: auto; left: 10%; margin: 0; top: 27%; font-size: 1.8em; color: #020202;}

#slid p:nth-child(2) {position: relative; width: 50%; top: 22%; left: 10%;}

#slid p:nth-child(4) {position: relative; width: 35%; top: 30%; left: 10%; font-size: 1.3em;}

#slid a {position: relative; width: 40%; top: 40%; color: #fff; font-weight: bold; background: #17A64F; padding: 1em; left: 10%; font-size: 1.3em;}

#ivt {
  position: relative;
  width: 100%;
  height: auto;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;   
  grid-area: soluc;
  display: grid;
  background: #fff;
  grid-template-areas: "exttivt1 exttivt2";
  padding-bottom: 5em;
}

.anime {
transition: all 1s;
transform: translateX(-100%);
opacity: 0;
}

.anime-start {
transform: translateX(0);
opacity: 1;
}

#ivt .titPADR {
grid-area: titIVT;
}

#exttIVT {  
position: relative;
width: 60%;
height: auto;
left: 10%;
margin: 0;
padding: 0;
grid-area: exttivt1; 
display: grid;  
grid-gap: 3em;
grid-template-areas: "titIVT titIVT titIVT" "ivt1 ivt2 ivt3" "ivt4 ivt5 ivt6";
}

#exttIVT a {width:12em;height:100%;display: grid; place-content: center; place-items: center;}

.blocIVT {
position: relative; width: 12em; height: 12em; left: 0; right: 0; margin: 0;background: #fff; box-shadow: 0 0 .4em #838383; place-items: center; display: grid; place-content: center; transition: all .3s;}

.blocIVT:hover::after {animation: mudCOR .3s infinite ease-in running;}

.blocIVT::after {content: ''; position: absolute; width: 100%; height: 2%; top: 0; left: 0; background: linear-gradient(45deg, #33E376,#17A64F); animation: mudCOR 3s infinite paused; transition: all .2s;}

@keyframes mudCOR {
0%{background: linear-gradient(45deg, #33E376,#17A64F);}
100%{background-position: 13em;}
}

.blocIVT:hover p {position:relative; top:.5em; color: #2c2c2c;}  .blocIVT:hover span {top: -.4em; color: #2c2c2c;}

.blocIVT span {font-size: 2em; transition: all .2s; top: -.3em; position: relative; color: #464646;}

.titIVT {position:relative;width:99%;top:0;text-align:center;left:0;right:0;margin:0 auto;transition: all .3s;font-size: 1.1em; font-weight: 600; color: #3d3d3d;  }

.iconsIVT1 {background-image: url(../imgs/icons/teixeirao-fulldynamic-01.webp);} .iconsIVT2 {background-image: url(../imgs/icons/teixeirao-fulldynamic-02.webp);} .iconsIVT3 {background-image: url(../imgs/icons/teixeirao-fulldynamic-03.webp);} .iconsIVT4 {background-image: url(../imgs/icons/teixeirao-fulldynamic-04.webp);} .iconsIVT5 {background-image: url(../imgs/icons/teixeirao-fulldynamic-05.webp);} .iconsIVT6 {background-image: url(../imgs/icons/teixeirao-fulldynamic-06.webp);}


#allCLT {
position: relative;
width: 100%;
height: 100%;
top: 5em;
left: 0;
right: 0;
margin: 0 auto;
grid-area: exttivt2;
display: grid;
place-content: center;
place-items: center;
}

#allCLT .anime {
transform: scale(.1);
transition: all 1s;
}

#allCLT .anime-start {
transform: scale(1);
}

#allCLT p {
position: relative; color: #3d3d3d;
width: 100%; font-size: 1.1em; margin: 1em 0;
z-index:100;
font-weight: 600;
}

#allCLT p:nth-child(2) {
animation-delay: .13s;
}

#allCLT p:nth-child(3) {
animation-delay: .18s;
}

@keyframes btMenu{0%{background-position:-500%}100%{background-position:500%}}

#clt {
  position: relative;
  width: 100%;
  left: 0;
  right: 0;
  margin: 0 auto;
  grid-area: clt;
  background: #17A64F;
  padding-bottom: 6em;
}  

.blocCLT {
  position: relative;
  width: 100%;
  height: auto;
  left: -2%;
  right: 0;
  margin: 0 auto;
  padding: 1em 8em;
  display: grid;
  grid-template-areas: "titCLT titCLT titCLT titCLT titCLT" "imgclt1 imgclt2 imgclt3 imgclt4 imgclt5" "imgclt6 imgclt7 imgclt8 imgclt9 imgclt10";
}

.titCLT {  position: relative;
  width: auto; font-size: 1.7em; font-weight: 600; color: #fff;
  height: auto;
  left: 0;
  right: 0;
  margin: 0;
  padding: 1em;grid-area: titCLT; 
 }

 .iconsCLT {position: absolute;top: 1em;left: -.5em; width:25px; height:25px; background-position: center; background-repeat: no-repeat; background-size: contain;}

.imgsCLT {
  position: relative;
  width: 13em;
  height: 13em;
  top: 0;
  left: 0;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  border: .01em solid #d3d3d3;
  box-shadow: 0 0 .2em #d3d3d3;
  margin: .3em 0;
  cursor: pointer;
  transition: all .2s;
}

.desCLT1 {background-image: url(../imgs/clt/win-desentupidora-fulldynamic-01.webp);}
.desCLT2 {background-image: url(../imgs/clt/win-desentupidora-fulldynamic-02.webp);}
.desCLT3 {background-image: url(../imgs/clt/win-desentupidora-fulldynamic-03.webp);}
.desCLT4 {background-image: url(../imgs/clt/win-desentupidora-fulldynamic-04.webp);}
.desCLT5 {background-image: url(../imgs/clt/win-desentupidora-fulldynamic-05.webp);}
.desCLT6 {background-image: url(../imgs/clt/win-desentupidora-fulldynamic-06.webp);}
.desCLT7 {background-image: url(../imgs/clt/win-desentupidora-fulldynamic-07.webp);}
.desCLT8 {background-image: url(../imgs/clt/win-desentupidora-fulldynamic-08.webp);}
.desCLT9 {background-image: url(../imgs/clt/win-desentupidora-fulldynamic-09.webp);}
.desCLT10 {background-image: url(../imgs/clt/win-desentupidora-fulldynamic-10.webp);}


.imgsCLT:hover {transform: scale(1.3);z-index: 100;}

#mtvE {
  position: relative;
  width: 100%;
  height: auto;
  left: 0;
  right: 0;
  padding: 1em 1em 3em 1em;
  margin: 0 auto;
  grid-area: mtve;
  border: 0.1em solid #e6e6e6;
}

#mtvE h5 { 
  position: relative;
  width: 100%;
  height: auto;
  left: 0;
  right: 0;
  padding: 1em;
  margin: 0 auto;
  font-size: 1.8em;
  text-align: center;
}

#mtvE section {
  position: relative;
  width: 80%;
  height: auto;
  left: 0;
  right: 0;
  padding: 1em;
  margin: 0 auto;
}

.mtvs {
  position: relative;
  width: 100%;
  height: auto;
  left: 0;
  right: 0;
  padding: 3em 1em;
  margin: 2em auto;
  background: #e6e6e6;
  display: flex; place-items: center;
}

.circMTVE {
  position: relative;
  width: 6em;
  height: 6em;
  border-radius: 2em;
  top: 4%;
  left: -5%;
  padding: 1em;
  background: #17A64F;
}

.iconMTVS {
  position: absolute;
  width: auto;
  height: auto;
  top: .3em;
  left: 0;
  right: 0;
  margin: 0 auto;
  text-align: center;
  color: #fff;
  font-size: 3em;
}

.txtMTVE {
  position: relative;
  width: 85%;
  height: auto;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  padding: 0;
  font-size: 1.5em;
}

#orc {position: relative; width: 100%; height: 10vh; padding: 3em; left: 0; right: 0; margin: 0 auto; grid-area: orc; background: #17A64F; font-size: 1.6em; text-align: center; place-content: center; display: grid;} #orc a {color: #fff; padding: 2em; font-weight: bold;}

footer {
  position: relative;
  width: 100%;
  height: auto;
  left: 0;
  right: 0;
  margin: 4em auto 0 auto;
  grid-area: roda;
  background: #FFF;  
  display: grid; text-transform: uppercase;
  place-content: center; box-shadow: 0 0 .6em #b1b1b1; padding-top: 1.5em;
  grid-template-areas: "cursDFT linkFT cursGFT midFT" "dirFT dirFT dirFT dirFT";
                       z-index: 2;
} 

.titFT {
  position: relative;
  width: 100%;
  left: 0;
  right: 0;
  margin: 0 auto;
  font-size: 1em;
  padding: 1em 0 3em 0; font-weight: 700; opacity: 1;
}

footer a {font-size: .8em; line-height: 2em; color: #010101;} footer a:hover::before {width: 11%;} 

footer a::before {content: ""; position: absolute; width: 0; height: 1%; background: #17A64F;margin-top: 1.5em; transition: all .2s;}

#curDES {position: relative; width: 100%; height: 100%; margin: 0 1em; grid-area: cursDFT; display: grid; place-content: center;}


#idtFT {position:relative; top: -1em; left: -5em; width:325px;height:170px; background-image: url(../imgs/desentupidora-win-fulldynamic-01.webp); background-position: center; background-repeat: no-repeat; background-size: 70%;}

#curGR {
  position: relative;
  width: 20vw;
  height: auto;
  grid-area: cursGFT;
  margin-bottom: 3em; 
}

#linkFT {
  position: relative;
  width: 20vw;
  height: 100%;
  grid-area: linkFT; 
}

#linkFT section p {font-size: .8em; padding-right: 6em;}

#midFT {
  position: relative;
  width: 20vw;
  height: 100%;
  grid-area: midFT; 
  margin: 0 auto;
}

#rdsFT {
  display: flex;
  grid-area: rdsFT;
}

#rdsFT section {position: absolute; margin-top: 15%;}

#rdsFT a {font-size: 1.4em; margin: 0 .3em; opacity: .8;}

#emaiFT {position:absolute; bottom: 20%; grid-area: emaiFT; display: grid; line-height: 1.5em;} #emaiFT span{color: #010101; opacity: .8;}

.icon-mail-alt {margin-right: .5em;}

#FULLRDP {
  position: absolute;
  width: 30px;
  height: 26px;
  top: 22%;
  right: 1%;
  background-image: url(../imgs/fulldynamic-agencia-digital.webp);
}

#dirFT {
  position: relative;
  width: 100%;
  height: 4em;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  text-align: center;
  font-size: .7em;
  line-height: 1em;  z-index: 2;
  grid-area: dirFT;
  line-height: 4em;
  border-top: .1em solid #c9c9c9;
}

@media screen and (max-width:990px) {
  #slid {margin-top: 12em !important;}
}

@media screen and (max-width:1030px) and (max-height:670px) {
  * {font-size: .98em;} 
}

@media screen and (max-width:1100px) and (min-height:1000px) {
* {font-size: 1.04em;} #slid {height: 95vh; background-size: cover;} #exttIVT { grid-template-areas: "titIVT titIVT" "ivt1 ivt2" "ivt3 ivt4" "ivt5 ivt6";} #allCLT {margin-right: 5em;}  .blocCLT { 
  grid-template-areas: "titCLT titCLT titCLT" "imgclt1 imgclt2 imgclt3" "imgclt4 imgclt5 imgclt6" "imgclt7 imgclt8 imgclt9" !important; padding: .5em 2em;} footer {
  grid-template-areas: "cursDFT" "linkFT" "cursGFT" "midFT" "dirFT";
} 

footer a {font-size: .8em; line-height: 2em; color: #010101;} footer a:hover::before {width: 11%;} 

footer a::before {content: ""; position: absolute; width: 0; height: 1%; background: #17A64F;margin-top: 1.5em; transition: all .2s;}

#curDES {left: 0; right: 0; margin: 0 auto;}


#idtFT {left: 0; right: 0; margin: 0 auto;}

#curGR {
  position: relative;
  width: 95%;
  height: auto;
  left: 0; right: 0; margin: 2em auto; 
}

#linkFT {
  position: relative;
  width: 95%;left: 0; right: 0; margin: 0 auto;  
}

#linkFT section p {font-size: 1em; padding-right: 1em;}

#midFT {
  position: relative;
  width: 95%;left: 0; right: 0; margin: 0 auto 5em auto; 
}

#rdsFT {
  display: flex;
  grid-area: rdsFT;
}

#rdsFT a {font-size: 1.4em; margin: 0 .3em; opacity: .8;}

#emaiFT {position:absolute; bottom: 25%; grid-area: emaiFT; display: grid; line-height: 1.5em;} #emaiFT span{color: #010101; opacity: .8;}

.icon-mail-alt {margin-right: .5em;}

#FULLRDP {
  position: absolute;
  width: 30px;
  height: 26px;
  top: 22%;
  right: 1%;
  background-image: url(../imgs/fulldynamic-agencia-digital.webp);
}

#dirFT {
  position: relative;
  width: 100%;
  height: 4em;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  text-align: center;
  font-size: .7em;
  line-height: 1em;  z-index: 2;
  grid-area: dirFT;
  line-height: 4em;
  border-top: .1em solid #c9c9c9;
}
}

@media screen and (max-width:1280px) {
  #slid,#ivt {margin-top: -4em;}
}

@media screen and (max-width:1300px) {
  .blocCLT { padding: 0 5em;} 
}

@media screen and (max-width:1300px) and (min-height:1000px) {
  #slid,#ivt {margin-top: -8em;}
}

@media screen and (min-width:1400px) and (min-height:900px) {
  #slid {margin-top: -2.5em;} #ivt {margin-top: -4em;}
}

@media screen and (min-width:1900px) {
  * {font-size: 1.06em;}
}

@media screen and (min-width:2500px) {
  * {font-size: 1.1em;} #exttIVT {grid-gap: 1.5em 3em;} .imgsCLT {width: 14.5em;}
}

@media screen and (min-width:300px) and (max-width:990px) {

  header {display: grid; place-content: center; } 

#idt {left: 0; right: 0; margin: 1em auto;}

#menu {left: 0; right: 0; margin: 1em auto; display: grid; grid-template-areas: "btmen1 btmen2 btmen3"; place-items: center;} 

#menu a {margin: .3em;}

#exttSUBMENU {position: absolute; width: 95%; height: auto; left: 0; right: 0; margin: 0 auto; top: 3em; display: grid; grid-template-areas: "subm1 subm2" "subm3 subm4"; }

#exttSUBMENU a {width:95%; height: 7em; margin: .3em 0;}
  
#slid {position: relative; width: 100%; height: auto; margin-top: 47%; padding: 3em 0 7em 0; background-size: cover; display: grid;}

.titSLID {position:relative; width: 90%; height: auto; left: 0; right: 0; margin: 0 auto; top: 13%; padding: .5em 1em; background: rgba(255, 255, 255, 0.87); font-size: 1.8em; color: #020202;}

#slid p:nth-child(1) {position: relative; width: 95%; top: 10%; left: 0;  background: rgba(255, 255, 255, 0.87); right: 0; margin: 0 auto; text-align: center;}

#slid p:nth-child(4) {position: relative; width: 90%; top: 15%; left: 0;  background: rgba(255, 255, 255, 0.87); padding: .5em; right: 0; margin: .8em auto 2em auto; font-size: 1.3em;}

#slid a {position: relative; width: 95%; top: 25%; left: 0; right: 0; margin: 0 auto; font-size: 1.3em; text-align: center;}

#ivt {
  grid-template-areas: "exttivt1" "exttivt2";
  padding-bottom: 10em;  
}

#exttIVT {  
position: relative;
width: 95%;
height: auto;
left: 0;
right: 0;
margin: 0 auto;
padding: 0;
grid-area: exttivt1;  place-items: center;
display: grid;  
grid-gap: 0;
grid-template-areas: "titIVT titIVT" "ivt1 ivt2" "ivt3 ivt4" "ivt5 ivt6";
}

#exttIVT a {width:95%; height:100%;display: grid; place-content: center; place-items: center;}

.blocIVT {
position: relative; width: 46vw; height: 12em}

.blocCLT {
  position: relative;
  width: 95%;
  height: auto;
  left: 0;
  right: 0;
  margin: 0 auto;
  padding: 1em 0; 
  display: grid;
  grid-template-areas: "titCLT" "imgclt1" "imgclt2" "imgclt3" "imgclt4" "imgclt5" "imgclt6" "imgclt7" "imgclt8" "imgclt9" "imgclt10";
}

#clt .titPADR {width: 90%;}

.titCLT { width: 90%; left: 0; right: 0; margin: 0 auto;
 }

.imgsCLT {
  position: relative;
  width: 100%;
  height: 18em;
  top: 0;
  left: 0;
  right: 0;
  margin: .3em auto;
}

#mtvE {
  position: relative;
  width: 100%;
  height: auto;
  left: 0;
  right: 0;
  padding: 1em 0;
  margin: 0 auto;
  grid-area: mtve; 
  border: 0.1em solid #e6e6e6;
}

#mtvE section {
  position: relative;
  width: 95%;
  height: auto;
  left: 0;
  right: 0;
  padding: .5em;
  margin: 0 auto;
}

.mtvs {
  position: relative;
  width: 100%;
  height: auto;
  left: 0;
  right: 0;
  padding: 1em 0 2em 0;
  margin: 1em auto;
  background: #e6e6e6;
  display: grid; place-items: center;
}

.circMTVE {
  position: relative;
  width: 30%;
  height: 6em;
  border-radius: 2em;
  top: 0;
  left: 0;
  right: 0;
  margin: 1em auto 2em auto;
}

.txtMTVE {
  position: relative;
  width: 90%;
}

#orc { padding: 3em 0;}

footer {
  grid-template-areas: "cursDFT" "linkFT" "cursGFT" "midFT" "dirFT";
} 

footer a {font-size: .8em; line-height: 2em; color: #010101;} footer a:hover::before {width: 11%;} 

footer a::before {content: ""; position: absolute; width: 0; height: 1%; background: #17A64F;margin-top: 1.5em; transition: all .2s;}

#curDES {left: 0; right: 0; margin: 0 auto;}


#idtFT {left: 0; right: 0; margin: 0 auto;}

#curGR {
  position: relative;
  width: 95%;
  height: auto;
  left: 0; right: 0; margin: 2em auto; 
}

#linkFT {
  position: relative;
  width: 95%;left: 0; right: 0; margin: 0 auto;  
}

#linkFT section p {font-size: 1em; padding-right: 1em;}

#midFT {
  position: relative;
  width: 95%;left: 0; right: 0; margin: 0 auto 5em auto; 
}

#rdsFT {
  display: flex;
  grid-area: rdsFT;
}

#rdsFT a {font-size: 1.4em; margin: 0 .3em; opacity: .8;}

#emaiFT {display: none;} #emaiFT span{color: #010101; opacity: .8;}

.icon-mail-alt {margin-right: .5em;}

#dirFT {
  position: relative;
  width: 100%;
  height: 4em;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto; padding-bottom: 7rem;
  text-align: center;
  font-size: .7em;
  line-height: 1em;  z-index: 2;
  grid-area: dirFT;
  line-height: 4em;
  border-top: .1em solid #c9c9c9;
}

#FULLRDP {
  position: relative; width: 2.5rem; height: 2.5rem; 
  display: block; margin: 0 auto; 
  background-position: center; background-repeat: no-repeat; background-size: contain;
  background-image: url(../imgs/fulldynamic-agencia-digital.webp);}
}

@media screen and (min-width:400px) and (max-width:900px) {
   *{font-size: 1.03em;} #exttSUBMENU {top: 3.5em;}
}

@media screen and (min-width:700px) and (max-width:900px) {
  * {font-size: 1.08em;} #slid {height: 90vh;}
}

@media screen and (min-width:600px) and (max-width:900px) {
  #slid {
    margin-top: 12em;
  }
}

@media screen and (min-width:800px) and (max-width:900px) {
  #slid {margin-top: 12em;} #slid {display: grid; place-content: center;}
}