/* *********************************************************************************
                                     Global CSS
                       Liberty Gymnastics Parent Club website

                       Designed by Our Home Sweet Homeschool
                         Joshua van Gogh & Alethea van Gogh

                                     March 2010

NOTES, as of 3-26-10:
---------------------

1.  Controls style for
    A.  Banner
    B.  Main Navigation Menu (Open Access)
    C.  Members Navigation Menu (Password-Protected Access Only)
    D.  Site Footer
2.  Site Layouts
    A.  3-Column Double-Hybrid (Main Home Page)
    B.  3-Column (Members-Only Home Page)
    C.  4-Column with Pix Strip (Team Bulletin Home Page Templates)
    D.  3-Column with Pix Strip (Team Level Page Template)
    E.  2-Column (Team Roster Page, list others)

NOTES:
------
3.  Modified by Alethea van Gogh, 3-28-10.
4.  Modified by Alethea van Gogh, 6-17-10.
    A.  


********************************************************************************* */

/* GENERAL SITE STYLES */


* { padding: 0; margin: 0; }

body {
      font-family: Arial, Helvetica, sans-serif;
      font-size: 1em;
      background-color: #DDFBDD;
      }

/* Centers all the pages; Semi-liquid width */
#wrapper_page {
               width: 990px;
               margin-top: 10px;
               margin-bottom: 10px;
               margin-left: auto;
               margin-right: auto;
               }

h2 {
    text-align: center;
    }

.highlights {
             margin-top: 15px;
             margin-bottom: 15px;
             }
.highlights h3 {
                padding-top: 0.5em;
                }
.highlights ul {
                margin-top: 5px;
                margin-bottom: 5px;
                }              
.highlights li {
                margin-left: 15px;
                }

/* Banner for all the pages */
#banner {
         width: 990px;
         margin-top: 10px;
         /*margin-bottom: 5px;*/
         padding-top: 15px;
         height: 90px;
         background: #006FA3;
         color: #FFFFFF;
         text-align: center;
         font-size: 2em;
         }
/* Members-access sub-banner */
#banner_members {
         width: 990px;
         margin-top: -5px;
         padding-top: 7.5px;
         height: 1.5em;
         background: #FFFF33;
         border-top: 3px solid #A60000;
         border-bottom: 3px solid #A60000;
         color: #A60000;
         text-align: center;
         font-size: 1em;
         }



/* Wraps Columns Containing Content, excludes banner & footer */
# wrapper_contents {
                    width: 990px;
                    margin-top: 5px;
                    margin-bottom: 5px; 
                    border: solid black;
                    overflow: auto;
                              /* Paul O Brien Fix for IE www.pmob.co.uk */
                    background: #FFFFFF url(/images/bg_column_border.gif) repeat-y
                                left top;
                    }

/* SLIM-RIGHT COLUMN.  Wraps Columns Containing Content, excludes banner & footer */
# wrapper_contents_with_slim_right {
                    width: 990px;
                    margin-top: 5px;
                    margin-bottom: 5px; 
                    /* border: solid black; */
                    overflow: auto;
                              /* Paul O Brien Fix for IE www.pmob.co.uk */
                    background: #DDFBDD url(/images/bg_slim_right_col.gif) repeat-y
                                left top;
                    }

/* Vertical Navigation Bar style */
.menu_main{
           min-height: 947px;
           /* Quick-fix to make nav & right columns full-length, including members-
              only home page. Remove when bg gif is created and added. */
           }


ul.menu_main {
              float: left;
              list-style-type: none; /* Removes the bullets */
              width: 190px;
              padding-top: 15px;
              padding-bottom: 15px;
              padding-left: 5px;
              background: #99ff33;
              border-left: 5px solid #008500;
              border-right: 5px solid #008500;
              }

ul.menu_main li {
                 position: relative;
                 height: 2em;
                 line-height: 2em;
                 }

ul.menu_main a {
                display: block;
                height: 2em;
                line-height: 2em;
                text-decoration: none;
                background: #99ff33;
                border-bottom: 0;
                }


li.sub_menu ul {
                    position: absolute;
                    /* left: 185px; THIS IS THE PERFECT POSITION TO RIGHT OF MENU */
                    left: -999em;
                    width: 150px;
                    margin-left: 10px;
                    background: #99ff33;
                    top: 0;
                    /* display: none; */
                    list-style-type: none;
                    }

li.sub_menu:hover ul {
                      position: absolute;
                      left: 180px;
                      }

li.sub_menu:hover, li.sub_menu:hover ul {
                                         background: #DDFBDD;
                                         }




/* *********************************************************************************
   3-COLUMN DOUBLE-HYBRID LAYOUT STYLING: Center & Right Content Sections
********************************************************************************* */
#three_cdh_center {
                   float: left;
                   display: inline;
                   position: relative;
                   width: 370px;
                   padding: 10px;
                   color: #004700;
                   }

#three_cdh_center p {
                     padding-top: .25em;
                     padding-bottom: .25em;
                     }

.quotes {
         text-align: center;
         padding-bottom: 1em;
         }

#three_cdh_right {
                  float: right;
                  display: inline;
                  position: relative;
                  width: 385px;
                  background: #FFAE00;
                  color: #000099;
                  border-left: 5px solid #008500;
                  border-right: 5px solid #008500;
                  min-height: 977px;
                  /* Quick-fix to make nav & right columns full-length, including 
                     members-only home page. Remove when bg gif is created and added. 
                  */
                  }


/* This container item does not work properly.  The box does not surround the 2
   columns, BUT the margin and text-align properties work fine. */
#right_top {
            margin: 0;
            padding: 0;
            width: 385px;
            text-align: center;
            background: #FFFFFF;
           /* border-top: 1px solid #008500;
            border-bottom: 1px solid #008500;*/
            }

#right_top h4 {
               margin-bottom: .25em;
               }

#right_top p {
               margin-top: .25em;
               margin-bottom: .25em;
               }




#right_top_left {
                 float: left;
                 margin-bottom: 10px;
                 padding-left: 10px;
                 padding-right: 10px;
                 padding-top: 10px;
                 width: 170px;
            /*border-top: 1px solid #008500;*/

                 }

#right_top_right {
                 float: left;
                 display: inline;
                 position: relative;
                 margin-bottom: 10px;
                 padding-left: 10px;
                 padding-right: 10px;
                 padding-top: 10px;
                 width: 169px;
                 border-left: 1px solid #008500;
                 /* Add a 1px background image to continue the border if this
                    column is shorter than the top_left */
            /*border-top: 1px solid #008500;*/
                 }  

#right_top_right img {
                      border: none;
                      margin-top: 1em;
                      margin-bottom: 1em;
                      }


#three_cdh_right_bottom {
                         margin: 0;
                         width: 365px;
                         padding: 10px;
                         }

#sponsor_listing p {
                     padding-top: .5em;
                     padding-bottom: .5em;
                     text-align: center;
                     }

/* *********************************************************************************
   3-COLUMN LAYOUT STYLING: Center & Right Content Sections
********************************************************************************* */
/* The center column layout is the same as that of the 3-column double-hybrid 
   layout - three_cdh_center */

#three_col_right {
                  float: right;
                  display: inline;
                  position: relative;
                  width: 365px;
                  padding: 10px;
                  background: #FFAE00;
                  color: #000099;
                  border-left: 5px solid #008500;
                  border-right: 5px solid #008500;
                  min-height: 957px;
                  /* Quick-fix to make nav & right columns full-length, including 
                     members-only home page. Remove when bg gif is created and added. 
                  */
                  }   


/* *********************************************************************************
   3-COLUMN LAYOUT STYLING: Center & SLIM Right Content Sections
********************************************************************************* */
/* The center column is wide and the right column is slim */

#three_col_rightslim_center {
                   float: left;
                   display: inline;
                   position: relative;
                   width: 530px;
                   padding: 10px;
                   color: #004700;
                   }

#three_cdh_center p {
                     padding-top: .25em;
                     padding-bottom: .25em;
                     }

#three_col_rightslim_right {
                  float: right;
                  display: inline;
                  position: relative;
                  width: 170px;
                  padding: 10px;
                  background: #FFAE00;
                  color: #000099;
                  border-left: 5px solid #008500;
                  border-right: 5px solid #008500;
                  min-height: 957px;
                  /* Quick-fix to make nav & right columns full-length, including 
                     members-only home page. Remove when bg gif is created and added. 
                  */
                  }  

#three_col_rightslim_right h4 {
                               padding-top: 15px; 
                               padding-bottom: 0px;
                               }


#three_col_rightslim_right ul {
                               padding-left: 15px;
                               }

#three_col_rightslim_right a {
                              text-decoration: none;
                              border: 0;
                              }



/* Footer for all the pages */
#footer {
         clear: both; 
                /* This prevents the footer from moving up and around the floating
                   content columns and forces it to stay at the bottom of the page.
                   */
         width: 990px;
         margin-top: 5px;
         margin-bottom: 10px;
         padding-top: 5px;
         padding-bottom: 5px;
         background: #006FA3;
         color: #FFFFFF;
         text-align: center;
         font-size: .75em;
         }
#footer a {
           color: #FFFFFF;
           }