#body { 
    background-color: #ffffff;
      }

#thepage { top: 0px;
            /*max-width: 1000px;*/
            width: 100%;
            height: auto;
            background-color: transparent;
            font-size: 1em;
            font-family: Arial, verdana, sans-serif;
            margin-left: auto;
            margin-right: auto;
         }

#pageheader { position: relative;
              top: 0px;
              left: 0px;
              max-width: 1000px;
              width: 100%;
              height: 0px;
              padding-top: 12%;
              margin-left: auto;
              margin-right: auto;
              background-color: transparent;
           }

#logo { position: absolute; 
        top: 14px;
        left: 40px;
        width: 23.7%;
        height: auto;
        background: transparent;
     }

#fitlogo { position: absolute; 
        top: 14px;
        left: 60px;
        width: 250px;
        height: 92px;
        background: transparent;
     }

#swimlogo { position: absolute; 
        top: 14px;
        left: 60px;
        width: 250px;
        height: 92px;
        background: transparent;
     }

#mobnav { display: none; }

#hdlogin { position: absolute; 
        top: 90px;
        left: 950px;
        width: 50px;
        height: 30px;
        font-size:0.8em;
        color: #ffffff;
        background-color: transparent;
     }
#hdlogin a { color: #ffffff; }

.contact { position: absolute; 
        top: 8px;
        left: 30%;
        width: 70%;
        height: 30px;
        font-weight: bold;
        font-size: 0.8em;
        text-align: right;
        background-color: transparent;
     }


#navdiv { position: relative;
          top: 0px;
          left: 0px;
          width: 100%;
          height: 40px;
          background-color: #0e76bd;
          border-bottom: 4px #45b7c1 solid;
          z-index: 111;
      }

#nav { max-width: 1000px; width: 100%; height: auto; background: transparent; margin-left: auto; margin-right: auto; padding: 0px; z-index:111; }
#nav a { height: 32px; text-align: center; text-transform: uppercase; font-weight: bold; display: block; margin: 0; padding: 8px 0px 0px 0px; }
#nav a { color: #ffffff; background: transparent; text-decoration: none; }
#nav a:hover { color: #000000; background: transparent; }

#nav ul { position:relative; list-style: none; margin: 0; padding: 0; top: 0px; left: 0px; width: 100%; }
#nav li { position:relative; float: left; width: 11%; background: transparent; }

#nav ul ul { position: absolute; list-style: none; margin: 0; padding: 0; top: 30px; left: 0px; width: 140%; }
#nav ul ul li { position:relative; float: none; background: #0e76bd; border: 1px #999999 solid; border-top: 0px; width: 110%; padding-left: 5px; }
#nav ul ul li:hover { background-color: #45b7c1; }
#nav ul ul li a { text-align: left; }

#nav ul ul ul { position: absolute; list-style: none; margin: 0; padding: 0; top: 0px; left: 100%; width: 100%; }
#nav ul ul ul li { position:relative; float: none; background: #0e76bd; width: 100%; border: 1px #999999 solid; border-top: 0px; width: 100%; }
#nav ul ul ul li:hover { background-color: #45b7c1; }
#nav ul ul ul li a { text-align: left; }

div#nav ul ul, div#nav ul li:hover ul ul, div#nav ul ul ul, div#nav ul ul li:hover ul ul { display: none; }
div#nav ul li:hover ul, div#nav ul ul li:hover ul, div#nav ul ul li:hover ul, div#nav ul ul ul li:hover ul { display: block; z-index:100; }


.pageplus { display: none; font-size: 1.2em; }

#homepage { position: relative;
            top: 0px;
            left: 0px;
            width: 100%;
            height: 100%;
            background: transparent url('images/backgrounds/home-blue-gradient.png') repeat-x;
         }

#contentpage { position: relative;
           top: 0px;
           left: 0px;
           width: 100%;
           height: 100%;
           background: transparent url('images/backgrounds/blue-gradient1.png') repeat-x;
         }

#pagecontent { position: relative;
               top: 0px;
               left: 0px;
               margin-left: auto;
               margin-right: auto;
               display: table;
               width: 100%;
               max-width: 1000px;
               height: 600px;
               background-color: transparent;
             }

#leftpane { position: absolute:
            top: 0px;
            left: 0px;
            width: 72%;
            height: 600px;
            background-color: transparent;
            padding-left: 0px;
            padding-right: 1%;
            vertical-align: top;
            text-align: justify;
            display: table-cell;
            font-size: 0.8em;
            font-family: Arial, verdana, sans-serif;
           }

#rightpane { position: absolute:
             top: 0px;
             left: 0px;
             width: 24%;
             height: 600px;
             background-color: transparent;
             vertical-align: top;
             text-align: justify;
             display: table-cell;
             font-size: 0.8em;
             font-family: Arial, verdana, sans-serif;
            }

.lefttext { font-size: 1em;
            font-family: Arial, verdana, sans-serif;
            text-align: justify;
            background: transparent;
          }

.righttext { font-size: 1em;
             font-family: Arial, verdana, sans-serif;
             text-align: justify;
             background: transparent;
           }

.padfooter { position: relative:
             top: 0px;
             left: 0px;
             width: 100%;
             height: 20px;
             background-color: transparent;
             clear: both;
           }

#footer { position: relative;
          top: 0px;
          left: 0px;
          width: 100%;
          height: auto;
          background-color: #eeeeee; /*transparent;*/
        }

#footersocial { 
              top: 0px;
              left: 0px;
              width: 100%;
              height: 100px;
              color: #ffffff;
              background-color: #0e76bd;
              padding-top: 24px;
            }

#footernav { 
              top: 100px;
              left: 0px;
              width: 100%;
              color: #ffffff;
              background-color: #3a3e41;
              height: auto;
              font-size: 1em;
              font-family: Arial, verdana, sans-serif;
              font-weight: bold;
              padding-top: 5px;
            }
.footnav {    color: #ffffff;
              background: transparent;
              font-size: 1em;
              font-family: Arial, verdana, sans-serif;
              font-weight: bold;
              width: 100%;
              max-width: 1000px;
              margin-left: auto;
              margin-right: auto;
              text-align: center:
            }

#ulfoot { list-style: none; margin: 0; padding: 0; }
#ulfoot li { background-color: transparent; height: 30px; list-style: none; }
#ulfoot li a { height: 25px; font-family: arial, verdana, helvetica, sans-serif; font-weight: bold; font-size: 0.9em; display: block; margin: 0; padding: 5px 0px 0px 6px; }
#ulfoot li a { color: #ffffff; background: transparent; text-decoration: none; }
#ulfoot li a:hover { color: #f89d37; background: transparent; }

.subpageplus { display: none; font-size: 1.2em; }

#subnavdiv { position: relative;
          top: 0px;
          left: 0px;
          width: 100%;
          height: 40px;
          background-color: transparent;
          z-index: 11;
      }

#subnav { max-width: 1000px; width: 100%; height: auto; background: transparent; margin-left: auto; margin-right: auto; padding: 0px; z-index:111; }
#subnav a { text-align: center; text-transform: uppercase; font-weight: bold; font-size: 0.95em; display: block; margin: 0; padding: 10px 10px 10px 10px; }
#subnav a { color: #000000; background: transparent; text-decoration: none; }
#subnav a:hover { color: #000000; background: #eee; }

#subnav a.selected { 
        background-color: #eee;
}

#subnav ul { position:relative; list-style: none; margin: 0; padding: 0; top: 0px; left: 0px; width: 100%; }
#subnav li { position:relative; float: left; background: transparent; }
#subnav li.col10 { width: 10%; }
#subnav li.col9 { width: 11.11%; }
#subnav li.col8 { width: 12.5%; }
#subnav li.col7 { width: 14.285%; }
#subnav li.col6 { width: 16.666%; }
#subnav li.col5 { width: 20%; }
#subnav li.col4 { width: 25%; }
#subnav li.col3 { width: 33.333%; }
#subnav li.col2 { width: 50%; }
#subnav li.col1 { width: 100%; }

#subnav ul ul { position: absolute; list-style: none; margin: 0; padding: 0; top: 50px; left: 0px; width: 100%; }
#subnav ul ul li { position:relative; float: none; background: #c8e7f7; }
#subnav ul ul li:hover { background: #57c8d2; }
#subnav ul ul li.col10 { width: 110%; }
#subnav ul ul li.col9 { width: 110%; }
#subnav ul ul li.col8 { width: 110%; }
#subnav ul ul li.col7 { width: 110%; }
#subnav ul ul li.col6 { width: 110%; }
#subnav ul ul li.col5 { width: 110%; }
#subnav ul ul li.col4 { width: 110%; }
#subnav ul ul li.col3 { width: 110%; }
#subnav ul ul li.col2 { width: 110%; }
#subnav ul ul li.col1 { width: 110%; }
#subnav ul ul li a { text-align: left; }
#subnav ul ul li a:hover { color: #000000; text-shadow: none; }

#subnav ul ul ul { position: absolute; list-style: none; margin: 0; padding: 0; top: 0px; left: 100%; width: 100%; }
#subnav ul ul ul li { position:relative; float: none; background: #c8e7f7; border: 1px #000000 solid; border-top: 0px; width: 100%; }
#subnav ul ul li:hover { background: #57c8d2; }
#subnav ul ul ul li a { text-align: left; }
#subnav ul ul ul li a:hover { color: #000000; text-shadow: none; }

div#subnav ul ul, div#subnav ul li:hover ul ul, div#subnav ul ul ul, div#subnav ul ul li:hover ul ul { display: none; }
div#subnav ul li:hover ul, div#subnav ul ul li:hover ul, div#subnav ul ul li:hover ul, div#subnav ul ul ul li:hover ul { display: block; z-index:100; }

#centrefind { position: relative;
             top: 0px;
             left: 0px;
             width: 100%;
             height: auto;
             padding-top: 10px;
             background-color: transparent;
             cursor: pointer;
           }
#centrefindhd { position: relative;
               top: 0px;
               left: 0px;
               width: 100%;
               height: 31px;
               background-color: transparent;
               background: url('images/buttons/centre-finder.png') no-repeat;
               background-position:center; 
               z-index: 101;
             }
#centrefindinfo { position: relative;
                 top: -22px;
                 left: 0px;
                 width: 93.4%;
                 height: 246px;
                 padding: 24px 2.6% 0px 2.6%;
                 border: #f2f1ed 2px solid;
                 -moz-border-radius: 8px;
                 -webkit-border-radius: 8px;
                 border-radius: 8px; /* future proofing */
                 -khtml-border-radius: 8px; /* for old Konqueror browsers */
                 background-color: #e0e0e0;
                 background: url('images/allcentremap.png') no-repeat;
                 background-size: cover;
                 z-index: 10;
               }
#centrefindlink { position: absolute;
                  top: 256px;
                  left: 40px;
                  width: 100%;
                  height: 14px;
                  z-index: 101;
                }

#beachfind { position: relative;
             top: 0px;
             left: 0px;
             width: 100%;
             height: auto;
             padding-top: 10px;
             background-color: transparent;
             cursor: pointer;
           }
#beachfindhd { position: relative;
               top: 0px;
               left: 0px;
               width: 100%;
               height: 31px;
               background-color: transparent;
               background: url('images/buttons/beach-finder.png') no-repeat;
               background-position:center; 
               z-index: 101;
             }
#beachfindinfo { position: relative;
                 top: -22px;
                 left: 0px;
                 width: 93.4%;
                 height: 246px;
                 padding: 24px 2.6% 0px 2.6%;
                 border: #f2f1ed 2px solid;
                 -moz-border-radius: 8px;
                 -webkit-border-radius: 8px;
                 border-radius: 8px; /* future proofing */
                 -khtml-border-radius: 8px; /* for old Konqueror browsers */
                 background-color: #e0e0e0;
                 background: url('images/allbeachesmap.png') no-repeat;
                 background-size: cover;
                 z-index: 10;
               }
#beachfindlink { position: absolute;
                  top: 256px;
                  left: 40px;
                  width: 100%;
                  height: 14px;
                  z-index: 101;
                }

#centremap { position: relative;
             top: -30px;
             left: 0px;
             width: 100%;
             height: auto;
             background-color: transparent;
           }
#centremaphd { position: relative;
               top: 0px;
               left: 0px;
               width: 100%;
               height: 31px;
               background-color: transparent;
               background: url('images/buttons/centre-map.png') no-repeat;
               background-position:center; 
               z-index: 101;
             }
#centremapinfo { position: relative;
                 top: -22px;
                 left: 0px;
                 width: 93.4%;
                 height: auto;
                 padding: 24px 2.6% 0px 2.6%;
                 border: #f2f1ed 2px solid;
                 -moz-border-radius: 8px;
                 -webkit-border-radius: 8px;
                 border-radius: 8px; /* future proofing */
                -khtml-border-radius: 8px; /* for old Konqueror browsers */
                 background-color: #e0e0e0;
                 background-size: cover;
                 z-index: 10;
               }

#centretimes { width: 93.4%;
               background-color: #ffffff;
               margin-bottom: 2px;
               padding: 2px 2.6% 2px 2.6%;
               -moz-border-bottom-left-radius: 8px;
               -webkit-border-bottom-left-radius: 8px;
               border-bottom-left-radius: 8px; /* future proofing */
              -khtml-border-bottom-left-radius: 8px; /* for old Konqueror browsers */
               -moz-border-bottom-right-radius: 8px;
               -webkit-border-bottom-right-radius: 8px;
               border-bottom-right-radius: 8px; /* future proofing */
              -khtml-border-bottom-right-radius: 8px; /* for old Konqueror browsers */
             }

#sidebartimetable { position: relative;
                    top: -18px;
                    left: 0px;
                    width: 100%;
                    height: auto;
                    padding-top: 10px;
                    background-color: transparent;
                  }
#timetablehd { position: relative;
               top: 0px;
               left: 0px;
               width: 100%;
               height: 31px;
               background: transparent url('images/buttons/class-timetable.png') no-repeat;
               background-position:center; 
               z-index: 101;
             }
#timetableinfo { position: relative;
                 top: -22px;
                 left: 0px;
                 width: 93.4%;
                 height: auto;
                 padding: 24px 2.6% 0px 2.6%;
                 border: #f2f1ed 2px solid;
                 -moz-border-radius: 8px;
                 -webkit-border-radius: 8px;
                 border-radius: 8px; /* future proofing */
                -khtml-border-radius: 8px; /* for old Konqueror browsers */
                 background-color: #e0e0e0;
                 z-index: 10;
               }

#pagegallery { position: relative;
             top: -40px;
             left: 0px;
             width: 100%;
             height: auto;
             padding-top: 10px;
             background-color: transparent;
           }
#gallery { position: relative;
             top: 0px;
             left: 0px;
             width: 100%;
             height: auto;
             padding-top: 10px;
             background-color: transparent;
           }
#galleryhd { position: relative;
               top: 0px;
               left: 0px;
               width: 100%;
               height: 31px;
               background: transparent url('images/buttons/photo-gallery.png') no-repeat;
               background-position:center; 
               z-index: 101;
             }
#galleryinfo { position: relative;
                 top: -22px;
                 left: 0px;
                 width: 93.4%;
                 height: auto;
                 padding: 26px 2.6% 10px 2.6%;
                 border: #f2f1ed 2px solid;
                 -moz-border-radius: 8px;
                 -webkit-border-radius: 8px;
                 border-radius: 8px; /* future proofing */
                -khtml-border-radius: 8px; /* for old Konqueror browsers */
                 background-color: #e0e0e0;
                 z-index: 10;
               }

#joinnow { position: relative;
           top: -30px;
           left: 0px;
           width: 100%;
           height: 150px;
           padding: 4px 2px 4px 4px;
/*
           border: #f2f1ed 2px solid;
           -moz-border-radius: 8px;
           -webkit-border-radius: 8px;
           border-radius: 8px;
           -khtml-border-radius: 8px;
*/
           background-color: transparent; /*#e0e0e0;*/
           z-index: 10;
         }

#sidenews { position: relative;
             top: -30px;
             left: 0px;
             width: 100%;
             height: auto;
             background-color: transparent;
           }
#sidenewshd { position: relative;
               top: 0px;
               left: 0px;
               width: 100%;
               height: 31px;
               background-color: transparent;
               background: url('images/buttons/sidenews.png') no-repeat;
               background-position:center; 
               z-index: 101;
             }
#sidenewsinfo { position: relative;
                 top: -22px;
                 left: 0px;
                 width: 93.4%;
                 height: auto;
                 padding: 24px 2.6% 0px 2.6%;
                 border: #f2f1ed 2px solid;
                 -moz-border-radius: 8px;
                 -webkit-border-radius: 8px;
                 border-radius: 8px; /* future proofing */
                -khtml-border-radius: 8px; /* for old Konqueror browsers */
                 background-color: #e0e0e0;
                 z-index: 10;
               }

.slideshow { position: relative; width: 100%; height: 0px; padding-top: 47.222%; background: transparent; overflow: hidden; }

.centrepool { position: relative; width: 100%; height: 0px; padding-top: 16%; overflow: hidden; }

.progtitle { font-size: 1.2em;
             font-weight: bold;
           }
.popfit { width: 40%;
           min-height: 180px;
           background-color: #ffffff;
           z-index: 501;
           position: absolute;
           text-align: justify;
           padding: 2px 8px 2px 8px;
           border: 2px #000000 solid;
           -moz-border-radius: 10px;
           -webkit-border-radius: 10px;
           border-radius: 10px;
           -khtml-border-radius: 10px;
        }
.popfitlink { cursor: pointer; color: #0000ff; display: inline; }
.popfitlink:hover { color: #ff0000; }
.popfit img { width: 100%; }

h1 { color: #ffffff;
     background: #0e76bd;
     font-size: 1.2em;
     line-height: 1.6em;
     font-weight: bold;
     padding-left: 10px;
     display: block;
   }

h2 { color: #000000;
     font-size: 2.2em;
     font-weight: bold;
   }

h4 { color: #000000;
     font-size: 1.1em;
     margin-top: 0px;
     margin-bottom: 0px;
     font-family: Arial, verdana, sans-serif;
     font-weight: bold;
   }

h4.blue { color: #368cc9;
     font-size: 1.2em;
     margin-top: 6px;
     margin-bottom: 4px;
     font-family: Arial, verdana, sans-serif;
     font-weight: bold;
   }

.smlblue { color: #368cc9;
           font-size: 1em;
           margin: 0px;
           font-family: Arial, verdana, sans-serif;
         }
.bold { font-weight: bold; }

.white { color: #ffffff;
         font-size: 0.9em;
         margin: 0px;
         font-family: Arial, verdana, sans-serif;
       }

.classtime { font-weight: bold;
             font-family: Arial, verdana, sans-serif;
             width: 240px;
             height: 22px;
             margin-top: 4px;
             margin-bottom: 4px;
           }

.err { color: #ff0000; }

.ltblue { background: #c2e5f6; }

a:link { color: #0000ff; text-decoration: none; }
a:visited { color: #0000ff; }
a:hover { color: #ff0000; }

.pageplus { display: none; font-size: 1.2em; }

table#programs tr { line-height: 30px; border: 1px solid #ffffff; }
table#programs td.prog { background: #f4f4f4; text-align: center; border: 1px solid #ffffff; }
table#programs td img { width: 100% !important; max-width: 100px !important; }

table.carnivals td { font-size: 0.95em; }
table.carnivals tr:nth-child(even) { background: #eaeaea; color: #000000; }

#atable { width: 98%; background-color: transparent; }
#acol { width: 100%; padding-left: 1%; cursor: pointer; }
.hchd { color: #0000ff; height: 20px; }

#anewline { clear: both; height: 20px; }

div .address
{
    background-image: url('../images/green_pin.png');
    background-repeat: no-repeat;
    height: 36px;
    padding-left: 6px;
}

div .error
{
    height: 30px;
    color: #000000;
    padding-top: 5px;
}


#form-input label,
div .address #lblAddress,
div .error label
{
    font-weight: bold;
}

#map-container
{   /*position: relative;*/
	width: 100%;
    height: 100%;
	min-height: 480px;
    overflow: auto;
}

#loc-list
{
/*	position: absolute;
    top: 0px;
    left: 0px;  */
	width: 100%;
    height: 100%;
    background-color: transparent;
    cursor: pointer;
    display: none;
}


#loc-list ul
{
	display: block;
/*	clear: left;
	float: left; */
	list-style: none;
	margin: 0;
	padding: 0;
}

#loc-list .list-label
{
    float: left;
    padding-right: 4px;
    width: 17px;
    text-align: center;
    color: #ffffff;
    background: #fe7569;
    font-weight: bold;
    margin: 0px 4px 0 4px;
    border: 1px solid #000000;
}

#map-container .loc-name
{
	font-weight: bold;
    padding-top: 10px;
	padding-left: 27px;
}

#search-form
{
	clear: left;
	float: left;
	height: 60px;
}

#form-input
{
	float: left;
	margin-top: 3px;
}

#address
{
	margin: 0 0 0 10px;
}

#submit-btn
{
	float: left;
}

#map
{	/*position: absolute;
    top: 0px;
    left: 0px;*/
	width: 98%;
    height: 100%;
	min-height: 400px;
    border: 1px solid #000000;
}

.infoWindow
{
    color: Black;
    width: 98%;
}

#navmap { position: relative;
          top: 0px;
          left: 0px;
          width: 180px;
          height: 22px;
          background-color: #45b7c1;
      }

div#navmap ul { float: left; width: 180px; list-style: none; margin: 0; padding: 0px; padding-bottom: 20px; }
#navmap li { float: left; background-color: #45b7c1; width: 180px; height: 22px; list-style: none; position: relative; }
#navmap li:hover { background-color: #0e76bd; }

#navmap a { height: 25px; text-align: center; font-family: arial, verdana, helvetica, sans-serif; font-weight: bold; font-size: 1em; display: block; margin: 0; padding: 5px 0px 0px 6px; }
#navmap a { color: #000000; background: transparent; text-decoration: none; border-top: 1px #000000 solid; border-right: 1px #000000 solid; }
#navmap a:hover { color: #ffffff; background: transparent; }


@media screen and (max-width: 990px) {
   #hdlogin { display: none; }
   
}

@media screen and (max-width: 990px) {
   #thepage { min-height: 0px; }
   #nav a { font-size: 0.75em;  }
   #contentpage { min-height: 0px; }

   #pagecontent { min-height: 0px; }
   #leftpane { position: relative; display: inline; float: none; width: 100%; min-height: 0px; clear: both; background: #dddddd; }
   #rightpane { position: relative; display: inline; float: none; width: 100%; min-height: 0px; top: 20px; clear: both; background: #00ff99; }
   .lefttext { padding-left:4px; padding-right: 2px; }

   #centrefind, #beachfind, #centremap { width: 66%; margin-left: auto; margin-right: auto; }

   .corners { margin-right: 10px; }
}

@media screen and (max-width: 770px) {
   #logo { top: 4px; }
   .contact { display: none; }

   #navdiv { display: none; height: auto; }

   #nav { position:relative; }
   #nav ul { list-style: none; top: 0px; left: 0px; width: 100%; }
   #nav li { position:relative; float: none; width: 100%; border-bottom: 1px #999999 solid; }
   #nav a { display:block; padding: 5px 0 5px 20px; text-align: left; font-size: 0.75em; }

   #nav ul ul { position: relative; top: 0px; left: 0px; width: 100%; }
   #nav ul ul li { float: none; width: 100%; background: #649ec6; border-bottom: 1px #999999 solid; }
   #nav ul ul li a { padding-left: 30px; }

   #nav ul ul ul { position: relative; top: 0px; left: 0px; width: 100%; }
   #nav ul ul ul li { float: none; width: 100%; background: #92afc4; border-bottom: 1px #999999 solid; }
   #nav ul ul ul li a { padding-left: 50px; }

   .pageplus { display: inline; font-size: 1.4em; }
   #leftpane { top: 2px; }

   #centrefind, #beachfind, #centremap { width: 88%; margin-left: auto; margin-right: auto; }

   .evitem img { display: none; }
   .evitem .evsocial img { display: inline; }

   #mobnav { position: relative;
             padding-left: 20px;
             cursor: pointer;
             display: block;
             width: 100%;
            height: 40px;
           background-color: #0e76bd;
          border-bottom: 4px #45b7c1 solid;
           }
   #mobnav i {
       color: #ffffff;
       font-size: 25px;
       padding-top: 7px;
           }

   #navdiv.shownavdiv { display: block; }

   #footer { display: none; }

   #subnavdiv {  height: auto; }

   #subnav { position:relative; }
   #subnav ul { list-style: none; top: 0px; left: 0px; width: 100%; }
   #subnav li { position:relative; float: none; border-bottom: 0px; }
   #subnav li.col10 { width: 100%; }
   #subnav li.col9 { width: 100%; }
   #subnav li.col8 { width: 100%; }
   #subnav li.col7 { width: 100%; }
   #subnav li.col6 { width: 100%; }
   #subnav li.col5 { width: 100%; }
   #subnav li.col4 { width: 100%; }
   #subnav li.col3 { width: 100%; }
   #subnav li.col2 { width: 100%; }
   #subnav li.col1 { width: 100%; }
   #subnav a { display:block; padding-left: 10px; text-align: left; font-size: 0.95em; height:22px; }

   #subnav ul ul { position: relative; top: 0px; left: 0px; width: 100%; }
   #subnav ul ul li { float: none; background: #8cd4f9; border-bottom: 0px; }
   #subnav ul ul li.col10 { width: 100%; }
   #subnav ul ul li.col9 { width: 100%; }
   #subnav ul ul li.col8 { width: 100%; }
   #subnav ul ul li.col7 { width: 100%; }
   #subnav ul ul li.col6 { width: 100%; }
   #subnav ul ul li.col5 { width: 100%; }
   #subnav ul ul li.col4 { width: 100%; }
   #subnav ul ul li.col3 { width: 100%; }
   #subnav ul ul li.col2 { width: 100%; }
   #subnav ul ul li.col1 { width: 100%; }
   #subnav ul ul li a { padding-left: 30px; }

   #subnav ul ul ul { position: relative; top: 0px; left: 0px; width: 100%; }
   #subnav ul ul ul li { float: none; background: #77b4d4; border-bottom: 0px; }
   #subnav ul ul ul li.col10 { width: 100%; }
   #subnav ul ul ul li.col9 { width: 100%; }
   #subnav ul ul ul li.col8 { width: 100%; }
   #subnav ul ul ul li.col7 { width: 100%; }
   #subnav ul ul ul li.col6 { width: 100%; }
   #subnav ul ul ul li.col5 { width: 100%; }
   #subnav ul ul ul li.col4 { width: 100%; }
   #subnav ul ul ul li.col3 { width: 100%; }
   #subnav ul ul ul li.col2 { width: 100%; }
   #subnav ul ul ul li.col1 { width: 100%; }
   #subnav ul ul ul li a { padding-left: 50px; }

   #subnav a { padding-top: 2px; }
}

@media screen and (max-width: 480px) {
   #mobnav {  }

   .subpageplus { display: inline; font-size: 1.4em; }

   
}

@media screen and (max-width: 320px) {
}