/* devices css */
/***************** default definitions*/
.carousel-item {
    height: 45vh;
    /*min-height: 350px;*/
    background: no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

/* force display of captions on picture slides*/
.d-md-block {
    display: block !important;
}


/* start of font-size (for large devices) */
html {
    font-size: 16px;
}

body {
    font-size: 16px;
}

/************* GENERAL EXTRA SMALL devices */
@media (max-width: 360px) {
    html {
        font-size: 10px !important;
    }

    body {
        font-size: 10px !important;
    }

    .display-3 {
        font-size: 1.8rem;
        font-weight: 300;
        line-height: 1;
    }

    .display-4 {
        font-size: 1.8rem;
        font-weight: 300;
        line-height: 1;
    }

    h1 {
        text-align: center !important;
        font-size: 16px !important;
        font-weight: 800 !important;
        line-height: 1.1 !important;
        margin-bottom: .5em !important; /* 24 / 48 */
    }

    h2 {
        text-align: center !important;
        font-size: 14px !important;
        line-height: 1.1 !important;
        margin-bottom: .25em !important; /* 24 / 48 */
    }

    .contrast_bg {
        background-color: rgba(0,0,102,.3) !important;
    }

/* csslint ignore:start */
    @media (orientation: portrait) {
        .carousel-item {
            height: 35vh !important;
        }
    }
/* csslint ignore:end */

    .navbar .collapsing, .navbar .in,
    .navbar .collapse.show {
        font-size: 12px !important;
    }
}

/*************  GENERAL SMALL devices */
@media (min-device-width: 360px) and (max-width: 767px) {
    html {
        font-size: 12px;
    }

    body {
        font-size: 10px;
    }

    .display-3 {
        font-size: 1.8rem;
        font-weight: 300;
        line-height: 1;
    }

    .display-4 {
        font-size: 1.8rem;
        font-weight: 300;
        line-height: 1;
    }

    h1 {
        text-align: center !important;
        font-size: 16px !important;
        font-weight: 800 !important;
        line-height: 1.1 !important;
        margin-bottom: .5em !important; /* 24 / 48 */
    }

    h2 {
        text-align: center !important;
        font-size: 14px !important;
        line-height: 1.1 !important;
        margin-bottom: .25em !important; /* 24 / 48 */
    }

    .contrast_bg {
        background-color: rgba(0,0,102,.3) !important;
    }


    @media (orientation: portrait) {
        .carousel-item {
            height: 35vh !important;
        }
    }
}

/*************  GENERAL LARGE devices */
@media(min-width: 768px) {

    @media (orientation: portrait) {
        .carousel-item {
            height: 35vh !important;
        }
    }
}
/*************  DEVICE SPECIFIC  */
/* ----------- iPhone 6, 6S, 7 and 8 ----------- */
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) {
    html {
        font-size: 12px !important;
    }

    body {
        font-size: 10px !important;
    }

    .display-3 {
        font-size: 1.8rem;
        font-weight: 300;
        line-height: 1;
    }

    .display-4 {
        font-size: 1.8rem;
        font-weight: 300;
        line-height: 1;
    }

    .contrast_bg {
        background-color: rgba(0,0,102,.3) !important;
    }

    .carousel-item {
        height: 35vh !important;
    }

    h1 {
        text-align: center !important;
        font-size: 18px !important;
        font-weight: 800 !important;
        line-height: 1.1 !important;
        margin-bottom: .5em !important; /* 24 / 48 */
    }

    h2 {
        text-align: center !important;
        font-size: 16px !important;
        line-height: 1.1 !important;
        margin-bottom: .25em !important; /* 24 / 48 */
    }
}

/* ----------- iPhone 6+, 7+ and 8+ ----------- */

/* Portrait and Landscape */
@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (-webkit-min-device-pixel-ratio: 3) {
}


/* ----------- iPhone X ----------- */

/* Portrait and Landscape */
@media only screen and (min-device-width: 375px) and (max-device-width: 812px) and (-webkit-min-device-pixel-ratio: 3) {
}

/* ipad Portrait and Landscape */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 2) {
    html {
        font-size: 12px !important;
    }

    body {
        font-size: 10px !important;
    }

    .display-3 {
        font-size: 1.8rem;
        font-weight: 300;
        line-height: 1;
    }

    .display-4 {
        font-size: 1.8rem;
        font-weight: 300;
        line-height: 1;
    }

    .contrast_bg {
        background-color: rgba(0,0,102,.3) !important;
    }

    .carousel-item {
        height: 35vh !important;
    }

    h1 {
        text-align: center !important;
        font-size: 18px !important;
        font-weight: 800 !important;
        line-height: 1.1 !important;
        margin-bottom: .5em !important; /* 24 / 48 */
    }

    h2 {
        text-align: center !important;
        font-size: 16px !important;
        line-height: 1.1 !important;
        margin-bottom: .25em !important; /* 24 / 48 */
    }

}
/* end of font size*/