
/*--------------------- Copyright (c) 2025 -----------------------
[Master Stylesheet]
Project: PixaBooking
Version: 1.0.0
Author:
 -------------------------------------------------------------------
[Table of contents]
    1. Global CSS Start
    2. Comman CSS Start
-------------------------------------------------------------------*/
/********************************************************
    1. Global CSS Start
********************************************************/

@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

:root {
    --white-color: #ffffff;
    --bg-color: #ffffff;
    --secondary-color: #9d99a1;
    --primary-color: #217BFF;
    --heading-color: #26325E;
    --text-color:#8A8A8A;
    --button-color: #217BFF;
}
body {
    font-family: 'Be Vietnam Pro', sans-serif;
    letter-spacing: 0;
    font-size: 16px;
    line-height: 1.42857143;
    font-weight: 400;
    background: var(--bg-color);
    color: var(--text-color);
    overflow-x: hidden;
}
ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
}
.pointer {
    cursor: pointer;
}
a,
a:hover,
a:focus,
button,
button:hover,
svg,
svg path,
::after,
::before {
    text-decoration: none;
    transition: var(--transition);
}
img {
    max-width: 100%;
}
input,
textarea,
select,
button,
button:focus,
button:hover,
label,
svg,
svg path,
svg rect,
svg polygon,
img,
a,
.form-control:focus {
    outline: none;
    box-shadow: none;
}
ul,
p {
    padding: 0;
    margin: 0;
    list-style-type: none;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    padding: 0;
    text-transform: capitalize;
    color: var(--heading-color);
}
/* width */
.custom_scroll::-webkit-scrollbar {
    width: 4px;
}
/* Track */
.custom_scroll::-webkit-scrollbar-track {
    background: #f1f1f1;
}
/* Handle */
.custom_scroll::-webkit-scrollbar-thumb {
    background: var(--primary-color);
}
/********************************************************
    2. Common CSS Start
********************************************************/
/* Header Css */
.sp_headerSpace_wrap.w-100 {
    position: fixed;
    top: 0;
    width: 100%;
    background-color: #fff;
    box-shadow: 0 0 10px rgba(0 0 0 / 5%);
}
.sp_headerSection {
    position: relative;
    z-index: 99;
    min-height: 65px;
}
.pre_toggle_menu {
    display: none;
    height: 35px;
    width: 35px;
    align-items: center;
    justify-content: center;
    background-color: var(--bg-color);
    border: 0px solid var(--bg-color);
    flex-direction: column;
    padding:0px;
    border-radius: 8px;
}
.pre_toggle_menu span{
    display: block;
    height: 3px;
    width: 23px;
    margin-bottom: 4px;
    background-color: var(--vl-primary-color);
    transition: all .3s ease-in-out;
    border-radius: 2px;
    margin-left: auto;
}
.pre_toggle_menu span:nth-child(2){
    width: 17px;
    text-align: left;
    margin-right: 6px;
}
.navWrapContainer {
    max-width: 1640px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 0px 20px;
    width: 100%;
}
.sp_navbarCollapse .navbar-nav {
    display: flex;
    gap: 5px;
    align-items: center;
}
.sp_headerSpace_wrap .navbar-expand-lg .sp_navbarCollapse {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
    max-width: 1140px;
    width: 100%;
}
.sp_headerSpace_wrap .sp_navbarCollapse .nav-link{
    padding: 0px 30px;
    color: var(--heading-color);
    font-size: 15px;
}
.sp_headerSpace_wrap .sp_navbarCollapse .nav-link:hover{
    color: var(--primary-color);
}
.sp_headerSpace_wrap .sp_navbarCollapse .nav-item {
    display: flex;
    align-items: center;
}
.sp_headerSpace_wrap .navbar-expand-lg {
    padding: 15px 0;
}
.sp_btn {
    padding: 0px 25px;
    background-color: var(--primary-color);
    color: #fff !important;
    line-height: 45px;
    border-radius: 5px;
    transition: all 0.3s;
    display: flex;
    align-items: center;
    justify-content: center;
    width: -moz-fit-content;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
    border: 0;
    outline: none;
    box-shadow: none;
    cursor: pointer;
    font-size: 15px;
}
.sp_btn:hover{
    background-color: var(--heading-color);
}

.ap_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    height: 46px;
    line-height: 46px;
    text-transform: capitalize;
    color: #ffffff;
    font-size: 14px;
    font-weight: 500;
    outline: none;
    border: none;
    padding: 0 30px;
    cursor: pointer;
    border-radius: 6px;
    background-color: var(--primary-color);
    box-shadow: none;
    text-shadow: none;
    text-decoration: none !important;
    transition: all 0.3s ease-in;
    -webkit-transition: all 0.3s ease-in;
    -moz-transition: all 0.3s ease-in;
    -o-transition: all 0.3s ease-in;
    -ms-transition: all 0.3s ease-in;
    position: relative;
    z-index: 1;
    overflow: hidden;
}

/* .ap_btn:after,
.ap_btn:before {
    position: absolute;
    left: 0;
    right: 0;
    content: '';
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    top: 0;
    bottom: 0;
    transition: all 0.3s ease-in;
    -webkit-transition: all 0.3s ease-in;
    -moz-transition: all 0.3s ease-in;
    -o-transition: all 0.3s ease-in;
    -ms-transition: all 0.3s ease-in;
    z-index: -1;
    background-color: rgba(255, 255, 255, 0.5);
    z-index: -1;
}
.ap_btn:after {
    right: 100%;
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    top: auto;
    bottom: 0;
    height: 2px;
}
.ap_btn:before {
    left: 100%;
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    top: 0;
    bottom: auto;
    height: 2px;
}
.ap_btn:hover:after {
    right: 0%;
}
.ap_btn:hover:before {
    left: 0%;
} */
.ap_btn:hover {
    color: #fff;
    background-color: #0e67ed;
}

.ap_btn_white {
    border: 1px solid #DCDCDC !important;
    background-color: white !important;
    color: #797979 !important;
    height: 46px;
    border-radius: 6px;
    text-transform: capitalize;
}

.ap_btn_white:hover {
    color: var(--primary-color) !important;
    background-color: #ffffff !important;
    box-shadow: 0px 0px 0px 2px var(--primary-color);
}

/* bottom to top css */
.dz_top_icon a {
	display: flex;
	background: linear-gradient(180deg, var(--heading-color) 8.97%, var(--primary-color) 100%);
	width: 50px;
	height: 50px;
	justify-content: center;
	align-items: center;
	border-radius: 50px;
	position: fixed;
	bottom: 30px;
	right: 20px;
	transition: 0.3s;
	opacity: 0;
	visibility: hidden;
	z-index: 1000;
	cursor: pointer;
    animation: border-transform 4s linear infinite alternate forwards;
}

@keyframes border-transform {
    0% {
        border-radius: 63% 37% 54% 46%/55% 48% 52% 45%;
        transform: translateY(0px);
    }
    14% {
        border-radius: 40% 60% 54% 46%/49% 60% 40% 51%;
    }
    28% {
        border-radius: 54% 46% 38% 62%/49% 70% 30% 51%;
    }
    42% {
        border-radius: 61% 39% 55% 45%/61% 38% 62% 39%;
    }
    56% {
        border-radius: 61% 39% 67% 33%/70% 50% 50% 30%;
    }
    70% {
        border-radius: 50% 50% 34% 66%/56% 68% 32% 44%;
    }
    84% {
        border-radius: 46% 54% 50% 50%/35% 61% 39% 65%;
    }
    100% {
        border-radius: 63% 37% 54% 46%/55% 48% 52% 45%;
        transform: translateY(-20px);
    }
}
.dz_top_icon a svg {
	fill: #ffffff;
	transform: rotate(270deg);
}
.dz_top_icon a:hover {
	cursor: poHeebo;
	box-shadow: 0 0 0 25px #2a2f48 inset;
}
.dz_top_icon a:active {
	background-color: #555;
}
.dz_top_icon a.show {
	opacity: 1;
	visibility: visible;
}
/********************************************************
    Loader Style
********************************************************/
body.menu-open {
    overflow: hidden;
}

.pxl_main_wrapper {
    position: relative;
    width: 100%;
    height: 40px;
    overflow: hidden;
}
.pxl_main_wrapper::before, .pxl_main_wrapper::after {
    content: "";
    position: absolute;
    height: 100%;
    width: 50%;
    transition: all 0.5s ease-in-out;
    /* background: #fff; */
    z-index: 55;
}
.pxl_main_wrapper::before {
    top: 0;
    left: 0;
}
.pxl_main_wrapper::after {
    top: 0;
    right: 0;
}
.pxl_main_wrapper.open::before, 
.pxl_main_wrapper.open::after {
    width: 0%;
}
.loader img {
	width: 60px;
}
.loader {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    z-index: 999999;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: #FFF;
    width: 100%;
    height: 100%;
}
.spinner {
    position: relative;
    max-width: 200px;
    width: 200px;
    height: 40px;
}
.ball {
    border-radius: 50%;
    background: var(--primary-color);
    width: 10px;
    height: 10px;
    position: absolute;
    top: 20px;
    left: 50px;
    animation: loading 1.2s linear infinite;
}
.ball:nth-of-type(2) {
    animation-delay: 0.4s;
}
.ball:nth-of-type(3) {
    animation-delay: 0.8s;
}

@keyframes loading {
    0% {
        opacity: 0;
        transform: scale(0.5);
    }
    20% {
        opacity: 1;
        transform: scale(1);
    }
    40% {
        transform: translate3d(33px, 0, 0);
    }
    60% {
        transform: translate3d(66px, 0, 0);
    }
    80% {
        transform: translate3d(99px, 0, 0);
        opacity: 1;
    }
    100% {
        transform: translate3d(99px, 0, 0) scale(0.5);
        opacity: 0;
    }
}
/* bottom to top */
.pxl_body_overlay {
    position: fixed;
    background: rgb(0 0 0 / 40%);
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    visibility: hidden;
    z-index: 9;
    cursor: zoom-in;
    transition: all 0.3s linear 0s;
}
.menu-open .pxl_body_overlay {
    opacity: 1;
    visibility: visible;
}
/* Banner Section Css */
.container {
    padding: 0px 20px;
    margin: auto;
    max-width: 1220px;
}
.sp_bannerSection{
    padding: 80px 0px 90px;
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
}
.sp_swiperBox_wraper {
    border: 1px solid;
    border-image-source: linear-gradient(352.26deg, rgba(255, 255, 255, 0.52) 5.98%, rgba(255, 255, 255, 0) 94.14%);
    background-color: #E0EEFE;
    border-radius: 10px;
}
.sp_swiperBanner_wrapper .sp_swiperBox_wraper{
    background-color: transparent;
}
.sp_bannerSection h2, .sp_bannerSection h1 {
    font-weight: 800;
    font-size: 36px;
    line-height: 46px;
    letter-spacing: 0.1px;
    text-align: center;
    text-transform: capitalize;
    color: var(--heading-color);
    margin-bottom: 20px;
    max-width: 950px;
    margin-left: auto;
    margin-right: auto
}
.sp_bannerSection p{
    font-weight: 500;
    font-size: 20px;
    line-height: 28px;
    letter-spacing: -0.1px;
    text-align: center;
    text-transform: capitalize;
    color: var(--text-color);
    margin-bottom: 25px;
}
.sp_bannerSection .sp_slideText p{
    margin-bottom: 0px;
}
.sp_slideImg {
    height: 225px;
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    border-radius: 10px 10px 0 0;
}
.sp_slideText{
    border: 1px solid rgba(255, 255, 255, 0.52);
    border-top:0px;
    /* border-image-source: linear-gradient(352.26deg, rgba(255, 255, 255, 0.52) 5.98%, rgba(255, 255, 255, 0) 94.14%); */
    -webkit-backdrop-filter: blur(4px);
            backdrop-filter: blur(4px);
    border-radius: 0 0 10px 10px;
    background: rgba(255, 255, 255, 0.25);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    flex-direction: column;
    padding: 20px 15px;
}
.sp_slideText p{
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0;
    text-align: center;
    color: #555;
}
.sp_slideText h3, .sp_slideText h2{
    color: var(--heading-color);
    font-weight: 600;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0;
    text-align: center;
    margin: 0px;
}
.sp_bannerSection .swiper-horizontal {
    padding: 20px 0;
}
.sp_bannerSection .sp_btn {
    margin-top: 20px;
    margin-bottom: 55px;
    padding: 0px 28px;
}
.swiper-wrapper{
    padding-bottom: 20px;
}
.sp_bannerSection .swiper-wrapper .swiper-slide:nth-child(odd) {
    margin-top: 60px;
    /* animation: shimmy 3s infinite;
    animation-direction: alternate; */
}
@keyframes shimmy {
    0% {
      transform: translate(0, 0);    
    }
    100% {
      transform: translate(0px, -20px);
    }
}
.sp_bannerSection .swiper-wrapper .swiper-slide:nth-child(even) {
    /* animation: shimmy1 3s infinite;
    animation-direction: alternate; */
}
@keyframes shimmy1 {
    0% {
      transform: translate(0, 0);    
    }
    100% {
      transform: translate(0px, 20px);
    }
}
/* Section Heading */
.sp_pageHeader > h5, .sp_pageHeader > h2{
    font-weight: 500;
    font-size: 15px;
    line-height: 24px;
    letter-spacing: 0;
    text-align: center;
    color:var(--primary-color);
    margin-bottom: 10px;
}
.sp_pageHeader h3{
    font-weight: 700;
    font-size: 26px;
    line-height: 34px;
    letter-spacing: 0;
    text-align: center;
    color: var(--heading-color);
    margin-bottom: 20px;
}
.sp_pageHeader.sp_innerTextLeft h3 {
    text-align: left;
}
.sp_pageHeader p{
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    letter-spacing: 0;
    text-align: center;
    color: var(--text-color);
}
.sp_pageHeader{
    margin-bottom: 30px;
}
.sp_pageSection_wrapper{
    padding: 80px 0px 90px;
}
/* Section Css */
.sp_yellowBoxWrap{
    border: 1px solid #FFE9B1;
    background-color: #FFF4D9;
}
.sp_blueBoxWrap{
    border: 1px solid #A9FAFF;
    background-color: #CEFCFF;
}
.sp_redBoxWrap{
    border: 1px solid #FFCCCC;
    background-color: #FFEAEA;
}
.sp_purpalBoxWrap{
    border: 1px solid #F4C2FF;
    background-color: #FAE4FF;
}
.sp_greenBoxWrap{
    border: 1px solid #88EFA6;
    background-color: #D3FFE0;
}
.sp_lastYellowBoxWrap{
    border: 1px solid #FCE1BD;
    background-color: #FFF2E1;
}
.sp_bookingToolBox .sp_rowWrap {
    align-items: initial;
}
.sp_boxWrapper {
    border-radius: 10px;
    padding: 25px 10px 10px;
    margin-bottom: 30px;
    text-align: left;
    border: 1px solid #DCE7F6;
    background-color: #fff;
    height: calc(100% - 30px);
}
.sp_boxWrapper p {
    font-weight: 400;
    font-size: 16px;
    line-height: 24.5px;
    letter-spacing: -0.4px;
    margin-bottom: 20px;
    margin-top: 15px;
    padding: 0px 15px;
    color: var(--text-color);
}
.sp_rowWrap {
    display: flex;
    align-items: start;
    justify-content: center;
    /* flex-wrap: wrap; */
    gap: 30px;
}
.sp_colWrap {
    max-width: 100%;
    width: 100%;
}
.sp_boxHead {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: start;
    padding: 0px 15px;
}
.sp_boxHead h4 {
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0;
    text-transform: capitalize;
}
.sp_boxWrapper.sp_lastYellowBoxWrap {
    padding-top: 10px;
    margin-bottom: 0;
    height: 100%;
}
.sp_imgHold_wrap {
    text-align: center;
    padding: 15px;
}
.sp_lastYellowBoxWrap{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 25px;
    width: 100%;
}
.sp_lastYellowBoxWrap h4 {
    font-weight: 600;
    font-size: 22px;
    line-height: 30px;
    letter-spacing: 0;
    text-transform: capitalize;
}
.sp_setBoxImg {
    max-width: calc(50% - 10px);
    background-color: #fff;
    padding: 20px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    gap: 10px;
    border: 1px solid #0000000D;
}
.sp_boxContent_wrap {
    max-width: calc(50% - 10px);
}
.sp_buttonWrap_dv .sp_btn {
    max-width: 200px;
    margin-bottom: 10px;
    height: 40px;
    line-height: normal;
    font-size: 14px;
    padding: 0px 10px;
    width: 100%;
    text-align: center;
}
.sp_buttonWrap_dv .sp_btn:last-child {
    margin-bottom: 0px;
}
.sp_primaryBtn {
    background-color: var(--primary-color) !important;
}
.sp_warningBtn, .sp_warningBtn.sp_btn:hover{
    background-color:#F48926;
}
.sp_cancelBtn, .sp_cancelBtn.sp_btn:hover{
    background-color:#FF4747;
}
/* About Section Css */
.sp_aboutList_wrap {
    text-align: left;
    width: 100%;
}
.sp_aboutUsSection .sp_pageHeader,
.sp_aboutUsSection .sp_pageHeader h5,
.sp_aboutUsSection .sp_pageHeader p,
.sp_aboutUsSection .sp_pageHeader h2 {
    text-align: left;
}
.sp_bgLightBlue {
    background-color: #F5F9FF;
    max-width: 1840px;
    padding: 0px 15px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 10px;
    padding: 85px 50px 85px;
}
.sp_imageListWrap {
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 20px;
    row-gap: 20px;
}
.sp_accordianBox_img{
    padding: 30px 0;
    height: 525px;
}
.sp_accordianBox_img img {
    transition: opacity 0.5s ease-in-out;
    box-shadow: none !important;
}
.sp_accordianBox_img img.fade-out {
    opacity: 0;
}
.sp_imageListWrap img{
    border-radius: 20px;
    box-shadow: 0px 4px 50.9px 0px #217BFF54;
}
.sp_aboutList_wrap li:last-child {
    margin-bottom: 0;
}
.sp_aboutList_wrap li {
    position: relative;
    padding-left: 30px;
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 15px;
    margin-bottom: 20px;
}
.sp_aboutList_wrap li img {
    position: absolute;
    left: 3px;
    top: 1px;
}
.sp_aboutList_wrap li span {
    color: var(--text-color);
    font-weight: 400;
    font-size: 16px;
    line-height: 20px;
    letter-spacing: 0;
}
.sp_aboutList_wrap li span.sp_darkText, 
.sp_darkText {
    color: var(--heading-color);
}
.sp_aboutList_wrap .sp_paddZero .rs-panel-btn span {
    font-size: 16px;
    font-weight: 500;
    letter-spacing: -0.1px;
    color: var(--heading-color);
}
.sp_aboutList_wrap .sp_paddZero.rs-panel-in .rs-panel-btn span{
    color: var(--primary-color);
} 
.sp_aboutList_wrap button.rs-panel-btn {
    background: transparent;
    border-radius: 0;
    cursor: pointer;
}
.sp_pageHeader.sp_innerTextLeft.sp_borderBottomHead h2 {
    font-size: 18px;
    font-weight: 500;
}
.sp_colWrap.h_full {
    height: 100%;
    display: inline-flex;
    margin: auto;
}


.sp_intregration_toolList {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 45px;
    flex-wrap: wrap;
}
.sp_serverBox_wrapper .sp_clientBox_wrap {
    padding: 0;
    background-color: transparent;
    border: 0px;
}
/* Oue Services Section Css */
.sp_innerTextLeft h5, 
.sp_innerTextLeft h2, 
.sp_innerTextLeft p {
    text-align: left;
}
.sp_paddZero{
    padding-left: 0px !important;
}
.marTop50{
    margin-top: 30px;
}
.sp_margBottom_25{
    margin-bottom: 25px;
}
.sp_aboutList_wrap li.sp_paddZero {
    padding-bottom: 10px !important;
    border-bottom: 1px solid #EFEFEF;
    padding-top: 10px;
}
/****** Autoresponder *******/
.bk_autoResponder_box {
    border: 1px solid rgba(241, 243, 251, 1);
    border-radius: 10px;
    padding: 26px;
    display: flex;
    width: 100%;
    align-items: start;
    justify-content: start;
    position: relative;
    background-color: #fff;
    flex-direction: column;
    max-width: calc(33.3% - 20px);
}
.bk_autoResponder_box h4 {
    margin-top: 0px;
    margin-bottom: 10px;
    font-weight: 600;
    font-size: 16px;
    line-height: 20px;
}
.sp_left_5 {
    position: relative;
    left: -10px;
}
.bk_autoResponder_box p {
    font-weight: 400;
    font-size: 15px;
    line-height: 18.98px;
    letter-spacing: 0.2px;
    text-align: left;
}
.sp_ourServiceSection .bk_autoResponder_box .bk_spacebetween {
    align-items: start;
}
.bk_spacebetween {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    width: 100%;
}
.bk_spaceStart .sp_left_5{
    left: 0;
}
.bk_spaceStart {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
    gap: 10px;
}
.bk_autoResponder_box .bk_spaceStart h4{
    margin-bottom: 0px;
}
.bk_autoResponder_Wrapper {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 20px;
    flex-wrap: wrap;
    margin-bottom: 30px;
    width: 100%;
}
.sp_serverBox_wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 25px;
    flex-wrap: wrap;
    margin-bottom: 0px;
}
/* Appointment Section Css */
.sp_clientBox_wrap {
    border: 1.25px solid #EFEFEF;
    background: #FFFFFF;
    border-radius: 20px;
    padding: 10px;
    display: flex;
    gap: 10px;
    flex-direction: column;
    justify-content: center;
    min-width: 270px;
    text-align: center;
}
.sp_appointmentSection_wrapper .sp_rowWrap {
    flex-wrap: wrap;
}
.sp_appointmentSection_wrapper .sp_colWrap {
    max-width: calc(16% - 15px);
    min-width: 265px;
}
.sp_clientBox_wrap h4{
    font-weight: 500;
    font-size: 18px;
    line-height: 34px;
    letter-spacing: -1px;
    text-align: center;
    text-transform: capitalize;
}
.sp_nextHead_wrapper{
    margin-top: 50px;
}
.sp_nextHead_wrapper .sp_clientBox_wrap h4 {
    margin-top: 10px;
}
.sp_clientBox_wrap .sp_colWrap {
    max-width: calc(50% - 15px);  
}
.sp_nextHead_wrapper .sp_clientBox_wrap {
    padding: 20px;
}
.sp_systemDetails_wrap h3 {
    font-weight: 600;
    font-size: 22px;
    line-height: 30px;
    letter-spacing: 0;
    text-transform: capitalize;
}
.sp_systemDetails_wrap p {
    font-weight: 400;
    line-height: 22px;
    letter-spacing: 0;
    margin-top: 20px;
    font-size: 16px;
    max-width: 570px;
}
.sp_systemDetails_wrap {
    padding-bottom: 25px;
    border-bottom: 1px solid #DCE7F6;
    margin-bottom: 25px;
}
.sp_servicesList_wrap{
    display: flex;
    flex-wrap: wrap;
    align-items: start;
    justify-content: start;
    gap: 30px;
    row-gap: 20px;
}
.sp_servicesList_wrap li {
    border: 1px solid #DCE7F6;
    max-width: calc(50% - 15px);
    padding: 0px 20px;
    line-height: 43px;
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: start;
    border-radius: 5px;
    letter-spacing: 0;    
    width: 100%;
}
.sp_servicesList_wrap li b{
    font-weight: 500;
    font-size: 16px;
    color: var(--heading-color);
}
.sp_sectionSpaceing {
    margin-top: 70px;
}
/* Testimonial Section Css */
.sp_testimonialBox {
    border: 1px solid #F0F0F0;
    border-radius: 10px;
    padding: 30px;
    position: relative;
    background-color: #fff;
}
.sp_testimonialBox p {
    text-align: left;
    margin-bottom: 20px;
}
.sp_bordered {
    border: 0px;
    border-top: 1px solid #F0F0F0 !important;
    background: transparent;
    border-style: solid;
    margin-bottom: 20px;
}
.sp_clientDetails .sp_clientView {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.sp_clientDetails {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}
.sp_nameDetaile {
    text-align: left;
}
.sp_nameDetaile h4 {
    font-weight: 500;
}
.sp_nameDetaile p {
    margin-bottom: 0;
    font-size: 14px;
}
.sp_quatRight {
    position: absolute;
    right: 40px;
    top: 15px;
}
/* Prizeing List Section */
/* .bk_planDetails .nav-link.ap_btn{
    margin-top: 20px;
} */
.bk_plan_detail h3 {
    font-weight: 600;
    font-size: 16px;
    line-height: 20.24px;
    color: #fff;
    margin: 0;
    line-height: 20.24px;
}

.bk_plan_detail span {
    font-weight: 400;
    font-size: 15px;
    line-height: 18.98px;
    color: #fff;
}

.bk_plan_detail h2 {
    font-weight: 600;
    font-size: 26px;
    line-height: 32.89px;
    color: #fff;
}

.bk_activePlan_wrap {
    padding: 20px;
    background-color: var(--primary-color);
    position: relative;
    border-radius: 6px;
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 45px;
}

.bk_activePlan_wrap:before {
    content: '';
    width: 100%;
    height: 1px;
    left: 0;
    right: 0;
    bottom: -25px;
    position: absolute;
    border-bottom: 0.58px solid rgba(241, 243, 251, 1);
}

.bk_plan_detail {
    padding-right: 20px;
    border-right: 1px solid rgba(255, 255, 255, 0.1);
    min-width: 185px;
}

.bk_planlistWrap {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 20px;
    flex-wrap: wrap;
    padding-left: 5px;
}

.bk_planlistWrap li {
    max-width: calc(50% - 10px);
    width: 100%;
    color: #fff;
    font-weight: 400;
    font-size: 16px;
    line-height: 21.24px;
    letter-spacing: 0.3px;
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 7px;
}
.bk_selectAvailable_plan .bk_plan_detail .ap_btn {
    margin-top: 15px;
    width: 100%;
}
.bk_selectAvailable_plan .bk_plan_detail .bk_planDetails {
    width: 100%;
    padding-bottom: 25px;
    border-bottom: 1px solid #eee;
}
.bk_planeFeatureList {
    margin-bottom: 20px;
    /* max-height: 350px;
    overflow: auto; */
}
.bk_whiteBtn {
    padding: 0px 20px;
    border: 0px;
    background-color: #fff;
    height: 45px;
    border-radius: 5px;
    cursor: pointer;
    transition: all 0.3s;
    color: var(--dark-color);
    outline: none;
}

.bk_whiteBtn:hover {
    background-color: var(--dark-color);
    color: #fff;
}
.bk_selectAvailable_plan {
    /* max-height: 750px;
    overflow: auto; */
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
}
.bk_selectAvailable_plan .bk_plan_detail {
    display: flex;
    align-items: start;
    justify-content: start;
    flex-wrap: wrap;
    flex-direction: column;
    gap: 10px;
    padding: 0;
    row-gap: 10px;
    border-right: 0px;
    width: 100%;
}

.bk_selectAvailable_plan .bk_activePlan_wrap {
    margin-bottom: 20px;
    background-color: var(--primary-color);
}

.bk_featuresWrapper {
    width: 100%;
}

.bk_planWrapper_element.bk_activePlan_wrap .bk_plan_detail button.ap_btn {
    background-color: #fff;
    color: var(--primary-color);
}

.bk_planWrapper_element.bk_activePlan_wrap .bk_planeFeatureList p {
    color: #fff;
}

.bk_planWrapper_element.bk_activePlan_wrap .bk_planeFeatureList p.isDisabled_plan svg path {
    fill: #fff;
}

.bk_planWrapper_element.bk_activePlan_wrap .bk_planeFeatureList p.isDisabled_plan {
    opacity: 0.5;
}

.bk_activePlan_wrap .bk_plan_detail .bk_planDetails .bk_displayPlanKey, .bk_plan_detail .bk_planDetails .bk_displayPlanKey {
    background: transparent;
    width: -moz-fit-content;
    width: fit-content;
    border-radius: 0;
    display: inline;
    padding: 0;
}

.bk_selectAvailable_plan .bk_plan_detail button.ap_btn {
    width: 100%;
    margin-top: 20px;
}

.bk_plansTab_switcher {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 20px;
    gap: 10px;
}
.bk_selectAvailable_plan.bk_landingPage_plans {
    max-height: max-content;
    overflow: auto;
}
.bk_selectAvailable_plan .bk_activePlan_wrap .bk_plan_detail h2, 
.bk_selectAvailable_plan .bk_activePlan_wrap .bk_plan_detail .bk_planDetails .bk_displayPlanKey {
    color: #fff;
}

.bk_selectAvailable_plan .bk_plan_detail h2, 
.bk_selectAvailable_plan .bk_plan_detail .bk_planDetails .bk_displayPlanKey {
    color: var(--heading-color);
}

.bk_selectAvailable_plan h2 {
    /* color: #fff; */
}

.bk_selectAvailable_plan .bk_activePlan_wrap::before {
    display: none;
}
.bk_planWrapper_element {
    padding: 20px;
    background-color: #fff;
    position: relative;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: start;
    flex-direction: column;
    gap: 15px;
    border: 1px solid rgba(239, 239, 239, 1);
    margin-bottom: 20px;
    cursor: pointer;
    max-width: calc(25% - 15px);
    width: 100%;
    min-width: 270px;
}

.bk_planWrapper_element .bk_plan_detail h3 {
    width: 100%;
    color: var(--heading-color);
    margin-bottom: 5px;
    text-align: left;
}

.bk_plan_detail .bk_planDetails span {
    font-weight: 400;
    font-size: 12px;
    line-height: 24px;
    display: flex;
    align-items: center;
    padding: 0 10px;
    border-radius: 50px;
    justify-content: center;
    background: rgba(255, 240, 218, 1);
    color: rgba(241, 156, 27, 1);
    width: -moz-fit-content;
    width: fit-content;
    margin-top: 10px;
}

.bk_planeFeatureList p:first-child {
    margin-top: 15px;
}

.bk_activePlan_wrap .bk_plan_detail .bk_planDetails span {
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
}

.bk_planWrapper_element> h2 {
    font-size: 26px;
    color: var(--title-color);
    font-weight: 600;
    line-height: 32.89px;
}

.bk_planWrapper_element> h2>span {
    font-weight: 400;
    font-size: 15px;
    line-height: 18.98px;
    color: var(--text-color);
}

.bk_planWrapper_element.bk_activePlan_wrap> h2>span {
    color: rgba(166, 197, 242, 1);
}

.bk_planWrapper_element.bk_activePlan_wrap> h2, .bk_planWrapper_element.bk_activePlan_wrap .bk_plan_detail h3 {
    color: #fff;
    text-align: left;
}

.bk_recommendedLabel {
    position: absolute;
    right: 20px;
    top: 1px;
    padding: 0px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--primary-color);
    line-height: 23px;
    background-color: #fff;
    border-radius: 0px 0px 5px 5px;
    font-size: 12px;
}

.bk_avalableList {
    max-width: calc(100% - 10px);
    width: 100%;
}

.bk_availablePlans {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
}

.bk_planDetails_wrapper {
    padding: 0px;
}

.bk_plansTab {
    display: flex;
    align-items: center;
    padding: 5px;
    background: #F5F9FF;
    width: -moz-fit-content;
    width: fit-content;
    list-style: none;
    margin-bottom: 20px;
    border-radius: 5px;
    overflow: hidden;
    border: 1px solid #F1F3FB;
    margin-left: auto;
    margin-right: auto;
    gap: 20px;
}

.bk_planTypes {
    padding: 10px 25px;
    border-radius: 5px;
    cursor: pointer;
    display: block;
    border: 0px;
    background-color: transparent;
    font-size: 16px;
    color: var(--text-color);
}

.bk_planTypes.bk_activeTab {
    background-color: var(--primary-color);
    color: #fff;
    outline: 0px !important;
}

.bk_planeFeatureList p {
    font-weight: 400;
    font-size: 15px;
    line-height: 24.24px;
    display: flex;
    align-items: start;
    justify-content: start;
    width: 100%;
    color: var(--heading-color);
    margin: 20px 0px 0px;
    gap: 5px;
}

.bk_avalableList > button.ap_btn {
    width: 100%;
}

.bk_planeFeatureList p.isDisabled_plan {
    color: var(--text-color);
}

.bk_planeFeatureList p.isDisabled_plan svg path {
    fill: rgba(138, 138, 138, 1);
}

.bk_planlistWrap li.isDisabled_plan {
    opacity: 0.5;
}
.bk_hiddenYearly .bk_hideDv,
.bk_hiddenYearly .bk_planDetails > span,
.bk_selectAvailable_plan strong.bk_monthlyPlan_amount,
.bk_selectAvailable_plan.bk_hiddenYearly strong.bk_yearlySavePlan {
    display: none !important;
}
.bk_selectAvailable_plan.bk_hiddenYearly strong.bk_monthlyPlan_amount {
    display: inline !important;
}
/* switch start */
.xs_switch {
    display: inline-block;
}

.xs_switch>input {
    position: absolute;
    left: -9999999px;
    opacity: 0;
}

.xs_switch>label {
    display: flex;
    align-items: center;
    cursor: pointer;
    gap: 10px;
    font-weight: 600;
    color: var(--color-body);
}

.xs_switch>label>.xs_switch_icon {
    width: 36px;
    height: 19px;
    min-width: 36px;
    border-radius: 20px;
    background-color: #F9F9F9;
    /* box-shadow: inset 0 -2px 3px rgba(0, 0, 0, .06); */
    position: relative;
    transition: all .3s cubic-bezier(.25, .8, .25, 1);
    border: 1px solid #A7A7A7;
}

.xs_switch>label>.xs_switch_icon:before {
    position: absolute;
    top: 1px;
    left: 2px;
    content: "";
    width: 15px;
    height: 15px;
    border-radius: 12px;
    background-color: #b3b3b3;
    transition: all .3s cubic-bezier(.25, .8, .25, 1);
}

.xs_switch input:checked~label {
    color: #26C117;
}

.xs_switch input:checked~label>.xs_switch_icon {
    background-color: #f7fff6;
    border-color: #26C117;
}

.xs_switch input:checked~label>.xs_switch_icon:before {
    left: 17px;
    background-color: #26C117;
}

/* switch end */
/* Footer/Contact Section Css */
.sp_footerWraper {
    position: relative;
    padding: 60px 0 0;
}
.sp_footerWraper:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    bottom: 0;
    background-color: #070D20;
    left: 0;
}
.sp_contactDv_wrapper{
    background-color: var(--primary-color);
    border-radius: 10px;
    overflow: hidden;
    position: relative;
}
.sp_clientTestimonialsSwiper .swiper-wrapper {
    padding-bottom: 0;
}


.sp_contactImg_dv {
    padding: 30px;
    height: 450px;
    display: flex;
    align-items: end;
    justify-content: start;
    gap: 15px;
    position: relative;
    background-size: cover;
    background-position: top left;
}
span.sp_boxOverlay {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 100%);
    position: absolute;
    height: 50%;
    width: 100%;
    left: 0;
    bottom: 0;
    z-index: 1;
}
.sp_contactDetails {
    position: relative;
    z-index: 2;
    color: #fff;
    display: flex;
    justify-content: space-around;
    max-width: max-content;
    margin: auto;
    background-color: rgb(255 255 255 / 10%);
    border-radius: 10px;
    padding: 15px 25px;
    gap: 20px;
}
.sp_contactDetails p{
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 10px;
    margin-bottom: 20px;
    color: #fff;
    font-weight: 400;
    font-size: 15px;
    line-height: 100%;
    letter-spacing: 0;
    text-transform: none;
}
.sp_contactDetails p:last-child{
    margin-bottom: 0;
}
.sp_contactForm_wrapper p {
    font-size: 15px;
    color: #fff;
    margin-bottom: 30px;
}
.sp_contactForm_wrapper h3 {
    font-weight: 700;
    font-size: 26px;
    line-height: 34px;
    letter-spacing: 0;
    text-transform: capitalize;
    color: #fff;
    margin-bottom: 10px;
}
.sp_formWrap {
    display: flex;
    flex-direction: column;
    color: #fff;
}
.sp_contactForm_wrapper {
    padding: 20px;
}
.sp_formWrap label{
    margin-bottom: 8px;
}
.sp_formWrap input, .sp_formWrap textarea {
    border: 1px solid rgb(239, 239, 239, 0.14);
    height: 45px;
    border-radius: 5px;
    padding: 10px 20px;
    background-color: transparent;
    margin-bottom: 20px;
    color: #fff;
}
.sp_formWrap input::placeholder, 
.sp_formWrap textarea::placeholder{
    color: rgba(255, 255, 255, 0.5);
}
.sp_submitbtn {
    background: #070D20;
    color: #fff;
    border: 0;
    outline: none;
    height: 45px;
    font-size: 16px;
    padding: 0px 32px;
    border-radius: 5px;
    transition: all 0.3s;
    cursor: pointer;
}
.sp_submitbtn:hover {
    background: #fff;
    color: #070D20;
}
.sp_formWrap textarea {
    height: auto;
}
.sp_lastFooter {
    margin-top: 0px;
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    padding-bottom: 60px;
    text-align: center;
}
.sp_logoSection {
    max-width: 750px;
    width: 100%;
}
.sp_logoSection img{
    max-width: 200px;
}
.sp_logoSection > p {
    margin: 20px 0;
}
.sp_menuList_wrap h4 {
    color: #fff;
    margin-bottom: 15px;
}
.sp_footLink {
    color: #A6A9B0;
    font-weight: 400;
    font-size: 16px;
    line-height: 34px;
    letter-spacing: 0;
    text-transform: capitalize;
    transition: all 0.3s;
}
.sp_footLink:hover {
    color: #fff;
}
.sp_footerMenu {
    display: flex;
    align-items: center;
    justify-content: space-around;
    width: calc(100% - 330px);
    gap: 20px;
}
.sp_menuList_wrap.sp_twiceMenu ul {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    justify-content: start;
    row-gap: 0px;
}
.sp_menuList_wrap.sp_twiceMenu ul li{
    max-width: calc(50% - 15px);
    width: 100%;
}
.sp_menuList_wrap.sp_twiceMenu {
    max-width: 45%;
}
.sp_socialList {
    display: flex;
    align-items: center;
    gap: 25px;
    justify-content: start;
}
.sp_copyRight_footer {
    position: relative;
    z-index: 2;
    border-top: 1px solid rgba(255 255 255 / 10%);
    max-width: 1840px;
    margin-left: auto;
    margin-right: auto;
}
.sp_dFlexRow{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
    padding: 15px 0;
}
.sp_copyRight_footer p {
    color: #A6A9B0;
}
.sp_iconLink{
    color: var(--text-color);
}
.sp_iconLink:hover{
    color: var(--white-color);
}
.sp_logoSlider_wrapper .swiper-wrapper {
    padding: 0px;
}
.sp_pageHeader.sp_innerTextLeft.sp_borderBottomHead {
    border-bottom: 1px solid #EFEFEF;
    margin-bottom: 0px;
    padding-bottom: 20px;
}
.sp_aboutList_wrap li.sp_paddZero:last-child {
    border-bottom: 0px !important;
}
.sp_logoSection > p.sp_footLink {
    line-height: 22px;
}
.sp_contactDetails .sp_footLink {
    gap: 10px;
    display: flex;
    align-items: center;
    text-transform: none;
}
.sp_imageListWrap.pt-0.pb-0 {
    padding: 0;
}
.sp_contactForm_wrapper .input_wrapper>label {
    margin-bottom: 8px;
    color: #fff;
    font-size: 16px;
    font-weight: 400;
}
.sp_contactForm_wrapper .input_wrapper {
    margin-bottom: 0;
}
.sp_contactForm_wrapper .input_wrapper>.input {
    background-color: transparent;
    border: 1px solid rgb(239 239 239 / 14%);
    color: #fff;
}
.sp_contactForm_wrapper .input_wrapper>.input::placeholder {
    color: rgba(255 255 255 / 50%);
    font-weight: 300;
}
.sp_contactForm_wrapper .input_wrapper>.input:focus{
    border: 1px solid #fff;
}
.sp_contactForm_wrapper .input_wrapper>textarea.input {
    margin-bottom: 20px;
}
.bhub_required {
    color: #fff;
}
.sp_contactForm_wrapper .sp_formWrap > span.error {
    position: relative;
    bottom: 15px;
    color: rgb(255 255 255 / 50%);
}
.accordion-item.sp_paddZero, .accordion-item.sp_paddZero .accordion-button {
    background-color: transparent;
    border: 0;
    border-radius: 0px;
}
.sp_paddZero .accordion-button:focus{
    outline: none;
    box-shadow: none;
}
.sp_paddZero.accordion-item:first-of-type>.accordion-header .accordion-button {
    border-radius: 0;
    background: transparent;
}
.sp_aboutList_wrap .sp_paddZero button.accordion-button {
    color: var(--primary-color);
    font-size: 16px;
    font-weight: 500;
    letter-spacing: -0.1px;
    border-bottom: 1px solid #E5E5EA;
}
.sp_aboutList_wrap .sp_paddZero button.accordion-button.collapsed {
    color: var(--heading-color);
}
.sp_aboutList_wrap .sp_paddZero button.accordion-button{
    padding: 1rem 0px;
}
.sp_paddZero .accordion-body p {
    color: var(--text-color);
}
.sp_paddZero .accordion-body{
    padding-left: 0;
    padding-right: 0;
}
.sp_paddZero .accordion-button::after{
    background-size: 14px;
}

/* privacy-content-start */
.pp-privacy-box .pp-privacy-name{
       font-size: 28px;
    font-weight: 700;
    margin-bottom: 15px;
    text-transform: capitalize;
}
.pp-privacy-box .pp-privacy-detail{
    font-size: 14px;
    font-weight: 400;
    color: #555;
}
.pp-privacy-inner .pp-privacy-heading{
    font-size: 18px;
    font-weight: 600;
    margin: 20px 0 5px;
    margin-bottom: 15px;
}
.pp-privacy-inner .pp-privacy-subheading{
      font-size: 14px;
    font-weight: 400;
    color: #555;
    text-transform: none;
}
.pp-privacy-inner .pp-privacy-ul {
    margin-left: 20px;
    list-style: disc;
    margin-top: 15px;
}
.pp-privacy-inner .pp-privacy-ul li{
      font-size: 16px;
    font-weight: 600;
    color: #222;
    padding-bottom: 5px;
}
.pp-privacy-inner .pp-privacy-ul li span{
    padding-bottom: 10px;
}
.pp-privacy-inner .pp-privacy-ul .pp-li-detail{
        font-size: 14px;
    font-weight: 400;
    color: #555;
    
}
.pp-content-wrapper {
    padding-top: 65px;
    padding-bottom: 65px;
}
.sp_navTabsAutoChange {
    background: #EAF2FF;
    border: 1px solid #D3E3FE;
    border-radius: 10px;
    width: fit-content;
    max-width: 820px;
    margin-bottom: 30px;
    margin-left: auto;
    margin-right: auto;
        padding: 5px;
}
.sp_navTabsAutoChange .nav-link {
    border-radius: 5px !important;
    min-width: 200px;
    text-align: center;
    padding: 12px 10px;
}
.sp_navTabsAutoChange .nav-link.active {
    background: #217BFF;
    color: #ffff;
}
.tab-content.sp_tabContent_dv {
    border: 1px solid #DCE7F6;
    background: #F5F9FF;
    border-radius: 15px;
    padding: 20px;
    text-align: center;
}
/* FAQ CSS */
.sp_faqAccordion .accordion-item {
    background-color: transparent;
    border-radius: 10px;
    margin-bottom: 30px;
    border: 1px solid #dee2e6;
}
.sp_faqAccordion .accordion-item button.accordion-button {
    background: transparent;
    box-shadow: none;
}
.bk_plan_detail .bk_planDetails .bk_startAt_txt {
    color: var(--dark-color);
    font-size: 15px;
}
.sp_faqAccordion .accordion-collapse.collapse.show {
    border-top: 1px solid #dedede;
}
.sp_faqAccordion .accordion-item button.accordion-button[aria-expanded="false"]:after {
    transform: none !important;
}
.sp_faqAccordion .accordion-body p {
    color: #8d8d8d;
    font-size: 15px;
}
.sp_faqAccordion .accordion-body ul{
    padding-left: 20px;
}
.sp_faqAccordion .accordion-body ul li {
    line-height: 28px;
    font-size: 14px;
    list-style: disc;
}
/********************************************************
    .Responsive  CSS Start
********************************************************/
@media screen and (min-width: 992px) {
    .bk_logoMenu_wrap{
        display: none !important;
    }
}

@media(max-width:1200px) {
    .sp_aboutImg {
        max-width: calc(50% - 10px);
    }
    .sp_lastYellowBoxWrap{
        flex-wrap: wrap;
    }
    .sp_setBoxImg, .sp_boxContent_wrap {
        max-width: calc(100% - 0px);
    }
    .sp_headerSpace_wrap .sp_navbarCollapse .nav-link{
        padding: 0px 15px;
    }
    .sp_servicesList_wrap li {
        max-width: calc(50% - 5px);
        padding: 0px 10px;
        line-height: 40px;
        gap: 5px;
    }
    .sp_servicesList_wrap li b {
        font-size: 14px;
    }
    .sp_servicesList_wrap {
        gap: 10px;
        row-gap: 10px;
    }
    .sp_systemDetails_wrap h3 {
        font-size: 18px;
        line-height: 15px;
    }
    .sp_systemDetails_wrap p {
        margin-top: 15px;
        font-size: 14px;
    }
}
@media(max-width:1024px){
    .sp_footLink, .sp_copyRight_footer p, .sp_logoSection > p, .sp_contactDetails p {
        font-size: 14px;
        line-height: 24px;
    }  
    .sp_menuList_wrap.sp_twiceMenu ul {
        gap: 5px;
    }
    .sp_menuList_wrap.sp_twiceMenu ul li {
        max-width: calc(50% - 5px);
        width: 100%;
    }
    .sp_pageHeader.sp_innerTextLeft {
        margin: 0px !important;
    }
}

@media(max-width:991px){
    /* menu */
    .sp_headerSpace_wrap .navbar-expand-lg .sp_navbarCollapse {
        position: fixed;
        left: -260px;
        top: 0;
        bottom: 0;
        width: 260px;
        background-color: #eaf1fa;
        transition: all 0.3s ease-in-out;
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        justify-content: start;
        flex-direction: column;
        padding: 20px 10px;
    }
    .sp_headerSpace_wrap .sp_navbarCollapse .nav-link {
        padding: 10px 15px;
        color: var(--heading-color);
        width: 100%;
        display: block;
        border-bottom: 1px solid rgb(0 0 0 / 5%);
    }
    .menu_open .sidebar_overlay {
        opacity: 1;
        visibility: visible;
    }
    .menu_open .sp_headerSpace_wrap .navbar-expand-lg .sp_navbarCollapse {        
        left: 0;
        gap: 0;
    }
    .sp_headerSpace_wrap .sp_navbarCollapse .nav-link.sp_btn {
        padding: 0 20px;
        text-align: center;
        margin-top: 20px;
    }
    .sidebar_overlay {
        position: fixed;
        background: rgb(0 0 0 / 45%);
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        opacity: 0;
        visibility: hidden;
        z-index: 99;
        cursor: default;
        transition: var(--transition);
    }
    .bk_logoMenu_wrap {
        margin-bottom: 20px;
        border-bottom: 1px solid rgba(0 0 0 / 5%);
        padding-bottom: 20px;
    }
    /* toggle button */
    /* toggle button start */
    .pre_toggle_menu {
        display: inline-block;
        background: var(--primary-color);
        border-radius: 2px;
        margin-left: 10px;
    }
    .pre_toggle_menu > svg {
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
        transition: transform 400ms;
        -moz-user-select: none;
        -webkit-user-select: none;
        user-select: none;
        width: 35px;
    }
    .menu_open .pre_toggle_menu > svg {
        transform: rotate(45deg);
    }
    .pre_toggle_btn_line {
        fill:none;
        transition: stroke-dasharray 400ms, stroke-dashoffset 400ms;
        stroke:var(--white-color);
        stroke-width:4;
        stroke-linecap:round;
    }
    .pre_toggle_menu .top {
        stroke-dasharray: 40 121;
    }
    .pre_toggle_menu .bottom {
        stroke-dasharray: 40 121;
    }
    .menu_open .pre_toggle_menu .top {
        stroke-dashoffset: -68px;
    }
    .menu_open .pre_toggle_menu .bottom {
        stroke-dashoffset: -68px;
    }
    /* toggle button */
    .sp_headerSpace_wrap .sp_navbarCollapse .nav-item {
        display: block;
        text-align: left;
        width: 100%;
    }
    .sp_navbarCollapse .navbar-nav {
        display: block;
        width: 100%;
    }
    /* menu */
    .bk_planWrapper_element {
        max-width: calc(50% - 15px);
    }
    .sp_aboutUsSection .sp_rowWrap {
        flex-wrap: wrap;
    }
    .sp_GrowthSection .sp_rowWrap,
    .sp_bgWhite .sp_rowWrap{
        align-items: start;
    }
    .bk_selectAvailable_plan {
        max-height: max-content;
    }
    .sp_pageSection_wrapper {
        padding: 50px 0px 50px;
    }
    .sp_contactDv_wrapper .sp_rowWrap {
        flex-wrap: wrap;
    }
    .sp_menuList_wrap.sp_twiceMenu {
        max-width: 100%;
    }
    .sp_footerMenu {
        align-items: start;
        justify-content: start;
        flex-wrap: wrap;
    }
    .sp_lastFooter {    
        align-items: start;
        justify-content: start;
    }
    .sp_reverseOrder_wrapper .sp_rowWrap.sp_sectionSpaceing {
        flex-wrap: wrap;
        margin-top: 50px;
        text-align: center;
    }
     .sp_reverseOrder_wrapper .sp_rowWrap.sp_sectionSpaceing .sp_systemDetails_wrap p {
        margin-left: auto;
        margin-right: auto;
    }
    .sp_reverseOrder_wrapper .sp_rowWrap.sp_sectionSpaceing:nth-child(2n) .sp_colWrap:first-child {
        order: 2;
    }
    .sp_navTabsAutoChange .nav-link {
        min-width: fit-content;
        padding: 12px 10px;
        font-size: 12px;
    }
}
@media(max-width:768px){
    .bk_autoResponder_box {
        max-width: calc(50% - 15px);
    }
    .sp_GrowthSection .sp_rowWrap,
    .sp_bgWhite .sp_rowWrap, .sp_imageListWrap{
        flex-wrap: wrap;
        justify-content: start;
    }
    .sp_lastFooter{
        flex-wrap: wrap;
    }
    .sp_logoSection, .sp_footerMenu {
        max-width: 100%;
        width: 100%;
    }
    .sp_menuList_wrap {
        max-width: calc(50% - 20px);
        width: 100%;
    }
    .sp_contactImg_dv {
        padding: 30px 20px;
        height: 450px;
    } 
    .sp_boxHead h4 {
        font-size: 15px;
    }  
    .sp_boxWrapper p, .sp_pageHeader p {
        font-size: 14px;
        line-height: 20.5px;
    } 
    .sp_lastYellowBoxWrap .sp_boxHead h4 {
        font-size: 16px;
        line-height: normal;
    }
    .sp_pageHeader h2 {
        font-size: 22px;
    }
    .sp_aboutList_wrap li span {
        font-size: 14px;
        line-height: normal;
    }
    .sp_aboutList_wrap li img {
        top: 1px;
    }
    .sp_aboutList_wrap li {
        margin-bottom: 20px;
    }
    .sp_clientBox_wrap .sp_colWrap {
        min-width: 100%;
    }
    .sp_copyRight_footer .sp_dFlexRow {
        align-items: center;
        justify-content: center;
    }
    br {
        display: none !important;
    }
    .sp_appointmentSection_wrapper .container-fluid.p-0 {
        padding: 0px 20px !important;
    }
    .sp_intregration_toolList {
        gap: 10px;
    }
}

@media(max-width:620px){    
    .bk_autoResponder_box {
        max-width: calc(100% - 10px);
    }
    .sp_setBoxImg {
        flex-wrap: wrap;
    }
    .sp_buttonWrap_dv, .sp_buttonWrap_dv .sp_btn{
        width: 100%;
        max-width: 100%;
    }
    .sp_bannerSection .swiper-wrapper .swiper-slide:nth-child(odd),
    .sp_bannerSection .swiper-wrapper .swiper-slide:nth-child(even){
        margin-top: 0px;
    }
    .sp_bgLightBlue{
        padding-left: 0px;
        padding-right: 0;
    }
    .sp_navTabsAutoChange {
        flex-direction: column;
        width: 100%;
    }
}
@media(max-width:575px){
    .sp_bannerSection h2, .sp_bannerSection h1 {
        font-size: 28px;
        line-height: 34px;
    } 
    br{
        display: none;
    }
    .sp_bannerSection p {
        font-size: 14px;
        line-height: 24px;
    }
    .sp_btn {
        padding: 0px 15px;
        font-size: 14px;
        line-height: 40px;
    }
    .sp_banner_slider {
        padding: 0px 20px;
    }
    .sp_rowWrap {
        flex-wrap: wrap;
    }
    .sp_setBox_image {
        width: 100%;
    }
    .sp_dFlexRow {
        justify-content: center;
    }
    .bk_planWrapper_element {
        max-width: calc(100% - 0px);
    }
    .bk_planTypes {
        padding: 10px 15px;
        font-size: 14px;
        text-align: center;
    }
    .bk_planTypes_menu {
        font-size: 14px;
    }
    .bk_planeFeatureList p {
        font-size: 14px;
        margin: 15px 0px 0px;
    }
    
}

next-route-announcer {
    display: none;
}

/* FONT_START */
@font-face {
  font-family: 'swiper-icons';
  src: url('data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA');
  font-weight: 400;
  font-style: normal;
}
/* FONT_END */
:root {
  --swiper-theme-color: #007aff;
  /*
  --swiper-preloader-color: var(--swiper-theme-color);
  --swiper-wrapper-transition-timing-function: initial;
  */
}
:host {
  position: relative;
  display: block;
  margin-left: auto;
  margin-right: auto;
  z-index: 1;
}
.swiper {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  /* Fix of Webkit flickering */
  z-index: 1;
  display: block;
}
.swiper-vertical > .swiper-wrapper {
  flex-direction: column;
}
.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
  box-sizing: content-box;
}
.swiper-android .swiper-slide,
.swiper-ios .swiper-slide,
.swiper-wrapper {
  transform: translate3d(0px, 0, 0);
}
.swiper-horizontal {
  touch-action: pan-y;
}
.swiper-vertical {
  touch-action: pan-x;
}
.swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  transition-property: transform;
  display: block;
}
.swiper-slide-invisible-blank {
  visibility: hidden;
}
/* Auto Height */
.swiper-autoheight,
.swiper-autoheight .swiper-slide {
  height: auto;
}
.swiper-autoheight .swiper-wrapper {
  align-items: flex-start;
  transition-property: transform, height;
}
.swiper-backface-hidden .swiper-slide {
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}
/* 3D Effects */
.swiper-3d.swiper-css-mode .swiper-wrapper {
  perspective: 1200px;
}
.swiper-3d .swiper-wrapper {
  transform-style: preserve-3d;
}
.swiper-3d {
  perspective: 1200px;
}
.swiper-3d .swiper-slide,
.swiper-3d .swiper-cube-shadow {
  transform-style: preserve-3d;
}
/* CSS Mode */
.swiper-css-mode > .swiper-wrapper {
  overflow: auto;
  scrollbar-width: none;
  /* For Firefox */
  -ms-overflow-style: none;
  /* For Internet Explorer and Edge */
}
.swiper-css-mode > .swiper-wrapper::-webkit-scrollbar {
  display: none;
}
.swiper-css-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: start start;
}
.swiper-css-mode.swiper-horizontal > .swiper-wrapper {
  scroll-snap-type: x mandatory;
}
.swiper-css-mode.swiper-vertical > .swiper-wrapper {
  scroll-snap-type: y mandatory;
}
.swiper-css-mode.swiper-free-mode > .swiper-wrapper {
  scroll-snap-type: none;
}
.swiper-css-mode.swiper-free-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: none;
}
.swiper-css-mode.swiper-centered > .swiper-wrapper::before {
  content: '';
  flex-shrink: 0;
  order: 9999;
}
.swiper-css-mode.swiper-centered > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: center center;
  scroll-snap-stop: always;
}
.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper > .swiper-slide:first-child {
  -webkit-margin-start: var(--swiper-centered-offset-before);
          margin-inline-start: var(--swiper-centered-offset-before);
}
.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper::before {
  height: 100%;
  min-height: 1px;
  width: var(--swiper-centered-offset-after);
}
.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper > .swiper-slide:first-child {
  -webkit-margin-before: var(--swiper-centered-offset-before);
          margin-block-start: var(--swiper-centered-offset-before);
}
.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper::before {
  width: 100%;
  min-width: 1px;
  height: var(--swiper-centered-offset-after);
}
/* Slide styles start */
/* 3D Shadows */
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
}
.swiper-3d .swiper-slide-shadow {
  background: rgba(0, 0, 0, 0.15);
}
.swiper-3d .swiper-slide-shadow-left {
  background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-right {
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-top {
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-bottom {
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-lazy-preloader {
  width: 42px;
  height: 42px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -21px;
  margin-top: -21px;
  z-index: 10;
  transform-origin: 50%;
  box-sizing: border-box;
  border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
  border-radius: 50%;
  border-top-color: transparent;
}
.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,
.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader {
  animation: swiper-preloader-spin 1s infinite linear;
}
.swiper-lazy-preloader-white {
  --swiper-preloader-color: #fff;
}
.swiper-lazy-preloader-black {
  --swiper-preloader-color: #000;
}
@keyframes swiper-preloader-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/* Slide styles end */
.swiper-virtual .swiper-slide {
  -webkit-backface-visibility: hidden;
  transform: translateZ(0);
}
.swiper-virtual.swiper-css-mode .swiper-wrapper::after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
}
.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after {
  height: 1px;
  width: var(--swiper-virtual-size);
}
.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after {
  width: 1px;
  height: var(--swiper-virtual-size);
}
:root {
  --swiper-navigation-size: 44px;
  /*
  --swiper-navigation-top-offset: 50%;
  --swiper-navigation-sides-offset: 10px;
  --swiper-navigation-color: var(--swiper-theme-color);
  */
}
.swiper-button-prev,
.swiper-button-next {
  position: absolute;
  top: var(--swiper-navigation-top-offset, 50%);
  width: calc(var(--swiper-navigation-size) / 44 * 27);
  height: var(--swiper-navigation-size);
  margin-top: calc(0px - (var(--swiper-navigation-size) / 2));
  z-index: 10;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--swiper-navigation-color, var(--swiper-theme-color));
}
.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled {
  opacity: 0.35;
  cursor: auto;
  pointer-events: none;
}
.swiper-button-prev.swiper-button-hidden,
.swiper-button-next.swiper-button-hidden {
  opacity: 0;
  cursor: auto;
  pointer-events: none;
}
.swiper-navigation-disabled .swiper-button-prev,
.swiper-navigation-disabled .swiper-button-next {
  display: none !important;
}
.swiper-button-prev svg,
.swiper-button-next svg {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform-origin: center;
}
.swiper-rtl .swiper-button-prev svg,
.swiper-rtl .swiper-button-next svg {
  transform: rotate(180deg);
}
.swiper-button-prev,
.swiper-rtl .swiper-button-next {
  left: var(--swiper-navigation-sides-offset, 10px);
  right: auto;
}
.swiper-button-next,
.swiper-rtl .swiper-button-prev {
  right: var(--swiper-navigation-sides-offset, 10px);
  left: auto;
}
.swiper-button-lock {
  display: none;
}
/* Navigation font start */
.swiper-button-prev:after,
.swiper-button-next:after {
  font-family: swiper-icons;
  font-size: var(--swiper-navigation-size);
  text-transform: none !important;
  letter-spacing: 0;
  /* font-feature-settings: ; */
  font-variant: initial;
  line-height: 1;
}
.swiper-button-prev:after,
.swiper-rtl .swiper-button-next:after {
  content: 'prev';
}
.swiper-button-next,
.swiper-rtl .swiper-button-prev {
  right: var(--swiper-navigation-sides-offset, 10px);
  left: auto;
}
.swiper-button-next:after,
.swiper-rtl .swiper-button-prev:after {
  content: 'next';
}
/* Navigation font end */
.swiper-pagination {
  position: absolute;
  text-align: center;
  transition: 300ms opacity;
  transform: translate3d(0, 0, 0);
  z-index: 10;
}
.swiper-pagination.swiper-pagination-hidden {
  opacity: 0;
}
.swiper-pagination-disabled > .swiper-pagination,
.swiper-pagination.swiper-pagination-disabled {
  display: none !important;
}
/* Common Styles */
.swiper-pagination-fraction,
.swiper-pagination-custom,
.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal {
  bottom: var(--swiper-pagination-bottom, 8px);
  top: var(--swiper-pagination-top, auto);
  left: 0;
  width: 100%;
}
/* Bullets */
.swiper-pagination-bullets-dynamic {
  overflow: hidden;
  font-size: 0;
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transform: scale(0.33);
  position: relative;
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
  transform: scale(1);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
  transform: scale(1);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
  transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
  transform: scale(0.33);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
  transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
  transform: scale(0.33);
}
.swiper-pagination-bullet {
  width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));
  height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));
  display: inline-block;
  border-radius: var(--swiper-pagination-bullet-border-radius, 50%);
  background: var(--swiper-pagination-bullet-inactive-color, #000);
  opacity: var(--swiper-pagination-bullet-inactive-opacity, 0.2);
}
button.swiper-pagination-bullet {
  border: none;
  margin: 0;
  padding: 0;
  box-shadow: none;
  -webkit-appearance: none;
          -moz-appearance: none;
       appearance: none;
}
.swiper-pagination-clickable .swiper-pagination-bullet {
  cursor: pointer;
}
.swiper-pagination-bullet:only-child {
  display: none !important;
}
.swiper-pagination-bullet-active {
  opacity: var(--swiper-pagination-bullet-opacity, 1);
  background: var(--swiper-pagination-color, var(--swiper-theme-color));
}
.swiper-vertical > .swiper-pagination-bullets,
.swiper-pagination-vertical.swiper-pagination-bullets {
  right: var(--swiper-pagination-right, 8px);
  left: var(--swiper-pagination-left, auto);
  top: 50%;
  transform: translate3d(0px, -50%, 0);
}
.swiper-vertical > .swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0;
  display: block;
}
.swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
}
.swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,
.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  display: inline-block;
  transition: 200ms transform,
        200ms top;
}
.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px);
}
.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
}
.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transition: 200ms transform,
        200ms left;
}
.swiper-horizontal.swiper-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transition: 200ms transform,
    200ms right;
}
/* Fraction */
.swiper-pagination-fraction {
  color: var(--swiper-pagination-fraction-color, inherit);
}
/* Progress */
.swiper-pagination-progressbar {
  background: var(--swiper-pagination-progressbar-bg-color, rgba(0, 0, 0, 0.25));
  position: absolute;
}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  background: var(--swiper-pagination-color, var(--swiper-theme-color));
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  transform: scale(0);
  transform-origin: left top;
}
.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  transform-origin: right top;
}
.swiper-horizontal > .swiper-pagination-progressbar,
.swiper-pagination-progressbar.swiper-pagination-horizontal,
.swiper-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite {
  width: 100%;
  height: var(--swiper-pagination-progressbar-size, 4px);
  left: 0;
  top: 0;
}
.swiper-vertical > .swiper-pagination-progressbar,
.swiper-pagination-progressbar.swiper-pagination-vertical,
.swiper-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite {
  width: var(--swiper-pagination-progressbar-size, 4px);
  height: 100%;
  left: 0;
  top: 0;
}
.swiper-pagination-lock {
  display: none;
}
:root {
  /*
  --swiper-scrollbar-border-radius: 10px;
  --swiper-scrollbar-top: auto;
  --swiper-scrollbar-bottom: 4px;
  --swiper-scrollbar-left: auto;
  --swiper-scrollbar-right: 4px;
  --swiper-scrollbar-sides-offset: 1%;
  --swiper-scrollbar-bg-color: rgba(0, 0, 0, 0.1);
  --swiper-scrollbar-drag-bg-color: rgba(0, 0, 0, 0.5);
  --swiper-scrollbar-size: 4px;
  */
}
.swiper-scrollbar {
  border-radius: var(--swiper-scrollbar-border-radius, 10px);
  position: relative;
  touch-action: none;
  background: var(--swiper-scrollbar-bg-color, rgba(0, 0, 0, 0.1));
}
.swiper-scrollbar-disabled > .swiper-scrollbar,
.swiper-scrollbar.swiper-scrollbar-disabled {
  display: none !important;
}
.swiper-horizontal > .swiper-scrollbar,
.swiper-scrollbar.swiper-scrollbar-horizontal {
  position: absolute;
  left: var(--swiper-scrollbar-sides-offset, 1%);
  bottom: var(--swiper-scrollbar-bottom, 4px);
  top: var(--swiper-scrollbar-top, auto);
  z-index: 50;
  height: var(--swiper-scrollbar-size, 4px);
  width: calc(100% - 2 * var(--swiper-scrollbar-sides-offset, 1%));
}
.swiper-vertical > .swiper-scrollbar,
.swiper-scrollbar.swiper-scrollbar-vertical {
  position: absolute;
  left: var(--swiper-scrollbar-left, auto);
  right: var(--swiper-scrollbar-right, 4px);
  top: var(--swiper-scrollbar-sides-offset, 1%);
  z-index: 50;
  width: var(--swiper-scrollbar-size, 4px);
  height: calc(100% - 2 * var(--swiper-scrollbar-sides-offset, 1%));
}
.swiper-scrollbar-drag {
  height: 100%;
  width: 100%;
  position: relative;
  background: var(--swiper-scrollbar-drag-bg-color, rgba(0, 0, 0, 0.5));
  border-radius: var(--swiper-scrollbar-border-radius, 10px);
  left: 0;
  top: 0;
}
.swiper-scrollbar-cursor-drag {
  cursor: move;
}
.swiper-scrollbar-lock {
  display: none;
}
/* Zoom container styles start */
.swiper-zoom-container {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.swiper-zoom-container > img,
.swiper-zoom-container > svg,
.swiper-zoom-container > canvas {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
/* Zoom container styles end */
.swiper-slide-zoomed {
  cursor: move;
  touch-action: none;
}
/* a11y */
.swiper .swiper-notification {
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
  opacity: 0;
  z-index: -1000;
}
.swiper-free-mode > .swiper-wrapper {
  transition-timing-function: ease-out;
  margin: 0 auto;
}
.swiper-grid > .swiper-wrapper {
  flex-wrap: wrap;
}
.swiper-grid-column > .swiper-wrapper {
  flex-wrap: wrap;
  flex-direction: column;
}
.swiper-fade.swiper-free-mode .swiper-slide {
  transition-timing-function: ease-out;
}
.swiper-fade .swiper-slide {
  pointer-events: none;
  transition-property: opacity;
}
.swiper-fade .swiper-slide .swiper-slide {
  pointer-events: none;
}
.swiper-fade .swiper-slide-active {
  pointer-events: auto;
}
.swiper-fade .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}
.swiper.swiper-cube {
  overflow: visible;
}
.swiper-cube .swiper-slide {
  pointer-events: none;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  z-index: 1;
  visibility: hidden;
  transform-origin: 0 0;
  width: 100%;
  height: 100%;
}
.swiper-cube .swiper-slide .swiper-slide {
  pointer-events: none;
}
.swiper-cube.swiper-rtl .swiper-slide {
  transform-origin: 100% 0;
}
.swiper-cube .swiper-slide-active,
.swiper-cube .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}
.swiper-cube .swiper-slide-active,
.swiper-cube .swiper-slide-next,
.swiper-cube .swiper-slide-prev {
  pointer-events: auto;
  visibility: visible;
}
.swiper-cube .swiper-cube-shadow {
  position: absolute;
  left: 0;
  bottom: 0px;
  width: 100%;
  height: 100%;
  opacity: 0.6;
  z-index: 0;
}
.swiper-cube .swiper-cube-shadow:before {
  content: '';
  background: #000;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  filter: blur(50px);
}
.swiper-cube .swiper-slide-next + .swiper-slide {
  pointer-events: auto;
  visibility: visible;
}
/* Cube slide shadows start */
.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top,
.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-bottom,
.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-left,
.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-right {
  z-index: 0;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}
/* Cube slide shadows end */
.swiper.swiper-flip {
  overflow: visible;
}
.swiper-flip .swiper-slide {
  pointer-events: none;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  z-index: 1;
}
.swiper-flip .swiper-slide .swiper-slide {
  pointer-events: none;
}
.swiper-flip .swiper-slide-active,
.swiper-flip .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}
/* Flip slide shadows start */
.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-top,
.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-bottom,
.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-left,
.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-right {
  z-index: 0;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}
/* Flip slide shadows end */
.swiper-creative .swiper-slide {
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  overflow: hidden;
  transition-property: transform, opacity, height;
}
.swiper.swiper-cards {
  overflow: visible;
}
.swiper-cards .swiper-slide {
  transform-origin: center bottom;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  overflow: hidden;
}

/*!*********************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./node_modules/react-phone-number-input/style.css ***!
  \*********************************************************************************************************************************************************************************************************************************************************************************************/
/* CSS variables. */
:root {
	--PhoneInput-color--focus: #03b2cb;
	--PhoneInputInternationalIconPhone-opacity: 0.8;
	--PhoneInputInternationalIconGlobe-opacity: 0.65;
	--PhoneInputCountrySelect-marginRight: 0.35em;
	--PhoneInputCountrySelectArrow-width: 0.3em;
	--PhoneInputCountrySelectArrow-marginLeft: var(--PhoneInputCountrySelect-marginRight);
	--PhoneInputCountrySelectArrow-borderWidth: 1px;
	--PhoneInputCountrySelectArrow-opacity: 0.45;
	--PhoneInputCountrySelectArrow-color: currentColor;
	--PhoneInputCountrySelectArrow-color--focus: var(--PhoneInput-color--focus);
	--PhoneInputCountrySelectArrow-transform: rotate(45deg);
	--PhoneInputCountryFlag-aspectRatio: 1.5;
	--PhoneInputCountryFlag-height: 1em;
	--PhoneInputCountryFlag-borderWidth: 1px;
	--PhoneInputCountryFlag-borderColor: rgba(0,0,0,0.5);
	--PhoneInputCountryFlag-borderColor--focus: var(--PhoneInput-color--focus);
	--PhoneInputCountryFlag-backgroundColor--loading: rgba(0,0,0,0.1);
}

.PhoneInput {
	/* This is done to stretch the contents of this component. */
	display: flex;
	align-items: center;
}

.PhoneInputInput {
	/* The phone number input stretches to fill all empty space */
	flex: 1 1;
	/* The phone number input should shrink
	   to make room for the extension input */
	min-width: 0;
}

.PhoneInputCountryIcon {
	width: calc(var(--PhoneInputCountryFlag-height) * var(--PhoneInputCountryFlag-aspectRatio));
	height: var(--PhoneInputCountryFlag-height);
}

.PhoneInputCountryIcon--square {
	width: var(--PhoneInputCountryFlag-height);
}

.PhoneInputCountryIcon--border {
	/* Removed `background-color` because when an `<img/>` was still loading
	   it would show a dark gray rectangle. */
	/* For some reason the `<img/>` is not stretched to 100% width and height
	   and sometime there can be seen white pixels of the background at top and bottom. */
	background-color: var(--PhoneInputCountryFlag-backgroundColor--loading);
	/* Border is added via `box-shadow` because `border` interferes with `width`/`height`. */
	/* For some reason the `<img/>` is not stretched to 100% width and height
	   and sometime there can be seen white pixels of the background at top and bottom,
	   so an additional "inset" border is added. */
	box-shadow: 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor),
		inset 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor);
}

.PhoneInputCountryIconImg {
	/* Fixes weird vertical space above the flag icon. */
	/* https://gitlab.com/catamphetamine/react-phone-number-input/-/issues/7#note_348586559 */
	display: block;
	/* 3rd party <SVG/> flag icons won't stretch if they have `width` and `height`.
	   Also, if an <SVG/> icon's aspect ratio was different, it wouldn't fit too. */
	width: 100%;
	height: 100%;
}

.PhoneInputInternationalIconPhone {
	opacity: var(--PhoneInputInternationalIconPhone-opacity);
}

.PhoneInputInternationalIconGlobe {
	opacity: var(--PhoneInputInternationalIconGlobe-opacity);
}

/* Styling native country `<select/>`. */

.PhoneInputCountry {
	position: relative;
	align-self: stretch;
	display: flex;
	align-items: center;
	margin-right: var(--PhoneInputCountrySelect-marginRight);
}

.PhoneInputCountrySelect {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 1;
	border: 0;
	opacity: 0;
	cursor: pointer;
}

.PhoneInputCountrySelect[disabled],
.PhoneInputCountrySelect[readonly] {
	cursor: default;
}

.PhoneInputCountrySelectArrow {
	display: block;
	content: '';
	width: var(--PhoneInputCountrySelectArrow-width);
	height: var(--PhoneInputCountrySelectArrow-width);
	margin-left: var(--PhoneInputCountrySelectArrow-marginLeft);
	border-style: solid;
	border-color: var(--PhoneInputCountrySelectArrow-color);
	border-top-width: 0;
	border-bottom-width: var(--PhoneInputCountrySelectArrow-borderWidth);
	border-left-width: 0;
	border-right-width: var(--PhoneInputCountrySelectArrow-borderWidth);
	transform: var(--PhoneInputCountrySelectArrow-transform);
	opacity: var(--PhoneInputCountrySelectArrow-opacity);
}

.PhoneInputCountrySelect:focus + .PhoneInputCountryIcon + .PhoneInputCountrySelectArrow {
	opacity: 1;
	color: var(--PhoneInputCountrySelectArrow-color--focus);
}

.PhoneInputCountrySelect:focus + .PhoneInputCountryIcon--border {
	box-shadow: 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor--focus),
		inset 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor--focus);
}

.PhoneInputCountrySelect:focus + .PhoneInputCountryIcon .PhoneInputInternationalIconGlobe {
	opacity: 1;
	color: var(--PhoneInputCountrySelectArrow-color--focus);
}
