@import url("/stylesheets/forms.css"); 
/*============================================================================
[Screen Stylesheet]
==============================================================================
Project: Great Start Collabortive - Barry County
Version: 1.0
Last Modified: 10/29/2009 
Assigned to:   Meili Chen - 10/29/2009
Primary use:   Page Layouts - one, two & three colum layouts 
==============================================================================*/

/*=============================================================================
[Table of Contents]
===============================================================================

A. Global Reset

B. Global Formatting

C. Layout
    1. Body 
        1.1. Skip to content / a#skip
    2. Layout wrapper / div#wrapper
        2.1. Header / div#header
               2.1.1 Logo / h1
       2.1.2 Utility /#utility
         2.1.2.1 Search / div#search  
                        2.1.2.2 Utility navigation / ul#utilityNav
              2.1.3 Global navigation / div#globalNav
                       2.1.3.1 Global nav dropdown menu / ul.dropdown
         2.2. Banner section / div#banners  (home page only)
         2.3. Middle section / div#middleOuter, #middleInner         
                2.3.1 Primary column / div#primeCol 
                2.3.1.1 page title / div#pageTitle
                2.3.1.2 breadcrumbs / div#breadcrumbs
                2.3.1.3 Main content
                             2.3.1.3.1 FAQ / ul. aq-cat
                             2.3.1.3.2 Login/ Manage Account pages div#account
                             2.3.1.3.3 Calendar /.calendar
                             2.3.1.3.4 Event Details /.eventDetails
                             2.3.1.3.5 News list / .newsList
                             2.3.1.3.6 New details / .newsDetails  
                             2.3.1.3.7 Search Results / #searchResults
               2.3.2 Second column / div#secondCol
                         2.3.2.1  default sidebar item  /div.sidebar
                         2.3.2.2  Online Poll / div.poll
                         2.3.2.3 news / div.news
                         2.3.2.4 register Parent Coalition event /div.register
                         2.3.2.5  sub/local navigation /div#subNav 
                                        2.3.2.5.1  sub/local navigation the third level
      2.3.3 Third column / div#thirdCol 
                 2.3.3.1 events /div.events 
                 2.3.3.2 mailing list /div.mailing
                 2.3.3.3 online poll /div.poll
         2.3.3.4 update password/profile      
    2.4 Footer / div#footer 
           2.4.1 Footer navigation / ul#footNav 
           2.4.2 Footer copyright / div.copyright     
                     
===============================================================================*/

/*==============================================================================
[Color codes]
================================================================================
#fff white (body background, column bg, utility text, global nav hover, global nav dropdown hover  )
#000 black (body text,)

#0066cc blue (default link,)
#3366cc  blue (breadcrumbs dotted line, sidebar dotted line, layout dottedline)
#006699 blue (page title)
#0054a6 blue (breadcrumbs link)
#d1d9da  light blue {hr line}

#7b9bba grey (breadcrumbs link hover )
#666666  grey  {news date, footer text}

#699d59 green (green text)
#a0e566 green (subnav bg)
#c3f797 lighter green (subnav hover)

#ffd204 yellow (yellow border, )

#f36c7f red (navbar 1)
#f04a62 red (navbar 2 hover, dropdown)
#fbb688 orange (navbar 2)
#fc8f46 orange (navbar 2 hover, dropdown)
#fdeda5 yellow (navbar 3)
#fadf67 yellow (navbar 3 hover, dropdown)
#9ebfef light blue (navbar 4)
#82aeee light blue (navbar 4 hover, dropdown)
#d2eb9f light green (navbar 5)
#bfe969 light green (navbar 5 hover, dropdown)
#9188e9 purple (navbar 6)
#6e62e5 purple (navbar 6 hover, dropdown)
#cc98f4 pink (navabar 7)
#b66eed pink (navbar 7 hover, dropdown)
==================================================================================*/

/*=================================================================================
A. GLOBAL RESET
===================================================================================*/

body {font: 62.5%/1.4 Trebuchet MS,Verdana,Arial,Helvetica,Jamrul,sans-serif;  background: #fff; color: #000; margin: 0; padding: 0;}
p, h1, h2, h3, h4, h5, h6, fieldset, form, label, input, textarea, legend, dl, dt, dd, table, caption, th, td, blockquote, cite {
 margin: 0; padding: 0; font-size: 1em;}
ul, ol, li, ul *, ol *  {font-size: 1em;}

input, textarea {font-family: Trebuchet MS,Verdana,Arial,Helvetica,Jamrul,sans-serif;}
textarea {overflow: auto;}
table {border-collapse: collapse;   margin-bottom: 2em;}
td, th {padding: 0.1em 1em;  }

img {border: 0;}
acronym, abbr {border-bottom: 1px dotted; cursor: help;}
cite {font-style: normal;}
:focus {outline: 0;}

/*====================================================================================
B. GLOBAL FORMATTING  
=====================================================================================*/
.clear {clear: both; height: .001em; font-size: .001em;}
.left {float: left; display: inline;}
.right {float: right; display: inline;}
.center {text-align: center;}
.block {display: block;}
.bld {font-weight: bold;}
.greenTxt {color: #699d59; font-weight: bold;}
.biggerTxt {font-size: 1.1em;}
.dottedBorder {border-bottom: 1px dotted #3366cc;} /* dotted horizental line */
.imgRight {float: right; margin: 5px 0 8px 8px;}
.imgLeft {float: left; margin: 5px 8px 8px 0;}
.yellowBorder {border: 5px solid #ffd204;}

a {color: #0066cc; text-decoration: none; font-weight: bold;}
a:hover {border-bottom: 1px dotted #0066ff;}
a:hover img {border-bottom: none!important;}

h1 {font-size: 1.3em;line-height: 120%;}
h2 {font-size: 1.2em;line-height: 120%;}
h3 {font-size: 1.1em; }
h4 {font-size: 1em;}
h5 {font-size: 0.9em;}
h6 {font-size: 0.8em;}
h1, h2, h3, h4, h5, h6 {margin-bottom: 1em;}

hr {border: none; margin: 15px 0; background: #d1d9da; padding: 0; height: 1px;}

form fieldset {border: 3px double #91aac1; padding: 10px; margin-bottom: 10px;}
form legend {font-size: .95em; color:#fff; color: #fff; background: #4c8db8; padding: 4px 10px;  font-weight: bold; letter-spacing: 1px; border: 1px solid #a1b6b8;}     
.submitBtn {color:#000; font-size: 1.1em; font-weight: bold;  padding: 2px 5px;}

.nav, .nav ul {margin: 0; padding: 0; list-style: none;}

/*======================================================================================
C. LAYOUT                                                                   *
=======================================================================================*/

/*--------------------------------------------------------------------------------------------
 1. Body / body                                                                                                                                                             
----------------------------------------------------------------------------------------------*/
body {background: #fff url(/images/background/body_bg.jpg) repeat-x 0 0; }

   /* 1.1. Skip to content / a#skip */
   #skip {position: absolute; top: -1000px;} 
    
/*------------------------------------------------------------------------------------------
2. Layout Wrapper                                                                                                                                                     
---------------------------------------------------------------------------------------------*/
#wrapper {color: #000; font-size: 1.2em; margin: 0 auto; width: 962px; background: tranparent; overflow: hidden;}
#wrapper p {margin-bottom: 1em!important;}
   /*.........................................................................
    2.1. Header / div#header 
   ...........................................................................*/
   #header {background: url(/images/background/body_bg.jpg) repeat-x 0 0; width: 100%; height: auto; }
      
      /* 2.1.1 logo / #logo */
      #logo {float: left; width: 450px; overflow: hidden; }
      #logo h1 {height: 100px; width: 387px; margin: 0; padding: 0; background: url(/images/background/client_logo.jpg) no-repeat;  text-indent: -9000px; float: left; }
      #logo h1 a {display: block; height: 100px; width: 390px; background: url(/images/background/client_logo.jpg) no-repeat;}
      #logo h1 a:hover {border-bottom: none;}

      /* 2.1.2 utility / #utility */
      #utility {font-family: font-size: 13px; width: 510px;  padding: 0px; text-align: right; float: right; overflow: hidden;}
        
         /* 2.1.2.1 search / #search */
         #search {text-align: right; width: 450px; margin: 10px 0 10px 0; float: right; overflow: hidden;}
         #search form {margin: 0;}
         #search input {vertical-align: middle;}
         #search #query {background: #fff; border: 1px solid #a5acb2; width: 175px; margin: 0; padding: 0 1px; }
         #search .searchBtn {padding: 0px 0; margin: 0 0 0 5px;} 
         
         .paging {margin: 15px 0; }
         .query {font-style: oblique; color: #990000; font-weight: bold;}
         #results_form ul li {padding-bottom: 6px;}
            
         /*2.1.2.2 / #utilityNav */
         #utilityNav {font-family: Trebuchet MS,Verdana,Arial,Helvetica,Jamrul,sans-serif;font-size: 13px; width: 450px;  padding: 0px; margin: 5px 0px 10px 0;text-align: right; float: right; overflow: hidden;}
         #utilityNav ul {padding: 0; margin-top: 0;}
         #utilityNav ul li {padding-top: 0; margin: 0px!important;}
         #utilityNav ul li {display: inline; margin-right: -4px!important;}
         #utilityNav ul li a {color: #fff; font-weight: bold; padding: 0 16px 8px 14px; background: url(/images/navs/utility_nav_off.gif) no-repeat 100% 100%; }
         #utilityNav ul li a:hover, #utility ul li.current a {background: url(/images/navs/utility_nav_on.gif) no-repeat 100% 100%; border-bottom: none; }
         #utilityNav ul li.last a {background: url(/images/navs/utility_nav_off.gif) no-repeat 0% 100%; }
         #utilityNav ul li.last a:hover {background: url(/images/navs/utility_nav_on.gif) no-repeat 0% 100%; border-bottom: none; }
   
      /* 2.1.3. Global navigation / div#globalNav */
      #globalNav {width: 100%; margin: 15px 0 0 0; display: block; float: left;  background: transparent;}
      #globalNav ul {float: left; width: 100%;  padding: 5px; background: url(/images/navs/global_nav_bg.gif) repeat-x 0 100% !important;}
      #globalNav  ul a {font-size: 14px; display: block;  line-height: 100%;}
      #globalNav  ul li {float: left; display: inline; /* otherwise there are gaps between each nav item */  margin-right: 3px;}
      #globalNav  ul li a{font-weight: bold; text-align: center;padding: 5px 18px 8px 17px;}
      #globalNav ul li a:hover {}
   
      .nav1 a, .nav2 a, .nav3 a, .nav4 a, .nav5 a, .nav6 a , .nav7 a{color: #0d3c80;}
      .nav1 a{ border-bottom: 10px solid #f36c7f;}
      .nav2 a{ border-bottom: 10px solid #fbb688;}
      .nav3 a{ border-bottom: 10px solid #fdeda5;}
      .nav4 a{ border-bottom: 10px solid #9ebfef;}
      .nav5 a{ border-bottom: 10px solid #d2eb9f;}
      .nav6 a{ border-bottom: 10px solid #9188e9;}
      .nav7 a{ border-bottom: 10px solid #cc98f4;}
      .nav1 a:hover, .nav1 .current a{border-bottom: 10px solid #f04a62; color: #fff;}
      .nav2 a:hover, .nav2 .current a{border-bottom: 10px solid #fc8f46; color: #fff;}
      .nav3 a:hover, .nav3 .current a{border-bottom: 10px solid #fadf67; color: #fff;}
      .nav4 a:hover, .nav4 .current a{border-bottom: 10px solid #82aeee; color: #fff;}
      .nav5 a:hover, .nav5 .current a{border-bottom: 10px solid #bfe969; color: #fff;}
      .nav6 a:hover, .nav6 .current a{border-bottom: 10px solid #6e62e5; color: #fff;}
      .nav7 a:hover, .nav7 .current a{border-bottom: 10px solid #b66eed; color: #fff;}
       
         /* 2.1.3.1 Global nav dropdown menu / ul.dropdown */
         .dropdown{ position: absolute; left: -999em;  margin: 0 0px 0px -3px !important;  padding: 0; z-index: 100; overflow: hidden;  float: none; filter:alpha(opacity=95); opacity: .95; -moz-opacity:.95;}
         #globalNav ul ul{ border-bottom: 3px solid #fff; border-top: 4px solid #fff; background: none!important; padding: 0px!important; width: auto;}
         #globalNav ul ul a {text-align: left; margin-right: 0; padding: 8px 10px 8px 18px; }
         #globalNav ul li ul.dropdown li {float: none; margin: 0!important; display: inline; }
         #globalNav ul li:hover ul, #globalNav li.sfhover ul { left: auto;}
         #globalNav ul li ul.dropdown li a { font-size: 13px; color: #000; border-bottom: none!important;  height: auto; line-height: 100%; }
     
         #globalNav ul li.nav1 ul.dropdown li a,#globalNav ul li.nav2 ul.dropdown li a,#globalNav ul li.nav3 ul.dropdown li a,#globalNav ul li.nav4 ul.dropdown li a,#globalNav ul li.nav5 ul.dropdown li a,#globalNav ul li.nav6 ul.dropdown li a, #globalNav ul li.nav7 ul.dropdown li a{border-left: 3px solid #fff; border-right: 3px solid #fff;}
         #globalNav ul li.nav1 ul.dropdown li a{background: #f04a62; width: 65px; }
         #globalNav ul li.nav2 ul.dropdown li a{background: #fc8f46; width: 102px;}
         #globalNav ul li.nav3 ul.dropdown li a {background: #fadf67; width: 104px;}
         #globalNav ul li.nav4 ul.dropdown li a {background: #82aeee; width: 112px;}
         #globalNav ul li.nav5 ul.dropdown li a {background: #bfe969; width: 75px;}
         #globalNav ul li.nav6 ul.dropdown li a {color: #ebebf6; background: #6e62e5; width: 161px;}
         #globalNav ul li.nav7 ul.dropdown li a {color: #ebebf6; background: #b66eed; width: 139px;}
         #globalNav ul li ul.dropdown a:hover, #globalNav ul li ul.dropdown .current a  {color: #000; background: #ffd204 !important;}
         #globalNav ul li.nav6 ul.dropdown li a:hover, #globalNav ul li.nav7 ul.dropdown li a:hover, #globalNav ul li.nav6 ul.dropdown .current a, #globalNav ul li.nav7 ul.dropdown .current a{color: #000;}
       
   /*..........................................................................................
      2.2. Banner section / div#banners 
    ............................................................................................. */  
      #banners {width: 100%; background: #fff;  float: left;  padding: 0px 5px; }
      #banners img {} /* do not remove this; otherwise there will be a gap on the bottom of the photo on the firefox */
      #banners #tagline {float: left;}
      #banners #photos {float: left;}
      #banners #fields {float: left; margin: 0; padding: 0; width: 472px; height: 263px; overflow: hidden;background: #fff;}
      #photos {float: left; margin-left: 8px; height: 263px; overflow: hidden;}
      #photos #families {float: left; margin: 0; padding: 0; width: 472px; height: 263px; overflow: hidden; background: #fff;}               
      #photos li{}
    
   /*................................................................................................
      2.3. Middle section / div#middleOuter, #middleInner
    ..................................................................................................*/
   #middleOuter {width: auto;border-left: 250px solid #fff;  /* left column width */
   border-right: 250px solid #fff; /* right column width */
   background: #fff; /* center column colour */
   margin: 0px auto 15px auto;   padding: 5px 5px 0 5px; }
   #home #middleOuter {border-left: 295px solid #fff; border-right: 295px solid #fff;}
   #middleInner {margin: 0; border-right: 1px dotted #3366cc;  border-left: 1px dotted #3366cc; width: 100%; background: #fff; }/*do not remove the width:100% for IE6 */
   
   /* Mozilla code */
   #middleOuter > #middle_inner { border-bottom: 1px solid transparent; }
   
   .twoCol #middleOuter, #home .twoCol #middleOuter {border-right: none;}
   .twoCol #thirdCol, #home  .twoCol #thirdCol {display: none;}
   .twoCol #middleInner, #home .twoCol #middleInner {border-right: none;}
   .oneCol #middleOuter, #home .oneCol #middleOuter {border: none;}
   .oneCol #thirdCol, .oneCol #secondCol, #home .oneCol #thirdCol, #home .oneCol #secondCol {display: none;}
   .oneCol #middleInner, #home .oneCol #middleInner {border:none;}   
      
      /* 2.3.1 Primary column / div#primeCol */
      #primeCol {float: left;    margin: 0 -1px 0 -1px; padding: 8px 0;   width: 100%; overflow: hidden; /*z-index: 12;*/}
      #primeCol #mainContent {}
      
         /* 2.3.1.1 Page Title / h1#pageTitle */
         h1#pageTitle {color: #005dab; font-size: 20px; margin: 0 10px .5em 10px; padding: 7px 10px 13px 10px; border-bottom: 3px solid #76bb41; background: url(/images/background/star.gif) no-repeat 100% 0;}    
         #home h1#pageTitle{color: #006699; margin: 0 20px; padding: 15px 70px 10px 0; width: 230px; border-bottom: none; background: url(/images/background/star_face.gif) no-repeat 100% 0;}
         
         /* 2.3.1.2 Breadcrumbs / h1#breadcrumbs*/
         #breadcrumbs {color: #0054a6; font-weight: bold; border-bottom: 1px dotted #3366cc; margin: 0 10px 10px 10px; padding: 3px 10px 3px 10px;}
         #breadcrumbs a {color: #0054a6;}
         #breadcrumbs a:hover {border-bottom: none; color: #7b9bba;}
         
         /* 2.3.1.3 Main content */
         #mainContent {margin: 15px 0; padding: 5px 20px 10px 20px; overflow: hidden; }
         .oneCol #mainContent {}
         .twoCol #mainContent {}
         .threeCol #mainContent {}
            
            /*2.3.1.3.1 FAQ /ul.faq-cat */
            .faq-cat h5 {cursor: help;}
            ul.faq-cat {list-style: none; margin: 0; padding: 0;}
            ul.faq-cat .answer {margin-left: 20px;}

            ul.faq-cat li {padding-bottom: 8px;}
            ul.faq-cat h5 {margin-bottom: 0px;}
            ul.faq-cat li h5:first-letter {font-size: 1.5em; color: #4a9c0a;}
            ul.faq-cat ul {margin-left: 15px; padding-left: 0;}
            ul.faq-cat ul li {margin: 0; padding-left: 0px;}
  
            /* 2.3.1.3.2 Login/ Manage Account pages div#account   */
            #account form {border: 1px dotted #88a6e2;padding: 10px; background: #eef2f4;}
            #account form {margin-bottom:10px; text-align:left; clear:both;}
            #account label {float:left; width:135px; text-align:right; padding-right:10px; font-weight:bold;}  
            #account form div {margin-bottom: 10px;}
            #account form input {padding: 1px 2px;}
            #account input[value~="Login"], input[value~="Update"], input[value~="Reset"], input[value~="Rquest"] {font-weight: bold; background: #134066; color: #fff; padding: 2px 5px; border: 1px solid #ccc;}
            #account form p{text-align: center; margin-bottom: 15px;}
            #account .login_notice {color: #cc3300; font-weight: bold;}
            #account p.note {text-align: left !important;}
            
            /* 2.3.1.3.3 Calendar  table.calendar */
            /*            
            .calendar { width: 100%; border-collapse: collapse;}
            .calendar .monthName  th{font-size: 1.15em; padding: 5px; text-align: center; border: 2px solid #fff; background: #3b65a3; color: #fff;}
            .calendar .monthName a {padding: 0 10px; color: #f6c964;}
            .calendar .monthName a:hover {border-bottom: none;}
            .calendar .dayName th{background: #cbf0ad; color: #042f6e; border: 2px solid #fff; padding: 3px 5px; text-align: center;}
            .calendar td {vertical-align: top; font-size: .95em; width: 14%;text-align: center; padding: 3px; border: 2px solid #fff;}
            .calendar td.day {background: #e1e8ee; height: 60px;}
            .calendar .specialDay {background: #b6cdee;}
            .calendar td.otherMonth {text-align: right; background: #f0f1f1; color: #b0b3b6;}
            .calendar .cal_day {text-align: right;}
            .calendar td a:hover {text-decoration: underline; border-bottom: none;}
            .calendar .specialDay .cal_day { color: #aa0404; font-weight: bold;  padding-bottom: 5px;}
            td.specialDay a {color: #1d4a8b; padding-bottom: 10px; font-weight: bold; text-align: left; line-height: 110%;}
                      
            .hover_detail .eventTitle {padding-left: 5px; font-weight: bold;}
            .hover_detail p.cal_cat-3 {background: #f04a62;}
            .hover_detail p.cal_cat-4 {background: #9ebfef;}
            .hover_detail p.cal_cat-5 {background: #fc8f46;}
            .hover_detail p.cal_cat-6 {background: #f1d96a;}
            .hover_detail p.cal_cat-7 {background: #9188e9;}
            .hover_detail p.cal_cat-8 {background: #d2eb9f;}
            .hover_detail p.cal_cat-9 {background: #c68df2;}
            
            table.calendar td a {display: block!important;}
            table.calendar td:hover, table.calendar td.iehover {z-index: 999;}
           
            td.specialDay .hover_detail {position: absolute; display: none; width: 13em; z-index: 999; text-align: left; background: #fff; border: 1px solid #999; filter: alpha(opacity=90); opacity: 0.9; -moz-opacity: 0.9; word-wrap: break-word; overflow: hidden;}
            td.specialDay:hover .hover_detail, td.iehover .hover_detail {display: block;}
            td.specialDay .hover_detail p {margin: 0.4em !important;}
            td .hover_detail .eventTitle {color: #000; font-weight: bold; font-size: 1.05em; line-height: 110%; padding: 5px;}
            */
             
            .calendar { width: 100%; border-collapse: collapse;}
            .calendar .monthName  th{font-size: 1.15em; padding: 5px; text-align: center; border: 2px solid #fff; background: #2a5696; color: #fff;}
            .calendar .monthName a {padding: 0 15px; font-size: 1.1em; font-weight: bold; color: #ffd204;}
            .calendar .monthName a:hover {border-bottom: none;}
            .calendar .dayName th{background: #c9e395; color: #0f284e; border: 2px solid #fff; padding: 3px 5px; text-align: center;}
            .calendar td {vertical-align: top; font-size: .95em; width: 14%;text-align: center; padding: 3px; border: 2px solid #fff;}
            .calendar td.day {background: #edf2f6; height: 60px;}
            .cal_title {color: #393a3c; text-align: left!important; margin-bottom: 5px; font-size: .95em; line-height: 0.95em; margin-top: 2px; padding-bottom: 6px; }
           .calendar .specialDay {background: #edf2f6;}
            .calendar td.otherMonth {text-align: right; background: #f6f7f7; color: #b0b3b6;}
            .calendar .cal_day {text-align: right; }
            .calendar td a:hover {border-bottom: none;}
            .calendar .specialDay .cal_day { color: #000; font-weight: bold;  padding-bottom: 5px;}
            td.specialDay a {color: #393a3c; text-align: left; line-height: 110%;}
            td.specialDay a:hover {color: #000;}          
                  
         .specialDay .cal_cat-3  {background: #f04a62; padding: 5px; }
         .specialDay .cal_cat-4  {background: #97bbee; padding: 5px; }
         .specialDay .cal_cat-5  {background: #fc8f46; padding: 5px; }
         .specialDay .cal_cat-6 {background: #f0d455; padding: 5px; }
         .specialDay .cal_cat-7  {background: #b2acee; padding: 5px; }
         .specialDay .cal_cat-8  {background: #d2eb9f; padding: 5px; }
         .specialDay .cal_cat-9  {background: #c68df2; padding: 5px; }

         .specialDay .cal_cat-3:hover  {background: #f04a62 url(/images/misc/calendar_star.png) no-repeat 0% 0%;}
         .specialDay .cal_cat-4:hover {background: #97bbee url(/images/misc/calendar_star.png) no-repeat 0% 0%; }
         .specialDay .cal_cat-5:hover {background: #fc8f46 url(/images/misc/calendar_star.png) no-repeat 0% 0%; }
         .specialDay .cal_cat-6:hover {background: #f0d455 url(/images/misc/calendar_star.png) no-repeat 0% 0%; }
         .specialDay .cal_cat-7:hover  {background: #b2acee url(/images/misc/calendar_star.png) no-repeat 0% 0%; }
         .specialDay .cal_cat-8:hover  {background: #d2eb9f url(/images/misc/calendar_star.png) no-repeat 0% 0%; }
         .specialDay .cal_cat-9:hover  {background: #c68df2 url(/images/misc/calendar_star.png) no-repeat 0% 0%;}

         .hover_detail .eventTitle {padding-left: 5px; font-weight: bold;}
            .hover_detail p.cal_cat-3 {background: #f04a62;}
            .hover_detail p.cal_cat-4 {background: #97bbee;}
            .hover_detail p.cal_cat-5 {background: #fc8f46;}
            .hover_detail p.cal_cat-6 {background: #f0d455;}
            .hover_detail p.cal_cat-7 {background: #b2acee;}
            .hover_detail p.cal_cat-8 {background: #d2eb9f;}
            .hover_detail p.cal_cat-9 {background: #c68df2;}
            
            table.calendar td a {display: block;}
            table.calendar td:hover, table.calendar td.iehover {z-index: 999;}
           
            td.specialDay .hover_detail {position: absolute; display: none; width: 13em; z-index: 999; text-align: left; background: #fff; border: 1px solid #999; filter: alpha(opacity=90); opacity: 0.9; -moz-opacity: 0.9; word-wrap: break-word; overflow: hidden;}
            td.specialDay:hover .hover_detail, td.iehover .hover_detail {display: block; }
            td.specialDay .hover_detail p {margin: 0.4em !important;}
            td .hover_detail .eventTitle {color: #000; font-weight: bold; font-size: 1.05em; line-height: 110%; padding: 5px;}
        
            /* 2.3.1.3.4 Event details .eventDetails */
            .eventDetails {border: 1px solid #eee; color: #333;}
            .eventDetails .eventTitle {background: #eee; padding: 4px 10px; color: #000;font-size: 1.2em;  font-weight: bold;}
            .eventDetails .details {padding: 10px; padding-top: 5px;}
            .eventDetails .location {}
            .eventDetails .cost {}
            .eventDetails .date {}
            .eventDetails .time {}
            .eventDetails .subTitle { font-weight: bold; color: #000;}
            .eventDetails .eventDesc {}
            .eventDetails p.cal_cat-3 {background: #f04a62;}
            .eventDetails p.cal_cat-4 {background: #97bbee;}
            .eventDetails p.cal_cat-5 {background: #fc8f46;}
            .eventDetails p.cal_cat-6 {background: #f0d455;}
            .eventDetails p.cal_cat-7 {background: #b2acee;}
            .eventDetails p.cal_cat-8 {background: #d2eb9f;}
            .eventDetails p.cal_cat-9 {background: #c68df2;}
         
           /* 2.3.1.3.5 calendar color legend div.calendarFilter  */
         
            .calendarFilter {background: #fff;  padding: 5px; border: 1px solid #c1c1b9;}
            .calendarFilter h2 {width: 208px!important; background: #3b65a3; padding: 5px!important; margin-top: 5px!important; color: #fff; font-size: 1.2em!important; border-bottom: 1px dotted #c1c1b9;}
            .calendarFilter .inner {margin: 0!important; padding:0px!important;}
            .calendarFilter .inner p {margin: 0;}
            .calendarFilter ul{margin: 0; padding: 0; list-style: none;}
            .calendarFilter li {list-style: none; color: #666; display: block; margin: 0 0 6px 0; padding: 5px; border-bottom: 1px dotted #c1c1b9;}
            .calendarFilter li:hover {color: #fff; font-weight: bold;}
      
            .category-3 {border-left: 5px solid #f04a62;}
            .category-4 {border-left: 5px solid #97bbee;}
            .category-5 {border-left: 5px solid #fc8f46;}
            .category-6 {border-left: 5px solid #f0d455;}
            .category-7 {border-left: 5px solid #b2acee;}
            .category-8 {border-left: 5px solid #d2eb9f;}
            .category-9 {border-left: 5px solid #c68df2;}
          
            .category-none a{border-left: 5px solid #666;}
            .filter-label {color: #666; display: block; margin-bottom: 6px; padding: 3px 0 2px 5px; border-left: 5px solid #fff;}
            
            .category-3:hover {background: #f04a62;}
            .category-4:hover {background: #97bbee;}
            .category-5:hover {background: #fc8f46;}
            .category-6:hover {background: #f0d455;}
            .category-7:hover {background: #b2acee;}
            .category-8:hover {background: #d2eb9f;}
            .category-9:hover {background: #c68df2;}
            
            .category-none:hover {background: #666;}
            
            
            /* 2.3.1.3.5 News list / .newsList*/
            .newsList {margin-bottom: 15px; border: 1px solid #eee;}
            .newsList .newsTitle {background: #eee; margin-bottom: 5px; padding: 4px 5px; font-size: 1.1em; font-weight: bold;}
            .newsList .newsDate {font-style: oblique; color: #666; margin-bottom: 5px; padding: 5px;}
            .newsList .newsAbst {padding: 5px; }
            
            /* 2.3.1.3.6 News Details .newsDetails */
            .newsDetails {}
            .newsDetails .newsTitle {font-size: 1.1em; font-weight: bold;}
            .newsDetails .newsDate {font-style: oblique; color: #666; margin-bottom: 10px;}
            .newsDetails .newsDesc {}
            
            /*2.3.1.3.7 search results #searchResults */
            #searchResults ul.disc li {padding-bottom: 10px;} 
            #searchResults .pading{}
            
            /* 2.3.1.3.7 Submit Event */
            form .notes {margin: 0 0 20px 0; border: 1px dotted #c90c26; background: #faf7e9; color: #6e7377; padding: 5px;}
            form .notes .red {color: #c90c26;}
            
            /* 2.3.1.3.8 Google Calendar*/
            .oneCol .eventCalendar  {}
            .oneCol .eventCalendar iframe {}
        
      /* 2.3.2 Second column / div#secondCol */
      #secondCol {width: 240px; /* left column width */
      margin-left: -251px; /* _negative_ left column width */
      padding: 5px 0; float: left; position: relative; z-index: 10; }
      #secondCol { margin-right: 1px; }
      #home #secondCol {width: 295px; margin-left: -296px;}
            
         /* 2.3.2.1   default sidebar item  /div.default    */
         .sidebar {margin: 0 0px 10px 0px; padding: 5px 10px 10px 10px;}
         .sidebar h2{font-size: 1.3em; font-weight: bold; width: 180px; margin: 0 0 .5em 0; padding: 5px 5px 10px 0;}
         .sidebar a:hover img {border: none;}
                                   
         /* 2.3.2.2    online poll /div.poll  */      
         .poll {margin: 0 0 10px 0; padding: 5px 15px 15px 10px;}
         .poll h2 {font-size: 1.3em; font-weight: bold; text-transform: uppercase; width: 180px; margin: 0 0 .5em 0; padding: 5px 5px 10px 0; background: url(/images/background/poll_icon.gif) no-repeat 100% 0%;}
         .redTxt {color: #cc3300; font-size: 1.1em; font-weight: bold;}    
         .poll label {padding: 0px 0px 0px 10px; font-weight: bold;}
         .poll input {margin: 5px 0 5px 0; vertical-align: middle;}
         
          /*2.3.2.3 news / div.news */
           .news {margin: 0 0 10px 0; padding: 5px 15px 15px 10px;}
           .news h2 {font-size: 1.3em; font-weight: bold; text-transform: uppercase; width: 160px; margin: 0 100px .5em 0; padding: 13px 0px 15px 0; background: url(/images/background/news_icon.gif) no-repeat 100% 0%;}
           .news ul.list {list-style: none; margin: 0; padding: 0; line-height: 120%}
           .news ul.list li {list-style: none; padding-bottom: 15px;}
           .news .title {font-size: 1.1em; color: #000;font-weight: bold; margin-top: 10px;}
           .news .date {color: #666; font-size: .95em; font-style: oblique;}
           .news .desc {margin: 10px 0 0 0; padding: 0px;}
           .news .desc p{display: inline; margin-bottom: 0px; padding-bottom: 0px;}
           .news .link {padding-bottom: 25px;}
         
         /*2.3.2.4 register Parent Coalition event/ div.registerEvent */
         .registerEvent {margin: 0 0 20px 0;}
         .registerEvent img{margin: 5px auto 10px auto; display: block; text-align: center;}
         
         /* 2.3.2.5    sub/local navigation /div#subNav  */ 
      /* background: #a0e566; */     
         #subNav {background: #a0e566; margin: 6px 0px 30px 0px; line-height: 115%;}
         #subNav h2 {font-size: 1.3em; padding: 12px 5px 12px 10px; margin: 0; border-bottom: 3px solid #fff; color: #000; background: #a0e566;}
         #subNav ul {border-top: 1px solid #a0e566; padding: 0 5px 10px 5px; margin: 0; background: #a0e566;}
         #subNav ul a {border-bottom: 1px solid #fff;}
         #subNav li a {font-size: 1.2em; color: #000; display: block; background: #a0e566; padding: 6px 5px 6px 10px;}
         #subNav li a:hover, #subNav .current a {color: #000; background: #c3f797; }
         #subNav ul li {display: inline; line-height: 120%;}
        
            /* 2.3.2.5.1     sub/local navigation the third level    */ 
            #subNav ul ul {padding: 0; background:  #a0e566; border: none;}
            #subNav li li a{padding-left: 40px;}
            #subNav .current li a, #subNav li li a {background: #a0e566; color: #000;}
            #subNav .current .current a, #subNav li li a:hover, #subNav .current li a:hover{ background: #c3f797; }  

      /* 2.3.3 Third column / div#thirdCol */
      #thirdCol {width: 250px;  /* right column width */
      margin-right: -251px;   /* _negative_ right column width */
      padding: 5px 0; float: right; position: relative; z-index: 11; }
      #thirdCol { margin-left: 1px;}   
      #home #thirdCol {width: 295px; margin-right: -296px;}
            
         /* 2.3.3.1    Events sidebar /div.events   */ 
           .events {margin: 0 0 10px 0; padding: 5px 20px 15px 25px;}
           .events h2 {font-size: 1.3em; font-weight: bold; text-transform: uppercase; width: 160px; margin: 0 0 .5em 0;  padding: 10px 5px 10px 0; background: url(/images/background/calendar_icon.gif) no-repeat 100% 0%;}
           .events ul.list {list-style: none; margin: 0; padding: 0; line-height: 140%}
           .events ul.list li {list-style: none; padding-bottom: 7px;}
           .events .title {font-size: 1.05em; font-weight: bold;}
           .events .date {} /* color: #7ab34d; font-weight: bold; */
           .events .location {}
           .events .desc {}
          
          /* 2.3.3.2    mailing list /div.mailing  */ 
           .mailing {margin: 0 0 10px 0; padding: 5px 20px 15px 25px;}
           .mailing h2 {font-size: 1.3em; font-weight: bold; text-transform: uppercase; width: 180px; margin: 0 0 .5em 0;  padding: 10px 20px 10px 0; background: url(/images/background/mailing_icon.gif) no-repeat 100% 0%;}
              
          /* 2.3.3.3     online poll /div.poll  */     
          .poll {border-bottom: 1px dotted #3366cc; margin: 0 0 10px 0; padding: 5px 20px 15px 30px;}
          .poll h2 {font-size: 1.3em; font-weight: bold; text-transform: uppercase; width: 180px; margin: 0 0 .5em 0; padding: 5px 5px 10px 0; background: url(/images/background/poll_icon.gif) no-repeat 100% 0%;}
          .redTxt, .poll-question {margin: 6px auto; color: #cc3300; font-size: 1.1em; font-weight: bold;}    
          .poll label {padding: 0px 0px 0px 10px; font-weight: bold;}
          .poll input {margin: 5px 0 5px 0; vertical-align: middle; font-weight: bold;}     
          
        /* 2.3.3.4 update password/profile */
          .update_password {margin: 15px 0; display: block;font-weight: bold; font-size: 1em; }
          .update_password h2{margin: 0; padding: 0; display:inline;}
          .update_password form {display: inline; margin: 0; padding: 0; }
          .update_password p {line-height: 100%; display: inline;}
          .update_password .login_notice {text-align:center; color: #193764; font-size: 1.1em;padding-bottom: 7px; font-weight: bold;}
          .update_password img {display: block; margin: auto;}
          .update_password .link { border-top: 2px solid #fff;}
          .update_password a {padding: 4px 5px; background: #4369a3; display: block; color: #fff; }
          .update_password a:hover {border-bottom: none; background: #9ebfef; color: #000;}
  
   /*..................................................................................
     2.4 Footer / div#footer  
     .................................................................................*/
   #footer {color: #666; overflow: hidden; margin: 0 0 10px 0; padding: 20px 15px; border-top: 1px dotted #3366cc;  width: 100%;}
   
      /* 2.4.1 Footer navigation / ul#footNav */
      #footNav {overflow: hidden; width: 600px; float: left; }
      #footNav ul {float: left; margin: 0; padding:0; background: url(/images/navs/foot_nav_divider.gif) no-repeat 0% 50%;}
      #footNav ul li {display: inline; padding: 0px 20px; background: url(/images/navs/foot_nav_divider.gif) no-repeat 100% 50%;}
      #footNav ul li a {text-transform: uppercase;font-size: 12px; font-weight: bold; color: #666; margin: 0;}
      #footNav ul li a:hover, #footNav ul li.current a {text-decoration: none; font-weight: bold; color: #0066cc;}
 
      /* 2.4.2 Footer copyright / div.copyright */
      #footer .copyright {color: #666; float: left; width: 300px; overflow: hidden;}