
/*-  	global
----------------------------------------------------------------------*/



body {
	background-color: #fff;
         padding: 0; margin: 0;
}


/*-	important classes
----------------------------------------------------------------------*/


.centralwrapper  { width: 960px; margin: 0 auto; padding: 0; background: transparent; position: relative; }
.top20 {margin-top: 20px;}
.clr { clear: both; margin: 0;}
.lined {margin: 0 20px; border-top: 1px solid #fff; padding-top: 10px;}
.nulled {margin: 0 !important; padding: 0 !important;}
.sep {margin: 5px 0; border-top: 1px solid #1d315b; height:0; width: 100%;}



/*-  	elements
----------------------------------------------------------------------*/


#upperarea {
	position: relative;
         z-index: 1;
	background: #f63 url(../img/bg_upper.jpg) top center no-repeat;
         height: 440px;
         width: 100%;
}

#header {
	position: relative;
         z-index: 2;
         width: 100%;
         height: 70px;
         background: transparent url(../img/bg_header.gif) top center no-repeat;
}

#logo { position: absolute; left: 0; top: 8px; background: transparent; z-index: 3;}

#keyvisual-wrapper {margin: 0 auto; position: relative; top: 20px; width: 980px; height: 310px; }
#keyvisual {margin: 0 auto; position: relative; top: 25px; width: 930px; height: 270px;

    position:relative;
    overflow:hidden;
    clear:both;

}

div.next {position: absolute; top: 145px; right: 3px; z-index: 10000; width: 30px; height: 30px; background: transparent url(../img/buttons/hori_large.png) no-repeat 0 -30px; cursor: pointer; }
div.next:hover {background-position: -30px -30px !important;}

div.prev {position: absolute; top: 145px; left: 3px; z-index: 10001; width: 30px; height: 30px; background: transparent url(../img/buttons/hori_large.png) no-repeat 0 0; cursor: pointer; }
div.prev:hover {background-position: -30px 0 !important;}

.disabled {
	visibility:hidden !important;
}

#keyvisual div {
    float:left;
    background-color: #f0f;
    display:block;
    width:940px;
    height:270px;
    font-size:39px;
}

#keyvisual .items {
    width:20000em;
    position:absolute;
    clear:both;
    margin:0;
    padding:0;
}

#keyvisual .less, #keyvisual .less a {
    color:#999 !important;
    font-size:11px;
}


#footer {
	position: relative;
         margin: 0 auto;
         padding: 0;
	width: 100%;
         height: 85px;
	background: transparent url(../img/bg_footer_tile.gif) repeat-x;
}

#content {
	z-index: 4;
	position: relative;
         overflow: visible;
         margin: 0 auto;
	padding: 0;
         width: 960px;
         background: #fff url(../img/bg_content_bottom.gif) no-repeat bottom center;

}


#left-column {
	display: inline;
         float: left;
         width: 200px;
         margin: 0;
         padding: 0;
         position: relative;
         z-index: 5;
         background-color: transparent;

         height: 400px;
}

#right-column {
	display: inline;
         float: right;
         width: 760px;
         margin: 0;
         padding: 0;
         position: relative;
         z-index: 5;
         background-color: transparent;
}



/*-  	navigation
----------------------------------------------------------------------*/




.navi { background-position: 0 -140px; background-repeat: no-repeat; height: 70px; }

.home 		 { background-image: url(../img/buttons/home_98px.jpg); 			width: 98px; position: absolute; left: 349px; }
.ueberuns	 { background-image: url(../img/buttons/about_123px.jpg); 			width: 123px; position: absolute; left: 447px; }
.leistungen	 { background-image: url(../img/buttons/leistungen_130px.jpg); 		width: 130px; position: absolute; left: 570px; }
.impressionen	 { background-image: url(../img/buttons/impressionen_150px.jpg); 		width: 150px; position: absolute; left: 700px; }
.kontakt		 { background-image: url(../img/buttons/kontakt_110px.jpg); 			width: 110px; position: absolute; left: 850px; }

.off 		 { background-position: 0 0 !important;}
.off:hover 	 { background-position: 0 -70px !important;}


/* -	grids
-------------------------------------------------------------------------------- */

.headline-image { position: absolute; bottom: 25px; }
.dummy {background-color: #f0f; height: 30px; width: 180px;}
.headright {left: 40px;}

.leftbox { width: 200px; clear: both; position: relative; }
.rightbox { width: 760px; clear: both; position: relative; }

.brightbottom {background: transparent url(../img/bg_rc_bright.gif) no-repeat bottom left; padding-bottom: 70px; }
.brighttop {background: transparent url(../img/bg_rc_bright.gif) no-repeat top left; padding-bottom: 20px; }
.darkmiddle  {background: transparent url(../img/bg_rc_dark_tile.gif) repeat-y top left; padding-bottom: 20px; }

.lefttop { background: transparent url(../img/bg_lc_top.gif) no-repeat top right; height: 92px; }
.righttop { background: transparent url(../img/bg_rc_top.gif) no-repeat top left; height: 92px; }

.separator { height: 20px; clear: both; margin: 30px 0; background: transparent url(../img/rc_separator.gif) no-repeat top center; }


.boxright { position: relative; z-index: 8; border: 0; background: transparent; float: left; display: inline; }
.halfleft  { width: 320px; margin: 40px 20px 40px 40px; float: left; }
.halfright { width: 320px; margin: 40px 40px 40px 20px; float: right; }
.full      { width: 680px;  margin: 40px; clear: both; }


.white {color: #fff;}
.black {color: #000;}

.left-portrait {	float: left;            margin: 4px 10px 15px 0;     }
.right-portrait {   	float: right;           margin: 4px 0 15px 10px;     }

.caption {
	position: absolute;
         background: #444;
         bottom: 0;
}

.caption h4 { color: #fff; font-weight: 700; margin: 3px; }


.linkarea {
	background: transparent;
         border: 0;
         position: absolute;
}


img { border: 0;}




/*-  	styles
----------------------------------------------------------------------*/

p, li, h1, h2, h3, h4, a, th, td {
	font-family: Arial, Helvetica, 'sans serif';
}


h1 {
	font-size: 22px;
	font-weight: normal;
	color: #000;
         margin-top: 20px;
         margin-bottom: 12px;

}

h2 {
	font-size: 16px;
	font-weight: bold;
         color: #f63;
         font-style: normal;
         margin-bottom: 10px;

}


h3 {
	font-size: 12px;
         color: #000;
         font-weight: bold;
         font-style: normal;
         margin-bottom: 10px;

}



p { text-align: left; font-size: 12px; line-height: 17px; color: #000; margin-bottom: 10px; }
p.little { font-size: 10px; line-height: 15px; color: #000; margin-bottom: 10px; }

.leftbox p { padding-right: 15px;}
.leftbox h2, .leftbox h3 { padding-right: 15px; padding-top: 20px; }

.leftbox h2.linkhead { cursor: pointer; display: block; text-align: right; margin: 10px 0; }

li { text-align: left; font-size: 12px; line-height: 17px; color: #000; margin-bottom: 7px; }
ul { list-style: square outside; margin-left: 40px; margin-top: 40px; }

.l {text-align: left;}
.r {text-align: right;}


a:link, a:visited, a:focus, a:hover,
a.small:link, a.small:visited, a.small:focus, a.small:hover { outline: 0; }

a:link, a:visited, a:focus,
a.small:link, a.small:visited, a.small:focus { color: #f63; text-decoration: none; font-weight: 900; }

a:hover, a.small:hover { color: #f63; text-decoration: underline; }

a.area:link, a.area:visited, a.area:hover, a.area:focus {
	text-decoration: none;
	outline: 0;
         display: block;
         width: 100%;
         height: 100%;
       	text-indent: -8000px;
         overflow: hidden;
}

.linkbutton {position: relative; margin: 20px 0 0 auto; width: 192px; height: 48px; background-position: 0 0; background-color: transparent; }
.linkbutton:hover {background-position: 0 -48px !important; }


#footer .centralwrapper p span { color: #666 !important; }
#footer .centralwrapper p span a { text-decoration: underline; color: #666 !important; }
#footer .centralwrapper p span a:hover { color: #888 !important; }





/*-  	contact form
----------------------------------------------------------------------*/



input, textarea {
       padding: 2px;
       color: #000;
       outline: 0;
       text-decoration: none;
       font: normal 16px Arial;
       outline: none;
}

/* input, textarea {	background: #fff;} */

td.ctc {
	padding: 5px 0 5px 0;
         vertical-align: top;
}

p.ct { margin: 1px 20px 0 0; text-align: right; }
p.lc { margin: 1px 20px 0 0; text-align: left; }