*{
    margin: 0 auto;
    padding: 0;
    font-family: 'Roboto', sans-serif;
    color: #4d4d4d;
}

.textBlack{
    font-family: 'Roboto', sans-serif;
    font-weight: 900;
}

.textRegular{
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
}

.textShadow{
    text-shadow: -11px 11px 7px rgba(0, 0, 0, 0.35);
}

.textRojo{
    color: #b91912;
}

.tituloRojo{
    color: #b91912;
    text-align: left;
    font-family: 'Roboto', sans-serif;
    font-size: 3.5rem;
    font-weight: 700;
}

.row.cabecera{
    background-image: url('../images/fondoCabecera.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top center;
    height: 650px;
}

.row.cabecera .rowIzquierda{
    height: 100%;
}
.row.cabecera .rowDerecha{
    height: 100%;
    background-image: url('../images/imgBtnPrograma.svg');
    background-repeat: no-repeat;
    background-size: 70% auto;
    background-position: center 30px;
}

.col-12.h-75.pregunta{
    background-image: url('../images/incognita.svg');
    background-repeat: no-repeat;
    background-size: 70% auto;
    background-position: center 70px;
}

.textBlack.textShadow{
    font-size: 3.2rem;
    margin: 4rem 1rem 0 1rem;
}

.textRegular.textShadow{
    font-size: 3rem;
    margin: -3rem 1rem 0 1rem;
}

.textBullet{
    font-size: 2.3rem;
    line-height: 3rem;
    color: #4d4d4d;
    margin-top: 0.8rem;
}

h3.textBullet.px-4.mx-4.px-md-5.mx-md-5 ul{
    margin-top: -1rem;
}

h3.textBullet.px-4.mx-4.px-md-5.mx-md-5 ul li.text-white{
    font-size: 2rem;
    line-height: 2.5rem;
    margin-bottom: 1rem;
}

span.cursivaBold{
    font-family: 'Roboto', sans-serif;
    font-weight: 900;
    font-style: italic;
}

h1.pt-5.text-center{
    font-size: 3rem;
    margin: 1rem;
}

.row.bodyRojo{
    background-image: url('../images/fondoRojoBody.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top center;
    height: 600px;
}

.rowReferencia{
    color: #808080;
}

.row.rowReferencia div.col-12.col-md-9.p-4 h5{
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    color: #808080;
}

.row.rowReferencia div.col-12.col-md-9.p-4 ol.pl-3 li{
    font-family: 'Roboto', sans-serif;
    font-weight: 100;
}

.reservaLogo{
    background-image: url('../images/logoExeltis.svg');
    background-repeat: no-repeat;
    background-size: 80% auto;
    background-position: center;
    height: 400px;
}


/* -->  RESPONSIVE  <-- */

/* Mobile Portrait */
@media (max-width: 767px) and (min-width: 300px) {

    .row.cabecera{
        height: 780px;
    }
    
    .row.cabecera .col-12.col-md-6.textIZQ{
        height: 780px;
        max-height: 250px;
    }

    .row.cabecera .rowIzquierda{
        height: auto;
        margin-top: 8rem;
    }

    .col-12.h-75.pregunta{
        background-position: center;
    }

    .rowIzquierda{
        height: 100%;
    }
    
    .rowIzquierda .col-12.h-25{
        height: 50% !important;
    }

    .rowIzquierda div.col-12.h-75{
        height: 50 !important;

        margin-top: -8rem;
    }

    .rowIzquierda .col-12.h-25 h1{
        margin-top: 1rem;
    }

    .contentCTA{
        margin-top: -19rem;
    }

    h1.tituloRojo{
        font-size: 2.7rem;
        padding-bottom: 1rem;
    }

    .media img{
        width: 50px;
    }
    
    .media-body p.textBullet{
        font-size: 2rem;
        line-height: 2.5rem;
        margin-top: 0.5rem;
    }

    h1.pt-5.text-center{
        font-size: 2.5rem;
        padding-top: 0 !important;
    }

    .row.bodyRojo{
        height: 1000px;
    }

    .textBlack.textShadow{
        font-size: 2.5rem;
    }
    
    h3.textBullet.px-4.mx-4.px-md-5.mx-md-5{
        font-size: 1.8rem;
        line-height: 2.3rem;
    }
    
    h3.textBullet.px-4.mx-4.px-md-5.mx-md-5 ul li{
        margin-bottom: 1.5rem;
    }

    .reservaLogo {
        height: 200px;
      }

}

/* iPhone 5/SE Landscape */
@media (max-width: 568px) and (min-width: 560px) {}

/* iPhone 6/7/8 Landscape */
@media (max-width: 667px) and (min-width: 569px) {}

/* iPhone 6/7/8 Plus Landscape */
@media (max-width: 740px) and (min-width: 415px) {}


/* iPhone X/XS Landscape */
@media (max-width: 890px) and (min-width: 769px) {
}

/* iPhone X Landscape */
@media only screen and (min-width: 812px) and (orientation: landscape) {
}

@media screen and (min-width: 360px) and (orientation: portrait) {}

/* iPhone 12 Pro Max Landscape */
@media only screen and (min-width: 926px) and (orientation: landscape) {}


/* iPhone 12 Pro Max Portrait */
@media only screen and (min-width: 428px) and (orientation: portrait) {}

/* iPad portrait */
@media (min-width: 768px) and (orientation: portrait) {
    
    .col-12.h-75.pregunta{
        background-position: center 100px;
        background-size: 90% auto;
    }
    
    .row.cabecera .rowDerecha{
        background-position: center 100px;
    }
    
    .textBlack.textShadow{
        font-size: 2.5rem;
    }

    h3.textBullet.px-4.mx-4.px-md-5.mx-md-5 ul{
        margin-top: -1rem;
    }

    h3.textBullet.px-4.mx-4.px-md-5.mx-md-5 ul li{
        font-size: 1.9rem;
    }
}
    

/* iPad Landscape */
@media only screen and (min-width: 1024px) and (orientation: landscape) {
}

/* iPad Pro portrait */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {}

@media only screen and (min-device-width: 938px) and (max-device-width: 938px) and (orientation: landscape) {}

@media only screen and (min-device-width: 602px) and (max-device-width: 602px) and (orientation: portrait) {}


/* Tab's Landscape */
@media (max-width: 1366px) and (min-width: 992px) {
    
}