/************************************************************************************
MEDIA QUERIES
*************************************************************************************/

/* for 600px or less */
@media screen and (max-width:600px){
	body{
		background-image:none;
		text-align:left;
	}
	body,
	button,
	input,
	select,
	textarea{
		line-height:1.785714em; /* Unitless for proper inheritance */
		font-size:13px;
	}

	.clearfix:after,
	.boxpad:after,
	#numbercontainer:after{
		content: "."; 
		display: block; 
		height: 0; 
		font-size:0;	
		clear: both; 
		visibility:hidden;
	}
	.clearfix,
	.boxpad,
	#numbercontainer{display: inline-block;} 
	/* Hides from IE Mac \*/
	* html .clearfix,
	* html .boxpad,
	* html #numbercontainer{height: 1%;}
	.clearfix,
	.boxpad,
	#numbercontainer{display:block;}
	/* End Hack */ 

	#mob-header{
		display:block;
		background-color:#fecc05; /* Change BG color to suit clients color scheme */
		font-family:Georgia,"Times New Roman",Times,serif;
	}
	#mob-menu-btn{
/*		float:left;
		width:35%;*/
		padding:10px 5% 10px 12%;
		background:url(../images/mobile/nav-menu-rd.png) no-repeat 5% center;
		background-size:auto 12px;
		color:#790f00;
		cursor:pointer;
		cursor:hand;
		font-size:15px;
		text-transform:uppercase;
	}
	#mob-logo{
		display:block;
		margin:0;
		padding:30px 0;
		text-align:center;
	}
	#mob-logo img{
		max-width:90%;
	}	
	#mob-header .phone{
		float:right;
		padding:10px 15px 8px 0;
		color:#790f00;
		font-size:15px;
	}
	#mob-header .phone a{
		color:#790f00;
		text-decoration:none;
	}
	
	#container,
	#contentholder,
	#header,
	#footer{
		width:92%;
		padding:0 4%;
	}
	.innerpad{
		width:100%;
	}
	
	#background{
		background-position:center top;
	}
	
	#contentholder{
		width:100%;
		padding:0;
		background:url(../images/mobile/main_bg.gif) center top repeat;
	}
	#contentholder .innerpad{
		padding:0;
	}
	#content,
	#content2{
		width:94%;
		padding:3% 3% 1px;
	}
	#sidebar{
		float:none;
		width:100%;
	}
	
	#column1, #column2, #column3, #column4, #column5{
		float:none;
		width:100%;
		margin:0;
	}
	.pageImage{
		float:none;
		width:100%;
		margin:0 0 15px;
		text-align:center;
	}
	.pageImage img{
		max-width:100%;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
	}
	
	.featurebox3{
		float:none;
		width:100%;
	}
	
	.organgetitle{
		height:auto;
		padding:12px 20px;
		background:#cc7323;
		text-align:center;
	}
	.organgetitle h2,
	#content2 .organgetitle h2{
		padding-bottom:0;
		margin-bottom:0;
	}

	/* For anything that requires hiding */
	#logo,
	#header,
	#banner,
	#slider_controls,
	body > #swirl{
		display:none;
	}
		/* Mobile Navigation --------------- */

	#mob-nav{
/*		float:left;
		width:100%;*/
	}
	 #mob-nav ul{ 
			margin:0;
			padding:0;
			border-top:none;
		}
		#mob-nav ul li{ 
			margin:0;
			padding:0;
			background:none;
			list-style-type:none;
		}
		#mob-nav ul li a{
			display:block;
			padding:8px 10% 8px 5%;
			color:#790f00;
			text-decoration:none;
			font-size:14px;
			background:url(../images/mobile/subnav-arrow-rd.png) no-repeat 94% center;
			background-size:10px auto;
			border-top:solid 1px #dd8c00;
			text-decoration:none !important;
		}
		#mob-nav ul .active a{
			color:#000;
		}
		#mob-nav ul li a:hover{
			background-color:#dd8c00;
		}

	/* Feature Panel --------------- */

	#feature{
		height:auto;
		padding:15px 3%;
		background-image:none;
	}
	#feature .information{
		float:none;
		width:100%;
		padding-top:0;
		text-align:center;
	}
	#feature .promo{
		display:none;
	}
	
	#feature-panel{
		background-size:100% auto;
	}
	#banners{
		width:100%;
		height:auto;
	}
	#banners article{
		padding:5% 5% 5% 58%;
		width:auto;
		height:auto;
		background-size:100% auto;
	}
	#banners h1{
		font-size:1.714286em;
	}
	#banners p{
		font-size:1em;
	}
	#slider{
		bottom:38px;
	}
	#feature-panel .title{
		padding:0 4%;
	}
	
	/* General --------------- */
	
	h1, h2, h3, h4, h5, h6{
		margin-bottom:15px;
	}
	
	.mob-hide{
		display:none;
	} /* can be used to hide elements only on small screen */
	.content img{
		max-width:100% !important;
		height:auto !important;
	} /* Adjusts width on photos within content */

	.mob-btns, #footer ul{
		/* Any list within content can be made into a nice button format by adding this class to the ul */ 
		width:100% !important;
		margin:0 0 20px 0 !important;
		padding:0 !important;
	}
	.mob-btns li, #footer ul li{ 
		width:100% !important;
		margin:0 !important;
		padding:0 !important;
		list-style-type:none;
	}
	.mob-btns li a, .mob-btn, .map-btn, #footer ul li a{ 
		width:90%;
		padding:8px 5%;
		background:url(../images/mobile/subnav-arrow.png) no-repeat 94% center #000;
		background-size:8px auto;
		border-bottom:solid 1px #666;
		color:#fff;
		text-decoration:none;
	}
	.mob-btns li:first-child a, .mob-btns li.first a{
		-webkit-border-radius:3px 3px 0 0;
		-moz-border-radius:3px 3px 0 0;
		border-radius:3px 3px 0 0;
	}
	.mob-btns li:last-child a, .mob-btns li.last a{
		-webkit-border-radius:0 0 3px 3px;
		-moz-border-radius:0 0 3px 3px;
		border-radius:0 0 3px 3px;
		border-bottom:0 none;
	}
	.mob-btn, .map-btn{
		margin:0 0 15px 0;
		border:0 none;
		-webkit-border-radius:3px;
		-moz-border-radius:3px;
		border-radius:3px;
	}
	.map-btn{
		background:url(../images/mobile/icon-map.png) no-repeat 95% center #000;
		background-size:20px auto;
	}
	
	.mob-btns li a:hover, .mob-btn:hover, .map-btn:hover{
		background-color:#666;
	}
	
	ul.subList{
		float:left;
		width:50%;
		padding-top:0;
		margin-bottom:20px;
	}
	ul.subList li a{
	}
	@media screen and (max-width:480px){
		ul.subList{
			float:none;
			width:100%;
			margin-bottom:0;
		}
	}

	table{
		display:block;
		width:100%;
		overflow-x:auto;
	}
/*	td{
		display:block;
		width:94% !important;
		padding:3%;
	}*/
	
	.featurerow{
		float:none;
		width:100%;
	}
	#generalsearch{
		float:none;
		width:90%;
		height:auto;
		padding:15px 5%;
		background:url(../images/mobile/bg_roughbg_wide.jpg) center center repeat;
	}
	#generalsearch .col{
		float:none;
		width:100%;
	}
	.searchfield{
		float:none;
		padding-left:0;
		text-align:center;
	}
	
	.small-home-content{
		float:none;
		width:auto;
	}
	#numbercontainer ul li a{
		margin-bottom:5px;
		padding:4px 7px;
	}
	
	.home-content,
	.home-content-script{
		width:auto;
		margin:0;
		padding:0 13px 20px;
	}
	.home-content-script{
		padding-bottom:0;
	}
	
	#ads p{
		padding:0 !important;
	}
	
	.subbox{
		float:none;
		width:100%;
	}
	
	.googleadwrap-wide{
		float:none;
		width:auto;
	}
	
	.responsive-map{
		width:100%;
		height:0;
		padding:60.67% 0 0;
		position:relative;
		overflow:hidden;
	}
	.responsive-map iframe{
		width:100%;
		height:100%;
		position:absolute;
		left:0;
		top:0;
	}
	
	#cd-generalsearch{
		float:none;
		width:90%;
		height:auto;
		padding:15px 5%;
		background:url(../images/mobile/bg_roughbg_wide.jpg) center center repeat;
	}
	#cd-generalsearch .col,
	#cd-generalsearch .col_narrow,
	#cd-generalsearch .searchfield{
		float:none;
		width:auto;
	}
	#cd-generalsearch #form1 .inputbig,
	#cd-generalsearch #form1 .col h3{
		float:none;
		width:auto;
	}
	
	#numbercontainer{
		height:auto;
	}

	#wrapper{
		width:100%;
	}
	.content{
		padding-bottom:1px;
	}

	/* Sidebar --------------- */
	
	#sidebar{
		padding:30px 0;
	}
	#sidebar #latest-box ul, #sidebar #event-box ul, #sidebar .rotate{
		width:100%;
	}
	#sidebar .ui-tabs-panel .desc{
		float:none;
		width:auto;
		margin-left:80px;
	}

	/* Fieldset --------------- */

	fieldset p,
	fieldset label,
	fieldset span{
		width:100%;
	}
	fieldset{
		margin:0;
		background:#efefef;
		border:solid 1px #d5d5d5;
		margin:0 0 10px 0;
	}
	fieldset legend{
		font-weight:bold;
	}
	
	fieldset input,
	fieldset input.txtshort,
	fieldset input.txtshorter,
	fieldset textarea,
	fieldset .commentBox, 
	fieldset .long
	fieldset #enquiry,
	fieldset select{
		width:92% !important;
		padding:7px 3%;
		-webkit-border-radius:3px;
		-moz-border-radius:3px;
		border-radius:3px;
		border:solid 1px #d5d5d5;
	}
	
	 /* Footer --------------- */

	#footer{ 
		width:92%;
		height:auto;
		padding:15px 4%;
		background-image:none;
		text-align:center;
	}
	.footerlink{
		float:none;
		margin:10px auto 0;
	}
	#footer .credits{
		float:none;
		width:auto;
		padding-left:0;
		text-align:center;
	}
	#footer .innerpad{
		padding:0;
	}
	#footer p,
	#footer p a, 
	#footer ul li,
	#footer ul li a{
		font-size:1em;
	}
	#footer a{ 
	}
	#footer p, 
	#footer ul{ 
		width:100% !important;
		margin:0 0 15px 0;
		padding:0;
		text-align:center;
	}
	#footer p{
	}
	#footer ul li{ 
		width:100%;
		padding:0;
		margin:0;
	}
	.footer-link a{
		margin:0 auto;
	}
	#footer .right{
		float:none;
	}
	#footer .right p{
		text-align:center;
	}
}
@media screen and (max-width:500px){
	#promo a{
		height:356px;
	}
}
@media screen and (max-width:400px){
	#promo a{
		height:280px;
	}
}
@media screen and (max-width:320px){
	#promo a{
		height:219px;
	}
}
