/*--------------- 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;
}
*/


/*Apply to all Responsive*/
@media (max-width: 1200px) {
	/*--------------- Structure --------------*/
	/*----------------------------------------*/
	img{
		max-width: 100%;
		height: auto;
	}
	
	#centerc{
		margin-left:25%;
		width:75%;
	}
	#centerc-2col {
		margin-left: 22%;
		width: 78%;
	}

	#leftc{
		margin-left:-100%;
		padding-right:2%;
		width: 20%;
	}
	
	#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%;
	}
	
	#navigation {
		width:100%;
	}
	
	#navigation ul li a {
		font-size:16px;
		padding-right:20px;
	}
	#nav-products {
		padding-left:0px !important;
	}
	#nav-contact {
		padding-right:0px !important;
	}
	.nav-links {
		margin-right:2%;
		width:23%;
	}
	.nav-image {
		width:75%;
	}
	#navigation ul li ul {
		width:100%;
	}
	
	#centerc-1col {
		width: 100%;
	}
	
	.textarea .textline1 {
    	font-size: 50px;
	}
	.textarea .textline2 {
    	font-size: 30px;
	}
	
	#home-content p {
		text-align:left;
		padding-bottom:0px;
	}
	
	.newsitem{
		width:32%;
		margin-right:2%;
	}	
	.newsimage{
		height:auto;
		overflow:hidden;
		width:100%;
	}
	.newsdate{
		left:auto;
		right:0px;
	}
	
	.Template2colContainer {
    	width: 100%;
	}
	.Template2colColumn {
    	margin-right: 2%;
    	width: 49%;
	}
	.Template2colColumnLast {
    	width: 49%;
	}

}
/*Apply to all Responsive*/
@media (max-width: 999px) {
	/*--------------- Structure --------------*/
	/*----------------------------------------*/
	
	#centerc{
		margin-left:25%;
		width:75%;
	}
	#centerc-2col {
		margin-left: 25%;
		width: 75%;
	}

	#leftc{
		margin-left:-100%;
		padding-right:2%;
		width: 23%;
	}
	
	/*--------------- Bespoke --------------*/
	/*----------------------------------------*/
	
	#navigation ul li ul li{
		margin-bottom:0px;
	}
	#navigation ul li ul li a{
		padding-bottom:0px;
	}
	
	.homeboxes-header h3 {
		font-size:1.5em;
	}
	
	#map-wrap, #map-placeholder{ 
		width: 100%; 
	}
	#map-wrap img{
		display:block;
	}
	
	label {
		margin-right:0px;
		width:100%
	}
	.submitButton, #recaptcha-container {
		margin-left:0px;
	}
	
	
	/*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%;
	 } 
	
	#home-slider-wrapper .bx-controls {
		height: 65px;
		top: -255px;
		max-width: 976px;
		width:100%;
	}
	
	.textarea {
		padding-right:4%;
		padding-left:4%;
		width:92%;
	}
	.textarea .textline1 {
    	font-size: 40px;
	}
	
	.newsitem h2{
		font-size:1.4em;
		min-height:90px;
	}
	
	img.alignRight, img.alignLeft {
		width:50%;
	}

}

/*Large Tablet Sized */
@media (min-width: 768px) and (max-width: 999px) {
	/*--------------- 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 {
		font-size: 13px;
		padding-right: 9px;
	}
	
	#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 --------------*/
	/*----------------------------------------*/
	
	#homebox-left, #homebox-center, #homebox-right {
		padding-left: 2%;
		padding-right: 2%;
		width: 29%;
	}
	.homeboxes-content p {
    	font-size: 1.2em;
		min-height: 110px;
	}
	
	#divMapCanvas {
		height:360px;
		width:100%;
	}

	#sitelinks ul li a, #sitelinks p {
		font-size:0.9em; 
	}

}

/*Small Tablet Sized */
@media (max-width: 767px) {
	/*--------------- Structure --------------*/
	/*----------------------------------------*/
	
	.hideOnSmallTablet{
		display:none;
	}
	.showOnSmallTablet{
		display:block;
	}
	
	
	/* Force table to not be like tables anymore */
	#products-container table, #products-container thead, #products-container tbody, #products-container th, #products-container td, #products-container tr { 
		display: block; 
		padding:0px;
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	#products-container tr:first-child { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	#products-container tr { 
		width:100%;
	}
	
	#products-container td { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee; 
		position: relative;
		padding:6px; 
	}
	
	#products-container 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;
	}
	
	/*table tr td:nth-child(1){
		font-weight:bold;
	}*/
	
	#products-container table td span{
		display:inline-block;
		font-weight:bold;
		width:100%;
	}		
	
	 table.tableStyleA {
		border-bottom:none;
		padding:2%;
		width:100% !important;
	 }

	 #products-container table {
		border:0px;	
		padding:0px;
	}	
	 #products-container table td{
		border-bottom:1px solid #eee;
		cursor:pointer;
		padding:6px; 
	}
	
	#products-container .tableClosed{
		display:none;
	}	
	
	table.tableStyleA td, th {
		border-right:none;
		border-left:none;
		border-top:none;
		width:100%;
	}
	
	table.tableStyleA tr:nth-child(odd) {
		background-color: #ffffff;
	}
	table.tableStyleA tr td:nth-child(odd) {
		background-color: #d5e8f6;
	}
	
	#wrap{
		padding-left:2%;
		padding-right:2%;
		width:96%;
	}
		
	
	#header_graphic{
		z-index:700;
	}
	
	#header_graphic img {
		height:46px;
		width:auto;
	}

	#header-right {
		padding-right:90px;
	}
	
	#header-right #header-right-top, #header-right #header-right-bottom {
    	font-size: 1.4em;
	}

	.header-phone-number {
		display:none;
	}

	#header-phone {
		padding-right:0;
	}
	#header-contact {
		display:none;
	}
	
	#wrapper-navigation {
		background-color:#69a4cf;
		border-bottom:none;
		height:2px;
		padding:0px;
	}
	
	#navigation-inner{
		padding-left:0%;
		padding-right:0%;
		width:100%;
	}
	
	#navigation{
		float:none;
		border-bottom:0px;
		margin:0px;
		width:100%;
		position:absolute;	
		top: -22px;
	}
	#navigation ul{	
		background-color:#ffffff;
		position: absolute;
		top:24px;
		right:0px;
		z-index:600;
		display:none;
		width:100%;
	}
	#navigation ul li .subNav {
		display:none;
	}
	#nav-icon {
		display: block;
		float: right;
	  	width: 32px;
		height: 26px;
		top: -30px;
	  	right: 20px;
		/*margin-left: 26px;
		margin-top: 14px;*/
	  	position: absolute;
	  	-webkit-transform: rotate(0deg);
	  	-moz-transform: rotate(0deg);
	  	-o-transform: rotate(0deg);
	  	transform: rotate(0deg);
	  	-webkit-transition: .5s ease-in-out;
	  	-moz-transition: .5s ease-in-out;
	  	-o-transition: .5s ease-in-out;
	  	transition: .5s ease-in-out;
	  	cursor: pointer;
	}

	#nav-icon span {
		display: block;
		position: absolute;
		height: 2px;
		width: 100%;
		background: #fff;
		opacity: 1;
		left: 0;
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
		-webkit-transition: .25s ease-in-out;
		-moz-transition: .25s ease-in-out;
		-o-transition: .25s ease-in-out;
		transition: .25s ease-in-out;
	}

	#nav-icon span:nth-child(1) {
	  top: 2px;
	}

	#nav-icon span:nth-child(2),#nav-icon span:nth-child(3) {
	  top: 13px;
	}

	#nav-icon span:nth-child(4) {
	  top: 24px;
	}

	#nav-icon.open span:nth-child(1) {
	  top: 18px;
	  width: 0%;
	  left: 50%;
	}

	#nav-icon.open span:nth-child(2) {
	  -webkit-transform: rotate(45deg);
	  -moz-transform: rotate(45deg);
	  -o-transform: rotate(45deg);
	  transform: rotate(45deg);
	}

	#nav-icon.open span:nth-child(3) {
	  -webkit-transform: rotate(-45deg);
	  -moz-transform: rotate(-45deg);
	  -o-transform: rotate(-45deg);
	  transform: rotate(-45deg);
	}

	#nav-icon.open span:nth-child(4) {
	  top: 18px;
	  width: 0%;
	  left: 50%;
	}

	#navigation ul li {
		background-color: #ffffff;
		display: block;
	}
	#navigation ul li a, #navigation ul li a:visited{
		border-bottom:1px solid #cccccc;
		color: #003a63;
		cursor:pointer;
		display:block;	
		float:none;
		font-size: 14px;
		padding-top:12px;
		padding-bottom:12px;
		padding-left:2%;
		padding-right:2%;
	}
	#navigation ul li #nav-products {
		padding-left:2% !important;
		padding-right:2%;
	}
	
	.closed{
		display:none !important;
	}
	.open{
		display:block !important;	
	}
	
	
	#navigation ul li div.sub {
		border: 0px;
		position: static;
		top: auto;
		left: auto;
		display:none;
		height: auto;
		width: 100%;
	}
	
	#navigation ul li div.subNav {
		border: 0px;
		margin: 0px;
		padding: 0px;
		position: relative;
		top: 0px;
		left: 0px;
	}
	
	#navigation ul li div.subNav ul{
		border: 0px;
		position: relative;
		top: 0px;
		left: 0px;
		margin-left: 0px;
		padding:0px;
		width: 100%;
	}
	
	#navigation ul li div.subNav ul li{
		background-image:none;
		border-bottom:0px;
		margin-right:2%;
		margin-left:2%;
		width:96%;
	}
	
	#navigation ul li div.subNav ul li a, #navigation ul li div.subNav ul li a:visited {
		background-image: none;
		color: #242424;
		font-size: 12px;
		padding-bottom: 10px;
		padding-left: 2%;
		padding-right: 2%;
		padding-top: 10px;
		width: 96%;
	}
	#navigation ul li div.subNav ul li a:hover{
		background-image:none;
		color: #697176;	
	}
	
	.nav-links {
		margin-right:0px;
		width:100%;
	}
	.nav-image {
		float:none;
		clear:both;
		width:100%;
	}
	.nav-image img {
		display:none;
	}
	
	.navMobile {
		display:block !important;
	}
	
		
	#centerc{
		display: block;
		float:none;
		margin-left:0px;
		width:100%;
	}
	
	#centerc-2col {
		display: block;
		float: none;
		margin-left: 0px;
		padding-bottom:0px;
		width: 100%;
	}

	#leftc{
		float:none;
		margin-left:0px;
		padding-right:0px;
		width: 100%;
	}
	#leftc-prmetals-image {
		display:none;
	}
	#foot{
		width:100%;
	}
	#footerleft{
		float:none;
		width:100%;
	}
	#footerleft ul{
		position:static;
	}
	#footerright{
		float:none;
		width:100%;
	}
	
	#sitelinks ul {
		padding-left: 2%;
		padding-right: 2%;
		width: 29%;
	}
	#sitelinks ul li {
		font-size:1.2em;
	}
	#sitelinks ul li ul li a {
    	font-size: 0.8em;
	}
	
	label{
		float:none;
	}
	.submitButton {
		margin-bottom:24px;
	}
	
	.contactInputLarge {
		max-width:326px;
		padding-left:2%;
		padding-right:2%;
		width:95%;
	}
	
	/*--------------- Bespoke --------------*/
	/*----------------------------------------*/
	
	#leftc_images {
		margin-right: auto;
    	margin-left: auto;
		margin-bottom:15px;
    	width: 100%;
	}
	#leftc img {
		float:left;	
		margin-right:2%;
		width:23.5%;
	}
	#leftc img:nth-child(4) {
		margin-right:0px;
	}
	
	.textarea .textline1 {
    	font-size: 30px;
	}
	.textarea .textline2 {
    	font-size: 25px;
	}
	
	.newsitem h2{
		font-size:1.3em;
	}
	
	#divMap{
		width:100%;
	}
	#divMapCanvas {
		height:360px;
		width:100%;
	}
	#divMap h2 {
		margin-top:0px;
	}
}

@media (min-width: 481px) and (max-width: 639px) {

	#header-left {
		width:92px;
	}
	
	.textarea .textline1 {
    	font-size: 20px;
	}
	.textarea .textline2 {
    	font-size:17px;
	}
	
	#homeboxes-container {
		padding-bottom:0px;
	}
	
	#sitelinks ul li {
		font-size:1.1em;
	}
	#sitelinks ul li h4{
		font-size:1em;
	}
	#sitelinks ul li ul li a {
    	font-size: 0.9em;
	}
}

@media (max-width: 639px) {

	#header-right #header-right-top, #header-right #header-right-bottom {
		font-size:1.25em;
	}
	
	.homeboxes-content p, .homeboxes-content a {
		min-height:auto;
	}
	
	#leftc_images img {
		margin-top:10px;
	}
	
	.newsitem h2 {
		min-height:100px;
	}
	
	#contact-container table, #contact-container thead, #contact-container tbody, #contact-container th, #contact-container td, #contact-container tr { 
		display:block;
		width:100%;
	}
	#contact-container table {
		margin-bottom:20px;
	}

}

@media (max-width: 575px) {

	#slider-content {
		padding-top: 2rem!important;
		padding-bottom: 2rem!important;
	}

	#header-social {
		display:none !important;
	}

	.fabrications-box, .fabrications-box2 {
		background-color: transparent;
	}

	.fabrication-text, .fabrication-text2 {
		margin-bottom:20px;
	} 

	.fabrication-image p, .fabrication-image2 p {
		text-align: center;
	}
	
	.anniversary-logo, .iso-logo {
		width:120px
	}
	
	#anniversary-logo {
		width: 25% !important;
	}
	
	#sitelinks h2, #sitelinks p {
		text-align:center;
		font-size: 1.2em;
	}
	#sitelinks ul {
        padding-left: 2%;
        padding-right: 2%;
        width: 50%;
        flex: 50%;
        max-width: 50%;
    }
	
	#foot ul li:nth-child(1) {
		display:block;
		clear:both;
	}

}

/*Mobile Sized */
@media (max-width: 480px) {
 	/*--------------- Structure --------------*/
	/*----------------------------------------*/
	
	.hideOnPhone{
		display:none;
	}
	.showOnPhone{
		display:block;
	}
	
	#footerleft ul li {
		display:block;
	}
	#footerright ul li {
		display:block;
	}
	
	img.ImgFloatRightNoBorder, img.ImgFloatLeftNoBorder, img.ImgFloatNoneNoBorder, img.alignRight, img.alignLeft{
		float:none;
		display:block;
		margin:0px;
		margin-bottom:12px;
		width:auto;
	}
	
	#header-left, #header-right{
		clear:both;
		float:none;
	}
	#header-right #header-right-top, #header-right #header-right-bottom{
		text-align:left;
	}
		
	#header_graphic{
		z-index:800;
	}
	#header_graphic img {
		display:block;
		margin:auto;
	}

	iframe {
		width: 100%;
	}
	
	/*--------------- Bespoke --------------*/
	/*----------------------------------------*/
	
	#leftc_images {
		margin-right:auto;
		margin-left:auto;
    	width: 304px;
	}
	#leftc_images img {
		margin-top:10px;
		margin-right:10px;
		width:147px;
	}
	#leftc img:nth-child(2) {
		margin-right:0px;
	}
	
	#home-content-mobile p {
    	font-size: 1.3em;
		padding-bottom:0px;
	}
	#homeboxes-container {
    	padding-bottom: 0px;
	}
	
	#map-wrap, #map-placeholder, #map-wrap{ 
		height:300px;
	}	

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

	.newsdate{
		left:auto;
		right:0px;
	}
	
	.newsitem h2 {
		min-height:auto;
	}
	.Template2colContainer {
    	margin-bottom: 0px;
	}
	.Template2colColumn, .Template2colColumnLast {
    	display: block;
		float: none;
		margin-right: auto;
    	margin-left: auto;
		min-width:310px;
		max-width:450px;
    	width: auto;	
	}
	
	#sitelinks {
		padding-top:10px;
		padding-bottom:10px;
	}
	#sitelinks ul {
		float:none;
		padding-right:2%;
		padding-left:2%;
		width:96%;
	}
	
	#divMapCanvas {
		height:260px;
	}
	
	#foot ul li {
		display:block;
		clear:both;
		padding: 8px 15px;
		text-align:center;
	}
	
}