/******************************************************************************
 *  GrandRetort.com stylesheet v.2, 20080924
 *  Copyright 2004-2008, The Grand Retort (TGR), all rights reserved
 *  contact via e-msg at tgr(at)grandretort(dot)com 
 * 
 *  PRIMARY SOURCE of CSS CODE: Skidoo Too:Ruthsarian Layouts
 *  http://webhost.bridgew.edu/etribou/layouts/skidoo_too/ 
 *  [modified a fair bit for TCA, but foundation is skidoo_too] 
 *  many, MANY thanks
 *******************************************************************************/
/* GENERIC ITEMS
 */
.clear {
	clear: both;
	padding-bottom: 1px;
	margin-bottom: -1px;	
}
.hide {
	display: none !important;
}
.smallStuff {
	line-height: 30%; 
}

/* margin values and font sizes for headings, for consistent look explicity 
 * set these values here.  Pixels rather than ems to keep consistent
 * margin on the different headings.
 */

p {
	margin-top: 7px;
	margin-bottom: 12px;
	padding-top: 0;
	padding-bottom: 0;
}
h1, h2, h3, h4, h5, h6 {
	margin-top: 3px;
	margin-bottom: 5px;
	padding-top: 0;
	padding-bottom: 0;
}
h1 {
	font-size: 220%;
}
h2 {
	font-size: 190%;
}
h3 {
	font-size: 160%;
}
h4 {
	font-size: 130%;
}
h5 {
	font-size: 100%;
}
h6 {
	font-size: 70%;
}

/* SOME HTML ELEMENTS' STYLE 
 */
a:link, a:visited {
	text-decoration: none;
	color: #000F5A;
}
a:hover, a:active {
	text-decoration: underline;
	color: #B93E3E;
}
a:link IMG, a:visited IMG {
	border: #000F5A;
}
a:hover IMG, a:active IMG{
	border: #B93E3E;
}
code {
	font-family: "Courier New", Courier, monospace;
}
label {
	cursor: pointer;
}

/* CORE PAGE LAYOUT,  includes positioning and gutter space. Colors 
 * and fonts done later.
 */
body {
	margin: 5px;  /* this is gutter around main page, for img use in-line style in body tag */
	font-size: 100.1%;
}
#pageWrapper {
	border: solid #02377D;
	border-width: 0 1px;
    margin-left: auto;
    margin-right: auto;
	width: 64em;
}
#masthead {
/*	border: solid 1px #02377D;
	border-width: 1 0px; 
	padding: 0.1em; */
}
#outerColumnContainer {
/* reserves space for left & right columns. Use padding, margins, or 
 * borders as needed, but use border method to create background color 
 * for both left and right columns, solid is needed for border, but color is done 
 * in outerColumn container, further below.
 */
	border-left: solid 185px #FFFFFF; /* 178 left col background width and color */
	border-right: solid 50px #FFFFFF; /* right col background width and color */
}
#innerColumnContainer {
	border-left: #FFFFFF 1px solid; 
	border-right: #FFFFFF 1px solid; 
	border-bottom: #FFFFFF 1px solid; 
	margin: 0 -1px; 
	width: 100%;
	z-index: 1;
}
#leftColumn, #middleColumn, #rightColumn, * html #SOWrap {
	overflow: visible;
	position: relative;
}
#SOWrap {
	float: left;
	margin: 0 -1px 0 0;
	width: 100%;
	z-index: 3;
}
#middleColumn {
	float: right;
	margin-left: 15px; 
	margin-right: 10px; 
	margin-top: 0; 
	margin-bottom: -1px;
	width: 99%; /* content width */
	z-index: 5;
}
#leftColumn {
	float: left;
	width: 182px; /* 175 content width */
	margin-left: -189px;  /* 180 */
	margin-right: 1px; 
	margin-top: 0; 
	margin-bottom: 0;
	z-index: 4;
}
#rightColumn {
	float: right;
	width: 1em; /* this is all for content, none on TGR */
	margin-left: -3px; 
	margin-right: -1em; 
	margin-top: 0; 
	margin-bottom: 0;
	z-index: 2; 
}
#footer {
	border-width: 1px 0; 
	padding-left: 2px;
	padding-right: 2px;
	padding-top: 1px;
	padding-bottom: 2px;
}
p.fontSizeSet {
	text-align: center;
}
p.fontSizeSet a:hover  {
	border: #02377D 1px solid; 
}

/* ALL BELOW IS PAGE THEME, & could be in 
 * separate stylesheet to allow for multiple themes. 
 */
#pageWrapper, #masthead, #innerColumnContainer, #footer {
	border-color: #FFFFFF;  /* this is inside border colors */
} 
body {
	background-color:#003366;
}
html, body {
	/* _DO_NOT_ apply font-size to html or body elements, set in #pageWrapper.
	 */
	color: #000F5A;
	font-family: Arial, Helvetica, Verdana, sans-serif; /* this is font for text in middle columns*/
}
#pageWrapper {
	font-size: 80%;	/* this is default font size; for TGR, leave this alone */
}
#masthead {
	color: #02377D;
	background-color: #FFFFFF;
}
#outerColumnContainer {
	border-left-color: #F8F8F8; /* left column background color */
	border-right-color: #FFFFFF; /* right column background color */
	background-color: #FFFFFF; /* middle column background color */
}

/* HEADER STUFF
 */
.boxLinks {
	color: #000F5A; 
	background-color: #EEEEEE;
	border-left: #02377D 1px solid; 
	border-right: #02377D 1px solid; 
	border-top: #02377D 1px solid; 
	border-bottom: #02377D 1px solid; 
	padding-left: 2px; 
	padding-right: 2px; 
	padding-top: 2px; 
	padding-bottom: 2px;
	font-size: x-small; 
	letter-spacing: 0.1em; 
	text-transform: uppercase; 
	text-align: center;
	line-height: 140%; 
}
#topDate {
	color: #4E4E4E; 
	margin-bottom: 10px;
	font-size: x-small; 
	font-weight: normal; 
	letter-spacing: 0.1em; 	
	line-height: 130%;	
}
#topQuote {
	color: #02377D;
	background-color: #EEEEEE;
	border: #336699 1px solid; 
	padding-left: 10px; 
	padding-right: 10px; 
	padding-top: 5px; 
	padding-bottom: 5px; 
	margin-top: 5px;
	margin-bottom: 15px;
	font-weight: normal; 
	font-size: 100%; 	
	text-align: left;
	line-height: 160%;
}
#topQuote a:link {
	text-decoration: underline;
}

/* MIDDLE COL STUFF
 */
#middleColumn .inside {
	padding-left: 12px;
	padding-right: 9px;
	padding-top: 0px;
	padding-bottom: 0px;
	margin-left: 5px;
	margin-right: 5px;
}
.date {
	color: #4E4E4E; 
}
.articleHdr {
	padding-top: 8px;
/*	padding-left: 5px; 
	padding-bottom: 2px; */
	border-top: #394341 4px double; 
	margin-top: 8px;
	margin-bottom: 5px;
	letter-spacing: 0.1em;
	font-size: 175%;
	font-weight: bold; 		
	font-family: Georgia;  
	text-align: left;
	line-height: 110%;
}
.articleSum {
	color: #02377D;
	background-color: #F8F8F8;	
	margin-left: 4%;
	margin-right: 4%;
 	font-family: Georgia; 
	font-family: Verdana, Arial, Helvetica, sans-serif;
	line-height: 140%; 
	font-weight: bold; 
}
.articleBody {
	padding-left: 4px; 
	padding-bottom: 10px; 
	font-weight: normal; 
	font-size: 105%; 
	line-height: 140%; 
}
.articleBody a:link, .articleSum a, .articleSum a:link, .articleBody a:visited, .articleSum a:visited {
	color: #000F5A;
	text-decoration: underline;
}
.articleBody a:visited, .articleSum a:visited {
	color: #C69604;
	text-decoration: underline;
}
.articleBody a:active, .articleBody a:hover,.articleSum a:hover {
	color: #B93E3E;
	text-decoration: underline;
}
.articlePHdr {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	line-height: 25px; 
}
.articleEmph {
/*	background-color: #F8F8F8;  */
	padding-left: 5px; 
	padding-right: 5px; 
	padding-top: 5px;
	padding-bottom: 5px;
	margin-left: 5%;
	margin-right: 5%;
	font-weight: bold;
	font-style: italic;
	line-height: 130%; 
}
.articleQuote {
	background-color: #F4F5F9; 
	padding-left: 5px; 
	padding-right: 5px; 
	padding-top: 5px;
	padding-bottom: 5px;
	margin-left: 5%;
	margin-right: 5%;
	line-height: 130%; 
}
.articleFtr {
	color: #4E4E4E; 
	border-top: #4E4E4E 1px solid; 
	margin-top: 10px;
	margin-bottom: 10px;
	font-size: 85%; 
}
.articleFtr a, .articleFtr a:link, .articleFtr a:visited {
	color: #4E4E4E; 
	text-decoration: underline;
}
.articleFtr a:active, .articleFtr a:hover {
	color: #B93E3E;
	text-decoration: underline;	
}
.cmtHdr {
	border-bottom: #4E4E4E 1px solid; 
	padding-top: 5px; 
	padding-bottom: 5px; 
	margin-left: 15px;
	font-weight: bold; 
}
.cmtBody {
	color: #4E4E4E; 
	padding-left: 8px; 
	padding-top: 5px; 
	padding-bottom: 5px; 
	margin-left: 15px;
	line-height: 140%; 
}
.cmtFtr {
	color: #4E4E4E; 
	padding-left: 8px; 
	padding-right: 15px; 
	padding-top: 3px; 
	padding-bottom: 5px; 	
	border-top: #4E4E4E 1px dotted; 
	margin-top: 5px;
	margin-left: 15px;
	margin-bottom: 5px; 
	font-size: smaller; 
	font-weight: normal; 
	text-align: left;
}

/* CAT & DATE ARCHIVE LIST STUFF (in middle col)
 */
.arcLink a:link, .pgLink a:link, {
	color: #000F5A;
}
.arcLink a:visited {
	color: #C69604;
}
.arcLink a:active, .pgLink a:hover {
	color: #B93E3E;
}
.arcLink {
	font-size: 85%; 
	font-weight: smaller;
	line-height: 120%; 
} 

/* LEFT COL STUFF
 */
#leftColumn .inside {
	padding-left: 8px;
	padding-right: 3px;
	padding-top: 0px;
	padding-bottom: 0px;	
}
#leftColumn .hdr a, #leftColumn .hdr a:link, #leftColumn .hdr a:visited {
	color: #000F5A;
}
#leftColumn .hdr a:active, #leftColumn .hdr a:hover {
	color: #B93E3E;
}
#leftColumn .hdr {
	font-size: 90%; 
	font-weight: bold;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	letter-spacing: 0.01em; 
	line-height: 160%; 
}
#leftColumn .hdr1, #leftColumn .hdr2 {
	padding-bottom: 1px; 
	margin-top: 5px;
	margin-bottom: 1px; 
	font-weight: bold; 
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-transform: none; 
	text-align: center;
}
#leftColumn .hdr1 {
	color: #FFFFFF;
	background-color: #000F5A; 
}
#leftColumn .hdr2 {
	color: #000F5A;
	background-color: #CCCCCC; 
}
#leftColumn .link a, #leftColumn .link a:link {
	color: #000F5A;
}
#leftColumn .link a:visited {
	color: #C69604;
}
#leftColumn .link a:active, #leftColumn .link a:hover {
	color: #B93E3E;
}
#leftColumn .link {
	margin-left: 2px;
	font-size: 90%; 
	font-weight: normal;
	line-height: 130%; 
} 

/* RIGHT COL STUFF
 */
#rightColumn .inside {
	/* Don't apply font size to just #rightColumn, because its width, specified in EMs, 
	 * will also be affected so apply font size changes to the .inside element that is
	 * 'inside' underneath all three columns
	 */
	padding-left: 10px;
	padding-right: 8px;
	padding-top: 0px;
	padding-bottom: 0px;	
	font-size: 90%;
}

/* FOOTER STUFF
 */
#footer {
	background-color: #FFFFFF;
	text-align: center;
}
#footer p {
	background-color: #EEEEEE;
	border-top: 2px solid #02377D;
	padding-left: 2px;
	padding-right: 2px;
	padding-top: 5px;
	padding-bottom: 4px;
	margin-top: 5px;
	font-size: 80%; 
	font-weight: bold; 
	text-transform: uppercase;
	width: 650px;
	letter-spacing: 3px; 
	line-height: 140%;
}
.special {
	color: #4E4E4E;
	background-color: #FFFFFF;
	border-left: #4E4E4E 1px dotted; 
	border-right: #4E4E4E 1px dotted; 
	border-top: #4E4E4E 1px dotted; 
	border-bottom: #4E4E4E 1px dotted; 
	padding-left: 2px; 
	padding-right: 2px; 
	padding-top: 2px; 
	padding-bottom: 2px;
	margin-top: 10px; 
	font-weight: bold; 
	letter-spacing: 0.2em; 
	text-transform: uppercase; 
	text-align: center;
	line-height: 140%; 
}
.gen1 {
	color: #FFFFFF;
	background-color: #7F7F7F;
	padding-left: 2px; 
	padding-right: 2px; 
	padding-top: 2px; 
	padding-bottom: 2px; 	
	font-size: small;
	font-weight: bold;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	text-align: center;
}
.gen2 {
	color: #FFFFFF;
	background-color: #336699;
	padding-left: 2px; 
	padding-right: 2px; 
	padding-top: 2px; 
	padding-bottom: 2px; 	
	font-size: small;
	font-weight: bold;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	text-align: center;
}

/******************************************************************************/
