/* CSS Document - smash.ch 
Autor: Maja Bretscher
*/
/***************************** Global ****************************************/
h1, h2, h3, h4, h5, h6, p, img, a, ul, li {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #333;
	text-align: left;
	border: 0;
	margin: 0;
	padding: 0;
}
body{
	background: #fff;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}
a { color: #da7213; text-decoration: none; }
a:hover { 	color: #993300; }
/***************************** Hauptebenen ****************************************/
#aussenrahmen {
	width: 994px;
	margin: 0 auto 0 auto; /* zentriert die gesamte Website */
}

#head_1 {
	width: 994px;
	height:220px;
	background: #fff url(../images/hand_baelle_994x220.jpg) no-repeat;
}

#head_2 {
	width: 994px;
	height:220px;
	background: #fff url(../images/williams_994x220.jpg) no-repeat;
}
#head_3 {
	width: 994px;
	height:220px;
	background: #fff url(../images/mauresmo_994x220.jpg) no-repeat;
}

#head_4 {
	width: 994px;
	height:220px;
	background: #fff url(../images/monfils_994x220.jpg) no-repeat;
}

#head_5 {
	width: 994px;
	height:220px;
	background: #fff url(../images/nadal_994x220.jpg) no-repeat;
}

#head_6 {
	width: 994px;
	height:220px;
	background: #fff url(../images/safin_994_220.jpg) no-repeat;
}

#head_7 {
	width: 994px;
	height:220px;
	background: #fff url(../images/sharapova_994x220.jpg) no-repeat;
}

#head_8 {
	width: 994px;
	height:220px;
	background: #fff url(../images/stadion_wimbledon_994x220.jpg) no-repeat;
}

#head_9 {
	width: 994px;
	height:220px;
	background: #fff url(../images/federer_994x220.jpg) no-repeat;
}

#newsrahmen {
	width: 994px;
	float: left;
	height: 120px;
	background: #fff url(../images/news_trennlinien_994x120.gif) no-repeat;
	border-bottom: 2px solid #c3c3c3 ;
}
/***************************** Newsfelder ************************************/
#newsfeld1 {
	float: left;
	width: 290px;
	height: 100px;
	padding: 25px 15px 15px 29px;
	/*margin: 25px 15px 15px 24px;*/

}
#newsfeld2 {
	float: left;
	width: 295px;
	height: 100px;
	padding: 25px 15px 15px 16px;
}

#newsfeld3 {
	float: left;
	width: 295px;
	height: 100px;
	padding: 25px 15px 15px 16px;
}

#newsfeld1 h1, #newsfeld2 h1, #newsfeld3 h1 {
	font-size: 11px;
}

#newsfeld1 h2, #newsfeld2 h2, #newsfeld3 h2 {
	font-size: 9px;
}

#newsfeld1 p, #newsfeld2 p, #newsfeld3 p {
	font-size: 11px;
}

#newsfeld1 a, #newsfeld2 a, #newsfeld3 a, navigation ul {
	font-size: 11px;
	color: #da7213;
}

/*********************************** Inhalt ***********************************/
#content_left {
	width: 468px;
	margin: 15px 15px 15px 14px;
	float:left;
}

#content_right {
	width: 468px;
	margin: 15px 15px 15px 0px;
	float: right;
}

#content_default {
	width: 710px;
	margin: 15px 0px 15px 0;
	float: right;
}

#content_right h1, #content_left h1, #content_default h1 {
	font-size: 18px;
	color: #8c4a0d;
	margin: 0 0 10px 0;
}

#content_right h2, #content_left h2, #content_default h2 {
	margin: 0 0 15px 0;
	font-size: 14px;
	color: #333;
}

#content_right h3, #content_left h3, #content_default h3 {
	margin: 0 0 15px 0;
	text-align:center;
	font-size: 14px;
	color: #fff;
	background-color: #da7213;
}

#content_right p, #content_left p, #content_default p {
	font-size: 12px;
	line-height: 18px;
	color: #333;
	margin: 0 0 10px 0;
}
#content_right a, #content_left a, #content_default a {
	font-size: 12px;
	color: #da7213;
}


a:link, a:visited {
	color: #da7213;
}

a:hover, a:active {
	color: #993300;
}

#content_right li, #content_left li, #content_default li {
	font-size: 12px;
	color: #da7213;
}

/* ### Header Navigation ##################################################### */
/********************************Navigation************************************/

#hauptnavigation {
	float: left;
	width: 994px;
	height: 40px; /* entspricht der Hoehe der einzelnen Navigationspunkte */
	margin: 180px 0 0 0;
	padding:0;
	}
#hauptnavigation ul {
	float: left;
	list-style: none;
	display: inline;
}
#hauptnavigation li {
	float: left; /* saemtliche Navigationspunkte werden in einer Zeile dargestellt */
}
#hauptnavigation a {
	float: left;
	height: 0; /* der aktuelle Grafik-Inhalt ohne XHTML-Linktext ist sichtbar */
	overflow: hidden; /* Ueberfliessender Inhalt (XHTML-Linktexte) wird ausgeblendet */
	padding: 40px 0 0 0; /* saemtliche Link-Elemente werden in der entsprechenden Hoehe dargestellt */
}
#hauptnavigation a:link.magazin, #hauptnavigation a:visited.magazin {
	width: 146px; /* Breite der Linkgrafik */
	background: url(../images/magazin_navi_de.gif) 0 0 no-repeat; /* 0 0 entspricht der Position der Grafik in der X,Y-Achse */
}
#hauptnavigation a:hover.magazin, #hauptnavigation a:active.magazin {
	background: url(../images/magazin_navi_de.gif) 0 -40px no-repeat;
}
#hauptnavigation a:link.saison, #hauptnavigation a:visited.saison {
	width: 160px;
	background: url(../images/saison10_navi_160x80.gif) 0 0 no-repeat;
}
#hauptnavigation a:hover.saison, #hauptnavigation a:active.saison {
	background: url(../images/saison10_navi_160x80.gif) 0 -40px no-repeat;
}
#hauptnavigation a:link.gallery, #hauptnavigation a:visited.gallery {
	width: 112px;
	background:url(../images/gallery_navi_de.gif) 0 0 no-repeat;
}
#hauptnavigation a:hover.gallery, #hauptnavigation a:active.gallery {
	background: url(../images/gallery_navi_de.gif) 0 -40px no-repeat;
}
#hauptnavigation a:link.aboservice, #hauptnavigation a:visited.aboservice {
	width: 145px;
	background: url(../images/aboservice_navi_de.gif) 0 0 no-repeat;
}
#hauptnavigation a:hover.aboservice, #hauptnavigation a:active.aboservice {
	background: url(../images/aboservice_navi_de.gif) 0 -40px no-repeat;
}
#hauptnavigation a:link.inserate, #hauptnavigation a:visited.inserate {
	width: 122px;
	background: url(../images/inserate_navi_de.gif) 0 0 no-repeat;
}
#hauptnavigation a:hover.inserate, #hauptnavigation a:active.inserate {
	background: url(../images/inserate_navi_de.gif) 0 -40px no-repeat;
}
#hauptnavigation a:link.unterhaltung, #hauptnavigation a:visited.unterhaltung {
	width: 170px;
	background: url(../images/unterhaltung_navi_de.gif) 0 0 no-repeat;
}
#hauptnavigation a:hover.unterhaltung, #hauptnavigation a:active.unterhaltung {
	background: url(../images/unterhaltung_navi_de.gif) 0 -40px no-repeat;
}
#hauptnavigation a:link.kontakt, #hauptnavigation a:visited.kontakt {
	width: 139px;
	background: url(../images/kontakt_navi_de.gif) 0 0 no-repeat;
}
#hauptnavigation a:hover.kontakt, #hauptnavigation a:active.kontakt {
	background: url(../images/kontakt_navi_de.gif) 0 -40px no-repeat;
}

/* ########################################## Sub - Navigation ######################################################### */

#navigation {
	width:  234px;
	margin: 10px 15px 15px 14px;
	float:left;
}

#navigation h1, #navigation a {
	font-size: 12px;
	color: #da7213;
	margin: 0 0 7px 0;
	font-weight: bold;
}


#navigation h2{
	font-size: 12px;
	color: #da7213;
	margin: 0 0 7px 10px;
}
#navigation a:link, #navigation a:visited {
	color: #da7213;
}

#navigation a:hover, #navigation a:active {
	color: #993300;
}

#navigation ul {
	list-style: none;
	text-decoration: none;
	font-family: verdana, arial, helvetica, sans-serif;
    	text-align:left;
	padding: 2px 0px 4px 0px;

}
#navigation li {

	padding: 2px 0px 2px 0px;

}


/* Sub - Navigation Ebene 2
*******************************************************************************************************/
ul#navigation-vertikal-2 {
	list-style: none;
	text-decoration: none;
	font-family: verdana, arial, helvetica, sans-serif;
    text-align:right;
	padding: 2px 0px 4px 0px;

}

.navigation-vertikal-2  {
	line-height: 16px;
	text-decoration: none;
	padding: 2px 0px 2px 0px; /* Einrücken des Navigationsblocks */

}

a.navigation-vertikal-2:link, a.navigation-vertikal-2:visited {
	color: #da7213;
	font-size: 10px;
	font-weight: normal;
	text-decoration: none;
}

a.navigation-vertikal-2:hover {
	color: #993300;
	text-decoration: none;
}

a.navigation-vertikal-2#active_menu {
	color: #993300;
	text-decoration: none;
}

/* Sub - Navigation Ebene 3
*******************************************************************************************************/
ul#navigation-vertikal-3 {
	list-style: none;
	text-decoration: none;
	font-family: verdana, arial, helvetica, sans-serif;
	color: #da7213;
	padding: 1px 0px 6px 0px;

}

.navigation-vertikal-3  {
	text-decoration: none;
	padding: 2px 0px 2px 20px; /* Einrücken des Navigationsblocks */
}

a.navigation-vertikal-3:link, a.navigation-vertikal-3:visited {
	color: #da7213;
	font-size: 9px;
	text-decoration: none;
    font-weight: normal;
}

a.navigation-vertikal-3:hover {
	color: #993300;
	text-decoration: none;
}

a.navigation-vertikal-3#active_menu {
	color: #993300;
	text-decoration: none;
}

/*************************** ENDE NAVIGATION ***************************/
/* ### Sprach-Navigation ##################################################### */


#language-box {
	position: relative;
	margin: 0;
	padding-top: 6px;
	padding-bottom: 6px;
}

#language-text {
	margin: 0;
	padding: 4px;
	background: #FFFFFF;
	text-align: left;
	border-bottom: 1px solid #E6E6E6;
	font-size: 10px;
	line-height: normal;
	color: #666666;
	width:150px;

}
/* ### Footer ##################################################### */
#footer {
	position: relative;
	left: 0;
	height: auto;
	clear: both;
	background: #FFFFFF;
}

#footer-box {
	position: relative;
	margin: 0;
	padding-top: 6px;
	padding-bottom: 6px;
}

#footer-text {
	margin: 0;
	padding: 6px;
	background: #FFFFFF;
	text-align: center;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #E6E6E6;
	font-size: 9px;
	line-height: normal;
	color: #666666;
}





/**************************************Formulare****************************************
form {
	width: 400px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;

}
form li {
	color: #da7213;
}

label,
select,
input[type=checkbox],
input[type=radio],
input[type=button],
input[type=submit]
{
cursor : pointer;
}

.formgen .formblock
{
	margin-bottom: 5px;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-right: 2px;
	padding-left: 5px;
}*/


/*
Verhalten von br-Tags

.formgen br
{
clear : both;
}*/


/* 
--------- FORMULAR-OBJEKTE ------------ 
*/


/* Mehrzeiliges Eingabefeld 
.formgen .formtextfield
{
	width: 210px;
	height: 250px;
	margin-left: 4px;
}*/


/* Textfeld 
.formgen .formtext
{
	height: 20px;
    width: 300px;
	background-color: #eeeeee;
	margin-left: 4px;
}*/
/* Trennelement , Abstand.formgen .formtrenn
{
	display: block;
	height: 50px;	
} */

/* Hinweistext
.formgen .formhinweis
{
	font-weight: bold;
	color: #003366;
	font-size: 12px;
} */
/* Überschrift 
.formgen .formheadline
{
	font-weight: bold;
	color: #003366;
}*/


/* Passwortfeld 
.formgen .formpassword
{
	width: 200px;
	background-color: #CCCCCC;
	margin-left: 4px;
}*/
/*Captcha-Bild
.formgen .formcaptcha {
	border: 1px solid #990000;
}
*/
/* Label 
.formgen label {
width: 180px;
clear: left;
float: left;
height: 20px;
padding: 0px;
}*/


/* Aussehen der Select-Ausgabe 
.formgen .formselect {
	width: 200px;
	background-color: #ccc;
	margin-left: 4px;
}

.formradio {
	float:left;

}*/
/* Sende-Button 
.formgen .formsubmit {
	width: 50%;
}
*/

/* Definition des Fieldsets, das das ganze Formular umschließt 
.formgen fieldset {
	border: 1px solid #da7213;
	margin: 0 0 18px 0;
	padding: 4px 26px 13px 26px;
}*/


/* Fieldsetbeschriftung 
.formgen legend {
	font-weight: bold;
	color: #333333;
	font-size: 16px;
}
*/
/* -------------- AUSGABEN / Fehlermeldungen --------*/

/* Fehlermeldung nach Versand

.formgen .forminfo {
	color: #FFFFFF;
	background-color: #990000;
	border: 1px dashed #000000;
	margin: 5px;
	padding: 5px;
} */


/* Markierung der Labels bei Fehler 
.formgen .formerror {
	color: #f00;
	font-weight: bold;
}
.fehlermeldung {
	color: #f00;
	font-weight: bold;
}*/

form {
	width: 420px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
}

fieldset {
	border: 1px solid #da7213;
	margin: 0 0 18px 0;
	padding: 4px 26px 13px 26px;
}

legend {
	font-weight: bold;
	color: #333;
	text-transform: uppercase;
	margin: 0 -13px 0 -13px;
	padding: 0 12px 0 12px;
}
label {
	float: left;
	margin: 9px 0 1px 0;
	font-weight: bold;
}
input, select, textarea {
	width: 350px;
	background: #eeefef;
	padding: 2px 4px 2px 4px;
}

textarea {
	height: 178px;
}
.checkbox {
	margin: 9px 0 0 9px;
}
.formular-eingabefeld-erforderlich {
	background: #f6dcc4;

}
.formular-schaltflaeche {
	font-weight: bold;
	text-align: center;
	color: #db7314;
	border: 2px solid #db7314;
	background: #f6dcc4;	
 	margin: 20px 0 22px 0;
}
.formular-hinweis {
	margin: 2px 0 0 144px; /* Total aus "label-width" und "input, textarea-margin" */
}
.formular-grundschrift { /* p */
	font-size: 12px;
	line-height: 18px;
	margin: 10px 0 0 0;
}
.formular-warnung { /* p */
	font-size: 12px;
	line-height: 18px;
	font-weight: bold;
	color: #9e0b00;
	margin: 15px 0 18px 0;
}
*/



/*#####################################################################################*/
/* 

Das Modul nutzt 6  Klassen zur Ausrichtung der Bilder. 
.pleft , .pright und .pnormal    

.pleft für links ausgerichtete Bilder
.pright für rechts ausgerichte Bilder
.pnormal kann zur Definition einer Normalanzeige verwendet werden.  

.pleft_b, .pright_b und .pnormal_b 
definieren die Anzeige der Bilder für den 2. Stil.  
z.B. Anzeige mit Rahmen
Viel Spass beim weiteren basteln.



Code: 

*/ 


/* Definition der Klassen ohne Rahmen*/ 

.pleft {
	float: left;
	margin-top: 5px;
	margin-right: 5px;
	margin-bottom: 5px;
	vertical-align: text-bottom;

border: none;
}
.pright {
	float: right;
	margin-top: 5px;
	margin-left: 5px;
	margin-bottom: 5px;
	vertical-align: text-bottom;

border: none;
}
.pnormal {
	clear: both;
	border: none;
	margin-top: 5px;
	margin-right: 15px;
	margin-bottom: 10px;

	
}


/* Definition der KLassen mit  Rahmen (2.Stil) */

.pleft_b {
	float: left;
	margin-top: 5px;
	margin-right: 5px;
	margin-bottom: 5px;
	vertical-align: text-bottom;
border: 10pxpx solid #fff;
}
.pright_b {
	float: right;
	margin-top: 5px;
	margin-left: 5px;
	margin-bottom: 5px;
	vertical-align: text-bottom;
border: 1px solid #990000;
}
.pnormal_b {
	clear: both;
	border: 1px solid #990000;
}


