/* --- GREYS
grey1	#F0F0F0		gallery hover-highlight          
grey2	#E6E6E6    	pg messageline bg, sb-table tfoot,thead      
grey3	#DDDDDD     option bar tds     
grey4	#D7D7D7     pp buying panel bg     
grey5	#CCCCCC     default body bg     
grey6	#C0C0C0     search bar td, pp-mounted captions, pp-back/wishlist buttons     
grey7	#BBBBBB     sb-table cell borders     
grey8	#B4B4B4     gallery options box bg     
grey9	#3C3C3C     low-key bold text     
---------------*/

body { width: 78em;  min-width:965px; margin:0; padding:0; border:0; background-color: #CCCCCC/*grey5*/; 
font-family: Arial, Helvetica, Verdana, sans-serif;  font-size: 0.8em; 
}

body#index-gallery { background-color: #CCCCCC/*grey5*/;}
body#photo-gallery { background-color: #CCCCCC/*grey5*/;}
body#wishlist-gallery { background-color: #CCCCCC/*grey5*/;}
 
/* hide unusable options for Stock/Landscape galleries */
body.Stock  #group-photos-by { display: none; }
body.Stock  #search-by-location { display: none; }
body.Landscape  #group-photos-by { display: none; }
body.Landscape  #search-by-location { display: none; }
		
form { margin:0; padding:0; border:0; }
#container {  width: 78em;  min-width:965px; 
font-size: 100%;  /* makes bigger text work better on IE6 */
}

#content { padding: 0px; z-index: 1; width: 65em; float: right; }
#content li {margin-bottom: 0.5em;}

#footer { padding: 0px;
clear: both;
margin-top: 0;
z-index: 1;
}

.top-back-links { margin: 0 auto 1em 1em; padding:0; text-align:left;font-weight: bold; }
/* Workround for min-height page
	need a tall-page so browser positions accurately to the sub-intro anchor (else if window is big enough, will show part of intro)
	IE6 has bugs in height-property such that height behaves as min-height, and min-height does nothing.  Solution depends on IE6 
	not understanding child-selector, where the other browsers do, so can use height for IE6, else min-height. 
	Next two lines of CSS do the business !*/
	#content {height:1024px;}   /* for IE6 */
	html>body #content {height: auto; min-height: 1024px;} /* child selector ignored by IE6: for other browsers does min-height properly */
/* End min-height workround */
ul {margin: 0.5em 1.5em; text-indent: 0; padding: 0;}
p { margin: .3em 0 .8em 0;padding:0;} 
h1 {font-style: italic; font-weight: bold; font-family: "Times New Roman", Times, serif; font-size: 2.2em;}
h2 {font-style: italic; font-weight: bold; font-family: "Times New Roman", Times, serif; font-size: 2em;}
h3 {font-style: italic; font-weight: bold; font-size: 1.3em; margin: 0.3em 0 0 0;}
h4 {font-style: italic; font-weight: bold; font-size: 1em; margin: 0.2em 0;}
hr { border: 2px outset #FFFFFF; color: #FFFFFF; background-color: #FFFFFF; height: 2px; width: 100%; text-align: center; }
input { width:auto;  overflow:visible; } /* IE6 bugfix for overlong boxes */
 
.indent {padding-left: 2em;}
 
.top-of-page-link { font-size: 1.2em; margin: 1em 0 1em 0.5em; }

div.info{ background: #E6E6E6/*grey2*/;  width: 96%; border: 0.2em outset #ffffff; margin: 0 0.5% 1% 0.5%; padding: 1%; }

table.info {  background: #E6E6E6/*grey2*/;  width: 100%; margin: 0 0 1% 0;border: 0.2em outset #ffffff; padding: 0; 
border-spacing: 0.1em;  /* ignored by IE6, so still have to use cellspacing in the html */
}
table.info th { background: #E6E6E6/*grey2*/; FONT-WEIGHT: normal; padding: 0.2em 1em; }
table.info td, td.info { background: #DDDDDD/*grey3*/; border: 0.1em inset #ffffff; padding: 0.2em .6em 0.8em 0.6em; vertical-align: top; }

table.info2{  background: #E6E6E6/*grey2*/;  width: 100%; margin: 0 0 1% 0; border: .2em outset #ffffff;
border-spacing: 0.1em;  /* ignored by IE6, so still have to use cellspacing in the html */
}
table.info2 th, table.info2 td  { background: #E6E6E6/*grey2*/; FONT-WEIGHT: normal; padding: 0.2em 1em; vertical-align: top; }

table.stealth { background: transparent; margin: 0; border-width:0; border-spacing: 0; padding:0;  border-collapse: collapse;}
table.stealth td,  table.stealth th { background: transparent; border-width:0; }
table#page-index { margin: 0 auto 0 5%; border-width:0; border-spacing: 0; padding:0;}
table#page-index td {  border-width:0; width:20em; }
table#page-index p { margin:0.2em; }

td.photoshop-tn { border-bottom-width:0; margin:0;padding-bottom:0;vertical-align: bottom; }
td.photoshop-tn-caption { border-top-width: 0; margin:0;padding-top:0; padding-bottom: 1em; text-align: center; }

/*   SIDEBAR STUFF================================== */
#sidebar { padding: 0 0 0 0.4em;float:left;width:12.3em;position: absolute; z-index:100;}
#sidebar table {border-collapse:collapse;} /* Smallest table possible */
#sidebar td {border-width: 0;padding: 0;}
#sidebar div.menu a.menu-top-a {text-decoration: none;color:#000000;}
#sidebar div.menu a.menu-list-a { text-decoration: none;color:#000000; padding-left: 1em; width:11em; }
div.menu {position:relative;width:98%; margin: 1px auto 1px 0; padding:0;background:#A9BFCB;border:1px solid gray;}
div.menu .menu-top-a {display:block;color:#000;font-weight:bold;text-decoration:none;padding:.6em 0 .8em 0;text-align:center;height:100%;}
div.menu .menu-top-a ul {font-weight:normal;list-style:none;margin:0;} /* non-class name definitions for menu-ul - non-visible properties */
div.menu .menu-top-a li {position:relative;display:block;margin:0;} /* non-class name definitions for menu-li - non-visible properties */
div.menu .menu-top-a a {display:none;} /* non-class name definitions for a2 - non-visible properties */
div.menu .menu-ul,.menu-list-a {display:none;} 
div.menu .menu-li {text-align:left;font-size:0.9em;height:1.8em;line-height:1.6em; border-width:0;}
.loner .menu  {margin:0; padding:0;background: #C6D4DC;margin:1px 0;}
/* MSIE pop-ups CSS */
div.menu .menu-top-a:hover {background:  #C7E1F0; color:#000;}/* roll-over effect */
div.menu .menu-top-a:hover .menu-ul { padding:.5em 0;left:100%;top:-.1em;border:1px outset white;border-left-width:0;width:11em;background:#C7E1F0;display:block;position:absolute;margin:0;}
div.menu .menu-top-a:hover .menu-ul .menu-li {display:block;}
div.menu .menu-top-a:hover .menu-ul .menu-li .menu-list-a {border-style:none;margin:0;padding:0;display:block;text-align:left;}
div.menu .menu-top-a:hover .menu-ul .menu-li .menu-list-a:hover { text-decoration:none; background: #E8F6FF;}
/* Gecko/Opera Pop-ups */
div.menu:hover .menu-top-a {background:  #C7E1F0; color:#000;}
div.menu:hover > ul {display:block;text-align:left;}
div.menu:hover .menu-ul {padding:.4em 0;left:100%;top:-0.1em;border:1px outset white;border-left-width:0;width:11em;background:#C7E1F0;display:block;position:absolute;margin:0;}
div.menu:hover .menu-ul .menu-li {display:block;}
div.menu:hover .menu-ul .menu-li .menu-list-a { border-style:none;margin:0;padding:0;display:block;text-align:left; padding-top:.3em;}
div.menu:hover .menu-ul .menu-li .menu-list-a:hover { background: #EDF8FF; text-decoration: none; }
.nojavascript-warning { background:#F0F0F0/*grey1*/; border-width:1px; line-height:1.4em; text-align:center; margin-top: 1em; padding:0.5em; height:auto;}

/*   SIDEBAR STUFF================================== END */

table {font-size: 1em;} /* fixes IE5.5 bug */ 
input, select, textarea {
font-size: 1em;
} /* else IE6 won't scale inputs when user asks for bigger text */
#sb-button-bar input:hover { background: #C4D8F0; } /* buttons glow under cursor */

.sub-heading { margin: .9em 0 .4em 0; font-size: 1.2em; }
.bold  { font-weight: bold; }
.italic  { font-style: italic;}	 
.bold-italic  {
font-style: italic;
font-weight: bold;
}

#banner-intro
{
color: #456969;
font-family: "Times New Roman", Times, serif;
font-style: italic;
font-weight: bold;
margin: 0 0.5em;
padding: 0;
}
#banner-intro a:link {  color: #4B4B96; }
#banner-intro a:visited { color: #784878; }
#banner-intro a:active {  color: #964B4B; } 
#banner-intro h2 
{
border-width: 0 0 2px 0;
font-size: 1.4em;
margin:0 1em;
text-align: left;
}
#banner-intro h1
{
border-color: #517A7A;
border-style: solid;
border-width: 1px 0 1px 0;
font-size: 1.8em;
margin: 0.1em 0 0.2em 0;
padding: 0 0 0.1em 0;
text-align: center;
}
#banner-intro h1 span { font-size: 0.6em; }

table.tn-intro-bar { width:96%;}
table.tn-intro-bar td { text-align: center; margin:auto; font-weight:normal; }
table.tn-intro-bar img { width:180px; height:120px;}
#banner-intro .tn-intro-bar a:visited, #banner-intro .tn-intro-bar a:link, #banner-intro .tn-intro-bar a:active, #banner-intro .tn-intro-bar a:hover 
				{ text-decoration:none; color:#456969; }

#banner-intro .quiet {font-size: 0.8em; font-weight: normal; }
#banner-intro .quiet a:visited, #banner-intro .quiet a:link, #banner-intro .quiet a:active, #banner-intro .quiet a:hover 
				{ text-decoration:none; color:#456969; }

/* #banner-main { padding: 0; margin: 0; text-align: center; font-style: italic; font-family: "Times New Roman", Times, serif;} */
#banner-main { padding: 0; margin-left: 14em; text-align: left; font-style: italic; font-family: "Times New Roman", Times, serif;}
#banner-main h1 { font-size: 2.1em; font-weight: bold; margin: 0.2em 0.5em 0.1em 0; }
#banner-main h1 span { font-size: 0.6em; }

.low-key-bold  {font-weight: bold; color: #3C3C3C/*grey9*/; }	 

/*   PHOTOGALLERY================================== */

#gallery {  width: 100%; margin:0; padding: 0; border:0.3em; border-style: ridge; border-color: #FFFFFF; text-align: center; font-size: 1em; }

/* Workround for min-height gallery 
	want to set a minimum height for the gallery, partly cos it looks better, partly because of IE6 bug 
	where it ignores z-index for select boxes so these poke thru drop-down menus if they overlap, which 
	they do if gallery is too short.  To further complicate matters, IE has bugs in height-property such 
	that height behaves as min-height, but min-heght doesnt do anything at all.  Solution depends on IE6 
	not understanding child-selector, where the other browsers do, so can use height for IE6, else min-height. 
	Next two lines of CSS do the business !*/
	#gallery {height:25em;} /* forces gallery to a minimum height to push select box below menus */
	html>body #gallery {height: auto; min-height: 25em;} /* child selector ignored by IE6: for other browsers does min-height properly */
	/* End min-height workround */

td.gallery-caption h3 { border-top: 0.2em; font-size: 1em; margin: 0; padding: 0; position: relative; top: 0.2em; }

img{ display: block; position: relative; bottom: -.11em;  border: 3px outset #ffffff; margin-left: auto; margin-right: auto; }
html>body img { border-width:2px; } /* correction fort non-IE6 - needs checking for IE7 */
a:hover img { background: transparent; border-style: groove; } 

input.buy-tn { border: 3px outset #FFFFFF; padding:0 ; }
input.buy-tn:hover { border-style: groove; }

a:link { color: #000096; }
a:visited { color: #6C006C; }
a:active {  color: #960000; } 
#content a:hover, #banner-intro a:hover { background: #F0F0F0/*grey1*/; } 
div.popup a span {display: none;}
div.popup a:hover span {display: block; margin-top:.8em;
   position: relative; text-decoration:none; 
   color: #000000; background: #F0F0F0}

#gallery span, #gallery input { vertical-align:top ; margin: 0; padding: 0;  }
#gallery a:hover span { background: #F0F0F0/*grey1*/; }

td.gtn-portrait img { height: 160px; width: 110px;}
td.gtn-landscape img { height: 120px; width: 180px;}

#options-bar {  width: 100%; margin-bottom: 0em;}
td.options-box { padding: .2em .3em .2em .3em; background: #B4B4B4/*grey8*/; text-align: center; 
border: 0.2em; border-style: outset; border-color: #FFFFFF;}

#search-bar {  width: 100%; background: #DDDDDD/*grey3*/;border:0.3em; border-style: ridge; border-color: #FFFFFF; margin: 0; padding:0; }
#search-bar td{ padding: 0 1.2em; background: #C0C0C0/*grey6*/; border: 0.2em; border-style: outset; border-color: #FFFFFF}
#search-bar td.search-caption { padding: 0.2em; border:0; background: transparent; font-size: 1em; font-weight: bold; }

#sub-gallery-bar {  width: 100%; margin: 0 0 .1em 0; padding: 0; text-align: center; font-size: 1em; }
#sub-gallery-bar td.options-caption { text-align: left; font-weight: bold; vertical-align: bottom; } 
#sub-gallery-bar td.sub-gallery-tab { vertical-align: top; }
#sub-gallery-bar td.sub-gallery-tab div {  height: 1.6em; background: #DDDDDD/*grey3*/; position: relative; top: -0.2em;
padding: 0.3em 0.3em 0 0.3em;width: 17em; border-width: 0 0.3em 0.3em 0.3em; border-style: ridge; border-color: #FFFFFF; }
#sub-gallery-bar td.sub-gallery-tab div select {position: relative; top: -0.2em}

#search-bar td.no-javascript-go-button, #sub-gallery-bar td.no-javascript-go-button { border-width:0; background:transparent;padding:0}
.no-javascript-go-button input { margin: 1em 2em 0 0; padding:0.5em;}

input#add-by-id {height: 1em; width: 30em; }
input#add-by-id-go {height: 1em; width: 2em;}
html>body input#add-by-id-go {height: auto;} 	 /* correction fort non-IE6 - needs checking for IE7 */	

/* Photo-page - general formatting */ 	 	 	
#pp-photo-menu-top { vertical-align: top; padding-top: 0; padding-left: 0.2em; padding-bottom: .1%;}	
#pp-photo-menu-top p {margin: .8em 0 .8em 0;}	
#pp-photo-menu-middle { padding:  0;}
#pp-photo-menu-middle p { width: 11em; vertical-align: middle; text-align: center; padding: 6px;  background: #C0C0C0;/*grey6*/ margin: 0 auto 0 0; 
				border: 2px; border-style: outset; border-color: #FFFFFF ; }
#pp-photo-menu-bottom p {	margin: .5em 0 .8em 0;}	
#pp-photo-menu-bottom { vertical-align: bottom; padding-left: 0.2em; padding-top: .1%;}	
#pp-photo-menu-bottom .wishlist-box { width: 12em; padding: .4em 0; background: #C0C0C0/*grey6*/; margin-left: 0; 
			border: 0.2em; border-style: outset; border-color: #FFFFFF ; }
.pp-buying-panel {border: 0.2em inset #FFFFFF ; background: #D7D7D7/*grey4*/; padding: .2em 0 .1em 0.2em; } 
.pp-buying-options { padding: .2em 0; font-size: 1.3em; margin: 0 0 0 1em; }
.pp-buying-options * { font-size: 1em; } /* fix for Netscape7 */

.pp-photo-caption, .pp-photo-caption a:visited, .pp-photo-caption a:link,  .pp-photo-caption a:active { text-decoration:none; color:#000000; background:transparent;  cursor: text; }
h3.pp-photo-caption { font-size: 1em;margin: 0 0 0 0;padding: 0; text-align: center;}	  
.pp-buying-panel .pp-buying-links p { margin: 1.2em .8em ;}


#pp-unmounted { text-align: center; }

/* #pp-unmounted img.pp-photo, #pp-unmounted a:link img.pp-photo, #pp-unmounted a:visited 	img.pp-photo, 
	#pp-unmounted a:active img.pp-photo, #pp-unmounted a:hover img.pp-photo 
		{ border: 2px groove #ffffff; }  /* border for unmounted photo */ 
 	 	 	 
/* Photo-page:  mount stuff  */ 

.pp-mounted-caption {  color: #C0C0C0/*grey6*/; font-family: "comic sans ms", cursive; font-style: italic; 
						word-spacing: -1pt; width: 75%; text-align: left; vertical-align: top; } /* size indep for both dark/white mounts */
#pp-mounted 	  .pp-mounted-caption { font-size: 9pt; line-height: 11pt; } 
#pp-mounted-small .pp-mounted-caption { font-size: 7pt; line-height: 9pt; }

td.signature { vertical-align: top; text-align: right; border-width: 0; }	 
/* #pp-mounted-small td.signature { width:25%; height: 30px;  }  DONT THINK THIS IS NEEDED ? DL 17/10/06 */

td.signature img { margin-right:0; margin-bottom:0; text-align: right; border-width: 0; }
#pp-mounted td.signature img { margin-top: 3px; } 
#pp-mounted-small td.signature img { margin-top: 3px; } 

.pp-dark-mount img.pp-photo	{ border-style: solid; border-color: #ffffff; }  /* plain white rebate for dark mount */
.pp-white-mount img.pp-photo { border-style: inset;  border-color: #ffffff; }  /* inset rebate for white mount */
a:hover img.pp-photo 		{ border-style: groove; border-color: #ffffff; }
#pp-mounted 		img.pp-photo { border-width:2px; }
#pp-mounted-small 	img.pp-photo { border-width:1px }
.pp-bw	.pp-dark-mount { background: #3B3B3B; }  /* mount-colour for black and white */
.pp-sep	.pp-dark-mount { background: #423935; }  /* mount-colour for sepia */	
.pp-white-mount { background: #FFFFF7; }  /* mount-colour for white */

#pp-portrait 	#pp-photo-cell{ text-align: right; 	width: 	490px; 	}	/*	slot into which portrait photo fits					*/	

/* Photo-page: image sizes for "full-size" pages, using "fs" images for unmounted, smaller "ms" images for mounted. */
/* Should match the actual image size (ie no scaling) - however, specifying them may speed page layout in browser. */
/* COMMENTED OUT 'COS MESSES UP SMALL POPUP
/*	 #pp-landscape 	#pp-unmounted 	img.pp-photo	{ 	width: 	600px; 	}  	/* 	size of unmounted "fs" landscape photo (height varies)	*/			
/*	 #pp-portrait	#pp-unmounted 	img.pp-photo	{ 	height: 600px; 	} 	/* 	size of unmounted "fs" portrait photo (width varies)	*/
/*	 #pp-landscape 	#pp-mounted 	img.pp-photo   	{ 	width: 	435px; 	} 	/*	size of landscape photo "ms" in mount (height varies)	*/ 	
/*	 #pp-portrait 	#pp-mounted		img.pp-photo 	{ 	height: 435px; 	} 	/*	size of portrait photo "ms" in mount (width varies)	*/	 

/* Photo-page: size-dependent mount-sizes for "full-size" (using "ms" images unscaled) */
#pp-landscape	#pp-mounted { 	height: 484px;	width: 	604px;  }  	/* 	size of landscape mount (fixed)						*/	 
#pp-portrait 	#pp-mounted { 	width:	484px; 	height: 609px;  } 	

/* Photo-page: detail-view stuff - designed to match mounted photo size */
#pp-landscape 	#pp-detail-view { height: 484px;  width: 604px; background: #B0B0B0; text-align: center; }
#pp-portrait 	#pp-detail-view {  width: 484px; height: 609px; background: #B0B0B0; text-align: center; }
#pp-detail-view  span 	{ font-size: 1.3em; }
#pp-portrait 	#pp-detail-view img.pp-photo{ 	height: 550px; width: 420px; }
#pp-landscape 	#pp-detail-view img.pp-photo{ 	height: 420px; width: 550px; } 
#pp-landscape 	#pp-detail-view img.pp-photo:hover { border-style: groove; }
#pp-detail-view .pp-detail-caption { font-weight:bold; line-height: 1.6em; margin-top: .5em;}

#pp-landscape 	#pp-context-imagebox img.pp-photo{ 	height: 420px; width: 600px; margin:0; } 
#pp-portrait 	#pp-context-imagebox img.pp-photo{ 	height: 550px; width: 380px; margin:0; } 
#pp-landscape   #pp-context-imagebox { margin:auto; height: 420px; width: 600px;  position: relative; }
#pp-portrait   	#pp-context-imagebox { margin:auto; height: 550px; width: 380px;  position: relative; }  
 
#pp-landscape 	.pp-context-box img { height: 14%; width:12%; margin:0; display: block;  position: absolute; border: 1px solid red; }   
#pp-portrait  	.pp-context-box img { height: 12%; width:14%; display: block;  position: absolute; border: 1px solid red; }   
#pp-detail-view .pp-context-box span { display: block; position: absolute; margin:2%; font-size: 2em; color: red; text-decoration:none; }   

#pp-detail-view .pp-context-box a:hover img { border-width:2px ; background:transparent; } 
 
#pp-landscape 	#pp-context-box1 img, #pp-context-box1 span { left: 44%;top: 43%; }   
#pp-portrait 	#pp-context-box1 img, #pp-context-box1 span { left: 43%;top: 44%; } 
#pp-context-box2 img, #pp-context-box2 span{ left: 25%;top: 25%; }   
#pp-context-box3 img, #pp-context-box3 span{ right: 25%;top: 25%; }   
#pp-context-box4 img, #pp-context-box4 span { right: 25%;bottom: 25%; }   
#pp-context-box5 img, #pp-context-box5 span { left: 25%;bottom: 25%; }   

/* Photo-page: small-mounted stuff - uses scaled "ms" images */ 
#pp-landscape	#pp-mounted-small 	{ 	height: 358px;	width: 	443px; margin: auto; } 	/* 	size of landscape mount (fixed)						*/	 	  
#pp-portrait 	#pp-mounted-small	{ 	width:  358px; 	height: 443px; margin: auto; } 	/* 	size of portrait mount (fixed)						*/
#pp-landscape 	#pp-mounted-small 	img.pp-photo{ 	width: 	315px; 					} 	/*	scaled size of landscape "ms" photo in mount (height varies)	*/ 
#pp-portrait 	#pp-mounted-small	img.pp-photo{ 	height: 315px; 					} 	/*	scaled size of portrait "ms" photo in mount (width varies)		*/	 

body.pp-popup { height: auto; min-height: 10px; width:auto; min-width: 10px;  text-align: center;} /* let browser fit size to photopage popup */
body.pp-popup#pp-landscape #pp-detail-view, body.pp-popup#pp-portrait #pp-detail-view {  text-align: center;width:auto; height: auto; margin:auto; background: transparent; }
body.non-photo-product-popup { height: auto; min-height: 10px; width:auto; min-width: 10px; text-align: center; }  /* let browser fit size to photopage popup */

/* Photo-page: message line format */
#messageline { background: #E6E6E6/*grey2*/;  margin: .5em 0 0 0; text-align:center;} 
 
div.copyright-notice { margin-left:2em; }

/* Shopping Basket & checkout */

#sb-table {  width: 100%; border:0.2em inset #FFFFFF; text-align: center; font-size: 1.2em; background: #BBBBBB/*grey7*/; }  
#sb-table thead,tfoot { background-color: #E6E6E6/*grey2*/; font-weight: bold; }   
#sb-table tbody { background-color: #DDDDDD/*grey3*/;}   
#sb-table td { border-width :0.2em;  border-style: solid; border-color: #BBBBBB/*grey7*/; }  
#sb-table       img   { display: block; margin-left: auto; margin-right: auto; height: 5em; border-width: 0.2em; }
#sb-table a:link    img   { border-color: #FFFFFF; border-style: outset; }
#sb-table a:visited img   { border-color: #FFFFFF; border-style: outset; }
#sb-table a:active  img   { border-color: #FFFFFF; border-style: groove; }
#sb-table a:hover   img   { background: transparent; border-color: #FFFFFF; border-style: groove;} 
#sb-table div.sb-sizes-note    { margin: 0; font-size: .75em; vertical-align: middle; text-align: center; }
#sb-table span.sb-warn-outofstock   { font-size: .8em; font-weight: bold; vertical-align: middle;}
#sb-table td.sb-total { text-align: right; padding: 0 .4em 0 .4em; }
#sb-table td.sb-item {padding: 0.2em; }
#sb-table td.sb-details { width: 25em; padding-right: 1em; }
#sb-table td.sb-qty { padding-left:1em; padding-right:1em; }
#sb-table td.sb-qty input { text-align: center; width:3em; height:auto; }
#sb-button-bar td {width: 20%; text-align: center; padding: 1em 1em 0 1em; }
#sb-button-bar input { padding: 0.3em 0; width: 12em; font-size: 1.1em; font-weight: bold }
#sb-button-bar input.sb-discount  { background: #C5CDC1; border: 0.1em solid #AAAAAA; text-align:center; font-weight: normal; font-size: 0.9em;}
#sb-button-bar input.sb-delivery-override  { background: #D3C9C3; border: 0.1em solid #AAAAAA; text-align:center; font-weight: normal; font-size: 0.9em;}
#sb-options-bar { border-style: inset; border-width: 0 0.1em 0.1em 0.1em; border-color: #FFFFFF;
background: #E0E0E0; padding: .1em 0 .1em .3em; font-size: 1.2em; 
text-align: center; width: 90%; margin: auto }

/* price table */
.pricetab { width: 100%; border:0.2em outset #FFFFFF;  margin: 0 0 1% 0;  border-collapse: collapse; }   
.pricetab td { border: 0.2em solid #BBBBBB; padding: .2em; font-size: 1.2em; text-align: center;   background: #DDDDDD/*grey3*/;}  
.pricetab th { text-align: left; background: #E6E6E6/*grey2*/;}  
.pricetab tr.sp-even-row td { background: #DDDDDD;   height: 3em;}  
.pricetab tr.sp-odd-row td {  background: #E6E6E6;   height: 3em;}
.pricetab tfoot p { font-weight: normal; text-align: left; font-size: 0.9em; margin: .5em 1em .5em 1em;}
.pricetab td.ps-size-header { font-weight: normal; font-size: 1.2em; }	
.pricetab td.bw-column 	{ width: 10%; border-right: 0.1em solid #BBBBBB; padding: 0; }
.pricetab td.sep-column	{ width: 10%;  border-left: 0  none  #BBBBBB; padding:0; }
.pricetab td div { text-align: right; padding-right: 1em;}
.pricetab td.printsize-column	{ width: 12% }
.pricetab td.matsize-column		{ width: 12% }
.pricetab td.sizecode-column	{ width: 5%; }

/* non-photo buying-button */
input.buy-button { background: #C5CDD7; font-weight: bold; margin:0; cursor: pointer; padding:0 0.5em;}
input.buy-button:hover { background: #C4D8F0; }

input.paypal-button { padding: .6em; background: #C5CDD7; border: .2em outset #FFFFFF; }
input.paypal-button:hover { background: #C4D8F0; } /* buttons glow under cursor */

/* non-photo buying page (popup) */
.bp-image 			img	{  border-width: 2px; border-color: #FFFFFF; border-style: outset; }
.add-to-basket-button 	{ text-align: center; width: 9em; padding: .1em; font-size: 1.1em; font-weight: bold; border-width:4px; }

/* postcards */
#postcard-gallery { width: 100%; padding: 0; border:0.3em; border-style: ridge; border-color: #FFFFFF; text-align: center; font-size: 1em; }
#postcard-gallery td { padding: 10px 0 5px 0; }