@font-face { font-family: DMSans; src: url(/library/fonts/DMSans/Variable.otf) format("opentype"); }
@font-face { font-family: ExoItalic; src: url(/library/fonts/Exo/ItalicVariable.otf) format("opentype"); }
@font-face { font-family: ExoVariable; src: url(/library/fonts/Exo/Variable.otf) format("opentype"); }
@font-face { font-family: TitilliumBold; src: url(/library/fonts/Titillium/Bold.otf) format("opentype"); }
@font-face { font-family: TitilliumBold; src: url(/library/fonts/Titillium/Bold.otf) format("opentype"); }

* { background-repeat: no-repeat; background-position: center center; box-sizing: border-box; }
body { margin: 0px; padding: 0px; width: 100%; height: auto; background-color: var(--background); color: var(--black); font-family: "DMSans", sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.6; letter-spacing: 0.02em; text-rendering:  optimizeLegibility; -webkit-font-smoothing: antialiased; }
ul, ol { padding: 0px; margin: 0px; }
li { list-style-type: none; vertical-align: top; }
.richtextcontent ul, .content ul, .richtextcontent ol { margin-bottom: 26px;}
.richtextcontent ul > li, .content ul > li {list-style-type: disc;margin-left: 30px;}
.richtextcontent ol > li, .content ol > li {list-style-type: decimal; margin-left: 30px;}
fieldset { padding: 0px; margin: 0px; border: none; }
input, textarea, select { font-size: 90%; background: transparent; border: 1px solid rgb(203, 203, 203); padding: 5px; color: var(--black); box-sizing: border-box; font-family: "DMSans", sans-serif; }
textarea {background-color: var(--white); border-radius: 12px; min-height: 40px;}

input[type=text], input[type=password]  { height: 30px; font-family: "DMSans", sans-serif;}
input[type=button], input[type=submit] { cursor: pointer; background-color: #000000; color: #ffffff; padding: 10px 20px 10px 20px; }
select { height: 30px; padding-right: 10px; background-image: none; background-repeat: no-repeat; background-position: right 10px center; }
table { border-spacing: 0px; }
td, th { padding: 0px; text-align: left; vertical-align: top; }
.hidden, .beachshore { display: none; }
.spacer { clear: both; height: 0px; display: none; }
a { color: var(--orange); text-underline-offset: 0.2em; font-size: 0.875rem; text-decoration-color: var(--black); text-decoration: none; }
a > h2 {color: var(--orange) !important;}
strong, p>strong  {  font-weight: 600;}
em {font-style: italic;}
.errors {color: red; font-size: 14px; margin-bottom: 20px;}
.centertxt {text-align: center;}
.layoutmiddle{min-height: 60vh !important; background-color: var(--lightgray); }
.layoutmiddle:not(:has(.home)) {padding-top: 30px;}
.layoutcontent_inner {background-color: var(--lightgray);}

.breadcrumb {width: 100%; height: auto; margin-bottom: 10px;}
.breadcrumb ul {display: flex; flex-wrap: wrap; }
.breadcrumb ul li {display: flex; align-items: center; color: var(--gray); }
.breadcrumb ul li a {padding: 0 5px; color: var(--gray);}
.breadcrumb .links li:first-child { font-size: 0;}

.backorder {display: none !important;}

#errormsg {color: var(--red); padding-bottom: 10px;}

.richtextcontent figure {width: min-content; color: gray; font-size: 0.8rem; font-style: italic; }
.richtextcontent figure[style*="float:right"], .richtextcontent img[style*="float: right"] { margin: 0 0 30px 30px;}
.richtextcontent figure[style*="float:left"], .richtextcontent img[style*="float: left"] { margin: 0 30px 20px 0;}
.richtextcontent figure.image:not([style]) { margin: 20px 0 20px 0;}

h1, h1>span, h2, h3, h4, h5, h6 { padding: 0px 0px 0px 0px; margin: 0px; color: var(--black); }
h1 {font-size: 32px; margin-bottom: 20px; line-height: 48px; color: var(--black);}
h2 {font-size: 24px; margin-bottom: 16px; line-height: 32px; color: var(--black);}
h3 {font-size: 20px; margin-bottom: 12px; line-height: 28px;}
p { font-size: 14px; line-height: 20px;}

h2.titletxt, .shop_category > h1.name {font-size: 32px; font-family: TitilliumBold; color: var(--black); margin-bottom: 0;}
.shop_basketpage > .titletxt {font-size: 32px; font-family: TitilliumBold; color: var(--black); font-style: italic;}
.checkout > h2 {font-size: 28px; font-family: TitilliumBold; color: var(--black); text-align: center; }

@media (max-width: 768px) {
 h1 { font-size: 28px; margin-bottom: 18px; }
 h2 { font-size: 22px;  margin-bottom: 14px; }
 h3 { font-size: 18px; margin-bottom: 12px; }

 h2.titletxt {font-size: 32px; }
}

:root 
{
   --background: #FDFDFD;
   --black: #1A1A1A;
   --red: #CA0000;
   --gray: #4D4D4D;
   --lightgray: #f5f5f5;
   --green: #7abb67;
   --white: #ffffff;
   /* --black: #050D33; */
   --orange: #F85F0A;
}


/***** HEADER **************************************************************/
/***************************************************************************/

/* .layoutbreadcrumb {max-width: 1200px; width: 100%; margin: 0 auto; padding: 10px;}
.layoutbreadcrumb:has(~ * .home) { display: none;} */
/* Header ticker */

.ticker > .carousel { overflow: hidden; width: 100%; position: relative; height: 40px; background-color: var(--lightgray);}
.ticker > .carousel ul { position: relative; width: 99999px; margin: 0; padding: 0; list-style: none; }
.ticker > .carousel li { float: left; width: 100%; display: block; box-sizing: border-box; height: 40px; line-height: 40px; text-align: center;}
.ticker > .carousel li .content h2.titletxt {font-size: 14px; font-weight: 600; line-height: 40px;}

@media(max-width: 768px) {
   .ticker > .carousel li .content h2.titletxt {font-size: 12px;}
}


/* Main header */
.main-header {width: 100%; background-color: var(--black); padding: 8px;}
.main-header .items { max-width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center;}
.main-header .header-logo img {height: 80px; width: auto; }

.main-header .header-right .items {gap: 16px; display: flex;}
.main-header .header-right .util_sitesearchbar fieldset {border: 1px solid var(--white); border-radius: 12px; padding: 0 6px 0 12px; background-color: white; }
.main-header .header-right .util_sitesearchbar fieldset input[type=text] {border: none; height: 40px; width: 250px; font-size: 14px; font-family: "DMSans", sans-serif; }
.main-header .header-right .util_sitesearchbar fieldset input:focus {outline: none;}
.main-header .header-right .util_sitesearchbar fieldset:focus-within {border: 2px solid var(--white); box-shadow: 0 0 6px rgba(0,0,0,0.1);}
.main-header .header-right .util_sitesearchbar fieldset button { height: 40px; background-color: transparent; border: none; cursor: pointer;}
.main-header .header-right .util_sitesearchbar fieldset button i { font-size: 20px; color: var(--black);}
.main-header .header-right .shop_basketlink a {display: flex; align-items: center; color: var(--white); justify-content: center; gap: 3px;}
.main-header .header-right .shop_basketlink a i {font-size: 22px;}
.main-header .header-right .shop_basketlink a > span {font-size: 16px; color: var(--white); padding-top: 3px;}

.main-header .header-right .header-links .links {display: flex; align-items: center; justify-content: center; gap: 16px;}
.main-header .header-right .header-links .links .link:last-child {margin-top: 4px;}
.main-header .header-right .header-links .links i {font-size: 22px; color: var(--white);}



@media(min-width: 1001px) {
   .layouttopmenu { width: 100%; background-color: var(--lightgray); box-shadow: 0 2px 8px rgba(0,0,0,0.2); position: relative; z-index: 10; }
   .layouttopmenu_inner { max-width: 1200px; width: 100%; margin: 0 auto; height: 50px; display: flex; justify-content: center; align-items: center; }
   .layouttopmenu_inner .links > .level1 > li:last-child a { color: var(--red); }
   .mobilemenu, .main-header .nav_jmsmenu { display: none; }
   .layouttopmenu .desktopmenu .level1 { display: flex; height: 100%; margin: 0; padding: 0; }
   .layouttopmenu .desktopmenu .level1 > li { position: static; list-style: none; display: flex; align-items: stretch; height: 100%; }
   .layouttopmenu .desktopmenu .level1 > li > a { display: flex; align-items: center; height: 50px; padding: 0 10px; font-family: TitilliumBold; font-weight: 500; font-size: 18px; text-transform: uppercase; color: var(--black); text-decoration: none; }
   .layouttopmenu .desktopmenu .level1 > li:last-child > a { color: var(--red); }

   .layouttopmenu .desktopmenu .submenu { display: none; position: absolute; top: 100%; left: 0; width: 100%; background: #ffffff; z-index: 10; box-sizing: border-box; padding: 20px 100px; box-shadow: 0 6px 8px -4px rgba(0, 0, 0, 0.2); border-top: 1px solid rgb(208, 208, 208); }
   .layouttopmenu .desktopmenu .level1 > li:hover > .submenu { display: flex; justify-content: center; gap: 40px; align-items: flex-start;  }

   .layouttopmenu .desktopmenu .submenu .cats { flex: 1 1 auto; max-width: 500px;}
   .layouttopmenu .desktopmenu .submenu .branding { flex: 0 0 360px; max-width: 360px; }

   .layouttopmenu .desktopmenu .submenu .cat-name { margin: 0 0 10px; text-transform: uppercase; font-family: TitilliumBold; font-style: italic; font-size: 22px; }

   .layouttopmenu .desktopmenu .submenu .subcategories { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; gap: 0; }
   .layouttopmenu .desktopmenu .submenu .subcategories.two-columns { grid-template-columns: repeat(2, 1fr); gap: 0 20px; }
   .layouttopmenu .desktopmenu .submenu .subcategories li { padding: 5px 0; width: 100%; }
   .layouttopmenu .desktopmenu .submenu .subcategories a { display:inline-block; width:100%; color:var(--black); font-size:15px; font-weight: 300; }

   .layouttopmenu .desktopmenu .submenu .suppliers { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
   .layouttopmenu .desktopmenu .submenu .suppliers li { list-style: none !important; margin: 0 !important; display: flex; align-items: center; justify-content: center; }
   .layouttopmenu .desktopmenu .submenu .suppliers img { display: block; width: 80px; height: 45px; object-fit: contain; }
}

@media(max-width: 1000px) {
   .desktopmenu { display:none; }
   .layouttopmenu .nav_jmsmenu {display: none;}
   .mobilemenu .mobilemenu-header {display: flex; flex-direction: row-reverse; justify-content: space-between; align-items: center;  border-bottom: 1px solid var(--lightgray); padding: 0 10px;}
   .mobilemenu .menu-cat {color: var(--gray);  font-family:TitilliumBold; font-size:16px; text-transform: uppercase;}
   .mobilemenu .close-menu {height: 50px; display: flex; align-items: center; }
   .mobilemenu .close-menu i { font-size: 26px; color: var(--gray);}
   .mobilemenu .toggle {position: absolute; left: 10px; top: 122px;}
   .mobilemenu .toggle i {color: var(--black); font-size: 26px;}
   .mobilemenu .popup { background-color: white; max-width: 300px; width: 100%; position: fixed; top: 0px; z-index: 9999; height:100vh; overflow-y:auto;}
   .shop_basketlink a span.items {color: var(--black) !important;}
   .main-header {padding: 0;}
   .main-header .header-logo {padding: 10px;}
   .main-header .items {display: flex; flex-direction: column; }
   .main-header .items .header-right {width: 100%; background-color: var(--lightgray); box-shadow: 0 2px 8px rgba(0,0,0,0.2); padding: 8px 10px 3px 0px;}
   .main-header .items .header-right .items {display: flex; flex-direction: row; justify-content: space-between; }
   .main-header .items .header-right .items .actions .items {gap: 20px;}
   .main-header .items .header-right .items .actions .items i {color: var(--black);}
   .main-header .items .header-right .items .actions .items .header-links .links {gap: 20px;}
   .main-header .header-logo .link > a > img {height: 50px; margin-bottom: -5px;}

   .main-header .header-right .util_sitesearchbar {display:none;}
   .main-header .header-right .header-links .links {gap: 16px;}

   .mobilemenu .level1row { display:flex; justify-content:space-between; align-items:center; padding-left: 10px;}
   .mobilemenu .level1row a { flex:1; font-family:TitilliumBold; font-weight:500; font-size:18px; text-transform: uppercase; color: var(--black); }
   .mobilemenu .submenu-toggle { cursor:pointer; padding:14px 16px; display:flex; align-items:center; justify-content:center; }
   .mobilemenu .level2 { display:none; }
   .mobilemenu .level1 > li.open > .level2 { display:block; }
   .mobilemenu .level2 li {padding-left: 20px; padding-bottom: 10px;}
   .mobilemenu .level2 li a {color: var(--black);}
   .mobilemenu .level1 > li:last-child a {color: var(--red);}
}




/***** FOOTER **************************************************************/
/*************************************************************************/
.layoutfooter {background-color: var(--black);}

.layoutfooter .footer-top {max-width: 1200px; margin: 0 auto; padding: 30px 10px 20px 10px;}
.layoutfooter .footer-top .items {display: flex; justify-content: space-between;}
.layoutfooter .footer-top .items .nav_linklist h2 {color: var(--white); font-size: 20px; font-style: italic; margin-bottom: 8px;}
.layoutfooter .footer-top .items .nav_linklist a {color: var(--white);}

.layoutfooter .footer-bottom {max-width: 1200px; margin: 0 auto; padding: 10px;}
.layoutfooter .footer-bottom .content ul {display: flex; justify-content: space-between; margin-bottom: 0px;}
.layoutfooter .footer-bottom .content ul li {list-style-type: none; margin-left: 0px; font-size: 14px; color: var(--white); font-weight: 400;}
.layoutfooter .footer-bottom .content ul li a {color: var(--white);}

@media(max-width: 768px) {
   .layoutfooter .footer-top .items, .layoutfooter .footer-bottom .content ul  {flex-direction: column; text-align: center;}
   .layoutfooter .footer-top .items .nav_linklist  {margin-bottom: 20px;}
   .layoutfooter .footer-top .items .nav_linklist h2 {margin-bottom: 0px;}
}






/***** HOME **************************************************************/
/*************************************************************************/

/* Home banner */


.home.page_standarda .banner { position: relative; width: 100%; }
.home.page_standarda .banner .carousel { overflow: hidden; width: 100%; position: relative; margin: 0 auto; min-height: 0; }
.home.page_standarda .banner .carousel ul { width: 20000em; position: relative; padding: 0; margin: 0; }
.home.page_standarda .banner .carousel li.carouselitem { float: left; max-width: 100% !important; position: relative; list-style: none; }
.home.page_standarda .banner .carousel img { width: 100%; height: auto; display: block; max-width: 100%; }
.home.page_standarda .banner .jcarousel-control{text-align: center; position: absolute; left:50%; bottom: 10px}
.home.page_standarda .banner .jcarousel-control a { display: inline-block; width: 10px; height: 10px; margin: 0 4px; border-radius: 50%; border: 2px solid white; background-color: transparent; text-indent: -9999px; overflow: hidden;}
.home.page_standarda .banner .jcarousel-control a.active {background-color: white; }

@media (min-width: 1600px) {
    .home.page_standarda .banner .carousel img { max-height: 80vh; object-fit: contain; } 
}

/* Padel Whack */
.home.page_standarda .padel-shack {max-width: 1200px; width: 100%; margin: 50px auto 30px auto; padding: 0 30px;}
.home.page_standarda .padel-shack h2.titletxt {font-family: TitilliumBold;  text-transform: uppercase; font-style: italic;}

.home.page_standarda .padel-shack .items .padel-info .util_textbox_inner {display: flex; flex-direction: column; height: 100%;}
.home.page_standarda .padel-shack .items .padel-info .util_textbox_inner .content > h2 {font-family: TitilliumBold;  line-height: 1;}
.home.page_standarda .padel-shack .items .padel-info .util_textbox_inner .content > h3 {font-family: TitilliumBold;  line-height: 1; color: var(--gray);}
.home.page_standarda .padel-shack .items .padel-info .util_textbox_inner .content > p { color: var(--gray);}
/* .home .padel-shack .items .padel-info .util_textbox_inner .link  { border: 1px solid var(--black); padding: 12px 24px; border-radius: 50px; width: fit-content; } */
.home.page_standarda .padel-shack .items .padel-info .util_textbox_inner .link  {margin-top: 30px; padding: 8px 20px; border-radius: 12px; width: fit-content; transition: background 0.25s ease, box-shadow 0.25s ease; box-shadow: inset 0 0 0 1px var(--black); background-color: var(--black); }
.home.page_standarda .padel-shack .items .padel-info .util_textbox_inner .link a { color: var(--white);}
.home.page_standarda .padel-shack .items .padel-info .util_textbox_inner .link:hover { box-shadow: inset 0 0 0 2px var(--black); background-color: var(--background); }
.home .padel-shack .items .padel-info .util_textbox_inner .link:hover a { color: var(--black); }

.home.page_standarda .padel-shack .items {display: flex; gap: 40px; }
.home.page_standarda .padel-shack .items .padel-video, .home .padel-shack .items .padel-info {flex: 1; }
.home.page_standarda .padel-shack .items .padel-video .player video {width: 100%;}
.home.page_standarda .padel-shack .items .padel-video video::-webkit-media-controls { display: none !important;}

.home.page_standarda .padel-links {max-width: 1200px; width: 100%; margin: 0 auto 100px auto; padding: 0 30px; }
.home.page_standarda .padel-links .items {display: flex; gap: 8px; }
.home.page_standarda .padel-links .items .util_textbox {flex: 3 1 auto; height: 300px; min-height: 300px; background-size: cover; position: relative; background-position: center center; overflow: hidden;}
/* .home .padel-links .items .util_textbox::before { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, 0.4); z-index: 1;} */
.home.page_standarda .padel-links .items .util_textbox .util_textbox_inner {display: flex; flex-direction: column; height: 100%;  align-items: center; padding: 16px;}
.home.page_standarda .padel-links .items .util_textbox .util_textbox_inner .link { margin-top: auto; background: rgba(0,0,0,0.4); backdrop-filter: blur(2px); position: relative; z-index: 2; padding: 8px 20px; border-radius: 12px; width: fit-content; transition: background 0.25s ease, box-shadow 0.25s ease; box-shadow: inset 0 0 0 1px var(--white);}
.home.page_standarda .padel-links .items .util_textbox .util_textbox_inner .link:hover { background: var(--black); box-shadow: inset 0 0 0 2px var(--black);}

.home.page_standarda .padel-links .items .util_textbox .util_textbox_inner .link a {color: var(--white);}
/* .home .padel-links .items .util_textbox .util_textbox_inner .link:hover a { color: var(--orange); } */

@media(max-width: 650px) {
   /* .home .padel-shack {padding: 0 30px;} */
   .home.page_standarda .padel-shack .items {flex-direction: column; gap: 10px;}
   .home.page_standarda .padel-shack .items .padel-video {order: 1;}
   .home.page_standarda .padel-shack .items .padel-info {order: 2;}
   .home.page_standarda .padel-shack .items .padel-info .util_textbox_inner .link {margin-top: 0;}
   .home.page_standarda .padel-links .items {flex-direction: column; }
}

@media(max-width: 425px) {
   .home.page_standarda .padel-links { padding: 0 10px; }
   .home.page_standarda .padel-shack {padding: 0 10px;}
}

/* Newsletter */
/* .home-newsletter {background-color: #F5F7FA; text-align: center; background-image: url(/images/4aY6NuRvREGUSaq4D5mr.svg); background-repeat: repeat; background-size: 60px 60px; background-position: center; } */
.home-newsletter {background-color: #F5F7FA; text-align: center; padding: 50px 10px;  }
.home-newsletter fieldset .text p {font-size: 16px;}
.home-newsletter fieldset .form {display: flex; align-items: center; justify-content: center;}
.home-newsletter fieldset .form .email .label {display: none;}

.home-newsletter fieldset .form .email .input input {height: 41px; border: 1px solid var(--orange); border-radius: 12px 0 0 12px; padding-left: 10px; background-color: var(--white);}
.home-newsletter fieldset .form .buttons input {background-color: var(--orange); border: none; border-radius: 0 12px 12px 0; letter-spacing: 0.5px; font-size: 16px;}
.home-newsletter fieldset .form .buttons input:hover {background-color: var(--black);}

@media(max-width: 425px) {
   .home-newsletter fieldset .form {flex-direction: column; gap: 16px;}
   .home-newsletter fieldset .form .buttons input, .home-newsletter fieldset .form .email .input input {border-radius: 12px;}
}

/* Home categories list */

.home .shop_categorylist .titletxt {margin-bottom: 20px; text-transform: uppercase; font-style: italic;}
.home .shop_categorylist { max-width: 1200px; width: 100%; margin: 0 auto; padding: 0 10px; }
.home .shop_categorylist .level1 { display: flex; flex-wrap: wrap; gap: 20px; overflow: hidden; scroll-behavior: smooth; padding-bottom: 10px; margin: 0; list-style: none; }
.home .shop_categorylist .level1 li { position: relative; flex: 1 1 calc(25% - 20px); max-width: calc(25% - 20px); height: 300px; cursor: pointer; }
.home .shop_categorylist .level1 li .image { width: 100%; height: 100%; }
.home .shop_categorylist .level1 li .image::after { content:""; position:absolute; inset:0; background:linear-gradient(to top,rgba(0,0,0,0.65) 0%,rgba(0,0,0,0.25) 40%,rgba(0,0,0,0) 70%); z-index:1; }
.home .shop_categorylist .level1 li img { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; }
.home .shop_categorylist .level1 li .name { position:absolute; bottom:12px; left:50%; transform:translateX(-50%); z-index:2; text-align:center; font-family: TitilliumBold; font-style: italic; font-size: 40px; color: var(--black); }
.home .shop_categorylist .level1 li .name a {color:#fff; font-size:18px; font-weight:600; display:block; }
.home .shop_categorylist .level1 li .name:hover a {background-color: var(--black); box-shadow: inset 0 0 0 1px var(--black);}
.home .shop_categorylist .level1::-webkit-scrollbar { height: 6px; }
.home .shop_categorylist .level1::-webkit-scrollbar-track { background: transparent; margin: 0 10px; }
.home .shop_categorylist .level1::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.3); border-radius: 10px; }

@media (max-width: 768px) {
  .home .shop_categorylist .level1 { flex-wrap: nowrap; overflow-x: auto; }
  .home .shop_categorylist .level1 li { flex: 0 0 300px; max-width: 300px; height: 300px; }
}



/* Sale */
.sale-bg {  position: relative;  z-index: 1;  margin-top: 40px; }

.shop_productlist.product-scroll { max-width: 100%;  margin: 0 auto; padding: 0 10px;}
.shop_productlist.product-scroll .titletxt {  margin-bottom: 20px; max-width: 1200px; margin: 0 auto 30px auto; padding-top: 20px; font-size: 32px; text-transform: uppercase; font-style: italic;}
.shop_productlist.product-scroll ul { display: flex; flex-wrap: nowrap; gap: 20px; overflow-x: auto; scroll-behavior: smooth; padding-bottom: 10px; margin: 0 0 30px 0; list-style: none; }
.shop_productlist.product-scroll ul li { position: relative; flex: 0 0 300px; max-width: 300px; height: 386px; cursor: pointer; box-sizing: border-box; display: flex; flex-direction: column; background-color: var(--white); padding: 10px; border-radius: 16px; }
.shop_productlist.product-scroll ul::-webkit-scrollbar { height: 6px; }
.shop_productlist.product-scroll ul::-webkit-scrollbar-track { background: transparent; margin: 0 10px; }
.shop_productlist.product-scroll ul::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.3); border-radius: 10px; }
.shop_productlist.product-scroll ul { padding-bottom: 20px; }
.shop_productlist.product-scroll ul { overflow-x: auto; }
@media (min-width: 1600px) {
   .shop_productlist.product-scroll {max-width: 1600px;}
}






/***** CATEGORY PAGES ****************************************************/
/*************************************************************************/
.page_standarda:not(.home) {margin: 0 auto; max-width: 1200px; width: 100%;}
/* .page_standarda:not(.home) .pageheader {margin: 16px 0;} */
.page_standarda:not(.home) span.pagetitle_inner {font-family: TitilliumBold; font-style: italic; font-size: 40px; padding: 0 10px; }



.pagebanner {padding-top: 30px;}
.pagebanner_inner {margin-bottom: 30px;}
.pagebanner_inner img { max-width: 1200px; width: 100%; max-height: 600px; height: 100%; border-radius: 16px; }

.shop_category { max-width: 1200px; margin: 0 auto; display: flex; flex-direction: column;}
.shop_category .name { font-family: TitilliumBold; font-style: italic; font-size: 40px; color: var(--black); }
.shop_category { max-width: 1200px; margin: 0 auto; padding: 0 10px 50px 10px; display: flex; flex-direction: column; }



.shop_category .subcategories { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:20px; padding:0; margin:0; list-style:none; margin: 20px 0 50px 0; }
.shop_category .subcategories li { position:relative; overflow:hidden; border-radius:16px; cursor:pointer; aspect-ratio:1/1; }
.shop_category .subcategories a { text-decoration:none; color:inherit; }
.shop_category .subcategories .image { position:relative; width:100%; height:100%; }
.shop_category .subcategories .image img { width:100%; height:100%; object-fit:cover; display:block; transition:transform 0.3s ease; }
.shop_category .subcategories .image::after { content:""; position:absolute; inset:0; background:linear-gradient(to top,rgba(0,0,0,0.65) 0%,rgba(0,0,0,0.25) 40%,rgba(0,0,0,0) 70%); z-index:1; }
.subcategories .name { position:absolute; bottom:12px; left:50%; transform:translateX(-50%); z-index:2; text-align:center; }
.subcategories .name a { color:#fff; font-size:18px; font-weight:600; display:block; }
.shop_category .subcategories li:hover img { transform:scale(1.05); }

@media (min-width:1200px) {
   .shop_category .subcategories { grid-template-columns:repeat(4,1fr); }
}

@media (max-width:900px) {
   .shop_category .subcategories { grid-template-columns:repeat(2,1fr); }
}

@media (max-width:600px) {
   .shop_category .subcategories { grid-template-columns:repeat(2,1fr); }
   .shop_category .subcategories li:first-child { grid-column:1 / -1; aspect-ratio:16 / 9; } 
}

@media (max-width:360px) {
   .subcategories { grid-template-columns:1fr; }
}



.shop_productlist .image, .shop_productlist .price, .shop_productlist .name { display: block;}

.shop_productlist { max-width:900px; width:100%; margin:0 auto; }
.shop_productlist ul { display:grid; grid-template-columns:repeat(4, 1fr); gap:20px; padding:0; margin:0 0 30px 0; list-style:none; }
.shop_productlist ul li { width:100%; box-sizing:border-box; display:flex; flex-direction:column; background-color: var(--white); padding: 10px; border-radius: 16px; height: 386px;}
.shop_productlist ul li .image { order:1; width:100%; height: 240px;}
.shop_productlist ul li .image img { width:100%; height:100%; object-fit:contain; object-position:center; display:block; }
.shop_productlist ul li .supplier { order:2; font-size:16px; padding-top:10px; }
.shop_productlist ul li .name { order:3; font-family:DMSans; font-style:normal; font-size:14px; }
.shop_productlist ul li .name a { color:var(--gray); font-size:14px;  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; line-height: 1.2; max-height: calc(1.4em * 3); }
.shop_productlist ul li .price { order:4; font-size:16px; font-weight:600; margin-top:auto; padding:6px 0; }


/* Layout columns */
.layout-columns { display: flex; flex-direction: row; gap: 30px; align-items: flex-start; max-width: 1200px; width: 100%; margin: 0 auto; }

/* Filter panel */
.filter-panel { width: 220px; min-width: 180px; background-color: var(--white); border-radius: 16px; padding: 16px; box-sizing: border-box; position: sticky; top: 20px; }

/* Products panel */
.products-panel { flex: 1; min-width: 0; }
.products-panel .shop_productlist { max-width: 100%; margin: 0; }

/* Filter toggle button - hidden on desktop */
.filter-toggle { display: none; }

/* Filter group accordion */
.filter-group { border-bottom: 1px solid var(--lightgray); padding: 8px 0; }
.filter-group:last-child { border-bottom: none; }
.filter-group-header { display: flex; justify-content: space-between; align-items: center; cursor: pointer; padding: 6px 0; user-select: none; }
.filter-group-header h4 { margin: 0; font-size: 14px; font-family: TitilliumBold; text-transform: uppercase; letter-spacing: 0.08em; color: var(--black); }
.filter-group-header i { font-size: 11px; color: var(--gray); transition: transform 0.2s ease; }
.filter-group-body { padding-top: 6px; padding-bottom: 4px; }
.filter-group-body ul { list-style: none; padding: 0; margin: 0; }
.filter-group-body ul li { padding: 4px 0; }

/* Sort links */
.filter-group-body ul li a { text-decoration: none; font-size: 14px; color: var(--gray); transition: color 0.15s ease; }
.filter-group-body ul li a:hover { color: var(--black); }
.filter-group-body ul li a.active { color: var(--black); font-size: 14px; }

/* Brands list */
.brand-filter-list { max-height: 250px; overflow-y: auto; }
.brand-filter-list li { display: flex; align-items: center; gap: 8px; padding: 4px 0; }
.brand-filter-list li input[type="checkbox"] { cursor: pointer; width: 14px; height: 14px; accent-color: var(--black); flex-shrink: 0; }
.brand-filter-list li label { font-size: 13px; color: var(--gray); cursor: pointer; line-height: 1.3; }

/* Availability list */
.availability-filter-list li { display: flex; align-items: center; gap: 8px; padding: 4px 0; }
.availability-filter-list li input[type="checkbox"] { cursor: pointer; width: 14px; height: 14px; accent-color: var(--black); flex-shrink: 0; }
.availability-filter-list li label { font-size: 13px; color: var(--gray); cursor: pointer; line-height: 1.3; }

/* Mobile */
@media (max-width: 900px) {
    .filter-toggle { display: flex; align-items: center; gap: 8px; background-color: var(--white); border: none; border-radius: 10px; padding: 10px 16px; font-size: 14px; font-family: TitilliumBold; cursor: pointer; margin-bottom: 16px; }
    .layout-columns { flex-direction: column; gap: 0; }
    .filter-panel { display: none; width: 100%; min-width: unset; position: static; margin-bottom: 20px; border-radius: 16px; }
    .filter-panel.open { display: block; }
}


@media (max-width:900px) { 
   .shop_productlist ul { grid-template-columns:repeat(3, 1fr); } 
}

@media (max-width:600px) { 
   .shop_productlist ul { grid-template-columns:repeat(2, 1fr); } 
}

@media (max-width:425px) { 
   .shop_productlist ul li .image {height: 180px;} 
   .shop_productlist ul li {height: 320px;}
}

@media (max-width:320px) { 
   .shop_productlist ul { grid-template-columns:1fr; } 
}



/***** PRODUCT PAGE ****************************************************/
/*************************************************************************/

.shop_product { display: flex; justify-content: flex-start; flex-wrap: wrap; max-width: 1200px; width: 100%; margin: 0 auto; padding: 0 10px; gap: 30px;}

.shop_product > .breadcrumb { width: 100%;}
.shop_product > .product_images { width: 500px; flex: 0 0 500px;}
.shop_product > .details { flex: 1 1 0; min-width: 0;}
.shop_product > .prod-info { width: 100%;}


@media (min-width: 768px) {
   .shop_product .price {margin-top: 24px;}
}

@media (max-width: 768px) {
    .shop_product .details {width: 100%; }
    .shop_product .product_images {width: 100%; }
    .shop_product .breadcrumb {width: 100%; height: auto;}
    .shop_product .product_images {order: 2;}
    .shop_product .details {order: 1;}
    .shop_product .prod-info {order: 3;}
    
}


.shop_product > .details > .name {color: var(--black); text-align: left; font-size: 28px; line-height: 30px; margin-bottom: 30px;}

.shop_product .code-details {margin: 0 0 20px 0; color: var(--gray); margin: 10px 0;}
.shop_product .prod-info {margin: 50px 0; }
.shop_product .prod-info h2  {text-align: left;}

.shop_product .incvat {font-size: 130%; color: var(--black); padding-bottom: 5px; font-weight: bold;}
/*.shop_product .incvat {color: var(--text); padding-bottom: 20px;} */

.shop_product .quantity .label {font-size: 14px;margin-bottom: 10px;}
.shop_product .quantity-inner {display: flex; gap: 20px; align-items: center;}
.shop_product .quantity-inner .value input[type="number"] {width: 60px; border-radius: 12px; height: 38px;  text-align: center; font-size: 16px; background-color: var(--white);}
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { opacity: 1; display: block; }
.shop_product .addtobasket button { cursor: pointer;  background-color: var(--black); color: var(--white); border: none; border-radius: 12px; height: 38px; padding: 0 16px; font-family: "DMSans", sans-serif; font-size: 14px; }
.shop_product .addtobasket button i {font-size: 18px; margin-right: 6px;}

.shop_product .description {padding-bottom: 30px;}

/* .shop_product .image {max-width: 500px; width: 100%; max-height: 500px; height: 100%; background-size: cover; border-radius: 16px;} */

.shop_product .image { max-width: 500px; width: 100%; max-height: 500px; height: 100%; background-size: contain; background-color: var(--white); border-radius: 16px; float: left; padding: 0px; text-align: center; vertical-align: middle; line-height: 0px; width: 600px; height: 400px; width: 50%;}
.shop_product .image img {display: none;}
.shop_product > .product_images {float: left;}
.shop_product > .product_images .feat_carousel { max-width: 500px; width: 100%; background-color: unset; padding: 0px;}
.shop_product > .product_images .feat_carousel .carousel {overflow: hidden; position: relative; margin: 0px auto 0px auto; padding: 0px 0px 0px 0px;}
.shop_product > .product_images .feat_carousel .carousel>ul { width: 20000em; position: relative;}
.shop_product > .product_images .feat_carousel .carousel>ul>li {float: left;text-align: center;height: 500px; background-color: var(--background); display: flex;justify-content: center;align-items: center;max-width:500px;width: 100%; border-radius: 16px;}
.shop_product > .product_images .feat_carousel > .carousel > ul > li > img {max-width: 500px; width: auto; height: auto; max-height: 500px;  display:block; border-radius: 16px; }

.shop_product > .product_images .thumbnails { max-width: 500px; width: 100%; display: inline-block; margin-top: 20px; }
.shop_product > .product_images .thumbnails ul {display:grid; grid-template-columns:repeat(4, 1fr); gap: 10px;}
.shop_product >.product_images .thumbnails ul li { width:100%; box-sizing:border-box; display:flex; flex-direction:column; justify-content: center; align-items: center; background-color: var(--white); border-radius: 12px;}
.shop_product > .product_images .thumbnails ul li img { width: auto; max-width: 100%; height: auto; max-height: 100%; border-radius: 12px;}

@media (max-width:425px) { .shop_product .product_images .thumbnails ul { grid-template-columns:repeat(3, 1fr); } }


@media (max-width: 768px) {
   .shop_product .image {display: none;}
    .shop_product  {display: flex; flex-direction: column;}
    .shop_product .product_images {padding-right: 0; margin: 0 auto 50px auto;} 
    .shop_product .details {width: 100%; margin-bottom: 30px; }
    .shop_product .product_images {width: 100%; display: flex; flex-direction: column; align-items: center; margin-bottom: 0px;}
    
}

@media (max-width: 500px) {
    .shop_product .product_images .feat_carousel { max-width: 90vw; height: auto; }
    .shop_product .product_images .feat_carousel .carousel ul li {width: 100%; max-width: 90vw; }
    .shop_product .product_images .feat_carousel .carousel ul li img  { max-width: 90vw; width: 100%;  }
    .shop_product .product_images .thumbnails {max-width: 900px;}
    .shop_product .product_images .thumbnails ul { flex-wrap:wrap; justify-content: flex-start;}
}


.outofstock {font-size: 14px; background-color: var(--red); display: inline-block; padding: 1px 8px; color: var(--white);}
.available {font-size: 14px; background-color: var(--green); display: inline-block; padding: 1px 8px; color: var(--white);}


.prod-info {background-color: var(--white); padding: 20px;}
.prod-info > .util_expandtext {border-bottom: 1px solid var(--gray);  }
.prod-info > .util_expandtext.open {padding-bottom: 20px;}
.prod-info > .util_expandtext > .link {display: flex; align-items: center; min-height: 50px;}
.prod-info > .util_expandtext > .link a {font-family: TitilliumBold; font-style: italic; font-size: 20px; color: var(--black); padding-left: 10px;}
.prod-info .text {color: var(--gray);}

.prod-info #expandtext-additional-text table {width:100%;border-collapse:collapse;margin-top:10px;font-family:Arial,sans-serif;font-size:14px;}
.prod-info #expandtext-additional-text th {width:150px;padding:8px;text-align:left;font-weight:bold;background-color:#f9f9f9;}
.prod-info #expandtext-additional-text td {padding:8px;}
.prod-info #expandtext-additional-text tr:nth-child(even) {background-color:#f2f2f2;}
.prod-info #expandtext-additional-text table, .prod-info #expandtext-additional-text th, .prod-info #expandtext-additional-text td {border:1px solid #ddd;border-spacing:0;}


/***** BASKET PAGE ****************************************************/
/*************************************************************************/

.shop_basketpage {padding: 30px 10px 50px 10px; min-height: 70vh; max-width: 1200px; margin: 0 auto;}
.shop_basketpage table {width: 100%;padding: 20px 0px;margin-bottom: 20px;font-size: 120%;}
.shop_basketpage th, .shop_basket th {padding: 5px;}
.shop_basketpage .price, .shop_basket .price, .shop_basketpage .quantity, .shop_basket .quantity, .shop_basketpage .total, .shop_basket .total {text-align: end;}
.shop_basketpage td, .shop_basket td {padding: 5px; vertical-align: middle; font-size: 14px;}
.shop_basketpage .message, .shop_basket .message {font-weight: bold; padding: 0 0 20px 5px; color: var(--red);}
.shop_basket .buttons {display: flex; gap: 20px; flex-wrap: wrap; }
.shop_basket .buttons .continueshopping { display: flex; align-items: center; padding: 8px 20px; color: var(--white); }
.shop_basket .buttons .button, .shop_basket .buttons input {margin: 0;}

.shop_basket .headingrow {background-color: var(--black); color: var(--white); font-size: 16px;}
.shop_basket .itemrow:nth-child(odd) {background-color: #e3e0e0;}
.shop_basket .totaltotalrow th, .shop_basket .paymenttotalrow th { border-top: 1px solid var(--gray); border-bottom: 1px solid var(--gray);}
.shop_basket .remove a {font-size: 100%; color: var(--orange);}
.shop_basket .quantity input {color: var(--black);}
/* .shop_basket .paymenttotalrow {background-color: var(--white);} */

.shop_basket .discount  {display: none;}
.shop_basket .quantity .fa-exclamation-triangle {display: none;}
.shop_basket .updatebasket, .shop_basket .continueshopping {background-color: var(--black); border-radius: 12px;}
.shop_basket input[type="submit"].checkout {background-color: var(--orange); border: none; border-radius: 12px;}

@media (max-width: 768px) {
   .shop_basket .itemrow:nth-child(odd) {background-color: var(--white);}
   .shop_basket table .headingrow { display: none; }
   .shop_basket table .itemrow { display: flex; flex-direction: column; border: 1px solid #e5e5e5; padding: 0 16px; margin-bottom: 16px; background: #fff; }
   .shop_basket table .itemrow td { display: flex; justify-content: start; align-items: center; padding: 6px 0; border: none; }
   .shop_basket table .itemrow td.name { order: 1; font-weight: 700; font-size: 16px; color: #111; }
   .shop_basket table .itemrow td.code { order: 2; font-size: 13px; color: #888; padding: 0 0 10px 0;}
   .shop_basket table .itemrow td.code::before { display: none; }
   .shop_basket table .itemrow td.price { order: 3; font-size: 14px; font-weight: 600; }
   .shop_basket table .itemrow td.quantity { order: 4; font-size: 14px; }
   .shop_basket table .itemrow td.quantity::before { content: "Quantity";  margin-right: 10px; }
   .shop_basket table .itemrow td.total { order: 5; justify-content: space-between; font-weight: 700; font-size: 16px;  border-top: 1px solid #eee; margin-top: 8px; padding-top: 10px; padding-bottom: 0;}
   .shop_basket table .itemrow td.remove { order: 6; justify-content: flex-end; margin-bottom: 6px;}
   .shop_basket table .itemrow td.remove::before { display: none; }
   .shop_basket table .itemrow td.remove a { font-size: 13px; color: #999; text-decoration: underline; }
   .shop_basket table .totaltotalrow, .shop_basket table .paymenttotalrow { display: flex; justify-content: space-between; align-items: center; border-top: 1px solid #111; border-bottom: 1px solid #111; }   .shop_basket table .totaltotalrow th { display: none; }
   .shop_basket table .totaltotalrow th[colspan="5"] { display: block; font-size: 18px; font-weight: 600; }
   .shop_basket table .totaltotalrow .totaltotal { display: block; font-size: 18px; font-weight: 700; padding: 16px 0; }
   .shop_basket .totaltotalrow th, .shop_basket .paymenttotalrow th {border: none;}
   .shop_basket table { width: 100%; }
   .shop_basket table tbody { display: block; width: 100%; }
   .shop_basket table .itemrow { width: 100%; box-sizing: border-box; }
}

.shop_basketpage .details,.shop_basketpage .payment {padding-left: 30px;}
.shop_basketpage .details div, .shop_basketpage .payment div  {margin-bottom: 20px;}
.shop_basketpage .details h2, .shop_basketpage .payment h2 { text-align: left; font-size: 130%; margin-bottom: 5px;}
.shop_basketpage > h1 {text-align: center;}

.checkout {margin: 0 auto; max-width: 500px; width: 100%; background-color: var(--black); padding: 15px 30px 30px 30px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2); border-radius: 10px;}
.include .checkout > h2 {color: var(--white);}
#basketmodeform{ margin-top: 20px;}
#basketmodeform, #basketloginform {color: var(--white);}
#basketloginform {margin-top: 20px;}
#basketloginform fieldset .formbuilder .label{margin-bottom: 3px;}
#basketloginform fieldset .formbuilder .input input { background-color: var(--white); width: 100%; border-radius: 12px; height: 40px;}
#basketloginform fieldset .formbuilder #fb-membemail-div {margin-bottom: 12px;}

#basketloginform .buttons {margin-top: 20px;}
#basketloginform .buttons a, #basketloginform .buttons button[type="submit"] { background-color: var(--orange); padding: 6px 16px; border-radius: 12px; color: var(--white); border: none; font-family: "DMSans", sans-serif; font-weight: 100;  }
#basketloginform .buttons button[type="submit"] { font-family: "DMSans", sans-serif; font-weight: 400; font-size: 14px;}

#basketcheckoutform label, #basketcheckoutform .help-block{color: var(--white); }
#basketcheckoutform .help-block{color: var(--white); font-size: 14px; margin-bottom: 20px;}
.form-group.field_section:has(.label > label:only-child) {
  display: none;
}
#fb-Notes-div {display: none;}
#basketcheckoutform fieldset .label{color: var(--white); margin-bottom: 3px;}


/***** ACCOUNT ****************************************************/
/*************************************************************************/

.registration .titletxt {text-align: center; margin-bottom: 20px; font-size: 32px; font-style: italic;}
.account, .registration { padding-bottom: 50px;}
.account .pagetitle, .registration .memb_account h3  {text-align: center;}


.sign-in.memb_loginbox, .registration .memb_account { background-color: var(--black); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2); max-width: 400px; margin: 0 auto; border-radius: 10px; border: 2px solid var(--darkblue);}
.sign-in.memb_loginbox fieldset, .registration .memb_account {padding: 30px;}
.sign-in.memb_loginbox .loggedout .titletxt, .registration .memb_account h3  {color: var(--white); font-family: TitilliumBold; font-size: 28px; font-style: italic; line-height: 32px; margin-bottom: 20px;}
.sign-in.memb_loginbox .fieldemail, .sign-in.memb_loginbox .fieldpw {display: flex; flex-direction: column; gap: 6px; }
.sign-in.memb_loginbox .fieldemail, .registration .memb_account .label {margin-bottom: 16px;}
.sign-in.memb_loginbox .stayloggedin {display: flex; margin: 16px 0 0 0; color: var(--white); font-size: 14px;}

.sign-in.memb_loginbox .fieldemail input, .sign-in.memb_loginbox .fieldpw input, .registration .memb_account input  {background-color: var(--white); width: 100%; border-radius: 12px; height: 40px;}

.sign-in.memb_loginbox .fieldemail label, .sign-in.memb_loginbox .fieldpw label, .registration .memb_account .label  {color: var(--white);}
.sign-in.memb_loginbox .login{margin-top: 20px;}
.sign-in.memb_loginbox .login input[type="submit"], .registration .memb_account input[type="submit"] {background-color: var(--orange); border: none; border-radius: 12px; width: 100%; font-size: 16px;}
.sign-in.memb_loginbox .fieldemail input:focus, .sign-in.memb_loginbox .fieldpw input:focus {border: 2px solid var(--orange); outline: none;}
.sign-in.memb_loginbox .forgotpw, .sign-in.memb_loginbox .register {display: block;}
.sign-in.memb_loginbox .forgotpw {margin: 30px 0 10px 0;}

.registration .pagetitle {text-align: center;}
.registration .memb_account .buttons {margin-top: 30px;}
.registration .memb_account p {color: var(--white);}
.registration .memb_account .btn-orange a {background-color: var(--orange); display: inline-block; width: 100%; color: var(--white); font-size: 16px; text-align: center; padding: 10px 5px; border-radius: 12px; margin-top: 10px;}

.registration .memb_account:has(.form_register) { max-width: 500px; width: 100%;}
.registration .memb_account:has(.form_register) select, .registration .memb_account:has(.form_register) textarea{ max-width: 500px; width: 100%; }
.registration .label {margin-top: 10px; margin-bottom: 6px !important;}

.field input:focus, select input:focus { outline:none; }

.registration .memb_account, .register .memb_account, .registration .memb_account *, .register .memb_account * { box-sizing: border-box;}
.registration .memb_account input, .registration .memb_account select, .registration .memb_account textarea, .register .memb_account input, .register .memb_account select, .register .memb_account textarea { width: 100%; max-width: 100%;}
.registration .memb_account select, .register .memb_account select { height: 40px; border-radius: 12px; background-color: var(--white);}
.registration .memb_account fieldset, .register .memb_account fieldset { min-width: 0; width: 100%;}
.registration .memb_account .formbuilder, .register .memb_account .formbuilder { width: 100%; min-width: 0;}
.registration .memb_account .field, .register .memb_account .field { width: 100%; min-width: 0;}
.registration .memb_account .input, .register .memb_account .input { width: 100%; min-width: 0;}

@media (max-width: 520px) {
   .registration {padding: 0 10px 50px 10px;}
   .registration .memb_account {padding: 30px 10px;}
   .account {padding: 0 10px 50px 10px;}
   .sign-in fieldset{padding: 30px 10px !important; }
}



.register .memb_account { background-color: var(--black); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2); max-width: 500px; margin: 0 auto; border-radius: 10px; border: 2px solid var(--darkblue);}
.register .errors {margin-bottom: 16px;}
.register .memb_account fieldset {padding-top: 0;}

.profile-info { max-width: 600px; margin: 30px auto; padding: 20px; background: #ffffff; border: 1px solid #e5e5e5; border-radius: 10px; box-shadow: 0 4px 12px rgba(0,0,0,0.05); font-family: Arial, sans-serif; }
.profile-info .field { display: grid; grid-template-columns: 180px 1fr; gap: 10px; padding: 12px 0; border-bottom: 1px solid #f0f0f0; }
.profile-info .field:last-child { border-bottom: none; }
.profile-info .label { font-size: 13px; color: #777; text-transform: uppercase; letter-spacing: 0.5px; }
.profile-info .value { font-size: 15px; color: #222; font-weight: 500; }
.profile-info .value:empty::after { content: "Not provided"; color: #bbb; font-style: italic; }

@media (max-width: 600px) {
  .profile-info .field { grid-template-columns: 1fr; }
  .profile-info .label { margin-bottom: 4px; }
}


.change-details, .btn-black {max-width: 300px; width: 100%; margin: 0 auto; display: flex; flex-direction: column; gap: 20px;}
.change-details .btn-orange_account {background-color: var(--orange); display: flex; align-items: center; justify-content: center; padding: 8px 5px; border-radius: 12px; }
.change-details .btn-orange_account a, .btn-black a {color: var(--white);}
.btn-black {background-color: var(--black); display: flex; align-items: center; justify-content: center; padding: 8px 5px; border-radius: 12px;  margin-top: 20px;}




/***** BASKET ****************************************************/
/*************************************************************************/


.shop_basket .checkout h2 {max-width: 500px; width: 100%; margin: 0 auto;}
#basketcheckoutform {max-width: 500px; width: 100%; margin: 0 auto;}
#basketcheckoutform input, #basketcheckoutform textarea, #basketcheckoutform select {max-width: 500px; width: 100%; background-color: var(--white); border-radius: 6px; min-height: 40px;}
#basketcheckoutform textarea, #basketcheckoutform select {border: 1px solid rgb(203, 203, 203);}
#basket_backbutton {border: 2px solid var(--white) !important;}
#basketcheckoutform input[type="checkbox"] {height: 15px; width: 15px; min-height: 15px; display: flex; margin-left: 10px;}

#basketcheckoutform .formbuilder #fb-ContactGroup-div > .label, #basketcheckoutform .formbuilder #fb-BillGroup-div > .label, #basketcheckoutform .formbuilder #fb-ContactGroup-div > .label, #basketcheckoutform .formbuilder #fb-ShipGroup-div > .label  { border-bottom: 2px solid var(--black); color: var(--black); margin-top: 30px; margin-bottom: 10px; text-transform: uppercase; font-family: TitilliumBold; font-size: 18px;}
#basketcheckoutform .field_text {margin: 10px 0;} 
#basketcheckoutform #fb-Password-confirm-div {margin-top: 10px;}

#basket_backbutton {background-color: var(--black) !important; border: transparent; border-radius: 12px; margin-top: 20px;}
#basket_continuebutton {background-color: var(--orange) !important; border: transparent; border-radius: 12px;}

#fb-ShipUseBilling-div {display: flex; align-items: center; }
#fb-ShipGroup-div > .input {margin-bottom: 30px;}
.checkout .errors {max-width: 500px; width: 100%; margin: 0 auto; margin-top: 20px; color: rgb(254, 80, 80);}


.confirm .details { display: flex; gap: 40px; margin-top: 30px; }
.confirm .details h2 { font-size: 14px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 12px; color: #888; }
.confirm .details { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 30px; }
.confirm .details > div { background: var(--white);  padding: 18px 20px; font-size: 14px; line-height: 1.6; color: #333; }
.confirm .details h2 { font-size: 15px; font-weight: 600; margin-bottom: 10px; color: #111; }
.confirm .details .contact, .confirm .details .billing, .confirm .details .shipping  { background: var(--white); }
.confirm .details br { display: block; margin-bottom: 4px; content: ""; }

@media (max-width: 768px) {
.confirm h2 {text-align: center;}
  .confirm .details { grid-template-columns: 1fr; }
  .confirm .details {padding-left: 0;}
}

.shop_basket .payment {padding-left: 0;}
.shop_basket .buttons .back {background-color: var(--black); border: transparent; border-radius: 12px;}
.shop_basket .buttons input[type="submit"] {background-color: var(--orange); border: transparent; border-radius: 12px; display: inline-block; width: auto;}

@media (max-width: 750px) {
   .buttons:has(#basket_backbutton) { max-width: 750px;}
}

@media(max-width: 649px) {
   .shop_basket .details {flex-direction: column; gap: 0;}

}

@media(max-width: 425px) {
   .checkout {padding: 15px 10px 30px 10px;}
}


/***** CONTACT US ****************************************************/
/*************************************************************************/

.contact-us { max-width: 700px; margin: 40px auto 0 auto; padding: 0 20px 50px 20px; }
.contact-us form { background: #fff; border: 1px solid #e6e6e6; border-radius: 18px; padding: 32px; box-shadow: 0 8px 24px rgba(0,0,0,0.06); }
.contact-us .titletxt { font-size: 40px; font-weight: 700; margin-bottom: 12px; color: #111; font-family: TitilliumBold; font-style: italic; }
.contact-us .intro { font-size: 16px; line-height: 1.6; color: #555; margin-bottom: 28px; }
.contact-us .intro p { margin: 0; }
.contact-us .formbuilder { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.contact-us .field_area { grid-column: 1 / -1; }
.contact-us .label { margin-bottom: 8px; }
.contact-us label { display: block; font-size: 14px; font-weight: 600; color: #222; }
.contact-us .required { color: #d64545; }
.contact-us .input input,
.contact-us .input textarea { width: 100%; box-sizing: border-box; border: 1px solid #d8d8d8; border-radius: 10px; padding: 13px 14px; font-size: 14px;  background: #fafafa; color: #222; transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease; }
.contact-us textarea { min-height: 150px; resize: vertical; }
.contact-us .spacer { display: none; }
.contact-us .buttons { margin-top: 24px; }
.contact-us .button { width: 100%; border: 0; border-radius: 999px; padding: 15px 24px; background: #111; color: #fff; font-size: 16px; font-weight: 700; cursor: pointer; transition: background 0.2s ease, transform 0.2s ease; }
.contact-us .confirm { background: #f0f8f3; border: 1px solid #cfe8d8; border-radius: 14px; padding: 24px; color: #245c38; font-size: 16px; line-height: 1.6; }
.contact-us .confirm p { margin: 0; }

@media (max-width: 700px) {
  .contact-us form { padding: 24px; }
  .contact-us .formbuilder { grid-template-columns: 1fr; }
  .contact-us .titletxt { font-size: 26px; }
}