/*============================================================================
[Screen Stylesheet]
==============================================================================
Project: Veteran Assistance Association
Version: 1.0
Last Modified: 03/18/2009
Created by:   Meili Chen at Inner Circle Media 
Primary use:   Page Layouts -one & two colum layouts 
==============================================================================*/

/*=============================================================================
[Table of Contents]
===============================================================================

A. Global Reset

B. Global Formatting

C. Layout
    1. Body 
        1.1. Skip to content / a#skip
    2. Layout wrapper / div#wrapper
        2.1. Header / div#header
               2.1.1  banner div#banner 
	       2.1.2 logo / h1		
               2.1.3 contact info div#contact
	2.2. Content section / div#content   			
	       2.2.1 Primary column / div#primeCol 
			 2.2.1.1 Main content div#mainContent
				     2.2.1.1.1 state boxes
	2.3 Footer / div#footer  
		2.3.1 copyright /div.copyright
		2.3.2 foo nav / div#footNav
	
===============================================================================*/

/*==============================================================================
[Color codes]
================================================================================
#ffffff  	white: (main content background, contact info text)
#000000	black (body text)
#bdbbb9	grey (state box border)
#cad7e8	light blue (sidebar background)
#707053	dark green (state box border hover color)
#60574b	green (state name color)
#7e0815	dark green (state name hover color)
#003a7a	blue (sidebar title text and dotted border& footer text)
#c8c5c1	light grey (h line color)
==================================================================================*/

/*=================================================================================
A. GLOBAL RESET
===================================================================================*/

body {font: 62.5%/1.4 Arial,verdana,Helvetica,Jamrul,sans-serif;  background: #fff; color: #000; margin: 0; padding: 0;}
p, h1, h2, h3, h4, h5, h6, fieldset, form, label, input, textarea, legend, dl, dt, dd, table, caption, th, td, blockquote, cite {
 margin: 0; padding: 0; font-size: 1em;}
ul, ol, li, ul *, ol *  {font-size: 1em;}

input, textarea {font-family: Arial,Verdana,Helvetica,Jamrul,sans-serif;}
textarea {overflow: auto;}
table {border-collapse: collapse;	margin-bottom: 1em;}
td, th {padding: 0.1em 1em;}

img {border: 0;}
acronym, abbr {border-bottom: 1px dotted; cursor: help;}
cite {font-style: normal;}
:focus {outline: 0;}

/*====================================================================================
B. GLOBAL FORMATTING  
=====================================================================================*/
.clear {clear: both; height: .001em; font-size: .001em;}
.left {float: left; display: inline;}
.right {float: right; display: inline;}
.right img {margin: 0 0 10px 10px;}
.left img {margin: 0 10px 10px 0px;}
.center {text-align: center;}
.block {display: block;}
.bld {font-weight: bold;}
.biggerTxt {font-size: 1.1em;}
.smallerTxt {font-size: .90em;}
.recTxt {color: #c8182a;}

a {color: #336699; text-decoration: none; font-weight: bold;}
a:hover {color: #bf1e2e;}

h1 {font-size: 1.4em;line-height: 120%;}
h2 {font-size: 1.3em;line-height: 120%;}
h3 {font-size: 1.2em;line-height: 120%;}
h4 {font-size: 1.1em;line-height: 120%;}
h5 {font-size: 1em;}
h6 {font-size: .9em;}
h1, h2, h3, h4, h5, h6 {margin-bottom: 1em;}

hr {border: none; margin: 15px 0; background: #c8c5c1; padding: 0; height: 1px;}


/*======================================================================================
C. LAYOUT 																		             *
=======================================================================================*/

/*--------------------------------------------------------------------------------------------
 1. Body / body                                                                                                                                                             
----------------------------------------------------------------------------------------------*/
body {background: #857b6f url(../images/body_bg.jpg) repeat-x 0 0; }

	/* 1.1. Skip to content / a#skip */
   #skip {position: absolute; top: -1000px;} 
	 
/*------------------------------------------------------------------------------------------
2. Layout Wrapper                                                                                                                                                     
---------------------------------------------------------------------------------------------*/
#wrapper {color: #231f20; font-size: 1.3em; margin: 10px auto; padding: 20px; width: 915px; background: #fff; overflow: hidden;}
#wrapper p {margin-bottom: 1em;}
   /*.........................................................................
	 2.1. Header / div#header 
	...........................................................................*/
   #header {width: 100%; margin: 0 0 25px 0; height: auto; clear: both; }
     
		/* 2.1.1  banner div#banner */
		#banner {width: 100%; height: 311px;display: block; margin-bottom: 8px; background: #fff url(../images/banner.jpg) no-repeat 0 0; padding: 0;}
		h2.tagline {width: 100%; margin: 0; padding: 0; height: 260px; display: block;cursor: default; text-indent: -9000px;}
					
		/* 2.1.2 logo / h1 */
      #header h1 {height: 50px; width: 245px; margin: 0; padding: 0; background: #fff url(../images/vaa_logo.jpg) no-repeat 0px 0;  text-indent: -9000px; float: left; }
      #header h1 a {display: block; height: 50px; width: 245px; background: #fff url(../images/vaa_logo.jpg) no-repeat 0 0;}
     
		/* 2.1.3 contact info div#contact */
		#contactInfo {background: #003a7a; padding: 8px 15px; text-align: right; font-size: .95em; font-weight: bold; color: #fff; border-bottom: 4px solid #bf1e2e;}

	/*............................................................................
	   2.2. content section / div#content 
	 ................................................................................. */
   #content {background: #fff;  width: 100%; margin: 0 0 25px 0; padding: 0; clear: both; overflow: hidden;}
   
		/* 2.2.1 Primary column / div#primeCol */
		#primeCol {background: #fff; float: right; width: 636px; margin: 0px; padding: 0;  overflow: hidden; }
		html >body #primeCol {width: 628px;}
		.oneCol #primeCol {width: 100%;}
      .twoCol #primeCol{width: 636px; float: right;}
      html>body.twoCol #primeCol {width: 628px;}
	
			/* 2.2.1.1 Main content div#mainContent*/
         #mainContent {padding: 0; background: #fff; }
			.oneCol #mainContent {}
         .twoCol #mainContent {}
			
				/*2.2.1.1.1 state boxes */
				.state {border: 1px solid #bdbbb9; padding: 4px; width: 190px; float: left; margin: 0 0 9px 9px;}
				.state:hover a, .state:hover{border-color: #707053; color: #7e0815;}
				.stateName {color: #60574b; font-size: 1.2em; padding: 5px; font-weight: bold; text-align: center;}
				.state img {margin: auto; display: block; text-align: center; filter:alpha(opacity=60); opacity: .6; -moz-opacity:.6; }
				.state:hover a img  {filter:alpha(opacity=100); opacity: 1; -moz-opacity:1; background: #dfda9d;}
        		.stateName a {color: #60574b; display: block;}
				.stateName a:hover {color: #7e0815;}
				
		/* 2.2.2 Second (Left) column / div#secondCol */
   	#secondCol {float: left; background: #cad7e8 url(../images/sidebar_bg.jpg) repeat-x 0 0; display: block; width: 232px; padding: 5px 15px; margin-right: 17px;  overflow: hidden;}
		html>body #secondCol {margin-right: 20px;}
		.oneCol #secondCol {display: none;}
      .twoCol #secondCol {margin-right: 17px;}
      html>body .twoCol #secondCol {margin-right: 20px;}
		
		#secondCol .content {padding: 5px 10px; color: #1a3045; line-height: 120%;}	
		#secondCol h4 {color: #003a7a; padding: 0 10px 5px 10px; margin: 0 0 5px 0; line-height: 100%; border-bottom: 1px dotted #003a7a;}
			
	/*..................................................................................
	  2.3 Footer / div#footer  
	  .................................................................................*/
   #footer {color: #003a7a; overflow: hidden; margin: 5px 0; padding: 20px 10px 5px 10px; background: #fff; border-top: 3px solid #b2c4d7;}
		
		/* 2.3.1 copyright */
		#footer .copyright {float: left; width: 290px; text-align: left;}
		
		/* 2.3.2 foo nav / div#footNav */
		#footNav {overflow: hidden; width: 530px; float: left;}
      #footNav ul {float:left; margin: 0; padding:0;border-left: 1px solid #003a7a;}
      #footNav ul li {display: inline; padding: 0px 25px; border-right: 1px solid #003a7a; text-align: center;}
      #footNav ul li a {font-weight: normal; color: #003a7a; margin: 0;}
      #footNav ul li a:hover, #footNav ul li.current a {color: #bf1e2e;text-decoration: underline;}