@charset "utf-8";
/**
 * Main StyleSheet
 *
 * @project		Euregex
 * @author		Boris Bojic <bojic@devshack.biz>
 * @copyright	2009 Boris Bojic
 * @version		Mon, 09 Nov 2009 10:14:55 +0100
 *
 */

/* === [ Grundlegendes / CSS Reset ] ============================================= */

html,body,div,span,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,
a,abbr,acronym,address,big,cite,code,
del,dfn,em,img,ins,kbd,q,s,samp,
small,strike,strong,sub,sup,tt,var,
b,u,i,dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;}
ol,ul{list-style:none;}
blockquote,q{quotes:none;}
blockquote:before,blockquote:after,
q:before,q:after{content:'';content:none;}
:focus{outline:0;}
ins{text-decoration:none;}
del{text-decoration:line-through;}
body{line-height:1;font-family:Arial,Verdana,Helvetica,"Trebuchet MS",sans-serif;color:#333;background:#fff;font-size:100.01%;}
input,
select,
textarea{font-family:Arial,Verdana,Helvetica,"Trebuchet MS",sans-serif;margin:0;padding:0;border:0;}
table{border-collapse:collapse;border-spacing:0;empty-cells:show;font-family:Arial,Verdana,Helvetica,"Trebuchet MS",sans-serif;}
a{color:#D9C1B3;text-decoration:none;}
a:hover{color:#D9C1B3;}
label{cursor:pointer;}

/* === [ Grundlayout ] ===================================================================================== */

body{
	background: #A56245 url('./img/body/body-back.png');
}

#wrapper{
	width: 900px;
	margin: 30px auto 0 auto;
	background: #662501 url('./img/wrapper/wrapper-back.png') repeat-y;
}

#innerwrapper{
	background: url('./img/wrapper/innerwrapper-back.png') left bottom no-repeat;
}

#navi{
	width: 328px;
	float: left;
}

#content{
	width: 572px;
	float: left;
	
	padding: 30px 0;
	border-top: 3px solid #431801;
	min-height: 500px;
}

#footer{
	position: relative;
	line-height: 2.7;
	padding: 0 20px;
	background: #2F1303 url('./img/footer/footer-back.png');
}

/* === [ Logo ] ===================================================================================== */

#navi h1{
	color: #fff;
	padding: 29px 0 0 0;
	height: 109px;
	background: url('./img/logo/euregex-logo.png') left bottom no-repeat;
	text-indent: -9999em;
}

	#navi h1 a{
		display: block;
		height: 109px;
	}

#navi p#langbox{
	width: 328px;
	color: #fff;
	background-color: #8C4A21;
	font-size: .65em;
	line-height: 3;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: .2em;
}

#navi p#langbox a:hover{
	color: #fff;
}

/* === [ Navigation ] ===================================================================================== */

#navi ul{
	font-size: 1.1em;
	color: #EBC1AA;
	padding: 50px 30px 100px 0;
	line-height: 2.5;
}

#navi ul li{
	padding-bottom: 1px;
	background: url('./img/navi/li-back.png') right bottom no-repeat;
}

	#navi ul li.last{
		background-image: none;
	}

#navi ul a{
	display: block;
	color: #EBC1AA;
	padding-left: 65px;
	background-color: transparent;
	background-image: none;
}

	#navi ul a:hover{
		color: #fff;
		background: #A35022 url('./img/navi/arrow-hover.png') 2.7em .7em no-repeat;
	}

	#navi ul a.active{
		color: #fff;
		background: #A35022 url('./img/navi/arrow-active.png') 2.4em .95em no-repeat;
	}

/* 2. Ebene */

#navi ul ul{
	padding: 0;
	font-size: .75em;
}

#navi li li{
	background-image: none;
	padding: 0;
}

	#navi ul ul a{
		padding-left: 80px;
	}

	#navi ul ul a:hover,
	#navi ul ul a.active{
		background: transparent url('./img/navi/arrow-sub.png') 5em .85em no-repeat;
	}

/* === [ Inhalt ] ===================================================================================== */

#content a{
	text-decoration: underline;
}

#content a:hover{
	color: #fff;
}

/* --- Variable Schriftgrößen --- */

#content .x-smallfont{
	font-size: .65em;
}

#content .smallfont{
	font-size: .79em;
}

#content .medfont{
	font-size: .9em;
}


#content h2{
	font-size: 1.3em;
	line-height: 1.4;
	color: #D1BEB3;
	padding: 0 39px .8em 39px;
}

#content h3{
	font-size: 1.1em;
	line-height: 1.4;
	color: #D1BEB3;
	padding: 0 39px .8em 39px;
}

#content h4{
	font-size: 1em;
	line-height: 1.5;
	color: #D1BEB3;
	margin: 0 39px .5em 39px;
	border-bottom: 2px solid #D1BEB3;
}

#content p{
	font-size: 1em;
	line-height: 1.6;
	color: #fff;
	padding: 0 39px 1.2em 39px;
}

#content sub,
#content sup {
	line-height: 0;
	font-size: .65em;
	font-family: Verdana,Geneva,Arial,Helvetica,sans-serif;
}
#content sub {
	vertical-align: sub;
}
#content sup {
	vertical-align: super;
}

#content ul{
	font-size: 1em;
	line-height: 1.6;
	color: #fff;
	padding: 0 39px 1em 39px;
}

	#content ul li{
		padding: 0 0 1em 25px;
		background: url('./img/icons/dotarrow.png') .8em .5em no-repeat;
	}

	#content ul ul{
		font-size: 1em;
		padding: 1em 39px 0 0;
	}

#content img.imgleft{
	float: left;
	margin: 0 15px 15px 0;
}

#content img.imgright{
	float: right;
	margin: 0 0 15px 15px;
}

#content img.imgcenter{
	margin: 0 auto;
	display: block;
}

#content hr{
	font-size: 1em;
	clear: both;
	color: #94664D;
	background-color: #94664D;
	height: 1px;
	border: 1px solid #94664D;
	border-width: 1px 0 0 0;
	margin: 0 39px 1em 39px;
}

/* === [ Galerie ] ===================================================================================== */
#content ul.gal-list li{
	float: left;
	width: 125px;
	height: 83px;
	margin: 0 10px 10px 0;
	padding: 0;
	background-image: none;
	border: 1px solid #94664D;
}

	#content ul.gal-list li:hover{
		border-color: #fff;
	}

#content ul.gal-list li img{
	display: block;
}

/* === [ Formulare ] ===================================================================================== */

#content ol.formlist{
	font-size: 1em;
	line-height: 1.6;
	color: #fff;
	padding: 0 39px 1em 39px;
}

	#content ol.formlist li{
		padding: 5px 0;
	}


	#content ol.formlist li label{
		float: left;
		width: 10em;
	}

		/* Zweispaltige Formulare */
		#content ol.formlist.double li label{
			float: none;
			display: block;
			width: auto;
			line-height: 1.4;
		}

	#content ol.formlist li label span{
		color: #5f5;
	}

	#content ol.formlist li input,
	#content ol.formlist li textarea,
	#content ol.formlist li select{
		float: left;
		width: 22em;
		font-size: .9em;
		color: #000;
		padding: 2px 5px;
		border: 1px solid #2F1303;
		background: #fff url('./img/form/form_shadow.png') no-repeat;
		margin-top: 2px;
	}

		#content ol.formlist.double li input,
		#content ol.formlist.double li textarea,
		#content ol.formlist.double li select{
			float: none;
			display: block;
			width: 22em;
		}

	#content ol.formlist li select{
		padding-right: 0;
		padding-bottom: 0;
	}
	
	#content ol.formlist li input.halfform,
	#content ol.formlist li select.halfform{
		width: 10em;
	}
	
	#content ol.formlist li input.medform,
	#content ol.formlist li select.medform{
		width: 7em;
	}

	#content ol.formlist li input.smallform,
	#content ol.formlist li select.smallform{
		width: 5em;
	}

	#content ol.formlist li input.xsmallform,
	#content ol.formlist li select.xsmallform{
		width: 3em;
	}

	#content ol.formlist li input:focus,
	#content ol.formlist li textarea:focus,
	#content ol.formlist li select:focus,
	#content ol.formlist li input:hover,
	#content ol.formlist li textarea:hover,
	#content ol.formlist li select:hover{
		background: #c7994f url('./img/form/form_shadow_hover.png') no-repeat;
	}


	#content ol.formlist li input#abschicken{
		width: auto;
		float: none;
		font-size: 1em;
		padding: 2px 10px;
		margin-left: 10em;
		background: #e9bb6f none;
		cursor: pointer;
	}

		#content ol.formlist.double li input#abschicken{
			margin: 0;
		}

	#content p.errormessage,
	#content p.successmessage{
		font-weight: bold;
		font-size: .8em;
		color: #f99;
		border: 1px solid #f99;
		margin: 0 39px 1em 39px;
		padding: 10px;
	}

	#content p.successmessage{
		color: #0f0;
		border: 1px solid #0f0;
	}

/* === [ Footer ] ===================================================================================== */

#footer p{
	color: #fff;
	font-size: .6em;
	text-align: right;
	text-transform: uppercase;
}

#footer p a{
	color: #fff;
	text-decoration: underline;
}

#footer p a:hover{
	color: #D9C1B3;
}

#footer p a.active{
	color: #D9C1B3;
	text-decoration: underline;
}

/* === [ CSS Autoclear ] ===================================================================================== */
#innerwrapper:after,
#content ol.formlist li:after,
#content ul.gal-list:after{
	content: ".";display: block;height: 0;clear: both;visibility: hidden;
}















/* that's all folks! */