body { font-family: Tahoma, Arial, sans-serif; font-size: medium; border: 0px; margin: 0px; padding: 0px; }
H1 { font-size: large; font-weight: bold; }
H2 { font-size: medium; font-weight: bold; }

.menu-body { color: #004400; background-color: #ffffcc; background-image: url("images/menu-back.png"); }
.content-body { color: #004400; background-color: #ffffcc; text-align: justify; background-image: url("images/menu-back.png"); background-repeat: repeat-y; }

#banner { width: 100%; height: 100px; border: 0px; padding: 0px; margin: 0px; margin-bottom: 10px; }
#top-fade { position: absolute; color: #004400; background-color: #bbcc00; background-image: url("images/banner-back-short.png"); background-repeat: repeat-x;
 width: 100%; height: 100px; top: 0px; left: 0px; margin: 0px; }
#corner-fade { position: absolute; color: #004400; background-color: #bbcc00; background-image: url("images/corner-back-short-full-fade.png"); background-repeat: no-repeat;
 width: 200px; height: 100px; top: 0px; left: 0px; margin: 0px; }
.banner-content { position: absolute; width: 100%; height: 100px; }
.banner-logo-l { height: 67%; }
.banner-logo-r { float: right; height: 60%; }
.banner-l { float: left; margin-top: 5px; margin-left: 1%; width: 190px; height: 95px; z-index: 2; }
.banner-r { float: right; margin-top: 15px; margin-right: 1%; width: 300px; height: 85px; z-index: 2; }
.tagline { text-align: right; clear: both; font-size: 16px; margin-top: -4px; margin-right: 0px; padding-top: 0px; }
#remainder { border: 0px; margin: 0px; padding: 0px;}
#main { width: 100%; border: 0px; margin: 0px; padding: 0px; vertical-align: top; }
#menu { float: left; width: 200px; text-align: left; vertical-align: top; margin-left: 10px;  }
#content { margin-left: 250px; padding-right: 50px; margin-top: 0px; }
#content H1 { margin-bottom: 0.5em }
#content P { margin-top: 0.5em }
#footer { position: relative; margin-top: auto; margin-bottom: 0px; height: 100%; width: 99%; clear: both; margin-top: 4ex; text-align: right; font-size: xx-small; }
#footer-content { position: relative; bottom: 10px; left: 0px; width: 100%; }
.select { height: 4ex; width: 180px; color: #bbcc00; background-color: #bbcc00; margin-top: 0px; }
.select-after-sub { height: 4ex; width: 180px; color: #bbcc00; background-color: #bbcc00; margin-top: 1.1em; }
.select-link:link { position: relative; top: 0.2em; color: #004400; text-decoration: none; }
.select-link:visited { position: relative; top: 0.2em; color: #004400; text-decoration: none; }
.select-link:active { position: relative; top: 0.2em; color: #004400; text-decoration: none; }
.select-link:hover { position: relative; top: 0.2em; color: #004400; text-decoration: underline; }
.select-link:focus { position: relative; top: 0.2em; color: #004400; text-decoration: underline; }
.selected { height: 4ex; width: 200px; color: #ffffcc; background-color: #ffffcc; margin-top: 0px; }
.selected-with-sub { height: 4ex; width: 200px; color: #ffffcc; background-color: #ffffcc; margin-bottom: 0.1em; }
.selected-link { color: #004400; position: relative; top: 0.2em; }
.selected-link-with-sub { color: #bbcc00; position: relative; top: 0.2em; }
.sub-select { height: 3.2ex; width: 160px; color: #bbcc00; background-color: #bbcc00; margin: 0.4em 0em 0.4em 20px; }
.sub-selected { height: 3.2ex; width: 180px; color: #ffffcc; background-color: #ffffcc; margin: 0.4em 0em 0.4em 20px; }
.free-standing-image { display: block; margin-left: auto; margin-right: auto; width: 30%; padding: 5px; border-style: solid; border-width: 1px; border-color: #004400; }
.left-float-image { float: left; margin: 0ex 2ex 1ex 0ex; padding: 5px; border-style: solid; border-width: 1px; border-color: #004400; width: 20%; }
.right-float-image { float: right; margin: 0ex 0ex 1ex 2ex; padding: 5px; border-style: solid; border-width: 1px; border-color: #004400; width: 20%; }
A:link { color: #004400; text-decoration: none; }
A:visited { color: #004400; text-decoration: none; }
A:active { color: #004400; text-decoration: none; }
A:hover { color: #004400; text-decoration: underline; }
A:focus { color: #004400; text-decoration: underline; }
.visible-link:link { color: #004400; text-decoration: underline; }
.visible-link:visited { color: #004400; text-decoration: underline; }
.visible-link:active { color: #004400; text-decoration: underline; }
.invisible-image-link { text-decoration: none; }
.invisible-image-link IMG { border: thin transparent solid; }
.invisible-image-link IMG:hover { border: thin #004400 solid; }
.invisible-image-link IMG:focus { border: thin #004400 solid; }
.wcag { float: left; margin-left: 45px; vertical-align: bottom; border: 0 }
.image-table { text-align: center; margin: 0px; padding: 0px; }
.image-table p { display: inline; }
.image-table span { margin: 0 5px 5px 5px; display: table-cell; display: inline-table; display: inline-block; vertical-align: top; }
.image-table img { margin-bottom: 5px; margin-top: 15px; }
.inline-block { display: table-cell; display: inline-table; display: inline-block; vertical-align: top; }

@media handheld
{
  .content-body { background-image: url("images/menu-back-thin.png"); }
  #corner-fade { background-image: url("images/corner-back-thin-full-fade.png"); width: 150px; } 
  .banner-logo-r { display: none; }
  .banner-r { display: none; }
  #menu { width: 150px; margin-left: 0px; }
  #content { margin-left: 160px; padding-right: 10px; }
  .select { width: 135px; }
  .selected { width: 150px; }
  .selected-with-sub { width: 150px; }
  .select-after-sub { width: 135px; }
  .sub-select { width: 120px; margin: 0.4em 0em 0.4em 15px; }
  .sub-selected { width: 135px; margin: 0.4em 0em 0.4em 15px; }
  .wcag { margin-left: 30px; }
  #practice-image { display: none }
}