@import url("../theme/theme.css");
@import url("../componentes/navbar.css");
@import url("../componentes/footer.css");
@import url("../componentes/modal_prelanding.css");

body{
    background-position: left;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url("../../img/componentes/typ-fondo.png");
}

.prelanding_container{
    width: 100%;
    padding-top: 50px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.prelanding_container .prelanding_title{
    text-align: center;
    font: normal normal bold 20px/25px "Telefonica-Bold";
    letter-spacing: 0px;
    color: var(--blanco);
    opacity: 1;
    background: var(--azul-oscuro) 0% 0% no-repeat padding-box;
    border-radius: 10px;
    padding: 0.6% 2%;
    margin-bottom: 3%;
}
.prelanding_container .prelanding_text{
    text-align: center;
    font: normal normal bold 36px/38px "Telefonica-Bold";
    letter-spacing: 0px;
    color: var(--celeste);
    opacity: 1;
    letter-spacing: 0px;
    width: 55%;
    margin: auto;
}

.prelanding__iconos{
    width: 100%;
    margin-top: 5%;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 8%;
}
.prelanding__iconos .prelanding__iconos-title{
    text-align: center;
    font: normal normal bold 24px/30px "Telefonica-Bold";
    letter-spacing: 0px;
    color: var(--azul-oscuro);
    text-transform: uppercase;
    opacity: 1;
    margin-bottom: 3%;
}
.prelanding__iconos .prelanding__iconos-container{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 55%;
}
.prelanding__iconos .prelanding__iconos-container .prelanding__iconos-group{
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    width: 30%;
    height: 150px; 
    background: var(--gris_bg) 0% 0% no-repeat padding-box;
    box-shadow: 3px 3px 6px #00000029;
    border-radius: 20px;
    opacity: 1;
    margin-left: 1.5%;
    margin-right: 1.5%;
    padding: 1%;
    border: none;
}
.prelanding__iconos .prelanding__iconos-container button, .prelanding__iconos .prelanding__iconos-container button:hover{
    border: none;
}
.prelanding__iconos .prelanding__iconos-container .prelanding__iconos-group:hover{
    border: 4px solid var(--celeste);
}
.prelanding__iconos .prelanding__iconos-container .prelanding__iconos-group .prelanding__iconos-group_text{
    text-align: center;
    font: normal normal bold 20px/22px "Telefonica-Bold";
    letter-spacing: 0px;
    color: var(--azul-oscuro);
    opacity: 1;
}
@media (min-width:1550px){
    .prelanding__iconos .prelanding__iconos-container{
        width: 50%;
    }
    .prelanding__iconos .prelanding__iconos-container .prelanding__iconos-group{
        width: 28%;
        margin-left: 1.5%;
        margin-right: 1.5%;
    }
}
@media (max-width:990px){
    body{
        background-position: bottom;
    }
    .prelanding_container .prelanding_title{
        margin-bottom: 6%;
    }
    .prelanding_container .prelanding_text{
        width: 70%;
    }
    .prelanding__iconos {
        margin-top: 8%;
        margin-bottom: 12%;
        height: 55vh;
    }
    .prelanding__iconos .prelanding__iconos-title {
        margin-bottom: 4%;
    }
    .prelanding__iconos .prelanding__iconos-container {
        width: 85%;
        flex-wrap: wrap;
        justify-content: space-around;
    }
    .prelanding__iconos .prelanding__iconos-container .prelanding__iconos-group {
        width: 45%;
        height: 155px;
        margin-left: 0%;
        margin-right: 0%;
        padding: 2%;
        margin-bottom: 2%;
        margin-top: 2%;
    }
}
@media (max-width:767px){
    .prelanding_container{
        padding-top: 30px;
    }
    .prelanding_container .prelanding_title{
        padding: 2.5% 4%;
        font: normal normal bold 16px / 20px "Telefonica-Bold";
    }
    .prelanding_container .prelanding_text{
        width: 95%;
        font: normal normal bold 24px / 30px "Telefonica-Bold";
    }
    .prelanding__iconos{
        width: 100%;
        margin-top: 10%;
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-bottom: 15%;
    }
    .prelanding__iconos .prelanding__iconos-title{
        text-align: center;
        font: normal normal bold 1.15rem/1.5rem "Telefonica-Bold";
        letter-spacing: 0px;
        text-transform: uppercase;
        opacity: 1;
        margin-bottom: 3%;
        padding: 0 2%;
    }
    .prelanding__iconos .prelanding__iconos-container {
        width: 85%;
        flex-wrap: wrap;
        justify-content: space-around;
    }
    .prelanding__iconos .prelanding__iconos-container .prelanding__iconos-group {
        width: 45%;
        height: 100px;
        margin-left: 0%;
        margin-right: 0%;
        padding: 2%;
        margin-bottom: 3%;
        margin-top: 3%;
    }
    .prelanding__iconos .prelanding__iconos-container .prelanding__iconos-group .prelanding__iconos-group_text{
        text-align: center;
        font: normal normal bold 1rem/1.125rem "Telefonica-Bold";
        letter-spacing: 0px;
        color: var(--azul-oscuro);
        opacity: 1;
    }
    .prelanding__iconos .prelanding__iconos-container .prelanding__iconos-group .prelanding__iconos-group_img{
        height: 30%;
        width: auto;
    }
}