/* --------------------------- HANDHELD LAYOUT --------------------------- */

@media handheld
{

  /* ------------------- main body ------------------- */

  html, body 
  {
      margin:0;
      padding:0;
      background-color:#FFFFFF;
  }

  #pageWidth
  {
      width:1000px;
      text-align:left;
      margin-left:auto;
      margin-right:auto;
  }

  .main
  {
      display:block;
      width:65%;
      float:left;
  }

  .sidebar
  {
      display: none;
  }

  td.leftBodyShadow
  {
      display: none;
  }

  td.rightBodyShadow
  {
      display: none;
  }

  /* ---------------- side navigation ---------------- */

  #sideMenu 
  {
      border-right-width: 1px;
  }

  #sideMenu .hNavSpace 
  {
      display: none;
  }

  #sideMenu .Nav
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 8px;
      color: #000000;
      text-transform: capitalize;
      letter-spacing: 0.05em;
      width: 223px;
      text-align: left;
      left: 10px;
  }

  #sideMenu .Nav a
  {
      color: #000000;
      display:block;
      font-size:8;
      letter-spacing: 0.04em;
      text-decoration: none;
  }

  #sideMenu .Nav a:hover
  {
      background-repeat: no-repeat;
      background-position: 5px;
      border-bottom-width: 1px;
      border-bottom-color: #000000;
      color: #333333;
  }

  td.c1
  {
      background-image:url(../images/Template/leftGradientShadow.jpg);
      background-position: top right; 
      background-repeat: no-repeat;
  }

  td.leftSideNavShadow
  {
      background-image:url(../images/Template/leftGradientShadow.jpg);
      background-position: top right; 
      background-repeat: no-repeat;
  }

  td.rightSideNavShadow
  {
      display: none;
  }

  /* -------------------- top bar -------------------- */

  .LoginCell 
  { 
      display: none;
  }

  /* ---------------- top navigation ----------------- */

  .greyTopNav 
  {
      display: none;
  }

  .greyTopNav a 
  {
      display: none;
  }

  .greyTopNav a:hover 
  {
      display: none;
  }

  /* ---------------- logo and banner ---------------- */

  .Logo
  {
      display: none;
  }

  .Banner
  {
      display: none;
  }

  #rotator
  {
      display: none;
  }

  /* ------------ breadcrumbs and search ------------- */

  .LoginCell
  { 
      display: none;
  }

  .BreadCrumbCell 
  {
      display: none;
  }

  .BreadCrumbCell a 
  {
      display: none;
  }

  .BreadCrumbCell a:hover 
  {
      display: none;
  }

  .BreadCrumbCell a:active 
  {
      display: none;
  }

  .SearchCell 
  {   
      display: none;           
  }

  .searchInput 
  {
      display: none;
  }

  /* ------------------ school name ------------------ */

  .WelcomeClass 
  {
      display: none;
  }

  .PageTitleClass 
  { 
      display: none;
  }

  /* --------------------- footer -------------------- */

  .GoldenRodLow 
  { 
      display: none;
  }

  td.lowBar
  {
      display: none;
  }

  .LowBlackFooter 
  { 	
      display: none;
  }

  .CopyrightFooter 
  {
      display: none;
 }

  .CopyrightFooter a 
  {
      display: none;
  }

  .CopyrightFooter a:hover 
  {
      display: none;
  }

  .CopyrightFooter a:active 
  {
      display: none;
  }

  /* -------------------- images -------------------- */

  img.floatLeft 
  { 
      float:left;
      margin: 4px;
  }

  img.floatRight 
  { 
      float:left;
      margin: 4px;
  }

  img.Logo
  {
      display: none;
  }

  /* --------------- header text style --------------- */

  #HeaderContent 
  {
      padding-top: 2px;
      padding-right: 2px;
      padding-left: 2px;
      font-family: Georgia;
      font-size: 15px;
      color: #000033;
      line-height: 19px;
  }

  .Header 
  {
      font-family: Georgia;
      font-size: 15px;
      color: #000033;
      line-height: 19px;
  }

  .Header a 
  {
      font-family: Georgia;
      font-size: 15px;
      color: #000033;
      line-height: 19px;
  }

  .Header a:hover 
  {
      font-family: Georgia;
      font-size: 15px;
      color: #000033;
      line-height: 19px;
      text-decoration: underline;
  }

  .Header a:active 
  {
      font-family: Georgia;
      font-size: 15px;
      color: #000033;
      line-height: 19px;
  }

  /* ---------- header text style centered ----------- */

  .HeaderCenter
  {
      font-family: Georgia;
      font-size: 15px;
      color: #000033;
      line-height: 19px;
      text-align: left;
  }

  .HeaderCenter a 
  {
      font-family: Georgia;
      font-size: 15px;
      color: #000033;
      line-height: 19px;
      text-align: left;
  }

  .HeaderCenter a:hover 
  {
      font-family: Georgia;
      font-size: 15px;
      color: #000033;
      line-height: 19px;
      text-decoration: underline;
      text-align: left;
  }

  .HeaderCenter a:active 
  {
      font-family: Georgia;
      font-size: 15px;
      color: #000033;
      line-height: 19px;
      text-align: left;
  }

  /* ---------- header text style right ----------- */

  .HeaderRight
  {
      font-family: Georgia;
      font-size: 15px;
      color: #000033;
      line-height: 19px;
      text-align: left;
  }

  .HeaderRight a 
  {
      font-family: Georgia;
      font-size: 15px;
      color: #000033;
      line-height: 19px;
      text-align: left;
  }

  .HeaderRight a:hover 
  {
      font-family: Georgia;
      font-size: 15px;
      color: #000033;
      line-height: 19px;
      text-decoration: underline;
      text-align: left;
  }

  .HeaderRight a:active 
  {
      font-family: Georgia;
      font-size: 15px;
      color: #000033;
      line-height: 19px;
      text-align: left;
  }

  /* ------------- subheader text style -------------- */

  #SubHeader 
  {
      padding-top: 2px;
      padding-right: 13px;
      padding-left: 13px;
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 14px;
      font-weight: bold;
      color: #000033;
      line-height: 25px;
  }

  .SubHeader
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 14px;
      font-weight: bold;
      color: #000033;
      line-height: 25px;
  }

  .SubHeader a 
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 14px;
      font-weight: bold;
      color: #000033;
      line-height: 25px;
  }

  .SubHeader a:hover 
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 14px;
      font-weight: bold;
      color: #000033;
      line-height: 25px;
      text-decoration: underline;
  }

  .SubHeader a:active 
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 14px;
      font-weight: bold;
      color: #000033;
      line-height: 25px;
  }

  /* -------- subheader text style centered ---------- */

  .SubHeaderCenter
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 14px;
      font-weight: bold;
      color: #000033;
      line-height: 25px;
      text-align: center;
  }

  .SubHeaderCenter a 
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 14px;
      font-weight: bold;
      color: #000033;
      line-height: 25px;
      text-align: center;
  }

  .SubHeaderCenter a:hover 
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 14px;
      font-weight: bold;
      color: #000033;
      line-height: 25px;
      text-align: center;
      text-decoration: underline;
  }

  .SubHeaderCenter a:active 
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 14px;
      font-weight: bold;
      color: #000033;
      line-height: 25px;
      text-align: center;
  }

  /* ---------- subheader text style right ----------- */

  .SubHeaderRight
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 14px;
      font-weight: bold;
      color: #000033;
      line-height: 25px;
      text-align: right;
  }

  .SubHeaderRight a 
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 14px;
      font-weight: bold;
      color: #000033;
      line-height: 25px;
      text-align: right;
  }

  .SubHeaderRight a:hover 
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 14px;
      font-weight: bold;
      color: #000033;
      line-height: 25px;
      text-align: right;
      text-decoration: underline;
  }

  .SubHeaderRight a:active 
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 14px;
      font-weight: bold;
      color: #000033;
      line-height: 25px;
      text-align: right;
  }

  /* -------------- content text style --------------- */

  #CenterContent 
  {
      padding-top: 1px;
      padding-right: 13px;
      padding-left: 13px;
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 8px;
      color: #000000;
      line-height: 11px;
  }

  .Content 
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 8px;
      color: #000000;
      line-height: 11px;
  }

  .Content a 
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 8px;
      color: #000000;
      line-height: 11px;
  }

  .Content a:hover 
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 8px;
      color: #000000;
      line-height: 11px;
      text-decoration: underline;
  }

  .Content a:active 
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 8px;
      color: #000000;
      line-height: 11px;
  }

  /* ---------- content text style centered ---------- */

  .ContentCenter 
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 8px;
      color: #000000;
      line-height: 11px;
      text-align: left;
  }

  .ContentCenter a 
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 8px;
      color: #000000;
      line-height: 11px;
      text-align: left;
  }

  .ContentCenter a:hover 
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 8px;
      color: #000000;
      line-height: 11px;
      text-decoration: underline;
      text-align: left;
  }

  .ContentCenter a:active 
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 8px;
      color: #000000;
      line-height: 11px;
      text-align: left;
  }

  /* ---------- content text style right ---------- */

  .ContentRight 
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 8px;
      color: #000000;
      line-height: 11px;
      text-align: left;
  }

  .ContentRight a 
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 8px;
      color: #000000;
      line-height: 11px;
      text-align: left;
  }

  .ContentRight a:hover 
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 8px;
      color: #000000;
      line-height: 11px;
      text-decoration: underline;
      text-align: left;
  }

  .ContentRight a:active 
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 8px;
      color: #000000;
      line-height: 11px;
      text-align: left;
  }

  /* ----------------- General Font ------------------ */

  .h1
  {
      padding-top: 13px;
      padding-right: 13px;
      padding-left: 13px;
      font-family: Georgia;
      font-size: 21px;
      color: #000033;
      line-height: 25px;
  }

  h1
  {
      padding-top: 13px;
      padding-right: 13px;
      padding-left: 13px;
      font-family: Georgia;
      font-size: 21px;
      color: #000033;
      line-height: 25px;
  }

  #header h2
  {
      padding-top: 2px;
      padding-right: 13px;
      padding-left: 13px;
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 14px;
      font-weight: bold;
      color: #000033;
      line-height: 25px;
  }

  #nav
  {
      position:absolute;
      left:0px;
      width:150px;
      background-color:#7C94A5;
      color:#FFF;
  }

  #content
  {
      padding: 8px;
      width: 100%;
  }

  #footer
  {
      font-size:90%;
      color:#FFF;
      text-align:right;
      padding:10px;
      background-color:#000;
      clear:both;
  }

  #nav li 
  {
      padding: 0px;
      font-size: 110%;
      color: #FFF;
      text-decoration: none;
      background-color: #0066B2;
      font-weight: bold;
  }

  #nav ul 
  {
      list-style-type: none;
      padding: 0px;
      margin: 0px;
  }

  #nav a:link, #nav a:visited  
  {
      color: #8CCAF9;
      text-decoration: none;
      border-left-style: solid;
      border-left-width: 20px;
      border-left-color: #5c7485;
      display: block;
      padding: 0px 0px 0px 5px;
      margin: 0px;
      border-bottom-style: solid;
      border-bottom-width: 1px;
      border-bottom-color: #142A3B;
  }

  #nav a:hover, #nav a:active
  {
      color: #FFF;
      text-decoration: none;
      border-left-style: solid;
      border-left-width: 20px;
      border-left-color: #6CAAD9;
      display: block;
      padding: 0px 0px 0px 5px;
      margin: 0px;
      border-bottom-style: solid;
      border-bottom-width: 1px;
      border-bottom-color: #142A3B;
  }

  /* -------------------- tables --------------------- */


  #BoxTableBlue-60
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      width: 60%;
      margin-left:128px;
      text-align: left;
      border-collapse: collapse;
  }

  #BoxTableBlue-60 th
  {
      background: #6A6A6A;
      border-top: 4px solid #2385A2;
      border-bottom: 1px solid #FFF;
      color: #FFF;
  }

  #BoxTableBlue-60 td
  {
      background: #F2F2F2; 
      border-bottom: 1px solid #fff;
      border-top: 1px solid transparent;
  }

  #BoxTableBlue-60 tr:hover td
  {
      background: #D2E8FC;
  }

  #BoxTableBlue
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      width: 100%;
      text-align: left;
      border-collapse: collapse;
  }

  #BoxTableBlue th
  {
      background: #6A6A6A;
      border-top: 4px solid #2385A2;
      border-bottom: 1px solid #FFF;
      color: #FFF;
  }

  #BoxTableBlue td
  {
      background: #F2F2F2; 
      border-bottom: 1px solid #fff;
      border-top: 1px solid transparent;
  }

  #BoxTableBlue tr:hover td
  {
      background: #D2E8FC;
  }

  #BoxTableGreen
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      width: 100%;
      text-align: left;
      border-collapse: collapse;
  }

  #BoxTableGreen th
  {
      background: #6A6A6A;
      border-top: 4px solid #80C980;
      border-bottom: 1px solid #FFF;
      color: #FFF;
  }

  #BoxTableGreen td
  {
      background: #F2F2F2; 
      border-bottom: 1px solid #fff;
      border-top: 1px solid transparent;
  }

  #BoxTableGreen tr:hover td
  {
      background: #80C980;
  }

  #BoxTableYellow
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      width: 100%;
      text-align: left;
      border-collapse: collapse;
  }

  #BoxTableYellow th
  {
      background: #6A6A6A;
      border-top: 4px solid #FFFF80;
      border-bottom: 1px solid #FFF;
      color: #FFF;
  }

  #BoxTableYellow td
  {
      background: #F2F2F2; 
      border-bottom: 1px solid #fff;
      border-top: 1px solid transparent;
  }

  #BoxTableYellow tr:hover td
  {
      background: #FFFF80;
  }

  #BoxTablePurple
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      width: 100%;
      text-align: left;
      border-collapse: collapse;
  }

  #BoxTablePurple th
  {
      background: #6A6A6A;
      border-top: 4px solid #7D4398;
      border-bottom: 1px solid #FFF;
      color: #FFF;
  }

  #BoxTablePurple td
  {
      background: #F2F2F2; 
      border-bottom: 1px solid #FFF;
      border-top: 1px solid transparent;
  }

  #BoxTablePurple tr:hover td
  {
      background: #FFFFFF;
      border-bottom: 1px solid #7D4398;
  }

  #BoxTableRed
  {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      width: 100%;
      text-align: left;
      border-collapse: collapse;
  }

  #BoxTableRed th
  {
      background: #6A6A6A;
      border-top: 4px solid #B02125;
      border-bottom: 1px solid #FFF;
      color: #FFF;
  }

  #BoxTableRed td
  {
      background: #F2F2F2; 
      border-bottom: 1px solid #fff;
      border-top: 1px solid transparent;
  }

  #BoxTableRed tr:hover td
  {
      background: #FFFFFF;
      border-bottom: 1px solid #B02125;
  }

  #Zebra
  {
      width: 100%;
      text-align: left;
      border-collapse: collapse;
  }

  #Zebra th
  {
      background: #0054fb;
      border-top: 4px solid #008efb;
      border-bottom: 1px solid #FFF;
      color: #FFF;
  }

  #Zebra .odd
  {
      background: #F2F2F2; 
  }

  #Zebra tr:hover td
  {
      background: #D2E8FC;
  }
}

/* ------------------------- END HANDHELD LAYOUT -------------------------- */