/* CSS Document for ECT Premium Responsive Design */
* {	-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
:after, :before {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.clearfix:after {
clear: both;
content: ".";
display: block;
height: 0;
visibility: hidden;
}
.clearfix {
display: inline-block;
}
.clearfix {
display: block;
}
body {margin:0px; padding:0px; font-family:'Open Sans',Arial, Helvetica, sans-serif; font-size:15px;}
.container { padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto;}
.container { max-width: 95%;}  /* 1170px  */
.row { margin-left: -15px;  margin-right: -15px;}
.ctr{text-align:center}
p{line-height:1.6em; color:#7b7b7b;}
li{color:#7b7b7b;}
li,ul{list-style-type:none;}
img{max-width:100%;height:auto}
.col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9 {	float: left;}
.col-12 {width: 100%;}
.col-11 {width: 91.66666667%;}
.col-10 {width: 83.33333333%;}
.col-9 {width: 75%;}
.col-8 {width: 66.66666667%;}
.col-7 {width: 58.33333333%;}
.col-6 {width: 50%;}
.col-5 {width: 41.66666667%;}
.col-4 {width: 33.33333333%;}
.col-3 {width: 25%;}
.col-2 {width: 16.66666667%;}
.col-1 {width: 8.33333333%;}
.col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-3a, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9{
position: relative;
min-height: 1px;
padding-right: 15px;
padding-left: 15px
}
.text-left { text-align:left;}
.text-right { text-align:right;}
.text-center { text-align:center;}
.mainWrapper { margin:0px; padding:0px;}
.headerWrapper { margin:0px; padding:0px;}
.midWrapper { background:#f1f1f1;margin:0px; padding:10px 0;}
.midWrapper1 { background:#fff;margin:0px; padding:10px 0;}
.midWrapperGrey { background:#f0f0f0;margin:0px; padding:10px 0;}
.footerWrapper { margin:0px; padding:0px; background:#f1f1f1; border-top:1px solid #d9d9d9; color:#2d2d2d; line-height:20px;font-size:14px}
.mid_left { float:left;clear:left;}
.mid_right { float:right;}
h3{font-size:20px}
.bannerWrapper { text-align:center; max-width:1140px; margin:0 auto; position:relative;}
.bannerWrapper img { max-width:100%}
.slides li { position:relative; text-align:center;}
.flex-control-paging { display:none;}
.sticky {
/*position: fixed;*/  /* Sticky disabled  */
width: 100%;
left: 0;
top: 0;
z-index: 100;
border-top: 0;
}
body.scrolled .nav {
opacity: 0.9;
transition: opacity .9s;
}
body.scrolled .nav:hover {
opacity: 1.0;
transition: opacity .2s;
}

/* Mega Menu */

div.ectmegamenu{
background-color:#555;
}
div.ectmegamenu > ul > li{
background-color:#555;
color:#FFF;
font-size:1.0em;
padding:10px 0;
}
div.ectmegamenu > ul > li:hover{
background-color:#999;
}
div.ectmegamenu > ul > li, div.ectmegamenu > ul > li > ul > li{
text-transform:none;
}
div.ectmegamenu > ul > li > ul > li > ul > li{
text-transform:none;
}
div.ectmegamenu > ul > li > a, span.megamobiletext{
color:#FFF;
}
span.ectmegamenu > a:hover{
color:#FFF;
text-decoration:underline;
}
div.slidercaption{
bottom:10px;
top:auto;
}
/*Internal store naviagtion*/
a.ectlink:link {
color: #006aba;
text-decoration: none;
}
a.ectlink:visited {
color: #006aba;
text-decoration: none;
}
a.ectlink:active {
color: #006aba;
text-decoration: none;
}
a.ectlink:hover {
color: #666;
text-decoration: none;
}
/*Button and form field styles*/
input.ectbutton,button.ectbutton{
background:#005698;
color:#fff;
padding:8px 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;
font-size:1em;
}
input.ectbutton:hover,button.ectbutton:hover{
background:#005698;
color:#fff;
padding:9px 13px;
cursor:pointer;
-webkit-appearance: none;
/*text-shadow: 0 1px 1px rgba(255, 255, 255, 0.6);*/
font-family:FontAwesome, sans-serif
}
input.ectbutton:disabled,button.ectbutton:disabled{
background:#DDD;
color:#000;
cursor:default;
text-shadow:none;
}

div.largereviewstars svg.icon, div.smallreviewstars svg.icon {
fill:#00C000;
}
input.previmg, input.nextimg, input.detailprevimg, input.detailnextimg{
border-radius:4px;
border:1px solid #ccc;
background:#fff;
margin:4px;
font-size:12px;
cursor:pointer;
color:#006aba;
padding:4px;
}
input.previmg:hover, input.nextimg:hover, input.detailprevimg:hover, input.detailnextimg:hover{
color:#000;
border:1px solid #666;
}
/*one line mini login*/
div.minicartoneline1{float:left;padding-top:10px}
div.minicartoneline2{float:left;padding-top:12px}
div.minicartoneline3{float:left;padding-top:12px}
div.minicartoneline3 a.mincart{color:#ccc}
button.ectbutton.ectlink.mincart {
    background-color: #FFF;
    color: #333;
    text-shadow: none;
	margin-top:-5px;
}
input.smaskaquestion,input.smemailfriend{
	font-size:0.9em;
	padding:4px 12px;
}
/*mini drop down cart*/
.ectdp_minicartopen img{display:none;}
.ectdp_minicartmainwrapper{color:#333;background:#555;font-size:14px;}
.ectdp_minicartopen{padding-top:10px;margin-top:2px;font-size:15px;}
.ectdp_minicartopen a{color:#ccc}
.ectdp_minicartopen a:hover{color:#006aba}

.top_row { background-color:#555; padding:0px; color:#fff; font-size:0.8em;}
.topbarNav ul { margin:0px; padding:0px;}
.topbarNav li { margin:0px; padding:0 4px; list-style:none; display:inline-block; border-right:1px solid #4d4d4f; line-height:12px; }
.topbarNav li a { color:#4d4d4f; font-size:12px; text-decoration:none}
.topbarNav li a:hover { color:#000;}
.topbarNav li:last-child { border-right:none;}
.topbarNav li:first-child { padding-left:0px;}
.tplogin {text-align:center}
.minicartoneline{
display:inline-block;
padding-top:9px;
}
.top_row .col-2{padding-left:2px;padding-right:2px}
.top_row .col-8{padding-left:2px;padding-right:2px}
.logo_row { padding:20px 0px 10px 20px;}
.logo { margin:0px; padding:0px;}
.logo_row_right {}
.searchbox{
position:relative;
min-width:130px;
width:0%;
height:40px;
float:right;
overflow:hidden;
-webkit-transition: width 0.3s;
-moz-transition: width 0.3s;
-ms-transition: width 0.3s;
-o-transition: width 0.3s;
transition: width 0.3s;
display: none;
}
.searchbox-input{
top:0;
right:0;
border:1px solid #ccc;
outline:0;
background:#fff;
width:100%;
height:36px;
margin:0;
padding:0px 55px 0px 20px;
font-size:16px;
color:#333;
}
.searchbox-input::-webkit-input-placeholder {
color: #333;
}
.searchbox-input:-moz-placeholder {
color: #333;
}
.searchbox-input::-moz-placeholder {
color: #333;
}
.searchbox-input:-ms-input-placeholder {
color: #333;
}
.searchbox-icon,
.searchbox-submit{
width:130px;
height:36px;
display:block;
position:absolute;
top:0;
font-family:fontawesome,'Open Sans',Arial, Helvetica, sans-serif;
font-size:18px;
right:0;
padding:0;
margin:0;
border:0;
border-left:1px solid #ccc;
outline:0;
line-height:36px;
text-align:center;
cursor:pointer;
color:#555;
background:#fff;
}
.searchbox-icon:hover{color:#000}
.searchbox-open{
width:100%;
}
.left_nav_wrap { border:1px solid #ddd; border-radius:4px; margin-bottom:30px;}
.left_nav_wrap h2 { color:#333;margin:0px; padding:10px 15px 10px 20px; border-bottom:1px solid #ddd; font-size:1.1em; font-weight:normal; position:relative; }
.left_nav { padding:1px 15px;font-size:1em}
.left_nav ul { margin:0px; padding:0 0 0 5px;}
.left_nav li { margin:0px; padding:5px 0px ; list-style:none; }
.left_nav li a { color:#646464; text-decoration:none;}
.left_nav li a:hover { color:#006aba;}
.ft_row1 { padding-top:30px; padding-bottom:30px}
.footerWrapper h3 { margin:0px; padding:0 0 15px; font-size:24px; font-weight:normal; color:#005698;}
.links ul { margin:0px; padding:0px;}
.links li { margin:5px 0px; padding:0 0 0 0px; list-style:none; }
.links li a { color:#006aba; text-decoration:none;}
.links li a:hover { color:#333;}
.popular_categories a { color:#2d2d2d; text-decoration:none;}
.popular_categories a:hover { color:#000;}
.need_help p { margin:0px; padding:0 0 10px;}
.ft_social_icon a { margin-right:5px;}
.copyright_text { border-top:1px solid #fff; padding:15px 0;background:#555;color:#fff}
.copyright_text a{color:#ccc !important}
.copyright_text a:hover{color:#fff !important}
.copyright_row_link ul { font-size:11px;margin:10px; padding:0px;}
.copyright_row_link li { margin:0px; padding:0 10px; list-style:none; display:inline-block; border-right:1px solid #fff; line-height:10px; }
.copyright_row_link li a { color:#ccc; text-decoration:none}
.copyright_row_link li a:hover { color:#fff;}
.copyright_row_link li:last-child { border-right:none;}
.copyright_row_link li:first-child { padding-left:0px;}
/* Paragraph font small size*/
.pclasssmall {font-size: 11px; color:blue;} /* Where * denotes extra */
/* Formats the em tag*/
em {font-style: normal; color:#005698;}  /* 11-04-22 */

/*link properties*/
a:link {
color: #006aba;
text-decoration: none;
}
a:visited {
color: #006aba;
text-decoration: none;
}
a:active {
color: #006aba;
text-decoration: none;
}
a:hover {
color: #666;
text-decoration: none;
}
img.cartimage{
max-width:140px;
}
div.tpcart a.ectlink.mincart{
color: #fff;
}
/* Ammendment overrides from other CSS files
/* Prod detail name in H1 for SEO*/
div.detailname h1 {
    font-size: 1.4em;
    font-weight: 300;
    color: #0020C0;
}
/* Prod detail options heading 13Apr22*/
div.optiontext {
  font-weight: 300;
  color: #005698;
}

/* Softcart button rearrange - 14Apr22*/
div.sccheckout{
position: absolute;
bottom: 5px;
left: 75%;
}
div.scwrap{
position: relative;
}
div.sclinks{
text-align:left;
}

/* Product page name*/
div.prodname {
    font-size: 0.95em;
}
/* Prod page price*/
div.prodprice {
    font-size: 0.95em;
    color: #0020C0;
}
/* Detail page*/
div.detailprice {
    font-size: 1.4em;
    font-weight: 300;
    color: #0020C0;
}
/* Detail page Qty Box*/
div.quantity2div {
    border-radius: 0px;
    width: 105px;
    border: 1px solid #ccc;
    overflow: auto;
    font-size: 1.5em;
    color: #0020C0;
    display: flex;
    align-items: center;
}
/* Removes breadcrumb line Checkout Button */
div.catnavcheckout {
    padding: 5px 10px 5px 0;
    text-align: right;
    margin-bottom: 12px;
	display: none;
}
/* Category name text size*/
div.catname {
    font-size: 0.99em;
}
/* Category description text*/
div.catdesc {
    margin: 4px 8px;
    float: left;
    width: 66%;
    font-size: 0.85em;
}
/* Removes the colon ((:) left behind on products page when the word Price is removed in includes*/
span.prodpricelabel::after {
content: "";
}
/* Removes continue click here message on cart page*/
div.cartemptyclickhere {
    padding: 8px;
    display: none;
}
/* Cart name on Cart page*/
div.cartname {
    font-weight: 300;
    font-size: 1.2em;
    color: #005698;
}


/* Standard cart formatting*/
div.cartgrandtotal {
    display: inline-block;
    white-space: normal;
    width: 45%;
    padding: 3px 0px;
    text-align: right;
    font-size: 1.1em;
    border-bottom: 1px solid #999;
	color: #00C000;
}
div.cartgrandtotaltext {
    display: inline-block;
    white-space: normal;
    width: 53%;
    margin-bottom: 6px;
    padding: 3px 0px;
    font-size: 1.1em;
    border-bottom: 1px solid #999;
    color: #00C000;
}

div.cartcoupontext, div.cartcouponapplied, div.cartcoupon {
    white-space: normal;
    color: #0020C0;
}

div.cartcoupon > input {
    margin: 0;
    padding: 6px;
}

div.estimatortitle {
    font-size: 1.2em;
    padding-bottom: 6px;
    color: #0020C0;
}
/* Softcart formatting*/
div.scprice {
    padding: 3px;
    text-align: left;
    clear: left;
    border-top: 1px solid #567CBB;
	border-bottom: 1px solid #567CBB;
	background: none;
    font-weight: 300;
    color: #0020C0;
}
div.sccarttotal {
    padding: 3px;
    text-align: center;
    border-top: 2px solid #567CBB;
    font-weight: 600;
    color: #00C000;
    letter-spacing: 1px;
}
/*Third Cart page grand total txt & price format */
div.cart3gndtott {
    border-bottom: 1px solid #ccc;
    border-top: 1px solid #ccc;
    margin-bottom: 12px;
    padding-top: 6px;
    padding-bottom: 3px;
    font-size: 1.2em;
    color: #00C000;
}
div.cart3gndtot {
    border-bottom: 1px solid #ccc;
    border-top: 1px solid #ccc;
    margin-bottom: 12px;
    padding-top: 6px;
    padding-bottom: 3px;
    font-size: 1.2em;
    color: #00C000;
}
/* Thanks.php reciept page*/
div.rectotgrandtotal {
    font-weight: 300;
    color: #00C000;
}
div.receiptheadrow, div.downloadheadrow, div.imageuploadrow {
    font-weight: 300;
    color: #0020C0;
}
div.receipttotalscolumn {
    text-align: right;
    margin-top: 20px;
    border-bottom: solid 1px #d1d1d1;
}
div.receiptextra, div.receiptdownload, div.receiptaddress {
    margin: 0.6% 0.6% 0% 0.6%;
    padding: 6px 4px;
    border: 1px solid #f1f1f1;
    box-sizing: border-box;
}
div.receiptsectionhead {
    padding: 10px 0px;
    font-size: 1.0em;
    font-weight: 500;
	text-align: center;
    color: #0020C0;
}

/* Articles remove add to cart*/
/*div.product.hide-addtocart div.addtocart, div.csproduct.hide-addtocart div.csaddtocart {display: none}*/
div.prodarticle div.addtocart, div.prodarticle div.csaddtocart {display: none}
/* Megamenu horiz spacing override from ectcart file - was 1.6em - 14 March 22 */
.ectmegamenu > ul > li a {
text-decoration: none;
padding: 0.4em 1.2em;
display: block;
}



/* Unordered list marker style 19.04.22 */
ul {list-style-type: circle;}

/* Tooltip icon to FA4.7 -- 21-04-22*/
div.opttooltip {
font-size: 155%;
vertical-align: middle;
position: relative;
display: inline;
color: #003366;
margin: 0 0 0 0.2em;
}

div.opttooltip::after {
font-family: "FontAwesome";
content: "\f05a";
color: #005698;
font-weight: 400;
}

div.opttooltip:hover::after {
color: #b00000;
}

/*This is the first breakpoint and contains styles for screens 1024px to 980px*/
@media screen and (max-width: 1024px) {
.nav_bar li {padding: 0 7px;}
.top_row .col-2{width:20%}
.top_row .col-8{width:60%}
}
/*This is the second breakpoint and contains styles for screens 980px to 800px*/
@media screen and (max-width: 980px) {
.relative { position:relative;}
.navTab { display:inline-block; cursor:pointer;}
.navLink { border:1px solid #949494; background-color:#fff; border-radius:4px; padding:10px; position:absolute; width:100%; box-sizing:border-box; z-index:9999; left:0px; top:42px; display:none}
.nav_bar li { display:block; border-right:none; padding:0 0 5px;}
.sticky {
position: -webkit-static; /* Safari */
position: static;
}
}
/*This is the third breakpoint and contains styles for screens 800px to 640px*/
@media screen and (max-width: 800px) {
.top_row .col-8 {width: 100%;}
.top_row .col-2 {width: 50%;}
.col-9 { width:100%;}
.mid_left{width:98%;}
}
/*This is the fourth breakpoint and contains styles for screens 640px to 500px*/
@media screen and (max-width: 640px) {
.logo_row .col-4, .logo_row .col-8 { width:100%;}
.logo_row .col-4 { padding-bottom:1px;text-align:center}
.logo_row_right { padding:0px;}
.logo_row_right .col-7, .logo_row_right .col-5 { width:50%;}
.midWrapper .mid_left, 
.midWrapper .mid_right { width:100%; float:none; clear:both;margin-top:15px;}
.ft_row1 .col-2,
.ft_row1 .col-4,
.ft_row1 .col-3 { width:100%; padding-bottom:20px;}
.mid_right .col-3 { width:100%;}
}
/*This is the fifth breakpoint and contains styles for screens 500px to 360px*/
@media screen and (max-width: 500px) {
.top_row .text-right { text-align:left; padding-top:0px;}
.logo_row_right .topsearchWrap,
.logo_row_right .topsearchWrap { padding-bottom:0px;}
.mid_right .col-4 { width:100%;}
}
