/*///////////////////////////////////////////////////////////////////
// 2009-03   |                                                     //
// Project   | Charlie Pils                                        //
// Author    | Karsten Meyer | www.madebymeyer.de                  //                                                  
// Package   | master                                              //
///////////////////////////////////////////////////////////////////*/

/* # basics ########## */
HTML {
	margin:0;
	padding:0;
	height:100%;
}
BODY {
	height:100%;
	text-align: center;
	color: #fff;
	direction: ltr;
	font: 14px  "Trebuchet MS", Arial, Tahoma, sans-serif;
	margin:0;
	padding:0;
  background-color:#879030;	
}

#container {
 position:relative;
	margin:0 auto;
	text-align: left;
	width:993px;
	height:auto !important; /* real browsers */
	height:100%; /* IE6: treaded as min-height*/
	min-height:100%; /* real browsers */
	padding-left:13px;
	background: url(../img/bg_container.gif) repeat-y;
}

TABLE, TR, TD, TH {
	font: 14px  "Trebuchet MS", Arial, Tahoma, sans-serif;
	vertical-align:top;
	border-spacing: 0px;
	border-style: none;
	border-collapse: collapse;
	}

A:link,
A:active,
A:visited,
A:hover {
  color:#a11d0b;
  text-decoration:none;
}
A:hover {
  color:#fff;
  text-decoration:none;
  background-color:#a11d0b;
}
#logo A:hover {
  background-color:transparent;
}

A IMG,
IMG {
	border:0;
}

H1 {
  color:#9f1a0b;
	font-size:16px;
	font-weight:700;
  margin:0;
	padding-bottom:20px;
  letter-spacing:2px;
}

H2 {
  color:#9f1a0b;
	font-size:13px;
	font-weight:700;
  margin:0;
	padding-bottom:10px;
}
H3 {
  color:#fff;
	font-size:13px;
	font-weight:700;
  margin:0;
	padding-bottom:10px;
}
H4,H5,H6 {
  background-color:#a11d0b;
  padding:2px 5px 1px 5px;
  font-size:12px;
  font-weight:700;
  letter-spacing:2px;
}

P	{
  padding:0 0 10px 0;
  margin:0;
}

.clear {clear: both;
	height:0px;
	line-height:0;
	font-size:0px;}
 /* Clearing mit overflow */
.floatbox { overflow: hidden; }


/* # header area ############### */
#header, #top {
  position:relative;
	width:980px;
	height:243px;
	margin-bottom:41px;
}

#logo {
  position:absolute;
  left:0;
  top:31px;
	width:386px;
	height:92px;
	text-align:right;
}
#logo A:link,
#logo A:active,
#logo A:visited,
#logo A:hover {
	color:#fff;
	font-size:24px;
	letter-spacing:2px;
	line-height:22px;
  text-decoration:none;
}
#logo SPAN {
	font-size:16px;
}

#keyvisual {
  position:absolute;
  left:0;
  top:102px;
	width:204px;
	height:137px;
  border:2px solid #fff;
  border-left:0;	
}
#cp {
  position:absolute;
  left:248px;
  top:102px;
	width:132px;
	height:137px;
  border:2px solid #fff;
  background: url(../img/charlie-pils.jpg) no-repeat;  
}
#cp-text {
  position:absolute;
  left:394px;
  top:102px;
	width:325px;
	height:49px;
	padding: 92px 0 0 12px;
  background-color: #9f1a0b; 
  font-size:18px;
}
#cp-text SPAN {
  font-size:14px; 
}

#meta {
  position:absolute;
  right:0;
  top:102px;
  width: 194px;
  height: 24px;
  font-size:12px;
	padding: 117px 0 0 12px;
  background: #9f1a0b url(../img/bg_lotusbluete.gif) 11px 0px no-repeat;  
}
#meta A:link,
#meta A:active,
#meta A:visited,
#meta A:hover {
  color:#fff;
  text-decoration:none;
  padding-right:6px;
  letter-spacing:1px;
  background-color:transparent;
}

/* # main area ############### */
#main {
  position:relative;
  float:left;
	width:980px;
}

#col-left {
  position:relative;
  float:left;
	width:248px;
}

#content {
  position:relative;
  float:left;
	width:485px;
	line-height:1.5em;
	padding-bottom:40px;
}
#content IMG {
  border:1px solid #fff;
}

#col-right {
  float:right;
	width:206px;
}

#col-right H3 {
  color:#fff;
  font-size:12px;
  font-weight:700;
  letter-spacing:2px;
	padding:2px 0 1px 12px;
  background-color: #9f1a0b;
}

#col-right P {
  color:#fff;
  font-size:12px;
  font-weight:400;
  letter-spacing:1px;
	padding:10px 5px 10px 12px;
	line-height:16px;
}
#col-right IMG {
  border:2px solid #fff;
  border-right:0;
  margin:10px 0;
}


/* # navigation ############### */
#navigation {
	width:206px;
  margin:0;
  padding:0;
  list-style:none;
}

#navigation LI {
	padding:0;
  margin:0;
	width:206px;
	margin-bottom:7px;
}

#navigation LI A:link,
#navigation LI A:visited,
#navigation LI A:hover,
#navigation LI A:active {
  display:block;
	width:176px;
	padding:1px 0 1px 30px;
	margin:0;
  font-size:12px;
	text-decoration:none;
	color: #fff;
  letter-spacing:2px;
}

#navigation LI A:hover {
	color: #fff;
  background-color: #9f1a0b;
}

#navigation LI.current A:link,
#navigation LI.current A:visited {
	color: #fff;
  background-color: #9f1a0b;
}
/* # subnavigation ############### */
#subnavigation {
	width:206px;
  margin:0 0 10px 0;
  padding:0 0 7px 0;
  list-style:none;
  background-color: #9f1a0b;
}

LI #subnavigation LI {
	padding:0;
  margin:0;
	width:206px;
	margin-bottom:0;
}

LI #subnavigation LI A:link,
LI #subnavigation LI A:visited,
LI #subnavigation LI A:hover,
LI #subnavigation LI A:active {
  display:block;
	width:156px;
	padding:1px 0 1px 50px;
	margin:0;
  font-size:11px;
	text-decoration:none;
	color: #fff;
  letter-spacing:2px;
}

LI.current #subnavigation LI A:hover {
	color: #F7971D;
}

LI #subnavigation LI.current A:link,
LI #subnavigation LI.current A:visited {
	color: #F7971D;
}

/* # content ############### */
TABLE.events {
  margin-top:12px;
}
TABLE.events TH {
  background-color:#a11d0b;
  padding:2px 5px 1px 5px;
  font-size:12px;
  font-weight:700;
  letter-spacing:2px;
}
TABLE.events TD {
  padding:8px 5px 5px 5px;
  line-height:18px;
}
TABLE.stadt TD {
  padding:5px 5px 0px 5px;
  line-height:18px;
}
TABLE.events TD STRONG,
TABLE.events TD B,
.red {
  color:#a11d0b;
}
TABLE.events TD IMG {
  margin:5px 5px 5px 0;
}

P.top {text-align:right;}

P.top A:link,
P.top A:active,
P.top A:visited,
P.top A:hover {
  color:#a11d0b;
  text-decoration:none;
  padding-right:12px;
  background: url(../img/bg_top.gif) right 5px no-repeat;
}


/* # Styles für Formularelemente ######### */
FIELDSET {
	font-family:"Trebuchet MS", Arial, Tahoma, sans-serif;
	padding-bottom:5px;
	border:1px solid #2d7788;
	margin-bottom:15px;
}

LEGEND {
	padding:4px;
	color: #4e492d;
	font-weight:700;
}

LABEL {
	cursor:pointer;
	width:110px;
	float:left;
	clear:left;
	cursor:default;
}

INPUT.kontakt {
	border:1px solid #9F1A0B;
	margin-bottom:3px;
	width:250px;
	margin-right:10px;
	margin-bottom:5px;
}

INPUT.kontakterror {
	border:1px solid #fff;
	background-color:#9F1A0B;
	margin-bottom:3px;
	width:250px;
	margin-right:10px;
	margin-bottom:5px;
	color:#fff;
}

INPUT.submit {
	border:1px solid #9F1A0B;
	background-color:#fff;
	width:100px;
	color:#9F1A0B;
	font-weight:700;
	margin-top:5px;
}
INPUT.submit:hover {
	color:#fff;
	background-color:#9F1A0B;
}

TEXTAREA,
TEXTAREA.kontakterror {
	font-family:"Lucida Sans Unicode", Arial, Tahoma, Helvetica, sans-serif;
	font-size:1em;
	border:1px solid #9F1A0B;
	width:360px;
	height:85px;
}
TEXTAREA.kontakterror {
	border:1px solid #fff;
	background-color:#9F1A0B;
	color:#fff;
}


/* # footer ############### */
#footer {
  position:absolute;
  left:13px;
  bottom:5px;
	width:980px;
	height:20px;
}
#service {
	padding:0 0 5px 30px;
  font-size:12px;
  color:#9f1a0b;
}
/* # END ############### */
