/*------------- 
The Wyke-Switch - by Charlie Wyke-Smith 
Main Style Sheet 

version: 1.1
author: ken rippengale
email: rippengale@hotmail.com
website: http://www.littlehamptoncameraclub.co.uk/
-------------------------------   */
body {
font: 1em verdana, arial, sans-serif;
}
* {margin:0; padding:0; background:#dcdcdc; color:Black;}
div#mainwrapper {
width:776px;
margin:auto;
border: 0 1px 0 1px solid Navy;
} /* add margin auto stuff if you want the layout centered */
div#header {
background:url(image/top.gif) 100% 0 no-repeat;
width:776px;
height:100px;
}
#home .home{background-color: #A52A2A; color: #F8F8FF;}
div#columnswrapper {float:left; width:776px; background-color:#dcdcdc; color:Black;}
div#nav {float:left; width:150px; margin-left:-626px;} /* nagative margin moves nav column into position */
div#content {float:left; width:476px; margin-left:150px; display:inline;} /* display inline is hack fix for IE */
div#rightcolumn {float:left; width:150px}
div#footer {width:776px;}
.clearthis {clear:both;}
/* content column styles */
div#content {padding:0 0}
div#contentinner {margin: 0 10px 20px;}
div#content div#mainimage {width:180px; float:left; margin:0 8px 4px 0;}
div#content div#mainimage img {border: 1px solid #960;}
div#content div#mainimage p {font-size:.65em; margin:0px 5px; color:#C60; background:transparent;} 
div#content h1{font-size:1.4em; font-variant:small-caps; margin-top:2em; font-family:'comic sans MS', verdana, sans-serif; color:#960; background:transparent;}
div#content p {font-size:.8em; margin-top:0; margin-bottom:.5em;}	
div#content p  span{ font-style:italic; }	
div#content li {font-size:.75em;}
div#content blockquote {width: 200px; float:right; font-size:.7em; border-top: 3px dotted #960; border-bottom:2px dotted #960; margin:0 10px; padding: 6px 10px;}
div#content blockquote p {margin:0; font-style:italic;}
div#content a {text-decoration:underline; color:#C60; background:transparent;}
div#content a:hover {color: #0000CD; text-decoration:none; background:transparent;}
.pullquote {
	background:#D7ECFF;
	color:Black;
		width:25%;
		position:relative;
		float:right;
		font-size:75%;
		margin:2px;
		padding:5px 5px 5px 5px;
		border:1px solid #8D6027;
		}	
/* right nav styles */
div#nav {padding-top:20px;}
div#nav ul {border:0; margin:12px 1.25em 12px 1.25em; padding:0; list-style-type:none; font-weight:bold; font-size:.7em;}
div#nav li {border-bottom:1px solid #960;  padding:.3em 0;}
div#nav li:first-child {border-top:2px solid #960;}
div#nav a {text-decoration:none; color:#C60; background:transparent;}
div#nav a:hover {color: #0002B7;  background-color:transparent }
.smalltx{
	background:transparent;
	color:#006F38;
	font-size:.8em;
	padding:0 0 0 10px;
	text-align: left;
}
.shead{
	background-color:#ECD6BB;
	color:#4D4EFF;
	border-top: 2px solid  #926329 ;
	border-bottom: 2px solid #926329 ;
	font-style:italic;
	font-size:.9em;
	text-align:center;
}
ul.para li {
  margin-top: 1em;
  margin-bottom: 1em;
  margin-left: 1em;
  list-style:none;
  text-align:left;
  font-style:italic;
}
ul.para01 li {
margin-top: 1em;
margin-bottom: 1em;
margin-left: 1em;
list-style:none;/*text control for right column*/
font-size:85%;
color:#B8860B;
background:transparent;
}
/*Places date at top of middle section*/
.date{
display:block;
text-align:right;
background:transparent;
color: #00008B;
font: oblique 85% Verdana, sans-serif;
	}
/* a hack for IE Win only \*/	
* html div#nav ul {border-top:2px solid #960;}
/*end of hack */
/* right column styles */
div#rightcolumn {padding-top:34px;  border-bottom:2px solid #960;}
div#rightcolumn p {font-size:.9em; font-style:italic;}
div#rightcolumn img {border:none; }
div#rightcolumn div#newslinks ul {list-style-type:none; font-size:.8em; padding-left: 10px; margin:0 6px 0 0; }
div#rightcolumn div#newslinks li  span{ background:transparent; color:Red;}
div#rightcolumn div#newslinks li {margin-top:0; margin-bottom:.5em;}
div#rightcolumn h3 {text-align:center; font-size:.8em; color:#960; background-color:transparent; margin-bottom:0px; padding-top:3px; border-top: 2px dotted #960;}
div#rightcolumn a { color:#C60; background-color:transparent; text-decoration:underline}
div#rightcolumn a:hover {color: #0000CD; background-color:transparent; text-decoration: none;}
div#rightcolumn li.morelink {font-style:italic;}
acronym {
	border-bottom:dashed red 1px;
	}
.d{
background-color:#FCFAE8;
color:Black;
padding:5px 2px 5px 2px;
}
.l{
background-color:#F4EDAC;
border: 1px solid black;
margin: 2px 2px 2px 2px;
color:Black 
padding:5px 2px 5px 2px;
}
/*left colum styles*/
.newslink ul {list-style-type:none; font-size:.7em; padding-left: 5px; margin:0 0 0 6px ;}
.newslink li {margin-top:0; margin-bottom:.5em;}
div#news{background:url(image/relat.gif) 100% 0 no-repeat;
width:150px;
height:35px;}

div#newsm{background:url(image/friendly.gif) 100% 0 no-repeat;
width:200px;
height:35px;}
/*footer styles*/
div#footer {
 					padding:4px 0; /* pushes the links away from top and bottom of the div */
					font-size:.8em;  /* sets the font size of all links */
					text-align:center; /* centers the ul elements in the div */
					background-color:#dcdcdc; /* sets the background color of the div */
					color:Black;
					border-top:1px solid #960; border-bottom:2px solid #960;
					font-style:italic;
					}
 div#footer p{
 	background:transparent; color:#1E90FF; font-size: .9em; font-style:oblique;
 }				
 div#footer ul {margin:2px 0;} /* vertical spacing between the lists */
 div#footer li {display:inline; /* the key CSS - makes the lists display horizontally */
						background-color:transparent;
						border-left:1px solid; /* creates the vertical line to the left of each list items */
						color:#C60; /* sets the color of the vertical lines  - links colored below */
						padding:0 5px 0 9px; /* horiz space between links and vert lines - needed diff l & r values to center */
						}
 div#footer li:first-child {border-left:0;} /* removes the left border of the first list item - IDWIMIE */
 div#footer ul li a {text-decoration:none; /* removes the underlining off the links */
 						 color:#C60; /* the color of the links */
						 background-color:transparent;
							 }
 div#footer ul li a:hover {text-decoration:underline; color:#0000CD; background-color:transparent;} /* underlines the links when hovered */
 div#footer ul.fineprint li {color:#C60; background-color:transparent;  } /* color for copyright and vert dividers on last row */
 div#footer ul.fineprint li a {color:#C60; background-color:transparent; } /* had to explicitly color these or they inherit from div#footer li */
 div#footer ul.fineprint li a:hover {color:#0000CD; background-color:transparent; } /* turns bottom row white when hovered */
body {font-family: verdana, arial, sans-serif; font-size:100%; behavior: url(csshover.htc);}
* {margin:0; padding:0;}
/* the horizontal menu starts here */
div#listmenu {
	width:100%; /* makes the div full width */
	float:left;
	border-top:1px solid #069;	/* draws line on top edge of div */
	border-bottom:1px solid #069;	 /* draws line on bottom edge of div */
	font-size:.8em;	/* SET FONT-SIZE HERE */
	background-color:#DCDCDC; /* colors the div */
	color:Black;
	margin-top:20px; /* TEMPORARY - pushes the div away from the top of the browser for clarity in this example*/
	}
	.c li{
		list-style:none;
		margin:5px 0 25px 25px;
		background:transparent;
		color:Blue;
	}
	.lp{
		font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;
		color:#0000CD;
		background:transparent;
		font-size:150%;
	}
	#space{
		height:20%;
		}
div#listmenu ul {
	margin:0 0 0 30px;/* indents ul from edge of container - NOTE: diff value for IE in hacks below */
	}
div#listmenu li {
	float:left;	/* causes the list to align horizontally instead of stack */
	position:relative; /* positioning context for the absolutely positioned drop-down */
	list-style-type:none;	/* removes the bullet off each list item */
	background-color:#dcdcdc;	 /*sets the background of the menu items */
	color:Black;
	border-right:1px solid #069; /* creates dividing lines between the li elements */
	}
	div#listmenu li span{
	 background:transparent;
	 color:Red	
	}
div#listmenu li:first-child {
	border-left:1px solid #069; /*the first vertial line on the menu */
	}
div#listmenu li:hover { 
	background-color:#ACD6FF; /*sets the background of the menu items */
	color:Black;
	}
div#listmenu a {
display:block;
	padding:1px 6px; /*creates space each side of menu item's text */
	text-decoration:none;	 /* removes the underlining of the link */
	color:#0000CD;	/* sets the type color */
	background-color:transparent;
	}
div#listmenu a:hover {
	color:#F33;
	background-color:transparent;
	}
/* the menu ends here */
/* the drop-down starts here */
div#listmenu ul li ul {
	margin:0; 
	z-index:10; /* puts drop-down on top of div - Safari needs this as menu is 1px higher */
	position:absolute; /* positions the drop-down ul in relation to its relatively positioned li parent */
	width:10em; /*sets the width of the menu - in combo with the li's 100% width, makes the menu stack*/
	border-right:0; /* stops SCBs drops having two right borders - they inherit the border, IE doesn't */
	left:-1px; /*aligns the drop exactly under the menu */
	}
div#listmenu ul li ul li {padding:0;
	width:100%; /* makes the list items fill the list container (ul) */
	border-left:1px solid #069; /*  three sides of each drop-down item */
	border-bottom:1px solid #069;
	border-right:1px solid #069;}
div#listmenu ul li ul li a {padding:1px .5em;}
div#listmenu ul li ul li:first-child {
	border-top:1px solid #069; /*the top edge of the dropdown */
	}
/* make the drop-down display as the menu is rolled over */
div#listmenu ul li ul {display:none;} /* conceals the drop-down when menu not hovered */
div#listmenu ul li:hover ul {display:block; } /* shows the drop-down when the menu is hovered */
/* pop-out starts here */
body div#listmenu ul li ul li ul  {
	position:absolute; 
	visibility:hidden; /* same effect as display:none in this situation */
	top:-1px;
	left:10em;
	}
div#listmenu ul li ul li:hover ul {visibility:visible;} /* same effect as display:block in this situation */

/* second level popouts start here*/
div#listmenu ul li ul li:hover ul li ul {visibility:hidden;}
div#listmenu ul li ul li ul li:hover ul {visibility:visible;} /* same effect as display:block in this situation */
/*control of text in main content*/
.linetext{
background:transparent;
font:bold, 1.5em, Times, serif;
color:Blue;
text-align:left;	 	
 } 
 .linetext01{
background:transparent;
font:bold, 1.75em, Times, serif;
font-style: italic;
color:Blue;
text-align:left;	 	
 } 
 .l{
 	list-style:none;/*removes list Style*/
 }
a:link{   
text-decoration:underline; 
color: Blue;
background-color: transparent;
  }
  .txbox {
  	background: #ADD8E6;
	color: #4169E1;
	border:1px solid #A9A9A9;
	padding:5px 5px 5px 5px;
	font-size:75%;
  } 
   .txboxcom {
  	background: #ADD8E6;
	color: #FFFFF0;
	border:1px solid #A9A9A9;
	padding:5px 5px 5px 5px;
	font-size:120%;
  } 
/*puts faded text box over image firefox only*/
  .textblock {
opacity: 0.5;
 -moz-opacity: 0.5;
 -khtml-opacity: 0.5;
 filter: alpha(opacity=50);
margin-top: 5px;
margin-left: 5px;
width: 420px;
background: #ffffff;
color:Black;
border: 1px solid #007101;
padding: 0.5em;
font: 95%/1.6 Arial, Helvetica, sans-serif;
-moz-border-radius: 25px;
voice-family:"\"}\"";
voice-family: inherit
}
/*drops and expands first letter*/
.dropcap {
background:transparent;
color:#0000CD;
font-size:1.8em;
font-weight:600;
float:left;
padding-right:0.5px;			  
position:relative;	 
top:-0.22em;	 
}
h2{
background:transparent;
color:#0002DB;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 120%;
margin-top:.5em;
}
h5{
	background:transparent;
	color: #2D98FF;
	font-style:oblique;
	font-size:85%;
	margin-top: 1em;
  margin-bottom: 1em; 
}
div.spacer {
  clear: both;
   background: #DCDCDC;
	color:Black;
  }
 div#link  ol li{
 	 font: 12px Verdana, Geneva, Arial, Helvetica, sans-serif;
	 list-style-type:none;
	 margin-top: 1em;
  margin-bottom: 1em; 
	 
 } 
 .link  ol li{
 	 font: 12px Verdana, Geneva, Arial, Helvetica, sans-serif;
	 list-style-type:none;
	  margin-bottom: .5em;  	 
 } 
 div#i{
  margin-top: 1em;
  margin-bottom: 1em; 
 text-align:center;
 }
 div.float {
  float: right;
  margin-top: 5px;
  width: 200px;
  padding-right:50px;
  }
  .floatright {
  float: right;
  margin-top: 20px;
  width: 180px;
  padding: 20px 0 20px 5px; 
  border: outset;
  border-color:#dcdcdc #ffffff #ffffff #dcdcdc;
  }
  .com01 {
  	font-size:120%;
	font-weight:bold;
  }
  .com02 {
  	font-style:italic;
  }
  .centre {
  	background: transparent;
	text-align: center;
  }
 #mcal{
		 position:relative;
		 width:150px;
		 font-size:85%;
	}
	.logobox{
			padding:0 2px 2px 2px;
		}
		pre{  
			  font-size:80%;
		}
		code, pre{
			font-family:"Courier New",Courier,monospace;
		}
		code{
			color:#006;
			background:transparent;
		}
		.coding{
			position:absolute;
		  top:560px;
		   left:150px;
		}
		.al{
margin-top: 1em;
 margin-bottom: 1em; 
padding:0 0 0 113px;
		}
.ellip { letter-spacing: 0.08em; }
thead {
  display: compact;
}
cite {
  display: block;
  list-style-type: disc;
  margin-left: 2em;
  font-size:80%;
}
.datatable{
	border:1px solid #d6dde6;
	 border-collapse:collapse;
	 width: 80%;
}  
.comp{
	background: White; 
	border: 1px solid #007101;
	color:Black;
	font-size:medium;
	font: 80% Verdana, Geneva, Arial, Helvetica, sans-serif;
	margin: 1em 1em 1em 1em;
	padding:1px 2px 1px 1px;
	
}
.comptop{
	background:transparent;
	color:Blue;
	
} 
  /* THE HACK ZONE - */
/* hack for IE (all flavors) so the menu has a vertical line on the left */
* html div#listmenu ul {
	float:left; /* makes the ul wrap the li's */
	border-left:1px solid #000; /* adds the rightmost menu vertical line to the ul */
	margin-left:15px; /* IE doubles the given value above - why? */
	}
/* add a top line to drops and pops in IE browsers - can't read :first-child */
* html  div#listmenu ul li ul {
	border-top:1px solid #069;
	border-left:0px; /* stops the drop inheriting the ul border */
	}
/* the Tantek hack to feed IE Win 5.5-5.0 a lower value to get the pop-out to touch the drop-down */
* html  div#listmenu ul li ul li ul { 
  left:9.85em; 
  voice-family: "\"}\""; 
  voice-family:inherit;
  left:10em;
  } 
/* and the "be nice to Opera" rule */
html>body div#listmenu ul li ul li ul {
  left:10em;
} 
.textstyle{
font: bold 12px Verdana;
line-height: 1.5;
}

.formstyle{
background-color: #E1E1E1;
}

/* an Opera-only hack to fix a redraw problem by invisibly extending the ul */
/* the first-level drop stays open for 100px below the bottom but at least it works */
/* this can be reduced to as little as 22px if you don't have pop-outs */
/* the pop-out menu stays open for 22px below the bottom but at least it works */
	@media all and (min-width: 0px){
   body div#listmenu ul li ul {padding-bottom:100px;}
   body div#listmenu ul li ul li ul {padding-bottom:22px;}
   ul li ul li ul li ul li:hover {visibility:visible;} /* same effect as display:block in this situation */
   }
/*end Opera hack */
/* END OF HACK ZONE */
/* the drop-down ends here */
/* END OF LIST-BASED MENU */
/* finally after feeding values to all others, we deal with MAc5 IE */
/* IE5 Mac can't do drop-downs so we need to present the info in a different way*/
/* we present the drop down choices in a row and never show any second-level drops */
 /* this stylesheet is read by IE5 Mac only - hack omits 'url' and leave no space between @import and ("   */
@import("css/ie51_menu_hack.css"); 
/*styling the index image*/