/**********************************************************/
/*            GRAFICAL website stylesheet                 */
/*                                                        */
/* Design by GRAFICAL:please contact via info@grafical.be */
/*                                                        */
/*             LAST UPDATE : 19-10-2010                   */
/*                                                        */
/**********************************************************/


/************************* RESET **************************/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/************************* END RESET ***********************/

/************************** GENERAL ************************/
body {
	background:url(images/body-bg.jpg) repeat scroll 0 0;
	color :#878787;
	font-family:"Trebuchet MS",Arial,Helvetica,sans-serif;
	font-size : 10pt;
}
#wrapper{margin:300px auto;width:960px;height:300px;text-align:center;}

h1 {
font-size:28px;
color :#00a9e2;
margin:30px 0px;
}

h2 {
font-size:25px;
color :#00a9e2;
}

h3 {
font-size:18px;
}

h4 {
font-size:12px;
}

p {
font-size:14px;
}

a {
font-size:14px;
color :#00a9e2;
}
a:hover {
font-size:14px;
color :#fff;
}

/*********************** END GENERAL ***********************/

/************************* HEADER **************************/
.header-home {
background : #1e1c1f url(images/header-home-bg.jpg) repeat scroll 0 0;
height:126px;
width:100%;
}

.header {
background : #1e1c1f url(images/slideshow-bg.jpg) repeat scroll 0 0;
height:126px;
width:100%;
}

.content {
margin: 0 auto;
width:960px;
}

.header-home .content .logo {
background : url(images/grafical-logo-header.png) no-repeat;
float: left;
margin: 10px 0px 0px 10px;
text-indent: -9999px;
height:100px;
width:300px;
}

.header .content #menu {
float:right;
margin-top:53px;
}

.header .content .logo {
background : url(images/grafical-logo-header.png) no-repeat;
float: left;
margin: 10px 0px 0px 10px;
text-indent: -9999px;
height:100px;
width:300px;
}

.header-home .content #menu {
float:right;
margin-top:53px;
}

/********* SPRITES MENU ******/
ul#main-menu{
margin:0; 
padding:0;
list-style:none;
clear:both;
}
		
#main-menu li{
overflow:hidden;
text-indent:-9999px;
display:inline;
float:left;
/*margin-right:10px;*/
}

#main-menu li a{
background:url(images/main-menu-sprite.png) no-repeat; 
width:100%;
height:100%;
display:block;
}

/* Home Button */
			#main-menu li.home{width:77px; height:72px;}
				#main-menu li.home a{background-position:0px 0px;}
				#main-menu li.home a:hover{background-position:0px -72px;}

/* diensten Button */
			#main-menu li.diensten{width:104px; height:72px;}
				#main-menu li.diensten a{background-position:-77px 0px;}
				#main-menu li.diensten a:hover{background-position:-77px -72px;}	

/* realisaties Button */
			#main-menu li.realisaties{width:124px; height:72px;}
				#main-menu li.realisaties a{background-position:-181px 0px;}
				#main-menu li.realisaties a:hover{background-position:-181px -72px;}	

/* contact Button */
			#main-menu li.contact{width:98px; height:72px;}
				#main-menu li.contact a{background-position:-305px 0px;}
				#main-menu li.contact a:hover{background-position:-305px -72px;}				

				
/*********************** END HEADER ************************/

/****************** slideshow  **************************/
.slideshow {
background : #1e1c1f url(images/slideshow-bg.jpg) repeat scroll 0 0;
height:320px;
width:100%;
}

/*********************End Slideshow **********************/

/******************** Main content  *********************/
.main-content {
background : #ffffff url(images/content-bgtop.jpg) repeat-x scroll 0 0;
min-height:470px;
width:100%;
}
/****************** End main content ********************/

/******************* Footer  ***************************/
.footer{
background : #1e1c1f url(images/slideshow-bg.jpg) repeat scroll 0 0;
height:205px;
width:100%;
}

/******************End footer ***************************/