@import url("/stylesheets/forms.css"); 
/*============================================================================
[Screen Stylesheet]
==============================================================================
Project: Great Start Collabortive - Macomb County
Version: 1.0
Last Modified: 07/13/2009 
Assigned to:   Meili Chen - 07/13/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 Search / div#search  
       2.1.3 Utility navigation / ul#utility
         2.1.3.1  Utility navigation / #utilityNav
         2.1.3.2  Translation nav / #translation
       2.1.4 Global navigation / div#globalNav
                 2.1.4.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.faq-cat
                    2.3.1.3.2 Events list
                    2.3.1.3.3 Mini calendar
                    2.3.1.3.4 Login/ Manage Account pages div#account
           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]
================================================================================
#000000  yellow {body text, menu dropdown text, sidebar title }
#ffd204  blalck {golbal nav items hover color}
#7b9bba  grey  {breadcrumbs hover}
#666666  grey  {news date, footer text}

#ffffff  white {body bg, main content bg, utility & global nav color}

#ffd204  yellow {photo border, link hover}
#a5d93c  green {subnav bg}
#caf07a  light green {subnav second level hover}
#9cc54a  light green {subnav third level hover}

#3366cc  blue  {dotted lines between columns}
#d1d9da  light blue {hr line}
#0066cc  blue (default link, footer hover)
#005dab  blue (h1 home tagline/title)
#3366cc  blue (breadcrumbs dotted line, sidebar dotted line, layout dottedline)
#0054a6  blue (breadcrumbs text)
#7b9bba  blue (breadcrumbs hover)

#de0202  #e70101  red   {nav1 bar, dropdown }
#f66a0c  #ff6d0b  orange {nav2 bar,dropdown}
#fbdb49     #fddb3e  yellow {nav3 bar},dropdown
#9ad12d  #99cc33  green {nav4 bar,dropdown}
#018ce9  #0191f1  blue  {nav5 bar,dropdown}
#2b2bb1  #3c3cc7  dark blue   {nav6 bar,dropdown}
#6c34a5  #763cb1  purple   {nav7 bar,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:1.2em;}
td, th {padding: 0.1em 1em;   border: 1px solid #999; }

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: #669933; 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 solid #ffd204;}

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: 965px; 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 / h1 */
      #header h1 {height: 100px; width: 387px; margin: 0; padding: 0; background: url(/images/background/client_logo.jpg) no-repeat;  text-indent: -9000px; float: left; }
      #header h1 a {display: block; height: 100px; width: 390px; background: url(/images/background/client_logo.jpg) no-repeat;}
      #header h1 a:hover {border-bottom: none;}

      /* 2.1.2 search / #search */
      #search {text-align: right; width: 500px; margin: 10px 0 0 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.3 utility / #utility */
      #utility {font-size: 13px; width: 572px;  padding: 0px; margin: 18px 0px 10px 0;text-align: right; float: right; overflow: hidden;}
         /*2.1.3.1 / #utilityNav */
         #utilityNav {width: 450px; margin: 0px; padding: 0; display: block; float: right;}
         #utilityNav ul {float: right; width: 100%;  padding: 0px; margin: 0px;}
         #utilityNav ul a {display: block;}
         #utilityNav ul li {float: right; display: inline; padding: 0px; margin: 0;}
         #utilityNav ul li a{background: url(/images/navs/utility_nav_off.gif) no-repeat 100% 100%; display: block;  vertical-align: middle; padding: 0 16px 8px 14px; font-weight: bold; color: #fff; text-align: center;}
         #utilityNav ul li a:hover, #utilityNav ul li.current a {text-decoration: none; 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.2 /translation item #translate */
         /* translation item  #translate*/
         #translate {width: 92px; margin: 0px; padding: 0; display: block; float: right;}
         #translate ul {float: right; width: 100%;  padding: 0px; margin: 0px;}
         #translate  ul a {display: block;}
         #translate  ul li {float: left; display: inline; padding: 0px; margin: 0;}
         #translate ul li a{background: url(/images/navs/utility_nav_off.gif) no-repeat 0% 100%; display: block;  vertical-align: middle; padding: 0 16px 8px 14px; font-weight: bold; color: #fff; text-align: center;}
         #translate ul li a:hover, .translate ul li .current a {text-decoration: none; background: url(/images/navs/utility_nav_on.gif) no-repeat 0% 100%; border-bottom: none;}
         
            /*translation dropdown  / #translation ul ul*/
            #translate ul ul{position: absolute;  width: 88px; left: -999em; margin: 0px 0 0 -2px!important;  padding: 0; z-index: 100; padding: 2px; overflow: hidden;  float: none;filter:alpha(opacity=95); opacity: .95; -moz-opacity:.95; }
            #translate ul ul a {text-align: left; margin-right: 0; font-weight: normal; padding: 8px 10px!important; }
            #translate ul li ul li {float: none; margin: 0!important; display: inline; }
            #translate ul li:hover ul, #translate li.sfhover ul {left: auto; padding-right: 0px; margin: -2px 0 0 0; }
            #translate ul li ul li a {background: #ffd204; color: #000; font-weight: bold; line-height: 100%; }
            #translate ul li ul a:hover {background: #99cc33; }
            
      /* 2.1.4. 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: #fff;}
      .nav1 a{ border-bottom: 10px solid #e70101;}
      .nav2 a{ border-bottom: 10px solid #ff6d0b;}
      .nav3 a{ border-bottom: 10px solid #fddb3e;}
      .nav4 a{ border-bottom: 10px solid #99cc33;}
      .nav5 a{ border-bottom: 10px solid #0191f1;}
      .nav6 a{ border-bottom: 10px solid #3c3cc7;}
      .nav7 a{ border-bottom: 10px solid #763cb1;}
      .nav1 a:hover, .nav1 .current a{border-bottom: 10px solid #de0202; color: #ffd204;}
      .nav2 a:hover, .nav2 .current a{border-bottom: 10px solid #f66a0c; color: #ffd204;}
      .nav3 a:hover, .nav3 .current a{border-bottom: 10px solid #fbdb49; color: #ffd204;}
      .nav4 a:hover, .nav4 .current a{border-bottom: 10px solid #9ad12d; color: #ffd204;}
      .nav5 a:hover, .nav5 .current a{border-bottom: 10px solid #018ce9; color: #ffd204;}
      .nav6 a:hover, .nav6 .current a{border-bottom: 10px solid #2b2bb1; color: #ffd204;}
      .nav7 a:hover, .nav7 .current a{border-bottom: 10px solid #6c34a5; color: #ffd204;}
       
         /* 2.1.4.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: #de0202; width: 67px; }
         #globalNav ul li.nav2 ul.dropdown li a{background: #f66a0c; width: 125px;}
         #globalNav ul li.nav3 ul.dropdown li a {background: #fbdb49; width: 104px;}
         #globalNav ul li.nav4 ul.dropdown li a {background: #9ad12d; width: 77px;}
         #globalNav ul li.nav5 ul.dropdown li a {background: #018ce9; width: 114px;}
         #globalNav ul li.nav6 ul.dropdown li a {color: #ebebf6; background: #2b2bb1; width: 178px;}
         #globalNav ul li.nav7 ul.dropdown li a {color: #ebebf6; background: #6c34a5; 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: 476px; height: 263px; overflow: hidden;background: #fff;}
      #photos {float: left; margin-left: 6px; 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: 10px 0;   width: 100%; position: relative; 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: 8px 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/star-kid.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 Family Events /Calendar div.events_list */
            
            .eventsList {background: #f7f7f4;border: 1px solid #ddd; margin-bottom: 20px;}
            .eventsList .date {font-weight: bold;background: #dbdfdf; border-top: none; border-bottom: 1px solid #ddd; margin-bottom: 5px; padding: 3px 10px;}
            .eventsList .content {margin: 10px; background: #fff; color: #333;  border: 1px dotted #ddd; padding: 10px;}
            .eventsList .detail{color: #666; font-weight: bold;}
            
            /*2.3.1.3.3 left small calendar */
            /*#calender-wrapper {margin: 45px 8px 15px 7px; padding: 8px; width: 224px; border: 1px solid #c8c8c1; background: #e9ecec url(/images/misc/calendar_kid.jpg) no-repeat 10px 10px;}*/
            .mini_calendar {margin: 0; padding: 0;}
            .mini_calendar h2 {margin: 0; padding: 0; line-height: 100%; display: none;}
            .mini_calendar p {margin: 0; padding: 0;}
            #mo_yr_nav {padding: 135px 0px 10px 0px; margin: 0 0 15px 0; }
            #mo_yr_nav select {border: 1px dotted #cad1d2; padding: 2px; margin-right: 5px;}
            #mo_yr_nav #mo {width: 115px;}
            #mo_yr_nav .submit_btn {background: #cc3300; color: #fff1b3; border: 1px solid #cad1d2; font-weight: bold;}
            .calendar { background: #fff; text-align: center; margin: 0px 2px 25px 2px; width: 228px;}
            .calendar td, .calendar th { border: 1px solid #c1c1b9;  padding: .3em .2em .2em .2em; text-align: center;}
            .calendar th {background: #ccddff; }
            .calendar td, .calendar td a {color: #333;}
            .calendar .dayName th {width: 26px;}
            .calendar #prev a, .calendar #next a {color: #0066cc;}
            .calendar td a:hover {border-bottom: none;}
            .calendar caption {font-size: 1.2em; font-weight:bold;}
            .calendar td.otherMonth {color: #ccc;}
            .calendar tr.monthName th {background: #1061d7; color: #fff;}
            .calendar tr.monthName a {padding: 0 5px; color: #ffd204;}
            .calendar tr.monthName a:hover {border-bottom: none; color: #ff7a04;}
            
            td.cal_cat-1, td.cal_cat-2, td.cal_cat-3, td.cal_cat-4, td.cal_cat-5, td.cal_cat-6, td.cal_cat-7, td.specialDay {font-weight: normal; color: #000;}
         
            .cal_cat-1 {background: #ffdb36;}
            .cal_cat-2 {background: #de0202;}
            .cal_cat-3 {background: #ffd203;}
            .cal_cat-4 {background: #018ce9;}
            .cal_cat-5 {background: #6c34a5;}
            .cal_cat-6 {background: #2b2bb1;}
            .cal_cat-7 {background: #a4c141;}
            .cal_cat-multiple {background: #f66a0c;}
            
            .cal_cat-1:hover {background: #fff url(/images/misc/star.gif) no-repeat 50% 50%;}
            .cal_cat-2:hover {background: #de0202 url(/images/misc/star.gif) no-repeat 50% 50%;}
            .cal_cat-3:hover {background: #ffd203 url(/images/misc/star.gif) no-repeat 50% 50%;}
            .cal_cat-4:hover {background: #018ce9 url(/images/misc/star.gif) no-repeat 50% 50%;}
            .cal_cat-5:hover {background: #6c34a5 url(/images/misc/star.gif) no-repeat 50% 50%;}
            /*.cal_cat-5:hover {background: #fff url(/images/misc/cat2.gif) no-repeat 50% 50%;} commented "#5"s are available for use later. */
            .cal_cat-6:hover {background: #2b2bb1 url(/images/misc/star.gif) no-repeat 50% 50%;}
            .cal_cat-7:hover {background: #fff url(/images/misc/star.gif) no-repeat 50% 50%;}
            .cal_cat-multiple:hover {background: #f66a0c url(/images/misc/star.gif) no-repeat 50% 50%;}
            
            .calender h2 {margin: 15px 0 5px 0; text-align: center; font-size: 1.2em; margin: 0; padding: 3px 5px;}
            .filter {background: #fff; margin: 5px 0; padding: 5px; border: 1px solid #c1c1b9;}
            .filter a {color: #666; display: block; margin-bottom: 6px; padding: 3px 0 2px 5px; border-bottom: 1px dotted #c1c1b9;}
            .filter a:hover {color: #fff;}
            
            .category-1 a{border-left: 5px solid #ffdb36;}
            .category-2 a{border-left: 5px solid #de0202;}
            .category-3 a{border-left: 5px solid #ffd203;}
            .category-4 a{border-left: 5px solid #018ce9;}
            .category-5 a{border-left: 5px solid #6c34a5;}
            .category-6 a{border-left: 5px solid #2b2bb1;}
            .category-7 a{border-left: 5px solid #a4c141;}
            .category-8 a{border-left: 5px solid #e70101;}
            .category-9 a{border-left: 5px solid #763cb1;}
            .category-10 a{border-left: 5px solid #3c3cc7;}
            .category-multiple a{border-left: 5px solid #f66a0c;}
            .category-none a{border-left: 5px solid #9ad12d;}
            .filter-label {color: #666; display: block; margin-bottom: 6px; padding: 3px 0 2px 5px; border-left: 5px solid #fff;}
            
            .category-1 a:hover {background: #ffdb36;}
            .category-2 a:hover {background: #de0202;}
            .category-3 a:hover {background: #ffd203;}
            .category-4 a:hover {background: #018ce9;}
            .category-5 a:hover {background: #6c34a5;}
            .category-6 a:hover {background: #2b2bb1;}
            .category-7 a:hover {background: #a4c141;}
            .category-8 a:hover {background: #e70101;}
            .category-9 a:hover {background: #763cb1;}
            .category-10 a:hover {background: #3c3cc7;}
            .category-multiple a:hover {background: #f66a0c;}
            .category-none a:hover {background: #9ad12d;}
            
            .eventsList .eventTitle strong {color: #fff; padding-left: 5px; font-size: 1.25em;}
            .eventsList p.cal_cat-1 {background: #ffdb36;}
            .eventsList p.cal_cat-2 {background: #de0202;}
            .eventsList p.cal_cat-3 {background: #ffd203;}
            .eventsList p.cal_cat-4 {background: #018ce9;}
            .eventsList p.cal_cat-5 {background: #6c34a5;}
            .eventsList p.cal_cat-6 {background: #2b2bb1;}
            .eventsList p.cal_cat-7 {background: #a4c141;}
            .eventsList p.cal_cat-8 {background: #e701012;}
            .eventsList p.cal_cat-9 {background: #763cb1;}
            .eventsList p.cal_cat-10 {background: #3c3cc7;}

            .hover_detail .eventTitle {padding-left: 5px; font-weight: bold;}
            .hover_detail p.cal_cat-1 {background: #ffdb36;}
            .hover_detail p.cal_cat-2 {background: #de0202;}
            .hover_detail p.cal_cat-3 {background: #ffd203;}
            .hover_detail p.cal_cat-4 {background: #018ce9;}
            .hover_detail p.cal_cat-5 {background: #6c34a5;}
            .hover_detail p.cal_cat-6 {background: #2b2bb1;}
            .hover_detail p.cal_cat-7 {background: #a4c141;}
            .hover_detail p.cal_cat-8 {background: #4a9c0a;}
            .hover_detail p.cal_cat-9 {background: #763cb1;}
            .hover_detail p.cal_cat-10 {background: #3c3cc7;}
                     
            .hover_detail a {color: #0066cc; font-weight: bold;}
            .hover_detail a:hover {border-bottom: 1px solid #ffd204;}
            
            table.calendar td a {display: block!important;}
            table.calendar td:hover, table.calendar td.iehover {z-index: 999;}
            td.specialDay a {color: #eee; font-weight: bold;}
            td.specialDay .hover_detail {position: absolute; display: none; width: 12em; z-index: 999; text-align: left; background: #fff; border: 1px solid #aaa; 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.3em !important;}
            td .hover_detail .eventTitle {color: #eee;}
                   
            /* 2.3.1.3.4 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.2 Second column / div#secondCol */
      #secondCol {width: 250px; /* 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 0 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;}
                           
         /* 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: 130px; 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: 7px;}
           .news .title {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  */                                                                
         #subNav {background: #a5d93c; margin: 0px 8px 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: #a5d93c;}
         #subNav ul {border-top: 1px solid #a5d93c; padding: 0 5px 10px 5px; margin: 0; background: #a5d93c;}
         #subNav ul a {border-bottom: 1px solid #fff;}
         #subNav li a {font-size: 1.2em; color: #000; display: block; background: #a5d93c; padding: 6px 5px 6px 10px;}
         #subNav li a:hover, #subNav .current a {color: #000; background: #caf07a; }
         #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:  #a5d93c; border: none;}
            #subNav li li a{padding-left: 40px;}
            #subNav .current li a, #subNav li li a {background: #a5d93c; color: #000;}
            #subNav .current .current a, #subNav li li a:hover, #subNav .current li a:hover{ background: #caf07a; }  

      /* 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    family events /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: 120%}
           .events ul.list li {list-style: none; padding-bottom: 7px;}
           .events .title {font-size: 1.1em; font-weight: bold;}
           .events .date {color: #3b790b;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 {width: 220px; border: 1px solid #79ac35; margin: 15px auto; display: block; padding: 2px; 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: #446b10; 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: #79ac35; display: block; color: #fff; }
         .update_password a:hover {border-bottom: none; background: #ccdd91; 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;}