/*
Couverts custom css
Codeslice
Last edit 02/01/17
*/

/* debug */
.debug {
    display: none !important;
}

/* extra fields */

/* global */

#timeHolder>a,
.couverts-column,
.couverts-dynamic form .row {
    box-sizing: border-box
}

#timeHolder>a,
#timeholder,
.centered-row,
.couverts-spinner {
    text-align: center
}

.couverts-column,
.couverts-spinner>div {
    display: inline-block
}

.couvert-margin-bottom-10 {
    margin-bottom: 5%;
    color: #0d0f37 !important;
    font-family: 'Adobe Caslon Pro' !important;
}

}

.couverts-vertical-padding {
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}


/* wrappers */

.couverts-static > div.wrapper {
    width: 100%;
    text-align: center;
    box-sizing: inherit !important;
    float:none;
}

.couverts-static {
       width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-top: -4%;
}

#couverts-dynamic {
    position: relative;
    width: 100%;
        float:none;
}


/* columns */

.couverts-column {
    padding: .5em
}

.couverts-column.couverts-column-100 {
    width: 100%
}

.couverts-column.couverts-column-75 {
    width: 75%
}

.couverts-column.couverts-column-66 {
    width: 66.6%
}

.couverts-column.couverts-column-50 {
    width: 50%
}

.couverts-column.couverts-column-25 {
    width: 25%
}

.couverts-column.couverts-column-33 {
    width: 33.3%
}

.couverts-column-33-alt {
    width: calc(100% / 3);
    padding-left: 20px;
    float: left;
}

.couverts-column-50-alt {
    width: 50%;
    float: left;
}

#couvert-header-form > div:nth-child(2) {
    padding-left: 24px !important;
}

.couverts-column>.couverts-column {
    padding-top: 0!important;
    padding-bottom: 0!important
}

#prevStep,
.couverts-column {
    float: left
}


/* rows */

.couverts-row {
    max-width: 100%;
    display: block
}

.couverts-dynamic form .row:after,
.couverts-dynamic form .row:before {
    content: ' ';
    display: table;
    clear: both
}

.centered-row {
    float: none!important;
}


/* buttons */

.nextStep,
.prevStep {
    border-radius: 0;
    background-color: #d69d05;
}

.nextStep:hover,
.prevStep:hover {
    background-color: #e8a809;
}

.nextStep {
    float: right
}

.nextStep.hidden {
    display: none
}

.prevStep {
    bottom: 0px;
    background: #d69d05;
    color: #FFFFFF;
    border: none;
    font-style: normal;
    text-transform: uppercase;
    font-weight: normal !important;
    height: 47px;
    min-width: 79px;
    font-family: 'Institut';
    font-size: 11px !important;
    letter-spacing: 3px !important;
}

.nextStep-1 {
    width: 91% !important;
    margin-top: 5px !important;
    float: none;
    height: 46px !important;
    padding-bottom: 6px !important;
    padding-right: 10px !important;
}

/*
#prevStep-single {
    padding: 2%;
}*/

.nextStep {
    bottom: 0px;
    background: #d69d05;
    color: #FFFFFF;
    border: none;
    padding: 3%;
    font-style: normal;
    text-transform: uppercase;
    font-weight: normal;
    min-width: 75px;
    letter-spacing: 3px !important;
    font-family: 'Institut';
    font-size: 11px !important;
}

.extrapadding {
    padding: 3% !important;
}

.prevStep:hover {
    background-color: #d69d05;
}

.nextStep:hover {
    background-color: #d69d05;
}


/* spinners */

.couverts-spinner {
    margin: 100px auto 0;
    width: 70px
}

.couverts-spinner>div {
    width: 18px;
    height: 18px;
    background-color: #333;
    border-radius: 100%;
    -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
    animation: sk-bouncedelay 1.4s infinite ease-in-out both
}

.couverts-spinner .bounce1 {
    -webkit-animation-delay: -.32s;
    animation-delay: -.32s
}

.couverts-spinner .bounce2 {
    -webkit-animation-delay: -.16s;
    animation-delay: -.16s
}

@-webkit-keyframes sk-bouncedelay {
    0%,
    100%,
    80% {
        -webkit-transform: scale(0)
    }
    40% {
        -webkit-transform: scale(1)
    }
}

@keyframes sk-bouncedelay {
    0%,
    100%,
    80% {
        -webkit-transform: scale(0);
        transform: scale(0)
    }
    40% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}


/* text */

.couverts-column p {
    margin: 0 0 1em
}

#ui-datepicker-div {
    width: 480px;
    background: #fff;
    padding: 1em;
    border: 1px solid #ddd
}

.column.column-100 {

    text-align: center !important;
}

/* checkbox */

.couvertsCheckbox {
    display: inline-block;
}

input.couvertsCheckbox {
    width: auto !important;
}


/* datepicker */

#timeHolder>a {
    display: inline-block;
    padding: 1em;
    background: #fff;
    min-width: 8em;
    border-radius: 5px;
    margin: 8px;
    color: #d69d05;
    font-style: normal;
    font-weight: 600;
    border: 2px #d69d05;
    border-style: solid;
    font-family: 'Adobe Caslon Pro' !important;
}

#timeHolder>a.active,
#timeHolder>a:hover {
    background: #d69d05;
    color: #fff;
}
#ui-datepicker-div > table > tbody > tr > .ui-state-disabled {
       color: #d8d8d8;
}



/* timepicker */

.couvert-time-picker {
    border: 1px solid #e3e3e3;
    background-color: #fdfdfd;
    font-size: 13px;
    color: #767676;
    padding-top: 17px;
    padding-bottom: 17px;
    padding-right: 0px;
    padding-left: 0px;
        width: 100%;
}

#startTimeGroup {
    border-right: thin dashed #888888;
    text-align: center;
        outline: none;
        -webkit-appearance: none;
        -webkit-border-radius:0; 
    border-radius:0;


}

#startTimeGroup:focus, #endTimeGroup:focus {
        outline: none;
    }

#endTimeGroup {
    border-left: thin dashed #888888;
    text-align: center;
        outline: none;
        -webkit-appearance: none;
        -webkit-border-radius:0; 
    border-radius:0;


}

.groupTimeLabel {
    float:left;
    padding-left: 3%;
    text-align: left;
}

/* forms */

.couverts-column-33 label {
    padding-left: 3%;
}

.couverts-column-66 label {
    padding-left: 1.5%;
}

.couvert-form {
    padding-top: 1%;
    width: 50%;
    margin: auto;
}

.couvert-form > form > div > div:nth-child(2) > div > div:nth-child(1) > label {
    color: white;
    float: left;
}

.couvert-form > form > div > div:nth-child(3) > div > div:nth-child(1) > label {
    color: white;
    float: left;
}

#couvertsDate {
    width: 100%;
    height: 55px;
    float: left;
    border: none;
    text-align: center;
    border-right: thin dashed #888888;
    color: #0d0f37 !important;
    font-family: 'Adobe Caslon Pro' !important;
    letter-spacing: 1.4px;

}

#couvertsNumberPersons {
    float: right;
    height: 35px;
    font-size: 13px;
    padding: 10px 12px;
    background-color: #fdfdfd;
    width: 100%;
    outline: 0;
    text-align: center;
    margin-bottom: 4px;
    border: none;
    border-left: thin dashed #888888;
    color: #0d0f37 !important;
    font-family: 'Adobe Caslon Pro' !important;
}

.form-clear-37 {
    width: 100%;
    height: 23px;
}

.bottom-zero {
    position: absolute;
    bottom: 0px;
}

.bottom-zero-pos {
    bottom: 0px;
}

#timeHolder {
    text-align: center;
}

#couverts-dynamic > form > div:nth-child(5) > div:nth-child(2) > input {
    width: 75%;
}

#couverts-dynamic > form > div:nth-child(5) > div:nth-child(3) > input {
    width: 75%;
}

#couverts-dynamic > form > div:nth-child(5) > div:nth-child(4) > input {
    width: 75%;
}

#couverts-dynamic > form > div:nth-child(5) > div.couverts-column.couverts-column-66 > textarea width: 75%;

}
#couverts-dynamic > form > div:nth-child(5) > div:nth-child(7) {
    float: right;
}
#couverts-dynamic > form > div:nth-child(5) > div.couverts-column.couverts-column-66 > textarea {
    width: 88%;
}

#couvertsTextArea {
    width: 87,5% !important;
}

.couvertstext {
    width: 87,5% !important;
}

.couvert-clear-100 {
    width: 100%;
    height: 100px;
}
.couverts-column.couverts-column-66 
textarea {
    width: 87.5% !important;
}
.couverts-column.couverts-column-33 
textarea {
    width: 75% !important;
}

.couverts-column.couverts-column-33 
input {
    width: 75% !important;
}

@media screen and (max-width: 768px) {
    .couverts-column.couverts-column-66 {
        width: 100% !important;
    }
    
    .couverts-column.couverts-column-66 textarea {
        width: 100% !important;
    }
    
    .couverts-column.couverts-column-33 {
        width: 100% !important;
    }
    
  .couverts-column.couverts-column-33 textarea {
        width: 100% !important;
    }

      .couverts-column.couverts-column-33 input {
        width: 100% !important;
    }

    .couverts-column.couverts-column-33 input,
    textarea {
        width: 100% !important;
    }
    
    .couverts-column.couverts-column-33 .couvertsInput {
        width: 100% !important;
    }
    
    #couverts-dynamic > form > div:nth-child(5) > div:nth-child(2) > input {
        width: 100%;
    }
    
    #couverts-dynamic > form > div:nth-child(5) > div:nth-child(3) > input {
        width: 100%;
    }
    
    #couverts-dynamic > form > div:nth-child(5) > div:nth-child(4) > input {
        width: 100%;
    }
    
    #couverts-dynamic > form > div:nth-child(5) > div.couverts-column.couverts-column-66 > textarea {
        width: 88%;
    }
    
    .couvert-form {
        padding-top: 3%;
        width: 100%;
    }
    
    .couverts-column-50-alt {
     width: 100%;

    }

    .couverts-column-33-alt {
        width: 100%;
        padding-left: 0px;
        float: none;
    }

    #startTimeGroup {
    border-right: 1px solid #e3e3e3;
    text-align: center;
}

#endTimeGroup {
    border-left: 1px solid #e3e3e3;
    text-align: center;
}


#couvertsDate {
    border: none !important;

}

#couvertsNumberPersons {
    border: none !important;
}

.mobile-margin-5 {
    margin-bottom: 5%;
}

.nextStep-1 {
    padding: 3% !important;
    width: 100% !important;
    height: 57px !important; 
    margin-top: 0px !important;
    margin-bottom: 8px !important;


}

.nextStep {

}

#prevStep-single {
    padding: 9% !important;
}

.extrapadding {
    padding: 15% !important;
}


}
