/*Main CSS */
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

body {
    font-family: "Roboto", sans-serif !important;
    background-color: #000000 !important;
}

.theme-dark {
    background-color: #151515 !important;
}

.navbar-brand img {
    width: 50px !important;
}

.owl-nav button:hover {
    background-color: transparent !important;
}

.owl-prev.disabled,
.owl-next.disabled {
    opacity: 0 !important;
}

.footer {
    background-color: #141314;
    padding: 4rem 0px 2rem 0px;
}

.footer h3 {
    font-size: 18px;
    color: #fff;
    margin-bottom: 30px;
}

.footer_links li a {
    font-size: 14px;
    color: #D1D0CF;
    text-decoration: unset;
    margin-bottom: 20px;
    display: block;
}

.footer_links {
    list-style-type: none;
}

.footer_contact p {
    font-size: 14px;
}

.footer_contact p a {
    text-decoration: unset;
    color: #D1D0CF;
}

.costumer_num {
    font-size: 20px;
    font-weight: 700;
}

.subscribe_form {
    display: flex;
}

.subscribe_form input {
    border-radius: 0px;
    background-color: #191919;
    border: 0;
    font-size: 12px;
}

.subscribe_form input::placeholder {
    color: #fff;
    font-size: 12px;
}

.subscribe_form button,
.subscribe_form button:hover {
    background-color: #673AB7 !important;
    color: #fff;
    text-transform: uppercase;
    font-size: 12px;
}

.follow_link span {
    color: #fff;
    font-size: 14px;
}

.follow_link {
    display: flex;
    align-items: center;
    gap: 10px;
}

.follow_link ul {
    display: flex;
    list-style-type: none;
    gap: 10px;
}

.follow_link ul li a {
    width: 30px;
    height: 30px;
    background-color: #252525;
    border-radius: 50px;
    position: relative;
    display: inline-flex;
    padding: 7px;
    align-items: center;
    justify-content: center;
}

.follow_link ul li a img {
    width: 14px;
    height: 13px;
}

.copy_rights {
    color: #fff;
    font-size: 14px;
    border-top: 3px solid #191919;
    padding-top: 30px;
}

.copy_rights a {
    color: #673AB7;
    text-decoration: none;
}

.breadcrumb_section {
    padding: 4rem 0px;
    background-image: url("../images/banner.jpg");
}

.breadcrumb_section ol li a {
    color: #673AB7;
    text-decoration: none;
}

.breadcrumb_section ol li.active {
    color: #fff;
}

.breadcrumb_section button {
    width: 100%;
    background: #673AB7;
    color: #fff;
    font-size: 14px;
    padding: 15px 8px;
}

header {
    position: sticky;
    top: 0;
    z-index: 99;
}

.header_nav {
    padding: 0;
    margin: 0;
    list-style-type: none;
    display: flex;
}

.nav_link a.active {
    color: #45B2E5 !important;
}

.profile_dropdown {
    border-radius: 0 !important;
    padding: 0 !important;
}

.profile_dropdown li a {
    font-size: 16px !important;
    padding: 10px 18px !important;
    transition: all .5s;
}

.profile_dropdown li a:hover {
    background-color: #673AB7;
    color: #fff;
    transition: all .5s;
}

.mobile_bottom-menu {
    display: none;
}


@media screen and (max-width:768px) {
    .header_nav {
        width: 100%;
    }

    /* mobile bottom menu  */
    .mobile_bottom-menu {
        position: fixed;
        bottom: 0;
        left: 0;
        background: #673ab7;
        z-index: 989;
        width: 100%;
        display: block !important
    }

    .mobile_bottom-menu ul {
        list-style-type: none;
        display: flex;
        justify-content: space-around;
        align-items: center;
        padding: 14px 4px;
    }

    .sub_nav {
        display: none !important;
    }

    #offcanvasProfileProfile .profile_dropdown {
        list-style-type: none;

    }

    .login_card-body {
        width: 90% !important;
    }

    .or_divide span {
        background: #04080700;
        backdrop-filter: none;
    }

    .alert_danger {
        right: 0 !important;
        left: 0;
        margin: 0 auto;
    }
}



@media screen and (max-width:992px) {
    .footer .col {
        flex: 2 0 30%;
        margin-bottom: 3rem;
    }
}

@media screen and (max-width:618px) {
    .footer .col {
        flex: 2 0 51%;
        margin-bottom: 3rem;
    }
}


.favorite_movie {
    position: absolute;
    right: 4px;
    top: 5px;
    z-index: 9;
    cursor: pointer;
    width: 35px;
    height: 35px;
    background: #fff;
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.favorite_movie input[type="checkbox"] {
    display: none;
}


.favorite_movie input[type="checkbox"]+label {
    position: relative;
    display: inline-block;
    font-size: 16px;
    cursor: pointer;
}

.favorite_movie input[type="checkbox"]+label:before {
    content: "";
    padding: 10px;
    display: block;
    transition: .5s ease;
    background-image: url("../images/icons/border-heart.svg");
    background-repeat: no-repeat;
}



.favorite_movie input[type="checkbox"]:checked+label:before {
    background-image: url("../images/icons/fill-heart.svg");
}

.alert_danger {
    position: fixed;
    top: 20px;
    right: 20px;
    background: #EF5350;
    width: 310px;
    padding: 12px 10px;
    border-radius: 4px;
    font-size: 14px;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 10px;
}

.payment_step {
    font-size: 12px;
}

.package_fee {
    list-style-image: url('../images/icons/movie.svg');
    padding-left: 25px;
}

.package_fee li {
    color: #fff;
    margin-bottom: 5px;
    font-size: 16px;
}

.payment_note {
    background: #ef5350;
    padding: 4px 5px;
    font-size: 13px;
    border-radius: 6px;
    margin-bottom: 13px;
    color: #fff;
    line-height: normal;
}

.payment-step li {
    margin-bottom: 10px !important;
}

/* otp  */
.otp_number {
    gap: 10px;
}

.otp_number input {
    width: 50px !important;
    height: 50px !important;
    background: #d3d3d369;
    border-radius: 3px;
    text-align: center;

}

/* @media screen and (min-width:768px) { */
    .profile_dropdown {
        border-radius: 6px !important;
        background: #ffffffa1 !important;
        backdrop-filter: blur(5px);
        overflow: hidden;
        border: 0 !important;
    }

/* } */

/* Main CSS */

.fa-pin a{
    color:white;
    text-decoration: none;
}


/* Home Page CSS */
.movie_hero-slider {
    height: calc(100vh - 77px);
    overflow: hidden;
    position: relative;
}

.hero_silde::before {
    content: "";
    content: "";
    position: absolute;
    width: 50%;
    height: 100%;
    top: 0;
    left: -110px;
    z-index: 3;
    filter: blur(100px);
    background: radial-gradient(circle at 50% 50%, rgb(21 21 21), rgb(21 21 21));
    opacity: 0.8;
}

/* .movie_hero-slider::after {
    content: "";
    position: absolute;
    width: 10%;
    height: 100%;
    top: 0;
    right: 0;
    box-shadow: inset 5px 0px 120px 18px #151515;
    z-index: 2;
    filter: blur(20px);
} */

.movie_hero-sm {
    position: absolute;
    width: 480px;
    height: 400px;
    right: 0;
    top: 20%;
    background-color: #000;
    z-index: 1;
    padding-top: 16px;
    padding-left: 16px;
}

.hero_silde-sm img {
    height: 330px;
    width: 100%;
    object-fit: cover;
}

.sm-hero .owl-nav button {
    background-color: transparent !important;
}

.sm-hero .owl-nav {
    display: flex;
}

.sm-hero .owl-nav button .nav-btn {
    width: 30px;
    height: 30px;
    border: 2px solid #fff;
    border-radius: 50px;
}

.movie_details {
    position: absolute;
    height: 70%;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    top: 0;
    left: 0;
    color: #fff;
    padding: 40px;
    z-index: 4;
}

.movie_role ul {
    gap: 26px;
}

.movie_role ul li:first-child {
    list-style-type: none;
}

.movie_role ul li::marker {
    color: red;
}

.movie_name {
    font-size: 4rem;
    font-weight: 700;
}

.watch_brn a {
    display: inline-block;
    background: #673AB7;
    color: #fff;
    text-decoration: none;
    font-size: 14px;
    padding: 10px 40px;
    border-radius: 4px;
    text-transform: uppercase;
}

.top_movies {
    padding: 5rem 0px;
}

.top_movies h3 {
    font-size: 20px;
    font-weight: 300;
}

.top-movie_card img {
    height: 300px;
    object-fit: cover;
}
.movie_counter{
    counter-reset: my-sec-counter;
}
.movie_counter .owl-item::before {
    counter-increment: my-sec-counter;
    content: counter(my-sec-counter);
    color: #45B2E5;
    position: absolute;
    bottom: -130px;
    right: -6px;
    font-size: 10rem;
    font-weight: 600;
    z-index: 1;
    transition: all .5s;
}

.top-movies .owl-item:hover::before {
    bottom: -100px;
    transition: all .5s;
}

.top-movies-carousel .owl-stage {
    padding-bottom: 5rem;
}

.top-movie_card::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    height: 200px;
    width: 100%;
    background: rgb(2, 0, 36);
    background: linear-gradient(360deg, rgb(21 21 21 / 6%) 0%, rgb(21 21 21 / 70%) 35%, rgb(21 21 21 / 0%) 100%);
}

.top-movies button.owl-prev {
    position: absolute;
    left: 0;
    top: 42%;
}
.top-movies button.owl-next {
    position: absolute;
    right: 0;
    top: 42%;
}

.top-movies button .nav-btn {
    width: 30px;
    height: 30px;
    border-radius: 50px;
    border: 2px solid #fff;
}
.upcoming_movie-card{
    transition: all .5s;
    border-radius: 5px;
    overflow: hidden;
    border: 1px solid #683ab700;
}

.upcoming_movie-card:hover{
    transition: all .5s;
    background-color: #141314;
    border: 1px solid #673AB7;
    box-shadow: 0px 0px 20px #673ab7b5;
}
.movie_details-card{
    position: absolute;
    bottom: 0;
    left: 0;
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    background: rgb(2, 0, 36);
    background: linear-gradient(180deg, rgb(0 0 0 / 53%) 0%, rgb(0 0 0 / 38%) 35%, rgb(0 0 0) 100%);
    color: #fff;
    padding: 12px 10px;
    opacity: 0;
    transition: all .5s;
}

.movie_details-name a.no-link{
    text-decoration: none;
    color: #fff;
}

.movie_details-card .movie_details-name, .movie_details-card .movie_details-name a.no-link{
    font-size: 22px;
    font-weight: 600;
}
.movie_details-card .movie_details-duration{
    font-size: 12px;
    margin-bottom: 12px;
}
.movie_details-card .movie_details-btn{
    background-color: #673AB7;
    color: #fff;
    text-transform: uppercase;
    font-size: 12px;
    padding: 8px 10px;
    text-align: center;
    border-radius: 5px;
    cursor: pointer;
    text-decoration: none;
}
.upcoming_movie-card:hover .movie_details-card{
    opacity: 1;
    transition: all .5s;
}

.upcoming_movies .owl-stage{
    padding: 8px 0px;
}


@media screen and (max-width:992px) {
    .movie_hero-sm{
        display: none;
    }
    .movie_hero-slider{
        height: auto;
    }
    .movie_details{
        padding: 0;
    }
    .movie_details .w-50{
        width: 100% !important;
    }
    .movie_hero-container .hero_silde img{
        height: 100vh;
        object-fit: cover;
    }
    .movie_name {
        font-size: 24px;
    }
    .movie_story{
        font-size: 12px;
    }
    .movie_role ul li {
        font-size: 12px;
    }
}
/* Home Page CSS */


.side-image {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 0
}

.side-image.full-left {
    width: 50vw
}

.side-image.full-right {
    width: 50vw;
    float: left
}

.side-image img {
    width: 100%;
    padding: 40px;
}

.cover-img .side-image img {
    width: 100%;
    padding: 0px !important;
}

.side-content {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

.side-content.right {
    color: #fff
}

.side-content h2 {
    width: 100%;
    display: block;
    font-size: 4rem;
    font-weight: 600;
    margin-bottom: 40px;
    text-align: center;
    font-family: Netflix Sans, Helvetica Neue, Helvetica, Arial, sans-serif
}

.side-content .icon-list {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
    list-style: none
}

.side-content .icon-list li {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 40px;
    padding: 0;
    list-style: none;
    text-align: center
}

.side-content .icon-list li:last-child {
    margin-bottom: 0
}

.side-content .icon-list li figure {
    width: 100px;
    display: inline-block;
    margin: 0
}

.side-content .icon-list li figure img {
    height: 60px
}

.side-content .icon-list li .content {
    width: 100%;
    display: inline-block;
    font-family: Netflix Sans, Helvetica Neue, Helvetica, Arial, sans-serif
}

.side-content .icon-list li .content h4 {
    width: 100%;
    display: block;
    font-weight: 100;
    font-size: 35px;
    line-height: 3rem
}

.side-content .icon-list li .content p {
    width: 100%;
    display: block;
    margin: 0
}

/* FAQ Style */
.faq_accordion .card {
    margin-bottom: 10px;
    background: #141314;
    color: #fff;
}

.faq_accordion .faq_accordion-btn.collapsed  {
    color: #fff;
    border-bottom: 1px solid transparent;
}
.faq_accordion .faq_accordion-btn{
    color: #673AB7;
    width: 100%;
    text-align: left;
    padding: 20px 14px;
    border-bottom: 1px solid #ffffff26;
    border-radius: 0;
    position: relative;
}
.faq_accordion .faq_accordion-btn:active{
    color: #673AB7 !important;
    border: 0 !important;
    box-shadow: unset !important;
}
.faq_accordion .card-body {
    font-size: 14px;
}
.faq_accordion .card-header{
    border: 0 !important;
    padding: 0 !important;
}
.faq_accordion .faq_accordion-btn::before{
    content: "";
    position: absolute;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="%23673ab7" d="M34.9 289.5l-22.2-22.2c-9.4-9.4-9.4-24.6 0-33.9L207 39c9.4-9.4 24.6-9.4 33.9 0l194.3 194.3c9.4 9.4 9.4 24.6 0 33.9L413 289.4c-9.5 9.5-25 9.3-34.3-.4L264 168.6V456c0 13.3-10.7 24-24 24h-32c-13.3 0-24-10.7-24-24V168.6L69.2 289.1c-9.3 9.8-24.8 10-34.3 .4z"/></svg>');
    right: 20px;
    top: 22px;
    width: 20px;
    height: 20px;
    background-size: 20px 20px;
}
.faq_accordion .faq_accordion-btn.collapsed::before{
    content: "";
    position: absolute;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--!Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path fill="%23ffffff" d="M413.1 222.5l22.2 22.2c9.4 9.4 9.4 24.6 0 33.9L241 473c-9.4 9.4-24.6 9.4-33.9 0L12.7 278.6c-9.4-9.4-9.4-24.6 0-33.9l22.2-22.2c9.5-9.5 25-9.3 34.3 .4L184 343.4V56c0-13.3 10.7-24 24-24h32c13.3 0 24 10.7 24 24v287.4l114.8-120.5c9.3-9.8 24.8-10 34.3-.4z"/></svg>');
    right: 20px;
    top: 22px;
    width: 20px;
    height: 20px;
    background-size: 20px 20px;
}
/* FAQ Style */


/*Contact Us*/
.getin_touch {
    background: #141314;
    padding: 36px 30px;
    display: flex;
    flex-direction: column;
    /* justify-content: space-between; */
    justify-content: normal;
    height: 100%;
}

.getin_touch p {
    color: #fff;
    font-size: 14px;
    font-weight: 300;
    margin-bottom: 4rem;
}

.getin_touch h3,
.contact_form h3 {
    font-size: 36px;
    color: #fff;
}

.getin_touch ul {
    list-style-type: none;
}

.getin_touch li a {
    text-decoration: none;
    margin-bottom: 12px;
    display: block;
    color: #673AB7;
    position: relative;
    display: flex;
    gap: 10px;
    align-items: center;
}
.getin_touch .contact_mail::before{
    content: "";
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="%23ffffff" d="M464 64H48C21.5 64 0 85.5 0 112v288c0 26.5 21.5 48 48 48h416c26.5 0 48-21.5 48-48V112c0-26.5-21.5-48-48-48zm0 48v40.8c-22.4 18.3-58.2 46.7-134.6 106.5-16.8 13.2-50.2 45.1-73.4 44.7-23.2 .4-56.6-31.5-73.4-44.7C106.2 199.5 70.4 171.1 48 152.8V112h416zM48 400V214.4c22.9 18.3 55.4 43.9 104.9 82.6 21.9 17.2 60.1 55.2 103.1 55 42.7 .2 80.5-37.2 103.1-54.9 49.5-38.8 82-64.4 104.9-82.7V400H48z"/></svg>');
    position: relative;
    width: 20px;
    height: 20px;
    background-size: 20px 20px;
}
.getin_touch .contact_phone::before{
    content: "";
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--!Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path fill="%23ffffff" d="M272 0H48C21.5 0 0 21.5 0 48v416c0 26.5 21.5 48 48 48h224c26.5 0 48-21.5 48-48V48c0-26.5-21.5-48-48-48zM160 480c-17.7 0-32-14.3-32-32s14.3-32 32-32 32 14.3 32 32-14.3 32-32 32zm112-108c0 6.6-5.4 12-12 12H60c-6.6 0-12-5.4-12-12V60c0-6.6 5.4-12 12-12h200c6.6 0 12 5.4 12 12v312z"/></svg>');
    position: relative;
    width: 20px;
    height: 20px;
    background-size: 20px 20px;
}

.contact_form form label {
    color: #fff;
    font-size: 14px;
    font-weight: 300;
}

.contact_form form .form-control {
    background: #141314;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    color: #fff;
    font-size: 14px;
    padding: 12px 14px;
}

.contact_form form .form-control::placeholder {
    color: #ffffff92;
    font-size: 14px;
    font-weight: 300;
}

.btn-send {
    background: #673AB7;
    border: 0;
    padding: 10px 30px;
    border-radius: 3px;
    color: #fff;
}
.btn-send:hover{
    background-color: #4c2293;
    color: #fff;
}
/* Contact Us */

/** Stream **/
.video_details h3, .video_details h5 {
    color: #fff;
}

.video_details ul,
.video_dur ul {
    gap: 32px;
}

.video_details ul li {
    color: #673AB7;
    font-size: 16px;
}

.video_details ul li:first-child,
.video_dur ul li:first-child {
    list-style-type: none;
}

.video_details ul li::marker {
    color: #fff;
}

.video_dur ul li {
    color: #fff;
    font-size: 16px;
}

.video_share ul {
    list-style-type: none;
    gap: 10px;
}

.video_share ul li a {
    width: 40px;
    height: 40px;
    background-color: #f0f8ff24;
    border-radius: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.video_share ul li a img {
    width: 22px;
}

.movie_tabs {
    background: linear-gradient(90.06deg, rgba(20, 20, 20, 0) 1.66%, #141314 43.64%, rgba(20, 20, 20, 0) 89.28%);
    justify-content: center;
}

.movie_tabs li a, .movie_tabs li a:hover {
    border: 0 !important;
    border-top: 2px solid transparent !important;
    color: #fff;
    border-radius: 0px !important;
    font-size: 18px;
}

.movie_tabs li a.active {
    color: #673AB7 !important;
    background: rgb(16 15 16) !important;
    background: linear-gradient(0deg, rgb(17 16 17) 0%, rgb(17 16 17) 35%, #673ab773 100%) !important;
    border-top: 2px solid #673AB7 !important;
}
.movie_tabs-content .tab-pane p{
    color: #fff;
    font-size: 16px;
}
/** Stream **/

/* Login **/
.login_card-container {
    height: 100%;
    /* display: flex;
    align-items: center;
    justify-content: center; */
    padding: 4rem 0px;
}

.login_card-body {
    background-color: #00000082;
    width: 440px;
    margin: 0px auto;
    height: auto;
    backdrop-filter: blur(3px);
}

.login_card-body input, .login_card-body select {
    background-color: #141314;
    color: #fff !important;
    font-size: 14px;
    font-weight: 300;
    border: 0;
    border-radius: 0;
    box-shadow: unset !important;
    border: 1px solid transparent;
}

.login_card-body input:focus,.login_card-body select:focus  {
    background-color: #141314;
    border: 1px solid #673AB7;
}

.login_card-body form label {
    color: #fff;
    font-size: 14px;
}

.forgot_password {
    text-align: end;
    display: block;
    color: #673AB7;
    font-size: 14px;
    text-decoration: unset;
    font-style: italic;
    font-weight: 600;
}

.submit_btn {
    width: 100%;
    background-color: #673AB7 !important;
    color: #fff;
    font-size: 12px !important;
    border: 0 !important;
    text-transform: uppercase;
    padding: 12px 10px !important;
}

.remember_check input {
    border: 1px solid #fff !important;
}

.remember_check input:checked {
    background-color: #673AB7 !important;
}

.remember_check label {
    font-size: 14px;
}

.new_account {
    font-size: 14px;
    color: #fff;
}

.new_account a {
    color: #673AB7;
    text-decoration: unset;
}
.or_divide{
    font-size: 14px;
}
.or_divide::before {
    content: "";
    width: 100%;
    height: 1px;
    top: 12px;
    left: 0px;
    background-color: #262525;
    position: absolute;
}
.or_divide span{
    background: #040807;
    display: inline-block;
    padding: 2px 7px;
    position: relative;
    backdrop-filter: blur(53px);
}
.login_card-body .text_field{
    padding: 14px 16px !important;
}
.login_card-body h1{
    font-size: 20px !important;
    color: #fff !important;
}
/* Login **/

/*Packages */

.package_card-head{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.package_card{
    background: #2F2B42;
    border: 1px solid #673ab7;
    border-radius: 10px;
    padding: 20px 26px;
    color: #fff;
    transition: all .5s;
}
.package_card-left{
    display: flex;
    flex-direction: column;
}
.package_card-left .price_value{
    /* font-size: 5rem; */
    font-size: 3rem;
    font-weight: 700;
}
.package_card button, .package_card a{
    width: 100%;
    background: #673AB7;
    font-size: 14px;
    padding: 14px 5px;
    color: #fff;
}
.package_card button:hover, .package_card a:hover{
    background: #3d226c;
}
.package_card-right ul li{
    position: relative;
    list-style-type: none;
    font-size: 18px;
    margin-bottom: 10px;
}
.package_card-right ul li::before{
    content: "";
    position: absolute;
    left: -26px;
    top: 2px;
    width: 20px;
    height: 20px;
    background-size: 20px 20px;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="%23ffffff" d="M504 256c0 137-111 248-248 248S8 393 8 256 119 8 256 8s248 111 248 248zM227.3 387.3l184-184c6.2-6.2 6.2-16.4 0-22.6l-22.6-22.6c-6.2-6.2-16.4-6.2-22.6 0L216 308.1l-70.1-70.1c-6.2-6.2-16.4-6.2-22.6 0l-22.6 22.6c-6.2 6.2-6.2 16.4 0 22.6l104 104c6.2 6.2 16.4 6.2 22.6 0z"/></svg>')
}

.package_card:hover{
    transition: all .5s;
    box-shadow: 0px 0px 20px #673ab7b5;
}
/*Packages */

/*Static Pages */

.about_title h3{
    font-size: 46px;
    color: #fff;
}
.about_content{
    text-align: left;
}
.about_content h2{
    font-size: 40px;
    color: #fff;
}
.about_content h3{
    font-size: 1.74rem;
    color: #fff;
}

.about_content ul li{
    /* font-size: 36px; */
    color: #fff;
}
.about_content p{
    font-size: 20px;
    color: #fff;
}
/* Static Pages */
/*Rating*/
.video_dur  .rating{
    padding-left:10px;
}
.video_dur  .rating  li.checked {
    color: orange;
  }
/*Rating*/

.show-cursor{
    cursor: pointer;
}

/** Account **/
.avatar-upload {
    position: relative;
    max-width: 205px;
    /* margin: 50px auto; */
    margin: 40px auto;
}

.avatar-upload .avatar-edit {
    position: absolute;
    right: 12px;
    z-index: 1;
    top: 10px;
}

.avatar-upload .avatar-edit input {
    display: none;
}

.avatar-upload .avatar-edit input+label {
    display: inline-block;
    width: 34px;
    height: 34px;
    margin-bottom: 0;
    border-radius: 100%;
    background: #FFFFFF;
    border: 1px solid transparent;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.12);
    cursor: pointer;
    font-weight: normal;
    transition: all 0.2s ease-in-out;
}

.avatar-upload .avatar-edit input+label:hover {
    background: #f1f1f1;
    border-color: #d6d6d6;
}

.avatar-upload .avatar-edit input+label:after {
    content: "\f040";
    font-family: 'FontAwesome';
    color: #757575;
    position: absolute;
    top: 10px;
    left: 0;
    right: 0;
    text-align: center;
    margin: auto;
}

.avatar-upload .avatar-preview {
    width: 192px;
    height: 192px;
    position: relative;
    border-radius: 100%;
    border: 6px solid #F8F8F8;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
}

.avatar-upload .avatar-preview>div {
    width: 100%;
    height: 100%;
    border-radius: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.package_card {
    background: #2F2B42;
    border: 1px solid #673ab7;
    border-radius: 10px;
    padding: 20px 26px;
    color: #fff;
    transition: all .5s;
}

.form_field input {
    border-radius: 0;
    background: #ffffff;
    border: 0;
}

.form_field label {
    font-size: 12px;
}

.form_field button {
    background: #673AB7;
    padding: 8px 44px;
    border: 0;
    border-radius: 0;
    color: #fff;
}

.current_package {
    background-color: #673ab7;
}

@media screen and (min-width:769px) {
    .package_card-profile {
        position: sticky;
        top: 110px;
    }
}
/** Account **/

.note_text {
    font-size: 12px;
    color: #ffffff;
    font-style: italic;
}

/** Payment History **/
.custom_table tbody,
.custom_table td,
.custom_table tfoot,
.custom_table th,
thead,
.custom_table tr {
    background-color: transparent;
    color: #fff;
    font-size: 14px;
    padding: 16px 6px;
    white-space: nowrap;
}

.custom_table {
    border: 1px solid #673ab7;
    border-radius: 10px;
    background: #2F2B42;
    padding: 4px 10px;
}

.custom_table .table-hover>tbody>tr:hover>* {
    background: #673ab726 !important;
}
.print_statement{
    cursor: pointer;
}
/** Payment History **/

/** Generes **/
.genres_card *{
    transition: all .5s;
}
.genres_card img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.genres_card{
    height: 190px;
    position: relative;
    transition: all .5s;
    border: 1px solid #683ab700;
    cursor: pointer;
    border-radius: 5px;
    overflow: hidden;
}
.genres_card label{
    cursor: pointer;
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 16px;
    background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 55%, rgba(0, 0, 0, 0) 100%);
    transition: all .5s;
}
/* .genres_card::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, rgb(0 0 0) 0%, rgb(0 0 0 / 47%) 55%, rgb(0 0 0 / 0%) 100%);
    transition: all .5s; 
    opacity: 0;
} */
.genres_card:hover{
    transform: scale(1.01);
    transition: all .5s;
    border: 1px solid #673AB7;
    box-shadow: 0px 0px 20px #673ab7b5;
}
.genres_card label:hover  {
    background: linear-gradient(90deg, rgb(0 0 0) 0%, rgb(0 0 0 / 47%) 55%, rgb(0 0 0 / 96%) 100%);
}
.genre_movies .owl-stage-outer{
    padding: 18px 18px;
}
/** Genres **/

/*Custom Styles*/


.profile-card-price{
    font-size:4rem!important;
    font-weight: 700;
    text-align: center;
}
.discount-price{
    font-size:2.5rem!important;
    font-weight: 700;
}

.flex-disp-column{
    flex-direction: column;
}

@media screen and (max-width:770px) {
    .flex-disp-column-resp{
        flex-direction: column;
    }
}

.login-dropdown-toggle::after {
    content: none;
}


/*Custom Styles*/