/*! Flickity v2.2.1
https://flickity.metafizzy.co
---------------------------------------------- */
.flickity-enabled {
position: relative;
}
.flickity-enabled:focus { outline: none; }
.flickity-viewport {
overflow: hidden;
position: relative;
height: 100%;
}
.flickity-slider {
position: absolute;
width: 100%;
height: 100%;
}
/* draggable */
.flickity-enabled.is-draggable {
-webkit-tap-highlight-color: transparent;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.flickity-enabled.is-draggable .flickity-viewport {
cursor: move;
cursor: grab;
}
.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {
cursor: grabbing;
}
/* ---- flickity-button ---- */
.flickity-button {
position: absolute;
background: hsla(0, 0%, 100%, 0.75);
border: none;
color: #333;
}
.flickity-button:hover {
background: white;
cursor: pointer;
}
.flickity-button:focus {
outline: none;
box-shadow: 0 0 0 5px #19F;
}
.flickity-button:active {
opacity: 0.6;
}
.flickity-button:disabled {
opacity: 0.3;
cursor: auto;
/* prevent disabled button from capturing pointer up event. #716 */
pointer-events: none;
}
.flickity-button-icon {
fill: currentColor;
}
/* ---- previous/next buttons ---- */
.flickity-prev-next-button {
top: 50%;
width: 44px;
height: 44px;
border-radius: 50%;
/* vertically center */
transform: translateY(-50%);
}
.flickity-prev-next-button.previous { left: 10px; }
.flickity-prev-next-button.next { right: 10px; }
/* right to left */
.flickity-rtl .flickity-prev-next-button.previous {
left: auto;
right: 10px;
}
.flickity-rtl .flickity-prev-next-button.next {
right: auto;
left: 10px;
}
.flickity-prev-next-button .flickity-button-icon {
position: absolute;
left: 20%;
top: 20%;
width: 60%;
height: 60%;
}
/* ---- page dots ---- */
.flickity-page-dots {
position: absolute;
width: 100%;
bottom: -25px;
padding: 0;
margin: 0;
list-style: none;
text-align: center;
line-height: 1;
}
.flickity-rtl .flickity-page-dots { direction: rtl; }
.flickity-page-dots .dot {
display: inline-block;
width: 10px;
height: 10px;
margin: 0 8px;
background: #333;
border-radius: 50%;
opacity: 0.25;
cursor: pointer;
}
.flickity-page-dots .dot.is-selected {
opacity: 1;
}
/* flickity-fade */
.flickity-enabled.is-fade .flickity-slider > * {
pointer-events: none;
z-index: 0;
}
.flickity-enabled.is-fade .flickity-slider > .is-selected {
pointer-events: auto;
z-index: 1;
}
@charset "UTF-8";
/**
* @info
* Here, we include stylesheets that declare
* the design system, including typography, colors
* and breakpoints. There are also a range of helper
* classes that can help with common needs.
* For example, "flex.scss" declares a series of classes
* that easily enable flex functionality. They are great
* when certain styles can be applied across all
* breakpoints.
*
* Example (using classes in flex.scss):
*
*/
/* http://meyerweb.com/eric/tools/css/reset/ */
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,
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,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline; }
/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
display: block; }
body {
cursor: default;
line-height: 1; }
ol,
ul {
list-style: none; }
blockquote,
q {
quotes: none; }
blockquote::before,
blockquote::after,
q::before,
q::after {
content: '';
content: none; }
table {
border-collapse: collapse;
border-spacing: 0; }
* {
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box; }
input,
textarea,
button,
select,
a {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
*,
*:focus,
*:active {
outline: none;
box-shadow: none; }
a {
color: inherit;
text-decoration: none; }
button[disabled],
input[disabled] {
cursor: default; }
button {
cursor: pointer; }
input,
select,
button {
background-color: transparent;
border: none;
border-radius: 0;
box-shadow: none;
color: inherit;
font-size: inherit;
margin: 0;
outline: none;
padding: 0;
-moz-appearance: none;
-webkit-appearance: none; }
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
appearance: none; }
input[type=number] {
-moz-appearance: textfield; }
select::-ms-expand {
display: none; }
@font-face {
font-family: 'Helvetica Neue';
src: url('//shop.overtime.tv/cdn/shop/t/387/assets/HelveticaNeue.woff2?v=147080835124823357761764568170') format("woff2"), url('//shop.overtime.tv/cdn/shop/t/387/assets/HelveticaNeue.woff?v=177676147259362501021764568170') format("woff");
font-weight: 400;
font-style: normal;
font-display: swap; }
@font-face {
font-family: 'Helvetica Neue';
src: url('//shop.overtime.tv/cdn/shop/t/387/assets/HelveticaNeue-Light.woff2?v=69479022682520522411764568170') format("woff2"), url('//shop.overtime.tv/cdn/shop/t/387/assets/HelveticaNeue-Light.woff?v=21121936665298657121764568170') format("woff");
font-weight: 300;
font-style: normal;
font-display: swap; }
@font-face {
font-family: 'Helvetica Neue';
src: url('//shop.overtime.tv/cdn/shop/t/387/assets/HelveticaNeue-Italic.woff2?v=18456040777912736691764568170') format("woff2"), url('//shop.overtime.tv/cdn/shop/t/387/assets/HelveticaNeue-Italic.woff?v=15669610763891446741764568170') format("woff");
font-weight: 400;
font-style: italic;
font-display: swap; }
@font-face {
font-family: 'Helvetica Neue';
src: url('//shop.overtime.tv/cdn/shop/t/387/assets/HelveticaNeue-Bold.woff2?v=10141549884149046941764568170') format("woff2"), url('//shop.overtime.tv/cdn/shop/t/387/assets/HelveticaNeue-Bold.woff?v=122039152981286175341764568170') format("woff");
font-weight: 700;
font-style: normal;
font-display: swap; }
@font-face {
font-family: 'Helvetica Neue';
src: url('//shop.overtime.tv/cdn/shop/t/387/assets/HelveticaNeue-Medium.woff2?v=51601207032628299471764568170') format("woff2"), url('//shop.overtime.tv/cdn/shop/t/387/assets/HelveticaNeue-Medium.woff?v=70191843083137692051764568170') format("woff");
font-weight: 500;
font-style: normal;
font-display: swap; }
@font-face {
font-family: 'DS-Digital';
src: url('//shop.overtime.tv/cdn/shop/t/387/assets/DS-Digital.woff2?v=10391139954914613831764568170') format("woff2"), url('//shop.overtime.tv/cdn/shop/t/387/assets/DS-Digital.woff?v=137969035823785636891764568170') format("woff");
font-weight: normal;
font-style: normal;
font-display: swap; }
/**
* @info
* This stylesheet outlines all variables that are used
* across the site. The values here are purely representational.
* These values should be updated in the initial development phase
* when the project begins.
*/
/* Breakpoints */
/* Colors */
/* Transitions */
/* Gutters */
/* Breakpoint Queries */
/* Accounts */
/* Accessibility */
/**
* @info
* This stylesheet outlines utility functions
* that easily attach colors to the DOM. The definitions
* here are very simple and as the style guide is implemented,
* there should be a declaration added here for any relevant
* brand colors.
*/
/* ------------------------------------------------------------ *\
The function below generates two classes for each color in
the color list above.
\* ------------------------------------------------------------ */
.bg-black {
background-color: #000 !important; }
.black {
color: #000 !important; }
.bg-white {
background-color: #fff !important; }
.white {
color: #fff !important; }
.bg-grey {
background-color: #878787 !important; }
.grey {
color: #878787 !important; }
.bg-grey-1 {
background-color: #f2f2f2 !important; }
.grey-1 {
color: #f2f2f2 !important; }
.bg-grey-2 {
background-color: #ededed !important; }
.grey-2 {
color: #ededed !important; }
.bg-grey-3 {
background-color: #ccc !important; }
.grey-3 {
color: #ccc !important; }
.bg-grey-4 {
background-color: #878787 !important; }
.grey-4 {
color: #878787 !important; }
.bg-grey-5 {
background-color: #1e1e1e !important; }
.grey-5 {
color: #1e1e1e !important; }
.bg-yellow {
background-color: #fdd007 !important; }
.yellow {
color: #fdd007 !important; }
.bg-brand-cyan {
background-color: #3ff !important; }
.brand-cyan {
color: #3ff !important; }
.bg-brand-orange {
background-color: #f60 !important; }
.brand-orange {
color: #f60 !important; }
.bg-brand-orange-alt {
background-color: #d95d00 !important; }
.brand-orange-alt {
color: #d95d00 !important; }
.bg-brand-red {
background-color: #ef7875 !important; }
.brand-red {
color: #ef7875 !important; }
.bg-brand-pink {
background-color: #fcebea !important; }
.brand-pink {
color: #fcebea !important; }
.bg-brand-purple {
background-color: #7d5dfc !important; }
.brand-purple {
color: #7d5dfc !important; }
.bg-brand-blue {
background-color: #08cfea !important; }
.brand-blue {
color: #08cfea !important; }
.bg-brand-green {
background-color: #1feb9e !important; }
.brand-green {
color: #1feb9e !important; }
.bg-brand-light-green {
background-color: #b6ff59 !important; }
.brand-light-green {
color: #b6ff59 !important; }
.bg-brand-yellow {
background-color: #f0f500 !important; }
.brand-yellow {
color: #f0f500 !important; }
.bg-red {
background-color: red !important; }
.red {
color: red !important; }
.bg-blue {
background-color: blue !important; }
.blue {
color: blue !important; }
/**
* @info
* Here, we outline an array of utility
* mixins. The intent is to add to these as the
* project evolves.
*/
/**
* This is used in the _typography.scss sheet.
* Generally, this should not be used in module
* files since all font-size declarations should
* follow the design style guide and be declared
* globally rather than within a module context basis.
*/
/**
* Similar to the .fill helper class. Easily
* makes a DOM element fill the entire
* width and height of it's relative parent.
*/
/**
* These mixins gives the attributes for the
* focus outline needed for accessibility.
* An alternative border is given for when focus
* text color will not have enough contrast ratio
* with background
*/
/**
* @info
* This stylesheet outlines all typography styles
* that are used across the entire site. This stylesheet
* must be implemented thoughtfully and follow with precision
* the style guide that is provided by the designer. No type-related
* style declarations should be found in module files. All
* type-related style declarations go here.
*/
.free-images-download__title, .article-grid__title, .article-grid__content h1, .faq-accordions__head,
.heading-one, .article-grid__entry h1, .hero__title, .wysiwyg__container h1, .text h1, .card__title, .article-grid__content h2,
.h2, .article-grid__entry h2, .wysiwyg__container h2, .text h2, #checkout-custom .os-header__title, .article-grid__content h3,
.h3, .article-grid__entry h3, .wysiwyg__container h3, .text h3, .article-grid__content blockquote,
.blockquote, .text blockquote, .account-forms__grid__title, .free-images-form__title, .section-error__title, .article-grid__content h4, .contact-us-form__title, .info-simple__title, .instagram__title, .slider-double__title, .text-icons__title,
.h4, .article-grid__entry h4, .wysiwyg__container h4,
.wysiwyg__container h5,
.wysiwyg__container h6, .text h4, .btn--primary.btn--compact, .btn--link--sm, .article-grid__content h5, .info-simple__entry, .nav > ul > li > a,
.h5, .article-grid__entry h5, .message__inner, .text h5, .btn, #onetrust-banner-sdk #onetrust-button-group button, .account-order__line-item__title, .article-grid__content h6, .accordion-faq__title, .badge__item__wrapper, .featured-blog__title, .featured-blogs__title, .social-media__title, .table-features th,
.h6, .article-grid__entry h6, .text h6, #checkout-custom .os-step__title,
#checkout-custom .content-box h2,
#checkout-custom .product__description__name,
#checkout-custom .section__title,
#checkout-custom .dynamic-checkout__title, #checkout-custom .btn,
.h6-alt,
.h6-secondary, .footer__bar, .product-card__details .product-card__details__title, .trending-products__head .trending-product__title, .recommended-products .recommended-products__title {
font-family: "Oswald", sans-serif;
font-weight: 400;
line-height: 1.2; }
body, .eyebrow, .account-order__title, .account-order__heading--title, .article-grid__date, .form-row__message, #checkout-custom .custom-toggle, .account-address__item__footer-btn, .account-dashboard__logout, .account-forms__grid__description, .account-order__contact, .account-order__section-title, .account-order__line-item__price,
.account-order__line-item__quantity,
.account-order__line-item__total, .free-images-form__entry, .free-images-form__field input, .article-grid__content p, .checkbox .checkbox__label span, .multi-option__title, .multi-option__label > span, .dropdown-menu .dropdown-menu__value, .featured-blog__entry, .pagination__arrow, .pagination__page__link, .radio-button .radio-button__title, .radio-button .radio-button__label > span, .search-form input, .table-features td, .text-icons__content, .faq-accordions__message, .text p, .header-cart-icon, .nav > ul > li > .nav__dropdown > a, .nav > ul > li > .nav__dropdown > ul > li > a, .nav .nav__dropdown .nav__dropdown > ul,
.p1, .slider-double__entry,
.a3, .article-grid__content ul, .text ul,
.ul, .article-grid__content ol, .text ol,
.ol, .account-order__line-item__variant-name, .free-images-form__field .form-row__error__text-error, .article-grid__entry, .product-card__quick__buy__option, .table-features em, .form-row__error__text-error,
.p2, .btn--text-small, #checkout-custom .breadcrumb__link, #checkout-custom .heading-3, #checkout-custom .field__input, #checkout-custom .section__header, #checkout-custom .radio__label,
#checkout-custom .checkbox__label, #checkout-custom .step__footer__previous-link-content, #checkout-custom .checkout__footer__menu ul, #checkout-custom .product__price del,
#checkout-custom .product__price span, #checkout-custom .order-summary__section--total-lines .total-line-table__tbody, #checkout-custom .content-box,
.p3, #checkout-custom .order-summary__section--total-lines, #checkout-custom .review-block__link, #checkout-custom .step__footer__info, #checkout-custom .reduction-code__text,
.p4,
.p5, .article-grid__entry blockquote,
.article-grid__entry blockquote p,
.bq, .article-grid__content a,
.a1, .btn--link, #onetrust-banner-sdk #onetrust-pc-btn-handler,
.link, #onetrust-banner-sdk, .wysiwyg__container, .text, .product-select__swatches__title {
font-family: "Helvetica Neue", sans-serif;
font-weight: 400;
line-height: 1.2; }
#checkout-custom .os-header__title, #checkout-custom .os-step__title,
#checkout-custom .content-box h2,
#checkout-custom .product__description__name,
#checkout-custom .section__title,
#checkout-custom .dynamic-checkout__title, #checkout-custom .heading-3, #checkout-custom .btn, #checkout-custom #onetrust-banner-sdk #onetrust-button-group button, #onetrust-banner-sdk #onetrust-button-group #checkout-custom button, #checkout-custom .product-thumbnail__quantity, #checkout-custom .payment-due__price {
font-family: 'Oswald', sans-serif;
font-weight: normal;
line-height: 1.2; }
.attentive-signup__input .text-input__el {
font-family: 'DS-Digital', sans-serif;
font-weight: normal;
font-style: normal; }
/* Global */
body {
color: #000;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
font-smoothing: antialiased; }
/**
* By design, we attach type styling to DOM elements
* through classes rather than DOM Node references. We
* do not attach these titles via selectors like "heading-one {}"
* to ensure that HTML is designed with semantics in mind
* and not styling. It is entirely possible that a DOM node
* might be styled like so:
*
* In this example, the H3 DOM node has been chosen because
* it semantically makes sense (i.e. it better represents the
* information it contains when non-visual interpreters are
* traversing the DOM, such as screen readers). But, class-based
* selectors allow for the correct styling to be applied regardless.
*
* We also include the definition of abstract classes (e.g. %heading-one) so that
* these styles can be used in stylesheets too. For example:
* .page-title {
* @extend %heading-one;
* }
*/
.free-images-download__title, .article-grid__title, .article-grid__content h1, .faq-accordions__head,
.heading-one,
.article-grid__entry h1,
.hero__title,
.wysiwyg__container h1,
.text h1,
.card__title {
font-size: 36px;
line-height: 64px;
text-transform: uppercase; }
@media (min-width: 1024px) {
.free-images-download__title, .article-grid__title, .article-grid__content h1, .faq-accordions__head,
.heading-one,
.article-grid__entry h1,
.hero__title,
.wysiwyg__container h1,
.text h1,
.card__title {
font-size: 64px;
line-height: 76px; } }
.article-grid__content h2,
.h2,
.article-grid__entry h2,
.wysiwyg__container h2,
.text h2 {
text-transform: uppercase;
font-size: 32px;
line-height: 48px; }
@media (min-width: 1024px) {
.article-grid__content h2,
.h2,
.article-grid__entry h2,
.wysiwyg__container h2,
.text h2 {
font-size: 48px;
line-height: 64px; } }
#checkout-custom .os-header__title, .article-grid__content h3,
.h3,
.article-grid__entry h3,
.wysiwyg__container h3,
.text h3 {
font-size: 28px;
line-height: 40px;
text-transform: uppercase; }
@media (min-width: 1024px) {
#checkout-custom .os-header__title, .article-grid__content h3,
.h3,
.article-grid__entry h3,
.wysiwyg__container h3,
.text h3 {
font-size: 36px;
line-height: 48px; } }
.article-grid__content blockquote,
.blockquote, .text blockquote, .account-forms__grid__title, .free-images-form__title, .section-error__title, .article-grid__content h4, .contact-us-form__title, .info-simple__title, .instagram__title, .slider-double__title, .text-icons__title,
.h4,
.article-grid__entry h4,
.wysiwyg__container h4,
.wysiwyg__container h5,
.wysiwyg__container h6,
.text h4 {
text-transform: uppercase;
font-size: 24px;
line-height: 32px; }
@media (min-width: 1024px) {
.article-grid__content blockquote,
.blockquote, .text blockquote, .account-forms__grid__title, .free-images-form__title, .section-error__title, .article-grid__content h4, .contact-us-form__title, .info-simple__title, .instagram__title, .slider-double__title, .text-icons__title,
.h4,
.article-grid__entry h4,
.wysiwyg__container h4,
.wysiwyg__container h5,
.wysiwyg__container h6,
.text h4 {
font-size: 32px;
line-height: 48px; } }
.btn--primary.btn--compact, .btn--link--sm, .article-grid__content h5, .info-simple__entry, .nav > ul > li > a,
.h5,
.article-grid__entry h5,
.message__inner,
.text h5 {
font-size: 18px;
line-height: 26px; }
@media (min-width: 1024px) {
.btn--primary.btn--compact, .btn--link--sm, .article-grid__content h5, .info-simple__entry, .nav > ul > li > a,
.h5,
.article-grid__entry h5,
.message__inner,
.text h5 {
font-size: 24px;
line-height: 38px; } }
.btn, #onetrust-banner-sdk #onetrust-button-group button, .account-order__line-item__title, .article-grid__content h6, .accordion-faq__title, .badge__item__wrapper, .featured-blog__title, .featured-blogs__title, .social-media__title, .table-features th,
.h6,
.article-grid__entry h6,
.text h6 {
text-transform: uppercase;
font-size: 14px;
line-height: 24px; }
@media (min-width: 1024px) {
.btn, #onetrust-banner-sdk #onetrust-button-group button, .account-order__line-item__title, .article-grid__content h6, .accordion-faq__title, .badge__item__wrapper, .featured-blog__title, .featured-blogs__title, .social-media__title, .table-features th,
.h6,
.article-grid__entry h6,
.text h6 {
font-size: 18px;
line-height: 28px; } }
#checkout-custom .os-step__title,
#checkout-custom .content-box h2,
#checkout-custom .product__description__name,
#checkout-custom .section__title,
#checkout-custom .dynamic-checkout__title, #checkout-custom .btn, #checkout-custom #onetrust-banner-sdk #onetrust-button-group button, #onetrust-banner-sdk #onetrust-button-group #checkout-custom button,
.h6-alt {
text-transform: uppercase;
font-size: 18px;
line-height: 28px; }
.h6-secondary {
text-transform: uppercase;
font-size: 18px;
line-height: 28px; }
@media (min-width: 1024px) {
.h6-secondary {
font-size: 28px;
line-height: 48px; } }
.eyebrow,
.account-order__title,
.account-order__heading--title,
.article-grid__date {
text-transform: uppercase;
font-size: 10px;
line-height: 12px;
letter-spacing: 0.05em; }
@media (min-width: 1024px) {
.eyebrow,
.account-order__title,
.account-order__heading--title,
.article-grid__date {
font-size: 12px;
line-height: 14px; } }
/* Paragraphs */
.form-row__message, #checkout-custom .custom-toggle, .account-address__item__footer-btn, .account-dashboard__logout, .account-forms__grid__description, .account-order__contact, .account-order__section-title, .account-order__line-item__price,
.account-order__line-item__quantity,
.account-order__line-item__total, .free-images-form__entry, .free-images-form__field input, .article-grid__content p, .checkbox .checkbox__label span, .multi-option__title, .multi-option__label > span, .dropdown-menu .dropdown-menu__value, .featured-blog__entry, .pagination__arrow, .pagination__page__link, .radio-button .radio-button__title, .radio-button .radio-button__label > span, .search-form input, .table-features td, .text-icons__content, .faq-accordions__message, .text p, .header-cart-icon, .nav > ul > li > .nav__dropdown > a, .nav > ul > li > .nav__dropdown > ul > li > a, .nav .nav__dropdown .nav__dropdown > ul,
.p1,
.slider-double__entry {
font-size: 12px;
line-height: 22px; }
@media (min-width: 1024px) {
.form-row__message, #checkout-custom .custom-toggle, .account-address__item__footer-btn, .account-dashboard__logout, .account-forms__grid__description, .account-order__contact, .account-order__section-title, .account-order__line-item__price,
.account-order__line-item__quantity,
.account-order__line-item__total, .free-images-form__entry, .free-images-form__field input, .article-grid__content p, .checkbox .checkbox__label span, .multi-option__title, .multi-option__label > span, .dropdown-menu .dropdown-menu__value, .featured-blog__entry, .pagination__arrow, .pagination__page__link, .radio-button .radio-button__title, .radio-button .radio-button__label > span, .search-form input, .table-features td, .text-icons__content, .faq-accordions__message, .text p, .header-cart-icon, .nav > ul > li > .nav__dropdown > a, .nav > ul > li > .nav__dropdown > ul > li > a, .nav .nav__dropdown .nav__dropdown > ul,
.p1,
.slider-double__entry {
font-size: 16px;
line-height: 28px; } }
.a3, .article-grid__content ul, .text ul,
.ul, .article-grid__content ol, .text ol,
.ol, .account-order__line-item__variant-name, .free-images-form__field .form-row__error__text-error, .article-grid__entry, .product-card__quick__buy__option, .table-features em, .form-row__error__text-error,
.p2 {
font-size: 12px;
line-height: 18px; }
@media (min-width: 1024px) {
.a3, .article-grid__content ul, .text ul,
.ul, .article-grid__content ol, .text ol,
.ol, .account-order__line-item__variant-name, .free-images-form__field .form-row__error__text-error, .article-grid__entry, .product-card__quick__buy__option, .table-features em, .form-row__error__text-error,
.p2 {
font-size: 14px;
line-height: 24px; } }
.btn--text-small, #checkout-custom .breadcrumb__link, #checkout-custom .heading-3, #checkout-custom .field__input, #checkout-custom .section__header, #checkout-custom .radio__label,
#checkout-custom .checkbox__label, #checkout-custom .step__footer__previous-link-content, #checkout-custom .checkout__footer__menu ul, #checkout-custom .product__price del,
#checkout-custom .product__price span, #checkout-custom .order-summary__section--total-lines .total-line-table__tbody, #checkout-custom .content-box,
.p3 {
font-size: 12px;
line-height: 18px; }
@media (min-width: 1024px) {
.btn--text-small, #checkout-custom .breadcrumb__link, #checkout-custom .heading-3, #checkout-custom .field__input, #checkout-custom .section__header, #checkout-custom .radio__label,
#checkout-custom .checkbox__label, #checkout-custom .step__footer__previous-link-content, #checkout-custom .checkout__footer__menu ul, #checkout-custom .product__price del,
#checkout-custom .product__price span, #checkout-custom .order-summary__section--total-lines .total-line-table__tbody, #checkout-custom .content-box,
.p3 {
font-size: 14px;
line-height: 24px; } }
#checkout-custom .order-summary__section--total-lines, #checkout-custom .review-block__link, #checkout-custom .step__footer__info, #checkout-custom .reduction-code__text,
.p4 {
font-size: 12px;
line-height: 18px; }
@media (min-width: 1024px) {
#checkout-custom .order-summary__section--total-lines, #checkout-custom .review-block__link, #checkout-custom .step__footer__info, #checkout-custom .reduction-code__text,
.p4 {
font-size: 14px;
line-height: 24px; } }
.p5 {
font-size: 12px;
line-height: 18px; }
@media (min-width: 1024px) {
.p5 {
font-size: 16px;
line-height: 28px; } }
/* Blockquote */
.article-grid__entry blockquote,
.article-grid__entry blockquote p,
.bq {
font-size: 20px;
line-height: 1.4; }
@media (min-width: 415px) {
.article-grid__entry blockquote,
.article-grid__entry blockquote p,
.bq {
font-size: 28px; } }
/* Links */
/* Links */
.article-grid__content a,
.a1,
.btn--link,
#onetrust-banner-sdk #onetrust-pc-btn-handler,
.link {
cursor: pointer;
opacity: 1;
display: inline-block;
font-size: 16px;
line-height: 28px;
text-decoration: none;
position: relative; }
.article-grid__content a::after,
.a1::after,
.btn--link::after,
#onetrust-banner-sdk #onetrust-pc-btn-handler::after,
.link::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
height: 1px;
background-color: currentColor;
width: 0;
opacity: 0;
transition: width 0.4s, opacity 0.4s; }
.article-grid__content a:hover::after,
.a1:hover::after,
.btn--link:hover::after,
#onetrust-banner-sdk #onetrust-pc-btn-handler:hover::after,
.link:hover::after {
width: 100%;
opacity: 1; }
.a2 {
text-decoration: underline; }
.a3 {
display: inline-block;
margin-left: -6px;
padding: 0 6px;
position: relative; }
.a3 span {
position: relative;
z-index: 1; }
.a3::before {
content: '';
height: 100%;
right: 0;
position: absolute;
top: 0;
width: 0;
z-index: 0; }
.no-touch .article-grid__content a, .article-grid__content .no-touch a,
.no-touch .a1 {
transition: opacity 0.2s ease-in-out; }
.no-touch .article-grid__content a:hover, .article-grid__content .no-touch a:hover,
.no-touch .a1:hover {
opacity: 0.6; }
.no-touch .a2::after {
transition: width 0.2s ease-in-out; }
.no-touch .a2:hover::after {
width: calc(100% - 10px); }
.no-touch .a3::before {
transition: width 0.2s ease-in-out; }
.no-touch .a3:hover::before {
left: 0;
right: auto;
width: 100%; }
.link--withicon {
align-items: center;
display: inline-flex; }
.link--withicon .icon {
height: 8px;
width: 15px;
margin: 0 5px; }
/* Horizontal Rule */
.hr {
background-color: #000;
border: none;
display: block;
height: 1px;
opacity: 0.2;
width: 100%; }
/* Styles */
.italic, .collection__featured__entry em, .wysiwyg__container i,
.wysiwyg__container em {
font-style: italic; }
.light {
font-weight: 100; }
.free-images-download__title, .article-grid__title, .article-grid__content h1, .faq-accordions__head,
.heading-one, .article-grid__entry h1, .hero__title, .wysiwyg__container h1, .text h1, .card__title, .article-grid__content h2,
.h2, .article-grid__entry h2, .wysiwyg__container h2, .text h2, #checkout-custom .os-header__title, .article-grid__content h3,
.h3, .article-grid__entry h3, .wysiwyg__container h3, .text h3, .article-grid__content blockquote,
.blockquote, .text blockquote, .account-forms__grid__title, .free-images-form__title, .section-error__title, .article-grid__content h4, .contact-us-form__title, .info-simple__title, .instagram__title, .slider-double__title, .text-icons__title,
.h4, .article-grid__entry h4, .wysiwyg__container h4,
.wysiwyg__container h5,
.wysiwyg__container h6, .text h4, .btn--primary.btn--compact, .btn--link--sm, .article-grid__content h5, .info-simple__entry, .nav > ul > li > a,
.h5, .article-grid__entry h5, .message__inner, .text h5, .btn, #onetrust-banner-sdk #onetrust-button-group button, .account-order__line-item__title, .article-grid__content h6, .accordion-faq__title, .badge__item__wrapper, .featured-blog__title, .featured-blogs__title, .social-media__title, .table-features th,
.h6, .article-grid__entry h6, .text h6, #checkout-custom .os-step__title,
#checkout-custom .content-box h2,
#checkout-custom .product__description__name,
#checkout-custom .section__title,
#checkout-custom .dynamic-checkout__title, #checkout-custom .btn,
.h6-alt,
.h6-secondary, .collection__featured__entry a, .product-card__details .product-card__details__title, .trending-products__head .trending-product__title, .recommended-products .recommended-products__title,
.medium {
font-weight: 500; }
.bold, .eyebrow, .account-order__title, .account-order__heading--title, .article-grid__date, .account-order__section-title, .hero-alt__title, .wysiwyg__container b,
.wysiwyg__container strong {
font-weight: 700; }
.uppercase, .hero-alt__title {
text-transform: uppercase; }
.underline {
text-decoration: underline; }
.strike-through,
.line-through {
text-decoration: line-through; }
.decoration--none {
text-decoration: none; }
.no-wrap {
white-space: nowrap; }
.small {
font-size: 0.8em; }
.article-grid__content ul, .text ul,
.ul,
.article-grid__content ol,
.text ol,
.ol {
font-size: 14px;
line-height: 22px;
list-style: none;
padding-top: 14px;
margin-bottom: 29px; }
@media (min-width: 1024px) {
.article-grid__content ul, .text ul,
.ul,
.article-grid__content ol,
.text ol,
.ol {
font-size: 16px;
line-height: 28px; } }
.article-grid__content ul li + li, .text ul li + li,
.ul li + li,
.article-grid__content ol li + li,
.text ol li + li,
.ol li + li {
margin-top: 0; }
/**
* @info
* Here, we have simple utility classes to add
* alignment rules to DOM elements.
*/
.align-l {
text-align: left; }
.align-c {
text-align: center; }
.align-r {
text-align: right; }
.align-j {
text-align: justify; }
.align-m {
vertical-align: middle; }
.align-t {
vertical-align: top; }
.align-b {
vertical-align: baseline; }
.flip-h {
transform: scale(-1, 1); }
/**
* @info
* Here, we provide utility classes for styling
* a container element that has gutters on either
* side of it, and a max-width.
*
* Example:
*
*
*
*/
.container, #checkout-custom .content > .wrap {
margin: 0 auto;
position: relative;
max-width: 1440px;
width: calc(100% - 40px); }
@media (min-width: 415px) {
.container, #checkout-custom .content > .wrap {
width: calc(100% - 80px); } }
.container--xxs {
max-width: 375px; }
.container--xs {
max-width: 414px; }
.container--s {
max-width: 768px; }
.container--m {
max-width: 1023px; }
.container--md {
max-width: 1200px; }
.container--l {
max-width: 1440px; }
/**
* @info
* Here, we outline utility classes that attach
* display rules to DOM elements. These declarations
* also allow the attachment of display rules scoped
* to various breakpoints.
*/
.inline {
display: inline; }
.inline-block {
display: inline-block; }
.relative {
position: relative; }
.absolute {
position: absolute; }
.fixed {
position: fixed; }
.static {
position: static; }
.pointer {
cursor: pointer; }
.hide {
display: none; }
.block {
display: block; }
@media (min-width: 376px) {
.block--xxs {
display: block; } }
@media (min-width: 415px) {
.block--xs {
display: block; } }
@media (min-width: 769px) {
.block--s {
display: block; } }
@media (min-width: 1024px) {
.block--m {
display: block; } }
@media (min-width: 1201px) {
.block--md {
display: block; } }
@media (min-width: 1441px) {
.block--l {
display: block; } }
@media (min-width: 376px) {
.hide--xxs {
display: none; } }
@media (min-width: 415px) {
.hide--xs {
display: none; } }
@media (min-width: 769px) {
.hide--s {
display: none; } }
@media (min-width: 1024px) {
.hide--m {
display: none; } }
@media (min-width: 1201px) {
.hide--md {
display: none; } }
@media (min-width: 1441px) {
.hide--l {
display: none; } }
/**
* @info
* Here, we outline utility classes that attach
* flex rules to DOM elements.
*/
.f {
display: flex; }
.fw {
flex-wrap: wrap; }
.ais {
align-items: flex-start; }
.aie {
align-items: flex-end; }
.aic {
align-items: center; }
.aib {
align-items: baseline; }
.jcs {
justify-content: flex-start; }
.jce {
justify-content: flex-end; }
.jcc {
justify-content: center; }
.jcb {
justify-content: space-between; }
.jca {
justify-content: space-around; }
.fa {
flex: 1 1 auto;
min-width: 0;
min-height: 0; }
.ff {
flex-shrink: 0; }
.fdc {
flex-direction: column; }
/**
* @info
* Here, we have a very simple outline of
* form related utility classes. Add to this
* file as you create opinions on how forms
* should be styled for the project.
*/
.form-row {
position: relative;
margin-bottom: 15px; }
.form-row.double {
display: flex;
justify-content: space-between; }
.form-row.double > div {
width: calc( 50% - 10px); }
.form-row.double--single-mobile {
display: block; }
@media (min-width: 769px) {
.form-row.double--single-mobile {
display: flex; } }
.form-row.double--single-mobile > div {
width: 100%; }
@media (min-width: 769px) {
.form-row.double--single-mobile > div {
width: calc( 50% - 10px); } }
.form-row.double--single-mobile .text-input {
margin-bottom: 15px; }
@media (min-width: 769px) {
.form-row.double--single-mobile .text-input {
margin-bottom: 0; } }
.form-row.double--single-mobile .form-row__error {
margin-bottom: 29px; }
@media (min-width: 769px) {
.form-row.double--single-mobile .form-row__error {
margin-bottom: 20px; } }
.form-row__error {
margin-bottom: 29px; }
@media (min-width: 769px) {
.form-row__error {
margin-bottom: 20px; } }
.form-row__error .select-input__el-wrap {
border-color: #ef7875; }
.form-row__error--password-match .text-input__wrapper {
border-color: #ef7875; }
.form-row__message {
text-align: center;
margin: 17px 0 19px;
font-size: 14px;
line-height: 22px; }
@media (min-width: 769px) {
.form-row__message {
margin: 0 0 10px;
font-size: 16px;
line-height: 28px; } }
select {
font-family: inherit;
font-size: inherit;
font-weight: inherit; }
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
-webkit-box-shadow: 0 0 0 30px #fff inset !important; }
/**
* @info
* Here, we outline an array of helper utility
* classes that solve needs that relate to a variety
* of concerns. Add to this as the
* project evolves.
*/
/**
* Easily allows for a DOM element
* to comply to a distinct aspect ratio.
*
* Example:
*
*/
.ratio {
position: relative; }
.ratio::before {
content: '';
display: block;
width: 100%; }
.square::before {
padding-top: 100%; }
.rectangle {
padding-bottom: calc(575/765 * 100%); }
/**
* A simple way to hide an element
*/
.hidden {
display: none; }
/**
* This relates directly to Vue.js. As
* per standard Vue.js functionality, the
* v-cloak attribute is removed from the DOM
* element when the Vue component is initialized.
* So, this attribute can be added to ensure that
* the Vue.js component is not shown to the user
* until it is ready.
*/
[v-cloak] {
display: none; }
/**
* Visually hidden but read by screen readers
*/
.sr-only {
display: inline-block;
height: 0;
overflow: hidden;
text-indent: -9999px;
width: 0; }
.overflow-hidden {
overflow: hidden; }
/**
* Simple helpers for handling SVG-based
* icons.
*
* Example:
*
*Liquid error: This liquid context does not allow includes.* Shopping bag icon
*
*/
.icon,
.logo {
position: relative; }
.icon svg,
.logo svg {
display: block;
height: 100%;
width: 100%; }
/**
* Easily makes a DOM element fill the entire
* width and height of it's relative parent.
*/
.fill {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 0; }
/**
* Responsive Helpers
*/
.visible-block,
.visible-inline,
.visible-inline-block,
.visible-xxs-block,
.visible-xxs-inline,
.visible-xxs-inline-block,
.visible-xs-block,
.visible-xs-inline,
.visible-xs-inline-block,
.visible-s-block,
.visible-s-inline,
.visible-s-inline-block,
.visible-m-block,
.visible-m-inline,
.visible-m-inline-block,
.visible-md-block,
.visible-md-inline,
.visible-md-inline-block,
.visible-l-block,
.visible-l-inline,
.visible-l-inline-block {
display: none !important; }
@media (max-width: 375px) {
.visible-block {
display: block !important; }
.visible-inline {
display: inline !important; }
.visible-inline-block {
display: inline-block !important; } }
@media (min-width: 376px) and (max-width: 414px) {
.hidden-xxs {
display: none !important; }
.visible-xxs-block {
display: block !important; }
.visible-xxs-inline {
display: inline !important; }
.visible-xxs-inline-block {
display: inline-block !important; } }
@media (min-width: 415px) and (max-width: 768px) {
.hidden-xs {
display: none !important; }
.visible-xs-block {
display: block !important; }
.visible-xs-inline {
display: inline !important; }
.visible-xs-inline-block {
display: inline-block !important; } }
@media (min-width: 769px) and (max-width: 1023px) {
.hidden-s {
display: none !important; }
.visible-s-block {
display: block !important; }
.visible-s-inline {
display: inline !important; }
.visible-s-inline-block {
display: inline-block !important; } }
@media (min-width: 1024px) and (max-width: 1200px) {
.hidden-m {
display: none !important; }
.visible-m-block {
display: block !important; }
.visible-m-inline {
display: inline !important; }
.visible-m-inline-block {
display: inline-block !important; } }
@media (min-width: 1201px) and (max-width: 1440px) {
.hidden-md {
display: none !important; }
.visible-md-block {
display: block !important; }
.visible-md-inline {
display: inline !important; }
.visible-md-inline-block {
display: inline-block !important; } }
@media (min-width: 1441px) {
.hidden-l {
display: none !important; }
.visible-l-block {
display: block !important; }
.visible-l-inline {
display: inline !important; }
.visible-l-inline-block {
display: inline-block !important; } }
hr {
border: 0;
width: 100%;
height: 1px;
margin: 30px 0;
background: #000; }
hr.hr-grey {
background: #878787; }
.h1 {
height: 100%; }
/**
* @info
* Here, we outline utility classes that relate
* to the primary content area, the header and the
* footer. Here, we offset .main by a certain amount
* of pixels to account for a sticky header. We also
* provide some min-heights for the content area.
*
* These should be modified specifically for the project.
* If you feel like they are not relevant, delete them.
*/
.no-scroll {
overflow: hidden; }
.wrapper {
transition: transform 0.3s;
min-height: 80vh; }
.has-offset-main .wrapper {
transform: translate3d(100%, 0, 0); }
@media (min-width: 415px) {
.has-offset-main .wrapper {
transform: none; } }
.wrapper--max-width {
max-width: 1440px;
margin-left: auto;
margin-right: auto;
position: relative; }
.header,
.footer {
flex: 0 0 auto;
width: 100%; }
/**
* @info
* Here, we outline utility classes that target
* list elements. These can be used both in the DOM
* directly or, in other style declarations.
*
* Examples (two different ways of using these):
* .custom-module__list {
* @extend %ul;
* }
*
*
*/
.article-grid__content ul, .text ul,
.ul,
.article-grid__content ol,
.text ol,
.ol {
padding-left: 24px; }
.article-grid__content ul li, .text ul li,
.ul li,
.article-grid__content ol li,
.text ol li,
.ol li {
margin-top: 3px;
position: relative; }
@media (min-width: 415px) {
.article-grid__content ul li, .text ul li,
.ul li,
.article-grid__content ol li,
.text ol li,
.ol li {
margin-top: 5px; } }
.article-grid__content ul li:first-child, .text ul li:first-child,
.ul li:first-child,
.article-grid__content ol li:first-child,
.text ol li:first-child,
.ol li:first-child {
margin-top: 0; }
.article-grid__content ul ul, .text ul ul,
.article-grid__content ul ol,
.text ul ol,
.ul ul,
.ul ol,
.article-grid__content ol ul,
.text ol ul,
.article-grid__content ol ol,
.text ol ol,
.ol ul,
.ol ol {
margin-top: 3px; }
@media (min-width: 415px) {
.article-grid__content ul ul, .text ul ul,
.article-grid__content ul ol,
.text ul ol,
.ul ul,
.ul ol,
.article-grid__content ol ul,
.text ol ul,
.article-grid__content ol ol,
.text ol ol,
.ol ul,
.ol ol {
margin-top: 5px; } }
.article-grid__content ul, .text ul,
.ul {
list-style: disc; }
.article-grid__content ol,
.text ol,
.ol {
list-style: decimal; }
/**
* @info
* Here, we outline a range of margin and
* padding declarations that can be used for
* simple adjustments to spacing that are
* consistent across breakpoints.
*/
.mha,
.mxa {
margin-left: auto; }
.mha,
.mxa {
margin-right: auto; }
.mva,
.mxa {
margin-top: auto; }
.mva,
.mxa {
margin-bottom: auto; }
.mt0,
.mv0,
.mx0 {
margin-top: 0; }
.mb0,
.mv0,
.mx0 {
margin-bottom: 0; }
.pt0,
.pv0,
.px0 {
padding-top: 0; }
.pb0,
.pv0,
.px0 {
padding-bottom: 0; }
.pr0,
.ph0,
.px0 {
padding-right: 0; }
.pl0,
.ph0,
.px0 {
padding-left: 0; }
.mt025,
.mv025,
.mx025 {
margin-top: 0.25em; }
.mb025,
.mv025,
.mx025 {
margin-bottom: 0.25em; }
.ml025,
.mh025,
.mx025 {
margin-left: 0.25em; }
.mr025,
.mh025,
.mx025 {
margin-right: 0.25em; }
.pt025,
.pv025,
.px025 {
padding-top: 0.25em; }
.pb025,
.pv025,
.px025 {
padding-bottom: 0.25em; }
.pl025,
.ph025,
.px025 {
padding-left: 0.25em; }
.pr025,
.ph025,
.px025 {
padding-right: 0.25em; }
.mt05,
.mv05,
.mx05 {
margin-top: 0.5em; }
.mb05,
.mv05,
.mx05 {
margin-bottom: 0.5em; }
.ml05,
.mh05,
.mx05 {
margin-left: 0.5em; }
.mr05,
.mh05,
.mx05 {
margin-right: 0.5em; }
.pt05,
.pv05,
.px05 {
padding-top: 0.5em; }
.pb05,
.pv05,
.px05 {
padding-bottom: 0.5em; }
.pl05,
.ph05,
.px05 {
padding-left: 0.5em; }
.pr05,
.ph05,
.px05 {
padding-right: 0.5em; }
.mt075,
.mv075,
.mx075 {
margin-top: 0.75em; }
.mb075,
.mv075,
.mx075 {
margin-bottom: 0.75em; }
.ml075,
.mh075,
.mx075 {
margin-left: 0.75em; }
.mr075,
.mh075,
.mx075 {
margin-right: 0.75em; }
.pt075,
.pv075,
.px075 {
padding-top: 0.75em; }
.pb075,
.pv075,
.px075 {
padding-bottom: 0.75em; }
.pl075,
.ph075,
.px075 {
padding-left: 0.75em; }
.pr075,
.ph075,
.px075 {
padding-right: 0.75em; }
.mt1,
.mv1,
.mx1 {
margin-top: 1em; }
.mb1,
.mv1,
.mx1 {
margin-bottom: 1em; }
.ml1,
.mh1,
.mx1 {
margin-left: 1em; }
.mr1,
.mh1,
.mx1 {
margin-right: 1em; }
.mln1 {
margin-left: -1em; }
.mrn1 {
margin-right: -1em; }
.mhn1 {
margin-left: -1em;
margin-right: -1em; }
.pt1,
.pv1,
.px1 {
padding-top: 1em; }
.pb1,
.pv1,
.px1 {
padding-bottom: 1em; }
.pl1,
.ph1,
.px1 {
padding-left: 1em; }
.pr1,
.ph1,
.px1 {
padding-right: 1em; }
.mt15,
.mv15,
.mx15 {
margin-top: 1.5em; }
.mb15,
.mv15,
.mx15 {
margin-bottom: 1.5em; }
.ml15,
.mh15,
.mx15 {
margin-left: 1.5em; }
.mr15,
.mh15,
.mx15 {
margin-right: 1.5em; }
.mln15 {
margin-left: -1.5em; }
.mrn15 {
margin-right: -1.5em; }
.mhn15 {
margin-left: -1.5em;
margin-right: -15em; }
.pt15,
.pv15,
.px15 {
padding-top: 1.5em; }
.pb15,
.pv15,
.px15 {
padding-bottom: 1.5em; }
.pl15,
.ph15,
.px15 {
padding-left: 1.5em; }
.pr15,
.ph15,
.px15 {
padding-right: 1.5em; }
.mt2,
.mv2,
.mx2 {
margin-top: 2em; }
.mb2,
.mv2,
.mx2 {
margin-bottom: 2em; }
.ml2,
.mh2,
.mx2 {
margin-left: 2em; }
.mr2,
.mh2,
.mx2 {
margin-right: 2em; }
.mln2 {
margin-left: -2em; }
.mrn2 {
margin-right: -2em; }
.mhn2 {
margin-left: -2em;
margin-right: -2em; }
.pt2,
.pv2,
.px2 {
padding-top: 2em; }
.pb2,
.pv2,
.px2 {
padding-bottom: 2em; }
.pl2,
.ph2,
.px2 {
padding-left: 2em; }
.pr2,
.ph2,
.px2 {
padding-right: 2em; }
.fade-enter-active,
.fade-leave-active {
transition: opacity 1s; }
.fade-enter,
.fade-leave-to,
.fade-out {
opacity: 0; }
.slide-fade-enter-active {
transition: all 0.5s ease; }
.slide-fade-leave-active {
transition: all 0.5s ease; }
.slide-fade-enter,
.slide-fade-leave-to {
transform: translateY(10px);
opacity: 0; }
.expand-enter-active,
.expand-leave-active {
transition: height 1s ease-in-out;
overflow: hidden; }
.expand-enter,
.expand-leave-to {
height: 0; }
.scale-hotspot-enter-active,
.scale-hotspot-leave-active {
left: 50%;
transform: translateX(-50%) scale(1) !important;
opacity: 1;
will-change: transform;
visibility: visible;
transition: all 0.4s; }
.scale-hotspot-enter,
.scale-hotspot-leave-to {
left: 50%;
transform: translateX(-50%) scale(0) !important;
transition: all 0.4s;
opacity: 0;
visibility: hidden; }
.scale-enter-active,
.scale-leave-active {
transform: scale(1);
opacity: 1;
will-change: transform;
visibility: visible;
transition: all 0.4s; }
.scale-enter,
.scale-leave-to {
transform: scale(0);
opacity: 0;
will-change: transform;
visibility: hidden;
transition: all 0.4s; }
@keyframes popup {
from {
opacity: 0; }
to {
opacity: 1; } }
@keyframes fade-animation {
0% {
opacity: 0; }
50% {
opacity: 0; }
100% {
opacity: 1; } }
@keyframes fade-animation-reverse {
0% {
opacity: 1; }
80% {
opacity: 0; }
100% {
opacity: 0; } }
/**
* @info
* This stylesheet outlines utility functions
* that easily attach widths to the DOM. It
* currently is very simple but can be added to
* over time.
*/
.w1 {
width: 100%; }
.w50 {
width: 50%; }
.w20 {
width: 20%; }
/**
* @info
* This stylesheet defines a restricted set of utility
* classes to handle z-index layering across the site. It
* is encouraged to use these classes over custom declarations
* like: z-index: 999999 since it can be very hard over time
* to keep track of layering unless they comply to a restricted
* system.
*/
.z0 {
z-index: 0; }
.z1 {
z-index: 100; }
.z2 {
z-index: 200; }
.z3 {
z-index: 300; }
.z4,
.header,
.header__inner {
z-index: 400; }
.z5 {
z-index: 500; }
.z6 {
z-index: 600; }
.z7 {
z-index: 700; }
.z8 {
z-index: 800; }
.z9,
.modal__bg,
.modal__wrap {
z-index: 900; }
.z10,
.modal__wrapper.active {
z-index: 1000; }
/**
* @info
* We have this stylesheet to primarily
* hide the preview bar when we need to.
* Only Shopify UI component style overrides
* should really go here.
*/
#preview-bar-iframe {
height: 60px;
display: none !important; }
html {
padding: 0 !important; }
.o0 {
opacity: 0; }
.o5 {
opacity: 0.5; }
.o25 {
opacity: 0.25; }
:focus {
outline: 2px solid !important;
outline-offset: 4px;
color: #000; }
.overwrite-outline:focus {
outline: 2px solid #000 !important;
outline-offset: 4px;
color: #fff; }
.yotpo .yotpo-label-container {
display: none !important; }
.yotpo .new-yotpo-small-box {
margin: 0;
border-bottom: none;
height: 110px; }
.yotpo .new-yotpo-small-box.reviews {
display: none !important; }
.yotpo .yotpo-regular-box {
border-top: none !important;
margin: auto !important;
max-width: 876px !important;
padding: 0; }
.yotpo .bottom-line-items-wrapper {
margin: auto !important;
position: static !important;
transform: none !important; }
.yotpo .bottom-line-items-container-desktop {
height: auto !important; }
.yotpo .bottom-line-items {
float: none !important;
margin: 0 auto 20px !important;
padding: 0 !important;
width: 100%; }
.yotpo .yotpo-icon {
color: #000 !important;
margin-left: 5px !important;
width: 24px !important; }
.yotpo .yotpo-icon:first-child {
margin-left: 0 !important; }
.yotpo .yotpo-icon.review-star {
cursor: pointer; }
.yotpo .yotpo-icon-empty-star {
color: #ededed !important; }
.yotpo .yotpo-icon-empty-star::before {
content: "\e60e" !important; }
.yotpo .yotpo-filter-stars {
display: flex;
justify-content: center;
padding-inline-start: 0 !important; }
.yotpo .avg-score {
color: #000 !important;
font-size: 36px !important;
font-weight: 200 !important;
left: 0 !important; }
.yotpo .reviews-qa-label {
color: #000 !important;
font-size: 10px !important;
text-transform: uppercase !important; }
.yotpo .yotpo-star-distribution-wrapper {
float: none !important;
margin: 0 auto 50px;
padding: 0 !important;
width: 120px; }
.yotpo .yotpo-star-distribution-bar-score {
background-color: #000 !important; }
.yotpo .write-question-review-buttons-container {
float: none !important;
margin: auto !important;
max-width: 876px !important;
overflow: auto;
padding: 0 !important;
width: calc(100% - 80px); }
.yotpo .write-question-review-buttons-container .write-question-review-button {
background: #000 !important;
border: none !important;
border-radius: 3px !important;
color: #fff !important;
display: block !important;
margin: auto !important;
padding: 0 !important;
height: 44px !important;
line-height: 44px !important;
width: 250px !important; }
.yotpo .write-question-review-buttons-container .write-question-review-button:hover {
background: #000 !important;
border: none !important; }
.yotpo .write-question-review-buttons-container .write-question-review-button .yotpo-icon {
display: none; }
.yotpo .write-question-review-button-text {
color: #fff !important; }
.yotpo .write-review .yotpo-header-title,
.yotpo .write-review .yotpo-mandatory-mark,
.yotpo .write-review .yotpo-mandatory-explain,
.yotpo .write-review .socialize {
display: none !important; }
.yotpo .write-review label[for="yotpo_input_review_title"],
.yotpo .write-review label[for="yotpo_input_review_content"],
.yotpo .write-review label[for="yotpo_input_review_username"],
.yotpo .write-review label[for="yotpo_input_review_email"] {
margin-bottom: 10px;
padding: 0 !important; }
.yotpo .write-review .y-label {
color: #000 !important;
font-size: 14px !important; }
.yotpo .write-review .yotpo-header {
display: flex !important; }
.yotpo .write-review .yotpo-header .yotpo-icon {
font-size: 18px !important;
margin-left: 0 !important; }
.yotpo .write-review #write-review-score {
line-height: 18px !important;
margin-right: 8px !important;
min-width: 0 !important;
padding: 0 !important; }
.yotpo .write-review .y-input {
border-color: #ccc !important;
border-radius: 3px !important; }
.yotpo .write-review .connect-wrapper {
padding: 0 !important; }
.yotpo .write-review .yotpo-submit {
background-color: #000 !important;
border-radius: 3px !important;
font-size: 16px !important;
height: 44px !important;
text-transform: none !important;
width: 250px !important; }
.yotpo .write-review .yotpo-submit.primary-color-btn:hover {
background-color: #000 !important; }
.yotpo .write-review #yotpo_input_review_title,
.yotpo .write-review #yotpo_input_review_content {
margin: 0 0 20px !important; }
.yotpo .write-review #yotpo_input_review_username {
margin-bottom: 20px !important; }
@media (min-width: 1024px) {
.yotpo .write-review #yotpo_input_review_username {
margin-bottom: 0 !important; } }
.yotpo .write-review-wrapper {
margin-top: 20px !important; }
.yotpo .reviews-amount {
display: none; }
.yotpo .yotpo-reviews-header {
border-top: solid 1px rgba(0, 0, 0, 0.3);
margin: 20px auto 0 !important;
max-width: 1340px !important;
text-align: left; }
.yotpo .reviews-header {
margin: auto !important;
max-width: 876px !important; }
.yotpo .yotpo-drop-down-layout {
display: block !important;
height: 20px; }
.yotpo .sort-drop-down {
width: 250px !important; }
.yotpo .yotpo-dropdown-button {
float: right; }
.yotpo .yotpo-reviews {
margin: auto !important;
max-width: 1340px !important;
padding-top: 70px; }
.yotpo .yotpo-review {
border-bottom: solid 1px rgba(0, 0, 0, 0.3);
padding: 20px 0; }
.yotpo .yotpo-icon-profile {
display: none !important; }
.yotpo .yotpo-user-name {
color: #000 !important;
font-size: 16px !important;
font-weight: 200 !important;
margin-bottom: 9px !important; }
.yotpo .yotpo-review-date {
font-size: 16px !important; }
.yotpo .yotpo-main {
margin: 0 !important; }
.yotpo .yotpo-main .content-title {
color: #000 !important;
font-size: 24px !important;
margin: 28px 0 16px; }
.yotpo .yotpo-main .content-review {
color: #000 !important;
display: block !important;
line-height: 28px;
margin-bottom: 22px !important; }
.yotpo .footer-actions {
display: none !important; }
.yotpo .yotpo-icon-thumbs-up,
.yotpo .yotpo-icon-thumbs-down {
color: #878787 !important; }
button:focus,
.btn:focus,
#onetrust-banner-sdk #onetrust-button-group button:focus,
[class^='btn--']:focus {
box-shadow: 0 0 0 1px blue; }
.btn, #onetrust-banner-sdk #onetrust-button-group button {
height: 50px;
min-width: 235px;
text-align: center;
padding-left: 20px;
padding-right: 20px;
align-items: center;
display: inline-flex;
justify-content: center;
border-radius: 10px; }
.btn span, #onetrust-banner-sdk #onetrust-button-group button span {
display: block;
line-height: 100%; }
.btn.btn--full, #onetrust-banner-sdk #onetrust-button-group button.btn--full {
width: 100%; }
.btn.btn--black, #onetrust-banner-sdk #onetrust-button-group button.btn--black {
color: #fff;
background: #000; }
.btn.btn--compact, #onetrust-banner-sdk #onetrust-button-group button.btn--compact {
height: auto;
padding: 11px 9px;
min-width: initial;
line-height: 1.3; }
.btn.btn--small, #onetrust-banner-sdk #onetrust-button-group button {
height: auto;
padding: 5px 0;
min-width: initial;
line-height: 1.3; }
.btn.btn--underline, #onetrust-banner-sdk #onetrust-button-group button.btn--underline {
position: relative; }
.btn.btn--underline span::after, #onetrust-banner-sdk #onetrust-button-group button.btn--underline span::after {
content: '';
left: 0;
right: 0;
height: 1px;
bottom: 3px;
background: #000;
position: absolute; }
.btn--link, #onetrust-banner-sdk #onetrust-pc-btn-handler, .btn--link--sm,
.btn--reset {
padding: 0;
height: auto;
text-transform: initial;
text-align: left;
min-width: inherit;
text-decoration: underline;
line-height: 1.3; }
.btn--primary {
color: #1e1e1e;
border: 1px solid #1e1e1e;
background-color: #3ff;
transition: all 300ms; }
.btn--primary:disabled {
opacity: 1; }
.btn--primary.disabled {
opacity: 0.5;
pointer-events: none; }
.btn--primary:focus, .btn--primary:hover {
color: #fff;
background-color: #1e1e1e; }
.btn--primary.btn--compact {
height: 40px;
min-width: 180px;
padding: 0 15px 2px;
/* Accessibility Related */ }
.btn--primary.btn--compact:active {
outline: 2px dotted #000 !important;
outline-offset: 2px; }
.btn--secondary {
color: #1e1e1e;
border: 1px solid #1e1e1e;
background-color: #fff;
transition: all 300ms; }
.btn--secondary:focus, .btn--secondary:hover {
color: #1e1e1e;
background-color: #3ff; }
.btn--offset:hover, .btn--offset:focus {
box-shadow: 0.2em 0.2em 0 0 #1e1e1e; }
.btn--outlined {
color: #f2f2f2;
border: 2px solid #f2f2f2;
transition: all 300ms; }
.btn--outlined:hover:not(:disabled) {
color: #fff !important;
background-color: #000;
border: 2px solid #000; }
.btn--outlined:disabled {
opacity: 1; }
.btn--outlined.btn--outlined--disabled {
pointer-events: none; }
.btn--outlined span {
margin-bottom: 0; }
.btn--full-width {
width: 100%; }
.btn--link, #onetrust-banner-sdk #onetrust-pc-btn-handler {
text-decoration: none; }
.btn--link--sm {
text-decoration: none;
position: relative;
line-height: calc(1em + 6px); }
.btn--link::after, #onetrust-banner-sdk #onetrust-pc-btn-handler::after,
.btn--link--sm::after {
content: '';
position: absolute;
left: 0;
right: 0;
bottom: -5px;
height: 2px;
background-color: currentColor; }
.btn--circle {
width: 50px;
height: 50px;
min-width: 50px;
overflow: hidden;
border-radius: 50%;
background: #ededed; }
.btn--circle:active, .btn--circle:focus, .btn--circle:hover {
background: #000; }
.btn--circle:active svg, .btn--circle:focus svg, .btn--circle:hover svg {
color: #fff; }
.btn--circle.btn--medium {
padding: 0;
width: 40px;
height: 40px;
min-width: 40px; }
.btn--circle.btn--small, #onetrust-banner-sdk #onetrust-button-group button.btn--circle {
padding: 0;
width: 34px;
height: 34px;
min-width: 34px; }
.btn--circle.btn--top {
width: 60px;
height: 60px; }
.btn--circle svg {
height: auto; }
.btn--small-height {
height: 44px; }
.btn--length {
min-width: 250px; }
/**
* @info
* This stylesheet outlines all typography styles
* that are used across the entire site. This stylesheet
* must be implemented thoughtfully and follow with precision
* the style guide that is provided by the designer. No type-related
* style declarations should be found in module files. All
* type-related style declarations go here.
*/
.free-images-download__title, .article-grid__title, .article-grid__content h1, .faq-accordions__head,
.heading-one, .article-grid__entry h1, .hero__title, .wysiwyg__container h1, .text h1, .card__title, .article-grid__content h2,
.h2, .article-grid__entry h2, .wysiwyg__container h2, .text h2, #checkout-custom .os-header__title, .article-grid__content h3,
.h3, .article-grid__entry h3, .wysiwyg__container h3, .text h3, .article-grid__content blockquote,
.blockquote, .text blockquote, .account-forms__grid__title, .free-images-form__title, .section-error__title, .article-grid__content h4, .contact-us-form__title, .info-simple__title, .instagram__title, .slider-double__title, .text-icons__title,
.h4, .article-grid__entry h4, .wysiwyg__container h4,
.wysiwyg__container h5,
.wysiwyg__container h6, .text h4, .btn--primary.btn--compact, .btn--link--sm, .article-grid__content h5, .info-simple__entry, .nav > ul > li > a,
.h5, .article-grid__entry h5, .message__inner, .text h5, .btn, #onetrust-banner-sdk #onetrust-button-group button, .account-order__line-item__title, .article-grid__content h6, .accordion-faq__title, .badge__item__wrapper, .featured-blog__title, .featured-blogs__title, .social-media__title, .table-features th,
.h6, .article-grid__entry h6, .text h6, #checkout-custom .os-step__title,
#checkout-custom .content-box h2,
#checkout-custom .product__description__name,
#checkout-custom .section__title,
#checkout-custom .dynamic-checkout__title, #checkout-custom .btn,
.h6-alt,
.h6-secondary, .footer__bar, .product-card__details .product-card__details__title, .trending-products__head .trending-product__title, .recommended-products .recommended-products__title {
font-family: "Oswald", sans-serif;
font-weight: 400;
line-height: 1.2; }
body, .eyebrow, .account-order__title, .account-order__heading--title, .article-grid__date, .form-row__message, #checkout-custom .custom-toggle, .account-address__item__footer-btn, .account-dashboard__logout, .account-forms__grid__description, .account-order__contact, .account-order__section-title, .account-order__line-item__price,
.account-order__line-item__quantity,
.account-order__line-item__total, .free-images-form__entry, .free-images-form__field input, .article-grid__content p, .checkbox .checkbox__label span, .multi-option__title, .multi-option__label > span, .dropdown-menu .dropdown-menu__value, .featured-blog__entry, .pagination__arrow, .pagination__page__link, .radio-button .radio-button__title, .radio-button .radio-button__label > span, .search-form input, .table-features td, .text-icons__content, .faq-accordions__message, .text p, .header-cart-icon, .nav > ul > li > .nav__dropdown > a, .nav > ul > li > .nav__dropdown > ul > li > a, .nav .nav__dropdown .nav__dropdown > ul,
.p1, .slider-double__entry,
.a3, .article-grid__content ul, .text ul,
.ul, .article-grid__content ol, .text ol,
.ol, .account-order__line-item__variant-name, .free-images-form__field .form-row__error__text-error, .article-grid__entry, .product-card__quick__buy__option, .table-features em, .form-row__error__text-error,
.p2, .btn--text-small, #checkout-custom .breadcrumb__link, #checkout-custom .heading-3, #checkout-custom .field__input, #checkout-custom .section__header, #checkout-custom .radio__label,
#checkout-custom .checkbox__label, #checkout-custom .step__footer__previous-link-content, #checkout-custom .checkout__footer__menu ul, #checkout-custom .product__price del,
#checkout-custom .product__price span, #checkout-custom .order-summary__section--total-lines .total-line-table__tbody, #checkout-custom .content-box,
.p3, #checkout-custom .order-summary__section--total-lines, #checkout-custom .review-block__link, #checkout-custom .step__footer__info, #checkout-custom .reduction-code__text,
.p4,
.p5, .article-grid__entry blockquote,
.article-grid__entry blockquote p,
.bq, .article-grid__content a,
.a1, .btn--link, #onetrust-banner-sdk #onetrust-pc-btn-handler,
.link, #onetrust-banner-sdk, .wysiwyg__container, .text, .product-select__swatches__title {
font-family: "Helvetica Neue", sans-serif;
font-weight: 400;
line-height: 1.2; }
#checkout-custom .os-header__title, #checkout-custom .os-step__title,
#checkout-custom .content-box h2,
#checkout-custom .product__description__name,
#checkout-custom .section__title,
#checkout-custom .dynamic-checkout__title, #checkout-custom .heading-3, #checkout-custom .btn, #checkout-custom #onetrust-banner-sdk #onetrust-button-group button, #onetrust-banner-sdk #onetrust-button-group #checkout-custom button, #checkout-custom .product-thumbnail__quantity, #checkout-custom .payment-due__price {
font-family: 'Oswald', sans-serif;
font-weight: normal;
line-height: 1.2; }
.attentive-signup__input .text-input__el {
font-family: 'DS-Digital', sans-serif;
font-weight: normal;
font-style: normal; }
/* Global */
body {
color: #000;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
font-smoothing: antialiased; }
/**
* By design, we attach type styling to DOM elements
* through classes rather than DOM Node references. We
* do not attach these titles via selectors like "heading-one {}"
* to ensure that HTML is designed with semantics in mind
* and not styling. It is entirely possible that a DOM node
* might be styled like so:
*
* In this example, the H3 DOM node has been chosen because
* it semantically makes sense (i.e. it better represents the
* information it contains when non-visual interpreters are
* traversing the DOM, such as screen readers). But, class-based
* selectors allow for the correct styling to be applied regardless.
*
* We also include the definition of abstract classes (e.g. %heading-one) so that
* these styles can be used in stylesheets too. For example:
* .page-title {
* @extend %heading-one;
* }
*/
.free-images-download__title, .article-grid__title, .article-grid__content h1, .faq-accordions__head,
.heading-one,
.article-grid__entry h1,
.hero__title,
.wysiwyg__container h1,
.text h1,
.card__title {
font-size: 36px;
line-height: 64px;
text-transform: uppercase; }
@media (min-width: 1024px) {
.free-images-download__title, .article-grid__title, .article-grid__content h1, .faq-accordions__head,
.heading-one,
.article-grid__entry h1,
.hero__title,
.wysiwyg__container h1,
.text h1,
.card__title {
font-size: 64px;
line-height: 76px; } }
.article-grid__content h2,
.h2,
.article-grid__entry h2,
.wysiwyg__container h2,
.text h2 {
text-transform: uppercase;
font-size: 32px;
line-height: 48px; }
@media (min-width: 1024px) {
.article-grid__content h2,
.h2,
.article-grid__entry h2,
.wysiwyg__container h2,
.text h2 {
font-size: 48px;
line-height: 64px; } }
#checkout-custom .os-header__title, .article-grid__content h3,
.h3,
.article-grid__entry h3,
.wysiwyg__container h3,
.text h3 {
font-size: 28px;
line-height: 40px;
text-transform: uppercase; }
@media (min-width: 1024px) {
#checkout-custom .os-header__title, .article-grid__content h3,
.h3,
.article-grid__entry h3,
.wysiwyg__container h3,
.text h3 {
font-size: 36px;
line-height: 48px; } }
.article-grid__content blockquote,
.blockquote, .text blockquote, .account-forms__grid__title, .free-images-form__title, .section-error__title, .article-grid__content h4, .contact-us-form__title, .info-simple__title, .instagram__title, .slider-double__title, .text-icons__title,
.h4,
.article-grid__entry h4,
.wysiwyg__container h4,
.wysiwyg__container h5,
.wysiwyg__container h6,
.text h4 {
text-transform: uppercase;
font-size: 24px;
line-height: 32px; }
@media (min-width: 1024px) {
.article-grid__content blockquote,
.blockquote, .text blockquote, .account-forms__grid__title, .free-images-form__title, .section-error__title, .article-grid__content h4, .contact-us-form__title, .info-simple__title, .instagram__title, .slider-double__title, .text-icons__title,
.h4,
.article-grid__entry h4,
.wysiwyg__container h4,
.wysiwyg__container h5,
.wysiwyg__container h6,
.text h4 {
font-size: 32px;
line-height: 48px; } }
.btn--primary.btn--compact, .btn--link--sm, .article-grid__content h5, .info-simple__entry, .nav > ul > li > a,
.h5,
.article-grid__entry h5,
.message__inner,
.text h5 {
font-size: 18px;
line-height: 26px; }
@media (min-width: 1024px) {
.btn--primary.btn--compact, .btn--link--sm, .article-grid__content h5, .info-simple__entry, .nav > ul > li > a,
.h5,
.article-grid__entry h5,
.message__inner,
.text h5 {
font-size: 24px;
line-height: 38px; } }
.btn, #onetrust-banner-sdk #onetrust-button-group button, .account-order__line-item__title, .article-grid__content h6, .accordion-faq__title, .badge__item__wrapper, .featured-blog__title, .featured-blogs__title, .social-media__title, .table-features th,
.h6,
.article-grid__entry h6,
.text h6 {
text-transform: uppercase;
font-size: 14px;
line-height: 24px; }
@media (min-width: 1024px) {
.btn, #onetrust-banner-sdk #onetrust-button-group button, .account-order__line-item__title, .article-grid__content h6, .accordion-faq__title, .badge__item__wrapper, .featured-blog__title, .featured-blogs__title, .social-media__title, .table-features th,
.h6,
.article-grid__entry h6,
.text h6 {
font-size: 18px;
line-height: 28px; } }
#checkout-custom .os-step__title,
#checkout-custom .content-box h2,
#checkout-custom .product__description__name,
#checkout-custom .section__title,
#checkout-custom .dynamic-checkout__title, #checkout-custom .btn, #checkout-custom #onetrust-banner-sdk #onetrust-button-group button, #onetrust-banner-sdk #onetrust-button-group #checkout-custom button,
.h6-alt {
text-transform: uppercase;
font-size: 18px;
line-height: 28px; }
.h6-secondary {
text-transform: uppercase;
font-size: 18px;
line-height: 28px; }
@media (min-width: 1024px) {
.h6-secondary {
font-size: 28px;
line-height: 48px; } }
.eyebrow,
.account-order__title,
.account-order__heading--title,
.article-grid__date {
text-transform: uppercase;
font-size: 10px;
line-height: 12px;
letter-spacing: 0.05em; }
@media (min-width: 1024px) {
.eyebrow,
.account-order__title,
.account-order__heading--title,
.article-grid__date {
font-size: 12px;
line-height: 14px; } }
/* Paragraphs */
.form-row__message, #checkout-custom .custom-toggle, .account-address__item__footer-btn, .account-dashboard__logout, .account-forms__grid__description, .account-order__contact, .account-order__section-title, .account-order__line-item__price,
.account-order__line-item__quantity,
.account-order__line-item__total, .free-images-form__entry, .free-images-form__field input, .article-grid__content p, .checkbox .checkbox__label span, .multi-option__title, .multi-option__label > span, .dropdown-menu .dropdown-menu__value, .featured-blog__entry, .pagination__arrow, .pagination__page__link, .radio-button .radio-button__title, .radio-button .radio-button__label > span, .search-form input, .table-features td, .text-icons__content, .faq-accordions__message, .text p, .header-cart-icon, .nav > ul > li > .nav__dropdown > a, .nav > ul > li > .nav__dropdown > ul > li > a, .nav .nav__dropdown .nav__dropdown > ul,
.p1,
.slider-double__entry {
font-size: 12px;
line-height: 22px; }
@media (min-width: 1024px) {
.form-row__message, #checkout-custom .custom-toggle, .account-address__item__footer-btn, .account-dashboard__logout, .account-forms__grid__description, .account-order__contact, .account-order__section-title, .account-order__line-item__price,
.account-order__line-item__quantity,
.account-order__line-item__total, .free-images-form__entry, .free-images-form__field input, .article-grid__content p, .checkbox .checkbox__label span, .multi-option__title, .multi-option__label > span, .dropdown-menu .dropdown-menu__value, .featured-blog__entry, .pagination__arrow, .pagination__page__link, .radio-button .radio-button__title, .radio-button .radio-button__label > span, .search-form input, .table-features td, .text-icons__content, .faq-accordions__message, .text p, .header-cart-icon, .nav > ul > li > .nav__dropdown > a, .nav > ul > li > .nav__dropdown > ul > li > a, .nav .nav__dropdown .nav__dropdown > ul,
.p1,
.slider-double__entry {
font-size: 16px;
line-height: 28px; } }
.a3, .article-grid__content ul, .text ul,
.ul, .article-grid__content ol, .text ol,
.ol, .account-order__line-item__variant-name, .free-images-form__field .form-row__error__text-error, .article-grid__entry, .product-card__quick__buy__option, .table-features em, .form-row__error__text-error,
.p2 {
font-size: 12px;
line-height: 18px; }
@media (min-width: 1024px) {
.a3, .article-grid__content ul, .text ul,
.ul, .article-grid__content ol, .text ol,
.ol, .account-order__line-item__variant-name, .free-images-form__field .form-row__error__text-error, .article-grid__entry, .product-card__quick__buy__option, .table-features em, .form-row__error__text-error,
.p2 {
font-size: 14px;
line-height: 24px; } }
.btn--text-small, #checkout-custom .breadcrumb__link, #checkout-custom .heading-3, #checkout-custom .field__input, #checkout-custom .section__header, #checkout-custom .radio__label,
#checkout-custom .checkbox__label, #checkout-custom .step__footer__previous-link-content, #checkout-custom .checkout__footer__menu ul, #checkout-custom .product__price del,
#checkout-custom .product__price span, #checkout-custom .order-summary__section--total-lines .total-line-table__tbody, #checkout-custom .content-box,
.p3 {
font-size: 12px;
line-height: 18px; }
@media (min-width: 1024px) {
.btn--text-small, #checkout-custom .breadcrumb__link, #checkout-custom .heading-3, #checkout-custom .field__input, #checkout-custom .section__header, #checkout-custom .radio__label,
#checkout-custom .checkbox__label, #checkout-custom .step__footer__previous-link-content, #checkout-custom .checkout__footer__menu ul, #checkout-custom .product__price del,
#checkout-custom .product__price span, #checkout-custom .order-summary__section--total-lines .total-line-table__tbody, #checkout-custom .content-box,
.p3 {
font-size: 14px;
line-height: 24px; } }
#checkout-custom .order-summary__section--total-lines, #checkout-custom .review-block__link, #checkout-custom .step__footer__info, #checkout-custom .reduction-code__text,
.p4 {
font-size: 12px;
line-height: 18px; }
@media (min-width: 1024px) {
#checkout-custom .order-summary__section--total-lines, #checkout-custom .review-block__link, #checkout-custom .step__footer__info, #checkout-custom .reduction-code__text,
.p4 {
font-size: 14px;
line-height: 24px; } }
.p5 {
font-size: 12px;
line-height: 18px; }
@media (min-width: 1024px) {
.p5 {
font-size: 16px;
line-height: 28px; } }
/* Blockquote */
.article-grid__entry blockquote,
.article-grid__entry blockquote p,
.bq {
font-size: 20px;
line-height: 1.4; }
@media (min-width: 415px) {
.article-grid__entry blockquote,
.article-grid__entry blockquote p,
.bq {
font-size: 28px; } }
/* Links */
/* Links */
.article-grid__content a,
.a1,
.btn--link,
#onetrust-banner-sdk #onetrust-pc-btn-handler,
.link {
cursor: pointer;
opacity: 1;
display: inline-block;
font-size: 16px;
line-height: 28px;
text-decoration: none;
position: relative; }
.article-grid__content a::after,
.a1::after,
.btn--link::after,
#onetrust-banner-sdk #onetrust-pc-btn-handler::after,
.link::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
height: 1px;
background-color: currentColor;
width: 0;
opacity: 0;
transition: width 0.4s, opacity 0.4s; }
.article-grid__content a:hover::after,
.a1:hover::after,
.btn--link:hover::after,
#onetrust-banner-sdk #onetrust-pc-btn-handler:hover::after,
.link:hover::after {
width: 100%;
opacity: 1; }
.a2 {
text-decoration: underline; }
.a3 {
display: inline-block;
margin-left: -6px;
padding: 0 6px;
position: relative; }
.a3 span {
position: relative;
z-index: 1; }
.a3::before {
content: '';
height: 100%;
right: 0;
position: absolute;
top: 0;
width: 0;
z-index: 0; }
.no-touch .article-grid__content a, .article-grid__content .no-touch a,
.no-touch .a1 {
transition: opacity 0.2s ease-in-out; }
.no-touch .article-grid__content a:hover, .article-grid__content .no-touch a:hover,
.no-touch .a1:hover {
opacity: 0.6; }
.no-touch .a2::after {
transition: width 0.2s ease-in-out; }
.no-touch .a2:hover::after {
width: calc(100% - 10px); }
.no-touch .a3::before {
transition: width 0.2s ease-in-out; }
.no-touch .a3:hover::before {
left: 0;
right: auto;
width: 100%; }
.link--withicon {
align-items: center;
display: inline-flex; }
.link--withicon .icon {
height: 8px;
width: 15px;
margin: 0 5px; }
/* Horizontal Rule */
.hr {
background-color: #000;
border: none;
display: block;
height: 1px;
opacity: 0.2;
width: 100%; }
/* Styles */
.italic, .collection__featured__entry em, .wysiwyg__container i,
.wysiwyg__container em {
font-style: italic; }
.light {
font-weight: 100; }
.free-images-download__title, .article-grid__title, .article-grid__content h1, .faq-accordions__head,
.heading-one, .article-grid__entry h1, .hero__title, .wysiwyg__container h1, .text h1, .card__title, .article-grid__content h2,
.h2, .article-grid__entry h2, .wysiwyg__container h2, .text h2, #checkout-custom .os-header__title, .article-grid__content h3,
.h3, .article-grid__entry h3, .wysiwyg__container h3, .text h3, .article-grid__content blockquote,
.blockquote, .text blockquote, .account-forms__grid__title, .free-images-form__title, .section-error__title, .article-grid__content h4, .contact-us-form__title, .info-simple__title, .instagram__title, .slider-double__title, .text-icons__title,
.h4, .article-grid__entry h4, .wysiwyg__container h4,
.wysiwyg__container h5,
.wysiwyg__container h6, .text h4, .btn--primary.btn--compact, .btn--link--sm, .article-grid__content h5, .info-simple__entry, .nav > ul > li > a,
.h5, .article-grid__entry h5, .message__inner, .text h5, .btn, #onetrust-banner-sdk #onetrust-button-group button, .account-order__line-item__title, .article-grid__content h6, .accordion-faq__title, .badge__item__wrapper, .featured-blog__title, .featured-blogs__title, .social-media__title, .table-features th,
.h6, .article-grid__entry h6, .text h6, #checkout-custom .os-step__title,
#checkout-custom .content-box h2,
#checkout-custom .product__description__name,
#checkout-custom .section__title,
#checkout-custom .dynamic-checkout__title, #checkout-custom .btn,
.h6-alt,
.h6-secondary, .collection__featured__entry a, .product-card__details .product-card__details__title, .trending-products__head .trending-product__title, .recommended-products .recommended-products__title,
.medium {
font-weight: 500; }
.bold, .eyebrow, .account-order__title, .account-order__heading--title, .article-grid__date, .account-order__section-title, .hero-alt__title, .wysiwyg__container b,
.wysiwyg__container strong {
font-weight: 700; }
.uppercase, .hero-alt__title {
text-transform: uppercase; }
.underline {
text-decoration: underline; }
.strike-through,
.line-through {
text-decoration: line-through; }
.decoration--none {
text-decoration: none; }
.no-wrap {
white-space: nowrap; }
.small {
font-size: 0.8em; }
.article-grid__content ul, .text ul,
.ul,
.article-grid__content ol,
.text ol,
.ol {
font-size: 14px;
line-height: 22px;
list-style: none;
padding-top: 14px;
margin-bottom: 29px; }
@media (min-width: 1024px) {
.article-grid__content ul, .text ul,
.ul,
.article-grid__content ol,
.text ol,
.ol {
font-size: 16px;
line-height: 28px; } }
.article-grid__content ul li + li, .text ul li + li,
.ul li + li,
.article-grid__content ol li + li,
.text ol li + li,
.ol li + li {
margin-top: 0; }
#onetrust-banner-sdk {
width: 50% !important;
left: 50% !important; }
@media only screen and (max-width: 600px) {
#onetrust-banner-sdk {
width: 100% !important;
left: 0 !important; } }
@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation: portrait) {
#onetrust-banner-sdk {
/* For portrait layouts only */
width: 100%;
left: 0; } }
#onetrust-banner-sdk .ot-sdk-columns {
width: 100% !important; }
#onetrust-banner-sdk .accept-btn-only {
max-width: 100% !important; }
#onetrust-banner-sdk #onetrust-button-group {
float: left !important; }
#onetrust-banner-sdk #onetrust-button-group button {
padding: 10px !important;
color: #000; }
#onetrust-banner-sdk #onetrust-pc-btn-handler {
border: 0px !important; }
#onetrust-banner-sdk #onetrust-accept-btn-handler {
background: #fff !important;
border: 1px solid #000 !important; }
.ot-floating-button {
display: none !important; }
/**
* @info
* This glob-based selector is something
* unique to this starterkit. Here, all stylesheets
* in all module files are added into this bundle. Their
* changes are watched and the browser updates when
* the files are saved. If you need one module stylesheet
* to be included before another, you can configure
* this in the kit.config.js file.
*/
/*! path: /Users/logangelzer/Documents/overtime/src/modules/card-download/card-download.scss */
/* ------------------------------------------------------------ *\
card-download
\* ------------------------------------------------------------ */
.card-download {
padding: 10px 0; }
.card-download__image {
border-radius: 10px;
overflow: hidden;
width: 100%;
padding-top: 100%;
position: relative; }
.card-download__image a {
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
position: absolute;
left: 0;
top: 0;
bottom: 0;
right: 0;
transition: transform 0.25s; }
.card-download__image a:hover {
transform: scale(1.08); }
.card-download__actions {
padding: 3px 6px;
display: flex;
justify-content: space-between;
align-items: center; }
@media (min-width: 769px) {
.card-download__actions {
padding: 3px 10px; } }
.card-download__icon {
margin-left: 20px;
margin-right: -5px;
display: flex;
align-items: center;
justify-content: center; }
@media (min-width: 769px) {
.card-download__icon {
margin-right: 0; } }
.card-download__icon svg {
width: 22px;
height: 22px; }
@media (min-width: 769px) {
.card-download__icon svg {
width: 28px;
height: 28px; } }
.card-download__title {
font-size: 14px;
line-height: 21px;
font-family: "Oswald", sans-serif;
font-weight: 500;
text-transform: uppercase; }
@media (min-width: 769px) {
.card-download__title {
font-size: 16px;
line-height: 24px; } }
.card-download__modal {
background: rgba(0, 0, 0, 0.3);
-webkit-backdrop-filter: blur(34px);
backdrop-filter: blur(34px);
position: fixed;
left: 0;
top: 0;
bottom: 0;
right: 0;
align-items: flex-start;
z-index: 9999;
display: flex;
overflow: auto; }
.card-download__modal__image {
margin: auto; }
.card-download__modal__image img {
border-radius: 10px; }
.card-download__modal__close {
position: sticky;
right: 20px;
top: 50px;
width: 44px;
height: 44px;
border: 1px solid #1e1e1e;
border-radius: 10px;
background-color: #fff;
padding: 21px; }
.card-download__modal__close::before, .card-download__modal__close::after {
content: '';
position: absolute;
left: 50%;
top: 50%;
height: 27px;
width: 2px;
background-color: #1e1e1e; }
.card-download__modal__close::before {
transform: translate(-50%, -50%) rotate(45deg); }
.card-download__modal__close::after {
transform: translate(-50%, -50%) rotate(-45deg); }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/checkout/checkout.scss */
/* ------------------------------------------------------------ *\
Checkout
\* ------------------------------------------------------------ */
/* stylelint-disable */
#checkout-custom a:focus {
outline: none !important; }
#checkout-custom .content > .wrap {
padding-left: 0;
padding-right: 0; }
#checkout-custom .wrap {
width: 100%;
max-width: 1170px;
padding: 0; }
@media (min-width: 1024px) {
#checkout-custom .wrap {
padding: 0 20px; } }
@media (min-width: 1024px) {
#checkout-custom .main {
padding-top: 57px;
padding-right: 0; } }
#checkout-custom .main__header {
padding-bottom: 20px; }
@media (min-width: 1024px) {
#checkout-custom .main__header {
padding-bottom: 29px;
margin-bottom: 0;
padding-right: 137px; } }
@media (min-width: 1024px) {
#checkout-custom .main__content {
padding-right: 137px; } }
#checkout-custom .main__footer {
padding: 28px 0;
border-top: none;
position: relative; }
@media (min-width: 769px) {
#checkout-custom .main__footer {
padding-bottom: 14px; } }
#checkout-custom .main__footer::before {
content: '';
position: absolute;
top: 0;
right: 0;
width: 100vw;
left: 50%;
transform: translateX(-50%);
height: 1px;
background-color: #1e1e1e; }
@media (min-width: 1024px) {
#checkout-custom .main__footer::before {
left: auto;
width: 62.5vw;
right: 0;
transform: none; } }
@media (min-width: 1024px) {
#checkout-custom .sidebar {
width: 37.5%;
padding-top: 80px;
padding-left: 45px; } }
#checkout-custom .sidebar::after {
box-shadow: none; }
@media (min-width: 1024px) {
#checkout-custom .sidebar::after {
box-shadow: 1px 0 0 #1e1e1e inset; } }
#checkout-custom .section--shipping-address {
padding-top: 43px; }
#checkout-custom .logo {
text-align: center; }
@media (min-width: 769px) {
#checkout-custom .logo {
text-align: left; } }
#checkout-custom .logo__image--small {
max-height: 23px; }
@media (min-width: 1024px) {
#checkout-custom .logo__image--small {
max-height: 29px; } }
#checkout-custom .breadcrumb {
margin-top: 9px;
justify-content: center;
padding-bottom: 0; }
@media (min-width: 1024px) {
#checkout-custom .breadcrumb {
margin-top: 28px;
justify-content: flex-start; } }
#checkout-custom .breadcrumb .icon-svg {
color: #1e1e1e; }
#checkout-custom .breadcrumb__item--completed {
color: #1e1e1e; }
#checkout-custom .breadcrumb__item--current .breadcrumb__link {
color: #f60;
font-weight: 400; }
#checkout-custom .breadcrumb__item--current {
color: #f60; }
@media (min-width: 1024px) {
#checkout-custom .dynamic-checkout {
margin-top: 37px; } }
@media (max-width: 999px) {
#checkout-custom .dynamic-checkout {
margin-top: 20px; } }
#checkout-custom .dynamic-checkout__content {
padding-left: 15px;
padding-right: 15px;
padding-bottom: 30px;
border-color: #1e1e1e; }
#checkout-custom .os-header__title {
text-transform: uppercase;
color: #1e1e1e;
letter-spacing: 0.4px; }
#checkout-custom .os-step__title,
#checkout-custom .content-box h2,
#checkout-custom .product__description__name,
#checkout-custom .section__title,
#checkout-custom .dynamic-checkout__title {
text-transform: uppercase;
color: #1e1e1e;
letter-spacing: 0.4px; }
#checkout-custom .heading-3 {
text-transform: uppercase;
color: #1e1e1e;
letter-spacing: 0.4px; }
#checkout-custom .dynamic-checkout__title::before {
border-top-left-radius: 10px;
border-color: #1e1e1e; }
#checkout-custom .dynamic-checkout__title::after {
border-top-right-radius: 10px;
border-color: #1e1e1e; }
#checkout-custom .dynamic-checkout__content {
border-radius: 0 0 10px 10px; }
#checkout-custom .alternative-payment-separator {
display: none; }
#checkout-custom .field {
border: none;
padding: 0 10px;
padding-bottom: 12px; }
@media (min-width: 1024px) {
#checkout-custom .field {
padding-bottom: 15px; } }
#checkout-custom .field__input {
border-color: #1e1e1e;
border-radius: 10px;
padding: 13px 14px 14px; }
#checkout-custom .field--show-floating-label .field__input {
padding-top: 24px;
padding-bottom: 3px; }
#checkout-custom .floating-labels .field__label {
margin-top: 6px;
padding: 0 14px; }
#checkout-custom .field__input-wrapper label.field__label {
font-size: 12px;
top: 2px;
margin-left: 2px; }
#checkout-custom .section__header {
color: #878787;
margin-bottom: 18px; }
#checkout-custom .section__header a {
color: #f60; }
#checkout-custom .section__header .layout-flex {
align-items: center; }
#checkout-custom .input-checkbox:checked {
border-width: 8px; }
#checkout-custom .input-checkbox,
#checkout-custom .input-checkbox:hover {
border-color: currentColor;
border-radius: 50%;
width: 16px;
height: 16px; }
#checkout-custom .input-checkbox:focus,
#checkout-custom .input-checkbox:hover:focus {
outline: none !important; }
#checkout-custom .checkbox__input,
#checkout-custom .radio__input {
padding-right: 10px;
position: relative;
top: -2px; }
@media (min-width: 1024px) {
#checkout-custom .checkbox__input,
#checkout-custom .radio__input {
top: 0; } }
#checkout-custom .input-checkbox,
#checkout-custom .input-radio {
width: 16px;
height: 16px; }
#checkout-custom .input-radio:checked {
border-width: 1px;
box-shadow: inset 0 0 0 5px #3ff;
background-color: #1e1e1e; }
#checkout-custom .btn, #checkout-custom #onetrust-banner-sdk #onetrust-button-group button, #onetrust-banner-sdk #onetrust-button-group #checkout-custom button {
background-color: #3ff;
border-color: #1e1e1e;
color: #1e1e1e;
border-radius: 10px;
padding: 15px 20px;
text-transform: uppercase;
letter-spacing: 0.4px;
height: 58px;
min-width: 250px; }
#checkout-custom .step__footer__previous-link {
text-align: left; }
#checkout-custom .step__footer__previous-link svg {
fill: #1e1e1e; }
#checkout-custom .checkout__footer__menu ul {
color: #878787;
text-align: center; }
@media (min-width: 769px) {
#checkout-custom .checkout__footer__menu ul {
display: flex; } }
#checkout-custom .checkout__footer__menu ul li + li {
margin-top: 21px; }
@media (min-width: 769px) {
#checkout-custom .checkout__footer__menu ul li + li {
margin-top: 0;
margin-left: 28px; } }
#checkout-custom .order-summary__section--product-list {
overflow: visible;
padding: 0; }
#checkout-custom .order-summary__section--product-list::after {
background-color: #1e1e1e;
width: 50vw;
left: -45px; }
@media (min-width: 769px) {
#checkout-custom .order-summary__section--product-list::after {
display: none; } }
#checkout-custom .product {
padding-bottom: 17px; }
#checkout-custom .product td {
padding-top: 0; }
#checkout-custom .product__image {
padding-top: 0;
vertical-align: top; }
#checkout-custom .product-thumbnail {
width: 64px;
height: 64px;
border-radius: 10px;
background: rgba(255, 255, 255, 0.4); }
#checkout-custom .product-thumbnail::after {
border: none; }
#checkout-custom .product-thumbnail__quantity {
background-color: #fff;
color: #000;
font-size: 12px;
line-height: 19px;
top: -5px; }
#checkout-custom .product__description {
padding-top: 5px;
padding-left: 23px; }
#checkout-custom .product__description__name {
margin-bottom: 5px; }
#checkout-custom .product__description .reduction-code {
margin-top: 7px; }
#checkout-custom .product__description__variant {
color: #878787; }
#checkout-custom .product__price span {
color: #1e1e1e; }
#checkout-custom .order-summary__section--product-list .product-table {
margin-bottom: 14px; }
#checkout-custom .order-summary__section--discount {
padding: 31px 0 24px; }
@media (max-width: 999px) {
#checkout-custom .order-summary__section--discount .field__input-btn-wrapper {
flex-wrap: wrap; } }
#checkout-custom .order-summary__section--discount input {
padding-top: 14px;
padding-bottom: 13px; }
#checkout-custom .order-summary__section--discount .btn, #checkout-custom .order-summary__section--discount #onetrust-banner-sdk #onetrust-button-group button, #onetrust-banner-sdk #onetrust-button-group #checkout-custom .order-summary__section--discount button {
min-width: 100px;
padding: 10px 20px;
width: auto !important;
height: auto;
margin-left: 13px !important;
margin-top: 0 !important; }
@media (max-width: 999px) {
#checkout-custom .order-summary__section--discount .btn, #checkout-custom .order-summary__section--discount #onetrust-banner-sdk #onetrust-button-group button, #onetrust-banner-sdk #onetrust-button-group #checkout-custom .order-summary__section--discount button {
width: 100 !important;
min-width: 100% !important;
margin: 15px 0 0 !important; } }
#checkout-custom .order-summary__section--discount .field {
padding-bottom: 0; }
#checkout-custom .order-summary__section--total-lines {
color: #1e1e1e;
padding: 31px 0;
border-top: none;
position: relative; }
#checkout-custom .order-summary__section--total-lines::after {
content: '';
position: absolute;
bottom: 80px;
left: 50%;
width: 100vw;
transform: translateX(-50%);
height: 1px;
background-color: #1e1e1e; }
@media (min-width: 769px) {
#checkout-custom .order-summary__section--total-lines::after {
display: none; } }
#checkout-custom .order-summary__section--total-lines::before {
content: '';
position: absolute;
top: 0;
left: 50%;
width: 100vw;
transform: translateX(-50%);
height: 1px;
background-color: #1e1e1e; }
@media (min-width: 769px) {
#checkout-custom .order-summary__section--total-lines::before {
transform: none;
left: -45px;
width: 50vw; } }
#checkout-custom .order-summary__section--total-lines .total-line-table__footer {
position: relative;
padding-top: 50px; }
#checkout-custom .order-summary__section--total-lines .total-line-table__footer::before {
content: '';
position: absolute;
top: 29px;
left: 50%;
width: 100vw;
transform: translateX(-50%);
height: 1px;
background-color: #1e1e1e;
display: none; }
@media (min-width: 769px) {
#checkout-custom .order-summary__section--total-lines .total-line-table__footer::before {
display: block;
transform: none;
left: -45px;
width: 50vw;
transform: none; } }
#checkout-custom .order-summary__section--total-lines .total-line-table__footer th.total-line__name {
padding-top: 62px; }
#checkout-custom .order-summary__section--total-lines th::before,
#checkout-custom .order-summary__section--total-lines td::before {
display: none; }
#checkout-custom .order-summary__section--product-list + .order-summary__section--total-lines::before {
display: none; }
#checkout-custom .order-summary__section ~ .order-summary__section {
border-top: none;
position: relative; }
#checkout-custom .order-summary__section ~ .order-summary__section::before {
content: '';
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
width: 100vw;
height: 1px;
background-color: #1e1e1e; }
@media (min-width: 769px) {
#checkout-custom .order-summary__section ~ .order-summary__section::before {
left: -45px;
transform: none;
width: 50vw; } }
@media (min-width: 769px) {
#checkout-custom .payment-due__currency {
display: none; } }
#checkout-custom .payment-due__price {
font-size: 24px;
text-transform: uppercase;
position: relative;
top: 4px; }
@media (min-width: 769px) {
#checkout-custom .step__sections {
margin-top: 23px; } }
#checkout-custom .step__sections + .step__footer {
margin-top: 10px; }
#checkout-custom .content-box {
border-radius: 10px;
border-color: #1e1e1e; }
#checkout-custom .content-box__row {
padding: 13px 12px 9px 14px; }
#checkout-custom .section--billing-address .content-box__row,
#checkout-custom .section--shipping-method .content-box__row {
padding-bottom: 13px; }
#checkout-custom .review-block__label {
flex-basis: 78px; }
#checkout-custom .review-block ~ .review-block {
margin-top: 10px;
padding-top: 16px; }
#checkout-custom .content-box__row ~ .content-box__row,
#checkout-custom .review-block ~ .review-block {
border-color: #1e1e1e; }
#checkout-custom .section--shipping-method {
padding-top: 45px; }
#checkout-custom .section--shipping-method .section__header {
margin-bottom: 13px; }
#checkout-custom .radio-wrapper.content-box__row.content-box__row--secondary {
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px; }
#checkout-custom .os-header__hanging-icon {
display: none; }
#checkout-custom .step__footer__info {
color: #878787; }
#checkout-custom .step__footer__info a {
color: #f60;
display: inline-block;
margin-left: 5px; }
#checkout-custom .content-box .btn, #checkout-custom .content-box #onetrust-banner-sdk #onetrust-button-group button, #onetrust-banner-sdk #onetrust-button-group #checkout-custom .content-box button {
padding: 13px 20px;
height: auto;
width: 100%; }
#checkout-custom [data-step="thank_you"] .field__input {
min-height: 58px; }
#checkout-custom [data-step="thank_you"] .btn, #checkout-custom [data-step="thank_you"] #onetrust-banner-sdk #onetrust-button-group button, #onetrust-banner-sdk #onetrust-button-group #checkout-custom [data-step="thank_you"] button {
margin-top: 0;
margin-bottom: 0; }
#checkout-custom [data-step="thank_you"] .content-box + .content-box {
margin-top: 43px; }
@media (min-width: 769px) {
#checkout-custom [data-step="thank_you"] .content-box + .content-box {
margin-top: 20px; } }
#checkout-custom [data-step="thank_you"] .content-box__row {
padding: 20px; }
@media (min-width: 769px) {
#checkout-custom [data-step="thank_you"] .content-box__row {
padding: 15px; } }
@media (min-width: 769px) {
#checkout-custom [data-step="thank_you"] .section__content__column {
width: 37.5%; } }
#checkout-custom [data-step="thank_you"] .section ~ .section {
padding-top: 43px; }
@media (min-width: 769px) {
#checkout-custom [data-step="thank_you"] .section ~ .section {
padding-top: 20px; } }
#checkout-custom .os-order-number {
color: #1e1e1e;
margin-bottom: 1px; }
#checkout-custom .section__header.os-header {
margin-bottom: 0; }
#checkout-custom .order-summary-toggle {
background-color: #ededed;
border: none;
padding: 8px 20px;
position: relative; }
#checkout-custom .order-summary-toggle__total-recap {
display: none; }
#checkout-custom .order-summary__section__content {
padding: 20px 0; }
#checkout-custom .order-summary-toggle__dropdown {
position: absolute;
right: 30px;
top: 50%;
margin-top: -4px;
transform: scale(1.5); }
#checkout-custom .field__input-btn-wrapper .field__input-btn {
width: 100%;
margin-top: 15px;
margin-left: 0;
padding: 15px 20px; }
@media (min-width: 769px) {
#checkout-custom .field__input-btn-wrapper .field__input-btn {
margin-top: 0;
margin-left: 15px;
width: auto; } }
#checkout-custom .field__input-btn-wrapper .btn__content {
display: block !important;
position: static !important;
height: auto !important;
width: auto !important; }
#checkout-custom .field__input-btn-wrapper .icon-svg {
display: none; }
#checkout-custom [data-step="payment_method"] {
padding-top: 10px; }
@media (min-width: 769px) {
#checkout-custom [data-step="payment_method"] {
padding-top: 0; } }
@media (max-width: 999px) {
#checkout-custom [data-step="payment_method"] {
padding-top: 0; } }
#checkout-custom .order-summary-toggle {
display: none; }
#checkout-custom .custom-toggle {
height: 44px;
background-color: #f2f2f2;
position: relative;
width: 100%;
border-top: 1px solid transparent;
border-bottom: 1px solid transparent;
text-align: left;
display: none; }
#checkout-custom .custom-toggle .custom-toggle__inner {
display: flex;
align-items: center; }
@media (max-width: 999px) {
#checkout-custom .custom-toggle {
display: flex;
align-items: center;
padding-bottom: 3px; } }
#checkout-custom .custom-toggle::after {
content: '';
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 0;
background: url("/cdn/shop/files/Down.svg?v=1629105291") 50% 50% no-repeat;
width: 12px;
height: 12px;
display: block; }
#checkout-custom .custom-toggle:focus, #checkout-custom .custom-toggle:active {
box-shadow: none; }
#checkout-custom .custom-toggle .custom-toggle__icon {
display: inline-block;
width: 24px;
height: 24px;
background: url("/cdn/shop/files/Bag.svg?v=1629105365") 50% 50% no-repeat;
background-size: contain;
position: relative;
margin-right: 10px; }
#checkout-custom .custom-toggle::before {
content: '';
position: absolute;
top: 0;
left: -9999px;
right: -9999px;
height: 1px;
background-color: #1e1e1e;
transition: opacity 0.4s;
opacity: 0; }
#checkout-custom .custom-toggle .custom-toggle__text__hide {
display: none; }
#checkout-custom .custom-toggle.active-toggle::before {
opacity: 1; }
#checkout-custom .custom-toggle.active-toggle .custom-toggle__text__show {
display: none; }
#checkout-custom .custom-toggle.active-toggle .custom-toggle__text__hide {
display: inline; }
#checkout-custom .custom-toggle.active-toggle::after {
transform: rotate(180deg);
margin-top: -2px; }
#checkout-custom .section__text {
color: #1e1e1e; }
#checkout-custom .section--payment-method .field__input {
padding-top: 0;
padding-bottom: 0; }
#checkout-custom .section--payment-method label.field__label {
top: -4px;
margin-left: 16px; }
@media (max-width: 999px) {
#checkout-custom .section--payment-method label.field__label {
top: -1px; } }
#checkout-custom [data-step="payment_method"] #continue_button {
min-width: auto;
padding-left: 30px;
padding-right: 30px; }
#checkout-custom .section--remember-me .content-box {
overflow: hidden; }
#checkout-custom .section--remember-me label.field__label {
top: -5px; }
#checkout-custom .section--remember-me .field__input {
padding: 16px 0 8px 46px; }
#checkout-custom .section--remember-me .ui-link--external__icon svg,
#checkout-custom .section--remember-me .helper--visually-hidden {
display: none; }
#checkout-custom .section--reductions {
display: none !important; }
.page--thank-you .content-box {
overflow: hidden; }
.page--thank-you .order-summary__section--total-lines {
position: relative !important; }
.page--thank-you .order-summary__section--total-lines:before {
display: block !important;
top: 0; }
.page--thank-you .step__footer__info {
position: relative;
padding-left: 24px; }
.page--thank-you .step__footer__info:before {
pointer-events: none;
content: '';
display: block;
position: absolute;
left: 0;
top: 4px;
background: url("/cdn/shop/files/help-tooltip-checkout.svg?v=1629894959") 50% 50% no-repeat;
width: 16px;
height: 16px; }
@media (max-width: 999px) {
.page--thank-you .step__footer__info:before {
display: none; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/giftcard/gift-card.scss */
.giftcard .giftcard__actions__btn {
height: 44px;
margin-bottom: 20px; }
.giftcard .giftcard__actions__btn:last-child {
margin-bottom: 0; }
.giftcard__container {
width: calc(100% - 10px); }
.giftcard__inner {
max-width: 480px;
margin: auto; }
.giftcard-outer-wrapper {
min-height: 100vh;
background-color: #1e1e1e;
padding: 26px 0 46px; }
@media (min-width: 769px) {
.giftcard-outer-wrapper {
padding: 46px 0 46px; } }
.giftcard__top {
text-align: center;
margin-bottom: 37px; }
.giftcard__content {
background-color: #fff;
box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
padding: 20px;
border-radius: 10px; }
@media (min-width: 1024px) {
.giftcard__content {
padding: 20px 35px; } }
.giftcard__content__top {
text-align: center;
margin-bottom: 16px; }
.giftcard__amount {
margin-right: -10px;
margin-top: -10px; }
@media (min-width: 1024px) {
.giftcard__amount {
margin-right: -25px; } }
.giftcard__content__middle {
background-color: #1e1e1e;
color: #fff;
padding: 20px;
border-radius: 10px;
margin-bottom: 20px;
min-height: 248px;
display: flex;
flex-wrap: wrap;
background-position: center;
background-size: cover;
background-repeat: no-repeat; }
@media (min-width: 1024px) {
.giftcard__content__middle {
padding: 20px 35px; } }
.giftcard__middle__row {
margin-bottom: 20px;
width: 100%; }
.giftcard__middle__row:last-child {
margin-bottom: 0 !important;
margin-top: auto; }
.giftcard__middle__row:nth-child(1) {
text-align: right; }
.giftcard__middle__row:nth-child(2) {
text-align: center;
margin-bottom: 40px; }
.giftcard__code {
color: #1e1e1e;
background-color: #fff;
height: 50px;
display: flex;
align-items: center;
justify-content: center; }
.giftcard__instructions {
text-align: center;
margin: auto auto 40px;
max-width: 240px; }
@media (min-width: 769px) {
.giftcard__instructions {
max-width: 100%; } }
.giftcard__detector {
margin-bottom: 40px;
text-align: center; }
#qr-code {
display: inline-block;
border: 1px solid #ededed;
padding: 10px;
border-radius: 10px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/collection/collection.scss */
.collection {
display: block;
padding-bottom: 60px;
padding-top: 30px;
position: relative; }
.collection .product-card {
visibility: hidden;
opacity: 0;
transition: visibility 0.4s, opacity 0.4s, transform 0.4s;
transform: matrix(1, 0, 0, 1, 0, 30); }
.collection .product-card.el-fade-in {
visibility: visible;
opacity: 1;
transform: matrix(1, 0, 0, 1, 0, 0); }
.collection .collection__grid__load__btn {
height: 44px; }
@media screen and (min-width: 768px) {
.collection-products-grid {
margin-left: auto;
transition: 0.25s; } }
@media (min-width: 1024px) {
.collection.has-lifestyle-images .hide-on-desktop {
display: none; } }
.collection__head {
text-align: center;
margin-bottom: 40px; }
@media (min-width: 1024px) {
.collection__head__form {
display: none; } }
.collection__inner {
padding: 0 10px; }
.collection__inner .products-count:empty {
display: none; }
.collection__grid__items {
display: flex;
flex-wrap: wrap;
margin: -10px -5px; }
@media (min-width: 1024px) {
.collection__grid__items.hide-last-product .collection__grid__item:nth-child(22) {
display: none; } }
.collection__grid__item {
width: 50%;
padding: 10px 5px; }
@media (min-width: 1024px) {
.collection__grid__item {
width: 33.33%; } }
.collection__grid__item--featured {
width: 100%; }
.collection__featured__entry__wrapper {
padding: 10px;
position: absolute;
left: 0;
width: 100%;
bottom: 0;
z-index: 5;
display: flex;
justify-content: flex-end; }
.collection__featured__entry {
background-color: #fff;
border: 1px solid #1e1e1e;
border-radius: 10px;
z-index: 4;
padding: 10px 15px;
color: #878787; }
.collection__featured__entry em {
color: #1e1e1e; }
.collection__featured__entry a {
color: #d95d00; }
.collection__featured__entry a:hover {
text-decoration: underline; }
.collection__featured__product {
margin-bottom: 20px; }
.collection__featured__product:last-child {
margin-bottom: 0; }
.collection__featured__image {
padding-top: 100%;
position: relative;
overflow: hidden;
border-radius: 10px; }
@media (max-width: 1023px) {
.collection__featured__image {
height: unset !important; } }
@media (min-width: 1024px) {
.collection__featured__image {
padding: 0;
height: calc(100% - 31px); } }
.collection__grid__load {
text-align: center;
padding-top: 40px; }
@media (min-width: 1024px) {
.collection__featured {
display: flex;
justify-content: space-between; }
.collection__featured.is-reversed {
flex-direction: row-reverse; } }
.collection__featured__content {
padding: 0 27px 20px; }
@media (min-width: 1024px) {
.collection__featured__content {
width: calc(66.66% - 5px);
padding: 0; } }
@media (min-width: 1024px) {
.collection__featured__products {
width: calc(33.33% - 5px); } }
.no-results-dynamic {
display: none; }
.no-products-in-search .no-results-dynamic {
display: inline; }
.no-products-in-search .no-results-dynamic ~ span {
display: none; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/product/product.scss */
.product {
display: block; }
.product > .mv--section:last-of-type {
margin-bottom: 0; }
.product__cta__actions {
position: fixed;
bottom: 0;
padding: 20px;
background-color: #fff;
z-index: 1001;
left: 0;
width: 100%;
border-top: 1px solid #ededed;
display: flex;
flex-direction: column;
gap: 0.5rem; }
@media (min-width: 1024px) {
.product__cta__actions {
position: static;
padding: 0;
border: 0;
margin-top: 35px;
max-width: 348px; } }
.product__cta__actions .btn, .product__cta__actions #onetrust-banner-sdk #onetrust-button-group button, #onetrust-banner-sdk #onetrust-button-group .product__cta__actions button {
font-size: 18px; }
.text-center {
text-align: center; }
.product--bottom {
padding-bottom: 1px; }
.product__reviews {
border-top: solid 1px rgba(0, 0, 0, 0.3);
padding: 35px 0; }
@media (min-width: 1024px) {
.product__reviews {
padding-top: 118px; } }
.product__reviews__title {
text-align: center; }
.template--product {
padding-bottom: 91px; }
@media (min-width: 1024px) {
.template--product {
padding-bottom: 0; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/account/account-address/account-address.scss */
/* ------------------------------------------------------------ *\
account-address
\* ------------------------------------------------------------ */
.account-address {
padding: 3px 10px 35px;
max-width: 1439px;
margin: auto; }
@media (min-width: 769px) {
.account-address {
padding: 3px 25px 35px; } }
@media (min-width: 1441px) {
.account-address {
padding: 3px 10px 35px; } }
.account-address__title--new-address {
text-align: center;
margin-bottom: 26px; }
@media (min-width: 769px) {
.account-address__title--new-address {
margin-bottom: 34px; } }
.account-address__default {
font-size: 12px;
line-height: 14px;
text-transform: uppercase;
font-weight: bold;
letter-spacing: 0.05em;
margin-bottom: 13px; }
@media (min-width: 769px) {
.account-address__default {
margin-bottom: 19px; } }
.account-adddress__add-address {
text-align: center;
margin-top: 21px; }
@media (min-width: 769px) {
.account-adddress__add-address {
text-align: right;
margin-bottom: 40px; } }
.account-address__list {
padding-top: 0;
display: flex;
flex-direction: column; }
@media (min-width: 1024px) {
.account-address__list {
padding-top: 64px; } }
.account-address__list > * + * {
padding-top: 20px; }
.account-address__item {
padding: 31px 28px 40px;
text-align: center;
border-radius: 10px;
margin-bottom: 0;
order: 2; }
@media (min-width: 769px) {
.account-address__item {
padding: 24px 28px;
text-align: left;
margin-bottom: 35px; } }
.account-address__item + .account-address__item {
margin-top: 13px; }
@media (min-width: 769px) {
.account-address__item + .account-address__item {
margin-top: 67px; } }
.account-address__item.account-address__item--default {
order: 1;
border: 1px solid #1e1e1e;
margin-top: 0;
margin-bottom: 13px; }
@media (min-width: 769px) {
.account-address__item.account-address__item--default {
margin-bottom: 67px; } }
.account-address__item--default + .account-address__item {
margin-top: 13px; }
@media (min-width: 769px) {
.account-address__item--default + .account-address__item {
margin-top: 67px; } }
.account-address__inner {
display: flex;
justify-content: space-between; }
.account-address__content {
width: 100%;
margin-left: 0; }
@media (min-width: 769px) {
.account-address__content {
width: calc(50% - 20px); } }
@media (min-width: 1441px) {
.account-address__content {
width: 49.7%;
margin-left: 118px; } }
.account-address__image {
display: none;
width: calc(50% - 20px); }
@media (min-width: 769px) {
.account-address__image {
display: block; } }
@media (min-width: 1441px) {
.account-address__image {
width: 32.85%; } }
.account-address__image img {
width: 100%; }
.account-address__item__footer {
margin-top: 14px;
display: flex;
justify-content: center; }
@media (min-width: 769px) {
.account-address__item__footer {
margin-top: 10px;
justify-content: flex-end; } }
.account-address__item__footer-btn {
margin-right: 19px;
text-transform: none; }
.account-address__item__footer-btn:last-child {
margin-right: 0; }
button.account-address__item__footer-btn:focus,
button.new-address-form__close:focus {
box-shadow: none; }
.account-address__item-inner {
display: block;
justify-content: space-between;
align-items: flex-end;
flex-wrap: wrap; }
@media (min-width: 769px) {
.account-address__item-inner {
display: flex; } }
.account-address__item-entry {
padding-right: 0; }
@media (min-width: 769px) {
.account-address__item-entry {
padding-right: 30px; } }
.account-address__popup {
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
background: rgba(30, 30, 30, 0.8);
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
display: flex;
align-items: flex-start;
justify-content: center;
padding: 15px;
overflow: auto;
z-index: 9999; }
@media (min-width: 769px) {
.account-address__popup {
align-items: center; } }
.account-address__popup-inner {
max-width: 597px;
width: 100%;
padding: 23px 15px 8px;
border-radius: 10px;
margin-top: 0;
background-color: #fff;
position: relative; }
@media (min-width: 769px) {
.account-address__popup-inner {
padding: 37px 65px 8px;
margin-top: -36px; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/account/account-dashboard/account-dashboard.scss */
/* ------------------------------------------------------------ *\
account-dashboard
\* ------------------------------------------------------------ */
.account-dashboard {
padding: 0 15px 40px;
max-width: 1211px;
margin: auto; }
.account-dashboard__logout {
text-decoration: underline;
text-align: center;
display: block; }
.account-dashboard__content-inner {
padding-top: 28px;
justify-content: space-between;
display: block; }
@media (min-width: 769px) {
.account-dashboard__content-inner {
padding-top: 33px;
display: flex; } }
.account-dashboard__featured-content {
width: calc(100% + 10px);
margin: 0 -5px; }
@media (min-width: 769px) {
.account-dashboard__featured-content {
width: 39.5%;
flex: 0 0 39.5%;
margin: 0; } }
.account-dashboard__content {
padding-top: 10px;
padding-right: 0;
max-width: 100%;
width: 100%;
text-align: center; }
@media (min-width: 769px) {
.account-dashboard__content {
max-width: 594px;
padding-right: 15px;
text-align: left; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/account/account-details/account-details.scss */
.account-details {
width: 50%; }
.account-details__title {
margin-bottom: 21px; }
@media (min-width: 769px) {
.account-details__title {
margin-bottom: 17px; } }
.account-details__btn {
margin-top: 25px; }
@media (min-width: 769px) {
.account-details__btn {
margin-top: 32px; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/account/account-forms/account-forms.scss */
/* ------------------------------------------------------------ *\
account-forms
\* ------------------------------------------------------------ */
.account-forms button:focus,
.account-forms button:active,
.account-forms a:focus,
.account-forms a:active {
outline: none !important;
box-shadow: none !important; }
.account-forms .form-row__error {
margin-bottom: 44px; }
@media (min-width: 769px) {
.account-forms .form-row__error {
margin-bottom: 44px; } }
.account-forms .form-row.double--single-mobile .form-row__error {
margin-bottom: 44px; }
@media (min-width: 769px) {
.account-forms .form-row.double--single-mobile .form-row__error {
margin-bottom: 29px; } }
.account-forms__error {
border: 1px solid #ef7875;
border-radius: 3px;
background-color: #fcebea;
padding: 10px 7px 10px 33px;
position: relative;
margin-bottom: 25px; }
@media (min-width: 769px) {
.account-forms__error {
margin-bottom: 20px;
padding: 7px 10px 7px 33px; } }
.account-forms__error::before {
content: '';
height: 3px;
width: 3px;
border-radius: 50%;
background-color: #ef7875;
position: absolute;
left: 15px;
top: 50%;
transform: translateY(-50%); }
.account-forms__error p,
.account-forms__error li {
color: #ef7875;
font-size: 14px;
line-height: 22px; }
@media (min-width: 769px) {
.account-forms__error p,
.account-forms__error li {
font-size: 16px;
line-height: 28px; } }
.account-forms #rc_login {
display: none; }
.account-forms__grid {
position: relative;
min-height: 100vh; }
@media (min-width: 769px) {
.account-forms__grid {
display: flex; } }
.account-forms__grid__title {
text-align: center;
text-transform: initial;
text-transform: uppercase;
margin-bottom: 28px; }
@media (min-width: 769px) {
.account-forms__grid__title {
margin-bottom: 20px; } }
.account-forms__grid__description {
text-align: center;
color: #1e1e1e;
margin-bottom: 20px;
font-size: 14px;
line-height: 22px; }
@media (min-width: 769px) {
.account-forms__grid__description {
font-size: 16px;
line-height: 28px; } }
.account-forms__grid__sign_in,
.account-forms__grid__sign_up {
flex: 1;
padding: 40px 20px; }
@media (min-width: 769px) {
.account-forms__grid__sign_in,
.account-forms__grid__sign_up {
padding: 149px 20px; } }
.account-forms__grid__sign_up .account-forms__grid__title {
margin-bottom: 14px; }
.account-forms__grid__sign_up .account-forms__grid__description {
margin-bottom: 22px; }
@media (min-width: 769px) {
.account-forms__grid__sign_up .account-forms__grid__description {
margin-bottom: 18px; } }
.account-forms__grid__sign_in.recover .account-forms__grid__title {
margin-bottom: 14px; }
.account-forms__grid__inner {
max-width: 467px;
margin: 0 auto; }
.account-forms__back {
padding-left: 17px;
display: flex;
position: relative; }
.account-forms__back span {
width: 17px;
position: absolute;
left: -5px;
top: calc(50% + 2px);
transform: translateY(-50%); }
.account-form__checkbox {
margin: 12px 0 13px; }
.account-forms__grid__description--recover p + p {
margin-top: 20px; }
@media (min-width: 769px) {
.account-forms__grid__description--recover p + p {
margin-top: 28px; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/account/account-login-form/account-login-form.scss */
/* Login form styles */
/*! path: /Users/logangelzer/Documents/overtime/src/modules/account/account-navigation/account-navigation.scss */
.account-navigation {
padding: 0 10px;
max-width: 100%;
margin: 0 auto 18px; }
@media (min-width: 769px) {
.account-navigation {
margin: 28px auto 41px; } }
@media (min-width: 1441px) {
.account-navigation {
max-width: 1360px; } }
.account-navigation__left__link {
display: flex;
align-items: center;
top: 50%;
left: 14px;
min-height: 33px;
transform: translateY(-50%); }
@media (min-width: 769px) {
.account-navigation__left__link {
left: 25px; } }
@media (min-width: 1441px) {
.account-navigation__left__link {
left: 83px; } }
.account-navigation__left__link__icon {
width: 11px;
height: 11px;
display: flex;
position: relative;
border-radius: 50%;
margin-left: 10px; }
.account-navigation__left__link__icon::before {
content: '';
border: solid black;
border-width: 0 1px 1px 0;
display: inline-block;
padding: 8px;
transform: rotate(135deg); }
.account-navigation__left__link__icon svg {
display: none;
margin: auto; }
.account-navigation__left__link__title {
padding-left: 22px;
display: none; }
@media (min-width: 769px) {
.account-navigation__left__link__title {
display: block; } }
.account-navigation__title {
margin-bottom: 19px; }
@media (min-width: 769px) {
.account-navigation__title {
margin-bottom: 25px; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/account/account-new-address/account-new-address.scss */
.new-address-form {
margin-bottom: 40px; }
.new-address-form__title {
margin-bottom: 25px; }
@media (min-width: 769px) {
.new-address-form__title {
margin-bottom: 45px; } }
@media (min-width: 769px) {
.new-address-form__group {
margin-bottom: 15px;
display: flex; } }
.new-address-form__input {
width: 100%;
margin-bottom: 15px; }
@media (min-width: 769px) {
.new-address-form__input {
margin-bottom: 0; } }
@media (min-width: 769px) {
.new-address-form__input + .new-address-form__input {
margin-left: 20px; } }
.new-address-form__footer {
margin-top: 25px;
margin-bottom: 40px; }
@media (min-width: 769px) {
.new-address-form__footer {
margin-top: 45px;
margin-bottom: 80px; } }
.new-address-form__close {
width: 23px;
height: 23px;
position: absolute;
top: 16px;
right: 14px;
display: flex;
align-items: center;
justify-content: center; }
@media (min-width: 769px) {
.new-address-form__close {
width: 35px;
height: 35px;
top: 14px;
right: 15px; } }
.new-address-form__close::before, .new-address-form__close::after {
content: '';
height: 24px;
width: 2px;
background-color: #1e1e1e;
position: absolute;
top: 50%;
left: 50%; }
@media (min-width: 769px) {
.new-address-form__close::before, .new-address-form__close::after {
height: 33px; } }
.new-address-form__close::before {
transform: translate(-50%, -50%) rotate(-45deg); }
.new-address-form__close::after {
transform: translate(-50%, -50%) rotate(45deg); }
.new-address-form__actions {
display: flex;
justify-content: space-between; }
.new-address-form__actions button {
width: calc(50% - 7px);
flex: 0 0 calc(50% - 7px);
min-width: auto; }
.new-address-form__edit .select-input__el {
color: #000; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/account/account-order/account-order.scss */
.account-order {
padding: 16px 15px 72px;
max-width: 1011px;
margin: auto; }
@media (min-width: 769px) {
.account-order {
padding: 90px 15px 100px; } }
.account-order .order__details {
margin-top: 11px; }
@media (min-width: 769px) {
.account-order .order__details {
margin-top: 14px; } }
.account-order .qview-product-handle {
position: absolute;
width: 100%;
left: 0;
height: 100%;
top: 0; }
.account-order__inner {
padding: 0 5px;
display: block;
margin-bottom: 48px; }
@media (min-width: 769px) {
.account-order__inner {
padding: 0 20px;
display: flex;
margin-bottom: 74px; } }
.account-order__info {
display: flex;
width: 100%;
flex: 0 0 100%; }
@media (min-width: 769px) {
.account-order__info {
width: 50.7%;
flex: 0 0 50.7%; } }
.account-order__info-col {
padding-right: 15px; }
.account-order__info-col:nth-child(1) {
width: 51.6%;
flex: 0 0 51.6%; }
@media (min-width: 769px) {
.account-order__info-col:nth-child(1) {
width: 50%;
flex: 0 0 50%; } }
.account-order__info-col:nth-child(2) {
flex: 1; }
.account-order__contact {
margin-top: 31px; }
@media (min-width: 769px) {
.account-order__contact {
margin-top: 67px; } }
.account-order__contact a {
color: #f60;
transition: opacity 0.25s; }
.account-order__contact a:hover {
opacity: 0.75; }
.account-order__title {
margin-bottom: 11px; }
@media (min-width: 769px) {
.account-order__title {
margin-bottom: 21px; } }
.account-order__title + p {
margin-top: -1px; }
@media (min-width: 769px) {
.account-order__title + p {
margin-top: -6px; } }
span + .account-order__title {
margin-top: 40px; }
@media (min-width: 769px) {
span + .account-order__title {
margin-top: 38px; } }
.account-order__title + span.status {
margin-top: -2px;
display: inline-block; }
@media (min-width: 769px) {
.account-order__title + span.status {
margin-top: 0; } }
.account-order__status {
margin-top: 38px; }
@media (min-width: 769px) {
.account-order__status {
margin-top: 0; } }
.account-order__section {
padding-bottom: 20px;
margin-bottom: 20px; }
.account-order__section--totals {
padding: 15px 14px;
border-radius: 10px;
border: 1px solid #1e1e1e;
max-width: 387px;
width: 100%; }
@media (min-width: 769px) {
.account-order__section--totals {
padding: 15px 19px 12px; } }
.account-order__section--line-items {
margin: 0 -5px 7px; }
@media (min-width: 769px) {
.account-order__section--line-items {
margin: 0 0 20px; } }
.account-order__wrapper-right {
display: flex;
justify-content: flex-end;
margin: 0 -5px; }
@media (min-width: 769px) {
.account-order__wrapper-right {
margin: -5px 0 0 0; } }
.account-order__section-pair {
display: flex;
justify-content: space-between; }
.account-order__summary-badge {
margin: 0.25em 0.5em 0.25em 0;
border: 2px solid #f2f2f2;
border-radius: 4px; }
.account-order__summary-badge > span {
padding: 0.25em 0.75em; }
.account-order__summary-badge__title {
display: inline-block;
background-color: #f2f2f2; }
.account-order__line-item__row {
padding: 10px 6px 10px;
border-radius: 10px;
border: 1px solid #1e1e1e; }
@media (min-width: 769px) {
.account-order__line-item__row {
padding: 18px 19px 21px; } }
.account-order__line-item__row + .account-order__line-item__row {
margin-top: 7px; }
@media (min-width: 769px) {
.account-order__line-item__row + .account-order__line-item__row {
margin-top: 15px; } }
.account-order__line-item__image {
width: 16%;
border-radius: 10px;
margin-right: 6px;
position: relative;
overflow: hidden; }
@media (min-width: 1024px) {
.account-order__line-item__image {
width: 100px;
margin-bottom: 0;
margin-right: 20px; } }
.account-order__line-item__info {
min-width: 100%; }
@media (min-width: 1024px) {
.account-order__line-item__info {
min-width: 0; } }
.account-order__headings {
display: flex;
flex: 1; }
.account-order__headings .account-order__heading {
padding-right: 6px; }
@media (min-width: 769px) {
.account-order__headings .account-order__heading {
padding-right: 15px; } }
.account-order__headings .account-order__heading:nth-child(1) {
width: 38%;
flex: 0 0 38%; }
@media (min-width: 769px) {
.account-order__headings .account-order__heading:nth-child(1) {
width: 29%;
flex: 0 0 29%; } }
.account-order__headings .account-order__heading:nth-child(2) {
width: 26%;
flex: 0 0 26%; }
@media (min-width: 769px) {
.account-order__headings .account-order__heading:nth-child(2) {
width: 29%;
flex: 0 0 29%; } }
.account-order__headings .account-order__heading:nth-child(3) {
flex: 1; }
.account-order__headings .account-order__heading:nth-child(4) {
width: 19%;
flex: 0 0 19%; }
@media (min-width: 769px) {
.account-order__headings .account-order__heading:nth-child(4) {
width: 13%;
flex: 0 0 13%; } }
.account-order__headings--padding {
padding: 0 6px 0 calc(16% + 12px); }
@media (min-width: 769px) {
.account-order__headings--padding {
padding: 0 19px 0 139px; } }
.account-order__line-item__title a {
color: #1e1e1e;
transition: color 0.25s; }
.account-order__line-item__title a:hover {
color: #08cfea; }
.account-order__line-item__variant-name {
color: #878787;
margin-top: -5px; }
.account-order__totals__title {
margin-bottom: 10px; }
.account-order__addresses__address {
background-color: #f2f2f2;
padding: 20px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/account/account-orders/account-orders.scss */
.account-orders {
width: calc(100% + 10px);
margin: 55px -5px 0; }
@media (min-width: 769px) {
.account-orders {
margin: 55px 0 0;
width: 100%; } }
.account-orders__title {
margin-bottom: 0; }
@media (min-width: 769px) {
.account-orders__title {
margin-bottom: 6px; } }
.order-orders__row {
display: flex; }
.order-orders__row--header {
padding: 20px 0 10px; }
@media (min-width: 769px) {
.order-orders__row--header {
padding: 20px 0 13px; } }
.order-orders__row--body {
border: 1px solid #1e1e1e;
border-radius: 10px;
padding: 13px 0; }
@media (min-width: 769px) {
.order-orders__row--body {
padding: 16px 0; } }
.order-orders__row--body + .order-orders__row--body {
margin-top: 7px; }
@media (min-width: 769px) {
.order-orders__row--body + .order-orders__row--body {
margin-top: 13px; } }
.order-orders__cell {
width: 3%;
display: block;
padding: 0 5px;
text-align: left; }
.order-orders__cell a {
transition: opacity 0.25s; }
.order-orders__cell a:hover {
opacity: 0.3; }
.order-orders__cell:nth-child(1) {
padding-left: 15px;
width: 22.3%; }
@media (min-width: 769px) {
.order-orders__cell:nth-child(1) {
width: 26.6%;
padding-left: 21px; } }
.order-orders__cell:nth-child(2) {
width: 22.5%; }
@media (min-width: 769px) {
.order-orders__cell:nth-child(2) {
width: 27%; } }
.order-orders__cell:nth-child(3) {
flex: 1; }
.order-orders__cell:nth-child(4) {
width: auto;
padding-right: 14px; }
@media (min-width: 769px) {
.order-orders__cell:nth-child(4) {
padding-right: 18px; } }
.order-orders__cell--body {
text-transform: capitalize; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/account/account-register-form/account-register-form.scss */
.register-form label.checkbox span {
color: #000;
font-size: 14px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/account/alert/alert.scss */
.alert {
padding: 10px;
background-color: #ededed;
border-radius: 3px; }
.alert--error {
color: red; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/account/page-title/page-title.scss */
.page-title {
margin: 50px auto 30px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/cart/cart-grid/cart-grid.scss */
.cart-grid-container {
background-size: cover;
background-repeat: no-repeat;
background-position: center center; }
.cart-grid-container__bg-image .img__el {
z-index: 0; }
.cart-grid {
position: relative;
min-height: 320px;
max-width: 1320px;
padding: 1px 0;
margin: 0 auto;
z-index: 1; }
@media (min-width: 769px) {
.cart-grid {
padding: 50px 0; } }
@media (min-width: 1024px) {
.cart-grid {
padding: 76px 0; } }
.cart-grid__inner {
overflow: hidden;
border: 1px solid #1e1e1e;
border-radius: 10px;
margin: 10px;
background-color: #fff; }
@media (min-width: 769px) {
.cart-grid__inner {
background-color: transparent;
display: flex;
align-items: flex-start;
margin: 0 20px;
border-radius: 0;
border: 0; } }
@media (min-width: 769px) {
.cart-grid__aside {
flex: 1;
margin-right: 86px;
border: 1px solid #1e1e1e;
border-radius: 10px;
background-color: #fff; } }
.cart-grid__content {
flex: 1;
min-height: 320px; }
@media (min-width: 769px) {
.cart-grid__content {
min-height: 1;
position: relative;
border: 1px solid #1e1e1e;
border-radius: 10px;
align-self: stretch;
background-color: #fff; } }
.cart-grid__subtitle {
margin: 20px 0; }
.cart-grid__header {
padding: 15px 20px 0; }
@media (min-width: 769px) {
.cart-grid__header {
padding-top: 9px; } }
@media (min-width: 769px) {
.cart-grid--default .cart__header__item {
padding: 5px 0 10px; } }
.cart__header__item:first-child {
border-left: 0;
width: 40%; }
.cart__header__item:nth-of-type(2) {
width: 20%; }
.cart__header__item:nth-of-type(3) {
width: 20%; }
.cart__header__item:last-child {
border-right: 0;
width: 20%; }
.cart-grid__items {
padding: 26px 20px 20px;
border-bottom: 1px solid #1e1e1e; }
@media (min-width: 769px) {
.cart-grid__items {
padding: 20px 20px 23px; } }
.cart-grid__items.is-loading {
opacity: 0.6;
pointer-events: none; }
.cart__body-item {
padding-top: 15px;
margin-bottom: 15px; }
.cart__subtotal {
padding-top: 15px;
margin-bottom: 10px;
display: flex;
justify-content: space-between; }
@media (min-width: 769px) {
.cart__subtotal {
padding-top: 23px;
margin-bottom: 19px; } }
.cart__subtotal span + span {
margin-left: 20px; }
.cart-grid__footer {
padding: 0 20px; }
.cart__footer__shipping {
padding: 11px 0 13px;
color: #878787; }
@media (min-width: 1024px) {
.cart__footer__shipping > p {
display: none; } }
.cart__footer__shipping__text p:first-child {
display: none; }
@media (min-width: 1024px) {
.cart__footer__shipping__text p:first-child {
display: block; } }
@media (min-width: 1024px) {
.cart__footer__shipping__text p + p {
display: none; } }
.cart__emojis {
font-size: 39px;
margin-bottom: 21px; }
.cart__empty-container {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column; }
.cart__empty-container .btn, .cart__empty-container #onetrust-banner-sdk #onetrust-button-group button, #onetrust-banner-sdk #onetrust-button-group .cart__empty-container button {
margin-top: 18px; }
.cart-grid__recommendations {
padding: 23px 20px;
border-bottom: 1px solid #1e1e1e; }
@media (min-width: 769px) {
.cart-grid__recommendations {
border-bottom: 0;
padding: 9px 20px; } }
.cart-grid__bars {
padding: 0 20px; }
.cart-grid--mini {
position: static;
max-width: 100%;
padding: 0;
margin: 0; }
.cart-grid--mini .cart-grid__content {
border: 0;
border-radius: 0;
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
display: flex;
flex-direction: column;
width: unset;
min-height: unset;
height: unset; }
.cart-grid--mini .cart-grid__container {
flex: 1;
overflow-y: auto; }
.cart-grid--mini .cart-grid__inner {
height: 100%;
margin: 0;
border: 0;
border-radius: 0;
overflow: unset; }
.cart-grid--mini .cart-grid__footer {
position: absolute;
left: 0;
width: 100%;
bottom: 0;
background-color: #fff;
border-top: 1px solid #1e1e1e;
z-index: 6;
padding-bottom: 20px; }
.cart-grid--mini .cart-grid__recommendations {
border-bottom: 0; }
.cart-grid--mini .cart-grid__header__wrapper {
background-color: #fff;
padding-bottom: 20px;
position: relative;
z-index: 1; }
.cart-grid--mini .cart-grid__items {
padding-top: 10px; }
.cart-grid--mini .cart__empty-container {
background-color: #fff; }
.cart-grid--mini,
.cart-grid--mini .cart-grid__inner {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
min-height: unset;
height: unset;
overflow: unset; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/cart/cart-grid-container/cart-grid-container.scss */
/* ------------------------------------------------------------ *\
Cart Grid Container
\* ------------------------------------------------------------ */
.cart-container {
border: 1px solid #1e1e1e;
border-radius: 10px;
margin: 10px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/cart/cart-item/cart-item.scss */
.cart-item {
padding-top: 15px;
margin-bottom: 15px;
border-top: 1px solid rgba(var(#000), 0.5); }
.cart-item__update {
opacity: 0.3;
pointer-events: none; }
.cart-item__update.is-active {
opacity: 1;
pointer-events: auto; }
.cart-item__info {
overflow: hidden;
display: flex; }
@media (min-width: 1024px) {
.cart-grid--default .cart-item__info {
text-align: left; } }
.cart-item__price {
padding-top: 2px; }
@media (min-width: 769px) {
.cart-item__price {
padding-top: 0; } }
.cart-item__price span {
display: inline-block; }
@media (min-width: 769px) {
.cart-item__price span {
display: block;
margin-top: -3px; } }
.cart-item__price span + span {
margin-left: 3px;
color: #878787;
text-decoration: line-through; }
.cart-item__total {
position: absolute;
top: 15px;
right: 0; }
.cart-item__quantity {
margin-top: 13px;
position: relative;
z-index: 1;
max-width: 120px; }
@media (min-width: 769px) {
.cart-item__quantity {
margin-top: 17px;
max-width: 135px; } }
.cart-grid--default .cart-item__quantity {
padding-left: 0; }
@media (min-width: 1024px) {
.cart-grid--default .cart-item__quantity {
padding-left: 0;
padding-right: 1em; } }
.cart-item__remove {
line-height: 1.2;
color: #878787;
padding-bottom: 11px;
margin-top: auto;
cursor: pointer;
text-align: right; }
.cart-item__remove:hover, .cart-item__remove:focus {
outline: none !important;
box-shadow: none !important; }
@media (min-width: 769px) {
.cart-item__remove {
padding-bottom: 3px; } }
.cart-item__remove__icon {
display: none;
color: #ccc; }
@media (min-width: 769px) {
.cart-item__remove__icon {
display: block; } }
.cart-item__remove__icon svg {
width: 18px; }
.cart-item__remove__label {
text-decoration: underline; }
@media (min-width: 769px) {
.cart-item__remove__label {
display: none; } }
.cart-item__featured {
width: 100%;
flex: 0 0 91px;
max-width: 91px;
background-color: #ededed;
border-radius: 10px;
height: 91px;
overflow: hidden; }
@media (min-width: 769px) {
.cart-item__featured {
height: 99px;
max-width: 99px;
flex: 0 0 99px; } }
.cart-item__featured::before {
padding-bottom: 100%; }
.cart-item__content {
flex: 1;
padding-left: 10px;
display: flex; }
@media (min-width: 769px) {
.cart-item__content {
padding-left: 15px; } }
.cart-item__aside {
display: flex;
flex-direction: column;
justify-content: space-between; }
.cart-item__details {
flex: 1; }
.cart-item__details__heading {
padding-bottom: 1px; }
.cart-item__details__description {
color: #878787;
display: flex;
flex-direction: column; }
@media (min-width: 769px) {
.cart-item__details__description {
margin-top: -5px; } }
@media (min-width: 1024px) {
.cart-item__title {
max-width: calc(100% - 60px); } }
.cart-item__variants {
display: flex;
flex-wrap: wrap;
padding-top: 15px;
margin: -3px; }
.cart-item__variant {
flex: 0 0 auto;
min-width: 36px;
line-height: 34px;
border: 1px solid #1e1e1e;
color: #1e1e1e;
background-color: #fff;
cursor: pointer;
margin: 3px;
padding: 0 3px;
border-radius: 6px;
transition: background-color 0.25s, color 0.25s; }
.cart-item__variant:hover {
background-color: #1e1e1e;
color: #fff; }
.cart-item-container {
padding: 17px 20px 20px;
border: 1px solid #1e1e1e;
border-radius: 10px; }
.cart-item-container .cart-item {
margin-bottom: 0; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/cart/cart-progress-bars/cart-progress-bars.scss */
/* ------------------------------------------------------------ *\
Cart Progress Bars
\* ------------------------------------------------------------ */
.cart-progress-bars {
padding-top: 12px; }
.cart-progress-bars strong {
font-weight: bold; }
.progress-bar {
height: 10px;
border-radius: 10px;
background-color: #ededed;
margin-top: 5px; }
@media (min-width: 769px) {
.progress-bar {
margin-top: 9px; } }
.progress-bar .progress-bar__inner {
height: 100%;
background-color: #3ff;
border-radius: 10px;
transition: width 0.25s; }
.progress-bar__container + .progress-bar__container {
display: none; }
.progress-bar__container.is-completed {
display: none; }
.progress-bar__container.is-completed + .progress-bar__container {
display: block; }
.progress-bar__checkbox {
position: relative; }
.progress-bar__checkbox > * {
position: absolute;
top: -7px;
filter: grayscale(1);
transition: filter 0.5s; }
.progress-bar__checkbox > *.is-reached {
filter: grayscale(0);
transition: filter 0.5s; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/free-images/free-images-download/free-images-download.scss */
/* ------------------------------------------------------------ *\
free-images-download
\* ------------------------------------------------------------ */
.free-images-download {
padding: 0 0 83px; }
@media (min-width: 769px) {
.free-images-download {
padding: 28px 0; } }
.free-images-download__inner {
padding: 0 10px; }
.free-images-download__title {
text-align: center;
margin-bottom: 4px; }
@media (min-width: 769px) {
.free-images-download__title {
margin-bottom: 32px; } }
.free-images-download__items {
display: flex;
flex-wrap: wrap;
margin: 0 -5px; }
.free-images-download__item {
padding: 0 5px;
width: 50%;
flex: 0 0 50%;
margin-bottom: 7px; }
@media (min-width: 769px) {
.free-images-download__item {
margin-bottom: -4px; } }
@media (min-width: 769px) {
.free-images-download__item {
width: 33.33%;
flex: 0 0 33.33%; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/free-images/free-images-form/free-images-form.scss */
/* ------------------------------------------------------------ *\
free-images-form
\* ------------------------------------------------------------ */
.free-images-form {
padding: 113px 0; }
@media (min-width: 769px) {
.free-images-form {
padding: 30px 0; } }
.free-images-form .attentive-signup__form {
position: relative; }
.free-images-form .attentive-signup__error {
position: absolute;
bottom: -32px;
left: 50%;
transform: translateX(-50%); }
@media (min-width: 769px) {
.free-images-form .attentive-signup__error {
bottom: -34px; } }
.free-images-form__inner {
display: flex;
align-items: center;
padding: 0 10px; }
.free-images-form__form {
text-align: center;
padding: 0 4% 20px 4%;
width: 100%;
flex: 0 0 100%; }
@media (min-width: 1024px) {
.free-images-form__form {
padding: 0 9% 20px 8.3%;
width: 50.35%;
flex: 0 0 50.35%; } }
.free-images-form__image {
flex: 1;
border-radius: 10px;
padding-top: 49.65%;
display: none;
background-size: cover;
background-position: center center;
background-repeat: no-repeat; }
@media (min-width: 769px) {
.free-images-form__image {
display: block; } }
.free-images-form__title {
margin-bottom: 34px; }
@media (min-width: 769px) {
.free-images-form__title {
margin-bottom: 32px; } }
.free-images-form__entry {
margin-top: 33px; }
.free-images-form__entry p + p {
margin-top: 28px; }
.free-images-form__entry a {
color: #f60;
transition: color 0.25s; }
.free-images-form__entry a:hover {
opacity: 0.75; }
.free-images-form__compliance {
font-size: 0.5rem;
margin-bottom: 5%; }
.free-images-form__compliance a {
color: #f60;
font-weight: bolder; }
.free-images-form__field {
padding: 2px 45px 2px 9px;
width: 100%;
border-radius: 108px;
background-color: #1e1e1e; }
.free-images-form__field input::-moz-placeholder {
color: #fff; }
.free-images-form__field input::placeholder {
color: #fff; }
.free-images-form__field input {
text-align: center; }
@media (min-width: 769px) {
.free-images-form__field input {
text-align: left; } }
.free-images-form__field .text-input__wrapper {
border: none; }
.free-images-form__field .text-input__el {
text-transform: uppercase;
color: #fff; }
.free-images-form__field .form-row__error__text-error {
bottom: -32px;
left: 30px; }
.free-images-form__wrapper {
width: 100%;
max-width: 378px;
display: inline-block;
position: relative;
padding: 0 7px; }
@media (min-width: 769px) {
.free-images-form__wrapper {
padding: 0; } }
.free-images-form__btn {
position: absolute;
right: 21px;
top: 50%;
transform: translateY(-50%); }
.free-images-form__btn::before {
content: '';
border: solid #fff;
border-width: 0 2px 2px 0;
display: inline-block;
padding: 4px;
transform: rotate(-45deg); }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/icons/icon/icon.scss */
.icon {
display: block; }
.icon svg {
display: block;
height: 100%;
width: 100%; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/page-404/section-error/section-error.scss */
/* ------------------------------------------------------------ *\
section-error
\* ------------------------------------------------------------ */
.section-error__inner {
text-align: center;
padding: 17vh 15px;
margin: auto;
max-width: 624px; }
@media (min-width: 769px) {
.section-error__inner {
padding: 123px 30px 202px; } }
.section-error__title {
margin-bottom: 28px; }
@media (min-width: 769px) {
.section-error__title {
margin-bottom: 47px; } }
.section-error__image {
padding: 0 37px;
margin-bottom: 23px; }
@media (min-width: 769px) {
.section-error__image {
padding: 0 30px;
margin-bottom: 65px; } }
.section-error__image img {
width: 100%; }
.section-error__actions a {
height: 44px;
min-width: 250px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/page-article/article-grid/article-grid.scss */
/* ------------------------------------------------------------ *\
article-grid
\* ------------------------------------------------------------ */
.article-grid {
padding: 18px 10px; }
@media (min-width: 769px) {
.article-grid {
padding: 31px 10px; } }
.article-grid__date {
text-align: center;
margin-bottom: -5px; }
@media (min-width: 769px) {
.article-grid__date {
margin-bottom: 6px; } }
.article-grid__title {
text-align: center;
margin-bottom: 23px; }
@media (min-width: 769px) {
.article-grid__title {
margin-bottom: 28px; } }
.article-grid__images .article-grid__item:nth-child(1) .article-grid__sticker {
right: 10%;
top: 2%; }
.article-grid__image {
position: relative;
padding-top: 56.3%; }
.article-grid__image img {
width: 100%;
border-radius: 10px; }
.article-grid__item {
margin-bottom: 29px; }
@media (min-width: 1024px) {
.article-grid__item {
margin-bottom: 121px; } }
.article-grid__multiple + .article-grid__item {
margin-bottom: 30px; }
@media (min-width: 1024px) {
.article-grid__multiple + .article-grid__item {
margin-bottom: 87px; } }
.article-grid__entry {
padding: 11px 10px;
line-height: 1.3em; }
@media (min-width: 1024px) {
.article-grid__entry {
padding: 11px 119px; } }
.article-grid__entry a {
color: #f60;
transition: color 0.25s; }
.article-grid__entry a:hover {
color: #000; }
.article-grid__multiple {
display: block;
flex-wrap: wrap; }
@media (min-width: 769px) {
.article-grid__multiple {
display: flex; } }
.article-grid__multiple .article-grid__entry {
padding: 10px 10px; }
@media (min-width: 769px) {
.article-grid__multiple .article-grid__entry {
padding: 9px 0; } }
.article-grid__multiple-column {
width: 100%; }
@media (min-width: 769px) {
.article-grid__multiple-column {
width: 42%;
flex: 0 0 42%; } }
.article-grid__multiple-column:nth-child(odd) {
width: 100%; }
@media (min-width: 769px) {
.article-grid__multiple-column:nth-child(odd) {
width: 58%;
flex: 0 0 58%; } }
.article-grid__multiple-column:nth-child(1) .article-grid__item:nth-child(1) {
margin-bottom: 31px; }
@media (min-width: 1024px) {
.article-grid__multiple-column:nth-child(1) .article-grid__item:nth-child(1) {
margin-bottom: 92px; } }
.article-grid__multiple-column:nth-child(1) .article-grid__item:nth-child(2) {
padding: 0; }
@media (min-width: 769px) {
.article-grid__multiple-column:nth-child(1) .article-grid__item:nth-child(2) {
padding: 0 14.4%; } }
.article-grid__multiple-column:nth-child(1) .article-grid__item:nth-child(2) .article-grid__entry {
padding: 12px 10px; }
@media (min-width: 769px) {
.article-grid__multiple-column:nth-child(1) .article-grid__item:nth-child(2) .article-grid__entry {
padding: 10px 10px; } }
.article-grid__multiple-column:nth-child(1) .article-grid__item:nth-child(2) .article-grid__image {
padding-top: 133.3%; }
.article-grid__multiple-column:nth-child(2) .article-grid__item:nth-child(1) {
padding: 0;
margin-bottom: 30px; }
@media (min-width: 769px) {
.article-grid__multiple-column:nth-child(2) .article-grid__item:nth-child(1) {
padding: 19.6% 0 0 21.7%;
margin-bottom: 32px; } }
.article-grid__multiple-column:nth-child(2) .article-grid__item:nth-child(1) .article-grid__image {
padding-top: 177.6%; }
.article-grid__multiple-column:nth-child(2) .article-grid__item:nth-child(1) .article-grid__entry {
padding: 13px 10px; }
@media (min-width: 769px) {
.article-grid__multiple-column:nth-child(2) .article-grid__item:nth-child(1) .article-grid__entry {
padding: 11px 10px; } }
.article-grid__multiple-column:nth-child(2) .article-grid__item:nth-child(2) {
padding: 0;
margin-bottom: 27px; }
@media (min-width: 1024px) {
.article-grid__multiple-column:nth-child(2) .article-grid__item:nth-child(2) {
padding: 28.9% 0 0 1.7%;
margin-bottom: 53px; } }
.article-grid__multiple-column:nth-child(2) .article-grid__item:nth-child(2) .article-grid__entry {
padding: 12px 10px; }
@media (min-width: 769px) {
.article-grid__multiple-column:nth-child(2) .article-grid__item:nth-child(2) .article-grid__entry {
padding: 10px 10px; } }
.article-grid__double {
display: block; }
@media (min-width: 769px) {
.article-grid__double {
display: flex;
margin-top: -34px; } }
.article-grid__double .article-grid__item {
width: 100%;
margin-bottom: 31px; }
@media (min-width: 1024px) {
.article-grid__double .article-grid__item {
margin-bottom: 83px; } }
@media (min-width: 769px) {
.article-grid__double .article-grid__item {
width: 50%;
flex: 0 0 50%; } }
.article-grid__double .article-grid__item:nth-child(1) {
padding: 0; }
@media (min-width: 769px) {
.article-grid__double .article-grid__item:nth-child(1) {
padding: 0 8.7% 0 8.4%; } }
.article-grid__double .article-grid__item:nth-child(2) {
padding: 0; }
@media (min-width: 769px) {
.article-grid__double .article-grid__item:nth-child(2) {
padding: 0 8.4% 0 0.35%; } }
.article-grid__double .article-grid__image {
padding-top: 133.3%; }
.article-grid__double .article-grid__entry {
padding: 9px 10px; }
@media (min-width: 769px) {
.article-grid__double .article-grid__entry {
padding: 11px 10px; } }
.article-grid__double + .article-grid__item {
padding-right: 0;
margin-bottom: 31px; }
@media (min-width: 1024px) {
.article-grid__double + .article-grid__item {
padding-right: 8.4%;
margin-bottom: 90px; } }
.article-grid__content {
max-width: 706px;
padding: 19px 10px;
margin: 0 auto 21px; }
@media (min-width: 1024px) {
.article-grid__content {
margin: 0 auto 92px; } }
@media (min-width: 769px) {
.article-grid__content {
padding: 0; } }
.article-grid__content h1,
.article-grid__content h2,
.article-grid__content h3,
.article-grid__content h4,
.article-grid__content h5,
.article-grid__content h6 {
margin-bottom: 1.7em; }
@media (min-width: 769px) {
.article-grid__content h1,
.article-grid__content h2,
.article-grid__content h3,
.article-grid__content h4,
.article-grid__content h5,
.article-grid__content h6 {
margin-bottom: 0.9em; } }
.article-grid__sticker {
top: 0;
left: 0; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/accordion/accordion.scss */
.accordion {
padding-bottom: 17px; }
.accordion--border-bottom {
border-bottom: 1px solid #f2f2f2; }
.accordion--border-top:first-of-type {
border-top: 1px solid #f2f2f2; }
@media (min-width: 415px) {
.accordion--footer {
max-width: 325px; } }
.accordion--full {
max-width: 100%; }
.accordion__title {
cursor: pointer;
position: relative;
padding: 19px 25px 0 0; }
.accordion__title:focus {
box-shadow: none; }
.accordion__title__icon::after, .accordion__title__icon::before {
content: '';
right: 3px;
height: 2px;
width: 10px;
top: calc(50% + 9px);
display: block;
position: absolute;
transform-origin: center;
background-color: #000;
transform: translateY(-50%);
transition: transform 300ms; }
.accordion__title__icon::before {
transform: translateY(-50%) rotate(90deg); }
.is-active .accordion__title__icon::before {
transform: translateY(-50%) rotate(0); }
.accordion--no-icon .accordion__title__icon {
display: none; }
.accordion__body {
overflow: hidden;
max-height: 0;
transition: all 0.2s linear; }
.accordion__body__content {
padding-top: 20px;
padding-bottom: 5px; }
.accordion--faq .accordion__body__content {
padding-top: 40px; }
@media (min-width: 769px) {
.accordion--faq .accordion__body__content {
padding-top: 75px; } }
.accordion__body__content p {
margin-bottom: 10px; }
.accordion__body__content p:empty {
margin-bottom: 0; }
.accordion__body__content p:last-of-type {
margin-bottom: 0; }
.accordion__body__content strong {
font-weight: bold; }
.accordion__body__content em {
font-style: italic; }
.accordion__body__content ul {
padding: 5px 0; }
.accordion__body__content ul li {
padding-left: 15px;
margin-bottom: 5px;
position: relative; }
.accordion__body__content ul li::before {
content: '';
left: 2px;
top: 9px;
width: 5px;
height: 5px;
border-radius: 50%;
position: absolute;
background: blue; }
.accordion__body__content ul li:last-of-type {
margin-bottom: 0; }
/**
* Accessibility styling
*/
.accordion.focus-within .accordion__title::before {
transform: translateY(-50%) rotate(0); }
.accordion.focus-within .accordion__body {
max-height: none !important; }
/**
* Accordion Faq Alt
*/
.accordion--faq-alt {
padding-bottom: 0;
border-bottom: 1px solid #000;
border-left: 1px solid #1e1e1e;
border-right: 1px solid #1e1e1e;
position: relative;
overflow: hidden; }
.accordion--faq-alt .accordion__body {
border-top: 1px solid #1e1e1e;
background-color: #ededed; }
.accordion--faq-alt .accordion__body a {
color: #ed6600;
transition: color 0.25s; }
.accordion--faq-alt .accordion__body a:hover {
color: #1e1e1e; }
.accordion--faq-alt .accordion__body__content {
padding: 20px 19px 20px 9px; }
@media (min-width: 769px) {
.accordion--faq-alt .accordion__body__content {
padding: 20px 24px; } }
.accordion--faq-alt .accordion__title {
padding: 9px 45px 9px 19px;
cursor: pointer;
position: relative; }
@media (min-width: 769px) {
.accordion--faq-alt .accordion__title {
padding: 8px 55px 8px 17px; } }
.accordion--faq-alt .accordion__title__icon::before, .accordion--faq-alt .accordion__title__icon::after {
right: 20px;
top: calc(50% + 1px);
width: 14px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/accordions-faq/accordion-faq.scss */
/* ------------------------------------------------------------ *\
Accordion-faq
\* ------------------------------------------------------------ */
.accordion-faq .accordion--faq-alt:nth-child(2) {
border-top: 1px solid #1e1e1e;
border-radius: 10px 10px 0 0; }
.accordion-faq .accordion--faq-alt:nth-last-child(1) {
border-radius: 0 0 10px 10px; }
.accordion-faq + .accordion-faq {
margin-top: 42px; }
@media (min-width: 769px) {
.accordion-faq + .accordion-faq {
margin-top: 40px; } }
.accordion-faq__title {
text-align: center;
margin-bottom: 18px; }
@media (min-width: 769px) {
.accordion-faq__title {
margin-bottom: 26px; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/animations/animations.scss */
.animated-el-within,
.animated {
opacity: 0;
transition: opacity 0.6s ease-in-out; }
.animated-el-within.is-animated,
.animated.is-animated {
opacity: 1; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/attentive-signup/attentive-signup.scss */
/* ------------------------------------------------------------ *\
Attentive Signup
\* ------------------------------------------------------------ */
.attentive-signup__input {
position: relative; }
.attentive-signup__input .form-row__error {
margin-bottom: 0; }
.attentive-signup__input .text-input__wrapper {
padding: 0;
border: 0;
height: 100%;
line-height: 44px; }
.attentive-signup__input .text-input__el {
border-radius: 50px;
height: 44px;
border: 1px solid #fff;
padding: 0 25px;
text-align: center;
text-transform: uppercase;
color: #fff;
font-size: 24px; }
@media (min-width: 769px) {
.attentive-signup__input .text-input__el {
text-align: left;
padding-right: 40px; } }
.attentive-signup__input .text-input__el::-moz-placeholder {
color: #fff; }
.attentive-signup__input .text-input__el::placeholder {
color: #fff; }
.attentive-signup__additional {
margin-top: 20px;
color: #878787;
text-align: center;
font-size: 10px;
line-height: 12px; }
@media (min-width: 769px) {
.attentive-signup__additional {
text-align: left; } }
.attentive-signup__additional a {
color: #f60; }
button.attentive-signup__btn {
font-size: 0;
display: inline-flex;
position: absolute;
right: 0;
top: 0;
height: 100%;
width: 40px;
min-width: 40px;
padding: 0;
z-index: 1;
list-style: initial; }
button.attentive-signup__btn:focus, button.attentive-signup__btn:active {
outline: none !important;
box-shadow: none !important;
color: currentColor !important; }
button.attentive-signup__btn svg {
width: 16px;
position: relative;
top: -1px; }
@media (min-width: 769px) {
button.attentive-signup__btn {
align-items: center;
justify-content: center; } }
/* ------------------------------------------------------------ *\
Attentive Black Color
\* ------------------------------------------------------------ */
.attentive-signup--black .text-input__el::-moz-placeholder {
border-color: #1e1e1e;
color: #1e1e1e; }
.attentive-signup--black .text-input__el::placeholder,
.attentive-signup--black .text-input__el {
border-color: #1e1e1e;
color: #1e1e1e; }
/* ------------------------------------------------------------ *\
Attentive Dark
\* ------------------------------------------------------------ */
.attentive-signup--dark .text-input__el::-moz-placeholder {
border-color: #1e1e1e;
color: #fff;
background-color: #1e1e1e; }
.attentive-signup--dark .text-input__el::placeholder,
.attentive-signup--dark .text-input__el {
border-color: #1e1e1e;
color: #fff;
background-color: #1e1e1e; }
.attentive-signup--dark .button__el svg {
color: #fff; }
/* ------------------------------------------------------------ *\
Attentive Dark
\* ------------------------------------------------------------ */
.attentive-signup--download .attentive-signup__input {
max-width: 378px;
margin: auto; }
.attentive-signup--download .text-input__el {
padding: 23px 40px 23px 25px; }
.attentive-signup--download .attentive-signup__btn {
right: 5px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/badges/badges.scss */
.badge__items {
display: flex;
flex-wrap: wrap;
margin: -10px; }
.badge__item {
padding: 10px; }
.badge__item__wrapper {
padding: 12px 20px;
border-radius: 10px;
align-items: center;
display: inline-flex;
justify-content: center;
border: 1px solid #1e1e1e;
background-color: #fff; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/button/button.scss */
button:focus,
.btn:focus,
#onetrust-banner-sdk #onetrust-button-group button:focus,
[class^='btn--']:focus {
box-shadow: 0 0 0 1px blue; }
.btn, #onetrust-banner-sdk #onetrust-button-group button {
height: 50px;
min-width: 235px;
text-align: center;
padding-left: 20px;
padding-right: 20px;
align-items: center;
display: inline-flex;
justify-content: center;
border-radius: 10px; }
.btn span, #onetrust-banner-sdk #onetrust-button-group button span {
display: block;
line-height: 100%; }
.btn.btn--full, #onetrust-banner-sdk #onetrust-button-group button.btn--full {
width: 100%; }
.btn.btn--black, #onetrust-banner-sdk #onetrust-button-group button.btn--black {
color: #fff;
background: #000; }
.btn.btn--compact, #onetrust-banner-sdk #onetrust-button-group button.btn--compact {
height: auto;
padding: 11px 9px;
min-width: initial;
line-height: 1.3; }
.btn.btn--small, #onetrust-banner-sdk #onetrust-button-group button {
height: auto;
padding: 5px 0;
min-width: initial;
line-height: 1.3; }
.btn.btn--underline, #onetrust-banner-sdk #onetrust-button-group button.btn--underline {
position: relative; }
.btn.btn--underline span::after, #onetrust-banner-sdk #onetrust-button-group button.btn--underline span::after {
content: '';
left: 0;
right: 0;
height: 1px;
bottom: 3px;
background: #000;
position: absolute; }
.btn--link, #onetrust-banner-sdk #onetrust-pc-btn-handler, .btn--link--sm,
.btn--reset {
padding: 0;
height: auto;
text-transform: initial;
text-align: left;
min-width: inherit;
text-decoration: underline;
line-height: 1.3; }
.btn--primary {
color: #1e1e1e;
border: 1px solid #1e1e1e;
background-color: #3ff;
transition: all 300ms; }
.btn--primary:disabled {
opacity: 1; }
.btn--primary.disabled {
opacity: 0.5;
pointer-events: none; }
.btn--primary:focus, .btn--primary:hover {
color: #fff;
background-color: #1e1e1e; }
.btn--primary.btn--compact {
height: 40px;
min-width: 180px;
padding: 0 15px 2px;
/* Accessibility Related */ }
.btn--primary.btn--compact:active {
outline: 2px dotted #000 !important;
outline-offset: 2px; }
.btn--secondary {
color: #1e1e1e;
border: 1px solid #1e1e1e;
background-color: #fff;
transition: all 300ms; }
.btn--secondary:focus, .btn--secondary:hover {
color: #1e1e1e;
background-color: #3ff; }
.btn--offset:hover, .btn--offset:focus {
box-shadow: 0.2em 0.2em 0 0 #1e1e1e; }
.btn--outlined {
color: #f2f2f2;
border: 2px solid #f2f2f2;
transition: all 300ms; }
.btn--outlined:hover:not(:disabled) {
color: #fff !important;
background-color: #000;
border: 2px solid #000; }
.btn--outlined:disabled {
opacity: 1; }
.btn--outlined.btn--outlined--disabled {
pointer-events: none; }
.btn--outlined span {
margin-bottom: 0; }
.btn--full-width {
width: 100%; }
.btn--link, #onetrust-banner-sdk #onetrust-pc-btn-handler {
text-decoration: none; }
.btn--link--sm {
text-decoration: none;
position: relative;
line-height: calc(1em + 6px); }
.btn--link::after, #onetrust-banner-sdk #onetrust-pc-btn-handler::after,
.btn--link--sm::after {
content: '';
position: absolute;
left: 0;
right: 0;
bottom: -5px;
height: 2px;
background-color: currentColor; }
.btn--circle {
width: 50px;
height: 50px;
min-width: 50px;
overflow: hidden;
border-radius: 50%;
background: #ededed; }
.btn--circle:active, .btn--circle:focus, .btn--circle:hover {
background: #000; }
.btn--circle:active svg, .btn--circle:focus svg, .btn--circle:hover svg {
color: #fff; }
.btn--circle.btn--medium {
padding: 0;
width: 40px;
height: 40px;
min-width: 40px; }
.btn--circle.btn--small, #onetrust-banner-sdk #onetrust-button-group button.btn--circle {
padding: 0;
width: 34px;
height: 34px;
min-width: 34px; }
.btn--circle.btn--top {
width: 60px;
height: 60px; }
.btn--circle svg {
height: auto; }
.btn--small-height {
height: 44px; }
.btn--length {
min-width: 250px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/cards/cards.scss */
/* ------------------------------------------------------------ *\
cards
\* ------------------------------------------------------------ */
.cards {
padding: 0; }
@media (min-width: 769px) {
.cards {
padding: 10px 0 0; } }
.cards__inner {
max-width: 1440px;
padding: 0 10px;
margin: auto; }
.cards__items {
display: block;
margin: 0 -5px; }
@media (min-width: 769px) {
.cards__items {
display: flex; } }
.cards__item {
padding: 0 5px;
max-width: 100%;
margin-bottom: 10px; }
@media (min-width: 769px) {
.cards__item {
flex: 0 0 50%;
max-width: 50%;
margin-bottom: 15px; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/carousel-indicator/carousel-indicator.scss */
.carousel-indicator {
width: 100%;
margin-top: 13px; }
.carousel-indicator__bullet {
height: 2px;
opacity: 0.5;
margin-left: 0;
transition: margin-left 0.2s ease-in-out; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/cart-gwp-widget/cart-gwp-widget.scss */
.cart-gwp-messages {
padding: 10px 20px 0;
display: grid;
gap: 15px; }
.cart-gwp-widget {
padding: 18px; }
.cart-gwp-widget.loading {
pointer-events: none;
opacity: 0.7; }
.cart-gwp-widget__title {
color: #000;
font-size: 21px; }
.cart-gwp__carousel .flickity-viewport {
overflow: visible; }
@media (min-width: 1024px) {
.cart-gwp__carousel .flickity-viewport {
overflow: hidden; } }
.cart-gwp__carousel .flickity-page-dots {
position: static;
max-width: 1200px;
display: none;
border-radius: 40px;
overflow: hidden;
margin: 26px auto 0;
background-color: #ededed; }
@media (min-width: 769px) {
.cart-gwp__carousel .flickity-page-dots {
display: flex; } }
.cart-gwp__carousel .flickity-page-dots .dot {
flex: 1;
border-radius: 40px;
height: 5px;
width: auto;
background-color: #ededed;
transition: background-color 0.4s;
opacity: 1;
margin: 0; }
.cart-gwp__carousel .flickity-page-dots .dot.is-selected {
background-color: #1e1e1e; }
.cart-gwp-item__single {
padding-bottom: 10px;
margin-right: 10px;
width: 266px; }
@media (min-width: 769px) {
.cart-gwp-item__single {
width: calc((100% - 20px) / 3); } }
.cart-gwp-item__lock {
left: 0;
top: 0;
height: 100%; }
.cart-gwp-item__lock__icon {
top: 10px;
right: 10px; }
.cart-gwp-item,
.cart-gwp-item__info {
display: grid;
gap: 2px; }
.cart-gwp-item__featured {
padding-bottom: 100%; }
.cart-gwp-item__featured .img {
border-radius: 15px; }
.cart-gwp-item__details {
display: grid;
gap: 6px; }
.cart-gwp-item__details__heading {
line-height: 1.1; }
.cart-gwp-item__variants {
display: flex;
flex-wrap: wrap;
gap: 4px; }
.cart-gwp-item__variants .cart-gwp-item__variant {
padding: 6px 2px;
font-weight: 400;
min-width: 25px;
border-radius: 4px;
background-color: #ededed;
line-height: 1;
border: solid 1px transparent; }
.cart-gwp-item__variants .cart-gwp-item__variant.is-selected {
border-color: #000; }
.cart-gwp-item__variants .cart-gwp-item__variant:disabled {
opacity: 0.6;
pointer-events: none; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/cart-recommendations/cart-recommendations.scss */
/* ------------------------------------------------------------ *\
Cart Recommendations
\* ------------------------------------------------------------ */
.cart-recommendations__carousel {
margin: 0 -20px; }
.cart-recommendations__carousel .product-card-slider__item {
width: 250px;
padding-right: 10px; }
.cart-recommendations__carousel .product-card-slider__item:first-child {
padding-left: 20px;
width: 260px; }
.cart-recommendations__carousel .product-card-slider__item:last-child {
padding-right: 20px;
width: 260px; }
.cart-recommendations__title {
margin-bottom: 18px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/checkbox/checkbox.scss */
.checkbox {
display: block;
min-height: 1.6rem; }
.checkbox.spaced-top {
padding-top: 24px; }
.checkbox.spaced-bottom {
padding-bottom: 24px; }
.checkbox .checkbox__wrapper {
display: block;
height: 100%; }
.checkbox .checkbox__label {
display: block;
height: auto;
position: relative;
transition: all ease 0.3s;
padding-top: 2px;
font-size: 14px; }
.checkbox .checkbox__label:focus, .checkbox .checkbox__label:active {
outline: none !important;
box-shadow: none !important; }
.checkbox .checkbox__label span {
display: block;
min-height: 1rem;
line-height: 22px;
padding-left: 35px;
text-transform: none;
transition: all ease 0.3s; }
.checkbox .checkbox__label a {
color: #000;
text-decoration: underline; }
.checkbox .checkbox__label:focus .checkbox__icon, .checkbox .checkbox__label:active .checkbox__icon, .checkbox .checkbox__label:hover .checkbox__icon {
border-color: #000 !important; }
.checkbox .checkbox__label.is-active .checkbox__icon {
background: #3ff;
border-color: transparent !important; }
.checkbox .checkbox__label.is-active .checkbox__icon svg {
opacity: 1;
border-radius: 50%; }
.checkbox .checkbox__label.is-active .checkbox__icon svg.checkbox__icon-loading {
opacity: 0; }
.checkbox .checkbox__icon {
top: 3px;
width: 20px;
height: 20px;
position: absolute;
margin-right: 10px;
transition: all ease 0.3s;
border: 2px solid #ccc;
border-radius: 50%; }
.checkbox .checkbox__icon svg {
opacity: 0;
width: 20px;
display: block;
margin: -2px 0 0 -2px;
transition: all 0.25s cubic-bezier(0.165, 0.84, 0.44, 1); }
.checkbox.fixed {
position: relative; }
.checkbox--align-t {
align-items: flex-start; }
.is-error.checkbox__icon {
border: 1px solid red; }
.checkbox--align-t .checkbox__icon {
margin-top: 2px; }
.checkbox__icon-el {
opacity: 0;
z-index: 1;
width: 15px;
height: 15px;
display: block;
flex: 0 0 auto;
cursor: pointer;
margin-right: 10px;
position: relative; }
.checkbox__icon-el:checked + .checkbox__icon-tick {
opacity: 1; }
.checkbox__icon-tick {
width: 10px;
position: absolute;
top: 1px;
right: 0;
bottom: 0;
left: 0;
margin: auto;
z-index: 0;
opacity: 0;
transition: opacity 300ms ease-in-out; }
.checkbox__icon-loading {
width: 10px;
position: absolute;
top: 1px;
right: 0;
bottom: 0;
left: 0;
margin: auto;
z-index: -1;
opacity: 0;
transition: opacity 300ms ease-in-out;
animation: spin 1.2s linear infinite; }
.is-error + .checkbox__label {
color: red; }
.checkbox--circle {
margin-top: -3px;
margin-bottom: -3px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/checkbox-group/checkbox-group.scss */
.multi-option {
position: relative;
/* Resolves autocomplete white background issue */ }
.multi-option input:-webkit-autofill,
.multi-option input:-webkit-autofill:hover,
.multi-option input:-webkit-autofill:focus,
.multi-option input:-webkit-autofill:active {
transition-delay: 9999s; }
.multi-option__wrapper {
padding: 1rem 0 1.2rem;
height: auto;
line-height: initial;
position: relative; }
.multi-option__el_list {
display: block;
width: 100%; }
.multi-option__el {
position: relative;
height: 2.25rem;
line-height: 2.25rem;
transition: all 200ms;
z-index: 2;
width: 100%;
margin: 0 0 0.3rem; }
.multi-option__el:last-child {
margin-bottom: 0; }
.multi-option__el.is-active .multi-option__icon {
border: 2px solid #000; }
.multi-option__el.is-active .multi-option__icon span {
background: #000;
width: 10px;
height: 10px; }
.multi-option__el.is-active .multi-option__icon svg {
opacity: 1; }
.multi-option__title {
display: block;
z-index: 1;
width: 100%;
height: 2.25rem;
line-height: 2.25rem; }
.multi-option__label > span {
display: block;
z-index: 1;
width: 100%;
height: 2.25rem;
line-height: 2.25rem;
cursor: pointer;
padding: 0 0 0 1.8rem;
transition: padding 0.3s ease; }
.multi-option__label:focus .multi-option__icon, .multi-option__label:active .multi-option__icon, .multi-option__label:hover .multi-option__icon {
border-color: #000 !important; }
.multi-option__icon {
width: 20px;
height: 20px;
position: absolute;
border: 2px solid #ccc;
margin-right: 10px;
top: 7px;
transition: all ease 0.3s; }
.multi-option__icon span {
display: block;
width: 2px;
height: 2px;
background: none;
border-radius: 50%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
transition: all ease 0.3s; }
.multi-option__icon.multi-option__icon-checkbox span {
display: none !important; }
.multi-option__icon.multi-option__icon-checkbox svg {
opacity: 0;
display: block;
margin: -2px 0 0 -2px;
width: 20px;
transition: all 0.25s cubic-bezier(0.165, 0.84, 0.44, 1); }
.multi-option__input {
display: block;
visibility: hidden;
width: 1px;
height: 1px; }
.multi-option__error {
position: absolute;
bottom: 0;
height: 1rem;
line-height: 1rem;
font-size: 0.8rem;
color: red;
opacity: 0;
transform: translateY(-0.5em);
transition: opacity 300ms ease, transform 300ms ease; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/collection-sort/collection-sort.scss */
.collection-sort {
display: flex;
align-items: center; }
.collection-sort__wrapper {
display: flex;
align-items: center;
padding: 0.5rem;
background: #fff;
border-radius: 50px;
gap: 0.25rem; }
.collection-sort__label {
font-size: 0.875rem;
font-weight: 500;
color: var(--color-text);
margin: 0; }
.collection-sort__select-wrapper {
position: relative;
display: inline-block; }
.collection-sort__select {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background: var(--color-background);
border: 1px solid var(--color-border);
border-radius: 4px;
padding: 0;
font-size: 15px;
color: var(--color-text);
cursor: pointer; }
.collection-sort__select:focus {
outline: none;
border-color: var(--color-primary);
box-shadow: 0 0 0 2px rgba(var(--color-primary-rgb), 0.1); }
.collection-sort__select:hover {
border-color: var(--color-border-hover); }
.collection-sort__arrow {
position: absolute;
right: 0.75rem;
top: 50%;
transform: translateY(-50%);
pointer-events: none;
color: var(--color-text-secondary);
transition: transform 0.2s ease; }
.collection-sort__select:focus + .collection-sort__arrow {
transform: translateY(-50%) rotate(180deg); }
.collection-sort.is-loading {
opacity: 0.6;
pointer-events: none; }
@media (max-width: 768px) {
.collection-sort__wrapper {
align-items: center;
justify-content: flex-end;
gap: 0.25rem; }
.collection-sort__select {
width: 100%;
min-width: auto; } }
.collection-sort[v-cloak] {
display: none; }
.facets-wrapper.is-active ~ .collection-sort {
margin-top: 1rem; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/contact-us-form-page/contact-us-form.scss */
/* ------------------------------------------------------------ *\
contact-us-form
\* ------------------------------------------------------------ */
.contact-us-form {
padding: 10px 0;
max-width: 700px;
margin: 0 auto; }
@media (min-width: 769px) {
.contact-us-form {
padding: 10px 15px; } }
.contact-us-form__head {
text-align: center;
margin-bottom: 34px; }
@media (min-width: 769px) {
.contact-us-form__head {
margin-bottom: 47px; } }
.contact-us-form__entry {
text-align: justify; }
.contact-us-form__title {
color: #1e1e1e;
margin-bottom: 17px; }
.contact-us-form__row + .contact-us-form__row {
margin-top: 15px; }
.contact-us-form__row--half {
width: 100%;
display: inline-block; }
@media (min-width: 769px) {
.contact-us-form__row--half {
width: calc(50% - 12px); } }
.contact-us-form__row--half + .contact-us-form__row--half {
margin-left: 0; }
@media (min-width: 769px) {
.contact-us-form__row--half + .contact-us-form__row--half {
margin-left: 19px; } }
.contact-us-form__btn {
width: 100%;
height: 44px; }
.contact-us-form__actions {
margin-top: 11px; }
.contact-us-form__actions.disabled button {
opacity: 0.5;
pointer-events: none; }
.contact-us-form__row--select .field .select-input__el-wrap {
position: relative;
padding: 0; }
.contact-us-form__row--select .field .select-input__el-wrap::before {
content: '';
border: solid black;
border-width: 0 2px 2px 0;
display: inline-block;
padding: 5px;
transform: translateY(-50%) rotate(45deg);
position: absolute;
right: 11px;
top: calc(50% - 4px); }
.contact-us-form__row--select .field .select-input__el-wrap select {
padding-left: 15px;
padding-right: 15px; }
.contact-us-form__row--select .select-input__icon {
display: none; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/dropdown-menu/dropdown-menu.scss */
.dropdown-menu {
position: relative;
/* Resolves autocomplete white background issue */ }
.dropdown-menu input:-webkit-autofill,
.dropdown-menu input:-webkit-autofill:hover,
.dropdown-menu input:-webkit-autofill:focus,
.dropdown-menu input:-webkit-autofill:active {
transition-delay: 9999s; }
.dropdown-menu .dropdown-menu__wrapper {
height: auto;
position: relative;
line-height: initial; }
.dropdown-menu .dropdown-menu__label,
.dropdown-menu .dropdown-menu__arrow {
position: absolute;
bottom: initial;
margin: auto;
height: 44px;
line-height: 44px;
transition: all ease 200ms;
z-index: 2;
pointer-events: none;
padding: 0 1em;
top: 0; }
.dropdown-menu .dropdown-menu__arrow {
border: solid 1px #ccc;
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
border-left: 0;
right: 0;
top: 0; }
.dropdown-menu .dropdown-menu__arrow svg {
display: block;
width: 14px;
height: 100%; }
.dropdown-menu .dropdown-menu__value {
border: 1px solid #ccc;
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
height: 44px;
line-height: 44px;
overflow: hidden;
padding: 0 1em;
pointer-events: none;
position: absolute;
top: 0;
transition: all ease 0.3s;
white-space: nowrap;
width: calc(100% - 47px);
z-index: 1; }
.dropdown-menu .dropdown-menu__error {
position: absolute;
bottom: 0;
height: 1rem;
line-height: 1rem;
font-size: 0.8rem;
color: red;
opacity: 0;
transition: all 0.3s ease;
z-index: -1;
pointer-events: none; }
.dropdown-menu .dropdown-menu__el {
z-index: 1;
opacity: 0;
width: 100%;
height: 44px;
display: block;
cursor: pointer; }
.dropdown-menu.is-active .dropdown-menu__label {
display: none; }
.dropdown-menu.is-focus .dropdown-menu__value,
.dropdown-menu.is-focus .dropdown-menu__arrow {
border: 1px solid #000; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/empty-view/empty-view.scss */
.empty-view {
margin: 20px 0 40px;
padding: 20px 25px; }
@media (min-width: 769px) {
.empty-view {
margin-top: 40px;
padding: 50px; } }
.empty-view__title {
margin-bottom: 25px; }
@media (min-width: 769px) {
.empty-view__title {
margin-bottom: 30px; } }
.empty-view__image {
width: 100%;
max-width: 135px;
margin: 0 auto 25px; }
@media (min-width: 769px) {
.empty-view__image {
max-width: 180px;
margin-bottom: 35px; } }
.empty-view__image::before {
padding-top: 88.88889%; }
@media (min-width: 769px) {
.empty-view__image::before {
padding-top: 61.11111%; } }
.empty-view__button {
display: inline-block; }
@media (min-width: 769px) {
.empty-view__button {
min-width: 250px; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/facet/facets.scss */
.facets-wrapper {
min-width: 0;
max-width: 0;
width: 0;
transition: 0.25s;
background-color: #fff;
float: left;
position: sticky;
top: 107px;
z-index: 10; }
.facets-wrapper .facets-container {
opacity: 0;
transition: 0.25s;
width: 100%;
display: flex;
flex-direction: column;
height: 100%; }
.facets-wrapper.is-active {
padding-right: 10px;
min-width: 310px;
max-width: 310px;
width: 100%; }
.facets-wrapper.is-active .facets-container {
opacity: 1; }
@media screen and (min-width: 768px) {
.facets-wrapper.is-active + .collection-products-grid {
width: calc(100% - 320px); } }
.facets-header {
display: none;
justify-content: flex-end;
padding: 10px 3px 20px; }
.facets-footer {
display: none;
gap: 5px;
padding-bottom: 55px; }
.facets-footer .btn, .facets-footer #onetrust-banner-sdk #onetrust-button-group button, #onetrust-banner-sdk #onetrust-button-group .facets-footer button {
min-width: unset;
font-size: 18px; }
.facets-body {
flex: 1;
padding-bottom: 10px;
overflow-y: auto; }
@media screen and (max-width: 767px) {
.facets-wrapper.is-active {
padding: 10px;
position: fixed;
z-index: 1000;
top: 0;
left: 0;
height: 100%;
max-width: 420px;
width: 100%; }
.facets-header,
.facets-footer {
display: flex; }
.filters-clear-desktop {
display: none; } }
.mobile-facets__open-wrapper {
display: flex;
justify-content: space-between;
align-items: center;
position: absolute;
gap: 10px;
width: calc(100vw - 20px);
padding: 10px 0;
transform: translateY(-100%);
top: 10px; }
.mobile-facets__open {
display: flex;
align-items: center;
padding: 5px;
background-color: #fff; }
.mobile-facets__open svg {
width: 20px; }
.mobile-facets__open:focus {
outline: none !important;
box-shadow: none !important; }
@media screen and (max-width: 767px) {
.mobile-facets__open {
gap: 5px;
border: solid 1px;
border-radius: 5px;
padding: 3px 5px; } }
.mobile-facets__details {
padding: 10px;
border-top: solid 1px #d9d9d9; }
.mobile-facets__details[open] .mobile-facets__arrow::after {
transform: rotate(0deg); }
.mobile-facets__details:last-child {
border-bottom: solid 1px #d9d9d9; }
.mobile-facets__summary {
list-style: none;
font-weight: 600;
text-transform: uppercase;
font-size: 18px;
position: relative;
font-family: "Oswald", sans-serif; }
.mobile-facets__summary::-webkit-details-marker {
display: none; }
.mobile-facets__summary .mobile-facets__arrow {
position: absolute;
right: 20px;
top: 50%;
transform: translateY(-50%); }
.mobile-facets__summary .mobile-facets__arrow::before, .mobile-facets__summary .mobile-facets__arrow::after {
content: "";
width: 14px;
height: 1px;
display: block;
background-color: #000;
position: absolute;
transition: 0.25s ease; }
.mobile-facets__summary .mobile-facets__arrow::after {
transform: rotate(90deg); }
.facets-layout-list {
display: flex;
flex-direction: column;
gap: 10px;
padding: 10px 0; }
.facets-layout-list input[type="checkbox"],
.facets-layout-list input[type="radio"] {
display: none; }
.facets-layout-list--swatch,
.facets-layout-list--size {
flex-direction: row;
flex-wrap: wrap;
gap: 5px; }
.facets__label {
display: flex;
align-items: center;
gap: 5px;
line-height: 1; }
.facets__label--size {
border: solid 1px #ededed;
border-radius: 6px;
min-width: 44px;
height: 44px;
font-size: 16px;
padding: 5px;
transition: border-color 0.4s;
background-color: #ededed;
justify-content: center; }
.mobile-facets__check {
display: inline-flex; }
.mobile-facets__checkbox + label {
cursor: pointer; }
.mobile-facets__checkbox + label .icon-checked {
display: none; }
.mobile-facets__checkbox + label .icon-empty,
.mobile-facets__checkbox + label .icon-checked {
width: 18px;
height: 18px; }
.mobile-facets__checkbox + label .icon-empty {
display: block;
border: solid 1px;
border-radius: 6px; }
.mobile-facets__checkbox:checked + label .icon-checked {
display: block; }
.mobile-facets__checkbox:checked + label .icon-empty {
display: none; }
.mobile-facets__checkbox:checked + .facets__label--size {
border-color: #000; }
.mobile-facets__checkbox:checked + .facets__label--product-type {
font-weight: 600; }
.swatch {
background: var(--swatch--background); }
.swatch-input__label {
display: inline-flex;
cursor: pointer;
width: 44px;
align-items: center;
justify-content: center;
flex-direction: column;
font-size: 14px;
text-align: center;
gap: 3px; }
.swatch-input__label svg {
display: none; }
.swatch.swatch--square {
display: flex;
transition: 0.25s;
align-items: center;
justify-content: center;
width: 44px;
height: 44px;
border-radius: 5px;
border: solid 1px transparent; }
.swatch--black {
color: #fff; }
.swatch-input__input:checked + .swatch-input__label svg {
display: block; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/featured-blog/featured-blog.scss */
/* ------------------------------------------------------------ *\
featured-blog
\* ------------------------------------------------------------ */
.featured-blog {
border-radius: 10px;
overflow: hidden; }
.featured-blog:hover .featured-blog__image {
transform: scale(1.08); }
.featured-blog:hover .featured-blog__body a {
opacity: 0.3; }
.featured-blog__image {
padding-top: 74.8%;
width: 100%;
display: block;
transition: transform 0.25s;
background-size: cover;
background-position: center center;
background-repeat: no-repeat; }
.featured-blog__head {
overflow: hidden; }
.featured-blog__body {
padding: 18px 21px 27px;
background-color: #ededed; }
@media (min-width: 769px) {
.featured-blog__body {
padding: 18px 21px; } }
.featured-blog__body a {
transition: opacity 0.25s; }
.featured-blog__title {
margin-bottom: 9px; }
@media (min-width: 769px) {
.featured-blog__title {
margin-bottom: 5px; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/featured-blogs/featured-blogs.scss */
/* ------------------------------------------------------------ *\
featured-blogs
\* ------------------------------------------------------------ */
.featured-blogs {
padding: 0;
margin: 0 -5px; }
@media (min-width: 769px) {
.featured-blogs {
padding: 10px 0;
margin: 0; } }
.featured-blogs .flickity-page-dots {
bottom: -27px; }
.featured-blogs .dot {
width: 6px;
height: 6px;
margin: 0 3px;
background: transparent;
border: 1px solid #000;
opacity: 0.3;
transition: opacity 0.25s, background 0.25s; }
.featured-blogs .dot.is-selected {
background: #000;
opacity: 1; }
.featured-blogs__title {
text-align: center;
margin-bottom: 17px; }
@media (min-width: 769px) {
.featured-blogs__title {
text-align: left;
margin-bottom: 27px; } }
.featured-blogs__items::after {
content: 'flickity';
display: none; }
@media (min-width: 769px) {
.featured-blogs__items::after {
content: ''; } }
.featured-blogs__item {
width: 100%;
padding: 0 5px; }
@media (min-width: 769px) {
.featured-blogs__item {
padding: 0; } }
.featured-blogs__item + .featured-blogs__item {
margin-top: 0; }
@media (min-width: 769px) {
.featured-blogs__item + .featured-blogs__item {
margin-top: 19px; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/field/field.scss */
/* ------------------------------------------------------------ *\
field
\* ------------------------------------------------------------ */
.field .text-input__el,
.field .select-input__el {
font-size: 14px;
line-height: 24px;
width: 100%;
display: block; }
.field .text-input__wrapper,
.field .select-input__el-wrap {
padding: 0 15px;
border: 1px solid #1e1e1e;
border-radius: 10px; }
.field .text-input__error {
position: static; }
.field::-moz-placeholder {
color: #878787; }
.field::placeholder {
color: #878787; }
.field--select .select-input__el {
padding: 9px 45px 9px 0;
height: 42px;
color: #878787; }
.field--textarea.text-input {
height: 180px;
resize: none; }
.field--textarea.text-input .text-input__wrapper {
height: auto; }
.field--textarea.text-input .text-input__el.text-input__text-area {
border: none;
padding-top: 7px;
padding-bottom: 7px; }
.field--textarea.text-input .text-input__label {
display: none; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/footer/footer.scss */
/* ------------------------------------------------------------ *\
Footer
\* ------------------------------------------------------------ */
.footer {
background-color: #1e1e1e;
color: #fff; }
.footer .marquee-text-text {
padding: 0 24px;
color: #1e1e1e; }
.footer .attentive-signup__additional {
color: #ccc; }
.footer__bar {
height: 37px;
display: flex;
align-items: center;
padding-top: 4px;
overflow: hidden; }
.footer__logos {
height: 70px;
background-color: #1e1e1e;
display: flex; }
@media (min-width: 769px) {
.footer__logos {
display: none; } }
.footer__logo__icon {
max-width: 80px; }
.footer__logo__icon img {
width: 100%;
height: auto; }
.footer__logo {
width: 33.33%;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center; }
.footer__logo:nth-child(2) {
border-left: 1px solid #878787;
border-right: 1px solid #878787; }
@media (min-width: 769px) {
.footer__main {
padding-top: 56px; } }
.footer__container {
max-width: 100%;
width: 100%;
padding: 0 20px; }
@media (min-width: 769px) {
.footer__container {
padding: 0 40px; } }
@media (min-width: 1024px) {
.footer__container {
padding: 0 84px; } }
.footer__top__title {
display: none; }
@media (min-width: 769px) {
.footer__top__title {
display: block;
margin-bottom: 25px; } }
.footer__body {
padding-bottom: 44px;
padding-top: 55px; }
@media (min-width: 769px) {
.footer__body {
padding-top: 0;
display: flex;
flex-wrap: wrap;
padding-bottom: 80px; }
.footer__body > * {
flex: 1; }
.footer__body > *:nth-child(1) {
padding-right: 40px; } }
@media (min-width: 1024px) {
.footer__body > *:nth-child(1) {
max-width: 415px; } }
.footer__newsletter {
text-align: center;
margin-bottom: 44px; }
@media (min-width: 769px) {
.footer__newsletter {
text-align: left;
margin-bottom: 0; } }
.footer__newsletter:last-child {
margin-bottom: 0; }
.footer__newsletter__title {
margin-bottom: 13px; }
.footer__newsletter__title:last-child {
margin-bottom: 0; }
@media (min-width: 769px) {
.footer__newsletter__title {
display: none; } }
.footer__newsletter__description {
margin-bottom: 3%; }
.footer__newsletter__compliance {
font-size: 0.5rem;
margin-top: 1%; }
.footer__newsletter__compliance a {
color: #3ff;
font-weight: bolder;
cursor: pointer; }
.footer__newsletter__head {
margin-bottom: 32px; }
.footer__newsletter__head:last-child {
margin-bottom: 0; }
.footer__menu {
text-align: center;
margin-bottom: 44px; }
.footer__menu:last-child {
margin-bottom: 0; }
@media (min-width: 769px) {
.footer__menu {
text-align: left;
margin-bottom: 0; } }
.footer__menu__inner {
margin-left: auto; }
@media (min-width: 769px) {
.footer__menu__inner {
max-width: 260px; } }
.footer__menu__item {
margin-bottom: 10px; }
.footer__menu__item:last-child {
margin-bottom: 0; }
.footer__menu__item__link {
letter-spacing: 0.03em;
transition: color 0.4s; }
@media (min-width: 769px) {
.footer__menu__item__link {
font-size: 16px; } }
.footer__menu__item__link:hover {
color: #3ff; }
.footer__foot {
display: none; }
@media (min-width: 769px) {
.footer__foot {
display: flex;
padding-bottom: 30px;
align-items: flex-end; }
.footer__foot > * {
flex: 1; }
.footer__foot > *:nth-child(1) {
padding-right: 40px; } }
@media (min-width: 769px) and (min-width: 1024px) {
.footer__foot > *:nth-child(1) {
max-width: 415px; } }
@media (min-width: 769px) {
.footer__privacy__menu__inner {
max-width: 260px;
margin-left: auto; } }
.footer__privacy__menu__link {
transition: color 0.4s;
color: #878787; }
.footer__privacy__menu__link:hover {
color: #3ff; }
.footer__privacy__menu__items {
margin: -20px; }
.footer__privacy__menu__item {
display: inline-block;
padding: 20px; }
@media (min-width: 769px) {
.footer__copyright {
text-align: right; } }
.footer__copyright__entry {
font-size: 12px; }
.footer__socials {
margin: -10px;
text-align: center; }
@media (min-width: 769px) {
.footer__socials {
text-align: right; } }
.footer__socials li {
display: inline-block;
padding: 10px; }
.footer__socials a {
font-size: 0;
transition: opacity 0.4s; }
.footer__socials a:hover {
opacity: 0.6; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/form-klaviyo/form-klaviyo.scss */
.form-klaviyo__form {
display: flex; }
.form-klaviyo__field--email {
width: 325px; }
.form-klaviyo__submit {
margin-left: 20px;
width: 150px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/form-stock-notification/form-stock-notification.scss */
@media (min-width: 1024px) {
.form-stock-notification__field--first-name,
.form-stock-notification__field--email,
.form-stock-notification__field--website-url {
float: left;
margin-right: 12px;
overflow: auto;
width: calc(50% - 12px); } }
@media (min-width: 1024px) {
.form-stock-notification__field--last-name,
.form-stock-notification__field--phone-number,
.form-stock-notification__field--country {
float: left;
margin-left: 12px;
overflow: auto;
width: calc(50% - 12px); } }
.form-stock-notification__header {
margin-bottom: 26px; }
.form-stock-notification__info {
margin-bottom: 31px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/form-waitlist/form-waitlist.scss */
.product__waitlist-modal {
color: #000;
/* Portrait and Landscape */ }
@media only screen and (max-device-width: 1024px) {
.product__waitlist-modal:not(.submitted) .modal__wrap {
min-height: 350px;
transition: min-height 0.5s ease-in-out; } }
@media only screen and (max-device-width: 1024px) {
.product__waitlist-modal.submitted .modal__wrap {
min-height: 98px;
transition: min-height 0.5s ease-in-out; } }
.product__waitlist-modal .modal__waitlist.modal__wrap.modal__wrap--small {
height: auto;
max-width: 466px;
max-height: -moz-max-content;
max-height: max-content;
border: 1px solid;
border-image-source: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), linear-gradient(0deg, #000, #000);
background: #f2f2f2;
box-shadow: 4px 4px 0 #000;
border-radius: 10px; }
.product__waitlist-modal .form-waitlist {
padding: 30px; }
.product__waitlist-modal .form-waitlist .form-waitlist__header {
font-weight: 500;
line-height: 36px;
width: calc(100% - 1em); }
.product__waitlist-modal .form-waitlist:not(.is-submitted) .form-waitlist__header {
margin-bottom: 5px; }
.product__waitlist-modal .form-waitlist:not(.is-submitted) > .waitlist__form {
opacity: 1;
transition: opacity 0.5s ease-in-out; }
.product__waitlist-modal .form-waitlist.is-submitted > .waitlist__form {
opacity: 0;
transition: opacity 0.5s ease-in-out; }
.product__waitlist-modal .waitlist__form__field--checkbox span {
font-size: 14px; }
.product__waitlist-modal .waitlist__form__footer--policy {
font-size: 12px;
color: #878787;
margin: 0 1em; }
.form-waitlist__form {
display: flex; }
.form-waitlist__field--email {
width: 325px; }
.waitlist__form__field--email {
background-color: #fff; }
.waitlist__form__field--email .form-row__error__text-error {
bottom: -25px;
left: 0; }
.form-waitlist__submit {
margin-left: 20px;
width: 150px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/full-block/full-block.scss */
/* ------------------------------------------------------------ *\
Full Block
\* ------------------------------------------------------------ */
.full-block {
position: relative;
padding-top: 134%;
border-radius: 10px;
overflow: hidden; }
@media (min-width: 769px) {
.full-block {
padding-top: 50%; } }
.full-block .full-block__btn:hover {
background-color: #3ff;
color: #1e1e1e; }
.full-block__media {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-size: cover;
background-position: center;
background-repeat: no-repeat; }
.full-block__link__overlay {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 5; }
.full-block__container {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
padding: 54px 20px;
display: flex;
text-align: center;
justify-content: center;
align-items: flex-end; }
.full-block__container.vertical-top {
align-items: flex-start; }
.full-block__container.vertical-middle {
align-items: center; }
.full-block__container.horizontal-left {
text-align: left;
justify-content: flex-start; }
.full-block__container.horizontal-right {
text-align: right;
justify-content: flex-end; }
@media (min-width: 1024px) {
.full-block__container {
padding-top: 90px;
padding-bottom: 90px; } }
.full-block__content {
position: relative;
z-index: 5; }
.full-block__head {
margin-bottom: 18px; }
.full-block__head:last-child {
margin-bottom: 0; }
@media (min-width: 1024px) {
.full-block__head {
margin-bottom: 40px; } }
.full-block__title {
color: #fff; }
.full-block__btn {
font-size: 18px;
line-height: 28px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/group-swatches/group-swatches.scss */
/* ------------------------------------------------------------ *\
Group Swatches
\* ------------------------------------------------------------ */
.group-swatches__items {
margin: 0 -10px;
white-space: nowrap;
overflow-x: auto;
padding-bottom: 10px;
margin-bottom: 10px; }
@media (min-width: 1024px) {
.group-swatches__items {
white-space: inherit;
display: flex;
flex-wrap: wrap;
margin: -3px;
padding-bottom: 20px; } }
.group-swatches__item {
display: inline-block;
margin-right: 6px; }
.group-swatches__item:last-child {
margin-right: 10px; }
.group-swatches__item:first-child {
margin-left: 10px; }
@media (min-width: 1024px) {
.group-swatches__item {
padding: 3px;
margin: 0; }
.group-swatches__item:first-child, .group-swatches__item:last-child {
margin: 0; } }
.group-swatches__title {
margin-bottom: 5px;
font-size: 14px; }
.group-swatches__btn {
width: 80px;
height: 80px;
display: flex;
position: relative;
border-radius: 6px;
border: 1px solid transparent;
overflow: hidden;
transition: border-color 0.4s; }
.group-swatches__btn.disabled {
pointer-events: none; }
.group-swatches__btn.disabled .group-swatches__thumbnail {
opacity: 0.3; }
.group-swatches__btn:focus, .group-swatches__btn:active {
outline: none !important;
box-shadow: none !important; }
.group-swatches__btn.is-active {
border-color: #1e1e1e; }
.group-swatches__thumbnail {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: #f2f2f2; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/hero/hero.scss */
/* ------------------------------------------------------------ *\
hero
\* ------------------------------------------------------------ */
.hero {
padding: 0 10px;
position: relative; }
.hero__inner {
padding: 101px 30px;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
position: relative;
overflow: hidden;
background-size: cover;
background-position: center center;
background-repeat: no-repeat; }
@media (min-width: 769px) {
.hero__inner {
padding: 212px 30px; } }
.hero__image {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 1; }
.hero__image img {
border-radius: 10px; }
.hero__title {
color: #fff;
position: relative;
z-index: 2; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/hero-alt/hero-alt.scss */
/* ------------------------------------------------------------ *\
hero-alt
\* ------------------------------------------------------------ */
.hero-alt {
padding-top: 75%;
text-align: center;
position: relative;
overflow: hidden; }
@media (min-width: 769px) {
.hero-alt {
padding-top: 35%; } }
.hero-alt__title {
font-size: 78px;
line-height: 87px;
color: #fff;
position: absolute;
z-index: 5;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
pointer-events: none; }
@media (min-width: 769px) {
.hero-alt__title {
font-size: 128px;
line-height: 128px; } }
.hero-alt__logo {
margin: 0 auto -16px;
max-width: 84px;
position: relative;
z-index: 5;
pointer-events: none; }
@media (min-width: 769px) {
.hero-alt__logo {
max-width: 168px; } }
.hero-alt__logo img {
width: 100%; }
.hero-alt__video {
display: block; }
.hero-alt__video.is-playing button {
display: none; }
@media (min-width: 769px) {
.hero-alt__video {
display: none; } }
.hero-alt__video video {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
min-width: 100%;
min-height: 100%;
z-index: 2; }
.hero-alt__video-btn {
width: 40px;
height: 40px;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
z-index: 5; }
@media (min-width: 769px) {
.hero-alt__video-btn {
z-index: 3; } }
.hero-alt__image {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 1; }
@media (min-width: 769px) {
.hero-alt__image {
z-index: 4; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/hero-media/hero-media.scss */
.hero-media {
height: 100vh; }
.hero-media__content {
align-items: flex-start;
display: flex;
flex-direction: column;
height: 100%;
justify-content: center; }
.hero-media__content__wrapper {
max-width: 526px; }
.hero-media__content__title {
margin-bottom: 22px; }
.hero-media__content__text {
margin-bottom: 38px; }
.hero-media__content__cta {
display: inline-block;
text-transform: uppercase; }
.hero-media__content__cta::after {
border-bottom: solid 1px currentColor;
content: '';
display: block;
width: 100%; }
.hero-media__background {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/image/image.scss */
.img,
.img__el {
bottom: 0;
height: 100%;
left: 0;
position: absolute;
right: 0;
top: 0;
width: 100%; }
.img {
background-color: #f2f2f2;
overflow: hidden; }
.img.transparent {
background-color: transparent; }
.img.fit-cover .img__el {
-o-object-fit: cover;
object-fit: cover;
/* stylelint-disable */
font-family: 'object-fit: cover;';
/* stylelint-enable */ }
.img.fit-contain .img__el {
-o-object-fit: contain;
object-fit: contain;
/* stylelint-disable */
font-family: 'object-fit: contain;';
/* stylelint-enable */ }
.img.position-top .img__el {
-o-object-position: top;
object-position: top; }
.img.position-right .img__el {
-o-object-position: right;
object-position: right; }
.img.position-bottom .img__el {
-o-object-position: bottom;
object-position: bottom; }
.img.position-left .img__el {
-o-object-position: left;
object-position: left; }
.img.position-center .img__el {
-o-object-position: center;
object-position: center; }
.img.is-loaded .img__el {
opacity: 1; }
.img.is-loaded .img__loader {
opacity: 0;
visibility: hidden; }
.img__el {
opacity: 0;
transition-duration: 0.2s;
transition-property: opacity;
transition-timing-function: ease-in-out;
z-index: 2;
/* For Vue transitions */ }
.img__el.is-fallback {
opacity: 1; }
.img__el.fade-enter, .img__el.fade-leave-to {
opacity: 0 !important; }
.img__el.fade-enter {
z-index: 1; }
.img__loader {
height: 60px;
width: 60px;
left: calc(50% - 30px);
position: absolute;
top: calc(50% - 30px);
z-index: 0; }
.img__loader svg {
height: 60px;
width: 60px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/image-zoom/image-zoom.scss */
.product-gallery__zoom {
width: 100%;
display: block;
overflow: hidden; }
.product-gallery__zoom > img {
width: 100%; }
.product-gallery__zoom__zoomed {
top: -50%;
left: -50%;
width: 200%;
height: 200%;
background: center center no-repeat;
background-size: 100%; }
.product-gallery__zoom.active {
cursor: pointer; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/info/info.scss */
/* ------------------------------------------------------------ *\
info
\* ------------------------------------------------------------ */
.info {
padding: 1px 0; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/info-simple/info-simple.scss */
/* ------------------------------------------------------------ *\
info-simple
\* ------------------------------------------------------------ */
.info-simple {
padding: 29px 0;
text-align: center; }
@media (min-width: 769px) {
.info-simple {
padding: 53px 0; } }
.info-simple--alt {
padding: 2px 0 66px; }
@media (min-width: 769px) {
.info-simple--alt {
padding: 26px 0 77px; } }
.info-simple--alt .info-simple__image {
max-width: 60px;
margin: 0 auto -4px; }
@media (min-width: 769px) {
.info-simple--alt .info-simple__image {
margin: 0 auto -5px; } }
.info-simple--alt .info-simple__image img {
width: 100%; }
.info-simple--alt .info-simple__title {
margin-bottom: 22px; }
@media (min-width: 769px) {
.info-simple--alt .info-simple__title {
margin-bottom: 20px; } }
.info-simple--alt .info-simple__entry {
margin-bottom: 35px; }
@media (min-width: 769px) {
.info-simple--alt .info-simple__entry {
margin-bottom: -3px; } }
.info-simple__inner {
max-width: 1060px;
margin: auto;
padding: 0 15px; }
.info-simple__title {
margin-bottom: 21px; }
.info-simple__actions {
margin-top: 2%; }
.info-simple__entry {
padding: 0 5px;
font-family: "Helvetica Neue", sans-serif;
margin-bottom: 24px; }
@media (min-width: 769px) {
.info-simple__entry {
font-weight: bold;
text-transform: uppercase;
font-family: "Oswald", sans-serif;
padding: 0;
margin-bottom: 47px; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/instagram/instagram.scss */
/* ------------------------------------------------------------ *\
instagram
\* ------------------------------------------------------------ */
.instagram {
padding: 40px 0; }
@media (min-width: 769px) {
.instagram {
padding: 81px 0 50px; } }
.instagram__title {
text-align: center;
margin-bottom: 26px; }
@media (min-width: 769px) {
.instagram__title {
margin-bottom: 23px; } }
.instagram__images {
display: flex;
flex-wrap: wrap;
justify-content: center;
padding: 0 5px; }
.instagram__image {
padding: 0 5px;
border-radius: 10px;
flex: 0 0 50%;
max-width: 50%;
margin-bottom: 10px; }
@media (min-width: 769px) {
.instagram__image {
flex: 0 0 25%;
max-width: 25%; } }
.instagram__image-inner {
width: 100%;
height: 100%;
padding-top: 100%;
border-radius: 10px;
position: relative;
overflow: hidden; }
.instagram__image a {
display: inline-block;
width: 100%;
height: 100%;
transition: transform 0.25s;
position: absolute;
left: 0;
top: 0;
background-size: cover;
background-position: center center;
background-repeat: no-repeat; }
.instagram__image a:hover {
transform: scale(1.1); }
.instagram__actions {
margin-top: 14px;
text-align: center; }
@media (min-width: 769px) {
.instagram__actions {
margin-top: 29px; } }
.instagram__actions a {
height: 44px;
min-width: 250px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/loader/loader.scss */
.loader {
font-size: 25px;
width: 1em;
height: 1em;
border-radius: 50%;
text-indent: -9999em;
position: absolute;
left: 50%;
top: 50%;
animation: loaderAnimation 1.1s infinite ease;
transform: translate(-50%, -50%);
opacity: 0;
visibility: hidden; }
@keyframes load5 {
0%,
100% {
box-shadow: 0 -2.6em 0 0 #1e1e1e, 1.8em -1.8em 0 0 rgba(0, 0, 0, 0.2), 2.5em 0 0 0 rgba(0, 0, 0, 0.2), 1.75em 1.75em 0 0 rgba(0, 0, 0, 0.2), 0 2.5em 0 0 rgba(0, 0, 0, 0.2), -1.8em 1.8em 0 0 rgba(0, 0, 0, 0.2), -2.6em 0 0 0 rgba(0, 0, 0, 0.5), -1.8em -1.8em 0 0 rgba(0, 0, 0, 0.7); }
12.5% {
box-shadow: 0 -2.6em 0 0 rgba(0, 0, 0, 0.7), 1.8em -1.8em 0 0 #1e1e1e, 2.5em 0 0 0 rgba(0, 0, 0, 0.2), 1.75em 1.75em 0 0 rgba(0, 0, 0, 0.2), 0 2.5em 0 0 rgba(0, 0, 0, 0.2), -1.8em 1.8em 0 0 rgba(0, 0, 0, 0.2), -2.6em 0 0 0 rgba(0, 0, 0, 0.2), -1.8em -1.8em 0 0 rgba(0, 0, 0, 0.5); }
25% {
box-shadow: 0 -2.6em 0 0 rgba(0, 0, 0, 0.5), 1.8em -1.8em 0 0 rgba(0, 0, 0, 0.7), 2.5em 0 0 0 #1e1e1e, 1.75em 1.75em 0 0 rgba(0, 0, 0, 0.2), 0 2.5em 0 0 rgba(0, 0, 0, 0.2), -1.8em 1.8em 0 0 rgba(0, 0, 0, 0.2), -2.6em 0 0 0 rgba(0, 0, 0, 0.2), -1.8em -1.8em 0 0 rgba(0, 0, 0, 0.2); }
37.5% {
box-shadow: 0 -2.6em 0 0 rgba(0, 0, 0, 0.2), 1.8em -1.8em 0 0 rgba(0, 0, 0, 0.5), 2.5em 0 0 0 rgba(0, 0, 0, 0.7), 1.75em 1.75em 0 0 #1e1e1e, 0 2.5em 0 0 rgba(0, 0, 0, 0.2), -1.8em 1.8em 0 0 rgba(0, 0, 0, 0.2), -2.6em 0 0 0 rgba(0, 0, 0, 0.2), -1.8em -1.8em 0 0 rgba(0, 0, 0, 0.2); }
50% {
box-shadow: 0 -2.6em 0 0 rgba(0, 0, 0, 0.2), 1.8em -1.8em 0 0 rgba(0, 0, 0, 0.2), 2.5em 0 0 0 rgba(0, 0, 0, 0.5), 1.75em 1.75em 0 0 rgba(0, 0, 0, 0.7), 0 2.5em 0 0 #1e1e1e, -1.8em 1.8em 0 0 rgba(0, 0, 0, 0.2), -2.6em 0 0 0 rgba(0, 0, 0, 0.2), -1.8em -1.8em 0 0 rgba(0, 0, 0, 0.2); }
62.5% {
box-shadow: 0 -2.6em 0 0 rgba(0, 0, 0, 0.2), 1.8em -1.8em 0 0 rgba(0, 0, 0, 0.2), 2.5em 0 0 0 rgba(0, 0, 0, 0.2), 1.75em 1.75em 0 0 rgba(0, 0, 0, 0.5), 0 2.5em 0 0 rgba(0, 0, 0, 0.7), -1.8em 1.8em 0 0 #1e1e1e, -2.6em 0 0 0 rgba(0, 0, 0, 0.2), -1.8em -1.8em 0 0 rgba(0, 0, 0, 0.2); }
75% {
box-shadow: 0 -2.6em 0 0 rgba(0, 0, 0, 0.2), 1.8em -1.8em 0 0 rgba(0, 0, 0, 0.2), 2.5em 0 0 0 rgba(0, 0, 0, 0.2), 1.75em 1.75em 0 0 rgba(0, 0, 0, 0.2), 0 2.5em 0 0 rgba(0, 0, 0, 0.5), -1.8em 1.8em 0 0 rgba(0, 0, 0, 0.7), -2.6em 0 0 0 #1e1e1e, -1.8em -1.8em 0 0 rgba(0, 0, 0, 0.2); }
87.5% {
box-shadow: 0 -2.6em 0 0 rgba(0, 0, 0, 0.2), 1.8em -1.8em 0 0 rgba(0, 0, 0, 0.2), 2.5em 0 0 0 rgba(0, 0, 0, 0.2), 1.75em 1.75em 0 0 rgba(0, 0, 0, 0.2), 0 2.5em 0 0 rgba(0, 0, 0, 0.2), -1.8em 1.8em 0 0 rgba(0, 0, 0, 0.5), -2.6em 0 0 0 rgba(0, 0, 0, 0.7), -1.8em -1.8em 0 0 #1e1e1e; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/message/message.scss */
/* ------------------------------------------------------------ *\
message
\* ------------------------------------------------------------ */
.message {
padding: 51px 19px 49px; }
@media (min-width: 769px) {
.message {
padding: 100px 30px; } }
.message__inner {
margin: auto;
max-width: 944px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/mini-product/mini-product.scss */
.mini-product {
color: #fff;
border-radius: 10px;
border: 1px solid #fff;
padding: 10px;
white-space: initial;
width: 100%;
position: relative; }
.mini-product__image {
width: 100%;
padding-top: 100%;
background-color: #fff;
margin-bottom: 7px;
border-radius: 10px;
position: relative;
overflow: hidden; }
.mini-product__title {
font-size: 16px; }
.mini-product__content {
position: relative;
padding-right: 15px; }
.mini-product__content__icon {
position: absolute;
right: 0;
top: 6px; }
.mini-product__link {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 6; }
.mini-product--black {
border-color: #1e1e1e;
background-color: #1e1e1e; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/modal/modal.scss */
.modal__bg {
background-color: rgba(204, 204, 204, 0.6);
position: fixed;
top: 0;
left: 0;
height: 100%;
width: 100%; }
.modal__wrap {
background-color: #fff;
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
margin: auto;
width: 100vw;
max-width: 930px;
height: 100vh;
max-height: 100vh; }
@media (min-width: 415px) {
.modal__wrap {
height: auto;
max-height: calc(100vh - 127px);
width: calc(100% - 40px);
max-width: 588px; } }
@media (min-width: 769px) {
.modal__wrap {
max-width: 824px; } }
@media (min-width: 1024px) {
.modal__wrap {
max-width: 930px; } }
.modal__wrap.modal__wrap--small {
max-width: 420px; }
.modal__wrap.modal__wrap--small .single-form {
margin: 0 20px;
width: calc(100% - 40px); }
.modal__wrap.modal__wrap--small .single-form > div {
padding: 40px 0 20px; }
.modal__wrap.modal__wrap--quick-view {
max-width: 930px; }
.modal__wrap.modal__wrap--quick-view .modal__inner > div {
padding: 0;
max-width: 100%; }
.modal__wrap.modal__wrap--quick-view .single-form {
margin: 0;
width: 100%; }
.modal__wrapper.active {
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
margin: 0;
width: 100vw;
height: 100vh;
transform: translate(0, 0); }
.modal__container {
z-index: 2;
position: relative;
height: 100%;
width: 100%;
margin: 0 auto;
overflow-y: auto; }
@media (min-width: 415px) {
.modal__container {
height: auto;
max-height: 100%; } }
.modal__content {
flex: 1; }
.modal__title {
text-align: center;
margin-bottom: 30px; }
.modal__inner {
margin: 0 auto; }
.modal__inner > div,
.modal__inner [slot=default] {
padding: 44px 20px 116px;
max-width: 720px;
margin: 0 auto; }
.modal__inner .table--flex {
overflow: auto;
max-height: calc(100vh - 120px); }
.modal__footer {
position: relative;
bottom: 0;
width: 100%;
max-width: initial;
left: 0;
height: 3.75rem;
text-align: center;
z-index: 2; }
.modal__footer a {
display: block;
box-sizing: border-box;
width: 200px;
padding: 16px;
margin: 0 auto;
height: 60px; }
.modal__footer a span {
line-height: 26px;
height: 26px;
display: block;
padding-left: 40px;
text-align: right;
position: relative;
top: -26px; }
.modal__footer a svg {
display: block;
margin-right: 0.5rem;
line-height: 26px;
height: 26px;
position: relative;
top: 0; }
.close__modal {
position: absolute;
top: 10px;
right: 10px;
width: 24px;
display: block;
cursor: pointer;
transition: opacity cubic-bezier(0.165, 0.84, 0.44, 1) 0.25s;
z-index: 3; }
.close__modal svg {
width: 100%;
height: auto;
display: block; }
.close__modal:hover {
opacity: 0.8; }
.close__modal:hover svg {
fill: red; }
@media (min-width: 1024px) {
.close__modal {
top: 21px;
right: 21px; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/newsletter-bar/newsletter-bar.scss */
.newsletter-bar {
bottom: 10px;
left: 10px;
right: 10px;
display: block;
position: fixed;
z-index: 9999; }
@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation: portrait) {
.newsletter-bar {
/* For portrait layouts only */
width: 45%; } }
.newsletter-bar__container {
background-color: #fff;
border: 1px solid #1e1e1e;
border-radius: 10px;
padding: 16px 24px 30px;
position: relative;
max-width: 430px;
z-index: 2; }
.newsletter-bar__content {
margin: auto;
padding: 0;
text-align: left;
width: 50%; }
@media (--xs) {
.newsletter-bar__content {
text-align: center; } }
.newsletter-bar__entry {
margin-bottom: 3%; }
.newsletter-bar__compliance {
font-size: 0.5rem;
margin-top: 1%;
color: #1e1e1e; }
.newsletter-bar__compliance a {
color: #f60;
font-weight: bolder;
cursor: pointer; }
.newsletter-bar__close {
cursor: pointer;
display: block;
height: 24px;
position: absolute;
right: 20px;
top: 20px;
width: 24px; }
@media (--xs) {
.newsletter-bar__close {
right: 30px; } }
.newsletter-bar__close > svg {
display: block;
height: 100%;
width: 20px; }
.newsletter-bar__overlay {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 1;
background-color: rgba(0, 0, 0, 0.4); }
/* No Touch */
.no-touch .newsletter-bar__close {
transition: opacity 0.25s ease-in; }
.no-touch .newsletter-bar__close:hover {
opacity: 0.6; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/pagination/pagination.scss */
.pagination {
padding: 0 10px;
margin: 19px 0 40px; }
@media (min-width: 769px) {
.pagination {
margin: 23px 0 40px;
padding: 0; } }
.pagination__arrow {
width: 30%;
color: #1e1e1e;
text-decoration: none;
transition: opacity 0.25s;
text-align: left; }
.pagination__arrow:hover {
opacity: 0.3; }
.pagination__pages {
width: 40%; }
.pagination__page__link {
text-decoration: none;
color: #000;
margin: 0 7px;
transition: opacity 0.25s; }
.pagination__page__link:hover {
opacity: 0.3; }
.pagination__page__link--inactive {
text-decoration: underline; }
.pagination__arrow--disabled {
opacity: 0.3;
pointer-events: none; }
.pagination__arrow--next {
text-align: right; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/predictive-search/predictive-search.scss */
@media (max-width: 1023px) {
.predictive-search {
padding: 0 20px 100px;
overflow-x: hidden;
overflow-y: auto;
margin: 0 -20px;
max-height: calc(100vh - 70px); } }
@media (min-width: 1024px) {
.predictive-search__results {
position: absolute;
width: 507px;
border-radius: 10px;
top: calc(100% + 14px);
border: 1px solid #1e1e1e;
background-color: #fff;
right: -20px;
padding: 20px;
min-height: 266px; } }
@media (max-width: 1023px) {
.predictive-serch__form {
padding-bottom: 20px; } }
.predictive-search__products {
padding-bottom: 20px;
display: flex;
flex-wrap: wrap;
margin: -10px -5px; }
.predictive-search__product {
width: 50%;
padding: 10px 5px; }
.product-card__badges--search .product-badges__item-preorder,
.product-card__badges--search .product-badges__item-waitlist {
margin-right: 0;
order: 1; }
.product-card__badges--search .product-badges__item-preorder .product-badges__item__cdn-image,
.product-card__badges--search .product-badges__item-waitlist .product-badges__item__cdn-image {
height: 50px;
width: auto; }
@media (max-width: 1023px) {
.predictive-search__results__actions {
position: static; } }
.predictive-search__view__all {
height: 44px;
width: 100%;
min-width: 100%; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/product-badges/product-badges.scss */
.product-badges {
position: absolute;
left: 0;
top: 0;
z-index: 5;
padding: 5px; }
.product-badges.variant_badge--hidden {
display: none; }
@media (min-width: 769px) {
.product-badges {
padding: 10px; } }
.product-badges .btn, .product-badges #onetrust-banner-sdk #onetrust-button-group button, #onetrust-banner-sdk #onetrust-button-group .product-badges button {
background-color: transparent; }
@media (max-width: 767px) {
.product-badges .btn, .product-badges #onetrust-banner-sdk #onetrust-button-group button, #onetrust-banner-sdk #onetrust-button-group .product-badges button {
padding: 1px 9px; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/product-card/product-card.scss */
.product-card {
position: relative;
width: 100%; }
.product-card .qview-button {
display: none !important; }
.product-card :focus {
outline: none !important;
outline-offset: unset;
color: unset;
outline-style: unset; }
@media (min-width: 1024px) {
.product-card :focus {
outline: 4px solid !important;
outline-offset: -4px;
color: #000;
outline-style: inset; } }
.product-card__badges {
display: flex;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
align-items: flex-start;
flex-wrap: wrap;
z-index: 6;
padding: 10px 10px; }
@media (min-width: 769px) {
.product-card__badges {
padding: 14px 20px; } }
.product-card__badges .product-badges__item:nth-child(odd):not(.product-badges__item-preorder):not(.product-badges__item-waitlist) {
margin-left: auto;
order: 1; }
.product-card__badges .product-badges__item:nth-child(even):not(.product-badges__item-preorder):not(.product-badges__item-waitlist) {
margin-right: auto;
order: -1; }
.product-card__badges .product-badges__item-preorder,
.product-card__badges .product-badges__item-waitlist {
margin-right: 0;
order: 1; }
.product-card__badges .product-badges__item-preorder .product-badges__item__cdn-image,
.product-card__badges .product-badges__item-waitlist .product-badges__item__cdn-image {
height: 50px;
width: auto; }
@media (min-width: 769px) {
.product-card__badges .product-badges__item-preorder .product-badges__item__cdn-image,
.product-card__badges .product-badges__item-waitlist .product-badges__item__cdn-image {
height: 114px; } }
.product-card__badges .product-badges__item__cdn-image {
height: 25px;
width: auto; }
.product-badges__ribbon-style {
position: absolute;
height: 100%;
width: 100%;
left: 0;
top: 0;
z-index: 3; }
.product-badges__ribbon-style .ribbon-style__top {
background-size: contain;
height: 20px;
width: 100%;
position: absolute;
top: 0;
left: -25%;
transform: rotate(-25deg); }
@media (min-width: 769px) {
.product-badges__ribbon-style .ribbon-style__top {
height: 35px; } }
.product-badges__ribbon-style .ribbon-style__bottom {
background-size: contain;
height: 20px;
width: 100%;
position: absolute;
bottom: 0;
right: -25%;
transform: rotate(-25deg); }
@media (min-width: 769px) {
.product-badges__ribbon-style .ribbon-style__bottom {
height: 35px; } }
.product-card__featured {
display: block;
padding-top: 100%;
position: relative;
background-color: #f2f2f2;
border: 1px solid #f2f2f2;
border-radius: 6px;
overflow: hidden;
transition: all 0.4s; }
.product-card__image {
transition: opacity 0.4s, visibility 0.4s;
position: absolute !important; }
.product-card__image--hover {
opacity: 0;
visibility: hidden; }
@media (min-width: 1024px) {
.product-card__featured:hover {
border-color: #1e1e1e; }
.product-card__featured:hover:hover, .product-card__featured:hover:focus {
box-shadow: 0.3em 0.3em 0 0 #1e1e1e; }
.product-card__featured:hover .product-card__image {
visibility: hidden;
opacity: 0; }
.product-card__featured:hover .product-card__image--hover {
visibility: visible;
opacity: 1; }
.product-card__featured:hover .product-card__image:first-child:last-child {
opacity: 1;
visibility: visible; } }
.product-card__quick-buy {
bottom: 15px;
left: 20px;
justify-content: center;
opacity: 0;
position: absolute;
transition: all 0.4s;
width: calc(100% - 40px);
z-index: 100;
min-width: auto; }
.product-card__featured:hover .product-card__quick-buy {
opacity: 1; }
@media (max-width: 1023px) {
.product-card__quick-buy {
display: none; } }
.product-card__quick-buy--cta {
text-align: center; }
.product-card__quick-buy--cta.disabled {
pointer-events: none; }
.product-card__quick__buy__options {
position: absolute;
z-index: 100;
bottom: 15px;
left: 20px;
width: calc(100% - 40px);
display: grid;
display: flex;
flex-wrap: wrap;
margin: -3px;
justify-content: center; }
.product-card__quick__buy__option {
border: solid 1px #1e1e1e;
margin: 3px;
border-radius: 6px;
min-width: 44px;
height: 44px;
padding: 0 5px; }
.product-card__quick__buy__option:hover {
background-color: #1e1e1e;
color: #fff; }
.product-card__quick__buy__option.disabled {
opacity: 0.5;
pointer-events: none; }
.product-card__details {
display: flex;
justify-content: space-between;
margin-bottom: 2px; }
.product-card__details .product-card__details__title {
text-transform: uppercase;
line-height: 1.2; }
@media (max-width: 767px) {
.product-card__details .product-card__details__title {
font-size: 14px; } }
.product-card__content {
padding: 10px 10px 0; }
.product-card__details__price {
line-height: 1.2;
position: relative;
top: 1px; }
.product-card__details__price.discounted {
opacity: 0.3;
text-decoration: line-through;
margin-left: 8px; }
@media (max-width: 767px) {
.product-card__details__price {
font-size: 14px; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/product-card-slider/product-card-slider.scss */
.product-card-slider {
padding: 24px 0; }
@media (min-width: 1024px) {
.product-card-slider {
padding: 34px 0 63px; } }
.product-card-slider__title {
margin-bottom: 24px;
text-align: center; }
@media (min-width: 1024px) {
.product-card-slider__title {
margin-bottom: 58px; } }
.product-card-slider__items__static {
display: flex; }
.product-card-slider__item {
margin-bottom: 0;
padding: 10px;
width: 50%; }
@media (min-width: 769px) {
.product-card-slider__item {
width: calc(100% / 3); } }
@media (min-width: 1024px) {
.product-card-slider__item {
width: 25%; } }
.product-card-slider__item .product-card__quick-buy {
height: 44px;
left: 10px;
width: calc(100% - 20px); }
.product-card-slider__item .product-card__quick__buy__options {
left: 5px;
width: calc(100% - 5px); }
.product-card-slider__item .product-card__quick__buy__option {
min-width: 36px;
height: 36px;
font-size: 12px; }
.product-card-slider__item__title {
margin: 10px 0; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/promo-bar/promo-bar.scss */
.promo-bar {
background-color: #ededed;
color: #000;
display: flex;
padding: 11px 0;
position: relative;
overflow: hidden;
min-height: 40px;
z-index: 5; }
@media (min-width: 1024px) {
.promo-bar {
padding: 13px 0;
min-height: 50px; } }
.promo-bar__content {
margin: auto;
text-align: center;
font-size: 12px;
letter-spacing: 0.03em; }
@media (min-width: 769px) {
.promo-bar__content {
font-size: 14px; } }
.promo-bar__url {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 1; }
.promo-bar__logos {
position: absolute;
left: 0;
top: 0;
height: 100%;
z-index: 2;
display: none;
background-color: #ededed; }
@media (min-width: 769px) {
.promo-bar__logos {
display: flex; } }
.promo-bar__logo {
width: 60px;
display: flex;
align-items: center;
justify-content: center;
border-right: 1px solid #ccc;
transition: all 0.3s ease;
position: relative; }
.promo-bar__logo:hover {
background-color: #1e1e1e;
border-color: #1e1e1e; }
.promo-bar__logo:hover .promo-bar__logo__icon {
visibility: hidden;
opacity: 0; }
.promo-bar__logo:hover .promo-bar__logo__icon--hover {
visibility: visible;
opacity: 1; }
.promo-bar__logo__icon--hover {
visibility: hidden;
opacity: 0; }
.promo-bar__logo__icon {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.3s ease; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/quantity-selector/quantity-selector.scss */
.quantity-selector {
align-items: center;
border: 1px solid #ccc;
border-radius: 18px;
display: flex;
height: 36px;
justify-content: space-around;
line-height: 36px;
position: relative;
transition: opacity 0.25s ease-in-out;
width: 100%; }
.quantity-selector:disabled {
opacity: 0.4; }
.quantity-selector__action,
.quantity-selector__field.quantity-selector__field {
height: inherit;
line-height: inherit; }
.quantity-selector__action {
opacity: 1;
padding: 0;
width: 30px;
height: 100%;
display: block;
color: inherit;
cursor: pointer;
font-size: 25px;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
text-align: center;
transition: opacity 0.25s ease-in-out; }
.quantity-selector__action:focus, .quantity-selector__action:hover {
outline: none !important;
box-shadow: none !important; }
.quantity-selector__action__text {
display: block;
height: 100%;
font-size: 18px;
line-height: 34px;
margin: 0 auto;
position: relative;
width: 10px; }
.quantity-selector__action__text svg {
left: 0;
top: 50%;
right: 0;
margin: auto;
position: absolute;
transform: translateY(-50%); }
.quantity-selector__action:disabled {
cursor: default;
opacity: 0.4; }
.quantity-selector__field.quantity-selector__field {
padding: 0;
margin: 0 10px;
color: inherit;
text-align: center;
-moz-appearance: textfield;
-webkit-appearance: none;
box-shadow: none; }
.quantity-selector__field.quantity-selector__field::-webkit-outer-spin-button, .quantity-selector__field.quantity-selector__field::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0; }
.quantity-selector__field.quantity-selector__field:focus {
box-shadow: inset 0 0 0 1px #000; }
.quantity-selector__field::-webkit-inner-spin-button,
.quantity-selector__field::-webkit-outer-spin-button {
-webkit-appearance: none;
appearance: none; }
.quantity-selector.quantity-selector--small {
width: 95px;
height: 34px;
line-height: 34px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/radio-button/radio-button.scss */
.radio-button {
position: relative;
/* Resolves autocomplete white background issue */ }
.radio-button input:-webkit-autofill,
.radio-button input:-webkit-autofill:hover,
.radio-button input:-webkit-autofill:focus,
.radio-button input:-webkit-autofill:active {
transition-delay: 9999s; }
.radio-button .radio-button__wrapper {
padding: 1rem 0 1.2rem;
height: auto;
line-height: initial;
position: relative; }
.radio-button .radio-button__el_list {
display: block;
width: 100%; }
.radio-button .radio-button__el {
position: relative;
height: 2.25rem;
line-height: 2.25rem;
transition: all 200ms;
z-index: 2;
width: 100%;
margin: 0 0 0.3rem; }
.radio-button .radio-button__el:last-child {
margin-bottom: 0; }
.radio-button .radio-button__el.is-active .checkbox__icon {
border: 2px solid #000; }
.radio-button .radio-button__el.is-active .checkbox__icon span {
background: #000;
width: 10px;
height: 10px; }
.radio-button .radio-button__title {
display: block;
z-index: 1;
width: 100%;
height: auto;
line-height: 2.25rem; }
.radio-button .radio-button__label > span {
display: block;
z-index: 1;
width: 100%;
height: 2.25rem;
line-height: 2.25rem;
cursor: pointer;
padding: 0 0 0 1.8rem;
transition: padding 0.3s ease; }
.radio-button .radio-button__label:focus .checkbox__icon, .radio-button .radio-button__label:active .checkbox__icon, .radio-button .radio-button__label:hover .checkbox__icon {
border-color: #000 !important; }
.radio-button .checkbox__icon {
width: 20px;
height: 20px;
position: absolute;
border: 2px solid #ccc;
margin-right: 10px;
top: 7px;
border-radius: 50%;
transition: all ease 0.3s; }
.radio-button .checkbox__icon span {
display: block;
width: 2px;
height: 2px;
background: none;
border-radius: 50%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
transition: all ease 0.3s; }
.radio-button .radio-button__input {
width: 1px;
height: 1px;
display: block;
visibility: hidden; }
.radio-button .radio-button__error {
position: absolute;
bottom: 0;
height: 1rem;
line-height: 1rem;
font-size: 0.8rem;
color: red;
opacity: 0;
transform: translateY(-0.5em);
transition: opacity 300ms ease, transform 300ms ease; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/search-form/search-form.scss */
.search-form {
background-color: transparent;
position: relative; }
.search-form input {
width: 100%;
height: 44px;
border-radius: 50px;
background-color: #f2f2f2;
padding: 0 15px 0 40px;
color: #1e1e1e;
transition: border-color 0.4s;
border: 1px solid #f2f2f2;
font-size: 16px; }
@media (min-width: 1024px) {
.search-form input {
height: 34px; } }
.search-form input:focus {
border-color: #1e1e1e; }
.search-form input::-moz-placeholder {
color: #b3b3b3; }
.search-form input::placeholder {
color: #b3b3b3; }
.search-form button {
font-size: 0;
position: absolute;
width: 15px;
height: 15px;
display: inline-block;
left: 10px;
top: 50%;
transform: translateY(-50%); }
.search-form--big input {
height: 50px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/select-input/select-input.scss */
.select-input {
position: relative;
align-items: center;
padding-right: 1px;
/* Disappearing border-right issue */ }
.select-input.select-input--small {
display: inline-block; }
.select-input__el-wrap {
border: 1px solid #1e1e1e;
border-radius: 10px;
position: relative; }
.select-input--small .select-input__el-wrap {
border: none;
display: inline-block; }
label + .select-input__el-wrap {
margin-top: 7px; }
.select-input--small label + .select-input__el-wrap {
margin-top: 2px; }
.select-input__el {
display: block;
width: 100%;
height: 42px;
z-index: 1;
padding-left: 15px;
padding-right: 25px;
color: #878787; }
.select-input__el.is-active {
color: #000; }
.select-input--small .select-input__el {
height: 20px;
padding-left: 1px;
padding-right: 23px; }
.select-input__icon {
display: block;
position: absolute;
right: 7px;
top: 17px;
width: 11px;
height: 11px;
transform: rotate(-45deg) translateY(-50%);
z-index: 0;
border: solid #1e1e1e;
border-width: 0 0 2px 2px; }
.select-input--small .select-input__icon {
width: 6px;
height: 6px;
top: 8px;
right: 4px; }
.select-input--alt option:disabled {
background-color: #ededed; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/search-mobile/search-mobile.scss */
.search-mobile.is-active .search-mobile__inner {
transform: translateX(0); }
.search-mobile.is-active .search-mobile__overlay {
opacity: 1;
visibility: visible;
pointer-events: auto; }
.search-mobile__inner {
padding: 0 20px;
position: fixed;
right: 0;
top: 0;
height: 100%;
max-width: 634px;
background-color: #fff;
z-index: 1061;
transition: transform 0.4s;
transform: translateX(100%);
width: 100%; }
.search-mobile__overlay {
top: 0;
left: 0;
bottom: 0;
opacity: 0;
visibility: hidden;
transition: all 0.2s ease-in-out;
position: fixed;
pointer-events: none;
width: 100%;
background-color: rgba(0, 0, 0, 0.4);
z-index: 1060; }
.search-mobile__head {
height: 70px;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
position: relative; }
.search-mobile__head button {
position: absolute;
left: 0;
top: 50%;
width: 14px;
height: 14px;
transform: translateY(-50%); }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/shopify-challenge/shopify-challange.scss */
/* ------------------------------------------------------------ *\
shopify-challange
\* ------------------------------------------------------------ */
.shopify-challenge__container {
padding: 100px 0; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/skip-to-main/skip-to-main.scss */
.skip-to-main {
top: 0;
left: 50%;
opacity: 0;
z-index: 1000;
color: #f2f2f2;
position: absolute;
text-transform: uppercase;
border: 3px solid #f2f2f2;
background-color: #000;
transform: translate(-50%, -100px); }
.skip-to-main:active, .skip-to-main:focus {
opacity: 1;
pointer-events: auto;
transform: translate(-50%, 10px);
transition: all 0.3s ease; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/slider-double/slider-double.scss */
/* ------------------------------------------------------------ *\
slider-double
\* ------------------------------------------------------------ */
.slider-double {
padding: 45px 0; }
@media (min-width: 769px) {
.slider-double {
padding: 36px 0; } }
.slider-double__body {
padding-bottom: 12px;
position: relative; }
@media (min-width: 769px) {
.slider-double__body {
padding-bottom: 0; } }
.slider-double__body::before {
content: '';
background-color: #ededed;
border-radius: 10px;
z-index: -1;
position: absolute;
left: 50%;
top: -29px;
bottom: 0;
transform: translateX(-50%);
width: calc(100% - 19px); }
@media (min-width: 769px) {
.slider-double__body::before {
width: calc(100% - 30px);
top: 110px; } }
.slider-double__title {
text-align: center;
margin-bottom: 17px; }
@media (min-width: 769px) {
.slider-double__title {
margin-bottom: 25px; } }
.slider-double__entry {
text-align: center;
padding: 0 10px;
max-width: 638px;
margin: auto; }
@media (min-width: 769px) {
.slider-double__entry {
padding: 0; } }
.slider-double__head {
padding: 0 15px;
margin-bottom: 59px; }
@media (min-width: 769px) {
.slider-double__head {
margin-bottom: 43px; } }
.main-carousel--logos {
margin-bottom: 12px; }
@media (min-width: 769px) {
.main-carousel--logos {
margin-bottom: 8px; } }
.main-carousel--logos .carousel-cell {
width: 140px;
padding: 0 10px;
display: flex;
justify-content: center;
align-items: center;
top: 50%;
transform: translateY(-50%);
transition: transform 0.25s; }
.main-carousel--logos .carousel-cell:hover {
transform: translateY(-50%) scale(1.1); }
@media (min-width: 769px) {
.main-carousel--logos .carousel-cell {
width: 150px;
padding: 0 15px; } }
.main-carousel--logos .carousel-cell img {
width: 100%; }
.main-carousel--logos .carousel-cell.is-selected {
width: 240px;
height: 264px; }
@media (min-width: 769px) {
.main-carousel--logos .carousel-cell.is-selected {
width: 254px;
height: 280px; } }
.main-carousel--logos-contents .carousel-cell {
width: 100%;
display: flex;
align-items: center;
flex-direction: column;
padding-bottom: 22px;
animation-duration: 0.1s;
animation-name: fade-animation-reverse;
opacity: 0; }
.main-carousel--logos-contents .carousel-cell.is-selected {
animation-duration: 0.7s;
animation-name: fade-animation;
opacity: 1; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/social-media/social-media.scss */
/* ------------------------------------------------------------ *\
social-media
\* ------------------------------------------------------------ */
.social-media {
padding: 48px 15px;
border-top: 1px solid #1e1e1e; }
@media (min-width: 1024px) {
.social-media {
padding: 83px 15px; } }
.social-media__title {
text-align: center;
margin-bottom: 17px; }
@media (min-width: 1024px) {
.social-media__title {
margin-bottom: 30px; } }
.social-media__inner {
max-width: 1000px;
margin: auto; }
.social-media__items {
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
margin: 0 -10px; }
.social-media__item {
padding: 0 10px; }
.social-media__item a {
display: inline-block;
width: 45px; }
.social-media__item img {
width: 100%; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/status/status.scss */
/* ------------------------------------------------------------ *\
status
\* ------------------------------------------------------------ */
.status {
padding: 3px 10px;
border-radius: 10px; }
@media (min-width: 769px) {
.status {
padding: 5px 10px; } }
.status--unfulfilled {
border: 1px solid #878787; }
.status--fulfilled {
border: 1px solid #6ee7a4; }
.status--scheduled {
border: 1px solid #f60; }
.status--on-hold {
border: 1px solid #ff3b30; }
.status--partially-fulfilled {
border: 1px solid #7d5dfc; }
.status--left {
margin-left: -10px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/sticker/sticker.scss */
/* ------------------------------------------------------------ *\
Sticker
\* ------------------------------------------------------------ */
.vdr {
cursor: pointer; }
.vdr.active::before {
display: none !important; }
.sticker__image.is-mobile {
width: 100%; }
.sticker-wrapper {
position: relative; }
.sticker-mobile-only {
display: block; }
@media (min-width: 769px) {
.sticker-mobile-only {
display: none; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/sticker-location/sticker-location.scss */
.sticker-location {
position: absolute;
pointer-events: none;
opacity: 0;
visibility: hidden; }
@media (min-width: 1024px) {
.sticker-location__image {
width: auto !important; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/table-features/table-features.scss */
/* ------------------------------------------------------------ *\
table-features
\* ------------------------------------------------------------ */
.table-features {
padding: 58px 0 157px; }
@media (min-width: 769px) {
.table-features {
padding: 167px 0; } }
.table-features table {
border-radius: 10px;
width: 100%;
border-collapse: separate;
border-spacing: 0;
background-color: #fff; }
.table-features tr th:nth-child(1) {
text-align: left; }
.table-features th:not(:nth-child(1)) {
width: 71px; }
@media (min-width: 769px) {
.table-features th:not(:nth-child(1)) {
width: 132px; } }
.table-features th {
padding: 12px 9px; }
@media (min-width: 769px) {
.table-features th {
padding: 10px 20px; } }
.table-features td:not(:nth-child(1)) {
text-align: center; }
.table-features td {
padding: 10px 9px;
position: relative; }
@media (min-width: 769px) {
.table-features td {
padding: 19px; } }
.table-features p + p {
margin-top: -1px;
margin-bottom: 3px; }
@media (min-width: 769px) {
.table-features p + p {
margin-top: -6px;
margin-bottom: 0; } }
.table-features table tr:first-child th:first-child {
border-top-left-radius: 10px; }
.table-features table tr:first-child th:last-child {
border-top-right-radius: 10px; }
.table-features table tr:last-child td:first-child {
border-bottom-left-radius: 10px; }
.table-features table tr:last-child td:last-child {
border-bottom-right-radius: 10px; }
.table-features table tr th,
.table-features table tr td {
border-right: 1px solid #1e1e1e;
border-bottom: 1px solid #1e1e1e; }
.table-features table tr th:first-child,
.table-features table tr td:first-child {
border-left: 1px solid #1e1e1e; }
.table-features table tr th {
border-top: 1px solid #1e1e1e; }
.table-features__icon {
height: 100%;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%); }
.table-features__inner {
max-width: 1014px;
margin: auto;
padding: 0 10px; }
@media (min-width: 769px) {
.table-features__inner {
padding: 0 15px; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/text-area/text-area.scss */
.text-input .text-input__el.text-input__text-area {
line-height: 24px;
height: 180px;
background: none;
resize: none;
border: 2px solid #f2f2f2;
padding: 0;
padding-left: 5px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/text-icons/text-icons.scss */
/* ------------------------------------------------------------ *\
text-icons
\* ------------------------------------------------------------ */
.text-icons {
padding: 10px 25px;
text-align: center; }
@media (min-width: 769px) {
.text-icons {
padding: 10px 30px; } }
.text-icons__title {
padding: 0 15px;
margin-bottom: 14px; }
@media (min-width: 769px) {
.text-icons__title {
margin-bottom: 6px; } }
.text-icons__content {
padding: 0 15px;
max-width: 541px;
margin: 0 auto 14px; }
@media (min-width: 769px) {
.text-icons__content {
margin: 0 auto 26px; } }
.text-icons__icons {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center; }
.text-icons__icons li {
padding: 0 10px; }
.text-icons__icons a {
display: inline-block; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/text-input/text-input.scss */
.text-input--default {
position: relative; }
.text-input {
position: relative;
/* Resolves autocomplete white background issue */ }
.text-input input:-webkit-autofill,
.text-input input:-webkit-autofill:hover,
.text-input input:-webkit-autofill:focus,
.text-input input:-webkit-autofill:active {
transition-delay: 9999s; }
.text-input__wrapper {
border: 1px solid #1e1e1e;
border-radius: 10px;
height: 44px;
line-height: 45px;
padding: 0 15px;
position: relative; }
.text-input--default .text-input__wrapper {
position: relative; }
.text-input__el {
border: 0;
z-index: 1;
width: 100%;
height: 100%;
position: relative;
font-size: 14px; }
.text-input--label .text-input__el {
border: 1px solid #000;
height: 50px;
padding-left: 15px; }
.text-input__el:focus, .text-input__el:active {
outline: none !important;
box-shadow: none !important; }
.text-input__label {
pointer-events: none;
z-index: 9; }
.text-input--label .text-input__label {
margin-bottom: 10px; }
.text-input--default .text-input__label {
position: absolute;
top: 0;
bottom: 0;
margin: auto;
transform: translateY(0);
height: 1.5em;
transition: all 200ms;
z-index: 1;
background: #fff;
line-height: 1.5em; }
.text-input--default .text-input__label.is-active {
transform: translateY(-120%);
font-size: 12px;
padding: 0 4px; }
.text-input__error {
font-size: 12px;
left: 0;
position: absolute;
top: 100%;
transition: opacity 300ms; }
.text-input--floating-errors .text-input__error {
background: #fff;
border-radius: 2px;
box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.2);
left: 0;
padding: 4px;
position: absolute;
right: 0;
text-align: center;
width: 100%; }
.text-input--label .text-input__error,
.text-input--default .text-input__error {
margin-top: 7px; }
.form-row__error__text-error {
bottom: -23px;
left: 9px;
margin-top: 5px;
position: absolute;
transition: opacity 300ms; }
@media (min-width: 769px) {
.form-row__error__text-error {
bottom: -28px; } }
.form-row__error {
margin-bottom: 29px; }
@media (min-width: 769px) {
.form-row__error {
margin-bottom: 20px; } }
.double .form-row__error {
margin-bottom: 29px; }
@media (min-width: 769px) {
.double .form-row__error {
margin-bottom: 20px; } }
.form-row__error .text-input__wrapper {
border-color: #ef7875; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/trending-products/trending-products.scss */
/* ------------------------------------------------------------ *\
Trending Products
\* ------------------------------------------------------------ */
.trending-products {
padding: 0 0 56px;
overflow: hidden; }
@media (min-width: 1024px) {
.trending-products {
padding-bottom: 108px; } }
@media (min-width: 1024px) {
.trending-products--article {
padding-bottom: 93px; } }
.trending-products--article .trending-products__head {
margin-bottom: 27px; }
@media (min-width: 769px) {
.trending-products--article .trending-products__head {
margin-bottom: 32px; } }
.trending-products__carousel {
visibility: hidden;
opacity: 0; }
.trending-products__carousel.is-initialized {
opacity: 1;
visibility: visible; }
.trending-products__carousel .flickity-viewport {
overflow: visible; }
@media (min-width: 1024px) {
.trending-products__carousel .flickity-viewport {
overflow: hidden; } }
.trending-products__carousel .flickity-page-dots {
position: static;
max-width: 1200px;
display: none;
border-radius: 40px;
overflow: hidden;
margin: 26px auto 0;
background-color: #ededed; }
@media (min-width: 769px) {
.trending-products__carousel .flickity-page-dots {
display: flex; } }
.trending-products__carousel .flickity-page-dots .dot {
flex: 1;
border-radius: 40px;
height: 5px;
width: auto;
background-color: #ededed;
transition: background-color 0.4s;
opacity: 1;
margin: 0; }
.trending-products__carousel .flickity-page-dots .dot.is-selected {
background-color: #1e1e1e; }
.trending-products__container {
padding: 0 10px; }
.trending-products__head {
text-align: center;
margin-bottom: 32px; }
.trending-products__head .trending-product__title {
text-transform: uppercase; }
.trending-products__cell {
margin-right: 10px;
width: 266px; }
@media (min-width: 769px) {
.trending-products__cell {
width: calc((100% - 20px) / 3); } }
.trending-products__cell:last-child {
margin-right: 0; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/video/video.scss */
.video {
height: 0;
margin: 20px auto;
padding-bottom: 56.25%; }
.video__controls {
left: 10px;
bottom: 10px;
pointer-events: none; }
.video__controls li {
width: 38px;
height: 38px;
padding: 0 3px;
position: relative;
margin-right: 15px;
border-radius: 50%;
transform: translateY(50px);
transition: transform 300ms ease-in-out; }
.video__controls li:nth-child(1) {
transition-delay: 100ms; }
.video__controls li:nth-child(2) {
transition-delay: 200ms; }
.video__controls li:nth-child(3) {
transition-delay: 300ms; }
.video__controls--hidden {
display: none; }
.video__controls.is-showing {
pointer-events: all; }
.video__controls.is-showing li {
transform: translateY(0); }
.video__btn {
color: #000; }
.video__btn__pause, .video__btn__sound-on {
display: flex; }
.video__btn__play, .video__btn__sound-off {
display: none; }
.is-active .video__btn__pause, .is-active .video__btn__sound-on {
display: none; }
.is-active .video__btn__play, .is-active .video__btn__sound-off {
display: flex; }
.video__inner {
top: 0;
left: 0;
z-index: 0;
width: 100%;
height: 100%;
overflow: hidden;
position: absolute;
background-color: #f2f2f2;
transition: background-color 0.2s ease-in-out; }
.video__inner.no-fallback .video__el {
display: block; }
.video__inner.is-loaded .video__el {
opacity: 1;
transition-delay: 0.3s;
visibility: visible; }
.video__inner.is-loaded .video__loader {
opacity: 0;
visibility: hidden; }
.video__inner.is-loaded .img {
display: none; }
.video__inner.pos-center .video__el {
top: 50%;
transform: translate(-50%, -50%); }
.video__inner.pos-top .video__el {
top: 0;
transform: translate(-50%, 0); }
.video__inner.pos-bottom .video__el {
bottom: 0;
top: auto;
transform: translate(-50%, 0); }
.video__el {
top: 50%;
left: 50%;
opacity: 0;
width: auto;
height: auto;
display: block;
min-width: 100%;
min-height: 100%;
-o-object-fit: cover;
object-fit: cover;
position: absolute;
visibility: hidden;
transform: translate(-50%, -50%);
transition-duration: 0.4s;
transition-property: opacity, visibility;
transition-timing-function: ease-in-out; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/waitlist-images/waitlist-images.scss */
/* ------------------------------------------------------------ *\
waitlist-images
\* ------------------------------------------------------------ */
.waitlist-images {
padding: 35px 9px 17px; }
@media (min-width: 769px) {
.waitlist-images {
padding: 99px 9px 17px; } }
.waitlist-images .btn, .waitlist-images #onetrust-banner-sdk #onetrust-button-group button, #onetrust-banner-sdk #onetrust-button-group .waitlist-images button {
min-width: 0;
width: 90%;
height: auto;
padding-top: 5px;
padding-bottom: 5px; }
@media (min-width: 1024px) {
.waitlist-images .btn, .waitlist-images #onetrust-banner-sdk #onetrust-button-group button, #onetrust-banner-sdk #onetrust-button-group .waitlist-images button {
min-width: 235px;
height: 50px;
padding-top: 0;
padding-bottom: 0; } }
.waitlist-images__items {
display: flex;
flex-wrap: wrap;
margin: 0 -5px; }
.waitlist-images__item {
padding: 0 5px;
width: 50%;
flex: 0 0 50%;
display: none;
margin-bottom: 8px; }
@media (min-width: 769px) {
.waitlist-images__item {
flex: 0 0 25%;
width: 25%;
margin-bottom: 0; } }
.waitlist-images__item.is-active {
display: block; }
.waitlist-images__card {
padding-top: 100%;
border-radius: 10px;
position: relative;
overflow: hidden;
border: 1px solid transparent;
transition: filter 0.25s, border 0.25s; }
.waitlist-images__card:hover {
filter: drop-shadow(4px 4px 0 #000);
border: 1px solid #1e1e1e; }
.waitlist-images__card:hover .waitlist-images__btn {
opacity: 1; }
.waitlist-images__card:hover .waitlist-images__image {
transform: scale(1.08); }
.waitlist-images__image {
width: 100%;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1;
transition: transform 0.25s;
background-size: cover;
background-position: center center;
background-repeat: no-repeat; }
.waitlist-images__link {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 2; }
.waitlist-images__btn {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
opacity: 0;
transition: opacity 0.25s;
z-index: 3; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/wysiwyg/wysiwyg.scss */
.wysiwyg {
margin: 0 auto;
position: relative;
max-width: 414px;
width: calc(100% - 30px); }
.product-hero__details .wysiwyg {
max-width: 100%;
width: 100%; }
@media (min-width: 415px) {
.wysiwyg {
width: calc(100% - 80px); }
.product-hero__details .wysiwyg {
width: 100%; } }
.wysiwyg__container {
/**
* Scoped as many editors will not support adding
* class names to tags. All typographic styles
* should be maintained in the typography css lib.
**/ }
.wysiwyg__container p + p {
margin-top: 1em; }
.wysiwyg__container ol,
.wysiwyg__container ul {
/* @extend .list; */ }
.wysiwyg__container blockquote {
/* @extend .blockquote; */ }
.wysiwyg__container img {
/* @extend .img; */ }
.wysiwyg__container hr {
/* @extend .hr; */ }
.wysiwyg__container a {
/* @extend .link; */ }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/page-faq/faq-accordions/faq-accordions.scss */
/* ------------------------------------------------------------ *\
faq-accordions
\* ------------------------------------------------------------ */
.faq-accordions {
padding: 0 0 38px;
margin: 0 -10px; }
@media (min-width: 769px) {
.faq-accordions {
padding: 28px 0;
margin: 0; } }
.faq-accordions__head {
color: #1e1e1e;
text-align: center;
margin-bottom: 20px; }
@media (min-width: 769px) {
.faq-accordions__head {
margin-bottom: 57px; } }
.faq-accordions__body {
max-width: 940px;
margin: auto; }
.faq-accordions__message {
text-align: center;
margin-top: 31px; }
.faq-accordions__message a {
color: #ed6600;
transition: color 0.25s; }
.faq-accordions__message a:hover {
color: #1e1e1e; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/page-home/full-image/full-image.scss */
.full-image {
padding: 0 0 40px;
position: relative; }
@media (min-width: 1024px) {
.full-image {
padding-bottom: 77px; } }
.full-image__inner {
padding: 0 10px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/page-home/split-image/split-image.scss */
/* ------------------------------------------------------------ *\
Split Image
\* ------------------------------------------------------------ */
.split-image {
padding: 0 0 36px; }
@media (min-width: 1024px) {
.split-image {
padding: 0 0 43px; } }
@media (min-width: 769px) {
.split-image .split-image__block__inner {
padding-top: 134%; } }
.split-image__inner {
padding: 0 10px; }
@media (min-width: 769px) {
.split-image__blocks {
display: flex;
flex-wrap: wrap;
justify-content: space-between; } }
.split-image__block {
margin-bottom: 24px; }
.split-image__block:last-child {
margin-bottom: 0; }
@media (min-width: 769px) {
.split-image__block {
margin: 0;
width: calc(50% - 5px); } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/page-styleguide/styleguide/styleguide.scss */
.s-guide {
padding: 50px 0; }
.s-guide__byline {
margin-bottom: 15px;
display: flex; }
.s-guide__tag {
white-space: nowrap;
background-color: #f2f2f2;
padding: 5px;
margin-right: 5px;
margin-bottom: 5px;
border-radius: 3px;
max-height: calc(1em + 12px); }
.s-guide__byline span:nth-child(2) {
padding-top: 6px; }
.s-guide__hr {
margin: 45px 0; }
.s-guide__container {
width: 100%;
padding-top: 60%; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/page-styleguide/styleguide-card-carousel/styleguide-card-carousel.scss */
/* ------------------------------------------------------------ *\
Card Carousel
\* ------------------------------------------------------------ */
.section-card-carousel {
padding: 34px 30px 52px; }
@media (min-width: 376px) {
.section-card-carousel {
padding-left: 50px;
padding-right: 50px; } }
@media (min-width: 415px) {
.section-card-carousel {
padding-top: 70px; } }
@media (min-width: 769px) {
.section-card-carousel {
padding: 95px 30px 95px; } }
@media (min-width: 1024px) {
.section-card-carousel {
padding: 80px 76px 78px; } }
.section-card-carousel .flickity-enabled {
position: static; }
@media (min-width: 1024px) {
.section-card-carousel .flickity-enabled {
margin: 0 -19px; } }
.section-card-carousel .flickity-page-dots {
position: static;
margin-top: 28px; }
@media (min-width: 415px) {
.section-card-carousel .flickity-page-dots {
margin-top: 25px; } }
@media (min-width: 769px) {
.section-card-carousel .flickity-page-dots {
margin-top: 35px; } }
@media (min-width: 1024px) {
.section-card-carousel .flickity-page-dots {
margin-top: 65px; } }
.section-card-carousel .flickity-page-dots .dot {
background: none;
margin: 0 3px;
opacity: 1;
border: 1px solid blue; }
.section-card-carousel .flickity-page-dots .dot.is-selected {
background: blue; }
.section-card-carousel .section__title {
margin-bottom: 24px;
text-align: center; }
@media (min-width: 769px) {
.section-card-carousel .section__title {
margin-bottom: 40px; } }
@media (min-width: 1024px) {
.section-card-carousel .section__title {
margin-bottom: 39px;
font-size: 60px;
line-height: 68px; } }
.section-card-carousel .section__description {
letter-spacing: 0.5px;
max-width: 302px;
margin: 0 auto; }
@media (min-width: 415px) {
.section-card-carousel .section__description {
max-width: 100%; } }
.section-card-carousel .section__head {
max-width: 490px;
margin: 0 auto 10px;
text-align: center; }
@media (min-width: 415px) {
.section-card-carousel .section__head {
margin-bottom: 60px; } }
@media (min-width: 769px) {
.section-card-carousel .section__head {
max-width: 890px;
margin-bottom: 35px; } }
@media (min-width: 1024px) {
.section-card-carousel .section__head {
margin-bottom: 45px; } }
.section-card-carousel .section__body {
max-width: 318px;
margin: 0 auto; }
@media (min-width: 769px) {
.section-card-carousel .section__body {
max-width: 100%; } }
.section-card-carousel .section__slide-wrapper {
width: 100%; }
@media (min-width: 769px) {
.section-card-carousel .section__slide-wrapper {
max-width: 50%;
padding: 0 12px; } }
@media (min-width: 1024px) {
.section-card-carousel .section__slide-wrapper {
max-width: 33.33%;
padding: 0 42px; } }
.section-card-carousel .section__slide {
margin: 0 auto;
padding: 15px 27px; }
@media (min-width: 769px) {
.section-card-carousel .section__slide {
padding: 35px 35px 30px; } }
@media (min-width: 1024px) {
.section-card-carousel .section__slide {
padding: 35px 30px 15px; } }
.section-card-carousel .section__slide-media {
position: relative;
height: 0;
padding-top: 76.22%;
margin-bottom: 10px; }
@media (min-width: 769px) {
.section-card-carousel .section__slide-media {
margin-bottom: 17px; } }
.section-card-carousel .section__slide-head {
margin-bottom: 25px; }
@media (min-width: 1024px) {
.section-card-carousel .section__slide-head {
margin-bottom: 15px; } }
.section-card-carousel .section__slide-entry {
text-align: center; }
.section-card-carousel .section__slide-entry:last-child {
margin-bottom: 0; }
.section-card-carousel .section__slide-foot .section__slide-entry {
font-size: 19px;
line-height: 26px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/page-styleguide/styleguide-colors/styleguide-colors.scss */
.styleguide-colors-list {
list-style-type: none; }
.styleguide-colors-list > li > span {
display: inline-block;
width: 80px;
height: 80px;
box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034), 0 6.7px 5.3px rgba(0, 0, 0, 0.048), 0 12.5px 10px rgba(0, 0, 0, 0.06), 0 22.3px 17.9px rgba(0, 0, 0, 0.072), 0 41.8px 33.4px rgba(0, 0, 0, 0.086), 0 100px 80px rgba(0, 0, 0, 0.12); }
.styleguide-colors-list li {
margin-bottom: 20px;
display: flex;
align-items: center; }
.styleguide-colors-list li p {
align-self: center;
margin: 0;
display: block;
margin-left: 20px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/page-styleguide/styleguide-product-card-carousel/styleguide-product-card-carousel.scss */
/* ------------------------------------------------------------ *\
Card Carousel
\* ------------------------------------------------------------ */
.section-product-card-carousel {
padding: 34px 30px 52px; }
@media (min-width: 376px) {
.section-product-card-carousel {
padding-left: 50px;
padding-right: 50px; } }
@media (min-width: 415px) {
.section-product-card-carousel {
padding-top: 70px; } }
@media (min-width: 769px) {
.section-product-card-carousel {
padding: 95px 30px 95px; } }
@media (min-width: 1024px) {
.section-product-card-carousel {
padding: 80px 76px 78px; } }
.section-product-card-carousel .section__title {
margin-bottom: 24px;
text-align: center; }
@media (min-width: 769px) {
.section-product-card-carousel .section__title {
margin-bottom: 40px; } }
@media (min-width: 1024px) {
.section-product-card-carousel .section__title {
margin-bottom: 39px;
font-size: 60px;
line-height: 68px; } }
.section-product-card-carousel .section__description {
letter-spacing: 0.5px;
max-width: 302px;
margin: 0 auto; }
@media (min-width: 415px) {
.section-product-card-carousel .section__description {
max-width: 100%; } }
.section-product-card-carousel .section__head {
max-width: 490px;
margin: 0 auto 10px;
text-align: center; }
@media (min-width: 415px) {
.section-product-card-carousel .section__head {
margin-bottom: 60px; } }
@media (min-width: 769px) {
.section-product-card-carousel .section__head {
max-width: 890px;
margin-bottom: 35px; } }
@media (min-width: 1024px) {
.section-product-card-carousel .section__head {
margin-bottom: 45px; } }
.section-product-card-carousel .section__body {
max-width: 318px;
margin: 0 auto; }
@media (min-width: 769px) {
.section-product-card-carousel .section__body {
max-width: 100%; } }
.section-product-card-carousel .section__slide-wrapper {
width: 100%; }
@media (min-width: 769px) {
.section-product-card-carousel .section__slide-wrapper {
max-width: 50%;
padding: 0 12px; } }
@media (min-width: 1024px) {
.section-product-card-carousel .section__slide-wrapper {
max-width: 33.33%;
padding: 0 42px; } }
.section-product-card-carousel .section__slide {
margin: 0 auto;
padding: 15px 27px; }
@media (min-width: 769px) {
.section-product-card-carousel .section__slide {
padding: 35px 35px 30px; } }
@media (min-width: 1024px) {
.section-product-card-carousel .section__slide {
padding: 35px 30px 15px; } }
.section-product-card-carousel .section__slide-media {
position: relative;
height: 0;
padding-top: 76.22%;
margin-bottom: 10px; }
@media (min-width: 769px) {
.section-product-card-carousel .section__slide-media {
margin-bottom: 17px; } }
.section-product-card-carousel .section__slide-head {
margin-bottom: 25px; }
@media (min-width: 1024px) {
.section-product-card-carousel .section__slide-head {
margin-bottom: 15px; } }
.section-product-card-carousel .section__slide-entry {
text-align: center; }
.section-product-card-carousel .section__slide-entry:last-child {
margin-bottom: 0; }
.section-product-card-carousel .section__slide-foot .section__slide-entry {
font-size: 19px;
line-height: 26px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/page-text/text/text.scss */
/* ------------------------------------------------------------ *\
text
\* ------------------------------------------------------------ */
.text {
padding: 9px 0 45px;
color: #1e1e1e; }
@media (min-width: 769px) {
.text {
padding: 35px 0 60px; } }
@media (min-width: 1024px) {
.text {
padding: 119px 0 113px; } }
.text img {
width: calc(100% + 20px);
margin: 0 -10px 1.6em; }
@media (min-width: 769px) {
.text img {
width: 100%;
margin: 0 0 2.7em; } }
.text p + p span img {
margin-top: 3.4em; }
.text h1 {
margin-bottom: 0.56em; }
.text h2 {
margin-bottom: 0.85em; }
.text h3 {
margin-bottom: 1.04em; }
.text h4 {
margin-bottom: 1.2em; }
.text h5 {
margin-bottom: 1.8em; }
.text h6 {
margin-bottom: 2em; }
.text ul,
.text ol {
padding-left: 21px;
padding-top: 21px;
margin-bottom: 20px; }
@media (min-width: 769px) {
.text ul,
.text ol {
padding-left: 24px;
padding-top: 14px;
margin-bottom: 29px; } }
.text ul + h1,
.text ul + h2,
.text ul + h3,
.text ul + h4,
.text ul + h5,
.text ul + h6,
.text ol + h1,
.text ol + h2,
.text ol + h3,
.text ol + h4,
.text ol + h5,
.text ol + h6 {
margin-top: 1.5em; }
.text h6 + p {
margin-top: -12px; }
.text blockquote {
margin-top: 47px; }
.text__inner {
padding: 0 20px;
max-width: 906px;
margin: auto; }
@media (min-width: 769px) {
.text__inner {
padding: 0 15px; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/product/product-accordions/product-accordions.scss */
/* ------------------------------------------------------------ *\
Product Accordions
\* ------------------------------------------------------------ */
.product-accordions {
margin-top: 48px;
border: 1px solid #1e1e1e;
border-radius: 10px;
overflow: hidden;
position: absolute;
visibility: visible;
opacity: 0;
pointer-events: none; }
.product-accordions.is-visible-accordion {
position: static;
visibility: visible;
pointer-events: auto;
opacity: 1; }
.product-accordions .accordion__body__content {
border-top: 1px solid #1e1e1e;
padding: 20px;
background-color: #ededed;
font-size: 14px; }
.product-accordions .accordion__body__content a {
color: #d95d00; }
.product-accordions .accordion__body__content li::before {
width: 4px;
height: 4px;
background: currentColor;
top: 12px; }
.product-accordions .accordion__body__content table {
margin-left: -20px;
margin-right: -20px;
width: calc(100% + 40px) !important;
margin-bottom: -20px;
margin-top: 20px;
border-top: 1px solid #1e1e1e; }
.product-accordions .accordion__body__content table tr {
border-bottom: 1px solid currentColor; }
.product-accordions .accordion__body__content table tr:last-child {
border-bottom: 0; }
.product-accordions .accordion__body__content table td {
padding: 8px;
width: auto !important; }
.product-accordions .accordion__body__content table td:first-child {
width: 130px !important; }
.product-accordions .accordion__body__content span,
.product-accordions .accordion__body__content i {
background-color: transparent !important; }
.product-accordions .accordion {
border-bottom: 1px solid #1e1e1e;
padding: 0; }
.product-accordions .accordion:last-child {
border-bottom: 0; }
.product-accordions .accordion__title {
font-size: 14px;
padding: 8px 20px; }
.product-accordions .accordion__title:focus, .product-accordions .accordion__title:active {
outline: none !important;
box-shadow: none !important; }
.product-accordions .accordion__title__icon::after,
.product-accordions .accordion__title__icon::before {
width: 14px;
height: 2px;
top: calc(50% + 1px);
right: 20px;
background-color: #1e1e1e;
opacity: 1; }
.product__cta__actions .product-accordions {
margin-top: 0; }
@media (min-width: 1024px) {
.product__cta__actions .product-accordions {
display: none; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/product/product-gallery/product-gallery.scss */
.product-gallery {
position: relative;
border-radius: 10px;
overflow: hidden;
background-color: #ededed; }
.product-gallery .flickity-page-dots {
position: absolute;
bottom: 10px; }
@media (min-width: 1024px) {
.product-gallery {
background-color: transparent;
display: flex;
gap: 5px;
border-radius: 0; }
.product-gallery .flickity-page-dots {
display: none; } }
.product-gallery .dot {
width: 6px;
height: 6px;
margin: 0 3px;
border: 1px solid #1e1e1e;
background-color: transparent;
opacity: 1;
transition: background-color 0.4s; }
.product-gallery .dot.is-selected {
background-color: #1e1e1e; }
.product-gallery .dot:first-child:last-child {
display: none !important; }
.product-gallery__cell {
position: relative;
padding-top: 100%;
background-color: #ededed;
width: 100%;
overflow: hidden; }
@media (min-width: 1024px) {
.product-gallery__cell {
border-radius: 4px; } }
.product-gallery__cell__badges {
display: flex;
position: absolute;
top: 0;
left: 0;
width: 100%;
pointer-events: none;
align-items: center;
flex-wrap: wrap;
z-index: 6;
padding: 10px 10px; }
@media (min-width: 769px) {
.product-gallery__cell__badges {
padding: 14px 20px; } }
.product-gallery__cell__badges .product-badges__item:nth-child(even) {
margin-left: auto;
order: 1; }
.product-gallery__cell__badges .product-badges__item:nth-child(odd) {
margin-right: auto;
order: -1; }
.product-gallery__cell__badges .product-badges__item__cdn-image {
height: 40px;
width: auto; }
@media (min-width: 769px) {
.product-gallery__cell__badges .product-badges__item__cdn-image {
height: 75px; } }
.product-gallery__cell__badges .product-badges__item__cdn-image[alt="Pre-Order"],
.product-gallery__cell__badges .product-badges__item__cdn-image[alt="Waitlist"] {
height: 75px;
width: 75px; }
@media (min-width: 769px) {
.product-gallery__cell__badges .product-badges__item__cdn-image[alt="Pre-Order"],
.product-gallery__cell__badges .product-badges__item__cdn-image[alt="Waitlist"] {
height: 114px;
width: 114px; } }
.product-gallery__featured .flickity-prev-next-button {
display: none; }
@media (min-width: 1024px) {
.product-gallery__featured {
width: calc(100% - 85px); }
.product-gallery__featured .flickity-prev-next-button {
display: block;
transform: initial;
top: auto;
bottom: 10px; }
.product-gallery__featured .flickity-prev-next-button.previous {
left: auto;
right: 59px; } }
.product-gallery-thumbs {
display: none; }
@media (min-width: 1024px) {
.product-gallery-thumbs {
display: block;
width: 80px; }
.product-gallery-thumbs .product-gallery-thumbs__inner {
height: 80px;
width: 500px;
transform: rotate(90deg) translate(0, -100%);
transform-origin: left top; }
.product-gallery-thumbs .product-gallery__cell {
width: 80px;
height: 80px;
margin-right: 5px;
padding: 0;
border: solid 1px transparent; }
.product-gallery-thumbs .product-gallery__cell.is-selected {
border-color: #000; }
.product-gallery-thumbs .product-gallery__cell .img {
transform: rotate(-90deg); } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/product/product-hero/product-hero.scss */
.product-hero {
padding: 0 10px 50px;
position: relative; }
@media (min-width: 769px) {
.product-hero {
padding-bottom: 80px; } }
@media (min-width: 1024px) {
.product-hero {
padding-bottom: 116px; } }
.product-hero .product-hero__inner {
display: flex;
flex-wrap: wrap; }
@media (min-width: 1024px) {
.product-hero .product-hero__content__sticky {
top: 90px;
position: sticky; } }
.product-hero .product-hero__content,
.product-hero .product-hero__images {
width: 100%; }
@media (min-width: 1024px) {
.product-hero .product-hero__content,
.product-hero .product-hero__images {
width: 50%; } }
.product-hero .product-hero__images {
margin-bottom: 20px;
position: relative; }
@media (min-width: 1024px) {
.product-hero .product-hero__images {
margin-bottom: 0; } }
@media (min-width: 1024px) {
.product-hero .product-hero__content {
padding: 40px 0 0 40px;
position: relative;
z-index: 2; } }
@media (min-width: 1201px) {
.product-hero .product-hero__content {
padding: 40px 0 0 120px; } }
@media (min-width: 1024px) {
.product-hero .product-hero__content__inner__width {
max-width: 468px; } }
.product-hero__details__price {
color: #1e1e1e; }
.product-hero__details__price.discounted {
opacity: 0.3;
text-decoration: line-through; }
.product-hero__badges {
display: inline-block; }
.product-hero__badge {
margin-bottom: 10px; }
.product-hero__badge:last-child {
margin-bottom: 0; }
.product-hero__badge__icon--img {
position: relative;
height: 20px;
width: auto; }
.product-hero__badge__text {
font-size: 14px;
margin-left: 1px; }
.product-hero__details__title {
margin-bottom: 2px; }
.product-hero__details__title:last-child {
margin-bottom: 0; }
@media (max-width: 767px) {
.product-hero__details__title {
font-size: 18px;
margin-bottom: 5px; } }
.product-hero__details__cta {
margin-top: 10px; }
@media (min-width: 1024px) {
.product-hero__details__cta {
margin-top: 29px; } }
.product-hero__gallery {
transition: opacity 0.4s; }
@media (min-width: 1024px) {
.product-hero__loader {
top: 200px;
transform: translateX(-50%); } }
.product-hero.is-loading .product-hero__gallery {
opacity: 0;
transition: none; }
.product-hero.is-loading .product-hero__loader {
visibility: visible;
opacity: 1; }
.product-breadcrumbs {
display: flex;
flex-wrap: wrap; }
.product-breadcrumbs .product-breadcrumb:not(:last-child) {
position: relative;
padding-right: 14px; }
.product-breadcrumbs .product-breadcrumb:not(:last-child)::after {
content: '•';
position: absolute;
right: 4px;
color: #878787; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/product/product-selector/product-selector.scss */
.product-sizes {
-webkit-overflow-scrolling: touch;
margin: 10px 0;
overflow-y: auto; }
.product-sizes__title {
margin: 10px 0;
text-align: center; }
@media (min-width: 1024px) {
.product-sizes {
overflow: initial; } }
.product-sizes__wrapper {
overflow: auto;
margin: 10px 0;
white-space: nowrap; }
.product-sizes__wrapper .product-sizes__single {
display: inline-block; }
@media (min-width: 415px) {
.product-sizes__wrapper {
margin-right: 0;
padding-right: 0; } }
@media (min-width: 769px) {
.product-sizes__wrapper {
padding: 0;
display: flex;
margin: 0 -5px;
flex-wrap: wrap;
white-space: normal; } }
.product-sizes__single {
width: 40px;
height: 40px;
cursor: pointer;
text-align: center;
background: #ccc;
margin: 5px 5px 5px 0; }
@media (min-width: 769px) {
.product-sizes__single {
margin: 5px; } }
.product-sizes__single span {
left: 0;
right: 0;
top: 50%;
transform: translateY(-50%); }
.product-sizes__single.active {
color: #fff;
pointer-events: none;
background: #ccc; }
.product-sizes__single.disabled {
color: #000;
cursor: no-drop;
background: transparent;
border: 1px solid #000; }
.product-sizes__single.disabled::before {
content: '';
top: 50%;
left: -8px;
width: 54px;
height: 1px;
position: absolute;
pointer-events: none;
background: #000;
transform: translateY(-50%) rotate(-45deg); }
.product-sizes__single.active.disabled {
color: #fff;
background: #ccc;
border: 1px solid #ccc; }
.product-sizes__single.active.disabled::before {
background: #fff; }
.product-size__guide {
padding: 16px 20px;
margin: 50px auto 30px; }
.product-size__guide__wrapper {
margin: 0 auto;
display: block;
max-width: 300px; }
.product-select {
align-items: center;
justify-content: space-between; }
.product-select__dropdown {
width: calc(70% - 10px); }
.product-select__quantity {
width: calc(30% - 10px); }
.product-select__swatches__title {
font-size: 12px;
line-height: 20px;
margin-bottom: 17px; }
.product-select__swatches__item {
border-radius: 50%;
display: block;
height: 30px;
position: relative;
width: 30px; }
.product-select__swatches__item:not(:last-child) {
margin-right: 15px; }
.product-select__swatches__item.active::after {
border: solid 1px red;
border-radius: 50%;
bottom: -2px;
content: '';
display: block;
left: -2px;
position: absolute;
right: -2px;
top: -2px; }
.product-select__swatches__item.disabled {
cursor: not-allowed;
opacity: 0.2;
pointer-events: none; }
.product-select__buttons__items {
flex-wrap: wrap;
margin: -3px; }
.product-select__buttons__item__wrapper {
padding: 3px; }
.product-select__buttons__item {
border: solid 1px #ededed;
border-radius: 6px;
min-width: 44px;
height: 44px;
font-size: 14px;
padding: 5px;
transition: border-color 0.4s;
background-color: #ededed; }
.product-select__buttons__item:focus, .product-select__buttons__item:active {
outline: none !important;
box-shadow: none !important; }
.product-select__buttons__item.active {
border-color: #000; }
.product-select__buttons__item.disabled {
opacity: 0.2;
background-color: #fff;
border-color: #fff; }
.product-select__buttons__title {
margin-bottom: 5px;
color: #878787;
transition: color 0.4s;
font-size: 14px; }
.size-selected .product-select__buttons__title {
color: #1e1e1e; }
.product-bis__form {
margin-top: 35px; }
.product-bis__title {
margin-bottom: 10px; }
.product-bis__content {
display: flex;
border: 1px solid #1e1e1e;
border-radius: 10px;
max-width: 350px; }
.product-bis__content .text-input {
width: 100%; }
.product-bis__content .text-input__wrapper {
height: 50px;
border: 0; }
.product-bis__content .btn, .product-bis__content #onetrust-banner-sdk #onetrust-button-group button, #onetrust-banner-sdk #onetrust-button-group .product-bis__content button {
min-width: 120px;
width: auto; }
.product-bis__content .form-row__error {
margin-bottom: 0; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/product/recommended-products/recommended-products.scss */
.recommended-products {
padding: 0 0 50px; }
.recommended-products .recommended-products__title {
text-transform: uppercase; }
.recommended-products .trending-products {
padding: 0; }
.recommended-products__head {
text-align: center;
margin-bottom: 32px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/product/zoom-gallery/zoom-gallery.scss */
.zoom-gallery {
bottom: 0;
left: 0;
overflow: scroll;
position: fixed;
right: 0;
top: 0;
z-index: 999; }
.zoom-gallery__close {
color: #fff;
position: fixed;
right: 20px;
top: 20px;
z-index: 9999; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/product-kit/product-kit-gallery/product-kit-gallery.scss */
.product-kit-gallerys {
background-color: #f2f2f2;
padding: 16px 0;
border-radius: 10px; }
@media (min-width: 1024px) {
.product-kit-gallerys {
padding: 32px 0; } }
.product-kit-gallery {
position: relative;
border-radius: 0;
overflow: hidden;
background-color: #f2f2f2; }
.product-kit-gallery .flickity-prev-next-button {
border-radius: 0;
width: 36px;
height: 36px; }
.product-kit-gallery .flickity-prev-next-button:disabled {
opacity: 0; }
.product-kit-gallery .flickity-prev-next-button.prev {
left: 0; }
.product-kit-gallery .flickity-prev-next-button.next {
right: 0; }
@media (min-width: 1024px) {
.product-kit-gallery-top {
margin-bottom: 7px; } }
@media (min-width: 1024px) {
.product-kit-gallery-bottom {
margin-top: 7px; } }
.product-kit-gallery__cell {
width: 50%;
overflow: hidden;
background-color: #f2f2f2;
border: solid 1px transparent;
border-radius: 5px; }
@media (min-width: 1024px) {
.product-kit-gallery__cell {
width: 33%; } }
.product-kit-gallery__cell.is-selected {
border-color: #000; }
.product-kit-gallery__cell__inner {
padding-top: 100%;
position: relative; }
.product-kit-gallery__indicator {
display: flex;
font-style: italic;
font-size: 14px; }
@media (min-width: 1024px) {
.product-kit-gallery__indicator {
font-size: 16px; } }
.product-kit-gallery__indicator .icon {
width: 24px; }
@media (min-width: 1024px) {
.product-kit-gallery__indicator .icon {
width: 36px; } }
.product-kit-gallery__indicator__top {
padding-bottom: 12px; }
@media (min-width: 1024px) {
.product-kit-gallery__indicator__top {
padding-bottom: 16px; } }
.product-kit-gallery__indicator__top .icon {
transform: rotate(180deg); }
.product-kit-gallery__indicator__bottom {
padding-top: 12px; }
@media (min-width: 1024px) {
.product-kit-gallery__indicator__bottom {
padding-top: 16px; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/product-kit/product-kit-hero/product-kit-hero.scss */
.product-kit-hero__images {
display: none; }
@media (min-width: 1024px) {
.product-kit-hero__images {
display: block; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/product-kit/product-kit-selector/product-kit-selector.scss */
.product-kit-title {
transition: 0.2s;
gap: 6px; }
.product-kit-title .icon {
width: 24px;
transform: rotate(90deg);
transition: translate 0.2s; }
.product-kit-title:hover {
color: #08cfea; }
.product-kit-title:hover .icon {
transform: rotate(90deg) translateY(-5px); }
.product-kit-sizechart strong {
font-weight: bold; }
.product-kit-sizechart tr {
border-bottom: solid 1px; }
.product-kit-sizechart td {
padding: 12px 8px; }
.product-kit-sizechart td:first-child {
text-transform: uppercase; }
@media (min-width: 1024px) {
.product-kit-gallerys__single {
display: none; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/cards/card/card.scss */
/* ------------------------------------------------------------ *\
card
\* ------------------------------------------------------------ */
.card {
width: 100%;
padding-top: 100%;
border-radius: 10px;
position: relative;
background-size: cover;
background-position: center center;
background-repeat: no-repeat; }
.card__image {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 1; }
.card__inner {
text-align: center;
width: 100%;
padding: 0 15px;
position: absolute;
left: 0;
bottom: 15.4%;
z-index: 2; }
@media (min-width: 769px) {
.card__inner {
bottom: 13%; } }
.card__title {
color: #fff;
margin-bottom: 16px; }
@media (min-width: 769px) {
.card__title {
margin-bottom: 0.87em; } }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/header/header/header.scss */
.header {
top: 0;
left: 0;
right: 0;
width: 100%;
transition: transform 300ms, background-color 100ms linear; }
.header > span {
width: 100% !important; }
@media (min-width: 1024px) {
.header .hide-on-desktop {
display: none; } }
@media (max-width: 1023px) {
.header .hide-on-mobile {
display: none; } }
.header__inner {
position: relative;
background-color: #fff;
width: 100% !important;
transition: transform 0.4s; }
.header__inner.translate-y-container {
transform: translateY(-100%); }
.header__container {
min-height: 70px;
padding: 0 20px; }
.header__nav,
.header__icons {
flex: 1; }
.header__logo {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%); }
.header__logo svg {
max-width: 148px; }
@media (min-width: 1024px) {
.header__logo svg {
max-width: 188px; } }
.header__logo--mobile {
display: block; }
@media (min-width: 1024px) {
.header__logo--mobile {
display: none; } }
.header__logo--desktop {
display: none; }
@media (min-width: 1024px) {
.header__logo--desktop {
display: block; } }
.header__icons__item {
margin-right: 14px; }
.header__icons__item:last-child {
margin-right: 0; }
@media (min-width: 1024px) {
.header__icons__item {
margin-right: 26px; } }
@media (min-width: 1024px) {
.header__icon__item--cart {
position: relative;
top: 2px; } }
.header__icon__item--search {
max-width: 200px; }
.header__icons__item__link--account {
display: none; }
@media (min-width: 1024px) {
.header__icons__item__link--account {
display: block; } }
.header__icon__customer {
border-radius: 50%;
background-color: #3ff;
width: 31px;
height: 31px;
text-transform: uppercase;
display: inline-flex;
align-items: center;
justify-content: center; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/header/header-cart/header-cart.scss */
.header-cart {
top: 0;
bottom: 0;
width: 100%;
padding: 10px;
max-width: 596px;
position: fixed;
transition: all 0.2s ease-in-out;
right: -100%;
z-index: 1100; }
.header-cart.active {
right: 0; }
.header-cart .cart-grid__form {
display: flex;
flex-direction: column;
height: calc(100vh - 210px); }
@media (min-width: 1024px) {
.header-cart .cart-grid__form {
height: calc(100vh - 146px); } }
.header-cart .cart-grid__footer {
position: static; }
.header-cart__wrapper {
display: block;
z-index: 1;
border: 1px solid #1e1e1e;
border-radius: 10px;
background-color: #fff;
position: absolute;
left: 10px;
top: 10px;
right: 10px;
bottom: 10px;
overflow: hidden;
min-height: unset;
height: unset; }
.header-cart--bg {
top: 0;
left: 0;
bottom: 0;
display: none;
position: fixed;
background-color: rgba(255, 255, 255, 0.8);
right: 0; }
.header-cart.active .header-cart--bg {
display: block; }
.header-cart__header__close {
top: 20px;
right: 20px;
z-index: 2;
width: 20px;
height: 20px;
cursor: pointer;
position: absolute; }
.cart-athelete__item {
max-width: 300px;
margin-left: auto;
margin-right: auto; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/header/header-cart-icon/header-cart-icon.scss */
.header-cart-icon {
display: flex;
cursor: pointer;
position: relative; }
.header-cart-icon:focus, .header-cart-icon:active {
outline: none !important;
box-shadow: none !important; }
@media (min-width: 1024px) {
.header-cart-icon__inner--mobile {
display: none; } }
.header-cart-icon__inner--desktop {
display: none; }
@media (min-width: 1024px) {
.header-cart-icon__inner--desktop {
display: block; } }
.header-cart-icon__icon {
display: block;
position: relative; }
.header-cart-icon__icon svg {
width: 24px;
height: 24px; }
@media (min-width: 1024px) {
.header-cart-icon__icon svg {
width: 32px;
height: 32px; } }
.header-cart-icon__count {
width: 21px;
height: 21px;
position: absolute;
top: -10px;
right: -10px;
background-color: #3ff;
border-radius: 50%;
color: #1e1e1e;
line-height: 21px;
font-size: 11px;
text-align: center;
padding-left: 1px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/header/header-feature/header-feature.scss */
.header-feature {
width: 300px; }
.header-feature__image {
padding-top: 120%; }
.header-feature__title {
margin-bottom: 10px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/header/header-hamburger-icon/header-hamburger-icon.scss */
.hamburger {
width: 25px;
height: 20px;
display: block;
color: currentColor;
transition: height 300ms ease-in-out; }
.hamburger.is-active {
height: 25px; }
.hamburger__inner {
height: 100%;
display: block;
position: relative; }
.hamburger__inner::after, .hamburger__inner::before {
content: '';
width: 25px;
height: 1px;
position: absolute;
background-color: currentColor;
transition: transform 300ms ease-in-out, width 300ms ease-in-out;
transform-origin: center; }
.hamburger__inner::before {
top: 0;
left: 0;
transform: rotate(0);
transform-origin: top left; }
.hamburger.is-active .hamburger__inner::before {
width: 34px;
transform: rotate(45deg); }
.hamburger__inner::after {
bottom: 0;
left: 0;
transform: rotate(0);
transform-origin: bottom left; }
.hamburger.is-active .hamburger__inner::after {
transform: rotate(-45deg);
width: 34px; }
.hamburger__inner__el {
width: 100%;
height: 1px;
position: absolute;
top: 0;
bottom: 0;
opacity: 1;
background-color: currentColor;
margin: auto;
transition: opacity 300ms ease-in-out 300ms; }
.hamburger.is-active .hamburger__inner__el {
opacity: 0;
transition: opacity 300ms ease-in-out; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/header/header-navigation/header-navigation.scss */
.header-nav.is-visible .header-nav__inner {
transform: translateY(0);
opacity: 1;
visibility: visible;
transition: opacity 0.36s 0.36s ease, visibility 0.36s 0.36s ease, transform 0.36s 0.36s ease; }
.header-nav__body {
position: fixed;
left: 0;
width: 100%;
max-width: 480px;
transform: translateX(-100%);
transition: transform 0.36s ease;
background-color: rgba(255, 255, 255, 0.95);
height: 100% !important;
overflow: hidden;
top: 0;
z-index: 3; }
.is-visible .header-nav__body {
transform: translateX(0); }
.header-nav__background {
position: fixed;
left: 0;
width: 100%;
top: 0;
height: 100%;
z-index: 2;
display: none;
background-color: rgba(255, 255, 255, 0.8); }
.header-nav.is-visible .header-nav__background {
display: block; }
.header-nav__inner {
opacity: 0;
visibility: hidden;
transform: translateY(5px);
text-align: center;
overflow-x: auto;
-ms-overflow-style: none;
/* IE and Edge */
scrollbar-width: none;
/* Firefox */
/* Hide scrollbar for Chrome, Safari and Opera */ }
.header-nav__inner::-webkit-scrollbar {
display: none; }
.header-nav__items {
display: grid;
padding: 20px 18px;
text-align: left;
max-height: calc(100vh - var(--header-height));
overflow-y: auto; }
@media (min-width: 769px) {
.header-nav__items {
padding: 30px 20px; } }
.header-nav__items details[open] > summary::after {
transition: 0.25s ease;
transform: rotate(0deg); }
.header-nav__items summary {
position: relative;
cursor: pointer; }
.header-nav__items summary::before, .header-nav__items summary::after {
content: '';
position: absolute;
width: 14px;
height: 1px;
background-color: #000;
display: block;
transition: 0.25s ease;
right: 0;
top: 50%; }
.header-nav__items summary::after {
transform: rotate(90deg); }
.header-nav__items .item-link:hover {
text-decoration: underline; }
.header-nav__item__images {
display: grid;
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%); }
.header-nav__item__image {
grid-area: 1/1;
transition: 0.2s; }
.header-nav__item__image--hover {
opacity: 0;
visibility: hidden; }
.header-nav-menu__item {
display: block;
padding: 8px 0;
position: relative; }
.header-nav-menu__item.has-icon {
padding-left: 45px; }
.header-nav-menu__item:hover .header-nav__item__image {
opacity: 0; }
.header-nav-menu__item:hover .header-nav__item__image--hover {
opacity: 1;
visibility: visible; }
.menu-drawer__submenu {
padding-left: 14px; }
.header-nav-submenu__item {
display: block;
padding: 6px 0;
font-size: 18px;
line-height: 28px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/hero-interactive/hero-interactive/hero-interactive.scss */
/* ------------------------------------------------------------ *\
Hero Interactive
\* ------------------------------------------------------------ */
.hero-interactive {
padding-bottom: 36px; }
@media (min-width: 1024px) {
.hero-interactive {
padding-bottom: 75px; } }
.hero-interactive .flickity-viewport {
overflow: visible; }
.hero-interactive .hero-interactive__carousel {
padding-left: 10px;
padding-right: 10px; }
.hero-interactive--title {
position: relative;
padding-top: 0;
padding-bottom: 10px; }
@media (min-width: 769px) {
.hero-interactive--title {
padding-top: 7px; } }
.hero-interactive--title .hero-interactive__cell {
border: 1px solid transparent;
transition: border 0.25s, filter 0.25s;
border-radius: 10px;
margin-bottom: 10px; }
@media (min-width: 769px) {
.hero-interactive--title .hero-interactive__cell:hover {
border: 1px solid #1e1e1e;
filter: drop-shadow(4px 4px 0 #000); } }
.hero-interactive__btn {
padding: 5px 14px;
min-width: initial;
height: auto;
position: absolute;
left: 9px;
top: 9px;
z-index: 2; }
@media (min-width: 769px) {
.hero-interactive__btn {
padding: 12px 19px;
left: 12px;
top: 10px; } }
.hero-interactive__sticker {
top: 103%;
left: 2%; }
.hero-interactive__inner {
overflow: hidden;
position: relative; }
.hero-interactive__cell {
position: relative;
height: 595px;
width: 335px;
margin-right: 10px; }
.hero-interactive__cell:last-child {
margin-right: 0; }
@media (min-width: 769px) {
.hero-interactive__cell {
width: 572px;
height: 763px; } }
.hero-interactive__thumbnail {
border-radius: 10px;
overflow: hidden;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-size: cover;
background-position: center;
background-repeat: no-repeat; }
.hero-interactive__hotspots {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 9; }
.hero-interactive__cell.is-selected .interactive-hotspot {
opacity: 1;
transform: translateY(0); }
.hero-interactive__cell.is-selected .interactive-hotspot:nth-child(1) {
transition: opacity 0.3s 0.4s, transform 0.6s 0.4s; }
.hero-interactive__cell.is-selected .interactive-hotspot:nth-child(2) {
transition: opacity 0.3s 0.8s, transform 0.6s 0.8s; }
.hero-interactive__cell.is-selected .interactive-hotspot:nth-child(3) {
transition: opacity 0.3s 1.2s, transform 0.6s 1.2s; }
.hero-interactive__cell.is-selected .interactive-hotspot:nth-child(4) {
transition: opacity 0.3s 1.6s, transform 0.6s 1.6s; }
/* ------------------------------------------------------------ *\
Visual Mode
\* ------------------------------------------------------------ */
.hero-interactive__visual__items {
white-space: nowrap;
overflow-x: auto;
padding-bottom: 40px; }
.hero-interactive__visual__item {
position: relative;
display: inline-block;
height: 595px;
width: 335px;
margin-right: 10px;
border-radius: 10px;
overflow: hidden; }
.hero-interactive__visual__item:last-child {
margin-right: 0; }
.hero-interactive__visual__item:first-child {
margin-left: 10px; }
@media (min-width: 769px) {
.hero-interactive__visual__item {
width: 572px;
height: 763px; } }
.hero-interactive__visual__item__image {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-size: cover;
background-position: center;
background-repeat: no-repeat; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/hero-interactive/interactive-hotspot/interactive-hotspot.scss */
.interactive-hotspot {
position: absolute;
top: 3%;
left: 51%;
width: 22px;
height: 22px;
z-index: 5;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.3s;
opacity: 0;
transform: translateY(10px); }
@media (min-width: 1024px) {
.interactive-hotspot {
opacity: 1;
transform: translateY(0); } }
.interactive-hotspot.is-active, .interactive-hotspot:hover {
z-index: 6; }
.interactive-hotspot.is-active .interactive-hotspot__icon.animated-hotspot, .interactive-hotspot:hover .interactive-hotspot__icon.animated-hotspot {
animation-play-state: paused; }
.interactive-hotspot.is-active .interactive-hotspot__icon.hovered-hotspot, .interactive-hotspot:hover .interactive-hotspot__icon.hovered-hotspot {
transform: scale(1.5);
opacity: 1; }
.interactive-hotspot__trigger {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%; }
.interactive-hotspot__icon {
width: 10px;
height: 10px;
position: absolute;
left: 6px;
top: 6px;
background-color: #3ff;
box-shadow: 0 0 6px 6px #3ff;
border-radius: 50%;
transition: transform 0.4s, opacity 0.4s;
transform-origin: center;
border: 1px solid #3ff; }
.interactive-hotspot__icon.animated-hotspot {
animation: pulse 3s ease infinite; }
.interactive-hotspot__icon.hovered-hotspot {
opacity: 0; }
@keyframes pulse {
0%,
100% {
transform: scale(1); }
50% {
transform: scale(1.3); } }
.interactive-hotspot__modal {
position: absolute;
top: calc(100% + 22px);
left: 50%;
transform: translateX(-50%) scale(1);
width: 156px;
display: none; }
@media (min-width: 769px) {
.interactive-hotspot__modal {
display: block; } }
.interactive-hotspot__modal::before {
content: '';
width: 0;
position: absolute;
height: 0;
border-style: solid;
border-width: 0 12px 14px 12px;
left: 50%;
top: -12px;
transform: translateX(-50%);
border-color: transparent transparent #1e1e1e transparent; }
/* ------------------------------------------------------------ *\
From Bottom Styles
\* ------------------------------------------------------------ */
.interactive-hotspot.from-bottom .interactive-hotspot__modal {
top: unset;
bottom: calc(100% + 22px); }
.interactive-hotspot.from-bottom .interactive-hotspot__modal::before {
display: none; }
.interactive-hotspot.from-bottom .interactive-hotspot__modal::after {
content: '';
width: 0;
position: absolute;
height: 0;
border-style: solid;
border-width: 14px 12px 0 12px;
border-color: #1e1e1e transparent transparent transparent;
left: 50%;
bottom: -12px;
transform: translateX(-50%); }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/hero-interactive/interactive-modal/interactive-modal.scss */
.interactive-modal {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 900;
background-color: #f2f2f2;
overflow-x: hidden;
overflow-y: auto;
padding-top: 60px;
padding-bottom: 100px; }
@media (min-width: 769px) {
.interactive-modal {
display: none; } }
.interactive-modal .flickity-page-dots {
position: absolute;
top: 0;
padding-top: calc(100% + 5px);
pointer-events: none; }
.interactive-modal .flickity-page-dots .dot {
pointer-events: auto;
width: 6px;
height: 6px;
margin: 0 4px;
background-color: transparent;
border: 1px solid #000;
transition: background-color 0.4s; }
.interactive-modal .flickity-page-dots .dot.is-selected {
background-color: #000; }
.interactive-modal__close {
position: fixed;
right: 10px;
top: 10px;
z-index: 10; }
.interactive-modal__close__btn {
color: #fff;
transition: color 0.4s; }
.interactive-modal__close__btn:hover {
color: #3ff; }
.interactive-modal__product__content {
text-align: center;
padding-left: 20px;
padding-right: 20px; }
.interactive-modal__product__title {
font-size: 18px; }
.interactive-modal__product__price {
font-size: 16px; }
.interactive-modal__product__actions {
margin-top: 15px; }
.interactive-modal__product__image {
position: relative;
padding-top: 100%;
margin-bottom: 42px; }
.interactive-modal__product__btn {
font-size: 18px; }
.interactive-modal__cell {
width: 100%; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/hero-interactive/interactive-video/interactive-video.scss */
.interactive-video__media {
height: 100%;
left: 0;
-o-object-fit: cover;
object-fit: cover;
position: absolute;
top: 0;
width: 100%;
border-radius: 10px;
overflow: hidden; }
.interactive-video__action {
position: absolute;
left: 20px;
top: 20px;
z-index: 6; }
.interactive-video__btn {
transition: opacity 0.4s; }
.interactive-video__btn:hover {
opacity: 0.6; }
.interactive-video__modal__close__btn {
color: #fff;
transition: color 0.4s; }
.interactive-video__modal__close__btn:hover {
color: #3ff; }
.interactive-video__modal {
position: absolute;
left: 0;
z-index: 7;
top: 0;
width: 100%;
height: 100%;
padding: 24px;
background: rgba(0, 0, 0, 0.7);
-webkit-backdrop-filter: blur(34px);
backdrop-filter: blur(34px);
display: none; }
@media (min-width: 769px) {
.interactive-video__modal {
display: block; } }
.interactive-video__modal__close {
right: 20px;
top: 20px;
position: absolute; }
.interactive-video__modal__inner {
display: flex;
align-items: center;
height: 100%;
width: 100%; }
.interactive-video__products {
display: flex;
flex-wrap: wrap;
width: 100%;
justify-content: center; }
.interactive-video__products__item {
width: 33.33%;
display: flex;
padding: 8px; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/hero-interactive/interactive-view-all/interactive-view-all.scss */
.interactive-view-all__wrapper {
position: absolute;
z-index: 10;
width: 100%;
display: flex;
align-items: flex-end;
justify-content: center;
height: 50px;
bottom: 40px;
padding-bottom: 0; }
/*! path: /Users/logangelzer/Documents/overtime/src/modules/global/nav/nav/_nav.scss */
/* ------------------------------------------------------------ *\
Navigation
\* ------------------------------------------------------------ */
.nav {
display: none; }
@media (min-width: 1024px) {
.nav {
display: block; } }
.nav > ul {
display: flex;
flex-direction: row; }
.nav > ul > li {
margin-right: 40px; }
.nav > ul > li:last-child {
margin-right: 0; }
.nav > ul > li:hover > a::after {
opacity: 1; }
.nav > ul > li:hover > .nav__dropdown,
.nav > ul > li.focus-within > .nav__dropdown {
opacity: 1;
visibility: visible;
pointer-events: auto;
transform: translateY(0);
transition: transform ease 0.5s, opacity ease 0.5s, visibility ease 0.5s; }
.nav > ul > li:focus-within > .nav__dropdown {
opacity: 1;
visibility: visible;
pointer-events: auto;
transform: translateY(0);
transition: transform ease 0.5s, opacity ease 0.5s, visibility ease 0.5s; }
.nav > ul > li > a {
position: relative;
color: #000; }
.nav > ul > li > a::before {
content: "";
position: absolute;
top: 100%;
left: -10px;
right: -10px;
height: 40px; }
.nav > ul > li > a::after {
content: "";
position: absolute;
bottom: -8px;
left: -10%;
width: 120%;
height: 6px;
background-image: url("//shop.overtime.tv/cdn/shop/t/387/assets/link-border.png?47792");
background-repeat: no-repeat;
background-position: center;
opacity: 0; }
.nav > ul > li > .nav__dropdown {
position: absolute;
top: 100%;
left: -20px;
right: -20px;
display: flex;
flex-flow: row wrap;
justify-content: center;
padding: 40px 20px 0;
transition: transform ease 1s, opacity ease 1s, visibility ease 1s;
opacity: 0;
visibility: hidden;
pointer-events: none;
transform: translateY(-100%);
z-index: -1; }
@media (min-width: 1024px) {
.nav > ul > li > .nav__dropdown {
padding-left: 40px;
padding-right: 40px; } }
.nav > ul > li > .nav__dropdown::after {
content: "";
position: absolute;
top: 0;
bottom: 0;
left: 20px;
right: 20px;
background: #fff;
box-shadow: 0 6px 8px 0 rgba(0, 0, 0, 0.35);
z-index: -1; }
.nav > ul > li > .nav__dropdown > a {
width: 100%;
padding: 0 20px;
text-transform: capitalize;
margin-bottom: 20px;
letter-spacing: 0.5px; }
.nav > ul > li > .nav__dropdown > ul {
flex: 1 1;
display: flex;
flex-flow: row wrap;
padding: 0 20px; }
.nav > ul > li > .nav__dropdown > ul > li {
flex: 0 1 auto;
min-width: 200px;
margin-bottom: 30px; }
.nav > ul > li > .nav__dropdown > ul > li > a {
display: block;
margin-bottom: 10px;
color: #000;
pointer-events: none;
cursor: text; }
.nav > ul > li > .nav__dropdown > .dropdown-block {
min-width: 240px;
padding: 0 20px;
margin-bottom: 30px; }
.nav .nav__item--border {
position: relative; }
.nav .nav__item--border::before {
content: '';
position: absolute;
top: 0;
bottom: 0;
left: -25px;
width: 4px;
background-color: #fff; }
.nav .nav__dropdown a {
color: #000; }
.nav .nav__dropdown a:hover {
color: #000;
text-decoration: underline; }
.nav .nav__dropdown .nav__dropdown > ul {
display: flex;
letter-spacing: 0.5px; }
.nav .nav__dropdown .nav__dropdown li {
min-width: 180px;
margin-right: 20px;
margin-bottom: 10px; }
.nav .nav__dropdown .nav__dropdown li:last-child {
margin-bottom: 0; }
/**
* This file should read like a contents page. This
* file should only include other stylesheets. No
* style declarations should be written in this file.
*/