:root {
    --color-principal: #ff4403;
    --color-secundario:#000000;
    --color-whatsapp:#58c038;
    --color-contactos:#000000;
    --color-card:#ffff;
}


*{
    font-family: "Poppins";
}


/*background: linear-gradient(180deg, rgba(217, 217, 217, 0.56) 0%, rgba(115, 115, 115, 0.56) 100%);*/


/* ESTILOS GLOBALES*/






ol{
    margin:0px !important;
}


.navbar{
    padding:0px !important;
    height: auto !important;
}

.navbar__body-links {

    .active {
        span {
            font-weight: bold;
            color: var(--color-principal);
        }
    }
}


@media screen and (max-width:1000px){

    .navbar__body{
        display:flex !important;
        flex-direction: column-reverse !important;
    }

    .navbar__body-logo{

        width:60% !important;
    }

    .navbar__logo-links{

        display:flex !important;
        flex-direction: column !important;

        a{

            text-align: center !important;
            padding-top: 20px;

            img{
                margin:0 auto !important;
            }
        }

        ul{
            padding-bottom: 20px;
        }
    }
}



#header_menu{
    all:unset;
    display: block;
    padding:0 0  0 45px;
    position: sticky;
    top:0;
    left:0;
    z-index:910;
    background-color:var(--color-secundario);

    @media screen and (max-width:850px){
        padding:0;
    }

    ul{

        margin:0;
        padding:0;
        display:flex;
        justify-content: space-between;
        list-style: none;
        flex-direction: row;

        @media screen and (max-width:850px){
            flex-direction: column-reverse;
            justify-content: center;
        }


        li{

            all:unset;
            display:flex;
            justify-content: center;
            align-items: center;
            flex-direction: row;
            gap:20px;




            &:first-child{

                @media screen and (max-width:850px){
                    padding:15px;
                }


                a{



                    width:min-content;

                    img{
                        display: block;
                        width:100px;
                    }
                }

                div{
                    font-weight: 400;
                    color:white;


                    span{
                        color:var(--color-principal);
                    }
                }

            }


            &:last-child{
                all:unset;
                list-style:none ;
                display: grid;
                grid-template-columns: repeat(2,1fr);


                .contact_menu{

                    text-align: center;
                    font-size: 0.9em;
                    display:flex;
                    justify-content: center;
                    align-items: center;
                    gap:10px;
                    color:white;
                    padding:10px 30px 10px 30px;
                    text-decoration: none !important;

                    .text_contact{
                        div:first-child{
                            font-size:0.7em;
                        }
                    }



                    div:first-child{
                        i{
                            font-size: 1.5em;
                        }
                    }

                    div:last-child{
                        display:flex;
                        flex-direction: column;
                        justify-content: center;
                        align-items: center;
                        gap:3px;
                    }

                    &:first-child{
                        background-color: var(--color-whatsapp);
                    }


                    &:last-child{
                        background-color: var(--color-contactos);
                    }

                }
            }


        }
    }

}



.sombra_negra{
    width:100%;
    height: 200px;
    position: absolute;
    bottom:0;
    left:0;
    z-index: 900;
    background: linear-gradient(to top, rgba(0, 0, 0, 1.5), transparent);
}

.swiper-pagination-fraction, .swiper-pagination-custom, .swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal{
    bottom:auto !important;
}

#gpon_slider{

    position: relative;
    background-color: red;
    width:100%;



    .swiper-container{
        overflow: hidden;
        .swiper-wrapper{

            .swiper-slide{
                img{
                    width:100%;
                }
            }
        }

        .swiper-pagination{
            position:relative;

        }

    }






    #gpon_slider_tapa{

        position: absolute;
        top:0;
        left:0;
        z-index:900;
        color:white;
        width:100%;
        height: 100%;
        display:flex;
        justify-content: space-around;
        align-items: flex-end;
        flex-direction: column;
        pointer-events: none;

        @media screen and (max-width:1200px){
           justify-content: center;
        }


        .ERLISOFT_card{

            transform:translateX(-80px);
            background-color: var(--color-card);
            height:min-content;
            border-radius: 50px;
            width:min-content;


            @media screen and (max-width:1200px){
                transform: translateX(-80px)scale(0.9,0.9);
            }

            @media screen and (max-width:1100px){
                transform: translateX(-80px)scale(0.8,0.8);
            }

            @media screen and (max-width:1000px){
                transform: translateX(-80px)scale(0.7,0.7);
            }

            @media screen and (max-width:950px){
                transform: translateX(-80px)scale(0.6,0.6);

            }

            @media screen and (max-width:750px){
                display: none;
            }


            .ERLISOFT_card_header{

                width:100%;
                padding:20px;
                background-color: var(--color-contactos);
                display: flex;
                justify-content: center;
                align-items: center;
                flex-direction: column;
                border-radius: 50px 50px 0 0;



                img{
                    width:75%;
                    display: block;
                }
            }

            .ERLISOFT_card_body{
                color:var(--color-contactos);
                pointer-events: all;

                form{

                    padding:30px;
                    display:grid;
                    grid-template-columns: repeat(1,1fr);
                    gap:10px;
                    pointer-events: all;
                    width:300px;



                    p{
                        font-weight: bold;
                        font-size: 1.2em;
                        margin:0;
                        padding:0;
                        text-align: center;
                    }

                    .select_llamanos{

                        display: flex;
                        justify-content: center;
                        align-items: center;
                        gap:10px;
                        border:1px solid var(--color-contactos);
                        font-weight: bold;




                        select{
                            width:65%;
                            text-align: center;
                            appearance: none;
                            font-size:.9em;
                            border:none;
                            outline:none;
                            font-weight:bold;
                        }



                    }


                    input[type=text]{
                        text-align: center;
                        border: 1px solid #C1C1C1

                    }

                    input[type=text]::placeholder{
                        font-weight: bold;
                    }

                    a{
                        color:black !important;
                    }


                    & .select_llamanos,& input[type=text]{
                        padding:12px 0 12px 0;
                        border-radius: 20px;


                    }


                    label{

                        font-size: .6em;
                        display:flex;
                        justify-content:flex-start;
                        align-items: center;
                        gap:8px;
                        margin:0;
                        padding:0;
                    }


                    button{
                        border-radius: 20px;
                        background-color: var(--color-contactos);
                        padding:20px;
                        color:white;
                        font-weight: bold;
                    }


                }
            }
        }

    }


}




.banner_form-header{

    img{
        padding:10px;
        display: block;
        width:85%;
    }
}

.banner_form{

    display:flex;
    flex-direction: column;
    gap:10px;

    p{
        margin-bottom: 10px !important;
    }



    .select_container{

        width:85%;
        display:flex;
        justify-content: center;
        align-items: centr;
        flex-direction: row;
        border:1px solid var(--color-contactos);
        border-radius: 5px;
        overflow: hidden;
        padding:7px;



        select{


            width:100%;
            border:none;
            appearance: none;
            margin: 0;

        }

    }

    input{
        width:85%;
        border-radius: 5px;
        border:1px solid var(--color-contactos);
        padding:7px;
    }


    ol{
        display:flex;
        flex-direction: column;
        list-style: none;
        margin-top: 10px !important;
        gap:5px;

        li{

            font-size: .8em;

            input{
                width:auto !important;
            }
        }
    }

}

.banner_form-container{


    height:auto !important;

    .banner_form-title{
        margin-bottom: 0px;
    }
}

.banner{
    .banner_carousel{
        .banner_item{

            padding:20px;
            background-color: var(--color-principal);

            a{
                display: block;

                img{
                    display: block;
                    width:35%;
                }
            }
        }
    }
}


.seccion_planes{

    position: relative;
    margin:0;


    .sombra_negra{
        display:none !important;
    }

    background: linear-gradient(
        var(--color-secundario),
        var(--color-principal),
        var(--color-secundario)
    );


    h2.seccion_planes-subtitle{
        display:flex;
        justify-content: center;
        align-items: center;
        gap:8px;
        font-weight: 400;
        color:white;

        strong{
            font-size: .9em;
            color:white;
            background: linear-gradient(90deg, #0A0A0A 0%, #FF4D00 100%);
            padding:7px;
            border-radius:0 10px 10px 10px;
        }
    }

    .seccion_planes-title{
        font-size: 3em;

        @media screen and (max-width:780px){
            font-size: 2.3em;
        }
    }

    .seccion_planes-subtitle{

        font-size: 1.6em;

        @media screen and (max-width:780px){
            font-size: 1.2em;
        }

        @media screen and (max-width:600px){
            font-size: 1.3em;
            display:flex;
            flex-direction: column;
            gap:15px !important;
        }
    }

    p.seccion_planes-destacado{
        all:unset;
        font-weight: 400 !important;
        color:var(--color-contactos);
        text-align: center;
        width:100%;
        text-align: center;
        display:flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        color:white;
        font-size: 1.3em;
        margin-bottom: 50px;

        @media screen and (max-width:780px){
            font-size: 1em;
        }

        @media screen and (max-width:500px){
            font-size: .9em;
            flex-direction: column-reverse;
            gap:20px;
        }

        span{


            position: relative;

            img{
                position: absolute;
                top:100%;
                left:0;
                width:100%;
            }
        }

    }
}


.plan_item_animate{

    position: relative;
    animation-name: efecto;
    animation-duration:2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;

}


@keyframes efecto {
    0%{
        top:0px;
    }
    50%{
        top:20px;
    }
    100%{
        top:0px;
    }
}



@keyframes brillo {
    0%{
        filter:brightness(1);
    }
    50%{
        filter:brightness(3);
    }
    100%{
        filter:brightness(1);
    }
}



.container_planes{

    all:unset;
    margin-top: 20px;
    display:grid;
    grid-template-columns: repeat(4,1fr);
    justify-content: center;
    align-items: center;
    gap:25px;



    @media screen and (max-width:1500px){
       grid-template-columns: repeat(3,1fr);
    }

    @media screen and (max-width:1200px){
        grid-template-columns: repeat(2,1fr);
    }

    @media screen and (max-width:800px){
        grid-template-columns: repeat(1,1fr);
    }



    &:hover .plan_item_nuevo:not(:hover){

        background-color: rgba(0,0,0,0.2);
        border-radius: 20px;
        overflow: hidden;
        transition: all 200ms;
        transform:scale(0.97,0.97);
        border:none !important;

        a{
            background-color: var(--color-principal) !important;
        }


    }


    .plan_item_nuevo{

        background-color: rgba(0,0,0,0.2);
        border-radius: 20px;
        overflow: hidden;
        transition: all 200ms;


        &:hover{
            transform:scale(1.0,1.0);
            background-color: var(--color-principal);
            border:3px solid white;

            a{
                background-color: black !important;
            }
        }




        &.plan_no_recomendado_efecto{
            background-color: var(--color-principal);
            border:3px solid white;

            .plan_item_container_recomendado{
                display:none;
            }

            .plan_item_container_nuevo{



                h3{
                    .mbps{
                        background-color: black !important;
                    }
                }

                hr{
                    border:1px solid #FFC5B0;
                }

                a{
                    background-color: black;
                }
            }
        }



        &.recomendado{
            background-color: var(--color-principal);
            border:3px solid white;

            .plan_item_container_recomendado{
                display:block;
            }

            .plan_item_container_nuevo{



                h3{
                    .mbps{
                        background-color: black !important;
                    }
                }

                hr{
                    border:1px solid #FFC5B0;
                }

                a{
                    background-color: black;
                }
            }
        }

        .plan_item_container_recomendado{
            background-color: white;
            width:100%;
            padding:10px;
            text-align: center;
            color:black;
            font-weight: bold;
            font-size: 1.5em;
            display:none;
        }


        .plan_item_container_nuevo{


            display:flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap:17px;
            padding: 30px 20px 30px 20px;


            h6{
                font-size: 2.3em;
                font-weight: 800;
                color:white;
            }


            h3{

                position: relative;
                display:flex;
                justify-content: flex-end;
                margin:0;
                padding:0;
                align-items: center;

                strong{
                    color:white;
                    font-style: italic;
                    font-family: "Kanit", sans-serif !important;
                    font-weight: 800;
                    font-size: 3.2em;
                    overflow: hidden;
                    line-height: 69px;
                }

                div.mbps{

                    all:unset;
                    position:absolute;
                    right: -25px;
                    font-size:13px;
                    background-color: var(--color-principal);
                    font-weight: 700;
                    color:white;
                    border-radius: 3px;
                    padding:3px 5px 3px 5px;
                    transform: skewX(-17deg);
                    text-rendering: geometricPrecision;
                }
            }

            hr{
                border:1px solid var(--color-principal);
                width:70%;
                border-radius: 10px;
                margin:0;
                padding:0;
            }

            p{
                font-family: "Poppins", sans-serif;
                color:White;
                text-rendering: geometricPrecision;
                font-size: .9em;
                margin:0;
                padding:0;
            }

            .bono{


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


                h5{
                    margin:0;
                    padding:0;
                    font-style: italic;
                }

                h3{
                    .mbps{
                        right:32px;
                    }
                }

                h5:first-of-type{
                    font-style:italic;
                    font-size: .9em;
                    padding:2px;
                    font-weight: bold;
                    border-radius: 5px;
                    background-color: #FFD21F;
                }

                h5:last-of-type{
                    font-size: .9em;
                    color:white;
                    font-family: "Kanit", sans-serif;
                    font-weight: 600;
                    font-style: italic;
                }
            }


            .recibe_gratis{
                display:flex;
                justify-content: center;
                align-items: center;
                gap:6px;

                p{

                    margin:0;
                    padding:0;
                    font-family: "Poppins", sans-serif;
                    font-weight: 400;

                    strong{
                        font-family: "Poppins", sans-serif;
                        font-weight: 600;
                    }
                }

                div{

                    width:min-content;

                    img{
                        width:33px;

                    }
                }

                img.full_logo{
                    width:40%;
                }

            }


            .incluye{
                display:flex;
                justify-content: center;
                align-items: center;
                color:white;
                font-size: .9em;

                img{
                    width:25%;
                }
            }


            .mas{

                width:100%;
                font-size: 4.2em;
                font-weight: bold;
                color:white;
                font-style: italic;

                display:flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                line-height: 50px;



                img{
                    width:75%;
                }

            }


            .precio{

                color:white;



                div.precio_decimal{

                    font-style: italic;
                    display:flex;
                    justify-content: center;
                    align-items: center;
                    gap:8px;



                    span:first-child{
                        font-weight: 500;
                        font-size: 23px;
                        align-self: flex-end;
                    }

                    span:nth-child(2){

                        font-size:8.4em;
                        font-weight: 600;
                        overflow: hidden;
                        line-height: 100px;

                    }

                    span:last-child{

                        font-size: 50px;

                        align-self: flex-start;



                        .decimal{
                            line-height: 47px;
                            overflow: hidden;

                        }

                        .meses{


                            font-style:italic;
                            font-size: .3em;
                            padding:4px;
                            font-weight: bold;
                            border-radius: 5px;
                            transform:skewX(-7deg);
                            background-color: var(--color-principal);
                            white-space: nowrap;
                        }
                    }


                }


            }


            .precio_regular{
                font-family: "Poppins", sans-serif;
                font-weight: 500;
                color:white;
                font-size: 1.1em;
            }

            a{
                background-color: var(--color-principal);
                color:White;
                font-weight: 500;
                padding:4px 10px 4px 10px;
                border-radius: 10px;
                text-decoration: none;
                font-family: "Poppins", sans-serif;
                font-weight: 600;
            }
        }


    }

















    .plan_item{



        background: linear-gradient(179.31deg, #C63C00 -10.49%, #000000 104.47%);
        color:white;
        text-align: center;
        border-radius: 20px;
        height:min-content;
        transition: all 200ms;





        .plan_item_recomendado{
            font-size: 1.7em;
            padding:20px;
            border-bottom: 2px solid white;

        }







        &:last-child{



            color:white;
            grid-column: 1 / span 4;
            background: none!important;
            padding-top: 25px;
            text-align: initial !important;


            @media screen and (max-width:1500px){
                grid-column: 1 / span 3;
            }


            @media screen and (max-width:1200px){
                grid-column: 1 / span 2;
            }

            @media screen and (max-width:800px){
                 grid-column: 1 / span 1;
            }

            p{
                font-size:0.8em;
            }
        }


        &.plan_item_white{

            border:20px solid transparent;
            border-image:url('../img/border.png') 20 round;
            background: white !important;


            .plan_item_contenedor{

                & > h4,& > p{
                    color:var(--color-contactos);
                }

                & > .plan_info_precio{
                    color:var(--color-principal);
                }

                .plan_info_precio_regular{
                    color:var(--color-contactos);
                }

                .plan_info_mostrar_mas{
                    color:var(--color-contactos);
                }

                h4{
                    span{
                        color:White;

                    }
                }
            }
        }



        .plan_item_contenedor{



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


            h4{

                font-weight: bold;
                font-size: 2.6em;
                letter-spacing: 2px;
                margin-top: 20px;
                display:flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                gap:8px;



                div{
                    background-color: var(--color-principal);
                    padding:10px;
                    border-radius:11px;
                    transform:skewX(-20deg);

                    span{
                        display:inline-block;
                        transform:skew(20deg);
                    }
                }

            }

            p{
                font-weight: 400;
                font-size: 1em;
            }


            .plan_info_nuevo{


                position:relative;
                background: #FFE9DF;
                color:black !important;
                border-radius: 15px;
                z-index:1;
                width:90%;
                height:50px;

                .bono{
                    position: absolute;
                    top:-18px;
                    left:12px;
                    background-color: var(--color-contactos);
                    color:white;
                    display: block;
                    padding:1px 15px 1px 15px;
                    border-radius: 10px;
                    font-size: .8em;

                }

                .container_plan_info_nuevo{
                    display:flex;
                    flex-direction: row;
                    width:100%;
                    height: 100%;




                    &.container_plan_info_nuevo_reverse{
                         flex-direction: row-reverse;
                    }

                    &.container_plan_info_full_background{
                        .col_info:first-child{
                           background-color: var(--color-principal);
                           border-radius: 15px;
                        }
                    }



                    .col_info{


                        flex-grow: 1;
                        flex-shrink: 1;
                        display:flex;
                        justify-content: center;
                        align-items: center;
                        flex-direction: column;
                        padding:15px;




                        img{


                            width:85%;


                            &.imagen_efecto{

                                transition: all 200ms;
                                filter:brightness(1);
                                animation-name: brillo;
                                animation-duration: 3s;
                                animation-timing-function: linear;
                                animation-iteration-count: infinite;

                            }
                        }

                        p{


                            white-space: nowrap;
                            margin:0;
                            font-weight: 500;
                            font-size:.9em;

                        }

                    }
                }

            }

















            .plan_info{

                background: #FFE9DF;
                color:var(--color-contactos);
                display:flex;
                width:90%;
                height: 60px;
                border-radius: 15px;
                position: relative;



                .bono{
                    position: absolute;
                    top:-11px;
                    left:13px;
                    background-color: var(--color-contactos);
                    color:white;
                    display: block;
                    padding:1px 15px 1px 15px;
                    border-radius: 10px;
                    font-size: .9em;
                }


                .plan_info_content_first{


                    img{

                        transition: all 200ms;
                        width:45% !important;
                        filter:brightness(1);
                        animation-name: brillo;
                        animation-duration: 3s;
                        animation-timing-function: linear;
                        animation-iteration-count: infinite;

                    }



                }


                &.plan_info_doble{

                    border-radius: 20px !important;

                    .plan_info_content{
                        width: 100%;
                        overflow: hidden;

                        &:first-child{
                            display:flex;
                            flex-direction: column;
                            align-items: center;
                            justify-content: center;
                            gap:0px !important;
                            white-space: nowrap;

                        }

                        &:last-child{
                            background-color: var(--color-principal);
                            background-image: url('../img/gpon_orange.png');
                            background-position: center center;
                            background-size: 95% auto;
                            background-repeat: no-repeat;
                            border-radius:25px;

                            img{
                              display: none;
                            }
                        }

                    }

                }

                .plan_info_content{
                    display:flex;
                    justify-content: center;
                    align-items: center;
                    gap:10px;
                    width:100%;

                    padding:15px;

                    img{
                        width:30%;
                    }

                    strong{
                        font-weight: 500;

                    }
                }
            }


            .plan_info_imagen{


                img{
                    margin:0 auto;
                    width:65%;
                    display: block;
                }
            }


            .plan_info_precio{

                display:flex;
                flex-direction: row;
                justify-content: center;
                align-items: center;
                gap:10px;


                strong{

                    font-weight: bold;
                    font-size:2.8em;
                }

                span{
                    font-weight: 100;
                    font-size: 1.2em;
                    font-weight: bold;
                }

            }


            .plan_info_contratar_plan{
                background-color: var(--color-contactos);
                width:90%;
                font-size: 1.8em;
                padding:7px;
                border-radius: 20px;
                cursor: pointer;
            }

            .plan_info_mostrar_mas{
                margin:20px 0 20px 0;
                cursor: pointer;
            }

        }





    }

}



.seccion_beneficios{
    margin: 0px;

    background: linear-gradient(
        var(--color-secundario)
    );



    .seccion_beneficios-title{
        color:white;
    }
}


.section_metodo_de_pago{
    background: linear-gradient(
        var(--color-secundario),
        var(--color-secundario)
    ) !important;
}


/*
background: linear-gradient(
        var(--color-secundario),
        var(--color-principal)

    );
*/


.beneficios_container{
    width:100%;

    background: linear-gradient(
        var(--color-secundario),
        var(--color-secundario)

    );

    .swiper-container{
        overflow: hidden;

        .swiper-wrapper{

            .swiper-slide{
                img{
                    width:100%;
                }
            }
        }
    }

}

.metodos_de_pago{

    background: linear-gradient(
        var(--color-secundario),
        var(--color-principal)
    ) !important;


    a{

        display: flex;
        justify-content: center;
        align-items: center;
        padding:10px 10px 70px 10px;

        img{

            width:51%;

            @media screen and (max-width:1000px){
                max-width:70%;
                min-width: 80%;
            }
        }
    }
}


#TerminosyCondiciones{
    width:70%;
    margin:30px auto;

    ol{


        display:flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap:10px;
        list-style: none;


        li{


            width:100%;

            input[type=radio]{
                display:none;

                &:checked ~ .container_title + .container_text{
                   height: auto;
                   padding:12px;
                }



            }

            .container_title{


                border-radius: 15px;
                background-color: var(--color-contactos);
                color:white;
                display:flex;
                justify-content: flex-start;
                align-items: center;
                gap:15px;
                padding:8px;
                position: relative;
                margin:0;
                cursor: pointer;





                .circle_title{
                    width:31px;
                    height: 31px;
                    border-radius: 50%;
                    background-color: var(--color-principal);
                    flex-shrink: 1;
                    font-size: .8em;
                    display:flex;
                    justify-content: center;
                    align-items: center;
                    font-weight: bold;
                }

                span{
                    font-size: .9em;
                }

                i{
                    position: absolute;
                    right:20px;
                    font-size: 1.2em;
                    cursor: pointer;
                }

            }

            .container_text{

                font-size: .8em;
                padding:0px;
                border-radius: 0  0 15px 15px;
                overflow: hidden;
                height: 0px;
                transition: all 200ms;
                interpolate-size:allow-keywords;

            }
        }
    }
}



.tyc-title__container{
    background-color: var(--color-contactos) !important;


    i{
        color:white;
    }

    .tyc-title{
        color:white !important;
    }
}

.seccion_planes{
    .container{


    }
}



#form_footer{


    position:fixed;
    left:0;
    bottom:0;
    z-index:900;
    width:100%;
    display:none;
    transform:translateY(78%);
    transition: all 200ms;


    &.active_form_footer{
        transform:translateY(0%);
    }


    @media screen and (max-width:750px){
        display:block;
    }


    form{



        margin:0 auto;
        width:max-content;
        background-color: var(--color-principal);
        display:grid;
        grid-template-columns: repeat(2,min-content);
        border-radius:20px 20px 0 0;
        border-width: 2px, 2px, 0px, 2px;
        border-style: solid;
        border-color: #FF4403;
        overflow: hidden;
        border-bottom: 1px solid transparent !important;


        @media screen and (max-width:900px){
            display:grid;
            grid-template-columns: repeat(1,1fr);
            place-items: center;
        }


        .col_1{


            &:first-child{

                width:400px;
                display:flex;
                justify-content: center;
                align-items: center;
                flex-direction: column;
                cursor: pointer;


                @media screen and (max-width:1200px){
                    width:300px !important;
                }

                @media screen and (max-width:900px){
                    width:100% !important ;
                }


                p{
                    font-size: 1.9em;
                    display:flex;
                    flex-direction: column;
                    align-items: center;
                    justify-content: center;
                    color:White;
                    font-weight: 500;

                    @media screen and (max-width:1200px){
                         font-size: 1.5em;
                    }

                    @media screen and (max-width:900px){
                        font-size: 1.2em;
                        margin:0px;
                        padding:10px;
                    }
                }
            }

            &:last-child{

                display:flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                background-color:white;
                gap:10px;
                padding:25px;

                @media screen and (max-width:900px){
                    gap:20px;
                }

                .form_input{

                    display:grid;
                    grid-template-columns: repeat(3,200px);
                    gap:10px;



                    @media screen and (max-width:1100px){
                        grid-template-columns: repeat(3,1fr);
                    }

                    @media screen and (max-width:900px){
                       grid-template-columns: repeat(1,1fr);
                       width:100%;
                    }

                    .select_llamanos,input,button{
                        padding:8px;
                        background-color: white;
                        border-radius: 15px;
                        font-size: .9em;
                    }




                    .select_llamanos{

                        display: flex;
                        justify-content: center;
                        align-items: center;
                        gap:10px;
                        border:1px solid var(--color-contactos);
                        font-weight: bold;



                        @media screen and (max-width:900px){
                            width:100%;
                        }



                        select{
                            width:65%;
                            text-align: center;
                            appearance: none;
                            font-size:.9em;
                            border:none;
                            outline:none;
                            font-weight:bold;
                        }

                    }


                    input{

                        border:none;
                        border: 1px solid #C1C1C1

                    }

                    input::placeholder{
                        font-size: .9em;
                        text-align: center;
                    }

                    button{
                        background-color: var(--color-principal);
                        color:white;

                        @media screen and (max-width:1000px){
                            font-size: 0.8em;
                        }
                    }

                }

                .form_checkbox{

                    display:flex;
                    flex-direction: row;
                    justify-content: flex-start;
                    width:100%;
                    gap:20px;


                    @media screen and (max-width:900px){
                        flex-direction: column;
                        gap:1px;
                    }


                    label{

                        font-size: .7em;
                        display:flex;
                        flex-direction: row;
                        align-items: center;
                        justify-content: center;
                        gap:5px;

                        a{
                            color:black;
                            text-decoration: none;
                        }
                    }


                }


            }

        }

    }
}

footer{


    background-color: var(--color-principal);

    .footer__derechos{
       background-color: var(--color-contactos);
    }

    #whatsap_float{
        position: fixed;
        right:30px;
        bottom:30px;
        z-index: 900;
        width:70px;
        height: 70px;
        border-radius: 50%;
        background-color: var(--color-principal);
        cursor: pointer;
        display:none;
        justify-content: center;
        align-items: center;




        a{

            width:100%;
            height: 100%;
            display: block;
            display:flex;
            justify-content: center;
            align-items: center;
            text-decoration: none;
            background-color: var(--color-principal);
            border-radius: 50%;


            i{
                color:white;
                font-size:30px;
            }
        }
    }

}





@media screen and (min-width: 1500px) {
    .container {
        max-width: 1500px !important;
    }
}