/*************************************
* 			FIXES / HACKS	 		 *
*************************************/

@import url('normalize.css');
@import url('fontello.css');
.clearfix:after { visibility: hidden; display: block; content: ""; clear: both; height: 0;}
* html .clearfix { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

@font-face {
    font-family: Roboto;
}

@font-face {
	font-family: 'Source Sans Pro';
	font-style: normal;
	font-weight: 300;
	src: url('../font/SourceSansPro-Regular.ttf') format('truetype');
}
/*************************************
* 		SEMANTIC SELECTORS			 *
*************************************/

/*
[href^="mailto"]:before {
	content: "\E004";
}
[target="_blank"]:after {
	content: "\E004";
}
[href$=".jpg"]:before, [href$=".jpeg"]:before, [href$=".png"]:before{
	content: "\E004";
}
[href$=".pdf"]:before{
	font-family: "fontello";
	content: "\e805";
}

/*************************************
* 			BASIC HTML				 *
*************************************/

menu{}
section{ 
	margin-bottom: 30px;
}
article{}
footer{}
a, img{
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	transition: all 0.2s ease;
}
a, a:link, a:visited, a:focus{}
a:hover, a:active{}
h1, .huge {
    font-size: 1.8em;
	font-weight: 700;
    line-height: 1.2em;
    margin: 0.6em 0 0.3em 0;
}
h2, .large{
    font-size: 1.6em;
	font-weight: 400;
    line-height: 1.2em;
    margin: 0.5em 0 0.2em 0;
}
h3, .bigger{
    font-size: 1.4em;
    font-weight: 700;
    line-height: 1.4em;
    margin: 1em 0 0.5em;
}
h4, .big{
	font-size: 1em;
	font-weight: 400;
	line-height: 1.2em;
	margin: 1.5em 0 0.5em;
	text-transform: uppercase;
}
p{
	line-height: 1.4em;
	margin: 0.5em auto;
}

/*************************************
* 			HTML, BODY, WRAPPER		 *
*************************************/

body{
	font-family: Source Sans Pro;
	font-size: 16px;
}

.wrapper {
    margin: 0 auto;
    max-width: 1024px;
    padding: 0 20px;
}

/*************************************
* 			HEADER AND NAVIGATION 	 *
*************************************/

header{
	padding: 10px 0;
	width: 100%;
	display: inline-block;
}

.logo{
	float: left;
}
.logo a, .logo a:link, .logo a:visited, .logo a:focus{
	font-size: 3em;
	line-height: 1em;
	text-transform: uppercase;
	text-decoration: none;
	color: #000;
}
.logo a:hover, .logo a:active{}       
.logo p{
	margin: 0;
	padding: 0;
}
.copyright{
	font-style: italic; 
}
nav {
	margin: 30px 0 20px 0;
	float: right;
	text-align: right;
	font-size: 1.2em;
}
nav ul {
	margin:0; 
	padding:0;
	float:left;
}
nav li { 
	list-style:none;
	display: inline;
	margin:0;
	padding:0;
}
nav li a, nav li a:link, nav li a:visited, nav li a:focus {
	font-weight: 400;
	padding: 5px 10px;
	margin: 0;
	border: none;
	text-decoration: none;
	border-radius: 2px;
}

/*************************************
* 				STAGE 				 *
*************************************/

.stage{
	max-height: 350px;
	overflow: hidden;
	width: 100%;
	position: relative;
}

.stage img {
	float: left;
}

.stage-box{
	position:absolute;
	right: 0;
	top: 0;
	margin: 50px 70px;
	padding: 20px;
	width: 250px;
}

.calltoaction, a.arrow{
	width: 100%;
	text-align: middle;
	display: inline-block;
	position: absolute;
	bottom: 0;
	left: 0;
	margin-bottom: -30px;
	height: 30px;
	font-weight: 700;
	text-align: center;
	padding: 10px 0 0;
}

a.arrow{
	margin-bottom: 5px;
	text-align: right;
	left: -20px;
	font-size: 1.5em;
}

.arrow:hover{
	left: 0;
}


/*************************************
* 				CONTENT				 *
*************************************/

.content{
	float: left; 
	width: 60%;
	border-top: 1px solid #D7D7CA;
}

a.headline, a.headline:link, a.headline:visited, a.headline:focus{ 
	text-decoration: none;
}
a.headline:hover, a.headline:active{
	text-decoration: underline;
}

.table_row{
	display: inline-block;
	width: 100%;
	margin: 5px 0;
}
.table_left{
	display: inline-block;
	float: left;
	width: 15%;
	margin-right: 5%;
	min-width: 100px;
}
.table_right{
	display: inline-block;
	float: left;
	width: 60%;
	margin-right: 5%;
	min-width: 200px;
}
.table_link{
	display: inline-block;
	float: right;
	width: 10%;
}

form{
	margin: 10px 0;
}
label{
	width: 20%;
	display: inline-block;
	float: left;
	margin-right: 10%;
	margin-top: 5px;
	padding: 2px;
}
input, textarea{
	width: 65%;
	display: inline-block;
	float: left;
	margin-top: 5px;
	padding: 2px;
	border: 1px solid #050505;
}
input[type="submit"]{
	width: 66%;
	display: inline-block;
	float: left;
	margin-top: 5px;
	padding: 5px;
	border: 0px;
}
caption, .gallery_alt{
	font-style: italic;
}
.map{
	height: 300px; 
	width: 100%;
	max-width: 500px;
}

.event-date {
	float:left; 
	background:#404040; 
	color: #F6F8EE; 
	padding:5px; 
	text-align:center; 
	margin: 0 10px 10px 0;
	width: 60px;
}

.event-date .month { 
	display:block; 
	text-transform: uppercase; 
}
.event-date .day {
	font-size:2em; 
	font-weight: 700;
	display: block;
	line-height: 1em;
}
.event-date .year {
}

.pagination{
	display: inline-block;
	margin-top: 30px;
	width: 100%;
}

.posthead{
	border-bottom: 1px solid #D7D7CA;
	padding-bottom: 10px;
}

/*************************************
* 			SWIPE SLIDESHOW			 *
*************************************/

.swipe {
  overflow: hidden;
  visibility: hidden;
  position: relative;
  padding: 10px 0;
//  display: inline-block;
}
.swipe-wrap {
  overflow: hidden;
  position: relative;
}
.swipe-wrap > div {
  float:left;
  width:100%;
  position: relative;
}
.swipe-pagination > button{
	position: absolute;
	top: 40%;
	text-align:center;
	border: 0px solid yellow;
	background-color: #FFF;
	color: #000;
	font-size: 1.5em;
	font-weight: 700;
	opacity:0.3;
	filter:alpha(opacity=30); /* For IE8 and earlier */
	width: 40px;
	height: 40px;
	border-radius: 20px;
}
.swipe-pagination > button:hover{
	opacity:0.4;
	filter:alpha(opacity=40); /* For IE8 and earlier */
}
.swipe-pagination > button.swipe-prev{
	left: 5px;
}
.swipe-pagination > button.swipe-next{
	right: 5px;
}
/*************************************
* 				SIDEBAR				 *
*************************************/

.sidebar{
	float: right; 
	width: 30%;
	border-top: 1px solid #D7D7CA;
}

.taxonomy a, .taxonomy a:link, .taxonomy a:visited, .taxonomy a:focus{ 
	display: inline-block;
	padding: 2px 4px;
	margin: 2px 0;
	text-decoration: none;
	border-radius: 2px;
}

.buch{
	display: inline-block;
	width: 100px;
	margin-right: 20px;
}
.buch img{
	overflow: hidden;
}
/*************************************
* 				FOOTER				 *
*************************************/
footer{
	display: inline-block; 
	width: 100%;
	margin-top: 30px;
}

footer p{
	float:left;
	margin: 10px;
}
/*************************************
* 				COLORS	 			 *
*************************************/
/* 
helles braungrau Hintergrund: #F7F6F2 besser F6F8EE
black: 333333
black bob: 010300
helldunkel black: 404040
grau schrift: 808080 // SMALL
grau schrift dunkel: 404040 // GRUNDSCHRIFT
saphir-metal (blue) links: 314C53
*/


body{ background-color: #F6F8EE; color: #404040; }
small{ color: #808080; }
a, a:link, a:visited, a:focus{ color: #808080; text-decoration: underline; }
a:hover, a:active{}
input[type="submit"], .taxonomy a, .taxonomy a:link, .taxonomy a:visited, .taxonomy a:focus{ color: #F6F8EE; background-color: #404040; }
input[type="submit"]:hover, .taxonomy a:hover, .taxonomy a:active{  background-color:#808080; }
a.headline, a.headline:link, a.headline:visited, a.headline:focus{ color: #404040; }
nav li a, nav li a:link, nav li a:visited, nav li a:focus { color: #404040; }
nav li a.current, .nav li a:hover, nav li a:active { color:#F6F8EE; background-color: #404040; }
.logo a, .logo a:link, .logo a:visited, .logo a:focus{ color: #404040; }
.stage-box{ background-color: #FFF; }
.calltoaction{ background-color: #404040; color: #F6F8EE; }
h4, .copyright{ color: #808080; }
footer{ color: #808080; background-color:#404040; }
/*************************************
* 		HELPERS & Objects	 		 *
*************************************/

.transparent{
	opacity:0.3;
	filter:alpha(opacity=30); /* For IE8 and earlier */
}

.transition{
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

.right{
	float:right;
}

.border{
	border-top: 1px solid #D7D7CA
}
.icon-facebook, .icon-rss{
    color: #FFFFFF;
	font-size: 1.3em;
    padding: 0.2em;
	display: inline-block;
	margin-top: 20px;
}

.icon-facebook{
    background-color: #404040;
}
.icon-facebook:hover{
	background-color: #29447E;
}

.icon-rss{
    background-color: #404040;
}
.icon-rss:hover{
    background-color: #D15000;
}

/*************************************
*	MEDIA QUERIES / RESPONSIVE		 *
*************************************/
@media only screen and (max-width: 500px) {	
	nav ul {
		font-size: 0.8em;
	}
	.stage, .copyright{
		display: none;
	}
	.huge{
		font-size: 1.4em;
	}
	.calltoaction{
		
	}
	nav li {
		display: block;
		margin: 5px 0;
		width: 100%;
	}
	nav li a, nav li a:link, nav li a:visited, nav li a:focus {
		width: 100%;
		display: block;
	}
	footer p{
		float: none;
	}
	footer p[class="right"]{
		float: none;
	}
	label{
		display: block;
		margin-top: 5px;
	}
	input, textarea{
		width: 100%;
	}
	.table_left{
		float:none;
		display: block;
		width: 100%;
		text-align: center;
		background-color: #404040; 
		color: #F6F8EE; 
	}
	.table_right{
		width: 100%;
	}
}

@media only screen and (max-width: 620px) {
	/* tablets goes here */
	.content{
		width: 100%;
	}
	.stage-box{
		margin: 0;
		padding: 10px;
		right: auto;
		bottom: auto;
		top: auto;
		left: auto;
		width: 100%;
		position: static;
	}
	.calltoaction{
		position: static;
		margin-left: -10px;
	}
	.sidebar{
		margin-top: 20px;
		width: 100%;
	}
	nav li a, nav li a:link, nav li a:visited, nav li a:focus {
		padding: 2px 4px;
		color:#F6F8EE; 
		background-color: #404040;
	}
}

@media only screen and (max-width: 800px) {
	/* tablets goes here */
	nav{
		width: 100%;
		margin: 20px 0 10px;
	}
	nav ul {
		float: none;
		text-align: center;
	}
	nav li a, nav li a:link, nav li a:visited, nav li a:focus {
		padding: 2px 4px;
		color:#F6F8EE; 
		background-color: #404040;
	}
}