﻿/* File: styles.css
-----------------------------------------------------------------------
Initial author: Dipl.-Ing. Alexander Rudolph
Last editor:    Alexander Rudolph
First version:  10 Feb 2010
Last update:    10 Feb 2010
---------------------------------------------------------------------*/

html,
body {
	background-color:#FFFFFF;
	font:normal 90% Arial, Helvetica sans-serif;
	line-height:135%;
	margin:0;
	padding:0;
	text-align:center;
	}
	
/* Setting maximum width of content and centering in browser window */
#wrapper {
	background-color:#FFFFFF;
	margin:0 auto;
	max-width:900px;
	padding:0;
	}

/* CAD background in upper left corner */
img#cad {
	position:absolute;
	/* no-repeat; */
	left:0px;
	top:0px;
	z-index:-2;
	}

/* Two BDP background pictures in upper right corner(s) */
img#bag_top {
	position:absolute;
	/* repeat:none; */
	right:0px;
	top:0px;
	z-index:2;
	}

img#bag_bottom {
	position:absolute;
	/* repeat:none; */
	right:0px;
	top:0px;
	z-index:-1;
	}

/* OC logo and machinery background top part */	
#header {
	background:#FFFFFF url(../images/designelements/oc_logo.jpg) top left no-repeat;
	height:110px;
	margin:0;
	padding:0;
	position:relative;
	z-index:1;
	}

/* Language buttons in lower right corner of the header div */	
ul#language {
	display:block;
	float:right;
	height:12px;
	list-style:none;
	margin:0;
	padding:0;
	position:absolute;
	right:15px;
	top:96px;
	/*width:100px;*/
	z-index:3;
	}

ul#language li,
ul#language a {
	color:#000000;
	display:block;
	float:left;
	font:normal 90% Arial, Helvetica sans-serif;
	margin:0 2px 0 2px;
	padding:0;
	position:relative;
	text-decoration:none;
	z-index:4;
	}

/* Main div below header */	
#main {
	background:url(../images/designelements/bkg_left.jpg) top left repeat-y;
	margin:0;
	padding:0;
	position:relative;
	z-index:0;
	}

/* Navigation list inside main div, floated to the left */	
ul#navi {
	display:block;
	float:left;
	font:bold 100.01% Arial, Helvetica sans-serif;
	list-style:none;
	margin:0;
	padding:25px 12px 0 18px;
	position:relative;
	text-align:center;
	width:150px;
	z-index:1;
	}

/* Underlined */	
ul#navi li.home,
ul#navi li.productsandservices,
ul#navi li.contactandmedia,
ul#navi a.home,
ul#navi a.productsandservices,
ul#navi a.contactandmedia {
	border-bottom:1px solid #FFFFFF;
	color:#FFFFFF;
	display:block;
	margin:10px 0 0 0;
	padding:3px 0 0 3px;
	text-decoration:none;
	}

/* Not underlined */
ul#navi li.companyprofile,
ul#navi li.spraydrying,
ul#navi li.particledesign,
ul#navi li.spraytesting,
ul#navi li.atomization,
ul#navi li.dryingsetups,
ul#navi li.inquiries,
ul#navi li.dryingsetups,
ul#navi li.applicationexamples,
ul#navi li.catalogues,
ul#navi a.companyprofile,
ul#navi a.spraydrying,
ul#navi a.particledesign,
ul#navi a.spraytesting,
ul#navi a.atomization,
ul#navi a.dryingsetups,
ul#navi a.applicationexamples,
ul#navi a.inquiries,
ul#navi a.dryingsetups,
ul#navi a.catalogues {
	color:#FFFFFF;
	display:block;
	margin:0 0 0 0;
	padding:3px 0 3px 0;
	text-decoration:none;
	}

/*	
ul#navi a:focus,
ul#navi a:hover,
ul#navi a:active {
	background-color:#00AEEF;
	}
*/

/* Actual homepage content in list form */
ul#content {
	background:url(../images/designelements/bkg_right.jpg) top right repeat-y;
	color:#000000;
	display:block;
	list-style:none;
	margin:0px;
	padding:1px 40px 25px 220px;
	text-align:justify;
	z-index:5;
	}
	
ul#content li{
	color:#000000;
	display:block;
	margin:10px 0;
	max-width:640px;
	padding:0;
	z-index:6;
	}
	
li#imprint {
	display:block;
	font:normal 85% Arial, Helvetica sans-serif;
	text-align:center;
	}
	
h1 {
	/*background:url(../images/designelements/blueblock_dark.jpg) 0px center no-repeat;*/
	color:#000000;
	font:bold 120% Arial, Helvetica sans-serif;
	margin:20px 0 3px 0;
	padding:0;
	text-align:left;
	z-index:7;
	}
	
h1.notopmargin {
	/*background:url(../images/designelements/blueblock_dark.jpg) 0px center no-repeat;*/
	color:#000000;
	font:bold 120% Arial, Helvetica sans-serif;
	margin:0 0 3px 0;
	padding:0;
	text-align:left;
	z-index:7;
	}
	
h1.linebreakindent {
	/*background:url(../images/designelements/blueblock_dark.jpg) 0px center no-repeat;*/
	color:#000000;
	font:bold 120% Arial, Helvetica sans-serif;
	margin:0 0 3px 0;
	padding:0;
	text-align:left;
	text-indent:17px;
	z-index:7;
	}
	
h2 {
	/*background:url(../images/designelements/blueblock_light.jpg) 0px center no-repeat;*/
	color:#000000;
	font:bold 110% Arial, Helvetica sans-serif;
	margin:15px 0 5px 0;
	padding:0;
	text-align:left;
	z-index:8;
	}
	
h2.linebreakindent {
	/*background:url(../images/designelements/blueblock_light.jpg) 0px center no-repeat;*/
	color:#000000;
	font:bold 110% Arial, Helvetica sans-serif;
	margin:0 0 5px 0;
	padding:0;
	text-align:left;
	text-indent:17px;
	z-index:8;
	}

p.aligncenter {
	text-align:center;
	}

img.fullwidth {
	display:block;
	margin:0 0 3px 0;
	max-width:640px;
	padding:0;
	width:100%;
	}
	
img.halfwidth {
	display:block;
	margin:0;
	margin:5px 0 5px 0;
	max-width:307px;
	padding:0;
	width:100%;
	}

img.textpic {
	display:block;
	float:right;
	margin:0;
	padding:3px 0 0 10px;
	position:relative;
	}
	
img.fiver {
	margin:0 0 3px 0;
	max-height:144px;
	max-width:108px;
	padding:0;
	width:100%;
	}
	
table.twocolumns {
	border:0px;
	border-collapse:collapse;
	border-style:none;
	margin:0;
	padding:0;
	text-align:justify;
	width:100%;
	}
	
td.twocolumns {
	margin:0;
	max-width:307px;
	padding:0;
	vertical-align:top;
	width:48.6%;
	}
			
table.fivecolumns {
	border:0px;
	border-collapse:collapse;
	border-style:none;
	margin:0;
	padding:0;
	text-align:center;
	width:100%;
	}
	
td.fivecolumns {
	max-width:108px;
	width:19%;
	vertical-align:top;
	}
			
table.dryerspec {
	background:#D4D4D4;
	border-collapse:collapse;
	line-height:175%;
	margin:0;
	padding:0;
	text-align:left;
	width:100%;
	}
	
tr.dryerspec /* table row */ {
	border-width:1px 0 1px 0;
	border-style:solid;
	border-color:#FFFFFF;
	}

th.dryerspec /* table head on the left side */ {
	border-width:1px 1px 1px 0;
	border-style:solid;
	border-color:#FFFFFF;
	font:bold 90% Arial, Helvetica sans-serif;
	line-height:175%;
	padding:0 10px 0 10px;
	text-align:left;
	width:33%
	}
	
td.dryerspec /* table data */ {
	border-width:1px 0 1px 1px;
	border-style:solid;
	border-color:#FFFFFF;
	line-height:175%;
	padding:0 10px 0 10px;
	text-align:left;
	width:67%
	}
		
td.spacer {
	width:25px;
	}

dl#president {
	float:right;
	margin:0px 0px 10px 10px;
	padding:0;
	}
			
dd#president {
	font:normal 85% Arial, Helvetica sans-serif;
	margin:3px 0 0 0;
	text-align:center;
	}

dt.exampleimages {
	/* padding:0 0 10px 0; */
	}

dd.exampletags {
	color:#FFFFFF;
	font:normal 85% Arial, Helvetica sans-serif;
	margin:-25px 0 0 5px;
	padding:0 0 5px 0;
	text-align:left;
	}
	
span.caption {
	font:normal 85% Arial, Helvetica sans-serif;
	margin:0;
	text-align:center;
	}	
	
span.align {
	display:inline-block;
	width:40px;
	}
		
/*Inquiry forms*/
form {
	border:0px solid #000000;
	display:block;
	margin:-5px 0 0 -40px;
	padding:0;
	position:relative;
	}
	
li.form {
	line-height:150%;
	margin:0;
	padding:0;
	text-align:left;
	}
	
input {
	margin:0 0 3px 0;
	width:79%;
	}

input.small {
	width:100px;
	}
	
input.onethird {
	width:25%;
	}
	
input.half {
	width:38.6%;
	}		

input.twothirds {
	width:52.5%;
	}	
	
input.radio {
	width:15px;
	}	
	
input.checkbox {
	display:inline;
	margin:0;
	width:15px;
	}
	
input.button {
	text-align:center;
	position:relative;
	width:150px;
	}
	
textarea {
	/* height:100px; */
	width:79%;	
	}

/* Footer including "Back to top" and "Next page" buttons */
#footer {
	background:#12C3F4 url(../images/designelements/bkg_footer_left.jpg) bottom left no-repeat;
	height:20px;
	margin:0 auto;
	margin-bottom:5px;
	padding:0;
	position:relative;
	}

ul#endofpage {
	background:url(../images/designelements/bkg_footer_right.jpg) bottom right no-repeat;
	float:right;
	font:normal 100% Arial, Helvetica sans-serif;
	height:20px;
	list-style:none;
	margin:0;
	padding:0 10px 0 0;
	position:relative;
	}

ul#endofpage li,
ul#endofpage a {
	color:#FFFFFF;
	display:block;
	float:left;
	margin:0;
	padding:1px 5px;
	text-decoration:none;
	}
