html,
body {
  height: 100%;
}

body {
  margin: 0;
  padding: 0;  
  
  font: 1em, Garamond, Georgia, Times, serif;  
  line-height: 1.4em;

  color: #111;
  background-color: #feeabc;
}


h1, h2, h3, h4, h5, h6, p {
  margin: 0;
  padding: 10px 0;  
}

/* Headings */
h1 {
  font: 1.7em Georgia, serif;
  letter-spacing: -0.05em;
}

h2 {
  font: 1.4em Georgia, serif;
  color: #111;
}

h3 {
  font: 1.15em Georgia, serif;
}

/* Standard HTML elements */
a {
  color: #0000FF;
}

a:hover {
  text-decoration: none;
}

ol {
  margin: 0 25px;
  padding: 10px 20px;
}

ul.arrow {
  margin: 0 10px;
  padding: 10px 20px;
  list-style: none;
}

ul.arrow li {
  margin: 0;  
  padding-left: 15px;
  background: url(../image-files/li_arrow_bullet.gif) no-repeat 0 5px;
}

/* Yellow blockquotes */
blockquote {
  margin: 10px 0;
  padding: 0;
  background: #FDF8BE;
}

blockquote p {
  padding: 0 10px;
}

blockquote h2 {
  padding: 0 10px 10px;
}

blockquote {
  background: #FDF8BE url(../image-files/blockquote.gif) repeat-x top left;
}



/**************************************************************
   Tables
 **************************************************************/

table {
  width: 100%;  
  margin-bottom: 20px;  
  border-collapse: collapse;
}

table caption {
  margin-top: 10px;
  padding: 10px 0 0.5em 10px;

  font: 0.8em arial, sans-serif;
  text-align: left;  
}

table th,
table td {
  text-align: left;
  vertical-align: top;  
  padding: 6px 10px;
}

thead th {
  background-color: #CCD8E3;
  border-bottom: 1px solid #9DB5CB;
}

tbody tr.dark {
  background-color: #F5F5F5;
}

tbody td {
  border-bottom: 1px solid #DDD;
}

tbody tr:hover {
  background-color: #FDF8BE;
}




/**************************************************************
   Form Elements
 **************************************************************/

label {
  float: left;
  text-align: right;
  width: 9em;
  padding-right: 1em;
  
}


input.button {
  padding: 1px 10px;

  cursor: pointer;
  
  font-family: Georgia, serif;

}

.required {
  cursor: help;
  border-bottom: 1px solid #CCC;
}
/***********************************************************************
   #container: holds all site content and sets white background
 ***********************************************************************/
 
#container {
  width: 870px;
  min-height: 100%;

  position: relative;
  margin: 0.5em auto 0 auto;
  
  background: #FFF;
  border: 1px solid #888;
}

#containterBottom {
  height: 2em;
}



/***********************************************************************
   #header: holds top actions, logo, main menu, breadcrumbs and date
 ***********************************************************************/

#header {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  
  width: 100%;
  height: 140px;
}


/* Top page action links and search form */
#header .actions {
  position: absolute;
  top: 7px;
  right: 0;
  z-index: 4;
  
  width: 420px;
  height: 86px;
  
  text-align: right;
}


/* Top page action links */
#header .actions ul {
  margin: 0 17px 0 0;
  padding: 0;
  list-style: none;
}

#header .actions ul li {
  margin: 0;
  padding: 0;
  display: inline;
}

#header .actions ul li a {
  margin: 0 6px;
  
  font-size: 13px;
  
  color: #999;
}


/* Top page search form */
#header .actions form {
  margin: 0;
  padding: 0;
}

#header .actions label {
  display: none;
}

#header .actions input.field {
  padding: 4px;
  margin: 10px 2px 0 0;
  
  width: 231px;
  height: 20px;
  
  font-family: Georgia, serif;
  font-size: 17px;
  
  border:1px solid #888;
  
}

#header .actions input.button {
  position: relative;
  top: 10px;
  
  width: 75px;
  height: 32px;

  padding: 0 0 1px 0;
  margin: 0 20px 0 7px;
  
  vertical-align: top;  
}


/* Site logo and tagline */
#header #logo {
  position: absolute;
  top: 11px;
  left: 5px;
  z-index: 5;
  
  width: 450px;
  height: 83px;
  background: url(../image-files/header_logo.gif) no-repeat top left;
}

#header #logo p {
  margin: 0;
  padding: 0;
  font-size: 0px;
  text-indent: -1000px;
}


/* Back home logo link */
#header .home,
#header :hover.home {
  position: absolute;
  top: 11px;
  left: 25px;
  z-index: 6;
  
  width: 450px;
  height: 92px;
  
  background: transparent;
  cursor: pointer;
}


/* Breadcrumbs */
#header #breadcrumbs {
  position: absolute;
  bottom: 11px;
  left: 20px;
  z-index: 5;
  font-size: 1em;
}

#header #breadcrumbs .arrow {
  padding: 0 6px;
  font-family: courier, monospace;
  color: #C1C1C1;
}


/* Date */
#header #date {
  position: absolute;
  bottom: 11px;
  right: 20px;
  z-index: 5;
  font-size: 0.85em;
}




/***********************************************************************
   #columns: definitions for main content area and 1, 2 or 3 column 
             layout
 ***********************************************************************/

#columnsOne,
#columnsTwo,
#columnsThree {
  margin: 0 20px;
}

#columnsOne {
  padding: 140px 0 0 0;
}

#columnsTwo {  
  padding: 140px 0 0 160px;  
}

#columnsThree {
  /* Top padding = header height, Left padding = LC width, Right padding = RC width */
  padding: 140px 160px 0 160px;
}

.column {
  position: relative;
  float: left;
}

/* Main column */
#center {
  width: 100%;  
}

#columnsThree #center .padding {
  padding: 0 30px 0 25px;
}

#columnsTwo #center .padding {
  padding: 0 0 0 25px;
}

/* Left column */
#left {
  width: 180px;          /* LC width */
  right: 170px;          /* LC width */
  margin-left: -100%;
}

/* Right column */
#right {
  width: 160px;          /* RC width */
  margin-right: -160px;  /* RC width */
}




/***********************************************************************
   #footer: holds bottom actions, link blocks, text and copyright
 ***********************************************************************/


#footer {  
  padding: 0;

  font-size: 0.9em;

  /* Forces IE to properly calculate the start point of the footer */
  color: #999;
  border-top: 1px solid #FFF;
}

#footer a {
  color: #777;
}

#footer .left {
  float: left;
  width: 45%;
  padding: 40px 0 15px 10px;
  margin-left: 10px;
}

#footer .right {
  float: right;
  width: 40%;
  text-align: right;
  padding: 40px 10px 15px 0;  
  margin-right: 10px;
}



/***********************************************************************
   Icon links
 ***********************************************************************/


a.iconRSS {
  padding: 2px 20px 2px 2px;    
  margin-left: 10px;
  background: url(../image-files/rss.gif) no-repeat center right;
}



/***********************************************************************
   #preloader: used to cache CSS rollover image to avoid flicker
 ***********************************************************************/

#preloader {
  position: absolute;
  top: -3000px;
  left: -3000px;
}



/***********************************************************************
   .roundedBlock: Rounded, solid colour block
 ***********************************************************************/

.roundedBlock {
  margin: 15px 0 50px 0;
}

.roundedBlock a {
  color: #333;
}

.roundedBlock h2 {
  padding: 0 10px 10px;
}

.roundedBlock p {
  padding: 10px;
}

.roundedBlock ul {
  margin: 0 10px;
  padding: 0;
  list-style: none;
  border-top: 1px solid #ddd;
}

.roundedBlock ul li {
  margin: 0;
  padding: 0;
  display: inline;
}

.roundedBlock ul li a {
  display: block;
  padding: 5px 0;
  border-bottom: 1px solid #ddd;  
  text-decoration: none;
}

.roundedBlock ul li a:hover,
.roundedBlock ul li.here a {
  text-decoration: underline;
}






/***********************************************************************
   .bigImageLinks: Large, hoverable image links
 ***********************************************************************/

ul.bigImageLinks {
  margin: 0;
  padding: 0;
  list-style: none;
}

ul.bigImageLinks li {
  margin: 0;
  padding: 0;
  display: inline;
}

ul.bigImageLinks li a {
  float: left;
  width: 100%;
  margin: 10px 0;
  
  text-decoration: none;
  cursor: pointer;
  
  color: #111;
}

ul.bigImageLinks li a img {
  float: left;
  padding-left: 10px;
  border: 0;
}

ul.bigImageLinks li a span.text {
  float: right;
  width: 190px;
  padding-right: 10px;
}

#columnsOne ul.bigImageLinks li a span.text {
  width: 582px;
}

#columnsTwo ul.bigImageLinks li a span.text {
  width: 395px;
}

ul.bigImageLinks li a span.title {
  display: block;
  font: bold 1.2em arial, sans-serif;
}

ul.bigImageLinks li a span.link {  
  text-decoration: underline;
  color: #1260B2;
}

ul.bigImageLinks li a:hover {
  background-color: #CCD8E3;
}




/***********************************************************************
   Action Icon links
 ***********************************************************************/

ul.actions {
  margin: 30px 0;
  padding: 0 5px;
  font-size: 0.9em;
  list-style: none;
}

ul.actions li {
  margin: 0;
  padding: 0;
  display: inline;  
}

ul.actions li a {
  position: relative;
  z-index: 1;
  
  float: left;  
  padding: 5px 0 5px 22px;
  
  color: #666;
  background-position: 0 7px;
  background-repeat: no-repeat;  
}

a.email {
  width: 140px;
  background-image: url(../image-files/email.gif);
}

a:hover.email {
  background-image: url(../image-files/email-on.gif);
}

a.pdf {
  width: 132px;
  background-image: url(../image-files/pdf.gif);
}

a:hover.pdf {
  background-image: url(../image-files/pdf-on.gif);
}

a.print {
  width: 75px;
  background-image: url(../image-files/print.gif);
}

a:hover.print {
  background-image: url(../image-files/print-on.gif);
}

a.bookmark {
  width: 140px;
  background-image: url(../image-files/bookmark.gif);
}

a:hover.bookmark {
  background-image: url(../image-files/bookmark-on.gif);
}

a.share {
  width: 132px;
  background-image: url(../image-files/share.gif);
}

a:hover.share {
  text-decoration: none;
  background-image: url(../image-files/share-on.gif);
}

a.subscribe {
  width: 75px;
  background-image: url(../image-files/subscribe.gif);
}

a:hover.subscribe {
  text-decoration: none;
  background-image: url(../image-files/subscribe-on.gif);
}



/* Actions popup */
ul.actions li a span.popup {
  position: absolute;
  z-index: 2;
  display: none;
 
  width: 150px;
  top: -5px;
  left: -15px;
  
  color: #444;
}

ul.actions li a:hover span.popup {
  display: block;
  padding: 0 0 14px 0;
  background: url(../image-files/popup-bottom.png) no-repeat bottom left;
}

ul.actions li a span.popup span {
  display: block;  
  padding: 4px 12px 4px 38px;
  cursor: pointer;  
}

ul.actions li a span.popup span.top {
  padding: 12px 0 0 0;    
  background: url(../image-files/popup-top.png) no-repeat top left;
}


ul.actions li a span.popup span.top span {
  text-decoration: none;
}

ul.actions li a span.popup span.top span:hover {
  text-decoration: underline;
}

span.digg {
  background: url(../image-files/digg.gif) no-repeat 16px 50%;
}

span.delicious {
  background: url(../image-files/delicious.gif) no-repeat 16px 50%;
}

span.rss {
  background: url(../image-files/rss.gif) no-repeat 16px 50%;
}

span.google {
  background: url(../image-files/google.gif) no-repeat 16px 50%;
}

span.msn {
  background: url(../image-files/msn.gif) no-repeat 16px 50%;
}

span.yahoo {
  background: url(../image-files/yahoo.gif) no-repeat 16px 50%;
}





/***********************************************************************
   Rounded corners: when the 4 corners must be specified in a top/bottom
                    and right/left configuration
 ***********************************************************************/

.t,
.b {
  clear: both;
  display: block;
  width: 100%;
  height: 8px; 
  
  /* Required by IE since it fills all containers with text nodes and 
     then forces the container to expand to fit */
  font-size: 0px;
}

.l {
  float: left;
}

.r {
  float: right;
}

/* Start generic definitions - 8px radius corner.  Overwrite as required 
   more specific styles */
.l,
.r {
  height: 8px;
  width: 8px;
}

.t .l {
  background: url(../image-files/corner_tl.png) no-repeat top left;
}

.t .r {
  background: url(../image-files/corner_tr.png) no-repeat top left;
}

.b .l {
  background: url(../image-files/corner_bl.png) no-repeat top left;
}

.b .r {
  background: url(../image-files/corner_br.png) no-repeat top left;
}


/***********************************************************************
   Generic css
 ***********************************************************************/
 
 .clear {
   clear: both;
 }


/***********************************************************************
   Newsletter signup form
 ***********************************************************************/

.listImage {
	display: block;
	overflow: hidden;
	
	height: 50px;
	width: 160px;
	
	background-image: url(../image-files/ezine.jpg);
	background-repeat: no-repeat;
}

.signup {
	padding-bottom: 1px;
}

.signupAdd {
	font-size: 0.8em;
	line-height: 1.2em;
}

#right .button {
	width: 147px;
	height: 28px;
}