#content{z-index:9 !important;}
.search_appointments{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
	grid-gap:10px;
}
.rbc-calendar{
	height:600px;
}

/* Direcotry */

.wplms_appointments_directory_main{
    display: grid;
    grid-template-columns: 2fr 1fr;
    width: 100%;
    grid-gap:15px;
}
.wplms_appointments_directory_search{
    grid-column: 1/-1;
}

.search_appointments{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
  	grid-gap:30px;

    align-items: center;
}
.search_appointments input{height:38px;}
.instructor_calendar .rbc-time-header-gutter {
    display: none;
}
.instructor_calendar .rbc-time-gutter {
    display: none;
}
.wplms_appointments_calendar{
    transition: all 0.5s;
    border: 1px solid rgba(0,0,0,0.1);
    padding: 15px 15px 5px;
    position:relative;
}

.wplms_appointments_calendar:before {
    content: '';
    border: 10px solid;
    position: absolute;
    left: -20px;
    top: 30px;
    border-color: transparent rgba(0,0,0,0.1) transparent transparent;
}

.wplms_appointments_calendar:after {
    content: '';
    border: 9px solid;
    position: absolute;
    left: -18px;
    top: 31px;
    border-color: transparent #fff transparent transparent;
}

.instructor_main {
    display: grid;
    grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
    grid-gap: 10px;
}

.instructor_main >div {
    background: #fafafa;
    padding: 10px;
    border-radius: 5px;
}

.instructor_main >div > span {
    display: block;
}

.wplms_appointments_directory {}
.wplms_appointments_directory_instructor_list{
    width:100%;
}
.appointment_instructor_wrapper{
  position:relative;
}
.appointment_instructor{
    width: 100%;
    transition:all 0.3s;
}

.course_bookings .course_instructors {
    margin:15px 0;
    display: grid;
    grid-template-columns: repeat(auto-fill,minmax(320px,1fr));
    grid-gap: 2rem;
}

.appointment_instructor_content {
    border-radius: 5px;
    display: grid;
    grid-gap: 1rem;
    grid-template-columns: minmax(80px,1fr) 4fr;
    position: relative;
}

.appointment_instructor .instructor_image{text-align:center;position:relative;}
.appointment_instructor .instructor_image img{width:100%;border-radius:5px;}

.instructor_avatar{
      position: relative;
    text-align: center;
    border-radius: 5px;
    overflow: hidden;
}
.instructor_avatar > span{
    position:absolute;
    top:0;left:0;color:#fff;padding:5px;border-radius:5px 5px 0 0;
    width: 100%;
    font-size:11px;text-transform:uppercase;letter-spacing:1px
}.instructor_name h3{margin:0;line-height: 1;text-transform: capitalize;
    margin-bottom: 10px;}
.instructor_price > div {
    grid-gap: 5px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    font-size: 12px;
    font-weight: 600;
}
.instructor_extras {
    margin: 0 0 10px;
}
.instructor_details .instructor_header .instructor_extras{
    float:right;
}
.instructor_details .instructor_bio{
    margin:15px 0;
}
.instructor_image .instructor_price > .amount{
    font-size: 24px;
    font-weight: 600;
    /*display: block;*/
    /*margin: 10px 0;*/
    margin: 10px 4px;
    color: #34ca34;
}

.instructor_image .instructor_price > .slot_price_text{
    color: #c4551d;
    font-size: 24px;
}

.instructor_calendar_wrapper{
	position:relative;
}
.instructor_calendar{
  width:100%;
  background:#fff;
  border-radius:5px;
}

.wplms_appointments_instructors{
    margin:30px 0;
}
.instructor_calendar_wrapper > .instructor_calendar{
    position:absolute;
}
.appointment_instructor_wrapper+.appointment_instructor_wrapper{
    margin-top:30px;
}
.instructor_calendar .rbc-toolbar{display:none;}
.instructor_calendar .rbc-calendar{
	height:auto;
}
.instructor_calendar .rbc-day-slot .rbc-event{
	border:none;
	background:none;padding:0;
}
.instructor_calendar .rbc-day-slot .rbc-event .event_content{
	background: rgb(109, 237, 139);
    position: absolute;
    top: 0;
    left: 0;padding:10px 0;
    width: 100%;
    height: 100%;
}
.custom_datetimeselector{display:grid;grid-template-columns:repeat(auto-fit,minmax(40px,1fr));grid-gap:15px;}
.custom_datetimeselector input[type="text"] {
width: 100%;
min-height: 38px;
}

.instructor_header{
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(120px,1fr));
    grid-gap:5px;
    align-items: center;
}
.css-vj8t7z{
	border-radius:0 !important;
}
.search_appointments > .search_item:last-child{justify-self: flex-end;}

.instructor_main_details {
    display: grid;
    grid-template-columns: 120px minmax(200px,3fr) minmax(120px,1fr);
    margin: 15px 0;grid-gap:10px;
}

.instructor_fields {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(80px,1fr));
    align-items: center;
    grid-gap: 10px;
}

.instructor_labels > span {
    padding: 3px 5px;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    border-radius: 2px;
}

.instructor_fields > div {
    background: #fafafa;
    border-radius: 5px;
    padding: 5px 10px;
}

.estimated_price {
    background: #eee;
    padding: 10px 20px;
    border-radius: 5px;
    font-size: 20px;
}.estimated_price > strong{
    margin-right:15px;
}

.appointments_loading{
    text-align:center;
    margin:15px 0;
}

.loading-ripple {
  display: inline-block;
  position: relative;
  width: 64px;
  height: 64px;
}
.loading-ripple div {
  position: absolute;
  border: 4px solid rgba(0,0,0,0.2);
  opacity: 1;
  border-radius: 50%;
  animation: loading-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}
.loading-ripple div:nth-child(2) {
  animation-delay: -0.5s;
}
@keyframes loading-ripple {
  0% {
    top: 28px;
    left: 28px;
    width: 0;
    height: 0;
    opacity: 1;
  }
  100% {
    top: -1px;
    left: -1px;
    width: 58px;
    height: 58px;
    opacity: 0;
  }
}

/* Search blocks */
.multiselect > .multiselect_options{
    display: none; 
    width: 100%;
    position: absolute;
    z-index: 9;padding-top: 15px;
}
.multiselect_options > ul {
    position: absolute;
    z-index: 1;
    background: #fff;
    width: 100%;
    border: 1px solid rgba(0,0,0,0.1);
    
    padding: 5px 15px;
    z-index: 9;
}

.multiselect .multiselect_label {
    border: 1px solid rgba(0,0,0,0.1);
    padding: 8px 15px;
}

.multiselect:hover > .multiselect_options {
    display: block;
}

.multiselect {
    position: relative;
}

.multiselect_options > ul:before {
    content: '';
    border: 8px solid;
    position: absolute;
    top: -16px;
    left: 15px;
    border-color: transparent transparent #eee  transparent;
}

.multiselect_options > ul:after {
    content: '';
    border: 8px solid;
    position: absolute;
    top: -14px;
    left: 15px;
    border-color: transparent transparent #fff transparent;
}

.wa_active_filters {
    
}

.wa_active_filters .active_filter>span:first-child{
    font-weight: 300;
    margin: -5px -10px;
    padding: 7px 10px;
    background: rgba(0,0,0,0.1);
}
.wa_active_filters .active_filter {
    float:left;border-radius: 5px;
    overflow: hidden;margin:8px;
    border: 1px solid rgba(0,0,0,0.1);
    padding: 5px 20px 5px 10px;position: relative;
}
.wa_active_filters .active_filter span+span{margin-left:20px;}
.wa_active_filters .active_filter .remove_filter:before{
    content:"\f00d";
    font-family: fontawesome;
    position: absolute;right:5px;top:5px;color:red;
}

/*.book_lesson{color:#fff;}*/
.wplms_appointments_directory .book_lesson.button a {
    /*color:#fff !important;*/
    font-size: 12px;
    font-weight: 600;
}

.instructor_featured {
    padding-bottom: 56.25%;
    position: relative;
}

.instructor_featured i{
    font-size: 21px;
    color: #fff;
    cursor: pointer;
    padding: 12px 25px 12px 28px;
    background-color: #000;
    opacity: .8;
    position: absolute;
    margin-left: -36px;
    left: 50%;
    width: 70px;
    height: 45px;
    border-radius: 6px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.instructor_directory_show_calendar{display:none;}

/* For Mobile Devices */
@media(max-width:600px){
    .wplms_appointments_calendar .instructor_calendar{
        display:none;
    }

    .wplms_appointments_directory_main,.appointment_instructor_content {
        grid-template-columns: 1fr;
    }
    .instructor_details .instructor_header .instructor_extras{grid-columns:1/3;}
    .instructor_details .instructor_header .instructor_extras .button{width:100%;}
}



@media(min-width:600px){
    .instructor_details span.instructor_directory_show_calendar {display:none;}
}