/* Mobile-specific styles for beststainless.com */
@media only screen and (max-width: 767px)
{
    #sidebar-left
    {
        display: none;
    }
	#page-weight-calculator #calc .right, #page-weight-calculator #calc .right img
	{
		width: auto;
	}

	#page-weight-calculator #calc .right, #page-weight-calculator #calc
	{
		padding: 0;
	}

	.calcbut
	{
		bottom: 0 !important;
		float: none;
		right: auto;
	}

	.tablemes
	{
		height: auto;
	}

	#page-weight-calculator select, #page-weight-test select
	{
		width: auto !important;
	}

	.finalcalc
	{
		bottom: auto;
		right: auto;
		top: 400px;
	}

	.finalcalc input
	{
		display: block;
		left: 0;
		margin: 0;
	}

	/* Firefox-specific styles using feature queries to target Firefox */
	@supports (appearance: none)
	{
		#wrap, #footer-bottom-1, #footer-bottom-2, #header
		{
			min-width: 100%;
		}
	}

	img.left, img.right, ul.left, ul.right
	{
		float: none;
		margin: 10px auto;
	}

	#hero-banner,
	#header-content,
	#home-buckets,
	#content-wrap,
	.content-top .content-top-content,
	#breadcrumb-wrapper > ul,
	.tpl-3 #content,
	.tpl-4 #content,
	#sidebar-right,
	.landing-banner,
	#footer-top-content,
	#footer-content,
	#footer-bottom-1-content,
	#footer-bottom-2-content
	{
		margin: auto;
		min-width: 100%;
		padding: 10px 0;
		position: relative;
		width: 100%;
	}

	#home-buckets
	{
		display: none;
	}

	#home-buckets,
	#footer-top-content,
	#sidebar-left,
	#content,
	#sidebar-right
	{
		padding: 10px 20px !important;
	}

	.home-bucket,
	#footer-top
	{
		min-width: 100%;
	}

	#footer-top-content h3
	{
		width: 100%;
	}

	/* Mobile menu adjustments */
	#mobile-btn-wrapper
	{
		height: 60px;
		margin: auto;
		position: relative;
		width: 100%;
	}

	#mobile-nav-btn
	{
		left: 0;
	}

	.searchWrap
	{
		width: 65%;
	}

	.search
	{
		margin: 0;
		padding: 18px;
		width: auto;
	}

	.searchWrap i
	{
		font-size: 32px;
		margin: 0;
		position: absolute;
		right: 20px;
		top: 5px;
	}

	#telephone-toll
	{
		bottom: -55px;
		left: 80px;
		width: 160px;
	}

	#telephone-toll p
	{
		color: white;
		font-family: "Roboto Slab", sans-serif;
		font-size: 20px;
		font-weight: 700;
	}

	#telephone-toll i
	{
		background-color: #367edf;
		border-radius: 30px;
		color: #1751a0;
		display: inline-block;
		padding: 3px 6px;
	}

	#telephone-toll span
	{
		display: none;
	}

	.mobile-phone
	{
		display: block;
		font-size: 40px;
		padding-right: 30px;
		padding-top: 30px;
		text-align: right;
	}

	#telephone-international
	{
		display: none;
	}

	/* Quick contact form adjustments */
	.qc-form-style .qc-right, .qc-form-style .qc-left
	{
		display: block;
		width: 100% !important;
	}

	/* Hero banner adjustments */
	#hero-banner
	{
		height: 160px;
		overflow: hidden;
		width: 100%;
	}

	#hero-banner video
	{
		margin-top: -40px;
	}

	#hero-overlay
	{
		height: 160px;
		margin-top: -160px;
		min-height: 100px;
	}

	/* Removed ::-webkit-media-controls due to vendor-specific pseudo-element */
	#hero-overlay > div
	{
		width: 100%;
	}

	#hero-overlay > div h3
	{
		font-size: 18px;
	}

	#hero-overlay > div h3 span
	{
		font-size: 30px;
	}

	#hero-overlay > div h1
	{
		font-size: 32px;
	}

	#hero-overlay > div h1 span
	{
		font-size: 30px;
	}

	#hero-overlay .rfq-btn
	{
		margin-top: 20px;
	}

	
	/* Hide specific h3 in content-top section */
	.content-top-content h3
	{
		display: none !important;
		visibility: hidden;
	}

	#hero-caption
	{
		display: none;
	}

	/* Global navigation adjustments */
	#global-nav
	{
		left: 130px;
		padding-left: 0;
		width: 200px;
	}

	#global-nav li
	{
		display: none;
	}

	#global-nav li.first
	{
		display: block;
	}

	#global-nav .triangle
	{
		display: block;
	}

	/* Home bucket adjustments */
	.home-bucket
	{
		background-color: #0f3b78;
		background-image: url("../images/mobile_arrow.png");
		background-position: 96% center;
		background-repeat: no-repeat;
		height: 60px;
		margin: 5px 0;
	}

	.home-bucket:hover
	{
		background-color: #307be2;
	}

	.home-bucket h3
	{
		background: none;
		border-left: 10px solid #dfaa19;
		font-weight: bold;
		height: 40px;
		line-height: 40px;
		margin-left: 10px;
		margin-top: 10px;
		padding-left: 20px;
	}

	#page-index #content-wrap
	{
		display: none;
	}

	/* Footer adjustments */
	#footer-top
	{
		padding-bottom: 10px;
		padding-top: 0;
	}

	#footer-top-content h3
	{
		border: 2px solid #b9bcc1;
		font-size: 10px;
		margin: 10px 0;
		padding: 20px 10px;
		text-align: left;
	}

	#footer-product-links
	{
		display: none;
		position: absolute;
		width: 88%;
		z-index: 100;
	}

	#footer-product-links.active
	{
		display: block;
	}

	#footer-content .box
	{
		display: none;
		padding: 10px;
		width: 100%;
	}

	#footer-content .box.cert
	{
		display: block;
	}

	#footer-content .box.cert img
	{
		position: absolute;
		right: 50px;
		top: 5px;
		width: 60px;
	}

	#footer-logo
	{
		display: none;
	}

	#footer-bottom-1-content .telephone
	{
		margin: 5px 0;
		padding: 10px;
		text-align: left;
	}

	#footer-link
	{
		background-color: #367edf;
		padding: 10px 0;
		text-align: center;
		width: 100%;
	}

	#footer-link-2
	{
		background-color: #1751a0;
		padding: 10px;
		text-align: center;
		width: 100%;
	}

	#footer-link-2 li i
	{
		color: white;
		font-size: 18px;
	}

	#footer-bottom-2-content
	{
		margin: 0;
		padding: 0;
		width: 100%;
	}

	.content-top h1,
	.content-top h3
	{
		padding: 0 1em;

	}

	/* Standard bucket adjustments */
	.standard-bucket
	{
		background-color: #0f3b78;
		background-image: url("../images/mobile_arrow.png");
		background-position: 290px center;
		background-repeat: no-repeat;
		height: 60px;
		margin: 5px 0;
		width: 100%;
	}

	.standard-bucket:hover
	{
		background-color: #0f3b78;
	}

	#content img
	{
		height: auto !important;
		margin: 0 !important;
		width: 100%;
	}

	/* ===== HORIZONTAL SCROLL TABLE SOLUTION ===== */
	/* Create scrollable container for tables */
	table, .table
	{
		display: table;
		width: auto;
	}
	
	/* Wrap tables in scrollable containers */
	table.tg-table, 
	#content table,
	.content-top table,
	#content-wrap table,
	.table
	{
		border-collapse: collapse;
		display: block;
		margin-bottom: 15px;
		max-width: 100%;
		overflow-x: auto;
		white-space: nowrap;
		width: 100%;
		-webkit-overflow-scrolling: touch;
	}
	
	/* Maintain table structure */
	table thead, 
	table tbody,
	table tr,
	table th, 
	table td
	{
		display: table-row-group;
		white-space: nowrap;
	}
	
	table tr
	{
		display: table-row;
	}
	
	table th, 
	table td
	{
		display: table-cell;
	}
	
	/* Add visual indicator that table can be scrolled */
	table.tg-table:after,
	#content table:after,
	.content-top table:after,
	#content-wrap table:after
	{
		color: #999;
		content: "\2190 Scroll \2192";
		display: block;
		font-size: 12px;
		padding: 5px;
		text-align: center;
	}

	/* Customer Satisfaction form adjustments */
	.customer-satisfaction .mobile-hidden
	{
		display: none;
	}

	#customer .customer-satisfaction .label
	{
		color: gray;
		display: inline;
		font-size: 10px;
		text-transform: uppercase;
	}

	.customer-satisfaction td
	{
		padding: 5px 0;
	}
}

#global-nav-bg-deco
{
	display: none;
}