
/*--------------- Useful for block switching --------------*/
/*---------------------------------------------------------*/
	
.hideOnPhone{
	display:block;
}
.hideOnSmallTablet{
	display:block;
}
.showOnPhone{
	display:none;
}
.showOnSmallTablet{
	display:none;
}
/*.listContainer {
		width: 100% !important;
	}*/ 

/*Apply to all Responsive*/
@media (max-width: 1200px) {
	/*--------------- Structure --------------*/
	/*----------------------------------------*/
	
	img{
		max-width: 100%;
		height: auto;
	}
	.container {
	   max-width: 100%;
	   /* This will remove the outer padding, and push content edge to edge */
	   padding-right: 0;
	   padding-left: 0;
	 }
	 
	 #header_graphic{
		z-index:500;
	 }
	
	
	/*--------------- Bespoke --------------*/
	/*----------------------------------------*/
	.cookie-consent p {
		float:none;
		margin-right:20px;
		margin-bottom:0px;
		padding: 0;
		text-align:left;
	}
	
	.cookie-consent .accept {
		margin-left:20px;
		margin-bottom:10px;
		position: static;
		text-align:left;
	}
	
	#sortFilter {
		padding-right: 15px;
	}
	
	.sellerComicImage {
		max-height: 195px;
	}
	
	#map-wrap, #map-placeholder{ 
		width: 100%; 
	}
	#map-wrap img{
		display:block;
	}
	
	#stockistCheckboxContainer div div{
		width:50%;
	}
	#stockistCheckboxContainer label{
		width:85%;
	}
	
	.stockist1, .stockist2, .stockist3{
		width:33%;
	}	
	
	#gallery {
		width: 100%;
	}
	#gallery a, #gallery a:visited{
		margin-right: 1%;
		max-width:185px;
		width:32%;
	}
	
	/*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%;
	 } 
	 
	 #homeboxes {
	 	background:none;
		width: 100%;
	}
	
	#filterContainer {
		width:100%;
	}

	/*.newsitem{
		width:32%;
		margin-right:2%;
	}*/	
	.newsimage{
		height:auto;
		overflow:hidden;
		width:100%;
	}
	.newsdate{
		left:auto;
		right:0px;
	}
	
	#home-slider-wrapper .bx-controls {
		height: 65px;
		top: -255px;
		max-width: 976px;
		width:100%;
	}
	#comicFilterContainer ul li a.filtertag, #comicFilterContainer ul li a.filtertag:hover {
		padding-left: 12%;
	}
	#newsletter input[type=text]{
		text-align: center;
		width:100%;
	}
	
	.videoContainer {
		padding-bottom: 53%;
	}
	#leftc2 ins.ads_leftmenu {
		max-width: 260px;
		
	}
	#postDescription a {
		word-break: break-all;
	}
	
}

/*Large Tablet Sized */
@media (min-width: 768px) and (max-width: 992px) {
	/*--------------- Structure --------------*/
	/*----------------------------------------*/

	#header_graphic{
		z-index:600;
	}

	#strapline {
		display: none;
	}

	#navigation {
		width:100%;
	}

	#searchbtn, .btn-join, .btn-join:hover,a.btn-style, a.btn-style:hover, a.btn-style:visited {
		background-image: none;
	}

	#adv-search {
		padding-top: 2px;
		padding-bottom: 0px;
	}
	.comicSummary h2 {
		margin-top: 0px;
	}
	a.btn-style, a.btn-style:hover, a.btn-style:visited {
		text-align: center;
	}
	.btn-lg, .btn-group-lg>.btn {
		padding-left: 0px;
		padding-right: 0px;	
	}
	#twitter-widget-0 {
		min-width: 159px !important;
	}
	.jumbotron h2 {
		font-size: 2.2em;
	}
	#registerBanner p {
		font-size: 18px;
	}
	#foot h3 {
		font-size: 1.1em;
	}
	#foot p {
		font-size: 1em;
	}


	
	
	#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%;
	}

	/*----------- Bootstrap Ovverrides -------*/
	/*----------------------------------------*/
	.nav-justified>.dropdown .dropdown-menu {
	    top: auto;
	    left: auto;
	    right: 0;
	}
	.dropdown-menu {
	    min-width: 150px;
	}
	
	
	/*--------------- Bespoke --------------*/
	/*----------------------------------------*/
	
	#homebox-left, #homebox-center, #homebox-right {
		padding-left: 2%;
		padding-right: 2%;
		width: 29%;
	}
	.spacerDiv {
		display: none;
	}
	.openModal {
		white-space: normal
	}
	.sellerComicImage {
		max-height: 235px;
	}
	.videoContainer {
		padding-bottom: 70%;
		width: 100%;
	}
	.searchSellers div.thumbnail {
		margin-right: 3%;
		max-width: 90px;
		max-height: 90px;
	}
	#leftTable p {
		font-size: 1.3em;
	}
	.artwork:nth-of-type(4n) {
    	clear: none;
	}
	.artwork:nth-of-type(odd) {
		clear: both;
	}
	.creativeImg:nth-of-type(4n+1) {
		clear: none;
	}
	.creativeImg:nth-of-type(3n+1) {
		clear: both;
	}

	#app-bannertext h1 {
		font-size: 3.5em;
	}

	.app-price {
		font-size:3em;
	}

}



/*Small Tablet Sized */
@media (max-width: 767px) {
	/*--------------- Structure --------------*/
	/*----------------------------------------*/
	
	.hideOnSmallTablet{
		display:none;
	}
	.showOnSmallTablet{
		display:block;
	}
	#wrapper-header {
		height: auto;
		padding-left: 0px;
		padding-right: 0px;
	}
	#wrapper-header .container {
		padding-left: 0px;
		padding-right: 0px;
		width: 100%;
	}
	#header {
		height: 130px;
		margin-left: 0px;
		margin-right: 0px;
	}
	#header-left {
		padding-left: 30px;
		width: 98%; 
	}
	#header-right {
		float: left;
		margin: 0px;
		padding-left: 0px;
		padding-right: 0px;
		width: 100%;
	}
	
	#header_graphic{
		float: none;
		z-index:700;
		width: 183px;
		margin-left: auto;
		margin-right: auto; 
	}
	
	
	#wrapper-navigation {
		height:2px;
	}
	
	#navigation-inner{
		padding-left:0%;
		padding-right:0%;
		width:100%;
	}

	#navigation{	
		float:none;
		border-bottom:0px;
		margin:0px;
		width:100%;
		position:absolute;
		top:15px;
		z-index: 200;
	}
	#navigation ul{	
		background-color:#020816;
		border:1px solid #333333;
		border-top:0px;
		position: absolute;
		top:45px;
		right:0px;
		z-index:600;
		display:none;
		width:100%;
	}
	#nav-icon  {
		display: block;
		background-image:url(../images/nav-mobile.gif);
		background-repeat:no-repeat;
		float:right;
		margin-right:2%;
		height:31px;
		width:34px;
	}

	#navigation ul li {
		display: block;
	}
	#navigation ul li a, #navigation ul li a:visited{
		border-bottom:1px solid #cccccc;
		float:none;
		padding-top:12px;
		padding-bottom:12px;
		padding-left:5%;
		padding-right:2%;
	}
	
	
	#members-nav-icon {
		background-image: url(../images/nav-members.gif);
		background-repeat:no-repeat;
		background-position: right;
		display: block;
		font-size: 1.5em;
		height: 31px;
		padding-right: 38px;
		padding-top: 5px;
		position: absolute;
		right: 15px;
		top: -31px;
	}	
	
	.closed{
		display:none;
	}
	.open{
		display:block !important;	
	}
	ul.dropdown {
		display: none !important;
	}
		
	#centerc{
		display: block;
		float:none;
		margin-left:0px;
		width:100%;
	}
	
	#centerc-2col {
		display: block;
		float: none;
		margin-left: 0px;
		width: 100%;;
	}

	#leftc{
		display: none;
		padding-left: 0px;
		padding-right: 0px;
		position: absolute;
		width: 100%;
		left: 0px;
		top: 0px;
		z-index: 3000;
	}
	#leftcSeller {
		display: none;
		padding-left: 0px;
		padding-right: 0px;
		position: absolute;
		width: 100%;
		left: 0px;
		top: 0px;
		z-index: 3000;
	}

	label{
		float:none;
	}
	.submitButton {
		margin-left:0px;
		margin-bottom:24px;
	}
	
	.contactInputLarge {
		max-width:326px;
		padding-left:2%;
		padding-right:2%;
		width:95%;
	}

	/*----------- Bootstrap Ovverrides -------*/
	/*----------------------------------------*/
	.nav-justified {
		border: 1px solid #cccccc;
		-webkit-border-bottom-right-radius: 4px;
		-webkit-border-bottom-left-radius: 4px;
		-moz-border-radius-bottomright: 4px;
		-moz-border-radius-bottomleft: 4px;
		border-bottom-right-radius: 4px;
		border-bottom-left-radius: 4px;
	}
	.nav-justified>li {
		float: left;
	}
	.nav-justified>li>a {
		margin-bottom: 0px;
		padding-top: 12px;
		padding-bottom: 12px;
	}
	.nav-pills>li {
		border-bottom: 1px solid #cccccc;
		float: left;
		width: 100%;
	}
	.nav-pills>li#navSettings {
		border-bottom: 0px;
	}
	.nav-pills>li+li {
	    margin-left: 0px;
	}
	.nav-pills>li>a {
		border-radius: 0px;
	}
	.nav>li>a {
		position: relative;
		float: left;
		text-align: left;
		width: 100%;
	}
	ul.dropdown-menu {
		display: none;
		border: none;
		border-top: 1px solid #cccccc;
		box-shadow: none;
		max-width: 734px;
		position: static;
		width: 100%;
	}
	ul.nav li.dropdown:hover ul.dropdown-menu {
		display: none;
	}
	.dropdown-menu>li>a {
		font-weight: 100;
	}
	
	
	/*--------------- Bespoke --------------*/
	/*----------------------------------------*/
	.cookie-consent .accept {
		margin-left:0px;
		width: 140px;
	}
	#strapline {
		display: none;
	}

	.divBasketSnapshot {
		display: none;
	}
	#wrapper-search {
		height: auto;
	}
	#searchIcon, #searchIcon:hover, #searchIcon:visited, #basketIcon, #basketIcon:hover, #basketIcon:visited {
		color: #ffffff;
	}
	#searchIcon {
		background-image: url(../images/search-icon-grey.png);
		background-repeat: no-repeat;
		position: absolute;
		margin-left: 2%;
		padding-left: 40px;
		padding-top: 13px;
		height: 40px;
	
		z-index: 300;
	}
	#basketIcon {
		background-image: url(../images/basket-icon-grey.png);
		background-repeat: no-repeat;
		position: absolute;
		margin-left: 42%;
		padding-left: 40px;
		padding-top: 13px;
		height: 40px;
		
		z-index: 300;
	} 
	#search {
		display: none;	
	}
	#search-box, #search-button {
		float: left;
		margin-right: 0px;
		width: 100%;
	}
	#m_searchtext {
		margin-right: 0px;
		margin-top: 10px;
	}

	
	#mobileFilter {
		background-color: #dce1e9;
		color: #272626;
		float: left;
		font-family: 'Roboto Medium', Verdana, Helvetica, sans-serif;
		font-size: 2em;
		font-weight: normal;
		margin-bottom: 12px;
		margin-top: 0px;
		padding-bottom: 12px;
		padding-top: 10px;
		text-align: center;
		width: 100%;
	}
	#mobileSellerFilter {
		background-color: #dce1e9;
		color: #272626;
		float: left;
		font-family: 'Roboto Medium', Verdana, Helvetica, sans-serif;
		font-size: 2em;
		font-weight: normal;
		margin-bottom: 12px;
		margin-top: 0px;
		padding-bottom: 12px;
		padding-top: 10px;
		text-align: center;
		width: 100%;
	}
	#filterContainer {
		padding-left:0px;
		padding-right:0px;
		width:100%;
	}
	#filterContainer h2{
		color: #272626;
		font-family: 'Roboto Medium', Verdana, Helvetica, sans-serif;
		font-size: 2em;
		text-align: center;
	}
	#closeFilter {
		color: #272626;
		font-family: 'Roboto Medium', Verdana, Helvetica, sans-serif;
		font-size: 1.3em;
		margin-top: 10px;
		text-align: center;
	}
	#twitter, #leftcAd, #leftTable, #leftPaypal, #adverts, #adverts div {
		display: none !important;
	}
	#leftc ins.ads_leftmenu {
		display: none;
	}
	
	#leftc2 ins.ads_leftmenu {
		max-width: 728px;
		height: 90px;
	}
	
	
	#homepageText p {
		font-size: 1.9em;
	}
	.comicImage {
		padding-left: 15px;
	}
	.comicButtons {
		padding-right: 15px;
	}
	.imageContainer {
		float: none;
		margin-left: auto;
		margin-right: auto; 
		max-width: 190px;
	}
	.imageContainerLarge {
		float: none;
		margin-left: auto;
		margin-right: auto; 
		max-width: 265px;
	}
	a.viewmore, a.viewmore:visited {
		font-size: 1.9em;
	}
	
	.jumbotron h2 {
		font-size: 2em;
	}
	#newsletter {
		width:100%;
	}
	#m_newsemail {
		margin-right: 0px;
		width: 100%;
	}
	#m_email {
		margin-right: 0px;
		width: 100%;
	}
	#newsletter input[type=text] {
		margin-right: 0px;
		width: 100%;
	}
	#newsletter-button {
		width: 100%;
	}
	.btn {
		margin-bottom: 15px;
		width: 100%;
	}
	.btn-join {
		margin-top: 15px;
	}
	.btn-shipping {
		margin-bottom: 0px;
	}
	#searchbtn, .btn-join, .btn-join:hover,a.btn-style, a.btn-style:hover, a.btn-style:visited {
		background-image: none;
		margin-bottom: 0px;
		width: 100%;
	}
	#registerBanner {
		display: none;
	}
	#foot div {
		margin-top: 25px;
	}
	.openModal {
		margin-top: 10px;
	}
	.sellerComicImage {
		max-height: 183px;
	}
	

	/* First reset bootstrap padding */
	.table>thead>tr>th, .table>tbody>tr>th, .table>tfoot>tr>th, .table>thead>tr>td, .table>tbody>tr>td, .table>tfoot>tr>td {
		padding: 0px;
	}

	/* Force table to not be like tables anymore */
	.table, 
	.table thead, 
	.table tbody, 
	.table th, 
	.table td, 
	.table tr { 
		display: block;	 
	}
 
	/* Hide table headers (but not display: none;, for accessibility) */
	.table th { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
 
	table.table tr { border-bottom: 1px solid #ccc; }
 
	.table>tbody>tr>td { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee; 
		position: relative;
		padding: 0px;
		padding-left: 50%; 
		padding-top: 8px;
		padding-right: 8px;
		padding-bottom: 8px;
		white-space: normal;
		text-align:left;
	}
 
	.table 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;
		text-align:left;
		font-weight: bold;
	}
 
	/*
	Label the data
	*/
	.table td:before { 
		content: attr(data-title);
		text-align: left;
	 }
	 
	 .table td a.btn {
	 	margin-bottom: 0px;
	 }
	
	.btn-table {
		margin-bottom: 0px;
		width: 100%;
	}
	table tbody tr th.mobileAllFilter {
		position: static;
		left: 0px;
		top: 0px;
		margin-bottom: 0px;
		padding-top: 5px;
	}
	input[type=checkbox]#checkboxall {
		margin-left: 50%;
	}
	.mobileAllFilter label {
		margin-left: 53%;
		margin-bottom: 0px;
		padding-bottom: 0px;
		padding-top: 2px;
	}
	table.table th.thumbNail, table.table td.thumbNail, table.table td.seller-thumbnail {
		width: 100%;
	} 
	
	#limitResults, #filterResults {
		padding: 0px;
	}
	#sortFilter {
		float: left;
		margin-bottom: 0px;
		padding-right: 0px;
		width: 100%;
	}
	.sortby {
		padding-left:10px;
	}
	.thumbnail {
		margin-left: auto;
		margin-right: auto;
		max-width: 255px;
	}
	.paginationButton {
		width: 100%;
	}
	.descImage {
		height: 200px;
	}
	.description {
		padding-bottom: 35px;
	}
	#readMore, #close {
		width: auto;
	}
	#m_notes, #m_postage {
		margin-bottom: 15px;
	}
	#popoverGrading, #popoverLowestGrading, #popoverComment, #popoverLinkText {
		position: absolute;
		top: 0px;
		left: 20%;
	}
	#popoverBundle {
		position: absolute;
		top: 0px;
		left: 30%;
	}
	.videoContainer {
		padding-bottom: 47%;
		width: 82%;
	}
	.leftVideo {
		margin-bottom: 20px;
		margin-right: auto;
	}
	.rightVideo {
		margin-left: auto;
	}
	.btn-sub-approve {
		margin-bottom: 0px;
	}
	#bundleCheckbox div.checkbox {
		padding-top: 0px;
	}
	.searchSellers div.thumbnail {
		max-width: 80px;
		max-height: 80px;
	}
	p.iframe {
	margin-bottom:20px;
  	height: 0;
	overflow: hidden;
  	position: relative;
  	padding-bottom: 56.25%;
	}
	.artwork:nth-of-type(4n) {
    	clear: none;
	}
	.artwork:nth-of-type(odd) {
		clear: both;
	}
	.creativeImg:nth-of-type(4n+1) {
		clear: none;
	}
	.creativeImg:nth-of-type(3n+1) {
		clear: both;
	}

	.newsitem {
		max-width: 350px;
	}
	.newsitem:nth-of-type(4n+0) {
		clear: none;
	}
	.newsitem:nth-of-type(odd) {
		clear: both;
	}

	
	#app-banner {
		padding-top:40px;
	}
	#app-comics2, #app-tablet-phone img {
		margin-bottom:20px;
	}
	#app-features-left .app-features-box img, #app-features-right .app-features-box img {
		display:none;
	}
	#app-features-left .app-features-box h3, #app-features-left .app-features-box p, #app-features-right .app-features-box h3, #app-features-right .app-features-box p {
		text-align: center;
	}
	#app-comics img {
		margin-top:20px;
	}

	#app-features h2, .app-features-box {
		margin-bottom:25px;
	}
	#app-features #app-featured-phone img {
		margin-top:20px;
		margin-bottom:20px;
	}
	.app-price {
		font-size:3em;
	}

}

	
	


@media (min-width: 480px) and (max-width: 767px) {
	#header_graphic{
		z-index:700;
	}
}

@media (min-width: 700px) and (max-width: 727px) {
	#leftc2 ins.ads_leftmenu {
		margin-left: auto;
		margin-right: auto;
		max-width: 336px;
		height: 280px;
	}
}

/*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;
	}
	
	#wrapper-header {
		height:auto;
	}
	#header-left, #header-right {
		float:left;
		height: 40px;
		margin-bottom:6px;
		width: 100%;
	}
	
		
	#header_graphic{
		z-index:800;
	}
		
	/*#navigation{	
		top:-40px;
	}*/
	
	#navigation ul {
		top: 39px;
		
	}

	
	/*--------------- Bespoke --------------*/
	/*----------------------------------------*/
	
	#pagination {
		margin-top: 50px;
	}
	
	#readMore, #close {
		
		width: auto;
	}
	#messageDate {
	text-align: left;
	}
	.sellerComicImage {
		max-height: 180px;
	}
	.advertContainer {
		margin-bottom: 20px;
	}
	.videoContainer {
		width: 82%;
		max-width: 336px;
		padding-bottom: 47%;
	}
	.videoContainer iframe {
		width: 100%;
	}
	.DivRecords {
		padding-bottom: 20px;
	}
	#leftc2 ins.ads_leftmenu {
		margin-left: auto;
		margin-right: auto;
		max-width: 336px;
		height: 280px;
	}
	.searchSellers div.thumbnail {
		max-width: 110px;
		max-height: 110px;
	}
	.btn-shipping{
		margin-top: 0px;
	}
	.creativeImg:nth-of-type(4n+1) {
		clear: none;
	}
	.creativeImg:nth-of-type(3n+1) {
		clear: none;
	}
	.creativeImg:nth-of-type(odd) {
		clear: both;
	}

	.newsitem {
		margin-left: auto;
		margin-right: auto;
	}

	#app-bannertext h1 {
		font-size:3.2em;
	}
	.app-price {
		font-size:2.5em;
	}

	#app-download h2 {
		font-size:2.5em;
	}

	#app-download h3 {
		font-size:2.2em;
	}
	
	
}

/* small mobile fix */
@media (max-width: 345px) {
	
	#header_graphic{
		z-index:900;
	}
	
	div#coupon-box div.basketCol2 label {
		float: left;
		margin-right: 0px;
		padding-top: 5px;
		text-align: left;
		width: 100%;
	}
	div#coupon-box div.basketCol2 input[type="text"] {
		float: left;
		margin-right: 0px;
		padding-left: 3%;
		padding-right: 3%;
		width: 93%;
	}
	#leftcAd {
		padding-top: 20px;
	}
	#leftc2 ins.ads_leftmenu {
		max-width: 320px;
		height: 100px;
	}
	#popoverBundle {
		position: absolute;
		top: 0px;
		left: 40%;
	}
	#popoverLowestGrading {
		position: absolute;
		top: 0px;
		left: 45%;
	}
	#popoverComment {
		position: absolute;
		top: 0px;
		left: 30%;
	}

	#popoverLinkText {
		position: absolute;
		top: 0px;
		left: 30%;
	}

}

@media print {
	body {
		background-color: #ffffff;
		width: 768px;
	}
	.container {
		width: auto;
	}
	#centerc-home {
		width: 100%;
	}
	/*remove chrome links*/
	a[href]:after {
		content: none !important;
	}
	#leftc, #leftc-2, #mobileFilter, .breadcrumb, #members-nav-icon, #mobileLogout{
		display: none;	
	}
	.comicImage {
		width: 31.66667%;
	}
	.comicSummary .col-ms-7 {
		width: 47.33333%;
	}
	.comicButtons {
		width: 21%;
	}
	
	#membersNav {
		width: 100%;
	}
	#members-navigation .closed {
		display: block;
	}
	#members-navigation .nav-pills>li {
		float: left;
	}
	#members-navigation .nav>li>a {
		padding: 10px 9px;
	}
	 
	
	table.table {
		  display: table;
		  width: auto;
	}
	
	table.table tr {
		clear: both;
  		display: table-row;
		height: auto;
		width: 100%;
		position: static;
	}
	
	.table>tbody>tr>th, .table>tbody>tr>td {
		display: table-cell;
		height: auto;
		padding-left: 0px;
		padding: 8px;
		position:static;
		max-width: 135px;
	}
	
	table.table td.thumbNail, table.table th.thumbNail {
		width: auto;
	}
	
	.table td:before {
		display: none;
	}
}