﻿/* ============================================
   PRO-CUT USA - ENHANCED MOBILE STYLES
   Mobile-first responsive enhancements
   ============================================ */

/* ===========================================
   CSS CUSTOM PROPERTIES FOR CONSISTENCY
   =========================================== */
:root {
    --pc-yellow: #ffd204;
    --pc-black: #000;
    --pc-dark-gray: #231f20;
    --pc-medium-gray: #636466;
    --pc-light-gray: #f1f1f2;
    --pc-border-gray: #c9c9c9;
    --mobile-padding: 15px;
    --touch-target-min: 44px;
}

/* ===========================================
   BASE MOBILE IMPROVEMENTS (All Mobile)
   =========================================== */

/* Improve tap targets for all interactive elements */
@media (max-width: 991px) {
    a, button, input[type="submit"], input[type="button"], .btn {
        min-height: var(--touch-target-min);
    }

    /* Prevent horizontal scroll */
    html, body {
        overflow-x: hidden;
        width: 100%;
    }

    /* Better text rendering on mobile */
    body {
        -webkit-text-size-adjust: 100%;
        text-rendering: optimizeLegibility;
    }

    /* Smoother scrolling */
    .carousel-inner {
        scroll-behavior: smooth;
    }
}

/* ===========================================
   HEADER & NAVIGATION - MOBILE
   =========================================== */
@media (max-width: 991px) {
    header {
        padding: 8px 10px;
        position: sticky;
        top: 0;
        z-index: 1000;
    }

        header .logo img {
            max-width: 160px;
            height: auto;
        }

    /* Mobile menu toggle improvements */
    .navbar-toggle {
        border: 2px solid var(--pc-yellow);
        border-radius: 4px;
        padding: 8px 10px;
        margin: 5px 0;
        background: transparent;
    }

        .navbar-toggle .icon-bar {
            background: var(--pc-yellow);
            width: 24px;
            height: 3px;
            transition: all 0.3s ease;
        }

        .navbar-toggle:hover,
        .navbar-toggle:focus {
            background: rgba(255, 210, 4, 0.1);
        }

    /* Mobile nav menu styling */
    .navbar-collapse {
        background: var(--pc-black);
        border-top: 3px solid var(--pc-yellow);
        max-height: calc(100vh - 60px);
        overflow-y: auto;
    }

    header .nav ul {
        padding: 10px 0;
    }

        header .nav ul li {
            border-bottom: 1px solid #333;
        }

            header .nav ul li:last-child {
                border-bottom: none;
            }

            header .nav ul li a {
                padding: 14px 20px;
                font-size: 16px;
                display: block;
                min-height: var(--touch-target-min);
                display: flex;
                align-items: center;
            }

            /* Mobile dropdown menu */
            header .nav ul li ul {
                background: #1a1a1a;
                padding-left: 20px;
            }

                header .nav ul li ul li a {
                    font-size: 15px;
                    padding: 12px 20px;
                }
}

/* ===========================================
   TOP SEARCH BAR - MOBILE
   =========================================== */
@media (max-width: 991px) {
    .topsearch {
        padding: 10px 0;
    }

        .topsearch .wrap {
            padding: 8px 10px;
        }

    .head-first-sec,
    .head-second-sec,
    .head-third-sec {
        width: 100%;
        display: block;
        float: none;
    }

    .head-second-1,
    .head-second-2 {
        width: 100%;
        margin: 0;
        padding: 10px 0;
        border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    }

    .head-center-text {
        position: relative;
        transform: none;
        left: auto;
        bottom: auto;
        width: 100%;
        margin-top: 0;
        text-align: center;
    }

        .head-center-text span {
            font-size: 25px;
            padding: 10px 20px;
            display: inline-block;
        }

    .second-1-content,
    .second-2-content {
        width: 100%;
        margin-left: 0;
        padding-left: 0;
    }

    .one-content-top,
    .two-content-top,
    .one-content-bottom,
    .two-content-bottom {
        width: 100%;
        display: block;
        padding-left: 0;
    }

    .wrap form input[type="text"] {
        width: 100%;
        max-width: none;
        padding: 10px;
        font-size: 16px;
        margin: 5px 0;
    }

    .wrap form input.sub {
        width: 100%;
        padding: 12px;
        font-size: 16px;
        margin-top: 0px;
        min-height: 48px;
    }

    .head-third-sec {
        position: absolute;
        top: 10px;
        right: 10px;
        width: auto;
    }
}

/* ===========================================
   BANNER / SLIDER - MOBILE
   =========================================== */
@media (max-width: 991px) {
    .banner {
        border-top: none;
    }

    .carousel-inner > .item {
        max-height: none;
    }

    .item img {
        width: 100%;
        height: auto;
        max-height: 50vh;
        object-fit: cover;
        object-position: center;
    }

    /* Carousel controls */
    .carousel-control {
        width: 10%;
        background: none !important;
    }

        .carousel-control img {
            width: 25px;
            height: auto;
        }

    .glyphicon-chevron-left,
    .glyphicon-chevron-right {
        top: 50%;
        transform: translateY(-50%);
    }

    /* Banner text overlays */
    .banner .left-text {
        position: relative;
        top: auto;
        left: auto;
        width: 100%;
        padding: 20px var(--mobile-padding);
        text-align: center;
        background: rgba(255, 255, 255, 0.95);
    }

        .banner .left-text h1 {
            font-size: 32px;
            line-height: 1.1;
            margin-bottom: 10px;
        }

        .banner .left-text h4 {
            font-size: 18px;
            margin-bottom: 15px;
        }

    /* Full image background banners */
    .left-text.full-image-bg {
        margin-left: 0 !important;
        padding: 30px 15px;
    }

        .left-text.full-image-bg h1 {
            line-height: 1.2;
        }

            .left-text.full-image-bg h1 span {
                font-size: 22px !important;
                padding: 5px 10px;
                display: inline-block;
                margin: 2px 0;
            }
}

@media (max-width: 767px) {
    .item img {
        max-height: 40vh;
        min-height: 200px;
    }

    .banner .left-text h1 {
        font-size: 28px;
    }

    .banner .left-text h4 {
        font-size: 16px;
    }

    .left-text.full-image-bg h1 span {
        font-size: 18px !important;
    }
}

@media (max-width: 480px) {
    .item img {
        max-height: 35vh;
        min-height: 180px;
    }

    .banner .left-text h1 {
        font-size: 24px;
    }

    .carousel-control {
        width: 15%;
    }

        .carousel-control img {
            width: 20px;
        }
}

/* ===========================================
   VIDEO CAROUSEL SECTION - MOBILE
   =========================================== */
@media (max-width: 991px) {
    .footer-top {
        padding: 50px var(--mobile-padding) 10px var(--mobile-padding);
    }

    .slider-right {
        width: 100%;
        padding: 0;
    }

    #myCarouselOnMain {
        width: 100%;
        margin: 0 auto;
    }

        #myCarouselOnMain .carousel-inner {
            margin: 0;
        }

    .slider-right iframe {
        width: 100%;
        height: 0;
        padding-bottom: 56.25%; /* 16:9 aspect ratio */
        position: relative;
    }

    /* Fix iframe aspect ratio on mobile */
    .slider-right .col-sm-6 {
        width: 100%;
        padding: 0 10px;
    }

        .slider-right .col-sm-6 iframe {
            height: 250px;
            padding-bottom: 0;
        }

    .productvideo {
        width: 100%;
        margin: 0;
        box-shadow: 5px 5px 10px -3px rgba(0, 0, 0, 0.5);
    }

    .videodescription {
        padding: 10px;
    }

        .videodescription h4 {
            font-size: 14px;
            margin-bottom: 5px;
        }

        .videodescription img {
            max-width: 50px;
        }

    /* Video navigation arrows */
    .leftvideo,
    .rightvideo {
        width: 30px;
        top: 35%;
        opacity: 0.8;
    }

    .leftvideo {
        left: -15px;
    }

    .rightvideo {
        right: -15px;
    }
}

@media (max-width: 767px) {
    .slider-right .col-sm-6 iframe {
        height: 200px;
    }

    #myCarouselOnMain .carousel-inner .carousel-item > div {
        display: none;
    }

        #myCarouselOnMain .carousel-inner .carousel-item > div:first-child {
            display: block;
            width: 100%;
        }
}

@media (max-width: 480px) {
    .slider-right .col-sm-6 iframe {
        height: 180px;
    }

    .leftvideo,
    .rightvideo {
        width: 25px;
    }

    .leftvideo {
        left: 5px;
    }

    .rightvideo {
        right: 5px;
    }
}

/* ===========================================
   VIRTUAL DEMO SECTION - MOBILE
   =========================================== */
@media (max-width: 991px) {
    .virtual {
        padding: 30px var(--mobile-padding);
    }

        .virtual .row {
            display: flex;
            flex-direction: column;
        }

        .virtual .col-lg-5,
        .virtual .col-lg-7 {
            width: 100%;
            float: none;
        }

        .virtual .ourservices {
            margin-bottom: 20px;
        }

        .virtual h3 {
            font-size: 18px;
            text-align: center;
        }

        .virtual p {
            font-size: 15px;
            text-align: center;
        }

        .virtual .more-box {
            text-align: center;
        }

            .virtual .more-box a {
                display: inline-block;
                float: none;
                font-size: 16px;
            }

    .virtual-thumb {
        text-align: center;
    }

        .virtual-thumb img {
            max-width: 100%;
            height: auto;
        }
}

@media (max-width: 480px) {
    .virtual h3 {
        font-size: 16px;
        line-height: 1.3;
    }

    .virtual p {
        font-size: 14px;
    }
}

/* ===========================================
   NEED ADVENTURE / RECRUITMENT SECTION - MOBILE
   =========================================== */
@media (max-width: 991px) {
    .need-adventure {
        padding: 20px var(--mobile-padding);
        margin-top: 0;
    }

        .need-adventure .row {
            display: flex;
            flex-direction: column;
        }

        .need-adventure .image {
            padding: 40px 15px;
            margin-top: 20px;
            order: 2;
        }

        .need-adventure .ourservices {
            order: 1;
        }

            .need-adventure .ourservices .more-box a {
                text-align: center;
                display: block;
                float: none;
            }
}

/* ===========================================
   ROTOR TOUR SECTION - MOBILE
   =========================================== */
@media (max-width: 991px) {
    .rotor {
        margin-bottom: 15px;
    }

        .rotor .wrapper {
            padding: 25px 15px;
            background-size: cover;
            background-position: center;
        }

            .rotor .wrapper h3 {
                font-size: 28px;
                padding: 12px 15px;
            }

            .rotor .wrapper .get-tour-dates {
                font-size: 24px;
            }
}

@media (max-width: 480px) {
    .rotor .wrapper h3 {
        font-size: 22px;
        padding: 10px 12px;
    }

    .rotor .wrapper .get-tour-dates {
        font-size: 18px;
        padding-right: 30px;
        background-size: 20px;
    }
}

/* ===========================================
   FOOTER - MOBILE
   =========================================== */
@media (max-width: 991px) {
    footer {
        margin-top: 30px !important;
    }

    .footer-bottom {
        margin-top: 15px;
    }

        .footer-bottom .row {
            display: block;
        }

    .footer-col-1,
    .footer-col-2,
    .footer-col-3 {
        width: 100%;
        float: none;
        text-align: center;
        padding: 25px var(--mobile-padding);
        border-left: none !important;
        border-right: none !important;
        border-bottom: 1px solid rgba(0, 0, 0, 0.15);
    }

    .footer-col-3 {
        border-bottom: none;
    }

    .footer-col-2 {
        border-left: none;
        border-right: none;
    }

        .footer-col-2 h2 {
            font-size: 24px;
            margin-top: 0;
            text-align: center;
        }

        .footer-col-2 p {
            font-size: 16px;
            text-align: center;
        }

    .footerContact {
        justify-content: center;
        font-size: 18px;
    }

    .footer-bottom .detail-box input[type="text"],
    .footer-bottom .detail-box input[type="email"] {
        width: 100%;
        padding: 12px;
        font-size: 16px;
        margin-bottom: 10px;
    }

    .footer-bottom .detail-box input[type="submit"] {
        width: 100%;
        max-width: 280px;
        padding: 12px;
        font-size: 16px;
    }

    .footer-bottom .ourservices h4.title,
    .footer-bottom .ourservices > .wraplinks > h4 {
        text-align: center;
        padding: 10px 0;
    }

    .footer-bottom .ourservices .wraplinks > ul {
        text-align: center;
    }

    .footer-bottom .footer-links .other-logos {
        text-align: center;
    }

    .detail-box.connect {
        justify-content: center;
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }

        .detail-box.connect a.socmedia {
            padding: 5px;
        }

            .detail-box.connect a.socmedia img {
                width: 40px;
                height: 40px;
            }
}

@media (max-width: 480px) {
    .footer-col-1,
    .footer-col-2,
    .footer-col-3 {
        padding: 20px 10px;
    }

        .footer-col-2 h2 {
            font-size: 20px;
        }

        .footer-col-2 p {
            font-size: 14px;
        }

    .footerContact {
        font-size: 16px;
        flex-direction: row;
        gap: 5px;
    }

        .footerContact img {
            max-width: 20px !important;
        }
}

/* Footer Copyright */
@media (max-width: 767px) {
    footer .footer-copytext {
        padding: 15px var(--mobile-padding);
        margin-top: 30px;
    }

        footer .footer-copytext p {
            text-align: center;
            font-size: 12px;
        }

            footer .footer-copytext p > span {
                float: none;
                display: block;
                margin-top: 10px;
                font-size: 16px;
            }
}

/* ===========================================
   PRODUCT PAGES - MOBILE
   =========================================== */
@media (max-width: 991px) {
    .products {
        padding: 20px var(--mobile-padding);
    }

    .product-detail h1 {
        font-size: 36px;
        line-height: 1.1;
    }

    .product-detail h2 {
        font-size: 22px;
        line-height: 1.2;
    }

    .product-detail .image-box {
        padding: 10px;
        text-align: center;
    }

        .product-detail .image-box img {
            max-width: 100%;
            height: auto;
        }

    .product-detail .pdf-download-box {
        max-width: 100%;
        display: flex;
        flex-wrap: wrap;
        gap: 15px;
    }

        .product-detail .pdf-download-box a {
            display: flex;
            align-items: center;
            gap: 10px;
        }
}

@media (max-width: 480px) {
    .product-detail h1 {
        font-size: 28px;
    }

    .product-detail h2 {
        font-size: 18px;
    }
}

/* Related Products */
@media (max-width: 767px) {
    .related-product {
        margin-top: 30px;
    }

        .related-product .col-sm-6 {
            width: 100%;
            margin-bottom: 20px;
        }

        .related-product h2 {
            font-size: 20px;
            text-align: center;
        }

        .related-product .prod-img {
            text-align: center;
        }

        .related-product .detail-box {
            text-align: center;
        }

            .related-product .detail-box .other-info {
                display: flex;
                flex-direction: column;
                align-items: center;
                gap: 10px;
            }

                .related-product .detail-box .other-info .Left-text,
                .related-product .detail-box .other-info .right-btn {
                    float: none;
                }
}

/* ===========================================
   FORMS - MOBILE
   =========================================== */
@media (max-width: 991px) {
    input[type="text"],
    input[type="email"],
    input[type="tel"],
    input[type="search"],
    select,
    textarea {
        font-size: 16px; /* Prevents iOS zoom */
        padding: 12px;
        width: 100%;
        max-width: 100%;
        border-radius: 4px;
    }

    input[type="submit"],
    button,
    .btn {
        padding: 12px 20px;
        font-size: 16px;
        min-height: var(--touch-target-min);
    }

    .choose label {
        max-width: 100%;
    }

    .choose select {
        width: 100%;
        padding: 12px;
    }

    .choose input[type="submit"] {
        width: 100%;
        padding: 12px 45px 12px 20px;
        font-size: 20px;
    }

    .searchbox {
        max-width: 100%;
        width: 100%;
    }

        .searchbox input[type="text"] {
            width: 100%;
        }
}

/* Rep Search Form */
@media (max-width: 767px) {
    .rep-search .container {
        padding: 0 var(--mobile-padding);
    }

    .rep-inner h1 {
        font-size: 24px;
    }

    .rep-inner p {
        font-size: 16px;
    }

    .resprenstative-main {
        padding: 15px;
    }

    .represnt-text h2 {
        font-size: 18px;
        line-height: 1.4;
    }

    .detailed-text,
    .request {
        width: 100%;
        display: block;
    }

    .request {
        margin-top: 15px;
    }

        .request a {
            text-align: center;
            display: block;
        }
}

/* ROI Calculator */
@media (max-width: 767px) {
    .check-roi-main {
        padding: 30px var(--mobile-padding);
    }

    .check-roi h1 {
        font-size: 22px;
    }

    .check-roi label,
    .check-roi input,
    .check-roi select {
        width: 100%;
        display: block;
        margin-bottom: 10px;
    }

    .check-roi span {
        text-align: left;
    }

    .sign-dollar,
    .sign-percentage {
        display: inline-block;
        width: auto;
        padding: 5px 10px;
    }

    .check-roi input.small-field,
    .check-roi select {
        width: calc(100% - 45px);
    }
}

/* ===========================================
   TABLES - MOBILE
   =========================================== */
@media (max-width: 767px) {
    .Result-details table {
        font-size: 11px;
    }

    .Result-details th,
    .Result-details td {
        padding: 5px 3px;
    }

    /* Responsive table approach */
    .Result-details table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
    }

    span.mobile-heading {
        display: block;
        font-weight: bold;
        margin-bottom: 3px;
        color: var(--pc-dark-gray);
    }
}

/* ===========================================
   MODALS - MOBILE
   =========================================== */
@media (max-width: 767px) {
    .modal-dialog {
        width: calc(100% - 20px);
        margin: 10px auto;
    }

        .modal-dialog .close {
            font-size: 30px;
            margin-right: 5px;
        }

        .modal-dialog .modal-content .modal-body {
            padding: 15px;
        }

            .modal-dialog .modal-content .modal-body h4 {
                font-size: 16px;
            }

    .modal-main .modal-body {
        padding: 15px;
    }

    .modal-main .brakesaver input {
        max-width: 100%;
    }

    .representative-each {
        flex-direction: column;
    }

        .representative-each img {
            max-width: 120px;
            margin: 0 auto 15px;
        }

        .representative-each .result-each {
            width: 100%;
            text-align: center;
        }
}

/* ===========================================
   BUTTONS - MOBILE
   =========================================== */
@media (max-width: 767px) {
    .yellow-btn,
    .gray-btn {
        width: 100%;
        display: block;
        text-align: center;
        margin: 10px 0;
        padding: 12px 20px;
    }

        .yellow-btn a,
        .gray-btn a {
            display: block;
        }

    .ourservices .more-box a {
        font-size: 16px;
        padding: 10px 35px 10px 0;
    }

    .left-btn {
        width: 100%;
    }

        .left-btn a {
            width: 100%;
            display: block;
            text-align: center;
        }
}

/* ===========================================
   TRAINING / LEARNING PAGES - MOBILE
   =========================================== */
@media (max-width: 767px) {
    .train-smart-pg h1 {
        font-size: 24px;
    }

    .train-smart-pg h2 {
        font-size: 22px;
        margin-top: 25px;
    }

    .train-smart-pg h3 {
        font-size: 18px;
    }

    .train-smart-pg p {
        font-size: 14px;
        text-align: left;
    }

    .train-smart-pg iframe {
        width: 100%;
        height: auto;
        aspect-ratio: 16/9;
    }

    .color-bx {
        min-height: auto;
        margin-bottom: 15px;
    }

        .color-bx p {
            min-height: auto;
        }

    .nextPre {
        margin: 0;
        padding: 15px 0;
    }

        .nextPre a,
        .nextPre h2 {
            width: 100%;
            display: block;
            text-align: center;
            margin-bottom: 10px;
            font-size: 18px;
        }

    .portal-login {
        margin: 30px var(--mobile-padding);
        padding: 20px 15px;
        border-radius: 15px;
    }

        .portal-login input[type="submit"] {
            font-size: 20px;
            padding: 10px 25px;
        }
}

/* Quiz styling */
@media (max-width: 767px) {
    .learning .quiz .radio td,
    .learning .quiz .radio1 td {
        width: 100%;
        display: block;
        padding: 8px 0;
    }

    .learning .quiz .quiztext {
        padding-right: 0;
    }
}

/* ===========================================
   CAMPAIGN / LANDING PAGES - MOBILE
   =========================================== */
@media (max-width: 991px) {
    .campaign h1 {
        font-size: 40px;
        line-height: 1.1;
        margin: 20px 0;
    }

    .campaign .right-wrap {
        padding: 30px 20px;
    }

    .campaign .form-wrap {
        padding: 20px;
    }

        .campaign .form-wrap > h2 {
            font-size: 24px;
        }
}

@media (max-width: 767px) {
    .wrap-header {
        padding: 10px 0;
    }

        .wrap-header span {
            font-size: 20px;
            line-height: 1.2;
            display: block;
            margin: 5px 0;
        }

    .campaign h1 {
        font-size: 30px;
        text-align: center;
    }

    .campaign h3 {
        font-size: 20px;
        text-align: center;
    }

    .campaign .image-box {
        text-align: center;
    }

        .campaign .image-box img.prod {
            max-height: 30vh;
        }

    .campaign .b17 h1 {
        margin-left: 0;
        text-align: center;
    }
}

@media (max-width: 480px) {
    .campaign h1 {
        font-size: 26px;
    }

    .campaign .form-wrap > form > input,
    .campaign .form-wrap > form > select {
        font-size: 14px;
    }

    .campaign .form-wrap > form > .btn-request {
        font-size: 16px;
    }
}

/* ===========================================
   TOUR PAGE - MOBILE
   =========================================== */
@media (max-width: 767px) {
    .tour .banner {
        padding: 40px 0 60px;
        background-position: center;
    }

        .tour .banner .wrap > label {
            font-size: 30px;
            padding: 5px 15px;
        }

        .tour .banner .wrap > p {
            font-size: 20px;
            padding-right: 40px;
            background-size: 25px;
        }

    .miles label {
        font-size: 20px;
    }

    .tour ul {
        padding-left: 20px;
    }

        .tour ul li {
            font-size: 16px;
        }

    .tour p {
        font-size: 15px;
    }

    .tour .gallery .wrap {
        padding: 15px;
    }

    .tour .gallery .img img {
        height: 100px;
        margin-bottom: 5px;
    }

    .tour .middle-content .maplabel {
        position: relative;
        padding: 10px;
    }

        .tour .middle-content .maplabel > label {
            font-size: 20px;
        }

    .tour .middle-content label.bot {
        position: relative;
        font-size: 14px;
    }
}

/* ===========================================
   SLIDER CUSTOM TEXT - MOBILE
   =========================================== */
@media (max-width: 767px) {
    .slider--custom--text span {
        font-size: 0.9em;
        padding: 5px 8px;
        line-height: 1.3;
    }

    .slide--right,
    .slide--right--2 {
        float: none;
        margin: 0;
        text-align: center;
    }

    .second--row {
        padding-left: 0;
    }
}

@media (max-width: 480px) {
    .slider--custom--text span {
        font-size: 0.75em;
    }

        .slider--custom--text span::before,
        .slider--custom--text span::after {
            width: 4px;
        }
}

/* ===========================================
   UTILITY CLASSES - MOBILE
   =========================================== */
@media (max-width: 767px) {
    /* Hide on mobile */
    .hidden-mobile {
        display: none !important;
    }

    /* Show only on mobile */
    .visible-mobile {
        display: block !important;
    }

    /* Center text on mobile */
    .text-center-mobile {
        text-align: center !important;
    }

    /* Full width on mobile */
    .full-width-mobile {
        width: 100% !important;
    }

    /* Remove float on mobile */
    .no-float-mobile {
        float: none !important;
    }

    /* Stack columns on mobile */
    .stack-mobile {
        display: block !important;
        width: 100% !important;
    }
}

/* ===========================================
   TOUCH-SPECIFIC ENHANCEMENTS
   =========================================== */
@media (hover: none) and (pointer: coarse) {
    /* Touch devices get larger tap targets */
    a, button, input[type="submit"], .btn {
        min-height: 48px;
        padding-top: 0px;
        padding-bottom: 12px;
    }

    /* Remove hover effects that don't work well on touch */
    header .nav ul li:hover {
        background: none;
    }

    header .nav ul li a:active {
        background: #404041;
        color: var(--pc-yellow);
    }

    /* Better scroll behavior */
    .carousel-inner {
        scroll-snap-type: x mandatory;
    }

    .item {
        scroll-snap-align: start;
    }
}

/* ===========================================
   LANDSCAPE MOBILE SPECIFIC
   =========================================== */
@media (max-width: 991px) and (orientation: landscape) {
    .item img {
        max-height: 60vh;
    }

    .banner .left-text {
        padding: 15px;
    }

        .banner .left-text h1 {
            font-size: 28px;
        }

        .banner .left-text h4 {
            font-size: 16px;
        }

    .virtual .row {
        flex-direction: row;
    }

    .virtual .col-lg-5,
    .virtual .col-lg-7 {
        width: 50%;
    }
}

/* ===========================================
   PRINT STYLES
   =========================================== */
@media print {
    header,
    .banner,
    .topsearch,
    .carousel-control,
    footer,
    .leftvideo,
    .rightvideo {
        display: none !important;
    }

    .middle-content {
        padding: 0;
    }

    body {
        font-size: 12pt;
        color: #000;
        background: #fff;
    }
}
