
/*
 * Timeline - for jQuery 1.3+
 * http://codecanyon.net/item/timetable-for-events-with-php-jquery-and-xml/546355?ref=RikdeVos
 *
 * Copyright 2012, Rik de Vos
 * You need to buy a license if you want use this script.
 * http://codecanyon.net/user/RikdeVos?ref=RikdeVos
 *
 * Version: 1.0.2 (Jan 9 2012)
 */

/* css timeline*/

.tl_container {
	width: 100%;
	position: relative;
	text-shadow: none;
}

.tl_container p.tl_timeline_title{
    font-size: 18px;
    margin: 0 0 10px 200px !important;
    padding: 0 !important;
    color: #000;
}

.tl_clear {
	clear: both;
	height:0;
}

.tl_timeline {
	border-bottom: 1px solid #D2D2D2;
	/*-moz-box-shadow: 1px 0 0 #D2D2D2;*/
	position: relative;
	text-shadow: none;
}

.tl_timeline:after {
	content: '';
	width: 50px;
	height: 50px;
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 9999999;
}

/* PRINT BUTTON */
a.tl_print {
	display: inline-block;
	position: absolute;
	top: 20px;
	right: 0;
	text-decoration: none !important;

}

.tl_container[data-title=false] a.tl_print {
	top: -20px;
}

/* NEXT MONTH, PREVIOUS MONTH BUTTONS */
.tl_day_nav_container {
	position: absolute;
	z-index: 99999999;
	text-align: center;
	width: 200px;
}
.tl_day_nav_container a.tl_previous_day, .tl_day_nav_container a.tl_next_day {
	color: #000;
	text-decoration: none;
	position: relative;
	top: -1px;
}

a.tl_date_title {
	margin: 0 10px 0 10px;
	text-decoration: none !important;
	color: #555 !important;
	font-size: 14px !important;

}

a.tl_date_title:hover {
	text-decoration: underline !important;
}
.tl_day_nav_info {

}
/*.tl_previous_day {
	position: absolute;
	z-index: 99999999;
	right: 80px;
	top: -35px;
	color: #525252;
}
.tl_next_day {
	position: absolute;
	z-index: 99999999;
	right: 0px;
	top: -35px;
	color: #525252;
}*/


.tl_timeline[data-indicatorbar=false] .tl_print{
	margin-top: 0px;
}

.tl_timeline a {
	outline: 0px;
}

/* SELECTOR BAR */
	.tl_timeline .tl_time_selector_bar {
		background: #ebebeb;
		height: 23px;
		border: 1px solid #d2d2d2;
		border-right: 0px;
		/*box-shadow: inset 0 1px 0 #fbfbfb;*/
		position: relative;
		margin-left: 200px;
		border-right: 1px solid #d2d2d2;
		display: none; /*option1*/
		overflow: hidden;
		color: #000;
	}

	.tl_timeline[data-indicatorbar=true] .tl_time_selector_bar {
		display: block;
	}

		.tl_timeline .tl_time_selector_bar ul {
			margin: 0 !important;
			padding: 0 !important;
			clear: both;
		}

			.tl_timeline .tl_time_selector_bar ul li {
				list-style: none !important;
				float: left !important;
				font-size: 10px;
				line-height: 23px;
				margin: 0 0px 0 3px !important;
				padding: 0 !important;
				width: 50px;
				text-align: left !important;
			}

	.tl_timeline .tl_time_selector_bar .tl_slidable_slider {
		position: absolute;
		left: 0px;
		top: 0px;
		height: 21px;
		/*width: 160px;*/

	    /* RGBa with .10 opacity */
	    background: rgba(0, 0, 0,.10);
	    /* Fallback for web browsers that doesn't support RGBa */
	    /* For IE 5.5 - 7*/
	    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#11000000, endColorstr=#11000000);


		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		margin: 1px 0 0 1px;
	}

/* INDICATOR BAR */
	.tl_timeline .tl_time_indicator {
		background: #fcfcfc;
		margin-left: 200px;
		overflow: hidden;
		height: 30px;
		position: relative;
		/*-moz-box-shadow: inset 1px 0 0 #D2D2D2;*/
		border-right: 1px solid #d2d2d2;
		border-left: 1px solid #d2d2d2;
		border-top: 1px solid #d2d2d2;
	}

	.tl_timeline[data-indicatorbar=true] .tl_time_indicator {
		border-top: 0px solid #d2d2d2;
	}

		.tl_timeline .tl_time_indicator ul {
			margin: 0 !important;
			padding: 0 !important;
			clear: both;
			width: 100000px;
			font-size: 12px;
			line-height: 1em;
		}

			.tl_timeline .tl_time_indicator ul li {
				list-style: none;
				float: left;
				font-weight: bold;
				color: #525252;
				height: 30px;
				line-height: 30px;
				border-left: 1px solid #d2d2d2;
				width: 93px;
                margin: 0 !important;
				padding: 0 0 0 6px !important;
			}

/* LOCATION ITEM */

	.tl_timeline .tl_location {
		overflow: hidden;
		border-left: 1px solid #d2d2d2;
		position: relative;
		background: #fff;
	}

	.tl_timeline .tl_location:after {
		position: absolute;
		right: 0px;
		top: 0px;
		width: 1px;
		height: 100%;
		content: '';
		background: #d2d2d2;
	}

		.tl_timeline .tl_location .tl_the_location {
			border-top: 1px solid #d2d2d2;
			/*border-left: 1px solid #d2d2d2;*/
			width: 199px; /*option*/
			min-height: 49px;
			height: 49px;
			float: left;
		}

			.tl_timeline .tl_location .tl_the_location h3 {
				color: #525252;
				font-weight: bold;
				text-decoration: none;
				font-size: 12px;
				line-height: 16px;
				margin: 10px 0 0 10px !important;
				padding: 0 !important;
			}

			.tl_timeline .tl_location .tl_the_location h3.tl_location_nosubtitle {
				margin-top: 16px !important;
			}

			.tl_timeline .tl_location .tl_the_location p.tl_the_location_subtitle {
				color: #525252;
				font-weight: normal;
				text-decoration: none;
				font-size: 10px;
				margin: 0 0 0 10px !important;
				padding: 0 !important;
			}

/* EVENTS */

	.tl_timeline .tl_the_timeline {
		position: relative;
		float: left;
		/* width: 600px; */
		overflow: hidden;
		/*border-right: 1px solid #d2d2d2;*/
	}

	.tl_timeline .tl_the_timeline:after {
		content: '';
		position: absolute;
		z-index: 2;
		top: 0px;
		left: 0px;
		width: 1px;
		height: 50px;
		background: #d2d2d2;
	}



		.tl_timeline .tl_the_timeline .tl_the_timeline_content {
			position: relative;
			background: #fff url(../images/grid.png) repeat left top;
			height: 50px;
		}

		.tl_timeline .tl_event {
			display: block !important;
			text-decoration: none !important;
			margin: 2px 1px 1px 2px !important;
			padding: 0 !important;
			cursor: pointer;
			width: 147px; /* blocks*50 - 3 */ /*option*/
			height: 47px;
			overflow: hidden;
			overflow: visible;
			position: absolute;
			left: 0px;
			top: 0px;
			background: #ececec;
			background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #efefef), color-stop(100%, #e9e9e9));
			background-image: -webkit-linear-gradient(center top,#efefef 0%,#e9e9e9 100%);
			background-image: -moz-linear-gradient(center top,#efefef 0%,#e9e9e9 100%);
			background-image: -o-linear-gradient(center top,#efefef 0%,#e9e9e9 100%);
			background-image: -ms-linear-gradient(center top,#efefef 0%,#e9e9e9 100%);
			background-image: linear-gradient(center top,#efefef 0%,#e9e9e9 100%);

			-moz-box-shadow: 0 0 1px 1px #fff;
			-webkit-box-shadow: 0 0 1px 1px #fff;
			box-shadow: 0 0 1px 1px #fff;
		}

			.tl_timeline .tl_event .tl_event_time {
				color: #525252;
				font-size: 8px;
				font-weight: normal;
				position: absolute;
				top: 0px;
				right: 3px;
				overflow: visible;
			}

			.tl_timeline .tl_event h2 {
				text-transform: none;
				margin: 10px 0 0 10px !important;
				padding: 0 !important;
				font-size: 12px;
				line-height: 16px;
				font-weight: bold;
				color: #525252;
			}

			.tl_timeline .tl_event h2.tl_event_nosubtitle {
				margin-top: 16px !important;
			}

			.tl_timeline .tl_event p.tl_subtitle {
				margin: 0 0 0 10px !important;
				padding: 0 !important;
				font-size: 10px;
				font-weight: normal;
				color: #525252;
			}

			.tl_timeline .tl_event[data-info-showing=true], .tl_timeline .tl_event:hover {
				background: #fcfcfc;
				background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #efefef), color-stop(100%, #fcfcfc));
				background-image: -webkit-linear-gradient(center top,#efefef 0%,#fcfcfc 100%);
				background-image: -moz-linear-gradient(center top,#efefef 0%,#fcfcfc 100%);
				background-image: -o-linear-gradient(center top,#efefef 0%,#fcfcfc 100%);
				background-image: -ms-linear-gradient(center top,#efefef 0%,#fcfcfc 100%);
				background-image: linear-gradient(center top,#efefef 0%,#fcfcfc 100%);
				margin-bottom: 0px;
				height: 48px;
			}

			.tl_timeline .tl_event[data-info-showing=true]:after {
				content: '';
				position: absolute;
				z-index: 2;
				left: -1px;
				bottom: -1px;
				width: 100%;
				height: 1px;
				background: #fcfcfc;
				padding: 0 1px 0 1px;
			}

		/* DETAILS OF EVENT */

		.tl_timeline .tl_event_details {
            display:none;
            font-size: 12px;
            line-height: 1em;
			border-top: 1px solid #e8e8e8;
			border-left: 1px solid #d2d2d2;
			background: #fcfcfc;
			padding: 10px 24px 10px 20px;
			text-align: justify;
			position: relative;
			display: none;
			color: #525252;
			line-height: 18px;
			overflow: hidden;
		}

			.tl_timeline .tl_event_details .tl_description_header {
				margin-bottom: 10px;
			}

				.tl_timeline .tl_event_details .tl_description_header .tl_description_header_title {
					float: left;
					text-transform: none;
					font-size: 14px;
					line-height: 16px;
					font-weight: bold;
					color: #525252;
				}

				.tl_timeline .tl_event_details .tl_description_header .tl_description_time {
					float: right;
					font-weight: bold;
					color: #525252;
					font-size: 12px;
				}

				.tl_timeline .tl_event_details .tl_description_header .tl_description_header_subtitle {
					font-size: 10px;
					font-weight: normal;
					color: #525252;
				}

			.tl_timeline .tl_event_details a.tl_event_image {
				float: left;
                clear: left;
				margin: 0 10px 5px 0 !important;
			}

				.tl_timeline .tl_event_details .youtube img {
					border: 1px solid #d2d2d2;
					background: #fcfcfc;
					padding: 5px !important;
					float: left;
					clear: left;
					margin: 0 10px 5px 0 !important;
					width: 130px;
					height: 97px;
			}

				.tl_timeline .tl_event_details .tl_event_image img {
					border: 1px solid #d2d2d2;
					background: #fcfcfc;
					padding: 5px !important;
					margin: 0 !important;
                    width: 130px;
				}

/* BUTTONS */

	.tl_timeline .tl_next, .tl_timeline .tl_previous {
		position: absolute;
        display:none;
		text-decoration: none;
		font-weight: normal;
		top: 50%;
		left: 210px;
		z-index: 10;
		height: 30px;
		padding: 0 5px 0 5px;
		text-align: center;
		line-height: 30px;
		color: #fff;
		background: #3d3d3d;

		-moz-box-shadow: inset 0 0 1px #fff, 0 0 16px rgba(0,0,0,.5);
		-webkit-box-shadow: inset 0 0 1px #fff, 0 0 16px rgba(0,0,0,.5);
		box-shadow: inset 0 0 1px #fff, 0 0 16px rgba(0,0,0,.5);
		background: #3d3d3d url(../images/triangle_left_white.png) no-repeat center;
		background: rgba(0,0,0,.7) url(../images/triangle_left_white.png) no-repeat center;

		text-shadow: 0 -1px 0 #000;
		border: 1px solid rgba(0,0,0,.83);

		height: 100%;
		width: 10px;
		top: 0px;
		content: '';
		left: 178px;
	}

	.tl_timeline .tl_next {
		background: #3d3d3d url(../images/triangle_right_white.png) no-repeat center;
		background: rgba(0,0,0,.7) url(../images/triangle_right_white.png) no-repeat center;
        left: 100%;

	}

	.tl_is_mobile .tl_next, .tl_is_mobile .tl_previous {
		display: inline !important;
	}

/* PROGRAM */

	.tl_timeline .tl_program_button {
		float: right;
		display: inline-block;
		color: #525252;
		padding: 5px;
		margin: 3px;
		background: #ffffff;
		border: 1px solid #D2D2D2;
		text-decoration: none;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		margin-left: 30px;
/*
			-webkit-transition:all 1s ease-in;  
			-moz-transition:all 5s ease-in;  
			-o-transition:all 1s ease-in;  
			transition:all 5s ease-in;  */
	}

	.tl_description_bottom {
		clear: both;
	}

	.tl_timeline .tl_program_button[data-val=true] {
		background: #ececec;
		background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #efefef), color-stop(100%, #e9e9e9));
		background-image: -webkit-linear-gradient(center top,#efefef 0%,#e9e9e9 100%);
		background-image: -moz-linear-gradient(center top,#efefef 0%,#e9e9e9 100%);
		background-image: -o-linear-gradient(center top,#efefef 0%,#e9e9e9 100%);
		background-image: -ms-linear-gradient(center top,#efefef 0%,#e9e9e9 100%);
		background-image: linear-gradient(center top,#efefef 0%,#e9e9e9 100%);
	}

	.tl_timeline .tl_link {
		display: inline-block;
		color: #525252;
		padding: 5px !important;
		margin: 3px !important;
		background: #ffffff;
		border: 1px solid #D2D2D2;
		text-decoration: none;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
	}

		.tl_timeline .tl_link .tl_link_icon {
			background: url(../images/link_icon.png) no-repeat top left;
			display: inline-block;
			width: 10px;
			height: 10px;
			margin-left: 10px;
		}

	.tl_timeline .tl_link:hover {
		background: #ececec;
		background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #efefef), color-stop(100%, #e9e9e9));
		background-image: -webkit-linear-gradient(center top,#efefef 0%,#e9e9e9 100%);
		background-image: -moz-linear-gradient(center top,#efefef 0%,#e9e9e9 100%);
		background-image: -o-linear-gradient(center top,#efefef 0%,#e9e9e9 100%);
		background-image: -ms-linear-gradient(center top,#efefef 0%,#e9e9e9 100%);
		background-image: linear-gradient(center top,#efefef 0%,#e9e9e9 100%);
	}

	.tl_timeline .tl_event_program_indicator.tl_active {
			background: #555555;
			background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #666666), color-stop(100%, #555555));
			background-image: -webkit-linear-gradient(center top,#666666 0%,#555555 100%);
			background-image: -moz-linear-gradient(center top,#666666 0%,#555555 100%);
			background-image: -o-linear-gradient(center top,#666666 0%,#555555 100%);
			background-image: -ms-linear-gradient(center top,#666666 0%,#555555 100%);
			background-image: linear-gradient(center top,#666666 0%,#555555 100%);

		border: 1px solid #555555;
		width: 6px;
		height: 6px;

		-moz-border-radius: 6px;
		-webkit-border-radius: 6px;
		border-radius: 6px;

		position: absolute;
		top: 37px;
		right: 3px;
	}


.tl_slidable {
	position: relative;
	left: 0px;
}

.tt_date_title_picker {
	/*display: none;*/
	position: absolute;
	display: none;
}

.tt_date_title_picker .ui-datepicker-calendar td {
	padding: 0 !important;
}
