html {
    overflow: scroll !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
}
body {
    line-height: 1.34;
    letter-spacing: normal !important;
    font-size: 14px;
    font-weight: 300;
    font-display: swap !important;
    font-family: 'Lato', sans-serif;
    text-decoration: none !important;
    text-overflow: ellipsis !important;
    -webkit-font-smoothing: antialiased !important; 
    background-color: #e9ebee !important;
    color: #1D2129 !important;
    overflow-y:scroll;
    padding:0;
    margin:0;
}

select, textarea, input, button {
    border-radius: 0px !important;
}

select:focus,
textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {   
    border-color: #700000 !important;
    box-shadow: none !important;
    outline: none !important;
}

.card {
    border-radius: 0px !important;
    .card-img-top {
        border-radius: 0px !important;
    }
}

.navbar {
    min-height: 100px;
    .navbar-brand {
        img {
            width: 200px;
        }
    }
    .collapse {
        .que-menu-mobile {
            display: none !important;
        }
    }
    .que-menu-desktop {
        display: block;
        a {
            font-size: 16px;
            font-weight: 600;
            text-decoration: none;
            color: #fff;
            letter-spacing: 1px;
        }
        a:hover {
            color: #fdbd10;
        }
    }
}

@media only screen and (max-width: 900px) {
    .navbar {
        min-height: 100px;
        .navbar-brand {
            img {
                width: 150px;
            }
        }
        .collapse {
            .que-menu-mobile {
                display: flex !important;
                flex-direction: column !important;
                a {
                    padding: 10px !important;
                    font-size: 16px !important;
                    font-weight: 600 !important;
                    text-decoration: none !important;
                    color: #fff !important;
                    letter-spacing: 1px !important;
                }
                a:hover {
                    color: #fdbd10;
                }
            }
        }
        .que-menu-mobile {
            display: flex !important;
            flex-direction: column !important;
            a {
                padding: 10px !important;
                font-size: 16px !important;
                font-weight: 600 !important;
                text-decoration: none !important;
                color: #fff !important;
                letter-spacing: 1px !important;
            }
            a:hover {
                color: #fdbd10;
            }
        }
        .que-menu-desktop {
            display: none !important;
        }
    }
}

.nav-scroller {
    position: relative;
    z-index: 2;
    height: 2.75rem;
    overflow-y: hidden;

    .nav {
        display: flex;
        flex-wrap: nowrap;
        padding-bottom: 1rem;
        margin-top: -1px;
        overflow-x: auto;
        text-align: center;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
    }
}

.red {
    border: 1px solid red;
}

.white {
    border: 1px solid white;
}

.que-height-xl {
    min-height: 700px !important;
}

.que-height-xxl {
    min-height: 900px !important;
}

.que-height-sm {
    min-height: 100px !important;
}

.que-height-sm-2 {
    min-height: 200px !important;
}

.que-height-md {
    min-height: 300px !important;
}

.que-height-md-2 {
    min-height: 400px !important;
}

.que-btn-rounded {
    border-radius: 50px !important;
}

.que-bg-yellow {
    background-color: #fdbd10;
}

.que-bg-light {
    background-color: #fff;
}

.que-bg-light-gray {
    background-color: #dbe0e3;
}

.que-bg-dark {
    background-color: #1d2129;
}

.que-bg-darkest {
    background-color: #000000;
}

.que-bg-maroon {
    background-color: #700000;
}

.que-bg-dark-maroon {
    background-color: #420101;
}

.que-txt-dark {
    color: #1d2129;
}

.que-txt-maroon {
    color: #700000;
}

.que-txt-light {
    color: #fff;
}

.que-btn {
    background-color: #fdbd10;
    color: #fff;
    border-radius: 0 !important;
}

.que-btn:hover {
    background-color: #ef9421;
    color: #fff;
}

.que-wa {
    cursor: pointer;
    position:fixed;
    left: 30px;
    bottom: 30px;
    z-index: 999;
    a {
        text-decoration: none;
        img {
            width: 100px;
        }
    }
}

@media only screen and (max-width: 900px) {
    .que-wa {
        a {
            img {
                width: 70px;
            }
        }
    }
}

.que-header {
    .container {
        min-height: 70px;
        color: #fff;
        img {
            width: 200px;
        }
        .que-left {
            h1 {
                font-size: 48px;
                font-weight: 700;
                color: #fff;
            }
            p {
                font-size: 20px;
                font-weight: 500;
                color: #fff;
            }
        }
        .que-right {
            text-align: right;
            img {
                width: 70%;
            }
        }
    }
    .que-hero {
        background-image: url('/assets/images/landing/hero.jpg');
        background-repeat: no-repeat;
        background-size: cover;
    }
}

@media only screen and (max-width: 900px) {
    .que-header {
        .container {
            .que-left {
                padding-top: 50px;
                h1 {
                    text-align: center;
                    font-size: 28px;
                }
                p {
                    text-align: center;
                    font-size: 16px;
                }
                .que-btn {
                    margin: 0 auto;
                }
                .que-btn-hero {
                    display: flex;
                    justify-content: center;
                }
            }
            .que-right {
                padding: 50px 20px;
                img {
                    width: 100%;
                }
            }
        }
    }
}

.que-sub-header {
    h1 {
        font-size: 52px;
        font-weight: 700;
        letter-spacing: 1px;
    }
    p {
        font-size: 20px;
        font-weight: 600;
        color: darkgray;
    }
    .que-lead-title {
        font-size: 36px;
        font-weight: 600;
    }
}

@media only screen and (max-width: 900px) {
    .que-sub-header {
        h1 {
            font-size: 32px;
            font-weight: 600;
            letter-spacing: 1px;
        }
        p {
            font-size: 16px;
            font-weight: 600;
            color: darkgray;
        }
        .que-lead-title {
            font-size: 28px !important;
            font-weight: 600;
        }
    }
}

.que-collage {
    .que-lead-title {
        font-size: 38px;
        span {
            font-weight: 600;
        }
    }
    p {
        font-size: 18px;
        font-weight: 300;
        line-height: 35px;
    }
    .que-bg-maroon {
        .row {
            min-height: 700px;
        }
    }
    .que-bg-light {
        .que-lead-title {
            font-size: 36px;
            font-weight: 500;
        }
        p {
            font-weight: 500;
            color: #fff;
        }
        .flex-column {
            .col, .col-1 {
                font-size: 18px;
                font-weight: 400;
                i {
                    font-size: 42px;
                }
            }
            .col-1 {
                text-align: center !important;
                margin-right: 10px;
            }
        }
    }
}

@media only screen and (max-width: 900px) {
    .que-collage {
        .que-lead-title {
            text-align: center;
            font-size: 28px !important;
            font-weight: 600;
            span {
                font-weight: 600;
            }
        }
        p {
            text-align: center;
            font-weight: 300;
            line-height: 30px;
        }
        .que-bg-maroon {
            .row {
                min-height: 400px;
            }
        }
        .que-bg-light {
            .que-lead-title {
                font-size: 28px !important;
            }
            p {
                font-size: 16px;
            }
            .flex-column {
                .col, .col-1 {
                    text-align: right;
                    font-size: 14px;
                    i {
                        font-size: 38px;
                    }
                }
                .col-1 {
                    margin-right: 10px;
                    display: flex;
                    justify-content: start;
                    align-items: center;
                }
            }
        }
    }
}

.que-service {
    .text-center {
        margin: 0 auto;  
        p {
            font-size: 20px;
            font-weight: 500;
            color: darkgray;
            width: 50%;
        }
        .que-lead-title {
            font-size: 36px;
            font-weight: 600;
        }
    }
}

@media only screen and (max-width: 900px) {
    .que-service {
        .text-center {
            p {
                font-size: 18px;
                width: 100%;
                line-height: 30px;
                font-weight: 500;
            }
            .que-lead-title {
                font-size: 28px !important;
                font-weight: 600;
            }
        }
    }
}

.que-cta {
    line-height: 35px;
    .order-1 {
        p {
            font-size: 18px;
            font-weight: 500;
            line-height: 30px;
            color: darkgray;
        }
        .que-lead-title {
            font-size: 36px;
            font-weight: 600;
        }
    }
}

@media only screen and (max-width: 900px) {
    .que-cta {
        line-height: 30px;
        .order-1 {
            padding: 30px 30px;
            p {
                font-size: 16px;
                text-align: center !important;
            }
            .que-lead-title {
                font-size: 28px !important;
                text-align: center;
            }
        }
    }        
}

.que-banner {
    background-image: url('/assets/images/service_banner.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 500px;
}

.que-footer {
    .row {
        min-height: 300px;
        img {
            width: 150px;
        }
        p {
            font-size: 16px;
            font-weight: 600;
            line-height: 25px;
            width: 80%;
        }
        .que-txt-light {
            div, a {
                font-size: 16px;
                font-weight: 400;
                line-height: 35px;
                text-decoration: none;
                color: #fff;
            }
            i {
                font-size: 18px;
                margin-right: 10px;
            }
        
            h5 {
                font-size: 22px;
                font-weight: 600;
            }
        }
    }
}

@media only screen and (max-width: 900px) {
    .que-footer {
        .row {
            padding: 40px 0px;
            text-align: center;
            img {
                width: 150px;
            }
            p {
                text-align: left;
                font-weight: 500;
                line-height: 30px;
                width: 100%;
            }
            .que-link {
                text-align: left;
                padding: 20px 20px;
            }
        }
    }
}

.que-maintenance {
    background-image: url('/assets/images/landing/hero.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    .row {
        width: 50%;
        h1 {
            font-size: 32px;
            font-weight: 600;
        }
        p {
            font-size: 18px;
            font-weight: 500;
            color: #1d2129;
        }
        a {
            text-decoration: none;
            font-weight: 700;
            color: #ef9421;
        }
    }
}

@media only screen and (max-width: 900px) {
    .que-maintenance {
        background-repeat: repeat;
        .row {
            width: 100%;
        }
    }
}

.red {
    border: 1px solid red;
}
