<!-- 





/* body classes
   use "short" if not much content vertically on the page
   usually 65 looks best if only top level menu, 89 if two levels
*/

body.short65w {text-align: center; margin: 0; padding: 0; background-image: url('images1/bg01water_2000_sky16_h65w.gif');}
body.short70w {text-align: center; margin: 0; padding: 0; background-image: url('images1/bg01water_2000_sky16_h70w.gif');}
body.short89w {text-align: center; margin: 0; padding: 0; background-image: url('images1/bg01water_2000_sky16_h89w.gif');}
body.short104w {text-align: center; margin: 0; padding: 0; background-image: url('images1/bg01water_2000_sky16_h104w.gif');}
body.long65w {text-align: center; margin: 0; padding: 0; background-image: url('images1/bg01water_3800_sky16_h65w.gif');}
body.long70w {text-align: center; margin: 0; padding: 0; background-image: url('images1/bg01water_3800_sky16_h70w.gif');}
body.long89w {text-align: center; margin: 0; padding: 0; background-image: url('images1/bg01water_3800_sky16_h89w.gif');}
body.long104w {text-align: center; margin: 0; padding: 0; background-image: url('images1/bg01water_3800_sky16_h104w.gif');}


/* FOR the CONTACT LINKS */
p.contact {margin: 0; font-size: 0.8em; font-family: "Tahoma", "Helvetica", sans-serif; color: black; font-style: italic; font-weight: bold}

a.contact:link { color: black }
a.contact:visited { color: black }
a.contact:active {color: black }
a.contact:hover {color: red; }


/* FOR the BACK LINKS */
a.back { text-decoration: none; font-weight: bold }
a.back:link { color: red }
a.back:visited { color: red }
a.back:active {color: red }
a.back:hover {color: red; text-decoration: none; font-style: italic }

html {color: #006}






/* NEVER CHANGE ANYTHING BELOW */
/* NEVER CHANGE ANYTHING BELOW */
/* NEVER CHANGE ANYTHING BELOW */
/* NEVER CHANGE ANYTHING BELOW */
/* NEVER CHANGE ANYTHING BELOW */


/* here minimum width for the menu */

/* for all browsers that understand min-width */
.width {width:50%; min-width:780px; margin:0 auto;}

/* the bodge for IE6 browsers */
* html .minwidth {border-left:780px dashed; position:relative; float:left; z-index:1;}
* html .contain {margin-left:-780px; position:relative; float:left; z-index:2; text-align:left;}


/* here menu-adaptations */

.outer ul {margin:0em; padding:0; list-style-type:none; background:transparent;}
.outer li {display:block; float:left;}
.outer {display:block; position:relative; background:transparent; padding:0px; margin:0px 0px 0px 0px;}

/* here TOP level */

.xsnazzychosen span {text-align:center; color:#fff; margin:0; font-weight:bold; padding-bottom:0.4em;}
.xsnazzyfixed span {text-align:right; color:#fff; margin:0; font-weight:bold; padding-bottom:0.4em;}


.xsnazzy {background:transparent;}
.xsnazzy span {text-align:center; color:#039; margin:0; font-weight:bold; padding-bottom:0.4em;}
.xtop {display:block; background:transparent; font-size:1px;}
.xb1, .xb2, .xb3, .xb4 {
display:block; 
/* hide overflow:hidden from IE5/Mac */ 
/* \*/ 
overflow: hidden; 
/* */ 
}

.xb1, .xb2, .xb3 {height:1px;}
.xb2, .xb3, .xb4 {background:transparent; border-left:1px solid #09f; border-right:1px solid #09f;}
.xb1 {margin:0 5px; background:#09f;}
.xb2 {margin:0 3px; border-width:0 2px;}
.xb3 {margin:0 2px;}
.xb4 {height:2px; margin:0 1px;}

.xboxcontent {display:block; background:url("images1/lobster2_50_sky16.gif") -25px 5px no-repeat; border:0 solid #09f; border-width:0 1px 1px 1px;}
.xboxcontentchosen {display:block; background:url("images1/lobster2_50_sky16.gif") -25px 5px no-repeat;}
.xboxcontentfixed {display:block; background:url("images1/lobster1_50_sky16.gif") -10px -12px no-repeat;}

a.xmenu2, a.xmenu2:visited {display:block; text-decoration:none; width:80px; font-size:12px; margin: 0px 3px;}
a.xmenu2:hover {background:transparent; cursor:pointer;}
a.xmenu2:hover span {color:#339; text-align:center; font-weight:bold; letter-spacing:-0.05em; }
a.xmenu2:hover .xboxcontent {background:url("images1/lobster2_50_sky16.gif") -22px 3px no-repeat; border-color:#09f; border-bottom:1px solid #09f;}
a.xmenu2:hover .xb1 {background:#09f;}
a.xmenu2:hover .xboxcontentchosen {background:url("images1/lobster2_50_sky16.gif") -22px 3px no-repeat; color: white; border-color:#09f; border-bottom:1px solid #09f;}
a.xmenu2:hover .xboxcontentfixed {background:url("images1/lobster1_50_sky16.gif") -10px -12px no-repeat; border-color:#09f; border-bottom:1px solid #09f; text-align: right; font-weight: bold; letter-spacing:0em; color: #fff}
a.xmenu2:hover .xb2, a.xmenu2:hover .xb3, a.xmenu2:hover .xb4 {background:transparent; border-color:#09f;}




/* here THIRD level */

.xsnazzychosenTHIRD span {text-align:center; color:#fff; margin:0; font-weight:bold; padding-bottom:0.4em;}

.xsnazzyTHIRD {background:transparent;}
.xsnazzyTHIRD span {text-align:center; color:#039; margin:0; font-weight:normal; padding:0;}

.xboxcontentTHIRD {display:block; background:url("images1/xxx.gif") -10px -35px no-repeat; border:0 none; border-width:0 1px 1px 1px;}

a.xmenu2THIRD, a.xmenu2THIRD:visited {display:block; text-decoration:none; width:80px; font-size:11px; margin: 0px 3px;}
a.xmenu2THIRD:hover {background:transparent; cursor:pointer;}
a.xmenu2THIRD:hover span {color:#339; font-weight:bold;}
a.xmenu2THIRD:hover .xboxcontentTHIRD {background:url("images1/seascape.gif") -10px -32px no-repeat; border-color:transparent; border-bottom:1px none;}
a.xmenu2THIRD:hover .xb1 {background:transparent;}
a.xmenu2THIRD:hover .xb2, a.xmenu2THIRD:hover .xb3, a.xmenu2THIRD:hover .xb4 {background:#39c; border-color:transparent;}



/*
	| liquidcorners.css; feel free to adapt the style!
	| ================================================
	| use: 4 corners with borderline outside a contentbox with class="inside"; 
	|      image  = upper half: top left corner, long borderline, top right corner
	|               under half: bottom left corner, long borderline, bottom right corner
	|      CHANGE = you have to change this for fitting to your image
	|      YCC    = You Can Change (or omit), if wanted
	|      DNC    = Do Not Change
	| credits: original by francky kleyneman, see article/tutorial in Francky's Developers Corner:
	|          http://home.tiscali.nl/developerscorner/liquidcorners/liquidcorners.htm
	| adapted
	| by.....: ... (your name and site?!)
	|
	| + please let this text & links intact for a next user +
*/
.top-left, .top-right, .bottom-left, .bottom-right { 
	background-image: url('images1/bg01water_horizontal1600.gif'); /* CHANGE: path and name of your image */
	height: 18px;       /* CHANGE: replace by the height of one of your corners (= 1/2 height of the image) */
	font-size: 2px;    /* DNC: correction IE for height of the <div>'s */
	}
.top-left, .bottom-left { 
	margin-right: 0px; /* CHANGE: replace by the width of one of your corners */
	}
.top-right, .bottom-right { 
	margin-left: 0px;  /* CHANGE: replace by the width of one of your corners */
	margin-top: -18px;  /* CHANGE: replace by the height of one of your corners */
	}
.top-right {
	background-position: 100% 0;    /* DNC: position right corner at right side, no vertical changes */
	}
.bottom-left  { 
	background-position: 0 -18px;    /* CHANGE: replace second number by negative height of one of your corners */
	}
.bottom-right { 
	background-position: 100% -18px; /* CHANGE: replace second number by negative height of one of your corners */
	}
.inside {
	background-image: url('images1/bg01water.gif'); 
	background-position: 0 15px; /* just for better connecting to the tearoff borders */
	}

.notopgap    { margin-top: 0; }    /* DNC: to avoid splitting of the box */
.nobottomgap { margin-bottom: 0; } /* DNC: to avoid splitting of the box */

/*
implementation in the page:
	...
	<head>
	<link rel="stylesheet" type="text/css" href="liquidcorners.css">
	...
	</head>
	
	<body>
	...
	<div class="top-left"></div><div class="top-right"></div>
		<div class="inside">
		<p class="notopgap">Your text & other things inside</p>
		...
		<p class="nobottomgap">...</p>
		</div>
	<div class="bottom-left"></div><div class="bottom-right"></div>
	...
	</body>
*/
-->