html, body {
/* Mozilla browsers require the following CSS for this doctype, */
/* otherwise page content height is not 100%. */
height:100%;
}

/*reset all padding by default by different browsers*/
*{
	padding:0;
	margin:0;
}

table {
	border-collapse: collapse;
	border-spacing: 0px;
	border: none;
}

form {
	display:inline;
}

div#wrapper {
	position:absolute;
	left: 50%;
	width:779px;
	height:100%;
	margin-left:-390px;
}

div#menuWrapper{
	height:24px;
	margin:0;
	padding:0 20px 0 20px;
	background: #cccccc url(../images/menu-bground.gif) repeat-x left bottom;
	color: #ff0000;
}

div#menuWrapper a{
	display:block;
	margin: 0 1px 0 0;
	padding: 0;
	width:140px;
	height:24px;
	float: left;
	background: transparent url(../images/menu-tab-off-bground.gif) repeat-x left top;
	text-decoration:none;
}

div#menuWrapper a span{
	display: block;
	margin: 0;
	padding: 0;
	height:24px;
	background: transparent url(../images/menu-tab-off-left.gif) no-repeat left top;
}

div#menuWrapper a span span{
	display: block;
	margin: 0;
	padding: 0;
	height:24px;
	background: transparent url(../images/menu-tab-off-right.gif) no-repeat right top;
}

div#menuWrapper a span span span{
	display:block;
	padding: 4px 6px 0 6px;
	font-size:12px;
	font-weight:bold;
	color:#999999;
	text-align:center;
	text-decoration: none;
	cursor: default;
}

div#menuWrapper a:hover{
	background: #ffffff url(../images/menu-tab-on-bground.gif) repeat-x left top;
}

div#menuWrapper a:hover span{
	background: transparent url(../images/menu-tab-on-left.gif) no-repeat left top;
}

div#menuWrapper a:hover span span{
	background: transparent url(../images/menu-tab-on-right.gif) no-repeat right top;
}

div#menuWrapper a:hover span span span{
	color: #225588;
	cursor: hand;
}


div#menuWrapper a.selected{
	background: #ffffff url(../images/menu-tab-on-bground.gif) repeat-x left top;
}

div#menuWrapper a.selected span{
	background: transparent url(../images/menu-tab-on-left.gif) no-repeat left top;
}

div#menuWrapper a.selected span span{
	background: transparent url(../images/menu-tab-on-right.gif) no-repeat right top;
}

div#menuWrapper a.selected span span span{
	color: #225588;
}

td.spacer,  td.spacer img {
	width: 20px;
	background-color :transparent;
}

table#masthead {
	width:100%;
	margin: 0;
}

td#retfordphotographic {
text-align:left;
}

td#retfordtimes {
text-align:right;
}

table#gridHolder{
	margin: 9px 0 0 0;
	width:100%;
}

table#gridHolder tr td.leftColumn{
	width:188px;
	padding: 0 9px 0 0;
	vertical-align:top;
}

/* LEFT PANELS */

div.leftPanel {
	width:188px;
	margin: 0 0 9px 0;
	padding: 0;
	background: #E8EBF4 url(../images/leftPanel-bground.gif) repeat top left;
}

div.leftPanel div {
	margin: 0;
	padding: 0;
	background: transparent url(../images/leftPanel-top.gif) no-repeat top left;
}

div.leftPanel div div {
	margin: 0;
	padding: 10px 10px 10px 10px;
	background: transparent url(../images/leftPanel-bottom.gif) no-repeat bottom left;
	text-align: left;
}

div.leftPanel div div ul {
	margin: 0 0 0 15px;
	list-style : square;
	color: #ffffff;
}

div.leftPanel div div ul a {
	color: #006699;
	font-weight: bold;
	text-decoration:none;
}

div.leftPanel div div ul a:hover{
	color: #003366;
	text-decoration:underline;
}

input.blue {
margin: 2px 0 2px 0;
padding: 2px;
height:18px;
	background: #006699 none;
	color: #ffffff;
	font-size:93%;
	font-weight:bold;
	border: none;
}

span#yourBasket {
	display:block;
	width:127px;
	height:20px;
	font-size: 77%;
	margin: 0 0 5px  0px;
	padding: 0;
	background: transparent url(../images/leftPanel-title-yourbasket.gif) no-repeat left top;
	text-align: left;
	text-indent: -4000px;
}

span#leftSearch {
	display:block;
	width:127px;
	height:20px;
	font-size: 77%;
	margin: 0 0 5px  0px;
	padding: 0;
	background: transparent url(../images/leftPanel-title-search.gif) no-repeat left top;
	text-align: left;
	text-indent: -4000px;
}

span#leftPageLayout {
	display:block;
	width:127px;
	height:20px;
	font-size: 77%;
	margin: 0 0 5px 0px;
	padding: 0;
	background: transparent url(../images/leftPanel-title-layout.gif) no-repeat left top;
	text-align: left;
	text-indent: -4000px;
}

span#leftHelp {
	display:block;
	width:127px;
	height:20px;
	font-size: 77%;
	margin: 0 0 5px 0px;
	padding: 0;
	background: transparent url(../images/leftPanel-title-help.gif) no-repeat left top;
	text-align: left;
	text-indent: -4000px;
}

/* END OF LEFT PANELS */


/* MAIn IMAGE PANEL ELEMENTS */

span#searchResults {
	display:block;
	width:159px;
	height:22px;
	font-size: 77%;
	margin: 0;
	padding: 0;
	background: transparent url(../images/title-SearchResults.gif) no-repeat left top;
	text-align: left;
	text-indent: -4000px;
}

span#filesInArchives {
	display:block;
	width:159px;
	height:22px;
	font-size: 77%;
	margin: 0;
	padding: 0;
	background: transparent url(../images/title-FilesInArchive.gif) no-repeat left top;
	text-align: left;
	text-indent: -4000px;
}

table#searchR{
	width:100%;
}

td.searchResultsTotal {
	font-size:93%;
	font-weight: bold;
	color: #666666;
	text-align:right;
	vertical-align : middle;
}

table#searchNav{
	width:100%;
	margin: 5px 0 0 0;
}

table#searchNav tr td {
	height:35px;
	padding: 0 0 0 10px;
	font-size:93%;
	color: #666666;
	background: #E8EBF4 url(../images/search-navBar-left.gif) no-repeat left top;
}

table#searchNav tr td.prevNext{
	padding: 0 10px 0 0;
	text-align:right;
	background: #E8EBF4 url(../images/search-navBar-right.gif) no-repeat right top;
}

table#searchNav tr td  b {
	color: #000000;
}

table#searchNav tr td  a {
	color: #666666;
	text-decoration: none;
}

table#searchNav tr td a:hover {
	color: #006699;
	text-decoration: underline;
}

table#grid {
	border: none;
	margin: 9px 0 0 0;
}

table#preview {
	/*border: 1px #00ff00 solid;*/
	width:100%;
	margin: 9px 0 0 0;
}

table#previewImage {
	border: none;
	margin: 0;
	padding: 0;
}

a#backToThumbnails {
	display:block;
	width:185px;
	height:22px;
	font-size: 77%;
	margin: 0 0 2px 0;
	padding: 0;
	background: transparent url(../images/btn-backtothumbnails.gif) no-repeat left top;
	text-align: left;
	text-indent: -4000px;
}

a#previewAddTo {
	display:block;
	position : relative;
	left: 50%;
	width:200px;
	height:22px;
	font-size: 77%;
	margin: 0 0 0 -100px;
	padding: 0;
	background: transparent url(../images/btn_preAddToBasket.gif) no-repeat left top;
	text-align: left;
	text-indent: -4000px;
}

a#previewRemoveFrom {
	display:block;
	width:200px;
	height:22px;
	font-size: 77%;
	margin: 0;
	padding: 0;
	background: transparent url(../images/btn_preRemoveFromBasket.gif) no-repeat left top;
	text-align: left;
	text-indent: -4000px;
}

table#grid tr td{
	padding: 0;
	margin: 0;
	border: 0;
	background: transparent none;
	vertical-align: top;
}

table#preview tr td{
	padding: 15px;
	margin: 0;
	border: 0;
	background: transparent none;
	vertical-align: top;
}

table#previewImage tr td {
text-align : center;
vertical-align : middle;
/*border: 1px #ff0000 solid;*/
padding:3px 0 3px 0;
}

table#previewImage tr td.imgHold {
width:400px;
}

table#grid tr td table {
	width: 144px;
	border: none;
	margin: 0 9px 9px 0;
}

table#grid tr td table tr td.top {
	height:10px;
	padding: 0px;
	border: none;
	background: transparent url(../images/panel-thumbnail.gif) no-repeat  left top;
}

table#grid tr td table.selected  tr td.top {
	background: transparent url(../images/panel-thumbnail-selected.gif) no-repeat  left top;
}

table#grid tr td table tr td.imgHolder {
	height:124px;
	padding: 0px;
	border: none;
	text-align: center;
	vertical-align:bottom;
	background: transparent url(../images/panel-thumbnail-bground.gif) repeat-y left top;
}

table#grid tr td table.selected tr td.imgHolder {
	background: transparent url(../images/panel-thumbnail-selected-bg.gif) repeat-y left top;
}

table#grid tr td table tr td.imgHolder a img {
	border: none;
}

table#grid tr td table tr td.imgTitle {
 	margin: 0;
	padding:0;
    width: 144px; 
    height: 27px;
	border: 0;
	background: transparent url(../images/panel-thumbnail-bground.gif) repeat-y left top;
	text-align: center;
	vertical-align:middle;
  }
  
  table#grid tr td table.selected tr td.imgTitle {
  background: transparent url(../images/panel-thumbnail-selected-bg.gif) repeat-y left top;
  }
  
  table#grid tr td table tr td.imgTitle a{
   font-size: 100%;
   text-decoration: none;
   font-weight : normal;
   color: #006699;
  }
  
    table#grid tr td table tr td.imgTitle a:hover{
   text-decoration: underline;
   color: #666666;
  }
  
table#grid tr td table tr td.basketButton {
     width: 144px; 
    height: 31px;
	margin:0;
	padding:0;
	border: 0;
	background: transparent url(../images/panel-thumbnail-bground.gif) repeat-y left top;
	text-align: center;
	vertical-align:middle;
  }
  
  table#grid tr td table.selected tr td.basketButton {
  	background: transparent url(../images/panel-thumbnail-selected-bg.gif) repeat-y left top;
  }
  
  table#grid tr td table tr td.basketButton a{
	display: block;
	width: 125px;
	height: 31px;
	font-size: 70%;
	text-align: left;
	text-indent: -4000px;
	background: transparent url(../images/btn_addToBasket.gif) repeat-y left top;
}

  table#grid tr td table.selected  tr td.basketButton a{
	display: block;
	width: 125px;
	height: 31px;
	font-size: 70%;
	text-align: left;
	text-indent: -4000px;
	background: transparent url(../images/btn_removeFromBasket.gif) repeat-y left top;
}
  
	table#grid tr td table tr td.bottom {
    width: 144px; 
    height: 10px;
	margin:0;
	padding:0;
	border: 0;
	background: transparent url(../images/panel-thumbnail-bottom.gif) no-repeat  left bottom;
	text-align: center;
	vertical-align:middle;
  }
  
  table#grid tr td table.selected tr td.bottom {
  	background: transparent url(../images/panel-thumbnail-selected-bo.gif) no-repeat  left bottom;
  }
  
 /* DECEMBER 07 CHANGE MADE HERE */
 
td#basketHolder {
	padding-top:10px;
	vertical-align:top;
}
  
td#basketRightCol {
	width:220px;
	padding: 10px 0 0 10px;
	vertical-align : top;
}
  
table.ShoppingBasketHolder {
	width:100%;
	margin: 0 0 10px 0;
	
}


/* Testing ONLY stuff comment out after Testing */

/*table.ShoppingBasketHolder	tr td {
	border:1px #ff0000 solid;
}

table.newTable1 tr td{

	border:1px #00ff00 solid;
}*/




table.ShoppingBasketHolder	tr td.imgHolder {
	width:124px;
	padding: 0 0 5px 0;
	border: none;
	text-align: center;
	vertical-align:top;
	border-bottom-width : 1px;
	border-bottom-color : #cccccc;
	border-bottom-style : dashed;
}

table.ShoppingBasketHolder	tr td.spacer {
	width: 5px;
	border-bottom-width : 1px;
	border-bottom-color : #cccccc;
	border-bottom-style : dashed;
  }
  
table.ShoppingBasketHolder	*  td.imgCheckBox {
	width:10px;
	margin:0;
	padding:0 0 10px 0;
	border: 0;
	text-align: left;
	vertical-align:top;
	border-bottom-width : 1px;
	border-bottom-color : #cccccc;
	border-bottom-style : dashed;
  }
  
  table.ShoppingBasketHolder	*  td.imgDetails {
	margin:0;
	padding:0 0 10px 0;
	border: 0;
	text-align: left;
	vertical-align:top;
	border-bottom-width : 1px;
	border-bottom-color : #cccccc;
	border-bottom-style : dashed;
  }
  
  table.ShoppingBasketHolder	*  td.imgDetails h3.imgTitle {
	margin:0 0 2px 0;
	padding:0;
	font-size: 100%;
	font-weight:bold;
  }
  
  table.pricesTable {
  margin: 0;
	border:0;
}

 table.pricesTable	tr th{
	font-weight: normal;
	padding:2px;
	text-align:left;
}

  table.pricesTable	tr td {
	padding: 2px;
	border: 0;
	border-top-width : 1px;
	border-top-color : #cccccc;
	border-top-style : solid;
}

table.pricesTable	tr th.colHeader{
	color:#999999;
	font-size:70%;
	font-style : italic;
	text-align:right;
	vertical-align:top;
}

table.pricesTable	tr td.prodDescript{
	width:180px;
}

table.pricesTable	tr td.prodQuantity{
	
}

table.pricesTable	tr td.prodPrice{
	
}

  table.pricesTable	tr td.lastRow {
	border-bottom-width : 0;
}

 table.pricesTable	tr td input {
	border: 1px #cccccc solid;
	padding:2px;
}

input.totalField{
	font-size:123%;
	font-weight:bold;
	margin: 3px 0 0 0;
	padding: 3px 5px 0 0;
	background-color : #eeffcc;
	text-align:right;
	border: 0;
}
  
  /* END OF CHANGE */
  
div.lbluePanel {
	display:block;
	padding: 0;
	_height: 0;
	background: #C6E8F7 url(../images/corner-lblue-tl.gif) no-repeat  left top;
}

div.lbluePanel div {
	_height: 0;
	background: transparent url(../images/corner-lblue-tr.gif) no-repeat  right top;
}

div.lbluePanel div div {
	_height: 0;
	background: transparent url(../images/corner-lblue-br.gif) no-repeat  right bottom;
}

div.lbluePanel div div div{
	_height: 0;
	background: transparent url(../images/corner-lblue-bl.gif) no-repeat  left bottom;
	padding: 10px;
}

div.lgreenPanel {
	display:block;
	padding: 0;
	_height: 0;
	background: #EEFFCC url(../images/corner-lgreen-tl.gif) no-repeat  left top;
}

div.lgreenPanel div {
	_height: 0;
	background: transparent url(../images/corner-lgreen-tr.gif) no-repeat  right top;
}

div.lgreenPanel div div {
	_height: 0;
	background: transparent url(../images/corner-lgreen-br.gif) no-repeat  right bottom;
}

div.lgreenPanel div div div{
	_height: 0;
	background: transparent url(../images/corner-lgreen-bl.gif) no-repeat  left bottom;
	padding: 10px;
}

input {
	margin: 0;
	padding: 0;
}

.graphicTitle {
	display:block;
	margin:0;
	padding: 0;
	overflow: hidden;
	background-position : left top;
	background-repeat : no-repeat;
	background-color: transparent;
	text-indent: -9999px;
}

h3#makePurchase {
	background-image: url(../images/title-makePurchase.gif);
	height:18px;
}

h3#updateBasket {
	background-image: url(../images/title-updateBasket.gif);
	height:18px;
}

h3#checkOut{
	background-image: url(../images/title-checkout.gif);
	height:18px;
}

h1#aboutTheArchives {
	background-image: url(../images/title-aboutTheArchives.gif);
	height:18px;
}

h1#availableProducts {
	background-image: url(../images/title-availableProducts.gif);
	height:18px;
}

h1#usingThisSite {
	background-image: url(../images/title-usingThisSite.gif);
	height:23px;
}

/* BASE ELEMENTS */

img#baseLogos {
	float: right;
	margin: 5px 18px 0 18px;
}

div#baseNav {
	margin: 9px 0 0 0;
	padding: 8px 20px 0 20px;
	background: #cccccc url(../images/basenav-bground.gif) repeat-x left bottom;
	font-size: 11px;
	color: #cccccc;
	text-align:right;
}

div#baseNav a{
	color:#999999;
	text-decoration: none;
}

div#baseNav a:hover {
	color: #006699;
	text-decoration: underline;
}

div#baseNav a.selected{
	color: #006699;
	text-decoration: none;
}

/* END OF BASE NAV */