* {box-sizing: border-box; margin: 0; padding: 0; text-decoration: none; font-family: 'Trebuchet MS'; transition: all .3s;}

a {color: #280b04; font-size: 1.3rem; transition: all .2s; padding: .3rem;} 

::-webkit-scrollbar-track{background-color:#f1f1f1}::-webkit-scrollbar{width:1.5em}::-webkit-scrollbar-thumb{background:#7c7c7c;}

.titPADR {position: relative; width: 90%;
  left: 0;
  right: 0;
  margin: 0 auto;
  font-weight: 600;
  font-size: 2rem;
  color: #521608;
  text-align: center;
}

.anime {
  transition: all 1s;
  transform: translateX(-100%);
  opacity: 0;
}

.anime-start {
  transform: translateX(0);
  opacity: 1;
}

#full {
    position: relative;
    width: 100%;
    left: 0;
    right: 0;
    margin: 0 auto;
}

.fullFULL {position:absolute; top:0; right:0; width: 0 !important; height: 0 !important; visibility: hidden; font-size: 1.7rem; opacity: 0; overflow: hidden;}

#topo {
    position: relative;
    width: 100%;
    height: auto;
    left: 0;
    right: 0;
    margin: 0 auto;
    grid-area: topo;    
    display: grid;
    align-items: center;
    grid-template-areas: "idtT contT" "menuT menuT";
}

#exttIDT {
    position: relative;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    margin: 0;
    grid-area: idtT;
    padding: 2rem 0;
}

#idt {  position: relative; top: -.5rem; left: 10%; display: block; 
    width: 264px; height: 67px;
  background-repeat: no-repeat;
  background-position: center; 
  background-size: contain;  background-image: url(../imgs/marca-teixeira-fulldynamic.webp);}

#contTOP {
    position: absolute;
    width: auto;
    height: auto;
    padding: .7rem; border-radius: 2rem;
    right: 10%;
    margin: 0;
    text-align: center;
    grid-area: contT;
    background: #fff; border: .1rem solid #BF3811;
} #contTOP:hover {border: .1rem solid #25D366; background: #25D366; color: #fff;} #contTOP a {font-size: 1.7rem; color: #2c2c2c;} #contTOP:hover a {color: #fff;}
  
  #menu {
    position: relative;
    width: 100%;
    height: 10vh;
    top: 0;
    background-color: #fff;
    grid-area: menuT;
    display: flex;
    justify-content: center;
    box-shadow: 0 0 .3em #280b04;
    z-index: 10;
  }
    
  .menu-item {
    display: inline-block;
    height: 100%;
    width: 150px;
    text-align: center;
    line-height: 10vh;
    transition: transform 0.4s ease-in-out;
    transform-style: preserve-3d;
    transform: rotateY(10deg);
    cursor: pointer;
    border-right: .01em solid #d3d3d3;  border-left: .01em solid #d3d3d3;
  }
  
  .face {
    position: absolute;
    margin: 0;
    left: 0;
    right: 0;
    width: 150px;
    height: 10vh;
    color: #BF3811;
    font-weight: 600;
    border-right: 1px solid rgba(0, 0, 0, 0.1);
  }
  
  .front {
    transform: translateZ(5vh);
    line-height: auto;
    color: #280b04;
    font-weight: bold; 
    font-size: 1rem;
  }
  
  .bottom {
    transform: translateY(5vh) rotateX(-90deg);
    background-color: #fff;
    font-size: 1.7rem;
  }

  .menu-item:hover {
    transform: rotateY(10deg) rotateX(90deg);
  }

#slid {
    position: relative;
    width: 100%;
    height: 70vh;
    top: 0;
    left: 0;
    right: 0;
    margin: 0 auto;   
    background: #BF3811; 
    display: grid;
    justify-content: center;
    align-items: center;
}

#exttSLID {position: relative; width: 70%; margin: -8rem auto 0 auto; display: grid; place-content: center;} #exttSLID .titPADR {color: #FFEDDE;}
#exttSLID a {position: relative; margin: 1rem auto; left: 0; right: 0; font-size: 1.3rem; background: #fff; padding: 1rem 3rem; border-radius: .3rem;} #exttSLID a:hover {background: #F6AA98;} #exttSLID span {font-size: 1.3rem; color: #2c2c2c;}

#slid::after {
    content: '';
    position: absolute;
    width: 33.3%;
    height: 25vh;
    bottom: 0;
    left: 0;
    margin: 0;
    background: #fff;
}

#slid::before {
    content: '';
    position: absolute;
    width: 33.3%;
    height: 25vh;
    bottom: 0;
    right: 0;
    margin: 0;
    background: #fff;
}

#blocSlid1 {
    position: absolute;
    width: 33.33vw;
    height: 25vh;
    bottom: 0;
    left: 0;
    z-index: 100;
    display: grid;
    justify-content: center;
    align-items: center;
    align-content: center;
}

#blocSlid2 {
    position: absolute;
    width: 33.33vw;
    height: 25vh;
    bottom: 0;
    right: 0;
    z-index: 100;
    display: grid;
    justify-content: center;
    align-items: center;
    align-content: center; 
}

#blocSlid2 p {
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    text-align: center;
    font-size: 1.1rem;
    color: #280b04;
    font-weight: 600;
}

#blocSlid1 p {
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    text-align: center;
    font-size: 1.1rem;
    color: #280b04;
    font-weight: 600;
}

.iconsSLID {
    position: relative;
    top: .5rem;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 3rem;
    height: 3rem;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.iconsSLID1 {
background-image: url(../imgs/icons/icon-teixeirao-fulldynamic-01.gif);
}

.iconsSLID2 {
    background-image: url(../imgs/icons/icon-teixeirao-fulldynamic-02.gif);
}

#ivt {
  position: relative;
  width: 100%;
  height: auto;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;   
  background: #fff;
  padding: 4rem 0;
}

#ivt::after {content: ''; position: absolute; width: 33.33%; height: 7rem; top: 0; left: 0; right: 0; margin: 0 auto; background: #BF3811; z-index: 0;}

#ivt .titPADR {position: relative; width: 50%; margin-top: -5rem; margin-bottom: 7rem; grid-area: titIVT; z-index: 1; color: #FFEDDE;}
.iconSetIvt {position: absolute; width: 4rem; height: 4rem; top: -1.2rem; left: 0; right: 0; margin: 0 auto; border-radius: 50%; background: #fff; z-index: 1; display: block; place-content: center; text-align: center; font-size: 1.7rem; color: #BF3811;}

#exttIVT {  
position: relative;
width: 90%; 
height: auto;
left: 0;
margin: 2rem auto;
padding: 0 5rem;
grid-area: exttivt1;
display: grid;   place-content: center;
grid-gap: 1rem;
grid-template-areas: "titIVT titIVT titIVT titIVT" "ivt1 ivt2 ivt3 ivt4";
}

.blocIVT {
position: relative; width: 14rem; height: 11.7rem; left: 0; right: 0; margin: 0; border: .14rem solid #d3d3d3; place-items: center; display: grid; place-content: center; transition: all .3s; border-radius: 1rem;
}

.blocIVT:hover {border: .1rem solid #BF3811; border-radius: 0rem;} .blocIVT:hover p {top:2.2rem; animation: nomServ .3s ease-in;}

@keyframes nomServ {
  0%{transform: rotate(7deg);}
  50%{transform: rotate(-7deg);}
  100%{transform: rotate(0);}
}

.blocIVT:hover span {width:40%;height:40%;} .blocIVT:hover .botIvt {background: transparent; font-size: 1.1rem;} .blocIVT:hover .botIvt::after {width: 100%; opacity: 1;}

.iconsIVT {position:absolute;width: 4rem;height: 4rem;top:0;left:0;right:0;margin:1rem auto;background-size: contain; background-position: center; background-repeat: no-repeat; transition: all .3s;} 

.titIVT {position:relative;width:100%;top:1.7rem;text-align:center;left:0;right:0;margin:0 auto;transition: all .3s;font-size: 1.4rem; font-weight: 600; color: #4f4f4f;}

.iconsIVT1 {background-image: url(../imgs/icons/teixeirao-fulldynamic-08.webp);} .iconsIVT2 {background-image: url(../imgs/icons/teixeirao-fulldynamic-02.webp);} 

.iconsIVT3 {background-image: url(../imgs/icons/teixeirao-01.png);} .iconsIVT4 {background-image: url(../imgs/icons/teixeirao-02.png);} .iconsIVT5 {background-image: url(../imgs/icons/teixeirao-03.png);} .iconsIVT6 {background-image: url(../imgs/icons/teixeirao-04.png);} .iconsIVT7 {background-image: url(../imgs/icons/teixeirao-05.png);} .iconsIVT8 {background-image: url(../imgs/icons/teixeirao-06.png);} .iconsIVT9 {background-image: url(../imgs/icons/teixeirao-07.png);} .iconsIVT10 {background-image: url(../imgs/icons/teixeirao-08.png);} .iconsIVT11 {background-image: url(../imgs/icons/teixeirao-09.png);} .iconsIVT12 {background-image: url(../imgs/icons/teixeirao-010.png);} .iconsIVT13 {background-image: url(../imgs/icons/teixeirao-011.png);} .iconsIVT14 {background-image: url(../imgs/icons/teixeirao-012.png);} .iconsIVT15 {background-image: url(../imgs/icons/teixeirao-01.png);} .iconsIVT16 {background-image: url(../imgs/icons/teixeirao-013.png);} .iconsIVT17 {background-image: url(../imgs/icons/teixeirao-014.png);} .iconsIVT18 {background-image: url(../imgs/icons/teixeirao-015.png);} 

.botIvt {position: relative; top: 3rem; left: 0; right: 0; margin: 0 auto; font-size: 1rem; color: #7c7c7c; padding: .4rem 1rem; border: .1rem solid transparent; border-radius: .7rem; background: #fff;} .botIvt::after {content: ''; position: absolute; width: 1%; height: 100%; top: 0; left: 0; border: .1rem solid #25D366; border-radius: 1rem; opacity: 0; transition: all .3s; z-index: -1;} .botIvt:hover {background: #25D366 !important; color: #fff; font-size: 1.1rem; border-radius: 1rem;} .botIvt:hover::after {border: inherit;}

#roda {
  position: relative;
  width: 100%;
  left: 0;
  right: 0;
  margin: 0 auto;
  grid-area: roda;
  display: grid;
  padding: 2rem 0 0 0;
  text-transform: uppercase;
  background: #fff;
  box-shadow: 0 0 .3rem #d3d3d3;
  grid-template-areas: "blocFT1 blocFT2 blocFT3 blocFT4" "dirFT dirFT dirFT dirFT";
} 

#contFT {position: relative; bottom: 0; right: 0; width: auto; padding: .7rem; border-radius: 2rem; font-size: 1.4rem !important; background: #25D366; color: #fff; text-align: center;} #contFT:hover {border: .1rem solid #BF3811; background: #fff; color: #7c7c7c;} #contFT span {font-size: 1.7rem;}

#roda a {font-size: 1rem;} #roda a:hover {color: #BF3811;}

.blocFT {
  position: relative;
  width: 20vw;
  height: auto;
  left: 0;
  right: 0;
  margin: 0 auto; grid-gap: .5rem;
  display: grid; place-content: center;
  padding: 2rem 0; 
}

#idtFT {
  position: relative;
  width: 265px;
  height: 62px; display: block;
  top: -.4rem;
  left: 0;
  margin: 0;
  background-image: url(../imgs/marca-teixeira-fulldynamic.webp);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 90%;
}

#dirFULL {
  position: relative;
  width: 100%;
  left: 0;
  right: 0;
  margin: 0 auto;
  padding: 1.5rem 0;
  font-size: .8rem;
  text-align: center;
  grid-area: dirFT;
  color: #2c2c2c;
  border-top: .1rem solid #d3d3d3;
}

#idtFULL {
  position:absolute;width:2.4rem;height:2.4rem;right:2rem;bottom:.7rem;margin:0;padding:0;background-size: 100%; background-repeat:no-repeat;background-position:center;z-index:100;background-image:url(../imgs/fulldynamic-agencia-digital.webp); display: block;
}


@media screen and (min-width:1000px) and (max-width:1100px) {*{font-size: .8rem;}}

@media screen and (min-width:1900px) {*{font-size: 1.4rem;}}

@media screen and (min-width:2200px) {*{font-size: 1.6rem;}}


@media screen and (min-width:300px) and (max-width:990px) { .titPADR {width: 85%;}

#topo { position: relative; width: 100%; top: 0; left: 0; right: 0; margin: 0 auto; padding-top:2rem;border-top:1em solid #BF3811;height:100%;grid-template-areas: "idtT" "contT" "menuT";}

#exttIDT { position: relative; width:100%;padding:2em 0; top: 0; right: 0; margin: 0 auto; grid-area: idtT;}

#idt {position: relative; top: 0; left: 0; right: 0; margin: 0 auto; display: block; background-size: contain;}

#contTOP {
  position: relative; grid-area: contT;
  width: 77%;
  height: auto;
  top: -.5rem;
  right: 0;
  left: 0;
  margin: .8em auto;
  text-align: center;
  font-size: 1.6rem;
}

#menu {position: relative; width: 100% !important; height: 5.5rem; left: 0; right: 0; margin: 0 auto; grid-area: menuT; overflow-y: hidden; padding: 0 7rem;}

.menu-item {margin: 0 5rem;}

#menu::-webkit-scrollbar{height:.7rem;} #menu::-webkit-scrollbar-thumb{background:#BF3811;}

#slid {height:auto; padding-bottom: 5rem;}

#slid::after {display: none;} #slid::before {display: none;}

#exttSLID {width:90%; margin-top: 2rem;}

#blocSlid1 {
position: relative;
width: 100%;
height: auto;
padding: 2rem 1rem;
top: 2rem;
left: 0;
right: 0;
margin: 1rem auto;
background: #fff;
}

#blocSlid2 {
  position: relative;
  width: 100%;
  height: auto;
  padding: 2rem 1rem;
  top: 1.5rem;
  left: 0;
  right: 0;
  margin: 0 auto;
  background: #fff;
}

#ivt {width: 100%; padding: 2rem 0;} #ivt::after {display: none;} #ivt .titPADR {width: 100%; margin-top: 0; margin-bottom: 2rem; color: #2c2c2c;} .iconSetIvt {display: none;} #exttIVT { width: 100%; grid-gap: 1rem; padding: 0; grid-template-areas: "titIVT titIVT";} .blocIVT {
position: relative; width: 45vw; height: 11.7rem; padding: .1rem;} .titIVT {width: 100%; font-size: 1.2rem; padding: 0;} .botIvt {padding: .2rem;} .blocIVT:hover .botIvt {font-size: 1rem; padding: .3rem;}

#roda {grid-template-areas: "blocFT1" "blocFT2" "blocFT3" "blocFT4" "dirFT";} #contFT {position: relative; bottom: 0; right: 0; width: 77%} .blocFT { width: 100%; padding: 1rem 0 0 2rem; place-content: inherit; margin: 1rem 0;}    

#idtFT {background-position: left;}

.blocFT ul {
position: relative;
padding-left: 1.5rem;
margin: 0;
list-style: none;
color: #521608;
line-height: 180%;
}

.blocFT ul ol {
display: flex;
padding-bottom: .5rem;
list-style: none;  
font-size: 1.3rem;
color: #521608;
}

footer li {transition: all .2s;}

footer li:hover {opacity: .5;}

.emailFT {
font-size: .9rem;
}

#dirFULL {
  position: relative;
  width: 90%;
  left: 0;
  right: 0;
  bottom: 0;
  margin: 2rem auto 0 auto;
  padding: 1.5rem 0;
  font-size: .8rem;
  text-align: left;
  grid-area: dirFT;
  color: #2c2c2c;
  }
  
  #idtFULL {
    position: relative; width: 2.5rem; height: 2.5rem; top: 1rem;
    display: block; margin: 0 auto .5rem auto; left: 0; right: 0;
    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:990px) {*{font-size: 1.05rem;}}

@media screen and (min-width:600px) and (max-width:990px) {*{font-size: 1.4rem;}}

@media screen and (min-width:900px) and (max-width:990px) {*{font-size: 1rem;}}

