@media screen and (max-width: 1200px) {
    .BannerSliderItemInner, .CourseShowPageCover {
        height: 330px;
    }

    .PlatformFeatures {
        display: none;
    }

    .HomeSearchDiv {
        margin: 0 auto;
        width: 100%;
    }

    .HomeSearch {
        padding: 25px 0 20px;
        margin: 0 auto;
        width: 100%;
    }

    .HeaderTabs {
        display: none;
    }

    .HeaderLogo {
        margin: 0 auto;
    }

    .HeaderAuth {
        display: none;
    }

    .BlogsItem, .CourseModuleItem, .CourseModuleItem, .MyQuizzesItem {
        margin: 20px 2%;
        width: 46%;
    }

    .HomeAboutArt {
        display: none;
    }

    .HomeAboutText {
        display: block;
        margin: 0 auto;
        width: 100%;
        max-width: unset;
    }

    .HomeAbout {
        padding: 30px;
    }

    .FAQInner {
        display: block;
        margin: 0 auto;
        width: 100%;
    }

    .Reels {
        display: block;
        margin: 0 auto;
        width: 100%;
    }

    .FAQIGH {
        display: block;
        margin: 0 auto;
        width: 90%;
    }

    .FooterSection {
        display: block;
        margin: 0 auto 30px;
        width: 100%;
    }

    .FooterSubscribe {
        display: block;
        margin: 0 auto;
        width: 100%;
    }

    .SubscriptionInputGroup input {
        max-width: 100%;
    }

    footer {
        display: block;
        margin: 0 auto;
        width: 100%;
        padding: 30px;
    }

    .SideMenu {
    }

    .SideMenuInner {
        position: fixed;
        right: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: 99999999;
        overflow: hidden;
    }

    .SideMenuFade {
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
        background: #000000;
        opacity: 0.5;
    }

    .SideMenuDiv {
        position: fixed;
        right: 0;
        top: 0;
        width: 300px;
        height: 100%;
        overflow: hidden;
        background: #ffffff;
        padding: 20px;
        overflow-y: auto;
    }

    .SideMenuLogo {
        display: block;
        margin: 0 auto 25px;
        width: 200px;
        height: auto;
        max-width: 90%;
    }

    .SideMenuDiv ul {
        display: block;
        margin: 0 auto;
        width: 100%;
        padding: 0 0;
    }

    .SideMenuDiv ul li {
        display: block;
        margin: 0 auto;
        width: 100%;
        padding: 14px 0;
        border-bottom: solid 1px #d9d9d9;
    }

    .SideMenuBtn {
        position: absolute;
        right: 2%;
        top: 10%;
        width: auto;
        height: 80%;
        aspect-ratio: 1/1;
        display: flex;
        justify-content: center;
        align-items: center;
        color: white;
        background: var(--theme);
        border-radius: 10px;
        font-size: 30px;
        line-height: 1px;
        border: none;
    }

    .SideMenuBtn i {
        pointer-events: none;
    }

    .VideoCloser {
        display: flex;
        position: fixed;
        right: 0;
        bottom: 0;
        width: 100%;
        height: fit-content;
        background: #ffffff;
        padding: 20px;
        z-index: 2;
    }

    .VideoCloser button {
        display: flex;
        justify-content: center;
        align-items: center;
        width: fit-content;
        padding: 10px 20px;
        border: solid 2px;
        color: #dd4545;
        border-radius: 5px;
        background: none;
    }

    .VideoPlayerDiv {
        position: fixed;
        right: 0;
        top: 0;
        width: 100%;
        height: 100%;
        max-height: unset;
        max-width: unset;
        border-radius: 0;
        z-index: 999;
    }

    .VideoPlayerDiv video {
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: 0;
        padding-bottom: 88px;
        object-fit: contain;
        object-position: center center;
    }

    .BlogsItemDetails h5 {
    }

    .BlogsItemDetails h5 g {
    }

    navbar {
        display: flex;
        position: fixed;
        right: 0;
        bottom: 0;
        width: 100%;
        z-index: 999999;
        background: #ffffff;
        box-shadow: 0px 0px 37px -12px #000000;
        justify-content: space-between;
        align-items: center;
    }

    navbar button {
        display: block;
        margin: 0 auto;
        width: 25%;
        border: none;
        padding: 10px 0;
        position: relative;
    }

    navbar button i {
        display: block;
        margin: 0 auto 9px;
        width: 100%;
        text-align: center;
        font-size: 30px;
        color: var(--theme);
    }

    navbar button label {
        display: block;
        margin: 0 auto;
        width: 100%;
        font-size: 15px;
    }

    body {
        padding-bottom: 80px;
    }

    #Notifications {
        position: fixed;
        right: 0;
        top: 0;
        width: 100%;
        height: 100%;
        margin: 0;
        max-width: unset;
        max-height: unset;
        border-radius: 0;
    }

    navbar button span {
        position: absolute;
        right: 34%;
        top: 8px;
        width: fit-content;
        background: #527954;
        color: white;
        aspect-ratio: 1/1;
        min-width: 26px;
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 1000px;
        z-index: 2;
        font-size: 15px;
        line-height: 1px;
        padding: 5px 0 0;
    }

    .CourseSubscription {
        display: block;
        margin: 0 auto 20px;
        width: 92%;
    }

    .CourseSubscriptionIntroduction {
        display: block;
        margin: 0 auto;
        width: 100%;
    }

    .CourseSubscriptionPlansGH {
        display: flex;
        justify-content: start;
        align-items: start;
        width: 100%;
    }

    .CourseSubscriptionPlanItem {
        margin: 10px 1%;
        width: 48%;
    }

    .CourseShowPageCover .CourseTrailerTrigger {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 100%;
        position: absolute;
        z-index: 2;
        background: #ffffff8f;
        font-size: 100px;
        color: var(--theme2);
        cursor: pointer;
    }

    .Lessons {
        padding: 20px;
    }

    .LessonsListTrigger {
        display: flex;
        position: fixed;
        left: 0;
        bottom: 0;
        z-index: 2;
        margin: 10px;
        justify-content: center;
        align-items: center;
        width: 65px;
        aspect-ratio: 1/1;
        background: var(--theme2);
        color: white;
        border: none;
        border-radius: 1000px;
        font-size: 37px;
    }

    .LessonsList {
        display: none;
        z-index: 9999;
    }

    .LessonsListFade {
        position: fixed;
        right: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: 9;
        background: #000000;
        opacity: 0.5;
    }

    .QuizItemAnswerItem {
        display: block;
        margin: 10px auto;
        width: 100%;
    }

    .QuizIntroduction label {
        font-size: 19px;
    }

    .ProfileDetails {
        display: block;
        margin: 0 auto;
        width: 100%;
    }

    .ProfileDetailsLeft {
        display: block;
        margin: 0 auto;
        width: 100%;
    }

    .ProfileDetailsRight {
        display: block;
        margin: 0 0 20px;
        width: fit-content;
    }

    .ProfileTabs {
        display: flex;
        justify-content: center;
    }

    .ProfileTabs button {
    }

    .AuthDetailsBox, .AuthDetailsBox, .AuthDetailsBox {
        display: block;
        margin: 36px auto;
        width: 95%;
        height: fit-content;
        min-height: unset;
        aspect-ratio: unset;
    }

    .AuthDetails {
        display: block;
        margin: 0 auto;
        width: 100%;
        padding: 20px;
    }

    .CertificatesItem {
        display: block;
        margin: 20px auto;
        width: 100%;
    }

    .AboutPageCover h1 {
    }

    .SideMenuDiv ul .SMSignOutBtn {
        color: #d74f4f;
        font-weight: bold;
        border: 0!important;
    }

    .SideMenuDiv ul .SMSignOutBtn i {
        position: relative;
        top: 2px;
        margin: 0 0;
        margin-left: 10px;
    }
}