
/* Stylesheet voor StrateGis.nl  	*/ 
/* door vanmersbergen.com 			*/ 


/* ---------------------------------------------------------------------------------------------------------- 
/* styledefinities

/* kleuren
	KLEUR		CODE		TOEPASSING
	wit			#FFFFFF		achtergrond tekst		
							links topright
							tekst hoofdmenu
	grijs 1		#EFEFEF		achtergrond grijs
							achtergrond tabel headercel
							backgroundhover submenu
	grijs 2		#DADADA		lijnen tabel
							tussenlijnen in submenu en content
	grijs 3		#CCCCCC
	grijs 4		#888888		borders maincontainer
							borders bogen
							tekst footer |
							tekst toprightdiv
							bullet vierkantje
	grijs 5		#666666		kop (h3)
							tabs hoofdmenu - normal
	grijs 6		#333		achtergrond topbar		
							tabs hoofdmenu - selected
							tekst algemeen (p)
							rand plaatje
							sublogo
	zwart		#000000		kop (h1 en h2)
							submenu hover tekst
							hoofdmenu hover tekst														
	oranje		#FE641E		logo
							tekstlinks
							submenu links
							current hoofmenu tabs
							hover hoofdmenu tabs
							hover links toprightdiv
							hover links footer

/* ---------------------------------------------------------------------------------------------------------- 

/* body 							*/ 

body{
margin: 0;
padding: 0;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 12px;
background-color: #EFEFEF;

/* scrollbar (IE only) 			*/ 

scrollbar-face-color		: #FFFFFF;
scrollbar-arrow-color		: #FE641E;
scrollbar-track-color		: #FFFFFF;
scrollbar-shadow-color		: #DADADA;
scrollbar-highlight-color	: #DADADA;
scrollbar-3dlight-color		: #EFEFEF;
scrollbar-darkshadow-color	: #EFEFEF;  
scrollbar-width				: 5px;
}

#zij {
background-color: #333;
}

/* classes 						*/ 

a:link    { color: #FE641E;text-decoration: none;}
a:visited { color: #FE641E;text-decoration: none;}  
a:active  { color: #FE641E;text-decoration: none;}
a:hover   { color: #FE641E;text-decoration: underline; }

hr {
height:1px;
lin-color:#dadada;
border-top: 0px;
border-left: 0px;
border-right: 0px;
width:100%;
}

/* tabel 						*/ 

table {
border-collapse: collapse;
caption-side: top left;
}

table.normal {
text-align: left;
margin-top: 12px;
margin-bottom: 12px;
}

table.normal td {
vertical-align: top;
}

table.normal h2 {
font-size: 11px;
color: #000;
font-weight: bold;	
margin-bottom: 0px;
margin-top: 4px;
letter-spacing: 1px;
}

table.normal h3 {
font-size: 11px;
color: #000;
font-weight: normal;
font-style: italic;	
margin-bottom: 0px;
margin-top: 12px;
}

table.normal p {
margin-top: 0px;
margin-bottom: 12px;
text-align: left;
font-size: 11px;
color: #333;
}

table.line {
border: 1px solid #dadada;
/* cellen met border van 1 pixel naast elkaar, wordt samen 1 pixel, en niet 2 */
text-align: left;
margin-top: 4px;
margin-bottom: 12px;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; 
font-size: 10px;
line-height: 1.2; 
}

table.line td {
border : 1px solid #DADADA;
padding: 2px;
vertical-align: top;
}

table.line th {
border : 1px solid #DADADA;
padding: 2px;
vertical-align: top;
background-color: #EFEFEF;
font-weight: bold;
font-size: 11px;	
}

img {
margin: 0px;
}

.kader {
margin: 0px;
border: 1px solid #333;
padding: 0px;
}

.kader-right {
margin-left: 12px;
margin-bottom: 4px;
margin-right: 0px;
margin-top: 0px;
border: 1px solid #333;
float: right;
}

.kader-off {
margin: 0px;
}

.kader-right-off {
margin-left: 12px;
margin-bottom: 4px;
margin-right: 0px;
margin-top: 0px;
border: 1px solid #FFF;
float: right;
}

/* schaalbare maincontainers 	*/ 

#maincontainer{
width: 724px;
padding-left: 4px;
margin-left: 108px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
background-color: #FFF;
border-left: 1px solid #888;
border-right: 1px solid #888;
}

* html #.maincontainer{ /*IE */
width: 709px; /*IE 5*/
w\idth: 724px; /*IE 6*/
}

#applcontainer{
width: 100%;
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
background-color: #FFF;
text-align: center;
}

* html #.applcontainer{ /*IE */
width: 100%; /*IE 5*/
w\idth: 100%; /*IE 6*/
}

/* header en hoofdmenu			*/ 

#topbar{
clear: both;
width: 100%;
background: #333 url(../style_pics/headerboog.gif) top left no-repeat ;
margin: 0px;
padding: 0px;
height: 76px;
}

#topcontainer {
clear: both;
padding: 0px;
margin: 0px;
padding-top: 4px;
width: 100%;
}

#logodiv{
float: left;
width: 380px;
margin-top: 10px;
margin-left: 0px;
padding-bottom: 8px;
}

#logo{
float: left;
width: 180px;
margin-left: 4px;
padding: 0px;
}

#sublogo{
float: left;
width: 180px;
font-weight: bold;
font-size: 11px;
color: #333;
padding-top: 12px;
padding-left: 4px;
}

#toprightdiv{
float: right;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; 
font-size: 10px;
color: #888;
font-weight: bold;
letter-spacing: 1px;
line-height : 1;
text-align: right;
margin-top: 0px;
margin-right: 4px;
}

#toprightdiv a{
text-decoration: none;
margin-right: 2px;
margin-left: 2px;
color: #FFF;
}

#toprightdiv a:hover{
color: #FE641E;
}

#hoofdcontainer{
float: left;
padding-left: 0px;
margin-left: 0px;
margin-top: 7px;
width: 100%;
}

#hoofdmenu{
width: 520px;
padding-left: 0px;
margin-top: 0px;
margin-left: 108px;
margin-right: auto;
background: transparent;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; 
font-size: 10px;
voice-family: "\"}\"";
voice-family: inherit;
}

#hoofdmenu ul{
margin:0;
padding:0;
list-style:none;
}

#hoofdmenu li{
display:inline;
margin:0 2px 0 0;
padding:0;
text-transform:uppercase;
}

#hoofdmenu a{
float:left;
color: #FFF;
background: #666;
margin:0 1px 0 0;
padding: 0 0 1px 2px;
text-decoration:none;
letter-spacing: 1px;
}

#hoofdmenu a span{
float:none;
display:block;
padding: 2px 6px 2px 6px;
}

#hoofdmenu a:hover{
background-color: #FE641E;
color: #000;
}

#hoofdmenu a:hover span{
background-color: #FE641E;
color: #000;
}

#hoofdmenu #current a, #hoofdmenu #current span{ 
/*	currently selected tab		*/
background-color: #FE641E;
color: #000;
}

/* Bovenlijst 				*/

#hoofdmenuline{
clear: both;
padding: 0px;
margin: 0px;
width: 100%;
height: 10px;
background: #FFF url(../style_pics/header.gif) top left repeat-x;
border-top: 1px solid #FFF;
}

/* Midden kolom 				*/

#middle {
clear: both;
width: 100%;
background: #EAEAEA;
margin: 0px;
padding: 0px;
border: 0px;
}

#leftcolumn{
clear: left;
float: left;
width: 120px;
margin-right: 4px;
margin-top: 4px;
padding-top: 31px;
}

.submenu{
list-style-type: none;
margin: 0;
margin-bottom: 4px;
padding: 0;
}

.submenu li{
padding-bottom: 2px;
}

.submenu li a{
color: #FE641E;
display: block;
padding: 2px 0;
padding-left: 4px;
text-decoration: none;
font-weight: bold;
border-top: 1px solid #dadada; 
font-size: 90%;
}

.submenu a:hover{
background-color: #EFEFEF;
color: #333;
text-decoration: none;
}

.submenu a span{
color: #FE641E;
padding: 0px;
margin: 0px;
}

.submenu a:hover span{
color: #333;
background-color: #EFEFEF;
text-decoration: none;
}

.submenu #current a, .submenu #current span{ 
/*	currently selected item		*/
color: #333;
}

#leftcolumn h1 {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; 
font-weight: bold;
font-size: 11px;
color: #333;
font-weight: bold;	
margin: 0px;
padding-right: 2px;
padding-top: 2px;
padding-bottom: 4px;
padding-left: 4px;
border-top: 1px solid #dadada; 
}

/* Middenkolom 					*/

#middlecolumn{
width: 560px;
float: left;
margin-top: 4px;
padding-left: 8px;
padding-right: 8px;
padding-bottom: 24px;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; 
font-size: 11px;
line-height: 1.4;
}

#middlecolumn h1 {
font-size: 18px;
color: #000;
font-weight: bold;	
letter-spacing: 1px;
margin-bottom: 8px;
margin-top: 4px;
padding-bottom: 2px;
border-bottom: 1px solid #dadada; 
}

#middlecolumn h2 {
font-size: 11px;
color: #000;
font-weight: bold;	
margin-bottom: 0px;
margin-top: 4px;
letter-spacing: 1px;
}

#middlecolumn h3 {
font-size: 11px;
color: #000;
font-weight: normal;
font-style: italic;	
margin-bottom: 0px;
margin-top: 12px;
}

#middlecolumn p {
margin-top: 0px;
margin-bottom: 12px;
text-align: left;
font-size: 11px;
color: #333;
}

#middlecolumn .news {
margin-top: 0px;
margin-bottom: 0px;
text-align: left;
font-size: 10px;
color: #999;
}

#middlecolumn .news_red {
margin-top: 0px;
margin-bottom: 0px;
text-align: left;
font-size: 10px;
color: #FE641E;
}

#middlecolumn ul {
margin-top: 0px;
margin-bottom: 12px;
margin-left: 16px;
margin-right: 0px;
list-style-image:  url(../style_pics/bullet.gif)  ;
}

/* Rechterkolom (uitgeschakeld)			*/

#rightcolumn{
width: 120px;
float: left;
padding-left: 4px;
margin-top: 0px;
}

#right{
width: 120px;
float: left;
margin-top: 32px;
border-top: 1px solid #dadada; 
}

#right h1 {
font-size: 10px;
color: #000;
font-weight: bold;	
margin-bottom: 0px;
margin-top: 4px;
}

#right p {
font-size: 10px;
}

/* Onderlijst 				*/

#footerline {
clear: both;
margin: 0px;
padding: 0px;
width: 100%;
height: 10px;
background: #FFF url(../style_pics/footer.gif) top left repeat-x;
border-bottom: 1px solid #FFF; 
}

/* Footer 		*/

#footerregel {
margin-top: 0px;
margin-bottom: 0px;
width: 100%;
height: 76px;
background: url(../style_pics/footerboog.gif) top left no-repeat ;
width: 100%;
margin-left: 0px;
}  

#footercontainer{
width: 790px;
padding-left: 4px;
margin-left: 108px;
margin-right: auto;
}

#footerlinks {
float: left;
width: 120px; 
margin-top: 0px;
margin-left: 0px;
} 

#footerlogo {
float: right;
width: 54px; 
text-align: left;
margin-top: 0px;
margin-right: 0px;
} 

#footerrechts {
float: right;
width: 560px; 
text-align: right;
font-family: Verdana,Arial,Helvetica,sans-serif; 
color: #888;
font-size: 10px;
margin-top: 4px;
margin-right: 8px;
} 

#footerrechts a {
text-decoration: none;
color: #000;
}
#footerrechts a:hover {
color: #FE641E;
text-decoration: none;
}

/* Clearfix en hacks 			*/

.clearfix:after{ /*Clear floats hack: http://positioniseverything.net/easyclearing.html*/
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden;
}

.clearfix {display: inline-table;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

.applclearfix:after{ /*Clear floats hack: http://positioniseverything.net/easyclearing.html*/
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden;
}

.applclearfix {display: inline-table;}
/* Hides from IE-mac \*/
* html .applclearfix {height: 1%;}
.applclearfix {display: block;}
/* End hide from IE-mac */

html>body .screenshots{ /*Non IE rule*/
margin-right: 16px;
}

#empty {
background-color: #333;
}

/* ----------------------------------------------------------------------------------------------------------*/ 
