body{
    background-image: url(../../images/bella/fondo_bella_blue.jpeg);
    background-color: #000000;
    background-attachment: fixed;
    background-size: cover;
    color: #57638a;
    font-family: "Andada Pro", serif;
}

.contenedor-central{
    max-width: 750px;
    margin: 0 auto;
    position: relative;
    border: solid 5px #ffffff;
    /* height: 200vh; */
    border-radius: 30px;
    padding-top: 100px;
    padding-bottom: 100px;
    background-color: rgba(221, 229, 250, .8) !important;
}

.subtitulo{
    font-family: 'Meddon';
}
.titulo{
    font-family: 'Mea Culpa';
    color: #57638a;
}




.liga{
    font-size: 1.3em;
    color: #57638a;
}

a.btn-confirm {
    display: block;
    border: solid 1px #57638a;
    width: 40%;
    float: left;
    padding: 20% 5%;
    max-height: 360px;
    border-radius: 3%;
    margin: 5%;
    text-decoration: none;
    color: white;
}
a.btn-confirm{
    background-color: rgba(0,0,0,.5);
}

a.btn-confirm:hover{
    border-color: white;
    background-color: rgba(0,0,0,.8);
}


.link-rec {
    text-decoration: none;
    color: white;
}

.link-rec:hover{
    color: #57638a;
}


@media (min-width:320px)  { 
    
    .contenedor-central{
        max-width: 90%;
    }
    h2.subtitulo {
        font-size: 1.8em;
    }
    .titulo{
        font-size: 2.8em;
    }
    .text-base {
        font-size: 1em;
    }

    .cont-fecha {
        width: 90%;
    }
    span.numero-tiempo {
        font-size: 2.5em;
    }
    .titulo-tiempo{
        font-size: 1em;
    }
    .btns-confirm {
        max-width: 90%;
        margin: 0 auto;
    }
    a.btn-confirm {
        display: block;
        border: solid 1px #57638a;
        width: 46%;
        float: left;
        padding: 11% 2%;
        max-height: 360px;
        border-radius: 3%;
        margin: 2%;
        text-decoration: none;
        color: white;
        min-height: 27vh;
    }
    .caja-recomendaciones {
        background-image: url(../../images/bella/fondorecomendaciones-blue.png);
        height: 302px;
        width: 90%;
        background-repeat: no-repeat;
        margin: 0 auto;
        background-size: contain;
        padding: 50px 30px
    }
    .menu-rec  li {
        margin-top: 1vh;
    }
    a.link-rec {
        font-size:.9em;
    }
    p.frase {
        font-size: 1.5rem;
    }
}
@media (min-width:481px)  { 
 
    .contenedor-central{
        max-width: 90%;
    }
    h2.subtitulo {
        font-size: 1.8em;
    }
    .titulo{
        font-size: 2.8em;
    }
    .cont-fecha {
        width: 90%;
    }

    span.numero-tiempo {
        font-size: 2.5em;
    }
    .titulo-tiempo{
        font-size: 1em;
    }
    
    .text-base {
        font-size: 1em;
    }
    .btns-confirm {
        max-width: 90%;
        margin: 0 auto;
    }
    a.btn-confirm {
        display: block;
        border: solid 1px #57638a;
        width: 46%;
        float: left;
        padding: 11% 2%;
        max-height: 360px;
        border-radius: 3%;
        margin: 2%;
        text-decoration: none;
        color: white;
        min-height: 27vh;
    }
    .caja-recomendaciones {
        background-image: url(../../images/bella/fondorecomendaciones-blue.png);
        height: 302px;
        width: 90%;
        background-repeat: no-repeat;
        margin: 0 auto;
        background-size: contain;
        padding: 50px 30px
    }
    .menu-rec  li {
        margin-top: 1vh;
    }
    a.link-rec {
        font-size:.9em;
    }
    p.frase {
        font-size: 1.5rem;
    }

 }
@media (min-width:641px)  { 
    .contenedor-central{
        max-width: 750px;
    }

    .subtitulo{
        font-size: 2.7em;
    }
    .titulo{
        font-size: 4.3em;
    }
    .cont-fecha {
        width: 80%;
    }

    span.numero-tiempo {
        font-size: 3.5em;
    }
    .titulo-tiempo{
        font-size: 2em;
    }
    
    .btns-confirm {
        max-width: 90%;
        margin: 0 auto;
    }
    a.btn-confirm {
        display: block;
        border: solid 1px #57638a;
        width: 46%;
        float: left;
        padding: 11% 2%;
        max-height: 360px;
        border-radius: 3%;
        margin: 2%;
        text-decoration: none;
        color: white;
        height: 39vh;
    }

    .caja-recomendaciones{
        background-image: url('../../images/bella/fondorecomendaciones-blue.png');
        height: 492px;
        width: 570px;
        background-repeat: no-repeat;
        margin: 0 auto;
        padding: 100px;
    }
    .menu-rec  li {
        margin-top: 3vh;
    }
    a.link-rec {
        font-size:1.3em;
    }
    p.frase {
        font-size: 2.5rem;
    }
    .text-base {
        font-size: 1em;
    }
}
@media (min-width:1024px) {
    
    .contenedor-central{
        max-width: 750px;
        margin: 0 auto;
        position: relative;
    }
    .subtitulo{
        font-size: 2.7em !important;
    }
    .titulo{
        font-size: 4.3em;
    }

    .cont-fecha {
        width: 60%;
    }
    
    span.numero-tiempo {
        font-size: 3.5em;
    }
    .titulo-tiempo{
        font-size: 2em;
    }
    .btns-confirm {
        max-width: 90%;
        margin: 0 auto;
    }
    a.btn-confirm {
        display: block;
        border: solid 1px #57638a;
        width: 46%;
        float: left;
        padding: 11% 2%;
        max-height: 360px;
        border-radius: 3%;
        margin: 2%;
        text-decoration: none;
        color: white;
        height: 39vh;
    }
    .caja-recomendaciones{
        background-image: url('../../images/bella/fondorecomendaciones-blue.png');
        height: 492px;
        width: 570px;
        background-repeat: no-repeat;
        margin: 0 auto;
        padding: 100px;
    }
    .menu-rec  li {
        margin-top: 3vh;
    }
    a.link-rec {
        font-size:1.3em;
    }
    p.frase {
        font-size: 2.5rem;
    }
    .text-base {
        font-size: 1em;
    }
}