/* v1 merchant-responsive.css moved to app */
/* new overrides for v2 in here */

/* new 'fat panel' view - shrink middle, max = 2000px */
@media only screen and (min-width: 1253px){
	    div.basketItem div.details, div.inline-voucher div.details { width: 199px; }
}

@media only screen and (max-width: 1670px){
	
}

@media only screen and (max-width: 1469px){
	div.product-items.single-item div.product-item div.middle > div.price-table-container { width: 336px; }
		
	div.product-items.single-item div.product-item div.middle div.price-table {  width: 336px; }
}

@media only screen and (max-width: 1390px){
	
}

@media only screen and (max-width: 1355px){
	
	div.product-items.single-item div.product-item div.middle > div.price-table-container { 
		position: relative; 
		right: auto; 
		left: auto; 
		width: 462px; }
		
	div.product-items.single-item div.product-item div.middle div.price-table { 
		width: 462px; 
		max-width: 462px; 
		margin-left: 0px;
	}
	
	
	
	
}


/* orig 'mid' view - back to thin panels */
@media only screen and (max-width: 1253px){
	
	img.wing-shrink { width: 180px; }
	
	div.open24Hours { margin-left: 0px; }
	
	
	div.sidePanelStandards {width: 180px; }
	
	div.sidePanelStandards > a.globalSign, 
	div.sidePanelStandards > a.siteFission,
	div.sidePanelStandards > a.bsi,
	div.sidePanelStandards > a.warrant{
		width: 77px;
		height: 73px;
		background: url(wings/images/v2/180/royal-warrant-77x75.png);
		float:none;
		display: inline-block;
		background-repeat: no-repeat;
		background-size: 100%;
		margin: 0px;
	}

	div.sidePanelStandards > a.bsi { width: 90px; margin-left: 6px; background: url(wings/images/v2/bsi-and-ukas.png); background-size: 100%; background-repeat: no-repeat; background-position: 0 16px;}
	div.sidePanelStandards > a.mcaffee { width: 69px; margin-left: 11px; height: 50px; background: url(wings/images/v2/180/McAfee-69.png); background-size: 100%; background-repeat: no-repeat; background-position: 0 14px;}
	div.sidePanelStandards > a.globalSign { width: 94px; height: 50px; background: url(wings/images/v2/180/global-sign-94.png); background-size: 100%; background-repeat: no-repeat;}
	
	div.deliveryVans div.image { height: 74px;}
	
	div.paymentOptions a > img { width: 180px; }
	
	.sidePanel a.newsletter { height: 74px; }
	
	
 
}

@media only screen and (max-width: 1122px){
	div.product-item div.middle div.buttons span.text { display:none; }
	div.product-items.single-item div.product-item div.middle div.buttons span.text { display:inline; }
}

/* old breakpoint from v1 */
@media only screen and (max-width: 1023px){
	div.product-item div.middle > div.price-table-container { width: 336px; margin-left: 0px;}
	div.product-item div.middle div.price-table { width: 320px; margin-left: 0px;}
	div.product-item div.middle table.price-table { width: auto; }
	
	div.product-items.single-item div.product-item div.middle > div.price-table-container,
	div.product-items.single-item div.product-item div.middle div.price-table { width: 100%; max-width: 462px; height: auto; margin-bottom: 12px;}
	div.product-items.single-item div.product-item div.middle table.price-table { width: auto;}
	
	
	div.product-item div.middle div.buttons { position: relative; top: auto; left: auto;}
	div.product-items.single-item div.product-item div.middle div.buttons { left: 250px; margin-bottom: 6px; margin-top: 0px; }
	div.product-items.single-item div.product-item div.middle div.buttons > * { margin-left: -6px; }
	
	#pnlMain { padding: 0 12px !important; }
	#header-v2 {
		width: calc(100% - 24px);
		margin-left: -12px;
		padding-left: 12px;
		background-position-x: 24px;
	}
}
		
		
/* 900px - 965px */
@media only screen and (max-width: 965px){
	div.product-item div.middle div.buttons { position: absolute; top: 125px; left: 0px; width: auto;}
	div.product-item div.middle div.buttons > * { display: table-cell;}
	
	div.product-items.single-item div.middle div.buttons > * { display: block;}
	div.product-items.single-item div.product-item div.middle div.buttons { top: 0; left: 250px;}
}

/* old 'narrow' view - drop LHS - i.e. iPad mini portrait */
@media only screen and (max-width : 900px){
	div.product-item {width: calc(100% - 16px);}
	div.product-item div.middle table.price-table th,
	div.product-item div.middle table.price-table td,
	div.product-item div.middle table.price-table td * { font-size: 10pt; line-height: 14pt; padding: 2px;}
	div.product-item div.middle table.price-table th { padding: 5px; }
}

/* lose all columns and use 100% - i.e. below iPad mini portrait (768px)*/
@media only screen and (max-width : 767px) {
	#pnlMain { padding: 0 6px !important; }
	#header-v2 { width: calc(100% - 12px); margin-left: -6px; padding-left: 6px; background-position-x: 12px;}
	.is-sticky #sticky-header { padding-left: 6px; margin-left: -6px; width: calc(100% + 6px) !important; }
	div#pnlMid { width: 100%; max-width: 729px; margin-left: 0px; margin-right: 0px; }
}


@media only screen and (max-width: 556px){
	div.product-items.single-item div.product-item div.middle div.buttons { margin-top: -12px; }
}


/* old mobile_375 (e.g. iPhone6)  */
@media only screen and (max-width : 559px) {
	
	div#pnlMid { padding: 0px; }
	
	div.product-items.single-item div.product-item a.slideshow-launch.small { max-width: 160px; }
	
	div.product-item div.middle > div.price-table-container { width: calc(100% - 160px); min-width: 218px; margin-left: 0px;}
	div.product-item div.middle div.price-table { width: calc(100% - 18px); min-width: 202px; }
	
	div.product-item div.middle table.price-table th,
	div.product-item div.middle table.price-table td,
	div.product-item div.middle table.price-table td * { font-size: 10pt; line-height: 14pt; }
	
	div.product-items.single-item div.product-item div.middle div.price-table { position: relative; left: 0; }
	
	
	
	div.product-item div.middle div.buttons { width: auto; }
	
	div.product-item div.control input[type=text] { width: 60px; }
	
	
	div.product-items.single-item div.product-item div.middle div.buttons { position: relative; width: 100%; left: 0}
	
	/* MB REF FB 17400 */
	#pnlMid div.more-sizes  h2 { font-size: 24px; }
	
	.category h3 a { font-size: 22px!important; }
	
	.image-slideshow.portrait div.slideshow-container div.nav div.close { left: 204px; top: 67px; }
	
}

/* shrinking between phones */
@media only screen and (max-width : 491px) {
	
	div.product-item div.middle > div.price-table-container { position: relative; width: 336px; margin-top: 12px; height: auto; margin-left: -2px  }
	div.product-item div.middle.price-table-hidden > div.price-table-container { height: auto;  }
	
	div.product-item div.middle table.price-table { width: 320px; height: 160px;}
	div.product-list-header .q-form span.compare { display: none; }
	
	div.product-item div.middle table.price-table th,
	div.product-item div.middle table.price-table td,
	div.product-item div.middle table.price-table td  * { font-size: 10pt; line-height: 14pt; }
	
	
	
	div.product-items.single-item div.product-item div.middle table.price-table th,
	div.product-items.single-item div.product-item div.middle table.price-table td,
	div.product-items.single-item div.product-item div.middle table.price-table td  * { font-size: 10pt; }
	
	.header-text h2,
	#pnlMid .header-text h2 { font-size: 30px; }
	
	div.menu ul > li a {
    font-size: 15px;
    line-height: 21px;
}

	div.checkoutButtons a.back {
    position: absolute;
    right: 100px;
    width: 90px;
    min-width: auto;
}

.webForm .radios > div.radioLabel {
    width: 266px;
}

	div.product-item div.middle div.buttons  { position:relative; top: auto; left: auto; width: auto; }
	div.product-item div.middle div.buttons  > * { display:block; }
	div.product-item div.middle div.buttons span.text { display:inline; }

	
    
}

@media only screen and (max-width : 400px) {
	div.price-table { position: relative; right: auto; left: 0px; }
	div.product-item div.middle div.buttons span.text { display:none; }
	div.product-item a.slideshow-launch.small { width: 36px; }
}

/* old mobile_320 (e.g. iPhone5)  */
@media only screen and (max-width : 359px) {
	
	div.product-item div.middle > div.price-table-container { position: relative; width: 302px; margin-top: 12px; height: auto;  }
	div.product-item div.middle.price-table-hidden > div.price-table-container { height: auto;  }
	div.product-item div.middle table.price-table { width: 286px; height: auto;}
	div.product-list-header .q-form span.compare { display: none; }
	
	div.product-item div.middle table.price-table th,
	div.product-item div.middle table.price-table td,
	div.product-item div.middle table.price-table td  * { font-size: 10pt; }
	
	div.product-items.single-item div.product-item div.middle > div.price-table-container,
	div.product-items.single-item div.product-item div.middle div.price-table { width: 100%; }
	
	div.product-items.single-item div.product-item div.middle table.price-table th,
	div.product-items.single-item div.product-item div.middle table.price-table td,
	div.product-items.single-item div.product-item div.middle table.price-table td  * { font-size: 9pt; }
	
	div.product-item div.control input[type=text] { width: 40px; font-size: 11pt; }

	.header-text h2,
	#pnlMid .header-text h2 { font-size: 22px; }
	
	div.product-item { width: 100%; }
	div.product-item div.top
	{
		box-sizing: border-box;
		width: 100%; 
	}
	
	product-item .control a.button58, .product-item .control a.button58_disabled, .q-form .button58, .product-item .control a.tickButton, .product-item .control a.button.add {
		width: 80px;
		min-width: 80px;
	}
	
	.basketLinks a.view-basket {
		margin-right: 2px;
		margin-left: -4px;
		width: 104px;
		padding-left: 7px;
		padding-right: 7px;
	}
	
	.basketItems div.control { width: auto; min-width: 100%; margin-left: 0px; }
     
    .control input.quantity { width: 56px; }
    .control a.button.cost,
    .control a.button58.cost { width: 60px; min-width: 60px; }
    
	div.control a.save, div.control a.remove { margin-left: -4px; }
	
	div.paymentMethod div.info { width: 180px; }
	
	
	
	

}
    
