.organizer_holder
{
	max-width:900px;
	width:80vw;
	height:auto;
	margin:10vh 0 10vh 0;
	box-shadow:0 20px 80px #c8c8c8;
	padding:80px;
	background:#fff;
	overflow:hidden;
}



@media screen and (max-width: 800px) 
{
	.organizer_holder
	{
		width:100vw;
		max-width:none;
		min-height:100vh;
		height:auto;
		margin:0;
		padding:80px 20px 80px 20px;
		background:#fff;
		overflow:hidden;
		border-radius:10px;
	}
}




.frontend_content_block
{
	width:calc(100% + 40px);
}

.frontend_content_block .full_block
{
	width:calc(100% - 40px);
	margin:5px 20px 5px 20px;
}

.frontend_content_block .half_block
{
	width:calc(50% - 40px); 
	margin:5px 20px 5px 20px;
}

.frontend_content_block .label
{
	font-family:"500";
	color:#29353D;
	font-size:12px;
	line-height:22px;
	text-align:left;
	opacity:1;
}

.frontend_content_block .input
{
	font-family:"600";
	height:50px;
    line-height:20px;
    padding:15px;
    background:#f4f4f4;
    margin:10px 0 10px 0;
    text-align:left;
    color:#222f3e;
    text-transform:uppercase;
    font-size:11px;
    border-radius:0;
}

.frontend_content_block .select
{
	font-family:"600";
	height:50px;
    line-height:20px;
    padding:15px;
    background:#f4f4f4;
    margin:10px 0 10px 0;
    text-align:left;
    color:#222f3e;
    text-transform:uppercase;
    font-size:11px;
    border-radius:0;
}

.frontend_content_block .textarea
{
	height:100px;
    line-height:20px;
    padding:10px 15px 10px 15px;
    background:#f4f4f4;
    margin:10px 0 20px 0;
    text-align:left;
    border-radius:0;
}












































































.availability_calendar
{
	width:100%;
	height:60vh;
	overflow:hidden;
	border-radius:10px;
	margin:0 0 20px 0;
	background:#fff;
	overflow:hidden;
	padding:10px;
}





.availability_calendar .legend
{
	width:100%;
	height:40px;
	margin:0 0 2px 0;
	display:flex !important;
	overflow:hidden;
}

.availability_calendar .legend .item
{
	width:calc(14.2857% - 2px);
	height:40px;
	margin:1px;
	background:#282828;
	line-height:40px;
	font-weight:600;
	text-align:center;
	font-size:10px;
	text-transform:uppercase; 
	color:#fff;
	letter-spacing:1px;
}






.availability_calendar .calendar
{
	width:100%;
	height:calc(100% - 44px);
	overflow-y:auto;
	overflow-x:hidden;
	display:flex !important;
}



.availability_calendar .calendar .scale
{
	position:absolute;
	width:calc(100% - 0);
	height:100%;
	pointer-events:none;
}

.availability_calendar .calendar .scale .hour
{
	height:4.1666%;
	border-bottom:2px solid rgba(0,0,0,0.03);
}

.availability_calendar .calendar .scale .hour:last-child
{
	border:none;
}

.availability_calendar .calendar .scale .hour .label
{
	position:absolute;
	left:3px;
	top:3px;
	height:8px;
	font-weight:600;
	color:#222f3e;
	font-size:8px;
	line-height:8px;
}

.availability_calendar .calendar .scale .hour .quarter_hour
{
	height:25%;
	border-bottom:1px solid rgba(0,0,0,0.03);
}








.availability_calendar .day
{
	width:calc(14.2857% - 2px);
	margin:1px;
}

.availability_calendar .day .timeslots
{
	background:#fff;
}

.availability_calendar .day .timeslots.no_workday
{
	background:#f4f4f4;
}

.availability_calendar .day .timeslots .timeslot
{
	height:5px;
}

.availability_calendar .day .timeslots .timeslot:hover
{
	background:#FF7062;
}

.availability_calendar .day .timeslots .timeslot_selected
{
	background:#FF7062;
}

.availability_calendar .day .timeslots .timeslot_selected:hover
{
	background:#b33939;
}

.availability_calendar .day .timeslots .timeslot_hovered
{
	background:#999;
}

.availability_calendar .day .timeslots .timeslot_hovered_add
{
	background:rgba(33,140,116,0.5);
}

.availability_calendar .day .timeslots .timeslot_hovered_remove
{
	background:rgba(179,57,57,0.5);
}













.availabilities_calendar
{
	width:100%;
	height:60vh;
	border-radius:10px;
	margin:10px 0 0 0;
	background:#fff;
	overflow:hidden;
	padding:10px;
}

.availabilities_calendar .legend
{
	width:100%;
	height:40px;
	margin:0 0 2px 0;
	display:flex !important;
	overflow:hidden;
}

.availabilities_calendar .legend .item
{
	width:calc(25% - 2px);
	height:40px;
	margin:1px;
	background:#282828;
	line-height:40px;
	font-weight:600;
	text-align:center;
	font-size:10px;
	text-transform:uppercase; 
	color:#fff;
	letter-spacing:1px;
}

.availabilities_calendar .calendar
{
	width:100%;
	height:calc(100% - 44px);
	overflow-y:auto;
	overflow-x:hidden;
	display:flex !important;
}

.availabilities_calendar .calendar .scale
{
	position:absolute;
	width:calc(100% - 0);
	height:100%;
	pointer-events:none;
}

.availabilities_calendar .calendar .scale .hour
{
	height:4.1666%;
	border-bottom:2px solid rgba(0,0,0,0.03);
}

.availabilities_calendar .calendar .scale .hour:last-child
{
	border:none;
}

.availabilities_calendar .calendar .scale .hour .label
{
	position:absolute;
	left:3px;
	top:3px;
	height:8px;
	font-weight:600;
	color:#222f3e;
	font-size:8px;
	line-height:8px;
}

.availabilities_calendar .calendar .scale .hour .quarter_hour
{
	height:25%;
	border-bottom:1px solid rgba(0,0,0,0.03);
}

.availabilities_calendar .availability
{
	width:calc(25% - 2px);
	margin:1px;
	border-radius:3px;
}

.availabilities_calendar .availability .timeslots
{
	background:#fff;
}

.availabilities_calendar .availability .timeslots.no_interaction
{
	background:#f4f4f4;
}

.availabilities_calendar .availability .timeslots .timeslot
{
	height:5px;
}

.availabilities_calendar .availability .timeslots .timeslot:hover
{
	background:#529ED8;
}

.availabilities_calendar .availability .timeslots .timeslot_selected
{
	background:#529ED8;
}

.availabilities_calendar .availability .timeslots .timeslot_selected:hover
{
	background:#b33939;
}









.unavailable_service_selector
{
	margin:20px 0 0 0;
}

.unavailable_service_selector .service
{
	width:100%;
	height:40px;
	margin:0 0 10px 0;
	background:#fff;
	border-radius:3px;
}

.unavailable_service_selector .service .icon
{
	position:absolute;
	left:0;
	top:0;
	width:50px;
	height:50px;
}

.unavailable_service_selector .service .label
{
	position:absolute;
	left:50px;
	top:0;
	width:calc(100% - 150px);
	height:40px;
	padding:0 15px 0 15px;
	line-height:40px;
	font-family:"600";
	text-align:left;
	font-size:10px;
	text-transform:uppercase;
	color:#222f3e;
}

.unavailable_service_selector .service .toggle
{
	position:absolute;
	right:10px;
	top:10px;
	width:35px;
	height:20px;
	border-radius:3px;
	background:rgba(33,140,116,1);
}

.unavailable_service_selector .service .toggle .switch
{
	position:absolute;
	right:2px;
	top:2px;
	width:16px;
	height:16px;
	border-radius:8px;
	background:#fff;
}

.unavailable_service_selector .service.unavailable
{

}

.unavailable_service_selector .service.unavailable .label 
{
	color:#222f3e;
}

.unavailable_service_selector .service.unavailable .toggle
{
	background:rgba(179,57,57,1);
}

.unavailable_service_selector .service.unavailable .toggle .switch
{
	left:2px;
}









.appointment_selector
{

}

.appointment_selector.frontend
{
}

.appointment_selector .menu
{
	position:absolute;
	top:50%;
	width:calc(100% + 100px);
	height:40px;
	box-shadow:none;
	height:auto;
	margin-top:-16px;
}


.appointment_selector .menu .button
{
	position:absolute;
	width:40px;
	height:40px;
	line-height:40px;
	text-align:center;
	font-weight:700;
	font-size:10px;
	letter-spacing:2px;
	color:#282828; 
	text-transform:uppercase;
	background-color:#fff !important;
	border-radius:10px;
	cursor:pointer;
}

.white_content .appointment_selector .menu .button
{
	background-color:#f8f8f8 !important;
}

.appointment_selector .menu .button.previous
{
	left:0;
	background-image:url('../img/previous_icon_dark.png');
	background-position:center center !important;
	background-size:14px auto !important;
	background-repeat:no-repeat !important;
}

.appointment_selector .menu .button.next
{ 
	right:0;
	background-image:url('../img/next_icon_dark.png');
	background-position:center center !important;
	background-size:14px auto !important;
	background-repeat:no-repeat !important;
}

.appointment_selector .menu .button:hover
{
	color:#fff; 
	background-color:#282828 !important;
}

.appointment_selector .menu .button.previous:hover
{
	background-image:url('../img/previous_icon_light.png');
}

.appointment_selector .menu .button.next:hover
{
	background-image:url('../img/next_icon_light.png');
}

.appointment_selector .calendar_holder
{
	width:100%;
	height:auto;
	margin:0 0 20px 0;
}

.appointment_selector .day
{
	width:calc(14.2857% - 4px);
	margin:2px;
}

.appointment_selector .day .label
{
	height:40px;
	padding:8px 0 8px 0;
	background:#282828;
	line-height:12px;
	text-align:center;
	font-weight:700;
	font-size:10px;
	letter-spacing:1px;
	text-transform:uppercase;
	color:#fff;
	margin:0 0 2px 0;
	border-radius:10px;
}

.appointment_selector .day .timeslot
{
	width:100%;
	height:40px;
	padding:10px;
	background:#fff;
	text-align:center;
	font-weight:700;
	text-transform:uppercase;
	font-size:12px;
	color:#282828;
	letter-spacing:1px;
	margin:2px 0 2px 0;	
	border-radius:10px;	
	cursor:pointer;
}

.white_content .appointment_selector .day .timeslot
{
	background:#f8f8f8 !important;
}

.appointment_selector .day .timeslot .time
{
	height:20px;
	line-height:20px;
	font-size:12px;
	font-weight:700;
	text-transform:uppercase;
	margin:0 0 5px 0;
	text-align:left;
	background-image:url('../img/clock_icon.png');
	background-position:left center !important;
	background-size:auto 10px !important;
	background-repeat:no-repeat !important;
	padding:0 0 0 20px;
	color:#282828;
	letter-spacing:1px;
}

.appointment_selector .day .timeslot .resources
{
	height:24px;
	width:calc(100% + 4px);
}

.appointment_selector .day .timeslot .resources .resource
{
	height:20px;
	margin:2px;
	width:auto;
	padding:0 7px 0 7px;
	line-height:20px;
	font-size:8px;
	background:#f4f4f4;
	border-radius:3px;
	color:#BFBFBF;
	font-family:"600";
	text-transform:uppercase;
}

.appointment_selector .day .timeslot.selected
{
	box-shadow:inset 0 0 0 2px #529ED8 !important;	
}


.appointment_selector.frontend .selection
{
	width:calc(100% - 0px);
	margin:50px 0 0 0;
	box-shadow:inset 0 0 0 2px #f4f4f4 !important;
}

.appointment_selector .selection .appointment
{
	height:40px;
	background:#fff;
	margin:0 0 20px 0;
	cursor:pointer;
	border-radius:3px;
	text-align:center;
	font-family:"600";
	font-size:10px;
	line-height:40px;
	text-transform:uppercase;
}

.appointment_selector.frontend .selection .appointment
{
	background:#f4f4f4;
}

.appointment_selector .selection .appointment:first-child
{
}

.appointment_selector .selection .appointment:last-child
{
}

.appointment_selector .selection .appointment:hover
{

}

.appointment_selector .selection .appointment:hover:before
{
	content:"X";
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:#b33939;
	border-radius:3px;
	opacity:0.5;
	text-align:center;
	font-family:"600";
	font-size:12px;
	line-height:40px;
	text-transform:uppercase;
	color:#fff;
}









.organizer_frontend_appointment_selector
{

}

.organizer_frontend_appointment_selector .organizer_frontend_menu
{
	width:calc(100% + 4px);
	height:auto;
	margin:0 0 20px 0;
}

.organizer_frontend_appointment_selector .organizer_frontend_menu .item
{
	width:calc(50% - 4px);
	height:50px;
	margin:0 2px 0 2px;
	line-height:50px;
	text-align:center;
	font-family:"600";
	font-size:11px;
	text-transform:uppercase;
	background:#f4f4f4;
}

.organizer_frontend_appointment_selector .calendar_holder
{
	width:calc(100% + 4px);
	height:auto;
}

.organizer_frontend_appointment_selector .day
{
	width:calc(14.2857% - 4px);
	margin:0 2px 0 2px;
}

.organizer_frontend_appointment_selector .day .label
{
	padding:20px;
	background:#222f3e;
	line-height:20px;
	text-align:center;
	font-family:"600";
	font-size:11px;
	text-transform:uppercase;
	color:#fff;
	margin:0 0 20px 0;	
}

.organizer_frontend_appointment_selector .day .timeslot
{
	padding:20px;
	background:#f4f4f4;
	margin:0 0 10px 0;	
}






.appointments_menu
{
	width:calc(100% + 20px);
	margin:30px 0 30px 0;	
}

.appointments_menu .item
{
	width:calc(16.66% - 20px);	
	margin:10px;
	height:50px;
	line-height:50px;
	text-align:center;
	font-family:"600";
	font-size:11px;
	text-transform:uppercase;
	background:#f4f4f4;
}

.appointments_menu .item:hover, .appointments_menu .item.selected
{
	background:#222f3e;
	color:#fff;
}





.appointments_list_calendar_switch
{
	height:30px;
	margin:20px 0 20px 0;
}

.appointments_list_calendar_switch .button
{
	width:30px;
	height:30px;
	margin:0 10px 0 0;
	background:#f4f4f4;
	background-size:40% auto !important;
	background-position:center center !important;
	background-repeat:no-repeat !important;
}

.appointments_list_calendar_switch .selected
{
	background:#222f3e;
}

.appointments_list_calendar_switch .list_button
{
	background-image:url('../img/list_dark.png');
}

.appointments_list_calendar_switch .list_button.selected
{
	background-image:url('../img/list_light.png');
}

.appointments_list_calendar_switch .calendar_button
{
	background-image:url('../img/calendar_dark.png');
}

.appointments_list_calendar_switch .calendar_button.selected
{
	background-image:url('../img/calendar_light.png');
}





.appointments_calendar_holder
{
	width:calc(100% + 20px);
	background:#fff;
	border-radius:20px;
	box-shadow:0 10px 80px -30px rgba(0,0,0,0.4);
	margin:20px 0 80px 0;
}



.appointments_calendar_holder .scale
{
	position:absolute;
	top:10px;
	top:10px;
	width:calc(100% - 20px);
	height:100%;
	pointer-events:none;
}

.appointments_calendar_holder .scale .hour
{
	height:4.1666%;
	border-bottom:2px solid rgba(0,0,0,0.1);
}

.appointments_calendar_holder .scale .hour:last-child
{
	border:none;
}

.appointments_calendar_holder .scale .hour .label
{
	position:absolute;
	left:5px;
	top:5px;
	height:9px;
	font-family:"600";
	color:#222f3e;
	font-size:9px;
	line-height:9px;
}

.appointments_calendar_holder .scale .hour .quarter_hour
{
	height:25%;
	border-bottom:1px solid rgba(0,0,0,0.1);
}



.appointments_calendar_holder .list
{
	position:absolute;
	left:60px;
	top:0;
	width:calc(100% - 120px);
}

.appointments_calendar_holder .appointment
{
	position:absolute;
	width:calc(33.33% - 10px);
	background:rgba(255,255,255,0.8);
	margin:10px 5px 10px 5px;
	box-shadow:0 5px 40px -10px rgba(0,0,0,0.4);
	border-radius:3px;
}

.appointments_calendar_holder .offset_1
{
	left:0;
}

.appointments_calendar_holder .offset_2
{
	left:33.33%;
}

.appointments_calendar_holder .offset_3
{
	left:66.66%;
}

.appointments_calendar_holder .appointment .title
{
	position:absolute;
	left:5px;
	top:2px;
	width:calc(100% - 10px);
	height:18px;
	font-family:"600";
	color:#222f3e;
	font-size:11px;
	line-height:18px;
	text-align:left;
}

.appointments_calendar_holder .appointment .time_name
{
	position:absolute;
	left:5px;
	top:20px;
	width:calc(100% - 10px);
	height:18px;
	font-family:"500";
	color:#222f3e;
	font-size:9px;
	line-height:18px;
	text-align:left;
}

.appointments_calendar_holder .appointment .description
{
	position:absolute;
	left:5px;
	top:38px;
	width:calc(100% - 10px);
	height:18px;
	font-family:"500";
	color:#222f3e;
	font-size:9px;
	line-height:18px;
	text-align:left;
}





.appointments_list_holder
{

}

.appointments_list_holder .list
{

}

.appointments_list_holder .list .appointment
{
	width:100%;
	padding:20px;
	margin:20px 0 20px 0;
	background:#fff;
	border-radius:3px;
}

.appointments_list_holder .list .appointment:hover
{
	box-shadow:0 5px 30px -10px rgba(0,0,0,0.4);
}

.appointments_list_holder .list .appointment .time
{
	height:20px;
	font-family:"600";
	color:#222f3e;
	font-size:11px;
	line-height:20px;
	text-align:left;
	opacity:0.7;
}

.appointments_list_holder .list .appointment .label
{
	height:20px;
	font-family:"600";
	color:#222f3e;
	font-size:11px;
	line-height:20px;
	text-align:left;
	margin:10px 0 10px 0;
}

.appointments_list_holder .list .appointment .button_holder
{
	width:auto;
	height:30px;
}

.appointments_list_holder .list .appointment .button_holder .button
{
	width:100px;
	height:30px;
	text-align:center;
	border-radius:15px;
	line-height:40px;
	font-family:"600";
	background:#CCE3FD;
	margin:0 5px 0 5px;
	line-height:30px;
	font-size:11px;
	color:#647B98;
}




















.search_list
{
	margin:50px 0 80px 0;
}

.search_list .no_results
{
	width:100%
	height:40px;
	line-height:40px;
    font-size:12px;
    font-family:"600";
    text-transform:uppercase;
    text-align:center;
    color:#BFBFBF;
}

.search_list .appointment
{
	width:100%;
	padding:20px;
	margin:0 0 20px 0;
	background:#fff;
	border-radius:3px;
}

.search_list .appointment:hover
{
	box-shadow:0 5px 30px -10px rgba(0,0,0,0.4);
}

.search_list .appointment .time
{
    height: 20px;
    line-height: 20px;
    font-size: 11px;
    font-family: "600";
    text-transform: uppercase;
    margin: 0 0 10px 0;
    text-align: left;
    background-image: url(../img/appointmentadd_icon.png);
    background-position: left center !important;
    background-size: auto 14px !important;
    background-repeat: no-repeat !important;
    padding: 0 0 0 20px;
}

.search_list .appointment .label
{
	height:20px;
	font-family:"600";
	color:#222f3e;
	font-size:12px;
	line-height:20px;
	text-align:left;
	margin:0 0 10px 0;
    font-family: "600";
    text-transform: uppercase;
}

.search_list .appointment .details
{
	height:20px;
	font-family:"600";
	font-size:10px;
	line-height:20px;
	text-align:left;
	margin:0 0 10px 0;
    font-family: "600";
    text-transform: uppercase;
	color:#BFBFBF;
}

.search_list .appointment .resources
{
	height:24px;
	width:calc(100% + 4px);
}

.search_list .appointment .resources .resource
{
	height:20px;
	margin:2px;
	width:auto;
	padding:0 7px 0 7px;
	line-height:20px;
	font-size:8px;
	background:#f4f4f4;
	border-radius:3px;
	color:#BFBFBF;
	font-family:"600";
	text-transform:uppercase;
}











.resource_selector
{
	width:100%;
	margin:0 0 20px 0;
}

.resource_selector .resource
{
	width:100%;
	margin:10px 0 10px 0;
	height:50px;
	background-color:#fff;
	border-radius:3px;
}

.resource_selector .resource .icon 
{
    position:absolute;
    left:0;
    top:0;
    width:70px;
    height:50px;
    background-size: auto 30% !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
}

.resource_selector .resource .label
{
	position:absolute;
	left:70px;
	top:0;
	width:calc(100% - 150px);
	height:50px;
	padding:0 15px 0 0;
	line-height:50px;
	font-family:"600";
	text-align:left;
	font-size:10px;
	text-transform:uppercase;
}

.resource_selector .resource .checkbox_holder
{
	position:absolute;
	top:0;
	right:0;
	width:308px;
	height:50px;
}

.resource_selector .resource .checkbox_holder .checkbox
{
	width:154px;
	height:50px;
	border-left:2px solid #f4f4f4;
	line-height:50px;
	font-family:"600";
	text-align:center;
	font-size:10px;
	text-transform:uppercase;
	cursor:pointer;
}

.resource_selector .resource .checkbox_holder .checkbox.checked
{
	background-color:#529ED8 !important;
	color:#fff;
	box-shadow:0 3px 35px -5px #529ED8;
}

.resource_selector .resource .addbox_holder
{
	position:absolute;
	top:0;
	right:0;
	width:154px;
	height:50px;
}

.resource_selector .resource .addbox_holder .addbox
{
	width:154px;
	height:50px;
	border-left:4px solid #fff;
	line-height:50px;
	font-family:"600";
	text-align:center;
	font-size:11px;
	text-transform:uppercase;
}

.resource_selector .resource .addbox_holder .addbox.checked
{
	background:#222f3e;
	color:#fff;
}










.organizer_list_menu
{
	width:100%;
	margin:60px 0 20px 0;
}

.organizer_list_menu .item
{
	width:100%;
	height:50px;
	margin:0 0 20px 0;
	background:#fff;
	border-radius:3px;
}

.organizer_list_menu .item:hover
{
	box-shadow:0 5px 30px #CFD2E6;
}

.organizer_list_menu .item .icon
{
	position:absolute;
	left:0;
	top:0;
	width:70px;
	height:50px;
	background-size:auto 30% !important;
	background-position:center center !important;
	background-repeat:no-repeat !important;
}

.organizer_list_menu .item .label
{
	position:absolute;
	left:70px;
	top:0;
	width:calc(100% - 150px);
	height:50px;
	padding:0 15px 0 0;
	line-height:50px;
	font-family:"600";
	text-align:left;
	font-size:11px;
	text-transform:uppercase;
}














.organizer_detail_list_menu
{
	width:100%;
	margin:20px 0 20px 0;
}

.organizer_detail_list_menu .item
{
	width:100%;
	margin:0 0 20px 0;
	background:#f4f4f4;
	padding:40px;
}

.organizer_detail_list_menu .item .icon
{
	position:absolute;
	left:0;
	top:50%;
	width:70px;
	height:50px;
	margin-top:-25px;
	background-size:auto 30% !important;
	background-position:center center !important;
	background-repeat:no-repeat !important;
}

.organizer_detail_list_menu .item .label
{
	top:0;
	width:calc(100% - 150px);
	padding:0 15px 0 0;
	line-height:24px;
	font-family:"600";
	text-align:left;
	font-size:11px;
	text-transform:uppercase;
}

.organizer_detail_list_menu .item .buttons
{
	position:absolute;
	right:0;
	top:0;
	width:auto;
	height:50px;
}

.organizer_detail_list_menu .item .buttons .button
{
	width:54px;
	height:50px;
	font-family:"600";
	text-align:center;
	line-height:50px;
	text-transform:uppercase;
	border-left:4px solid #fff;
	background-size:30% auto !important;
	background-repeat:no-repeat !important;
	background-position:center center !important;
}

.organizer_detail_list_menu .item .buttons .button:hover
{
	background:#222f3e;
	color:#fff;
}

.organizer_detail_list_menu .item .buttons .settings_button
{
	background-image:url('../img/settings_dark.png');
}

.organizer_detail_list_menu .item .buttons .settings_button:hover
{
	background-image:url('../img/settings_light.png');
}

.organizer_detail_list_menu .item .buttons .calendar_button
{
	background-image:url('../img/calendar_dark.png');
}

.organizer_detail_list_menu .item .buttons .calendar_button:hover
{
	background-image:url('../img/calendar_light.png');
}




.organizer_label
{
	height:20px;
	line-height:20px;
	font-family:"600";
	text-align:left;
	font-size:12px;
	margin:0 0 10px 0;
}

.organizer_input
{
	height:50px;
	background:#fff;
	padding:15px;
	line-height:20px;
	font-family:"600";
	text-align:left;
	font-size:12px;
	margin:0 0 20px 0;
	border-radius:3px;
}





.appointments_headline
{
	height:30px;
	font-family:"600";
	text-align:center;
	font-size:16px;
	line-height:30px;
	margin:30px 0 20px 0;
}







.organizer_hero
{
	width:calc(100vw - 100px);
	height:50px;
	font-family:"600";
	text-align:center;
	font-size:12px;
	line-height:50px;
	margin:0px 0 0px 0;
	text-transform:uppercase;
	background:#fff;
	color:#222f3e !important;
	box-shadow:0 0 0 2px #f4f4f4;
	z-index:888;
}

.organizer_hero.margin
{
	margin:0 0 50px 0;
}

.organizer_hero .menu
{
	position:absolute;
	width:auto;
	height:50px;
	right:10px;
	top:0;
	font-family:"600";
	text-align:center;
	font-size:16px;
	line-height:50px;
	margin:0;
}

.organizer_hero .menu .item
{
	height:30px;
	width:auto;
	font-family:"600";
	text-align:left;
	line-height:30px;
	text-transform:uppercase;
	font-size:9px;
	padding:0 15px 0 15px;
	border-radius:3px !important;
	margin:10px 5px 10px 5px;
	color:#BFBFBF;
	box-shadow:inset 0 0 0 2px #f4f4f4;
}

.organizer_hero .menu .item:hover
{
	box-shadow:inset 0 0 0 2px #529ED8;
	color:#222f3e;
}



:root {
  --calendar-width:calc(100vw - 100px);  
  --calendar-item-width:calc(var(--calendar-width)/7);  
}














.appointments_week_calendar_holder
{
	width:var(--calendar-width);
	height:calc(100vh - 190px);
	overflow-x:auto;
	overflow-y:hidden;
	border-radius:0px;
	margin:0 0 -10px 0;
}

















.appointments_week_calendar_holder .calendar
{
	width:auto !important;
	min-width:calc(100vw - 100px);
	height:calc(100% - 50px);
	overflow-y:auto;
	overflow-x:hidden;
	display:flex !important;
}



.appointments_week_calendar_holder .calendar .scale
{
	position:absolute;
	width:calc(100% - 0);
	height:100%;
	pointer-events:none;
}

.appointments_week_calendar_holder .calendar .scale .hour
{
	height:4.1666%;
	border-bottom:2px solid rgba(0,0,0,0.1);
}

.appointments_week_calendar_holder .calendar .scale .hour:last-child
{
	border:none;
}

.appointments_week_calendar_holder .calendar .scale .hour .label
{
	position:absolute;
	left:5px;
	top:5px;
	height:9px;
	font-family:"600";
	color:#222f3e;
	font-size:9px;
	line-height:9px;
	opacity:0.5;
}

.appointments_week_calendar_holder .calendar .scale .hour .quarter_hour
{
	height:25%;
	border-bottom:1px solid rgba(0,0,0,0.1);
}





.appointments_week_calendar_holder .calendar .appointments_week_calendar_day.calendar_view
{
	width:calc(var(--calendar-item-width) - 2px);
	margin:1px;
}

.appointments_week_calendar_holder .calendar .appointments_week_calendar_day.list_view
{
	width:calc(var(--calendar-item-width) - 2px);
	margin:1px;
}


.appointments_week_calendar_holder .calendar .appointments_week_calendar_day.weekend
{
	background:#c1c1c1 !important;
}


.appointments_week_calendar_holder .calendar .appointments_week_calendar_day.today
{
	background:#fff !important;
}




.appointments_week_calendar_holder.calendar_month .calendar .appointments_week_calendar_day.calendar_view
{

}

.appointments_week_calendar_holder.calendar_month .calendar .appointments_week_calendar_day.list_view
{

}




.appointments_week_calendar_holder.calendar_day .calendar .appointments_week_calendar_day.calendar_view
{

}

.appointments_week_calendar_holder.calendar_day .calendar .appointments_week_calendar_day.list_view
{

}







.appointments_week_calendar_holder .calendar .appointments_week_calendar_day.calendar_view .list
{
	position:absolute;
	left:0;
	top:0;
	width:calc(100% - 0px);
}

.appointments_week_calendar_holder .calendar .appointments_week_calendar_day.list_view .list
{
	left:0;
	top:0;
	width:calc(100% - 0px);
}

.appointments_week_calendar_holder .calendar .appointments_week_calendar_day.calendar_view .appointment
{
	position:absolute;
	left:0;
	width:calc(100% - 4px);
	background:rgba(51,156,254,0.1);
	margin:0 2px 0 2px;
	border-radius:3px;
	border-top:3px solid #339cfe;
}

.appointments_week_calendar_holder .calendar .appointments_week_calendar_day.list_view .appointment
{
	left:0;
	width:100%;
	background:rgba(0,0,0,0.2);
	margin:2px 0 2px 0;
	border-bottom:2px solid rgba(0,0,0,0.4);
	border-radius:3px;
}

.appointments_week_calendar_holder .calendar .appointments_week_calendar_day.calendar_view .parallel_1
{
	width:calc(100% - 4px);
}

.appointments_week_calendar_holder .calendar .appointments_week_calendar_day.calendar_view .parallel_2
{
	width:calc(50% - 4px);
}

.appointments_week_calendar_holder .calendar .appointments_week_calendar_day.calendar_view .parallel_2.offset_2
{
	left:50%;
}

.appointments_week_calendar_holder .calendar .appointments_week_calendar_day.calendar_view .parallel_3
{
	width:calc(33.33% - 4px);
}

.appointments_week_calendar_holder .calendar .appointments_week_calendar_day.calendar_view .parallel_3.offset_2
{
	left:33.33%;
}

.appointments_week_calendar_holder .calendar .appointments_week_calendar_day.calendar_view .parallel_3.offset_3
{
	left:66.66%;
}

.appointments_week_calendar_holder .calendar .appointments_week_calendar_day.calendar_view .appointment .title
{
	position:absolute;
	left:5px;
	top:2px;
	width:calc(100% - 10px);
	height:18px;
	font-family:"600";
	color:#222f3e;
	font-size:11px;
	line-height:18px;
	text-align:left;
}

.appointments_week_calendar_holder .calendar .appointments_week_calendar_day .appointment .time_name
{
	position:absolute;
	left:5px;
	top:20px;
	width:calc(100% - 10px);
	height:18px;
	font-family:"500";
	color:#222f3e;
	font-size:9px;
	line-height:18px;
	text-align:left;
}

.appointments_week_calendar_holder .calendar .appointments_week_calendar_day .appointment .description
{
	position:absolute;
	left:5px;
	top:38px;
	width:calc(100% - 10px);
	height:18px;
	font-family:"500";
	color:#222f3e;
	font-size:9px;
	line-height:18px;
	text-align:left;
}
























.appointments_day_calendar_holder
{
	width:var(--calendar-width);
	height:calc(100vh - 190px);
	overflow-x:auto;
	overflow-y:hidden;
	border-radius:0px;
	margin:0 0 -10px 0;
}

















.appointments_day_calendar_holder .calendar
{
	width:auto !important;
	min-width:calc(100vw - 100px);
	height:calc(100% - 10px);
	overflow-y:auto;
	overflow-x:hidden;
	display:flex !important;
}



.appointments_day_calendar_holder .calendar .scale
{
	position:absolute;
	width:calc(100vw - 100px);
	height:100%;
	pointer-events:none;
}

.appointments_day_calendar_holder .calendar .scale .hour
{
	height:4.1666%;
	border-bottom:2px solid rgba(0,0,0,0.1);
}

.appointments_day_calendar_holder .calendar .scale .hour:last-child
{
	border:none;
}

.appointments_day_calendar_holder .calendar .scale .hour .label
{
	position:absolute;
	left:5px;
	top:5px;
	height:9px;
	font-family:"600";
	color:#222f3e;
	font-size:9px;
	line-height:9px;
	opacity:0.5;
}

.appointments_day_calendar_holder .calendar .scale .hour .quarter_hour
{
	height:25%;
	border-bottom:1px solid rgba(0,0,0,0.1);
}





.appointments_day_calendar_holder .calendar .appointments_day_calendar_day.calendar_view
{
	width:calc(100% - 2px);
	margin:1px;
}

.appointments_day_calendar_holder .calendar .appointments_day_calendar_day.list_view
{
	width:calc(100% - 2px);
	margin:1px;
}







.appointments_day_calendar_holder .calendar .appointments_day_calendar_day.calendar_view .list
{
	position:absolute;
	left:10%;
	top:0;
	width:80%;
}

.appointments_day_calendar_holder .calendar .appointments_day_calendar_day.list_view .list
{
	left:10%;
	top:0;
	width:80%;
}

.appointments_day_calendar_holder .calendar .appointments_day_calendar_day.calendar_view .appointment
{
	position:absolute;
	left:0;
	width:calc(100% - 4px);
	background:rgba(255,255,255,0.8);
	margin:0 2px 0 2px;
	border-radius:3px;
	box-shadow: 0 2px 20px -10px rgba(41,53,61,0.8);
}

.appointments_day_calendar_holder .calendar .appointments_day_calendar_day.list_view .appointment
{
	left:0;
	width:100%;
	background:rgba(0,0,0,0.2);
	margin:2px 0 2px 0;
	border-bottom:2px solid rgba(0,0,0,0.4);
	border-radius:3px;
}

.appointments_day_calendar_holder .calendar .appointments_day_calendar_day.calendar_view .parallel_1
{
	width:calc(100% - 4px);
}

.appointments_day_calendar_holder .calendar .appointments_day_calendar_day.calendar_view .parallel_2
{
	width:calc(50% - 4px);
}

.appointments_day_calendar_holder .calendar .appointments_day_calendar_day.calendar_view .parallel_2.offset_2
{
	left:50%;
}

.appointments_day_calendar_holder .calendar .appointments_day_calendar_day.calendar_view .parallel_3
{
	width:calc(33.33% - 4px);
}

.appointments_day_calendar_holder .calendar .appointments_day_calendar_day.calendar_view .parallel_3.offset_2
{
	left:33.33%;
}

.appointments_day_calendar_holder .calendar .appointments_day_calendar_day.calendar_view .parallel_3.offset_3
{
	left:66.66%;
}

.appointments_day_calendar_holder .calendar .appointments_day_calendar_day.calendar_view .appointment .title
{
	position:absolute;
	left:5px;
	top:2px;
	width:calc(100% - 10px);
	height:18px;
	font-family:"600";
	color:#222f3e;
	font-size:11px;
	line-height:18px;
	text-align:left;
}

.appointments_day_calendar_holder .calendar .appointments_day_calendar_day .appointment .time_name
{
	position:absolute;
	left:5px;
	top:20px;
	width:calc(100% - 10px);
	height:18px;
	font-family:"500";
	color:#222f3e;
	font-size:9px;
	line-height:18px;
	text-align:left;
}

.appointments_day_calendar_holder .calendar .appointments_day_calendar_day .appointment .description
{
	position:absolute;
	left:5px;
	top:38px;
	width:calc(100% - 10px);
	height:18px;
	font-family:"500";
	color:#222f3e;
	font-size:9px;
	line-height:18px;
	text-align:left;
}

























.appointment_details
{
	background:#fff;
	border-radius:3px;
	box-shadow:0 5px 80px -30px rgba(0,0,0,0.4);
	padding:40px;
	margin:0 0 100px;
}

.appointment_details .headline
{
	height:24px;
	line-height:24px;
	font-family:"600";
	color:#222f3e;
	font-size:12px;
	text-align:center;
	margin:0 0 10px 0;
	text-transform:uppercase;
}

.appointment_details .subdetails
{
	padding:20px;
	border-radius:3px;
	box-shadow:inset 0 0 0 2px #f4f4f4;
	margin:10px 0 10px 0;
}

.appointment_details .title
{
	height:24px;
	line-height:24px;
	font-family:"600";
	color:#222f3e;
	font-size:10px;
	text-align:center;
	margin:0 0 10px 0;
	text-transform:uppercase;
}

.appointment_details .text
{
	height:24px;
	line-height:24px;
	font-family:"600";
	color:#BFBFBF;
	font-size:10px;
	text-align:left;
	text-transform:uppercase;
}

.appointment_details .resources_holder
{
	width:calc(100% + 4px);
}

.appointment_details .resources
{
	height:24px;
	width:calc(25% - 4px);
	padding:0 0 0 25px;
	background-size:auto 14px !important;
	background-position:left center !important;
	background-repeat:no-repeat !important;
	margin:5px 2px 5px 2px;
}

.appointment_details .resources .resource
{
	height:20px;
	margin:2px;
	width:auto;
	padding:0 7px 0 7px;
	line-height:20px;
	font-size:8px;
	background:#f4f4f4;
	border-radius:3px;
	color:#BFBFBF;
	font-family:"600";
	text-transform:uppercase;
}

.appointment_details .box_holder
{
	width:calc(100% + 20px);
}

.appointment_details .box_holder .box
{
	background:#f4f4f4;
	border-radius:3px;
	padding:10px;
	line-height:20px;
	font-family:"600";
	color:#BFBFBF;
	font-size:10px;
	text-align:center;
	text-transform:uppercase;
	margin:10px;
}

.appointment_details .box_holder .box.double
{
	width:calc(50% - 20px);
}

.appointment_details .box_holder .box.tripple
{
	width:calc(33.33% - 20px);
}

.appointment_details .box_holder .box.quad
{
	width:calc(25% - 20px);
}





#service_availability
{
	display:none;
}