/**
 * @package 	WordPress
 * @subpackage 	Garage
 * @version		1.2.8
 * 
 * Responsive Events CSS Rules
 * Created by CMSMasters
 * 
 */



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

	0.	LESS Variables + Functions
	1.	Medium Monitor
	2.	Tablet Monitor
	3.	Small Tablet Monitor
	4.	Phone Monitor

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



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

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

@input_pad:11px;

@line_height_pad:20px;
@blocks_hor_pad:20px;

@col_mar:2%;

@resp_blocks_pad:56.25%;

@preloader_pad:100%;

@cont_vert_pad:30px;

@monitor_large: ~'(min-width: 1440px)';
@monitor_tablet: ~'(max-width: 1024px)';
@monitor_tablet_950: ~'(max-width: 950px)';
@monitor_tablet_small: ~'(max-width: 767px)';
@monitor_tablet_600: ~'(max-width: 600px)';
@monitor_phone: ~'(max-width: 540px)';
@monitor_phone_small: ~'(max-width: 320px)';

@monitor_medium: ~'(min-width: 1024px) and (max-width: 1440px)';
@tablet_ipad: ~'(min-width: 768px) and (max-width: 1024px)';
@tablet_small: ~'(min-width: 541px) and (max-width: 767px)';


/***************** 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;
	.cl;
}

.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;
}



@media only screen {
	/*-------------------------------------------------------------------------*/
	/*	1. Medium Monitor
	/*-------------------------------------------------------------------------*/
	.tribe-events-venue {
		position:relative;
	}
	
	
	
	/*-------------------------------------------------------------------------*/
	/*	2.	Tablet Monitor
	/*-------------------------------------------------------------------------*/
	@media @monitor_tablet {
		#tribe-events-content {
			&.tribe-events-list {
				.vevent {
					.tribe-events-event-image {
						width:40%;
					}
				}
			}
			
			&.tribe-events-photo {
				#tribe-events-photo-events {
					margin:0 -(@col_mar + 0.2);
				}
			}
			
			&.tribe-events-single {
				.cmsms_single_event_meta {
					&.cmsms_event_meta_info_col_4 {
						.tribe-events-meta-group {
							width:round((100% / 2) - (@col_mar * 2), 2);		
					
							&:nth-child(2n + 1) {
								clear:left;
							}
						}
					}
				}
			}
		}
	}
	
	
	
	/*-------------------------------------------------------------------------*/
	/*	3.	Small Tablet Monitor
	/*-------------------------------------------------------------------------*/
	@media @monitor_tablet_small {
		#main {
			#tribe-events-bar .tribe-bar-filters .tribe-bar-filters-inner > div {
				width:96%;
			}
			
			.tribe-events-uses-geolocation #tribe-events-bar .tribe-bar-filters .tribe-bar-filters-inner > div {
				width:46%;
			}
			
			#tribe-events-bar {
				.tac;
				
				#tribe-bar-views {
					.tribe-bar-views-inner {
						.tac;
					}
					
					label.button {
						min-width:160px;
						display:inline-block;
						float:none;
						
						.cmsms_next_arrow {
							-webkit-transform:rotate(90deg);
							-moz-transform:rotate(90deg);
							-ms-transform:rotate(90deg);
							-o-transform:rotate(90deg);
							transform:rotate(90deg);
						}
					}
					
					&.tribe-bar-views-open {
						label.button {
							.cmsms_next_arrow {
								-webkit-transform:rotate(-90deg);
								-moz-transform:rotate(-90deg);
								-ms-transform:rotate(-90deg);
								-o-transform:rotate(-90deg);
								transform:rotate(-90deg);
							}
						}
						
						ul.tribe-bar-views-list {
							display:block;
						}
					}
					
					ul.tribe-bar-views-list {
						float:none;
						padding:20px 20px 0;
						
						li {
							margin-bottom:10px;
							
							&:first-child {
								margin:0;
							}
						}
					}
				}
			}
			
			#tribe-events-content {
				&.tribe-events-month {
					table.tribe-events-calendar {
						thead {
							th {
								padding:5px 0;
							}
						}
					
						tbody {
							td {
								height:45px;
								padding:5px;
								.trans(~'background-color .3s ease-in-out, color .3s ease-in-out');
								
								&.tribe-events-has-events {
									position:relative;
									cursor:pointer;
									
									&:before {
										content:'';
										.pos_abs(6px, 6px, 0, 0, auto, 10px);
										.bdrs(50%);
										.trans(~'background-color .3s ease-in-out');
									}
								}
								
								&.tribe-events-thismonth {
									position:relative;
									
									&.tribe-events-has-events {
										a {
											padding:0;
										}
									}
								}
								
								div[id*="tribe-events-daynum-"] {
									background:none;
									padding:0;
									.tac;
									.bdb(0);
									
									&:before,
									&:after {
										content:none;
									}
								
									a {
										.tac;
									}
								}
								
								div[id*="tribe-events-event-"] {
									display:none;
								}
								
								.tribe-events-viewmore {
									display:none;
								}
							}
						}
					}
				}
				
				&.tribe-events-list {
					.type-tribe_events {
						.tribe-events-event-image {
							width:100%;
							padding:0;
							margin:0 0 15px;
							float:none;
							.cl;
						}
					}
				}
				
				&.tribe-events-photo {
					#tribe-events-photo-events {
						margin:0 -(@col_mar + 0.2);
					}
				}
				
				&.tribe-events-week-grid {
					.tribe-events-grid {
						display:none;
					}
				}
			
				&.tribe-events-single {
					.cmsms_single_event_header {
						.cmsms_single_event_header_left, 
						.cmsms_single_event_header_right {
							float:none;
							clear:both;
							.tac;
							
							* {
								.tac;
							}
						}
						
						.cmsms_single_event_header_right {
							padding-top:25px;
							
							.tribe-events-cal-links {
								display:inline-block;
							}
						}
					}
				
					.cmsms_single_event_meta {
						&.cmsms_event_meta_info_col_3 {
							.tribe-events-meta-group {
								width:round(100% - (@col_mar * 2), 2);
							}
						}
					}
				}
			}
			
			#tribe-mobile-container {
				display:block;
			}
			
			#tribe-bar-views {
				.tribe-bar-views-inner {
					.tribe-bar-views-list {
						.tac;
						
						.tribe-bar-views-option {
							float:none;
							display:inline-block;
						}
					}
				}
			}
			
			.tribe-events-organizer {
				.cmsms_events_organizer_header {
					.cmsms_events_organizer_header_left, 
					.cmsms_events_organizer_header_right {
						float:none;
						.tac;
						.cl;
						
						* {
							.tac;
						}
					}
					
					.cmsms_events_organizer_header_right {
						padding-top:25px;
						
						a {
							display:inline-block;
						}
					}
				}
			}
			
			.tribe-events-venue {
				.cmsms_events_venue_header {
					.cmsms_events_venue_header_left, 
					.cmsms_events_venue_header_right {
						float:none;
						.tac;
						.cl;
						
						* {
							.tac;
						}
					}
					
					.cmsms_events_venue_header_right {
						padding-top:25px;
						
						a {
							display:inline-block;
						}
					}
				}
			}
		}
	}
	
	
	
	/*-------------------------------------------------------------------------*/
	/*	4.	Phone Monitor
	/*-------------------------------------------------------------------------*/
	@media @monitor_phone {
		#main {
			#tribe-events-content {
				&.tribe-events-photo {
					#tribe-events-photo-events {
						.tribe-events-photo-event {
							width:100%;
							float:none;
							.cl;
						}
					}
				}
				
				&.tribe-events-single {
					.cmsms_single_event_header {
						margin-bottom:0;
						padding-bottom:10px;
					}
				
					.cmsms_single_event_inner {
						.cmsms_single_event_img, 
						.cmsms_single_event_map {
							width:100%;
							padding:0;
							float:none;
							.cl;
						}
						
						.cmsms_single_event_img + .cmsms_single_event_map {
							padding-top:20px;
						}
					}
					
					.cmsms_single_event_meta {
						.tribe-events-meta-group {
							width:round(100% - (@col_mar * 2), 2);
							float:none;
							.cl;
						}
					}
				}
			}
			
			ul.tribe-related-events {
				> li {
					width:round(100% - (@col_mar * 2), 2);
					float:none;
					.cl;
				}
			}
			
			.tribe-events-venue {
				.tribe-events-venue-meta {
					.cmsms_events_venue_meta_inner {
						.cmsms_events_venue_meta_img, 
						.cmsms_events_venue_meta_map {
							width:100%;
							padding:0;
							float:none;
							.cl;
						}
						
						.cmsms_events_venue_meta_img + .cmsms_events_venue_meta_map {
							padding-top:20px;
						}
					}
				}
			}
		}
	}
}