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

   AUTHOR:  Pat Heard (fullahead.org)

   DATE:    2007.11.08

   PURPOSE: Controls the style of HTML elements

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





body {

  margin: 0;

  padding: 0;



  font: 0.8em arial, sans-serif;

  line-height: 1.5em;  

  text-align: center;

  

  color: #42210B;

  background: #FFF;  

}





p {

  margin: 0;

  padding: 6px 12px;

}



h1 {  

  clear: both; 

  margin: 0;

  padding: 20px 12px 0px 12px;

  

  font: 1.5em arial, sans-serif;

  letter-spacing: -0.05em;

  color: #da3e1f;

}



h2 {

  clear: both;

  margin: 0;

  padding: 10px 12px 0 12px;

  

  font: bold 0.9em arial, sans-serif;

  text-transform: uppercase;

  color: #6B452C;

}



h3 {

  clear: both;

  margin: 0;

  padding: 10px 12px 0 12px;

  

  font: bold 0.8em arial, sans-serif;

  text-transform: uppercase;

  color: #bf9a82;

}



a {

  text-decoration: none;

  color: #3ca2a2;

}



a:hover {

  border-bottom: 4px solid #8CD9D9;

}



a img {

  border: 0;

}



a.border img {

  border: 4px solid #B9E4E5;

}



a:hover.border img {

  border: 4px solid #8CC8C9;

}



acronym {

  border-bottom: 1px solid #eeded3;

  cursor: help;

}



ul.arrow {

  margin: 10px 30px;

  padding: 10px 30px 10px 5px;

  list-style: none;

}



ul.arrow li {

  padding-left: 25px;

  background: url(../img/bg/li_bullet.gif) no-repeat;

  background-position: 8px 5px;

}



ol {  

  margin: 10px 30px;

  padding: 10px 30px;

}



blockquote {

  margin: 10px 0;

  background: #fffdcd;

  border-bottom: 1px solid #ffd909;

}



blockquote a {

  color: #FFA509;

}



blockquote a:hover {

  border-color: #fdce72;

}





/* The <dl> is setup for a single column width.  To make it work in larger columns,

   change the width of the dl, dt and dd elements */

dl {

  width: 220px;

  margin: 0;

  padding: 12px;

  font-size: 0.9em;  

}



dl dt {

  float: left;

  width: 100px;

  

  margin: 0;

  padding: 3px 0;



  font-weight: bold;

  color: #42210B;

  background: url(../img/bg/dotted_line.gif) repeat-x 0 16px;

}







dl dd {

  float: left;  

  clear: right;

  width: 120px;  

  margin: 0;

  padding: 3px 0;

}





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

   Tables

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



table {  

  margin: 0 12px 20px 12px;

  padding: 0;

  display: block;

  

  font-size: 1em;

  border-collapse: collapse;

}



table caption {

  margin: 0 12px;

  padding: 20px 0 5px 0;



  font: 400 0.8em arial, sans-serif;

  text-align: left;  

}



table th,

table td {

  text-align: left;

  vertical-align: top;

  padding: 4px 7px !important;

  padding: 6px 10px;

}





thead th {

  color: #FFF;

  background-color: #5F371C;

  border-bottom: 1px solid #261204;

}



tbody tr.dark {

  background-color: #f1e3da;

}



tbody td {

  border-bottom: 1px solid #e7d6cc;

}



tbody tr:hover td {

  background: #fffdcd; 

  border-bottom: 1px solid #ffd909;

}











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

   Form Elements

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



form {

  padding: 20px 0;

}



label {

  float: left;

  width: 8em;

  padding-right: 1em;

  

}



input,

textarea,

select {

  padding: 2px;

  font: 400 1em arial, sans-serif;

  

  background: #FFF;

  border-width: 1px;

  border-style: solid;

  border-color: #ae8b73 #efddd0 #efddd0 #ae8b73;  

}





input:focus,

textarea:focus,

select:focus {  

  color: #42210B;

  background-color: #fffdcd;

}



input.button {

  padding: 1px 10px;



  font: bold 1em arial, sans-serif;

  cursor: pointer;



  color: #FFF;

  background-color: #3ca2a2;

  border-width: 1px;

  border-style: solid;

  border-color: #96e1e1 #117b7b #117b7b #96e1e1;

}









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

   Images

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



img.floatRight {

  margin: 5px 0px 10px 10px;  

}



img.floatLeft {

  margin: 5px 10px 10px 0px;

}



img.border {

  border: 4px solid #230F00;

}