/* 
	Main styles for ConsignmentGallery.ca
	Derek Mah, March, 2007

	background f2eee6
	wrapper border dad8d0
	header background 660f12
	text 444a40
	buttonlink 007a00
	link 008a00
	link hover ffba00
	
	wrapper width: 882px
	content width: 682px
	practical max-width of banner image: 680px
	cg_twocolumn td width: 302 to 306px
	practical max-width of cg_twocolumn image: 300px
	
*/
	
/* 
====================
	Set defaults
	
		background: url(bkg_body_winter.gif) left top #f2eee6; snowflake bkg taken down 090407 in main site and gallery

====================
 */
* {margin: 0px; padding: 0px;}
body {
	background-color: #f2eee6;
	font: 14px "lucida grande", "verdana", "geneva", "arial", "helvetica", sans-serif;
	font-weight: normal; font-style: normal;
	color: #444a40;
	text-decoration: none;
	text-align: center;
	}
img {display: inline; vertical-align: baseline;}
a img {border: none;}
table, tr, td {border-collapse: collapse;}
td {vertical-align: top;}
/* 	h1 title
	h2 header
	h3 is a smaller header without margin-bottom
	h6 quote credit
	cg_bottompad can be added to any block element to add a bottom pad. This is mostly for images.
 */
h1, h2, p, .cg_bottompad {margin-bottom: 1.25em;}
h1 {
	margin-top: 20px;
	font-size: 1.8em; font-weight: bold;
	}
h2 {
	font-size: 1.25em;
	font-weight: bold;
	}
h3 {
	font-size: 1.0em;
	font-weight: bold;
	}
h6 {
	font-size: 0.8em; font-weight: normal;
	text-align: right;
	margin: 0px 10px 20px 0px;
	}
p {
	line-height: 1.25em;
	}
.chunky {
	font-weight: bold;
	}
.smalltext {
	font-size: 0.9em;
	}
a:link, a:visited {
	color: #008a00; text-decoration: none;
	}
a:active, a:hover {
	color: #ffba00; text-decoration: none;
	}

/* 
====================
	content
====================
 */
#cg_wrapper {
	position: relative; overflow: hidden;
	width: 882px;
	margin: 0px auto 0px auto;
	background: url(../_globalassets/bkg_wrapper.gif) top left repeat-y #ffffff;
	}
/* cg_content padding-bottom must always exceed margin-bottom of contained elements */
#cg_content {
	padding: 180px 100px 40px 100px;
	text-align: left;
	}
#cg_content ul, 
#cg_content ol {
	margin-bottom: 1.25em;
	margin-left: 1.5em;
	}
#cg_content li {
	margin: 0em 0em 1.0em 1.0em;
	}
#cg_content ul ul, 
#cg_content ol ul {
	list-style: none;
	margin-left: 0.5em;
	}
#cg_content ul ul li, 
#cg_content ol ul li, 
#cg_content ol ol li {
	font-size: 0.8em;
	font-weight: normal;
	}
/* cg_twocolumn builds a table for formatting a two column layout with a divider */
.cg_twocolumn {
	clear: both;
	text-align: left;
	margin-bottom: 20px;
	}
.cg_twocolumn td {
	width: 50%;
	}
.cg_twocolumn td.left {
	padding-right: 35px;
	}
.cg_twocolumn td.right {
	padding-left: 39px;
	border-left: solid 1px #646a60;
	}
/* cg_threecolumn builds a table for formatting a three column layout with dividers */
.cg_threecolumn {
	clear: both;
	text-align: left;
	margin-bottom: 20px;
	}
.cg_threecolumn td {
	width: 32%;
	font-size: 0.8em;
	}
.cg_threecolumn td.middle {
	width: 35.5%;
	}
.cg_threecolumn td.left, 
.cg_threecolumn td.middle {
	padding-right: 22px;
	border-right: solid 1px #646a60;
	}
.cg_threecolumn td.middle, 
.cg_threecolumn td.right {
	padding-left: 25px;
	}
/* cg_leftwrapper floats a div to the left. The floats should be used only in single column and not in the cg_twocolumn layout. Always place the content in cg_left inside cg_leftwrapper with the width of cg_left locally set to be equal to the width of the widest contained image. Width of cg_left is set at a default of 250px. */
.cg_leftwrapper {
	clear: both;
	float: left; width: 250px; 
	margin-right: 40px;
	text-align: left;
	margin-bottom: 10px;
	font-size: 0.8em;
	}
.cg_left {
	width: 250px;
	padding-top: 5px;
	}
/* cg_rightwrapper floats a div to the right. The floats should be used only in single column and not in the cg_twocolumn layout. Always place the content in cg_right inside cg_rightwrapper with the width of cg_right locally set to be equal to the width of the widest contained image. Width of cg_left is set at a default of 250px. */
.cg_rightwrapper {
	clear: both;
	float: right; width: 250px; 
	margin-left: 40px;
	text-align: left;
	margin-bottom: 10px;
	font-size: 0.8em;
	}
.cg_right {
	width: 250px;
	padding-top: 5px;
	}
/* cg_imgwrapper is a container for images that includes a text-size reduction for image captioning. */
.cg_imgwrapper {
	clear: both;
	margin-bottom: 1.25em;
	font-size: 0.8em;
	}

/* cg_newsletter is a container for the newsletters that puts a black border around the newsletter page. It has a position: relative in case we need to absolutely position links onto the newsletter. */
.cg_newsletter {
	clear: both; position: relative;
	margin-bottom: 1.25em;
	border: solid 1px #c3c1b5;
	border-top-color: #dad8d0;
	border-bottom-color: #8a846a;
	}

/* 
====================
	links
====================
 */
#cg_content a {
	text-decoration: underline;
	font-weight: bold;
	font-size: 0.90em; vertical-align: 1px;
	}
#cg_content a.cg_button, 
#cg_content a.cg_smallbutton {
	margin-right: 5px;
	padding: 1px 7px 2px 7px;
	font-size: 12px;
	font-weight: bold;
	text-decoration: none;
	}
#cg_content a.cg_button:link, 
#cg_content a.cg_button:visited {
	border: solid 1px #abd20a;
	background-color:#d7ea1e;
	color: #008a00;
	}
#cg_content a.cg_button:hover, 
#cg_content a.cg_button:active {
	border: solid 1px #ffba00;
	background-color: #ffdd00;
	color: #fcfffa;
	}
#cg_content .cg_smallbutton {
	margin-top: 2.50em;
	}
#cg_content .cg_smallbutton a.cg_button {
	font-size: 9px; font-weight: normal;
	padding: 2px 5px 3px 5px;
	}
#cg_content li a.cg_button {
	font-size: 9px;
	padding: 1px 3px 1px 3px;
	}

/* 
====================
	contact form
====================
 */
.cg_contactbox {
	border: solid 1px #bab8b0;
	background-color: #fcfaf3;
	font: 12px "lucida grande", "verdana", "geneva", "arial", "helvetica", sans-serif;
	font-weight: normal; font-style: normal;
	color: #444a40;
	text-decoration: none;
	}

/* 
====================
	footer
====================
 */
#cg_footer {
	width: 882px;
	margin: 0px auto 0px auto;
	background: url(../_globalassets/bkg_footer.gif) left top no-repeat transparent;
	padding-top: 70px;
	padding-bottom: 2em;
	text-align: center;
	font-size: 9px;
	}
#cg_footer #cg_address {
	letter-spacing: 2px; font-size: 12px; padding-bottom: 2em;
	}
#cg_footer a.cg_button {
	margin-right: 5px;
	padding: 1px 7px 2px 7px;
	color: #fffdfa;
	font-size: 10px;
	font-weight: bold;
	text-decoration: none;
	}
#cg_footer a.cg_button:link, 
#cg_footer a.cg_button:visited {
	border: solid 1px #0a0000;
	background-color:#760f12;
	text-shadow: 0px 1px 2px #2a0301;
	}
#cg_footer a.cg_button:hover, 
#cg_footer a.cg_button:active {
	border: solid 1px #c81c1e;
	background-color: #ffaa00;
	text-shadow: 0px 0px 2px #ffffaa;
	}

/* 
====================
	header
====================
 */
#cg_header {
	position: absolute; top: 0px; left: 0px;
	width: 100%;
	background: url(../_globalassets/bkg_header.gif) left top repeat-x #660f12;
	}
#cg_header a#cg_logo {
	position: absolute; top: 0px; left: 0px;
	width: 320px; height: 128px;
	background: url(../_globalassets/bkg_logo.gif) left top no-repeat transparent;
	}
#cg_header a#cg_gracie {
	position: absolute; top: 0px; right: 0px;
	width: 422px; height: 128px;
	background: url(../_globalassets/bkg_gracie.gif) left top no-repeat transparent;
	}
#cg_header a#cg_logo:link, 
#cg_header a#cg_logo:visited, 
#cg_header a#cg_gracie:link, 
#cg_header a#cg_gracie:visited {
	background-position: left top;
	}
#cg_header a#cg_logo:hover, 
#cg_header a#cg_logo:active, 
#cg_header a#cg_gracie:hover, 
#cg_header a#cg_gracie:active {
	background-position: left -150px;
	}

#cg_topnav {
	margin-top: 132px;
	background-color: #760f12;
	border-top: solid 1px #760f12;
	border-bottom: solid 1px #0a0000;
	padding: 3px 0px 4px 0px;
	}
#cg_topnav ul, #cg_topnav ul li {
	list-style: none;
	}
#cg_topnav ul {
	text-align: center;
	}
#cg_topnav ul li {
	display: inline;
	}
#cg_topnav ul li a {
	padding: 3px 12px 4px 12px;
	font-size: 12px; font-weight: bold;
	color: #fffdfa;
	}
#cg_topnav ul li a:link, 
#cg_topnav ul li a:visited {
	border: solid 1px #760f12;
	border-bottom: solid 1px #0a0000;
	background-color: #760f12;
	text-shadow: 0px 1px 2px #2a0301;
	}
#cg_topnav ul li a:hover, 
#cg_topnav ul li a:active {
	border: solid 1px #c81c1e;
	background-color: #ffaa00;
	text-shadow: 0px 0px 2px #ffffaa;
	}
/* 
	text-shadow element validates to CSS2 and CSS3.
	text-shadow does not validate to CSS 2.1, but is non-destructive.
	format is offset right, offset down, blur.
 */
 /* 
====================
	frontpage
====================
 */
#cg_fpwrapper {
	position: relative; overflow: hidden;
	width: 880px; border: solid 1px #dad8d0;
	margin: 100px auto 0px auto;
	background: url(../frontpage/frontpage.gif) center 1px no-repeat #ffffff;
	}
#cg_fpwrapper #cg_content {
	padding: 320px 40px 40px 40px;
	}
#cg_fpheader {
	position: absolute; top: 0px; left: 0px;
	width: 100%;
	background: url(../_globalassets/bkg_header.gif) left top repeat-x #660f12;
	}
#cg_fpheader #cg_topnav {
	margin-top: 17px;
	}
/* cg_fp_threecolumn builds a table for formatting a three column layout with dividers for the frontpage */
.cg_fp_threecolumn {
	clear: both;
	text-align: left;
	margin-bottom: 20px;
	}
.cg_fp_threecolumn td {
	width: 32%;
	font-size: 0.8em;
	}
.cg_fp_threecolumn td.middle {
	width: 36%;
	}
.cg_fp_threecolumn td.left, 
.cg_fp_threecolumn td.middle {
	padding-right: 30px;
	border-right: solid 1px #646a60;
	}
.cg_fp_threecolumn td.middle, 
.cg_fp_threecolumn td.right {
	padding-left: 35px;
	}
.cg_fp_threecolumn td.right {
	text-align: right;
	}
.cg_fp_threecolumn td.right h2 {
	text-align: left;
	}
#cg_monthlydraw {
	background-color: #660f12;
	padding: 1.25em 1.25em 0.25em 1.25em;
	color: #fffcfa;
	text-align: center;
	font-size: 0.90em;
	}

 /* 
====================
	cgred Gallery2.0 styles for frontpage
====================
 */
.one-image {
	margin: 0em 0em 1.25em 0em;
	text-align: right;
	float: right;
	margin-left: 10px;
	font-size: 9px;
	}
.one-image img {
	border: solid 1px #dad8d0;
	}
 /* 
====================
	christmas adjustments
	add or remove "_deactivated" from id to activate
====================
 */
body_deactivated {
	background: url(../_globalassets/bkg_body_winter.gif) left top repeat #f2eee6;
	}
#cg_fpwrapper_deactivated {
	background: url(../frontpage/frontpage_christmas.jpg) center 1px no-repeat #ffffff;
	}
#cg_fpwrapper #cg_content_deactivated {
	padding-top: 370px;
	}
.cg_christmas_hours {
	width: 100%; font-size: 11px; margin-bottom: 20px;
	}
.cg_christmas_hours .christmashours {
	text-align: right;
	}