/* Common elements */
select {
	max-width: 100%;
}

/* do not display 'UNPUBLISHED' text on unpublished nodes */
.unpublished {
	display: none;
}

/* Submit button */
.webform-client-form #edit-submit {
margin-bottom: 10px;
margin-top:10px;
border:0;
}

/* Do not display required asterick on checkboxes */
.webform-component-checkboxes .form-item label span{
	display:none;
}


/* gradient backgrounds */
.grey-to-white-form-gradient #content form{
background:url("../images/gradient.png") repeat-x center bottom transparent;

}

/* Overall */
p{
	margin: 10px 0;
}

#page {
	margin-bottom:20px;
}

.node-type-webform{
      /*	margin-bottom: 50px; */
}

/* Confirmation page */
.confirmation-layout-narrow .webform-confirmation{
	margin: 0 230px;
}

.confirmation-layout-medium .webform-confirmation{
	margin: 0 120px;
}

.confirmation-layout-wide .webform-confirmation{
	margin: 0 10px;
}


/* Left fields on Form 1 */
.form-1 .field-field-left-image{
	margin-top: 20px;
}

/*  Page Widths & Borders */
.form-2 #page-wrapper {
	width:800px;
}

.form-2 #content,
.form-2 .no-sidebars #content {
	margin-right:-800px;
	width:800px;
}

.form-3 #content,
.form-3 .no-sidebars #content {
	margin-right:-850px;
	width:850px;
}

.form-4 #content,
.form-4 .no-sidebars #content,
.form-5 #content,
.form-5 .no-sidebars #content {
	margin-right:-675px;
	width:675px;
}

.form-6 #content,
.form-6 .no-sidebars #content {
	margin-right:-980px;
	width:980px;
}

body.form-7 {
	background-color: #869AC3;
}

.form-7 #content,
.form-7 .no-sidebars #content {
	margin-right: -800px;
	width: 800px;
	background: url("../images/orange_point.png") no-repeat scroll 600px top white;
}

.form-7 #content .section {
	padding: 0 20px 0 40px;
}

.form-3 #page-wrapper {
	width:850px;
}

.form-3 #main-wrapper {
	border:1px solid #3070B0;
	padding-bottom:20px;
}

.form-4 #page-wrapper,
.form-5 #page-wrapper {
	width:675px;
}

.form-7 #page-wrapper {
	width: 800px;
	background-color: white;
}

/****** Headers ******/
#header {
	height:150px;
}

#no-header {
	height:20px;
}

.form-1 #header {
	background:url("../images/form1-header.jpg") no-repeat scroll left top #EAF0FE;
}

.form-2 #header {
	background:url("../images/form2-header.jpg") no-repeat scroll left top #EAF0FE;
}	

.form-3 #header {
	background:url("../images/form3-header.jpg") no-repeat scroll right top #EAF0FE;
	height: 250px;
	border-left:1px solid #3070B0;
	border-right:1px solid #3070B0;
}

.form-4 #header,
.form-5 #header {
	background:none;
	height: 100px;
}

.form-7 #header {
	height:150px;
	background:url("../images/blue_stripe_bg.png") repeat scroll left top #EAF0FE;
}

/****** Titles ******/
.title {
	text-align:center;
	width: 100%;
}

.form-1 .title,
.form-2 .title{
	padding-top: 80px;
}

 h1.title {
	font-family:Helvetica,Arial,sans-serif;
	font-size:3em;
	font-weight:normal;
	text-transform:uppercase;
}

.form-1 h1.title,
.form-2 h1.title {
	padding-top:80px;
}

.form-2 h1.title {
}

.form-3 .title{
	width: 600px;
	text-align: left;	
	float: left;
	padding-left: 10px;
}

.form-3 h1.title {
	color:white;
	font-size:32px;
}

.form-7 h1.title {
	padding-left: 40px;
	text-align: left;
	text-transform: none;
	color: white;
	width: 760px;
}

.form-7 .field-field-left-title {
	padding-left: 160px;
	height: 100px;
}

/****** Navigation Links ******/
/*TODO: These are references to hardcoded content, they may need adjustment.*/
.form-1 #form_nav_links,
.form-2 #form_nav_links {
	background-color:#3070B0;
	height:20px;
	margin-bottom:10px;
	text-align:center;
}

#form_nav_links a,
#form_nav_links a:hover,
#form_nav_links a:visited,
#form_nav_links a:active   {
	color:white;
	padding:0 20px;
}

.form-3 #form_nav_links {
	float:right;
	margin-top:10px;
}

.form-3 #form_nav_links a:visited,
.form-3 #form_nav_links a:hover,
.form-3 #form_nav_links a:active,
.form-3 #form_nav_links a {
	padding:0 10px;
}

/****** Form 1 Image ******/
/*TODO: A reference to hardcoded content, it may need adjustment.*/
.form-1  #form1_image {
	float:left;
	margin-top:10px;
	width:450px;
}

/****** Form 3 Long Title ******/
.form-3 .field-field-header-intro-text {
	font-size:25px;
	left:50px;
	line-height:30px;
	position:absolute;
	top:-200px;
	width:350px;
}

.form-7 .field-field-header-intro-text {
	background: url("../images/orange_grade_bg.png") repeat-x scroll left top #EAF0FE;
	height: 90px;
	left: 0;
	padding-left: 200px;
	position: absolute;
	top: -90px;
	width: 600px;
}

.form-7 .field-field-promo-image {
	left: 40px;
	position: absolute;
	top: -70px;
}

.form-7 .form-7-space-saver {
	width: 160px; 
	height: 100px; 
	float: left;
}

/***** Paragraph Content From Body Field *****/
/* TODO: This content would be easier to style if the whole body field's output was 
contained in its own div instead of sharing with the webform.  This content should 
probably be styled from its parent div level and then readjusted where necessary inside 
the form since at this point code in the body not contained in p tags may not be 
formatted correctly.*/
.form-1 .node .content p {
	padding:5px;
	width:440px;
}

/****** Form Intro & Form Layout ******/
/*TODO: The #form_intro rules are references to hardcoded content, they may 
need adjustment.  For instance the current bordering system could be improved 
by having a div containing both the form and form intro.*/
.form-1 #form_intro,
.form-3 #form_intro,
.form-1 .node .content form,
.form-3 .node .content form {
	float:right;
	padding:5px 10px;
	clear:both;
}

.form-5 .node .content form,
.form-6 .node .content form {
	float:right;
	padding:5px 10px;
	clear:both;
}



.webform-client-form {
	padding-left: 10px;
}

.form-1 #form_intro,
.form-1 .node .content form {
	width:470px;
}

.form-1 .node .content form{
	border-width: 2px;
	border-style: solid;
	border-color: lightgrey;
}

.form-2 .node .content form{
        border: 1px solid #3070B0;
}


/*This is a live rule*/
.form-3 #content form {
	border:3px outset #CCCCCC;
	background:white;
	margin-right:10px;
	width:375px;
}

.form-5 #content form,
.form-5 .field-field-form-intro,
.form-5 .field-field-form-outro {
	width:375px;
	padding:5px 10px;
}

.form-6 #content form,
.form-6 .field-field-form-intro,
.form-6 .field-field-form-outro {
	width:480px;
	padding:5px 10px;
}
	
.form-7 #content form {
	width: 300px;
	padding: 5px 10px;
	float: right;
	clear: both;
}

.form-7 #content form {
	border: 4px solid #E2E2E2;
}

.form-7 #content form,
.form-7 .field-field-form-intro,
.form-7 .field-field-form-outro {
	background: url("../images/grey_stripe_bg.png") repeat scroll left top #EAF0FE;
	margin-left: 20px;
}

.form-1 #form_intro,
.form-2 #form_intro,
.form-3 #form_intro {
	border-bottom:none;
	margin-top:10px;
}

.form-intro-top-border .field-field-form-intro{
	margin-top:10px;
}

.form-2 #form_intro {
	padding:10px;
}

.form-2 .node .content form {
	float:left;
	margin-top:0;
	padding:0 100px;
	width:598px;
}

.form-3 #form_intro {
	margin-top:-50px;
}

.form-3 #form_intro p {
	padding:5px;
	margin:0;
}

/****** Form Contents ******/
/*TODO: These are references to hardcoded content, they may need adjustment.*/
.form-1 .node .content form .form-item {
}

.form-2 .node .content form .form-item {
}

.node .content form label {
}

.form-3 .node .content form label {
	padding-left:5px;
}

.form-2 .node .content form input {
}

.form-1 .node .content form input.form-text {
	width:300px;
}

.form-3 .node .content form input.form-text {
	width:300px;
}

.form-5 .node .content form input.form-text {
	width:300px;
}

.form-6 .node .content form input.form-text {
	width:400px;
}

.form-7 .node .content form input.form-text {
	max-width: 100%;
	_width: 300px; /* Fix for IE6 extra width issue */
}

.form-7 .node .content form .form-select {
	*width: 300px; /*Fix for country overflow in IE6&7*/
}

.form-2 .node .content form input.form-submit
.form-3 .node .content form input.form-submit {
}

/*Shut off for button centering
.form-1 .node .content form input.form-submit {
	margin-right:5px;
}*/

.form-3 .node .content form input.form-submit {
	margin-right:15px;
}

/***** TODO: Code for hiding content.  May be unnecessary when content system 
is finished. *****/
.form-1 #form3_long_title,
.form-2 #form3_long_title {
	display:none;
}

.form-2 #form1_image,
.form-3 #form1_image {
	display:none;
}

.form-2 .node .content p {
	
}

/******Rules that have not been sorted and refactored. ******/
.form-1 .node .content .field-field-left-image {
	width:450px;
}

.form-1 .node .content .field-field-left-title,
.form-1 .node .content .field-field-left-copy {
	padding:0 5px;
	width:440px;
}

.form-3 .node .content .field-field-left-title,
.form-3 .node .content .field-field-left-copy {
	padding:0 5px;
	width:425px;
}

.form-5 .node .content .field-field-left-copy {
	width:280px;
	padding:5px 0px;
        *position: absolute;
        *top: 0;
}

.form-6 .node .content .field-field-left-copy {
	width:480px;
	padding:5px 0px;
}

.form-1 .field-field-form-intro,
.form-1 .field-field-form-outro
 {
	border:2px solid lightgrey;
	width:470px;
}

.form-2 .field-field-form-intro,
.form-2 .field-field-form-outro
{
	border: 1px solid #3070B0;
}

.form-3 .field-field-form-intro,
.form-3 .field-field-form-outro {
	border:3px outset #CCCCCC;
	width:375px;
	float:right;
	clear:both;
	padding:5px 10px;
	margin-right:10px;
	background-color:white;
}

.form-5 .field-field-form-intro,
.form-5 .field-field-form-outro {
	margin:0;
	float:right;
}

.form-6 .field-field-form-intro,
.form-6 .field-field-form-outro {
	margin:0;
	float:right;
}

.form-7 .field-field-form-intro,
.form-7 .field-field-form-outro {
	border: 4px solid #E2E2E2;
	width:300px;
	float:right;
	clear:both;
	padding:5px 10px;
}

.form-3 .field-field-form-intro {
	margin-top:-30px;
}

.form-main-top-border #content form {
	padding-top:10px;
}  

.form-main-bottom-border #content form {
}

.form-intro-top-border #content form{
	border-top-width:0px;
}

.form-outro-bottom-border #content form{
	border-bottom-width:0px;
}


.form-2 .field-field-form-intro,
.form-2 .field-field-form-outro {
        padding:5px 10px;
}


.form-1 .field-field-form-intro,
.form-1 .field-field-form-outro {
	float:right;
	padding:5px 10px;
	clear:both;
}

.form-1 .field-field-form-intro,
.form-2 .field-field-form-intro,
.form-3 .field-field-form-intro,
.form-7 .field-field-form-intro {
 
        border-bottom-width:0;
}

.form-1 .field-field-form-outro,
.form-2 .field-field-form-outro,
.form-3 .field-field-form-outro,
.form-7 .field-field-form-outro {

        border-top-width:0;
}


.form-1 .node .content .webform-component-checkboxes label {
	width:460px;
}

.form-1 .node .content .webform-component-checkboxes .form-checkboxes {
}

#edit-actions {
	margin-bottom:10px;
	text-align:center;
}

#content form {
}

/** WEBFORM COMPONENTS **/
.form-item {
	margin:0;
}

.webform-component, .webform-component-fieldset, .form-actions, .form-file {
	display:inline;
	float:left;
	width:100%;
	margin: 5px 0;
}

.webform-component-fieldset {
	border:0;
}

.form-submit {
	vertical-align:middle;
}

textarea {
	width:100%;
}

/** Get rid of the padding and margin around description fields **/
.form-1 .node .content .description p,
.form-2 .node .content .description p,
.form-3 .node .content .description p {
	margin:0;
	padding:0;
}

.description p{
	font-style:italic;
}

.confirmation-layout-wide #content, 
.confirmation-layout-medium #content, 
.confirmation-layout-narrow #content {
	background-image: none;
}	


/*FORM-8*/
.form-8 .background {
	height: auto;
	left: 0;
	min-height: 100%;
	min-width: 1000px;
	position: absolute;
	top: 0;
	width: 100%;
}

.form-8 #content {
	margin-top: 110px;
}

.form-8 #left-column {
	float: left;
	margin-right: 30px;
	width: 500px;
}

.form-8 #right-column {
	float: left;
	width: 300px;
}

.form-8 .trans-back {
	border-radius: 10px 10px 10px 10px;
	padding: 10px;
}

.form-8 #page-wrapper,
.form-8 #content {
	width: 840px;
}

.form-8 .webform-component {
	width: auto;
	float: left;
	margin: 0 0 0 0;
}

.form-8 input {
	max-width: 250px;
}

.form-8 .form-item label {
	font-weight: normal;
}

.form-8 .form-outro {
	clear: both;
}

.form-8 .form-radios label.option {
	margin-right: 0;
}

.form-8 fieldset {
	border: 1px solid black;
	width: 95%;
}

.form-8 .webform-component-webform_time,
.form-8 .webform-component-date,
.form-8 .webform-component-markup,
.form-8 .webform-component-file,
.form-8 .webform-component-grid,
.form-8 .webform-component-textarea {
	clear: both;
	width: 260px;
}

.form-8 .webform-component-textarea .grippie {
	width: 251px;
}

.form-8 .webform-component-select,
.form-8 .webform-component-number {
	margin-right: 5px;
}
