@charset "utf-8";
/*
 **********************************************
 * CSS Document COPYRIGHT by GEKKOMEDIA e.K.  *
 ********************************************** 
*/
/*---------------basicstyles-------*/
body {background: #CCC url(img/bg-body.jpg) no-repeat center top; font: 13px/22px "Lucida Sans", Arial, sans-serif; color: #3A444E;	text-decoration: none; margin: 0px; padding: 0px}
img {border:none}
#seo {width:300px; position:absolute; top:0px; left:-5000px;}
#outer {width:970px; position:absolute; top:0px; left:50%; margin:0px 0px 0px -485px;z-index:2}
#logo {float: left; width:155px; height:120px; margin: 25px 0px 0px 3px}
#navigation {float:right; width:715px; height:60px; margin:75px 18px 30px 0px;overflow:visible;z-index:500}
#contentbild {top:165px; left:0px; width:950px; height:255px;padding:0px 15px 0px 22px; background:url(img/bg-contentbild.png) 20px 0px no-repeat}
#contentbild img { padding: 2px 0px 0px 0px}
#content {padding:0px 10px 15px 24px; width:936px; margin: 15px 0px 0px 0px}
#footer { padding:25px 10px 15px 24px; width:936px; margin: 15px 0px 15px 0px; background:url(img/bg-footer.png) no-repeat center top}
#gekkocopyright {padding: 15px; text-align:right}

a:link, a:visited { text-decoration:none; color:#000000}
a:hover, a:active {color:#CC0000}
.copy:link, .copy:visited {	font-size: 0.8em; color: #666}
.copy:hover {color:#CC0000}
a.moreinfosslider:link, a.moreinfosslider:visited  { text-align:center; padding:3px 0px 0px 0px; margin: 0px 0px 0px 20px;font-size:1em; text-transform:uppercase; background:url(img/bg-moreinfos.png) no-repeat 0px 0px; width:136px; height:30px; color:#CC0000; display:block }
a.moreinfosslider:hover, a.moreinfosslider:active  { color:#FFF; background:url(img/bg-moreinfos.png) 0px -42px no-repeat; }

a.moreinfoscontent:link, a.moreinfoscontent:visited  { text-align:center; padding:3px 0px 0px 0px; margin: 0px;font-size:1em; text-transform:uppercase; background:url(img/bg-moreinfos.png) no-repeat 0px 0px; width:136px; height:30px; color:#CC0000; display:block }
a.moreinfoscontent:hover, a.moreinfoscontent:active  { color:#FFF; background:url(img/bg-moreinfos.png) 0px -42px no-repeat; }
a.contentlink:link, a.contentlink:visited { padding:0px 0px 0px 20px; background:url(img/linkpfeil.png) 0px -2px no-repeat }
a.contentlink:hover, a.contentlink:active { padding:0px 0px 0px 20px; background:url(img/linkpfeil.png) 0px -30px no-repeat}

a.w3chtml:link, a.w3chtml:visited { width:223px; height:42px; display:block; background:url(img/footerlink-img.png) no-repeat 0px 0px; margin:0px auto}
a.w3chtml:hover, a.w3chtml:active { width:223px; height:42px; display:block; background:url(img/footerlink-img.png) no-repeat 0px -42px; }
a.w3chtml span {display:none}
a.useff:link, a.useff:visited { width:223px; height:42px; display:block; background:url(img/footerlink-img.png) no-repeat 0px -84px; margin:0px auto}
a.useff:hover, a.useff:active { width:223px; height:42px; display:block; background:url(img/footerlink-img.png) no-repeat 0px -126px; }
a.useff span {display:none}


.clear {clear:both; height:1px}
.cleartrennershadow {clear:both; height: 45px; /*margin: 20px 0px 10px 0px; */background:url(img/bg-footer.png) no-repeat center center}
.cleartrenner { clear:both; margin:0px 0px 20px 0px; padding:10px 0px 0px 0px; width:936px;border-bottom: 1px solid #999; height: 1px;}
.higher { margin:30px 0px 30px 0px}
.nopadd {padding: 0px; margin:0px} /*nach dem h3-tags*/

/*---------------cufonheads-------*/
h1 { font-family: "Lucida Sans", Arial; font-size: 24px; line-height: 1.5em; color:#333333; text-transform:uppercase; padding:10px 0px 10px 0px; margin:0px}
h1.referenzen { color:#454545; padding:5px 0px 0px 0px; margin:0px}
h2 { font-family: "Lucida Sans", Arial; font-size: 18px; color:#454545; text-transform:uppercase; }
h3 { font-family: "Lucida Sans", Arial; font-size: 24px; color:#454545; text-transform:uppercase; padding:10px 0px 0px 0px; margin:0px}
h5 { font-family: "Lucida Sans", Arial; font-size: 18px; color:#666666; margin: 10px 0px 10px 0px;}
/* non cufon */
h4 { font-family: "Lucida Sans", Arial; font-size: 14px; color:#454545;font-weight:100}
h6 { font-family: "Lucida Sans", Arial; font-size: 1.2em; font-weight:bold; color:#454545;font-weight:100}

/*----------------neueHeader--------------*/
.contentheader {top:165px; left:0px; width:950px; height:230px;padding:0px 15px 0px 22px; overflow:visible;}
.slidertextcontent { width: 600px; position:absolute; z-index:5; padding:50px 0px 0px 5px;  }
.sliderimgcontent { width: 600px; z-index:4; float:right; text-align:right; height:225px;overflow:visible}
div.slidertextcontent h1  { padding:10px 0px 10px 20px; margin:0px; background:url(img/bg-trans80-h1.png) repeat-y}

/*---------------contentaufteilung-------*/
.contenthalb { width:430px}
.chr { padding: 0px 0px 0px 20px;float:right; width:430px}
.chl { padding: 0px 20px 0px 0px; float:left}
.contentdrittel { width:295px; margin: 0px 0px 10px 20px; padding: 1px 1px 1px 1px;	float:left;	overflow:hidden; /*background:#CCCCCC*/}
.contentdrittel-left { width:285px; padding: 0px 20px 0px 0px;float:left; border-right: 1px solid #CCCCCC }
.contentdrittel-right { width:285px; padding: 0px 0px 0px 20px;float:left; border-left: 1px solid #CCCCCC }
.contentviertel { width:207px; margin: 0px 0px 10px 10px; padding: 1px 1px 1px 1px;	float:left;	overflow:hidden}
.contentfuenf { width:175px; margin: 0px 0px 10px 10px; padding: 1px 1px 1px 1px;	float:left;	overflow:hidden}

.borderd { border: 1px solid #CCCCCC }
.borderimg {border: 1px solid #CCCCCC; padding:2px;}
.logorefs { height: 150px; overflow:hidden; border: 1px solid #CCCCCC }
.statsklein { height: 123px; overflow:hidden; border: 1px solid #CCCCCC }

.hervorgehoben { font-family: "Lucida Sans", Arial; font-size: 1.2em; line-height: 1.3em; color:#3A444E; padding:10px 0px 0px 0px; margin:0px; line-height:24px;}
.hackenliste { padding: 0px 0px 10px 25px; margin:0px; background: url(img/listenaufzaehler.png) no-repeat 0px 5px}

/*---------------themendivs-------*/
.webhostpro { background:url(../../images/webhosting/webhosting-pro.png) no-repeat top right; overflow:hidden}
.webhoststand { background:url(../../images/webhosting/webhosting-standard.png) no-repeat top right; overflow:hidden}
.webhostpro li, .webhoststand li {margin-left: -20px}
.googlemaps-klein { padding:5px;border: 1px solid #999; margin:10px 0px 10px 0px}
.googlemaps-klein a:link {display:block; background:#FFF; padding:5px; color:#3A444E}
.googlemaps-klein a:hover {background:#3A444E; color:#FFF}

.startseitenteaser { width:291px; margin: 0px 0px 10px 20px; padding: 3px; float:left; overflow:hidden; position:relative}
.startteaserbild { width:291px; height:200px; overflow:visible}
.startseitenteaser p { margin:0px; padding:0px 0px 10px 0px; font-size:1em; line-height:1.4em }
.teaserlink {padding: 0px 0px 0px 78px;}

/*---------------einzugsdivs-------*/
.threecols { margin:0px 0px 0px -20px}
.spaltenaufteiler-start { margin:0px 0px 0px -30px }
.outerdiv-viertelboxen {margin:0px 0px 0px -10px}

/*---------------navigation-------*/
#nav { float: right; margin:0; padding:0; font-size: 14px}
#nav li {float: left; position: relative; display: inline; list-style-type:none; margin: 0px 1px 0px 0px; width: 140px; z-index:500;}
#nav li.open, #nav li:hover { background:#FFF; color: #CC0000}
#nav li a {	display: block;	padding:5px; color: #444; text-align:center}
#nav li a:hover { color:#CC0000}
#nav li:hover ul {display: block}  
#nav li ul { display: none; position: absolute; top: 33px; left: 0px; width: 140px; padding:0px; margin:0px; background:#FFF;}
#nav li ul li {  float: none; font-size:12px; text-transform:uppercase; margin:0px; padding:0px;}
#nav li ul li a { padding: 7px 10px 7px 10px; display: block; border-bottom:1px solid #DDD; line-height:1.2em }
#nav li ul li a:hover { background: #FFF; color: #CC0000 }
#nav li a.active {	display: block;	padding:5px 25px 5px 25px; color: #CC0000; background:#FFF} 
#nav li ul li a.active {padding: 5px 10px 5px 10px; display: block; border-bottom:1px solid #E3E3E3;/* background: #FFF; */color: #CC0000;/* margin:0px*/}

/*---------------footer-------*/
.threecolsfooter { margin:0px 0px 0px -20px}
.contentdrittelfooter {width:291px; margin: 0px 0px 10px 20px; padding: 3px; float:left; overflow:hidden; position:relative}
.contentdrittelfooterlast {width:291px; margin: 0px 0px 10px 20px; padding: 3px; float:left; overflow:hidden; position:relative; text-align:center}
#footer ul {margin: 0px;padding: 0px;list-style-type: none;}
#footer ul li a:link, #footer ul li a:visited { color:#3A444E; line-height:1.1em; }
#footer ul li a:hover {color:#CC0000; }
#footer ul li ul { margin:0px; padding:0px;} 
#footer ul li ul li a:link {color:#3A444E }
#footer ul li ul li a:hover {color:#CC0000; }
#footer ul li ul li {list-style-position: outside; list-style-type: none; margin:0px;padding:0px}

.footermenu1 {width:145px; float:left; margin:0px; padding:0px; overflow:hidden}
.footermenu2 {float:left; padding:0px 0px 0px 15px;margin:0px;width:130px;overflow:hidden;}

/*---------------emailform-------*/
#EmailForm { width: 430px; text-align:left; border:none; margin-top:0px; padding-top:0px; }
#EmailForm.full { width: 100%; }
#EmailForm fieldset { border: none; margin:0px; padding:0px;}
#EmailForm fieldset ol { padding: 0px; margin: 0px}
#EmailForm fieldset li { list-style: none; border-bottom: 1px solid #CCC; min-height: 30px}
#EmailForm legend { display: none}
#EmailForm label { display: inline-block; line-height: 1.8; vertical-align: top; width: 150px;}
#EmailForm input { display: inline-block; width: 250px; margin: 4px 0px 0px 15px}
#EmailForm input.requiredValue {border: 1px solid #CC0000}
#EmailForm input#plz { display: inline-block; width: 50px; margin: 4px 0px 0px 15px}
#EmailForm input#ort { display: inline-block; width: 190px; margin: 4px 0px 0px 5px}
#EmailForm select {	display: inline-block; width: 250px;margin: 4px 0px 0px 15px}
#EmailForm textarea {
    border: 1px solid #ddd; 
    padding: 0 2px; margin: 0px 0px 5px 0px;
    height: 100px; width: 420px;
    line-height: 18px;
    background: #fff url(images/input-bg.gif) repeat-x top left;
	font-size: 13px;
}
#EmailForm textarea.requiredValue { border: 1px solid #CC0000}
#EmailForm input.button { border:none; width:250px;height:26px;background:url(img/bg-submitbutton.png) no-repeat 0px 0px; float:right; font-weight: bold}
#EmailForm input.button:hover { background:url(img/bg-submitbutton.png) no-repeat 0px 1px; float:right; color:#CC0000}
#EmailForm .ohneborder { border:none}
#EmailForm .bezdatensenden { width: 100%; line-height: 1.1em; padding: 10px 0px 5px 0px;}
#EmailForm .fielddatensenden { float:right; padding:0px 10px 0px 0px}

div.error {	display:block; font-size: 13px; line-height: 16px; color:#CC0000 }

/*---------------webrefs zweier-------*/
.portfolio_container{margin: 0px 0px 0px -30px; width:966px;}
.portfolio_div_container{ width:441px; height: 320px; margin: 15px 0px 15px 30px; padding: 5px; float:left; overflow:hidden; position:relative; border:1px solid #b4b4b4}
.portfolio_div {height:320px; width:443px; overflow:hidden; position:relative}
.info_container { width:230px; height:250px; top:100px; z-index:3; position:relative; color:#FFF}
div.info{
	position:relative;	
	width:440px;
	top:-150px;  /* hier die Höhe des Anfangs von den Infos einstellen*/
	z-index:100;
	height:200px;
	padding:5px;	
	background:url(img/bg-trans80-black.png) repeat;
	margin:0px;
}
.info_container .infoheader {height:35px; padding:0px 0px 0px 5px; margin:0px 0px 3px 0px; overflow:hidden}
.info_container .infodescription {padding: 7px 0px 0px 5px; height:50px; overflow:hidden}
div.webreflinks {z-index:101;padding: 0px 0px 5px 0px}
div.info p, .summaryprint {line-height:1.1em; font-size:11px; padding:0px; margin:0px;}

h6.webreflink { font-family: "Lucida Sans", Arial; font-size: 1em; color:#FFF; text-transform:uppercase; padding:5px 0px 0px 0px; margin:0px}
a.linktowebrefhead:link, a.linktowebrefhead:active, a.linktowebrefhead:visited {padding:5px; margin:0px; color:#333; font-size:0.9em; text-transform:uppercase; border: 1px solid #FFF; background:url(img/bg-trans80.png) repeat;}
a.linktowebrefhead:hover { border: 1px solid #FFF; background:#FFF}

div.webrefbigimg { float:right; width: 423px; height: 320px; overflow:visible}
div.webrefbigimg img { float:right}
div.webrefbigtext { float:left; width: 400px; overflow:visible}
div.webrefmoreimg { width:700px; background:#FFFFFF; height: 130px}

/*---------------printrefs dreier-------*/
.info_container_print { width:250px; height:120px; top:108px; z-index:3; position:relative; color:#FFF}
div.info_print{ position:relative; width:282px; top:-160px; z-index:100; height:100px; padding:10px 5px 5px 5px; background:url(img/bg-trans80-black.png) repeat; margin:0px}
.summaryprint {line-height:1.1em; font-size:11px; padding:15px 0px 0px 0px; margin:0px;}
.contentdrittelprint { width:292px; height: 220px; margin: 0px 0px 10px 20px; padding: 2px; float:left; overflow:hidden; border:1px solid #b4b4b4; position:relative}

a.linktowebref:link, a.linktowebref:visited, a.linktowebref_fancy:link, a.linktowebref_fancy:visited {padding:5px; margin: 7px 10px 0px 5px;font-size:0.9em; text-transform:uppercase; border: 1px solid #999; color:#FFF }
a.linktowebref:hover, a.linktowebref_fancy:hover, a.linktowebref:active{color:#CC0000; border: 1px solid #FFF; background:#FFF}
a.linktowebvisit:link, a.linktowebvisit:visited{padding:5px; /*margin: 7px 10px 5px 5px;*/ color:#3A444E; font-size:0.9em; text-transform:uppercase; border: 1px solid #999;}
a.linktowebvisit:hover, a.linktowebvisit:active{color:#CC0000; border: 1px solid #FFF; background:#FFF;}

/* ditto-pagination-links */
.webrefnavi { padding:0px 10px 10px 0px; width:844px; margin:0px 0px 10px 0px}
.webrefnavitext { float:left; height: 23px; padding: 7px 20px 0px 0px}
.webrefnaviseiten { float:left; height: 30px;}
.webrefnavitextunten { float:left; height: 23px; padding: 7px 0px 0px 20px }
a.ditto_page, .ditto_currentpage { width: 25px; height: 20px; padding: 3px; margin:3px; border: 1px solid #CCC; text-align: center; float:left; display:block;color: #3A444E}
a.ditto_page:hover, .ditto_currentpage { border: 1px solid #CC0000; background-color: #FFF;}
a.ditto_next_link, a.ditto_previous_link { width: 100px; height: 20px; padding: 3px; margin:3px; border: 1px solid #CCC; text-align: center; float:left; display:block;color: #3A444E }
a.ditto_next_link:hover, a.ditto_previous_link:hover { border: 1px solid #CC0000; background-color: #FFF;}


/*---------------------newsbereich--------------------*/
.date { width:150px; height:auto; float:left;margin:0px 10px 0px 0px; border:1px solid #CCC; text-align:center}
.newsheadline { width: 700px; height:auto; padding:3px 0px 0px 0px; margin:-10px 0px 0px 0px;float:left}
.newsheadline h1 {font-size:21px;line-height:24px; }
.newscontent {  }