@media (max-width: 824px){
  
  /* menu */
  
  .drop .fa-bars, .drop .fa-times{
    color: #b6761d;
  }
  .trav{
    background: #b6761d;
  }
  .botaoativo{
    color: #b6761d!important;
  }
  /* fim menu */

  .sub-all{
    color: #b6761d;
  }
  .controle-inicio{
    padding-right: 3rem;
    padding-top: 4rem;
    text-align: right;

  }

  .controle-inicio p{
    margin-left: 10.6rem;
    width: 600px;
  }

  /* parte de cima */
  .part1{
    position: relative;
  }
  .margin-inicio-t{
    margin-right: -1.3rem;
  }
  .margin-sub{
    margin-right: -.3rem;
  }

  .img-logo-in{
    position: absolute;
    top: 36.8%;
    left: 4%;
    z-index: 2;
    width: 30%;  
  }

  .linha-in{
    position: absolute;
    z-index: -1;
    top: 52%;
    left: -47.6%;
    width: 200%;
    border-top: 2.5px solid #b6761d;
    transform: rotate(147deg);
    -ms-transform: rotate(147deg);
    -webkit-transform: rotate(147deg);
  }
  
  .triangulo-in{
    position: absolute;
    top: 29.50%;
    left: -40%;
    z-index: 1;
    margin-left: 40%;
    width: 0;
    border-left: 400px solid #fff;
    border-top: 250px solid transparent;
    border-bottom: 250px solid transparent;
  }
  
  .valor{
    color: white;
  }

  /* parte do vídeo */
  .part-video{
    padding-top: 3rem;
    padding-bottom: 3rem;
  }
  .video-yout{
    width: 100%;
    height: 100vh;
  }

  .controle-baixo{
    margin-left: 2.5rem;
  }

  .controle-baixo p{
    width: 740px;
  }

  .margin-b{
    margin-left: -.3rem;
  }

  .img-complexo{
    width: 100%;
    margin-top: 2.5rem;
    margin-bottom: -0.2rem;
  }
  /* parte das marcas */
  .marcas{
    position: relative;
    overflow: hidden;
    height: 650px;
    padding-top: 2rem;
    padding-bottom: 3.5rem;
    background-color: white;
  }
  .marcas .texto-all a{
    color: #b6761d;
    text-decoration: none;
  }
  .marcas p{
    width: 740px;
  }
  
  .marca-working, .marca-living{
    display: none; 
  }

  .marca-complexo, .marca-working, .marca-living{
    margin-left: 3rem;
    margin-bottom: 3rem;
  }
 
  .troca1{
    display: block;
  }
  .troca2{
    display: none;
  }

  .marca-torres{
    width: 30%;
  }

  .controle-btn{
    text-align: center;
  }

  .btn-mobile, .btn-mobile2{
    font-family: avenirblack;
    letter-spacing: .2rem;
    background-color: white;
    border: 1px solid #282727;
    color: #282727!important;
    width: 150px;
   /*  -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px; */
    margin-right: 1rem;
  }
  .btn-mobile{
    padding: .5rem .6rem;
  }
  .btn-mobile2{
    padding: .27rem .6rem;
    line-height: 1rem;
  }
  .btn-ativo{
    background-color: #282727;
    color: white!important;
  }

  /* layout */
  .triangulo-marca{
    position: absolute;
    top: -42%;
    right: -17%;
    z-index: 1;
    
    width: 0;
    border-left: 400px solid #282727;
    border-top: 250px solid transparent;
    border-bottom: 250px solid transparent;
    transform: rotate(70deg);
    -ms-transform: rotate(70deg);
    -webkit-transform: rotate(70deg);
  }

  .linha-marca{
    position: absolute;
    z-index: 2;
    top: 0%;
    left: -20.6%;
    width: 200%;
    border-top: 2.5px solid #b6761d;
    transform: rotate(-142deg);
    -ms-transform: rotate(-142deg);
    -webkit-transform: rotate(-142deg);
  }
  
  /* diferenciais */
  .diferenciais{
    position: relative;
    background-color: #282727;
  }
  .diferenciais h1{
    text-align: center;
  }
  .dif-sub{
    font-size: 1.9rem;
    text-align: right;
    margin-right: 3rem;
  }
  .dif-text{
    text-align: right;
    margin-right: 3.6rem;
  }
  .dif-slide{
    position: relative;
    height: 530px;
    margin-top: 2rem;
    
  }
  .principal{
    position: absolute;
    top: 0;
    left: 82px;
    z-index: 2;
    width: 80%;
    display: block;
    margin-left: auto;
    margin-right: auto;
  }
  .esquerda, .direita{
    position: absolute;
    width: 60%;
    top: 12%;
    z-index: 1;
  }
  .direita{
    right: 0; 
  }
  .voltarImg, .passarImg{
    text-decoration: none;
    position: absolute;
    top: 40%;
    z-index: 3;
    font-size: 3rem;
    color: white;
    stroke: black;
      stroke-width: 5;
  }
  .voltarImg{
    left: 5%;
  }
  .passarImg{
    right: 5%;
  }
  #voltarImg, #passarImg{
    position: absolute;
    top: 10%;
    width: 100px;
    height: 350px;
    z-index: 150; 
    /* apagar aqui depois */
    /* border: 5px solid red; */

  }
  #passarImg{
    right: 0;
  }
/* parte dos textos diferenciais */
  .dif-box{
    text-align: center;
    height: 300px;
    color: #b3b3b3;
    padding: 10px 40px;
  }
  .dif-box h1{
    font-size: 1.9rem;
    font-family: avenirlight;
    margin-bottom: 1rem;
  }
  .dif-box p{
    font-family: avenirroman;
    line-height: 1.40rem;
    font-size: 1.3rem;
  }
}

@media (max-width: 812px){
  .triangulo-in{
    top: 29%;
  }
}

@media (max-width: 768px) and (max-height: 1024px){
 .triangulo-in{
    top: 27%;
  }
  .linha-in{
    top: 53.5%;
  }
  .controle-inicio p{
    margin-left: 7.6rem;
    width: 600px;
  }
  .controle-baixo p, .marcas p{
    width: 700px;
  }
  .video-yout{
    height: 50vh;
  }
  .dif-box{
    margin-top: -3rem; 
  }
  /* add */
  .diferenciais{
    padding-top: 20px;
  }
  
}

@media (max-width: 736px){
  .controle-inicio p{
    margin-left: 7.6rem;
    width: 570px;
  }
  .triangulo-in{
    top: 25.2%;
  }
  .img-logo-in{
    top: 34.5%;
  }
  .linha-in{
    left: -47%;
  }
  .controle-baixo p, .marcas p{
    width: 650px;
  }
  .margin-inicio-t{
    margin-top: 3.5rem;
  }
  .video-yout{
    height: 100vh;
  }
  .triangulo-marca{
    right: -21%;
  }
  .principal{
    left: 75px;
  }
  
}
@media (max-width: 731px){
  .triangulo-in{
    top: 25%;
  }
  .linha-in{
    left: -47.5%;
  }

  .dif-box{
    margin-top: -4.5rem; 
  }
}

@media (max-width: 667px){
  .controle-inicio p{
    margin-left: 2.8rem;
    margin-bottom: -2.5rem;
    width: 570px;
  }
  .triangulo-in{
    top: 23.2%;
    left: -52%;
  }
  .linha-in{
    left: -55%;
  }
  .controle-baixo p, .marcas p{
    width: 610px;
  }
  .marca-complexo, .marca-working, .marca-living{
    text-align: justify;
    margin-left: 1.5rem;
  }
  .triangulo-marca{
    right: -25.5%;
  }
  .principal{
    left: 67px;
  }
  .dif-box{
    margin-top: -6.5rem; 
  }
  
}

@media (max-width: 640px){
  .triangulo-in{
    top: 21.8%;
  }
  .linha-in{
    left: -55%;
  }
  .controle-inicio{
    padding-right: 2rem;
    padding-top: 3rem;
    text-align: right;
  }
  .controle-inicio p{
    margin-left: 3.7rem;
    width: 545px;
  }
  .controle-baixo p, .marcas p{
    width: 585px;
  }
  .texto-all br, .valor{
    display: block;
  }
  .principal{
    left: 63.5px;
  }
  .esquerda, .direita{
    top: 10%;
  }
  .voltarImg, .passarImg{
    top: 30%;
  }
  #voltarImg, #passarImg{
    top: 5%;
    height: 315px;
  }
  .dif-box{
    margin-top: -8.5rem; 
  }  
}

@media (max-width: 568px){
  .controle-inicio{
    padding-right: 2.3rem;
  }
  .controle-inicio p{
    margin-left: 3.2rem;
    width: 480px;
  }
  .triangulo-in{
    top: 18.2%;
    left: -63%;
  }
  .linha-in{
    left: -58%;
  }
  .controle-baixo p, .marcas p{
    width: 510px;
  }
  .marca-torres{
    width: 37%;
  }
  .principal{
    left: 57.5px;
  }
  .esquerda, .direita{
    top: 8.5%;
  }
  .voltarImg, .passarImg{
    top: 27%;
  }
  #voltarImg, #passarImg{
    top: 0;
    height: 315px;
  }
  .dif-box{
    margin-top: -10.5rem; 
  }
  
}

@media (max-width: 540px){
  .triangulo-in{
    top: 16.2%;
  }
}

@media (max-width: 414px){
  
  .controle-inicio{
    padding-right: 1.9rem;
  
  }
  .controle-inicio p{
    margin-left: 2.15rem;
    width: 350px;
  }

  .img-logo-in{
    top: 31%;
  }
  .controle-inicio h1{
    margin-bottom: -2rem;
  }
  .triangulo-in{
    top: 6.45%;
    left: -88%;
  }

  .linha-in{
    left: -68%;
  }

  .video-yout{
    height: 35vh;
  }
  
  .controle-baixo p, .marcas p{
    width: 370px;
  }

  .controle-baixo{
    margin-left: 1.2rem;
  }

  .marcas .sub-all{
    font-size: .90rem;
  }
 /*  .marca-living br, .marca-living .valor{
    display: none;
  } */
  .marca-complexo, .marca-working, .marca-living{
    margin-left: 1rem;
  }
  
  .marca-torres{
    width: 45%;
  }

  .marcas{
    height: 550px;
  }
  .btn-mobile, .btn-mobile2{
    letter-spacing: .1rem;
    font-size: 90%;
    width: 115px;
    margin-right: .5rem;
  }
  .triangulo-marca{
    right: -62%;
  }
  .linha-marca{
    left: -26.6%;
  }
  .dif-sub{
    margin-right: .5rem;
    font-size: 1rem;
    letter-spacing: .3rem;
  }
  .dif-text{
    text-align: right;
    margin-right: .9rem;
  }
  .dif-slide{
    height: 350px;
  }
  .principal{
    left: 41px;
  }
  .esquerda, .direita{
    top: 8.5%;
  }
  .voltarImg, .passarImg{
    top: 27%;
  }

  #voltarImg, #passarImg{
    top: 0;
    height: 230px;
  }
  
  .dif-box{
    margin-top: -6rem;
    height: 320px;
  }

   .dif-box h1{
    font-size: 1.3rem;
  }

  .dif-box p{
    font-size:  1rem;
  }

}
@media (max-width: 411px){
  .triangulo-in{
    top: 4.7%;
  }
  .marcas .sub-all{
    width: 345px;
  }
  .controle-baixo p, .marcas p{
    margin-left: 3px;
    width: 345px;
  }
  .diferenciais .titulo-all{
    font-size: 5rem;
  }
  .dif-box{
    height: 380px;
  }
}
@media(max-width: 405px){
  .triangulo-in{
    left: -92%;
  }
}

@media (max-width: 394px){
  .triangulo-in{
    top: 4.4%;
  }
  .marcas .sub-all{
    width: 345px;
  }
  .controle-baixo p, .marcas p{
    margin-left: 3px;
    width: 345px;
  }
  .diferenciais .titulo-all{
    font-size: 5rem;
  }
  .dif-box{
    height: 380px;
  }
  
}
@media (max-width: 375px){
  
  .controle-inicio{
    padding-right: 1.1rem;
  }
  .controle-inicio h1{
    margin-right: -.5rem;
  }
  .controle-inicio p{
    margin-left: 4.15rem;
    width: 290px;
  }
  .triangulo-in{
    top: 2.5%;
    left: -100%;
  }
  .linha-in{
    top: 54%;
  }
  .img-logo-in{
    top: 31.5%;
  }
  .controle-baixo{
    margin-left: 1rem;
  }
  .controle-baixo p, .marcas p{
    width: 345px;
  }
  .marca-working h3{
    text-align: left;
  }
  .btn-mobile, .btn-mobile2{
    letter-spacing: .05rem;
    font-size: 90%;
    width: 110px;
    margin-right: .5rem;
  }
  .triangulo-marca{
    right: -70%;
  }
  .principal{
    left: 38px;
  }
  .voltarImg, .passarImg{
    top: 23%;
  }

  #voltarImg, #passarImg{
    top: 0;
    height: 210px;
  }
  
  .dif-box{
    margin-top: -7.5rem;
    height: 340px;
  }

   .dif-box h1{
    font-size: 1.2rem;
  }

  .dif-box p{
    font-size:  1rem;
  }
  
  
}
/* parei aqui */
@media (max-width: 360px){
  .triangulo-in{
    top: 0.5%;
    left: -105%;
  }
  .linha-in{
    left: -74.5%;
  }
  .img-logo-in{
    top: 30.5%;
  }
  .controle-inicio{
    padding-right: 1.1rem;
  }
  .controle-inicio p{
    margin-left: 3.15rem;
    width: 290px;
  } 
  .controle-baixo p, .marcas p{
    width: 335px;
  }
  .marca-complexo, .marca-working, .marca-living{
    margin-left: .65rem;
  }
  .btn-mobile, .btn-mobile2{
    letter-spacing: .02rem;
    font-size: 90%;
    width: 105px;
   }
  .triangulo-marca{
    right: -74%;
  }
  .principal{
    left: 38px;
  }
  .voltarImg, .passarImg{
    top: 23%;
  }
  #voltarImg, #passarImg{
    top: 0;
    height: 210px;
  }
  .dif-box{
    margin-top: -7.5rem;
    height: 380px;
  } 
  .dif-box h1{
    font-size: 1.2rem;
  }
  .dif-box p{
    font-size:  1rem;
  } 
  
  
}
@media (max-width: 320px){
.triangulo-in{
    top: -4.5%;
    left: -115%;
  }
  
  .img-logo-in{
    top: 30.5%;
    width: 25%;
  }
  .controle-inicio{
    padding-right: 1.1rem;
  }
  .controle-inicio p{
    margin-left: 1.15rem;
    width: 290px;
  } 
  .controle-baixo p, .marcas p{
    width: 280px;
  }

  .marca-complexo, .marca-working, .marca-living{
    margin-left: .65rem;
  }
  .btn-mobile, .btn-mobile2{
    letter-spacing: .02rem;
    font-size: 80%;
    width: 95px;
   }
  .triangulo-marca{
    right: -85%;
  }
  .diferenciais .titulo-all{
    font-size: 4rem;
  }
  .diferenciais .sub-all{
    font-size: .8rem;
  }
  .principal{
    left: 31px;
  }
  .dif-box{
    height: 480px;
  } 
  
}