/* colors 
medium grey #BFBFBF
light grey #EDEDED
yellow #EDECC8
*/

/* element-wise styles */

body, p, li, td, h1, h2, h3, h4, h5, h6, h7 {color: #211F16;}
body, p, li, td {font-family: Arial, Helvetica, sans-serif;}
h1, h2, h3, h4, h5, h6, h7, a, div.monospace * {
font-family: Courier New, Courier, monospace;
#font-family: monospace; /* in IE 7 and before only: use monospace so that the fonts are antialiased */
}

body {font-size:16px;}
h1   {font-size:180%;}
h2   {font-size:115%}
h3   {font-size:105%}
h4   {font-size:150%}
h4   {font-size:150%}
a img, a:active img, a:hover img, a:visited img, a:link img {border:0px;}
a {color:#757059}
a.external {padding-right: 15px; background: url('img/link-external.png') top right no-repeat; }
a:hover {background-color:#EDECC8; }
body, div {margin:0px;padding:0px;}
body {background-color: #bfbfbf;text-align:center;}
p, form div {margin: 0px 0px 0.8em 10px;}
h2 {text-decoration:underline;}
img.right {float:right;}



/* containers */

div.headercontainer, div.contentcontainer {
position:relative;
margin: 0px auto;
text-align:left;
width:760px;
padding: 0px 0px 0px 10px;
background:#EDEDED;
}

div.header, div.content, div.footer {width:750px;}
div.footer {padding:1.5em; text-align:center; font-size:90%;}

/* side gradient */
div.contentcontainer div.gradientleft, div.contentcontainer div.gradientright {
position:absolute;
width:100px;
height:100%;
top:0px;
background-repeat: repeat-y;
background-position: top center; 
_visibility:hidden; /* hide these pictures in IE6 since they don't repeat */
}
div.contentcontainer div.gradientleft {left:-90px;
background-image: url('img/gradient-left.gif');}
div.contentcontainer div.gradientright {right:-90px;
background-image: url('img/gradient-right.gif');}

/* containers and stuff*/
div.headercontainer {position:relative; background:#BFBFBF;height:199px;z-index:1;}
div.headercontainer img.top {position:absolute;z-index:1;top:0px;left:-90px;}
div.headercontainer a {position:absolute;z-index:2;display:block;height:85px;width:520px;top:0px;left:225px;background:none;text-decoration:none;}
div.headercontainer a img {position:absolute;top:15px;left:5px;}
div.contentcontainer {position:relative; z-index:2;}
div.header {position:relative; z-index:2; text-align:center;}
div.header p {padding: 110px 40px 0px 220px; font-size:23px; color:#4B4B4B;}
div.content {min-height:500px; height:auto !important; height:500px; }
div.content p, div.content li {text-align:justify;}

/* top menu */

table.topmenu {text-align:center;width:100%;position:relative;z-index:100;}
table.topmenu tr td {
margin:0px; padding:0px; height:43px;
color:#242424;
font-size:18px;
font-weight:bold;
font-family: Courier New, Courier, monospace;
#font-family: monospace;
}
table.topmenu tr td div.rel {position:relative; height:100%; }
table.topmenu tr td div a.title {display:block; margin:0px; padding:0px; text-decoration:none; background:none; color:#292929}
table.topmenu tr td div a.title:hover {color:#595840}
table.topmenu tr td div a#oneline  {padding:0.67em 0px 0.67em 0px;}
table.topmenu tr td div a#twolines {}

/* top menu - for the parentheses */
table.topmenu tr td div div.left  {position:absolute; left:0px; top:50%;}
table.topmenu tr td div div.right {position:absolute; right:0px; top:50%;}
table.topmenu tr td div div.left img,
table.topmenu tr td div div.right img {position:relative; top:-19px;}
table.topmenu tr td div div img {_visibility:hidden;} /* hide these pictures in IE6 since they look bad */

/* top menu - for the key picture */
table.topmenu tr td div div.key     {position:absolute; left:50%; top:-85px; text-align:center;} 
table.topmenu tr td div div.key img {visibility:hidden; position:absolute; z-index:1; left:-35px;}
table.topmenu tr td div div.key img.visible {visibility:visible; _visibility:hidden;} /* don't show in IE6 */

/* top menu- submenu */
table.topmenu tr td       div div.submenu {visibility:hidden; position:absolute; left:0px; top:100%; background:#E3E3E3; border:solid #717171; border-width:0px 1px 1px 1px;}
table.topmenu tr td.hover div div.submenu {visibility:visible;}
                          div div.submenu a {display:block; font-size:16px; text-decoration:none;border:solid #BFBFBF 1px;}


/* page content stuff */

div.section h3 {margin-bottom:0px;}
div.section address {margin-bottom:0.8em;}
div.section address a {font-style:normal;}
div.section img {border:solid 2px; border-color:#555138 #444336 #444336 #555138; margin: 0px 3px 3px 15px;}

table.event {width:100%;margin:0.8em 0px 0.3em 0px;}
table.event tr td.place {font-weight:bold; font-family: Courier New, Courier, monospace; #font-family: monospace;font-size:110%;}
table.event tr td.date {text-align:right; font-style:italic; white-space:nowrap;vertical-align:bottom; padding-right:20px;}

table.insideborder tr td {padding: 3px 10px 3px 10px; border:solid #BFBFBF; border-width: 1px 0px 0px 1px;}
table.insideborder tr:first-child td { border-top: 0px;}
table.insideborder tr td:first-child { border-left: 0px;}
table.insideborder tr td {_border:1px;} /* for IE6 only: can't do the first-child selector, so make the border everywhere */

li {margin-bottom:0.35em;}

h3.expander {cursor:pointer; margin-left:15px;}
h3.expander:hover {background:#EDECC8; }


li.program {}
li.program div.date {float:right; white-space:nowrap; font-style:italic; margin-left:10px;}
li.program div.name {font-size:110%; font-weight:bold; font-family: Courier New, Courier, monospace; text-align:left; cursor:pointer; }
li.program div.name:hover {background:#EDECC8; text-decoration:underline;}
li.program div.desc {clear:right;}


/* "top" links */
a.top, a.top:active, a.top:hover, a.top:visited, a.top:link {
float:right; font-size:80%; margin:1.5em 25px 0px 20px;
}