/* style.css
*
* Mekon Metallkonstruktions GmbH
*
*
*
*/


body {
	width:100%;
	height:100%;
	text-align:center;
/*	background-color:#002652;*/
	background-color:#F4F4F4;
	margin:0px;
	padding:0px;
}


html * {
	font-family:Helvetica, Arial, sans-serif;
	font-size:12px;
	line-height:16px;
	vertical-align:middle;	
	font-style:normal;
	text-decoration:none;
	color:#002652;
}


address,p {
	margin-bottom:6px;
}


label {
	float:left;
	text-align:left;
	width:80px;
	line-height:16px;
	vertical-align:middle;
}


input {
	float:left;
	width:200px;
}

p {
	margin-top:0px;
	padding-top:0px;
}

textarea {
	float:left;
	width:400px;
	height:100px;
}





/*
	Layout
*/

#outerframe {
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	width:100%;
	width:1030px;
	height:100%;
}


/*
 *	Header
 */
#header {
	width:100%;
	float:left;
	height:203px;
	background-color:#002652;
}


#subheader {
	width:1030px;
	margin:auto;
	margin-top:30px;
	text-align:center;
	height:108px;
}

#subheader img {
	border:2px solid #FFFFFF;
	margin:0;
	padding:0;
}

#subheader img:first-child {
	border-left:none;
}

#subheader .subheaderLast {
	border-right:none;
}

/*
 *	Innerframe
 */
#innerframe {
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	float:left;
	width:1030px;
	height:auto;
	padding-bottom:10px;
	background-color:#002652;
}


/*
 *	Mainmenu
 */

#mainmenu {
	margin:0px 30px 0px 30px;
	padding-top:75px;
	padding:0px;
	width:155px;
	height:450px;
	float:left;
	height:100%;
	list-style:none;
	text-align:center
}


#mainmenu > ul {
	float:left;
	width:100%;
	padding:0px;
	margin:0px;
	height:430px;
	list-style:none;
	text-align:center;
}

#mainmenu > ul > li {
	width:100%;
	float:left;
	margin:0px 0px 18px 0px;
}
#mainmenu > ul > li > a {
	float:left;
	width:100%;
	text-align:center;
	height:22px;	
	background:#FFFFFF;
	border:2px solid #FFFFFF;
	display:block;
	padding:0px;
	font-size:14px;
	line-height:22px;
	vertical-align:middle;
	font-weight:bold;
}

#mainmenu > ul > li > a.active {
	background:#6c7895;
}

#mainmenu > ul > li > ul {
	float:left;
	list-style-image:url(/img/menu/whitesquare_14px.gif);
	padding:0px;
	padding-left:22px;
	margin:0px;
}

#mainmenu > ul > li > ul > li {
	text-align:left;
	margin:0px;
	padding:0px;
	margin-top:11px;
	margin-bottom:4px;
}

#mainmenu > ul > li > ul > li > a {
	line-height:18px;
	vertical-align:bottom;
	font-weight:bold;
	color:#FFFFFF;
}

#mainmenu > ul > li > ul > li > a.active {
	color:#7f7e7c;
}


#education-cert {
	margin-top: 0px;
}
	
#certs {
}

#certs  img:first-child {
	margin-right:10px;
}


/*
 *	Content
 */

#content {
	float:left;
	width:763px;
	height:450px;
	overflow:auto;
	padding:25px;
	margin:0;
	background-color:#FFFFFF;
	text-align:left;
}

#content #welcome {
	float:left;
	text-align:left;
	width:80px;
	height:100%;
}

#content #text {
	padding-left:15px;
}

#content h2 {
	font-size:16px;
	font-weight:bold;
	margin-top:0px;
}


#content h3 {
	font-size:14px;
	font-weight:bold;
	margin-top:0px;
	margin-bottom:6px;
}


#content #index {
	clear:none;
	height:100%;
	background:url(/img/content/mekon.jpg) bottom right no-repeat;
}

#content #index > p {
	margin-bottom:16px;
}

#content #index > h3 {
	margin-bottom:0px;
}

#content #index > *:first-child {
	margin-top:24px;
}

/*
 *	Footer
 */
#footer {
	float:left;
	width:100%;
	padding:0;
	margin:0;
	text-align:center;
	height:94px;
	vertical-align:middle;
	background:#002652;
}


#innerFooter {
	height:36px;
	background-color:#d1d2d4;
	margin-top:25px;
	border:none;
	border-top:2px solid #FFFFFF;
	border-bottom:2px solid #FFFFFF;
}

#innerFooter * {
	font-size:16px;
}

#innerFooter address {
	line-height:36px;
	vertical-align:middle;	
}




/*
 * ContactForm
 */
#contactForm {
	margin-top:16px;
	float:left;
	clear:none;
}

#contactForm label {
	width:100px;
	float:left;
	clear:left;
	margin-bottom:6px;
}

#contactForm input {
	margin-bottom:6px;
}

#contactForm .submit {
	float:left;
	margin-top:12px;
}

#contactForm input[type=text]  {
	width:300px;
}

#contactForm textarea {
	width:450px;
	height:150px;
	overflow:scroll;
}


#referencepictures {
	float:left;
	margin-top:40px;
}


/*
 * Categories
 */
.category {
	float:left;
	clear:none;
	width:285px;
	text-align:center;
	margin:0px 15px 20px 15px;
}

.category img {
	border:#002652 2px solid;
}

.category span {
	float:left;
	width:100%;
	line-height:40px;
	vertical-align:middle;
	text-align:center;
	font-weight:bold;
}

.certMessage {
	float:left;
	clear:none;
	width:265px;
	overflow:hidden;
	text-align:center;
	background:#002652;
	margin:100px 15px 20px 15px;
	padding:5px 10px 5px 10px;
}

.certMessage span {
	font-size:16px;
	line-height:26px;
	font-weight:bold;
	color:#FFFFFF;
	clear:none;
}
.certMessage span:first-child {
	font-size:18px;
}

.certMessage .left {
	float:left;
}
.certMessage .right {
	float:right;
}


/*
 *	Products
 */
.product {
	margin-bottom:25px;
	float:left;
	clear:none;
	width:200px;
	margin-right:20px;
	text-align:center;
}
.product img {
	border:#002652 2px solid;
}


/* 
	CLASSES
*/


.bold {
	font-weight:bold;
}

.italic {
	font-style:italic
}

.center {
	text-align:center;
}

.clearleft {
	clear:left;
}

input.submit {
	width:100px;
}



.inline .block {
	text-align:center;
	float:left;
	width:150px;
	margin:0 10px 0 10px;
	border:none;
}

.block div {
	float:left;
	width:100%;
	height:180px;
}

.block img {
	margin:10px auto 5px auto;
	padding:0;
	border:none;
}

.thumb {
	float:left;
	width:auto;
	line-height:150px;
	height:150px;
	margin-top:10px;
	margin-right:30px;
	margin-bottom:0px;
	margin-left:0px;
	vertical-align:middle;
	border:none;
}

.thumb * {
	border:none;
}

.block span {
	width:100%;
	text-align:center;
	line-height:16px;
	vertical-align:middle;
	font-size:14px;
	font-weight:bold;
	color:#04508C;
	margin:0;
	padding:0;
}

a.block span {
	text-decoration:underline;
}

.colors {
	text-align:center;
	margin:auto 115px auto 115px;
}

.colors div {
	float:left;
	width:122px;
	text-align:center;
}

.colors div img {
	float:left;
	margin:1px;
	padding:0px;
}

.colors div span {
	float:left;
	width:100%;
	text-align:center;
	clear:both;
}


.break
{
	float:none;
	clear:both;
	height:0.5em;
}

	

/*
	IE6 Hacks
*/

img, div, .pngfix, input, a  { behavior: url("css/iepngfix.htc") }