/* MAIN STRUCTURE */

* { 
 padding: 0; 
 margin: 0; 
}
body {
 font-family: Trebuchet MS, Verdana, arial, sans-serif; 
 font-size: 13px;
 background: #B29269 url(../images/bg.gif) repeat;
 color: #666666;
 line-height: 175%;
 letter-spacing: 1px;
}
#container { 
 margin: 20px auto 50px auto;
 padding: 5px;
 width: 950px;
 background: #ffffff;
 min-height: 750px;
 height: 100%;
}
#header {
 width: 100%;
 margin: 0px 0px 0px 0px;
 background: #5C3F1C;
 height:100%;
}
#content_container { 
 clear: both;
 padding: 10px 0 0 0;
 background: #ffffff;
 border-top: 1px solid black;
 height: 100%;
}
#left_column { 
 clear:both;
 background: #ffffff;
 margin: 0 7px 0 0 ;
 height: 100%;
 float: left;
}
#right_column { 
 background: #ffffff;
 margin: 0 0 0 7px;
 height: 100%;
 float: right;
 display: inline;
 height: 100%;
}
#main_content {
 float: left;
 background: #ffffff;
 margin: 0px 100px 10px 100px;
 padding: 0 5px;
 height: 100%;
 display: inline;
}
#footer {
 clear:both;
 background: url(../images/texture.jpg) repeat;
 margin: 0px 0px 0px 0px;
 color:#fff;
 text-align: center;
 padding: 20px 0;
}
#navigation {
 clear:both;
 height:30px;
 letter-spacing: 2px;
 text-align: center;
 background: #fff;
 height: 100%;
}
#navigation a{
 text-decoration: none;   
 padding: 0px 50px; 
 font-size: 18px;   
 color: black;
 font-weight: normal;
 line-height:25px;
} 




/* BASIC */

h1 {
 font-size: 20px;
 color: #5C3F1C;
 letter-spacing: 3px;
 line-height: 175%;
 font-weight: normal;
}
h2 {
 font-size: 20px;
 color: #5C3F1C;
 letter-spacing: 3px;
 line-height: 175%;
 font-weight: normal;
}
h3 {
 font-size: 14px;
 color: #5C3F1C;
 letter-spacing: 2px;
 line-height: 175%;
}
h4 {
 font-size: 14px;
 color: #5C3F1C;
 letter-spacing: 2px;
 line-height: 175%;
}
h5 {
 font-size: 12px;
 color: #5C3F1C;
 letter-spacing: 2px;
 line-height: 175%;
}
h6 {
 font-size: 12px;
 color: #5C3F1C;
 letter-spacing: 2px;
 line-height: 175%;
}
a:link {
 FONT-WEIGHT: bold; 
 FONT-SIZE: 12px; 
 COLOR: #5C3F1C; 
 TEXT-DECORATION: underline;
 letter-spacing: 2px;
}
a:hover {
 FONT-WEIGHT: bold; 
 FONT-SIZE: 12px; 
 COLOR: #5C3F1C; 
 TEXT-DECORATION: underline;
 letter-spacing: 2px;
}
a:visited {
 FONT-WEIGHT: bold; 
 FONT-SIZE: 12px; 
 COLOR: #5C3F1C; 
 TEXT-DECORATION: underline;
 letter-spacing: 2px;
}
a:active {
 FONT-WEIGHT: bold; 
 FONT-SIZE: 12px; 
 COLOR: #5C3F1C; 
 TEXT-DECORATION: underline;
 letter-spacing: 2px;
}
p {
 font-size: 14px;
}
b {
 color: #5C3F1C;
 letter-spacing: 2px;
 font-weight: normal;
}
.center{
 text-align: center;
}
img {
 border: 0px solid black;
 vertical-align:middle;
}
table{
display: inline;
float: left;
width: 100%;
}
th {
 padding: 5px;
 margin: 5px;
 background: #999999;
 color: #ffffff;
 font-size: 15px;
 text-align:left;
}
td {
 text-align:left;
 padding: 5px;
 margin: 5px;
 background: #f1f1f1;
 vertical-align: top;
}
.spacer{
 clear:both;
 height: 20px;
 width: 100%;
}
#filler {
 font-size: 24px;
 color: #F0E7DB;
}



/* MISC */

#box{
 clear: left;
 width:100%;
}
#box .header_text {
 border-top: 1px black solid;
 border-left: 1px black solid;
 border-right: 1px black solid;
 background: #D8D29F;
 FONT-WEIGHT: normal;
 padding:5px;
 color: black;
 font-size: 18px;
}
#box .content {
 margin: 0px 0px 15px 0px;
 padding: 5px;
 height: 100%;
 background: #ffffff;
 border-bottom: 1px black solid;
 border-left: 1px black solid;
 border-right: 1px black solid;
}
#box .image {
 border:0px solid black;
 display: block;
 margin-left: auto;
 margin-right: auto 
}
#highlight_box {
 width: 98%;
 float: left;
 padding: 5px;
 margin: 0 5px 5px 0;
 border: 1px #D8D29F solid;
 background: #F7F5E3;
}
#highlight_box .left{
 float: left;
 width: 25%;
}
#highlight_box .right{
 float: left;
 width: 70%;
 padding: 0 10px 10px 10px;
}
.left{
 float: left;
 width: 170px;
}
.right{
 float: left;
 padding: 0 10px 10px 10px;
}
.attention{
color: red;
font-size: 16px;
background: #fff;
text-align: center;
padding: 10px;
}
.tiny_text{
 font-size: 10px;
}
.border_bottom {
 clear: both;
 margin: 25px 0px 25px 0px;
 border-bottom: 1px dashed #CFBAA1;
}
#profile {
 font-size: 35px;
 color: #5C3F1C;
 letter-spacing: 4px;
 line-height: 175%;
}
#basic_critique_main{
 padding: 0 0 0 25px;
}
#song_options{
 background: #F0E7DB;
}
#song_options .padding{
 padding: 0 6px 0 2px;
}
.trees{
 padding: 5px;
 margin: 0 5px 5px 0;
 border: 1px #CFBAA1 solid;
 background: #F0E7DB;
}



/*FORMS */

.login_box input[type=text], .login_box input[type=password]{
 width: 60%;
}
#form_box {
 background: #d6e5f4;
 border: solid 1px #85b1de;
 padding: 7px; 
}
form {  /* set width in form, not fieldset (still takes up more room w/ fieldset width */
 margin: 0 auto;
 width: 100%; 
}
form fieldset {
  / * clear: both; note that this clear causes inputs to break to left in ie5.x mac, commented out */
 padding: 50px;        /* padding in fieldset support spotty in IE */
 margin: 0 auto;
 border:0px; 
}
form fieldset legend {
 font-size:25px; /* bump up legend font size, not too large or it'll overwrite border on left */
                 /* be careful with padding, it'll shift the nice offset on top of border  */
}
form .row{
clear:left;
padding: 2px;
}
form label { 
 display: block;  /* block float the labels to left column, set a width */
 float: left; 
 width: 275px; 
 padding: 0px; 
 margin: 0 10px 0 0; /* set top margin same as form input - textarea etc. elements */
 text-align: right; 
 font-size: 14px;
}
form input[type=text]{
 /* display: inline; inline display must not be set or will hide submit buttons in IE 5x mac */
 /* width: auto;      set width of form elements to auto-size, otherwise watch for wrap on resize */
 margin: 0 0 0 0px; /* set margin on left of form elements rather than right of label aligns textarea better in IE */
 width: 40%;
}
form input[type=password]{
 /* display: inline; inline display must not be set or will hide submit buttons in IE 5x mac */
 /* width: auto;      set width of form elements to auto-size, otherwise watch for wrap on resize */
 margin: 0 0 0 0px; /* set margin on left of form elements rather than right of label aligns textarea better in IE */
 width: 40%;
}
form input[type=file]{
 /* display: inline; inline display must not be set or will hide submit buttons in IE 5x mac */
 /* width: auto;      set width of form elements to auto-size, otherwise watch for wrap on resize */
 margin: 0 0 0 0px; /* set margin on left of form elements rather than right of label aligns textarea better in IE */
 width: 40%;
}
form input[type=checkbox]{
 /* display: inline; inline display must not be set or will hide submit buttons in IE 5x mac */
 width: auto;      /* set width of form elements to auto-size, otherwise watch for wrap on resize */
 margin: 0 0 0 0px; /* set margin on left of form elements rather than right of label aligns textarea better in IE */
}
form select{
 /* display: inline; inline display must not be set or will hide submit buttons in IE 5x mac */
 width: 30%;      /* set width of form elements to auto-size, otherwise watch for wrap on resize */
 margin:0 0 0 0; /* set margin on left of form elements rather than right of label aligns textarea better in IE */
}
form textarea {
 /* display: inline; inline display must not be set or will hide submit buttons in IE 5x mac */
 width: 85%;      /* set width of form elements to auto-size, otherwise watch for wrap on resize */
 margin: 0 7.5%; /* set margin on left of form elements rather than right of label aligns textarea better in IE */
 overflow: auto;
}
.button{
 padding: 7px 15px;
 color: #5C3F1C;
 letter-spacing: -1px;
 font-size: 18px;
 height: 50px;
}