/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

.margin-bottom-30{ margin-bottom:30px; }

#wheelsys_payment_type_field > label{display:none;}

p.wheelsys_info::before{margin-right:10px; content:"\f30f"; font-family:"Font Awesome 5 Pro"; display:inline-block;}
p.wheelsys_error::before{margin-right:10px; content:"\f071"; font-family:"Font Awesome 5 Pro";  display:inline-block;}

.col-fifth{
  flex: 0 0 auto;
  width: 20%;
}

.textleft{ text-align:left; }
.textright{ text-align:right; }

#checkoutTabs{
    border: 1px solid #e3e3e3;
    padding: 20px;
    margin-bottom: 20px;
}

.CHECKOUTCONTAINER{
     border: 1px solid #e3e3e3;
}

.checkout-left-column{ border-right:1px solid #e3e3e3;  }
.checkout-right-column{  }

.checkoutTabLink{ 
    pointer-events:none; 
    cursor:not-allowed; 
    display: block;
    text-align: center;
    font-size: 30px !important;
    text-transform: uppercase;
    line-height: 60px;
    position: relative !important;
}

.checkoutTabLink::before{
    content: attr(data-tab);
    display: inline-block;
    font-size: 20px;
    line-height: 40px;
    border: 1px solid;
    width: 40px;
    text-align: center;
    margin-right: 10px;
    border-radius: 80px;
}


.orderReviewProductData{ font-size:14px; line-height:16px; }
.orderReviewData{ font-size:18px; line-height:24px; }
.orderReviewData, .orderReviewProductData{ margin-top:10px; padding-top:10px; border-top:1px solid #e3e3e3; }


.checkoutReview{ padding:20px; }
.checkoutTab{ display:none; pointer-events:none; opacity:0; visibility:hidden; height:0; padding:20px;}
.checkoutTab.ACTIVE{ display:block; pointer-events:all; opacity:1; visibility:visible; height:auto; }
.woocommerce ul.products.columns-4 li.product:not(.vehicle_listing_only){ min-width:100% !important; display:block; clear:both; }

.checkoutNavButton{
    display: inline-block; font-size: 20px !important; line-height: 40px !important; padding: 0 15px; text-transform: uppercase;
}

.checkoutNavButton.disabled{ cursor:not-allowed; }

.fee-50-deposit, .fee-25-deposit{ display:none; }

.checkoutHeading{
    text-align: center;
    padding-bottom: 10px; margin-bottom: 10px;
    border-bottom: 1px solid #e3e3e3;
}

#checkoutNavigation{ margin-top:10px; padding-top:10px;}

.orderReviewProductData dl{
    display: flex;
    flex-wrap: wrap;
}

.orderReviewProductData dt{ 
    flex: 0 0 auto;
    width: 50%;
}
.orderReviewProductData dd{ 
    flex: 0 0 auto;
    width: 50%;
 }
#wheelsysLoader{
    position: fixed;
    z-index: 99999;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    pointer-events: all;
    cursor: wait;
    background-position: center center;
    background-repeat: no-repeat;
    opacity: 0; 
    visibility: hidden;
    transition: .3s all;

}

#wheelsysLoader.SHOWING{
    opacity: 1; 
    visibility: visible;
    z-index: 99999;
}

.wheelsysPriceItem{
    display: none; visibility: hidden; opacity: 0; pointer-events: none;
}

#wheelsysTimer{
    /*position: fixed;*/
    z-index: 9999;
    /*bottom: 0;*/
    /*left: 0; */
    width: 100%;
    padding: 10px 0;
    font-size: 18px;
    line-height: 30px;
    text-align: center;
    color: #fff;
    opacity: 0; 
    visibility: hidden;
    transition: .3s all;
}

#wheelsysTimer.showing{
    opacity: 1; 
    visibility: visible;
    z-index: 9999;
}

#single_map_branch{ height:auto; }
#global_map_branch{ height:auto; }

.wheelsys_map_marker{
    background-color: #000;
    width: 30px;
    height: 30px;
    border-radius: 50px;
    line-height: 30px;
    text-align: center;
    display: block;
}

.wheelsys_map_marker img{ max-width:60% !important; width: auto !important; text-align:center; position:relative; max-height: 60% !important; height: auto !important;}


.wheelsysLoaderText{
    position:absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    text-align: center;
}

.wheelsysLoaderText i{
    color: var(--e-global-color-secondary);
    font-size: 60px;
    font-style: normal;
    font-family: "Font Awesome 5 Pro";  
    -webkit-animation: bounce 2s infinite; 
    animation: bounce 2s infinite; 
    position: relative;
    display: inline-block;
}

.wheelsysLoaderText span{
    font-size: 30px;
    line-height: 60px;
    color: var(--e-global-color-secondary);
    font-family: var( --e-global-typography-primary-font-family );
    clear: both;
    display: block;
}

@-webkit-keyframes bounce { 
    0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);} 
    40% {-webkit-transform: translateY(-20px);} 
    60% {-webkit-transform: translateY(-10px);} 
 } 
 
 @keyframes bounce { 
    0%, 20%, 50%, 80%, 100% {transform: translateY(0);} 
    40% {transform: translateY(-20px);} 
    60% {transform: translateY(-10px);} 
 }




 .extra-has-description{
    display: inline-block;
    margin-left: 10px;
    line-height: 20px !important;
    width: 20px;
    border-radius: 120px;
    color: #fff !important;
    background-color: #000;
    cursor: pointer;
    text-align: center;
    font-size: 12px !important;
    font-style: italic;
 }

 .extra-has-description::after{
    content: "";
    display: block;
    clear: both;
 }

 .wheelsys-extra-checkbox span.description{ clear:both; }

 .wheelsys-extra-checkbox span.description::before{
    content: "";
    display: block;
    clear: both;
 }

 .wheelsys-payment-type-radio-item label{ 
    display: inline-block !important;
    margin-left: 25px;
  }


.MOBILESHOW{ display:none; }

@media(max-width: 568px){
    .MOBILESHOW{ display:block !important; }
    .MOBILEHIDE{ display:none !important; }
}