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

html, body {width:100%; height:100%; margin:0; padding:0; font:12px Arial, Lucida Sans Unicode, Lucida Grande, sans-serif; color:#000000;}
a, a:hover, a:visited{color:#000000; text-decoration:none; font-weight:bold;}
a:hover{text-decoration:none;}

/* HIDING FOCUSRING */
a:active, a {outline: none;}
:focus { -moz-outline-style: none;}
:-moz-any-link:focus {outline: none;}

/* Global */
h1{ font-family: Arial, Lucida Sans Unicode, Lucida Grande, sans-serif; font-weight:bold; padding:0 0 0 0; margin:0px; font-size: 14px;}
h2{ font-family: Arial, Lucida Sans Unicode, Lucida Grande, sans-serif; font-size: 14px; padding:0 0 10px 0; margin:0px;}
h3{ font-family: Arial, Lucida Sans Unicode, Lucida Grande, sans-serif; color:#fff; background-color:#000; padding: 2px 10px 2px 10px; margin:0 0 8px 0; font-size:15px; font-weight:bold; }
hr {border: 0; color: #B3B3B3; background-color: #B3B3B3; height: 2px;}
a img { border:0;}

.mobile {
	display:none;
}

.hidden {
	display:none;
}

div#guiHeaderMainmenuMobile {
	display:none;
}

#gui{width:965px; margin:0 auto; position: relative; z-index:10;}
#guiBody {float:left; width:220px; height:331px; background:url(images/bg_body2017.png) no-repeat; position:fixed; bottom:0px; z-index:0;}
#guiContentContainer {width:965px;}
#guiLeft {float:left; width:146px;}
#guiMiddle {float:left; width:540px; margin:0 10px;}
#guiRight {float:left; width:256px;}
.guiTitle {/*border-top:12px #0100fe solid;*/ font:Lucida Sans Unicode, Lucida Grande, Arial, sans-serif 22px; font-weight:bold; color:#2b3968;  line-height:25px; /*background-color:#FFFFFF;*/ position: relative; z-index:99;}
.guiTitleRight {/*border-top:12px #DA581C solid;*/ font:Lucida Sans Unicode, Lucida Grande, Arial, sans-serif 22px; font-weight:bold; color:#2b3968;  line-height:25px; /*background-color:#FFFFFF;*/ position: relative; z-index:99; }
.guiTitleRightSep {background-image: linear-gradient(to right, #00a3e4 0%, #009881 70%); width:100%; height:12px;}
.rulerDotted {width:auto; height:11px; background:url(images/rulerDotted.jpg) top left repeat-x;}

/* Accordion */
.accordion {width: 100%;}
.accordion h3 {font:11px; cursor: pointer;}
.accordion h3:hover {}
.accordion h3.active { background:url(images/close_neu.png) right no-repeat #000; }
.accordion div {display: none; padding: 0 15px 5px 15px;}

/* Facebook */

#likebox-frame{border:2px solid #ffffff; width:240px; height:245px; margin-left:10px; z-index:10; overflow: hidden; position:relative; /*top:-10px;*/ left:-2px;}
#likebox-frame iframe{  left:-5px; overflow:hidden; position:relative; top:-1px;}

/* Newsletter */

.contactform input {border: 1px solid #D4D4D4; margin-bottom:7px;}
.submit {text-align:right; margin-right:10px;}
.cms_submit {text-align:right; border: 1px solid #E6E6E6; background: #E6E6E6; color:#000000; font-size:10px; font-weight:bold; cursor:pointer;}
.cms_submit:hover {text-align:right; border: 1px solid #4D4D4D; background: #4D4D4D; color:#ffffff;	font-size:10px;	font-weight:bold; cursor:pointer;}

/* Suche */

div#guiSearch input.search-input {
/* specific size for image, your image may need these adjusted */
	width: 124px; height: 17px;
/* removes default borders, allows use of image */
	border-style: none;
/* text color */
	color: #000;
/* padding of text */
	padding:0px 0 0 3px; 	float: left;
/* set all font properties at once, weight, size, family */
	font-family: Arial, Helvetica, sans-serif; font-size:10px;
/* left input image, set your own here */
	background: url(images/search_field.jpg) no-repeat left top;
}
div#guiSearch input.search-button {
/* specific size for image, your image may need these adjusted */
	width: 17px; height: 19px;
/* removes default borders, allows use of image */
	border-style: none;
/* hides text, image has text */
	text-indent: -9999em; float: left; 	margin: 0;
/* provides positive hover effect */
	cursor: pointer;
/* removes default size/height */
	font-size: 0px; line-height: 0px;
/* submit button image, set your own here */
	background: transparent url(images/search_button.png) no-repeat right top;
}


/* Header */
#guiHeader {
	width:965px; 
	height:150px;
	position:relative;
}

#guiHeaderLang {
	position:absolute;
	top:0;
	left:0;
	z-index:99; 
	width:200px; 
	height:20px; 
	padding:10px; 
	color:#fff; 
	font-weight:bold;
}

#guiHeaderLang a{
	color:#fff;
}

/* Left */
#guiSearch {float:left; width:146px; height:30px;}
#guiSocial {float:left; width:146px; height:40px;}

/* Middle */

#googleMaps {
	border:none;
}

#guiMiddle img {
	max-width:100%!important;
	height:auto!important;
}

.guiArtistItem {
	width:100%;
	float:none;
	clear:both;
	padding-bottom:30px;
	display:inline-block;
}

.item-image {
	float:left;
	width:200px;
	border:4px solid #000;
	margin-right:10px;
}

.item-image img {
	width:200px!important;
	height:auto!important;
}

h2.item-title {
	font-size:1em;
	margin:0;
	padding:0 0 7px 0;
}

.item-text {
	float:left;
	width:322px;
}

.eventItem {
	padding-bottom:30px;
}

/* Right */
#guiPosts {width:246px; padding-left:10px; padding-bottom:10px; font-size:11px;}

/************************************************************
*********************** LAYOUT MOBILE ***********************
*************************************************************/

@media only screen 
and (max-width : 767px) {
	
	body {
		font-size:13px;
	}
	
	h1 {
		font-size:1.3em;
		-webkit-hyphens:none;
		-moz-hyphens: none;
		-ms-hyphens: none;
		hyphens: none;
	}
	
	h2 {
		font-size:1.5em;
		-webkit-hyphens:none;
		-moz-hyphens: none;
		-ms-hyphens: none;
		hyphens: none;
	}
	
	h3 {
		font-size:1.3em;
		-webkit-hyphens:none;
		-moz-hyphens: none;
		-ms-hyphens: none;
		hyphens: none;
		line-height:1.5em;
	}
	
	.mobile {
		display:block;
	}
	
	#guiBody {
		display:none;
	}
	
	div#gui {
		height: auto !important;
		margin: 0 auto;
		min-height: 100%;
		position: relative;
		width: 100%;
		z-index: 3;
	}
	
	#guiHeader {
		width:100%;
		height: auto;
	}
	
	#guiHeader img {
		width:100%!important;
		height:auto!important;
	}
	
	#guiContentContainer {
		width:100%;
	}
	
	#guiLeft {
		display:none;
	}
	
	#guiMiddle {
		float:none;
		clear:both;
		width:96%;
		margin: 0 2%;
	}
	
	#guiMiddle img {
		width:100%!important;
		height:auto!important;
		margin: 0!important;
		padding:5px 0;
	}
	
	.item-image {
		margin:5px 0;
	}
	
	.item-image img {
		margin: 0px!important;
		padding: 0px!important;
	}
	
	.item-text {
		width:100%;
	}
	
	.issuuembed {
		width:100%!important;
	}
	
	.guiTitle {
		line-height:60px;
	}
	
	#guiRight {
		float:none;
		clear:both;
		width:96%;
		margin: 0 2%;
	}
}