/* 
curved is the outer container for each of the sliding tabbed notebooks of links - info1 and info2 
*/

.curved {width:52em;}

.curved .b1, .curved .b2, .curved .b3, .curved .b4  {
	font-size:1px; 
	display:block; 
	background:#C9EBF7; /* the color of the border */
	/* hide overflow:hidden from IE5/Mac */ 
	/* \*/ 
	overflow: hidden; 
	/*  */ 
	}

.curved .b1, .curved .b2, .curved .b3 {	height:1px;	}

.curved .b2, .curved .b3, .curved .b4 {
	border-left:1px solid #88c; 
	border-right:1px solid #88c;
	background:#C9EBF7; /* border color */
	}
	
.curved .b1 {
	margin:0 4px; 
	background:#88c;/* the color of the border */
	}
	
.curved .b2 {
	margin:0 2px; 
	border-width:0 2px;
	}
	
.curved .b3 {margin:0 1px;}
	
.curved .b4 {
	height:2px; 
	margin:0;
	}
	
.curved .c1 {
	margin:0 5px; 
	background:#88c;/* the color of the border */
	}
	
.curved .c2 {
	margin:0 3px; 
	border-width:0 2px;
	}
	
.curved .c3 {margin:0 2px;}
	
.curved .c4 {
	height:2px; 
	margin: 0 1px;
	}
	
.curved .boxcontent {
	background:transparent; 
	border-left:1px solid #88c; 
	border-right:1px solid #88c; 
	font-size:0.9em; 
	text-align:justify;
	cursor:default;
	background:#C9EBF7;/* the color of the border */
	}
/* end curved */










/*
menu is the ul inside the sliding tabbed folders that hold the links  - info1, info2 ...  .
the basics, height width etc, are set here in this CSS file
the colors for the edges and the backgrounds ought to be set in each alternate css file.
*/

#menu {
	margin:0; 
	padding:0; 
	/*
	height:29.5em;
	height:32em;  
	height:34em;
	height:36em;
	height:38em;
	change height 
	height:40em; 
	height:43em;*/
	height:45em;
	overflow:hidden; 
	background:#C9EBF7;/* the color of the border */
	}
  
#menu li {
	list-style-type:none; 
	float:left; 
	display:block; 
	width:100%;
	}
  
#menu li a {
	display:block; 
	text-decoration:none; 
	color:#000;
	/* menu li a - place all colors to the alternate stylesheets 
	color:#8BC1D5;
	*/
	margin:0; 
	width:100%;
	}
  
#menu li a span {
	display:none; 
	color:#000;
	}
  
#menu li .one {
	background:#f1f1f1;  /* url(barbadi_software.gif) no-repeat; background-position:bottom; */
	background:#C9EBF7;/* the color of the border */
	}
	
#menu li a.one span {
	display:block; 
	/*
	height:21.5em; 
	height:29em;  	
	height:34em;
	height:36em;
	height:38em;
	change height 
	height:40em;
	height:43em;*/
	height:45em;
	margin:0 10px;
	/* border:1px solid green; */
	}
	
#menu li a:hover {
	/*
	background:#f1f1f1; the color of the border 
	background:#bbbbff; the color of the border 
	*/
	background:#C9EBF7;/* the color of the border */
	color:#000;
	/* menu li a:hover   move color 
	color:#C3DFE9; 
	*/
	}
	
#menu li a:hover span {
	display:block; 
	/*
	height:20em;
	height:24em;
	height:26em;
	height:28em;
	height:30em;
	change height 
	height:32em;
	height:35em;*/
	height:37em;
	margin:0 10px; 
	cursor:pointer;
	/* border:1px solid green; border */
	}

 /* start test  */ 
#menu li p {
	display:block; 
	text-decoration:none; 
	color:#00b; 
	margin:0; 
	width:100%;
	}
	
#menu li p span {
	display:none; 
	color:#000;
	}
	
#menu li p:hover {
	/*background:#f1f1f1;/* the color of the border 
	background:#bbbbff;/* the color of the border */
	background:#C9EBF7;/* the color of the border */
	}
	
#menu li p:hover span {
	display:block; 
	/*interesting bit -  a different style: 
	when height was removed, this showed the span to show only to the height of the text, and the lower spans still showed.*/
	/*change height 
	height:28.5em;
	height:31.5em;*/
	height:33.5em;
	margin:0 10px;  
	/* border:1px solid green; */
	}
  
/*
#menu li p:hover span.left { height:20em; position:absolute; display:block;}
#menu li p:hover span.right { height:20em; position:absolute; display:block; left:110px; top:70px;}
*/
  
 #menu li p:hover span a {display:block;}
  
#menu li p.one span {
	display:block; 
	/*
	height:24em; 
	change height 
	height:26em;
	height:29em;*/
	height:31em;
	margin:0 10px;
	/* border:1px solid green; */
	}
	/* end test  */ 

#menu .h2 {
	margin:0 5px; 
	padding:0; 
	color:#000;
	/* menu .h2   move color:#8BC1D5;  */
	font-variant:small-caps; 
	font-size:1em; 
	border:none; 
	background:#C9EBF7;/* the color of the border */
	}
	
#menu .h3 {
	margin:0 5px; 
	padding:0; 
	font-size:1.1em; 
	/*color:#00b;	menu .h3   move color */
	color:#693900; 
	background:#C9EBF7;/* the color of the border */
	}
	
#menu img {
	margin:5px 5px 5px 0; 
	/* border:1px solid #000; */
	float:left;
	}
/* end menu */









/* curved-g is the gold trim on the main links */

.curved-g {	width:15em;}
	
.curved-g .b1, .curved-g .b2, .curved-g .b3, .curved-g .b4  {
	font-size:1px;
	display:block;
	/*background:#C9EBF7; / * the color of the border */
	background:#ffdd33;
	/* hide overflow:hidden from IE5/Mac */ 
	/* \*/ 
	overflow: hidden; 
	/*  */ 
	}
	
.curved-g .b1, .curved-g .b2, .curved-g .b3 {height:1px;}
	
.curved-g .b2, .curved-g .b3, .curved-g .b4 {
	border-left:1px solid #ffdd33;
	border-right:1px solid #ffdd33;
	background:#C9EBF7;/* the color of the border */
	}
	
.curved-g .b1 {
	margin:0 4px; 
	background:#ffdd33;/* the color of the border */
	}
	
.curved-g .b2 {
	margin:0 2px; 
	border-width:0 2px;
	}
	
.curved-g .b3 {margin:0 1px;}
	
.curved-g .b4 {
	height:2px; 
	margin:0;
	}
	
.curved-g .c1 {
	margin:0 5px; 
	background:#ffdd33;	/* the color of the border */
	}
	
.curved-g .c2 {
	margin:0 3px; 
	border-width:0 2px;
	}
	
.curved-g .c3 {margin:0 2px;}
	
.curved-g .c4 {
	height:2px; 
	margin: 0 1px;
	}
	
.curved-g .boxcontent {
	background:transparent; 
	border-left:1px solid #ffdd33; 
	border-right:1px solid #ffdd33; 
	font-size:0.9em; 
	text-align:justify;
	cursor:default;
	background:#C9EBF7; /* the color of the border */
	}
	
.curved-g .boxcontent a {	padding:0px 4px 0px 4px;}	
/* end curved */