
/* CSS Document */

/* Thanks to Dan Shafer, author of "HTML Utopia: Designing Without Tables Using CSS" for 
his great book. This CSS document incorporates many of the techniques outline in the book. 
For more information, visit http://www.sitepoint.com/books/css1/  */

/* --------- formatting ------------------- */


body {
	font: 12pt Tahoma, sans-serif;
	margin: 0;
	background: #FFFFCC;
	color: black
	}

h1 {
	font: bold 20pt Tahoma, sans-serif;
	background: none;
	color: red;
	margin-top: 0;
	}
	
h2 {
	font: bold 16pt Tahoma, sans-serif;
	background: none;
	color: red;
	}

h2.c1 {
	font: bold 16pt Tahoma, sans-serif;
	background: none;
	color: black;
	}
	
h3 {
	font: 10pt Tahoma, sans-serif;
	background: none;
	color: ffffff;
	}
	
h3.c1 {
	font: 10pt Tahoma, sans-serif;
	background: none;
	color: black;
	}

h4 {
	font: bold 14pt Tahoma, sans-serif;
	background: none;
	color: red;
	}

h4.bl {
	font: bold 14pt Tahoma, sans-serif;
	background: none;
	color: black;
	}
	
#right h4 {
	font: bold 12pt Tahoma, sans-serif;
	background: blue;
	color: #ffffff;
	text-align: center;
	}

h5 {
	font: bold 8pt Tahoma, sans-serif;
	background: none;
	color: black;
	}
	
p {
	font: 12pt Tahoma, sans-serif;
	color: black;
	text-align: left
	}
p.c1 {font-family: Tahoma; font-size: 80%; color: black;	text-align: center;}

p.c2 {
		 font: bold Tahoma, sans-serif;
		 font-size: 4pt;
		 background: yellow;
		 }

p.c3 {
	font: 10pt Tahoma, sans-serif;
	color: black;
	text-align: center;
	}

p.c4 {
	font-size: 6pt;
	font-family: Tahoma, sans-serif;
	color: black;
	}

p.c5 {
	font: bold 12pt Tahoma, sans-serif;
	color: red;
	text-align: center;
	}

p.indented{
padding-left: 50px;
padding-right: 50px;
}
	
p.c10 {color: #FFFFFF; font-family: Tahoma; font-size: 80%}

		

span.c2 {color: black; font-family: Tahoma; font-size: 80%}

span.c3 {padding: 1.5em ;color: #FFFFFF; font-family: Tahoma; font-size: 100%}

span.c4 { color: #FFFFFF; font-family: Tahoma; font-size: 80%; cursor:pointer}

li.c4:hover {text-decoration:underline}

span.c5 {color: #FFFFFF; font-family: Tahoma; font-size: 80%}

sup.c3 {color: #FFFFFF}

u.c6 {color: #FFFFFF; font-family: Tahoma; font-size: 80%}
 

	
#articles p {
	font: 7pt Tahoma, sans-serif;
	text-align: center;
	}
	
#center p {
	font: 12pt Tahoma, sans-serif;
	}
	
#right p {
	font: 8.5pt Tahoma, sans-serif;
	}
	
div#topcontent p {                       
	text-align: right;
	right: 4px;
	}
	
#bottom3 p {
	font: 8pt Tahoma, sans-serif;
	text-align: center;
	}

#footer p {
	margin: 4px;
	text-align: center;
	}
	
ul {
	list-style-type: disc;
	list-style-position: outside;
	font: 10pt Tahoma, sans-serif, #ffffff;
	
	}
   
ul#prob {
	list-style-type: disc;
	list-style-position: outside;
	font: 10pt Tahoma, sans-serif;
	}
   
ul ul {
	list-style-type: square;
	list-style-position: outside;
	font: 100% Tahoma, sans-serif;
	}

ol {
	list-style-type: decimal;
	list-style-position: outside;
	font: 10pt Tahoma, sans-serif;
	}
   
ol ol {
	list-style-type: lower-alpha;
	list-style-position: outside;
	font: 100% Tahoma, sans-serif;
	}
A	 {font-family: tahoma; font-size: 60%; color: black; text-decoration: none}
A:link {font-family: tahoma; font-size: 60%; color: black; text-decoration: none}
A:visited {color: black; text-decoration: none}
A:hover {text-decoration: none; cursor: none}

a {     
	background: none;
	color: #ffffff;		
	}

a:hover {
	background: none;
	color: #9C191E;	
	}

a.c1 {color: #FFFFFF; font-family: Tahoma; font-size: 80%}
a.c1:link {color: #FFFFFF; text-decoration: none}
a.c1:visited {color: #FFFFFF; text-decoration: none}
a.c1:hover {text-decoration: underline}

a.c2 {padding: 1px; color: blue; font-family: Tahoma;  font-size: 100%}
a.c2:link {color: blue; text-decoration: none}
a.c2:visited {color: red; text-decoration: none}
a.c2:hover {text-decoration: underline}

a.c3 {padding: 1px; color: blue; font-family: Tahoma; font-style: italic; font-weight: bold; font-size: 100%}
a.c3:link {color: blue; text-decoration: none}
a.c3:visited {color: red; text-decoration: none}
a.c3:hover {text-decoration: underline}

a.c4 {padding: 1px; color: blue; font-family: Tahoma; font-weight: bold; font-size: 100%}
a.c4:link {color: blue; text-decoration: none}
a.c4:visited {color: blue; text-decoration: none}
a.c4:hover {text-decoration: none}


a.c7 {font-family: Tahoma; font-size: 80%}
a.c9 {color: #FFFFFF}

a.c10 {
			color: black;
			font-family: Tahoma; 
			font-size: 80%;
			position: bottom;
			}
a.c10:link {color: black; text-decoration: none}
a.c10:visited {color: black; text-decoration: none}
a.c10:hover {text-decoration: none}

a.c11 {font-style: italic; font-weight: bold ;color:blue; font-family: Tahoma; font-size: 12pt; }
a.c11:link {color: blue; text-decoration: none}
a.c11:visited {color: red; text-decoration: none}
a.c11:hover {text-decoration: underline}
	
a.c14 {font-style: bold, italic ;color:red; font-family: Tahoma; font-size: 14pt; }
a.c14:link {color: red; text-decoration: none}
a.c14:visited {color: red; text-decoration: none}
a.c14:hover {text-decoration: underline}

a.c16 {font-style: bold, italic ;color:red; font-family: Tahoma; font-size: 16pt; }
a.c16:link {color: red; text-decoration: none}
a.c16:visited {color: red; text-decoration: none}
a.c16:hover {text-decoration: underline}

hr {
	background: none;
	color: #A5B5C6;
	height: 1px;
	}
	
a img {
	img-postition: center;
	border: 0px none;
	display: block
	}
	
div#top img {
                       
	position: relative;
	left: 80px;
	top: 10px;
	}
	
div#topcontent img {                       
	position: absolute;
	right: 4px;
	top: 30px;
	}
	
div#top a {
	display: block;		/* makes the background hover effect work in Mozilla */
	width: 153px;
	background: #5C6F90;
	color: #000;
	}

div#top a:hover {
	background: #43616B;
	color: #000;
	}

/* ------------------------------- layout ----------------------------- 

Notes:

Do not mix px widths with % widths for margins, borders or padding because 
the total box width = set width + padding + border.  (It helps if you can add them together.)

The box model hack is used to fix a bug in IE5-Win ...for an explanation from the guy that wrote 
it go to http://www.tantek.com/CSS/Examples/boxmodelhack.html

IE6-Win will behave like IE5-Win if you include <?xml version="1.0"?>.  It is apparently 
unneccessary so leave it out!

Left Col Widths:
 |  pad   |         width        |  pad   | 				
 ------------------------------------------					
 |   0    |          30%         |   0    |	
 
Center Margins:
 |  marg  |         width        |  marg  | 
 ------------------------------------------
 |   30%  |        (auto)        |   20%  |

Right Col Widths:
 |  pad   |         width        |  pad   | 				
 ------------------------------------------					
 |  1.5%  |          19%         |  1.5%  |	total width= 25% */


#top {
	padding-left: 120px;
	height: 150px;
	width: 1025px;
	background-image: url(http://theampletraveler.com/images/TATBkgrd3.jpg);
	background-repeat:no-repeat;
  background-position:center;
	}
	
#topsbi {
	padding: 4px;
	height: 97px;
	background: #BDC5CE url('../Local%20Settings/Temporary%20Internet%20Files/Content.IE5/W31VMUNP/image-files/bgtop.jpg') repeat-x;
	color: #000;
	border-bottom: 1px solid #A5B5C6
	}
	
#center {
	margin: 0px 225px 0px 200px;
	padding: 2px,0,2px,20px;
	width: 600px;
	}

	
div#center img {position: center}

#left_column{
	width:300px;
	float:left;
		}
#right_column{
	padding: 0,0,100,10;
	width:250px;
	float:right;
		}



#left {
	position: absolute;
	margin-bottom: 10%;
	padding: 0,0,100,5;
	top: 150px;
	bottom: 20px;
	width: 200px;
	background: #6495ED;
	color: #000;
	}
	
div#left li { 				
				 color: #ffffff;
				 list-style-type: none 
}
				 
	
	
	
div#topcontent {
	position: absolute;
	top: 12px;
	right: 0;
	width: 80%;
	}

#right {
	position: absolute;
	width: 200px;
	left: 825px;
	right: 0px;
	padding: 10px;
	top: 300px;
	}

#bottom2{
	text-align: center;
	margin: 0 225 0 200;
	padding: 1% 3%;
	width: 600px;
	}
	
#bottom3 p {
	font: 10pt Tahoma, sans-serif;
	text-align: center;
	margin: 0 225 0 200;
	padding: 1% 3%;
	width: 600px;
	}
	
	
#footer {
	clear: both;
	border-top: 1px solid #5C6F90;
	border-bottom: 1px solid #5C6F90;
	background: #D6D6D6;
	color: #000;
	}

/* ------------------- Navigation ------------------ 

List tips courtesy of A List Apart: http://www.alistapart.com/stories/taminglists/ */


ul#nav {
	list-style: none;
	margin: 0;
	padding: 0;
	background: #D6D6D6;
	color: #fff;
	}
		
ul#nav li {
	border-top: 1px solid #A5B5C6;
	border-right: 2px solid #A5B5C6;
	border-left: 2px solid #A5B5C6;
	}
	
ul#nav li.first {
	border-top: 1px solid #A5B5C6;
	}
	
ul#nav li.last {
	border-bottom: 1px solid #A5B5C6;
	}

ul#nav li a {
	text-decoration: none;
	display: block;
	width: 88%;
	padding: 3px 6%;
	background: #5C6F90;
	font: bold 10pt Tahoma, sans-serif;
	color: #fff;
	}

ul#nav li a:hover {
	background: #E7E7E7;
	color: #9C1A1E;
	}
	
div#topcontent ul {
	position: absolute;
	right: 0;
	list-style: none;
	}

div#topcontent ul li {
	display: inline;
	padding: 0 5px;
	border-left: 1px solid #34339B;	
	}

div#topcontent ul li.first {
	border-left: 0px none;
	}

div#topcontent ul li a {
	font: 8pt Tahoma, sans-serif;
	text-decoration: none;
	}
	
div#topcontent ul li a:hover {
	font: 8pt Tahoma, sans-serif;
	text-decoration: underline;
	}


div#topcontent form {
	position: absolute;
	right: 0;
	top: 20px;
	}
	
div#bottom {
	clear: both;
	width: 100%;
	text-align: center;
	}
	
div#bottom2 {
	clear: both;
	width: 100%;
	text-align: center;
	}
	
div#botton3 {
	clear: both;
	width: 100%;
	}
	
div#articles {
	clear: both;
	width: 100%;
	}
	
div#bottom ul {
	list-style: none;
	}
	
div#bottom ul li {
	display: inline;
	padding: 0 0.5em;
	border-left: 1px solid #34339B;	
	}
	
div#bottom ul li.first {
	border-left: 0px none;
	}
	
div#bottom ul li a {
	font: 8pt Tahoma, sans-serif;
	text-decoration: underline;
	background: none;
	color: #0000ff;
	}
	
div#bottom ul li a:hover {
	font: 8pt Tahoma, sans-serif;
	text-decoration: underline;
	background: none;
	color: #0000ff;
	}
		
div#bottom2 ul {
	list-style: none;
	}
	
div#bottom2 ul li {
	display: inline;
	padding: 0 0.5em;
	border-left: 1px solid #34339B;	
	}
	
div#bottom2 ul li.first {
	border-left: 0px none;
	}
	
div#bottom2 ul li a {
	font: 8pt Tahoma, sans-serif;
	text-decoration: underline;
	background: none;
	color: #0000ff;
	}
	
div#bottom2 ul li a:hover {
	font: 8pt Tahoma, sans-serif;
	text-decoration: underline;
	background: none;
	color: #0000ff;
	}
	
 
/* --------------------------------------------------------------------- */
