/* CSS Document - based on Crish styles + blueprint 960 structure added */

/*  FOR COLOR PALETTE, SEE SEPARATE FILE
 
Blueprint CSS Framework 0.8 -  http://blueprintcss.org */

/* reset.css - Resets default browser CSS */


html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, code,
del, dfn, em, img, q, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
}


body {
	margin: 0;
	padding: 0;
	border: 0;
	font-family: Verdana, Arial, Geneva, Helvetica, sans-serif;
	font-size: 100%;
	color: #1a0d00; /* darkest brown */
	background-color: #bb9f79; /* bg beige, from btm of AE render */
	background-image:url(../graphics/bodyBG_1300x1400@30.jpg);
	background-position: 0px 0px;
	background-repeat: repeat-x;
}


/* *** redefining general links *** */
a:link {
	color: #331a00; /* dark brown */
	text-decoration: underline;
}
a:visited {
	color: #805533; /* dark gold */ 
	text-decoration: underline;
}
a:hover {
	color: #403c26; /* dark sage green */
	text-decoration: underline;
}
a:active {
	color: #805533; /* dark gold */
}

/* Text elements
-------------------------------------------------------------- */

strong      { font-weight: bold; }
em          { font-style: italic; }




/* Misc classes
-------------------------------------------------------------- */

.hide       { display: none; }
.first      { margin-left: 0; padding-left: 0; }
.last       { margin-right: 0; padding-right: 0; }
.top        { margin-top: 0; padding-top: 0; }
.bottom     { margin-bottom: 0; padding-bottom: 0; }



/* ***STRUCTURE */

div#container { /*includes logo_nav vertical clm & wrapper, xtra width for IE6  */
	width: 1000px;
	margin: 20px 0px 0px 40px;
	padding: 0px;
}

/* Use this class on any div.span container to see the grid. */
.showgrid { 
  background: url(blueprint/src/grid.png); 
}

div#logo_nav { /* width matches PNG LogoBG */
	position: relative;
	width: 200px;
	height: 500px;
	float: left;
	background-image:url(../navbar/LIBROS_LogoBG_trans.png);
	background-repeat: no-repeat;
}


div#wrapper  { /* 18 columns = 710 + 25/25 side padding to allow for indent & drop shadow = 760 */
	position: relative;
	float: left;
	width: 760px; 
	margin-left: 10px;
	margin-top: 146px;
	margin-bottom: 0px;
}

/* holds the top ragged edge - all 3 inside wrapper divs need to float for IE */
div#wrapper_edge_top {
	position: relative;
	float: left;
	width: 760px; 
	height: 30px;
	background-image: url(../graphics/wrapper_edge_top.png);
	background-repeat: no-repeat;
	width: 760px;
	margin: 0;
}
/* holds side graphics and white bg */
div#wrapper_inner {
	position: relative;
	width: 760px; 
	float: left;
	background-image: url(../graphics/wrapper_sides.png); /* 760 wide includes trans & drop shadow */
	background-repeat: repeat-y;
	padding-left: 25px; 
	padding-top: 4px; /* moves H1 headers down */
	margin: 0;
}

/* holds the bottom ragged edge */
div#wrapper_edge_bottom {
	position: relative;
	float: left;
	width: 760px; 
	height: 30px;
	margin: 0;
	background-image: url(../graphics/wrapper_edge_btm.png);
	background-repeat: no-repeat;
}




/* NAV BAR  */

div#nav {
	position: relative;
	margin-left: 14px; /* indent to match logo above */
	margin-right: 0px; /* push margin flush with r/s of logo */
	padding-top: 190px; /* Home lines up with top of white contents box */
	width: 172px; /* same as logo bg div */
	height: 300px; 
}
#nav ul {
	margin: 0;	
	padding: 0;
}
#nav ul li {
	margin: 0;
	padding: 0;
	display: block;
	list-style: none;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 90%;
	letter-spacing: 1px;
	font-weight: bold;
	width: 172px; /* needed for IE6 - same as #nav */
}
#nav a {
	margin: 0px 0px 4px 0px; /* margin bottom sets spacing between items */
	padding: 2px 10px 2px 27px; /* padding left sets the text indent */
	color: #1a0d00; /* darkest brown */
	display: block;
	text-decoration: none;
	width: 135px; /* needed for IE6 - same as #nav = 172 less padding 37 */
}

/* declarations to style the hover and current page */
#nav a:hover {
	background-color: #e1caa1; /* nav bg center pale gold */
	background-image: url(../navbar/box_hover_ds.png);
	background-repeat: no-repeat;
	background-position: 6px 6px;
}
 
body#about #t-about a, 
body#index #t-index a, 
body#join #t-join a, 
body#newsletter #t-newsletter a, 
body#calendar #t-calendar a, 
body#study_group #t-study_group a, 
body#workshops #t-workshops a, 
body#exhibits #t-exhibits a, 
body#contact #t-contact a, 
body#links #t-links a {
	color: #f2e9ce; /* yellow palest gold - or white? */
	background-image: url(../navbar/box_ds.png);
	background-repeat: no-repeat;
	background-position: 6px 6px;
	background-color: #c27d43; /* nav bg gold */
}




/* P and UL - font-size is in percent, line height is in ems */
p, ul {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 100%;
	color: #1a0d00; /* darkest brown */ 	
	line-height: 1.5em;
	margin: 0;
	padding: 0;
}

ul {
	font-size: 82%;
	padding-right: 12px;
	padding-left: 23px;
	padding-top: 1px;
	padding-bottom: 6px;
}
ul li {
	padding-top: 3px;
	padding-bottom: 3px;
	list-style-type: disc;
}
	

.box ul {
	font-size: 75%;
	padding-right: 0px;
	padding-left: 0px;
	padding-top: 3px;
	padding-bottom: 6px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-style: italic;
	list-style-type: none;
}

.box ul li {
	padding-top: 5px;
}



/* FOOTER */

#footer {
	clear: both;
	width: 500px;
	height: 50px;
	margin-left: 235px;
}
/* *** styling footer copy *** */
#footer p {
	font-size: 66%;
	font-family: Verdana, Geneva, sans-serif;
}


/* *** redefining html tags *** */
h1, h2, h3, h4, h5, h6 {
	margin: 0px;
	padding: 0px;
	letter-spacing: 1px;
	line-height: 1.2em;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #805533; /* dark gold */ 
}

h1 {
	font-size: 100%;
	padding-bottom: 5px;
	color: #403c26; /* dark sage green */
}

h2 { 
	font-size: 90%;
	margin-top: 0.2em;
	color: #a62929; /* red */
}

body#calendar h2 {
	margin-top: 0em;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #e5d9c3; /* palest gold */
	padding-top: 10px;
	clear: both;
	margin-top: 10px;

}

h3, h4 {
	font-family: Verdana, Arial, Geneva, Helvetica, sans-serif;
	font-size: 76%;
	margin-top: 1.2em;
	line-height: 1.4em;
}
h4 {
	font-style: italic;
}

body#calendar h4 {
	margin-top: 0.5em;
}


h5, h6 { /* no letterspacing, good for links */
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 76%;
	margin-top: 1em;
	letter-spacing: 0px;
	line-height: 1.4em;
}

h6 {
	font-style: italic;
}

p {   /* fallback for all text */
	font-size: 85%;
	margin-top: 0.3em;
	margin-bottom: 0.7em;
	font-family: Georgia, "Times New Roman", Times, serif;
}

p.small, p.smallnote {
	font-size: 66%;	
	line-height: 1.5em;
}
p.smallnote { 
	color: #66635e; /* beige B40*/
}

p.caption {
	font-size: 66%;
	color: #66635e; /* beige B40*/
	padding: 0 !important;
	line-height: 1.35em;
	margin: 0 0 1.7em 0 !important;
}

p.breadcrumbs {
	clear: both;
	color: #80554d; /* brick pink */
	font-size: 66%;
	margin-top: 0;
}




/* #BOX - STYLING SIDEBARS and BOXES */


/* Sidebars etc: Use a 2nd nested div with class .box to create a padded box inside a column - for images, use span width LESS 34px (padding and border) */ 
div.box {
	width: auto;
	padding: 0px 16px 12px 16px; /* use top margins in headers */ 
	margin-bottom: 1.2em;
	background-color: #f2e9ce; /* yellow palest gold */ 
	background-image: url(../graphics/grad-white-palestgold-200.png);
	background-repeat: repeat-x;
	border: 1px solid #e1caa1; /* nav bg center pale gold */
	-webkit-border-radius: 8px;    /* for Safari */
	-moz-border-radius: 8px;       /* for Firefox */
}

.padding-top {
	padding-top: 0px;
}

.padding-bottom {
	padding-bottom: 12px;
}

.box h1, .box h2, .box h3, .box h4, .box h5, .box h6 { 	
	font-family: Verdana, Arial, Geneva, Helvetica, sans-serif;
	margin-top: 0.9em; 
}


.box p, .box p.small {
	font-family: Verdana, Arial, Geneva, Helvetica, sans-serif;
	font-size: 70%;
	margin-top: 0.4em;
	margin-bottom: 0.6em;
	line-height: 1.5em;
	color: #331a00; /* dark brown */ 
}

.box p.small {
	font-size: 62%;
	line-height: 1.5em;
}


/* ### IMAGE STLYING *** */

.floatleft {
	float: left;
	margin-right: 10px;
}
.floatright {
	float: right;
	margin-left: 10px;
}

img {   /* default has border and no margins - good for caption */
	border: 0; 
	margin: 0;
	padding: 0;
	border: 1px solid #e1caa1; /* nav bg center pale gold */
}

.noborder {  /* no border */
	border: 0;
}

.img_margins {  /* use for a stack of images, does NOT float */
	margin-top: 6px;
	margin-bottom: 4px;
}

.borderonly {
	border: 1px solid #e1caa1; /* nav bg center pale gold */
}

.imgfloatright, .imgfloatrighthead {
	float: right;
	margin-top: 4px;
	margin-right: 0px;
	margin-bottom: 6px;
	margin-left: 8px;
}
.imgfloatrighthead {
	margin-top: 0px;
}


.imgfloatleft, .imgfloatlefthead, .imgfloatleftclearboth {
	float: left;
	margin-top: 4px;
	margin-right: 10px;
	margin-bottom: 6px;
	margin-left: 0px;
}

.imgfloatlefthead {
	margin-top: 0px;
}

.imgfloatleftclearboth {
	clear: both;
	margin-top: 6px;
}


/* ### MISC STYLES & CLEARERS *** */


.align_center {
	text-align: center;
}
.align_right {
	text-align: right;
}

.nomargins {
	margin: 0 !important;
}

.smallmargintop {
	margin-top: 4px !important;
}

.nomarginbtm {
	margin-bottom: 0px !important;
}
.extraSpaceB4 {
	padding-top: 10px !important;
}

.extraSpaceAfter {
	padding-bottom: 10px !important;
}

.extraSpaceB4After {
	padding-top: 10px !important;
	padding-bottom: 10px !important;
}

.rule {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #e5d9c3; /* palest gold */
	line-height: 1em;
}
.ruleabove {
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #e5d9c3; /* palest gold */
	padding-top: 14px;
	clear: both;
	margin-top: 20px;
}

/* CLEARERS */

.clearleft {
	clear: left;
}

.clearright {
	clear: right;
}

.clearboth {
	clear: both;
}


div.clearer { /* see www.complexspiral.com/publications/containing-floats, don't need to put nb space */
	clear: both; 
	line-height: 0px; 
	height: 0px;
}


/* ### Columns - modified 960grid = 710 GRID SYSTEM = 18 columns */

/* Sets up basic grid floating and margin - do NOT do position relative or IE7 & 8 don't draw span divs! */
.column, div.span-1, div.span-2, div.span-3, div.span-4, div.span-5, div.span-6, div.span-7, div.span-8, div.span-9, div.span-10, div.span-11, div.span-12, div.span-13, div.span-14, div.span-15, div.span-16, div.span-17, div.span-18 {
	float: left;
  	margin-right: 10px;
}

/* The last column in a row needs this class. */
.last, div.last { margin-right: 0; }

/* Use these classes to set the width of a column. 
NOTE that when adding the .box class, subtract 2 for box borders and 32 for padding and 2 for img border = 36 less */

.span-1 {width: 30px;}
.span-2 {width: 70px;}
.span-3 {width: 110px;}
.span-4 {width: 150px;} 
.span-5 {width: 190px;}
.span-6 {width: 230px;}   /* sidebar box = 194 for images */
.span-7 {width: 270px;}
.span-8 {width: 310px;}
.span-9 {width: 350px;} /* half page width - max image size = 348 + 2 border */
.span-10 {width: 390px;}
.span-11 {width: 430px;}
.span-12 {width: 470px;} /* main contents - max image size = 468 + 2 border */
.span-13 {width: 510px;}
.span-14 {width: 550px;}
.span-15 {width: 590px;}
.span-16 {width: 630px;}
.span-17 {width: 670px;}
.span-18, div.span-18 {width: 710px; margin:0;}


/* Add these to a column to append empty cols. */

.z_append-1 { padding-right: 40px;}
.z_append-2 { padding-right: 80px;}
.z_append-3 { padding-right: 120px;}
.z_append-4 { padding-right: 160px;}
.z_append-5 { padding-right: 200px;}
.z_append-6 { padding-right: 240px;}
.z_append-7 { padding-right: 280px;}
.z_append-8 { padding-right: 320px;}
.z_append-9 { padding-right: 360px;}
.z_append-10 { padding-right: 400px;}
.z_append-11 { padding-right: 440px;}
.z_append-12 { padding-right: 480px;}
.z_append-13 { padding-right: 520px;}
.z_append-14 { padding-right: 560px;}
.z_append-15 { padding-right: 600px;}
.z_append-16 { padding-right: 640px;}
.z_append-17 { padding-right: 680px;}

/* Add these to a column to prepend empty cols. */

.z_prepend-1 { padding-left: 40px;}
.z_prepend-2 { padding-left: 85px;}
.z_prepend-3 { padding-left: 120px;}
.z_prepend-4 { padding-left: 160px;}
.z_prepend-5 { padding-left: 200px;}
.z_prepend-6 { padding-left: 240px;}
.z_prepend-7 { padding-left: 280px;}
.z_prepend-8 { padding-left: 320px;}
.z_prepend-9 { padding-left: 360px;}
.z_prepend-10 { padding-left: 400px;}
.z_prepend-11 { padding-left: 440px;}
.z_prepend-12 { padding-left: 480px;}
.z_prepend-13 { padding-left: 520px;}
.z_prepend-14 { padding-left: 560px;}
.z_prepend-15 { padding-left: 600px;}
.z_prepend-16 { padding-left: 640px;}
.z_prepend-17 { padding-left: 680px;}


/* Border on right hand side of a column. */
div.border {
	border-right: 1px solid #e1caa1; /* nav bg center pale gold */
	padding-right: 4px;
	margin-right: 5px;
}

/* Border with more whitespace, spans one column */
div.colborder {
  padding-right: 24px;
  margin-right: 25px;
  border-right: 1px solid #e1caa1; /* nav bg center pale gold */
}




/* Misc classes and elements
-------------------------------------------------------------- */

/* In case you need to add a gutter above/below an element - use on the main sidebar div to drop down to first paragraph height */
.prepend-top { 
  margin-top: 1.5em; 
}
.append-bottom { 
  margin-bottom: 1.5em; 
}


/* from Bring Down IE6 website's code */

#ie6Warning {
	border: 1px solid #bbbbbb;
	padding: 6px 10px 1px 10px;
	margin-bottom: 10px;
	background-color: #FC6;
}

#ie6Warning h2 {
	color: #C30;
	margin-top: 0.5em;
}
		
#ie6Warning p {
	font-size: 80%;
	font-family: Verdana, Geneva, sans-serif;
}



/* PAYPAL BUTTON styling (bg matches sidebars) - uses regular sidebar box styling - DOES NOT USE VIEWCART YET as only membership is active - update FAQ pages if more then one item added and change buttons */


div.ppbutton {
	width: 250px;
	margin: 12px 0px 12px 0px;
	padding: 8px 12px 8px 12px;
	background-color: #FFF; 
	border: 1px solid #c27d43; /* nav bg gold */
} 

div.ppbutton h4, div.ppbutton h5, div.ppbutton h6 {
	font-size: 70%;
	margin-top: 0px;
}

div.ppbutton tr td {
	font-family: Verdana, Arial, Geneva, Helvetica, sans-serif;
	font-size: 76%;
	color: #a62929; /* red */
}

div.ppbutton tr td.fieldspace { /* spaces popup menu only - add class to td */
	padding-top: 1px;
	padding-bottom: 7px;
}

div.ppbutton table { /*  space between table and Add to Cart button */
	padding-bottom: 10px;
}


div.viewcart { /* this View Cart button not necessary for one off memberships  */
	position: relative;
	height: 26px;
	float: right;
	margin-top: 58px;
}