:root {
--prettygrey:rgba(228,228,228,1);
--purple: rgba(113,29,120,1);
--green:rgba(50,136,3,1);
--brightpurple:rgba(204,102,199,1);
--brightgreen:rgba(182,189,22,1);
--purpleover: rgba(201,91,217,1);
--greenover:rgba(147,251,73,1);
--blogsover: #FF5A5A;
--blogs: #FFB7B2;
--clubsover: #FFC83C;
--clubs:#FFE3AA;
--lockerover: #1982C8;
--locker: #81C7EF;
--vslow: all 0.9s linear;
--slow: all 0.6s linear;
--fast: all 0.3s linear;
--darkgrey: rgba(52,52,52,1);
--midgrey: rgba(80,80,80,1);
--altgrey: rgba(150,150,150,1);
--normal:'Raleway', sans-serif;
--ba: 'Urbanist', sans-serif;
}
*,*::before,*::after {box-sizing: border-box;}
/* reset */
html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,abbr, address, cite, code,del, dfn, em, img, ins, kbd, q, samp,small, strong, sub, sup, var,b, i,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,caption,article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary,time, mark, audio, video {margin:0;padding:0;border:0;outline:0;vertical-align:baseline;background:transparent;position:relative;}
/*reset done*/
body {padding-top:7em;min-height: calc(100vh - 5.5em);max-width:100%;width:100vw;overflow-X: hidden;font-family: var(--normal);background-color:white;color:var(--darkgrey);font-size:1em;}
input:focus, button:focus {outline-style: solid;outline-color:var(--brightpurple);outline-offset:-1px;outline-width:2px;border-width:0px;}
header {position: fixed;width: 100%;top: 0;font-weight:600;z-index:200;}
header h2 {font-family:var(--ba);font-weight:800;text-transform:lowercase;font-size:1.2em;padding:0.2em 0}
header .sm {background-color: var(--midgrey);color: white;text-align: center;padding: 0.3em;width: 100%;}
header .header {background-color: var(--darkgrey);display: grid;grid-template-columns:2fr 2fr 1fr; align-items: center;padding: 0 1em;}
header .header nav {grid-row: 2;grid-column: 1 / span 3;text-align: center;}
header .header .collapsed {display: block;color: white;position: absolute;right: 15px;font-size: 2em;cursor: pointer;}
header .header .navi {width: calc(100vw - 300px);display: flex;justify-content: space-between;align-items: center;transform: scaleX(0);transform-origin: right center;transition: transform 1s ease-in-out; position:absolute; right:-100vw;}
header .header .navi .ni {display:flex;}
header .header .navi.open {margin-right: 0; display: block; width: 290px; background-color: var(--midgrey); position: absolute; right: 0px; top: 60px; padding: 1em; transform:scaleX(100%); right:0;}
header .header .navi.open ul li {display: block;font-weight: 700;text-align-last: left;}
header .header .navi.open .ni {display: block;text-align: right;}
header a {text-decoration: none;color: white;transition:var(--fast);}
header a:hover {color:var(--brightpurple);}
header h2 a {display: flex;align-items: center;}
header img {max-height: 3em;height:100%;aspect-ratio:1/1;background-color: transparent;}
header ul {list-style: none;}
header ul li {display: inline-block;font-weight: 700;}
header ul li a {padding: 0.5em 0.25em;margin: 0em 0.25em;display: inline-block;padding-bottom: 0;}
header ul li a::after {font: var(--fa-font-regular);content: "\f111";display: block;text-align: center;font-size: 6px;color: transparent;transition:var(--fast);padding-top:2px;}
header ul li a:hover::after {color: var(--brightpurple);}
header .searchbar {display: grid;grid-template-columns: 1fr 3em;grid-gap: 0;font-size: 0.9em;height: 2em;margin-right: 30px;margin-top: 1em;margin-bottom: 1em;}
header button {cursor:pointer;}
header input {border-radius: 0;border: none;font-family: inherit;font-size: inherit;padding: 0.3em 1em;color:var(--purple);}
header .sp {border-radius: 0;border: none;background-color: var(--brightpurple);color: white;transition:var(--fast);}
header .sp:hover {background-color: var(--purple);color: white;}
header .shopcart {border-radius: 0;border: none;color: white;font-size: 2em;background-color: transparent;transition:var(--fast);margin: 0px 0px 0px 4px;position:relative;width:3em;}
header .shopcart:hover {color:var(--brightpurple);}
header ul li a.active::after {font: var(--fa-font-solid);color: white;transition:var(--fast);display: block;text-align: center;font-size: 6px;padding-top:2px;}
header ul li a.active:hover::after {color: var(--brightpurple);}
header .shopcart .cartbadge.hasval {position: absolute;z-index: 250;background-color: var(--brightpurple);color: white;padding: 4px 8px;border-radius: 25%;margin: 0;font-size: 14px;right: 3px;top: 3px; transition:var(--fast);}
header .shopcart:hover .cartbadge.hasval {background-color: white; color: var(--brightpurple);}
footer {background-color: var(--midgrey);color: white;display: grid;grid-template-columns: 1fr;grid-gap: 1em;padding: 1em;font-size: 1em;line-height: 1.3;}
footer img.footerleft {width: 235px;height: auto;}
footer .footermidright {width: 235px;}
footer .footermidright nav {display: flex; flex-wrap: wrap; justify-content: flex-start;}
footer .footermidright a {width: 70px;margin-right:4px; margin-bottom:4px;}
footer .footermidright nav img {border:3px solid;border-bottom-right-radius:20%;transition:var(--fast);width:100%;}
footer .footerright {height: 100%;display: flex;justify-content: space-between;align-items: flex-end;flex-direction: column;}
footer .footermidleft {text-align:left;}
footer .footermidleft .fmdli {display: inline-block; text-align:left;}
footer h2 {font-family: var(--ba);font-weight: 800;text-transform: lowercase;font-size: 1.3em;}
footer a {color: white;text-decoration:none;transition:var(--fast);}
footer a:hover {color:var(--brightpurple);}
footer .footerright .socials a {font-size: 2em;margin-left: 0.3em;}
footer .footermidright nav img.home {border-color:var(--greenover);background-color:transparent;}
footer .footermidright nav img.home:hover {border-color:var(--green);}
footer .footermidright nav img.shop {border-color:var(--purpleover);background-color:transparent;}
footer .footermidright nav img.shop:hover {border-color:var(--purple);}
footer .footermidright nav img.blogs {border-color:var(--blogs);background-color:transparent;}
footer .footermidright nav img.blogs:hover {border-color:var(--blogsover);}
footer .footermidright nav img.clubs {border-color:var(--clubs);background-color:transparent;}
footer .footermidright nav img.clubs:hover {border-color:var(--clubsover);}
footer .footermidright nav img.locker {border-color:var(--locker);background-color:transparent;}
footer .footermidright nav img.locker:hover {border-color:var(--lockerover);}
footer .footerright img {width: 235px;}
section {min-height: calc(100vh - 16.8em);}
section.home img.banner {width: 100%;height: auto;border-bottom:solid 0.65vw var(--brightpurple);}
section.home .catlinks {display: flex;justify-content: center;text-align: center;flex-wrap: wrap;}
section.home .catlinks a {font-size: 0.9em;aspect-ratio: 1 / 1;display: flex;justify-content: center;align-items: flex-end;text-transform: lowercase;color: white;text-decoration: none;border: solid 0.65vw var(--brightpurple);transition: var(--fast);position: relative;width: 240px;margin: 4px 2px;}
section.home .catlinks a h2 {z-index:3;background-color: var(--darkgrey);display: inline-block;padding: 0.2em 0.5em;font-weight: 600;font-size: 1.4em;margin-bottom:0.5em;}
section.home .catlinks a::after {content: "";left: 0;right: 0;z-index:2;position:absolute;display: inline-block; background-size:contain;width:100%;height:100%;transition:var(--fast);}
section.home .catlinks a.mens::after {background-image:url("/assets/mens.jpg");}
section.home .catlinks a.ladies::after {background-image:url("/assets/ladies.jpg")}
section.home .catlinks a.juniors::after {background-image:url("/assets/juniors.jpg")}
section.home .catlinks a.rackets::after {background-image:url("/assets/rackets.jpg")}
section.home .catlinks a.accessories::after {background-image:url("/assets/accessories.jpg")}
section.home .catlinks a:hover::after {filter: grayscale(1);}
section.home .catlinks a:hover {border-color: var(--purple);}
section.home .catlinks a:hover h2 {background-color:var(--purple);}
section.home .otherlinks {display: flex;padding: 0.5em;justify-content: center;flex-wrap: wrap;}
section.home .otherlinks a {font-size: 0.9em;aspect-ratio: 1 / 0.7;display: flex;justify-content: center;align-items: flex-end;text-transform: lowercase;color: white;text-decoration: none;border: solid 0.65vw var(--brightpurple);transition: var(--fast);position: relative;width: 190px;margin: 4px;}
section.home .otherlinks a h2 {z-index:3;background-color: var(--darkgrey);display: inline-block;padding: 0.2em 0.5em;font-weight: 600;font-size: 1.4em;margin-bottom:0.5em;}
section.home .otherlinks a::after {content: "";z-index:2;position:absolute;display: inline-block; background-position:center center;background-repeat:no-repeat;background-size:auto 100%;width:100%;height:100%;transition:var(--fast);}
section.home .otherlinks a.locker {border-color:var(--locker);}
section.home .otherlinks a:hover.locker {border-color:var(--lockerover);}
section.home .otherlinks a:hover.locker h2 {background-color:var(--lockerover);}
section.home .otherlinks a.locker::after {background-image:url("/assets/locker.jpg");}
section.home .otherlinks a.blogs {border-color:var(--blogs);}
section.home .otherlinks a:hover.blogs {border-color:var(--blogsover);}
section.home .otherlinks a:hover.blogs h2 {background-color:var(--blogsover);}
section.home .otherlinks a.blogs::after {background-image:url("/assets/blogs.jpg");}
section.home .otherlinks a.clubs {border-color:var(--clubs);}
section.home .otherlinks a:hover.clubs {border-color:var(--clubsover);}
section.home .otherlinks a:hover.clubs h2 {background-color:var(--clubsover);}
section.home .otherlinks a.clubs::after {background-image:url("/assets/clubs.jpg");}
section.home .content {padding:2em 2em;text-align:justify;line-height:1.4;}
section.home .content h1, section.clubs h1 {font-family: var(--ba);text-transform: lowercase;color: var(--green);font-size: 2em;font-weight: 900;}
section.home .content h3 {margin: 0.7em 0em;}
section.home .toppicks {display: grid;grid-template-columns: repeat(6,1fr);grid-gap: 0.5em; margin-bottom:2em;padding:2em 2em;max-width: calc(100vw - 2em);overflow-x: scroll;}
section.home .toppicks h2.tp {grid-column: 1 / span 6;padding-bottom: 1em;font-family: var(--ba);text-transform: lowercase;font-size: 1.8em;font-weight: 900;}
section.home .toppicks .product {display: flex;flex-direction: column;justify-content: space-between;}
section.home .toppicks .product img {width: 100%;height: auto;margin-bottom: 3em;}
section.home .toppicks .product .reason {position: absolute;top: 0.25em;text-align: center;background-color: var(--purple);color: white;padding: 0.5em 1em 0.5em 0.5em;border-bottom-right-radius: 1em;border-top-right-radius: 1em;}
section.home .toppicks .product .productmain {padding: 0.5em;text-align: center;border-bottom-left-radius: 2em;background-image: linear-gradient(white,#E3E3E3);border-bottom-right-radius: 2em;}
section.home .toppicks .product .productmain h4 {text-transform: capitalize;color: var(--green);font-size: 1.2em;font-family: var(--ba);font-weight: 900;}
section.home .toppicks .product .productmain .pricing {font-weight: 600;}
section.home .toppicks .product .productmain .pricing span {padding: 0 0.5em;display: inline-block;margin: 0 0.5em;}
section.home .toppicks .product .productmain .pricing span.sell {color: var(--purple);}
section.home .toppicks .product .productmain .pricing span.rrp {text-decoration:line-through;}
section.home .toppicks .product .productmain .productoptions {background-color: transparent;text-align: center;padding-top: 0.5em;padding-bottom: 0em;}
section.home .toppicks .product .productmain .productoptions .options {display: inline-block;padding: 0.2em 0.5em;border: solid 1px var(--midgrey);margin: 0.2em;background-color: transparent;transition: var(--fast);cursor: pointer;}
section.home .toppicks .product .productmain .productoptions .options:hover {background-color:var(--midgrey); color:white;border-color:white;}
section.home .toppicks .product .quickview {position: absolute;z-index:-1;opacity:0;top:bottom: 0;left: 50%;display: inline-block;background-color: purple;padding: 0.5em;color: white;margin-left: -3em;border: solid 1px white;cursor: pointer;transition:var(--fast);}
section.home .toppicks .product .quickview.show {z-index:50; opacity:1;bottom: 0;left: 50%;cursor: pointer;}
.product .quickviewcl {position: absolute;z-index:-1;opacity:0;top:bottom: 0;left: 50%;display: inline-block;background-color: purple;padding: 0.5em;color: white;margin-left: -3em;border: solid 1px white;cursor: pointer;transition:var(--fast);}
.product .quickviewcl.show {z-index:50; opacity:1;bottom: 0;left: 50%;cursor: pointer;}
section.shop .products {display: grid;grid-template-columns: repeat(2,1fr);grid-gap: 0.5em; margin-bottom:2em;padding:2em 2em;}
section.shop .products.club {display: grid;grid-template-columns: repeat(1,1fr);grid-gap: 0.5em; margin-bottom:2em;padding:2em 2em;}
section.shop .products.club .ptitle {grid-column: 1 / span 1;}
section.shop .products h2.tp {grid-column: 1 / span 2;padding-bottom: 1em;font-family: var(--ba);text-transform: lowercase;font-size: 1.8em;font-weight: 900;}
section.shop .products .matchcount {grid-column: 1 / span 2;margin-bottom: 1em;}
section.shop .products h2 {grid-column: 1 / span 2;margin-top: -1em;margin-bottom: 1em;}
section.shop .products .matchcount {grid-column: 1 / span 2;margin-bottom: 1em;}
section.shop .products .product {transform: scaleX(0); transform-origin:left;max-width: 0;overflow: hidden;position:absolute; visibility:hidden;opacity:0;}
section.shop .products .product.show {flex-direction: column; transform: scaleX(1);max-width: 100vw;display: flex; opacity:1; position:relative; visibility:visible;transition: var(--fast);}
section.shop .products .product img {width: 100%;height: auto;margin-bottom: 3em;}
section.shop .products .product .reason {position: absolute;top: 0.25em;text-align: center;background-color: var(--purple);color: white;padding: 0.5em 1em 0.5em 0.5em;border-bottom-right-radius: 1em;border-top-right-radius: 1em;}
section.shop .products .product .productmain {padding: 0.5em;text-align: center;border-bottom-left-radius: 2em;background-image: linear-gradient(white,#E3E3E3);border-bottom-right-radius: 2em;}
section.shop .products .product .productmain h4 {text-transform: capitalize;color: var(--green);font-size: 1.2em;font-family: var(--ba);font-weight: 900;height:3em;}
section.shop .products .product .productmain .pricing {font-weight: 600;}
section.shop .products .product .productmain .pricing span {padding: 0 0.5em;display: inline-block;margin: 0 0.5em;}
section.shop .products .product .productmain .pricing span.sell {color: var(--purple);}
section.shop .products .product .productmain .pricing span.rrp {text-decoration:line-through;}
section.shop .products .pro duct .productmain .productoptions {background-color: transparent;text-align: center;padding-top: 0.5em;padding-bottom: 0em;}
section.shop .products .product .productmain .productoptions .options {display: inline-block;padding: 0.2em 0.5em;border: solid 1px var(--midgrey);margin: 0.2em;background-color: transparent;transition: var(--fast);cursor: pointer;}
section.shop .products .product .productmain .productoptions .options:hover {background-color:var(--midgrey); color:white;border-color:white;}
section.shop .products .product .quickview {position: absolute;z-index:-1;opacity:0;bottom: 0;left: 50%;display: inline-block;background-color: purple;padding: 0.5em;color: white;margin-left: -3em;border: solid 1px white;cursor: pointer;transition:var(--fast);}
section.shop .products .product .quickview.show {z-index:50; opacity:1;bottom: 0;left: 50%;cursor: pointer;}
section.shop .products .product.show a {display: block;width: 100%;aspect-ratio: 1;background-repeat: no-repeat;background-size: contain;margin-top: 1.2em;background-position: bottom;}
section.shop .products .product .productmain .pricing.hs {display: flex;justify-content:space-between;}
.loading {position: absolute;display: flex;justify-content: center;align-items: center;flex-direction: column;z-index: -1;opacity: 0;top:0;bottom: 0;width: 100%;color: var(--midgrey);transition: var(--fast);background-color: white;max-height: 0;font-size: 1.4em;line-height: 2;text-transform: lowercase; overflow:hidden;}
.loading.showloading {z-index: 2000; opacity:0.9;overflow: visible;width: 100vw;height: 100vh;max-height:100vh;}
section.shop .filterselected {background-color: var(--midgrey);padding: 0.5em 2em;}
section.shop .filterselected .fs {padding: 0.2em 0.5em;border: solid 1px white;color: white;margin-right: 0.5em;cursor: pointer;background: transparent;transition: var(--fast);}
section.shop .filterselected .fs:hover {background:var(--darkgrey);}
.quickviewholder {position: fixed;bottom: 0;left: 1em;right: 1em;height: 80vh;background-color: white;transform:scaleY(0);transform-origin: bottom left;transition:var(--fast);overflow:hidden;}
.quickviewholder.show {padding: 1em;z-index:20000;border: solid 1px var(--green); border-top-right-radius:1.5em; transform:scaleY(1);}
.quickviewholder.show .qvinner {display: grid;grid-template-columns: 2fr 1fr;grid-gap: 0;position: relative;}
.photos {display: grid;grid-template-columns: 1fr 110px;}
.quickviewholder.show .photos, .quickviewholder.show .left {text-align:center;}
.quickviewholder.show .photos img {max-width: 100%;max-height: calc(80vh - 2em); margin:auto;}
.quickviewholder.show .thumbnail {width: 90px;height: 90px;display: inline-block;background-size: cover;margin: 10px;border: solid 1px; cursor:pointer;}
.quickviewholder.show .options, .shop .products.item .options {display: inline-block;padding: 0.2em 0.5em;border: solid 1px var(--midgrey);margin: 0.2em 0.5em;background-color: transparent;transition: var(--fast);cursor: pointer;font-size: 1.2em;}
.quickviewholder.show .options:hover,.shop .products.item .options:hover {background-color:var(--midgrey); color:white;border-color:white;}
.quickviewholder.show .optionscl {display: inline-block;padding: 0.2em 0.5em;border: solid 1px var(--midgrey);margin: 0.2em;background-color: transparent;transition: var(--fast);cursor: pointer;}
.quickviewholder.show .optionscl:hover {background-color:var(--midgrey); color:white;border-color:white;}
.quickviewholder.show h2 {padding: 1em;background-color: var(--green);color: white;margin-bottom: 1em;}
.quickviewclose {position: absolute;right: 4px;top: 3px;color: var(--darkgrey);background-color: rgba(255,255,255,0.7);border-radius: 50%;font-size: 2.5em;z-index: 200;cursor: pointer; transition:var(--fast);}
.quickviewclose:hover {color: var(--purple);background-color: rgba(255,255,255,100);}
.quickviewholder.show .pricing,.shop .products.item .pricing {font-weight: 600;padding:1em;margin-top:2em;margin-bottom:2em;}
.quickviewholder.show .pricing span, .shop .products.item .pricing span {padding: 0 0.5em;display: inline-block;margin: 0 0.5em;}
.quickviewholder.show .pricing span.sell,.shop .products.item span.sell {color: var(--purple);}
.quickviewholder.show .pricing span.rrp ,.shop .products.item span.rrp{text-decoration:line-through;}
.quickviewholder.show h3,.shop .products.item h3 {padding:1em;margin-top:2em;margin-bottom:2em;background-color:var(--darkgrey);color:white;}
.quickviewholder.show .freeship,.shop .products.item h3 {font-weight: 600;}
.quickviewholder.show .tn {max-height: calc(80vh - 2em);overflow-y: auto; overflow-x:hidden;}
.filterbar {background-color: #e6e6e6;color: var(--midgrey);text-align: center;margin-top: -0.3em;padding: 0.5em 0;position: sticky;top: 120px;z-index: 100;display: flex;border-bottom: 1px solid var(--midgrey);}
.filterbar .inner {display: grid;align-content: flex-start;justify-content: center;width: 100%;grid-template-columns: repeat(3, 1fr);grid-gap: 0.5em;}
.filterbar .inner .filter {display: inline-block;border: solid 1px rgba(105,105,105,0.05);cursor: pointer;padding: 0.25em 0.5em;margin: 1px;background-color: transparent;transition: var(--fast);cursor: pointer;}
.filterbar .inner .filter:hover {color:var(--brightpurple);background-color: rgba(255,255,255,0.5);}
.filterbar .inner .filterinner {position: abolute;background-color: transparent;color: var(--darkgrey);transform: scaleY(0);transform-origin: top left;max-height: 0;overflow: hidden;transition: var(--fast);}
.filterbar .inner .filterinner.show {padding: 0.2em 0.5em;transform: scaleY(1);transform-origin: top left;max-height: 79vh;overflow-y: scroll;}
.filterbar .inner .filterinner.option.show {display: grid;grid-template-columns: repeat(2,1fr);grid-column-gap: 2em;}
.filterbar .inner .filterinner li {display: grid;grid-template-columns: 1fr 2.5em;grid-column-gap: 0.2em;margin-top: 0.5em;margin-bottom: 0.5em;cursor: pointer; text-align:left;}
.filterbar .inner .filterinner input[type="checkbox"] {display: none;}
.filterbar .inner .filterinner input[type="checkbox"] ~ span::after {font-style: normal;margin-left: -1.4em;transition: var(--fast);display: inline-block;width: 1.4em;font-family: "Font Awesome 6 Pro";font-size: 1.4em;color: var(--green);position: absolute;content: "\f111";font-weight: 400;left: 2em;}
.filterbar .inner .filterinner input[type="checkbox"]:checked ~ span::after {color: var(--purple);content: "\f058";}
.filterbar .inner .filterinner label {cursor: pointer;}
.shopbar {position: fixed;top: 93px;width: 100%;background-color: var(--purple);text-align: center;color: white;text-transform: lowercase; z-index:100;}
.shopbar li {display: inline-block;padding: 0.2em 1em 0.3em 1em;margin: 0.2em 0.2em;border: solid 1px white; background:transparent; transition:var(--fast); cursor:pointer;}
.shopbar li:hover {background-color:var(--darkgrey);border-color:transparent;}
.shopbar li ul {transform: scaleY(0);transform-origin: top;transition: var(--fast);text-align: left;overflow: hidden;max-height: 0;position: absolute;background-color: var(--purple);padding-top: 0.2em;margin-left: -1em;border: solid 1px white;min-width: 100%;}
.shopbar li:hover ul, .shopbar li.open ul {transform:scaleY(1);max-height:100vh;}
.shopbar li ul li {display:block;background-color:var(--puple);border:none; padding: 0.5em 0.2em;width: 100%;}
.shopbar li ul li a {color:white;text-decoration:none;}
.shop .products .ptitle {font-size: 1em;font-weight:400;}
.shop .products .ptitle a {color: var(--midgrey);transition: var(--fast);text-decoration: none;margin-right: 0.4em;}
.shop .products .ptitle a:hover{color:var(--brightpurple);text-decoration:underline;}
.shop .products .ptitle a:not(:last-child)::after {content: "\f101";font: var(--fa-font-light);font-size: 0.8em; color:var(--brightpurple);}
.shop .products .ptitle a:not(:last-child):hover::after {text-decoration: none;}
section.shop .products.item {display: grid;grid-template-columns: 45vw 1fr;grid-gap: 1em;margin-bottom: 1em;padding: 2em;}
section.shop .products.item h1 {padding: 0.3em;background-color: var(--green);color: white;margin-bottom: 1em; text-align:center;}
section.shop .products.item .iphoto {display:block;position: relative;text-align: center;}
section.shop .products.item .itemdetail{text-align:center;font-size:1.1em;}
section.shop .products.item .iphoto.wnav {display:grid; grid-template-columns: 120px 1fr; grid-gap:0.3em;position: relative;text-align: center;align-content:flex-start;}
.iphoto img.main {width: auto;max-width: 100%;height: auto;max-height: calc(100vh - 200px); margin:auto;}
.iphoto img.thb {width: auto;max-width: 100%;height: auto;border:solid 1px var(--darkgrey);margin-bottom:10px;cursor:pointer;}
.carthead {padding-top: 2em;width: 90%;max-width: 1000px;margin: auto;display: flex;justify-content: space-between;}
.cart {width: 90%;max-width: 1000px;margin: auto;display: grid;grid-template-columns: 1fr ; grid-column-gap:2em;padding-bottom:4em;}
.cart label {display: block;margin: 0.5em 0;}
.cartright p.cartsave {margin-bottom: 0.5em;color: var(--green);background-color: var(--prettygrey);text-align: center;padding: 0.25em;}
.cartleft, .cartright , .delivery {padding-top: 1em; transition:var(--slow);}
.cartcard {display: grid;grid-template-columns: 90px 1fr;grid-gap: 0;margin-bottom: 1em;position: relative;border: solid 1px var(--prettygrey);padding: 0px 10px 10px 0px; grid-colum-gap:10px;}
.cartcard p.linesave {padding: 0.3em;text-align: center;grid-column: 1 / span 2;background-color: var(--prettygrey);margin-right: -10px;margin-bottom: 10px;}
.cartcard img {width: 100%;height: auto;}
.cartcardinner {display: flex;justify-content: space-between;flex-direction: column;margin: 1px;padding-right: 7px;}
.ci {display: flex;justify-content: space-between;width: 100%;}
.was {margin-right: 2em;text-decoration: line-through;}
.now {color:var(--purple); font-weight:600;}
.options {display: inline-block;padding: 0.2em 0.5em;border: solid 1px var(--midgrey);margin: 0.2em;background-color: transparent;transition: var(--fast);cursor: pointer;}
.cartright select {background-color: var(--brightpurple);color: white;border: none;padding: 0.5em;width: 100%;font-size: inherit;font-family: inherit;font-weight: 500;}
.cartright .osum {margin: 0.5em 0;}
.cartright .osum tr td {padding: 0.3em 0;}
.cartright .osum tr td:nth-child(2) {font-weight: 600;}
.cartright .cartcontinue {margin-top: 1em;width: 100%;padding: 0.5em;border: none;border-radius: 0;background-color: black;color: white;font-size: inherit;font-family: inherit;cursor: pointer; transition:var(--slow);}
.cartright .cartcontinue:hover {background-color:var(--purple);}
.remove,.edit {cursor:pointer;color:var(--green);text-decoration:none;transition:var(--fast);}
.remove:hover,.edit:hover {var(--brightgreen);text-decoration:underline;font-weight:500;}
.ci p {height: 3em;}
.cart.stage1 {grid-template-columns: 180px 1fr 1fr;}
.ordercard img {width:100%; max-width:200px;}
.ordercard div {display: block;text-align: center;font-size: 0.9em;color: var(--green);font-weight: 500;}
.ordercard div.qty {display:flex;justify-content:space-between;}
.cart.stage1 {grid-template-columns: 180px 1fr 1fr;}
.cart.stage1 h2 {margin-bottom:0.5em;margin-top:0.5em;}
.cart.stage1 .ordersum label {background-color: var(--prettygrey);padding: 0.2em;text-align: center;}
.cart.stage1 .ordersum input {width: 6.0em;padding: 0.2em 0.3em;border-radius: 0px;border: solid 1px var(--midgrey);}
.cart.stage1 .ordersum button {border-radius: 0;border: none;background-color: black;color: white;padding: 0.3em;text-transform: none; cursor:pointer; transition:var(--slow);}
.cart.stage1 .ordersum button :hover {background-color:var(--green);}
.ui-widget {font-family: inherit;font-size: inherit;}
.ui-widget-content {border: 1px solid var(--dark);background: #ffffff;color: inherit;}
.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl {border-radius: 0;}
.ui-widget.ui-widget-content {border: 3px solid var(--darkgrey);}
.ui-dialog .ui-dialog-titlebar {display:none;}
.ui-dialog h2 {text-align: center; color: var(--green);}
.ui-dialog h2 span {color: var(--darkgrey);}
.ui-dialog .addedtocart {display: grid;grid-template-columns: 1fr 1fr;grid-column-gap: 2em;}
.ui-dialog .addedtocart img {max-width:220px;}
.ui-dialog .addedtocart div {display: flex;flex-direction: column; justify-content:center;}
.ui-dialog .addedtocart div p {text-align: right;font-weight: 600;margin: 0.5em 0;}
.ui-widget button {border-radius: 0;font-size: inherit;font-family: inherit;border: solid 2px var(--darkgrey);color: var(--darkgrey);background-color: white;padding: 0.5em;cursor: pointer;font-weight: 600;text-transform: uppercase; transition:var(--fast);}
.ui-widget button:nth-of-type(2){background-color: var(--darkgrey);color:white;}
.ui-widget button:hover {color: white;background-color: var(--purple);}
.ui-widget button:nth-of-type(2):hover {color: var(--purple);background-color: white;}
.ui-front {z-index: 50000;}
.ci.editpanel {display: block;text-align:right;}
.ci.editpanel div {display: flex;justify-content: space-between;padding: 0.5em 1em;}
.ci.editpanel div select, .ci.editpanel div button {font-family: inherit;font-size: inherit;background-color: transparent;margin: 0;border: solid 1px var(--darkgrey);min-width: 11em;text-align: center;padding: 0.5em 0em;text-transform:uppercase;}
.ci.editpanel div button {padding-right:1em;cursor:pointer;transition:var(--fast);}
.ci.editpanel div button:hover{background-color:var(--brightpurple);color:white;}
.ci.editpanel div button.doupdate{background-color:var(--brightpurple);color:white;}
.ci.editpanel div button.doupdate:hover{background-color:var(--purple);color:white;}
.ci.editpanel .closeoptions {cursor:pointer;transition:var(--fast);color:var(--altgrey);}
.ci.editpanel .closeoptions:hover {color:var(--darkgrey);}
.carthead.saved {display: block;text-align: center;}
.carthead.saved button {cursor:pointer;margin: 2em 1em 1em 0em;padding: 0.5em 1em;background-color: transparent;border: solid 2px var(--darkgrey);font-family: inherit;font-size: inherit;text-transform: uppercase;font-weight: 600;transition:var(--fast);}
.carthead.saved button:nth-of-type(1):hover {background-color:var(--brightpurple);color:white;}
.cart.checkout {display: block;}
.cart.checkout h2 {margin-bottom:1em;}
.cart.checkout .ordersum {display: grid;grid-template-columns: 1fr;grid-gap: 2.5em;padding-top: 3em;}
.cart.checkout .ordersum .check1 .osum {font-weight: 500;margin-bottom:1em;}
.cart.checkout .ordersum .check1 input {border-radius: 0px;border: 2px solid var(--darkgrey);font-family: inherit;font-size: inherit;padding: 0.2em;color: var(--purple);text-transform: uppercase;width: 7.5em;display: inline-block;height:1.8em;}
.cart.checkout .ordersum .check1 button {font-family: inherit;font-size: inherit;color: white;font-weight: 600;border-radius: 0;border: 2px solid var(--darkgrey);background-color: var(--darkgrey);text-transform: uppercase;display: inline-block;padding: 0.2em;padding-left: 0.5em;padding-right: 0.5em;cursor: pointer;transition:var(--fast);height:1.8em;}
.cart.checkout .ordersum .check1 button:hover {background-color:var(--purple);}
.cart.checkout .ordersum .check3 .ordercard div {display: block;text-align: left;font-size: 0.9em;color: var(--darkgrey);font-weight: 500;}
.cart.checkout .ordersum .check3 .ordercard div.qty {display: flex;justify-content: space-between;}
.cart.checkout .ordersum .check2 {padding: 0em 0.5em;margin-bottom:1em;}
.cart.checkout .ordersum .check2 p {margin:1em 0em;color:var(--midgrey);}
.cart.checkout .ordersum .check2 form {background-color:var(--prettygrey);display:grid;grid-template-columns:145px 1fr;padding:0.5em 1em;grid-row-gap:0.5em;}
.cart.checkout .ordersum .check2 form input {border-radius:0;border:solid 1px var(--midgrey);padding:0.1em 0.5em;font-family:inherit;font-size:inherit;color:var(--darkgrey);width:100%;height:2em;}
.cart.checkout .ordersum button {grid-column:2;border-radius:0;border:2px solid var(--darkgrey);font-family:inherit;font-weight:600;text-transform:uppercase;height:2.2em;background-color:var(--darkgrey);color:white;cursor:pointer;transition:var(--fast);}
.cart.checkout .ordersum button:hover {background-color:var(--purple);}
.cart.checkout .ordersum .check2 div.delcard {transform:scaleY(1);transform-origin:top center; transition:var(--fast);max-height:200vh;overflow:hidden;}
.cart.checkout .ordersum .check2 div.delcard.closed {transform:scaleY(0); max-height:0;}
.cart.checkout .ordersum .check2 form input[type="checkbox"] {width:2em;}
.cart.checkout .ordersum .check1 .discount td {color:var(--brightpurple);}
.cart.checkout .ordersum .check1 p.success {color:var(--brightpurple);font-weight:600;margin:1em 0em;}
.banner {width:100%;height:auto;}
.products.item .tabs {display:flex;}
.products.item .tabs h3 {display:inline-block;padding:0.5em 1em;margin:0;margin-right:0.5em;background-color:var(--brightpurple);border-top-right-radius:0.5em;cursor:pointer;transition:var(--fast);}
.products.item .tabs h3:hover { background-color:var(--purple);}
.products.item .inner {display:block;border:solid 4px var(--brightpurple);padding:1em 2em;text-align:left;}
.products.item .id {opacity:1;max-height:300vh;transition:var(--fast);}
.products.item .id.ns {opacity:0;max-height:0;}
.products.item .id p {margin:1em 0em;}
.products.item .id.just p {text-align:justify;}
.products.item .id h4 {font-size:1.5em;text-transform:uppercase;color:var(--brightpurple);margin-bottom:1em;}
.products.item .id th,.products.item .id td {padding-top:0.5em;padding-bottom:0.5em;}
section.shop .products.item .freeship {font-weight:500;padding-bottom:0.75em;}
section.shop .products.item .sp {font-weight:600;color:var(--green);}
.tyh {display:grid;position:relative;}
.thankyou {width:50%;align-self:center;justify-self:center;line-height:1.5;text-align:center;padding-top:10vh;position:absolute;}
section.clubs {padding:2em 2em;text-align:justify;line-height:1.4;}
section.clubs p {margin:1em 0;}
section.clubs .mapcontainer, section.clubs .clubsearch {position:relative;display:grid;grid-template-columns:1fr;grid-column-gap:15px;grid-row-gap:15px;}
section.clubs #map{position:relative;display:inline-block;width:100%;height:58vh;background-color:white;}
section.clubs #map img { max-width:none;}
.gmnoprint img { max-width: none;}
section.clubs #capture {display:inline-block;height:auto;background-color:var(--prettygrey);padding:0.5em;max-height:58vh;}
section.clubs #capture div div:nth-child(1) {display:none;}
section.clubs #capture div div:nth-child(2) {font-family:var(--normal) !important;font-size:1.2em;text-align:left;}
section.clubs #capture div div:nth-child(2) button {background-color:var(--brightpurple);color:white;padding:1em 2em;border-radius:0.3em;font-family:inherit;font-weight:bold;transition:var(--slow);cursor:pointer;}
section.clubs #capture div div:nth-child(2) button:hover {background-color:var(--purple);}
section.clubs .clubsearch {margin:1em 0em;}
section.clubs .clubsearch input,section.clubs .clubsearch textarea {font-family:inherit;font-size:1em;padding:0.2em;border-radius:0.1em;border:solid 1px var(--midgrey);color:var(--green);margin:0.1em 0em;display:block;width:100%;}
section.clubs .clubsearch textarea {height:5em;}
section.clubs .clubsearch label {text-transform:uppercase;font-size:0.8em;margin-top:0.3em;display:block;}
section.clubs .clubsearch input[type="checkbox"] {display:inline-block;width:auto;margin-left:3em;}
section.clubs .clubsearch label.check {display:inline-block;}
section.clubs .clubsearch button {display:block;margin:1em 0;width:100%;padding:1em;background-color:var(--brightgreen);color:white;font-family:inherit;font-weight:800;border:none;border-radius:0.3em;cursor:pointer;transition:var(--fast);}
section.clubs .clubsearch button:hover {background-color:var(--green);}
section.clubs .addme {display:block;background-color:var(--midgrey);color:white;padding:0.5em;text-align:center;font-weight:600;cursor:pointer;margin-top:2em;}
section.clubs form {transform:scaleY(0);transition:var(--slow);transform-origin:top center;overflow:hidden;max-height:0;}
section.clubs form.show {transform:scaleY(1);overflow:visible;max-height:200vh;}
section.clubs .return {padding:1em 0em;}
section.clubs .return .thi {padding:0.2em;background-color:var(--purple);color:white;width:100%;display:flex;justify-content:space-between;cursor:pointer;transition:var(--fast);}
section.clubs .return .thi:hover {background-color:var(--brightpurple);}
.sort tr:nth-child(even) {background-color:var(--prettygrey);}
.fi.tyfi {background-color:var(--prettygrey);display:flex;align-items:center;justify-content:center;border-radius:0.3em;font-weight:600;color:var(--green);}
section.blogs .leads {padding: 15px;display: grid;grid-template-columns: repeat(2,1fr);grid-gap: 15px;}
section.blogs .leads .art {aspect-ratio: 1;background-size: 100% auto;background-position:center center;display: flex;align-items: flex-end;justify-content: flex-end;padding: 10px;text-align: right;text-decoration: none;transition:background-size 5s ease, background-color 0.6s linear, filter 0.6s ease;}
section.blogs .leads .art h2 {font-size: 1em;padding: 0.5em 1em;display: inline-block;background-color: var(--brightpurple);border-top-left-radius: 1em;border-bottom-left-radius: 1em;color: white;}
section.blogs .leads.more .art h2 {background-color: #999;}
section.blogs .leads .art:hover {background-size: 200% auto;}
section.blogs .leads .art:hover h2{background-color: var(--brightgreen);}
section.blogs h1 {margin: 0.1em;padding: 0.1em;border-top: solid 5px black;border-bottom: solid 5px black;text-align: center;text-transform: uppercase;font-size: 6em;font-weight: 900;}
section.blogs .marquee {width: 100%;background-color: white;color: black;white-space: nowrap;overflow: hidden;box-sizing: border-box;border-top:solid 20px black;border-bottom:solid 20px black;margin-bottom: 3em;margin-top: 3em;}
section.blogs .marquee h2 {display: inline-block;padding-left: 100%;animation: marquee 15s linear infinite;font-size:4em;font-weight:900;padding-top:0;padding-bottom:0;margin:0;text-transform:uppercase;}
section.blogs .marquee h2::after {display: inline-block;font-family: "Font Awesome 6 Pro";content: "\f45b";font-weight: 400;color: var(--brightgreen);padding-left: 1em;font-size: 0.9em;}
section.blogs .marquee h2::before {display: inline-block;font-family: "Font Awesome 6 Pro";content: "\f45b";font-weight: 400;color: var(--brightgreen);padding-right: 1em;font-size: 0.9em;}
section.blogs .leads.more .art {filter: grayscale(80%);}
section.blogs .leads.more .art:hover {filter: grayscale(0%);}
section.blogs.single .single {display: grid;grid-template-columns: 1fr;grid-gap: 0;padding: 2em;max-width:1024px;margin:auto;}
section.blogs.single .single h1 {grid-column: 1;grid-row: 1;margin: 0;padding: 0;border: none;text-transform: unset;font-size: 3em;padding-left: 15%;text-align: right;align-self: flex-end;}
section.blogs.single.single img.lead {grid-column: 1;grid-row: 2;width: 100%;height: auto;}
section.blogs.single .single .content {grid-column: 1; margin-top: 3em;font-weight: normal;font-size: 1em;text-align: justify;line-height: 1.8;}
section.blogs.single .single .content p {margin-top: 1em;margin-bottom: 1em;}
section.blogs.single .single .content p:first-of-type::first-letter {color: var(--brightpurple);float: left;font-size: 5em;padding-right: 0.05em;font-weight: 900;margin-top:0.1em;}
section.blogs.single .single .content::after {display: inline-block;font-family: "Font Awesome 6 Pro";content: "\f0c8";font-weight: 800;color: var(--brightpurple);padding-left: calc(100% - 1em);font-size: 2em;position: relative;top: 0;}
section.blogs.single .single .content ul {margin-left: 1em;}
section.blogs.single .single .content li {padding-left: 1em;margin-top: 1em; margin-bottom: 1em;}
section.blogs.single .single .content .quote {margin: 1em 2em; padding: 1em 2em; background-color: var(--prettygrey);border-radius: 0.5em;}
section.blogs.single .single .content .quote::before {display: inline-block; font-family: "Font Awesome 6 Pro"; content: "\f10d"; font-weight: 800; color: var(--midgrey);font-size: 2em; position: relative; top: 0;}
section.blogs.single .single .content .quote::after {display: inline-block;font-family: "Font Awesome 6 Pro"; content: "\f10e"; font-weight: 800; color: var(--midgrey); padding-left: calc(100% - 1em); font-size: 2em; position: relative; top: 0;}
section.cl {display: flex;justify-content: center;align-items: center;text-align: center;line-height: 2;}
section.cl form {display: inline-block;background-color: var(--prettygrey);margin-top:1em;padding:1em;border-radius:0.5em;font-size: 1.2em;display: flex;justify-content: center;align-items: center;}
section.cl form button {padding: 0.3em 1em;background-color: var(--brightpurple);border: solid 1px var(--brightpurple);color: white;font-weight: 400;letter-spacing: 1px;border-radius: 0.25em;cursor: pointer;transition: var(--fast);margin-left: 0.5em;font-size: inherit;}
section.cl form button:hover {color: var(--brightpurple);background-color: white;}
section.cl form input {font-size: inherit;margin-right: 0.5em;padding: 0.3em 1em;border-radius: 0.3em;border: solid 1px var(--purple);}
.clholder {display: grid; grid-template-columns: 1fr 300px; grid-gap: 25px; align-items: flex-start; padding-top: 25px;}
.clcartholder {grid-column: 2;grid-row: 1;background-color: #f5f5f5;padding: 0 0.5em;border-radius: 0.5em;}
.clublockermain h1 {font-size: 1.8em; text-align: center; margin: 0.5em;}
.clublockermain {padding: 0 1em;}
.clublockermain > p {text-align: center; margin: 0.5em;}
.clclubhead {display: grid; grid-template-columns: 1fr 1fr; align-items: flex-start;}
.cltabbar {margin: 0.25em 0;padding: 0.25em 0;text-align: center;background-color: var(--prettygrey);position: sticky;top: 93px;z-index: 300;}
.cltabbar h2 {text-align: center;margin: 0.25em 0;font-weight: 500;}
.clclubhead img {justify-self: flex-end;height: 7em;width: auto;}
.cltabbar button {font-size: 1.2em;background-color: white;border: solid 1px var(--green);color: var(--green);padding: 0.1em 2em;border-radius: 0.3em;margin-right: 0.5em;transition: var(--fast);padding-left: 0.5em;cursor: pointer;}
.cltabbar button:hover {color: white;background-color:var(--green);}
.cltabbar h2 {text-align: center; margin: 0.25em 0; font-weight: normal;}
.cltabbar button span::after {font-style:normal; transition:var(--fast); display:inline-block; width:1em; font-family:"Font Awesome 6 Pro"; font-size:1em; position:absolute; content:"\f111"; font-weight:300; padding-left:0.5em; padding-top:0.1em;}
.cltabbar button.active span::after {font-weight:800;}
.filterbar.club {background-color: #eeeeee;color: var(--midgrey);border-top: 1px solid var(--midgrey);position: sticky;top: 170px;}
.locker .quickviewholder.show {width: calc(100vw - 315px);box-shadow: 6px 6px 6px #666;}
.locker .quickviewholder {height: calc(100vh - 160px); box-shadow:none;}
.clcartholder h1 {margin: 0; font-size: 1.4em;}
.clcartholder p {padding: 0.5em; text-align: center; font-weight: 600;}
.clcartholder .cartcard {display: grid;grid-template-columns: 90px 1fr;grid-gap: 0;margin-bottom: 0.5em;position: relative;border: solid 1px var(--prettygrey);padding: 5px 10px 10px 5px;grid-column-gap: 10px;background-color: white;margin-top: 0.5em;}
.clcartholder .cartsum td {color: var(--purple); font-weight: 600;}
.varqty {display: flex; justify-content: space-between; font-size: 1.2em; width: 100%;}
.adjqty {cursor: pointer; color: var(--purple); transition:var(--fast);}
.adjqty:hover{color:var(--green);}
.ci.std {padding-top: 3em;}
.clcartholder button {width: 100%;padding: 0.5em;border: none;border-radius: 0;background-color: black;color: white;font-size: inherit;font-family: inherit;cursor: pointer;transition: var(--slow);}
.clcartholder button:hover{background-color:var(--purple);}
.clcartholder label {display: block;}
.clcartholder input {width: 100%; font-size: 1em; font-family: inherit;}
.clcartholder .delcard p {font-weight: 400;font-size: 0.9em;text-align: left;padding: 0.7em 0;}
.clcartholder .delcard.innerdel, .clcartholder .delcard.innerbill {max-height:300vh; transform:scaleY(1); transition:var(--slow);transform-origin:top center;}
.clcartholder .delcard.innerdel.ns , .clcartholder .delcard.innerbill.ns{transform: scaleY(0);max-height: 0;}
.products.item .id.rp.norack {font-size: 0.85em;}
.products.item .id.rp.norack ul {margin: 0; padding: 0;}
.products.item .id.rp.norack li {margin-bottom: 1em; margin-left:1em; padding-left:1em;} 
.check3 {max-width: 270px;border: solid 1px var(--prettygrey);padding: 0.2em;} 
.pdetails {width: calc(100vw - 3em);font-size: 0.9em;}
@keyframes marquee 
{
0% { transform: translate(0, 0);}
100% { transform: translate(-100%, 0);}
}
@media (min-width:550px)
{
footer {grid-template-columns: 235px 1fr;grid-gap: 2em;}
footer .footermidleft {text-align:right;}
}
@media (min-width:680px)
{
section.shop .products {grid-template-columns:repeat(4,1fr);}
section.shop .products.club {grid-template-columns:repeat(3,1fr);}
section.shop .products.club .ptitle {grid-column: 1 / span 3;}
section.shop .products h2.tp {grid-column:1 / span 4;}
section.shop .products .matchcount,section.shop .products h2 {grid-column:1 / span 4;}
}
@media (min-width:870px)
{
header .header {display:flex;justify-content:space-between;align-items:center;}
.shopbar {top:90px;}
footer {grid-template-columns: 235px 1fr 235px;}
footer .footermidleft {text-align: center;}
footer .footerright {grid-column: 3;}
section.blogs .leads {grid-template-columns: repeat(3,1fr);}
section.blogs.single .single {display: grid;grid-template-columns: 50% 50%;grid-gap: 0;padding: 2em;max-width:1024px;margin:auto;}
section.blogs.single .single h1 {grid-column: 2;grid-row: 1;}
section.blogs.single.single img.lead {grid-column: 1;grid-row: 1;}
section.blogs.single .single .content {grid-column: 1 / span 2;}
}
@media (min-width:900px)
{
section.shop .products {grid-template-columns:repeat(6,1fr);}
section.shop .products.club {grid-template-columns:repeat(4,1fr);}
section.shop .products.club .ptitle {grid-column: 1 / span 4;}
section.shop .products h2.tp {grid-column:1 / span 6;}
section.shop .products .matchcount,section.shop .products h2 {grid-column:1 / span 6;}
.pdetails {width: auto;}
}
@media (min-width:940px)
{
.filterbar .inner {grid-template-columns: repeat(6, 1fr);}
}
@media (min-width:1024px)
{
section.clubs .mapcontainer, section.clubs .clubsearch {display:grid;grid-template-columns:1fr 300px;grid-column-gap:15px;}
header .header .collapsed {display:none;}
header .header .navi {width: calc(100vw - 300px);display: flex;justify-content: space-between;align-items: center; margin-right:0;transform:scaleX(100%);position:relative;right:0;}
.cart {width: 90%;max-width: 1000px;margin: auto;display: grid;grid-template-columns: 360px 1fr; grid-column-gap:2em;}
.cartleft, .cartright , .delivery {min-height: calc(100vh - 20.8em);padding-top: 1em; transition:var(--slow);}
.cart.checkout .ordersum {grid-template-columns: 200px 1fr 160px;grid-column-gap: 2.5em;padding-top:0em;}
.ordercard img {width:100%; max-width:100%;}
.check3 {max-width: auto;border: none;padding: 0;}
}
@media (min-width:1280px){}