/*this is screen comment*/ 
 a:link { text-decoration: none; color: #1c128d; }
 a:visited { text-decoration: none; color: #0000CD ;}
 A:active { text-decoration: none; color: #800080 ; } 
 a:hover { text-decoration: underline;} 
/*  a:hover img{ border-bottom: 1px dashed blue; background-color: #D7FBFD; } */
HR {color: #fff; background-color: #fff; border: 2px dotted #ff9900; border-style: none none dotted;  /*height: 4px; color: #FF9900; border-bottom: 4px solid #FF8000; border-left: 0px; border-right: 0px; border-top: 0px;*/} 
html {}
div#homeimage {width:380px;max-width:380px;overflow: hidden;border: 1px solid white;text-align:center;}
body { font-family:  Arial, Verdana, Trebuchet MS, Helvetica, Sans-serif; 
margin: 0px 0px 0px 0px; font-size: 15px;
background: url("/images/bkgd.gif") repeat;
}
.gbookthumbnail {display:inline;padding:5px;Margin:3px;}
#skiplink {float: left;color: white;position:absolute;top:0px;}
#footwidth {border: 0px;padding:0px;margin: 0px 600px 0px 0px;}
#footer {color:dimgray; border-top:14px solid #ebebeb; width:1024px;}
#footer a:link { text-decoration: underline; color: #4a519f; }
#footer a:visited { color: #4a519f;}
#footer a:active {  color: #4a519f; } 
#footer a:hover { }
 TD, TR {text-align: left; font-size: 13px;
font-family: Verdana, Arial, Trebuchet MS, Helvetica, Sans-serif;}
 h1 { font-size: xx-large; font-weight: 700; color: #FF8000; margin: 25px 0px 15px 0px;text-shadow: 0px 2px 2px #b9b9b9;}
 h2 { font-size: x-large; font-weight: 700; color: #FF8000; margin: 25px 0px 15px 0px;text-shadow: 1px 1px 1px #b9b9b9;}
 h3 { font-size: large; font-weight: 700; margin: 20px 0px 5px 0px;}
 h4 { font-size: medium; font-weight: 700; }

 TH {text-align: center; }
 UL {margin-top: 3px; margin-bottom: 3px;}
/* hours */
.thedate {color:black;font-weight:normal;}
.regularday {color:darkblue;font-size:large;}
.regularhours:before { content: ': '; }
.specialday {color:red;display:block;font-size:large;}
.specialhours {color:red; font-size:large;}
.closed {color:red;display:block;font-size:large;}
.lateroom {color:darkblue;}
.latehours {color:darkblue;}
.lateclosed {color:darkblue;}
.ref {color:darkblue;}
.refhours {color:darkblue;}

#smallscreenlink {display: none;}
#pagewidth {width: 70%;position:relative;top:-10px;}
#emptycell {height:685px;width:1px;margin:-10px;border: 1px solid white;}
#emptycell TD {padding: 0px;margin:-10px;}
#contentcell  {padding: 5px 5px 5px 12px; border: 1px solid white; background-color: white; 
font-size:15px; font-family:  Arial, Verdana, Trebuchet MS, Helvetica, Sans-serif;
 }
#contentdiv {position:relative;}
#indexcolums {
background-color: white;
    border: 0 solid #003399;
    font-size: 12px;
    margin: 4px;
    padding: 10px 20px;
}
#indexcolums a {font-size:12px;font-family: Tahoma, Arial, Verdana, Trebuchet MS, Helvetica, 
Sans-serif; line-height:1.8;}

/* fonts and text colors forground bacground combos */ 

 .menufont { font-family: verdana, geneva, sans-serif; font-size: 10px; font-weight: bold; color: #FF6600;}
 .smallfont {font-family: verdana, arial, geneva, sans-serif; font-size:10px; font-weight: bold;}
 .serif {font-family: Georgia, Garamond, Book Antiqua, Palatino, Times New Roman, Times Roman, Serif;}
 .fixedwidth { font-family:  OCR A Extended, Lucida Console, Lucida Sans Unicode, Andale Mono, Monaco, Courier New, Monospace;}
 .handwritten { font-family: Lucida Handwriting, Monotype Corsiva, Apple Chancery, Comic Sans MS, Cursive;}

 .menucolors { color: white; background-color: #1958b7; font-weight: 700;}
 .nporangetext { color: #FF8000; font-weight: 700;}
 .redtext { color: red; font-weight: 700;}
 .grayback { color: black; background-color: #D3D3D3; font-weight: 700;}
 .tanback { color: black; background-color: #f7f2da; font-weight: 700;}
 .highlight { color: black; background-color: #7FFFD4; font-weight: 700;}

 table {border-collapse: collapse; empty-cells:show;}

 img {border:0;}

/* Photo Zoom CSS */ 
 #zoom {display:image;float:right; border:1px solid blue;font-size:12px;line-height:1em;text-align:center;background-color:white; }
 #zoom:hover { position:absolute;right:5px;box-shadow: 3px 3px 3px #b9b9b9;}
 #zoom a span {display: none}
 #zoom a:hover span {display: inline}
 #zoom a img { height:94px; width:125px; border:3px solid white; margin:0 0 0px 0px; }

 #zoom a:hover img { width:auto; height:auto; }
 /* The rule below makes the effect work in IE */ 
#zoom a:hover div { padding:0; }
 /* End Photo Zoom CSS */ 

#stllogo img:hover { background-color: #D7FBFD; } 

 .tablewhite TD { padding: 3px 3px 3px 3px; border: 3px solid white;}
 .tableorange TD { padding: 3px 3px 3px 3px; border: 2px solid #FF8000;}
 .tableblue TD { padding: 3px 3px 3px 3px; border: 2px solid #000099;}
 .tablegray TD { padding: 3px 3px 3px 3px; border: 2px solid gray;}
 .tabledotted TD { padding: 3px 3px 3px 3px; border: 1px dotted gray;}
 .tableblack TD { padding: 3px 3px 3px 3px; border: 1px solid black;}
 .tablereverse TD { background-color: #D3D3D3; padding: 3px 3px 3px 3px; border: 3px solid white;}

/*th {padding: 3px 4px 4px 4px;} Sortable tables */
table.sortable thead {
    background-color:#eee;
    color:darkblue;
    font-weight: bold;
    cursor: pointer;
text-decoration:underline;

}

/* plain list sublist lists */
ol {list-style-type: decimal;}
ol ol { list-style-type: lower-alpha;}
ul {list-style-type: square; }
ul ul {list-style-type: circle;}

.linklist a:link { border-bottom: 1px dotted blue; color:blue;}
.linklist a:active  { border-bottom: 1px dotted blue; color:blue;}
.linklist a:visited  { border-bottom: 1px dotted blue; color:blue;}
.linklist a:hover { border-bottom: 2px solid darkblue; color:darkblue; text-decoration:none;}

ul.linklist { list-style-image: url(/images/bullets/bullet_square_blue.png);line-height: 1.4em; }
ul.linklist li {line-height: 2.2;}
ul.linklist ul { list-style-image: url(/images/bullets/bullet_triangle_blue.png); line-height: 1.4em;}

ul.bluelist { list-style-image: url(/images/bullets/bullet_square_blue.png);line-height: 1.4em; }
ul.bluelist li {line-height: 1.6;}
ul.bluelist ul { list-style-image: url(/images/bullets/bullet_triangle_blue.png); line-height: 1.4em;}

ul.orangelist { list-style-image: url(/images/bullets/bullet_square_orange.png);line-height: 1.4em; }
ul.orangelist li {line-height: 1.6;}
ul.orangelist ul { list-style-image: url(/images/bullets/bullet_triangle_orange.png); line-height: 1.4em;}

ul.roomylist { line-height: 1.4em; }
ul.roomylist li {line-height: 1.6;}
ul.roomylist ul { line-height: 1.4em;}

ul.roomierlist { line-height: 1.4em; }
ul.roomierlist li {line-height: 2.2;}
ul.roomierlist ul { line-height: 1.4em;}

ol.roomylist { line-height: 1.4em; }
ol.roomylist li {line-height: 1.6;}
ol.roomylist ol { line-height: 1.4em;}

ol.roomierlist { line-height: 1.4em; }
ol.roomierlist li {line-height: 2.2;}
ol.roomierlist ol { line-height: 1.4em;}

/* classes for alignment and justify */  /*/*/
 .center { text-align: center; }
 table.center {clear: left;clear: right; margin-left: auto; margin-right: auto; text-align: right;} 
 tr.center TD { text-align: center; }
 img.center {display: block; margin-left: auto; margin-right: auto;}
 div.center {text-align: center;} 
 div.center table {margin: auto; text-align: left;} 
  
 .right { text-align: right; } 
 table.right { margin-left: auto; margin-right: 0px; text-align: right; }
 tr.right TD { text-align: right; } 
 img.right {display: block; margin-left: auto; margin-right: 0;}
 HR.right {display: block; margin-left: auto; margin-right: 0;}
 div.right {text-align: right; } 
 div.right table {margin-left: auto; margin-right: 0; text-align: left;} 
 
 .left { text-align: left; } 
 table.left { margin-left: 0; margin-right: auto; text-align: left; } 
 tr.left TD { text-align: left; }
 img.left {display: block; margin-left: 0; margin-right: auto;}
 HR.left {display: block; margin-left: 0; margin-right: auto;}
 div.left {text-align: left;} 
 div.left table {margin-left: 0; margin-right: auto; text-align: left;} 
 
 .justify {text-align: justify;}
 
 .floatright { display: inline; float: right; }
 .floatleft { display: inline; float: left; }

 
/* blockquote and indented text in css classes -margin numbers run- top right bottom left div { margin: 0px 0px 0px 0px ; padding: 0px 0px 0px 0px ;} */ /*/*/

 div.indent { margin: 10px 0px 10px 35px ;}
 p.indent {text-indent: 35px;}
 div.blockquote { margin: 10px 35px 10px 35px ;}
  p.blockquote { margin: 10px 35px 10px 35px ;border-left:1px dotted gray;border-right:1px dotted gray;}
 a:hover { text-decoration: underline;} 

/* top of page */
#headercontainer { 
  background: url(/images/bkgd.gif) repeat;
}
#homelink {
display:block;float:left; 
width:260px;height:87px;
position:absolute;z-index:20;}

#header {
  background-image: url(/images/logo.gif);
  background-position: left;
  background-repeat: no-repeat;
  height: 155px;
  margin-left: auto;
  margin-right: auto;
  width: 1024px;
 }

#header .search, #header .submit { Border: 1px solid #c0c1c3; width: 108px;
font-size:12px;
color:#004080;
-moz-border-radius:5px;
-webkit-border-radius:5px; 
border-radius:5px;}

#topsearchbox {float:right; margin: 0 16px 0 0;padding: 0px;position:relative;z-index:101;}
#topsearch {text-align: right;font-size:12px;color:#004080; }

 /* IDs and classes for navigation elements and menus and buttons */ 
/* These styles create the dropdown menus at the top. */


#top_menu_container {position:absolute;
left:50%;

display: table;
    margin-left: 98px;
    padding-top: 1px;
    text-align: right;
    width: 420px;
    z-index: 100;}
#top_menu {position:relative;
top:95px;
z-index:99;}
/*#top_menu {position:relative; top:-1.6em;z-index:99;}
#top_menu_container {display:table;width: 1024px;text-align: right;z-index:100;}*/
#topmenustyle, #topmenustyle ul { /* all lists */
 padding: 0; margin: 0; list-style: none; line-height: 1.2;/*text-align: center; */
}

#topmenustyle a {/* width: 10em; */
 display: block; display: block; padding: 3px 8px;color: #fff; 
text-decoration: none; background-color: #ff8000; 
-moz-border-radius-topleft:5px; -moz-border-radius-topright:5px;
-webkit-border-top-left-radius:5px; -webkit-border-top-right-radius:5px;
border-top-left-radius:5px; border-top-right-radius:5px;

}

#topmenustyle li { /* all list items */
 float: left; font-weight: bold; color:white;font-family: arial,helvetica,sans-serif;font-size: 13px;
border-left: 3px solid transparent;border-right: 3px solid transparent;
/* width: 10em; width needed or else Opera goes nuts */ }

#topmenustyle li li a { display: block; padding: 3px 8px; background-color: #ff8000;
    color: #000; text-decoration: none; border-left: 0px none transparent;border-right: 0px none transparent; 
-webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;}
#topmenustyle li li {float: none; }
#topmenustyle li ul { /* second-level lists */
 position: absolute;  width: auto; background-color: #ff8000;
 left: -999em; /* display: none isn't read by screen readers */ 
-webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;
}

#topmenustyle li:hover ul, #topmenustyle li.sfhover ul { /* lists nested under hovered list items */
 left: auto; color: #fff; background-color:#ff8000;  }

#topmenustyle li:hover li, #topmenustyle li.hover li { float: none; padding: 3px;}
#topmenustyle li:hover li a, #topmenustyle li.hover li a {
    border: 1px solid #fff; color: #fff; background-color:#ff8000;  }
#topmenustyle li li a:hover {  background-color:#4a7eb3;  }


/* side menus with rolover */ /*/*/
#menu {
border: 0px solid white;
}
#left_menu {width:16%;
border: 0 solid navy;
    padding: 10px 20px;
    width: 16%;
}

left_menu {
   margin-left: auto; margin-right: auto;margin-top: auto;
   margin-bottom: 0px; padding-bottom: 0px;text-align: left;
   width: 730px;
 } 

 #menu {
   float: left; padding: 0px;margin-right: -10px;
   text-align: left;
   width: 155px;
 } 

 #menu a:link, #menu a:visited {
   color: #2840b0; font-weight: 600;
   text-decoration: none; font-size: 12px;
   line-height: 16px; font-family: Verdana, Trebuchet MS,Arial,  Helvetica, Sans-serif;
   } 

 #menu a:hover{
   text-decoration: none; border-bottom:2px dotted;width:100%; margin-bottom:2px;
 } 

#menu ul{
  list-style: none;
  margin: 0px;
  padding: 0px;
  padding-left: 12px;
  text-indent: -15px;
}

#menu li {
  padding-bottom: 10px;
}

#menu p, #menu ul, #menu li {
  color: #FF6600;
  line-height: 16px;
}


 /* NAVAGATION BUTTONS VERTICAL AND HORIZONTAL */ /*/*/

/* Turn any list into horizontal buttons like on RES AREA PAGES just add id="buttons" to the UL tag */ /*/*/
 
 #hbuttons { margin-left: 0px; padding-left: 0px;}
 #hbuttons li {list-style-type: none; display: inline; font-weight: bold;  margin: 4px 4px;border-radius:8px; }
 #hbuttons li a { border-radius:8px;white-space: nowrap; color:#ffffff; font-size: 12px;  background-color:#1958b7;
 text-decoration: none; border: 2px solid #FFFFFF; padding:5px 8px;
 box-shadow: 2px 2px 2px #b9b9b9;}
 #hbuttons li a:hover { color: #fff; background-color: #2586d7; text-decoration: underline; border: 2px solid blue;}


/* This turns a list into vertical 3D buttons just add id="buttonlist" to any list */ /*/*/
  ul#buttonlist
  { text-align: left; list-style: none; padding: 0; margin: 0 ; width: 225px; 
    font-family: georgia, serif; font-size: 13px; text-transform: capitalize; }
  
  ul#buttonlist li
  { display: block; margin: 7px 7px ; padding: 0; } 
  
  ul#buttonlist li a
  { display: block; width: 100%; padding: 0.5em 0 0.5em 0.5em; border-width: 2px;
  border-color: #ffd #aaab9c #ccc #ffd; border-style: solid; color: #3366FF;
  text-decoration: none; background: #f7f2ea; }
  
  ul#buttonlist li a:hover, ul#navlist li#active a:hover
  { color: #3366FF; background:  #f7f2da; border-color: #aaab9c #ffe #ffe #ccc; 
  text-decoration: underline; font-weight: bold;}

  a.buttonlink
  {height: auto; white-space: nowrap; Margin:3px; padding: 0.5em 1em 0.5em 1em; border-width: 2px;
  border-color: #ffd #aaab9c #ccc #ffd; border-style: solid; color: #3366FF;
  text-decoration: none; background: #f7f2ea; 
  font-family: georgia, serif; font-size: 13px; text-transform: capitalize; }
  
  a:hover.buttonlink 
  { color: #3366FF; background:  #f7f2da; border-color: #aaab9c #ffe #ffe #ccc; 
  text-decoration: underline; font-weight: bold;}

