:root {
	--theme-color: #a62227;
	--border-radius: 2px;
  --quotation-navbar: #B1B1B1;
}

.btn {
	border-radius: 0;
}

.themeColor {
  /* color: var(--theme-color); */
  color: #a62227;
}

.themeBgColor {
  background: var(--theme-color);
}

.svg-color--active {
  fill: #fff;
}

/* homepage.css */
@font-face {
    font-family: 'MainFont';
    font-style: normal;
    font-weight: 100;
    src: url(fonts/Gotham-Font/GothamLight.ttf);
}

@font-face {
    font-family: 'MainFont';
    font-style: normal;
    font-weight: 200;
    src: url(fonts/Gotham-Font/GothamBook.ttf);
}

@font-face {
    font-family: 'MainFont';
    font-style: normal;
    font-weight: 400;
    src: url(fonts/Gotham-Font/GothamMedium.ttf);
}

@font-face {
    font-family: 'MainFont';
    font-style: normal;
    font-weight: 800;
    src: url(fonts/Gotham-Font/GothamBold.ttf);
}

@font-face {
    font-family: 'MainFont';
    font-style: normal;
    font-weight: 900;
    src: url(fonts/Gotham-Font/Gotham-Black.otf);
}

.slideWrap{
    margin-top: 60px;
}

.carousel-control-next {
    right: 0;
    top: 175px;
    height: 320px;
}

.carousel-control-prev {
    right: 0;
    top: 175px;
    height: 320px;
}

.dashboardSlide1 {
    width: 80%;
    /*height: 400px;*/
    object-fit: fill;
}

.slidePaging {
    position: absolute;
    bottom: 60px;
    left: 0;
    right: 0;
    text-align: center;
}

.slideDot {
    color: #666666;
    padding: 0 10px;
    cursor: pointer;
}

.slideDot.active {
    color: white;
}

.carousel-control-next {
    right: 0;
    top: 175px;
    height: 320px;
}

.carousel-control-prev {
    right: 0;
    top: 175px;
    height: 320px;
}

.bannerLeft{
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    background: #484848;
    color: #fff;
    border: 0;
    font-size: 20px;
    padding: 10px 20px;
    opacity: 0.8;
}

.bannerRight{
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    background: #484848;
    color: #fff;
    border: 0;
    font-size: 20px;
    padding: 10px 20px;
    opacity: 0.8;
}

.carousel-indicators li{
    width: 15px;
    height: 15px;
    background-color: #051e41;
    background-clip: unset;
    border-radius: 25px;
    border-top: 0px;
    border-bottom: 0px;
    opacity: 1;
}

.carousel-indicators .active{
    background: #fd252b;
}

.hpSection02Detail{
    padding: 50px 0;
}

.hpSubTitle{
    color: #fff;
    font-size: 40px;
}

.hpSection02Txt{
    font-size: 18px;
    color: #fff;
    font-weight: 800;
}

.hpSection04 {
    /* margin-left: 60px; */
}

.hpSection03Detail, .hpSection04Detail{
    padding: 35px 20px 10px;
}

.introTitle{
    font-size: 40px;
    color: #000;
}

.introDes{
    font-size: 18px;
    color: #000;
    font-weight: 200;
}

.blueTxt{
    color: #005faa;
    font-weight: 900;
    font-size: 22px;
}

.hpSection04Title{
    font-size: 18px;
    font-weight: 900;
    color: #000;
}

.descTxt{
    font-weight: 200;
    color: #000;
    font-size: 16px;
}

.imgWrap{
    padding: 20px;
    max-width: 250px;
    max-height: 250px;
    width: 100%;
    height: 100%;
}

.card{
    align-items: center;
    background-color: #f8f8f8;
}

.card-body{
    background-color: #ffffff;
    text-align: left;
    padding: 35px;
}

.card-title{
    color: #005faa;
    font-size: 23px;
    font-weight: 700;
}

.separateLine{
    border-top: 3px solid #005faa;
}

.cardShadow{
    -webkit-box-shadow: 0px 0px 25px -11px rgba(158,155,158,1);
    -moz-box-shadow: 0px 0px 25px -11px rgba(158,155,158,1);
    box-shadow: 0px 0px 25px -11px rgba(158,155,158,1);
}

.innerShadow{
    /*border: 1px solid #202020;*/
    -webkit-box-shadow: inset -1px 8px 8px -10px rgb(158 155 158 / 76%);
    -moz-box-shadow: inset -1px 8px 8px -10px rgb(158 155 158 / 76%);
    box-shadow: inset -1px 8px 8px -10px rgb(158 155 158 / 76%);
}

.dashboardSlide6{
    width: 100%;
    height: 100%;
    object-fit: contain;
    max-width: 425px;
    max-height: 315px;
}

.slideLeft , .slideRight{
    background: transparent;
    border: 0;
    font-size: 25px;
    color: #005faa;
    margin: auto 5px;
}

.titleTxt{
    font-size: 24px;
    color: #000;
}

.hpSecTxt{
    font-size: 28px;
    color: #000000;
}

.hpSecTxt.boldTxt{
    font-size: 38px;
    font-weight: 900;
}

.formWrap{
    padding: 15px 100px;
    background-color: #efefef;
}

.greyBox{
    padding: 20px 150px;
}

.blackTxt{
    color: #000;
}

.slideTitle{
    font-size: 49px;
    color: #000;
    line-height: normal;
    font-weight: 400;
}

.slideTxtWrap{
    position: absolute;
    top: 50%;
    left: 60px;
    transform: translateY(-70%);
}

.slideDes{
    font-size: 25px;
    color: #000;
    font-weight: 400;
}

.bannerLeft.secondSlide ,
.bannerRight.secondSlide{
    background: transparent;
    color: #000;
}

.sectionTitle2 {
    display: flex;
    flex-flow: column;
}

.productSection01 {
    background-color: #005584;
}

.productTitle{
    padding: 30px 10px;
}

.productSection01Font01 {
    font-weight: 200;
    font-size: 45px;
    color: #fff;
    margin-top: 50px;
}

.productTitleFont {
    font-weight: 200;
    font-size: 24px;
    color: #000;
}

.homeLine {
    width: 97%;
    background-color: #d5d5d5;
    height: 1px;
    margin-left: 20px;
}

.homeLine2 {
    width: 70%;
    background-color: #D8D8D8;
    height: 2px;
    margin-left: 40px;
}

.productTitleDetailFont {
    font-weight: 200;
    font-size: 14px;
    color: #000;
    min-height: 220px;
}

.productTitleDetailFont02 {
    font-weight: 200;
    font-size: 14px;
    color: #000;
    min-height: 200px;
}

.productTitleFont02 {
    font-weight: 800;
    font-size: 20px;
    color: #000;
}

.productBox {
    margin-bottom: 50px;
}

.moreInfoBtn {
    padding: 0;
    font-weight: 900;
    font-size: 14px;
    color: #007CB2;
}

.productDetailFont01 {
    font-weight: 200;
    font-size: 16px;
    color: #000;
}

.productDetailFont03 {
    font-weight: 200;
    font-size: 15px;
    color: #000;
}

.productDetailFont02 {
    font-weight: 800;
    font-size: 26px;
    color: #000;
}

.productDetailBox {
    padding: 30px 40px;
    background-color: #e9e9e9;
    color: #000;
    border-left: 5px solid #007dc2;
}

.productFooter {
    padding: 10px 25px;
}

table {
  border-collapse: collapse;
  width: 100%;
}

th {
  border: 1px solid #dcdcdc;
  text-align: left;
  padding: 8px;
  font-weight: 900;
  font-size: 16px;
  color: #747474;
}

td {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 8px;
  font-weight: 200;
  font-size: 14px;
  color: #747474;
}

td:not(:first-child) {
	border-left: none;
}

td:not(:last-child) {
	border-right: none;
}

td:nth-child(2) {
	border-left: 1px solid #dddddd;
}

tr:nth-child(odd) {
  background-color: #f4f4f4;
}

.daterangepicker tr {
  background-color: unset;
  border-left: unset;
  border-right: unset;
}

.daterangepicker th {
  padding: unset;
}

.daterangepicker td {
  font-weight: unset;
  padding: unset;
}

.daterangepicker {
  border-top: 5px solid var(--theme-color) !important;
}

.productImg {
    width: 100%;
    margin-right: 10px;
    margin-bottom: 15px;
}

.productImg02 {
    width: 50px;
    height: 110px;
    margin-bottom: 5px;
}

.productImg03 {
    width: 100%;
    margin-bottom: 5px;
}

.productImg04 {
    width: 100%;
    margin-bottom: 5px;
}

.productImg05 {
    width: 100%;
    height: 110px;
    margin-bottom: 5px;
}

.productImg06 {
    width: 100%;
    margin-right: 10px;
}

.productDetailFont04{
    font-weight: 200;
    color: #000;
    font-size: 15px;
}

.productDetailImg2 {
    width: 80%;
}

.productDetailsSection01 {
    margin-left: 70px;
}

.sidebarIcon {
    width: 20px;
    margin-right: 15px;
}

.carousel-indicators {
    bottom: 15px;
}

.homepageInfoBtn:hover {
    color: #fff;
    background-color: #005190;
}

.slideArrowLeft {
    position: absolute;
    left: -7%;
    top: 55%;
}

.slideArrowRight {
    position: absolute;
    right: 13%;
    top: 55%;
}

.form-control:focus {
    border-color: #006ec4;
}

.form-control::placeholder {
    opacity: 0.5;
}

a {
    color: #480fe8;
}

.btn-primary {
    min-width: 100px;
}

.btn-default {
    min-width: 100px;
}

.fa-check-circle {
    font-size: 24px;
}

.productTitleWidth {
    width: 200px;
}

body {
    overflow-x: hidden;
}

.productTitleDetailMargin {
    margin-top: 3rem;
}

.productBox {
    padding: 0 30px;
}

.productDetailImg {
    width: 50%;
}

.productDetailBox {
    margin-top: -35px
}

::-webkit-scrollbar {
  width: 5px;
}

::-webkit-scrollbar-track {
  background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
  background: #888;
}

::-webkit-scrollbar-thumb:hover {
  background: #555;
}

/* .hpSection01 {
    padding: 30px;
} */

#imgcoverEng{
    background-color: white;
    background-image: url(https://scontent-speed101.sgp1.digitaloceanspaces.com/kevo/655da7fb6f1f1.jpeg);
    background-size: cover;
    /* height: 500px; */
    background-repeat: no-repeat;
    background-position: 50% 75%;
	margin-top: 75px;
}

.hpSection01_cointainer {
  position: relative;
  text-align: center;
}

.hpSection01_bg {
    width: 350px;
}

.hpSection01_center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 900px;
}

.hpSection01_center2 {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%, 0);
    width: 500px;
}

.hpSection01Font01 {
    font-weight: 900;
    color: #000;
    font-size: 60px;
}

.hpSection01Font02 {
    font-weight: 200;
    font-size: 16px;
    color: #767C8A;
}

.hpSection02 {
    padding: 60px 60px 100px 60px;
}

.hpSection02BoxContent1 {
    background-color: #FFB617;
    padding: 50px 0px;
}

.hpSection02BoxContent2 {
    background-color: #F8F9F9;
    padding: 30px 50px;
}

.hpSection02BoxContent3 {
    /* background-color: #fff; */
    padding: 40px 20px 20px 20px;
    text-align: center;
}

.hpSection02Font01 {
    font-weight: 800;
    font-size: 24px;
    color: #fff;
}

.hpSection02Font02 {
    font-weight: 200;
    font-size: 14px;
    color: #fff;
    font-style: italic;
}

.hp01CarTitle{
    font-weight: 800;
    font-size: 26px;
    color: #000     ;
}

.hpSection02Font03 {
    font-weight: 800;
    font-size: 24px;
    color: #000     ;
}

.hpSection02Font04 {
    font-weight: 200;
    /* font-size: 14px; */
    color: #767C8A;
}

.hpSection02Font05 {
    font-weight: 200;
    font-size: 15px;
    color: #000;
}

.section2_icon {
    width: 55px;
}

.hpSection02Font06 {
    font-weight: 800;
    font-size: 24px;
    color: white;
    padding: 0px 10px;
}

.hpSection02Font07 {
    font-weight: 200;
    font-size: 14px;
    color: #646464;
}

.hpSection03Box1 {
    padding: 20px 0 0 120px;
    background-color: #F3F6F8;
}

.hpSection03Box2 {
    padding: 50px;
    background-color: #E7EDEE;
}

.productIcon {
    width: 20px;
}

.hpSection02Font04 {
    /* padding: 25px; */
    font-weight: 200;
    /* font-size: 20px; */
    font-size: 17px;
    color: #767C8A;
}

.contentIcon {
    width: 40px;
    background-color: #FFB617;
    padding: 30px 5px 20px 10px;
    border-bottom-left-radius: 50%;
    border-bottom-right-radius: 50%;
}

.hpSection03Font01 {
    font-weight: 200;
    font-size: 14px;
    color: #000;
}

.hpSection04 {
    padding: 50px;
}

.hpSection05 {
    padding: 50px 80px;
    /* padding: 10% 12% 10% 12% !important; */
}

.hpSection06 {
    padding: 50px 100px;
}

.hpSection04Content {
    margin-right: 50px;
}

.hpSection04Icon {
    width: 50px;
    height: 50px;
}

.hpSection04ContentMargin {
    margin-left: 50px;
}

.hpSection04Font01 {
    font-weight: 200;
    font-size: 15px;
    color: #000;
}

.hpSection05Box {
    padding: 20px 30px;
    border: 1px solid #E8E8E8;

}

.readMoreBtn {
    padding: 0;
    color: #00B2CE;
    font-weight: 600;
}

.hpSection06Content {
    /* padding-right: 220px; */
}

.hpSection06Font02 {
    font-weight: 200;
    font-size: 16px;
    color: #767C8A;
}

.contactUsInput {
    border: none;
    background-color: transparent;
    border-bottom: 2px solid #E8E8E8;
    border-radius: unset;
}

.contactUsInput:focus {
    background-color: transparent;
}

.submitBtn {
    padding: 10px 30px;
    font-weight: 700;
    font-size: 14px;
    color: #fff;
    background-color: #FFB617;
    border-radius: 20px;
}

.footerIcon {
    width: 15px;
}

.socialMediaIcon {
    width: 25px;
}

.infoTxt {
    font-weight: 300;
    font-size: 14px;
    color: #fff;
}

.footerTitle {
    font-weight: 600;
    font-size: 14px;
    color: #fff;
}

.footerDetailTxt {
    font-weight: 300;
    font-size: 14px;
    color: #E8E8E8;
}

.footerDetailTxt:hover {
    color: #fff;
}

.footerSocialIcon {
    width: 15px;
}

.hpSection04BoxMobile {
    display: none;
}

.hpSection04BoxWeb {
    display: flex;
}

.productSection.active {
    background-color: #E7EDEE;
}

.hpSection03Mobile {
    display: none;
}

/* Login Modal */
.loginModal {
    max-width: 50% !important;
    margin-top: 5rem;
}

.loginLogoBG {
    background-color: #f3e2be;
    padding: 20% 5%;
}

.loginTitleFont {
    font-weight: 700;
    text-align: center;
    color: black;
    font-size: 24px;
}

.loginInput {
    width: 75%;
    margin: 5% auto;
}

.loginInput:last-child {
    margin-bottom: 2.5%;
}

.editProfileInput {
    /* width: 75%; */
    margin: 5% auto;
}

.contactUsError {
    width: 95%;
    margin: 5% auto;
}

.buttonText {
    color: #FFB617;
    cursor: pointer;
}

.buttonText.forgotPwd {
    margin-left: 40%;
}

.modalLoginBtn {
    /* padding: 10px !important; */
    width: 100% !important;
    cursor: pointer;
    font-weight: 700 !important;
    font-size: 15px;
    color: #fff !important;
    background-color: var(--theme-color);
    border-radius: 20px;
    /* text-align: center !important; */
}

.modalLoginBtn.sendOTP {
    width: 50% !important;
    padding: 0 5px !important;
}

.modalRegisterBtn {
    text-decoration: underline;
    font-weight: 700;
}

.otpInput {
    padding: 0;
    outline: 0;
    border: 0;
    height: unset;
}

/* Buy Vehicle Insurance Page(getQuotation.php) */
.quotationSection {
    padding: 5% 10%;
    color: black;
    /* background-color: white; */
    background: url('/images/project/steps-bg.png');
    background-repeat: no-repeat;
	background-size: contain;
}

.quotationSection.travelQuote {
  padding-left: 0;
  padding-right: 0;
  padding-top: 0;
}

.quotationBox, 
.whiteLabelBox,
.transaction-result-details-box {
    margin-top: 3%;
    margin-left: 0;
    margin-right: 0;
    width: 100%;
    box-shadow: 1px 3px 16px 0px rgb(0 0 0 / 13%);
    padding: 4%;
    background-color: white;
    
}

.quotationBox {
    padding: 20px;
    box-shadow: none !important;;
	border-radius: 10px;

}

#feature_checkbox .quotationBox {
    box-shadow: none;
    border: 2px solid #e8e8e8;
}

.quotationBox.checked {
    background-color: #f2ffee;
    border-color: #7edb62 !important;
}

.getQuoteBtn {
    padding: 10px !important;
    width: 25% !important;
    cursor: pointer;
    font-weight: 900;
    font-size: 14px;
    color: #fff !important;
    background-color: var(--theme-color);
    border-radius: var(--border-radius);
}

.getQuoteBtn.homepageQuoteBtn {
  width: unset !important;
}

/* Loading (loadQuotation.php) */
.countdownText {
    color: #FFB617;
}

.loadingIcon {
    width: 35%;
    padding: 50px;
}

/* Get Quotes (checkout.php) */
.progressBarDesc {
    padding: 3em 0 0 0;
    align-content: center;
    align-items: center;
    vertical-align: top;
    counter-reset: stepCount;
    display: flex;
    justify-content: center;
}

.progressBarDesc li {
    text-align: center;
    vertical-align: top;
    height: 2em;
    line-height: 3em;
    width: 13%;
    color: black;
    margin: 0 1em;
    display: inline-block;
    position: relative;
    /* font-size: 13px;
    font-weight: 200; */
    font-size: 15px;
    font-weight: 600;
}

.progressBarDesc li::before {
    background: #FFB617;
    content: '';
    position: absolute;
    top: -75%;
    right: 60%;
    width: 100%;
    height: 1px;
}

.progressBarDesc li:first-child::before {
    display: none;
}

.progressBarDesc li::after {
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    counter-increment: stepCount;
    content: counter(stepCount);
    border-radius: 100%;
    color: #fff;
    background: #FFB617;
    margin: auto;
    padding: auto;
    display: block;
    position: absolute;
    top: -150%;
    right: 0;
    left: 0;
}

.progressBarDesc .active {
    color: black;
}

.progressBarDesc .active ~ li {
    color: #A9AEBE;
}

.progressBarDesc .active ~ li::before {
    color: #ebebeb;
    background: #ebebeb;
}

.progressBarDesc .active ~ li::after {
    color: #A9AEBE;
    background: #fff;
    border: 1px solid #ebebeb;
}

.originalPrice {
    color: #A9AEBE;
    text-decoration: line-through;
    font-size: 17px;
}

.currentPrice {
    font-family: auto;
    font-weight: 900;
    font-size: 22px;
}

.quotationList {
    list-style: none;
    font-size: 16px;
}

.quotationList li:before {
    background-image: url("../images/project/greenTick.png");
    margin: 0;
    content: "";
    padding: 15px;
    list-style: none;
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 20px;
}

.quotationList.quotationListNoSymbol li:before {
    background-image: none;
    padding: 0 !important;
}

.quotationList li.travelDescPlan:before {
  padding: 9px;
  background-size: 14px;
}

.quotationEmptyList p:before {
    margin: 0;
    content: "";
    padding: 15px;
    list-style: none;
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 20px;
}

.sumBox {
    background-color: #F2FFEE;
    padding: 5%;
    font-weight: bold;
    text-align: center;
    font-size: 20px;
    border: 1px solid #38C60E;
}

.sumBox.travelSumBox {
    padding: 12px 36px;
    background-color: #f2ffee;
    border: 2px solid #a3e68f;
}

.normalFontSize {
    font-size: 15px !important;
}

.normalFontWeight {
    font-weight: normal !important;
}

.font-bold {
    font-weight: bold;
}

.totalQuote {
	font-size: 24px;
	font-weight: 600;
}

.descQuote{
  font-size: 14px;
  margin-top: -8px;
  margin-bottom: 15px;
  margin-right: 30px;
}

.text-bold {
	font-weight: 600;
}

.getQuoteBtn2 {
    padding: 10px 25px !important;
    width: 25% !important;
    cursor: pointer;
    font-weight: 900;
    font-size: 14px;
    color: #fff !important;
    background-color: var(--theme-color);
    border-radius: var(--border-radius);
    text-align: center !important;
}

.getQuoteBtnNextnBack {
    padding: 10px !important;
    width: 25% !important;
    cursor: pointer;
    font-weight: 900;
    font-size: 14px;
    color: #fff !important;
    background-color: var(--theme-color);
    border-radius: var(--border-radius);
    text-align: center !important;
}

.getQuoteBtnNextnBackSummary {
    padding: 10px !important;
    /* width: 40% !important; */
    cursor: pointer;
    font-weight: 900;
    font-size: 14px;
    color: #fff !important;
    background-color: var(--theme-color);
    border-radius: var(--border-radius);
    /* text-align: center !important; */
}

.searchSearchQuotation {
    padding: 8px 15px !important;
    width: 100% !important;
    cursor: pointer;
    font-weight: 900;
    font-size: 14px;
    color: #fff !important;
    background-color: var(--theme-color);
    border-radius: var(--border-radius);
    text-align: center !important;
}

.carDetailsPopUpBTN {
    padding: 10px !important;
    width: 40% !important;
    cursor: pointer;
    font-weight: 900;
    font-size: 14px;
    color: #fff !important;
    background-color: #FFB617;
    text-align: center !important;
}

.borderLine {
    border-bottom: 2px solid #f1f1f1;
    margin: 0 -3% 3% -3%;
}

.quotationComp {
    font-size: 16px;
}

.carMarketValue {
    background-color: #ebfafe;
    padding: 1% 2%;
    border-radius: 15px;
    border: 1px solid #ebfafe;
    vertical-align: super;
    margin-left: 3%;
}

.cursorPointer {
    cursor: pointer;
}

.quotationHeaderText {
    color: black;
    font-size: 24px;
}

.quotationText {
    color: black;
    font-size: 19px;
}

.quotationText2 {
    color: black;
    font-size: 15px;
}

.quotationText3 {
    color: black;
    font-size: 30px;
}

.benefitBox {
    /* background-color: #ebfafe; */
    /* padding: 3%; */
}

.formInput {
    width: 75%;
}

.aquaText {
    color:#FFB617;
}

.info_icon {
    width: 25px;
    vertical-align: unset;
}

.providerLogoWrap {
	display: flex;
	align-items: center;
  justify-content:space-between;
}

.providerLogoWrap.travelLogoWrap {
  height: 100px;
}

.providerLogo {
	max-width: 200px;
}

.providerLogo.travelLogo {
  max-width: 150px;
}

.coverageTypeDiv {
    text-align: center;
}

.coverageTypeDiv div {
    padding: 10px 5px;
    background-color: #f8f9f9;
    border: 1px solid #fff;
    border-radius: 20px;
}

.coverageTypeDiv.active div {
    background-color: #FFB617;
    color: white;
}

.info_icon2 {
    width: 15px;
    vertical-align: top;
}

.modalLoginBtn.payment {
    padding: 0px !important;
    width: 40% !important;
}

.sufficientText {
    color: #6cc300;
}

.insufficientText {
    color: red;
}

/* Forgot Password */
.blueCircle {
    position: absolute;
    left: 22.75%;
    top: 18%;
    width: 50px;
}

.btnDecoration {
    color: #4fd5ef !important;
    text-decoration: underline !important;
}

.forgotPasswordPage {
    background-image: url('../images/project/loginBG.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding-bottom: 10px;
}

.forgotPwdBg {
    width: 100%;
    height: 110vh;
    background-color: #f3f6f8;
}

/* #fullName::placeholder {
    color: red;
} */
/*
#fullName:after {
    content:" *";
    color: red;
  } */

.forgotPwdPage {
    background-color: #fff;
    height: 100%;
}

.forgotPwdTitle {
    font-weight: 900;
    font-size: 60px;
    color: #000;
    letter-spacing: unset;
    width: 50%;
    line-height: 60px;
    position: absolute;
    top: 38%;
    left: 48%;
    transform: translate(-50%, -50%);
}

.forgotPwdDesc {
    font-weight: 200;
    font-size: 14px;
    color: #000;
    letter-spacing: unset;
    width: 50%;
    position: absolute;
    top: 58%;
    left: 58%;
    transform: translate(-50%, -50%);
}

.forgotPasswordDiv {
    position: absolute;
    top: 25%;
    right: 0;
}

.forgotPwdText {
    font-size: 30px;
    color: black;
}

.forgotPwdText2 {
    color: #989da7;
    font-size: 13px;
    font-weight: 100;
}

.forgotPwdText3 {
    font-size: 13px;
    color: black;
    font-weight: 200;
}

/* Tooltip */
.tooltip {
    position: unset;
    display: inline-block;
    opacity: 1;
}

.tooltipCI {
    position: unset;
    display: inline-block;
    opacity: 1;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 300px;
    background-color: #394c60;
    font-weight: 200;
    font-size: 14px;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 30px;
    position: absolute;
    z-index: 1;
    top: -225px;
    left: 5%;
}

.tooltipCI .tooltiptextCI {
    visibility: hidden;
    width: 300px;
    background-color: #394c60;
    font-weight: 200;
    font-size: 12px;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 30px 30px 30px 0px;
    position: absolute;
    z-index: 1;
    top: 50px;
    /* left: 5%; */
    left: -995%;
}

/* Triangle Arrow at the bottom*/
.tooltiptextCI:after {
    left: 64%;
    top: -29.5px;
    right: 15px;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(238, 238, 238, 0);
    border-bottom-color: #394c60;
    border-width: 15px;
    margin-left: -15px;
    transform: rotate(0deg);
}

.tooltipCI:hover .tooltiptextCI {
    visibility: visible;
}

/* Customized Radio Button */
.radioStyle {
    -webkit-appearance:none;
    width:20px;
    height:20px;
    border:1px solid #E6E6E6;
    border-radius:50%;
    outline:none;
    position: relative;
    vertical-align: bottom;
}

.radioStyle:before {
    content:'';
    display:block;
    width:50%;
    height:50%;
    border-radius:50%;
    background-color: white;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.radioStyle:checked {
    box-shadow:0 0 10px 10px #FFB617 inset;
}

/* Customized Checkbox */
.customCheckbox {
    -webkit-appearance: none; /*hides the default checkbox*/
    height: 20px;
    width: 20px;
    min-width: 20px;
    position: relative;
    top: 0;
    left: 0;
    background-color: #fff;
    text-align: center;
    font-weight: 900;
    color: white;
    border-radius: 3px;
    outline: none;
    border: 2px solid #e2e5ec;
    vertical-align: sub;
}

.customCheckbox:checked {
    background-color: #6cc300;
}

.customCheckbox:before {
    content: "";
}
.customCheckbox:checked:before {
    content: '\2713';
    position: absolute;
    left: 3px;
    top: -2px;
}

.customCheckbox:hover {
    cursor: pointer;
    opacity: 0.8;
    /* border: 1px solid #e2e5ec; */
}

/* Customized Dropdown (<select>)*/
.dropbtn {
    word-break: break-word;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #e2e5ec;
    border-radius: 4px;
    font-size: 15px;
    padding: 0.65rem 1rem;
    cursor: pointer;
    width: 100%;
}

.dropbtnStyle {
    word-break: break-word;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    /* border: 1px solid #e2e5ec; */
    border-radius: 4px;
    font-size: 15px;
    /* padding: 0.65rem 1rem; */
    cursor: pointer;
    width: 100%;
}


.dropbtn:focus {
    border-color: #006ec4;
}

.dropdown {
    position: relative;
    display: block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    width: 100%;
    overflow: auto;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

.dropdown-content a {
    display: block;
    width: 100%;
    height: calc(1.5em + 1.3rem + 2px);
    padding: 0.65rem 1rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    -webkit-transition: border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    text-decoration: none;
}

.dropdownPointer {
    cursor: pointer;
}

.dropdown a:hover {
    background-color: #ddd;
}

.modal-open {
    overflow: hidden!important;
}


body {
    -ms-overflow-style: none; /* for Internet Explorer, Edge */
    scrollbar-width: none; /* for Firefox */
    overflow-y: scroll;
}

body::-webkit-scrollbar {
    display: none; /* for Chrome, Safari, and Opera */
}

.hpSection03_bg {
    background-color: #f9f9f9;
    padding: 50px 100px;
}

.hpSectionWhoWeAre_bg {
    background-color: white;
    padding: 50px 100px;
}

.hpSection03_font01 {
    font-weight: 900;
    font-size: 30px;
    color: #000;
}

.hpSection04_font01 {
    font-weight: 600;
    font-size: 140px;
    color: #000;
}

.hpSection04_font02 {
    font-weight: 600;
    font-size: 20px;
    color: #000;
}

.hpSection04_font03 {
    font-weight: 900;
    font-size: 24px;
    color: #000;
}

.homepageLine {
    width: 7%;
    background-color: #00B2CE;
    height: 2px;
}

.hpSection04_font04 {
    font-weight: 300;
    font-size: 15px;
    color: #767C8A;
    line-height: 1.8;
}

#welcome1 , #welcome2 , #welcome3{
    box-shadow: 10px 10px 16px 0 rgb(0 0 0 / 5%);
}

#search-head:not(.collapsed) .rotate-iconFilter {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

.rotate-iconFilter{
    color: black;
    font-size: 1.5em;
}

#homePageTitle {
  	padding-top: 70px;
	padding-left: 100px;
	padding-right: 100px;
	padding-bottom: 70px;
	color: white;
	font-weight: 700;
}

#imgInsideButton {
	color: white;
	font-size: 50px;
	font-weight: 700;
	/* font-family: Arial, Helvetica, sans-serif !important; */
	border-radius: 2px;
}

.footer {
	padding: 45px 100px;
}

.heroHeader {
	line-height: 70px;
	text-shadow: 2px 2px 10px #000;
	/* font-family: Arial, Helvetica, sans-serif; */
}

.textContentWrap {
	color: #000;
	padding: 70px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	row-gap: 20px;
}

.font-uppercase {
	text-transform: uppercase;
}

.font-capitalize {
  text-transform: capitalize;
}

.heroText {
	font-size: 2rem;
	font-weight: 100;
	/* font-family: Arial, Helvetica, sans-serif; */
}

.companyName {
	font-weight: 700;
}

.separatorLine {
	margin: 30px 0;
	border: 1.5px solid #fff;
	height: 1px;
	width: 70px;
}

.separatorLine.grayLine {
  border-color: #e8e8e8;
}

.separatorLine.thinLine {
  border-width: 1px;
}

.imgBtnWrap {
	display: flex;
	align-items: center;
	width: fit-content;
}

.visionSection {
	display: flex;
  background: url('/images/project/homepage-banner2.jpg');
  background-size: contain;
  background-position: center;
}

.logoSection {
	font-size: 24px;
	color: #000;
	font-weight: 600;
}

.textSection {
	color: #000;
	font-size: 15px;
}

.companyAboutUs {
  display: flex;
  justify-content: center;
}

.companyAboutUs-text {
  width: 60%;
}

.titleSection {
	color: #000;
	font-weight: 600;
}

.blackenText {
	font-weight: 600;
}

.iconOnRight {
	position: relative;
	text-align: left;
	min-width: 225px;
}

.btnPadding {
	padding: 10px 20px !important;
}

.iconOnRight .imgInBtn {
	position: absolute;
	width: 40px;
	right: 15px;
	top: 100%;
	transform: translateY(-50%);
	border-radius: 50%;
  box-shadow: 4px 1px 5px 1px #0000001c;
}

.imgCardWrap {
	padding: 0 25px;
}

.imgCard {
	display: flex;
	flex-direction: column;
	background: #fff;
	height: 100%;
  box-shadow: 4px 1px 5px 1px #0000001c;
}

.supportCardWrap .imgCard {
  box-shadow: 4px 5px 5px 1px #0000001c;
}

.cardTextSection {
	text-align: left;
	padding: 30px;
	flex-grow: 1;
	cursor: pointer;
}

.cardTextTitle {
	color: #000;
	font-weight: 600;
}

.cardText {
	color: #000;
	font-size: 15px;
}

.cardButtonSection {
	text-align: left;
	font-size: 15px;
	font-weight: 600;
  box-shadow: 1px 1px 10px lightgray;
}

.cardButtonSection .quotationBtn {
	padding: 10px 30px;
	width: 100%;
}

.referralCodeListing{
	color: #000;
  font-size: 16px;
	padding: 20px 70px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.referrallistingContent1 li{
  padding: 10px;
}
 
/* ul.referrallistingContent2 li{
  list-style-image: url('/images/project/referralCodePage/TickIcon.png');
  padding-inline-start: 1ch;
}  */

ul.referrallistingContent2 li{
  list-style-type: none;
  display: flex;
  padding: 5px;
} 

ul.referrallistingContent2 li::before{
  content: url('/images/project/referralCodePage/TickIcon.png');
  margin-right: 15px;
}

.referralImg1Title1{
  color: var(--theme-color); 
  background-color: white; 
  font-size: 48px; 
  font-weight:800;
}

.referralImg1Title2{
  color: var(--theme-color); 
  background-color: white; 
  font-size: 28px; 
  font-weight:400;
}

.referralImg1TitleDesc{
  color: #000000; 
  background-color: white; 
  font-size: 16px; 
  font-weight:200;
}

#referralImg1Content{
  padding: 40px;
  text-align: center;
}

#referralImg2Content{
  padding: 60px 20px 30px 20px;
	color: white;
	font-weight: 700;
  font-size: 32px;
}

.referralImgInside{
  padding-left: 35%;
  justify-content: center;
}

.titleContent {
	font-weight: 600;
	font-size: 46px;
	line-height: 50px;
}

.textContent {
	font-size: 15px;
}

.grayBg {
	background: #f6f6f6;
}

.supportSectionBg {
	background: url('/images/project/contact-us.jpg');
	background-size: cover;
	background-repeat: no-repeat;
}

.supportCardSection {
	justify-content: center;
	align-items: center;
	gap: 35px;
}

.supportCardWrap {
	padding: 0;
	max-width: 300px;
}

.supportCardWrap .cardTextSection {
	padding: 40px 50px;
}

.linkInText {
	color: var(--theme-color);
	text-decoration: underline;
	font-weight: 600;
}

.linkInText:hover {
	color: var(--theme-color);
}

#footerLine1 {
	margin-top: 0 !important;
}

.footerInfoTitle {
	color: #fff;
	font-weight: 600;
	font-size: 15px;
}

.footerInfoContent {
	color: #fff;
	display: flex;
  flex-wrap: wrap;
}

.footerInfoContent > * {
  font-size: 14px;
}

.footerInfoItems {
	padding: 0 20px;
}

.footerInfoItems:first-child {
	padding-left: 0;
}

.footerInfoItems:last-child {
	padding-right: 0;
}

.footerInfoItems a {
	color: #fff;
}

.footerInfoItems a:hover {
	color: var(--theme-color);
}

.footerItemTitle {
	font-weight: 500;
}

.footerInfoItems:not(:last-child) {
	border-right: 1px solid #fff;
}

.socialIconContent {
	gap: 15px;
}

.footerSocialItems {
	display: flex;
	justify-content: center;
	align-items: center;
}

.footerSeparatorLine {
	height: 1px;
	margin: 40px 0 30px;
	border: 1px solid #383838;
}

.privacyContent {
	justify-content: end;
}

.privacyContent a {
	color: #fff;
}

.privacyContent a:hover {
	color: var(--theme-color);
}

.languageIcon {
	display: flex;
	justify-content: center;
	align-items: center;
}

.languageIcon i {
	font-size: 20px;
}

.loginBox2 {
  padding: 40px !important;
  max-width: 425px;
}

.loginFormHeader {
  font-size: 36px;
  color: black;
  font-weight: bold;
}

.formLabel {
  color: #000 !important;
  font-weight: bold !important;
  font-size: 15px !important;
}

.loginBackgound {
  background-image: url('/images/project/login-bg.jpg') !important;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  height: 100%;
}

.registerBackground {
  background-image: url('/images/project/register-bg.jpg') !important;
  background-repeat: no-repeat;
  background-size: cover;
  height: 100%;
}

.forgotPasswordBackground {
  background-image: url('/images/project/forgotpw-bg.jpg') !important;
  background-repeat: no-repeat;
  background-size: cover;
  height: 100%;
}

.forgotPasswordBtn2 {
  color: #383838 !important;
  text-decoration: underline;
  font-size: 14px !important;
  font-weight: 400 !important;
}

.beforeLoginBtn2 {
  background: var(--theme-color) !important;
  border-radius: var(--border-radius) !important;
  text-align: left;
  left: unset !important;
}

#loginModal .beforeLoginBtn2 {
  font-weight: bold;
  color: #fff;
}

#loginModal .modal-dialog {
  margin-top: 75px;
}

.beforeLoginForm.eyeIconRight {
  padding-right: 2rem;
}

.registerLink {
  color: var(--theme-color);
  text-decoration: underline;
}

.registerLink:hover {
  color: var(--theme-color);
  text-decoration: none;
}

.loginLink{
  font-size: 14px;
}

.otpBtn {
	border-radius: var(--border-radius) !important;
	padding: 0;
	display: flex;
	justify-content: center;
	align-items: center;
}

.no-border {
	border: none;
}

.smallerBox {
	max-width: 600px;
}

.quotationDivSection {
	padding: 0 15%;
}

.quotationDivSection.noPaddingDivSection {
  padding: 0;
}

.text-uppercase {
	text-transform: uppercase;
}

input.text-uppercase::placeholder {
	text-transform: none;
}

.btn.withIconInside {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.close {
	font-size: 2.5rem;
}

.modalCloseIcon {
	position: absolute;
	right: 0;
}

.modalHeadingWrap {
	position: relative;
}

.carDetailModal {
	padding: 40px 30px !important;
}

.carDetailModalHeader {
	color: black;
	font-size: 24px;
	font-weight: bold;
	text-align: center;
	padding-top: 10px;
	padding-bottom: 10px;
}

.quotationLabelText {
	font-weight: bold;
	font-size: 15px;
}

.quotationDataContent {
	background: #f6f6f6;
}

.greyBtn {
  background-color: var(--theme-color) !important;
  background: var(--theme-color) !important;
  /* background-color: #89CFF0 !important;
  background: #89CFF0 !important; */
}

.greyBtn.blueBtn {
  background-color: var(--theme-color) !important;
  background: var(--theme-color) !important;
  /* background-color: #89CFF0 !important;
  background: #89CFF0 !important; */
}

.quotationContentWrap {
	padding: 35px 35px 10px;
}

.quotationContentWrap.travelQuotationContentWrap {
  padding: 25px 20px;
}

.quotationContentWrap.travelPlanContentWrap {
  padding: 35px 35px 20px;
}

.quotationContentWrap.travelPlanContentWrap.travelExpandContent {
  padding: 20px 35px 20px;
  border-top: 1px solid #e8e8e8;
}

.quoteCardBtn {
	padding: 10px 35px !important;
	width: 100% !important;
	font-size: 16px;
}

.sumBox {
}

.loadingText {
	color: #000;
	font-size: 15px;
	font-weight: 600;
	text-align: center;
}

.text-green {
	color: #57cf33;
}

.strongText {
	font-size: 24px;
	font-weight: 600;
}

.eyeOn.forgotPwdText2 {
  display: none;
  top: 43px;
  position: absolute; 
  right: 18px;
}

.eyeOff.forgotPwdText2 {
  top: 43px;
  position: absolute; 
  right: 18px; 
}

.phoneNumberText {
  font-weight: 600;
}

#beforeLoginHeader {
  box-shadow: 4px 1px 5px 1px #0000001c;
}

.imgCardBoxWrap {
	justify-content: space-between;
}

.imgCardBox {
	max-width: 350px;
    box-shadow: 1px 3px 16px 0px rgb(0 0 0 / 13%);
}

.imgCardLinkWrap {
	display: flex;
}

.imgCardBoxContent {
	background-color: #fff;
}

.dataTables_wrapper .dataTable td, .dataTables_wrapper .dataTable th {
	color: #000;
}

.tableWidthMax div {
	padding-left: 0;
	padding-right: 0;
}

.productSubheader {
  display: none;
  z-index: 100 !important;
}

.productSubheader.open {
  display: block;
}

.form-control.is-invalid, .was-validated .form-control:invalid {
  background-image: none !important;
}

.checkoutLogo {
    height: 75px;
    margin-right: 20px;
}

.largeFontSize {
    font-size: 30px;
}

/* .btnWidthUnset {
    width: unset !important;
} */

.btnWidth35 {
    width: 35% !important;
}

.font-italica {
    font-style: italic !important;
}

.buttonGap {
	column-gap: 10px;
}

.underlinedBtn {
	border: none !important;
	background-color: transparent !important;
	text-decoration: underline !important;
	color: #000 !important;
}

.redLinkText {
	color: var(--theme-color);
}

.redLinkText:hover {
	color: var(--theme-color);
}

.quotationModalButtonWrap {
	justify-content: space-between;
}

#appendBTN {
	column-gap: 10px;
}

.bottomButtonWrap {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	column-gap: 10px;
}

.checkoutBtnWrap {
	justify-content: flex-end;
	align-items: center;
	column-gap: 10px;
}

.loginModalBody {
  padding: 40px !important;
}

.select2-container--default .select2-results__option.select2-results__option--highlighted, .select2-container--default .select2-results__option[aria-selected=true] {
  background-color: var(--theme-color);
  color: #fff;
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
  background-color: var(--theme-color);
  color: #fff;
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-selection__choice .select2-selection__choice__remove {
  color: #fff;
}

.travelPlanWrap {
  padding: 0 30px
}

.descPlan.travelDescPlan {
  font-size: 14px;
  font-weight: bold;
}

.text-weight-light {
  font-weight: 400;
}

.quotationDescWrap {
  min-height: 200px;
}

.priceDesc {
  font-size: 16px;
}

.priceText {
  font-weight: bold;
  font-size: 1.75rem;
}

.expandLink {
  text-decoration: underline;
  color: var(--theme-color);
}

.expandLink:hover {
  color: var(--theme-color) !important;
}

.expandLink.expanded i.fa-angle-down:before {
  transform: rotateX(180deg);
}

.addMoreLink {
  text-decoration: underline;
  font-weight: 500;
  color: var(--theme-color);
}

.addMoreLink:hover {
  color: var(--theme-color) !important;
}

.select2-selection.form-control {
  padding: 0;
}

.select2-selection.form-control.is-invalid {
  border-color: #fd397a !important;
}

.closeBtnWrap {
  position: absolute;
  top: 0;
  right: 0;
}

.quotationBoxCloseButton {
  color: #000;
  font-size: 20px;
}

.quotationBoxCloseButton:hover {
  color: #000;
  opacity: .7;
}

.editBackBtnWrap {
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--theme-color);
  font-size: 15px;
  font-weight: 600;
}

.greyOtherBg {
  background: #ececec !important;
}

input[type='radio'] {
  accent-color: var(--theme-color);
}

.disabledInput {
  cursor: not-allowed;
}

.text-capitalize {
  text-transform: capitalize;
}

.referralCodeContent{
  background-color: white;
}

.referralImg1{
  margin-top: 75px;
  width: 100%;
}

#referralImg2{
  background-image: url(/images/project/referralCodePage/Banner2.png);
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  width: 100%;
}

.referralJoinBtn{
  color: white;
  background-color: #38c60d;
  border: none;
  padding: 8px 22px 8px 22px;
  font-size: 22px;
}

.referralJoinBtn:hover{
 color: white;
}

.referralSpecialTitle{
  color: #ffe500;
	font-weight: 800;
  font-size: 34px;
}

.clickableCard {
  cursor: pointer;
}

.phoneErrorDiv.is-invalid {
  border: 1px solid #fd397a;
}

.phoneErrorDiv.is-invalid .form-control {
  background-color: transparent;
}

.form-inline-checkbox {
	display: inline-block;
	font-size: 15px;
}

.withCheckbox {
	display: flex;
	align-items: center;
}

.text-underlined {
  text-decoration: underline;
}

.unclickable {
  cursor: none;
}

.buttonGroupWrap {
  column-gap: 15px;
}

/* Style the tab */
.tab {
  overflow: hidden;
  border: 1px solid #ccc;
  background-color: #fff; 
}

/* Style the buttons inside the tab */
.tab button {
  background-color: #ffffffd4;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 8px 16px;
  transition: 0.3s;
  font-size: 14px;
  color: #000;
  border-radius: 10px;
  margin: 0 10px;
  white-space: nowrap;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #ddd;
}

/* Create an active/current tablink class */
.tab button.active {
  background-color: var(--theme-color); 
  color: #fff;
}

/* Style the tab content */
.tabcontent {
  display: none;
  padding: 6px 4px;
  border: 1px solid #ccc;
  border-top: none;
  color: #000;
}

.quotationTab {
  display: flex;
  justify-content: center;
  border: unset;
 /* padding-bottom: 20px; */
}

.quotationTabcontent.tabcontent {
  border: unset;
}

.transactionResultLink:focus,
.transactionResultLink {
  text-decoration: underline;
  color: var(--theme-color);
}

.transactionResultLink:active,
.transactionResultLink:hover {
  text-decoration: none;
  color: var(--theme-color);
}

.compulsory-check {
  background-color: lightgray;
  /* border-color: #7edb62 !important; */
}

.compulsory-check .customCheckbox:checked {
  background-color: gray;
}

.prependUnit {
  position: relative;
}

.prependUnit input {
  padding-left: 36px;
}

.prependUnitDiv {
  position: absolute;
  padding: .65rem 1rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 14px;
}

.tablinks {
  display: flex;
  align-items: center;
}

.filterTop {
  background-color: var(--theme-color);
  padding-top: 80px;
}

.filterTopContent {
  padding: 15px 10px;
}

.filterTopContent .row {
  row-gap: 10px;
}

.filterTopContent input:not(.select2-search__field), 
.filterTopContent span.select2, 
.filterTopContent select {
  height: 37px;
}

.filterTopContent .control-label.getQuoteLabel {
  color: #fff;
}

.topFilterBtn {
  height: 37px;
  border-radius:5px;
  box-shadow:  
    20px 20px 60px #7a191c, 
    -20px -20px 60px #a62126;
}

.mr-5-new {
  margin-right: 5px;
}

.quotationTab::-webkit-scrollbar {
  height: 3px;
}

.travelContainerTitle {
	display: none; 
}
.travelContainerTitle{
		font-size: 20px;
		text-align: center;
		padding-top: 10px;
	}

.homepage-btn-container {
    padding: 10px;
    width: 60%;
    position: relative;
    margin: auto;
    margin-bottom: -44px;
    /* border: 1px solid #aaa; */
    border-radius: 10px;
    z-index: 997;
    box-shadow: 1px 3px 16px 0 rgb(0 0 0 / 13%);

}

.homepageFilter {
font-weight: 600;
}

/* HomePage Section */

.card-motor-body {

  background-color: var(--theme-color);
  border-radius:20px;
  
}

.main-img {
  width:100%;
  border-top-left-radius: 20px;
  border-bottom-left-radius: 20px;
  -webkit-clip-path: polygon(0 0, 0 100px, 100px 80px, 100px 0);
  clip-path: polygon(0 0, 0 100%, 81% 100%, 100% 0)
}


.hpSection2 {
  margin-inline:80px;
}

.card-motor button, .card-travel button, .card-personal button, .card-dental button {
  border-radius: 5px;
  height:40px;
  border: none;
  outline:none;
  background-color:#F8E9B6;
  width:125px;
  font-weight:500;
}

.main-img-travel {
  width:100%;
  border-top-right-radius: 20px;
  border-bottom-right-radius: 20px;
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 30px);
  clip-path: polygon(20% 0, 100% 0%, 100% 100%, 0 100%);
}


.travel-text {
  color:white;
  font-size:22px;
  font-weight:400;
  margin:0;
}

.travel-text span {
  color:#FDD103;  
  font-weight:500;
  font-size:23px;
}

.travel-content-container {
  padding-left:100px;
}


.partner-logo1, .partner-logo2, .partner-logo3, .partner-logo4, .partner-logo5, .partner-logo6, .partner-logo7, .partner-logo8, .partner-logo9, .partner-logo10 {
  text-align:center;
}

.partner-logo1 img{
  width:183px;
  height:43px;
  text-align:center;
}

.partner-logo2 img{
  width:95px;
  height:46px;
  text-align:center;
}

.partner-logo3 img{
  width:105px;
  height:45px;
  text-align:center;
}

.partner-logo4 img{
  width:140px;
  height:51px;
  text-align:center;
}

.partner-logo5 img{
  width:213px;
  height:22px;
  text-align:center;
}

.partner-logo6 img{
  width:68px;
  height:55px;
  text-align:center;
}

.partner-logo7 img{
  width:99px;
  text-align:center;
}

.partner-logo8 img{
  width: 128px;
  height:47px;
  text-align:center;
}

.partner-logo9 img{
  width:85px;
  height:26px;
  text-align:center;
}

.partner-logo10 img{
  width: 55px;
  text-align:center;
}

.partner-section-container {
  margin-inline:80px;
  margin-right:135px;
}

.hpSection2 button {
  color:black;
}

/* End of HomePage Section - Web View */

/* Motor Quotation List */

.lds-spinner.active{
  display:unset;
}

.lds-spinner {
  color: official;
  display: inline-block;
  position: relative;
  width: 30px;
  height: 30px;
  display:none;
}
.lds-spinner div {
  transform-origin: 30px 30px;
  animation: lds-spinner 1.2s linear infinite;
}
.lds-spinner div:after {
  content: " ";
  display: block;
  position: absolute;
  top: 0px;
  left: 27px;
  width: 6px;
  height: 18px;
  border-radius: 20%;
  background: black;
}
.lds-spinner div:nth-child(1) {
  transform: rotate(0deg);
  animation-delay: -1.1s;
}
.lds-spinner div:nth-child(2) {
  transform: rotate(30deg);
  animation-delay: -1s;
}
.lds-spinner div:nth-child(3) {
  transform: rotate(60deg);
  animation-delay: -0.9s;
}
.lds-spinner div:nth-child(4) {
  transform: rotate(90deg);
  animation-delay: -0.8s;
}
.lds-spinner div:nth-child(5) {
  transform: rotate(120deg);
  animation-delay: -0.7s;
}
.lds-spinner div:nth-child(6) {
  transform: rotate(150deg);
  animation-delay: -0.6s;
}
.lds-spinner div:nth-child(7) {
  transform: rotate(180deg);
  animation-delay: -0.5s;
}
.lds-spinner div:nth-child(8) {
  transform: rotate(210deg);
  animation-delay: -0.4s;
}
.lds-spinner div:nth-child(9) {
  transform: rotate(240deg);
  animation-delay: -0.3s;
}
.lds-spinner div:nth-child(10) {
  transform: rotate(270deg);
  animation-delay: -0.2s;
}
.lds-spinner div:nth-child(11) {
  transform: rotate(300deg);
  animation-delay: -0.1s;
}
.lds-spinner div:nth-child(12) {
  transform: rotate(330deg);
  animation-delay: 0s;
}
@keyframes lds-spinner {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

.product-card {
  width: 30%;
  min-height:500px;
}

.quotationNonLoader {
  display: flex;
  flex-wrap:wrap;
  justify-content:space-between;
}

.card-content {
  flex-direction: column;
}

.sumBox {
  font-size:15px;
  padding:5px;
  text-align:left;
}

/* End of Motor Quotation List */

/* Mobile View */
@media (min-width: 320px) and (max-width: 767px) {

	.lds-spinner {
		height: 70px;
		width: 90px;
	}
	
	.product-card {
		width: 100%;
		    height: unset;
	}

	.quotationNonLoader {
		flex-direction: column;
	}

	.homepage-btn-container {
    padding: 0px;
    width: unset;
    position: relative;
    margin: unset;
    margin-bottom: unset;
    /* border: 1px solid #aaa; */
    border-radius: unset;
    z-index: unset;
    box-shadow: unset;
}
.tab {
background-color: unset;
}
	#searchQuotationTabs {
		padding-top: 0!important;
	}
	.mr-5-new {
		margin: 0px;
	}
	.homepageFilter {
		/*display:none; */
	}
	
  .quotationTab {
    /*overflow-x: auto;*/
    justify-content: space-between;
  }

	.tab button {
		margin: 0px;
		padding: 0px;
		height: 80px;
		width: 80px;
		border-radius: 10px;
		flex-direction: column;
		font-size: 13px;
		white-space: unset;
	}
  

  .referralImg1{
    margin-top: 0px;
  }

  .referralSpecialTitle{
    color: #ffe500;
    font-weight: 800;
    font-size: 17px;
  }

  .referralCodeListing{
    font-size: 12px;
    padding: 20px;
  }

  .referrallistingContent1 li{
    padding: 5px;
  }

  .referralImg1Title1{
    font-size: 32px; 
  }

  .referralImg1Title2{
    font-size: 16px;
  }

  .referralImg1TitleDesc{
    font-size: 12px;
  }

  #referralImg2{
    background-position:25% 50%;
  }

  #referralImg2Content{
    padding: 45px 20px 30px 30px;
    font-size: 16px;
  }  

	.carDetailModal {
		padding: 20px 15px !important;
	}

  .referralJoinBtn{
    padding: 8px 22px 8px 22px;
    font-size: 12px;
  }

	.quotationModalButtonWrap {
		justify-content: flex-start;
		column-gap: 10px;
	}

	.quotationModalButtonWrap > div.getQuoteBtn2 {
		width: unset !important;
		flex-grow: 1;
	}

	.quotationContentWrap {
		padding: 0;
	}

	.quotationBox {
		padding: 0;
		border-radius: 10px;
	}

  .quotationBox.mobileQuotationBox {
    padding: 20px;
  }

	.quotationBoxPadding {
		padding: 6%;
	}

	.checkoutBtnWrap {
		/* justify-content: center; */
		column-gap: 10px;
	}

	.mobile-save-quote-btn {
		width: 100%;
	}

	.m-flex-grow {
		flex-grow: 1;
	}
	
	#imgcoverEng {
		margin-top: 0;
	}

	.heroHeader {
		font-size: 28px;
		line-height: unset;
	}

	#imgInsideButton {
		font-size: 24px;
	}

	#homePageTitle {
		padding: 20px 10px;
	}

	.textContentWrap {
		padding: 45px;
	}

	.supportSectionBg {
		padding: 30px !important;
	}

    .carousel-control-next {
        top: 65px;
        height: 200px;
    }

    .carousel-control-prev {
        top: 65px;
        height: 200px;
    }

    .footerTitle{
        margin-right: 10px;
    }

    #footerInner03:not(.collapsed) .rotate-icon {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    .hpSection05 {
        /* padding: 50px 80px; */
        padding: 10% 12% 10% 12% !important;
    }

    #footerInner02:not(.collapsed) .rotate-icon {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    #footerInner04:not(.collapsed) .rotate-icon {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    #search-head:not(.collapsed) .rotate-iconFilter {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
    }


    .rotate-iconFilter{
        color: black;
        font-size: 1.5em;
    }

    .rotate-icon{
        color: white;
        font-size: 1.5em;
    }


    /* #productDropdown.show ~ .rotate-icon  {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
    } */

    #footerContent02 , #footerContent03 , #footerContent04{
        margin-bottom: 10px !important;
    }

    #footerInner02 , #footerInner03 , #footerInner04{
        display: flex;
        align-items: center;
    }

    #welcome1 , #welcome2 , #welcome3{
        box-shadow: 1px 3px 16px 0 rgb(0 0 0 / 13%);
        margin: 10% 12% 0% 12% !important;
    }

    #homeFirstName , #homeLastName , #homePhoneNo , #homeEmail , #homeMessage{
        padding: 0.65rem 0rem !important;
    }

    #messageDIV{
        padding: 0px;
    }

    .hpSection04_font01 {
        font-weight: 600;
        font-size: 30px;
        color: #000;
        margin-right: 10px;
    }

    .hpSection04_font02 {
        font-weight: 600;
        font-size: 20px;
        color: #000;
        align-self: flex-end;
    }

    .slideTxtWrap {
        left: 42px;
        transform: translateY(-50%);
    }

    .slideTitle {
        font-size: 13px;
    }

    .slideDes {
        font-size: 9px;
    }

    .hpSection02{
        min-width: 0px;
    }

    .hpSection02Detail {
        padding: 23px 10px;
    }

    .hpSubTitle {
        font-size: 30px;
    }

    .hpSection03Detail, .hpSection04Detail{
        padding: 0 20px 10px;
    }

    .sectionAlign {
        margin-top: -40px;
    }

    .formWrap{
        padding: 0px;
    }

    .softwareSlide{
        width: calc(100% - 70px);
        margin-left: auto;
        margin-right: auto;
    }

    .bannerLeft.secondSlide ,
    .bannerRight.secondSlide{
        padding: 5px;
    }

    .titleTxt{
        font-size: 18px;
    }

    .sectionTitle2 {
        flex-flow: row;
        align-items: flex-end;
        margin-bottom: 20px;
        justify-content: center;
        width: 100%;
    }

    .hpSecTxt.boldTxt {
        line-height: 33px;
        margin-right: 8px;
    }

    .hpSecTxt {
        line-height: 28px;
    }

    .slideWrap{
        margin-top: 0;
    }

    .productDetailImg2 {
        width: 100%;
    }

    .productDetailsSection01 {
        margin-left: 0;
    }

    .hpSection04 {
        margin-left: unset;
        padding: 30px !important;
    }

    .carousel-indicators {
        bottom: -5px;
    }

    .carousel-indicators li {
        width: 10px;
        height: 10px;
    }

    .introTitle {
        font-size: 30px;
    }

    .cardShadow {
        margin-top: 25px;
    }

    .greyBox {
        padding: 20px 20px;
    }

    .form-control textarea {
        height: 1500px;
    }

    .slideArrowLeft {
        left: 5px;
    }

    .slideArrowRight {
        right: 65px;
    }

    .productTitleFont02 {
        font-size: 15px;
    }

    .productImg {
        margin-top: 30px;
    }

    .productImg05 {
        width: 100%;
        margin-top: 53px;
        height: unset;
    }

    .productDetailImg {
        width: 100%;
    }

    .productDetailBox {
        margin-top: unset;
    }

    .hpSection01_bg {
        width: 200px;
    }

    .hpSection01Font01 {
        font-size: 25px !important;
    }

    .hpSection01_center2 {
        width: 100%;
    }

    .hpSection01Font02 {
        font-size: 14px;
    }

    .hpSection02 {
        /* padding: 50px 10px; */
        padding: 20px 0px 50px 0px;
    }

    .hpSection02BoxContent1 {
        padding: 20px 15px;
    }

    .hpSection02BoxContent2 {
        padding: 30px 40px 40px 40px;
    }

    #healthCareDIV{
        display: flex;
    }

    .hpSection02Font01 {
        font-size: 18px;
    }

    .hpSection02Font03 {
        font-size: 18px;
    }

    .hp01CarTitle {
        font-size: 20px;
    }

    /* .hpSection02Font04 {
        font-size: 14px;
    } */

    .hpSection04BoxMobile {
        display: block;
    }

    .hpSection04BoxWeb {
        display: none;
    }

    .hpSection04ContentMargin {
        margin-left: unset;
    }

    .hpSection04Content {
        margin-right: unset;
    }

    .hpSection06 {
        padding: 10% 12% 10% 12% !important;
    }

    .hpSection06Content {
        padding-right: unset;
    }

    .hpSection06Font01 {
        font-size: 24px;
    }

    .hpSection03Web {
        display: none;
    }

    .hpSection03Mobile {
        display: block;
    }

    .hpSection03Mobile {
        padding: 20px 0;
        background-color: #F3F6F8;
    }

    .hpSection02Font04 {
        /* padding: 15px; */
    }

    .modalLoginBtn, .loginInput {
    }

    .loginModal {
        max-width: 97% !important;
    }

    .progressBarDesc {
        padding: 0;
        margin-bottom: 0;
    }

    .progressBarDesc li {
        width: 25%;
    }

    .progressBarDesc li span {
        display: none;
    }

    .progressBarDesc li::before {
        top: -50%;
    }

    .progressBarDesc li::after {
        bottom: 1em;
    }

    .progressBarDesc li {
        margin: 0em;
    }

    .getQuoteBtn2 {
        width: 80% !important;
    }

    .carDetailsPopUpBTN{
        width: 80% !important;
    }

    .originalPrice {
        font-size: 13px;
    }

    .currentPrice {
        font-size: 15px;
    }

    .quotationComp {
        font-size: 18px;
    }

    .loadingIcon {
        width: 50%;
        padding: 20px;
    }

    .formInput {
        width: 100%;
    }

    .tooltiptext:after {
        margin-left: 150px;
    }

    /* .tooltiptextCI:after {
        margin-left: 150px;
    } */

    .quotationText3 {
        font-size: 22px;
    }

    .info_icon {
        vertical-align: sub;
    }

    .providerLogo {
     //   width: 80%;
    }

    .forgotPasswordDiv {
        padding: 50px;
        position: unset;
    }

    .forgotPwdBg {
        height: 50vh;
    }

    .getQuoteBtn {
        width: 50% !important;
    }

	.getQuoteBtnNextnBack {
		width: 50% !important;
	}

    .blueCircle {
        left: 20%;
        top: 10%;
    }

    .forgotPwdTitle {
        top: 35%;
        left: 49%;
        font-size: 22px;
        line-height: 30px;
    }

    .forgotPwdDesc{
        top: 60%;
    }

    .hpSection03_font01 {
        font-size: 18px;
    }

    .hpSection03_bg {
        padding: unset;
    }

    .hpSectionBIG_title_bg {
        padding: unset;
    }

    .hpSectionWhoWeAre_bg {
        padding: unset;
    }

    .hpSection04_font03 {
        font-size: 16px;
    }

	.contactContent {
		flex-direction: column;
	}

	.contactContent > .footerInfoItems {
		border-right: none;
		padding: 0;
	}

	.footerDetailTxt {
		text-align: center;
	}

	.privacyContent {
		justify-content: center;
		align-items: stretch;
	}

	.privacyContent > .footerInfoItems {
		padding: 0;
		flex: 1;
		text-align: center;
	}

	.travelPlanWrap {
		padding: 0;
	}

	.quotationContentWrap.travelPlanContentWrap {
		padding: 25px 20px;
	}

	.providerLogoWrap.travelLogoWrap {
		height: unset;
	}

	.descPlan.travelDescPlan {
		align-items: center;
	}

  .companyAboutUs-text {
    width: 100%;
  }
  
  .w-mobile-100 {
    width: 100% !important;
  }

  .mobileTab {
    justify-content: center;
  }

 /* HomePage Section - Mobile View */

  .hpSection2 {
    margin-inline: 50px;
    text-align: center;
  }
 
  .feature-main-title {
    font-size: 22px;
  }

  .main-img {
    clip-path: unset;
    border-radius: unset;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
  }

  .card-motor-title, .card-travel-title, .card-personal-title, .card-dental-title {
    font-size:18px;
    margin-top:1.5rem;
  }

  .motor-content-bottom {
    text-align:center;
    padding-bottom:22px;
  }

  .travel-card-body {
    display: flex;
    flex-direction:column-reverse;
    text-align:center;
    padding-bottom: 22px;
  }

  .main-img-travel {
    clip-path:unset;
    border-radius: unset;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
  }


  .travel-content-container {
    padding:unset;
    text-align: center;
    padding-bottom: 22px;
  }

  .card-personal-body {
    text-align: center;
    padding-bottom: 22px;
  }

  .personal-button {
    margin:0;
  }

  .travel-text span {
    font-size:17px;
  }

  .travel-text {
    font-size:16px;
  }

  .card-dental-flex {
    display: flex;
    flex-direction: column-reverse;
  }

  .partner-section-container {
    margin:0;
  }

  .hpSectionPartner img {
    height: unset;
    width: 100px;
    margin-bottom:2rem;
  }

  .partner-logo1 img {
    width:130px;
  }

  .partner-logo4 img {
    width:150px;
  }

  .partner-logo5 img {
    width: 130px;
  }

 /* End of HomePage Section - Mobile View */
}

@media (min-width: 768px) and (max-width: 1030px) {
.homepage-btn-container {
                width: 80%;
        }	
}

/* Ipad View */
@media (min-width: 768px) and (max-width: 990px) {
	#homePageTitle { 
		padding: 70px 20px;
	}
    .sectionTitle2 {
        flex-flow: wrap;
        align-items: unset;
        justify-content: start;
    }

	

    .slideTitle {
        font-size: 31px;
    }

    .slideDes {
        font-size: 23px;
    }

    .productFooter {
        width: 100%;
        margin-left: unset;
    }

    .sectionAlign {
        margin-top: 110px;
    }

    .productTitleDetailMargin {
        margin-top: 0;
    }

    .productTitleDetailMargin2 {
        margin-top: 3rem;
    }

    .productTitleWidth {
        width: 155px;
    }

    .productImg03 {
        width: 100%;
    }

    .productTitleFont02 {
        font-size: 14px;
    }

    .productImg {
        margin-top: 50px;
    }

    .productImg04 {
        width: 100%;
        margin-top: 50px;
    }

    .productImg05 {
        width: 100%;
        margin-top: 53px;
        height: unset;
    }

    .productImg06 {
        width: 100%;
        margin-top: 30px;
        margin-bottom: 25px;
    }

    .productDetailImg {
        width: 100%;
    }

    .productDetailBox {
        margin-top: unset;
    }

    .hpSection04BoxMobile {
        display: none;
    }

    .loginModal {
        max-width: 80% !important;
    }

    .progressBarDesc li {
        width: 25%;
    }

    .getQuoteBtn2 {
        width: 70% !important;
    }

    .carDetailsPopUpBTN{
        width: 70% !important;
    }

    .quotationComp {
        font-size: 17px;
    }

    .tooltip .tooltiptext {
        left: 71%;
    }

    .tooltipCI .tooltiptextCI {
        left: -110%;
    }

    .tooltiptext:after {
        left: 18%;
    }

    .tooltiptextCI:after {
        left: 80%;
    }

    .quotationText3 {
        font-size: 22px;
    }

    .blueCircle {
        left: 20%;
        top: 20%;
    }

    .forgotPwdDesc{
        top: 55%;
    }

    .forgotPasswordDiv {
        top: 30%;
    }

   /* HomePage Section - Ipad view */
    .hpSection2 {
      margin-inline:15px;
    }

    .card-motor {
      padding: 0;
    }

    .hpSectionPartner img {
      height: unset;
      width: 80px;
    }

    .partner-section-container {
      margin-inline:0;
    }

    .feature-padding {
      height:250px;
    }

    .feature-img-container {
      height:100%;
    }

    .main-img, .main-img-travel {
      height:100%;
    }

  /* End of HomePage Section - Ipad view */

}

/* Ipad Pro View */
@media (min-width: 991px) and (max-width: 1199px) {
    .slideTitle{
        font-size: 41px;
    }

    .slideDes{
        font-size: 25px;
    }

    .slideTxtWrap {
        transform: translateY(-50%);
    }

    .hpSection02Txt{
        font-size: 15px;
    }

    .productFooter {
        width: 100%;
        margin-left: unset;
    }

    .sectionAlign {
        margin-top: 110px;
    }

    .productDetailImg {
        width: 100%;
    }

    .productDetailBox {
        margin-top: unset;
    }

    .hpSection04BoxMobile {
        display: none;
    }

    .loginModal {
        max-width: 80% !important;
    }

    .progressBarDesc li {
        width: 16%;
    }

    .getQuoteBtn2 {
        width: 60% !important;
    }

    .carDetailsPopUpBTN{
        width: 60% !important;
    }

    .tooltip .tooltiptext{
        left: 62%;
    }

    .tooltipCI .tooltiptextCI{
        left: -62%;

    }

    .blueCircle {
        left: 22%;
        top: 20%;
    }

    .forgotPwdDesc{
        top: 55%;
    }

    .forgotPasswordDiv {
        top: 30%;
    }
}

/* Iphone 5 View */
@media (max-width: 320px) {
    .loginModal {
        max-width: 100% !important;
    }

    .tooltip .tooltiptext {
        left: -2%;
    }

    .tooltiptext:after {
        margin-left: -58px;
    }

    .tooltipCI .tooltiptextCI {
        left: -1110%;
    }

    /* .tooltiptextCI:after {
        margin-left: 150px;
    } */

    .getQuoteBtn {
        width: 30% !important;
    }

    .blueCircle {
        left: 18%;
        top: 5%;
    }

    .forgotPwdTitle {
        top: 33%;
        left: 49%;
        font-size: 20px;
        line-height: 20px;
    }

    .forgotPwdDesc {
        font-size: 11px;
    }

    .forgotPwdText {
        font-size: 15px;
    }

    .getQuoteBtn {
        width: 60% !important;
    }

    .ip5Pad {
        padding-left: 0px;
    }
}

/* Menu */
/* .site-menu-exit{
    cursor: pointer;
    display: none;
    text-align: right;
    margin-top: 30px;
    position: absolute;
    right: 5%;
} */

/* .material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
  } */

.site-menu-exit{
    cursor: pointer;
    display: block;
    text-align: right;
    margin-right: 15px;
    text-align: right;
}

.homepage-mobile-profile-bg{
    /* padding-top: 80px; */
    /* background-image: url("/images/homepageMenuIcon/bg-img.png"); */
}

.homepage-profile-picture{
    width: 80px;
    height: 80px;
    border-radius: 50%;
    border: 1px solid #999696b3;
    box-shadow: 0 0 0 3px #fff, 0 0 0 3px #fff;
    -webkit-filter: drop-shadow(5px 5px 5px #666666);
    filter: drop-shadow(5px 5px 5px #e5e5e5);
}

#homepageSubmitTitleWeb{
    font-size:65px;
}

/* homepage contactus title */
@media (min-width: 768px) and (max-width: 955px) {
    #homepageSubmitTitle ,#homepageSubmitTitleWeb{
        font-size:48px;
    }
}

@media (min-width: 956px) and (max-width: 1012px) {
    #homepageSubmitTitle ,#homepageSubmitTitleWeb{
        font-size:55px;
    }
}

@media (min-width: 1013px) and (max-width: 1050px) {
    #homepageSubmitTitle ,#homepageSubmitTitleWeb{
        font-size:65px;
    }
}

/* .fontPlayfairDisplay{
    font-family: 'Playfair Display' !important;
} */

@media (min-width: 320px) and (max-width: 767px) {
    .getQuoteBtnNextnBackSummary{
        width: 70% !important;
    }

    .hpSectionBIG_title_word {
        font-weight: 900;
        color: #000;
        font-size: 25px;
    }
}

#homepagePhoneicon{
    font-size: 20px;
}

/* homepage top image responsive */
@media (min-width: 320px) and (max-width: 375px) {
    #imgcoverEng{
        /* height: 450px; */
        height: 100%;
        background-image: url(/images/White-Label/mobileviewHPIMG.jpg);
        background-position: 50% 15% !important;
    }
    #imgInsideButton{
        /* margin-top: -40%; */
        /* width: 50%; */
        /* left:25%; */
    }
    #homePageTitle{
        /* margin-top: -100%; */
        width: 100%;
        left: 0;
    }
    #hpIMGcalBtn{
        width: 200px;
    }
    #hpIMGtitle{
        font-size: 30px;
    }

}
@media (min-width: 376px) and (max-width: 450px) {
    #imgcoverEng{
        /* height: 550px; */
        height: 100%;
        background-image: url(/images/White-Label/mobileviewHPIMG.jpg);
        background-position: 50% 15% !important;
    }
    #imgInsideButton{
        /* margin-top: -40%; */
        /* width: 40%;
        left:30%; */
    }
    #homePageTitle{
        /* margin-top: -100%; */
        width: 100%;
        left: 0;
    }
    #hpIMGcalBtn{
        width: 200px;
    }
    #hpIMGtitle{
        font-size: 30px;
    }
}
@media (min-width: 451px) and (max-width: 551px) {
    #imgcoverEng{
        /* height: 650px; */
        height: 100%;
        background-image: url(/images/White-Label/mobileviewHPIMG.jpg);
        background-position: 50% 15% !important;
    }
    #imgInsideButton{
        /* margin-top: -40%; */
        /* width: 40%;
        left:30%; */
    }
    #homePageTitle{
        /* margin-top: -100%; */
        width: 100%;
        left: 0;
    }
    #hpIMGcalBtn{
        width: 200px;
    }
    #hpIMGtitle{
        font-size: 30px ;
    }
}
@media (min-width: 550px) and (max-width: 599px) {
    #imgcoverEng{
        /* height: 750px; */
        height: 100%;
        background-image: url(/images/White-Label/mobileviewHPIMG.jpg);
        background-position: 50% 15% !important;
    }
    #imgInsideButton{
        /* margin-top: -40%; */
        /* width: 40%;
        left:30% ; */
    }
    #homePageTitle{
        /* margin-top: -100%; */
        width: 100%;
        left: 0;
    }
    #hpIMGcalBtn{
        width: 200px;
    }
    #hpIMGtitle{
        font-size: 30px;
    }
}
@media (min-width: 600px) and (max-width: 767px) {
    #imgInsideButton{
        /* margin-top: -25% !important; */
        /* width: 26% !important;
        left: 37% !important; */
    }
    #homePageTitle{
        /* margin-top: -60% !important; */
        width: 100% !important;
        left: 0% !important;
    }
    #hpIMGtitle{
        font-size: 30px;
    }
}
@media (min-width: 600px) and (max-width: 900px) {
    #imgcoverEng{
        /* height: 500px; */
        height: 100%;
    }
    #imgInsideButton{
        /* margin-top: -20%; */
        /* width: 26% ;
        left:37% ; */
    }
    #homePageTitle{
        /* margin-top: -45% ; */
        width: 100% ;
        left: 0% ;

    }
    #hpIMGcalBtn{
        width: 200px;
    }
    #hpIMGtitle{
        font-size: 40px;
    }
}
@media (min-width: 901px) {
    #imgcoverEng{
        /* height: 600px; */
        height: 100%;
    }
    #imgInsideButton{
        /* margin-top: -20%; */
        /* width: 26% ;
        left:37% ; */
    }
    #homePageTitle{
        /* margin-top: -40% ; */
        width: 100% ;
        left: 0% ;
    }
    #hpIMGcalBtn{
        width: 200px;
    }
    #hpIMGtitle{
        font-size: 40px;
    }
}
@media (min-width: 1225px) {
    /* #imgcoverEng{
        background-size: 100% 640px;
        height: 640px;
        margin-top: 5%;
    } */

    #imgInsideButton{
        /* margin-top: -16%;  */
        /* width: 26% ;
        left:37% ; */
    }
    #homePageTitle{
        /* margin-top: -33% ; */
        width: 100% ;
        left: 0% ;
    }
    #hpIMGtitle{
        font-size: 60px;
    }
    #hpIMGcalBtn{
        width: 200px;
    }
}

@media (min-width: 320px) and (max-width: 767px) {
    .footer-mb{
        margin-bottom: 0px !important;
    }

    #welcomeHPbtnDIV{
        padding: 30px;
    }

    #imgPage2{
        width: 100%;
    }

    #vehicleNum{
        margin-bottom: 0px;
    }

    #page2TopDIV{
        padding: 6%;
    }

    #plan_feature{
        padding: 8%;
    }

    #totalAmountBtmDIV{
        padding: 6% !important;
    }

    #carOwnerDetailForm{
        padding: 6% !important;
    }

    #summaryDIVsection{
        /* padding: 6% !important; */
    }

    .fontSIZE15{
        font-size: 15px;
    }

    .fontSIZE12{
        font-size: 12px;
    }

    .benefitBox {
        padding: 3% 5%;
    }

    #checkoutSizeBox{
        padding: 1% 5% 5% 5% !important;
    }

}

@media (min-width: 320px) and (max-width: 450px){

    #vehicleDIV{
        flex-direction: column !important;
    }

    #carMarketValueID{
        margin-left: 0%;
    }

    #HPsectionBTM{
        padding: 20px 50px !important;
    }

    .socialMediaDIV{
        left: 30px !important;
    }
}

@media (min-width: 1200px){
    .tooltip .tooltiptext {
        left: 64%;
    }
}

@media (min-width: 1200px){
    .tooltipCI .tooltiptextCI {
        left: -64%;
    }
}

@media (min-width: 768px){
    #footerLine1{
        margin-top: 1rem!important;
    }
}

@media (min-width: 375px) and (max-width: 485px){

    .tooltipCI .tooltiptextCI {
        left: -919%;
    }

    .tooltiptextCI:after {
        margin-left: 55px;
    }
}

@media (min-width: 486px) and (max-width: 599px){

    .tooltipCI .tooltiptextCI {
        left: -600%;
    }

    .tooltiptextCI:after {
        margin-left: 55px;
    }
}

@media (min-width: 600px) and (max-width: 767px){

    .tooltipCI .tooltiptextCI {
        left: -500%;
    }

    .tooltiptextCI:after {
        margin-left: 55px;
    }
}

.options2{
    display: block;
    width: 100%;
    height: calc(1.5em + 1.3rem + 2px);
    padding: 0.65rem 1rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    -webkit-transition: border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    text-decoration: none;
}

.dropdown-menu {
    max-height: 280px;
    overflow-y: auto;
}

.dropdown-content{
    max-height: 280px;
    overflow-y: auto;
}

@media (min-width: 1024px){
    .getQuoteBtnNextnBack{
        width: 35% !important;
    }
}

@media (max-width: 450px){
    #basicPremiumDIV{
        text-align: left ;
        padding: 0px;
    }
}

@media (min-width: 451px){
    #basicPremiumDIV{
        text-align: right;
        padding: 0px;
    }
}

#quotationBtnHP{
    padding: 10px 15px;
    font-weight: 600;
    font-size: 14px;
    color: #fff;
    background-color: #FFB617;
    border-radius: 20px;
}

.hpSectionBIG_title_bg {
    background-image: url('../images/White-Label/carkey.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 50px 170px;
}

.hpSectionBIG_title_word {
    font-weight: 900;
    color: #000;
    font-size: 40px;
}

#contactIMG{
    background-image: url('../images/White-Label/car-2022-12-16-03-42-58-utc.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
/* homepage.css */

/* custom.css */
/* Keep this for all project */

.body, div, a, button, span, input, section,footer,header {
    font-family: "MainFont";
}

.font2 {
    font-family: "SecondFont", sans-serif !important;
}

/* Keep until here */

/* Dashboard */

.dashboardSection01 {
    background-color: #fff;
	background: url('/images/project/steps-bg.png');
	background-position: 50% 80%;
	background-size: cover;
    margin-top: 125px;
	padding: 75px 75px 0;
}

.dashboardSection01Box {
	background: transparent;
    /* background-color: white; */
    padding: 3% 3%;
    position: absolute;
    /* box-shadow: 1px 3px 16px 0px rgb(0 0 0 / 13%); */
    top: 50%;
}

.dashboardSection01Border{
}

.dashboardSection01Border:first-child{
}

.dashboardSection01Title {
    color: #000;
    font-size: 42px;
    font-weight: 600;
}

.dashboardSection01Content{
    font-size: 15px;
}

.dashboardSection01Content {
    color: #000;
}

.dashboardText {
    color: black;
    font-size: 17px !important;
	font-weight: 600;
}

.dashboardText2 {
    color: black;
    font-size: 20px;
    font-weight: 700;
}

.greenText {
    color: #77c823;
}

.redText {
    color: red;
}

.dashboardSection02 {
    padding: 5%;
    padding-top: 15%;
    background-color: white;
}

.dashboardSection02Box {
    background-color: white;
    box-shadow: 1px 3px 16px 0px rgb(0 0 0 / 13%);
    border: 1px solid #fbfbfb;
}

.vehicleBoxBg {
    background-color: #e5e5e5;
    margin: -1px;
    padding: 3%;
}

.vehicleBoxBg.active {
    background-color: #ebfafd;
}

.renewBtn {
    padding: 10px 50px !important;
    font-weight: 600;
    font-size: 14px;
    color: #fff;
    background-color: #76c820;
    border-radius: 20px;
    color: white !important;
}

.coverBtn {
    padding: 10px;
    font-weight: 600;
    font-size: 14px;
    color: #fff;
    border-radius: var(--border-radius);
    background-color: var(--theme-color);
    color: white !important;
}

.coverBtn.iconOnRight {
	min-width: 150px;
}

.dashboardIcon {
    width: 50%;
}

.carIcon img {
    width: 50%;
}

.announcementBox {
    padding: 5%;
    padding-left: 0;
}

.announcementBox {
    padding-right: 0;
}

.announcementImg {
    width: 100%;
    box-shadow: 1px 3px 16px 0px rgb(0 0 0 / 13%);
    filter: brightness(60%);
}

.announcementText {
    position: absolute;
    color: white;
    top: 20%;
    font-size: 18px;
    left: 15%;
    width: 65%;
    font-weight: 700;
}

.announcementTextSub {
    position: absolute;
    color: white;
    top: 45%;
    font-size: 14px;
    left: 15%;
    width: 65%;
    font-weight: 700;
}

.announcementLogo {
    position: absolute;
    color: white;
    top: 55%;
    font-size: 14px;
    left: 10%;
    width: 20%;
    font-weight: 700;
}



.announcementDate {
    position: absolute;
    top: 70%;
    left: 15%;
    color: white;
    font-size: 15px;
    font-style: italic;
}

/* Profile */
.profileBG {
    background-color: #053941;
    margin-top: 100px;
}

.profilePic {
    width: 50%;
    border: 5px solid white;
    border-radius: 100%;
    margin-top: -25%;
}

.editFont {
    text-decoration: underline !important;
    color: #FFB617 !important;
    font-size: 17px;
    font-weight: 600;
}

.profileFont {
    font-size: 15px;
    word-break: break-word;
}

.profileBox {
    padding: 3%;
    box-shadow: 1px 3px 16px 0px rgb(0 0 0 / 13%);
}

.uploadBox {
    padding: 20px;
    border: 1px dashed #C6CCD6;
    background-color: #F9F9FB;
    cursor: pointer;
}

/* Slides */
.slideshow-container {
    position: relative;
}

.newsSlide {
    display: none;
    height: 100%;
}

.dot {
    cursor: pointer;
    height: 9px;
    width: 9px;
    margin: 0 5px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
    transition: background-color 0.6s ease;
}

.dot.active {
    background-color: #00b2ce;
}

.dot:hover {
    background-color: #00b2ce;
    opacity: 0.75;
}

.fading {
    -webkit-animation-name: fade;
    -webkit-animation-duration: 1.5s;
    animation-name: fade;
    animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

@keyframes fade {
    from {opacity: .4}
    to {opacity: 1}
}

/* Default Button */
.btn-primary {
    font-weight: 400;
    font-size: 12px;
    padding: 10px !important;
    cursor: pointer;
    font-weight: 600;
    font-size: 14px;
    color: #fff !important;
    background-color: #FFB617;
    border-radius: 20px;
    text-align: center !important;
}

.btn-primary:hover {
    opacity: 0.7;
    background-color: #00B2CE;
}

.btn-primary.black {
    background-color: black;
}

.btn-primary.black:hover {
    opacity: 0.7;
    background-color: black;
}

.btn-primary.gray {
    background-color: #767c8a;
}

.btn-primary.gray:hover {
    opacity: 0.7;
    background-color: #767c8a;
}

.walletBox {
    width: 250px;
    background-image: url(../images/project/walletBox.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    padding: 100px 50px;
    margin-right: 20px;
}

.walletBoxText1 {
    color: #000;
    font-weight: 600;
    font-size: 14px;
    letter-spacing: 3px;
}

.walletBoxText2 {
    color: #000;
    font-weight: 600;
    font-size: 18px;
    letter-spacing: 3px;
}

.btn-more {
    font-weight: 400;
    font-size: 8px;
    color: #fff;
    background: rgb(98,186,232);
    background: linear-gradient(90deg, rgba(98,186,232) 0%, rgba(63,104,176) 100%);
    border-top-left-radius: 35px;
    border-bottom-right-radius: 35px;
    border: unset;
    padding-left: 20px;
    padding-right: 20px;
    letter-spacing: 3px;
    padding: 5px 18px;
}

.goldLine {
    height: 3px;
    display: block;
    padding-top: 2px;
    background: rgb(140,96,52);
    background: -webkit-linear-gradient(left, rgba(140,96,52) 0%, rgba(255,231,159) 50%, rgba(166,112,51) 100%);
    background: -o-linear-gradient(left, rgba(140,96,52) 0%, rgba(255,231,159) 50%, rgba(166,112,51) 100%);
    background: linear-gradient(to right, rgba(140,96,52) 0%, rgba(255,231,159) 50%, rgba(166,112,51) 100%);
}

.dashboardSection03 {
    padding: 20px 0 20px 20px;
}

.dashboardSection03Bg {
    background-image: url(../images/project/dashboardBG2.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.dashboardSection03Content {
    background-color: #E0EAF0;
    padding-bottom: 30px;
}

.dashboardSection03Padding {
        padding-top: 18px;
}

.dashboardSection03Title {
    width: 230px;
    margin-top: 25px;
    padding: 5px 0px 5px 20px;
    background-color: #fff;
    color: #000;
    font-weight: 600;
    font-size: 18px;
    letter-spacing: 3px;
}

.dashboardSection03ContentBlock {
    color: #3F68B0;
    text-align: center;
    border-right: 1px solid #666666;
}

.dashboardSection03ContentBlock:last-child {
    border-right: 1px solid transparent;
}

.dashboardSection03ContentDetail {
    color: #000;
}

.dashboardSection03Padding {
    padding-right: 0;
}

.diagramBtnBox {
    background-color: #fff;
    padding: 3px 3px;
    position: unset;
    display: inline-block;
}

.diagramBtnBoxFloat {
    background-color: #fff;
    padding: 3px 3px;
    border: 1px solid #cacaca;
    border-radius: 8px;
    position: fixed;
    top: 23%;
    left: 55px;
    z-index: 4;
    box-shadow: 5px 5px 10px #00000052;
}

.diagramBtnBoxMobile {
    background-color: #fff;
    padding: 3px 3px;
    border: 1px solid #cacaca;
    border-radius: 8px;
    position: fixed;
    top: 15%;
    left: 27px;
    z-index: 4;
    box-shadow: 5px 5px 10px #00000052;
    display: inline-flex;
    flex-flow: column-reverse;
}

.copiedMsg {
    color: #000;
    font-size: 15px;
    text-align: center;
    margin-bottom: 10px;
}

.copiedMsg i {
    background-color: #32CD32;
    color: #fff;
    font-size: 15px;
    padding: 2px 3px;
    margin-top: -2px;
    margin-right: 4px;
    border-radius: 50%;
}

.btnSocial {
    color: #000;
}

.btnSocial:hover {
    color: #CCC;
}

.searchBox {
    box-shadow: 1px 3px 16px 0px rgb(0 0 0 / 13%);
    background-color: white;
    padding: 20px;
}

.customMargin {
    margin-right: 20px;
}

/* Overwriting form filters classes for listing page */
.pageContent {
    color: black;
}

.input-group-text {
    border: 0;
    background: white;
}

.filter .input-group .form-control {
    border: 0;
}

.filter .input-group {
    border: 1px solid #E0E0E0;
    border-radius: 4px;
}

.filter .input-group:focus-within, .filter .input-group:hover {
    border: 1px solid #006ec4;
}

.kt-container.formPage {
    padding-left: 5%;
    padding-right: 5%;
}

.searchContainer{
  padding-left: 15%;
  padding-right: 15%;
}

/* Overwriting table classes for listing display */
.customTable {
    box-shadow: 1px 3px 16px 0px rgb(0 0 0 / 13%);
    border: 0!important;
}

.customTable thead tr {
    background-color: var(--theme-color) !important;
}

.createDefaultTable thead tr {
    background-color: var(--theme-color) !important;
}

.createDefaultTable thead tr th {
    color: white !important;
    border: none !important;
}

.customTable thead tr th {
    color: white !important;
    border: none !important;
}

.customTable tbody tr td {
    /* border: none !important;
    border-bottom: 2px solid #f0f0f0 !important; */
}

.customTable tbody tr.invisibleTR td {
	border-left: none !important;
	border-right: none !important;
}

.customTable tbody tr:last-child td {
    border-bottom: none !important;
}

.customTable tbody tr:nth-of-type(odd){
    /* background-color: white !important; */
}

.customTable tbody tr.invisibleTR:nth-of-type(odd){
    background-color: transparent !important;
}

#listingDiv {
    /* font-family: Arial, Helvetica, sans-serif; */
    border-collapse: collapse;
    width: 100%;
}

#listingDiv td, #listingDiv th {
    border: 1px solid #ddd;
    /* padding: 8px; */
}

#listingDiv tr:nth-child(even){background-color: #f2f2f2;}

#listingDiv tr:hover {background-color: #ddd;}

#listingDiv th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    background-color: #FFB617;
    color: white;
}

.pagination>li>a, .pagination>li>span {
    position: relative;
    float: left;
    padding: 6px 12px;
    line-height: 1.42857143;
    text-decoration: none;
    /* color: #337ab7; */
    /* background-color: #fff; */
    /* border: 1px solid #ddd; */
    margin-left: -1px;
    background-color: transparent;
    border: 0;
    color: #7b7777;
}

#pagerRedeemList, #pagerList{
    display: inline-flex;
    padding: 20px 0px;
}

.pagination .active a, .pagination .active a:hover, .pagination .active a:focus{
    background-color: #FFB617;
    border-radius: 5px;
    color:white;
  }

  #insuranceListTable tbody:before {
    content:"-";
    display:block;
    line-height:20px;
    text-indent:-99999px;
}



@media (max-width: 368px){
    #changePwdBtn{
        margin-left: 0px !important;
        width:100%;
    }

    #editProfileBtn{
        width:100%;
    }

    #saveBtn{
        width:100%;
    }

    #cancelBtn{
        margin-left: 0px !important;
        width:100%;
    }

}

#checkOutBack{
    cursor: pointer;
}

.pointerr{
    cursor: pointer;
}

@media (min-width: 768px) and (max-width: 964px) {
    #getQuoteICPP{
        margin-bottom: 28px !important;
    }
}

.dataTables_empty{
    height: 400px;
    background: url(/images/NoResultFound.png) no-repeat;
    background-size: 100px 40%;
    background-position: 50% 50%;
}

#registerBtnModal{
    color: #FFB617;
    text-decoration: underline;
}

@media (min-width: 320px) and (max-width: 375px) {
    .quotationList{
        padding: 20px 20px;
    }


}

@media (min-width: 320px) and (max-width: 768px) {
    #quotationDetailsText1 , #quotationDetailsText2{
        font-size : 17px;
    }
}

@media (min-width: 320px) and (max-width: 768px) {
    .priceDetail{
        margin : 0;
    }
}

.textRight{
    text-align: right;
}

.textLeft{
    text-align: left;
}

.borderBTM{
    border-bottom: 1px solid white;
}

header.header-scroll {
    background-color: black;
}

@media (min-width: 320px) and (max-width: 767px) {
    #footerLine1{
        border-bottom: 0px solid #42646B;
    }

    #footerLine2{
        border-bottom: 1px solid #42646B;
        padding-bottom: 0px !important;
    }
}

@media (min-width: 320px) and (max-width: 575px) {
    #loginTopDiv{
        padding: 5% 15%;
        text-align: center;
    }

    #loginLogo{
        padding-right: 5px !important;
        padding-left: 10px !important;
        padding-top: 5px !important;
        padding-bottom: 5px !important;
        width: 60%;
    }



    #loginDiv{
        padding: 0% 10% 10% 10% !important;
        margin-top: unset;
    }
}

@media (min-width: 320px) and (max-width: 767px) {
    #getQuoteTitle{
        margin-bottom: 50px !important;
        margin-top: 20px !important;
    }
}

.marginEmpty{
    margin: 0px 0px !important;
}

.summaryTopDIV{
    /* background-color: #ebfafe; */
    padding: 3% 1%;
    font-size: 15px;
}

@media (min-width: 320px) and (max-width: 767px) {
    .summaryTopDIV{
        /* background-color: #ebfafe; */
        padding: 5% 1% 3% 1%;
    }

    #summaryFullName , #summaryIC , #summaryCarNum , #summaryCarType{
        text-align: end;
    }

    #totalAmountBtmDIV{
        margin-left: 0px !important;
    }

    #divSection{
        padding: 0px !important;
    }
}

@media (min-width: 320px) and (max-width: 767px) {
    #bottomBTMNEXT{
        text-align: center !important;
    }

    #bottomBTMAmount{
        text-align: center !important;
        margin-bottom: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }

    #RMamount{
        margin: 0px !important;
    }

}

@media (min-width: 320px) and (max-width: 767px) {
    .mobile-size-center{
        padding-right: 0px !important;
    }
    .container-myInsurance{
        padding-left: 5%;
        padding-right: 5%;
    }
}

.f-w-600{
    font-weight: 600 !important;
}

.bg-white{
   background-color: white;
}

.footerColor{
    color : #E8E8E8;
}

.iconColor{
    color : #000000;
}

#search-head:not(.collapsed) .rotate-icon {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

#fgtPasswordLink{
    font-weight: 700;
}

#quotationDetailsText1 , #quotationDetailsText2{
    font-size : 18px;
}

#totalAmountBtmDIV{
   padding: 2% 5%;
}

.quoteFormBox {
  padding-top: 0 !important;
}

.quoteFormBox, 
#quoteFormBox{
    padding : 4%;
}

#searchQuotationTabs .quoteFormBox, 
#searchQuotationTabs #quoteFormBox {
    padding: 3%;
}

#searchQuotationTabs {
	padding-top: 50px;
}

.travelQuotationBox {
    padding: 4%;
    position: relative;
}

#carOwnerDetailForm{
    padding : 4%;
}

.planListBoxWrap {
    padding: 20px;  
}

.planListBox{
  cursor: pointer;
    /* padding : 30px 20px !important; */
}

.carOwnerDetailText{
    font-size: 15px;
    font-weight: bold;
}

.profileTitle{
    font-size: 25px;
}

#editProfileDIV{
    padding-top: 3rem;
}

.dashboardTextContent{
    color: black;
    font-size: 18px;
    font-weight: 700;
}

#profileTopIMG{
    height: 160px;
}

#loginDiv, 
#forgotPasswordDiv, 
#registerDiv {
    align-items: center;
    display: flex;
    justify-content: center;
    margin-top: 75px;
    min-height: 100vh;
    padding: 70px 0;
}

.registrationForm {
	border-radius: 5px;
	max-width: 425px;
	padding: 45px;
}

.linkTextWrap {
  font-size: 14px;
}

a.linkText {
  color: var(--theme-color);
  text-decoration: underline;
}

@media (min-width: 320px) and (max-width: 767px) {
    #profileTopBG{
        margin-top: 0px;
    }

    #purchaseContainer , #insuranceContainer{
        padding-top: 13%;
    }

    .planListBoxWrap {
      	padding: 0;  
    }   
}

@media (min-width: 768px) and (max-width: 1023px){
    #registerDiv{
    }
}

@media (min-width: 1024px){
    #registerDiv{
    }
    #registerBG{
        height: 120vh !important;
    }
    #btnChoose{
        text-align:center;
        width: 30%;
    }
}


@media (min-width: 320px) and (max-width: 960px){
    #registerLeftIMG{
        display: none;
    }
}

@media (min-width: 320px) and (max-width: 1023px){
    #registerLeftIMG{
        display: none;
    }
}

#loginLogo{
    padding-right: 25px !important;
    padding-left: 10px !important;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
}

@media (min-width: 320px) and (max-width: 767px){
    .quoteFormBox, 
    #quoteFormBox{
        padding: 6%;
    }

    .travelQuotationBox {
        padding: 6%;
    }

    .planListBox {
        /* padding: 5% !important; */
        /* padding: 5% 5% 30px 5% !important; */
        margin-top: 10%;
    }

    .borderLine {
        margin: 0 -6% 3% -6%;
    }

    .descPlan{
        font-size: 15px;
        display: flex;
    }

    .cusMT2{
        margin-top: 2rem!important;
    }

    .cusMT1{
        margin-top: 1rem!important;
        margin-bottom: 15px !important;
    }
}

@media (min-width: 1200px) and (max-width:1418px){
    .customMargin{
        margin-right: 35px;
    }
}

@media (min-width: 320px) and (max-width:1099px){
    .sumBox{
    }
}

@media (min-width: 1100px){
    .sumBox{
    }
}

@media (min-width: 320px) and (max-width:400px){
    .titleEditPassword{
        font-size: 20px !important;
    }
}

.titleEditPassword{
    font-size: 25px;
}


.btnCus {
    background: 0 0;
    outline: 0!important;
    vertical-align: middle;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    user-select: none;
    display: inline-block;
}

.btnCus :hover{
    background-color: #00B2CE;
    color : white;
}

@media only screen {
    .toggleSwitch {
      display: inline-block;
      height: 18px;
      position: relative;
      overflow: visible;
      padding: 0;
      cursor: pointer;
      width: 40px
    }
    .toggleSwitch * {
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
    }
    .toggleSwitch label,
    .toggleSwitch > span {
      line-height: 20px;
      height: 20px;
      vertical-align: middle;
    }
    .toggleSwitch input:focus ~ a,
    .toggleSwitch input:focus + label {
      outline: none;
    }
    .toggleSwitch label {
      position: relative;
      z-index: 3;
      display: block;
      width: 100%;
    }
    .toggleSwitch input {
      position: absolute;
      opacity: 0;
      z-index: 5;
    }
    .toggleSwitch > span {
      position: absolute;
      left: -50px;
      width: 100%;
      margin: 0;
      padding-right: 50px;
      text-align: left;
      white-space: nowrap;
    }
    .toggleSwitch > span span {
      position: absolute;
      top: 0;
      left: 0;
      z-index: 5;
      display: block;
      width: 50%;
      margin-left: 50px;
      text-align: left;
      font-size: 0.9em;
      width: 100%;
      left: 15%;
      top: -1px;
      opacity: 0;
    }
    .toggleSwitch a {
      position: absolute;
      right: 50%;
      z-index: 4;
      display: block;
      height: 100%;
      padding: 0;
      left: 2px;
      width: 18px;
      background-color: #fff;
      border: 1px solid #CCC;
      border-radius: 100%;
      -webkit-transition: all 0.2s ease-out;
      -moz-transition: all 0.2s ease-out;
      transition: all 0.2s ease-out;
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    }
    .toggleSwitch > span span:first-of-type {
      color: #ccc;
      opacity: 1;
      left: 45%;
    }
    .toggleSwitch > span:before {
      content: '';
      display: block;
      width: 100%;
      height: 100%;
      position: absolute;
      left: 50px;
      top: -2px;
      background-color: #fafafa;
      border: 1px solid #ccc;
      border-radius: 30px;
      -webkit-transition: all 0.2s ease-out;
      -moz-transition: all 0.2s ease-out;
      transition: all 0.2s ease-out;
    }
    .toggleSwitch input:checked ~ a {
      left: 100%;
      margin-left: -8px;
    }
    .toggleSwitch input:checked ~ span:before {
      border-color: #C5C5C5;
      box-shadow: inset 0 0 0 30px #fff;
    }
    .toggleSwitch input:checked ~ span span:first-of-type {
      opacity: 0;
    }
    .toggleSwitch input:checked ~ span span:last-of-type {
      opacity: 1;
    }

    .toggleSwitch.large {
      width: 61px;
      height: 27px;
    }

    .toggleSwitch.large a {
      width: 26px;
      height: 26px;
      background-color: #d3d3d3;
    }

    .toggleSwitch.large > span {
      height: 29px;
      line-height: 28px;
    }
    .toggleSwitch.large input:checked ~ a {
      left: 41px;
      background-color: #32B14A;
    }
    .toggleSwitch.large > span span {
      font-size: 12px;
      color: #5F5F5F;
    }
    .toggleSwitch.large > span span:first-of-type {
      left: 50%;
    }
}

.textCenter{
    text-align: center;
}

.closeBtnPopUp {
    padding: 10px !important;
    width: 40% !important;
    cursor: pointer;
    font-weight: 900;
    font-size: 14px;
    color: #fff !important;
    background-color: #FFB617;
    border-radius: 20px;
    /* text-align: center !important; */
    text-align: center;
}

.closeBtnMiddle{
    text-align: center;
    display: grid;
    grid-auto-flow: column;
    gap: 4px;
    align-items: center;
    justify-items: center;
}

.modalBodyPF{
    background-color:#ebfdff;
    padding:40px;
    padding-left:20px;
    margin-top: 15px;
    color: black;
}

/* white label  */
#modalWL{
	/* background-image: url("/images/project/register-bg.jpg"); */
	background-size: cover;
	background-repeat: no-repeat;
	/* padding-top: 3rem; */
}
#wlModalH1{
    font-weight: 949;
	font-size: 4.5vw;
}
#wlModalH3{
    font-weight: 549;
	font-size: 1.5vw;
}
#wlBoxH1{
    font-weight: 949;
	font-size: 3.5vw;
}
#wlBoxH3{
    font-weight: 549;
	font-size: 1.2vw;
}
.modalLoginBtn.sendOTPwl{
    font-size: 13px;
    width: 80% !important;
    height: 145%;
    padding: 5px !important;
    margin: -5px;
    background-color: #FFB617;
}
.modalLoginBtn.wlBtn{
    background-color: var(--theme-color);
    border-radius: var(--border-radius);
}
select{
    border: none;
}

/* Landing Page css */
#mainbox1{
	background-image: url("../images/landingpg/mask_group_13.jpg");
	background-size: cover;
	background-repeat: no-repeat;
	padding-top: 3rem;
}
#mainbox2{
	background-image: url("../images/landingpg/mask_group_14.jpg");
	background-size: cover;
	background-repeat: no-repeat;
	padding-top: 1rem;
}
#mainbox3{
	background-image: url("../images/landingpg/mask_group_15.jpg");
	background-size: cover;
	background-repeat: no-repeat;
	padding-top: 1rem;
}
#header1f1f3{
	/* font-family: 'Arial', sans-serif; */
	font-weight: 949;
	font-size: 4.5vw;
	text-align: left;
}
#header1f2{
	/* font-family: 'Arial', sans-serif; */
	font-weight: 949;
	font-size: clamp(40px,5.5vw,55px);
	text-align: center;
}
#descHeaderf1f3{
	color: #000000;
	font-weight: 600;
	font-size: 24px;
}
#descHeaderf2{
	color: #ffffff;
	font-weight: 600;
	font-size: 24px;
}
#signupHeader{
	color: #000000;
	font-weight: 700;
	font-size: clamp(16px,5vw,32px);
}
#column2{
	display: flex;
    justify-content: space-around;
}
#contactsf2{
	background-color: rgb(0,0,0,52%);
	border-radius: 10px;
	width: 60%;
    display: flex;
}
#contactsf3{
	background-color: rgb(0,0,0,41%);
	border-radius: 10px;
	width: 60%;
}
@media(max-width: 575px){
    #logo{
		width: 60%;
		margin-left: 2vw;
	}
    #contactsf2{
        justify-content: center;
        width: 100%;
    }
	#signupBox{
		width: 100%;
	}
    #header1f1f3{
        font-size: clamp(7vw,23px,8vw);
    }
    #icon{
		margin-top: 3px;
		width: 60%;
	}
    #contactpic{
		width: 95%;
	}
}
@media(min-width: 320px) and (max-width: 374px){
}
@media(min-width: 375px) and (max-width: 575px){
}
@media(min-width: 700px) and (max-width: 769px){
    #header1{
		font-size: 35px;
	}
	#icon{
		margin-top: 7px;
		width: 80%;
	}
}
@media(min-width: 576px){
	#signupBox{
		width: 80%;
	}
	#icon{
		width: 80%;
	}
    #contactpic{
		width: 90%;
	}
}
@media (min-width: 320px) and (max-width: 767px) {
    #loginIMG{
        display: none;
    }

    #qrInput{
        margin-top: 60px !important;
        /* background-color: black; */
    }

    #redeemBtn{
        width: 60%;
    }

    .announcementBox{
        padding-left: 5%;
        padding-right: 5%;
    }

    #dashboardEmpty{
        margin-top: 20px;
        margin-bottom: 20px;
    }
}

@media (min-width: 600px) and (max-width: 900px) {
    #voucherTitle{
        margin-bottom: 20px;
    }

    #voucherTitleText{
        font-size: 26px !important;
        /* background-color: black; */
    }

    #voucherTitleSubText{
        font-size: 26px !important;
        /* background-color: black; */
    }

}

@media (min-width: 901px) {
    #voucherTitle{
        margin-bottom: 20px;
    }

    #voucherTitleText{
        font-size: 30px !important;
        /* background-color: black; */
    }

    #voucherTitleSubText{
        font-size: 30px !important;
        /* background-color: black; */
    }
}

.redeemError{
    margin: 20px 0px 0px 0px !important;
    text-align: left;
}

@media (min-width: 767px) {
    #dashboardEmpty{
        margin: 40px 0px;
    }

    #emptyImg{
        width: 8% !important;
    }
}

/* Table CSS for White Label */
#whiteLabelListDiv {
    font-family: Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 100%;
  }

  /* #whiteLabelListDiv td, #whiteLabelListDiv th {
    border: 1px solid;
    padding: 8px;
  } */

  #whiteLabelListDiv tr:nth-child(even){background-color: #f2f2f2;}

  #whiteLabelListDiv tr:hover {background-color: #ddd;}

  #whiteLabelListDiv th {
    margin-top: 12px;
    margin-bottom: 12px;
    text-align: left;
    background-color: #000000;
    color: white;
    text-align: center;
  }
  #whiteLabelListDiv td {
    margin-top: 12px;
    margin-bottom: 12px;
    text-align: left;
    font-weight: bold;
    text-align: center;
  }

  #whiteLabelListDiv th, #whiteLabelListDiv td {
    border-bottom: 1px solid #ddd;
  }


  /*  */
  #whiteLabelPaymentListDiv {
    font-family: Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 100%;
  }

  /* #whiteLabelListDiv td, #whiteLabelListDiv th {
    border: 1px solid;
    padding: 8px;
  } */

  #whiteLabelPaymentListDiv tr:nth-child(even){background-color: #f2f2f2;}

  #whiteLabelPaymentListDiv tr:hover {background-color: #ddd;}

  #whiteLabelPaymentListDiv th {
    margin-top: 12px;
    margin-bottom: 12px;
    text-align: left;
    background-color: #000000;
    color: white;
    text-align: center;
  }
  #whiteLabelPaymentListDiv td {
    margin-top: 12px;
    margin-bottom: 12px;
    text-align: left;
    font-weight: bold;
    text-align: center;
  }

  #whiteLabelPaymentListDiv th, #whiteLabelPaymentListDiv td {
    border-bottom: 1px solid #ddd;
  }


/* White Label Template */
.quotaInput{
    margin: 3% auto;
}

#domainOption {
    font-weight: bold;
    font-size: 22px;
}
#whiteLabelText{
    font-size: 13px;
    font-weight: 100;
    padding: 10px;
}

.text-danger{
    color: #ff5b5b !important;
    font-weight:bolder;
    /* font-size: 20px; */
}
.formSubTitle{
    font-size: 28px;
    font-weight: bold;
}

.domainName{
    background:darkgray;
    padding: 10px 20px;
    color: white;
    font-weight: 600;
    border-radius: 0px 20px 20px 0px;
}

.sampleWLLink{
    color: #888888;
}

.whiteLabelPopImage{
    padding: 10px;
}

.whiteLabelPopImage:hover{
    transition:0.2s;
    border-radius: 10px;
    padding: 10px;
    border:5px solid rgb(209,209,209);
}

.whiteLabelPopImage.active{
    border-radius: 10px;
    padding: 10px;
    border:5px solid rgb(100, 178, 255);
}

.btnWL{
    border: #000000 1px solid;
    border-radius: 10px;
    padding: 5px 20px;
    width: 50%;
    margin: 10px auto;
}

/* Checkboxes and Radio buttons
--------------------------------------------------
*/
.radio,
.checkbox {
  margin-bottom: 10px;
  margin-top: 10px;
  padding-left: 0px;
}
.radio label,
.checkbox label {
  display: inline-block;
  cursor: pointer;
  position: relative;
  padding-left: 25px;
  margin-right: 15px;
  min-width: 17px;
  min-height: 17px;
  font-size: 13px;
  line-height: 20px;
  margin-bottom: 0;
}
.radio label:before,
.checkbox label:before {
  -webkit-box-sizing: inherit;
  box-sizing: border-box;
  content: "";
  display: inline-block;
  width: 17px;
  height: 17px;
  margin-right: 10px;
  position: absolute;
  left: 0px;
  background-color: #fff;
  border: 1px solid #d0d0d0;
}
.radio label:before {
  bottom: 2.5px;
  border-radius: 99px;
  -webkit-transition: border 0.3s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
  transition: border 0.3s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
}
.radio input[type=radio]:checked + label:before {
  border-width: 5px;
}
.radio input[type="radio"]:focus + label {
  color: #2c2c2c;
}
.radio input[type="radio"]:focus + label:before {
  background-color: #e6e6e6;
}
.radio input[type=radio] {
  opacity: 0;
  width: 0;
  height: 0;
}
.radio input[type=radio][disabled] + label {
  opacity: 0.65;
}
.radio.radio-success input[type=radio]:checked + label:before {
  border-color: #10cfbd;
}
.radio.radio-primary input[type=radio]:checked + label:before {
  border-color: #6d5cae;
}
.radio.radio-info input[type=radio]:checked + label:before {
  border-color: #89000e;
}
.radio.radio-warning input[type=radio]:checked + label:before {
  border-color: #f8d053;
}
.radio.radio-danger input[type=radio]:checked + label:before {
  border-color: #f55753;
}
.radio.radio-complete input[type=radio]:checked + label:before {
  border-color: #FFB617;
}
.checkbox + .checkbox,
.radio + .radio {
  margin-top: -5px;
}
.checkbox input[type=radio][disabled] + label:after {
  background-color: #e6e6e6;
}
.checkbox label {
  transition: border 0.2s linear 0s, color 0.2s linear 0s;
}
.checkbox label:before {
  top: 1.4px;
  border-radius: 3px;
  transition: border 0.2s linear 0s, color 0.2s linear 0s;
}
.checkbox label::after {
  display: inline-block;
  width: 16px;
  height: 16px;
  position: absolute;
  left: 3.5px;
  top: 0px;
  font-size: 11px;
  transition: border 0.2s linear 0s, color 0.2s linear 0s;
}
.checkbox label:after {
  border-radius: 3px;
}
.checkbox input[type=checkbox] {
  opacity: 0;
  width: 0;
  height: 0;
}
.checkbox.checkbox-circle label:after {
  border-radius: 99px;
}
.checkbox.checkbox-circle label:before {
  border-radius: 99px;
}
.checkbox input[type=checkbox]:checked + label:before {
  border-width: 8.5px;
}
.checkbox input[type=checkbox]:checked + label::after {
  font-family: 'FontAwesome';
  content: "\F00C";
  color: #fff;
}
.checkbox input[type="checkbox"]:focus + label {
  color: #2c2c2c;
}
.checkbox input[type="checkbox"]:focus + label:before {
  background-color: #e6e6e6;
}
.checkbox input[type=checkbox][disabled] + label {
  opacity: 1;
}
.checkbox input[type=checkbox][disabled] + label:before {
  background-color: #eceff3;
}
.checkbox.right label {
  margin-right: 35px;
  padding-left: 0 !important;
}
.checkbox.right label:before {
  right: -35px;
  left: auto;
}
.checkbox.right input[type=checkbox]:checked + label {
  position: relative;
}
.checkbox.right input[type=checkbox]:checked + label::after {
  font-family: 'FontAwesome';
  content: "\F00C";
  position: absolute;
  right: -27px;
  left: auto;
}
body.rtl .checkbox label::after {
  left: -1.2px;
}
.checkbox.check-success input[type=checkbox]:checked + label:before {
  border-color: #10cfbd;
}
.checkbox.check-primary input[type=checkbox]:checked + label:before {
  border-color: #6d5cae;
}
.checkbox.check-complete input[type=checkbox]:checked + label:before {
  border-color: #48b0f7;
}
.checkbox.check-warning input[type=checkbox]:checked + label:before {
  border-color: #f8d053;
}
.checkbox.check-danger input[type=checkbox]:checked + label:before {
  border-color: #f8d053;
}
.checkbox.check-info input[type=checkbox]:checked + label:before {
  border-color: #3b4752;
}
.checkbox.check-success input[type=checkbox]:checked + label::after,
.checkbox.check-primary input[type=checkbox]:checked + label::after,
.checkbox.check-complete input[type=checkbox]:checked + label::after,
.checkbox.check-warning input[type=checkbox]:checked + label::after,
.checkbox.check-danger input[type=checkbox]:checked + label::after,
.checkbox.check-info input[type=checkbox]:checked + label::after {
  color: #fff;
}

.subCheckBoxTitle{
    font-size: 13px;
    padding: 10px;
}

#websiteName, #pageTitle{
    width: 50%;
}

#btnChoose{
    text-align:center;
}

/* Added Start 27/02/2023 */


.clientTopNav {
  overflow: hidden;
  /* background-color: #FFB617; */
}

.clientTopNav a {
  float: left;
  display: block;
  color: black;
  text-align: center;
  padding: 10px 10px;
  text-decoration: none;
  font-size: 13px;
  font-weight: bold;
}

.clientTopNav a:hover {
  background-color: #FFB617;
  color: black;
}

.clientTopNav a.active {
  background-color: #FFB617;
  color: #04AA6D;
}

.clientTopNav .icon {
  display: none;
}

div.menuActive2:hover{
    background-color: #FFB617;
}

div.menuActive2.active {
    background-color: #FFB617;
}

div.menuActive2 {
    padding: 10px;
}

@media screen and (max-width: 600px) {
  .clientTopNav a:not(:first-child) {display: none;}
  .clientTopNav a.icon {
    float: right;
    display: block;
  }
}

@media screen and (max-width: 600px) {
  .clientTopNav.responsive {position: relative;}
  .clientTopNav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .clientTopNav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
}

/* Added End 27/02/2023 */
/* custom.css */

/* admin_custom.css */
/* from bootstrap 4 alignment*/

.w-25 {
    width: 25% !important;
  }

  .w-50 {
    width: 50% !important;
  }

  .w-75 {
    width: 75% !important;
  }

  .w-100 {
    width: 100% !important;
  }

  .h-25 {
    height: 25% !important;
  }

  .h-50 {
    height: 50% !important;
  }

  .h-75 {
    height: 75% !important;
  }

  .h-100 {
    height: 100% !important;
  }

  .mw-100 {
    max-width: 100% !important;
  }

  .mh-100 {
    max-height: 100% !important;
  }

  .m-0 {
    margin: 0 0 !important;
  }

  .mt-0 {
    margin-top: 0 !important;
  }

  .mr-0 {
    margin-right: 0 !important;
  }

  .mb-0 {
    margin-bottom: 0 !important;
  }

  .ml-0 {
    margin-left: 0 !important;
  }

  .mx-0 {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }

  .my-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  .m-1 {
    margin: 0.25rem 0.25rem !important;
  }

  .mt-1 {
    margin-top: 0.25rem !important;
  }

  .mr-1 {
    margin-right: 0.25rem !important;
  }

  .mb-1 {
    margin-bottom: 0.25rem !important;
  }

  .ml-1 {
    margin-left: 0.25rem !important;
  }

  .mx-1 {
    margin-right: 0.25rem !important;
    margin-left: 0.25rem !important;
  }

  .my-1 {
    margin-top: 0.25rem !important;
    margin-bottom: 0.25rem !important;
  }

  .m-2 {
    margin: 0.5rem 0.5rem !important;
  }

  .mt-2 {
    margin-top: 0.5rem !important;
  }

  .mr-2 {
    margin-right: 0.5rem !important;
  }

  .mb-2 {
    margin-bottom: 0.5rem !important;
  }

  .ml-2 {
    margin-left: 0.5rem !important;
  }

  .mx-2 {
    margin-right: 0.5rem !important;
    margin-left: 0.5rem !important;
  }

  .my-2 {
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
  }

  .m-3 {
    margin: 1rem 1rem !important;
  }

  .mt-3 {
    margin-top: 1rem !important;
  }

  .mr-3 {
    margin-right: 1rem !important;
  }

  .mb-3 {
    margin-bottom: 1rem !important;
  }

  .ml-3 {
    margin-left: 1rem !important;
  }

  .mx-3 {
    margin-right: 1rem !important;
    margin-left: 1rem !important;
  }

  .my-3 {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
  }

  .m-4 {
    margin: 1.5rem 1.5rem !important;
  }

  .mt-4 {
    margin-top: 1.5rem !important;
  }

  .mr-4 {
    margin-right: 1.5rem !important;
  }

  .mb-4 {
    margin-bottom: 1.5rem !important;
  }

  .ml-4 {
    margin-left: 1.5rem !important;
  }

  .mx-4 {
    margin-right: 1.5rem !important;
    margin-left: 1.5rem !important;
  }

  .my-4 {
    margin-top: 1.5rem !important;
    margin-bottom: 1.5rem !important;
  }

  .m-5 {
    margin: 3rem 3rem !important;
  }

  .mt-5 {
    margin-top: 3rem !important;
  }

  .mr-5 {
    margin-right: 3rem !important;
  }

  .mb-5 {
    margin-bottom: 3rem !important;
  }

  .ml-5 {
    margin-left: 3rem !important;
  }

  .mx-5 {
    margin-right: 3rem !important;
    margin-left: 3rem !important;
  }

  .my-5 {
    margin-top: 3rem !important;
    margin-bottom: 3rem !important;
  }

  .mt-rem2{
    margin-top: 2rem!important;
  }

  .p-0 {
    padding: 0 0 !important;
  }

  .pt-0 {
    padding-top: 0 !important;
  }

  .pr-0 {
    padding-right: 0 !important;
  }

  .pb-0 {
    padding-bottom: 0 !important;
  }

  .pl-0 {
    padding-left: 0 !important;
  }

  .px-0 {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  .py-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .p-1 {
    padding: 0.25rem 0.25rem !important;
  }

  .pt-1 {
    padding-top: 0.25rem !important;
  }

  .pr-1 {
    padding-right: 0.25rem !important;
  }

  .pb-1 {
    padding-bottom: 0.25rem !important;
  }

  .pl-1 {
    padding-left: 0.25rem !important;
  }

  .px-1 {
    padding-right: 0.25rem !important;
    padding-left: 0.25rem !important;
  }

  .py-1 {
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
  }

  .p-2 {
    padding: 0.5rem 0.5rem !important;
  }

  .pt-2 {
    padding-top: 0.5rem !important;
  }

  .pr-2 {
    padding-right: 0.5rem !important;
  }

  .pb-2 {
    padding-bottom: 0.5rem !important;
  }

  .pl-2 {
    padding-left: 0.5rem !important;
  }

  .px-2 {
    padding-right: 0.5rem !important;
    padding-left: 0.5rem !important;
  }

  .py-2 {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
  }

  .p-3 {
    padding: 1rem 1rem !important;
  }

  .pt-3 {
    padding-top: 1rem !important;
  }

  .pr-3 {
    padding-right: 1rem !important;
  }

  .pb-3 {
    padding-bottom: 1rem !important;
  }

  .pl-3 {
    padding-left: 1rem !important;
  }

  .px-3 {
    padding-right: 1rem !important;
    padding-left: 1rem !important;
  }

  .py-3 {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
  }

  .p-4 {
    padding: 1.5rem 1.5rem !important;
  }

  .pt-4 {
    padding-top: 1.5rem !important;
  }

  .pt-rem2 {
    padding-top: 2rem !important;
  }

  .pr-4 {
    padding-right: 1.5rem !important;
  }

  .pb-4 {
    padding-bottom: 1.5rem !important;
  }

  .pl-4 {
    padding-left: 1.5rem !important;
  }

  .px-4 {
    padding-right: 1.5rem !important;
    padding-left: 1.5rem !important;
  }

  .py-4 {
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
  }

  .p-5 {
    padding: 3rem 3rem !important;
  }

  .pt-5 {
    padding-top: 3rem !important;
  }

  .pr-5 {
    padding-right: 3rem !important;
  }

  .pb-5 {
    padding-bottom: 3rem !important;
  }

  .pl-5 {
    padding-left: 3rem !important;
  }

  .px-5 {
    padding-right: 3rem !important;
    padding-left: 3rem !important;
  }

  .py-5 {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
  }

  .py-rem2 {
    padding-top: 2rem !important;
    padding-bottom: 2rem !important;
  }

  .m-auto {
    margin: auto !important;
  }

  .mt-auto {
    margin-top: auto !important;
  }

  .mr-auto {
    margin-right: auto !important;
  }

  .mb-auto {
    margin-bottom: auto !important;
  }

  .ml-auto {
    margin-left: auto !important;
  }

  .mx-auto {
    margin-right: auto !important;
    margin-left: auto !important;
  }

  .my-auto {
    margin-top: auto !important;
    margin-bottom: auto !important;
  }

  @media (min-width: 576px) {
    .m-sm-0 {
      margin: 0 0 !important;
    }
    .mt-sm-0 {
      margin-top: 0 !important;
    }
    .mr-sm-0 {
      margin-right: 0 !important;
    }
    .mb-sm-0 {
      margin-bottom: 0 !important;
    }
    .ml-sm-0 {
      margin-left: 0 !important;
    }
    .mx-sm-0 {
      margin-right: 0 !important;
      margin-left: 0 !important;
    }
    .my-sm-0 {
      margin-top: 0 !important;
      margin-bottom: 0 !important;
    }
    .m-sm-1 {
      margin: 0.25rem 0.25rem !important;
    }
    .mt-sm-1 {
      margin-top: 0.25rem !important;
    }
    .mr-sm-1 {
      margin-right: 0.25rem !important;
    }
    .mb-sm-1 {
      margin-bottom: 0.25rem !important;
    }
    .ml-sm-1 {
      margin-left: 0.25rem !important;
    }
    .mx-sm-1 {
      margin-right: 0.25rem !important;
      margin-left: 0.25rem !important;
    }
    .my-sm-1 {
      margin-top: 0.25rem !important;
      margin-bottom: 0.25rem !important;
    }
    .m-sm-2 {
      margin: 0.5rem 0.5rem !important;
    }
    .mt-sm-2 {
      margin-top: 0.5rem !important;
    }
    .mr-sm-2 {
      margin-right: 0.5rem !important;
    }
    .mb-sm-2 {
      margin-bottom: 0.5rem !important;
    }
    .ml-sm-2 {
      margin-left: 0.5rem !important;
    }
    .mx-sm-2 {
      margin-right: 0.5rem !important;
      margin-left: 0.5rem !important;
    }
    .my-sm-2 {
      margin-top: 0.5rem !important;
      margin-bottom: 0.5rem !important;
    }
    .m-sm-3 {
      margin: 1rem 1rem !important;
    }
    .mt-sm-3 {
      margin-top: 1rem !important;
    }
    .mr-sm-3 {
      margin-right: 1rem !important;
    }
    .mb-sm-3 {
      margin-bottom: 1rem !important;
    }
    .ml-sm-3 {
      margin-left: 1rem !important;
    }
    .mx-sm-3 {
      margin-right: 1rem !important;
      margin-left: 1rem !important;
    }
    .my-sm-3 {
      margin-top: 1rem !important;
      margin-bottom: 1rem !important;
    }
    .m-sm-4 {
      margin: 1.5rem 1.5rem !important;
    }
    .mt-sm-4 {
      margin-top: 1.5rem !important;
    }
    .mr-sm-4 {
      margin-right: 1.5rem !important;
    }
    .mb-sm-4 {
      margin-bottom: 1.5rem !important;
    }
    .ml-sm-4 {
      margin-left: 1.5rem !important;
    }
    .mx-sm-4 {
      margin-right: 1.5rem !important;
      margin-left: 1.5rem !important;
    }
    .my-sm-4 {
      margin-top: 1.5rem !important;
      margin-bottom: 1.5rem !important;
    }
    .m-sm-5 {
      margin: 3rem 3rem !important;
    }
    .mt-sm-5 {
      margin-top: 3rem !important;
    }
    .mr-sm-5 {
      margin-right: 3rem !important;
    }
    .mb-sm-5 {
      margin-bottom: 3rem !important;
    }
    .ml-sm-5 {
      margin-left: 3rem !important;
    }
    .mx-sm-5 {
      margin-right: 3rem !important;
      margin-left: 3rem !important;
    }
    .my-sm-5 {
      margin-top: 3rem !important;
      margin-bottom: 3rem !important;
    }
    .p-sm-0 {
      padding: 0 0 !important;
    }
    .pt-sm-0 {
      padding-top: 0 !important;
    }
    .pr-sm-0 {
      padding-right: 0 !important;
    }
    .pb-sm-0 {
      padding-bottom: 0 !important;
    }
    .pl-sm-0 {
      padding-left: 0 !important;
    }
    .px-sm-0 {
      padding-right: 0 !important;
      padding-left: 0 !important;
    }
    .py-sm-0 {
      padding-top: 0 !important;
      padding-bottom: 0 !important;
    }
    .p-sm-1 {
      padding: 0.25rem 0.25rem !important;
    }
    .pt-sm-1 {
      padding-top: 0.25rem !important;
    }
    .pr-sm-1 {
      padding-right: 0.25rem !important;
    }
    .pb-sm-1 {
      padding-bottom: 0.25rem !important;
    }
    .pl-sm-1 {
      padding-left: 0.25rem !important;
    }
    .px-sm-1 {
      padding-right: 0.25rem !important;
      padding-left: 0.25rem !important;
    }
    .py-sm-1 {
      padding-top: 0.25rem !important;
      padding-bottom: 0.25rem !important;
    }
    .p-sm-2 {
      padding: 0.5rem 0.5rem !important;
    }
    .pt-sm-2 {
      padding-top: 0.5rem !important;
    }
    .pr-sm-2 {
      padding-right: 0.5rem !important;
    }
    .pb-sm-2 {
      padding-bottom: 0.5rem !important;
    }
    .pl-sm-2 {
      padding-left: 0.5rem !important;
    }
    .px-sm-2 {
      padding-right: 0.5rem !important;
      padding-left: 0.5rem !important;
    }
    .py-sm-2 {
      padding-top: 0.5rem !important;
      padding-bottom: 0.5rem !important;
    }
    .p-sm-3 {
      padding: 1rem 1rem !important;
    }
    .pt-sm-3 {
      padding-top: 1rem !important;
    }
    .pr-sm-3 {
      padding-right: 1rem !important;
    }
    .pb-sm-3 {
      padding-bottom: 1rem !important;
    }
    .pl-sm-3 {
      padding-left: 1rem !important;
    }
    .px-sm-3 {
      padding-right: 1rem !important;
      padding-left: 1rem !important;
    }
    .py-sm-3 {
      padding-top: 1rem !important;
      padding-bottom: 1rem !important;
    }
    .p-sm-4 {
      padding: 1.5rem 1.5rem !important;
    }
    .pt-sm-4 {
      padding-top: 1.5rem !important;
    }
    .pr-sm-4 {
      padding-right: 1.5rem !important;
    }
    .pb-sm-4 {
      padding-bottom: 1.5rem !important;
    }
    .pl-sm-4 {
      padding-left: 1.5rem !important;
    }
    .px-sm-4 {
      padding-right: 1.5rem !important;
      padding-left: 1.5rem !important;
    }
    .py-sm-4 {
      padding-top: 1.5rem !important;
      padding-bottom: 1.5rem !important;
    }
    .p-sm-5 {
      padding: 3rem 3rem !important;
    }
    .pt-sm-5 {
      padding-top: 3rem !important;
    }
    .pr-sm-5 {
      padding-right: 3rem !important;
    }
    .pb-sm-5 {
      padding-bottom: 3rem !important;
    }
    .pl-sm-5 {
      padding-left: 3rem !important;
    }
    .px-sm-5 {
      padding-right: 3rem !important;
      padding-left: 3rem !important;
    }
    .py-sm-5 {
      padding-top: 3rem !important;
      padding-bottom: 3rem !important;
    }
    .m-sm-auto {
      margin: auto !important;
    }
    .mt-sm-auto {
      margin-top: auto !important;
    }
    .mr-sm-auto {
      margin-right: auto !important;
    }
    .mb-sm-auto {
      margin-bottom: auto !important;
    }
    .ml-sm-auto {
      margin-left: auto !important;
    }
    .mx-sm-auto {
      margin-right: auto !important;
      margin-left: auto !important;
    }
    .my-sm-auto {
      margin-top: auto !important;
      margin-bottom: auto !important;
    }
  }

  @media (min-width: 768px) {
    .m-md-0 {
      margin: 0 0 !important;
    }
    .mt-md-0 {
      margin-top: 0 !important;
    }
    .mr-md-0 {
      margin-right: 0 !important;
    }
    .mb-md-0 {
      margin-bottom: 0 !important;
    }
    .ml-md-0 {
      margin-left: 0 !important;
    }
    .mx-md-0 {
      margin-right: 0 !important;
      margin-left: 0 !important;
    }
    .my-md-0 {
      margin-top: 0 !important;
      margin-bottom: 0 !important;
    }
    .m-md-1 {
      margin: 0.25rem 0.25rem !important;
    }
    .mt-md-1 {
      margin-top: 0.25rem !important;
    }
    .mr-md-1 {
      margin-right: 0.25rem !important;
    }
    .mb-md-1 {
      margin-bottom: 0.25rem !important;
    }
    .ml-md-1 {
      margin-left: 0.25rem !important;
    }
    .mx-md-1 {
      margin-right: 0.25rem !important;
      margin-left: 0.25rem !important;
    }
    .my-md-1 {
      margin-top: 0.25rem !important;
      margin-bottom: 0.25rem !important;
    }
    .m-md-2 {
      margin: 0.5rem 0.5rem !important;
    }
    .mt-md-2 {
      margin-top: 0.5rem !important;
    }
    .mr-md-2 {
      margin-right: 0.5rem !important;
    }
    .mb-md-2 {
      margin-bottom: 0.5rem !important;
    }
    .ml-md-2 {
      margin-left: 0.5rem !important;
    }
    .mx-md-2 {
      margin-right: 0.5rem !important;
      margin-left: 0.5rem !important;
    }
    .my-md-2 {
      margin-top: 0.5rem !important;
      margin-bottom: 0.5rem !important;
    }
    .m-md-3 {
      margin: 1rem 1rem !important;
    }
    .mt-md-3 {
      margin-top: 1rem !important;
    }
    .mr-md-3 {
      margin-right: 1rem !important;
    }
    .mb-md-3 {
      margin-bottom: 1rem !important;
    }
    .ml-md-3 {
      margin-left: 1rem !important;
    }
    .mx-md-3 {
      margin-right: 1rem !important;
      margin-left: 1rem !important;
    }
    .my-md-3 {
      margin-top: 1rem !important;
      margin-bottom: 1rem !important;
    }
    .m-md-4 {
      margin: 1.5rem 1.5rem !important;
    }
    .mt-md-4 {
      margin-top: 1.5rem !important;
    }
    .mr-md-4 {
      margin-right: 1.5rem !important;
    }
    .mb-md-4 {
      margin-bottom: 1.5rem !important;
    }
    .ml-md-4 {
      margin-left: 1.5rem !important;
    }
    .mx-md-4 {
      margin-right: 1.5rem !important;
      margin-left: 1.5rem !important;
    }
    .my-md-4 {
      margin-top: 1.5rem !important;
      margin-bottom: 1.5rem !important;
    }
    .m-md-5 {
      margin: 3rem 3rem !important;
    }
    .mt-md-5 {
      margin-top: 3rem !important;
    }
    .mr-md-5 {
      margin-right: 3rem !important;
    }
    .mb-md-5 {
      margin-bottom: 3rem !important;
    }
    .ml-md-5 {
      margin-left: 3rem !important;
    }
    .mx-md-5 {
      margin-right: 3rem !important;
      margin-left: 3rem !important;
    }
    .my-md-5 {
      margin-top: 3rem !important;
      margin-bottom: 3rem !important;
    }
    .p-md-0 {
      padding: 0 0 !important;
    }
    .pt-md-0 {
      padding-top: 0 !important;
    }
    .pr-md-0 {
      padding-right: 0 !important;
    }
    .pb-md-0 {
      padding-bottom: 0 !important;
    }
    .pl-md-0 {
      padding-left: 0 !important;
    }
    .px-md-0 {
      padding-right: 0 !important;
      padding-left: 0 !important;
    }
    .py-md-0 {
      padding-top: 0 !important;
      padding-bottom: 0 !important;
    }
    .p-md-1 {
      padding: 0.25rem 0.25rem !important;
    }
    .pt-md-1 {
      padding-top: 0.25rem !important;
    }
    .pr-md-1 {
      padding-right: 0.25rem !important;
    }
    .pb-md-1 {
      padding-bottom: 0.25rem !important;
    }
    .pl-md-1 {
      padding-left: 0.25rem !important;
    }
    .px-md-1 {
      padding-right: 0.25rem !important;
      padding-left: 0.25rem !important;
    }
    .py-md-1 {
      padding-top: 0.25rem !important;
      padding-bottom: 0.25rem !important;
    }
    .p-md-2 {
      padding: 0.5rem 0.5rem !important;
    }
    .pt-md-2 {
      padding-top: 0.5rem !important;
    }
    .pr-md-2 {
      padding-right: 0.5rem !important;
    }
    .pb-md-2 {
      padding-bottom: 0.5rem !important;
    }
    .pl-md-2 {
      padding-left: 0.5rem !important;
    }
    .px-md-2 {
      padding-right: 0.5rem !important;
      padding-left: 0.5rem !important;
    }
    .py-md-2 {
      padding-top: 0.5rem !important;
      padding-bottom: 0.5rem !important;
    }
    .p-md-3 {
      padding: 1rem 1rem !important;
    }
    .pt-md-3 {
      padding-top: 1rem !important;
    }
    .pr-md-3 {
      padding-right: 1rem !important;
    }
    .pb-md-3 {
      padding-bottom: 1rem !important;
    }
    .pl-md-3 {
      padding-left: 1rem !important;
    }
    .px-md-3 {
      padding-right: 1rem !important;
      padding-left: 1rem !important;
    }
    .py-md-3 {
      padding-top: 1rem !important;
      padding-bottom: 1rem !important;
    }
    .p-md-4 {
      padding: 1.5rem 1.5rem !important;
    }
    .pt-md-4 {
      padding-top: 1.5rem !important;
    }
    .pr-md-4 {
      padding-right: 1.5rem !important;
    }
    .pb-md-4 {
      padding-bottom: 1.5rem !important;
    }
    .pl-md-4 {
      padding-left: 1.5rem !important;
    }
    .px-md-4 {
      padding-right: 1.5rem !important;
      padding-left: 1.5rem !important;
    }
    .py-md-4 {
      padding-top: 1.5rem !important;
      padding-bottom: 1.5rem !important;
    }
    .py-md-rem2 {
      padding-top: 2rem !important;
      padding-bottom: 2rem !important;
    }
    .p-md-5 {
      padding: 3rem 3rem !important;
    }
    .pt-md-5 {
      padding-top: 3rem !important;
    }
    .pr-md-5 {
      padding-right: 3rem !important;
    }
    .pb-md-5 {
      padding-bottom: 3rem !important;
    }
    .pl-md-5 {
      padding-left: 3rem !important;
    }
    .px-md-5 {
      padding-right: 3rem !important;
      padding-left: 3rem !important;
    }
    .py-md-5 {
      padding-top: 3rem !important;
      padding-bottom: 3rem !important;
    }
    .m-md-auto {
      margin: auto !important;
    }
    .mt-md-auto {
      margin-top: auto !important;
    }
    .mr-md-auto {
      margin-right: auto !important;
    }
    .mb-md-auto {
      margin-bottom: auto !important;
    }
    .ml-md-auto {
      margin-left: auto !important;
    }
    .mx-md-auto {
      margin-right: auto !important;
      margin-left: auto !important;
    }
    .my-md-auto {
      margin-top: auto !important;
      margin-bottom: auto !important;
    }
  }

  @media (min-width: 992px) {
    .m-lg-0 {
      margin: 0 0 !important;
    }
    .mt-lg-0 {
      margin-top: 0 !important;
    }
    .mr-lg-0 {
      margin-right: 0 !important;
    }
    .mb-lg-0 {
      margin-bottom: 0 !important;
    }
    .ml-lg-0 {
      margin-left: 0 !important;
    }
    .mx-lg-0 {
      margin-right: 0 !important;
      margin-left: 0 !important;
    }
    .my-lg-0 {
      margin-top: 0 !important;
      margin-bottom: 0 !important;
    }
    .m-lg-1 {
      margin: 0.25rem 0.25rem !important;
    }
    .mt-lg-1 {
      margin-top: 0.25rem !important;
    }
    .mr-lg-1 {
      margin-right: 0.25rem !important;
    }
    .mb-lg-1 {
      margin-bottom: 0.25rem !important;
    }
    .ml-lg-1 {
      margin-left: 0.25rem !important;
    }
    .mx-lg-1 {
      margin-right: 0.25rem !important;
      margin-left: 0.25rem !important;
    }
    .my-lg-1 {
      margin-top: 0.25rem !important;
      margin-bottom: 0.25rem !important;
    }
    .m-lg-2 {
      margin: 0.5rem 0.5rem !important;
    }
    .mt-lg-2 {
      margin-top: 0.5rem !important;
    }
    .mr-lg-2 {
      margin-right: 0.5rem !important;
    }
    .mb-lg-2 {
      margin-bottom: 0.5rem !important;
    }
    .ml-lg-2 {
      margin-left: 0.5rem !important;
    }
    .mx-lg-2 {
      margin-right: 0.5rem !important;
      margin-left: 0.5rem !important;
    }
    .my-lg-2 {
      margin-top: 0.5rem !important;
      margin-bottom: 0.5rem !important;
    }
    .m-lg-3 {
      margin: 1rem 1rem !important;
    }
    .mt-lg-3 {
      margin-top: 1rem !important;
    }
    .mr-lg-3 {
      margin-right: 1rem !important;
    }
    .mb-lg-3 {
      margin-bottom: 1rem !important;
    }
    .ml-lg-3 {
      margin-left: 1rem !important;
    }
    .mx-lg-3 {
      margin-right: 1rem !important;
      margin-left: 1rem !important;
    }
    .my-lg-3 {
      margin-top: 1rem !important;
      margin-bottom: 1rem !important;
    }
    .m-lg-4 {
      margin: 1.5rem 1.5rem !important;
    }
    .mt-lg-4 {
      margin-top: 1.5rem !important;
    }
    .mr-lg-4 {
      margin-right: 1.5rem !important;
    }
    .mb-lg-4 {
      margin-bottom: 1.5rem !important;
    }
    .ml-lg-4 {
      margin-left: 1.5rem !important;
    }
    .mx-lg-4 {
      margin-right: 1.5rem !important;
      margin-left: 1.5rem !important;
    }
    .my-lg-4 {
      margin-top: 1.5rem !important;
      margin-bottom: 1.5rem !important;
    }
    .m-lg-5 {
      margin: 3rem 3rem !important;
    }
    .mt-lg-5 {
      margin-top: 3rem !important;
    }
    .mr-lg-5 {
      margin-right: 3rem !important;
    }
    .mb-lg-5 {
      margin-bottom: 3rem !important;
    }
    .ml-lg-5 {
      margin-left: 3rem !important;
    }
    .mx-lg-5 {
      margin-right: 3rem !important;
      margin-left: 3rem !important;
    }
    .my-lg-5 {
      margin-top: 3rem !important;
      margin-bottom: 3rem !important;
    }
    .p-lg-0 {
      padding: 0 0 !important;
    }
    .pt-lg-0 {
      padding-top: 0 !important;
    }
    .pr-lg-0 {
      padding-right: 0 !important;
    }
    .pb-lg-0 {
      padding-bottom: 0 !important;
    }
    .pl-lg-0 {
      padding-left: 0 !important;
    }
    .px-lg-0 {
      padding-right: 0 !important;
      padding-left: 0 !important;
    }
    .py-lg-0 {
      padding-top: 0 !important;
      padding-bottom: 0 !important;
    }
    .p-lg-1 {
      padding: 0.25rem 0.25rem !important;
    }
    .pt-lg-1 {
      padding-top: 0.25rem !important;
    }
    .pr-lg-1 {
      padding-right: 0.25rem !important;
    }
    .pb-lg-1 {
      padding-bottom: 0.25rem !important;
    }
    .pl-lg-1 {
      padding-left: 0.25rem !important;
    }
    .px-lg-1 {
      padding-right: 0.25rem !important;
      padding-left: 0.25rem !important;
    }
    .py-lg-1 {
      padding-top: 0.25rem !important;
      padding-bottom: 0.25rem !important;
    }
    .p-lg-2 {
      padding: 0.5rem 0.5rem !important;
    }
    .pt-lg-2 {
      padding-top: 0.5rem !important;
    }
    .pr-lg-2 {
      padding-right: 0.5rem !important;
    }
    .pb-lg-2 {
      padding-bottom: 0.5rem !important;
    }
    .pl-lg-2 {
      padding-left: 0.5rem !important;
    }
    .px-lg-2 {
      padding-right: 0.5rem !important;
      padding-left: 0.5rem !important;
    }
    .py-lg-2 {
      padding-top: 0.5rem !important;
      padding-bottom: 0.5rem !important;
    }
    .p-lg-3 {
      padding: 1rem 1rem !important;
    }
    .pt-lg-3 {
      padding-top: 1rem !important;
    }
    .pr-lg-3 {
      padding-right: 1rem !important;
    }
    .pb-lg-3 {
      padding-bottom: 1rem !important;
    }
    .pl-lg-3 {
      padding-left: 1rem !important;
    }
    .px-lg-3 {
      padding-right: 1rem !important;
      padding-left: 1rem !important;
    }
    .py-lg-3 {
      padding-top: 1rem !important;
      padding-bottom: 1rem !important;
    }
    .p-lg-4 {
      padding: 1.5rem 1.5rem !important;
    }
    .pt-lg-4 {
      padding-top: 1.5rem !important;
    }
    .pr-lg-4 {
      padding-right: 1.5rem !important;
    }
    .pb-lg-4 {
      padding-bottom: 1.5rem !important;
    }
    .pl-lg-4 {
      padding-left: 1.5rem !important;
    }
    .px-lg-4 {
      padding-right: 1.5rem !important;
      padding-left: 1.5rem !important;
    }
    .py-lg-4 {
      padding-top: 1.5rem !important;
      padding-bottom: 1.5rem !important;
    }
    .p-lg-5 {
      padding: 3rem 3rem !important;
    }
    .pt-lg-5 {
      padding-top: 3rem !important;
    }
    .pr-lg-5 {
      padding-right: 3rem !important;
    }
    .pb-lg-5 {
      padding-bottom: 3rem !important;
    }
    .pl-lg-5 {
      padding-left: 3rem !important;
    }
    .px-lg-5 {
      padding-right: 3rem !important;
      padding-left: 3rem !important;
    }
    .py-lg-5 {
      padding-top: 3rem !important;
      padding-bottom: 3rem !important;
    }
    .m-lg-auto {
      margin: auto !important;
    }
    .mt-lg-auto {
      margin-top: auto !important;
    }
    .mr-lg-auto {
      margin-right: auto !important;
    }
    .mb-lg-auto {
      margin-bottom: auto !important;
    }
    .ml-lg-auto {
      margin-left: auto !important;
    }
    .mx-lg-auto {
      margin-right: auto !important;
      margin-left: auto !important;
    }
    .my-lg-auto {
      margin-top: auto !important;
      margin-bottom: auto !important;
    }
  }

  @media (min-width: 1200px) {
    .m-xl-0 {
      margin: 0 0 !important;
    }
    .mt-xl-0 {
      margin-top: 0 !important;
    }
    .mr-xl-0 {
      margin-right: 0 !important;
    }
    .mb-xl-0 {
      margin-bottom: 0 !important;
    }
    .ml-xl-0 {
      margin-left: 0 !important;
    }
    .mx-xl-0 {
      margin-right: 0 !important;
      margin-left: 0 !important;
    }
    .my-xl-0 {
      margin-top: 0 !important;
      margin-bottom: 0 !important;
    }
    .m-xl-1 {
      margin: 0.25rem 0.25rem !important;
    }
    .mt-xl-1 {
      margin-top: 0.25rem !important;
    }
    .mr-xl-1 {
      margin-right: 0.25rem !important;
    }
    .mb-xl-1 {
      margin-bottom: 0.25rem !important;
    }
    .ml-xl-1 {
      margin-left: 0.25rem !important;
    }
    .mx-xl-1 {
      margin-right: 0.25rem !important;
      margin-left: 0.25rem !important;
    }
    .my-xl-1 {
      margin-top: 0.25rem !important;
      margin-bottom: 0.25rem !important;
    }
    .m-xl-2 {
      margin: 0.5rem 0.5rem !important;
    }
    .mt-xl-2 {
      margin-top: 0.5rem !important;
    }
    .mr-xl-2 {
      margin-right: 0.5rem !important;
    }
    .mb-xl-2 {
      margin-bottom: 0.5rem !important;
    }
    .ml-xl-2 {
      margin-left: 0.5rem !important;
    }
    .mx-xl-2 {
      margin-right: 0.5rem !important;
      margin-left: 0.5rem !important;
    }
    .my-xl-2 {
      margin-top: 0.5rem !important;
      margin-bottom: 0.5rem !important;
    }
    .m-xl-3 {
      margin: 1rem 1rem !important;
    }
    .mt-xl-3 {
      margin-top: 1rem !important;
    }
    .mr-xl-3 {
      margin-right: 1rem !important;
    }
    .mb-xl-3 {
      margin-bottom: 1rem !important;
    }
    .ml-xl-3 {
      margin-left: 1rem !important;
    }
    .mx-xl-3 {
      margin-right: 1rem !important;
      margin-left: 1rem !important;
    }
    .my-xl-3 {
      margin-top: 1rem !important;
      margin-bottom: 1rem !important;
    }
    .m-xl-4 {
      margin: 1.5rem 1.5rem !important;
    }
    .mt-xl-4 {
      margin-top: 1.5rem !important;
    }
    .mr-xl-4 {
      margin-right: 1.5rem !important;
    }
    .mb-xl-4 {
      margin-bottom: 1.5rem !important;
    }
    .ml-xl-4 {
      margin-left: 1.5rem !important;
    }
    .mx-xl-4 {
      margin-right: 1.5rem !important;
      margin-left: 1.5rem !important;
    }
    .my-xl-4 {
      margin-top: 1.5rem !important;
      margin-bottom: 1.5rem !important;
    }
    .m-xl-5 {
      margin: 3rem 3rem !important;
    }
    .mt-xl-5 {
      margin-top: 3rem !important;
    }
    .mr-xl-5 {
      margin-right: 3rem !important;
    }
    .mb-xl-5 {
      margin-bottom: 3rem !important;
    }
    .ml-xl-5 {
      margin-left: 3rem !important;
    }
    .mx-xl-5 {
      margin-right: 3rem !important;
      margin-left: 3rem !important;
    }
    .my-xl-5 {
      margin-top: 3rem !important;
      margin-bottom: 3rem !important;
    }
    .p-xl-0 {
      padding: 0 0 !important;
    }
    .pt-xl-0 {
      padding-top: 0 !important;
    }
    .pr-xl-0 {
      padding-right: 0 !important;
    }
    .pb-xl-0 {
      padding-bottom: 0 !important;
    }
    .pl-xl-0 {
      padding-left: 0 !important;
    }
    .px-xl-0 {
      padding-right: 0 !important;
      padding-left: 0 !important;
    }
    .py-xl-0 {
      padding-top: 0 !important;
      padding-bottom: 0 !important;
    }
    .p-xl-1 {
      padding: 0.25rem 0.25rem !important;
    }
    .pt-xl-1 {
      padding-top: 0.25rem !important;
    }
    .pr-xl-1 {
      padding-right: 0.25rem !important;
    }
    .pb-xl-1 {
      padding-bottom: 0.25rem !important;
    }
    .pl-xl-1 {
      padding-left: 0.25rem !important;
    }
    .px-xl-1 {
      padding-right: 0.25rem !important;
      padding-left: 0.25rem !important;
    }
    .py-xl-1 {
      padding-top: 0.25rem !important;
      padding-bottom: 0.25rem !important;
    }
    .p-xl-2 {
      padding: 0.5rem 0.5rem !important;
    }
    .pt-xl-2 {
      padding-top: 0.5rem !important;
    }
    .pr-xl-2 {
      padding-right: 0.5rem !important;
    }
    .pb-xl-2 {
      padding-bottom: 0.5rem !important;
    }
    .pl-xl-2 {
      padding-left: 0.5rem !important;
    }
    .px-xl-2 {
      padding-right: 0.5rem !important;
      padding-left: 0.5rem !important;
    }
    .py-xl-2 {
      padding-top: 0.5rem !important;
      padding-bottom: 0.5rem !important;
    }
    .p-xl-3 {
      padding: 1rem 1rem !important;
    }
    .pt-xl-3 {
      padding-top: 1rem !important;
    }
    .pr-xl-3 {
      padding-right: 1rem !important;
    }
    .pb-xl-3 {
      padding-bottom: 1rem !important;
    }
    .pl-xl-3 {
      padding-left: 1rem !important;
    }
    .px-xl-3 {
      padding-right: 1rem !important;
      padding-left: 1rem !important;
    }
    .py-xl-3 {
      padding-top: 1rem !important;
      padding-bottom: 1rem !important;
    }
    .p-xl-4 {
      padding: 1.5rem 1.5rem !important;
    }
    .pt-xl-4 {
      padding-top: 1.5rem !important;
    }
    .pr-xl-4 {
      padding-right: 1.5rem !important;
    }
    .pb-xl-4 {
      padding-bottom: 1.5rem !important;
    }
    .pl-xl-4 {
      padding-left: 1.5rem !important;
    }
    .px-xl-4 {
      padding-right: 1.5rem !important;
      padding-left: 1.5rem !important;
    }
    .py-xl-4 {
      padding-top: 1.5rem !important;
      padding-bottom: 1.5rem !important;
    }
    .p-xl-5 {
      padding: 3rem 3rem !important;
    }
    .pt-xl-5 {
      padding-top: 3rem !important;
    }
    .pr-xl-5 {
      padding-right: 3rem !important;
    }
    .pb-xl-5 {
      padding-bottom: 3rem !important;
    }
    .pl-xl-5 {
      padding-left: 3rem !important;
    }
    .px-xl-5 {
      padding-right: 3rem !important;
      padding-left: 3rem !important;
    }
    .py-xl-5 {
      padding-top: 3rem !important;
      padding-bottom: 3rem !important;
    }
    .m-xl-auto {
      margin: auto !important;
    }
    .mt-xl-auto {
      margin-top: auto !important;
    }
    .mr-xl-auto {
      margin-right: auto !important;
    }
    .mb-xl-auto {
      margin-bottom: auto !important;
    }
    .ml-xl-auto {
      margin-left: auto !important;
    }
    .mx-xl-auto {
      margin-right: auto !important;
      margin-left: auto !important;
    }
    .my-xl-auto {
      margin-top: auto !important;
      margin-bottom: auto !important;
    }
  }

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

  .text-nowrap {
    white-space: nowrap !important;
  }

  .text-truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .text-left {
    text-align: left !important;
  }

  .text-right {
    text-align: right !important;
  }

  .text-center {
    text-align: center !important;
  }

  @media (min-width: 576px) {
    .text-sm-left {
      text-align: left !important;
    }
    .text-sm-right {
      text-align: right !important;
    }
    .text-sm-center {
      text-align: center !important;
    }
  }

  @media (min-width: 768px) {
    .text-md-left {
      text-align: left !important;
    }
    .text-md-right {
      text-align: right !important;
    }
    .text-md-center {
      text-align: center !important;
    }
  }

  @media (min-width: 992px) {
    .text-lg-left {
      text-align: left !important;
    }
    .text-lg-right {
      text-align: right !important;
    }
    .text-lg-center {
      text-align: center !important;
    }
  }

  @media (min-width: 1200px) {
    .text-xl-left {
      text-align: left !important;
    }
    .text-xl-right {
      text-align: right !important;
    }
    .text-xl-center {
      text-align: center !important;
    }
  }

  @media (min-width: 300px) and (max-width: 767px)
  {
    .pM-t-rem3{
      padding-top: 3rem;
    }
    .mM-t-rem3{
      margin-top: 3rem;
    }
  }


  .f-12{
    font-size: 12px;
  }

  .f-13{
    font-size: 13px;
  }

  .f-14{
    font-size: 14px;
  }

  .f-15{
    font-size: 15px;
  }

  .f-16{
    font-size: 16px;
  }

  .f-17{
    font-size: 17px;
  }

  .f-18{
    font-size: 18px;
  }

  .f-19{
    font-size: 19px;
  }

  .f-20{
    font-size: 20px;
  }

  .f-21{
    font-size: 21px;
  }

  .f-22{
    font-size: 22px;
  }

  .f-23{
    font-size: 23px;
  }

  .f-24{
    font-size: 24px;
  }

  .f-25{
    font-size: 25px;
  }

  .f-26{
    font-size: 25px;
  }

  .f-27{
    font-size: 25px;
  }

  .f-28{
    font-size: 25px;
  }

  .fw-1{
    font-weight: 100!important;
  }

  .fw-2{
    font-weight: 200!important;
  }

  .fw-3{
    font-weight: 300!important;
  }

  .fw-4{
    font-weight: 400!important;
  }

  .fw-5{
    font-weight: 500!important;
  }

  .fw-6{
    font-weight: 600!important;
  }

  .fw-7{
    font-weight: 700!important;
  }
  /* End bootstrap 4 alignment*/

  .overflowX {
    overflow-x: auto;
  }

  .m-w-100 {
    max-width: 90px;
  }

  .m-t-n30
  {
      margin-top: -30px;
  }

  .float-right
  {
      float: right;
  }

  .float-left
  {
      float: left;
  }

  /*Canvas loader in head.php*/
  #canvasLoader {
      position: fixed;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      z-index: 1000;
      background: rgba(243, 243, 243, 0.4);
  }
  #canvasLoaderContainer {
      position: absolute;
      width: 100%;
      height: 200px;
      top:0;
      bottom: 0;
      left: 0;
      right: 0;
      margin: auto;
      text-align: center;
  }
  /*Canvas loader in head.php*/

  /*Canvas message in head.php*/
  #canvasMessage .modal-header,
  #canvasMessage .modal-body,
  #canvasMessage .modal-footer {
      text-align: center;
      border: 0;
  }

  #canvasMessage .modal-footer {
      padding-bottom: 20px;
  }

  #canvasMessage .modal-title i {
      display: block;
      padding-top: 25px;
  }

  /*Canvas message in head.php*/

  /* webServices.php */
  #webservicesListTable i.cursorPointer:hover {
      color: #71b6f9;
  }

  #dataMessage .modal-header {
      text-align: center;
  }

  #dataMessage .modal-footer {
      padding-bottom: 45px;
  }

  #dataMessage .modal-title i {
      display: block;
      padding-top: 25px;
  }

  #dataAlertMessage {
      overflow-x: auto;
  }

  .cursorPointer {
      cursor: pointer;
  }
  /* webServices.php*/

  /* General interface */
  .navbar-left {
      float: left;
  }

  li.breadcrumb-item {
      padding: 0px 2px !important;
  }


  #breadcrumbs {
      height: 40px;
      background: #ebeff2;
      margin-left: 250px;
  }

  @media (min-width: 768px) {
      #breadcrumbs {
          display: block;
      }

      .enlarged #breadcrumbs {
          display: block;
      }
  }

  .forced.enlarged #breadcrumbs {
      display: block;
  }

  /*
  .forced #sidebar-menu {
      top: 50px;
  }
  */

  ul.breadcrumb {
      padding-left: 40px;
  }

  .enlarged #breadcrumbs {
      margin-left: 70px;
  }

  @media (max-width: 768px) {
      .enlarged #breadcrumbs {
          margin-left: 0px;
      }
      /* .enlarged .content-page .content {
          margin-top: 150px;
      } */
      .forced #breadcrumbs {
          margin-left: 0px;
          display: none;
      }
  }

  #logoutBtn:hover {
      color: #71b6f9;
      cursor: pointer;
  }

  /* Table margin set for paginateText */
  #basicwizard .table-responsive {
      margin-bottom: 10px;
  }
  /* General interface */

  /* sponsorTree View */
  ul.noList {
      list-style: none;
      list-style-type: none;
  }

  /* #headerLogo{
    content: url("/admin/images/logo-black-heart.png ");
  } */

  .align-middle {
    vertical-align: middle;
    display: inline-block;
  }

  .taglineOne{
    font-size:18px;
  }

  .taglineTwo{
    font-size:11px;
  }

  @media (max-width: 407px){
    .taglineOne{
        font-size:18px !important;
    }

    .taglineTwo{
        font-size:10px !important;
    }
  }

  #headerLogo{
    content: url("../images/icons/logo.png");
  }

  #loginLogo{
    height: 40% !important;
    width: 60%;
    text-align: center;
    content: url("../images/icons/logo.png");
  }

  .fixBackgroundColorHeight{
    min-height: calc(110vh - 50px);
  }

  #header-logo-admin {
    display: block;
    float: left;
    color: #ffffff;
    font-size: 24px;
    height: 34px;
    line-height: 34px;
  }

  #navListTreeView i:hover {
      cursor: pointer;
  }

  #navListTreeView i {
    float: none;
    transition: transform .65s ease;
  }

  #navListTreeView i.rotate90 {
      transform: rotate(90deg);
  }

  #navListTreeView ul.group-list {
      padding-left: 0px;
  }

  #navListTreeView a,
  #navListTreeView a:hover,
  #navListTreeView a:active,
  #navListTreeView a:focus {
      text-decoration: none;
      text-shadow: none;
      color: #797979;
  }

  #navListTreeView a:hover {
      cursor: pointer;
  }
  /* sponsorTree View */

  /* hz CSS */

  .show{
      display: block;
  }

  .hide{
      display: none;
  }

  .event-custom-select{
    background: white;
    border-radius: 0;
    height: calc(1.9em + 1.7rem + 2px);
    border: 1px solid #b3b3b3;;
    width: 100%;
    padding-left: 12px;
    -webkit-appearance: none !important;
    appearance: none !important;
    -moz-appearance: none !important;

    /* Add paddings to accommodate arrow */
    margin-right: -10px;

    /* Add arrow icon */
    background-image: url('data:image/svg+xml;charset=utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px" viewBox="0 0 24 24" xml:space="preserve"><path d="M7.41,8.59L12,13.17l4.59-4.58L18,10l-6,6l-6-6L7.41,8.59z"/><path fill="none" d="M0,0h24v24H0V0z"/></svg>') !important;
    background-position: center right;
    background-repeat: no-repeat;
  }

  .table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {
      vertical-align: middle;
  }

  .table>thead>tr>th{
    text-align:left!important;
    /* padding-left: 30px !important; */
  }
  .table thead td, .table thead th {
	padding: .75rem;
  }
  /* by hz CSS */

  table.dataTable thead > tr > th {
      /* padding-left: 10px;
       padding-right: 10px; */
  }

  table.dataTable.dtr-inline.collapsed>tbody>tr>td:first-child:before, table.dataTable.dtr-inline.collapsed>tbody>tr>th:first-child:before {
      top: unset;
      margin-left:5px;
      }
  input[type=checkbox]:not(.form-check-input), input[type=radio] {
      margin-left: 10px;
  }

  @media (max-width: 767px) {
      table tbody td.customTdStyle{
          min-width: 90px!important;
      }
  }

  @media (min-width: 768px) {
      table tbody td.customTdStyle{
          min-width: 130px!important;
      }
  }

  table tbody td.customTdStyle{
      word-break:break-all!important;
      white-space: unset!important;
  }

  /* Raymond css */
  div.packageBox a {
      background-color: inherit;
      float: left;
      border: none;
      outline: none;
      cursor: pointer;
      padding: 14px 16px;
      transition: 0.3s;
  }

  div.packageBox a:hover {
      border: 1px solid #1ca011!important;
  }

  div.packageBox a.active {
      background-color: #f9fff8!important;
      border: 2px solid #1ca011!important;
      color: #1ca011!important;
  }

  @media (max-width: 767px){
      .paymentBox{
          width: 100%!important;
      }

      .mobileBox{
          border: 1px solid #ddd;
      }

      .mobileBorderLess{
          border: none!important;
      }

      .borderMobile{
          border-bottom: 1px solid #dddddd!important;
      }
  }


  div.menuActive:hover{
      background-color: #f7f7f7;
  }

  div.menuActive.active {
      background-color: #dddddd;
  }

  div.menuActive {
      padding: 10px;
  }

  div.menuActive a {
      color: #000000!important;
  }

  .text-black{
    color: black!important;
  }
  /* End */


  .menuTabActive{
    color: #71b6f9!important;
  }

  /* by hz CSS */
  .checkbox.checkbox-primary, .radio {
       margin-top: 0px;
       margin-bottom: 0px;
  }

  .checkbox.checkbox-primary label{
    vertical-align: middle;
  }

  .tableOverDate{
    min-width: 100px;
      max-width: 200px;
      text-overflow: ellipsis;
      overflow: hidden;
      white-space: nowrap;
  }

  .cursorPointer{
      cursor: pointer;
  }

  .table.tableSelect tr:hover{
    background-color: #e6f4ff!important;
  }

  .ticketNo{
    color: #a7a7a7;
  }

  .iconBlue {
      height: 18px;
      line-height: 18px;
      padding: 1px 10px;
      text-align: center;
      background-color: #1c8ae3;
      border-radius: 8px;
      color: white;
      -webkit-box-shadow: 0px 2px 2px 0px rgba(153,147,153,1);
      -moz-box-shadow: 0px 2px 2px 0px rgba(153,147,153,1);
      box-shadow: 0px 2px 2px 0px rgba(153,147,153,1);
  }

  .iconOrange {
      height: 18px;
      line-height: 18px;
      padding: 1px 10px;
      text-align: center;
      background-color: #e26324;
      border-radius: 8px;
      color: white;
      -webkit-box-shadow: 0px 2px 2px 0px rgba(153,147,153,1);
      -moz-box-shadow: 0px 2px 2px 0px rgba(153,147,153,1);
      box-shadow: 0px 2px 2px 0px rgba(153,147,153,1);
  }

  .ticketListTable select.form-control {
      padding: 5px 5px;
      font-size: 12px;
      height: 30px;
  }

  .ticketListTable tr {
      cursor: pointer;
  }

  .ticketListTable .table-striped >tbody tr:hover {
      background-color: #e6f4ff!important;
  }

  .openBorder{
    border-left: 6px solid #82b72b;
  }

  .pendingBorder{
    border-left: 6px solid #eacf39;
  }

  .waitBorder{
    border-left: 6px solid #39a5ea;
  }

  .closeBorder{
    border-left: 6px solid #e5e5e5;
  }

  .comment .comment-body {
      margin-left: 0;
  }

  .btn-table{
    border-radius: 2px;
    padding: 6px 6px;
    width: 20px;
  }

  .btn-primary {
      /* background-color: #41c3ea !important; */
      /* border: 1px solid #41c3ea !important; */
      margin-right: 10px;
  }

  .btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .btn-primary.focus, .btn-primary:active, .btn-primary:focus, .btn-primary:hover, .open > .dropdown-toggle.btn-primary {
      background-color: #b37a00 !important;
      border: 1px solid #b37a00 !important;
  }

  .searchColumn{
    color:#9fa8af;
    border-radius:5%;
    border:2px solid #f7f7f7;
    padding-bottom:10px;
    padding-top:10px;
    padding-left:10px;
    padding-right:10px;
    margin-left:20px;
    margin-right:20px;
    width:250px;
    height:100px
  }

  #humburger-menu-left{
    color:#28344a;
  }

  #sidebar-menu > ul > li > a.active > img{
      filter: none !important;
      /* filter: sepia(400%) hue-rotate(550deg) saturate(600%); */
  }
  #sidebar-menu > ul > li > a.active {
    /* border-bottom-left-radius:30%;
      border-top-left-radius: 30%; */

      /* border-left: 8px solid #4CA0FF	 !important;
      color: #4CA0FF !important;
      background-color: #eaf4ff;
      border-left: 3px solid transparent;
      font-weight: 500;
      padding-left: 15px; */

      color: #0c1141 !important;
      background-color: white;
      border-left: 3px solid transparent;
      font-weight: 500;
      padding-left: 15px;
      margin: 0px 15px;
      border-radius: 5px;
  }

  #sidebar-menu > ul > li >a {
    color: white;
    background-color: #0c1141;
    margin: 0px 15px;
    border-radius: 5px;
  }

  #wrapper.enlarged .left.side-menu #sidebar-menu > ul > li > a.active i {
    text-decoration: underline;
    text-underline-offset: 2px;
  }

  #wrapper.enlarged .left.side-menu #sidebar-menu > ul > li > a.active:hover {
    border-bottom-left-radius: 0%;
    border-top-left-radius: 0%;
  }

  #wrapper.enlarged .left.side-menu #sidebar-menu > ul > li > a.active {
    border-bottom-left-radius:30%;
    border-top-left-radius: 30%;
  }

  #sidebar-menu-bottom {
    position: fixed !important;
    bottom: 0;
    width: auto;
  }

  .side-menu {
    position: fixed !important;
  }

  /* .collapse {
    height: 100%;
  } */

  .left-sidebar-menu{
    /* height: 65%; */
  }

  #wrapper.forced .left.side-menu .collapse {
    overflow-y: scroll;
  }

  #wrapper.forced.enlarged .left.side-menu .collapse {
    overflow-y:unset;
  }

  #sidebar-menu .subdrop {
    border-left: 3px solid transparent;
    color: white !important;

    /* border-left: 3px solid white;
    color: #71b6f9 !important; */
  }

  #sidebar-menu ul ul li.active a {

      /* border-bottom-left-radius:30%;
      border-top-left-radius: 30%; */
      color: #188ae2 ;
      /* background-color: white; */
  }

  #sidebar-menu ul ul li a {
    color: white ;
    white-space: nowrap;
  }

  #sidebar-menu ul ul a{
    padding: 10px 20px 10px 57px;
  }

  .has_sub ul li a i {
    margin-right: 5px !important;
    margin-left: 0px !important;
  }

  #sidebar-menu > ul > li > a:hover {
      border-radius: 0%;
      color: #188ae2;
      text-decoration: none;
  }

  #sidebar-menu ul ul a:hover {
      color: #188ae2;
  }

  .pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
      background-color: #41c3ea!important;
      border-color: #41c3ea!important;
  }

  .input-group .form-control {
      height: 37px;
  }

  .topbar .topbar-left {
    background: transparent !important;
  }

  @media(min-width:768px) and (max-width:1023px){
    .topbar .topbar-left .logo{
      display:none;
    }

    #wrapper.enlarged .topbar .topbar-left {
      width: 0px !important;
  }
  }

  .textLeft{
    text-align:left!important;
  }

  .textRight{
    text-align:right!important;
  }

  .textright{
    text-align:right!important;
  }

  .textCenter{
    text-align:center!important;
  }
  .left.side-menu{
    width: 250px;
  }
  .content-page {
    margin-left:250px;
    overflow: hidden;
  }


  #wrapper.enlarged .left.side-menu #sidebar-menu ul > li:hover > a {
      background: #f4f8fb;
      color: #188ae2;
      border-color: #188ae2;
  }

  #wrapper.enlarged .left.side-menu #sidebar-menu ul > li:hover > ul a.active {
    background: #f4f8fb;
    color: #188ae2;
  }

  #wrapper.enlarged .left.side-menu #sidebar-menu ul > li:hover > ul a {
    background: #435579;
    color: white;
    box-shadow: none;
    padding-left: 15px;
    position: relative;
    width: 186px;
    z-index: 6;
  }

  #wrapper.enlarged .left.side-menu #sidebar-menu ul > li:hover > ul {
    background: #435579;
  }
  /* .sidebar-inner {
    overflow: auto !important;
    height: 100%;
    bottom: 0;
  } */
    .button-menu-mobile {
      display: block !important;
    }


  .button-menu-mobile:hover {
      color: #188ae2;
  }

  .pricing-column .inner-box {
       padding: 20px 0;
  }

  .pricingTable table thead tr th, .pricingTable table tbody tr td, .pricingTable table tbody tr input{
      text-align: center;
  }

  .pricingTable table tbody tr td input{
      min-width: 100px;
  }

  .formInbox .tab-content {
       padding: unset;
       border: unset;
       border-top: unset;
  }

  .formInbox .nav-tabs {
       border-bottom: unset;
  }

  .form-control[readonly]:hover{
    cursor: not-allowed;
  }

  /* end by hz CSS */

  .showScrollbar::-webkit-scrollbar {
      width: 11px !important;
  }

  .showScrollbar::-webkit-scrollbar-thumb {
      border-radius: 8px;
      border: 1px solid white; /* should match background, can't be transparent */
      background-color: rgba(0, 0, 0, .5);
  }

  .scrollmenu {
      overflow: auto;
      white-space: nowrap;
  }

  .scrollmenu a {
      display: inline-block;
      color: white;
      text-align: center;
      padding: 14px;
      text-decoration: none;
  }

  .scrollmenu a:hover {
      background-color: #777;
  }

  .skipColumn:hover{
      cursor: pointer;
  }

  .skipColumn{
      font-size: 12px;
      text-decoration: underline;
      color: #d82f35;
      text-align: right;
      line-height: 30px;
      height: 30px;
      padding-right: 10px;
  }

  .assignColumn{
      padding-right: 10px 10px;
  }

  .manageFieldRow{
      display: table-cell;
      border-radius: 10px;
      background-color: #fbfbfb;
      border: 1px solid #c8c8c8;
      padding: 10px;
      min-width: 230px;
      max-width: 230px;
  }

  .manageFieldRowText{
      height: 40px;
      line-height: 37px;
      padding-left: 10px;
      border-bottom: 1px solid #c8c8c8;
      font-size: 14px;
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden;
      min-width: 100px;
  }

  .useColumn{
      font-size: 12px;
      text-decoration: underline;
      color: #85ba31;
      text-align: right;
      line-height: 30px;
      height: 30px;
      padding-right: 10px;
  }
  .useColumn:hover{
      cursor: pointer;
  }

  .forwardLeftRight{
    border-left-style:  dotted;
    padding-left: 20px !important;
  }

  @media(max-width: 768px){
      .forwardLeftRight{
      border-top-style:  dotted;
      border-left-style:  unset;
      padding-left: unset !important;
      padding-top: 20px !important;

    }
  }

  .table-striped > tbody > tr.disabled {
    background-color: #fbdddd !important;
  }

  .table-striped > tbody > tr.suspended {
    background-color: #fbfadd !important;
  }

  .table-striped > tbody > tr.freezed {
    background-color: #ddedfb !important;
  }

  .table-striped > tbody > tr.activate {
    background-color: #ffffff !important;
  }

  .table-striped > tbody > tr.expiring {
    background-color: #fdf6ad !important;
  }

  .table-striped > tbody > tr.greenWord {
    color: #027502 !important;
    font-weight: 500;
  }

  .table-striped > tbody > tr.redWord {
    color: #188ae2 !important;
    font-weight: 500;
  }

  .customRouteErrorInput{
    background-color: #ffe8e6 !important;
    border : 1px solid #188ae2 !important;
  }

  .datepicker{
    z-index: 1000!important;
  }


  /*td {
      max-width: 130px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
  }*/

  @media (max-width: 767px){
    .salesReportTable{
      padding: 0!important;
    }
    td.salesReportTD{
        max-width: 130px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
  }

  @media (max-width: 991px){
    #formDate{
      padding-left: 0px;
    }
    #formTitle{
      padding-right: 0px;
    }
  }


  /* table css */
  /* thead{
    background-color: #f5f5f5;
  } */

  /*tbody tr td{
    background-color: white;
  }*/

  .table-striped > tbody > tr:nth-of-type(even){
      /* background-color: white; */
  }

  table.dt-responsive{
    overflow: hidden;
  }

  table.dataTable {
      clear: both;
      margin-top: 0px !important;
      margin-bottom: 0px !important;
      max-width: none !important;
  }

  /*@media (min-width: 1200px){*/
  .table-responsive {
      overflow-x: hidden;
  }
  /*}*/

  table.dataTable.dtr-inline.collapsed > tbody > tr > td:first-child:before, table.dataTable.dtr-inline.collapsed > tbody > tr > th:first-child:before {
      box-shadow: 0 0 3px rgba(67, 89, 102, 0.2);
      background-color: #188ae2;
  }

  table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td:first-child:before, table.dataTable.dtr-inline.collapsed > tbody > tr.parent > th:first-child:before {
      background-color: #188ae2;
  }

  table.dataTable>tbody>tr.child {
      padding: 0.5em 1em;
      /* background-color: #f7f7f7!important; */
  }

  table.dataTable>tbody>tr.child:hover {
      background: #f7f7f7 !important;
  }

  table.dataTable>tbody>tr.child ul, table.dataTable>tbody>tr.child li {
      width: 100%;
  }

  /*@media (max-width: 767px){
    table.dataTable>tbody>tr.child span.dtr-title {
        display: block;
        min-width: 75px;
        font-weight: bold;
    }

    table.dataTable>tbody>tr.child span.dtr-data {
        display: block;
    }
  }*/

  table.dataTable.dtr-column>tbody>tr>td.control:before, table.dataTable.dtr-column>tbody>tr>th.control:before {
      background-color: #337ab7!important;
  }



  /*ticketing style*/
  .child .dtr-data .iconOrange{
    width: 100px;
    padding:6px;
    height:auto;
  }

  .small_field{
    width: 50% !important;
    }

  @media screen and (max-width: 425px){
    .small_field {
      width: 100% !important;
    }
  }

  @media screen and (max-width: 425px){
    .custom-small-mobile {
      width: 50% !important;
    }
  }

  @media screen and (max-width: 767px)
  {
  .table-responsive {
      border: unset;
  }
  }

  @media screen and (max-width: 767px)
  {
    .table-responsive {
        border: unset;
    }
  }
  @media screen and (max-width: 768px)
  {
    #date-top-bar {
      margin-top:36px !important;
    }
  }
  @media screen and (max-width: 710px)
  {
    #date-top-bar-li{
      display:none;
    }
    #time-top-bar-li {
      display:none;
    }
  }

  /* @media screen and (max-width: 990px)
  {
    #humburger-top-menu{
      display:block !important;
      padding-left: 0px;
    }
    #container-top-bar{
      padding-bottom: 0px !important;
    }
  } */

  #humburger-top-menu{
    display:block !important;
    padding-left: 0px;
  }

  #container-top-bar{
    padding-bottom: 0px !important;
  }


  @media (max-width: 334px){
    #logoNameOne {
      font-size: 16px !important;
    }
    #logoNameOneSub{
      font-size: 16px !important;
    }
    #logoNameTwo {
      font-size: 10px !important;
    }
  }
  @media (max-width: 768px){
    .low-resolution-padding {
      padding: 15px !important;
    }
  }
  /* @media (max-width: 767px){
    #top-bar-lang {
      top:-5px !important;
    }
  } */
  /* @media (max-width: 374px){
    #topData3IMG{
      margin-top:10px !important;
    }
  } */

  @media (max-width: 767px){
    .moble-view-topdata-img,.mobile-view-topdata-word{
      padding-left: 10px !important;
      margin-top:0px !important;
    }
    .moble-view-topdata-img{
      text-align: center;
    }
    #topDataDiv1,#topDataDiv2,#topDataDiv3,#topDataDiv4{
      min-height: 0px !important;
    }
    #topData1BTM , #topData2BTM , #topData3BTM , #topData4BTM{
      padding-left: 10px !important;
    }
  }

  @media (min-width: 1145px){
    #topData-right1{
      margin-top: 15px !important;
    }
    .img-padding-left{
      padding-left: 10px !important;
    }
  }

  @media (min-width: 1114px){
    #topData-right3{
      margin-top: 15px !important;
    }
  }

  .dataTables_wrapper.dt-bootstrap {
    overflow-x: hidden;
  }

  .fieldHistory {
    color: #188ae2;
    cursor: pointer;

  }

  .upload-drop-zone {
    height: 200px;
    border-width: 2px;
    margin-bottom: 20px;
  }

  /* skin.css Style*/
  .upload-drop-zone {
    border: 1px solid #e2e5ec;
    line-height: 30px;
    text-align: center;
    background-color: white;
    border: 1px solid #b3b3b3;
  }

  .newEventCoverPhoto {
    width:100%;
    height:450px;
    border: 1px solid #e2e5ec;
  }

  @media (max-width: 767px){
    .newEventCoverPhoto {
        height:230px;
    }
  }

  .sorting_disabled{
      color: black;
      font-weight: 600;
      /* background-color: white; */
  }

  .delete {
    display: block;
    cursor: pointer;
    position: absolute;
    top: 8px;
    right: 16px;
    border-radius: 50%;
    background-color: white;
    -webkit-appearance: none;
    border: none;
  }

  .material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
  }

  .dateHide{
    visibility:hidden;
    position: absolute;

    display: block;
    margin-top: -10px;

  }
  .tooltip1 {
    position: relative;
    display: inline-block;
  }

  .tooltip1 .tooltiptext1 {
    visibility: hidden;
    width: 100px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    left: 50%;
    margin-left: -45px;
    bottom: 110%;
    transition: 0.3s;
    opacity: 0;

    /* Position the tooltip */
    position: absolute;
    z-index: 1;
  }

  .tooltip1 .tooltiptext1::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -15px;
    border-width: 5px;
    border-style: solid;
    border-color: black transparent transparent transparent;
  }

  .tooltip1:hover .tooltiptext1 {
    visibility: visible;
    opacity: 1;
    display: block;
  }

  .switch {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 20px;
  }

  .switch input {
    opacity: 0;
    width: 0;
    height: 0;
  }

  .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
  }

  .slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 2px;
    bottom: 3px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
  }

  input:checked + .slider {
    background-color: #2196F3;
  }

  input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
  }

  input:checked + .slider:before {
    -webkit-transform: translateX(21px);
    -ms-transform: translateX(21px);
    transform: translateX(21px);
    content: "\f00c";
    font-family: 'FontAwesome';
    color: #2196F3;
    font-size: 10px;
    text-align: center;
  }

  /* Rounded sliders */
  .slider.round {
    border-radius: 20px;
  }

  .slider.round:before {
    border-radius: 50%;
    width:15px;
    height:15px;
  }

  /* data table border */
  .table>thead:first-child>tr:first-child>th {
    /* border-top:1px solid #EBEBEB;
    border-bottom: 1px solid #EBEBEB; */

    border-top: none !important;
    border-bottom: none !important;
  }

  .table>thead:first-child>tr {
    /* border-right: 1px solid #d4d7d7;
    border-left: 1px solid #d4d7d7; */

    border-top: none !important;
    border-bottom: none !important;
  }

  .table>tbody>tr {
    /* border-right: 1px solid #d4d7d7;
    border-left: 1px solid #d4d7d7; */

    border-top: none !important;
    border-bottom: none !important;
  }

  .table>thead>tr>td , .table>tbody>tr>td {
    border-top: none !important;
    /* border-bottom: none !important; */

    /* border-top: 1px solid #d4d7d7 !important;
    border-bottom: 1px solid #d4d7d7 !important;
    border-right: 1px solid #d4d7d7 !important; */
    /* padding-left: 30px;
    padding-right: 30px; */
  }

  /* quill font size style */
  .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="14px"]::before {
    content: '14px';
    font-size: 14px !important;
  }

  .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="15px"]::before {
    content: '15px';
    font-size: 15px !important;
  }

  .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="16px"]::before {
    content: '16px';
    font-size: 16px !important;
  }
  .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="17px"]::before {
    content: '17px';
    font-size: 17px !important;
  }
  .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="18px"]::before {
    content: '18px';
    font-size: 18px !important;
  }
  .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="19px"]::before {
    content: '19px';
    font-size: 19px !important;
  }
  .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="20px"]::before {
    content: '20px';
    font-size: 20px !important;
  }
  .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="21px"]::before {
    content: '21px';
    font-size: 21px !important;
  }
  .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="22px"]::before {
    content: '22px';
    font-size: 22px !important;
  }
  .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="23px"]::before {
    content: '23px';
    font-size: 23px !important;
  }
  .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="24px"]::before {
    content: '24px';
    font-size: 24px !important;
  }
  .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="25px"]::before {
    content: '25px';
    font-size: 25px !important;
  }
  .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="26px"]::before {
    content: '26px';
    font-size: 26px !important;
  }
  .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="27px"]::before {
    content: '27px';
    font-size: 27px !important;
  }
  .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="28px"]::before {
    content: '28px';
    font-size: 28px !important;
  }
  .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="29px"]::before {
    content: '29px';
    font-size: 29px !important;
  }
  .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="30px"]::before {
    content: '30px';
    font-size: 30px !important;
  }
  .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="31px"]::before {
    content: '31px';
    font-size: 31px !important;
  }
  .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="32px"]::before {
    content: '32px';
    font-size: 32px !important;
  }
  .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="33px"]::before {
    content: '33px';
    font-size: 33px !important;
  }
  .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="34px"]::before {
    content: '34px';
    font-size: 34px !important;
  }
  .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="35px"]::before {
    content: '35px';
    font-size: 35px !important;
  }
  .ql-picker-options{
    overflow-y:scroll;
    height:200px;
  }

  .ql-snow .ql-picker.ql-align .ql-picker-item[data-value="left"]::before {
    text-align: left !important;
  }

  .ql-snow .ql-picker.ql-align .ql-picker-item[data-value="center"]::before {
    text-align: center !important;
  }

  .ql-snow .ql-picker.ql-align .ql-picker-item[data-value="right"]::before {
    text-align: right !important;
  }

  .ql-snow .ql-picker.ql-align .ql-picker-item[data-value="justify"]::before {
    text-align: justify !important;
  }

  .panel-body{
    /* padding: 20px; */
    /* background-color: white; */
    border-radius: 0px;
    color: #000000;
  }

  #resetBtn {
    background-color: transparent;
    /* color: #4890F7 !important; */
    width: 20px;
    cursor: pointer;
  }

  .searchSpacing {
    padding-left:0px;
    padding-right:20px;
  }

  .searchDataTitle {
    font-weight: bold;
    color: #000000;
  }

  .dashboardTitle {
    font-weight: bold;
    color: #000000;
    margin-top: 30px;
  }

  .table-bordered > thead > tr > th {
    border-color: #273349;
  }

  .table-bordered > thead {
    border-top-color: #273349;
  }

  .control-label{
    font-weight: 500;
  }

  .pagination>li>a{
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: black;
    text-decoration: none;
    background-color: white;
    border: 0px solid #ddd;
  }

  .pagination>.disabled>a:focus,.pagination>.disabled>a:hover,.pagination>.disabled>a{
      color: black;
      cursor: not-allowed;
      background-color: white;
      border-color: #ddd;
  }

  @media (min-width: 700px) and (max-width: 768px)
  {
    #loginLogo{
      height: 40% !important;
      width: 50%;
      text-align: center;
    }
  }

  .dt-responsive > tbody > tr:nth-of-type(odd){
    background-color: #f5f7f9 !important;

  }

  .dt-responsive > tbody > tr:nth-of-type(even){
    background-color: white !important;
  }

  #chartdiv {
    width: 100%;
    height: 500px;
  }

  .checkboxList{
    width: 13% !important;
  }

  .editClick{
    width: 10% !important;
  }

  .mobileResponse{
    width: 10px !important;
  }


  @media only screen {
    .toggleSwitch {
      display: inline-block;
      height: 18px;
      position: relative;
      overflow: visible;
      padding: 0;
      cursor: pointer;
      width: 40px
    }
    .toggleSwitch * {
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
    }
    .toggleSwitch label,
    .toggleSwitch > span {
      line-height: 20px;
      height: 20px;
      vertical-align: middle;
    }
    .toggleSwitch input:focus ~ a,
    .toggleSwitch input:focus + label {
      outline: none;
    }
    .toggleSwitch label {
      position: relative;
      z-index: 3;
      display: block;
      width: 100%;
    }
    .toggleSwitch input {
      position: absolute;
      opacity: 0;
      z-index: 5;
    }
    .toggleSwitch > span {
      position: absolute;
      left: -50px;
      width: 100%;
      margin: 0;
      padding-right: 50px;
      text-align: left;
      white-space: nowrap;
    }
    .toggleSwitch > span span {
      position: absolute;
      top: 0;
      left: 0;
      z-index: 5;
      display: block;
      width: 50%;
      margin-left: 50px;
      text-align: left;
      font-size: 0.9em;
      width: 100%;
      left: 15%;
      top: -1px;
      opacity: 0;
    }
    .toggleSwitch a {
      position: absolute;
      right: 50%;
      z-index: 4;
      display: block;
      height: 100%;
      padding: 0;
      left: 2px;
      width: 18px;
      background-color: #fff;
      border: 1px solid #CCC;
      border-radius: 100%;
      -webkit-transition: all 0.2s ease-out;
      -moz-transition: all 0.2s ease-out;
      transition: all 0.2s ease-out;
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    }
    .toggleSwitch > span span:first-of-type {
      color: #ccc;
      opacity: 1;
      left: 45%;
    }
    .toggleSwitch > span:before {
      content: '';
      display: block;
      width: 100%;
      height: 100%;
      position: absolute;
      left: 50px;
      top: -2px;
      background-color: #fafafa;
      border: 1px solid #ccc;
      border-radius: 30px;
      -webkit-transition: all 0.2s ease-out;
      -moz-transition: all 0.2s ease-out;
      transition: all 0.2s ease-out;
    }
    .toggleSwitch input:checked ~ a {
      left: 100%;
      margin-left: -8px;
    }
    .toggleSwitch input:checked ~ span:before {
      border-color: #C5C5C5;
      box-shadow: inset 0 0 0 30px #fff;
    }
    .toggleSwitch input:checked ~ span span:first-of-type {
      opacity: 0;
    }
    .toggleSwitch input:checked ~ span span:last-of-type {
      opacity: 1;
    }

    .toggleSwitch.large {
      width: 61px;
      height: 27px;
    }

    .toggleSwitch.large a {
      width: 26px;
      height: 26px;
      background-color: #d3d3d3;
    }

    .toggleSwitch.large > span {
      height: 29px;
      line-height: 28px;
    }
    .toggleSwitch.large input:checked ~ a {
      left: 41px;
      background-color: #32B14A;
    }
    .toggleSwitch.large > span span {
      font-size: 12px;
      color: #5F5F5F;
    }
    .toggleSwitch.large > span span:first-of-type {
      left: 50%;
    }
  }

  .weightBOLD{
    font-weight: bold;
  }

  @media (min-width: 320px) and (max-width: 600px){
    .webAddCar{
      display: none;
    }

    .mobileAddCar{
      display: block !important;
    }
  }

  /* Customized Dropdown (<select>)*/
  .dropbtn {
    word-break: break-word;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #e2e5ec;
    border-radius: 4px;
    font-size: 15px;
    padding: 0.65rem 1rem;
    cursor: pointer;
    width: 100%;
  }

  .dropbtnStyle {
    word-break: break-word;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    /* border: 1px solid #e2e5ec; */
    border-radius: 4px;
    font-size: 15px;
    /* padding: 0.65rem 1rem; */
    cursor: pointer;
    width: 100%;
  }


  .dropbtn:focus {
    border-color: #006ec4;
  }

  .dropdown {
    position: relative;
    display: block;
  }

  .dropdown-content {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    width: 100%;
    overflow: auto;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
  }

  .dropdown-content a {
    display: block;
    width: 100%;
    height: calc(1.5em + 1.3rem + 2px);
    padding: 0.65rem 1rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    -webkit-transition: border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    text-decoration: none;
  }

  .dropdown a:hover {
    background-color: #ddd;
  }

  /* Dashboard css */
  #dateQuotaDropdown, #dateStatusDropdown{
    width: 50%;
    padding: 9px;
    border: 1px solid #E3E3E3;
    border-radius: 4px;
    background-color:white;
    height:38px;
  }

  .dashboardAdminTitle{
    margin-bottom:10px;
    margin-top: 10px;
    font-weight:bold;
    color:black;
  }

  #topDataDiv1,#topDataDiv2,#topDataDiv3,#topDataDiv4,#topDataDiv5,#topDataDiv6,#topDataDiv7{
    padding:20px;
    min-height: 120px;
    background-color: white;
  }

  #topDataIMG{
    margin-top: 15px;
    padding-left: 0px;
    height: 80px;
    border-bottom: 1px solid lightgray;
  }

  .dashboardLogo{
    margin-top:15px;
    padding-left: 0px;
    height: 80px;
    border-bottom: 1px solid lightgray;
    padding-right: 0px;
    text-align: right;
  }

  /* .modal-open {
    overflow: hidden!important;
  } */


  @media (max-width: 767px){
    .searchSpacing{
      padding-right: 0px;
    }
  }

  @media (max-width: 325px){
    .carOptions{
      margin-left: 0px !important;
      font-size: 14px !important;
    }

    .selectAddCar{
      margin-left: 22px !important;
    }
  }

  @media (min-width: 325px) and (max-width: 413px){
    .carOptions{
      margin-left: 0px !important;
      font-size: 14px !important;
    }

    .selectAddCar{
      margin-left: 22px !important;
    }
  }

/* admin_custom.css */

/* customResponsive.css */
/* Overrides KT class to hide Settings in Menu @ PC media */

@media (min-width: 1025px) {
    .kt-header-menu .kt-menu__nav>.kt-menu__item.mobileMenuViewSettings {
        display: none;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        padding: 0 .15rem;
    }
}

/* Mobile View */
@media (min-width: 320px) and (max-width: 767px) {
    .searchContainer{
      padding-left: unset;
      padding-right: unset;
    }

    .dashboardSection01 {
        margin-top: 0px;
    }

    .dashboardSection01Title {
        font-size: 20px;
        margin-top: 10px;
        border-right: none;
    }


    .dashboardSection03Bg {
        height: 200px;
        background-position: center;
    }

    .dashboardSection03Padding {
        padding-right: 10px;
    }

    .dashboardSection03 {
        padding: 20px 10px 20px 10px;
    }

    .dashboardSection03Padding {
        padding-top: 15px;
        padding-bottom: 15px;
        border-bottom: 1px solid #cccccc;
    }

    .dashboardSection03Padding:last-child {
        border-bottom: 1px solid transparent;
    }

    .dashboardSection03ContentBlock {
        border-right: unset;
        padding-left: 30px;
        margin-top: 10px;
        font-size: 10px;
        text-align: left;
    }

    .dashboardSection03ContentDetail {
        color: #000;
        text-align:right;
        padding-right: 35px;
    }

    .dashboardSection01Box {
        position: unset;
        margin-bottom: -75px;
        padding: 5%;
        transform: translate(0%, 15%) !important;
    }

    .dashboardSection01Border {
        /*border-left: none;*/
    }

    .dashboardIcon {
        width: 50%;
    }

    .dashboardSection02 {
        padding-top: 22%;
    }

    .coverBtn, .renewBtn {
        padding: 10px 7px !important;
    }

    .announcementDate {
        top: 80%;
    }

    .carIcon {
        padding: 0;
    }

    .carIcon img {
        width: 110%;
    }

    .customMargin {
        margin-right: 0;
    }

	.footer {
		padding: 45px;
	}
}

/* Ipad View */
@media (min-width: 768px) and (max-width: 990px) {
    .dashboardSection01 {
        margin-top: 50;
    }

    .dashboardSection03Bg {
        height: 200px;
        background-position: center;
    }

    .dashboardSection03Padding {
        padding-right: 15px;
    }

    .dashboardSection03 {
        padding: 20px 20px 20px 20px;
    }

    .dashboardSection01Box {
        top: 20%;
        padding: 3%;
    }

    .dashboardSection02 {
        padding-top: 20%;
    }

    .coverBtn, .renewBtn {
        font-size: 12px !important;
        padding: 10px 15px !important;
    }

}

/* Ipad Pro View */
@media (min-width: 991px) and (max-width: 1199px) {
    .dashboardSection01Box {
        top: 18%;
    }

    .coverBtn, .renewBtn {
        padding: 10px 30px !important;
    }

    .customMargin {
        margin-right: 50px;
    }
}

/* Iphone 5 View */
@media (max-width: 320px) {
    .announcementText {
        font-size: 15px;
    }

    .announcementTextSub {
        font-size: 11px;
    }

    .announcementDate {
        top: 75%;
    }

    .coverBtn, .renewBtn {
        padding: 7px !important
    }

    .carIcon img {
        width: 110%;
    }

    .customAlign {
        text-align: center;
    }

    .customAlign .btn {
        width: 100% !important;
    }
}
/* customResponsive.css */

/* landing.css */
.landingSection01 {
    background-color: #192e57;
    padding-top: 0px;
    height: 500px;
    min-height: 500px;
    max-height: 500px;
}

.landingSection01Img {
    background-image: url(../images/alpharoc/landing/landingSection01.jpg);
    background-size: cover;
    background-position: bottom;
    background-repeat: no-repeat;
    padding-top: 50px;
    padding-bottom: 300px;
    padding-left: 30px;
    padding-right: 30px;
    position: absolute;
    width: 100%;
    -webkit-box-shadow: 0px 6px 18px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 6px 18px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 6px 18px 0px rgba(0,0,0,0.3);
}

.landingSection01Title {
    font-weight: 600;
    color: #2a3957;
    font-size: 35px;
}

.landingMoreBtn {
    font-weight: 300;
    color: #fff;
    font-size: 17px;
    background-color: #46a6bc;
    padding: 10px 20px;
    border-radius: unset;
    border: unset;
}

.landingSection02 {
    background-color: #f4f8ff;
    padding-bottom: 30px;
    padding-top: 230px;
}

.landingTitleLine {
    width: 50px;
    height: 5px;
    background-color: #8bddc9;
    border-radius: 20px;
    margin: 0 auto;
}

.landingTitleLine2 {
    width: 50px;
    height: 5px;
    background-color: #8bddc9;
    border-radius: 20px;
}

.landingSection02Title {
    font-weight: 600;
    font-size: 25px;
    color: #2a3957;
}

.landingSection02Desc {
    font-weight: 300;
    font-size: 15px;
    color: #808080;
    word-break: break-all;
}

.userImgSize {
    width: 200px;
    margin: 0 auto;
}

.userImg {
    height: 200px;
    width: 200px;
    border-radius: 100%;
}

.userCircle {
    height: 50px;
    width: 50px;
    background-color: #46a6bc;
    position: absolute;
    bottom: 0;
    border-radius: 100%;
    z-index: 1;
}

.companyVideoWidth {
    width: 500px;
    height: 300px;
}

.landingSection04 {
    background-color: #f4f8ff;
    padding-bottom: 100px;
}

.personalVideoWidth {
    height: 200px;
}

.landingSection05 {
    margin-top: -50px;
}

.landingSection05Box {
    background-color: #fff;
    padding: 20px 50px;
    text-align: center;
    -webkit-box-shadow: 0px 6px 18px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 6px 18px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 6px 18px 0px rgba(0,0,0,0.3);
}

.landingSection07Box {
    background-color: #e4faff;
    padding: 20px 50px;
    text-align: center;
    -webkit-box-shadow: 0px 6px 18px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 6px 18px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 6px 18px 0px rgba(0,0,0,0.3);
}

@media (min-width: 320px) and (max-width: 767px) {
    .landingSection07Box {
        background-color: #e4faff;
        padding: 10px 20px;
        text-align: center;
        -webkit-box-shadow: 0px 6px 18px 0px rgba(0,0,0,0.3);
        -moz-box-shadow: 0px 6px 18px 0px rgba(0,0,0,0.3);
        box-shadow: 0px 6px 18px 0px rgba(0,0,0,0.3);
    }
}

.landingSection05Link {
    font-weight: 600;
    font-size: 20px;
    color: #000;
}

.landingSection05LinkText {
    color: #46a6bc;
    text-decoration: underline;
    cursor: pointer;
}

.landingSection06 {
    margin-top: 80px;
    padding-bottom: 80px;
}



.landingIcon {
    width: 70px;
}

.landingIine {
    width: 100px;
}

.landingSection06Box1 {
    width: 15%;
    text-align: center;
    font-size: 15px;
}

.landingSection06Box2 {
    width: 13.333%;
    text-align: center;
    margin-top: 50px;
}

.landingSection06Box3 {
    width: 15%;
    text-align: center;
    margin-top: 20px;
    font-size: 15px;
}

.landingSection06Box4 {
    width: 13.333%;
    text-align: center;
    margin-top: 20px;
}

.landingSection06Box5 {
    width: 15%;
    text-align: center;
    font-size: 15px;
}

.landingSection06Box6 {
    width: 13.333%;
    text-align: center;
    margin-top: 50px;
}

.landingSection06Box7 {
    width: 15%;
    text-align: center;
    margin-top: 20px;
    font-size: 15px;
}

.landingSection07 {
     margin-top: -50px;
}

.landingSection07SignUp {
    font-weight: 600;
    color: #46a6bc;
    font-size: 25px;
    text-decoration: underline;
    cursor: pointer;
    vertical-align: middle;
}

.landingSignUpIcon {
    height: 50px;
    margin-right: 10px;
}

.landingSection08 {
    background-color: #2a3957;
    padding-top: 100px;
    margin-top: -30px;
}

.landingSection09 {
    background-color: #000;
    padding: 5px;
}

.landingFooter {
    font-weight: 300;
    color: #fff;
    font-size: 15px;
    text-align: center;
}

@media (min-width: 991px) and (max-width: 1199px) {

    .landingSection01Img {
        background-image: url(../images/alpharoc/landing/landingSection01.jpg);
        background-size: cover;
        background-position: left;
        background-repeat: no-repeat;
        padding-top: 20px;
        padding-bottom: 300px;
        padding-left: 30px;
        padding-right: 30px;
        position: unset;
        width: 100%;
        -webkit-box-shadow: 0px 6px 18px 0px rgba(0,0,0,0.3);
        -moz-box-shadow: 0px 6px 18px 0px rgba(0,0,0,0.3);
        box-shadow: 0px 6px 18px 0px rgba(0,0,0,0.3);
    }

    .landingSection06Box2 {
        display: none;
    }

    .landingSection06Box4 {
        display: none;
    }

    .landingSection06Box6 {
        display: none;
    }



    .landingSection06Box1 {
        width: 25%;
        text-align: center;
    }



    .landingSection06Box3 {
        width: 25%;
        text-align: center;
        margin-top: 0px;
    }


    .landingSection06Box5 {
        width: 25%;
        text-align: center;
    }


    .landingSection06Box7 {
        width: 25%;
        text-align: center;
        margin-top: 0px;
    }

}

@media (min-width: 768px) and (max-width: 990px) {

    .landingSection06Box2 {
        display: none;
    }

    .landingSection06Box4 {
        display: none;
    }

    .landingSection06Box6 {
        display: none;
    }



    .landingSection06Box1 {
        width: 25%;
        text-align: center;
    }



    .landingSection06Box3 {
        width: 25%;
        text-align: center;
        margin-top: 0px;
    }


    .landingSection06Box5 {
        width: 25%;
        text-align: center;
    }


    .landingSection06Box7 {
        width: 25%;
        text-align: center;
        margin-top: 0px;
    }

    .landingSection02 {
        padding-top: 200px;
    }
    .landingSection01Img {
        background-image: url(../images/alpharoc/landing/landingSection01_mobile.jpg);
        background-size: cover;
        background-position: left;
        background-repeat: no-repeat;
        padding-top: 20px;
        padding-bottom: 300px;
        padding-left: 30px;
        padding-right: 30px;
        position: unset;
        width: 100%;
        -webkit-box-shadow: 0px 6px 18px 0px rgba(0,0,0,0.3);
        -moz-box-shadow: 0px 6px 18px 0px rgba(0,0,0,0.3);
        box-shadow: 0px 6px 18px 0px rgba(0,0,0,0.3);
    }

    .userImg {
        position: unset;
    }

    .landingTitleLine2 {
        margin: 0 auto;
    }

    .textalignSection04 {
        text-align: center;
    }

    .personalVideoWidth {
        margin-top: 20px;
    }
}


@media (min-width: 320px) and (max-width: 767px) {

    .companyVideoWidth {
        width: 100%;
        height: auto;
    }

    .landingSection06Box2 {
        display: none;
    }

    .landingSection06Box4 {
        display: none;
    }

    .landingSection06Box6 {
        display: none;
    }



    .landingSection06Box1 {
        width: 50%;
        text-align: center;
    }



    .landingSection06Box3 {
        width: 50%;
        text-align: center;
        margin-top: 0px;
    }


    .landingSection06Box5 {
        width: 50%;
        text-align: center;
        margin-top: 20px;
    }


    .landingSection06Box7 {
        width: 50%;
        text-align: center;
        margin-top: 20px;
    }

    .landingSection02 {
        padding-top: 200px;
    }
    .landingSection01Img {
        background-image: url(../images/alpharoc/landing/landingSection01_mobile.jpg);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        padding-top: 20px;
        padding-bottom: 100px;
        padding-left: 20px;
        padding-right: 20px;
        position: unset;
        width: 100%;
        -webkit-box-shadow: 0px 6px 18px 0px rgba(0,0,0,0.3);
        -moz-box-shadow: 0px 6px 18px 0px rgba(0,0,0,0.3);
        box-shadow: 0px 6px 18px 0px rgba(0,0,0,0.3);
    }

    .userImg {
        position: unset;
    }

    .landingTitleLine2 {
        margin: 0 auto;
    }

    .textalignSection04 {
        text-align: center;
    }

    .personalVideoWidth {
        margin-top: 20px;
    }

    .landingSection01Title {
        font-size: 20px;
    }

    .landingSection02 {
        padding-top: 50px;
    }

    .personalVideoWidth {
        height: auto;
        width: 100%;
    }

    .landingSection02Title {
        font-size: 20px;
    }

    .landingSection05Box {
        padding-left: 20px;
        padding-right: 20px;
    }

    .landingSection06 {
        margin-top: 40px;
    }

    .landingSection07SignUp {
        font-size: 20px;
    }
}

.landingLanguageSection {
    background-color: #192e57;
    padding: 10px;
}

.languageFont {
    font-weight: 300;
    color: #fff;
    text-transform: capitalize;
    font-size: 15px;
}

.languageBox {
    text-align: right;
}

.landingSignUpBtn {
    border: unset;
    background-color: transparent;
    padding: 0;

}
/* landing.css */

/* header.css */
.homepageHeader {
    padding-left: 3%;
    padding-right: 3%;
    position: fixed;
    top: 0;
    left: 0;
    /*padding-top: 10px;
    padding-bottom: 10px;*/
    background-color: #FFF;
    width: 100%;
    z-index: 100;
    color: #000;
    /* min-height: 75px; */
    border-bottom: 1px solid #f0f0f0;
}


.homepageSubheader {
    padding-left: 3%;
    padding-right: 3%;
    position: fixed;
    top: 0;
    left: 0;
    margin-top: 75px;
    background-color: #e8e8e8;
    width: 100%;
    z-index: 99;
    color: #000;
    /* height: 50px; */
    border-bottom: 0;
}

.navigationSection {
	display: flex;
	flex: 1 1 0;
	justify-content: space-between;
}

.headerMenu {
	display: flex;
	padding-left: 10px;
	padding-right: 10px;
}

.headerMenuItem {
    padding: 10px 5px;
    position: relative;
}

.headerMenuItem a {
	font-size: 15px;
}

.headerMenuItem a:hover {
	color: var(--theme-color) !important;
}

.headerMenuItem.headerMenuBtn a:hover {
  color: #fff !important;
}

.headerMenuItem:hover .headerMenuDropdownBoxProduct {
    display: block;
}

.menuBtn {
    padding: 5px 10px;
    font-weight: 700;
    font-size: 14px;
    color: #000;
    /*text-transform: uppercase;*/
    cursor: pointer;
}

.loginMenuItem {
    color: #fff!important;
}

.homepageSubheader .loginMenuItem {
	color: #000 !important;
	font-weight: 600;
}

.loginMenuItem:hover {
    color: #fff;
    opacity: 0.7;
}

.quotationBtn {
    padding: 5px 10px;
    font-weight: 600;
    font-size: 14px;
    color: #fff;
    background-color: var(--theme-color);
	border-radius: var(--border-radius);
}

.disabledQuotationBtn{
  background-color: var(--quotation-navbar);
  cursor: not-allowed;
  color: #FFF;
}

.quotationBtnHomePage {
    padding: 10px 10px;
    font-weight: 600;
    color: #fff;
	line-height: 60px;
    background-color: var(--theme-color);
}

.menuBtn i.la.la-angle-right {
    display: none;
}

.menuBtn i.la.la-angle-down {
  font-size: 10px;
  margin-top: -3px;
}

/*.menuBtn:hover {
    color: #1b75bb;
    background-color: #dedede;
    border-radius: 5px;
}*/

/*.menuBtn.active {
    background-color: transparent;
    border-radius: 5px;
}*/

.menuSettingBtn {
  padding: 5px 0px;
}

.menuSettingBtn i {
  font-size: 25px;
  color: #000;
  line-height: 25px;
}

.headerMenuDropdown.active ~ .headerMenuDropdownBox {
    display: block;
}

.headerMenuDropdownBox {
    display: none;
    position: absolute;
    background-color: #fff;
    top: 100%;
    right: 0;
    width: 250px;
    animation: headerDropdownBoxFadeIn ease 0.3s;
    z-index: 1;
}

.startSideBar {
    margin-top: -20px;
}

@keyframes headerDropdownBoxFadeIn {
    0% {
        opacity:0;
        top: 200%;
    }
    100% {
        opacity:1;
        top: 100%;
    }
}

.headerMenuDropdown2.active ~ .headerMenuDropdownBox2 {
    display: block;
}

.headerMenuDropdownBox2 {
    display: none;
    position: absolute;
    background-color: #fff;
    top: 0;
    left: -250px;
    width: 250px;
    animation: headerDropdownBoxFadeIn2 ease 0.3s;
    z-index: 1;
}

@keyframes headerDropdownBoxFadeIn2 {
    0% {
        opacity:0;
        left: 0;
    }
    100% {
        opacity:1;
        left: -250px;
    }
}

.headerMenuDropdownItem {
    width: 100%;
    position: relative;
}

.menuDropdownBtn {
    font-weight: 300;
    font-size: 14px;
    color: #fff;
    padding: 10px;
    width: 100%;
    text-align: left;
    padding: 8px 10px;
    background-color: #1e4259;
    border-radius: unset;
}

.menuDropdownBtn:hover {
    background-color: #005faa;
    color: #fff;
    border-radius: unset;
}

.headerMenuClose {
    display: none;
}

.headerBurgerBtn {
    display: none;
}

.homepageHeaderBlackBG {
    display: none;
}

.homepageHeaderMobile {
    display: none;
}

@media (max-width: 800px) {

	#imgcoverEng {
		margin-top: 0px;
	}

    .headerBurgerBtn {
        display: inline-block;
        position: relative;
        z-index: 999;
    }

    .headerBurgerBtn .open, .headerBurgerBtn.active .close {
        display: inline-block;
    }

    .headerBurgerBtn .close, .headerBurgerBtn.active .open {
        display: none;
    }

    .sideBarText{
        width: 200px;
    }

    .menuDropdownBtn:hover {
        background-color: unset;
        color: #fff;
        border-radius: unset;
    }

    .menuBtn {
        width: 100%;
        text-align: left;
    }

    .menuBtn i {
        font-size: 10px!important;
        margin-left: 5px;
        vertical-align: middle;
        display: inline-flex;
        transition: all .5s ease;
    }

    .menuBtn.active {
        color: #1b75bb;
    }

    .menuBtn.active i {
        transform: rotate(360deg);
    }


    .headerMenuDropdown2 i {
        font-size: 10px!important;
        margin-left: 5px;
        vertical-align: middle;
        display: inline-flex;
        transition: all .5s ease;
    }

    .headerMenuDropdown2.active {
        color: #1b75bb;
    }

    .headerMenuDropdown2.active i {
        transform: rotate(90deg);
    }


    .headerMobileDisplayNone {
        display: none;
    }

    .homepageHeader {
        /*width: 100%;
        position: fixed;
        top: 100%;
        left: 0;
        height: 100vh;
        background: unset;
        background-color: #fff;
        padding-top: 50px;
        overflow-y: auto;
        transition: all .5s ease;*/
        display: none !important;
    }

    .headerMenuItem {
        width: 100%;
    }

    .headerMenuDropdown ~ .headerMenuDropdownBox {
        animation: unset;
        display: block;
        position: relative;
        background-color: transparent;
        top: unset;
        right: unset;
        width: 100%;
        overflow: hidden;
        transition: all .5s ease;
        max-height: 0;
    }

    .headerMenuDropdown.active ~ .headerMenuDropdownBox {
        transition: all .5s ease;
        max-height: 100vh;
    }

    .headerMenuDropdown2 ~ .headerMenuDropdownBox2 {
        animation: unset;
        display: block;
        position: relative;
        background-color: transparent;
        top: unset;
        left: unset;
        width: 100%;
        overflow: hidden;
        transition: all .5s ease;
        max-height: 0;
    }

    .headerMenuDropdown2.active ~ .headerMenuDropdownBox2 {
        transition: all .5s ease;
        max-height: 100vh;
    }



    .headerMenuClose {
        display: block;
        position: absolute;
        top: 10px;
        right: 0px;
        color: #6c6e86;
        font-size: 15px;
    }

    /*.headerBurgerBtn,
    .headerBurgerBtn:hover,
    .headerBurgerBtn:focus {
        display: block;
        position: fixed;
        top: 0;
        background-color: #1e4259;
        border-radius: 0;
        z-index: 101;
        padding: 15px;
    }*/

    .headerBurgerBtn i {
        font-size: 25px!important;
        line-height: 25px;
        padding: 0;
        color: #fff;
    }

    .headerBurgerBtn i::before {
        font-weight: 600!important;
    }

    .sidebarMenuWrapper {
        display: block;
        position: fixed;
        z-index: 999;
        height: 100vh;
        width: 250px;
        /* left: -100%; */
        right:-100%;
        top: 0;
        border: 0;
        border-radius: 0;
        background-color: #fff;
        padding-top: 15px;
        transition: all .5s ease;
        overflow-y: auto;
    }

    .headerBurgerBtn.active ~ .sidebarMenuWrapper {
        /* left: 0; */
        right:0;
    }

    .homepageHeaderBlackBG {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgb(0,0,0,0.5);
        z-index: 99;
    }

    .headerBurgerBtn.active ~ .homepageHeaderBlackBG {
        display: block;
    }

    .homepageHeaderMobile {
        display: block;
        background-color: #1e4259;
        position: relative;
        color: #fff;
    }

    .sideBar {
        display: none;
    }
}

.menuLogo{
    padding-right: 0px;
    /* padding-left: 10px; */
    padding-top: 5px;
    padding-bottom: 5px;

    /*margin: 8px 0px 8px 8px;*/
	padding: 0 !important;
}

.menuLogoText {
	color: #000;
	font-size: 2rem;
	font-weight: 900;
}

@media (min-width: 768px) and (max-width: 990px) {
    .sideBar {
        display: none;
    }
}

@media (min-width: 991px) and (max-width: 1199px) {
    .sideBar {
        display: none;
    }
}

@media (min-width: 767px) and (max-width: 810px) {
    .headerMenuItem {
        padding: 10px 5px !important;
    }
}

/* @media (min-width: 320px) and (max-width: 374px) {
    #loginLogo {
        padding-right: 85px !important;
    }
}

@media (min-width: 375px) and (max-width: 425px) {
    #loginLogo {
        padding-right: 75px !important;
    }
} */

/* #topFreeQuoteBTN :hover{
    color: white !important;
    background-color: #00B2CE !important;
} */

#getQuoteBtn {
    font-weight: 700 !important;
}

.getQuoteLabel {
    font-size: 15px !important;
    font-weight: bold !important;
}

#searchQuotationTabs .getQuoteLabel {
  	font-weight: 400 !important;
}
/* header.css */

/* custom.css */
/* Keep this for all project */

@font-face {
    font-family: 'MainFont';
    font-style: normal;
    font-weight: 100;
    src: url(fonts/SFPro/SF-Pro-Text-Light.otf);
}

@font-face {
    font-family: 'MainFont';
    font-style: normal;
    font-weight: 300;
    src: url(fonts/SFPro/SF-Pro-Text-Regular.otf);
}

@font-face {
    font-family: 'MainFont';
    font-style: normal;
    font-weight: 400;
    src: url(fonts/SFPro/SF-Pro-Text-Medium.otf);
}

@font-face {
    font-family: 'MainFont';
    font-style: normal;
    font-weight: 500;
    src: url(fonts/SFPro/SF-Pro-Text-Semibold.otf);
}

@font-face {
    font-family: 'MainFont';
    font-style: normal;
    font-weight: 600;
    src: url(fonts/SFPro/SF-Pro-Text-Bold.otf);
}

@font-face {
    font-family: 'MainFont';
    font-style: normal;
    font-weight: 700;
    src: url(fonts/SFPro/SF-Pro-Text-Heavy.otf);
}

@font-face {
    font-family: 'SecondFont';
    font-style: normal;
    font-weight: 300;
    src: url(fonts/productsans/ProductSans-Regular.ttf);
}

/*open sans*/
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: url(fonts/openSans/open-sans-v15-cyrillic_greek-ext_vietnamese_latin_greek_latin-ext_cyrillic-ext-regular.woff2) format('woff2');
}

/* Playfair Display */
@font-face {
    font-family: 'Playfair Display';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/playfairdisplay/v29/nuFvD-vYSZviVYUb_rj3ij__anPXJzDwcbmjWBN2PKdFvXDZbtXK-F2qC0usEw.woff) format('woff');
}


.body, div, a, button, span, input, section,footer,header {
    font-family: "MainFont";
}

.font2 {
    font-family: "SecondFont", sans-serif !important;
}

/* Keep until here */

/* Dashboard */

.dashboardSection01 {
    background-color: #fff;
	background: url('/images/project/steps-bg.png');
	background-position: 50% 80%;
	background-size: cover;
    margin-top: 125px;
	padding: 75px 75px 0;
}

.dashboardSection01Box {
    /* background-color: white; */
    padding: 3% 3%;
    position: absolute;
    /* box-shadow: 1px 3px 16px 0px rgb(0 0 0 / 13%); */
    top: 50%;
}

.dashboardSection01Border{
}

.dashboardSection01Border:first-child{
}

.dashboardSection01Title {
    color: #000;
    font-size: 42px;
    font-weight: 600;
}

.dashboardSection01Content{
    font-size: 15px;
}

.dashboardSection01Content {
    color: #000;
}

.dashboardText {
    color: black;
    font-size: 17px !important;
	font-weight: 600;
}

.dashboardText2 {
    color: black;
    font-size: 20px;
    font-weight: 700;
}

.greenText {
    color: #77c823;
}

.redText {
    color: red;
}

.dashboardSection02 {
    padding: 100px 75px 75px;
    background-color: white;
}

.dashboardSection02Box {
    background-color: white;
    box-shadow: 1px 3px 16px 0px rgb(0 0 0 / 13%);
    border: 1px solid #fbfbfb;
}

.vehicleBoxBg {
    background-color: #e5e5e5;
    margin: -1px;
    padding: 3%;
}

.vehicleBoxBg.active {
    background-color: #ebfafd;
}

.renewBtn {
    padding: 10px 50px !important;
    font-weight: 600;
    font-size: 14px;
    color: #fff;
    background-color: #76c820;
    border-radius: 20px;
    color: white !important;
}

.coverBtn {
    padding: 10px;
    font-weight: 600;
    font-size: 14px;
    color: #fff;
    border-radius: var(--border-radius);
    background-color: var(--theme-color);
    color: white !important;
}

.dashboardIcon {
    width: 50%;
}

.carIcon img {
    width: 50%;
}

.announcementBox {
    padding: 5%;
    padding-left: 0;
}

.announcementBox {
    padding-right: 0;
}

.announcementImg {
    width: 100%;
    box-shadow: 1px 3px 16px 0px rgb(0 0 0 / 13%);
    filter: brightness(60%);
}

.announcementText {
    position: absolute;
    color: white;
    top: 20%;
    font-size: 18px;
    left: 15%;
    width: 65%;
    font-weight: 700;
}

.announcementTextSub {
    position: absolute;
    color: white;
    top: 45%;
    font-size: 14px;
    left: 15%;
    width: 65%;
    font-weight: 700;
}

.announcementLogo {
    position: absolute;
    color: white;
    top: 55%;
    font-size: 14px;
    left: 10%;
    width: 20%;
    font-weight: 700;
}



.announcementDate {
    position: absolute;
    top: 70%;
    left: 15%;
    color: white;
    font-size: 15px;
    font-style: italic;
}

/* Profile */
.profileBG {
    background-color: #053941;
    margin-top: 100px;
}

.profilePic {
    width: 50%;
    border: 5px solid white;
    border-radius: 100%;
    margin-top: -25%;
}

.editFont {
    text-decoration: underline !important;
    color: #FFB617 !important;
    font-size: 17px;
    font-weight: 600;
}

.profileFont {
    font-size: 15px;
    word-break: break-word;
}

.profileBox {
    padding: 3%;
    box-shadow: 1px 3px 16px 0px rgb(0 0 0 / 13%);
}

.uploadBox {
    padding: 20px;
    border: 1px dashed #C6CCD6;
    background-color: #F9F9FB;
    cursor: pointer;
}

/* Slides */
.slideshow-container {
    position: relative;
}

.newsSlide {
    display: none;
    height: 100%;
}

.dot {
    cursor: pointer;
    height: 9px;
    width: 9px;
    margin: 0 5px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
    transition: background-color 0.6s ease;
}

.dot.active {
    background-color: #00b2ce;
}

.dot:hover {
    background-color: #00b2ce;
    opacity: 0.75;
}

.fading {
    -webkit-animation-name: fade;
    -webkit-animation-duration: 1.5s;
    animation-name: fade;
    animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

@keyframes fade {
    from {opacity: .4}
    to {opacity: 1}
}

/* Default Button */
.btn-primary {
    font-weight: 400;
    font-size: 12px;
    padding: 10px !important;
    cursor: pointer;
    font-weight: 600;
    font-size: 14px;
    color: #fff !important;
    background-color: #FFB617;
    border-radius: 20px;
    text-align: center !important;
}

.btn-primary:hover {
    opacity: 0.7;
    background-color: #00B2CE;
}

.btn-primary.black {
    background-color: black;
}

.btn-primary.black:hover {
    opacity: 0.7;
    background-color: black;
}

.btn-primary.gray {
    background-color: #767c8a;
}

.btn-primary.gray:hover {
    opacity: 0.7;
    background-color: #767c8a;
}

.walletBox {
    width: 250px;
    background-image: url(../images/project/walletBox.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    padding: 100px 50px;
    margin-right: 20px;
}

.walletBoxText1 {
    color: #000;
    font-weight: 600;
    font-size: 14px;
    letter-spacing: 3px;
}

.walletBoxText2 {
    color: #000;
    font-weight: 600;
    font-size: 18px;
    letter-spacing: 3px;
}

.btn-more {
    font-weight: 400;
    font-size: 8px;
    color: #fff;
    background: rgb(98,186,232);
    background: linear-gradient(90deg, rgba(98,186,232) 0%, rgba(63,104,176) 100%);
    border-top-left-radius: 35px;
    border-bottom-right-radius: 35px;
    border: unset;
    padding-left: 20px;
    padding-right: 20px;
    letter-spacing: 3px;
    padding: 5px 18px;
}

.goldLine {
    height: 3px;
    display: block;
    padding-top: 2px;
    background: rgb(140,96,52);
    background: -webkit-linear-gradient(left, rgba(140,96,52) 0%, rgba(255,231,159) 50%, rgba(166,112,51) 100%);
    background: -o-linear-gradient(left, rgba(140,96,52) 0%, rgba(255,231,159) 50%, rgba(166,112,51) 100%);
    background: linear-gradient(to right, rgba(140,96,52) 0%, rgba(255,231,159) 50%, rgba(166,112,51) 100%);
}

.dashboardSection03 {
    padding: 20px 0 20px 20px;
}

.dashboardSection03Bg {
    background-image: url(../images/project/dashboardBG2.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.dashboardSection03Content {
    background-color: #E0EAF0;
    padding-bottom: 30px;
}

.dashboardSection03Padding {
        padding-top: 18px;
}

.dashboardSection03Title {
    width: 230px;
    margin-top: 25px;
    padding: 5px 0px 5px 20px;
    background-color: #fff;
    color: #000;
    font-weight: 600;
    font-size: 18px;
    letter-spacing: 3px;
}

.dashboardSection03ContentBlock {
    color: #3F68B0;
    text-align: center;
    border-right: 1px solid #666666;
}

.dashboardSection03ContentBlock:last-child {
    border-right: 1px solid transparent;
}

.dashboardSection03ContentDetail {
    color: #000;
}

.dashboardSection03Padding {
    padding-right: 0;
}

.diagramBtnBox {
    background-color: #fff;
    padding: 3px 3px;
    position: unset;
    display: inline-block;
}

.diagramBtnBoxFloat {
    background-color: #fff;
    padding: 3px 3px;
    border: 1px solid #cacaca;
    border-radius: 8px;
    position: fixed;
    top: 23%;
    left: 55px;
    z-index: 4;
    box-shadow: 5px 5px 10px #00000052;
}

.diagramBtnBoxMobile {
    background-color: #fff;
    padding: 3px 3px;
    border: 1px solid #cacaca;
    border-radius: 8px;
    position: fixed;
    top: 15%;
    left: 27px;
    z-index: 4;
    box-shadow: 5px 5px 10px #00000052;
    display: inline-flex;
    flex-flow: column-reverse;
}

.copiedMsg {
    color: #000;
    font-size: 15px;
    text-align: center;
    margin-bottom: 10px;
}

.copiedMsg i {
    background-color: #32CD32;
    color: #fff;
    font-size: 15px;
    padding: 2px 3px;
    margin-top: -2px;
    margin-right: 4px;
    border-radius: 50%;
}

.btnSocial {
    color: #000;
}

.btnSocial:hover {
    color: #CCC;
}

.searchBox {
    box-shadow: 1px 3px 16px 0px rgb(0 0 0 / 13%);
    background-color: white;
    padding: 20px;
}

.customMargin {
    margin-right: 20px;
}

/* Overwriting form filters classes for listing page */
.pageContent {
    color: black;
}

.input-group-text {
    border: 0;
    background: white;
}

.filter .input-group .form-control {
    border: 0;
}

.filter .input-group {
    border: 1px solid #E0E0E0;
    border-radius: 4px;
}

.filter .input-group:focus-within, .filter .input-group:hover {
    border: 1px solid #006ec4;
}

.kt-container.formPage {
    padding-left: 5%;
    padding-right: 5%;
}

/* Overwriting table classes for listing display */
.customTable {
    box-shadow: 1px 3px 16px 0px rgb(0 0 0 / 13%);
    border: 0!important;
}

.customTable thead tr {
    background-color: var(--theme-color) !important;
}

.createDefaultTable thead tr {
    background-color: var(--theme-color) !important;
}

.createDefaultTable thead tr th {
    color: white !important;
    border: none !important;
}

.customTable thead tr th {
    color: white !important;
    border: none !important;
}

.customTable tbody tr td {
    /* border: none !important;
    border-bottom: 2px solid #f0f0f0 !important; */
}

.customTable tbody tr.invisibleTR td {
	border-left: none !important;
	border-right: none !important;
}

.customTable tbody tr:last-child td {
    border-bottom: none !important;
}

.customTable tbody tr:nth-of-type(odd){
    /* background-color: white !important; */
}

.customTable tbody tr.invisibleTR:nth-of-type(odd){
    background-color: transparent !important;
}

#listingDiv {
    /* font-family: Arial, Helvetica, sans-serif; */
    border-collapse: collapse;
    width: 100%;
}

#listingDiv td, #listingDiv th {
    border: 1px solid #ddd;
    /* padding: 8px; */
}

#listingDiv tr:nth-child(even){background-color: #f2f2f2;}

#listingDiv tr:hover {background-color: #ddd;}

#listingDiv th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    background-color: #FFB617;
    color: white;
}

.pagination>li>a, .pagination>li>span {
    position: relative;
    float: left;
    padding: 6px 12px;
    line-height: 1.42857143;
    text-decoration: none;
    /* color: #337ab7; */
    /* background-color: #fff; */
    /* border: 1px solid #ddd; */
    margin-left: -1px;
    background-color: transparent;
    border: 0;
    color: #7b7777;
}

#pagerRedeemList, #pagerList{
    display: inline-flex;
    padding: 20px 0px;
}

.pagination .active a, .pagination .active a:hover, .pagination .active a:focus{
    background-color: #FFB617;
    border-radius: 5px;
    color:white;
  }

/* start of quotation page */
.quotation-navbar-container{
  width: 100%;
  display: flex;
}
.quotation-navbar{
  background-color: var(--quotation-navbar);
  color: #FFF;
  text-align: center;
  padding-block: 1rem;
  cursor: pointer;
}

.quotation-navbar.active{
  background-color: var(--theme-color);
}

#listingDiv th{
  background-color: var(--theme-color);
}

.margin-bottom-none{
  margin-bottom: 0!important;
}

.listing-filter-btn{
  background-color:  var(--theme-color);
  color: #FFF;
  min-width: 120px;
}

.noResultFoundContainer{
  display: flex;
  flex-direction: column;
}
/* end of quotation page */

/* start of invoice page */
#printContent {
  display: none;
}

.invoiceOuterWrapper{
  background-color: #FFF;
  padding: 10px;
  position: relative;
}

.invoice-vertical-line{
  width: 100%;
  height: 1px;
  background-color: #EEE;
  margin-block: 1rem;
}

.printing-container{
  display: flex;
  align-items: center;
}

.invoice-header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-inline: 5rem;
}

.whiteBg{
  background-color: #FFF;
}

.kevo-invoice-logo{
  width: 100%;
  height: 80px;
}

@media print {

  @page {
    size: auto;
  }

  .print-text{
    font-size: 16px;
  }

  #printContent {
    display: block !important;
  }

  .invoiceOuterWrapper {
    width: 100%;
  }
}
/* end of invoice page */

@media (max-width: 368px){
    #changePwdBtn{
        margin-left: 0px !important;
        width:100%;
    }

    #editProfileBtn{
        width:100%;
    }

    #saveBtn{
        width:100%;
    }

    #cancelBtn{
        margin-left: 0px !important;
        width:100%;
    }

}

#checkOutBack{
    cursor: pointer;
}

.pointerr{
    cursor: pointer;
}

@media (min-width: 768px) and (max-width: 964px) {
    #getQuoteICPP{
        margin-bottom: 28px !important;
    }
}

.dataTables_empty{
    height: 400px;
    background: url(/images/NoResultFound.png) no-repeat;
    background-size: 100px 40%;
    background-position: 50% 50%;
}

#registerBtnModal{
    color: #FFB617;
    text-decoration: underline;
}

.dashboardSection01CardBoxAlignment {
	position: relative;
	transform: translate(0%, 35%);
	padding: 0;
}

@media (min-width: 320px) and (max-width: 375px) {
    .quotationList{
        padding: 20px 20px;
    }


}

@media (min-width: 320px) and (max-width: 768px) {
    #quotationDetailsText1 , #quotationDetailsText2{
        font-size : 17px;
    }
}

@media (min-width: 320px) and (max-width: 768px) {
    .priceDetail{
        margin : 0;
    }
}

.textRight{
    text-align: right;
}

.textLeft{
    text-align: left;
}

.borderBTM{
    border-bottom: 1px solid white;
}

header.header-scroll {
    background-color: black;
}

@media (min-width: 320px) and (max-width: 767px) {
    #footerLine1{
        border-bottom: 0px solid #42646B;
    }

    #footerLine2{
        border-bottom: 1px solid #42646B;
        padding-bottom: 0px !important;
    }
}

@media (min-width: 320px) and (max-width: 575px) {
    #loginTopDiv{
        padding: 5% 15%;
        text-align: center;
    }

    #loginLogo{
        padding-right: 5px !important;
        padding-left: 10px !important;
        padding-top: 5px !important;
        padding-bottom: 5px !important;
        width: 60%;
    }



    #loginDiv{
        padding: 0% 10% 10% 10% !important;
        margin-top: unset;
    }
}

@media (min-width: 320px) and (max-width: 767px) {
    #getQuoteTitle{
        margin-bottom: 50px !important;
        margin-top: 20px !important;
    }

    #forgotPasswordDiv{
      margin-top: 0;
    }
}

.marginEmpty{
    margin: 0px 0px !important;
}

.summaryTopDIV{
    background-color: #fff;
    padding: 3% 1%;
    font-size: 15px;
}

@media (min-width: 320px) and (max-width: 767px) {
    .summaryTopDIV{
        /* background-color: #ebfafe; */
        padding: 5% 1% 3% 1%;
    }

    #summaryFullName , #summaryIC , #summaryCarNum , #summaryCarType{
        text-align: end;
    }

    #totalAmountBtmDIV{
        margin-left: 0px !important;
    }

    #divSection{
        padding: 0px !important;
    }
}

@media (min-width: 320px) and (max-width: 767px) {
    #bottomBTMNEXT{
        text-align: center !important;
    }

    #bottomBTMAmount{
        text-align: center !important;
        margin-bottom: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }

    #RMamount{
        margin: 0px !important;
    }

}

@media (min-width: 320px) and (max-width: 767px) {
    .mobile-size-center{
        padding-right: 0px !important;
    }
    .container-myInsurance{
        padding-left: 5%;
        padding-right: 5%;
    }
}

.f-w-600{
    font-weight: 600 !important;
}

.bg-white{
   background-color: white;
}

.footerColor{
    color : #E8E8E8;
}

.iconColor{
    color : #000000;
}

#search-head:not(.collapsed) .rotate-icon {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

#fgtPasswordLink{
    font-weight: 700;
}

#quotationDetailsText1 , #quotationDetailsText2{
    font-size : 18px;
}

#totalAmountBtmDIV{
   padding: 2% 5%;
}

.quoteFormBox, 
#quoteFormBox{
    padding : 4%;
}

.travelQuotationBox {
    padding: 4%;
}

#carOwnerDetailForm{
    padding : 4%;
}

.planListBox{
    /* padding : 3% !important; */
}

.carOwnerDetailText{
    font-size: 15px;
    font-weight: bold;
}

.profileTitle{
    font-size: 25px;
}

#editProfileDIV{
    padding-top: 3rem;
}

.dashboardTextContent{
    color: black;
    font-size: 18px;
    font-weight: 700;
}

#profileTopIMG{
    height: 160px;
}

@media (min-width: 320px) and (max-width: 767px) {
    #profileTopBG{
        margin-top: 0px;
    }

    #purchaseContainer , #insuranceContainer{
        padding-top: 13%;
    }

    #registerDiv{
        margin-top: unset;
    }

    #registerDiv{
        margin-top: unset;
    }

}

@media (min-width: 768px) and (max-width: 1023px){
    #registerDiv{
    }
}

@media (min-width: 1024px){
    #registerDiv{
    }
    #registerBG{
    }
    #btnChoose{
        text-align:center;
        width: 30%;
    }
}


@media (min-width: 320px) and (max-width: 960px){
    #registerLeftIMG{
        display: none;
    }
}

@media (min-width: 320px) and (max-width: 1023px){
    #registerLeftIMG{
        display: none;
    }
}

#loginLogo{
    padding-right: 25px !important;
    padding-left: 10px !important;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
}

@media (min-width: 320px) and (max-width: 767px){
    .quoteFormBox, 
    #quoteFormBox{
        padding: 6%;
    }

    .travelQuotationBox {
        padding: 6%;
    }

    .planListBox {
        /* padding: 5% !important; */
        /* padding: 5% 5% 30px 5% !important; */
        margin-top: 10%;
    }

    .borderLine {
        margin: 0 -6% 3% -6%;
    }

    .descPlan{
        font-size: 15px;
        display: flex;
    }

    .cusMT2{
        margin-top: 2rem!important;
    }

    .cusMT1{
        margin-top: 1rem!important;
        margin-bottom: 15px !important;
    }
}

@media (min-width: 1200px) and (max-width:1418px){
    .customMargin{
        margin-right: 35px;
    }
}

@media (min-width: 320px) and (max-width:1099px){
    .sumBox{
    }
}

@media (min-width: 1100px){
    .sumBox{
    }
}

@media (min-width: 320px) and (max-width:400px){
    .titleEditPassword{
        font-size: 20px !important;
    }
}

.titleEditPassword{
    font-size: 25px;
}


.btnCus {
    background: 0 0;
    outline: 0!important;
    vertical-align: middle;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    user-select: none;
    display: inline-block;
}

.btnCus :hover{
    background-color: #00B2CE;
    color : white;
}

@media only screen {
    .toggleSwitch {
      display: inline-block;
      height: 18px;
      position: relative;
      overflow: visible;
      padding: 0;
      cursor: pointer;
      width: 40px
    }
    .toggleSwitch * {
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
    }
    .toggleSwitch label,
    .toggleSwitch > span {
      line-height: 20px;
      height: 20px;
      vertical-align: middle;
    }
    .toggleSwitch input:focus ~ a,
    .toggleSwitch input:focus + label {
      outline: none;
    }
    .toggleSwitch label {
      position: relative;
      z-index: 3;
      display: block;
      width: 100%;
    }
    .toggleSwitch input {
      position: absolute;
      opacity: 0;
      z-index: 5;
    }
    .toggleSwitch > span {
      position: absolute;
      left: -50px;
      width: 100%;
      margin: 0;
      padding-right: 50px;
      text-align: left;
      white-space: nowrap;
    }
    .toggleSwitch > span span {
      position: absolute;
      top: 0;
      left: 0;
      z-index: 5;
      display: block;
      width: 50%;
      margin-left: 50px;
      text-align: left;
      font-size: 0.9em;
      width: 100%;
      left: 15%;
      top: -1px;
      opacity: 0;
    }
    .toggleSwitch a {
      position: absolute;
      right: 50%;
      z-index: 4;
      display: block;
      height: 100%;
      padding: 0;
      left: 2px;
      width: 18px;
      background-color: #fff;
      border: 1px solid #CCC;
      border-radius: 100%;
      -webkit-transition: all 0.2s ease-out;
      -moz-transition: all 0.2s ease-out;
      transition: all 0.2s ease-out;
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    }
    .toggleSwitch > span span:first-of-type {
      color: #ccc;
      opacity: 1;
      left: 45%;
    }
    .toggleSwitch > span:before {
      content: '';
      display: block;
      width: 100%;
      height: 100%;
      position: absolute;
      left: 50px;
      top: -2px;
      background-color: #fafafa;
      border: 1px solid #ccc;
      border-radius: 30px;
      -webkit-transition: all 0.2s ease-out;
      -moz-transition: all 0.2s ease-out;
      transition: all 0.2s ease-out;
    }
    .toggleSwitch input:checked ~ a {
      left: 100%;
      margin-left: -8px;
    }
    .toggleSwitch input:checked ~ span:before {
      border-color: #C5C5C5;
      box-shadow: inset 0 0 0 30px #fff;
    }
    .toggleSwitch input:checked ~ span span:first-of-type {
      opacity: 0;
    }
    .toggleSwitch input:checked ~ span span:last-of-type {
      opacity: 1;
    }

    .toggleSwitch.large {
      width: 61px;
      height: 27px;
    }

    .toggleSwitch.large a {
      width: 26px;
      height: 26px;
      background-color: #d3d3d3;
    }

    .toggleSwitch.large > span {
      height: 29px;
      line-height: 28px;
    }
    .toggleSwitch.large input:checked ~ a {
      left: 41px;
      background-color: #32B14A;
    }
    .toggleSwitch.large > span span {
      font-size: 12px;
      color: #5F5F5F;
    }
    .toggleSwitch.large > span span:first-of-type {
      left: 50%;
    }
}

.textCenter{
    text-align: center;
}

.closeBtnPopUp {
    padding: 10px !important;
    width: 40% !important;
    cursor: pointer;
    font-weight: 900;
    font-size: 14px;
    color: #fff !important;
    background-color: #FFB617;
    border-radius: 20px;
    /* text-align: center !important; */
    text-align: center;
}

.closeBtnMiddle{
    text-align: center;
    display: grid;
    grid-auto-flow: column;
    gap: 4px;
    align-items: center;
    justify-items: center;
}

.modalBodyPF{
    background-color:#ebfdff;
    padding:40px;
    padding-left:20px;
    margin-top: 15px;
    color: black;
}

/* white label  */
#modalWL{
	/* background-image: url("/images/project/register-bg.jpg"); */
	background-size: cover;
	background-repeat: no-repeat;
	/* padding-top: 3rem; */
}
#wlModalH1{
    font-weight: 949;
	font-size: 4.5vw;
}
#wlModalH3{
    font-weight: 549;
	font-size: 1.5vw;
}
#wlBoxH1{
    font-weight: 949;
	font-size: 3.5vw;
}
#wlBoxH3{
    font-weight: 549;
	font-size: 1.2vw;
}
.modalLoginBtn.sendOTPwl{
    font-size: 13px;
    width: 80% !important;
    height: 145%;
    padding: 5px !important;
    margin: -5px;
    background-color: #FFB617;
}
.modalLoginBtn.wlBtn{
    background-color: var(--theme-color);
    border-radius: var(--border-radius);
}
select{
    border: none;
}

/* Landing Page css */
#mainbox1{
	background-image: url("../images/landingpg/mask_group_13.jpg");
	background-size: cover;
	background-repeat: no-repeat;
	padding-top: 3rem;
}
#mainbox2{
	background-image: url("../images/landingpg/mask_group_14.jpg");
	background-size: cover;
	background-repeat: no-repeat;
	padding-top: 1rem;
}
#mainbox3{
	background-image: url("../images/landingpg/mask_group_15.jpg");
	background-size: cover;
	background-repeat: no-repeat;
	padding-top: 1rem;
}
#header1f1f3{
	font-family: 'Arial', sans-serif;
	font-weight: 949;
	font-size: 4.5vw;
	text-align: left;
}
#header1f2{
	font-family: 'Arial', sans-serif;
	font-weight: 949;
	font-size: clamp(40px,5.5vw,55px);
	text-align: center;
}
#descHeaderf1f3{
	color: #000000;
	font-weight: 600;
	font-size: 24px;
}
#descHeaderf2{
	color: #ffffff;
	font-weight: 600;
	font-size: 24px;
}
#signupHeader{
	color: #000000;
	font-weight: 700;
	font-size: clamp(16px,5vw,32px);
}
#column2{
	display: flex;
    justify-content: space-around;
}
#contactsf2{
	background-color: rgb(0,0,0,52%);
	border-radius: 10px;
	width: 60%;
    display: flex;
}
#contactsf3{
	background-color: rgb(0,0,0,41%);
	border-radius: 10px;
	width: 60%;
}
@media(max-width: 575px){
    #logo{
		width: 60%;
		margin-left: 2vw;
	}
    #contactsf2{
        justify-content: center;
        width: 100%;
    }
	#signupBox{
		width: 100%;
	}
    #header1f1f3{
        font-size: clamp(7vw,23px,8vw);
    }
    #icon{
		margin-top: 3px;
		width: 60%;
	}
    #contactpic{
		width: 95%;
	}
}
@media(min-width: 320px) and (max-width: 374px){
}
@media(min-width: 375px) and (max-width: 575px){
}
@media(min-width: 700px) and (max-width: 769px){
    #header1{
		font-size: 35px;
	}
	#icon{
		margin-top: 7px;
		width: 80%;
	}
}
@media(min-width: 576px){
	#signupBox{
		width: 80%;
	}
	#icon{
		width: 80%;
	}
    #contactpic{
		width: 90%;
	}
}
@media (min-width: 320px) and (max-width: 767px) {
    #loginIMG{
        display: none;
    }

    #qrInput{
        margin-top: 60px !important;
        /* background-color: black; */
    }

    #redeemBtn{
        width: 60%;
    }

    .announcementBox{
        padding-left: 5%;
        padding-right: 5%;
    }

    #dashboardEmpty{
        margin-top: 20px;
        margin-bottom: 20px;
    }
}

@media (min-width: 600px) and (max-width: 900px) {
    #voucherTitle{
        margin-bottom: 20px;
    }

    #voucherTitleText{
        font-size: 26px !important;
        /* background-color: black; */
    }

    #voucherTitleSubText{
        font-size: 26px !important;
        /* background-color: black; */
    }

}

@media (min-width: 901px) {
    #voucherTitle{
        margin-bottom: 20px;
    }

    #voucherTitleText{
        font-size: 30px !important;
        /* background-color: black; */
    }

    #voucherTitleSubText{
        font-size: 30px !important;
        /* background-color: black; */
    }
}

.redeemError{
    margin: 20px 0px 0px 0px !important;
    text-align: left;
}

@media (min-width: 767px) {
    #dashboardEmpty{
        margin: 40px 0px;
    }

    #emptyImg{
        width: 8% !important;
    }
}

/* Table CSS for White Label */
#whiteLabelListDiv {
    /* font-family: Arial, Helvetica, sans-serif; */
    border-collapse: collapse;
    width: 100%;
  }

  /* #whiteLabelListDiv td, #whiteLabelListDiv th {
    border: 1px solid;
    padding: 8px;
  } */

  #whiteLabelListDiv tr:nth-child(even){background-color: #f2f2f2;}

  #whiteLabelListDiv tr:hover {background-color: #ddd;}

  #whiteLabelListDiv th {
    margin-top: 12px;
    margin-bottom: 12px;
    text-align: left;
    background-color: #000000;
    color: white;
    text-align: center;
  }
  #whiteLabelListDiv td {
    margin-top: 12px;
    margin-bottom: 12px;
    text-align: left;
    font-weight: bold;
    text-align: center;
  }

  #whiteLabelListDiv th, #whiteLabelListDiv td {
    border-bottom: 1px solid #ddd;
  }


  /*  */
  #whiteLabelPaymentListDiv {
    /* font-family: Arial, Helvetica, sans-serif; */
    border-collapse: collapse;
    width: 100%;
  }

  /* #whiteLabelListDiv td, #whiteLabelListDiv th {
    border: 1px solid;
    padding: 8px;
  } */

  #whiteLabelPaymentListDiv tr:nth-child(even){background-color: #f2f2f2;}

  #whiteLabelPaymentListDiv tr:hover {background-color: #ddd;}

  #whiteLabelPaymentListDiv th {
    margin-top: 12px;
    margin-bottom: 12px;
    text-align: left;
    background-color: #000000;
    color: white;
    text-align: center;
  }
  #whiteLabelPaymentListDiv td {
    margin-top: 12px;
    margin-bottom: 12px;
    text-align: left;
    font-weight: bold;
    text-align: center;
  }

  #whiteLabelPaymentListDiv th, #whiteLabelPaymentListDiv td {
    border-bottom: 1px solid #ddd;
  }


/* White Label Template */
.quotaInput{
    margin: 3% auto;
}

#domainOption {
    font-weight: bold;
    font-size: 22px;
}
#whiteLabelText{
    font-size: 13px;
    font-weight: 100;
    padding: 10px;
}

.text-danger{
    color: #ff5b5b !important;
    font-weight:bolder;
    /* font-size: 20px; */
}
.formSubTitle{
    font-size: 28px;
    font-weight: bold;
}

.domainName{
    background:darkgray;
    padding: 10px 20px;
    color: white;
    font-weight: 600;
    border-radius: 0px 20px 20px 0px;
}

.sampleWLLink{
    color: #888888;
}

.whiteLabelPopImage{
    padding: 10px;
}

.whiteLabelPopImage:hover{
    transition:0.2s;
    border-radius: 10px;
    padding: 10px;
    border:5px solid rgb(209,209,209);
}

.whiteLabelPopImage.active{
    border-radius: 10px;
    padding: 10px;
    border:5px solid rgb(100, 178, 255);
}

.btnWL{
    border: #000000 1px solid;
    border-radius: 10px;
    padding: 5px 20px;
    width: 50%;
    margin: 10px auto;
}

/* Checkboxes and Radio buttons
--------------------------------------------------
*/
.radio,
.checkbox {
  margin-bottom: 10px;
  margin-top: 10px;
  padding-left: 0px;
}
.radio label,
.checkbox label {
  display: inline-block;
  cursor: pointer;
  position: relative;
  padding-left: 25px;
  margin-right: 15px;
  min-width: 17px;
  min-height: 17px;
  font-size: 13px;
  line-height: 20px;
  margin-bottom: 0;
}
.radio label:before,
.checkbox label:before {
  -webkit-box-sizing: inherit;
  box-sizing: border-box;
  content: "";
  display: inline-block;
  width: 17px;
  height: 17px;
  margin-right: 10px;
  position: absolute;
  left: 0px;
  background-color: #fff;
  border: 1px solid #d0d0d0;
}
.radio label:before {
  bottom: 2.5px;
  border-radius: 99px;
  -webkit-transition: border 0.3s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
  transition: border 0.3s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
}
.radio input[type=radio]:checked + label:before {
  border-width: 5px;
}
.radio input[type="radio"]:focus + label {
  color: #2c2c2c;
}
.radio input[type="radio"]:focus + label:before {
  background-color: #e6e6e6;
}
.radio input[type=radio] {
  opacity: 0;
  width: 0;
  height: 0;
}
.radio input[type=radio][disabled] + label {
  opacity: 0.65;
}
.radio.radio-success input[type=radio]:checked + label:before {
  border-color: #10cfbd;
}
.radio.radio-primary input[type=radio]:checked + label:before {
  border-color: #6d5cae;
}
.radio.radio-info input[type=radio]:checked + label:before {
  border-color: #89000e;
}
.radio.radio-warning input[type=radio]:checked + label:before {
  border-color: #f8d053;
}
.radio.radio-danger input[type=radio]:checked + label:before {
  border-color: #f55753;
}
.radio.radio-complete input[type=radio]:checked + label:before {
  border-color: #FFB617;
}
.checkbox + .checkbox,
.radio + .radio {
  margin-top: -5px;
}
.checkbox input[type=radio][disabled] + label:after {
  background-color: #e6e6e6;
}
.checkbox label {
  transition: border 0.2s linear 0s, color 0.2s linear 0s;
}
.checkbox label:before {
  top: 1.4px;
  border-radius: 3px;
  transition: border 0.2s linear 0s, color 0.2s linear 0s;
}
.checkbox label::after {
  display: inline-block;
  width: 16px;
  height: 16px;
  position: absolute;
  left: 3.5px;
  top: 0px;
  font-size: 11px;
  transition: border 0.2s linear 0s, color 0.2s linear 0s;
}
.checkbox label:after {
  border-radius: 3px;
}
.checkbox input[type=checkbox] {
  opacity: 0;
  width: 0;
  height: 0;
}
.checkbox.checkbox-circle label:after {
  border-radius: 99px;
}
.checkbox.checkbox-circle label:before {
  border-radius: 99px;
}
.checkbox input[type=checkbox]:checked + label:before {
  border-width: 8.5px;
}
.checkbox input[type=checkbox]:checked + label::after {
  font-family: 'FontAwesome';
  content: "\F00C";
  color: #fff;
}
.checkbox input[type="checkbox"]:focus + label {
  color: #2c2c2c;
}
.checkbox input[type="checkbox"]:focus + label:before {
  background-color: #e6e6e6;
}
.checkbox input[type=checkbox][disabled] + label {
  opacity: 1;
}
.checkbox input[type=checkbox][disabled] + label:before {
  background-color: #eceff3;
}
.checkbox.right label {
  margin-right: 35px;
  padding-left: 0 !important;
}
.checkbox.right label:before {
  right: -35px;
  left: auto;
}
.checkbox.right input[type=checkbox]:checked + label {
  position: relative;
}
.checkbox.right input[type=checkbox]:checked + label::after {
  font-family: 'FontAwesome';
  content: "\F00C";
  position: absolute;
  right: -27px;
  left: auto;
}
body.rtl .checkbox label::after {
  left: -1.2px;
}
.checkbox.check-success input[type=checkbox]:checked + label:before {
  border-color: #10cfbd;
}
.checkbox.check-primary input[type=checkbox]:checked + label:before {
  border-color: #6d5cae;
}
.checkbox.check-complete input[type=checkbox]:checked + label:before {
  border-color: #48b0f7;
}
.checkbox.check-warning input[type=checkbox]:checked + label:before {
  border-color: #f8d053;
}
.checkbox.check-danger input[type=checkbox]:checked + label:before {
  border-color: #f8d053;
}
.checkbox.check-info input[type=checkbox]:checked + label:before {
  border-color: #3b4752;
}
.checkbox.check-success input[type=checkbox]:checked + label::after,
.checkbox.check-primary input[type=checkbox]:checked + label::after,
.checkbox.check-complete input[type=checkbox]:checked + label::after,
.checkbox.check-warning input[type=checkbox]:checked + label::after,
.checkbox.check-danger input[type=checkbox]:checked + label::after,
.checkbox.check-info input[type=checkbox]:checked + label::after {
  color: #fff;
}

.subCheckBoxTitle{
    font-size: 13px;
    padding: 10px;
}

#websiteName, #pageTitle{
    width: 50%;
}

#btnChoose{
    text-align:center;
}

/* Added Start 27/02/2023 */


.clientTopNav {
  overflow: hidden;
  /* background-color: #FFB617; */
}

.clientTopNav a {
  float: left;
  display: block;
  color: black;
  text-align: center;
  padding: 10px 10px;
  text-decoration: none;
  font-size: 13px;
  font-weight: bold;
}

.clientTopNav a:hover {
  background-color: #FFB617;
  color: black;
}

.clientTopNav a.active {
  background-color: #FFB617;
  color: #04AA6D;
}

.clientTopNav .icon {
  display: none;
}

div.menuActive2:hover{
    background-color: #FFB617;
}

div.menuActive2.active {
    background-color: #FFB617;
}

div.menuActive2 {
    padding: 10px;
}

@media screen and (max-width: 600px) {
  .clientTopNav a:not(:first-child) {display: none;}
  .clientTopNav a.icon {
    float: right;
    display: block;
  }
}

@media screen and (max-width: 600px) {
  .clientTopNav.responsive {position: relative;}
  .clientTopNav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .clientTopNav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
}

/* Added End 27/02/2023 */
/* custom.css */

/* Profile Page Start */
.pageContent#profile-page {
    padding-top: 100px;
}
#changePasswordModal .btn-grey,
#profile-page .btn-grey {
    background-color: #b1b1b1;
    color: #fff;
    border-radius: 0px;
    font-weight: 600;
    padding: 10px 50px;
}
#changePasswordModal .btn-red,
#profile-page .btn-red {
    background-color: var(--theme-color);
    color: #fff;
    border-radius: 0px;
    font-weight: 600;
    padding: 10px 50px;
}
#changePasswordModal .modal-body {
    padding: 0 3rem 1rem 3rem;
}
#changePasswordModal h2 {
    color: #000;
    font-weight: bold;
}
#changePasswordModal .beforeLoginBtn2 {
    font-weight: bold;
    color: #fff;
}
#changePasswordModal .modal-footer {
    padding-top: 0;
    margin-bottom: 20px;
}
/* Profile Page End */

/* Transaction Result Start */
.transaction-result-section {
    padding: 10% 20% 5% 20%;
    color: black;
    background: url('/images/project/steps-bg.png');
    background-repeat: no-repeat;
    background-size: contain;
}

.transaction-result-icon {
    width: 25%;
    height: auto;
}

.transaction-result-details-div {
    background-color: #F6F6F6;
    padding: 1.5rem;
    font-size: 15px;
    font-weight: 100;
}

.transaction-result-details-box,
.transaction-result-details-btn-div {
    /* width: 80%; */
	width: 100%;
}

.transaction-result-detail-title,
.transaction-result-failed,
.transaction-result-success {
    font-size: 15px;
}

.transaction-result-failed,
.transaction-result-success {
    font-weight: 600;
    text-align: right;
}

.transaction-result-failed {
    color: #FF0200;
}

.transaction-result-success {
    color: #50CC2C;
}

.transaction-result-detail-title {
    font-weight: 700;
}

.resetBtn {
    padding: 10px 25px !important;
    cursor: pointer;
    font-weight: 900;
    font-size: 14px;
    color: #fff !important;
    background-color: #B1B1B1;
    border-radius: var(--border-radius);
}

.transaction-result-details-btn-div .getQuoteBtn {
    width: 30% !important;
}

.checkboxClickChgColor.de-selected {
    width: 28px;
}

.btnThemeModal {
	background: var(--theme-color);
	border-radius: var(--border-radius);
}

.btnDefaultModal {
	border-radius: var(--border-radius);
}

.sticky-whatsapp {
  z-index: 9999;
  position: fixed;
  bottom: 35px;
  right: 20px;
  background: rgba(255, 255, 255, 1);
  -webkit-box-shadow: 0 2px 13px 0 rgba(0,0,0,0.55);
  box-shadow: 0 1px 13px 0 rgba(0,0,0,0.55);
  border-radius: 75px;
  color: #fff;
  padding: 15px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  vertical-align: middle;
  font-size: 1.08rem;
  cursor: pointer;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  -webkit-animation-name: jumpUp;
  animation-name: jumpUp;
  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
}

#consentPageSection {
    padding: 10% 10%;
    color: black;
    /* background-color: white; */
    background: url('/images/project/steps-bg.png');
    background-repeat: no-repeat;
    background-size: contain;
}

#consentPageSection .page-title p {
    font-size: 25px;
    color: #000;
    margin-bottom: 30px;
}

#consentPageSection .page-body {
  background: white;
  padding: 30px 60px;
}

#consentPageSection .page-body .body-content ol {
  padding-left: 0;
  list-style-position: inside;
}

#consentPageSection .page-body .body-content ol li {
  margin-bottom: 30px;
  color:#767C8A;
}

#consentPageSection a {
  text-decoration: underline;
}

#consentPageSection .page-body .body-header {
  margin-bottom:20px;
}

#consentPageSection .page-body .body-header p {
  font-size: 20px;
  color: #000;
  margin-bottom: 0;
}

#consentPageSection .body-checkbox-div {
  display: flex;
  margin-bottom:30px;
  align-items:center;
}


#consentPageSection .body-checkbox-div p {
  margin-bottom: 0;
  color:#767C8A;
}

#consentPageSection .body-checkbox-div span {
  color:#DA0000;
}

#consentPageSection .body-checkbox-div input {
  margin-right: 20px;
  margin-left:0;
  transform: scale(1.5);
  align-self: flex-start;
  margin-top:5px;
}

#consentPageSection .body-btn button:first-child {
  color: white;
  background:#084FD2;
  padding:20px;
  border:none;
  outline:none;
  width:190px;
  padding:13px;
  font-weight:bold;
  font-size: 13px;
  margin-right:30px;
}

#consentPageSection .body-btn button:last-child {
  border:none;
  outline:none;
  color: #A7A7A7;
  background:none;
}


/* Mobile View */
@media (min-width: 320px) and (max-width: 767px) {
    .transaction-result-section {
        padding: 5% 3%;
    }

    .transaction-result-details-div span{
        display: block;
        text-align: left;
    }

    .transaction-result-details-div span.transaction-result-detail-title {
        text-align: left;
    }

    .transaction-result-details-btn-div .getQuoteBtn {
        width: 50% !important
    }

    .resetBtn {
        width: 50%;
    }

    .transaction-result-icon {
        width: 35%;
    }

    .pageContent#profile-page{
      padding-top: 10px;
    }
    .quotationSection.loggedInClass {
        padding-top: unset !important;
        padding-left: 5% !important;    
        padding-right: 5% !important;
    }

    .loggedInClass .providerLogoWrap {
     //   justify-content: center;
    }

    .loggedInClass .quotationComp {
        //text-align: center;
	text-align: left;
    }

    .dashboardSection01 {
        margin-top: unset;
        padding: 75px 25px 0;
    }

    .dashboardSection02 {
        padding: 25% 25px 15%;
    }

    .dashboardSection01CardBoxAlignment {
        margin-bottom: 10px;
    }

    .getQuoteBtn.quote-list-btn {
        width: 100% !important;
    }

    .loggedInClass #plan_feature {
        padding-left: unset;
        padding-right: unset;
    }

    .checkboxClickChgColor.de-selected {
        width: 40px;
    }
    .buttonGap.checkout-mobile {
        column-gap: unset;
    }
    .checkout-mobile #saveQuoteBtn,
    .checkout-mobile .checkout-mobile-btn,
    .checkout-mobile .menuBtn {
        text-align: center;
    }

    .checkout-mobile .checkout-mobile-btn {
        width: 100%;
    }

    .checkout-mobile #saveQuoteBtn .getQuoteBtnNextnBackSummary {
        padding-top: unset !important;
    }

    .checkout-mobile .menuBtn {
        width: 100% !important;
    }

    #consentPageSection .page-body {
      padding:20px; 
    }

    #consentPageSection .body-btn button:first-child {
      margin-right:0;
    }
}

/* Ipad View */
@media (min-width: 768px) and (max-width: 990px) {
    .transaction-result-section {
        padding: 20% 5% 10% 5%;
    }

    .transaction-result-section .quotationDivSection {
        padding: 0 10%;
    }

    .dashboardSection01CardBoxAlignment {
        transform: unset;
    }

    .imgCardBox {
        max-width: 300px;
    }

    .dashboardSection02 {
        padding: 20px 75px 45px;
    }

    .checkboxClickChgColor.de-selected {
        width: 50px;
    }
}

/* Ipad Pro View */
@media (min-width: 991px) and (max-width: 1199px) {
    .transaction-result-section {
        padding: 15% 5% 10% 5%;
    }

    .transaction-result-details-btn-div .getQuoteBtn {
        width: 25% !important;
    }

    /*.dashboardSection01CardBoxAlignment {
        transform: unset;
    }

    .dashboardSection02 {
        padding: 20px 75px 45px;
    }*/

    .imgCardBox {
        max-width: 275px;
    }

    .checkboxClickChgColor.de-selected {
        width: 37px;
    }
}
/* Transaction Result End */

@page { size: auto;  margin: 0mm; }

/* motorQuotationList */

.motorQuotationList-company-name {
margin-bottom: 35px;
height: 30px;
}

/*zurich table for payment succes page*/

#zurichTable td {
	color: #000;
	font-weight: 300;
	font-size: 12px;
	text-align: center;
}