:root {
--coupon-red: #dd2616;
--coupon-green: #2ea351;
--coupon-orange: #FE880E;
}
body {
background-color: #f7f7f7a7;
--wp--style--root--padding-right: 10px;
--wp--style--root--padding-left: 10px;
}
p {
line-height: 1.5;
}
.current-menu-item {
color: var(--coupon-red);
}
.hero {
text-shadow:1px 1px 3px #00000099;
padding: 2rem !important;
transition:padding 0.5s linear;
background-position: center;
@media (min-width:768px) {
padding: 4rem !important;
}
}
.responsive-grid {
display:block !important;
@media (min-width:600px) {
grid-template-columns:repeat(2, minmax(0, 1fr));
display:grid !important;
}
}
.coupon-list {
padding: 0 10px;
}
.coupon-vendor {
img {
max-height: 40px;
}
}
.vendor-link,
.coupon-description {
display: none;
}
.vendor-logo {
text-decoration: none
}
.single-coupon .vendor-link,
.single-coupon .coupon-description {
display: block;
}
.coupon-title a {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
margin: 20px 0 10px;
font-size: 22px;
}
.coupon-valid {
font-size: 16px;
margin-bottom: 1em !important;
}
.coupon-code .value {
position: relative;
display: block;
margin: 0;
}
.single-coupon .coupon-code {
flex-grow: 1;
}
a.coupon-link {
display: block;
text-decoration: none;
border-radius: 7px;
}
.single-coupon .coupon-link {
padding: 10px;
border: 1px solid #999;
margin-top: 10px;
}
a.coupon-link:after {
content: attr(title);
font-size: 12px;
text-align: center;
display: block;
padding: 2px 12px;
color: #ffffff;
background-color: var(--coupon-green);
border-radius: 7px;
line-height: 30px;
overflow: hidden;
}
a.coupon-link:active {
background-color: var(--coupon-green);
color: #ffffff;
}
a.coupon-link:active:after {
background-color: var(--coupon-orange);
x-color: var(--coupon-green);
}
.single-coupon a.coupon-link:after {
line-height: 36px;
font-size: 14px;
}
a.shop-link {
font-size: 16px;
text-decoration: none;
font-weight: normal;
padding: 6px 12px;
border-radius: 5px;
}
a.shop-link:active {
background-color: var(--coupon-orange);
color: white
}
a.shop-link:after {
content: " >"
}
.single-coupon .shop-link {
color: var(--coupon-green)
}
.single-coupon-card>div {
min-height: 450px !important;
}
.action-label,
.discount-label {
.coupon-link {
border: 2px solid var(--coupon-green);
padding: 1rem 2rem;
}
.coupon-link:after {
content:"";
background: none;
}
.coupon-link:before {
content:attr(title);
position:absolute;
font-size:13px;
top:-0.75em;
width:90px;
padding:5px;
text-align:center;
left:calc(50% - 50px);
background:white;
}
.coupon-link:active:before {
background:var(--coupon-orange);
}
}
.action-label {
.coupon-link {
border-color:var(--coupon-orange)
}
}
.buynow-label {
text-align:center;
margin:3em 0;
}
.buynow-link {
background:var(--coupon-green);
color:white;
font-weight:bold;
text-decoration:none;
text-transform:uppercase;
padding:1em 2em;
border-radius:7px;
}
:is(.coupon-card,.single-coupon-card):has(.prefix.expired)  div {
background: #efefef !important;
}
li.coupon > div {
height:100%;
} body {
padding-top: 90px;
transition:padding-top 0.3s linear;
}
body.admin-bar {
padding-top: 120px;
}
.site-header {
position:fixed;
width:100%;
top:0;
background:white;
z-index:10;
transition:padding-top,padding-bottom,margin-top 0.3s linear;
}
.admin-bar .site-header {
margin-top: 32px;
}
.custom-logo-link img {
width:120px;
transition:width 0.3s linear;
}
body.scrolled {
.custom-logo-link img {width:96px !important}
padding-top:60px;
.site-header {
padding-top:0px !important;
padding-bottom:0px !important;
}
}
@media (max-width: 767px) {
.site-header {
margin-top:0px;
overflow:hidden;
}
.scrolled-down .site-header {
margin-top: -110px;
}
}
.wp-block-navigation li {
line-height: 2;
font-weight:bold
}
.wp-block-navigation li:hover {
color:var(--coupon-green);
}
.wp-block-navigation li:active {
color:var(--coupon-orange);
}
#modal-1:not(.is-menu-open) {
li {
padding:0 16px;  
}
li.has-child.wp-block-navigation-submenu:hover {
border-radius:7px 7px 0 0;
background: var(--coupon-green);
color:white
}
.wp-block-navigation__submenu-container {
border-radius: 0 7px 7px 7px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
background-color: #ffffff;
padding: 10px 0;
left:0 !important;
margin-top:-1px;
li.wp-block-navigation-item {
line-height: 1.5;
font-weight:normal;
padding-left: 0;
background-color: transparent
}
}
.wp-block-site-logo {
display:none;
}
}
#modal-1.is-menu-open {
.wp-block-navigation__submenu-container {
padding:10px;
border-radius: 0 7px 7px 7px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
border:1px solid #f7f7f7f7;
}
li.has-child.wp-block-navigation-submenu {
margin-top:5px;
}
li.has-child > a {
padding:0 16px;  
background: var(--coupon-green);
color:white;
}
li.has-child.wp-block-navigation-submenu > a {
border-radius:7px 7px 0 0;
}
.wp-block-site-logo {
position: absolute;
top: -10px; }
.wp-block-navigation {
margin:20px auto 0 !important;
gap:5px !important;
}
} .splide.is-layout-flow > * {
margin-block-start:0
} .email-form {
background:var(--coupon-green);
color:white;
padding:1em 2em;
box-sizing: border-box;
text-align:center;
border-radius:7px;
box-shadow: var(--wp--preset--shadow--natural);
input {
max-width:100%;
font-size:20px;
padding:6px 10px;
border-radius:7px;
border:none;
&[type="submit"] {
cursor:pointer;
padding:0.5em 1em;
font-weight:bold;
color:var(--coupon-green);
background:white;
&:active {
background:var(--coupon-orange);
color:white
}
}
}
.wpcf7-spinner {
position: absolute;
margin-top:0.6em;
}
.wpcf7-response-output {
padding:1em !important;
background:var(--coupon-orange);
font-weight:bold;
font-size:20px;
}
.wpcf7-not-valid-tip {
color:white;
font-weight:bold;
}
.wpcf7-not-valid {
border:2px solid var(--coupon-orange)
}
} nav.loadmore-button {
gap:10px;
}
nav.loadmore-button a {
padding:1em 2em;
background:var(--coupon-orange);
text-decoration:none;
color:white;
font-weight:bold;
border-radius:7px;
}
@keyframes spin {
from {transform:rotate(0deg);}
to {transform:rotate(360deg);}
}
nav.loadmore-button.loading:after {
content:"●";
display:inline-block;
width:18px;
height:18px;
lione-height:18px;
border:1px solid var(--coupon-orange);;
border-width:2px 2px 2px 2px;
color:var(--coupon-green);
font-weight:bold;
border-radius:50%;
animation-name: spin;
animation-duration: 4000ms;
animation-iteration-count: infinite;
animation-timing-function: linear;
}