/* Design by Bas van Helvoort, 16 July 2009 */
/* Validated as CSS 2.1 on 21 July 2009 & 10 Feb 2010 */
/* http://jigsaw.w3.org/css-validator/validator#css */


/* Body elements */
/* Base body style */
body {
 	background-image: url(../graphics/top.png);
	background-repeat: repeat-x;
	background-color:#339933;
	margin: 0px;
	padding: 0px;
	font-family:"Verdana", "Arial", "Helvetica", "Sans Serif";
	font-size:100%;
	font-style:normal;
	font-weight:normal;
	color:black;
	letter-spacing:0px;
	text-align:justify;
}

/* Base body style used in the TopFrame and LeftFrame (navigation) frames of the page OBSOLETE */
body.left-frame {
	background-color:#339933;
	background-image: url(../graphics/left.png);
	background-repeat: repeat-y;
}

body.top-frame {
	background-color:#339933;
	background-image: url(../graphics/top.png);
	background-repeat: repeat-x;
}

/* Body style used for CV-sections in the BodyFrame frame of the page OBSOLETE */
body.body-frame-section {
	background-color:#669933;
	background-image: url(../graphics/left.png);
	background-repeat: repeat-y;
}

/* Body style used for Job-descriptions in the BodyFrame frame of the main page OBSOLETE */
body.body-frame-job {
	background-color:#669966;
	background-image: url(../graphics/left.png);
	background-repeat: repeat-y;
	font-family: "Arial", "Helvetica", "Sans Serif";
}



/* Division elements */
/* Three main Divisions: leftpanel, header, content */

div.leftpanel{
	background-image: url(../graphics/left.png);
	background-repeat: repeat-y;
   position : fixed;
   width : 25%;
   height : 100%;
   top : 0;
   left : 0;
   margin : 0px 0px 0px 0px;
   border : 0px solid blue;
   padding : 1% 0% 1% 0%;
   overflow : auto;
}

div.header{
   position : fixed;
   width : 74%;
   height : 6%;
   top : 0;
   left : 26%;
   margin : 0px 0px 0px 0px;
   border : 0px solid blue;
   padding : 0% 0% 0% 0%;
}

div.content{
	background-image: url(../graphics/left.png);
	background-repeat: repeat-y;
   position : absolute;
   width : 74%;
   height : 93%;				/* 84% with footer */
   top : 7%;
   left : 26%;
   bottom : 10%;
   margin : 0px 0px 0px 0px;
   border : 0px solid blue;
   padding : 0% 0% 0% 0%;
   overflow : auto;
}

/* Top-edge Division for horizontal top shading within other division */
div.top-edge {
 	background-image: url(../graphics/top.png);
	background-repeat: repeat-x;
	position:absolute;
	left:0px;
	top:0px;
	width:100%;
	height:88px;
	margin:0px;
	border:0px solid red;
   padding : 0% 0% 0% 0%;
}

div.section-nav-bar-top, div.section-nav-bar-bottom {
	padding-top:0.25em;
	padding-right:0.25em;
	padding-bottom:0.25em;
	padding-left:0.25em;
	font-size:inherit;
}

div.section-page-title {
	background-color:#669933;
	background-image: url(../graphics/left.png);
	background-repeat: repeat-y;
	font-family: "Arial", "Helvetica", "Sans Serif";
	padding-top:0.25em;
	padding-right:0.25em;
	padding-bottom:0.25em;
	padding-left:0.25em;
	font-size:inherit;
}

div.section-page-body {
	background-color:#669933;
	background-image: url(../graphics/left.png);
	background-repeat: repeat-y;
	font-family: "Arial", "Helvetica", "Sans Serif";
	padding-top:0.25em;
	padding-right:0.25em;
	padding-bottom:0.25em;
	padding-left:0.25em;
	text-align:left; 
	font-size:inherit;
}

div.section-page-footer {
	background-color:#669933;
	background-image: url(../graphics/left.png);
	background-repeat: repeat-y;
	font-family: "Arial", "Helvetica", "Sans Serif";
	padding-top:0.25em;
	padding-right:0.25em;
	padding-bottom:0.25em;
	padding-left:0.25em;
	font-size:inherit;
}

div.job-nav-bar-top, div.job-nav-bar-bottom {
	padding-top:0.25em;
	padding-right:0.25em;
	padding-bottom:0.25em;
	padding-left:0.25em;
	font-size:inherit;
}

div.job-page-title {
	background-color:#669966;
	background-image: url(../graphics/left.png);
	background-repeat: repeat-y;
	font-family: "Arial", "Helvetica", "Sans Serif";
	padding-top:0.25em;
	padding-right:0.25em;
	padding-bottom:0.25em;
	padding-left:0.25em;
	font-size:1.125em;
}

div.job-page-body {
	background-color:#669966;
	background-image: url(../graphics/left.png);
	background-repeat: repeat-y;
	font-family: "Arial", "Helvetica", "Sans Serif";
	padding-top:0.25em;
	padding-right:0.25em;
	padding-bottom:0.25em;
	padding-left:0.25em;
	text-align:left; 
	font-size:inherit;
}

div.job-page-footer {
	background-color:#669966;
	background-image: url(../graphics/left.png);
	background-repeat: repeat-y;
	font-family: "Arial", "Helvetica", "Sans Serif";
	padding-top:0.25em;
	padding-right:0.25em;
	padding-bottom:0.25em;
	padding-left:0.25em;
	font-size:inherit;
}



/* Paragraph styles */
/* Normal or base or standard paragraph */
p, p.normal, p.standard {
	margin: 1px;
	padding: 1px;
	font-family: "Verdana", "Arial", "Helvetica", "Sans Serif";
	font-size:1em;
	font-style:normal;
	font-weight:normal;
	letter-spacing:0px;
	text-align:justify;
}

/* Padded, thin, white top-border */ 
p.topborder1 {
	padding-top:8px;
	border-top-style:solid;
	border-top-color:white;
	border-top-width:thin
}

/* Intoduction paragraphs: italic and spaced */
.intro {
	text-align:justify;
	font-style:italic;
	letter-spacing:0.67px
}



/* Header styles */
h1, h2, h2, h4, h5, h6 {
	font-family: "Verdana", "Arial", "Helvetica", "Sans Serifserif";
	color: #000000
}

h1 {
	font-size:1.5em;
}

h2 {
	font-size: 1.5em;
	font-style:italic
}

h3 {
	font-size: 1.1em;
}

h4 {
	font-size: 1.1em;
	font-style:italic
}

h5 {
	font-size: 1.0em
}

h6 {
	font-size: 1.0em;
	font-style:italic
}



/* Text styles */
/* Blind links */
.blindlink {
	color:gray;
}

/* Print link */
.printlink {
	font-size:0.55em;
}

/* The four link styles */
a:link, a:visited {
     text-decoration:underline;
	color:black;
}

a:hover, a:active {
	color:#7CFC00;
}

/* Span elements */
.bigalert {
	font-family:"Arial";
	font-size:2em; 
	font-weight:bold;
	font-variant:small-caps;
	text-align:center; 
	color:yellow;
}

.highlight{
	color:yellow;
	font-size:100%;
	font-weight:normal;
}



/* Tabel styles */
/* Standard invisible, full-width table DOESN'T WORK */
table.standard {
	width:100%;
}


/* Standard table row: top-left text allignment */
tr, tr.standard {
	text-align:left;
	vertical-align:text-top;
}

td, td.standard {
	text-align:left;
	vertical-align:text-top;
}

th, th.standard {
	text-align:left;
	vertical-align:text-top;
	font-weight:bold;
}


/* row-header column of 25% width */
.rowhdr25pct {
	width:25%;
	}


/* List elements */
ul, ol {
	margin:0;
	padding-top:0;
	padding-bottom:0.25em;
	text-align:left;
}

ul li, ol li {
	padding-top:0em;
	padding-bottom:0em;
	text-align:left;
}

ul.wide, ol.wide {
	margin:0em;
	padding-top:0.25em;
	padding-bottom:0.25em;
	text-align:left;
}

ul.wide li, ol.wide li {
	padding-top:0.25em;
	padding-bottom:0.25em;
	text-align:left;
}


/* Horizontal menu bar (in TopFrame) NOW OBSOLETE */
ul.hor-menu {
      float:left;
      width:100%;
      padding:0;
      margin-top:6px;
      list-style-type:none;
}

li.hor-menu {
      display:inline;
	 line-height:2em;
	 vertical-align:middle;
}

a.hor-menu {
      float:left;
      width:auto;
      height:2em;
      text-decoration:none;
      color:#90EE90;				/* lightgreen */
      background-color:green;
      padding:0.2em 0.6em;
      text-align:center;
      font-size:1em;
	 font-weight:bold;
      border-right:1px solid #90EE90;	/* lightgreen */
      border-left:1px solid #90EE90;	/* lightgreen */
}

a.hor-menu:hover {
      color:lime;
}

/* Horizontal navigation menu bar (top/bottom of page) */
ul.hor-nav-menu {
      float:left;
      width:100%;
      padding:0;
      margin-top:0px;
      list-style-type:none;
}

li.hor-nav-menu {
      display:inline;
	 line-height:0.75em;
	 vertical-align:middle;
}

a.hor-nav-menu {
      float:left;
      width:auto;
      height:1em;
      text-decoration:none;
      color:black;
      padding:0em 0.25em;
      text-align:center;
      font-size:0.75em;
	 font-weight:normal;
      border-right:1px solid black;
      border-left:1px solid black;
}

a.hor-nav-menu:hover {
      color:lime;
}



/* Borders */
/* Thin border styles */
.bordernone {border-style:none; border-width:thin}
.borderthindotted {border-style:dotted; border-width:thin}
.borderthindashed {border-style:dashed; border-width:thin}
.borderthinsolid {border-style:solid; border-width:thin}
.borderthindouble {border-style:double; border-width:thin}
.borderthingroove {border-style:groove; border-width:thin}
.borderthinridge {border-style:ridge; border-width:thin}
.borderthininset {border-style:inset; border-width:thin}
.borderthinoutset {border-style:outset; border-width:thin}
.borderthinhidden {border-style:hidden; border-width:thin}

.bordertopthinnone {border-top-style:none; border-top-width:thin}
.bordertopthindotted {border-top-style:dotted; border-top-width:thin}
.bordertopthindashed {border-top-style:dashed; border-top-width:thin}
.bordertopthinsolid {border-top-style:solid; border-top-width:thin}
.bordertopthindouble {border-top-style:double; border-top-width:thin}
.bordertopthingroove {border-top-style:groove; border-top-width:thin}
.bordertopthinridge {border-top-style:ridge; border-top-width:thin}
.bordertopthininset {border-top-style:inset; border-top-width:thin}
.bordertopthinoutset {border-top-style:outset; border-top-width:thin}
.bordertopthinhidden {border-top-style:hidden; border-top-width:thin}

.borderbottomthinnone {border-bottom-style:none; border-bottom-width:thin}
.borderbottomthindotted {border-bottom-style:dotted; border-bottom-width:thin}
.borderbottomthindashed {border-bottom-style:dashed; border-bottom-width:thin}
.borderbottomthinsolid {border-bottom-style:solid; border-bottom-width:thin}
.borderbottomthindouble {border-bottom-style:double; border-bottom-width:thin}
.borderbottomthingroove {border-bottom-style:groove; border-bottom-width:thin}
.borderbottomthinridge {border-bottom-style:ridge; border-bottom-width:thin}
.borderbottomthininset {border-bottom-style:inset; border-bottom-width:thin}
.borderbottomthinoutset {border-bottom-style:outset; border-bottom-width:thin}
.borderbottomthinhidden {border-bottom-style:hidden; border-bottom-width:thin}

.borderleftthinnone {border-left-style:none; border-left-width:thin}
.borderleftthindotted {border-left-style:dotted; border-left-width:thin}
.borderleftthindashed {border-left-style:dashed; border-left-width:thin}
.borderleftthinsolid {border-left-style:solid; border-left-width:thin}
.borderleftthindouble {border-left-style:double; border-left-width:thin}
.borderleftthingroove {border-left-style:groove; border-left-width:thin}
.borderleftthinridge {border-left-style:ridge; border-left-width:thin}
.borderleftthininset {border-left-style:inset; border-left-width:thin}
.borderleftthinoutset {border-left-style:outset; border-left-width:thin}
.borderleftthinhidden {border-left-style:hidden; border-left-width:thin}

.borderrightthinnone {border-right-style:none; border-right-width:thin}
.borderrightthindotted {border-right-style:dotted; border-right-width:thin}
.borderrightthindashed {border-right-style:dashed; border-right-width:thin}
.borderrightthinsolid {border-right-style:solid; border-right-width:thin}
.borderrightthindouble {border-right-style:double; border-right-width:thin}
.borderrightthingroove {border-right-style:groove; border-right-width:thin}
.borderrightthinridge {border-right-style:ridge; border-right-width:thin}
.borderrightthininset {border-right-style:inset; border-right-width:thin}
.borderrightthinoutset {border-right-style:outset; border-right-width:thin}
.borderrightthinhidden {border-right-style:hidden; border-right-width:thin}