/** CSS Datei für das die Internetseite der Firma SPO unter der URL: spo-kopafilm.de
 * @medientyp screen
 * @author Christian Asche for arsmedia - visit http://arsmedia-nidda.de
 * @copyright 2004
**/
html, body{
	height: 100%;
}
body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 80%;
	color: #000000;
	background-color: #FFFFFF;
	background: url(images/spo/bg.gif) repeat-y;
	padding:0;
	margin:0;
}
/* Klasse für Zweispaltigen Content */
/* @todo Hintergrund bearbeiten, Grauer Streifen Rechts fehlt noch */
body.twocols{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 80%;
	color: #000000;
	background-color: #FFFFFF;
	padding:0;
	margin:0;
	background:url(images/spo/bg_light.gif);
}
a:link {
	color:#56518B;
	text-decoration:none;
}
a:visited {
	color:#56518B;
	text-decoration:none;
}
a:hover {
	color:#B33A67;
	text-decoration:underline;
}
img {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	border:none;
}
h1{
	font-size:120%;
}
h2,h3,h4,h5,h6{
	font-size:100%;
}
ul{
	margin:10px 0 10px 15px;
	padding:0;
	list-style-type:square;
}
s{
    color: red;
}

/* Layout Elemente */
#teaser_img{
	position:absolute;
	top:0;
	left:0;
	z-index:5002;
	border-right:1px solid #FFF;
	border-bottom:1px solid #FFF;
}
#teaser_img p{margin:0;padding:0;}

/* Seiten Navigation Startseite, Übersicht, ...*/
#top_navi{
	height:20px;
	background-color:#FFF;
	padding:0;
	padding-top:32px;
	padding-left:190px;
}
#top_navi a:link,#top_navi a:visited{
	display:block;
	width:90px;
	float:left;
	text-align:right;
	background:url(images/spo/top-navi-bg.gif) right repeat-y;
	font-size:75%;
	color:#000;
	padding:3px;
	text-decoration:none;
}
#top_navi a.startseite:hover{
	background-color:#A8A8C4;
	color:#FFF;
}
#top_navi a.uebersicht:hover{
	background-color:#7773A6;
	color:#FFF;
}
#top_navi a.kontakt:hover{
	background-color:#56518B;
	color:#FFF;
}

/* Haupt Navigation Unternehmen, Produkte, ... */
#main_navi{
	position:absolute;
	top:118px;
	left:0;
	width:100%;
	background:url(images/spo/folien-bg.gif) repeat-x top left;
	background-color:#2E286E;
	height:40px;
	padding-top:1px;
	border-bottom:1px solid #FFF;
	z-index:500;
}

/* main_navi submenue */
ul.dropdown{    list-style: none;   margin:0;    padding:0;    width:676px; margin-left:191px; font-size:75%;}
ul.dropdown ul{ list-style: none;   margin:0;    padding: 0;	width:150px; background:url(images/spo/main_navi-bg-passiv.png) bottom repeat-y;}
ul.dropdown li{	float:left; position: relative;	padding:0px 0px 0px 0px;}
ul.dropdown ul li{clear:both;margin:0;}
ul.dropdown a, ul.dropdown a:visited{	display:block;color:#000;border-bottom:1px solid #A8A8C4;}
ul.dropdown ul li a{width:140px;display:block; margin:0;padding:5px;}
ul.dropdown ul li a:hover{color:#FFF;font-weight:normal;background-color:#56518B;text-decoration:none;}
ul.dropdown ul, ul.dropdown ul ul, ul.dropdown ul ul ul{display:none;position:absolute;top:39px;left:0%;}
ul.dropdown li:hover ul ul, ul.dropdown li:hover ul ul ul{display:none;}
ul.dropdown li:hover ul, ul.dropdown ul li:hover ul, ul.dropdown ul ul li:hover ul{display:block;}

/* Subnavi in der main_navi */
a .subsub{			color:#56518B;	}
a:hover .subsub{	color:#FFF;		}

/*
.spo_A8A8C4{color:#A8A8C4;}
.spo_7773A6{color:#7773A6;}
.spo_56518B{color:#56518B;}
.spo_2E286E{color:#2E286E;}
.spo_DAD8E3{color:#DAD8E3;}
*/

/* folienstreifen */
#folien{
	position: absolute;
	top:50px;
	left:0px;
	width:100%;
	background-color:#56518B;
}
#folien h1{
	margin:0;
	padding:0;
	display:inline;
}
#folien span{
	display:none;
}


img.left190{
	margin-left:191px;
}

/* toolbar mit suche usw */
#toolbar{
	height:50px;
	width:100%;
	position:absolute;
	top:160px;
	left:0;
	background:url(images/spo/toolbar-bg.gif) repeat-x bottom left;
	background-color:#A8A8C4;
	font-size:75%;
}
#toolbar a{
	text-decoration:none;
	color:#000;
}
#toolbar form{
	display:inline;
	float:left;
	margin:0;
	padding:5px 3px 3px 3px;
	text-align:right;
	width:188px;
	line-height:240%;
}
#toolbar input{
	width:100px;
	font-size:1em;
}


/* Hauptinhalt */
#content{
	position:absolute;
	top:210px;
	left:192px;
	width:455px; /* 380px */
	padding:13px;
	padding-top:35px;
}
/* Zweispaltiger Hauptcontent */
#content_2cols{
	position:absolute;
	top:210px;
	left:0px;
	width:548px; /* 380px */
	padding:13px;
	padding-top:35px;
}

/* Kopafilm */
#kopafilm-logo{
	position:absolute;
	top:0px;
	left:768px;
}

/* sidebar - streifen rechts, Downloads, Informationen, usw */
#sidebar{
	position:absolute;
	top:160px;
	left:672px;
	width:192px; /* 192px */
	height:55px;
	padding:0px;
	font-size:75%;
	background-color:#DAD8E3;
	background:url(images/spo/sidebar-bg.gif) repeat-y;
}
#sidebar a{
	text-decoration:none;
	width:50%;
	display:block;
	float:left;
	text-align:center;
}

/* english */
#english{
	position:absolute;
	top:215px;
	left:672px;
	width:192px; /* 192px */
	height:24px;
	padding:0px;
	font-size:75%;
	text-align:center;
	background-color:#DAD8E3;
	background:url(images/spo/sidebar-bg.gif) bottom repeat-y;
}
#english a{
	text-decoration:none;
	color:#000;
}
#english a:hover{
	color:#B33A67;
}

/* Kontext-Sensitiver-Bereich - Informationen, Kontakt, ... */
#kontext{
	position:absolute;
	top:265px;
	left:672px;
	width:192px; /* 192 */
	z-index:100;
	font-size:75%;
	line-height:150%;
}
#kontext #infos{padding:3px 18px 36px 18px;}
#kontext a {
	text-decoration:none;
	color:#000;
}
#kontext a:hover{
	color:#B33A67;
}

/* Seite drucken Button */
#printscreen{
	position:absolute;
	top:192px;
	left:562px;
	font-size:75%;
}
#printscreen a {
	text-decoration:none;
	color:#000;
}
#printscreen a:hover{
	color:#B33A67;
}

/* Subnavi in den Produkten, Streifen links mit Bild */
#subnavi{
	position:absolute;
	top:210px;
	left:0;
	width:191px;
	background:#DAD8E3;
}
#subnavi strong{
	display:block;
	padding:10px 18px 0px 18px;
	width:155px;
	min-height:30px;
	background-color:#DAD8E3;
	text-decoration:none;
	color:#000;
	font-size:75%;
}
#subnavi a{
	display:block;
	padding:4px 31px 4px 5px;
	border-bottom:	1px #A8A8C4 solid;
	width:155px;
/*	min-height:18px;*/
	background-color:#DAD8E3;
	text-decoration:none;
	color:#000;
	font-size:75%;
}
#subnavi a:hover{
	color:#FFF;
	background-color:#56518B;
	font-weight:normal;
}
#subnavi .activeElement {
	background-color:#56518B;
	color:#FFF;
}

/* */
#impressum{
	background:url(images/spo/impressum-bg.gif) repeat-x;
	height:20px;
	padding:3px 18px 0px 18px;
	margin:0 1px 0 1px;
}

/* print daten */
#printheader{ display:none;}

/* userklassen */
.spo_A8A8C4{color:#A8A8C4;}
.spo_7773A6{color:#7773A6;}
.spo_56518B{color:#56518B;}
.spo_2E286E{color:#2E286E;}
.spo_DAD8E3{color:#DAD8E3;}

.kopa_2E286E{color:#2E286E;}
.kopa_A8A8C4{color:#A8A8C4;}
.kopa_333367{color:#333367;}
.kopa_F5F6F1{color:#F5F6F1;}

/* */
.tcms_editable{
	border: 1px dotted #F99;
}
.tcms_label{
	background-color:#FCC;
	font-size:10px;
	color:#000;
	font-weight:bold;
}
.tcmsmodul{
	border: 1px outset #CCF;
	margin:5px;
}
.tcms_modul_label{
	background-color:#CCF;
	font-size:10px;
	color:#000;
	font-weight:bold;
}

/* from stuff */
form{line-height:140%;}
textarea{ width:180px;font-family: Verdana, Arial, Helvetica, sans-serif;font-size:80%; }
label,select{ cursor:pointer;}
label.left{ float:left; width:150px; text-align:right;margin-right:10px; }
input{width:180px;font-size:75%;}
input[type=image]{width:auto;}
input.right{ margin-left:113px; }
html>body input.right{ margin-left:110px; }
form br{ clear:both; }
.ok{color:#0C0;}
.error{color:#C00;}
.small{font-size:70%;color:#999;}

/* ### countryInfo - Div Container für die Länderanzeige ###*/
div.countryInfo {
	font-size:75%;
	display:none;
	padding:0px 5px 0px 10px;
}
.countryInfo span{
	display:block;
	border:1px solid #0C0;
}
#subnavi select {
	margin-top:10px;
	margin-left:10px;
	border:1px black solid;
	font-size:10px;
	width:90%;
}
#subnavi #defaultText {
	font-size:10px;
	padding:5px;
}
#subnavi div.countryInfo  a{
	font-size:100%;
	width:auto;
	min-height:auto;
	padding:3px 0px 3px 0px;
}
/* ### /countryInfo ###*/

/* News Modul */
.tcms_news_item{
	margin:25px 0 0px 0;
}

/* Tabellen */
table{
	margin:10px 0 0 0;
	border:1px solid #7773A6;
	width:100%;
}
th{
	font-size:100%;
	text-align:left;
	font-weight:normal;
	color:#FFF;
	background-color:#56518B;
}
td{
	margin:0;
}
.secondrow td{
	background-color:#A8A8C4;
}
fieldset{
	width: 96%;
	margin: -1px;
	padding: 5px;
	line-height: 130%;
	margin: 5px 0;
}
fieldset legend{
	margin-left: 0;
}
fieldset p{
	margin: 5px 0;
}
p.error{
	line-height: 100%;
}

/*
#A8A8C4
#7773A6
#56518B
#2E286E
#DAD8E3
*/

.icon{
	width: 16px;
}

/* Warenkorb- und Login-Widget ******************************* */
.rbox{
	color: #FFF; /* #DAD8E3; */
	font-size: 1em;
	background: url(images/spo/sidebar-bg-widget.gif) repeat-y;
}
.rbox h2{
	margin: 0;
	padding: 7px 3px 3px 30px;
}
.rbox input, .rbox form, .rbox p{
	margin: 0;
	padding: 0;
	font-size: 1em;
}
.rbox p.input{
	padding: 0 3px 0 30px;
}
.rbox p.buttons a{
	color: #FFF !important;
}
.rbox p.buttons input{
	border: 0;
	background: none;
	color: #FFF;
	cursor: pointer;
	padding: 0;
}
.rbox p.buttons{
	padding: 3px 3px 3px 16px;
}
.rbox img.stoerer{
	position: relative;
	margin-left: -25px;
	margin-top: -15px;
	float: left;
}
.rbox input#kunde_abmelden{
	visibility: hidden;
	position: absolute;
	left: -1000px;
	top: -1000px;
}
.rbox p.hervorgehoben{
	background: #9A6E8C;
	margin: 1px 1px 5px 1px;
	padding: 0 30px;
}
.rbox input{
	width: auto;
}

/* Registrier-Formular *************************************** */
form#registrieren input, form#registrieren textarea{
	width: 271px;
	background: #DAD8E3;
	border-style: none;
	border: 1px solid #8D3859;
	margin: 0 !important;
	font-size: 100%;
}
form#registrieren textarea{
	width: 251px;
	height: 60px;
}
form#registrieren label{
	line-height: normal;
}
form#registrieren fieldset input{
	width: 251px;
}
form#registrieren input[type=submit]{
	background: #D4D0C8;
	border-style: outset;
	margin-top: 10px !important;
	margin-left: 6px !important;
	width: 254px;
}

/* Artikel-Tabellen ****************************************** */
table.artikelliste{
	border: 1px solid #8D3859;
	padding: 0;
	margin: 0;
	margin-top: 31px;
	font-size: 0.9em;
}
h3.artikelliste{
	color: #8D3859;
	margin: 8px 0;
}
table.artikelliste th{
	background: #8D3859;
	padding: 2px;
}
table.artikelliste td{
	padding: 2px;
}
table.artikelliste a.info{
	color:#56518B;
}
tr.brauneproduktzeile{
/*	background: #C6A6A7; */
	background: #F3EDED;
}
tr.brauneproduktzeile td{
	border-top: 1px solid #8D3859;
	border-bottom: 1px solid #8D3859;
}
tr.weisseproduktzeile{
	background: #FFF;
}
tr.brauneproduktzeile:hover, tr.weisseproduktzeile:hover{
}
table.artikelliste .rechtsbuendig{
	text-align: right;
}
table.artikelliste th img.stoerer{
	position: relative;
	margin-right: -13px;
	margin-top: -35px;
}
td.warenkorbsymbol, td.infosymbol, td.ampelfunktion{
	text-align: center;
	width: 30px;
}
.detailsproduktzeilemarkiert td{
	border-top: 5px solid #8D3859;
	border-bottom: 5px solid #8D3859;
	background: #DAD8E3;
}
.detailsproduktzeilemarkiert .teaser{
	font-style: italic;
}

/* Warenkorb ************************************************* */
form#warenkorb input, form#warenkorb textarea{
	width: 200px;
	background: #DAD8E3;
	border-style: none;
	border: 1px solid #8D3859;
	margin: 0 !important;
	font-size: 100%;
}
form#warenkorb input[type=submit]{
	background: #D4D0C8;
	border-style: outset;
	margin-top: 10px !important;
	margin-left: 6px !important;
	width: 180px;
}
table#warenkorb{
	border: 1px solid #8D3859;
	padding: 0;
	margin: 5px 0;
	font-size: 0.9em;
}
table#warenkorb th, table#warenkorb td{
	line-height: 100%;
}
table#warenkorb th{
	background: #8D3859;
	padding: 2px;
}
table#warenkorb td{
	padding: 2px;
	border-bottom: 1px solid #8D3859;
	vertical-align: top;
}
table#warenkorb .rechtsbuendig{
	text-align: right;
}
table#warenkorb th img.stoerer{
	position: relative;
	margin-right: -13px;
	margin-top: -35px;
}
table#warenkorb input.anzahlinput{
	width: 30px;
}
table#warenkorb .resulttext{
	background: #C6A6A7;
}
table#warenkorb .resultwert{
	border-left: 1px solid #8D3859;
	text-align: right;
}
table#warenkorb .resultgesamt{
	text-align: right;
}
div#kundendaten fieldset{
	padding: 5px;
}

p#warenkorbstatus{
	font-size: 0.9em;
}
p#warenkorbstatus strong{
	color: #8D3859;
}
div#kundendaten{
	line-height: 105%;
}
fieldset#bemerkungen textarea{
	width: 98%;
	height: 100px;
}
input[type=radio]{
	width: auto;
}
input[type=checkbox]{
	width: auto;
}
div#kundendaten label{
	width: 150px;
	display: block;
	float: left;
}
#warenkorbstatus{
	background: #8D3859;
	padding: 2px;
}
#warenkorbstatus strong.step{
	background: #9A6E8C;
	padding: 2px;
	color: #FFF !important;
}
#warenkorbstatus strong.stepactive{
	padding: 2px;
	background: #2E286E;
	color: #FFF !important;
}
#warenkorbstatus strong.steptext{
	padding: 2px 10px 2px 2px;
	background: #8D3859;
	color: #FFF !important;
}
input#refreshAnzahl{
	width: 16px;
}
input.radiobutton{
	width: 30px;
}

.radio .radiolabel{
	float: none !important;
	display: inline !important;
}

/* ------------------------- Feedback ------------------------ */
#feedback {
	list-style-type:none;
	margin:5px 0 5px 0;
	padding:0px;
}
#feedback li {
	padding:5px 0 5px 25px;
	background-color:#EFEFEF;
	border:1px #A5AEAD solid;
	margin-left: 0;
	font-weight: bold;
}
#feedback .notice {
	color:green;
	background:#EFEFEF url(/images/system/tcms/Y.png) no-repeat center left;
}
#feedback .warning {
	color:#FF9900;
}
#feedback a{
	text-decoration: underline;
}
#feedback .warning a {
	color:#FF9900;
}
#feedback .warning a:hover {
	color:#B33A67;
}
#feedback .notice a {
	color:green;
}
#feedback .notice a:hover {
	color:#B33A67;
}
#feedback .error a {
	color:red;
}
#feedback .error a:hover {
	color:#B33A67;
}
#feedback .error {
	color:red;
	background:#EFEFEF url(/images/system/tcms/N.png) no-repeat center left;
}

/* ------------------------ FiBu Freigabe --------------------- */
form#fibu{
	line-height: 100%;
}
form#fibu input[type=submit]{
	margin-left: 110px;
	margin-top: 10px;
}

/* ------------------------ Passwort vergessen ---------------- */
form#lostPw{
	line-height: 100%;
}
form#lostPw label{
	width: 140px;
}
form#lostPw input[type=submit]{
	margin-left: 150px;
	margin-top: 10px;
}