/*!
Theme Name: Arcade Direct
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: arcade-direct
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Arcade Direct is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/


/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
	-webkit-text-size-adjust: 100%;
}
:root {
    --brand-navy-deep: #081224;
    --brand-navy:      #222f45;
    --brand-teal:      #35BB9D;
    --brand-grey-soft: #d3e3e3;
    --brand-red:       #dd3333;
}

/*fonts
*/

/* inter-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  src: url('../woff2/inter-v18-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  src: url('../woff2/inter-v18-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  src: url('../woff2/inter-v18-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


/* Sections
	 ========================================================================== */

/**
 * Remove the margin in all browsers.
 */
body {
	margin: 0;
	background: #fff;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
	display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
	font-size: 2rem;
	line-height: 2.5rem;
	margin: 0.67em 0;
}

/* Grouping content
	 ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
	box-sizing: content-box;
	height: 0;
	overflow: visible;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
	font-family: 'Inter', sans-serif;
	font-size: 1rem;
	border: none!important;
}

/* Text-level semantics
	 ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */
a {
	background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	text-decoration: underline dotted;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
	font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1rem;
}

/**
 * Add the correct font size in all browsers.
 */
small {
	font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}

/* Embedded content
	 ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */
img {
	border-style: none;
}

/* Forms
	 ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0;
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
	overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
	text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
.button,
[type="button"],
[type="reset"],
[type="submit"] {
	-webkit-appearance: button;
	display: inline-block;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
	border-style: none;
	padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
	padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *		`fieldset` elements in all browsers.
 */
legend {
	box-sizing: border-box;
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
	vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
	overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
}

.dgwt-wcas-sf-wrapp input[type=search].dgwt-wcas-search-input {
	border: none;
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;
}

/* Interactive
	 ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
	display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
	display: list-item;
}

/* Misc
	 ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */
template {
	display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
	display: none;
}

/* Box sizing
--------------------------------------------- */

/* Inherit box-sizing to more easily change it's value on a component level.
@link http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
*,
*::before,
*::after {
	box-sizing: inherit;
}

html {
	box-sizing: border-box;
}

/*--------------------------------------------------------------
# Base
--------------------------------------------------------------*/

/* Typography
--------------------------------------------- */
body,
button,
input,
select,
optgroup,
textarea {
	color: #081224;
	font-family: 'Inter', sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 1rem;
	line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
	font-weight: 600;
}


span.title {
	font-size: 1.5rem;
	font-weight: 600;
	display: block;
}

strong {
	font-weight: 600;
}

p {
	margin-bottom: 1.5em;
}

dfn,
cite,
em,
i {
	font-style: italic;
}

blockquote {
	margin: 0 1.5em;
}

address {
	margin: 0 0 1.5em;
}

pre {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin-bottom: 24px;
	max-width: 100%;
	overflow: auto;
	white-space: normal!important;
	white-space: pre-wrap;
	word-wrap: break-word;
}

code,
kbd,
tt,
var {
	font-family: 'Inter', sans-serif;
}

abbr,
acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

mark,
ins {
	background: #fff9c0;
	text-decoration: none;
}

big {
	font-size: 125%;
}





/* Elements
--------------------------------------------- */

hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin-bottom: 1.5em;
}


ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

ol li {
	margin-bottom: 8px;
}

li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 1.5em;
}

dt {
	font-weight: 600;
}

dd {
	margin: 0 1.5em 1.5em;
}




#secondary {
	flex: 0 0 25%;
	margin-left: 2rem;
	margin-top: 1rem;
}

#secondary ul {
	padding: 0;
	margin: 0;
}

#secondary ul li {
	list-style: none;
	margin-bottom: 5px;
} 

#secondary ul li a:hover {
	text-decoration: underline;
}

/*.faq-wrapper {
	padding: 1rem!important;
    border: 5px solid #35BB9D;
}
*/
.widget-title,
.gform_title,
.faq-wrapper .question {
	padding: 0.5rem!important;
    border-top: 5px solid #35BB9D!important;
    background: #e2f9f4!important;
}

.author_details {
	display: flex;
    background: #e2f9f4;
    padding: 1rem;
    align-items: center;
    margin: 1rem 0;
    border-top: 5px solid #35bb9d!important;
}

.author_details .image {
	border-radius: 100%;
    overflow: hidden;
    max-width: 150px;
}

.author_name {
	font-weight: 600;
}

.author_bio_section p {
	margin: 0;
}

.author_details img {
	padding: 15px;
    border-radius: 100%;
}

.author_details .links {
	display: flex;
	align-items: center;
}

.author_details a {
	margin-right: 10px;
}

.author_details .links a {
	display: flex;
}

.single-post h1 {
	margin-bottom: 1rem;
}

.single-post .entry-meta {
	margin-bottom: 1rem;
}

.center {
	text-align: center;
}

.absolute {
	position: absolute;
}

.relative {
	position: relative;
}

.f-left {
	float: left;
}

.f-right {
	float: right;
}

.screen-reader-only, .wt-screen-reader-only {
	border: 0; 
   	clip: rect(0 0 0 0);
   	height: 1px; 
   	margin: -1px;
    overflow: hidden; 
    padding: 0;
    position: absolute;
    width: 1px; 
}

.productgrid.small .inner, .productgrid.four {
	padding: 0;
}

.productgrid.four .col {
	list-style: none;
}


#primary-menu {
	display: flex;
    align-items: center;
    position: relative;
}


#breadcrumbs {
	font-size: 13px;
}

.accordion {
    margin-left: 0;
    background: #fefefe;
    list-style-type: none;
    padding: 0;
}
.accordion[disabled] .accordion-title {
    cursor: not-allowed;
}
.accordion-item:first-child > :first-child {
    border-radius: 0;
}
.accordion-item:last-child > :last-child {
    border-radius: 0;
}
.accordion-title {
    position: relative;
    display: block;
    padding: 0.75rem;
    border: 1px solid #e6e6e6;
    border-bottom: 0;
        font-size: 1rem;
    margin: 0;
}
:last-child:not(.is-active) > .accordion-title {
    border-bottom: 1px solid #e6e6e6;
    border-radius: 0;
}
.accordion-title:focus,
.accordion-title:hover {
    background-color: #e6e6e6;
}
.accordion-title:before {
    position: absolute;
    top: 50%;
    right: 1rem;
    margin-top: -0.5rem;
    content: "+";
}
.is-active > .accordion-title:before {
    content: "\2013";
}
.accordion-content {
    display: none;
    padding: 1rem;
    border: 1px solid #e6e6e6;
    border-bottom: 0;
    background-color: #fefefe;
    color: #0a0a0a;
}
:last-child > .accordion-content:last-child {
    border-bottom: 1px solid #e6e6e6;
}
.accordion-menu li {
    width: 100%;
}
.accordion-menu a {
    padding: 0.7rem 1rem;
}
.accordion-menu .is-accordion-submenu a {
    padding: 0.7rem 1rem;
}
.accordion-menu .nested.is-accordion-submenu {
    margin-right: 0;
    margin-left: 1rem;
}
.accordion-menu.align-right .nested.is-accordion-submenu {
    margin-right: 1rem;
    margin-left: 0;
}
.accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle) > a {
    position: relative;
}
.accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle) > a:after {
    display: block;
    width: 0;
    height: 0;
    border: inset 6px;
    content: "";
    border-bottom-width: 0;
    border-top-style: solid;
    border-color: #1779ba transparent transparent;
    position: absolute;
    top: 50%;
    margin-top: -3px;
    right: 1rem;
}
.accordion-menu.align-left .is-accordion-submenu-parent > a:after {
    left: auto;
    right: 1rem;
}
.accordion-menu.align-right .is-accordion-submenu-parent > a:after {
    right: auto;
    left: 1rem;
}
.accordion-menu .is-accordion-submenu-parent[aria-expanded="true"] > a:after {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
}
.is-accordion-submenu-parent {
    position: relative;
}

.accordion-title:focus,
.accordion-title:hover {
    transition: color, background-color 0.3s linear;
    background-color: #35bb9d;
    color: #fff;
}
ul.accordion a,
ul.accordion .accordion-content {
    transition: color, background-color 0.3s linear;
    color: #191516;
}
ul.accordion .accordion-content a {
    color: #ff0035;
    transition: all 0.377s cubic-bezier(0.57, -0.06, 1, 1);
}
ul.accordion .accordion-content a:hover {
    color: #023590;
    transition: all 0.377s cubic-bezier(0.57, -0.06, 1, 1);
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

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


table {
    max-width: 100%;
    background-color: transparent;
    border-collapse: collapse;
    border-spacing: 0;
    margin: 0 0 1.5em;
	width: 100%;
}

/* Links
--------------------------------------------- */
a {
	color: inherit;
	text-decoration: none;
}

p a {
	text-decoration: underline;
}

a:visited {
	color: #26927a;
}

p a:visited {
	color: #26927a;
}

a:hover,
a:focus,
a:active {
	color: #26927a;
}

a:focus {
	outline: thin dotted;
}

a:hover,
a:active {
	outline: 0;
}

/* Forms
--------------------------------------------- */
.button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt {
	border: none!important;
	background: #D52929;
	color: #fff;
	line-height: 15px;
	text-decoration: none;
	padding: 15px 20px;
	cursor: pointer;
	text-align: center;
	font-size: 1rem!important;
	margin-top: 0!important;
	border-radius: 5px;
}

.button a:focus, .button a:active, .button a:visited, .button:visited {
	color: #fff;
}

.button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
.woocommerce button.button.alt:hover, 
.woocommerce input.button.alt:hover {
	color: #fff!important;
	background: #f03a3a!important;
}


.yith-ywraq-add-to-quote {
	margin-top: 0px!important;
}

form.cart .quantity .qty {
    font-size: 13px !important;
    padding: 10px!important;
}

.button.cta {
	background: #D52929;
    display: block;
    color: #fff;
    border: none;
    padding: 15px;
    text-align: center;
}


body .woocommerce ul.products li.product, .woocommerce-page ul.products li.product,
body .productgrid.four .col {
	box-shadow: rgb(99 99 99 / 20%) 0px 2px 8px 0px;
	padding: 1rem;
	text-align: center;
}

.woocommerce ul.products li.product .button,
.woocommerce .add-request-quote-button.button {
	display: block;
	padding: 12px 15px !important;
    display: block;
    width: 100%;
    font-size: 13px !important;
    text-transform: uppercase;
}


button:active,
button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus {
	border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #666;
	border: 1px solid #ccc;
	border-radius: 3px;
	padding: 10px;
	box-shadow: none!important;
}

.accountdetails input[type="text"],
.accountdetails input[type="password"] {
	width: 100%;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: #111;
}

select {
	border: 1px solid #ccc;
	padding: 10px;
}

textarea {
	width: 100%;
}

/*critial css
*/
.wrap,
#primary {
	margin: 0 auto;
	max-width: 1200px;
	padding: 0 20px;
	width: 100%
} 

.home #primary {
	max-width: 100%;
	padding: 0;
}

#masthead {
	background: #081224;
	color: #fff;
	font-size: 0.8rem;
}

#masthead a {
	color: #fff;
}

#topbar {
	background: #222f45;
	color: #fff;
}

#topbar .dflex {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 50px;
}

#topbar .dflex .col {
	display: flex;
	align-items: center;
	font-size: 0.8rem;
}

#topbar a {
	color: #35BB9D;
	margin-left: 5px;
}

#topbar svg {
	fill: #35BB9D;
}

.header.wrap {
	display: flex;align-items: center;justify-content: space-between;flex-wrap: wrap;padding-top: 10px;
}

#masthead .header.wrap a:hover {
	color: #35BB9D;
}

.naigationwrapper {
	flex: 0 0 30%;
}

.header .links {
	text-align: right;
}

.header .links .my-quote {
	margin: 0 10px;
}

.dflex {
	display: flex;
}



/* Navigation
--------------------------------------------- */
#primary-menu {
	list-style: none;
	margin: 0;
	padding-left: 0;
}

#primary-menu ul {
	padding-left: 0;
	margin: 0;
}

#primary-menu li {
	list-style: none;
}

#primary-menu > li > a {
	padding: 10px;
	display: block;
	font-size: 0.9rem;
}

#primary-menu > li.red > a {
	color: #ff5278;
}

#primary-menu > li.red > a:hover {
	color: #ff7191!important;
}

#primary-menu > li.gold > a {
	color: #fdb64a;
}

#primary-menu > li.gold > a:hover {
	color: #fdb64a!important;
}

#primary-menu > li > ul {
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
	float: left;
	background: #35bb9d;
	padding: 0;
	list-style: none;
	margin: 0;
	visibility: hidden;
	position: absolute;
	z-index: 99999;
}

#primary-menu > li.menu-item-has-children > ul > li {
	width: 300px;
}

#primary-menu > li.menu-item-has-children > ul > li a {
	padding: 0.5rem;
	border-bottom: 1px solid #1ea385;
}

#primary-menu > li.menu-item-has-children > ul > li > ul {
	position: absolute;
	visibility: hidden;
    left: 300px;
    top: 0;
}

#primary-menu > li:hover > ul,
#primary-menu > li.focus > ul {
	display: block;
}

#primary-menu > li:hover > a {
    color: #35BB9D;
}

#primary-menu > li.menu-item-has-children > ul > li a:hover {
	color: #fff!important;
	background: #1ea385;
}

#primary-menu > li > ul > li:hover > ul,
#primary-menu > li > ul > li.focus > ul {
	display: block;
}

#primary-menu > li.menu-item-has-children:hover > ul,
#primary-menu > li.menu-item-has-children > ul > li:hover > ul {
    visibility: visible!important;
}

.main-navigation a {
	display: block;
	text-decoration: none;
}


/*.main-navigation > ul li:hover > ul,
.main-navigation > ul li.focus > ul {
	display: block;
}
*/
/*#primary-menu > li > ul > li {
	padding: 20px;
	flex: 0 0 25%;
}
*/
/*#primary-menu a:hover {
	text-decoration: underline;
}
*/

#pageheader {
	text-align: center;
	margin-bottom: 1rem;
}

.row {
	margin-left: -2rem;
	margin-right: -2rem;
}



.promobanner {
	position: relative;
}



.promobanner .title {
    color: #fff;
    font-weight: 600;
}


.label-new {
	background: #bb3598;
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	padding: 5px 10px;
	position: absolute;
	right: 15px;
    top: 15px;
}



.label-refurbished {
	background: #add;
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	padding: 5px 10px;
	position: absolute;
	right: 15px;
    top: 15px;
}


.usp {
	background: #fff5e5;
	padding: 1rem;
	font-size: 0.9rem;
}

.usp h3,
.usp p {
	margin: 0;
}


/* Posts and pages
--------------------------------------------- */

/*homepage*/
.hero {
	background-size: 100%;
	background-repeat: no-repeat;
    background-size: 100%;
    background-color: #081224;
    color: #fff;
}

.hero .dflex {
	display: flex;
	align-items: center;
}

.hero .dflex img {
    max-height: 350px;
    position: relative;
}

.hero h1 {
	margin: 0;
}

.review-stars {
	display: flex;
	align-items: center;
	margin: 1rem 0;
}

.review-stars svg {
	fill: #ffa50f!important;
	width: 100px;
	margin-right: 0.5rem;
}


.hero p {
	margin-top: 0;
	font-size: 1.2rem;
    font-weight: 600;
}

.featuredbanner {
	display: flex;
	margin-top: 1rem;
	background: #d3e3e3;
	align-items: center;
}

.hp-three-banners .featuredbanner a {
	display: block;
	width: 100%;
}


.featuredbanner.greybg {
	background: #F6F6F6;
}

.featuredbanner .content {
	color: #081224;
	width: 100%;
	text-align: center;
	padding: 2rem;
}

.featuredbanner h2,
.featuredbanner h3 {
	color: #156969;
	margin: 0;
}




.featuredbanner .content .dflex {
	justify-content: center;
}

.featuredbanner .image {
    width: 600px;
    height: 250px;
    background-size: 100%;
    background-position: center;
    max-width: 100%;
}

.featuredbanner.wide .image {
	height: 120px;
}

.woocommerce-MyAccount-navigation {
	background: #081224;
    color: #fff;
    padding: 1rem;
}

.ywraq-wrapper .gform_wrapper {
	border: 1px solid rgba(0,0,0,.1);
    padding: 1rem;
    margin: 0;
}

.ywraq-form-table-wrapper.wide {
	align-items: flex-start!important;
}

.gform_wrapper .top_label input.medium, .gform_wrapper .top_label select.medium {
	width: 100%!important;
}

.woocommerce-MyAccount-navigation a {
	color: #fff;
}


.featuredbanner .button {
	margin-top: 1rem;
}



.featuredmachines .content {
	background: url(../jpg/bg-squares.jpg);
    text-align: center;
    padding: 20px;
    padding-top: 150px;
    background-size: 100%;
    color: #fff;
}

.featuredmachines .content h2 {
	margin: 0;
}


.productslider .description p {
	margin: 0;
}

.productslider h3 {
    margin: 0;
    font-size: 1.5rem;
    color: #26927a;
}


.productslider.wc li h2 {
	font-size: 1rem;
	margin: 0;
	padding: 5px;
}

.productslider .col a:visited {
	color: #081224;
}

.productslider.wc li {
	text-align: center;
}

.productslider.wc .button {
	margin-top: 1rem!important;
	display: block;
}


.productgrid.small h3 {
	padding: 10px 20px;
    border: 1px solid #081224;
    margin: 0;
}

.productgrid.small .inner {
    border: 1px solid #081224;
     border-top: none;
}

.productgrid.small .inner .col {
	display: flex;
	padding: 10px;
}

.productgrid.small .inner .col .detail {
	width: 100%;
}

.productgrid.small .inner .col .detail .links a {
	margin-right: 1rem;
	display: inline-flex;
}

.productgrid.small .inner .col .detail .links a:hover {
	color: #d52929;
}

.productgrid.small .inner .col img {
	height: fit-content;
}

.gallery.dflex {
	display: flex;
	justify-content: space-between;
}

.updated:not(.published) {
	display: none;
}

.page-links {
	clear: both;
	margin: 0 0 1.5em;
}

.woocommerce .woocommerce-breadcrumb {
	margin-top: 15px;
}

.woocommerce div.product .product_title {
	margin-bottom: 0;
}

.summary .second_title,
.woocommerce ul.products li.product .price,
.productslider .price {
	margin: 0;
	margin-bottom: 1rem;
}

.woocommerce div.product p.price, 
.woocommerce div.product span.price,
.productslider span.price {
	color: #081224!important;
}

.woocommerce ul.products li.product .price,
.productslider span.price {
    color: #4b4b4b !important;
    font-size: 0.9rem;
    display: block;
}



/*Custom Layouts
*/


.flex-50 .content {
	background: #d3e3e3;
    color: #081224;
	padding: 20px;
}

	.flex-50 a {
		color: inherit;
	}

	.flex-50 img {
		margin-bottom: -8px;
	} 
/*
	.flex-50 .content ul {
		padding: 0;
	}
*/
	

	.flex-50 .content h2,
	.flex-50 .content h3 {
		margin-top: 0;
		color: #156969;
	}
		.flex-50 .content p {
			margin: 0;
		}

		.flex-50 .content .button {
			background: #D52929;
			color: #fff;
			margin-top: 1rem!important;
		}





.inspo-archive .item-post {
	position: relative;
}



.inspo-archive .item-post .overlay h2 {
	margin: 0;
	font-size: 1rem;
}





/* Accessibility
--------------------------------------------- */

/* Text meant only for screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 0.875rem;
	font-weight: 600;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

/* Do not show the outline on the skip link target. */
#primary[tabindex="-1"]:focus {
	outline: 0;
}


/*custom code from old fabzy theme*/
.cf {
    zoom: 1;
}
.cf:before, .cf:after {
    content: ".";
    display: block;
    height: 0;
    overflow: hidden;
}
.cf:after {
    clear: both;
}

#footer,
#footer a {
	color: #fff;
}
#mainfooter a {
	padding: 0.3rem 0;
	display: block;
}

#mainfooter {
	background: #0C182F;
}

#mainfooter .wrap {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	padding: 15px;
	font-size: 0.9rem;
}

#mainfooter ul {
	padding: 0;
	margin: 0;
}

#mainfooter ul li {
	list-style: none;
}

#mainfooter ul li a:hover {
	text-decoration: underline;
}

#footer i {
	color: #35BB9D;
	font-size: 2rem;
	padding: 0.5rem;
}

.footercol-title {
	font-weight: 600;
    color: #35BB9D;
    margin-bottom: 0.5rem;
    font-size: 1rem;
}

.footer-bottom {
	background: #050d1c;
	color: #fff;
	font-size: 0.8rem;
}

.footer-bottom .wrap {
display: flex;
	align-items: center;
	    justify-content: space-between;
}

.post-template-default #content .date,
.archive.category #content .date {
	font-weight: 600;
}

.post-template-default #content.date a,
.archive.category #content .date a  {
	color: #ff005c;
}

.sitemap-item {
	flex: 0 0 33.3%;
}


.woocommerce nav.woocommerce-pagination ul li a:focus, .woocommerce nav.woocommerce-pagination ul li a:hover, .woocommerce nav.woocommerce-pagination ul li span.current {
	background: #D52929;
	color: #fff;
}


.woocommerce div.product div.images .woocommerce-product-gallery__image:nth-child(n+2) img{
	width: auto!important;
    max-height: 100px;
    margin: auto;
    margin-top: 15px;
}



.woocommerce-product-details__short-description {
	margin-bottom: 1rem;
}



.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt.disabled,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt.disabled:hover {
	background-color: #D52929;
}


.embed-container { 
        position: relative; 
        padding-bottom: 56.25%;
        overflow: hidden;
        max-width: 100%;
        height: auto;
    } 

    .embed-container iframe,
    .embed-container object,
    .embed-container embed { 
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }



/*User Dash*/ 
/* ACCOUNT WHITESPACES */
.woocommerce form .form-row::after, .woocommerce form .form-row::before, .woocommerce-page form .form-row::after, .woocommerce-page form .form-row::before {
	display: none;
}

.woocommerce-MyAccount-navigation ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.type-product .summary p {
    margin-top: 8px;
}
div.product p.cart {
    float: left;
    margin: 0;
}

.multimachine-msg i {
	margin-right: 8px;
    color: #35BB9D;
    font-size: 1.1rem;
    position: relative;
    top: 4px;
}

.products.columns-4 .multimachine-msg i {
	float: left;
	font-size: 1.2rem;
	top: 0;
}


/*product page styles
*/
.product-info-boxes {
	clear: both;
}

.product-info-boxes .title {
	margin-bottom: 1rem;
	color: #156969;
}

.product-info-boxes ul {
	margin: 0;
	padding: 0;
}

.product-info-boxes ul li {
	list-style: none;
	margin-bottom: 10px;
	position: relative;
}


.delivery-table {
    margin-bottom: 15px;
}

.delivery-table table {
    border: 1px solid #ddd;
}

.delivery-table table tr {
    border-bottom: 1px solid #ddd;
}

.delivery-table table th {
    padding: 5px;
}

.delivery-table table th:nth-child(2n) {
    border-left: 1px solid #ddd;
}


.product_meta {
	margin-top: 1.5rem;
	font-size: 0.85rem;
}


.woocommerce-variation-price {
	margin-bottom: 1rem;
}


#primary.inspiration-section {
	padding: 2rem 20px;
}


#primary.inspiration-section h1 {
	margin-top: 0;
}




.grid-item img {
	padding: 2px;
	border-radius: 10px;
}







@media (min-width: 768px) and (max-width: 1023px) {
	#primary-menu>li>a {
		font-size: 0.8rem;
	}
	#topbar {
		font-size: 0.7rem;
	}
	.hero .dflex {
	    padding-left: 2rem;
	}

	.hero h1 {
		line-height: 2rem;
    	font-size: 2.5rem;
	}

	.promobanner .content {
	    padding: 4rem;
	  max-width: 400px;

	}

	.promobanner .title {
		line-height: 2.5rem;
	    font-size: 2.5rem;
	}
}

@media (min-width: 1024px) {
	.hero .dflex {
	    padding-left: 10rem;
	}

	.hero h1 {
		line-height: 3rem;
    	font-size: 2.5rem;
	}

	.featuredmachines {
		display: flex;
	}

	.featuredmachines .content {
		width: 400px;
	} 

	

	.promobanner .content {
	    padding: 7rem;
	     max-width: 600px;
	}

	.promobanner .title {
		line-height: 3.5rem;
	    font-size: 3.5rem;
	}

	.button,
	input[type="button"],
	input[type="reset"],
	input[type="submit"],
	.woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
	.woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt {
		min-width: 100px;
	}

}


@media (min-width: 768px) {


	  .mobile-show {
	    display: none;
	  }

	  .mobile-hide {
	    display: block;
	  }

	  .flexhalf {
	  	display: flex;
	  	align-items: center;
	  }

	  .inspo-archive .item-post .overlay {
	position: absolute;
    bottom: 0px;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.9);
}
		

	.single-post #primary,
	.blog #primary {
		display: flex;
	}

	.promobanner .content {
		position: absolute;
	    height: 100%;
	    top: 0;
	    display: flex;
	    right: 0;
	    align-items: center;
	    justify-content: center;
	    flex-direction: column;
	    text-align: center;
	}


	.dgwt-wcas-search-wrapp {
		max-width: 275px!important;
	}

	.hp-three-banners {
		display: flex;
	}

	.hp-three-banners .featuredbanner {
		flex-basis: 33.3%;
		flex-direction: column;
		margin: 1%;
	}

	.grid-sizer,
	.grid-item { width: 33.3%; }
	/* 2 columns */
	.grid-item--width2 { width: 50%; }

	.gallery.dflex {
		margin-top: 3rem;
	}

	.naigationwrapper {
		order: 4;
		flex: 0 0 100%!important;
		margin-top: 22px;
	}



	.header .links {
		order: 3;
	}

	.header .links i {
		font-weight: 400;
		margin-right: 5px;
	}

	.header .links .my-account {
		margin: 0 5px;
		font-size: 1.4rem;
	}

	.header .links .my-account svg {
		width: 18px!important;
	}

	.item-post {
		flex-basis: 33.3%;
	}

	.featuredbanner .image {
		width: 100%;
	}

	.flex-50 {
		display: flex;
		margin-bottom: 1rem;
	}

	.flex-50 .content,
	.flex-50 .col {
		flex-basis: 50%; 
		padding: 2rem;
	}
	.flex-50 .image {
		width: 50%; 
	}

	.testimonials,
	.inspo-archive .inner {
		display: flex;
		flex-wrap: wrap;
	}

	.testimonials .col {
		flex-basis: 33.3%;        
	}

	.inspo-archive .item-post {
		flex-basis: 50%;
		padding: 0.5rem;
	}

	.inspo-archive .item-post:hover {
		opacity: 0.9;
	}


	.ywraq-wrapper .gform_wrapper {
	    margin: 0;
		flex-basis: 52%;
	    margin-left: 2rem;
	}

	.hero .dflex img {
	    bottom: -60px;
	    min-width: 553px;
	}

	.logo {
		width: 100%;
		max-width: 250px;
	}

	.page-template-sitemap .wrap {
		display: flex;
		flex-wrap: wrap;
	}

	.page-template-sitemap .wrap .item {
		width: 33.3%;
	}

	.productgrid.small {
		width: 100%;
	}

	.productgrid.small .inner,
	.productgrid.four {
		display: flex;
		flex-wrap: wrap;
		padding: 0;
	}

	.productgrid.small .inner .col {
		flex-basis: 33.3%;
	}

	.productgrid.four .col {
		flex-basis: 23%;
		margin: 1%;
		list-style: none;
	}

	#mainfooter .wrap .col {
		flex-basis: 25%;
		padding: 1rem;
	}

	.product-info-boxes {
		display: flex;
	}

	.testimonials .col {
		display: flex;
	}

	.testimonials .col picture {
		flex-basis: 30%;
	}

	.testimonials .col .content{
		flex-basis: 70%;
	}



}


@media (max-width: 767.98px) {

	 .mobile-hide {
	    display: none;
	  }

	  .mobile-show {
	    display: block;
	  }

	h1 {
		font-size: 1.5rem!important;
		line-height: 1.5rem!important;
	}

	body.fixed {
		position: fixed;
		width: 100%;
	}

	.inspiration-template-default .woocommerce ul.products li.product {
		width: 100%;
	}

	.inspiration-template-default .woocommerce ul.products li.product:nth-child(2) {
		margin-right: 0;
	}

	.hero {
		margin-bottom: 2rem;
	}

	.promobanner img {
		margin-bottom: -8px;
	}

	.promobanner .content {
    	text-align: center;
	    padding: 2rem;
	    right: 0;
	    position: absolute;
	    top: 0;
	    height: 100%;
	}

	#footer {
		margin-top: 2rem;
	}

	#topbar {
		display: flex;
   		justify-content: space-between;
    	padding: 0.5rem;
    	flex-wrap: wrap;
	}

	#topbar a {
		color: #fff;
	}

	#topbar .review-stars {
		flex-basis: 100%;
    	width: 100%;
    	justify-content: center;
    	margin-bottom: 0;
	}

	.gallery.dflex {
		flex-wrap: wrap;
	}
	.gallery.dflex span {
		flex-basis: 33.3%;
	}


	.header.wrap {
		padding: 1rem;
		height: 112px;
	}

	.header .links {
		flex: 0 0 30%;
	}

	.logo {
		width: 100%;
		max-width: 65px;
	}

	.header .my-account {
		margin-left: 1rem;
	}

	#site-navigation {
		position: fixed;
		width: 100%;
	    top: 108px;
	    background: #081224;
	    left: 0;
	    height: 100%;
	    z-index: 1000;
	}

	#primary-menu,
	.featuredbanner {
		flex-direction: column;
	}

	.main-navigation a {
		padding: 15px;
	}

	.main-navigation li {
		border-bottom: 1px solid #101f3a;
	}

	#mainfooter,
	.footer-bottom,
	.card-submit-area {
		flex-direction: column;
	}

	.footer-bottom {
		text-align: center;
	}

	/* Reset
	 * ----------------------------- */
	#site-navigation ul,
	#site-navigation li {
	  margin: 0;
	  padding: 0;
	  list-style: none;
	}

	.inspo-archive .item-post .overlay {
    padding: 1rem;
    border-bottom: 1px solid #999;
    margin-bottom: 1rem;
}
	
	.is-open > .sub-menu:not(.slide-out) {
		overflow: auto;
		height: 100%;
	}

	/* Global styling
	* -------------------- */
	#mobile-menu li.dropdown> a:after {
	 	content: url('../png/chevrons-right.png');
	 	float: right;
	}

  	/* go back - auto-generated using JS */
  	.js-back {
	    padding: 10px 20px 10px 20px!important;
	    cursor: pointer;
	    font-weight: 600;
  	}

  	.js-back:before {
  		content: url('../png/square-arrow-left.png');
	 	margin-right: 10px;
  	}
	
	.menu-mobile-menu-container {
		height: 100%;
	}

	/* Level 1
	-------------------------------------- */
	#mobile-menu {
	  position: relative;
	 -webkit-transition: all 500ms ease;
	  -o-transition: all 500ms ease;
	  transition: all 500ms ease;
	  height: calc(100% - 120px);		
	}

	#mobile-menu li {
	  border-bottom: 1px solid #ddd;

	}

	/* Level 2
	-------------------------------------- */
	#mobile-menu ul {
	  display: none;
	  position: absolute;
	  top: 0;
	  bottom: 0;
	  left: 100%;
	  width: 100%;
	  -webkit-transition: all 500ms ease;
	  -o-transition: all 500ms ease;
	  transition: all 500ms ease;
	  border-top: 1px solid 1px solid #ddd;
	}

	/* show sub-level */
	.is-open > ul {
	  display: block!important;
	}

	/* Level 3
	-------------------------------------- */
	#mobile-menu ul ul {
	  -webkit-transition: all 500ms ease;
	  -o-transition: all 500ms ease;
	  transition: all 500ms ease;
	}

	/* Menu Effects
	-------------------------------------- */
	.transition {
	  -webkit-transition: all 500ms ease;
	  -o-transition: all 500ms ease;
	  transition: all 500ms ease;
	}

	.slide-out {
	  -webkit-transform: translate3d(-100%, 0, 0);
	  -ms-transform: translate3d(-100%, 0, 0);
	  -o-transform: translate3d(-100%, 0, 0);
	  transform: translate3d(-100%, 0, 0);
	}

	.sitemap-item {
		flex: 0 0 100%;
	}

	.hero .dflex {
		flex-direction: column;
		padding-top: 1rem;
    	text-align: center;
	}

	.hero .dflex img {
	    bottom: -33px;
	}

	.hero h1 {
		padding-top: 3rem;
	}

	.hero p {
		margin: 0;
	}

	.grid-sizer,
	.grid-item { width: 50%; }
	/* 2 columns */
	.grid-item--width2 { width: 100%; }

	.flex-50 .image {
		height: 200px;
	}


}


@media(max-width: 768px) {
    .woocommerce #content div.product div.images,
    .woocommerce #content div.product div.summary,
    .woocommerce div.product div.images,
    .woocommerce div.product div.summary,
    .woocommerce-page #content div.product div.images,
    .woocommerce-page #content div.product div.summary,
    .woocommerce-page div.product div.images,
    .woocommerce-page div.product div.summary {
        float: none;
        width: 100%;
    }

}

.ywraq-form-table-wrapper .gform_wrapper {
	display: block !important;
}

.fa-bars::before {
    content: "\f0c9";
}


/* =========================================
   MODERN SINGLE PRODUCT GALLERY
   ========================================= */

/* Wrapper */
.arcade-product-gallery-wrapper {
    position: relative;
    margin: 0 auto 2rem;
}

/* 2-column layout on tablet/desktop */
@media (min-width: 768px) {
    .arcade-product-gallery-wrapper {
        width: 48%;
        float: left;
    }

    /* Optional: Woo summary column */
    .single-product .product .summary {
        width: 48%;
        float: right;
    }
}

/* MAIN SLIDER FRAME */
.arcade-product-gallery-main {
    position: relative;
    border-radius: 18px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.08);
    overflow: hidden;
}

/* Image container – centred */
.arcade-product-gallery-main__media {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    background: radial-gradient(circle at top, #f9fafb 0, #f3f4f6 55%, #e5e7eb 100%);
}

.arcade-product-gallery-main__media img {
    display: block;
    width: 100%;
    height: auto;
    max-height: min(620px, 75vh);
    object-fit: contain;
    transition: transform 0.25s ease;
}

/* Hover zoom desktop */
@media (hover: hover) {
    .arcade-product-gallery-main__media:hover img {
        transform: scale(1.04);
    }
}

/* Click / tap zoom state */
.arcade-product-gallery-main__media.arcade-zoomed img {
    transform: scale(1.8);
    cursor: zoom-out;
}

@media (hover: hover) {
    .arcade-product-gallery-main__media.arcade-zoomed:hover img {
        transform: scale(1.8);
    }
}

/* NAV ARROWS – perfect circular overlay buttons */
.arcade-product-gallery-main button.arcade-gallery-nav {
    appearance: none;
    -webkit-appearance: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 20;
    padding: 0 !important;
    width: 48px !important;
    height: 48px !important;
    border-radius: 50% !important;
    border: none !important;
    background: rgba(15, 23, 42, 0.75) !important;
    color: #fff !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.arcade-gallery-nav--prev { left: 14px; }
.arcade-gallery-nav--next { right: 14px; }

.arcade-gallery-nav__icon {
    font-size: 18px;
    line-height: 1;
}

@media (hover: hover) {
    .arcade-product-gallery-main button.arcade-gallery-nav:hover {
        background: rgba(15, 23, 42, 0.95) !important;
        transform: translateY(-50%) scale(1.06);
    }
}

/* Hide arrows on very small screens – swipe instead */
@media (max-width: 640px) {
    .arcade-product-gallery-main button.arcade-gallery-nav {
        display: none !important;
    }
}

/* HIDE ARROWS & DOTS IF ONLY ONE IMAGE */
.arcade-product-gallery-wrapper[data-slide-count="1"] .arcade-gallery-nav,
.arcade-product-gallery-wrapper[data-slide-count="1"] .arcade-gallery-pagination {
    display: none !important;
}

/* PAGINATION DOTS */
.arcade-gallery-pagination {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 12px;
    text-align: center;
}

.arcade-gallery-pagination .swiper-pagination-bullet {
    width: 6px;
    height: 6px;
    background: rgba(255, 255, 255, 0.6);
    opacity: 1;
    margin: 0 3px !important;
}

.arcade-gallery-pagination .swiper-pagination-bullet-active {
    background: #ffffff;
}

/* THUMBNAILS STRIP */
.arcade-product-gallery-thumbs {
    margin-top: 1rem;
    padding: 4px 0;
}

/* Ensure Swiper track behaves horizontally */
.arcade-product-gallery-thumbs .swiper-wrapper {
    display: flex;
    align-items: stretch;
}

/* Let Swiper size slides automatically, scrollable row */
.arcade-product-gallery-thumbs .swiper-slide {
    width: auto !important;
    flex: 0 0 auto;
}

/* Thumbnail button */
.arcade-product-gallery-thumb__btn {
    border: 0;
    padding: 0;
    margin: 0;
    background: none;
    width: 100%;
    cursor: pointer;
}

/* Thumbnail card */
.arcade-product-gallery-thumb__media {
    display: block;
    position: relative;
    padding: 4px;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    background: #ffffff;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

/* Imagify-safe: target the img inside */
.arcade-product-gallery-thumb__media img {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    max-height: 120px;
    object-fit: contain;
    border-radius: 8px;
    opacity: 0.65;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

/* Active thumbnail */
.arcade-product-gallery-thumbs .swiper-slide-thumb-active .arcade-product-gallery-thumb__media {
    border-color: #35bb9d;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.12);
    transform: translateY(-2px);
}

.arcade-product-gallery-thumbs .swiper-slide-thumb-active .arcade-product-gallery-thumb__media img {
    opacity: 1;
    transform: scale(1.02);
}

/* Hover states */
@media (hover: hover) {
    .arcade-product-gallery-thumb__media:hover {
        border-color: #9ca3af;
    }

    .arcade-product-gallery-thumb__media:hover img {
        opacity: 0.9;
    }
}

/* Placeholder if no image */
.arcade-product-gallery-placeholder {
    border-radius: 18px;
    background: #f3f4f6;
    padding: 1.5rem;
}
.arcade-product-gallery-placeholder img {
    width: 100%;
    height: auto;
    display: block;
}

/* Product Swiper (homepage etc.) */
.product-swiper {
    position: relative;
    padding: 10px 0 30px;
}

/* Fix for Swiper slides inside .productslider being forced to full width */
.productslider .swiper-wrapper {
    display: flex !important;
    flex-wrap: nowrap !important;
    padding: 0;
}

.productslider .swiper-slide {
    flex: 0 0 auto !important;
    display: block !important;
}

.product-swiper .swiper-slide {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    box-shadow: 0 6px 16px rgba(0,0,0,0.06);
    overflow: hidden;
    transition: transform .2s ease;
}

.product-swiper .swiper-slide:hover {
    transform: translateY(-3px);
}

/* Navigation arrows for product swiper */
.product-swiper .swiper-button-next,
.product-swiper .swiper-button-prev {
    width: 36px;
    height: 36px;
    border-radius: 999px;
    background: rgba(15,23,42,0.75);
    color: #fff;
    box-shadow: 0 8px 20px rgba(15,23,42,0.45);
}

.product-swiper .swiper-button-next:after,
.product-swiper .swiper-button-prev:after {
    font-size: 18px;
}

@media (max-width: 640px) {
    .product-swiper .swiper-button-next,
    .product-swiper .swiper-button-prev {
        display: none;
    }
}




/* =========================================
   CLEAN UNDERLINE TABS – SINGLE PRODUCT
   ========================================= */

/* Reset the WooCommerce tab container */
.single-product .woocommerce-tabs {
    margin-top: 2.5rem;
}

/* Remove the default UL styling */
.single-product .woocommerce-tabs ul.tabs {
    border: none !important;
    margin: 0 0 1.5rem !important;
    padding: 0 !important;

    display: flex;
    gap: 2rem;

    list-style: none !important;
    background: transparent !important;
    position: relative;
}

/* Kill WooCommerce triangles + before/after garbage */
.single-product .woocommerce-tabs ul.tabs::before,
.single-product .woocommerce-tabs ul.tabs li::before,
.single-product .woocommerce-tabs ul.tabs li::after {
    display: none !important;
    content: none !important;
}

/* Remove Woo borders on LI */
.single-product .woocommerce-tabs ul.tabs li {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Tab links */
.single-product .woocommerce-tabs ul.tabs li a {
    display: inline-block;
    padding: 0.4rem 0;
    font-size: 1rem;
    font-weight: 500;

    color: #222f45;
    text-decoration: none;
    border: none !important;

    position: relative;
    transition: color 0.25s ease;
}

/* Hover state */
@media (hover:hover) {
    .single-product .woocommerce-tabs ul.tabs li a:hover {
        color: #35BB9D;
    }
}

/* Underline (inactive state – subtle) */
.single-product .woocommerce-tabs ul.tabs li a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -6px;
    width: 100%;
    height: 2px;
    background: #d3e3e3;
    opacity: 0.4;
    border-radius: 2px;
    transition: background 0.25s ease, opacity 0.25s ease;
}

/* ACTIVE TAB – teal underline */
.single-product .woocommerce-tabs ul.tabs li.active a {
    color: #081224;
    font-weight: 600;
}

.single-product .woocommerce-tabs ul.tabs li.active a::after {
    background: #35BB9D;
    opacity: 1;
    height: 3px;
}

/* ----------------------------------------
   TAB CONTENT CONTAINER (panel)
---------------------------------------- */
.single-product .woocommerce-tabs .panel,
.single-product .woocommerce-Tabs-panel {
    margin: 0;
    padding: 1.75rem 2rem!important;
    border-radius: 14px;
    border: 1px solid #e5e7eb;
    background: #ffffff;
    color: #081224;
}

.single-product .woocommerce-tabs .panel h2,
.single-product .woocommerce-tabs .panel h3 {
    margin-top: 0;
    margin-bottom: 0.75rem;
    font-weight: 600;
    color: #156969;
}

/* ----------------------------------------
   MOBILE – tabs become horizontal scroll
---------------------------------------- */
@media (max-width: 640px) {
    .single-product .woocommerce-tabs ul.tabs {
        overflow-x: auto;
        white-space: nowrap;
        gap: 1.25rem;
        margin-bottom: 1.25rem !important;
        padding-bottom: 0.2rem !important;
    }

    .single-product .woocommerce-tabs ul.tabs li {
        flex: 0 0 auto;
    }
}


/* =========================================
   CLEAN UNDERLINE TABS – SINGLE PRODUCT
   ========================================= */

.single-product .woocommerce-tabs {
    margin-top: 2.5rem;
}

/* Tabs bar */
.single-product .woocommerce-tabs ul.tabs {
    /* Kill Woo defaults */
    border: none !important;
    background: transparent !important;
    list-style: none !important;
    margin: 0 0 0.75rem !important;
    padding: 0 !important;

    display: flex;
    align-items: flex-end;
    gap: 2rem;
    position: relative;
}

/* Baseline under all tabs */
.single-product .woocommerce-tabs ul.tabs::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background: #d3e3e3;
}

/* Kill Woo triangles / extra borders */
.single-product .woocommerce-tabs ul.tabs li,
.single-product .woocommerce-tabs ul.tabs li::before,
.single-product .woocommerce-tabs ul.tabs li::after {
    background: none !important;
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    display: block;
}

/* Tab link */
.single-product .woocommerce-tabs ul.tabs li a {
    position: relative;
    display: inline-block;
    padding: 0 0 0.6rem; /* controls top/bottom spacing */
    margin: 0;

    font-size: 1rem;
    font-weight: 500;
    text-decoration: none;

    color: #222f45;
    border: none !important;
    background: transparent !important;
    outline: none !important;

    transition: color 0.25s ease;
}

/* Default underline (very light) */
.single-product .woocommerce-tabs ul.tabs li a::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px; /* sits exactly on the baseline */
    height: 2px;
    background: transparent;
    border-radius: 2px;
    transition: background 0.25s ease, height 0.25s ease;
}

/* Hover */
@media (hover:hover) {
    .single-product .woocommerce-tabs ul.tabs li a:hover {
        color: #35BB9D;
    }
}

/* Active tab */
.single-product .woocommerce-tabs ul.tabs li.active a {
    color: #081224;
    font-weight: 600;
}

.single-product .woocommerce-tabs ul.tabs li.active a::after {
    background: #35BB9D; /* brand teal */
    height: 3px;
}

/* Panel/card */
.single-product .woocommerce-tabs .panel,
.single-product .woocommerce-Tabs-panel {
    margin: 0;
    padding: 1.75rem 2rem;
    border-radius: 14px;
    border: 1px solid #e5e7eb;
    background: #ffffff;
    color: #081224;
}



/* Mobile – tabs scroll horizontally */
@media (max-width: 640px) {
    .single-product .woocommerce-tabs ul.tabs {
        overflow-x: auto;
        white-space: nowrap;
        gap: 1.25rem;
        margin-bottom: 0.75rem !important;
    }

    .single-product .woocommerce-tabs ul.tabs li {
        flex: 0 0 auto;
    }

    .single-product .woocommerce-tabs ul.tabs li a {
        font-size: 0.9rem;
        padding-bottom: 0.45rem;
    }
}



.number-circle {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 30px;
    height: 30px;
    min-width: 30px;
    min-height: 30px;

    margin-right: 8px;

    background: #35BB9D; /* Brand teal */
    color: #fff;
    border-radius: 50%;

    font-size: 14px;
    font-weight: 700;
}



/* =========================================
   DELIVERY TABLE STYLING
   ========================================= */

.delivery-table {
    margin-top: 1.75rem;
    margin-bottom: 1.75rem;
    padding: 1.5rem 1.75rem;
    border-radius: 14px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    overflow-x: auto;
}

/* Intro text / label */
.delivery-table .delivery-intro,
.delivery-table > span.delivery-label {
    display: block;
    margin-bottom: 0.75rem;
    font-size: 0.9rem;
    color: #222f45;
}

.delivery-table > span.delivery-label {
    font-weight: 600;
}

/* Headings inside (USPs, etc.) */
.delivery-table h3 {
    margin-top: 0;
    margin-bottom: 0.35rem;
    font-size: 1rem;
    font-weight: 600;
    color: #081224;
}

.delivery-table p {
    margin: 0 0 0.75rem;
    font-size: 0.92rem;
    line-height: 1.5;
    color: #374151;
}

/* USP blocks */
.delivery-table .usp {
    padding: 0.75rem 0;
    border-bottom: 1px solid #e5e7eb;
}

.delivery-table .usp:last-child {
    border-bottom: none;
}

/* Table */
.delivery-table table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 0.75rem;
    font-size: 0.95rem;
}

.delivery-table table th,
.delivery-table table td {
    padding: 0.6rem 0.75rem;
    text-align: left;
    border-bottom: 1px solid #e5e7eb;
}

.delivery-table table tr:last-child th,
.delivery-table table tr:last-child td {
    border-bottom: none;
}

/* First column – region */
.delivery-table table th:first-child {
    font-weight: 600;
    color: #081224;
}

/* Second column – price/info */
.delivery-table table th:last-child,
.delivery-table table td:last-child {
    text-align: right;
    font-weight: 600;
    color: #222f45;
}

/* Optional: highlight prices in brand teal */
.delivery-table table th:last-child {
    color: #35BB9D;
}

/* Links inside delivery area */
.delivery-table a {
    color: #dd3333;
    font-weight: 500;
    text-decoration: underline;
}

.delivery-table a:hover {
    text-decoration: none;
}

/* Mobile */
@media (max-width: 640px) {
    .delivery-table {
        padding: 1.25rem 1.25rem;
        border-radius: 12px;
    }

    .delivery-table table th,
    .delivery-table table td {
        padding: 0.5rem 0.5rem;
        font-size: 0.9rem;
    }
}



/* =========================================
   MULTI-MACHINE MESSAGE BAR (Hire / Sale)
   ========================================= */

.multimachine-msg {
    margin: 1rem 0;
    padding: 0.75rem 1rem;

    display: flex;
    align-items: center;
    gap: 0.75rem;

    border-radius: 999px;
    border: 1px solid #35BB9D;
    background: #e7fbf6; /* soft teal tint */
    font-size: 0.9rem;
    color: #081224;
}

/* Icon bubble */
.multimachine-msg__icon {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    border-radius: 999px;
    background: #35BB9D;
    display: flex;
    align-items: center;
    justify-content: center;
}

.multimachine-msg__icon svg {
    width: 14px;
    height: 14px;
    fill: #ffffff;
}

/* Text block */
.multimachine-msg__body {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    flex: 1 1 auto;
}

.multimachine-msg__label {
    font-weight: 600;
    color: #081224;
}

.multimachine-msg__text {
    color: #222f45;
}

/* Link */
.multimachine-msg__link {
    flex: 0 0 auto;
    font-weight: 600;
    text-decoration: none;
    padding: 0.45rem 0.9rem;
    border-radius: 999px;
    background: #dd3333;
    color: #ffffff;
    white-space: nowrap;
    font-size: 0.85rem;
    transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
}

@media (hover: hover) {
    .multimachine-msg__link:hover {
        background: #b92626;
        transform: translateY(-1px);
        box-shadow: 0 8px 18px rgba(0, 0, 0, 0.25);
    }
}

/* Variant subtle tweaks if you ever want different colours */
.multimachine-msg--hire {
    /* you can slightly adjust colour here if needed */
}

@media (max-width: 640px) {
    .multimachine-msg {
        flex-wrap: wrap;
        border-radius: 12px;
    }

    .multimachine-msg__link {
        width: 100%;
        text-align: center;
        justify-content: center;
    }
}


/* =========================================
   SINGLE PRODUCT – PRICE BLOCK
   ========================================= */

.arcade-price-block {
    margin: 0 0 1.25rem;
}

/* Small label above the price */
.arcade-price-label {
    margin: 0 0 0.25rem;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    color: #6b7280; /* neutral grey */
}

/* Main price row */
.arcade-price-main {
    margin: 0;
    display: inline-flex;
    align-items: baseline;
    gap: 0.4rem;
    font-size: 1.5rem;
    font-weight: 700;
    color: #081224; /* deep navy */
}

/* Woo price amount inherits this colour */
.arcade-price-main .woocommerce-Price-amount {
    color: inherit;
}

/* “ex VAT” */
.arcade-price-suffix {
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #6b7280;
}

/* Optional: tweak per type if you want later */
.arcade-price-block--hire .arcade-price-label {
    color: #222f45;
}

.arcade-price-block--custom .arcade-price-label {
    color: #35BB9D; /* teal accent for custom machines */
}