/*
================================================
Typo 3 Master CSS
Version: 1.0
Letze Änderung: 26.05.2008 (Andrea Zbinden)

28. April 2008
Michel: Überall Kurzschreibweisen eingesetzt (#fff anstatt #fffff usw.), plus diverse kommentierte änderungen
29. Mai 2008
Michel: 0px = 0, diverse kleinere Sachen

================================================

Index
------------------------------------------------
Grundeinstellungen
- Univeral Selektor
- HTML-Tags
- Wrapper-DIV

Head Bereich

- Logo
- Sprachnavigation

Navigation
- Hauptnavigation
- Subnavigation

Content-Bereich
- Formatierungen speziell für Contentbereich

Sidebar
- Formatierungen speziell für Sidebar

Footer
- Formatierungen speziell für Footer

Typo3 Erweiterungen
- tt_news
- mailformplus
- ...
------------------------------------------------
*/


/*
==================
Grundeinstellungen
==================
*/

/* Universal Selektor */
* {
	margin: 0px;
	padding: 0px;
	border: 0px;  /* besser wenn border auch gleich reseted wird (Michel) */
}

/* Scrollbalken für IE8 und Firefox erzwingen */
html{
min-height: 101%;


}

/* HTML-Tags */

body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
/*color: #ddd;*/
color: #5E5E5E;
background-color: #000000;



}

img {

}
	
/*Titel*/
h1 {
font-family: "Times New Roman", Times, serif;
font-weight: lighter;
font-size: 22px;
padding-bottom: 10px;
color: #FFFFFF;
	
}

.seite8 #title {
display: none;	
}



h2 {
font-size: 11px;
font-weight: bold;
color: #FFFFFF;
	
}

h3 {
	
}

/*Generelle Links*/

a:link {color: #ff0000; text-decoration: underline; background-repeat: no-repeat;}
a:visited {color: #ff0000; text-decoration: underline;}
a:hover {color: #ff0000; text-decoration: none; }
a:active {color: #ff0000;text-decoration: underline;}


#content a:link {padding-left: 14px; background-image: url(../bilder-design/pfeil.gif); background-repeat: no-repeat;}
#content a:visited {padding-left: 14px; background-image: url(../bilder-design/pfeil.gif); background-repeat: no-repeat;}
#content a:hover {padding-left: 14px; background-image: url(../bilder-design/pfeil.gif); background-repeat: no-repeat; text-decoration: none;}
#content a:active {padding-left: 14px; background-image: url(../bilder-design/pfeil.gif); background-repeat: no-repeat;}


/*Wrapper DIV*/
#wrapper {
margin: 0 auto; /* 0 hinzugefügt, weil in vertical ist auto allein nicht sauber möglich (michel) */
width: 780px; /*Breite Angeben*/

}
	
/*
==================
Head Bereich 
==================
*/

#header{

}


#logo {
text-align: center;
height: 55px;
padding: 8px 0px 0px 0px;

}

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

#mainnav li{
font-family: "Times New Roman", Times, serif;
font-size: 13px;
font-weight: bold;
list-style-image:none;
list-style-type:none;
margin: 0px;
padding: 0px;
float: left;
}

/*HAUPTNAVIGATION Links*/

#mainnav a {  color: #fff; padding: 0px;  margin: 0px 1px 0px 0px ; display: block; text-decoration:none; background: url(../bilder-design/mainnav-bg-a.jpg) no-repeat left top;}
#mainnav li a:link  { color: #fff; }
#mainnav li a:visited { color: #fff; }
#mainnav li a:hover  { color: #000; background-image: url(../bilder-design/mainnav-bg-a-hover.jpg); background-repeat: no-repeat;}
#mainnav li a:active { color: #000; background-image: url(../bilder-design/mainnav-bg-a-hover.jpg); background-repeat: no-repeat; }
/*aktiver Hauptnavigationslink -> in typo3 wird die Klasse "aktiv" definiert*/
#mainnav li.aktiv a { color: #000!important; background-image: url(../bilder-design/mainnav-bg-a-hover.jpg); background-repeat: no-repeat; }


/*Hintergrund runde Ecken*/
#mainnav a span{ display: block; text-decoration:none; padding: 1px 9px 2px 9px;  margin: 0px;
background: url(../bilder-design/mainnav-bg-rechts-a.jpg) no-repeat right top;}
#mainnav li a:hover span  {  background-image: url(../bilder-design/mainnav-bg-rechts-hover.jpg);}
#mainnav .aktiv span  {  background-image: url(../bilder-design/mainnav-bg-rechts-hover.jpg);}

#subnav{
float: left;
font-size: 11px;
border-bottom:1px solid #000;
width: 780px;
height: 18px;
background-color:#fff;
color:#e40022;
margin:0;
padding: 3px 0px 0px 0px;


}

#subnav li{
list-style-image:none;
list-style-type:none;
padding: 0px;
margin: 1px 0px 0px 0px;
float: left;

}

/*SUBNAVIGATION Links*/
#subnav a {  padding: 0px 6px 4px 15px;  margin: 0px 2px 0px 0px ; display: block;text-decoration:none; background-image: url(../bilder-design/subnav-bg-a.gif); background-repeat: no-repeat;}
#subnav li a:link  { color: #e40022; }
#subnav li a:visited { color: #e40022; }
#subnav li a:hover  { color: #000;  background-image: url(../bilder-design/subnav-bg-a-hover.gif); background-repeat: no-repeat;}
#subnav li a:active { color: #000;  background-image: url(../bilder-design/subnav-bg-a-hover.gif); background-repeat: no-repeat; }
/*aktiver Hauptnavigationslink -> in typo3 wird die Klasse "aktiv" definiert*/
#subnav li.subnavaktiv a {color: #000!important;  background-image: url(../bilder-design/subnav-bg-a-hover.gif); background-repeat: no-repeat; }

/*
==================
Metanav
==================
*/


#metanavigation  {
float: right;
text-transform: uppercase;
width: 216px;
height: 18px;
}


/*Sprachnavigation*/
#lang  {
float: left;
margin-top: -4px;
padding: 0px 0px 0px 18px;

}

/*Sprachauswahl*/
.langicons {
display: none;	
}

.langicons, #ThickBoxLangChDe, #ThickBoxLangDeDe, #ThickBoxLangEn, #ThickBoxLangChFr{
	cursor: pointer;
}

#lang  li{
list-style-image:none;
list-style-type:none;
border-bottom:1px solid #000;
margin: 0px;
padding: 0px;
float: left;

}

#lang a { margin-top: 2px; display: block; /*ganze Fläche anklickbar machen*/ text-decoration:none; }
#lang li a:link  { color: #e40022; }
#lang li a:visited { color: #e40022; }
#lang li a:hover  { color: #e40022; text-decoration:underline;}
#lang li a:active { color: #e40022; }

/*aktiver Hauptnavigationslink -> in typo3 wird die Klasse "aktiv" definiert*/
#lang li.aktiv a { color: #e40022; text-decoration: none; }


#metanav  {
margin: 0px;
padding: 2px 0px 0px 0px;
float: right;

}

#metanav li{
font-family: "Times New Roman", Times, serif;
font-size: 10px;
font-weight: bold;
list-style-image:none;
list-style-type:none;
margin: 0px;
padding: 0px;
float: left;

}

#metanav a { padding: 0px 0px 0px 8px; display: block; /*ganze Fläche anklickbar machen*/ text-decoration:none; }
#metanav li a:link  { color: #e40022;}
#metanav li a:visited { color: #e40022; }
#metanav li a:hover  { color: #fff; }
#metanav li a:active { color: #fff; }
/*aktiver Hauptnavigationslink -> in typo3 wird die Klasse "aktiv" definiert*/
#metanav li.aktiv a { color: #fff;  }

/*
==================
Content-Bereich
==================
*/

#content {
padding: 27px 0px 10px 0px;
min-height: 250px;
line-height: 1.5em;

}

sup {
line-height:1em;
}


div.csc-textpic-imagewrap{
padding-bottom: 10px;

}

#content ul {
list-style-image:none;
list-style-position:outside;
list-style-type:disc;
margin-left:20px;
vertical-align:top;

}

#title {
padding-bottom: 20px;
}

#column-1 {
width: 242px;
float: left;
padding: 0px 27px 0px 0px;


}

#column-2 {
width: 242px;
float: left;
padding: 0px 27px 0px 0px;


}



/*Produktionsprozesse Käse*/

.seite39 #column-2 {
width: 484px;
float: left;
padding: 0px 27px 0px 0px;

}

/*
.seite39 h1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: normal;
font-weight: bold;
color: #FFFFFF;

}

.seite39 #title h1 {
font-weight: normal;
font-size: 22px;
padding-bottom: 10px;
color: #FFFFFF;

}

*/


.seite39 .csc-textpic-intext-left{
padding-bottom: 50px;

}

.seite39 .csc-textpic-intext-left-nowrap{
height: 180px;

}

#column-3 {
width: 242px;
float: left;

}

.seite22 .csc-frame-frame1 {
height: 250px;	
}

.seite22 .csc-frame-frame2 {
height: 220px;	
}

/*Sortenorganisation*/
#chde .seite51 #column-1 {
width:262px;
padding-right:7px;
}
/*
==================
Footer-Bereich
==================
*/	

#footer {
clear: both;
padding: 60px 0px;
color: #4f4f4f!important;
text-align: center;
font-size: 10px;

}

#footer a:link { color: #4f4f4f!important; text-decoration: none; padding-left: 14px; margin-left: 8px!important; background-image: url(../bilder-design/pfeil.gif)!important; background-repeat: no-repeat;}
#footer a:visited {color: #4f4f4f!important; text-decoration: none; padding-left: 14px; margin-left: 8px!important; background-image: url(../bilder-design/pfeil.gif)!important; background-repeat: no-repeat;}
#footer a:hover {color: #4f4f4f!important; text-decoration: none; padding-left: 14px; margin-left: 8px!important; background-image: url(../bilder-design/pfeil.gif)!important; background-repeat: no-repeat; }
#footer a:active {color: #4f4f4f!important; text-decoration: none; padding-left: 14px; margin-left: 8px!important; background-image: url(../bilder-design/pfeil.gif)!important; background-repeat: no-repeat;}

		


/*
===================
Typo3 Erweiterungen
===================
*/	

/*tt_news*/

.news-latest-date {
color: #8da25e;

}

.news-latest-item {
margin-bottom: 10px;
padding-bottom:10px;
border-bottom: 1px solid #8da25e;

}

.news-single-img {
margin-top: 10px;

}


/*Formulare*/
legend {
font-weight: bold;
color: #000000;
padding: 2px 0px 2px 0px;

}

fieldset {
border: 1px solid #000; /*Farben anpassen*/
display: block;

}

label {
width: 80px; /*Breiten anpassen*/
float: left;
}

input {
border: 1px solid #000; /*Farben anpassen*/
margin-bottom: 10px;

}

textarea {
border: 1px solid #000; /*Farben anpassen*/
}

.absendeknopf {
border: 1px solid #000;
font-weight: bold;
background-color: #000;
color: #FF0000;
margin: 10px 0px 10px 80px;
/*optional*/
float: left;
background-image:url(../bilder-design/pfeil.gif);
background-repeat: no-repeat;
padding-left:10px;

}

.fehlertext {
color: #fff;
font-weight: bold;
background-color: #ED2122;
padding: 2px;
border: 1px solid #ED2122;
width: 375px;

}

.formfehler {
border: 1px solid #f00;
margin-bottom: 5px;

}

/*optional*/
.pflichtfelder {
margin: 12px 0 0 170px;

}

.contenttable{
margin-left: -3px;

}


.bodytext {
/*float: left;*/
margin: 0;
padding: 0;

}


a.download img{
margin-bottom: -3px;

}


#map {
float: left;
width: 513px; 
height: 300px; 
margin: 0px;
color:#000;

}

#map a:link { background-image: none!important; }
#map a:visited {background-image: none!important;}
#map a:hover {background-image: none!important; }
#map a:active {background-image: none!important;}


.seite13 #map {
float: left;
width: 513px;  
height: 300px; 
margin: 0px;
color:#000;

}




/*
=======================
ThickBox Sprachauswahl
=======================
*/	

#TB_window {
background: #000 !important;
color: #FFF !important;
}
#TB_title {
display: none !important;	
}

#sprachauswahl-thickbox {
display: none;

}

#TB_window ul {
list-style-type: none;
}

#TB_window .laenderauswahl li, #TB_window li img, #TB_window li a {
float: left;
margin: 0px 10px 0px 0px;
font-size: 11px;
}

#TB_window .laenderauswahl li {
width: 132px;	
}

#TB_window li a {
clear: left;
color: #FFF !important;
text-decoration: none !important;
margin: 5px 0px 0px 0px;
}

.laenderauswahl a.country, .laenderauswahl a:link .country, .laenderauswahl a:visited .country, .laenderauswahl a:hover .country, .laenderauswahl a:active .country  {
	padding-left: 12px; 
	background-image: url(../bilder-design/pfeil.gif); 
	background-repeat: no-repeat;
	background-position: -3px 2px;
	width: 140px;
	}


.auswahl {
font-weight: bold;
padding: 10px 0px;
}

.laenderauswahl{
padding-bottom: 20px;
}

/*
========================================================
ThickBox Presse und Kontakt / WETTBEWERB
========================================================
*/		

div#wrapper.seite27, div#wrapper.seite23, div#wrapper.seite26, div#wrapper.seite54, div#wrapper.seite80, div#wrapper.seite81, div#wrapper.seite93, div#wrapper.seite97 {
	width: auto;	
	padding: 0px 10px;
}
/*.seite27 #title, .seite60 #title, .seite23 #title, .seite54 #title{
	float:left;
	width:500px;
}*/
.seite27 #schliessen, .seite60 #schliessen, .seite23 #schliessen, .seite54 #schliessen, .seite80 #schliessen, .seite81 #schliessen, .seite93 #schliessen{
	position:relative;
	right:20px;
	top:-60px;
	width:auto;
	text-align:right;
}



/* Teilnahmebedingungen */

.seite97 #schliessen{
	position:relative;
	right:20px;
	top:-40px;
	width:auto;
	text-align:right;

}



.seite27 #content, .seite23 #content, .seite26 #content, .seite80 #content, .seite81 #content, .seite93 #content, .seite97 #content{
	min-height: 100%;
}

.seite27 #column-1, .seite23 #column-1, .seite26 #column-1, .seite80 #column-1, .seite93 #column-1, .seite94 #column-1, .seite97 #column-1, .seite99 #column-1{
	width: auto;	
	color: #FFF;
}

/* Wettbewerbsweiche */
.seite81 #title, .seite93 #title, .seite97 #title{
	padding-bottom:0px;
	
}
.seite81 #title h1, .seite81 #title h1{
	margin-left: 63px;	
	margin-bottom: -21px;
}






/*
============================
Flashfilme
============================
*/	

#flash-column-1{
width: 242px;
padding: 0px 27px 0px 0px;
float: left;

}

#flashnav li{
list-style-image:none;
list-style-type:none;

}

#flashnav li.aktiv a { color: #fff!important; text-decoration: none; }

/*Wettbewerb*/

.seite79 label, .seite82 label, .seite86 label, .seite88 label, .seite94 label, .seite99 label {
width: 180px; /*Breiten anpassen*/
float: left;
clear: both;
margin: 2px;
}


.labelsmall {
width: auto!important;
}

.label-550px {
width: 550px!important;
}

.seite79 input, .seite82 input, .seite86 input, .seite88 input, .seite94 input, .seite99 input  {
border: 1px solid #000; /*Farben anpassen*/
margin: 2px;
}

.seite79 .absendeknopf, .seite82 .absendeknopf, .seite86 .absendeknopf, .seite88 .absendeknopf, .seite94 .absendeknopf, .seite99 .absendeknopf {
border: 1px solid #000;
font-weight: bold;
background-color: #000;
color: #FF0000;
margin: 10px 0px 10px 0px;
/*optional*/
float: left;
background-image:url(../bilder-design/pfeil.gif);
background-repeat: no-repeat;
padding-left:10px;
}

.linkauswahl {
	margin-left: 20px;
}


/*Wettbewerb allgemein, Input Felder Breite*/

.seite79 #vorname, .seite82 #vorname, .seite94 #vorname, .seite99 #vorname, .seite79 #strasse, .seite82 #strasse, .seite94 #strasse, .seite99 #strasse, .seite79 #plz, .seite82 #plz, .seite94 #plz, .seite99 #plz, .seite79 #email, .seite82 #email, .seite94 #email, .seite99 #email, .seite82 #marktname, .seite94 #marktname, .seite99 #marktname, .seite86 #vorname, .seite86 #strasse, .seite86 #plz, .seite86 #email, .seite86 #marktname, .seite88 #vorname, .seite88 #strasse, .seite88 #plz, .seite88 #email, .seite88 #marktname, .seite94 #marktname, .seite99 #marktname   {
	width: 180px;
}


/*Wettbewerb Kräftig Würzig, Input Felder Breite*/

.seite94 #vorname, .seite94 #strasse, .seite94 #plz, .seite94 #email, .seite94 #marktname, .seite99 #vorname, .seite99 #strasse, .seite99 #plz, .seite99 #email, .seite99 #marktname  {
	width: 200px;
}



.ohnepfeil {
	background-image: none !important;
	text-decoration: none !important;
	padding-left: 2px !important;
}

.seite79 .absendeknopf, .seite82 .absendeknopf, .seite86 .absendeknopf, .seite88 .absendeknopf, .seite94 .absendeknopf, .seite99 .absendeknopf {
	text-decoration: underline !important;
	padding-left: 12px !important;
}


.seite81 #schliessen {
top: -29px !important;	
}


/*Wettbewerb Danke Seite, Breite*/

.seite83 #column-1, .seite98 #column-1 {
	width: 442px;
}



/*
==================
Scroller
==================
*/	



.gewinner-tankgutschein-einleitung {

width: 500px;


}

.gewinner-tankgutschein {
float: left;
width: 500px;
height: 460px;

}



.jScrollPaneContainer {
	position: relative;
	overflow: hidden;
	z-index: 1;
	height: 460px!important;
	width: 510px!important;
}

.jScrollPaneTrack {
	position: absolute;
	cursor: pointer;
	right: 0;
	top: 0;
	height: 100%;
	background: #aaa;
	width: 6px!important;
}
.jScrollPaneDrag {
height: 30px!important;
	position: absolute;
	background: #666;
	cursor: pointer;
	overflow: hidden;
}
.jScrollPaneDragTop {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}
.jScrollPaneDragBottom {
	position: absolute;
	bottom: 0;
	left: 0;
	overflow: hidden;
}
a.jScrollArrowUp {
	display: block;
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
}
a.jScrollArrowUp:hover {
	/*background-color: #f60;*/
}

a.jScrollArrowDown {
	display: block;
	position: absolute;
	z-index: 1;
	bottom: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
}
a.jScrollArrowDown:hover {
	/*background-color: #f60;*/
}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
	/*background-color: #f00;*/
}


/*Radiospots Seiten*/
.rubrik109 #flash-column-1 {
	padding: 0px !important;
}
.rubrik109 #flash-column-2 object{
	margin-left: 271px !important;
}