.calendar-header {
    width: 100%;
    margin-bottom: 10px;
}

.calendar-header .previous-month-nav {
    float: left;
    width: 50px;
}

.calendar-header .next-month-nav {
    float: right;
    width: 50px;
    text-align: right;
}

.calendar-header .calendar-display-date {
    margin: 0 auto;
    text-align: center;
    width: 90%;
}

table.cal {
    width: 100%;
}

table.cal thead tr th, table.cal tbody tr td {
    text-align: center;
    width: 14.25%;
    max-width: 14.25%;
}

table.cal thead tr th {
    background-color: #f5f5f5
}

table.cal tbody tr td {
    border: #fff solid 2px;
    background: #f5f5f5;
    margin: 3px 3px;
    padding: 10px;
    vertical-align: top;
}

.dom {
    /* Day of month*/
    text-align: center;
}

table.cal tbody tr td.onswing div.svc {
    /*background-color: #5cb85c; - darker green */
    background-color: #dff0d8;
}

table.cal tbody tr td.offswing div.svc {
    /*background-color: #d9534f; - darker red */
    background-color: #f2dede;
}

.svc {
    margin-top: 5px;
    min-height: 40px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-overflow-multiline: ellipsis;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px; /* future proofing */
    -khtml-border-radius: 5px; /* for old Konqueror browsers */
}

table.cal tbody tr td.oom {
    /* out of month, ie either last month or next month */
    background: #fcfcfc;
}

table.cal tbody tr td.available {
    /* out of month, ie either last month or next month */
    background: green;
    color: #C5C5C5;
}

table.cal tbody tr td.not-available {
     /* out of month, ie either last month or next month */
     background: red;
     color: #C5C5C5;
 }

table.cal tbody tr td.selected {
    background: #fbf834;
}

 .js-slot-selection{
     padding-inline-start: 0px;
     padding-left: 10px;
     padding-right: 10px;
 }

 .booking-calendar {
      margin-right: 20px;
 }


 /*.product-column-left{*/
 /*    width: 50% !important;*/
 /*    max-width: 50% !important;*/
 /*    float: left;*/
 /*}*/

 /*.product-column-right{*/
 /*    width: 50% !important;*/
 /*    max-width: 50% !important;*/
 /*    float: right;*/
 /*}*/