@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@200;300;400;500;600;700;800&display=swap");

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

html,
body {
    overflow-x: hidden;
}

body {
    background: #0f1219;
    font-family: "Manrope", sans-serif;
    font-size: 16px;
}

a {
    text-decoration: none;
}

img {
    max-width: 100%;
}

.navbar-toggler-icon {
    filter: grayscale(0%) brightness(100);
}

.btn.btn-primary {
    background-color: #ed1c24;
    border-radius: 5px;
    border: 1.3px solid #ed1c24;
    padding: 7px 10px;
    color: #fff;
    font-family: Manrope;
    font-size: 18px;
    font-weight: 600;
    transition: all 0.3s ease;
}

.btn.btn-primary:hover {
    background-color: #0f1219;
    color: #ed1c24;
}

.btn.btn-secondary {
    background-color: #272a30;
    border-radius: 5px;
    border: 1.3px solid #272a30;
    padding: 7px 10px;
    color: #fff;
    font-family: Manrope;
    font-size: 18px;
    font-weight: 600;
    transition: all 0.3s ease;
}

.btn.btn-secondary:hover {
    background-color: #0f1219;
}

.disclamer-container {
    border-radius: 23.774px;
    border: 1.23px solid rgb(255 0 0 / 60%);
    background: rgb(231 17 17 / 4%);
    backdrop-filter: blur(2.5px);
}

.disclamer-container {
    border-radius: 23.774px;
    border: 1.23px solid rgb(255 0 0 / 60%);
    background: rgb(231 17 17 / 4%);
    backdrop-filter: blur(2.5px);
}

.medium_heading {
    color: #fff;
    font-family: "SF Pro Rounded";
    font-size: 24px;
    font-weight: 700;
    line-height: 130%;
}

.para_text {
    color: #fff;
    font-family: Manrope;
    font-size: 15px;
    font-weight: 400;
    line-height: 178%;
}

/* header css */
header {
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(255, 255, 255, 0.02);
}

header .navbar-nav .nav-item .nav-link {
    padding: 40px 15px;
    color: #fff;
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    line-height: 100%;
    position: relative;
}

header .navbar-nav .nav-item .nav-link.active::before {
    content: "";
    background: linear-gradient(
        360deg,
        #ed1c24 0.44%,
        rgba(237, 28, 36, 0) 92.5%
    );
    width: 100%;
    height: 3px;
    position: absolute;
    bottom: 0%;
    left: 0;
}

header .header-btn {
    border-radius: 20px;
    background: #ed1c24;
    color: #fff;
    font-weight: 800;
    padding: 14px 15px;
}

header .header-btn:hover {
    color: #fff;
}

.header-profile-icon {
    width: 26px;
    height: 26px;
    background-color: #fff;
    color: #ed1c24;
}

.header-profile-icon:before {
    box-shadow: 0 0 0 rgba(255, 255, 255, 0.2);
    animation: pulso 2s infinite;
    transition: 0.5s;
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    border-radius: 50%;
    top: 0;
    bottom: 0;
    margin: auto;
}

@keyframes pulso {
    0% {
        -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.8);
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.8);
    }

    70% {
        -moz-box-shadow: 0 0 0 20px rgba(255, 255, 255, 0);
        box-shadow: 0 0 0 20px rgba(255, 255, 255, 0);
    }

    100% {
        -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    }
}

.section-padding {
    padding: 80px 0;
}

/* banner section css */
.home-banner-section {
    background-image: url("../images/bannerbg.png");
    min-height: 90vh;
    background-size: cover;
    background-repeat: no-repeat;
    overflow: hidden;
}

.home-banner-section h1 {
    color: #fff;
    text-align: center;
    font-family: "SFRounded";
    font-size: 109px;
    font-style: normal;
    font-weight: 900;
    line-height: 100%;
}

.home-banner-section .sub-text {
    font-size: 35px;
    font-weight: 600;
}

.home-banner-section h1 span,
.section_heading span {
    color: #ed1c24;
}

.home-banner-section .banner_tv_lists {
    border-radius: 40px;
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(2.5px);
}

.tv_lists_inner {
    width: 72px;
    min-width: 72px;
    height: 72px;
    border-radius: 20px;
    background: #fff;
}

.tvs_lists li p {
    font-size: 18px;
}

.centered_div {
    transform: translate(-50%, -50%);
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 960px;
}

.home-banner-section::before {
    position: absolute;
    content: url("../images/banner-shadow.png");
    bottom: -140px;
    left: 0;
    width: 100%;
}

.section_heading {
    font-family: "SFRounded";
    font-size: 40px;
    font-weight: 700;
}

.section_para {
    font-weight: 300;
}

.section_para span {
    color: #ed1c24;
}

.text-justify {
    text-align: justify;
}

/* about section css */
.about_section::after {
    position: absolute;
    border-radius: 497px;
    background: rgba(254, 0, 0, 0.15);
    filter: blur(137px);
    right: 0;
    top: 0;
    content: "";
    width: 40%;
    height: 100%;
}

.about_section_content {
    border-radius: 23.774px;
    border: 1.23px solid rgba(255, 255, 255, 0.09);
    background: rgba(255, 255, 255, 0.04);
    backdrop-filter: blur(2.5px);
}

.about_section_content h3 {
    font-size: 16px;
    font-weight: 700;
}

.about_section_content p {
    font-size: 12px;
    font-weight: 300;
    line-height: 1.8;
}

/* features section css */
.features_section {
    background-image: url("../images/features-bg.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center right;
    overflow-x: hidden;
}

.marquee-container-wrapper .outer_marquee_div {
    background-color: rgba(255, 255, 255, 0.04);
    border: 1.23px solid rgba(255, 255, 255, 0.09);
    border-radius: 23px;
}

.marquee-container-wrapper ul.outer_marquee_div > li:last-child {
    margin-right: -100px;
}

.marquee-container-wrapper ul.outer_marquee_div > li ul > li:not(:last-child) {
    margin-bottom: 20px;
}

.marquee-container-wrapper ul.outer_marquee_div > li ul > li span {
    min-width: 29px;
    height: 29px;
    background-color: #ed1c24;
}

.marquee-container-wrapper ul.outer_marquee_div > li::before {
    content: "";
    position: absolute;
    border-radius: 10px 0px 0px 10px;
    background: #ed1c24;
    width: 6px;
    height: 97px;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}

/* smaters pro section */

.smaterpro_tabs {
    margin-bottom: 50px;
}

.smaterpro_tabs.nav-pills .nav-link {
    font-size: 18px;
    font-weight: 600;
    background-color: #1c1e22;
    width: 222px;
    height: 55px;
    border-radius: 10px;
    color: #fff;
}

.smaterpro_tabs.nav-pills .nav-link.active,
.smaterpro_tabs.nav-pills .show > .nav-link {
    background: #ed1c24;
}

.smarterpro_list li {
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.04) 0%,
        rgba(255, 255, 255, 0) 100%
    );
    border: 1.5px solid rgba(255, 255, 255, 0.09);
    border-radius: 23px;
    min-width: 160px;
}

.smarterpro_list li h4 {
    color: #ed1c24;
    font-size: 18px;
    font-weight: 700;
}

.smarterpro_list li p {
    font-size: 15px;
    font-weight: 400;
}

.smart_tv_Screen_image::before {
    position: absolute;
    content: url("../images/shape.png");
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: -1;
}

.premium-feature-div {
    border-radius: 30px;
    background: #1b1c24;
    border: 1.3px solid rgba(255, 255, 255, 0.1);
}

.premium-feature-div h4 {
    font-family: "SFRounded";
    font-size: 25px;
    font-weight: 700;
    padding-top: 30px;
}

.premium-feature-div li:not(:last-child) {
    border-bottom: 1.3px solid rgba(255, 255, 255, 0.1);
}

.premium-feature-div li span {
    min-width: 29px;
    height: 29px;
    background-color: #ed1c24;
}

.premium_btn {
    border-radius: 10px;
    background: #ed1c24;
    font-size: 18px;
    font-weight: 800;
}

.premium-feature-div::before {
    position: absolute;
    content: "";
    width: 90%;
    height: 100%;
    border-radius: 30px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: #24252d;
    z-index: -1;
    top: -39px;
    left: 50%;
    transform: translateX(-50%);
}

.premium-feature-div::after {
    position: absolute;
    content: "";
    width: 80%;
    height: 100%;
    border-radius: 30px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: #1b1c24;
    z-index: -2;
    top: -70px;
    left: 50%;
    transform: translateX(-50%);
}

.howit_work_section {
    background-image: url("../images/how_workbg.png");
    background-size: cover;
    background-repeat: no-repeat;
}

.howit_work_section::before {
    position: absolute;
    content: url("../images/dotted_line.png");
    left: 50%;
    transform: translate(-50%, -50%);
    top: 50%;
    z-index: -1;
}

/* how it work section css */
.howit_work_section .smaterpro_tabs.nav-pills .nav-link {
    width: -webkit-fill-available;
}

.tabs_steps_wrapper {
    background-color: #161920;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 30px;
    min-height: 300px;
}

.tabs_steps_wrapper .steps_count {
    border-radius: 10px;
    background: #2d3036;
    font-size: 22px;
    font-weight: 600;
}

.tabs_steps_wrapper::after {
    position: absolute;
    content: url("../images/steps_box.png");
    bottom: -7px;
    right: 0;
}

.howit_work_section .step_lists:nth-child(even) {
    margin-top: 70px;
}

/* download section css */
.download_version {
    border-radius: 28px;
    border: 1.4px solid rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.05);
}

.download_version .form-control {
    border-radius: 9.31px;
    background: rgba(255, 255, 255, 0.03);
    border: 0;
    color: #fff;
    height: 50px;
    padding-left: 30px;
}

.download_version h3 {
    font-size: 20.481px;
    font-weight: 600;
    line-height: 1.6;
}

.new_version_btn {
    background-color: #ed1c24;
    border-radius: 5px;
    border: 0;
    top: 6px;
    right: 6px;
    padding: 7px 10px;
}

.download_version .search-icon {
    position: absolute;
    top: 50%;
    left: 10px;
    transform: translateY(-50%);
    color: #fff;
}

.downloads_platform {
    border-radius: 22px;
    border: 1.4px solid rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.05);
}

.downloads_platform .download-content h4 {
    font-size: 13.034px;
    font-weight: 500;
}

.downloads_platform .download-content p {
    font-size: 23.274px;
    font-weight: 700;
}

.mobile_img_wraper::after {
    position: absolute;
    content: url("../images/big-circle.png");
    bottom: -7px;
    right: -99px;
    z-index: -1;
}

.mobile_img_wraper::before {
    position: absolute;
    content: url("../images/small-circle.png");
    top: -37px;
    left: -41px;
    z-index: -1;
}

/* .screenshots_section::after {
    content: url('../images/screenshotIntersect.png');
    position: absolute;
    width: 100%;
    bottom: -10px;
    right: 0%; 
    z-index: 10;
}

.screenshots_section::before {
    content: url('../images/screenshotIntersect.png');
    position: absolute;
    width: 100%;
    bottom: -10px;
    left: 0%; 
    z-index: 10;
} */

.screenshots_section .swiper-button-next,
.screenshots_section .swiper-button-prev {
    display: none;
}

.screenshots_section .swiper-slide img.single_screenshot {
    width: 100%;
}

/* Footer css start here  */

.iptv_footer .links_footer {
    background-image: url("../images/footer_bg.png");
    background-position: right;
    background-repeat: no-repeat;
    background-size: cover;
}

.iptv_footer .links_footer .border-end {
    border-color: #ffffff19 !important;
}

.iptv_footer .links_footer .footer_link_heading {
    color: #fff;
    font-size: 17px;
    font-weight: 500;
    line-height: 172%;
    margin-bottom: 45px;
}

.iptv_footer .links_footer .link-list li a {
    color: #bbb;
    font-size: 13px;
    font-weight: 400;
    line-height: 172%;
    margin-bottom: 12px;
    display: block;
}

/* Footer css ends here  */

.blog-search-section {
    background-image: url(../images/blog-search-bg.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 100px 0;
}

.top-section::before {
    position: absolute;
    content: url(../images/banner-shadow.png);
    bottom: -140px;
    left: 0;
    width: 100%;
    z-index: 0;
}

.blog-search-section .top-section-heading {
    font-size: 59px;
    font-family: SF Pro Rounded;
    font-weight: 700;
    line-height: 100%;
}

.blog-search-section .top-section-heading .text-red {
    color: #ed1c24;
}

.blog-list .single-blog-card {
    border-radius: 23.774px;
    border: 1.23px solid rgba(255, 255, 255, 0.09);
    background: rgba(255, 255, 255, 0.04);
    backdrop-filter: blur(2.0494539737701416px);
    margin-bottom: 100px;
}

.blog-img {
    height: 450px;
    width: 100%;
    object-fit: cover;
    margin: -35px 0;
    border-radius: 20px;
}

.blog-list .single-blog-card .blog-heading {
    color: #fff;
    font-family: SF Pro Rounded;
    font-size: 26px;
    font-weight: 700;
    line-height: 130%;
}

.blog-list .single-blog-card .readmore {
    color: #ed1c24;
    font-family: Manrope;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
}

.blog-discription {
    color: #fff;
    text-align: justify;
    font-family: Manrope;
    font-size: 15px;
    font-weight: 400;
    line-height: 178%;
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.blog-list .single-blog-card .date_text {
    color: #fff;
    text-align: justify;
    font-family: Manrope;
    font-size: 15px;
    font-weight: 400;
    line-height: 178%;
}

.blog-list .single-blog-card .date_text span {
    color: #ed1c24;
}

.faq-search-section {
    background-image: url(../images/faq_search_bg.png) !important;
}

.contact-search-section {
    background-image: url(../images/contact_us_bg.png) !important;
}

.faq-section .faq_container,
.faq-section .faq_container .accordion-body {
    border-radius: 23.774px;
    border: 1.23px solid rgba(255, 255, 255, 0.09);
    background: rgba(255, 255, 255, 0.04);
    backdrop-filter: blur(2px);
    padding: 35px;
}

.faq-section .faq_container .accordion-item {
    background-color: transparent;
    color: #fff;
    border: transparent;
    border-bottom: 1px solid #ffffff13;
}

.faq-section .faq_container .accordion-button:not(.collapsed),
.faq-section .faq_container .accordion-button {
    background-color: transparent;
    box-shadow: none;
    color: #fff;
    font-family: "SF Pro Rounded";
    font-size: 24px;
    font-weight: 700;
    line-height: 130%;
    gap: 5px;
}

.faq-section .faq_container .accordion-button::after {
    background-image: url("../images/accordian_after.png");
}

.faq-section .faq_container .accordion-button:not(.collapsed)::after {
    transform: rotate(-45deg);
}

.contactUs_section .contact_container {
    border-radius: 23.774px;
    border: 1.23px solid rgba(255, 255, 255, 0.09);
    background: rgba(255, 255, 255, 0.04);
    backdrop-filter: blur(2px);
}

.contactUs_section .contact_container .bg-red {
    border-radius: 20px 0px 0px 20px;
    background: #ed1c24;
}

.contactUs_section .img-section {
    min-height: 500px;
    height: 100%;
}

.contactUs_section .img-section .contact-us-img {
    position: absolute;
    max-height: 500px;
    object-fit: contain;
    bottom: -5px;
    right: -5px;
}

.contactUs_section .contact-us-form {
    padding: 30px;
}

.contactUs_section .contact-us-form .heading_connect {
    color: #fff;
    font-family: Manrope;
    font-size: 36px;
    font-weight: 700;
    line-height: 100%;
}

.contactUs_section .contact-us-form .form-label {
    color: #5b5b5b;
    font-family: Manrope;
    font-size: 14px;
    font-weight: 500;
    line-height: 130%;
}

.contactUs_section .contact-us-form .form-control {
    border-radius: 15px;
    border: 1px solid rgba(255, 255, 255, 0.13);
    background: rgba(255, 255, 255, 0.03);
    padding: 15px;
    color: #fff;
}

/* blog detail page css */
.common-banner .heading {
    font-family: "SFRounded";
    font-size: 59px;
    font-weight: 700;
}

.blog_detail_outer_div {
    background-color: rgba(255, 255, 255, 0.03);
    stroke-width: 1.23px;
    border: 1.2px solid rgba(255, 255, 255, 0.09);
    border-radius: 30px;
}

.blog_columns_divided {
    column-count: 2;
    column-gap: 40px;
}

.conclusion_div h4 {
    color: #ed1c24;
    font-family: "SF Pro Rounded";
    font-size: 26px;
    font-weight: 700;
}

.mainlogin_bg {
    /* background: #f5f6fa; */
    height: 100vh;
    overflow: hidden;
}
.login-bg-container {
    background-image: url("../images/bannerbg.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100%;
    width: 100%;
}

.login-bg-container::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(8px);

}
.login-container {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    max-width: 500px;
    transform: translate(-50%, -50%);
    border-radius: 10px;
    background: rgba(245, 246, 250, 0.1);
    box-shadow: 0px 4px 40px 22px rgb(0 0 0 / 6%);
    /* backdrop-filter: blur(5px); */
    padding: 30px 0;
    z-index: 9;
}
.login_section {
    max-width: 500px;
}
.login_section .form-label {
color: #fff;
}
.login_section .form-control {
    background-color: rgb(250 250 250 / 20%) !important;
    color: #fff !important;
    border: 0 !important;
    height: 50px;
}
.login_section .form-control::placeholder {
    color: #fff;
}