/* mod_latestnews_blog.php */

#mybgcarouselY{ height:380px; max-width:1260px; width:99%; margin:auto; }

.mehr-infos {margin-top:0px; margin-left:0px; width:100%; height:99%; border:0px solid green;}
	
@media (max-width: 960px) {
	#mybgcarouselY{ height:289px; }
}
@media (max-width: 750px) {
	#mybgcarouselY{ height:225px; }
}
@media (max-width: 650px) {
	#mybgcarouselY{ height:195px; }
}
@media (max-width: 550px) {
	#mybgcarouselY{ height:165px; }
}
@media (max-width: 360px) {
	#mybgcarouselY{ height:108px; }
}
@media (max-width: 340px) {
	#mybgcarouselY{ height:102px; }
}
@media (max-width: 320px) {
	#mybgcarouselY{ height:96px;  }
}



/* ######### Shared CSS for various parts of carousel (in the event of multiple carousels) ######### */

div.bgcarousel{ /* shared CSS for main carousel container */
	background: black url(ajaxload.gif) center center no-repeat; /* loading gif while caoursel is loading */
}

div.bgcarousel img.navbutton{ /* CSS for the nav buttons */
}

div.bgcarousel div.slide{ /* CSS for each image's DIV container within main container */
	background-color: black;
	background-position: center center; /* center image within carousel */
	background-repeat: no-repeat;
	background-size: cover; /* CSS3 property to scale image within container? "cover" or "contain" */
	color: black;
}

div.bgcarousel div.selectedslide{ /* CSS for currently selected slide */
}

div.bgcarousel div.slide div.desc{ /* DIV that contains the textual description inside .slide */
	position: absolute;
	color: green;
	left: 5px;
	top: 5px;
	width:99%; height:96%;
	padding: 2px;
	font: bold 16px sans-serif, Arial;
	text-shadow: 0 -1px 1px #8a8a8a; /* CSS3 text shadow */
	z-index:5; border:0px solid red;
}

div.bgcarousel div.selectedslide div.desc{ /* CSS for currently selected slide's desc div */
}

div.bgcarousel div.slide div.desc h2{
	font-size:150%;
	margin:0;
}

div.bgcarousel div.slide div.desc a{
	color:yellow;
	text-decoration:none;
}

@media (max-width: 801px) {
	div.bgcarousel div.slide div.desc{
		left: 10px;
		top: 10px;
		width:40%; height:86%;
	}
}