
/*
-----------------------------------------------
Styles for: SC Solutions B.V.
Written by: www.tulipdesign.nl, Saskia Verlinden
Date: July 2008
-----------------------------------------------
colorset: d.blauw #0076C0
          l.blauw #BDDCEF
					oranje #F78F1E
					type d.blauw #01243A
					linktype oranje #D57002
*/

* {padding: 0; margin: 0;}

/* --------font-sizing--------*/

body {font-size: 100%; /*for IE*/}
html>body {font-size: 16px; /* for alle other browsers, IE cannot read this*/}


/* --------fonts and fontsize-------- */

html, body { 
   height: 100%;    /*important for 100% height*/
   font-family: Arial, Helvetica, Verdana, sans-serif;
   background: #e7e7e7 /* url(../images/bgbody.jpg) repeat 0 0*/;
   color: #01243A /*donker blauw*/;
   }

p, ul, li, form, table{
   font-family:  Arial, Helvetica, Verdana, sans-serif;
   font-size: 0.8em;
   line-height: 1.3;
   }

p, h1, h2, h3, ol, ul, table, td, th, form {
   text-align: left;
   }

p, ol, ul {padding: 5px 0 15px 0;}

h1 {
   font-family:  Arial, Helvetica, Verdana, sans-serif;
   color:  #D57002;
   font-size: 1em;
   font-weight: bold;
   margin-bottom: 5px;
   padding: 10px 0 0 0;
   }
	 
h1#titel {color: #0076C0}

h2 {
   font-family: Arial, Helvetica, Verdana, sans-serif;
   color: #D57002;
   font-size: .9em;
   font-weight: bold;
   font-variant: normal;
   padding: 10px 0 0 0;
	 clear:both;
   }

h3 {
   font-family: Arial, Helvetica, Verdana, sans-serif;
   color: #89014c;
   font-size: 0.8em;
   font-weight: bold;
   font-variant: normal;
   margin-bottom: -5px;
   } 

img {border:none}
ul.opsomming {list-style-type: square;font-size:1em;padding-left:20px;}

/*--------links--------*/

a:link {
   color:  #01243A;
   text-decoration: underline;
   }	

a:visited {
   color: #01243A;
   text-decoration: underline;  
   }

a:hover {
   color: #D57002;
   text-decoration: none;
   }

/*--------structure--------*/

#main {
   position: relative;
   min-height: 100%;
   height:auto !important; /* 100% height for modern browsers */
   height:100%; /*100% height for IE */
   overflow: auto;
   width: 950px;
   top: 0;
   margin: 0 auto;
   text-align: center;
   background:#fff url(../images/bgleftgradient.jpg) no-repeat 0 0;
	 border-right:1px solid #bddcef;
   }

*html #main {overflow: visible;} /*so IE6  behaves*/

/*--------header--------*/

#hide a, #hide a:hover, #hide a:visited {
   position:absolute; 
   left: 0px; 
   top:-500px; 
   width: 1px; 
   height: 1px; 
   overflow:hidden;
   text-align: left;
   } 

#hide a:active { 
   position:static; 
   width:auto; 
   height:auto; 
   }

div#header{
   padding-top: 205px; /* height of the replacement image */
   width: 900px;
   height: 0;
   overflow: hidden;
   background: transparent;
   margin: 0 auto;
   text-align: center;
   }
	 
div#header h1 {padding-left: 50px;}

#logo {display: block; position: absolute; top:0;right:0}


div#replacement {
   padding-top:310px; /* height of the replacement image */
	 width: 314px;
	 height:0;
	 overflow: hidden;
	 }
#replacementImg {display:block;position:absolute;top:205px;right:0}
	 

/*-------wrapper(Home)-------*/
.arrow {margin-bottom:-2px;}
#wrapperHome {background:transparent url(../images/fauxcolumns.jpg) repeat-y; width:900px; margin-left:50px; overflow:hidden;}
#wrapper {background:transparent url(../images/fauxcolumns2.jpg) repeat-y; width:900px; margin-left:50px; overflow:hidden;}

/*-------textHome-------*/
#textHome {background:transparent; width:566px; padding: 0 10px; float:left;}
*html #text {width:536px;}
#flags img {float:left; margin-top: 20px;}
#flags p {float:left;margin-top:20px;padding-left: 5px;}
#flags a img{text-decoration: none; border:1px solid black;}
#flags a:hover img {border:1px solid #D57002;}

/*-------columnRight--------*/
#columnRight {background:#bddcef /*lichtblauw*/; width:314px; float:left; height:100%}
#columnRight img {display:block;}

/*-------navigation-------*/
#navigation {background:transparent; width:212px; padding: 0 10px; float:left; height:100%;}
#navigation ul {list-style: none; font-size: 1em; margin-top: 10px; width: 210px;}
#navigation a {text-decoration: none; display: block; padding: 3px 0 3px 25px; position:relative;}
*html #navigation a {height: 1%;} /*for IE6 (and below), fixes white-space bug*/
#navigation a:link {border-bottom:1px dotted #01243A;}
#navigation a:visited {border-bottom: 1px dotted #01243A;}
#navigation a:hover {background: url(../images/pijloranjebgblauw.jpg) no-repeat 0 0;}
li#youAreHere a {background: url(../images/pijloranjebgblauw.jpg) no-repeat 0 0;border-bottom: 1px dotted #01243A;color:#D57002;font-weight:bold;overflow:overflow;}
.category {color: #0076C0;font-size: 0.9em;font-weight:bold;border-bottom:1px solid #0076C0;padding-top:3px;padding-bottom:3px}

/*-------text-------*/
#text {background:white; width:638px; float:left; height:100%;padding:10px 10px 0 10px;margin-right:10px}
.images {float:left; border:1px solid #bddcef; padding:5px; margin:10px 5px 0 0;}
table#resume {width:100%;border-collapse:collapse;border:1px solid black; margin-top:10px}
#resume td, #resume th {border:1px solid black;padding-left:5px;vertical-align:top;}
#resume th {padding-top:10px}
#resume ul {list-style-type:square;padding-left: 20px;}
#resume li {font-size: 1.2em;}

/*-------textHome2-------*/
#textHome2 {float:left; width:380px;padding-right:10px;padding-left:12px;border-left:1px solid #ccc;}

/*---END wrapper(Home)---*/
.innerPageLinks {border-bottom:1px dotted orange;padding-top:2px;padding-bottom:4px;}
/*-------contactform-------*/

/*-------right column-------*/
#rightColumn {float: left; background: transparent; width: 200px; padding: 40px 10px 10px 10px; overflow:auto;}
#rightColumn img {float:right;}


/*-------footer-------*/
#footer {display: block; background:#f78f1e;height:4em;width:900px; clear: both; position: absolute;bottom: 0;right: 0;}
#footer p {color:black;text-align:center;padding-top:15px;}
#footer a:hover {color: #01243A;}
#footer span {font-weight:bold;}
