
#container_sl {
	position:relative;
	position:absolute;
	top:0px;
	right:0px;/**/
	width:100%;
	height:300px;
	display:block;
	margin-top:0px;
	margin-left:0%;
	padding-bottom: 0px;
	/*background-color: #F00;
	border:solid 1px red;*/
	overflow:hidden;
}

/*
	Slideshow
*/

#slides{
	overflow:hidden;
	position:absolute;
	z-index:100;
}

#intro {
 	position:absolute;
 	width:100%;
 /*	border:solid 1px blue;*/
 
 
}

/*
	Slides container
	Important:
	Set the width of your slides container
	Set to display none, prevents content flash
*/

.slides_container {
	width:100%;
	overflow:hidden;
	position:relative;
	display:none;
}

.slides_container div.slide {
	width:600px;
	height:300px;
	display:block;
	position:relative;
}
.slidetext {
	position:absolute;
	z-index:50;
	bottom:40px;
	margin-top:-19px;
	left:40px;
}
.slidetext span{
	display:inline-block;
	padding:10px 20px;
	background-color: rgba(0,91,172,0.8);
	font-size: 22px;
	line-height: 22px;
	font-family: "Open Sans Condensed",sans-serif;
	font-family: 'Heebo', sans-serif;
	text-transform: uppercase;
	font-weight: 700;
	color:#FFF;	
}
/*
	Each slide
	Important:
	Set the width of your slides
	If height not specified height will be set by the slide content
	Set to display block
*/

.slides_container a {
	
	width:100%;
	display:block;
}
.slides_container img {
	width:100%;
	height:auto;
	/*border:solid 5px red;*/
}
#content #container_sl .slides_container a img {
	position:relative;

}

/*
	Next/prev buttons
*/

.content .next img, .content .prev img {
	width:auto;
	height:auto;
	
}



#intro .next, #intro .prev {
	background-repeat: no-repeat;
	background-position: 0px center;
	background-size: 40px 40px;	
	position:absolute;
	top:0px;	
	left:0px;
	width:100px;
	height:100%;
	display:block;
	z-index:10;
	cursor:pointer;
	/*background-color: rgba(200,200,200,0.8);*/
	
}
#intro .prev {
	background-image:url(../userfiles/images/meta/arrow-prev.svg);
}
#intro .next {
	background-image:url(../userfiles/images/meta/arrow-next.svg);
	background-position: right center;
	left:500px;
}

/*
	Pagination
*/

#intro ul.pagination{
	z-index:200;
	/*background-color: #Ff0;*/
	display:block;
	display:none;
}



.pagination {
	position:absolute;
	bottom:-30px;
	margin-left:-23px;
	height:12px;
	width:400px;
	display:none;
	/*background-color: #Ff0;*/
}

.pagination li {
	float:left;
	margin:0 1px;
	list-style:none;
}

.pagination li a {
	display:block;
	width:14px;
	height:0;
	padding-top:12px;
	background-image:url(../userfiles/images/meta/pagination2.png);
	background-position:0 0;
	float:left;
	overflow:hidden;
}

.pagination li.current a {
	background-position:0 -12px;
}

@media only screen and (max-width: 1600px) {

}

@media only screen and (max-width: 1279px) {
	#container_sl { height:250px;}
	.slides_container div.slide { width:500px; height: 250px;}
	#intro .next { left:400px; }
}


/* Tablet Portrait */
@media only screen and (max-width: 1023px) {	
	#intro .next, #intro .prev {background-size: 20px 20px; }
	#container_sl, .slides_container div.slide  { width:384px; height:192px;}
	#intro .next { left:284px; }

}



@media only screen and (max-width: 767px) {
	#intro .next, #intro .prev {background-size: 20px 20px; }
	#container_sl { width:256px; height:128px;}
	.slides_container div.slide { width:256px; height: 128px;}
	#intro .next { left:156px; }
}

@media only screen and (max-width: 512px) {
	#intro .next, #intro .prev {background-size: 20px 20px; }
	#container_sl, .slides_container div.slide { width:320px; height:160px;}
	#intro .next { left:220px; }
	
}
@media only screen and (max-width: 384px) {

	
	#intro .next, #intro .prev {background-size: 20px 20px; }
	#container_sl, .slides_container div.slide { width:320px; height:160px;}
	#intro .next { left:220px; }
	
}