/* Styles for www.haagnetz.de - die private Seite von Oliver Haag im Netz */

/* == colors ==
 * #acaaac; (172/170/172) - angedungekltes hellgrau aus Photo (minimal grünreduziert)
 * #006; - ziemlich dunkles blau - im Photo für Haare und Ränder, Schrift
 * #104050; - dunkles türkis aus solaarized photo
 * #8caab4 (140/170/180); - helles blautürkis hat sich beim aufhellen des solarize Photo ergeben
 * #a8bfc6; - blautürkis doppelt aufgehellt, damit Logo leuchtet - helles Logo
 */

br.clearbreak {
	clear:left;
}

body, table, p, h1, h2, h3 {
	font-family: verdana, arial, sans, sans-serif;
	font-size: 12px;
	color:#006;
}

body {
	padding: 0px; margin: 1px; border-width:0px;
}

h1 {
	font-size: 18px; font-weight: normal;
	margin-top:0px;
}

h2 {
	font-size: 14px; font-weight: bold;
	margin-top:0px;
}

/* #257373; */
div.topspace1 {
	height:10px;
	background-color: #fff; 
}

div.topspace21 {
	width: 200px; padding-top: 10px; 
	background-color: #fff;
	text-align: right;
	float:left;
}
div.topspace22 {
	width: 200px; padding-top: 10px; 
	background-color: #fff;
	float:left; 
}
div.topspace23 {
	padding-top: 10px; padding-right: 10px; 
	background-color: #fff;
	text-align: right;
}
div.topspace_menu {
	background-color: #fff;
	padding: 20px; padding-right:0px;
	text-align: right;
}

div.topspace_separator {
	width: 100%;
	clear: left;
	height:10px;
	background-color: #a00; 
}


/* OH */
span.logotext1 {
	font-size: 32px; 
	color: #999;
}
/* Con */
span.logotext2 {
	font-size: 32px; 
	color: #377; 
}

/* Oliver Haag */
span.companytext1 {
	font-size: 16px; 
	color: #999;
}
/* IT Consulting  */
span.companytext2 {
	font-size: 16px; 
	color: #377;
}

/* not used now */
img.logoimage {
	border-style: solid;
	border-width: 1px; 
	border-color: #006;
	z-index: 20;
	position: absolute;
	top: 40px;
	left: 135px;
	float: left;
}

/* #006; #377; */
span.mottotext { 
	font-size: 32px;
	color: #999;
	white-space: nowrap;
}

span.pagename {
	float: right;
	color: #a00;
	font-size: 16px;
}


/* hauptmenue oben quer */
ul.mainmenu {
	display: inline;
	list-style-type: none;
	color: #fff; 
	font-size: 16px;
	background-color: #006;
	
	margin: 0px;
	padding: 0px;
}
ul.mainmenu li {
	display:inline;
	color: #fff; 
	background-color: #006;
}
/* color=background-color! Trick explained in html page */
ul.mainmenu li.big {
	padding: 2px;
	display:inline;
	color: #006; 
	background-color: #006;
}
ul.mainmenu li a {
	
	padding: 2px;
	color: #fff; 
	text-decoration: none;
	background-color: #006;
}
ul.mainmenu li a:hover {
	color: #fff; 
	background-color: #377;
}

/* zusätzliches menue unten quer */
ul.botmenu {
	list-style-type: none;
	background-color: #ccc;
	padding-top:2px; padding-bottom: 2px;
	margin-left:0px;
}


ul.botmenu li {
	display:inline; 
	margin-left: 10px;
}


ul.botmenu li a {
	color: #006;
	text-decoration: none;
}

/* submenue links */
/* colors: #8caab4 helltürkis -  #104050 türkis*/
ul.submenu {
	list-style-type: square;
	list-style-position: inside;
	color: #104050;
}

ul.submenu li {
	padding-left:0px;
	margin-left: 0px;
}


ul.submenu li a {
	color: #104050;
	text-decoration: none;
}


div.item {
	float:left; 
	width: 180px;
	background-color: #ccc;
	padding: 10px;  margin:0px;
	font-size: 32px; color:#006;
}

div.item2 {
	float:left; 
	width: 180px;
	background-color: #fff;
	padding: 10px;  margin:0px;
	font-size: 32px; color:#006;
	
	border-style: solid; 
	border-width: 0px;
	border-top-width: 1px;
	border-color: #ccc;
}

div.subitemimage {
	clear:left;
	float:left; 
	width: 200px;
	background-color: #fff;
}

div.subitemtext {
	clear:left;
	float:left; 
	width: 180px;
	background-color: #fff;
	padding: 10px;  margin:0px;
	font-size: 12px; color:#377;
}

/* todo unused? */
div.item3 {
	float:left; 
	height: 50px; width: 180px;
	
	background: url(image/ovh_bt5.gif);	
	background-repeat: no-repeat; 
	background-position: 40px 0px;	
	background-color: #8caab4;
	
	padding-top: 120px; padding-left: 10px; padding-right: 10px; 
	font-size: 32px; color:#104050;
	text-align:right;
	margin-right: 10px;
}

div.text {
	margin:0px;
	margin-left: 200px;
	padding: 10px;
	background-color: #fff; /* #377; */
}

div.text ul {
	list-style-position: inside;
	padding-left:0px;	/* FFox */
	margin-left:0px;	/* IE */
}

div.text p.special {
	background-color: #6aa;
	font-style: italic;
}

img.visualisation {
	float:left; 
	margin-right: 10px;
}

p.information {
	margin-left: 10px; 
}

br.separation {
	clear: left;
}


li {
	list-style-position: inside;
}

a {
	color: #104050; 
}


.bottomhint {
	text-align: right;
	border-style: solid;
	border-width: 0px; border-top-width: 1px;
	border-color: #006;
	padding-right: 10px;
}

.bottomhint img {
	border: 0px;
}


/* *********************************** */
/* some old stuff kept for fast lookup */
/* 
.topspace {
	height:171px;
	background: url(image/test2B2ovh.jpg);
	background-repeat: no-repeat; 
	background-position: 85px 0px; 
	background-color: #fff;
	vertical-align:bottom;
}

.XXX {
	clear: left | right;
	display: inline | block |  ...;
	
}
*/