/* CSS Document - Based on ECT Premium CSS Layout #2 */
/* Amended by Andrew Lale September 2018 */


/*Button styles*/
input.continueshopping,input.printversion,input.applycoupon,input.configbutton,input.reviewsubmit,input.efsend,input.efclose,input.cartaccountlogin,input.forgotpassword,input.newaccount,input.submit,input.cancel,input.createlist,input.trackinggo,input.logintoaccount,input.createaccount,input.gcsubmit,input.login, input.newaffiliate, input.affiliatelogin, input.search,input.buybutton, input.sccheckout, input.checkoutbutton, input.vieworderstatus, input.viewlicense, input.trackpackage, input.logout, input.editaffiliate,input.backacct,input.giftwrapsubmit,input.giftwrapcancel{
background:#B61818;
color:#fff;
padding:4px 12px;
border:0;
border-radius:4px;
-webkit-appearance: none;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.6);
font-family: FontAwesome, sans-serif; 
}

input.continueshopping:hover,input.printversion:hover,input.applycoupon:hover,input.configbutton:hover,input.reviewsubmit:hover,input.efsend:hover,input.efclose:hover,input.cartaccountlogin:hover,input.newaccount:hover,input.forgotpassword:hover,input.submit:hover,input.cancel:hover,input.createlist:hover,input.trackinggo:hover,input.logintoaccount:hover,input.createaccount:hover,input.gcsubmit:hover,input.login:hover, input.newaffiliate:hover, input.affiliatelogin:hover, input.search:hover,input.buybutton:hover, input.sccheckout:hover, input.checkoutbutton:hover, input.vieworderstatus:hover, input.viewlicense:hover, input.trackpackage:hover,input.logout:hover, input.editaffiliate:hover,input.backacct:hover,input.giftwrapsubmit:hover,input.giftwrapcancel:hover{
background:#ddd;
color:#000;
cursor:pointer;
-webkit-appearance: none;
text-shadow: 0 1px 1px rgba(255, 255, 255, 0.6);
}


input.previmg, input.nextimg, input.detailprevimg, input.detailnextimg{
border-radius:4px;
border:1px solid #ccc;
background:#fff;
margin:4px;
font-size:11px;
cursor:pointer;
color:#006aba;
padding:4px;
}

input.previmg:hover, input.nextimg:hover, input.detailprevimg:hover, input.detailnextimg:hover{
color:#000;
border:1px solid #666;
}

/*Product filter side bar*/

div.moreattributes{
background: rgba(184,184,184, .8) !important;
color:#000;
font-size:12px;
font-weight:bold;
padding:1px;
border:1px solid #999 !important;
}

div.ectpat{
padding:4px 0px; 
}

div.ectpacount{
font-size:0.9em;
color:#666;
}

div.ectpatgrp{
border-bottom: 1px solid #ccc;
margin-bottom:12px;
padding:6px;
}

div.ectpattitle{
margin-bottom:6px;
font-size:1.2em;
}

select.sidefilter { 
display: block; 
padding: 10px 70px 10px 13px !important; 
width: 100%; 
height: auto !important; 
border: 1px solid #ccc; 
border-radius: 3px; 
background: url("../images/select-menu-arrow.png") right center no-repeat; 
background-color: #fff; 
color: #444444; 
font-size: 12px; 
line-height: 16px !important; 
appearance: none; 
-webkit-appearance: none; 
-moz-appearance: none; } 

select.sidefilter option {
    padding: 0 4px;
} 

select.sidefilter::-ms-expand { display: none; } 
select:disabled.sidefilter::-ms-expand { background: #f60; }

.sidefiltergo{
border: 1px solid #ccc; 
border-radius: 3px; 
padding:6px
}
  
div.ectpatgrp input[type="text"] {
border: 1px solid #ccc; 
border-radius: 3px; 
padding:6px
}

/* Quick Buy settings */

div.qbuywrapper div.prodimage{
width:98%;
float:left;
padding:4px;
border:0px;
text-align:left;
}

div.qbuywrapper div.prodname{
float:left;
width:98% !important;
border-bottom:1px solid #ccc;
font-size:1.3em;
text-align:left;
}

div.qbuywrapper div.prodid{
float:left;
width:98% !important;
text-align:left;
}

div.qbuywrapper div.prodsku{
float:left;
width:98% !important;
text-align:left;
}

div.qbuywrapper div.prodmanufacturer{
float:left;
width:98% !important;
text-align:left;
}

div.qbuywrapper div.proddiscounts{
float:left;
width:98% !important;
text-align:left;
}

div.qbuywrapper span.discountsapply{
float:left;
width:98% !important;
text-align:left;
}

div.qbuywrapper div.proddateadded{
float:left;
width:98% !important;
text-align:left;
}

div.qbuywrapper div.prodinstock{
float:left;
width:40% !important;
text-align:left;
}

div.qbuywrapper div.proddescription{
float:left;
width:98% !important;
text-align:left;
}

div.qbuywrapper div.prodrating{
float:left;
width:56% !important;
text-align:right;
}

div.qbuywrapper div.prodminquant{
float:left;
width:98% !important;
text-align:left;
}

div.qbuywrapper div.prodoptions{
float:left;
width:98% !important;
text-align:left;
}

div.qbuywrapper div.optiontext{
float:left;
width:100% !important;
text-align:left;
margin:6px 0px;
font-size:1.2em;
}

div.qbuywrapper div.option{
float:left;
width:100% !important;
text-align:left;
margin:0px 10px;
}

div.qbuywrapper div.prodprice{
float:left !important;
width:48% !important;
font-size:1.3em;
text-align:left;
}

div.qbuywrapper div.listprice{
float:left !important;
width:48% !important;
text-align:right;
font-size:1.3em;
}

div.qbuywrapper div.prodcurrency{
float:left !important;
width:98% !important;
margin:0px;
text-align:left;
}

div.qbuywrapper div.addtocart{
float:left;
width:60% !important;
}

div.qbuywrapper div.addtocart input.buybutton{
width:100% !important;
padding:8px !important;
}

div.qbuywrapper div.detaillink{
float:left !important;
width:38% !important;
margin:0px;
}


div.qbuywrapper input.detaillink{
width:98% !important;
float:left;
margin:4px 0px;
padding-bottom:9px
}


/* The category page 
-------------------------------------*/

/* This is the formatting for the Category header. Added by Andrew Lale 7 May 2019 */
.catheader {
    color: #000000;
    font-size: large;
    border-radius: 3px;
    border: 3px solid #dddddd;
    padding-top: 15px;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 15px;
    line-height: 26px;
}

div.category{
width: 24%;
min-height: 160px;
display: -moz-inline-stack;
display: inline-block;
vertical-align: top;
margin: 2px;
zoom: 1;
*display: inline;
_height: 160px;
padding:6px;
border:1px solid #ccc;
text-align:center;
}

div.category:hover{
border: 1px solid #B61818;
}

div.catnavigation{
    padding: 10px 0px 10px 12px;
    float: left;
    width: 98%;
    font-size: 0.9em;
    border-bottom: 1px solid #ccc;
    margin-bottom: 10px;
    color: #BB0004;
}

.catnavwrapper{
background:#fff !important;
border: 1px solid #fff !important;
}

div.navdesc{
display:none; /* Removes the text "View all products in all categories */
}

div.catimage{
width:98%;
float:left;
}

div.catdesc{
    padding: 0px 0px 4px 4px;
    color: #0D00AB; /* was #AB0104 */
}

div.catname{
padding:4px;
font-size:1.2em;
}

div.catdiscounts, div.allcatdiscounts{
padding:0px;
margin:0px;
font-weight:normal;
color:#DA6B1D;
font-size:0.9em;
}

div.categorymessage{
display:none; /* Removes the text "Click on a category to view products */
}

p.noproducts{
margin-top:8px;
width:100%;
float:left;
}


/* The products page 
-------------------------------------*/

div.prodfilter{
float:left;
padding:2px;
margin-bottom:4px;
}

div.prodfilterbar{
float:left;
width:98%;
margin-bottom:14px;
}

div.filtertext{
padding:12px 6px;
}

input.prodfilter{
padding:8px;
border: 1px solid #ccc;
border-radius: 3px; 
}

select.prodfilter, select.prodoption { 
display: block; 
padding: 10px 70px 10px 13px !important; 
max-width: 100%; 
height: auto !important; 
border: 1px solid #ccc; 
border-radius: 3px; 
background: url("../images/select-menu-arrow.png") right center no-repeat; 
background-color: #fff; 
color: #444444; 
font-size: 12px; 
line-height: 16px !important; 
appearance: none; 
-webkit-appearance: none; 
-moz-appearance: none; } 

select.prodfilter option, select.prodoption option { padding: 0 4px; } 

select.prodfilter, select.prodoption::-ms-expand { display: none; } 
select:disabled.prodfilter, select.prodoption::-ms-expand { background: #f60; }

.ectpfatt select{
min-width:190px !important;
margin-bottom:2px
}

div.product {
width: 32%;
min-height: 260px;
display: -moz-inline-stack;
display: inline-block;
vertical-align: top;
margin: 2px;
zoom: 1;
*display: inline;
_height: 260px;
padding:6px 6px 0px 6px;
border-top:1px solid #ccc;
border-left:1px solid #ccc;
border-right:1px solid #ccc;
border-bottom:2px solid #fff;
}

div.product:hover{
border-bottom:2px solid #B61818;
}

div.prodnavigation{
padding:10px 0px 10px 12px;
float:left;
width:98%;
font-size:0.9em;
border-bottom: 1px solid #ccc;
margin-bottom:10px;
}

div.checkoutbutton{
float:left;
width:98%;
text-align:right;
margin-bottom:12px;
}

.prodratinglink{
font-size:0.8em;
}

div.allproddiscounts{
color:#DA6A1E;
width:98%;
margin:4px 0px;
float:left;
}

.proddiscounts, .discountsapply{
color:#DA6A1E;
width:98%;
margin:4px 0px;
float:left;
}

div.prodmanufacturer{
width:98%;
margin:4px 0px;
float:left;
}

div.prodsku{
width:98%;
margin:4px 0px;
float:left;
}

div.prodimage{
padding: 18px;
text-align:center;
}

img.prodimage{
max-width:100%;
height:auto;
}

div.prodname{
padding-top:6px;
font-size: 1.1em;
margin:4px 0px;
float:left;
width:98%
}

div.prodinstock{
margin:4px 0px;
width:98%;
float:left;
}

div.proddescription{
margin:4px 0px;
float:left;
font-size: 0.9em;
line-height: 1.5em;
width:98%;
}

div.prodoptions{
float:left;
width:98%;
}

div.optiontext{
margin:4px 0px;
width:98%
}

div.option{
margin:4px 0px;
}

select.prodoption{
width:98%;
}

div.option input[type="radio"] {
margin-top: -2px;
margin-right:6px
}

div.listprice{
width:98%;
float:left;
font-size: 0.9em;
margin:4px 0px;
}

span.yousave{
background:#0065A7;
color:#fff;
margin:4px 0px;
font-size:0.9em;
}

div.prodprice{
float:left;
width:65%; /* was 98% */
margin:4px 0px;
}

div.prodrating{
float:left;
width:98%;
margin:4px 0px;
}

div.prodcurrency{
float:left;
width:98%;
font-size: 0.8em;
color:#666;
margin:4px 0px;
}

div.addtocart{
float:left;
margin:4px 0px;
width:30%; /* was 98% */
}

div.quantity0div, div.quantity1div, div.quantity2div{
    /* [disabled]float: left; */
    /* [disabled]display: inline-block; */
    /* [disabled]margin:4px 6px 0px 0px; */
    margin:0;
}

input.quantity0input{
border:1px solid #ccc;
padding:4px 4px 3px 4px;
}

div.notifystock{
float:left;
width:98%;
margin:4px 0px;
}

div.configbutton{
float:left;
width:98%;
margin:4px 0px;
}

div.outofstock{
text-align:center;
margin:4px 0px;
font-weight:bold;
width:98%;
}

div.prodid {
width:98%;
margin:4px 0px;
float:left;
}

div.proddateadded {
width:98%;
margin:4px 0px;
float:left;
}

div.proddateaddedlabel{
float:left;
}

div.proddateaddeddate{
float:left;
margin-left:4px;
}

/* this is the information of the multiple options. was 180px. changed nov 2018 */
div.multioptiontext{
width:48%;
}

div.detaillink{
float:left;
width:49%;
text-align:center;
padding:0px;
margin:10px 1px 0px 0px;
}

div.qbuybutton{
float:left;
width:49%;
text-align:center;
padding:0px;
margin:10px 0px 0px 1px;
}

input.detaillink, input.qbuybutton{
float:left;
width:100%;
text-align:center;
padding:6px;
margin:0px;
background:#B61818;
border:0px;
color:#fff;
border:0;
border-radius:4px;
-webkit-appearance: none;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.6);
font-family: FontAwesome, sans-serif; 
}

input.detaillink{
background:#4793c6;
}

input.detaillink:hover, input.qbuybutton:hover{
background:#ddd;
color:#000 !important;
cursor:pointer;
-webkit-appearance: none;
text-shadow: 0 1px 1px rgba(255, 255, 255, 0.6);
}

div.pagenums{
text-align:center;
float:left;
margin:4px 0px;
}

p.cstitle{
float:left;
width:98%;
padding:4px 6px;
border:1px solid #ddd;
background:#efefef;
border-radius:4px;
font-size:1.1em;
}


/* The product detail page 
-------------------------------------*/

/* This is the breadcrumb link at the top of the product */
div.detailprodnavigation{
	width: 98%;
	margin: 5px;
	background-color: #eee;
	border-bottom: 1px solid #eee;
}

/* This is the div element for the main picture of the product and thumbnails */

div.detailimage{
width:45%; /* was 48%. Changed as per support/topic.asp?TOPIC_ID=110745 */
padding:10px;
float:left;
    min-height:400px;  /* added 1 12 */
    text-align:center;  /* added 1 12 */
    box-sizing:border-box;  /* added 1 12 */
} 

/* This is the main image css control */
img.detailimage{
max-width:100%;
height:auto;
}

/* copied in from Door Entry Shop 01 12 */
div.ectnomagicimage{
display:flex;
justify-content:center;
align-items:center;
flex-direction:column;
}    /* remmed out by AML for testing 22 11 */

div.detailthumbnailimage{
text-align:center;
}

div.detailcheckoutbutton{
clear:both; 
}

/* copied in from Door Entry Shop 01 12 */
div.detailname{
float:right;
width:53%;
text-align:left;
margin:0 1%;
}

/* This is the name of the product */
div.detailname h1 {
    font-size: 1.8em;
    margin-top: 10px;
    margin-bottom: 12px;  /* was 5px */
    float: left;
    width: 100%;  /* originally 50% */
    border-bottom: 1px solid #eee;
    clear: none;  /* added 01 12 */
}

/* This is the discount if applied to the product */
div.detaildiscounts{
width:53%; /* was 50% */
margin:1px 1%;  /* was 5px */
float:right;   /* was left */
color:#EA8626;
}

/* This is the styling for price of the product*/
div.detailprice{
    font-size: 1.5em; /* was 1.5em */
    font-weight: bold;
    float: right; /* was left */
    width: 53%;   /* was 50% changed 10/11  */
    margin: 2px 1%;  /* was 10 tp 10 rght 5 left 5 bottom 20 */
    /* clear: right;  remmed 1 12 */
}

div.detaillistprice::before { 
content: " / ";
}

div.detaillistprice{
    float: right; /* was left */
    width:53%;
    color: #DA6A1E;
    margin: 2px 1%;  /* was 5px*/
    font-size: 1.5em;
    /* clear: left;  remmed 1 12 */
}

div.detailcurrency{
    font-size: 0.8em;
    float: left; /* was left */
    width: 98%; /* was 98% */
    color: #666;
    margin:0px 1%;  /* was 10px */
    /* clear: left;  remmed 1 12 */
}

div.detailinstock{
    float:right;  /* was left */
    width:53%; /* was 98% */
    margin:8px 1%;   /* was 0px 0px 6px 10px  */
    font-size: 1.2em;
    color:#666;
}

div.detailreviewstars{
float:right;
width:24%;  /* was 20% */
margin:5px 1%;  /* was 5px 6px */
text-align:right;
}

/* copied in from Door Entry Shop
div.detailshortdescription{
     [disabled]font-size:0.9em; 
    margin: 5px 1%;
    padding: 4px;
     [disabled]line-height: 1.8em; 
    float: right;
    width: 53%;
    background: #eee;
    border-radius: 4px;
    box-sizing: border-box;
}   */

 /* temporarily remmed out and replaced 01 12 */ 
div.detailshortdescription{
    margin: 5px 1%;   /* was 5px  */
    /* [disabled]padding-top: 10px; */
    padding-right: 10px;
    padding-left: 10px;
    /* [disabled]padding-bottom: 10px; */  /* was PR 8px PL 20px */
    float: right;  /* was left */
    width: 53%;
    background: #eee;
    border-radius: 4px;
    box-sizing: border-box; /* added 1 12 */
    /* [disabled]font-size: 1.1em; */
    /* [disabled]line-height: 1.8em;  */
}

div.detailshortdescription p{
padding:0px; 
}

div.detailmanufacturer{
float:right;  /* was left */
width:53%;   /* was 47%  */
margin:6px 1%;   /* was 4px 8px */
color:#666;
/* text-align:left;  remmed 1 12 */
    clear:right;
}

div.detailid {
    width: 53%;   /* was 50 */
    float: right;   /* was left */
    margin: 6px 1%;  /* was 4 8 5 4 */
    color: #666;
    clear:right;  /* added 1 12 */
}


div.detailsku{
    width:53%;
    float:right;
    margin:6px 1%;
    color:#666;
    clear:right;
}

div.detaildateadded {
width:53%;   /* was 47% */
float:right;   /* was left */
margin:6px 1%;  /* was 4px 8px */
color:#666;
}

span.detailidlabel,span.detailinstocklabel,span.detailmanufacturerlabel{
font-weight:bold;
}

div.detaildateaddedlabel{
display:inline-block;
font-weight:bold;
margin-right:4px;
    /* float:left;  remmed out 1 12 */
}

div.detaildateaddeddate{
    display:inline-block;  /* copied from DES */
/* float:left;  remmed 1 12 */
/* margin-left:4px;  remmed 1 12 */
}

/* This version copied in from Door Entry Shop Com 23 11 */
div.detaildescription{
    font-size: 0.9em;
    margin: 5px;
    padding-top: 4px;
    line-height: 1.8em;
    float:left;    /* removed for testing  22 11 */
    clear: left;    /* width: 96%;    also added AML 17/11/21 */
    border: 2px solid #D9D7D7;  /* added AML 07 12 21 */
    border-radius: 6px;   /* added AML 07 12 21 */
}  

/* This is the original long description of the product INSTANCE 1 

div.detaildescription{
    font-size: 0.9em;
    margin: 5px;
    padding-top: 4px;
    line-height: 1.8em;
    float: left;
    width: 50%;
    border: 2px solid #D9D7D7;
    border-radius: 6px;
}
*/

div.searchwords{
    font-size: 0.9em;
    margin: 5px;   /* was 10px */
    padding: 4px;
    line-height: 1.8em;
    /* [disabled]float:left; */
    /* [disabled]width: 48%; */ /* was 98% */
    /* [disabled]background: #f2f2f2; */
    /* [disabled]border-radius: 4px; */
    border: 1px solid #ddd;
}

/* This is the container for the option text and content */
/* change at your peril */
div.detailoptions{
    margin: 10px;  /* was T 10 R 10 L 10 B 10 */
    padding: 4;  /* was 4px */
    float: left;  /* was left */
    width: 98%;   /* was 98% */
    background-color: #EEEEEE;
}

/* This is the option text box */
div.detailoptiontext{
	display: inline-flex;
	float: left;
	margin-top: 5px;
	margin-right: 1px;
	margin-left: 5px;
	margin-bottom: 5px;
	width: 48%;
	font-size: 1.4em;
}

/* This is the styling for the options themselves */
div.detailoption{
	float: left;
	width: 50%;  /* was 96% */
	margin-left: 16px;
}

/* QUANTITY container this is first */

/*div.detailquantity {
    float: right;  changed to left by AML 18/11 for experimental purposes 
    [disabled]margin: 10px 0px 0px 4px; 
    padding-top: 10px;   was 12px changed 10/11 
    width: 51%;  was 51%  changed 10/11 
}
*/

/* QUANTITY writing next to box */

div.detailquantitytext{
    float: left;
    /* width: 50%;  added by AML 19 11 21 */
    padding-top: 0px;
    padding-right: 12px;
    padding-left: 0px;
    padding-bottom: 0px;
    margin-top: 12px;
    font-size: 1.2em;    /*width: auto;*/ /* inserted 3 Nov 2021 AML */
    /* [disabled]width: 48%; */
}

div.detailquantity1div{
margin:7px 30px 6px 0px;  /* was 7px 30px 6px 0px */
    overflow: hidden;
} 

div.detailquantity2div{
margin:6px 3px 6px 0px;
    overflow: hidden;
} 

/* QUANTITY this is the actual box */

input.detailquantity0input{
border:1px solid #ccc;
padding:5px 20px;
margin:8px 16px 0px 2px;
overflow:hidden;    
}

/* Div for the Add to Cart button */

div.detailaddtocart{
    float: right;  /* was left changed 3 Nov 2021 AML */
    text-align: left;
    margin: 1px 14px;  /* was 1px 14px */
    width: 50%; /* was 50% changed 3 Nov 2021 AML */
    clear: right;
}

/* copied in from Door Entry Shop 24 11 */
div.detailaddtocartquant{
    float: right;
    width: 53%;
    margin:10px 1%;/* [disabled]margin: 5px; */ /* was 10px 1% */
    padding: 0;   
    display: flex;
    align-items: center;
}
div.detailaddtocartquant div.quantity0div, div.detailaddtocartquant div.quantity1div, div.detailaddtocartquant div.quantity2div, div.detailaddtocartquant .detailquantity0input{
margin:0;
}
div.detailaddtocartquant > .detailaddtocart, div.detailaddtocartquant > .detailquantity{
	float:none;
	width:auto;
	margin:0;
}
div.detailaddtocartquant > .detailquantity{
    margin-right:4px;    
}
div.detailaddtocartquant > .detailaddtocart{
	flex-grow:1;
}

/* note to self- most of the buybutton styling is in style.css */

/* this is the old version of this element */
/* div.detailaddtocartquant input.detailbuybutton{
	margin:0;
}  */

/* The old version buy it now button 

input.detailbuybutton{
    [disabled]width:98%;  was 98% 
    padding: 5px;
    font-size: 16px;
    margin-top: 2px;
} */

/* copied in from Door Entry Shop */
input.detailbuybutton,button.detailbuybutton,input.detailnotifystock,button.detailnotifystock,input.detailwishlist,button.detailwishlist,input.detailoutofstock,button.detailoutofstock{
width:100%;
padding:6px 4px;
font-size:16px;
margin-top:2px;
}

span.detaildiscountsapply{
display:none  /* 
margin:1px 5px;
float:left;
width:53%;
color:#EA8626; */
	
}

input.detailprodoption{
margin-right:6px;
}

select.detailprodoption { 
display: block; 
padding: 10px 70px 10px 13px !important; 
max-width: 100%; 
width: 48%;  /* was 100% */
height: auto !important; 
border: 1px solid #ccc; 
border-radius: 3px; 
background: url("../images/select-menu-arrow.png") right center no-repeat; 
background-color: #fff; 
/* color: #930000; was 444444 */ 
font-size: 12px; 
line-height: 16px !important; 
appearance: none; 
-webkit-appearance: none; 
-moz-appearance: none; } 

select.detailprodoption option { padding: 0 4px; } 

select.detailprodoption::-ms-expand { display: none; } 
select:disabled.detailprodoption::-ms-expand { background: #f60; }

.detailoption input[type="radio"] {
margin-top: -2px;
}

div.detailmultioptiontext{
padding: 4px;
clear:none;
}

input.multioption{
border:1px solid #ccc;
padding:4px;
}

div.previousnext{
margin:20px 0px;
float:left;
width: 98%;  /* was 98% */
text-align:center;
font-size:0.9em;
}

div.detailoutofstock{
font-size: 1.4em;
float:left;
width:48%;
text-align:left;
padding-top:16px;
text-align:center;
}

div.detailnotifystock{
font-size: 1.4em;
padding-top:16px;
float:left;
width:48%;
text-align:center;
}

div.review{
float:left;
margin-top:16px;
width:48%;  /* was 98% */
}

span.numreviews{
font-size:1.2em
}

hr.review{
height: 0;
border-width: 1px 0 0 0;
border-style: solid;
border-color: #bbb;
padding:4px;
margin-top:6px;
}

div.reviewprod{
background-color:#eee;
padding:10px;
}

input.askaquestion, input.emailfriend{
    background: #2868B2;
    color: #fff;
    height: 21px;
    border-radius: 4px;
    font-size: 12px;
    cursor: pointer;
    margin-top: 8px;
    font-family: FontAwesome, sans-serif;
}

input.askaquestion:hover, input.emailfriend:hover{
background:#1BABF1;
}

div.socialmediabuttons{margin:10px 8px;background:#fff;width:98%;float:left}

div.socialmediabutton{float:left;display:inline-block;padding:6px;}
div.socialaskaquestion{float:left;}
div.sociallinkedin{margin-top:8px}
div.socialfacebook{margin-top:8px}
div.socialtwitter{margin-top:8px}
div.socialgoogle{margin-top:7px}
div.socialpinterest{margin-top:6px}
div.socialcustom{margin-top:8px}

div.reltab{
width:100%;
float:left;
border: 1px solid #eee;
}

div.reltabimage{
float:left;
width:20%;
padding:4px;
clear:left;
}

img.reltabimage{
max-width:100%;
height:auto;
}

div.reltabname{
float:left;
width:80%;
margin-top:8px;
}

div.reltabdescription{
float:left;
width:80%;
}

/* Cross Sell formatting copied in from Door Entry Shop 2 12 */
/* Home page cross selling
-------------------------------------*/
div.csproduct{
display:inline-block;
width:32.3%;
min-height:260px;
vertical-align:top;
margin:0.5%;
padding:6px;
box-sizing:border-box;
}
div.csprodimage{
display:flex;
flex-direction:column;
justify-content:center;
width:100%;
min-height:180px;
align-items:center;
margin:0 0 2px 0;
padding:6px;
border:1px solid #ccc;
box-sizing:border-box;
}
div.csprodimage:hover{
border:1px solid #a3a3c4;
}
img.csprodimage{
max-width:100%;
height:auto;
max-height:180px;
}
div.csprodname{
padding:6px;
font-size:1em;
margin:0px 2px;
text-align:center;
background:#666
}
div.csprodname a:link,div.csprodname a:visited{
color:#fff;
}
div.csprodname a:hover{
color:#CF9436;
}
div.csprodinstock{
margin:4px 0px;
float:left;
}
.prodratinglink{
font-size:0.9em;
}
div.csprodrating{
margin:2px 0px;
float:right;
}
div.cslistprice{
font-size:1em;
margin:2px 0px;
text-align:center;
}
div.csprodprice{
text-align:center;
margin:6px 0px;
font-size:1.1em;
clear:both;
}
div.csprodcurrency{
font-size:0.8em;
color:#666;
margin:2px 0;
}
div.csdetaillink,div.csqbuybutton{
width:49%;
display:inline-block;
text-align:center;
padding:0;
}
input.csqbuybutton,input.csdetaillink{
width:82%;
border:0;
margin:0;
padding:6px 0;
}

/* RESPONSIVE CSS from here on */

/*This is the first breakpoint and contains styles for screens 1200px to 880px*/
@media screen and (max-width: 1200px) {
    /* not sure what this does */
div.category{
width:91%;  /* was 31%  */
}

    /* added to this breakpoint by AML 4 Nov 2021 */
div.product{
width:100%;
}    

    /* This is the options container. was 60% */
div.detailoptions{
width:98%;
}

	/* this is the options themselves, added by me to this breakpoint Nov 2018 */
div.detailoption{
width:71%;
}

    /* this is the name of the product */
div.detailname h1 {
font-size: 1.6em; /* was 1.8em  */
margin:5px;
width:50%;  /* originally 68% */
border-bottom:1px solid #eee;
}

div.detaildescription{
    font-size: 0.9em;
    margin: 5px;
    padding-top: 4px;
    line-height: 1.8em;
    float: left;
    width: 100%;
    border: 2px solid #D9D7D7;
    border-radius: 6px;
}    

/*This is the second breakpoint and contains styles for screens 880px to 650px*/
@media screen and (max-width: 880px) {
/* added to this breakpoint by AML 4 Nov 2021 */

/* product page styling */    
div.product{
width:100%;
}
    
div.prodinstock{
width:98%;
}
  
div.prodrating{
width:98%;
float:left;
text-align:left;
}
  
div.prodprice{
width:98%; /* was 98% */
}

div.listprice{
width:98%; /* was 98% */
text-align:left;
}
/* end of product page styling */
    
/* Product detail page styling */

div.detailname,div.detailprice,div.detailaddtocart,div.detailquantity,div.detailcurrency,div.discountsapply,div.detaillistprice,div.detailreviewstars,div.detailshortdescription,div.detaildiscounts,div.detailaddtocartquant{
width:auto;
float:none;
}

/* background colour added by AML 07 12 2021 */    
div.detailoptions {    
    width:auto;
    float:none;
    background-color: #EEEEEE !important;
}
    
div.detailimage{
width:auto;
float:none;
min-height:auto;
}
div.detailname h1{
margin:1px 0px 0px 3px;
float:none;
width:auto;
}
span.detaildiscountsapply{
margin:1px 5px;
float:none;
width:auto;
}
div.detailprice{
    font-size: 1.2em;
    float:none;
    width:auto;
    margin:5px 0px 0px 5px;
}
div.detailinstock{
float:none;
width:auto;
margin:10px 12px 10px 5px;
}
div.detailoption{
width:71%;
}
div.detailaddtocart{
width:70%;
}
div.detailmanufacturer,div.detailid,div.detailsku,div.detaildateadded,div.review{
float:none;
width:auto;
margin:6px;
}
    }
    
/* end of Product Detail page styling */

/*This is the third breakpoint and contains styles for screens 650px to 440px*/
@media screen and (max-width: 650px) {

    /* Product page styling */
div.product{
width:100%;
}

    /* Detail page styling */
/* experimental */
div.detailimage {
    width:100%;
    height:auto;
    float:none;
}    
    
div.detailshortdescription{
    clear:both;
    }
    
div.detailaddtocartquant{
    float:none;
    clear:both;
    }
div.detailoptiontext{
margin:18px 0px 10px 0px;
font-size:1.2em
}
    
    
div.category{
width:48%;
}

}

/*This is the fourth breakpoint and contains styles for screens 440px and below*/
@media screen and (max-width: 440px) {

    /* Detail page styling */

div.detailaddtocart{
width:40%;
}
div.detailreviewstars{
text-align:left;
}    

    /* Category page styling */
div.category{
width:98%;
}

    /* Quickbuy styling */
div.qbuywrapper div.prodinstock{
width:98% !important;
}

div.qbuywrapper div.prodrating{
width:98% !important;
text-align:left;
}

div.qbuywrapper div.prodprice{
width:98% !important;
}

div.qbuywrapper div.listprice{
width:98% !important;
text-align:left;
}

    /* Product Detail page styling */
/* this is the name of the product */
div.detailname h1 {
font-size: 1.4em; /* was 1.8em  */
margin:5px;
width:98%;  /* originally 68% */
border-bottom:1px solid #eee;
}    
    
div.detailprice{
width:98%;
}

div.detaillistprice::before { 
content: " ";
}

div.detaillistprice{
float:left;
width:98%;
margin-left:10px;
}

div.detailcurrency{
margin-left:10px;
}