﻿/* Extra small devices (phones, 600px and down) */
@media (max-width: 600px) {
    .desktop { display: none !important; }


    .mobile { display: contents !important; }

    .mobile-block { display: block !important; }

    .desktop-block { display: none !important; }

    .menu-onScroll {
        border-radius: unset !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        margin-top: 0 !important;
        width: 100% !important;
        /*padding: 3px 0px!important;*/
    }

    .menu-justify {
        justify-content: space-between !important;
        padding: 0px 3%!important;
    }

    .menu-logo {
        max-width: 100px !important;
        vertical-align: bottom !important;
    }

    .banner-header { font-size: 15px !important; }

    .banner-tag {
        font-size: 12px !important;
        padding: 2px 6px !important;
    }

    .banner-fa { font-size: 20px !important; }

    .btn-carousel-play { font-size: 15px !important; }

    .offer-container {
        margin-top: 1.5rem !important;
        overflow: hidden;
        padding-left: 0 !important;
        position: unset;
    }

    .newMovies-card { padding: 10px !important; }

    .newMovies-gallery { margin-right: 3% !important; }

    .MoviesGallery { margin-right: 3% !important; }

    .posters-elem { padding: 0 .5rem !important; }

    .popular-section { padding-left: 3% !important; }

    .popular-background { background: radial-gradient(50.64% 50.02% at 50.00% 50.00%, rgba(121, 184, 243, 0.60) 0%, rgba(121, 184, 243, 0.00) 100%); }

    .mobile-padding-left-3p { padding-left: 3% !important; }

    .dl-btn { float: none; }

    

    .application-mobile-padding {
        margin-bottom: 1.5rem !important;
        margin-top: 1.5rem !important;
        padding: 0px 10% !important;
    }

    .menu-login-btn {
        font-size: 13px !important;
        margin-bottom: initial !important;
        margin-right: 5px !important;
        margin-top: auto !important;
        max-height: fit-content !important;
        padding: 5px !important;
    }

    .serial-banner-chapters {
        margin-right: 0px !important;
        margin-top: -150px !important;
        padding-right: 3% !important;
    }
    .serial-banner-chapters-ltr {
        margin-left: 0px !important;
        margin-top: -150px !important;
        padding-left: 3% !important;
        position:absolute;
    }

    .serial-banner-info { margin-top: 58px !important; }

    .serial-banner-heading { font-size: 32px !important; }

    .vertical-align-mid-sub { vertical-align: sub !important; }

    .serial-banner-desc {
        font-size: 14px;
        font-weight: 500;
        line-height: 1.5;
        text-align: justify;
    }

    .category-section { margin-top: 7rem !important; }

    .group-swiper { margin-right: 3% !important; }

    .plan-title {
        font-size: 20px !important;
        margin-top: 10px !important;
    }

    .plan-price {
        font-size: 16px !important;
        margin-top: 10px !important;
    }

    .title-month { font-size: 12px !important; }

    .plan-btn {
        font-size: 18px !important;
        margin-top: 10px !important;
        text-align: right !important;
    }

    .plan-desc { margin-top: 15px !important; }

    .plan-border {
        border-left: 1px solid #D9D9D9 !important;
        margin-bottom: 10px;
    }

    .six-mounth-padding { padding: 0 3% !important; }

    .card-plan-body { padding: 0rem 1rem !important; }

    .main-margin-top {
        margin-bottom: 60px !important;
        margin-top: 60px !important;
    }

    .login-container { margin-top: 5% !important; }

    .login-logo {
        margin-bottom: 10%;
        width: 100%;
    }

    .login-logo-div { text-align: center; }

    .activation-inner-div { text-align: center; }

    .activeCode-input { margin-right: 0%; }

    .cinema-card-header {
        font-size: 22px;
        margin-bottom: 15px;
        margin-top: 15px;
        text-align: center;
    }

    .cinema-poster-card { margin: auto 7px auto 0; }

    .cinema-filmnab-info { text-align: right !important; }

    .cinema-info {
        padding: 2% 3% 0 3% !important;
        position: unset !important;
    }

    .btn-cinema-info {
        font-size: 16px !important;
        margin-top: 0px !important;
        padding: 5px 20px !important;
        width: unset !important;
    }

    .image-overlay-cinema-info { background: linear-gradient(318deg, #000000 27%, rgba(217, 217, 217, 0.00) 120%) !important; }

    .actors-col {
        flex-basis: auto !important;
        margin-bottom: 10px;
    }

    .ruls-p {
        font-size: 12px !important;
        font-weight: 400 !important;
    }

    #activation-button {
        font-size: 16px !important;
        font-weight: 600 !important;
        padding: 9px !important;
    }

    .cinema-info-row { justify-content: center; }

    .cinema-span { margin-right: 40px !important; }

    .btn-cinema-info {
        margin-bottom: 20px;
        width: 50% !important;
    }

    .popular-row {
        margin-bottom: 3rem !important;
        margin-top: 3rem !important;
    }

    .topWatch-div {
        margin-bottom: 3rem;
        margin-top: 3rem !important;
    }

    .cinema-info-logo { width: 80%; }

    .m-r-m-0 { margin-right: 0%; }

    .dropdown-content-profile { left: 0 !important; }

    .mobile-txt-center { text-align: center !important; }

    .display-mobile-flex { display: flex; }

    .btn-movie-info {
        border-radius: 10px;
        color: #FFF !important;
        font-size: 15px;
        font-weight: 500;
        margin-top: 10px;
        padding: 5px 15px;
    }

    .w-65 { width: 100% !important; }

/*    #login-activeCode {
        letter-spacing: 20px !important;
        max-width: 100% !important;
    }*/

    .p-l-0 {
        padding-left: .5rem;
        padding-right: .5rem;
    }

    #play-timer, #play-timer-m {
        justify-content: center;
        text-align: center !important;
    }

    .newMoviesSlider { margin-top: 1.5rem; }

    .swiper-pagination-bullet {
        height: 8px !important;
        width: 8px !important;
    }

    .swiper-pagination-bullets {
        bottom: -6px !important;
        text-align: left !important;
    }

    .banner-info p { margin-bottom: .5rem !important; }
}

/* Small devices (portrait tablets and large phones, 600px and up) */

@media (max-width: 768px) {
    .banner-fade {
        align-items: center;
        background: linear-gradient(1deg, #000 50%, rgba(0, 0, 0, 0.00) 65%);
    }

    .banner-info {
        margin-right: 5% !important;
        margin-top: 0;
    }
}

@media only screen and (max-width: 992px) {   
    .desktop { display: none !important; }

    .mobile { display: contents !important; }

    .menu-onScroll {
        border-radius: unset !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        margin-top: 0 !important;
        width: 100% !important;
        /*padding: 3px 0px!important;*/
    }

    .menu-justify {
        justify-content: space-between !important;
        padding: 0px 3%!important;
    }

    .main-margin-top {
        margin-bottom: 60px !important;
        margin-top: 60px !important;
    }

    .cinema-info {
        bottom: 60px;
        right: 80px;
    }
    .cinema-info-ltr {
        bottom: 60px;
        left: 80px;
    }
}
 

@media only screen and (min-width: 600px) {
    .div_come_in_1 { max-width: 300px; }

    .cinema-background {
        position: relative;
        top: -30px;
    }

    .card-cinema-page {
        position: relative;
        top: -20px;
    }

    .swiper-cinema-page {
        position: relative;
        top: -20px;
    }

    .footer-cinema-page {
        position: relative;
        top: -20px;
    }
}

/* Medium devices (landscape tablets, 768px and up) */

@media only screen and (min-width: 768px) {
    .div_come_in_1 { max-width: 150px; }

    .cinema-background {
        position: relative;
        top: -35px;
    }

    .card-cinema-page {
        position: relative;
        top: -30px;
    }

    .swiper-cinema-page {
        position: relative;
        top: -30px;
    }

    .footer-cinema-page {
        position: relative;
        top: -30px;
    }
}

/* Large devices (laptops/desktops, 992px and up) */

@media only screen and (min-width: 993px) {
    .menu-onScroll {
        border-radius: 15px;
        margin-left: auto;
        margin-right: auto;
        margin-top: 10px;
        width: 90%;
    }

    .div_come_in_1 { max-width: 150px; }

    .cinema-background {
        position: relative;
        top: -70px;
    }

    .card-cinema-page {
        position: relative;
        top: -50px;
    }

    .swiper-cinema-page {
        position: relative;
        top: -50px;
    }

    .footer-cinema-page {
        position: relative;
        top: -50px;
    }
}

@media only screen and (min-width: 1102px) {
    .menu-onScroll {
        border-radius: 15px;
        margin-left: auto;
        margin-right: auto;
        margin-top: 10px;
        width: 80%;
    }
}

@media only screen and (min-width: 1200px) {
    .div_come_in_1 { max-width: 200px; }

    .cinema-background {
        position: relative;
        top: -80px;
    }

    .card-cinema-page {
        position: relative;
        top: -80px;
    }

    .swiper-cinema-page {
        position: relative;
        top: -60px;
    }

    .footer-cinema-page {
        position: relative;
        top: -50px;
    }

    #text-search-main { max-width: 85% !important; }
}

@media only screen and (min-width: 1800px) {
    /*.Carousel-Swiper { max-height: 600px !important; }*/

    .div_come_in_1 { max-width: 300px; }

    .cinema-background {
        position: relative;
        top: -100px;
    }

    .card-cinema-page {
        position: relative;
        top: -350px;
    }

    .swiper-cinema-page {
        position: relative;
        top: -250px;
    }

    .footer-cinema-page {
        position: relative;
        top: -150px;
    }
}

/* Extra large devices (large laptops and desktops, 1200px and up) */

/* ipad pro */