/*
Theme Name: Trigger Solutions
Theme URI: https://triggersolutions.co.uk/
Author: Trigger Solutions
Author URI: http://triggersolutions.co.uk
Description: Custom theme for CMPrint
Version: 1.0


 

/* =Reset default browser CSS. Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */


html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
font,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
button {
    background: transparent;
    border: 0;
    margin: 0;
    padding: 0;
    vertical-align: baseline;
    zoom: 1;
    font-size: 100%;
    font-family: 'inter', sans-serif;
}
font {font-family: inherit;}

body {
    line-height: 1;
}



ol,
ul {
    list-style: none;
}

blockquote {
    quotes: none;
}

blockquote:before,
blockquote:after {
    content: '';
    content: none;
}

del {
    text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
    border-collapse: collapse;
    border-spacing: 0;
}

a img {
    border: none;
}

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
p,
pre,
form,
fieldset,
input,
textarea,
p,
blockquote,
th,
td,
label {

    font-family: 'inter', sans-serif;

    line-height: 1.4;
    font-weight: 300;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    clear: both;
    font-weight: normal;
    font-weight: 300;
    font-family: "inter", sans-serif;    line-height: 1; 
}
img {
    height: auto
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}



fieldset,
img {
    border: 0;
}

address,
caption,
cite,
code,
dfn,
th,
var {
    font-style: normal;
    font-weight: normal;
}



a,
span {
    font-family: inherit;
}

ol,
ul {
    list-style: none;
}

caption,
th {
    text-align: left;
}



a {
    text-decoration: none;
    color: inherit
}

body {padding-top:0px}
.inner {margin:auto; max-width:1360px; max-width:1120px; width:100%; padding:0 20px; position: relative;}
header .inner {max-width:1400px}
.thinnerwidth   .inner {max-width:1120px}
.dark-peachbg {background:#c69d84}

.yellowbg {background:#f9e800}
.bluebg {background:#34a5be}
.dark-bluebg {background:#29235c}
.blackbg {background:#000}
.blackbg * {color:white}
.bluebg * {color:white}
.pinkbg * {color:white}
.purplebg * {color:white}
.yellowbg * {color:black}

.pinkbg,.pinkgbg {background:#e50a63}
.purplebg {background:#4a1863}
.darkyellowbg {background:#fbbf00}
.greenbg {background:#419e35}
.greybg {background:#fafafa}
.nonebg .column.purplebg {padding:30px; box-sizing:border-box}

body {background:#fff}
.whitebg {background:#fff}


strong {font-family:inherit; font-weight: bold;}

header:not(body .woocommerce header) {
       padding-top: 20px;
    padding-bottom: 20px;
    z-index: 999;
    position: fixed;
    top: 40px;
    left: 0;
    right: 0;
    height: auto;}
	
	#mainnav-logo-image{
    position: absolute;
    left: 20px;
    top:20px;
    margin: auto;
    width: 229px;
}
#mainnav-logo-image img {width:100%; height:auto}
#banner p {font-size:14px; color:black; margin:0; padding:10px; text-align:center}
	.topright {
    width: auto;
    float: right;
    margin-top: 10px;
}

#mainnav {
    width: auto;
    float: none;
    margin-top: 10px;
    text-align: center;
    position: absolute;
    left: 20%;
    right: 0;
    top: 49px;
    width: 77%;
    margin: auto;
}
.scrolled #mainnav {    top: 27px;}
#mainnav ul {display:block}
#mainnav ul li {display:inline-block;     display: inline-block;
    padding: 10px 7px;
    margin: 0;
    position: relative; position:relative}
#mainnav ul li.pinkbg {    margin-left: 12px;
    margin-right: 7px;}
#mainnav ul li.menu-item-has-children a:after{content:''; display:inline-block; background-image:url(/wp-content/uploads/2026/10/white-arrow.svg
); background-size:contain; background-repeat:no-repeat; background-position:center; width: 18px;
    height: 10px;
    margin-left: 6px;}
#mainnav ul li.menu-item-has-children li a:after{display:none}

#mainnav ul li ul {display:none; position: absolute;
    top: 38px;
    left: 10px;
    width: 254px;
    text-align: left;
    background: black;}
#mainnav ul li ul li {padding:0}
#mainnav ul li:hover ul {display:block}
#mainnav ul li a {color:#fff;font-size:14px; font-family:"inter",sans-serif; padding:5px; text-transform:uppercase}
#mainnav ul li a:hover {text-decoration:underline}
#mainnav ul li li {display:block; padding:0}
#mainnav ul li li a {padding:10px;     display: block;}
footer {padding-top:50px; padding-bottom:0px; }
footer .inner {padding-bottom:30px}
footer p {color:#fff; font-size:18px; margin-bottom:5px}
footer a {color:#fff}
footer .inner p strong {color:#282963; font-size:43px}
footer .column:nth-child(1) p strong {color:#fff; }
footer .column:nth-child(1) {flex:35%}
footer .inner p:last-child a {font-size:16px;}
#lowerfooter {padding-top:20px; padding-bottom:20px}
#lowerfooter .inner {padding-bottom:0; margin:0 auto}
#lowerfooter  a{    margin: 10px;}
#hero {background-size:cover; background-position:center}
#hero * {color:white}
#hero p { font-family: "inter", serif; font-size:20px; font-weight:300; margin-bottom:10px}
#hero p:nth-child(1){margin-bottom:30px}
#hero p strong {font-size:42px; font-weight:600}
#hero p:last-child{margin-bottom:40px}
#hero h1 {font-size:60px;color:white; line-height: 1; margin-top:30px; }
.home #hero h1 { max-width: 400px;}
#hero p {font-size:21px; color:white; margin-top:20px; max-width: 400px;}

#hero video {with:100%; height:auto}

#searchsubmit{
    background: #1d71b8;
    border-radius: 20px;
    padding: 7px 30px;
    cursor: pointer;
    border: 1px solid white;
    position: relative;
    color: white;
    font-size: 20px;
    font-family: "inter", sans-serif;
}

#searchform  input[type="text"] {
    border: 1px solid #1d71b8;
    border-radius: 20px;
	 padding: 10px;
    margin-bottom: 10px;
    background: white;
    width: 100%;
    box-sizing: border-box;
    color: black;
    font-size: 18px;
}


.fourcolumns a {position:relative}
.fourcolumns a h4 {position:absolute; bottom:30px; left:5%; right:5%; width:90%; display:block; text-align:center; color:white; font-size:40px}


.tax-product_cat .parentcat h1 {text-align:center; margin-bottom:50px}
.wpcf7 p {margin-bottom:7px; text-align:left}
.wpcf7 input[type="url"],.wpcf7 textarea, .wpcf7 input[type="email"], .wpcf7 input[type="tel"], .wpcf7 input[type="text"] {
  padding:10px; margin-bottom:10px;
      background: white;
    width:100%; box-sizing:border-box;
    color: black;font-size:18px
}
#newsletter .wpcf7 input[type="email"] {border:1px solid #1d71b8; border-radius:20px}

#newsletter .wpcf7 .column:nth-child(1){flex:70%; max-width:70%}
#newsletter .wpcf7 .column:nth-child(2){flex:25%; max-width:25%}
.wpcf7 ::placeholder {color:#4a1863; font-size:18px}
.wpcf7 {   
    margin: auto;
    text-align: center;}
 .wpcf7  input {border:none}
 .wpcf7  .wpcf7-submit {    background: #e50a63;
 border-radius: 5px;
    font-size: 14px;
    text-transform: uppercase;
    padding: 10px 30px;
    display: inline-block;
    cursor: pointer;
    
    position: relative;
    color: white;
  }
 .wpcf7  .wpcf7-submit:hover {background:#29235c; color:#fff}
.wpcf7-response-output {
    color: #fff;
}
#wpcf7-f351-p87-o1 h2 {text-align:left}
p {margin-bottom:25px; color:#000; font-size:18px}
p:last-child {margin-bottom:0}
section li  {    margin-bottom: 0;
    color: #29235c;
    font-size: 20px;
    list-style: disc;
    margin-left: 20px;}
section  ul {margin-bottom:25px}


h1 {font-size:36px;     line-height: 1.2; color:#4a1863; margin-bottom:20px; font-weight:600; font-family: "inter", serif;}

h2 {font-size:36px;     line-height: 1.2; color:#4a1863; margin-bottom:20px; ; font-weight:600; font-family: "inter", serif;}
h3 {font-size:34px;     line-height: 1.2;color:#4a1863; margin-bottom:20px; ; font-weight:600; font-family: "inter", serif;}
h4 {font-size:21px;     line-height: 1.2; color:#4a1863; margin-bottom:20px; ; font-weight:600; font-family: "inter", serif;}


.wpcf7-response-output {color:#fff;}


section {padding:80px 0; background-position:center; background-size: cover;}
#hero {
    padding-top: 0;
    padding-bottom: 0px;
    overflow: hidden;
    position: relative;
}
.tax-product_cat  #hero {padding-top:30px; padding-bottom:0px}
.tax-product_cat.term-16   #hero {padding-top:30px; padding-bottom:20px}
.tax-product_cat.term-17   #hero {padding-top:30px; padding-bottom:20px}

.tax-product_cat  #hero img {
    display: block;
    width: 100%;
    height: auto;
   
}
.term-24.tax-product_cat  #hero img,.term-20.tax-product_cat  #hero img,.term-25.tax-product_cat  #hero img,.term-18.tax-product_cat  #hero img {
   
   
    height: auto; max-width: 498px;
 
} 
.home #hero  .inner,#hero .inner {    padding-top: 200px;
    padding-bottom: 200px;}
#hero video {
       width: 100%;
    height: auto;
    position: absolute;
    left: 0;
    top: 0;

}
.tax-product_cat h2 {font-size:42px}
.tax-product_cat.term-16  #hero:before  ,.tax-product_cat.term-17  #hero:before  {content:''; display:block; width:100%; height:110%; position:absolute; bottom:0; left:0;
  background-repeat: repeat-x;
    background-image:url(/wp-content/themes/TriggerSolutions/img/mmmmmmm-1.svg);
  animation: slideleft 5200s infinite linear;
}
@keyframes slideleft {
  from { background-position: 0%; }
  to { background-position: 90000%; }
}



#cats .catbutton {border-radius:20px;    display: block;
    overflow: visible;}
.catbutton * {color:white}
.catbutton button{position:absolute; bottom:30px; right:30px; font-size:26px; color:#282963; cursor:pointer;}

.tax-product_cat .catbutton button{ color:#fff; }

.catbutton button:after{content:'';  font-size:26px; margin-left:15px;  background-image: url(/wp-content/uploads/2026/06/blue-arrow-right.png);
    background-size: contain;
    background-repeat: no-repeat;
    
    content: '';
    width: 13px;
    height: 13px;
    display: inline-block;}
.catbutton h3 {font-size:32px}
.catbutton h3 strong{font-size:51px}
.catbutton .text{position:absolute; bottom:30px; left:30px; font-size:26px;    width: 40%;}
.twocolumns .catbutton .text{  width: 73%;}
.tax-product_cat .twocolumns .catbutton .text{  width: 40%;}

.catbutton img {
    float: right;
    margin-right: 30px;
    margin-top: -20px;
    margin-bottom: 112px;     max-width: 249px;
}

.tax-product_cat .twocolumns .column.catbutton img {
    max-width: 379px;    margin-bottom: 0;
}



.slick-next:before, .slick-prev:before {    color: #29235c;}
.hasbg {    padding: 200px 40px 40px 40px;
    background-size: cover;
    box-sizing: border-box;   }
.hasbg * {color:white}
.hasbg a {color:white; border:1px solid white; margin-top:0px}
.hasbg h3 {margin-bottom:30px}
.hasbg a:hover {color:black; border:1px solid white; background:white}
.hasbg  p,.hasbg  h2 {color:white; }

section a:not(td a,div.woocommerce a,#products a) {border-radius:10px; font-size:14px; padding:10px 20px;     margin-top: 0px;
    display: inline-block; line-height:1; background: #e50a63; color:white;     line-height: 19px;
}

section a.darkyellowbg:not(td a,div.woocommerce a,#products a) {background:#fbbf00}
section a:hover:not(td a:hover,div.woocommerce a:hover,#products a:hover)  {color:white; background:#29235c}
section div a.catbutton {border:none; padding:0;     position: relative;}


.row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;gap: 40px;
}

.column {
	 
  display: flex;
  flex-direction: column;
  flex-basis: 100%;
  flex: 1;
}
.twocolumns .column {max-width: 50%; overflow: hidden; box-sizing:border-box   }
.twocolumns .column img {max-width:100%; height:auto}
.twocolumns .column:nth-child(1){padding-right:20px}
.twocolumns .column:nth-child(2){padding-left:20px}

.twocolumns .column a:hover{
  color: white !important;
    background: #29235c !important;
}
.aligncenter {
    clear: both;
    margin: auto;
    display: block;
}
#hero .twocolumns .column:nth-child(1) {max-width: 36%; overflow: hidden;     ;}
#hero .twocolumns .column:nth-child(2) {max-width: 64%; overflow: hidden;  align-items: center}
#hero .twocolumns {align-items: end;}

#mainfooter p:nth-child(1) {margin-bottom:50px}
#mainfooter p:nth-child(2)  {font-size:30px; font-weight:bold}
#mainfooter p:nth-child(4)  {font-size:11px; }
#mainfooter p:nth-child(5)  {font-size:11px; }
#mainfooter p:nth-child(6)  {font-size:11px; }
.threecolumns .column {max-width: 33%;}
.threecolumns {flex-wrap: wrap; --cols: 3;
  --gap: 30px;
  display: flex;
  gap: var(--gap);}
.page-id-81 .threecolumns {
  --gap: 115px;
}
.threecolumns .column {flex-basis:calc(100% / var(--cols) - var(--gap) / var(--cols) * (var(--cols) - 1));; max-width:calc(100% / var(--cols) - var(--gap) / var(--cols) * (var(--cols) - 1))}
body section#hero p a.darkyellowbg {
    background: #fbbf00; color: #4a1863;
}
body section div p a.greenbg {
    background: #419e35 !important;
}


.fourcolumns  {flex-wrap: wrap; --cols: 4;
  --gap: 30px;
  display: flex;
  gap: var(--gap);}
.fourcolumns  .column {flex-basis:calc(100% / var(--cols) - var(--gap) / var(--cols) * (var(--cols) - 1));; max-width:calc(100% / var(--cols) - var(--gap) / var(--cols) * (var(--cols) - 1))}
.fourcolumns img {width:100%; height:auto}

.twocolumns {flex-wrap: wrap; --cols: 2;
  --gap: 30px;
  display: flex;justify-content: left;     align-items: center;
  gap: var(--gap);}
.twocolumns .column {flex-basis:calc(100% / var(--cols) - var(--gap) / var(--cols) * (var(--cols) - 1));}

.wpcf7-form .twocolumns {
	--gap: 0px;}
#wpcf7-f351-p87-o1 .wpcf7-form .twocolumns {
	--gap: 30px;     align-items: flex-start;}
#wpcf7-f351-p87-o1 .wpcf7-form .twocolumns textarea {height:200px}
#instagram {text-align:center; padding:100px 0}
			
	#instagram img {display:block; margin:auto}
#instagram h3 img {    display: inline-block;
    vertical-align: sub;
    margin-right: 10px;}

#sistersights img {margin:10px}
#instagram p {
    font-size: 24px;
    color:white
}
#instagram p strong {
    font-size: 60px;
    font-family: "Montserrat", sans-serif; color:white
}

footer .inner {margin-bottom:0px}
footer .inner:nth-child(1){padding-bottom:80px}

.twocolumns  h2 {margin-top:0px}

.twocolumns.thinnerwidth h2 {margin-top:0px}
.twocolumns.thinnerwidth .whitebg {padding:30px; box-sizing:border-box}
.parent-pageid-312 h3 {margin-bottom:0}
.parent-pageid-312 section:nth-child(4){padding-bottom:0}
#gallery-1 img {
    border: none !important;
}
#gallery-1 .gallery-item {
    float: left;
    margin-top: 0;
    text-align: center;
    width: auto;
}
.events {padding:30px}
.events .slick-prev {
    left: 0;
}
.events .slick-next {
    right: 0;
}
.event {padding:5px; display:block;box-sizing: border-box;}
.event img {width:100%; height:auto}
.page-id-151 .generic-content .column ,.page-id-145 .generic-content .column {display:block; flex:none;     flex: none;
    width: 100%;
    overflow: hidden;}
#gallery-1 .gallery-item img {width:100%; height:auto;  padding: 5px;
    box-sizing: border-box;}
.galleryouter, .galleryouter  {display:block}
.fullwidth {padding:0}
.fullwidth  .inner {padding:0; max-width:none}
.fullwidth #gallery-1 .gallery-item img {
    width: 100%;
    height: auto;
    max-width: none;
    padding: 0;
    box-sizing: border-box;
}
.fullwidth h3 {position:absolute; top:40%; left:0; right:0; text-align:center; color:white}
body #gallery-1 .gallery-item {
   
    margin-top: 0;
   
}


.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce #respond input#submit, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce a.button, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce input.button, .button
 {
   
    border-radius: 5px;
    font-size: 14px;
text-transform:uppercase;    padding: 10px 30px;
   
    display: inline-block;
}

.woocommerce input.button:hover,.woocommerce button.button:hover {background:white !important; color:#282963 !important;}

.wc-block-components-product-metadata__description h1  {
    font-size: 19px;
}


a.yellowbg {background:#f9e800 !important}
a.bluebg {background:#34a5be !important}
a.dark-bluebg {background:#29235c !important}
a.blackbg {background:#000 !important}
a.whitebg {background:#fff !important; color:black !important}
.button  {min-width:100px; text-align:center}


.slick-prev:before {
   
    background-image: url(/wp-content/uploads/2026/06/blue-arrow-left.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-color: white;
    content: '';
    width: 13px;
    height: 13px;
	display: block;}

.slick-next:before {
   
    background-image: url(/wp-content/uploads/2026/06/blue-arrow-right.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-color: white;
    content: '';
    width: 13px;
    height: 13px;
    display: block;
}
#services .column {    padding-left: 25%;
    position: relative;     justify-content: center;
    box-sizing: border-box; min-height:275px; margin-top:20px}
#services .column p:nth-child(1){margin:0;     height: 0;}
#services .column p:lsat-child{margin:0}

#services .column img {position:absolute; left:0; top:0; width:48%; height:auto}

.hasimg div.whitebg {background:transparent}
.hasimg a.whitebg {color:black}
#products p, #products hs3 {padding:0 30px}
#products p:nth-child(1) {padding:0 }
.hasimg {min-height:500px;     background-size: cover;
    position: static;     display: flex;}
.hasimg * {color:white}
.hasimg.textblack  *{color:black}
.hasimg.textblack  .button{color:white}
#services .column h3,#products p, #products h3 {font-size:28px}
#products h3 {font-size:36px; margin-bottom:40px}
#products .column h3 {font-size:28px; padding:0 30px; margin-bottom:20px;  color:black
   }
#services .column p a { background:none !important;  padding: 0;
    margin-top: 0;
}
#services .column h3 a{
    font-size: 28px;
    line-height: 1.2;
    color: #000 !important;
    margin-bottom: 20px;
    font-weight: 600;
    font-family: "inter", serif; background:none !important;  padding: 0;
    margin-top: 0;
}

#products p {font-size:18px; margin-bottom:30px}
body.scrolled header {
    background: black;
    height: 90px !important;

    padding-top: 10px !important;
    padding-bottom: 0 !important;
    z-index: 999;
    position: fixed;
    top: 0 !important;
    left: 0;
    right: 0;
    height: auto;
	}
body.scrolled  #mainnav-logo-image {

    width: 120px;
}
iframe {display:block; width:100%; height:600px}
.page-id-85 .purplebg a,.page-id-85 .purplebg a:hover, .single-post #content a, .single-post #content a:hover {color:#fbbf00 !important; padding:0 !important; display:inline !important; background:transparent !important; border-radius:0; font-size:18px !important}
#blogposts .column img {width:100%; height:auto}
#blogposts .column a.img,#blogposts .column h3 a {border-radius:0 !important; padding:0 !important; background:transparent !important; color:#4a1863 !important}
#blogposts p {
    margin-bottom: 0;
    margin-top: 10px;
    font-size: 15px;
}
#blogposts h3 a {
    font-size: 28px !important;
    line-height: 1.2 !important;
    color: #4a1863 !important;
    margin-bottom: 0px !important;
    font-weight: 700;
}
#blogposts h3 {margin-bottom:0px !important}
#blogposts p {margin-bottom:20px !important}
#blogposts p.date {margin-bottom:0 !important}

.page-id-342 .twocolumns .twocolumns h3 {font-size:28px; color:black}
.page-id-342 .twocolumns .twocolumns h3 {font-size:28px; margin-bottom:0}



@media only screen and (max-width: 1300px) {
 #mainnav ul li {
    display: inline-block;
    padding: 10px 5px;
    margin: 0 2px;
    position: relative;
}
.inner {
    margin: auto;
    max-width: 100%;
    width: 100%;
    padding: 0 20px;
    box-sizing: border-box;
}
}
.icon {display:none}

#productitem .woocommerce-product-gallery__wrapper a {border:none; border-radius:0; padding:0; margin-top:0}
.woocommerce-product-gallery__trigger,.woocommerce-product-gallery p  {display:none}
section .flex-control-nav li {list-style:none; display:inline-block;}
#productitem .column .woocommerce-product-gallery--columns-4.images:nth-child(2){display:none}

#productitem  button {
    padding: 10px 30px;
    color:white;
    border-radius: 20px; background:#282963;     font-size: 20px; cursor:pointer
}
#quantity {
    padding: 9px;
    color: white;
    border: none;
    border-radius: 20px;
    text-align: center; margin-right:10px;     font-size: 20px;
}
.topproduct .productboxes li {font-size:17px}
.topproduct .tab p {margin-bottom:25px}
.woocommerce-product-gallery__trigger {display:none !important}
.tabs {margin-top:30px}
.tabs h3 {    color: #1d71b8;
    font-size: 21px;
    padding: 20px 0;
    border-top: 1px solid #1d71b8;
    margin-bottom: 0; cursor: pointer;}
.tabs h3:after {content:'+'; float:right; color:#282963 }
.tabs h3.open:after{content:'-'}
.tabs .tab {display:none; border-bottom:1px solid #1d71b8; padding-bottom:20px}

.productboxes {padding:30px; margin-top:30px}
section .productboxes  ul {
    margin-bottom: 0;
}
.productboxes li {
    list-style: none;
    display: inline-block;
    width: 24.5%;
    text-align: center;
    margin: 0; font-size:24px; 
    vertical-align: top; box-sizing:border-box; padding: 10px 50px
}

.twocolumns .productboxes li {padding:0}
.productboxes li img {
    display: block;
    margin: auto;
    width: 80px;
    height: auto; margin-bottom:20px
}


@media only screen and (max-width: 1260px) {

	#banner p {
		font-size: 14px;}
#hero h1 {
    font-size: 50px; 
    line-height: 1;
    margin-top: 19px;
}
	#hero p {
		font-size: 18px;}
	.home h2 {
    font-size: 32px;
}
.threecolumns ,.twocolumns,.fourcolumns{
    flex-wrap: wrap;
    --cols: 1;
    --gap: 15px;
    display: flex;
    gap: var(--gap);
}
section {
	padding: 30px 0;}
	#mailinglist .row .column {
    max-width: 100%;
    padding-right: 0;
}
	footer .inner:nth-child(1) .column {
    max-width: 100%;
}
	.twocolumns h2 {
    margin-top: 0;
}
	#mailinglist .row .column:nth-child(3) {
    max-width: 100%;
}
	#mailinglist input, #mailinglist label {
    display: block;
    box-sizing: border-box;
    width: 100%;
}
.icon {
  z-index: 999999999999999;
  position: fixed;
  background: none;
  display: block;
  padding: 11px;
  height: 40px;
  width: 28px;
  margin: 0px;
     top: 10px;
    right: 20px;
  cursor:pointer;
  display:none;
  color:#fff;
  font-size:14px;
  display: block;

background:
transparent;

width: auto;

box-sizing: border-box;

left: auto;

top: 19px; padding-left:15px;     padding-right: 0px;padding-left: 10px;
        padding-right: 10px;
        
  
}
	footer p {text-align:center !important}
	.tax-product_cat #hero {
		}
	.tax-product_cat.term-16 #hero:before, .tax-product_cat.term-17 #hero:before {
   zoom:.3;
    animation: slideleft 10200s infinite linear;         bottom: 50px;
}
	.tax-product_cat.term-16 #hero {
   
    position: relative;
}
.icon span {color: #000; display:inline-block; margin-left: 33px;

float: left;

margin-top: 0px;

font-size: 17px;

margin-top:2px; }

.hamburger {

    float: left;
    float: left !important;
    width: 22px !important;

}
.hamburger  div { width: 22px !important;}
.menui {
  background: #ffffff;
  transition: 0.35s linear;
  margin-top: 16px;
  position: absolute;
}
.menui {
  background: #fff;}
  .navactive  .menui {
  background: #fff;}
.top-menu {
  top: -5px;
  width: 22px;
  height: 3px;
  border-radius: 0;
}
.mid-menu {
  top: 3px;
  width: 22px;
  height: 3px;
  border-radius: 0;
}
.bottom-menu {
  top:11px;
   width: 22px;
  height: 3px;
  border-radius: 0;
}
.hamburger {float:left}
.icon {display:block}

	.navactive .top-menu{    transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -webkit-transform: rotate(45deg);
    top: 5px;}
.navactive .bottom-menu{transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg); top:5px}
.navactive .mid-menu {display:none}	
.navactive.icon {}

 #mainnav { width:100% !important; height:100vh; padding:20px; 
 padding-bottom:5vh; background:#000; position:fixed; top:0px; left:-9999px; right:auto; z-index: 999999  padding-top:5vh; overflow-y:scroll; box-sizing:border-box;
    top: 0 !important;
    margin: 0; margin-left:0 !important; margin-top:0 !important; float:none}
	 nav ul {
    display: block;
    justify-content: normal; padding-top:5vw; z-index: 999;
}
#mainnav ul li ul,#mainnav ul li ul ul {
   
    position: static;
    top: 0;
    background: transparent;
    padding: 0;
    z-index: 99999;
    left: 0;
    min-height: 0;
    width: 100%;
    padding-top: 0;
}
    #mainnav ul li,#mainnav ul li ul ul li {
        display: block;
        padding: 10px 5px;
        margin: 10px 0px !important;
        position: relative;
        text-align: center;
    }
	#mainnav ul li ul li a, #mainnav ul li ul ul li a {
    color: white;
    background: transparent;}
.navactive  #mainnav {left:0; z-index: 999;}

    nav#mainnav  ul ul {
        display: none;
        transition: all 1s ease-in;
    }
	#mainnav ul li:hover ul {display:none}

	    nav#mainnav  ul.open  ,nav#mainnav  ul.active  {
        display: block !important;
    }
	#mainnav ul li a {
    color: #fff;
   
}
	  nav#mainnav  ul ul ul{
        display: none;
        transition: all 1s ease-in;
    }
	    nav#mainnav  ul .open ul .open ul {
        display: block !important;
    }
	 body nav#mainnav {
        left: auto !important;
        right: -100vw !important;
        transition: all ease-in-out 1s;
        width: 300px !important;
    }

	body.navactive nav#mainnav {
        left: auto !important;
        right: -0 !important;
        transition: all ease-in-out 1s;
    }
	
	.topright {display:none}
	.hasbg {
    padding: 40px 20px;
}


.hasbg p, .hasbg h2 {
   
    max-width: 100%;
}
#hero {
    padding: 20px 0px 0px 20px;
}
	#hero .twocolumns .column:nth-child(1) {
    max-width: 100%;
    overflow: hidden;
}
	#hero .twocolumns .column:nth-child(2) {
    max-width: 100%;
    overflow: hidden;
}
	body.scrolled header {
    background: black;
    height: 62px;
}
	#mainnav-logo-image {
            position: absolute;
        left: 20px;
        top: 64px;
        margin: auto;
        width: 100%;
        max-width: 200px;
}
	#mailinglist * {text-align:center}
	footer .column {margin-bottom:30px}
	footer div, footer .row , footer .column {display:block; text-align:center !important; width:100%;}
	#newsletter .wpcf7 .column:nth-child(1) {
    flex: 100%;
    max-width: 100%;
}
	#newsletter .wpcf7 .column:nth-child(2) {
    flex: 100%;
    max-width: 100%;
}
	.wpcf7-spinner {display:none !important}
	.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output {
    color: black;
}
	#subscribe .fourcolumns {
    margin-top: 40px;
    --gap: 10px;
}
	.twocolumns .column {
    max-width: 100%;
    overflow: hidden;
}
	.term-16 .twocolumns .column.catbutton img, .term-17 .twocolumns .column.catbutton img {
    max-width: 100%;
    margin-right: 30px;
    margin-top: -37px;
    margin-bottom: 0;
}
	.twocolumns .productboxes li{
   
    width: 48.5%;
		padding: 2%;}
	#quantity {
 
    width: 100px;
}
	hero {
        padding: 0;
    }
	.home #hero .inner, #hero .inner {
    padding-top: 100px;
    padding-bottom: 20px;
}
	#hero video {
    width: 200%;
    height: auto;
    position: absolute;
    left: -50%;
    top: 0;
}
	.twocolumns .twocolumns .column img {
    width: 100%;
    height: auto; max-width:none
}
	h2 {
		font-size: 32px;}
	#hero h1 {
        font-size: 38px;
       
    }
	body.scrolled #mainnav-logo-image {
    width: 120px;
    top: 20px;
}
	.twocolumns .column:nth-child(2) {
    padding-left: 0;
}
	.twocolumns .column:nth-child(1) {
    padding-right: 0;
}
	.hasimg {
    min-height: 300px;        background-position: center;
    
}
	  .page-id-81 .threecolumns {
    --gap: 25px;
}
	
	.hasimg[style*="home-delivery"] {
   background-position: right;
}
	#services .twocolumns, #products .fourcolumns {
		 --cols: 2; align-items: flex-start;
		
	}
	#services .column p:nth-child(1) {
    margin: auto;
    height: auto;
    text-align: center;
}
	#services .column img {
    position: static;
    width: 100%;
    height: auto; margin-bottom:10px
   
}
	#services .column,#services .column * {
    padding-left: 0; text-align:center
    
}
	.icon {top: 148px;}
	.scrolled .icon, .navactive .icon {top: 36px;}
}

@media only screen and (max-width: 1023px) {
	.home #hero .inner, #hero .inner {
        padding-top: 140px;
        
    }
	.hasimg[style*="home-delivery"] {
          background-position: bottom right;
        background-size: 100% auto;
        background-repeat: no-repeat;
        background-color: black;
        padding-bottom: 156px;
}
	  .threecolumns, .twocolumns, .fourcolumns {
        flex-wrap: wrap;
        --cols: 2;
        --gap: 30px;
        display: flex;
        gap: var(--gap);
    }
	
	.twocolumns .column:nth-child(1):not(#services .twocolumns .column:nth-child(1), #products .fourcolumns .column:nth-child(1)) {
       flex:60%
    }
	.twocolumns .column:nth-child(2):not(#services .twocolumns .column:nth-child(2), #products .fourcolumns .column:nth-child(2)) {
       flex:35%; padding:20px
    }
	#services .twocolumns, #products .fourcolumns {
		 --cols: 2; align-items: flex-start;
		
	}
	
	#services .column p a {
  
    width: 100%;
}
	    #services .column p:nth-child(1) {
        margin: 0;
       
    }
	section.hasimg .column  {max-width:60%}
}


@media only screen and (max-width: 640px) {
	.hasimg[style*="home-delivery"] {
          background-position: bottom right;
        background-size: 100% auto;
        background-repeat: no-repeat;
        background-color: black;
        padding-bottom: 156px;
}
	#mainfooter img,.wp-image-180,.wp-image-205 {        max-width: 200px !important;
        height: auto;
        margin: auto;
        display: block;}
	 .threecolumns, .twocolumns, .fourcolumns {
        flex-wrap: wrap;
        --cols: 1;
        --gap: 30px;
        display: flex;
        gap: var(--gap);
    }
	#services .twocolumns, #products .fourcolumns {
		 --cols: 1; align-items: flex-start;
		
	}
	
	
	.twocolumns .column:nth-child(1):not(#services .twocolumns .column:nth-child(1), #products .fourcolumns .column:nth-child(1)) {
       flex:100%
    }
	.twocolumns .column:nth-child(2):not(#services .twocolumns .column:nth-child(2), #products .fourcolumns .column:nth-child(2)) {
       flex:100%; padding:0
    }
	    section.hasimg .column {
        max-width: 100%;
    }
	body .nonebg .twocolumns  .column.purplebg {
    padding: 30px !important;
    box-sizing: border-box;
}
}