.hidden {

	display: none;

}



#sub-header {

	overflow: hidden;

	position: relative;

}



#slideshow {

	padding: 0;

	height: 400px;

}



#tmk-animation-holder {

	position: relative;

	width: 100%;

	height: 100%;

}



#tmk-animation-holder .wrapper {

	padding: 45px 0;

	position: relative;

	

	height:100%;

}



/** the H1s for within our animation sliders **/

.pricing-free-h1,

.pricing-light-h1,

.pricing-medium-h1,

.pricing-pro-h1 {

	position: relative;

}



/** the H2s for within our animation sliders **/

.pricing-free-h2,

.pricing-light-h2,

.pricing-medium-h2,

.pricing-pro-h2 {

	position: relative;

	top: 10px;

}



/** the paragraphs within the animation sliders **/

.pricing-free-p, 

.pricing-light-p, 

.pricing-medium-p,

.pricing-pro-p {

	position: relative;

	top: 20px;

}



/** the animations text containers **/

#tmk-animation-holder .anim-texts {

	left: 340px;

	top: 30px;

	position: absolute;

}



/** The First Slider **/

.anim-slider-1 {

	position: absolute;

	width:100%;

	height: 100%;

}



.pricing-free-img {

	position: absolute;

	top: 0;

	left: 0;

}



.pricing-free-h1, .pricing-free-h2, .pricing-free-p {

	position: relative;

	left: 0;

}



/** The Second Slider **/

.anim-slider-2 {

	position:absolute;

	width:100%;

	height: 100%;

	left: -9px;

}



.pricing-light-img {

	position:absolute;

	top:0;

	left: 0;

	opacity: 0;

}



.pricing-light-h1, .pricing-light-h2, .pricing-light-p {

	position: relative;

	opacity: 0;

}



/** The Third Slider **/

#tmk-animation-holder .anim-slider-3 .anim-texts {

	left: 400px;

	top: 30px;

	position: absolute;

}



.anim-slider-3 {

	position:absolute;

	width:100%;

	height: 100%;

}



.pricing-medium-img {

	position:absolute;

	top:0;

	left: 0;

	opacity: 0;

}



.pricing-medium-h1, .pricing-medium-h2, .pricing-medium-p {

	position: relative;

	opacity: 0;

}

/** The Fourth Slider **/

#tmk-animation-holder .anim-slider-4 .anim-texts {

	left: 400px;

	top: 30px;

	position: absolute;

}



.anim-slider-4 {

	position:absolute;

	width:100%;

	height: 100%;

}



.pricing-pro-img {

	position:absolute;

	top:0;

	left: 0;

	opacity: 0;

}



.pricing-pro-h1, .pricing-pro-h2, .pricing-pro-p {

	position: relative;

	opacity: 0;

}



/** The animations/transitions **/ 



	/* active */

.slide1 .pricing-free-img, 

.slide2 .pricing-light-img, 

.slide3 .pricing-medium-img, 

.slide4 .pricing-pro-img { 

	opacity: 1;

	top: 0;

	left: 0px;

}



.slide3 .pricing-medium-img {

	left: -65px;

}



	/* next to comes */

.slide1 .pricing-light-img, 

.slide2 .pricing-medium-img, 

.slide3 .pricing-pro-img,

.slide4 .pricing-free-img {

	left: -500px;

	opacity: 0;

}

	/* leaving */

.slide1 .pricing-pro-img,

.slide2 .pricing-free-img, 

.slide3 .pricing-light-img,

.slide4 .pricing-medium-img {

	opacity: 0;

	top: -500px;

}



	/* other */

.slide1 .pricing-medium-img,

.slide2 .pricing-pro-img, 

.slide3 .pricing-free-img,

.slide4 .pricing-light-img {

	opacity: 0;

}



	/* img transition */

.slide1 .pricing-free-img, 

.slide1 .pricing-light-img, 

.slide1 .pricing-pro-img,



.slide2 .pricing-free-img, 

.slide2 .pricing-light-img, 

.slide2 .pricing-medium-img, 



.slide3 .pricing-light-img,

.slide3 .pricing-medium-img, 

.slide3 .pricing-pro-img,



.slide4 .pricing-free-img,

.slide4 .pricing-medium-img, 

.slide4 .pricing-pro-img {

	transition: all 0.5s cubic-bezier(0.550, 0.055, 0.675, 0.190);

	-moz-transition: all 0.5s cubic-bezier(0.550, 0.055, 0.675, 0.190);

	-webkit-transition: all 0.5s cubic-bezier(0.550, 0.055, 0.675, 0.190);

	-ms-transition: all 0.5s cubic-bezier(0.550, 0.055, 0.675, 0.190);

	-o-transition: all 0.5s cubic-bezier(0.550, 0.055, 0.675, 0.190);

}



/* animating text */



	/* active */

.slide1 .pricing-free-h1, 

.slide2 .pricing-light-h1, 

.slide3 .pricing-medium-h1, 

.slide4 .pricing-pro-h1, 

.slide1 .pricing-free-h2, 

.slide2 .pricing-light-h2, 

.slide3 .pricing-medium-h2,  

.slide4 .pricing-pro-h2,  

.slide1 .pricing-free-p, 

.slide2 .pricing-light-p,

.slide3 .pricing-medium-p,

.slide4 .pricing-pro-p {

	opacity: 1;

	left: 0px;

	top: 0px;

}



.slide1 .pricing-free-h1 {

	left: -9px;

} 



.slide1 .pricing-free-h2, 

.slide2 .pricing-light-h2, 

.slide3 .pricing-medium-h2,

.slide4 .pricing-pro-h2 {

	top: 10px;

} 



.slide1 .pricing-free-p, 

.slide2 .pricing-light-p,

.slide3 .pricing-medium-p, 

.slide4 .pricing-pro-p {

	top: 20px;

}





	/* next to comes */

.slide1 .pricing-light-h1, 

.slide2 .pricing-medium-h1, 

.slide3 .pricing-pro-h1, 

.slide4 .pricing-free-h1, 



.slide1 .pricing-light-h2, 

.slide2 .pricing-medium-h2, 

.slide3 .pricing-pro-h2, 

.slide4 .pricing-free-h2, 



.slide1 .pricing-light-p, 

.slide2 .pricing-medium-p, 

.slide3 .pricing-pro-p, 

.slide4 .pricing-free-p { 

	left: 1000px;

	opacity: 0;

}



	/* leaving */

.slide1 .pricing-pro-h1,

.slide2 .pricing-free-h1, 

.slide3 .pricing-light-h1,

.slide4 .pricing-medium-h1,



.slide1 .pricing-pro-h2,

.slide2 .pricing-free-h2, 

.slide3 .pricing-light-h2,

.slide4 .pricing-medium-h2,



.slide1 .pricing-pro-p,

.slide2 .pricing-free-p, 

.slide3 .pricing-light-p,

.slide4 .pricing-medium-p {

	top: 550px;

	opacity: 0;

}



.slide2 .pricing-free-h1 { 

	left: -9px;

}



	/* other */

.slide1 .pricing-medium-h1,

.slide1 .pricing-medium-h2,

.slide1 .pricing-medium-p,

.slide2 .pricing-pro-h1, 

.slide2 .pricing-pro-h2, 

.slide2 .pricing-pro-p, 

.slide3 .pricing-free-h1,

.slide3 .pricing-free-h2,

.slide3 .pricing-free-p,

.slide4 .pricing-light-h1,

.slide4 .pricing-light-h2, 

.slide4 .pricing-light-p {

	opacity: 0;

}

	/* transition on leaving */

.slide1 .pricing-pro-h1,

.slide1 .pricing-light-h1, 

.slide2 .pricing-free-h1, 

.slide2 .pricing-medium-h1, 

.slide3 .pricing-light-h1,

.slide3 .pricing-pro-h1, 

.slide4 .pricing-medium-h1,

.slide4 .pricing-free-h1, 



.slide1 .pricing-pro-h2,

.slide1 .pricing-light-h2, 

.slide2 .pricing-free-h2, 

.slide2 .pricing-medium-h2, 

.slide3 .pricing-light-h2,

.slide3 .pricing-pro-h2, 

.slide4 .pricing-medium-h2,

.slide4 .pricing-free-h2, 



.slide1 .pricing-pro-p,

.slide1 .pricing-light-p, 

.slide2 .pricing-free-p, 

.slide2 .pricing-medium-p, 

.slide3 .pricing-light-p,

.slide3 .pricing-pro-p, 

.slide4 .pricing-medium-p,

.slide4 .pricing-free-p { 

	transition: all 0.5s cubic-bezier(0.550, 0.055, 0.675, 0.190);

	-moz-transition: all 0.5s cubic-bezier(0.550, 0.055, 0.675, 0.190);

	-webkit-transition: all 0.5s cubic-bezier(0.550, 0.055, 0.675, 0.190);

	-ms-transition: all 0.5s cubic-bezier(0.550, 0.055, 0.675, 0.190);

	-o-transition: all 0.5s cubic-bezier(0.550, 0.055, 0.675, 0.190);

}



	/* delay of arrival */

.slide1 .pricing-free-h1, 

.slide2 .pricing-light-h1, 

.slide3 .pricing-medium-h1,

.slide4 .pricing-pro-h1 {

	transition: all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0.2s;

	-moz-transition: all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0.2s;

	-webkit-transition: all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0.2s;

	-ms-transition: all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0.2s;

	-o-transition: all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0.2s;

}



.slide1 .pricing-free-h2, 

.slide2 .pricing-light-h2, 

.slide3 .pricing-medium-h2, 

.slide4 .pricing-pro-h2 { 

	transition: all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0.4s;

	-moz-transition: all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0.4s;

	-webkit-transition: all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0.4s;

	-ms-transition: all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0.4s;

	-o-transition: all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0.4s;

}



.slide1 .pricing-free-p, 

.slide2 .pricing-light-p, 

.slide3 .pricing-medium-p, 

.slide4 .pricing-pro-p { 

	transition: all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0.6s;

	-moz-transition: all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0.6s;

	-webkit-transition: all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0.6s;

	-ms-transition: all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0.6s;

	-o-transition: all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0.6s;

}



/** Responsive **/

@media all and (min-width: 768px) and (max-width: 959px) {

	#slideshow {height: 350px;}

	

	#tmk-animation-holder .anim-texts {

		left:280px;

	}

	.slide1 .pricing-free-img {

		width: 233px;

	}



	.pricing-free-h1 img { width: 185px;}

	

	.pricing-free-p img,

	.pricing-light-p img,

	.pricing-medium-p img,

	.pricing-pro-p img {

		width:468px;

	}



	.slide2 .pricing-light-img {

		width:232px;

	}

	.pricing-light-h1 img {

		width: 215px;

	}



	#tmk-animation-holder .anim-slider-3 .anim-texts {left:300px; top:10px;}

	.slide3 .pricing-medium-img {

		width:354px;

	}

	

	.pricing-medium-h1 img {

		width: 390px;

	}



	#tmk-animation-holder .anim-slider-4 .anim-texts {left:320px;}

	.pricing-pro-img {

		width:292px;

	}

	.pricing-pro-h1 img {width:155px;}

}



@media all and (max-width: 767px) {

	#tmk-animation-holder .wrapper {

		padding: 0;

	}



	#tmk-animation-holder .anim-texts {

		display: none;

	}



	.slide1 .pricing-free-img {

		top: 50%;

		left:50%;

		margin: -158px 0 0 -145px;

	}



	.slide2 .pricing-light-img {

		top: 50%;

		left:50%;

		margin: -158px 0 0 -145px;

	}



	.slide3 .pricing-medium-img {

		width: 320px;

		top: 50%;

		left:50%;

		margin: -118px 0 0 -160px;

	}



	.slide4 .pricing-pro-img {

		width: 320px;

		top: 50%;

		left:50%;

		margin: -135px 0 0 -160px;

	}

}
