a{ text-decoration: none; }
.main{
    overflow: hidden;

    height: 100vh; width: 100%!important;

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

    background-image: url("../pisctures/portada/portada1.jpg");
    background-repeat: no-repeat; background-position: center; background-size: cover;
}
.main::after{
    z-index: 700;
    
    content: "";
    position: absolute; bottom: -5%; left: 50%;

    height: 4.5rem; width: 3.5px;

    border-radius: 1.2px;

    background-color: var(  --greenLight2 );

    
}

    .nav{
        z-index: 900;
        height: 5.5rem; width: 100%;
        padding: 0rem 7rem; border:none; margin: 0%;

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


        background-color: var( --opacity1 );
       
    }
    .nav__row{
        height: 100%; width: 1440px; 
        border:none; margin: 0%;
        box-sizing: border-box;

        display: flex; flex-flow: row nowrap; 
        justify-content: space-between ; align-items: center;
        
        background-color: transparent;      

    }
        .nav-toggle{
            box-sizing: border-box;
            height: 100%; width: 10%; 
            border: none;

            display: flex; flex-direction: column; 
            justify-content: center; 
            align-content: center; align-items: center;
 
            display: none;
        }
            .row_toggle{
                height: 100%; width: 100%;
                padding: 0%; border: 0rem; margin: 0rem;
            }
            .nav-toggle--item{
                height: 3.3rem; border: none;
                filter: invert(96%);
            }

        .nav--contenedor--logo{
            align-self: flex-end!important; 
            justify-self: flex-end!important;
            
            height: 5.5rem; width: 12rem;
            margin: auto 0rem;

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

        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;

                display: flex; flex-direction: column; 
                justify-content: center; 
                align-items: center; align-content: center;
                
                background-image: url("../pisctures/logoDefinitivo.png");
      
                filter: invert(96%);

                background-repeat: no-repeat; background-position: center;
                background-size: contain; 
                background-color: transparent;
       
            }

        .nav-ul{
            box-sizing: border-box;
            height: 100%!important; width: 32rem;
            margin: 0; padding: 0;
            
            display: flex; flex-flow: row wrap; 
            justify-content: space-between; 
            align-items: center; align-content: center;

        }
            .li-items{
                z-index: 580;
                
                height: 100%; width: 15%; 
                /* background-color: rgb(255, 81, 0); */
                box-sizing: border-box;

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

            }
                .nav-items{
                    z-index: 600;
                    
                    height: 100%; width: 100%; 
                    /* margin: 5px 5px 5px 5px; */
                    box-sizing: border-box;

                    display: flex; flex-direction: column; 
                    justify-content: center; align-items: center;
                 
                    color: var( --grayLight )!important;
                    /* background-color: rgb(255, 247, 0); */
                    font-size: 15px;
            
                    
                }

/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 89%; width: 100%;

        background-color: var( --opacity1 );

        display: flex; flex-flow: column wrap; 
        justify-content: center;

    }

/**----------------------------- T I T U L O -----------------------*/

        .hd--conteiner--title{
            height: 30%; width: 50%; 
            margin: 0px auto -1rem auto;
           
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                height: 100%; width: 100%; margin: 0% ;
                padding: 1rem 6rem;

                color: var( --white )!important;
                line-height: 45px!important;
                font-size: 40px;
                letter-spacing: 1px;

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

              
                /* background-color: rgb(56, 183, 24); */
            }

/**----------------------------- S E R V I C I O S -----------------------*/

        .hd--conteiner--servicios{ 
            height: 28%; width: 57%;
            margin: 2% auto -1rem auto;
            box-sizing: border-box!important;

            display: grid;  
            grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 1fr 1fr;
            
            grid-area: 
                "hd--items--1 hd--items--2 hd--items--3 hd--items--4"
                "hd--items--5 hd--items--6 hd--items--7 hd--items--8"
                ;
       
        }
            .hd--items{
            
                display: flex; flex-flow: column; justify-content: center;

                /* box-sizing: content-box!important; */
                height: 100%; width: 100%; 
                padding: 0rem 1rem 1rem 1rem; margin: auto;

                background-color: none; color: var( --whiteDarck );
                font-size: 16px;
                letter-spacing: 0.7px;
            }
            .hd--items:hover , .hd--items:active{
                opacity: 0.8;  
                background-color: rgba(57, 51, 42, 0.26);
                
            }

            .hd--items--1, .hd--items--2, .hd--items--3, .hd--items--4{
                border-bottom: 1px var(--whiteDarck) solid;
            }

            .hd--items--1{
                border-right: 1px var(--whiteDarck) solid;
            }
            .hd--items--2 {
                border-right: 1px var(--whiteDarck) solid;
            }
            .hd--items--3{
                border-right: 1px var(--whiteDarck) solid;
            }
            .hd--items--5{
                border-right: 1px var(--whiteDarck) solid;
            } 
            .hd--items--6{
                border-right: 1px var(--whiteDarck) solid;
            } 
            .hd--items--7{
                border-right: 1px var(--whiteDarck) solid; 
            } 
            .hd--items--8{
                border: none;
                /* border-right: 1px var(--whiteDarck) solid;    */
            }
                .hd__items__a{
                    display: flex; flex-flow: column; justify-content: center;

                    height: 100%; width: 100%;
                    padding: 0%;margin: 0%;

                    text-decoration: none!important;
                    background-color: none; 
                    color: var( --whiteDarck );
                }

/**----------------------------- B T N S  C O N T A C T O  -----------------------*/

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 2rem;

        display: flex; flex-flow: row wrap; 
        justify-content: center;
       
    }
        .hd--btn-contacto{
            background-color: var( --greenLight2 ); color: var( --white );      
        }          
        .hd--btn-presupuesto{
            background-color: var( --whiteDarck ); color: var( --greenLight2  );      
        }                                              

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3rem; width: 15.5rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.2rem 1rem 0.2rem;
            border-radius: 5px;
            font-size: 16px; letter-spacing: 0.5px;
        } 




    /*todo: A el titulo construile una caja contenedora para poder manejar mejor el posicionamineto */


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

@media (min-width: 1484px) and (max-height: 600px) {    
.main{
    /* position: relative; */
    height: 35rem!important; width: 100%!important;
}
.main::after{

    position: absolute; 
    top: 33rem!important; left: 50%;
    height: 3.5rem; width: 3.5px;
    
}
    
.nav{
    height: 5.5rem; width: 100%;
    padding: 0rem 7rem;
   
}
.nav__row{
    box-sizing: border-box;
    height: 100%; width: 1440px ; 
    padding: 0rem 0rem ; 
    border:none; margin: 0% 0% 0% 0%;

    /* background-color: chartreuse; */
    
}
    .nav--contenedor--logo{ 
        height: 5.5rem; width: 12rem;
        margin: auto 0rem;

    }
        .nav--logo{
            height: 100%; width: 100%;
            padding: 0rem;
            margin: 0rem auto;
            
        /* border: solid 1px red; */
        }

                
        .nav-items{
            height: 100%; width: 100%; 
    
            font-size: 14px!important;
            letter-spacing: 1.2px;
        }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 100%; width: 100%;
        display: flex; flex-flow: column wrap; 
        justify-content: center;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            /* width: 70%; */
            width: 1440px; 
            padding: 0rem 16rem ;
            margin: -2rem auto 2rem auto;
            
  
        }
            .hd--title{

                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 2rem;

                line-height: 65px!important;
                font-size: 65px;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; 
            /* width: 70%; */
            width: 1440px;
            padding: 0rem 10rem;
            margin: 0% auto 2.5rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 1.7px;

                display: flex; flex-flow: column; justify-content: center;
                
                font-size: 16px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 1440px;
        margin: 0rem auto;
        
        display: flex; 
        flex-flow: row wrap; justify-content: center;
        
    }
        .hd--btn{
            height: 2.8rem; width: 15.5rem; 
            /* padding: 0.9rem 1.5rem;  */
            margin: 1rem 0.5rem ;
            font-size: 16px; letter-spacing: 0.5px;
        } 
        
                                                    

}

@media (min-width: 1484px) and (min-height: 600px) {

.main::after{

    position: absolute; 
    bottom: -5%!important; left: 50%;
    height: 3.7rem; width: 3.7px;
    
}
.nav{
    height: 5.5rem; width: 100%;
    padding: 0rem 7rem;
   
}
.nav__row{
    box-sizing: border-box;
    height: 100%; width: 1440px ; 
    padding: 0rem 0rem ; 
    border:none; margin: 0% 0% 0% 0%;

    /* background-color: chartreuse; */
    
}
    .nav--contenedor--logo{ 
        height: 5.5rem; width: 13rem;
        margin: auto 0rem;

    }
        .nav--logo{
            height: 100%; width: 100%;
            padding: 0rem;
            margin: 0rem auto;
            
        /* border: solid 1px red; */
        }

                
        .nav-items{
            height: 100%; width: 100%; 
 
            font-size: 14px!important;
            letter-spacing: 1.2px;
        }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 100%; width: 100%;
        display: flex; flex-flow: column wrap; 
        justify-content: center;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 1440px;
            padding: 0rem 15rem; 
            margin: -4rem auto 1rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 2rem;


                line-height: 64px!important;
                font-size: 65px;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 1440px;
            padding: 0rem 5rem;
            margin: 0% auto 3rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 1.7px;

                display: flex; flex-flow: column; justify-content: center;
                
                font-size: 18px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 1440px;
        margin: 0rem auto;   
  
    }
        .hd--btn{
            height: 2.8rem; width: 15.5rem; 
            /* padding: 0.9rem 1.5rem;  */
            margin: 1rem 0.5rem ;
            font-size: 16px; letter-spacing: 0.5px;
        } 
        
                                                    

}

@media (min-width: 1484px) and (min-height: 700px) {

.main::after{

    position: absolute; 
    bottom: -4.8%!important; left: 50%;
    height: 3.7rem; width: 3.7px;
    
}

.nav{
    height: 5.5rem; width: 100%;
    padding: 0rem 7rem;
   
}
.nav__row{
    box-sizing: border-box;
    height: 100%; width: 1440px ; 
    padding: 0rem 0rem ; 
    border:none; margin: 0% 0% 0% 0%;

    /* background-color: chartreuse; */
    
}
    .nav--contenedor--logo{ 
        height: 5.5rem; width: 14rem;
        margin: auto 0rem;

    }
        .nav--logo{
            height: 100%; width: 100%;
            padding: 0rem;
            margin: 0rem auto;
            
        /* border: solid 1px red; */
        }
                
        .nav-items{
            height: 100%; width: 100%; 

            font-size: 14px!important;
            letter-spacing: 1.2px;
        }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 100%; width: 100%;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 1440px;
            padding: 0rem 15rem!important; 
            margin: -5rem auto 3rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; 
                margin: 0%;
                padding: 1rem 2rem;


                line-height: 72px!important;
                font-size: 73px;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 1440px;
            padding: 0rem 5rem;
            margin: 0% auto 3rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 2px;
                
                font-size: 18px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 1440px;
        margin: 0rem auto 0rem auto;
        
    }
        .hd--btn{
            height: 3rem; width: 15.5rem; 
            /* padding: 0.9rem 1.5rem;  */
                margin: 1rem 0.3rem  ;
    
            font-size: 16px; letter-spacing: 0.5px;
        } 
                                                    

}

@media (min-width: 1484px) and (min-height: 880px) {

.main::after{

    position: absolute; 
    bottom: -4.8%!important; left: 50%;
    height: 4rem; width: 3.8px;
    
}

.nav{
    height: 7.5rem; width: 100%;
    padding: 0rem 7rem;
   
}
.nav__row{
    box-sizing: border-box;
    height: 100%; width: 1440px ; 
    padding: 0rem 0rem ; 
    border:none; margin: 0% 0% 0% 0%;

    /* background-color: chartreuse; */
    
}
    .nav--contenedor--logo{ 
        height: 7.5rem; width: 15rem;
        margin: auto 0rem;

    }
        .nav--logo{
            height: 100%; width: 100%;
            padding: 0rem;
            margin: 0rem auto;
            
        /* border: solid 1px red; */
        }

                
        .nav-items{
            height: 100%; width: 100%; 
            /* margin: 5px 5px 5px 5px; */
        
            /* background-color: rgb(255, 247, 0); */
            font-size: 16px!important;
            letter-spacing: 1.2px;
        }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 100%; width: 100%;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 1440px; 
            padding: 0rem 15rem;
            margin: -6rem auto 2rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; 
                margin: 0%;
                padding: 1rem 0rem;

                line-height: 82px!important;
                font-size: 78px!important;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 1440px;
            padding: 0rem 5rem;
            margin: 0% auto 3rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 2px;
                
                font-size: 22px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin: 0rem auto;

        
    }
        .hd--btn{
           
            height: 3.4rem; width: 17.5rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.5rem ;
            border-radius: 5px;
            font-size: 20px; letter-spacing: 0.5px;
        } 

                                                    

}

@media (min-width: 1484px) and (min-height: 1050px) {

.main::after{

    position: absolute; 
    bottom: -2.8%!important; left: 50%;
    height: 5rem; width: 4px;
    
}
    
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 1440px ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
    
        /* background-color: chartreuse; */
        
    }
                
        .nav-items{
            height: 100%; width: 100%; 
          
            font-size: 18px!important;
            letter-spacing: 1.2px;
        }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 100%; width: 100%;
    
 
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 1440px; 
            padding: 0rem 10rem;
            margin: -6rem auto 3rem auto;
            
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 0rem;

                line-height: 94px!important;
                font-size: 85px!important;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 1440px;
            padding: 0rem 5rem;
            margin: 0% auto 5rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 2px;
                
                font-size: 24px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin: 0rem auto;

        
    }
        .hd--btn{
            
            height: 4rem; width: 22.5rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 1.1rem ;
            border-radius: 5px;
            font-size: 22px; letter-spacing: 0.5px;
        } 

                                                    

}

@media (min-width: 1484px) and (min-height: 1300px) {

.main::after{

    position: absolute; 
    bottom: -2.8%!important; left: 50%;
    height: 5rem; width: 5px;
    
}
   
    .nav-ul{

        box-sizing: border-box;
        height: 100%!important;  width: 40rem;
        margin: 0rem;
        padding: 0rem 2rem 0rem 0rem;

    }
        .nav-items{
            height: 100%; width: 100%; 
      
            font-size: 22px!important;
            letter-spacing: 1.2px;
        }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 100%; width: 100%;

    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 1440px; 
            padding: 0rem 10rem;
            margin: -6rem auto 2rem auto;
            
        }
            .hd--title{
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 0rem;

                line-height: 90px!important;
                font-size: 85px!important;
                letter-spacing: 1.5px;
      
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 1440px;
            padding: 0rem 5rem;
            margin: 0% auto 5rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 2px;
                
                font-size: 24px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin: 0rem auto;

        
    }
        .hd--btn{
            
            height: 4rem; width: 22.5rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 1.1rem ;
            border-radius: 5px;
            font-size: 22px; letter-spacing: 0.5px;
        } 

                                                    

}

/**PANTALLAS LARGE VERTICALES*/
@media (min-width: 1484px) and (min-height: 1500px) {

.main{

    height: 55rem!important; width: 100%!important;
}

.main::after{

    position: absolute; 
    top: 53rem!important; left: 50%;
    height: 5rem; width: 5px;
    
}
    
.nav{

    height: 5.5rem; width: 100%;
    padding: 0rem 7rem; border:none; margin: 0%;

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

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 1440px ; 
        padding: 0rem 2rem 0rem 3rem; 
        border:none; margin: 0% 0% 0% 0%;
        
        box-sizing: border-box;
        
        display: flex; flex-flow: row nowrap; 
        justify-content: space-between ; 
        align-items: center;
        

        
    }
        
    .nav--contenedor--logo{
        
        height: 100%; width: 12rem;
        margin: auto 0rem;

    

    }
        .nav--logo{
            height: 100%; width: 100%;
            padding: 0rem;
            margin: 0rem auto;

           /* border: solid 1px red; */

        }    

        .nav-items{
            height: 100%; width: 100%; 
            /* margin: 5px 5px 5px 5px; */
        
            /* background-color: rgb(255, 247, 0); */
            font-size: 18px!important;
            letter-spacing: 1.2px;
        }

/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 100%; width: 100%;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 1440px;
            padding: 0rem 15rem; 
            margin: -6rem auto 2rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 6rem;

                line-height: 70px!important;
                font-size: 70px!important;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 1440px;
            padding: 0rem 0rem;
            margin: 0% auto 3rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 2px;

        
                
                font-size: 20px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        
    }
    .hd--btn{
            
        height: 3.8rem; width: 18.5rem; 
        /* padding: 0.9rem 1.5rem;  */
        border: none; margin: 1rem 1.1rem ;
        border-radius: 5px;
        font-size: 20px; letter-spacing: 0.5px;
    } 
                                        

}


/**NOTEBOOKS*/

@media (max-width: 1484px) and (max-height: 539px) {
.main{
    /* position: relative; */
    height: 35rem!important; width: 100%!important;
}

.main::after{
    display: block;
    position: absolute; 
    top: 33.6rem!important; left: 50%;
    height: 3rem; width: 3.2px;
    
}
 
    .nav{
        height: 5.5rem; width: 100%;
        padding: 0rem 7rem;
       
    }
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 1440px ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
    
        /* background-color: chartreuse; */
        
    }
        .nav--contenedor--logo{ 
            height: 5.5rem; width: 12rem;
            margin: auto 0rem;
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px red; */
            }
        
                .nav-items{
                    height: 100%; width: 100%; 
      
                    font-size: 15px!important;
                    letter-spacing: 1.2px;
                }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 100%; width: 100%;
        display: flex; flex-flow: column wrap; 
        justify-content: center;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 67%; 
            margin: -4rem auto 1rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 8rem;


                line-height: 50px!important;
                font-size: 45px;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 75%;
            margin: 0% auto 2rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 1.6px;

                display: flex; flex-flow: column; justify-content: center;
                
                font-size: 16px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin: 0%;
        
        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 2.8rem; width: 16.8rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.8rem 0rem 0.8rem;
            border-radius: 5px;

            font-size: 16px; letter-spacing: 0.5px;
        } 
                                                    

}

@media (max-width: 1484px) and (min-height: 540px) {

.main::after{

    position: absolute; 
    bottom: -6%!important; left: 50%;
    height: 4rem; width: 3.6px;
    
}
    
  
    .nav{
        height: 5.5rem; width: 100%;
        padding: 0rem 7rem;
       
    }
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 1440px ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
    
        /* background-color: chartreuse; */
        
    }
        .nav--contenedor--logo{ 
            height: 5.5rem; width: 12rem;
            margin: auto 0rem;
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px red; */
            }
    
     
        
            
                .nav-items{
                    height: 100%; width: 100%; 
                    /* margin: 5px 5px 5px 5px; */

                    display: flex; flex-direction: column; 
                    justify-content: center; align-items: center;
                
                    /* background-color: rgb(255, 247, 0); */
                    font-size: 15px!important;
                    letter-spacing: 1.2px;
                }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 100%; width: 100%;
        display: flex; flex-flow: column wrap; 
        justify-content: center;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 67%; 
            margin: -3.8rem auto 1rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 8rem;


                line-height: 57px!important;
                font-size: 50px;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 75%;
            margin: 0% auto 2rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 1.6px;

                display: flex; flex-flow: column; justify-content: center;
                
                font-size: 16px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 2.8rem; width: 17rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.8rem ;
            border-radius: 5px;

            font-size: 16px; letter-spacing: 0.5px;
        } 
                                                    

}

@media (max-width: 1484px) and (min-height: 600px) {

.main::after{

    position: absolute; 
    bottom: -5.5%!important; left: 50%;
    height: 4rem!important; width: 3px!important;
    
}
    
    .nav{
        height: 5.5rem; width: 100%;
        padding: 0rem 7rem;
       
    }
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 1440px ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
    
        /* background-color: chartreuse; */
        
    }
        .nav--contenedor--logo{ 
            height: 5.5rem; width: 12rem;
            margin: auto 0rem;
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px red; */
            }
    
          
            
                .nav-items{
                    height: 100%; width: 100%; 
        
                    font-size: 16px!important;
                    letter-spacing: 1.2px;
                }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 100%; width: 100%;
        display: flex; flex-flow: column wrap; 
        justify-content: center;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 67%; 
            margin: -3.8rem auto 1rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 8rem;


                line-height: 57px!important;
                font-size: 52px;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 75%;
            margin: 0% auto 3rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 1.6px;

                display: flex; flex-flow: column; justify-content: center;
                
                font-size: 17px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 2.8rem; width: 17.7rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.8rem ;
            border-radius: 5px;

            font-size: 17px; letter-spacing: 0.5px;
        } 
                                                    

}

@media (max-width: 1484px) and (min-height: 700px) {

.main::after{

    position: absolute; 
    bottom: -5%!important; left: 50%;
    height: 4.5rem; width: 4px;
    
}
    
    .nav{
        height: 5.5rem; width: 100%;
        padding: 0rem 7rem;
       
    }
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 1440px ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
    
        /* background-color: chartreuse; */
        
    }
        .nav--contenedor--logo{ 
            height: 5.5rem; width: 13rem;
            margin: auto 0rem;
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px red; */
            }
           
            
            .nav-items{
                height: 100%; width: 100%; 
                /* margin: 5px 5px 5px 5px; */
            
                /* background-color: rgb(255, 247, 0); */
                font-size: 16px!important;
                letter-spacing: 1.2px;
            }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 100%; width: 100%;
        display: flex; flex-flow: column wrap; 
        justify-content: center;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 75%; 
            margin: -4rem auto 2rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 6rem;


                line-height: 70px!important;
                font-size: 60px;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 75%;
            margin: 0% auto 3rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 1.6px;

                display: flex; flex-flow: column; justify-content: center;
                
                font-size: 20px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3rem; width: 18.5rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.8rem ;
            border-radius: 5px;

            font-size: 18px; letter-spacing: 0.5px;
        } 
                                                    

}

@media (max-width: 1484px) and (min-height: 800px) {

.main::after{

    position: absolute; 
    bottom: -4.8%!important; left: 50%;
    height: 5rem; width: 4.3px;
    
}
    
.nav{
    height: 5.5rem; width: 100%;
    padding: 0rem 7rem;
    
}
.nav__row{
    box-sizing: border-box;
    height: 100%; width: 1440px ; 
    padding: 0rem 0rem ; 
    border:none; margin: 0% 0% 0% 0%;

    /* background-color: chartreuse; */
    
}
    .nav--contenedor--logo{ 
        height: 5.5rem; width: 13rem;
        margin: auto 0rem;

    }
        .nav--logo{
            height: 100%; width: 100%;
            padding: 0rem;
            margin: 0rem auto;
            
        /* border: solid 1px red; */
        }
          
            
            .nav-items{
                height: 100%; width: 100%; 
       

                font-size: 18px!important;
                letter-spacing: 1.2px;
            }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 100%; width: 100%;
        display: flex; flex-flow: column wrap; justify-content: center;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 85%; 
            margin: -6rem auto 2rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 6rem;

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

                line-height: 75px!important;
                font-size: 68px;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 75%;
            margin: 0% auto 3rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 1.6px;

                display: flex; flex-flow: column; justify-content: center;
                
                font-size: 20px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3rem; width: 18.5rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.8rem ;
            border-radius: 5px;

            font-size: 20px; letter-spacing: 0.5px;
        } 
                                                    

}

@media (max-width: 1484px) and (min-height: 900px) {

.main::after{

    position: absolute; 
    bottom: -4.8%!important; left: 50%;
    height: 5.6rem; width: 4.8px;
    
}
    
   
.nav{
    height: 7.5rem; width: 100%;
    padding: 0rem 7rem;
    
}
.nav__row{
    box-sizing: border-box;
    height: 100%; width: 1440px ; 
    padding: 0rem 0rem ; 
    border:none; margin: 0% 0% 0% 0%;

    /* background-color: chartreuse; */
    
}
    .nav--contenedor--logo{ 
        height: 7.5rem; width: 13.5rem;
        margin: auto 0rem;

    }
        .nav--logo{
            height: 100%; width: 100%;
            padding: 0rem;
            margin: 0rem auto;
            
        /* border: solid 1px red; */
        }      
            
            .nav-items{
                height: 100%; width: 100%; 
            
                font-size: 20px!important;
                letter-spacing: 1.2px;
            }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 100%; width: 100%;
        display: flex; flex-flow: column wrap; 
        justify-content: center;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 75%; 
            margin: -6rem auto 2rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 6rem;

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

                line-height: 75px!important;
                font-size: 65px;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 75%;
            margin: 0% auto 3rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 2px;

                display: flex; flex-flow: column; justify-content: center;
                
                font-size: 20px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3.5rem; width: 18.5rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 1rem ;
            border-radius: 5px;

            font-size: 20px; letter-spacing: 0.5px;
        } 
                                                    

}

@media (max-width: 1484px) and (min-height: 1100px) {

.main::after{

    position: absolute; 
    bottom: -2.8%!important; left: 50%;
    height: 5.6rem; width: 4.8px;
    
}
     
.nav{
    height: 7.5rem; width: 100%;
    padding: 0rem 7rem;
    
}
.nav__row{
    box-sizing: border-box;
    height: 100%; width: 1440px ; 
    padding: 0rem 0rem ; 
    border:none; margin: 0% 0% 0% 0%;

    /* background-color: chartreuse; */
    
}
    .nav--contenedor--logo{ 
        height: 7.5rem; width: 14rem;
        margin: auto 0rem;

    }
        .nav--logo{
            height: 100%; width: 100%;
            padding: 0rem;
            margin: 0rem auto;
            
        /* border: solid 1px red; */
        }      
            
            .nav-items{
                height: 100%; width: 100%; 
            
                font-size: 20px!important;
                letter-spacing: 1.2px;
            }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 100%; width: 100%;
        display: flex; flex-flow: column wrap; 
        justify-content: center;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 75%; 
            margin: -6rem auto 2rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 6rem;


                line-height: 84px!important;
                font-size: 75px;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 75%;
            margin: 0% auto 3rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 2px;

                display: flex; flex-flow: column; justify-content: center;
                
                font-size: 20px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3.5rem; width: 18.5rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 1rem ;
            border-radius: 5px;

            font-size: 20px; letter-spacing: 0.5px;
        } 
                                                    

}

@media (max-width: 1484px) and (min-height: 1400px) {

.main{
    /* position: relative; */
    height: 55rem!important; width: 100%!important;
}

.main::after{

    position: absolute; 
    top: 53rem!important; left: 50%;
    height: 6.5rem; width: 5px;
    
}
    
    
    .nav{
        height: 7.5rem; width: 100%;
        padding: 0rem 7rem;
        
    }
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 1440px ; 
        padding: 0rem 2rem 0rem 3rem; 
        border:none; margin: 0% 0% 0% 0%;
    
        /* background-color: chartreuse; */
        
    }
        .nav--contenedor--logo{ 
            height: 7.5rem; width: 12rem;
            margin: auto 0rem;
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px red; */
            }      
             
            
                .nav-items{
                    height: 100%; width: 100%; 
            
                    font-size: 18px!important;
                    letter-spacing: 1.2px;
                }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 100%; width: 100%;
        display: flex; flex-flow: column wrap; 
        justify-content: center;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 75%; 
            margin: -6rem auto 2rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 6rem;

                line-height: 77px!important;
                font-size: 65px;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 75%;
            margin: 0% auto 3rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 2px;

                display: flex; flex-flow: column; justify-content: center;
                
                font-size: 20px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
                                                    

}

    


@media (max-width: 1368px) and (max-height: 1380px) {
.main{
    /* position: relative; */
    height: 100vh; width: 100%!important;


}
.main::after{

    position: absolute; bottom: -4%; left: 50%;
    height: 6rem; width: 5px;
    
}
          
    .nav{
        height: 7.5rem; width: 100%;
        padding: 0rem 5rem;
        
    }
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
    
        /* background-color: chartreuse; */
        
    }
        .nav--contenedor--logo{ 
            height: 7.5rem; width: 15rem;
            margin: auto 0rem;
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px red; */
            }      
      

        .nav-ul{

            box-sizing: border-box;
            height: 100%!important;  width: 32rem;
            margin: 0rem;
            padding: 0rem 2rem 0rem 0rem;

            
            /* background-color: aqua; */
        }
            .li-items{


                height: 100%; width: 15%; 
                /* background-color: rgb(255, 81, 0); */
            }
                .nav-items{
                    height: 100%; width: 100%; 
                    /* margin: 5px 5px 5px 5px; */

                    display: flex; flex-direction: column; 
                    justify-content: center; align-items: center;
                
                    /* background-color: rgb(255, 247, 0); */
                    font-size: 20px;
                    letter-spacing: 1.6px;
                }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 92%; width: 100%;
        display: flex; flex-flow: column wrap; 
        justify-content: center;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 80%; 
            margin: -9rem auto 0rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 5rem;

                line-height: 88px!important;
                font-size: 80px;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 80%;
            margin: 0% auto 6rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 2px;

                display: flex; flex-flow: column; 
                justify-content: center;
                
                font-size: 20px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
        .hd--btn-contacto{
            border: none; 
        }          
        .hd--btn-presupuesto{
            border: none; 
        }                                              

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3.9rem; width: 19rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 2rem ;
            border-radius: 5px;

            font-size: 20px; letter-spacing: 0.5px;
        } 


}

@media (max-width: 1368px) and (max-height: 1280px) {
.main{

    height: 100vh; width: 100%!important;

}
.main::after{

    position: absolute; bottom: -4.8%; left: 50%;
    height: 6rem; width: 5px;
    
}
      
    .nav{
        height: 7.5rem; width: 100%;
        padding: 0rem 7rem;
        
    }
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
    
        /* background-color: chartreuse; */
        
    }
        .nav--contenedor--logo{ 
            height: 7.5rem; width: 14rem;
            margin: auto 0rem;
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            }      
       

       
        .nav-ul{

            box-sizing: border-box;
            height: 100%!important;  width: 46rem;
            margin: 0rem;
            padding: 0rem 2rem 0rem 0rem;
            
        }
            .li-items{


                height: 100%; width: 15%; 
                /* background-color: rgb(255, 81, 0); */
            }
                .nav-items{
                    height: 100%; width: 100%; 
        
                    font-size: 20px;
                    letter-spacing: 1.6px;
                }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 92%; width: 100%;
        display: flex; flex-flow: column wrap; 
        justify-content: center;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 80%; 
            margin: -8rem auto 0rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 0rem;

                line-height: 86px!important;
                font-size: 75px;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 80%;
            margin: 0% auto 4rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 2px;

                display: flex; flex-flow: column; justify-content: center;
                
                font-size: 20px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
        .hd--btn-contacto{
            border: none; 
        }          
        .hd--btn-presupuesto{
            border: none; 
        }                                              

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3.9rem; width: 19rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 2rem ;
            border-radius: 5px;

            font-size: 20px; letter-spacing: 0.5px;
        } 


}

@media (max-width: 1368px) and (max-height: 1140px) {
.main{
    /* position: relative; */
    height: 100vh; width: 100%!important;

}
.main::after{

    position: absolute; bottom: -4.8%; left: 50%;
    height: 6rem; width: 5px;
    
}
   
.nav{
    height: 7.5rem; width: 100%;
    padding: 0rem 7rem;
    
}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
    
        /* background-color: chartreuse; */
        
    }
        .nav--contenedor--logo{ 
            height: 7.5rem; width: 14rem;
            margin: auto 0rem;
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px red; */
            }      
      
    
        .nav-ul{

            box-sizing: border-box;
            height: 100%!important;  width: 45rem;
            margin: 0rem;
            padding: 0rem 2rem 0rem 0rem;
      
            /* background-color: aqua; */
        }
            .li-items{

                height: 100%; width: 15%; 
                /* background-color: rgb(255, 81, 0); */
            }
                .nav-items{
                    height: 100%; width: 100%; 
            
                    font-size: 20px;
                    letter-spacing: 1.6px;
                }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 92%; width: 100%;
        display: flex; flex-flow: column wrap; 
        justify-content: center;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 80%; 
            margin: -6rem auto 0rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 6rem;

                line-height: 84px!important;
                font-size: 70px;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 80%;
            margin: 0% auto 4rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 2px;

                display: flex; flex-flow: column; justify-content: center;
                
                font-size: 20px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
        .hd--btn-contacto{
            border: none; 
        }          
        .hd--btn-presupuesto{
            border: none; 
        }                                              

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3.9rem; width: 18.5rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 1rem 1rem 1rem;
            border-radius: 5px;

            font-size: 20px; letter-spacing: 0.5px;
        } 


}

/* Ipad Pro */
@media (max-width: 1368px) and (max-height: 1024px) {
.main{
    /* position: relative; */
    height: 100vh; width: 100%!important;

}
.main::after{

    position: absolute; 
    bottom: -3.8%!important; left: 50%;
    height: 6rem; width: 5px;
    
}
   
    
.nav{
    height: 7.5rem; width: 100%;
    padding: 0rem 7rem;
    
}
.nav__row{
    box-sizing: border-box;
    height: 100%; width: 100% ; 
    padding: 0rem 0rem ; 
    border:none; margin: 0% 0% 0% 0%;

    /* background-color: chartreuse; */
    
}
    .nav--contenedor--logo{ 
        height: 7.5rem; width: 14rem;
        margin: auto 0rem;

    }
        .nav--logo{
            height: 100%; width: 100%;
            padding: 0rem;
            margin: 0rem auto;
            
        /* border: solid 1px red; */
        }      
   
        
        .nav-ul{

            box-sizing: border-box;
            height: 100%!important;  width: 38rem;
            margin: 0rem;
            padding: 0rem 2rem 0rem 0rem;
    
        }
            .li-items{

                height: 100%; width: 15%; 
                /* background-color: rgb(255, 81, 0); */
            }
                .nav-items{
                    height: 100%; width: 100%; 
  
                
                    font-size: 20px;
                    letter-spacing: 1.6px;
                }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 90%; width: 100%;
        display: flex; flex-flow: column wrap; 
        justify-content: center;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 80%; 
            margin: -6rem auto 0rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 6rem;

                line-height: 70px!important;
                font-size: 65px;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 80%;
            margin: 0% auto 4rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 2px;

                display: flex; flex-flow: column; justify-content: center;
                
                font-size: 20px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
        .hd--btn-contacto{
            border: none; 
        }          
        .hd--btn-presupuesto{
            border: none; 
        }                                              

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3.9rem; width: 18.5rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 1rem 1rem 1rem;
            border-radius: 5px;

            font-size: 20px; letter-spacing: 0.5px;
        } 


}

/*Surface Pro 7 */
@media (max-width: 1368px) and (max-height: 912px) {
.main{
    /* position: relative; */
    height: 100vh; width: 100%!important;
}
.main::after{

    position: absolute; bottom: -4%; left: 50%;
    height: 5rem; width: 4.8px;
    
}
  
    
.nav{
    height: 6.5rem; width: 100%;
    padding: 0rem 7rem;
    
}
.nav__row{
    box-sizing: border-box;
    height: 100%; width: 100% ; 
    padding: 0rem 0rem ; 
    border:none; margin: 0% 0% 0% 0%;

    /* background-color: chartreuse; */
    
}
    .nav--contenedor--logo{ 
        height: 6.5rem; width: 13.5rem;
        margin: auto 0rem;

    }
        .nav--logo{
            height: 100%; width: 100%;
            padding: 0rem;
            margin: 0rem auto;
            
        /* border: solid 1px red; */
        }      
      
        
  
        .nav-ul{

            box-sizing: border-box;
            height: 100%!important;  width: 39rem;
            margin: 0rem;
            padding: 0rem 2rem 0rem 0rem;
   
            
            /* background-color: aqua; */
        }
            .li-items{
                height: 100%; width: 15%; 
 
            }
                .nav-items{
                    height: 100%; width: 100%; 
            
                    font-size: 16px!important;
                    letter-spacing: 1.2px;
                }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 90%; width: 100%;
        display: flex; flex-flow: column wrap; 
        justify-content: center;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 75%; 
            margin: -6rem auto 0rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 4rem;

                line-height: 69px!important;
                font-size: 60px;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 75%;
            margin: 0% auto 3rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 2px;

                display: flex; flex-flow: column; justify-content: center;
                
                font-size: 20px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
        .hd--btn-contacto{
            border: none; 
        }          
        .hd--btn-presupuesto{
            border: none; 
        }                                              

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3.8rem; width: 17.9rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.5rem 1rem 0.5rem;
            border-radius: 5px;

            font-size: 20px; letter-spacing: 0.5px;
        } 


}

@media (max-width: 1368px) and (max-height: 770px) {
.main{
    height: 100vh; width: 100%!important;

}
.main::after{

    position: absolute; 
    bottom: -6%; left: 50%;
    height: 5rem; width: 4.8px;
    
}
  
    
.nav{
    height: 5.5rem; width: 100%;
    padding: 0rem 7rem;
    
}
.nav__row{
    box-sizing: border-box;
    height: 100%; width: 100% ; 
    padding: 0rem 0rem ; 
    border:none; margin: 0% 0% 0% 0%;

    /* background-color: chartreuse; */
    
}
    .nav--contenedor--logo{ 
        height: 5.5rem; width: 12rem;
        margin: auto 0rem;

    }
        .nav--logo{
            height: 100%; width: 100%;
            padding: 0rem;
            margin: 0rem auto;
            
        /* border: solid 1px red; */
        }      
  
        

        .nav-ul{

            box-sizing: border-box;
            height: 100%!important;  width: 39rem;
            margin: 0rem;
            padding: 0rem 2rem 0rem 0rem;

        }
            .li-items{
                height: 100%; width: 15%; 
                /* background-color: rgb(255, 81, 0); */
            }
                .nav-items{
                    height: 100%; width: 100%; 
   
                    font-size: 16px!important;
                    letter-spacing: 1.2px;
                }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 90%; width: 100%;
        display: flex; flex-flow: column wrap; 
        justify-content: center;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 75%; 
            margin: -5rem auto 2rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 4rem;

                line-height: 70px!important;
                font-size: 60px!important;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 75%;
            margin: 0% auto 3rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 2px;

                display: flex; flex-flow: column; justify-content: center;
                
                font-size: 20px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
        .hd--btn-contacto{
            border: none; 
        }          
        .hd--btn-presupuesto{
            border: none; 
        }                                              

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3.5rem; width: 17.9rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.5rem 1rem 0.5rem;
            border-radius: 5px;

            font-size: 20px; letter-spacing: 0.5px;
        } 


}

@media (max-width: 1368px) and (max-height: 676px) {
.main{
    height: 100vh; width: 100%!important;
}
.main::after{

    position: absolute; 
    bottom: -6.4%; left: 50%;
    height: 5rem; width: 4.8px;
    
}
    
.nav{
    height: 5.5rem; width: 100%;
    padding: 0rem 7rem;
    
}
.nav__row{
    box-sizing: border-box;
    height: 100%; width: 100% ; 
    padding: 0rem 0rem ; 
    border:none; margin: 0% 0% 0% 0%;

    /* background-color: chartreuse; */
    
}
    .nav--contenedor--logo{ 
        height: 5.5rem; width: 12rem;
        margin: auto 0rem;

    }
        .nav--logo{
            height: 100%; width: 100%;
            padding: 0rem;
            margin: 0rem auto;
            
        /* border: solid 1px red; */
        }      
  
        
        .nav-ul{

            box-sizing: border-box;
            height: 100%!important;  width: 34rem;
            margin: 0rem;
            padding: 0rem 2rem 0rem 0rem;

        }
            .li-items{
                height: 100%; width: 15%; 
                /* background-color: rgb(255, 81, 0); */
            }
                .nav-items{
                    height: 100%; width: 100%; 
                    /* margin: 5px 5px 5px 5px; */

                    /* background-color: rgb(255, 247, 0); */
                    font-size: 16px!important;
                    letter-spacing: 1.2px;
                }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 90%; width: 100%;
        display: flex; flex-flow: column wrap; 
        justify-content: center;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 75%; 
            margin: -3rem auto 2rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 4rem;

                line-height: 57px!important;
                font-size: 50px!important;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 75%;
            margin: 0% auto 3rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 1.7px;

                display: flex; flex-flow: column; justify-content: center;
                
                color: var( --white )!important;
                font-size: 17px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
        .hd--btn-contacto{
            border: none; 
        }          
        .hd--btn-presupuesto{
            border: none; 
        }                                              

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3rem; width: 16.8rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.5rem 1rem 0.5rem;
       

            font-size: 17px; letter-spacing: 0.5px;
        } 


}

@media (max-width: 1368px) and (max-height: 585px) {
.main{
    height: 100vh; width: 100%!important;
}
.main::after{

    position: absolute; 
    bottom: -6%!important; left: 50%;
    height: 4rem; width: 4.5px;
    
}
    
   
.nav{
    height: 5.5rem; width: 100%;
    padding: 0rem 7rem;
    
}
.nav__row{
    box-sizing: border-box;
    height: 100%; width: 100% ; 
    padding: 0rem 0rem ; 
    border:none; margin: 0% 0% 0% 0%;

    /* background-color: chartreuse; */
    
}
    .nav--contenedor--logo{ 
        height: 5.5rem; width: 12rem;
        margin: auto 0rem;

    }
        .nav--logo{
            height: 100%; width: 100%;
            padding: 0rem;
            margin: 0rem auto;
            
        /* border: solid 1px red; */
        }      
          

        .nav-ul{

            box-sizing: border-box;
            height: 100%!important;  width: 32rem;
            margin: 0rem;
            padding: 0rem 2rem 0rem 0rem;
      
        }
            .li-items{

                height: 100%; width: 15%; 
                /* background-color: rgb(255, 81, 0); */
            }
                .nav-items{
                    height: 100%; width: 100%; 
                    /* margin: 5px 5px 5px 5px; */

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

                    color: var( --grayLight )!important;
                    /* background-color: rgb(255, 247, 0); */
                    font-size: 16px!important;
                    letter-spacing: 1.2px;
                }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 90%; width: 100%;
        display: flex; flex-flow: column wrap; justify-content: center;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 75%; 
            margin: -3rem auto 1rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 6rem;

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

                color: var( --white )!important;
                line-height: 60px!important;
                font-size: 40px;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 78%;
            margin: 0% auto 2rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 2px;

                display: flex; flex-flow: column; justify-content: center;
                
                font-size: 17px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
        .hd--btn-contacto{
            border: none; 
        }          
        .hd--btn-presupuesto{
            border: none; 
        }                                              

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3.2rem; width: 17.9rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.5rem 1rem 0.5rem;
            border-radius: 5px;

            font-size: 20px; letter-spacing: 0.5px;
        } 


}


/* Listo */


@media (max-width:1281px) and (max-height: 854px) {
.main{
    height: 100vh; width: 100%!important;

}
.main::after{

    position: absolute; 
    bottom: -4%; left: 50%;
    height: 4.5rem; width: 4.5px;
    
}
   
.nav{
    height: 6.5rem; width: 100%;
    padding: 0rem 7rem;
    
}
.nav__row{
    box-sizing: border-box;
    height: 100%; width: 100% ; 
    padding: 0rem 0rem ; 
    border:none; margin: 0% 0% 0% 0%;

    /* background-color: chartreuse; */
    
}
    .nav--contenedor--logo{ 
        height: 6.5rem; width: 13rem;
        margin: auto 0rem;

    }
        .nav--logo{
            height: 100%; width: 100%;
            padding: 0rem;
            margin: 0rem auto;
            
        /* border: solid 1px red; */
        }      
    
 
        .nav-ul{

            box-sizing: border-box;
            height: 100%!important;  width: 34rem;
            margin: 0rem;
            padding: 0rem 2rem 0rem 0rem;
            
         
        }
            .li-items{
                height: 100%; width: 15%; 
                /* background-color: rgb(255, 81, 0); */
            }
                .nav-items{
                    height: 100%; width: 100%; 
              
                    font-size: 18px;
                    letter-spacing: 1.2px;
                }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 90%; width: 100%;
        display: flex; flex-flow: column wrap; 
        justify-content: center;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 75%; 
            margin: -4.5rem auto 1rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 4rem;

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

           
                line-height: 62px!important;
                font-size: 55px;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 75%;
            margin: 0% auto 3rem auto;
              
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto;

                display: flex; flex-flow: column; justify-content: center;
                
                font-size: 18px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
        .hd--btn-contacto{
            border: none; 
        }          
        .hd--btn-presupuesto{
            border: none; 
        }                                              

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3.5rem; width: 17.5rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.5rem 1rem 0.5rem;
            border-radius: 5px;

            font-size: 18px; letter-spacing: 0.5px;
        } 




    .main--content-cotizar{
        /* position: absolute; */
        display: none;
        height: 80%; width: 40%;
        background-color: rgba(0, 0, 0, 0.321);
        /* background: linear-gradient(rgb(5,7,12,0,75),rgb(5,7,12,0,75)); */
    }



}

@media (max-width:1281px) and (max-height: 700px) {
.main{
    height: 45rem; width: 100%!important;

}
.main::after{

    position: absolute; 
    top: 43rem; left: 50%;

    height: 3rem; width: 3px;
    
}
  
.nav{
    height: 5.5rem; width: 100%;
    padding: 0rem 6rem;
    
}
.nav__row{
    box-sizing: border-box;
    height: 100%; width: 100% ; 
    padding: 0rem 0rem ; 
    border:none; margin: 0% 0% 0% 0%;

    /* background-color: chartreuse; */
    
}
    .nav--contenedor--logo{ 
        height: 5.5rem; width: 12rem;
        margin: auto 0rem;

    }
        .nav--logo{
            height: 100%; width: 100%;
            padding: 0rem;
            margin: 0rem auto;
            
        /* border: solid 1px red; */
        }      
    
    .nav-ul{

        box-sizing: border-box;
        height: 100%!important;  width: 32rem;
        margin: 0rem;
        padding: 0rem 0rem 0rem 0rem;
    
    }      

            .li-items{
                height: 100%; width: 15%; 

            }
                .nav-items{
                    height: 100%; width: 100%; 

                    font-size: 15px!important;
                    letter-spacing: 1.2px;
                }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 90%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: center;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 75%; 
            margin: -4.5rem auto 1rem auto!important;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 6rem;

                line-height: 64px!important;
                font-size: 48px;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 75%;
            margin: 0% auto 3rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto;
                border-width: 1.5px;
                
                font-size: 18px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
        .hd--btn-contacto{
            border: none; 
        }          
        .hd--btn-presupuesto{
            border: none; 
        }                                              

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3rem; width: 17rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.5rem 1rem 0.5rem;
            border-radius: 5px;

            font-size: 16px; letter-spacing: 0.5px;
        } 

}


@media (max-width: 1281px) and (min-height: 920px) {

.main::after{

    position: absolute; 
    bottom: -3.4%!important; left: 50%;
    height: 6.5rem; width: 5px;
    
}
   
.nav{
    height: 7.5rem; width: 100%;
    padding: 0rem 7rem;
    
}
.nav__row{
    box-sizing: border-box;
    height: 100%; width: 100% ; 
    padding: 0rem 0rem ; 
    border:none; margin: 0% 0% 0% 0%;

    /* background-color: chartreuse; */
    
}
    .nav--contenedor--logo{ 
        height: 7.5rem; width: 14rem;
        margin: auto 0rem;

    }
        .nav--logo{
            height: 100%; width: 100%;
            padding: 0rem;
            margin: 0rem auto;
            
        /* border: solid 1px red; */
        }      
    
    .nav-ul{

        box-sizing: border-box;
        height: 100%!important;  width: 36rem;
        margin: 0rem;
        padding: 0rem 0rem 0rem 0rem;
    
    }
        
            
            .nav-items{
                height: 100%; width: 100%; 
                /* margin: 5px 5px 5px 5px; */

                display: flex; flex-direction: column; 
                justify-content: center; align-items: center;
            
                /* background-color: rgb(255, 247, 0); */
                font-size: 20px!important;
                letter-spacing: 1.2px;
            }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 100%; width: 100%;
        display: flex; flex-flow: column wrap; 
        justify-content: center;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 80%; 
            margin: -9rem auto 2rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 6rem;

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

                line-height: 80px!important;
                font-size: 65px!important;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 75%;
            margin: 0% auto 5rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 2px;

                display: flex; flex-flow: column; justify-content: center;
                
                font-size: 20px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 4rem; width: 20rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.5rem 1rem 0.5rem;
            border-radius: 5px;

            font-size: 20px; letter-spacing: 0.5px;
        } 

}

@media (max-width: 1281px) and (min-height: 1157px) {

.main{
    height: 55rem;
}
.main::after{

    position: absolute; 
    top: 53rem!important; left: 50%;
    height: 6.5rem; width: 5px;
    
}
    
   
.nav{
    height: 7.5rem; width: 100%;
    padding: 0rem 5rem;
    
}
.nav__row{
    box-sizing: border-box;
    height: 100%; width: 100% ; 
    padding: 0rem 0rem ; 
    border:none; margin: 0% 0% 0% 0%;

    /* background-color: chartreuse; */
    
}
    .nav--contenedor--logo{ 
        height: 7.5rem; width: 14rem;
        margin: auto 0rem;

    }
        .nav--logo{
            height: 100%; width: 100%;
            padding: 0rem;
            margin: 0rem auto;
            
        /* border: solid 1px red; */
        }      
  
            .nav-items{
                height: 100%; width: 100%; 

            
                font-size: 18px!important;
                letter-spacing: 1.2px;
            }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 100%; width: 100%;
        display: flex; flex-flow: column wrap; 
        justify-content: center;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 80%; 
            margin: -5rem auto 3rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 6rem;

                line-height: 74px!important;
                font-size: 75px!important;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 75%;
            margin: 0% auto 4rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 2px;

                display: flex; flex-flow: column; 
                justify-content: center;
                
                font-size: 20px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; 
        justify-content: center;
        
    }
        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3.6rem; width: 18rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.5rem 1rem 0.5rem;
            border-radius: 5px;

            font-size: 18px; letter-spacing: 0.5px;
        } 

}

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

@media (max-width: 1084px) and (max-height: 1168px) {

    .main{  height: 75vh; width: 100%!important; }
    
    .main::after{
    
        position: absolute; 
        bottom: 22%!important; left: 50%;
    
        height: 6.5rem; width: 3.5px;
    
        
    }
     
    .nav{
        height: 6.5rem; width: 100%;
        padding: 0rem 3rem;
    
    }
        .nav__row{
            box-sizing: border-box;
            height: 100%; width: 100% ; 
            padding: 0rem 0rem ; 
            border:none; margin: 0% 0% 0% 0%;
        
            /* background-color: chartreuse; */
            
        }
            .nav--contenedor--logo{ 
                height: 6.5rem; width: 13rem;
                margin: auto 0rem;
        
            }
                .nav--logo{
                    height: 100%; width: 100%;
                    padding: 0rem;
                    margin: 0rem auto;
                    
                /* border: solid 1px red; */
                }      
             
            .nav-ul{
            
                box-sizing: border-box;
                height: 100%!important;  width: 32rem;
                margin: 0rem;
                padding: 0rem 2rem 0rem 0rem;
                
            }
                .li-items{
    
                    height: 100%; width: 15%; 
             
                }
                    .nav-items{
                        box-sizing: border-box;
                        height: 100%; width: 100%; 
                
                        font-size: 16px!important;
                    }
    
    /** ----------------------------- P O R T A D A -----------------------*/
    
        .hd--content-position{ 
            height: 94%; width: 100%;
    
    
        }
    
        /**------------- T I T L E ------------------------*/
    
            .hd--conteiner--title{
                height: 30%;
                width: 90%; 
                margin: -2rem auto 0rem auto;
                
            }
                .hd--title{
                    /* justify-self: flex-end; */
                    height: 100%; width: 100%; margin: 0%;
                    padding: 1rem 5rem;
                
                    font-size: 55px;
                    letter-spacing: 2px;
                    line-height: 65px!important;
    
                }
    
    /**------------ S E R V I C I O S -------------------------------------------*/
    
            .hd--conteiner--servicios{ 
                /* border: 1px solid red;     */
    
                height: 27%; width: 85%;
                margin: 2rem auto 3rem auto;
                box-sizing: border-box!important;
                
                
                
            }
                .hd--items{
                    height: 100%; width: 100%; 
                    padding: 0rem 0.5rem 0rem 0.5rem; margin: auto;
    
                    display: flex; flex-flow: column; 
                    justify-content: center;
                    
                    border-width: 1.5px;
                    background-color: none; 
                    font-size: 17px;
                    letter-spacing: 0.7px;
                }
    
    /**------------- B T N S  C O N T A C T O ------------------------------*/    
    
        .hd--conteiner--btns{
            /* border: 1px solid rgb(255, 111, 0); */
            width: 100%;
            margin-top: 0rem;
            
            display: flex; flex-flow: row wrap; 
            justify-content: center;
            
        }
                                                        
    
            .hd--btn{
                box-sizing: border-box;
                display: inline-block;
                height: 3rem; width: 16rem; 
                /* padding: 0.9rem 1.5rem;  */
                border: none; margin: 1rem 0.4rem 1rem 0.4rem;
                border-radius: 5px;
    
                font-size: 16px; letter-spacing: 0.9px;
            } 
    
    
    
    
    }

@media (max-width:1084px) and (max-height: 768px) {

.main{  height: 35rem;  }

.main::after{

    position: absolute; 
    top: 33.7rem; left: 50%;
    height: 2.8rem!important; width: 3px!important;
    display: block;
    
}
    
.nav{
    height: 6.5rem; width: 100%;
    padding: 0rem 3rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        
    }
        .nav--contenedor--logo{ 
            height: 5.5rem; width: 12rem;
            margin: auto 0rem;
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px red; */
            }      
        
        .nav-ul{
        
            box-sizing: border-box;
            height: 100%!important;  width: 32rem;
            margin: 0rem;
            padding: 0rem 2rem 0rem 0rem;

            
            /* background-color: aqua; */
        }
            .li-items{
                height: 100%; width: 15%; 
                /* background-color: rgb(255, 81, 0); */
            }
                .nav-items{
                    box-sizing: border-box;
                    height: 100%; width: 100%; 
    
                    font-size: 16px;
                }

/** ----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 94%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: center;
        

    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 75%; 
            margin: -4rem auto 0rem auto;
            
        }
            .hd--title{
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 4rem;
            
                font-size: 51px!important;
                letter-spacing: 2px;
                line-height: 51px!important;

            }

/**------------ S E R V I C I O S -------------------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 27%; width: 80%;
            margin: 0.5rem auto 2rem auto;
            box-sizing: border-box!important;
            
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 0.5rem 0rem 0.5rem; margin: auto;

                background-color: none; 
                font-size: 16px;
                letter-spacing: 0.7px;
            }
        

/**------------- B T N S  C O N T A C T O ------------------------------*/    

    .hd--conteiner--btns{
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; 
        justify-content: center;
        
    }
        .hd--btn-contacto{
            border: none; 
        }          
        .hd--btn-presupuesto{
            border: none; 
        }                                              

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 2.8rem; width: 15rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.4rem 1rem 0.4rem;
            border-radius: 5px;

            font-size: 16px; letter-spacing: 0.9px;
        } 




}

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

@media (max-width: 1024px) and (min-height: 1369px) {

.main{
    height: 55rem;
}
.main::after{

    position: absolute; 
    top: 53rem!important; left: 50%;
    height: 6.5rem; width: 5px;
    
}
    
    
.nav{
    height: 7.5rem; width: 100%;
    padding: 0rem 3rem;
    
}
.nav__row{
    box-sizing: border-box;
    height: 100%; width: 100% ; 
    padding: 0rem 0rem ; 
    border:none; margin: 0% 0% 0% 0%;

    /* background-color: chartreuse; */
    
}
    .nav--contenedor--logo{ 
        height: 7.5rem; width: 14rem;
        margin: auto 0rem;

    }
        .nav--logo{
            height: 100%; width: 100%;
            padding: 0rem;
            margin: 0rem auto;
            
        /* border: solid 1px red; */
        }      
        
    .nav-ul{

        box-sizing: border-box;
        height: 100%!important;  width: 30rem;
        margin: 0rem;
        padding: 0rem 2rem 0rem 0rem;
        
        
    }
            .nav-items{
                height: 100%; width: 100%; 

            
                font-size: 18px!important;
                letter-spacing: 1.2px;
            }
/**----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 100%; width: 100%;
        display: flex; flex-flow: column wrap; 
        justify-content: center;
    
        /* background-color: aqua; */
    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 80%; 
            margin: -5rem auto 2rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 6rem;

                line-height: 70px!important;
                font-size: 55px;
                letter-spacing: 1.5px;
                /* background-color: rgb(56, 183, 24); */
            }

/**--------------- S E R V I C I O S  -----------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 23%; width: 80%;
            margin: 0% auto 5rem auto;
                
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 1rem 0rem 1rem; margin: auto; 
                border-width: 1.8px;

                display: flex; flex-flow: column; 
                justify-content: center;
                
                font-size: 20px;
                letter-spacing: 0.7px;
            }

/**--------------- B T N S  C O N T A C T O   -----------------------------------*/   

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; 
        justify-content: center;
        
    }
        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3.3rem; width: 18rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.5rem 1rem 0.5rem;
            border-radius: 5px;

            font-size: 20px; letter-spacing: 0.5px;
        } 

}

/* Ipad Pro */
@media (max-width: 1024px) and (max-height: 1368px) {

.main{
    height: 75vh; width: 100%!important; 

}
.main::after{

    position: absolute; 
    bottom: 41%!important; left: 50%;
    height: 6.5rem; width: 3.5px;
    display: none;

}     
  
.nav{
    height: 6.5rem; width: 100%;
    padding: 0rem 3rem;
    background-color: var( --opacity2 );
}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
    
        /* background-color: chartreuse; */
        
    }
        .nav--contenedor--logo{ 
            height: 6.5rem; width: 13rem;
            margin: auto 0rem;
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px red; */
            }      
        
        .nav-ul{
    
            box-sizing: border-box;
            height: 100%!important;  width: 34rem;
            margin: 0rem;
            padding: 0rem 0rem 0rem 0rem;
        
        }
  
        .nav-ul{
        
            box-sizing: border-box;
            height: 100%!important;  width: 32rem;
            margin: 0rem;
            padding: 0rem 2rem 0rem 0rem;
   
        }
            .li-items{

                height: 100%; width: 15%; 
                /* background-color: rgb(255, 81, 0); */
            }
                .nav-items{
                    box-sizing: border-box;
                    height: 100%; width: 100%; 
         
                    font-size: 18px!important;
                }

/** ----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 94%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: center;
        
        /* background-color: aqua; */
        background-color: var(  --opacity2 );

    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%; width: 90%; 
            margin: -8rem auto 0rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 5rem;
            
                font-size: 55px;
                letter-spacing: 2px;
                line-height: 65px!important;

                /* background-color: rgb(56, 183, 24); */
            }

/**------------ S E R V I C I O S -------------------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 27%; width: 85%;
            margin: 0.5rem auto 4rem auto;
            box-sizing: border-box!important;
            
            
            
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 0.5rem 0rem 0.5rem; margin: auto;

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

                background-color: none; color: var( --whiteDarck );
                font-size: 19px;
                letter-spacing: 0.7px;
            }
            .hd--items--1, .hd--items--2, .hd--items--3, .hd--items--4{
                border-bottom: 2px var(--whiteDarck) solid;
            }

            .hd--items--1, .hd--items--2, .hd--items--3, .hd--items--5, .hd--items--6, .hd--items--7 {
                border-right: 2px var(--whiteDarck) solid;
            }
        
            
            .hd--items--8{
                border: none;
                /* border-right: 1px var(--whiteDarck) solid;    */
            }

/**------------- B T N S  C O N T A C T O ------------------------------*/    

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
        .hd--btn-contacto{
            border: none; 
        }          
        .hd--btn-presupuesto{
            border: none; 
        }                                              

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3.9rem; width: 17.9rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.4rem 1rem 0.4rem;
            border-radius: 5px;

            font-size: 19px; letter-spacing: 0.9px;
        } 




}

@media (max-width: 1024px) and (max-height: 1168px) {

.main{  height: 75vh; width: 100%!important; }

.main::after{

    position: absolute; 
    bottom: 22%!important; left: 50%;

    height: 6.5rem; width: 3.5px;

    
}
 
.nav{
    height: 6.5rem; width: 100%;
    padding: 0rem 3rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
    
        /* background-color: chartreuse; */
        
    }
        .nav--contenedor--logo{ 
            height: 6.5rem; width: 13rem;
            margin: auto 0rem;
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px red; */
            }      
         
        .nav-ul{
        
            box-sizing: border-box;
            height: 100%!important;  width: 32rem;
            margin: 0rem;
            padding: 0rem 2rem 0rem 0rem;
            
            /* background-color: aqua; */
        }
            .li-items{

                height: 100%; width: 15%; 
                /* background-color: rgb(255, 81, 0); */
            }
                .nav-items{
                    box-sizing: border-box;
                    height: 100%; width: 100%; 
                    /* margin: 5px 5px 5px 5px; */


                    /* background-color: rgb(255, 247, 0); */
                    font-size: 19px;
                }

/** ----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 94%; width: 100%;


    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 90%; 
            margin: -2rem auto 0rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 5rem;
            
                font-size: 55px;
                letter-spacing: 2px;
                line-height: 65px!important;

                /* background-color: rgb(56, 183, 24); */
            }

/**------------ S E R V I C I O S -------------------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 27%; width: 85%;
            margin: 2rem auto 3rem auto;
            box-sizing: border-box!important;
            
            
            
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 0.5rem 0rem 0.5rem; margin: auto;

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

                background-color: none; color: var( --whiteDarck );
                font-size: 19px;
                letter-spacing: 0.7px;
            }

/**------------- B T N S  C O N T A C T O ------------------------------*/    

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
                                                    

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3.9rem; width: 17.9rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.4rem 1rem 0.4rem;
            border-radius: 5px;

            font-size: 19px; letter-spacing: 0.9px;
        } 




}

@media (max-width: 1024px) and (max-height: 968px) {

.main{  height: 75vh; width: 100%!important; }

.main::after{

    position: absolute; 
    bottom: 22%!important; left: 50%;

    height: 6.5rem; width: 3.5px;

    
}
 
.nav{
    height: 6.5rem; width: 100%;
    padding: 0rem 3rem;
    background-color: var( --opacity2 );
}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
    
        /* background-color: chartreuse; */
        
    }
        .nav--contenedor--logo{ 
            height: 6.5rem; width: 13rem;
            margin: auto 0rem;
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px red; */
            }      
       

        .nav-ul{
        
            box-sizing: border-box;
            height: 100%!important;  width: 32rem;
            margin: 0rem;
            padding: 0rem 2rem 0rem 0rem;
            
            /* background-color: aqua; */
        }
            .li-items{

                height: 100%; width: 15%; 
                /* background-color: rgb(255, 81, 0); */
            }
                .nav-items{
                    box-sizing: border-box;
                    height: 100%; width: 100%; 
                    /* margin: 5px 5px 5px 5px; */


                    /* background-color: rgb(255, 247, 0); */
                    font-size: 17px!important;
                }

/** ----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 94%; width: 100%;


    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 90%; 
            margin: -2rem auto 1rem auto!important;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 3rem;
            
                font-size: 60px!important;
                letter-spacing: 2px;
                line-height: 64px!important;

                /* background-color: rgb(56, 183, 24); */
            }

/**------------ S E R V I C I O S -------------------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 27%; width: 85%;
            margin: 1rem auto 3rem auto;
            box-sizing: border-box!important;
            
            
            
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 0.5rem 0rem 0.5rem; margin: auto;

                display: flex; flex-flow: column; justify-content: center;
        
                border-width: 1.7px;
                background-color: none; color: var( --whiteDarck );
                font-size: 19px;
                letter-spacing: 0.7px;
            }

/**------------- B T N S  C O N T A C T O ------------------------------*/    

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; 
        justify-content: center;
        
    }
                                                 

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3.4rem; width: 17.9rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.4rem 1rem 0.4rem;
            border-radius: 5px;

            font-size: 19px; letter-spacing: 0.9px;
        } 




}

@media (max-width: 1030px) and (max-height: 868px) {

.main{

    height: 100vh; width: 100%!important;

}
.main::after{
  
    position: absolute; 
    bottom: -5%!important; left: 50%;
    height: 4.5rem; width: 3.3px;
    
}
 
    .nav{
        height: 7.5rem; width: 100%;
        padding: 0rem 3rem;
        background-color: var( --opacity1 );
    }
        .nav__row{
            box-sizing: border-box;
            height: 100%; width: 100% ; 
            padding: 0rem 0rem ; 
            border:none; margin: 0% 0% 0% 0%;
        
            /* background-color: chartreuse; */
            
        }
            .nav--contenedor--logo{ 
                height: 7.5rem; width: 14rem;
                margin: auto 0rem;
        
            }
                .nav--logo{
                    height: 100%; width: 100%;
                    padding: 0rem;
                    margin: 0rem auto;
                    
                /* border: solid 1px red; */
                }      
               

        .nav-ul{
        
            box-sizing: border-box;
            height: 100%!important;  width: 32rem;
            margin: 0rem;
            padding: 0rem 2rem 0rem 0rem;
  
        }
            .li-items{

                height: 100%; width: 15%; 
                /* background-color: rgb(255, 81, 0); */
            }
                .nav-items{
                    box-sizing: border-box;
                    height: 100%; width: 100%; 
       
                    font-size: 16px!important;
                }

/** ----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 94%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: center;
        
        /* background-color: aqua; */
        background-color: var( --opacity1 );

    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 80%; 
            margin: -4.5rem auto 0rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 6rem;
            
                font-size: 65px!important;
                letter-spacing: 3px;
                line-height: 65px!important;

                /* background-color: rgb(56, 183, 24); */
            }

/**------------ S E R V I C I O S -------------------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 27%; width: 85%;
            margin: 1.5rem auto 2rem auto;
            box-sizing: border-box!important;
            
            
            
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 0.5rem 0rem 0.5rem; margin: auto;

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

                background-color: none; color: var( --whiteDarck );
                font-size: 18px;
                letter-spacing: 0.7px;
            }
            .hd--items--1, .hd--items--2, .hd--items--3, .hd--items--4{
                border-bottom: 1.6px var(--whiteDarck) solid;
            }

            .hd--items--1, .hd--items--2, .hd--items--3, .hd--items--5, .hd--items--6, .hd--items--7 {
                border-right: 1.6px var(--whiteDarck) solid;
            }
        
            
            .hd--items--8{
                border: none;
                /* border-right: 1px var(--whiteDarck) solid;    */
            }

/**------------- B T N S  C O N T A C T O ------------------------------*/    

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; justify-content: center;
        
    }                                           

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3rem; width: 15.5rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.6rem 1rem 0.6rem;
            border-radius: 5px;

            font-size: 16px; letter-spacing: 0.9px;
        } 


}

@media (max-width: 1030px) and (max-height: 768px) {

.main{
    /* position: relative; */
    height: 100vh; width: 100%!important;

}
.main::after{

    position: absolute; 
    top: auto; bottom: -4%!important; left: 50%;
    height: 4rem!important; width: 3.4px;
    
}
 
.nav{
    height: 5.5rem; width: 100%;
    padding: 0rem 3rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
    
        /* background-color: chartreuse; */
        
    }
        .nav--contenedor--logo{ 
            height: 5.5rem; width: 13rem;
            margin: auto 0rem;
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px red; */
            }      
      
        .nav-ul{
        
            box-sizing: border-box;
            height: 100%!important;  width: 32rem;
            margin: 0rem;
            padding: 0rem 2rem 0rem 0rem;

        }
            .li-items{

                height: 100%; width: 15%; 
                /* background-color: rgb(255, 81, 0); */
            }
                .nav-items{
                    box-sizing: border-box;
                    height: 100%; width: 100%; 
           
                    font-size: 16px;
                }

/** ----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 94%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: center;
        
        /* background-color: aqua; */
        background-color: var( --opacity1 );

    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 80%; 
            margin: -1.5rem auto 0rem auto!important;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 6rem;
            
                font-size: 60px!important;
                letter-spacing: 2px;
                line-height: 59px!important;

                /* background-color: rgb(56, 183, 24); */
            }

/**------------ S E R V I C I O S -------------------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 27%; width: 85%;
            margin: 2rem auto 2rem auto;
            box-sizing: border-box!important;
            
            
            
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 0.5rem 0rem 0.5rem; margin: auto;

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

                background-color: none; 
                font-size: 18px;
                letter-spacing: 0.7px;
            }
            .hd--items--1, .hd--items--2, .hd--items--3, .hd--items--4{
                border-bottom: 1.6px var(--whiteDarck) solid;
            }

            .hd--items--1, .hd--items--2, .hd--items--3, .hd--items--5, .hd--items--6, .hd--items--7 {
                border-right: 1.6px var(--whiteDarck) solid;
            }
        
            
            .hd--items--8{
                border: none;
                /* border-right: 1px var(--whiteDarck) solid;    */
            }

/**------------- B T N S  C O N T A C T O ------------------------------*/    

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; 
        justify-content: center;
        
    }
        .hd--btn-contacto{
            border: none; 
        }          
        .hd--btn-presupuesto{
            border: none; 
        }                                              

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3rem; width: 15.5rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.6rem 1rem 0.6rem;
            border-radius: 5px;

            font-size: 16px; letter-spacing: 0.9px;
        } 


}

@media (max-width:1030px) and (max-height: 601px) {

.main{  height: 35rem;  }

.main::after{

    position: absolute; 
    top: 33.5rem; left: 50%;
    height: 3rem!important; width: 3px;
    display: block;
    
}
 
.nav{
    height: 6.5rem; width: 100%;
    padding: 0rem 3rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        
    }
        .nav--contenedor--logo{ 
            height: 5.5rem; width: 12rem;
            margin: auto 0rem;
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px red; */
            }      
      
        .nav-ul{
     
            box-sizing: border-box;
            height: 100%!important;  width: 32rem;
            margin: 0rem;
            padding: 0rem 2rem 0rem 0rem;

            
            /* background-color: aqua; */
        }
            .li-items{
                height: 100%; width: 15%; 
                /* background-color: rgb(255, 81, 0); */
            }
                .nav-items{
                    box-sizing: border-box;
                    height: 100%; width: 100%; 
    
                    font-size: 16px;
                }

/** ----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 94%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: center;
      

    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 75%; 
            margin: -4rem auto 0rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 4rem;
            
                font-size: 51px!important;
                letter-spacing: 2px;
                line-height: 51px!important;

                /* background-color: rgb(56, 183, 24); */
            }

/**------------ S E R V I C I O S -------------------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 27%; width: 80%;
            margin: 0.5rem auto 2rem auto;
            box-sizing: border-box!important;
            
            
            
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 0.5rem 0rem 0.5rem; margin: auto;

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

                background-color: none; color: var( --whiteDarck );
                font-size: 16px;
                letter-spacing: 0.7px;
            }
            .hd--items--1, .hd--items--2, .hd--items--3, .hd--items--4{
                border-bottom: 1.6px var(--whiteDarck) solid;
            }

            .hd--items--1, .hd--items--2, .hd--items--3, .hd--items--5, .hd--items--6, .hd--items--7 {
                border-right: 1.6px var(--whiteDarck) solid;
            }
        
            
            .hd--items--8{
                border: none;
                /* border-right: 1px var(--whiteDarck) solid;    */
            }

/**------------- B T N S  C O N T A C T O ------------------------------*/    

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
        .hd--btn-contacto{
            border: none; 
        }          
        .hd--btn-presupuesto{
            border: none; 
        }                                              

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 2.8rem; width: 15rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.4rem 1rem 0.4rem;
            border-radius: 5px;

            font-size: 16px; letter-spacing: 0.9px;
        } 




}




/*  Listo */
/* 1024px  and  1369px */

/*Surface Pro 7 */
@media (max-width: 912px) and (max-height: 1368px) {

.main{
    height: 75vh; width: 100%!important;

}
.main::after{

    position: absolute; 
    bottom: 21%; left: 50%;
    height: 6.5rem; width: 3.5px;

    
}

.nav{
    height: 6.5rem; width: 100%;
    padding: 0rem 2rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        /* background-color: yellow; */
        
    }
        .nav--contenedor--logo{ 
            height: 6.5rem; width: 13rem;
            margin: 0rem; 
  
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px rgb(17, 255, 0); */
            }        

        

        .nav-ul{
        
            box-sizing: border-box;
            height: 100%!important;  width: 32rem;
            margin: 0rem;
            padding: 0rem 2rem 0rem 0rem;
            

        }
            .li-items{
                height: 100%; width: 15%; 
                /* background-color: rgb(255, 81, 0); */
            }
                .nav-items{
                    box-sizing: border-box;
                    height: 100%; width: 100%; 
           
                    font-size: 15px!important;
                }

/** ----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 94%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: center;
        
        /* background-color: aqua; */

    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 90%; 
            margin: -8rem auto 0rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 6rem;
            
                font-size: 60px!important;
                letter-spacing: 2px;
                line-height: 57px!important;

                /* background-color: rgb(56, 183, 24); */
            }

/**------------ S E R V I C I O S -------------------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 27%; width: 80%;
            margin: 1.5rem auto 3em auto;
            box-sizing: border-box!important;
            
              
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 0.5rem 0rem 0.5rem; margin: auto;

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

                background-color: none; 
                font-size: 16px;
                letter-spacing: 0.7px;
            }
            .hd--items--1, .hd--items--2, .hd--items--3, .hd--items--4{
                border-bottom: 2px var(--whiteDarck) solid;
            }

            .hd--items--1, .hd--items--2, .hd--items--3, .hd--items--5, .hd--items--6, .hd--items--7 {
                border-right: 2px var(--whiteDarck) solid;
            }
        
            
            .hd--items--8{
                border: none;
                /* border-right: 1px var(--whiteDarck) solid;    */
            }

/**------------- B T N S  C O N T A C T O ------------------------------*/    

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; 
        justify-content: center;
        
    }                                             

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 2.9rem; width: 16rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.4rem 1rem 0.4rem;
            border-radius: 5px;

            font-size: 16px; letter-spacing: 0.9px;
        } 




}
@media (max-width: 912px) and (min-height: 1168px) {



/** ----------------------------- P O R T A D A -----------------------*/


    /**------------- T I T L E ------------------------*/

            .hd--title{
                /* justify-self: flex-end; */
         
                padding: 1rem 4rem;
            
                line-height: 64px!important;

            }

}
    

@media (max-width: 912px) and (max-height: 864px) {

.main{
    /* position: relative; */
    height: 75vh; width: 100%!important;

}
.main::after{

    position: absolute; 
    bottom: 20%!important; left: 50%;
    height: 5rem; width: 3.5px;

}
 

.nav{
    height: 5.5rem; width: 100%;
    padding: 0rem 2rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        /* background-color: yellow; */
        
    }
        .nav--contenedor--logo{ 
            height: 5.5rem; width: 10rem;
            margin: 0rem; 
  
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px rgb(17, 255, 0); */
            }      
        
   

        .nav-ul{
        
            box-sizing: border-box;
            height: 100%!important;  width: 28rem;
            margin: 0rem;
            padding: 0rem 2rem 0rem 0rem;

        }
            .li-items{

                height: 100%; width: 15%; 
                /* background-color: rgb(255, 81, 0); */
            }
                .nav-items{
                    box-sizing: border-box;
                    height: 100%; width: 100%; 
               
                    font-size: 14px!important;
                }

/** ----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 94%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: center;
        
        /* background-color: aqua; */

    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 90%; 
            margin: -5rem auto 0rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 6rem;
            
                font-size: 51px!important;
                letter-spacing: 2px;
                line-height: 48px!important;

                /* background-color: rgb(56, 183, 24); */
            }

/**------------ S E R V I C I O S -------------------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 27%; width: 80%;
            margin: 1.2rem auto 2.5rem auto;
            box-sizing: border-box!important;
            
            
            
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 0.5rem 0rem 0.5rem; margin: auto;

                display: flex; flex-flow: column; 
                justify-content: center;
                
                border-width: 1.7px!important;
                background-color: none; 
                font-size: 16px;
                letter-spacing: 0.7px;
            }
            .hd--items--1, .hd--items--2, .hd--items--3, .hd--items--4{
                border-bottom: 2px var(--whiteDarck) solid;
            }

            .hd--items--1, .hd--items--2, .hd--items--3, .hd--items--5, .hd--items--6, .hd--items--7 {
                border-right: 2px var(--whiteDarck) solid;
            }
        
            
            .hd--items--8{
                border: none;
                /* border-right: 1px var(--whiteDarck) solid;    */
            }

/**------------- B T N S  C O N T A C T O ------------------------------*/    

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin-top: 0rem;
        
        display: flex; flex-flow: row wrap; 
        justify-content: center;
        
    }                                           

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 2.8rem; width: 16rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.4rem 1rem 0.4rem;
            border-radius: 5px;

            font-size: 16px; letter-spacing: 0.9px;
        } 




}

@media (max-width: 912px) and (max-height: 694px) {

.main{
    height: 35rem; 

}
.main::after{

    position: absolute; 
    top: 33.5rem; left: 50%;
    height: 3rem!important; width: 3px!important;

}

.nav{
    height: 5.5rem; width: 100%;
    padding: 0rem 3rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        
    }
        .nav--contenedor--logo{ 
            height: 5.5rem; width: 12rem;
            margin: auto 0rem;
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px red; */
            }      
        

        .nav-ul{
        
            box-sizing: border-box;
            height: 100%!important;  width: 32rem;
            margin: 0rem;
            padding: 0rem 2rem 0rem 0rem;
            

            
            /* background-color: aqua; */
        }
            .li-items{
                box-sizing: border-box;


                height: 100%; width: 15%; 
                /* background-color: rgb(255, 81, 0); */
            }
                .nav-items{
                    box-sizing: border-box;
                    height: 100%; width: 100%; 
               
                    font-size: 14px!important;
                }

/** ----------------------------- P O R T A D A -----------------------*/

    .hd--content-position{ 
        height: 94%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: center;
        
        /* background-color: aqua; */

    }

    /**------------- T I T L E ------------------------*/

        .hd--conteiner--title{
            height: 30%;
            width: 90%; 
            margin: -1rem auto 0rem auto;
            
            /* background-color: rgb(183, 24, 141); */
        }
            .hd--title{
                /* justify-self: flex-end; */
                height: 100%; width: 100%; margin: 0%;
                padding: 1rem 6rem;
            
                font-size: 51px!important;
                letter-spacing: 2px;
                line-height: 47px!important;

                /* background-color: rgb(56, 183, 24); */
            }

/**------------ S E R V I C I O S -------------------------------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */

            height: 27%; width: 80%;
            margin: 0.5rem auto 2rem auto;
            box-sizing: border-box!important;
            
            
            
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0rem 0.5rem 0rem 0.5rem; margin: auto;

                display: flex; flex-flow: column; 
                justify-content: center;
                
                border-width: 1.7px;
                background-color: none; 
                font-size: 16px;
                letter-spacing: 0.7px;
            }
       

/**------------- B T N S  C O N T A C T O ------------------------------*/    

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%;
        margin: 0rem 0rem 1rem 0rem;
        
        display: flex; flex-flow: row wrap; 
        justify-content: center;
        
    }                                              

        .hd--btn{
            height: 2.7rem; width: 16rem; 
            /* padding: 0.9rem 1.5rem;  */
            border: none; margin: 1rem 0.4rem 1rem 0.4rem;
            border-radius: 5px;

            font-size: 16px; letter-spacing: 0.9px;
        } 




}


    

/** Listo */

@media (max-width: 860px) {

.main{
    /* position: relative; */
    height: 100vh; width: 100%!important;
   
}
.main::after{

    content: "";
    position: absolute; bottom: -3.5%; left: 50%;

    height: 5.3rem; width: 4px;
    border-radius: 1.2px;
}

    .nav{
        position: relative; 
        top: 0%;                                                
        left: 0%;

        height: 7.5rem; width: 100%; 
        padding: 0rem 0rem 0rem 0rem; 
        border:none; margin: 0% 0% 0% 0%;


        /* background-color: var(--opacity1); */

    }
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100%; 
        padding: 0rem 2rem 0rem 2.5rem; 
        border:none; margin: 0% 0% 0% 0%;
        box-sizing: border-box;
        
        display: flex; flex-flow: row nowrap; 
        justify-content: space-between ; align-items: center;
       
    }
        
    /**Burber btn*/
        
    .nav-toggle{
        position: absolute; 
        top: 0%; right: 0%;

        box-sizing: border-box;
        height: 6.5rem; width: 6.5rem; 
        border: none;
        cursor: pointer;

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

        background-color: transparent ;

    }
        /* .nav-toggle--item{
            height: 4.3rem; 
            border: none;
        } */

        .row_toggle{
            position: relative; 

            display: block; 
            height: 3.8rem;  
            width: 3.8rem;  
            padding: 0%; border: none; 
            margin: auto 0rem ;

            background-color: transparent;
            /* border: solid 2px black */

        }
        .row_toggle_items{
            position: absolute; 
            top: 50%; 
            left: 50%;
            display: block;
            height: 7px; width: 65%;
            margin: 0px;
            border-radius: 10px;
            background-color: var(--grayLightOpacity);


            transform: translate(-50%,-50%);
            transition: all 0.3s ease;

        }
    
        .l_1{
            transform: translate(-50%, -17px);  /* -20px */

        } 
        .l_3{       
            transform: translate(-50%, 10px);  /* 15px */

        }
        /*Parte JS*/
        .activo .l_1{
            transform: translate(-50%, -50%)rotate(45deg);
        }
        .activo .l_2{
            width: 0rem;
        }
        .activo .l_3{
            transform: translate(-50%, -50%)rotate(-45deg);
        }
        /*---------------------------------------*/

      
   

  
        .nav--contenedor--logo{ 
            height: 7.5rem; width: 14rem;
            margin: 0rem; 
  
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px rgb(17, 255, 0); */
            }        

        

    .nav-ul{

        position: absolute; 
        top: 5.8rem; right: -100%;

        box-sizing: border-box;
        margin: 0;
        padding: 0;
        
        display: flex; flex-flow: column; 
        justify-content: space-between; align-items: center; align-content: center;

        height: 91.5vh!important;     width: 100%;
        background-color: var( --greenDarck2 );

        transition: all 0.6s;
    }
        .li-items{
            z-index: 580;
            box-sizing: border-box;

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

            height: 28%; width: 100%; 
            border-top: 1px solid var(--grayLight);
            /* background-color: rgb(255, 81, 0); */

        }
            .nav-items{
                z-index: 600;
                box-sizing: border-box;
                display: flex; flex-direction: column; 
                justify-content: center; align-items: center;

                height: 100%; width: 100%; 
                /* margin: 5px 5px 5px 5px; */

                color: var( --grayLight )!important;
                /* background-color: rgb(255, 247, 0); */
                font-size: 30px;
            }
    

    /**-------  M A I N ------------------*/
    
    .hd--content-position{ 
        height: 91vh; width: 100%; 
        padding: 0rem; margin: 0rem 0rem 0rem 0rem;

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

        /* background-color: brown; */
    }

    /**-------  T I T L E ------------------*/

        .hd--conteiner--title{ 
            display: block;
            height: 30%; width: 96%; 
            padding: 0% ; margin: 2rem auto 1rem auto!important;
            /* background-color: aqua; */
        }
            .hd--title{
                justify-self: flex-end;
                height: 100%; width: 100%;
                padding: 1rem 1rem!important; margin: 0%;
                
                /* background-color: rgb(25, 0, 255); */
          
                letter-spacing: 6px;
                font-size: 58px!important;
                line-height: 61px!important;    
             
            }

     /**-------   S E R V I C I O S ------------------*/

        .hd--conteiner--servicios{ 
            height: 32%; width: 100%;
            padding: 0rem 0.5rem;
            margin: 0% auto 0rem auto;

            box-sizing: border-box!important;
            display: grid;  
            grid-template-columns: 1fr 1fr ; grid-template-rows: 1fr 1fr 1fr 1fr;
            
            grid-area: 
                "hd--items--1 hd--items--2 "
                "hd--items--3 hd--items--4"
                "hd--items--5 hd--items--6"
                "hd--items--7 hd--items--8"
                ;

            /* background-color: rgb(127, 146, 255); */
        }
            .hd--items{
            
                box-sizing: border-box!important;
                height: 100%; width: 100%; 
                padding: 0rem ; margin: auto;

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

                background-color: none; color: var( --whiteDarck );
                font-size: 24px;
                letter-spacing: 0.7px;
            }

            .hd--items--1, .hd--items--2, .hd--items--3, .hd--items--4, .hd--items--5, .hd--items--6{
                border-bottom: 1.7px var(--white) solid;
            }
          

            .hd--items--1, .hd--items--3, .hd--items--5, .hd--items--7{
                border-right: 2px var(--white) solid;
            }
            .hd--items--2, .hd--items--6, .hd--items--8 {
                border-right: none;
            }
           
        

        
     /**-------   C O N T A C T O     B T N S  ------------------*/

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%; padding: 0% 0rem 0rem 0rem; margin: 4rem 0rem 0rem 0rem;

        display: flex; flex-flow: row wrap; justify-content: center;
     
    }
        .hd--btn-contacto{
            border: none;
        }          
        .hd--btn-presupuesto{
            border: none;
        }                                              

        .hd--btn{
            box-sizing: border-box;

            height: 3.6rem; width: 19.3rem; 
            padding: 0rem; 
            border: none; margin: 1rem 0.5rem 1rem 0.5rem;
            border-radius: 5px;

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

            font-size: 22px; letter-spacing: 0.5px;
        } 


}    

@media (max-width: 860px) and (min-height: 865px){

.main{
    height: 55rem; 
    width: 100%!important;
    
}
.main::after{
    top: 53rem!important; 

    height: 5.3rem; width: 4px;

}

.nav{
    height: 6.5rem; width: 100%;
    padding: 0rem 2rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        /* background-color: yellow; */
        
    }
        .nav--contenedor--logo{ 
            height: 7.5rem; width: 14rem;
            margin: 0rem; 
  
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px rgb(17, 255, 0); */
            }   
        
        /**Burber btn*/
        
        .nav-toggle{
            position: absolute; 
            top: 0%; right: 0%;

            box-sizing: border-box;
            height: 6.5rem; width: 6.5rem; 
            border: none;
            cursor: pointer;

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

            background-color: transparent ;

        }
            /* .nav-toggle--item{
                height: 4.3rem; 
                border: none;
            } */

            .row_toggle{
                position: relative; 

                display: block; 
                height: 3.8rem;  
                width: 3.8rem;  
                padding: 0%; border: none; 
                margin: auto 0rem ;

                background-color: transparent;
                /* border: solid 2px black */

            }
            .row_toggle_items{
                position: absolute; 
                top: 50%; 
                left: 50%;
                display: block;
                height: 7px; width: 65%;
                margin: 0px;
                border-radius: 10px;
                background-color: var(--grayLightOpacity);
 

                transform: translate(-50%,-50%);
                transition: all 0.3s ease;
  
            }
        
            .l_1{
                transform: translate(-50%, -17px);  /* -20px */

            } 
            .l_3{       
                transform: translate(-50%, 10px);  /* 15px */

            }
            /*Parte JS*/
            .activo .l_1{
                transform: translate(-50%, -50%)rotate(45deg);
            }
            .activo .l_2{
                width: 0rem;
            }
            .activo .l_3{
                transform: translate(-50%, -50%)rotate(-45deg);
            }
            /*---------------------------------------*/


    .nav-ul{

        position: absolute; 
        top: 5.8rem; right: -100%;

        box-sizing: border-box;
        margin: 0;
        padding: 0;
   

        height: 50rem!important;     width: 100%;
 
    }
        .li-items{
            height: 28%; width: 100%; 

        }
            .nav-items{
                height: 100%; width: 100%; 
          
                font-size: 24px!important;
            }
    

    /**-------  M A I N ------------------*/
    
    .hd--content-position{ 
    
        height: 90%; width: 100%; 
        padding: 0rem; margin: 0rem 0rem 0rem 0rem;

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

        /* background-color: brown; */

    
    }

    /**-------  T I T L E ------------------*/

        .hd--conteiner--title{ 
            display: block;
            height: 30%; width: 100%; 
            padding: 0% ; margin: 2rem auto 1rem auto;
            /* background-color: aqua; */
        }
            .hd--title{
   
                height: 100%; width: 95%;
                padding: 1rem 1rem!important; margin: 0% auto;
                
                /* background-color: rgb(25, 0, 255); */
            
                letter-spacing: 6px;
                font-size: 60px!important;
                line-height: 58px!important;    
                
            }

        /**-------   S E R V I C I O S ------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */
            /* position: absolute; */
            height: 32%; width: 97%;
            padding: 0rem 0.5rem;
            margin: 0% auto 0rem auto;

        }
            .hd--items{
            
                box-sizing: border-box!important;
                height: 100%; width: 100%; 
                padding: 0rem ; margin: auto;

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

                background-color: none; 
                font-size: 22px;
                letter-spacing: 0.7px;
            }
            
        

        
        /**-------   C O N T A C T O     B T N S  ------------------*/

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%; 
        padding: 0% 0rem 0rem 0rem; margin: 4rem 0rem 0rem 0rem;

        display: flex; flex-flow: row wrap; justify-content: center;
        
    }                                           

        .hd--btn{
            box-sizing: border-box;

            height: 3.4rem; width: 18.3rem; 
            padding: 0rem; 
            border: none; margin: 1rem 0.8rem 1rem 0.8rem;
            border-radius: 5px;

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

            font-size: 18px; 
            letter-spacing: 0.5px;
        } 


}  

@media (max-width: 860px) and (max-height: 864px){

.main{
    height: 100vh; width: 100%!important;  

}
.main::after{

    content: "";
    position: absolute; 
    bottom: -3.5%!important; 

    height: 5.3rem; width: 4px;
    border-radius: 1.2px;
}

.nav{
    height: 6.5rem!important; width: 100%;
    padding: 0rem 2rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        /* background-color: yellow; */
        
    }
        .nav--contenedor--logo{ 
            height: 6.5rem!important; width: 13rem!important;
            margin: 0rem; 
            /* border: solid 2px red */
  
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px rgb(17, 255, 0); */
            }        

        /**Burber btn*/
        .nav-toggle{
            position: absolute; top: 0%; right: 2%;

            box-sizing: border-box;
            height: 6.5rem; width: 14%; 
            border: none;

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

            background-color: transparent ;
    
        }
                /* .nav-toggle--item{
                    height: 4rem; 
                    border: none;
                } */
                 
    
            .row_toggle{
                position: relative; 

                display: block; 
                height: 3.8rem;  
                width: 3.8rem;  
                padding: 0%; border: none; 
                margin: auto 0rem ;

                background-color: transparent;
                /* border: solid 2px black */

            }
                .row_toggle_items{
                    position: absolute; 
                    top: 50%; 
                    left: 50%;
    
                    display: block;
                    height: 7px; width: 65%;
                    margin: 0px;
    
                    border-radius: 10px;
                    background-color: var(--grayLightOpacity);
    
                    transform: translate(-50%,-50%);
                    transition: all 0.3s ease;
                }
                .l_1{
                    transform: translate(-50%, -17px);  /* -20px */
                } 
                .l_3{       
                    transform: translate(-50%, 10px);  /* 15px */
                }
                /*Parte JS*/
                .activo .l_1{
                    transform: translate(-50%, -50%)rotate(45deg);
                }
                .activo .l_2{
                    width: 0rem;
                }
                .activo .l_3{
                    transform: translate(-50%, -50%)rotate(-45deg);
                }
                /*---------------------------------------*/
        
        

    .nav-ul{

        position: absolute; top: 5.8rem; right: -100%;

        box-sizing: border-box;
        margin: 0;
        padding: 0;
        
        display: flex; flex-flow: column; 
        justify-content: space-between; 
        align-items: center; align-content: center;

        height: 91.5vh!important;     width: 100%;
        background-color: var( --greenDarck2 );

        transition: all 0.6s;
    }
        .li-items{
            z-index: 580;
            box-sizing: border-box;

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

            height: 28%; width: 100%; 
            border-top: 1px solid var(--grayLight);
            /* background-color: rgb(255, 81, 0); */

        }
            .nav-items{
                z-index: 600;
                box-sizing: border-box;
                display: flex; flex-direction: column; 
                justify-content: center; align-items: center;


                height: 100%; width: 100%; 
               
                font-size: 20px!important;
            }
    

    /**-------  M A I N ------------------*/
    
    .hd--content-position{ 
    
        height: 91vh; width: 100%; 
        padding: 0rem; margin: 0rem 0rem 0rem 0rem;

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

        /* background-color: brown; */

    
    }

    /**-------  T I T L E ------------------*/

        .hd--conteiner--title{ 
            display: block;
            height: 30%; width: 96%; 
            padding: 0% ;
            margin: 2rem auto 1rem auto;
            /* background-color: aqua; */
        }
            .hd--title{
                justify-self: flex-end;
                height: 100%; width: 100%;
                padding: 1rem 1rem!important; margin: 0%;
                
                /* background-color: rgb(25, 0, 255); */
            
                letter-spacing: 6px;
                font-size: 60px!important;
                line-height: 58px!important;    
                
            }

        /**-------   S E R V I C I O S ------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */
            /* position: absolute; */
            height: 32%; width: 100%;
            padding: 0rem 0.5rem;
            margin: 0% auto 0rem auto;

            box-sizing: border-box!important;
            display: grid;  
            grid-template-columns: 1fr 1fr ; grid-template-rows: 1fr 1fr 1fr 1fr;
            
            grid-area: 
                "hd--items--1 hd--items--2 "
                "hd--items--3 hd--items--4"
                "hd--items--5 hd--items--6"
                "hd--items--7 hd--items--8"
                ;

            /* background-color: rgb(127, 146, 255); */
        }
            .hd--items{
            
                box-sizing: border-box!important;
                height: 100%; width: 100%; 
                padding: 0rem ; margin: auto;

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

                background-color: none; color: var( --whiteDarck );
                font-size: 22px;
                letter-spacing: 0.7px;
            }
         
            .hd--items--1, .hd--items--2, .hd--items--3, .hd--items--4, .hd--items--5, .hd--items--6{
                border-bottom: 1.7px var(--white) solid;
            }
            

            .hd--items--1, .hd--items--3, .hd--items--5, .hd--items--7{
                border-right: 2px var(--white) solid;
            }
            .hd--items--2, .hd--items--6, .hd--items--8 {
                border-right: none;
            }
            
        

        
        /**-------   C O N T A C T O     B T N S  ------------------*/

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%; 
        padding: 0% 0rem 0rem 0rem; margin: 4rem 0rem 0rem 0rem;

        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
        .hd--btn-contacto{
            border: none;
        }          
        .hd--btn-presupuesto{
            border: none;
        }                                              

        .hd--btn{
            box-sizing: border-box;

            height: 3.2rem; width: 17.8rem; 
            padding: 0rem; 
            border: none; margin: 1rem 0.5rem 1rem 0.5rem;
            border-radius: 5px;

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

            font-size: 16px; letter-spacing: 0.5px;
        } 


}   

@media (max-width: 860px) and (max-height: 778px){

.main{
    height: 100vh; width: 100%!important;
}
.main::after{

    content: "";
    position: absolute; 
    bottom: -5.5%!important; 

    height: 5.3rem; width: 4px;
    border-radius: 1.2px;
}
.nav{
    height: 6.5rem!important; width: 100%;
    padding: 0rem 2rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        /* background-color: yellow; */
        
    }
        .nav--contenedor--logo{ 
            height: 6.5rem!important; width: 13rem!important;
            margin: 0rem; 
  
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
            }        
        
    

    .nav-ul{

        position: absolute; top: 5.8rem; right: -100%;

        box-sizing: border-box;
        margin: 0;
        padding: 0;
        
        display: flex; flex-flow: column; 
        justify-content: space-between; 
        align-items: center; align-content: center;

        height: 91.5vh!important;     width: 100%;
  
    }
        .li-items{
            z-index: 580;
            box-sizing: border-box;

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

            height: 28%; width: 100%; 
            border-top: 1px solid var(--grayLight);
            /* background-color: rgb(255, 81, 0); */

        }
            .nav-items{
                z-index: 600;
                box-sizing: border-box;
                display: flex; flex-direction: column; 
                justify-content: center; align-items: center;


                height: 100%; width: 100%; 
                /* margin: 5px 5px 5px 5px; */

                /* background-color: rgb(255, 247, 0); */
                font-size: 24px!important;
            }
    

    /**-------  M A I N ------------------*/
    
    .hd--content-position{ 
    
        height: 91vh; width: 100%; 
        padding: 0rem; margin: 0rem 0rem 0rem 0rem;

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

        /* background-color: brown; */

    
    }

    /**-------  T I T L E ------------------*/

        .hd--conteiner--title{ 
            display: block;
            height: 30%; width: 80%!important; 
            padding: 0% ;
            margin: 2rem auto 0rem auto;
            /* background-color: aqua; */
        }
            .hd--title{
                justify-self: flex-end;
                height: 100%; width: 100%;
                padding: 1rem 1rem!important; margin: 0%;
                
                /* background-color: rgb(25, 0, 255); */
            
                letter-spacing: 6px;
                font-size: 55px!important;
                line-height: 57px!important;    
                
            }

        /**-------   S E R V I C I O S ------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */
            /* position: absolute; */
            height: 32%; width: 90%;
            padding: 0rem 0.5rem;
            margin: 1rem auto 0rem auto;

            box-sizing: border-box!important;
            
            /* background-color: rgb(127, 146, 255); */
        }
            .hd--items{
            
                box-sizing: border-box!important;
                height: 100%; width: 100%; 
                padding: 0rem ; margin:  auto;

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

                background-color: none;
                font-size: 18px;
                letter-spacing: 0.7px;
            }

            .hd--items--1, .hd--items--2, .hd--items--3, .hd--items--4, .hd--items--5, .hd--items--6{
                border-bottom: 1.7px var(--white) solid;
            }
            

            .hd--items--1, .hd--items--3, .hd--items--5, .hd--items--7{
                border-right: 2px var(--white) solid;
            }
            .hd--items--2, .hd--items--6, .hd--items--8 {
                border-right: none;
            }
            
        

        
        /**-------   C O N T A C T O     B T N S  ------------------*/

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%; 
        padding: 0% 0rem 0rem 0rem; margin: 2rem 0rem 0rem 0rem;

        display: flex; flex-flow: row wrap; 
        justify-content: center;
        
    }                                           

        .hd--btn{
            box-sizing: border-box;

            height: 3rem; width: 16.5rem; 
            padding: 0rem; 
            margin: 1rem 0.5rem 1rem 0.5rem;
     

            font-size: 18px; letter-spacing: 0.5px;
        } 


}  

@media (max-width: 860px) and (max-height: 678px){

.main{
    height: 100vh; width: 100%!important;
}
.main::after{

    content: "";
    position: absolute; 
    bottom: -5.5%!important; 

    height: 5.3rem; width: 4px;
    border-radius: 1.2px;
}


        

    .nav-ul{

        position: absolute; 
        top: 5.8rem; right: -100%;

        box-sizing: border-box;
        margin: 0;
        padding: 0;
        
        display: flex; flex-flow: column; 
        justify-content: space-between; 
        align-items: center; align-content: center;

        height: 87vh!important;     width: 100%;

        transition: all 0.6s;
    }
        .li-items{
            z-index: 580;
            box-sizing: border-box;

            height: 30%; width: 100%; 

        }
            .nav-items{
                z-index: 600;
                box-sizing: border-box;
                display: flex; flex-direction: column; 
                justify-content: center; align-items: center;


                height: 100%; width: 100%; 
        
                font-size: 20px!important;
            }
    

    /**-------  M A I N ------------------*/
    
    .hd--content-position{ 
    
        height: 91vh; width: 100%; 
        padding: 0rem; margin: 0rem 0rem 0rem 0rem;

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

    
    }

    /**-------  T I T L E ------------------*/

        .hd--conteiner--title{ 
            display: block;
            height: 30%; width: 80%!important; 
            padding: 0% ;
            margin: 1rem auto 1rem auto!important;
            /* background-color: aqua; */
        }
            .hd--title{
                justify-self: flex-end;
                height: 100%; width: 100%;
                padding: 1rem 1rem!important; margin: 0%;
                
                /* background-color: rgb(25, 0, 255); */
            
                letter-spacing: 6px;
                font-size: 50px!important;
                line-height: 52px!important;    
                
            }

        /**-------   S E R V I C I O S ------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */
            /* position: absolute; */
            height: 32%; width: 98%;
            padding: 0rem 0.5rem;
            margin: 0% auto 0rem auto;

            box-sizing: border-box!important;
            
            /* background-color: rgb(127, 146, 255); */
        }
            .hd--items{
            
                box-sizing: border-box!important;
                height: 100%; width: 100%; 
                padding: 0rem ; margin: auto;

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

                background-color: none; 
                font-size: 16px;
                letter-spacing: 0.7px;
            }

            .hd--items--1, .hd--items--2, .hd--items--3, .hd--items--4, .hd--items--5, .hd--items--6{
                border-bottom: 1.7px var(--white) solid;
            }
            

            .hd--items--1, .hd--items--3, .hd--items--5, .hd--items--7{
                border-right: 2px var(--white) solid;
            }
            .hd--items--2, .hd--items--6, .hd--items--8 {
                border-right: none;
            }
            
        

        
        /**-------   C O N T A C T O     B T N S  ------------------*/

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%; 
        padding: 0% 0rem 0rem 0rem; margin: 2rem 0rem 0rem 0rem;

        display: flex; flex-flow: row wrap; 
        justify-content: center;
        
    }                                           

        .hd--btn{
            box-sizing: border-box;

            height: 3rem; width: 16rem; 
            padding: 0rem; 
            margin: 1rem 0.5rem 1rem 0.5rem;
        

            font-size: 16px; letter-spacing: 0.5px;
        } 


} 

@media (max-width: 860px) and (max-height: 598px){

.main{
    /* position: relative; */
    height: 100vh; width: 100%!important;
    

}
.main::after{
    display: none;
  
}

.nav{
    height: 5.5rem!important; width: 100%;
    padding: 0rem 2rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        /* background-color: yellow; */
        
    }
        .nav--contenedor--logo{ 
            height: 5.5rem!important; width: 12rem!important;
            margin: 0rem; 
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
            }        
           
            .nav-toggle{
                position: absolute; top: 0%; right: 3%;
    
                box-sizing: border-box;
                height: 5rem; width: 5rem; 
                border: none;
    
                display: flex; flex-direction: column; 
                justify-content: center; 
                align-content: center; align-items: center;
    
                background-color: transparent ;
        
            }
                /* .nav-toggle--item{
                    height: 3.5rem; 
                    border: none;
                } */
            
                 /**Burber btn*/
    
                 .row_toggle{
                    position: relative; 
    
                    display: block; 
                    height: 3rem;  
                    width: 3rem;  
                    padding: 0%; border: none; 
                    margin: auto 0rem ;
    
                }
                .row_toggle_items{
                    position: absolute; 
                    top: 50%; 
                    left: 50%;
                    display: block;
                    height: 6px; width: 90%;
                    margin: 0px;
                    border-radius: 10px;
    
                    transform: translate(-50%,-50%);
                    transition: all 0.3s ease;
      
                }
            
                .l_1{
                    transform: translate(-50%, -17px);  /* -20px */
    
                } 
                .l_3{       
                    transform: translate(-50%, 12px);  /* 15px */
    
                }
                /*---------------------------------------*/
        

        .nav--contenedor--logo{
        
            height: 100%; width: 8rem; margin: 0rem;
            /* background-color: rgb(226, 43, 43); */
        }
            .nav--logo{
                height: 100%; width: 100%; 
                margin: 0rem;

                display: flex; flex-direction: column; 
                justify-content: center; 
                align-items: center; align-content: center;
                
                font-size: 27px;
                
            }
        

    .nav-ul{

        position: absolute; 
        top: 5.8rem; right: -100%;

        box-sizing: border-box;
        margin: 0;
        padding: 0;


        height: 84.5vh!important;     width: 100%;

        transition: all 0.6s;
    }
        .li-items{
            z-index: 580;
            box-sizing: border-box;

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

            height: 30%; width: 100%; 
            border-top: 1px solid var(--grayLight);
            /* background-color: rgb(255, 81, 0); */

        }
            .nav-items{
                z-index: 600;
                box-sizing: border-box;

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


                height: 100%; width: 100%; 
                /* margin: 5px 5px 5px 5px; */

                /* background-color: rgb(255, 247, 0); */
                font-size: 24px!important;
            }
    

    /**-------  M A I N ------------------*/
    
    .hd--content-position{ 
    
        height: 91vh; width: 100%; 
        padding: 0rem; margin: 0rem 0rem 0rem 0rem;

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


    }

    /**-------  T I T L E ------------------*/

        .hd--conteiner--title{ 
            display: block;
            height: 30%; width: 80%!important; 
            padding: 0% ;
            margin: 1rem auto 1.7rem auto!important;
            /* background-color: aqua; */
        }
            .hd--title{
                justify-self: flex-end;
                height: 100%; width: 100%;
                padding: 1rem 1rem!important; margin: 0%;
                
                /* background-color: rgb(25, 0, 255); */
            
                letter-spacing: 6px;
                font-size: 48px!important;
                line-height: 49px!important;    
                
            }

        /**-------   S E R V I C I O S ------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */
            /* position: absolute; */
            height: 32%; width: 98%;
            padding: 0rem 0.5rem;
            margin: 0% auto 0rem auto;

            box-sizing: border-box!important;
            
            /* background-color: rgb(127, 146, 255); */
        }
            .hd--items{
            
                box-sizing: border-box!important;
                height: 100%; width: 100%; 
                padding: 0rem ; margin: auto;

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

                background-color: none; 
                font-size: 16px;
                letter-spacing: 0.7px;
            }

            .hd--items--1, .hd--items--2, .hd--items--3, .hd--items--4, .hd--items--5, .hd--items--6{
                border-bottom: 1.7px var(--white) solid;
            }
            

            .hd--items--1, .hd--items--3, .hd--items--5, .hd--items--7{
                border-right: 1.5px var(--white) solid;
            }
        
            
        

        
        /**-------   C O N T A C T O     B T N S  ------------------*/

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%; 
        padding: 0% 0rem 0rem 0rem; margin: 1.4rem 0rem 0rem 0rem;

        display: flex; flex-flow: row wrap; justify-content: center;
        
    }                                           

        .hd--btn{
            box-sizing: border-box;

            height: 2.8rem!important; width: 16rem; 
            padding: 0rem; 
            margin: 1rem 0.5rem 1rem 0.5rem;
        

            font-size: 16px; letter-spacing: 0.5px;
        } 


}

@media (max-width: 860px) and (max-height: 538px){

.main{
    height: 35rem; width: 100%!important;

}
.main::after{
    display: block;
    top: 33.5rem!important; left: 50%;

    height: 3rem; width: 3px;
    border-radius: 1.2px;
}

.nav{
    height: 5.5rem!important; width: 100%;
    padding: 0rem 2rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        /* background-color: yellow; */
        
    }
        .nav--contenedor--logo{ 
            height: 4.5rem!important; width: 11rem!important;
            margin: 0rem; 
            /* border: solid 2px red */
  
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px rgb(17, 255, 0); */
            }     

        /**Burber btn*/

        .nav-toggle{
            position: absolute; top: 0%; right: 1%;

            box-sizing: border-box;
            height: 5rem; width: 5rem; 
            border: none;

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

            background-color: transparent ;
    
        }
            /* .nav-toggle--item{
                height: 3.5rem; 
                border: none;
            } */
        
        .row_toggle{
            position: relative; 

            display: block; 
            height: 3rem;  
            width: 3rem;  
            padding: 0%; border: none; 
            margin: auto 0rem ;

            background-color: transparent;
            /* border: solid 2px black; */

        }
            .row_toggle_items{
                position: absolute; 
                top: 50%; left: 50%;
                
                display: block;
                height: 6px; width: 75%;
                margin: 0px;
                border-radius: 10px;
                background-color: var(--grayLightOpacity);
 
                transform: translate(-50%,-50%);
                transition: all 0.3s ease;
            }
            .l_1{
                transform: translate(-50%, -15px);  /* -20px */
            } 
            .l_3{       
                transform: translate(-50%, 9px);  /* 15px */
            }
            /*Parte JS*/
            .activo .l_1{
                transform: translate(-50%, -50%)rotate(45deg);
            }
            .activo .l_2{
                width: 0rem;
            }
            .activo .l_3{
                transform: translate(-50%, -50%)rotate(-45deg);
            }
            /*---------------------------------------*/
    


    .nav-ul{
        position: absolute; 
        top: 5.8rem; right: -100%;

        margin: 0;
        padding: 0;
        

        height: 30rem!important;     width: 100%;

    }
        .li-items{
            z-index: 580;
            box-sizing: border-box;

            height: 30%; width: 100%; 
            border-top: 1px solid var(--grayLight);
            /* background-color: rgb(255, 81, 0); */

        }
            .nav-items{
                z-index: 600;
                box-sizing: border-box;
                display: flex; flex-direction: column; 
                justify-content: center; align-items: center;


                height: 100%; width: 100%; 
                /* margin: 5px 5px 5px 5px; */

                /* background-color: rgb(255, 247, 0); */
                font-size: 24px!important;
            }
    

    /**-------  M A I N ------------------*/
    
    .hd--content-position{ 
    
        height: 91vh; width: 100%; 
        padding: 0rem; margin: 0rem 0rem 0rem 0rem;

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

        /* background-color: brown; */

    
    }

    /**-------  T I T L E ------------------*/

        .hd--conteiner--title{ 
            display: block;
            height: 30%; width: 80%!important; 
            padding: 0% ;
            margin: 0.5rem auto 1.5rem auto!important;
            /* background-color: aqua; */
        }
            .hd--title{
                justify-self: flex-end;
                height: 100%; width: 100%;
                padding: 1rem 1rem!important; margin: 0%;
                
                /* background-color: rgb(25, 0, 255); */
            
                letter-spacing: 6px;
                font-size: 50px!important;
                line-height: 47px!important;    
                
            }

        /**-------   S E R V I C I O S ------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */
            /* position: absolute; */
            height: 32%; width: 98%;
            padding: 0rem 0.5rem;
            margin: 0% auto 0rem auto;

            box-sizing: border-box!important;
            
            /* background-color: rgb(127, 146, 255); */
        }
            .hd--items{
            
                box-sizing: border-box!important;
                height: 100%; width: 100%; 
                padding: 0rem ; margin: auto;

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

                background-color: none;
                font-size: 16px;
                letter-spacing: 0.7px;
            }

            .hd--items--1, .hd--items--2, .hd--items--3, .hd--items--4, .hd--items--5, .hd--items--6{
                border-bottom: 1.7px var(--white) solid;
            }
            

            .hd--items--1, .hd--items--3, .hd--items--5, .hd--items--7{
                border-right: 1.5px var(--white) solid;
            }
        
            
        

        
        /**-------   C O N T A C T O     B T N S  ------------------*/

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%; 
        padding: 0% 0rem 0rem 0rem; margin: 1.5rem 0rem 0rem 0rem;

        display: flex; flex-flow: row wrap;
        justify-content: center;
        
    }                                           

        .hd--btn{
            box-sizing: border-box;

            height: 3rem; width: 16rem; 
            padding: 0rem; 
            margin: 1rem 0.5rem 1rem 0.5rem;
        

            font-size: 16px; letter-spacing: 0.5px;
        } 


}


/* Listo */

@media (max-width: 768px) and ( min-height: 900px){

.main{
    /* position: relative; */
    height: 55rem!important; 
}
.main::after{
    display: block;

    /* position: absolute; 
    bottom: -4.5%!important; left: 50%;

    height: 4.8rem; width: 3.5px; */

    
}

.nav{
    height: 6.5rem!important; width: 100%;
    padding: 0rem 2rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        /* background-color: yellow; */
        
    }
        .nav--contenedor--logo{ 
            height: 7.5rem!important; width: 14rem!important;
            margin: 0rem; 
            /* border: solid 2px red */
  
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px rgb(17, 255, 0); */
            }        

 
        .nav-toggle{
            box-sizing: border-box;
            height: 100%; width: 14%; 
            /* padding-right: 2rem; */

        }
            .nav-toggle--item{
                height: 3.8rem; 
            
            }


    .nav-ul{
        position: absolute; top: 5.5rem; right: -100%;

        box-sizing: border-box;
        margin: 0;
        padding: 0;
        
        display: flex; flex-flow: column; 
        justify-content: space-between;
        align-items: center; align-content: center;

        height: 50rem!important;     width: 100%;

    }
        .li-items{

            height: 25%; width: 100%; 
            box-sizing: border-box;

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


            /* background-color: rgb(255, 81, 0); */

        }
            .nav-items{
                height: 100%; width: 100%; 
                /* margin: 5px 5px 5px 5px; */

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

                /* background-color: rgb(255, 247, 0); */
                font-size: 30px;
            }
    

    /**-------  M A I N ------------------*/
    
    .hd--content-position{ 
    
        height: 91vh; width: 100%; 
        padding: 0rem; margin: 0rem 0rem 0rem 0rem;

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

        /* background-color: brown; */

    
    }

    /**-------  T I T L E ------------------*/

        .hd--conteiner--title{ 
            display: block;
            height: 30%; width: 100%; 
            padding: 0% ;
            margin: 0rem auto 0rem auto;
            /* background-color: aqua; */
        }
            .hd--title{
    
                height: 100%; width: 85%;
                padding: 1rem 0rem!important; margin: 0% auto;
                
                /* background-color: rgb(25, 0, 255); */
            
                letter-spacing: 5.8px;
                font-size: 45px;
                line-height: 58px!important;    
                
            }
            /* .hd--title:last-child{
                color: chartreuse!important;
            } */
        /**-------   S E R V I C I O S ------------------*/

        .hd--conteiner--servicios{ 
            height: 32%; width: 88%;
            padding: 0rem 0.5rem;
            margin: 1rem auto 0rem auto;

            
            /* background-color: rgb(127, 146, 255); */
        }
            .hd--items{
            
                box-sizing: border-box!important;
                height: 100%; width: 100%; 
                padding: 0rem ; margin: 0rem auto;

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

                background-color: none; 
                font-size: 16px;
                letter-spacing: 0.7px;
            } 

        
        /**-------   C O N T A C T O     B T N S  ------------------*/

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%; 
        padding: 0% 0rem 0rem 0rem; margin: 2rem 0rem 0rem 0rem;

        display: flex; flex-flow: row wrap; 
        justify-content: center;
        
    }
                                                

        .hd--btn{
            box-sizing: border-box;

            height: 3rem; width: 17rem; 
            padding: 0rem; 
            border: none; margin: 1rem 0.5rem 1rem 0.5rem;
            border-radius: 5px;

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

            font-size: 16px; letter-spacing: 0.5px;
        } 


}  

@media (max-width: 768px) and ( max-height: 800px){

.main{
    /* position: relative; */
    height: 100vh; width: 100%!important;
}
.main::after{
    display: none;
    /*!no lee las propiedades :( */
    /* position: absolute; 
    bottom: -4.5%!important; left: 50%;

    height: 4.8rem; width: 3.5px; */

    
}

.nav{
    height: 5.5rem!important; width: 100%;
    padding: 0rem 2rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        /* background-color: yellow; */
        
    }
        .nav--contenedor--logo{ 
            height: 6.5rem!important; width: 13rem!important;
            margin: 0rem; 
            /* border: solid 2px red */
  
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px rgb(17, 255, 0); */
            }        

 
        .nav-toggle{
            box-sizing: border-box;
            height: 100%; width: 14%; 
            /* padding-right: 2rem; */

        }
            .nav-toggle--item{
                height: 3.8rem; 
            
            }
        

    .nav-ul{
        position: absolute; top: 5.5rem; right: -100%;

        box-sizing: border-box;
        margin: 0;
        padding: 0;
        
        display: flex; flex-flow: column; 
        justify-content: space-between; 
        align-items: center; align-content: center;

        height: 89.5vh!important;     width: 100%;

    }
        .li-items{

            height: 25%; width: 100%; 
            box-sizing: border-box;

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


            /* background-color: rgb(255, 81, 0); */

        }
            .nav-items{
                height: 100%; width: 100%; 
                /* margin: 5px 5px 5px 5px; */

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

                /* background-color: rgb(255, 247, 0); */
                font-size: 30px;
            }
    

    /**-------  M A I N ------------------*/
    
    .hd--content-position{ 
    
        height: 91vh; width: 100%; 
        padding: 0rem; margin: 0rem 0rem 0rem 0rem;

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

        /* background-color: brown; */

    
    }

    /**-------  T I T L E ------------------*/

        .hd--conteiner--title{ 
            display: block;
            height: 30%; width: 100%; 
            padding: 0% ;
            margin: 0rem auto 0rem auto;
            /* background-color: aqua; */
        }
            .hd--title{
    
                height: 100%; width: 85%;
                padding: 1rem 0rem!important; margin: 0% auto;
                
                /* background-color: rgb(25, 0, 255); */
            
                letter-spacing: 5.8px;
                font-size: 60px;
                line-height: 58px!important;    
                
            }
            /* .hd--title:last-child{
                color: chartreuse!important;
            } */
        /**-------   S E R V I C I O S ------------------*/

        .hd--conteiner--servicios{ 
            height: 32%; width: 88%;
            padding: 0rem 0.5rem;
            margin: 1rem auto 0rem auto;

            
            /* background-color: rgb(127, 146, 255); */
        }
            .hd--items{
            
                box-sizing: border-box!important;
                height: 100%; width: 100%; 
                padding: 0rem ; margin: 0rem auto;

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

                background-color: none; 
                font-size: 16px;
                letter-spacing: 0.7px;
            } 

        
        /**-------   C O N T A C T O     B T N S  ------------------*/

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%; 
        padding: 0% 0rem 0rem 0rem; margin: 2rem 0rem 0rem 0rem;

        display: flex; flex-flow: row wrap; 
        justify-content: center;
        
    }
        .hd--btn-contacto{
            border: none;
        }          
        .hd--btn-presupuesto{
            border: none;
        }                                              

        .hd--btn{
            box-sizing: border-box;

            height: 3rem; width: 17rem; 
            padding: 0rem; 
            border: none; margin: 1rem 0.5rem 1rem 0.5rem;
            border-radius: 5px;

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

            font-size: 16px; letter-spacing: 0.5px;
        } 


}  

@media (max-width: 768px) and (max-height: 681px){

.main{
    /* position: relative; */
    height: 100vh; width: 100%!important;
}
.main::after{
    display: none;
    /*!no lee las propiedades :( */
    /* position: absolute; 
    bottom: -4.5%!important; left: 50%;

    height: 4.8rem; width: 3.5px; */

    
}
.nav{
    height: 5.5rem!important; width: 100%;
    padding: 0rem 2rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        /* background-color: yellow; */
        
    }
        .nav--contenedor--logo{ 
            height: 5.5rem!important; width: 12rem!important;
            margin: 0rem; 
            /* border: solid 2px red */
  
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px rgb(17, 255, 0); */
            }        

        .nav-toggle{
            box-sizing: border-box;
            height: 100%; width: 14%; 
            /* padding-right: 2rem; */

        }
            .nav-toggle--item{
                height: 3.8rem; 
            
            }

        .nav--contenedor--logo{
        
            height: 100%; width: 8rem; margin: 0rem;
            /* background-color: rgb(226, 43, 43); */
        }
            .nav--logo{
                height: 100%; width: 100%; margin: 0rem;

                font-size: 25px;
                
            }
        

    .nav-ul{
        position: absolute; top: 5.5rem; right: -100%;

        box-sizing: border-box;
        margin: 0;
        padding: 0;
        
        display: flex; flex-flow: column; 
        justify-content: space-between; 
        align-items: center; align-content: center;

        height: 87vh!important;     width: 100%;

    }
        .li-items{

            height: 25%; width: 100%; 
            box-sizing: border-box;

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


            /* background-color: rgb(255, 81, 0); */

        }
            .nav-items{
                height: 100%; width: 100%; 
                /* margin: 5px 5px 5px 5px; */

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

                /* background-color: rgb(255, 247, 0); */
                font-size: 30px;
            }
    

    /**-------  M A I N ------------------*/
    
    .hd--content-position{ 
    
        height: 91vh; width: 100%; 
        padding: 0rem; margin: 0rem 0rem 0rem 0rem;

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

        /* background-color: brown; */

    
    }

    /**-------  T I T L E ------------------*/

        .hd--conteiner--title{ 
            display: block;
            height: 30%; width: 100%; 
            padding: 0% ;
            margin: 2rem auto 1.5rem auto!important;
            /* background-color: aqua; */
        }
            .hd--title{
   
                height: 100%; width: 90%;
                padding: 1rem 0rem!important; margin: 0% auto;
                
                letter-spacing: 5.8px;
                font-size: 51px!important;
                line-height: 52px!important;    
                
            }
     
        /**-------   S E R V I C I O S ------------------*/

        .hd--conteiner--servicios{ 
            height: 32%; width: 88%;
            padding: 0rem 0.5rem;
            margin: 1rem auto 0rem auto;

            
            /* background-color: rgb(127, 146, 255); */
        }
            .hd--items{
            
                box-sizing: border-box!important;
                height: 100%; width: 100%; 
                padding: 0rem ; margin: 0rem auto;

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

                background-color: none; 
                font-size: 16px;
                letter-spacing: 0.7px;
            } 

        
        /**-------   C O N T A C T O     B T N S  ------------------*/

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%; 
        padding: 0% 0rem 0rem 0rem; margin: 1rem 0rem 0rem 0rem;

        display: flex; flex-flow: row wrap; 
        justify-content: center;
        
    }                                          

        .hd--btn{

            height: 3rem; width: 15rem; 
            padding: 0rem; 
            border: none; margin: 1rem 0.5rem 1rem 0.5rem;
            border-radius: 5px;

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

            font-size: 16px; letter-spacing: 0.5px;
        } 


}  

@media (max-width: 768px) and (max-height: 600px){

.main{
    /* position: relative; */
    height: 100vh; width: 100%!important;
    
}
.main::after{
    position: absolute; 
    bottom: -5%; left: 50%;

    height: 3.3rem!important; width: 3px;
    border-radius: 1.2px;

    /* border-bottom: 66vh #2a02375f solid; 
    border-right: 20vh #222f3e00 solid;  */
    
}

.nav{
    height: 5.5rem!important; width: 100%;
    padding: 0rem 2rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        /* background-color: yellow; */
        
    }
        .nav--contenedor--logo{ 
            height: 5.5rem!important; width: 12rem!important;
            margin: 0rem; 
            /* border: solid 2px red */
  
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px rgb(17, 255, 0); */
            }        

        .nav-toggle{
            box-sizing: border-box;
            height: 100%; width: 14%; 
  
        }
            .nav-toggle--item{
                height: 3rem; border: none;
            
            }

        

    .nav-ul{

        position: absolute; 
        top: 5.5rem; right: -100%;

        box-sizing: border-box;
        margin: 0;
        padding: 0;
        

        height: 86.5vh!important;     width: 100%;

    }
        .li-items{
            height: 35%; width: 100%; 

        }
            .nav-items{
                font-size: 18px!important;
            }
    

    /**-------  M A I N ------------------*/
    
    .hd--content-position{ 
    
        height: 91vh; width: 100%; 
        padding: 0rem; margin: 0rem 0rem 0rem 0rem;

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

        /* background-color: brown; */

    
    }

    /**-------  T I T L E ------------------*/

        .hd--conteiner--title{ 
            display: block;
            height: 30%; width: 97%; 
            padding: 0% ;
            margin: 1rem auto 1rem auto!important;
            /* background-color: aqua; */
        }
            .hd--title{
                justify-self: flex-end;
                height: 100%; width: 100%;
                padding: 1rem 1rem!important; margin: 0%;
                
                /* background-color: rgb(25, 0, 255); */
            
                letter-spacing: 4px;
                font-size: 47px!important;
                line-height: 47px!important;    
                
            }
         
        /**-------   S E R V I C I O S ------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */
            /* position: absolute; */
            height: 32%; width: 90%;
            padding: 0rem 0.5rem;
            margin: 0% auto 0rem auto;


            /* background-color: rgb(127, 146, 255); */
        }
            .hd--items{
            
                box-sizing: border-box!important;
                height: 100%; width: 100%; 
                padding: 0rem ; margin: auto;

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

                font-size: 16px;
                letter-spacing: 0.7px;
            }

        

        
        /**-------   C O N T A C T O     B T N S  ------------------*/

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%; 
        padding: 0% 0rem 0rem 0rem; margin: 1.5rem 0rem 0rem 0rem;

        display: flex; flex-flow: row wrap; 
        justify-content: center;
        
    }

        .hd--btn{

            height: 2.6rem!important; width: 14.5rem; 
            padding: 0rem; 
            border: none; margin: 1rem 0.5rem 1rem 0.5rem;


            font-size: 15px!important; letter-spacing: 0.5px;
        } 



} 

@media(max-width:768px) and (max-height: 540px){


    .nav-ul{

        position: absolute; 
        top: 5.5rem!important; right: -100%;

        box-sizing: border-box;
        margin: 0;
        padding: 0;
        

        height: 91vh!important;     width: 100%;

    }

}

@media (max-width: 768px) and (max-height: 520px){

.main{
    height: 35rem; width: 100%!important;   

}
.main::after{
    display: block;
    position: absolute; 
    top: 33rem; left: 50%;

    height: 3.3rem!important; width: 3px;
    border-radius: 1.2px;

    
}


.nav{
    height: 5.5rem!important; width: 100%;
    padding: 0rem 2rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
 
        
    }
        .nav--contenedor--logo{ 
            height: 5.5rem!important; width: 12rem!important;
            margin: 0rem; 
        
  
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px rgb(17, 255, 0); */
            }        

        .nav-toggle{
            box-sizing: border-box;
            height: 100%; width: 14%; 
    
        }
            .nav-toggle--item{
                height: 3rem; border: none;
                filter: invert( 100% );
            
            }

        

    .nav-ul{

        position: absolute; 
        top: 5.5rem!important; right: -100%;

        box-sizing: border-box;
        margin: 0; padding: 0;
        

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

        height: 30rem!important;     width: 100%;

    }
        .li-items{
            z-index: 580;
            box-sizing: border-box;

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

            height: 35%; width: 100%; 

        }
            .nav-items{

                height: 100%; width: 100%; 
                margin: 5px 5px 5px 5px;
                box-sizing: border-box;

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

                /* background-color: rgb(0, 38, 255); */
                font-size: 18px!important;
            }
    

    /**-------  M A I N ------------------*/
    
    .hd--content-position{ 
    
        height: 91vh; width: 100%; 
        padding: 0rem; margin: 0rem 0rem 0rem 0rem;

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

        /* background-color: brown; */

    
    }

    /**-------  T I T L E ------------------*/

        .hd--conteiner--title{ 
            display: block;
            height: 30%; width: 97%; 
            padding: 0% ;
            margin: 1rem auto 0rem auto;
            /* background-color: aqua; */
        }
            .hd--title{
                justify-self: flex-end;
                height: 100%; width: 100%;
                padding: 1rem 1rem!important; margin: 0%;
                
                /* background-color: rgb(25, 0, 255); */
            
                letter-spacing: 4px;
                font-size: 43px!important;
                line-height: 44px!important;    
                
            }
            
        /**-------   S E R V I C I O S ------------------*/

        .hd--conteiner--servicios{ 
            height: 32%; width: 98%;
            padding: 0rem 0.5rem;
            margin: 0% auto 0rem auto;


        }
            .hd--items{
            
                box-sizing: border-box!important;
                height: 100%; width: 100%; 
                padding: 0rem ; margin: auto;

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

                font-size: 16px;
                letter-spacing: 0.7px;
            }

        

        
        /**-------   C O N T A C T O     B T N S  ------------------*/

    .hd--conteiner--btns{
        /* border: 1px solid rgb(255, 111, 0); */
        width: 100%; 
        padding: 0% 0rem 0rem 0rem; margin: 1.5rem 0rem 0rem 0rem;

        display: flex; flex-flow: row wrap; justify-content: center;
        
    }
        .hd--btn-contacto{
            border: none;
        }          
        .hd--btn-presupuesto{
            border: none;
        }                                              

        .hd--btn{

            height: 2.6rem; width: 14.5rem; 
            padding: 0rem; 
            border: none; margin: 1rem 0.5rem 1rem 0.5rem;
            border-radius: 5px;

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

            font-size: 15px; letter-spacing: 0.5px;
        } 



} 


/** Listo */

@media( max-width: 687px ) and ( min-height: 801px){

.main{
    height: 55rem; width: 100%;
}
.main::after{
    display: block;
    position: absolute; 
    top: 53rem; left: 50%;

    height: 4rem; width: 3.3px;
   
}

.nav{
    height: 5.5rem!important; width: 100%;
    padding: 0rem 2rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
 
        
    }
        .nav--contenedor--logo{ 
            height: 6.5rem!important; width: 12rem!important;
            margin: 0rem; 
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            }        
           

            /**Burber btn*/

            .nav-toggle{
                position: absolute; top: 0%; right: 0%;
    
                box-sizing: border-box;
                height: 5.5rem; width: 5.5rem; 
            
            }
                /* .nav-toggle--item{
                    height: 3.5rem;     
                } */
    
                .row_toggle{
                position: relative; 
                display: block; 
                height: 3rem;  
                width: 3rem;  
                padding: 0%; border: none; 
                margin: auto 0rem ;
            }
                .row_toggle_items{
                    position: absolute; 
                    top: 50%; left: 50%;
                    
                    display: block;
                    height: 6px; width: 75%;
                    margin: 0px;
                    border-radius: 10px;
        
                    transform: translate(-50%,-50%);
                    transition: all 0.3s ease;
                }
                .l_1{
                    transform: translate(-50%, -15px);  /* -20px */
                } 
                .l_3{       
                    transform: translate(-50%, 9px);  /* 15px */
                }    
                /*---------------------------------------*/
            
    
        

    .nav-ul{
        position: absolute; 
        top: 5rem; right: -100%;

        box-sizing: border-box;
        height: 50rem!important;    /*!no me lo lee sin el !important*/
        width: 100%;
        margin: 0; padding: 0;
    
    }
        .li-items{

            box-sizing: border-box;
            height: 25%; width: 100%; 

            display: flex; flex-flow: column; 
            justify-content: center; 
            align-items: center; align-content: center;
            
            /* background-color: rgb(255, 81, 0); */

        }
            .nav-items{
    
                
                box-sizing: border-box;     
                height: 100%; width: 100%; 
                /* margin: 5px 5px 5px 5px; */

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

                /* background-color: rgb(255, 247, 0); */
                font-size: 30px;
            }
    
/**-------------------------- P O R T A D A ----------------------------------------------------*/

    .hd--content-position{ 
    
        height: 90%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: space-around;

    
    }
    /**-------   T I T U L O  ------------------*/
    
        .hd--conteiner--title{

            height: 30%; width: 100%; 
            padding: 0% 0rem 0rem 0rem;
            margin: -1rem auto -2rem auto!important;

            /* border: solid 1px yellow; */
        }
            .hd--title{
                display: block;
                height: 100%; width: 85%;
                padding: 0rem 0rem; 
                margin: 0% auto;
            

                font-size: 53px!important;
                line-height: 58px!important;   
                letter-spacing: 2.8px;
    
            }
    
    /**-------   S E R V I C I O S ------------------*/

    .hd--conteiner--servicios{ 
    /* border: 1px solid red;     */
    height: 38% ; width: 97%;
    padding: 0rem 0rem;
    margin: 0% auto 0% auto;

    /* background-color: aquamarine; */
}
    .hd--items{

        height: 100%; width: 100%; 
        padding: 0.7rem ; margin: auto;

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

        font-size: 16px;
        letter-spacing: 0.7px;
    }

 

/**--------------- B T N S  C O N T A C T O ---------------------*/

    .hd--conteiner--btns{
        /* background-color: darkmagenta; */
        width: 100%; 
        border: none; margin: 0rem 0rem 2.5rem 0rem;

        display: flex; flex-flow: column; 
        justify-content: center;
    
    }                                            

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3rem; width: 55%; 
            padding: 0.9rem 1.5rem; 
            border: none; 
            margin: 0.6rem 0.2rem 0.6rem 0.2rem;
        

            font-size: 16px; letter-spacing: 0.5px;
        } 


}

@media( max-width: 687px ) and ( max-height: 800px){

.main{
    height: 100vh; width: 100%;
}
.main::after{

    height: 4.3rem; width: 3.3px;
    border-radius: 1.2px;
    
}
   

.nav{
    height: 5.5rem!important; width: 100%;
    padding: 0rem 2rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;

    }
        .nav--contenedor--logo{ 
            height: 6.5rem!important; width: 12rem!important;
            margin: 0rem; 
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
            }        

    /**Burber btn*/
        
    .nav-toggle{
        position: absolute; top: 0%; right: 0%;

        box-sizing: border-box;
        height: 5.5rem; width: 5.5rem; 
    
    }
        /* .nav-toggle--item{
            height: 3.5rem;     
        } */

        .row_toggle{
            position: relative; 
            display: block; 
            height: 3rem;  
            width: 3rem;  
            padding: 0%; border: none; 
            margin: auto 0rem ;

        }
            .row_toggle_items{
                position: absolute; 
                top: 50%; left: 50%;
                
                display: block;
                height: 6px; width: 75%;
                margin: 0px;
                border-radius: 10px;

                transform: translate(-50%,-50%);
                transition: all 0.3s ease;
            }
            .l_1{
                transform: translate(-50%, -15px);  /* -20px */
            } 
            .l_3{       
                transform: translate(-50%, 9px);  /* 15px */
            }
    /*---------------------------------------*/
    

        
    .nav-ul{
        position: absolute; 
        top: 5rem; right: -100%;

        box-sizing: border-box;
        height: 90vh!important;    /*!no me lo lee sin el !important*/
        width: 100%;
        margin: 0; padding: 0;


    }
        .li-items{

            box-sizing: border-box;
            height: 25%; width: 100%; 

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

        }
            .nav-items{
  
                
                box-sizing: border-box;     
                height: 100%; width: 100%; 
                /* margin: 5px 5px 5px 5px; */

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

                /* background-color: rgb(255, 247, 0); */
                font-size: 30px;
            }
    
/**-------------------------- P O R T A D A ----------------------------------------------------*/

    .hd--content-position{ 
    
        height: 90%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: space-around;

    
    }
    /**-------   T I T U L O  ------------------*/
    
        .hd--conteiner--title{

            height: 30%; width: 100%; 
            padding: 0% 0rem 0rem 0rem;
            margin: 0rem auto 0rem auto!important;

        }
            .hd--title{
                display: block;
                height: 100%; width: 85%;
                padding: 0rem 0rem; 
                margin: 0% auto;
            

                font-size: 51px!important;
                line-height: 54px!important;   
                letter-spacing: 2.8px;
             
            }
    
    /**-------   S E R V I C I O S ------------------*/

    .hd--conteiner--servicios{ 
    /* border: 1px solid red;     */
    height: 38% ; width: 97%;
    padding: 0rem 0rem; margin: 0% auto 0% auto;

}
    .hd--items{

        height: 100%; width: 100%; 
        padding: 0.5rem!important ; margin: auto;

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

        font-size: 16px;
        letter-spacing: 0.7px;
    }

    .hd--items--1, .hd--items--2, .hd--items--3, .hd--items--4, .hd--items--5, .hd--items--6{
        border-bottom: 1.5px var(--white) solid;
    }

    .hd--items--1 , .hd--items--3 , .hd--items--5, .hd--items--7{
        border-right: 1.5px var(--white) solid;
    }
    

    .hd--items--8{
        display: inline-block;
        /* border-right: 1.5px var(--whiteDarck) solid;    */
    }

/**--------------- B T N S  C O N T A C T O ---------------------*/

    .hd--conteiner--btns{
        /* background-color: darkmagenta; */
        width: 100%; 
        border: none; margin: 0rem 0rem 2.5rem 0rem;

        display: flex; flex-flow: column; 
        justify-content: center;
    
    }                                           

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 2.8rem; width: 55%; 
            padding: 0.9rem 1.5rem; border: none; 
            margin: 0.6rem 0.2rem 0.6rem 0.2rem;
        

            font-size: 16px; letter-spacing: 0.5px;
        } 


}

@media( max-width: 687px ) and ( max-height: 732px){

.main{
    height: 100vh; width: 100%;

}
.main::after{

    height: 4.3rem; width: 3.3px;
    border-radius: 1.2px;

    /* border-bottom: 66vh #2a02375f solid;  */
    
}
 
.nav{
    height: 5.5rem!important; width: 100%;
    padding: 0rem 2rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
 
        
    }
        .nav--contenedor--logo{ 
            height: 6.5rem!important; width: 12rem!important;
            margin: 0rem; 
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;

            }        
            
        
    .nav-ul{
        position: absolute; 
        top: 5rem; right: -100%;

        box-sizing: border-box;
        height: 90vh!important;    /*!no me lo lee sin el !important*/
        width: 100%;
        margin: 0; padding: 0;
        
        display: flex; flex-flow: column; 
        justify-content: space-between; 
        align-items: center; align-content: center;
        
        transition: all 0.6s;
    }
        .li-items{

            box-sizing: border-box;
            height: 25%; width: 100%; 

            display: flex; flex-flow: column; 
            justify-content: center; 
            align-items: center; align-content: center;
            
            /* background-color: rgb(255, 81, 0); */

        }
            .nav-items{
    
                
                box-sizing: border-box;     
                height: 100%; width: 100%; 
                /* margin: 5px 5px 5px 5px; */

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

                /* background-color: rgb(255, 247, 0); */
                font-size: 18px!important;
            }
    
/**-------------------------- P O R T A D A ----------------------------------------------------*/

    .hd--content-position{ 
    
        height: 90%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: space-around;

    
    }
    /**-------   T I T U L O  ------------------*/
    
        .hd--conteiner--title{

            height: 30%; width: 100%; 
            padding: 0% 0rem 0rem 0rem;
            margin: -0.5rem auto 0.5rem auto!important;

            /* border: solid 1px yellow; */
        }
            .hd--title{
                display: block;
                height: 100%; width: 90%;
                padding: 0rem 0rem; 
                margin: 0% auto;
            

                font-size: 50px!important;
                line-height: 48px!important;   /*!sin el !important no lo lee */
                letter-spacing: 2.8px;
                /* background-color: rgb(231, 140, 21); */
            }
    
    /**-------   S E R V I C I O S ------------------*/

    .hd--conteiner--servicios{ 
    /* border: 1px solid red;     */
    height: 31% ; width: 93%;
    padding: 0rem 0rem;
    margin: 0% auto 0% auto;

   
}
    .hd--items{

        height: 100%; width: 100%; 
        padding: 0.5rem!important ; margin: auto;

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

        font-size: 14px;
        letter-spacing: 0.7px;
    }

    .hd--items--1 , .hd--items--3 , .hd--items--5, .hd--items--7{
        border-right: 0.3px var(--white) solid!important;
    }
    

/**--------------- B T N S  C O N T A C T O ---------------------*/

    .hd--conteiner--btns{
        /* background-color: darkmagenta; */
        width: 100%; 
        border: none; margin: 0rem 0rem 2rem 0rem;

        display: flex; flex-flow: column; 
        justify-content: center;
    
    }                                            

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 2.5rem; width: 50%; 
            padding: 0.9rem 1.5rem; 
            border: none; 
            margin: 0.6rem 0.2rem 0.6rem 0.2rem;
        

            font-size: 14px; letter-spacing: 0.8px;
        } 


}

@media( max-width: 687px ) and ( max-height: 662px){

.main{
    height: 100vh; width: 100%;
}
.main::after{
    position: absolute; 
    bottom: -4.5%!important;  /*!no lo lee sin el !important */
    left: 50%;

    height: 3.5rem!important; /*!no lo lee sin el !important */
    width: 3.3px;
    border-radius: 1.2px;
    
} 
                

    .nav-ul{
        position: absolute; 
        top: 5rem; right: -100%;

        box-sizing: border-box;
        height: 88vh!important;    /*!no me lo lee sin el !important*/
        width: 100%;
        margin: 0; padding: 0;
        
        display: flex; flex-flow: column; 
        justify-content: space-between;
         align-items: center; align-content: center;
        
        transition: all 0.6s;
    }
        .li-items{
            height: 25%; width: 100%;

        }
            .nav-items{
                height: 100%; width: 100%; 
            
                font-size: 30px;
            }
    
/**-------------------------- P O R T A D A ----------------------------------------------------*/

    .hd--content-position{ 
    
        height: 90%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: space-around;
        /* background-color: aqua; */
    
    }
    /**-------   T I T U L O  ------------------*/
    
        .hd--conteiner--title{

            height: 30%; width: 100%; 
            padding: 0% 0rem 0rem 0rem!important;
            margin: -1.5rem auto 0.8rem auto!important;

            /* border: solid 1px yellow; */
        }
            .hd--title{
                display: block;
                height: 100%; width: 90%;
                padding: 0rem 0rem; 
                margin: 0% auto;
            

                font-size: 48px!important;
                line-height: 48px!important;  
                letter-spacing: 2.8px;
                /* background-color: rgb(231, 140, 21); */
            }
    
    /**-------   S E R V I C I O S ------------------*/

    .hd--conteiner--servicios{ 
    /* border: 1px solid red;     */
    height: 33% ; width: 96%;
    padding: 0rem 0rem; margin: 0% auto 0% auto;
        

}
    .hd--items{

        height: 100%; width: 100%; 
        padding: 0.7rem ; margin: auto;

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

        font-size: 15px;
        letter-spacing: 0.7px;
    }



/**--------------- B T N S  C O N T A C T O ---------------------*/

    .hd--conteiner--btns{
        /* background-color: darkmagenta; */
        width: 100%; 
        border: none; margin: -1.5rem 0rem 0.5rem 0rem;

        display: flex; flex-flow: column; 
        justify-content: center;
   
    
    }

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 2.7rem; width: 55%; 
            padding: 0.9rem 1.5rem; 
            border: none; 
            margin: 0.6rem 0.2rem 0.3rem 0.2rem;
        

            font-size: 15px; letter-spacing: 0.5px;
        } 


}

@media( max-width: 687px ) and ( max-height: 590px){

.main{
    height: 35rem; 

}
.main::after{
    display: block;

    position: absolute; 
    top: 33.8rem!important; 
    left: 50%;

    height: 2.5rem!important; width: 3.3px;
    border-radius: 1.2px;
    
}
 

.nav{
    height: 5rem!important; width: 100%;
    padding: 0rem 2rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        
    }
        .nav--contenedor--logo{ 
            height: 5rem!important; width: 11rem!important;
            margin: 0rem; 
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            }   

    /**Burber btn*/
    
    .nav-toggle{
        position: absolute;
        top: 0%;  right: 2%;

        height: 5rem; width: 5rem; 

    }
        /* .nav-toggle--item{
            height: 3.4rem;     
        }  */

    .row_toggle{
        position: relative; 
        display: block; 
        height: 3rem;  
        width: 3rem;  
        padding: 0%; border: none; 
        margin: auto 0rem ;

    }
    .row_toggle_items{
        position: absolute; 
        top: 50%; left: 50%;
        
        display: block;
        height: 6px; width: 75%;
        margin: 0px;
        border-radius: 10px;

        transform: translate(-50%,-50%);
        transition: all 0.3s ease;
    }
    .l_1{
        transform: translate(-50%, -15px);  /* -20px */
    } 
    .l_3{       
        transform: translate(-50%, 9px);  /* 15px */
    }

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

        
    .nav-ul{
        position: absolute; 
        top: 5rem; right: -100%;

        box-sizing: border-box;
        height: 31rem!important;    /*!no me lo lee sin el !important*/
        width: 100%;
        margin: 0; padding: 0;
        
  
    }
        .li-items{
            height: 25%; width: 100%; 

        }
            .nav-items{
                height: 100%; width: 100%; 

                font-size: 30px;
            }
    
/**-------------------------- P O R T A D A ----------------------------------------------------*/

    .hd--content-position{ 
    
        height: 90%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: space-around;

    
    }
    /**-------   T I T U L O  ------------------*/
    
        .hd--conteiner--title{

            height: 30%; width: 100%; 
            padding: 0% 0rem !important;
            margin: 0rem auto 0rem auto!important;

            /* border: solid 1px yellow; */
        }
            .hd--title{
                display: block;
                height: 100%; width: 90%;
                padding: 0rem 0rem!important; 
                margin: 0% auto;
            

                font-size: 40px!important;
                line-height: 40px!important;   /*!sin el !important no lo lee */
                letter-spacing: 2.8px;
                /* background-color: rgb(231, 140, 21); */
            }
    
    /**-------   S E R V I C I O S ------------------*/

    .hd--conteiner--servicios{ 
        /* border: 1px solid red;     */
        height: 30% ; width: 96%;
        padding: 0rem 0rem; margin: 0% auto 0% auto;

        /* background-color: aquamarine; */
    }
    .hd--items{

        height: 100%; width: 100%; 
        padding: 0.6rem!important ; margin: auto;

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

        font-size: 14px;
        letter-spacing: 0.7px;
    }



/**--------------- B T N S  C O N T A C T O ---------------------*/

    .hd--conteiner--btns{
        /* background-color: darkmagenta; */
        width: 100%; 
        border: none; margin: 0.5rem 0rem 1.5rem 0rem!important;

    
    }

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 2.4rem!important; width: 47%; 
            padding: 0.9rem 1.5rem; border: none; 
            margin: 0.5rem 0.2rem 0.3rem 0.2rem;
        

            font-size: 14px!important; letter-spacing: 1px;
        } 


}



/** Listo */

@media(max-width: 541px) and ( min-height: 808px){

.main{
    height: 55rem; width: 100%!important;

}
.main::after{
    position: absolute; 
    top: 53rem!important; 


    height: 4.3rem; width: 3.3px;
    border-radius: 1.2px;
    
}

.nav{
    height: 5rem!important; width: 100%;
    padding: 0rem 1rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
 
    /* border: solid 2px red;        */
    }
        .nav--contenedor--logo{ 
            height: 5rem!important; width: 12rem!important;
            margin: 0rem; 
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
            }        
 
        
        /** Burger BTN */
        .nav-toggle{
            position: absolute; top: 0%; right: 2%;

            box-sizing: border-box;
            height: 5rem; width: 5rem; 
        
        }
            /* .nav-toggle--item{
                height: 3.4rem;     
            } */
            .row_toggle{
                position: relative; 
    
                display: block; 
                height: 3rem;  
                width: 3rem;  
                padding: 0%; border: none; 
                margin: auto 0rem ;
    
            }
            .row_toggle_items{
                position: absolute; 
                top: 50%; left: 50%;
                
                display: block;
                height: 6px; width: 75%;
                margin: 0px;
                border-radius: 10px;
    
                transform: translate(-50%,-50%);
                transition: all 0.3s ease;
            }
            .l_1{
                transform: translate(-50%, -15px);  /* -20px */
            } 
            .l_3{       
                transform: translate(-50%, 9px);  /* 15px */
            }

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


        

    .nav-ul{
        /* visibility: hidden; */
        position: absolute; 
        top: 5rem; right: -100%;
        /* z-index: 500; */
 
        margin: 0;
        padding: 0;

        height: 50rem!;     width: 100%;

    }
        .li-items{
            z-index: 580;

            height: 25%; width: 100%; 

            /* background-color: rgb(255, 81, 0); */

        }
            .nav-items{
                z-index: 600;
                
                height: 100%; width: 100%; 

                /* background-color: rgb(255, 247, 0); */
                font-size: 30px;
            }
    
/**-------------------------- P O R T A D A ----------------------------------------------------*/

    .hd--content-position{ 
    
        height: 91%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: space-around;

    
    }
    /**-------   T I T U L O  ------------------*/
    
        .hd--conteiner--title{

            height: 30%; width: 100%; 
            padding: 0% 0rem 0rem 0rem;
            margin: 1rem auto -2rem auto!important;

            /* border: solid 1px yellow; */
        }
            .hd--title{
                display: block;
                height: 100%; width: 97%;
                padding: 0rem 0rem; 
                margin: 0% auto;
            

                font-size: 54px!important;
                line-height: 58px!important;   
                letter-spacing: 2.8px;

                /* background-color: rgb(231, 140, 21); */
            }
    
    /**-------   S E R V I C I O S ------------------*/

    .hd--conteiner--servicios{ 
    /* border: 1px solid red;     */
    height: auto; width: 97%;
    padding: 0rem 0rem;
    margin: 0% auto -2rem auto;

   
}
    .hd--items{

        box-sizing: border-box!important;
        height: 100%; width: 100%; 
        padding: 1rem ; margin: auto;


        font-size: 16px;
        letter-spacing: 0.7px;
    }

 /*--------------------- B T N S --------------------------------------------------------*/

    .hd--conteiner--btns{
        /* background-color: darkmagenta; */
        width: 100%; 
        border: none; margin: 0rem 0rem 3rem 0rem;

        display: flex; flex-flow: column; 
        justify-content: center;
    
    }                                       

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 3rem; width: 60%; 
            padding: 0.9rem 1.5rem; 
            border: none; 
            margin: 0.6rem 0.2rem 0.6rem 0.2rem;
        

            font-size: 16px; letter-spacing: 0.5px;
        } 


}

@media(max-width: 541px) and ( max-height: 807px){

.main{

    height: 100vh; width: 100%!important;

}
.main::after{
    display: none;
}

.nav{
    height: 5rem!important; width: 100%;
    padding: 0rem 1rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
 
    /* border: solid 2px red;        */
    }
        .nav--contenedor--logo{ 
            height: 5rem!important; width: 11rem!important;
            margin: 0rem; 
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            }        
 
        
        /** Burger BTN */
        .nav-toggle{
            position: absolute; top: 0%; right: 2%;

            box-sizing: border-box;
            height: 5rem; width: 5rem; 
        
        }
            /* .nav-toggle--item{
                height: 3.4rem;     
            } */
            
            .row_toggle{
                position: relative; 
    
                display: block; 
                height: 3rem;  
                width: 3rem;  
                padding: 0%; border: none; 
                margin: auto 0rem ;
    
            }
            .row_toggle_items{
                position: absolute; 
                top: 50%; left: 50%;
                
                display: block;
                height: 6px; width: 75%;
                margin: 0px;
                border-radius: 10px;
    
                transform: translate(-50%,-50%);
                transition: all 0.3s ease;
            }
            .l_1{
                transform: translate(-50%, -15px);  /* -20px */
            } 
            .l_3{       
                transform: translate(-50%, 9px);  /* 15px */
            }

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

    

        

    .nav-ul{
        /* visibility: hidden; */
        position: absolute; 
        top: 5rem; right: -100%;
        /* z-index: 500; */
        box-sizing: border-box;
        margin: 0;
        padding: 0;
        

        height: 91vh!important;     width: 100%;

    }
        .li-items{
            z-index: 580;

            height: 25%; width: 100%; 
 

        }
            .nav-items{
                z-index: 600;
                
                height: 100%; width: 100%; 
         
                font-size: 19px!important;
                letter-spacing: 2px;
            }
    
/**-------------------------- P O R T A D A ----------------------------------------------------*/

    .hd--content-position{ 
    
        height: 91%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: space-around;

 
    }
 /**-------   T I T U L O  ------------------*/
 
        .hd--conteiner--title{

            height: 30%;
            width: 90%; 
            padding: 0% 0rem 0rem 0rem;
            margin: 0px auto -2.5rem auto;

            /* border: solid 1px yellow; */
        }
            .hd--title{
                display: block;
                height: 100%; width: 100%;
                padding: 0rem 0rem; 
                margin: 0% auto;
          

                font-size: 45px!important;
                line-height: 45px!important;   
                letter-spacing: 2.8px;
                /* background-color: rgb(231, 140, 21); */
            }
    
 /**-------   S E R V I C I O S ------------------*/

 .hd--conteiner--servicios{ 
    /* border: 1px solid red;     */
    height: auto; width: 97%;
    padding: 0rem 0rem;
    margin: 0% auto 0% auto;

 
}
    .hd--items{

        box-sizing: border-box!important;
        height: 100%; width: 100%; 
        padding: 0.8rem!important ; margin: auto;

        font-size: 16px;
        letter-spacing: 0.7px;
    }

    .hd--items--1, .hd--items--2, .hd--items--3, .hd--items--4, .hd--items--5, .hd--items--6{
        border-bottom: 1.5px var(--white) solid;
    }

    .hd--items--1 , .hd--items--3 , .hd--items--5, .hd--items--7{
        border-right: 1.5px var(--white) solid;
    }
  
    .hd--items--8{
        display: inline-block;
    }

/*     ------------------------- B T N S ---------------- ------------             -------------------*/
    
   

    .hd--conteiner--btns{
        /* background-color: darkmagenta; */
        width: 100%; border: none; margin: 0rem 0rem 3rem 0rem;

        display: flex; flex-flow: column; 
        justify-content: center;
  
    }
                                                 

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 2.7rem; width: 60%; 
            padding: 0.9rem 1.5rem; 
            border: none; 
            margin: 0.6rem 0.2rem 0.6rem 0.2rem;
        

            font-size: 16px; letter-spacing: 0.5px;
        } 


}

@media(max-width: 541px) and ( max-height: 722px){

.main{
    height: 100vh; width: 100%!important;

}
.main::after{
    position: absolute; 
    bottom: -4.5%!important;  /*!no lo lee sin el !important */
    left: 50%;

    height: 3.5rem!important;  /*!no lo lee sin el !important */
    width: 3.3px;
    border-radius: 1.2px;

    /* border-bottom: 66vh #2a02375f solid;  */
    
}

.nav{
    height: 5rem!important; width: 100%;
    padding: 0rem 1rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
 
    /* border: solid 2px red;        */
    }
        .nav--contenedor--logo{ 
            height: 5rem!important; width: 10rem!important;
            margin: 0rem; 
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            }   


    .nav-ul{
        position: absolute; 
        top: 5rem; right: -100%;
     
        box-sizing: border-box;
        height: 89vh!important;     width: 100%;
        margin: 0; padding: 0;

    }
        .li-items{
            height: 25%; width: 100%; 

            /* background-color: rgb(255, 81, 0); */

        }
            .nav-items{            
                height: 100%; width: 100%; 
                /* margin: 5px 5px 5px 5px; */

                /* background-color: rgb(255, 247, 0); */
                font-size: 20px!important;
            }
    
/**-------------------------- P O R T A D A ----------------------------------------------------*/

    .hd--content-position{ 
    
        height: 91%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: space-around;

    
    }
    /**-------   T I T U L O  ------------------*/
    
        .hd--conteiner--title{

            height: 30%;
            width: 97%; 
            padding: 0% 0rem 0rem 0rem;
            margin: 0px auto -2.5rem auto;

            /* border: solid 1px yellow; */
        }
            .hd--title{
                display: block;
                height: 100%; width: 100%;
                padding: 0rem 0rem; 
                margin: 0% auto;
            

                font-size: 44px!important;
                line-height: 44px!important;   
                letter-spacing: 2.8px;
                /* background-color: rgb(231, 140, 21); */
            }
    
    /**-------   S E R V I C I O S ------------------*/

    .hd--conteiner--servicios{ 
    /* border: 1px solid red;     */
    height: auto; width: 97%;
    padding: 0rem 0rem;
    margin: 0% auto 0% auto;

    box-sizing: border-box!important;
    overflow: hidden;
 
}
    .hd--items{

        box-sizing: border-box!important;
        height: 100%; width: 100%; 
        padding: 0.6rem!important ; margin: auto;


        font-size: 16px;
        letter-spacing: 0.7px;
    }


/**---------------------- B T N S  ------------------------------------------------------*/

    .hd--conteiner--btns{
        /* background-color: darkmagenta; */
        width: 100%; 
        border: none; margin: 0rem 0rem 3rem 0rem;

        display: flex; flex-flow: column; 
        justify-content: center;
    
    }
                                          

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 2.6rem!important; width: 50%; 
            padding: 0.9rem 1.5rem; border: none; 
            margin: 0.4rem 0.2rem 0.4rem 0.2rem;
        

            font-size: 15px; letter-spacing: 0.5px;
        } 


}

@media(max-width: 541px) and ( max-height: 667px){

.main{
    height: 100vh; width: 100%!important;

}
.main::after{
    position: absolute; 
    bottom: -4.5%!important;  /*!no lo lee sin el !important */
    left: 50%;

    height: 3.5rem!important;  /*!no lo lee sin el !important */
    width: 3.3px;
    border-radius: 1.2px;

    /* border-bottom: 66vh #2a02375f solid;  */
    
}

.nav{
    height: 5rem!important; width: 100%;
    padding: 0rem 1rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
 
    /* border: solid 2px red;        */
    }
        .nav--contenedor--logo{ 
            height: 5rem!important; width: 10rem!important;
            margin: 0rem; 
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
       
            }        
   

    .nav-ul{
        position: absolute; 
        top: 5rem; right: -100%;
        
        box-sizing: border-box;
        height: 88vh!important;     width: 100%;
        margin: 0; padding: 0;

    }
        .li-items{

            height: 25%; width: 100%; 
         

        }
            .nav-items{   
                height: 100%; width: 100%; 
        
                font-size: 16px!important; 
                letter-spacing: 1.6px;
            }
    
/**-------------------------- P O R T A D A ----------------------------------------------------*/

    .hd--content-position{ 
    
        height: 91%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: space-around;

    
    }
    /**-------   T I T U L O  ------------------*/
    
        .hd--conteiner--title{

            height: 30%;
            width: 97%; 
            padding: 0% 0rem 0rem 0rem!important;
            margin: -0.5rem auto -2rem auto;

            /* border: solid 1px yellow; */
        }
            .hd--title{
                display: block;
                height: 100%; width: 100%;
                padding: 0rem 0rem; 
                margin: 0% auto;
            

                font-size: 40px!important;
                line-height: 38px!important;   
                letter-spacing: 2.8px;
                /* background-color: rgb(231, 140, 21); */
            }
    
    /**-------   S E R V I C I O S ------------------*/

    .hd--conteiner--servicios{ 
    /* border: 1px solid red;     */
    height: auto; width: 97%;
    padding: 0rem 0rem;
    margin: 0% auto 0% auto;

    box-sizing: border-box!important;
    overflow: hidden;
    
    /* background-color: aquamarine; */
}
    .hd--items{
        height: 100%; width: 100%; 
        padding: 0.5rem!important ; margin: auto;

        font-size: 14px;
        letter-spacing: 0.7px;
    }


/**---------------------- B T N S  ------------------------------------------------------*/

    .hd--conteiner--btns{
        /* background-color: darkmagenta; */
        width: 100%; 
        border: none; margin: 0rem 0rem 1rem 0rem;

        display: flex; flex-flow: column; 
        justify-content: center;
    
    }
                                            
        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 2.8rem; width: 55%; 
            padding: 0.9rem 1.5rem; border: none; 
            margin: 0.4rem 0.2rem 0.4rem 0.2rem;
        

            font-size: 15px; letter-spacing: 0.5px;
        } 


}

@media(max-width: 541px) and ( max-height: 590px){

.main{
    height: 35rem; 

}
.main::after{ 
    display: block; 
    position: absolute; 
    top: 33.8rem!important; 
    left: 50%;

    height: 2.6rem!important; width: 2.4px!important;

}


.nav{
    height: 5rem!important; width: 100%;
    padding: 0rem 2rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        
    }
        .nav--contenedor--logo{ 
            height: 5rem!important; width: 10rem!important;
            margin: 0rem; 
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
            }    
        
        /**Burber btn*/
        .nav-toggle{
            position: absolute; top: 0%; right: 2%;

            box-sizing: border-box;
            height: 5rem; width: 5rem; 
        
        }
            /* .nav-toggle--item{
                height: 3.3rem;     
            } */

        .row_toggle{
            position: relative; 

            display: block; 
            height: 3rem;  
            width: 3rem;  
            padding: 0%; border: none; 
            margin: auto 0rem ;

        }
        .row_toggle_items{
            position: absolute; 
            top: 50%; left: 50%;
            
            display: block;
            height: 6px; width: 75%;
            margin: 0px;
            border-radius: 10px;

            transform: translate(-50%,-50%);
            transition: all 0.3s ease;
        }
        .l_1{
            transform: translate(-50%, -15px);  /* -20px */
        } 
        .l_3{       
            transform: translate(-50%, 9px);  /* 15px */
        }

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

    .nav-ul{
        position: absolute; 
        top: 5rem; right: -100%;
        
        box-sizing: border-box;
        height: 30rem!important;     width: 100%;
        margin: 0; padding: 0;

    }
        .li-items{

            height: 25%; width: 100%; 
         

        }
            .nav-items{
                
                height: 100%; width: 100%; 
             
                font-size: 18px!important; 
            }
    
/**-------------------------- P O R T A D A ----------------------------------------------------*/

    .hd--content-position{ 
    
        height: 91%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: space-around;

    
    }
    /**-------   T I T U L O  ------------------*/
    
        .hd--conteiner--title{

            height: 30%;
            width: 100%; 
            padding: 0% !important;
            margin: 0rem auto 0rem auto!important;

            /* border: solid 1px yellow; */
        }
            .hd--title{
                display: block;
                height: 100%; width: 97%;
                padding: 0rem 0rem!important; 
                margin: 0% auto;
            

                font-size: 39px!important;
                line-height: 40px!important;   
                letter-spacing: 2.8px;
                /* background-color: rgb(231, 140, 21); */
            }
    
    /**-------   S E R V I C I O S ------------------*/

        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */
            height: auto; width: 97%;
            padding: 0rem 0rem;
            margin: 0% auto 0% auto;

            box-sizing: border-box!important;
            overflow: hidden;
            
        /* background-color: aquamarine; */
        }
            .hd--items{
                height: 100%; width: 100%; 
                padding: 0.5rem!important ; margin: auto;

                font-size: 12px;
                letter-spacing: 0.7px;
            }


/**---------------------- B T N S  ------------------------------------------------------*/

    .hd--conteiner--btns{
        /* background-color: darkmagenta; */
        width: 100%; 
        border: none; margin: -1rem 0rem 2rem 0rem!important;

        display: flex; flex-flow: column; 
        justify-content: center;
    
    }
                                            

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 2.2rem!important; width: 50%; 
            padding: 0.9rem 1.5rem; border: none; 
            margin: 0.4rem 0.2rem 0.4rem 0.2rem;
        

            font-size: 12px!important; letter-spacing: 0.8px;
        } 


}
    

/** Listo */

@media( max-width: 431px ) and ( min-height: 940px ){

.main{

    height: 55rem; 

}
.main::after{
    display: block;
    position: absolute; 
    top: 53.5rem!important; left: 50%;

    height: 3.5rem!important; width: 3.5px;
    border-radius: 1.2px;
    
}
  
.nav{
    height: 5.5rem!important; width: 100%;
    padding: 0rem 1.5rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
 
    }
        .nav--contenedor--logo{ 
            height: 5.5rem!important; width: 11rem!important;
            margin: 0rem; 
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px rgb(17, 255, 0); */
            }        
        /**Burber btn*/
        
        .nav-toggle{
            position: absolute; top: 0%; right: 0%;

            box-sizing: border-box;
            height: 5.5rem; width: 5.5rem; 

        
        }
            /* .nav-toggle--item{
                height: 3.5rem;     
            } */

        .row_toggle{
            position: relative; 

            display: block; 
            height: 3rem;  
            width: 3rem;  
            padding: 0%; border: none; 
            margin: auto 0rem ;

        }
        .row_toggle_items{
            position: absolute; 
            top: 50%; left: 50%;
            
            display: block;
            height: 6px; width: 75%;
            margin: 0px;
            border-radius: 10px;

            transform: translate(-50%,-50%);
            transition: all 0.3s ease;
        }
        .l_1{
            transform: translate(-50%, -15px);  /* -20px */
        } 
        .l_3{       
            transform: translate(-50%, 9px);  /* 15px */
        }
       
        /*---------------------------------------*/
        

        .nav--contenedor--logo{
        
            height: 100%; width: 8rem;
            /* background-color: rgb(226, 43, 43); */
        }
            .nav--logo{
                height: 100%; width: 100%;
        
                font-size: 24px;
                
            }
        

    .nav-ul{
        position: absolute; 
        top: 5rem; right: -100%;

        box-sizing: border-box;
        margin: 0;
        padding: 0;
        
        height: 50rem;     width: 100%;

    }
        .li-items{
    
            box-sizing: border-box;
            height: 25%; width: 100%; 

        }
            .nav-items{
                height: 100%; width: 100%; 
        
                font-size: 20px!important;
                letter-spacing: 2px;
            }
    
/**-------------------------- P O R T A D A ----------------------------------------------------*/

    .hd--content-position{ 
    
        height: 92%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: space-around;
    
    }
    /**-------   T I T U L O  ------------------*/
    
        .hd--conteiner--title{

            height: 30%;  width: 100%; 
            padding: 0% 0rem 0rem 0rem;
            margin: 0rem auto -3rem auto!important;

            /* border: solid 1px yellow; */
        }
            .hd--title{
                display: block;
                height: 100%; width: 97%;
                padding: 0rem 0rem; 
                margin: 0% auto;
            

                font-size: 50px!important;
                line-height: 52px!important;   
                letter-spacing: 2.3px;
                /* background-color: rgb(231, 140, 21); */
            }
    
/**-------   S E R V I C I O S ------------------*/

.hd--conteiner--servicios{ 
    /* border: 1px solid red;     */
    height: 33%; width: 97%;
    padding: 0rem 0rem;
    margin: 0% auto -2rem auto;

    /* background-color: aquamarine; */
}
    .hd--items{

        height: 100%; width: 100%; 
        padding: 0.7rem!important; margin: 0rem auto;

    
        font-size: 16px;
        letter-spacing: 0.7px; 
    }

 
/**----------------- B T N S  CO N T A C T O ---------------------- */

    .hd--conteiner--btns{
        /* background-color: darkmagenta; */
        width: 100%; 
        border: none; margin: 0rem 0rem 4rem 0rem;

    
    }                                           

        .hd--btn{
 
            height: 3rem; width: 60%; 
            padding: 0.9rem 1.5rem; border: none; 
            margin: 0.6rem 0.2rem 0.6rem 0.2rem;
        

            font-size: 16px; letter-spacing: 0.5px;
        } 


}

/** iphon 14 pro max */
@media( max-width: 431px ) and ( max-height: 939px ){

.main{

    height: 100vh!important; 

}
.main::after{
    position: absolute; 
    bottom: -7%!important; left: 50%;

    height: 4.3rem; width: 3.5px;
    border-radius: 1.2px;
    display: none;
    
}

  
.nav{
    height: 5.5rem!important; width: 100%;
    padding: 0rem 1.5rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
 
    }
        .nav--contenedor--logo{ 
            height: 5.5rem!important; width: 11rem!important;
            margin: 0rem; 
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px rgb(17, 255, 0); */
            }        
 
        /**Burber btn*/
        .nav-toggle{
            position: absolute; top: 0%; right: 0%;

            box-sizing: border-box;
            height: 5rem; width: 5rem; 

        }
            /* .nav-toggle--item{
                height: 3.5rem;     
            } */

        .row_toggle{
            position: relative; 
            display: block; 
            height: 3.3rem;  
            width: 3.3rem;  
            padding: 0%; border: none; 
            margin: auto 0rem ;

        }
        .row_toggle_items{
            position: absolute; 
            top: 50%; 
            left: 50%;
            display: block;
            height: 6px; width: 60%;
            margin: 0px; border: none;
            border-radius: 10px;

            transform: translate(-50%,-50%);
            transition: all 0.3s ease;
        }
        .l_1{
            transform: translate(-50%, -14px);  /* -20px */
        } 
        .l_3{       
            transform: translate(-50%, 8px);  /* 15px */
        }
    
        /*---------------------------------------*/
 

        .nav--contenedor--logo{
        
            height: 100%; width: 8rem;
            /* background-color: rgb(226, 43, 43); */
        }
            .nav--logo{
                height: 100%; width: 100%;
        
                font-size: 24px;
                
            }
        

    .nav-ul{
        position: absolute; 
        top: 5rem; right: -100%;

        box-sizing: border-box;
        margin: 0;
        padding: 0;
        
        height: 91.5vh!important;     width: 100%;

    }
        .li-items{
    
            box-sizing: border-box;
            height: 25%; width: 100%; 

        

        }
            .nav-items{
                
                height: 100%; width: 100%; 
                /* margin: 5px 5px 5px 5px; */

                /* background-color: rgb(255, 247, 0); */
                font-size: 24px!important;
            }
    
/**-------------------------- P O R T A D A ----------------------------------------------------*/

    .hd--content-position{ 
    
        height: 92%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: space-around;
    
    }
    /**-------   T I T U L O  ------------------*/
    
        .hd--conteiner--title{

            height: 30%;  width: 100%; 
            padding: 0% 0rem 0rem 0rem;
            margin: 0rem auto -3rem auto!important;

            /* border: solid 1px yellow; */
        }
            .hd--title{
                display: block;
                height: 100%; width: 98%;
                padding: 0rem 0rem; 
                margin: 0% auto;
            

                font-size: 45px!important;
                line-height: 48px!important;   
                letter-spacing: 2.3px;
                /* background-color: rgb(231, 140, 21); */
            }
    
/**-------   S E R V I C I O S ------------------*/

.hd--conteiner--servicios{ 
    /* border: 1px solid red;     */
    height: 34%; width: 100%;
    padding: 0rem 0rem;
    margin: 0% auto -2rem auto;

    /* background-color: aquamarine; */
}
    .hd--items{

        height: 100%; width: 100%; 
        padding: 0.7rem!important; margin: 0rem auto;

    
        font-size: 16px;
        letter-spacing: 0.7px; 
    }

    .hd--items--8{
        border: none; 
        display: flex; flex-direction: column; 
        justify-content: center; align-items: center;
        /* border-right: 1px var(--whiteDarck) solid;    */
 
    }


/**----------------- B T N S  CO N T A C T O ---------------------- */

    .hd--conteiner--btns{
        /* background-color: darkmagenta; */
        width: 100%; 
        border: none; margin: 0rem 0rem 4rem 0rem;

        display: flex; flex-flow: column; 
        justify-content: center;
    
    }                                           

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;

            height: 3rem; width: 60%; 
            padding: 0.9rem 1.5rem; border: none; 
            margin: 0.6rem 0.2rem 0.6rem 0.2rem;
        

            font-size: 16px; letter-spacing: 0.5px;
        } 


}

/** iphon XR */
@media(max-width: 430px) and ( max-height: 900px){

.main{

    height: 100vh; 

}
.main::after{
    position: absolute; bottom: -4%; left: 50%;

    height: 4.3rem; width: 3.5px;
    border-radius: 1.2px;

    /* border-bottom: 66vh #2a02375f solid;   */
    
}
   
.nav{
    height: 5rem!important; width: 100%;
    padding: 0rem 1rem; margin: 0rem 0rem 0rem 0rem;
    background-color: var( --opacity2 );
}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        
      
    /* border: solid 2px red;        */
    }
        .nav--contenedor--logo{ 
            height: 5rem!important; width: 11rem!important;
            margin: 0rem; 
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px rgb(17, 255, 0); */
            }        
 
        /**Burber btn*/

        .nav-toggle{
            position: absolute; top: 0%; right: 0%;

            box-sizing: border-box;
            height: 5rem; width: 5rem; 

        }
            /* .nav-toggle--item{
                height: 3.5rem;     
            } */
        
        .row_toggle{
            position: relative; 
            display: block; 
            height: 3.3rem;  
            width: 3.3rem;  
            padding: 0%; border: none; 
            margin: auto 0rem ;

        }
        .row_toggle_items{
            position: absolute; 
            top: 50%; 
            left: 50%;
            display: block;
            height: 6px; width: 60%;
            margin: 0px; border: none;
            border-radius: 10px;

            transform: translate(-50%,-50%);
            transition: all 0.3s ease;
        }
        .l_1{
            transform: translate(-50%, -14px);  /* -20px */
        } 
        .l_3{       
            transform: translate(-50%, 8px);  /* 15px */
        }
    
        /*---------------------------------------*/
     


    .nav-ul{
        position: absolute; 
        top: 5rem; right: -100%;

        box-sizing: border-box;
        margin: 0;
        padding: 0;
        
        height: 91.5vh!important;     width: 100%;



    }
        .li-items{
            box-sizing: border-box;
            height: 25%; width: 100%; 

        }
            .nav-items{
                
                height: 100%; width: 100%; 
          
                font-size: 20px!important;
            }
    
/**-------------------------- P O R T A D A ----------------------------------------------------*/

    .hd--content-position{ 
    
        height: 92%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: space-around;

        background-color: var( --opacity2 );

    
    }
    /**-------   T I T U L O  ------------------*/
    
        .hd--conteiner--title{

            height: 34%;  width: 100%; 
            padding: 0% 0rem 0rem 0rem;
            margin: -3rem auto -3rem auto;

            /* border: solid 1px yellow; */
        }
            .hd--title{
                display: block;
                height: 100%; width: 98%;
                padding: 0rem 0rem; 
                margin: 0% auto;
            

                font-size: 47px!important;
                line-height: 52px!important;   
                letter-spacing: 2.3px;
                /* background-color: rgb(231, 140, 21); */
            }
    
/**-------   S E R V I C I O S ------------------*/

.hd--conteiner--servicios{ 
    /* border: 1px solid red;     */
    height: 32%; width: 97%;
    padding: 0rem 0rem;
    margin: 0% auto -1rem auto;

    /* background-color: aquamarine; */
}
    .hd--items{

        height: 100%; width: 100%; 
        padding: 0.8rem !important; margin: auto;

        font-size: 16px;
        letter-spacing: 0.7px;
    }
/**----------------- B T N S  CO N T A C T O ---------------------- */

    .hd--conteiner--btns{
        /* background-color: darkmagenta; */
        width: 100%; 
        border: none; margin: 0rem 0rem 4rem 0rem;

        display: flex; flex-flow: column; 
        justify-content: center;
    
    }                                           

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;

            height: 3rem; width: 60%; 
            padding: 0.9rem 1.5rem; border: none; 
            margin: 0.6rem 0.2rem 0.6rem 0.2rem;
        

            font-size: 16px; letter-spacing: 0.5px;
        } 


}

@media(max-width: 430px) and ( max-height: 807px){

.main{
    height: 100vh; 
}
.main::after{
    z-index: 700;
    position: absolute; bottom: -4%; left: 50%;

    height: 4.3rem; width: 3.5px;
    border-radius: 1.2px;

    /* border-bottom: 66vh #2a02375f solid;   */
    
}
 
.nav{
    height: 5rem!important; width: 100%;
    padding: 0rem 1rem; margin: 0rem 0rem 0rem 0rem;
    /* background-color: var( --opacity2 ); */
}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        
      
    /* border: solid 2px red;        */
    }
        .nav--contenedor--logo{ 
            height: 5rem!important; width: 10rem!important;
            margin: 0rem; 
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px rgb(17, 255, 0); */
            }        
                    

    .nav-ul{
        position: absolute; 
        top: 5rem; right: -100%;

        box-sizing: border-box;
        margin: 0;
        padding: 0;
        
        height: 91.5vh!important;     width: 100%;

    }
        .li-items{
    
            box-sizing: border-box;
            height: 25%; width: 100%; 

        }
            .nav-items{
                
                height: 100%; width: 100%; 
           
                font-size: 30px;
            }
    
/**-------------------------- P O R T A D A ----------------------------------------------------*/

    .hd--content-position{ 
    
        height: 92%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: space-around;

    
    }
    /**-------   T I T U L O  ------------------*/
    
        .hd--conteiner--title{

            height: 34%;  width: 97%!important; 
            padding: 0% 0rem 0rem 0rem!important;
            margin: 0rem auto -2rem auto!important;

            /* border: solid 1px yellow; */
        }
            .hd--title{
                display: block;
                height: 100%; width: 100%;
                padding: 0rem 0rem!important; 
                margin: 0% !important;
            

                font-size: 44px!important;
                line-height: 43px!important;   
                letter-spacing: 2.3px;
                /* background-color: rgb(231, 140, 21); */
            }
    
/**-------   S E R V I C I O S ------------------*/

.hd--conteiner--servicios{ 
    /* border: 1px solid red;     */
    height: 30%; width: 97%;
    padding: 0rem 0rem;
    margin: 0% auto -2rem auto;

    /* background-color: aquamarine; */
}
    .hd--items{

        height: 100%; width: 100%; 
        padding: 0.5rem!important ; margin: auto;


        font-size: 14px;
        letter-spacing: 0.7px;
    }
/**----------------- B T N S  CO N T A C T O ---------------------- */

    .hd--conteiner--btns{
        /* background-color: darkmagenta; */
        width: 100%; 
        border: none; margin: 2rem 0rem 3rem 0rem;

        display: flex; flex-flow: column; 
        justify-content: center;
    
    }                                           

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;

            height: 2.8rem; width: 60%; 
            padding: 0.9rem 1.5rem; border: none; 
            margin: 0.6rem 0.2rem 0.6rem 0.2rem;
        

            font-size: 14px; letter-spacing: 0.5px;
        } 


}

@media(max-width: 430px) and ( max-height: 722px){

.main{
    height: 100vh; 

}
.main::after{
    z-index: 700;
    position: absolute; bottom: -4%; left: 50%;

    height: 4.3rem; width: 3.5px;
    border-radius: 1.2px;

    /* border-bottom: 66vh #2a02375f solid;   */
    
}
 
.nav{
    height: 5rem!important; width: 100%;
    padding: 0rem 1rem; margin: 0rem 0rem 0rem 0rem;

}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        
      
    /* border: solid 2px red;        */
    }
        .nav--contenedor--logo{ 
            height: 5rem!important; width: 10rem!important;
            margin: 0rem; 
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            }            

        
    .nav-ul{
        position: absolute; 
        top: 5rem; right: -100%;
        
        height: 89vh!important;     width: 100%;
        box-sizing: border-box;
        margin: 0; padding: 0;


    }
        .li-items{
    
            box-sizing: border-box;
            height: 25%; width: 100%; 

        }
            .nav-items{
                
                height: 100%; width: 100%; 
               
                font-size: 18px!important;
            }
    
/**-------------------------- P O R T A D A ----------------------------------------------------*/

    .hd--content-position{ 
    
        height: 92%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: space-around;
 
    }
    /**-------   T I T U L O  ------------------*/
    
        .hd--conteiner--title{

            height: 30%;  width: 97%; 
            padding: 0% 0rem 0rem 0rem;
            margin: -1rem auto -2rem auto;

            /* border: solid 1px yellow; */
        }
            .hd--title{
                display: block;
                height: 100%; width: 98%;
                padding: 0rem 0rem; 
                margin: 0% auto;
            

                font-size: 32px;
                line-height: 44px!important;   
                letter-spacing: 2.3px;
                /* background-color: rgb(231, 140, 21); */
            }
    
/**-------   S E R V I C I O S ------------------*/

.hd--conteiner--servicios{ 
    /* border: 1px solid red;     */
    height: 33%; width: 100%;
    padding: 0rem 0rem;
    margin: 0% auto -1rem auto;

    /* background-color: aquamarine; */
}
    .hd--items{

        height: 100%; width: 100%; 
        padding: 0.7rem!important ; margin: auto;

        font-size: 14px;
        letter-spacing: 0.7px;
    }
/**----------------- B T N S  CO N T A C T O ---------------------- */

    .hd--conteiner--btns{
        /* background-color: darkmagenta; */
        width: 100%; 
        border: none; margin: 0rem 0rem 1rem 0rem;

        display: flex; flex-flow: column; 
        justify-content: center;
    
    }                                           

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;

            height: 2.8rem; width: 55%; 
            padding: 0.9rem 1.5rem; border: none; 
            margin: 0.4rem 0.2rem 0.4rem 0.2rem;
        

            font-size: 14px; letter-spacing: 0.5px;
        } 


}

@media(max-width: 430px) and ( max-height: 647px){

.main{
    height: 100vh; 
}
.main::after{
    position: absolute; bottom: -4%; left: 50%;

    height: 4rem; width: 3.5px;
    border-radius: 1.2px;

    /* border-bottom: 66vh #2a02375f solid;   */
}
  
 
.nav{
    height: 5rem!important; width: 100%;
    padding: 0rem 1rem; margin: 0rem 0rem 0rem 0rem;
    background-color: var( --opacity2 );
}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        
      
    /* border: solid 2px red;        */
    }
        .nav--contenedor--logo{ 
            height: 5rem!important; width: 10rem!important;
            margin: 0rem; 
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px rgb(17, 255, 0); */
            }        
           

    .nav-ul{
        position: absolute; 
        top: 5rem; right: -100%;
        
        height: 88vh!important;      
        width: 100%;
        box-sizing: border-box;
        margin: 0; padding: 0;

    }
        .li-items{
    
            box-sizing: border-box;
            height: 25%; width: 100%; 

            /* background-color: rgb(255, 81, 0); */

        }
            .nav-items{ 
                height: 100%; width: 100%; 

                /* background-color: rgb(255, 247, 0); */
                font-size: 18px!important;
            }
    
/**-------------------------- P O R T A D A ----------------------------------------------------*/

    .hd--content-position{ 
    
        height: 92%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: space-around;
    
    }
    /**-------   T I T U L O  ------------------*/
    
        .hd--conteiner--title{

            height: 34%;  width: 97%; 
            padding: 0% 0rem 0rem 0rem;
            margin: 0rem auto -1rem auto!important;

            /* border: solid 1px yellow; */
        }
            .hd--title{
                display: block;
                height: 100%; width: 98%;
                padding: 0rem 0rem; 
                margin: 0% auto;
            

                font-size: 40px!important;
                line-height: 41px!important;   
                letter-spacing: 2.3px;
                /* background-color: rgb(231, 140, 21); */
            }
    
/**-------   S E R V I C I O S ------------------*/

    .hd--conteiner--servicios{ 
        /* border: 1px solid red;     */
        height: 33%; width: 97%;
        padding: 0rem;
        margin: 0% auto 0rem auto;

        /* background-color: aquamarine; */
    }
        .hd--items{

            height: 100%; width: 100%; 
            padding: 0.5rem ; margin: auto;

            font-size: 14px;
            letter-spacing: 0.7px;
        }
/**----------------- B T N S  C O N T A C T O ---------------------- */

    .hd--conteiner--btns{
        /* background-color: darkmagenta; */
        width: 100%; 
        border: none; margin: 0rem 0rem 1.5rem 0rem;

        display: flex; flex-flow: column; 
        justify-content: center;
    
    }                                           

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;

            height: 2.7rem; width: 55%; 
            padding: 0.9rem 1.5rem; border: none; 
            margin: 0.4rem 0.2rem 0.4rem 0.2rem;
        

            font-size: 14px!important; letter-spacing: 0.5px;
        } 


}

@media(max-width: 430px) and ( max-height: 594px ){

.main{
    height: 35rem!important; 

}
.main::after{ 
    display: block; 
    position: absolute; 
    top: 33.8rem!important; left: 50%;

    height: 2.5rem!important; width: 3px;
    border-radius: 1.2px;
}
 
.nav{
    height: 5rem!important; width: 100%;
    padding: 0rem 1rem; margin: 0rem 0rem 0rem 0rem;
}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        
      
    /* border: solid 2px red;        */
    }
        .nav--contenedor--logo{ 
            height: 5rem!important; width: 9rem!important;
            margin: 0rem; 
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px rgb(17, 255, 0); */
            }        
     
     /**Burber btn*/
    .nav-toggle{
        position: absolute; top: 0%; right: 0%;

        box-sizing: border-box;
        height: 5rem; width: 5rem; 

    }
        /* .nav-toggle--item{
            height: 3rem;     
        } */
        .row_toggle{
            position: relative; 
            display: block; 
            height: 3rem;  
            width: 3rem;  
            padding: 0%; border: none; 
            margin: auto 0rem ;

        }
        .row_toggle_items{
            position: absolute; 
            top: 50%; 
            left: 50%;
            display: block;
            height: 5px; width: 60%;
            margin: 0px; border: none;
            border-radius: 10px;

            transform: translate(-50%,-50%);
            transition: all 0.3s ease;
        }
        .l_1{
            transform: translate(-50%, -12px);  /* -20px */
        } 
        .l_3{       
            transform: translate(-50%, 7px);  /* 15px */
        }
        /*---------------------------------------*/

        .nav--contenedor--logo{
        
            height: 100%; width: 8rem;
            /* background-color: rgb(226, 43, 43); */
        }
            .nav--logo{
                height: 100%; width: 100%;
                
                font-size: 24px;
                
            }
        

    .nav-ul{
        position: absolute; 
        top: 5rem; right: -100%;
        
        height: 30rem!important;    



    }
        .li-items{
    
            height: 25%; width: 100%; 

            /* background-color: rgb(255, 81, 0); */

        }
            .nav-items{
                
                height: 100%; width: 100%; 
                /* margin: 5px 5px 5px 5px; */

                /* background-color: rgb(255, 247, 0); */
                font-size: 18px!important;
            }
    
/**-------------------------- P O R T A D A ----------------------------------------------------*/

    .hd--content-position{ 
    
        height: 92%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: space-around;
    
    }
    /**-------   T I T U L O  ------------------*/
    
        .hd--conteiner--title{

            height: 30%;  width: 95%!important; 
            padding: 0% 0rem 0rem 0rem;
            margin: -1.5rem auto 0rem auto;

            /* border: solid 1px yellow; */
        }
            .hd--title{
                display: block;
                height: 100%; width: 100%;
                padding: 0rem 0rem; 
                margin: 0% auto;
            

                font-size: 40px!important;
                line-height: 40px!important;   
                letter-spacing: 2.3px;
                /* background-color: rgb(231, 140, 21); */
            }
    
/**-------   S E R V I C I O S ------------------*/

    .hd--conteiner--servicios{ 
        /* border: 1px solid red;     */
        height: 30%; width: 97%;
        padding: 0rem 0rem;
        margin: 1rem auto 0rem auto;

        /* background-color: aquamarine; */
    }
        .hd--items{

            height: 100%; width: 100%; 
            padding: 0.5rem!important ; margin: auto;

            font-size: 12px;
            letter-spacing: 0.7px;
        }
/**----------------- B T N S  C O N T A C T O ---------------------- */

    .hd--conteiner--btns{
        /* background-color: darkmagenta; */
        width: 100%; 
        border: none; margin: 0rem 0rem 1rem 0rem!important;

        display: flex; flex-flow: column; 
        justify-content: center;
    
    }                                           

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;

            height: 2.2rem!important; width: 55%; 
            padding: 0.7rem 1.5rem; border: none; 
            margin: 0.4rem 0.2rem 0.4rem 0.2rem;
        

            font-size: 12px!important; letter-spacing: 0.5px;
        } 


}


/**/


@media(max-width:385px) and ( min-height: 748px ){

.main{
    height: 37rem!important; 
    width: 100%!important;

}
.main::after{
    display: block;

    position: absolute; 
    top: 35.8rem!important; left: 50%;

    height: 2.8rem!important; width: 3px;
    
}
    
 
.nav{
    height: 5rem!important; width: 100%;
    padding: 0rem 1rem; margin: 0rem 0rem 0rem 0rem;
}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        
      
    /* border: solid 2px red;        */
    }
        .nav--contenedor--logo{ 
            height: 5rem!important; width: 9rem!important;
            margin: 0rem; 
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px rgb(17, 255, 0); */
            }        

        
        /**Burber btn*/
        .nav-toggle{
            position: absolute; top: 0%; right: 0%;

            box-sizing: border-box;
            height: 5rem; width: 5rem; 

        }
            /* .nav-toggle--item{
                height: 3.2rem; 

            } */

         .row_toggle{
            position: relative; 
            display: block; 
            height: 3.3rem;  
            width: 3.3rem;  
            padding: 0%; border: none; 
            margin: auto 0rem ;
        }
        .row_toggle_items{
            position: absolute; 
            top: 50%; 
            left: 50%;
            display: block;
            height: 6px; width: 60%;
            margin: 0px; border: none;
            border-radius: 10px;

            transform: translate(-50%,-50%);
            transition: all 0.3s ease;
        }
        .l_1{
            transform: translate(-50%, -14px);  /* -20px */
        } 
        .l_3{       
            transform: translate(-50%, 8px);  /* 15px */
        }
        /*---------------------------------------*/

    .nav-ul{
    
        height: 32rem!important;     width: 100%;
        padding: 0; margin: 0;

    }
        .li-items{
            height: 25%; width: 100%; 

        }
            .nav-items{
                
                height: 100%; width: 100%; 


                font-size: 18px!important;
            }
    
/**-------------------------- P O R T A D A ----------------------------------------------------*/

    .hd--content-position{ 
    
        height: 91%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: space-between;

    
    }
    /**-------   T I T U L O  ------------------*/
    
        .hd--conteiner--title{

            height: 30%; width: 95%!important; 
            padding: 0% 0rem 0rem 0rem;
            margin: 0rem auto 0rem auto;

            /* border: solid 1px yellow; */
        }
            .hd--title{
                display: block;
                height: 100%; width: 100%;
                padding: 0rem 0rem; 
                margin: 0% auto;
            

                font-size: 35px!important;
                line-height: 37px!important;   
                letter-spacing: 2.3px;
                /* background-color: rgb(231, 140, 21); */
            }
    
    /**-------   S E R V I C I O S ------------------*/

    .hd--conteiner--servicios{ 
        height: auto; width: 97%;
        padding: 0rem 0rem; margin: 1rem auto 0rem auto;

    }
    .hd--items{

        height: 100%; width: 100%; 
        padding: 0.6rem !important; margin: auto;


        font-size: 13px;
        letter-spacing: 0.7px;
    
    }


/**------------------- B O T N S   C O N T A C T O -------------------------------------------*/

    .hd--conteiner--btns{
        /* background-color: darkmagenta; */
        width: 100%; border: none; 
        margin: -1.5rem 0rem 2rem 0rem;

        display: flex; flex-flow: column; 
        justify-content: center;
        
        /* background-color: aqua; */
    
    }                                            

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 2.4rem; width: 55%; 
            padding: 0.9rem 1.5rem; 
            border: none; 
            margin: 0.4rem 0.2rem 0.4rem 0.2rem;
        

            font-size: 13px; letter-spacing: 0.5px;
        } 


}

@media(max-width:385px) and (max-height: 747px){

.main{
  
    height: 100vh; width: 100%!important;
    
}
.main::after{

    position: absolute; 
    bottom: -5%!important; left: 50%;
    height: 4.3rem; width: 3px;


    /* border-bottom: 66vh #2a02375f solid;   */
    
}

  
.nav{
    height: 5rem!important; width: 100%;
    padding: 0rem 1rem; margin: 0rem 0rem 0rem 0rem;
}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        
      
    /* border: solid 2px red;        */
    }
        .nav--contenedor--logo{ 
            height: 5rem!important; width: 8rem!important;
            margin: 0rem; 
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px rgb(17, 255, 0); */
            }        
  

        /**Burber btn*/

        .nav-toggle{
            position: absolute; top: 0%; right: 0%;

            box-sizing: border-box;
            height: 5rem; width: 5rem; 

        }
            /* .nav-toggle--item{
                height: 3.2rem; 
            } */

         .row_toggle{
            position: relative; 
            display: block; 
            height: 3.3rem;  
            width: 3.3rem;  
            padding: 0%; border: none; 
            margin: auto 0rem ;
        }
        .row_toggle_items{
            position: absolute; 
            top: 50%; 
            left: 50%;
            display: block;
            height: 6px; width: 60%;
            margin: 0px; border: none;
            border-radius: 10px;

            transform: translate(-50%,-50%);
            transition: all 0.3s ease;
        }
        .l_1{
            transform: translate(-50%, -14px);  /* -20px */
        } 
        .l_3{       
            transform: translate(-50%, 8px);  /* 15px */
        }
        /*---------------------------------------*/

        
    .nav-ul{
        position: absolute; 
        top: 5rem; right: -100%;

        margin: 0;
        padding: 0;

        height: 91vh!important;     width: 100%;
    }
        .li-items{
            height: 25%; width: 100%; 
     

        }
            .nav-items{
                height: 100%; width: 100%; 
        
                font-size: 18px!important;
            }
    
/**-------------------------- P O R T A D A ----------------------------------------------------*/

    .hd--content-position{ 
    
        height: 91%; width: 100%;

        display: flex; flex-flow: column wrap;
        justify-content: space-between!important;

    }
    /**-------   T I T U L O  ------------------*/
    
        .hd--conteiner--title{

            height: 30%; width: 95%!important; 
            padding: 0% 0rem 0rem 0rem; margin: 0rem auto -1rem auto;

            /* border: solid 1px yellow; */
        }
            .hd--title{
                display: block;
                height: 100%; width: 100%;
                padding: 0rem 0rem; 
                margin: 0% auto;
            

                font-size: 38px!important;
                line-height: 40px!important;   
                letter-spacing: 2.3px;
                /* background-color: rgb(231, 140, 21); */
            }
    
    /**-------   S E R V I C I O S ------------------*/

    .hd--conteiner--servicios{ 
        /* border: 1px solid red;     */
        height: auto; width: 97%;
        padding: 0rem 0rem;
        margin: 0.5rem auto 0% auto;

    
        /* background-color: rgb(185, 127, 255); */
    }
    .hd--items{

        box-sizing: border-box!important;
        height: 100%; width: 100%; 
        padding: 0.8rem!important ; margin: auto;

        font-size: 14px;
        letter-spacing: 0.7px;
    
    }


/**------------------- B O T N S   C O N T A C T O -------------------------------------------*/

    .hd--conteiner--btns{
        /* background-color: darkmagenta; */
        width: 100%; border: none; 
        margin: 0% 0rem 4rem 0rem;

        display: flex; flex-flow: column; 
        justify-content: center;
    
    }
                                                  

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;

            height: 2.4rem; width: 60%; 
            padding: 0.9rem 1.5rem; border: none; 
            margin: 0.5rem 0.2rem 0.5rem 0.2rem;

            font-size: 14px; letter-spacing: 0.5px;
        } 


}


@media(max-width: 357px) and (max-height: 747px){
  

    /**-------------------------- P O R T A D A ----------------------------------------------------*/
    
        .hd--content-position{ 
        
            height: 91%; width: 100%;
    
            display: flex; flex-flow: column wrap;
            justify-content: space-between!important;
    
        }
        /**-------   T I T U L O  ------------------*/
        
            .hd--conteiner--title{
    
                height: 30%; width: 95%!important; 
                padding: 0% 0rem 0rem 0rem; 
                margin: 0rem auto -1rem auto!important;
    
                /* border: solid 1px yellow; */
            }
                .hd--title{
                    display: block;
                    height: 100%; width: 100%;
                    padding: 0rem 0rem; 
                    margin: 0% auto;
                
    
                    font-size: 38px!important;
                    line-height: 40px!important;   
                    letter-spacing: 2.3px;
                    /* background-color: rgb(231, 140, 21); */
                }
        
        /**-------   S E R V I C I O S ------------------*/
    
        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */
            height: 33%; width: 97%;
            padding: 0rem 0rem;
            margin: 0rem auto 0% auto;
    
        
            /* background-color: rgb(185, 127, 255); */
        }
        .hd--items{
    
            box-sizing: border-box!important;
            height: 100%; width: 100%; 
            padding: 0.9rem!important ; margin: auto;
    
            font-size: 13px;
            letter-spacing: 0.7px;
        
        }
    
    
    /**------------------- B O T N S   C O N T A C T O -------------------------------------------*/
    
        .hd--conteiner--btns{
            /* background-color: darkmagenta; */
            width: 100%; border: none; 
            margin: 0% 0rem 3rem 0rem;
    
            display: flex; flex-flow: column; 
            justify-content: center;
        
        }
                                                      
    
            .hd--btn{
                box-sizing: border-box;
                display: inline-block;
    
                height: 2.4rem; width: 60%; 
                padding: 0.9rem 1.5rem; border: none; 
                margin: 0.5rem 0.2rem 0.5rem 0.2rem;
    
                font-size: 13px; letter-spacing: 0.5px;
            } 
    
    
}
@media(max-width: 357px) and (max-height: 700px){

    .main{
      
        height: 100vh; width: 100%!important;
        
    }
    .main::after{
    
        position: absolute; 
        bottom: -5%!important; left: 50%;
        height: 4.3rem; width: 3px;
    
    
        /* border-bottom: 66vh #2a02375f solid;   */
        
    }
    
      
    .nav{
        height: 5rem!important; width: 100%;
        padding: 0rem 1rem; margin: 0rem 0rem 0rem 0rem;
    }
        .nav__row{
            box-sizing: border-box;
            height: 100%; width: 100% ; 
            padding: 0rem 0rem ; 
            border:none; margin: 0% 0% 0% 0%;
            
          
        /* border: solid 2px red;        */
        }
            .nav--contenedor--logo{ 
                height: 5rem!important; width: 8rem!important;
                margin: 0rem; 
        
            }
                .nav--logo{
                    height: 100%; width: 100%;
                    padding: 0rem;
                    margin: 0rem auto;
                    
                /* border: solid 1px rgb(17, 255, 0); */
                }        
      
    
            .nav-toggle{
    
                height: 100%; width: 10%; 
                /* padding-right: 2rem; */
         
            }
                .nav-toggle--item{
                    height: 3.2rem; 
    
                
                }
    
            
    
        .nav-ul{
            position: absolute; 
            top: 5rem; right: -100%;
    
            margin: 0;
            padding: 0;
    
            height: 91vh!important;     width: 100%;
        }
            .li-items{
                height: 25%; width: 100%; 
         
    
            }
                .nav-items{
                    height: 100%; width: 100%; 
            
                    font-size: 18px!important;
                }
        
    /**-------------------------- P O R T A D A ----------------------------------------------------*/
    
        .hd--content-position{ 
        
            height: 91%; width: 100%;
    
            display: flex; flex-flow: column wrap;
            justify-content: space-between!important;
    
        }
        /**-------   T I T U L O  ------------------*/
        
            .hd--conteiner--title{
    
                height: 30%; width: 95%!important; 
                padding: 0% 0rem 0rem 0rem; 
                margin: 0rem auto -1rem auto!important;
    
                /* border: solid 1px yellow; */
            }
                .hd--title{
                    display: block;
                    height: 100%; width: 100%;
                    padding: 0rem 0rem; 
                    margin: 0% auto;
                
    
                    font-size: 38px!important;
                    line-height: 40px!important;   
                    letter-spacing: 2.3px;
                    /* background-color: rgb(231, 140, 21); */
                }
        
        /**-------   S E R V I C I O S ------------------*/
    
        .hd--conteiner--servicios{ 
            /* border: 1px solid red;     */
            height: auto; width: 97%;
            padding: 0rem 0rem;
            margin: 0.5rem auto 0% auto;
    
        
            /* background-color: rgb(185, 127, 255); */
        }
        .hd--items{
    
            box-sizing: border-box!important;
            height: 100%; width: 100%; 
            padding: 0.7rem!important ; margin: auto;
    
            font-size: 13px;
            letter-spacing: 0.7px;
        
        }
    
    
    /**------------------- B O T N S   C O N T A C T O -------------------------------------------*/
    
        .hd--conteiner--btns{
            /* background-color: darkmagenta; */
            width: 100%; border: none; 
            margin: 0% 0rem 3rem 0rem;
    
            display: flex; flex-flow: column; 
            justify-content: center;
        
        }
                                                      
    
            .hd--btn{
                box-sizing: border-box;
                display: inline-block;
    
                height: 2.4rem; width: 60%; 
                padding: 0.9rem 1.5rem; border: none; 
                margin: 0.5rem 0.2rem 0.5rem 0.2rem;
    
                font-size: 13px; letter-spacing: 0.5px;
            } 
    
    
}


@media(max-width:385px) and (max-height: 647px ){

.main{
    height: 100vh; width: 100%!important;


}
.main::after{
    position: absolute; bottom: -5.3%; left: 50%;
    height: 4.3rem; width: 3px;
    border-radius: 1.2px;
    
}


.nav{
    height: 5rem!important; width: 100%;
    padding: 0rem 1rem; margin: 0rem 0rem 0rem 0rem;
}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        
      
    /* border: solid 2px red;        */
    }
        .nav--contenedor--logo{ 
            height: 5rem!important; width: 8rem!important;
            margin: 0rem; 
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px rgb(17, 255, 0); */
            }        

        .nav-toggle{
            box-sizing: border-box;
            height: 100%; width: 10%; 
       
        }
            
        /**Burber btn*/

        .nav-toggle{
            position: absolute; top: 0%; right: 0%;
            box-sizing: border-box;
            height: 5rem; width: 5rem; 
        }
            /* .nav-toggle--item{
                height: 3rem; 
            
            } */

            .row_toggle{
                position: relative; 
                display: block; 
                height: 3.3rem;  
                width: 3.3rem;  
                padding: 0%; border: none; 
                margin: auto 0rem ;
            }
            .row_toggle_items{
                position: absolute; 
                top: 50%; 
                left: 50%;
                display: block;
                height: 6px; width: 60%;
                margin: 0px; border: none;
                border-radius: 10px;
    
                transform: translate(-50%,-50%);
                transition: all 0.3s ease;
            }
            .l_1{
                transform: translate(-50%, -14px);  /* -20px */
            } 
            .l_3{       
                transform: translate(-50%, 8px);  /* 15px */
            }
            /*---------------------------------------*/
            

    .nav-ul{
  
        position: absolute; 
        top: 5rem; right: -100%;
   
        box-sizing: border-box;
        margin: 0;
        padding: 0;

        height: 91vh!important;     width: 100%;

    }
        .li-items{
            height: 25%; width: 100%; 
            box-sizing: border-box;

            /* background-color: rgb(255, 81, 0); */

        }
            .nav-items{
                
                height: 100%; width: 100%; 
         
                font-size: 18px;
            }
    
/**-------------------------- P O R T A D A ----------------------------------------------------*/

    .hd--content-position{ 
    
        height: 91%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: space-between;
    
    }
    /**-------   T I T U L O  ------------------*/
    
        .hd--conteiner--title{

            height: 30%; width: 97%!important; 
            padding: 0% 0rem 0rem 0rem;
            margin: 0rem auto 0.5rem auto!important;

            /* border: solid 1px yellow; */
        }
            .hd--title{
                display: block;
                height: 100%; width: 95%;
                padding: 0rem 0rem; 
                margin: 0% auto;
            

                font-size: 38px!important;
                line-height: 39px!important;   
                letter-spacing: 2.3px;
                /* background-color: rgb(231, 140, 21); */
            }
    
    /**-------   S E R V I C I O S ------------------*/

    .hd--conteiner--servicios{ 

        /* border: 1px solid red;     */
        height: 32%; width: 97%;
        padding: 0rem 0rem; margin: 0rem auto 1rem auto!important;

    }

    .hd--items{

        box-sizing: border-box!important;
        height: 100%; width: 100%; 
        padding: 0.7rem!important ; margin: auto;

        font-size: 13px;
        letter-spacing: 0.7px;
    
    }



/**------------------- B O T N S   C O N T A C T O -------------------------------------------*/

    .hd--conteiner--btns{
        /* background-color: darkmagenta; */
        width: 100%; border: none; 
        margin: 0% 0rem 2.5rem 0rem;

    
    }
                                                    

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 2.4rem; width: 60%; 
            padding: 0.9rem 1.5rem; 
            border: none; 
            margin: 0.5rem 0.2rem 0.5rem 0.2rem;
        

            font-size: 13px!important; letter-spacing: 0.5px;
        } 


}

@media(max-width:385px) and (max-height: 594px ){

.main{
   
    height: 35rem!important; 
}
.main::after{
    display: block;
    position: absolute; 
    top: 33.5rem; left: 50%;

    height: 4.3rem; width: 2.4px!important;


    /* border-bottom: 66vh #2a02375f solid;  */
    
}

.nav{
    height: 5rem!important; width: 100%;
    padding: 0rem 1rem; margin: 0rem 0rem 0rem 0rem;
}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        
      
    /* border: solid 2px red;        */
    }
        .nav--contenedor--logo{ 
            height: 5rem!important; width: 8.5rem!important;
            margin: 0rem; 
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px rgb(17, 255, 0); */
            }      

    /**Burber btn*/
    
    .nav-toggle{
        position: absolute; top: 0%; right: 0%;

        box-sizing: border-box;
        height: 5rem; width: 5rem; 
    }
        /* .nav-toggle--item{
            height: 3rem;     
        } */
            
        .row_toggle{
            position: relative; 
            display: block; 
            height: 3rem;  
            width: 3rem;  
            padding: 0%; border: none; 
            margin: auto 0rem ;

        }
        .row_toggle_items{
            position: absolute; 
            top: 50%; 
            left: 50%;
            display: block;
            height: 5px; width: 60%;
            margin: 0px; border: none;
            border-radius: 10px;

            transform: translate(-50%,-50%);
            transition: all 0.3s ease;
        }
        .l_1{
            transform: translate(-50%, -12px);  /* -20px */
        } 
        .l_3{       
            transform: translate(-50%, 7px);  /* 15px */
        }
        
        /*---------------------------------------*/
        
            
        

    .nav-ul{
 
        position: absolute; 
        top: 5rem; right: -100%;

        margin: 0;
        padding: 0;

        height: 30rem!important;     width: 100%;

    }
        .li-items{
            height: 25%; width: 100%; 

            /* background-color: rgb(255, 81, 0); */

        }
            .nav-items{
                
                height: 100%; width: 100%; 
                /* margin: 5px 5px 5px 5px; */

                /* background-color: rgb(255, 247, 0); */
                font-size: 18px!important;           
            }
    
/**-------------------------- P O R T A D A --------------------------------------*/

    .hd--content-position{ 
    
        height: 91%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: space-between;
    
    }
    /**-------   T I T U L O  ------------------*/
    
        .hd--conteiner--title{

            height: 30%; width: 90%!important; 
            padding: 0% 0rem 0rem 0rem;
            margin: 0rem auto 0rem auto;

            /* border: solid 1px yellow; */
        }
            .hd--title{
                display: block;
                height: 100%; width: 100%;
                padding: 0rem!important; 
                margin: 0% auto!important;
            

                font-size: 37px!important;
                line-height: 37px!important;   
                letter-spacing: 2.3px;

                /* background-color: rgb(231, 140, 21); */
            }
    
    /**-------   S E R V I C I O S ------------------*/

    .hd--conteiner--servicios{ 

        /* border: 1px solid red;     */
        height: 32%; width: 97%;
        padding: 0rem 0rem; margin: 0rem auto 0rem auto!important;

    }

    .hd--items{

        box-sizing: border-box!important;
        height: 100%; width: 100%; 
        padding: 0.5rem!important ; margin: auto;

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

        font-size: 13px!important;
        letter-spacing: 0.7px;
    
    }


/**------------------- B O T N S   C O N T A C T O -------------------------------------------*/

    .hd--conteiner--btns{
        /* background-color: darkmagenta; */
         height: 25%!important; width: 100%; border: none; 
        margin: 0% 0rem 1.5rem 0rem!important;

        display: flex; flex-flow: column; 
        justify-content: center;
        
        /* background-color: aqua; */
    
    }                                     

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 2.4rem; width: 60%; 
            padding: 0.9rem 1.5rem; 
            border: none; 
            margin: 0.5rem 0.2rem 0.5rem 0.2rem;
        

            font-size: 12px!important; letter-spacing: 0.5px;
        } 


}



@media( max-width: 340px) {

.main{
    height: 37rem!important; 
    width: 100%!important;

}
.main::after{
    position: absolute; 
    top: 35.8rem!important; left: 50%;
    height: 2.3rem!important; width: 3px;
    
}
    .nav{
        /* position: fixed ; top: 0rem; right: 0px; */
        position: relative; 
        top: 0%;                                                
        left: 0%;

        height: 5rem; width: 100%; 
        padding: 0rem 0rem 0rem 0rem;
        border:none; margin: 0%;
   

    }
    .nav__row{

        height: 100%; width: 100%; 
        padding: 0rem 1.5rem 0rem 1rem; 
        border:none; margin: 0% 0% 0% 0%;
    
    }

        
        /**Burber btn*/

        .nav-toggle{
            position: absolute; top: 0%; right: 0%;

            box-sizing: border-box;
            height: 5rem; width: 4rem; 
   
        }
             /* .nav-toggle--item{
                height: 3.2rem; 

            } */

        .row_toggle{
            position: relative; 
            display: block; 
            height: 2.5rem;  
            width: 2.5rem;  
            padding: 0%; border: none; 
            margin: auto 0rem ;

        }
        .row_toggle_items{
            position: absolute; 
            top: 50%; 
            left: 50%;
            display: block;
            height: 4.3px; width: 63%;
            margin: 0px; border: none;
            border-radius: 10px;

            transform: translate(-50%,-50%);
            transition: all 0.3s ease;
        }
        .l_1{
            transform: translate(-50%, -10px);  /* -20px */
        } 
        .l_3{       
            transform: translate(-50%, 6px);  /* 15px */
        }
        
        /*---------------------------------------*/


        .nav--contenedor--logo{
                height: 100%; width: 5rem;
            /* background-color: rgb(226, 43, 43); */
        }
            .nav--logo{
                height: 100%; width: 100%;

                font-size: 22px;
                
            }
        

    .nav-ul{
    
        height: 32rem!important;     width: 100%;
        padding: 0; margin: 0;

    }
        .li-items{
            height: 25%; width: 100%; 

        }
            .nav-items{
                
                height: 100%; width: 100%; 
                /* margin: 5px 5px 5px 5px; */

                /* background-color: rgb(255, 247, 0); */
                font-size: 18px!important;
            }
    
/**-------------------------- P O R T A D A ----------------------------------------------------*/

    .hd--content-position{ 
    
        height: 91%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: space-between;

    
    }
    /**-------   T I T U L O  ------------------*/
    
        .hd--conteiner--title{

            height: 30%; width: 98%; 
            padding: 0% 0rem 0rem 0rem!important;
            margin: -0.5rem auto 0rem auto!important;

            /* border: solid 1px yellow; */
        }
            .hd--title{
                height: 100%; width: 97%!important;
                padding: 0rem 0rem!important; 
                margin: 0% auto!important;
            

                font-size: 30px!important;
                line-height: 37px!important;   
                letter-spacing: 2.3px;
                /* background-color: rgb(231, 140, 21); */
            }
    
    /**-------   S E R V I C I O S ------------------*/

    .hd--conteiner--servicios{ 
        height: 35%; width: 100%;
        padding: 0rem 0rem; margin: 1rem auto 0rem auto;

        /* background-color: rgb(231, 140, 21); */
    }
    .hd--items{

        height: 100%; width: 100%; 
        padding: 0.4rem!important; 
        margin: 0rem auto;


        font-size: 13px;
        letter-spacing: 0.7px;
    
    }


/**------------------- B O T N S   C O N T A C T O -------------------------------------------*/

    .hd--conteiner--btns{
        /* background-color: darkmagenta; */
        width: 100%; border: none; 
        margin: 0% 0rem 2rem 0rem;

        display: flex; flex-flow: column; 
        justify-content: center;
        
        /* background-color: aqua; */
    
    }                                            

        .hd--btn{
            box-sizing: border-box;
            display: inline-block;
            height: 2.4rem; width: 60%; 
            padding: 0.9rem 1.5rem; 
            border: none; 
            margin: 0.4rem 0.2rem 0.4rem 0.2rem;
        

            font-size: 12px!important; letter-spacing: 0.5px;
        } 


}


@media(max-width:290px){

.main{
 
    height: 37rem;

}
.main::after{
    position: absolute; 
    top: 36rem!important; right: 50%;
    height: 2.2rem!important; width: 3px;

    display: block;

    
}
    

.nav{
    height: 5rem!important; width: 100%;
    padding: 0rem 1rem; margin: 0rem 0rem 0rem 0rem;
}
    .nav__row{
        box-sizing: border-box;
        height: 100%; width: 100% ; 
        padding: 0rem 0rem ; 
        border:none; margin: 0% 0% 0% 0%;
        
      
    /* border: solid 2px red;        */
    }
        .nav--contenedor--logo{ 
            height: 5rem!important; width: 7rem!important;
            margin: 0rem; 
    
        }
            .nav--logo{
                height: 100%; width: 100%;
                padding: 0rem;
                margin: 0rem auto;
                
            /* border: solid 1px rgb(17, 255, 0); */
            }        


        /**Burber btn*/

        .nav-toggle{
            position: absolute; top: 0%; right: 0%;

            box-sizing: border-box;
            height: 5rem; width: 4rem; 
   
        }
            /* .nav-toggle--item{
                height: 2.8rem; 
            
            } */ 

        .row_toggle{
            position: relative; 
            display: block; 
            height: 2.5rem;  
            width: 2.5rem;  
            padding: 0%; border: none; 
            margin: auto 0rem ;

        }
        .row_toggle_items{
            position: absolute; 
            top: 50%; 
            left: 50%;
            display: block;
            height: 4.3px; width: 63%;
            margin: 0px; border: none;
            border-radius: 10px;

            transform: translate(-50%,-50%);
            transition: all 0.3s ease;
        }
        .l_1{
            transform: translate(-50%, -10px);  /* -20px */
        } 
        .l_3{       
            transform: translate(-50%, 6px);  /* 15px */
        }
        
        /*---------------------------------------*/

    .nav-ul{
      
        position: absolute; 
        top: 5rem; right: -100%;
     
        box-sizing: border-box;
        height: 32rem!important;  width: 100%;
        padding: 0; border: none;  margin: 0;
 
    }
        .li-items{

            height: 25%; width: 100%; 
 
            /* background-color: rgb(255, 81, 0); */

        }
            .nav-items{
                
                height: 100%; width: 100%; 
    
                font-size: 16px!important;
            }
    
/**-------------------------- P O R T A D A ----------------------------------------------------*/

    .hd--content-position{ 
    
        height: 91%; width: 100%;

        display: flex; flex-flow: column wrap; 
        justify-content: space-between;
    
    }
    /**-------   T I T U L O  ------------------*/
    
        .hd--conteiner--title{

            height: 30%;
            width: 100%!important; 
            padding: 0% 0rem 0rem 0rem!important;
            margin: 1rem auto 0rem auto!important;

            /* border: solid 1px yellow; */
        }
            .hd--title{
                display: block;
                height: 100%; width: 99%;
                padding: 0rem 0rem; 
                margin: 0% auto;

                font-size: 30px!important;
                line-height: 32px!important;   
                letter-spacing: 2.3px;
                /* background-color: rgb(21, 231, 67); */
            }
    
    /**-------   S E R V I C I O S ------------------*/

    .hd--conteiner--servicios{ 
        /* border: 1px solid red;     */
        height: 34%; width: 97%;
        padding: 0rem 0rem;
        margin: 0.5rem auto 0.5rem auto !important;

        /* background-color: rgb(231, 140, 21); */
    }
    .hd--items{

        box-sizing: border-box!important;
        height: 100%; width: 100%; 
        padding: 0.4rem!important ; margin: auto;

        font-size: 12px;
        letter-spacing: 0.7px;
    
    }



/**------------------- B O T N S   C O N T A C T O -------------------------------------------*/

    .hd--conteiner--btns{
        /* background-color: darkmagenta; */
        width: 100%; border: none; 
        margin: 0% 0rem 2rem 0rem;

    
    }                                          

        .hd--btn{
       
            display: block;
            height: 2.3rem!important; width: 75%; 
            padding: 0.9rem 1.5rem; 
            border: none;  margin: 0.4rem auto 0.4rem auto;

            font-size: 12px!important; letter-spacing: 0.5px;
        } 


}