/* ==========================================================================
   Author's custom styles
   ========================================================================== */

.brochure-flex {
    color: #254558;
}

.site-color {
    background-color: #F2F2F4;
    color: #254558;
}

.page-header {
    background-color: #254558;
    opacity: 1;
    padding: 0px;
}

.footer-space {
    background-color: #254558;
    opacity: 1;
    padding: 0px;
    color: #F2F2F4;
}

.nav-link-color {
    color: #F2F2F4 !important;
}

.card {
    background-color: #254558;
    color: #F2F2F4;
}

.btn-primary {
    background-color: #285693;
    border-color: #285693;
}

.captionText {
    text-shadow: 2px 2px 2px red;
}

.to-top {
    border-radius: 50%;
}

.whataspp-mobile {
    border-radius: 50%;
}

@media only screen and (min-width: 240px) {
    #brochure {
        display: none;
    }
    .mapouter {
        display: none;
    }
    .logo-width {
        width: 300%;
    }
    .landing-image {
        background-image: url("../img/image3.png");
        width: 100%;
        height: auto;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .landing-logo {
        width: 90%
    }
    .nav-link-color {
        font-size: 0.3em;
    }
    .navbar-toggler {
        font-size: 1em;
    }
    .card-title {
        font-size: 10px;
    }
    .product-list {
        font-size: 10px;
    }
    .contact-whatsapp {
        display: none;
    }
    .scroll-to-top {
        position: fixed;
        top: 80%;
        right: 2%;
    }
    .contact-whatsapp-mobile {
        display: inline;
        position: fixed;
        top: 65%;
        right: 2%;
    }
}

@media screen and (min-width: 576px) {
    #brochure {
        display: none;
    }
    .logo-width {
        width: 400%;
    }
    .contact-whatsapp {
        display: none;
    }
    .scroll-to-top {
        position: fixed;
        top: 80%;
        right: 2%;
    }
    .contact-whatsapp-mobile {
        display: inline;
        position: fixed;
        top: 65%;
        right: 2%;
    }
}

@media screen and (min-width: 768px) {
    #brochure {
        display: block;
    }
    #brochure-mobile {
        display: none;
    }
    .maproute-mobile {
        display: none;
    }
    .card-title {
        font-size: 16px;
    }
    .nav-link-color {
        font-size: 0.4em;
    }
    .logo-width {
        width: 200%;
    }
    .contact-whatsapp {
        display: block;
        position: fixed;
        bottom: 0;
        right: 0;
        background-color: #254558;
        padding: 5px;
        font-size: larger;
        border-top-left-radius: 15px;
        border-bottom-left-radius: 15px;
    }
    .contact-whatsapp a {
        color: #F2F2F4;
    }
    .contact-whatsapp a::visited {
        color: #F2F2F4;
    }
    .contact-whatsapp a::hover {
        color: #F2F2F4;
    }
    .scroll-to-top {
        display: none;
    }
    .contact-whatsapp-mobile {
        display: none;
    }
}

@media screen and (min-width:992px) {
    .mapouter {
        display: block;
    }
    #brochure {
        display: block;
    }
    #brochure-mobile {
        display: none;
    }
    .maproute-mobile {
        display: none;
    }
    .landing-image {
        background-image: url("../img/image3.png");
        width: 100%;
        height: auto;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .navbar-brand {
        /* background-color: #F2F2F4; */
        padding: 10px;
        padding-right: 15px;
    }
    .contact-form {
        padding: 2em;
        margin: 2em;
        /*border: 1px solid red;*/
        /* background-color: #ccc; */
    }
    .promo-text {
        padding: 4em;
    }
    .promo-text li {
        margin-left: 6em;
    }
    .other-text {
        height: 500px;
    }
    .mapouter {
        position: relative;
        text-align: right;
        height: 300px;
        width: 600px;
    }
    .gmap_canvas {
        overflow: hidden;
        background: none!important;
        height: 300px;
        width: 600px;
    }
    .logo-width {
        width: 80%;
    }
    .header-links {
        padding-top: 1em
    }
    .landing-logo {
        width: 40%
    }
    .google-map-dimensions {
        width: 600px;
        height: 300px;
    }
    #brochure {
        display: block;
    }
    .nav-link-color {
        font-size: 0.4em;
    }
    .contact-whatsapp {
        display: block;
        position: fixed;
        top: 90%;
        left: 80%;
    }
    .scroll-to-top {
        display: none;
    }
    .contact-whatsapp-mobile {
        display: none;
    }
}

@media screen and (min-width: 1200px) {
    .mapouter {
        display: block;
    }
    #brochure {
        display: block;
    }
    #brochure-mobile {
        display: none;
    }
    .maproute-mobile {
        display: none;
    }
    .landing-image {
        background-image: url("../img/image3.png");
        width: 100%;
        height: auto;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .navbar-brand {
        /* background-color: #F2F2F4; */
        padding: 10px;
        padding-right: 15px;
    }
    .contact-form {
        padding: 2em;
        margin: 2em;
        /*border: 1px solid red;*/
        /* background-color: #ccc; */
    }
    .promo-text {
        padding: 4em;
    }
    .promo-text li {
        margin-left: 6em;
    }
    .other-text {
        height: 500px;
    }
    .mapouter {
        position: relative;
        text-align: right;
        height: 300px;
        width: 600px;
    }
    .gmap_canvas {
        overflow: hidden;
        background: none!important;
        height: 300px;
        width: 600px;
    }
    .logo-width {
        width: 80%;
    }
    .header-links {
        padding-top: 1em
    }
    .google-map-dimensions {
        width: 600px;
        height: 300px;
    }
    .nav-link-color {
        font-size: 1.2em;
    }
    .contact-whatsapp {
        display: block;
        position: fixed;
        top: 90%;
        left: 80%;
    }
    .scroll-to-top {
        display: none;
    }
    .contact-whatsapp-mobile {
        display: none;
    }
}

@media screen and (min-width: 2560px) {
    .mapouter {
        display: block;
    }
    #brochure {
        display: block;
    }
    #brochure-mobile {
        display: none;
    }
    .maproute-mobile {
        display: none;
    }
    .landing-logo {
        width: 30%
    }
    .nav-link-color {
        font-size: 2.2em;
    }
    .contact-whatsapp {
        display: block;
        position: fixed;
        top: 90%;
        left: 80%;
    }
    .scroll-to-top {
        display: none;
    }
    .contact-whatsapp-mobile {
        display: none;
    }
}


/****************************************************************************************/