/* Helpers */
.invisible { opacity:0 }
.hidden { display:none }
/* Main */
.tl-outer { 
	width:100%;
	position:relative;
	display:inline-block;
}
.tl-loader {
	width:60px;
	height:60px;
	position:absolute;
	top:50%;
	margin-top:-30px;
	left:50%;
	margin-left:-30px;
}
.tl-loader-box {
	width:26px;
	height:26px;
	margin:2px;
	float:left;	
	background-color:#111;
	animation-duration:800ms;
	animation-name:loaderAnim;
	animation-iteration-count:infinite;
}
#tl-ld-1 {
	/* background-color:green; */
}
#tl-ld-2 {
	/* background-color:red; */
	animation-delay:200ms;
}
#tl-ld-3 {
	/* background-color:yellow; */
	animation-delay:400ms;
}
#tl-ld-4 {
	/* background-color:blue; */
	animation-delay:600ms;
}
@keyframes loaderAnim {
	from {
		transform:scale(0);
	}
	to {
		transform:scale(1);
	}
}
.tl-tiles-container {
	overflow:hidden;
	position:relative;
}
.tl-arrow-holder {
	width:120px;
	position:absolute;
	top:0;
	bottom:0;
	text-align:center;
	cursor:pointer;
	opacity:0;
	z-index:9999;
}
.tl-arrow-holder:hover { opacity:1; }
.tl-arrow-prev { left:0 }
.tl-arrow-next { right:0 }
.tr-arrow-inner { 
	position:relative;
	width:100%;
	height:100%;
}
.tr-arrow-inner > span {
	position:absolute;	
	top:50%;
	margin-top:-25px;
	font-size:52px;
}
.tl-arrow-prev .tr-arrow-inner > span {
	left:15px;
}
.tl-arrow-next .tr-arrow-inner > span {
	right:15px;
}
.tl-pagesHolder {
	float:left;
}
.tl-page {
	float:left;
}
.tl-row {
	padding:0;
	/* width:100%;
	float:left; */
	/* position:relative; */
}
.tl-col { padding:0 }
.tl-tile {
	padding:5px;
	transition: all 250ms ease-out;
}
/* Animations (start) ---------------------------- */
/* Scale */
.tl-tile.tl-scale { transform: scale(0) }
.tl-tile.tl-scale-up { transform: scale(1) }
/* Fade */
.tl-tile.tl-fade { opacity:0 }
.tl-tile.tl-fade-in { opacity:1 }
/* Slide up */
.tl-tile.tl-slide-up { 
	position:relative;
	opacity:0;
	top:100px;
}
.tl-tile.tl-slide-up-f { 
	opacity:1;
	top:0;
}
/* Slide down */
.tl-tile.tl-slide-down { 
	position:relative;
	opacity:0;
	top:-100px;
}
.tl-tile.tl-slide-down-f { 
	opacity:1;
	top:0;
}
/* Slide left */
.tl-tile.tl-slide-left { 
	position:relative;
	opacity:0;
	left:-100px;
}
.tl-tile.tl-slide-left-in { 
	opacity:1;
	left:0;
}
/* Slide right */
.tl-tile.tl-slide-right { 
	position:relative;
	opacity:0;
	right:-100px;
}
.tl-tile.tl-slide-right-in { 
	opacity:1;
	right:0;
}
/* Animations (end) ------------------------------ */

.tl-bottom {
	/* position:absolute;
	bottom:0; */
}
.tl-tile-inner {
	width:100%;
	position:relative;
	padding-top:57%;
}
.tl-tile-content {
	position:absolute;
	top:0;
	left:0;
	bottom:0;
	right:0;
}