.contacto{
    display: block;
    min-height: 35rem; max-width: var( --width--conteiner ); 
    border: none; margin: 2rem auto 0rem auto ;

    background-color: var( --white ); 
   
}

/*-----------------     ----------------   B T N WHATSAPP        --------------------      ---------------------        -----*/

    .cnt--conteiner--top{
        height: 7rem; width: 100%; 
        padding: 0px; border: none; 
        margin: 1rem 0rem 3rem 0rem; 
        box-sizing: border-box;

        display: flex; flex-flow: column; 
        justify-content: center; 
        
        /* background-color: aqua; */
    }
        .cnt--conteiner--top--btn{
            height: 4rem; width: 99%; 
            padding: 0%; border: none; margin: 0% auto; 

            display: flex; flex-flow: row nowrap; 
            justify-content: center;  align-items: center;
           
            border-radius: 7px; 
            background-color: var( --green ); color: var( --white );
    
            font-size: 18px; 
            font-weight: bold; 
            letter-spacing: 0.118rem;
           
        }
            .cnt--conteiner--top--btn--img{
     
                height: 1.6rem; width: 1.6rem; 
                margin: 0rem  0.6rem;

                filter: invert(96%); 
               
            }
   

/*-----------     ---------- S U B   C O N T E I N E R         --------------------      ---------------------        -----*/

    .cnt--conteiner{
        height: var(  --heightMedium--conteiner ); width: 100%; 
        border: none; margin: 0rem auto;
        
  
        display: flex; flex-flow: row-reverse wrap; 
        justify-content: space-between;

        background-color: var( --black )  ;
    
    }

    /*?-----------------     ----------------   F O R M        --------------------      ---------------------        -----*/
      
        .cnt--conteiner--form{
            box-sizing: border-box;
            height: 100%; width: min(60%, 100%);
            border: none; padding: 2rem 3rem;

            background-color: var( --green );
            /* border: solid 10px greenyellow; */

            display: flex; flex-flow: column; 
            justify-content: flex-start;
            
/* 
            display: grid; gap: 1.5rem;
            grid-template-columns: 1fr;
            grid-template-rows: 1fr 1fr 1fr 1fr 1fr; */
            

        }
            .form--title{
                text-align: start;
                height: 5rem; width: max-content;
                padding: 0%; margin: 0rem 0rem 0.5rem 0rem;

                color: var( --white );
                font-size: 1.8rem;
    
                font-size: 33px;
                letter-spacing: 2px;
                font-weight: 400;

                display: block;

            }
            .form_label{
                /* background-color: yellow; */
                /* border: solid 4px rgb(255, 118, 5)!important; */
                height: 4.5rem; width: 100%; 
                padding-left: 0rem;
                margin: 0rem 0rem 2rem 0rem;

                display: grid;
                grid-template-areas: "input";
            }
            .form_text{
                /* display: block; */
                grid-area: input;
            
                height: 100%;
                width: max-content;
                padding: 0.5rem; 
                margin-left: 0.5rem;

                /* color: #6b6b6b; 
                color: var( --white ); */
                color: var( --whiteDarck );
                color: var( --grayLightOpacity );
                /* color: #584c4cee; */
                /* color: var( --color-opacity ); */
                font-size: 14px;
                background-color: transparent!important;
                
                z-index: 10;
                transform-origin: left center;  /* no se para q esta */
                transition: transform 0.3s;

                display: flex;
                align-items: center;
                
            }
            .form--inputs{
                grid-area: input;

                height: 4.5rem; width: 85%; 
                border: none; 
    
                font-size: 16px;
                font: inherit; /* por defecto los inputs no heredan la font del body */
                background-color: transparent;
                /* background-color: var( --green ); */
                border-bottom: solid white 1.5px;

                transition: 0.1s ease;

            }
            .form--inputs:focus + .form_text ,
            .form--inputs:not(:placeholder-shown) + .form_text
            {
                height: 30%;

                color: var( --white ); 
                border-radius: 5px;
                background-color: var( --green ); 
                letter-spacing: 1.5px;
                font-size: 13px; 

                /* background-color: turquoise; */
                transform: translateY( -50% ) ;
            }
            .form--inputs:focus, 
            .form--inputs:active, 
            .form--inputs:hover {  
                outline: none;
                background-color: var( --green )!important;

            }   

            /** T E X T   T A R E A*/

            .form_label:nth-child(4){
                height: 6rem; width: 100%; 
              
                /* background-color: var( --green ); */
                /* background-color: blue; */
            
                transition: 0.1s ease;
            }
            .textarea{
                min-height: 6rem; width: 85%; 
                padding-top: 1.8rem;
                /* border: solid 2px black; */
                /* margin: 0rem 0rem 0.5rem 0rem;  */
                resize: none;
                grid-area: input;
                
            }
            .textarea:focus + .form_text ,
            .textarea:focus:not(:placeholder-shown) + .form_text
            {
                height: 30%;

                color: var( --white ); 
                border-radius: 5px;
                background-color: var( --green ); 
                letter-spacing: 1.8px;
                font-size: 13px; 
                /* transform: scale(0.8)!important; */
                
                /* background-color: turquoise; */
                transform: translateY( -50% ) ;
            }
          
            .textarea:focus, .textarea:active, .textarea:hover {
                /* padding-top: 10px;  */
                outline: none;
                background: transparent;


            }
          
            /** B T N   S U B M I T */

            .form--inputs:nth-child(5){
                box-sizing: border-box;
                aspect-ratio:  8 / 1.7 ;

                height: auto; 
                width: 13rem; 
                padding: 0%;  margin: 1.8rem 0rem 0rem 0rem;

                border: solid 2px var( --whiteDarck );
                border-radius: 5px;
          
                background-color: transparent; color: var( --white );
                letter-spacing: 0.18rem;

            }
            .form--inputs:nth-child(5):hover{
                background-color: var( --opacity1 )!important;
                cursor:pointer;
                border: none;
            }
            .form--inputs:nth-child(5):focus{
                color: var(--orange);
       
            }
           
/*?------------- --------- I N F O   C O N T A C T O        --------------------      ---------------------        -----*/
   
    .cnt--conteiner--footer{

        height: 90%; width: 40%; 
        border: none;
        padding: 2rem 0rem 0rem 0rem;

        display: flex; flex-flow: column nowrap; 
        justify-content: space-evenly; align-items: center;

        background-color: var( --white ); 

    }

        /** I T E M S */
        .footer--items{

            box-sizing: border-box;
            
             min-height: 8rem; min-width: 8rem;
             padding: 0%; margin: 0rem auto 0.5rem auto;

            display: flex; flex-flow: column nowrap; 
            justify-content: flex-start; align-items: center;
 
   
        }
            .footer--img{
                height: 2.5rem; width: 2.5rem; 
                margin-bottom: 1rem ;

                filter: invert(64%) sepia(26%) saturate(1178%) hue-rotate(61deg) brightness(98%) contrast(100%); 
                filter: invert(56%) sepia(13%) saturate(1066%) hue-rotate(91deg) brightness(96%) contrast(93%);
                filter: invert( 37% );
            }
            .footer--title{
                color: var(   --color-opacity );

                letter-spacing: 0.8px;
                font-size: 16px;
                font-weight: 600;
            }
            .footer--text{
                color: var( --gray );
            }



        /*?-------------- R E D E S ------------------------ */

        .footer--items:nth-child(3){

            display: flex; flex-flow: column ; 
            justify-content: flex-start; align-items: center;
        }
            .footer__items__row__imgs{
                width: 100%;
                padding: 0%; margin: -10% 0rem 1rem 0rem;  

                display: flex; flex-flow: row nowrap; 
                justify-content: space-evenly; 
                align-items: center!important; align-content: center;

            }
               

            .footer__items__link{
                height: auto; 
                width: 50%; 
                padding: 10% 0rem 0rem 0rem; margin: 0%;
  
                display: flex; flex-flow: column ; 
                justify-content: center; 
                align-items: center; align-content: center;

                border-radius: 5px;

                &:hover{  
                    background-color: rgba(0, 0, 0, 0.606);
                   
                box-shadow: 7px 7px  30px 3px  rgba(0, 0, 0, 0.566) ,
                -7px -7px  30px 3px  rgba(0, 0, 0, 0.566) ;       
                }
            }
            .footer__items__link:hover .footer--img {
                    filter: invert(95%); 
                }

            .footer--items:nth-child(3) .footer--title {
                width:  100%;
                margin: -1rem 0rem 0rem 0rem ;

                letter-spacing: 1px;
            }

           


/*?--------------------------  R E S P O S I V E -----------------------------------------------------------*/



@media ( max-width: 1200px) {
    
.contacto{
    height: auto; width: 100%; 
    margin: 5rem auto 0rem auto ;
   
}

/*-----------------     ------------  B T N   W H A T S A P P        --------------------      ---------------------        -----*/

    .cnt--conteiner--top{
        height: 7rem; width: 100%; 
        padding: 0px; margin: 1rem 0rem 3rem 0rem; 

        display: flex; flex-flow: column; 
        justify-content: center; 
        
        /* background-color: aqua; */
    }
        .cnt--conteiner--top--btn{
            height: 4rem; width: 99%; 
            padding: 0%; border: none; 

            display: flex; flex-flow: row nowrap; 
            justify-content: center;  align-items: center;
  
            font-size: 18px; 
            font-weight: bold; 
            letter-spacing: 0.118rem;
         
        }
            .cnt--conteiner--top--btn--img{
                /* border: 1px black solid; */
                height: 1.6rem; width: 1.6rem; 
                margin: 0rem  0.6rem;

            }

/*-----------------     ---------- S U B   C O N T E I N E R         --------------------      ---------------------        -----*/

    .cnt--conteiner{
        height: auto; width: 100%;

        display: flex; flex-flow: row-reverse wrap; 
        justify-content: space-between;

    }

    /*?-----------------     ----------------   F O R M        --------------------      ---------------------        -----*/
      
        .cnt--conteiner--form{
            /* border: 1px solid greenyellow; */
            height: 100%; width: 60%;
            padding: 2rem 3rem 4rem 3rem;

            display: flex; flex-flow: column; 
            justify-content: flex-start;



        }
            .form--title{
                text-align: start;
                height: 5rem;
                padding: 0%; margin: 0rem 0rem 0.5rem 0rem;
                
                font-size: 1.8rem;
    
                font-size: 33px;
                letter-spacing: 2px;
                font-weight: 400;

                /* border: solid white 2px; */
            }

            .form--inputs{
                height: 5rem; width: 88%; 
                padding-left: 1rem;
             
                margin: 0rem 0rem 0.5rem 0rem;

                font-size: 16px;
                /* background-color: var( --grayLight );  */
                

            }

            .form--inputs:focus {  
                outline: none;
            }
           
            .form--input:active{
                border: none;
            }

            /** T E X T   T A R E A*/
            .textarea{
                min-height: 6rem; width: 88%; 
                margin: 0rem 0rem 0.5rem 0rem; 
                
            }
            

            /** B T N   S U B M I T */

            .form--inputs:nth-child(5){
                box-sizing: border-box;
                aspect-ratio:  8 / 1.7 ;

                height: auto; 
                width: 13rem; 
                padding: 0%;  margin: 3rem 0rem 0rem 0rem;
          
                letter-spacing: 0.18rem;

            }
           
/*?-----------------     ---------- I N F O   C O N T A C T O        --------------------      ---------------------        -----*/
   
    .cnt--conteiner--footer{

        height: 90%; width: 40%; 
        padding: 2rem 0rem 0rem 0rem;

        display: flex; flex-flow: column nowrap; 
        justify-content: space-evenly; align-items: center;

        background-color: var( --white ); 
        /* background-color: var( --black );  */
    }

        /* I T E M S */
        .footer--items{
            box-sizing: border-box;
             /* border: 1px rgb(212, 31, 31) solid; */
             min-height: 8rem; min-width: 8rem;
             padding: 0%; margin: 0rem auto 0.5rem auto;

            display: flex; flex-flow: column nowrap; 
            justify-content: flex-start; align-items: center;
 
   
        }
            .footer--img{
                height: 2.5rem; width: 2.5rem; 
                margin-bottom: 1rem ;

            }
            .footer--title{
    

                letter-spacing: 0.8px;
                font-size: 16px;
                font-weight: 600;
            }


        /** R E D E S */ 

        .footer--items:nth-child(3){
            
                /* border: 1px rgb(200, 25, 185) solid; */

            display: flex; flex-flow: column nowrap; 
            justify-content: flex-start; align-items: center;
            

        }
            .footer__items__row__imgs{
                width: 100%;
                padding: 0%; margin: 0%;

                display: flex; flex-flow: row nowrap; 
                justify-content: space-evenly; align-items: center;

            }
                .footer--items:nth-child(3) .footer--img {
            
                    height: 2.5rem; width: 2.5rem; 
                    margin-bottom: 1rem ;

                    /* background-color: rgb(42, 48, 165); */
                }
            .footer--items:nth-child(3) .footer--title {
                width:  100%;
                margin: 0rem 0rem 0rem 0rem;

                /* background-color: brown; */

            }

}

@media ( max-width: 800px) {

.contacto{
    height: auto; width: 100%; 
    margin: 5rem auto 0rem auto ;
    
}

/*?-----------------     ----------------   B T N  WHATSAPP        --------------------      ---------------------        -----*/

    .cnt--conteiner--top{
        height: 7rem; width: 100%; 
        padding: 0px; margin: 1rem 0rem 3rem 0rem; 

        display: flex; flex-flow: column; 
        justify-content: center; 
        
        /* background-color: aqua; */
    }
        .cnt--conteiner--top--btn{
            height: 3.8rem; width: 99%; 
            padding: 0%; 
    
            font-size: 18px; 
            letter-spacing: 0.118rem;
            
        }
            .cnt--conteiner--top--btn--img{
                /* border: 1px black solid; */
                height: 1.6rem; width: 1.6rem; 
                margin: 0rem  0.6rem;

            }

/*-----------------     ---------- S U B   C O N T E I N E R         --------------------      ---------------------        -----*/

    .cnt--conteiner{
        height: auto; width: 100%;       

        
        display: flex; flex-flow: row-reverse wrap; 
        justify-content: space-between;

    
    }

    /*?-----------------     ----------------   F O R M        --------------------      ---------------------        -----*/
        
        .cnt--conteiner--form{
            /* border: 1px solid greenyellow; */
            height: 100%; width: 60%;
            padding: 2rem 3rem 4rem 3rem!important;

            display: flex; flex-flow: column; 
            justify-content: flex-start;

        }

            .form--title{
                display: inline-block;
                box-sizing: border-box!important;
                text-align: start; vertical-align: middle;
                height: 4.5rem; width: 100%;
                padding: 0rem!important; 
                margin: 0rem 0rem 0.8rem 0rem;
    
                /* font-size: 32px;  */
                font-size: 1.8rem;

                line-height: 36px;
                letter-spacing: 2px;
                font-weight: 400;

                /* border: solid white 2px; */
            }
          

            .form_label{
                /* background-color: yellow; */
                height: 4.5rem; 
                /* padding-left: 0.8rem; */
                padding: 0%;

                margin: 0rem 0rem 1rem 0rem;
        
            }
            .form_text{
                padding: 0rem; 
                margin-left: 0.5rem;
        
                font-size: 14px;
                
            }
            .form--inputs{  
                height: 4.5rem; width: 90%; 
                padding-left: 0rem;
                margin: 0rem;

                font-size: 16px;
                /* background-color: var( --grayLight );  */
            }

         

            /** T E X T   T A R E A*/
            
            .form_label:nth-child(4){
                /* background-color: yellow; */
                /* border: solid 4px rgb(255, 5, 201)!important; */
                height: 6rem; 
                padding: 0%;
                margin: 0rem ;
        
            }
            .textarea{
                min-height: 6rem; width: 90%; 
                margin: 0rem; 
                /* padding-top: 7.8rem; */
                
            }
            
         
            /** B T N   S U B M I T */

            .form--inputs:nth-child(5){
                aspect-ratio:  8 / 1.7 ;

                height: auto; width: 12rem; 
                padding: 0%;  margin: 2.5rem 0rem 0rem 0rem;
    
                letter-spacing: 0.18rem;

            }


             
         
            
/*?-----------------     ---------- I N F O   C O N T A C T O        --------------------      ---------------------        -----*/
    
    .cnt--conteiner--footer{

        height: 90%; width: 40%; 
        padding: 2rem 0rem 0rem 0rem;

        display: flex; flex-flow: column nowrap; 
        justify-content: space-evenly; align-items: center;

        /* background-color: var( --black );  */
    }

        /* I T E M S */
        .footer--items{
            /* border: 1px rgb(212, 31, 31) solid; */
            min-height: 8rem; min-width: 8rem;
            padding: 0%; margin: 0rem auto 0.5rem auto;
    
    
        }
            .footer--img{
                height: 2.2rem; width: 2.2rem; 
                margin-bottom: 1rem ;

            }
            .footer--title{
                letter-spacing: 0.8px;
                font-size: 16px;
                font-weight: 600;
            }


        /** R E D E S */
        .footer--items:nth-child(3){
            
                /* border: 1px rgb(200, 25, 185) solid; */

            display: flex; flex-flow: column nowrap; 
            justify-content: flex-start; align-items: center;
            

        }
            .footer__items__row__imgs{
                width: 100%;
                padding: 0%; margin: 0%;

                display: flex; flex-flow: row nowrap; 
                justify-content: space-evenly; align-items: center;

                /* background-color: cadetblue; */
            }
                .footer--items:nth-child(3) .footer--img {
            
                    height: 2.2rem; width: 2.2rem; 
                    margin-bottom: 1.5rem ;

                    /* background-color: rgb(42, 48, 165); */
                }
            .footer--items:nth-child(3) .footer--title {
                width:  100%;
                margin: 0rem 0rem;

                /* background-color: brown; */

            }

}

@media ( max-width: 715px) {

.contacto{
    height: auto; width: 100%; 
    margin: 3rem auto 0rem auto ;
    
}

/*?-------------   ----------------   B T N WHATSAPP        --------------------      ---------------------        -----*/

    .cnt--conteiner--top{
        height: 7rem; width: 100%; 
        padding: 0px; margin: 1rem 0rem 2.8rem 0rem; 

        /* background-color: aqua; */
    }
        .cnt--conteiner--top--btn{
            height: 3.8rem; width: 99%; 
            padding: 0%; 
    
            font-size: 18px; 
            letter-spacing: 0.118rem;
            
        }
            .cnt--conteiner--top--btn--img{
                /* border: 1px black solid; */
                height: 1.6rem; width: 1.6rem; 
                margin: 0rem  0.6rem;

            }

/*-----------------     ---------- S U B   C O N T E I N E R         --------------------      ---------------------        -----*/

    .cnt--conteiner{
        height: auto; width: 100%;       
 
        display: flex; flex-flow: column-reverse; 
        justify-content: flex-start;

    
    }

    /*?-------------   ----------------   F O R M        --------------------      ---------------------        -----*/
        
        .cnt--conteiner--form{
            /* border: 1px solid greenyellow; */
            height: auto; width: 100%;
            padding: 1.8rem 3rem 3.5rem 3rem;

            display: flex; flex-flow: column; 
            justify-content: flex-start; align-items: center;



        }
            .form--title{
                text-align: center;
                min-height: 5rem; width: 100%;
                padding: 0%; margin: 0rem ;

                display: flex; flex-direction: column;
                justify-content: center; align-items: center;
    
                font-size: 32px;
                line-height: 36px;
                letter-spacing: 2px;
            
                /* border: solid white 2px; */
            }
            .form_label{
                /* background-color: yellow; */
                /* border: solid 4px rgb(255, 5, 201)!important; */
                height: 5rem; 
                padding: 0%;
                margin: 0rem auto 1.5rem auto; 
        
            }
            .form_text{
                padding: 0rem; width: 85%;
                padding-left: 1rem;    
                margin: 0rem auto  0rem auto ;
        
                font-size: 14px;
                
            }

            .form--inputs{    
                height: 5rem; width: 85%; 
                padding-left: 1rem;    
                margin: 0rem auto;

                font-size: 16px;
                /* background-color: var( --grayLight );  */

            }


             /** T E X T   T A R E A*/

            .form_label:nth-child(4){
                /* background-color: yellow; */
                /* border: solid 4px rgb(255, 5, 201)!important; */
                height: 6rem; 
                padding: 0%;
                margin: 0rem auto 0.5rem auto; 
        
            }

            .textarea{
                min-height: 6rem; width: 85%; 
                margin: 0rem auto 0rem auto; 
                padding-top: 20px;              /* bajar el texto*/

                
            }
            
            .textarea:focus{
                /* padding-top: 0px;  */
                line-height: 24px;
            }

            /** B T N   S U B M I T */

            .form--inputs:nth-child(5){
                
                aspect-ratio:  8 / 1.7 ;

                height: auto; width: 12rem; 
                padding: 0%;  margin: 2.5rem 0rem 0rem 0rem;
    
                letter-spacing: 0.18rem;

            }
            
/*-----------------     ---------- I N F O   C O N T A C T O        --------------------      ---------------------        -----*/
    
    .cnt--conteiner--footer{

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

        display: flex; flex-flow: row wrap; 
        justify-content: space-evenly; align-items: center;

        /* background-color: var( --black );  */
    }

        /* I T E M S */
        .footer--items{
            /* border: 1px rgb(212, 31, 31) solid; */

            min-height: 8rem; min-width: 8rem;
            padding: 0%; margin: 0rem 0rem 0.5rem 0rem;

            display: flex; flex-direction: column;
            justify-content: center; align-items: center;
    
    
        }
            .footer--img{
                height: 2.2rem; width: 2.2rem; 
                margin-bottom: 1rem ;

            }
            .footer--title{
                letter-spacing: 0.8px;
                font-size: 16px;
                font-weight: 600;
            }


        /** R E D E S */

        .footer--items:nth-child(3){
            
                /* border: 1px rgb(200, 25, 185) solid; */

            display: flex; flex-flow: column nowrap; 
            justify-content: center; align-items: center;
            

        }
            .footer__items__row__imgs{
                width: 100%;
                padding: 0%; margin: -10% 0rem 0rem 0rem;  
                margin-bottom: 0rem ;

                display: flex; flex-flow: row nowrap; 
                justify-content: space-evenly; align-items: center;

                /* background-color: cadetblue; */
            }
            .footer__items__link{
                width: 40%;
                 /* border: solid black; */
            }
                .footer--items:nth-child(3) .footer--img {
                    height: 2.2rem; width: 2.2rem;   
                 
                    /* background-color: rgb(42, 48, 165); */
                }
                .footer--items:nth-child(3) .footer--title {
                    width:  100%;
                    margin: -0.4rem 0rem 0rem 0rem;

                    /* background-color: brown; */

                }

}

@media ( max-width: 600px) {

    .cnt--conteiner--top--btn{
        height: 3.8rem; width: 97%; 
        padding: 0%; 

        font-size: 18px;   font-weight: 300;
        letter-spacing: 0.118rem;
        
    }

    /*?-----------------     ----------------   F O R M        --------------------      ---------------------        -----*/
        .form_text{
            padding: 0rem; width: 95%;
            padding-left: 0.5rem;    
         /* border: solid 2px  orange; */

            
        }
            .form--inputs{
                width: 95%; 
                padding: 0%;
                margin: 0rem auto;

            }

            /** T E X T   T A R E A*/
           
            .textarea{ 
                width: 95%; 
                padding-top: 20px;
            }
      
            
/*?-----------------     ---------- I N F O   C O N T A C T O        --------------------      ---------------------        -----*/

        /* I T E M S */
        .footer--items{

            min-height: 8rem; min-width: 8rem;
            padding: 0%; margin: 0rem 0rem 0.5rem 0rem;

            display: flex; flex-direction: column;
            justify-content: center; align-items: center;
    
    
        }
            .footer--img{
                height: 2rem; width: 2rem; 
                margin-bottom: 1rem ;

            }
            .footer--title{
                letter-spacing: 0.8px;
                font-size: 14px;
            }


        /** R E D E S */
        .footer--items:nth-child(3){
            
                /* border: 1px rgb(200, 25, 185) solid; */

            display: flex; flex-flow: column nowrap; 
            justify-content: center; align-items: center;
            

        }
            .footer__items__row__imgs{
                width: 100%;
                padding: 0%; margin: -10% 0rem 0rem 0rem;

                display: flex; flex-flow: row nowrap; 
                justify-content: center; align-items: center;

                /* background-color: cadetblue; */
            }
                .footer--items:nth-child(3) .footer--img {
            
                    height: 2rem; width: 2rem; 
                    margin: 0rem 0.2rem 1rem 0.2rem;

                    /* background-color: rgb(42, 48, 165); */
                }
            .footer--items:nth-child(3) .footer--title {
                width:  100%;
                margin: -0.4rem 0rem -0.4rem 0rem;

                /* background-color: brown; */

            }

}

@media ( max-width: 490px) {

.contacto{
    height: auto; width: 100%; 
    margin: 2rem auto 0rem auto ;
    
}

/*?-----------------     ----------------   B T N WHATSAPP        --------------------      ---------------------        -----*/

    .cnt--conteiner--top{
        height: 7rem; width: 100%; 
        padding: 0px; margin: 0rem 0rem 2.8rem 0rem; 

        /* background-color: aqua; */
    }
        .cnt--conteiner--top--btn{
            height: 3.6rem; width: 97%; 
            padding: 0%; 
    
            font-size: 17px; 
            font-weight: 300;
            letter-spacing: 0.118rem;
            
        }
            .cnt--conteiner--top--btn--img{
                /* border: 1px black solid; */
                height: 1.6rem; width: 1.6rem; 
                margin: 0rem  0.6rem;

            }

/*-----------------     ---------- S U B   C O N T E I N E R         --------------------      ---------------------        -----*/

    .cnt--conteiner{
        height: auto; width: 100%;       
    
        display: flex; flex-flow: column-reverse; 
        justify-content: flex-start;

    
    }

    /*?-----------------     ----------------   F O R M        --------------------      ---------------------        -----*/
        
        .cnt--conteiner--form{
            /* border: 1px solid greenyellow; */
            height: auto; width: 100%;
            padding: 1.8rem 0.8rem 3.5rem 0.8rem;



        }
            .form--title{
                min-height: 5rem; width: 100%;
                padding: 0%; margin: 0rem ;

                display: flex; flex-direction: column;
                justify-content: center; align-items: center;
    
                font-size: 30px;
                line-height: 39px;
                letter-spacing: 1.5px;

                /* border: solid white 2px; */
            }

            .form_label{
                height: 5rem;
                margin: 0rem auto 1.3rem auto;
                
            }
            .form--inputs{
                
                height: 5rem; width: 95%; 
                padding-left: 1rem;
                
                margin: 0rem auto;

                font-size: 16px;
                /* background-color: var( --grayLight );  */
                background: transparent;

            }

            /** T E X T   T A R E A*/
            .form_label:nth-child(4){
                height: 6rem; 
                margin: 0rem auto 1.3rem auto; 

                /* border: solid 2px yellow; */
            }
            .textarea{
                min-height: 6rem; width: 95%; 
                margin: 0rem auto; 
                
            }
            
         

            /** B T N   S U B M I T */

            .form--inputs:nth-child(5){
                
                aspect-ratio:  8 / 1.7 ;

                height: auto; width: 12rem; 
                padding: 0%;  margin: 2.5rem 0rem 0rem 0rem;
    
                letter-spacing: 0.18rem;

            }
            
/*-----------------     ---------- I N F O   C O N T A C T O        --------------------      ---------------------        -----*/
    
    .cnt--conteiner--footer{

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

        display: flex; flex-flow: row wrap; 
        justify-content: space-evenly; align-items: center;

        /* background-color: var( --black );  */
    }

        /* I T E M S */ 

        .footer--items{
            /* border: 1px rgb(212, 31, 31) solid; */

            min-height: 8rem; min-width: 8rem;
            padding: 0%; margin: 0rem 0rem 0.5rem 0rem;

            display: flex; flex-direction: column;
            justify-content: center; align-items: center;
    
    
        }
            .footer--img{
                height: 2rem; width: 2rem; 
                margin-bottom: 1rem ;

            }
            .footer--title{
                letter-spacing: 0.5px;
                font-size: 12px;
                font-weight: 600;
            }


        /** R E D E S */

        .footer--items:nth-child(3){
            
                /* border: 1px rgb(200, 25, 185) solid; */

            display: flex; flex-flow: column nowrap; 
            justify-content: center; align-items: center;
            

        }
            .footer__items__row__imgs{
                width: 100%;
                padding: 0%; margin: -10% 0rem 0rem 0rem;

                display: flex; flex-flow: row nowrap; 
                justify-content: center; align-items: center;

                /* background-color: cadetblue; */
            }

            .footer__items__link{
                width: 40%; 

            }
                .footer--items:nth-child(3) .footer--img {
            
                    height: 2rem; width: 2rem; 
                    margin: 0rem 0.2rem 1rem 0.2rem;

                    /* background-color: rgb(42, 48, 165); */
                }
            .footer--items:nth-child(3) .footer--title {
                width:  100%;
                margin: -0.4rem 0rem -0.4rem 0rem;

                /* background-color: brown; */

            }

}

@media ( max-width: 390px) {

.contacto{
    height: auto; width: 100%; 
    margin: 2rem auto 0rem auto ;
    
}

/*?-----------------     ----------------   B T N WHATSAPP        --------------------      ---------------------        -----*/

    .cnt--conteiner--top{
        height: 7rem; width: 100%; 
        padding: 0px; margin: 0rem 0rem 2.8rem 0rem; 

        /* background-color: aqua; */
    }
        .cnt--conteiner--top--btn{
            height: 3.6rem; width: 97%; 
            padding: 0rem 0.5rem; 
    
            font-size: 17px; 
            font-weight: 300;
            letter-spacing: 0.118rem;
            
        }
            .cnt--conteiner--top--btn--img{
                /* border: 1px black solid; */
                height: 1.6rem; width: 1.6rem; 
                margin: 0rem  0.6rem;

            }

/*-----------------     ---------- S U B   C O N T E I N E R         --------------------      ---------------------        -----*/

    .cnt--conteiner{
        height: auto; width: 100%;       
    
        display: flex; flex-flow: column-reverse; 
        justify-content: flex-start;

    
    }

    /*?-----------------     ----------------   F O R M        --------------------      ---------------------        -----*/
        
        .cnt--conteiner--form{
            /* border: 1px solid greenyellow; */
            height: auto; width: 100%;
            padding: 1.8rem 1rem 3.5rem 1rem;



        }
            .form--title{
                min-height: 5rem; width: 100%;
                padding: 0% 0.8rem; margin: 0rem 0rem 1.2rem 0rem;

                font-size: 30px;
                line-height: 36px;
                letter-spacing: 1.8px;
          
                /* border: solid white 2px; */
            }
            .form_label{
                padding: 0%;
                /* border: solid 2px purple; */
            }
            .form--inputs{
                height: 5rem; width: 95%; 
                padding-left: 1rem;

                font-size: 16px;

            }



            /** T E X T   T A R E A*/
            .textarea{
                min-height: 6rem; width: 95%; 
                
            }
            

            /** B T N   S U B M I T */

            .form--inputs:nth-child(5){
                
                aspect-ratio:  8 / 1.7 ;

                height: auto; width: 12rem; 
                padding: 0%;  margin: 2rem 0rem 0rem 0rem;
    
                letter-spacing: 0.18rem;

            }
            
/*-----------------     ---------- I N F O   C O N T A C T O        --------------------      ---------------------        -----*/
    
    .cnt--conteiner--footer{

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

        display: flex; flex-flow: row wrap; 
        justify-content: space-evenly; align-items: center;

        /* background-color: var( --black );  */
    }

        /* I T E M S */
        .footer--items{
            /* border: 1px rgb(212, 31, 31) solid; */

            min-height: 6rem; min-width: 8rem;
            padding: 0%; margin: 0rem 0rem 0.5rem 0rem;

            display: flex; flex-direction: column;
            justify-content: center; align-items: center;
    
    
        }
            .footer--img{
                height: 2rem; width: 2rem; 
                margin-bottom: 1rem ;

            }
            .footer--title{
                letter-spacing: 0.5px;
                font-size: 12px;
                font-weight: 600;
            }


        /** R E D E S */
        .footer--items:nth-child(3){
            
                /* border: 1px rgb(200, 25, 185) solid; */

            display: flex; flex-flow: column nowrap; 
            justify-content: center; align-items: center;
            

        }
            .footer__items__row__imgs{
                width: 100%;
                padding: 0%; margin: 0%;

                display: flex; flex-flow: row nowrap; 
                justify-content: center; align-items: center;

                /* background-color: cadetblue; */
            }
                .footer--items:nth-child(3) .footer--img {
            
                    height: 2rem; width: 2rem; 
                    margin: 0rem 0.2rem 1rem 0.2rem;

                    /* background-color: rgb(42, 48, 165); */
                }
            .footer--items:nth-child(3) .footer--title {
                width:  100%;
                margin: -0.4rem 0rem -0.4rem 0rem;

                /* background-color: brown; */

            }

}