/**
 * Styles for Stonewater Control Systems MilCom
 * 
 * This file defines the main styles 
 * for Stonewater Control Systems MilCom.
 *
 * @author William Dodson | Outer Banks Design Works <http://obxdesignworks.com/> for MANOVERBOARD <http://manoverboard.com/>
 * @copyright Copyright (c) 2008 Stonewater Control Systems MilCom
 * @date 2008-10-11
 * @version 0.1.0
 * @site Stonewater Control Systems MilCom (http://milcom.stonewatercontrols.com/)
 * @media screen
 */

/**
 * Colors used for Stonewater Control Systems MilCom
 *
 * @colordef #638fe4 (blue)
 * @colordef #FE8800 (orange)
 * @colordef #F7FF00 (yellow)
 * @colordef #FF0900 (red)
 * @colordef #77FF00 (green)
 * @colordef #646571 (deep gunmetal gray)
 */

/**
 * @section Reset CSS
 * ======================================================================
 */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
 margin:0;
 padding:0;
 border:0;
 font-weight:inherit;
 font-style:inherit;
 font-size:100%;
 font-family:inherit;
 vertical-align:baseline;
}
body {
 line-height:1.5;
}
table {
 border-collapse:separate;
 border-spacing:0;
}
caption, td {
 text-align:left;
 font-weight:normal;
}
th {
 text-align:center;
 font-weight:bold;
}
table, td, th {
 vertical-align:middle;
}
blockquote:before, q:before {
 content:open-quote;
}
blockquote:after, q:after {
 content:close-quote;
}
blockquote, q {
 quotes:"" "";
}
a img {
 border:none;
}

/**
 * @section Typography
 * ======================================================================
 */
body {
 background-color: #646571;
 background-image: url('/img/body-tile-bg.png');
 background-position: center top;
 background-repeat: repeat-y;
 font-size: 75%;
 color: #000;
 font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
h1, h2, h3, h4, h5, h6 {
 font-weight:bold;
 color:#000;
 text-transform: uppercase;
}
h1 {
 font-size:3em;
 line-height:1;
 margin-bottom:0.5em;
}
h2 {
 font-size:2em;
 margin-bottom:0.75em;
}
h3 {
 font-size:1.5em;
 line-height:1;
 margin-bottom:.5em;
}
h4 {
 font-size:1.2em;
 line-height:1.25;
 margin-bottom:1.25em;
 height:1.25em;
}
h5 {
 font-size:1em;
 font-weight:bold;
 margin-bottom:1.5em;
}
h6 {
 font-size:1em;
 font-weight:bold;
}
h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {
 margin:0;
}
h2 a, h3 a, h4 a { 
 text-decoration: none; 
}
h2 a:hover, h3 a:hover, h4 a:hover { 
 background-color: inherit;
 color: #000;
 text-decoration: underline; 
}
p {
 margin:0 0 1.5em;
}
p img {
 float:left;
 margin:1.5em 1.5em 1.5em 0;
 padding:0;
}
p img.right {
 float:right;
 margin:1.5em 0 1.5em 1.5em;
}
a:link, a:visited, a:hover, a:active {
 color:#0077FF;
 text-decoration:underline;
}
a:focus, a:hover {
 background: #fff;
 color:#FE8800;
}
blockquote {
 margin:1.5em;
 color:#666;
 font-style:normal;
}
strong {
 font-weight:bold;
}
em {
 font-style:italic;
}
sup, sub {
 line-height:0;
}
abbr, acronym {
 border-bottom:1px dotted #999;
}
ul, ol {
 margin:0 1.5em 1.5em 1.5em;
}
ul {
 list-style-type: square;
}
ol {
 list-style-type: upper-roman;
}
dl {
 margin:0 0 1.5em 0;
}
dl dt {
 font-weight:bold;
}
dd {
 margin-left:1.5em;
}
table {
 margin-bottom:1.4em;
 width:100%;
}
th {
 font-weight:bold;
 background:#ccc;
}
th, td {
 padding:4px 10px 4px 5px;
}
tr.even td {
 background:#F7F7F7;
}
tfoot {
 font-style:italic;
}
caption {
 background:#eee;
}
/*Typographic classes*/
.center {
 text-align: center;
}
.small {
 font-size:.8em;
 margin-bottom:1.875em;
 line-height:1.875em;
}
.large {
 font-size:1.2em;
 line-height:2.5em;
 margin-bottom:1.25em;
}
.hide {
 display:none;
}
.quiet {
 color:#777;
}
.loud {
 color:#000;
}
.highlight {
 background:#F7FF00;
}
.added {
 background:#355903;
 color:#fff;
}
.removed {
 background:#FF0900;
 color:#fff;
}
.required {
 color:#FF0900;
}
.first {
 margin-left:0;padding-left:0;
}
.last {
 margin-right:0;padding-right:0;
}
.top {
 margin-top:0 !important;padding-top:0 !important;
}
.bottom {
 margin-bottom:0;padding-bottom:0;
}
.container {width:950px;margin:0 auto;}
.box {padding:1.5em;margin-bottom:1.5em;background:#F8F1D3;}
.box p {margin-bottom: 0; padding-bottom: 0;}
hr {background:#ddd;color:#ddd;clear:both;float:none;width:100%;height:.1em;margin:0 0 1.45em;border:none;}
hr.space {background:#fff;color:#fff;}
.clearfix:after, .container:after {content:".";display:block;height:0;clear:both;visibility:hidden;}
.clearfix, .container {display:inline-block;}
* html .clearfix, * html .container {height:1%;}
.clearfix, .container {display:block;}
.clear {clear:both;}

/**
 * @section Forms
 * ======================================================================
 */
label {
 cursor: pointer;
 font-weight:normal;
}
fieldset {
 border-style: none;
 padding:0;
 margin:0 0 1.5em 0;
}
legend {
 font-weight:bold;font-size:1.2em;
}
input.text, input.title, textarea, select {
 font-family: verdana, lucida, 'lucida grande', sans-serif;
 margin:0.5em 0;
 border:1px inset #999;
}
input.text:focus, input.title:focus, textarea:focus, select:focus {
 background: #FCFFB3;
 border-color:#000;
 font-weight: bold;
}
input.text, input.title {
 width:95%;
 padding:2px 1px;
}
input.title {
 font-size:1.5em;
}
textarea {
 width:390px;height:250px;padding:5px;
}
/*errors and notices*/
.error, .notice, .success {
 padding:.8em;
 margin-bottom:1em;
 border:2px solid #ddd;
 border-radius: 10px;/*maybe, someday, all browsers?*/
     -moz-border-radius: 10px; /* Mozilla browsers */
     -webkit-border-radius: 10px; /* Safari/Webkit browsers */
 box-shadow: 1px 1px 3px #777; 
     -moz-box-shadow: 1px 1px 3px #777;
     -webkit-box-shadow: 1px 1px 3px #777;
 display: block;
 font-weight: bold;
}
.error {
 background:#FF0900;
 color:#fff;
 border-color:#59030A;
}
.notice {
 background:#F7FF00;
 color:#000;
 border-color:#595103;
}
.success {
 background:#77FF00;
 color:#000;
 border-color:#355903;
}
.error.note, .notice.note, .success.note {
 padding: .8em .8em .8em 4.4em;
}
.error.note {
 background-color: #FF0900;
 background-image: url('/img/36px-icon-error.gif');
 background-position: .8em center;
 background-repeat: no-repeat;
}
.notice.note {
 background-color: #F7FF00;
 background-image: url('/img/36px-icon-warning.gif');
 background-position: .8em center;
 background-repeat: no-repeat;
}
.success.note {
 background-color: #77FF00;
 background-image: url('/img/36px-icon-success.gif');
 background-position: .8em center;
 background-repeat: no-repeat;
}
.error a {
 background-color: inherit;
 color:#fff;
}
.notice a {
 background-color: inherit;
 color:#000;
}
.success a {
 background-color: inherit;
 color:#000;
}

.required-field {
 background:#FF0900 !important;
 border-color: #fff !important;
 border-style: solid !important;
 border-width: 2px !important;
 color:#fff !important;
 font-weight: bold;
}

/**
 * @section Global
 * ======================================================================
 */
#wrapper {
 background-color: #fff;
 width:950px;
 margin:0 auto;
 padding: 0;
 position: relative;
}
/**
 * Override the hide class from typography
 * so the element is hidden and not removed from
 * the markup (benefits screen readers).
 *
 */
.hide {
 border-style: none;
 display: block;
 font-size: 0;
 height: 0;
 line-height: 0;
 margin: 0 0 0 -999em;
 padding: 0;
 width: 0;
}
.hide-all {display:none;}

/**/
#flashMessage {
 background-color: transparent;
 color: #fff;
 font-size:1.5em;
 font-weight: bold;
 height: 3em;
 left: 0;
 line-height:1;
 padding: .2em;
 position: absolute;
 text-align: center; 
 top: 0;
 width: 99%;
 z-index: 7;
}
.subtle-heading {
 font-size:1.2em;
 line-height:1.25;
 margin-bottom: .5em;
 height:1.25em;
 text-transform: none;
}
/*edit, delete, and view links*/
a.link-edit, a.link-delete, a.link-view, a.link-docdownload, a.link-add {
 background-position: left center;
 background-repeat: no-repeat;
 padding-left: 14px;
}
a.link-edit {
 background-image: url('/img/10px-icon-edit.gif');
}
a.link-delete {
 background-image: url('/img/10px-icon-delete.gif');
}
a.link-view {
 background-image: url('/img/10px-icon-view.gif');
}
a.link-docdownload {
 background-image: url('/img/10px-icon-docdownload.gif');
}
a.link-add {
 background-image: url('/img/10px-icon-add.gif');
}
p.link-downloadWP {
 background-color: #FE8800;
 background-image: url('/img/32px-icon-pdf.png');
 background-position: left center;
 background-repeat: no-repeat;
 font-size:1.5em;
 line-height:2;
 margin-bottom:1em;
 padding-left: 38px;
}

/**
 * @section Header
 * ======================================================================
 */
#header {
 background-color: #fff;
 height: 90px;
 padding: 0;
 width:870px;
}
#header h1 {
 background-color: #fff;
 height: 54px;
 left: 40px;
 margin: 0;
 padding: 0;
 position: absolute;
 top: 36px;
 width: 317px;
}
#header h1 a {
 background-color: inherit;
 color: #000;
 display: block;
 height: 54px;
 margin: 0;
 padding: 0;
 position: relative;
 text-decoration: none;
 width: 317px;
}
#header h1 a span {
 background-color: transparent;
 background-image: url('/img/logo.png');
 background-position: left top;
 background-repeat: no-repeat;
 cursor: pointer;/*IE/Opera fix*/
 height: 100%;
 position: absolute;
 width: 100%;
}
#header p#milcom-callout {
 background-color: #fff;
 height: 56px;
 margin: 0;
 padding: 0;
 position: absolute;
 right: 0;
 top: 29px;
 width: 458px;
}
#header p#milcom-callout em {
 background-color: #646571;
 color: #fff;
 display: block;
 height: 56px;
 margin: 0;
 padding: 0;
 position: relative;
 text-decoration: none;
 width: 458px;
}
#header p#milcom-callout span {
 background-color: transparent;
 background-image: url('/img/milcom-callout.png');
 background-position: left top;
 background-repeat: no-repeat;
 height: 100%;
 position: absolute;
 width: 100%;
}

/**
 * @section Section Heading
 * ======================================================================
 */
#section-heading {
 background-color: #FE8800;
 height: 126px;
 margin: 0 0 5px 0;
 padding: 18px 40px;
 width:870px;
}
#section-heading div {
 height: 105px;
 position: relative;
 overflow: hidden;
 width: 639px;
}
#section-heading div span {
 height: 100%;
 margin: 0;
 padding: 0;
 position: absolute;
 width:100%;
}
body#index #section-heading div span {
 background-image: url('/img/section-heading_home.png');
 background-position: top left;
 background-repeat: no-repeat;
}
body#thank-you #section-heading div span {
 background-image: url('/img/section-heading_thankyou.png');
 background-position: top left;
 background-repeat: no-repeat;
}
#section-heading h2 {
 font-size: 3em;
 line-height: 1;
 margin: 0;
}
#section-heading p {
 font-size: 1.5em;
 font-weight: bold;
 line-height: 1.2;
 margin: 0;
 text-transform: uppercase;
}
#section-heading p strong {
 color: #fff;
 display: block;
}

/**
 * @section Article
 * ======================================================================
 */
#article {
 background-color: #fff;
 float: left;
 margin: 0;
 padding: 1.5em 40px 0 40px;
 width: 510px;
}
body#index #article,
body#thank-you #article {
 background-image: url('/img/content-img_home.png');
 background-position: top left;
 background-repeat: no-repeat;
 padding: 192px 40px 0 40px;
}
#article h2 {
 font-size: 3em;
 line-height: 1;
 margin: 0 0 .5em 0;
}
#article form label {
 display: block;
 font-weight: bold;
 margin-top: .2em;
}

/**
 * @section Aside
 * ======================================================================
 */
#aside {
 background-color: #FE8800;
 float: right;
 margin: 0;
 padding: 1.5em 40px 1.5em 40px;
 width: 280px;
}
body#index #aside {
 padding: 0 40px 0 40px;
}
#aside h3 {
 color: #000;
}
#aside h3#aside-heading {
 background-color: #FE8800;
 height: 18px;
 margin: 0 0 9px 0;
 padding: 18px 0;
 position: relative;
 width: 292px;
}
#aside h3#aside-heading span {
 background-color: transparent;
 background-image: url('/img/aside-heading_register.png');
 background-position: left top;
 background-repeat: no-repeat;
 height: 100%;
 position: absolute;
 top: 0;
 width: 100%;
}
#aside a {
 color: #000;
}
#aside form dl dt {
 line-height: 1;
 margin: .3em 0 0 0;
 padding: 0;
}
#aside form dl dd {
 margin: 0 0 .2em 0;
 padding: 0;
}
#aside .required {
 color:#fff;
 font-weight: bold;
}

/**
 * @section Footer
 * ======================================================================
 */
#footer {
 background-color: #fff;
 clear: both;
 height: 36px;
 padding: 18px 40px 0 40px;
 width:870px;
}
#footer a {
 color: #000;
 text-decoration: none;
}