/* --------------------------------------------------------------------------------------- 
http://stephen.io/mediaqueries/#iPhone
--------------------------------------------------------------------------------------- */

/*
@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;
	}
}
*/

/* --------------------------------------------------------------------------------------- 
height greater than 1650
--------------------------------------------------------------------------------------- */
/*@media screen and (min-height: 1050px) { */
/*
@media screen 
and (max-width: 1440px) 
and (max-height: 1024px) 
*/
@media screen 
and (max-width: 1640px) {}

/* --------------------------------------------------------------------------------------- 
kleiner als 1680
--------------------------------------------------------------------------------------- */

@media only screen and (max-width: 1680px) {}


/* --------------------------------------------------------------------------------------- 
kleiner als 1440
--------------------------------------------------------------------------------------- */
@media screen and (max-width: 1440px) {}



/* --------------------------------------------------------------------------------------- 
kleiner als 1368
--------------------------------------------------------------------------------------- */
@media screen and (max-width: 1368px) {}




/* --------------------------------------------------------------------------------------- 
kleiner als 1280
--------------------------------------------------------------------------------------- */

@media screen and (max-width: 1280px) {}




/* --------------------------------------------------------------------------------------- 
kleiner als 1024
--------------------------------------------------------------------------------------- */
/* For Smartphones, Tablets or other Displays less then 768 1024px ====================== */
@media screen and (max-width: 1024px) {
	* {
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
	}
	/* --- disallow scrolling inside body when overlay is open --- */
	html.noscroll body {
		position:fixed;
		overflow-y: hidden;
		-ms-overflow-y: hidden;
		overflow: hidden;
		width: 100%;
	}
	body {
		font-size: 13px;
		position: relative;
		background: #fff url('') repeat center center;
	}

	/* hide breadcrumb when in #col-pos-0 */
	#col-pos-0 #breadcrumb {display: none;}

	#mainnavigation,
	#topnavigation
	{
		display: none;
	}
	#language-menu {
	  top: 25px; right: 25px;
	}
	
	img {
	/*  max-width: 100%;*/
	  height: auto;
	  width: 100%;
	  border:none;
	}
	#col-pos-2 img {
		max-width: 100%;
		width: auto;
	}
	#page table a img {
		max-width: 100%;
		width: auto;
	}
	div.etracker-code img {width: auto;}

	video,
	object,
	embed
	{	
		width: 100%    !important;
		height: auto   !important;
	}

	#logo {top: 10px;}
	#logo img {
		margin: 0;
		max-width:100%; 
		width: auto;
	}

	.news-catmenu a,
	ul#ulsidenavigation li a 
	{
		line-height: 26px;
		padding-left: 0;
	}
	.news-catmenu a:before {
		margin-right: 4px;
	}
	.news-catmenu li li li li a:before {display: none;}
	.news-catmenu li li li li {padding-left: 15px;}
	
	.news-catmenu a,
	ul#ulsidenavigation li.sidenav_li1 a,
	ul#ulsidenavigation li.sidenav_li1 li.sidenav_li3 a.active,
	ul#ulsidenavigation li.sidenav_li1 li.sidenav_li3 a:hover
	{
	
	  background-image: url('');
	}
	.news-catmenu a:before,
	ul#ulsidenavigation li.sidenav_li1 a:before
	{
		content: "\f0da";
		font-family: FontAwesome;
		font-style: normal;
		font-weight: normal;
		font-size: 1.0em;
		line-height: 0.8em;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}
	ul#ulsidenavigation li li a:before,
	ul#ulsidenavigation li li li a:before
	{
		display: none;
	}
	ul#ulsidenavigation li.hasSubs > a:before
	{
		content: "\f0d7";
		display: inline;
	}
	/* ---------------------------------------------------------------
		SEARCH MENU
	--------------------------------------------------------------- */
	div#topnavigation-contents {
		z-index: 155;
	}
	#searchbox-autocomplete {
		margin: 0;
		background: #16b4bd;
		width: 100%;
		position: fixed;
		z-index: 155;
		top: -50px;
		left: 0;
		padding: 0;
		height: 50px;
	  float: none;
	}
	.tx-indexedsearch-descr {
		width: 100%;
	}
	ul.browsebox {
		margin: 0; padding: 0;
	}
	ul.browsebox li {
		white-space: nowrap;
		font-size: 1.2em;
		line-height: 2.2em;
	}
	
	.percent-tmpl-css {
		width: auto;
		top: 0; right: 0;
		font-size: 1.6em;
		line-height: 1;
		margin: 0;
	}

	input#tx-indexedsearch-searchbox-sword,
	#searchbox-autocomplete .searchform input.sword {
		height: auto;
		font-size: 1.3em;
		padding: 0 1.0em 0 1.0em;
		margin: 0;
		width: 80%;
		height: 50px;
	}
	#searchbox-autocomplete .searchform input.sword {
		border: none;
		background: none;
		color: #fff;
	}
	.link-to-othermode {
		clear: both;
		display: block;
		margin: 0;
		margin-top: 20px;
		font-weight: bold;
	}
	#searchbox-autocomplete .searchform input:focus {
	  box-shadow: inset 0 0 8px rgba(255, 255, 255, 0.6);
	  outline: none;
	  border: none;
	}
	input#tx-indexedsearch-searchbox-button-submit,
	#searchbox-autocomplete input[type="submit"]
	{
		padding: 0; margin: 0;
		line-height: 1.0em !important;
		margin-right: 15px;
		width: 40px; height: 40px;
		outline:0; -moz-outline:0;
		border: none;
		text-indent: 0;
		background: transparent url('') no-repeat;
		cursor: pointer;

		font-family: FontAwesome;
		font-style: normal;
		font-weight: normal;
		font-size: 26px;
		line-height: 0.8em;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}
	input#tx-indexedsearch-searchbox-button-submit {
		width: 50px; height: 50px;
		font-size: 36px;
	}
	#searchbox-autocomplete input[type="submit"] 
	{
		float: right;
		color: #fff;
	}
	#searchbox-autocomplete input::-webkit-input-placeholder {
		color: #bbeaec;
	}
	#searchbox-autocomplete input:-moz-placeholder { /* Firefox 18- */
		color: #bbeaec;  
	}
	#searchbox-autocomplete input::-moz-placeholder {  /* Firefox 19+ */
		color: #bbeaec;
	}
	#searchbox-autocomplete input:-ms-input-placeholder {  
		color: #bbeaec;  
	}
	a.snavopen {
/*
		-webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.2);
		-moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.2);
		box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.2);
*/
	}
	.mobile-buttons {	
		display: block;
		z-index: 152;
		position: fixed;
		right: 15px; 
		top: 15px;
		cursor: pointer;
		line-height: 1;
		height: 50px;
		padding: 0; margin: 0;
/*
		-webkit-transition: all 0.10s ease-in-out;
	  -moz-transition: all 0.10s ease-in-out;
		-ms-transition: all 0.10s ease-in-out;
		-o-transition: all 0.10s ease-in-out;	
		transition: all 0.10s ease-in-out;
*/
	}
	#search_menu {	
		z-index: 151;
		right: 50px;
	}
	/* positioning without search_menu */
	#search_menu.searchdisabled {display: none;}

	.mobile-buttons span 	{
		text-indent: -999em;
		display: none;
	}
	.mobile-buttons b {
		display: block;
		line-height: 1;
		width: 40px; height: 40px;
		font-weight: normal;
/*
		-webkit-transition: all 0.10s ease-in-out;
	  -moz-transition: all 0.10s ease-in-out;
		-ms-transition: all 0.10s ease-in-out;
		-o-transition: all 0.10s ease-in-out;	
		transition: all 0.10s ease-in-out;
*/
	}
	a.mobile-buttons b:before {
		display: inline-block;
		font-family: FontAwesome;
		font-style: normal;
		font-weight: normal;
		font-size: 26px;
		line-height: 0.8em;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		content: "\f0c9";
		color: #fff;
	}
	a#search_menu b {height: 50px; }
	
	a#search_menu b:before {
		color: #71878f;
		content: "\f002";	
		line-height: 1.5em;
	}
	
	/* --- begin mobile submenu  --- */
	div.mobile-submenue {
		display: block;
		margin: 15px 0 8px 0;
	}
	a#opensubmenue {
		cursor: pointer;
		font-size: 1.0em;
		color: #005a4c;
	}
	a#opensubmenue.subactive,
	a#opensubmenue:active 
	{
		color: #008a7d;
	}

	/* general mobile buttons on top mixed with icomoon */
	a#opensubmenue:before {
		padding-right: 4px;
		display: inline-block;
		font-family: FontAwesome;
		font-style: normal;
		font-weight: normal;
		font-size: 1.0em;
		line-height: 1;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}
	/* fa-bars [] */
	a#opensubmenue:before {
		color: #005a4c;
		content: "\f0c9";	
	}
	
	a#opensubmenue.subactive:before {

		color: #008a7d;
		content: "\f00d";	
	}
	
	/* --- end mobile submenu  --- */
	#col-pos-1 {
		margin: 20px 0 0 0; 
	}
	a#mobile_menu {	
		-webkit-transition: all 0.10s ease-in-out;
	  -moz-transition: all 0.10s ease-in-out;
		-ms-transition: all 0.10s ease-in-out;
		-o-transition: all 0.10s ease-in-out;	
		transition: all 0.10s ease-in-out;
	}
	a#mobile_menu b:before {
		content: "\f0c9";
	}
	#mobile_menu.mnavopen {	
		right: 0px; 
		top: 0px ! important;
	}
	#mobile_menu b {
		background: #16b4bd;
		padding: 10px 0 10px 9px;
	}
	.mnavopen b {background: #fff;}
	a#mobile_menu.mnavopen b:before {content: "\f00d";}

	/* --- MOBILE MENUU MOBILENAV --- */
	#mobilenav.navopen {display:block;}

	#mobilenav li {
		width: 100%;
		margin: 0;
		float: none;
	}
	#mobilenav li a {
	  text-transform: uppercase;	
		font-size: 1.2em;
		line-height: 1.3em;
		margin: 0;
		display: block;
		padding: 10px;
		text-decoration: none;
		color: #fff;
	}
	#mobilenav li li a, 
	#mobilenav li li li a 
	{
		display: block;
	}

	/* zweite Ebene ausblenden */
	#mobilenav ul {margin: 0; padding: 0;}
	#mobilenav ul, #mobilenav li li {list-style: none; margin: 0;}

	/* --- allow scrolling inside these sections --- */
	/* ------------------------------------------------ 
		scroll contents 
		100vh for ipad and iphone only possible with additional js
		see custom.js - > jQuery.fn.updateViewportHeight
	------------------------------------------------ */
	#mobilenav {
		border-bottom: 2px solid #fff;
	}
	div#mobilenav ul#mobilenav-cnt {
		overflow-y: scroll; 
		-webkit-overflow-scrolling:touch;
		display: block;
		list-style:none;
		margin-top: 40px;
		padding: 0px 0px 50px 0px;
		/* adapt padding bottom to margin top because of height in menu */
		position: relative;
		height: 100%;
		height: 100vh;
		clear: both;
		border-top: 1px solid #fff;
		background: transparent;
	}
	.dontdisplayhome {display: none;}


	ul#mobilenav-cnt ul.dynamic {
		position:relative;
		left: 0; top: 0;
		white-space:normal;
		word-wrap:break-word;
		padding: 0px;
		border: none;
		box-shadow:0px 0px 0px 0px rgba(0,0,0,0.47);
	}
	ul#mobilenav-cnt li {
		position: relative;
		border-bottom: 1px solid #fff;
	}
	ul#mobilenav-cnt li a {padding-left: 0.6em;}
	ul#mobilenav-cnt li li:first-child {border-top: 1px solid #fff;}
	ul#mobilenav-cnt li li {border-bottom: 0px solid #fff;}
	ul#mobilenav-cnt li li a {padding: 0.6em 0 0.6em 1.0em;}
	/* --- einrückung mobile menu --- */
	ul#mobilenav-cnt li li a {padding-left: 1.5em;}
	ul#mobilenav-cnt li li li a {padding-left: 2.5em;}
	ul#mobilenav-cnt li li li li a {padding-left: 3.2em;}
	ul#mobilenav-cnt li li li:last-child {border-bottom: 1px solid #fff;}

	ul#mobilenav-cnt li ul {
		background: #16b4bd;
	}
	
	
	ul#mobilenav-cnt .dynamic-children > a:after {
		position: absolute;
		top: 8px; right: 9px;
		font-family: FontAwesome;
		font-style: normal;
		font-weight: normal;
		font-size: 26px;
		line-height: 0.8em;
		margin-right: 8px;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		content: "\f105";
	}
	/* fa-caret-down [] */
	ul#mobilenav-cnt .dynamic-children > a.mobileopen:after {
		content: "\f106";	
	}
	.mobileopen {position: relative;}
	
	/* --- end mobilenav --- */




}

/* --------------------------------------------------------------------------------------- 
kleiner als 960
--------------------------------------------------------------------------------------- */
@media screen and (max-width: 960px) {

	.sf-menu .firstlevel,
	#TSFE_ADMIN_PANEL_FORM
	{
		display: none;
	}


}
/* --------------------------------------------------------------------------------------- 
end kleiner als 960
--------------------------------------------------------------------------------------- */


/* --------------------------------------------------------------------------------------- 
kleiner als 800
--------------------------------------------------------------------------------------- */
@media screen and (max-width: 800px) {	

	body iframe {
		width: 100% !important;
	}
	body {
		font-size: 13px;
		line-height: 22px;
	}

	div.csc-textpic-intext-left .csc-textpic-imagewrap,
	div.csc-textpic-intext-left-nowrap .csc-textpic-imagewrap,
	div.csc-textpic-intext-right .csc-textpic-imagewrap,
	div.csc-textpic-intext-right-nowrap .csc-textpic-imagewrap
	{
		width: 50%;
	}
	.caption-link a,
	a.button
	{
	  font-size: 1.2em;
	}
	
	.floatLeft,
	.floatRight,
	.colPos10-10_0_2,
	.colPos0-10_0_2,
	.colPos2-10_0_2,
	.colPos1-1_0_2,
	.colPos0-1_0_2,
	.colPos2-1_0_2,
	#pageheader,
	#pageheader-contents,
	#contents,
	#footer,
	#footer-contents,
	.colPos2-schmuck
	{
	  width: 100%;
	  float: none;
	  clear: both;
	}
	.colPos2-schmuck {
		background-position: top right;
	}		
	#headerimage {margin-bottom: 2.0em;}
	#pageheader {height: 100px;}
	#language-menu {
		top: 65px;
		right: 0px
	}
	#breadcrumb {height: auto;}
	
	.colPos2-1_0_2 .csc-default {
		padding: 10px;
		background: #e3e3e3;
		width: 100%;
		margin-top: 30px ! important;
	}
	#content .csc-frame,
	#content .csc-default 
	{
	  margin: 1em 0 1em 0;
	}

	/* anythingSlider adaptions */
	.anythingSlider div.csc-textpic-intext-left .csc-textpic-imagewrap,
	.anythingSlider div.csc-textpic-intext-left-nowrap .csc-textpic-imagewrap,
	.anythingSlider div.csc-textpic-intext-right .csc-textpic-imagewrap,
	.anythingSlider div.csc-textpic-intext-right-nowrap .csc-textpic-imagewrap
	{
		width: 100%;
	}
	.colPos10-10_0_2 {
	  height: auto;
	}
	.colPos10-10_0_2 .anythingSlider {
		background: #16b4bd;
	  height: 470px ! important;
	}
	.colPos10-10_0_2 .anythingSlider .csc-textpic-text { 
		margin: 0 ! important; 
		padding: 1.2em;
	}
	.colPos10-10_0_2 DIV.csc-textpic {
		background: transparent;
		height: auto;
	}
	
	#headerimage div.csc-textpic .csc-textpic-imagewrap .csc-textpic-image {
		width: 100%;
	}


}
/* --------------------------------------------------------------------------------------- 
end kleiner als 800
--------------------------------------------------------------------------------------- */


@media (max-width: 767px) {
	/* Center (above or below) */
	#page div.csc-textpic .csc-textpic-imagewrap .csc-textpic-image {
		width: 100%;
	}
	#col-pos-0 div.csc-textpic-center .csc-textpic-center-outer { position: relative; float: none; right: 0; }
	#col-pos-0 div.csc-textpic-center .csc-textpic-center-inner { position: relative; float: none; right: 0; }

	/* Right (above or below) */
	#col-pos-0 div.csc-textpic-right .csc-textpic-imagewrap { float: none; }
	#col-pos-0 div.csc-textpic-right div.csc-textpic-text { clear: right; }

	/* Left (above or below) */
	#col-pos-0 div.csc-textpic-left .csc-textpic-imagewrap { float: none; }
	#col-pos-0 div.csc-textpic-left div.csc-textpic-text { clear: left; }
	
	#col-pos-0 div.csc-textpic div.csc-textpic-imagecolumn { float: none; }
	
	/* colSpace around image columns, except for last column */
	#col-pos-0 div.csc-textpic-imagecolumn,
	#col-pos-0 td.csc-textpic-imagecolumn .csc-textpic-image { margin-right: 0px; }



}



/* --------------------------------------------------------------------------------------- 
iPad ALLE
--------------------------------------------------------------------------------------- */
@media only screen 
and (min-width : 768px) 
and (max-width : 1024px) 
{
}
/* --------------------------------------------------------------------------------------- 
End iPad ALLE
--------------------------------------------------------------------------------------- */



/* --------------------------------------------------------------------------------------- 
iPad in landscape
--------------------------------------------------------------------------------------- */
@media only screen 
and (min-width : 768px) 
and (max-width : 1024px) 
and (orientation : landscape) 
{


}
/* --------------------------------------------------------------------------------------- 
iPad in Portrait
--------------------------------------------------------------------------------------- */




/* --------------------------------------------------------------------------------------- 
iPad in Portrait
--------------------------------------------------------------------------------------- */
@media only screen 
and (min-width : 768px) 
and (max-width : 1024px) 
and (orientation : portrait)
{



}
/* --------------------------------------------------------------------------------------- 
End iPad in Portrait
--------------------------------------------------------------------------------------- */








/* --------------------------------------------------------------------------------------- 
https://css-tricks.com/snippets/css/media-queries-for-standard-devices/
--------------------------------------------------------------------------------------- */
/* Portrait and Landscape */
@media only screen 
  and (min-width: 320px) 
  and (max-width: 667px) 
{


	
}




/* Landscape */
@media only screen 
  and (min-width: 320px) 
  and (max-width: 667px) 
	and (orientation: landscape) 
{



}



/* --- for iphone 4 - 6 --- */
/* Portrait */

@media only screen 
and (min-width: 320px) 
and (max-width: 667px) 	
and (orientation: portrait) { 




}