a{ -webkit-tap-highlight-color: rgba(0,0,0,0); /* touch overlay entfernen */ }

.royalSlider {	
	position:relative;
	/* set width and height of slider here, in px, % or em*/
	width:600px;
	height:300px;
	/* Used to prevent content "jumping" on page load. this property is removed when javascript is loaded and slider is instanciated */
	overflow:hidden;
}



/* 

Slides croped area

 */
.royalSlider .royalWrapper {
	overflow:hidden;	
	position:relative;
	
	background: #fff;
	
	width:100%; 
	height:100%;
}

/* slides holder, grabbing container */
.royalSlider .royalSlidesContainer {
	position: relative;
	left: 0;
	top: 0;	
	list-style:none;
	margin:0;
	padding:0;
}


/* slide item */
.royalSlider .royalSlide{
	padding:0;
	margin:0;	
	
	position:relative;
	float:left;	
	
	overflow:hidden;	
}

/* 

	Direction Navigation (arrows) 

*/
.royalSlider .arrow
{	
	background:url(../img/controlsSpriteBlack.png) no-repeat 0 0;

	/* change arrows size here */
	width: 45px;
	height: 90px;
	
	top:155px;	
	
	cursor: pointer;
	display: block;
	position: absolute;		
	
	z-index:25;
	
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
	filter: alpha(opacity=80);
	-moz-opacity: 0.8;
	-khtml-opacity: 0.8;
	opacity: 0.8;	
}
.royalSlider .arrow:hover
{
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;
	opacity: 1;	
}
.royalSlider .arrow.disabled
{
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
	filter: alpha(opacity=20);
	-moz-opacity: 0.2;
	-khtml-opacity: 0.2;
	opacity: 0.2;	
}
/* left arrow */
.royalSlider .arrow.left
{
	background-position: top left;
	left: 0;	
}
/* right arrow */
.royalSlider .arrow.right
{
	background-position: top right;
	right: 0;
}




/* Control navigation container (bullets or thumbs) */
.royalSlider .royalControlNavOverflow {
	width:100%;
	overflow:hidden;
	position:absolute;
	margin-top:-20px;
}
/* This container is inside ".royalControlNavContainer"  
   and is used for auto horizontal centering */
.royalControlNavCenterer {	
	float: left;
	position: relative;
	left: -50%;
}
/* Control navigation container*/ 
.royalControlNavContainer {
	float: left;
	position: relative;
	left: 50%;	
}

/* Scrollable thumbnails containers */
.royalSlider .royalControlNavOverflow.royalThumbs {	
	margin-top:50px;
	height:80px;
}
.royalSlider .royalControlNavThumbsContainer {		
	left:0;
	position:relative;
}






/* 

	Control navigation (bullets, thumbnails)
	
*/
.royalControlNavOverflow a{	
	background: url('../img/controlsSpriteBlack.png') no-repeat 0 -149px transparent;
	width:17px;
	height:17px;	
	
	float:left;	
	cursor:pointer;	
	
	position:relative;
	display:block;
	
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
	filter: alpha(opacity=80);
	-moz-opacity: 0.8;
	-khtml-opacity: 0.8;
	opacity: 0.8;
}
/* Current control navigation item */
.royalControlNavOverflow a.current {	
	background-position: 0 -183px !important;
}
/* Hover state navigation item */
.royalControlNavOverflow a:hover {	
	background-position: 0 -166px;	
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;
	opacity: 1;	
}

/* Thumbnails */
.royalControlNavOverflow a.royalThumb{	
	background: none no-repeat 0 0;
	background-color:#fff;
	width:144px; /* best is 144 + spacing(margin-right) 4*/
	height:60px;	
	/* thumbnails spacing, use margin-right only */	
	margin-right:4px;
		
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;
	opacity: 1;	
}
.royalControlNavOverflow a.royalThumb.current {	
	background-position: -3px -3px  !important;
	border:3px solid #777 !important;
	width:138px;
	height:54px;
}
.royalControlNavOverflow a.royalThumb:hover {	
	background-position: -3px -3px;	
	border:3px solid #777;
	width:138px;
	height:54px;
}



/* 

	Thumbnails navigation arrows 
	
*/
.royalSlider .thumbsArrow {
	background:url(../img/controlsSpriteBlack.png) no-repeat 0 0;
	width: 38px;
	height: 68px;
	
	
	cursor: pointer;
	display: block;
	position: absolute;		
	z-index: 25;
	
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
	filter: alpha(opacity=80);
	-moz-opacity: 0.8;
	-khtml-opacity: 0.8;
	opacity: 0.8;	
	
	margin-top:46px;
}
.royalSlider .thumbsArrow.left {
	background-position: -116px -132px;
	left: 0;	
}
.royalSlider .thumbsArrow.right {
	background-position: -156px -132px;
	right: 0
}
.royalSlider .thumbsArrow:hover  {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;
	opacity: 1;	
}
.royalSlider .thumbsArrow.disabled {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
	filter: alpha(opacity=20);
	-moz-opacity: 0.2;
	-khtml-opacity: 0.2;
	opacity: 0.2;	
}






/* Captions container */
.royalSlider .royalCaption {
	z-index:20;
	display:block;
	position:absolute;	
	left:0;
	top:0;
	font: normal normal normal 1em/1.5em Georgia, serif;
	color:#FFF;	
	white-space: nowrap;	 
}
/* Caption item */
.royalSlider .royalCaptionItem {
	clear:both;
	font-size:2em;	
	line-height:1.5em;
	position:relative;	
	margin:0;
}



/* Loading (welcome) screen */
.royalSlider .royalLoadingScreen {
	background:#FFF;
	width:100%;
	height:100%;
	position:absolute;
	z-index:99;	
}
/* Loading screen text ("Loading...") */
.royalSlider .royalLoadingScreen p {		
	width:100%;
	position:absolute;	
	margin:0 auto;
	top: 45%;
	text-align:center;
}

/* single image preloader ("Loading image...") text can be changed in JS file*/
.royalSlider .royalPreloader {
	font: normal normal normal 0.8em/1.5em Georgia, serif;
	color:#DDD;	
	position:absolute;
	width:100%;
	text-align:center;
	top:46%;		
}






/* Anpassungen */
#simpleGallery {
	width: 960px;			
	height: 450px;
	
	background:#fff;			
	margin:0 auto;
	padding-bottom:68px;
}
       		
.royalSlider .arrow	{ top:180px; }
.royalSlider .royalMidText { font-size:1em;	}
.royalCaptionItem a {
	color:#FFF;
	text-decoration:underline;	
}
#wrapper {
	width:960px !important;
	margin:0 auto;
}



/* controller navi */
#close{ 
	position:absolute; 
	z-index:1000; 
	top:0; 
	left:0; 
	width:43px; 
	height:43px; 
	background-color:#FF6600;
	
	background: #ff7200; /* Old browsers */
	background: -moz-linear-gradient(top, #ff9000 0%, #ff7200 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff9000), color-stop(100%,#ff7200)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #ff9000 0%,#ff7200 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #ff9000 0%,#ff7200 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, #ff9000 0%,#ff7200 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff9000', endColorstr='#ff7200',GradientType=0 ); /* IE6-9 */
	background: linear-gradient(top, #ff9000 0%,#ff7200 100%); /* W3C */
	
	 
	color:#666;
	-moz-border-radius-topleft: 0px;
	-moz-border-radius-topright: 0px;
	-moz-border-radius-bottomright: 10px;
	-moz-border-radius-bottomleft: 0px;
	-webkit-border-radius: 0px 0px 10px 0px;
	border-radius: 0px 0px 10px 0px; 
	
	-webkit-box-shadow: 2px 2px 5px 1px rgba(000, 000, 000, 0.3);
	-moz-box-shadow: 2px 2px 5px 1px rgba(000, 000, 000, 0.3);
	box-shadow: 2px 2px 5px 1px rgba(000, 000, 000, 0.3); 
	cursor:pointer;
}

#close img{
	width:40px;
	height:40px;
}

#thumbs_onoff{ position:absolute; z-index:1000; top:42px; left:0; width:40px; height:40px; background-color:#666; cursor:pointer;  display:none; }

#wrapper{
	margin-top:150px;
}



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

#wrapper{
	margin-top:80px;
}


.royalSlider .royalControlNavOverflow.royalThumbs {	
	margin-top:4px;
}

.royalSlider .thumbsArrow {
	margin-top:0;
}
	
}


@media only screen and (max-width: 960px){
#close{ 
	width:63px; 
	height:63px;
}

#close img{
	width:60px;
	height:60px;
}

#wrapper{
	margin-top:0;
}

.royalSlider .royalControlNavOverflow.royalThumbs {	
	margin-top:4px;
}

.royalSlider .thumbsArrow {
	margin-top:0;
}


}


@media only screen and (max-width: 728px){
#close{ 
	width:63px; 
	height:63px;
}

#close img{
	width:60px;
	height:60px;
}


#wrapper{
	margin-top:0;
}

.royalSlider .royalControlNavOverflow.royalThumbs {	
	margin-top:4px;
}

.royalSlider .thumbsArrow {
	margin-top:0;
}

}