﻿/* 

20 GLOBAL STYLES
285 Homepage
304 News Ticker
368 BUTTONS
420 CUSTOMIZE THE NAVBAR
533 Leftnav
606 Back to Top
633 Topbar
764 Pagination
818 Category Page
962	Category Page (small thumbs)
1110 product page
1289 cart
1483 Shipping
1496 Support / Account
1614 Contact 
1729 Genres
1738 Signin
1821 Footer
2004 My Collection
1901 Responsive
	1906 max-width: 1330px
	1920 max-width: 1280px
	1934 max-width: 1340px
	1944 min-width: 768px
	1955 min-width: 992px
	1964 max-width: 992px
	2030 max-width: 768px
	

GLOBAL STYLES
-------------------------------------------------- */

body, p, div, h1,h2,h3, .item2, #topbar, .navbar {
	font-family: "Montserrat", sans-serif;
	/* -webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility; */
}

.bkg {
	background-color: #ffffff;
	background-image: url("data:image/svg+xml,%3Csvg width='6' height='6' viewBox='0 0 6 6' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23e5e5e5' fill-opacity='0.29' fill-rule='evenodd'%3E%3Cpath d='M5 0h1L0 6V5zM6 5v1H5z'/%3E%3C/g%3E%3C/svg%3E");
}


img {border:none;}
label {font-weight: 400;margin-bottom:0px;}
li.square {list-style-type: square;line-height: 1.8em;}
.table-bordered {background-color: #fff;}

a {
	-o-transition:.4s;
  	-ms-transition:.4s;
  	-moz-transition:.4s;
  	-webkit-transition:.4s;
	transition:.4s;
}

div#breadcrumbs {
	background-color: #f4f4f4;
	/* padding:6px 16px; */
	padding:6px 0px;
	color: #b2b2b2;
	font-weight: 400;
	font-size: 0.85em;	
}

#breadcrumbs a {
	color: #969696;
	text-transform:uppercase;
	text-decoration: none;
	 -o-transition:.3s;
  	-ms-transition:.3s;
  	-moz-transition:.3s;
  	-webkit-transition:.3s;
	transition:.3s;
}

#breadcrumbs a:active {
	color: #202020;
}

#breadcrumbs a:hover {
	color: #202020;
}

/* Colours */
.grey1 {
	color: #f4f4f4;
}

.grey2 {
	color: #e5e5e5;
}

.grey3 {
	color: #969696;
}

.grey4 {
	color: #333333;
}

.dkgrey, #breadcrumbs a.dkgrey {
	color: #202020;
}

.grey {
	background-color: #f4f4f4;
}

/* div#heading {padding-left:36px; }*/
/* ABove to be used with old jpnewnv */

#topship {
	background-color: #909aa7;
	padding:10px;
	color: #fff;
	font-size: 18px;
	text-align:center;
}

#topship a {
	text-decoration:underline;
	color: #fff;
}



.navbar {
    /* padding-bottom: 10px; */
    margin-bottom:0px;
    }

h1 {
	color: #202020;
	font-size: 1.8em;
	font-weight: 600;
	letter-spacing: 0.02em;
}

h2 {
	color: #209ebf;	
	font-size: 1.4em;
	font-weight: 600;
	line-height: 1.2em;
	padding-top:6px;
}

h3 {
	color: #40bee0;
	font-size: 1.1em;
	font-weight: 700;
	text-align:center;	
}

h4 {
	color: #a6be0f;
	color: #969696;
	font-size: 1.2em;
	font-weight: 600;
	line-height: 1.2em;
	padding-top:6px;
	margin-top: 20px;
	margin-bottom: 10px;
}

h5 {
	color: #85980d;
	font-size: 1.1em;
	padding-top:15px;
	text-transform: uppercase;
}


.padtop20 {
	padding-top: 20px;
}

.padtop30 {
	padding-top: 30px;
}

.padtop44 {
	padding-top: 44px;
}

.padtop6 {
	padding-top: 6px;
}

.pl16 {
	padding-left: 16px;
}

.p-0 {padding:0px;}
.p-1 {padding:10px}
.p-2 {padding:20px}
.p-3 {padding:30px}
.p-4 {padding:40px}
.p-5 {padding:50px}

.pt-0 {padding-top:0px;}
.pt-1 {padding-top:10px}
.pt-2 {padding-top:20px}
.pt-3 {padding-top:30px}
.pt-4 {padding-top:40px}
.pt-5 {padding-top:50px}

.pb-0 {padding-bottom:0px;}
.pb-1 {padding-bottom:10px}
.pb-2 {padding-bottom:20px}
.pb-3 {padding-bottom:30px}
.pb-4 {padding-bottom:40px}
.pb-5 {padding-bottom:50px}

.pl-0 {padding-left:0px;}
.pl-1 {padding-left:10px}
.pl-15 {padding-left:0px} /*used to add padding on mob but not on desktop */
.pl-2 {padding-left:20px}
.pl-3 {padding-left:30px}
.pl-4 {padding-left:40px}
.pl-5 {padding-left:50px}

.pr-0 {padding-right:0px;}
.pr-1 {padding-right:10px}
.pr-2 {padding-right:20px}
.pr-3 {padding-right:30px}
.pr-4 {padding-right:40px}
.pr-5 {padding-right:50px}

.py-1 {padding-top: 10px; padding-bottom:10px;}
.py-2 {padding-top: 20px; padding-bottom:20px;}
.py-3 {padding-top: 30px; padding-bottom:30px;}
.py-4 {padding-top: 40px; padding-bottom:40px;}
.py-5 {padding-top: 50px; padding-bottom:50px;}

.px-1 {padding-left: 10px; padding-right:10px;}
.px-2 {padding-left: 20px; padding-right:20px;}
.px-3 {padding-left: 30px; padding-right:30px;}
.px-4 {padding-left: 40px; padding-right:40px;}
.px-5 {padding-left: 50px; padding-right:50px;}


.m-0 {margin:0px}
.m-1 {margin:10px}
.m-2 {margin:20px}
.m-3 {margin:30px}
.m-4 {margin:40px}
.m-5 {margin:50px}

.mt-0 {margin-top:0px}
.mt-1 {margin-top:10px}
.mt-2 {margin-top:20px}
.mt-3 {margin-top:30px}
.mt-4 {margin-top:40px}
.mt-5 {margin-top:50px}

.mb-0 {margin-bottom:0px}
.mb-1 {margin-bottom:10px}
.mb-2 {margin-bottom:20px}
.mb-3 {margin-bottom:30px}
.mb-4 {margin-bottom:40px}
.mb-5 {margin-bottom:50px}

.ml-0 {margin-left:0px}
.ml-1 {margin-left:10px}
.ml-2 {margin-left:20px}
.ml-3 {margin-left:30px}
.ml-4 {margin-left:40px}
.ml-5 {margin-left:50px}

.mr-0 {margin-right:0px}
.mr-1 {margin-right:10px}
.mr-2 {margin-right:20px}
.mr-3 {margin-right:30px}
.mr-4 {margin-right:40px}
.mr-5 {margin-right:50px}

.my-1 {margin-top: 10px; margin-bottom:10px;}
.my-2 {margin-top: 20px; margin-bottom:20px;}
.my-3 {margin-top: 30px; margin-bottom:30px;}
.my-4 {margin-top: 40px; margin-bottom:40px;}
.my-5 {margin-top: 50px; margin-bottom:50px;}

.mx-1 {margin-left: 10px; margin-right:10px;}
.mx-2 {margin-left: 20px; margin-right:20px;}
.mx-3 {margin-left: 30px; margin-right:30px;}
.mx-4 {margin-left: 40px; margin-right:40px;}
.mx-5 {margin-left: 50px; margin-right:50px;}


div.clear {clear:both;}

div.toplinkwrap {
	margin-top:30px;
	margin-right: 10px;
	margin-bottom: 30px;
	/* padding-bottom:20px; */
}

/* Homepage 
-------------------------*/

div.hp {
	clear:both;
	padding-top:20px;
}

.hp h2 {
	margin-top:0px;
	padding-top:0px;
	display:inline;
	padding-right:10px;
}

.hp a {
	text-decoration:underline;
}


/* News Ticker 
------------------------*/

/*****************************
*	vertical news ticker
******************************/
.ticker-wrapper-v{
	display: flex;	
	position: relative;
	overflow: hidden;
	/* border: 1px solid #333333; */
	height: 36px;
	background-color: #f4f4f4;
}

.ticker-wrapper-v .heading{
	background-color: #209ebf;
	color: #fff;
	padding: 5px 10px;
	flex: 0 0 auto;
	z-index: 10;
}
.ticker-wrapper-v .heading:after{
	content: "";
	position: absolute;
	top: 0;
	border-left: 20px solid #209ebf;
	border-top: 17px solid transparent;
	border-bottom: 15px solid transparent;
}

.news-ticker-v{
	display: flex;
	flex-wrap: wrap;
	margin:0;
	padding: 0;
	z-index: 999;
	animation: tic-v 10s cubic-bezier(1, 0, .5, 0) infinite;
}

.news-ticker-v:hover { 
	animation-play-state: paused; 
}

.news-ticker-v li{
	display: flex;
	width: 100%;
	line-height: 30px;
	align-items: center;
	white-space: nowrap;
	padding-left: 20px;
}


@keyframes tic-v {
	0%   {margin-top: 0;}
	20%  {margin-top: -30px;}
	40%  {margin-top: -60px;}
	60%  {margin-top: -90px;}
	80%  {margin-top: -120px;}
	100% {margin-top: 0;}
}

/* BUTTONS
-------------------------------------------------- */

.button, .buttondir {
	border-radius: 4px;
	color: #fff ;
	font-size: 0.8em;
	font-weight: 600;
	text-align:center;
	padding: 4px 0px;
	cursor: pointer;
	width: 90px; 
	margin:auto;
	letter-spacing: 1px;
	display:inline-block;
}

div.button a {display:block;}
.button a {color: #fff;}

.green {background-color:#a6be0f;background-color: #c0d72f; }
.blue {background-color: #40bee0;}
.wishlist {color: #969696;width:140px;height:34px;float:left;margin-right:20px;padding-top:8px;border: 1px solid #969696;background-color: #fff;}

.blue:hover {
	background-color: #6cdaf7;
	-o-transition:.4s;
  	-ms-transition:.4s;
  	-moz-transition:.4s;
  	-webkit-transition:.4s;
	transition:.4s;
}

.green:hover {
	background-color: #a6be0f;
	-o-transition:.4s;
  	-ms-transition:.4s;
  	-moz-transition:.4s;
  	-webkit-transition:.4s;
	transition:.4s;
}

div.wishlist:hover {
	color: #333;
	-o-transition:.4s;
  	-ms-transition:.4s;
  	-moz-transition:.4s;
  	-webkit-transition:.4s;
	transition:.4s;
}


/* CUSTOMIZE THE NAVBAR
-------------------------------------------------- */

.caret {color: #969696;}
li.dropdown > a:hover > span.caret {color: #40bee0;}

.dropdown-menu .divider {margin: 0px 0;}

.dropdown-menu > li > a {
    display: block;
    padding: 8px 20px;}
    
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
    color: #333;
    text-decoration: none;
    background-color: #f4f4f4;}  
    
.dropdown-menu {
    min-width: 200px;  }

.navbar-inverse {
    background-color: #202020;
    border: none;   
}

.navbar {
	font-size: 1.1em;
	color: #575757;
	font-weight: 600;
}

.navbar-inverse .navbar-text {color: #969696;}

.navbar-inverse .navbar-nav > li > a {color: #969696;}

.navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus {
    color: #40bee0;
    background-color: transparent;
}

input.searchbox {
	height:34px;
	max-height: 34px;
	width:55%;
	max-width: 560px;
	vertical-align:top;
	padding-left:10px;
	color: #cdcdcd;
	border:none !important;
	outline: none;
	line-height: 34px;
	font-weight: 500;
	}
	
button.searchbutton {
	height:34px;
	max-height: 34px;
	vertical-align:middle;
	line-height:34px;
}

input.searchbox {
	
}
	
div#icons {
	float:right;
	color: #40bee0;
}

.navbar-wrapper {
	background-color: #202020;
}

li a.dept {
	color: #fff !important;
}

li a.dept:hover {
	color: #40bee0 !important;
}

#cartnumber {
	height:22px;
	vertical-align:top;
	color:#40bee0;
	margin-top:6px;
	display:inline-block;
	font-weight: 600;
	}
	
img.carticon {
	margin-left:10px; 
	margin-right: 7px; 
	vertical-align:top;
	margin-top:6px;
}

img.accounticon {
	margin-right: 10px;
	margin-left:20px;
	vertical-align:top;
	margin-top:6px;
	}
	
img.wishicon {
	margin-left:20px;
	vertical-align:top;
	margin-top:6px;
	}
	
	
@media (max-width: 768px) {

	img.accounticon {margin-right: 0px;margin-left:5px;}
	img.carticon {margin-left:5px; margin-right: 5px;}
	img.wishicon {margin-left:5px;}
	
	#mobsign {
		padding:10px;border:1px solid #373737;color: #fff;margin-bottom:25px;text-align:center;
	}
	
	.navbar-nav > li > a {
  		padding-top: 15px;
  		padding-bottom:15px;
  		}
	
}

@media (min-width: 769px) {
	#mobsign {display:none;}

}
	

	

/* Left Nav --------------------------------------- 
   shows only on screensize >992px per line 1529 */

	#greeting {
		padding:10px;
		border:1px solid #e5e5e5;
		margin-bottom:10px;
		background-color: #f4f4f4;
		text-align:center;
		vertical-align:middle;
		border-radius:3px;
		height:90px;
		line-height: 60px;
	}
	
	#greeting span {
  		display: inline-block;
  		vertical-align: middle;
  		line-height: normal;
	}
	
	div.leftnav {
		padding-right: 50px;
		padding-bottom:25px;
	}
	
	div.maincat, div.minorcat {
		border: 1px solid #d4d2d4;
		border: 1px solid #e5e5e5;
	    border-left-color: rgb(212, 210, 212);
    	border-left-style: solid;
    	border-left-width: 1px;
  		padding: 6px;
  		padding-left: 20px;
  		margin-bottom: 3px;
  		background:none;
  		background-color: #fff;
	}
	
	div.minorcat:hover {background-color: #f4f4f4;}	
	a.nodec {text-decoration:none;}   /* Ensure links have no underline */
	
	#menujp, #menuwe, #menufo, #menuan, #menump {
  		padding: 6px;
  		padding-left: 20px;
  		margin-bottom: 3px;
  		background:none;
		background-color: #ed8019;
		color: #fff;
	}
	
	#tog0,#tog1,#tog2,#tog3,#tog4,#tog5,#tog6 {
		background:none;
	}
	
	#menujp {background-color: #ed8019;}
	#menuwe {background-color: #8889b7;}
	#menufo {background-color: #bbbcd6;}
	#menuan {background-color: #909aa7;}
	#menump {background-color: #bbbcd6;}
	
	a.droplink:link, a.droplink:hover, a.droplink:visited, a.droplink:active {
		color: #fff;
		text-decoration:none;
	}
	
	#menujp:hover {background-color: #f19947;}
	#menuwe:hover {background-color: #a0a1c5;}
	#menufo:hover {background-color: #c9c9de;}
	#menuan:hover {background-color: #a6aeb9;}
	#menump:hover {background-color: #c9c9de;}
	
	#menu0 div.minorcat {border-left:2px solid #ed8019;} /* Japanese */
	#menu1 div.minorcat {border-left:2px solid #8889b7;} /* Western */
	#menu2 div.minorcat {border-left:2px solid #bbbcd6;} /* World */
	#menu3 div.minorcat {border-left:2px solid #c9c9de;} /* Programmes */
	#menu4 div.minorcat {border-left:2px solid #909aa7;} /* Anime */

	/* End Left NAV */
	
/* Back to Top 
-------------------------------------------- */

div.backtotop {
	padding:4px 15px;
	border:1px solid #999;
	float:right;
	/* margin-right: 5px; */
	border-radius:3px;
	margin-bottom: 4px;
	background:none;
	background-color: #fff;	
	width: 120px;
	text-align:center;
}

div.backtotop:hover {background-color: #f5f5f5;}

a.toplink {
	color: #333;
	text-decoration:none;
	text-transform:uppercase;
	font-size:0.9em;
}


/* Top Bar 
--------------------------------------*/
	
#topbar {
	background-color: #f4f4f4;
	padding:8px 13px 4px 15px;
	/* color: #969696; */
	color: #333333;
	font-weight: 400; 
	font-size: 1em;
	border-radius: 5px;
	overflow: auto;	
}

#topbar select {
	border: none;
	background-color: #f4f4f4;
	background: #f4f4f4;
	font-weight: 400;
	color: #333333;
	font-size: 1em;
	outline:0;
	/* border:none !important; */
	border:1px solid #969696;
	margin-left:5px;
	padding:5px;
	border-radius: 5px;
}

#topbar select:active, select:hover {
  outline: none
}

#topbarleft {
	width:60%;
	float:left;
}

#topbarright {
	width:40%;
	float:right;
	text-align:right;
}

input[type=checkbox]#imgselect {
	accent-color: #337ab7;
	}
	
div#filterselector {
	float:left;
	padding-right: 10px;
	padding-bottom:4px;
	}	

div.filterbutton {
	padding:4px 20px;
	border:1px solid #dcdcdc;
	border:1px solid #969696;
	background-color: #f4f4f4;
	float:right;
	border-radius:5px;
	margin-bottom: 4px;
}

div.filterbutton:hover {
	background-color: #337ab7;
}

div.filtertext {
	padding:4px;
	float:right;
	margin-right:10px;
	border-radius:3px;
	margin-bottom:4px;
}

div.genres {
	padding:10px 3px 10px 3px;
}

div.genrebut {
	padding:4px 8px;
	border:1px solid #dcdcdc;
	float:left;
	margin-right: 5px;
	border-radius:3px;
	margin-bottom: 4px;
	background:none;
	background-color: #fff;	
}

/* div.genrebut:hover {background-color: #f5f5f5;} */

a.genrelink > div.genrebut {color: #333333;}
a.genrelink:hover > div.genrebut {background-color: #f5f5f5; color: #72afe4; color: #333;text-decoration :none;}


a.genrelink {color: #969696;color: #337ab7;}
a.genrelink:hover {	color: #40bee0;text-decoration :none;}

div#imgselector, div#imgselector2 {
	float:left;
	/* width:160px; */
	padding-top:4px;
	}
	
span.cancelgen {
	padding:0px 6px 2px 6px;
	border:1px solid #337ab7;
	}	
	
	
/*** Pagination 
---------------------------------------*/

div#pagination {
	text-align:center; 
	padding:15px;
	clear:both;
	padding-top:30px;
}


div.paginate {
	margin:auto;
	text-align:center;
	display: inline-block;
	margin-left:6px;
	}


div.pagebut, div.pagebutactive {
	padding:14px;
	font-size: 1.6em;
	font-weight:500;
	float:left;
	margin-right:6px;
	border:1px solid #969696;
	border-radius: 4px;
	display: inline-block;
	cursor:pointer;
	background-color: #fff;
	min-width: 46px;
	}

div.pagebutactive {
	color: #202020;
	border: 1px solid #202020;
	background-color: #c6f2fd;
	}
	
div.pagearrow {
	padding: 3px 14px 5px 14px;
	margin-top: 10px;
	border-radius:8px;
}

a:hover > div.pagebut {color: #202020;background-color: #f5f5f5;}
a > div.pagebut {color: #969696;}
a:active > div.pagebut {color: #202020;border:1px solid #202020;}

	
	



/* Category Page (list)
-------------------------------------------------- */

div.mainlistings {
	margin-right:-15px;
	clear:both;
	}	


div.item {
	float:left; 
	padding-top:20px;
	/* height: 230px; */
	height:460px;
	margin-right: 17px;
	margin-bottom:10px;
	max-width: 228px;
	background-color: #fff;
	border-bottom: 1px solid #e5e5e5;
}


div.item1 {
	/* border:1px solid #f4f4f4; */
	/* height: 230px; */
	min-height:324px;
	text-align:center;
	position: relative;
	color: white;
	}
	

div.item1 img.frame {
	width:228px;
}

div.item1 img {
	border:1px solid #e5e5e5;
}


div.item1 img:hover {
	border:1px solid #969696;
}

div.item2 {
	height: 70px;
	padding-top:10px; 
	font-weight: 500;
	line-height: 1.2em;
	max-width: 228px;
	margin:auto;
	}
	
	.typetext {
		font-size:0.8em;
	}

	
div.item2 a {
	color: #202020;
}

div.item2 a:hover {
	color: #c0c0c0;
	text-decoration: none;
}


.saleflag {
	background-color:#ff6815;
	color:#fff;
	font-size:0.9em;
	font-weight:500;
	position: absolute; 
	top: 5px; 
	left: 5px;
	z-index:10;
	padding:0px 10px;
	border-radius: 5px;
	}

img.stock {
	 float:left; 
	 margin-right:5px;
	 vertical-align:absmiddle;
}

div.stock {
	float: left; 
	font-size:0.9em;
	font-weight: 500;
	color: #40bee0;
	line-height: 1em;
	text-align: justify;
	padding-top: 2px;
}

.soldout {
	padding-top:50%;
	width:100%;
	height:100%;
	top:0;
	left:0;
	position:absolute;
	display:block;
	z-index:50; 
	opacity:0.6;
	background-color: #fff;
	font-weight: 600;
	font-size: 2em;
	line-height:1em;
	color: #ff0000;
	margin:auto;
	}



div.item span.dollars {
	margin-top:0px;
	font-size:1.5em;
	vertical-align:top;
	line-height:1.2em;
	font-weight:700;
	color: #202020;
	}
	
div.item span.cents {
	font-size: 0.9em;
	vertical-align:top;
	font-weight:700;
	color:#202020;
}

div.complistmp {
	padding-left:0; 
	padding-right:0;
}

span.specprice {
	font-size:1.1em; 
	font-weight:200;
	color:#c8c8c8;
	font-weight: 600;
	text-decoration: line-through;
}

div.viewbutton {
	float:right; 
	width:50%;
	text-align:right;
	/* width:86px; */
}

div.showprice {
	float:left;
	width:50%;
}

div.yearbut {
	width: 70px; /* used on kinemajunpo page */
	text-align: center;
}



/* Category Page - Showing Small Thumbs
Shows when x=1
-------------------------------------------------- */
/* css for when thumbnail images are chosen */




.itemx {
	float:left; 
	margin-top:20px;
	margin-right: 17px;
	margin-bottom:5px;	
	width: 228px;
	/* border-bottom: 1px solid #e5e5e5; */
	border: 1px solid #e5e5e5;
	border-radius: 5px;
	padding:10px;
	background-color: #fff;
}

.item1x {
	width: 95px;
	height: 120px;
	float: left;
	padding-right:10px;
}

.item1x img.frame {
	width:85px;
}

.item2x {
	width: 110px;
	height: 60px;
	font-weight: 500;
	line-height: 1.2em;
	font-size: 12px;
	float:right;
}

.item2xtitle {
	height:68px;
}

.item2xtitle a {
	/* color: #202020; */
}

.item2x .grey3 {
	font-weight:500;
}

div.itemx span.dollars {
	margin-top:0px;
	font-size:1.3em;
	vertical-align:top;
	line-height:1.2em;
	font-weight:600;
	color: #202020;
	}
	
div.itemx span.cents {
	font-size: 0.9em;
	vertical-align:top;
	font-weight:600;
	color:#202020;
}

div.item3x {
	padding:5px 0px;
}

.saleflagx {
	background-color: #ff6815;
	color: #fff;
	font-size: 0.8em;
	font-weight: 500;
	position: relative;
	top: -20px;
	left: 1px;
	z-index: 10;
	padding: 0px 6px;
	border-radius: 5px;
	margin-left: 3px;
	margin-right:5px;
	text-align: center;
}

.soldoutx {
	width: 100%;
	height: 100%;
	top: -120px;
	left: 0px;
	position: relative;
	display: block;
	z-index: 50;
	opacity: 0.6;
	background-color: #fff;
	font-weight: 600;
	font-size: 1.1em;
	line-height: 1em;
	color: #ff0000;
	margin: auto;
	text-align: center;
	vertical-align: middle;
	padding-top: 50%;
	}



/* Product Page - view.asp
---------------------------------------------------*/

div.prodtitle {
	border-bottom: 1px solid #e5e5e5;
	}
	
/* div.prodtitle h2 {
	margin-bottom: 5px;
	} */
	
div.prodtitle h1 {
	margin-bottom:5px;
}
	
div.prodtitle p {
	margin-top: -5px;
	}
	
div.vpn {
	color: #e5e5e5; 
	padding:5px; 
	font-weight:300; 
	text-align:right;
	font-size:0.9em;
}

	.imagecolumn {
		width: 350px;
		margin:auto;
	}


img.prodimage {
	max-width: 100%;
	padding: 5px;
	border:1px solid #e5e5e5;
	margin: 10px 0px 0px 0px;
}

.saleflagview {
	background-color:#ff6815;
	color:#fff;
	font-size:0.9em;
	font-weight:500;
	position: absolute; 
	top: 30px; 
	left: 15px;
	z-index:10;
	padding:0px 10px;
	border-radius: 5px;
	}

div.prodstock {
	float: left; 
	font-size:1.2em;
	font-weight: 500;
	color: #40bee0;
	line-height: 1em;
	text-align: justify;
	padding-top: 6px;
}


div.imageswitcher {
	margin:auto;
	margin-top:7px;
	max-width:317px;
	padding: 5px;
	/* background-color: #f4f4f4; */
	background:none;
	background-color: #fff;
	text-align:center;
	border:2px solid #f4f4f4;
}

img.prodimg {
	margin-right:3px;
	border:2px solid #e5e5e5;
}

img.prodimg:hover {
	border:2px solid #40bee0;
}

img.bigimage {
	max-width:100%;
}

div#info h2 {
	font-size: 2.5em;
}

span.dollars {
	margin-top:0px;
	font-size:2.4em;
	vertical-align:top;
	line-height:1em;
	font-weight:600;
	color: #202020;
	}
	
span.cents {
	font-size: 1.4em;
	vertical-align:top;
	font-weight:600;
	color:#202020;
}

div.table {
	display:table;
	width:100%;
	padding-top:30px;
}

div.table div.cellheader, div.cell {
	display: table-cell;
	padding:9px;
	border-bottom:1px solid #e9e9e9;
}

div.table div.cell {
	/* vertical-align:middle; */
}

div.table div.cellheader {
	font-size:0.9em;
}

.tleft {
	width:120px;
	padding:4px 6px 4px 0px;
	color: #969696;
	vertical-align: top;
}

.tright {
	padding:4px;
}

.detailhd {
	margin-top: 15px;
	margin-bottom:4px;
	color: #fff;
	background-color: #40bee0;
	text-transform: uppercase;
	font-size: 0.8em;
	border-radius:5px;
	padding: 2px 0px 2px 5px;
	width:120px;
}

div#colours {
	background-color: #f5f5f5;padding:10px;border-radius:8px;margin-top:10px;
}

div.colouritem {
	width:150px;text-align:center;float:left;padding:10px;border:1px solid #ccc;margin-bottom:15px;margin-right:15px;background-color: #fff;
}

div.colouritem input[type=submit]:disabled {
	font-weight:700;
}



/* Recommended Products */
div.productbox {
  float: left;
  width: 270px;
  height: 140px;
  border: 1px solid #e5e5e5;
  margin-top: 15px;
  margin-right: 10px;
  padding: 10px;
  border-radius: 5px;
}

div.productbox div.productimg {
  float: left;
  width: 85px;
  height: 120px;
  position: relative;
}

div.productbox div.producttext {
  float: right;
  width: 160px;
  padding-left: 10px;
  font-size: 11px;
}

div.productbox div.price {
  background-color: #f9f9f9;
  padding: 6px 5px 9px 5px;
  /*color: #979B25;*/
  font-size:1.2em;
  font-weight:500;
 /*  margin: 6px 0px;
  width: 130px; */
  border: 1px solid #e5e5e5;
  border-radius: 5px;
} 

a.prodlink {
	font-size: 12px;
	font-weight: 600;
}

a.prodlink:link, a.prodlink:visited, a:prodlink:active {
  color: #40bee0;
  text-decoration: none;
}

a.prodlink:hover {
  color: #c0d72f;
  text-decoration: underline;
}

img.frame {
  border: 1px solid #e5e5e5;
}

div.reco {
	padding-left:0px;
}

@media (max-width: 768px) {

	.tleft {
  		padding: 8px 6px 8px 0px;
	}
	.tright {
  		padding: 8px 4px;
	}
	
	
}


/* CART
-------------------------------------------------- */

div#cart {
	display:table;
	table-layout:fixed;
	width:100%;
	padding-top:20px;
}

div#cart div.cellheader, div.cell {
	display: table-cell;
	padding:9px;
	border-bottom:2px solid #f4f4f4;
}

div#cart div.cell {
	/* vertical-align:middle; */
}

div#cart div.cellheader {
	font-size:0.9em;
}

div.cartrhpanel {
	border:1px solid #d6d6d6;
	background-color: #fff;
	border-radius:5px;
	width:100%;
	padding:18px 16px;
	margin-bottom:6px;
	font-size:0.95em;
	font-weight: 400;
}

.sleeves {
	margin-top: 70px;
}

div.cartrhpanel h3 {
	/*font-size:1.1em;
	font-weight:bold; */
	margin-top:0px;
}

div.cartrhpanel p {
	margin-bottom:6px;
}

input.changeqty {
	border:1px solid #969696;
	padding:5px;
	border-radius:5px;
	text-align:center;
	font-size:1.2em;
	font-weight:500;
	background-color: #fff;
}

div.cartonsale {
	border-radius:5px;
	background-color: #ea7120;
	padding:1px 10px;
	color: #fff;
	width: 80px;
	margin-top:5px;
	font-size: 0.9em;
	float:left;
}

div.sku {
	float:left;
	color: #969696; 
	font-size:0.8em; 
	width: 80px;
	height: 30px;
	padding-top:8px;
}

input.qty {
	height:23px;
	width:50px;
	border:0;
	background-color:#fff;
}

input.qtyupon {
	background-image: url('/store/images/qtyupon.gif');
}

input.qtydownon {
	background-image: url('/store/images/qtydownon.gif');
}

input.qtyupoff {
	background-image: url('/store/images/qtyupoff.gif');
}

input.qtydownoff {
	background-image: url('/store/images/qtydownoff.gif');
}

input.cartdel {
	background-image: url('/store/images/but-cartdel.gif'); 
	background-repeat: no-repeat; 
	background-color: #fff; 
	height:30px;
	width:40px;
	border:0;
	background-position: top center;
	margin-left:5px;
}

input.movewish {
	background-image: url('/store/images/but-movewish.png');
	background-repeat: no-repeat; 
	border:0;
	background-position: top center;
	height:19px;
	width:22px;
	margin-top:6px;
	/* font-size: 0.75em; */
	}

input.wishbutton, input.delbutton {
	font-size:0.9em;
}


div.pointsbox {
	padding:20px;
	border:1px solid #d6d6d6;
	border-radius:8px;
}

div.imagecell {
	width: 15%;
}

div.productcell {
	width:58%;
	vertical-align:middle;
}

div.productcell a {	
	font-weight:600;
}

div.qtycell {
	width:17%;
	vertical-align:middle;
}

div.pricecell {
	width:10%;
	text-align:right;
}

div.subtotcell {
	width:10%;
	text-align:right;
	font-size:1.4em;
	/* font-weight:300 !important; */
}

div.imagecell img {
	padding:23px;
}


div#procbuttons {
	padding:9px;
	text-align:right;
	vertical-align:middle;
}

.procbutton {
	font-size:1.2em;
	margin: 0 0 10px 20px !important;
	height: 57px !important;
	width: 286px !important;
	padding-top: 17px !important;
	float:right;
}

.contbutton {
	font-size:1em;
	margin: 7px 0 10px 20px !important;
	height: 40px !important;
	width: 230px !important;
	padding-top: 10px !important;
	float:right;
}

/* Shipping Page
-------------------------------------------------- */

div#shippingbox {
	padding:20px;
	border:1px solid #e5e5e5;
	background-color: #f4f4f4;
	border-radius: 8px;
}




/* SUPPORT SECTION
-------------------------------------------------- */

div.thpanel {
	border: 1px solid #d6d6d6;
	border-radius:8px;
	/* width: 303px;
	height:175px;
	height:167px; 
	margin-right: 15px;
	margin-bottom: 20px;
	float: left;
	overflow: hidden;
	*/
	
	padding:32px 0px 29px 0px;
	background-color: #fff;
	text-align: center;
}

div.thpanel a {
	font-size:1.4em;
	font-weight:600;
	color: #202020;
	display:block;
	text-decoration:none;
}

div.thpanel a:hover {color: #969696; transition:0.3s;}
div.thpanel img {margin-bottom:10px;}

div.question {
	padding: 20px;
	border-top: 1px solid #d6d6d6;
	font-size: 1.4em;
	font-weight: 500;
	margin-right:10px;
	cursor: pointer;	
}

div.question:hover {
	background-color: #f7f7f7;
}

div.answer {
	padding: 27px 20px 27px 20px;
	font-weight: 400;
	font-size: 1.1em;
	border-top: 1px solid #d6d6d6;
	margin-right:10px;	
}

div.question a {
	color: #333;
	text-decoration: none;
}

div.question a:hover {
	color: #c1c1c1;
}

img.qarrow {
	float:right;
	vertical-align:middle;
	padding-top:0px;
}

input.formgrey {
	background-color: #f4f4f4;
	padding: 4px 0px;
	font-weight: 600 !important;
	color: #209ebf !important;
	border-radius:5px;
}


/* CONTACT PAGE
-------------------------------------------------- */

.contactleftwrap {
		padding-left:32px;
		padding-right: 40px;
	}


div.contacttable, div.updatetable {
	width: 100%;
	margin-top:18px;
	display: table;
}

.contacttable input, .contacttable select, .contacttable textarea, .updatetable input {
	border: none;
	color: #999;
	text-align: right;
	font-size: 0.9em;
	font-weight: 400;
	width:100%;
	padding-right: 10px;
	outline: none;
}

.updatetable input {
	color: #333333;
}

.contacttable select {
	color: #202020;
	}
	
	
/* To ensure placeholder text is the correct color
---------------------------------------------------*/

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #bcbcbc;
}
::-moz-placeholder { /* Firefox 19+ */
  color: #bcbcbc;
  opacity: 1;
}
:-ms-input-placeholder { /* IE 10+ */
  color: #bcbcbc;
}
:-moz-placeholder { /* Firefox 18- */
  color: #bcbcbc;
}

.contacttable .cell, .updatetable .cell {
	font-size: 1.2em;
	border-bottom: 1px solid #a0a0a0;
	color: #202020;
	font-weight: 600;
	padding: 19px 0px;
	vertical-align: top;
}

.contacttable textarea {
	text-align: left;
	}
	
.changedField {
	color: #8f8f8f !important;
}

#contactrhs {
	font-size: 1em;
}

#contactrhs h2 {
	color: #202020;
	font-size:1.4em;
	font-weight: 600;
	margin-top:0;
}

#contactrhsleft {
	float: left;
	width: 45%;
} 

#contactrhsright {
	float: right;
	width: 55%;
} 


.right {
	text-align: right;
}

/*.contactleftwrap #heading {*/
.contactleftwrap h2 {
		padding-left:0px;
	}


/* custom select style from https://codepen.io/sqrbrkt/pen/Asbxf/ 
https://codepen.io/gnclmorais/details/cHkqt
*/

.select-style {
    padding: 0;
    margin: 0;
    width: 210px;
    /* border: 1px solid #ccc;
    border-radius: 3px; 
    overflow: hidden;*/
    background-color: #fff;
    background: #fff;
    position: relative;
    float:right;
    margin-right: 30px;
}

.select-style:after {
    top: 50%;
    /* left: 97%; */
    left:110%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(0, 0, 0, 0);
    border-top-color: #40bee0;
    border-width: 5px;
    margin-top: -2px;
    z-index: 100;
}

.select-style select {
    /* padding: 0px 8px; */
    width: 110%;
    border: none;
    box-shadow: none;
    background-color: transparent;
    background-image: none;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
}

.select-style select:focus {
    outline: none;
}

.select-style select:-moz-focusring {
    color: transparent;
    text-shadow: 0 0 0 #000;
}

@media (max-width: 768px) {

	div.contacttable {
		width: 100%;
		margin-top:0px;
	}
	
	.contactable .procbutton, .updatetable .procbutton {
		float:none;
		margin:auto;
	}

	.contacttable input, .contacttable select, .contacttable textarea {
		text-align: left;
		border: 1px solid #dfdfdf;
		padding:15px;
	}
	
	
	.contacttable .cell {
		display:block;
		width:100% !important;;
		text-align: left !important;
		border: none;
		padding: 6px;
	}
	
	
	/* custom select style */

	.select-style {
		width:90%;
	    /* width: 210px; 
	    border: 1px solid #ccc;
	    border-radius: 3px; 
	    overflow: hidden;*/
	    float:none;
	    margin-right: 0px;
	    margin-left: 0px;
	    padding-left:0px;
	}

	.select-style:after {
	    top: 50%;
	    /* left: 97%; */
	    left:100%;
	    border: solid transparent;
	    content: " ";
	    height: 0;
	    width: 0;
	    position: absolute;
	    pointer-events: none;
	    border-color: rgba(0, 0, 0, 0);
	    border-top-color: #40bee0;
	    border-width: 5px;
	    margin-top: -2px;
	    z-index: 100;
	}

	.select-style select {
	    padding: 10px 0px; */
	    width: 110%;
	}

}




/* Genres 
-------------------------------------------------- */

@media (max-width: 768px) {
	div.tiles {text-align:center;padding-bottom:20px;}
	}


/* SIGNIN PAGE
-------------------------------------------------- */

.signinbox {
	padding:20px 30px;
	border:1px solid #d6d6d6;
	border-radius: 8px;
	margin-top: 30px;
	margin-bottom: 120px;
	min-height: 280px;
	background:none;
	background-color: #fff;
}

.signinbox li, .signinbox ul {
	margin-left: 8px;
	padding:0;
}

.signinbox .cell {
	border-bottom: 1px solid #a0a0a0;
	text-align: left !important;
}

.signinbox .cellnb {
	border:none !important;
	font-size: 1.2em;
	color: #202020;
	font-weight: 600;
	padding: 19px 0px;
	vertical-align: top;
	text-align:right !important;
	/* width:100% !important;
	 */
	display: table-cell;
	}

.signinbox .cellnb a {
	font-size:0.8em;
	color: #969696;
	text-transform:uppercase;
	text-decoration: none;
	 -o-transition:.3s;
  	-ms-transition:.3s;
  	-moz-transition:.3s;
  	-webkit-transition:.3s;
	transition:.3s;
	}
	
.signinbox .cellnb a:hover {
	color: #bcbcbc;
}

.signinbox p {
	padding-top:25px;font-weight: 700; font-size:1.2em;
	}

/* Ensure Chrome autofill doesn't change colour of form field */
input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 30px white inset;
    -webkit-text-fill-color: #bcbcbc !important;
}

div.errorbox {
	padding:30px; 
	border:2px solid red;
	background-color: #fafafa;
	border-radius:8px;
	margin-left:30px;
	margin-right:15px;
	margin-bottom: 20px;
}

.loginbutton {
	font-size:1.2em !important;
	width: 175px !important; 
	height: 50px !important;
	padding:0px !important;
	color: #fff !important;
	text-align:center !important;
	font-weight: 600 !important;
	}

.regbutton {
	font-size:1.4em;
	margin: 0 0;
	height: 50px !important;
	width: 222px !important;
	margin-top: 12px;
	padding-top:10px !important;
}

@media (max-width: 768px) {

	.contactleftwrap {padding: 0px 20px 10px 20px;}
	.contactrightwrap {padding: 0px 20px 10px 20px;}
	h2.signinpage {margin-top:5px;}
	.regbutton {width:250px !important;}
	.contactleftwrap #heading {padding-left:5px;}
	.signinbox {margin-bottom: 20px;margin-top:0px;}
	.signinbox .cell {border-bottom: none;}	
}





/* FOOTER
-------------------------------------------------- */

footer {
	background-color: #202020;
	padding-bottom:30px;
	margin-top:30px;
}

footer h2 {
	color: #fff;
	font-weight: 600;
	font-size: 1.1em;
	margin-top:30px;
}

footer > .container {
	color: #999;
	font-size: 1em; 
	font-weight:400;
	padding-left: 30px;
}

footer > .container a {
	color: #969696;
	text-decoration: none;
}

footer > .container a:hover {
	color: #e5e5e5;
}

div.bottomstrip {
	/*background-color: #999;
	 background-color: #40bee0; */
	background-color: #000;
	text-align:center;
	font-size: 0.9em; 
	color: #fff;
	padding:10px;
	font-weight: 300;
}


/* My Collection */

div.mcviewbutton {
	width:100%;
	text-align:center;
}

div.mccat {
	border: 1px solid #e5e5e5;
    border-left-color: rgb(212, 210, 212);
   	border-left-style: solid;
   	border-left-width: 1px;
 	padding: 6px;
	padding-left: 20px;
	margin-bottom: 3px;
	background:none;
	background-color: #e5e5e5;
	}




/* RESPONSIVE CSS
-------------------------------------------------- */


@media (max-width: 1330px) {
		
	/* div.imagecell img {
	width: 80px;
	} */
	
	input.searchbox {
	width:55%;
	max-width: 360px;
	}


}

@media (max-width: 1280px) {
		
	div.map {
		height: 244px;
	}
	
	.imagecolumn {
		width: 320px;
		margin:auto;
	} 
	

}

@media (max-width: 1340px) {
	input.wishbutton {margin-bottom:5px;}
	div.qtycell {text-align:center;}
	
}

@media (max-width: 768px) {
	div#imgselector {display:none;}

}



@media (min-width: 768px) {

	.navbar-nav {
		margin-left:220px;
	}
	img.logo {
		margin-right:20px;
		}		
	
}

@media (min-width: 992px) {

	form.searchform {
		padding:0;margin:0; float:left;width:550px;
	}

}

@media (max-width: 992px) {

	
	.imagecolumn {
		width: 350px;
		margin:auto;
		padding-right:0px;
	}

	
	input.searchbox {
		width:60%;
		max-width: 220px;
	}
	
	
	div#colours {
		display:none;
	}
	
	div.leftnav {
	display:none;
	}
	
	img.logo {
		margin-right:0px;
		max-width:200px;
		}
	
	div.item3 {
		padding-top:10px;
	}
	
	div.item3 .button {
		padding: 8px 0px !important;
	}
	
	div.item span.dollars {
		margin-top:0px;
		font-size:1.9em;
		vertical-align:top;
		line-height:1.2em;
		font-weight:700;
		color: #202020;
	}
	
	div.item span.cents {
		font-size: 1.3em;
		vertical-align:top;
		font-weight:700;
		color:#202020;
	}

}


@media (max-width: 768px) {

	/* Menu nav items */
	
	.noshowmob {
		display:none;
	}
	
	.pl-15 {padding-left:15px}
	
	div.toplinkwrap {
		margin-right: 0px;
	}

	
	div.backtotop {
		float:none;
		margin:auto;
		}
				
	.navbar-nav .open .dropdown-menu > li > a {
  	line-height: 30px;
  	line-height: 40px;
  	}
  	
	.navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
  	color: #e3e3e3;
  	font-size:1.2em;
	}
	
	.navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus, .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover {
  	color: #999;
  	background-color: transparent;
	}
	
	li.dropdown-header {
	display:none;
	}

	
	.breadcontainer {
		padding-left:0px;
		background-color: #f4f4f4;
		min-height: 10px;
	}
	
	.imagecolumn {
		padding-top:0px;
	}
	
	#breadcrumbs {
		display:none;
	}
	
	h1 {font-size:1.6em;margin-top:5px;}
	
	.navbar-nav {
		margin-top:10px;
		clear:both;
		overflow:hidden;
	}

	div#navbar {
		margin-top:40px;
	}
	
	.navbar-brand {
	  padding: 6px 15px;}
	
	div.navbar-wrapper {
		min-height: 92px; 
	} 
	
	input.searchbox {
		width:100%;
		max-width:130px;
	}
	
	
	div#icons {
		/* float:none; */
	}
	
	img.logo {
		margin-right:0px;
		max-width:200px;
		}
		
	div.mainlistings {
	margin-right:0px;
	clear:both;
	}	
		
	div.item {
	float:none; 
	padding-top:40px;
	width: 90%;
	margin:auto;
	margin-bottom:15px;
	max-width:317px;
	height:620px;
	}	
	
	.itemx {
	margin-left:16px;
	width: 90%;
	margin-top:20px;
	margin-bottom: 0px;
	}
	
	.item2xtitle {
		font-size:14px;
		line-height:1.3em;
		height:70px;
}
	
	.item2x {
		float:left;
		min-width:200px;
}

	
	div.item1 img.frame {
	width: 317px;
	min-height:450px;
	margin:auto;
	}
	
	div.item1, div.item2, div.item3 {
		max-width:317px;
	}
	
	.item1x {
	width: 97px;
	}
	
	.item1x img.frame {
 	 width: 87px;
 	 height:122px;
	}		
	
	div.item2 {
	font-size:1.3em;}
	
	#prodleftpanel {
		float:none;
		width:100%;
		max-width: none;
	}

	#prodrightpanel {
		padding-left: 0px;
		padding-top:20px;
		width:100%;
		max-width:none;
		float:none;
	}

	
	.contacttable .cellnb {	
		display: inline-block;
		float:none;
		text-align:center !important;
		width:100% !important;
	}	
	
	
	#droplinetop {
		display:none;
	}
	
	#droplinebot {
		display:none;
	}
	
	footer > .container {
	padding-left: 10px;
	}
	
	footer p {
		line-height:2.4em;
	}
	
	
	
	
	/* Componentlist Page */
	/*********************/

	div#breadcrumbs {
		padding:6px 2px;
	}

	
	/* Cart Page */
	/*********************/
	
	div.imagecell {
		display: none !important;
	}
	
	div.productcell {
		width:50%;
		vertical-align:middle;
	}
	
	div.qtycell {
		width:33%;
		vertical-align:middle;
	}
	
	div.pricecell {
		width: 17%;
		vertical-align: middle;
	}
	
	input.cartdel {
		margin-left:0px;
	}
	
	input.changeqty {
		padding:3px;
		font-size:1em;
	}
	
	.hidemob {
		display:none;
	}
	
	.sleeves {
		margin-top: 30px;
	}
	
	div#procbuttons {
		text-align:center;
	}
	
	.procbutton {
		float:none;
		display: inline-block;
	}

	.contbutton {
		float:none;
		display:inline-block;
	}
	
	input.wishbutton {
		margin-bottom:5px;
	}
	
	div.qtycell {
		text-align:center;
	}


	
	/* View Page 
	------------------------------------------*/
	
	div.reco {
	padding-left:15px;
	}

	div.reco .productbox {
	 width:100%;
	}
	
	div.reco .producttext {
		float: left;
		width: 70% !important;
	}

	
	/* Support Main Page 
	----------------------------------------*/
	

	.buttondir {
		margin:0 !important;
		margin:auto !important;
	}
	
	div.thpanel {
		width: 100%;
		float: none;
		margin-right: 0px;
		margin-bottom: 20px;
	}

}


