/* 
    Document   : styles
    Created on : July 30, 2010
    Author     : Casey McMullen
    Description:
        Purpose of the stylesheet follows.
*/

root {
  -moz-box-sizing: border-box;    /* Mozilla */
  box-sizing: border-box;         /* Opera   */
  display: block;
}

a {
  color: #0075c4;
  outline: none;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

body {
  background: #640000 url('../images/common/mfasBackground.jpg') repeat-x;
  color: #000000;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  height: 100%;
  margin: 0;
}

img {
  border: none;
  vertical-align: text-bottom;
}

.bodyText {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 24px;
  margin-bottom: 10px;
}

.bodyText a {
  color: #c12533;
  outline: none;
  text-decoration: none;
}

.bodyText a:hover{
  color: #f22f40;
  text-decoration: underline;
}

.button {
  cursor: pointer;
  line-height: 18px;
  margin: 2px;
  outline-style: none;
  padding: 2px 4px 2px 4px;
}

.errorMessage {
  color: red;
  line-height: normal;
  padding-bottom: 3px;
}

.selectMenu {
  background-color: #FFFFFF;
  border: 1px solid #990000;
  color: #000000;
  font-size: 14px;
  line-height: 18px;
  margin: 2px;
  padding: 2px 2px 3px;
  white-space: nowrap;
}

.tableFormRow {
  font-size: 14px;
  line-height: 20px;
}

.tableFormRow30 {
  font-size: 16px;
  line-height: 30px;
}

.textArea, .textArea_Wide {
  background-color: #FFFFFF;
  border: 1px solid #990000;
  color: #000000;
  font-size: 14px;
  height: 60px;
  line-height: 18px;
  margin: 2px;
  padding: 2px 2px 3px;
  text-align: left;
}

.textArea {
  width: 200px;
}

.textArea_Wide {
  width: 400px;
}

.textBox_Short, .textBox_Medium, .textBox_Long, .textBox_XLong {
  background-color: #FFFFFF;
  border: 1px solid #990000;
  color: #000000;
  font-size: 14px;
  line-height: 18px;
  margin: 2px;
  padding: 2px 2px 3px;
  text-align: left;
  white-space: nowrap;
}

.textBox_Short {
  width: 150px;
}

.textBox_Medium {
  width: 200px;
}

.textBox_Long {
  width: 250px;
}

.textBox_XLong {
  width: 350px;
}

.textRed {
  color: #990000;
}

.textRed_Small {
  color: #990000;
  font-size: 12px;
}

/* ============================================================================== */
/* Basic Page Construct DIV Ids                                                   */
/* ============================================================================== */
#wrapper {
  margin: 0 auto;
  overflow: hidden;
  width: 1024px;
}

#contentHeader {
  background: transparent url('../images/common/headerBackground.png');
  height: 80px;
  margin-top: 10px;
  min-height: 80px;
  position: relative;
  width: auto;
}

html>body #contentHeader {
  height: auto;         /* for non-IE */
}

#contentHeaderInner {
  overflow: hidden;
}

#navigation {
  background: #151515;
  clear: both;
  color: #F2F2F2;
  font-size: 18px;
  height: 25px;
  padding-top: 5px;
  text-align: center;
}

#content {
  /*background: #FFF7E3;*/
  /*background: #F9EDCF;*/
  background: #F9EDCF;
  clear: both;
  height: 425px;        /* for IE */
  min-height: 425px;    /* for non-IE */
  overflow: hidden;
  width: auto;
}

#contentInner {
  margin: 10px 20px 0 20px;
}

html>body #content {
  height: auto;         /* for non-IE */
}

#footer {
  color: #FFFFFF;
  float: left;
  font-size: 12px;
  line-height: 20px;
  margin: 0 auto;
  padding-bottom: 5px;
  padding-top: 5px;
  text-align: left;
  vertical-align: middle;
  width: 600px;
}

#footer a {
  color: #FFFFFF;
  text-decoration: none;
}

#footer a:hover {
  color: #FFFFFF;
  text-decoration: underline;
}

#wiregroovePower {
  color: #FFFFFF;
  float: right;
  font-size: 12px;
  line-height: 20px;
  margin: 0 auto;
  padding-top: 5px;
  text-align: right;
  width: 175px;
}

#wiregroovePower a {
  color: #FFFFFF;
  text-decoration: none;
}

/* ============================================================================== */
/* Data and Image display DIV Ids                                                 */
/* ============================================================================== */
#artRotator {
  float: left;
  height: 300px;
  position: relative;
  width: 410px;
}

#artRotator ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

#artRotator ul li {
  float: left;
  list-style: none;
  position: absolute;
}

#artRotator ul li img {
  background: #FFF;
  border: 1px solid #ccc;
  margin-left: 0;
  padding: 4px;}

#artRotator ul li.showFirstArt {
  z-index: 100
}

#artistRotator {
  float: left;
  height: 300px;
  position: relative;
  text-align: center;
}

#artistRotator ul {
  list-style-type: none;
  margin: 0;
  margin-top: 10px;
  padding: 0;
}

#artistRotator li {
  width: 270px;
}

#artistRotator ul li {
  float: left;
  list-style: none;
  position: absolute;
}

#artistRotator ul li img {
  background: #FFF;
  border: 1px solid #ccc;
  margin-left: 0;
  padding: 4px;
}

#artistRotator ul li.showFirstArtist {
  z-index: 100
}

#artistSearchByLetter {
  display: block;
  float: left;
  height: 25px;
  margin: 0 auto;
  text-align: center;
  width: 100%;
}

#artistSearchByLetter a {
  color: #C12533;
  display: block;
  outline: none;
  text-decoration: none;
}

#artistSearchByLetter a:hover {
  color: #F22F40;
  text-decoration: underline;
}

#artistSearchByLetter ul {
  margin: 0px;
  margin-left: 15px;
  margin-top: 5px;
}

#artistSearchByLetter li {
  float: left;
  font-size: 18px;
  list-style: none;
  margin: 0px;
  padding: 0px;
  padding-left: 10px;
  padding-right: 10px;
}

#contactForm {
  background-color: #F4D991;
  border: 1px #4A1312 solid;
  color:#000000;
  float: right;
  height: auto;
  margin: 0px 10px 10px 0px;
  min-height: 400px;
  width: 45%;
}

#imgRotator {
  float: left;
  height: 350px;
  position: relative;
  width: 300px;
}

#imgRotator ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

#imgRotator ul li {
  float: left;
  list-style: none;
  position: absolute;
}

#imgRotator ul li img {
  margin-left: 0;
}

#imgRotator ul li.showFirstImg {
  z-index: 100
}

#pageTitle {
  color: #4A1312;
  font-size: 28px;
  padding: 10px 0px 5px 10px;
  margin: 0px 10px 0px 10px;
}

#pageSubTitle {
  font-size: 20px;
  font-weight: bold;
  padding-top: 10px;
  margin-left: 10px;
  margin-bottom: 15px;
}

#sectionTitle {
  color: #4A1312;
  font-size: 20px;
  padding-bottom: 5px;
  margin: 0px 10px 0px 10px;
}

/* ============================================================================== */
/* Login page styles                                                              */
/* ============================================================================== */
#login, #loginError, #loginMessage {
  margin: 2em auto;
  width: 350px;
}

#login a {
  color: #C12533;
  font-size: 14px;
  margin-left: 20px;
  outline: none;
  text-decoration: none;
}

#login a:hover {
  color: #F22F40;
  text-decoration: underline;
}

#loginError {
  background-color: #FFEBE8;
  border: 1px solid red;
  border-radius: 3px;
  font-size: 14px;
  margin: 0 0 16px 8px;
  padding: 12px;
  -moz-border-radius: 3px;
  -khtml-border-radius: 3px;
  -webkit-border-radius: 3px;
}

#loginForm {
  background: #FFFFFF;
  border: 1px solid #C9B0B0;
  border-radius: 5px;
  box-shadow: rgba(200,200,200,1) 0 4px 18px;
  font-weight: normal;
  margin-bottom: 0;
  margin-left: 8px;
  padding: 16px 16px 40px 16px;
  width: 97%;
  -moz-border-radius: 11px;
  -moz-box-shadow: rgba(200,200,200,1) 0 4px 18px;
  -khtml-border-radius: 11px;
  -khtml-box-shadow: rgba(200,200,200,1) 0 4px 18px;
  -webkit-border-radius: 11px;
  -webkit-box-shadow: rgba(200,200,200,1) 0 4px 18px;
}

#loginForm input {
  color: #555;
}

#loginForm label {
  color: #777;
  font-size: 16px;
  margin-left: 5px;
}

#loginForm .textBox_Medium {
  font-size: 20px;
  margin-bottom: 10px;
  margin-right: 6px;
  margin-top: 2px;
  padding: 3px;
  width: 97%;
}

#loginForm .button {
  float: right;
  font-weight: bold;
  margin-top: -4px;
  padding: 3px 10px;
}

#loginForm .rememberMe {
  font-weight: normal;
  float: left;
  margin-top: 0px;
}

#loginMessage {
  background-color: #FFFBCC;
  border: 1px solid #CFAD66;
  border-radius: 3px;
  font-size: 14px;
  margin: 0 0 16px 8px;
  padding: 12px;
  -moz-border-radius: 3px;
  -khtml-border-radius: 3px;
  -webkit-border-radius: 3px;
}

/* ============================================================================== */
/* Navigation menu bar styles                                                     */
/* ============================================================================== */
#navbar {
  color: #C5A961;
  display: block;
  font-size: 18px;
  margin: 0 auto;
  width: 825px;
}

#navbar a:hover {
  color: #F4D991;
}

#navbar li {
  float: left;
  list-style: none;
}

#navbar li a {
  color: #C5A961;
  display: block;
  padding-left: 20px;
  padding-right: 20px;
  text-decoration: none;
}

#navbar li ul {
  border: 1px solid #C5A960;
  display: none;                                /* keeps the submenu items from displaying by default */
}

#navbar li:hover ul, #navbar li.hover ul {      /* this section controls the positioning of the submenu as an entire block */
  background-color: #151515;
  display: block;
  font-size: 18px;
  margin: 0 0 0 20px;
  padding: 0;
  position: absolute;                           /* keeps drop down menu from shoving everything else down */
  width: auto;                                  /* width to help Opera out */
  z-index: 500;                                 /* brings the menu items "to the front" */
}

#navbar li:hover li, #navbar li.hover li {
  float: none;
}

#navbar li:hover li a, #navbar li.hover li a {
  border-bottom: 1px solid #C5A960;
  color: #C5A960;
  padding: 3px 10px 3px 10px;
  text-align: left;
}

#navbar li li a:hover {
  color: #F4D991;
}

/* ============================================================================== */
/* Registration page styles                                                       */
/* ============================================================================== */
#registration, #registrationError, #registrationMessage {
  margin: 2em auto;
  width: 580px;
}

#registration a {
  color: #C12533;
  font-size: 14px;
  margin-left: 20px;
  outline: none;
  text-decoration: none;
}

#registration a:hover {
  color: #F22F40;
  text-decoration: underline;
}

#registrationError {
  background-color: #FFEBE8;
  border: 1px solid red;
  border-radius: 3px;
  font-size: 14px;
  margin: 0 0 16px 8px;
  padding: 12px;
  -moz-border-radius: 3px;
  -khtml-border-radius: 3px;
  -webkit-border-radius: 3px;
}

#registrationForm {
  background: #FFFFFF;
  border: 1px solid #C9B0B0;
  border-radius: 5px;
  box-shadow: rgba(200,200,200,1) 0 4px 18px;
  font-weight: normal;
  margin-bottom: 0;
  margin-left: 8px;
  padding: 16px 16px 40px 16px;
  width: 97%;
  -moz-border-radius: 11px;
  -moz-box-shadow: rgba(200,200,200,1) 0 4px 18px;
  -khtml-border-radius: 11px;
  -khtml-box-shadow: rgba(200,200,200,1) 0 4px 18px;
  -webkit-border-radius: 11px;
  -webkit-box-shadow: rgba(200,200,200,1) 0 4px 18px;
}

#registrationForm input {
  color: #555;
}

#registrationForm label {
  color: #777;
  font-size: 16px;
  margin-left: 5px;
}

#registrationForm .textBox_Short, .textBox_Medium, .textBox_Long, .textBox_XLong {
  /*font-size: 20px;*/
  margin-right: 6px;
  padding: 3px;
}

#registrationForm .button {
  float: right;
  font-weight: bold;
  margin-top: -4px;
  padding: 3px 10px;
}

#registrationMessage {
  background-color: #FFFBCC;
  border: 1px solid #CFAD66;
  border-radius: 3px;
  font-size: 14px;
  margin: 0 0 16px 8px;
  padding: 12px;
  -moz-border-radius: 3px;
  -khtml-border-radius: 3px;
  -webkit-border-radius: 3px;
}
