@charset "UTF-8";

/* Der Kern von Clearfix */
.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
  font-size:0;

}
/* IE-Patches für Clearfix */
.clearfix { display: inline-block; }
/* Vor IE5/Mac verstecken mit dem Commented Backslash Hack \*/
* html .clearfix { height: 1px; }
.clearfix { display: block; }
/* Ende des Versteckspiels für den IE5/Mac */


body, html {
width: 100%;
height: 100%;
padding: 0px;
margin: 0px;
}


body {
background-image: url(../pics/layout/hintergrund_body.jpg);
background-position: center 230px;
background-repeat: no-repeat;
font-family: Arial, Helvetica, sans-serif;
}


:focus {
	outline: none;
}

a { 
color: #e4183a;
text-decoration: none;
}


a:hover {
text-decoration: underline;
}


.wrapper {
width: 910px;
margin-left: auto;
margin-right: auto;
}


/*////////////// HEADER //////////////*/


.header {
width: 910px;
padding: 20px 0 0 0;
height: 143px;
}


.logo {
float: left;
width: 88px;
height: 131px;
margin-left: 10px;
}


.schriftzug {
float: right;
padding-top: 10px;
padding-right: 10px;
width: 316px;
height: 59px;
}


.keil {
float: right;
padding-top: 50px;
padding-bottom: 1px;
width: 576px;
height: 23px;
}



/*////////////// NAVI //////////////*/


.navi {
	width: 911px;
	height: 39px;
	margin-bottom: 2px;
	overflow: hidden;
	color: #FFFFFF;
	font-size: 12px;
	color: #000;
}


.navi ul {
	list-style-type: none;
	padding: 0px;
	margin: 0px;
}


.navi li {
	float: left;
}

.navi span {
	display: none;
	visibility: hidden;
}


.navi a {
	color: #FFFFFF;
	text-decoration: none;
	display: block;
	height: 39px;
	border-right: 1px solid #FFFFFF;
}


.navi a:hover {
	background-position: right;
}


.navi_startseite {
	width: 50px;
	background-image: url(../pics/navi/start.png);
	background-position: left;
}


.navi_agentur {
	width: 88px;
	background-image: url(../pics/navi/agentur.png);
	background-position: left;
}


.navi_webdesign {
	width: 110px;
	background-image: url(../pics/navi/webdesign.png);
	background-position: left;
}


.navi_corporate {
	width: 153px;
	background-image: url(../pics/navi/corporate-design.png);
	background-position: left;
}


.navi_marketing {
	width: 102px;
	background-image: url(../pics/navi/marketing.png);
	background-position: left;
}


.navi_kunden {
	width: 85px;
	background-image: url(../pics/navi/kunden.png);
	background-position: left;
}


.navi_jobs {
	width: 64px;
	background-image: url(../pics/navi/jobs.png);
	background-position: left;
}


.navi_kontakt {
	width: 85px;
	background-image: url(../pics/navi/kontakt.png);
	background-position: left;
}


.navi_news {
	width: 71px;
	background-image: url(../pics/navi/news.png);
	background-position: left;
}

.navi_facebook {
	width: 93px;
	background-image: url(../pics/navi/facebook.png);
	background-position: left;
	border-right: none;
}






/*////////////// MAIN STARTSEITE //////////////*/


.main_startseite {
width: 910px;
height: 590px;
background-color: #e4183a;
background-image: url(../pics/layout/hintergrund_main_startseite.gif);
}


.slideshow {
width: 588px;
height: 334px;
float: left;
background-color:#FFFFFF;
margin: 3px 0 0 3px;
overflow: hidden;
}

.zitate {
float: left;
width: 316px;
height: 334px;
margin-top:3px;
overflow: hidden;
}

.teaser {
float: left;
width: 860px;
height: 45px;
overflow: hidden;
padding: 30px 25px 30px 25px;
font-size: 18px;
font-weight: normal;
color: #FFF;
line-height: 17pt;
}

.appetizer {
float: left;
width: 885px;
height: 130px;
padding: 17px 0px 0px 40px;
}

.appetizer span {
width: 175px;
height: 129px;
display: block;
background-image: url(../pics/layout/hintergrund_appetizer.gif);
background-color: #FFFFFF;
float: left;
margin-right: 42px;
}







/*////////////// MAIN TEXT //////////////*/


.main_text {
width: 910px;
height: auto;
background-color: #e4183a;
}


.subnavi_headline {
float: left;
width: 219px;
height: 46px;
background-image: url(../pics/layout/hintergrund_subnavi_oben.png);
color: #FFFFFF;
font-size: 18px;
padding: 30px 20px 10px 20px;
}


.content_headline {
float: left;
width: 631px;
height: 46px;
padding: 25px 20px 15px 0px;
background-image: url(../pics/layout/hintergrund_content_oben.png);
font-size: 24px;
color: #FFFFFF;
}

.content_wrapper {
width: 910px;
min-height: 418px;
float: left;
background-image: url(../pics/layout/hintergrund_content.png);
}

.subnavi {
float: left;
width: 259px;
height: 398px;
}


.subnavi ul {
list-style-type: none;
padding-left: 0px;
margin-top: -6px;
}

.subnavi a {
padding: 4px 5px 4px 20px;
display: block;
width: 200px;
text-decoration: none;
color: #FFFFFF;
margin-bottom: 5px;
font-size: 12px;
}

.subnavi a:hover {
background-color: #FFFFFF;
color: #e4183a;
}


.portraits {
font-size: 10px;
color: #FFFFFF;
padding: 0 15px 0 0px;
}

.portraits img {
border-right: 5px solid #FFFFFF;
}


.content {
float: left;
width: 587px;
min-height: 398px;
background-color: #FFFFFF;
padding: 20px 20px 0 20px;
color: #555;
font-size: 13px;
line-height: 17px;
}

.content_pic {
	margin-bottom: 10px;
}


.content h1 {
font-size: 22px;
font-weight: normal;
color: #e4183a;
margin-bottom: 30px;
line-height: normal;
}


.eingabefeld {
border: 1px solid #686868;
width: 490px;
font-size: 12px;
}

.sicherheitseingabefeld {
border: 1px solid #686868;
}


.newseintrag {
border-bottom: 1px dashed #e4183a;
margin-bottom: 20px;
padding-bottom: 20px;
}

.newspics {
float: left;
width: 154px;
}

.newspics img {
float: left;
margin: 0 5px 5px 0;
border: 1px solid #000;
}

.newspics img:hover {
border: 1px solid #e4183a;
}

.newstext {
	float: right;
	width: 415px;
	margin-top: -15px;
}


.subnavi_footer {
float: left;
width: 219px;
height: 43px;
background-image: url(../pics/layout/hintergrund_subnavi_unten.png);
padding: 20px;
}

.content_footer {
float: left;
width: 611px;
height: 43px;
padding: 20px;
background-image: url(../pics/layout/hintergrund_content_unten.png);
}








/*////////////// MAIN KUNDEN //////////////*/


.main_kunden {
width: 910px;
min-height: 610px;
background-color: #e4183a;
}

.kunden_oben {
width: 867px;
background-image: url(../pics/layout/hintergrund_kunden_oben.png);
height: 46px;
color: #FFFFFF;
font-size: 18px;
padding: 30px 20px 10px 23px;
}

.kunden_content {
width: 859px;
min-height: 401px;
background-image:url(../pics/layout/hintergrund_kunden.png);
padding: 20px 0 15px 41px;
}

.kunden_unten {
width: 910px;
height: 83px;
background-image:url(../pics/layout/hintergrund_kunden_unten.png);
}


.tooltip {
position: relative;
}

.tooltip:hover {
background: transparent;
z-index: 100;
}

.tooltip span {
display: none;
}


.tooltip:hover span {
display: block;
position: absolute;
top: -1px;
left: -1px;
width: 130px;
height: 138px;
z-index: 100;
color: #686868;
border: 1px dashed #686868;
padding: 10px 10px 2px 10px;
background-image: url(../pics/layout/kunden_transparent.png);
font-size: 10px;
}





/*////////////// MAIN REFERENZEN //////////////*/


.main_referenzen {
width: 910px;
height: auto;
background-color: #e4183a;
}


.subnavi_ref_headline {
float: left;
width: 219px;
height: 46px;
background-image: url(../pics/layout/hintergrund_subnavi_ref_oben.png);
color: #FFFFFF;
font-size: 18px;
padding: 30px 20px 10px 20px;
}


.subnavi_ref_hintergrund {
background-image: url(../pics/layout/hintergrund_subnavi_ref.png);
background-repeat: no-repeat;
background-position: top;
}


.header_ref {
float: left;
width: 631px;
height: 46px;
padding: 25px 20px 15px 0px;
background-image: url(../pics/layout/hintergrund_ref_oben.png);
font-size: 24px;
color: #FFFFFF;
overflow: visible;
}

.content_ref_wrapper {
width: 910px;
min-height: 418px;
float: left;
}


.ref_content {
float: left;
width: 651px;
min-height: 418px;
color: #FFFFFF;
font-size: 14px;
background-image:url(../pics/layout/hintergrund_content_ref.png);
background-position: top;
background-repeat: no-repeat;
}


.ref_bild_wrapper {
	height: 335px;
	width: 607px;
	padding: 20px 0px 0 20px;
	background-color: #cc0532;
	margin-top: 55px;	
}

.ref_steuerung {
	float: right;
	margin-top: 250px;
}

.ref_steuerung a {
	color: #FFF;
	display: block;
	text-align: center;
	width: 15px;
	padding-left: 1px;
	margin-bottom: 5px;
}

.ref_steuerung a:hover {
	cursor: pointer;
	background-color: #FFF;
	color: #e4183a;
	text-decoration: none;
}

#ref_bild {
height: 335px;
width: 587px;
overflow: hidden;
float: left;
}

.ref_beschreibung {
background-color: #FFFFFF;
margin-top: 1px;
width: 587px;
color: #686868;
font-size: 12px;
padding: 10px 20px 10px 20px;
}


.ref_content h1 {
font-size: 16px;
font-weight: normal;
color: #e4183a;
}


.subnavi_ref_footer {
float: left;
width: 219px;
height: 53px;
background-image: url(../pics/layout/hintergrund_subnavi_ref_unten.png);
padding: 20px;
}

.content_ref_footer {
float: left;
width: 611px;
height: 53px;
padding: 20px;
background-image: url(../pics/layout/hintergrund_ref_unten.png);
}


.thumbs img {
float: left;
margin: 0 13px 13px 0;
border: 1px solid #686868;
}


.thumbs img:hover {
border: 1px dashed #686868;
}









/*////////////// FOOTER //////////////*/


.footer {
width: 874px;
height: 250px;
background-image: url(../pics/layout/hintergrund_footer.gif);
margin-top: 2px;
padding: 55px 0 50px 36px;
color: #686868;
}

.stichworte {
width: 200px;
height: 210px;
float: left;
font-weight: bold;
font-size: 14px;
letter-spacing: 1px;
}

.footer a {
text-decoration: none;
color: #686868;
}

.footer a:hover {
color: #e4183a;
}


.stichworte ul {
list-style-type: none;
padding-left: 0px;
line-height: 18pt;
margin-top: 11px;
}


.news {
width: 335px;
height: 210px;
overflow: auto;
float: left;
margin-left: 63px;
font-size: 11px;
line-height: 16px;
}

.news .date {
font-size: 9px;
}

.news h1 {
font-size: 14px;
font-weight: bold;
margin: 0px;
padding: 0px;
}

.mehr a {
display: block;
padding: 3px;
width: 65px;
background-color: #e4183a;
color: #FFFFFF;
font-size: 10px;
text-align: center;
}

.mehr a:hover {
padding: 2px;
border: 1px dashed #FFFFFF;
color: #FFFFFF;
background-color: #e4183a;
}

.shorttext a {
	color: #e4183a;
}

.shorttext a:hover {
	text-decoration: underline;
}

.informationen {
margin-top: 11px;
margin-left: 58px;
font-weight: bold;
float: left;
font-size: 12px;
width: 200px;
height: 200px;
}

.rechtliches {
width: 835px;
float: left;
height: 20px;
margin-top: 60px;
font-size: 10px;
}