/*** GLOBAL SETTING ***/
body {margin:0; padding:0;font:normal 13px 'Nunito Sans', sans-serif;color:#5b5b5b; line-height:normal;}
/* *,html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd,q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center,dl, dt, dd, ol, ul, li, fieldset, form, label, legend{margin:0; padding:0; border:0; outline:0; font-size:100%; background:transparent; resize:none} */
body {line-height:1}
a, a:hover {text-decoration:none; outline:none}
a:active, a:focus {outline:0} 
img {border:none; vertical-align:top}
.reset {list-style:none; padding:0; margin:0}

/* nunito-sans-regular - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Nunito Sans';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/nunito-sans-v15-latin/nunito-sans-v15-latin-regular.eot'); /* IE9 Compat Modes */
    src: url('../fonts/nunito-sans-v15-latin/nunito-sans-v15-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/nunito-sans-v15-latin/nunito-sans-v15-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
         url('../fonts/nunito-sans-v15-latin/nunito-sans-v15-latin-regular.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
         url('../fonts/nunito-sans-v15-latin/nunito-sans-v15-latin-regular.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
         url('../fonts/nunito-sans-v15-latin/nunito-sans-v15-latin-regular.svg#NunitoSans') format('svg'); /* Legacy iOS */
}
/* nunito-sans-700 - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Nunito Sans';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/nunito-sans-v15-latin/nunito-sans-v15-latin-700.eot'); /* IE9 Compat Modes */
    src: url('../fonts/nunito-sans-v15-latin/nunito-sans-v15-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/nunito-sans-v15-latin/nunito-sans-v15-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
         url('../fonts/nunito-sans-v15-latin/nunito-sans-v15-latin-700.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
         url('../fonts/nunito-sans-v15-latin/nunito-sans-v15-latin-700.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
         url('../fonts/nunito-sans-v15-latin/nunito-sans-v15-latin-700.svg#NunitoSans') format('svg'); /* Legacy iOS */
}
/* mulish-regular - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Mulish';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/mulish-v13-latin/mulish-v13-latin-regular.eot'); /* IE9 Compat Modes */
    src: url('../fonts/mulish-v13-latin/mulish-v13-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/mulish-v13-latin/mulish-v13-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
         url('../fonts/mulish-v13-latin/mulish-v13-latin-regular.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
         url('../fonts/mulish-v13-latin/mulish-v13-latin-regular.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
         url('../fonts/mulish-v13-latin/mulish-v13-latin-regular.svg#Mulish') format('svg'); /* Legacy iOS */
}
/* mulish-700 - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Mulish';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/mulish-v13-latin/mulish-v13-latin-700.eot'); /* IE9 Compat Modes */
    src: url('../fonts/mulish-v13-latin/mulish-v13-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/mulish-v13-latin/mulish-v13-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
         url('../fonts/mulish-v13-latin/mulish-v13-latin-700.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
         url('../fonts/mulish-v13-latin/mulish-v13-latin-700.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
         url('../fonts/mulish-v13-latin/mulish-v13-latin-700.svg#Mulish') format('svg'); /* Legacy iOS */
}

/* saira-condensed-regular - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Saira Condensed';
font-style: normal;
font-weight: 400;
src: url('../fonts/saira-condensed/saira-condensed-v11-latin-regular.eot'); /* IE9 Compat Modes */
src: url('../fonts/saira-condensed/saira-condensed-v11-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/saira-condensed/saira-condensed-v11-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
        url('../fonts/saira-condensed/saira-condensed-v11-latin-regular.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
        url('../fonts/saira-condensed/saira-condensed-v11-latin-regular.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
        url('../fonts/saira-condensed/saira-condensed-v11-latin-regular.svg#SairaCondensed') format('svg'); /* Legacy iOS */
}
/* saira-condensed-500 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Saira Condensed';
font-style: normal;
font-weight: 500;
src: url('../fonts/saira-condensed/saira-condensed-v11-latin-500.eot'); /* IE9 Compat Modes */
src: url('../fonts/saira-condensed/saira-condensed-v11-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/saira-condensed/saira-condensed-v11-latin-500.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
        url('../fonts/saira-condensed/saira-condensed-v11-latin-500.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
        url('../fonts/saira-condensed/saira-condensed-v11-latin-500.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
        url('../fonts/saira-condensed/saira-condensed-v11-latin-500.svg#SairaCondensed') format('svg'); /* Legacy iOS */
}
/* saira-condensed-600 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Saira Condensed';
font-style: normal;
font-weight: 600;
src: url('../fonts/saira-condensed/saira-condensed-v11-latin-600.eot'); /* IE9 Compat Modes */
src: url('../fonts/saira-condensed/saira-condensed-v11-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/saira-condensed/saira-condensed-v11-latin-600.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
        url('../fonts/saira-condensed/saira-condensed-v11-latin-600.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
        url('../fonts/saira-condensed/saira-condensed-v11-latin-600.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
        url('../fonts/saira-condensed/saira-condensed-v11-latin-600.svg#SairaCondensed') format('svg'); /* Legacy iOS */
}
/* saira-condensed-700 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Saira Condensed';
font-style: normal;
font-weight: 700;
src: url('../fonts/saira-condensed/saira-condensed-v11-latin-700.eot'); /* IE9 Compat Modes */
src: url('../fonts/saira-condensed/saira-condensed-v11-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/saira-condensed/saira-condensed-v11-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
        url('../fonts/saira-condensed/saira-condensed-v11-latin-700.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
        url('../fonts/saira-condensed/saira-condensed-v11-latin-700.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
        url('../fonts/saira-condensed/saira-condensed-v11-latin-700.svg#SairaCondensed') format('svg'); /* Legacy iOS */
}


/*** GLOBAL SELECTORS ***/
a{color:#000;transition: .2s linear;}
img { max-width: 100%; width: 100%; height: 100%;}
/*Main COntent*/
.container{ width:100%; margin:0 auto;}

.bookingForm .container{ display: flex; align-items: flex-start; flex-flow: row nowrap; height: 100vh; overflow: hidden;}
.bookingForm :is(.leftsec, .rightsec){ width: 50%; height: inherit; position: relative;}
.bookingForm .leftsec .logo{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: rgba(255, 255, 255, .9); border-radius: 50%; width: 300px; height: auto; aspect-ratio: 1/1; display: grid; place-items: center;}
.bookingForm .leftsec .logo img{ height: auto; width: 200px;}
.bookingForm .rightsec{ padding: 20px 25px; overflow-y: scroll; box-sizing: border-box; height: max(600px, 100%);}
.bookingForm .rightsec .innerRhtsec{ width: min(800px, 100%); height: 100%;}
.bookingForm .rightsec.successsec .innerRhtsec {text-align: center; position: relative;}
.bookingForm .rightsec.successsec .footer {position: absolute; left: 0; right: 0; bottom: 0;}
.bookingForm .rightsec h1.title{ font-size: 28px; font-weight: 700; font-family: 'Mulish', sans-serif; color: #000; padding: 2.5% 0;}
.bookingForm .rightsec form{ height: calc(100% - 117px);}
.bookingForm .rightsec form ul{ display: flex; flex-flow: row wrap; justify-content: space-between; align-items: flex-start; gap: 20px 3%; padding: 15px 0 20px; border-top: 1px dashed #ccc;}
.bookingForm .rightsec form ul li{ width: 48.5%; position: relative;}
.bookingForm .rightsec form ul li.full{ width: 100%;}
.bookingForm .rightsec form ul li.slot{ padding: 25px 0; border-top: 1px solid #989898; border-bottom: 1px solid #989898;}
.bookingForm .rightsec form ul li label, .clubbookingForm :is(#club-form, #rider-form-submit) label.form-label{ font-size: 15px; font-weight: 400; color: #000; margin-bottom: 8px; display: block;}
.bookingForm .rightsec form ul li :is(input, select, textarea), .clubbookingForm :is(#club-form, #rider-form-submit) :is(input, select, textarea){ padding: 12px; background: #F2F2F2; color: #000; width: 100%; box-sizing: border-box; border: none; outline: none; border-radius: 5px; position: relative; font-size: 14px; font-weight: 400; font-family: 'Nunito Sans', sans-serif;}
.bookingForm .rightsec form ul li :is(input, textarea)::placeholder, .clubbookingForm :is(#club-form, #rider-form-submit) :is(input, textarea)::placeholder{ color: #7E7E7E;}
.bookingForm .rightsec form ul li span.selField, .clubbookingForm :is(#club-form, #rider-form-submit) span.selField{ position: relative; display: block; background: #F2F2F2; border-radius: 12px;}
.bookingForm .rightsec form ul li span.selField::after, .clubbookingForm :is(#club-form, #rider-form-submit) span.selField::after{ content: ""; position: absolute; right: 15px; top: 50%; transform: translateY(-50%); background: url(../images/dropdown.png) no-repeat; background-size: contain; width: 16px; height: 9px;}
.bookingForm .rightsec form ul li span.selField select, .clubbookingForm :is(#club-form, #rider-form-submit) span.selField select{ appearance: none; background: transparent; z-index: 1; color: #7E7E7E; padding-right: 40px;}
.bookingForm .rightsec form ul li select option.selected{ color: #000;}
.bookingForm .rightsec form ul li button[type='button'], .clubbookingForm :is(#club-form, #rider-form-submit) button.btn-success{ color: #fff; background: #6B8CCE; font-size: 18px; line-height: 100%; font-weight: 700; padding: 10px; min-width: 200px; border-radius: 50px; outline: none; border: none; cursor: pointer; transition: all .3s linear;}
.bookingForm .rightsec form ul li button[type='button']:hover, .clubbookingForm :is(#club-form, #rider-form-submit) button.btn-success:hover{ background: #4b68a3;}
/* .bookingForm .rightsec form ul li span.telField input{ padding-left: 75px;} */
.bookingForm .rightsec form ul li span.telField{ position: relative;}
.bookingForm .rightsec form ul li span.telField .selField{ position: absolute; top: 50%; transform: translateY(-50%); left: 10px; z-index: 1; border-right: 1px solid #000; padding-right: 10px; border-radius: 0;}
.bookingForm .rightsec form ul li span.telField .selField::after{ right: 7px; width: 12px; height: 6px;}
.bookingForm .rightsec form ul li span.telField #telcode{ font-size: 14px; font-weight: 400; color: #000; width: 45px; padding: 0 5px; z-index: 1;}

.bookingForm .rightsec .footer{ padding-top: 16px; border-top: 1px solid #BBBBBB;}
.bookingForm .rightsec .footer :is(p, a){ font-size: 13px; font-weight: 400; color: #999; margin: 0;}
.bookingForm .rightsec .footer a:hover{ color: #1199d2;}

header h1.h4{ font-size: 22px; color: #fff; font-weight: 500; margin-bottom: 0;}
header h1.h4+nav a{ font-size: 15px; color: #fff; font-weight: 400;}
footer p{ font-size: 15px; color: #fff; font-weight: 400; margin-bottom: 0;}

.clubbookingForm .container{ height: 100vh; padding: 0 !important; max-width: unset;}
.clubbookingForm .leftsec{ width: 50%; height: 100%; background-size: cover;}
.clubbookingForm .leftsec.clubleftsec{ width: 50%; height: 100%; background: url(../images/new-rider-banner.jpg); background-size: cover;}
.clubbookingForm .leftsec img{ object-fit: cover; object-position: bottom;}
.clubbookingForm .rightsec{ width: 50%; height: max(480px, 100%); overflow-y: scroll;}

.clubbookingForm :is(#club-form, #rider-form-submit) :is(input, select, textarea){ box-shadow: none;}
.clubbookingForm :is(#club-form, #rider-form-submit){ border-top: 1px dashed #ccc; padding: 20px 0; height: unset; width: min(800px, 100%);}
.clubbookingForm :is(#club-form, #rider-form-submit) .row{ gap: 20px 0;}
.clubbookingForm :is(#club-form, #rider-form-submit) .row .btnSec{ display: flex; justify-content: flex-start; flex-flow: row nowrap; gap: 20px; align-items: flex-start;}
.clubbookingForm :is(#club-form, #rider-form-submit) .row .btnSec .btn{ width: 50%; background: #31b0e5; font-size: 16px; color: #fff; border: none; outline: none; padding: 10px 0;}
.clubbookingForm :is(#club-form, #rider-form-submit) .row .btnSec .btn#add-moderator {background: #ff8d00; color: #000;}
.clubbookingForm :is(#club-form, #rider-form-submit) .row .btnSec .btn#add-founder {background: #227dc5;}
.clubbookingForm :is(#club-form, #rider-form-submit) #moderator-container .row .btn.remove-moderator, .clubbookingForm :is(#club-form, #rider-form-submit) #founder-container .row .btn.remove-founder{ background: #31b0e5; font-size: 14px; color: #fff; border: none; outline: none; padding: 5px 10px; transition: 0.3s ease;}
.clubbookingForm :is(#club-form, #rider-form-submit) #moderator-container .row .btn.remove-moderator {background: #ff8d00;}
.clubbookingForm :is(#club-form, #rider-form-submit) #moderator-container .row .btn.remove-moderator:hover, .clubbookingForm :is(#club-form, #rider-form-submit) .row .btnSec .btn#add-moderator:hover {background: #ff7d1f;}
.clubbookingForm :is(#club-form, #rider-form-submit) #founder-container .row .btn.remove-founder:hover, .clubbookingForm :is(#club-form, #rider-form-submit) .row .btnSec .btn#add-founder:hover {background: #0f95cc;}
.clubbookingForm :is(#club-form, #rider-form-submit) #moderator-container .row+.row{ margin-top: 20px;}
.clubbookingForm :is(#club-form, #rider-form-submit) #founder-container .row+.row{ margin-top: 20px;}
.clubbookingForm :is(#club-form, #rider-form-submit) .invalid-feedback{ margin-top: 5px; font-size: 12px;}

.clubbookingForm #rider-form-submit input[type='radio']{ width: unset; display: inline-block; vertical-align: middle;}
.clubbookingForm #rider-form-submit label[for="rider-terms-condition"] input#rider-terms-condition{ width: unset;}
.clubbookingForm #rider-form-submit #submit-btn{ color: #fff; background: #6B8CCE; font-size: 18px; line-height: 100%; font-weight: 700; padding: 10px; min-width: 200px; border-radius: 50px; outline: none; border: none; cursor: pointer; transition: all .3s linear; margin-top: 20px;}
.clubbookingForm #rider-form-submit #submit-btn:hover{ background: #4b68a3;}
.clubbookingForm #rider-form-submit .select2-container--default .select2-selection--single{ background-color: none !important; border: none; border-radius: 0; height: 100%;}
.clubbookingForm #rider-form-submit #clubList span.selField::after{ display: none;}
.clubbookingForm #rider-form-submit #clubList small{ margin-top: 5px; display: block;}
.clubbookingForm #rider-form-submit .select2-container--default .select2-selection--single .select2-selection__arrow{ position: absolute; right: 15px; top: 50%; transform: translateY(-50%); background: url(../images/dropdown.png) no-repeat; background-size: contain; width: 16px; height: 9px;}
.clubbookingForm #rider-form-submit .select2-container--default .select2-selection--single .select2-selection__arrow b{ display: none;}
.clubbookingForm #rider-form-submit .select2-container--default .select2-selection--single .select2-selection__rendered{ padding: 15px; background: #F2F2F2; color: #000; width: 100%; box-sizing: border-box; border: none; outline: none; border-radius: 12px; position: relative; font-size: 14px; font-weight: 400; font-family: 'Nunito Sans', sans-serif; line-height: 100%;}
.clubbookingForm #rider-form-submit .select2-container--default .select2-selection--single .select2-selection__clear{ position: absolute; top: 50%; transform: translateY(-50%); right: 40px; font-size: 20px; line-height: 100%;}

.clubbookingForm .rightsec{ display: grid; place-items: center;}
.clubbookingForm .rightsec.clubrightsec .inrclubrhtsec{ width: min(800px, 100%);}

/* .clubbookingForm .rightsec.successsec .innerRhtsec{ height: fit-content;} */
.clubbookingForm .rightsec.successsec .innerRhtsec .thanksec{ height: calc(100% - 130px); display: flex; justify-content: flex-start; flex-flow: column;}
.clubbookingForm .rightsec.successsec .thanksec h2{ color: #31b0e5; font-weight: 600; margin-bottom: 20px;}
.clubbookingForm .rightsec.successsec .thanksec p{ color: #000; margin-bottom: 0;}
.clubbookingForm .rightsec.successsec .thanksec p + p {margin: 10px 0 0;}
.clubbookingForm .rightsec.successsec .thanksec a {font-size: 18px; color: #31b0e5; text-decoration: underline; transition: 0.3s ease;}
.clubbookingForm .rightsec.successsec .thanksec a:hover {color: #000;}

/* #moderator-container */
.clubbookingForm #moderator-container .row {background: #ff8d0021; padding: 20px 10px; border: 1px dashed #ff8d00; border-radius: 10px; box-sizing: border-box; margin: 0;}
.clubbookingForm :is(#moderator-container, #founder-container) .row .col-md-6 {width: 33.3%; padding: 0 5px;}
.clubbookingForm :is(#moderator-container, #founder-container) .row .col-md-12 {margin: 0 !important; padding: 0 5px;}
.clubbookingForm #moderator-container .row :is(input, select, textarea) {background: #fff; border: 1px solid #ffcd91; border-radius: 5px; padding: 10px 15px;}

/* #founder-container */
.clubbookingForm #founder-container :is(input, select, textarea)::placeholder{ color: #6f6e6e;}
.clubbookingForm #founder-container .row {background: #0096c71a; padding: 20px 10px; border: 1px dashed #0096c7; border-radius: 10px; box-sizing: border-box; margin: 0;}
.clubbookingForm #founder-container .row :is(input, select, textarea) {background: #fff; border: 1px solid #0096c7; border-radius: 5px; padding: 10px 15px;}

/* thank-you-page */
.rightsecwrap {text-align: center; max-width: 620px;}
.rightsec p {font-size: 18px; font-weight: 500; color: #000;}
.rightsec p + p {margin-top: 5px;}
.successful_check_section p {font-weight: 600; font-size: 22px;}
.successful_check_section .imgbox {text-align: center;}
.successful_check_section .imgbox svg {fill: #16be01; width: 90px;}
.qr_section {margin: 20px 0 20px; text-align: center;}
.qr_section ul {display: flex; flex-wrap: wrap; justify-content: center; gap: 30px; margin-top: 20px;}
.qr_section ul li {background: #2bb6f052; padding: 10px; box-sizing: border-box; max-width: 248px; border-radius: 5px; border: 1px solid #2bb6f0;}
.qr_section ul li .imgbox {margin: 5px 0 10px 0; padding: 0 15px;}
.qr_section ul li p {font-weight: 600;}
.qr_section ul li a {padding: 10px 15px; display: inline-block; background: #000; font-size: 16px; color: #fff; border-radius: 5px; font-weight: 500; transition: 0.3s ease;}
.qr_section ul li a:hover {background: #0e82b3; color: #fff;}
.notesection p {font-style: italic; font-size: 15px;}
h4 {font-size: 18px; font-weight: 800; color: #000; margin: 10px 0 0;}
p.description {font-size: 16px; text-align: center;}

.socialsection {display: flex; flex-wrap: wrap; align-items: center; gap: 25px; margin: 10px 0; justify-content: center;}
.socialsection ul {display: flex; flex-wrap: wrap;  gap: 25px; align-items: center;}
.socialsection ul li a {display: block; background: url(https://leh.ridersrally.com/wp-content/themes/leh_expedidation_wp/assets/images/socialimg.png) no-repeat 0 0; width: 44px; height: 44px;}
.socialsection ul li a.insta {background-position: 0 0;}
.socialsection ul li a.fb {background-position: -58px 0;}
.socialsection ul li a.yt {background-position: -115px 0; width: 49px;}
.socialsection ul li a.whatsappsec {display: block; width: 48px; height: 48px; background: #32d951; border-radius: 50%; padding: 5px; box-sizing: border-box;}
.socialsection a:hover {opacity: 0.8;}
/* thank-you-page end */

.clubbookingForm .row .col-md-6.radioSec #clubList .col-md-6 {width: 100% !important;}
.clubbookingForm .row .col-md-6.radioSec #clubList .col-md-6 .select2-container {width: 100% !important;}
.clubbookingForm .row .col-md-12.radioSec .col-md-6 .pillon_checkbx {display: flex !important; gap: 5px;}
.clubbookingForm .row .col-md-12.radioSec .col-md-6 .pillon_checkbx input {display: flex !important; width: 13px !important;}
.darktheme { background:#1E1E1E}

.clubbookingForm .darktheme :is(#club-form, #rider-form-submit) label.form-label{ color:#fff; font-family:"Saira Condensed", serif; font-size:20px;}
.clubbookingForm .darktheme :is(#club-form.clubform_popup) label.form-label {color: #000; font-size: 18px;}
.clubbookingForm :is(#club-form.clubform_popup) .row {gap: 0;}
.clubbookingForm :is(#club-form.clubform_popup) {border: 0;}
.clubbookingForm :is(#club-form.clubform_popup) button#add-moderator-in-modal {background: #ff8d00; color: #000; border: 0;}
.clubbookingForm :is(#club-form.clubform_popup) button#add-moderator-in-modal:hover {background: #ff7d1f;}
.clubbookingForm :is(#club-form.clubform_popup) button#add-founder-in-modal {background: #227dc5; color: #fff; border: 0;}
.clubbookingForm .clubform_popup :is(#founder-container) {margin-top: 20px;}
.clubbookingForm :is(#club-form.clubform_popup) button#add-founder-in-modal:hover {background: #0f95cc;}
.clubbookingForm :is(#club-form.clubform_popup) .mb-3.btninfowarning {margin: 20px 0 0;}

.clubbookingForm .darktheme :is(#club-form, #rider-form-submit) button.btn-success, .clubbookingForm .darktheme #rider-form-submit #submit-btn{font-size: 30px; font-weight: 600; color: #fff; padding: 12px 55px; border-radius: 50px; transition: 0.3s linear; position: relative; background: #009343; text-transform: uppercase; border: 1px solid #009343; font-family:"Saira Condensed", serif;}
.bookingForm .rightsec.darktheme h1.title{  color: #009343; font-family:"Saira Condensed", serif; text-transform:uppercase; font-size:40px; letter-spacing:1px;} 
.clubbookingForm .darktheme :is(#club-form, #rider-form-submit) :is(input, select, textarea), 
.clubbookingForm .darktheme :is(#club-form, #rider-form-submit) span.selField select{font-family:"Saira Condensed", serif; font-size:18px; margin-bottom:5px; /*background:#444; color:#fff*/}
 .clubbookingForm .darktheme .radioSec label{color:#fff; font-family:"Saira Condensed", serif; font-size:18px;}
.clubbookingForm .darktheme #rider-form-submit input[type="radio"], .clubbookingForm .darktheme .radioSec  input[type="radio"], .clubbookingForm .darktheme .radioSec  #toggleFields{ margin-right:10px; vertical-align:1px; width:auto}
.clubbookingForm .darktheme .row .col-md-12.radioSec .col-md-6 .pillon_checkbx input, .clubbookingForm .darktheme #rider-form-submit label[for="rider-terms-condition"] input#rider-terms-condition{ width:18px !important}
	
.clubbookingForm .darktheme #rider-form-submit #clubList small{ color:#ccc}
.clubbookingForm .darktheme #rider-form-submit .select2-container--default .select2-selection--single .select2-selection__rendered,
.clubbookingForm .darktheme .select2-container--default .select2-selection--single .select2-selection__placeholder {font-family:"Saira Condensed", serif; font-size:18px; }

.clubbookingForm .darktheme .pricebox{ color:#fff; border-top:solid 2px #009343; border-bottom:solid 2px #009343; padding:20px; font-family:"Saira Condensed", serif; font-size:34px; margin:10px 0px; font-weight:600;}
.clubbookingForm .darktheme .pricebox #gstamount{ font-size:16px; font-weight:400}

.clubbookingForm .darktheme.thankyoupg .imgbox{ margin-bottom:20px;}
.clubbookingForm .darktheme.thankyoupg .successful_check_section h3{ font-family:"Saira Condensed", serif; color:#009343; font-size:28px; font-weight:600; margin-bottom:20px;}
.clubbookingForm .darktheme.thankyoupg p{color:#fff; font-family:"Saira Condensed", serif; font-size:20px;}
.clubbookingForm .darktheme.thankyoupg .meetupsection{ background:#151c1f; border:1px dashed #666; font-family:"Saira Condensed", serif; text-align:left; margin: 40px 0px 20px}
.clubbookingForm .darktheme.thankyoupg .meetupsection .padd{ padding:20px;}
.clubbookingForm .darktheme.thankyoupg .meetupsection h4{font-size:22px; font-weight:600; color:#009343; margin:0px 0px 10px;}
.clubbookingForm .darktheme.thankyoupg .meetupsection p{ padding:0; color:#fff; line-height:28px; font-size:18px;}
.clubbookingForm .darktheme.thankyoupg .meetupsection p + p{margin:15px 0px 0px;}
.clubbookingForm .darktheme.thankyoupg .meetupsection a{color:#009343; font-weight:bold; text-decoration:none}
.clubbookingForm .darktheme.thankyoupg .meetupsection h5{background: #000; border-top: 1px dashed #666; color: #fff; font-size: 22px; padding: 10px 15px; font-weight: 400; margin:0 }
.clubbookingForm .darktheme.thankyoupg .meetupsection h5 span {color:#009343; font-weight:600}


.darktheme .qr_section {margin: 20px 0 20px; text-align: center;}
.darktheme .qr_section ul {display: flex; flex-wrap: wrap; justify-content: center; gap: 30px; margin-top: 20px;}
.darktheme .qr_section ul li {border: dashed 1px #7d7d7d; background:none; border-radius: 10px; padding:20px; box-sizing: border-box; max-width: 248px;}
.darktheme .qr_section ul li .qrimgbox {margin: 5px 0 15px 0; padding:8px; background:#fff; border-radius:10px;}
.darktheme .qr_section ul li p {font-weight: 600; }
.darktheme .qr_section ul li a {padding: 10px 15px; font-family:"Saira Condensed", serif; display:block; background: #009343; font-size: 20px; color: #fff; border-radius: 30px; font-weight: 600; transition: 0.3s ease;
  text-align: center;}
.darktheme .qr_section ul li a:hover {background: #007736; color: #fff;}
.clubbookingForm .darktheme.thankyoupg .notesection p{ font-size:16px}
.clubbookingForm .darktheme.thankyoupg .description{ line-height:32px;}
.clubbookingForm .darktheme.thankyoupg .description a{ color:#009343;}
.clubbookingForm .darktheme.thankyoupg .description a:hover{ text-decoration:underline}
.clubbookingForm .darktheme.thankyoupg .whatsappchannel{ padding:0px 0px 20px;}
.clubbookingForm .darktheme.thankyoupg .whatsappchannel img{ width:auto}

/* termsModal */
#termsModal {font-family: "Saira Condensed", serif;}
#termsModal .modal-header h2 {color: #000;}
#termsModal h3 {font-family: "Saira Condensed", serif; font-size: 18px; color: #000; margin: 15px 0 8px;}
#termsModal p, #termsModal ul li, #termsModal ol li {font-size: 16px; color: #000; line-height: 24px; font-weight: 400; margin: 0 0 5px;}
#termsModal .modal-dialog {width: 800px; background: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: inherit; margin: 0;}
#termsModal .modal-dialog .modal-content {border: 0;}
#termsModal .modal-dialog .modal-body {height: 400px; overflow: hidden; overflow-y: scroll; border: 0;}
#termsModal .modal-dialog .modal-footer {justify-content: center; padding: 10px 0;}
#termsModal .modal-dialog .modal-footer #agreeButton {text-transform: uppercase; font-size: 20px; font-weight: 500; padding: 6px 45px; box-sizing: border-box; letter-spacing: 0.5px; background: #009343; border: 1px solid #009343;}
#termsModal .modal-dialog .modal-footer #agreeButton:hover {background: #02813c;}


#termsModal ::-webkit-scrollbar {width: 5px;}
#termsModal ::-webkit-scrollbar-track {background: #dee2e6;}
#termsModal ::-webkit-scrollbar-thumb {background: #009343;}      
#termsModal ::-webkit-scrollbar-thumb:hover {background: #035e2c;}

.meetupsection ul.couponcode_section {display: flex; flex-wrap: wrap; margin-left: -1.33%;}
.meetupsection ul.couponcode_section li {width: 32%; margin-left: 1.33%; background: #f1f7ff; margin-top: 1.33%; box-sizing: border-box; border-radius: 5px; display: flex; flex-wrap: wrap; font-size: 20px; font-weight: 500; overflow: hidden;}
.meetupsection ul.couponcode_section li .coupontxt {width: 55px; padding: 20px 10px; display: grid; place-content: center; font-size: 22px; color: #ffffff; background: #009343b0; font-weight: 700; border-right: 2px dotted #0964338a; }
.meetupsection ul.couponcode_section li .couponcode {width: calc(100% - 55px); padding: 5px 10px; display: grid; color: #000; font-size: 20px; text-align: center; }
.meetupsection ul.couponcode_section li .couponcode span {font-size: 22px; margin-top: 5px; font-weight: 600;}

/* check In Page */
.check-in-info{ width: min(400px, 92%); margin: 0 auto;  font-family: "Saira Condensed", serif; padding: 20px; background: #cff1ff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 5px;}
.check-in-info h3{ color: #000; font-size: 36px; font-weight: 600; text-align: center; margin-bottom: 25px; padding-bottom: 15px; border-bottom: 1px solid #000;}
.check-in-info p{ font-size: 20px; color: #000; line-height: 28px; margin-bottom: 10px;}
.check-in-info #gameCheckIn, .check-in-info #checkInButton{ width: 100%; background: #31b0e5; border: none; margin: 30px auto 0; font-size: 22px; font-weight: 600; max-width: 250px; display: block;}
.check-in-info #gameCheckIn:hover, .check-in-info #checkInButton:hover{ background: #1f93c3;}
.check-in-info .already-checking{ color: #1e9acd; font-weight: 600;}

/* Responsive */
@media only screen and ( max-width: 1291px ) {
}
@media only screen and ( max-width: 800px ) {
.bookingForm .container{ height: unset; flex-flow: column wrap;}
.bookingForm :is(.leftsec, .rightsec){ width: 100%;}
.bookingForm .rightsec .innerRhtsec, .clubbookingForm :is(#club-form, #rider-form-submit){ width: min(800px, 98%); margin: 0 auto;}
.bookingForm .leftsec{ height: 250px; background: url(../images/bookingpg-banner.png) no-repeat; background-position-y: 60%;}
.clubbookingForm :is(#club-form, #rider-form-submit) .col-md-6{ width: 50% !important;}
.clubbookingForm :is(#club-form, #rider-form-submit) .row .btnSec .btn#add-moderator, .clubbookingForm :is(#club-form, #rider-form-submit) .row .btnSec .btn#add-founder{ width: 48.5%;}
.clubbookingForm :is(#moderator-container, #founder-container) .row .col-md-6 {width: 33.33% !important;}
.clubbookingForm .leftsec.clubleftsec {width: 100%; height: 250px; background-position-y: 60%}
.bookingForm .leftsec .logo{ width: 200px;}
.bookingForm .leftsec .logo img{ width: 120px;}
.clubbookingForm .rightsec.successsec .innerRhtsec .thanksec {height: unset; display: block; max-width: 600px; margin: 0 auto;}
.clubbookingForm .rightsec.successsec {display: block; height: 100%; overflow: unset;}
.bookingForm .rightsec.successsec .footer {position: relative; margin-top: 50px;}
.clubbookingForm .rightsec.successsec .thanksec h2 {font-size: 24px;}
#termsModal .modal-dialog {width: 96%;}
.clubbookingForm .leftsec.clubleftsec{ display: none;}
}

@media only screen and ( max-width: 600px ) {
.bookingForm .rightsec {padding: 20px 15px;}
/* #termsModal .modal-dialog {top: 2%; bottom: 2%; left: 50%; transform: translateX(-50%);} */
}
@media only screen and ( max-width: 568px ) {
.meetupsection ul.couponcode_section {margin-left: -2%;}
.meetupsection ul.couponcode_section li {width: 48%; margin-left: 2%; margin-top: 2%;}
}
@media only screen and ( max-width: 480px ) {
.bookingForm .leftsec, .clubbookingForm .leftsec.clubleftsec{ height: 150px;}
.bookingForm .leftsec .logo{ width: 120px;}
.bookingForm .leftsec .logo img{ width: 80px;}
.bookingForm .rightsec form ul{ flex-flow: column wrap;}
.bookingForm .rightsec form ul li{ width: 100%;}
.bookingForm .rightsec form ul li button[type='button'], .clubbookingForm :is(#club-form, #rider-form-submit) button.btn-success{ width: 100%;}
.clubbookingForm :is(#club-form, #rider-form-submit) .col-md-6{ width: 100% !important;}
.clubbookingForm :is(#club-form, #rider-form-submit) .col-md-6.radioSec>.row .col-md-6{ width: initial !important;}
.clubbookingForm :is(#moderator-container, #founder-container) .row .col-md-6 {width: 100% !important;}
.clubbookingForm :is(#moderator-container, #founder-container) .row {gap: 15px 0;}
.bookingForm .rightsec form ul li :is(input, select, textarea), .clubbookingForm :is(#club-form, #rider-form-submit) :is(input, select, textarea), .bookingForm .rightsec form ul li span.selField, .clubbookingForm :is(#club-form, #rider-form-submit) span.selField {border-radius: 5px;}
} 
@media only screen and ( max-width: 415px ) {
.meetupsection ul.couponcode_section li .coupontxt {width: 45px; padding: 10px;}
.meetupsection ul.couponcode_section li .couponcode {width: calc(100% - 45px); font-size: 18px;}
.meetupsection ul.couponcode_section li .couponcode span {font-size: 20px;}
}
@media only screen and ( max-width: 384px ) {
.clubbookingForm :is(#club-form, #rider-form-submit) .row .btnSec {gap: 0 10px;}
.clubbookingForm .rightsec.successsec .thanksec h2 {font-size: 22px;}
}
@media only screen and ( max-width: 360px ) {
#termsModal .modal-header h2 {font-size: 22px;}
.meetupsection ul.couponcode_section {justify-content: center;}
.meetupsection ul.couponcode_section li {width: 65%; margin-left: 0;}
}
