/* =========================================================
goekal-it.de - Page/Seitestruktur - CSS: Styleguide für Stylesheets
Datei: page.css
Media: screen, projection

Datum: 5. August 2006
Update: 11. Dezember 2006
Autor: David Bimamisa
Mail: david@ketchxup.de
Web: http://ketchxup.de/

Aufbau:
1. Allgemeine Selektoren
- Block-Elemente
- Inline-Elemente
- Klassen

2. Layoutbereiche
- Container
- Header
- Wrapper
- Contentbereich
- Navibereich
- Textbereich
- Fussbereich

3. Spezielle Bereiche
- Kontaktformular
========================================================== */


/* ===============================

   =1. Allgemeine Selektoren

=============================== */


* { /* Kalibirierung von Abständen, Little Boxes */
	padding: 0; 
	margin: 0 ; 
}

body { 
	color: #383838;
	background: #5380A7 url(../images/bg00000.jpg) top repeat;
	font: small/160% verdana, helvetica, arial, sans-serif;
	margin: 0; 
	padding:0;
	padding-bottom:10px;
	
}

/* ===============================
   =Block-Elemente 
=============================== */

h1, h2, h3, h4, h5, h6 {
	font-family: verdana, helvetica, arial, sans-serif;
	letter-spacing: 0px;
	color:#336699;
	font-weight:normal;
	}

h1 {font-size: 160%; 
	line-height: 110%;
	padding-bottom:5px;
	margin-bottom:0.5em;
	background:url(../images/menu-line.gif) bottom left repeat-x;
	
	}
h2 {font-size: 130%;
	margin-bottom:0.4em;
		
	 }
h3 {font-size: 110%;}
h4 {font-size: 100%}
/*h5 {font-size: 100%}
h6 {font-size: 90%} */

h2#service {
	background:url(../images/kundenservice.jpg) no-repeat;
	background-position:3px 0px;
	text-indent:-99999px;
	
}
.entry  h2 {
	background:none;
	margin:0;
	margin-bottom:-10px;
	padding-bottom:25px;
	line-height:1em;
}



p, 
ul, 
ol {
	margin-top: 0 ;
	margin-right: 0 ;
	margin-bottom: 1em ;
	margin-left: 0; 
}

ul ul { 
	margin: 0;
	position: relative; 
}

li {
	margin-top: 0 ;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 1em;
	list-style:none;
	line-height:15px;
	position: relative;
}

address {
	text-align: center;
	font-size: 80%;
	font-style: normal;
	letter-spacing: 2px;
	line-height: 1.5em;
}
img {
	border:none;
}



/* ===============================
   =Inline-Elemente 
=============================== */


a { 
  text-decoration: none;
  outline:none; 
}

a:link { 
  color: #336699; 
}

a:visited,a:active  { 
	color: #336699;
	 
}

a:hover{ 
	text-decoration: underline; 
}


a.skiplink { 
	display: none; 
}

h2 a:hover,
 a:hover h2 {
	text-decoration:none;
	border-bottom:#6699cc solid 1px;
	padding-bottom:3px;
}


/* ===============================
   =Classes allgemeiner Art 
=============================== */


.clear {
	clear:both;
	height:5px;
	width:100%;
	

}

date {	
	color:#EE0088;
	margin-bottom:2em; 
}

.date a:hover  {
 text-decoration: none;
}

.post-list-84 h2 {
	text-indent:70px;
}

.entry-84 {
	padding-bottom:5px;
	margin-bottom:20px;
	
}

.post-list-84 p {
	padding:0;
	margin:0;
	padding-top:0px;
	
}
span.readmore {
	margin:0px;
	padding:0;
}
p.posted {
	color:#4979A1;
}


.entry-list { 
	margin-left:70px;	
	background:url(../images/metatag-p.jpg) repeat top left ;  }
p.listmeta-comments  { 
	background:url(../images/bg-black.jpg) repeat top left ;
	margin-top:20px;
	padding-top:0px;
  }
.listmeta-comments a,
.listmeta-comments a:hover,
.listmeta-comments a:visited { 
	background:#4479AD url(../images/list-monat.jpg) bottom repeat-x;
	color:white;
	padding:5px;
	border-top: #FFFFFF solid 2px;
	}
	
ul.products {
 float:left;
 padding:0;
 margin:0;
 padding-top:20px;
 padding-bottom:30px;



}
.products li {
	font-size: 130%;
	margin-top:0.4em;
	 width:100%;
	 float:left;
	 padding:0.5em;
	 background:url(../images/menu-line.gif) bottom repeat-x;
}

.products li span{ 
	float:left;
	color:#336699;
	margin-top:25px;
}	
.products li a {
	display:block;
	font-size:12px;


	float:right;
	margin-right:50px;
	margin-top:25px;
	
}
/* 
========================================

  =2. LAYOUTBEREICHE

========================================= */ 

#container {
	width:100%;
	margin: 0 auto; 
}

/* ===============================
   =Header
=============================== */

#header {
	background:#538658F;
	background:url(../images/header-bg.gif) left top no-repeat;
	height:103px;
	width:100%;
	float:left;
	
}
#header img {
	position:relative;
	left:17px;
	top:18px;
}

/* ===============================
   =Menu
=============================== */
#top-menu {
	position:relative;
	top:0;
	left:8px;
	padding:0;
	margin:0;
	width:698px;
	float:left;
	height:44px;
	padding-right:10px;
	padding-bottom:5px;
	
}
ul#topmenu {
	padding:0;
	margin:0;
	float:right;	
}
ul#topmenu li {
	float:left;
	padding:0;
	margin:0;
	text-indent:-9999px;
	height:30px;	
}


ul#topmenu li a{
	color: white;
	text-decoration:none;
	display:block;
	background:url(../images/topmenu.gif) right no-repeat;
}
#mainmenu {
	float:left;
	width:80%;
}
li#home-top a {
	width:87px;
	height:33px;	 }
	
li#widerrufsrecht a {	
	width:112px;
	height:33px;
}
li#agb a {	
	width:38px;
	height:33px;
}
li#impressum a {	
	width:80px;
	height:33px;
}

li#datenschutz a {	
	width:94px;
	height:33px;
}

li#kontakt a {	
	width:90px;
	height:33px;
}
li#home-top a:link, li#home-top a:visited {
	background-position:0px 0px;
}

li#widerrufsrecht a:link, li#widerrufsrecht a:visited {
	background-position:-87px 0px;
}

li#agb a:link, li#agb a:visited {
	background-position:-198px 0px;
}
li#impressum a:link, li#impressum a:visited {
	background-position:-236px 0px;
}

li#datenschutz a:link, li#datenschutz a:visited {
	background-position:-314px 0px;
}

li#kontakt a:link, li#kontakt a:visited {
	background-position:-410px 0px;
}

ul#mainnav,
ul#kundenservice {
	padding:0;
	margin:0;
	padding-bottom:25px;
	padding-left:10px;
}


#mainnav li,
#kundenservice li {
	margin:0;
	padding:4px 0 4px;
	border-bottom:#c4d0dd solid 1px;
	line-height:20px;
	background:url(../images/arrow-active.gif) no-repeat right center;
	padding-left:3px;
}

ul#kundenservice {
	margin-top:-3px;

}

#mainnav li a,
#kundenservice li a {
	text-decoration:none;
	padding:0;
	margin:0;
	padding-right:20%;

}
li.levelactive-produkte ul  {
	padding-bottom:10px;
}
#mainnav li#hardware {
	position:relative;
	top:10px;
}

/*/* * Hover+focus für hauptpunkte //*/
#mainnav li:hover,
#kundenservice li:hover
{	
	text-decoration:none;
	background:#faf9f9 url(../images/arrow-active.gif) no-repeat right center;
}

#mainnav li ul li:hover,
#kundenservice li ul li:hover
 {
	text-decoration:none;
	background:#faf9f9;
}

#mainnav li.levelactive-produkte,
#mainnav li.levelactive-technik,
#kundenservice li.levelactive {
	background:none;
	border-bottom:#c4d0dd solid 1px;
}

#mainnav li ul li,
#kundenservice li ul li{
	padding:0;
	background:none;
	border:none;
	padding-left:5px;
	font-size:0.78em;
}


#mainnav li ul li a,
#kundenservice li ul li a{
	text-decoration:none;
	padding:0;
}


#mainnav li.navaktiv,
#kundenservice li.navaktiv,
body#home-page #mainnav li#home{
	font-weight:bold;
	background:url(../images/arrow-submenu.gif) no-repeat right center ;
}

#mainnav li.navaktiv:hover,
#kundenservice li.navaktiv:hover,
body#home-page #mainnav li#home:hover{
	font-weight:bold;
	background:#FAF9F9  url(../images/arrow-submenu.gif) no-repeat right center ;
}

#mainnav li.navaktiv-sub a,
#kundenservice li.navaktiv-sub a{
	font-weight:bold;
	color:#6699cc;
}


/* ===============================
   =WRAPPER + CONTENT
=============================== */

#wrapper {
	width:705px;
	margin: 0 auto; 
	
}

#content {
	background:url(../images/content-bg.jpg) repeat-y ;
	width:100%;
	float:left;
	padding-top:20px;
	text-align: justify;

}
/* ===============================
   =MAINCOLUMN + TEXTFELD
=============================== */
#leftColumn { 
	float:left;
	width:167px;
	margin:0;
	padding-left:10px;
}

#mainColumn { 
	float:left;
	margin:0;

	padding:0;
	width:509px;
	padding-top:5px;

}
#textfeld {
	width:453px; 
	padding:0px 10px 10px 15px;
	float:left;	

}
#textfeld p{
	line-height:1.25em;
	letter-spacing:-0.01em;

}

/* ===============================
   =FOOTER + FOTTERINNER
=============================== */

#footer {
	width:100%;
	margin:0;
	padding:0;
	clear:both;
}

#copyright {
	width:705px;
	height:25px;
	text-align:right;
	padding:2px 0 3px;
	color:#FFFFFF;
	font-size:0.85em;
	background:url(../images/footer-bg.jpg) bottom center no-repeat;
}
#copyright p {
	position:relative;
	left:-30px;
	float:right;
}
#copyright a { color:#6699cc;}


ul#footernav {
	padding:2px 0 3px;
	margin:0;
	float:left;
	position:relative;
	left:30px;
}
#footernav li {
	padding-right:0.5em;
	margin:0;
}
#footernav li a {
	color:#fff;
	font-size:0.95em;
}

/* ===============================
   =QUOTES
=============================== */

#home-title h1 {
	background:url(../images/schon-wieder.jpg) top left no-repeat;
	text-indent:-1999px;
	padding-bottom:0px;
}
h3 span {
	display:none;
}
h3.zitat_home {
	background:url(../images/zitat_home.jpg) no-repeat top left;
	height:75px;	
}

h3.zitat_webhosting {
	background:url(../images/zitat_webhosting.jpg) no-repeat top left;
	height:55px;	
}
h3.zitat_managed-server{
	background:url(../images/zitat_managed-server.jpg) no-repeat top left;
	height:70px;	
}

h3.zitat_managed-services{
	background:url(../images/zitat_managed-services.jpg) no-repeat top left;
	height:48px;	
}

h3.zitat_virtuelle-server{
	background:url(../images/zitat_virtuelle-server.jpg) no-repeat top left;
	height:48px;	
}

h3.zitat_testaccount{
	background:url(../images/zitat_testaccount.jpg) no-repeat top left;
	height:48px;	
}

h3.zitat_hardware{
	background:url(../images/zitat_hardware.jpg) no-repeat top left;
	height:48px;	
}

h3.zitat_software{
	background:url(../images/zitat_software.jpg) no-repeat top left;
	height:68px;	
}

h3.zitat_anbindung{
	background:url(../images/zitat_anbindung.jpg) no-repeat top left;
	height:65px;	
}
h3.zitat_technik{
	background:url(../images/zitat_technik.jpg) no-repeat top left;
	height:82px;	
}

h3.zitat_home2{
	background:url(../images/zitat_home2.jpg) no-repeat top left;
	height:24px;	
}

h3.zitat_produkte{
	background:url(../images/zitat_produkte.jpg) no-repeat top left;
	height:48px;
	width:100%;	
}

h3.zitat_hardware_pro{
	background:url(../images/zitat_hardware_pro.jpg) no-repeat top left;
	height:48px;	
}

h3.zitat_home3{
	background:url(../images/zitat_home3.jpg) no-repeat top left;
	height:48px;	
}

.zitat_home,.zitat_webhosting,
.zitat_managed-server,.zitat_managed-services,
.zitat_virtuelle-server,.zitat_testaccount,
.zitat_hardware,.zitat_software,
.zitat_anbindung,.zitat_technik,
.zitat_produkte,.zitat_home2,
.zitat_home3,
.zitat_hardware_pro    {
	padding: 1px 0px 10px 15px;
		
}



#post-63 li,
#post-72 li{
	background:url(../images/list-quader.gif) 2% 50%  no-repeat ;
	padding-left:25px;
	padding-bottom:2px;
	margin-bottom:5px;
}
#post-63 h3,
#post-64 h3 {
	padding-bottom:10px;
	padding-top:5px;
	font-weight:600;
	padding-left:13px;
}
#post-63 h2,
#post-64 h2 {
	background:url(../images/menu-line.gif) bottom left repeat-x;
	width:100%;
	margin:0;
	margin-bottom:0.3em;
	padding:0;
	padding-top:0.5em;
	padding-bottom:0.5em;
}

/* ===============================
   =Kontakt + Kontakt
=============================== */



.textinput,textarea {
	padding-bottom:3px;
	padding-top:3px;
	border:#d5dee7 solid 1px;
	padding-left:5px;	
}
label{
	color:#336699;
	font-weight:bold;
	
	}

.textinput {
	width:90%;
	}	
.textarea {
	width:150%;
}	
.buttonSubmit {
	width:100px;
	border:#d5dee7 1px solid;
	background:#fff;
	padding:5px 0 5px;
	color:#38658F;
	text-indent:-5px;
	margin:0;
	outline:none; 
}
.formsubmit {
 padding-top:10px;


}
div.contacterror { 
	padding:10px;
	color:#336699;
}
.contacterror h2 {
	
}
span.required {
	color:#336699;

}
.contacterror ul {
	margin:0;
	padding:0;
}
.contacterror ul li ul li {
	color:#336699;
}
.contactentry {
	padding-bottom:3px;

}
div.contactright,
div.contactleft {
	width:60%;
}
#contact-info h3 {
	font-size:11px;
	padding:3px 0 0;
	
}
div#contact-info {
	padding-bottom:10px;
	width:180px;
	position:relative;
	font-size:0.88em;
	float:right;
	left:10px;
	
	}
#contact-info p {
	padding:0;
	margin:0;
}


body#impressum-page table {
	width:58%;
	height:90%;
	padding:0 0 13px;
	margin:0;
}

body#impressum-page table tr td {
	padding:0;
	margin:0;
	line-height:normal;
	text-align:left;
}
/* ===============================
   =COLUMN FIXING
=============================== */