/* SLIMBOX */

#lbOverlay {
	position: fixed;
	z-index: 9999;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	cursor: pointer;
}

#lbCenter, #lbBottomContainer {
	position: absolute;
	z-index: 9999;
	overflow: hidden;
	background-color: #fff;
}

.lbLoading {
	background: #fff url(loading.gif) no-repeat center;
}

#lbImage {
	position: absolute;
	left: 0;
	top: 0;
	border: 10px solid #fff;
	background-repeat: no-repeat;
}

#lbPrevLink, #lbNextLink {
	display: block;
	position: absolute;
	top: 0;
	width: 50%;
	outline: none;
}

#lbPrevLink {
	left: 0;
}

#lbPrevLink:hover {
	background: transparent url(prevlabel.gif) no-repeat 0 15%;
}

#lbNextLink {
	right: 0;
}

#lbNextLink:hover {
	background: transparent url(nextlabel.gif) no-repeat 100% 15%;
}

#lbBottom {
	font-family: Verdana, Arial, Geneva, Helvetica, sans-serif;
	font-size: 10px;
	color: #666;
	line-height: 1.4em;
	text-align: left;
	border: 10px solid #fff;
	border-top-style: none;
}

#lbCloseLink {
	display: block;
	float: right;
	width: 66px;
	height: 22px;
	background: transparent url(closelabel.gif) no-repeat center;
	margin: 5px 0;
	outline: none;
}

#lbCaption, #lbNumber {
	margin-right: 71px;
}

#lbCaption {
	font-weight: bold;
}

/* Slideshow */
.slideshow {
	background-color: white;
	position: relative;
}

.slideshow a {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	margin: 10px;
}

.slideshow a.current {
	display: block;
	position: relative;
}

.slideshow .prev {
	left: 0;
}

.slideshow .next {
	right: 0;
}

.slideshow .next, .slideshow .prev {
	color: white;
	position: absolute;
	top: 50%;
	background: rgba(50,50,50,0.8);
	z-index: 4;
	font-size: 2em;
	padding: 10px;
	margin-top: -1em;
	cursor: pointer;
}

.slideshow .next:hover, .slideshow .prev:hover {
	background: rgb(50,50,50);
}

/* Site */
body {
	font-size: 100%;
	width: 100%;
}

img {
	max-width: 100%;
}

.top-points {
	background: #F3F3F3;
	margin: 0;
}

.top-points  div {
	width: 980px;
	margin: 0 auto;
	color: #202020;
	font-size: 60%;
	text-transform: uppercase;
	overflow: auto;
}

.top-points ul li {
	float: left;
	margin: 0 0 5px 20px;
}

.banner div {
	width: 980px;
	margin: 0 auto;
	position: relative;
}

.banner .links {
	position: absolute;
	top: 0;
	right: 0;
	width: auto;
}

.banner .links ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
}

.banner ul li {
	padding: 7px;
	display: table-cell;
	position: relative;
}

.banner > div > div > ul:first-child + ul {
	float: right;
}

.banner > div > div > ul:first-child > li {
	border-right: 1px solid #C0C0C0;
	border-bottom: 1px solid #C0C0C0;
}

.banner > div > div > ul:first-child + ul > li {
	border-right: 1px solid #C0C0C0;
}

.banner #cart > div, .banner #favorites > div {
	display: none;
	position: absolute;
	right: 0;
	top: 100%;
	width: 200px;
	color: #333333;
	background: #FAFAFA;
	padding: 10px;
	z-index: 10;
}

.banner #cart:hover, .banner #favorites:hover {
	background: #FAFAFA;
}

.banner #cart:hover > div, .banner #favorites:hover > div  {
	display: block;
}

header h3 {
	font-size: 90%;
	font-family: Georgia, serif;
	font-weight: bold;
	margin: 0;
	text-transform: uppercase;
	display: inline-block;
}

header nav {
	background: #E20014;
}

header nav div {
	width: 980px;
	margin: 0 auto;
	position: relative;
}

header nav ul {
	list-style-type: none;
	margin: auto;
	padding: 0;
}

header nav div > ul > li {
	display: inline-block;
	color: white;
	position: relative;
}

header nav div > ul > li  a {
	color: inherit;
	text-decoration: none;
	text-transform: uppercase;
	font-weight: normal;
	font-size: 90%;
	font-family: Georgia, serif;
	padding: 10px 20px 10px 20px;
	display: inline-block;
}

header nav div > ul > li:hover {
	color: #333333;
	background: #FAFAFA;
	cursor: pointer;
}

header nav div > ul > li > ul {
	display: none;
	position: absolute;
	left: 0;
	top: 100%;
	color: #333333;
	background: #FAFAFA;
	padding: 10px 0 10px 0;
	z-index: 10;
	min-width: 100%;
	white-space: nowrap;
}

header nav div > ul > li > ul > li {
	padding: 5px 20px;
}

header nav div > ul > li > ul > li:hover {
	color: white;
	background: #999999;
}

header nav div > ul > li > ul > li > ul {
	display: none;
	position: absolute;
	color: #333333;
	background: #FAFAFA;
	top: 0;
	left: 100%;
	height: 100%;
	padding: 0;
	border-left: 1px solid #999999;
	z-index: 10;
}

header nav div > ul > li > ul > li > ul > li {
	padding: 5px 20px;
}

header nav div > ul > li > ul > li > ul > li a {
	font-weight: normal;
	font-family: sans-serif;
	font-size: 80%;
}

header nav div > ul > li > ul > li > ul > li:hover {
	color: white;
	background: #999999;
}

.menuBox {
	display: block;
	width: 350px;
	position: absolute;
	top: 0;
	left: 100%;
	background-color: #FAFAFA;
	bottom: 0;
	border-left: 1px solid #999999;
}

.content {
	width: 980px;
	margin: 0 auto;
}

.content nav, .content nav a  {
	font-size: 90%;
	color: #C0C0C0;
	text-decoration: none;
}

.content nav a:hover {
	color: #666666;
}

.leftPane {
	width: 200px;
	display: inline-block;
	vertical-align: top;
}

.rightPane {
	display: inline-block;
	vertical-align: top;
	max-width: 780px;
}

.items {
	position: relative;
}

.item {
	display: inline-block;
	width: 240px;
	padding: 10px;
	margin-top: -1px;
	margin-left: -1px;
	position: relative;
	white-space: normal;
	overflow-wrap: break-word;
}

.item:after {
	content:''; 
	width: 240px; 
	height: 1px;
	background: #C0C0C0;
	position: absolute;
	left: 10px;
	bottom: -1px;
}

.item a {
	color: #4f4d4c;
	text-decoration: none;
	font-size: 110%;
}

.item .price {
	font-size: 120%;
	font-weight: bold;
	color: #E20015;
}

.item .price span {
	font-size: 120%;
}

.item .oldPrice {
	font-size: 80%;
	color: #808080;
}

.item .sizeBox {
    border: 1px solid #CFCFCF;
	padding: 0 10px;
	margin: 2px 10px 2px 0;
	white-space: pre;
}

.line-through {
	text-decoration: line-through;
}

.margin-ten {
	margin: 10px 0;
}

.item .options {
	position: absolute;
	top: 10px;
	left: 10px;
	right: 10px;
}

.item .onlineOnly, .item .new, .item .discount {
	float: right;
	width: 58px;
	height: 58px;
	line-height: 58px;
	text-align: center;
	color: white;
	font-size: 80%;
	font-weight: bold;
	/*opacity: 0.5; */
}

.item .discount {
	font-size: 100%;
	background-image: url(/images/discount.png);
}

.item .new {
	background-image: url(/images/new.png);
}

.item .onlineOnly {
	background-image: url(/images/online-only.png);
}

.item .onlineOnly span {
	display: inline-block;
	vertical-align: middle;
	line-height: normal;  
}

.itemImage {
	width: 60%;
	border: 1px solid #C0C0C0;
}

.itemImage img {
	height: 490px; 
	aspect-ratio: 560 / 490;
}

.itemDetails {
	float: right;
	width: 38%;
	border-top: 1px solid #C0C0C0;
	padding-top: 10px;
}

.itemDetails .name {
	color: #303030;
	font-size: 120%;
	font-weight: bold;
	padding: 30px 0;
	border-bottom: 1px solid #C0C0C0;
}

.itemDetails .price {
	color: #E20015;
	font-size: 180%;
	font-weight: bold;
	padding: 30px 0;
}

.itemImages {
	clear: both;
}

.itemImages img {
	padding: 10px;
}

.itemTabs > input[type=radio] {
	display: none;
}

.itemTabs .tabs {
	list-style-type: none;
	margin: 0;
	padding-left: 0;
	padding-bottom: 10px;
	border-bottom: 1px solid #C0C0C0;
}

.itemTabs .tabs:focus {
	outline: none;
}

.itemTabs .tabs li {
	display: inline-block;
}

.itemTabs .tabs label {
	padding: 10px;
	font-family: Georgia, serif;
	border: 1px solid #C0C0C0;
	cursor: pointer;
}

input[id=t1]:checked ~ .tabs label[for=t1],
input[id=t2]:checked ~ .tabs label[for=t2],
input[id=t3]:checked ~ .tabs label[for=t3],
input[id=t4]:checked ~ .tabs label[for=t4] {
	border-bottom: 2px solid white;
}

.itemTabs .sections {
	padding: 0;
	border-left: 1px solid #C0C0C0;
	border-right: 1px solid #C0C0C0;
}

.itemTabs .sections > div {
	display: none;
	padding: 10px;
	color: #4f4d4c;
	font-size: 80%;
}

.itemTabs .sections h5 {
	margin: 3px 0;
	font-size: 100%;
}

.itemTabs .sections h4 {
	margin: 5px 0;
	font-size: 110%;
	text-decoration: underline;
}


input[id=t1]:checked ~ .sections div[id=s1],
input[id=t2]:checked ~ .sections div[id=s2],
input[id=t3]:checked ~ .sections div[id=s3],
input[id=t4]:checked ~ .sections div[id=s4] {
	display: block;
}

#addToCartCount {
	width: 40px;
	height: 30px;
	font-size: 160%;
	padding: 2px;
}

.actionButton {
	padding: 10px;
	background: #E20014;
	border: none;
	color: white;
	text-transform: uppercase;
	font-weight: normal;
	font-size: 90%;
	font-family: Georgia, serif;
	vertical-align: top;
	display: inline-block;
	text-decoration: none;
}

.secondaryButton {
	padding: 10px;
	background: transparent;
	border: none;
	color: black;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 90%;
	font-family: Georgia, serif;
}

#cart, #favorites {
	font-size: 90%;
}

#cart td , #cart th, #favorites td, #favorites th {
	padding: 10px;
	text-align: center;
	border: solid 1px black;
}

#cart th, #favorites th {
	font-weight: normal;
	text-transform: uppercase;
}

#cart tfoot td, #favorites tfoot td {
	border: none;
}

#cart .price, #orderPreview .price {
	font-size: 120%;
	font-weight: bold;
	color: #303030;
}

#orderPreview td {
	text-align: right;
}

table#cart .actionButton, table#favorites .actionButton {
	font-family: sans-serif;
}

.form label {
	display: block;
	margin-top: 5px;
}

.form fieldset {
	position: relative;
	margin-top: 38px;
}

.form fieldset legend {
	font-size: 90%;
	position: absolute;
	top: -30px;
	left: 0;
	height: 20px;
	background: #666666;
	color: white;
	padding: 5px;
	text-transform: uppercase;
}

.form label span {
	display: inline-block;
	width: 140px;
	text-align: right;
	vertical-align: top;
}

.form label input[type="radio"] {
	margin-left: 30px;
}

.form .required:before {
	content: "* ";
	color: red;
}

section {
	margin-bottom: 10px;
}

section h2 {
	font-size: 90%;
	text-transform: uppercase;
}

.leftPane > section > h3 {
	font-size: 90%;
	font-weight: bold;
	margin: 0;
	text-transform: uppercase;
}

footer {
	background: #464646;
	position: relative;
}

footer > div {
	left: 50%;
	margin-left: -490px;
	width: 980px;
	position: relative;
	padding: 10px 0;
}

footer table {
	width: 100%;
	table-layout: fixed;
}

footer td {
	width: 20%;
	padding: 0 10px;
	border-right: 1px solid #C0C0C0;
}

footer td:last-child {
	border: none;
}

footer h3 {
	margin: 0;
	text-transform: uppercase;
	color: white;
	font-size: 80%;
	font-weight: normal;
}

footer h3 > a {
	text-decoration: none;
	color: white;
}

footer td > a, footer div > a, footer p > a {
	display: block;
	text-decoration: none;
	color: #C0C0C0;
	font-size: 80%;
}

@media screen and (max-width: 980px) {
	.top-points  div {
		width: 100%;
	}
	
	.banner div {
		width: 100%;
	}
	
	header nav div {
		width: 100%;
	}
	
	.content {
		width: 100%;
	}
	
	.leftPane {
		width: 100%;
		display: block;
	}

	.rightPane {
		display: block;
		max-width: auto;
	}

	.itemDetails {
		padding: 5px;
	}

	footer > div {
		left: 0;
		margin-left: 0;
		width: 100%;
	}
}

@media screen and (max-width: 760px) {
	.top-points {
		display: none;
	}
	
	.itemTabs .tabs {
		border-bottom: none;
	}

	.itemTabs .tabs li {
		display: block;
	}
	
	.itemTabs .tabs label {
		display: none;
	}
	
	.itemTabs .tabs:focus label {
		display: block;
		border-bottom: 1px solid #C0C0C0;
	}
	
	input[id=t1]:checked ~ .tabs label[for=t1],
	input[id=t2]:checked ~ .tabs label[for=t2],
	input[id=t3]:checked ~ .tabs label[for=t3],
	input[id=t4]:checked ~ .tabs label[for=t4] {
		display: block;
		border-bottom: 1px solid #C0C0C0;
	}
	
	input[id=t1]:checked ~ .tabs label[for=t1]:before,
	input[id=t2]:checked ~ .tabs label[for=t2]:before,
	input[id=t3]:checked ~ .tabs label[for=t3]:before,
	input[id=t4]:checked ~ .tabs label[for=t4]:before {
		content: '\00271A';
		margin-right: 10px;
		font-weight: bold;
	}
	
	#itemAdded {
		width: 100%;
	}
}

@media screen and (max-width: 630px) {
	.banner > div > a {
		display: block;
	}

	.banner .logo {
		display: block;
	}

	.banner .links {
		position: static;
	}

	.banner > div > div > ul:first-child {
		margin-left: 0;
	}

	.banner > div > div > ul:first-child + ul {
		float: none;
	}

	.banner > div > div > ul > li {
		border: 1px solid #C0C0C0;
	}

	header nav div > ul > li {
		display: block;
	}

	header nav div > ul > li > ul {
		position: static;
		left: 0;
		top: 0;
	}
	
	.itemImage {
		width: 100%;
	}

	.itemDetails {
		float: none;
		width: 100%;
		overflow: auto;
	}
		
	footer td {
		width: auto;
		padding: 10px;
		border: none;
	}

	footer > div > div > table > tbody {
		display: block;
	}

	footer > div > div > table > tbody > tr {
		display: block;
	}

	footer > div > div > table > tbody > tr > td {
		display: block;
	}
}