/* Foco fontface
====================================== */	

/* Webfont: Foco-regular */

@font-face {
	font-family: 'Foco';
	src: url('../fonts/Foco-Regular.eot');
	src: url('../fonts/Foco-Regular.eot?#iefix') format('embedded-opentype'),
		url('../fonts/Foco-Regular.woff2') format('woff2'),
		url('../fonts/Foco-Regular.woff') format('woff'),
		url('../fonts/Foco-Regular.ttf') format('truetype'),
		url('../fonts/Foco-Regular.svg#Foco-Regular') format('svg');
	font-weight: normal;
	font-style: normal;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

@font-face {
	font-family: 'Foco';
	src: url('../fonts/Foco-Black.eot');
	src: url('../fonts/Foco-Black.eot?#iefix') format('embedded-opentype'),
		url('../fonts/Foco-Black.woff2') format('woff2'),
		url('../fonts/Foco-Black.woff') format('woff'),
		url('../fonts/Foco-Black.ttf') format('truetype'),
		url('../fonts/Foco-Black.svg#Foco-Black') format('svg');
	font-weight: 900;
	font-style: normal;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

@font-face {
	font-family: 'Foco';
	src: url('../fonts/Foco-Bold.eot');
	src: url('../fonts/Foco-Bold.eot?#iefix') format('embedded-opentype'),
		url('../fonts/Foco-Bold.woff2') format('woff2'),
		url('../fonts/Foco-Bold.woff') format('woff'),
		url('../fonts/Foco-Bold.ttf') format('truetype'),
		url('../fonts/Foco-Bold.svg#Foco-Bold') format('svg');
	font-weight: bold;
	font-style: normal;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


@font-face {
	font-family: 'Foco';
	src: url('../fonts/Foco-Light.eot');
	src: url('../fonts/Foco-Light.eot?#iefix') format('embedded-opentype'),
		url('../fonts/Foco-Light.woff2') format('woff2'),
		url('../fonts/Foco-Light.woff') format('woff'),
		url('../fonts/Foco-Light.ttf') format('truetype'),
		url('../fonts/Foco-Light.svg#Foco-Light') format('svg');
	font-weight: 300;
	font-style: normal;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


/* Custom formmaster form style sheet
==================================================*/

html, body{
	color: #545456;
	height: 100%;
	font-family: 					"Foco",Arial, Helvetica, sans-serif;
	overflow: 						auto !important;
	font-weight:normal;
	
}

td, select, input, textarea {
	margin: 						0;
	font-size: 						16px;
	line-height: 					24px;
	font-family: 					"Foco",Arial, Helvetica, sans-serif;
	font-weight:normal;
}

h1, h2 {
	line-height: 					normal;
	font-family: 					"Foco",Arial, Helvetica, sans-serif;
	font-weight:bold;
}

body {
	background: 					transparent; /* Background image */
	background-position: 			top center;
	background-repeat: 				no-repeat;
	background-size: 				cover;
	background-attachment: 			fixed; 
	background-color:				transparent;
}

table, tr, td {
	-moz-box-sizing:				border-box;
	box-sizing:						border-box;
}

a {
	color: #ffffff;
}

#headerImg img {
	max-width: 180px;
}

.introImage {
	/*
	background: 					url(/form_assets/australianunity_140/bg.jpg); /* Background image */
	background-position: 			center;
	background-repeat: 				no-repeat;
	background-size: 				cover; 
}

/* Main container */

div#wrapper {
	padding: 						0;
	margin: 						auto;
	width: 							100%;
	border: 						0;
	background: 					transparent;
	/* background: 					#2d3494; */
}


div#wrapper table {
	padding: 						0;
	margin: 						auto;
	width: 							100%;
	max-width: 						600px;
	-moz-box-sizing:				border-box;
	box-sizing:						border-box;
}

div#wrapper table:last-child {
	padding: 						0;
}

div#wrapper div[id^="section"] {
	padding: 						0;
	margin: 						auto;
	width: 							100%;
	max-width: 						600px;
	-moz-box-sizing:				border-box;
	box-sizing:						border-box;
}

div#wrapper div[id^="section"]:first-child {
	padding: 						0;
	margin: 						auto;
	width: 							100%;
	max-width: 						600px;
	-moz-box-sizing:				border-box;
	box-sizing:						border-box;
}

/* ------- new classes to target required icon on different types of input ------*/

img[alt^="Required"] {
	position: 						relative;
	top: 							-64px;
	left:							 -13px;
}

td.prefixImage img[alt^="Required"] {
	position: 						relative;
	top: 							0 !important;
	left:						 	0 !important;
}

td.suffixImage img[alt^="Required"] {
	position: 						relative;
	top: 							0;
	left: 							-9px;
}


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 {
	padding-right: 					20px;
	-moz-box-sizing:				border-box;
	box-sizing:						border-box;
	vertical-align: 				top;
	color: #f6f6f6;
}

#headerImg {
	height: 						100%;
	padding: 						20px 0;
	text-align: 					center;
}

td.header {
	font-size: 						24px;
	line-height: 					normal;
	font-family: 					"Foco",Arial, Helvetica, sans-serif;
}

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;
	/*
	background-color: 				white;
	*/
}

td.mainheader {
	display: 						none; /* Hiding the main form title */
	margin-bottom: 					30px;
}

.bullet {
	vertical-align: 				top;
}

td.header {
	display: none;
}

td.header, td.default, td.suffixImage, td.prefixImage {
	padding: 						5px;
	-moz-box-sizing:				border-box;
	box-sizing:						border-box;
	
}

td.paddingFooter {
	padding: 						0;
}

.header {
	height: 						auto;
}


/* buttons
==================================================*/

#btnstart img, #btnnext img, #btnsubmit img, #btnsave img, #btnback img, #btnnone img, #btnprint img, #btnexport img, .VerificationGroupViewBtns img, div#fancybox-wrap .buttons div.goBackButton img, div#fancybox-wrap .buttons div.continueButton img {
	display: 						none;
}

/* Primary CTA */

	#btnstart:before {
		margin:								0 !important; 
	}

	/* Secondary CTA */

	#btnsave, #btnback, #btnnone, #btnprint, #btnexport {
		background: 						none;
	}

	#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, div#fancybox-wrap .buttons div.continueButton  {
		margin: 							0 20px;
		line-height: 						50px;
		font-size: 							20px;
		font-weight: 						bold;
		display: 							inline-block;
		text-align: 						center;
		color: 								#0072bc;
		height: 							49px;
		width: 								160px;
		margin: 							0 20px 20px 0;
		border: 							2px solid #ffffff;
		border-radius:						4px;
		-moz-box-sizing:					border-box;
		box-sizing:							border-box;
		font-family: 					"Foco",Arial, Helvetica, sans-serif;
		background-color: 					#ffffff;
		
		
	}
	
	div#fancybox-wrap .buttons div.goBackButton, div#fancybox-wrap .buttons div.continueButton {
		margin: 							0 20px;
		line-height: 						50px;
		font-size: 							20px;
		font-weight: 						bold;
		display: 							inline-block;
		text-align: 						center;
		color: 								#ffffff;
		height: 							50px;
		width: 								160px;
		margin: 							0 20px 20px 0;
		border: 							2px solid #ffffff;
		-moz-box-sizing:					border-box;
		box-sizing:							border-box;
		font-family: 					"Foco",Arial, Helvetica, sans-serif;
	}

	#btnstart:before, #btnnext:before, #btnsubmit:before {
		 -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:before, #btnnext:hover:before, #btnsubmit:hover:before {
				background-color: 					#2d3494;
				color: 								#ffffff;
				border-color:#2d3494;
			}

	#btnstart:last-child, #btnnext:last-child, #btnsubmit:last-child, #btnsave:last-child, #btnback:last-child, #btnnone:last-child, #btnprint:last-child, #btnexport:last-child {
		margin-right: 						0;
	}

	#btnsave:before, #btnback:before, #btnnone:before, #btnprint:before, #btnexport:before {
		border: 							2px solid #ffffff;
		color: 								#ffffff;
		font-family: 						"Foco",Arial, Helvetica, sans-serif;
		background: none;
	}
		#btnsave:hover:before, #btnback:hover:before, #btnnone:hover:before, #btnprint:hover:before, #btnexport:hover:before {
			border: 							2px solid #2d3494;
			color: 								#2d3494;
		
		}

	#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.VerificationGroupViewBtns div:before {
		content: 							"Verify";
	}
	
	div.goBackButton:before {
		content: 							"Go back";
	}
	div.continueButton:before	{
		content: 							"Continue";
	}	
	
	div#btnsubmitIncomplete	{
		position: relative;
    	top: 17px;
	}

div#progressBar {
	/*
	background-color: 				#fff;*/
	width: 							100%;
}

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 #00aeef;
	border-right: 					0;
	-moz-box-sizing: 				border-box;
	box-sizing: 					border-box;
}

	li.formProgressListItem:last-child {
		border-right: 					1px solid #00aeef;
	}

li.formProgressListItemActive {
	background-color: 				#0072bc;
	color:							#fff;
}


/* Input styling
==================================================*/

div#wrapper table input[type='checkbox'] {
		width: 						15px !important;
		width: 						32px\9 !important;
		display: 					inline-block;
		margin: 						0 10px 0 0;
		
	}

.singleAddressPopDown {
	background: 					white;
	border-radius: 					4px;
	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: 					4px !important;
	border: 						1px solid #83d2f0;
	padding: 						8px !important;
	width: 							95%;
	margin: 						0 10px 0 0;
	color: 							#545456;
	-moz-box-sizing:				border-box;
	box-sizing: 					border-box;
	display: 						block;
	background-color:			#83d2f0;
}

select.valerr, input.valerr  {
	height: 						40px;
	border-radius: 					0px !important;
	border: 						2px solid #e51717 !important;
	padding: 						8px !important;
	/*width: 							87% !important;*/
	margin: 						0 10px 0 0;
	color: 							#e51717 !important;
	-moz-box-sizing:				border-box;
	box-sizing: 					border-box;
	display: 						block;
}

select.valerr:focus, input.valerr:focus  {
	color: 							#ffffff !important;

}
div#wrapper table textarea {
	margin: 						0 10px 0 0;
	background: 					#ffffff;
}
div#wrapper table td.prepopulated textarea {
	margin: 						0 10px 0 0;
	background: 					#ffffff;
	color:							#666666;
	border: 						1px solid #cccccc;
	
}

div#wrapper table input:focus, div#wrapper table select:focus, div#wrapper table textarea:focus {
	outline: 						none;
	border: 						2px solid #2d3494;
	background-color: #2d3494;
	color:#ffffff;
}

/* Specific elements */

div#wrapper input.checkbox, div#wrapper input.radio, div#wrapper input.radio_valerr {
	width: 							20px !important;
	width: 							32px\9 !important;
	display: 						inline-block;
	margin: 						0 10px 0 0;
}

div#wrapper textarea {
	max-width: 						850px;
	width: 							100% !important;
	padding: 						10px;
	-moz-box-sizing:				border-box;
	box-sizing: 					border-box;
	color: 							#666;
}


/* Error styling
==================================================*/

div#wrapper table table.valerr {
	padding: 						20px;
	-moz-box-sizing:				border-box;
	box-sizing: 					border-box;
	background: 					#e51717;
	border:							0;
	margin: 						0;
	color: 							#fff;
}

td.valerr {
	color: 							#e51717;
}

table.valerr th {
	color: 							#ffffff;
	font-size: 						16px;
    line-height: 					20px;
	padding: 						0
}

table.valerr td {
	color: 							#ffffff;
	font-size: 						16px;
    line-height: 					20px;
	padding: 						0;
}



/* Form verification
==================================================*/

.VerificationGroupView {
	border: 0;
    margin: 40px 0;
    padding: 0;
}

.VerificationWhatWeWillNeed {
	border-radius: 					4px;
	border: 						0;
	margin: 						10px 0px;
	padding: 						10px;
}

div.VerificationGroupView h2, div.VerificationGroupView div.VerificationGroupViewHeader h2 {
	color: 							#fff;
	font-size: 						20px;
	font-weight: 					bold;
	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: #0072bc;
}

#sigma_form p {
	font-size: 18px;
	line-height: 30px;
	color:#2d3494;
	font-weight: bold;
}

#sigma_form p.bigger-fontsize {
    font-size: 20px;
}

/* Breakpoints for smaller screens/mobile
==================================================*/

@media all and (max-width: 480px){

	table, tbody, tr, th, td {
		display: 							block;
		width: 								100%;
		-moz-box-sizing:					border-box;
		box-sizing: 						border-box;
	}

	td.header, td.default, td.suffixImage, td.prefixImage {
		padding: 							0 0 20px 0;
		width: 								100%;
	}

	div#wrapper table input, div#wrapper table select, div#wrapper table textarea {
		margin: 							0 10px 0 0;
		width: 								92% !important;
		min-width: 							300px;
	}


	div#wrapper table input {
		margin: 							0 10px 0 0;
		width: 								92% !important;
		min-width: 							20px !important;
	}
	
	td.mainheader h2 {
		font-size: 							25px !important;
		line-height: 						30px;
		text-align: 						center;
	}

	div#progressBar {
		margin-top: 						20px;
	}


	.inputContainer img[alt^="Required"] {
    	top: -65px;
	}
	
	td.suffixImage img[alt^="Required"] {
	position: 						relative;
	top: 							0;
	left: 							0;
}

td.paddingFooter {
	text-align: center;
}

}


/* Smart phones */

@media all and (max-width: 480px){
	
	div#wrapper table {
		padding: 						10px;
	}

	h2.mainheader {
		line-height: 						35px;
		font-size: 							30px;
	}

	td .inputContainer img {
		position: 							absolute;
		margin: 							15px 0 0 0;
	}
	
	.inputContainer img[alt^="Required"] {
		position: relative;
		top: -40px;
		left: -5px;
}


	div#wrapper table input, div#wrapper table select, div#wrapper table textarea {
		width: 								95% !important;
		margin: 							0 10px 0 10px;
	}


	iframe#verificationIFrame {
		margin: 							20px 0 0 0;
		height: 							650px !important;
	}

	.VerificationWhatWeWillNeed ul,
	.VerificationWhatWeWillNeed li {
		margin: 							0;
		padding: 							0;
	}

	.VerificationWhatWeWillNeed {
		width: 								100%;
		-moz-box-sizing:					border-box;
		box-sizing: 						border-box;
	}

	div#wrapper table input, div#wrapper table select, div#wrapper table textarea {
		min-width: 							0;
	}

	div#wrapper {
		width: 								100% !important;
		padding: 							0 !important;
	}

	div#progressBar ul.formProgressList li.formProgressListItemActive, div#progressBar ul.formProgressList li.formProgressListItem {
		height: 							35px;
		line-height: 						35px;
		width: 								35px;
	}

	td.header, td.default, td.suffixImage, td.prefixImage {
		padding: 							0 0 10px 0;
	}

	td.default.inputContainer, td.suffixImage.inputContainer, td.prefixImage.inputContainer {
		padding: 							0;
	}
	
	div#wrapper table select {
		/*margin-bottom: 			20px;*/
	}

	div#wrapper table td.inputContainer {
		height: 85px;
	}

	div#wrapper table input[type='checkbox'] {
		width: 								30px !important;
	}

	/* buttons*/

	#btnstart:before, #btnnext:before, #btnsubmit:before, #btnsave:before, #btnback:before, #btnnone:before, #btnprint:before, #btnexport:before  {
		height: 							50px;
		width: 								100%;
		max-width: 							250px;
		margin: 							10px auto;
	}

}