/*	|-----------------------------------------------|
	|          |    holder                          |
	|   menu   |                                    |
	|          |  |---------------------------------|
	|          |  |   innerTop                      |
	|          |  |  |------------------| |-------| |
	|          |  |  |  header          | | logo  | |
	|          |  |  |------------------| |-------| |
	|          |  |---------------------------------|
	|          |                                    |
	|          |  |-------------------------------| |
	|          |  |  innerMenu                    | |
	|          |  |  |--------------------------| | |
	|          |  |  |  groupMenu               | | |
	|          |  |  |  |--------------------|  | | |
	|          |  |  |  |  groupItem         |  | | |
	|          |  |  |  |--------------------|  | | |
	|          |  |  |--------------------------| | |
	|          |  |-------------------------------| |
	|          |                                    |
	|          |  |-------------------------------| |
	|          |  |  innerContent                 | |
	|          |  |  |-------------------------|  | |
	|          |  |  |  subContent             |  | |
	|          |  |  |-------------------------|  | |
	|          |  |                               | |
	|          |  |  |-------------------------|  | |
	|          |  |  |  content                |  | |
	|          |  |  |-------------------------|  | |
	|          |  |-------------------------------| |
	|          |                                    |
	|-----------------------------------------------|
	|           footer                              |
	|-----------------------------------------------|
*/
/* The main menu (LHS) */
#menu {
    float: left;
    width: 15%;
    padding: 10px;
    margin-top: 15px;
    background-color: #FFF;
/*    font-size: 11pt; 
    color: #606060; 
    font-family: "MS Georgia", "Times New Roman", Times, serif;*/
}
/* Content (RHS) */
#holder {
    float:right;
    width: 80%;
    padding: 5px 5px 5px 10px; /* top, right, bottom, left */
    background-color: #FFFFFF;
}
/* Holds header and logo */
#innerTop { 
    height: 100px;
    overflow: hidden;
}
/* The image at the top of the page */
#header {
    float: left;
    width:500px;
    height: 100px;
/*    background: #FFFFFF url(images/Animation2.gif) no-repeat center;*/
    background-color: #FFF;
}
#logo {
    float: right;
    width: 100px;
    height: 100px;
    background-color: #FFFFFF;
    background: url(images/logoHeader.jpg) no-repeat center;
}

/* Holds Group Menu and related Sub-menus */
/* TOTAL of innerMenu and innerContent = 380px */
/* There are 2 innerMenu and innerContent ids to keep the total height 380px
 * whether the groupItem has a sub-menu or not.
 * innerMenuMin and innerContentMax = no submenu
 * innerMenuMax and innerContentMin = submenus
 */
#innerMenuMin {
    clear: both;
    height: 100px;
    overflow: hidden;
/*    background-color: #00000; */
}
#innerMenuMax {
    clear: both;
    height: 200px;
    overflow: hidden;
/*    background-color: #00000; */
}

/* Group Menu - To be overridden by each group */
#groupMenu {
    clear: both;
    padding:5px;
    background-color: #505050;
    height: 90px;
}

/* Menu Item - To be overridden by each group */
#groupItem {
    float: left;
    width: 20%;
    text-align: center;
}

/* Group Sub-Menu (i.e. Profiles) */
#groupSubMenu {
    clear: both;
    margin-top:1px;
    padding:2px;
    background-color: #AAC;
    height: 25px;     /* SubItem height + padding */
}
#groupSubItem {
    float: left;
    height: 20px;       /* one line of text = 20px */
    padding-top: 5px;  /* Provide a gap at the top of text */
    font-size: 11pt;
    color: #606060; 
    font-family: "MS Georgia", "Times New Roman", Times, serif;
/*    background-color: #00FF00; */
}
#subMenuSeperator {
    float:left;
    margin: 5px 10px;
    width: 15px;
    height: 15px;
    background: #000000 url(images/subMenuSeperator.jpg) no-repeat;
}

/* Holds Group Menu and related Sub-menus */
/* TOTAL of innerMenu and innerContent = 560px old: 480px, 380px */
/* There are 2 innerMenu and innerContent ids to keep the total height 560px
 * whether the groupItem has a sub-menu or not.
 * innerMenuMin and innerContentMax = no submenu
 * innerMenuMax and innerContentMin = submenus
 * If there is no group menu hence no innerMenu then use innerContent only
 */
#innerContent {
    clear: both;
    margin-top:1px;
    height: 560px; /*480px; 380px;*/
    overflow: auto;
    background-color: #D3D3D0;
    border: 2px solid #AAC;  /*5px ridge #b0b0b0;*/
}
#innerContentMin {
    clear: both;
    margin-top:1px;
    height: 360px; /* 80px; */
    overflow: auto;
    background-color: #D3D3D0;
    border: 2px solid #AAC;  /*5px ridge #b0b0b0;*/
}
#innerContentMax{
    clear: both;
    margin-top:1px;
    height: 460px; /*380px;  320px 280px;*/
    overflow: auto;
    background-color: #D3D3D0;
    border:2px solid #AAC;  /*5px ridge #b0b0b0;*/
}

/* Inner div containing content highlights */
#subContent {
    float: right;
    padding: 5px;
    margin: 10px;
    color: #121212;
    background-color: #D3D3D0; /*#A3A3A0;*/
}
/* Quote for subContent */
#startQuote {
    float:left;
    margin: 0px;
    padding: 0px;
    width: 50px;
    height: 40px;
    background: url(images/quotesStart.gif) no-repeat top;
}
#endQuote {
    float:left;
    margin: 0px;
    padding: 0px;
    width: 50px;
    height: 40px;
    background: url(images/quotesEnd.gif) no-repeat bottom;
}
#paraQuote {
    float:left;
    margin: 5px;
    padding: 0px;
    width: 380px;
    color: #036; /*#404040;*/
    background-color: #D3D3D0; /*#A3A3A0;*/
    font-family: "Comic-sans" "MS Arial" serif;
    font-size: 14pt;
    font-weight: bold;
    font-style: italic;
}

/* The content */
#content {
/*    margin-top: 1px; */
    padding:5px; 
    background-color: #D3D3D0;
}

/* Static footer */
#footer {
    clear:both;
    width: 850px;
    height: 50px;
    padding: 0px;
    background: #FFF url(images/footer.jpg) no-repeat center;
}

/** G E N E R I C   D I V S   **/

/* To clear all divs above and start new section */
#clear {  clear:both; }
/* to position in the middle (usually a holder div) */
#middle { text-align: center;}
#left  { float: left; }
#right { float: right; }
/* Overwrite the margin and width as needed */
#leftCol   { clear:both; float: left; margin-right: 5px; width:90px;}
#middleCol { float: left; width:90px;}
#rightCol  { float: left; width:90px;}

/* END */