:root {
    --tv-white: #fff;
    --tv-dark: #212121;
    --tv-teal:#007874;
    --font-w-medium: 500;
    --font-w-semi: 600;
    --font-w-bold: 700;
    --font-family-inter: "Inter", sans-serif;
    --font-family-roboto: "Roboto", sans-serif;
}

.roboto-regular {
    font-family: var(--font-family-roboto);
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

.inter-regular {
    font-family: var(--font-family-inter);
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

html {
    font-size: 12.5px;
}

@media (min-width: 1680px) {
    html {
        font-size: 16px;
    }
}

.fnt-12 {
    font-size: 12px;
}

body {
    background-color: #F8F9FA;
    font-size: 1.125rem;
    padding: 0;
    margin: 0;
    font-family: var(--font-family-inter);
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

* {
    margin: 0;
    padding: 0;
}

.fnt-medium {
    font-weight: var(--font-w-medium);
}

.fnt-semiBold {
    font-weight: var(--font-w-semi);
}

.fnt-bold {
    font-weight: var(--font-w-bold);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-family-roboto);
}

ul,
li {
    list-style: none;
    padding: 0;
}

a {
    text-decoration: none;
}

/* home page */
.homeBanner {
    background: url(../images/home_banner.svg) no-repeat;
    background-size: cover;
    color: var(--tv-white);
}

.h-contact li {
    padding: 0 24px;
    font-weight: var(--font-w-medium);
}

.h-contact li:first-child {
    border-right: 1px solid var(--tv-white);

    padding-left: 0;
}
.blog-header .h-contact li:first-child {
    border-right: 1px solid #212121;
}
.h-social a {
    color: var(--tv-white);
    font-weight: var(--font-w-semi);
}

.h-social a img {
    width: 2.313rem;
}

.h-social button {
    padding: 0.375rem 1.1rem;
}

.socialBg {
    background-color: var(--tv-white);
    width: 36px;
    height: 36px;
    border-radius: 100%;
    margin-right: 1.5rem;
}
.blog-header .socialBg {
    background-color: #e3fff9;
}
.blog-header .h-social a{
    color: #212121;
}
.navWrap {
    background-color: var(--tv-white);
    border-radius: 24px;
    padding: 6px 40px;
}
.blog-header .navWrap{
    background-color: var(--tv-teal);
}

.navWrap ul li {
    margin: 0 24px;
    position: relative;
    line-height: 54px;
}

.logo {
    height: 54px;
}

.navWrap ul li:first-child a {
    background: url(../images/icons/blog_home.svg) no-repeat;
    background-size: cover;
    height: 18px;
    width: 18px;
    display: inline-block;
    filter: brightness(0) saturate(100%) invert(5%) sepia(14%) saturate(17%) hue-rotate(351deg) brightness(102%) contrast(82%);
    margin-bottom: -2px;
}
.blog-header .navWrap ul li:first-child a {
    filter: unset;
}
.navWrap ul li a {
    color: var(--tv-dark);
    font-weight: var(--font-w-medium);
    position: relative;

}

.navWrap ul li:hover a {
    color: #C7372F;
}

.navWrap ul li.active a {
    color: #C7372F;
    font-weight: var(--font-w-bold);
}
.blog-header .navWrap ul li a {
    color: #fff;
    font-weight: var(--font-w-medium);
    position: relative;

}
.navWrap ul li:first-child.active a {
    background: url(../images/icons/active_home.svg) no-repeat;
    filter: unset;
}
.headingGap {
    padding: 60px 0 36px 0;
}

.sectionGap {
    padding-bottom: 60px;
}

.navWrap ul li.active:after,
.navWrap ul li:hover::after {
    position: absolute;
    left: 0;
    width: 100%;
    height: 6px;
    content: '';
    bottom: -6px;
    background: #C7372F;
    border-radius: 10px 10px 0px 0px;
    opacity: 1;
}

.blog-header .navWrap ul li.active:after,
.blog-header .navWrap ul li:hover::after {
    background: #fff;
}
.navWrap ul li:first-child.active:after {
    display: none;
}

.home-slider h2 {
    font-size: 3rem;
    width: 49%;
}

.home-slider p {
    font-size: 1.5rem;
    width: 44%;
}

.carousel-content-home {
    padding: 80px 144px
        /* padding: 194px 144px */
}

h2 {
    font-size: 3rem;
}

.offer-card {
    background: var(--tv-white);
    border: 1px solid #CCCCCC;
    border-radius: 8px;
    min-height: 200px;
    padding: 24px 32px 12px 24px;
    height: 100%;
}

.offer-card img {
    width: 60%;
}

.workWrap img {
    width: 66px;
}

.offer-card:hover {
    background: var(--tv-teal);
}
.priceOffer .offer-card:hover {
    background: var(--tv-white);
}
.offer-card h5 {
    font-size: 1.5rem;
    font-weight: var(--font-w-medium);
    margin-bottom: 10px;
}

.offer-card p {
    color: var(--tv-dark);

}

.offer-card a {
    font-size: 1.5rem;
    color: var(--tv-teal);
    background: url(../images/icons/chevron_left.png) no-repeat top right;
    background-size: 32px 32px;
    padding-right: 42px;
}

.offer-card:hover h5,
.offer-card:hover p,
.offer-card:hover a {
    color: var(--tv-white);
}

.priceOffer .offer-card:hover h5,
.priceOffer .offer-card:hover p,
.priceOffer .offer-card:hover a {
    color: inherit;
}
.offer-card:hover a {
    background: url(../images/icons/chevron_left-white.png) no-repeat top right;
    background-size: 32px 32px;
}

.rel {
    position: relative;
}

.workBg {
    background: url(../images/work_bg.png) no-repeat;
    background-size: cover;
    min-height: 400px;
}

.workWrap {
    gap: 60px;
    margin-bottom: 60px;
}

.workWrap li {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #0078741A;
    border-radius: 143px;
    opacity: 1;
    width: 236px;
    height: 270px;
    flex-direction: column;
    position: relative;
}

.workWrap li:after {
    content: '';
    position: absolute;
}

.workWrap li:first-child:after {
    background: url("../images/outline_3.png") no-repeat;
    left: -28px;
    top: -22px;
    width: 121%;
    height: 121%;
    background-size: 100% 100%;
}

.workWrap li:nth-child(2):after {
    background: url("../images/outline_4.png") no-repeat;
    left: -43px;
    top: -22px;
    width: 132%;
    height: 117%;
    background-size: 100%;
    background-position: bottom center;
}

.workWrap li:nth-child(3):after {
    background: url("../images/outline_1.png") no-repeat;
    left: -32px;
    top: -26px;
    width: 121%;
    height: 117%;
    background-size: 100%;
    background-position: top center;
}

.workWrap li:nth-child(4):after {
    background: url("../images/outline_2.png") no-repeat;
    left: -47px;
    top: -36px;
    width: 131%;
    height: 126%;
    background-size: 100%;
    background-position: top center;

}

.workWrap li img {
    margin-bottom: 10px;
}

.workWrap li p {
    width: 76%;
    text-align: center;
    font-size: 1rem;
    line-height: 21px;
}

.workWrap li h4 {
    font-size: 1.35rem;
    line-height: 32px;
    position: relative;
    margin-bottom: 24px;
}

.workWrap li h4:after {
    border: 3px solid #F6C542;
    width: 96px;
    content: '';
    position: absolute;
    left: calc(50% - 96px / 2);
    bottom: -10px;
}

.consultation {
    background: url(../images/consultation.svg) no-repeat;
    background-size: cover;
    min-height: 300px;
    color: var(--tv-white);
}

.consultation p {
    font-size: 2.25rem;
}

.consultation h3 {
    font-size: 3rem;
}

.consultation button {
    font-size: 1.5rem;
}

.pricingWrap {
    background: #FFFFFF;
    border: 1px solid var(--tv-teal);
    border-radius: 12px;
    opacity: 1;
    padding: 36px;
    color: var(--tv-dark);
    height: 100%;
    position: relative;
}

.packageName {
    font-size: 1.5rem;
    margin-top: 16px;
}

.amount {
    color: var(--tv-dark);
}

.amount s,
.amount span {
    font-size: 3rem;
}

.fnt-16 {
    font-size: 16px;
}

.priceUser li {
    margin-right: -20px;
    color: var(--tv-teal);
}

.priceUser li img {
    width: 40px;
}

.priceUser li:last-child {
    background: #E3FFF9;
    border-radius: 20px;
    padding: 8px 21px;
}

.pricingWrap button {
    background: var(--tv-teal);
    border-radius: 12px;
    text-align: center;
    width: 100%;
    line-height: 56px;
    color: #E3FFF9;
    border: none;
    margin-top: 6px;
    margin-bottom: 16px;
}

.pricingWrap ul li {
    font-size: 1rem;
    font-family: var(--font-family-roboto);
    color: var(--tv-dark);
    margin-top: 30px;
    background: url(../images/icons/rightFaceMailer.svg) no-repeat 0 1px;
    background-size: 21px;
    padding-left: 31px;
}

.pricingWrap ul li:first-child {
    font-weight: 700;
    color: var(--tv-teal);
    margin-top: 0;
    background: none;
    padding-left: 0;
}

.pricingWrap ul li:nth-child(2) {
    margin-top: 16px;
}

.PopularTag {
    background-color: var(--tv-dark);
    color: var(--tv-white);
    position: absolute;
    top: 50px;
    right: 36px;
    border-radius: 8px;
    padding: 4px 24px
}

/* The switch - the box around the slider */
.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
}

/* Hide default HTML customRadioWrap */
.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

/* The slider */
.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--tv-dark);
    -webkit-transition: .4s;
    transition: .4s;
}

.slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked+.slider {
    background-color: var(--tv-teal);
}

input:focus+.slider {
    box-shadow: 0 0 1px var(--tv-dark);
}

input:checked+.slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

.slider.round:before {
    border-radius: 50%;
}

.lightColor {
    color: #707070;
}
.switchPlan{position: absolute;
    width: 100%;
    white-space: nowrap;
    top: 5px;
    left: 65px;
}
input:checked+.slider+.switchPlan{
    color:var(--tv-teal);
}

.testimonial {
    background: url(../images/feedback.png) no-repeat;
    background-size: cover;
    min-height: 720px;
    color: var(--tv-white);
    font-size: 1.5rem;
    padding: 24px 0;
}

.testimonial h2 {
    width: 267px;
}

.testimonial a {
    position: relative;
    font-weight: bold;
    color: var(--tv-white);
    padding-right: 20px;
}

.testimonial a:after {
    border: solid #fff;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 3px;
    content: '';
    position: absolute;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    top: 10px;
    right: 0;
}

.ratingWrap {
    display: flex;
    justify-content: center;
    gap: 5px;
}

.ratingWrap li {
    background: url(../images/icons/filled-star.svg) no-repeat;
    background-size: 24px;
    height: 24px;
    width: 24px;
}

.fnt-18 {
    font-size: 1.125rem;
}

.fnt-24 {
    font-size: 1.5rem;
}

.fnt-48 {
    font-size: 3rem;
    line-height: 3.938rem;
}

.pt-60 {
    padding-top: 60px;
}

.scrollContentWrap {
    width: 100%;
    overflow: hidden;
}

.scrollContent {
    width: 104%;
    height: 672px;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 24px 24px 24px 0;
}

.flex-direction-column {
    flex-direction: column;
}

.height-100 {
    height: 100%;
}

.masonry {
    column-count: 2;
    column-gap: 24px;
}

.masonry-item {
    break-inside: avoid;
    margin-bottom: 1rem;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    position: relative;
}

.masonry-item img {
    width: 60px;
    display: block;
    position: absolute;
    right: 24px;
    top: 4px;
}

.card-body {
    padding: 1.5rem;
    text-align: left;
}

.card-body p {
    font-size: 1rem;
    color: var(--tv-dark);
}

.card-title {
    color: var(--tv-dark);
    font-size: 1rem;
}

.text-muted {
    color: var(--tv-teal) !important;
    font-size: 1.125rem
}

.homeAccordion .accordion-item {
    border: 1px solid var(--tv-teal) !important;
    border-radius: 12px !important;
    overflow: hidden;
    background: #FFFFFF;
    padding: 0 36px;
}

.homeAccordion .accordion-button {

    border-radius: 0 !important;
    box-shadow: none !important;


    padding: 20px 0;
}

.homeAccordion .accordion-body p:last-child {
    margin-bottom: 0px;
}

.homeAccordion .accordion-button:focus {
    outline: none !important;
    box-shadow: none !important;
}

.homeAccordion .accordion-body {
    background-color: transparent !important;
    border-bottom: none !important;
    padding: 16px 0;
}

.accordion-button::after {
    background-image: none !important;
    border: solid var(--tv-dark);
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 3px;
    content: '';
    position: absolute;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    top: 24px;
    right: 0;
    height: 11px;
    width: 11px;
}

.accordion-button:not(.collapsed)::after {
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
    top: 30px;
}

.homeAccordion .accordion-button:not(.collapsed) {
    background-color: transparent;

    color: var(--tv-teal) !important;
    border-bottom: 1px solid #ccc;
}

.blogWrapper {
    background-color: #E3FFF9;

}

.hideScroll {
    height: 100%;
    overflow: hidden;
}

.blogContentWrap {
    height: 110%;
    overflow-x: auto;
}

.blogContent {
    display: flex;

}

.blogContent .swiper-slide {
    position: relative;
    border-radius: 24px;
    overflow: hidden;
    float: left;
    width: 230px;
    min-width: 230px;
}

.blogContent .swiper-slide img {
    width: 100%;
}

.contentShade {
    position: absolute;
    bottom: 0;
    left: 0;
    background: var(--tv-dark);
    background: linear-gradient(0deg, rgba(33, 33, 33, 1) 0%, rgba(33, 33, 33, 0.1) 90%, rgba(33, 33, 33, 0) 100%);
    height: 186px;
    padding: 24px;
    width: 100%;
    color: #fff;
}

.blogTag {
    background: #FFC2EC;
    border-radius: 14px;
    padding: 5px 16px;
    font-family:  var(--font-family-inter);
    font-size: 0.875rem;
    font-weight: bold;
    color: var(--tv-dark);
    text-transform: uppercase;
    margin-bottom: 10px;
    display: inline-block;

}

/* 1st, 4th, 7th... */
.blogContent .swiper-slide:nth-child(3n+1) .blogTag {
    background-color: #FFC2EC;
}

/* 2nd, 5th, 8th... */
.blogContent .swiper-slide:nth-child(3n+2) .blogTag {
    background-color: var(--tv-teal);
    color: #fff;
    /* Teal is dark — white text looks better */
}

/* 3rd, 6th, 9th... */
.blogContent .swiper-slide:nth-child(3n) .blogTag {
    background-color: #C6D4FC;
}

footer {
    background: url(../images/footerBg_new.png) no-repeat;
    background-size: cover;
    color: #fff;
}

footer p {
    color: var(--tv-white);
    font-size: 16px;
    width: 72%;
    padding-top: 12px;
}

footer li {
    padding-bottom: 16px;
}

footer .f-nav li {
    padding-bottom: 38px;
}
footer .f-nav li:last-child {
    padding-bottom: 0;
}

footer a {
    color: #fff;
}

footer .socialBg {
    background: transparent;
}

footer .btn-secondary,
footer .btn-primary {
    padding-top: 0;
    padding-bottom: 0;
    line-height: 40px;
    border: unset;
}

footer .btn-secondary {
    background-color: #fff;
}

.copyright {
    border-top: 1px solid #fff;
    margin: 30px 0 0 0;
    padding-bottom: 20px;
}

.overHidden {
    overflow: hidden;
}

/* about */
.banner {
    background-size: cover;
    color: var(--tv-white);
    background-position: center;
}

.aboutBanner {
    background-image: url(../images/aboutBanner.svg);
    background-repeat: no-repeat;
}

.faqBanner {
    background-image: url(../images/faq_banner.svg);
    background-repeat: no-repeat;
}

.priceBanner {
    background-image: url(../images/pricing_banner.svg);
    background-repeat: no-repeat;
}
.offerBanner {
    background-image: url(../images/offer_banner.svg);
    background-repeat: no-repeat;
}
.contactBanner {
    background-image: url(../images/contact_banner.svg);
    background-repeat: no-repeat;
}
.ep_banner{
    background-image: url(../images/ep_banner.svg);
    background-repeat: no-repeat;
}
.bannerContent {
    height: 46vh;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.bannerContent h1 {
    font-size: 3rem;
}

.breadcrumb-item a,
.breadcrumb-item.active {
    color: var(--tv-white);
}

.breadcrumb-item+.breadcrumb-item::before {
    color: #F6C542
}
.blog-header .breadcrumb-item+.breadcrumb-item::before {
    color: #C7372F
}
.blog-header .breadcrumb-item a{
    color: #707070;
}
.blog-header .breadcrumb-item.active{
    color: #212121;
}
.blog-header .bannerContent h1{
    color: var(--tv-teal);
}
.aboutTop .abt_img1 {
    width: 70%;
}

.aboutTop .abt_img2 {
    width: 57%;
    position: absolute;
    top: calc(50% - 39%);
    left: 40%;
    border-radius: 26px;
}

.pageHeading {
    font-size: 1.5rem;
    font-weight: bold;
    line-height: 2rem;
    color: var(--tv-teal);
    font-family: var(--font-family-roboto);
}

.buttonBdr-white {
    padding: 16px 32px;
    border: 2px solid var(--tv-dark);
    border-radius: 12px;
    color: var(--tv-dark);
}

.color-21 {
    color: var(--tv-dark);
}

.color-white {
    color: var(--tv-white);
}

.buttonRed {
    padding: 18px 32px;
    background-color: #C7372F;
    border-radius: 12px;
    color: var(--tv-white);
}

.aboutMission {
    background: url(../images/about_bg.png) no-repeat;
    background-size: cover;

}

.missionImg img:first-child {
    width: 86%;
}

.missionImg img:nth-child(2) {
    width: 34%;
    position: absolute;
    right: 3%;
    top: -7%;
}

.missionImg img:last-child {
    width: 47%;
    position: absolute;
    left: -8%;
    bottom: -16%;
}

.aboutStory {
    background: url(../images/aboutStory.svg) no-repeat;
    background-size: cover;
    margin-top: 113px;
    color: var(--tv-white);
}

.aboutStory .buttonBdr-white {
    border-color: var(--tv-white);
    color: var(--tv-white);
}

.storyList {
    display: flex;
    margin-left: 10%;
    justify-content: space-between;
}

.storyList li {
    border-right: 2px solid var(--tv-white);
    min-height: 218px;
    /* padding-right: 6%; */
    text-align: center;
    width: 25%;
}

.storyList li:nth-child(2) {
    align-items: center;
    display: flex;
    justify-content: center;
}

.sectionGapTop {
    padding-top: 60px;
}

.storyList li:last-child {
    border-right: unset;
    align-items: end;
    display: flex;
    justify-content: center;
}

.profile-slider {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.profile-track {
    display: flex;
    transition: transform 0.5s ease-in-out;
}

.profile-card {
    border-radius: 26px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    margin: 0 10px !important;
    /* flex: 0 0 300px; fixed card width */
    /* text-align: center; */
    position: relative;
    padding: 0 !important;
}

.profile-card img {
    width: 100%;
    border-radius: 12px;
}

.swiper-navigation-icon {
    display: none !important;
}

.swiper-button-next,
.swiper-button-prev {
    position: unset !important;
}

.profile-card div {
    border-radius: 16px;
    background-color: #Fff;
    position: absolute;
    bottom: 10px;
    left: 16px;
    z-index: 7;
    width: calc(100% - 32px);
    padding: 16px;
}

.profile-card h4 {
    font-size: 2rem;
}

.profile-card p {
    font-size: 14px;
    color: gray;
    font-weight: 600;
    margin-bottom: 0;
}

.slider-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.slider-btn.prev {
    left: -20px;
}

.slider-btn.next {
    right: -20px;
}

.swiper-nav {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-top: 20px;
}

/* Style arrows as circles */
.swiper-button-prev,
.swiper-button-next {
    position: static;
    /* remove default position */
    width: 56px !important;
    height: 56px !important;
    background: url(../images/swip_right.svg) no-repeat center;
    background-size: cover;
    border-radius: 100%;
}

.swiper-button-prev {
    transform: rotate(-180deg);
}

.swiper-button-prev::after,
.swiper-button-next::after {
    font-size: 16px;
    /* smaller arrow */
}

.swiper-nav {
    margin-top: 36px;
}

.shadowLeft,
.shadowRight {
    background: #ffffff;
    background: linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.7) 50%, rgba(252, 176, 69, 0) 100%);
    width: 200px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
}

.shadowRight {
    right: 0;
    left: unset;
    transform: rotate(-180deg);
}

.aboutTranform {
    background: url(../images/transform.svg) no-repeat center center;
    min-height: 240px;
    background-size: cover;
    border-radius: 26px;
}

.aboutTranform h3,
.contactTop h3 {
    font-size: 3rem;
}

.aboutTranform p,
.contactTop p {
    font-size: 1.5rem
}

.contactBody {
    background-color: var(--tv-white);
}

.contactTop {
    background: url(../images/contact_strip.svg) no-repeat;
    border-radius: 24px;
    min-height: 166px;
    margin-top: -83px;
}

.contactTop img {
    width: 17.6%;
}

.contactTopLink {
    background: #C7372F;
    border-radius: 12px;
    padding: 10px 96px;
    font-size: 1.5rem;

    letter-spacing: 0px;
    color: #FDF4F3;
}

.mapWidth {
    width: 94%;
}

.contactInfo .contactList li {
    margin-bottom: 1.5rem;
}

.contactBox {
    width: 94%;
    margin-top: 1.5rem;
    display: flex;
    gap: 1.5rem;
}

.contactBox li {
    border: 1px solid #E0E0E0;
    border-radius: 24px;
    padding: 1.5rem;
    min-width: calc(50% - 2px - 0.75rem);
}

.contactBox li h4 {
    font-size: 1.5rem;
    font-weight: bold;
    color: #212121;
}

.contactBox li p {
    font-size: 1.125rem;
    color: #212121;
}

.getIn {
    background: #F8F8F8;
    border: 1px solid #E0E0E0;
    border-radius: 24px;
    padding: 1.5rem 2.25rem;
    height: 100%;
    width: 81%;
    float: right;
}

.fe_form label {
    font-size: 0.875rem;
    font-weight: 600;
    color: #212121;
}

.fe_form input {
    background-color: #FFFFFF;
    border: 1px solid #E0E0E0;
    border-radius: 6px;
}

.fe_form input.disabled {
    background: #F8F9FA;
}

.fe_form input.emailField {
    background: #fff url(../images/icons/email_icon.svg) no-repeat 16px center;
    background-size: 22px 18px;
    padding-left: 48px;
}

.fe_form select.country {
    max-width: 78px;
}

.fe_form select {
    appearance: none;
    /* For modern browsers */
    -webkit-appearance: none;
    /* For Safari/Chrome */
    -moz-appearance: none;
    /* For Firefox */

    background: #fff url(../images/icons/dd_icon.svg) no-repeat right 0.75rem center;
    background-size: 20px;
    padding-right: 2rem;
    /* space for the icon */
}

.fe_form textarea {
    resize: none;
    min-height: 154px;
}

.fe_form .cancel {
    background: #E3FFF9;
    border: 1px solid #0078743D;
    border-radius: 12px;
    font-size: 1.125rem;
    font-weight: 600;
    color: #003024;
    padding: 14px 2rem;
}

.fe_form .send {
    background: #C7372F;
    border-radius: 12px;
    font-size: 1.125rem;
    font-weight: 600;
    padding: 14px 2rem;
    color: #FDF4F3;
}

.fe_form select option.first {
    color: #707070;
}

.fe_form input::-webkit-input-placeholder {
    color: #707070;
}

/* Chrome, Safari, Edge */
.fe_form input:-moz-placeholder,
.fe_form textarea:-moz-placeholder {
    color: #707070 !important;
}

/* Firefox 4-18 */
.fe_form input::-moz-placeholder,
.fe_form textarea::-moz-placeholder {
    color: #707070 !important;
}

/* Firefox 19+ */
.fe_form input:-ms-input-placeholder,
.fe_form textarea:-ms-input-placeholder {
    color: #707070 !important;
}

/* IE 10+ */
.fe_form input::placeholder,
.fe_form textarea::placeholder {
    color: #707070 !important;
}

.csIntro h2 {
    font-size: 1.875rem;
    color: var(--tv-teal);
    font-family: var(--font-family-roboto);
    font-weight: 500;
}

.bg_white {
    background-color: var(--tv-white);
}

.homeAccordion.faqAcc .accordion-item {
    border: unset !important;
}

.homeAccordion.faqAcc .accordion-button.collapsed::after {
    background: url(../images/icons/acc_icon.svg) no-repeat !important;
    background-size: 24px !important;
    height: 24px !important;
    width: 24px !important;
    border: unset !important;
    transform: rotate(0);
    -webkit-transform: rotate(0);
    top: 16px;
    right: -16px;
}

.homeAccordion.faqAcc .accordion-button::after {
    transform: rotate(-180deg);
    -webkit-transform: rotate(-180deg);
    background: url(../images/icons/acc_icon.svg) no-repeat !important;
    background-size: 24px !important;
    height: 24px !important;
    width: 24px !important;
    border: unset !important;
    top: 14px;
    right: -16px;
}

.ep-editor-picks {
    background: #221D19;
    color: #fff;
    padding: 3.8% 0 2% 4%;
    max-width: 100%;
    margin: auto;
}

.ep-title {
    font-size: 3rem;
    font-weight: bold;
    margin-bottom: 5px;
}

.ep-subtitle {
    font-size: 1.125rem;
    color: var(--tv-white);
    font-weight: 600;
    margin-bottom: 15px;
}

.ep-slide {
    position: relative;
}

.ep-slide img {
    width: 100%;
    border-radius: 6px;
}

.ep-caption {
    padding: 24px 0 0 0;
    max-width: 60%;
}

.ep-tag {
    display: inline-block;
    background: #FFC2EC;
    border-radius: 14px;
    font-size: 0.875rem;
    padding: 5px 16px;
    margin-bottom: 5px;
    color: var(--tv-dark);
}

.ep-caption h3 {
    font-size: 1.875rem;
    margin: 0;
    color: var(--tv-white);
    font-family: var(--font-family-inter);
    font-weight: var(--font-w-bold);

}

.ep-sliderNav {
    position: absolute;
    right: 3rem;
    bottom: 20px;
    display: flex;
    /* min-height: 56px; */
    align-items: center;
    justify-content: end;
    gap: 2rem;
}
.ep-sliderNav .swiper-pagination-total{
    font-weight: 300;
}
.ep-sliderNav .swiper-pagination-current{
    font-weight: bold;
}
.ep-sliderNav .swiper-pagination {
    position: unset !important;
    width: unset !important;
}

.ep-sliderNav .ep-prev,
.ep-sliderNav .ep-next {
    /* position: absolute !important; */
    margin-top: 0 !important;
}

.eventInfo {
    background: #FFFFFF;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 12px;
    padding: 2.25rem 1.875rem;
    margin-bottom: 2.25rem;
}

.ep-headingTxt {
    font-weight: 600;
    font-size: 1.25rem;
    color: #212121;
}

.eventInfo h3 {
    font-size: 1.875rem;
    color: var(--tv-teal);
    font-weight: bold;
}

.eventInfo label {
    position: absolute;
    left: 24px;
    width: 100%;
    top: 15px;
    font-size: 15px;
    color: #212121;
    font-weight: 600;
}

.eventInfo label span {
    color: red
}

.eventInfo input[type="text"] {
    background: unset;
    border: 2px solid #0078745C;
    border-radius: 6px;
    width: 100%;
    padding: 11px 24px;
    position: relative;
    z-index: 2;
}

.eventInfo input:focus+label,
.eventInfo input:not(:placeholder-shown)+label {
    display: none;
}

.eventButton {
    background: #C7372F;
    position: relative;
    border-radius: 12px;
    border: unset;
    padding: 14px 44px 14px 16px;
    font-size: 1.125rem;
    font-weight: bold;
    color: #FDF4F3;
}
.eventButton:after {
    content: '';
    width: 18px;
    height: 14px;
    position: absolute;
    right: 16px;
    top: calc(50% - 7px);
    background: url(../images/icons/button_arrow.svg) no-repeat 90% center;
}

.ep-listTitle li {
    border-bottom: #E0E0E0 1px solid;
    line-height: 17px;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 0.875rem;
    padding: 2.25rem 0;
}

.ep-listTitle li:first-child {
    padding-top: 0;
}

.ep-listTitle li span.ep-rhsTag {
    background-color: #C6D4FC;
    border-radius: 14px;
    padding: 5px 16px;
    margin-right: 1rem;

}

.ep-listTitle li span.ep-rhsTag.ep-color-2 {
    background-color: var(--tv-teal);
    color: var(--tv-white);
}

.ep-listTitle li span.ep-rhsTag.ep-color-3 {
    background-color: #D8FFD8;
}

.ep-listTitle li span.ep-rhsTag.ep-color-4 {
    background-color: #FFC2EC;
}

.ep-listTitle li h4 {
    font-size: 1.875rem;
    text-transform: capitalize;
    margin-top: 10px;
    margin-bottom: 0;
    font-family:  var(--font-family-inter);
}

.ep-listTitle li p {
    font-size: 1.5rem;
    font-weight: 500;
    color: #212121;
    margin-bottom: 0;
    line-height: 1.813rem;
    text-transform: capitalize;
    margin-top: 10px;
}

.trending-nav {
    display: none;
}

.pop-tag {
    gap: 44px;
    padding: 2.25rem 0 4.5rem;
    border-bottom: #E0E0E0 1px solid;
    margin-bottom: 5rem;
}

.pop-tag h3 {
    font-size: 1.875rem;
    font-weight: bold;
    color: #212121;
    font-family: var(--font-family-roboto);
    margin-bottom: 0;
}

.pop-tag ul li {
    display: inline-block;
    border: 2px solid #212121;
    border-radius: 20px;
    padding: 12px 16px;
    margin-right: 8px;
}

.pop-tag ul li a {
    font-size: 0.875rem;
    font-weight: bold;
    color: #212121;
}

.tipsImage {
    background: #E3FFF9;
    padding: 102px 56px 102px 85px;
}

.tipsImage img {
    width: 100%
}

.ep-listRytWrap {
    width: 100%;
    overflow: hidden;
}

.ep-listRytScroll {
    max-height: 568px;
    overflow-y: auto;
    width: 110%;
    padding-right: 10%;
}

.ep-pxPadding {
    padding: 0 0.35rem;
}

.priceOffer .offer-card {
    padding: 3rem 1.5rem;
    min-height: unset;
}

.priceOffer .offer-card p {
    margin-bottom: 0;
}

.priceOffer .offer-card img {
    width: 100%;
}

.priceOffer .offer-card .offer-img {
    padding-right: 1.5rem;
    min-width: 74px;
}
.offer-img {
    min-width: 100px;
}

.priceSection {
    width: 56%;
    margin: 0 auto;
}

.priceEmp {
    background: #FFFFFF;
    border: 1px solid #CCCCCC;
    border-radius: 8px;
    padding: 1.5rem;
}

.priceEmp span {
    font-size: 3rem;
    font-weight: bold;
    color: var(--tv-teal);
    font-family: var(--font-family-roboto);
    display: block;
}

.priceEmp p {
    width: 74%;
    font-size: 1.5rem;
    font-weight: 500;
    color: #212121;
    margin: 0 auto;
    margin-top: -12px;
}

.pricePlan {
    background-color: var(--tv-teal);
    color: var(--tv-white);
    margin-top: -91px;
    padding-top: 152px;
}

.pricePlan h3 {
    font-size: 3rem;
    font-weight: bold;
    margin-bottom: 1rem;
}

.pricePlan p {
    font-size: 1.5rem;
}

.pricePlan button {
    padding: 16px 2.813rem;
    background: #C7372F;
    border-radius: 12px;
    border: unset;
    font-size: 1.125rem;
    font-weight: 600;
    color: #FDF4F3;
    white-space: nowrap;
}

.chkoutHeader {
    background: #FFFFFF;
    box-shadow: 0px 3px 6px #00000029;
    position: relative;
    height: 100%;
}

.chkoutBg {
    background-color: var(--tv-white);
}

.chk-pl {
    padding: 56px 60px 56px 2.438rem;
}

.planDe {
    display: flex;
    gap: 2.125rem;
    justify-content: space-between;
}

.planDe li {
    width: 50%;

}

.packName span {
    font-size: 1rem;
    color: #212121;
    padding: 5px 10px;
    background: #CCE4E3;
    border-radius: 6px;
    margin-left: 10px;
}

.planDe li label {
    padding: 1.5rem;
    width: 100%;
    border: 1px solid #212121;
    border-radius: 6px;

}

.customRadioWrap {
    display: none;
}

.customRadioWrap+label span.customRadio {
    border: 3px solid #707070;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.customRadioWrap:checked+label span.customRadio {
    border-color: var(--tv-teal);
}

.customRadioWrap:checked+label {
    border-color: var(--tv-teal);
}

.customRadioWrap:checked+label span.customRadio::before {
    content: "";
    width: 12px;
    /* inner circle size */
    height: 12px;
    background: teal;
    /* filled color */
    border-radius: 50%;
}

.planDe li label>div>span {
    display: block;
}

.planDe span.name {
    color: #707070;
    font-size: 1rem;
}

.planDes li {
    background: url(../images/payment_thick.svg) no-repeat 0 5px;
    background-size: 20px;
    padding-left: 36px;
    margin-bottom: 1rem;
}

.planWrap {
    border-bottom: #E0E0E0 1px solid;
    padding-bottom: 36px;
    margin-bottom: 36px;
}

.paymentCard {
    background: url(../images/icons/card.svg) no-repeat 0 2px;
    background-size: 24px;
    padding-left: 34px;
}

.paymentBank {
    background: url(../images/icons/bank.svg) no-repeat 0 2px;
    background-size: 24px;
    padding-left: 34px;
}

.paymentFooterTxt {
    font-size: 0.875rem;
    color: #707070;
}

.paymentRhs {
    padding: 10.25rem 12.688rem 0 3.125rem;
}

.paymentBdr {
    border-bottom: 1px solid #E0E0E0;
}

.lightColor {
    color: #707070;
}

.paymentButton {
    background: #C7372F;
    border-radius: 12px;
    display: block;
    font-size: 1rem;
    font-weight: 600;
    padding: 20px 0;
    text-align: center;
    color: #FDF4F3;
    width: 100%;
    border: unset;
}

.loginBody {
    background-color: #f3fbfa;
    background-image: radial-gradient(#c2d6d6 0.8px, transparent 1px);
    background-size: 20px 20px;

}

.loginWrap {
    width: 328px;
}

.loginWrap p.subHeadingLogin {
    font-size: 1rem;
    color: #707070;
}

.loginWrap .form-floating>.form-control {
    border: unset !important;
    background-color: unset;
    border-radius: unset;
    border-bottom: 1px solid #212121 !important;
    padding-left: 0;
}

.loginWrap .form-floating>.form-control:focus {
    outline: unset !important;
    box-shadow: unset;
}

.loginWrap .form-floating>.form-control:focus {
    outline: unset !important;
    box-shadow: unset;
}

.loginWrap .form-floating>.form-control~label {
    color: #212121;
    padding: 1rem 0;
    line-height: 1.375rem;
    font-weight: 500;
}

.loginWrap .form-floating>.form-control-plaintext~label,
.loginWrap .form-floating>.form-control:focus~label,
.loginWrap .form-floating>.form-control:not(:placeholder-shown)~label,
.loginWrap .form-floating>.form-select~label {
    transform: translateY(-1.1rem) translateX(0);
    color: var(--tv-teal);
}

.form-floating>.form-control:-webkit-autofill~label {
    transform: translateY(-1.1rem) translateX(0)
}

.toggle-password {
    position: absolute;
    right: 10px;
    top: 2.25rem;
    transform: translateY(-50%);
    cursor: pointer;
    font-size: 16px;
    height: 22px;
    width: 22px;
    color: #555;
    background: url(../images/icons/password_eye.svg) no-repeat;
    background-size: 21px;
}

.toggle-password.active {
    background-image:url(../images/icons/open_eye.svg);
}

.loginOpition input+label {
    position: relative;
    padding-left: 28px;
    font-size: 0.875rem;
    line-height: 20px;
}

.loginOpition a {
    font-size: 0.875rem;
    line-height: 20px;
    color: var(--tv-teal);
    text-decoration: underline;
}

.loginOpition input+label:after {
    background: url(../images/icons/login_check.png) no-repeat;
    background-size: 16px;
    height: 16px;
    width: 16px;
    content: '';
    left: 0;
    top: 1px;
    position: absolute;
}

.loginOpition input:checked+label:after {
    background: url(../images/icons/login_check_active.png) no-repeat;
    background-size: 20px;
    background-position: -2px;
}




.btn-login {
    background: #C7372F;
    border-radius: 6px;
    color: #FDF4F3;
    border: none;
    line-height: 36px;
    border-radius: 6px;
    width: 100%;
    cursor: pointer;
    font-size: 1rem;
    font-weight: 600;
}

.btn-login:hover {
    background: #b71c1c;
}

/* Divider */
.divider {
    text-align: center;
    font-size: 0.875rem;
    line-height: 1.125rem;
    font-weight: 500;
    color: #707070;
}

/* Google button */
.btn-google {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--tv-teal);
    border-radius: 6px;
    line-height: 36px;
    cursor: pointer;
    background: #fff;
    font-size: 0.875rem;
    font-weight: 500;
    color: #20314F;
    width: 100%;
}

.btn-google img {
    height: 20px;
    margin-right: 8px;
}

/* Sign up */
.signup {
    text-align: center;
    margin-top: 15px;
    font-size: 0.75rem;
    color: #212121;
}

.signup a {
    color: #212121;
    text-decoration: underline;
    font-weight: 500;
}
.loginFL{
    position: absolute;
    bottom: 3rem;
}
.loginFL a{
    text-decoration: underline;
    font-size: 0.75rem;
    color: #212121;
}
.loginFL a:hover{
    color: var(--tv-teal);
}
.is-invalid {
  border-color: #dc3545 !important;
}
label.error {
  color: #dc3545;
  font-size: 13px;
  margin-top: 5px;
}
.loginWrap .form-control.is-invalid{
    border-bottom-color: red !important;
    background-image: unset !important;
}
.loginWrap .is-valid{background-image: unset !important;
}
.form-floating>.form-control-plaintext:-webkit-autofill, .form-floating>.form-control:-webkit-autofill{
    background-color: unset !important;
}
.blogHeader{
    background: #D8FFD8;
border-radius: 12px;
padding: 3.125rem;
}
.eventTag{
    background: #D8FFD8;
border: 2px solid #212121;
border-radius: 14px;
padding: 5px 16px;
display: inline-block;
}
.blogHeader h2{
    font-size: 3rem;
    color: #212121;
    font-weight: bold;
}
.blogLhs{
    background: #FFFFFF;
    border: 1px solid #C0C0C0;
    border-radius: 12px;
}
.blogLhs li{
    padding-bottom: 1.5rem;
}
.blogLhs li:last-child{
    padding-bottom: 0;
}
.blogLhs a{
    text-decoration: underline;
    font-size: 1.125rem;
    font-weight: 600;
    color: #212121;
}
.blogMainContent p{
    color: #212121;
    font-size: 1.125rem;
    font-weight: 500;
    margin-bottom: 1.5rem;
}
.blogMainContent h2, .blogMainContent h3{
    color: #212121;
    font-size: 1.875rem;
    font-weight: bold;
    margin-bottom: 1rem;
}
.blogMainContent h3{
    font-size: 1.5rem;
}
.blogMainContent img{
    margin-bottom: 1.5rem;
    width: 100%;
}
.blog-images {
  display: flex;
  gap: 24px; /* optional spacing */
}

.blog-images img:first-child {
  width: 66%;
}

.blog-images img:last-child {
  width: 34%;
}
.blogWrap{
    border-top: 1px solid #E0E0E0;

}
.blogWrapBB{
    border-bottom: 1px solid #E0E0E0;
}
.blogSocial .socialBg{
    margin-right: 0;
    margin-left: 1.5rem;
}
.likeButtons button{
    border-radius: 12px;
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--tv-teal);
    padding: 14px 16px 14px 46px;
    border: unset;
    background:#C2DFDE url(../images/icons/like.svg) no-repeat;
    background-position: 16px center;
}
.likeButtons button:last-child{
    background-color: #F2CFCD;
    background-image: url(../images/icons/dislike.svg);
    color: #C7372F;
}
.blogMainPadding label{
    font-size: 1.5rem !important;
    font-weight: bold !important;
}
.blogMainPadding  textarea{
    min-height: 124px !important;
}
.blogAuthor{
    background: #FFFFFF;
    border: 1px solid #E0E0E0;
    border-radius: 6px;
    padding: 16px 24px;
}
.blogAuthor img{
    max-width: 124px;
}
.blogAuthor p{
    margin-bottom: 1.5rem;
    color: #707070;
    font-size: 0.875rem;
}
.blogAuthor p:last-child{
    margin-bottom: 0
}
.cardsIcon{
    background-image: url(../images/icons/cards.svg) !important;
    background-repeat: no-repeat !important;
    background-position: 98% center !important;
    padding-right: 88px;
}
.invalid-feedback {
  display: block;
  color: #e74c3c;
  font-size: 13px;
}
.is-invalid {
  border-color: #e74c3c;
}
@media (min-width: 1680px) {
    .contactTop {
        min-height: 196px;
        margin-top: -98px;

    }
    .priceOffer .offer-card .offer-img {

    min-width: 100px;
}
.priceEmp p {
    width: 64%;}
    .ep-listRytScroll {
    max-height: 812px;}
.blogMainPadding{
    padding-left: 3rem;
    padding-right: 6rem;
}
    .chk-pl {
        padding: 56px 60px 56px 15.438rem;
    }

    .ep-pxPadding {
        padding: 0 5rem;
    }

    .contactTop img {
        width: 11.6%;
    }

    .carousel-indicators [data-bs-target] {
        width: 24px;
        height: 24px;
    }

    .blogContent li {
        width: 360px;
        min-width: 336px;
    }

    .navWrap ul li {
        line-height: 84px;
    }

    .logo {
        height: 84px;
    }

    .carousel-indicators [data-bs-target] {
        height: 24px;
        width: 24px;
    }

    .carousel-content-home {
        padding: 194px 144px
    }

    .workWrap li {
        width: 286px;
        height: 320px;
    }

    .workWrap li h4:after {
        border: 5px solid #F6C542;
    }

    .workWrap li:first-child:after {
        background-size: 346px 378px;
    }

    .workWrap li:nth-child(2):after {
        left: -33px;
        width: 121%;
        background-size: 346px 208px;

    }

    .workWrap li:nth-child(3):after {
        left: -37px;
        background-size: 346px 208px;
    }

    .workWrap li:nth-child(4):after {
        left: -41px;
        width: 121%;
        height: 118%;
        background-size: 346px 378px;
    }
}

@media (max-width: 1200px) {
    .masonry {
        column-count: 3;
    }
}

@media (max-width: 767px) {

    html {
        font-size: 12px;
    }

    .chk-pl {
        padding: 56px 0;
    }

    .paymentRhs {
        padding: 56px 0;
    }

    .planDe {
        flex-direction: column;
    }

    .planDe li {
        width: 100%;
    }

    .hideDevice {
        display: none !important;
    }

    .workWrap li h4 {
        font-size: 1.5rem;
    }

    .workWrap li p {
        font-size: 1rem;
    }

    h2,
    .fnt-48 {
        font-size: 2.5rem;
    }

    .contactList {
        text-align: left;
    }

    .deviceCenter {
        text-align: center;
        justify-content: center !important;
    }


    .consultation p {
        font-size: 1.5rem;
    }

    .consultation h3 {
        font-size: 2rem;
        margin-bottom: 28px;
    }

    .carousel-content-home {
        padding: 40px 16px 120px;
        text-align: center;
    }

    .offer-card,
    .workWrap {
        flex-direction: column;
        text-align: center;
    }

    .offer-card {
        height: unset;
    }

    .offer-card img,
    .priceOffer .offer-card img {
        width: 90px;
    }

    .priceEmp {
        margin-top: 16px;
    }

    .pricePlan {
        margin-top: 16px;
        padding-top: 60px;
    }

    .pricePlan .deviceCenter {
        justify-content: flex-start !important;
    }

    .consultation {
        text-align: center;
    }

    .device-my-3 {
        margin-top: 16px;
        margin-bottom: 16px;
    }

    .offer-img {
        text-align: center;
        padding-bottom: 16px;
    }

    .bannerButton {
        flex-direction: column;
    }

    .home-slider h2 {
        font-size: 2rem;
        width: 100%;
    }

    .home-slider p {
        width: 100%;
        font-size: 1rem;
    }

    .subMenu {
        display: block;
    }

    ul.nav {
        /* display: none !important; */
        position: fixed;
        left: -100vw;
        height: 100vh;
        width: 80vw;
        background: #fff;
        z-index: 5;
        top: 0;
        flex-direction: column;
        justify-content: start !important;
        align-items: start !important;

        -webkit-transition: 0.25s ease-in-out;
        -moz-transition: 0.25s ease-in-out;
        -o-transition: 0.25s ease-in-out;
        transition: 0.25s ease-in-out;
    }

    ul.nav::after {
        background: rgba(0, 0, 0, 0.4);
        content: '';
        left: 0;
        top: 0;
        width: 0;
        height: 100vh;
        -webkit-transition: 0.25s ease-in-out;
        -moz-transition: 0.25s ease-in-out;
        -o-transition: 0.25s ease-in-out;
        transition: 0.25s ease-in-out;
    }

    ul.nav.showNav::after {
        width: 100vw;
    }

    ul.nav li {
        width: 100%;
        margin: 0;
        padding: 0 20px;
        line-height: 44px;
    }

    .navWrap ul li.active:after,
    .navWrap ul li:hover::after {
        border-radius: unset;
        height: 2px;
        bottom: 0;
    }

    #h-m-icn {
        float: right;
        -webkit-transform: rotate(0);
        -moz-transform: rotate(0);
        -o-transform: rotate(0);
        transform: rotate(0);
        -webkit-transition: 0.25s ease-in-out;
        -moz-transition: 0.25s ease-in-out;
        -o-transition: 0.25s ease-in-out;
        transition: 0.25s ease-in-out;
        cursor: pointer;
        height: 42px;
        width: 32px;
        position: relative;
        z-index: 7;
    }

    #h-m-icn span {
        display: block;
        background-color: #000;
        height: 2px;
        width: 20px;
        margin: 0;
        -webkit-transition: 0.15s ease-in-out;
        -moz-transition: 0.15s ease-in-out;
        -o-transition: 0.15s ease-in-out;
        transition: 0.15s ease-in-out;
        position: absolute;
        right: 0;
    }

    #h-m-icn span:first-child {
        top: 13px;
    }

    #h-m-icn span:nth-child(2) {
        top: 18px;
        width: 16px;
    }

    #h-m-icn span:nth-child(3) {
        background-color: #C7372F;
        top: 23px;
        width: 12px;
    }

    #h-m-icn.active span {
        background-color: #fff;
    }

    #h-m-icn.active {
        top: -54px;
        left: 20px;
    }

    #h-m-icn.active span:first-child {
        -webkit-transform: rotate(42deg);
        -moz-transform: rotate(42deg);
        -o-transform: rotate(42deg);
        transform: rotate(42deg);
    }

    #h-m-icn.active span:nth-child(2) {
        display: none;
    }

    #h-m-icn.active span:nth-child(3) {
        -webkit-transform: rotate(-42deg);
        -moz-transform: rotate(-42deg);
        -o-transform: rotate(-42deg);
        transform: rotate(-42deg);
        top: 13px;
        width: 20px;
    }

    ul.nav.showNav {
        left: 0;
    }

    .workWrap {
        margin-bottom: 0;
    }

    .workWrap li:after {
        opacity: 0;
    }

    .pricingWrap {
        margin-bottom: 20px;
    }

    .priceUser li:last-child {
        font-size: 0.8rem;
        max-width: 200px;
    }

    .pricingWrapRow {
        gap: 20px;
    }

    .testimonial,
    .testimonial h2 {
        text-align: center;
        width: 100%;
    }

    .ratingInfo {
        flex-direction: column;
    }

    .testimonial br {
        display: none;
    }

    .masonry .masonry-item:first-child {
        margin-top: 0 !important;
    }

    .q-content {
        text-align: center;
    }

    .homeAccordion .accordion-button {
        text-align: left;
    }

    .homeAccordion .accordion-item {
        padding-left: 10px;
        padding-right: 30px;
    }


    footer p {
        width: 80%;
    }

    .f-button span {
        text-align: left;
    }

    .flex-device-column {
        flex-direction: column !important;
    }

    .aboutIntro {
        padding: 0 !important;
    }

    .aboutIntro .buttonBdr-white,
    .aboutIntro .buttonRed {
        width: 80%;
        text-align: center;
    }

    .aboutIntro h1 br {
        display: none;
    }

    .aboutTop .abt_img2 {
        width: 60%;
        top: calc(50% - 41%);
    }

    .aboutMission h2 {
        padding-top: 26px;
    }

    .missionImg img:last-child {
        left: 0;
    }

    .aboutStory,
    .aboutTranform {
        text-align: center;
    }

    .aboutStory .d-flex {
        justify-content: center;
    }

    .storyList {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr);
        /* 2 columns */
        grid-template-rows: repeat(2, auto);
        /* 2 rows */
        gap: 10px;
        /* space between items */
        width: 50%;
        align-content: center !important;
        width: 100%;
        justify-content: unset;
        margin: 36px 0 0;
    }

    .storyList li {
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center !important;
        min-height: 100px;
        position: relative;
    }

    .storyList li:nth-child(3)::after,
    .storyList li:last-child:after {
        width: calc(100% - 10px);
        height: 2px;
        background-color: var(--tv-white);
        left: 0;
        position: absolute;
        top: -6px;
        content: '';
    }

    .storyList li:nth-child(2) {
        border-right: unset;
    }

    .shadowLeft,
    .shadowRight {
        display: none;
    }

    
    .aboutTranform {
        padding: 20px;
        border-radius: 0;
    }

    .aboutTranform .ps-5 {
        padding: 0 !important;
        margin: 0 !important;
    }

    .contactTop {
        background-position: -65px 0;
        margin-top: 24px;
        border-radius: 0;
        background-size: cover;
    }
    .contactTop a{
        margin-bottom: 1.5rem;
    }
    .contactTop .col-lg-8>div {
        flex-direction: column;
        padding-left: 0 !important;
        margin-left: 0 !important;
        text-align: center;
        padding-top: 1.5rem;
    }

    .contactTop .col-lg-8>div .ps-5 {
        padding: 0 24px !important;
    }

    .contactInfo .contactList li>span {
        justify-content: flex-start;
    }

    .getIn,
    .mapWidth,
    .contactBox {
        width: 100%;
    }

    .contactBox {
        margin-bottom: 36px;
    }

    .contactBtnGrp {
        justify-content: center !important;
    }

    .csIntro {
        padding: 0 !important;
        margin: 20px 0 0 0 !important;
    }

    .tipsImage {
        padding: 26px;
        margin-top: 16px;

    }

    .pl-device {
        padding-left: 0 !important;
    }

    .pr-device {
        padding-right: 0 !important;
    }

    .ep-caption {
        max-width: 100%;
        width: 100%;
        padding: 16px;
    }

    .ep-caption br {
        display: none;
    }

    .ep-sliderNav {
        gap: 1rem;
        position: unset;
        justify-content: center;
        padding: 16px 0;
    }

    .ep-editor-picks {
        padding-left: 0;
    }

    .ep-title,
    .ep-subtitle {
        padding: 0 16px;
    }

    .swiper-button-prev,
    .swiper-button-next {
        width: 36px !important;
        height: 36px !important;
    }

    .trending-nav {
        display: flex;
    }

    .trending-nav .swiper-button-prev,
    .trending-nav .swiper-button-next {
        background-size: 36px;
    }

    .pop-tag {
        flex-direction: column;
        gap: 22px;
        margin-bottom: 3rem;
        padding: 2.25rem 0;
    }

    .pop-tag ul {
        text-align: center;
    }

    .pop-tag ul li {
        margin-bottom: 12px;
    }

    .eventInfo {
        margin-top: 22px;
    }

    .ep-heading {
        flex-direction: column;
        align-items: flex-start !important;
    }

    .ep-listTitle li h4 {
        font-size: 1.5rem;
    }

    .ep-listTitle li p {
        font-size: 1rem;
    }

    .priceSection {
        width: 100%;
    }
    .loginBody .ls-bannerImg{
        order: 0 !important;
        padding-right: calc(var(--bs-gutter-x) * .5) !important;
    }
    .loginBody .ls-bannerImg .p-5{
        max-width: 328px; 
        margin: 0 auto;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    .signup {
        padding-bottom: 140px;
    }
    .blogBanner.offset-1, .blogWrap .offset-4{
        margin-left: 0 !important;
    }
    .blogHeader .order-1{
        order: 0 !important;
        margin-bottom: 1.5rem;
    }
    .blogHeader h2 br{
        display: none;
    }
    .blogLhs{
        margin-bottom: 1.5rem;
    }
    .blog-images{
        gap: 4px;
    }
    .blogMainPadding > div{
        flex-direction: column-reverse;
    }
    .blogMainPadding > div img{
        width: 100% !important;
    }
    .likeSection{
        flex-direction: column;
    }
    .likeSection .h-social.blogSocial{
        justify-content: start !important;
    }
    .blogSocial .socialBg{
        margin-right: 1.5rem;
        margin-left: 0;
    }
    .blog-header .bannerContent{
        height: 18vh;
    }
    .blog-header #h-m-icn span{
        background-color: #fff;
    }
    footer .f-nav li:last-child{
        padding-bottom: 38px;
    }
    .missionImg{
        padding-top: 20px;
    }
}

@media (max-width: 768px) {
    .masonry {
        column-count: 2;
    }
}

@media (max-width: 576px) {
    .masonry {
        column-count: 1;
    }
}