

/* 2002: was 20-20-a0 */
/* Include all style for (public) shop pages, not puzzle-specific */
/* Include new style stuff for 2008 redesign */

BODY {
	background-color: #e0e0e0;
	background: url("../graphics/grey2.jpg");
}

h1 {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 1.5em;
	text-align: center;
	color: #0040b0;
	margin: 0.2em auto 0.5em;
	padding: 0;
}

H1.j {
	font-family: sans-serif;
	font-size: 2.5em;
	text-align: center;
	color: #0040b0;
	margin: 0.2em auto 0.5em;
}

P.preh1 {	/* line before main heading */
	font-family: garamond, palatino, serif;
	font-style: italic;
	font-size: 1.3em;
	text-align: center;
	color: #002080;
	margin: 0.5em 0 -0.2em;
	padding: 0;
}

P.preh1j {	/* line before main heading */
	font-size: 1.3em;
	text-align: center;
	color: #002080;
	margin-bottom: -0.2em;
}

P.posth1 {	/* 'tag' line after main heading */
	font-family: garamond, palatino, serif;
	font-style: italic;
	font-size: 1.1em;
	text-align: center;
	color: #002080;
	margin-top: -0.2em;
}

h2 {font-family: Helvetica, Arial, sans-serif; text-align: center; color: #0040b0; clear: both; }
h3 {font-family: Helvetica, Arial, sans-serif; text-align: center; color: #0040b0; clear: both; }
h3.j { font-size: 1.5em; }


h4 {
	font-family: Helvetica, Arial, sans-serif;
	color: #0040b0;
	margin-top: 1.2em;
	margin-bottom:0.5em;
}



h5 {font-family: Helvetica, Arial, sans-serif; color: #0040b0; clear: left; }
h6 {font-family: Helvetica, Arial, sans-serif; color: #0040b0}

DIV.main {
	margin-left: 4%;
	margin-top: 1em;
	margin-bottom: 1em;
	width: 92%;
}

DIV.footer {
	margin-top: 1em;
	margin-left: 4%;
	width: 92%;
}

UL { list-style-image: url("../graphics/bullet.gif"); }

SPAN.bignum {font-family: Helvetica, Arial, sans-serif; font-size: 150%; color: #000080}

.red { color: #a02000; }

.inline {	/* forms etc: remove spurious spacing */
	display: inline;
	margin: 0;
	padding: 0;
}


/* "blurb" - slightly fancy bits: shop.htm, contxxx.htm etc. */
DIV.blurb P { font-family: Helvetica, Arial, sans-serif; color: #303070; margin-top: 1em; }
DIV.blurb LI { font-family: Helvetica, Arial, sans-serif; color: #303070; margin-top: 1em; }

/* Splash boxes - phase out separate TD version */
TD.splashtop {
	color: #ffffff;
	background-color: #a04000;
	text-align: center;
	font-family: Helvetica, Arial, sans-serif;
	padding: 0.2em;
}

TD.splashtext {
	color: #606060;
	background-color: #ffffe0;
	font-family: Helvetica, Arial, sans-serif;
	padding: 0.5em;
	font-size: smaller;
}

TABLE.splash TH {
	color: #ffffff;
	background-color: #a04000;
	text-align: center;
	font-family: Helvetica, Arial, sans-serif;
	font-weight: bold;
	padding: 6px;
}

TABLE.splash TD {
	color: #606060;
	background-color: #ffffe0;
	text-align: left;
	font-family: Helvetica, Arial, sans-serif;
	padding: 6px;
	font-size: smaller;
}

/* general-purpose grid-positioning, positioned left, as list */
TABLE.noframe {
	margin: 0.4em auto 0.4em 0.4em;
	border: none;
	padding: 0;
}

TABLE.noframe TD {
	margin: 0;
	border: none;
	padding: 0.2em 0.5em;
}

/* general-purpose: <p> with middled images */
P.middled IMG {
	vertical-align: middle;
}


/* small centred "Note:" style paragraph */

DIV.breaknote {
	background-color: #e0e0f8;
	color: #000000;
	margin: 1em 20%;
	border-top: solid 3px #0040b0;
	border-right: none;
	border-bottom: solid 3px #0040b0;
	border-left: none;
	padding: 0.5em 2em;
}

DIV.breaknote P {
	font-size: 1.5em;
	text-align: center;
	font-family: garamond, palatino, serif;
	font-style: italic;
}


DIV.announce {
	margin: 0.5em;
	border: solid 2px #c00000;
	padding: 5px 1em;
	color: #203028;
	background-color: #f0f0f0;
	font-family: Helvetica, Arial, sans-serif;
}

DIV.announce P {
	margin: 0.5em 0;
	padding: 0;
	border: none;
}

DIV.announce H5 {
	color: #0040b0;
	margin: 0.2em 0;
	padding: 0;
	border: none;
	font-family: Helvetica, Arial, sans-serif;
	font-weight: bold;
	font-size: 1.2em;
}

DIV.announce EM {
	color: #0040b0;
	font-family: serif;
	font-weight: bold;
	font-style: italic;
}

DIV.illust {text-align: center; font-size:smaller; font-family: Helvetica, Arial, sans-serif;}

DIV.signpost {
	font-size: smaller;
	font-family: Helvetica, Arial, sans-serif;
	padding: 0 4px 6px;
	border-bottom: 1px solid #404040;
	margin:0;
}

DIV.bskt {
	font-size: smaller;
	font-family: Helvetica, Arial, sans-serif;
	text-align: center;
	padding: 0;
	border: 1px solid #000000;
	margin:0;
}

DIV.bskt H5 {
	color: #f8f8ff;
	background-color: #0040b0;
	margin:0;
	padding: 4px 4px 0.1em;
}

DIV.bskt P {
	color: #0040b0;
	background-color: #f8f8ff;
	margin:0;
	padding:0.1em 4px 4px;
}



/* header line with links to bits of the current page */
P.pageguide {
	font-style: italic;
	font-family: serif;
	clear: both;
}

P.phnote {font-size:smaller; font-family: Helvetica, Arial, sans-serif; color: #404040; }

/* 2002: #60-60-a0 */
DIV.puzdat {font-size:smaller; font-family: Helvetica, Arial, sans-serif; color: #805050; clear: left; margin-top: 1em; }
DIV.puzdatc {font-size:smaller; font-family: Helvetica, Arial, sans-serif; color: #805050; margin-top: 1em; }
DIV.puzdatr {font-size:smaller; font-family: Helvetica, Arial, sans-serif; color: #805050; clear: right; margin-top: 1em; }
/* Phase out puzdatr? 'c' (centre) version doesn't clear anything. */

DIV.puzdat SPAN.was, DIV.puzdatc SPAN.was 	/* cross-out prices */
{	color: #ff0000;
	text-decoration: line-through;
}

DIV.puzdat SPAN.offer, DIV.puzdatc SPAN.offer	/* emphasise */
{	color: #ff0000;
}

/* Doesn't work because of floats! */
UL.sfx {
	list-style-type: none;
	list-style-image: none;
border: solid 1px red;
	margin: 0 0 0 20px;
	padding: 0;
}

UL.sfx LI {
	margin: 2px 0 2px 4px;
	padding: 0;
border: solid 1px black;
	background-image: url("../graphics/bullet.gif");
	background-repeat: no-repeat;
	background-position: 0 0;
	font-size:smaller;
	font-family: Helvetica, Arial, sans-serif;
	font-weight: bold;
	color: #b01070;
}

P.sfx {
	margin: 3px 0 3px 4px;
	padding: 0;
	border: none;
	font-size:smaller;
	font-family: Helvetica, Arial, sans-serif;
	font-weight: bold;
	color: #b01070;
}

P.sfx IMG {
	vertical-align: middle;
}

/* Float right version (hidden from ns4) */
DIV.shopsignr {text-align: center; font-size:smaller; font-family: Helvetica, Arial, sans-serif;}

SPAN.note {text-align: left; font-size:smaller; font-family: Helvetica, Arial, sans-serif; color: #a06060;margin-top: 0}

DIV.warn {
	color: #ff0000;
}

/* Thumbnails - for acknowledgement page */
/* *** CAN NOW USE thumbs !!! */
TABLE.ackthumbs TD {
	text-align: center;
}

/* Thumbnails - (was order form: now centred, everywhere) */
TABLE.thumbs TD {
	text-align: center;
}

TABLE.thumbs TH {
	font-family: helvetica, arial, sans-serif;
	font-weight: normal;
	color: #0040b0;
}

/* original Thank you message */
DIV.msg {text-align: center; font-size:large; font-family: garamond, palatino, serif; font-style: italic; padding: 15px; margin: 20px; border: black solid 1px; background-color: #e0e0e0}

P.msg {
	text-align: center;
	font-size: 2em;
	font-family: garamond, palatino, serif;
	font-style: italic;
	margin-top: 50px;
	color: #0040b0;
}

/* FAQ */
P.q {font-style: italic; font-weight: bold; color: #a02000; margin-bottom: 0; }
P.a {margin-top: 0}


/* Forms for database etc. */
DIV.pform {
	background: #e0e0e0;
	border: solid 2px #0040b0;
	margin-left: 10%;
	margin-right: 10%;
	padding: 0.5em 5% 0.5em;
}


/* Styles for artist descriptions */
IMG.a_samp {
	float:right;
	border: solid 2px #ffffff;
	margin: 0 0 0.5em 1em;
}

IMG.a_sign {
/*	float:left; ** WHY? */
	border: solid 1px #000000;
	margin: 0 1em 0.5em 0;
}

H4.a_theme {
	clear:both;
	background: url(img/artscrl.jpg) repeat-y;
	text-align: left;
	background-color: #ffffff;
	color: #404040;
	border-top: ridge 2px #ffb010;
	border-left: solid 1px #ffffff;
	border-right: none;
	border-bottom: none;
	padding: 6px 6px 6px 75px;
}

H4.a_girl {
	clear:both;
	background: url(img/artscrlr.jpg) repeat-y;
	text-align: left;
	background-color: #fff0f0;
	color: #b02020;
	border-top: solid 1px #b02020;
	border-left: solid 1px #fff8f8;
	border-right: none;
	border-bottom: none;
	padding: 6px 6px 6px 75px;
}

H4.a_boy {
	clear:both;
	background: url(img/artscrlb.jpg) repeat-y;
	text-align: left;
	background-color: #f0f0ff;
	color: #2020b0;
	border-top: solid 1px #2020b0;
	border-left: solid 1px #f8f8ff;
	border-right: none;
	border-bottom: none;
	padding: 6px 6px 6px 75px;
}

DIV.a_signature {
	float: left;
	text-align:left;
	font-size:smaller;
	font-family: Helvetica, Arial, sans-serif;
	margin: 0;
	padding: 0 10px 0 0;
	border-right: 1px solid #000000;
}

DIV.a_signature IMG {
	text-align:center;
}


/* ------ special offer page --------- */
DIV.niwari {
	margin: -2em 1em 1em;
	border: none;
	padding: 0;
	float:right;
	width: 250px;
	text-align: center;
}

DIV.niwari IMG {
	border: none;
	padding: 0;
	margin: 0 10px 10px;
}

DIV.niwari P {
	font-family: Helvetica, Arial, sans-serif;
	color: #303070;
	margin: 0.2em;
}


/* ---------- pageptr: thumbnail guides to pages ------------- */

DIV.pageptr {
	margin: 0 0 1.5em;
	border: none;
	padding: 0;
}

DIV.pageptr h5 {
	margin: 0 0 -60px;
	border: none;
	border-top: solid 2px #0040b0;
	padding: 0.3em 1em 65px;
	background-color: #f0f0f0;
	color: #0040b0;
	font-family: Arial, sans-serif;
	font-size: 1.2em;
	text-align: left;	
}

DIV.pageptr P {
	margin: 0.2em 0 -60px;
	border: none;
	padding: 0 1em 65px;
	border: none;
	background-color: #f0f0f0;
	font-family: Arial, sans-serif;
	font-size: 1em;
	text-align: left;	
}

DIV.pageptr P.fail {
	margin: 0.2em 0 0;
	border: none;
	padding: 0 1em 0.5em;
	border: none;
	font-family: Arial, sans-serif;
	font-size: 1em;
	text-align: left;	
}

DIV.pageptr TABLE.boxes {
	margin: 0;
	border: none;
	padding: 0;
	width: 98%;
}

DIV.pageptr TD.boxes {
	width: 24%;
	vertical-align: top;
}


TABLE.pageptrstats {
	margin: 1em auto 0.5em 1em;
	border: none;
	border-right: solid 2px #606060;
	border-spacing: 0;
	padding: 5px 5px 20px 5px;
	background-color: #c8d8ff;
}

TABLE.pageptrstats TH {
	margin: 0;
	border: none;
	padding: 4px 0;
	text-align: right;
	color: #404040;
	font-family: Arial, sans-serif;
	font-weight: bold;
	font-size: 0.9em;
}

TABLE.pageptrstats TD {
	margin: 0;
	border: none;
	padding: 1px;
	color: #707070;
	font-family: Arial, sans-serif;
	font-size: 0.8em;
	font-weight: bold;
	text-align: left;
}

TABLE.pageptrstats TD.label {
	text-align: right;
	width: 8em;
}

/* should be a div, but using table for now... */
DIV.pageptr TD.pageptrthumb {
	margin: 1em;
	border: none;
	padding: 4px auto;
	width: 24%;
	text-align: left;
	color: #606060;
	font-family: Arial, sans-serif;
	font-weight: bold;
	font-size: 1.2em;
	text-align: left;
}

DIV.pageptr TD.pageptrthumb P {
	margin: 2px auto 2px 8px;
	border: none;
	padding: 0;
	color: #606060;
	background-color: transparent;
	font-family: Arial, sans-serif;
	font-weight: bold;
	font-size: 1.2em;
	text-align: left;
}

/* mfrcat : mfr catalog specifics */
/* Opera bug? DELETE: border-collapse: collapse; */

TABLE.mfrbicons {
	margin: 0.5em auto 0.5em 0;
	border: 1px solid #0040b0;
	padding: 10px;
	background-color: #ffffff;
}

TABLE.mfrbicons TD {
	border: none;
	padding: 0;
	vertical-align: top;
}

TABLE.mfrbicons TABLE.noframe TD {
	margin: 0;
	border: none;
	padding: 0.5em;
}

TABLE.mfrbicons TD.icon {
	text-align: right;
}

TABLE.mfrbicons TD.expl {
	text-align: left;
}
/* outer table for showing mfr icons (same as mfrbicons!) */
/* Opera bug? DELETE: border-collapse: collapse; */

TABLE.mfricons {
	margin: 0.5em auto 0.5em 0;
	border: 1px solid #0040b0;
	padding: 10px;
	background-color: #ffffff;
}

TABLE.mfricons TD {
	border: none;
	padding: 0;
	vertical-align: top;
}

TABLE.mfricons TABLE.noframe TD {
	margin: 0;
	border: none;
	padding: 0.5em;
}

TABLE.mfricons TD.icon {
	text-align: right;
}

TABLE.mfricons TD.expl {
	text-align: left;
}

