@CHARSET "UTF-8";

/** GALLERY STYLES
===================================*/

.mv-bubble-gallery{
	/*width: 800px;*/
	height: auto;
	color: #fff;
	margin-bottom: 40px;
}
#content .mv-bubble-gallery h2, #content .mv-bubble-gallery h3{
	margin: 0px;
	padding-bottom:20px;
	line-height: 24px;
	font-size: 22px;
}
.mv-bubble-gallery .clear{
	clear:both;
}
.mv-bubble-gallery .descriptions{
	width: 188px;
	height: auto;
	float: left;
	color: #3F3F3F;

}
.mv-bubble-gallery .images{
	width: 280px;
	height: 280px;
	float: left;
	margin-left:20px;
}
.mv-bubble-gallery .thumbs{
	width: 192px;
	height: auto;
	float: right;
	margin-left:20px;
}
/*ITEMS*/
.mv-bubble-gallery .thumb{
	width: 86px;
	height: 86px;
	cursor: pointer;
	border: 1px solid #eee;
	margin: 0 0 5px 5px ;
	-webkit-border-radius: 230px;/*100%*/
	-moz-border-radius: 230px;
	border-radius: 230px;
}
.mv-bubble-gallery .image{
	width: 280px;
	height: 280px;
	display:none;
	border: 1px solid #eee;
	-webkit-border-radius: 230px;
	-moz-border-radius: 230px;
	border-radius: 230px;
}
.mv-bubble-gallery .description{
	display:none;
}
.mv-bubble-gallery .image.active, .mv-bubble-gallery .description.active{ 
	display:block;
}


/** RESPONSIVE
===================================*/



/*NORMAL*/
.mv-bubble-gallery{
	width:700px;
}



/*Small*/
@media (max-width:767px){
	
	.mv-bubble-gallery{
		width:500px;
	}
	.mv-bubble-gallery .images{
		display:none; 
 	}
	.mv-bubble-gallery .descriptions{
		width:270px;
 	}
	
}

/*Mid*/
@media (min-width:768px) and (max-width:979px){
	
	.mv-bubble-gallery{
		width:500px;
	}
	.mv-bubble-gallery .images{
		display:none; 
 	}
	.mv-bubble-gallery .descriptions{
		width:270px;
 	}
}

/*Mobile*/
@media (max-width:600px){
	
	.mv-bubble-gallery{
		width:395px;
	}
	.mv-bubble-gallery .thumbs{
		margin-left:10px;
	}
	.mv-bubble-gallery .images{
		display:none; 
 	}
	.mv-bubble-gallery .descriptions{
		width:180px;
 	}
}

/*iPhone*/
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) { 

	.mv-bubble-gallery{
		width: 100%;
	}
	.mv-bubble-gallery .thumbs{
		margin-left: 0px;
		display: block;
		float: left;
		height: auto;
    	width: 295px;
	}
	.mv-bubble-gallery .descriptions{
		margin-left: 10px;
		display: block;
		width: 100%;
	}
	.mv-bubble-gallery .images{
		display: none; 
 	}
 	
}
	
/*über 1200*/
@media (min-width:1200px){
	
	.mv-bubble-gallery{width:800px;}
	
	.mv-bubble-gallery .images{
		width: 380px;
		height: 380px;
 
	}
	.mv-bubble-gallery .image{
		width: 380px;
		height: 380px;
 
	}

}