/* #region RESPONSIVE CSS */

/* ***************************************************************************************************************************************************************/
/* ****   RESPONSIVE CSS   ***************************************************************************************************************************************/
/* ***************************************************************************************************************************************************************/

@media (min-aspect-ratio: 16/9) {
    .youtube-video {
        height: 100vh; /* Full height of the viewport */
        width: 177.78vh; /* 16:9 aspect ratio (177.78 = 16/9 * 100) */
    }
}

/* Extra Large Devices (Desktops, 1200px and up) */
@media (min-width: 1200px) {
    /* Styles for large desktops */
}

@media (max-width: 1200px) {
    #control-main-content,
    #mobile-apps-main-content {
        padding: 76px 1.9rem;
    }
}

/* Large Devices (Laptops/Desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199px) {

    #mobile-apps-main-content .middle .first {
        max-width: 250px;
    }

    #mobile-apps-main-content .middle .second {
        max-width: 600px;
    }

    
    /* Styles for medium to large screens */
}

/* Medium Devices (Tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991px) {
    #mobile-apps-main-content .middle {
        justify-content: space-between;
    }

        #mobile-apps-main-content .middle .first {
            max-width: 30%;
        }

        #mobile-apps-main-content .middle .second {
            max-width: 60%;
        }

    #mobile-apps-main-content {
        padding: 76px 1.9rem;
    }

    /* Styles for tablets and small laptops */
}

/* Small Devices (Landscape Phones, 576px and up) */
@media (min-width: 576px) and (max-width: 768px) {
    /* Styles for larger mobile phones (landscape orientation) */
}

/* Extra Small Devices (Portrait Phones, Less than 576px) */
@media (max-width: 575px) {
    /* Styles for small mobile devices */
}

/* High-Resolution Screens (4K and up) */
@media (min-width: 2560px) {
    /* Styles for ultra-high resolution screens */
}

/* Portrait Mode for Tablets and Smartphones */
@media (orientation: portrait) and (max-width: 991px) {
    /* Adjustments specific to portrait orientation */
}

/* Landscape Mode for Tablets and Smartphones */
@media (orientation: landscape) and (max-width: 991px) {
    /* Adjustments specific to landscape orientation */
}

/* Retina Display (High DPI) */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    /* Styles for retina and high-resolution displays */
}

/* Common device-specific breakpoints */

/* iPad Pro (12.9") Portrait & Landscape */
@media (min-width: 1024px) and (max-width: 1366px) {
    /* Styles for iPad Pro 12.9" */
}

/* iPad (7.9" & 9.7" versions) Portrait & Landscape */
@media (min-width: 768px) and (max-width: 1024px) {

    /* Styles for iPads 7.9" and 9.7" */
}

/* iPad (7.9" & 9.7" versions) Portrait & Landscape */
@media (max-width: 576px) {
}

@media (min-width: 576px) and (max-width: 1024px) {
}

@media (min-width: 813px) and (max-width: 990px) {
}

@media (max-width: 360px) {
}

/* iPhone X, XS, 11 Pro (375px wide) */
@media (max-width: 812px) {
    .overlay-intro #skip-sect {
        bottom: 75px;
        left: calc(100% - 205px);
    }

    #video-div iframe {
        top: -10vh;
        left: calc(100% - 79vw);
        width: 293%;
        height: 150%;
    }
}

/* iPhone 6, 7, 8, SE (2nd gen) (375px wide) */
@media (min-width: 375px) and (max-width: 667px) {
}

/* Galaxy S9, Pixel 3, and similar Android phones (360px wide) */
@media (min-width: 360px) and (max-width: 740px) {
    /* Styles for Galaxy S9, Pixel 3 */
}

@media (max-width: 992px) {
    #model-section {
        height: calc(100% - 55vh);
    }

        #model-section #details-div {
            display: block;
        }


    #control-main-content .bottom {
        flex-flow: column;
        justify-content: center;
        gap: 2rem;
    }
}

@media (max-width: 768px) {
    #video-div iframe {
        top: -10vh !important;
        left: calc(100% - 128vw) !important;
        width: 233% !important;
        height: 150% !important;
    }

    #mobile-apps-main-content .middle {
        flex-flow: column;
        justify-content: center;
        align-items: center;
        row-gap: 2rem;
    }

        #mobile-apps-main-content .middle .first {
            max-width: 150px;
        }

        #mobile-apps-main-content .middle .second {
            max-width: 450px;
        }

    #mobile-apps-main-content {
        padding: 76px 1.9rem;
    }

    .img-wrapper.hover-scale:hover::after {
        bottom: 10px;
    }

}

/* ***************************************************************************************************************************************************************/
/* ****   / RESPONSIVE CSS   ***************************************************************************************************************************************/
/* ***************************************************************************************************************************************************************/

/* #endregion */