﻿@media (min-width: 469px) and (max-width: 991px) and (orientation: landscape)
{
    /* For Route 1 in Route page and About page */
    .route-1-hero-image {
        height: 75vh !important;
    }
    .route-1-hero-overlay {
        width: 100%;
        position: static;
        height: auto;
    }
    .sec-carousel-overlay {
        padding-top: 12px;
    }
    .route-1-hero-text {
        max-width: 100%;
        text-align: center;
        font-size: 17px;
    }
    /* Truncate text to 4 lines with ellipsis */
    .route-1-hero-text p {
        display: -webkit-box;
        /*-webkit-line-clamp: 4;*/ /* show only 4 lines */
        font-size: 12px;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
    }



    /* ==================
        For Route 2 
       ================== */


    .route-2-hero-overlay {
        position: static;
        width: 100%;
        height: auto;
        background-color: rgba(255, 255, 255, 0.9);
    }
    .route-2-hero-image {
        height: 75vh !important;
    }
    .route-2-hero-text {
        max-width: 100%;
        text-align: center;
        font-size: 17px;
    }
    .route-2-hero-text h1 {
        font-size: 1.5rem;
    }
    .route-2-hero-text p {
        display: -webkit-box;
        /* -webkit-line-clamp: 4;*/
        font-size: 12px;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 17px;
    }


    /* ==================
        For Experience In Home page 
       ================== */


    .experience-hero-overlay {
        width: 100%;
        /*padding: 30px;*/
        position: static;
        height: auto;
        background-color: rgba(255, 255, 255, 0.9);
    }

    .experience-hero-text {
        max-width: 100%;
        text-align: center;
        font-size: 14px;
    }

    .experience-hero-image {
        height: 75vh !important;
        display: block;
    }

    .experience-hero-text p {
        display: -webkit-box;
        /* -webkit-line-clamp: 4;*/
        font-size: 12px;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
    }


    /* ==================
        For About page 
       ================== */


}
