@media screen and (min-width: 1460px) {}

@media screen and (max-width: 1600px) {}

@media screen and (max-width: 1365px) {}

@media screen and (max-width: 1199px) {
    .login-left .text-box h2 {
        font-size: 26px;
        line-height: 32px;
        max-width: 350px;
        width: 100%;
    }

    .login-left .text-box {
        max-width: 350px;
    }

    .quotes-left {
        left: -60px;
    }

    .product-box .text-box .text-inner h4 {
        font-size: 10px;
    }

    .skil-list {
        grid-template-columns: auto auto auto;
    }

    .video-detail-right {
        max-width: 240px;
        width: 100%;
    }

    .related-box .related-image {
        max-width: 100px;
        width: 100%;
    }

    .video-detail-top .text-box h4 {
        font-size: 12px;
        line-height: 20px;
    }

    .video-description ul {
        flex-wrap: wrap;
        row-gap: 15px;
    }

    .dashboard-contect.active .video-detail-right {
        max-width: 260px;
    }
}

@media screen and (max-width: 991px) {
    .login-left {
        padding-bottom: 40px;
    }

    .login-left .text-box {
        max-width: 270px;
    }

    .login-left .text-box h2 {
        font-size: 20px;
        line-height: 28px;
        max-width: 275px;
        width: 100%;
    }

    .login-left .text-box span {
        font-size: 66px;
        line-height: 50px;
    }

    .quotes-left {
        left: -40px;
        top: -18px;
    }

    .quotes-right {
        right: -15px;
        bottom: -15px;
    }

    .login-box .text-box {
        margin-bottom: 20px;
    }

    .login-form form .form-group {
        margin-bottom: 20px;
    }

    .login-form form .form-group p.sign-acco {
        margin-top: 20px;
    }

    header {
        padding: 8px 15px;
    }

    .header-form {
        width: 240px;
    }

    .header-left ul,
    .header-right ul {
        gap: 10px;
    }

    .sidebar ul li .nav-link {
        gap: 5px;
        padding: 11px 10px;
    }

    .sidebar {
        padding: 6px;
        width: 200px;
    }

    .sidebar ul li .nav-link p {
        font-size: 12px;
    }

    .dashboard-contect {
        padding-left: 200px;
    }

    .Category-list ol .dropdown-btn {
        width: 130px;
    }

    .recommended-inner [class*="col-"] {
        padding: 0 8px;
    }

    .recommended-inner .row {
        margin: 0 -8px;
    }

    .product-box .text-box .text-inner h4 {
        font-size: 12px;
    }

    .w-160 {
        width: 90px;
    }

    .profile-box strong {
        font-size: 14px;
    }

    .profile-inner {
        padding: 30px 0;
        margin-bottom: 18px;
    }

    .edit-profile {
        gap: 30px;
    }

    .profile-inner .edit-profile .image-holder a {
        right: -2px;
    }

    .dashboard-contect.active .profile-inner .edit-profile .image-holder a {
        right: 16px;
    }

    .video-detail-inner {
        flex-direction: column;
    }

    .video-detail-right,
    .dashboard-contect.active .video-detail-right {
        max-width: 100%;
    }

    .video-description ul li p {
        font-size: 10px;
        ;
    }
}

@media screen and (max-width: 767px) {
    .login-sec {
        height: 100vh;
        grid-template-columns: 12fr;
    }

    .login-left {
        display: none;
    }

    .login-header {
        top: 18px;
        right: 14px;
    }

    .login-header ul {
        gap: 12px;
    }

    .login-form form .form-group {
        margin-bottom: 24px;
    }

    .login-form form .form-group p.sign-acco {
        margin-top: 24px;
    }

    .login-form {
        padding: 0;
    }

    .sidebar {
        left: -100%;
    }

    .sidebar.active {
        left: 0;
    }

    .dashboard-contect {
        padding-left: 0;
        padding-top: 53px;
    }

    header {
        padding: 10px 17px;
    }

    header .header-mid {
        display: none;
    }

    .header-mid {
        gap: 13px;
        width: 100%;
        padding: 10px 14px;
    }

    .header-mid .dropdown-btn {
        width: 91px;
    }

    .header-form {
        width: 100%;
        flex: 1;
    }

    .dashboard-inner {
        padding-left: 14px;
        padding-right: 14px;
        padding-top: 0;
        padding-bottom: 24px;
    }

    .logo img {
        height: 19px;
    }

    .menu-btn img {
        height: 20px;
    }

    .switch-btn {
        width: 23px;
        height: 23px;
    }

    .switch-btn img {
        height: 12px;
    }

    .language-btn {
        border-radius: 3px;
        height: 21px;
    }

    .language-btn.dropdown-toggle::after {
        width: 14px;
        height: 19px;
        background-size: 6px;
    }

    .login-btn {
        font-size: 14px;
        height: 32px;
        width: 67px;
    }

    .language-dropdown .dropdown-menu .dropdown-item span {
        width: 18px;
        font-size: 10px;
    }

    .language-dropdown .dropdown-menu li .dropdown-item img {
        height: 23px;
    }

    .login-profile {
        gap: 5px;
        height: 32px;
    }

    .login-profile img {
        height: 24px;
    }

    .login-profile p {
        font-size: 10px;
    }

    .locker-list {
        margin: 12px 0 7px 0;
    }

    .locker-list ol {
        flex-wrap: wrap;
    }

    .skil-list {
        grid-template-columns: auto auto;
    }

    .profile-detail {
        max-width: 100%;
        align-items: flex-start;
        flex-direction: column;
    }

    .profile-box strong {
        font-size: 16px;
    }

    .w-160 {
        width: 100%;
    }

    .profile-inner .image-holder {
        justify-content: center;
        margin: 27px auto 0;
    }

    .profile-inner {
        padding: 26px 0 0px;
        margin-bottom: 12px;
    }

    .profile-box li {
        margin-bottom: 34px;
    }

    .edit-profile-inner {
        padding: 26px 0;
    }

    .dashboard-contect.active .profile-inner .edit-profile .image-holder a {
        right: -4px;
    }
}

@media screen and (max-width: 575px) {
    .sidebar.active {
        width: 100px;
    }

    .dashboard-contect.active {
        padding-left: 100px;
    }

    .title h2 {
        font-size: 16px;
    }

    .Category-list {
        padding-bottom: 7px !important;
        border-bottom: none;
    }

    .dashboard-contect.active .header-mid {
        padding: 10px 10px;
    }

    .header-mid {
        gap: 8px;
    }

    .dashboard-contect.active .header-mid .dropdown-btn {
        width: 78px;
    }

    .dashboard-contect.active .dashboard-inner {
        padding-left: 10px;
        padding-right: 10px;
    }

    .Category-list ol {
        flex-wrap: wrap;
        row-gap: 12px;
        column-gap: 0;
        margin: 0 -6px;
    }

    .Category-list ol li {
        width: 50%;
        padding: 0 6px;
    }

    .dashboard-contect.active .Category-list ol {
        margin: 0 -2px;
        row-gap: 10px;
    }

    .dashboard-contect.active .Category-list ol li {
        padding: 0 2px;
    }

    .Category-list ol .dropdown-btn {
        width: 100%;
    }

    .recommended-video {
        padding: 12px 0 !important;
    }

    .product-box,
    .channel-box {
        margin: 6px 0;
    }

    .sort-btn {
        width: 24px;
        height: 24px;
        border-radius: 2px;
    }

    .btn-group {
        gap: 5px;
        margin-right: 5px;
    }

    .btn-outline-primary {
        font-size: 10px;
        gap: 3px;
        height: 24px;
        padding: 0 7px;
    }

    .product-box .text-box .text-inner h4 {
        overflow: hidden;
        width: 100%;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .title {
        align-items: flex-start;
    }

    .sort {
        flex-direction: column-reverse;
        align-items: flex-end;
    }

    .sort.active .btn-group {
        flex-direction: column;
        align-items: flex-end;
        margin: 5px 0 0 0;
    }

    .loker-inner {
        max-width: 284px;
    }

    .loker-inner .media span {
        max-width: 60px;
    }

    .loker-inner .media h4 {
        font-size: 12px;
    }

    .locker-list li a {
        font-size: 10px;
        height: 24px;
    }

    .skil-box a {
        padding: 10px;
    }

    .skil-box h4 {
        font-size: 14px;
        margin-top: 7px;
    }

    .skil-list {
        gap: 12px;
        margin-top: 12px;
    }

    .dashboard-contect.active .skil-list {
        grid-template-columns: 12fr;
    }

    .edit-profile {
        gap: 24px;
        flex-direction: column;
    }

    .edit-profile .image-holder {
        max-width: 180px;
        margin-top: 0;
    }

    .profile-inner .edit-profile .image-holder a img {
        height: 16px;
    }

    .profile-inner .edit-profile .image-holder a {
        width: 32px;
        height: 32px;
        right: 20px;
    }

    .profile-edit-page .recommended-video {
        padding-top: 12px !important;
    }

    .profile-btn ul {
        justify-content: center;
    }

    .sponser-list {
        grid-template-columns: 12fr;
    }

    .video-detail-inner {
        gap: 20px;
        padding-left: 14px;
        padding-right: 14px;
        padding-top: 4px;
        padding-bottom: 20px;
    }

    .video-detail-top .text-box h4 {
        font-size: 14px;
        line-height: 24px;
    }

    .video-media {
        flex-direction: column;
        align-items: flex-start;
        margin: 12px 0 16px;
    }

    .video-detail-top .profile-text .text-box h4 {
        font-size: 12px;
        line-height: 20px;
    }
    .info-list{
        width: 100%;
        margin-top: 15px;
    }
    .info-list ul li:nth-child(3){
        margin-left: auto;
    }
    .video-description{
        margin: 16px 0 0 0;
    }
    .video-description ul li {
        width: 50%;
    }
    .video-description ul li p {
        font-size: 12px;
    }
    .related-video {
        margin: 0;
    }
    .vide-detail-page .video-detail-inner{
        gap: 0;
    }
}