/*Slider*/

.slider { clear: both; }
.slider-container	{ clear: both; width: 100%; }
.slider-container .slider { position: relative; overflow: hidden; }
.slider-container .slider > .slides { position: relative; display: block; width: 100%; padding: 0; margin: 0; list-style: none; z-index: 1; }
.slider-container .slider > .slides > li { position: absolute; display: block; padding: 0; margin: 0; left: 0px; top: 0px; width: 100%;	z-index: 0; opacity: 0; }
.slider-container .slider > .slides > li.recently-active { z-index: 1; opacity: 1; }
.slider-container .slider > .slides > li.active { z-index: 2; opacity: 1; }
.slider-container .slider > .slides > li > img,
.slider-container p > img { display: block; width: 100%; height: auto;}

.slider-container .slider {
	-webkit-transition: height 0.2s ease-in-out;
	   -moz-transition: height 0.2s ease-in-out;
	    -ms-transition: height 0.2s ease-in-out;
	     -o-transition: height 0.2s ease-in-out;
			transition: height 0.2s ease-in-out;
}

 .slider-container .slider > .slides > li {

	-webkit-transition: opacity 0.6s ease-in-out;
	   -moz-transition: opacity 0.6s ease-in-out;
	    -ms-transition: opacity 0.6s ease-in-out;
	     -o-transition: opacity 0.6s ease-in-out;
			transition: opacity 0.6s ease-in-out;
}

.slider-container .slider > .indicators > li {
	-webkit-transition: background-color 0.2s ease-in-out;
	   -moz-transition: background-color 0.2s ease-in-out;
	    -ms-transition: background-color 0.2s ease-in-out;
	     -o-transition: background-color 0.2s ease-in-out;
			transition: background-color 0.2s ease-in-out;
}

/*Breakpoints*/

@media screen and ( max-width: 768px ) {
	.slider-container .slider > .slides > li > .overlay { top: auto; bottom: 0; width: auto; height: auto; background: rgba(255,255,255,0.8); }
 	.slider-container .slider > .slides > li > .overlay > div > h3 + p,
 	.slider-container .slider > .slides > li > .overlay > div > p + p { display: none; }

	.slider-container {display: none}

 }

 @media screen and ( max-width: 480px ) {
	 .slider-container .slider > .slides > li > .overlay { display: none; }
 }
