/********************************
  Basic HTML Styles
********************************/


h3 {
  color:#4B3A28;
		font-family:Geneva, Arial, Helvetica, sans-serif;
  font-size: 140%;
  margin-bottom: 0;
  font-variant: small-caps;
}

h4 {
  color: #555;
  font-size: 120%;
	text-decoration: none;
	margin-bottom: 0;
}

div.byline {
  margin-top: 0;
}

blockquote {
  font-size: 11px;
  color: #666666;
  background: #F8F8F6;
  padding: 10px 10px 10px 10px;
  text-align: left;
  border: 1px solid #E6E0D0;
  border-right: none;
  border-bottom-color: #F8F8F6;
  -moz-border-radius : 8px;
}
blockquote p { color: #666666; }
/*
  used for excerpts of preformatted text,
  like poetry, etc.
*/
blockquote pre, blockquote.poem {
  white-space: pre;
  font-family: Verdana,Georgia,sans-serif;
  font-size: 110%;
  width: 50%;
}

hr {
  width: 70%;
  height: 1px;
  border-bottom: none;
  border-left: none;
  border-right: none;
}

/* use for clearing elements */
hr.clear {
  visibility: hidden;
  clear: both;
  height: 1px;
  margin: 0;
  padding: 0;
  width: 90%;
}

/* 
  somewhere the cite element was set to be a smaller font-size.
  this is to revert it back to normal font-size, so that it can
  be used semantically
*/
/*.transcript cite,
.reflections cite,
.particulars cite,
#pageContent cite {
  font-size: 100% !important;
}*/

p.note { font-style: italic; }

/********************************
  Template
  Styles that apply to the 
  global site template
********************************/

.media_info {
  font-size: 80%;
  font-style: italic;
}

div#pageContent {
  padding: 10px;
}

#mainContent {
  padding: 5px;
  width: 758px;
}


#mainHeaderImage {
  background: transparent url(../images/main.jpg) top left no-repeat;
}

#programPageArea {
  width: 770px;
}

#programPageArea h2.secondary {
  width: 770px;
  height: 84px;
  margin: 0;
  background: transparent url(../images/secondary.jpg) top left no-repeat;
}
#programPageArea h2.secondary a,
#programPageArea h2.secondary a:hover
 {
  display: block;
  width: 770px;
  height: 84px;
  text-indent: -9999px;
  overflow: hidden;
  background: transparent url(../images/secondary.jpg) top left no-repeat;
}


#programPageArea #programOnDemand {
  background: #eee;
  padding: .8em 10px;
  line-height: 1.7em;
}

#programPageArea #programOnDemand .audio_links {
  float: left;
  width: 450px;
}
#programPageArea #programOnDemand .audio_links h4 {
  display: inline;
  font-variant: small-caps;
  font-size: 100%;
}
#programPageArea #programOnDemand .read_more {
  text-align: right;
}
#programPageArea #programOnDemand .read_more a { font-weight: bold;}
/********************************
  Program Index Page
********************************/


#mainContent.program_index_nav { padding: 5px 0; }
#mainContent.program_index_nav .program_index_column {
  float: left;
  width: 200px; 
  margin-left: 2px;
}
#mainContent.program_index_nav #first_column { width: 185px; }
#mainContent.program_index_nav #second_column { width: 325px; }
#mainContent.program_index_nav #third_column { width: 200px;}

#mainContent.program_index_nav ul.program_details_nav {
  list-style: none;
  padding: 0;
  margin: 0;
}
#mainContent.program_index_nav ul.program_details_nav li{

}

#mainContent.program_index_nav .nav_box {
/*  -moz-border-radius-bottomleft:8px;
  -moz-border-radius-bottomright:8px;
  -moz-border-radius-topleft:8px;
  -moz-border-radius-topright:8px;*/
  background: #fff;
  color: #000000;
/*  font-size: 11px;*/
  padding: 10px;
  text-align: left;
  margin-bottom: 5px;
}
#mainContent.program_index_nav .nav_box h3 {
  margin-bottom: 0;
  margin-top: 0;
  color:#000000;
  font-family:Geneva, Arial, Helvetica, sans-serif;
		font-size:13px;
  font-variant:small-caps;
  font-weight:bold;
}
#mainContent.program_index_nav .nav_box p {
  margin-top: 0;
  margin-bottom: 1em;
}


#mainContent.program_index_nav .nav_box .voice_image {
  border: 1px solid #777;
}

#mainContent.program_index_nav .nav_box .blog_image-left {
  border: 1px solid #777;
		margin: 0 5px 5px 0;
}

#mainContent.program_index_nav .nav_box .soundseen_image-left {
  border: 1px solid #777;
		margin: 0 5px 0px 0;
}

#mainContent.program_index_nav .nav_box .video_thumb {
  border: 1px solid #777;
  float: left;
  margin: 5px 10px 5px 0;
}

/********************************
  Particulars Page
********************************/

div.particulars { padding: 10px; }
.particulars cite { font-size: 100% !important; }

/* generic particular */
.particulars .particular {
}
.particulars .particular h4 {
  text-decoration: none;
  color: #000;  
  font-size: 110%;
  font-variant: small-caps;
  margin-bottom: 0;
  margin-top: 0;
}
.particulars .particular h4 .time { font-weight: normal; }

.particulars .particular p {margin-top: 0; margin-bottom: 0;}


/* musical element */
.particulars .musical_element {
  margin-bottom: 0;
}
.particulars .musical_element .album_art {
  float: left;
	margin-right: 5px;
}

/* HACK ALERT! */
* html .particulars .musical_element .album_art {
  margin-bottom: -15px;
}

.particulars .musical_element .album_art a,
.particulars .musical_element .album_art a:hover {
  border: 1px solid #f3f3f3;
	text-decoration: none !important;
	background: transparent !important;
}
.particulars .musical_element .album_art img {
  border:none;
}
.particulars .musical_element cite.song,
.particulars .musical_element cite.artist {
  font-style: normal;
}
.particulars .musical_element cite.album {}

.particulars .image {
  float: right;
  width: 320px;
  text-align: center;
  background: #ddd;
  margin: 10px;
  margin-right: none;
}
.particulars .image-wide img,
.particulars .image img {
  margin: 5px 5px 0px 5px;
  border: 5px solid #fff;
}
.particulars .image .caption,
.particulars .image-wide .caption {
  text-align: left;
  padding: 5px 10px;
}
.particulars .image .larger_image_link,
.particulars .image-wide .larger_image_link {
  text-align: right;
  padding: 5px 7px 3px 0;
}

.particulars .image-wide .caption p {
  margin-top: 0px; margin-bottom: .5em;
  width: 350px;
}

.particulars .image-wide .caption p,
.particulars .video .caption p {
  margin-top: 0px; margin-bottom: .5em;
  width: 400px;
}
.particulars .image .caption .cite { font-style: italic;}

.particulars .image-wide {
  float: right;
  width: 420px;
  text-align: center;
  background: #ddd;
  margin: 10px;
  margin-right: none;
}
.particulars .image-wide img {
  margin: 5px auto;
  border: 5px solid #fff;
}
.particulars .image-wide .caption {
  text-align: left;
  padding: 0 10px;
}
.particulars .image-wide .caption .cite { font-style: italic;}

.particulars .video {
  float: right;
  width: 425px;
		margin-left: 10px;
  margin-bottom: 10px;
		background-color: #ddd;
  border: 5px solid #ddd;
}

.particulars .video-kamen {
  float: right;
  width: 332px;
		margin-left: 10px;
  margin-bottom: 10px;
		background-color: #ddd;
  border: 5px solid #ddd;
}

.particulars .video .caption {
  margin-top: .5em;
  margin-bottom: 0;
}

.particulars .video-kamen .caption {
  margin-top: .5em;
  margin-bottom: 0;
}

/********************************
  Reflections Page
********************************/

.reflections .reflection {
  margin: 2em 0;
}
.reflection h3 {
  font-size: 110%;
  display: inline;
}
.reflection h4.date {
  font-size: 100%;
  font-weight: normal;
  text-decoration: none;
  display: inline;
  margin-left: .5em;
}
.reflection blockquote { margin: .5em 0; padding: 0 .5em;}
.reflection blockquote p { margin: .5em 0; }

.reflection address { margin-bottom: 2em; }
.reflection address .name {}
.reflection address .location,
.reflection address .station {
  font-style: normal;
}

.reflection .image-profile {
  float: left;

  text-align: center;
  background: #ddd;
  margin: 0 10px 10px 0;
}
.reflection .image-landscape {
  float: left;

  text-align: center;
  background: #ddd;
  margin: 0 10px 10px 0;
}
/********************************
  Transcripts Page
********************************/

/* parent div for transcript */
div.transcript { padding: 10px; }

/* broadcast date */
.transcript h4.broadcast_date {
  margin-top: .5em;
  font-size: 80%;
  font-weight: normal;
}

/* use to label voices in transcript */
.transcript .voice_label {
  color: #4B3A28;
  font-weight: bold;
  font-variant: small-caps;
  font-weight: normal;
  font-size: 125%;
}

/* SCRIPTED DIALOGUE */
.transcript div.scripted {}
.transcript div.scripted blockquote { font-size: 100%; } /* mainly a bugfix for safari */

/* INTERVIEW DIALOGUE & READINGS */
.transcript blockquote.interview {
  padding-top: 0;
		padding-bottom: .5em;
		}
.transcript blockquote.reading {
  padding-top: 0;
		padding-bottom: .5em;
		background-color: #f3f3f3;
		border: 1px solid #999999;}
.transcript blockquote.interview p,
.transcript blockquote.reading p {
  color: #666;
  margin-top: .5em;
  margin-bottom: 1.5em;
}

/********************************
  Credits
********************************/
.credits {
    padding:10px;
}

.credits .column {
  width: 25%;
  margin-right: 5%;
  float: left;
}

.credits h4 {
  font-size: small;
  margin: 0;
/*  text-transform: uppercase;*/
  font-weight: bold;
  color: #000;
}
.credits p { margin-top: 0; }

/********************************
  Lists
********************************/

.links {
  
}

.links h4 {
  margin-bottom: 0;
/*  font-weight: normal;*/
  color: #777;
}
.links dl { margin-top: .25em;}
.links dt { margin-top: 0;}
.links dt a, .links dt a:hover { font-weight: bold !important;}
.links dd.text_link { font-style: italic; color: #555; margin: 0; }
.links dd.description { margin: .25em 1em 1em 1em;}

/********************************
  Lists
********************************/

.lists { }
.lists cite { display: block;}
.lists cite .artist,
.lists cite .song,
.lists cite .label,
.lists cite .publisher,
.lists cite .author,
.lists cite .isbn { font-style: normal;}

.lists #books {
  margin-top: 1em;
  margin-bottom: 1em;
}
.lists #books .book {
  width: 360px;
  margin: 10px 10px 10px 0;
  float: left;
}
.lists #books .book a.image_link:hover { background: transparent;}
.lists #books .book img { 
  border: none;
  float: left;
  margin: 0 5px;
}


.lists #music {
  clear: both;
  margin-bottom: 1em;
}
.lists #music .album {
  width: 360px;
  margin: 10px 10px 10px 0;
  float: left;
}
.lists #music .album a.image_link:hover { background: transparent;}
.lists #music .album img { 
  border: none;
  float: left;
  margin: 0 5px;
}

/********************************
  Krista's Journal
********************************/

#mainContent.journal {}
#mainContent.journal h3 { margin-bottom: 0;}