form {
	
	margin: 0;
	padding: 0;
	
}

.dpifs-fake-input {
		
	text-align: center;
	
}


input#petFriendlyBox {
	
        width: 20px;
        height: 20px;
	margin: 8px;
      }

/* search summary box styling */

.searchSummary {
	
	width: CALC(100% - 20px);
	margin: 10px;
	border: 1px solid #685B37;
	background: #B5DEDE;
	padding: 15px;
	box-sizing: border-box;
	display: none;
	
}



.searchSummaryRow1, .searchSummaryRow2, .searchSummaryRow3 {
	
	font-size: 12pt;
	font-weight: bold;
	margin: 10px auto;
	width: 100%;
	text-align: center;
	
}
	
	
.searchSummaryChange {
	
	font-size: 16px;
	padding: 8px;
	box-sizing: border-box;
	border-radius: 10px;
	color: white;
	background: #ff8814;
	text-align: center;
	width: 100%;
	font-weight: bold;
	border: 0;
	margin-top: 22px;
	outline: none;
	
}
	


.searchSummaryChange:hover {
	
	background: #ff7c35;
	cursor: pointer;
	
}

.availabilityBackground {
	
	width: 100%;
	background: #B5DEDE;
	border-top: 1px solid #5c8282;
	border-bottom: 1px solid #5c8282;
	color: #3C3F4B;

}

.availabilityContainer {
	
	display: flex;
	display: -webkit-flex;
	flex-direction: row;
	-webkit-flex-direction: row;
	justify-content: space-around;
	-webkit-justify-content: space-around;
	margin: auto;
	max-width: 1200px;
	flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	box-sizing: border-box;
	margin-bottom: 15px;


}



select::-ms-expand {
	
    display: none;
    
}


/* style the select */

select.availBoxSelect {
	
	border-radius: 4px;
	/*display: block;*/
	padding: 10px 40px 10px 13px !important;
	width: 100%;
	height: auto !important;
	border: 0;
	border: 1px solid #5c8282;
	background: url('/images/down-arrow.png');
	background-repeat: no-repeat;
	background-position: calc(100% - 10px) 50%;
	background-color: white;
	color: black;
	font-size: 12pt;
	appearance: none;
	/* this is must */ -webkit-appearance: none;
	-moz-appearance: none;
	outline: none;
	margin: 0;
	
	
	
} 

.countyBox select.availBoxSelect {
	
	min-width: 230px;
	max-width: 230px;
	
}

/* for IE and Edge */

select.sortBySelect::-ms-expand {
	
	display: none; 
	
}

select.sortBySelect:disabled::-ms-expand {

	background: pink;
	
}

.regionBox, .countyBox, .petBox, .sleepsBox, .bedroomsBox, .searchBox {

	display: flex;
	display: -webkit-flex;
	flex-direction: column;
	-webkit-flex-direction: column;
	font-weight: bold;
	white-space: nowrap;
	padding: 7px 0px;
	box-sizing: border-box;
	align-items: center;
	justify-content: flex-end;
	-webkit-justify-content: flex-end;

}

 .searchBox  {

	 align-self: flex-end;
	 
}

 .petBox, .sleepsBox, .bedroomsBox {
	 
	 max-width: 120px;
	 min-width: 120px;
	 
 }
 


.availText {
	
	margin-bottom: 5px;	
	
}

.searchButton2 {
	
	font-size: 14pt;
	padding: 9px;
	box-sizing: border-box;
	border-radius: 5px;
	color: white;
	background: #FF8814;
	text-align: center;
	width: 100%;
	font-weight: bold;
	border: 0;
	margin-top: 22px;
	outline: none;
	border: 1px solid #bc4800;
	margin: auto;
	-webkit-appearance: none;
	
}

.searchButton2:hover {
	
	background: #FF7C35;
	cursor: pointer;
	
}
	
	

/* Media Queries */


@media only screen and (max-width: 1000px) {
	
	.availabilityContainer {
		
		padding: 0 15px;
		justify-content: space-between;
		-webkit-justify-content: space-between;
		
		
	}

	 .petBox, .sleepsBox, .bedroomsBox, .regionBox select, .countyBox select, #countyList .availBoxSelect {
	 
		 max-width: none;
		 min-width: none;
		 
	 }
	
	.availabilityBackground {
		
		border: 1px solid #5c8282;
		margin: 10px;
		width: CALC(100% - 20px);

	}



	.regionBox, .countyBox {
		
		width: CALC(50% - 10px);
		margin: 5px;
		
	}

	#regionId {
		
		width: 100%;
	
		
	}
	
	#countyList, #countyList .availBoxSelect {

		width: 100%;
		
	}
	
	.petBox, .sleepsBox, .bedroomsBox, .searchBox {
		
		width: CALC(25% - 10px);
		margin: 5px;
		
	}

}




@media only screen and (max-width: 600px) {
	
	
	.countyBox select.availBoxSelect {
	
		min-width: 100%;
		max-width: 100%;
		
	}
	

	
	#countyList, #countyList .availBoxSelect {

		margin: 0;
		width: 100%;
		max-width: 100%;
	
		
	}
	
	#countyList select.availBoxSelect {

		width: 50%;
		
	}
		
	
	.countyBox {
		text-align: left;
	}
	
	
	.regionBox, .countyBox, .petBox, .sleepsBox, .bedroomsBox, .searchBox  {
		
		width: 100%;
		margin: 0;
		margin: 0;

	}
	
	.petBox, .sleepsBox  {
		
		width: 50%;

	}

}




@media only screen and (max-width: 300px) {
	
	
	
	.petBox, .sleepsBox  {
		
		width: 100%;


	}

}