/*!
 * Copyright (C) 2021 Mobana Software IP, LLC - All Rights Reserved.
 *
 * We will take legal action against those who copy our HTML content, CSS style sheets
 * and JavaScript code.
 *
 */

/* Home Page responsive  */

/* Hamburg button */
.navbar-toggler { background-color: #F99121 }

/** Media Queries **/

/* Landscape phone and down */
@media only screen and (max-width : 480px) {
    /* header */
    .login-btn { width: 25% !important;}

    /* Carousel image */
    #carousel-item__1 {
        background-image: linear-gradient(to right, rgba(30, 28, 29, 0.8), rgba(51, 42, 45, 0.8)), url('../img/slider1_480.jpg') !important;
    }

    #carousel-item__2 {
        background-image: linear-gradient(to right, rgba(30, 28, 29, 0.8), rgba(51, 42, 45, 0.8)), url('../img/slider2_480.jpg') !important;
    }

    #carousel-item__3 {
        background-image: linear-gradient(to right, rgba(30, 28, 29, 0.8), rgba(51, 42, 45, 0.8)), url('../img/slider3_480.jpg') !important;
    }

    #carousel-item__4 {
        background-image: linear-gradient(to right, rgba(30, 28, 29, 0.8), rgba(51, 42, 45, 0.8)), url('../img/slider4_480.jpg') !important;
    }

    #carousel-item__5 {
        background-image: linear-gradient(to right, rgba(30, 28, 29, 0.8), rgba(51, 42, 45, 0.8)), url('../img/slider5_480.jpg') !important;
    }

    /* Carousel heading */
    .carousel-caption h2 { font-size: 2em !important;}
    .carousel-caption p { font-size: 1.2em !important;}

    /* Services feature */
    .services-features { padding: 20px; }

    /* Explore seaction */
    .explore-section {
        height: 100%;
        clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    }

    .explore-section--heading {
        font-size: 1.2em;
        margin-bottom: 10px;
    }

    /* Help section */
    .help-section { padding: 20px 0; }

    .help-box { margin-top: 40px; }

    /* Our customer section */
    .customers-section {
        background-image: linear-gradient(to right, rgba(132, 91, 49, 0.8), rgba(132, 91, 49, 0.5)), url('../img/ourCustomers_480.jpg') !important;
    }

    .customers-section {
        padding: 50px 0 }
    .ourCustomers--heading {
        padding: 20px 20px 0 20px;
        font-size: 1.8em;
        text-align: center; }
    .ourCustomers--subheading {
        padding: 0 20px;
        font-size: 1.6em;
        text-align: center }
}

@media only screen and (max-width : 767px) {
    /* navbar */
    .navbar-nav :last-child { margin-left: 0 !important; }
    .login-btn { width: 18% }

    /* Carousel image */
    #carousel-item__1 {
        background-image: linear-gradient(to right, rgba(30, 28, 29, 0.8), rgba(51, 42, 45, 0.8)), url('../img/slider1_767.jpg');
    }

    #carousel-item__2 {
        background-image: linear-gradient(to right, rgba(30, 28, 29, 0.8), rgba(51, 42, 45, 0.8)), url('../img/slider2_767.jpg');
    }

    #carousel-item__3 {
        background-image: linear-gradient(to right, rgba(30, 28, 29, 0.8), rgba(51, 42, 45, 0.8)), url('../img/slider3_767.jpg');
    }

    #carousel-item__4 {
        background-image: linear-gradient(to right, rgba(30, 28, 29, 0.8), rgba(51, 42, 45, 0.8)), url('../img/slider4_767.jpg');
    }

    #carousel-item__5 {
        background-image: linear-gradient(to right, rgba(30, 28, 29, 0.8), rgba(51, 42, 45, 0.8)), url('../img/slider5_767.jpg');
    }

    /* Carousel heading */
    .carousel-caption h2 { font-size: 2.6em }
    .carousel-caption p { font-size: 1.4em }

    /* Explore section */
    .explore-section {
        height: 100%;
        clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    }

    .explore-section--heading {
        font-size: 1.4em;
        margin-bottom: 10px;
    }

    /* Help section */
    .help-section { padding: 30px 0; }

    .help-box { margin-top: 40px; }

    /* Our customer section */
    .customers-section {
        background-image: linear-gradient(to right, rgba(132, 91, 49, 0.8), rgba(132, 91, 49, 0.5)), url('../img/ourCustomers_767.jpg');
    }

    .customers-section {
        padding: 50px 0 }
    .ourCustomers--heading {
        padding: 20px 20px 0 20px;
        font-size: 2em;
        text-align: center; }
    .ourCustomers--subheading {
        padding: 0 20px;
        font-size: 1.8em;
        text-align: center }

    /* Footer style */
    .footer h6 { font-size: 1.4em }
    .footer a { font-size: 1.2em }
    .footer-menu {
        padding: 10px 40px }
    .footer-menu :nth-child(2),
    .footer-menu :nth-child(3),
    .footer-menu :nth-child(4),
    .footer-menu :nth-child(5) {
        width: 50% }
    .footer-menu :nth-child(2) { order: 4 }
    .footer-menu :nth-child(4) { order: 3 }
    .footer-menu :nth-child(1) {order: 5; }
    .footer-menu ul { width: 100% !important; }
    .logo-copyright--section {
        display: flex;
        flex-direction: column-reverse;
        justify-content: flex-start;
        align-items: flex-start; }
    .list-unstyled li { width: 100% !important; }

    /* footer logo and copyright */
    .logo-copyright--section {
        border-top: 2px solid grey;
        margin-top: 10px;
        padding-top: 20px }
    .logo-copyright-text, .logo-copyright-text {
        width: 100% !important;
        font-size: 1.1em }
}

@media only screen and (min-width : 768px) and (max-width: 990px) {
    /* navbar */
    .navbar-nav :last-child { margin-left: 0 !important; }
    .login-btn { width: 18% }

    /* Carousel image */
    #carousel-item__1 {
        background-image: linear-gradient(to right, rgba(30, 28, 29, 0.8), rgba(51, 42, 45, 0.8)), url('../img/slider1_990.jpg');
    }

    #carousel-item__2 {
        background-image: linear-gradient(to right, rgba(30, 28, 29, 0.8), rgba(51, 42, 45, 0.8)), url('../img/slider2_990.jpg');
    }

    #carousel-item__3 {
        background-image: linear-gradient(to right, rgba(30, 28, 29, 0.8), rgba(51, 42, 45, 0.8)), url('../img/slider3_990.jpg');
    }

    #carousel-item__4 {
        background-image: linear-gradient(to right, rgba(30, 28, 29, 0.8), rgba(51, 42, 45, 0.8)), url('../img/slider4_990.jpg');
    }

    #carousel-item__5 {
        background-image: linear-gradient(to right, rgba(30, 28, 29, 0.8), rgba(51, 42, 45, 0.8)), url('../img/slider5_990.jpg');
    }

    /* Carousel heading */
    .carousel-caption h2 { font-size: 2.4em }
    .carousel-caption p { font-size: 1.4em }

    /* Services heading */
    .services-heading { font-size: 1em !important; }

    /* Explore section */
    .explore-section {
        height: 100%;
        clip-path: polygon(0 0, 100% 0, 100% 300px, 0 100%);
    }

    .explore-section--heading {
        font-size: 1.6em;
        margin-bottom: 10px;
    }

    /* Our customer section */
    .customers-section {
        background-image: linear-gradient(to right, rgba(132, 91, 49, 0.8), rgba(132, 91, 49, 0.5)), url('../img/ourCustomers_990.jpg');
    }
    .customers-section {
        padding: 50px 0 }
    .ourCustomers--heading {
        padding: 20px 20px 0 20px;
        font-size: 2.6em;
        text-align: center; }
    .ourCustomers--subheading {
        padding: 0 20px;
        font-size: 2em;
        text-align: center }

    /* Footer */
    .footer {
        padding-left: 30px;
        padding-right: 30px }
    .footer-menu :nth-child(2),
    .footer-menu :nth-child(3),
    .footer-menu :nth-child(4),
    .footer-menu :nth-child(5) { max-width: 100%; }
    .footer-menu :nth-child(2) { order: 4 }
    .footer-menu :nth-child(4) { order: 3 }
    .footer-menu :nth-child(1) {
        order: 5;
        flex: 0 0 100%;
        max-width: 100%;
        margin-top: 10px }
    .footer-menu ul { width: 100% !important; }
    .col-md-2 {
        max-width: 25%;
        flex: 0 0 25%; }
    .footer h6 { font-size: 1.4em }
    .footer a { font-size: 1.2em }
    .logo-copyright--section {
        display: flex;
        justify-content: flex-start;
        flex-direction: row;
    }
    .logo-copyright--section :nth-child(1) {
        order: -1;
        max-width: 10% }
    .logo-copyright-text {
        max-width: 100% !important;
        margin-left: 20px;
        font-size: 1.2em }
    .logo-copyright--section :nth-child(3) {
        order: 4;
        margin-left: 20px;
        max-width: 100% }
}

@media only screen and (min-width : 992px) {
    /* Explore section */
    .explore-section {
        height: 100%;
        clip-path: polygon(0 0, 100% 0, 100% 300px, 0 100%); }

    /* Our customer section */
    .customers-section {
        padding: 80px 0 }
    .ourCustomers--heading {
        padding: 20px 20px 0 20px;
        text-align: center; }
    .ourCustomers--subheading {
        padding: 0 20px;
        text-align: center }
}

