﻿.date_w{
    width: 200px;
    margin-right: 10px;
}
.time_slots{
    display: flex;
    flex-direction: row;
    justify-content: center;
}
.butn{
    margin-top: -2px;
}
.select_box{
    padding: 5px;
}
.checkbox_s{
    -webkit-appearance: meter !important;
    cursor: pointer;
    width: 18px;
    height: 18px;
    margin-right: 8px;
    margin-top: 4px;
}
.available{
    color: #1ab180;
    text-align: center;
}

.fa-plus{
    background: #0070c0;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
    margin: 0 5px 0 0;
}
.fa-minus{
    background: #fc0005;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
    margin: 0px;
}
.bgs{
    margin-top: -173px;
}
.time_box{
    border: 1px solid lightgray;
    padding: 1px 10px;
    margin-left: 5px;
    width: 114px;
    margin-top: 3px;
    background: #f2f2f2;
    text-align: center;
}

.time_box1{
    border: 1px solid lightgray;
    padding: 3px 4px;
    margin-left: 5px;
    width: 114px;
    margin-top: 3px;
    background: #f2f2f2 url(../img/armchair.png);
    text-align: left;
    background-repeat: no-repeat;
    background-position: right 5% top 52%;
    font-weight: 500;
    font-size: 16px;
    color: #593a00 !important;
    background-size: 33px 32px;
}

.time_box_red{
    background: red;
    border: 1px solid lightgray;
    padding: 1px 0px;
    margin-left: 0px;
    width: 114px !important;
    margin-top: 3px;
    text-align: center;
    color: #fff;
    margin-right: 0px !important;
    margin-left: 5px;
}
.time_box_red1{
    border: 1px solid lightgray;
    padding: 3px 10px;
    margin-left: 4px;
    width: 115px!important;
    margin-top: 3px;
    text-align: center;
    color: #593a00;
    background: red url(../img/armchair.png);
    text-align: left;
    background-repeat: no-repeat;
    background-position: right 5% top 52%;
    font-weight: 500;
    font-size: 16px;
    margin-right: 0!important;
}
.time_box_green{
    background: #1ab180;
    border: 1px solid lightgray;
    padding: 1px 10px;
    margin-left: 5px;
    width: 82px;
    margin-top: 3px;
    text-align: center;
    color: #fff;
}

.modal-dialog{
    max-width: 780px;
}
.login_w{
    max-width: 500px!important;
    margin: 0 auto;
}
.login_r{
    max-width: 780px!important;
    margin: 0 auto;
}
.bx_b {
        /* box-shadow: rgb(149 157 165 / 20%) 0px 8px 24px!important; */
        background: #fff;
        padding: 18px 17px 15px;
        /* background-color: #fff; */
    }
.d_s{
    color: #fff;
    font-weight: 500;
    margin-right: 10px;
    padding-top: 5px;
}
.slots_h{
    color: #ffb400;
    padding-top: 5px;
}



.tab-label::after{
    display:none;
}
input.accr {
position: absolute;
opacity: 0;
z-index: -1;
}

.row {
display: flex;
}
.row .col {
flex: 1;
}
.row .col:last-child {
margin-left: 1em;
}

/* Accordion styles */
.tabs {
border-radius: 8px;
overflow: hidden;
box-shadow: 0 4px 4px -2px rgba(0, 0, 0, 0.5);
}

.tab {
width: 100%;
color: white;
overflow: hidden;
}
.tab-label {
display: flex;
justify-content: space-between;
padding: 0.9rem 0.7rem 0.3rem 1rem;
background: #2c3e50;
font-weight: bold;
cursor: pointer;
/* Icon */
}
.tab-label:hover {
background: #1a252f;
}
.tab-label::after {
content: "❯";
width: 1em;
height: 1em;
text-align: center;
transition: all 0.35s;
}
.tab-content {
max-height: 0;
padding: 0 1em;
color: #2c3e50;
background: white;
transition: all 0.35s;
}
.tab-close {
display: flex;
justify-content: flex-end;
padding: 1em;
font-size: 0.75em;
background: #2c3e50;
cursor: pointer;
}
.tab-close:hover {
background: #1a252f;
}

input:checked + .tab-label {
background: #1a252f;
}
input:checked + .tab-label::after {
transform: rotate(90deg);
}
input:checked ~ .tab-content {
max-height: 100vh;
padding: 1em;
}
.tabs{
height: auto;
overflow: auto;
}

    @media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 2) 
  and (orientation: portrait){
    .work_station{
        margin-top: 25px;
    }
    iframe{
        width: 100%;
    }
  }
  @media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 2) 
  and (orientation: landscape){
    iframe{
        width: 100%;
    }
  }
  @media only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 1366px) 
  and (-webkit-min-device-pixel-ratio: 2) 
  and (orientation: portrait){

  }
  @media only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 1366px) 
  and (-webkit-min-device-pixel-ratio: 2) 
  and (orientation: landscape){

  }
  
@media only screen and (max-width: 600px) {
    
.time_box1{width: 97px}
.time_box_red{width: 76px!important; margin-right: 0px !important; margin-left: 4px; }
.time_box_red1{width: 97px}
.time_box_green{width: 80px}
.time_box{
    width: 76px;
}
    .d_s {
        margin-right: 10px;
        font-size: 18px;
        margin-top: 8px;
    }
    .slots_h {
        font-size: 18px;
        margin-top: 8px;
    }
    iframe{
        width: 100%;
    }
    .work_station{
        margin-top: 25px;
    }
    .date_w{
        width: 100%;
    }
    .time_slots{
        display: block;
    }
    .date_top{
        margin-top: 5px;
    }
    .time_top{
        margin-top: 5px;
    }
    .plus_top{
        margin-top: 5px;
        text-align: right;
    }
   
}