/* =========================================================
pinimenthol.de - Stylesheet für Pinimenthol
Datei: screen.css
Media: screen
Datum: 6. Juni 2008
Autor: Ulf Mayer
Mail: mayer@navigate.de
Web: http://navigate.de
========================================================== */

/* ===============================
   = General Definitions
=============================== */
*{
font-size: 1em; /* don't edit! */
}

html {
font-size: 62.51%; /* don't edit */
}

body {
	width: 100%;
	font-size: 1.2em; /* edit here to change font size globaly 1em = 10px */
	margin: 0;
	padding: 0;
	font-family: Arial, Verdana, sans-serif;
	background: #eaf4fd;
	color: #003583;
}

div {font-size: 1em;}

div#wBlockLeftInner div.elementPicture {
	line-height: 0;
}

address { font-style: normal; }
h1,h2,h3,h4,h5,h6,pre,code { font-size:1em; }
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input, dl, dt, dd { margin:0; padding:0 }
ul,ol { list-style:none }
:link,:visited { text-decoration:none }
dl {margin: 0 0 0 .8em;}
dl dt {margin: 0 0 .5em 0;}
dl dd+dt {margin-top: 1.5em;}
dl dd {margin: 0 0 1em 2em;}
ol {list-style: decimal;}
ol li {margin: 0 0 1em 2.5em;}
ol li ol {margin: 1em 0 1em 1em;}
ol li ul {margin: 1em 0 1em 1em;}
p {margin-bottom: 1em;}
ul {list-style: disc;}
ul li {margin: 0 0 1em 2em;}
ul li ul {margin: 1em 0 1em 1em; list-style: circle;}
ul li ol {margin: 1em 0 1em 1em;}

a img,:link img,:visited img { border:none }

.screenreader,
.hidden {
	display: none;
}
fieldset {
   border: none 0;
}
.clear {
	clear: both;
}

.screenreader {display: none;}

a {color: #003583; text-decoration: underline!important;}

/* ===============================
   = Container
=============================== */

body.smallWindow #horizon,
body.smallWindow div#wBlockMain {top: 0;}

#horizon {
	text-align: center;
	position: absolute;
	top: 50%;
	left: 0px;
	width: 100%;
	height: 1px;
	overflow: visible;
	visibility: visible;
	display: block;
}

div#wBlockMain {
	margin-left: -498px;
	position: absolute;
	top: -328px;
	left: 50%;
	visibility: visible;
	width: 996px;
	height: 655px;
	font-size: 1.0em;
	background: #fec500;
	text-align: left;
}

#startseite div#wBlockContent,
#startseite div#wBlockContentInner {margin: 0; width: auto; padding: 0; overflow: hidden;}

div#wBlockContent {position: relative; margin: 0 0 0 220px; height: 586px; overflow-y: auto;}
div#wBlockLeft {position: absolute; top: 31px; left: 0; height: 570px; width: 211px;}
div#wBlockLeft .elementLogo a {position: absolute; left: 17px; bottom: 0; display: block; width: 180px; height: 204px; background: url(/pinimenthol/wLayout/design/img/logos/pinimenthol.jpg) no-repeat;}
div#wBlockLeft #logo {display: none;}

.backgroundDiv {position: absolute; top: 33px; right: 0; z-index: 0; display: block;}

	.wBlockMainInner {margin: 4px; position: relative; padding: 33px 0 0 0;}
	#wBlockContentInner {margin: 30px 20px 20px 20px; /* width: 365px;*/ width: 340px;}


#blockCurNavigation  {display: none;}

.blockBottom {color: #fff; padding: 6px 10px 6px 10px; font-size: .9em; background: #003584; text-align: right;  position: absolute; bottom: 0; left: 0; width: 976px;  height: 24px; }
.blockBottom a {color: #fff; text-transform: uppercase; text-decoration: none!important; }
.blockBottom a img {height: 9px; margin: 0 0 -2px 0;}
.blockBottom a:hover {text-decoration: underline!important;}

.blockBottom .elementLink {margin: 5px 0 0 0;}
.blockBottom .elementLink a {padding: 0 0 0 8px; background: url(/pinimenthol/wLayout/design/img/nav/meta-trenner.gif) 2px 2px no-repeat;}
.blockBottom .elementLink a.nobg {background: none!important;}

#wBlockTop {padding: 33px 0 0 0;}

.elementSearch h3 {margin: 0;}
.elementSearch {position: relative; margin: 15px; padding-top: 20px; background: url(/pinimenthol/wLayout/design/img/suchen.gif) no-repeat;}
.elementSearch input {background: #fff9e4; border: 1px solid #003583; font: inherit; padding: 3px; width: 170px;}
.elementSearch button span,
.elementSearch .searchheadline span {display: none;}
.elementSearch button {border: 0; cursor: pointer; background: url(/pinimenthol/wLayout/design/img/search.gif) 0 0 no-repeat; position: absolute; top: 22px; right: 6px; width: 20px; height: 20px;}

.mobile {float: left; margin: 7px 20px 0 10px;}
#scroller-h {float: left; width: 452px; text-transform: uppercase; background: url(/pinimenthol/wLayout/design/img/footer/bg-ticker.gif) no-repeat; padding: 0px; color: #ca0000;}
#scroller-h div {margin: 3px 2px 5px 0; font-weight: bold;}
#scroller-h a {color: #ca0000;}

.documentLink {display: block; clear: both; margin: 0 0 5px 0;}
.documentLink div.text {padding-left: 20px;}
.documentLink div.text span.size {display: block; font-size: .9em;}
/* ===============================
   = Content-Elements
=============================== */

div.icon {display: inline; float: left; margin: 0 4px 0 0;}
.elementHeadline h2 {margin: 0 0 20px 0; font-size: 14px;}
.elementBackLink a {text-decoration: none!important; text-transform: uppercase; font-weight: bold; background: url(/pinimenthol/wLayout/design/img/back.gif) no-repeat; padding: 0 0 0 20px; display: block; margin: 20px 0 0 0;}
.elementText {clear: both; margin: 0 0 20px 0;}
.elementPicture {margin: 0 0 20px 0;}

.smallText,
.small {font-size: .9em;}

div#wBlockContent table {border-collapse: collapse; border-color: #003484;}
div#wBlockContent table td {vertical-align: top; padding: 3px;}

.searchResult {margin: 20px 0 0 0;}
.searchResult a,
.elememtListRow h3 a {text-decoration: none!important;}
.elementSpacer {margin: 0 0 20px 0;}
.searchNavi  {text-align: center; margin: 0 0 20px 0;}
.searchTerm {font-weight: bold;}

/* ===============================
   = Formulare
=============================== */

#wFormular {margin:20px 0 0 0;}

ol {position: relative;}

ol,
ol li {list-style: none; margin: 0; padding: 0;}
ol li {margin: 0 0 1em 0;}

button,
input,
textarea,
select {font:inherit;}

label {cursor: pointer; width: 170px; display: block; float: left;}
label.radio {width: auto; display: inline; float: none; margin: 0 15px 0 5px;}

li.C img {display: block; margin: 10px 0 10px 0;}

.wError {background: #FFEFEF; width: 325px; display: block; padding: 10px; color: #7F0707; font-weight: bold; border-top: 3px solid #7F0707; margin-bottom: 10px;}

input.C,
input.kontakt {width: 170px; padding: 2px;}
textarea.kontakt {width: 340px; height: 140px; padding: 2px;}

select {padding: 1px; width: 178px;}

#mandatory {
	font-size: .9em; color: #003484;
	/*margin: 30px 20px 20px 20px;*/
}

form#login label {width: 100px;}
.choose {position: relative; display: block;}
.choose label {width: auto!important; float: left; margin-right: 10px;}
input#doccheckLogin,
input#internLogin {float: left; border: 0; margin-right: 3px;}


form li.Anrede .listWrap {float:left;}
form li.Wie_haben_Sie_von_Pinimenthol_erfahren .listWrap {margin-bottom:5px;margin-top:5px;}
form li.Wie_haben_Sie_von_Pinimenthol_erfahren label {float: none; width: auto;}

.Zeitschriften label,
.Sonstiges label {display: none;}
#wFormular {position: relative;}
li.Zeitschriften {display: block;position: relative; margin: -73px 0 5px 170px;}
li.Sonstiges {display: block;position: relative; margin: 0 0 20px 170px;}

/* ===============================
   = Navigation
=============================== */

.elementNavigation {position: absolute; top: 0px; left: 0; z-index: 800; width: 996px; background: #003583; height: 31px; border-bottom: 2px solid #fff;}
	.elementNavigation ul {list-style: none; margin: 0; padding: 0; background: #fff;}
	.elementNavigation ul li {list-style: none; margin: 0; padding: 0;  display: inline;}
	.elementNavigation ul li a { background: #003583; color: #fff; font-weight: normal; padding: 0; margin: 0; display: block; height: 27px; float: left; text-decoration: none!important; line-height: 9px;}
	.elementNavigation ul li.selected a,
	.elementNavigation ul li a:hover {}
	.elementNavigation ul li ul {position: absolute; top: 110px; left: 0; border-top: 1px solid #fff;}
	.elementNavigation ul li ul li {display: block; position: relative;}
	.elementNavigation ul li ul li a {float: none;display: block; border-bottom: 1px solid #fff;  height: auto; /*height: 25px!important;*/  padding: 0;}
	.elementNavigation ul li ul li a.selected,
	.elementNavigation ul li ul li a:hover {background: #FFC700;}
	.elementNavigation ul li ul li ul {position: relative; top: 0; border-bottom: 1px solid #fff;}
	.elementNavigation ul li ul li ul li a {border: 0; height: auto;}
	.elementNavigation ul li.kontakt {}
/* ===============================
   = Vorschaltseite
=============================== */

#texttop {margin: 23px 28px 26px 50px;}
#apotheke {position: absolute; top: 90px; left: 0px; z-index: 200;}
#geeignet {position: absolute; top: 410px; right: 236px; z-index: 200;}
#erwachsene {position: absolute; top: 251px; left: 61px;}
#kinder {position: absolute; top: 240px; right: 20px;}
#logo {position: absolute; left: 412px; bottom: 57px;}

#startseite #erwachsene {position: absolute; top: 221px; left: 61px;}
#startseite #erwachsene {position: absolute; top: 221px; left: 61px;}
#startseite #kinder {position: absolute; top: 210px; right: 20px;}
#startseite #logo {position: absolute; left: 412px; bottom: 20px;}
#startseite #texttop {margin: 23px 140px 0 127px;}
#startseite #geeignet {position: absolute; top: 360px; right: 216px; z-index: 200;}

/* ===============================
   = Popup
=============================== */

body#popup {color: #003584;	background: #fff; margin: 0; padding: 0;}
body#popup #wrapper {padding: 0px; position: relative; width: 100%;}
body#popup h1 {background: #fec500; display: block; margin-bottom: 20px; font-size: 18px;}
body#popup #content {margin: 20px;}
h1#pflicht span { display: none;}
body#popup h1#pflicht {display: block; background: #fec500 url(/pinimenthol/wLayout/design/img/pflichtangaben-head.gif) 20px 9px no-repeat; height: 30px;}
sup {font-size: .95em; line-height: .5em;}

#home {position: absolute; top: -20px; left: 10px;}

.togglediv {margin: 0 0 20px 0;}

h3 {clear: both; margin: 10px 0 10px 0;}