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

File: simple.css
Desc: CSS styles and layout information for ARC project
	  CSC 305

Created: Feb. 28th, 2008 by CJT
LastMod: Mar. 8th, 2008  by CJT

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


/* BODY styles /////////////////////////////////////////////////////*/
body 
{
	/* main text font(s)  */
	/*font-size: 11px; */
    font: 70%/19 Verdana, Helvetica, sans-serif, Tahoma, Arial;
	line-height:160%;

    color:      #444555;	/* text color */
    background: #E5EEF2;	/* background color */
   	background:#15214D;
   	background:#BFBFBF;
   	background:#86A387;
    
    /* background image */
    background-image:url('stripes15.png');
    
    background-attachment=fixed; 
background-position: top left;
 background-repeat:repeat-x;
  
    margin: 0px;     
    padding: 0px; 
}  

body { } 


/* PAGE HEADER styles (top) //////////////////////////////////////////*/
#header 
{
	/* (This is the blue area on top)	*/
    width:  850px;				/* header width				*/
   	height: 136px;				/* header height
    
    margin: 0px auto;			/* header magins			*/
    padding: 0px 25px;			/* header padding			*/
    clear:   both;
    
    background: #003c78;		/* background color			*/
    color:      #B2D09D;		/* text color				*/

	/* background image (overrides background color)		*/
    background-image:url('arcblue1.jpg');
}

#subheader 
{
	/* (This is the yellow 'stripe') 	*/
 	width:  850px;				/* subheader width			*/
 	height: 25px;				/* subheader height			*/

    margin:  0px auto;
    padding: 0px 25px;
    clear:   both;
    
    background: #003c78;		/* background color			*/

	/* background image (overrides background color)		*/
    background-image:url('arcyellow1.jpg');
}

/* FOOTER styles //////////////////////////////////////////*/
#footer 
{
	/* This is the blue block at the bottom of the main page content */
    margin:  0px auto;				/* margins/padding		*/
    padding: 5px 20px;
    clear:   both;
    
    width: 860px;					/* footer width (should match header, etc.)
    								   height auto-adjusts to content	*/
		
    color: #FFFFEF;					/* text color (off-white)			*/
    background: #003c78;			/* background color (blue-ish)		*/
    
    border-top: 1px solid #000000;	/* top/bottom margin stripes		*/
    border-bottom: 2px solid #000000;

    text-align:center;				/* center align the text 			*/
   
    /* background image (overrides background color)		*/
    background-image:url('arcfoot1.jpg');
}
.clear { clear: both; width: 100%;}

.centered-table 
{
   margin-left:  auto;
   margin-right: auto;
   width: 100%;
}
/* OUTER styles //////////////////////////////////////////*/
#outer 
{
	/* outer-most container for keeping our divs in place */
    width: 900px;
    margin: 0px auto;
    padding: 0px;
    background: #ffffff;
    clear: both;
}

/* MAIN PAGE styles //////////////////////////////////////////*/
#mainpage 
{
    margin: 0px;					/* no margin 			*/
    padding: 0px 25px;				/* padding				*/
    width: 850px;					/* main page width		*/
    border-top: 1px solid #bfa300;	/* strip at the top (below the yellow)*/
    clear: both;
}

/* ignore this imglink stuff... */
.imglink
{
	border-style:none;	
	background: white;
	border-style:none;
}

.imglink a
{
	border-style:none;	
	background:  inherit;
	border-style:none;
}


.imglink a:hover
{
	border-style:none;	
	background: white;
	border-style:none;
}



/* LEFT NAV styles //////////////////////////////////////////*/
#left 
{
	/* This is the navigation area on the left column */
	background-color: #ffffff; /* background color		*/;
	margin: 0px 0px 30px -850px;
/* margins/padding		*/	padding: 0px 0px 20px 0px;
	width: 160px; /* nav col width		*/;
	width: 15em; /* nav col width		*/;
	float: left; /* left float			*/;
	z-index: 0;
	overflow: visible;
	border-right: 1px solid #E3E3E3;
/* gray border on the right of the column */	background-image: url('bluelink2.jpg');
	

	
}

/* RIGHT NAV styles //////////////////////////////////////////*/
#right 
{
	/* This is the navigation area on the right column */
    margin: 0px 0px 30px -200px;	/* margins/pading		*/
    padding: 0px 0px 20px 0px;
    width: 160px;					/* right-nav col width	*/
    width: 15em;					/* nav col width		*/

    float: right;					/* floating right		*/
}


/* CONTENT styles //////////////////////////////////////////*/
#content 
{
	/* 'content' is the actual page material, in the center white area */
    margin: 0px 200px 30px 150px;	/* setup margins/padding			*/
    padding: 0px 30px 20px 30px;
    width: 440px;					/* content width					*/
   z-index: 100;
	overflow: hidden;
    float: left;	    /* background image (overrides background color)		*/
   

 background-image:url('arcbk1.jpg');
    background-repeat:no-repeat;	/* make sure it doesn't tile */
		
}
* html #content
{display: inline;}

#content p
{
	/* 'para' are paragraph-like units for containing individual blocks of text/content */
    margin: 0px 0px 10px 0px;			/* margins/padding				*/
    padding: 0px 0px 20px 0px;
    border-bottom: 1px #EEEEFF;	/* bottom border of each has a very, very light-gray	*/
    border-bottom-style:dashed;			/* dashed line at the bottom. Helps separate content... */
}


#content p.tag
{
	/* 'para' are paragraph-like units for containing individual blocks of text/content */
    margin: 50px 0px 10px 0px;			/* margins/padding				*/
    padding: 0px 0px 20px 0px;
 	font-family:Georgia, Times;				/* Georgia font, or similar		*/
	font-size: 160%;					/* big text						*/
	font-style:italic;					/* and italic					*/
	font-weight:bold;
	color: black;
	text-align: center;
	border-bottom: 0px #EEEEFF;	/* bottom border of each has a very, very light-gray	*/
    border-bottom-style:none;			/* dashed line at the bottom. Helps separate content... */
    

 }


/* HEADER TEXT styles //////////////////////////////////////////*/
#content h1, h2, h3 , h4, h5, h6 
{
    color: #097054;  	/* dark green color 	*/
    margin: 0px 0px 10px 0px;	
    padding: 0px 0px 0px 0px;
    text-align: left;
}


/* TAGHEADER styles //////////////////////////////////////////*/
.tagheader 
{
	/* 'tag header' is the tagline text contained within the header block	*/
	color: #ffffff;						/* white text 					*/
	font-family:Georgia, Times;				/* Georgia font, or similar		*/
	font-size: 160%;					/* big text						*/
	font-style:italic;					/* and italic					*/
}

/* HYPERLINK styles (body) //////////////////////////////////////////*/
a 
{
	color:#04529E;				/* hyperlink color (normal)	*/
	text-decoration: none;		/* no undelines on text 	*/
	font-weight: bold;			/* hyperlinks are bold		*/
	padding: 1px 0px 1px 0px;	/* hyperlink padding		*/
}

a:hover 
{
     color: #033566;						/* text color 						*/
    background: #ffffaa;				/* background color (pale green)	*/
    border-bottom: 1px solid #ffaa00;	/* line at bottom (deeper green)	*/

}

/* HYPERLINK styles (body) //////////////////////////////////////////*/
a.email 
{
	color:#aacdff;				/* hyperlink color (normal)	*/
	text-decoration: none;		/* no undelines on text 	*/
	font-weight: normal;			/* hyperlinks are bold		*/
	padding: 1px 0px 1px 0px;	/* hyperlink padding		*/
}

a.email:hover 
{
       border-bottom: 1px solid #bbdeff;
       background:transparent;

}


/* UNORDERED LIST NAV styles //////////////////////////////////////////*/
ul.nav 
{
	/* Ok. Try to follow me. I've redefined the unordered list in such a way
	   that we can use it to create a set of vertical navigation links. This
	   makes it very simple to define the left-col nav in the HTML code	*/
	
	/* normal */   
    margin: 0px 0px 30px 0px;			/* margins/padding				*/
    padding: 0px;
    list-style: none;					/* no list style				*/
    width: 100%;						/* fill the full width			*/
   
    }

ul.nav a
{
	/* hyperlink */
    margin: 0px;						/* margins/padding/layout		*/
    padding: 0px 10px 0px 10px;
    display: block;
    
    height: 25px;						/* we want 25 pixels high		*/
    
    line-height: 25px;					/* line spacing and font 		*/
    font-weight: normal;
    font-size: 93%;
    
 /*   background: #fcfcfc;				/* background color (very slighltly off white) 	*/*/
  /*   background-image: url('bluelink1.jpg');				/* background color (very slighltly off white) 	*/*/

    color: #033566;						/* text color	*/
    border-bottom: 1px solid #9ddaf2;	/* line at bottom of each nav link (to create the
    									   appearance of 'blocks' */
    									  
}

/* This is for visual cues regarding Accessibility features... Out for now...
ul.nav a:first-letter 
{
	text-decoration: underline;
} */

ul.nav a:hover
{
	/* hyperlink (hovering) */
    color: #033566;						/* text color 						*/
    background: #e5f2da;				/* background color (pale green)	*/
    border-bottom: 1px solid #a3c586;	/* line at bottom (deeper green)	*/
    
    color: #033566;						/* text color 						*/
    background: #ffffaa;				/* background color (pale green)	*/
    border-bottom: 1px solid #ffaa00;	/* line at bottom (deeper green)	*/

}


/* HEADER TEXT styles //////////////////////////////////////////*/
h1, h2, h3 , h4, h5, h6 
{
    color: #097054;  	/* dark green color 	*/
    margin: 0px;
    padding: 0px;
    text-align: left;
}

/* INDIVIDUAL HEADER TEXT styles //////////////////////////////////////////*/
#content h1 
{ 
    font-size: 160%;
    line-height: 40px;
    font-family:Georgia;	/* use Georgia for the main header */
}

#content h2 
{ 
    font-size: 140%;
    line-height: 40px;
    }

#content h3 
{ 
    font-size: 130%;
    line-height: 30px;
  }

#content h4 
{ 
    font-size: 110%;
    line-height: 20px;
}

#content h5 
{ 
    font-size: 100%;
    line-height: 15px;
}



/* TEMP JUNK */

.style2 {
	background-color: #FFFF00;
}
.style3 {
	color: #FF0000;
}