/*********************** HTML AND BODY *******************/
html, body {
font-family: 'PT Sans', sans-serif;
background: #FFFFFF;
font-weight:400;
height:100%;
}

/********************** RESET ALL VALUES *********************/
* {
margin:0;
padding:0;
}

/************************* HEADERS ***************************/
h1,
h2,
h3,
h4,
h5,
h6 {
font-weight:400;
}

/********************* IE HTML5 TAGS FIX *********************/
article, 
aside, 
figure, 
footer, 
header, 
hgroup,
menu, 
nav, 
section {
display: block; 
}

/**************************** IFRAME STYLING ****************/
.iframe { 
width: 100%;
float: left;
}

/*************************** LEFT ****************************/
.left { float: left; }

/************************* RIGHT *****************************/
.right { float: right; }

/************************ BUTTON STYLING **********************/
.button {
cursor: pointer;
border:0;
background: #567D0C;
background: -webkit-gradient(linear, left top, left bottom, from(#8CBD2F), to(#567D0C));
background: -webkit-linear-gradient(top, #8CBD2F, #567D0C);
background: -moz-linear-gradient(top, #8CBD2F, #567D0C);
background: -ms-linear-gradient(top, #8CBD2F, #567D0C);
background: -o-linear-gradient(top, #8CBD2F, #567D0C);
padding: 5px 25px 5px 25px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
-moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
box-shadow: rgba(0,0,0,1) 0 1px 0;
text-shadow: rgba(0,0,0,.4) 0 1px 0;
color: #FFFFFF;
font-size: 21px;
text-decoration: none;
vertical-align: middle;
}
.button:hover {
background: #8CBD2F;
color: #FFFFFF;
}
.button:active {
background: #567D0C;
}

/************************ CLEARFIX ***********************/
.group:before,
.group:after {
content: "";
display: table;
} 
.group:after {
clear: both;
}
.group {
zoom: 1; /* For IE 6/7 (trigger hasLayout) */
}

/****************** CONTAINER - FOR STICKY FOOTER ***********/
.container { 
float: left; 
min-height: 100%; 
position: relative;
width:100%;
}

/********************** MAIN WRAPPER *************************/
.wrapper {
width: 100%;
float: left;
}

/****************** SUB WRAPPERS *****************/
.header-wrapper {
background: #2C2C2C;
}
.welcome-wrapper {
background: #2D2D2D;
}
.content-wrapper {
padding-bottom: 140px;
background: #FFFFFF;
}
.footer-wrapper {
position: absolute;
bottom: 0;
left: 0;
background: #262626;
}

/*********************** CENTERING CONTENT ***********************/
.header, 
.welcome, 
.note, 
.content, 
.footer {
width: 940px;
margin:0 auto;
}

/*********************** HEADER STYLING ***************************/
.header {
height: 85px;
line-height:85px;
border-bottom:1px solid #282828;
}

.logo {
float:left;
text-transform:uppercase;
color:#FFFFFF;
}

.menu {
float:right;
}
.menu ul {
list-style:none;
}
.menu ul li {
float:left;
}
.menu ul li a {
float:left;
padding:0 30px 0 30px;
text-align:center;
text-transform:uppercase;
text-decoration:none;
color:#FFFFFF;
display: block;
}
.menu ul li a:hover, 
.selected-menu-item {
line-height:82px;
color:#FFFFFF;
background-color:#282828;
border-top:3px solid #8CBD2F;
}

/****************** WELCOME STYLING (BELOW HEADER) ******************/
.welcome {
height:433px;
background:url(../../uploads/demo_images/1/8a50aa970e49dd895a965a6227f4aca7.png) no-repeat;
}
.welcome .welcome-left {
float:left;
width:520px;
padding:50px 0 0 0;
color:#FFFFFF;
}
.welcome .welcome-left h2 span {
    color: #8CBD2F;
}
.welcome .welcome-left p {
margin: 30px 0 30px 0;
width: 360px;
}
.welcome .welcome-right {
float:left;
height:100%;
width:440px;
}

/************************ NOTE STYLING ***********************/
.note {
height: 170px;
}
.note .note-slider {
height: 105px;
display: block;
margin-top: 30px;
background: #F9F9F9;
border-bottom: 1px solid #e3e3e3;
}
.note .note-slider .note-text {
list-style:none;
margin-top:28px;
text-align:center;
width:820px;
float:left;
overflow: auto;
color: #2C2C2C;
}
.note .note-slider .note-text h1{
font-weight:bold;
}
.note .note-slider .note-text p{
font-size:13px;
}
.note .note-slider .note-button {
cursor: pointer;
color:#fff;
font-size:30px;
border:0;
width:60px;
height:100%;
background: #8CBD2F;
}

/********************** CONTENT STYLING *************************/
.content {
margin-top:40px;
color: #2C2C2C;
}
.content .content-left {
float:left;
width:510px;
}
.content .content-left p {
    margin:30px 0;
}
.content .content-right {
float:right;
width:407px;
}
.content .content-right .img-container {
padding:5px;
width:407px;
height:223px;
background:url(../img/img-container.png) no-repeat;
margin:30px 0;
float:left;
}
.content .content-full p {
    margin:30px 0;
}

/********************** FORM STYLING ************************/
.form ul{
list-style-type: none;
list-style-position: outside;
margin: 0px;
padding: 0px; 
}
.form li {
padding: 16px 5px 5px 5px;
position: relative; 
}
.form h3 {
margin: 0px;
display: inline;
color: #555555; 
}
.form .required_notification {
color: #d45252;
margin: 5px 0 0 0;
display: inline;
float: right; 
}

.form input:focus { outline: none; }

.form label {
width: 250px;
margin-top: 3px;
display: inline-block;
float: left;
padding: 3px;
color: #555; 
}
.form input, .form textarea{
width: 350px;
padding: 5px 7px; 
}
.form input {
height:20px;
}
.form textarea {
height:200px;
}
.form input[type="text"], 
.form input[type="email"], 
.form input[type="password"], 
.form textarea {
border: 1px solid #aaa;
box-shadow: 0px 0px 3px #ccc, 0 10px 15px #eee inset;
border-radius: 2px;
-moz-transition: padding .25s;
-webkit-transition: padding .25s;
-o-transition: padding .25s;
transition: padding .25s;
padding-right: 30px; 
} 
.form input:focus, 
.form textarea:focus {
background: #fff;
border: 1px solid #555;
box-shadow: 0 0 3px #aaa;
padding-right: 70px; 
} 
.form input:required, 
.form textarea:required { 
background: #fff url('../img/red_asterisk.png') no-repeat 98% center; 
}

.form input:required:valid, 
.form textarea:required:valid {
background: #fff url(../img/valid.png) no-repeat 98% center;
box-shadow: 0 0 5px #5cd053;
border-color: #28921f;
}

.form input:focus:invalid, 
.form textarea:focus:invalid {
background: #fff url(../img/invalid.png) no-repeat 98% center;
box-shadow: 0 0 5px #d45252;
border-color: #b03535
}

.form select {
outline: none;
width: 245px; 
}
.form button { margin-left:510px; }
.form select option { 
outline: none; 
}

.form .form_hint {
background: #d45252;
border-radius: 3px 3px 3px 3px;
color: white;
margin-left:8px;
padding: 1px 6px 4px;
z-index: 999;
position: absolute;
display: none;
}

.form .form_hint::before {
content: "\25C0";
color:#d45252;
position: absolute;
top:1px;
left:-6px;
}

.form input:focus + .form_hint { display: inline;}
.form input:required:valid + .form_hint { background: #28921f; }
.form input:valid + .form_hint { background: #28921f; }
.form input:required:valid + .form_hint::before { color:#28921f; }
.form input:valid + .form_hint::before { color:#28921f; }

/*************************** FOOTER STYLING *******************/

.footer {
height:100%;
line-height:80px;
color: #C3C3C3}
.footer a {
text-decoration: none;
color: #8CBD2F}