
@font-face {
    font-family: 'Ubuntu';
    src: url('../fonts/Ubuntu.eot');
    src: url('../fonts/Ubuntu-Regular.eot?#iefix') format('embedded-opentype'), url('../fonts/Ubuntu-Regular.woff2') format('woff2'), url('../fonts/Ubuntu.woff') format('woff'), url('../fonts/Ubuntu.ttf') format('truetype');
}
@font-face {
    font-family: 'UbuntuBold';
    src: url('../fonts/Ubuntu-Bold.eot');
    src: url('../fonts/Ubuntu-Bold.eot?#iefix') format('embedded-opentype'), url('../fonts/Ubuntu-Bold.woff2') format('woff2'), url('../fonts/Ubuntu-Bold.woff') format('woff'), url('../fonts/Ubuntu-Bold.ttf') format('truetype');
}
@font-face {
    font-family: 'UbuntuMedium';
    src: url('../fonts/Ubuntu-Medium.eot');
    src: url('../fonts/Ubuntu-Medium.eot?#iefix') format('embedded-opentype'), url('../fonts/Ubuntu-Medium.woff2') format('woff2'), url('../fonts/Ubuntu-Medium.woff') format('woff'), url('../fonts/Ubuntu-Medium.ttf') format('truetype');
}
/* Overwritting the form.css
===================*/

.header {
	height:auto;
    padding-left:0;
}
td.default {
    padding: 0;
}
td.default select, td.notCompulsory select, select.valerr  {
   font-size:18px;
	line-height:24px; 
}
td.valerr {
     border-radius:0;
    -moz-border-radius:0;
    -webkit-border-radius:0;
}
#fancybox-wrap {
    padding: 0!important;
}
#addressValidationPopup {
    font-family: 'Ubuntu';
}
#addressValidationPopup table td {
    color: #4a4a4a;
}
#fancybox-inner, #fancybox-inner td {
     font-size:16px;
	line-height:21px; 
    font-weight: normal;
}
/* Custom formmaster form style sheet
==================================================*/

/* General styling
===================*/
html, *, *:before, *:after  { 
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;  
    box-sizing: border-box;
}
html, body{
	color: #4a4a4a;
	height:100%;
	font-family: 'Ubuntu';
	/*overflow:auto !important;*/
    padding: 0;
    margin: 0;
}
textarea {
    resize: none;
}
td, select, input, textarea {
	margin:0;
	font-size:18px;
	line-height:24px;
	font-family: 'Ubuntu';
}

select, input, textarea {
	margin:0;
	font-size:18px;
	line-height:24px;
	font-family: 'Ubuntu';
    border:1px solid #4a4a4a;
}

h1, h2 {
	line-height:normal;
	font-family: 'UbuntuBold';
    font-weight: normal;
}

body {
	background-image:url(/form_assets/southwestslopes_165/sws_bg.jpg); /* Background image */
	background-position:top center;
	background-repeat:no-repeat;
	background-size:cover;
	background-attachment:fixed; 
	background-color:transparent;
}
 ul, ol {
    margin: 0;
     padding: 0;
}
li {
    margin: 0 0 10px 20px;
}
ol ul, ul ol {
    padding: 0 0 0 10px;
}


table, tr, td {
    position: relative;
}

a {
	color: #abac25;
}

#headerImg img {
	max-width: 220px;
}


/* Main container */

div#wrapper {
	margin:-2px auto auto !important;
	width:	100%;
	max-width:800px;
	border:0;
	background:#f4f4f4;
	min-height:100%;
    padding: 40px;
}

div#wrapper table {
	margin:auto;
	width:	100%;
	max-width:800px;
	-moz-box-sizing:				border-box;
	box-sizing:						border-box;
	padding: 0 20px;
}

div#wrapper div[id^="section"] {
	padding:0;
	margin:auto;
	width:	100%;
	max-width:800px;
}

div#wrapper div[id^="section"]:first-child {
	padding:30px 0 0 0;
	margin:auto;
	width:	100%;
	max-width:800px;
	box-sizing:border-box;
}

/* ------- new classes to target required icon on different types of input ------*/

img[alt^="Required"] {
	left: 0;
    position: absolute;
    top: 0;
}


div#wrapper table td.suffixImage input, div#wrapper table td.prefixImage input {
	height:auto;
    margin:15px 10px 10px 0;
}

div#wrapper table table {
	padding:0;
	
}

.section td {
	vertical-align:top;
}

#headerImg {
	height:100%;
	padding:20px 0 30px;
	text-align:left;
}

td.header {
	font-size:24px;
	line-height:normal;
	font-family: 'Ubuntu';
}

td.valerr  {
	padding:0 0 20px 0;
}

td:last-child, td.default:last-child, td.suffixImage:last-child, td.prefixImage:last-child  {
	padding-right:0;
}

td.mainheader, td#headerImg {
	display:block;
	width:	100%;
	font-size:25px;
	text-align: center;
}

td.mainheader {
	display:none; /* Hiding the main form title */
	margin-bottom:30px;
}

.bullet {
	vertical-align:top;
}

td.header, td.default, td.preTxt {
	padding: 0 0 20px 0;
-moz-box-sizing:				border-box;
	box-sizing:						border-box;
	width: 							50%;
	
}

 td.suffixImage, td.prefixImage {
	padding-bottom: 20px;
	
}

div#wrapper table td.preTxt input {
	
	margin-left:5px;

	
}


td.paddingFooter {
	padding:0;
}

td.inputContainer {
    padding-left:15px;
    font-size: 16px;
    line-height: 18px;
}
td.footnote {
   font-size: 14px;
    line-height: 19px; 
    padding-bottom: 20px;
}
td.separator {
  border-top:1px solid #e4e4e4;  
}
td.border_light {
    font-size: 15px;
    line-height: 21px;
    padding-bottom: 5px;
}


/* buttons
==================================================*/

#btnstart img, #btnnext img, #btnsubmit img, #btnsave img, #btnback img, #btnnone img, #btnprint img, #btnexport img, div#fancybox-wrap .buttons div.goBackButton img, div#fancybox-wrap .buttons div.continueButton img, #btngreenIdNext img, #btnsubmitIncomplete img, #btngreenIdVerification img {
	display:none;
}

/*GreenID buttons*/
.VerificationGroupViewBtns img,  div.VerificationGroupViewBtns div  {
    cursor: pointer;
}

/* div.VerificationGroupViewBtns div:before*/

/* Primary CTA */

#btnstart:before {
    margin:0 !important; 
}

/* Secondary CTA */
#btnsave, #btnback, #btnnone, #btnprint, #btnexport, #btngreenIdNext, #btnsubmitIncomplete {
    background:none;
}

.btn:before, #btnstart:before, #btnnext:before, #btnsubmit:before, #btnsave:before, #btnback:before, #btnnone:before, #btnprint:before, #btnexport:before, div#fancybox-wrap .buttons div.goBackButton:before, div#fancybox-wrap .buttons div.continueButton:before, #btngreenIdNext:before, #btnsubmitIncomplete:before, #btngreenIdVerification:before {
  display:inline-block!important;  
    min-width: 160px;
     height: 45px;
    margin: 0 auto 20px;
}
.btn, #btnstart, #btnnext, #btnsubmit, #btnsave, #btnback, #btnnone, #btnprint, #btnexport, div#fancybox-wrap .buttons div.goBackButton, div#fancybox-wrap .buttons div.continueButton, #btngreenIdNext, #btnsubmitIncomplete, #btngreenIdVerification  {
    line-height:24px;
    font-size:	20px;
    font-weight:bold;
    display:inline-block;
    text-align:center;
    color:#abac25;
    height:	50px;
    min-width:160px;
/*    margin:	0 20px 20px 0;*/
    border:	2px solid #abac25;
    border-radius:5px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    font-family: 'Ubuntu';
    padding: 10px 25px;
}

div#fancybox-wrap .buttons div.goBackButton, div#fancybox-wrap .buttons div.continueButton, #btngreenIdNext, #btnsubmitIncomplete, #btngreenIdVerification  {
    display:inline-block !important;
}

#btnnext {
	background-color:#abac25;
    color:#ffffff;
}

#btnstart, #btnnext, #btnsubmit, #btngreenIdNext, #btnsubmitIncomplete {
    -webkit-transition:background-color ease 0.3s;
    -moz-transition:background-color ease 0.3s;
    -o-transition:background-color ease 0.3s;
    transition:background-color ease 0.3s;
}

#btnstart:hover, #btnnext:hover, #btnsubmit:hover, #btngreenIdNext, #btnsubmitIncomplete, #btngreenIdVerification {
    background-color:#abac25;
    color:#ffffff;
}

#btnstart:last-child, #btnnext:last-child, #btnsubmit:last-child, #btnsave:last-child, #btnback:last-child, #btnnone:last-child, #btnprint:last-child, #btnexport:last-child, #btngreenIdNext:last-child, #btnsubmitIncomplete:last-child, #btngreenIdVerification:last-child {
    margin-right:0;
}

#btnsave, #btnback, #btnnone, #btnprint, #btnexport {
    border:	2px solid #abac25;
    color:#abac25;
    font-family: 'Ubuntu';
}
#btnsave:hover, #btnback:hover, #btnnone:hover, #btnprint:hover, #btnexport:hover {
    border:	2px solid #abac25;
    color:#ffffff;
    background:	#abac25;
}


#btnstart:before {
    content:"Start";
}

#btnstart:hover:before {
    content:"Let's go";
}

#btnnext:before {
    content:"Next";
}

#btnsubmit:before {
    content:"Submit";
}

#btnsave:before {
    content:"Save";
} 

#btnback:before {
    content:"Back";
}

#btnnone:before {
    content:"Back";
}

#btnprint:before {
    content:"Print";
}

#btnexport:before {
    content:"Export";
}

#btnexport:hover:before {
    content:"to PDF";
}

div.goBackButton:before {
    content:"Go back";
}

div.continueButton:before	{
    content:"Continue";
}
/*GreenID*/
div.VerificationGroupViewBtns div:before {
/*    content:"Verify";*/
}
#btngreenIdNext:before {
    content:"Next";
}	

#btnsubmitIncomplete:before {
    content:"Next";
}
#btngreenIdVerification:before {
    content:"Verify";
}

	

div#progressBar {
	background-color:#fff;
	width:	100%;
	border-top:4px solid #abac25;
}

div#progressBar ul.formProgressList {
	margin:0;
}

div#progressBar ul.formProgressList li.formProgressListItemActive, 
div#progressBar ul.formProgressList li.formProgressListItem {
	height:40px;
	line-height:40px;
	padding:0; 
	margin:0;
	width:	40px;
	text-align:center;
	font-weight:bold;
}

div#progressBar ul.formProgressList li.formProgressListItem {
	line-height:38px;
}

li.formProgressListItem {
	border:1px solid #abac25;
	border-right:0;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

	li.formProgressListItem:last-child {
		border-right:1px solid #abac25;
	}

li.formProgressListItemActive {
	background-color:#abac25;
	color:	#fff;
}


/* Input styling
==================================================*/


.singleAddressPopDown {
	background:white;
	border-radius:10px;
	border:1px solid #e3e3e3; /* match this with input border colour */
	margin-top:10px;
}

div.singleAddressPopDown div.results ul li {
	margin:5px 5px 10px 5px !important;
	list-style:none;
	color:	#888;
}

div#wrapper table input, div#wrapper table select {
	height:40px;
	border-radius:0 !important;
	border:1px solid #4a4a4a;
	padding:8px !important;
	width:	93%!important;
	margin:0;
	color:#4a4a4a;
	/*display:inline-block;*/
-moz-box-sizing:				border-box;
	box-sizing: 					border-box;
}

select.valerr, input.valerr  {
	height:40px;
	border-radius:0 !important;
	border:1px solid #4a4a4a !important;
	padding:8px !important;
	/*width:	87% !important;*/
	margin:0 10px 0 0;
	color:	#e51717 !important;
	display:block;
-moz-box-sizing:				border-box;
	box-sizing: 					border-box;
}

div#wrapper table textarea {
	margin:0 10px 0 0;
	background:#ffffff;
}
div#wrapper table td.prepopulated textarea {
	margin:0 10px 0 0;
	background:#8C867E;
	color:	#ffffff;
	border:1px solid #ffffff;
	
}

div#wrapper table input:focus, div#wrapper table select:focus, div#wrapper table textarea:focus {
	outline:none;
	border:1px solid #abac25;
}

/* Specific elements */


div#wrapper input.checkbox, div#wrapper input.radio, div#wrapper input.radio_valerr {
    margin: 0 10px;
    padding: 0 0 0 30px;
    width: 20px !important;
    width: 							32px\9 !important;
	vertical-align:					middle;
}

div#wrapper textarea {
	max-width:850px;
	width:	93% !important;
	padding:10px;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	color:	#666;
}


div#wrapper table input[type='checkbox'], div#wrapper table input[type='radio'] {
width: 14px !important;
	display:inline-block;
	margin:0 10px 0 0;
	
}

div#wrapper table .checkbox input[type='checkbox'], div#wrapper table .checkbox input[type='radio'] {
height: 13px !important;
}

/* Error styling
==================================================*/

div#wrapper table table.valerr {
	padding:20px;
	background:#ffffff;
	border:	1px solid #4a4a4a;
	margin:40px 0 40px 0;
	color:	#fff;
}

td.valerr {
	color:	#e51717;
}

table.valerr th {
	color:	#e51717;
	font-size:20px;
	padding:0 0 10px 0;
}

table.valerr td {
	color:	#4a4a4a;
	font-size: 14px;
    padding: 0 0 5px;
}



/* Form verification
==================================================*/

.VerificationGroupView {
	border: 0;
    margin: 40px 0;
    padding: 0;
}

.VerificationWhatWeWillNeed {
	border-radius:6px;
	border:0;
	margin:10px 0px;
	padding:10px;
}

div.VerificationGroupView h2, div.VerificationGroupView div.VerificationGroupViewHeader h2 {
	color:	#abac25;
	font-size:20px;
	font-weight:normal;
	margin:0 0 20px 0;
	padding:5px 0;
	text-align:left;
}

.VerificationWhatWeWillNeed ul {
	list-style:circle;
}

table td {
	text-align: left;
}

td.paddingFooter {
	padding: 0 0 30px 0;
}


/* pop ups */

#addressValidationPopup h3, #addressValidationPopup p {
	color: #abac25;
}


/* Breakpoints for smaller screens/mobile
==================================================*/

@media all and (max-width: 640px){

	table, tbody, tr, th, td {
		display:	block;
		width:		100%;
	}

    div#wrapper {
        padding: 20px;
    }
td.header, td.default, td.preTxt {
    padding: 0 0 20px 0;
    width: 100%;
}
	
	td.mainheader h2 {
		font-size:	25px !important;
		line-height:30px;
		text-align:center;
	}

	div#progressBar {
		margin-top:20px;
	}

    .inputContainer select, .inputContainer input, .inputContainer textarea {
        width: 100%!important;
    }

	div#wrapper > table tr:first-child td:only-child img[alt^="Required"] {
	left: -13px;
        width: 7px!important;
}
    
    div#wrapper table td input[type='checkbox'] {
width: 30px !important;
vertical-align: bottom;
height: 30px;
margin: 15px 10px 0 0;
}
	
}



@media all and (max-width: 550px){
	
   
    .btn:before, #btnstart:before, #btnnext:before, #btnsubmit:before, #btnsave:before, #btnback:before, #btnnone:before, #btnprint:before, #btnexport:before, div.VerificationGroupViewBtns div:before, div#fancybox-wrap .buttons div.goBackButton:before, div#fancybox-wrap .buttons div.continueButton:before, #btngreenIdNext:before, #btnsubmitIncomplete:before {
          margin: 0 0 20px;
        min-width: auto;
        width: 100%;
    }
    .btn, #btnstart, #btnnext, #btnsubmit, #btnsave, #btnback, #btnnone, #btnprint, #btnexport, div.VerificationGroupViewBtns div, div#fancybox-wrap .buttons div.goBackButton, div#fancybox-wrap .buttons div.continueButton, #btngreenIdNext, #btnsubmitIncomplete  {
       display:block;  
        min-width: auto;
            width: 100%;
        margin: 0 0 20px;
        padding: 10px 0;

    }

}


@media all and (max-width: 480px){
	
     div#wrapper {
		padding:0;
		overflow-y:auto;
	   -webkit-overflow-scrolling:touch;
	   height:100%!important;
    }
	div#wrapper > table {
		padding:20px !important;
	}

	h2.mainheader {
		line-height:35px;
		font-size:	30px;
	}
    
    div#wrapper > table:first-child tr:first-child td:only-child img {
        width: 100%;
        height: auto;
        max-width: 200px;
        margin: 0 auto;
        display: block;
    }
	iframe#verificationIFrame {
		margin: 20px 0 0 0;
		height: 600px!important;
	   overflow-y: scroll;
	}
    

}



/*Introduction page
===================*/
.introduction-cont {
    max-width: 715px; 
    width: 100%; 
    margin: auto;
    font-size: 16px; line-height: 20px;
    color: #4a4a4a;
}

.introduction-cont  h2 {
    font-size: 30px;
    color:#abac25;
}
.introduction-cont  h4 {
    font-size: 16px;
    line-height: 20px;
    color:#4a4a4a;
}
.r-list {
    text-align: center; 
    font-size: 14px; 
    line-height: 21px;
}
 .r-list li {
    vertical-align: top;
    margin-left:0;
    font-weight: normal; 
    box-sizing: border-box; 
    text-align: center; 
    list-style: none;
    display: inline-block;
    width: 30%;
    margin: 0 5px;
}

@media all and (max-width: 600px){


    .introduction-cont, .introduction-cont  h4 {
        font-size: 13px; 
        line-height: 19px; 
    }
    .introduction-cont  h2 {
        font-size: 24px;
    }
    
    .r-list {
        margin:0;
        padding: 0;
    }
    .r-list li {
        margin: 0 0 15px; 
        display: block;
        width: 100%;
    }
   div#wrapper ul.r-list li img {
        max-width: 100px!important;
        height: auto;
    }
    
}



#verificationIFrame {
    height: 600px !Important;
}
