/* CSS Document */

/* Global Values
-----------------------------------*/

body { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 62.5%; line-height: 1.8em; color: #7C7C7C; } 
.clear { clear: both; }

a { color: #7C7C7C; text-decoration: underline; }

/* Containers
-----------------------------------*/

#wrapper { width: 765px; border: 1px solid #D0D0D0; margin-top: 20px; margin-left: auto; margin-right: auto; }
#navMatrix { width: 440px; height: 30px; margin-left: 25px; }
#flashcontent { border-top: 1px solid #D0D0D0; }
#mainContent { border-top: 1px solid #D0D0D0; }
#contentPadding { width: 725px; margin-left: auto; margin-right: auto; padding-top: 20px; padding-bottom: 15px; }
#columns { margin-top: -5px;  }
#callOut { border-top: 1px solid #D0D0D0; height: 81px; clear: both; background-image:url(images/callMember.jpg); background-repeat: no-repeat; background-position: bottom; }
#footer { width: 740px; padding: 10px; margin-left: auto; margin-right: auto; color: #D0D0D0; }

/* Typography
-----------------------------------*/

h1 { font-size: 1.4em; font-weight: normal; line-height: 1.4em; margin-top: 5px; }
h2 { font-size: 1.4em; line-height: 1.4em; margin-top: 5px; }

p { font-size: 1.2em; }
ul { font-size: 1.2em; line-height: 1.5em; }


/* Additional Styling
-----------------------------------*/

#columns ul { margin-left: -20px !important; margin-left: 20px; }
#columns li { margin-bottom: 5px; }
.leftColumn { width: 350px; float: left; margin-right: 25px; }
.rightColumn { width: 350px; float: left; }

.photoFloat { float: right; border: 1px solid #D0D0D0; margin-left: 20px; }
.options { float: right; margin: 0; }


/* Navigation
-----------------------------------*/


#mainNav { display: block; padding: 0; margin: 0 auto; }
#mainNav li { list-style-type:none; padding: 0; margin: 0; float:left; text-indent:-9999px; }
#mainNav li a { display: block; height: 30px; background-image: url(images/nav-matrix.gif); background-repeat: no-repeat; }

/* Link */
#mainNav li#navHome a:link, #mainNav li#navHome a:visited { background-position:0px 0px; width: 64px; }
#mainNav li#navWhat a:link, #mainNav li#navWhat a:visited { background-position:-64px 0px; width: 96px; }
#mainNav li#navHow a:link, #mainNav li#navHow a:visited { background-position:-160px 0px; width: 120px; }
#mainNav li#navExplore a:link, #mainNav li#navExplore a:visited { background-position:-280px 0px; width: 160px; }
	
/* Hover */
#mainNav li#navHome a:hover { background-position:0px -30px; width: 64px; }
#mainNav li#navWhat a:hover { background-position:-64px -30px; width: 96px; }
#mainNav li#navHow a:hover { background-position:-160px -30px; width: 120px; }
#mainNav li#navExplore a:hover { background-position:-280px -30px; width: 160px; }
	
/* Active Tab */
body#home #mainNav li#navHome a { background-position:0px -30px; width: 64px; }
body#what #mainNav li#navWhat a { background-position:-64px -30px; width: 96px; }
body#how #mainNav li#navHow a { background-position:-160px -30px; width: 120px; }
body#explore #mainNav li#navExplore a { background-position:-280px -30px; width: 160px; }