/* 
    Document   : z_mainPage
    Created on : Oct 1, 2013
    Author     : robert.rosales
    Description:
        Purpose of the stylesheet is to edfine the main page layout.
*/

root { 
    display: block;
}

body { /* Page Body */
    display: block;
    text-decoration: none;	
    background-color: #ffffff;
    text-align      : center;
}
#page { 
    /* Page Holder */
    background-color: #FFFFFF; /* WHITE */
    background-image: url('images/Logo.jpg');
    background-repeat: no-repeat;
    background-size: 252px 144px;
    background-position: 60px -8px; 
    position        : relative;
    /*width           : 745.50pt;*/
    height          : 576.00pt;
    text-align      : left;
    margin-left     : auto;
    margin-right    : auto;
    border: solid 1px black;
}


header {
    position        : relative;
    background-color: #B2D52A; /* TennisBallGreen-Med */
    background-image: url('images/natureScene.jpg');
    background-repeat: no-repeat;
    background-size: 658.50pt 176.25pt;
    background-position: center 25px; 
    left            : 0;
    top             : 80px;
    width           : 100%;
    height          : 220pt;
    border: solid 0px black;    
}
       
/* NAVIGATION LINKS - TOP MENU FORMAT*/

nav {
    display: block;
    position: absolute;
    left: 368pt;
    top:  -28px;
    width: 450px;
    height: 30px;
    font-weight: bold;
    margin: 0 0 0 0px;
    /* margin: Top Right Bottom Left  */
    padding: 0;  
    border: solid 0px black;
    
}

nav ul {
    display: block;
    list-style-type: none;
    margin: 0 auto;
    padding: 0;
}

nav ul li {
    display: block;
    margin: 0;
    padding: 0;
    
}
nav ul li a {
    display: block;
    float: left;
    color: #ffffff;
    text-decoration: none;
    text-align: center;
    font-size: 100%;
    padding: 6px 0;
    max-height: 30px;
    width: 110px;
    margin: 0 2px 0 0;
    /* margin: Top Right Bottom Left  */
    background-color: #C6ED2C; /* TennisBallGreen */
    border-bottom: #C6ED2C; /* TennisBallGreen */
    border-top: #C6ED2C; /* TennisBallGreen */
    border-top-left-radius: .5em .5em; 
    border-top-right-radius: .5em .5em;
}
nav ul li a:hover { 
    display: block;
    text-decoration: none;
    background-color: #B2D52A; /* TennisBallGreen-Med */
    border-bottom: #B2D52A; /* TennisBallGreen-Med */
    border-top: #B2D52A; /* TennisBallGreen-Med */
    background-image: url('images/pawprint.gif');
    background-repeat: no-repeat;
    background-size: 20px 20px;
    background-position: right top; 
}

/* NAV SELECT/FOCUS CLASSES */

nav ul li.selected a{
    display: block;
    text-decoration: none;
    color: #333; /* BLACK */
    background-color: #B2D52A; /* TennisBallGreen-Med */
    border-top: #B2D52A; /* TennisBallGreen-Med */
    background-image: url('images/pawprint.gif');
    background-repeat: no-repeat;
    background-size: 20px 20px;
    background-position: left top; 
}        
        

        
#MainContent {
    background-color: #FFFFFF; /* WHITE */
    position: relative;
    top: 0px;
    left: 60px;
    width: 658.50pt;
    /*height: 320px;*/
	height: 457px;
    border: solid 0px black;
	/*display: table;*/
    /* margin: Top Right Bottom Left  */   
}
.content section{ /*height: 100% !important;*/ display: table !important;}

section {
    background-color: #E0E0E0; /* LIGHT GREY */
    position: relative;
    top: 80px;
    left: 0pt;
    width: 100%;
  /*  height: 380px;*/
	height: 493px;
    border: solid 0px black;
    /* margin: Top Right Bottom Left  */
}   

/* ARTICLE BUTTONS - TOP MENU FORMAT*/

section article nav {
    display: block;
    position: absolute;
    left: 0pt;
    top:  -28px;
    width: 120px;
    height: 30px;
    font-weight: bold;
    margin: 0 0 0 0;
    /* margin: Top Right Bottom Left  */
    padding: 0;  
    border: solid 0px black;
}

section article nav ul {
    display: block;
    list-style-type: none;
    margin: 0 auto;
    padding: 0;
    border: solid 0px black;
}

section article nav ul li {
    display: block;
    float: left;
    color: #000000;
    text-decoration: none;
    text-align: center;
    font-size: 100%;
    max-height: 25px;
    width: 100px;
    margin: 0;
    padding: 6px;
    background-color: #FFFFFF; /* WHITE */
    border-top-left-radius: .5em .5em; 
    border-top-right-radius: .5em .5em;
    border: solid 0px black;
}
    
        
/* ARTICLE */

section article {
    position: relative;
    float: left;
    width: 40%;
    height: 100%;
    left: -3px;
    padding-bottom: 0px;
    margin: 0px 0px 0px 0px;
    /* margin: Top Right Bottom Left  */
    background-color: #FFF; /* WHITE */
    border-left: solid 3px #E0E0E0; /* LIGHT GREY */
}

section article section a {
    float: none;
    background-color: darkgray;    
}


section article h1 {
    font-size: 100%;
    color: black;
    margin: 6pt 6pt;
    border-bottom: 4px solid #a60;
}

section article h3 {
    font-size: 80%;
    color: black;
    margin: 12px 12px 0px 20px;
    padding-top: 0px;
    padding-bottom: 5px;
    border-bottom: 4px solid #ccc;
    /* margin: Top Right Bottom Left  */

}
section article h4 {
    font-size: 70%;
    color: black;
    margin: 6pt 6pt;
    border-bottom: 4px solid #a60;
}

section article p {
    line-height: 1.6;
    margin: 6px 3px 0px 20px;
    font-size: 12px;
}

section article ul {
    padding: 0;
    /* list-style-type: none; */
}

section article ul li {
    padding: 0;
    font-size: 12px;
    margin-top: 4pt;
    margin-bottom: 5px;
    list-style-type: none;
    margin-left: 6px;
}

section article ul li a {
    display: block;
    text-decoration: none;
    color: blue;
}

section article ol {
    padding: 0;
    /* list-style-type: none; */
}

section article ol li {
    padding: 0;
    font-size: 12px;
    margin-top: 4pt;
    margin-bottom: 4pt;
    /* margin-left: 0px; */
}

section article mark {
    background-color: #fd0;
}        

/* SECTION FOOTER */

section footer {
    display: block;
    position: absolute;
    bottom: 0px;
    width: 100%;
    height: 30px;
    background: #B2D52A; /* TennisBallGreen-Med */
    margin-bottom: -33px;
}

section footer p {
    color: #FFF; /* WHITE */
    font-size: 10pt;
    font-weight: bold;
    text-align: right;
    margin: 0;
    padding: 5px;
} 

section footer p a {
    color: #FFF; /* WHITE */
    text-decoration: none;
    font-size: 10pt;
    font-weight: bold;
    text-align: right;
    margin: 0;
    padding: 5px;
}  

section footer ul {
    display: block;
    list-style-type: none;
       
    
}

section footer ul li {
    float: left;
    color: #FFF; /* WHITE */
    text-decoration: none;
    font-size: 10pt;
    font-weight: bold;
    text-align: center;
    margin: -10px 100px 10px 100px;
    padding: 0px;
}

section footer ul li a {
    color: #FFF; /* WHITE */
    text-decoration: none;
}

/* ASIDE CONTENT */

section aside {
    display: table-cell;
    float: right;
    width: 500px;
    height: 300px;
    background-color: #FFF; 
    background-size:100% 100%;
    background-repeat:no-repeat;
    margin: 6pt 6pt 3pt 6pt;
    /* margin: Top Right Bottom Left  */
}

/* TABLE */

section aside table
{
    display: table-cell;
    float: right;
    width: 500px;
    height: 300px;
    margin: 3pt 6pt 6pt 6pt;
    padding: 0pt 0pt 0pt 40pt;
    /* margin: Top Right Bottom Left  */
    border-collapse: collapse;
}

caption 
{ 
    caption-side: top; 
    color: black;
    width: auto;
    text-align: center;
    padding: 5px;
}

table,th,td
{
    border: 0px solid black;
}

th
{
    font-size: 12px;
    font-weight: bold;
    color: white;
    text-align: center;
    vertical-align: middle;
     /* height: 25px; */
    padding: 5px;
    background-color: gray;
}

tr
{
    background-color: white;
}

td
{
    font-size: 10px;
    text-align: left;
    vertical-align: bottom;
    font-weight: bold;
     /* height: 25px; */
    padding: 5px;
}

/* FOOTER */

footer {
    background: gray; /* TennisBallGreen-Med */
    position: absolute;
    bottom: 0;
    width: 100%;
    text-align: center;
    height: 15px;
}

footer p {
    color: #333; /* DARK GREY */
    font-size: 10pt;
    font-weight: bold;
    text-align: center;
    margin: 0;
    padding: 0;
}        

/* FACEBOOK WIDGET FOLLOW BUTTON */
#fb-root-follow  {
    display: block;
    position: absolute;
    bottom: 0px;
    width: 400px;
    height: 25px;
    background: #B2D52A; /* TennisBallGreen-Med */
    margin-bottom: 2px;
    margin-left: 430px;
    border: solid 0px black;
}

/* FACEBOOK WIDGET LIKE BUTTON */
#fb-root-like  {
    display: block;
    position: absolute;
    bottom: 0px;
    width: 400px;
    height: 25px;
    background: #B2D52A; /* TennisBallGreen-Med */
    margin-bottom: 2px;
    margin-left: 480px;
    border: solid 0px black;
}

        /* CLEANUP */

.clear {
    margin: 0;
    padding: 0;
    clear: both;
}
.brand{display:none;}