/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 26-Sep-2018, 10:23:45
    Author     : jeffreyalcock
*/



.badge-pill { padding: 12px 14px; border-radius: 20px;}


.time-remaining { font-size: 20px; font-weight: bold; }
.time-remaining-sm { font-weight: bold; }
div.time-remaining.warning { color: #CC0000; }



/* Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) {
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) { 
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 
     #body-outer { min-height: 600px; }   
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {  }


/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) { 
.h2, h2 { font-size: 1.2rem; }
.payment-cards-img { width: 200px;}
.tygit-payment-logos { margin-top: 20px;}
}

/* Small devices (landscape phones, less than 768px)*/
@media (max-width: 767.98px) {  
    #body-inner,#body-outer, #header-outer, #header-inner, #footer-outer, #footer-inner  { padding-left: 0; padding-right: 0px;}
    #summary-basket-xs { margin-right: -13px;}
    
}

/* Medium devices (tablets, less than 992px)*/
@media (max-width: 991.98px) {  
    .lower-btn { margin-top: 5px; }
    .seating-plan-notes { margin-top: 20px; }
}

/* Large devices (desktops, less than 1200px)*/
@media (max-width: 1199.98px) {  }

div.cal-container { padding: 20px 0;} 
div.cal-day { padding: 20px;}
a.basket-choose-date-cell { display: block; width: 100%; background-color: #b7d976; }
span.cal-not-selected {display: block; width: 100%; text-align: center; padding: 5px; color: #555;}
span.cal-selected { display: block;  width: 100%; background-color: #fdcd3a; text-align: center; padding: 5px; color: #555; }
.cal-container a.event { display: block; margin-top: 5px; width: 100%; padding: 5px; text-align: center; background-color: #b7d976; color: #555;}
.cal-container a.event:hover { background-color: #fdcd3a; }
.cal-container a.less-than-party-size-event { display: block; margin-top: 5px; width: 100%; padding: 5px; text-align: center; background-color: #b7d976; color: #555;}
.cal-container a.less-than-party-size-event:hover { background-color: #fdcd3a; }
.cal-container div.sold-out-event { margin-top: 5px; width: 100%; padding: 5px; text-align: center; background-color: #DDD; color: #555;}

/* Steppers */

.stepper .row {
    margin: 0;
}
.stepper .step-line .step-col {
    padding: 10px 0;
    text-align: center;
}
.bg-white {
    background: #fff!important;
}



.stepper .step-line .step-title:after, .stepper .step-line .step-title:before {
    content: '';
    height: 3px;
    width: 50%;
    position: absolute;
    background-color: #e5e5e5;
    top: -32px;
    z-index: 4;
    transform: translateY(-100%);
}
.stepper .step-line .step-title:after {
    left: 50%;
}
.stepper .step-line .first .step-title:before, .stepper .step-line .last .step-title:after {
    content: none;
}
.stepper .step-line .step-title:before {
    right: 50%;
}
.stepper .step-line .step-number {
    font-size: 26px;
    border-radius: 50%!important;
    display: inline-block;
    margin: auto auto 5px;
    padding: 9px;
    border: 3px solid #e5e5e5;
    position: relative;
    z-index: 5;
    height: 60px;
    width: 60px;
    text-align: center;
}
.stepper .step-line .done .step-title:after, .stepper .step-line .done .step-title:before {
    background-color: #6c757d;
}
.stepper .step-line .active .step-title:after, .stepper .step-line .active .step-title:before {
    background-color: #007bff;
}
.stepper .step-line .done .step-number {
    color: #6c757d!important;
    border-color: #6c757d!important;
}
.stepper .step-line .step-title {
    font-size: 20px;
    font-weight: 400;
    position: relative;
}
.stepper .step-line .done .step-content, .stepper .step-line .done .step-title {
    color: #6c757d!important;
}
.stepper .step-line .active .step-number {
    color: #007bff!important;
    border-color: #007bff!important;
}
.stepper .step-line .active .step-content, .stepper .step-line .active .step-title {
    color: #007bff!important;
}

@media (max-width: 991px) {
    .stepper .step-line .step-title:after, .stepper .step-line .step-title:before {
        content: none;
    }
}

.nav-pills .nav-link {
    background: #6c757d;
    margin: 5px;
    color: #FFFFFF;
}

fieldset { border: 1px solid #EEEEEE; border-radius: 5px; padding: 20px; background: transparent;}
fieldset legend { width: auto; }
fieldset.wallet-sign-up, #visitor-update fieldset.wallet-sign-up, .terms-and-conditions-container  { border: 1px solid #31A2D1; border-radius: 5px; padding: 20px; background: transparent;}
fieldset.wallet-sign-up legend { width: auto; color:#31A2D1; }
fieldset.wallet-sign-up .form-row { margin-left: 1.25rem; margin-right: 1.25rem; }

.payment-window { width: 100%; height: 550px; border: 0;}

div.additional-information table td.add-info-label { width: 30%;}

.form-check.is-invalid~.invalid-feedback { display: block;}

.tyg-wallet-logo {
    background: url(../../images/tyg-wallet.png) no-repeat left center;
    height: 52px;
}

.tyg-wallet-header {
    background-color: #31A2D1;
    color: #FFFFFF;
}

.btn-tyg-wallet {
    background-color: #31A2D1;
    color: #FFFFFF;
}

.btn-tyg-wallet:hover {
    background-color: #31A2D1;
    color: #cbe8f3;
}

.modal-iframe { width: 100%; }

.subscription-suffix { font-size: 70%; display: block;}