/* -----------------------------------------------------------------------------------

Style Sheet for http://www.koymans.be 

Author:		Luc Koymans
Email:		info@koymans.be
Website:	http://www.koymans.be

----------------------------------------------------------------------------------- */




/* -------- GENERAL SETTINGS TO AVOID IMCOMPATIBILITIES BETWEEN DIFFERENT BROWSERS -------- */
* {
	margin:0;
	padding:0;
	font-family: "Trebuchet MS", Arial, sans-serif, courier;
}

body {
	font-family: "Trebuchet MS", Arial, sans-serif, courier;
	font-size:14px;
	background:#fafafa url(/layout/bg_body.jpg) 0 0 repeat-x;
}

/* The class clear is used as floated elements are taken out of the flow of the contents of the wrapper div */
.clear {
	clear:both;
}

.center {
	text-align:center;
}

/* IE and Opera control list indentation using left margin */
/* Safari and Firefox use left padding. Therefore: */
ul {
	list-style-type:none;
	padding:0;
	margin: 0;
}

	  /* :KLUDGE: Removes large gaps in IE/Win */
/*
li {
	  display: inline;
}*/

img {
	border:0;
}

h1 {
	font-size: 22px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: normal;
	color:#65150a;
	text-align:center;
	height:30px;
}

h2 {
	font-size: 18px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: normal;
	color: #d77514;
	text-align:center;
}

.hide{ /* hides text from broswer */
        position:absolute;
        left:-9999px;
        width:0px;
        overflow:hidden;
}

/* Always use the following order to avoid cascade problems */
a:link, a:visited {text-decoration:none;}
a:hover, a:active {text-decoration:none;}

/* -------- END OF GENERAL SETTINGS TO AVOID IMCOMPATIBILITIES BETWEEN DIFFERENT BROWSERS -------- */


#wrapper {
	width:1000px;
	margin:0;
}

#header {
	background: #fff url(/layout/logo.jpg) 0 0 no-repeat;
	width:1000px;
	height:210px;
}

#headermenu {
	position:relative;
	margin-left:250px;
	width:280px;
	height:33px;
}

#portfolio {
	background:url(/layout/portfolio.png) 0 0 no-repeat;
	position:absolute;
	top:0px;
	left:0px;
	width:144px;
	height:33px;
}

#portfolio a {
	display:block;
	width:144px;
	height:33px;
	text-align:center;
	padding-top:5px;
	padding-left:2px;
	font-family:Arial, sans-serif, courier;
	color:#000;
	letter-spacing:6px;
	font-size:12px;
}

#portfolio a:hover {
	background:url(/layout/portfolio_hover.png) 0 0 no-repeat;
}

#contact {
	background:url(/layout/contact.png) 0 0 no-repeat;
	position:absolute;
	top:0px;
	left:132px;
	width:75px;
	height:33px;
}

#contact a {
	display:block;
	width:75px;
	height:33px;
	text-align:center;
	padding-top:5px;
	font-family:Arial, sans-serif, courier;
	color:#fff;
	letter-spacing:2px;
	font-size:12px;
}

#contact a:hover {
	background:url(/layout/contact_hover.png) 0 0 no-repeat;
}

#content {
	text-align:left;
	padding-left: 220px;
	padding-right:20px;
	min-height:500px;
	height:auto !important;
	height:500px;
}

#content ul {
	list-style-type:circle;
}

#content a {
	color:#ff9423;
	text-decoration:none;
}

#content a:hover {
	text-decoration:underline;
}

.port {
	text-align:left;
}

.port a {
	color:#ffb423;
	text-decoration:underline;
}

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

.floatleft {
	float:left;
	padding-left:190px;
	padding-right:50px;
}

.leftpadding {
	padding-left:220px;
}

#footer {
/*	background:#fff url(/layout/footer_gradient.jpg) 0 0px no-repeat; */
	background-color:#fafafa;
	width:1000px;
	height:75px;
}

#leftfooter {
	background:#fafafa url(/layout/bg_footer.jpg) 0 0px no-repeat;
	height:75px;
	padding: 0px;
	padding-left:275px;
	float:left;
}

#rightfooter {
	background-color:#fafafa;
	height:75px;
	padding: 0px;
	padding-right:20px;
	float:right;
}

#leftfooter a, #rightfooter a {
	height:75px;
	line-height:75px;
	color:#474747;
	text-decoration:none;
	font-size:16px;
}

#leftfooter a:hover, #rightfooter a:hover {
	text-decoration:underline;
}

.whitespace {
	width:1000px;
	height:30px;
}

/* -------- MAIN MENU -------- */
#mainmenu {
	background:url(/layout/oranjebalk.jpg) 0 20px no-repeat;
	text-align:center;
	margin-left:285px;
	height:74px;
}

#mainmenu ul {
	float:left;
	list-style:none;
	text-align:center;
	list-style-type:none;
}

#mainmenu ul li {
	float:left;
	text-align:center;
}

#mainmenu ul a {
	display:block;
	width:90px;
	height:50px;
	float:left;
	text-decoration:none;
	color:#000;
}

#mainmenu ul a:hover {
	color:#fc9700;
}

#mainmenu #home a {
	color:#000;
	font-size:16px;
}

#mainmenu #home a.active, #mainmenu #home a:hover {
	background:url(/layout/home_hover.jpg) 14px 24px no-repeat;
	color:#d77514;
}

#mainmenu #cms a {
	color:#000;
	font-size:16px;
}

#mainmenu #cms a.active, #mainmenu #cms a:hover {
	background:url(/layout/cms_hover.jpg) 14px 24px no-repeat;
	color:#004b63;
}

#mainmenu #seo a {
	color:#000;
	font-size:16px;
}

#mainmenu #seo a.active, #mainmenu #seo a:hover {
	background:url(/layout/seo_hover.jpg) 14px 24px no-repeat;
	color:#50a3be;
}

#mainmenu #w3c a {
	color:#000;
	font-size:16px;
}

#mainmenu #w3c a.active, #mainmenu #w3c a:hover {
	background:url(/layout/w3c_hover.jpg) 14px 24px no-repeat;
	color:#15cde8;
}

#mainmenu #tohtml a {
	color:#000;
	font-size:16px;
}

#mainmenu #tohtml a.active, #mainmenu #tohtml a:hover {
	background:url(/layout/tohtml_hover.jpg) 14px 24px no-repeat;
	color:#3daab6;
}

#mainmenu #script a {
	color:#000;
	font-size:16px;
}

#mainmenu #script a.active, #mainmenu #script a:hover {
	background:url(/layout/script_hover.jpg) 14px 24px no-repeat;
	color:#2d839c;
}

#mainmenu #hosting a {
	color:#000;
	font-size:16px;
}

#mainmenu #hosting a.active, #mainmenu #hosting a:hover {
	background:url(/layout/hosting_hover.jpg) 14px 24px no-repeat;
	color:#cdcece;
}

/* -------- END OF MAIN MENU -------- */