/* CSS for audio page: layout, navigation and styles for main tables 
** Version for PHP database-enabled rewrite supporting tabbed navigation.
** Goring Free Church
** Helen A. August 2008 
*/

BODY {
font-family: Arial, Sans-Serif;
/* Default font size in points rather than pixels to assist text resizing in IE */
font-size: 10pt;   
background-color: #ffffcc;  /* match rest of site */
color: black;
margin: 0px;
padding: 0px;
}

/* Default link styling */
a {
  color: red;
  font-weight: bold;
  text-decoration: none;
}
a:hover{
  text-decoration: underline;
}
a:visited {
  color: #999999;
}

.title_panel {
width: 785px;
position: absolute;
height: 90px;
text-align: center;
margin-top: 12px;
margin-left: 10px;
}

.title_panel SPAN#heading {
display: block;
padding-top: 15px;
font-size: 22pt;
font-weight: bold;
color:#365f91;
font-family:Cambria, Times, serif;
}

/* Navigation panel with newspaper-style buttons where the background
   is clickable as part of the link. */
#navpanel {
position: absolute;
LEFT: 20px; 
WIDTH: 110px; 
TOP: 120px;
}

#contentpanel {
position: absolute;
LEFT: 160px; 
WIDTH: 755px; 
TOP: 85px
}

.navbuttons {
   border: 1px solid #000000;
   width: 100%;
}

/* All buttons have lower border */
.navbuttons a
   {border-bottom: 1px solid #000000;
   color:black; 
   background: #fdefb9; 
   text-decoration: none;
   font-weight: normal;
   text-align: center;
   vertical-align: middle;
   padding: 1px 0px 2px 0px; 
   display:block;
}

.navbuttons a:hover {
   background:#e1b47c;
}

.navbuttons a.lastlink {
   border-bottom: none;
} 

#intro_text {
width: 480px;
float: left;
margin: 0px 0px 10px 0px;
font-size: 10pt; 
text-align: justify;
}

#instr_text {
width: 200px; 
float: right; 
margin: 0px 0px 10px 0px;
font-size: 8pt;
text-align: justify;
padding: 10px 20px 15px 20px;
border: solid 1px #000000;
background-color: #fdefb9;
}

#instr_text ul {
  margin: 5px 0px 5px 15px;
  padding: 0px;
  font-weight: bold;
}

/* Break to force DIVs back into flow after floats */
br.clear {
  clear: both;
  font-size: 10px; /* min. height overriding font size */
}

/* CSS for main tab */
/* Date selection box */
#maintabdates {
margin: 0px;
text-align: center;
padding: 0px 0px 10px 0px;
}

#maintabdates FORM {
display: inline;
padding: 1px; 
margin: 0px;
line-height: 2.5; /* to separate it from the text above */
}
/* for advisory messages e.g. if no sermons found */
#maintabmsg {
text-align: center;
}

/* All tables have collapsible borders */
/* Default tables are constrained by DIV width */
TABLE {
   border-collapse: collapse;
   border: solid black 1px;
}

TABLE.sermontab {
  font-family: Verdana,sans-serif; 
  font-size: 10pt; 
}

TD {
  border: solid black 1px;
  text-align: left; 
}

/* DIV containing list of series */
#seriestab {
   padding: 0px 30px 0px 0px;
   margin: 0px;
   border: 0px;
   width: 290px;
   float: left;
}
/* DIV containing series recordings */
#seriesrecs {
   padding: 0px;
   width: 430px;
   float: right;
}

#seriestab .seriesdesc {
   font-style: italic;
   background-color: #ffffcc;
}

/* Container for search forms for more search criteria */
#msearchbox {
   padding: 0px 30px 0px 0px;
   margin: 0px;
   width: 290px;
   float: left;
}
#msearchbox TABLE {
   width: 100%;
   margin-bottom: 20px;
}
#msearchbox TD {
   border: 1px solid #000000;
   padding: 10px 10px 15px 10px;
   margin: 0px;
   text-align: center;
}

#msearchbox FORM {
padding: 0px; 
margin: 0px;
}

/* DIV containing recordings found by search criteria*/
#msearchrecs {
   padding: 0px;
   margin: 0px;
   border: 0px;
   width: 430px;
   float: right;
}
#faqlist ul{
   color: #365f91;
   margin: 5px 0px 5px 60px;
   padding: 0px;
   
}
#faqlist a {
   color:#365f91;
   font-size: 12pt;
   font-weight: bold;
   text-decoration: none;
}
#faqbody {
   text-align: justify;
}

#faqbody .faqheading {
   font-size: 12pt;
   font-weight: bold;
}

/* Lists within the body of the text */
#faqbody ul {
  margin: 5px 0px 5px 15px;
  padding: 0px;
}

/* Set high minimum widths to stop IE expanding button columns. These
   need to be higher than the total table or DIV width so that this acts as 
   the constraint. */
TD.datecol {
WIDTH: 90px;
FONT-WEIGHT: bold; 
PADDING: 0px 0px 0px 3px;
vertical-align: top;
}

TD.itemdesc {
width: 260px;
padding: 0px 0px 0px 5px;
vertical-align: bottom;
}
TD.heading {
font-weight: bold;
text-align: center;
}
.itemdesc .book_text {
   COLOR: red;
   FONT-WEIGHT: bold;
}
/* override link colour for Bible text. Text decoration is inherited. */
.itemdesc .book_text A, .itemdesc .book_text A:visited {
   COLOR: red;
   FONT-WEIGHT: bold;
   text-decoration: none;
}

.itemdesc .preacher {
   FONT-STYLE: italic;
}
.itemdesc .occasion {
   COLOR: green;
}

TD.mp3button {
  text-align: center; 
  vertical-align: middle; 
  border-right: 0;
  PADDING: 3px 3px 0px 3px;
}
TD.realbutton {
  text-align: center; 
  vertical-align: middle; 
  border-left: 0;
  PADDING: 3px 3px 0px 3px;
}

/* for missing audio files */
.mp3button .notfound, .realbutton .notfound {
   color: red;
   font-size: 8pt;
}

TD.norec {
  text-align: center; 
  vertical-align: middle; 
  font-size: 8pt;
  color: #808080;
}

IMG.audiobutton {
  border: 0;
}

/* for database error message */
.errmess {
   padding: 10px;
   margin-top: 20px;
   border: 1px solid red;
   background: #ffffff;
}

/* div after this one seems to be calculated from text not from bottom of div,
so can overlap without this */
#tabsbar {
padding-bottom:35px;
}

/* orig has background URL with bottom border for div */
#tabsbar .tabs{
float:left;
width:100%;
background:#fdefb9 url("img/tab_bak.gif") repeat-x bottom;
border-left: solid black 1px;
border-right: solid black 1px;
border-top: solid black 1px;
padding:0px;
line-height:normal;
}

/* Top margin allows for small gap below top border of background */
#tabsbar .tabs ul {
margin:0px 0px 0px 0px;
padding:0px 0px 0px 50px;
list-style:none;
}

/* adjust the lhs padding according to width of lhs gif */
#tabsbar .tabs li {
float: left; 
margin:0px; 
padding:0px 0px 0px 5px; 
cursor:pointer;}

#tabsbar .tabs a {
display: block; 
padding:7px 15px 8px 6px;
text-decoration:none; 
color: black; 
font-size: 11pt;
font-weight: normal;}
 
#tabsbar .tabs .tabnosel {
background:url("img/tab_nosel_left.gif") no-repeat left top;
}

#tabsbar .tabs .tabnosel a {
background:url("img/tab_nosel_right.gif") no-repeat right top;
}

#tabsbar .tabs .tabsel {
background:url("img/tab_sel_left.gif") no-repeat left top;
}

#tabsbar .tabs .tabsel a {
background:url("img/tab_sel_right.gif") no-repeat right top;padding-bottom:9px;
}

#tabsbar .tabs a:hover {
border:0
}