.clientesTrabajos{
    /* height: 35rem;  */
    height: auto; width: var( --width--conteiner ); 
    padding: 2rem 0rem 2rem 0rem; margin: 0rem auto 7rem auto; 

    background-color:  var( --whiteDarck );
}
    .clt__conteiner__top{
        width: 100%; 
        padding: 4rem 4rem 3rem 4rem;

        color: var(--black);
        letter-spacing: 0.12rem;

        display: flex; flex-direction: column; 
        justify-content: center; align-items: center;

        
    }
        .clt__title{
            height: 6rem; width: 100%; 
            padding: 0.8rem;

            text-align: center;
            display: flex; flex-direction: row; 
            justify-content: center; align-items: center;
         
            font-size: 3rem;
            color: var( --black );
        }
        .clt__subtitle{
            width: 100%;

            color: var( --orange );
            font-size: 18px;
 
        }
        .clt__text{
            padding: 1.5rem 7rem;
            line-height: 32px;
            color: var(--gray);
            letter-spacing: 0.3px;
            /* background-color: rgb(150, 150, 158); */
        }

/**------------------------- G R I L L A -------------------------------------*/


    .clt__conteiner{
        height: 100rem; width: 100%; 
        padding: 1rem 0rem; margin: 0%;
        overflow: hidden;

        display: grid;
        gap: 1rem ;
        /* background-color: aqua; */
        grid-template-columns: repeat( 2 ,  1fr );
        grid-auto-rows: 250px;
    }
        .clt__conteiner .clt__items{
            height: 100%!important; width: 100%; 
            padding: 0%; margin:  0rem;

            border-radius: 4px;
           
        }

        .clt__items:nth-child(1){
            /* grid-column: 1; grid-row: 1; */
            grid-row-start: span 3;
            background-image: url("./../img/pv1.jpg");
            background-repeat: no-repeat;
            background-size: cover;


        }
        .clt__items:nth-child(2){
            grid-row-start: span 6;
            background-image: url("./../img/pv5.jpg");
            background-repeat: no-repeat;
            background-size: cover;

        }
        .clt__items:nth-child(3){
            grid-row-start: span 3;
            background-image: url("./../img/pv2.jpg");
            background-repeat: no-repeat; 
            background-size: cover;

        }
      
      

/*--------------------------------- @ M E D I A ---------------------------------------------------------*/

@media(max-width:1250px){
   
.clientesTrabajos{
    height: auto; width: 100%; 
    padding: 2rem 0rem 0rem 0rem; margin: 0px auto 8rem auto; 
    
 
}
    .clt__conteiner__top{
        width: 100%; 
        padding: 4rem 4rem 3rem 4rem;
        
        letter-spacing: 0.12rem;
    }
        .clt__title{
            height: 70%;
            width: 100%; padding: 0.8rem;      
        
        }
        .clt__subtitle{
            width: 100%;
            font-size: 18px;
        }
/*-------------------------------------------------------*/

    .clt__conteiner{
        overflow: hidden;
        box-sizing: border-box!important; 
 
        height: 92rem ; width: 100%; 
        padding: 0rem 5.5rem ; margin: 2rem auto 0rem auto;  
        
        gap: 1rem; 
    }
    
    
}

@media(max-width:1145px){

.clientesTrabajos{
   
    height: auto; width: 100%; 
    padding: 2rem 0rem 0rem 0rem; margin: 0rem auto 8rem auto; 
}
    .clt__conteiner__top{
        width: 100%; padding: 4rem 4rem 2rem 4rem;

        letter-spacing: 0.12rem;
    }
        .clt__title{
            height: 70%; width: 100%; 
            padding: 0.8rem; margin-bottom: 1rem;
        }
        .clt__subtitle{
            width: 100%;

            font-size: 18px;
        }
        .clt__text{
            padding: 1.5rem 0.8rem;
            line-height: 32px;
            color: var(--gray);
            letter-spacing: 0.3px;
  
        }

/*---------------------------------------------------------------------------*/
    
    .clt__conteiner{
    
        height: 92rem; width: 100%; 
        margin: 2rem auto;  
        padding: 0rem 3.5rem  ; 
        
        gap: 1rem;


    }
    
}

@media(max-width:1025px){

.clientesTrabajos{
    box-sizing: border-box;
    height: auto; width: 100%; 
    margin: 0px auto 7rem auto; 
    
}
    .clt__conteiner__top{
        width: 100%; 
        padding: 4rem 4rem 3rem 4rem;

        letter-spacing: 0.12rem;
    }
        .clt__title{
            height: 70%; width: 100%; 
            padding: 0.8rem;

        }
        .clt__subtitle{

            width: 100%;
            font-size: 20px;
    
        }

/*-----------------------------------------------------------------*/

    .clt__conteiner{
        height: 85rem;  
        grid-auto-rows: 200px;
        gap: 1rem;
              /* background-color: yellowgreen; */
    }
    
      
  
}

@media(max-width: 930px){
   
.clientesTrabajos{

    height: auto; width: 100%; 
    margin: 0px auto 0rem auto; padding: 2rem 0rem 0rem 0rem;

}
    .clt__conteiner__top{
        width: 100%; 
        padding: 5rem 2rem 2rem 2rem;
     
        letter-spacing: 0.12rem;
    }
        .clt__title{
            height: 70%; width: 100%; 
            padding: 0.8rem ; padding-top: 1.2rem;
        }
        .clt__subtitle{
            width: 100%;
       
            font-size: 22px;
        }
        .clt__text{
            padding: 1.5rem 0.8rem;
            line-height: 32px;
            letter-spacing: 0.3px;

        }

/*------------------------------------------------------*/

    .clt__conteiner{
        height: 82rem;  
        grid-auto-rows: 200px;
        gap: 0.5rem;

    }    

}

@media(max-width: 779px){

.clientesTrabajos{

    overflow: hidden;
    height: auto; width: 100%; 
    margin: 0px auto; 

}
    .clt__conteiner__top{

        width: 100%; 
        padding: 4rem 2rem 3rem 2rem;
 
        letter-spacing: 0.12rem;
        
    }
        .clt__title{
            height: 70%;
            width: 100%; padding: 0.8rem;
        }
        .clt__subtitle{
    
            width: 100%;
       
            font-size: 18px;
    
        }
        .clt__text{
            padding: 1.5rem 0.8rem;
            line-height: 32px;
            letter-spacing: 0.3px;

        }

/*------------------------------------------------------*/
    .clt__conteiner{
        height: 192rem; 
        /* padding: 0rem 2rem; */
        margin: 0% 0rem 2rem 0rem;
        grid-template-columns: 1fr!important;  
        grid-auto-rows: 200px;
        gap: 0.5rem;
        /* background-color: aqua; */
 
    }
        .clt__items{    
            height: 100%;  width: 100%;
            margin: 0px ;     
        }
        .clt__items:nth-child(1){
            grid-row-start: span 5;
        }
        .clt__items:nth-child(2){ 
            grid-row-start: span 5;
            background-image: url("./../img/pv2.jpg"); 
        }
        .clt__items:nth-child(3){ 
            grid-row-start: span 5;    
            background-image: url("./../img/pv5.jpg");
        }
    
    
}

@media(max-width: 640px){
 
    /*------------------------------------------------------*/
    .clt__conteiner{
        height: 142rem; 
        padding: 0rem 2rem;
        margin: 0% 0rem 2rem 0rem;
        grid-template-columns: 1fr!important;  
        grid-auto-rows: 140px;
        gap: 0.5rem;
        /* background-color: aqua; */
 
    }
        .clt__items{    
            height: 100%;  width: 100%;
            margin: 0px ;     
            background-position: center;
            background-size: contain;
        }
      
        .clt__items:nth-child(2){ 
            /* grid-row-start: span 3; */
            background-image: url("./../img/pv2.jpg"); 
        }
        .clt__items:nth-child(3){ 
            /* grid-row-start: span 3;     */
            background-image: url("./../img/pv5.jpg");
        }
             
    
    }

@media(max-width: 540px){

.clientesTrabajos{
    height: auto; width: 100%; 
    margin: 0px auto;

}
    .clt__conteiner__top{        
        width: 100%; 
        padding: 4rem 1.2rem 3rem 1.2rem;
        letter-spacing: 0.12rem;

        display: flex; flex-direction: column; 
        justify-content: center; align-items: center;
    }
        .clt__title{
            height: 70%; width: 100%; 
            padding: 0.8rem;

            font-size: 40px;
            line-height: 3.9rem;
        }
        .clt__subtitle{
            width: 100%;
            font-size: 18px;
    
        }
        .clt__text{
            padding: 1.5rem 0.8rem;
            font-size: 15px;
            line-height: 32px;
            letter-spacing: 0.3px;

        }

/*------------------------------------------------------*/
   
    .clt__conteiner{
        height: 122rem;
        padding: 0rem 1.5rem; 
        margin: 0% 0rem 2rem 0rem;
        grid-auto-rows: 120px;
        gap: 0.5rem;

        /* background-color: aqua; */
    }
        .clt__items{    
            margin: 0px ;     
            background-position: center;
            background-size: contain;
        }
             

}

@media(max-width: 385px){

.clientesTrabajos{

    height: auto; width: 100%; 
    margin: 0px ;

}
    .clt__conteiner__top{
         width: 100%; 
         padding: 2rem 1rem; margin: 0%;

         letter-spacing: 1.5px;
    }
        .clt__title{
            height: 70%; width: 100%;
            padding: 0rem 0rem;

            font-size: 2.2rem;
            line-height: 3rem;
            letter-spacing: 1x;
        }
        .clt__subtitle{
            width: 100%;   
            padding: 1rem 0rem ;

            font-size: 19px;
            letter-spacing: 0.3px;
            line-height: 28px;

            display: flex; flex-direction: column; 
            justify-content: center; align-items: center;

          
        }
        .clt__text{
            padding: 1.5rem 0.8rem;
            font-size: 14px;
            line-height: 32px;
            letter-spacing: 0.3px;

        }

/*------------------------------------------------------*/
    

    .clt__conteiner{
        height: auto ; width: 100%; 
        padding: 0rem 0.5rem 2rem 0.5rem; 
        border: none;  margin: 2rem 0rem; 

        /* gap: 1rem!important; */

    }
        .clt__items{
            height: auto!important;  width: 100%!important; 
            padding: 0rem ; margin: 0rem auto!important;   
            /* background-size: contain!important;    */
            background-position: center;
        }
    
}

@media(max-width: 290px){

            .clt__title{
            
                font-size: 2.2rem;
                line-height: 2.7rem;
                letter-spacing: 0x;
            }
            .clt__subtitle{
                letter-spacing: 0px;
         
            }
     
    }