/* CSS Document */

/* Setup: Repeated code per rollover */

#info {
	background-image:  url();    /* rollover state */
	width: 200px;                    /* image width */
	height: 100px;                   /* image height */
}

#swap01 {
	background-image:    url(file:///C|/Documents%20and%20Settings/All%20Users/Documenten/index2nieuw/foto/hover1a.jpg);    /* rollover state */
	width: 136px;                    /* image width */
	height: 243px;                   /* image height */
}
#swap02 {
	background-image:    url(file:///C|/Documents%20and%20Settings/All%20Users/Documenten/index2nieuw/foto/hover2a.jpg);    /* rollover state */
	width: 136px;                    /* image width */
	height: 243px;                   /* image height */
}
#swap03 {
	background-image:    url(file:///C|/Documents%20and%20Settings/All%20Users/Documenten/index2nieuw/foto/hover3a.jpg);    /* rollover state */
	width: 137px;                    /* image width */
	height: 243px;                   /* image height */
}
#swap04 {
	background-image:    url(file:///C|/Documents%20and%20Settings/All%20Users/Documenten/index2nieuw/foto/hover4a.jpg);    /* rollover state */
	width: 136px;                    /* image width */
	height: 243px;                   /* image height */
}
#swap05 {
	background-image:    url(file:///C|/Documents%20and%20Settings/All%20Users/Documenten/index2nieuw/foto/hover5a.jpg);    /* rollover state */
	width: 136px;                    /* image width */
	height: 243px;                   /* image height */
}


/* Application: Common Code */

.rollover { display: block; } /* Allow setting widths and heights */
.rollover img { width: 100%; height: 100%; border: 0; } /* only set width and height once */
.rollover:hover { visibility: visible; /* for IE */ } /* sets any property for the :hover state */
.rollover:hover img { visibility: hidden; } /* 'rolls over' the image */

/* optional */
#images {
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: 0px;
	margin-left: 0px;
	width: 800px;
	height: 257px;
}
#images a { float: left; }

body { background-color: #FFFFFF; margin: 0; padding: 0; }
#bg  { background-color: 166567;
	position: absolute;
	top: 50%;
	left: 0;
	margin-top: -122px;
	margin-left: 0;
	width: 100%;
	height: 257px;
	background-image:  url(Foto/openingsfoto.jpg);
	background-repeat: no-repeat;
	background-align: middle;
}
 {
}

body {
	color: #000;
	background-color: #FFFFFF;
	font-family: "Trebuchet MS", Trebuchet, Verdana, Arial, Helvetica, sans-serif;
	font-size: 76%;
}
p {
	position: absolute;
	top: 0px;
	left: 0;
	width: 100%;
	font-size: 1em;
	color: #CCCCCC;
	margin: 0;
	padding: 0;
	height: 40px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCCCCC;
	background-color: 166567;
}
a { color: #990000}
a:hover { color: #fff }
h1 {
	position: absolute;
	top: 9%;
	left: 1px;
	font-family: "Franklin Gothic Medium";
	font-size: 60px;
	font-weight: lighter;
	font-variant: normal;
	color: #999999;
	text-align: left;
	letter-spacing: 7px;
	vertical-align: top;
}
h2 {
	position: absolute;
	bottum: 15%;
	left: 1px;
	font-family: "Franklin Gothic Medium";
	font-size: 25px;
	font-weight: lighter;
	font-variant: normal;
	color: #999999;
	text-align: left;
	letter-spacing: 7px;
	vertical-align: bottom;
	bottom: 15%;
	font-style: normal;
}
h3 {
	font-family: "Franklin Gothic Medium";
	font-size: 14px;
	color: #CCCCCC;
	padding: 2px;
	height: 25px;
	width: 100%;
	position: absolute;
	left: 0px;
	bottom: 0px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #999999;
	border-right-color: #999999;
	border-bottom-color: #999999;
	border-left-color: #999999;
	letter-spacing: 4px;
	vertical-align: bottom;
}
h4 {
	position: absolute;
	bottum: 15%;
	left: 1px;
	font-family: "Franklin Gothic Medium";
	font-size: 25px;
	font-weight: lighter;
	font-variant: normal;
	color: #999999;
	text-align: left;
	letter-spacing: 7px;
	vertical-align: bottom;
	bottom: 10%;
	font-style: normal;
}
