/* ------------------------------------------------- Windows 8 – IE10 in Snapmode */

@-ms-viewport { width: device-width; }

/* ------------------------------------------------- Mediaqueries */

@media only screen and (min-width:67.5em){  /* min-width: 1080px */

	#zeitschriften #description {background-position:right top;}
	#presse #description {background-position:right 10%;}
	#agentur #description {background-size:cover;}
	
	#start #presse-vorschau article {width:29.333333334%;}
	#start #presse-vorschau article:first-of-type {margin:1.5em 0 0 0;}
	#start #presse-vorschau article:nth-of-type(3) {margin:1.5em 0 0 6%;}
}

@media only screen and (max-width:62.5em){  /* max-width: 1000px */
	
	header nav { float:left; margin:-6em 0 0 20em; } 
	header nav li a { margin:0.3em 0.5em 0.1em; }
	#artikel h2 {font-size:2em;} 
	
	#description {overflow:hidden;}
	
	/* -------------------- Header Zeitschriften, Pressearbeit, Agentur */
	
	#zeitschriften #description h1, #presse #description h1, #agentur #description h1 {width:60%;} 
	#zeitschriften #description p, #presse #description p,  #agentur #description p {width:50%;}		
	
	/* -------------------- Presse-Kunde */
	
	#presse-kunde #presse-vorschau { width:66%;padding-right:3%; }
	#presse-kunde #presse-vorschau img { float:none; margin:0 0 1.5em 0;width:100%;}
	#presse-kunde #weitere { width:31%; }
	
	
	/* -------------------- Zeitschriften */
	
	#zeitschriften-nav section {width:100%;margin:5% 0 0;}	
	#zeitschriften-nav section:nth-of-type(odd) {margin:5% 0 0;}	
	
	#zeitschriften-nav img {width:25%;}
	#zeitschriften-nav h2, #zeitschriften-nav p { margin-left:30%; }

	#zeitschriften-desc { margin:0;float:right; }
	#aktuelle-ausgabe { position:static;}
	#ausgaben-nav ul {width:100%;float:none;margin:5% 0;}	
	
	

	/* -------------------- Agentur */

	
	#wer-wir-sind img {width:35%;margin:0 0 1em 0;}
	#wer-wir-sind address {width:100%;margin:0;clear:both;}	
	.person {margin-left:40%;}
	
	#was-wir-tun section { width:100%;padding:2em 0;margin:5% 0 0; }
	
	
	/* -------------------- Kontakt */
	
	#kontaktformular li {width:100%;}
	#kontaktformular small {margin:0;}
	
	
	
	
}

@media only screen and (max-width:43.75em){  /* max-width: 700px */

	/* -------------------- Navigation/Footer */

	body{border:none;}
	header {width:100%;padding:0;}
	#logo {float:none;margin:1.5em 0 1.7em 5%;}

	header nav { box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; 
float:none; width:100%; height:3em; background:#00284a; margin:0; padding:0 0 0 6%;overflow:hidden;}
	header nav li a { display:inline-block; color:#FFF;height:2.1em; padding:1em 0.5em 0;margin:0;-webkit-font-smoothing:subpixel-antialiased;}
	header nav li a:hover {background:#005782;color:white;}
	header nav .aktiv {font-weight:normal;color:white; background:#005782;letter-spacing:0.03em;}

	#info { width:100%;padding:3em 0 1em;}
	#signet {margin:-1em 2em 0 0;}
	#footer-nav {width:100%;padding:2em 0;}
	#footer-nav ul { width:47%;border:none;height:auto;margin:0 0 0 6%;}
	#footer-nav ul:first-child { margin:0;}
	#footer-nav li a { padding:1em 0 0.8em 0;margin:0;border-top:1px solid #005782;}

	#adresse {width:47%;margin:0;padding:2em 0;}
	#adresse address {padding:0;border:none;}
	#media li a { margin:0; }	

	/* -------------------- Sub-Navigation */
	
	#artikel #links { border-top:none;margin-top:0;}
	#projekte #links, #presse #links, #presse-kunde #links { width:88%;padding:0.5em 6% 2em; }

	/* -------------------- Slideshow/Vorschau */
	
	.flexslider h2 {font-size:1.8em;letter-spacing:0.03em;padding-top:0;} 

/* Images im Slider responsive: ergänzt Jürgen*/
.flexslider .slides img {max-width: 100%;height: auto;width: auto;}
	
	#projekte { width:100%;padding:0;}
	#projekte section { width:100%;margin:0;background:-moz-box-shadow:none;-webkit-box-shadow:none;box-shadow:none;}
	#projekte section:nth-of-type(odd) { margin:0;}

	/* -------------------- Artikel */
	
	#artikel .slides li {margin:0;}

	#artikel article { float:none; width:100%; padding:2em 0; border:none;}
	#weitere { width:100%; margin:1em 0;}	
	#artikel aside .quer img { width:100%;}
	#artikel aside .hoch img { width:47%;float:left;margin-right:1.25em; }
	#artikel aside figure {background:#f1f3f0;overflow:hidden;}
	#artikel aside figcaption p {padding:1em 1.25em;}

	/* -------------------- Header Zeitschriften, Pressearbeit, Agentur, Media+Werbeservice*/

	#zeitschriften #description, #presse #description, #agentur #description {background-image:none;width:100%;padding:0;min-height:auto;}
	#werbeservice #description {width:100%;padding:0;min-height:auto;}	
	#zeitschriften #description h1, #presse #description h1, #agentur #description h1, #werbeservice #description h1 {width:88%;padding:1em 6% 0;} 
	#zeitschriften #description p, #presse #description p, #agentur #description p, #werbeservice #description p {width:88%;padding:1em 6% 2em;}
	#agentur #description a {margin:-1em 0 0 0;}

	/* -------------------- Zeitschriften */
	
	#zeitschriften-nav img {
-webkit-box-shadow:0.0625em 0.0625em 0.25em 0.0625em #CCC; 
-moz-box-shadow:0.0625em 0.0625em 0.25em 0.0625em #CCC; 
-o-box-shadow:0.0625em 0.0625em 0.25em 0.0625em #CCC; 
-ms-box-shadow:0.0625em 0.0625em 0.25em 0.0625em #CCC; 
box-shadow:0.0625em 0.0625em 0.25em 0.0625em #CCC;
	}
	
	
	/* -------------------- Agentur / Media+Werbeservice */
		
	#agentur #artikel article, #werbeservice #artikel article {width:100%;padding:2em 0;}
	#wer-wir-sind { width:100%;padding:2em 0;border-top:1px solid #e4e8e1; }
	
	#wer-wir-sind img {width:23%;}
	.person {margin-left:30%;}
	#wer-wir-sind address { margin-left:30%;clear:none; }
	

	/* -------------------- Presse */
	
	.outer-wrapper{width:100%;padding:0;}
		
	#presse-nav { width:88%; margin:0 6%;}
	#presse-nav section:first-child h4 a:first-child { border-width:1px;}	
	#presse-nav #rss-feed { border-bottom:0.25em solid #e4e8e1; }

	#start #presse-vorschau article, #presse #presse-vorschau, #presse-kunde #presse-vorschau {width:100%; padding:1em 0 2em; margin:0; }	
	#start #presse-vorschau article:nth-of-type(odd) {margin:0;}
	#start #presse-vorschau h3 { padding:2em 0 1.5em;}

	#presse #presse-vorschau { width:88%;padding:0 6%;}
	#presse-kunde #presse-vorschau { width:100%;padding:0 6%; border:none;}

	#presse-vorschau-nav { padding:1.5em 0 0;margin-top:0;}
	#presse-vorschau-nav li a:hover {border-color:#FFF;}
	#presse-vorschau-nav .inaktiv:hover { background:#FFF;border-color:#e4e8e1; }

	#presse-kunde #description {width:100%;padding:2em 0;}
	#presse-kunde header {border:none; }
	
	#presse-kunde #weitere { width:100%; padding:0;margin:0;background:#e4e8e1;}
	#presse-kunde #weitere h3 { width:88%; padding:2.2em 6% 1.9em;}	
	#presse-kunde #weitere a { width:88%; padding:1.2em 6% 1em;border-top:1px solid #FFF;}
	#presse-kunde #weitere #rss-feed { padding:1.2em 6% 1em;border-top:1px solid #FFF;}
	#presse-kunde #weitere #rss-feed a { border-top:none;padding:1.3em 0 1em 3em;}	
	
	/* -------------------- Kontakt */
	#anschrift, #kontaktformular { width:88%;margin:6%; }
	
	/* -------------------- Impressum */
	#impressum #description section { width:100%;float:none;margin:2em 0 0 0;border-top:0.5em solid #FFF;padding:1.5em 0 0 0;}
	#impressum #description section:first-of-type {margin:2em 0 0 0;}
	#impressum #description section:nth-of-type(3) {width:100%;margin:2em 0 0 0;
	-moz-column-count:1;-webkit-column-count:1;column-count:1;
	}
	
}

@media only screen and (max-width:34.375em){  /* max-width: 550px */

	/* -------------------- Navigation/Footer */
	header {width:100%;}
	#logo {width:14em; height:5em;}
	header nav { padding:0; height:auto; display:table;}
	header nav li {width:33.333333334%;border-bottom:1px solid #005782;}
	header nav li:first-child {width:50%;}
	
	header nav li a {box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;width:100%; padding:1em 0 0 18%; border-right:1px solid #005782;height:3em;}
	header nav li a:active {background:#00284a;}
	header .aktiv {padding-left:12%}
	
	.menu { width:50%; }
	.menu a { border-left:1px solid #00284a; background:url(/fileadmin/faust/img/menu.svg) no-repeat 1em 0.9em;padding-left:3.5em;}
	.menu a:hover { color:#FFF;background:#005782 url(/fileadmin/faust/img/menu.svg) no-repeat 1em 0.65em;}
	
	#start .menu, #impressum .menu, #werbeservice .menu { width:100%; }
	#start .menu a, #impressum .menu a, #werbeservice .menu a { font-weight:normal;color:#FFF;background:#005782 url(/fileadmin/faust/img/menu.svg) no-repeat 7% 0.7em;border-left:none;padding:1.1em 0 0 14%;}
	#start .menu a:hover, #impressum .menu a:hover, #werbeservice .menu a:hover { color:#FFF;background:#00284a url(/fileadmin/faust/img/menu.svg) no-repeat 7% 0.95em;}
	
	#adresse {width:100%;margin:0;padding:2em 0;}
	#media {width:100%;padding:1em 0 2em 0;}


	/* -------------------- Slideshow/Vorschau */
	
	.flex-control-nav {	display:none; }
	
	.flexslider .caption { width:100%;margin:0;padding:0;position:static;}
	.flexslider h2 {color:#FFF;font-size:1.5em;padding:7% 6% 6%;text-shadow:none;line-height:1.2;background:#00284a;min-height:6em;}
		
	#artikel h2 {font-size:1.5em;text-shadow:none;}
	
	/* -------------------- Presse */
	
	#presse-kunde h1 {font-size:1.8em;}
	
	.hoch img { width:100%!important;float:none!important;margin-right:0!important; }
	
	/* -------------------- Zeitschriften */
	
	#zeitschriften #description { background-position:-10em -150%; }
	#zeitschriften #description h1 { font-size:1.8em; }
	
	#zeitschriften-desc {width:100%;float:none;margin-bottom:2em;}

	#aktuelle-ausgabe {width:100%;}

	#ausgaben-nav ul {margin:2em 0;}
	#ausgaben-nav li {width:47%;float:left;margin:0 0 6% 6%;}
	#ausgaben-nav li:nth-of-type(3n+1) {margin:0 0 6% 6%;}
	#ausgaben-nav li:nth-of-type(odd) {margin:0 0 6% 0;}
	
	/* -------------------- Agentur */
	#was-wir-tun img { width:100%;margin:0 0 2em 0;}
	#was-wir-tun h3, #was-wir-tun p { margin:0 0 1em;}
	
}

@media only screen and (max-width:24.375em){  /* max-width: 390px */

	header nav li { width:50%;}
	header nav li a { padding-left:12%;}
	
	header nav li:first-child {width:50%; }
	
	.menu { width:50%; }
	#start .menu a, #impressum .menu a, #werbeservice .menu a { padding:1.1em 0 0 17%;}

	.flexslider h2 span {font-size:0.65em;}

/* Images im Slider responsive: ergänzt Jürgen*/
.flexslider .slides img {max-width: 100%;height: auto;width: auto;}
	
	#wer-wir-sind img {float:right;width:40%;margin:0 0 1.5em 0.5em;}
	.person {margin:0;}
	#wer-wir-sind address {clear:both;margin:0;}
	
}