@charset "UTF-8";



/* Generic linearize of grids on small screens */

@media screen and (orientation: portrait)  {
	
	 .zoomitbild.landscape { display: none;}
     .zoomitbild.portrait { display: inherit;}
}
@media screen and (orientation: landscape)  {
	
	 .zoomitbild.landscape { display: inherit;}
     .zoomitbild.portrait { display: none;}
}

/* reset fallback values in modern browsers */

@media screen and (min-width: 0px) {

	.ym-wrapper, body.html-fullheight footer {

		min-width: 0px;

		width: auto;

	}



	/* Make a large image flexible in width */

	img {

		max-width: 100%;

		height: auto;

	}
}
@media screen and (max-width: 1370px) {
	body.html-fullpage #main { padding:0 1em;}
}

@media screen and (max-width: 1120px) {
	.ym-hlist ul li {
    margin: 0px 0.10em 0px 0px;
    padding: 0px;
}
	
	.ym-hlist ul li a, .ym-hlist ul li strong, .ym-hlist ul li span.separator
	{
	padding: 0.5em 0.4em;	
		
	}
	
}


@media screen and (max-width: 1023px) {
	
	
	header h1 { text-align:center;}
	#nav2 ul { display:none;}
	#tinynav1 { display: block; }
	#tinynav1  { text-align:center; width:100%;}
}


/* normal screens, tablet(landscape)  */

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

	/* only remove gutters for more place */

	body {

		padding: 0;

		margin: 0;

	}

	header {

		padding-top: 0;

		margin-top: 0;

	}
 
  
}








/* small screens and tablet(portrait) */

@media screen and (max-width: 740px), screen and (max-width: 768px) {
	
	.mobilenav-menu-title { display:none;}
	.header h1 { text-align:center;}


	/* Linearize only inner main columns (not col-x), e.g. category blog with multiple columns */

	#main .ym-equalize > * > .ym-gbox,

	#main .ym-equalize > * > .ym-gbox-left,

	#main .ym-equalize > * > .ym-gbox-right {

		padding-bottom: 0 !important;

		margin-bottom: 0 !important;

	}

	#main .ym-grid,

	#main .ym-grid > [class*="ym-g"],

	#main .ym-grid > [class*="ym-col"] {

		display: block !important;

		float: none !important;

		margin-left: 0 !important;

		margin-right: 0 !important;

		width: 100% !important;

	}

	#main .ym-grid > [class*="ym-g"] > [class*="ym-gbox"],

	#main .ym-grid > [class*="ym-col"] > [class*="ym-cbox"] {

		padding-left: 0;

		padding-right: 0;



		/* optional for containing floats */

		overflow: hidden;

	}
	
	
	

}



/* mobile phones, small tablets and very small screens */

@media screen and (max-width: 640px) {
	
	
	
    #main2 .ym-wbox,  .page-header { text-align:center;}
	footer .kiracontact  .ym-gl, footer .kiracontact  .ym-gr { text-align:center; }
	footer .kiracontact  .ym-gl { border:none; margin:.5em 0;}

	/* disable absolute positioning for topnav to prevent overlaying */
	.meinefarbe h2 { margin-top:.2em;}

	#topnav {

		position: relative;

		top: auto;

		right: auto;

		margin-bottom: 1em;

	}



	/* Linearize all columns */

	.ym-column,

	.ym-column .ym-col1,

	.ym-column .ym-col2,

	.ym-column .ym-col3 {

		display: block !important;

		float: none !important;

		margin-left: 0 !important;

		margin-right: 0 !important;

		width: 100% !important;

	}



	/* disable equal heights for grids */

	.ym-equalize > * > .ym-gbox,

	.ym-equalize > * > .ym-gbox-left,

	.ym-equalize > * > .ym-gbox-right {

		padding-bottom: 0 !important;

		margin-bottom: 0 !important;

	}



	/* Linearize all grids */

	.ym-grid,

	.ym-grid > [class*="ym-g"],

	.ym-grid > [class*="ym-col"] {

		display: block !important;

		float: none !important;

		margin-left: 0 !important;

		margin-right: 0 !important;

		width: 100% !important;

	}

	.ym-grid > [class*="ym-g"] > [class*="ym-gbox"],

	.ym-grid > [class*="ym-col"] > [class*="ym-cbox"] {

		padding-left: 0;

		padding-right: 0;



		/* optional for containing floats */

		overflow: hidden;

	}



	/* Linearize the horizontal navigation */

	body .ym-hlist ul,

	body .ym-hlist ul li {

		display:block;

		float: none;

		width: auto;

		text-align: left;

	}

	body .ym-hlist ul {

		padding: 0.5em;

	}

	body .ym-hlist ul li {

		margin-bottom: 2px;

	}

	body .ym-hlist ul li span.subtitle-empty {

		display: none !important;

	}
	.mobstartbild { display: block;}
	body.itemid-101 { background:none;}

}



/* small mobile phones */

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



	/* reduce font size for very small displays */

	body {

		font-size: smaller;

	}

}



