/* -- INFO -----------------------------------------------------------------------
# Project:			von Hacht & Partner UG
# File:				style.css
# Markup:			2.1
# Author:			Marcus Milbradt
------------------------------------------------------------------------------- */

/* -- Colors ------------------------------------------------------------------
Orange		#ee7f01
Gr�n		#34741f
------------------------------------------------------------------------------- */

/*-| Independent &  general Classes [START] */
* { margin:0; padding:0; }
.setleft-childs * { float: left; }
.clearall { float: none; clear: both; height: 0em; line-height: 0em; font-size: 0em; }
ul { list-style:none; }
.invisible {display:none;}
body { padding:0; font: normal 12px Arial, Helvetica, sans-serif; color:#343434; background-color:#efefef; }
.setAlign { text-align: center; }
	.divheader { background:#fff;border-top:9px solid #303030;}
.setCenter { margin: auto; width: 980px; text-align: left; }
span.telefon { padding: 0 0 0 14px; background:url('../img/icon_fon.gif') no-repeat 0px 4px; }
span.telefax { padding: 0 0 0 14px; background:url('../img/icon_fax.gif') no-repeat 0px 4px; }
span.mail { padding: 0 0 0 14px; background:url('../img/icon_mail.gif') no-repeat 0px 5px; }
/*-| Independent & general Classes [STOP!] */

/*-| Header [START] */
#header { float:left; width:980px; padding:0 0 20px 0;}
#header h1 { float:left; width:288px; height:56px; background:url('../img/logo.gif') no-repeat 0px 20px; padding: 20px 0 0 0;}
#header h1 a { display:block; float:left;width:288px; height:56px;}
#header h1 span, #header p {display:none;}
#header #navmain { float:right; }
#header #navmain ul { height:67px; overflow:hidden;float:right;}
#header #navmain li { width:130px; height:67px;overflow:hidden;}
#header #navmain li a { width:130px; height:67px;overflow:hidden;background-position: 0px -67px;}
#header #navmain li a:hover, #header #navmain li.active a, #header #navmain li.trail a {background-position: 0px 0px;}
#header #navmain li span { display:none; }
#header #navmain li.nm_willkommen a { background-image:url('../img/nm_willkommen.gif');}
#header #navmain li.nm_ueberuns a { background-image:url('../img/nm_ueberuns.gif');}
#header #navmain li.nm_leistungen a { background-image:url('../img/nm_leistungen.gif');}
#header #navmain li.nm_projekte a { background-image:url('../img/nm_projekte.gif');}
#header #navmain li.nm_kontakt a { background-image:url('../img/nm_kontakt.gif');}
/*-| Header [STOP!] */

#visual { float:left; width:980px; padding-top:15px;}

/*-| CONTENT [START] */
#wrapper { float:left; width:980px;}
.ce_text { clear:both;} 
#wrapper p.readmore a { display:block;float:left;color:#fff; background-color:#303030;font-size:12px; font-weight:bold;padding:5px 7px; text-decoration:none;}
#wrapper p.readmore a:hover { background-color:#ee7f01;text-decoration:none;}


 


/*--| main [START] */
#main { float:left; width:604px; padding:0 30px 30px 0; color:#666;}
#main strong { font-weight:normal;color:#303030;}
#main h2 { border-bottom:6px solid #efefef;height:47px; background-repeat:no-repeat;margin-bottom:15px;border-top:15px solid #fff;}
#main h2 span { display:none;}
#main h3 { line-height:16px; font-size:12px;padding:0 0 10px 0; font-weight:bold;color:#555555;}
#main h4 { line-height:16px; font-size:11px;padding:0px 0 0px 0; font-weight:bold; text-transform:uppercase;color:#555555;}
#main p { line-height:16px; font-size:12px;text-align:left;padding:0 0 10px 0;}
#main a { color:#666; text-decoration:underline; }
#main a:hover { color:#ee7f01; text-decoration:none; }
#main ul {
	padding:0 0 6px 0;
}
#main ul li { padding: 0 0 4px 14px;background:url('../img/icon_li.gif') no-repeat 2px 5px;}
/*--| ce_accordion [START] */
.ce_accordion { margin: 0px; border-bottom: 1px solid #d8dfea; padding:0 0 0 0; }
.ce_accordion .toggler { height:18px;padding:3px 0 0 25px;background: url('../img/acc_closed.gif') no-repeat; font-size: 12px; font-weight: bold; cursor: pointer; color:#555555; text-transform:uppercase; text-decoration:underline; letter-spacing:1px;}
.ce_accordion .accordion { padding:0 10px 0 25px; }
.ce_accordion .active { background-image: url('../img/acc_open.gif'); color:#ee7f01; text-decoration:none;}
/*--| ce_accordion [STOP] */
/*--| Projekte [START] */
.nm_projekte .ce_accordion { }
.nm_projekte .ce_accordion .accordion { padding:0px; }
div.project { float:left; width:598px; background:#efefef; border:3px solid #efefef; border-top:1px solid #d8dfea; padding-top:2px; }
div.pro_img { float:left; width:226px; padding:8px 10px 0 8px; }
div.pro_img a img, div.pro_img img { float:left; padding:2px; border:1px solid #ccc; background:#fff;}
div.pro_img a:hover img { border:1px solid #ee7f01; background:#fff;}
div.pro_text { float:left; width:354px; padding:9px 0 0 0; }
#main div.pro_text h3 { font-size:18px; border-bottom:1px dotted #ccc; }
#main div.pro_text h3 a { text-decoration:none; }
#main div.pro_text h3 a span { padding-right:17px; background:url('../img/icon_projektlink.gif') no-repeat right 4px; }
#main div.pro_text h3 a:hover span { background-position:right -46px; }
#main div.pro_text ul.skills { float:right; width:135px; background:#efefef; padding:0px;}
#main div.pro_text ul.skills li { float:left; width:110px; background:url('../img/checked.gif') no-repeat 10px 1px; padding: 0 0 2px 25px; font-size:11px;}
#main div.pro_text p.pro_first {padding-top:5px;}
#main div.pro_text p span { color:#34741f; text-transform:uppercase; font-weight:normal; font-size:11px; }
#main div.pro_text p.small {border-bottom:1px dotted #ccc;font-size:11px;padding-top:5px;padding-bottom:5px;}
#main div.pro_text p.small span { color:#34741f;font-weight:normal; text-transform:none; }
#main div.pro_text p.zitat { padding-bottom:2px; }
#main div.pro_text p.zitat span { font-style:italic; color:#ee7f01;}
#main div.pro_text p.zitatautor { font-size:10px; line-height:normal; font-weight:bold;}

div.pp { float:left;padding-bottom:3px;}
span.plabel { float:left; width:85px; font-size:11px;}
span.pinfo { float:left; width:190px;}
span.smalltext { font-size:10px;padding-bottom:0px;color:#9a9a9a;}
ul.pinfo {float:left; width:190px;}
div.leistungen {padding-top:5px;}
/*--| Projekte [STOP!] */


/*---| H2-Ersetzung [START] */
#main .hl_willkommen h2 {background-image:url('../img/hl_willkommen.gif');}
#main .hl_ideen h2 {background-image:url('../img/hl_ideen.gif');}
#main .hl_impressum h2 {background-image:url('../img/hl_impressum.gif');}
#main .hl_magento h2 {background-image:url('../img/hl_magento.gif');}
#main .hl_typolight h2 {background-image:url('../img/hl_typolight.gif');}
#main .hl_disclaimer h2 {background-image:url('../img/hl_disclaimer.gif');}
#main .hl_referenzen h2 {background-image:url('../img/hl_referenzen.gif');}
#main .hl_danke h2 {background-image:url('../img/hl_danke.gif');}
#main .hl_leistungen h2 {background-image:url('../img/hl_leistungen.gif');}
#main .hl_kontakt2 h2, #main h2.hl_kontakt2 {background-image:url('../img/hl_kontakt2.gif');}
#main .hl_waswirmachen h2, #main h2.hl_waswirmachen {background-image:url('../img/hl_waswirmachen.gif');}
#main .hl_projekt h2, #main h2.hl_projekt {background-image:url('../img/hl_projekt.gif');}
#main .hl_frohesfest h2, #main h2.hl_frohesfest {background-image:url('../img/hl_frohesfest.gif');}
/*---| H2-Ersetzung [STOP!] */
/*---| Kontakt Main [START] */
#main .formbody, #main .ce_form {float:left; width:346px; overflow:hidden;}
#main .formbody label { float:left; clear:both; font-size:11px; background:url('../img/icon_label.gif') no-repeat 5px 8px; padding:2px 0 2px 19px;}
#main .formbody p.error { float:left; font-size:11px; color:#ee7f01; padding:2px 0 2px 5px;margin:0px;line-height:normal;}
#main .formbody input, #main .formbody textarea { font: normal 11px Arial, Helvetica, sans-serif; color:#333; font-weight:bold; padding: 3px 4px; float:left; clear:both; border:1px solid #ccc; background:url('../img/tex_input.gif') repeat-x #fff;}
#main .formbody input { width:336px; }
#main .formbody input.captcha, #right .formbody input.captcha {width:30px;}
#main .formbody span.captcha_text, #right .formbody span.captcha_text {float:left;font-size:11px;padding-left:5px;padding-top:4px;}
#main .formbody div.explanation { float:left; width:346px; padding-bottom:2px; }
#main .formbody div.explanation p { float:left; width:346px;border-bottom:1px dotted #ccc; padding-bottom:5px; }
#main .formbody textarea { width:336px; height:55px;}
#main .formbody input#ctrl_5 { width:auto; height:auto;border:0px; padding:0px; margin:8px 0 0 5px;}
#kontakt_bild { float:left; width:238px;clear:none;padding: 0 0 0 20px; }
#kontakt_bild img { padding:2px; border:1px solid #ccc; background:#fff;}
/*---| Kontakt Main [STOP!] */
/*--| main [STOP!] */
/*--| right [START] */
#right { float:left; width:346px; color:#666; padding:0 0 30px 0;}
#right h3 { border-bottom:6px solid #efefef;height:47px; background-repeat:no-repeat;margin-bottom:15px;border-top:15px solid #fff;clear:both;}
#right h3 span { display:none; }
#right p { line-height:15px; font-size:11px;text-align:left;padding:0 0 10px 0;}
#right a { color:#666; text-decoration:underline; }
#right a:hover { color:#ee7f01; text-decoration:none; }
/*---| H3-Ersetzung [START] */
#right .hl_konzeption_beratung h3 {background-image:url('../img/hl_konzeption_beratung.gif');}
#right .hl_entwicklung_design h3 {background-image:url('../img/hl_entwicklung_design.gif');}
#right .hl_tvh h3 {background-image:url('../img/hl_tvh.gif');}
#right .hl_mm h3 {background-image:url('../img/hl_mm.gif');}
#right .hl_weiterewerkzeuge h3 {background-image:url('../img/hl_weiterewerkzeuge.gif');}
#right .hl_unserfokus h3 {background-image:url('../img/hl_unserfokus.gif');}
#right .hl_daten h3 {background-image:url('../img/hl_daten.gif');}
#right .hl_gleichnochmal h3, #right h3.hl_gleichnochmal {background-image:url('../img/hl_gleichnochmal.gif');}
#right .hl_marketing_optimierung h3 {background-image:url('../img/hl_marketing_optimierung.gif');}
#right .hl_kontakt h3, #right h3.hl_kontakt { background-image:url('../img/hl_kontakt.gif'); }
#right .hl_welcometomagento h3, #right h3.hl_welcometomagento { background-image:url('../img/hl_welcometomagento.gif'); }
#right .hl_typolighteinfuehrung h3, #right h3.hl_typolighteinfuehrung { background-image:url('../img/hl_typolighteinfuehrung.gif'); }
/*---| H3-Ersetzung [STOP!] */

/*---| Kontakt rechts [START] */
#right .formbody {float:left; width:346px; overflow:hidden;}
#right .formbody label { float:left; clear:both; font-size:11px; background:url('../img/icon_label.gif') no-repeat 5px 8px; padding:2px 0 2px 19px;}
#right .formbody p.error { float:left; font-size:11px; color:#ee7f01; padding:2px 0 2px 5px;margin:0px;line-height:normal;}
#right .formbody input, #right .formbody textarea { font: normal 11px Arial, Helvetica, sans-serif; color:#333; font-weight:bold; padding: 3px 4px; float:left; clear:both; border:1px solid #ccc; background:url('../img/tex_input.gif') repeat-x #fff;}
#right .formbody input { width:336px; }
#right .formbody div.explanation { float:left; width:346px; padding-bottom:2px; }
#right .formbody div.explanation p { float:left; width:346px;border-bottom:1px dotted #ccc; padding-bottom:5px; }
#right .formbody textarea { width:336px; height:55px;}
#right .formbody input#ctrl_5 { width:auto; height:auto;border:0px; padding:0px; margin:8px 0 0 5px;}
/*---| Kontakt rechts [STOP!] */

#right .mod_navigation ul { float:left; width:346px; }
#right .mod_navigation ul li { float:left; width:165px; height:40px; }
#right .mod_navigation ul li.ltypolight {padding-right:16px;}
#right .mod_navigation ul li.lmagento {}
#right .mod_navigation ul li a span {display:none;}
#right .mod_navigation ul li a { float:left; width:165px; height:40px; background-repeat:no-repeat; background-position:0px 0px; }
#right .mod_navigation ul li a.ltypolight {background-image:url('../img/btn_typolight.gif');}
#right .mod_navigation ul li a.lmagento {background-image:url('../img/btn_magento.gif');}
#right .mod_navigation ul li a:hover, #right .mod_navigation ul li.active a, .nm_leistungen #right .mod_navigation ul li a {background-position:0px -50px; }

.r2spalt { float:left; width:346px; }
.r2spalt .r2spalt_l { float:left; width:165px; padding-right:16px; padding-top:4px;}
.r2spalt .r2spalt_r { float:left; width:165px;  padding-top:4px;}
#right .r2spalt p { padding-bottom:6px; }
#wrapper .r2spalt p.readmore a { padding:5px 0px; width:165px; text-align:center;}

#tools { float:left;width:345px; padding-right:1px; }
#tools img { float:left; padding:0 15px 10px 0;}
#tools img.third { padding:0 0 10px 0;}

#zleistungen { float:left; width:346px;padding:15px 0 0 0;}
#zleistungen a { float:left; width:346px; height:25px; background:url('../img/btn_zleistungen.gif') no-repeat 0px 0px;}
#zleistungen a:hover {background-position:0 -50px;} 
#zleistungen span {display:none;}
/*--| right [STOP!] */
/*-| CONTENT [STOP!] */

/*-| Footer [START] */
#footer { float:left; width:980px; padding: 40px 0 45px 0;}
#footer p { float:left; color:#666; font-size:12px;padding-top:3px;}
#footer p a { color:#34741f; text-decoration:none;}
#footer p a:hover { color:#ee7f01; text-decoration:underline;}
#footer ul { float:right;}
#footer li { float:left; border-left: 20px solid #efefef;}
#footer ul a { float:left; color:#34741f; text-decoration:none;background:url('../img/validate.gif') no-repeat 0px 0px; padding: 3px 0 3px 27px;}
#footer ul a:hover { background-position: 0px -30px; color:#ee7f01; text-decoration:underline;}
/*-| Footer [STOP!] */ 

/*

.refouterbox {
	float:left;
	width:280px;
	height:150px;
	border: 8px solid #c8c7c3;
	margin:20px 20px 0 0;
	overflow:hidden;
	position:relative;
	cursor:pointer;
}

.refouterboxlink {
  text-decoration:none;
  color:#898989;
  padding-left:0px;
}


.refinnerbox {
	width:250px;
	padding:20px 15px 5px 15px;
	height:140px;
	left:0px;
	position:absolute;
	top:150px;
    background: url(../images/referenzia.png) #ddd;   
	color:#000;
	cursor:pointer;	
}

.refinnerbox_headline {
 	font-size:18px;
	color:#fff;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-weight:normal;
	margin:3px 0;
   display: block;
}


*/