:root{
    --primary-color:#002b60;
    --secondary-color:#001d41;
    --blue-color:#00B4D5;
    --pink-color:#ec407a;
}
*{ 
    font-family: 'DM Sans', sans-serif; font-size:15px; line-height:29px; 
}
input[type="text"], input[type="tel"], input[type="email"], input[type="password"], select, textarea{
    font-family: 'DM Sans', sans-serif;
}
img{
    max-width:100%;
    height:auto;
}
.alert{
    width:100%;
}
#already_err{
    color: #ff0000;
}
.parsley-errors-list {
    list-style-type: none;
    padding-left: 0;
    padding-top: 8px;
    margin-bottom: 0;
    color: #ff0000;
}
.custom-btn{
    display: inline-block;
    background-color: var(--blue-color);
    color:#ffffff;
    width:200px;
    padding:10px;
    text-align:center;
    text-transform:uppercase;
    border-radius:5px;
    margin-top:15px;
    cursor: pointer;
}
.success-message{
    background: #cfeecf;
    border: 1px solid green;
    color: #000;
    padding: 5px 10px;
    display: block;
    margin-top: 20px;
}
.custom-btn:hover{
    background-color:var(--pink-color);
    color:#ffffff;
}
.secondary-btn{
    background-color:var(--pink-color);
}
.secondary-btn:hover{
    background-color: var(--blue-color);
}
@media (min-width: 1200px){ 
    .container, .container-lg, .container-md, .container-sm, .container-xl { 
        max-width: 1200px!important; 
}}
.font-bold{
    font-weight: 700;
}
a{
    text-decoration:none!important;
}
.heading-font{
    font-size:26px;
}
@media (max-width: 768px){
    .heading-font{
        font-size:24px!important;
    }
}
/* ----------------header---------------- */
.cart-menu img{ margin-right:5px; }
.header{
    background-color:#ffffff;
    height:105px;
}
.header ul{
    display: flex;
    align-items: baseline;
    list-style-type:none;
    margin-bottom:0;
    padding-left:0;
}
.header ul li{
    margin:0 10px;
}
.header ul li a{
    color: #000000;
    text-transform:uppercase;
    font-weight:500;
    padding:0 5px;
}
.header ul li a:hover{
    color:var(--blue-color); 
}
.header1 ul{
    justify-content: flex-end;
    margin-right:30px;
}
.header2 ul{
    justify-content: flex-start;
    margin-left:30px;
}
.header .nav-button{
    background: var(--blue-color);
    color: #ffffff;
    display: inline-block;
    border-radius: 50px;
    padding:3px 12px;
    text-transform: uppercase;
    font-weight: 500;
}
.header .nav-button:hover{
    color:#fff;
    background:var(--pink-color)
}
.header .nav-button img{
    margin-right: 5px;
    margin-bottom:2px;
}
.custom-logo-link{ 
    padding:6px 5px;
    display:inline-block;
}
.nav{
    background-color: transparent;
    padding:6px;
}
.nav-main{
    display: flex;
    justify-content: space-between;
    align-items:center;
}
.nav button{
    height: 35px;
    width:35px;
    font-size:20px;    
    border-width:0;
    background-color: transparent;
    color: var(--blue-color);
}
.nav-hidden ul{
    list-style-type: none;
    line-height: 50px;    
    padding-left:0;
    margin:0;
}
.nav-hidden ul li{
    border-bottom:1px solid #eee;
}
.nav-hidden ul li a{
    color: #334155;    
    padding:10px 15px;
    display:block;
    text-transform: uppercase;
    font-weight: 500;   
}

.nav-hidden ul li a.active{
    background:#e2e8f0;
}

.member-access, .cart-icon{
    display:inline-block;
    padding:0 10px;
}

#id section{
    display: none;
}
@media (min-width: 768px) and (max-width: 1210px){
    .header1 ul{
        margin-right:0;
    }
    .header ul li{
        margin:0 5px;
    }
    .header2 ul{
        margin-left: 10px;
    }
}
@media only screen and (min-width: 992px) {
    .nav{
        display: none !important;
    }
    .nav-hidden{
        display: none;
    }   
}
@media (max-width: 992px){
.header, #demo {
    display: none;
}
.button-menu{
    margin-left: -15px;
}   
}
#demo{
    position: absolute;
    width:100%;
    background:#ffffff;
    z-index:9999;
    margin-top:10px;
    overflow: hidden;
    box-shadow: 0 2px 4px 0 rgb(0 0 0 / 17%);
}
/* ----------------footer---------------- */
.footer{
    background-color: var(--primary-color);
    padding-top:45px;
}
.footer .footer1, .footer .footer2, .footer .footer3{
    padding:15px 35px 20px;
}
.footer ul{
    list-style-type: none;
}
.footer ul li a{
    color: #fff;
    text-decoration: none;
}
.footer1 .footer-title{
    font-size: 18px;
}
.footer1 .footer-title, .footer1 p{
    color:#fff;
}
.footer1 p{
    font-size:14px;
}
.footer1 .col-2{
    width: 55px !important;
    margin-top:6px!important
}
.footer1 img{
    margin-top:5px;
}
@media (min-width: 991px){
    .footer2, .footer3{
        border-left: 1px solid #fff;
    }
}
@media (max-width: 991px){
.footer{
    padding-top:30px;
}
.footer2, .footer3{
    border-top: 1px solid #fff;
}
.footer .footer1, .footer .footer2, .footer .footer3{
    padding:30px 15px 20px;
}
.footer .footer2>div{
    text-align: left;
}
.footer .container{
    padding:0 25px;
}
}
.footer2{
    text-align: center;    
}
.footer-sociallink{
    display: flex;
    justify-content:space-between;
    margin:15px 0 10px;
    /* max-width:150px; */
    max-width: 90px;
    padding-left:0;
}
.footer-sociallink li:first-child{
    display:none;
}
.footer-sociallink li a{
    display:inline-block;
    width: 35px;
    height: 35px;
    line-height: 35px;
    font-size:18px;
    text-align: center;
    border-radius: 6px;    
    background-color: #fff;
    color:#002B60!important;
}
.footer-sociallink li a:hover{
    background:var(--pink-color);
    color:#ffffff!important;
}

.footer2 p{
    color: #fff;
    line-height: 30px;
    margin-top: 25px;
}
.footer3 .col-lg-6{  
    line-height: 40px;
}
.footer3 ul{
    padding-left:0;
}
.footer3 li{ 
    margin-bottom: 12px;
}
.footer3 a:hover{
    color: var(--blue-color);
}
.footer-copy{
    border-top: 1px solid #fff;
    text-align: center;
    color:#ffffff;
    padding:15px 0;    
}
/*Cart*/
@media (max-width: 992px){
body.cart .quantity{
    margin:0;
}
.cart .quantity{
    justify-content:start!important;
    margin-left: 20px!important;
}
}
@media (min-width: 1100px){
.cart .cart-inner .container{
    max-width:900px!important;
}
}
.cart .quantity{ display:flex; align-items:center; justify-content:end; font-weight: 600;}
.cart .quantity span:last-child{ margin-right:10px; }
.cart .quantity .price{ margin-right:10px; }
.heading-border{
    font-size:30px;
    text-align:center;
    position: relative;
    margin-bottom:45px;
}
.heading-border::before{ 
    content:"";
    position:absolute;
    background:#000;
    width:40px;
    height:2px;
    left:48.5%;
    bottom:-15px;
}

@media (max-width: 680px){
    .cart .quantity{
        flex-wrap:wrap; 
    }
}
@media (max-width: 576px){
.reverse-flexbtn{
    flex-direction: column-reverse;
}
}

@media (max-width: 992px){
    .heading-border{
        font-size:26px;
}
.heading-border::before{
    left: 45.5%;
}
.cart .product-price{
    font-size: 21px!important;
}
.cart .product-name{
    font-size: 22px!important;
}}
.cart, .cart .header, .checkout, .checkout .header{
    background:#F9FAFB; 
}
.cart .product-name{
    font-weight:700;
    font-size:23px;
}
.cart .product-price{
    font-weight:700;
    font-size:23px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.quantity .qty-no{
    position: relative; 
    width:120px;
    height:45px; 
    border:2px solid #A1A1A1;
    background-color:transparent;
    border-radius:5px;     
    display:flex; 
}
.quantity input{
    border-width:0;   
    background-color: transparent;
    text-align: center;
    width:115px;
    font-size: 16px;
    z-index:-1;
    color:#000000;
    font-weight: 600;
}
.quantity input[type=number]{
    -webkit-text-size-adjust: 100%;
}
.quantity input[type=number]::-webkit-inner-spin-button, 
.quantity input[type=number]::-webkit-outer-spin-button{ 
  -webkit-appearance: none;   
}
.quantity input[type=number] { 
    -moz-appearance:textfield; 
}
.quantity .plus, .quantity .minus{
    position:absolute; 
    top:0;   
    background-color: transparent;
    border-width: 0;
    padding: 0;
    width: 30px;
    height: 45px;
    line-height:35px;
    line-height:45px;
    font-size: 15px;
    color:#686868;
    z-index:5;
}
.quantity .plus{     
    right:0;
}
.quantity .minus{      
    left:0;  
}
@media (max-width: 768px){
    .quantity .qty-no{
        height: 30px;
        line-height:35px;
        width:100px;
    }
    .quantity input{
        width:100px;
    }
    .quantity .plus, .quantity .minus{
        height: 30px;
        line-height: 30px;
        font-size: 12px;
    }
}
.remove-product a{
    color:var(--pink-color); 
    text-transform:uppercase;
    font-weight: 500;
    font-size:13px;
    margin-top:15px;
    text-decoration:none;
}
.text-right-price{
    text-align:right;
}
.credit-point{
    font-size:14px;
    margin:-3px 0 3px;    
}
.credits-number{
    font-weight:500;
    font-size:17px;
}
.credit-price{
    font-size:15px;
}
.subtotal-label{
    font-weight:500;
    text-transform: uppercase;
}
.subtotal-price{
    font-weight:700;
    font-size:18px;
}
#card-button{
    background: var(--blue-color);
    color: #fff;
    border-width: 0;
    padding: 10px 20px;
    border-radius: 5px;
}
#card-button:hover{
    background: var(--pink-color);
}
.checkout-btn{
    text-align: right;
}
body.checkout .select2-container, body.checkout span.selection{
    padding:0!important;
}
body.checkout span.select2{
    width:100%!important;
}
body.checkout  .select2-container--default .select2-selection--single{
    border: 2px solid #E5E7EB;
    height:40px;
}
body.checkout  .select2-container--default .select2-selection--single .select2-selection__rendered{
    line-height: 35px!important;
    font-weight:400;
}
body.checkout  .select2-container--default .select2-selection--single .select2-selection__arrow{
    top: 6px!important;
}
.checkout-btn button{
    background: var(--blue-color);
    color:#fff;
    border-width:0;
    padding:10px 20px;
    border-radius:5px;
}
.checkout-btn button:hover{
    background:var(--pink-color);
}
.coupon-input{ 
    padding:5px 15px;
    border-radius:5px;
}
.coupon-field button{
    background:transparent;
    border-width:0;
    margin-left:5px;
}
.shopping-btn{   
    color: #000000;
    border-width: 0;
    padding: 10px 20px;
    border-radius: 5px;
    display:inline-block;
    text-align:center;
    border:2px solid var(--primary-color);
}
.shopping-btn:hover{
    color:#ffffff;
    background:var(--primary-color);
}
.remember-section{
    padding-bottom:20px!important;
}
.remember-section a{
    color: var(--blue-color);
}
.remember-section a:hover{
    color: var(--pink-color);
}
.rember-label {
    display: block;
    position: relative;
    padding-left:40px;    
    cursor: pointer;
    font-size:16px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
  }
  
  /* Hide the browser's default checkbox */
  .rember-label input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
  }
  
  /* Create a custom checkbox */
  .checkmark {
    position: absolute;
    top: 2px;
    left: 0;
    height: 25px;
    width: 25px;    
    border:2px solid #979797;
    border-radius:5px;
  }
  
  @media (max-width: 768px){
    .checkmark{
        top:8px!important;
    }
  }
 
  
  /* When the checkbox is checked, add a blue background */
  .rember-label input:checked ~ .checkmark {
    background-color: #00b4d5;
    border-color:#00b4d5;
  }
  
  /* Create the checkmark/indicator (hidden when not checked) */
  .checkmark:after {
    content: "";
    position: absolute;
    display: none;
  }
  
  /* Show the checkmark when checked */
  .rember-label input:checked ~ .checkmark:after {
    display: block;
  }
  
  /* Style the checkmark/indicator */
  .rember-label .checkmark:after {
    left: 9px;
    top: 5px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
  }

/*Membership*/
.membership .mem-icontitle{
    font-size: 22px;
}
.evo-membership .row{
    text-align:center;
}
.membership-img .mem-icontitle{
    max-width:200px;
    margin:5px auto 10px;        
}
.membership-img>div{
    border-right:1px solid #000;
    padding-top:30px;
    padding-bottom:15px;    
}
.membership-img>div:last-child{
    border-width:0;
}
.presale-offer-section{    
    padding:40px 0 45px 0;
}
@media (min-width: 768px){
    .membership-img{
        margin-top:30px!important;
    }
}
@media (max-width: 767px){
.membership-img>div{
    border-right-width:0;
    border-bottom:1px solid #000;        
}
}
.credit-offer-box{
    background-color:#f8f8f4;
    border-radius:5px;
    text-align:center;
    padding:50px 15px 30px 15px;
    position: relative;
}
.credit-offer-box .offer-tag{
    position:absolute;
    top:-23px; 
    right:20px;
}
.credit-offer-box .pack-title{
    font-size: 20px;
    margin-top: 18px;
}
.credit-offer-box .pack-price{
    font-size:45px;
    display:flex;
    justify-content:center;
    margin:15px 0 5px;
}
.credit-offer-box .pack-credit-number{
    margin-top:10px;
    font-size:17px;
    margin-bottom:5px;
}
.credit-offer-box .pack-credit-point{
    font-size: 14px;
    margin-top:-10px;
    margin-bottom:8px;
}
.credit-offer-box .pack-submit, .work-submit{
    color: #fff!important;  
    padding:5px 20px 5px 20px;
    border-radius:10px;
    font-size: 16px;
    display:inline-block;
    margin-top:20px;
    cursor: pointer;
}
.credit-offer-box .pack-submit.blue, .credit-offer-box .pack-submit.pink:hover, .work-submit.pink:hover{
    background-color: var(--blue-color);  
}
.credit-offer-box .pack-submit.blue:hover, .credit-offer-box .pack-submit.pink, .work-submit.pink{
    background-color: var(--pink-color);  
}
.second-pack .credit-offer-box{
    margin-top:60px; 
}
.how-works{
    position: relative;
    background-repeat:no-repeat;
    background-size:auto;
    background-position:right top;
    background-color:#f0f7fd;
}
.how-works .bg-white{ 
    background-color:#f0f7fd!important;
}
@media (max-width: 1300px){
    .how-works{
      background-position:140% 0%;
    }   
}
.work-section {
    counter-reset: my-sec-counter;
}
.work-section>div{
    position: relative;
    padding-left:50px;
}
.work-section ul{
    margin-top:20px;
}
.work-section li{
    position: relative;
    list-style-type:none;
    margin-left: 50px;
    margin-bottom: 25px;
    counter-increment: my-sec-counter;
    font-size:17px;
}
.work-section li::before{
    content: counter(my-sec-counter);
    position: absolute;
    background: #4a515a;
    color: #fff;
    width: 33px;
    height: 33px;
    line-height: 33px;
    text-align: center;
    left: -52px;
    top:0;
    border-radius: 50px;
    z-index: 2;
}
.work-section li::after{
    content: "";
    position: absolute;
    background: #adadad;
    width: 2px;
    height: 110%;
    top: 23px;
    left: -36px;
}
.work-section li:last-child::after{
    height: 17%;
}
.work-section>div::before{
    content: "";
    position: absolute;
    border: 1px solid var(--primary-color);
    background: #fff;
    border-radius: 50px;
    width: 20px;
    height: 20px;
    top: 4px;
    left: 10px;
    z-index: 1;
}
.work-section>div::after{
    content: "";
    position: absolute;
    background: #6E6D68;
    width: 2px;
    height: 110%;
    top: 23px;
    left:20px;
}
.work-section>div:last-child:after {
    height: 60%;
}
.contact-section{
    background:var( --secondary-color);
}
.question-title h6{
    color:#ffffff;
    font-size:18px;
}
.contact-btn{
    color: #fff;
    display: inline-block;
    background-image: none;
    margin: 0 0 0 0;
    padding: 7px 25px;
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: #00b4d5;
    border-radius:10px;
    font-size: 16px;
}
.contact-btn:hover{
    background-color: var(--blue-color);
    color:#ffffff;
}
@media (max-width: 999px){ 
    .question-title{
        margin-bottom:15px;
}
}
/*-----------------------------Checkout Start------------------------- */
.checkout input[type=radio]{
    width: 18px;
    height: 18px;
}
.back-card a{
    color: var(--blue-color);
    padding-top: 10px;
    padding-left: 5px;
}
.back-card a:hover{
    color:var(--pink-color);
}
.back-card a:hover i{
    border-color:var(--pink-color);
}
.back-card h4{
    margin-top:10px;
    font-size:22px;
}
 .back-card .arrow-left {
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    border: solid #00B4D5;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 3px;
}
.edit-address{
    background: #FFFFFF;
    box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    margin: 0 !important;
    padding: 13px;
    height: 60px;
    align-items: center;
}
.edit-address a{
    color: #D81B60;
    font-weight: 500;
}
.edit-address p{
    margin-bottom: 0;
    color: #6B7280;
    font-size: 15px;
    font-weight: 500;
}
.edit-address span{
    padding-left: 20px !important;
    font-weight: 500;
}
.address-form{
    background: #FFFFFF;
    border: 2px solid #00B4D5;
    box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    padding:20px 30px 30px 30px;
}
.address-form label{
    font-weight: 500;   
    color: #6B7280;    
}
.address-form span, .credit-card span, .google-pay span  {
    padding-left: 10px;
    font-weight: 600;
    font-size: 15px;
}
.checkout input[type="text"]{
    width:100%;
    background: #FFFFFF;
    border: 2px solid #E5E7EB;
    border-radius: 5px;
    height: 40px;
    padding:5px 10px;
}
.checkout select{
    width:100%;
    height: 40px;
    border: 2px solid #E5E7EB;
    border-radius: 5px;
    color: #6B7280;
    padding:5px 10px;
}
.checkout input[type="text"]:focus, .checkout input[type="text"]:hover, .checkout select:focus, .checkout select:hover{
    border-color:#00B4D5; 
}
.address-form button{
    border: 2px solid #E5E7EB;
    background-color: #fff;
    height: 40px;
    width:100px;
    text-align:center;
    font-weight:500;
    color: #374151;
    margin-top: 15px;
    border-radius:5px;
    text-transform:uppercase;
}
.address-form button:hover{
    background-color:var(--blue-color);
    border-color:var(--blue-color);
    color:#ffffff;
}
.address-form input[type=submit]{
    width:100px;
    background-color: var(--blue-color);    
    font-weight: 500;
    font-size: 14px;
    border-radius:5px;
    text-align: center;
    color: #FFFFFF;
    border: none;
    height: 40px;
    margin-top: 15px;
    text-transform:uppercase;
}
.address-form input[type=submit]:hover{
    background-color:var(--pink-color);
}
.payment-title{
    margin-top:40px;
    font-size:22px;
}
.payment-method{
    padding: 40px 0px;
}
.credit-card{
    background: #FFFFFF;
    border: 2px solid #00B4D5;
    box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    padding:25px 30px 25px 30px;
    margin-top:25px;
    margin-bottom: 30px;
}
.google-pay{
    padding:0 10px;
    margin-bottom:35px;
}
.google-pay-content{
    background: #FFFFFF;
    box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    margin-top: 40px !important; 
    margin-bottom: 40px; 
    padding:10px;      
}
.order-summary{
    background: #FFFFFF;
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    padding: 30px;    
}
.order-summary h4{
    font-size: 22px;
}
.order-summary .order1{
    padding-bottom: 20px;
}
.order-summary .order2{
    border-top: 1px solid #6B7280;
    padding:20px 0 10px;
}
.order-summary .evo{
    padding-bottom: 10px;
}
.order-summary .item1{
    padding-top: 20px;
    border-top: 1px solid #6B7280;
}
.order-summary  .item1 p, .order-summary  .item2 p, .order-summary  .item3 p{
    line-height: 15px;
    color: #6B7280;
    font-weight: 500;
}
.order-summary .order-button p{
    color: #6B7280;     
}
.order-summary input[type="submit"]{
    width: 100%;
    background-color: #00B4D5;    
    font-weight: 500;
    font-size: 14px;
    text-align: center;
    color: #FFFFFF;
    border: none;
    height: 40px;
    border-radius: 5px;
    text-transform:uppercase;
}
.checkout .product-name{
    font-weight:500;
    font-size:18px;
}
.checkout .product-price, .checkout .product-total{
    font-weight:500;    
}
@media (min-width: 1200px){
.checkout-inner .order-summary-main{
    position: sticky;
    top: 15px;
    height: 100%;
}
}
/*----------------------------- Checkout End------------------------- */

/*--------------Payment Sucessful Start ----------*/
.payment-box{  
    border: 2px solid #AEBCCD;
    border-radius: 10px;  
    padding: 30px;
    margin: 50px 0px;
}
.payment-head{
    text-align: center;    
}
.payment-head img{
    background-color: rgba(35, 162, 109, 0.12);
    padding: 12px;
    border-radius:50%;
}
.payment-head.alert img{
    background-color: rgb(255 213 210);
}
.payment-head .sucessful-heading{    
    font-weight: 500;
    font-size: 30px;
    color: #11C8B0;
    margin:30px 0 0;
}
.payment-head p{     
    color: #475569;
}
.aside{
    padding-top: 20px;
}
.aside-content{
    border-top: 2px dashed #E6F1FF;
    border-bottom: 2px dashed #E6F1FF;
    padding: 20px 0px;
    text-align: left;
}
@media (max-width: 999px){
    .aside-content{
        border-bottom-width: 0;
    }
    .aside-content-last{
        border-bottom-width:2px;
    }
}
.payment .label{    
    font-weight: 500;    
    color: #475569;
}
.order{
    padding: 20px 0 20px 15px;    
}
.total-list{    
    padding: 20px 0!important;
    border-bottom: 2px dashed #E6F1FF;
}
.sub-total-main{
    padding: 20px 0;
}
.dashboard button{
    width: 100%;
    background-color: var(--blue-color);    
    font-weight: 500;
    font-size: 14px;
    text-align: center;
    color: #FFFFFF;
    border: none;
    height: 40px;
    border-radius: 5px;
    text-transform:uppercase;
    margin-top:30px;
}
.dashboard button:hover{
    background-color:var(--pink-color);
}
.payment .order-heading{
    font-size:20px;
    margin-bottom:5px;
    font-weight:500;
}
.payment .product-name{
    font-size:20px;
    font-weight: 500;
}
.payment .credit-point{
    margin-bottom:-5px;
}
.payment .order-total{
    font-weight:600;
    font-size:19px;
}
/*--------------Payment Sucessful End ----------*/

/*-------------------Login---------------------*/
.account-width {
	background-color: #fff;
	border-radius: 10px;
  	box-shadow: 0 14px 28px rgba(0,0,0,0.15);
	position: relative;
	overflow: hidden;
	width: 768px;
	max-width: 100%;
	min-height: 510px;
    margin:0 auto;
}
.account-width h1{
    text-align: center;
    font-size: 21px;
}

.account-width form{
    background:#ffffff;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.account-width input[type="text"], .account-width input[type="email"], .account-width input[type="password"], .account-width input[type="tel"], .forgetpassword input[type="email"], .forgetpassword input[type="number"], .forgetpassword input[type="text"], .forgetpassword input[type="password"]{
    width: 100%;   
    height:40px;
    border:2px solid #BEBEBF;
    padding:5px 10px;
    border-radius:5px;
}
.account-width label{
    display: block;
}
.forget-pwd{
    color:var(--primary-color);
}
.forget-pwd:hover{
    color:var(--pink-color);
}
.account-width .signin-btn, .account-width .signup-btn, .forgetpassword button.forget-submit{
    width:100%;
    border-width:0;
    background-color:var(--blue-color);
    color:#ffffff;
    padding:7px 10px;
    border-radius:5px;
    text-transform:uppercase;
}
.account-width .signin-btn:hover, .account-width .signup-btn:hover, .forgetpassword button.forget-submit:hover{
    background-color: var(--pink-color);
}
.account-width .login-btn{
    width:100%;
    border:2px solid #ffffff;
    background-color: transparent;
    border-radius: 5px;
    padding:7px 15px;
    color:#ffffff;
    margin-top:15px;
    text-transform:uppercase;
}
.account-width .login-btn:hover{
    background-color:var(--pink-color);
    color:#ffffff;
    border-color:var(--pink-color);
}

.form-container {
	position: absolute;
	top: 0;
	height: 100%;
	transition: all 0.6s ease-in-out;
}

.sign-in-container {
	left: 0;
	width: 50%;
	z-index: 2;
    padding:30px 30px;
}

.sign-in-container form{
    height: 100%;
}

.account-width.right-panel-active .sign-in-container {
	transform: translateX(100%);
}

.sign-up-container {
	left: 0;
	width: 50%;
	opacity: 0;
	z-index: 1;
    padding:30px 30px;
}

.account-width.right-panel-active .sign-up-container {
	transform: translateX(100%);
	opacity: 1;
	z-index: 5;
	animation: show 0.6s;
    overflow-y:scroll;
    background-color: #ffffff;
}
.account-width.right-panel-active .sign-up-container::-webkit-scrollbar-track {
    background-color: #f5f5f5;
}
.account-width.right-panel-active .sign-up-container::-webkit-scrollbar-thumb {
    background-color: #596a7e;
    border-radius: 15px;
    height: 5px;
}
.account-width.right-panel-active .sign-up-container::-webkit-scrollbar {
    width: 8px;
    background-color: #f5f5f5;
}

@keyframes show {
	0%, 49.99% {
		opacity: 0;
		z-index: 1;
	}
	
	50%, 100% {
		opacity: 1;
		z-index: 5;
	}
}

.overlay-container {
	position: absolute;
	top: 0;
	left: 50%;
	width: 50%;
	height: 100%;
	overflow: hidden;
	transition: transform 0.6s ease-in-out;
	z-index: 100;
}

.account-width.right-panel-active .overlay-container{
	transform: translateX(-100%);
}

.login-overlay {
	background: #002B60;
	background: -webkit-linear-gradient(180deg, #00B4D5 0%, #002B60 100%);
	background: linear-gradient(180deg, #00B4D5 0%, #002B60 100%);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 0 0;
	color: #FFFFFF;
	position: relative;
	left: -100%;
	height: 100%;
	width: 200%;
  	transform: translateX(0);
	transition: transform 0.6s ease-in-out;
}

.account-width.right-panel-active .login-overlay {
  	transform: translateX(50%);
}

.overlay-panel {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	padding: 0 40px;
	text-align: center;
	top: 0;
	height: 100%;
	width: 50%;
	transform: translateX(0);
	transition: transform 0.6s ease-in-out;
}

.overlay-left {
	transform: translateX(-20%);
}

.account-width.right-panel-active .overlay-left {
	transform: translateX(0);
}

.overlay-right {
	right: 0;
	transform: translateX(0);
}

.account-width.right-panel-active .overlay-right {
	transform: translateX(20%);
}

.mobile-signupbtn, .mobile-logintbn{
    display: none;
}
@media (max-width:768px) {
	.overlay-container{
        display: none;
    }
    .sign-in-container form{
        height: auto;
    }
    .account-width .sign-up-container{
        transform: translateX(100%);
    }
    .mobile-signupbtn, .mobile-logintbn{
        display: block;
        border:2px solid var(--blue-color)!important;
        color:var(--blue-color)!important;
    }
    .mobile-signupbtn:hover, .mobile-logintbn:hover{
        border:2px solid var(--pink-color)!important;
        background:var(--pink-color)!important;
        color:#ffffff!important;
    }
    .account-width.right-panel-active .sign-up-container{
        transform: translateX(0%);
    }
    .form-container{
        width:100%!important;
    }
    .sign-in-container .col-12{
        padding:0;
    }   
    .sign-in-container .col-12.pwd{
        margin-bottom:20px!important;
    }
    .forget-pwd, .signin-btn{
        margin-bottom:20px;
    }
}

/*-----Recovery Account-----*/
.recovery-account {
    box-shadow: 0 14px 28px rgba(0,0,0,0.15);
    border-radius:5px;
    max-width:500px;
    margin:0 auto 30px auto;
    padding:30px 30px 45px;
}
.forgetpassword h1{
    text-align:center;
    font-size: 28px;
    margin-bottom:30px;
}

/*Dashboard*/
/* Style the tab */
.tab {
    float: left;
    border: 1px solid #ccc;
    background-color: #f1f1f1;
    width:20%;    
  }
  
  /* Style the buttons that are used to open the tab content */
  .tab .tablinks {
    display: block;
    background-color: inherit;
    color: black;
    padding: 22px 16px;
    width: 100%;
    border: none;
    outline: none;
    text-align: left;
    cursor: pointer;
    transition: 0.3s;
    font-weight:500;
  }
  .tab button svg{
    margin-right:8px;
  }
  .tab button svg path{
    fill:#000000;
  }
  
  /* Create an active/current "tab button" class */
  .tab button.active, .tab button:hover {
    color:#EB008B;
  }
  .tab button.active svg path, .tab button:hover svg path{
    fill:#EB008B;
  }
  
  /* Style the tab content */
  .tabcontent {
    float: left;    
    border: 1px solid #ccc;
    width: 80%;
    border-left: none;    
    padding:30px 30px 20px;
  }

  .memberaccess .custom-alert {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding:35px 20px 20px;
    background-color: #ffffff;
    border: 1px solid #ddd;
    border-radius:5px;
    box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.2);
    z-index: 9999;
    text-align:center;
  }

  .memberaccess .custom-alert h2 {
    margin-top: 0;
  }
  .memberaccess .custom-alert .close-btn {
      position: absolute;
      top: 5px;
      right: 15px;
      cursor: pointer;
      font-size:30px;
  }
  .memberaccess .custom-alert .close-btn:hover{
    color:var(--pink-color);
  }
  .memberaccess .button-popup {
    background-color: var(--blue-color); 
    border: none;
    color: #ffffff;
    padding: 3px 25px;
    display: inline-block;    
    cursor: pointer; 
    border-radius: 5px;           
  }
  .memberaccess .button-popup:hover{
    background-color:var(--pink-color);
  }
  .memberaccess .field-icon {
    float: right;
    margin-left: -35px;
    margin-top: 20px;
    margin-right: 12px;
    position: relative;
    z-index: 3;
   }

  @media (max-width: 992px){
    .tab, .tabcontent {
        width:100%;
    }
    .tab{
        display: flex;
       flex-wrap: wrap;
    }
    .tab .tablinks{
        width:25%!important;
        text-align:center!important;
    }
    .memberaccess .dash-icon{
        width:100%!important;
        margin-bottom:5px;
    }
    .tabcontent{
        border-left: 1px solid #ccc;
    }
    #Credits .credit-respo, #Your_Orders .order-respo{
        overflow-x: scroll;
    }
    #Credits .credit-respo table, #Your_Orders .order-respo table{
        width:600px!important;
    }   
    #Credits .credit-respo::-webkit-scrollbar-track, #Your_Orders .order-respo::-webkit-scrollbar-track {
        background-color: #f5f5f5;
    }
    #Credits .credit-respo::-webkit-scrollbar-thumb, #Your_Orders .order-respo::-webkit-scrollbar-thumb {
        background-color: #596a7e;
        border-radius: 15px;
        height: 5px;
    }
    #Credits .credit-respo::-webkit-scrollbar, #Your_Orders .order-respo::-webkit-scrollbar {
        width: 8px;
        background-color: #f5f5f5;
    }
    .dash-head h1{
        font-size: 35px!important;
        margin-bottom:0;
    }
    #member-pass-save .show-password1 #pswd_info{
        top: 95px!important;
        left:50px!important;
        right:0!important
    }    
    .forgetpassword #pswd_info{
        top: 75px!important;
        left:50px!important;
        right:0!important
    }      
    #member-pass-save .show-password1 #pswd_info:before, .forgetpassword #pswd_info:before{
        transform: rotate(45deg);
        top:0;
        left:45%;
    }
  }
  @media (max-width: 480px){
    .tab .tablinks span:last-child{
        display: none;
    }
  }
  /*-----------------dashboard- start--------------*/
.dash-head{
    background: #FFFFFF;
    border: 1px solid #71D6E9;
    box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.16), 0px 0px 1px rgba(9, 30, 66, 0.31);
    border-radius: 5px;
    width: 100% !important;
    display: flex;
    align-items: center;
}
.dash-head h1{
    color: #00B4D5;
    font-size: 50px;
}
.dash-head p{
    font-weight: 500;
    font-size: 20px;
    color: #475569;

}
.dash-table-head{
    font-weight: 600;
    font-size:22px;
    color: #475569;
    margin-bottom:0;
}
.table-design, .table-design tr{

    border: 2px solid #EEF0F4;
    text-align: center;
  }
.table-design th{
    line-height: 50px;
    font-weight: 500;
    font-size: 17px;
    color: #475569;
}
.table-design td:nth-child(1){
    font-weight: 500;
    font-size: 17px;
    color: #475569;
  }
  .table-design td:nth-child(3),  .table-design td:nth-child(4){
    font-weight: 500;
    font-size: 22px;
    color: #21BB5E;
  }
  .table-design tbody tr:nth-child(even), .table-design thead tr{
    background: #F9FBFC;
}

.table-design p:nth-child(1){
    font-weight: 500;
    font-size: 17px;
    color: #475569;
    margin-bottom: 0;
    padding-top: 20px;
}
.table-design p:nth-child(2){
    font-weight: 400;
    font-size: 15px;
    color: #475569;
}
.table-design p.remark, .table-design p.validity{
   color: #475569; 
   margin-bottom:0;
}
.table-design p.payment, .table-design p.validity{ 
   margin-bottom:0;
}
.table-white  .order-total div{
    line-height: 40px;
}
.table-white .custom-font td{
    font-size: 15px!important;
    line-height: 40px!important;
}
.table-design .red-content  .credit-trans {        
    background: #FFE9EB;     
    color: #EC4C5B;
}

.table-design .credit-trans{
    font-size: 15px;
    width: 65px;
    height: 32px;
    line-height:30px;
    background: #EAFFF2;
    border-radius: 20px;
    font-weight: 500;
    display:block;
    margin:0 auto;
}
.table-design .fa-caret-up:before, .table-design .fa-sort-desc:before{
    font-size: 19px;    
}
.table-design button:first-child{
    border: 2px solid #E5E7EB;
    border-radius: 5px;
    font-size: 17px;
    background-color: white;
    color: #374151;
    margin-right: 20px;
    line-height: 32px;
    width: 100px;
    font-weight: 500;
}
.table-design button:nth-child(2){
    background: #00B4D5;
    border: 2px solid #00B4D5;
    border-radius: 5px;
    font-weight: 500;
    font-size: 18px;
    color: #FFFFFF;
    line-height: 30px;
    width: 95px;
}
.table-design .table-foot{
    font-size: 14px !important;
    letter-spacing: 0.1px;
    color: #94A3B8 !important;
    line-height: 80px;
}

.dash-foot{
    background: #F9FBFC;
    border-radius: 10px;
    height: 40px;
}
.dash-foot div{
    font-weight: 600;
    font-size: 16px;
    line-height: 45px;
    color: #4F545E;
    text-align: center;
}
.dashboard-maintitle{    
    font-weight: 600;
    font-size: 22px;
    color: #475569;
    margin-bottom:20px;
}

/*-----------------dashboard- end--------------*/

/*----------------dashboard-order-start--------------*/

.table-white{
    width: 100%;
    text-align: center;
    border: 2px solid #EEF0F4;
    border-radius: 10px
}
.table-white img,.table-grey img{
    vertical-align: text-top;
}
.table-white th{
    padding-top: 20px;
    padding-bottom: 10px;
    font-weight: 500;
    font-size: 18px;
    color: #4F545E;
}
.table-white td{
    line-height: 50px;
    font-weight: 500;
    font-size: 18px;
    color: #475569;
}
.table-white tr:first-of-type{

    background: #F9FBFC;
    border-radius: 10px 10px 0px 0px;
}
.table-white i{
    border: 2px solid #EB008B;
    border-radius: 290px;
    color: #EB008B;
    width: 18px;
    height: 18px;
    line-height: 17px;
    font-size: 12px;
}


.table-grey{
    background-color: #7A7A7A;
    color: #fff;
    border-bottom: 2px dashed #B1B1B1;
    vertical-align:top;
}
.table-grey p:first-child{
    font-size: 15px;
    font-weight: 100;
    margin-top: 10px;
    margin-bottom: 0;

}
.table-grey p:nth-child(2){
    font-size: 15px;
    font-weight: 100; 
    margin-bottom:0;  
}
.table-grey p:nth-child(3){
    font-size: 14px;
    font-weight: 100; 
}
.table-grey td{
    line-height:50px;
    color: #fff;
}

.table-grey i{
    color: white;
    border: 2px solid #fff;
}
.table-grey li::marker{
    padding:0;
}
.table-bottom{
    border-bottom: none;
}
.table-grey{
    display: none
 }


.memberaccess .dash-icon{
    display:inline-block;
    width:35px;
}

/*----------------dashboard-order-end-------------*/

/*----------------dashboard-information-start--------------*/
.information h4{
    font-weight: 500;
    font-size: 25px;
    color: #475569;
}
.information label{
    font-weight: 500;
    font-size:18px;
    color: #6B7280;
}

.information input[type=text], .information input[type=tel], .information input[type=password], .information select{    
    border: 3px solid #E5E7EB;
    border-radius: 8px;
    width: 100%;
    height: 60px;
    padding:10px;
}
.information .select2-container{
    width: 100%!important;
}
.information .select2-selection__arrow{
    top: 15px!important;
    right: 10px!important;
}
.information  .select2-selection__rendered{
    line-height: 34px!important;
}
.information .select2-selection--single{
    border: 3px solid #E5E7EB!important;
    border-radius: 8px;
    width: 100%!important;
    height: 60px!important;
    padding:10px;
    display:block!important;
}
.information input[type=radio]{
    width: 45px;
    height: 20px;
}
.information button{
    width: 198px;
    height: 50px;
    left: 534px;
    background: #00B4D5;
    border: none;
    color: white;
    border-radius: 5px;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 20px;
}

.password h3{
    margin-top:50px;
    margin-bottom:20px;
    font-weight: 600;
    font-size: 26px;
    color: #475569;
}


#pswd_info {
	background:#ffffff;
    box-shadow: 0 14px 28px rgba(0,0,0,0.15);
	color: #000;
    right: -300px;
    position: absolute;
    top:-59px;
    z-index: 99;
    border-radius:5px;
    padding-bottom:10px;
}
#pswd_info h4{    
    display: block;
    font-size: 16px;
    letter-spacing: 0;
    padding: 10px 0;
    text-align: center;    
    border-bottom:1px solid #ddd;
}
#pswd_info ul {    
    margin:0;
}
#pswd_info ul li {
   padding: 5px 5px 0;
}

.valid {
	/* background: rgba(0, 0, 0, 0) url("https://s19.postimg.org/vq43s2wib/valid.png") no-repeat scroll 2px 6px; */
	color: green;
	line-height: 21px;
	padding-left: 22px;
}

.invalid {
	/* background: rgba(0, 0, 0, 0) url("https://s19.postimg.org/olmaj1p8z/invalid.png") no-repeat scroll 2px 6px; */
	color: red;
	line-height: 21px;
	padding-left: 22px;
}

#pswd_info::before {
    background: #ffffff;
    content: "";
    height: 25px;
    left: -13px;
    margin-top: -12.5px;
    position: absolute;
    top: 50%;
    transform: rotate(45deg);
    width: 25px;
}
#pswd_info {
    display:none;
}
.show-password1{ position: relative;}
.show-password1 #pswd_info{
    top:-55px;
    right:-310px;
}
.credit-table-heading{
    margin:30px 0 20px;
}
.credit-table{
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    max-width:500px;
}
@media (max-width: 992px){
    .credit-table{    
        margin-bottom:60px;
    } 
    .how-works{        
        background-image:none!important;
    } 
}
.credit-table .fit-session{
    background-color: var(--pink-color);
}
.credit-table .fit-session td{
    border-width:0;
    text-align:center;
    color:#ffffff;
    font-weight: 600;
}
.credit-table table{     
    border-collapse: collapse;
    width:100%;    
}
.credit-table table, .credit-table table th, .credit-table table td{
    border:1px solid #ddd;
}
.credit-table table th, .credit-table table td{
    padding:8px;
}
.credit-table table th:last-child, .credit-table table td:last-child{
    text-align: center;
}
.credit-table thead th{
    background:#03a5c3;
    color:#ffffff;
    font-weight:600;
}
.credit-table tbody tr:nth-child(even) td{
    background:#dff2f5;
}
#for_numrows, #for_filter_by{
    display: none!important;
}
#pagesControllers{
    text-align: center;
    margin-bottom:15px;
}
#pagesControllers button{
    padding:2px 8px;
    margin:10px 5px;
    border-width:0;
    background:transparent;
    border-radius:5px;
    width:35px;
    font-size: 19px;
}
#pagesControllers .currentPage, #pagesControllers button:hover{
    background:#002b60;
    color:#fff;
}
.login .iti__selected-flag{
    height: auto!important;
    margin-top:14px!important
}
.login-pwd #pswd_info{
    top: 80px!important;
    right: 0!important;
}
.login-pwd #pswd_info::before {
    left: 45%;
    margin-top: -12.5px;
    position: absolute;
    top:0;
    transform: rotate(45deg);
}
.text-justify{
    text-align:justify;
}
.credit-offer-box .pack-desc{
    display: none;
}

/*---------------------Sim Play & Coach----------------*/
.accordion .accordion-item{
    margin:20px 0px;
    border: none !important;
  }
  .accordion-head{
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color:#F8F8F4 !important;
    border-radius: 5px;
    color: #000;
    height: 60px;
    padding: 0px 20px;
  } 
  .accordion-head p{
    padding-left: 20px !important;
    margin:0 !important;
    font-size: 20px;
    font-weight: 500;
  }
  .accordion-head div.s-no{
    width: 30px;
    height: 30px;
    color: #000;
    font-size: 20px;
    font-weight: 700;
    border-radius: 5px;
    border: 1px solid #101010;
    background: #FFF;
    text-align: center;
  }
  .edit{
    width: 117px !important;
    height: 31px !important;
    border-radius: 5px !important;
    background-color: var(--blue-color) !important;
    color: #FFF !important;
    justify-content:center;
  }
  .edit:hover{
    background: var(--pink-color)!important;
  }
  .edit:after{
    display:none; 
  }
  .accordion-head.active{ 
    background-color:#002B60 !important;
    color: #fff;
  }
  .accordion-head.active div.s-no{ 
    border: 1px solid var(--blue-color);
  }
  .next{
    padding: 3px 33px;
    border-radius: 10px;
    background: var(--pink-color);
    color:#fff;
    border: none;
    font-size: 20px;
    font-weight: 500;
    margin-top: 40px;
  }
  .skip{
    padding: 3px 33px;
    border: 1px solid var(--pink-color) !important;
    border-radius: 10px;
    background: #fff;
    color: var(--pink-color);
    border: none;
    font-size: 20px;
    font-weight: 600;
    margin-top: 40px;
    text-transform: uppercase;
  }
  .next:hover{
    background:var(--blue-color);
  }
  .skip:hover{
    background:var(--pink-color);
    color:#ffffff;
  }
  /*------------------Book slot-------------------*/
  .book-slot{
    margin-top: 25px;
  }
  .book-slot label{
    color: #000;
      font-size: 18px;
      font-weight: 700;
      padding-bottom: 10px;
      padding-left: 10px;
  }
  .book-slot select{
    border-radius: 10px;
    border: 2px solid #C4C4C4;
    padding: 10px 20px;
    color: #000;
    font-size: 18px;
    font-weight: 500;
  }
  .book-slot input[type="date"] {
    padding: 9px 25px;
    border-radius: 10px;
    border: 2px solid #C4C4C4;
    background: #FFF;
    font-weight: 500;
  }
  .book-slot img{
    border-radius: 10px;
  }
  .book-slot .select-coach{
    margin-bottom: 10px;
  }
  .book-slot .select-coach p{
    color: #6E6D68;
    text-align: justify;
    font-size: 15px;
    line-height: 1.5;
    margin-left: -15px;
    font-weight: 100;
    padding-top: 13px;
  }
  .book-slot .select-coach .form-select{
    background-image: none !important;
  }
  .book-slot .select-coach .form-select:disabled{
    background-color: #fff;
  }
  .book-slot .coach-details{
    align-items: center;
    border-radius: 10px;
    border: 2px solid #C4C4C4;
    margin: 0;
    margin-top: 20px;
  }
  .book-slot p.select-time{
    padding-left: 35px;
    position: relative;
    margin-bottom: -14px;
    margin-top: 0;
  }
  .book-slot p.select-time::before{
    position: absolute;
    content: "\f017";
    font-size: 22px;
    color: #00B4D5;
    left: -2px;
    top: 0px;
    font-family: 'Font Awesome 5 Free';
    font-weight: 100;
  }
  .book-slot ul{
    display: flex;
    justify-content: space-between;
    list-style-type: none;
  }
  .book-slot ul li{
    color: #000;
    font-size: 16px;
    font-weight: 500;
    position: relative;
  }
  .book-slot ul li:first-child::before{
    position: absolute;
    content: "";
    width: 20px;
    height: 20px;
    background-color: #fff;
    border: 2px solid #C4C4C4;
    border-radius: 5px;
    left: -27px;
    top: 4px;
  }
  .book-slot ul li:nth-child(2)::before{
    position: absolute;
    content: "";
    width: 20px;
    height: 20px;
    background-color: #00B4D5;
    border-radius: 5px;
    left: -27px;
    top: 4px;
  }
  .book-slot ul li:nth-child(3)::before{
    position: absolute;
    content: "";
    width: 20px;
    height: 20px;
    background-color: #C0C0C0;
    border-radius: 5px;
    left: -27px;
    top: 4px;
  }
  .book-slot .input-group-append {
    cursor: pointer;
  }
  .book-slot .bay{
    text-align: center;
    margin-top: 20px;
  }
  .book-slot h3.bay-head{
    margin-top: 15px;
    color: #EB008B;
    font-size: 26px;
    font-weight: 700;
  }
  .book-slot .bay button{
    border-radius: 10px;
    border: 2px solid #C4C4C4;
    background-color: #fff;
    font-size: 16px !important;
    color: #000;
    font-weight: 500;
    padding: 5px 26px;
    margin-bottom: 20px;
  }
  .book-slot .bay button.active, .book-slot .bay button:hover{
    background-color: #00B4D5;
    color: #fff;
    border-color: #00B4D5;
  }
  .book-slot .bay button.disabled{
    border: 2px solid #C4C4C4;
    background-color: #C0C0C0;
    color: #fff;
    cursor: no-drop;
  }
  .slot-hide{
    display: none;
  }
  .slot-show{
   display: block !important;
   margin-top: 20px !important;
  }
  /*---------------------Accordion----------------*/
  .food-drinks h3{
    position: relative;
    z-index: 100;
    color: #000;
    font-size: 20px;
    font-weight: 700;
  }
  .food-drinks h3::before{
    content: "";
    position: absolute;
    background-color: #002B60;
    width: 8%;
    height:2px;
    left:0;
    bottom: -10px;
  }
  .modal-body p.content.discount{
    margin-bottom:15px;
  }
  .modal-body .btn-close{
    position: absolute;
    top:20px;
    right:20px;
  }
  .food-drinks p.fd-head2{
    color: #000;
    font-size: 17px;
    font-weight: 600;
    margin-top: 19px !important;
    margin-bottom: 4px;
  }
  .food-drinks p.fd-head2 span{
    color: #000;
    font-size: 19px;
    font-weight: 600;
  }
  .food-drinks .add-food{
    border-radius: 5px;
    border: 2px solid var(--blue-color);
    color: var(--blue-color);
    background-color: #fff;
    font-weight: 600;
    text-transform: uppercase;
    padding: 2px 10px;
    margin-top: 20px;
    width:115px;
  }
  .food-drinks .add-food:hover{
    background:var(--blue-color);
    color:#ffffff;
  }
  .food-drinks .fd-add{
    text-align: right;
  }
  .food-drinks .fd-price{
    text-align: right;
  }
  .quantity .qty-no{
    position: relative; 
    width:120px;
    height:45px; 
    border:2px solid var(--blue-color);
    background-color:transparent;
    border-radius:5px;
    display:flex; 
    margin:0 auto;
    float: right;
  }
  .quantity input{
    border-width:0;
    background-color: transparent;
    text-align: center;
    width:115px;
    font-size: 16px;
    color:#000000;
    font-weight: 600;
    z-index:1;
  }
  .quantity input[type=number]{
    -webkit-text-size-adjust: 100%;
  }
  .quantity input[type=number]::-webkit-inner-spin-button, 
  .quantity input[type=number]::-webkit-outer-spin-button{ 
  -webkit-appearance: none;
  }
  .quantity input[type=number] { 
    -moz-appearance:textfield; 
  }
  .quantity .plus, .quantity .minus{
    position:absolute; 
    top:0;
    background-color: transparent;
    border-width: 0;
    padding: 0;
    width: 30px;
    height: 45px;
    line-height:35px;
    line-height:45px;
    font-size: 15px;
    color:#000;
    z-index:5;
  }
  .quantity .plus{
    right:0;
  }
  .quantity .minus{
    left:0;
  }
  /*---------------------------------Signup ----------------------------*/
  .sign-in-container{
    padding-bottom: 80px;
  }
  .guest{
    width: 100%;
    border:2px solid  #00B4D5;
    background-color: #fff;
    color: #5A5A5D;
    padding: 7px 10px;
    border-radius: 5px;
    text-transform: uppercase;
    margin-top:5px;
  }
  .guest:hover{
    background-color:#ec407a;
    color: #fff;
    border-color:#ec407a;
  }
  .forget-pwd{
    margin-left: 155px;
  }
  @media (max-width: 580px){
    .accordion-body.signup .forget-pwd{
        margin-left:0!important;
    }
  }
  @media (max-width: 768px){
    .guest{
        margin-top:15px;
    }
  }
  /*---------------------------------summary ----------------------------*/
  .summary p{
    color: #000;
    font-size: 17px;
    font-weight: 500;
  }
  .summary p span{
    color: #000;
    font-size: 19px; 
  }
  .summary .summary-body{
    margin-top: 30px;
    padding: 30px 40px;
    border-radius: 5px;
  background: #FFF;
  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.10);
  }
  .summary .summary-phase1{
    border-bottom: 2px solid #E5E7EB;
    justify-content: space-between !important;
  }
  .summary .summary-phase2{
    margin-top: 20px;
  }
  .summary .summary-phase2 div.cost{
    color: #000;
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 15px;
  }
  .summary .col-md-6:nth-of-type(2){
    text-align: end !important;
  }
  .summary .summary-phase2 .summary-hours img{
    padding: 0px 3px;
  }
  .summary .summary-phase2 p.summary-hours-charge {
  margin: 0;
  }
  .summary .summary-phase2 p.summary-hours-credits{
    font-size: 14px;
  }
  .summary .summary-button{
    padding: 3px 13px;
      font-size: 16px;
  }
  /*---------------------------------Modal----------------------------*/
  .accordion-body.food-drinks{
    padding:30px 0;
  } 
  .modal.show .modal-dialog{ max-width: 550px; }
  .modal-body{
      padding: 20px 35px 0!important;
      background-color: #fff;
      border-radius: 5px;
      box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.10);
  }
  .modal-body .row{
    margin-top:
  }
  .modal-body p.head{
    color: #000;
    font-size: 21px;
    font-weight: 700;
  }
  .modal-body p.sub-head{
    color: #000;
    font-size: 16px;
    font-weight: 500;
  }
  .modal-body p.content{
    color: #000;
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 5px;
  
  }
  .modal-body input[type="radio"] {
    margin-top: 5px;
    width: 18px;
    height: 18px;
  }
  .modal-body button.add-cart{
    padding: 3px 20px;
      border-radius: 10px;
      background: var(--pink-color);
      color: #fff;
      border: none;
      font-size: 15px;
      font-weight: 500;
  }
  .modal-body button.add-cart:hover{
    background:var(--blue-color);
  }
  .modal-body button.continue{
    padding: 3px 20px;
    border: 1px solid var(--pink-color) !important;
    border-radius: 10px;
    background: #fff;
    color: var(--pink-color);
    font-size: 15px;
    font-weight: 600;
  }
  .modal-body button.continue:hover{
    background:var(--pink-color);
    color:#ffffff;
  }
  /*---------------------------------Golf instruction----------------------------*/
  .golf-instruction{
    margin-top: 50px ;
    padding: 40px 0px;
    background: #F8F8F4;
  }
  .golf-instruction .row{
    align-items: center;
  }
  .golf-instruction h1{
    color: #000;
    font-size: 30px;
    font-weight: 600;
    position: relative;
  }
  .golf-instruction h1::before{
    content: "";
    position: absolute;
    background-color: #002B60;
    width: 23%;
    height: 2px;
    left: 0%;
    bottom: -10px;
  }
  .golf-instruction p{
    color: #6E6D68;
    font-size: 15px;
    margin: 20px 0px;
    margin-bottom: 0;
  }
  .golf-instruction ul{
    margin-top: 15px;
    list-style-type: none;
    padding:0;
  }
  .golf-instruction ul li{
    color: #000;
    font-size: 16px;
    font-weight: 600; 
    line-height: 3;
    border-bottom: 1px solid #B4B4B4;
  }
  .golf-instruction ul li:last-child{
    border: none;
  }
  .golf-instruction ul li span{
    font-size: 16px;
    font-weight: 500;
  }
  /*---------------------------------Golf instruction----------------------------*/
  .coach-instruction{
    margin-top: 50px ;
    background: #F8F8F4;
    position: relative;
    overflow: hidden;
  }
  .coach-instruction .row{
    align-items: center;
  }
  .coach-instruction h1{
    color: #000;
    font-size: 30px;
    font-weight: 600;
    position: relative;
  }
  .coach-instruction h1::before{
    content: "";
    position: absolute;
    background-color: #002B60;
    width: 23%;
    height: 2px;
    left: 0%;
    bottom: -10px;
  }
  .coach-instruction p{
    color: #6E6D68;
    font-size: 15px;
    margin: 20px 0px;
    margin-bottom: 0;
  }
  .coach-instruction ul{
    margin-top: 15px;
    list-style-type: none;
    padding:0;
  }
  .coach-instruction ul li{
    color: #000;
    font-size: 16px;
    font-weight: 600; 
    line-height: 3;
    border-bottom: 1px solid #B4B4B4;
  }
  .coach-instruction ul li:last-child{
    border: none;
  }
  .coach-instruction ul li span{
    font-size: 16px;
    font-weight: 500;
  }
  .coach-instruction .player-image img{
    position: absolute;
    right: 0;
    top: 0;
  }
  .coach-instruction .content{
    padding:50px 15px;
    background: #f8f8f4;
    z-index: 1;
  }
  @media (min-width: 1440px){
    .coach-instruction .content{
      padding:150px 15px;
    }
  }
  /*------------------------Contact section--------------------*/
  .contact-section a{
    border-radius: 0 !important;
  }
  
  @media (min-width: 1200px){
    .golf-instruction .row{
      position: relative;
    }
    .golf-instruction .content{
      position: absolute;
      right: 100px;
      bottom: -15px;
    }
  }
  /*---------------------------------Tab to desktop view----------------------------*/
  @media (min-width: 992px) and (max-width: 1200px){
    .book-slot .bay button{
      padding: 8px 24px !important;
    }
  }
  /*---------------------------------Tab Responsive ----------------------------*/
  @media (max-width:992px) {
    /*-----------Books slot-----------------*/
    .book-slot h3.bay-head{
      font-size: 23px;
    }
    .book-slot{
      margin: 0 !important;
    }
    .book-slot label{
      margin-top: 20px;
    }
    .book-slot input[type="date"]{
      width: 100%;
      padding: 5px 10px;
    }
    .book-slot select{
      font-size: 15px;
      padding: 10px 10px;
    }
  .book-slot .bay button{
    padding:3px 25px;
    font-size: 13px !important;
  }
  .quantity .qty-no{
    height: 30px;
    line-height:35px;
    width:100px;
  }
  .quantity input{
    width:100px;
  }
  .quantity .plus, .quantity .minus{
    height: 30px;
    line-height: 30px;
    font-size: 12px;
  }
  .golf-instruction .content{
    margin-top: 50px;
    position:unset;
  }
  
  .coach-instruction{
    position: unset;
  }
  .coach-instruction .player-image{
    position: unset;
  }
  .coach-instruction .player-image img{
    display: none;
  }
  .summary .summary-phase2 div.cost{
    margin-bottom: 0;
  }
  }
   /*-----------Food-drinks-----------------*/
   
  /*---------------------------------Mobile Responsive ----------------------------*/
  @media (max-width:768px) {
    /*-----------Books slot-----------------*/
    .book-slot .slot-show .col-md-7{
      padding: 0;
    }
    .book-slot ul li{
      font-size: 14px;
    }
    .book-slot ul li:first-child::before,.book-slot ul li:nth-child(2)::before,.book-slot ul li:nth-child(3)::before{
      width: 16px;
      height: 16px;
      right: -28px;
      left: -18px;
      top: 6px;
  }
  .book-slot .coach-details{
    padding: 20px;
  }
    /*-----------Food & Drinks-----------------*/
    .food-drinks h3{
      margin-top: 20px;
      font-size: 19px;
    }
    .food-drinks .add-food{
      margin-top: 0 !important;
      padding: 0 !important;
      width: 80px !important;
      height: 30px;
      font-size: 13px;
      line-height: 25px;
    }
    .food-drinks p.fd-head2{
      text-align: left;
      font-size: 15px;
    }
    .food-drinks p.fd-head2 span{
      font-size: 17px;
    }
    .food-drinks p.fd-price{
      margin-top: 0 !important;
    }
    /*-----------Summary-----------------*/
    .summary .summary-body .row{
      margin-top: 10px;
    }
    .summary .summary-phase1{
      border: none;
    }
    .summary p{
      font-size: 16px;
      margin-bottom: 4px;
    }
    .summary .col-md-6:first-of-type p{
      font-weight: 600;
    }
    .summary .col-md-6:nth-of-type(2){
      text-align: left !important;
      border-bottom: 2px dashed #E5E7EB;
    }
    .summary .summary-time .col-md-6:nth-of-type(2){
  
      border-bottom: 2px solid #E5E7EB;
    }
    .golf-instruction h1{
      font-size: 22px;
    }
    .next,.skip{
      padding: 0px 25px;
      font-size: 14px;
      margin-top: 15px;
    }
  }
  .food-snacks{ 
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 550px;
    padding: 20px 25px;
  }  
.food-snacks::-webkit-scrollbar-thumb {
    background-color: #EB008B99;
    border-radius: 15px;
    height: 5px;
}
.food-snacks::-webkit-scrollbar {
    width:4px;
    background-color: #f5f5f5;
}
.food-snacks::-webkit-scrollbar-track {
    background-color: #f5f5f5;
}