﻿/* Master Stylesheet for cherigloverartist.com
   New site design, April 2011
   Copyright ©2009-2011 Will Fastie. All Rights Reserved. 
*/
/* Fastie Systems CSS Reset - modified from Eric Meyer's Browser Reset v2, January 2011
	 http://meyerweb.com/eric/tools/css/reset/, v2.0 | 20110126, License: none (public domain)
   -- Don't forget to set a foreground and background color on the 'html' or 'body' element! 
*/
html, body, div, span, applet, object, iframe,
/* 18 Oct - I need to understand the difference between native and reset for the Hs and Ps - I should reset and redefine */
/* h1, h2, h3, h4, h5, h6, p, */ 
blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
/* I don't like to reset lists - set definitions in classes if resets are needed */
/* dl, dt, dd, ol, ul, li, */
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1.2;
}
ol, ul {
	/* list-style: none; */ /* I don't like to reset lists */
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after, /* 18 Oct 2009 - I don't understand this one */
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/* Fastie Additions and Overrides to the Reset */
a img, :link img, :visited img { border: 0; } /* This one is very useful - should it expand to incude :hover? */
a { outline: none; } /* Removes annoying IE behavior */
/* These just reinforce what most tools do by default anyway - belts & suspenders */
em { font-style: italic; }
strong { font-weight: bold; }
.underline { text-decoration: underline; }
/* End of reset --------------------------------------------------------------------- */

/* Generic Classes ------------------------------------------------------------------ */
.clearfix { display: inline-block; clear: both; }
.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.clearboth { clear: both; }
.clearleft { clear:left; }
.centerme { text-align: center; }
.nospacing { margin:0; padding:0; }
.nobottom { margin-bottom: 0; padding-bottom: 0; }
.indentme { padding-left: 3em; }  
.monospace { font-family: "Courier New", Courier, monospace; }
.strikethru { text-decoration: line-through; }
.tooltip-definition {  border-bottom-width: 1px; border-bottom-style: dashed; }
.inline { float: none; }

.image-left  { float: left;  margin-right: 15px; margin-bottom: 5px; }
.image-right { float: right; margin-left:  15px; margin-bottom: 5px; }
.img-border { border: 2px #062a5e solid; }
.img-border1 { border: 1px #062a5e solid; }
.img-noborder { border: 0; }

.fineprint { font-size: 75%; font-style: italic; }
.sup { vertical-align: super; font-size: 75%; }
.markred { color: red; }
.req-fld { font-weight: bold; color: maroon; }
.hfvis { display: none; visibility: hidden; }

/* These styles are empty but they are listed so they will show up in EW's lists */
.png-fix {  }
.hovereffect { }

/* Debugging (duplicate of that contained in admin.css) ----------------------------- */
.echo-debug-message { padding: 3px; background-color: #ffc; border: 1px dashed red; color: #009; font-family: monospace; font-weight: bold; }
.echo-debug-heading { color: red; }

/* Site Standards ------------------------------------------------------------------- */
body {
	background-color: #ddd;
	background-image: url('../img/background-tile.jpg');
	font-family: "Courier New", Courier, monospace;
	color: #000; /* black */
	font-size: 100%; 
}
body p { line-height: 1.2; }

/* Standard Headers */
h1, h2, h3, h4, h5, h6 { font-family: "Courier New", Courier, monospace; 
	color: #306181;
  font-weight: bold;
	padding-bottom: 0;
	margin-bottom: 0;
}
h1 { font-size: 36px; text-align: center; }
h2 { font-size: 30px; } 
h3 { font-size: 28px; } 
h4 { font-size: 24px; }
h5 { font-size: 24px; font-style: italic; }
h6 { font-size: 24px; text-decoration: underline; }
h2+p, h3+p, h4+p, h5+p, h6+p { margin-top: 2px; padding-top: 0; }
h2+ul, h3+ul, h4+ul, h5+ul, h6+ul { margin-top: 2px; padding-top: 0; }

/* Everyday Links */
a         { color: #444; }
a:visited { color: #444; }
a:hover, a:visited:hover { color: #ff560b; }

/* Site Layout ====================================================================== */

/* Centering, Outermost Container - holds the outer container and the footer */
.cc { 
  width: 900px;
  margin: 0 auto;
  padding-bottom: 8px;
}
/* Outer Container */
.oc { 
  width: 900px;
}
/* Inner Container - holds the bulk of the site */
.ic { position: relative; 
	width: 900px; 
	margin: 0;
	padding: 0;
	/*background-color: #306181;*/
}
.content-container { position: relative;
	margin: 0;
	padding: 0; padding-bottom: 15px;
}
/* Nav */
.nav { position: relative; 
	width: 100%; overflow: visible;
	height: 83px;
	/*background-color: black; background-color: #231f20;*/
	font-family: "Courier New", Courier, monospace;
	font-size: 24px;
	font-weight: bold;
	color: #606060;
}
.nav-home-only { position: absolute; left: 0; top: 35px;
	padding-left: 25px;
	padding-top: 10px;
}
.nav-other { position: absolute; right: 0; top: 35px;
	text-align: right;
	padding-right: 30px;
	padding-top: 10px;
}
.nav a { 
	text-decoration: none;
	color: #606060;
	/*padding: 8px 0px 9px 0px;*/
	padding: 0 6px 0 6px;
	margin: 0;
}
.nav a:visited { color: #606060; }
.nav a:hover, .nav a:visited:hover { background-color: #c8eef3; }
.nav a.active { background-color: #c8eef3; }

/* Top Banner */
/* The top banner overlays the top area of the content but it also must somehow force content below it while
   allowing the background to show through
*/
/*.signature-banner { position: absolute; top: 3px; left: 130px;*/
.signature-banner { position: absolute; top: 3px; left: 40px;
	z-index: 200;
}
.site-name-banner { position: absolute; top: 0px; right: 55px;
	z-index: 200;
	font-size: 34px;
	font-weight: bold;
	color: #231f20;
}
.home-page-background { position: relative;
	width: 869px;
	height: 665px;
	background-image: url('../img/art-background.png'); background-repeat: no-repeat;
	margin: 0 15px 0 16px;
	padding: 0;
}
.home-page-background img { display: block;
	margin: 0; padding: 0; border: 0;
}
.slide-show { 
	position: absolute; 
	top: 30px; left: 30px;
}

.slide-show-placeholder { position: absolute; top: 60px; left: 149px; }
.slide-show-placeholder img { border: 2px #f3480c solid; }
.placeholder-coming-soon { position: absolute; top: 280px; left: 260px; z-index: 999;
	font-size: 40px;
	font-style: normal;
	font-weight: bold;
	color: #ff560b;
}
.space-check {
	position: absolute; top: 30px; left: 30px;
	width: 807px; height: 603px;
	border: 1px silver dashed;
}

.tb { position: relative; display: block; 
	height: 100px;
	margin: 0; padding: 0;
	background-image: url('../img/topanner.jpg');
	background-repeat: no-repeat; 
	z-index: 100;  /* IE7 */ 
}
.site-slug { position: absolute; left: 0; bottom: 50px;
	width: 900px;
	text-align: center;
	font-size: 2.5em;
	color: #ff8;
	font-family: "Times New Roman", Times, serif;
	font-style: italic;
}

.content-container-text {
	margin: 0 15px 0 16px;
	padding: 0;
/*	background-color: white;
	background-image: url('../img/text-background-top.jpg'); background-repeat: no-repeat;*/
}
.content { position: relative;
	padding: 15px 20px 15px 20px;
	font-family: "Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Arial, sans-serif;
	font-size: 20px;
	color: #7f7d7d;
}
.broken-horz-rule {
	width: 900px; /* site width */
	height: 18px; /* line.png height */
	background-image: url('../img/line.png');
	background-repeat: no-repeat;
	background-position: center center;
}

/* ----- Footer (in cc) ---------------- */
.ft { position: relative;
  font-size: 1em; color: black;
  padding-bottom: 25px;
  text-align: center;
} 
.ft p { line-height: 1.1;
	margin: 0;
	padding: 0;
}
.ft a, .ft a:visited { 
	color: black; color: #111;
	text-decoration: none; 
	padding: 0 6px 0 6px;
}
.ft a:hover, .ft a:visited:hover, .ft a.temp:hover {
	background-color: #c8eef3; 
}

/* Site Styles */

/* Layout for the Generic Thumbnail table used to display standard square thumbnails, 3 to a row */
.thumbnail-table {
	margin: 8px auto;
	border-collapse: collapse;
}
.thumbnail-table td {
/*	width: 208px;*/
	width: 192px;
/*	padding: 15px 40px 10px 40px;*/
	padding: 15px 43px 10px 42px;
}
.thumbnail-table td {

}
div.painting-container { position: relative;
	height: 208px; width: 208px; /* sized to fit the background precisely */
	height: 194px; width: 194px; /* sized to fit the background precisely */
/*	background-image: url('../img/thumb-background.png');
	background-repeat: no-repeat;
	background-position: center center;*/
	background-color: white;
	margin: 0;
}
div.painting-container.hovereffect:hover {
/*	background-image: url('../img/thumb-background_hov.png');*/
	background-color: #C7EDF3;
} 
div.painting-container img {
/*	margin: 14px;*/
	margin: 7px;
}
div.painting-container .product-buy-now-button-temp {
	font-size: 20px;
	font-weight: bold;
	text-align: center;
	margin: 0;
	padding: 0 0 0 14px;
}

.painting-name {
	text-align: center;
	font-size: 24px;
	font-weight: bold;
	color: #606060;
	margin-top: 3px;
	padding-top: 0;
	font-family: "Courier New", Courier, monospace;
	font-size: 24px;
	font-weight: bold;
}
.overlay_sold, .overlay-original-sold { position: absolute; top: 14px; left: 14px;
	width: 180px;
	height: 180px;
}
.overlay_sold { 
	background-image: url('../img/item-sold-sash.png');
}
.overlay-original-sold { 
	background-image: url('../img/item-original-sold-sash.png');
}

/* Layout for individual Painting page */
.main-painting-display { position: relative;
	width: 869px; height: 665px;
	/*overflow: hidden;*/
}
.main-painting-display img { position: absolute;
	top: 0; left: 0; bottom: 0; right: 0;
	margin: auto;
}
.main-painting-image {
	text-align: center;
}
.main-painting-image img {
	border: 2px #666 solid;
}

.painting-description {
	margin: 30px;
	min-height: 240px; /* to force the space - should use an enclosing DIV with padding instead */
}
.painting-info {
	width: 560px;
	/*height: 300px;*/ /* temp */
	float: right;
	/*border: 1px red dashed;*/
	padding: 14px; padding-top: 0;
	font-size: 18px;
	color: #606060;
	font-weight: bold;
}

/*div.painting-container { position: relative;
	height: 208px; width: 208px;
	background-image: url('../img/thumb-background.png');
	background-repeat: no-repeat;
	background-position: center center;
	margin: 0;
}
div.painting-container.hovereffect:hover {
	background-image: url('../img/thumb-background_hov.png');
} 
div.painting-container img {
	margin: 14px;
}
div.painting-container .product-buy-now-button-temp {
	font-size: 20px;
	font-weight: bold;
	text-align: center;
	margin: 0;
	padding: 0 0 0 14px;
}*/

/* Generalization of the painting styles above to any product display */
.product-name {
	text-align: center;
	font-size: 24px;
	font-weight: bold;
	color: #606060;
	margin-top: 3px;
	padding-top: 0;
}
a.overlay_sold, a.overlay-original-sold { position: absolute; top: 14px; left: 14px;
	width: 180px;
	height: 180px;
}
a.overlay_sold { 
	background-image: url('../img/item-sold-sash.png');
}
a.overlay-original-sold { 
	background-image: url('../img/item-original-sold-sash.png');
}

/* Layout for individual Painting page */
.main-product-display { position: relative;
	width: 869px; height: 665px;
	/*overflow: hidden;*/
}
.main-product-display img { position: absolute;
	top: 0; left: 0; bottom: 0; right: 0;
	margin: auto;
}
.main-product-image {
	text-align: center;
}
.main-product-image img {
	border: 2px #666 solid;
}

.product-description {
	margin: 30px;
	min-height: 240px; /* to force the space - should use an enclosing DIV with padding instead */
}
.product-info {
	width: 500px;
	/*height: 300px;*/ /* temp */
	float: right;
	/*border: 1px red dashed;*/
	padding: 14px; padding-top: 0;
	font-size: 20px;
	color: #606060;
	font-weight: bold;
}
