/*--------------- Useful for block switching --------------*/
/*---------------------------------------------------------*/
	
.hideOnPhone{
	display:block;
}
.hideOnSmallTablet{
	display:block;
}
.showOnPhone{
	display:none;
}
.showOnSmallTablet{
	display:none;
}

/*
Saeed - 10 Sept 2015
Some anchor links in the responsive versions of the site may span across and break the layout.
Uncomment the following line to fix this issue.  Left it commented at the moment but uncomment in 
2dev if you feel that it's safe to keep is available on responsive sites.
*/
/*
a {
	word-break: break-all;
}
*/
@media (max-width: 1800px) {
	.wrapper-inner-full {
		padding-right:2%;
		padding-left:2%;
		width: 96%;
	}
	#centerc-1col {
		width:100%;
	}
	#centerc-2col {
		margin-left:19%;
		width:81%;
	}
	#leftc {
		margin-left: -100%;
		padding-right: 2%;
    	width: 17%;	
	}
	.menu_header {
		width:100%;
	}
	#leftc ul li a, #leftc ul li a:visited {
		padding-left: 8%;
    	width: 92%;
	}
}

@media (max-width: 1700px) {
	
	#testimonial-content {
    	width: 84%;
	}
}

@media (max-width: 1500px) {
	img {
		height:auto;
		width:100%;
	}
	img.alignRight, img.alignLeft{
		width:49%;
	}
	.wrapper-inner {
		padding-right:2%;
		padding-left:2%;
		width:96%;
	}
	#centerc-home {
		width:100%;
	}
	.textarea {
		margin-left:2%;
	}
	.Template3colContainer, #gallery {
		width:100%;
	}
	.Template3colColumn, .galleryImage {
		margin-right:2%;
		width:32%;
	}
	.TemplateColumnLast, .galleryLast {
    	margin-right: 0px;
	}
	.galleryImage {
		max-height: 240px;
	}
	#contact-content, #divMap {
    	width: 49%;
	}
	
	.testimonail-prev {
		margin-left: 2%;
	}
	.testimonail-next {
		margin-right: 2%;
	}
}

@media (max-width: 1400px) {
	#contactform {
		width:100%;
	}
	#contact-details {
		margin-right:2%;
	}
	#contact-details, #contact-enquiry {
		width:49%;
	}

	#contact-details label {
		margin-right:2%;
		width:21%;
	}
	#contact-details .contactInputLarge {
		width:70%;
	}

	#contact-enquiry label {
		margin-right:2%;
		width:29%;
	}

	#contact-enquiry .contactInputLarge {
		width: 64%;
		padding-left: 2%;
		padding-right: 2%;
	}

	.galleryImage {
		max-height: 210px;
	}
}

@media (max-width: 1200px) {
	
	#navigation ul li a, #navigation ul li a:visited {
		font-size:15px;
		padding-left: 25px;
    	padding-right: 25px;
	}
	
	#centerc-2col {
    	margin-left: 24%;
    	width: 76%;
	}
	#leftc {
    	width: 22%;
	}

	#contact-enquiry .contactInputLarge {
		width: 95%;
		padding-left: 2%;
		padding-right: 2%;
	}

	.galleryImage {
		max-height: 180px;
	}
}

/*Apply to all Responsive*/
@media (max-width: 1024px) {
	/*--------------- Structure --------------*/
	/*----------------------------------------*/
	
	h2 {
		font-size: 1.6em;
	}

	img{
		max-width: 100%;
		height: auto;
	}
	
	.wrapper-inner {
		padding-left: 2%;
		padding-right: 2%;
		width: 96%;
	}
	
	#foot, #foot2{
		width:100%;
	}
	
	#centerc-1col {
		padding-top:12px;
		width: 100%;
	}
	#centerc-2col {
		display:block;
		float:none;
		margin-left: 0px;
		padding-top:12px;
		width: 100%;
	}

	#leftc{
		float:none;
		margin-left: 0px;
		padding-right:0px;
		padding-top: 0px;
		width: 100%;
	}
	
	#leftc ul{
		margin:0px;
		padding:0px;
	}
		
	#leftc ul li a, #leftc ul li a:visited {
		padding-left: 2%;
		width: 98%;
	}

	
	#leftc ul li ul li a, #leftc ul li ul li a:visited{
		padding-left: 6%;
		width: 94%;
	}
	
	#leftc ul li ul li ul li a, #leftc ul li ul li ul li a:visited{
		padding-left: 10%;
		width: 90%;
	}
	
	.menu_header {
		width:100%;
	}
	
	/*--------------- Bespoke --------------*/
	/*----------------------------------------*/
	
	#header-left {
		padding-top: 23px;
		width: 260px;
	}
	#header-right {
		width: 250px;
	}
	#header_graphic img {
	    width: 260px;
	}

	#header-right .strapline {
		padding-top: 29px;
	}
	
	.textarea p {
		font-size:2em;
	}
	
	#map-wrap, #map-placeholder{ 
		width: 100%; 
	}
	#map-wrap img{
		display:block;
	}
	

	/*label cell*/
	div.TableReplaceRow div.TableReplaceLeft {
		width: 20%;
	}
	/*data cell*/
	div.TableReplaceRow div.TableReplaceRight {
		margin-left: 2%;
		width: 75%;
	} 
	
	div.TableReplaceRow div.TableReplaceLeftB {
		width: 60%;
	}
	/*data cell*/
	div.TableReplaceRow div.TableReplaceRightB {
		margin-left: 2%;
		width: 30%;
	 } 

	.newsitem{
		width:32%;
		margin-right:2%;
	}	
	.newsimage{
		height:auto;
		overflow:hidden;
		width:100%;
	}
	.newsdate{
		left:auto;
		right:0px;
	}
	
	#home-slider-wrapper .bx-controls {
		height: 65px;
		top: -255px;
		max-width: 976px;
		width:100%;
	}
	
	.Template3colTitle p {
		font-size:1em;
	}
	
	#testimonial-content {
		width: 76%;
	}
	.testimonail-prev, .testimonail-next {
		width:10%;
	}

	.galleryImage {
		max-height: 130px;
	}

}

/*Large Tablet Sized */
@media (min-width: 768px) and (max-width: 1024px) {
	/*--------------- Structure --------------*/
	/*----------------------------------------*/
	
	#wrap{
		padding-left:1%;
		padding-right:1%;
		width:98%;
	}

	#header_graphic{
		z-index:600;
	}

	#navigation {
		width:100%;
	}
	#navigation ul li a, #navigation ul li a:visited {	
		padding-left: 12px;
		padding-right: 12px;
	}

	
	#menu ul li a, #menu ul li a:visited {

		height:auto;
		padding-left: 2%;
		width: 98%;
	}
	#menu ul li ul li a, #menu ul li ul li a:visited{
		padding-left: 6%;
		width: 94%;
	}
	#menu ul li ul li ul li a, #menu ul li ul li ul li a:visited{
		padding-left: 10%;
		width: 90%;
	}	
	.menu_header {
		padding-left: 2%;
		width: 98%;
	}
	
	/*--------------- Bespoke --------------*/
	/*----------------------------------------*/

}

/*Small Tablet Sized */
@media (max-width: 767px) {
	/*--------------- Structure --------------*/
	/*----------------------------------------*/
	
	h2, h3 {
		font-size:1.4em;
	}

	p, ul li {
		font-size:1.2em;
	}

	.hideOnSmallTablet{
		display:none;
	}
	.showOnSmallTablet{
		display:block;
	}
	
	#wrap{
		padding-left:2%;
		padding-right:2%;
		width:96%;
	}
	
	#header-right, #header-left {
    	padding-top: 5px;
		width: 100%;
	}
	#header_graphic{
		float:left;
		z-index:700;
	}
	
	#header-right .strapline {
		font-size: 1.2em;
		margin-bottom: 14px;
		padding-top:10px;
	}
	
	#nav-tel {
		display:none;
	}
	#nav-tel-mobile {
		display:block;
		color: #ffffff;
    	float: right;
    	padding-top: 0px;
    	margin-bottom: 0px;
	}
	
	#wrapper-navigation {
		height:2px;
	}
	
	#navigation-inner{
		padding-left:0%;
		padding-right:0%;
		width:100%;
	}
	
	#navigation{	
		float:none;
		border-bottom:0px;
		margin:0px;
		width:100%;
		position:absolute;	
		top:-46px;
	}
	#navigation ul{	
		background-color:#212121;
		border:1px solid #333333;
		border-top: 1px solid #ccc;
		position: absolute;
		top:48px;
		right:0px;
		z-index:600;
		display:none;
		width:100%;
	}
	#nav-icon {
		display: block;
		background-image:url(../images/nav-mobile.gif);
		background-repeat:no-repeat;
		float:right;
		margin-right:2%;
		height:31px;
		width:34px;
	}

	#navigation ul li {
		display: block;
		margin-top:0px;
	}
	#navigation ul li a, #navigation ul li a:visited, #navigation ul #nav-first a{
		border-bottom:1px solid #cccccc;
		border-right:none;
		float:none;
		font-size:15px;
		padding-top:8px;
		padding-bottom:8px;
		padding-left:2%;
		padding-right:2%;
	}	
	
	.closed{
		display:none;
	}
	.open{
		display:block !important;	
	}
	
	.textarea {
		width:500px;
	}
	.textarea p {
    	font-size: 1.8em;
	}

	#contact-content, #divMap {
		margin-right:0px;
		width:100%;
	}

	#divMap {
		padding-top:0px;
	}
	
	label{
		float:none;
	}
	.submitButton {
		margin-left:0px;
		/*margin-bottom:24px;*/
	}
	
	.contactInputLarge {
		max-width:326px;
		padding-left:2%;
		padding-right:2%;
		width:95%;
	}
	
	#foot-quote-left, #foot-quote-right {
		float:none;
		padding-right:0px;
		width:100%;
	}
	#foot .contactInputLarge {
    	width: 96%;
    	padding: 2%;
    	max-width: 100%;
	}
	
	/*--------------- Bespoke --------------*/
	/*----------------------------------------*/
	
	.Template3colColumn, .TemplateColumnLast, .galleryImage, .galleryLast {
		display:block;
		float:none;
		margin-right:auto !important;
		margin-left: auto;
		max-width:460px;
		width:100%;
	}
	
	.Template3colColumn .Template3colTitle p {
		font-size:1.2em;
	}

	.galleryImage, .galleryLast {
		max-height:260px;
	}


	#contact-details, #contact-enquiry {
		margin:0px;
		width:100%;
	}

	#contact-details .contactInputLarge, #contact-enquiry .contactInputLarge {
		width: 95%;
	}

	#contact-details label, #contact-enquiry label {
		width:100%;
	}

	.submitButton {
		float:left;
	}

	#recaptcha-contact {
		float: left;
		margin-right:0px;
	}
	.recaptcha-error {
		float:left;
		}
	
}

@media (max-width: 639px) {
 	/*--------------- Structure --------------*/
	/*----------------------------------------*/
	.textarea {
		width:400px;
	}
	.textarea p {
    	font-size: 1.6em;
	}

	img.alignRight, img.alignLeft{
		display:block;
		float:none;
		margin-left:auto;
		margin-right:auto;
		width:100%;
	}
	
	#testimonial-container {
    	padding-top: 14px;
	}
	#testimonial-controls {
		display:none;
	}
	#testimonial-controls-responsive {
		display: block;
		padding-bottom: 10px;
		position: relative;
		top: auto;
		height: 48px;
		width: 100%;
	}
	.testimonail-prev, .testimonail-next {
    	width: 48px;
	}
	
	#testimonial-content {
    	width: 96%;
	}
}


/*Mobile Sized */
@media (max-width: 480px) {
 	/*--------------- Structure --------------*/
	/*----------------------------------------*/
	
	.hideOnPhone{
		display:none;
	}
	.showOnPhone{
		display:block;
	}
	
	#footerright {
		float:left;
		margin-top:20px;
		position: relative;
		width:100%;
	}
	#footerright ul li {
		width:100%
	}
	
	img.ImgFloatRightNoBorder, img.ImgFloatLeftNoBorder, img.ImgFloatNoneNoBorder, img.alignRight, img.alignLeft{
		float:none;
		display:block;
		margin:0px;
		margin-bottom:12px;
	}
	
	#header-right {
		display:none;
	}
		
	#header_graphic{
		float:none;
		z-index:800;
	}
		
	#navigation{	
		top:-40px;
	}
	#navigation ul {
		top:42px;
	}
	
	#nav-tel-mobile {
		float: none;
    	margin-top: 14px;
		margin-right:40px;
		position: relative;
    	z-index: 100;
	}

	p, ul li {
		font-size:1.2em;
	}
	h1 {
		font-size: 1.6em;
	}

	iframe {
		width: 100%;
	}
	
	/*--------------- Bespoke --------------*/
	/*----------------------------------------*/
	
	.Template3colColumn, .galleryImage {
		width: 96%;
		margin-right: 2% !important;
		margin-left: 2%;
	}
	
	#map-wrap, #map-placeholder, #map-wrap{ 
		height:300px;
	}
	
	#divMapCanvas {
    	height: 280px;
	}

	.newsitem{
		float:none;
		width:100% !important;
		max-width:300px !important;
		margin-right:0% !important;
	}	

	.newsdate{
		left:auto;
		right:0px;
	}	
}