@import "https://fonts.googleapis.com/css?family=Droid+Serif";  /* This Line is to import Google font style */

@import url('https://fonts.googleapis.com/css?family=Roboto');
		
	
		.maincontainer{
		padding-top: 3%;
		max-width: 1200px;
   		width: auto;
    	height: 430px;
    	top: 125px;
    	margin: auto;
    	left: 0;
    	right: 0;
    	position: absolute;
		}
	
		.loadingcontainer {
		margin-top: 10px;
   		width: 380px;
   		height: 415px;
    	position: absolute;
    	right: 25px;		
		}
	
		.main {
		margin-top: 10px;
   		width: 380px;
   		height: 415px;
    	position: absolute;
    	right: 25px;
		}
		
	
		.qtip-content{
		font-size: medium !important;
		}

		#postcode{
		display:block;
		} 

		fieldset{
		display:none;
    	/* left: 60%; */		max-width:380px;
		border:5px solid #1090CC;
		padding:5px;
		margin:auto;
		height: 415px;
		background-color: white;
		opacity: 0.85;
		position: relative;
		}

		input:not(.contactinput, .arrangecontactinput)[type=text], select{
		width:45%;
		margin:10px 0;
		height:40px;
		padding:5px;
		border:3px solid #1878c0;
		border-radius:4px;
		}
		
		.dropdown{
		width:45%;
		margin:10px 0;
		height:40px;
		padding:5px;
		border:3px solid #1878c0;
		border-radius:4px;
		}
		
		.AddressDropdown{
		width:98%;
		margin:4px 3px;
		height:30px;
		padding:4px;
		border:3px solid #1878c0;
		border-radius:4px;
		font-size: small;
		font-family:'Droid Serif',serif;
		}

		.contactinput{
		width:98%;
		margin:4px 3px;
		height:30px;
		padding:4px;
		border:3px solid #1878c0;
		border-radius:4px;
		font-size: medium;
		line-height: 0;
		}
		
		#PostcodeInput{
		width:45%;
		margin:4px 3px;
		height:30px;
		padding:4px;
		border:3px solid #1878c0;
		border-radius:4px;
		font-size: medium;
		float: left;
		}
		
		#Firstname, #Surname{
		width:42%;
		margin:4px 3px;
		height:30px;
		padding:4px;
		border:3px solid #1878c0;
		border-radius:4px;
		display: inline-block; 
		}
		#Title{
		width:15%;
		margin:4px 3px;
		height:30px;
		padding:4px;
		border:3px solid #1878c0;
		border-radius:4px;
		display: inline-block; 
		}
	
		textarea{
		width:100%;
		margin:10px 10px;
		height:70px;
		padding:5px;
		border:3px solid #1878c0;
		border-radius:4px;
		}
			
		#SearchAddress{
		width: 45%;
		margin:4px;
		margin-right:5px;
		margin-left:5px;
		float: right;
		padding:5px;
		height:30px;
		background-color: #90c018;  
		border:none;
		border-radius:4px;
		color:#fff;
		font-family:'Droid Serif',serif;
		position: relative;
		font-size: medium;
		line-height: 0;
		}

		#ManualAddress1{
		width: 70%;
    	margin: 4px 3px;
		margin-bottom: 10px;
    	height: 30px;
    	padding: 4px;
    	border: 3px solid #1878c0;
    	border-radius: 4px;
    	font-size: small;
    	float: right;
		}

		#ManualHouseNo{
		width: 26%;
    	margin: 4px 3px;
		margin-bottom: 10px;
    	height: 30px;
    	padding: 4px;
    	border: 3px solid #1878c0;
    	border-radius: 4px;
    	font-size: small;
    	float: left;
		}
		
		
		#next_btn2{
		width:45%;
		margin-right:5px;
		float: right;
		height:40px;
		background-color: #1878c0;  
		border:none;
		color:#fff;
		font-family:'Droid Serif',serif;
		position: relative;
		vertical-align: center;
		text-align: center;
		bottom: -57px;
		font-size: medium;
		}
		
		#pre_btn1{
		width:45%;
		margin-left:5px;
		float: left;
		height:40px;
		background-color: #1878c0;  
		border:none;
		color:#fff;
		font-family:'Droid Serif',serif;
		position: relative;
		vertical-align: center;
		text-align: center;
		bottom: -57px;
		font-size: medium;
		}
		
		#next_btn3 {
		width: 45%;
		margin-right: 7.5px;
		float: right;
		height: 40px;
		background-color: #1878c0;
		border: none;
		color: #fff;
		font-family: 'Droid Serif',serif;
		position: relative;
		vertical-align: center;
		text-align: center;
		bottom: -7.5px;
		font-size: medium;
	}
		
		#pre_btn2 {
			width: 45%;
			margin-left: 7.5px;
			float: left;
			height: 40px;
			background-color: #1878c0;
			border: none;
			color: #fff;
			font-family: 'Droid Serif',serif;
			position: relative;
			vertical-align: center;
			text-align: center;
			bottom: -7.5px;
			font-size: medium;
		}
		
		#pre_btn3{
		width: 45%;
		margin:3px;
		margin-left:2px;
		float: left;
		padding:5px;
		height:35px;
		background-color: grey;  
		border:none;
		color:#fff;
		font-family:'Droid Serif',serif;
		position: relative;
		line-height: 0;
		font-size: medium;
		}

		#pre_btn4{
		width: 45%;
		margin:3px;
		margin-left:2px;
		float: left;
		padding:5px;
		height:25px;
		background-color: grey;  
		border:none;
		color:#fff;
		font-family:'Droid Serif',serif;
		position: relative;
		bottom: -254px;
		}

		input[value="Submit"]{
		width: 45%;
		margin:3px;
		margin-right:2px;
		float: right;
		padding:5px;
		height:35px;
		background-color: #1878c0;  
		border:none;
		color:#fff;
		font-family:'Droid Serif',serif;
		position: relative;
		line-height: 0;
		font-size: medium;
		}
		
		input[value="Next  "]{
		width: -webkit-fill-available;
		width: -moz-fill-available;
		width: fill-available;
		margin: 10px 10px;
		padding: 0;
		height: 40px;
		background-color: #1878c0;
		border: none;
		color: #fff;
		font-family: 'Droid Serif',serif;
		font-size: medium;
		}
		
		
		.contactbuttons{
 	    display: inline-block;
  		position: relative;
    	width: 100%;
    	height: 35px;
   		bottom: -29px;
		}

		.postcodebutton{
		position: absolute;
		width: 100%;
		height: 60px;
		bottom: 0;
		left: 0;
		}
		.benefitbuttons {
    display: inline-block;
    position: absolute;
    width: 100%;
    height: 55px;
    bottom: 0px;
    left: 0;
    right: 0;
    margin: auto;
}
		.propertybuttons{
		display: inline-block;
		position: relative;
		width: 100%;
		height: 55px;
		bottom: -15px;
		}

		input[name="Products"]{
		width: 20px;
		height: 20px;
		margin-left: 3px !important;
		}
		input[name="Benefits"]{
		width: 20px;
		height: 20px;
		margin: 5px;
		margin-left: 3px !important;
		}
		
		label{
		font-family:'Droid Serif',serif;
		color: #003060;  
		font-size: small;
		vertical-align: top;
		margin-left: 3px;
		}
		
		.marketingcheckclass{
		display: flex;
   		float: left;
    	font-size: x-small;
    	width: 70%;
    	bottom: -30px;
    	position: relative;
    	margin-left: 4px;
		}
		
		#marketingcheckboxemail, #marketingcheckboxphone, #marketingcheckboxtext{
		width: 15px !important;
		height: 15px !important;
		margin-top: 8px !important
		}

		.main p{
		margin-left: 0.5%;
		text-align:left;
		font-family:'Droid Serif',serif;
		color: #003060;
		margin-top: 2px;
		margin-bottom: -2px;
		font-size: small;
		line-height: 1.3;
		padding: 0 !important;
		}
		
		.marketingtextdiv {
   		position: relative;
    	bottom: -30px;		
		}

		#marketingtext {
		position: relative;
		}
		.loader{
	    display: none;
		position: absolute;
		top: 45%;
		left: 0;
		right: 0;
		margin: auto;
		z-index: 1;
		width: 20%;
		}
		
		@keyframes spin {
			0% { transform: rotate(0deg); }
			100% { transform: rotate(360deg); }
		}
		
		.main h2{
		text-align:center;
		font-family:'Roboto', sans-serif;
		color: #003060;
		margin-top:5px;
		margin-bottom:10px;
		line-height: 1;
		font-size: 24px;
		}
		
		.main h3{
		text-align:center;
		font-family:'Roboto', sans-serif;
		color: #003060;  
		font-size: 17.5px !important;
		line-height: 1.3;
		padding: 0px;
		}
		.main h4{
		text-align:left;
		font-family:'Roboto', sans-serif;
		margin-top:5px;
		color: #003060;  
		margin-left: 1%;
		margin-bottom:5px;
		font-size: small;
		line-height: 1
		}
		
		#benefitstitle, #propertytitle{
		text-align:center;
		font-family:'Roboto', sans-serif;
		margin-top:5px;
		margin-bottom:10px;
		color: #003060;  
		}

		.bsukinfo{
		text-align:left;
		font-family:'Droid Serif',serif;
		margin-top: 3px;
		color: #003060;  
		margin-left: 1%;
		font-size: large;
		margin-bottom: 3px;
		padding: 0px;
		}

		.labelwidth{
		float:left;
		width:53%;
		margin-top:18px;
		margin-left: 1%;
		color: #003060;  
		font-family:'Droid Serif',serif;
		}
		
		label.error{
		color: #ff0000;
		display:none;
		font-family:'Droid Serif',serif;
		margin-left: 1%;
		}
		
		input.error {
		border:1px solid red;
		color: #ff0000;
		}
		
		select.error {
		border:1px solid red;
		color: #ff0000;
		}
		
		option.error {
		border:1px solid red;
		color: #ff0000;
		}


	@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	.main p {
    margin-left: 0.5%;
    text-align: left;
    font-family: "Droid Serif",serif;
    color: #003060;
    margin-top: 2px;
    margin-bottom: -2px;
    font-size: 12px;
    line-height: 1.3;
    padding: 0 !important;
		}
	}
	@supports (-ms-ime-align:auto) {
 	.main p {
    margin-left: 0.5%;
    text-align: left;
    font-family: "Droid Serif",serif;
    color: #003060;
    margin-top: 2px;
    margin-bottom: -2px;
    font-size: 12px;
    line-height: 1.3;
    padding: 0 !important;
		}
	}