@charset "utf-8";
/* CSS Document */

body, html {
	margin:0;
	padding:0;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:14px;
	color:#FFF;
	background-color:#51accb;
	background: url(../tl_files/img/layout/bg.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;}

h2 {
	margin:0; 
	background-color:#FFF; 
	color:#418daa;
	font-family: 'Yanone Kaffeesatz', sans-serif;
	font-weight:300;
	font-size:25px;
	padding:3px 8px 4px 8px;
	float:left;
	text-transform:lowercase;}
h1 {
	text-transform:uppercase;
	font-size:29px;
	clear:both;
	line-height:28px;
	font-weight:normal;
	margin:0;
	padding:12px;
	margin-bottom:2px;}
	
.event_flyer h1 {
	height:55px;}
	
h3 {
	margin:12px;
	font-weight:normal;
	font-size:14px;}
	
a { 
	color:#FFF;
	text-decoration:none; }

form { 
	margin:12px;
	margin-bottom:0px;
	clear:both; }

.image_container {
	margin:0;}

figcaption {
	margin:5px 0 9px 12px;
	font-weight:bold;
	font-style:italic;}

input, textarea, select { 
	margin-bottom:8px;
	display:block;
	margin-left:10px;}
	
.checkbox {
	display:inline;}

.captcha_text {
	display:inline;}
	
.programm {
	font-size:1.5em;
	margin-top:2em;
	padding:.1em 0;
}

.programm li {
	padding:.1em;
	margin:0.5em;
	padding:0.1em 0.2em;
	list-style:none;
}

.name {
	font-weight:bold;
}

.name, .date {
	padding-right:10px;
}

#ctrl_lost_password {width:30px;}

#wrapper_left {
	width:620px;
	min-height: 100%; /* Mindesthöhe für moderne Browser */
	height:auto !important; /* Important Regel für moderne Browser */
	height:100%; /* Mindesthöhe für den IE */
	overflow: hidden !important; /* FF Scroll-leiste */
	-webkit-box-shadow: 0px 0px 8px 0px #000000;
	-moz-box-shadow: 0px 0px 8px 0px #000000;
	box-shadow: 0px 0px 8px 0px #000000;
	position:fixed;
	background-color:#1d1d1d;}

#wrapper_left img {	width:100%; bottom:0px;}
	
#wrapper_right {
	padding:34px 0 0 65px;
	margin-left:620px;	
}

#header { 
	max-width:1130px;
	height:50px;
}
#slogan { 
	float:right;}
	
ul { margin:0; padding:0;}

#navigation { 
	margin:0;
	padding:0;}

#navigation_mobile {display:none;}

#navigation li {
	display:inline;
	float:left;
	font-family: 'Yanone Kaffeesatz', sans-serif;
	font-weight:300;
	font-size:32px;}
	
#navigation li a {
	padding:6px 14px 12px 14px;
	background-color:#84c5dc;
}
	
#navigation li a:hover {
	background-color:#FFF;
	color:#418daa;
}

#content { 
	max-width:1250px;
}

.event {
	margin-top:55px;
	float:left;
	margin-right:29px;
	min-height:525px}

.event:hover {cursor: pointer;}

.event_flyer {
	width:260px;
	min-height:380px;
	background-color:#84c5dc;
	float:left;
	background:url(http://sturm-drang-club.de/tl_files/img/layout/more_button.jpg) no-repeat right bottom #84c5dc;}

.event_info {
	width:260px;
	min-height:100px;
	background-color:#84c5dc; 
	padding-bottom:15px;
	position:absolute;
	display:none;
	height: 472px;
	background:url(http://sturm-drang-club.de/tl_files/img/layout/close_button.png) no-repeat right top #84c5dc;
}

.long {
	overflow-y:scroll;
	background:url(http://sturm-drang-club.de/tl_files/img/layout/close_button.png) no-repeat right top #84c5dc;
	background-position:208px 0px;}


.event_info:hover { cursor:pointer;}

.info_long {
    position: relative;
    overflow: hidden;
    padding-bottom:38px;
    height: 300px;
    width: 260px;
	margin-left:15px;
}

.read_more {
    height: 100px;
    width: 260px;
    cursor: pointer;
    background: url('http://sturm-drang-club.de/tl_files/img/layout/read_more_bg.png');
    background-size: 260px 100px;
    position: absolute;
    left:0px;
    bottom:0px;    
}
.read_less {
    height: 40px;
    width: 260px;
    cursor: pointer;
    background: url('http://sturm-drang-club.de/tl_files/img/layout/read_less_bg.png');
    left:0px;
    position: absolute;
    background-size: 260px 40px;
    bottom: 0px;  
}
.event_info p { line-height:17px; margin-bottom:0px;}

.event_media {
	margin-top:15px;
	width:260px;
	min-height:80px;
	float:right;}
	
.event_media p { margin:0; padding:0;} 
	
.content_box_wrap {
	width:535px;
	margin-top:60px;
	float:left;
	margin-right:60px;}

.content_box {
	width:535px;
	min-height:90px;
	background-color:#84c5dc;
	padding-bottom:8px;}

.content_box p {
	float:none;
	clear:both;}
	
.content_box h2 {
	margin-bottom:12px;}

.content_box p {
	margin-left:20px;
	max-width:480px;}

.content_box a {
	font-weight:bold;}

.content_box a:hover {
	text-decoration:underline;}

.news_box {
	width:535px;
	min-height:90px;
	background-color:#84c5dc;
	padding-bottom:8px;}
	
.news_box p {	
	margin:12px 20px 10px;
	float:none; }

#logo {
	margin:90px 0 0 34px;
	z-index:999;
	position:fixed;}

#header_mobile { 
	display:none;}

.line {
	width:100%;
	height:1px;
	float:left; }
	
p { 
	margin:12px;
	float:left;
	padding:0 2px 0 0;
	clear:both;}
		
#footer_nav  {
	font-size:16px;}

#footer_nav li {
	display:inline;
	float:left;
	font-weight:bold;
	margin:50px 0;
	background-color:#84c5dc;
	padding:5px 0;}

#footer_nav li a {
	padding:0 10px;}

#footer_nav li a:hover {
	text-decoration:underline;}

.fb_like {
	z-index:999;
	position:fixed;
	bottom: 25px;
	margin-left:45px;}

.caption { width:500px !important;}

small a {color:#FFF !important;}

#mb_popup {display:none;}

.lightbox {     background-color: #FFFFFF;
    color: #418DAA;
    font-size: 16px;
    font-weight: 300;
    padding: 5px 12px 7px;
	line-height: 40px;}
	
@media only screen and (max-width: 1640px) {

	#slogan { float:right; margin-top:-100px;}
	#header { max-width:535px;
	height:50px;}
	#navigation {margin-top:50px;}
	#wrapper_left { width:43%;}
	#wrapper_right {   margin-left:44%;}
	#logo {margin:70px 0 0 3%; width:37%; height:auto;}
	#navigation { width:537px;}
	.fb_like {	margin-left:3%;}
	#samstag_09 {margin-top:60px;}
	.event {
    margin-right: 13px;}
    
	 
}

@media only screen and (max-width: 1100px) {
	body { background-color:#1d1d1d; font-size:25px; color:#FFF; background-image:none;}
	#wrapper_left { display:none}
	#wrapper_right {  width:95%; margin:auto; padding:0px; background-color:#1d1d1d;}

	#slogan { display:none;}
	
	#navigation { display:none;}
	#navigation_mobile {
		display:block; 
		margin:28% 0 0;}
	#navigation_mobile select {
	font-family: trebuchet ms;
    font-size: 70px;
    margin: 0;
    padding: 16px;
    width: 100%;
		}
	
	#navigation li a {
		padding:16px 24px 22px 24px;
		background-color:#000;
	}
	
	#navigation li a:hover {
		background-color:#1da4d9;
		color:#fff;
	}
	
	.event_flyer {
		background-color:#000;
		background-image:none;}
	
	.event_info {
		background-color:#000;
		height:auto;		}
	
	.event_media {
		background-color:#000;}
		
	#logo { display:none;}
		.event {min-height:0px;}
	

h2 {
	margin:0; 
	background-color:#d3d0c2;
	color:#1d1d1d;
	font-family: 'Yanone Kaffeesatz', sans-serif;
	font-weight:300;
	font-size:53px;
	padding:13px 18px 14px 18px;
	float:left;	}
h1 {
	text-transform:uppercase;
	font-size:53px;
	clear:both;
	line-height:28px;
	font-weight:normal;
	margin:0;
	padding:30px;
	margin-bottom:2px;
	line-height:102%}
	
a { 
	color:#FFF;
	text-decoration:none; }

form { 
	margin:12px;
	margin-bottom:0px;
	clear:both; }

.image_container {
	margin:0;}

figcaption {
	margin:5px 0 9px 12px;
	font-weight:bold;
	font-style:italic;}

input, textarea { 
	margin-bottom:8px;
	display:block;
	margin-left:10px;}
	
.checkbox {
	display:inline;}

.captcha_text {
	display:inline;}

#ctrl_lost_password {width:30px;}


#header {
	width:100%;
	height:50px;
	max-width:none;
}

#header_mobile { display:block;
width:97%; height:auto;}

ul { margin:0; padding:0;}

#navigation { 
	margin:0;
	padding:0;
		background-color:#84c5dc;}

#navigation li {
	display:inline;
	float:left;
	font-family: 'Yanone Kaffeesatz', sans-serif;
	font-weight:300;
	font-size:54px;}
	
#navigation li a {
	padding:16px 24px 22px 24px;
	background-color:#d3d0c2;
	color:#1d1d1d;
	display:block;
	margin-right:4px;
}
	
#navigation li a:hover {
	background-color:#1da4d9;
	color:#fff;
}

#content { 
}

.event {
	width:100%;
	margin-top:60px;
	float:left;
	margin-right:60px;}

.event_flyer {
	width:100%;
	min-height:380px;
	background-color:#000;
	float:left;}

.event_flyer img { width:100%; height:auto;}

.event_info { width:95%;}

.event_info p {
    line-height: 32px;
}

.event_media { display:none;}

	
.content_box_wrap {
	width:100%;
	margin-top:90px;
	float:left;
	margin-right:60px;}

.content_box {
	width:100%;
	min-height:90px;
	background-color:#000;
	padding-bottom:28px;}
	
.content_box img { width:280px; height:auto;}

.content_box p {
	float:none;
	clear:both;}
	
.content_box h2 {
	margin-bottom:22px;
	font-size:53px;}

.content_box p {
	margin-left:30px;
	max-width:93%;}

.news_box {
	width:100%;
	min-height:90px;
	background-color:#000;
	padding-bottom:28px;}
	
.news_box img { width:100%; height:auto; }
.news_box p {	margin:25px 12px 8px 30px; }

.line {
	width:100%;
	height:1px;
	float:left; }
	
p { 
	margin:12px;
	float:left;
	padding:0;}
		
#footer_nav  {
	font-size:36px;}

#footer_nav li {
	display:inline;
	float:left;
	font-weight:bold;
	margin:50px 0;
	background-color:#d3d0c2;
	color:#1d1d1d;
	padding:10px 0;}

#footer_nav li a {
	padding:0 15px;
	color:#1d1d1d;}
	
.fb_like { display:none;}
.read_more {display:none;}

.lightbox {
    background-color: #D3D0C2;
    color: #1D1D1D;
    font-size: 36px;
    font-weight: 300;
    line-height: 72px;
    padding: 5px 12px 7px;
}

#mbCenter { height:3400px !important;}

}