body
{
	font-family: Arial, Helvetica, Verdana, sans-serif;
	margin: 0;
	width:100%;
	height:100%;
	color:#b3b3b3;
	font-size:12px;
	outline:none;
}

img
{
	border:0;
	outline:none;
}

.wapper
{
	margin:0px auto;
	position:relative;
	width:960px;
}

#header
{
	background-color:#222222;
	height:85px;
}

#header_main
{
	margin:0px auto;
	position:relative;
	width:960px;
	padding-top:15px;
}

input, textarea
{
	border: 1px solid #D9D9D9;
	background:#fff;
	padding:3px;
	outline:none;
	font-family: Arial, Helvetica, Verdana, sans-serif;
}

textarea
{
	font-size:12px;
}

textarea:focus, input:focus
{
	border: 1px solid #febf01;
	background:#fff;
	padding:3px;
	
}

input:hover, textarea:hover
{
	border: 1px solid #febf01;
	background:#fff;
	padding:3px;
}

.margin_20
{
	margin-top:20px;
}

.margin_10
{
	margin-top:10px;
}

.margin_5
{
	margin-top:5px;
}

.select
{
	border:1px solid #D9D9D9;
	margin-left:25px;
	padding:3px;
	width:173px;
	outline:none;
	color:#222222;
}

.select option
{
	margin:2px 0px;
	margin-left:5px;
	width:173px;
	outline:none;
	color:#222222;
}

.select:hover
{
	border:1px solid #febf01;
	margin-left:25px;
	padding:3px;
	width:173px;
	outline:none;
}

.select:focus
{
	border:1px solid #febf01;
	margin-left:25px;
	padding:3px;
	width:173px;
	outline:none;
}

.submit_anfrage
{
	background:url(img/jetzt_anfragen.png);
	width:138px;
	height:31px;
	display:block;
	border:0;
	cursor:pointer;
}

.submit_anfrage:hover
{
	background:url(img/jetzt_anfragen_hover.png);
	width:138px;
	height:31px;
	display:block;
	border:0;
	cursor:pointer;
}

.submit_bewerbung
{
	background:url(img/jetzt_bewerben.jpg);
	width:117px;
	height:26px;
	display:block;
	border:0;
	cursor:pointer;
}

.submit_bewerbung:hover
{
	background:url(img/jetzt_bewerben_aktiv.jpg);
	width:117px;
	height:26px;
	display:block;
	border:0;
	cursor:pointer;
}

#border_error
{
	border:1px solid #DA0809;
}

#submit
{
	float:right;
	margin-right:52px;
}

#submit_bewerbung
{
	float:right;
	margin-right:15px;
	margin-top:15px;
}

#success_anfrage
{
	border:4px solid #09da08;
	font-size:18px;
	font-weight:bold;
	padding:15px;
	text-align:center;
	margin-bottom:15px;
}

#error_anfrage
{
	border:4px solid #DA0809;
	font-size:18px;
	font-weight:bold;
	padding:15px;
	text-align:center;
	margin-bottom:15px;
}

.bewerbungsform
{
	border:1px solid #B3B3B3; padding:15px; margin-left:60px;
}

/*============================= CLOUD ==========================*/

.font_cloud_1
{
	color:#fff;
	font-size:8px;
	text-decoration:none;
}

.font_cloud_2
{
	color:#fff;
	font-size:14px;
	text-decoration:none;
	font-weight:bold;
}

.font_cloud_3
{
	color:#fff;
	font-size:10px;
	text-decoration:none;
}

.font_cloud_4
{
	color:#fff;
	font-size:16px;
	text-decoration:none;
}

.font_cloud_5
{
	color:#fff;
	font-size:9px;
	text-decoration:none;
}

.font_cloud_6
{
	color:#fff;
	font-size:12px;
	text-decoration:none;
	font-weight:bold;
}

.font_cloud_7
{
	color:#fff;
	font-size:11px;
	text-decoration:none;
}

.font_cloud_1:hover, .font_cloud_2:hover, .font_cloud_3:hover, .font_cloud_4:hover, .font_cloud_5:hover, .font_cloud_6:hover, .font_cloud_7:hover
{
	color:#febf01;
	text-decoration:none;
}
/*============================= CLOUD ==========================*/

/*============================= STANDS ==========================*/

.border_grey
{
	border-bottom: 1px dotted #222222;
	margin:30px 0px;
	padding-bottom:1px;
}

.border_grey_mid
{
	border-bottom: 1px dotted #999;
	margin:30px 0px;
	padding-bottom:1px;
}

.border_grey_light
{
	border-bottom: 1px dotted #cccccc;
	margin:15px 0px 5px 0px;
	padding-bottom:1px;
}

.clear
{
	clear:both;
}

.left
{
	float:left;
}

.right
{
	float:right;
}

.black_big
{
	color:#222222;
	font-size:32px;
	margin:0;
}

.black_mid
{
	color:#222222;
	font-size:18px;
	margin:0;
}

.black_small
{
	color:#222222;
	font-size:14px;
	font-weight:bold;
	margin:0;
}

.black_normal
{
	color:#222222;
	font-size:11px;
	font-weight:bold;
	margin:0;
}

.grey_small
{
	color:#b3b3b3;
	font-size:14px;
	font-weight:normal;
	margin:0;
}
.orange_big
{
	color:#febf01;
	font-size:32px;
	margin:0;
}

.orange_mid
{
	color:#febf01;
	font-size:18px;
	margin:0;
}

.orange
{
	color:#febf01;
}

.link_black_kursiv
{
	color:#222222;
	font-size:10px;
	font-style:italic;
	margin:0;
}

.link_black_kursiv:hover
{
	color:#febf01;
	font-size:10px;
	font-style:italic;
	margin:0;
}

.link_smallnavi_kursiv
{
	color:#222222;
	font-size:10px;
	font-style:italic;
	margin:0;
	text-decoration:none;
}

.link_smallnavi_kursiv:hover
{
	color:#febf01;
	font-size:10px;
	font-style:italic;
	margin:0;
}

.grey_kursiv
{
	color:#CDCDCD;
	font-size:10px;
	font-style:italic;
	margin:0;
}

.white_kursiv
{
	color:#fff;
	font-size:10px;
	font-style:italic;
	margin:0;
}

.white_mid
{
	color:#fff;
	font-size:14px;
	margin:0;
}

.white_big
{
	color:#fff;
	font-size:34px;
	margin:0;
}

.link_white
{
	color:#fff;
	font-size:14px;
	text-decoration:none;
}

.link_white:hover
{
	color:#febf01;
	font-size:14px;
	text-decoration:none;
}

.link_orange
{
	color:#febf01;
	text-decoration:underline;
}

.link_orange:hover
{
	color:#fff;
}

.link_black_orange
{
	color:#222222;
	text-decoration:underline;
}

.link_black_orange:hover
{
	color:#febf01;
	text-decoration:underline;
}

.link_black
{
	color:#222222;
	text-decoration:underline;
}

.link_black:hover
{
	color:#fff;
}

.more
{
	background:url(img/more.png) no-repeat;
	display:block;
	height:15px;
	width:48px;
	font-size:10px;
	color:#fff;
	text-align:center;
	padding:1px 0px 0px 4px;
	cursor:pointer;
	margin-top:-12px;
	text-decoration:none;
}

.more:hover
{
	background:url(img/more_aktiv.png) no-repeat;
	display:block;
	height:15px;
	width:48px;
	font-size:10px;
	color:#fff;
	text-align:center;
	padding:1px 0px 0px 4px;
	cursor:pointer;
	margin-top:-12px;
	text-decoration:none;
}

.margintop30
{
	margin-top:30px;
}

.margintop15
{
	margin-top:15px;
}

.margintop25
{
	margin-top:25px;
}
/*============================= STANDS ==========================*/

/*============================= NAVI ==========================*/

#navigation
{
	float:right;
	margin-top:10px;
}

.home
{
	background:url(img/navi/home.png);
	display:block;
	height:32px;
	width:94px;
	float:left;
}

.home:hover
{
	background:url(img/navi/home_aktiv.png);
	display:block;
	height:32px;
	width:94px;
	float:left;
}

#home_aktiv
{
	background:url(img/navi/home_aktiv.png);
	display:block;
	height:32px;
	width:94px;
	float:left;
}

.webseite
{
	background:url(img/navi/webseite.png);
	display:block;
	height:32px;
	width:123px;
	float:left;
}

.webseite:hover
{
	background:url(img/navi/webseite_aktiv.png);
	display:block;
	height:32px;
	width:123px;
	float:left;
}

#webseite_aktiv
{
	background:url(img/navi/webseite_aktiv.png);
	display:block;
	height:32px;
	width:123px;
	float:left;
}

.grafik
{
	background:url(img/navi/grafik.png) no-repeat;
	display:block;
	height:32px;
	width:113px;
	float:left;
}

.grafik:hover
{
	background:url(img/navi/grafik_aktiv.png) no-repeat;
	display:block;
	height:32px;
	width:113px;
	float:left;
}

#grafik_aktiv
{
	background:url(img/navi/grafik_aktiv.png) no-repeat;
	display:block;
	height:32px;
	width:113px;
	float:left;
}

.referenzen
{
	background:url(img/navi/referenzen.png);
	display:block;
	height:32px;
	width:153px;
	float:left;
}

.referenzen:hover
{
	background:url(img/navi/referenzen_aktiv.png);
	display:block;
	height:32px;
	width:153px;
	float:left;
}

#referenzen_aktiv
{
	background:url(img/navi/referenzen_aktiv.png);
	display:block;
	height:32px;
	width:153px;
	float:left;
}

.kontakt
{
	background:url(img/navi/kontakt.png);
	display:block;
	height:32px;
	width:124px;
	float:left;
}

.kontakt:hover
{
	background:url(img/navi/kontakt_aktiv.png);
	display:block;
	height:32px;
	width:124px;
	float:left;
}

#kontakt_aktiv
{
	background:url(img/navi/kontakt_aktiv.png);
	display:block;
	height:32px;
	width:124px;
	float:left;
}

/*============================= NAVI ==========================*/

/*============================= SUBNAVI ==========================*/

#subnavi
{
	float:right;
}

.werde_partner
{
	background:url(img/navi/werde_partner.jpg) no-repeat;
	display:block;
	height:44px;
	width:154px;
	float:left;
}

.werde_partner:hover
{
	background:url(img/navi/werde_partner_aktiv.jpg) no-repeat;
	display:block;
	height:44px;
	width:154px;
	float:left;
}

#werde_partner_aktiv
{
	background:url(img/navi/werde_partner_aktiv.jpg) no-repeat;
	display:block;
	height:44px;
	width:154px;
	float:left;
}

.leistungen
{
	background:url(img/navi/leistungen.png) no-repeat;
	display:block;
	height:44px;
	width:108px;
	float:left;
}

.leistungen:hover
{
	background:url(img/navi/leistungen_aktiv.png) no-repeat;
	display:block;
	height:44px;
	width:108px;
	float:left;
}

#leistungen_aktiv
{
	background:url(img/navi/leistungen_aktiv.png) no-repeat;
	display:block;
	height:44px;
	width:108px;
	float:left;
}



.partner
{
	background:url(img/navi/partner.png) no-repeat;
	display:block;
	height:44px;
	width:97px;
	float:left;
}

.partner:hover
{
	background:url(img/navi/partner_aktiv.png) no-repeat;
	display:block;
	height:44px;
	width:97px;
	float:left;
}

#partner_aktiv
{
	background:url(img/navi/partner_aktiv.png) no-repeat;
	display:block;
	height:44px;
	width:97px;
	float:left;
}

.impressum
{
	background:url(img/navi/impressum.png) no-repeat;
	display:block;
	height:44px;
	width:111px;
	float:left;
}

.impressum:hover
{
	background:url(img/navi/impressum_aktiv.png) no-repeat;
	display:block;
	height:44px;
	width:111px;
	float:left;
}

#impressum_aktiv
{
	background:url(img/navi/impressum_aktiv.png) no-repeat;
	display:block;
	height:44px;
	width:111px;
	float:left;
}


/*============================= SUBNAVI ==========================*/

/*============================= FOOTER ==========================*/

#footer
{
	background-color:#222222;
	color:#fff;
	padding:15px 0px;
}

.footer_navi
{
	float:left;
	margin-top:15px;
}

#fosoter li
{
	
}

.footer_ul
{
	float:left; list-style-type:none; padding:0px 0px 0px 15px; margin-top:6px;
}

.footer_ul li
{
	border-bottom:1px dotted #cccccc; width:150px; padding:10px 0px;
}

/*============================= RACK ==========================*/


/*============================= INDEX ==========================*/

.headbox
{
	font-size:14px;
	width:330px;
	float:left;
}

#leistungen
{
	background-color:#febf01;
	width:100%;
	margin-top:-60px;
	height:350px;
}

#projekt
{
	background:url(img/aktuelles_projekt.png);
	display:block;
	height:313px;
	width:211px;
	float:right;
	margin-top:-240px;
	cursor:pointer;
}

#projekt:hover
{
	background:url(img/aktuelles_projekt_aktiv.png);
	display:block;
	height:313px;
	width:211px;
	float:right;
	margin-top:-240px;
	cursor:pointer;
}

.mehr_projekte
{
	background:url(img/mehr_projekte.png);
	display:block;
	height:26px;
	width:114px;
	float:right;
}

.mehr_projekte:hover
{
	background:url(img/mehr_projekte_aktiv.png);
	display:block;
	height:26px;
	width:114px;
	float:right;
}

.mehr_lesen
{
	background:url(img/mehr_lesen.png);
	display:block;
	height:26px;
	width:115px;
	float:right;
}

.mehr_lesen:hover
{
	background:url(img/mehr_lesen_aktiv.png);
	display:block;
	height:26px;
	width:115px;
	float:right;
}

.anfrage
{
	background:url(img/anfrage.png);
	display:block;
	height:26px;
	width:114px;
	float:right;
}

.anfrage:hover
{
	background:url(img/anfrage_aktiv.png);
	display:block;
	height:26px;
	width:114px;
	float:right;
}

.pop_up
{
	width:250px; height:180px; display:none;position:absolute; margin-left:500px;
}

.projekt_link
{
	float:right; margin-right:50px;margin-top:5px; color:#222222;
}

.pop_black
{
	background-color:#222222; padding:10px;
}
.pop_orange
{
	background-color:#FEBF01; padding:10px; color:#222;
}

#webdesign
{
	padding:0px 0px 15px 0px;
	color:#222222;
	width:260px;
	float:left;
}

#grafik
{
	padding:0px 0px 15px 0px;
	color:#222222;
	width:260px;
	float:left;
	margin-left:80px;
}

.content_main
{
	margin:0px 15px;
}

.content_box
{
	width:260px;
	float:left;
	margin-right:50px;
}

.content_foot
{
	margin-top:50px;
}




.sliderwrapper{
position: relative; /*leave as is*/
overflow: hidden; /*leave as is*/
width: 680px; /*width of featured content slider*/
height: 278px;
float:left;
font-weight:bold;
}



.sliderwrapper .contentdiv{
visibility: hidden; /*leave as is*/
position: absolute; /*leave as is*/
left: 0;  /*leave as is*/
top: 0;  /*leave as is*/
padding: 5px;
width: 680px; /*width of content DIVs within slider. Total width should equal slider's inner width (390+5+5=400) */
height: 100%;
}

.pagination{
width: 680px; /*Width of pagination DIV. Total width should equal slider's outer width (400+10+10=420)*/
padding: 4px 0px 4px 2px;
float:left;
background: url(img/slider_back.png) no-repeat;
}

.pagination a{
padding: 2px 6px;
text-decoration: none; 
color: #222222;
margin-left:2px;
outline:none;
}

.pagination a:hover, .pagination a.selected{
color: #222222;
background: url(img/toc.png);
padding:2px 6px;
}

/*============================= INDEX ==========================*/

/*============================= WEBSEITE ==========================*/

.sublink
{
	
	text-decoration:none;
	color:#cccccc;
	font-size:16px;
	font-weight:bold;
	padding:10px 30px 10px 10px;
	background-color:#f2f2f2;
	border-left:4px solid #222222;
	
}

.sublink:hover
{
	text-decoration:none;
	color:#fff;
	font-size:16px;
	font-weight:bold;
	padding:10px 30px 10px 10px;
	background-color:#222222;
	border-left:4px solid #febf01;
}


#subnavi_content ul
{
	list-style-type:none;
	padding:0;
	margin:10px 0px;
	
}

#subnavi_content li
{
	height:40px;
	width:215px;
	
}

#webdesign_aktiv, #programmierung_aktiv, #cms_aktiv, #seo_aktiv, #optimierung_aktiv, #preise_aktiv, #grafikdesign_aktiv, #logodesign_aktiv, #flyer_aktiv, visitenkarten_aktiv, #speisekarten, #corporatedesign_aktiv, #grafik_preise_aktiv, #grafik_corp_aktiv, #grafik_logo_aktiv,
#grafik_flyer_aktiv, #grafik_visit_aktiv, #ref_webdesign_aktiv, #ref_grafikdesign_aktiv, #ref_alle_aktiv
{
	text-decoration:none;
	color:#fff;
	font-size:16px;
	font-weight:bold;
	padding:10px 30px 10px 10px;
	background-color:#222222;
	border-left:4px solid #febf01;
}

.smallnavi
{
	margin-bottom:25px;
	
}
/*============================= WEBSEITE ==========================*/

/*============================= REFERENZEN ==========================*/


.aktuell_ul li
{
	list-style-image: url(img/inklusive.png);
	margin:3px 0px 3px 80px;
	width:210px;
}


/*============================= REFERENZEN ==========================*/



/*===============================Blätterfunktion==================================*/

.blaetterfunc
{
	padding:0px 3px; 
	text-decoration:none;
	color:#222222;
}

.blaetterfunc:hover
{
	padding:0px 3px; 
	text-decoration:underline;
	color:#222222;
}

.blaetterfunc_border
{
	padding:2px 6px;
	 text-decoration:none;
	 background:url(img/toc.png) no-repeat;
	color:#fff;
}

.blaetterfunc_small
{
	text-decoration:none;
	color:#202020;
	padding: 2px 6px;
	
}

.blaetterfunc_small:hover
{
	padding:2px 6px;
	 text-decoration:none;
	 background:url(img/toc.png) no-repeat;
	color:#fff;
	
}

#facebook
{
	background:url(img/facebook.png) no-repeat;
	width:43px;
	height:123px;
	display:block;
}

#facebook:hover
{
	background:url(img/facebook_aktiv.png) no-repeat;
	width:43px;
	height:123px;
	display:block;
}

#twitter
{
	background:url(img/twitter.png) no-repeat;
	width:43px;
	height:124px;
	display:block;
	margin-top:5px;
}

#twitter:hover
{
	background:url(img/twitter_aktiv.png) no-repeat;
	width:43px;
	height:124px;
	display:block;
	margin-top:5px;
}