/**
 * @package 	WordPress
 * @subpackage 	Language School
 * @version 	1.0.1
 * 
 * Timetable CSS Rules
 * Created by CMSMasters
 * 
 */



/*-------------------------------------------------------------------------

	0.	LESS Variables + Functions
	1. 	Timetable Filters
	2. 	Timetable Page
	3. 	Timetable Post
	4. 	Timetable Upcoming Events
	5.	CSS3 Animations

-------------------------------------------------------------------------*/



/*-------------------------------------------------------------------------*/
/*	0.	LESS Variables & Functions	*/
/*-------------------------------------------------------------------------*/

/***************** Variables ******************/

@input_pad:9px;

@line_height_pad:20px;
@blocks_hor_pad:20px;
@cont_vert_pad:30px;

@col_mar:2%;

@resp_blocks_pad:56.25%;


/***************** Functions ******************/
.fl () {
	float:left;
}

.fr () {
	float:right;
}

.dn () {
	display:none;
}

.tal () {
	text-align:left;
}

.tac () {
	text-align:center
}

.tar () {
	text-align:right;
}

.cl () {
	clear:both;
}

.ovh () {
	overflow:hidden;
}

.m0a () {
	margin:0 auto;
}

.bd (@w:1px; @t:solid) {
	border-width:@w;
	border-style:@t;
}

.bdt (@w:1px; @t:solid) {
	border-top-width:@w;
	border-top-style:@t;
}

.bdb (@w:1px; @t:solid) {
	border-bottom-width:@w;
	border-bottom-style:@t;
}

.bdr (@w:1px; @t:solid) {
	border-right-width:@w;
	border-right-style:@t;
}

.bdl (@w:1px; @t:solid) {
	border-left-width:@w;
	border-left-style:@t;
}

.color_white_opacity (@op:.5) {
	color:rgba(255, 255, 255, @op);
}

.bg_white_opacity (@op:.5) {
	background-color:rgba(255, 255, 255, @op);
}

.fullwidth_in_block () {
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
}

.op (@op:.5) {
	opacity:@op;
}

.cl_after () {
	content:'.';
	display:block;
	clear:both;
	height:0;
	visibility:hidden;
	overflow:hidden;
	zoom:1;
}

.pos_abs (@w:1em; @h:1em; @l:0; @r:0; @t:0; @b:0) {
	width:@w;
	height:@h;
	margin:auto !important;
	position:absolute;
	left:@l;
	right:@r;
	top:@t;
	bottom:@b;
}

.bdbx () {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

.ctbx () {
	-webkit-box-sizing:content-box;
	-moz-box-sizing:content-box;
	box-sizing:content-box;
}

.bdrs (@radius:5px) {
	-webkit-border-radius:@radius;
	border-radius:@radius;
}

.bxsh (@x:0; @y:0; @blur:5px; @spred:0; @alpha:.05) {
	-webkit-box-shadow:@x @y @blur @spred rgba(0, 0, 0, @alpha);
	box-shadow:@x @y @blur @spred rgba(0, 0, 0, @alpha);
}

.bxshi (@x:0; @y:0; @blur:5px; @spred:0; @alpha:.05) {
	-webkit-box-shadow:inset @x @y @blur @spred rgba(0, 0, 0, @alpha);
	box-shadow:inset @x @y @blur @spred rgba(0, 0, 0, @alpha);
}

.bxsh_none () {
	-webkit-box-shadow:none;
	box-shadow:none;
}

.trans(@trans:0) when not (@trans = 0) {
	-webkit-transition:@trans;
	-moz-transition:@trans;
	-ms-transition:@trans;
	-o-transition:@trans;
	transition:@trans;
}


/*-------------------------------------------------------------------------*/
/*	1. Timetable Filters */
/*-------------------------------------------------------------------------*/

/* --- dropdown filter --- */
.tabs_box_navigation {
	display:block;
	margin:0;
	padding:0 0 40px;
	position:relative;
	z-index:10;
	.cl;
	overflow:visible !important;
	
	ul, 
	li {
		margin:0;
		padding:0;
		
		&:before {
			content:none;
		}
	}
	
	.tabs_box_navigation_selected {
		display:inline-block;
		min-width:170px;
		max-width:100%;
		position:relative;
		.bdrs(20px);
		.bd(2px);
		
		&:before {
			content:'\eb1c';
			font-family:"fontello";
			font-size:14px;
			.pos_abs(1em, 1em, auto, 15px);
		}
		
		&:hover {
			.bdrs(20px 20px 0 0);
			border-width:2px !important;
			
			&:before {
				-webkit-transform:rotate(180deg);
				-moz-transform:rotate(180deg);
				-ms-transform:rotate(180deg);
				-o-transform:rotate(180deg);
				transform:rotate(180deg);
			}
			
			.sub-menu {
				visibility:visible;
				.op(1);
			}
		}
		
		label {
			display:block;
			padding:8px 40px 8px 20px;
			cursor:pointer;
		}
		
		.tabs_box_navigation_icon {
			.dn;
		}
		
		.sub-menu {
			.bd;
			.bdt(0);
			padding:10px 0 17px;
			visibility:hidden;
			position:absolute;
			left:-2px;
			right:-2px;
			top:100%;
			.op(0);
			
			li {
				padding:3px 20px;
			}
			
			a {
				display:inline-block;
			}
		}
	}
}


/* --- tabs filter --- */
.ui-tabs {
	.tt_tabs_navigation.ui-widget-header {
		list-style:none;
		width:100%;
		margin:0 0 40px;
		padding:0;
		float:none;
		background:none;
		.bdrs(0);
		.bd(0);
		.bdb;
		.cl;
		overflow:visible !important;
		
		li {
			float:none;
			display:inline-block;
			vertical-align:bottom;
			margin:0 0 -1px;
			padding:0;
			.bdrs(0);
			.bd(0);
			background:none;
			
			&:before {
				content:none;
			}
			
			&:last-child {
				margin:0;
			}
			
			&.ui-tabs-active {
				padding:0;
				margin:0 0 -1px;
			}
			
			a {
				display:block;
				padding:15px 25px;
				.bd;
				border-color:transparent;
				.tac;
				position:relative;
				
				&:before {
					content:'';
					display:block;
					height:2px;
					position:absolute;
					top:-1px;
					left:-1px;
					right:-1px;
				}
			}
			
			a:hover,
			a.selected,
			&.ui-tabs-active a {
				outline:none;
			}
		}
	}
}


/*-------------------------------------------------------------------------*/
/*	2. Timetable Page */
/*-------------------------------------------------------------------------*/

.cmsmasters_timetable_shortcode {
	position:relative;
	
	&:after {
		.cl_after;
	}
}

.timetable_clearfix:after {
	font-size:0px;
	content:".";
	display:block;
	height:0px;
	visibility:hidden;
	clear:both;
}

.tt_hide {
	display:none;
}

/* --- lists --- */
.tt_tabs {
	border:none !important;
	
	&.ui-widget-content {
		background:none;
		padding:0;
		margin:0;
		.bdrs(0);
	}
}

.tt_tabs .ui-tabs-panel {
	padding:0 !important;
	clear:both;
}

/* --- timetable --- */
table.tt_timetable {
	width:100%;
	margin:0;
	padding:0;
	border:none;
	border-collapse:separate;
	border-spacing:1px;
}

table.tt_timetable th,
table.tt_timetable td {
	border:none;
}

table.tt_timetable th,
table.tt_timetable td.tt_hours_column {
	text-align:center;
	vertical-align:middle;
}

table.tt_timetable td.tt_hours_column {
	padding:0 5px;
}

table.tt_timetable th {
	width:12.5%;
	padding:10px 15px;
}

table.tt_timetable .event_container {
	padding:10px 8px 15px;
}

table.tt_timetable .tt_single_event {
	.bd;
}

table.tt_timetable td {
	width:12.5%;
	vertical-align:top;
	height:31px;
	border:none;
	padding:0;
}

table.tt_timetable .event {
	text-align:center;
	padding:0;
	vertical-align:top;
	
	div {
		text-align:inherit;
		
		&.tt_tooltip_content {
			text-align:inherit;
		}
	}
	
	&:not(.tt_single_event) {
		.event_container {
			.bd;
		}
	}
}

table.tt_timetable .event a,
table.tt_timetable .event .event_header {
	display:block;
}

table.tt_timetable .event a:hover {
	.op(.6);
}

table.tt_timetable .event .hours_container {
	padding:20px 0 13px;
}

table.tt_timetable .event .top_hour {
	padding-top:20px;
}

table.tt_timetable .event .bottom_hour {
	padding-bottom:13px;
}

.event_layout_4 table.tt_timetable .event .top_hour {
	padding-top:13px;
	padding-bottom:12px;
}

table.tt_timetable .event hr {
	height:1px;
	margin:0;
	opacity:0.2;
	.bd(0);
}

.tt_timetable.small {
	display:none;
}

/* --- tip/tooltip/qtip --- */
.tt_tooltip {
	position:relative;
}

.tt_tooltip .tt_tooltip_text {
	display:block;
	width:100% !important;
	max-width:100%;
	height:auto !important;
	padding-bottom:15px;
	visibility:hidden;
	position:absolute;
	left:0 !important;
	right:auto !important;
	top:auto !important;
	bottom:100% !important;
	z-index:1000;
	.op(0);
}

.tt_tooltip:hover .tt_tooltip_text {
	visibility:visible;
	.op(1);
}

.tt_tooltip .tt_tooltip_content {
	padding:10px 15px 15px;
}

.tt_tooltip .tt_tooltip_content a {
	margin-bottom:5px;
}

.tt_tooltip .tt_tooltip_arrow {
	display:block;
	.pos_abs(0, 0, 0, 0, auto, 10px);
	.bdt(5px);
	.bdl(5px);
	.bdr(5px);
	border-left-color:transparent !important;
	border-right-color:transparent !important;
}

/* --- tabs --- */
.tt-ui-tabs-hide {
	display:none;
}

/* --- Timetable Small --- */
ul.tt_items_list {
	list-style:none;
	padding:0 0 40px;
	margin:0;
	
	&:last-child {
		padding:0;
	}
	
	li {
		padding:10px 0;
		margin:0;
		
		&:before {
			content:none;
		}
		
		a, 
		span {
			.fl;
		}
		
		.value {
			.fr;
		}
	}
}


/*-------------------------------------------------------------------------*/
/*	3. Timetable Post */
/*-------------------------------------------------------------------------*/

.cmsmasters_tt_single_event {
	position:relative;
}

.cmsmasters_tt_event {
	padding:60px 0 0;
	position:relative;
	
	.cmsmasters_tt_event_header {
		margin-top:-20px;
		padding:0 0 20px;
		.ovh;
		.cl;
		
		.cmsmasters_tt_event_subtitle {
			margin:0;
			padding:0;
			position:relative;
		}
	}
	
	.cmsmasters_tt_event_content_wrap {
		padding-bottom:30px;
		position:relative;
		.ovh;
		
		&.with_sidebar {
			width:74%;
			padding-right:30px;
			.fl;
		}
		
		> figure {
			margin-bottom:35px;
		}
	}
	
	.cmsmasters_tt_event_sidebar {
		width:26%;
		.fl;
		
		> div {
			padding:0 0 40px;
		}
	}
	
	.cmsmasters_tt_event_hours {
		position:relative;
		.ovh;
		
		.cmsmasters_tt_event_hours_title {
			margin:0;
			padding:0 0 15px;
		}
		
		.cmsmasters_tt_event_hours_item {
			padding:9px 0;
			position:relative;
			display:table;
			width:100%;
			.bdb;
			
			&:last-child {
				.bdb(0);
			}
			
			> div {
				display:table-cell;
				.ovh;
			}
			
			.cmsmasters_tt_event_hours_item_title {
				padding-right:15px;
				font-weight:600;
			}
			
			.cmsmasters_tt_event_hours_item_values {
				word-wrap:break-word;
				.tar;
				
				.cmsmasters_tt_event_hours_item_value {
					display:block;
				}
			}
		}
	}
	
	.cmsmasters_tt_event_details {
		position:relative;
		.ovh;
		
		.cmsmasters_tt_event_details_title {
			margin:0;
			padding:0 0 15px;
		}
		
		.cmsmasters_tt_event_details_item {
			padding:9px 0;
			position:relative;
			display:table;
			width:100%;
			.bdb;
			
			&:last-child {
				.bdb(0);
			}
			
			> div {
				width:50%;
				display:table-cell;
				.ovh;
			}
			
			.cmsmasters_tt_event_details_item_title {
				padding-right:15px;
				font-weight:600;
			}
			
			.cmsmasters_tt_event_details_item_desc {
				word-wrap:break-word;
				.tar;
			}
		}
	}
}


/*-------------------------------------------------------------------------*/
/*	4. Timetable Upcoming Events */
/*-------------------------------------------------------------------------*/

.tt_upcoming_events_widget {
	position:relative;
	.ovh;
}

.tt_upcoming_events_wrapper {
	width:100%;
	.cl;
	
	.caroufredsel_wrapper {
		width:100% !important;
		margin:0 !important;
		.ovh;
	}
	
	.tt_upcoming_event_controls {
		display:block;
		margin:0;
		position:relative;
		.ovh;
		
		> a {
			display:block !important;
			width:30px;
			height:30px;
			margin:10px 3px 0 0;
			position:relative;
			.bd;
			.fl;
			.bdrs(50%);
			
			&:before {
				font-family:"fontello";
				font-size:13px;
				line-height:15px;
				.pos_abs(1em, 1em, 0, 0, 0);
				.tac;
			}
			
			&#upcoming_event_prev:before {
				content:'\eb1f';
				line-height:13px;
			}
			
			&#upcoming_event_next:before {
				content:'\eb1c';
			}
		}
	}
}

ul.tt_upcoming_events {
	width:100% !important;
	padding:0;
	margin:0;
	
	li {
		padding:0;
		margin:0;
		.bd(0);
		
		&:before {
			content:none;
		}
		
		&:first-child {
			.tt_upcoming_events_event_container {
				.bdt;
			}
		}
		
		.tt_upcoming_events_event_container {
			display:block;
			padding:15px 45px 15px 20px;
			.bd;
			.bdt(0);
			.bdl(2px);
			.ovh;
			
			&:before {
				content:'\eb1c';
				font-family:"fontello";
				font-size:12px;
				line-height:12px;
				.pos_abs(1em, 1em, auto, 15px, 18px, auto);
				.tac;
			}
			
			&:hover {
				&:before {
					content:'\eb1f';
				}
				
				.tt_event_hours_description, 
				img.wp-post-image {
					display:block;
				}
			}
			
			.tt_upcoming_events_arrow {
				.dn;
			}
			
			.tt_upcoming_events_hours {
				display:block;
			}
			
			.tt_event_hours_description {
				padding:13px 0 0;
				.dn;
			}
			
			img.wp-post-image {
				margin-top:20px;
				margin-bottom:5px;
				.dn;
			}
		}
	}
}


/*-------------------------------------------------------------------------*/
/*	5. CSS3 Animations */
/*-------------------------------------------------------------------------*/

html.csstransitions {
	.tabs_box_navigation .tabs_box_navigation_selected {
		.trans(~'border-radius .3s ease-in-out');
	}
	
	.tabs_box_navigation .tabs_box_navigation_selected:before {
		.trans(~'all .3s ease-in-out');
	}
	
	.tabs_box_navigation .tabs_box_navigation_selected .sub-menu, 
	table.tt_timetable .tt_tooltip .tt_tooltip_text {
		.trans(~'opacity .3s ease-in-out, visibility .3s ease-in-out');
	}
	
	table.tt_timetable .tt_tooltip:hover .tt_tooltip_text {
		.trans(~'opacity .3s ease-in-out .2s, visibility .3s ease-in-out .2s');
	}
	
	table.tt_timetable .event_container, 
	table.tt_timetable .tt_single_event {
		.trans(~'background-color .3s ease-in-out, border-color .3s ease-in-out');
	}
	
	.tt_upcoming_events_wrapper .tt_upcoming_event_controls > a {
		.trans(~'background-color .3s ease-in-out, border-color .3s ease-in-out, color .3s ease-in-out');
	}
	
	table.tt_timetable .event_container * {
		.trans(~'color .3s ease-in-out');
	}
	
	table.tt_timetable .event_container a, 
	table.tt_timetable .tt_single_event a {
		.trans(~'color .3s ease-in-out, opacity .3s ease-in-out');
	}
	
	.tt_tabs_navigation li a {
		.trans(~'border-color .3s ease-in-out');
	}
	
	ul.tt_upcoming_events li .tt_upcoming_events_event_container {
		.trans(~'none');
	}
}

