.colors {
text-align: center;
}
.colors .color-container {
display: inline-block;
margin: 15px;
font-weight: 700;
}
.colors .color-container span {
display: inline-block;
width: 20px;
height: 20px;
margin-right: 5px;
margin-bottom: -5px;
}
.colors .color-container span.color-available {
background: #90c689;
}
.colors .color-container span.color-waiting {
background: #bb332d;
}
.colors .color-container span.color-booked {
background: #285894;
}
.calendar {
display: flex;
flex-wrap: wrap;
margin: 20px 0;
width: 100%;
}
.calendar .week {
display: flex;
width: 100%;
flex-wrap: nowrap;
margin: 5px 0;
}
.calendar .week .date {
flex: 1;
border-radius: 10px;
margin-right: 15px;
}
.calendar .week .date:nth-child(7n) {
margin-right: 0;
}
.calendar .week .date .title {
text-align: center;
font-weight: 600;
font-size: 16px;
padding: 10px;
background: #fff;
border-top-right-radius: 10px;
border-top-left-radius: 10px;
}
.calendar .week .date .hours {
background: #FFF;
padding: 1px 1px;
text-align: center;
}
.calendar .week .date .hours .hours-select {
text-align: center;
transition: all ease .3s;
}
.calendar .week .date .hours .hours-select.available:hover {
cursor: pointer;
font-weight: 600;
}
.calendar .week .date .hours .hours-select.available {
background: #90c689;
}
.calendar .week .date .hours .hours-select.available.selected {
border: 1px solid #000;
font-weight: 600;
background: #C00006;
color:#fff;
}
.calendar .week .date .hours .hours-select.not-available {
background: #e4e8f6;
border-bottom: 1px solid #fff;
}
.carousel-inner {
overflow:inherit;
}
.carousel-control-prev {
left: 10px;
}
.carousel-control-prev span,
.carousel-control-next span {
font-size:1em !important;
}
.carousel-control-next {
right: 10px;
}
.carousel-control {
position: absolute;
bottom: -41px; 
z-index: 5;
display: inline-block;
} .carousel-fade .carousel-item {
opacity: 0;
transition-duration: .6s;
transition-property: opacity;
}
.carousel-fade .carousel-item.active,
.carousel-fade .carousel-item-next.carousel-item-left,
.carousel-fade .carousel-item-prev.carousel-item-right {
opacity: 1;
}
.carousel-fade .active.carousel-item-left,
.carousel-fade .active.carousel-item-right {
opacity: 0;
}
.carousel-fade .carousel-item-next,
.carousel-fade .carousel-item-prev,
.carousel-fade .carousel-item.active,
.carousel-fade .active.carousel-item-left,
.carousel-fade .active.carousel-item-prev {
transform: translateX(0);
transform: translate3d(0, 0, 0);
}
.carousel-control-next, .carousel-control-prev {
opacity: 1;
top:auto !important;
bottom:-62px !important;
width: auto;
}
.carousel-control-next-icon,
.carousel-control-prev-icon {
background-color: #124189;
border-radius: 50%;
padding: 15px;
background-size: 50%;
} .modal {
z-index: 99999;
}
@media screen and (max-width: 767px) {
.carousel-control-prev span, 
.carousel-control-next span,
.calendar .week .date .hours .hours-select.not-available,
.calendar .week .date .hours .hours-select.available {
font-size: 0.8em !important;
}
}