*{
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
}
.container{
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: repeat(2,1fr);
    padding: 10px;
    gap: 20px;
    .container--img{
        height: 100vh;
        overflow-x: hidden;
        .img{
            background-image: url('../imgs/ej4/Image1.png');
            height: 100%;
            background-size: cover;
            background-position: center;
        }
    }
}
.container-content{
    height: 100vh;
    padding: 2%;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.container-content-title{
    font-family: "Poppins", sans-serif;
    font-size: 1.5em;
    font-weight: 600;
    text-align: center;
    font-style: normal;
}
.container-content-stylesub{
    font-family: "Poppins", sans-serif;
    text-align: start;
    font-size: 1.2rem;
    font-weight: 100;
    font-style: normal;

}
.container-content-subtitlebotom{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;

}

#boton{
    width: max-content;
    padding: 5px;
    text-align:center;
    text-decoration: none;
    background-color: black;
    border-radius: 10px;
    color: white;
    font-family: "Poppins", sans-serif;
    font-size: 15px;
    font-weight: 300;
    font-style: normal;
}

.container-content-text-numbers{
    font-family: "Poppins", sans-serif;
    font-size: 20px;
    font-weight: 300;
    font-style: normal;
}
.container-content-text{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
}

@media (min-width: 630px){
    .container{
        grid-template-columns: repeat(2,1fr);
        grid-template-rows: repeat(1,0.5fr);
        .container--img{
            height: 100%;
            overflow-x: hidden;
            .img{
                display: flex;
                flex-direction: column;
                align-items: flex-end;
                background-image: url('../imgs/ej4/Image1.png');
                height: 100%;
                background-size: cover;
                background-position: center;
            }
        }
    }
    .container-content{
        padding: 2%;
        gap: 7%;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
    .container-content-title{
        font-family: "Poppins", sans-serif;
        font-size: 3em;
        font-weight: 600;
        text-align: center;
        font-style: normal;
    }
    .container-content-stylesub{
        font-family: "Poppins", sans-serif;
        text-align: start;
        font-size: 1.2rem;
        font-weight: 100;
        font-style: normal;
    
    }

    .container-content-subtitlebotom{
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
    }
    
    #boton{
        width: max-content;
        padding: 5px;
        text-align:center;
        text-decoration: none;
        background-color: black;
        border-radius: 10px;
        color: white;
        font-family: "Poppins", sans-serif;
        font-size: 20px;
        font-weight: 300;
        font-style: normal;
    }
}