/*
 * Color Scheme
 * Provided By: 
 * Daily Color Scheme: Mountain Dawn (http://beta.dailycolorscheme.com)
 */
.color-txt-dark
{
  color: #3F3F30;
}

.color-bg-dark
{
  background-color: #330000;
}

.color-bg-medium
{
  background-color: #670000;
}

.color-bg-light
{
  background-color: #A31B00;
}

.color-hl-dark{
  background-color: #C24400;
}

.color-hl-medium{
  background-color: #DD6100;
}

.color-txt-light
{
  color: #EFEFC1;
}

body{
  margin:0;
  padding:0;
  line-height: 1.5em;
  background-color: #A31B00;
  font-family: sans-serif;
}

#maincontainer{
  width: 840px; /*Width of main container*/
  margin: 0 auto; /*Center container on page*/
}

#topsection{
  height: 130px; /*Height of top section*/
  padding-top : 10px;
}

#contentwrapper{
  float: left;
  width: 100%;
}

#contentcolumn{
  margin-right: 200px; /*Set right margin to RightColumnWidth*/
  min-height : 500px;
}

/* 
  IE doesn't understand min-height above.  However, height behaves the 
  same as min-height in IE except as noted below.
  The following containts two hacks:
  - the star selector hack - only IE6 and under will parse this line
  - IE5 mac filter - stop IE5 mac from parsing this line since height
    is not implemented correctly.
*/

/* Backslash Hack hides rule from IE5-Mac \*/
* html #contentcolumn {height:1%};
/* End IE5-Mac hack */

#contentcolumn h1{
  font-style : italic; 
  font-weight : bold;
  font-size : 110%;
  color : #DD6100;
}

#contentcolumn a:link{
  text-decoration : underline;
  color : #EFEFC1;
}

#contentcolumn a:visited{
  color : #EFEFC1;
}

#contentcolumn a:hover{
  color : #DD6100;
}

#contentfeed h1{
  font-style : italic; 
  font-weight : bold;
  font-size : 110%;
  color : #DD6100;
  clear : both;
}

#rightcolumn{
  float: left;
  width: 200px; /*Width of right column*/
  margin-left: -200px; /*Set left margin to -(RightColumnWidth) */
  text-align: center;
}

#footer{
  clear: left;
  height: 40px; /*Height of footer*/
  width: 100%;
  font-size:60%;
  background: black url("/images/footer-bg.gif") repeat-x bottom;
  padding : 10px 0;
  color : #3F3F30;
}

.innertube{
margin: 10px; /*Margins for inner DIV inside each column (to provide padding)*/
margin-top: 0;
}

.centertext{
  text-align : center;
}
.introimagecontainerhome {
  float : left;
  width : 290px;
}
.introimagecontainerservices {
  float : left;
  width : 240px;
}
.introimagecontaineraboutme {
  float : left;
  width : 220px;
}
.introimagehome {
  float : left;
  width : 270px;
}
.introimageservice {
  float : left;
  width : 220px;
}
.introimageaboutme {
  float : left;
  width : 200px;
}
.intro{
  clear : both;
  min-height : 180px;
}

.advert {
  padding-bottom:20px;
}

.separator {
  text-align: center;
}	

/* 
 * Sliding Doors Tabs Menu Technique
 * Modified from codes and examples provided by 
 * Dynamic Drive CSS Library (http://www.dynamicdrive.com/style/)
 * A List apart (http://www.alistapart.com/articles/slidingdoors2/)
 */   
#slidetabsmenu {
  float:left;
  width:100%;
  font-size:80%;
  line-height:normal;
  background: url("/images/tab-bg.gif") repeat-x bottom;
  /* border-bottom: 1px solid gray; */
}

* html #slidetabsmenu{ /*IE only. Add 1em spacing between menu and rest of content*/
  margin-bottom: 1em;
}

#slidetabsmenu ul{
  list-style-type: none;
  margin:0;
  margin-left: 10px;
  padding:0;
}

#slidetabsmenu li{
  display:inline;
  margin:0;
  padding:0;
}

#slidetabsmenu a {
  float:left;
  background:url("/images/tab-left.gif") no-repeat left top;
  margin:0;
  padding:0 0 0 9px;
  text-decoration:none;
  border-bottom : 1px solid #330000
}

#slidetabsmenu a span {
  float:left;
  display:block;
  background:url("/images/tab-right.gif") no-repeat right top;
  padding:3px 14px 3px 5px;
  font-weight:bold;
  color : #C24400;
}

/* Commented Backslash Hack hides rule from IE5-Mac \*/
#slidetabsmenu a span {float:none;}
/* End IE5-Mac hack */

#slidetabsmenu a:hover span {
  color: #EFEFC1;
}

#home #nav_home a,
#services #nav_services a,
#aboutme #nav_aboutme a,
#testimonials #nav_testimonials a,
#gallery #nav_gallery a,
#resources #nav_resources a,
#contact #nav_contact a {
  background-position:0 -125px;
}

#home #nav_home a span,
#services #nav_services a span,
#aboutme #nav_aboutme a span,
#testimonials #nav_testimonials a span,
#gallery #nav_gallery a span,
#resources #nav_resources a span,
#contact #nav_contact a span {
  background-position:100% -125px;
  color: #DD6100;
}

#slidetabsmenu a:hover {
  background-position:0% -125px;
}

#slidetabsmenu a:hover span {
  background-position:100% -125px;
}
/*
 * Contact Info
 */
#contactform{
  color : #EFEFC1;
  border : 2px solid #DD6100;
}

#contactform legend {
  color : #DD6100;
}

/*
 * Resources
 */
.amazonproduct {
  float : left;
  width : 120px;
  text-align : center;
  font-size : 60%;
  line-height : 1.5;
}

.recommendation {
  clear : both;
  min-height : 180px;
}

.zine{
  float : left;
  width : 160px;
  text-align : center;
  font-size : 60%;
  line-height : 1.5;
}

/*
 * Gallery
 */
.portfolio_a {
  border: 2px solid #DD6100;
}

.portfolio_b {
  border: 2px solid #C24400;
}

/* 
 * Notifications and Errors
 */
#notice {
  border: 2px solid #DD6100;
  padding: 1em;
  margin: 2em;
  background-color: #EFEFC1;
  color: #DD6100;
  font: bold smaller sans-serif;
}

.fieldWithErrors {
  padding: 2px;
  background-color: red;
  display: table;
}

.formError {
  font: bold small-caps smaller sans-serif;
  padding-left: 3px;
  color: red;
}

#errorExplanation {
  width: 400px;
  border: 2px solid red;
  padding: 7px;
  padding-bottom: 12px;
  margin-bottom: 20px;
  background-color: #EFEFC1;
  color: #3F3F30;
}

#errorExplanation h2 {
  text-align: left;
  font-weight: bold;
  padding: 5px 5px 5px 15px;
  font-size: 12px;
  margin: -7px;
  background-color: red;
}

#errorExplanation p {
  color: black;
  margin-bottom: 0;
  padding: 5px;
}

#errorExplanation ul li {
  font-size: 12px;
  list-style: square;
}

div.uploadStatus {
  margin: 5px;
}

/*
 * Progress Bar (not yet used)
 */
div.progressBar {
  margin: 5px;
}

div.progressBar div.border {
  background-color: #fff;
  border: 1px solid grey;
  width: 100%;
}

div.progressBar div.background {
  background-color: #333;
  height: 18px;
  width: 0%;
}