body {
	font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
	font-size:80%;
	background-image: url("images/slideboxpic11.gif");
	background-repeat:repeat-x;
	background-color:#ffffff;
	color:#000000;	
}

.logopic { 	position:absolute;
	top: 10px;
	left: 90px;
	}
/* 	homer is all about clicking on the big slidebox logo to change its spots and return to homepage
*/

.homer	{
	position:absolute;
	top: 10px;
	left: 90px;
	background-image:  url(images/slideboxlogocolour2.gif);
	background-repeat: no-repeat;
	white-space: nowrap;
	display: block;
	margin: 0; 
	padding: 0; 
	}

.homer a {
	display: block;
	float: left;
	}

.homer img {		
	border: 0; 
	}

.homer a:hover img{	visibility:hidden
	}



.retouch	{
	position:absolute;
	top: 10px;
	left: 450px;
	background-image:  url(images/retouch2.gif);
	background-repeat: no-repeat;
	white-space: nowrap;
	display: block;
	margin: 0; 
	padding: 0; 
	}

.retouch a {
	display: block;
	float: left;
	}

.retouch img {		
	border: 0; 
	}

.retouch a:hover img{	visibility:hidden
	}








.contenttop{
	position:absolute;
	top: 110px;
	left: 5px;
}
.contenttoporderform{
	position:absolute;
	top: 0px;
	left: 5px;
}
.contenttoporderformrecd{
	position:absolute;
	top: 100px;
	left: 5px;
}
.content{
	position:absolute;
	top: 123px;
	left: 0px;
	width:806px;
	margin: 0px 5px 100px 5px;

	background-color:#ebeeed;
	border-style: solid;
	border-width: 0px 1px 1px 1px;
	border-color: #4E5F5A;
}
.contentorderform{
	position:absolute;
	top: 14px;
	left: 0px;
	width:750px;
	margin: 0px 5px 10px 5px;

	background-color:#ebeeed;
	border-style: solid;
	border-width: 0px 1px 1px 1px;
	border-color: #4E5F5A;
}
.contentorderformrecd{
	position:absolute;
	top: 114px;
	left: 0px;
	width:750px;
	margin: 0px 5px 10px 5px;

	background-color:#ebeeed;
	border-style: solid;
	border-width: 0px 1px 1px 1px;
	border-color: #4E5F5A;
}



.content-text{
	padding: 0px 50px 10px 50px;
}

.content-textorderform{
	float: left;
	padding: 0px 5px 5px 10px;
	width: 650px;
}

.content-text-box{
	padding: 0px 10px 10px 10px;
	margin: 20px 10px 20px 10px;
	background-color: #ffffff;
	border-style: solid;
	border-width: 1px 1px 1px 1px;
	border-color: #4E5F5A;

}
.content-text-boxorderform{
	float:left;
	padding: 0px 10px 10px 10px;
	margin: 20px 10px 20px 10px;
	background-color: #ffffff;
	border-style: solid;
	border-width: 1px 1px 1px 1px;
	border-color: #4E5F5A;
}

.backarrow1{
	position: absolute;
	top: 30px;
	left: 670px;
}
.backarrow2{
	position: absolute;
	top: 1000px;
	left: 670px;
}

.slidebox_show{
	margin: 30px 0 30px 0;
	text-align: center;
}

form{
	margin:0;
	padding:0;
}


.lefttorderform{
	float:right;
}

.left{
	float:right;


	margin:10px 0;
	padding:0 10px;
	text-align:justify;
}
a {
	color:midnightblue;
	background-color:inherit;
	border-style: none;
	border: 0px;
}
a:hover{

	text-decoration:none;
	border-style: none;
	border: 0px;
}



h1{
	color:#323c3d; 
	background-color:beige;
	font-size:140%;
	border-style:solid;
	border-width:1px;
	border-color:gray;
	padding: 0px 20px 0px 0px;
	margin: 20px 10px 10px 0px;
	text-align: center;
}
h2{
	color:#323c3d; 
	background-color:beige;
	font-size:120%;
	border-bottom-style:solid;
	border-bottom-width:1px;
	border-bottom-color:gray;
	padding: 0px 0px 0px 20px;
	margin: 20px 10px 10px 0px;

}
h3{
	color:#323c3d; 
	background-color:beige;
	font-size:100%;
	padding: 0px 0px 0px 20px;
	margin: 20px 10px 10px 0px;

}

	



.picright { 	text-align: left;
		float: right;
}
.picleft { 	text-align: right;
	float: left;
	margin: 10px 10px 20px 10px;
}

/* 	the menu bar: menuitems just give te absolute position for each tab.
*/

.menuitem1 {
	position: absolute;
	top: 90px;
	left: 10px;

}
.menuitem2 {
	position: absolute;
	top: 90px;
	left: 110px;
}
.menuitem3 {
	position: absolute;
	top: 90px;
	left: 210px;
}
.menuitem4 {
	position: absolute;
	top: 90px;
	left: 310px;
}
.menuitem5 {
	position: absolute;
	top: 90px;
	left: 410px;
}
.menuitem6 {
	position: absolute;
	top: 90px;
	left: 510px;
}
.menuitem7 {
	position: absolute;
	top: 90px;
	left: 610px;
}

.menuitem8 {
	position: absolute;
	top: 90px;
	left: 710px;
}


.rhino {
background-repeat : no-repeat;
white-space : nowrap;
display : block;
margin : 0;
padding : 0;
color: white;
}
.rhino a {
text-decoration: none;
display : block;
float : left;
width: 100px;
height: 30px;
color: white;
}
.rhino a:hover img {
visibility : hidden;
}

.thattab a:link {
background-image : url("images/tabmid.png");
}
.thattab a:visited {
background-image : url("images/tabmid.png");
}
.thattab a:focus {
background-image : url("images/tabblackfocus.png");
}

.thattab a:hover {
background-image : url("images/tablight.png");
}

.thistab a:link {
background-image : url("images/tabdark.png");
}

.thistab a:visited {
background-image : url("images/tabdark.png");
}

.thistab a:focus {
background-image : url("images/tabblackfocus.png");
}
.thistab a:hover {
background-image : url("images/tablight.png");
}



/* 	firefox opera and ie get the tabs class font-weight how i like it; safari makes it too thick. no amount of fine tweaking seems to help.
*/

.tabs{
	margin: 50px 0px 0px 10px;
	padding: 30px 10px 0px 10px;
	color: inherit;
	text-align: center;
	font-weight: 600; 
	font-size: 1.1em; 
	line-height: 2.5em;
}



input  {
border: 1px solid #000;
	background-color:#ebeeed;
}

input:focus  {
border: 1px solid #000;
background-color:#ebeeed;
}
/!-- firefox not ie !/
select  {
border: 1px solid #000;
background-color:#ebeeed;
}


textarea {

	background-color:#ebeeed;
}





td.notform{padding: 0px 10px 10px 10px;}


table.one
{
table-layout: auto
}

.tableheader{
	background-color:#a4b2b4;
}
.tabletitle{
	background-color:#a4b2b4;
	text-align: center;
}
.tablerightalign{
	text-align: right;
}

.tableleftalign{
	text-align: left;
	vertical-align:top;
}
.tablemiddlealign{

	text-align: middle;
	vertical-align:top;
	horizontal-align:middle;
}
.tablepadding{
	padding: 0px 20px 20px 20px ;

	border-style: solid;
	border-width: 5px 5px 5px 5px;

	background-color: #ebeeed;
	border-color: #4E5F5A;
}



a img { border-style: none; }

.photos {
	text-align: center;
}
.caption {
	font-size: 70%;
}

.copyright {
	font-size: 70%;
	text-align: center;
}

.small-middle {
	text-align: center;
	font-style: italic;
	font-size: 70%;
	position:absolute;
	top: 60px;
	left: 340px;
}

.datescript {
	position:absolute;
	top:40px;
	left:450px;

}

	
.preserve {position: absolute;
	top: 37px;
	left: 420px;
}

/* 	thanks to http://www.webreference.com/programming/css_style2/index.html for the info menu
	
*/

#infomenubackground {
	background-image: url("images/film-back3.png");
	width: 598px;
}

#infomenu {

  padding:0;
  margin:0;
  width:0;	}
#infomenu li {
  list-style-type:none;
 margin:0 0 0.25em 0;
  }
#infomenu a, #infomenu a:visited {
 position:relative; 
 display:block;
  width:9em;
  border:1px solid #4E5F5A;
  font-family:arial, verdana, sans-serif; 
  font-size:0.9em; 
  text-align:left; 
  text-decoration:none; 
background:#4E5F5A; 
  color:beige; 
padding:0.25em;
  }
#infomenu a:hover {
  background:beige;
  color:#4E5F5A;
  }
#infomenu a span {
  display:none;
  }
#infomenu a:hover span {
  display:block;
  position:absolute; 
  left:10em;
  top:0; 
text-align:left; 
  padding:0.5em;  
  width:468px; 
  background-color:beige; 
  color:#000; 
  border:1px solid #4E5F5A; 
}
#infomenu img {
  border:1px solid #000; 
  float:left; 
  margin:0.25em 1em 0.5em 0;
  }
#infomenu a:hover span:first-line {
  font-weight:bold; 
  font-size:1.2em;
  color:#4E5F5A;
  }



.oldslide{
	position:relative;
	top: 0px;
	left: 0px;
	background-image:  url("images/oldslide1closeup2.jpg");
	background-repeat: no-repeat;
	white-space: nowrap;
	display: block;
	margin: 0; 
	padding: 0; 
	}

.oldslide a {
	display: block;
	float: left;
	}

.oldslide img {		
	border: 0; 
	}

.oldslide a:hover img{	visibility:hidden;
	}