/* Getting the new tags to behave */
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video{ display: block; }
mark, rp, rt, ruby, summary, time{ display: inline }

	/* Site-wide properties ======================================================== */
	body{
	    font: normal normal 10px/10px OpenSans, sans-serif, Helvetica, Verdana; color: #000;
	}
	    

	/* hide email from robots */
	.bodytext .h { display:none; }
	    
	    
	    /* Fibonacci based heading scale ratio */
	    nav{ font-size: 1.6em; }
	    h1{ font-size: 3em; padding: 7px 0 25px; line-height: 1.2em }
	    h2{ font-size: 1.6em; padding: 3px 0 20px; line-height: 1.2em; font-weight:600; letter-spacing:.09em; }
	    h3 { font-size: 1.7em; padding: 2px 0 15px; line-height: 1.2em; }
	    h4{ font-size: 1.6em; font-weight: bold; padding-bottom: 10px; line-height: 1.4em;color: #333; }
	    p{ font-size: 1.3em; font-weight: normal; line-height: 1.5em; padding-bottom: 25px; list-style-type: none; }
	    p + p { margin-top: -15px; }
	    #content a{ color:#000; font-weight: bold;  line-height: 1.5em; }
	    #content li { font-size: 1.3em; font-weight: normal; line-height: 1.5em; list-style-type: inherit; margin-left: 2%;}
	    footer a { display: block; font-weight: bold; line-height: 1.5em; text-decoration: none;  }
   	    footer li{ font-size: 1.3em; font-weight: normal; line-height: 1.5em; list-style-type: none; }
	    
	
	/* Reusable classes ============================================================ */
	
	/* Left & Right alignment */
	.left{ float: left; }
	.right{ float: right; }
	
	/* The inside class provides consistent padding. To be used often! */
	.inside{ padding: 2%; }
	
	/* Basic Structure ============================================================= */
		
	  /* Header */
		#wrap > header {
		    /* height: 126px; */
		}
		
		#logo {
			margin: 0 auto;
		}
		#logo img {
			/*
		    position: absolute;
		    z-index: 1100;
		    margin-top: -2.8em;
		    width: auto;
		    */
		}
		#logo a,
		#logo img {
			display:block;
		}
	    nav{
			margin: 0 auto;
	    }
	    #topnav {
	    	
	    }
		#navbox {
		    width: 100%;
		}
		nav select { display: none;	} /* -- Ausblenden des Navigations-Selektors -- */
		nav ul {
		    float: right;
		    margin: -4px 0;
		}
		nav ul li {
		    display: inline-block;
		    padding: 13px 0;
		    margin: 4px 0;
		}
		/* dropdown */
		nav li ul span{
			display: none;
		}
		#spacer{
			display: none;
		}
		nav li ul {
			float: left;
			opacity: 0;
			position: absolute;
			top: -200px;
		}
		nav li:hover ul {
		    display: inline;
		    z-index: 1000;
		    padding: 0;
		    position: absolute;
		    top: 89px;
		    z-index: 1;
		    opacity: 1; 
		}
		nav li li, nav li li:hover {
			display: block;
		}
		.menubutton{
			display: none;
		}
	  /* Content */
	    #slider {
		    margin: 0 auto 0;
		    width: 1003px;
		}
	    #slider header{
	    	display: none;
	    }
	    #slider DIV.csc-textpic .csc-textpic-imagewrap .csc-textpic-image {
		    margin-top: 20px;
		    margin-bottom: 0;
		}
	    featured{
	    	margin: 0 auto;
	    }
	    #rootline {
		    margin: 15px 0 10px;
		    padding-left: 2%;
		    font-size: 1.1em;
		}
		#rootline ul {
			list-style-type:none;
			margin:0;
			padding:0;
		}
		#rootline ul li {
		    background: url("../img/nav-footer-arrow.gif") no-repeat scroll 0 50% transparent;
		    display: inline;
		    font-size: 1em;
		    margin-left: 0;
		    padding: 0 1em 0 1.25em;
		}
		#rootline ul li.first {
			background: 0;
			padding:0;
		    padding-right:1em;
			display: none;
		}
		#roothome {
		    float: left;
		    padding-right: 1em;
		    font-size: 1.1em;
		}
		#content {
		    min-height: 200px;
		    text-align: center;
		    width: 100%;
		}
		#contentbox {
		    display: inline-block;
		    margin: 0 auto;
		    text-align: left;
		}
		header,
		#contentbox {
			width:998px;
		}
	    article{
	    	float: left;
	    }
	    article header, article hr{
	    	height: auto;
	    	text-align: center;
	    	line-height: 1em;
		    margin-bottom: 2em;
	    }
		.headline {
		    margin: 10px 0 32px;
		}
		.title {
		    padding: 6px 0 18px;
		}
	    aside{
	    	float: left;
	    	margin-bottom: 1em;
	    }
      
    
    #full 
      
	    /* Flexslider - Style */
	    .flexslider .slides > li {
		    margin-top: 20px;
		}
	    
	    /* Fancybox - Style */
	    .fancybox-title-float-wrap {
		    margin-bottom: 2%;
		}
		.fancybox-skin {
		    padding: 2%;
		}
		.fancybox-title-float-wrap {
		    margin-bottom: 2%;
		    max-width: 100%;
		}
		.fancybox-inner !important {  }
		.fancybox-title-over-wrap {
		    bottom: 0;
		    left: 0;
		    margin-bottom: 1%;
		    padding: 4px 0;
		    position: absolute;
		    text-align: center;
		    width: 100%;
		}

		/* Kontaktformular */
		div.csc-mailform li label {
		    height: 2.5em;
		}
		label em, legend em {
	    	margin: -21px 0 0 40px;
		    position: absolute;
		}
		label strong, legend strong {
		    display: block;
		    font-size: 75%;
		    font-weight: normal;
		    line-height: 1.1em;
		    margin: -80px 0 0;
		    position: absolute;
		    text-transform: uppercase;
		}
		.form textarea { border: 1px solid #394545; padding:5px; }
    .form textarea:hover { border: 1px solid #ededed;}
    .form textblock { margin-left: 185px; }
		.form input[type=text] { width: 240px; margin-bottom: 1em; height: 25px; border: 1px solid #394545; padding-left:5px; }
    .form input:hover[type=text] {border: 1px solid #ededed; }
		.form input[type=submit] { 
      margin-top: 5px; 
      margin-left: 185px;	
      font-size: 14px;
      padding: 10px 20px;
       }
      
      .form input:hover[type=submit] { 
      margin-top: 5px; 
      margin-left: 185px;	
      font-size: 14px;
      padding: 10px 20px;
         }
  
		/* OpenStreetMap */ 
		#OpenLayers.Map_3_events{ z-index: 0; }
		.tx-odsosm-pi1 { margin-top: 20px; }
		#slider .leaflet-container !important { height: 200px; }
		/* 100% - Sidebar unten */
		.once article{
	        width: 100%;
		}
	    .once article .headline{
	    	float: left;
	    	height: auto;
	    	width: 30%;
		}
		.once article .title{
			width: 40%;
			float: left;
		}
	    .once aside{
	        width: 100%; 
		}
		/* ⅔ - ⅓ */
		.twothirds > .inside {
			float: left;
			width: 62%;
		}
		
     #full .twothirds > .inside {width: 97%;}
    
    
		.twothirds article .headline{
	    	float: left;
	    	height: auto;
	    	width: 19%;
		}
		.twothirds article .title{
			width: 60%;
			float: left;
		}
		.twothirds aside{
			width: 30%;
			padding: 2%;
		}
		img, embed, object, video {
			max-width: 100%;
			height: auto;
			width: 100%;
		}
		DIV.csc-textpic-above DIV.csc-textpic-imagewrap,
			DIV.csc-textpic-below DIV.csc-textpic-imagewrap,
			DIV.csc-textpic DIV.csc-textpic-imagewrap UL LI,
			DIV.csc-textpic DIV.csc-textpic-imagewrap DL.csc-textpic-image {
			float: none;
		}
	  	  
	  /* Footer */
		footer {
	    	float: left;
	    	width: 100%;
	    	line-height: 1.5em;
		}
		#footerbox {
	    	margin: 0 auto;
	    	width: 960px;
		}
		.thirds {
	    	float: left;
	    	height: auto;
	    	padding: 40px 2%;
	    	width: 29.3%;
		}
	/* CE Elemente ============================================================= */
	
	
	div.sidebarBox {
		padding: 15px;
		margin-bottom: 20px;
		overflow: auto;
	}
	
	/* Bildelemente */
	
	/* The fraction classes are useful for column lists */
	
	
	#whitebox .full, .half, .third, .quarter, .fifth, .sixth{ width: 100%; }
	#whitebox .half, .third , .quarter , .fifth , .sixth { float: left; }
	#whitebox .full  { margin: 1.25%; padding: 1.25%; width: 95%; }
	#whitebox .half  { margin: 1.25%; padding: 1.25%; width: 45%; }
	#whitebox .third {  margin: 1.25%; padding: 1.25%; width: 28.3% }
	#whitebox .quarter {  margin: 1.25%; padding: 1.25%; width: 20% }
	#whitebox .fifth {  margin: 1.25%; padding: 1.25%; width: 15% }
	#whitebox  {
	    list-style: none outside none;
		margin-left: 0;
		font-size: 1em;
		opacity: 0.9;
	}
	#whitebox:hover {
	    opacity: 1;
	}
	#whitebox DIV.csc-textpic .csc-textpic-imagewrap .csc-textpic-image {
	    margin-bottom: 0;
	}
	#whitebox FIGCAPTION.csc-textpic-caption {
	    display: table-caption;
	    padding: 10px 0 5px;
	    font-size: 1.1em;
	}
	#whitebox p {
	    font-size: 1.3em;
	    margin: 2%;
	} 
	#whitebox header {
	    font-size: 1em;
	    margin: 2% 2% -10px;
	}
	/* 3 Spalten */
	
	.ce-thirds {
	    float: left;
	    margin: 0 2% 0 0;
	    width: 31%;
	}
	/* 2 Spalten */
	
	.ce-half {
	    float: left;
	    margin: 0 2% 0 0;
	    width: 48%;
	}
	
	    
	/* Project specifics =========================================================== */
	nav a {	    
	    padding: 9px 15px;
	    text-decoration: none;
	}
	nav .navactive{

	}
	#updateyourbrowser {display: none;}
	
	/* Superfish ================================================================= */
 
	/*** ESSENTIAL STYLES ***/
	.sf-menu, .sf-menu * {
		margin:			0;
		padding:		0;
		list-style:		none;
	}
	.sf-menu {
		line-height:	0.8;
	}
	.sf-menu ul {
		position:		absolute;
		top:			-999em;
		width:			12em; /* left offset of submenus need to match (see below) */
	}
	.sf-menu ul li {
		width:			100%;
	}
	.sf-menu li:hover {
		visibility:		inherit; /* fixes IE7 'sticky bug' */
	}
	.sf-menu li {
		float:			left;
		position:		relative;
	}
	.sf-menu a {
		display:		block;
		position:		relative;
	}
	.sf-menu li:hover ul,
	.sf-menu li.sfHover ul {
		left:			0;
		top:			37px; /* match top ul list item height */
		z-index:		99;
	}
	ul.sf-menu li:hover li ul,
	ul.sf-menu li.sfHover li ul {
		top:			-999em;
	}
	ul.sf-menu li li:hover ul,
	ul.sf-menu li li.sfHover ul {
		left:			15em; /* match ul width */
		top:			0;
	}
	ul.sf-menu li li:hover li ul,
	ul.sf-menu li li.sfHover li ul {
		top:			-999em;
	}
	ul.sf-menu li li li:hover ul,
	ul.sf-menu li li li.sfHover ul {
		left:			10em; /* match ul width */
		top:			0;
	}
	 
	/*** DEMO SKIN ***/
	.sf-menu {
		float: right;
	}
	.sf-menu a {
		border-left:	0 none;
		padding: 		12px 14px;
		text-decoration:none;
		font-weight:bold;
	}
	.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
		
	}
	.sf-menu li {
		background: transparent;
	}
	.sf-menu li li {
		border-bottom: 1px solid #ccc;
	}
	.sf-menu li:hover {
		outline: 0;
	}
	.sf-menu li:hover #aktiv{
		
	}
	.sf-menu li #aktiv{
		
	}
	
	/*** arrows **/
	.sf-menu a.sf-with-ul {
		padding-right: 	2.25em;
		min-width:		1px; /* trigger IE7 hasLayout so spans position accurately */
	}
	.sf-sub-indicator {
		position:		absolute;
		display:		block;
		right:			.75em;
		top:			1.05em; /* IE6 only */
		width:			10px;
		height:			10px;
		text-indent: 	-999em;
		overflow:		hidden;
		background:		url('../images/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
	}
	a > .sf-sub-indicator {  /* give all except IE6 the correct values */
		top:			1.3em;
		background-position: 0 -100px; /* use translucent arrow for modern browsers*/
	}
	/* apply hovers to modern browsers */
	a:focus > .sf-sub-indicator,
	a:hover > .sf-sub-indicator,
	a:active > .sf-sub-indicator,
	li:hover > a > .sf-sub-indicator,
	li.sfHover > a > .sf-sub-indicator {
		background-position: -10px -100px; /* arrow hovers for modern browsers*/
	}
	 
	/* point right for anchors in subs */
	.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
	.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
	/* apply hovers to modern browsers */
	.sf-menu ul a:focus > .sf-sub-indicator,
	.sf-menu ul a:hover > .sf-sub-indicator,
	.sf-menu ul a:active > .sf-sub-indicator,
	.sf-menu ul li:hover > a > .sf-sub-indicator,
	.sf-menu ul li.sfHover > a > .sf-sub-indicator {
		background-position: -10px 0; /* arrow hovers for modern browsers*/
	}
	 
	/*** shadows for all but IE6 ***/
	.sf-shadow ul {
		padding: 0 8px 9px 0;
	}
	.sf-shadow ul.sf-shadow-off {
		
	}

@media screen and (-webkit-min-device-pixel-ratio:0)
{
	img, embed, object, video {
		max-width: 100%;
		height: auto;
		width: auto;
	}
	.sf-menu {
	  line-height:0.85;
	}
}

/* For iPads and other Tablets or Displays less then 1080px ======================== */
  @media screen and (max-width: 1080px){  
  /* Header */
  	
  	
	
}



div.sideBarInner .clearfix {margin: auto; width: 103%;}
  #full .sidebarBox { padding: 30px;}

div.csc-mailform ol li {
	display: block!important;
}










/*********** Der Ruben **********/
.clear {
	float:none;
	clear:both;
	display:block;
	margin:0px;
	padding:0px;
	height:0px;
}

#navbox { border-bottom:1px solid #000; }

header {
	margin:0 auto;
}

header h1 {
	display:block;
	width:50%;
	height:auto;
	float:left;
	padding:0;
	margin:140px 0 0 1px;
	text-transform:uppercase;
}

header #logo {
	float:none;
	display:block;
	margin:0 0 0 -52px;
	position:absolute;
	left:50%;
	top:0;
	
}

header nav {
	float:right;
}
#topnav {
	margin-top:140px;
}
#topnav a {
	color:#000;
	font-weight:400;
	text-transform:uppercase;
	padding:3px 4px;
	font-size:1em;	
}
#topnav .last a {
	padding-right:0px;
}



.once .inside,
.twothirds .inside,
.twothirds aside {
	padding-left:0;
	padding-right:0;
	padding-top:0;
}
/*
.twothirds > .inside {
	width:80%;
}
.twothirds > aside {
	width:19%;
	padding-left:1%;
}
*/


#footerbox .thirds {
	margin:0px;
	padding-top:1px;
	padding-bottom:1px;
}
#footerbox p {
	margin:0px;
	padding:0px;
	font-size:.8em;
	float:right;
}




#active-title-helper { display:none; }

.tx-yag-pi1 .album-list,
.tx-yag-pi1 .galleryDetail,
.twothirds > .inside {
	width:798px;
	float:left;
	margin:0px;
}

.tx-yag-pi1 .albumlist-gallerieslist,
.twothirds > aside {
	width:194px;
	float:right;
	margin:0px;
}

.tx-yag-pi1 .galleryDetail {
	text-align:center;
}
.tx-yag-pi1 .galleryDetail .tx-yag-thumb-outerframe {
	float:none;
	margin-bottom:10px;
}
.tx-yag-pi1 .tx-yag-albumdescription {
	width:192px;
	float:right;
	margin:0px;
}

.tx-yag-albumdescription h1,
aside h1 {
	padding:0px;
	margin:-2px 0 10px;
	font-size:1.9em;
}
.tx-yag-albumdescription .description {
	display:block;
	font-size:1.1em;
	line-height:1.5;
	letter-spacing:.06em;
	margin-bottom:40px;
}


.galleries-list ul { list-style:none; }
#content .galleries-list li {
	margin:0px;
}
#content .galleries-list a {
	font-weight:normal;
	text-decoration:none;
	font-size:.8em;
	text-transform:uppercase;
	padding:3px 0;
	display:block;
	letter-spacing:.1em;
}
#content .galleries-list .active a {
	font-weight:bold;
}




#yag-error-messagecontainer {
	padding:0px;
}
#contentbox { padding-top:10px; }



header h1,
aside h1,
.tx-yag-albumdescription h1,
.tx-yag-album-thumb-innerframe .tx-yag-album-albumcaption {
	/* font-family:"Arvo", serif; */
	text-transform:uppercase;
	font-weight:400;
	letter-spacing:1px;
}
header h1 {
	font-size:1.3em;
	letter-spacing:2px;
}
#topnav a {
	font-size:.8em;
	letter-spacing:2px;
}

.tx-yag-albumdescription h1,
aside h1,
.tx-yag-album-thumb-innerframe .tx-yag-album-albumcaption {
	font-size:1.8em;
	font-weight:600;
}
.tx-yag-album-thumb-innerframe .tx-yag-album-albumcaption {
	font-size:1.25em;
}

.tx-yag-thumb-innerframe img {
	width:198px;
}
.galleryDetail .tx-yag-thumb-innerframe img {
	width:auto;
}



.galleries-list {
	position:relative;
	top:-8px;
	left:0;
}


.tx-yag-album-thumb-innerframe .tx-yag-album-galleryname {
	letter-spacing:.1em;
}


#wrap { min-height:100%; position:relative; }





/* For Smartphones, Tablets or other Displays less then 768px ====================== */
@media screen and (max-width: 768px){
	
	header h1 { display:none; }
  	header #logo {
  		margin:0px;
  		position:relative;
  		top:-25px;
  		left:auto;
  	}
	header, #contentbox {
		width:100%;
	}
	#topnav {
		margin:0 0 -120px;
	}
	.tx-yag-thumb-innerframe img {
		width:100%;
	}
	.tx-yag-thumb-outerframe {
		width:33.3%;
	}
	.tx-yag-thumb-innerframe {
		width:98%;
		margin:1% !important;
	}
	.albumlist-gallerieslist {
		display:none;
	}
	.tx-yag-pi1 .album-list,
	.tx-yag-pi1 .galleryDetail,
	.twothirds > .inside {
		width:auto;
		float:none;
		margin:0px;
	}
	.tx-yag-pi1 .tx-yag-albumdescription {
		width:98%;
	}
	.tx-yag-albumdescription .description {
		margin-bottom:20px;
	}
	.tx-yag-pi1 .galleryDetail {
	}
	.galleries-list {
		display:none;
	}
	.galleryDetail .tx-yag-thumb-outerframe {
		width:100%;
	}
	
	#wrap > header{
		/*
	    height: 212px;
	    */
	}	
	#navbox{
		/*
	    margin-top: 13em;
	    height: 37px;
	    */
	}
	nav {
		/*
	    height: 37px;
	    */
	    width: 100%;
	    text-align: center;
	}
	.sf-menu {
	    display: inline-block;
	    float: none;
	}
	nav ul {
	    float: none;
	    position: relative;
	    top: 19px;
	    text-align: left;
	}
	nav li:hover ul {
	    top: 48px;
	    display: table;
	}
	nav li:hover #spacer {
	    top: 41px;
	}
	.menubutton{
		display: none;
	}
	#logo{
		width: 100%;
		text-align: center;
		position:static;
	}
	#logo a, #logo img {
		display:inline;
		text-align:center;
	}
	
	.tx-yag-album-albuminfo {
		display:none !important;
	}
	
	#logo img {
		/*
	    position: relative;
	    margin-top: -11em;
	    */
	    z-index: 1100;
	    /*display: block;*/
	    margin: 0 auto;
	}
  /* Content */
    #contentbox{
		width: 100%;
	}
	article header{
		line-height: 2.5em;
		margin-bottom: 2em;
	}
	.title {
	    padding: 6px 0 18px;
	}
	#content article .headline{
		display: none;
	}
	#content article .title{
		width: 100%;
		float: left;
	}
  /* Sidebar */

        
  /* Footer */
  	#footerbox{
		width: 100%;
	}
	
  /* Header */
	#navbox{
		/*
	    margin-top: 13em;
	    height: 37px;
	    */
	}
	nav { 
		text-align: center; 
		width: 100%;
	}
	nav select {
	    border: medium none;
	    color: #0D2525;
	    display: block;
	    font-size: 100%;
	    font-weight: bold;
	    margin: 0 auto;
	    min-width: 260px;
	    position: relative;
	    top: 25px;
	    width: 60%;
	    height: 25px;
	}

	.sf-menu {
		/*
	    display: none;
	    */
	}

  /* Content */
  	article header{
  		text-align: left;
  		line-height: 3em;
  	}
	.twothirds article{
		width: 100%;
	}
	#content article .headline{
		display: none;
	}
	#content article .title{
		width: 100%;
	}
    
  /* Sidebar */
	.twothirds > .inside, .twothirds aside{
		width: 96%;
	}
	
  	#full .twothirds aside {display: none;}

    /* make all pictures at least half */
    .third li{  margin: 1.25%; padding: 1.25%; width: 45%; }
	.quarter li{  margin: 1.25%; padding: 1.25%; width: 45%; }
	.fifth li{  margin: 1.25%; padding: 1.25%; width: 45%; }
	
  /* Footer */
  	footer .thirds {
	    border-bottom: 1px solid lightgray;
	    float: left;
	    height: auto;
	    line-height: 15px;
	    padding: 10px 2%;
	    text-align: center;
	    width: 96%;
	}
	
	/* CE Elemente */
	/* 3 Spalten */
	
	.ce-thirds {
		margin: 0; 
	    width: 100%;
	}
  
  
  	.form input[type=submit] {  margin-left: 0px;}
}

@media screen and (max-width: 500px){
	.tx-yag-thumb-outerframe {
		width:50%;
	}
	
	header #logo {
		top:-15px !important;
	}
	#logo img 
	{
		width:80px !important;
		margin-top:20px;
	}
	
	#navbox nav {
		display:none !important;
	}
}


#prevNextLinks {
	margin:15px 0;
}
#prevAlbum { float:left; }
#nextAlbum { float:right; }