/*
Theme Name: Magazin #4
*/

* { margin: 0; padding: 0; }

body { border-bottom: solid 3px #222; }
article { border-top: solid 3px #222; }


section { display: block; }

@media all and (min-width: 1px) {
body {font-size: 15px; line-height: 1.4; }
menu {display: none;}
h2, h3, p, small, cite, footer { width: 97%; }
}


@media all and (min-width: 700px) {
nav, menu {display: block;}
body#home nav {display: none;}
body, menu {font-size: 14px; line-height: 1.7; }
section section, h3, p, small { width: 47%; float: left; padding-right: 3%; }
img { max-width: 97%; margin-top: 5px; }
section section img { width: 100%; max-width: 100%; }
p small { width: 100%; float: none; padding-right: 0; }
article#infos p { width: 97%; float: left; padding-right: 3%; margin-bottom: 5px; }
article#inhalt section section { width: 97%; float: right; margin-right: 0; }
article#einleitung h1 { width: 97%; margin-bottom: 23px; }
}

@media all and (min-width: 1100px) {
section section, h3, p, small { width: 30%; float: left; padding-right: 3%; }
article#infos p { width: 60.6%; float: left; padding-right: 3%; }
article#inhalt section section { width: 60.8%; float: right; margin-right: 3.2%; }
article#einleitung h1 { width: 30%; float: left; margin-top: 0; margin-right: 3%; margin-bottom: 20px; }
}

@media all and (min-width: 1700px) {
section section, h3, p, small { width: 22%; float: left; padding-right: 3%; }
article#inhalt section section { float: none; margin-left: 25%; margin-right: 22%; }
article#einleitung h1 { width: 22%; float: left; margin-right: 3%; margin-bottom: 20px; }
}

section section { margin-bottom: 1.6em;}

cite small { clear: both; width: 100%; margin-top: 10px; }

h1 .small { font-size: 28px; }


article#kommentare { background-color: #ddd; }
article#kommentare form { width: 97%; }
article#kommentare label { font-family: 14px; font-family: arial; }
article#kommentare textarea, article#kommentare input { -moz-border-radius:0; -webkit-border-radius:0;
border-radius:0; text-shadow: #fff 1px 1px 2px; font-size: 13px; font-family: 14px; padding: 5px 4px; margin-top: 6px; margin-bottom: 12px; width: 98%; background-color: #fff; border: none; outline:2px solid #ccc; }
article#kommentare input:focus, article#kommentare textarea:focus { outline:2px solid #222; }
article#kommentare section { max-width: 650px; margin: 0 auto; }
article#kommentare p, article#kommentare h3 { font-family: arial; float: none; width: 97%; }
article#kommentare h3 { font-family: "Droid Sans"; font-size: 30px; }
article#kommentare h4 { font-family: "Droid Sans"; margin-bottom: 20px; font-size: 20px; }

article#kommentare input[type="submit"] { -moz-border-radius:0; -webkit-border-radius:0; background-color: #222; color: #eee; font-weight: bold; outline:2px solid #222; text-shadow: #222 1px 1px 2px; width: auto; padding: 7px 9px; }
article#kommentare input[type="submit"]:hover { background-color: #444; color: #fff; outline:2px solid #444; cursor: pointer; }

@media all and (min-width: 1px) {
ol { max-width: 640px; clear: both; margin-left: 30px; margin-bottom: 40px; margin-right: 3%; }
}

@media all and (min-width: 700px) {
ol { max-width: 640px; clear: both; margin-left: 60px; margin-bottom: 40px; margin-right: 3%;   }
}

article img {float: left; margin-bottom: 20px; }

html { 
background-color: #fff;
}

body { 
font-family: "Droid Serif", helvetica;
color: #222;
text-shadow: #fafafa 1px 1px 1px;
}

article {
padding: 3%;
padding-right: 0;
display: block;
}


article#cover {text-align: center; background: #fff url(http://www.designmadeingermany.de/magazin/wp-content/themes/4/images/cover-bgr.png) no-repeat center 0px; }
article#cover header { text-shadow: #F7E505 1px 1px 1px; }
article#cover img { display: none; }
article#cover h3 { font-size: 28px; float: none; margin: 0 auto; width: 97%; margin-bottom: 6%; margin-top: 1290px; }
article#cover small { float: none; margin: 0 auto; margin-bottom: 5%;}
article#cover h1, article#cover h2 { display: none; }

article#verlosung { background-color: #F7E505; text-shadow: #F7E505 1px 1px 1px; }
article#verlosung h1 { text-shadow: #F7E505 1px 1px 1px; }
article#verlosung p { float: none; margin-top: 60px; width: 97%; }

article#coco {background-color: #191919;color: #fff;text-align: center;text-shadow: #111 1px 1px 2px;}
article#coco img { float: none; margin: 0 auto; margin-right: 3%; }

@media all and (min-width: 700px) {


article#inhalt {background: #fff url(http://www.designmadeingermany.de/magazin/wp-content/themes/4/images/bgr-inhalt.png) no-repeat left 0px; }
article#inhalt h1 {  font-size: 44px; line-height: 1.4; margin-top: 30px; margin-bottom: 60px; }
article#inhalt h1 a { border: none; }
article#inhalt h2 { font-family: "Droid Serif"; font-weight: normal; font-size: 22px; line-height: 1.5; margin-bottom: 5px;  }
article#inhalt h2 em {  }
article#inhalt h2 a { border-bottom: solid 0; }
article#inhalt p { font-family: "Droid Sans"; font-weight: bold; }
article#inhalt small { margin-bottom: 7px;  }
article#inhalt h1 { text-shadow: #F7E505 1px 1px 1px; }

article#impressum h1 {  font-size: 44px; line-height: 1.4; margin-top: 0px; margin-bottom: 40px; }
article#impressum h2 { font-family: "Droid Serif"; font-weight: normal; font-size: 22px; margin-bottom: 5px; width: 97%;  }

article#einleitung {  padding-bottom: 0;  }
article#einleitung h1 { text-shadow: #eee 2px 2px 1px; font-size: 24px; }
article#einleitung h1 a { border: none; }
article#einleitung img { width: auto; width: 345px; float: none; max-width: 100%; margin-left: -3px; }
article#einleitung small { font-style: normal; color: #666; }

article#infos { padding-bottom: 25px; }
article#infos small { font-style: normal; }

article#diskussion h1 { font-size: 40px; }
article#diskussion h1 em { display: block; }
article#diskussion section { max-width: 650px; margin: 0 auto; }
article#diskussion section section { max-width: 650px; margin: 0 auto; float: none; width: 97%; }
article#diskussion p { font-family: arial; float: none; width: 97%; }
article#diskussion p em { font-family: "Droid Sans"; float: none; width: 97%; text-align: center; font-weight: bold; display: block; font-size: 20px; margin-top: 50px;  }
article#diskussion p em a { text-decoration: none; border-bottom: solid 3px; }

article#gassner h1 { font-family: "Droid Serif"; font-weight: normal; font-size: 40px; line-height: 1.3; margin-top: 90px; margin-bottom: 90px; }
article#gassner h2  { font-family: "Droid Serif"; font-weight: normal; }
article#gassner h2 a { border-bottom: solid 1px; }
article#gassner h3  { font-family: "Droid Serif"; font-weight: normal; font-size: 19px;  }
article#gassner p  { font-family: arial; }

article#kinder h1 { font-family: "Droid Serif"; font-size: 70px; line-height: 1.3; margin-top: 90px; margin-bottom: 90px; }
article#kinder h2  { font-family: "Droid Serif"; font-weight: normal; font-size: 22px; }
article#kinder h2 a { border-bottom: solid 1px; }
article#kinder h3  { font-family: "Droid Serif"; font-weight: normal; font-size: 19px;  }
article#kinder p  { font-family: arial; }
article#kinder img  { margin: -3px; }
article#kinder small { margin-bottom: 4em; }

article#spiegel { background-color: #b00000;
background: -moz-linear-gradient(-90deg, #b00000, #700000);
background: -webkit-gradient(linear, left top, left bottom, from(#d00000), to(#700000)); 
color: #fff; text-shadow: #700000 1px 1px 2px; }
article#spiegel a { color: #fff; }
article#spiegel h1 a { font-size: 80px;
  color: #222;
  text-shadow: rgba(0,0,0,0.5) -1px 0, rgba(0,0,0,0.3) 0 -1px, rgba(222,222,222,0.5) 0 1px, rgba(0,0,0,0.3) -1px -2px; }
article#spiegel h2 { text-shadow: #700000 2px 2px 2px; }
article#spiegel h3 { text-shadow: #700000 1px 1px 2px; }
article#spiegel small { margin-bottom: 70px; }

article#blaetterrauschen h1 a { font-size: 80px; }
article#blaetterrauschen h2  { font-family: "Droid Serif"; font-weight: normal; }
article#blaetterrauschen h2 a { border-bottom: solid 1px; }
article#blaetterrauschen h3  { font-family: "Droid Serif"; font-weight: normal; font-size: 19px;  }
article#blaetterrauschen p  { font-family: arial; }

article#zeit h1 a { font-size: 80px; }
article#zeit h2  { font-family: "Droid Serif"; font-weight: normal; }
article#zeit h2 a { border-bottom: solid 1px; }
article#zeit h3  { font-family: "Droid Serif"; font-weight: normal; font-size: 19px;  }
article#zeit p  { font-family: arial; }

article#ia h1 { line-height: 1.0; margin-top: 75px; }
article#ia h1 a { font-size: 40px; }
article#ia h2  { font-family: "Droid Serif"; font-weight: normal; }
article#ia h2 a { border-bottom: solid 1px; }
article#ia h3  { font-family: "Droid Serif"; font-weight: normal; font-size: 19px;  }
article#ia p  { font-family: arial; }

article#space h1 { margin-top: 70px; }
article#space h1 a { font-size: 60px; }
article#space h2  { font-family: "Droid Serif"; font-weight: normal; }
article#space h2 a { border-bottom: solid 1px; }
article#space h3  { font-family: "Droid Serif"; font-weight: normal; font-size: 19px;  }
article#space p  { font-family: arial; }

article#iconwerk h1 { text-align: center; margin-bottom: 160px; margin-top: 90px; }
article#iconwerk h1 a { font-size: 120px; font-family: "Droid Serif"; font-style: italic; text-shadow: #eee 4px 4px 0px; border-bottom: none; line-height: 1.3; letter-spacing: -0.03em; }
article#iconwerk h1 em { font-size: 20px; font-weight: normal; font-family: "Droid Serif"; }
article#iconwerk h2 { width: 97%;  margin-top: -45px; font-size: 20px; font-family: "Droid Serif"; font-weight: normal; }
article#iconwerk h3 { font-family: "Droid Serif"; font-size: 20px; font-weight: normal; }
article#iconwerk p { font-family: Arial; }
article#iconwerk section { max-width: 650px; margin: 0 auto; }
article#iconwerk section section { width: 97%; }
article#iconwerk small { width: 97%; text-align: center; margin-top: 60px; }

article#ode p { font-family: Arial; }

article#vorsichtglas h1 em { font-family: "Droid Serif"; font-style: italic; display: block; margin-top: 110px; margin-bottom: -30px; }
article#vorsichtglas h1 { font-family: "Droid Serif"; font-weight: normal; text-align: center; font-size: 60px; }
article#vorsichtglas h2 { font-family: "Droid Serif"; font-weight: normal; font-size: 26px; }
article#vorsichtglas small { width: 97%; text-align: center; margin-bottom: 120px; margin-top: -10px; }
article#vorsichtglas img { margin-right: 3%; }

article#innovation h1 { margin-top: 80px; }
article#innovation small { margin-bottom: 90px; }

article#wissensaustausch h1 { margin-top: 80px; }
article#wissensaustausch h1, article#wissensaustausch h2, article#wissensaustausch h3 { text-shadow: #1b1b1b 1px 1px 2px; }
article#wissensaustausch { background-color: #222; color: #fff; text-shadow: #222 1px 1px 2px; }
article#wissensaustausch a { color: #fff; }
article#wissensaustausch small { width: 97%; margin-bottom: 2px; color: #666; }
article#wissensaustausch p { float: none; width: 97%; }
article#wissensaustausch section { max-width: 650px; margin: 0 auto; }
article#wissensaustausch section section { max-width: 650px; margin: 0 auto; float: none; width: 97%; }


article#nichtleser h2  { font-size: 22px;  font-family: "Droid Serif"; font-weight: normal; }
article#nichtleser h1  { font-family: "Droid Serif"; font-weight: normal;  font-size: 40px; line-height: 1.3; margin-top: 90px; margin-bottom: 90px; }
article#nichtleser h3 { margin-top: 60px; font-size: 22px; font-family: "Droid Serif"; font-weight: normal; }
article#nichtleser small  { margin-bottom: 85px; }
article#nichtleser img { width: 250px; margin-right: 20px; }
article#nichtleser p, article#nichtleser h3, article#nichtleser small { width: 97%; float: none; }
article#nichtleser section { max-width: 650px; margin: 0 auto; }
article#nichtleser section section { max-width: 650px; margin: 0 auto; float: none; width: 97%; }

article#weave {background-color: #1c1c1c; text-shadow: #111 1px 1px 2px;}
article#weave img {float: none;margin-top: 40px;}
article#weave header {color:#999;}

article#typoberlin img {float: none;margin-top: 60px;}

article#designrecht { background-color: #ddd; }
article#designrecht img { margin-top: 50px; margin-bottom: 70px; }
article#designrecht h1, article#designrecht h2, article#designrecht h3 { text-shadow: #ccc 2px 2px 2px; }
article#designrecht ol {font-family: "courier new";font-size: 14px; text-shadow: #ddd 2px 2px 0px;}

}

section section h2, section section h3, section section p, section section small {
display: block;
width: 100%;
}

header, footer {
font-size: 12px;
font-style: italic;
font-weight: normal;
display: block;
font-family: "Droid Serif", helvetica;
text-align: left;
clear: both;
word-spacing: 0.2em;
}

header a { text-decoration: none; border: none; }

footer {
padding-top: 40px;
}


small {
word-spacing: 0.2em;
font-size: 12px;
font-style: italic;
font-weight: normal;
display: block;
margin-bottom: 3em;
font-family: "Droid Serif", helvetica;
}

.navigation {
display: none;
}


menu {
-moz-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
background-color: #222;
position: fixed;
top: 3%;
right: 3%;
overflow: hidden;
width: 100px;
height: 26px;
font-size: 12px;
font-style: italic;
font-weight: normal;
text-shadow: #222 1px 1px 2px;
font-family: "Droid Serif", helvetica;
}

menu:hover {
height: auto;
}

menu a {
color: #eee;
-moz-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
display: block;
text-align: center;
padding: 0 9px;
line-height: 26px;
}

menu a:hover {
color: #fff;
background-color: #444;
}


p, li {
margin-bottom: 1.6em;
}

ol ol {
list-style-type: lower-latin;
}

ol ul {
margin-left: 60px;
margin-top: 24px;
}

a {
text-decoration: none;
color: #222;
}

a:focus {
outline: none;
opacity: 0.75;
}

p a, small a {
text-decoration: underline;
}


article p.teaser a {
text-decoration: none;
}

h1 {
margin-bottom: 80px;
margin-top: 40px;
line-height: 1.3;
font-family: "Droid Sans", Helvetica;
font-weight: bold;
width: 97%;
text-shadow: #eee 3px 3px 1px;
}

@media all and (min-width: 1px) {
h1 { font-size: 32px; }
h1 em { font-size: 22px; margin-bottom: 10px; font-style: normal; }
}




dialog {
display: block;
width: 97%;
margin-top: 1.5em;
margin-bottom: 1.8em;
border-bottom: solid 1px #eee;
}

dialog dt {
position: absolute;
padding-top: 0.5em;
font-weight: bold;
font-family: "Droid Sans";
font-size: 100%;
}

dialog dd {
border-top: solid 1px #eee;
padding-top: 0.3em;
margin-bottom: 0.4em;
padding-left: 12em;
}



@media all and (min-width: 700px) {

h1 { font-size: 52px; }
h1 em {font-size: 22px; }


nav {
font-family: "Droid Sans", Arial; 
}

nav a {
position: fixed;
background-color: #000;
color: #fff;
opacity: 0.05;
font-size: 135px;
line-height: 1.1;
text-shadow: none;
margin-right: 5px;
-moz-border-radius:80px;
-webkit-border-radius:80px;
border-radius:80px;
width: 150px;
height: 160px;
margin-top: -80px;
top: 50%;
right: 3%;
padding-left: 10px;
text-align: center;
}

nav a:first-child {
left: 3%;
padding-left: 2px;
padding-right: 8px;
}

nav a:hover {
border: none;
opacity: 0.88;
}

nav a:focus {
opacity: 0.3;
}



}


h2 {
text-shadow: #eee 2px 2px 1px;
margin-bottom: 30px;
line-height: 1.48;
font-family: "Droid Sans", Helvetica;
font-weight: bold;
margin-top: -3px;
clear: both;
width: 97%
}

@media all and (min-width: 1px) {
h2 { font-size: 22px; }
h2 a {border-bottom: solid 2px;}
}

@media all and (min-width: 700px) {
h2 { font-size: 22px; }
h2 a {border-bottom: solid 4px;}
}

h3 {
text-shadow: #eee 1px 1px 1px;
font-family: "Droid Sans", Helvetica;
font-size: 16px;
margin-bottom: 22px;
line-height: 1.48;
}

h3 a {border-bottom: solid 3px;}

a img {
border: none;
}

.darktextshadow {
text-shadow: #222 1px 1px 2px;
}

hr{clear:both;border:none;height:0;color:#fff;border-color:#fff;background-color:#fff;}

.thickbox {
cursor:url('http://static.designmadeingermany.de/zoom.ico'), pointer;	
cursor:-moz-zoom-in;
}


::-moz-selection {
background: #FFEA03;
text-shadow: #F7E505 1px 1px 1px;
color: #222;
}

::selection {
background: #FFEA03;
text-shadow: #F7E505 1px 1px 1px;
color: #222;
}


article#spiegel::-moz-selection {
background: #fff;
text-shadow: #222 1px 1px 1px;
color: #fff;
}

article#spiegel::selection {
background: #fff;
text-shadow: #222 1px 1px 1px;
color: #fff;
}

#TB_window {
	font: 12px  "Droid Sans", arial, sans-serif;
	color: #272727;
}


#TB_window a:link {color: #666666;}
#TB_window a:visited {color: #666666;}
#TB_window a# {color: #000;}
#TB_window a:active {color: #666666;}
#TB_window a:focus{color: #666666;}

#TB_overlay {
	position: fixed;
	z-index:300;
	top: 0px;
	left: 0px;
	height:100%;
	width:100%;
}

.TB_overlayMacFFBGHack {background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTM5jWRgMAAAAVdEVYdENyZWF0aW9uIFRpbWUANy8xNi8wN1qn/wsAAAAoSURBVEiJ7c1BAQAwCAAhtH+nVVsKf0cBBs+xvQ5KSkpKSkpKSkrAB1nRAPEf/J+FAAAAAElFTkSuQmCC) repeat;}
.TB_overlayBG {
	background-color:#000;
	filter:alpha(opacity=85);
	-moz-opacity: 0.85;
	opacity: 0.85;
}

* html #TB_overlay { /* ie6 hack */
     position: absolute;
}

#TB_window {
	position: fixed;
	z-index: 302;
	color:#272727;
	display:none;
	text-align:left;
	top:50%;
	left:50%;
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
}

img#TB_Image { max-width: 100%; }

* html #TB_window { /* ie6 hack */
position: absolute;
}

#TB_window img#TB_Image {
	display:block;
  margin-bottom: 500px;
}

#TB_caption{
	padding: 12px;
}

#TB_closeWindow{
	height:25px;
	padding:11px 25px 10px 0;
	float:right;
}

#TB_closeAjaxWindow{
	padding:7px 10px 5px 0;
	margin-bottom:1px;
	text-align:right;
	float:right;
}

#TB_ajaxWindowTitle{
	float:left;
	padding:7px 0 5px 10px;
	margin-bottom:1px;
}

#TB_title{
	background-color:#272727;
	height:27px;
}

#TB_ajaxContent{
	clear:both;
	padding:2px 15px 15px 15px;
	overflow:auto;
	text-align:left;
	line-height:1.4em;
}

#TB_ajaxContent.TB_modal{
	padding:15px;
}

#TB_ajaxContent p{
	padding:5px 0px 5px 0px;
}

#TB_load{
	position: fixed;
	display:none;
	height:12px;
	width:96px;
	z-index:903;
	top: 50%;
	left: 50%;
	margin: -6px 0 0 -48x;
	background: #fff url(http://static.designmadeingermany.de/lines.gif);
	-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
}


* html #TB_load { /* ie6 hack */
position: absolute;
}

#TB_HideSelect{
	z-index:99;
	position:fixed;
	top: 0;
	left: 0;
	background-color:#fff;
	border:none;
	-moz-opacity: 0;
	opacity: 0;
	height:100%;
	width:100%;
}

* html #TB_HideSelect { /* ie6 hack */
position: absolute;
}

#TB_iframeContent{
	clear:both;
	border:none;
	margin-bottom:-1px;
	margin-top:1px;
	_margin-bottom:1px;
}


#loader {
opacity: 0.85;
background-color: #000;
width: 96px;
padding: 9px 10px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
margin: 0 auto;
}

#loader img { display: block; margin-top: 0; }



@media all and (max-width: 800px) {

article#cover {background: #fff url(http://www.designmadeingermany.de/magazin/wp-content/themes/4/images/cover-ipad.png) no-repeat center 0px; }
article#cover h3 { margin-top: 850px; }

}

@media all and (max-width: 700px) {

article#cover { background-image: none; }

article#cover img { display: block; float: none; margin-right: 3%; }

article#cover h3 { margin-top: 0; }

article#inhalt h2 { font-family: Helvetica; font-size: 22px; line-height: 1.4; margin-bottom: 10px;  }
article#inhalt h2 a { border: none; }
article#inhalt p { font-weight: normal; font-size: 8px; margin-bottom: 30px;}
article#inhalt p small { font-weight: normal; display: inline; font-size: 8px; }

img, h1, h2, h3, h4, small, p, section {width: 97%; margin-right: 3%; }
section section { width: 97%; }
section section img { width: 97%; }

nav {font-size: 90px; margin-bottom: 30px; text-align: center; font-family: arial;}
nav a {padding: 0 53px; padding-bottom: 18px; float: left;}

article#infos, header, footer {display: none;}
article#einleitung img { width: 345px; max-width: 100%; float: none; }
small {font-size: 11px; font-style: normal;}
h1 em, h2, h3 {font-size: 18px;}
h1 {margin-top: 15px; margin-bottom: 30px;}
h2 {margin-top: 10px;}
.roundteaser { width: 187px; margin-right: 10px; margin-bottom: 10px;}
}



.roundteaser {
position: relative;
top: -10px;
left: -12px;
margin-right: 40px;
}