/* ----  CSS Styles for H.A.I. Architekten und Ingenieure ---- */
/* --------- by Caroline Clouqueur www.clouqueur.net --------- */


/***********************************************************************/
/* ------------ for de-bugging ------------ */
/***********************************************************************/

/*
div {
	border: 1px solid green;
}
div div {
	border: 1px solid blue;
}
div div div {
	border: 1px solid red;
}
*/

/***********************************************************************/
/* ------------ Basic formatting ------------ */
/***********************************************************************/

body {
	margin: 0 auto;
	padding: 0;
	color: #f3f3f3;
	background-color: #000;
	font: normal 76%/1.5em Helvetica, sans-serif;
	text-align: center; /* to centre content in IE */
	}

/* list-style: | list-style-type | list-style-position | list-style-image;
ex: ul { list-style: square inside url("sqr.gif");}
*/

h1, h2, h3, h4, h5, p, ul, ol, li {
	font: normal 1em/1.5em Helvetica, sans-serif;
	color: #f3f3f3;
	padding: 0 143px; /* so that the text isn't stuck against the div's side */
	margin: 0;
	text-align: left;
	}
h1 {
	font: bold 1em/1.2em Helvetica, Sans-serif;
	padding-top: 2em;
	padding-bottom: 1em;
	text-transform: uppercase;
	color: #c90;
	}
h2 {
	font: bold 1.1em/1.2em Helvetica, Sans-serif;
	padding-top: 1em;
	padding-bottom: 1em;
}
h3 {
	font: bold 1em/1.2em Helvetica, sans-serif;
	padding-top: 1.2em;
	}
h4 {
	font: bold 1em/1.2em Helvetica, sans-serif;
	}	
h5 {
	font: bold italic 1em/1.2em Helvetica, sans-serif;
	padding-top: 0.5em;
	padding-bottom: 1.5em;
	}
p {
	font-size: 1.1em;
	padding-bottom: 1em;
}
span {
}
.floatLeft {
	float: left;
}
.floatRight {
	float: right;
}
.alignCenter {
	text-align: center;
}
.alignRight {
	text-align: right;
}

img {
	padding: 0;
	margin: 0;
	border: 0;
	}
ul, ol {
	padding: 0.5em 1.5em;
	margin: 0.2em 3em 0.2em 143px;
	}
ul {
	list-style-type: square;
	}
ul ul {
	margin-left: 1em;
	}
li {
	line-height: 1.3em;
	padding: 0 0 0.5em 0;
	margin: 0;
	}
ul ul li {
	font-style: italic;
	}
blockquote {
	font-size: 0.9em;
	line-height: 1.5em;
	padding: 0.9em 1.1em;
	margin: 0 5em 1em 5em;
	background-color: #333;
	text-align: left;
	color: #fff;
	}

/***********************************************************************/
/* ------------ Table Styles ------------ */
/***********************************************************************/

table {
	width: 614px;
	margin: 1em 0 0 143px;
	padding: 0;
	font-size: 1em;
	border: none;
	vertical-align: top;
	/*border: 1px solid blue;*/
}
table.contactUs {
	width: 757px;
}

table.form {
	width: 250px;
	background-color: #333;
	margin-left: 0;
	padding-bottom: 15px;
}

th {
}

tr, td {
	margin: 0;
	padding: 0;
	/*width: 50%;*/
	background-color: transparent;
	vertical-align: top;
}
td.wide {
	width: 42%;
}
td.wide_deu {
	width: 42%;
}
td.thin {
	width: 28%;
}
td.thin_deu {
	width: 30%;
}
table h1, table h2, table h3, 
table h4, table h5, table p {
	padding-left: 0;
	padding-right: 0;
}
table ul, table ol {
	margin-left: 0.5em;
}

.formLabel {
	padding-left: 20px;
	padding-bottom: 0;
	font-size: 0.9em;
	text-transform: uppercase;
}
p.formLabel_sm {
	padding-left: 20px;
	font-size: 0.9em;
}

.inputbox {
	margin-top: 0;
	margin-left: 20px;
}
.submitbtn {
	margin-left: 20px;
	margin-top: 10px;
}
.required {
	color: #fc0;
}

/***********************************************************************/
/* ------------ Default Linking Styles ------------ */
/***********************************************************************/

a {
	background-color: #333;
	text-decoration: none;
	color: #ccc;
	padding: 0 0.3em;
	}
a:link, a:visited {
	color: #ccc;
	}
a:hover {
	background-color: #666;
	color: #fff;
	}
a:active {
	color: #ccc;
	}

/***********************************************************************/
/* ------------ Positioning Divs ------------ */
/***********************************************************************/

div, div div, div div div {
	margin: 0 auto;
	padding: 0;
}

#container {
	width: 900px;
}

#nav {
	height: 30px;
	width: 900px;
	}
	
#masthead {
	height: 80px;
	width: 900px;
	text-align: left;
	margin-bottom: 20px;
	}

#masthead_home {
	height: 100px;
	width: 900px;
	text-align: left;
	margin-bottom: 20px;
	padding-top: 40px;
	}


#portfolioContainer { /* can place flash here */
	height: 420px;
	width: 900px;
}
#homeimgContainer { /* can place flash here */
	height: 452px;
	width: 900px;
}

#wrapper { /* this can add left padding to the main text area*/
	width: 800px;
	padding-top: 7px;
	margin-bottom: 20px;
}

#leftCol { /* homepage narrow column left */
	width: 260px;
	float: left;
	}
#mainContent {
	/* keep IE 3px bug in mind*/
	width: 900px;
}

#footer {
	height: 90px;
	width: 900px;
	clear: both; /* needed for short content */
	margin-top: 80px;
	}

/***********************************************************************/
/* ------------------- Functional Nav (Contact) ------------------- */
/***********************************************************************/


/***********************************************************************/
/* -------  Main/Top Navigation Rules  ------------------- */ 
/* -------  (Activities and Campaigns, Reserach, etc.) -------- */
/***********************************************************************/

ul.mainNav {
	padding: 0;
	margin: 0;			
	list-style-type: none;
	text-align: center;
	/*margin-left: 20px;*/
	}
ul.mainNav li {
	padding-right: 2px;
	padding-bottom: 0;
	font-size: 0.9em;
	color: #666;
	display: inline;
	float: left;
	line-height: 1em;
	}
ul.mainNav li.on {
}

li.funcNav_home {
	margin-left: 200px;
	padding-top: 20px;
}
li.funcNav_home_deu {
	margin-left: 120px;
	padding-top: 20px;
}
li.funcNav {
	padding-top: 20px;
	padding-left: 5px;
}
ul.mainNav li.impressum {
	padding-top: 20px;
	padding-left: 5px;
	float: right;
	text-align: right;
}

ul.mainNav a {
	background-color: transparent;
	color: #666;
	padding-left: 0;
	padding-right: 0;
	}
ul.mainNav a:link, ul.topNav a:visited {
	color: #666;
	}
ul.mainNav a:hover {
	color: #fff;
	}
ul.mainNav a:active {
	color: #666;
	}

/***********************************************************************/
/* ------------------- Side Column Rules ------------------- */
/***********************************************************************/


/***********************************************************************/
/* ------------------- Stray Para Styles ------------------- */
/* ------------------- many for the forms ------------------- */
/***********************************************************************/

#footer p {
	padding-right: 2px;
	font-size: 0.9em;
	color: #666;
	text-align: right;
}

/* now in basic formatting
#mainContent h1, #mainContent h2, #mainContent h3, 
#mainContent h4, #mainContent h5, #mainContent p, 
#mainContent ul {
	padding-left: 20px;
	padding-right: 20px;
}
*/
#masthead_home a {
	background-color: transparent;
	padding: 0;
	margin: 0;
	}
p.formLabel {
	padding-top: 20px;
	padding-bottom: 0;
}
h1.contactUs {
	padding-left: 0;
}