@charset "utf-8";

@font-face {
    font-family: 'Primary';
    src: url('../fonts/Oswald-VariableFont_wght.ttf') ;
		  font-style: normal;
		  font-weight: normal;
}
@font-face {
    font-family: 'Secondary';
    src: url('../fonts/Oswald-VariableFont_wght.ttf') format('truetype');
		  font-style: normal;
		  font-weight: normal;
}
@font-face {
    font-family: 'Third';
    src: url('../fonts/Barlow-Regular.ttf') format('truetype');
		  font-style: normal;
		  font-weight: normal;
}

/* Back of shirt fonts */
@font-face {font-family: 'FONT';
			src: url('../fonts/EFL2425WB.ttf') format('truetype');
}
			
@font-face {font-family: 'FONT1';
			src: url('../fonts/EFL2425WB.ttf') format('truetype');
}

:root {
    /* Palette */
			--background: #FFF;	
			--background-black: #000;	
			--background-dark: #231f20 ;	
			--background-light: #c5b08b;	/*	gold	*/
			--background-white: #FFF;	/*	white	*/
			--border: #000;	
			--border-black: #000;	/*	black	*/
			--border-dark: #999; 	
			--border-light: #c5b08b;	/*gold	*/
			--border-white:#FFF;	/*	white	*/
			--border-grey: #E1E1E1; /*light grey */
			--bright-green: #3DD855;	/*	green	*/
			--button-active:#c5b08b;	/*	god	*/
			--button-hover: #000;
			--button-text: #FFF;	/*	white	*/
			--button-text-hover: #FFF;	/*	white	*/
			--child: #E1E1E1;	/*	grey	*/
			--error: #fe1806;	/*	mkd red	*/
			--icon:#3069c2;	/*	lighter blue	*/
			--input-border:#C4CDD5;	/*	darker grey	*/
			--linerule: #999;	/*	light grey	*/
			--link:#c5b08b;	/*	gold	*/
			--link-black: #000;	/*	black	*/
			--link-black-hover: #000;	/*	black	*/
			--link-dark: #c5b08b;	/*	gold	*/
			--link-dark-hover: #fe1806;	/*	nkd red	*/
			--link-hover:#333;	
			--link-light: #FFF; 	/*	white	*/
			--link-light-hover:#FFF ;	/*	white	*/
			--link-white: #FFF; 	/*	white	*/
			--link-white-hover:#FFF ;	/*	white	*/
			--notice: #fe1806;	/*	mkd red*/
			--overlay: #000000a1;	/*	black transparency	*/
			--promo-color:  #fe1806;	/*	mkd red	*/
			--shadow: #CFCFCF;	/*	grey	*/
			--text-black: #000;	/*	black	*/
			--text-body: #000; 	/*	black*/
			--text-color: #333;	/*	 grey	*/
			--text-color-dark: #fe1806;	/*	mkd red	*/
			--text-color-light: #c5b08b;	/*	gold	*/
			--text-other: #667b3A;	/*	dark green	*/
			--text-white: #FFF;	/*	white	*/
			--transparent:transparent;	/*	transparent	*/

}

@media print {
    a[href]:after {
        content: none !important;
    }
}

/* -------------------------------------------- */
/* ------------------Basic Style--------------------- */
html {overflow-y:scroll; }
html, body {width:100%; padding:0; margin:0;}
body {background: var(--background-white); color: var(--text-body);	font-family: "Primary", Arial, Helvetica, sans-serif; font-size:15px;line-height: 22px; overflow-x: clip;}
* {
	scrollbar-width: thin;
	scrollbar-color: var(--background-white) var(--background-light);
}

a,abbr,acronym,address,applet,article,aside,audio,b,blockquote,big,body,center,canvas,caption,cite,code,command,datalist,dd,del,details,dfn,dl,div,dt,em,embed,fieldset,figcaption,figure,font,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,keygen,label,legend,li,meter,nav,object,ol,output,p,pre,progress,q,s,samp,section,small,span,source,strike,strong,sub,sup,table,tbody,tfoot,thead,th,tr,tdvideo,tt,u,ul,var{background:transparent;border:0 none;margin:0;padding:0;border:0;outline:0;vertical-align:top;}
ol, ul {list-style:none;}
blockquote, q {quotes:none;}
table, table td {padding:0;border:none;border-collapse:collapse; font-size:14px;}
img {vertical-align:top;}
embed {vertical-align:top;}
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video {display:block;}
mark, rp, rt, ruby, summary, time {display:inline;}
::placeholder { font-size: 12px;  font-style: italic;}
input, button, select, textarea {	font-family: inherit;	font-size: 14px;	margin: 5px 0;	border-radius: 0;	border: 1px solid var(--input-border);}
input[type="button"] {height: 25px; cursor: pointer;}
textarea {height:150px;}
b, strong { font-weight:normal;}
p {clear: left;color: var(--text-body);}
.clearfix {clear:both;}
.fa{font-size:20px;margin:0 10px;color:var(--text-white); line-height:0;}
.fa-regular.fa-user {	font-size: 27px;color: var(--button-text);}
.fa-envelope {color:var(--link-dark);margin-top: 13px;}

/* -------------------------------------------- */
/* ------------------Heading and Sundry---------------------- */
a{color:var(--link);text-decoration: none; }
a:hover {color: var(--link-hover);	text-decoration: underline; cursor:pointer;text-underline-offset: 5px;}

a.button{cursor: pointer;color: var(--link-light); display: inline-block;padding: 6px 12px 6px 12px; font-size: 12px; background:var(--background);; font-weight: normal; text-transform: uppercase;}
a.button:hover{ var(--link-hover);}

h1{font-size:1.4em;line-height:2.5em;font-weight:normal;margin:10px 0px; font-family:"Secondary";}
h2{font-size:26px;line-height:2em;font-weight:bold;margin:10px 0px;border-bottom: 1px solid var(--border-light); width:50%; font-family:"Secondary";text-align: left; text-transform:uppercase;}
h3{font-size:22px;line-height:1.5em;font-weight:normal;margin:10px 0px; font-family:"Secondary";text-transform: uppercase;}
h4{font-size:1.3em;line-height:1.5em;font-weight:normal;margin:10px 0px; font-family:"Secondary";}
h5{font-size:1.2em;font-weight:bold;margin:10px; 0px 10px 0px;}
h6{font-size:1.1em;line-height:1.5em;font-weight:normal;margin:10px 0px; font-family:"Secondary";}
.error {color:var(--error);}
.notice {color:var(--notice); }
.clear {clear:both;}
label {width: 19em;float:left;font-weight:normal;margin-top:20px;}
.no_label {margin-left: 19em;float:left;}
li {list-style:none;}

.tooltip {opacity:1;z-index:0;}
.tooltiptext {visibility: hidden;width: 175px; background:var(--background-white); color: var(--color-light);text-align: center;padding: 25px 22px;    
    /* Position the tooltip */ position:absolute; z-index:9; top: 65px; left: 0px; border: 1px solid var(--input-border);}
.tooltip:hover .tooltiptext {visibility: visible;}

.linerule {	color:var(--color-light);;	width:50%;	height:1px;  margin: 20px auto;}

/* -------------------------------------------- */
/* ---------------General Input/Select--------- */
html,button,input,select,textarea{padding:3px; width:auto;height:35px;}
select {	color:var(--text-body);		cursor: pointer;	text-indent: 0.01px;	text-overflow: "";background:var(--background-white);; min-width: 250px;margin: 15px 5px 15px 0px;}
select[multiple] {height: auto;}
option {background:var(--background-white); color:var(--text-body);}
input {	font-size: 14px;margin: 15px 5px 15px 0px;padding: 5px;	color:var(--text-body);	border: 1px solid var(--input-border);width: 250px;vertical-align: top;}
input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;*width:13px;*height:13px; margin:0px;}
input[type="button"] {height: 25px;}
textarea{font-size:14px;margin:2px; padding-left: 5px;color:var(--text-body);border: 1px solid  var(--input-border);height: 100px;width:250px;}
.rwd-break {display:block;}
.smlLabel {width:10em;}

.labelSelect {margin-top:5px;float:left;}
.styleSelect {/*! overflow: hidden; */ /*! min-width:150px; */ }
.styleCard {width:30%; }
.smallSelect {min-width:90px;height: 35px !important;}

.btn{color:var(--button-text); background-color:var(--button-active);	text-transform:uppercase; transition:all 0.6s ease-in-out 0s;	padding: 20px 50px;  border-radius: 0;  line-height: 0;}
.btn:hover, .btn:focus {color: var(--button-text);text-decoration: none;background: var(--button-hover);}
input.sbtn{padding-left: 2px;border: 1px solid  var(--border-black);border-radius: 0px;font-size:10px;height:27px;} 
input.sbtnhov{color:var(--button-hover); cursor: pointer;}
input.btn{width: auto; padding: 20px 50px;border: 0px solid  var(--border-black);border-radius: 0px;height:35px;} 
input.btnhov{color:var(--button-text); cursor: pointer;background: var(--button-hover);}
input.btnm{padding: 5px 15px;border: 0px solid  var(--border-black);border-radius: 0px;height:30px; width:150px; } 
input.btnmhov{color:var(--button-text); cursor: pointer;background: var(--button-hover);}
input.btnl{ padding: 5px 15px;border:0px solid  var(--border-black);border-radius: 0px;height:30px; width:180px; } 
input.btnlhov{color:var(--button-text); cursor: pointer;background: var(--button-hover);}
input.btngrey{width: 130px;border: 0px solid  var(--border-black);border-radius: 0px;height:35px;} 
input.btngreyhov{color:var(--button-text); cursor: pointer;background: var(--button-hover);}
#login_exist .btn {float:right;}
#login_new .btn {float: right;}

input.loginbtn{transition: all 0.6s ease-in-out 0s;background: var(--button-active);color: var(--text-white);text-transform: uppercase} 
input.loginbtnhov{color:var(--button-text-hover); cursor: pointer; background:var(--button-hover);}
input.Binbtn{background: url('../remove.png') center center no-repeat;	width:32px; height:38px; border: 0;cursor: pointer;} 
input.Updatebtn{background: url('../update.png') center center no-repeat;	width:32px; height:32px; border: 0;cursor: pointer;} 
.logInButton {  font-size: 26px; margin:0 35px;  color: var(--button-active);}
.logInButton:hover { color: var(--button-hover) !important;}

label[for="male"] {  float: none;width:150px  }
label[for="female"] {  float: none;}
label[for="radio-1"] {  float: none;width:150px  }
label[for="radio-2"] {  float: none;}
label[for="home_del_1"] {font-family: Primary;}
label[for="collection_1"] {font-family: Primary;}
.collect-msg {	clear: both;}

/* -------------------------------------------- */
/* ------------------Header-------------------- */
*, html {margin:0;padding:0; }

header {background:  var(--background-dark);}
header .wrap-header{height: 121px;background: var(--background-black);}
.siteLinks {background: var(--background-dark);width: 100%;position: relative;height: 40px;padding: 0px 220px 0;font-family: Third;}
.siteLinks a {  font-size: 11px;  color: var(--link-light);  margin-right: 20px;padding-top: 10px;display: inline-block;font-family: Third;}
.siteLinkActive {  height:50px;  background:var(--background-black);  width: 100px;  text-align: center;}

header #logo {position:absolute; top:0;padding: 20px 60px 0px 45px;background: var(--background-black);}
#logo img {	position: relative;	z-index: 999;height: 86px;}
.logoName {text-align:center; font-size:20px;  color:var(--text-white); font-family: Primary-bold, sans-serif; text-transform: uppercase;line-height: 135px;letter-spacing: 3px;}
.socialMedia {display: flex; float:right; padding-top:10px;}
.socialIcon .fa-tiktok {  color: var(--text-black);font-size: 25px;padding: 5px;}
.socialIcon .fas {  color: var(--text-black);font-size: 25px;padding: 5px;}
.socialIcon .fab {  color: var(--text-black);font-size: 25px;padding: 5px;}
.socialIcon .fa-brands { color: var(--text-black);font-size: 25px;padding: 5px;}
.socialIcon .fa-solid { color: var(--text-black);font-size: 25px;padding: 5px;}

header #search {position: absolute;top: 10px; right:60px; z-index: 15;}
#searchForm {display: inline-flex;}
#searchForm input {width: 250px;margin: 1px 0px;}
#searchForm .btn {height: 37px;  width: 80px;  padding: 0;  margin: 0;}
#searchBtn .fa-search::before {font-size:23px;line-height: 30px;color: var(--text-white); cursor: pointer;}

.advancedSearch {display: none;}

#pop3 {width: 100%;  position: fixed; top: 0; left: 0; z-index: 99999;height:350px;background: var(--background-black);}
.pop3Detail {margin:100px 100px 0 100px; height:250px;text-align:left;}
#pop3 h2 {color: var(--text-color-light); font-size: 30px; font-weight: normal;border-bottom: 1px solid var(--border-light);/*! padding: 15px 0; */margin-bottom:30px;}

.pop-buttonS {font-family:'FontAwesome';cursor: pointer;position: fixed; }
.pop-buttonS {color: var(--button-active);transform: scale(.90); transition: transform .25s;}
.pop-buttonS:hover {text-decoration:none;transform: scale(0.7);}
.pop-buttonS.pop-button-closeS:before { content: "\f00d"; color: var(--button-active);font-size: 40px;}
.pop-button-closeS {cursor: pointer;position: fixed;left: 90%;top:120px;}
#searchForm input  {width:350px; }
#searchForm .btn {width: 150px; vertical-align: top;}

.row3 {padding: 70px;}

/* -------------------------------------------- */
/* ------------------Navigation---------------- */

.top-nav {  text-align: center;color: var(--background-black);}
nav {margin:0px auto;text-align: center;clear: both;border-top: 1px solid var(--border-white);}
nav .wrap-nav{height: 40px; background:var(--transparent):}
#menu {width:85%; margin:23px auto 0;background: var(--background-black);} 
.menuIcon {z-index:9 !important ;}
.bar1, .bar2, .bar3 {  background-color: var(--background-white) !important;}
#menuBlock a {  color: var(--text-white); font-size: 18px; font-family: Secondary;  margin: 0 auto;text-transform: uppercase;width: 100%;display: block;font-weight:bold;}
#menuBlock a:after {/*! content: "\f0d7"; */ padding: 0 5px; top:0; font-family: fontawesome;color:var(--text-white) !important;font-size: 12px;position: relative;}

.bmdropdown-content {  background: var(--background-dark) !important;  min-width: 300px !important;border:0 !important;width: calc(100vw);}.bmentry {width: 200px;}
.bmentry:hover {/*! background:var(--background-light); */}
.bmentry a:hover {text-decoration: none;}
.bmentry:hover .bmdropdown-content {display: block;}
.bmdropdown-content li { margin: 0 25%; border-bottom: 0px solid var(--border-white) !important;padding: 5px;}
.bmdropdown-content li a {color:var(--text-white) !important; font-size: 16px !important;}
.bmdropdown-content li a:hover {text-decoration: underline;text-underline-offset: 5px;}
.bmdropdown-content li a::after {content: "\f101" !important;float:right; font-family: fontawesome;/*! color:var(--text-white) !important; */font-size: 12px;}
.bmentry:after{  content: '';  position: absolute;  width: 0; height: 3px;  display: block;  right: 0;  top:35px; background: var(--background-light);  transition: width 2s ease;  -webkit-transition: width 2s ease;}
.bmentry:hover:after{  width: 100%;  left: 0;  background: var(--background-white); top:35px;}
.bmdropdown-content {top:100px !important;position: fixed !important;left: 0;height: 350px;}

/* -------------------------------------------- */
/* ------------------ Content------------------ */
.container {width:100%}
#content {background:var(--background);}
#content .wrap-content{padding-top:0px; padding-bottom: 50px;width: 95%;margin: 0 auto;}
.wrap-content:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }
.mainState {min-height:725px; background: var(--background-white); padding: 10px 20px 10px;  border-radius: 0px;}
#blanket {background:var(--overlay);position:fixed;top:0px;left:0px;width:100%; height:100%;z-index:9;}
#blanket:before{ transform:translate(87.5%,-25%) rotate(30deg) transition:all 1.5s ease-in-out; z-index:1;}

/* -------------------------------------------- */
/* ------------------ My Shop/Account -------------------- */
.myShop {border: 1px solid var(--input-border); padding: 15px; margin: 10px; box-shadow: 2px 7px 15px -4px var(--shadow);width: 95%;display: inline-block;background: var(--background-white);}
.myShop p  {font-size: 14px; line-height: 25px;}
.listOptions {  width: 25%;  float: left;  margin-right: 30px}
.rightBlock {margin:10px 0; width: 72%;float: right;}
#account_update {min-height: 745px;	text-align:center;}
.accountHeader {background: var(--background-white);padding-bottom: 40px;}
.accountMenuInner {	min-width: 260px;}
.accountTitle h3 {	font-size: 18px;	padding: 5px 10px;	text-align: left;}
.fa-solid.fa-bars {	margin: 6px 15px;  cursor: pointer;}
.accountMenu .fa {	font-size: 30px;	color: var(--text-color); margin-right:30px;	}
.accountMenu .fas {font-size: 30px;		color: var(--text-color); margin:0 30px 0 10px;	}
.accountTitle h2 {font-size: 20px;margin:0px}
.accountTitle h3 .fa-solid.fa-bars{}
#hideMobile {display:block;}

.accountHeader h4 a, #orderHistory h4 a{font-size:18px;}
.accountHeader h5 {padding: 7px;font-weight: normal;text-align: left;width: 16em;border: 1px solid var(--border-dark);font-size: 13px; }
.accountMenuInner {padding:5px 10px}
.accountMenuInner .error {padding: 24px;color: var(--error);display: inherit;font-size: 12px;margin: 12px 0;}
.accountInnerform {padding:10px;min-height:700px}
.accountInnerform h2 {font-size:22px; border: none;padding:0px;margin-bottom:0px}
.accountFirstView h3 {margin: 0 0 25px 0;	display: inherit;	padding: 13px;	border: 1px solid var(--border-ldark);	width: 260px;}
.addForm {width:75%}
.addForm p {  clear: both;}
form[name="addr"] {margin: 15px auto; padding: 20px; border: 1px solid var(--border-dark); margin-bottom: 20px;}
form[name="navigation"]  {	margin: 15px auto;	padding: 20px;	border: 1px solid var(--border-dark);	margin-bottom: 20px;}
.preference ul {display: block !important;font-size: 15px;background: none !important;padding: 1em 1em 1em 2.5em;list-style: initial;line-height: 25px !important;border: none !important;}

.myShop a{}
.myShop a:hover {text-underline-offset: 10px; text-decoration: underline;color:var(--link-dark-hover); text-decoration-thickness: 3px;}
p.myShop {height: 55px;padding-bottom: 10px;l;margin-bottom: 20px;}
.myShopSelected {   text-underline-offset: 10px;text-decoration: underline;text-decoration-color: var(--border-light);text-decoration-thickness: 3px;}


#pop4  {text-align:center;}
.pop4Detail {background:var(--background-white); padding: 20px;left:55%;right:10%;top:10%;position: fixed; z-index:999; border: 2px solid var(--background-light);}
#pop4 h2 {color: var(--text-color-light); font-size: 30px; font-weight: normal;border-bottom: 1px solid var(--border-light);text-align: left;margin-bottom:30px;}
#pop4 a {color:var(--button-active);float: right;}
#pop4 a:hover {color:var(--link-black);text-decoration:none;}

.pop-button {font-family:'FontAwesome';cursor: pointer;position: fixed;color:#a2dd9b;transform: scale(.90); transition: transform .25s;}
.pop-button:hover {text-decoration:none;color: var(--link-black);}
.pop-button.pop-button-close:before { content: "\f00d"; top: 10px;position: relative; top:35px;}
.pop-button-close {font-size: 40px !important;cursor: pointer;position: relative;}

/* -------------------------------------------- */
/*------------- Size Guide ----------------*/
#sizeGuide {	}
.sizeButton {width: 65px;	border: 1px solid var(--border);	text-align: center;	display: block;	height: 30px;	float: right;}
#sizeGuidePage {padding: 5px; width:100%; font-size:95%;display:block;}
#popUpDiv {position:absolute;height:auto;border:1px solid var(--border);background:var(--background-white); color:var(--text-color);padding:15px;z-index: 9002;top: 10%;left: 5%;right: 5%;overflow-y: scroll;}
.pop-buttonSz {font-family:'FontAwesome';cursor: pointer;position:absolute; right:20px;color:var(--button-active);}
.pop-buttonSz:hover {text-decoration:none;transform: scale(.90) skewX(10deg);color:var(--button-hover) ;}

.pop-buttonSz.pop-button-closeSz:before { content: "\f00d"; }
.pop-button-closeSz {font-size: 30px !important;cursor: pointer;}

/* -------------------------------------------- */
/* ------------------Footer-------------------- */
footer {background-color:var(--background-white);}
.wrap-footer{}
.bottom-footer {	width: 95%;	margin: 0 auto;border-top: 1px solid var(--border-light);padding: 0 20px;}
.copyright{padding:0px 0px 50px 0;color:var(--text-black); margin: 0 auto;width: 100%;clear: both;}
.copyright img {	margin: 0 20px 0 0;float: left;height: 100px;}
.copyright span {	font-size: 18px;		line-height: 40px;font-family: Secondary;text-transform: uppercase;}

.footer-base {margin: 0px 0 30px; /*! color:var(--text-white); */}
.footer-base a {color:var(--text-black);}
.toggle-footer img {  height: 25px;  float: left;  margin: 10px;}
.bottom-footer h4 {font-size: 18px !important;text-transform: uppercase;}

.toggle-footer {
  border-left: 2px solid var(--border-white);
  /*! padding-left: 15px; */
}

#links_footer3 p {color: var(--text-black);}

#showCookie {background:var(--background);height: 90px;position: fixed;bottom: 0px;width: 100%;padding: 10px;z-index: 999;text-align: center;border-top:1px solid var(--input-border)}
#showCookie p {color: var(--text-white);font-size: 14px;display: inline;}
#showCookie a {color:var(--link-dark);}
#showCookie a:hover {color: var(--link-black);}
#closeCookie {	margin: 0 20px;background: var(--background-light);}
.cookieClose .fa {  color: var(--text-white);   width: 80px;margin-top: 10px;}
#closeCookie:hover {  color: var(--text-white); background:var(--link-black);}

#btn3 {background: var(--button-active) none repeat scroll 0 0; color: var(--text-white); text-align:center; transition: all 0.5s ease-in-out 0s;
		margin:15px;	display: inline-block; height: 50px;right:0;position: fixed;	padding: 15px;bottom: 20px; line-height:0;border: 0;}
.btn3:hover {color:var(--text-white);background:var(--button-hover);}	
.btn3:hover .fa-arrow-up {color: var(--text-white);}

/* -------------------------------------------- */
/* ------------------Breadcrumb---------------- */
.breadcrumbGroup{ color:var(--text-body); line-height:18px; font-size: 12px;  padding-left:10px;}
.breadcrumb {margin-bottom: 3px;background:transparent; font-size: 12px}
.breadcrumb a {color:var(--link-dark);	}
.breadcrumb a:hover { color: var(--background);	text-decoration:underline;  cursor: pointer;}

/* ------------This section controls the LOOP displays on viewbasket, orderhistory, confirmorder and accept_order--------- */
/*These are the styles on products, accept order, viewbasket, order history, wish list and order confirmations pages */
#orderHistory p {clear: none;}
#confirmOrder p {clear: none;}
.miniHeader {text-align:left !important; float:left; margin:15px 0; font-family: Secondary;}
.StyleDescription.miniHeader {	}
#viewbasket.StyleDescription.miniHeader {padding-right: 145px;}
.StyleProductFloat {float:left;clear:none;}
.StyleProductstandard {}
.StyleDate {width:130px;}
.StyleOrderNo\. {width:80px;}
.StyleName {}
.StylePrice {}
.StyleUnitPrice {width:80px;}
.StyleQuantity {width:80px;text-align: center;}
.StyleQuantity.miniHeader {  text-align: center !important;}
.StyleCost {width:80px;}
.StyleOriginalPrice {width:80px;}
.StyleProducttsmmo {}
.StyleProduct {color:var(--text-body);}
.StyleDescription {width:340px;margin-left:30px;margin-right:80px;display:inline-block;}  
.StyleStatus {width:70px;}
.StyleDespatch {width:80px;}
.StyleConfirmationRef {width:90px;}
.StyleConfirmationNumber {width:90px;}
.StylePriority {width:40px;}
.StyleUnitPrice.miniHeader {}
.StyleUpdate {}
.StyleAddtobasket {}
.StyleRemoveitem {}

.StyleProductzticket {}
.StyleTicket {width:130px;}
.StyleWinningNumber {width:130px;text-align:center;}
.StyleWinner\'sName {width:130px;}
.StyleTicket {width:130px;margin-left:20px;}
.StyleEvent {text-align:left; width:130px;margin-right:15px;}
.StyleDate\/Time {text-align:left; width:80px;margin-left:15px;}
.StyleLocation { width:200px;margin-left:50px;}
.StyleTicketPrice {width:100px;}
.StyleLocation.miniHeader {margin-left: 80px;}
.eventHeader {font-size: 20px; color:var(--text-white); line-height:0px}
.eventHeadern:hover {color: var(--text-white);}
.eventHeader:hover, .eventHeader:focus { color: var(--text-white);  background: var(--background);}
#ticketProduct img {height: 75px;	margin: 15px 0;}


.StyleProductticket {}
.StyleProducttour {} 
.StyleProducttour_promo {} 

.StyleProductprepaid {color: var(--text-body);	} 
.StyleProductcurrency {color:var(--text-body);	 } 
.StyleProductprepaidsup {color:var(--text-body);	 } 
.StyleProducttc {color:var(--text-body);	 }
.StyleCurrency{	text-align:left; width:230px;}
.StyleForeignAmount{display:inline; padding: 0px 55px;}
.StyleForeignHeader{margin-left:50px;}
.StyleSterlingAmount{text-align:left; width:180px; margin-left:30px;}
.StyleRate {width:100px;margin-right:20px;}
.StyleBuyRate {text-align:right; padding-right:10px; }

.ecommerceComments::before {content: "\a";white-space:pre;}

/*--------------- floating baset module ----------------*/

#basketShow .fa-shopping-bag {color: var(--text-white);font-size: 22px; margin:0 3px 0 35px;}
#basketShow a {  color: var(--link-light);}
#basketcell { position: relative; float:right; margin: 21px 50px 0 10px; line-height:22px;}
#basketcell a {color: var(--text-white); font-size: 14px; line-height: 23px;}
#basketcell #basketpop { display: none; z-index:100; background: var(--background-white);  border: 1px solid var(--border-black);	color: var(--text-body);	 padding:20px; }
#basketcell:hover #basketpop { display: block; position: absolute; margin-left:-215px; top:20px; }
#basketpop a {color:var(--link);}
#basketShow span {font-size:14px}
.cartMain {	margin-left: 5px;}

/* Basket drop down */
.basketShow {position: absolute;	width: 550px;background: var(--background); border: 1px solid var(--border-light);	z-index: 1100;	padding: 15px 25px 25px 25px;	visibility: hidden;	right: 10%;	top: 35px;border-bottom: 9px solid var(--border-light);	border-radius: 0;overflow: auto;max-height: 500px;}
.basketShow.activeBasket {	visibility: visible;	-webkit-transform: unset;	transform: unset;}
.click-to-expand {font-size: 12px;	font-weight: 600;line-height: 30px;}
.splitBasket {overflow:hidden;margin: 0 auto;}
.splitBasket div {padding: 0px;}
#leftBasket {float:left; margin-right:5px; width:calc(100% - 220px);height:235px;overflow-x: auto;}
#rightBasket {overflow:hidden;padding: 0 0px 0 0px;}
#rightBasket p {font-size: 16px;color:var(--text-dark); line-height: 22px;}
#viewBasket .col-md-5.fade-in {  padding: 0;  width: 38%;}
#viewBasket .col-md-6.fade-in {  width: 60%;  margin: 0 auto;  padding-right: 0;  padding-left: 35px;}
.EndTotalLines {background: var(--background-light);padding: 20px;}
#viewBasket {width: 65%; margin:0 auto;}
.Letters {  display: none;}
.Numbers {display: none;}
.Patch {display: none;}

#viewBasketModule a:hover {text-decoration: none!important;}
#viewBasketModule { }
#viewBasketModule p {color: var(--text-body);}
#viewBasketModule h2 {color: var(--text-color-light);border-bottom: 1px solid var(--border-light);font-size: 20px;}
#viewBasketModule h5 {font-weight: normal; color: var(--text-body)}
#viewBasketModule img {width:80px;}
#viewBasketModule input {width: auto;	font-size:13px; text-align:center;margin: 5px;}
#viewBasketModule .Updatebtn {background:var(--transparent);border:0}
#viewBasketModule .Updatebtn:before {/*! content: "update" */}
#viewBasketModule .Binbtn {display: none;}
#viewBasketModule .StyleProductstandard {color:var(--text-body);}
#viewBasketModule .StyleName {color:var(--text-body);}
#viewBasketModule .StyleDescription {width:250px; text-align:left;color:var(--text-body);}
#viewBasketModule .StylePrice {color:var(--text-body);}
#viewBasketModule .StyleUnitPrice {}
#viewBasketModule .StyleQuantity {font-style:inherit;color:var(--text-body);}
#viewBasketModule .StyleCost {display:none; line-height:1px; }
#viewBasketModule .viewBasketTotal {text-align:center; font-family: Primary;  font-size:18px; }
#viewBasketModule .basketReturn {line-height: 50px}
.plussbtn {  height: 35px !important;}
.minussbtn {  height: 35px !important;}
.updateButton {  background: transparent;  font-size: 10px;  width: 60px;  margin: 0;  padding: 2px;  height: 25px;}
#viewBasketModule button[name="continue_but"] {padding: 20px;}

/*-----------------  viewbasket page --------------------*/
/*---------------- the LB allow a line break between products when letter/numbers in the basket ----------*/

#ContinueShop { }
#quickAdd { } /* This shows/hides and quick add products on viewbasket page, nb must set cat code/dept/sub dept */
 #BasketCheckout {	text-align: center;}
#viewBasket p, #wishlist p {	clear: none;} 
#viewBasket .SmallProduct, #wishlist .SmallProduct { height:65px; width: 65px; visibility:visible;float:left;}
#viewBasket .LineBreak, #wishlist  .LineBreak {border-top: 1px dotted var(--input-border); vertical-align:middle; padding:5px;}
#viewBasket .PATCH_LB, #wishlist .PATCH_LB {border-top: 0px;}
#viewBasket .LETTERS_LB, #wishlist .LETTERS_LB { border-top: 0px; }
#viewBasket .NUMBERS_LB, #wishlist .NUMBERS_LB { border-top: 0px; }
#viewBasket .PATCH, #wishlist .PATCH {display:none;}
#viewBasket .LETTERS, #wishlist .LETTERS {display:none; }
#viewBasket .NUMBERS, #wishlist .NUMBERS {display:none; } 
#viewBasket .PERSONALISATIONITEM, #wishlist .PERSONALISATIONITEM {display:none; } 
#viewBasket input[name="new_quantity"] { width:75px; text-align: center;vertical-align: bottom;}

#wishlist h3 {  width: 25em;  font-size: 25px;}
#wishlist p { display: flex; }
#wishlist label {  width: 25em;}
#wishlist img {margin:2px}
#wishlist .LineBreak {float:left;}
#wishlist .radio-custom-label {width:19em;margin: 0;}
#wishlist select {margin-right: 10px;}
#wishlist hr  {width:100%; border-top: 1.5px solid var(--input-border)}
#wishlist h3 a {font-size: 20px;}
#wishlist input {  margin-top: 5px;}
#wishlist .StyleProductFloat { margin: 0.5em; }
#wishlist .StylePrice {padding-top: 9px;width: 75px;}
#wishlist .StyleQuantity {margin:15px 0 0 13px;width: 45px;}
#wishlist .StyleProductFloat.StyleProduct.StyleName {  width: 300px;}
#wishlist .addText {line-height:40px;margin-left: 5px;}
.wishSearchLLink { text-align: center;  font-size: 16px;  text-decoration: underline;  text-underline-offset: 5px;}
.wishSearchLLink:before {  content: "\f002";  font-family: FontAwesome;  font-size: 20px;}

/*--------------- Dept and Sub Dept pages --------*/
#deptPage {min-height:400px;text-align:center;}
#subDept {min-height:400px;text-align: center;}
#subDept h2 {  text-align: left;}
.deptLoop {width: 30%; display: inline-table; margin: 15px;}
.deptName a {font-size: 16px;font-weight: bold;}
.deptDesc {}
.deptImage {}
.deptSubLoop {margin-top: 35px;}

.subDeptLoop {width: 30%;display: inline-table;margin: 5px;padding:10px;border:1px solid var(--input-border)}	
.subDeptImage {}
.subDeptText a {font-size: 16px;font-weight: bold;text-align: center;padding: 5px;font-family: Primary;}
.subDeptDesc {}

/*---------------products--------------*/
/* these rows are for the column lists on the products page
- the number of rows 'A-Z' are set in the Back Office */

.productView {float:right; display:none;} /*this controls the optional views on products.tmpl */
.rowA {padding:5px; color:var(--text-body);}
.rowB{padding:5px; color:var(--text-body);}

.rowA a, .rowB a  {color:var(--link);	text-decoration: none;	}
.rowA a:hover, .rowB a:hover  {color:var(--link-dark-hover); text-decoration: none;}

.ProductCell {	margin: 7px;padding: 6px;	border: 1px solid var(--border-grey);width:310px;display: inline-block;}
.ProductCell img {margin-top:5px;}
.smallProductCell {margin: 5px;	box-shadow: 3px 0px 3px 0 var(--shadow);	border: 1px solid var(--border); width:110px; height:200px; }
.viewbasketCell {margin: 5px;	box-shadow: 3px 0px 3px 0 var(--shadow);	border: 1px solid var(--border); width:110px; height:200px; float:right;}
#productStitch { overflow: hidden; text-align:center; height:240px; width:180px;	}

#productListing {float:left; width:140px; text-align:center;}
#productListing .StylePrice {text-align:center;font-size:85%; margin-left:0px;}
.productListing {min-height: 320px; text-align: center;	}
.productListing img {}
.product-link {margin-bottom: 0px; text-align: center; font-size: 30px; border-bottom: solid 4px var(--border-white);}

#productTitle {	text-align: center;	padding-left: 5px;	padding-right: 5px;}
#productTitle a:link {color:var(--link-dark); text-decoration:none;}
#productTitle a:visited {color:var(--link-dark); text-decoration:none;}
#productTitle a:hover {text-decoration:none;}
#productTitle a:focus {text-decoration:none;}
.productTitle {font-size:18px;height:43px;text-align: left;text-transform: uppercase;}
.productTitle a:link {color:var(--link-black); }
.productTitle a:visited {color:var(--link-black);}
.productTitle a:hover {color:var(--link-hover);}
.productTitle a:focus {color:var(--link-hover);}

#productPrice {text-align: center; color: var(--text-body); border-bottom-left-radius:4px; border-bottom-right-radius:4px; display:block;}
.productPrice {font-size: 20px;width: 100%; /*! margin: 10px 0; */text-align:left;font-weight:bold;}
.salePrice {text-align: center; color:var(--error);font-size: 14px;}

.displayBanners {position: relative;top: -315px;left: 0px;height:1px;width:1px;}
.saleLogo {background: var(--error);top: 10px;z-index: 1;position: absolute;padding:5px 10px;height: 45px;border-radius: 100%;width: 45px;}
.saleLogo::after {content: "sale";text-transform: uppercase;color: var(--text-white);line-height:35px;}
.in_multibuys {    left: 145px;  width:70px;  padding: 5px;       position:absolute;    border: 1px solid var(--border-black);    line-height: 15px;font-size: 12px;text-align: center;}
.in_multibuys::after {content: ""; text-transform: uppercase;font-size: 11px;font-weight: bold;}
.personalisable  {background: var(--background-light);width: 85px;height: 25px;bottom: -210px;position: absolute;text-align: center;}
.personalisable::after {content: "add a name!"; text-transform: uppercase;color: var(--text-white);font-size: 10px;}
.preorder { background: var(--background-light); color: var(--text-white); position: relative; top: 95px; left: -85px; width: 150px; padding: 5px; }
.multiple_variants {position: absolute;background: var(--background-white);top: 0px;right: -20px;}
.link-product-add-cart {position:absolute;top:65px;}
.link-product-add-load {position:absolute;top:65px;}
#subDeptName {	text-transform: none;}

/* ------------------Pages--------------------- */
/* ------------------Split page--------------------- */

.splitPage {overflow:hidden;}
.splitPage div {padding: 0px;}
#leftPage {float:left; margin-right:10px; width:40%; border-right: 0px dotted var(--input-border);}

#rightPage {overflow:hidden; margin: 0px 0px 0px 0px;}
#rightPage td {font-size: 16px;}

/*---------------Order Confirm-----------*/
.splitConfirm {overflow:hidden;}
.splitConfirm div {padding: 0px;}
#leftConfirm {float:left; margin-right:10px; width:25%; border-right: 0px dotted var(--input-border);}
#rightConfirm {overflow:hidden; margin: 0px 0px 0px 0px;}

/*---------------Shipping-----------*/
.splitShip {overflow:hidden; width:100%;}
.splitShip div {padding: 0;}

#leftShip {float:left; margin: 0px 20px 0px 0px;width:50%;}
#rightShip {overflow:hidden; margin: 0px 0px 0px 00px; min-height:170px;}
#shipOptions p { clear: left;}
#memberships_frame { width: 90%; height: 375px; margin: 0 2.5%; padding: 0 2.5%; border: 1px solid grey; };


/*---------------Login---------------*/
.logIn {overflow:hidden;}
.logIn div {padding: 10px;}
#login_new,#login_exist {float:left; width:35%;border-right: 2px dotted var(--input-border);}
#login_guest {overflow:hidden;}
#login_linked_accounts {border-top: 2px dotted var(--input-border);clear:both;}

/*---------------Linked Accounts styles---------------*/
div.login_linked_account { width: 90%; min-height: 74px; margin-bottom: 10px; background:var(--background-white); }
div.login_linked_account h4 { margin: 0; float: left;  }
.linked_account_label { display: inline-block; width: 100%; padding: 5px 0 0; font-size: 20pt; }
a.linked_account_label:before { content: "Login with "; }
div.login_linked_account input { float: right; }

div.google_login       { background: var(--background-white) url("../google-logo.png") no-repeat scroll 10px center / 64px 64px; padding-left: 100px; }
div.google_login:hover { background: var(--background-white) url("../google-logo.png") no-repeat scroll 10px center / 64px 64px; }
div.google_login .linked_account_label { color: var(--text-white);  }

.accountBox {  float: right;  display: flex;top: 25px;position: relative;z-index: 99;/*! background: var(--background-black); */height: 70px;}
.accountBox .btn {color: var(--text-white) !important; cursor: pointer; border:0;}
.accountBox .btn:hover {color: var(--text-white) !important; font-size:15px;cursor: pointer;}
#logBtn {  color: var(--link-light);  font-size: 20px;}

/*-----------------  product filter --------------------*/
#product_browser {width: 20%;}
#product_browser p {display: inline-block;}

.item-thumb-product { position:relative; overflow:hidden;}
.item-thumb-product .product-thumb-front { opacity:1; visibility:visible}
.product-thumb-behind { transform:rotateY(180deg); opacity:0; visibility:hidden; position:absolute; top:0; left:0}
.item-thumb-product:hover .product-thumb-front { transform:rotateY(180deg); opacity:0; visibility:hidden}
.item-thumb-product:hover .product-thumb-behind { transform:rotateY(0deg); opacity:1; visibility:visible}
.item-thumb-product img { /*transition:all .5s ease-out 0s*/}
.item-thumb-product:hover { cursor:pointer}
.item-thumb-product:hover .info-product-cart { opacity:1; visibility:visible}
.item-thumb-product:hover .inner-info-product-cart ul { margin:20px 0 0}
.item-thumb-product:hover .inner-info-product-cart .link-product-add-cart { bottom:0}
.item-thumb-product::before { background:transparent; width:100%; height:100%; position:absolute; top:0; left:0; content:""; opacity:0; z-index:9; visibility:hidden; transition:all .5s ease-out 0s}
.item-thumb-product:hover::before { opacity:1; visibility:visible}



#product_browser label { margin: 0;}
.maxPrice { margin-top: 20px; display: inherit;width:105px;}
input[name="min_price"] {	min-width: 80px;	width: 80px;}
input[name="max_price"] {min-width: 80px;	width: 80px;}
#search_terms { display:none; }
#price_range {position: relative;	right: 0;	width: 520px;	top: 25px;}
#price_range label {   width: 85px;margin-right: 70px;margin-top: 20px;}
#out_of_stock { display: none; }
#categories {float: left;width: 100%;display: block;	clear: both;margin-top: 30px;}
#categories h3 {font-size: 13px;text-transform: uppercase;font-weight: normal;margin-bottom:10px;}
#categories input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;width:16px;height:16px;margin-top:5px;min-width:16px;}
#categories ul li {list-style:none;clear:both;}
#categories label {margin-top:0px;line-height:13px;font-size:11px;min-width: 150px;}
#categories .linerule {color: #E0E0E0;width: 50%;height: 1px;}
#categories .box-custom + .box-custom-label::before { margin: 5px 5px 10px 4px; }
#categories .box-custom-x:checked + .box-custom-label-x::before {	font-size: 12px;line-height: 12px;}
.selected-category {clear: both; padding: 6px 0 10px 0; height: 20px;  width: 95%;}
.searchPanel {border: 1px solid #e1e1e1; float: left;  width: 95%;	margin-top:20px;overflow-y:scroll; overflow-x:hidden; padding: 10px 5px;text-align: left;max-height: 250px;}
.category-count {font-size: 10px;/*! margin:0px 10px; */line-height: 33px;float: right;}

#products {float: right;text-align: center;width: 100%;}
.productsWidth {width:80% !important;text-align: center;margin-top: 40px;}
#products_per_page_div {clear: both;}
#products_per_page_div label {	width: 12em;	}
.pagination {display: inline;}
#pagination-container p {line-height:40px;}
#go_to_1 {cursor: pointer;  margin: 5px;vertical-align:baseline;}
#prev {cursor: pointer;  margin: 5px;vertical-align:baseline;}
#next {cursor: pointer;  margin: 5px;vertical-align:baseline;}
#last {cursor: pointer;  margin: 5px;vertical-align:baseline;}
#product-container {}
#navigation {display:inline-block;width: 100%;}
#navigation p {margin: 0;}
#product_count { width:25em;float:left;}
.productCount {  line-height: 45px;}
#sort_by_div {display:none;	width: 500px;float: right;}
#hideFilter {margin: 0px; cursor:pointer;}
#navigation label {width: 12em; margin: 10px 0;}
#products_per_page_div select {  width: 80px;  min-width: 80px;  float: left;}
#pages {  width: 80px;}

/*--------------Item_Standard-----------*/

.ItemProduct {overflow:visible; width:100%;}
.ItemProduct div {padding: 0;}
#imgProduct {margin: 0;	width: 55%;	text-align: center;float: left; overflow:hidden;}
#imgProduct h2 {text-align: left;width:92%;}
#textProduct {overflow:hidden;margin: 0px 0px 0px 00px;min-height:170px;padding:0 0 0 10px;}
#textProduct li li {list-style: initial;display: list-item;margin-left: 1em;}
#mainImage {margin:10px;}
.ItemHeader {font-size:16px; margin: 10px 0px;}
#MediafFles {margin: 10px;}
.variant1 {font-size: 16px;	float: left;	clear: both;}
.variant2 {font-size: 16px;	float: left;	clear: both;}
.ItemOption {font-size: 30px; margin:10px 0;}
#variant_colour { margin-top: 20px;}
#variants label {	margin-top: 0;}
.price {} 
#imgProduct img {max-width:none;}
.ShirtBack {position:relative; text-align:center; width:285px; height:350px;}
#PlayerImg {position:relative; top:110px; left:-100px; width:90px; height:90px; background-size:contain; background-repeat:no-repeat; }
#Total {position:relative;  }
.TotalCostHead {font-size:20px; font-weight:normal; }
#TotalCost {font-size:20px; position:relative; width:90px; font-weight:normal;}
#mediaPage {top: 130px;position: absolute;width: 75%;left: 15%;height: auto;background:transparent;padding: 0;z-index: 9002;text-align:center;}
.playButton {background:transparent;border: 0;font-size: 30px;font-weight: bold;color:var(--text-white);margin: 0px 15px 0px 0px;float:right;position: relative;top: 50px;}
#mediaClip {    border: 1px solid var(--border);}

/*--------------Item_Standard Gift Card-----------*/

#electronic_card { min-height: 75px;}
#presentation_selection {min-height: 75px;}
#existing_gift_cards label { width: auto;    display: inline-flex;}
#existing_gift_cards span {margin: 0 5px; font-weight: normal;}
#existing_gift_cards p {    clear: both;}
#existing_gift_cards input[type="button"] { float: right;}
#existing_gift_cards .radio-custom-label {    width: 275px;}
#link_new_card  {clear:both;}


/*------------- address and addresslist-----------*/
#address_results { max-height: 90px; overflow-y: scroll;  width: 45%;}
#address_results li { padding: 4px;margin: 2px;  cursor: pointer; border: 1px solid var(--border);list-style:none;}
#lookupFeedback {float: left; margin: 5px 0 0 20px; font-size: 12px;}
ul:empty {display: none;}

.addressList {text-align:center;}

/*------------- confirm order, accept order --*/
.TotalOrder {border: 1px solid var(--border);}
.TotalCell {border-bottom: 1px dotted var(--border); }

.orderRecipients {}
.orderCustomer {}
.address {text-transform:capitalize; line-height:22px; padding:5px;}
.postcode {text-transform:uppercase;}
.email {text-transform:none;}
.colHeader {font-size:16px; /*! font-weight:bold; */}

/* Payments*/
#PayPage h3 {	cursor: pointer;	clear:both;}
#PayPage p {clear: both;line-height:20px;}
#PayPage label {padding-top: 0; font-weight:normal;margin:0;}
#PayPage input {	margin: 5px;}
#PayPage select { margin: 5px}
#payCard  {}
#PayDraft {}
#PayPayPal {}
#PayRewards4{}
#PayOnCollect {}
#PayZGiftCard {}
#PayLaybuy {}
#PayByOpenPay {}
[aria-controls='PayZGiftCard']:before  {  content: "\f06b";  font-family: Fontawesome;  padding:20px ;line-height: 25px;}
[aria-controls='payCard']:before {  content: "\f09d";  font-family: Fontawesome;  padding:20px ;line-height: 25px;}
[aria-controls='PayPayPal']:before {  content: "\f1f4";  font-family: Fontawesome;  padding:20px ;line-height: 25px;}
[aria-controls='PayRewards4']:before {content: "\f787"; font-family: Fontawesome;  padding:20px ;line-height: 25px;}
[aria-controls='PayByOpenPay']:before {  content: "";   display: inline-block;    width: 40px;    height: 20px;    background: url("../openpay-orange.png") no-repeat 0 0;    background-size: cover;    margin: 0 10px;}
[aria-controls='PayLaybuy']:before {  content: "";   display: inline-block;    width: 40px;    height: 20px;    background: url("../laybuy.png") no-repeat 0 0;    background-size: cover;    margin: 0 10px;}
[aria-controls='PayDraft']:before  {  content: "\f19c";  font-family: Fontawesome;  padding:20px ;line-height: 25px;}
.payFees {display:none;}
.zgiftBalance {float: right;	margin: .45rem 2rem;}
#imageLink {height: 35px;	margin-top: 5px;}
.amountTopay {font-size: 16px;	margin: 20px 0;}
.payTotal {font-size: 16px;margin: 20px 0;}
.giftBalance {margin: 4px 50px;}
#stored_cards {	padding: 5px 10px;	margin: 10px 0;}
.existingCards {padding: 5px 10px;	margin: 10px 0;}
#standard_CardGlobalIris_3ds_message {color: var(--error);	font-weight: bold;}
#formIncomplete {	margin: 10px auto;	color: var(--error);}
.displayAddress {cursor: pointer;}
.charityDonationLoading {color: var(--notice);	font-weight: bold;}

label[for="male"] {  float: none;width:150px  }
label[for="female"] {  float: none;}
label[for="radio-1"] {  float: none;width:150px  }
label[for="radio-2"] {  float: none;}

.dateOfBirth p {display: inline-flex;}
input[name="dob_day"] { width:80px;}
input[name="dob_mth"] { width:80px;}
input[name="dob_yr"] { width:80px;}
input[name="standard_Card_card_phone_country_code"] { width:80px;}
input[name="standard_Card_card_phone_subscriber_number"] { width:175px;}
input[name="mobile_phone_country_code"] { width:80px;}
input[name="mobile_country_code"] { width:80px;}
input[name="mobile_phone_subscriber_number"] { width:175px;}
input[name="mobile_subscriber_number"] { width:175px;}
input[name="home_country_code"] { width:80px;}
input[name="home_subscriber_number"] { width:175px;}
input[name="work_country_code"] { width:80px;}
input[name="work_subscriber_number"] { width:175px;}

/*------------- radio buttons and checkboxes --*/
.radio-custom {opacity: 0; position: absolute;}
.radio-custom, .radio-custom-label {display: inline-block; vertical-align: middle; margin: 5px; cursor: pointer;font-size:14px;width:auto;min-width:200px;}
.radio-custom-label {position: relative;}
.radio-custom + .radio-custom-label:before {content: '';background: var(--background-white); border: 1px solid var(--background-black);	display: inline-block;vertical-align: middle;width: 35px;height: 35px;margin-right: 10px;}
.radio-custom + .radio-custom-label:before {border-radius: 50%; margin-bottom:10px;}
.radio-custom:checked + .radio-custom-label:before {background:var(--background-light);box-shadow: inset 0px 0px 0px 8px var(--border-white);}	

.radio-custom-ship {opacity: 0; position: absolute;}
.radio-custom-ship, .radio-custom-ship-label {display: inline-block; vertical-align: middle; margin: 5px; cursor: pointer;font-size:14px;width:15em;}
.radio-custom-label-ship {position: relative;}
.radio-custom-ship + .radio-custom-ship-label::before {	content: '';	background: var(--background-white);	border: 2px solid var(--border);	display: inline-block;	vertical-align: middle;	width: 30px;	height: 30px;	margin-right: 10px;	text-align: center;}
.radio-custom-ship:checked + .radio-custom-ship-label::before {	content: "\f00c";	font-family: "FontAwesome";	color: var(--text-white);	font-size: 20px;	line-height: 25px;}

.box-custom {opacity: 0; position: absolute;max-width:50px;}
.box-custom, .box-custom-label {display: inline-block; vertical-align: middle; cursor: pointer;}
.box-custom-label {position: relative;width:auto; min-width:130px;}
.box-custom + .box-custom-label:before {content: '';background: var(--background-white;); border: 2px solid var(--border-dark); display: inline-block;vertical-align: middle;width: 35px;height: 35px;padding: 0px; margin:0px 10px 15px 40px;text-align: center;}
.box-custom:checked + .box-custom-label:before {background: var(--background-light); color: var(--text-white); content:"✓";font-size: 20px;font-weight: bold;line-height: 30px;}

.box-custom-x {opacity: 0; position: absolute;max-width:30px;}
.box-custom-x, .box-custom-label-x {display: inline-block; vertical-align: middle; cursor: pointer;}
.box-custom-label-x {position: relative;width:99%;}
.box-custom-x + .box-custom-label-x:before {content: '';background: var(--background-white); border: 2px solid var(--background); display: inline-block;vertical-align: middle;width: 25px;height: 25px;padding: 3px; margin:0px 10px 0px 10px;text-align: center;}

.downArrow::after {content: "\f107"; display: inline-block;vertical-align: middle;font-family: "FontAwesome";float: right;margin-left: 15px;}
.upArrow::after {content: "\f107"; display: inline-block;vertical-align: middle;font-family: "FontAwesome";float: right;margin-left: 15px;}

.limitOptions {  display: none;}

/* modal shoppping cart */
#cartModalBox {  animation: createBox 1.9s;}
#cartModalBoxWish {  animation: createBox 1.9s;  width: 600px; height: 300px;}
@keyframes createBox {
  from {    transform: scale(0);  }
  to {    transform: scale(1);  }}}
.modalDescHolder div{padding: 5px;}
#cartModalWish {position: fixed;display: none;width: 100%;height: 100%;top: 0;left: 0;right: 0;bottom: 0;background: var(--background-white);z-index: 9999;}
#cartModalBoxWish {width: 600px;z-index: 9999;border: 1px solid var(--border);background: var(--background-white);position: relative;top: 100px;margin-right: auto;margin-left: auto;overflow-y: auto;-webkit-backface-visibility: hidden;backface-visibility: hidden;}
#cartModalBoxWish h3{text-align: center;font-size:36px;}
#cartModalBoxWish h3:after {content: "\f00c";font-family: 'FontAwesome';color: var(--text-color);margin-left: 1em;}
#cartModalBoxWish>div {padding: 35px;}
#cartModalBoxWish .close {display:none}
#modalImgHolderWish {text-align:center}	
.continueShoppingWish {text-align: center;background: var(--background-light);padding: 15px;margin: 1rem 1rem 0 0;cursor: pointer;border: solid 1px var(--border);color: var(--text-body);}
.continueShoppingWish:after {font-family: 'FontAwesome';content: "\f054";margin-left: 10px;}
#cartModal {position: fixed;display: none;width: 100%;height: 100%;top: 0;left: 0;right: 0;bottom: 0;background: var(--overlay);z-index: 9999;}
#cartModalBox {width: 750px;z-index: 9999;border: 1px solid var(--input-border);background: var(--background-white);position: relative;top: 100px;margin-right: auto;margin-left: auto;/*! overflow-y: auto; *//*! -webkit-backface-visibility: hidden; *//*! backface-visibility: hidden; */}
#cartModalBox h3{text-align: center;font-size:36px;}
#cartModalBox h3:after {content: "\f00c";font-family: 'FontAwesome';color: var(--text-color);margin-left: 1em;}
#cartModalBox>div {padding: 35px;}
#cartModalBox .close {display:none}
#modalImgHolder {text-align:center}	
.moduleEdit a { border: 1px solid var(--input-border);  padding: 3px 5px;  color: var(--text-body);}
.continueShopping {text-align: center;background: var(--background-white);padding: 15px;margin: 1rem 1rem 0 0;cursor: pointer;border: solid 1px var(--border-black);color: var(--text-body);}
.continueShopping:before {font-family: 'FontAwesome';content: "\f053";margin-right: 10px;}
.goToBasket {margin: 1rem 0 0 1rem;background: var(--button-active); text-align: center;}

.goToBasket a {color: var(--text-white);font-size: 15px;padding:15px;display:block;text-decoration:none;}
.goToBasket a:hover {color: var(--text-white);background:var(--background-black);}
.goToBasket a:after {font-family: 'FontAwesome';content: "\f054";margin-left: 10px;}	
.modalProdDetails {display:flex;align-items: center;justify-content: center;}
.justAdded {display:none}
.justAdded>div:first-of-type {padding: 6px;margin: 0px;color: var(--text-body);}
.moduleEdit {  margin: 10px 0;}
.emptyBasketHolder {margin-top:3em}
.addBasketPrice {display:none}

/*---- change variants to boxes instead of drop down ----*/
#list_of_items { text-align: center;margin: 0px auto 35px auto;min-height: 80px;}
#variant_size ul {    display:inline-block;    margin-right: 5px;	padding: 0; margin-bottom:3px;}
#variant_size ul li {  height: 80px;    position: relative;    width: 80px; }
#variant_size ul li input[type="radio"] { position: absolute;    visibility: hidden;	width:80px;}
#variant_size ul li label {	cursor: pointer;	position: absolute;	transition: all 0.5s ease-in-out 0s;	z-index: 9;	top: 0;	left: 0;	font-size: 12px;	text-align: center;padding: 15px 0px;	height: 80px;	width: 80px !important;	line-height: 16px; border: 1px solid var(--border-black);}
#variant_size ul li:hover label {	background: var(--background-light);}
#variant_size ul li .check {display: block; height: 80px; position: absolute; transition: all 0.5s ease-in-out 0s; width: 80px; z-index: 5;margin:0;background: var(--background-white);top: 20px;}
#variant_size ul li:hover .check {    background:var(--background);}
#variant_size ul li .check::before {    content: "";    display: block;            margin: auto;    position: absolute;  transition: background 0.5s linear 0s;    }
#variant_size input[type="radio"]:checked ~ .check {    background:var(--background-light);}
#variant_size input[type="radio"]:checked ~ .check::before {}
#variant_size input[type="radio"]:checked ~ label { color: var(--text-white);}
.outofstck div {background: var(--background-dark); color: var(--text-dark) !important;}
.outofstck label {font-size: 10px !important;line-height: 13px !important;background: var(--border-grey); !important; }
.outofstck label:after {content: "\A Sold out";white-space: pre; line-height:18px}
.outofstck label:hover {color: var(--button-hover) !important; cursor: default !important;}
.outofstck div {background: var(--background-white) !important; color:var(--text-body) !important;}

div#variant_size input[type="radio"]:checked ~ label::after, div#variant_size input[type="radio"]:checked:hover ~ label::after {content: "\f058";	font-family: 'FontAwesome';	top: 50px;	right: 8px;	padding-left: 5px;	position: absolute;	font-size: 16px;}
#addQuantity {text-align: center; }
.addIncrease input {text-align: center;width: 60px;}