﻿/*Styles for screen 650px and lower*/
@media screen and (max-width: 650px)
{
	.sBanner
	{
		width: 100% !important;
		text-align: CENTER;
		top: 0;
		clear: both;
		position: relative;
		left: 0;
	}
	.topContent .menuMember, .topContent .cartTop
	{
		clear: both;
		overflow: hidden;
		width: 100%;
	}
	.mainContent
	{
		clear: both;
		width: 98% !important;
		margin-right: 5px;
		margin-left: 5px;
	}
	.Right
	{
		clear: both;
		width: 98% !important;
	}
	.divBanner
	{
		background-color: #fff;
	}
	#divRight
	{
		width: 100%;
		margin-left: 5px;
	}

	.breadcrumbs
	{
		clear: both;
		position: relative;
		height: auto;
	}
	.breadcrumbs .pnSearch
	{
		position: relative;
		clear: both;
		left: 5px;
	}

	.leftBoxContainer
	{
		width: 46%;
		float: left;
		margin: 1%;
	}
	.FooterBox
	{
		width: 100%;
	}
	.FooterCopyright
	{
		width: 100%;
	}

	.newsItem img
	{
		width: 27% !important;
	}
	.newsItem .title
	{
		width: 70% !important;
		padding-top: 0px;
	}
	.newsItem .desc
	{
		width: 70% !important;
	}

	.ProImg
	{
		width: 100% !important;
		text-align: center;
	}
	.ProInfo
	{
		width: 100% !important;
	}
	.ProImg .brand h2
	{
		width: 100%;
	}

	.ProBoxGalleryOther
	{
		width: 44%;
	}
	.ProBoxGalleryHome
	{
		width: 44%;
	}

	.FooterBox
	{
		width: 100%;
	}
	.FooterCopyright
	{
		width: 100%;
	}
	.FooterMenu
	{
		clear: both;
		height: auto;
		width: 100%;
	}
	.FooterMenu ul
	{
		margin: 0px;
		border: none;
		width: 45%;
	}
	.FooterMenu ul li
	{
		display: block;
		width: 45%;
		float: left;
		margin: 1px;
		border: 0px;
		padding: 5px;
		border-radius: 3px;
	}
	.topmenu
	{
		display: block;
	}
	.mnTop
	{
		height: auto;
		border-bottom: none;
	}

	.topmenu
	{
		display: none;
	}

	.nContent table, thead, tbody, th, td, tr
	{
		display: block;
	}

	/* Hide table headers (but not display: none;, for accessibility) */
	.nContent thead tr
	{
		position: absolute;
		top: -9999px;
		left: -9999px;
	}

	.nContent tr
	{
		border: 1px solid #ccc;
	}

	.nContent td
	{
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee;
		position: relative;
		padding-left: 1%;
	}

	.nContent 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;
	}

	nav
	{
		height: auto;
	}
	nav ul
	{
		width: 100%;
		display: block;
		height: auto;
	}
	nav a#pull
	{
		display: block;
		background-color: #016bb7;
		width: 100%;
		position: relative;
		padding: 7px 15px;
		color: White;
		font-size: 10pt;
	}
	nav a#pull:after
	{
		content: "";
		background: url('../../images/nav-icon.png') no-repeat;
		width: 30px;
		height: 30px;
		display: inline-block;
		position: absolute;
		right: 35px;
		top: 5px;
	}
	nav li
	{
		width: 49%;
		float: left;
		position: relative;
	}
}
