@charset "UTF-8";
/* CSS Document */

/*** Header sytling and positioning ***/

div#issueNumber { /* nothing here but stuff for the issue number */
	position: absolute;
	right: 21px;
	bottom: 4px;
	width:220px;
	height: 15px; 
	color: white;
	text-align: right;
	font-weight: normal;
	font-size: .8em;
}
#issueNumber a:link,
#issueNumber a:hover,
#issueNumber a:hover,
#issueNumber a:visited {
color: white;
text-decoration: none;
}

div#alertSignup {
position: absolute;
top: 0px;
right: 21px;
width: 220px;
height: 15px;
background-color: rgb(181,182,184);
border-top: 15px solid rgb(88,87,93);
padding-top: 2px;
color: black;
text-align: center;
font-weight: normal;
letter-spacing: 0.2em;
font-size: .9em;
text-transform: uppercase;
visibility: hidden; /* turned off peer new direction */
}

/*** Styles for the menuBar ***/
#headWrapper {
	position: relative;
	width: 800px;
	height: 92px;
	overflow: hidden;
	background-color: rgb(224,177,97);
	color: white;
} 

#headContent{
	position: relative;
	background-image: url(../graphics/cc_banner1.jpg);
	background-repeat: no-repeat;
	width: 100%;
	height: 62px; 
	margin: 0px;
}

#headMenuBar {
position: relative;
float: left;
width : 65%;
height: 22px;
text-align: left;
background-color: #555555;
border-bottom: 8px solid #AAAAAA;
}

/*** Styles for the primary links in menubar ***/

ul.menu {
  position: relative;
  list-style: none;
  margin: 0;
  padding: 0;
}

.menu li {
  position: relative;
  display: inline;
  font-size: 10px;
  line-height: 1;
  white-space: nowrap;
  margin: 0 7px 0 7px;
  padding: 4px 3px 8px 3px;
  zoom: 1;
}

.menu li a {
}

.menu li.active {
  background-color: #AAAAAA;
}

.menu li a:link,
.menu li a:visited { 
  color: white;
  text-decoration: none;
}

.menu li a:hover { 
  color: rgb(208,174,100);
  text-decoration: none;
}

/*** Styles for the searchBar ***/

div#searchBar {
  position: relative;
  float: right;
  text-align: right;
  position: relative;
  width: 35%;
  height: 30px;
  background-color: #555555;
}

#searchBar form{
  font-size: 10px;
  margin: 0;
  padding: 4px 8px 1px 0;
}

#searchBar form input{
  color: #666666;
  font-size: 10px;
  left: 4px;
  width: 130px;
  margin: 2px 0;
  border: 1px solid black;
  border-bottom: none;
  border-right: none;
  padding: 1px 0 1px 3px;
}

#searchBar span {
  position: relative;
  top: -2px;
}

#searchBar a:link,
#searchBar a:visited { 
  color: white;
  text-decoration: none;
}

#searchBar a:hover { 
  color: rgb(208,174,100);
  text-decoration: none;
}

/*** General purpose styles ***/
/*** Styles that are pretty much global ***/

body {
	font-family: Arial, Helvetica, sans-serif; /* default font */
	font-size: 10pt; /* base font size */
	line-height: 1.25; /* base line spacing */
	color: rgb(135,120,45); /* default text color */
	text-align: left; /* default text alignment */
	margin: 0;
	padding: 0;
	border: 0;
	background: white;	  
	min-width: 820px; /* doesn't work for all browsers but sometimes helps keep browser chrome from intruding */
}

div#frame {
	width: 800px;
	background-color: rgb(255,254,241); /* default back ground for entire site; allows white to show around #frame */
	margin: 25px auto; /* puts #frame in the middle of browser window */
	padding: 0px;
	overflow: hidden;
	clear: both;
	border: solid 1px black;
}

p {
margin: 0;
}

/*** Quick and dirty attempt to style a horizontal rule; this is hard ***/
hr {
text-align: center;
border-top: 1px solid gray;
height: 0;
width: 75%;
margin-top: 1em;
margin-bottom: 1.5em;
}

h1 {
font-size:  1.5em;
font-weight: bold;
line-height: 1.2;
padding-top: .8em;
margin-bottom: .8em;
color: rgb(116,41,72);
margin: 0;
}

h2 {
font-size:  1.2em;
font-weight: normal;
line-height: 1.08;
color: rgb(88,87,93);
margin: 0 0 .5em 0;
padding-bottom: 0.25em;
border-bottom: 1px solid black;
}

h3 {
font-size:  1.2em;
font-weight: normal;
color: rgb(88,87,93);
margin: 0;
padding-bottom: 0.5em;
line-height: 1;
}

h4 {
font-size:  1.2em;
font-weight: normal;
color: rgb(169,120,45);
margin: 0;
padding-bottom: 0.25em;
}

h5 {
font-size:  1.1em;
font-weight: bold;
color: rgb(169,120,45);
margin: 0;
padding-bottom: 0.15em;
}

h6 {
font-size:  1em;
font-weight: normal;
color: rgb(88,87,93);
margin: 0;
padding: 0;
}

p.department_head {
font-size:  1.5em;
font-weight: normal;
color: rgb(88,87,93);
margin: 0;
padding-bottom: 0.25em;
border-bottom: 1px solid black;
}

p.byline {
font-size:  .8em;
font-weight: normal;
color: rgb(88,87,93);
margin: 0;
padding-top: 1em;
}

/*** Home page, Secondary page blurb links ***/
a.more:link,
a.join:link,
a.toc:link {
color: rgb(116,41,72);
text-decoration: none;
}

a.more:visited,
a.join:visited,
a.toc:visited {
text-decoration: none;
}

a.more:hover,
a.join:hover,
a.toc:hover {
color: rgb(181,182,184);
text-decoration: underline;
}

a:link {
color: rgb(133,115,99); 
text-decoration: none;
}

a:visited {
color: #999999;
text-decoration: none;
}

a:hover {
color: #990000;
text-decoration: underline;
}

/*** These three layout the central page area ***/

div#content { /* contains the next two DIVs below but NOT the footer */
/*background-color: rgb(255,254,0); /* TESTING - yellow so we can tell if layout is correct - comment out for production */
position: relative;
margin-right: 17px;
border-right: 1px solid black;
clear: both;
overflow: auto; /* remind browser that this DIV contains FLOATed content; see http://www.sitepoint.com/blogs/2005/02/26/simple-clearing-of-floats */
zoom: 1; /* give hasLayout for IE */
}

div#content_left { /* contains the main page content */
width: 561px;
border-right: solid 1px black;
float: left;
overflow: hidden; /* stops scrollbars from showing */
}

div#content_right { /* contains the right sidebar */
width: 220px;
margin: 0;
line-height: 1em;
float: left;
border-left: 1px solid black;
margin-left: -1px; /* trick so that border overlaps #content_left thus drawing border no matter which columnm is longer */
overflow: hidden; /* stops scrollbars from showing */
}

/*** Home page specific positioning ***/

div#content_cover {
padding: 8px 23px 8px 23px;
border-bottom: solid 1px black;
overflow: auto;
clear: both;
zoom: 1; /* give hasLayout for IE */
}

/* build the middle section of home page */
div#content_middle {
background-color: rgb(251,251,247);
padding: 0 23px 8px 23px;
zoom: 1; /* give hasLayout for IE */
}

div#content_focus {
padding: 0 0 8px 0;
zoom: 1; /* give hasLayout for IE */
}

div.content_row, div.content_ru_row {
padding: 8px 0;
border-bottom: 1px solid gray; /* border is over-ridden on last row by an inline style */
clear: both;
overflow: auto;
zoom: 1; /* give hasLayout for IE */
}
div.left_col {
float: left;
width: 48%;
zoom: 1; /* give hasLayout for IE */
}
div.right_col{
float: right;
width: 48%;
zoom: 1; /* give hasLayout for IE */
}
/*div.both_col{
width: 100%;
clear: both;
zoom: 1;
}*/

/*** Position and frame images for home page ***/
#content_cover img {
float: left;
background-color: white;
margin: 0;
padding: 6px 4px;
border: 1px solid black;
}

#content_focus img,
#content_upper img {
float: left;
display: inline;
background-color: white;
margin: 0;
padding: 5px;
border: 1px solid black;
}

.content_row img, /* have to use descendant selector instead of child selector; yet another IE bug */
.left_col img,
.right_col img {
float: left;
display: inline;
background-color: white;
margin: 0;
padding: 3px 2px;
border: 1px solid black;
}
/*
.both_col img {
float: left;
background-color: white;
margin: 0 12px 0 0;
padding: 4px 3px;
border: 1px solid black;
}*/

/*** Style the text blurbs for the  home and tertiary pages ***/
#content_cover h1,
#content_cover h2,
#content_cover p {
margin-left: 95px;
}

#content_focus h1,
#content_focus h2,
#content_focus p,
#content_upper h1,
#content_upper h2,
#content_upper p {
margin-left: 250px;
}

#content_header {
margin: 23px 23px 0 23px;
}

#content_header h1,
#content_header h2,
#content_header p {
margin-left: 23px;
}

.content_row h3, /* have to use descendant selector instead of child selector; yet another IE bug */
.left_col h3,
.right_col h3,
.content_row p, /* have to use descendant selector instead of child selector; yet another IE bug */
.left_col p,
.right_col p {
margin-left: 50px;
}

/* Point of view has special treatment; two color H3s */
.pov h3 {
color: rgb(116,41,72);
}

.pov h3 + h3 { /* as per usual IE6 doesn't support the adjacent child selector - done as inline style for now */
color: rgb(169,120,45);
}

/*** Tertiary page styling ***/

div#content_upper {
padding: 23px 23px 8px 23px;
border-bottom: solid 1px black;
zoom: 1; /* give hasLayout for IE */
}

/* This DIV holds the body of a CrossCurrents article */
div#content_body {
background-color: rgb(251,251,247);
padding: 30px 40px 30px 40px;
}

#content_body p {
margin-bottom: 1.5em;
}

/* Some special styles for special content */
div#content_body p.aboutAuthor {
font-style: italic;
}

div#content_body p.pullQuote {
margin-left: 40px;
margin-right: 40px;
padding: 20px 40px;
background-color: rgb(255,254,241);
border: 1px solid rgb(181,182,184);
}

div#content_body div.bottomBar {
color: black;
padding: 15px;
margin-top: 1em;
margin-bottom: 1em;
}

div#content_body div.odd {
border: 1px solid rgb(230,228,219);
background-color: rgb(230,228,219);
}

div#content_body div.even {
border: 1px solid rgb(230,228,219);
}

/*** Build the right side of all pages ***/

/*** Contains the print, addThis and RSS buttons; also pushes nav boxes down if present ***/
div#buttonBar {
position: relative;
width: 100%;
height: 23px;
padding-top: 6px;
padding-left: 2px;
background-color: rgb(181,182,184);
border-bottom: 23px solid rgb(255, 254, 241);
}

.blog_box,
.light_box,
.dark_box,
{
width: 100%;
margin-top: 0;
}

.blog_box h1 {
margin: 0;
padding: 3px 0 3px 25px;
border-top: 1px solid #333333;
border-bottom: 1px solid #333333;
font-size:10.5pt;
font-weight: normal;
letter-spacing: 0.2em;
color: white;
background-color: #6F1638;
}
.blog_box p {
margin: 0;
padding: 10px 5px 10px 25px;
color: #333333;
}

.light_box h1 {
margin: 0;
padding: 3px 0 3px 25px;
border-top: 1px solid #333333;
border-bottom: 1px solid #333333;
text-transform: lowercase;
font-size:10.5pt;
font-weight: normal;
letter-spacing: 0.2em;
color: black;
background-color: rgb(251,251,247);
}
.light_box p {
margin: 0;
padding: 10px 5px 10px 25px;
color: #333333;
}
.dark_box h1 {
margin: 0;
padding: 3px 0 3px 25px;
border-top: 1px solid #333333;
border-bottom: 1px solid #333333;
font-variant: small-caps;
font-size:10.5pt;
letter-spacing: 0.2em;
color: white;
background-color: rgb(181,182,184);
}
.dark_box p {
margin: 0;
padding: 10px 5px 10px 25px;
color: #333333;
}

div#footerWrapper {
background-color: rgb(208,174,100);
height: 15px;
padding: 2px 5px 0 5px;
clear: both;
}

#footerWrapper p {
margin: 0;
padding: 0;
font-family: 'Times New Roman', Times, serif;
font-size: .8em;
color: black;
}