body, h1, p, input 
{ 
	color: #222222; 
	font-weight: plain; 
	margin: 0;
	padding: 0;
	font-family: "Lucida Grande", Arial, sans-serif;
	font-size: medium;
	text-align:center;
	background:none;
}

.noCSS {
	display: none;
}


img, img a {
	border:1px #333366 solid;
}

a:link {color:#675DCd; font-weight:600; #0000ff dotted; text-decoration:none} /*unvisited links*/
a:visited {color:#876Dcc; font-weight:600; #0000ff dotted; text-decoration:none} 
a:hover {color:#ff0000; border-bottom:1px #0000ff dotted; text-decoration:none}
a:active {color:#675DC8; font-weight:600; #0000ff dotted; text-decoration:none}

.frame {  /* the page container */
    width: 660px;
    margin: 0px; 
    padding: -60px 0px 0px 20px;
    text-align:center;
	border:0px;
/*border:1px #ff0000 solid;*/
height:100%;
}

/*.frame:before {content:"Sonja van Kerkhoff, Leiden, The Netherlands";}*/

.titleContainer {display:none;}

.titlebanner, 
.titlebanner#websites,
.titlebanner#prices
.titlebanner#illustrate
	{
display:none;
	} 

.titlebanner_over, 
.titlebanner_over#websites,
.titlebanner_over#illustrate,
.titlebanner_over#prices {display:none;}

.menuFrame{width:1px; float:left;}

.menuContainer, 
.menuContainer a,
.mainmenu ul,
.mainmenu li,
.mainmenu li a,
.mainmenu li a:hover,
.mainmenu li.submenu,
.mainmenu li.submenu ul,
.mainmenu .submenu ul li {display:none;/*border: 1px #00ffff solid;*/} 

.contentFrame { /* determines all plain font styles */
float:right;
	padding:0px 0px 0px 0px;
	margin:-470px -25px 0px 0px;
	width:700px;
	border:none;
	font-size:80%;
	letter-spacing:0px;
	text-align: center;
	height:100%;
	}

/*.contentFrame:before {content:"sonjavank -AT- hotmail -DOT- com";}*/ /* doesn't show in IE */

.submenuContainer{ /* can't use a list because it interferes with the js on the mainmenu */
margin:0px 0px 10px 0px;
display:block;
width:500px;
height:30px;
background-color:none;
padding:0px 15px 0px 0px;
}

.emailContainer {background:#none;}
.emailContainer img  /* for the svk email img only. new because floatLeft affects other things too much*/
	{
	padding: 0px 0px 0px 0px;	
	margin: 0px 0px 0px 0px;	
	border:1px #708090 solid;
	}


.emailContainer#websites img  /* nec because of diff. tween FF + IE in padding*/
	{
	padding: 0px 0px 0px 0px;	
	margin: 0px 0px 0px 0px;	
	border:0px;
	background:none;
	}

.submenuColumn { /* print, nl, acessibility, etc */
display:none;
}

.contentFrameInner (padding: 0px 0px 0px 0px; border:1px #00ffff solid;}

.contentContainer { /* under title + intro - each image / text unit */
	display:block;
	margin:0px 0px 0px 0px;
	padding:0px;

	text-align:center;
	clear:both;
	width:400px;
	border:1px #00ffff solid;
	/*background-color:#00ffff;*/
}

.twoColumnContainer { /*just the left column */
width:45%;
float:left;
margin:0px 0px 0px 0px;
padding:0px 0px 20px 0px;
	border:1px #ffff000 solid;
}

.textContainer { 
margin:0px 0px 0px 0px;
text-align:left;
border: 1px #000ffff solid;
}
	
.imagesColumn { /* captions under an image */
	text-align:center;
	float:left; 
	width:140px;
	font-size:80%;
	margin: 2px 18px 5px 0px;
	padding: 0px 0px 0px 0px;
} 

.imagesColumn img  {
	border:2px #676767 solid;
	width:130px;
	font-size:80%;
	margin:0px 0px 0px 0px;
	padding:0px;
	background-color:#efefef;
	}

.imagesColumn p a{ /*not the index page, captions under an image */
	display:block;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	background:none;
	color:#675DCd;
	border:0px;
	/*border:1px #ff6767 dotted;*/
} 

.imagesColumn p a:hover {	 
	color:#ff0000;
	border:0px;
	font-weight:800;
	font-size:80%;
	}

/*.imagesColumn p a:hover {border:2px #ff6767 solid;}*/ /* DOESN'T work */

.arrowup, .arrowup a, .arrowup img, .arrowup img a {display:none;}

h1 {
clear:both;
display:block;
color:#000000;
font-size: 130%;
font-weight: bold;
letter-spacing: 2px;
margin: 20px 0px 15px 0px;
padding: 0px 0px -10px 0px;
text-align: center;
line-height: 1.em;
background-color:none;
border-bottom:3px #efefef solid;
}

h2 { /* only the home page title*/
clear:both;
display:block;
color:#000000;
font-size: 120%;
font-weight: bold;
letter-spacing: 2px;
margin: 58px 40px 15px 40px;
padding: -10px 0px -10px 0px;
text-align: center;
line-height: 1.em;
background-color:none;
}


h3, h4 { /* subtitles */
color:#000000;
font-size: 110%;
font-weight: 600;
letter-spacing: 1px;
margin: 0px 0px 0px 0px;
padding: 0px 0px 15px 0px;
line-height: 1.3em;
background-color:none;
display:inline;
}

h4 { /* same as h3 but with margin underneath + block */
margin: 5px 0px 5px 0px;
padding: 0px 0px 5px 0px;
display:block;
}

p.intro {  /* bluish intro text */
color:#000055;
font-size: 100%;
font-weight: 500;
/*text-align: center; */
line-height: 1.em;
margin: 0px 0px 3px 0px;
padding: 0px 0px 0px 0px;
background-color:transparent;
}

p.intro span {  /*NOT USED messes up differing lengths*/
width:100px;
text-align:right;
}

p.intro a {text-decoration:none; border-bottom:1px dotted;}

p,  {  /*main text*/
color:#ff0000;
font-size: 80%;
display:inline;
font-weight: normal;
margin: 0px 0px 0px 0px;
padding: 0px 0px 2px 0px;
background-color:#ff0000;
}

p strong {
letter-spacing:0px;
font-weight: 600px;
}

.textContainer p {background-color:#ff0000;)

.tinyCaption a { /* not used yet */
font-size:70%; 
text-align:left;
background-color:transparent;
}


.shadow{  /*not used yet wwww.dynamic*/
border:1px solid silver;
font:10pt arial;
position:relative;
display:inline;
background:white;
z-index:100
}

.shadow_inner{
overflow:hidden;
position:absolute;
top: -1000px;
filter:alpha(Opacity=5); /* was 10 -modify to change the shade solidity/opacity, same as below*/
opacity:0.1; /*firefox 1.5 opacity*/
-moz-opacity:0.1; /*mozilla opacity*/
-khtml-opacity:0.1; /*opacity*/
z-index:10
}