/***********************************/
/*** Break Points for Responsive ***/
/***********************************/
@media all and (max-width: 1040px) {
    /* fluid width */
	body {
		margin: 0 10px;	
	}	
	#wrapper {
		width:100%;
	}
	iframe {
		width: 100%;
	}
}
@media all and (max-width: 860px) {
	/* Getting set for tablets */
	#wrapper > header { 
		background: #FFF url(images/header_graphic_small.png) right bottom no-repeat;
	}
	#wrapper > header span {
		font-size: 3em;
		margin-top: 30px;
	}	
	#content {
		margin: 10px 20px;
	}	
	#content form label {
		display: block;	
		width: 80%;
	}
	#footer p {
		float: none;
		margin: 5px;
	}
}
@media all and (max-width: 590px) {
	/* Getting set for phones */	
	body {
		margin: 0;	
	}
	#wrapper > header { 
		background: #FFF url(images/header_graphic_light.png) right bottom no-repeat;
	}
	#wrapper > header span {
		font-size: 2.4em;
		margin-top: 30px;
		margin-left: 5px;
		text-align: center;
	}
	#content {
		margin: 5px;
	}
	#crumbs {
		display: none;
	}
	#content form {
		padding: 20px 5px;
	}
	#content form fieldset {
		float: none;
		width: 100%;	
	}
	#content select,
	#content textarea,
	#content input[type="text"],
	#content input[type="email"] {
		min-width: initial;
		width: 100%;
	}
	select#ppp {
    min-width: 60px;
    width: 60px;
}

/* Force table to not be like tables anymore */
	table, thead, tbody, th, td, tr { 
		display: block; 
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	tr { border: 1px solid #ccc; }
	
	td { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee; 
		position: relative;
		padding-left: 50%; 
	}
	
	td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
		font-weight:bold;
	}
	
	/*
	Label the data
	*/
	td.no_results:nth-of-type(1):before { content: "";}
	td.no_results:nth-of-type(2):before { content: "";}
	td:nth-of-type(1):before { content: "State"; }
	td:nth-of-type(2):before { content: "Region"; }
	td:nth-of-type(3):before { content: "Programme"; }
	td:nth-of-type(4):before { content: "Service Type"; }
	td:nth-of-type(5):before { content: "Organisation Name"; }
}
}