@charset "utf-8";

/* *****************************************************************************************************************************

Main note: By controlling almost every single aspect of the site via CSS, you can make changes to the site in a simple way. I've
tried to comment the important ones, and i've also included several alternatives to what you see now. remember... this is only 
the first step. When we are TOTALLY satisfied with the first (single) page, we'll roll out this with more pages and content. for 
now, let's focus on this first page... 

Also note... as it stands now, this page is extremely lightweight and 'correct' ;-) A couple of comments though. I was unable
to extract the images you sent (except three logos), and so i used old elements and coloring. The colors should be nearly
correct though, and i've used a bi-color scheme. We can of course do a tri-color one, but we'll talk about that. Also, for now
i've not used any other images than your logo. This makes it stand nicely out, but this will change a bit when we start adding
product logos (i.e. in the first-item-pane) together with news item images ;-)

Oh, by the by... also note that the menu item is a library element. this makes it very easy to add pages or change the menu 
later on. Library items are one of the best functions of Dreamweaver.

***************************************************************************************************************************    */


/* Main components */
	
	Body{
		/* The next three definitions are remmed out. they are striped (and big) background, either greeninsh or grey. try them ;-) */
		/* But remember to re out the 'background-color' statement */
		
		/* 
		background-image:	url(images/dot_bg.jpg);		
		background-repeat:	repeat;						
		*/
		
		/* 
		background-image:	url(images/dot_bg_grey.jpg);		
		background-repeat:	repeat;						
		*/
		
		/* */
		background-image:	url(images/big_bg_image.gif);		
		background-repeat:	repeat;						
		

		background-color:	#e8edc1; 
		padding:			0px;
		padding-top:      	20px; 				/* Change this to adjust top padding...*/	
		padding-bottom:		20px;
		margin:				0px;
		}	




/* Table / Site layout properties  */

	.TableControl{								/* main wrap-around table. mainly used to control (enforce) overall background color */
		/* 	background-color:	#e8edc1; */
		background-color:	#FFFFFF;
		}

	.TableTop{
		background-color:	#d5dba8;
		height:				100px;	
		padding-top:	 	0px;
		padding-left:		10px;
		}
		
	.TableLeft{
		padding-left:		20px; 
		padding-top:	 	30px; 				/* This is to create a bit of distance between the first line of text and the top of the page    */
		padding-bottom:	 	10px;				/* This is to create a bit of distance between the last line of text and the bottom of the page  */		
		}	
	
	.TableRight{
		padding-left:		10px;
		padding-right:		20px;
		padding-top:	 	10px;
		padding-bottom:	 	10px;
		
		/*	the two next lines defines a vertical divider between menu and main part, if wanted ;-) */
		
		/*
		background-image:	url(images/dot_vert_dots.gif);
		background-repeat:	repeat-y;	
		*/		
		
		}	
		
	.TableRightSub1{
		padding-left:		10px;
		padding-right:		10px;
		padding-top:	 	2px;
		padding-bottom:	 	10px;
		}
		
	.TableRightSub2{
		padding-left:		10px;
		padding-right:		30px;
		padding-top:	 	2px;
		padding-bottom:	 	10px;
		}				
			
		
	.TableBottom{
		background-color:	#d5dba8;
		padding-top:		5px;
		width:             	700px;
		height: 			30px;
		}	
		
	.TableTopDivider{
		background-image:	url(images/divider_top.gif);
		height:				10px;
		padding:			0px;
		margin:				0px;		
		}		
		
	.TableBtmDivider{
		background-image:	url(images/divider_bottom.gif);
		height:				10px;
		padding:			0px;
		margin:				0px;		
		}		
		
		
	.TableSiteTop{
		background-image:	url(images/site_top.gif);
		height:				10px;
		padding:			0px;
		margin:				0px;		
		}		
		
		
	.TableSiteBottom{
		background-image:	url(images/site_bottom.gif);
		height:				10px;
		padding:			0px;
		margin:				0px;		
		}		
		
		
		
		
		
	.PaneMain{									
	/* This is a special DIV tag that encloses and defines the main / first page item   */
		/*background-color:	#edf0f6*/	
		/*padding-bottom:		10px;*/
		padding-left:		10px;
		padding-right:		10px;
		text-align:center;
		
		
		}
		
		
		
		
/* text elements / formatting */
	
	P{						/* 	This code ensure that ALL fonts (p tags) has the same base properties 
							This way, you only have to make small individual changes to each element  
							(header, ingress and so on)..  */
		font-family:		Arial;
		font-size:			12px;
		text-align:			left;
		margin-top:			2px;				/* Margin sets the default distance between paragraphs */
		margin-bottom:		2px;	
		}
	
	.FontPath{
		color:				#999999;
		font-size:			9px;
		margin-bottom:		5px;
		}
		
	.FontHeader{
		color:				#626646;
		font-size:			14px;
		padding-top:		15px;		
		font-weight:	  	bold;					
		}
	
	.FontIngress{
		color:				#626646;
		font-weight:	  	bold;
		}
		
	.FontMain{
		color:				#626646;	
		}

	.FontBottom{
		text-align:			center;
		color:				#444444;
		font-size:			9px;			
		}		
	
	.FontDate{
		color:				#999999;
		font-size:			9px;	
		padding-top:		1px;
		padding-bottom:		1px;
		}		
	
	.FontNewsHeader{
		color:				#4c68a7;
		font-size:			14px;
		padding-top:		15px;		
		font-weight:	  	bold;					
		}
	
	.FontNewsMain{
		color:				#4c68a7;
		font-size:			11px;			
		}
	
	
	
	
/* These tags are all properties for the link elements..  */
		
	a:link{
		text-decoration:	none;
		color:				#4c68a7;
		}
		
	a:visited{ 
		text-decoration:	none;
		color:				#4c68a7;
		}
		
	a:hover{
		text-decoration:	underline;
		color:				#4c68a7;
		}
		
	a:active{ 
		text-decoration:	none;
		color:				#4c68a7;
		}
		
		.ImageControl{
		padding:10px;
		float:left;
		} 
		
		
		.FrontPageHeader{
		color:				#626646;
		font-size:			16px;
		padding-top:		2px;		
		font-weight:	  	bold;					
		}


/* Riens own code */
		
	.FontHeaderRien{
		color:				#626646;
		font-size:			14px;
		/*padding-top:		15px;*/		
		font-weight:	  	bold;
		text-align:			center;				
		}

	img{
		border:0px;
		}		
		
		.DelphusControl{
		padding:10px;
		padding-bottom:20px;
		float:left;
		}
		
	.HexaformerFont{
	float:left;
	padding-left: 60px;
	color:				#626646;
	font-weight:	  	bold;
	}