html {
    overflow: -moz-scrollbars-vertical;
	background: #000 url(/images/bk.png) repeat 0 0;
}

body, div, li, h1, h2, h3, p, img, dl, dt, dd, fieldset {
	margin: 0;
	padding: 0;
}

body {
    font: 13px/1.231 Arial, Helvetica, sans-serif;
    color: #fff;
	*font-size: small;
	*font: x-small;
	text-align: center;
}

h1, h2 {
	font-size: 100%;
	font-weight: normal;
}

img { border: 0; }

/*li { list-style: none; }*/

p {
    /*text-align: right;*/
    font-size: 93%;
}

a {
    color: #5b99cc;
    outline:none;
}

#wrapper {
    position: relative;
    width: 930px;
    height: 712px;
    margin: 20px auto 0 auto;
    padding: 6px 16px 0 8px;
    text-align: left;
    background: transparent url(/images/frame1.png) no-repeat 0 0;
    overflow: hidden;
}

#header {
    width: 930px;
    height: 96px;
    background: url(/images/header.jpg) no-repeat 0 0;
}

#header img {
    margin: 22px 0 0 5px;
}

#nav {
    height: 19px;
    background:  url(/images/nav2.jpg) no-repeat 0 0;
    margin: 0;
    padding: 7px 0 0 12px;
}

#nav ul {

}

#nav li {
    float: left;
    list-style: none;
}

#nav a {
    display: inline;
    float: left;
    margin-right: 15px;
    height: 18px;

    text-indent: -9999px;

}

#nav a:hover {
    background-position: 0 -19px;
}

a.home {
    width: 36px;
    background: url(/images/nav/home.png) no-repeat 0 0;
}

a.roll-up {
    width: 111px;
    background: url(/images/nav/roll-up.png) no-repeat 0 0;
}

a.iron-works {
    width: 88px;
    background: url(/images/nav/iron-works.png) no-repeat 0 0;
}

a.emergency {
    width: 87px;
    background: url(/images/nav/emergency.png) no-repeat 0 0;
}
a.gallery {
    width: 66px;
    background: url(/images/nav/gallery.png) no-repeat 0 0;
}
a.references {
    width: 87px;
    background: url(/images/nav/references.png) no-repeat 0 0;
}
a.contact-us {
    width: 88px;
    background: url(/images/nav/contact-us.png) no-repeat 0 0;
}

.home #nav a.home,
.roll-up #nav a.roll-up,
.iron-works #nav a.iron-works,
.emergency #nav a.emergency,
.gallery #nav a.gallery,
.references #nav a.references,
.contact-us #nav a.contact-us {
    height: 13px;
    background-position: 0 -19px;
}

#content {
    width: 910px;
    height: 558px;
    padding: 10px;
    background: url(/images/bk2.jpg) no-repeat 0 0;
    line-height: 1.3em;
}

#main {
    float: left;
    width: 529px;
    height: 512px;
    padding: 20px;
    /*text-align: left;*/
    background: url(/images/main.png) no-repeat 0 0;
}

#main-big {
    width: 868px;
    height: 512px;
    padding: 20px;
    background: url(/images/bk4.png) no-repeat 0 0;
}

h1 {
    margin-bottom: 20px;
    font-weight: bold;
    text-transform: uppercase;
    color: #5b99cc;
     /* ff8824 5b99cc*/
}

p {
    margin-bottom: 20px;
}

#main p {
    margin-bottom: 35px;
}

#sidebar {
    float: right;
    width: 287px;
    height: 512px;
    padding: 20px;
    background: url(/images/sidebar.png) repeat-x 0 0;
}

.home #sidebar {
    position: relative;
}

/*
#sidebar img {
    margin-left: 31px;
}
*/

#sidebar p {
    margin-bottom: 0;
}

form li {
    list-style: none;
    margin-bottom: 15px;
}

form label {
    display: inline-block;
    width: 6em;
    vertical-align: top;
}

fieldset {
    border: none;
    /*border: 1px solid #5B5B5B;*/
}

#fade {
	position: absolute;
	left: 48px;
	top: 343px;
    width: 229px;
	height: 172px;
	/*margin: 20px 0 0 31px;*/
	overflow: hidden;
}

#fade img, img.gates {
	border: 2px solid #fff;
}


/* Roll-Up Gates */

.roll-up h1 {
    margin-bottom: 8px;
}

.roll-up li h1 {
    margin-bottom: 2px;
}

.roll-up p {
    margin-bottom: 8px;
}

.roll-up #left {
    float: left;
    width: 600px;
    overflow: hidden;
}

.roll-up #right {
    float: right;
    width: 245px;
    padding-top: 18px;
    text-align: center;
    overflow: hidden;
}

.roll-up #right h2 {
    margin-top: 2px;
    font-size: 93%;
    color: #5b99cc;
}

.roll-up #right div {
    margin-bottom: 15px;
}

/* Iron Works */

.iron-works #left {
    float: left;
    width: 550px;
    overflow: hidden;
}

.iron-works #right {
    float: right;
    width: 290px;
    padding-top: 18px;
    text-align: center;
    overflow: hidden;
}

.iron-works p {
    overflow: hidden;
}

.iron-works h1 {
    margin-bottom: 10px;
}

/* Gallery */

.gallery h1 {
    margin-bottom: 10px;
}

.gallery a {
    color: #5b99cc;
    text-decoration:none;
}

.gallery a:hover {
    color: #67a;
}

.gallery .caption {
    font-style: italic;
    color: #887;
}

.gallery .gallery_demo {
	width: 504px;
	margin: 0 0 0 184px;
	padding: 0;
}

.gallery .gallery_demo li {
	width: 64px;
	height: 48px;
	border: 2px solid #fff;
	margin: 0 2px 2px 2px;
	background: #000;
}

.gallery .gallery_demo li div {
	left: 240px
}

.gallery .gallery_demo li div .caption {
	font: italic 0.7em/1.4 georgia, serif;
}

.gallery #main_image {
	margin: 0 auto 0 auto;
	height: 313px;
	width: 500px;
	background: black;
}

.gallery #main_image img {
	margin-bottom: 10px;
	border: 2px solid #fff;
}

.gallery .nav {
	margin: 0;
	padding: 10px 0 5px 0;
	clear: both;
	font-size: 80%;
	letter-spacing: 3px;
	text-transform: uppercase;
	text-align: center;
}

.gallery .info {
	text-align: left;
	width: 500px;
	margin: 30px auto;
	border-top: 1px dotted #221;
	padding-top: 30px;
}

.gallery .info p {
	margin-top: 1.6em;
}

/* References */

.references ul {
    margin-top: 40px;
}

.rname {
    margin-bottom: 30px;
    text-align: right;
    font-style: italic;
}

/* Contact Us */

.contact-us form {
    margin: 30px 0 0 230px;
}



#awesomeform label {
	width: 70px; /* label width *//* label margin = (input left margin) - (label width) */
	margin-right: 10px; /* label margin */
}

#awesomeform label span {
	color: #900; /* color of required asterisk */
}
#awesomeform input, #awesomeform textarea, #awesomeform select,
#awesomeform .checks input, #awesomeform.checks input {
	margin-left: 80px; /* (label width) + (label margin) */
	width: 160px; /* subjective, only applies to non-checkbox or radio inputs */
}
#awesomeform textarea {
	width: 160px; /* subjective, recommend: (3/2)(input width) */
}
#awesomeform p.error {
	margin: 0 0 0 80px; /* (label width) + (label margin) **recommended */
	color: red;
	font-size:85%;
}

#awesomeform p.success {
    font-weight: bold;
    color: #5b99cc;
    margin: 0 0 0 80px;
}

#awesomeform .checks label, #awesomeform.checks label {
	margin-left: 90px; /* (label width) + 2(label margin) */
}

/*
	The following makes Internet Explorer 6.x play nicely.
	These fix the double float margin bug.
*/
* html #awesomeform .checks input, * html #awesomeform.checks input {
	margin-left: 105px;  /* (1/2)((label width) + (label margin)) */
}
* html #awesomeform .checks label, * html #awesomeform.checks label {
	margin-left: 210px; /* (label width) + (label margin) */
	height: 1em;
}


/*********************************************************************************
	DO NOT EDIT BELOW THIS LINE
*********************************************************************************/

#awesomeform legend {
	display: none;
}

#awesomeform label {
	float: left;
	text-align: right;
	padding-top: 0.2em;
	font-size: 1em;
}

#awesomeform input, #awesomeform textarea, #awesomeform select {
	display: block;
	margin-bottom: 0;
}

#awesomeform br {
	clear: left;
}

#awesomeform input[type="radio"], #awesomeform input[type="checkbox"],
#awesomeform input[type="hidden"] {
	/*
		Keeps Mozilla browsers (and others) from making the RADIO and CHECKBOXES too wide and/or tall.
		Also removes unnecessary borders from these browsers (They don't respond as expected)
	*/
	width: auto;
	height: 0.8em;
	border: 0;
}

#awesomeform input[type="hidden"] {
	display: none;
}

#awesomeform p.desc {
	display: block;
	position: relative;
	top: -1em;
	margin-bottom: 0em;
	font-style: italic;
	font-size: 0.9em;
}


/*
	The following section is for reversing the display of CHECKBOX and RADIO INPUTs.
	Surround the section of items with <fieldset class="checks"></fieldset> or <div class="checks"></div>.
	It is highly recommended to use FIELDSET over DIV when there are multiple items.
	In the section, the INPUT precedes the LABEL and the BR comes last (after the label).
*/
#awesomeform .checks label, #awesomeform.checks label {
	/*
		Overrides for previously defined stuff and changes.
		Left margin must be 10pixels more than "#awesomeform input, #awesomeform select" etc.
	*/
	float: none;
	width: auto;
	clear: none;
	display: block;
	text-align: left;
	height: 1.4em;
	padding-top: 0;
	margin-bottom: 0;
}

#awesomeform .checks label:after, #awesomeform.checks label:after, .checks label:after  {
	/*
		Makes the ":" not generated after the LABEL.
	*/
	content: "";
}

#awesomeform .checks input, #awesomeform.checks input {
	/*
		Left margin is the same value as "#awesomeform input, #awesomeform select" etc.
	*/
	float: left;
	text-align: right;
	width: auto;
}

/*
	End reverse checks/radios section
*/


/*
	I found my own IE CSS display bug. I call it the "IE sucks, so it redraws the top border all over the fieldset like a jerk bug."

#awesomeform input, #awesomeform textarea, #awesomeform select,
#awesomeform .checks input, #awesomeform .checks label,
#awesomeform.checks input, #awesomeform.checks label {
	margin-top: 0;
	margin-bottom: 0;
}
*/
* html #awesomeform br {
	/*
		Hooray! We have a fix!
		For some crazy reason, IE lets me style its BR tag.
	*/
	line-height: 1em;
	font-size: 0.5em;
}

#awesomeform #sendButton {
    font-family:arial;
    font-weight:normal;
    border:1px solid #707070;
    padding:2px;
    background:#333;
    color:#fff;
    width:120px;
    /*font-size:116%;*/
    text-transform:capitalize;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    cursor:pointer;
}



p.send-error, p.send-success {
	margin-top: 50px;
    font-weight: bold;
	text-align: center;
}

p.send-error, p.send-error a {
	color: red;
}

p.send-success a {
    color: #fff;
}
