/*****************************************************************************/
/*                           Site Global Styles                              */
/*****************************************************************************/


/*** Generic Typography ******************************************************/

body {
	font: 76% verdana, arial, helvetica, sans-serif;
	color: #333;
}

a, a:link {
	text-decoration: none;
	color: #00f;
}

a:visited {
  text-decoration: none;
  color: #00f;
}

a:active, a:hover {
  color: #f00;
	text-decoration: underline;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0.5em 0 0 0;
}

h1 {
	font-size: 2.0em;
}

h2 {
	font-size: 1.8em;
}

h3 {
	font-size: 1.6em;
}

h4 {
	font-size: 1.4em;
}

h5 {
	font-size: 1.2em;
}

h6 {
}


/*** Common styles ***********************************************************/

body { 
	margin: 0;
	padding: 0;
	color: #fff;
  background: #030 url(../Images/Header/bgHeader.gif) repeat-x;
}

img {
  border-width: 0;
}

.page-outer {
  width: 1000px;
  margin: 0 auto;
}

.inline-list {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

.inline-list li {
  display: inline;
  padding: 0 0.6em;
}

.inline-lList li.first {
  padding-left: 0;
}

.inline-list li.last {
  padding-right: 0;
}

.centered-list-outer {
  float: left;
  position: relative;
  left: 50%;
}

.centered-list {
  position: relative;
  left: -50%;
}

.floatL {
  float: left;
}

.floatR {
  float: right;
}

.clear-fix {
  overflow: hidden;
  height: 0;
  clear: both;
}

/*--- Even-Width Column Layouts ---*/

.col-outer {
  width: 100%; /* makes IE5.5 happy, doesn't hurt anything else */
  overflow: hidden;
}

.col-outer .col {
  float: left;
}

.two-col-outer .col {
  width: 50%;
}

/* The odd value of the 3-column layout causes some variation in different 
browsers. Noteably, Safari 2 and Opera 9.5 ignore the decimal places and has 
a larger gap after the last column. */
.three-col-outer .col {
  width: 33.33%;
}

.four-col-outer .col {
  width: 25%;
}

.five-col-outer .col {
  width: 20%;
}

.col-inner {
  margin: 0.5em;
}


/*** Header ******************************************************************/

#header {
  position: relative;
  overflow: hidden;
  min-height: 131px; /* header background image height */
  color: #333;
}

#header img {
  vertical-align: top;
}

#header .app-title {
  position: relative;
  top: 87px;
  right: 40px;
  font-size: 2.0em;
  font-weight: bold;
  text-transform: uppercase;
  color: #246537;
}

#header .left {
  float: left;
}

#header .right {
  float: right;
  padding: 0 40px 0 0;
}

#header .bookmark-area {
  padding: 30px 40px 0 0;
  text-align: right;
}

#header .bookmark-link {
  text-align: right;
}

#header .contact-info {
  padding-top: 6px;
  font-family: Arial, Sans-Serif;
  font-size: 1.2em;
  line-height: 1.5em;
  text-align: right;
  color: #336238;
}

#header .contact-info .phone {
  font-size: 2.1em;
  font-weight: bold;
}


/*** Body ********************************************************************/

#body-outer {
  margin: 55px 45px;
  margin-top: 20px;
}

.h1-outer {
  position: relative;
  overflow: hidden;
  width: 910px;
  height: 46px;
  background: url(../Images/Common/bgTitle.gif) no-repeat;
}

.h1-image {
  text-indent: -9999px;
  background-position: 20px 0;
  background-repeat: no-repeat;
}

h1.select-your-layout {
  background-image: url(../Images/Titles/Select-Your-Layout.gif);
}

h1.customize-your-specifications {
  background-image: url(../Images/Titles/Customize-Your-Specifications.gif);
}

h1.contact-information {
  background-image: url(../Images/Titles/Contact-Information.gif);
}

h1.complete {
  background-image: url(../Images/Titles/Complete.gif);
}

.h1-outer .back-button {
  float: right;
  margin-top: 5px;
  margin-right: 10px;
}

.h1-outer h1 {
  margin: 8px 0 0 20px;
  font-size: 2.0em;
  color: #ddd;
}

#main-content {
  clear: both;
  margin-top: 40px;
}

.content-box {
}

.content-box a,
.content-box a:link,
.content-box a:visited {
  color: #fff;
  text-decoration: underline;
}

.content-box .content {
  overflow: hidden;
  border: solid 3px #A65935;
  padding: 10px;
  background: #943D12;
}

.layout-button {
  float: left;
  padding: 13px;
  cursor: pointer;
}

.layout-button-selected {
  padding: 10px;
  border: solid 3px #A65935;
  background: #943D12;
  
  border-color: #ccc;
  background: #666;
}

.listitem-selected {
  font-weight: bold;
}

#main-content p {
  margin: 0;
  line-height: 1.4em;
}

.form-data,.form-data * {
  position: relative;
}

.form-data div {
  clear: left;
  overflow: hidden;
  margin-top: 5px;
}

.form-data .col {
  clear: none;
  margin-top: 0;
}

.form-data label, 
.form-data .label, 
.form-data .dropdown, 
.form-data .textbox, 
.form-data .radiobutton-list,
.form-data .checkbox {
  float: left;
}

.form-data .checkbox-list {
  display: block;
}

.form-data .checkbox-list label, 
.form-data .checkbox label, 
.form-data .radiobutton-list label, 
.form-data .radiobutton label,
.form-data .checkbox label {
  display: inline;
  float: none;
  clear: none;
  width: auto;
  text-align: left;
}

.form-data label, 
.form-data .label {
  display: block;
  clear: left;
  margin-right: 10px;
  padding-top: 0.25em;
  width: 50%;
  text-align: right;
}

.form-data .dropdown, 
.form-data .textbox {
  margin-right: 0;
  border: solid 1px #ccc;
}

.form-data .textbox {
  width: 14em;
  font-family: Arial, Sans-Serif;
  font-size: 1.0em;
}

.form-data .textbox-quantity {
  width: 2.0em;
}

.form-data .checkbox {
  clear: left;
}

.form-data .bottom {
  clear: both;
  padding-top: 20px;
  text-align: center;
}

.form-data .button {
}

.validation-summary {
  padding: 10px 50px;
  font-weight: bold;
  background: #ddd;
  border: solid 3px #666;
  border-top-width: 0;
}

.validation-summary ul {
  font-weight: normal;
}

/*--- Layout diagrams ---*/

.layout-form {
  position: relative;
}

.layout-form .measurement-group {
  position: absolute;
}

.layout-form .textbox-measurement {
  width: 1.6em;
  text-align: center;
}

.corner-layout-form .ada-stall-width {
  top: 8px;
  left: 145px;
}

.corner-layout-form .ada-stall-depth {
  top: 135px;
  left: 7px;
}

.corner-layout-form .stall-width {
  top: 8px;
  left: 315px;
}

.corner-layout-form .stall-depth {
  top: 135px;
  left: 350px;
}

.alcove-layout-form .ada-stall-width {
  top: 8px;
  left: 125px;
}

.alcove-layout-form .ada-stall-depth {
  top: 180px;
  left: 7px;
}

.alcove-layout-form .stall-width {
  top: 8px;
  left: 260px;
}

.alcove-layout-form .stall-depth {
  top: 120px;
  left: 230px;
}

.layout-selection-text {
  display: none;
  padding-top: 0.25em;
  font-weight: bold;
}

/*--- Select Layout Page ---*/

.select-layout-list {
  margin: 15px 0 40px 26px;
}

.select-layout-list li {
  padding: 0 15px;
}

.intro-box {
  clear: both;
  position: relative;
  padding: 40px 25px 20px 25px;
  font-size: 1.5em;
}

.intro-box, .intro-box * {
  text-align: center;
}

.content .title, .intro-box .title {
  font-size: 1.55em;
}

/*--- Customize Specifications Page ---*/

.current-layout {
  position: relative;
  float: left;
}

.specs-box {
  float: right;
  width: 340px;
}

/*--- Contact Information Page ---*/

#main-content .contact-box .content {
  padding: 10px 115px;
}

#main-content .contact-box .col {
  float: left;
  margin: 0 5px;
  width: 325px;
}

#main-content .contact-box .form-data label {
  display: inline;
  width: 35%;
  text-align: left;
}

.form-data .right-block {
  position: relative;
  margin-left: 35%;
  margin-top: 20px;
  padding-left: 10px;
}

/*--- Complete Page ---*/

.content-box .complete-box {
  padding: 70px;
  text-align: center;
}

.complete-box * {
  text-align: center;
}



/*** Footer ******************************************************************/

#footer {
  text-align: center;
}