/* Generic HTML Tag and Common Element Styles */

html {
  height: 100%;
}

body {
  background: #392311;
  font-family: verdana, helvetica, arial;
  color: #FFFFFF;
  height: 100%;
  margin: 0;
  padding: 0;
}

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

li {
  margin: 0;
  padding: 0;
}

#nav > li:hover {
  border-right: 3px solid #E3DFB8;
  padding: 0 9px 0 0 ! important;
}

#subnav {
  margin: 0;
  padding: 0;
}

#subnav > li:hover {
  background: url('../images/bullet.gif') no-repeat 3px 4px;
  margin: 0;
  padding: 0;
}

a {
  color: #FFFFFF;
  text-decoration: none;
  outline: 0;
}

a:hover {
  color: #E3DFB8;
  text-decoration: none;
  outline: 0;
}

a.current {
  color: #C7BE71;
}

#logo {
  background: url('../images/logo.png');
  position: absolute;
  top: 14px;
  left: 24px;
  width: 171px;
  height: 149px;
  z-index: 2;
}



/* Intro Page Styles */

.intro #wrapper {
  position: relative;
  background-color: #4C3321;
  background-position: 56px 0;
  background-repeat: repeat-y;
  border: solid #2E1F14;
  border-width: 0 1px;
  text-align: center;
  width: 998px;
  height: auto !important;
  min-height: 100%;
  margin: 0 auto;
}

.intro #container {
  position: relative;
  background-color: #4C3321;
  background-position: 56px 0;
  background-repeat: repeat-y;
  width: 998px;
  height: 680px;
  margin: 0 auto;
  text-align: left;
}

.intro #header {
  background: #4C3321;
  background-position: 56px 0;
  background-repeat: repeat-y;
  height: 94px;
}

.intro #content {
  height: 480px;
}

.intro #left-column {
  float: left;
  position: relative;
  top: 145px;
  width: 204px;
  height: 335px;
}

.intro #nav-column {
  background: #847672;
  position: relative;
  left: 56px;
  width: 108px;
  height: 335px;
}

.intro #nav {
  position: relative;
  top: 6px;
  width: 108px;
}

.intro #nav > li {
  position: relative;
  font-size: 12px;
  text-align: right;
  text-transform: uppercase;
  line-height: 25px;
  padding: 0 12px;
}

.intro #phone {
  position: relative;
  top: 105px;
  font-size: 12px;
  width: 108px;
  padding: 0 12px;
}

.intro #right-column {
  position: relative;
  height: 480px;
  margin-left: 204px;
}

.intro #slides {
  height: 145px;
  overflow-y: visible;
}

.intro #blurb {
  height: 335px;
  overflow-y: visible;
}

.intro .content {
  padding: 137px 32px 0;
}

.intro #copy h2 {
  color: #C3BD75;
  font-size: 11px;
  padding: 0;
}

.intro #copy p {
  padding: 0;
  margin: 12px 0;
}



/* Standard Page Styles */

.default #wrapper {
  position: relative;
  background-color: #4C3321;
  background-position: 56px 0;
  background-repeat: repeat-y;
  border: solid #2E1F14;
  border-width: 0 1px;
  text-align: center;
  width: 998px;
  height: auto !important;
  min-height: 100%;
  margin: 0 auto;
}

.default #container {
  position: relative;
  background-color: #4C3321;
  background-position: 56px 0;
  background-repeat: repeat-y;
  width: 998px;
  height: 680px;
  margin: 0 auto;
  text-align: left;
}

.default #header {
  background: #4C3321;
  background-position: 56px 0;
  background-repeat: repeat-y;
  height: 94px;
}

.default #content {
  height: 480px;
}

.default #left-column {
  float: left;
  position: relative;
  width: 313px;
  height: 480px;
}

.default #nav-column {
  position: relative;
  left: 56px;
  width: 108px;
  height: 480px;
}

.default #nav {
  position: relative;
  top: 132px;
  text-align: right;
  width: 108px;
}

.default #nav > li {
  position: relative;
  font-size: 12px;
  text-transform: uppercase;
  line-height: 25px;
  padding: 0 12px;
}

.default #subnav {
  position: absolute;
  top: 188px;
  left: 108px;
  font-size: 9px;
  text-align: left;
  text-transform: capitalize ! important;
  width: 150px;
}

.default #subnav > li {
  padding: 0 12px;
}

.default #phone {
  position: relative;
  top: 250px;
  font-size: 12px;
  width: 108px;
  padding: 0 12px;
}

.default #right-column {
  position: relative;
  height: 480px;
  margin-left: 313px;
}

.default #copy {
  overflow: visible;
  font-size: 11px;
  width: 342px;
  height: 480px;
  overflow-y: visible;
}

.default .content {
  padding: 137px 32px 0;
}

.default #copy h2 {
  color: #C3BD75;
  font-size: 11px;
  padding: 0;
}

.default #copy p {
  padding: 0;
  margin: 12px 0;
}



/* Intro Page Styles */

#intro #wrapper {
  background-image: url('../images/intro-body.gif');
}

#intro #container {
  background-image: url('../images/intro-body.gif');
}

#intro #header {
  background-image: url('../images/intro-body.gif');
}

#intro #content {
  
}

#intro #left-column {
  background: #4C3321;
  /*background: url('../images/intro-left.gif') repeat-y;*/
}

#intro #slides {
  background: url('../images/intro-header.gif') no-repeat 100% 0;
}

#intro #blurb {
  background: url('../images/intro-right.jpg') no-repeat 100% 0;
}



/* Welcome Page Styles */
/*
  #615C59 light
  #7598AF copy
*/

#welcome #wrapper {
  background-image: url('../images/welcome-body.gif');
}

#welcome #container {
  background-image: url('../images/welcome-body.gif');
}

#welcome #header {
  background-image: url('../images/welcome-header.gif');
}

#welcome #content {
  background: #4C3321;
}

#welcome #left-column {
  background: url('../images/welcome-left.jpg') no-repeat;
}

#welcome #right-column {
  background: url('../images/welcome-right.jpg') no-repeat 340px 0;
}

#welcome #copy {
  background: #7599AF url('../images/welcome-copy-header.gif') no-repeat 34px 48px;
}


/* About Us Page Styles */
/*
  #6A5A41 light
  #959371 copy
*/

#about #wrapper {
  background-image: url('../images/about-body.gif');
}

#about #container {
  background-image: url('../images/about-body.gif');
}

#about #header {
  background-image: url('../images/about-header.gif');
}

#about #content {
  background: #4C3321;
}

#about #left-column {
  background: url('../images/about-left.jpg') no-repeat;
}

#about #right-column {
  background: url('../images/about-right.jpg') no-repeat 340px 0;
}

#about #copy {
  background: #979470 url('../images/about-copy-header.gif') no-repeat 34px 48px;
}



/* Systems Page Styles */
/*
  #635140 light
  #847d6E  copy
*/

#systems #wrapper {
  background-image: url('../images/systems-body.gif');
}

#systems #container {
  background-image: url('../images/systems-body.gif');
}

#systems #header {
  background-image: url('../images/systems-header.gif');
}

#systems #content {
  background: #635140;
}

#systems #left-column {
  background: url('../images/systems-left.jpg') no-repeat;
}

#systems #right-column.theaters-column {
  background: url('../images/systems-right-theaters.jpg') no-repeat 340px 0;
}

#systems #right-column.lighting-column {
  background: url('../images/systems-right-lighting.jpg') no-repeat 340px 0;
}

#systems #right-column.distributed-column {
  background: url('../images/systems-right-distributed.jpg') no-repeat 340px 0;
}

#systems #right-column.automated-column {
  background: url('../images/systems-right-automated.jpg') no-repeat 340px 0;
}

#systems #copy {
  background: #887E6E url('../images/systems-copy-header.gif') no-repeat 34px 48px;
}



/* Process Page Styles */
/*
  #635140 light
  #847d6E  copy
*/

#process #wrapper {
  background-image: url('../images/process-body.gif');
}

#process #container {
  background-image: url('../images/process-body.gif');
}

#process #header {
  background-image: url('../images/process-header.gif');
}

#process #content {
  background: #865227;
}

#process #left-column {
  background: url('../images/process-left.jpg') no-repeat;
}

#process #right-column {
  background: url('../images/process-right.jpg') no-repeat 340px 0;
}

#process #copy {
  background: #F58025 url('../images/process-copy-header.gif') no-repeat 34px 48px;
}



/* Portfolio Page Styles */

#portfolio #wrapper {
  background-image: url('../images/portfolio-body.gif');
}

#portfolio #container {
  background-image: url('../images/portfolio-body.gif');
}

#portfolio #header {
  background-image: url('../images/portfolio-body.gif');
}

#portfolio #content {
  background: #7D6D53;
}

#portfolio #left-column {
  background: url('../images/portfolio-left.jpg') no-repeat;
}

#portfolio #right-column {
  background: url('../images/portfolio-current-image.jpg') no-repeat bottom;
}

#portfolio #strip {
  background: #C3C09D;
  height: 94px;
}

#portfolio #strip h1 {
  display: inline;
  line-height: 94px;
  margin: 0 24px;
  padding: 0;
}

#portfolio #thumbnails {
  float: right;
  width: 387px;
  margin-top: 11px;
}

#portfolio #strip .nav-controls {
  float: left;
}

#portfolio #strip .nav-controls,
#portfolio #strip .nav-controls a {
  width: 30px;
  height: 72px;
}

#portfolio #strip .nav-controls a {
  display: block;
  text-indent: -5000px;
}

#portfolio #strip .prev {
  background: url('../images/portfolio-arrow-left-inactive.gif') no-repeat;
}

#portfolio #strip .next {
  background: url('../images/portfolio-arrow-right-inactive.gif') no-repeat;
}

#portfolio #strip .prev.active a {
  background: url('../images/portfolio-arrow-left.gif') no-repeat;
}

#portfolio #strip .next.active a {
  background: url('../images/portfolio-arrow-right.gif') no-repeat;
}

#portfolio .thumbs {
  float: left;
  width: 320px;
  height: 72px;
}

#portfolio .thumbs li {
  float: left;
  background: #817C70;
  width: 72px;
  height: 72px;
  margin: 0 4px;
}

#portfolio .thumbs li img {
  border: 0;
  width: 72px;
  height: 72px;
}

#portfolio #current_image {
  background: url('../images/portfolio-current-image.jpg') no-repeat bottom;
}

#portfolio #current_image img {
  vertical-align: middle;
  width: 685px;
  height: 386px;
  border: 0;
}



/* Contact Us Page Styles */
/*
  # light
  #  copy
*/

#contact #wrapper {
  background-image: url('../images/contact-body.gif');
}

#contact #container {
  background-image: url('../images/contact-body.gif');
}

#contact #header {
  background-image: url('../images/contact-header.gif');
}

#contact #content {
  background: #85633D;
}

#contact #left-column {
  background: url('../images/contact-left.jpg') no-repeat;
}

#contact #right-column {
  background: url('../images/contact-right.jpg') no-repeat 340px 0;
}

#contact #copy {
  background: #EBAC64 url('../images/contact-copy-header.gif') no-repeat 34px 48px;
}

input[type="text"],
textarea {
  border: 0;
  width: 100%;
}

input[type="submit"],
input[type="reset"] {
  float: right;
  margin-left: 5px;
}

.error {
  color: #882222;
}





/* Each page has a section for its own styles */
/* This would be non-standard styles such as varying background images or colors, not dimensions that are consistent */