/* Custom Font */

@font-face {
    font-family: Unchained;
    src: url(../fonts/Montserrat-Light.woff2);
    font-weight: 200;
    font-display: swap;
}
@font-face {
    font-family: Unchained;
    src: url(../fonts/Montserrat-Regular.woff2);
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: Unchained;
    src: url(../fonts/Montserrat-Medium.ttf);
    font-weight: 500;
    font-display: swap;
}
@font-face {
    font-family: Unchained;
    src: url(../fonts/Montserrat-Bold.woff2);
    font-weight: 700;
    font-display: swap;
}
@font-face {
    font-family: Unchained;
    src: url(../fonts/Montserrat-ExtraBold.ttf);
    font-weight: 800;
    font-display: swap;
}
@font-face {
    font-family: Unchained;
    src: url(../fonts/Montserrat-Black.woff2);
    font-weight: 900;
    font-display: swap;
}
/* Colours and Style for Bittopia Bootstrap */

a, h1, h2, h3, h4, h5, h6, p.lead, small {
    font-family: Unchained;
}
h1 strong, h1 b, h2 strong, h2 b, h3 strong, h3 b, h4 strong, h4 b, h5 strong, h5 b, h6 strong, h6 b, .h1 strong, .h1 b, .h2 strong, .h2 b, .h3 strong, .h3 b, .h4 strong, .h4 b, .h5 strong, .h5 b, .h6 strong, .h6 b {
    font-weight: 700;
}
h2.section-title strong {
    font-weight: 900;
    font-size: 35px;
}
h6 {
    font-size: 1.3em;
}
p {
    font-size: 1.125em;
    font-family: Unchained;
}
body {
    color: #000;
    transition: background-color 0.5s ease, color 0.5s ease;
}
a { 
    color: inherit; 
} 
a:hover, a:focus {
    color: inherit;
    text-decoration: none;
    outline: none;
}

/* Push the entire body to the right by 200px when the off-canvas menu is active */
body {
  overflow-x: hidden;
}
/* Initially, set the site-wrapper's transform to zero */

#site-wrapper {
  transition: transform 0.1s ease; /* Adjust the duration as needed */
  overflow: hidden;
}

ul {
    list-style-type: disc; /* This changes the bullet points to filled-in discs */
}
/* Custom Scroll Bar */

/* width */
::-webkit-scrollbar {
  width: 12px;
}
/* Track */
::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.9);
}
/* Handle */
::-webkit-scrollbar-thumb {
    background: #0101fe;
    border-radius:10px;
    
}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #0101FE;
}

/* Dark Mode */
button#theme-toggle {
    transition: background-color 500ms ease-out;
    color: #191919;
    border: none;
    font-size: 25px;
    border-radius: 10rem;
    opacity: .8;
    width: 40px;
    height: 40px;
    margin-top: 6px;
}
#theme-toggle i {
    width: 28px;
    height: 23px;
    display: block;
    margin: auto;
}
html[data-theme='dark'] .logo-dark {
    display: block;
}

html[data-theme='dark'] .logo-light {
    display: none;
}
/* Custom navbar categories */
.header-categories {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 150px;
    background-color: #00000085;
    padding: 10px 0;
    width: 100%; /* Make it full width */
    position: absolute; /* Make it fixed to the top */
    top: 120px;
    left: 0;
    z-index: 1000; /* Ensure it stays on top */
    /*overflow-x: auto; /* Enable horizontal scroll */
}

.category {
    text-align: center;
    flex-shrink: 0; /* Prevent shrinking */
    display: inline-block; /* Display as inline block */
    vertical-align: top; /* Align to the top */
    margin-bottom: 20px; /* Add margin between categories */
    width: 16.666%; /* Default width for each category */
    padding: 0 10px; /* Add padding around each category */
    box-sizing: border-box; /* Include padding in the width calculation */
}

.category-icon {
    font-size: 40px;
    margin-bottom: 10px;
    transition: font-size 0.3s ease; /* Add transition for smooth resizing */
}

.category-text {
    color: #FFF;
    font-size: 1em;
    font-weight: 500;
    transition: font-weight 0.3s ease, font-size 0.3s ease; /* Add transition for smooth effect */
    letter-spacing: 0.5px;
}
#partners {
    position: relative;
}
.hw-features {
    font-size: 3.5em;
    font-weight: 500;
}
.features-mid {
    font-weight: 500;
    font-size: 2em !important;
}
.features-large {
    font-weight: 500;
    font-size: 3.5em !important;
}
.hw-features-sub {
    font-size: 1em;
    font-weight: 400;
}
.accordion p {
    font-size: 1.17em;
    font-weight: 500;
    color: #323d47;
}
.scroll-top {
    position: fixed;
    bottom: 100px;
}
.scroll-top-button {
    color: #FFFFFF;
    background-color: #1B2730;
    font-size: 38px;
    font-weight: 600;
    padding: 20px;
}
.scroll-top-button:hover, .scroll-top-button:active, .scroll-top-button:not([disabled]):not(.disabled):active {
    color: #fff;
    background-color: #000;
}

#needhelp {
    background-color: #080EB2;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 900'%3E%3Cpolygon fill='%230918cc' points='957 450 539 900 1396 900'/%3E%3Cpolygon fill='%23300eaa' points='957 450 872.9 900 1396 900'/%3E%3Cpolygon fill='%230b0bc5' points='-60 900 398 662 816 900'/%3E%3Cpolygon fill='%232b0da3' points='337 900 398 662 816 900'/%3E%3Cpolygon fill='%231a0cbe' points='1203 546 1552 900 876 900'/%3E%3Cpolygon fill='%23260d9c' points='1203 546 1552 900 1162 900'/%3E%3Cpolygon fill='%23280db7' points='641 695 886 900 367 900'/%3E%3Cpolygon fill='%23220c96' points='587 900 641 695 886 900'/%3E%3Cpolygon fill='%23350fb1' points='1710 900 1401 632 1096 900'/%3E%3Cpolygon fill='%231e0c8f' points='1710 900 1401 632 1365 900'/%3E%3Cpolygon fill='%234010aa' points='1210 900 971 687 725 900'/%3E%3Cpolygon fill='%231a0b88' points='943 900 1210 900 971 687'/%3E%3C/svg%3E");
    background-attachment: fixed;
    background-size: cover;
}
.card {
    border-radius: 25px;
}
.btn-outline-learn i {
    font-size: 14px !important;
    font-weight: 600;
}
.product-page .p-features
{
    display: inherit;
}
@media (min-width: 960px) {
  .w-75 {
    width: 90%!important;
}
}
@media (min-width: 965px) {
#product-features-small {
    display: none!important;
}
}
@media (max-width: 963px) {
#product-features-large{
    display: none!important;
}
}

/****** Compare Page ******/

.dropdown-item {
    color: #000;
    text-decoration: none;
    font-weight: 500;
    padding: 20px;
    transition: none;
    font-size: 1.3em;

}

.dropdown {
    margin-bottom: 20px;
    background: #FFF;
    padding: 20px;
    border-radius: 5px;
    font-size: 18px;
    font-weight: 400;
    text-align: left;
    cursor: pointer;
    border: 1px solid #E8EAED;
    -webkit-appearance: none;
    width: 100%;
    box-shadow: 0 1px 3px -2px #9098A9;
}

.dropdown-menu {
    padding: 0px;
    font-size: 14px;
    margin-top: 5px;
    border: none;
    box-shadow: 0 2px 25px rgba(0, 0, 0, 0.07);
    width: 100%;
    left: -20px !important;
    top: 21px !important;
}
.dropdown-item.active, .dropdown-item:active, .dropdown-item:hover {
    color: #fff;
    border-color: #0077FF;
    box-shadow: 0 0 0 2px rgba(#0077FF,.2);
    text-decoration: none;
    background-color: #50a1ff;
    border-radius: 2px;
    
}
.dropdown-toggle {
    display: flex;
    align-items: center;
    white-space: nowrap;
    overflow: hidden;
}
.dropdown-toggle .dropdown-text {
    flex: 1; /* Takes up 90% of the width */
    overflow: hidden;
    text-overflow: ellipsis;
}
.dropdown-toggle .dropdown-icon {
    flex: 0 0 10%; /* Takes up 10% of the width */
    text-align: right;
}
.dropdown-toggle::after, .dropup .dropdown-toggle::after {
    width: 10px;
    height: 10px;
    margin-left: 15px;
    border-right: 3px solid;
    border-bottom: 3px solid;
}
.tab-content .p-features {
    display: block!important;
}
@media (min-width: 960px) {
  .tab-content .w-100 {
    width: 50%!important;
}
}
/* Responsive adjustments for smaller screens */
@media (max-width: 768px) {
  .tab-content .w-20 {
    width: 40%!important;
}
.tab-content .btn-outline-learn, .tab-content .btn-outline-getnow {
    font-size: 15px!important;
}
.tab-content .btn {
    padding: 5px!important;
}
.tab-content .w-15 {
    width: 30%!important;
}
.tab-content .w-10 {
    width: 20%!important;
}
#needhelp {
    padding: 20px !important;
    margin: 10px;
}
.tab-content .badge-pop {
    text-wrap: pretty;
    line-height: 21px;
}
.tab-content h5, .h5 {
    font-size: 16px;
    text-wrap: pretty;
}
}

/****** START OF NAV ******/

/* Custom slider for categories */
.slick-prev::before, .slick-next::before {
    width: 10px;
    height: 10px;
}
.slick-prev, .slick-next {
    background-color: transparent!important;
}

/* partner section */
.slick-slide img {
    border-radius: 20px;
}


.chapternav {
    position: absolute;
    top: 42%;
    transform: translateY(-50%);
    z-index: 1;
}

.chapternav-left {
    left: 0;
    border-right: 1px solid #d1d5db;
    width: 33px;
}

.chapternav-right {
    right: 0;
    border-left: 1px solid #d1d5db;
    width: 33px;
}





.partner-text {
    display: block;
    margin-top: 10px;
    font-weight: 600;
}
button.slick-next.slick-arrow {
    border-left: 1px solid #d1d5db38;
    border-radius: 0px;
    width: 24px;
    height: 50px;
    padding-top: 40px;
    padding-bottom: 50px;
}
button.slick-prev.slick-arrow {
    border-right: 1px solid #d1d5db38;
    border-radius: 0px;
    width: 24px;
    height: 50px;
    padding-top: 40px;
    padding-bottom: 50px;
}
/* Product sliders: make each slide behave like a real card */
.slider4 .slick-slide > div,
.slider5 .slick-slide > div,
.slider6 .slick-slide > div,
.slider7 .slick-slide > div {
  height: 100%;
}

.slider4 .slick-slide > div > .align-items-center,
.slider5 .slick-slide > div > .align-items-center,
.slider6 .slick-slide > div > .align-items-center,
.slider7 .slick-slide > div > .align-items-center {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.slider4 .p-features,
.slider5 .p-features,
.slider6 .p-features,
.slider7 .p-features {
  flex: 1;
}

.slider4 .learn-more,
.slider5 .learn-more,
.slider6 .learn-more,
.slider7 .learn-more {
  margin-top: auto;
}
@media (max-width: 991px) {
  .hw-features-sub {
    font-size: 0.9rem;
    opacity: 0.85;
    letter-spacing: 0.2px;
  }
}
@media (max-width: 767px) {
  .eco-phone-img {
    max-height: 450px!important; /* was 700px → ~30% smaller */
  }
}

/******* Benefits slider *******/
/* General Slider Styles */
.slider-phone, .slider-laptop, .slider-router, .slider-cube {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch; /* Ensure all slides stretch to the same height */
}

.slider-phone .slick-slide, .slider-laptop .slick-slide, .slider-router .slick-slide, .slider-cube .slick-slide {
    display: flex;
    align-items: stretch; /* Ensure each slide stretches to the height of the tallest slide */
    transition: transform 0.4s ease;
    box-sizing: border-box; /* Ensure padding and border are included in the element's total width and height */
}

.slider-phone .features-container, .slider-laptop .features-container, .slider-router .features-container, .slider-cube .features-container {
    display: flex;
    flex-direction: column; /* Stack items vertically */
    justify-content: center; /* Center content vertically */
    flex: 1; /* Ensure the container takes the full height of the slide */
    flex: 1 1 100%; /* Default to full width for each item */
}

.slider-phone .slick-current, .slider-laptop .slick-current, .slider-router .slick-current, .slider-cube .slick-current {
    opacity: 1; /* Make the current slide fully opaque */
    transition: transform 0.5s ease;
}

.slider-phone .slick-slide:not(.slick-current), .slider-laptop .slick-slide:not(.slick-current), .slider-router .slick-slide:not(.slick-current), .slider-cube .slick-slide:not(.slick-current) {
    opacity: 0.3; /* Make the non-current slides less opaque */
}

/* Responsive adjustments for smaller screens */
@media (max-width: 768px) {
  .slider-phone .features-container, .slider-laptop .features-container, .slider-router .features-container, .slider-cube .features-container {
    padding: 10px; /* Reduce padding on smaller screens */
  }
}
@media (max-width: 850px) {
    #benefits-left-phone, #benefits-left-laptop, #benefits-left-router, #benefits-left-cube {
    left: 21px!important;
}
    #benefits-right-phone, #benefits-right-laptop, #benefits-right-router, #benefits-right-cube {
    right: 5px!important;
    }
}
@media (max-width: 480px) {
  .slider-phone .features-container, .slider-laptop .features-container, .slider-router .features-container, .slider-cube .features-container {
    padding: 0; /* Remove padding on very small screens */
  }
}

/* General Navigation Button Styles */
.chapternav button {
    font-size: 18px;
    color: #525252;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    outline: none;
    font-size: 21px;
    font-weight: 400;

}

/* Phone Slider Navigation Adjustments */
#benefits-left-phone, #benefits-left-laptop, #benefits-left-router, #benefits-left-cube {
    left: -25px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

#benefits-right-phone, #benefits-right-laptop, #benefits-right-router, #benefits-right-cube {
    right: -35px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    padding-top: 100px;
    padding-bottom: 100px;
}


/***** REVIEW NAV *****/

.slider-reviews .review-container {
    display: flex;
    align-items: stretch;
    justify-content: center;
    flex-direction: column;
    height: 100%; /* Ensure each container takes the full height of the slider */
    padding: 30px;
    box-sizing: border-box;
}

.slider-reviews .card {
    display: flex;
    flex-direction: column;
    height: 100%; /* Ensure the card takes the full height of the container */
    padding: 20px;
}

.slider-reviews .card-body {
    display: flex;
    flex-direction: column;
    flex: 1;
    text-align: left;
}

.slider-reviews .card-body .text-quoted {
    flex: 1; /* Allow the text to take up available space */
    font-weight: 400;
}
.text-lighter {
    color: #525252!important;
}
.media-body.lh-1 {
    text-align: center;
}
.rating {
    display: flex;
    justify-content: center; /* Center the stars horizontally */
    align-items: center; /* Center the stars vertically */
}
/* Review section navigation styles */
.review-nav {
    top: 50%; /* Adjust the vertical position as needed */
    transform: translateY(-50%);
    z-index: 1;
}


/* Adjust the left navigation button */
.review-nav.chapternav-left {
    left: -10px; /* Adjust the left position as needed */
    border: none;
}

/* Adjust the right navigation button */
.review-nav.chapternav-right {
    right: -5px; /* Adjust the right position as needed */
    border: none;
}

/* Font Awesome icons customization, if needed */
.review-nav-button i {
    font-size: 20px; /* Adjust icon size as needed */
    color: #525252; /* Adjust icon color as needed */
    padding-top: 100px;
    padding-bottom: 100px;
}

/****** END OF NAV ********/

/****** START OF SLIDER2 ********/
.slider-affiliate {
    position: relative;
    z-index: 0;
    width: 97%;
    margin: auto;
    display: inline-block; /* Ensure each item in the slider is inline */
}

.slider-affiliate .slick-slide {
  padding: 15px; /* Adjust padding as needed */
  margin-right: 7px; /* Adjust margin between slides */
}

/* Ensure the slider container has enough width to show partial slides */
.slider-affiliate {
  padding: 0; /* No padding to ensure the first slide aligns to the left edge */
  overflow: hidden; /* Hide overflow to ensure no unwanted slides are visible */
}

/* Adjust the width of the slider items */
.slider-affiliate .slick-slide {
  margin-right: 0; /* No margin-right to show part of the next slide */
}

/* Ensure the first item is fully visible */
.slider-affiliate .slick-slide:first-child {
  margin-left: 0; /* No margin on the left for the first slide */
}

/* Show part of the next slide by adjusting the slider's margin or padding */
.slider-affiliate .slick-list {
  margin-right: -100px; /* Adjust this value to show part of the next slide */
}


@media (min-width: 600px) {
.chapternav.aff-nav button {
    padding: 20px;
    background: #FFF;
    height: 150px;
}
}
@media (max-width: 599px) {
.chapternav.aff-nav button {
    padding: 10px;
    background: #FFF;
    height: 130px;
    width: 32px;
}
}

/****** END OF SLIDER2 ********/

/****** START OF SLIDER4 ********/
.chapternav.p-nav {
    top: 60%;
}
.chapternav-left.p-nav {
    width: 45px;
}
.chapternav-right.p-nav {
    width: 45px;
}
.chapternav.p-nav button {
    padding: 17px;
    padding-top: 50px;
    padding-bottom: 50px;
}
@media (min-width: 992px) {
.chapternav-left.p-nav, .chapternav-right.p-nav {
    display: none!important;
}
}
@media (max-width: 992px) {
.p-features {
        display: none;
    }
}

/****** END OF SLIDER4 ********/

/****** Recommend Slider *****/

.chapternav.rec-nav {
    top: 60%;
}
.chapternav-left.rec-nav {
    width: 45px;
}
.chapternav-right.rec-nav {
    width: 45px;
}
.chapternav.rec-nav button {
    padding: 17px;
    padding-top: 50px;
    padding-bottom: 50px;
}
/****** END OF RECOMMEND ********/
#consult strong {
    font-weight: 500;
}
#consult h4 {
    font-weight: 600;
}
@media (min-width: 1205px) {
    .category:hover .category-text {
    font-size: 1.1em;
}
}
@media (max-width: 1200px) {
    .category {
        margin: 0;
    }
    .category-icon {
        font-size: 35px;
    }
    .category-text {
        font-size: 0.9em;
    }
}

@media (max-width: 992px) {
    .category {
        margin: 0;
    }
    .category-icon {
        font-size: 30px;
    }
    .category-text {
        font-size: 0.8em;
    }
    .header-categories {
    height: 115px;
    }
}

@media (max-width: 768px) {
    .category {
        margin: 0;
    }
    .category-icon {
        font-size: 25px;
    }
    .category-text {
        font-size: 0.8em;
    }
    .header-categories {
    height: 115px;
    }
}

@media (max-width: 576px) {
    .category {
        margin: 0;
    }
    .category-icon {
        font-size: 20px;
    }
    .category-text {
        font-size: 0.8em;
    }
    .header-categories {
    height: 115px;
    }
}
/* END Custom navbar categories */

.modal {
    z-index: 20000000000;
}
.modal .close {
    font-weight: 400;
    font-size: 33px !important;
    border-radius: 50%;
    color: #000 !important;
    padding: 8px;
    margin-top: -6px;
    background: #FFF!important;
}
.product-3 .badge-pos-left, .product-3 .badge-pos-right {
    top: 0.5rem;
}
/* New Home header sub */
h3#introsub {
    margin-top: 20px;
}
h6#established {
    margin-top: -10px!important;
}
.nav-link {
    color: #404040;
    font-weight: 400;
}
.header.h-fullscreen {
    padding-top: 160px;
}
.headerintro {
    color: #fff;
    font-weight: 800;
    outline-width: thin;
    font-size: 90px;
    letter-spacing: 4px;
}
.highlight {
    color: #fff;
    font-weight: 800;
    outline-width: thin;
    font-size: 90px;
}
.header-scrolled [data-navbar="sticky"] {
    height: 90px;
}
.btn-menu {
    font-size: 14px;
    color: #fff;
}
.btn-menu:hover, .btn-menu:active, .btn-menu-active {
    text-decoration: none;
    border-left: 5px solid #0101FE;
    color: #FFF;
    left: -5px;
}
.btn-menu-active .fas {

}
.btn-getnow {
    color: #FFFFFF;
    background-color: #1B2730;
    font-size: 38px;
    font-weight: 600;
    padding: 5px 40px 5px 40px;
    border-radius: 100px;
}
.btn-getnow:hover, .btn-getnow:active, .btn-getnow:not([disabled]):not(.disabled):active {
    color: #fff;
    background-color: #000;
    border: 2px solid #FFF;
}
.btn-info {
    color: #FFFFFF;
    background-color: #1B2730;
    font-size: 21px;
}
.offcanvas.show {
    overflow: auto;
}
.navbar-brand img {
    max-height: 70px;
}
.nav-navbar .nav-link {
    font-size: 1em;
}
.btn-info:hover, .btn-info:active, .btn-info:not([disabled]):not(.disabled):active {
    color: #fff;
    background-color: #000;
    border: 2px solid #FFF;
}
.rating label.active {
    color: #ffba00;
    font-size: 23px;
}
.social a {
    display: table;
    width: 100%;
    text-align: left;
}
p.reviews {
    font-weight: 400;
}
#reviews img {
    border-radius: 25px !important;
}
.accordion-connected {
    border-color: #d1d5db;
    border-radius: 25px;
}
img.apps {
    width: 80px;
}
.bg-app {
    background-color: #eaeff4;
}
.section-header h2 {
    font-size: 50px;
    font-weight: 900;
}
.section-header p.lead {
    font-size: 1.8em;
}
p.lead2 {
    font-size: 1.15em;
    font-weight: 400!important;
}
.lead-2 {
    font-size: 1.15em;
    font-weight: 400!important;
}
.features .lead-2 {
    font-size: 1.15em;
    font-weight: 500!important;
    color: #323d47;
}
.features i, .features h6 {
    color: #0101FE;
}
ul.benefits li {
    font-size: 1.15rem !important;
    margin: 15px 0;
}
.btn-outline-getnow {
    color: #0101FE!important;
    background-image: none;
    border: 1px solid #0101FE;
    font-size: 18px;
    padding: 5px;
    display: inline-block;
}
.btn-outline-learn {
    color: #FFF!important;
    background-color: #0101FE;
    background-image: none;
    border-color: #0101FE;
    font-size: 18px;
    padding: 10px;
}
.btn-outline-pre {
    color: #FFF;
    background-color: #063E60;
    background-image: none;
    border-color: #063E60;
    font-size: 18px;
    padding: 10px 20px 10px 20px;
}
.btn-outline-learn:hover, .btn-outline-learn:active {
    color: #FFF!important;
    background-color: #0101FE;
    border-color: #0101FE;
}
mark, .mark {
    padding: .2em;
    background-color: #000;
    color: #fff;
    border-radius: 3px;
}
h2 mark {
    border-radius: 10px;
}
.text-muted {
    font-size: 15px;
}
.feature-icon img {
    width: 100px;
}

/* Phones */
#phone:hover img {
    transform: scale(1.01);
}
#phone img {
    transition: all 0.3s;
}

/* Laptops */
#laptop:hover img {
    transform: scale(1.01);
}
#laptop img {
    transition: all 0.3s;
}
/* Laptops */
#cube:hover img {
    transform: scale(1.01);
}
#cube img {
    transition: all 0.3s;
}

/* pre-products */

.product-pre {
    position: relative;
    display: block;
    padding: 1rem 1.25rem;
    background-color: #fcfdfe;
    color: #757575;
}
.product-2:hover img {
    transform: scale(1.01);
}
.product-2 img {
    transition: all 0.3s;
    max-height: 400px;
}

s.pre {
    color: #fff;
    font-size: 16px;
    background: #3cd458;
}
/* promo colors */

.product-2 .product-media, .product-2 .product-media:hover {
    background-color: transparent;
}

.badge-pop {
    color: #000;
    font-family: Unchained;
    font-size: 17px;
    font-weight: 500;
    margin-bottom: 15px;
}
.badge-secondary {
    color: #fff;
    background-color: #3CD458;
    font-family: Unchained;
    font-size: .9375rem;
    margin-bottom: 15px;
    min-width: 50%;
}
.badge-third {
    color: #fff;
    background-color: #868e96;
    font-family: Unchained;
    font-size: .9375rem;
    margin-bottom: 15px;
    min-width: 50%;
}

/* features box */
/* Parent container */
.features-container {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%; /* Ensure it takes the full width of its parent */
    box-sizing: border-box;
    text-align: left;
    padding: 20px; /* Add padding as needed */
    flex-direction: column; /* Ensure content is stacked vertically */
}
/* Feature boxes */
.features {
    box-shadow: rgba(14, 63, 126, 0.06) 0px 0px 0px 1px, rgba(42, 51, 70, 0.03) 0px 1px 1px -0.5px, rgba(42, 51, 70, 0.04) 0px 2px 2px -1px, rgba(42, 51, 70, 0.04) 0px 3px 3px -1.5px, rgba(42, 51, 70, 0.03) 0px 5px 5px -2.5px, rgba(42, 51, 70, 0.03) 0px 10px 10px -5px, rgba(42, 51, 70, 0.03) 0px 24px 24px -8px;
    padding: 35px;
    box-sizing: border-box; /* Ensure padding and border are included in the element's total width and height */
    margin: 5px; /* Adjust margins for spacing */
    font-weight: 400;
    border-radius: 25px;
    background-color: #ecf2ff;
    max-width: 100%; /* Ensure the content fits within the container */
}
.features strong {
    font-weight: 600;

}
.features h6 {
    font-size: 1.6em;
}
/* Ensure all feature boxes have the same height */
.features {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    height: 100%;
}

/* Add additional styles for responsive design if needed */
@media (max-width: 768px) {
    .features {
        flex: 0 1 calc(100% - 20px); /* Stacks the boxes in one column on smaller screens */
    }
    /* Feature boxes */
.features {
    padding: 15px;
}
.features .lead-2 {
    font-size: 16px!important;
}
}



/* various screen sizes */

@media (max-width: 1199.98px) { /* Mobile Only */
.navbar-expand-xl .navbar-mobile {
    background-color: rgba(0,0,0,0.9);   
}
.backdrop-navbar {
    background-color: transparent;
}
.navbar-expand-xl .nav-navbar:not(.nav-inline)>.nav-item>.nav-link, .navbar-expand-xl .nav-navbar:not(.nav-inline)>.nav-link {
    font-size: 1.6rem;
    color: #fff!important;
}
.navbar-expand-xl .nav-navbar:not(.nav-inline)>.nav-item>.nav {
    background-color: transparent;
}
.navbar-expand-xl .nav-navbar .nav .nav-link {
    font-size: 1.6rem;
}
.navbar-toggler-icon {
    width: 50px;
    height: 50px;
}
.navbar-open .navbar .nav-navbar>.nav-link:hover .nav-link:active, .nav-navbar .nav .nav-link {
    color:#FFF;
}
body.body-scrolled.navbar-scrolled i.fas.fa-bars {
    color: #000!important;
}
.btn-label {
    padding-left: 40px;
}
}
@media (max-width: 1302px) {
.btn-circle.btn-lg {
    width: 50px;
    height: 50px;
}
h6.divider.mt-7.lead-2 {
    font-size: 14px!important;
    font-weight: 900;
    color: #FFF;


}
}

@media (min-width: 992px) {
#phone {
    margin: 10px;
    max-width: 31%;
    padding-top: 20px;
    padding-bottom: 30px;
    text-align: center;
}
#three.btn-outline-getnow {
    margin-top: 15px;
}
}
@media (min-width: 992px) {
#laptop {
    padding-top: 20px;
    padding-bottom: 30px;
    text-align: center;
}
}
@media (min-width: 992px) {
.h-fullscreen, .h-100vh {
    height: 90vh !important;
}
}
#home {
    background-image: url(../../assets/img/bg/background.jpeg);
    z-index: 1;
}
#home::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5); /* Dark overlay */
    backdrop-filter: blur(15px); /* Blur effect */
    -webkit-backdrop-filter: blur(10px); /* For Safari */
    z-index: -8;
}
@media (max-width: 1200px) {
#home {
    background-image: url(../../assets/img/bg/background.jpeg);
}
.rounded-lg {
    width: 90%;
}
}
/* For Mobile - large screen */
@media (max-width: 890px) {
#home {
    background-color: #5E41FF;
    height: 100%;
}
#main-intro {
    font-size:24px!important;
} 
.highlight {
    font-size: 55px;
}
.category-text {
    font-size: 0.8em;
}    
.headerintro {
    color: #fff;
    font-weight: 800;
    outline-width: thin;
    font-size: 43px;
    letter-spacing: 4px;
    margin-top: 9rem!important;
}
.btn-getnow {
    background-color: #0101FE;
    font-size: 30px;
    padding: 5px 40px 5px 40px!important;
}
h3#introsub {
    margin-top: 5px;
    font-size: 16px;
}

.header.h-fullscreen {
    padding-top: 120px;
}
.section-header h2 {
    font-size: 26px;
}
.rounded-lg {
    border-radius: 0.75rem !important;
    width: 95%;
}
ul.benefits li {
    font-size: 16px;
}
.section-header p.lead {
    font-size: 1em;
}
section#phones .align-items-center {
    text-align: center;
}
.list-unstyled {
    text-align: left;

    padding-right: 2rem;
}
div#phone {
    padding-bottom: 3em;
}
.btn-menu {
    font-size: 14px;
    border-bottom: 2px solid #FFE;
    font-weight: 600;
    text-transform: capitalize;
    color: #fff;
    width: 70%;
    border: none!important;
}
.btn-label {
    padding-left: 50px!important;
    text-align: left;
}
.btn label {
    font-size: 20px!important;
}
.btn {
    padding: 10px 20px 10px 20px;
    margin: 5px;
}
}
.text-muted {
    color: #000!important;
}
/* For Mobile - smaller */
@media (max-width: 850px) {

.section-header p.lead {
    font-size: 1.6em;
}
.partner-text {
    font-size: 10px;
}
.btn-desktop {
    display: none;
}
.chapternav {
    top: 45%;
}
.features h6 {
    font-size: 1.7em;
}
/* Adjust the left navigation button */
.review-nav.chapternav-left {
    left: 15px; /* Adjust the left position as needed */
    border: none;
}

/* Adjust the right navigation button */
.review-nav.chapternav-right {
    right: 0px; /* Adjust the right position as needed */
    border: none;
}

}

/* For Mobile - smaller */
@media (max-width: 985px) {
    .section-header h2 {
    font-size: 63px;
}
    .p-features {
    display: none;
        }
    .btn-desktop {
    display: none;
    }
    .navbar-brand img {
    width: 187px;
}
    button.navbar-toggler i {
    font-size: 2.5rem !important;
    }    
}
/* For Mobile - smaller */
@media (max-width: 800px) {
    .section-header h2 {
    font-size: 42px;
}
}
/* For Mobile - smaller */
@media (max-width: 530px) {
    #consult-icon {
    display: none;
    }
}
/* For Mobile - smaller */
@media (max-width: 576px) {
    .rounded-lg {
    width: 100%;
}
}
/* For Mobile - smaller */
@media (max-width: 428px) {
    .section-header h2 {
    font-size: 36px;
}
}