/* ################################################################################# */ 
/* Responsive  Mobile Devices*/ 
/* ################################################################################# */ 

/* allgemeine styles  ############################################ */
#submenu li a.navopen{
	background: url(../Images/subnav_unten_rot.gif) no-repeat;
	background-position:10px 5px;
	background-color:#ffffff;
	-moz-box-shadow:  	3px -3px 3px  #666;
  	-webkit-box-shadow: 3px -3px 3px  #666;
  	box-shadow:         3px -3px 3px  #666;
	border-left: 1px solid #dcdcdc;
	border-right: 1px solid #dcdcdc;
}

/*close Button */

li.close{
	margin-top:5px;
	padding-top:5px;
	 border-top: 1px solid #dcdcdc;
	width:100% !important;
	clear:both;
	display:none;
}

li.close div{
	padding:6px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	color:#ffffff;
	background-color:#7F9EC4;
	display:block;
	width:100px;
	cursor:pointer;
	background-image: url(../Images/schliessen.png);
	background-repeat: no-repeat;
	background-position:10px 6px;
	padding-left:40px;
}
li.close div:hover{
	padding:6px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	color:#ffffff;
	background-color:#98141F;
	display:block;
	width:100px;
	cursor:pointer;
	background-image: url(../Images/schliessen_weiss.png);
	background-repeat: no-repeat;
	background-position:10px 6px;
	padding-left:40px;
}


/* SMARTPHONES / Pads - allgemein  ############################################ */
@media only screen and (max-device-width: 1024px) {
	
	.sidebar .search{
 		border-top:1px solid #7B98C2;
		padding-top:10px;
	}
}
/* SMARTPHONES - PORTRAIT & LANDSCAPE  ############################################ */
@media only screen and (max-device-width: 480px), only screen and (max-width: 480px) {
	
	.container	{ width: 95%; } /* edit how you see fit */
	
	.col{ margin: 0; width: 100%; }
	
	.span_1, .span_2, .span_3,
	.span_4, .span_5, .span_6,
	.span_7, .span_8, .span_9,
	.span_10, .span_11, .span_12{ width: 100%; }
	
	

ul.multicolumnContainer li{
 width: 100% !important;
 margin-right:0 !important;
}

	
	
	#menu div.nav ul.sub {
		width: 94% !important;
		padding:3%;
		left:0 !important;
		z-index:0 !important;
	}
	
	#menu div ul li.last{
	display:block;
}
#menu div ul {
	padding:3%;
}	
	
	.subnav  .search{
		padding-top:10px;
		
	}
	
.sidebar  .content .images img,
.images.left,
.images.right{
	height:auto !important;
	width:100px !important;
}

ul.multicolumnContainer {
margin-top: -20px !important;
}

ul.multicolumnContainer li.column {
    width: 100% !important;
}

ul.multicolumnContainer div.csc-header-n1 h3 {
	min-height: 20px;
}
ul.multicolumnLayout2 li.columnLast {
	margin-left: 0% !important;
}
/**Pagebrowser**/
.tx-smpagebrowser-pi1 #currentsitename {
    border-bottom: 1px dotted #164E93;
    font-size: 0.9em;
    font-style: italic;
    margin-bottom: 2em;
    text-align: right;
	width: 100%;
	margin-left: 0%;
}
.icons .icon, .hints .hint img{
		width:55% !important;
		height:auto !important;
}
.icon_text, .hints .hint_text {
    width: 80%;
}


}

/* SMARTPHONES - LANDSCAPE  ############################################ */
@media only screen and (min-width: 321px) {
	
	.container	{ width: 95%; } 
	
}

/* SMARTPHONES - PORTRAIT  ############################################ */
@media only screen and (max-width: 320px) {
	
	.container	{ width: 95%; }

	ul.sub li.left,
	ul.sub li.right  {
		width:100% !important;
		clear:both;
	}
	.sidebar .csc-textpic-imagewrap {
    		width: 100% !important;
	}
	ul.multicolumnContainer li .columnItems .columnItem {
		border-bottom: 1px dotted #164e93;
		padding-bottom: 40px !important;
	}
}


/* Max-Width 720px ############################################ */
@media only screen and (max-width: 720px) {
}

/* Max-Width 768px ############################################ */
@media only screen and (max-width: 768px) {
body{
	padding-top:10px;
}
.logos{
	width:100%;
	height:40px;
	overflow:hidden;
}
#logo, #logo2{
	height:auto;
	margin:0px;
}
#logo{
	width:50%;
}
#logo a{
	display: inline;
	margin-top: 0px;
}
#logo2{
	width:40%;
}


#logo img,
#logo2 img{ 
	width:auto;
	height:35px;
}

#page{ padding-right:35px;}
#header{
	margin-left:0px;
	margin-right:0px;
}
#menu, #submenu{
	-moz-hyphens: auto;
   	-o-hyphens: auto;
   	-webkit-hyphens: auto;
   	-ms-hyphens: auto;
   	-hyphens: auto; 
}

/* Nav Top  #####################################*/ 
#menu {
	position:relative;
	z-index:99978;
	width:100%;	
	
}
#menu div {
	text-align:center;
}

#menu div#links,
#menu div#mitte,
#menu div#rechts{
	background:none;
	height:auto;
	width:32% !important;
	background:#144D92;
	padding:2%;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	margin-left:0px;
}
#menu div#links h3,
#menu div#mitte h3,
#menu div#rechts h3,
#menu div#links p,
#menu div#mitte p,
#menu div#rechts p{
	font-size:90%;
}
#menu div#links,
#menu div#mitte{
	margin-right:2%;
}
#menu div#links.current,
#menu div#links:hover,
#menu div#mitte.current,
#menu div#mitte:hover,
#menu div#rechts.current,
#menu div#rechts:hover {
	background:none;
	background:#9D1523;
	height:auto;
}


#menu div#links a,
#menu div#mitte a,
#menu div#rechts a{
	padding:0px;
	height:60px;
	width:auto;
}


#menu div ul {
	width: 66%;
	top: 100px;
}

#menu div#links ul{
left:0%;
}

#menu div#mitte ul{
left:15%;
}

#menu div#rechts ul{
left:27.5%;
}

#menu  ul  li a{
	height:auto;	
	width:auto;
}

#menu div ul li.last{
	width:96%;
	clear:both;
}

ul#submenu{
	width:100%;
	min-height:43px !important;
	margin-left:10px;
}
#submenu li {
    float: none;
    width: 94.5%;
}
#submenu li ul.sub,
#submenu li.submenu_02 ul.sub{
  width:100% !important;
}
#submenu li ul.sub li.left{
	width: 100% !important;
}
#submenu li ul.sub li.left a {
	width: 93% !important;
	margin-right: 0;
}



.sidebar::before{content:"Suche"; color:#000000; font-weight:bold; display:block; border-top:1px solid #cccccc; padding-top:5px;}

#sidebar .search,
.subnav  .search{
	margin-bottom:10px;
	width:94%;
	padding-bottom:10px;
	border-bottom: 1px solid #164e93 !important;
}



/*  margin unten erweitern */
.mainContent,
.sidebar,
.teaser{
 	margin-bottom:20px;
}

.mainContent,
.sidebar{ 
	width: 100% !important;
	/*width: 98% !important;
	padding-left:1% !important;
	padding-right:1% !important;*/
	clear:both !important;
}

.sidebar  .content .images{
	float:left !important;
	margin-right:10px;
	width:33%;
}

/*  ###################################
slider rechts 
##################################### */
.right_menu{
	display:none !important;
}

.right_menu .slide-out-div{
	position:static !important;
	height:auto !important;
	right:auto !important;
	border:none !important;
	border-top:1px solid #cccccc  !important;
	width:98%  !important;
	padding-left:1%;
	padding-right:1%;
	padding: 20px;
background: #ffffff;

-moz-box-shadow: 0px 0px 0px #fff;
-webkit-box-shadow: 0px 0px 0px #fff;
box-shadow: 0px 0px 0px #fff;
}

.right_menu .slide-out-div .handle{
display:none !important;
}


/*  ###################################
content spalten wieder breiter anlegen
##################################### */
/* .liste{width: 94%;}
h1[tag=news],
.container.contentseite  .mainContent .news.top,
.container.contentseite .mainContent .news-single-item, 
.container.contentseite .tx-nsexpertenfeedbackcatlist-pi2*/
.contentseite  .mainContent {
	width: 98%;
	padding-left:1%;
	padding-right:1%;
}



/*  ###################################
powermail
##################################### */
img.powermail_captchaimage {
    width: 55%;
}


}

@media 
only screen and (min-device-width: 769px) and (max-device-width: 960px),
only screen and (min-width: 769px) and (max-width: 960px) {

.search input {
margin-bottom:0px !important;
}
.search ul li{
		float:none;
		font-size:65%;
	margin-right:5px;
	padding:0;
}
.search ul li a{
	padding-left:10px;
	background-position:0px 3px;
}
}
/* margin-top for front page main content when width > 760px  
@media 
only screen and (min-device-width: 769px) {
    #maincontent {
        margin-top:1em;
    }
}
*/

/* IPADS - PORTRAIT & LANDSCAPE ############################################ */
@media only screen and (min-device-width: 769px) and (max-device-width: 1024px),only screen and (min-width: 769px) and (max-width: 1024px) {
	.search span{ display:none; }
	#page{ padding-right:0px;}
	.container{ 
		width: auto !important; 
		padding-right:45px;
		padding-left:20px;
	}
	#slider{
		padding-right:45px;
		padding-left:20px;
	}
}

/* Max-Width 640px ############################################ */
@media only screen and (max-width: 640px) {
#page {padding-right:0px !important;}

#menu div.nav ul.sub {
width: 94% !important;
padding: 3%;
left: 0 !important;
z-index: 0 !important;
}



.subnav {
	border-bottom: none;
	/*height:auto;
	border-top: 1px solid #164e93;
	width:95% !important;
	margin-left:2%;
	*/
}

#submenu {
	width:100% !important;
	height: auto !important;
}
#submenu li {
    float: none;
    width: 100%;
}
#submenu li ul.sub li.left a {
width: 93% !important;
margin-right: 0;
}

#submenu li a {
	height:47px;
}

#submenu li.submenu_02 ul.sub, #submenu li ul.sub {
width: 100% !important;
padding: 3%;
left: 0px !important;
margin-top: -7px !important;
border-bottom: none;
}
	

#submenu li ul.sub  li.back,
#submenu li ul.sub  li.hier{
	min-height:10px !important;
	
}
#submenu li ul.sub li.left{
border-bottom: none;
}

#submenu li ul.sub li.right{
	 border-top: 1px solid #dcdcdc;
	 border-bottom: none;
}


.result{
	 width:85%;
}

.mainContent .teaser{
	word-wrap: break-word;      /* for IE, Firefox since 3.5 and Opera since 10.5 */
	overflow: hidden;           /* required for text-overflow */
	text-overflow: ellipsis;    /* for IE and WebKit (Safari, Chrome) */
	-o-text-overflow: ellipsis; /* for Opera since 9.0 */
}

/* Bild rechts Bild links*/
.ce-nowrap .ce-right .ce-bodytext,
.ce-nowrap .ce-left .ce-bodytext,
.ce-right .ce-gallery,
.ce-left .ce-gallery{
    width:50%;
}
.ce-right .ce-gallery img,
.ce-left .ce-gallery img{
	width:100%;
	height:auto;
}
.breadcrumb{padding-top:10px; clear:both;}

}

/* Max-Width 560px ############################################ */
@media only screen and (max-width: 560px) {
#menu div ul li.left,
#menu div ul li.right{
	width:96%;
	clear:both;
	float:none !important;
}

.mainContent .teaser {
width: 100% !important;
float: none !important;
padding-right: 0%  !important;
}

.line_grey{
	display:none;
}


.csc-textpic-intext-left .csc-textpic-imagewrap{
	width: 31% !important;
	float:left;
	margin-right:2.3%!important;
}
.csc-textpic-intext-right .csc-textpic-imagewrap{
	width: 31% !important;
	float:right;
	margin-left:2.3%!important;
}

DIV.csc-textpic DIV.csc-textpic-single-image IMG {
margin-bottom: 0px !important;
}
DIV.csc-textpic-intext-left-nowrap DIV {
	width: 100% !important;
	margin-left:0px !important;
}

DIV.csc-textpic-intext-left-nowrap DIV.csc-textpic-imagewrap {
	width: 31% !important;
	margin-right:2.3%!important;
}
DIV.csc-textpic-intext-left-nowrap DIV.csc-textpic-text{
	margin-left: 32% !important;
	width: 66% !important;
}

DIV.csc-textpic-intext-right-nowrap DIV {
	width: 100% !important;
	margin-right:0px !important;
}

DIV.csc-textpic-intext-right-nowrap DIV.csc-textpic-imagewrap {
	width: 31% !important;
	margin-left:2.3%!important;
}
DIV.csc-textpic-intext-right-nowrap DIV.csc-textpic-text{
	margin-right: 32% !important;
	width: 66% !important;
}
DIV.csc-textpic-center DIV.csc-textpic-imagerow,
DIV.csc-textpic-center DIV.csc-textpic-imagerow li,
DIV.csc-textpic-center DIV.csc-textpic-imagewrap {
	margin: 0 auto;
	width: 100% !important;
	text-align:center !important;
}


DIV.csc-textpic-center.csc-textpic-below DIV.csc-textpic-imagewrap{
 margin-top:10px;
}

DIV.csc-textpic-center.csc-textpic-above DIV.csc-textpic-imagewrap{
 margin-bottom:10px;
}
.mainContent .columns .frame-type-textpic .ce-textpic.ce-center.ce-above {
    margin-bottom: 20px;
}
/* Bild rechts Bild links*/
.ce-nowrap .ce-right .ce-bodytext,
.ce-nowrap .ce-left .ce-bodytext{
	width:75%;
}
.ce-right .ce-gallery,
.ce-left .ce-gallery{
    width:25%;
}

.icons .icon, .hints .hint {
		width:15%;
}

.icons .icon_text, .hints .hint_text {
		width:85%;
}
form.newsletterabo .nl-cant-read {
width: 70%;
margin-left: 30%;
}

form label{width:100%;}
input[type=submit],
.feadmin-feusers form .eventblock {margin-left: 0;}
input[type=password], 
input[type=search], 
input[type=file], 
input[type=text], 
input.f_text, 
textarea, 
input[type="date"], 
input[type="time"], 
input[type="number"]  {
	width: 96%;
}
select{
	width: 98%;
}
.feadmin-feusers .eventTime{width:20%;}
.feadmin-feusers form input.plz {width: 18%;}
.feadmin-feusers form input.ort { width: 66%;}

div.tx-spbettercontact-pi1 .tx_spbettercontact_captcha_image {
width: 100%; 
float: none; 
}
div.tx-spbettercontact-pi1 .tx-srfreecap-pi2-cant-read {
margin-left: 5%;
width:60%;
display: block;
float: none;
}

.newsletterabo_personal .unsubscribe a,
.newsletterabo_personal label,
.newsletterabo_personal input[type="text"],
.newsletterabo_personal select,
.newsletterabo_personal input[type="submit"]{
	float:none;
	margin:0px;
	width:100%;
}
.newsletterabo_personal .unsubscribe a{
	 background: #97111A url("../Images/close_btn.png") no-repeat scroll 3px 2px;
width: 87%;
padding-top: 4px;
padding-left: 15%;
}
.newsletterabo_personal .unsubscribe a:hover{
	 background: #96b7d4 url(../Images/close_btn.png) no-repeat scroll 3px 2px;
	width: 87%;
padding-top: 4px;
padding-left: 15%;
}
.newsletterabo_personal input[type="text"],
.newsletterabo_personal select,
.newsletterabo_personal input[type="submit"]{
	margin-bottom:10px;
}
.newsletterabo_personal select,
.newsletterabo_personal  input[type="submit"]{width:102%;}

.newsletterabo_personal  input[type="submit"]{padding-left:15%;}

#tx_smajaxmailsubscription_pi1 img{
	width:auto;
	height:auto;
}
.csc-sitemap li{
	padding-left: 0px !important;
}
.csc-sitemap li a{
	display: inline;
}


.nl-hinweis .frame.default {
    padding-left:0px;
	padding-top: 60px;
}


}




/* IPADS - LANDSCAPE ############################################ */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  	#page{padding-right:35px;}
	.container	{ width: 98%; }
	
	.right_menu .tab{
    	top:94px;
	}

	.right_menu .tab2{
    top:200px;
	}

	.right_menu .tab3{
    	top:283px;
	}
}

/* IPADS - PORTRAIT ############################################ */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {

	#page{ padding-right:0px;}
	.container, #slider{ 
		width: auto !important; 
		padding-right:20px;
		padding-left:20px;
	}


	.subnav  .search{
	margin-bottom:10px;
	width:100%;
	padding-bottom:10px;
	border-bottom: 1px solid #164e93;
}

.subnav .search label{
	width:20%;
	padding-left:2%;
}
.subnav .search input.f_text{
	width:40%;
	float:left !important; 
}
.subnav .search ul{
	width:30%;
	float:right;
	clear:none;
}

}
@media 
only screen and (max-width: 768px) {
	#page{ padding-right:0px;}
	.container{ 
		width: auto !important; 
		padding-right:20px;
		padding-left:20px;
	}
}

/* Max-Width 480px ############################################ */
@media only screen and (max-width: 480px) {
	#slider{ 
		width: auto !important; 
		padding-right:0px;
		padding-left:0px;
	}
	#slider .news-slider .slides span.slideImg.col.span_4.first,
	#slider .news-slider .slides div.col.span_8.text{
		width:100% !important; 
		height:auto; 
		float:none; 
		display:block; 
		margin:0px; 
		padding:0px;
	}
	#menu div ul {
		top: 80px;
	}
	/*News Pagination*/
	.news .paginated-numbers{
		float:none;
		width:100%;
	}
	.news .f3-widget-paginator{
		float:none;
		width:100%;
		text-align: left;
	}
	.container .mainContent  .news .f3-widget-paginator li{
		padding-left: 0px;
		padding-right:5px;
	}
}


/* DESKTOPS & LAPTOPS */
@media only screen and (min-device-width: 769px), only screen and (min-width: 769px) {
/** größere Bilder im Flexslider **/
	.flexslider .slideImg {
		margin: 0;
		width: 43%;
	}
	.flexslider .slides img {
		width: 100%;
		margin-left: 2px;
	}
	.col.span_8.text {
		max-width: 54%;
		width: 49%;
	}
	.flex-direction-nav a {
		margin: 10px 0 0 0;
	}
}
@media 
only screen and (min-width: 1024px) {

	.container { max-width: 975px; }
	.klappteaser.mobile { display: none; }
}

@media 
only screen and (min-width: 1224px) {
	.container { max-width: 975px; }
}

/* LARGE SCREENS */
@media 
only screen and (min-width : 1824px) {	
	.container { max-width: 975px; }	
}

/* RETINA DISPLAY */
@media only screen and (-webkit-min-device-pixel-ratio : 1.5), only screen and (min-device-pixel-ratio : 1.5) {
	
}
/**Videos**/
@media only screen and (max-width: 720px) {

	.halbebreite_center {width:100%; margin:0;}
}

@media only screen and (max-width: 560px) {
	[class*="column"] {
		float: none;
		min-height: 1px;
		display:block;
		margin-bottom:30px;
		width: 100%;
		height: auto;
		padding-left:0px;
		padding-right:0px;
		margin-left:0px;
		margin-right:0px;
 	 }
	.row.multicolumnContainer {
		display: block; 
		width: 100%;
		padding-left:0px;
		padding-right:0px;
		margin-left:0px;
		margin-right:0px;
	}
}