*
* This will reverse the displayed order of the system so that it runs in the
* opposite order to our source, effectively flipping the system over.
*
*
*
* This will cause the system to fill up from either the centre or the right
* hand side. Default behaviour is to fill up the layout system from the left.
*
* There are plenty more options available to us: explore them below.
*/
/* Default/mandatory classes.
=========================================== */
.o-layout {
display: flex;
flex: 0 1 auto;
flex-direction: row;
flex-wrap: wrap;
margin: 0 0 0 calc(0px - 16px);
padding: 0;
list-style: none;
/*transition: all .3s ease;*/
}
.o-layout__item {
flex: 1 1 auto;
max-width: 100%;
padding-left: 16px;
/*transition: all .3s ease;*/
}
.o-layout.o-layout__item {
margin-left: 0;
/*padding-left: 0;*/
}
/* Layout Display Direction.
* The flex-direction property specifies the direction of the flexible items
* inside the flex container. The default value of flex-direction is row
* (left-to-right, top-to-bottom).
=========================================== */
/**
* To reverse the layout direction, use o-layout--row-reverse.
*/
.o-layout--row-reverse {
flex-direction: row-reverse;
}
/**
* Use o-layout--column to set the flex items vertically.
*/
.o-layout--column {
flex-direction: column;
}
/**
* Same as column, but reversed.
*/
.o-layout--column-reverse {
flex-direction: column-reverse;
}
@media screen and (min-width: 48em) {
.o-layout--row--m {
flex-direction: row;
}
.o-layout--row-reverse--m {
flex-direction: row-reverse;
}
.o-layout--column--m {
flex-direction: column;
}
.o-layout--column-reverse--m {
flex-direction: column-reverse;
}
}
@media screen and (min-width: 60em) {
.o-layout--row--l {
flex-direction: row;
}
.o-layout--row-reverse--l {
flex-direction: row-reverse;
}
.o-layout--column--l {
flex-direction: column;
}
.o-layout--column-reverse--l {
flex-direction: column-reverse;
}
}
@media screen and (min-width: 90em) {
.o-layout--row--w {
flex-direction: row;
}
.o-layout--row-reverse--w {
flex-direction: row-reverse;
}
.o-layout--column--w {
flex-direction: column;
}
.o-layout--column-reverse--w {
flex-direction: column-reverse;
}
}
/* Gutter size modifiers.
=========================================== */
/**
* Smaller gutters between items.
*/
.o-layout--narrow {
margin-left: calc(0px - (16px * 0.5));
}
.o-layout--narrow > .o-layout__item {
padding-left: calc(16px * 0.5);
}
/**
* Larger gutters between items.
*/
.o-layout--wide {
margin-left: calc(0px - (16px * 2));
}
.o-layout--wide > .o-layout__item {
padding-left: calc(16px * 2);
}
/**
* No gutters between items.
*/
.o-layout--flush {
margin-left: 0;
}
.o-layout--flush > .o-layout__item {
padding-left: 0;
}
/**
* Make full width of parent.
*/
.o-layout--full {
margin-right: calc(0px - 16px);
}
/* Vertical gutter modifiers.
=========================================== */
/**
* Include vertical gutters on layout items.
*/
.o-layout--spaced > .o-layout__item {
margin-bottom: 16px;
}
/**
* If we've chosen to change the size of the horizontal gutters, let's change
* the vertical gutters accordingly.
*/
.o-layout--spaced.o-layout--narrow > .o-layout__item {
margin-bottom: calc(16px * 0.5);
}
.o-layout--spaced.o-layout--wide > .o-layout__item {
margin-bottom: calc(16px * 2);
}
/* Align-Items modifiers.
* The align-items property controls how flex items are positioned
* when the items do not use all available space along the container's cross-axis.
=========================================== */
/**
* Items are positioned at the start of the container's cross-axis.
*/
.o-layout--align-top {
align-items: flex-start;
}
/**
* Items are positioned along the center of the container's cross-axis.
*/
.o-layout--align-center {
align-items: center;
}
/**
* Items are positioned at the end of the container's cross-axis.
*/
.o-layout--align-bottom {
align-items: flex-end;
}
/**
* Items are positioned at along the container's cross-axis so that their baselines align.
*/
.o-layout--align-baseline {
align-items: baseline;
}
/**
* Default value. Items are stretched to fit the container's cross-axis.
*/
.o-layout--align-stretch {
align-items: stretch;
}
/* Align-Content modifiers.
* The align-content property controls how lines are positioned in multi-line containers.
=========================================== */
/**
* Default value. Lines are packed at the start of the container's cross-axis.
*/
.o-layout--align-content-start {
align-content: flex-start;
}
/**
* Lines are packed along the center of the container's cross-axis.
*/
.o-layout--align-content-center {
align-content: center;
}
/**
* Lines are packed at the end of the container's cross-axis.
*/
.o-layout--align-content-end {
align-content: flex-end;
}
/**
* Lines are distributed along the container's cross-axis with equal spacing around each line.
*/
.o-layout--align-content-around {
align-content: space-around;
}
/**
* Lines are distributed along the container's cross-axis with equal spacing between each line.
*/
.o-layout--align-content-between {
align-content: space-between;
}
/* Align-Self modifiers.
* The align-self property controls how individual flex items are positioned along the container's cross-axis.
=========================================== */
/**
* Default value. Items are aligned based on the flex container's `align-items` value.
*/
.o-layout--align-self-auto {
align-self: auto;
}
/**
* Items are aligned to the start of the flex container's cross-axis, despite the container's `align-items` value.
*/
.o-layout--align-self-start {
align-self: flex-start;
}
/**
* Items are aligned along the center of the flex container's cross-axis, despite the container's `align-items` value.
*/
.o-layout--align-self-center {
align-self: center;
}
/**
* Items are aligned to the end of the flex container's cross-axis, despite the container's `align-items` value.
*/
.o-layout--align-self-end {
align-self: flex-end;
}
/**
* Items are stretched to fill the flex container's cross-axis, despite the container's `align-items` value.
*/
.o-layout--align-self-stretch {
align-self: stretch;
}
/* Justify-Content modifiers.
* The justify-content property controls how flex items are positioned
* when the items do not use all available space along the container's main-axis.
=========================================== */
/**
* Default value. Items are justified at the start of the container's main-axis.
*/
.o-layout--justify-start {
justify-content: flex-start;
}
/**
* Items are justified along the center of the container's main-axis.
*/
.o-layout--justify-center {
justify-content: center;
}
/**
* Items are justified at the end of the container's main-axis.
*/
.o-layout--justify-end {
justify-content: flex-end;
}
/**
* Items are justified along the container's main-axis with equal spacing around each item.
*/
.o-layout--justify-around {
justify-content: space-around;
}
/**
* Items are justified along the container's main-axis with equal spacing between each item.
*/
.o-layout--justify-between {
justify-content: space-between;
}
/* Growth control.
=========================================== */
.o-layout--grow {
flex-grow: 1;
}
.o-layout--no-grow {
flex-grow: 0;
}
.o-layout--shrink {
flex-shrink: 1;
}
.o-layout--no-shrink {
flex-shrink: 0;
}
/* Wrapping modifiers.
=========================================== */
.o-layout--no-wrap {
flex-wrap: nowrap;
}
.o-layout--wrap {
flex-wrap: wrap;
}
.o-layout--wrap-reverse {
flex-wrap: wrap-reverse;
}
/* Flex ordering modifiers.
* Set an item to be first or last in grid.
=========================================== */
.o-layout__first {
order: -1;
}
.o-layout__last {
order: 1;
}
@media screen and (min-width: 40em) {
.o-layout__first--s {
order: -1;
}
.o-layout__last--s {
order: 1;
}
}
@media screen and (min-width: 48em) {
.o-layout__first--m {
order: -1;
}
.o-layout__last--m {
order: 1;
}
}
@media screen and (min-width: 60em) {
.o-layout__first--l {
order: -1;
}
.o-layout__last--l {
order: 1;
}
}
@media screen and (min-width: 90em) {
.o-layout__first--w {
order: -1;
}
.o-layout__last--w {
order: 1;
}
}
/* ==========================================================================
OBJECTS / LISTS
========================================================================== */
/**
* The o-list-bare object strips list-like appearance from lists by removing
* their bullets, and any indentation.
*/
.o-list-bare {
margin-left: 0;
list-style: none;
}
/**
* The o-list-block object displays any list of items into stacked blocks.
*/
.o-list-block {
margin-left: 0;
list-style: none;
}
.o-list-block__item {
display: block;
}
/**
* The o-list-inline object simply displays a list of items in one line.
*/
.o-list-inline {
margin-left: 0;
list-style: none;
}
.o-list-inline__item {
display: inline-block;
}
.o-list-inline__item:not(:last-child) {
margin-right: 16px;
}
/* Spacing modifiers
=========================================== */
.o-list-inline--narrow > .o-list-inline__item {
margin-right: calc(16px * 0.5);
}
.o-list-inline--wide > .o-list-inline__item {
margin-right: calc(16px * 2);
}
/* ==========================================================================
OBJECTS / TABLES
========================================================================== */
/**
* A simple object for manipulating the structure of HTML 'table's.
*/
.o-table {
width: 100%;
}
/* Equal-width table cells.
========================================================================== */
/**
* 'table-layout: fixed' forces all cells within a table to occupy the same
* width as each other. This also has performance benefits: because the browser
* does not need to (re)calculate cell dimensions based on content it discovers,
* the table can be rendered very quickly. Further reading:
* https://developer.mozilla.org/en-US/docs/Web/CSS/table-layout#Values
*/
.o-table--fixed {
table-layout: fixed;
}
/* Padding variants.
========================================================================== */
.o-table--narrow th,
.o-table--narrow td {
padding: calc(16px * 0.5);
}
.o-table--wide th,
.o-table--wide td {
padding: calc(16px * 2);
}
/* Borderless table
* Removes default border-bottom on TABLE rows.
=========================================== */
.o-table-borderless tr {
border: none;
}
/* ==========================================================================
OBJECTS / WRAPPER
========================================================================== */
/**
* Page-level constraining and wrapping elements.
*/
.o-site-wrapper {
width: 100%;
max-width: 100rem;
margin-right: auto;
margin-left: auto;
overflow:visible!important;
}
.o-wrapper {
width: 100%;
max-width: 90rem;
/* max-width: 76rem; */
margin-right: auto;
margin-left: auto;
padding-right: 16px;
padding-left: 16px;
}
.o-wrapper--full {
max-width: 100vw;
}
.o-wrapper--flush {
padding-right: 0;
padding-left: 0;
}
/* ==========================================================================
COMPONENTS / BUTTONS
========================================================================== */
/**
* 1. Allows styling of box model properties.
* 2. Reset browser styles.
* 3. Subtract border-width from the padding so buttons don't grow if the
* border-width is modified.
* 4. Tidy alignment for when the button size needs to be modified.
* 5. Make buttons inherit font styles (necessary when styling `input`s as
* buttons).
* 6. Set default button font-size.
* 7. Set default button font-weight.
* 8. Set default button text-alignment.
* 9. Remove anchor text-decoration (necessary when styling `a`s as buttons).
* 10. Base transparent border for modifiers to alter.
* 11. Set default button border-radius.
* 12. Set default button transition (color, background-color, border-color and box-shadow)
* 13. Force all button-styled elements to appear click-able.
* 14. Remove browser outline styles.
*/
.c-button {
display: inline-block; /* [1] */
margin: 0; /* [2] */
padding: calc(0.846em - 1px) calc(1.38em - 1px); /* [3] */
position: relative;
vertical-align: middle; /* [4] */
font-family: inherit; /* [5] */
font-size: 1em; /* [6] */
font-weight: 700; /* [7] */
line-height: normal;
text-align: center; /* [8] */
text-decoration: none; /* [9] */
background-color: #8c8d8d;
border: 1px solid rgba(0, 0, 0, 0); /* [10] */
border-radius: 0.3125em; /* [11] */
color: #fff;
-webkit-appearance: none;
appearance: none;
cursor: pointer; /* [13] */
transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease; /* [12] */
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
letter-spacing:0;
}
.c-button:hover,
.c-button:active,
.c-button:focus {
text-decoration: none; /* [9] */
outline: none; /* [1] */
}
.c-button:not([class*="u-bg-"]):not([class*="c-button--primary"]):hover{
background-color: #9a9a9a;
}
/**
* Fix a Firefox bug whereby `input type="submit"` gains 2px extra padding.
*/
.c-button::-moz-focus-inner {
border: 0;
padding: 0;
}
/* Button aesthetic modifiers
=========================================== */
/**
* For buttons that identify as the primary action.
*/
.c-button--primary {
background-color: #4888c8;
border-color: #4888c8;
color: #fff;
}
.c-button--primary:hover,
.c-button--primary:active {
background-color: #4888c8;
border-color: #4888c8;
}
/**
* For outlined or hollow buttons.
*/
.c-button--hollow {
background-color: rgba(0, 0, 0, 0);
border-color: currentColor;
color: #4888c8;
}
.c-button--hollow:not([class*="u-bg-"]):hover{
background-color: #eaeaea;
}
/**
* For buttons you want to look like normal links.
*/
.c-button--clear {
background-color: rgba(0, 0, 0, 0);
}
.c-button--clear:hover,
.c-button--clear:active {
border-bottom: 1px solid currentColor;
}
.c-button--clear:not([class*="u-bg-"]):hover{
background-color: rgba(0, 0, 0, 0);
}
/* Button state modifiers
=========================================== */
/**
* For buttons whose state is toggled.
*/
.c-button:disabled,
.c-button.is-disabled,
.c-button.is-disabled:hover,
.c-button.is-disabled:active,
.c-button.is-disabled:focus {
color: #fff;
background-color: #c0c0c0;
border-color: #c0c0c0;
cursor: not-allowed;
}
/**
* For buttons whose state is toggled when a related form or field contains
* an error or multiple errors.
*/
.c-button.is-error,
.c-button.is-error:hover,
.c-button.is-error:active,
.c-button.is-error:focus,
.is-error .c-button,
.is-error .c-button:hover,
.is-error .c-button:active,
.is-error .c-button:focus {
background-color: #c8102e;
border-color: #c8102e;
color: #fff;
cursor: not-allowed;
}
/* Button sizing modifiers
=========================================== */
.c-button--tiny {
padding: calc(0.5em / 2 - 1px) calc(1em / 2 - 1px); /* [3] */
font-size: 0.625em;
}
.c-button--small {
padding: calc(0.5em / 1.5 - 1px) calc(1em / 1.5 - 1px); /* [3] */
font-size: 0.75em;
}
.c-button--large {
/* padding: calc(0.625em * 2 - 1px) calc(2.076em * 2 - 1px); /* [3] */
padding: calc(0.4em * 2 - 1px) calc(1.076em * 2 - 1px);/* [3] */
}
.c-button--huge {
padding: calc(0.5em * 3 - 1px) calc(1em * 3 - 1px); /* [3] */
}
.c-button--flush {
padding-right: 0;
padding-left: 0;
}
/**
* For buttons that need to display full-width on small devices only.
*/
.c-button--full-small {
display: block;
width: 100%;
}
/**
* For buttons that need to display full-width.
*/
.c-button--full {
display: block;
width: 100%;
}
/* Button glossy modifiers
=========================================== */
.c-button--glossy {
box-shadow: 0 1px 4px -2px #707070;
text-shadow: 0 -1px #707070;
}
.c-button--glossy::after {
width: 100%;
height: 50%;
position: absolute;
top: 0;
left: 0;
background: linear-gradient(rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.2));
border-radius: inherit;
content: '';
}
/* ==========================================================================
COMPONENTS / CONTROL GROUPS
========================================================================== */
/**
* To group related buttons and/or inputs together, you can use the
* `.c-control-group` wrapping element. This will bunch the related elements
* together and remove the spacing between them.
*/
.c-control-group {
display: flex;
}
.c-control-group .c-control-group__label {
height: calc(2.5em - (1px * 2));
margin-bottom: 0;
padding-right: calc(16px / 2);
line-height: calc(2.5em - (1px * 2));
}
.c-control-group .c-control-group__button,
.c-control-group .c-control-group__field {
border-radius: 0;
}
.c-control-group .c-control-group__field {
height: auto;
margin-bottom: 0;
}
.c-control-group .c-control-group__button:not(:first-child):not(:first-of-type),
.c-control-group .c-control-group__field:not(:first-child):not(:first-of-type) {
border-left-width: 0;
}
.c-control-group .c-control-group__button:first-child,
.c-control-group .c-control-group__field:first-child {
border-top-left-radius: 0.125em;
border-bottom-left-radius: 0.125em;
}
.c-control-group .c-control-group__button:last-child,
.c-control-group .c-control-group__field:last-child {
border-top-right-radius: 0.125em;
border-bottom-right-radius: 0.125em;
}
/**
* Adding the `.c-control-group--rounded` modifier will make the first and
* last related elements rounded.
*/
.c-control-group--rounded .c-control-group__button:first-child,
.c-control-group--rounded .c-control-group__field:first-child {
border-top-left-radius: 10em;
border-bottom-left-radius: 10em;
}
.c-control-group--rounded .c-control-group__field:first-child {
padding-left: 16px;
}
.c-control-group--rounded .c-control-group__button:last-child,
.c-control-group--rounded .c-control-group__field:last-child {
border-top-right-radius: 10em;
border-bottom-right-radius: 10em;
}
/**
* Adding the `.c-control-group--rounded-right` modifier will make the last
* related element rounded.
*/
.c-control-group--rounded-right .c-control-group__button:last-child,
.c-control-group--rounded-right .c-control-group__field:last-child {
border-top-right-radius: 10em;
border-bottom-right-radius: 10em;
}
/**
* Adding the `.c-control-group--rounded-left` modifier will make the first
* related element rounded.
*/
.c-control-group--rounded-left .c-control-group__button:first-child,
.c-control-group--rounded-left .c-control-group__field:first-child {
border-top-left-radius: 10em;
border-bottom-left-radius: 10em;
}
/**
* Adding the `.c-control-group--stacked` modifier will turn the related
* elements into a vertical element.
*/
.c-control-group--stacked {
flex-wrap: wrap;
}
.c-control-group--stacked .c-control-group__button:not(:first-child):not(:first-of-type),
.c-control-group--stacked .c-control-group__field:not(:first-child):not(:first-of-type) {
border-left-width: 1px;
}
.c-control-group--stacked .c-control-group__button,
.c-control-group--stacked .c-control-group__field {
flex: 0 0 100%;
max-width: 100%;
margin-left: 0;
}
.c-control-group--stacked .c-control-group__button:not(:first-child):not(:first-of-type),
.c-control-group--stacked .c-control-group__field:not(:first-child):not(:first-of-type) {
border-top: 0;
}
.c-control-group--stacked .c-control-group__button:not(:first-child):not(:last-child):not(:first-of-type):not(:last-of-type),
.c-control-group--stacked .c-control-group__field:not(:first-child):not(:last-child):not(:first-of-type):not(:last-of-type) {
border-radius: 0;
}
.c-control-group--stacked .c-control-group__button:first-child,
.c-control-group--stacked .c-control-group__field:first-child {
border-radius: 0.125em 0.125em 0 0;
}
.c-control-group--stacked .c-control-group__button:last-child,
.c-control-group--stacked .c-control-group__field:last-child {
border-radius: 0 0 0.125em 0.125em;
}
/* ==========================================================================
COMPONENTS / DIVIDER
========================================================================== */
/**
* Divider component to provide more prominent horizontal rules between other
* elements.
*
* The default Divider and it's `--top` modifier are intended for use on
* horizontal rules.
* e.g. `
`
*
* 1. Set a transparent border on the relevant edge to prevent element collapse.
* 2. Reduce the `margin-bottom` by the same width as the divider in order to
* keep on our baseline grid.
*/
.c-divider {
position: relative;
margin-bottom: calc(16px - 1px); /* 2 */
border: solid transparent;
border-width: 0 0 1px; /* 1 */
}
.c-divider::before,
.c-divider::after {
display: block;
position: absolute;
width: 100%;
content: "";
}
/**
* Divider gradient border.
*/
.c-divider::before {
bottom: 0;
height: 1px;
background: linear-gradient(to right, rgba(191, 191, 191, 0), rgb(192, 192, 192), rgba(191, 191, 191, 0));
}
/**
* Divider shadow.
*/
.c-divider::after {
top: 100%;
height: calc(16px / 2);
background: radial-gradient(at 50% 0, rgba(74, 74, 74, .15), transparent 40%);
}
/**
* Top divider
*/
.c-divider--top {
border-width: 1px 0 0;
}
.c-divider--top::before {
bottom: 100%;
background: linear-gradient(to right, rgba(191, 191, 191, 0), rgb(192, 192, 192), rgba(191, 191, 191, 0));
}
.c-divider--top::after {
top: calc(0px - calc(16px / 2) - 1px);
background: radial-gradient(at 50% 100%, rgba(74, 74, 74, .15), transparent 40%);
}
/* ==========================================================================
COMPONENTS / FORMS
========================================================================== */
/* Form list
=========================================== */
/**
* All form fields should be presented in a list so that
*
* a) they are easier to navigate using a screen reader;
* b) if CSS fails to load for any reason, the user is still presented with a
* well-formatted list of fields.
*/
.c-form-list:not(.o-layout) {
margin: 0;
padding: 0;
list-style: none;
}
.c-form-list__item {
display: block;
margin-bottom: calc(1em / 2);
width: 100%;
}
@media (min-width: 48em) {
.c-form-list__item {
max-width: 20em;
}
/* For any inputs that need to be displayed full-width */
.c-form-list__item--full {
max-width: 100%;
}
}
/* Form labels
=========================================== */
/**
* All LABEL elements must also carry a class of `.c-form-label`. By applying
* these styles to a class and not to the LABEL element directly, we are free
* to reuse the same look-and-feel on spoofed LABEL elements. E.g. when we have
* a ‘meta label’ covering a number of sub labels:
*
* Gender
* • Male • Female • Rather not say
*
*/
.c-form-label {
display: inline-block;
margin-bottom: calc(1em / 4);
}
/* Form text inputs
=========================================== */
/**
* All text-like form inputs require a class of `.c-form-input`: we do not use
* selectors like `input[type="text"] {}`.
*
* 1. Fix for IE 10/11 removing vertical padding from inputs which was being
* ignored.
* 2. Padding added via line-height/height to re-center text for all browsers
* (38px to account for border).
*/
.c-form-input {
display: inline-block;
margin-bottom: calc(1em / 4);
padding: 0 calc(1em / 2); /* [1] */
width: 100%;
height: calc(2.5em - (1px * 2)); /* [2] */
line-height: calc(2.5em - (1px * 2)); /* [2] */
background-color: #fff;
border: 1px solid #c0c0c0;
border-radius: 0.125em;
box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2);
outline: 0;
transition: box-shadow 0.25s ease, border-color 0.25s ease;
-moz-appearance: none;
-webkit-appearance: none;
}
.c-form-input:focus {
border-color: #fff;
box-shadow: inset 0 0 0.5em 0 rgba(0, 0, 0, 0.2);
outline: none;
}
/**
* For use on large text inputs such as textareas
*/
.c-form-input--long {
height: 6em;
}
.c-form-input--file {
padding: 0;
line-height: calc(2em - (1px * 2));
}
/* Form select inputs
=========================================== */
.c-form-select {
display: inline-block;
position: relative;
margin-bottom: calc(1em / 4);
width: 100%;
font-size: 1em;
line-height: 1.5;
cursor: pointer;
}
/**
* Gradient to hide the overflow of long labels
*
* 1. Stretch to full height on the right (taking into account border width)
*/
.c-form-select::before {
position: absolute;
top: 1px; /* [1] */
right: 1px; /* [1] */
bottom: 1px; /* [1] */
width: calc(1em * 2);
background: #fff;
background: -ms-linear-gradient(right, rgba(255, 255, 255, 1) 60%, rgba(255, 255, 255, 0));
background: linear-gradient(to left, rgba(255, 255, 255, 1) 60%, rgba(255, 255, 255, 0));
border-radius: 0 0.125em 0.125em 0;
content: "";
pointer-events: none;
}
/**
* Custom drop-down indicator icon
*/
.c-form-select::after {
position: absolute;
top: 50%;
right: calc(1em / 2);
margin-bottom: calc(1em / 4);
width: calc(1em / 2);
height: calc(1em / 2);
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAAAkCAYAAAA5DDySAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAPVJREFUeNrk2s0NgzAMhmFno47EKGzQETpSR2CEjkCjyEg0aiAhP7Y/IuUSuLyPhDg4RLycc5PfH78fBLy48/3TyYcrb1iEv53RISxCqpM4dkVGSMSHTakHKAhH8RvAExXhLD58AvziCw0hJz7+E8AgFMcjIVyOR0CojreM0CzeIkLzeEsI3eItIHSP14wwLF4jwvB4TQhi8RoQxOMlEdTESyCoix+JoDZ+BIL6+J4IZuJ7IJiLb4lgNr4Fgvn4GgSY+CsIcPGFCDP0bCIDAXowU4OANZ8sRMCcUGciYN9ROEGAv6BxhHCP+B3CvLubsEjFfwUYAKjtGJxFvDJsAAAAAElFTkSuQmCC") no-repeat center center;
background-size: contain;
content: "";
pointer-events: none;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.c-form-select__dropdown {
width: 100%;
height: calc(2.5em - (1px * 2));
padding: calc(1em / 2) calc(1em / 2);
font-size: inherit;
background-color: #fff;
border: 1px solid #c0c0c0;
border-radius: 0.125em;
box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2);
cursor: pointer;
outline: 0;
transition: box-shadow 0.25s ease, border-color 0.25s ease;
-webkit-appearance: none;
-moz-appearance: none;
}
.c-form-select__dropdown::-ms-expand {
display: none;
}
.c-form-select__dropdown:focus {
/*border-color: #fff;
box-shadow: inset 0 0 0.5em 0 rgba(0, 0, 0, 0.2);*/
}
/* Form checkbox inputs
=========================================== */
.c-form-checkbox {
display: inline-block;
margin-bottom: calc(1em / 4);
width: 100%;
cursor: pointer;
font-size: 1em;
}
/**
* For cases where checkboxes or radio buttons need to display inline.
*/
.c-form-checkbox--inline {
width: auto;
margin-right: calc(1em * 2);
}
/**
* Hide the default input visually to utilise keyboard functionality and allow
* for custom input styles.
*/
.c-form-checkbox__input {
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
position: absolute;
overflow: hidden;
border: 0;
clip: rect(0 0 0 0);
white-space: nowrap;
}
.c-form-checkbox__caption {
display: flex;
align-items: center;
position: relative;
margin-left: calc(1em + 1em);
user-select: none;
}
.c-form-checkbox__caption::before {
display: inline-block;
position: relative;
width: 1em;
height: 1em;
margin-right: 1em;
margin-left: calc(0px - (1em + 1em));
background-color: #fff;
border: 1px solid #c0c0c0;
content: "";
transition: border-color 0.25s ease;
}
.c-form-checkbox--radio .c-form-checkbox__caption::before {
border-radius: 100%;
}
.c-form-checkbox__input:focus + .c-form-checkbox__caption::before {
outline: none;
}
.c-form-checkbox__input:checked + .c-form-checkbox__caption::before {
box-shadow: inset 0 0 0.5em 0 rgba(0, 0, 0, 0.2);
transition: border-color 0.25s ease, background-color 0.25s ease;
}
.c-form-checkbox__input:checked + .c-form-checkbox__caption::after {
position: absolute;
left: calc(0px - (1em + 1em));
width: calc(1em + 1px);
height: calc(1em + 1px);
background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDEyOCAxMjgiIGhlaWdodD0iMTI4cHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAxMjggMTI4IiB3aWR0aD0iMTI4cHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxwYXRoIGQ9Ik0xMTYuMTU4LDI5LjMzNmwtNC45NzUtNC45NzVjLTMuNDY5LTMuNDY5LTkuMDg4LTMuNDc4LTEyLjU0OS0wLjAxOUw0OC4xMDMsNzQuODc1TDI5LjM2NCw1Ni4xMzYgIGMtMy40NTktMy40Ni05LjA3OC0zLjQ1LTEyLjU0OSwwLjAyMWwtNC45NzQsNC45NzRjLTMuNDcsMy40Ny0zLjQ4LDkuMDg5LTAuMDIsMTIuNTQ5TDQxLjgsMTAzLjY1NyAgYzEuNzQxLDEuNzQxLDQuMDI2LDIuNjAyLDYuMzEsMi41ODhjMi4yNzksMC4wMTEsNC41NTktMC44NTIsNi4yOTctMi41OWw2MS43NzEtNjEuNzcxICBDMTE5LjYzNywzOC40MjQsMTE5LjYzMSwzMi44MDcsMTE2LjE1OCwyOS4zMzZ6IiBmaWxsPSIjMjMyMzIzIi8+PC9zdmc+") no-repeat center center;
background-size: contain;
content: "";
}
.c-form-checkbox--radio .c-form-checkbox__input:checked + .c-form-checkbox__caption::after {
/* background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgaGVpZ2h0PSIyMHB4IiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyMCAyMCIgd2lkdGg9IjIwcHgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6c2tldGNoPSJodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2gvbnMiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj48dGl0bGUvPjxkZXNjLz48ZGVmcy8+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBpZD0iUGFnZS0xIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSI+PGcgZmlsbD0iIzAwMDAwMCIgaWQ9IkNvcmUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0zMzguMDAwMDAwLCAtMzM4LjAwMDAwMCkiPjxnIGlkPSJyYWRpby1idXR0b24tb24iIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMzOC4wMDAwMDAsIDMzOC4wMDAwMDApIj48cGF0aCBkPSJNMTAsNSBDNy4yLDUgNSw3LjIgNSwxMCBDNSwxMi44IDcuMiwxNSAxMCwxNSBDMTIuOCwxNSAxNSwxMi44IDE1LDEwIEMxNSw3LjIgMTIuOCw1IDEwLDUgTDEwLDUgWiBNMTAsMCBDNC41LDAgMCw0LjUgMCwxMCBDMCwxNS41IDQuNSwyMCAxMCwyMCBDMTUuNSwyMCAyMCwxNS41IDIwLDEwIEMyMCw0LjUgMTUuNSwwIDEwLDAgTDEwLDAgWiBNMTAsMTggQzUuNiwxOCAyLDE0LjQgMiwxMCBDMiw1LjYgNS42LDIgMTAsMiBDMTQuNCwyIDE4LDUuNiAxOCwxMCBDMTgsMTQuNCAxNC40LDE4IDEwLDE4IEwxMCwxOCBaIiBpZD0iU2hhcGUiLz48L2c+PC9nPjwvZz48L3N2Zz4="); */
border-radius: 100%;
color: #194a8f;
}
.c-form-checkbox__input:disabled + .c-form-checkbox__caption {
opacity: 0.5;
cursor: not-allowed;
}
.c-form-checkbox__input:disabled + .c-form-checkbox__caption::before {
background-color: #c0c0c0;
border-color: #c0c0c0;
}
/* Form modifiers
=========================================== */
/**
* Since the majority of form field in an ecommerce site are required, all LABEL
* elements without the `is-required` class will automatically italicized.
*/
.c-form-label:not(.is-required):not(.u-text-normal) {
/*font-style: italic;*/
}
/* Disabled Form Elements
=========================================== */
.c-form-input[disabled],
.c-form-select__dropdown[disabled],
.c-form-checkbox__input[disabled] {
background-color: #c0c0c0;
}
/* Form errors
=========================================== */
/**
* Errors are handled by adding the .has-error class to the field's parent –
* usually the .c-form-list__item.
*
* The `invalid` class is included here to work with code output by Miva Merchant on some pages.
*/
.has-error,
.invalid {
color: #c8102e;
}
/**
* Change form field styles
*/
.has-error .c-form-input,
.invalid .c-form-input,
.c-form-input.has-error,
/*.c-form-input:not(:focus):invalid,*/
.has-error .c-form-select__dropdown,
.invalid .c-form-select__dropdown,
.c-form-select__dropdown.has-error/*,
.c-form-select__dropdown:not(:focus):invalid*/ {
border-color: #c8102e;
}
.has-error .c-form-input:focus,
.invalid .c-form-input:focus,
.c-form-input.has-error:focus,
/*.c-form-input:invalid:focus,*/
.has-error .c-form-select__dropdown:focus,
.invalid .c-form-select__dropdown:focus,
.c-form-select__dropdown.has-error:focus/*,
.c-form-select__dropdown:invalid:focus*/ {
border-color: #fff;
box-shadow: inset 0 0 0.5em 0 rgba(200, 16, 46, 0.75);
}
/**
* Change checkbox/radio indicator border color
*/
.has-error .c-form-checkbox__caption::before,
.invalid .c-form-checkbox__caption::before,
.c-form-checkbox__caption.has-error::before,
.c-form-checkbox__caption:invalid::before {
border-color: #c8102e;
}
/* Input sizing modifiers
=========================================== */
.c-form-input--large {
height: calc(3.5em - (1px * 2)); /* [2] */
line-height: calc(3.5em - (1px * 2)); /* [2] */
}
.c-form-input--huge {
height: calc(4.5em - (1px * 2)); /* [2] */
line-height: calc(4.5em - (1px * 2)); /* [2] */
}
.c-form-input--large.c-form-select__dropdown,
.c-form-input--huge.c-form-select__dropdown {
line-height: inherit;
}
/* ==========================================================================
COMPONENTS / KEYLINE
========================================================================== */
/**
* Simple keyline component to provide horizontal rules between other elements.
* e.g. `
`
*
* 1. Reduce the `margin-bottom` by the same width as the keyline in order to
* keep on our baseline grid.
*/
.c-keyline {
margin-bottom: calc(16px - 1px); /* [1] */
border: none;
border-bottom: 1px solid #c0c0c0;
}
/**
* Heavier keylines.
*/
.c-keyline--thick {
margin-bottom: calc(16px - calc(1px * 2)); /* [1] */
border-bottom-width: calc(1px * 2);
}
/**
* Smaller gaps underneath keylines.
*/
.c-keyline--small {
margin-bottom: calc((16px / 2) - 1px); /* [1] */
}
/**
* Adjust smaller gaps underneath thicker keylines.
*/
.c-keyline--small.c-keyline--thick {
margin-bottom: calc((16px / 2) - calc(1px * 2)); /* [1] */
}
/* ==========================================================================
COMPONENTS / MENU
========================================================================== */
.c-menu {}
.c-menu__title {
font-weight: 700;
}
.c-menu__list {
margin-left: 0;
line-height: 1.4;
list-style: none;
}
.c-menu__row {}
.c-menu__link {
display: block;
color: currentColor;
}
@media (min-width: 48em) {
.c-menu__link {
display: inline-block;
}
}
.c-collapsible-menu__trigger {
display: none;
}
@media (max-width: 47.9em) {
.c-collapsible-menu {
}
.c-collapsible-menu__label {
display: flex;
align-items: center;
justify-content: space-between;
font-weight: 700;
}
.c-collapsible-menu__label::after {
display: inline-block;
font-size: 1rem;
line-height: 1;
content: '+';
}
.c-collapsible-menu .c-menu__title {
display: none;
}
.c-collapsible-menu .c-menu__list {
display: block;
max-height: 0;
opacity: 0;
visibility: hidden;
transition-delay: 0.15s, 0s, 0s;
}
.c-collapsible-menu__trigger:checked ~ .c-collapsible-menu__label::after {
content: '-';
}
.c-collapsible-menu__trigger:checked ~ .c-menu__list {
display: block;
max-height: 25em;
margin-top: 1em;
opacity: 1;
overflow: hidden;
transition: visibility 0s ease, max-height 0.3s ease, opacity 0.3s ease;
transition-delay: 0s;
visibility: visible;
}
}
@media (min-width: 48em) {
.c-collapsible-menu__label {
display: none;
}
}/* ==========================================================================
COMPONENTS / MINI-MODAL
========================================================================== */
.has-active-mini-modal {
overflow: hidden;
}
.c-mini-modal {
width: 100%;
position: fixed;
top: 0;
bottom: 0;
left: 0;
opacity: 0;
transition: all ease 300ms;
z-index: 500;
}
.c-mini-modal--active {
opacity: 1;
}
.c-mini-modal__overlay {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background-color: rgba(0, 0, 0, 0.9);
}
.c-mini-modal__viewport {
height: 100%;
position: relative;
pointer-events: none;
}
.c-mini-modal__item {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
transition: all ease 300ms;
}
.c-mini-modal__item--added,
.c-mini-modal__item--removed {
opacity: 0;
}
.c-mini-modal__item--added--previous,
.c-mini-modal__item--removed--next {
transform: translateX(-100%);
}
.c-mini-modal__item--added--next,
.c-mini-modal__item--removed--previous {
transform: translateX(100%);
}
.c-mini-modal__status {
position: absolute;
top: 50%;
left: 50%;
text-align: center;
color: #fff;
opacity: 0;
transition: all ease 300ms;
transform: translate(-50%, -50%);
}
.c-mini-modal__item--loading .c-mini-modal__status {
opacity: 1;
}
.c-mini-modal__content {
height: 100%;
opacity: 0;
transition: all ease 300ms;
transform: scale(0.5);
}
.c-mini-modal__item--loaded .c-mini-modal__content {
transform: none;
opacity: 1;
}
.c-mini-modal__item--removed--previous .c-mini-modal__content,
.c-mini-modal__item--removed--next .c-mini-modal__content {
transform: scale(0.5);
}
.c-mini-modal__element {
display: block;
max-width: 85vw;
max-height: 75vh;
margin: auto;
position: relative;
top: 50%;
overflow: auto;
transform: translateY(-50%);
pointer-events: auto;
}
.c-mini-modal__element--iframe,
.c-mini-modal__element--map {
background-color: #fff;
}
.c-mini-modal__element--iframe,
.c-mini-modal__iframe {
width: 100%;
height: 100%;
}
.c-mini-modal__element--video {
max-width: calc(100vh * (16 / 9));
}
.c-mini-modal__element--video::before {
display: block;
padding-bottom: 56.25%;
background-color: #000;
content: '';
}
.c-mini-modal__element-subject {
margin: auto;
padding: 2rem 2rem 1rem;
overflow: hidden;
}
.c-mini-modal__video {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
.c-mini-modal__caption {
padding: 1em;
position: absolute;
right: 0;
bottom: 0;
left: 0;
color: #fff;
pointer-events: auto;
}
.c-mini-modal__close,
.c-mini-modal__nav {
display: inline-block;
width: 1em;
height: 1em;
margin: 0;
padding: 0;
position: absolute;
font-family: monospace;
font-size: 3rem;
font-weight: 400;
line-height: 1;
text-align: center;
text-decoration: none;
border: 0 none;
-webkit-appearance: none;
appearance: none;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.c-mini-modal__close:hover,
.c-mini-modal__close:active,
.c-mini-modal__close:focus,
.c-mini-modal__nav:hover,
.c-mini-modal__nav:active,
.c-mini-modal__nav:focus {
text-decoration: none;
outline: none;
}
.c-mini-modal__close {
top: 0.5rem;
right: 0.5rem;
background-color: rgba(0, 0, 0, 0);
color: #fff;
}
.c-mini-modal__nav {
top: 50%;
transform: translateY(-50%);
background-color: #fff;
border-radius: 50%;
}
.c-mini-modal__nav--previous {
left: 0.5rem;
}
.c-mini-modal__nav--next {
right: 0.5rem;
}
/* ==========================================================================
COMPONENTS / NAVIGATION
========================================================================== */
.mega-menu-navigation{
background: #FFFFFF;
border: 1px solid #E5E5E5;
box-shadow: 0 0 0 0px rgba(0,0,0,0.1), 0px 2px 4px rgba(0,0,0,0.4);
display: flex;
display: none;
height: 555px;
left: 48px;
max-height: 626px;
max-width: 88rem;
overflow-y: auto;
position: absolute;
top: 100%;
width: 100%;
z-index: 99;
}
.mega-menu-navigation::-webkit-scrollbar {
width: 3px;
}
.mega-menu-navigation::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 4px rgba(0,0,0,0.3);
}
.mega-menu-navigation::-webkit-scrollbar-thumb {
background-color: #194A8F;
border-radius: 10px;
outline: 1px solid ##194A8F;
}
.cat-assign-product{
list-style: none;
margin-left: 0px;
padding: 0;
text-align: left;
}
.cat-assign-product li{
list-style: none;
}
@media ( max-width: 60em ){
.mega-menu-navigation{
border: 0;
box-shadow: none;
margin: 0;
position: static;
}
.category-image {
display: none;
}
.mega-menu-navigation .level-1 .main-cat-name {
margin-top: 0;
}
.cat-assign-product{
margin-bottom: 0;
}
.mega-menu-navigation .level-1 {
padding-bottom: 0!important;
padding-top: 0!important;
width: 100%!important;
}
.t-site-header__logo a{
margin: 0 auto;
max-width: 126px;
}
}
.mega-menu-navigation .o-layout__item.level-1 a{
display: block;
position: relative;
text-align: left;
}
.mega-menu-navigation .o-layout__item.level-1 .cat-assign-product a:before{
/* content: "\f101";
font-family: 'fontawesome';
margin-right: 5px;
color: #ed1e24;
position: absolute;
left: -14px; */
}
.mega-menu-navigation .level-1{
padding: 10px 20px 15px;
/* border-right: 1px solid #ececec; */
}
.mega-menu-navigation .level-1 .cat-tree-image{
width: 45%;
}
.mega-menu-navigation .level-1 .main-cat-name{
border-bottom: 1px solid #EFEFEF;
color: #333131;
display: block;
font-size: 15px;
margin: 16px 0 8px;
padding-bottom: 4px;
text-transform: uppercase;
}
.mega-menu-navigation .level-1 ul li a {
color: #333131;
font-size: 14px;
font-weight: normal;
line-height: 19px;
margin-bottom: 6px;
}
.mega-menu-navigation .level-1 ul li a:hover{
color: #ED1E24;
text-decoration: underline;
}
.c-navigation {
position: relative;
}
.c-navigation__trigger {
display: none;
}
.c-navigation__trigger:checked ~ .c-navigation__row,
.c-navigation__trigger:checked ~ .c-navigation__row .c-navigation__row {
display: block;
}
.c-navigation__label {
background-color: #9F9F9F;
color: #FFF;
display: block;
font-style: normal;
margin: 0;
min-height: 2em;
padding: 1em;
position: relative;
}
.c-navigation__label:after,
.c-navigation__label:before {
position: absolute;
right: 1em;
transition: 0.4s cubic-bezier(0.2, 0.6, 0.3, 1.1);
}
.c-navigation__label:after {
content: "\2212";
opacity: 0;
transform: scale(0);
}
.c-navigation__label:before {
content: "\2261";
opacity: 1;
transform: scale(2);
}
.c-navigation__trigger:checked ~ .c-navigation__label:after {
opacity: 1;
transform: scale(2);
}
.c-navigation__trigger:checked ~ .c-navigation__label:before {
opacity: 0;
transform: scale(0);
}
.c-navigation__row {
display: none;
list-style: none;
margin: 0;
padding: 0;
width: 100%;
}
.c-navigation__link {
background-color: #FFF;
color: #0F0F0F;
display: block;
padding: 0.5em 1em;
}
.c-navigation__link:hover {
box-shadow: 0 2px 0 -1px #0F0F0F;
text-decoration: none;
transition: box-shadow ease-in 0.2s;
}
.c-navigation__row:nth-child(2) .c-navigation__link {
padding-left: 2em;
}
.c-navigation__row:nth-child(2) .c-navigation__row:last-of-type .c-navigation__link {
padding-left: 3em;
}
.hamburger{
color: #ED1E24;
cursor: pointer;
font-family: fontAwesome;
font-size: 24px;
margin-left: 7px;
margin-right: 3%;
}
@media ( min-width: 1349px ) {
.x-fasten-header--is-active .mega-menu-navigation{
top: 5rem;
}
}
@media ( min-width: 48em ) {
.c-navigation__label {
display: none;
}
.c-navigation__row,
.c-navigation__trigger:checked ~ .c-navigation__row,
.c-navigation__trigger:checked ~ .c-navigation__row .c-navigation__row {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.c-navigation__list {
flex: 1 1 auto;
position: relative;
text-align: center;
}
.c-navigation__list .c-navigation__row {
display: none;
min-width: 100%;
position: absolute;
white-space: nowrap;
z-index: 100;
}
.c-navigation__row:nth-child(2) .c-navigation__list {
text-align: left;
}
.c-navigation__row:nth-child(2) .c-navigation__row:last-of-type {
left: 100%;
top: 0;
z-index: 200;
}
.c-navigation__row:nth-child(2) .c-navigation__link,
.c-navigation__row:nth-child(2) .c-navigation__row:last-of-type .c-navigation__link {
padding-left: 1em;
}
.c-navigation__row:nth-child(2) .c-navigation__link:hover {
background-color: #EAEAEA;
box-shadow: none;
transition: background-color ease-in 0.2s;
}
.c-navigation__list:hover > .c-navigation__row {
box-shadow: 1px 1px 0.25em 0 #0F0F0F;
display: table;
}
.c-navigation__link {
border-right: 0 solid #0F0F0F; /* Change to 1px to add a right-border */
}
.c-navigation__list:last-of-type .c-navigation__link,
.c-navigation__row:nth-child(2) .c-navigation__list .c-navigation__link {
border-right: 0;
}
}
@media ( min-width: 60em ) {
.x-fasten-header--is-active .mega-menu-navigation {
background-color: #FFF;
border: 1px solid #F1F1F1;
left: 1px;
margin: 0 auto;
max-width: 88rem;
padding: 0;
position: fixed;
right: 0;
top: 4rem;
width: 100%;
}
}
@media ( max-width: 767px ){
.cat-assign-product{
margin-bottom: 20px;
}
}
.x-search-preview__item-nam{padding-bottom: 3px;}
/* ==========================================================================
COMPONENTS / TABLES
========================================================================== */
/**
* The simple table offers easy to read data with a horizontal divider between
* rows at the expense of occupying more space.
*/
.c-table-simple {
border-collapse: collapse;
}
.c-table-simple__row {
border-bottom: 1px solid #c0c0c0;
}
.c-table-simple__cell {
padding: calc(16px / 2);
text-align: left;
vertical-align: top;
}
.c-table-simple__cell--standard {
padding: 16px;
}
.c-table-simple__cell--wide {
padding: calc(16px * 2);
}
/**
* The stripped table offers easy to read data with alternating background rows.
*/
.c-table-stripped {
border-collapse: collapse;
}
.c-table-stripped__row:not(:nth-child(even)) {
background-color: #eaeaea;
}
/**
* This is a basic, responsive table set-up. It does require using a `data-label`
* attribute if you would like to show the row titles.
*/
.c-table-responsive {
width: 100%;
border-collapse: collapse;
font-size: 13px;
}
.c-table-responsive_thead {
display: none;
}
.c-table-responsive__row {
display: block;
margin-bottom: calc(16px / 2);
border-bottom: 1px solid #c0c0c0;
}
.c-table-responsive_thead .c-table-responsive__row{
font-size: 13px;
}
.c-table-responsive__cell {
display: block;
padding-bottom: calc(16px / 2);
}
tbody .c-table-responsive__cell{
font-weight:normal;
}
.c-table-responsive__cell::before {
display: block;
font-weight: 700;
text-align: left;
content: attr(data-label);
}
.c-table-responsive__cell--flex {
display: flex;
justify-content: space-between;
}
@media screen and (min-width: 48em) {
.c-table-responsive_thead {
display: table-header-group;
}
.c-table-responsive__row {
display: table-row;
margin-bottom: 0;
}
.c-table-responsive__cell {
display: table-cell;
padding: calc(16px / 2);
text-align: left;
vertical-align: top;
}
.c-table-responsive__cell--standard {
padding: 16px;
}
.c-table-responsive__cell--wide {
padding: calc(16px * 2);
}
.c-table-responsive__cell::before {
display: none;
}
}
/* ==========================================================================
COMPONENTS / TYPOGRAPHY
========================================================================== */
/**
* In order to divorce our semantic decisions from our stylistic ones, we only
* define opinionated typographical styles against classes, NOT against
* typographic HTML elements.
*
* Further reading:
* http://csswizardry.com/2016/02/managing-typography-on-large-apps/
*/
/* Heading-level typography
=========================================== */
.c-heading-alpha {
font-size: calc((((16px * 1.2) * 1.2) * 1.2) * 1.2);
line-height: 1.25;
}
.c-heading-bravo {
font-size: calc(((16px * 1.2) * 1.2) * 1.2);
line-height: 1.154;
}
.c-heading-charlie {
font-size: calc((16px * 1.2) * 1.2);
line-height: 1.136;
}
.c-heading-delta {
/* font-size: calc(16px * 2.875); */
line-height: 1.125;
font-size: calc(16px * 1.333);
}
.c-heading-echo {
font-size: 16px;
line-height: 1.125;
}
.c-heading-foxtrot {
font-size: calc(16px / 1.2);
line-height: 1.125;
}
@media (min-width: 40em) {
/**
* Small Breakpoint [40em = 640px]
* When in the small breakpoint, 'font-size' and 'line-height' are
* dynamically adjusted.
*/
.t-page-sfnt .c-heading-delta{
font-size: calc(16px * 1.875);
}
.c-heading-alpha {
font-size: calc(((((16px * 1.2) * 1.2) * 1.2) * 1.2) + (((((16 * 1.333) * 1.333) * 1.333) * 1.333) - ((((16 * 1.2) * 1.2) * 1.2) * 1.2)) * ((100vw - (640 * 1px) ) / (960 - 640)));
line-height: calc(1.25em + 0.2 * ((100% - (640 * 1px)) / 640));
}
.c-heading-bravo {
font-size: calc((((16px * 1.2) * 1.2) * 1.2) + ((((16 * 1.333) * 1.333) * 1.333) - (((16 * 1.2) * 1.2) * 1.2)) * ((100vw - (640 * 1px) ) / (960 - 640)));
line-height: calc(1.154em + 0.096 * ((100% - (640 * 1px)) / 640));
}
.c-heading-charlie {
font-size: calc(((16px * 1.2) * 1.2) + (((16 * 1.333) * 1.333) - ((16 * 1.2) * 1.2)) * ((100vw - (640 * 1px) ) / (960 - 640)));
line-height: calc(1.136em + 0.114 * ((100% - (640 * 1px)) / 640));
}
.c-heading-delta {
font-size: calc((16px * 1.2) + ((16 * 1.333) - (16 * 1.2)) * ((100vw - (640 * 1px) ) / (960 - 640)));
line-height: calc(1.125em + 0.95 * ((100% - (640 * 1px)) / 640));
}
.c-heading-echo {
font-size: calc(16px * ((100vw - (640 * 1px) ) / (960 - 640)));
line-height: calc(1.125em + 0.25 * ((100% - (640 * 1px)) / 640));
}
.c-heading-foxtrot {
font-size: calc((16px / 1.2) + ((16 / 1.333) - (16 / 1.2)) * ((100vw - (640 * 1px) ) / (960 - 640)));
line-height: calc(1.125em + 0.25 * ((100% - (640 * 1px)) / 640));
}
}
@media (min-width: 60em) {
/**
* Large Breakpoint [60em = 960px] and Greater
*/
.c-heading-alpha {
font-size: calc((((16px * 1.333) * 1.333) * 1.333) * 1.333);
line-height: 1.05;
}
.c-heading-bravo {
font-size: calc(((16px * 1.333) * 1.333) * 1.333);
line-height: 1.25;
}
.c-heading-charlie {
font-size: calc((16px * 1.333) * 1.333);
line-height: 1.25;
}
.c-heading-delta {
/* font-size: calc(16px * 2.875); */
line-height: 1.22;
font-size: calc(16px * 1.333);
}
.t-page-sfnt .c-heading-delta,
#dc_blog .c-heading-delta{
font-size: calc(16px * 2.625);
}
.t-page-sfnt .c-heading-delta{
margin-bottom:0;
}
#storefront_instagram .c-heading-delta{
margin-bottom:1rem;
}
.t-page-sfnt section.t-storefront-why-dc .c-heading-delta{
font-size: calc(10px * 2.625);
}
.c-heading-echo {
font-size: 16px;
line-height: 1.5;
}
.c-heading-foxtrot {
font-size: calc(16px / 1.333);
line-height: 1.5;
}
}
.c-heading--subheading {
font-size: 1rem;
font-weight: 600;
line-height: 1.3;
}
.c-heading--keyline {
display: inline-block;
margin-bottom: 1em;
position: relative;
}
.c-heading--keyline::after {
display: block;
width: 25%;
height: calc(16px / 8);
position: absolute;
left: 50%;
-webkit-transform: translate(-50%, 0.5em);
-ms-transform: translate(-50%, 0.5em);
transform: translate(-50%, 0.5em);
background-color: #c0c0c0;
content: "";
}
/* Text-level typography
=========================================== */
.c-text-body {
font-size: 16px;
}
/* ==========================================================================
UTILITIES / BORDERS
========================================================================== */
/**
* Utility classes to adjust element borders.
*/
.u-border-none {
border-width: 0;
}
.u-border-thick {
border-width: calc(1px * 2);
}
.u-border-rounded {
border-radius: 10em;
}
.u-border-square {
border-radius: 0;
}
/* ==========================================================================
UTILITIES / CLEAR FIX
========================================================================== */
/**
* Class-based implementation of the 'clearfix hack'.
* http://cssmojo.com/the-very-latest-clearfix-reloaded/
*/
.u-clear-fix::after {
display: table;
clear: both;
content: "";
}/* ==========================================================================
UTILITIES / COLORS
========================================================================== */
/**
* Utility classes to adjust element colors inline.
* Both .u-bg-*** and .u-color-*** work for each color class.
*/
.u-bg-red {
background-color: #ed1e24;
}
.u-bg-blue-light::before,
.u-bg-blue-light {
background-color: #f3f8fe;
}
.u-bg-yellow::before,
.u-bg-yellow {
background-color: #f9ed1f;
}
.u-bg-blue::before,
.u-bg-blue {
background-color: #194a8f;
}
.u-bg-dark-blue::before,
.u-bg-dark-blue {
background-color: #194a8f;
}
.u-bg-green::before,
.u-bg-green {
background-color: #009a44;
}
.u-bg-black::before,
.u-bg-black {
background-color: #0f0f0f;
}
.u-bg-gray-50::before,
.u-bg-gray-50 {
background-color: #222;
}
.u-bg-gray-40::before,
.u-bg-gray-40 {
background-color: #707070;
}
.u-bg-gray-30::before,
.u-bg-gray-30 {
background-color: #9f9f9f;
}
.u-bg-gray-20::before,
.u-bg-gray-20 {
background-color: #c0c0c0;
}
.u-bg-gray-10::before,
.u-bg-gray-10 {
background-color: #eaeaea;
}
.u-bg-white::before,
.u-bg-white {
background-color: #fff;
}
.u-bg-transparent {
background-color: rgba(0, 0, 0, 0);
}
.u-bg-primary::before,
.u-bg-primary {
background-color: #3d70b2;
}
.u-bg-secondary::before,
.u-bg-secondary {
background-color: #5aaafa;
}
.u-bg-tertiary::before,
.u-bg-tertiary {
background-color: #008571;
}
.u-bg-highlight::before,
.u-bg-highlight {
background-color: #f9ed1f;
}
.u-bg-accent::before,
.u-bg-accent {
background-color: #3cc;
}
.c-button:hover.u-bg-red {
background-color: #fe2f35;
}
.c-button:hover.u-bg-yellow {
background-color: #c7bd19;
}
.c-button:hover.u-bg-blue {
background-color: #2567c3;
}
.c-button:hover.u-bg-green {
background-color: #007c36;
}
.c-button:hover.u-bg-black {
background-color: #3f3f3f;
}
.c-button:hover.u-bg-gray-50 {
background-color: #4e4e4e;
}
.c-button:hover.u-bg-gray-40 {
background-color: #5a5a5a;
}
.c-button:hover.u-bg-gray-30 {
background-color: #7f7f7f;
}
.c-button:hover.u-bg-gray-20 {
background-color: #9a9a9a;
}
.c-button:hover.u-bg-gray-10 {
background-color: #bcbcbc;
}
.c-button:hover.u-bg-white {
background-color: #cbcbcb;
}
.c-button:hover.u-bg-primary {
background-color: #315a8e;
}
.c-button:hover.u-bg-secondary {
background-color: #4888c8;
}
.c-button:hover.u-bg-tertiary {
background-color: #006b5b;
}
.c-button:hover.u-bg-highlight {
background-color: #c7bd19;
}
.c-button:hover.u-bg-accent {
background-color: #29a4a4;
}
.u-color-red {
color: #c8102e;
}
.u-color-yellow {
color: #f9ed1f;
}
.u-color-blue {
color: #1c55a6;
}
.u-color-green {
color: #009a44;
}
.u-color-black {
color: #1f2930;
}
.u-color-gray-50 {
color: #313131;
}
.u-color-gray-40 {
color: #707070;
}
.u-color-gray-30 {
color: #404146;
}
.u-color-gray-20 {
color: #c0c0c0;
}
.u-color-gray-10 {
color: #eaeaea;
}
.u-color-white {
color: #fff;
}
.u-color-transparent {
color: rgba(0, 0, 0, 0);
}
.u-color-primary {
color: #3d70b2;
}
.u-color-secondary {
color: #5aaafa;
}
.u-color-tertiary {
color: #008571;
}
.u-color-highlight {
color: #f9ed1f;
}
.u-color-accent {
color: #3cc;
}
/**
* This will make sure the full background of a layout object is filled.
*/
.o-layout[class*="u-bg-"] {
position: relative;
background-color: rgba(0, 0, 0, 0);
}
.o-layout[class*="u-bg-"]::before {
display: block;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 16px;
content: '';
}
.o-layout--narrow[class*="u-bg-"]::before {
left: calc(16px * 0.5);
}
.o-layout--wide[class*="u-bg-"]::before {
left: calc(16px * 2);
}
.o-layout--flush[class*="u-bg-"]::before {
left: 0;
}
.o-layout[class*="u-bg-"] > * {
position: relative;
z-index: 1;
}
/* ==========================================================================
UTILITIES / DISPLAY
========================================================================== */
.u-overflow-hidden {
overflow: hidden;
}
/**
* Hide only visually, but have it available for screen readers:
* http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
*/
.u-hide-visually {
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
position: absolute;
overflow: hidden;
border: 0;
clip: rect(0 0 0 0);
white-space: nowrap;
}
.u-hide-visually.focusable:active,
.u-hide-visually.focusable:focus {
width: auto;
height: auto;
margin: 0;
overflow: visible;
position: static;
clip: auto;
white-space: inherit;
}
/**
* Hide visually and from screen readers.
*/
[aria-hidden='true'],
.u-hidden {
display: none;
}
/**
* Hidden visually but maintains the layout.
*/
.u-invisible {
visibility: hidden;
}
/**
* Various utility classes to show the content.
*/
.u-flex {
display: flex;
}
.u-block,
.u-shown {
display: block;
}
.u-inline {
display: inline;
}
.u-inline-block {
display: inline-block;
}
.u-visible {
visibility: visible;
}
/* Small Breakpoint [40em = 640px]
=========================================== */
@media screen and (min-width: 40em) {
.u-hidden--s {
display: none;
}
.u-invisible--s {
visibility: hidden;
}
.u-flex--s {
display: flex;
}
.u-block--s,
.u-shown--s {
display: block;
}
.u-inline--s {
display: inline;
}
.u-inline-block--s {
display: inline-block;
}
.u-visible--s {
visibility: visible;
}
}
/* Medium Breakpoint [48em = 768px]
=========================================== */
@media screen and (min-width: 48em) {
.u-hidden--m {
display: none;
}
.u-invisible--m {
visibility: hidden;
}
.u-flex--m {
display: flex;
}
.u-block--m,
.u-shown--m {
display: block;
}
.u-inline--m {
display: inline;
}
.u-inline-block--m {
display: inline-block;
}
.u-visible--m {
visibility: visible;
}
}
/* Large Breakpoint [60em = 960px]
=========================================== */
@media screen and (min-width: 60em) {
.u-hidden--l {
display: none;
}
.u-invisible--l {
visibility: hidden;
}
.u-flex--l {
display: flex;
}
.u-block--l,
.u-shown--l {
display: block;
}
.u-inline--l {
display: inline;
}
.u-inline-block--l {
display: inline-block;
}
.u-visible--l {
visibility: visible;
}
}
/* Extra-Large Breakpoint [75em = 1200px]
=========================================== */
@media screen and (min-width: 75em) {
.u-hidden--xl {
display: none;
}
.u-invisible--xl {
visibility: hidden;
}
.u-flex--xl {
display: flex;
}
.u-block--xl,
.u-shown--xl {
display: block;
}
.u-inline--xl {
display: inline;
}
.u-inline-block--xl {
display: inline-block;
}
.u-visible--xl {
visibility: visible;
}
}
/* Wide-Screen Breakpoint [90em = 1440px]
=========================================== */
@media screen and (min-width: 90em) {
.u-hidden--w {
display: none;
}
.u-invisible--w {
visibility: hidden;
}
.u-flex--w {
display: flex;
}
.u-block--w,
.u-shown--w {
display: block;
}
.u-inline--w {
display: inline;
}
.u-inline-block--w {
display: inline-block;
}
.u-visible--w {
visibility: visible;
}
}
/* ==========================================================================
UTILITIES / GRIDS
========================================================================== */
/**
* A series of utility classes that give an automatic number of columns based
* on the class used, media breakpoints are included.
*
*
*
* The above will create a three-column structure in which each column will
* fluidly fill one-third of the width of the parent with the remainder elements
* wrapping as needed. We can have more complex systems:
*
*
*
* The above will create a structure in which each column will be 100% width
* until we enter our medium breakpoint, then they will be one-third the width
* of the parent container with the remainder elements wrapping as needed.
*/
/* Mobile First
=========================================== */
.u-grids-1 > .o-layout__item {
flex-basis: 100%;
max-width: 100%;
}
.u-grids-2 > .o-layout__item {
flex-basis: calc(100% / 2);
max-width: calc(100% / 2);
}
.u-grids-3 > .o-layout__item {
flex-basis: calc(100% / 3);
max-width: calc(100% / 3);
}
.u-grids-4 > .o-layout__item {
flex-basis: calc(100% / 4);
max-width: calc(100% / 4);
}
.u-grids-5 > .o-layout__item {
flex-basis: calc(100% / 5);
max-width: calc(100% / 5);
}
.u-grids-6 > .o-layout__item {
flex-basis: calc(100% / 6);
max-width: calc(100% / 6);
}
.u-grids-7 > .o-layout__item {
flex-basis: calc(100% / 7);
max-width: calc(100% / 7);
}
.u-grids-8 > .o-layout__item {
flex-basis: calc(100% / 8);
max-width: calc(100% / 8);
}
.u-grids-9 > .o-layout__item {
flex-basis: calc(100% / 9);
max-width: calc(100% / 9);
}
.u-grids-10 > .o-layout__item {
flex-basis: calc(100% / 10);
max-width: calc(100% / 10);
}
.u-grids-11 > .o-layout__item {
flex-basis: calc(100% / 11);
max-width: calc(100% / 11);
}
.u-grids-12 > .o-layout__item {
flex-basis: calc(100% / 12);
max-width: calc(100% / 12);
}
/* Small Breakpoint [40em = 640px]
=========================================== */
@media screen and (min-width: 40em) {
.u-grids-1--s > .o-layout__item {
flex-basis: 100%;
max-width: 100%;
}
.u-grids-2--s > .o-layout__item {
flex-basis: calc(100% / 2);
max-width: calc(100% / 2);
}
.u-grids-3--s > .o-layout__item {
flex-basis: calc(100% / 3);
max-width: calc(100% / 3);
}
.u-grids-4--s > .o-layout__item {
flex-basis: calc(100% / 4);
max-width: calc(100% / 4);
}
.u-grids-5--s > .o-layout__item {
flex-basis: calc(100% / 5);
max-width: calc(100% / 5);
}
.u-grids-6--s > .o-layout__item {
flex-basis: calc(100% / 6);
max-width: calc(100% / 6);
}
.u-grids-7--s > .o-layout__item {
flex-basis: calc(100% / 7);
max-width: calc(100% / 7);
}
.u-grids-8--s > .o-layout__item {
flex-basis: calc(100% / 8);
max-width: calc(100% / 8);
}
.u-grids-9--s > .o-layout__item {
flex-basis: calc(100% / 9);
max-width: calc(100% / 9);
}
.u-grids-10--s > .o-layout__item {
flex-basis: calc(100% / 10);
max-width: calc(100% / 10);
}
.u-grids-11--s > .o-layout__item {
flex-basis: calc(100% / 11);
max-width: calc(100% / 11);
}
.u-grids-12--s > .o-layout__item {
flex-basis: calc(100% / 12);
max-width: calc(100% / 12);
}
}
/* Medium Breakpoint [48em = 768px]
=========================================== */
@media screen and (min-width: 48em) {
.u-grids-1--m > .o-layout__item {
flex-basis: 100%;
max-width: 100%;
}
.u-grids-2--m > .o-layout__item {
flex-basis: calc(100% / 2);
max-width: calc(100% / 2);
}
.u-grids-3--m > .o-layout__item {
flex-basis: calc(100% / 3);
max-width: calc(100% / 3);
}
.u-grids-4--m > .o-layout__item {
flex-basis: calc(100% / 4);
max-width: calc(100% / 4);
}
.u-grids-5--m > .o-layout__item {
flex-basis: calc(100% / 5);
max-width: calc(100% / 5);
}
.u-grids-6--m > .o-layout__item {
flex-basis: calc(100% / 6);
max-width: calc(100% / 6);
}
.u-grids-7--m > .o-layout__item {
flex-basis: calc(100% / 7);
max-width: calc(100% / 7);
}
.u-grids-8--m > .o-layout__item {
flex-basis: calc(100% / 8);
max-width: calc(100% / 8);
}
.u-grids-9--m > .o-layout__item {
flex-basis: calc(100% / 9);
max-width: calc(100% / 9);
}
.u-grids-10--m > .o-layout__item {
flex-basis: calc(100% / 10);
max-width: calc(100% / 10);
}
.u-grids-11--m > .o-layout__item {
flex-basis: calc(100% / 11);
max-width: calc(100% / 11);
}
.u-grids-12--m > .o-layout__item {
flex-basis: calc(100% / 12);
max-width: calc(100% / 12);
}
}
/* Large Breakpoint [60em = 960px]
=========================================== */
@media screen and (min-width: 60em) {
.u-grids-1--l > .o-layout__item {
flex-basis: 100%;
max-width: 100%;
}
.u-grids-2--l > .o-layout__item {
flex-basis: calc(100% / 2);
max-width: calc(100% / 2);
}
.u-grids-3--l > .o-layout__item {
flex-basis: calc(100% / 3);
max-width: calc(100% / 3);
}
.u-grids-4--l > .o-layout__item {
flex-basis: calc(100% / 4);
max-width: calc(100% / 4);
}
.u-grids-5--l > .o-layout__item {
flex-basis: calc(100% / 5);
max-width: calc(100% / 5);
}
.u-grids-6--l > .o-layout__item {
flex-basis: calc(100% / 6);
max-width: calc(100% / 6);
}
.u-grids-7--l > .o-layout__item {
flex-basis: calc(100% / 7);
max-width: calc(100% / 7);
}
.u-grids-8--l > .o-layout__item {
flex-basis: calc(100% / 8);
max-width: calc(100% / 8);
}
.u-grids-9--l > .o-layout__item {
flex-basis: calc(100% / 9);
max-width: calc(100% / 9);
}
.u-grids-10--l > .o-layout__item {
flex-basis: calc(100% / 10);
max-width: calc(100% / 10);
}
.u-grids-11--l > .o-layout__item {
flex-basis: calc(100% / 11);
max-width: calc(100% / 11);
}
.u-grids-12--l > .o-layout__item {
flex-basis: calc(100% / 12);
max-width: calc(100% / 12);
}
}
/* Extra-Large Breakpoint [75em = 1200px]
=========================================== */
@media screen and (min-width: 75em) {
.u-grids-1--xl > .o-layout__item {
flex-basis: 100%;
max-width: 100%;
}
.u-grids-2--xl > .o-layout__item {
flex-basis: calc(100% / 2);
max-width: calc(100% / 2);
}
.u-grids-3--xl > .o-layout__item {
flex-basis: calc(100% / 3);
max-width: calc(100% / 3);
}
.u-grids-4--xl > .o-layout__item {
flex-basis: calc(100% / 4);
max-width: calc(100% / 4);
}
.u-grids-5--xl > .o-layout__item {
flex-basis: calc(100% / 5);
max-width: calc(100% / 5);
}
.u-grids-6--xl > .o-layout__item {
flex-basis: calc(100% / 6);
max-width: calc(100% / 6);
}
.u-grids-7--xl > .o-layout__item {
flex-basis: calc(100% / 7);
max-width: calc(100% / 7);
}
.u-grids-8--xl > .o-layout__item {
flex-basis: calc(100% / 8);
max-width: calc(100% / 8);
}
.u-grids-9--xl > .o-layout__item {
flex-basis: calc(100% / 9);
max-width: calc(100% / 9);
}
.u-grids-10--xl > .o-layout__item {
flex-basis: calc(100% / 10);
max-width: calc(100% / 10);
}
.u-grids-11--xl > .o-layout__item {
flex-basis: calc(100% / 11);
max-width: calc(100% / 11);
}
.u-grids-12--xl > .o-layout__item {
flex-basis: calc(100% / 12);
max-width: calc(100% / 12);
}
}
/* Wide-Screen Breakpoint [90em = 1440px]
=========================================== */
@media screen and (min-width: 90em) {
.u-grids-1--w > .o-layout__item {
flex-basis: 100%;
max-width: 100%;
}
.u-grids-2--w > .o-layout__item {
flex-basis: calc(100% / 2);
max-width: calc(100% / 2);
}
.u-grids-3--w > .o-layout__item {
flex-basis: calc(100% / 3);
max-width: calc(100% / 3);
}
.u-grids-4--w > .o-layout__item {
flex-basis: calc(100% / 4);
max-width: calc(100% / 4);
}
.u-grids-5--w > .o-layout__item {
flex-basis: calc(100% / 5);
max-width: calc(100% / 5);
}
.u-grids-6--w > .o-layout__item {
flex-basis: calc(100% / 6);
max-width: calc(100% / 6);
}
.u-grids-7--w > .o-layout__item {
flex-basis: calc(100% / 7);
max-width: calc(100% / 7);
}
.u-grids-8--w > .o-layout__item {
flex-basis: calc(100% / 8);
max-width: calc(100% / 8);
}
.u-grids-9--w > .o-layout__item {
flex-basis: calc(100% / 9);
max-width: calc(100% / 9);
}
.u-grids-10--w > .o-layout__item {
flex-basis: calc(100% / 10);
max-width: calc(100% / 10);
}
.u-grids-11--w > .o-layout__item {
flex-basis: calc(100% / 11);
max-width: calc(100% / 11);
}
.u-grids-12--w > .o-layout__item {
flex-basis: calc(100% / 12);
max-width: calc(100% / 12);
}
}
/* ==========================================================================
UTILITIES / ICONS
========================================================================== */
/**
* This contains the "@font-face" call needed to add the ReadyTheme Icons Font
* package to your site. These icons are available for use in addition to any
* theme-based icons which may be referenced in the "theme-fonts.css" file.
*/
@font-face {
font-family: 'ReadyTheme Icons';
font-style: normal;
font-weight: normal;
src: url('/mm5/themes/shadows/ui/css/ReadyThemeIcons.woff') format('woff');
}
[class^="u-icon-"],
[class*=" u-icon-"],
[data-icon]::before {
font-family: "ReadyTheme Icons", sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-variant: normal;
font-weight: normal;
line-height: 1;
speak: none;
text-transform: none;
}
[data-icon]::before {
content: attr(data-icon);
}
[class^="u-icon-"]::before,
[class*=" u-icon-"]::before,
[data-icon]::before {
background-color: rgba(0, 0, 0, 0);
}
.u-icon-error::before {
content: "\21";
}
.u-icon-warning::before {
content: "\22";
}
.u-icon-question::before {
content: "\23";
}
.u-icon-info::before {
content: "\24";
}
.u-icon-gift::before {
content: "\25";
}
.u-icon-settings::before {
content: "\26";
}
.u-icon-protected::before {
content: "\27";
}
.u-icon-secure::before {
content: "\28";
}
.u-icon-envelope::before {
content: "\29";
}
.u-icon-truck::before {
content: "\2a";
}
.u-icon-globe::before {
content: "\2b";
}
.u-icon-history::before {
content: "\2c";
}
.u-icon-balance::before {
content: "\2d";
}
.u-icon-remove::before {
content: "\2e";
}
.u-icon-cart-add::before {
content: "\2f";
}
.u-icon-chevron-up::before {
content: "\30";
}
.u-icon-chevron-down::before {
content: "\31";
}
.u-icon-chevron-left::before {
content: "\32";
}
.u-icon-chevron-right::before {
content: "\33";
}
.u-icon-triangle-up::before {
content: "\34";
}
.u-icon-triangle-down::before {
content: "\35";
}
.u-icon-triangle-left::before {
content: "\36";
}
.u-icon-triangle-right::before {
content: "\37";
}
.u-icon-arrow-up::before {
content: "\38";
}
.u-icon-arrow-down::before {
content: "\39";
}
.u-icon-arrow-left::before {
content: "\3a";
}
.u-icon-arrow-right::before {
content: "\3b";
}
.u-icon-subtract::before {
content: "\3c";
}
.u-icon-add::before {
content: "\3d";
}
.u-icon-cross::before {
content: "\3e";
}
.u-icon-check::before {
content: "\3f";
}
.u-icon-zoom-out::before {
content: "\40";
}
.u-icon-zoom-in::before {
content: "\41";
}
.u-icon-search::before {
content: "\42";
}
.u-icon-credit-card::before {
content: "\43";
}
.u-icon-heart-empty::before {
content: "\44";
}
.u-icon-heart-full::before {
content: "\45";
}
.u-icon-star-empty::before {
content: "\46";
}
.u-icon-star-full::before {
content: "\47";
}
.u-icon-home::before {
content: "\48";
}
.u-icon-user::before {
content: "\49";
}
.u-icon-phone::before {
content: "\4a";
}
.u-icon-facebook::before {
content: "\4b";
}
.u-icon-twitter::before {
content: "\4c";
}
.u-icon-pinterest::before {
content: "\4d";
}
.u-icon-google::before {
content: "\4e";
}
.u-icon-instagram::before {
content: "\4f";
}
.u-icon-vimeo::before {
content: "\50";
}
.u-icon-youtube::before {
content: "\51";
}
.u-icon-flickr::before {
content: "\52";
}
.u-icon-print::before {
content: "\53";
}
.u-icon-wallet::before {
content: "\54";
}
.u-icon-document::before {
content: "\55";
}
.u-icon-menu::before {
content: "\56";
}
.u-icon-calendar::before {
content: "\57";
}
.u-icon-bag-empty::before {
content: "\58";
}
.u-icon-bag-full::before {
content: "\59";
}
.u-icon-cart-empty::before {
content: "\5a";
}
.u-icon-cart-full::before {
content: "\5b";
}
.u-icon-location::before {
content: "\5c";
}
/* ==========================================================================
UTILITIES / PRINT
========================================================================== */
/**
* Print styles taken from the HTML5 Boilerplate:
* https://github.com/h5bp/html5-boilerplate/blob/master/dist/css/main.css
* Inlined to avoid the additional HTTP request:
* http://www.phpied.com/delay-loading-your-print-css/
*/
/*@media print {
*,
*:before,
*:after,
p:first-letter,
div:first-letter,
blockquote:first-letter,
li:first-letter,
p:first-line,
div:first-line,
blockquote:first-line,
li:first-line {
background: transparent !important;
color: #000 !important;
box-shadow: none !important;
text-shadow: none !important;
}
a,
a:visited {
text-decoration: underline;
}
a[href]:after {
content: " (" attr(href) ")";
}
abbr[title]:after {
content: " (" attr(title) ")";
}
a[href^="#"]:after,
a[href^="javascript:"]:after {
content: "";
}
pre {
white-space: pre-wrap !important;
}
pre,
blockquote {
border: 1px solid #999;
page-break-inside: avoid;
}
thead {
display: table-header-group;
}
tr,
img {
page-break-inside: avoid;
}
p,
h2,
h3 {
orphans: 3;
widows: 3;
}
h2,
h3 {
page-break-after: avoid;
}
}*/
.u-printable__content {
display: none;
visibility: hidden;
}
@media print {
.u-printable:not(.u-printable__content) {
display: none;
visibility: hidden;
}
.u-printable__content {
display: block;
width: 100%;
position: absolute;
left: 0;
top: 0;
visibility: visible;
}
.u-printable__content * {
visibility: visible;
}
}
/* ==========================================================================
UTILITIES / TYPOGRAPHY
========================================================================== */
/* Set font-family options
=========================================== */
.u-font-primary {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
.u-font-secondary {
font-family: "Apple Garamond", "Baskerville", "Times New Roman", "Droid Serif", "Times", "Source Serif Pro", serif;
}
/* Text alignment utilities
=========================================== */
.u-text-left {
text-align: left;
}
.u-text-center {
text-align: center;
}
.u-text-right {
text-align: right;
}
.u-text-justify {
text-align: justify;
}
@media screen and (min-width: 40em) {
.u-text-left--s {
text-align: left;
}
.u-text-center--s {
text-align: center;
}
.u-text-right--s {
text-align: right;
}
.u-text-justify--s {
text-align: justify;
}
}
@media screen and (min-width: 48em) {
.u-text-left--m {
text-align: left;
}
.u-text-center--m {
text-align: center;
}
.u-text-right--m {
text-align: right;
}
.u-text-justify--m {
text-align: justify;
}
}
@media screen and (min-width: 60em) {
.u-text-left--l {
text-align: left;
}
.u-text-center--l {
text-align: center;
}
.u-text-right--l {
text-align: right;
}
.u-text-justify--l {
text-align: justify;
}
}
@media screen and (min-width: 90em) {
.u-text-left--w {
text-align: left;
}
.u-text-center--w {
text-align: center;
}
.u-text-right--w {
text-align: right;
}
.u-text-justify--w {
text-align: justify;
}
}
/* Font sizing utilities
=========================================== */
.u-font-tiny {
font-size: 0.625em;
}
.u-font-small {
font-size: 0.75em;
}
@media screen and (min-width: 40em) {
.u-font-tiny {
font-size: 0.75em;
}
.u-font-small {
font-size: 0.832em;
}
}
.u-font-medium {
font-size: 1em;
}
.u-font-large {
font-size: 1.25em;
}
.u-font-huge {
font-size: 1.75em;
}
/* Font style utilities
* 1. This is a hold-over class for content output by Miva.
=========================================== */
.u-text-light {
font-weight: 200;
}
.u-text-regular {
font-weight: 400;
}
.u-text-medium {
font-weight: 600;
}
/* [1] */
.u-text-bold {
font-weight: 700;
}
.required{
font-weight: 500;
}
.u-text-boldest {
font-weight: 900;
}
.u-text-caps {
font-variant: small-caps;
}
.u-text-italic {
font-style: italic;
}
.u-text-normal {
font-style: normal;
}
.u-text-lowercase {
text-transform: lowercase;
}
.u-text-revert {
text-transform: none;
}
.u-text-uppercase {
text-transform: uppercase;
}
.u-text-strike {
text-decoration: line-through;
}
.u-text-underline {
text-decoration: underline;
}
a.u-text-underline:hover {
text-decoration: none;
}
/**
* Text utility to constrain text to a maximum of 75 characters per line,
* regardless of the text's 'font-size'. 30em is roughly equal to 75 characters,
* so we hard-code this value. Please don't change it.
*
* https://jsfiddle.net/5571te7g/
*
*/
.u-text-constrain {
max-width: 30em;
}
/* ==========================================================================
UTILITIES / VERTICAL ALIGN
========================================================================== */
.u-align-baseline {
vertical-align: baseline;
}
.u-align-bottom {
vertical-align: bottom;
}
.u-align-middle {
vertical-align: middle;
}
.u-align-top {
vertical-align: top;
}
/**
* Utility classes to vertically align an element centrally within its parent.
*
* Using .u-vertical-align-center on an element can cause visual issues if it renders
* on a half pixel so we can apply preserve-3d to prevent this on the parent
* element.
*/
.u-vertical-align-parent {
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
}
/**
* This class requires a set height on the parent element to function correctly.
*/
.u-vertical-align-center {
position: relative;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
/* ==========================================================================
UTILITIES / WIDTHS
========================================================================== */
/**
* A series of utility classes that give a fluid width to whichever element
* they are applied to, media breakpoints are included.
*/
/* Mobile First
=========================================== */
/**
* Width size modifiers.
*/
.u-width-1 {
flex-basis: calc(100% / 12 * 1);
max-width: calc(100% / 12 * 1);
}
.u-width-2 {
flex-basis: calc(100% / 12 * 2);
max-width: calc(100% / 12 * 2);
}
.u-width-3 {
flex-basis: calc(100% / 12 * 3);
max-width: calc(100% / 12 * 3);
}
.u-width-4 {
flex-basis: calc(100% / 12 * 4);
max-width: calc(100% / 12 * 4);
}
.u-width-5 {
flex-basis: calc(100% / 12 * 5);
max-width: calc(100% / 12 * 5);
}
.u-width-6 {
flex-basis: calc(100% / 12 * 6);
max-width: calc(100% / 12 * 6);
}
.u-width-7 {
flex-basis: calc(100% / 12 * 7);
max-width: calc(100% / 12 * 7);
}
.u-width-8 {
flex-basis: calc(100% / 12 * 8);
max-width: calc(100% / 12 * 8);
}
.u-width-9 {
flex-basis: calc(100% / 12 * 9);
max-width: calc(100% / 12 * 9);
}
.u-width-10 {
flex-basis: calc(100% / 12 * 10);
max-width: calc(100% / 12 * 10);
}
.u-width-11 {
flex-basis: calc(100% / 12 * 11);
max-width: calc(100% / 12 * 11);
}
.u-width-12 {
flex-basis: calc(100% / 12 * 12);
max-width: calc(100% / 12 * 12);
}
/**
* Offset size modifiers.
*/
.u-offset-1 {
margin-left: calc(100% / 12 * 1);
}
.u-offset-2 {
margin-left: calc(100% / 12 * 2);
}
.u-offset-3 {
margin-left: calc(100% / 12 * 3);
}
.u-offset-4 {
margin-left: calc(100% / 12 * 4);
}
.u-offset-5 {
margin-left: calc(100% / 12 * 5);
}
.u-offset-6 {
margin-left: calc(100% / 12 * 6);
}
.u-offset-7 {
margin-left: calc(100% / 12 * 7);
}
.u-offset-8 {
margin-left: calc(100% / 12 * 8);
}
.u-offset-9 {
margin-left: calc(100% / 12 * 9);
}
.u-offset-10 {
margin-left: calc(100% / 12 * 10);
}
.u-offset-11 {
margin-left: calc(100% / 12 * 11);
}
/* Small Breakpoint [40em = 640px]
=========================================== */
@media screen and (min-width: 40em) {
.u-width-1--s {
flex-basis: calc(100% / 12 * 1);
max-width: calc(100% / 12 * 1);
}
.u-width-2--s {
flex-basis: calc(100% / 12 * 2);
max-width: calc(100% / 12 * 2);
}
.u-width-3--s {
flex-basis: calc(100% / 12 * 3);
max-width: calc(100% / 12 * 3);
}
.u-width-4--s {
flex-basis: calc(100% / 12 * 4);
max-width: calc(100% / 12 * 4);
}
.u-width-5--s {
flex-basis: calc(100% / 12 * 5);
max-width: calc(100% / 12 * 5);
}
.u-width-6--s {
flex-basis: calc(100% / 12 * 6);
max-width: calc(100% / 12 * 6);
}
.u-width-7--s {
flex-basis: calc(100% / 12 * 7);
max-width: calc(100% / 12 * 7);
}
.u-width-8--s {
flex-basis: calc(100% / 12 * 8);
max-width: calc(100% / 12 * 8);
}
.u-width-9--s {
flex-basis: calc(100% / 12 * 9);
max-width: calc(100% / 12 * 9);
}
.u-width-10--s {
flex-basis: calc(100% / 12 * 10);
max-width: calc(100% / 12 * 10);
}
.u-width-11--s {
flex-basis: calc(100% / 12 * 11);
max-width: calc(100% / 12 * 11);
}
.u-width-12--s {
flex-basis: calc(100% / 12 * 12);
max-width: calc(100% / 12 * 12);
}
/**
* Offset size modifiers.
*/
.u-offset-1--s {
margin-left: calc(100% / 12 * 1);
}
.u-offset-2--s {
margin-left: calc(100% / 12 * 2);
}
.u-offset-3--s {
margin-left: calc(100% / 12 * 3);
}
.u-offset-4--s {
margin-left: calc(100% / 12 * 4);
}
.u-offset-5--s {
margin-left: calc(100% / 12 * 5);
}
.u-offset-6--s {
margin-left: calc(100% / 12 * 6);
}
.u-offset-7--s {
margin-left: calc(100% / 12 * 7);
}
.u-offset-8--s {
margin-left: calc(100% / 12 * 8);
}
.u-offset-9--s {
margin-left: calc(100% / 12 * 9);
}
.u-offset-10--s {
margin-left: calc(100% / 12 * 10);
}
.u-offset-11--s {
margin-left: calc(100% / 12 * 11);
}
}
/* Medium Breakpoint [48em = 768px]
=========================================== */
@media screen and (min-width: 48em) {
.u-width-1--m {
flex-basis: calc(100% / 12 * 1);
max-width: calc(100% / 12 * 1);
}
.u-width-2--m {
flex-basis: calc(100% / 12 * 2);
max-width: calc(100% / 12 * 2);
}
.u-width-3--m {
flex-basis: calc(100% / 12 * 3);
max-width: calc(100% / 12 * 3);
}
.u-width-4--m {
flex-basis: calc(100% / 12 * 4);
max-width: calc(100% / 12 * 4);
}
.u-width-5--m {
flex-basis: calc(100% / 12 * 5);
max-width: calc(100% / 12 * 5);
}
.u-width-6--m {
flex-basis: calc(100% / 12 * 6);
max-width: calc(100% / 12 * 6);
}
.u-width-7--m {
flex-basis: calc(100% / 12 * 7);
max-width: calc(100% / 12 * 7);
}
.u-width-8--m {
flex-basis: calc(100% / 12 * 8);
max-width: calc(100% / 12 * 8);
}
.u-width-9--m {
flex-basis: calc(100% / 12 * 9);
max-width: calc(100% / 12 * 9);
}
.u-width-10--m {
flex-basis: calc(100% / 12 * 10);
max-width: calc(100% / 12 * 10);
}
.u-width-11--m {
flex-basis: calc(100% / 12 * 11);
max-width: calc(100% / 12 * 11);
}
.u-width-12--m {
flex-basis: calc(100% / 12 * 12);
max-width: calc(100% / 12 * 12);
}
/**
* Offset size modifiers.
*/
.u-offset-1--m {
margin-left: calc(100% / 12 * 1);
}
.u-offset-2--m {
margin-left: calc(100% / 12 * 2);
}
.u-offset-3--m {
margin-left: calc(100% / 12 * 3);
}
.u-offset-4--m {
margin-left: calc(100% / 12 * 4);
}
.u-offset-5--m {
margin-left: calc(100% / 12 * 5);
}
.u-offset-6--m {
margin-left: calc(100% / 12 * 6);
}
.u-offset-7--m {
margin-left: calc(100% / 12 * 7);
}
.u-offset-8--m {
margin-left: calc(100% / 12 * 8);
}
.u-offset-9--m {
margin-left: calc(100% / 12 * 9);
}
.u-offset-10--m {
margin-left: calc(100% / 12 * 10);
}
.u-offset-11--m {
margin-left: calc(100% / 12 * 11);
}
}
/* Large Breakpoint [60em = 960px]
=========================================== */
@media screen and (min-width: 60em) {
.u-width-1--l {
flex-basis: calc(100% / 12 * 1);
max-width: calc(100% / 12 * 1);
}
.u-width-2--l {
flex-basis: calc(100% / 12 * 2);
max-width: calc(100% / 12 * 2);
}
.u-width-3--l {
flex-basis: calc(100% / 12 * 3);
max-width: calc(100% / 12 * 3);
}
.u-width-4--l {
flex-basis: calc(100% / 12 * 4);
max-width: calc(100% / 12 * 4);
}
.u-width-5--l {
flex-basis: calc(100% / 12 * 5);
max-width: calc(100% / 12 * 5);
}
.u-width-6--l {
flex-basis: calc(100% / 12 * 6);
max-width: calc(100% / 12 * 6);
}
.u-width-7--l {
flex-basis: calc(100% / 12 * 7);
max-width: calc(100% / 12 * 7);
}
.u-width-8--l {
flex-basis: calc(100% / 12 * 8);
max-width: calc(100% / 12 * 8);
}
.u-width-9--l {
flex-basis: calc(100% / 12 * 9);
max-width: calc(100% / 12 * 9);
}
.u-width-10--l {
flex-basis: calc(100% / 12 * 10);
max-width: calc(100% / 12 * 10);
}
.u-width-11--l {
flex-basis: calc(100% / 12 * 11);
max-width: calc(100% / 12 * 11);
}
.u-width-12--l {
flex-basis: calc(100% / 12 * 12);
max-width: calc(100% / 12 * 12);
}
/**
* Offset size modifiers.
*/
.u-offset-1--l {
margin-left: calc(100% / 12 * 1);
}
.u-offset-2--l {
margin-left: calc(100% / 12 * 2);
}
.u-offset-3--l {
margin-left: calc(100% / 12 * 3);
}
.u-offset-4--l {
margin-left: calc(100% / 12 * 4);
}
.u-offset-5--l {
margin-left: calc(100% / 12 * 5);
}
.u-offset-6--l {
margin-left: calc(100% / 12 * 6);
}
.u-offset-7--l {
margin-left: calc(100% / 12 * 7);
}
.u-offset-8--l {
margin-left: calc(100% / 12 * 8);
}
.u-offset-9--l {
margin-left: calc(100% / 12 * 9);
}
.u-offset-10--l {
margin-left: calc(100% / 12 * 10);
}
.u-offset-11--l {
margin-left: calc(100% / 12 * 11);
}
}
/* Extra-Large Breakpoint [75em = 1200px]
=========================================== */
@media screen and (min-width: 75em) {
.u-width-1--xl {
flex-basis: calc(100% / 12 * 1);
max-width: calc(100% / 12 * 1);
}
.u-width-2--xl {
flex-basis: calc(100% / 12 * 2);
max-width: calc(100% / 12 * 2);
}
.u-width-3--xl {
flex-basis: calc(100% / 12 * 3);
max-width: calc(100% / 12 * 3);
}
.u-width-4--xl {
flex-basis: calc(100% / 12 * 4);
max-width: calc(100% / 12 * 4);
}
.u-width-5--xl {
flex-basis: calc(100% / 12 * 5);
max-width: calc(100% / 12 * 5);
}
.u-width-6--xl {
flex-basis: calc(100% / 12 * 6);
max-width: calc(100% / 12 * 6);
}
.u-width-7--xl {
flex-basis: calc(100% / 12 * 7);
max-width: calc(100% / 12 * 7);
}
.u-width-8--xl {
flex-basis: calc(100% / 12 * 8);
max-width: calc(100% / 12 * 8);
}
.u-width-9--xl {
flex-basis: calc(100% / 12 * 9);
max-width: calc(100% / 12 * 9);
}
.u-width-10--xl {
flex-basis: calc(100% / 12 * 10);
max-width: calc(100% / 12 * 10);
}
.u-width-11--xl {
flex-basis: calc(100% / 12 * 11);
max-width: calc(100% / 12 * 11);
}
.u-width-12--xl {
flex-basis: calc(100% / 12 * 12);
max-width: calc(100% / 12 * 12);
}
/**
* Offset size modifiers.
*/
.u-offset-1--xl {
margin-left: calc(100% / 12 * 1);
}
.u-offset-2--xl {
margin-left: calc(100% / 12 * 2);
}
.u-offset-3--xl {
margin-left: calc(100% / 12 * 3);
}
.u-offset-4--xl {
margin-left: calc(100% / 12 * 4);
}
.u-offset-5--xl {
margin-left: calc(100% / 12 * 5);
}
.u-offset-6--xl {
margin-left: calc(100% / 12 * 6);
}
.u-offset-7--xl {
margin-left: calc(100% / 12 * 7);
}
.u-offset-8--xl {
margin-left: calc(100% / 12 * 8);
}
.u-offset-9--xl {
margin-left: calc(100% / 12 * 9);
}
.u-offset-10--xl {
margin-left: calc(100% / 12 * 10);
}
.u-offset-11--xl {
margin-left: calc(100% / 12 * 11);
}
}
/* Wide-Screen Breakpoint [90em = 1440px]
=========================================== */
@media screen and (min-width: 90em) {
.u-width-1--w {
flex-basis: calc(100% / 12 * 1);
max-width: calc(100% / 12 * 1);
}
.u-width-2--w {
flex-basis: calc(100% / 12 * 2);
max-width: calc(100% / 12 * 2);
}
.u-width-3--w {
flex-basis: calc(100% / 12 * 3);
max-width: calc(100% / 12 * 3);
}
.u-width-4--w {
flex-basis: calc(100% / 12 * 4);
max-width: calc(100% / 12 * 4);
}
.u-width-5--w {
flex-basis: calc(100% / 12 * 5);
max-width: calc(100% / 12 * 5);
}
.u-width-6--w {
flex-basis: calc(100% / 12 * 6);
max-width: calc(100% / 12 * 6);
}
.u-width-7--w {
flex-basis: calc(100% / 12 * 7);
max-width: calc(100% / 12 * 7);
}
.u-width-8--w {
flex-basis: calc(100% / 12 * 8);
max-width: calc(100% / 12 * 8);
}
.u-width-9--w {
flex-basis: calc(100% / 12 * 9);
max-width: calc(100% / 12 * 9);
}
.u-width-10--w {
flex-basis: calc(100% / 12 * 10);
max-width: calc(100% / 12 * 10);
}
.u-width-11--w {
flex-basis: calc(100% / 12 * 11);
max-width: calc(100% / 12 * 11);
}
.u-width-12--w {
flex-basis: calc(100% / 12 * 12);
max-width: calc(100% / 12 * 12);
}
/**
* Offset size modifiers.
*/
.u-offset-1--w {
margin-left: calc(100% / 12 * 1);
}
.u-offset-2--w {
margin-left: calc(100% / 12 * 2);
}
.u-offset-3--w {
margin-left: calc(100% / 12 * 3);
}
.u-offset-4--w {
margin-left: calc(100% / 12 * 4);
}
.u-offset-5--w {
margin-left: calc(100% / 12 * 5);
}
.u-offset-6--w {
margin-left: calc(100% / 12 * 6);
}
.u-offset-7--w {
margin-left: calc(100% / 12 * 7);
}
.u-offset-8--w {
margin-left: calc(100% / 12 * 8);
}
.u-offset-9--w {
margin-left: calc(100% / 12 * 9);
}
.u-offset-10--w {
margin-left: calc(100% / 12 * 10);
}
.u-offset-11--w {
margin-left: calc(100% / 12 * 11);
}
}
/* ==========================================================================
UTILITIES / Z-INDEX
========================================================================== */
/**
* Utility classes to set display relevance on the 'Z' axis.
*/
.u-below-content {
z-index: -1;
}
.u-over-content {
z-index: 100;
}
.u-over-control {
z-index: 200;
}
.u-over-page {
z-index: 300;
}
.u-over-screen {
z-index: 400;
}
.u-over-everything {
z-index: 500;
}
/* ==========================================================================
EXTENSIONS / BREADCRUMBS / COLLAPSING BREADCRUMBS
========================================================================== */
.x-collapsing-breadcrumbs__group,
.x-collapsing-breadcrumbs__list {
padding-left: 1rem;
font-size: 0.875rem;
line-height: 3;
}
.x-collapsing-breadcrumbs__group {
margin-bottom: 0;
border-bottom: 0 none;
}
.x-collapsing-breadcrumbs__list {
border-bottom: 1px solid #c0c0c0;
}
.x-collapsing-breadcrumbs__button {
padding-top: 0;
padding-bottom: 0;
font-size: 1rem;
}
.x-collapsing-breadcrumbs__list .o-list-inline__item:not(:last-child) {
margin-right: 1em;
}
.x-collapsing-breadcrumbs .o-list-inline__item:not(:last-of-type)::after {
display: inline-block;
position: relative;
right: -0.5em;
content: '/';
}
/* ==========================================================================
EXTENSIONS / CATEGORY TREE / CATEGORY TREE
========================================================================== */
.x-category-tree {
margin-bottom: 16px;
position: relative;
}
.x-category-tree__trigger {
display: none;
}
.x-category-tree__trigger:checked ~ .x-category-tree__row,
.x-category-tree__trigger:checked ~ .x-category-tree__row .x-category-tree__row {
display: block;
}
.x-category-tree__label {
display: block;
min-height: 2em;
margin: 0;
padding: 1em;
position: relative;
font-style: normal;
background-color: #3d70b2;
color: #fff;
}
.x-category-tree__label::after,
.x-category-tree__label::before {
position: absolute;
right: 1em;
transition: 0.4s cubic-bezier(0.2, 0.6, 0.3, 1.1);
}
.x-category-tree__label::after {
content: "\2212";
opacity: 0;
transform: scale(0);
}
.x-category-tree__label::before {
content: "\2261";
opacity: 1;
transform: scale(2);
}
.x-category-tree__trigger:checked ~ .x-category-tree__label::after {
opacity: 1;
transform: scale(2);
}
.x-category-tree__trigger:checked ~ .x-category-tree__label::before {
opacity: 0;
transform: scale(0);
}
.x-category-tree__title {
display: none;
}
.x-category-tree__row {
display: none;
width: 100%;
margin: 0;
padding: 0;
list-style: none;
}
.x-category-tree__link {
display: block;
padding: 0.5em 1em;
color: #0f0f0f;
}
.x-category-tree__link:hover {
text-decoration: none;
}
.x-category-tree__list--level-2 .x-category-tree__link {
padding-left: 2em;
}
.x-category-tree__list--level-3 .x-category-tree__link {
padding-left: 3em;
}
.x-category-tree__link--current {
font-weight: 700;
}
@media (min-width: 60em) {
.x-category-tree__label {
display: none;
}
.x-category-tree__title {
display: block;
}
.x-category-tree__heading {
padding-top: 1.125rem;
}
.x-category-tree__row,
.x-category-tree__trigger:checked ~ .x-category-tree__row,
.x-category-tree__trigger:checked ~ .x-category-tree__row .x-category-tree__row {
display: block;
}
.x-category-tree__link:not(.x-category-tree__link--current):hover {
text-decoration: none;
background-color: #eaeaea;
transition: background-color ease-in 0.3s 0.05s;
}
}
/**
* This section contains the necessary styles when using the built-in search
* faceting ability of Miva. Since the functional code is generated at run-time,
* these styles do not conform to the tenants used in the rest of the framework.
*/
.mm_facet_rangeslider {
display: block;
height: 2em;
margin: 0.25em;
position: relative;
}
.mm_facet_rangeslider_input_container_low,
.mm_facet_rangeslider_input_container_high {
width: 4em;
height: 2em;
position: absolute;
top: 0;
text-align: center;
border: 1px solid #c0c0c0;
}
.mm_facet_rangeslider_input_container_low {
left: 0;
border-radius: 0.25em 0 0 0.25em;
}
.mm_facet_rangeslider_input_container_high {
right: 0;
border-radius: 0 0.25em 0.25em 0;
}
.mm_facet_rangeslider_input_container_low.mm_facet_rangeslider_input_active,
.mm_facet_rangeslider_input_container_high.mm_facet_rangeslider_input_active {
border-color: #3d70b2;
}
.mm_facet_rangeslider_input {}
.mm_facet_rangeslider_track_container {
height: 2em;
position: absolute;
top: 0;
right: 4em;
left: 4em;
border-top: 1px solid #c0c0c0;
border-bottom: 1px solid #c0c0c0;
box-sizing: border-box;
-webkit-touch-callout: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.mm_facet_rangeslider_track {
height: 0.25em;
position: absolute;
top: 50%;
right: 0.25em;
left: 0.25em;
transform: translateY(-50%);
}
.mm_facet_rangeslider_track_background,
.mm_facet_rangeslider_track_selection {
position: absolute;
top: 0;
right: 0.5em;
bottom: 0;
left: 0.5em;
background: #c0c0c0;
}
.mm_facet_rangeslider_track_selection {
background: #3d70b2;
}
.mm_facet_rangeslider_track_handle_low,
.mm_facet_rangeslider_track_handle_high {
width: 2em;
height: 2em;
position: absolute;
top: 50%;
left: -0.5em;
background: #fff;
border: 1px solid #c0c0c0;
border-radius: 50%;
cursor: pointer;
transform: translateY(-50%);
}
.mm_facet_rangeslider.mm_facet_rangeslider_mini {
height: 6em;
margin: 0;
}
.mm_facet_rangeslider.mm_facet_rangeslider_mini .mm_facet_rangeslider_input_container_low {
width: 50%;
border-radius: 0.25em 0 0 0;
}
.mm_facet_rangeslider.mm_facet_rangeslider_mini .mm_facet_rangeslider_input_container_high {
width: 50%;
border-radius: 0 0.25em 0 0;
border-left: none;
}
.mm_facet_rangeslider.mm_facet_rangeslider_mini .mm_facet_rangeslider_track_container {
height: 3em;
top: 2em;
right: 0;
left: 0;
border: 1px solid #c0c0c0;
border-top: none;
border-radius: 0 0 0.25em 0.25em;
}
.mm_facet_rangeslider.mm_facet_rangeslider_mini .mm_facet_rangeslider_input_container_low.mm_facet_rangeslider_input_active,
.mm_facet_rangeslider.mm_facet_rangeslider_mini .mm_facet_rangeslider_input_container_high.mm_facet_rangeslider_input_active {
border-color: #eaeaea;
box-shadow: inset 2px 2px 5px rgba(0, 0, 0, 0.15);
}
/* ==========================================================================
EXTENSIONS / DISPLAY LIST FILTERING / DISPLAY LIST FILTERING
========================================================================== */
/**
* Display list filtering is for use in product list filtering as well as any
* place a batch list or sortable data is used.
*/
.x-display-list-filtering {
display: flex;
flex-wrap: wrap;
}
.x-display-list-filtering__per-page {
margin-right: calc(16px * 2);
}
/* ==========================================================================
EXTENSIONS / HERO
========================================================================== */
/**
* The Hero component provides a dominant piece of media to a page
*
* 1. Allows for absolute positioning of borders and content.
* 2. Hero images set via background-image should cover and center.
*/
.x-hero {
display: block;
position: relative; /* [1] */
background-position: center; /* [2] */
background-size: cover; /* [2] */
}
/**
* The caption overlays at the bottom of a Hero, providing space for additional
* content such as titles or logos.
*/
.x-hero__caption {
position: absolute;
bottom: 0;
padding: 16px 0;
width: 100%;
text-shadow: 0 0 25px rgba(15, 15, 15, 0.25), 1px 1px 1px rgba(15, 15, 15, 0.5);
}
/**
* Hero video needs to be set to `display: block` to avoid spacing issues.
*/
.x-hero__video {
display: block;
width: 100%;
height: 100%;
object-fit: fill;
}
/**
* Hero link inherits the Hero `color` to override anchor element styles.
*/
.x-hero__link {
color: inherit;
}
/**
* As we cannot set a border property over video, borders are implemented
* using pseudo-elements.
*/
.x-hero--borders::before {
display: block;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
border: calc(16px / 4) solid rgba(255, 255, 255, 0.3);
content: "";
}
/**
* Make any other content below the Hero overlap upwards.
*/
.x-hero--overlap {
margin-bottom: calc(0px - 10vh);
}
/**
* If hero has overlap modifier, shift caption upwards to compensate.
*/
.x-hero--overlap .x-hero__caption {
bottom: 10vh;
}
.storefront-hero-image figcaption h2 {
/* font-size: 46px;
font-weight: 600;
line-height: 45px; */
font-size: 35px;
font-weight: 600;
line-height: 45px;
margin-bottom: 10px;
}
.hero-right-art .buy-a-kit{
flex-grow: 1;
}
.storefront-hero-image {
padding-top: 19px;
padding-bottom: 37px;
/* max-width: 88rem; */
}
.storefront-hero-image figcaption{
position: absolute;
color: #ffffff;
text-align: center;
width: 100%;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
padding: 0 20px;
}
.storefront-hero-image img {
width: 100%;
}
.storefront-hero-image figure{
padding:0;
margin:0;
position: relative;
}
.storefront-hero-image figcaption h3{
font-size: 46px;
font-weight: 600;
line-height: 45px;
}
.storefront-hero-image figcaption p{
/* font-size:20px; */
/* line-height:22px; */
/* margin-bottom: 32px; */
font-size: 19px;
line-height: 22px;
margin-bottom: 32px;
}
.hero-right-art figure{
margin-top:10px;
}
.storefront-hero-image figcaption .c-button{
padding: calc(0.4em * 2 - 3px) calc(1.076em * 2 - 10px)
}
@media(min-width:48em){
.hero-right-art {
display: flex;
flex-direction: column;
padding-left: 24px;
}
.storefront-hero-image .visualize{
padding: 0 6px 0 0;
}
.storefront-hero-image figure{
padding:0 8px 0 0;
margin:0;
}
}
/**
* home page slider.
*/
.hero-slider .c-heading-alpha{
line-height: 1.05;
margin-bottom: 0.53em;
font-size: calc((8px * 2) * 1.563);
}
.storefront-hero__caption{
margin-top:10%;
padding: 0 20px;
}
.storefront-hero__image {
margin-bottom: 0;
position: relative;
}
.storefront-hero__caption .c-button--large{
font-size: 1.25em;
}
@media (max-width:767px){
.storefront-hero__caption br{
display:none;
}
#storefront_project{
padding-bottom: calc(1.5em * 2 - 9px);
}
.storefront-hero-image figcaption h2{
font-size: 34px;
line-height: 34px;
margin: 0;
}
}
@media (min-width: 60em) {
.hero-slider .c-heading-alpha{
font-size: calc((13px * 2) * 1.563);
}
}
@media screen and (min-width: 48em) {
.storefront-hero__caption .c-heading--subheading {
padding-bottom: 1.97rem;
display: inline-block;
}
.hero-slider .c-heading-alpha{
font-size: calc((9px * 2) * 1.563);
}
.storefront-hero__caption {
width: 100%;
margin: auto;
position: absolute;
top: 50%;
font-style: normal;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.hero-right-art figure{
margin-top:0;
padding-right: 0;
}
}
@media screen and (min-width: 75em) {
.hero-slider .c-heading-alpha{
font-size: calc((16px * 2) * 1.563);
}
}
@media (max-width:60em){
.storefront-hero-image figcaption h3{
font-size: 27px;
line-height: 27px;
margin-bottom: 5px;
}
.storefront-hero-image figcaption p{
font-size: 15px;
line-height: 22px;
margin-bottom: 12px;
}
.storefront-hero-image figcaption .c-button {
padding: calc(0.4em * 2 - 5px) calc(1.076em * 2 - 19px);
}
.storefront-hero-image figcaption p br{
display:none;
}
}
@media (max-width:48em){
.storefront-hero-image figcaption h2{
font-size: 22px;
line-height: 29px;
margin-bottom: 0;
}
.storefront-hero-image figcaption p{
font-size: 14px;
margin-bottom: 12px;
margin-bottom: 12px;
}
}
/* ==========================================================================
EXTENSIONS / MESSAGES
========================================================================== */
/**
* Messages are block elements used to display information to the visitor about
* their current session. Typically these are informational or error messages
* such as you would see on a checkout page if there was an error with the
* credit card used.
*/
.x-messages {
margin-bottom: 1em;
padding: 0.5em 1em;
background-color: #eaeaea;
border: 1px solid currentColor;
}
/**
* This is a hold-over for some Miva message elements and modules which place a
* `br` tag as the first element of the messaging block.
*/
.x-messages br:first-child {
display: none;
}
.x-messages *:last-child {
margin-bottom: 0;
}
.x-messages--borderless {
border: 0 none;
}
.x-messages--error {
background-color: #fee8eb;
color: #c8102e;
}
.x-messages--info {
background-color: #eaefed;
color: #003b6f;
}
.x-messages--success {
background-color: #eaf4ef;
color: #009a44;
}
.x-messages--warning {
background-color: #ffffe5;
border-color: #f9ed1f;
}
/**
* These classes will help format the message if you are adding an icon.
*/
.x-messages--with-icon {
display: flex;
align-items: center;
justify-content: space-between;
}
.x-messages__icon {
font-size: 3rem;
}
.x-messages__close {
position: absolute;
top: 50%;
right: 0.25rem;
margin-top: -1rem;
color: #333;
font-size: 2rem;
line-height: 1;
text-decoration: none;
opacity: 0.3;
}
/*
what??? they have an old browser?
This can be removed if you do not need to alert for IE < 9.
*/
.x-messages--update-browser {
width: 100%;
position: relative;
text-align: center;
}
/* ==========================================================================
EXTENSIONS / PAGINATION
========================================================================== */
/**
* Pagination is for use in product list as well as any place a pageable batch
* list or data is used.
*/
.x-pagination {
display: flex;
max-width: 19rem;
margin: 0;
align-items: center;
}
.x-pagination--centered {
margin: auto;
}
.x-pagination--right {
margin-left: auto;
}
/* ==========================================================================
EXTENSIONS / PRODUCT LAYOUT / PRODUCT LAYOUT
========================================================================== */
/**
* This is the default product layout for the product page.
*/
.x-product-layout {}
.x-product-layout-images {
margin-left: 0;
margin-right: 0;
}
.x-product-layout-images__image {
display: inline-block;
margin-bottom: calc(16px * 1.5);
}
.x-product-layout-images__thumbnail-list {}
.x-product-layout-images__thumbnail-image {
margin-bottom: 16px;
}
.x-product-layout-purchase {}
.x-product-layout-purchase__pricing-original {
padding-right: calc(16px * 1.5);
}
.x-product-layout-purchase__options-attribute .c-form-label {
font-size: 0.875rem;
}
/* ==========================================================================
EXTENSIONS / PRODUCT LISTS / PRODUCT LISTS
========================================================================== */
/**
* Product lists are used in many spots throughout the store. They can be found
* on the storefront as featured product, the related products section of a
* product page, as an auto-suggest feature during checkout, or wherever.
*/
.x-product-list {
margin-bottom: 16px;
}
.x-product-list__heading {
margin-bottom: 2em;
}
.x-product-list__item {
margin-bottom: 16px;
}
.x-product-list__link {
color: #404146;
transition: ease-in-out 0.3s;
}
.x-product-list__link:hover {
/* color: #9f9f9f; */
text-decoration: none;
}
.x-product-list__figure {
margin: 0;
position:relative;
}
.x-product-list__name,
.x-product-list__price {
display: block;
}
.x-product-list__image {
display: inline-block;
margin-bottom: 16px;
}
.x-product-list__price {
font-size: 1.0625rem;
font-weight:600;
}
.x-product-list__action {
padding-top: 16px;
}
/**
* If you are creating a product carousel, add this class to the element.
*/
.x-product-list--carousel {}
.x-product-list--carousel .x-product-list__item {
margin-bottom: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
}
/* ==========================================================================
EXTENSIONS / SEARCH-PREVIEW / SEARCH-PREVIEW
========================================================================== */
.wpresult.x-search-preview__entry .x-search-preview__image img {
margin: 0;
}
a.wpresult_anchor {
display: flex;
}
.x-search-preview {
display: none;
width: 100%;
padding: 0.75rem 0.5rem;
position: absolute;
background-color: #fff;
box-shadow: 0 2px 4px 1px rgba(0, 0, 0, 0.25);
opacity: 0;
transition: opacity ease-in-out 0.5s;
z-index: 500;
}
.x-search-preview--open {
opacity: 1;
}
.x-search-preview__entry {
display: block;
}
.x-search-preview__list {
padding: 0 0.5rem;
}
.x-search-preview__line {
display: flex;
padding: 0.5rem 0;
position: relative;
align-items: center;
font-size: 0.875rem;
border-bottom: 1px solid #eaeaea;
cursor: pointer;
}
.x-search-preview__image {
width: 4rem;
height: 4rem;
margin: 0 1em 0 0;
overflow: hidden;
text-align: center;
}
.x-search-preview__item {
display: flex;
flex: 1;
justify-content: space-between;
text-decoration: none;
}
.x-search-preview__search-all {
padding: 0.5rem;
font-style: italic;
cursor: pointer;
}
/**
* This section contains the necessary styles when using the built-in search
* preview ability of Miva. Since the functional code is generated at run-time,
* these styles do not conform to the tenants used in the rest of the framework.
*/
.mm_searchfield_menuitem_selected {
background-color: #eaeaea;
}
/* ==========================================================================
EXTENSIONS / SUBSCRIPTIONS / SUBSCRIPTIONS
========================================================================== */
/**
* When using the subscription function of Miva, this is the default styling
* used for the date picker. You can update the styles in your theme file if
* you are looking to make changes.
*/
.miva_datepicker {
display: none;
position: absolute;
padding: 16px;
background: #fff;
border: 1px solid #9f9f9f;
z-index: 1000;
}
.miva_datepicker_calendar_container {
display: inline-block;
width: 214px;
position: relative;
vertical-align: top;
-webkit-touch-callout: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.miva_datepicker_calendar_month_selector {
display: flex;
align-items: center;
position: relative;
background: #707070;
}
.miva_datepicker_calendar_month_selector_next,
.miva_datepicker_calendar_month_selector_prev {
width: 35px;
height: 35px;
background: 0 -35px no-repeat;
cursor: pointer;
}
.miva_datepicker_calendar_month_selector_next:hover,
.miva_datepicker_calendar_month_selector_prev:hover {
background-color: #222;
}
.miva_datepicker_calendar_month_selector_title {
flex-grow: 1;
color: #fff;
text-align: center;
}
.miva_datepicker_calendar_month_selector_title_month {
display: inline-block;
}
.miva_datepicker_calendar_month_selector_title_year {
display: inline-block;
margin-left: 0.25em;
}
.miva_datepicker_cancel {
display: inline-block;
margin-top: 0.75em;
}
.miva_datepicker_calendar_weekday_container {
height: 34px;
margin: 2px;
position: relative;
}
.miva_datepicker_calendar_weekday_title {
display: inline-block;
width: 28px;
padding: 3px 0;
position: absolute;
font-weight: 700;
text-align: center;
}
#miva_datepicker_calendar_week_container {
margin: 2px;
position: relative;
}
.miva_datepicker_calendar_week {
display: block;
height: 30px;
position: relative;
}
.miva_datepicker_calendar_day {
display: inline-flex;
align-items: center;
justify-content: center;
width: 26px;
position: absolute;
top: 1px;
bottom: 1px;
font-size: 0.75em;
border: 1px solid #9f9f9f;
cursor: pointer;
}
.miva_datepicker_calendar_day:hover {
background: #707070;
border-color: #222;
color: #fff;
}
.miva_datepicker_calendar_day_noselect,
.miva_datepicker_calendar_day_noselect:hover {
background: #c0c0c0;
border-color: #222;
color: #222;
}
.miva_datepicker_calendar_day_current {
border-color: #222;
color: #222;
font-weight: 700;
}
.miva_datepicker_calendar_day_current:hover {
background: #222;
color: #fff;
}
.miva_datepicker_calendar_day_active {
background: #222;
border-color: #707070;
color: #fff;
font-weight: 700;
}
.miva_datepicker_calendar_day_0 {
left: 1px;
}
.miva_datepicker_calendar_day_1 {
left: 31px;
}
.miva_datepicker_calendar_day_2 {
left: 61px;
}
.miva_datepicker_calendar_day_3 {
left: 91px;
}
.miva_datepicker_calendar_day_4 {
left: 121px;
}
.miva_datepicker_calendar_day_5 {
left: 151px;
}
.miva_datepicker_calendar_day_6 {
left: 181px;
}
/* ==========================================================================
EXTENSIONS / MINI-BASKET / MINI-BASKET
========================================================================== */
/**
* This is an extension to use the mini-basket functionality of Miva in an
* off-canvas method.
*/
.x-mini-basket {
display: flex;
justify-content: flex-end;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-color: rgba(0, 0, 0, 0.5);
transform: scaleX(0);
transform-origin: right;
transition: all ease-in-out 0.2s;
z-index: 500;
opacity: 0;
}
.x-mini-basket--open {
opacity: 1;
transform: scaleX(1);
}
.x-mini-basket__content {
display: flex;
flex: 1 1 100%;
flex-direction: column;
width: 100vw;
max-width: 30rem;
padding: 1rem;
}
.x-mini-basket__header {
display: flex;
justify-content: space-between;
}
.x-mini-basket__list {
overflow-y: auto;
}
.x-mini-basket__line {
display: flex;
margin-bottom: 2em;
font-size: 0.875rem;
flex-wrap: wrap;
}
.x-mini-basket__image {
width: 5rem;
height: 5rem;
margin: 0 1em 0 0;
overflow: hidden;
text-align: center;
}
.x-mini-basket__item {
display: flex;
flex: 1 1 auto;
flex-direction: column;
justify-content: space-between;
text-decoration: none;
max-width: 70%;
}
.x-mini-basket__item:hover {
text-decoration: none;
}
.x-mini-basket__item-name {
display: block;
margin-bottom: 1em;
}
.x-mini-basket__subscription {
flex-basis: 100%;
}
.x-mini-basket__item-total {
display: flex;
align-items: center;
justify-content: space-between;
}
.x-mini-basket__item-total hr {
margin: 0 0.75em;
flex-grow: 1;
}
.x-mini-basket__footer {
}
.x-mini-basket__charges,
.x-mini-basket__total,
.x-mini-basket__cta {
display: flex;
flex-grow: 1;
justify-content: space-between;
}
.x-mini-basket__charges {
flex-direction: column;
margin-bottom: 1em;
font-size: 0.875rem;
}
.x-mini-basket__charge-item {
display: flex;
justify-content: space-between;
}
.x-mini-basket__total {
margin-bottom: 1em;
}
.x-mini-basket__cta {
font-size: 0.875rem;
}
/* ==========================================================================
EXTENSIONS / QUANTIFY / QUANTIFY
========================================================================== */
/**
* This extension allows for the use of buttons to increase/decrease item
* quantities on the product and basket pages. When used on the basket page,
* the decrease button becomes a remove button if the quantity is 1.
*/
.x-quantify {}
.x-quantify .c-control-group__button {
border-color: #c0c0c0;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.x-quantify .c-control-group__field {
height: auto;
border-left-width: 0;
}
/* ==========================================================================
EXTENSIONS / TABS / FLEX-TABS
========================================================================== */
/**
* This extension allows for creating tabbed content which converts to an
* accordion layout on smaller devices/screens.
*/
.x-flex-tabs {
display: flex;
flex-wrap: wrap;
margin-bottom: 1rem;
}
input[data-flex-tab] {
display: none;
visibility: hidden;
}
.x-flex-tabs__tab {
width: 100%;
border-bottom: 0.125rem solid transparent;
cursor: pointer;
}
@media (min-width: 64em) {
.x-flex-tabs:not(.x-flex-tabs--accordion) .x-flex-tabs__tab {
/* let tabs scale to fit multiple on each row */
width: auto;
/* shift all tabs to appear before content */
order: -1;
}
.x-flex-tabs:not(.x-flex-tabs--accordion) .x-flex-tabs__tab:not(:first-of-type) {
margin-left: 2em;
}
}
.x-flex-tabs__content {
width: 100%;
height: 0;
overflow: hidden;
opacity: 0;
-webkit-transform: scaleY(0);
-ms-transform: scaleY(0);
transform: scaleY(0);
transform-origin: top;
transition: opacity 0.3s ease-out;
}
input[data-flex-tab]:checked + .x-flex-tabs__tab {
font-weight: 700;
border-color: currentColor;
}
input[data-flex-tab]:checked + .x-flex-tabs__tab + .x-flex-tabs__content {
height: auto;
padding-top: 1em;
padding-bottom: 1em;
overflow-y: auto;
opacity: 1;
-webkit-transform: scaleY(1);
-ms-transform: scaleY(1);
transform: scaleY(1);
transition: opacity 0.3s ease-in;
border: 1px solid #dddddd;
padding: 20px;
margin-top: 20px;
}
/* ==========================================================================
EXTENSIONS / NAVIGATION / TRANSFIGURE NAVIGATION
========================================================================== */
@media screen and ( max-width: 59.9em ) {
.has-open-main-menu,
.has-open-main-menu body {
overflow: hidden;
}
.x-transfigure-navigation {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
background-color: rgba(0, 0, 0, 0);
bottom: 0;
left: -100vw;
opacity: 0;
overflow: hidden;
padding: 0;
position: fixed;
right: 0;
top: 0;
-webkit-transform: scaleX(0);
-ms-transform: scaleX(0);
transform: scaleX(0);
transform-origin: left;
transition: all ease-out 0.2s;
z-index: -1;
}
.x-transfigure-navigation.is-open {
background: rgba(0, 0, 0, 0.65);
left: 0;
opacity: 1;
-webkit-transform: scaleX(1);
-ms-transform: scaleX(1);
transform: scaleX(1);
transition: all ease-in 0.2s;
z-index: 99;
}
.x-transfigure-navigation__wrap {
background-color: #FFF;
max-width: 22.5rem;
min-height: 100%;
-webkit-overflow-scrolling: touch;
overflow-x: hidden;
overflow-y: auto;
}
.x-transfigure-navigation__header .c-button {
padding: 0.5rem calc(1em - 1px);
}
.x-transfigure-navigation__content {
position: relative;
}
.x-transfigure-navigation__row,
.x-transfigure-navigation__row .c-navigation__row,
.x-transfigure-navigation__row .c-navigation__row:nth-child(2) .c-navigation__row:last-of-type {
background-color: #FFF;
display: block;
left: 0;
list-style: none;
min-height: 100%;
position: absolute;
top: 0;
transition: transform 0.3s;
width: 100%;
}
.x-transfigure-navigation .c-navigation__list {
position: static;
}
.x-transfigure-navigation .c-navigation__list:hover> .c-navigation__row {
box-shadow: none;
display: block;
}
.x-transfigure-navigation .c-navigation__link {
align-items: center;
/* justify-content: space-between; */
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
border: 0 solid #D3D3D3;
border-top-width: 1px;
display: flex;
height: 3rem;
overflow: hidden;
padding: 0 0 0 1rem;
text-overflow: ellipsis;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
transition: all 0.3s;
white-space: nowrap;
}
.x-transfigure-navigation .c-navigation__list:first-child .c-navigation__link {
/* background-color: #1c55a6; */
/* color: #ffffff; */
}
.x-transfigure-navigation .c-navigation__row:nth-child(2) .c-navigation__link,
.x-transfigure-navigation .c-navigation__row:nth-child(2) .c-navigation__row:last-of-type .c-navigation__link {
padding-left: 1rem;
}
.x-transfigure-navigation__row .c-navigation__list:first-of-type> .c-navigation__link,
.x-transfigure-navigation__row .c-navigation__row .c-navigation__list:first-of-type> .c-navigation__link {
/* border-top-width: 0; */
}
.x-transfigure-navigation__row .c-navigation__list:last-of-type> .c-navigation__link,
.x-transfigure-navigation__row .c-navigation__row .c-navigation__list:last-of-type> .c-navigation__link {
border-bottom-width: 1px;
}
.x-transfigure-navigation__row.is-hidden,
.x-transfigure-navigation__row .c-navigation__row.is-hidden {
-webkit-transform: translateX(100%);
-ms-transform: translateX(100%);
transform: translateX(100%);
}
.x-transfigure-navigation__row.is-hidden> .cmp-primary-navigation__title,
.x-transfigure-navigation__row.show-next> .cmp-primary-navigation__title,
.x-transfigure-navigation__row.is-hidden> .c-navigation__list> .c-navigation__link,
.x-transfigure-navigation__row.show-next> .c-navigation__list> .c-navigation__link,
.x-transfigure-navigation__row .c-navigation__row.is-hidden> .c-navigation__list> .c-navigation__link,
.x-transfigure-navigation__row .c-navigation__row.show-next> .c-navigation__list> .c-navigation__link {
opacity: 0;
}
.x-transfigure-navigation__row.show-next> .c-navigation__list> .c-navigation__link,
.x-transfigure-navigation__row .c-navigation__row.show-next> .c-navigation__list> .c-navigation__link {
-webkit-transform: translateX(-100%);
-ms-transform: translateX(-100%);
transform: translateX(-100%);
}
.x-transfigure-navigation .c-navigation__link-carat {
/* display: none; */
position: absolute;
right: 0;
}
.x-transfigure-navigation .has-child-menu .c-navigation__link-carat {
align-self: stretch;
display: inline-flex;
}
.x-transfigure-navigation .c-navigation__link-carat> * {
align-items: center;
display: flex;
font-size: 0.75rem;
justify-content: center;
width: 4rem;
}
.x-transfigure-navigation__footer {
border-top: 1px solid #D3D3D3;
font-size: 0.75rem;
list-style: none;
padding: 1rem;
}
.x-transfigure-navigation__footer-link {
display: block;
font-weight: 500;
line-height: 2;
padding-bottom: 1em;
padding-top: 1em;
}
.u-icon-menu {
text-align: left;
}
}
@media screen and ( min-width: 60em ) {
.x-transfigure-navigation__row .c-navigation__row {
display: none;
position: absolute;
white-space: nowrap;
width: auto;
z-index: 100;
}
.x-transfigure-navigation> .c-navigation__row {
display: flex;
}
.x-transfigure-navigation .c-navigation__link {
align-items: center;
display: flex;
justify-content: space-around;
position: relative;
}
.x-transfigure-navigation__row .c-navigation__row:nth-child(2) .c-navigation__list {
text-align: left;
}
.x-transfigure-navigation__row .c-navigation__row:nth-child(2) .c-navigation__row:last-of-type {
left: 100%;
top: 0;
z-index: 200;
}
.x-transfigure-navigation .c-navigation__row:nth-child(2) .c-navigation__link,
.x-transfigure-navigation .c-navigation__row:nth-child(2) .c-navigation__row:last-of-type .c-navigation__link {
justify-content: space-between;
}
.x-transfigure-navigation .c-navigation__list:hover> .c-navigation__row {
box-shadow: 1px 1px 0.25em 0 rgba(15, 15, 15, 0.5);
display: table;
}
.x-transfigure-navigation__row .is-off-screen .c-navigation__row:nth-child(2) .c-navigation__row {
box-shadow: -1px 1px 0.25em 0 rgba(15, 15, 15, 0.5);
left: auto;
right: 100%;
}
.x-transfigure-navigation__row .c-navigation__row:nth-child(2) .c-navigation__row .c-navigation__link,
.x-transfigure-navigation__row .c-navigation__row:nth-child(2) .c-navigation__row:last-of-type .c-navigation__link {
padding-left: 1em;
}
.x-transfigure-navigation .c-navigation__link-carat {
font-size: 0.5em;
position: relative;
right: 30px;
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
}
.x-transfigure-navigation .c-navigation__row:nth-child(2) .c-navigation__link-carat {
-webkit-transform: rotate(0deg);
-ms-transform: rotate(0deg);
transform: rotate(0deg);
}
}
/* ==========================================================================
EXTENSIONS / CAROUSEL / ROUNDABOUT
========================================================================== */
/**
* The Roundabout extension gives you the ability to create a hero image
* carousel or convert a product list into a carousel of products.
*/
.x-carousel {
display: flex;
flex: 1;
position: relative;
overflow: hidden;
transition: visibility ease-in-out 0.1s;
visibility: hidden;
}
.x-carousel--is-loaded {
visibility: visible;
}
.x-carousel__button {
display: inline-block;
padding: 0;
position: absolute;
top: 50%;
font-size: 1.25rem;
background-color: rgba(255, 255, 255, 0);
border: 0 none;
opacity: 0.25;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
transition: ease-in-out 0.3s;
z-index: 50;
}
.x-carousel__button-right {
right: 0;
}
.x-carousel__button:hover {
background-color: rgba(255, 255, 255, 0.25);
opacity: 1;
}
.x-carousel__container {
display: flex;
width: 100%;
flex: 1 1 auto;
position: relative;
left: -100%;
transform: translate3d(100%, 0, 0);
}
.x-carousel--reverse {
transform: translate3d(-100%, 0, 0);
}
.x-carousel--animate {
transform: none;
transition: all 250ms ease-in-out;
}
.x-carousel__item {
display: flex;
flex: 1 0 100%;
min-width: 100%;
margin: 0;
align-items: flex-start;
}
.x-carousel__item img {
opacity: 1;
transition: opacity 250ms;
/* width:100%; */
}
.x-carousel__item img[data-src] {
opacity: 0;
}
/* ==========================================================================
EXTENSIONS / FACETS / FACETS
========================================================================== */
.x-facet-set {}
.x-facet-set__trigger {
display: none;
}
.x-facet-set__label {
display: flex;
align-items: center;
justify-content: space-between;
padding-bottom: 0.5em;
font-size: 0.875rem;
font-weight: 600;
/* text-transform: uppercase; */
cursor:pointer;
}
.x-facet-set__label::after {
display: inline-block;
font-size: 1rem;
line-height: 1.1;
content: '+';
width: 20px;
height: 20px;
border: 1px solid #707070;
text-align:center;
}
.x-facet-set__list {
display: block;
max-height: 0;
opacity: 0;
visibility: hidden;
transition-delay: 0.15s, 0s, 0s;
}
.x-facet-set__trigger:checked ~ .x-facet-set__label::after {
content: '-';
}
.x-facet-set__trigger:checked ~ .x-facet-set__list {
display: block;
overflow: hidden;
opacity: 1;
transition: visibility 0s ease, max-height 0.3s ease, opacity 0.3s ease;
max-height: 100%;
visibility: visible;
transition-delay: 0s;
}
/* ==========================================================================
EXTENSIONS / FASTEN HEADER / FASTEN HEADER
========================================================================== */
.x-fasten-header {
background-color: #222;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
color: #FFF;
display: flex;
max-width: none;
opacity: 0;
position: fixed;
top: 0;
-webkit-transform: scaleY(0);
transform: scaleY(0);
transform-origin: top;
transition: all ease-in-out 0.15s;
width: 100vw;
z-index: 98; /* Accounting for Mobile Menu */
}
.x-fasten-header.t-site-header__masthead {
padding: 0.5rem 0.5rem 0.5rem !important; /* Had to overwrite other important tags */
}
.x-fasten-header--is-active .x-fasten-header {
opacity: 1;
-webkit-transform: scaleY(1);
transform: scaleY(1);
}
.x-fasten-header__logo-image {
max-height: 3rem;
}
@media ( min-width: 60em ) {
.x-fasten-header.t-site-header__masthead {
padding: 0.5rem 1rem !important; /* Had to overwrite other important tags */
}
}
.slick-slider {
position: relative;
display: block;
box-sizing: border-box;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-touch-callout: none;
-khtml-user-select: none;
-ms-touch-action: pan-y;
touch-action: pan-y;
-webkit-tap-highlight-color: transparent
}
.slick-list {
position: relative;
display: block;
overflow: hidden;
margin: 0;
padding: 0
}
.slick-list:focus {
outline: 0
}
.slick-list.dragging {
cursor: pointer;
cursor: hand
}
.slick-slider .slick-list, .slick-slider .slick-track {
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0)
}
.slick-track {
position: relative;
top: 0;
left: 0;
display: block;
margin-left: auto;
margin-right: auto
}
.slick-track:after, .slick-track:before {
display: table;
content: ''
}
.slick-track:after {
clear: both
}
.slick-loading .slick-track {
visibility: hidden
}
.slick-slide {
display: none;
float: left;
height: 100%;
min-height: 1px
}
[dir=rtl] .slick-slide {
float: right
}
.slick-slide img {
display: block
}
.slick-slide.slick-loading img {
display: none
}
.slick-slide.dragging img {
pointer-events: none
}
.slick-initialized .slick-slide {
display: block
}
.slick-loading .slick-slide {
visibility: hidden
}
.slick-vertical .slick-slide {
display: block;
height: auto;
border: 1px solid transparent
}
.slick-arrow.slick-hidden {
display: none
}
.slick-loading .slick-list {
background: #fff url(/mm5/themes/shadows/extensions/slick/ajax-loader.gif) center center no-repeat
}
@font-face {
font-family: slick;
font-weight: 400;
font-style: normal;
src: url(/mm5/themes/shadows/extensions/slick/fonts/slick.eot);
src: url(/mm5/themes/shadows/extensions/slick/fonts/slick.eot?#iefix) format('embedded-opentype'), url(/mm5/themes/shadows/extensions/slick/fonts/slick.woff) format('woff'), url(/mm5/themes/shadows/extensions/slick/fonts/slick.ttf) format('truetype'), url(/mm5/themes/shadows/extensions/slick/fonts/slick.svg#slick) format('svg')
}
.slick-next, .slick-prev {
font-size: 0;
line-height: 0;
position: absolute;
top: 50%;
display: block;
width: 20px;
height: 20px;
padding: 0;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
transform: translate(0, -50%);
cursor: pointer;
color: transparent;
border: none;
outline: 0;
background: 0 0
}
.slick-next:focus, .slick-next:hover, .slick-prev:focus, .slick-prev:hover {
color: transparent;
outline: 0;
background: 0 0
}
.slick-next:focus:before, .slick-next:hover:before, .slick-prev:focus:before, .slick-prev:hover:before {
opacity: 1
}
.slick-next.slick-disabled:before, .slick-prev.slick-disabled:before {
opacity: .25
}
.slick-next:before, .slick-prev:before {
font-family: slick;
font-size: 20px;
line-height: 1;
opacity: .75;
color: #fff;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
.slick-prev {
left: -25px
}
[dir=rtl] .slick-prev {
right: -25px;
left: auto
}
.slick-prev:before {
content: 'â†'
}
[dir=rtl] .slick-prev:before {
content: '→'
}
.slick-next {
right: -25px
}
[dir=rtl] .slick-next {
right: auto;
left: -25px
}
.slick-next:before {
content: '→'
}
[dir=rtl] .slick-next:before {
content: 'â†'
}
.slick-dotted.slick-slider {
margin-bottom: 30px
}
.slick-dots {
position: absolute;
bottom: -25px;
display: block;
width: 100%;
padding: 0;
margin: 0;
list-style: none;
text-align: center
}
.slick-dots li {
position: relative;
display: inline-block;
width: 20px;
height: 20px;
margin: 0 5px;
padding: 0;
cursor: pointer
}
.slick-dots li button {
font-size: 0;
line-height: 0;
display: block;
width: 20px;
height: 20px;
padding: 5px;
cursor: pointer;
color: transparent;
border: 0;
outline: 0;
background: 0 0
}
.slick-dots li button:focus, .slick-dots li button:hover {
outline: 0
}
.slick-dots li button:focus:before, .slick-dots li button:hover:before {
opacity: 1
}
.slick-dots li button:before {
font-family: slick;
font-size: 6px;
line-height: 20px;
position: absolute;
top: 0;
left: 0;
width: 20px;
height: 20px;
content: '•';
text-align: center;
opacity: .25;
color: #000;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
.slick-dots li.slick-active button:before {
opacity: .75;
color: #000
}/** * Set all your THEME styles in this file. * * Adding a Theme to a design is very straightforward as every component works * like an extensible class. This allows you to add theme specific classes * and/or override existing classes. * * NOTE:Any new classes created should follow the established coding * standards for the framework. Theme specific classes should be prefixed by * `.t-`. * * Why do it this way? * By decoupling the theme styling from the default framework, you get the * following benefits:*Keep the framework core library up-to-date *Updates to the core styles of the framework do not get overwritten when *extending the component. * *End-user entry points remain untouched *End-users do not need to use any custom name that belongs only to the *theme. */
/* cyrillic-ext */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 300;
src: local("Roboto Light"), local("Roboto-Light"), url(/mm5/themes/shadows/ui/fonts/KFOlCnqEu92Fr1MmSU5fCRc4EsA.woff2) format("woff2");
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 300;
src: local("Roboto Light"), local("Roboto-Light"), url(/mm5/themes/shadows/ui/fonts/KFOlCnqEu92Fr1MmSU5fABc4EsA.woff2) format("woff2");
unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 300;
src: local("Roboto Light"), local("Roboto-Light"), url(/mm5/themes/shadows/ui/fonts/KFOlCnqEu92Fr1MmSU5fCBc4EsA.woff2) format("woff2");
unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 300;
src: local("Roboto Light"), local("Roboto-Light"), url(/mm5/themes/shadows/ui/fonts/KFOlCnqEu92Fr1MmSU5fBxc4EsA.woff2) format("woff2");
unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 300;
src: local("Roboto Light"), local("Roboto-Light"), url(/mm5/themes/shadows/ui/fonts/KFOlCnqEu92Fr1MmSU5fCxc4EsA.woff2) format("woff2");
unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 300;
src: local("Roboto Light"), local("Roboto-Light"), url(/mm5/themes/shadows/ui/fonts/KFOlCnqEu92Fr1MmSU5fChc4EsA.woff2) format("woff2");
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 300;
src: local("Roboto Light"), local("Roboto-Light"), url(/mm5/themes/shadows/ui/fonts/KFOlCnqEu92Fr1MmSU5fBBc4.woff2) format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 400;
src: local("Roboto"), local("Roboto-Regular"), url(/mm5/themes/shadows/ui/fonts/KFOmCnqEu92Fr1Mu72xKOzY.woff2) format("woff2");
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 400;
src: local("Roboto"), local("Roboto-Regular"), url(/mm5/themes/shadows/ui/fonts/KFOmCnqEu92Fr1Mu5mxKOzY.woff2) format("woff2");
unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 400;
src: local("Roboto"), local("Roboto-Regular"), url(/mm5/themes/shadows/ui/fonts/KFOmCnqEu92Fr1Mu7mxKOzY.woff2) format("woff2");
unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 400;
src: local("Roboto"), local("Roboto-Regular"), url(/mm5/themes/shadows/ui/fonts/KFOmCnqEu92Fr1Mu4WxKOzY.woff2) format("woff2");
unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 400;
src: local("Roboto"), local("Roboto-Regular"), url(/mm5/themes/shadows/ui/fonts/KFOmCnqEu92Fr1Mu7WxKOzY.woff2) format("woff2");
unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 400;
src: local("Roboto"), local("Roboto-Regular"), url(/mm5/themes/shadows/ui/fonts/KFOmCnqEu92Fr1Mu7GxKOzY.woff2) format("woff2");
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 400;
src: local("Roboto"), local("Roboto-Regular"), url(/mm5/themes/shadows/ui/fonts/KFOmCnqEu92Fr1Mu4mxK.woff2) format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 500;
src: local("Roboto Medium"), local("Roboto-Medium"), url(/mm5/themes/shadows/ui/fonts/KFOlCnqEu92Fr1MmEU9fCRc4EsA.woff2) format("woff2");
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 500;
src: local("Roboto Medium"), local("Roboto-Medium"), url(/mm5/themes/shadows/ui/fonts/KFOlCnqEu92Fr1MmEU9fABc4EsA.woff2) format("woff2");
unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 500;
src: local("Roboto Medium"), local("Roboto-Medium"), url(/mm5/themes/shadows/ui/fonts/KFOlCnqEu92Fr1MmEU9fCBc4EsA.woff2) format("woff2");
unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 500;
src: local("Roboto Medium"), local("Roboto-Medium"), url(/mm5/themes/shadows/ui/fonts/KFOlCnqEu92Fr1MmEU9fBxc4EsA.woff2) format("woff2");
unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 500;
src: local("Roboto Medium"), local("Roboto-Medium"), url(/mm5/themes/shadows/ui/fonts/KFOlCnqEu92Fr1MmEU9fCxc4EsA.woff2) format("woff2");
unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 500;
src: local("Roboto Medium"), local("Roboto-Medium"), url(/mm5/themes/shadows/ui/fonts/KFOlCnqEu92Fr1MmEU9fChc4EsA.woff2) format("woff2");
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 500;
src: local("Roboto Medium"), local("Roboto-Medium"), url(/mm5/themes/shadows/ui/fonts/KFOlCnqEu92Fr1MmEU9fBBc4.woff2) format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 700;
src: local("Roboto Bold"), local("Roboto-Bold"), url(/mm5/themes/shadows/ui/fonts/KFOlCnqEu92Fr1MmWUlfCRc4EsA.woff2) format("woff2");
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 700;
src: local("Roboto Bold"), local("Roboto-Bold"), url(/mm5/themes/shadows/ui/fonts/KFOlCnqEu92Fr1MmWUlfABc4EsA.woff2) format("woff2");
unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 700;
src: local("Roboto Bold"), local("Roboto-Bold"), url(/mm5/themes/shadows/ui/fonts/KFOlCnqEu92Fr1MmWUlfCBc4EsA.woff2) format("woff2");
unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 700;
src: local("Roboto Bold"), local("Roboto-Bold"), url(/mm5/themes/shadows/ui/fonts/KFOlCnqEu92Fr1MmWUlfBxc4EsA.woff2) format("woff2");
unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 700;
src: local("Roboto Bold"), local("Roboto-Bold"), url(/mm5/themes/shadows/ui/fonts/KFOlCnqEu92Fr1MmWUlfCxc4EsA.woff2) format("woff2");
unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 700;
src: local("Roboto Bold"), local("Roboto-Bold"), url(/mm5/themes/shadows/ui/fonts/KFOlCnqEu92Fr1MmWUlfChc4EsA.woff2) format("woff2");
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-display: swap;
font-family: "Roboto";
font-style: normal;
font-weight: 700;
src: local("Roboto Bold"), local("Roboto-Bold"), url(/mm5/themes/shadows/ui/fonts/KFOlCnqEu92Fr1MmWUlfBBc4.woff2) format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
#js-SRCH .category-page.wptypeaheadfull .x-product-list__item {
min-height: 310px;
}
@media only screen and ( min-width: 600px ) {
.cat-dc_tools_and_supplies {
top: 300px !important;
}
.cat-dc_concrete_floor_wax {
top: 650px !important;
}
}
html,
.u-font-primary {
font-family: "Roboto", Helvetica, Arial, sans-serif;
}
button,
input,
html,
select,
textarea {}
.c-keyline {
border-color: #EAEAEA;
}
.o-site-wrapper {
max-width: 100vw;
}
.c-form-input:focus {
border-color: #C0C0C0;
box-shadow: none;
}
.c-form-input--large {
height: calc(2.875em - (1px * 2));
line-height: calc(2.875em - (1px * 2));
}
.c-form-checkbox__input:checked+ .c-form-checkbox__caption:after {
background: none;
background-color: #194A8F;
border: 1px solid currentColor;
box-shadow: inset 0 0 0 2px #FFF;
}
.x-messages {
border: 0 none;
font-size: 0.875rem;
margin-bottom: 1.45rem;
margin-top: 1rem;
padding: 0.75em 1.25em;
}
.x-messages--info,
.x-messages--warning {
background-color: #F2F2F2;
color: #A3A3A3;
}
/** * Shadows Color Overrides */
.u-bg-red {
background-color: #ED1E24;
}
.u-bg-yellow:before,
.u-bg-yellow {
background-color: #DEDED4;
}
.u-bg-blue:before,
.u-bg-blue {
background-color: #4888C8;
}
.u-bg-green:before,
.u-bg-green {
background-color: #13C4A3;
}
.u-bg-black:before,
.u-bg-black {
background-color: #000;
}
.u-border-red {
border-color: #F02;
}
.u-border-white {
border-color: #FFF;
}
.u-border-red-dark {
border-color: #ED1E24;
border-width: 2px;
}
.u-border-yellow {
border-color: #DEDED4;
}
.u-border-blue {
border-color: #1C55A6;
}
.u-border-green {
border-color: #13C4A3;
}
.u-border-black {
border-color: #707070;
}
.u-color-red {
color: #ED1E24;
}
.u-color-yellow {
color: #DEDED4;
}
.u-color-blue {
color: #1C55A6;
}
.u-color-green {
color: #009A44;
}
.u-color-black {
color: #1F2930;
}
.mc-modal {
max-width: 510px !important;
width: 100% !important;
}
.modalContent {
width: 100%;
}
.modalContent__content {
padding: 0 !important;
}
.mc-closeModal {
background-color: #272727 !important;
}
.mc-closeModal:before,
.mc-closeModal:after {
background-color: #FFFFFF !important;
}
.addtocart-container-q span span:before {
content: "or";
font-size: 11px;
padding-right: 5px;
text-transform: uppercase;
}
.addtocart-container-q {
margin-top: 32px;
}
.popup-overlay {
background-color: #000;
float: left;
height: 100%;
left: 0;
opacity: 0.8;
position: fixed;
top: 0;
width: 100%;
z-index: 999;
}
.product-information--purchase h1.column.whole.uppercase.nm {
font-size: 24px;
font-weight: bold;
text-transform: uppercase;
}
.product-information--purchase p.column.whole.gray.nm {
font-size: 12px;
font-weight: 500;
margin: 0;
text-transform: uppercase;
}
#js-processing-purchase {
text-align: center;
width: 100%;
}
figure.mz-figure img {
left: 0;
max-height: 640px;
object-fit: cover;
top: 0;
vertical-align: top;
}
.quickview-product-detail h1 {
color: #404146;
font-size: 22px;
font-weight: 600;
margin-bottom: 0;
}
.quickview-product-detail .item-code {
font-size: 14px;
}
.quickview-product-detail .x-product-layout-purchase__pricing-current {
font-size: 2.2rem;
font-weight: 500;
}
.quickview-product-detail p {
margin-bottom: 8px;
}
.product-information--description {
border-top: 1px solid #E3E3E3;
padding-top: 15px;
}
a .at-icon-wrapper {
background: #888888 !important;
border-radius: 3px;
cursor: pointer;
height: 24px !important;
line-height: 30px !important;
text-align: center;
width: 23px !important;
}
.product-information--description span a {
color: #194A8F;
text-transform: lowercase;
}
.product-attributes.show-attr {
margin-bottom: 0px;
margin-top: 0px;
}
.product-information--purchase .product-attributes.show-attr {
margin-left: 0px;
margin-top: 0px;
}
.product-attributes.show-attr tr td {
padding-bottom: 10px;
}
.corners.add-to-cart-wrap {
margin-bottom: 10px;
vertical-align: top;
}
#js-purchase-product {
margin-top: 13px;
}
.quantity-wrap .prd-qty {
color: #313131;
display: block;
font-weight: 500;
padding-bottom: 7px;
}
.less-qty,
.add-qty {
border: 1px solid #C0C0C0;
display: inline-block;
font-size: 23px;
line-height: 36px;
text-align: center;
vertical-align: top;
}
.less-qty {
font-size: 40px;
}
.three-eighths.np {
display: inline-block;
margin: 0 -5px 0 -5px;
text-align: center;
width: 64px;
}
.three-eighths.np .c-form-input {
height: 41px;
margin: 0;
text-align: center;
}
.increase-quantity,
.decrease-quantity {
cursor: pointer;
display: block;
height: 39px;
padding: 2px 15px;
}
.product-attributes .field select {
font-size: 14px;
height: calc(2.5em - (1px * 2));
padding: calc(1em / 2) calc(1em / 2);
}
.addtocart-container-q input.c-button {
font-size: 0.65em;
}
.addtocart-container-q span.u-block {
margin-top: 5px;
}
.qty-container.add-to-cart-wrap {
margin-bottom: 30px;
}
.upload-field {
background: #FFFFFF;
border: 1px solid #CDDEF0;
color: #848585;
font-weight: 500;
font-weight: 500;
padding: 2px 2px 2px 15px;
position: relative;
}
#design_consultation input[ type="file" ] {
display: none;
}
#design_consultation .file-info {
color: #404146;
display: inline-block;
font-size: 0.9em;
font-weight: normal;
line-height: 40px;
vertical-align: middle;
}
#design_consultation .browse-btn {
background: #ED1E24;
border: none;
color: #FFF;
cursor: pointer;
font-size: 14px;
font-weight: 500;
height: 42px;
padding: 10px 10px;
position: absolute;
right: 1px;
text-transform: uppercase;
top: 1px;
}
#design_consultation .browse-btn:hover {
background: #4888C8;
}
.account-page {
/* padding-right: 20px;
*/
margin-bottom: 13px;
padding-top: 15px;
}
.account-page .c-button.c-button--hollow {
font-size: 13px;
padding: 8px 15px;
}
.product-details .prod-item-detail .choose-color-sync.o-layout.add-class-swatch ul {
list-style: none;
margin-left: 0;
}
.t-account-landing-section .x-category-tree__title a.c-button--huge,
.x-category-tree.t-account-landing-section a.c-button--huge {
border-bottom: 1px solid #DDD;
line-height: 30px;
padding-bottom: 0.5%;
padding-left: 5%;
padding-top: 0.5%;
}
.t-account-landing-section .o-layout--justify-between {
border-bottom: 1px solid #DDD;
padding-bottom: 14px;
}
/* wordpress styles */
.design-idea-top-header h1.c-heading-delta {
margin-bottom: 5px;
}
ul.project_category {
list-style: none;
margin-left: 0;
padding-right: 16px;
}
ul.project_category li {
background: #E3E3E3;
margin-bottom: 0;
padding-left: 0;
width: 100%;
}
li.o-layout__item.project-cat-li.active {
background: #5479AD;
color: #FFFFFF;
text-decoration: none;
}
li.o-layout__item.project-cat-li.active a {
color: #FFF;
}
.wp-heading {
margin-bottom: 4%;
}
.li-container li.o-layout__item.project-cat-li:first-child {
display: none;
}
ul.project_category li a {
border-bottom: 1px solid #FFF;
display: block;
padding: 10px 15px;
text-align: left;
}
ul.project_category li a:hover {
background: #5479AD;
color: #FFFFFF;
text-decoration: none;
}
.gallery-shadow figure.wpb_wrapper.vc_figure {
box-shadow: 0 0px 0 0px rgba(0, 0, 0, 0.1), 0 5px 11px rgba(0, 0, 0, 0.2);
padding: 13px 0;
position: relative;
width: 100%;
}
.gallery-shadow .wpb_single_image img {
height: 200px;
left: 0;
margin-bottom: 20px;
object-fit: cover;
top: 0;
vertical-align: top;
width: auto;
}
.top-description .wpb_content_element {
margin-bottom: 10px;
}
.top-description .wpb_content_element h2 {
margin-top: -4px;
}
.single.single-post h1 {
/* margin-bottom: 10px;
line-height: 1.22;
font-size: calc(16px * 1.333); */
}
.gallery-shadow .wpb_single_image.vc_align_center {
margin-top: 25px;
}
.wpb_content_element .wpb_wrapper a {
color: #194A8F;
}
.single-post #main p {}
.osel-cont .c-button--huge {
padding-bottom: calc(0.3em * 3 - 1px);
padding-top: calc(0.3em * 3 - 1px);
}
.choose-color-sync.o-layout.add-class-swatch.choose-sealers.tinted-sealer-18677.single-active {
border-bottom: 1px solid rgba(204, 204, 204, 0.5);
border-top: 0;
}
.tinted-sealer-color-18677 {
border-bottom: 1px solid rgba(204, 204, 204, 0.5);
padding-bottom: 3px;
}
@media( min-width: 991px ) {
.o-layout--wide> .o-layout__item.t-basket__order-summary {
padding-left: 70px;
}
.lft-image {
float: left;
}
.lft-image figure.wpb_wrapper.vc_figure {
margin-top: 0;
}
}
@media ( max-width: 300px ) {
#design_consultation button {
border-bottom-left-radius: 0;
border-top-right-radius: 5px;
width: 100%;
}
#design_consultation .file-info {
display: block;
margin: 10px 5px;
}
}
.contact-customer span.labelSpanEdit {
display: none;
}
.help-link address {
font-size: 14px;
font-style: normal;
font-weight: normal;
padding-left: 10px;
}
.help-link address p {
margin-top: 15px;
}
.help-link {
margin-bottom: 30px;
padding-right: 20px;
}
.help-link ul {
list-style: none;
margin-left: 10px;
}
.help-link h3 {
color: #333131;
display: block;
font-weight: 500;
margin-bottom: 8px;
}
.help-link ul li a {
color: #333131;
display: inline-block;
font-size: 14px;
font-weight: normal;
}
.help-link ul li {
line-height: 20px;
}
.help-link svg {
display: inline-block;
fill: #FFFFFF;
margin-right: 3px;
vertical-align: middle;
}
.contact-customer .c-form-list__item {
max-width: 100%;
}
.contact-customer .c-form-input {
font-size: 14px;
font-weight: 500;
height: calc(3em - (1px * 2));
padding: calc(1em / 2) calc(1.5em / 2);
}
.contact-customer textarea.c-form-input {
height: 5.8em;
}
.support-links {
padding: 20px;
text-align: left;
}
/* .radius100{
border-radius:100px;
-webkit-border-radius:100px;
-moz-border-radius:100px;
}
*/
.contact-customer {
background: #F4F4F4;
padding: 20px;
}
div#html_element,
#html_element_m {
clear: both;
margin-bottom: 15px;
margin-top: 15px;
width: 100%;
}
@media( min-width: 1024px ) {
.g-recaptcha {
-webkit-transform: scale(0.72);
transform: scale(0.72);
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
}
}
@media( min-width: 1025px ) {
.g-recaptcha {
-webkit-transform: scale(0.85);
transform: scale(0.85);
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
}
}
.design-consulation-form {
background: #E8F2FD;
padding: 30px 40px;
}
@media( max-width: 768px ) {
.design-consulation-form {
padding-left: 20px;
padding-right: 20px;
}
div#html_element,
#html_element_m {
margin-bottom: 20px;
margin-top: 10px;
}
.browse-button {
margin-bottom: 15px;
}
}
.design-consulation-form label.u-font-small {
font-size: 14px;
}
.design-consulation-form .c-form-input {
border: 1px solid #CDDEF0;
color: #404146 !important;
}
.left-fda-form,
.right-company-add {
margin-top: 2rem;
}
.right-company-add {
padding-left: 24px;
padding-top: 35px;
}
.design-consulation-form .c-form-select__dropdown {
border: 1px solid #CDDEF0;
color: #404146;
font-weight: normal;
height: calc(3.2em - (1px * 2));
padding: calc(1em / 2) calc(2em / 2);
}
.design-consulation-form .c-form-input {
color: #404146 !important;
font-size: 14px;
font-weight: normal;
height: calc(3.2em - (1px * 2));
padding: calc(1em / 2) calc(2em / 2);
}
.design-consulation-form .c-form-select,
.design-consulation-form input[ type="text" ],
.design-consulation-form input[ type="number" ],
.design-consulation-form input[ type="email" ] {
margin-bottom: calc(3.5em / 4);
}
input[ type=number ]::-webkit-inner-spin-button,
input[ type=number ]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}
.describe-your-project {
margin-bottom: 0;
padding: 2px 0 0;
}
.describe-your-project p {
margin-bottom: 4px;
}
.describe-your-project h3 {
font-weight: 500;
margin-bottom: 10px;
}
.describe-your-project .c-form-input--long {
color: #404146 !important;
font-weight: normal;
height: 9em;
}
.nl-heading {
margin-bottom: 12px;
}
.nl-heading label,
.company-info label {
display: block;
font-size: 18px;
font-weight: 500;
line-height: normal;
}
.nl-heading span {
display: block;
font-size: 12px;
margin-right: 14px;
}
.fda-newsletter .c-control-group .c-control-group__field {
border: 1px solid #A0A1A3;
}
.fda-newsletter .c-control-group .c-control-group__button:last-child {
border-radius: 0;
height: 49px;
margin-left: 15px;
width: auto;
}
.fda-newsletter #newsletter_form {
margin-top: 5px;
}
.company-info {
border-top: 1px solid rgba(51, 60, 90, 0.10);
margin-top: 33px;
padding-top: 19px;
}
.companyinfo-text {
padding-left: 53px;
}
.company-info li {
border-bottom: 1px solid rgba(51, 60, 90, 0.10);
padding: 19px 0;
}
.companyinfo-text p {
margin: 0;
}
.location-icon {
background: url(../images/location-icon.png) no-repeat center;
}
.call-icon {
background: url(../images/call-icon.png) no-repeat center;
}
.web-icon {
background: url(../images/web-icon.png) no-repeat center;
}
.business-hour-icon {
background: url(../images/hour-icon.png) no-repeat center;
}
.nsl-icon {
background: url(../images/subscribe-icon.png) no-repeat center;
float: left;
height: 40px;
width: 40px;
}
.location-icon,
.call-icon,
.web-icon,
.business-hour-icon {
float: left;
height: 33px;
width: 33px;
}
.greatest-design {
margin-top: 3rem;
}
.greatest-design .design-idea-menu {
border: 0;
box-shadow: none;
display: block !important;
position: static;
}
.greatest-design .design-footer {
display: none;
}
.greatest-design .design-heading.c-heading-delta {
display: none !important;
}
.greatest-design .design-image-box img {
width: 100%;
}
.greatest-design .design-image-box {
border: 0;
box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.1), 0px 1px 4px rgba(0, 0, 0, 0.4);
margin: 0 10px;
padding-bottom: 15px;
padding-right: 0;
padding-top: 20px;
}
.greatest-design .design-idea-menu figcaption {
font-size: 18px;
}
.design-consultation-blog h3.c-heading-delta {
display: none !important;
}
.design-consultation-blog {
margin-top: 5rem;
}
.design-consultation-blog .post-item-inner {
padding-top: 20px;
}
@media( max-width: 640px ) {
.design-consulation-form {
padding: 30px 20px;
}
.fda-newsletter #newsletter_form.readytheme-contentsection #mc_embed_signup_scroll .c-control-group .c-control-group__field {
width: 76%;
}
.right-company-add {
padding-left: 15px;
padding-top: 20px;
}
.greatest-design .design-idea-menu figcaption {
font-size: 16px;
}
.design-consultation-blog .t-main-content-element {
padding-left: 0;
padding-right: 0;
}
.design-consultation-blog .post-item-inner .entry-image {
max-width: 100%;
}
.design-consultation-blog #dc_blog {
padding-top: 0;
}
.design-consultation-blog {
margin-top: 3rem;
}
.x-transfigure-navigation .c-navigation__list:first-child> .c-navigation__link .c-navigation__link-carat {
right: 5px !important;
}
.contact-customer {
background: transparent;
padding: 0;
}
.account-page .c-button.c-button--hollow {
margin-top: 1rem;
}
.t-account-landing-section__content {
padding-left: 0;
}
.t-account-landing-section .x-category-tree__label {
margin-bottom: 0;
}
.t-account-landing-section__content .x-category-tree__list--level-1:first-child .x-category-tree__link {
margin-top: 0;
}
.t-account-landing-section.x-category-tree {
margin-bottom: 1rem !important;
}
}
@media( min-width: 48em ) {
.qty-container.add-to-cart-wrap {
border-right: 1px solid #E3E3E3;
margin-bottom: 0;
margin-right: 0px;
}
}
@media( min-width: 991px ) {
.t-storefront-more-from-dc {
padding-left: 11%;
}
}
.bdr-top {
border-top: 1px solid #E3E3E3;
padding-top: 17px;
}
@media( max-width: 767px ) {
.product-information .x-product-layout-images {
margin: 0;
max-width: 170px;
}
.column.whole.medium-five-twelfths.product-information--images1 {
padding: 0;
width: 100%;
}
.column.whole.medium-half.medium-offset-one-twelfth.product-information--purchase {
padding: 0;
width: 100%;
}
.corners.add-to-cart-wrap {
display: block;
margin-bottom: 16px;
padding-left: 0;
}
}
.popup-cal {
background-color: #FFF;
left: 0 !important;
margin: 0 auto;
max-height: 570px;
max-width: 960px !important;
overflow-y: auto;
padding: 20px;
position: fixed !important;
right: 0 !important;
top: 50% !important;
transform: translateY(-50%);
width: 100% !important;
z-index: 9999;
}
.popup-cal .caltypes ul li {
width: 50%;
}
.popup-cal::-webkit-scrollbar {
-webkit-appearance: none;
}
.popup-cal::-webkit-scrollbar:vertical {
width: 8px;
}
.popup-cal::-webkit-scrollbar:horizontal {
height: 8px;
}
.popup-cal::-webkit-scrollbar-thumb {
background-color: rgba(0, 0, 0, 0.5);
border: 2px solid #FFFFFF;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
}
.popup-cal::-webkit-scrollbar-track {
background-color: #FFFFFF;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
}
.popup-cal .wpb_column.vc_column_container.vc_col-sm-6 {
width: 100%;
}
@media( max-width: 640px ) {
.popup-cal {
max-width: 380px !important;
}
.calculate-area select {
width: auto;
}
button:focus {
outline: 0;
}
.c-form-checkbox__caption:before {
position: absolute;
}
.calculate-area label,
.calculate-area p {
font-size: 12px;
}
.fb-social {
float: left;
width: 100%;
}
}
#header_message a:hover {
text-decoration: underline !important;
}
.t-site-header {
border-bottom: 1px solid #EAEAEA;
}
.t-site-header__top-navigation {
font-size: 0.75rem;
}
.t-site-header__message {
display: inline-block;
font-size: 15px;
padding: 1px 0 1px 0.5em;
}
.t-site-header__links {}
.t-site-header__links [ class^="u-icon-" ] {
font-size: 1.25rem;
margin-right: 0.25em;
vertical-align: text-bottom;
}
.t-site-header__links a:hover {
opacity: 0.75;
text-decoration: none;
transition: 0.3s;
}
.t-site-header__links .o-layout__item {
padding: 4px 0;
}
@media ( min-width: 48em ) {
.t-site-header__links .o-layout__item:not(:first-of-type) {
border-left: 1px solid #5A5A5A;
}
}
.t-site-header__links .x-transfigure-navigation__footer {
display: flex;
font-size: 13px;
justify-content: flex-end;
}
a.my-account,
a.my-account+ a {
font-size: 14px;
margin-right: 0;
}
.t-site-header__links .x-transfigure-navigation__footer-link {
color: #1C55A6;
font-size: inherit;
font-weight: 400;
letter-spacing: inherit;
margin: 0 0.5rem 0 0;
padding: 0;
}
.t-site-header__links .x-transfigure-navigation__footer-link:last-child {
margin-right: 0;
}
a.x-transfigure-navigation__footer-link.u-color-blue:last-child:after {
display: none;
}
.t-site-header__basket-link--mobile {
display: flex;
font-size: 2rem;
padding-left: 3px;
}
.t-site-header__basket-link-quantity--mobile {
border-radius: 50%;
display: inline-block;
font-size: 0.75rem;
height: 2em;
line-height: 2;
min-width: 2em;
padding: 0 0.25em;
text-align: center;
touch-action: none;
-webkit-transform: translate(-0.75em, -1em);
-ms-transform: translate(-0.75em, -1em);
transform: translate(-0.75em, -1em);
}
.t-site-header__basket-link .min-cart {
color: #1C55A6;
display: inline-block;
position: relative;
}
#header_call {
color: #1B1B1B;
font-size: 16px;
}
@media ( min-width: 64em ) {
#header_call {
font-size: 14px;
}
.left-fda-form {
/* max-width: 64%!important;
*/
}
.right-company-add {
max-width: 100% !important;
}
}
@media ( min-width: 75em ) {
#header_call {
font-size: 16px;
}
}
#header_call .u-icon-phone:before {
font-size: 22px;
vertical-align: bottom;
}
#header_call a {
text-decoration: none;
}
#header_call a[ data-target="call" ] span {
margin-right: 4px;
}
#header_call a.wishlist {
font-weight: 500;
margin-left: 6%;
}
@media ( min-width: 60em ) {
.company-phone {
/* max-width:calc(100% / 12 * 4);
*/
max-width: 314px;
}
#header_call a.wishlist {
display: inline-block;
}
a.x-transfigure-navigation__footer-link.u-color-blue:after {
content: "|";
margin: 0px 0 -1px 7px;
vertical-align: top;
}
}
@media ( min-width: 60em ) and ( max-width: 1439px ) {
.company-phone {
max-width: 390px;
}
}
@media screen and ( max-width: 59.9em ) {
.x-transfigure-navigation__footer-link {
border-bottom: 1px solid #D3D3D3;
color: #1C55A6;
line-height: 27px;
padding: 9px 17px;
}
.x-transfigure-navigation__footer {
font-size: 1rem;
padding: 1rem 0;
padding-top: 0px;
}
a.my-account {
color: #194A8F;
font-weight: 500;
padding: 9px 17px;
}
}
.min-cart .u-icon-cart-empty:before {
font-size: 39px;
}
.desktop-cart .t-site-header__basket-link-quantity {
background-color: #ED1E24;
border-radius: 100%;
font-size: 12px;
font-weight: 700;
line-height: normal;
margin-left: 0.25em;
padding: 1px 5px;
position: absolute;
right: 0;
top: -2px;
}
.t-site-header__basket-link-quantity {
margin-left: 0.25em;
padding: 0.625em 1.125em;
}
.t-site-header__basket-link .cart-total {
cursor: pointer;
float: right;
font-size: 12px;
line-height: 1.4;
padding-left: calc(0.5rem + 1px);
text-align: right;
}
.t-site-header__basket-link .cart-total span {
display: block;
font-size: 14px;
line-height: normal;
}
.t-global-account {
background-color: #FAFAFA;
border: 1px solid #EAEAEA;
box-shadow: 0 2px 1px -2px #707070;
max-width: 22.5rem;
opacity: 0;
padding: 1rem;
position: absolute;
right: 0;
top: 100%;
-webkit-transform: scaleY(0);
-ms-transform: scaleY(0);
transform: scaleY(0);
transform-origin: top;
transition: all ease-in-out 0.15s;
width: 100vw;
}
.t-global-account.is-open {
opacity: 1;
-webkit-transform: scaleY(1);
-ms-transform: scaleY(1);
transform: scaleY(1);
}
.t-global-account__form {
margin-bottom: 0;
}
.t-global-account__form .c-form-list__item:last-of-type {
margin-bottom: 0;
padding-top: 0.5em;
}
.t-site-header__masthead {
font-size: 0.875rem;
padding-bottom: 0;
padding-top: 1em;
position: relative;
}
.x-fasten-header {
background-color: #FFF;
box-shadow: 0 2px 4px rgba(128, 128, 128, 0.15);
color: #222;
max-width: none;
padding: 0.5rem 1rem;
position: fixed;
}
.fasten-header__search-button {
font-size: 1.5rem;
}
.t-site-header__logo {
margin-bottom: 0;
}
.t-site-header__store-name {}
.t-site-header__store-tagline {}
.t-site-header__search-form {
margin-left: auto;
margin-right: auto;
margin-top: 10px;
position: relative;
width: 100%;
}
.x-fasten-header--is-active .t-site-header__search-form {
margin: 0 auto;
margin-right: 0;
position: relative;
}
@media screen and ( min-width: 90em ) {
.t-site-header__search-form {
float: right;
margin: 0 auto;
margin-bottom: 0;
margin-right: 24%;
margin-top: 0;
max-width: 400px;
position: relative;
}
.x-fasten-header.t-site-header__masthead .t-site-header__search-form {
margin: 0 auto;
max-width: 400px;
position: relative;
}
}
.t-site-header__search-form .c-form-list__item {
margin-bottom: 0;
margin-left: auto;
position: relative;
}
.t-site-header__search-form .c-form-input {
background: #FFFFFF;
padding-bottom: 0;
padding-left: calc(2em - 14px);
padding-right: calc(2em - -16px);
padding-top: 1px;
}
.t-site-header__search-form .c-button {
color: #999999;
font-size: 21px;
padding: calc(0.56em * 2 - 16px) calc(1em * 2 - 31px);
position: absolute;
right: 0;
}
.t-site-header__masthead-links {
align-items: center;
justify-content: flex-end;
}
.t-site-header__masthead-links [ class^="u-icon-" ] {
font-size: 1.25rem;
margin-right: 0.25em;
vertical-align: text-bottom;
}
.t-site-header__masthead-links a:hover {
opacity: 0.75;
text-decoration: none;
transition: 0.3s;
}
#fasten_header .t-site-header__masthead-links a:first-of-type {
padding-right: calc(1em + 1px);
}
.desktop-cart .t-site-header__masthead-links a:first-of-type {
font-size: 1.75em;
padding-bottom: 0.5em;
padding-right: calc(0.625em + 1px);
padding-top: 0.5em;
}
.t-global-header-logo {
max-height: 4rem;
}
@media ( min-width: 70em ) {
.t-site-header__masthead-links.desktop-cart {
/* max-width:calc(100% / 12 * 2);
*/
max-width: 153px;
}
}
@media ( min-width: 60em ) {
.x-fasten-header--is-active .x-fasten-header .t-site-header__masthead-links {
position: absolute;
right: 8px;
}
.x-fasten-header--is-active .x-fasten-header .o-wrapper {
position: relative;
}
.t-global-header-logo {
max-height: none;
}
.t-site-header__masthead {
padding-bottom: 1em;
}
}
.x-fasten-header--is-active .x-fasten-header #header_call-wishlist {
display: none;
}
.t-site-navigation {
margin-bottom: 1rem;
}
.t-site-navigation__wrap {
font-size: 1.0625rem;
margin-left: auto;
margin-right: auto;
max-width: 92rem;
position: relative;
width: 100%;
}
@media ( min-width: 60em ) {
.t-site-navigation {
border-bottom: 1px solid #EAEAEA;
}
.x-transfigure-navigation:hover .c-navigation__list .c-navigation__link {
transition: color ease-in 0.1s;
}
.x-transfigure-navigation .c-navigation__row:nth-child(2) .c-navigation__list .c-navigation__link {
color: #ADADAD;
}
.x-transfigure-navigation .c-navigation__list:hover .c-navigation__link {
color: #FF0022;
transition: color ease-out 0.1s;
}
.x-transfigure-navigation .c-navigation__list:first-child> .c-navigation__link .c-navigation__link-carat {
/* display:none;
*/
right: 11px;
}
.x-transfigure-navigation .c-navigation__list:first-child> .c-navigation__link:before {
color: #ED1E24;
content: "\56";
font-family: "ReadyTheme Icons", sans-serif;
font-size: 22px;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-variant: normal;
font-weight: 600;
line-height: 1;
margin-left: -5px;
speak: none;
text-transform: none;
}
.x-transfigure-navigation__row> .c-navigation__list {
padding-bottom: 0.5em;
padding-top: 0.5em;
}
.x-transfigure-navigation__row> .c-navigation__list:first-child {
padding-left: 1rem;
position: static;
}
.x-transfigure-navigation .c-navigation__list:first-child .c-navigation__link {
padding-left: 7px;
}
}
.t-page-sfnt main.o-wrapper.t-main-content-element {
display: none;
}
.x-transfigure-navigation .c-navigation__link {
color: #194A8F;
font-size: 16px;
font-weight: 500;
}
@media( min-width: 991px ) and ( max-width: 1480px ) {
.x-transfigure-navigation .c-navigation__list:first-child .c-navigation__link {
margin-left: -8px;
padding-left: 0;
}
.mega-menu-navigation {
left: 16px;
}
.t-site-header__message {
padding-left: 1em;
}
}
.x-transfigure-navigation .c-navigation__link:hover {
box-shadow: none;
text-decoration: none;
}
.x-transfigure-navigation .c-navigation__row:nth-child(2) .c-navigation__link:hover {
background-color: #FFF;
color: #0F0F0F;
transition: color ease-out 0.1s;
}
.x-search-preview {
right: 0;
}
.t-breadcrumbs {
margin-bottom: 1rem;
text-transform: uppercase;
}
.x-collapsing-breadcrumbs__group,
.x-collapsing-breadcrumbs__list {
border-bottom: 0 none;
font-size: 0.6875rem;
line-height: inherit;
margin-bottom: 0;
margin-left: auto;
margin-right: auto;
max-width: 90rem;
padding-right: 1rem;
padding-top: 1em;
}
.x-collapsing-breadcrumbs__list {
padding-bottom: 2em;
}
.t-main-content-element {
/* max-width:75.2rem;
min-height:50vh;
*/
}
.t-global-footer-social-links li a span {
display: none;
}
.cust-wishlist {
background-color: #FFF;
border: 1px solid #EAEAEA;
display: none;
position: absolute;
right: auto;
text-align: left;
top: 30px;
width: 160px;
z-index: 9;
}
.cust-wishlist ul {
margin-bottom: 0;
margin-left: 0;
}
.cust-wishlist .hide-widhlist {
display: block !important;
}
.cust-wishlist li {
line-height: 20px;
list-style: none;
}
.cust-wishlist li a {
background: #F3F8FE;
border-bottom: 1px solid #EAEAEA;
display: block;
padding: 5px 11px;
}
.cust-wishlist a.u-text-bold.u-color-black:before {
color: #ED1E24;
content: "\f101";
font-family: "fontawesome";
left: 0px;
margin-right: 5px;
}
.cust-wishlist li:last-child a {
border-bottom: 0;
}
.cust-wishlist li a:hover {
background: #4888C8;
color: #FFFFFF;
text-decoration: none;
}
.cust-wishlist li a.u-text-bold.u-color-black {
font-size: 14px;
font-weight: normal;
}
.o-layout__item.u-width-12.u-width-3--l.u-width-3--w.u-text-center--m.u-text-center.u-text-right--l.company-phone {
position: relative;
}
.mega-menu-navigation .level-1 {
float: left;
width: 25%;
}
a.u-block.x-product-list__link.step1cat.active {
border: 2px solid #2C87F0;
box-shadow: 0px 0px 8px 1px #98AFC7;
}
.x-product-list__link h2 {
margin-bottom: 7px;
}
@media( max-width: 767px ) {
#header_call a[ data-target="call" ] {
float: right;
}
#header_call a.wishlist {
float: left;
margin-left: 0;
}
.t-site-header__search-form {
max-width: 100%;
}
}
.wishlist-heading {
display: block;
padding-bottom: 5px;
padding-top: 15px;
}
.t-site-footer {
padding-top: 1rem;
}
.t-site-footer .o-wrapper {}
.t-site-footer__content,
.t-site-footer__disclaimer {
padding-bottom: 2.2em;
padding-top: 2em;
}
.t-site-footer .c-menu__title,
.t-site-footer .c-collapsible-menu__label {
font-weight: 700;
}
.t-site-footer__content .c-menu__link:not([ class*=" u-icon-" ]) {
/* font-size:0.875rem; */
color: #3C3D3D;
font-size: 15px;
}
.t-site-footer__content .c-menu__link:hover {
opacity: 0.75;
}
.t-site-footer__disclaimer {
font-size: 0.75rem;
margin-left: auto;
margin-right: auto;
max-width: 90rem;
width: 100%;
}
.t-global-footer-social-links .c-menu__link {
padding: 0 1rem 1rem 0;
}
.t-global-footer-social-links .c-menu__link:hover {
background: #ED1E24;
opacity: 1;
text-decoration: none;
}
.t-newsletter-form__input {
font-size: 14px;
height: auto;
padding: 0.5em calc(1em / 1);
}
@media ( min-width: 48em ) {
.t-site-footer {}
.t-site-footer__content,
.t-site-footer__disclaimer {
padding-bottom: 0;
padding-top: 3em;
}
.t-site-footer__disclaimer {
padding-bottom: 20px;
padding-top: 2em;
}
.t-site-header__logo a {
max-width: 26%;
}
.t-site-header__logo a {
margin-top: -11px;
}
}
.t-site-header__logo a {
max-width: 70%;
}
@media ( min-width: 769px ) and ( max-width: 1024px ) {
.t-site-header__logo a {
max-width: 92%;
}
}
@media ( max-width: 47.9em ) {
.t-site-footer__content {
padding-top: 0;
}
.t-site-header__logo a {
max-width: 140px;
}
}
.t-storefront-about {}
.t-storefront-about .c-heading-charlie {
font-size: 1.875rem;
letter-spacing: 3px;
}
.t-storefront-about .c-heading--subheading {
font-size: 1rem;
font-weight: 600;
letter-spacing: 2px;
}
.t-storefront-about__brief {
font-size: 0.9375rem;
line-height: 1.667;
}
div#build_kit {}
.o-layout.t-storefront-build-kit {
background-image: url(../../../../graphics/00000001/build-kit-bg.jpg);
background-position: center 0;
background-repeat: no-repeat;
background-size: cover;
}
.t-storefront-build-kit .storefront-story {
align-self: flex-end;
/* background-image:url(../../../../graphics/00000001/notice-board.png);
background-repeat:no-repeat;
height:44.875em;
max-width:39.125em;
align-self:flex-end;
width:100%;
*/
}
.build-kit-content {
margin: 0 auto;
max-width: 29.375em;
padding: 17em 2em 4em;
}
.build-kit-content .c-heading-bravo .c-button--huge {
border: 0;
border-radius: 8px;
color: #FFF;
font-size: 20px;
padding: 10px 16px;
width: auto;
}
.build-kit-content .c-heading-bravo .c-button--huge span.u-color-black.u-text-bold {
color: #FFF;
font-weight: 600;
}
.build-kit-content .c-heading-alpha {
color: #272727;
font-size: 1.8em;
font-weight: 400;
margin-bottom: 25px;
}
.build-kit-content .c-heading-bravo {
color: #272727;
font-size: 33px;
padding: 4px 4px 15px;
}
.build-kit-content .c-button--huge,
.build-kit-content .c-button--large {
border: 0;
border-radius: 8px;
font-size: 1.5em;
padding: 17px 15px;
width: 81%;
}
.build-kit-content .c-heading-charlie {
color: #575757;
font-size: 32px;
padding: 30px 0;
}
@media ( min-width: 48em ) {
.t-storefront-build-kit .o-wrapper {
display: flex;
flex-direction: column-reverse;
position: relative;
}
}
@media ( max-width: 767px ) {
.build-kit-content {
padding: 5.6em 1em;
}
.build-kit-content .c-heading-alpha {
font-size: 22px;
margin-bottom: 10px;
}
.build-kit-content .c-heading-bravo {
font-size: calc(((9px * 1.333) * 1.333) * 1.333);
padding-bottom: 5px;
}
.build-kit-content .c-heading-charlie {
padding: 13px 0 !important;
}
.build-kit-content .c-button--large,
.build-kit-content .build-kit-content {
margin-top: 7em;
}
.o-layout.t-storefront-build-kit .o-wrapper--flush {
-webkit-align-items: flex-end;
align-items: flex-end;
display: flex;
-webkit-justify-content: center;
justify-content: center;
}
.t-storefront-build-kit .storefront-story {
background-position: center;
background-size: cover;
margin-left: 10px;
}
}
.more-views {
margin-top: 2%;
}
#storefront_project {
padding-bottom: 30px;
}
@media screen and ( min-width: 60em ) {
.cover-banner {
background: url(../images/DIRECT-COLORS-Homepage-Image-1-1800x750.png);
background-repeat: no-repeat;
background-size: cover;
min-height: 723px;
}
#storefront_project {
/* padding-top:calc(1.7375em * 1 + 1px);
*/
padding-bottom: calc(4.7375em * 1 + 1px);
}
.projects-boxes {
margin-top: 0;
}
}
.project-overlay {
background: #FFFFFF;
box-shadow: 0 0px 0 0px rgba(0, 0, 0, 0.1), 0 5px 11px rgba(0, 0, 0, 0.2);
cursor: pointer;
display: block;
margin-top: 21px;
min-height: 90px;
overflow: hidden;
position: relative;
text-transform: uppercase;
vertical-align: middle;
}
.project-overlay:after {
background: #FFFFFF;
bottom: 0;
content: "";
height: 40%;
left: 0;
position: absolute;
-webkit-transform: skew(0deg, -8deg);
transform: skew(0deg, -8deg);
width: 100%;
}
.project-overlay:hover:after,
.project-overlay:hover {
background: #ED1E24;
}
.project-overlay:hover h3,
.project-overlay:hover p {
color: #FFFFFF;
}
.projects-boxes a {
color: #333333;
display: block;
height: 100%;
padding: 5px 10px;
position: relative;
text-transform: capitalize;
z-index: 9;
}
.project-overlay img {
width: 100%;
}
.projects-boxes a h3 {
color: #333333;
font-size: 22px;
font-weight: 700;
margin: 0;
}
.projects-boxes a:hover {
text-decoration: none;
}
.projects-boxes a p {
font-size: 14px;
}
@media( min-width: 60em ) {
.t-storefront-project .o-layout__item {
padding-left: 16px;
}
}
@media( max-width: 768px ) {
.projects-boxes a h3 {
font-size: 17px;
}
.x-category-tree
/* ,.x-category-tree__label */
{
margin-bottom: 0 !important;
}
.category-page .x-product-list__figure .x-product-list__link h2 {
min-height: 40px;
}
.category-page .product-list-button .c-button {
opacity: 1;
}
#js-CTGY .ctgy-prod-price-container {
min-height: 42px !important;
}
#js-SRCH .ctgy-prod-price-container {
min-height: 42px !important;
}
#js-SRCH .ctgy-prod-price-inner {
font-size: 14px !important;
}
#js-CTGY .ctgy-prod-price-inner {
font-size: 14px !important;
}
}
@media( max-width: 767px ) {
.project-overlay:after {
display: none;
}
.projects-boxes a p {
display: none;
}
.projects-boxes a {
padding-bottom: 7px;
padding-top: 7px;
}
}
#storefront_why_dc {
position: relative;
}
.t-storefront-why-dc {
padding-top: calc(1.45em * 2 + -2px);
}
.why-dc .o-list-inline--wide> .o-list-inline__item {
color: #313132;
font-size: 17px;
}
.why-dc ul li img {
margin-right: 3px;
}
@media screen and ( min-width: 48em ) {
.why-dc {
color: #1F1F22;
padding-left: 30px;
}
}
@media screen and ( min-width: 75em ) {
.why-dc {
padding-top: calc(3.5em * 1 + 1px);
}
.why-dc .o-list-inline--wide> .o-list-inline__item {
font-size: 20px;
margin-right: calc(8px * 2);
}
.why-dc ul li img {
margin-right: 3px;
}
}
@media ( max-width: 47.9375em ) {
.t-storefront-why-dc {
padding-bottom: calc(1em * 2 + 1px);
padding-top: calc(1em * 2 + 1px);
}
}
@media ( max-width: 40em ) {
div#storefront_why_dc:before {
background: url(../../../../graphics/00000001/why-dc-hero-image.png);
background-repeat: no-repeat;
background-size: 100%;
content: "";
height: 100%;
left: 0;
opacity: 0.1;
position: absolute;
top: 36px;
width: 100%;
z-index: -2;
}
.t-storefront-why-dc {
text-align: center;
}
}
.why-dc h4 {
font-size: 19px;
margin-bottom: 0;
}
.why-dc p {
color: #404146;
font-size: 19px;
line-height: 1.4;
margin-top: 20px;
}
.why-dc ul {
margin-bottom: calc(44px - 7px);
}
.why-dc .c-button {
margin-right: 16px;
padding: calc(0.846em + 0px) calc(1.38em + 9px);
}
@media( max-width: 768px ) {
.why-dc h4 {
font-size: 16px;
}
.why-dc p {
font-size: 16px;
margin-top: 12px;
}
.why-dc .o-list-inline--wide> .o-list-inline__item {
font-size: 14px;
margin-right: 0;
}
}
.t-storefront-testimonial {
position: relative;
}
.customer-testimonial-box {
background-image: url(../../../../graphics/00000001/quote.png);
background-position: 26px 24px;
background-repeat: no-repeat;
border: 1px solid #E4E5E5;
border-radius: 20px;
margin-top: 2em;
padding: calc(2.8125em - 20px);
padding-bottom: calc(2em - 10px);
position: relative;
z-index: 9;
}
.testi-cta {
margin-top: 20px;
}
.testi-cta .u-font-tiny {
color: #404146;
font-size: 14px;
}
div#storefront_testimonial {
background: url(../../../../graphics/00000001/spotlght-bg.jpg) no-repeat center;
background-size: cover;
margin-top: 50px;
overflow: hidden;
padding-bottom: calc(1.5em * 2 - 9px);
padding-top: calc(1.5em * 2 - 13px);
}
.testi-pic {
display: none;
}
.testi-pic:first-child {
display: block;
}
@media ( max-width: 47.9375em ) {
div#storefront_testimonial {
margin-top: 0;
padding-bottom: calc(2.5em * 2 - 9px);
}
.user-test-image {
border-radius: 50px;
display: inline-block;
max-width: 63px;
overflow: hidden;
}
.myitems {
text-align: center;
}
}
.customer-pic img {
display: none;
}
@media( min-width: 60em ) {
div#storefront_testimonial {
margin-top: 0;
padding-bottom: calc(3em * 2 - 9px);
padding-top: calc(2em * 2 - 9px);
}
.customer-testimonial-box {
margin-top: 2em;
}
}
@media( min-width: 60em ) {
.customer-pic img {
border: 3px solid #ECECEC;
border-radius: 50%;
box-shadow: 0px 0px 15px 5px #808080;
display: block;
margin-left: 5%;
max-width: 500px !important;
min-height: 500px;
object-fit: cover;
position: relative;
right: 0;
top: 15px;
width: 100%;
}
.customer-testimonial-box.u-bg-white {
box-shadow: 0px 0px 10px 0px #808080;
}
.o-layout__item.u-width-6.u-width-5--m.customer-pic {
float: left;
/* border-radius: 50%; */
}
.t-storefront-testimonial .o-layout__item.u-width-12.u-width-12--m.u-width-7--l.u-width-7--xl {
float: left;
}
.customer-testimonial-box p {
font-size: 23px;
font-weight: 300;
line-height: 1.35;
padding: 10px 0;
}
.customer-testimonial-box {
padding: calc(2.8125em - 1px);
padding-bottom: calc(2em - 1px);
}
.testi-cta {
margin-top: 0;
}
}
@media ( max-width: 48em ) {
div#storefront_testimonial {
padding-bottom: calc(3em * 2 - 9px);
}
#header_call a.wishlist {
position: relative;
}
.cust-wishlist {
left: 0;
right: auto;
}
.entry-image img {
max-width: 100%;
}
}
div#storefront_more_from_dc {
padding-bottom: 3.7%;
padding-top: 5%;
}
.t-storefront-more-from-dc ul {
font-size: calc(1.25em + 6px);
margin: calc(27px * 2) 0;
}
.t-storefront-more-from-dc ul li a {
background: #FFFFFF;
border: 1px solid #DEDEDE;
border-radius: 10px;
color: #3D3D3D;
display: block;
font-weight: 500;
margin-top: 5px;
padding: 12px 16px;
text-align: center;
}
.t-storefront-more-from-dc ul li a:hover {
box-shadow: 0 0 0 1px rgba(222, 222, 222, 0.1), 0 0px 8px rgba(0, 0, 0, 0.1);
text-decoration: none;
}
.t-storefront-more-from-dc .o-list-inline--wide> .o-list-inline__item:last-child {
margin-bottom: 0;
margin-right: 0;
}
.mdc-icon {
border-radius: 100%;
display: block;
height: 60px;
margin: 0 auto;
padding: 11px 15px;
text-align: center;
vertical-align: middle;
width: 60px;
}
.more-images a {
display: block;
margin-bottom: 15px;
}
.fb-social {
padding-left: 11px;
}
@media ( min-width: 48em ) {
div#storefront_more_from_dc {
padding-bottom: calc(4.3375em * 1 + 1px);
padding-top: calc(5.9375em * 1 + 1px);
}
div#storefront_more_from_dc h3.c-heading-delta {
margin-bottom: 0;
}
}
div#storefront_more_from_dc {
padding-bottom: calc(3.9375em * 1 + 1px);
padding-top: calc(3.9375em * 1 + 1px);
}
@media ( min-width: 60em ) {
.mdc-icon {
display: inline-block;
margin: 0;
text-align: center;
vertical-align: middle;
}
.t-storefront-more-from-dc ul li a {
text-align: left;
}
.t-storefront-more-from-dc a {
display: block;
margin-top: 2rem;
}
}
.t-storefront-more-from-dc a {
display: block;
margin-bottom: 1rem;
}
@media ( min-width: 75em ) {
.mdc-icon {
height: 60px;
margin-right: calc(14px * 1);
padding: 11px 15px;
width: 60px;
}
}
@media ( max-width: 47.9375em ) {
.t-page-sfnt .c-heading-delta {
font-size: calc(13px * 2);
}
.why-dc h3.c-heading-delta {
margin-top: 20px;
}
.t-storefront-more-from-dc ul li {
margin-bottom: 14px;
width: 100%;
}
.t-storefront-more-from-dc ul {
margin: calc(27px * 1) 0;
}
.t-storefront-more-from-dc .o-layout__item:last-child img {
margin-bottom: 0;
}
.o-list-inline--wide> .o-list-inline__item {
margin-right: 0;
}
.why-dc h4 {
font-size: 15px;
padding-top: 0;
}
.why-dc p {
font-size: 16px;
}
.why-dc ul {
margin-bottom: calc(28px - 1px);
}
.why-dc .o-list-inline--wide> .o-list-inline__item {
font-size: 11px;
margin-right: 5px;
padding-left: 0;
}
.why-dc .o-list-inline--wide> .o-list-inline__item:last-child {
margin-right: 0;
}
.why-dc ul li img {
margin-right: 3px;
width: 18px;
}
div#storefront_more_from_dc {
padding-bottom: calc(1.5em * 2 - 9px);
padding-top: calc(1.5em * 2 - 9px);
}
.mdc-icon {
display: inline-block;
height: 50px;
margin-right: 11px;
margin-right: 0;
padding: 8px 14px;
width: 50px;
}
.t-storefront-more-from-dc ul li a {
font-size: 21px;
text-align: left;
}
.mobile-hide {
display: none;
}
}
@media ( min-width: 40em ) {
.t-storefront-more-from-dc ul li {
font-size: 19px;
width: 32%;
}
}
@media ( min-width: 48em ) {
.t-storefront-more-from-dc ul li {
font-size: 23px;
text-align: left;
width: 32%;
}
}
#storefront_instagram .hash-feed .fab {
margin-right: 10px;
}
#storefront_instagram .hash-feed .fa-pinterest {
color: #E6001A;
}
#storefront_instagram .hash-feed span {
margin-right: 13px;
}
.hash-feed a:hover {
color: #2567C3;
}
.instafeed {
display: flex;
flex: 0 1 auto;
flex-direction: row;
flex-wrap: wrap;
margin: calc(0px + 30px) 0 0 calc(0px - 16px);
}
.instafeed div.inner-insta-image img {
width: 100%;
}
@media ( max-width: 767px ) {
.instafeed div.inner-insta-image {
flex-basis: calc(100% / 2);
max-width: calc(100% / 2);
padding: 1px;
}
.t-storefront-more-from-dc span+ span {
display: block;
font-size: 16px;
}
}
@media ( min-width: 40em ) {
.instafeed div.inner-insta-image {
flex-basis: calc(100% / 3);
max-width: calc(100% / 3);
}
}
@media ( min-width: 48em ) {
#storefront_instagram .hash-feed {
font-size: 46px;
}
.instafeed div.inner-insta-image {
flex-basis: calc(100% / 6);
max-width: calc(100% / 6);
}
.storefront_instagram-inner {
margin-bottom: calc(0em * 1 + 1px);
}
}
.newsletter-popup-inner ul.c-form-list {
margin: 18px 0 0;
}
div#mce-responses {
float: left;
position: absolute;
top: 100%;
}
.t-newsletter-form {
position: relative;
}
div#mce-responses a {
color: #FFF;
font-weight: bold;
}
.newsletter-signup-form {
background-color: #FFF;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
left: 0 !important;
margin: 0 auto;
max-width: 600px !important;
overflow: hidden;
padding: 20px;
position: fixed !important;
right: 0 !important;
top: 50% !important;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
transform: translateY(-50%);
width: 100% !important;
z-index: 999;
}
.newsletter-popup-overlay {
background-color: #000;
float: left;
height: 100%;
left: 0;
opacity: 0.8;
position: fixed;
top: 0;
width: 100%;
z-index: 999;
}
p.newslettre-heading {
font-size: 20px;
font-weight: 600;
text-align: center;
text-transform: uppercase;
}
p.newslettre-text {
text-align: center;
}
.newsletter-signup-form li.c-control-group.u-flex {
padding-bottom: 7px;
}
.newsletter-processing {
clear: both;
}
div#mce-responses-pop {
padding-bottom: 11px;
}
div#mce-responses-pop a {
display: inline-block;
}
.newsletter-popup-footer {
font-size: 15px;
font-weight: 500;
margin-top: 2%;
text-align: center;
}
.newsletter-signup-form input#mce-EMAIL-pop {
border: 1px solid #CCC;
}
.newsletter-signup-form .c-button {
border-radius: 0;
line-height: 24px;
}
.newsletter-signup-form .closeit {
cursor: pointer;
}
input#mc-embedded-subscribe-pop:disabled {
background-color: #ED1E24;
}
div#mce-success-response {
clear: both;
color: green;
}
div#mce-error-response {
color: #ED1E24;
font-size: 15px;
}
.error-con {
padding-bottom: 11px;
}
div#mce-success-response,
.error-con,
div#mce-error-response {
text-align: center;
}
@media( max-width: 47.9em ) {
.newsletter-popup-inner label {
display: none;
}
.newsletter-signup-form li.c-control-group.u-flex {
display: block;
}
.newsletter-signup-form .c-button {
display: block;
margin-top: 5px;
width: 100%;
}
}
@media( max-width: 640px ) {
#newsletter_form ul.c-form-list .c-control-group {
display: block;
}
.dc-newsletter-form .c-control-group .c-control-group__button {
position: absolute;
right: 0;
top: 34px;
}
div#mce-error-response {
color: #FFFFFF;
}
div#mce-responses {
margin-top: 10px;
position: static;
}
div#mce-success-response {
color: #FFFFFF;
}
.t-storefront-more-from-dc a {
margin-bottom: 2rem;
}
}
.dc-newsletter {
background-color: #1C55A6;
color: #FFFFFF;
margin-top: 2rem;
padding: 10px 0;
}
.dc-newsletter-form {
-webkit-align-items: center;
align-items: center;
-webkit-box-align: center;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-flex-align: center;
}
#newsletter_form {
width: 100%;
}
@media ( max-width: 47.9em ) {
.t-newsletter-form fieldset {
display: block;
transition-delay: 0.15s, 0s, 0s;
}
.t-newsletter-form .c-collapsible-menu__label:after {
display: none;
}
.t-newsletter-form .c-collapsible-menu__label {
justify-content: space-around;
padding-bottom: 10px;
}
.dc-newsletter {
padding-bottom: 20px;
text-align: center;
}
.t-newsletter-form .c-collapsible-menu__trigger:checked~ fieldset {
display: block;
margin-top: 1em;
max-height: 10em;
opacity: 1;
overflow: hidden;
transition: visibility 0s ease, max-height 0.3s ease, opacity 0.3s ease;
transition-delay: 0s;
visibility: visible;
}
}
@media ( min-width: 48em ) {
.dc-newsletter-content {
margin-bottom: 20px;
}
}
.dc-newsletter-content h3 {
font-size: 50px;
font-weight: 700;
line-height: normal;
margin: 0;
}
.dc-newsletter-content p {
font-weight: 300;
margin: 0;
}
.dc-newsletter-form .c-control-group .c-control-group__button:first-child,
.dc-newsletter-form .c-control-group .c-control-group__field:first-child,
.dc-newsletter-form .c-control-group .c-control-group__button:last-child {
border-radius: 0;
}
.dc-newsletter-form .c-control-group .c-control-group__button {
padding: 15px 10px;
width: calc(6em*2);
}
.t-newsletter-form {
margin-bottom: 0;
}
@media ( max-width: 47.9375em ) {
.dc-newsletter-content h3 {
font-size: 30px;
}
.dc-newsletter-content p {
margin-bottom: 20px;
}
.dc-newsletter-form .c-control-group .c-control-group__button {
font-size: 11px;
padding: 17px 10px;
}
}
.company-address {
font-size: 15px;
}
.company-address ul {
line-height: 1.5;
list-style: none;
margin-left: 0;
margin-top: 20px;
}
.company-address ul li {
margin-top: 15px;
}
.company-address ul li span {
padding-right: 4px;
}
.company-address ul li a {
color: #353636;
}
.footer-image {
background: #F7F7F7;
margin-top: 3rem;
padding: 10px 0;
text-align: center;
}
.t-global-footer-social-links .c-menu__link {
background: #A1A1A2;
border-radius: 100%;
color: #FFFFFF;
font-size: 20px;
margin-bottom: 11px;
padding: 12px 12px;
}
.t-global-footer-social-links .c-menu__link.fab {
color: #FFFFFF;
font-size: 22px;
line-height: 0.95;
}
.post-item-inner {
padding-bottom: 20px;
padding-top: 20px;
}
.post-item-inner .entry-image {
flex-shrink: 0;
margin-bottom: 6%;
margin-right: 25px;
max-width: 370px;
}
.entry-image img {
display: block;
}
.post-item-inner .entry-details {
padding-right: 26px;
}
.meta-info {
color: rgba(31, 41, 48, 0.80);
font-size: 12px;
font-weight: 600;
margin-bottom: 15px;
text-transform: uppercase;
}
.meta-info> span {
margin-right: 10px;
}
.meta-info span span {
color: #ED1E24;
font-size: 14px;
font-weight: 600;
margin-right: 5px;
}
.entry-details .td-module-title {
line-height: 1.2;
margin-bottom: 8px;
}
.entry-details .td-module-title a {
color: #1F2930;
font-size: 16px;
font-weight: 600;
}
.entry-details .td-excerpt,
.entry-details .td-excerpt p {
font-size: 14px;
font-weight: 400;
line-height: 1.2;
}
.td-read-more {
font-size: 12px;
font-weight: 600;
margin-top: 10px;
text-transform: uppercase;
}
.t-dc-blog .o-layout--spaced.o-layout--wide> .o-layout__item {
margin-bottom: calc(19px * 2);
}
@media ( min-width: 48em ) {
.post-item-inner {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
padding-bottom: 26px;
padding-top: 43px;
}
.post-item-inner .entry-image {
margin-bottom: 0;
}
#dc_blog .post-item-inner {
padding-bottom: 0;
}
#dc_blog .post-item-inner {
padding-top: 34px;
}
}
@media ( max-width: 48em ) {
.post-item-inner .entry-details {
padding-right: 16px;
}
.post-item-inner .entry-image {
margin-right: 16px;
max-width: 121px;
}
}
@media ( max-width: 47.9375em ) {
.post-item-inner {
padding-bottom: 10px;
text-align: center;
}
.post-item-inner .entry-image {
display: inline-block;
margin-bottom: 6px;
margin-right: 0;
}
#dc_blog {
padding-top: calc(1.5em * 2 - 9px);
}
}
@media ( max-width: 40em ) {
.meta-info,
.entry-details .td-excerpt,
.entry-details .td-excerpt p,
.td-read-more {
display: none;
}
.entry-details .td-module-title a {
font-size: 13px;
}
.post-item-inner .entry-details {
padding-right: 0;
}
}
.t-featured-products {
margin-bottom: 2rem;
padding-top: 3rem;
}
.t-featured-products .x-product-list__heading {
font-size: 1.5rem;
margin-bottom: 3em;
}
.t-featured-products .x-product-list__action {
margin: auto;
max-width: 18em;
}
.t-featured-products .x-product-list__action .c-button {
padding-left: calc(1rem * 4.5 - 1px);
padding-right: calc(1rem * 4.5 - 1px);
}
.x-category-tree__label {
background-color: #FFF;
border-bottom: 1px solid #EAEAEA;
color: #222;
font-weight: 700;
margin-bottom: 1em;
padding: 1em 0;
}
.x-category-tree__heading {}
@media ( min-width: 60em ) {
.x-category-tree__heading {
margin-bottom: 0;
padding-bottom: 5px;
padding-top: 0;
}
.x-category-tree__label {
font-size: 0.75rem;
}
}
.x-category-tree__label:after,
.x-category-tree__label:before {
font-family: "ReadyTheme Icons", sans-serif;
font-size: 0.625em;
font-weight: 400;
}
.x-category-tree__label:after {
content: "\30";
}
.x-category-tree__label:before {
content: "\31";
transform: scale(1);
}
.x-category-tree__trigger:checked~ .x-category-tree__label:after {
transform: scale(1);
}
.x-category-tree__link {
color: #0F0F0F;
font-size: 14px;
font-weight: 400;
letter-spacing: 0;
padding: 0 0 0.75rem 15px;
transition: color ease-in-out 0.2s;
}
.x-category-tree__list--level-2 .x-category-tree__link {
color: #3D3D3D;
font-size: 13px;
padding-left: 1em;
}
.x-category-tree__list--level-3 .x-category-tree__link {
color: #3D3D3D;
font-size: 12px;
padding-left: 2.75em;
}
.x-category-tree__link--current,
.x-category-tree__list--level-2 .x-category-tree__link--current,
.x-category-tree__list--level-3 .x-category-tree__link--current {
color: #0F0F0F;
font-weight: 700;
}
.x-category-tree__link:not(.x-category-tree__link--current):hover {
background-color: inherit;
text-decoration: underline;
}
.t-faceting .c-form-checkbox {
font-size: 14px;
}
.t-display-list-filtering {
flex-wrap: nowrap;
margin-left: auto;
}
.t-display-list-filtering .x-display-list-filtering__per-page,
.t-display-list-filtering .x-display-list-filtering__sort-by,
.t-display-list-filtering .c-form-list__item,
.t-display-list-filtering .c-form-label,
.t-display-list-filtering .c-form-select {
margin-bottom: 0;
}
.t-display-list-filtering .c-form-label {
font-size: 0.6875rem;
}
.t-display-list-filtering .c-form-select__dropdown {
background-color: #FFF;
border: 0 none;
color: initial;
font-size: 0.75rem;
padding: 0;
}
.cat-heading {
margin-bottom: 13px;
}
.t-pagination.x-pagination--centered {
justify-content: center;
width: 13rem;
}
.t-pagination .o-list-inline {
align-items: center;
display: flex;
justify-content: space-between;
width: 100%;
}
.t-pagination .c-button {
border-color: #C0C0C0;
height: 2em;
line-height: 2;
padding: 0;
width: 2em;
}
.t-pagination .c-form-select {
margin-bottom: 0;
}
.t-pagination .c-form-select__dropdown {
border: 0 none;
padding: 0;
}
.category-page .x-product-list__item {
margin-bottom: 1rem;
text-align: center;
}
.category-page .x-product-list__item .x-product-list__figure {
padding: 15px 10px;
}
.category-page .x-product-list__item .x-product-list__figure:hover {
box-shadow: 0 0 11px 5px rgba(222, 222, 222, 0.2), 0 2px 7px rgba(0, 0, 0, 0.2);
}
.category-page .x-product-list__name,
.category-page .x-product-list__price {
font-weight: 400;
line-height: normal;
}
.x-product-list__name,
.x-product-list__link {}
.category-page .x-product-list__price {
font-weight: 600;
}
.category-page figcaption .x-product-list__link {
margin-bottom: 10px;
min-height: 30px;
}
.category-page .x-product-list__price {
color: #404146;
display: inline-block;
}
.category-page .x-product-list__price span {
font-weight: 400;
}
.more-detail-button {
text-align: center;
}
.category-page .x-product-list__image {
font-size: 12px;
max-width: 190px;
}
.product-wishlist {
border: 1px solid #939192;
border-radius: 100%;
color: #939192;
height: 30px;
line-height: 21px;
padding: 5px 6px 5px;
position: absolute;
right: 10px;
top: 10px;
width: 30px;
}
.product-wishlist:hover {
background: #194A8F;
border: 0;
color: #FFF;
}
.x-product-list__figure figcaption .sku-code {
font-size: 12px;
}
.x-product-list__figure figcaption .product-description {
font-size: 14px;
font-style: italic;
margin-bottom: 5px;
padding-top: 4px;
}
.x-product-list__figure .product-price {
margin-bottom: 5px;
}
.product-price {
padding: 2%;
text-align: center;
}
.x-product-list__figure .product-price .x-product-list__price {}
.x-product-list__figure .product-price .x-product-list__price span {}
.bundle_item_group .x-product-list__figure .product-price .x-product-list__price {
font-size: 15px;
}
.color-swatch label,
.product-select-size label {
display: block;
font-weight: 500;
padding-bottom: 5px;
}
.color-swatch ul {
display: inline-block;
list-style: none;
margin-bottom: 0;
margin-left: 0;
padding: 0;
vertical-align: middle;
}
.color-swatch ul li {
border: 1px solid #E3E3E3;
border-radius: 100%;
display: inline-block;
height: 32px;
margin-bottom: 10px;
width: 32px;
}
.color-swatch ul li.active img {
border-color: #ED1E24;
}
#helpful_info {
font-size: 15px;
}
#address fieldset ul li label.c-form-label {
font-size: 14px;
}
.color1 {
background: #E46C6C;
}
.color2 {
background: #544141;
}
.color3 {
background: #3850C6;
}
.color4 {
background: #B7B845;
}
.color5 {
background: #704545;
}
.color6 {
background: #EB2754;
}
.product-select-size {
margin-top: 9px;
position: relative;
text-align: right;
}
.product-select-size select {
-webkit-appearance: button;
appearance: button;
background-color: transparent;
border: 1px solid #707070;
font-size: 15px;
outline: none;
padding: 12px;
width: 200px;
}
.product-select-size:before {
background-color: rgba(255, 255, 255, 0.1);
border-left: 1px solid rgba(64, 65, 70, 0.5);
content: "\f107";
font-family: FontAwesome;
font-size: 28px;
height: 100%;
line-height: 45px;
pointer-events: none;
position: absolute;
right: 0;
text-align: center;
top: 0;
width: 10%;
}
.product-select-size:hover:before {
background-color: rgba(255, 255, 255, 0.2);
color: rgba(255, 255, 255, 0.6);
}
.product-select-size select option {
padding: 30px;
}
.product-list-button .c-button--huge {
padding: calc(0.4em * 3 - 1px) calc(1em * 3 - 1px);
}
.product-list-button {
margin-top: 20px;
text-align: left;
}
.product-list-button .c-button {
border: 0;
color: #FFFFFF;
font-size: 14px;
opacity: 0;
}
.category-page .x-product-list__item .x-product-list__figure:hover .product-list-button .c-button {
opacity: 1;
}
.product-list-button .c-button:hover {
background-color: #2567C3;
}
@media( max-width: 47.9375em ) {
.color-swatch,
.product-select-size {
text-align: left;
}
.product-select-size select {
width: 87%;
}
.product-select-size:before {
right: 4px;
}
.category-page .x-product-list__item {
margin-bottom: 0;
}
}
@media( max-width: 40em ) {
.product-list-button .c-button {
font-size: 11px;
opacity: 1;
width: 100%;
}
.x-product-list__figure figcaption .product-description {
font-size: 12px;
}
.category-page .x-product-list__name,
.category-page .x-product-list__price {
font-size: 14px;
}
.product-wishlist {
display: none;
}
.category-page .x-product-list__image {
max-width: 140px;
}
}
@media ( min-width: 60em ) {
.x-product-layout {
padding-top: 2rem;
}
.x-product-layout-purchase ul.c-form-list {
padding-left: 25px;
}
}
.x-product-layout-purchase__name {
font-size: calc(16px * 1.5625);
margin-bottom: 9px;
}
.x-product-layout-purchase__sku {
margin-bottom: 8px;
}
.x-product-layout-purchase__pricing {
border-bottom: 1px solid #E3E3E3;
display: inline-flex;
margin-bottom: 0;
padding-bottom: 10px;
width: 100%;
}
.x-product-layout-purchase__pricing-original,
.x-product-layout-purchase__pricing-current {
font-size: 2.2rem;
font-weight: 600;
}
.x-product-layout-purchase .is-required {
font-weight: 500;
padding-bottom: 6px;
}
.x-product-layout-purchase__options {
padding-top: 0px;
}
.x-product-layout-purchase__options-attribute .c-form-label {
font-size: 15px;
font-weight: 500;
margin-bottom: 7px;
margin-top: -3px;
}
.t-quantify .c-control-group__button {
padding-bottom: calc(0.63em * 2 + 0px);
padding-top: calc(0.63em * 2 + 1px);
}
.t-quantify .c-control-group__button,
.t-quantify .c-control-group__field {
flex-basis: calc(100% / 3);
max-width: calc(100% / 3);
}
.x-product-description {
margin-bottom: 6rem;
padding-top: 6rem;
}
.x-product-layout-purchase__cta .c-button--huge {
padding-bottom: calc(0.3em * 3 - 1px);
padding-top: calc(0.3em * 3 - 1px);
}
.x-product-layout-purchase__cta> .o-layout .o-layout span {
margin-bottom: 10px;
}
.x-product-layout-purchase__cta> .o-layout .o-layout span:last-child {
margin-bottom: 7px;
}
.x-product-description .x-flex-tabs__tab {
padding-bottom: 0.75em;
padding-top: 0.75em;
}
.x-product-layout .c-form-list .product-description {
border-bottom: 1px solid #E3E3E3;
margin-bottom: 0;
padding: 10px 0px 12px;
}
.x-product-layout .c-form-list .product-description h2 {
font-size: 15px;
}
.x-product-layout .c-form-list .product-description p {
margin: 0;
}
.readmore-desc {
color: #194A8F;
cursor: pointer;
}
.select-column {
flex: 50%;
position: relative;
}
.select-column.color-swatch {
flex: 70%;
}
.get-trial {
position: relative;
}
.select-column.color-swatch:after,
.get-trial:after {
border-right: 1px solid #E3E3E3;
content: "";
height: 100%;
opacity: 0;
position: absolute;
right: 0;
top: 0;
}
.get-trial:after {
opacity: 1;
right: 16%;
}
.choose-color-sync .c-form-label.c-control-group__label {
max-width: 100%;
width: 100%;
}
.choose-color-sync .c-form-label.c-control-group__label span {
display: block;
padding-bottom: 5px;
}
.select-color .color-swatch {
border-bottom: 1px solid #E3E3E3;
margin-bottom: 15px;
}
.product-trial-kit span {
display: block;
line-height: normal;
}
.freekit-icon {
background-image: url(../../../../graphics/00000001/toolkit-icon.png);
}
.calc-icon {
background-image: url(../../../../graphics/00000001/calc-icon.png);
}
.freekit-icon,
.calc-icon {
background-color: #939191;
background-position: center;
background-repeat: no-repeat;
background-size: 22px;
border-radius: 100%;
display: inline-block;
height: 35px;
margin-right: 5px;
padding: 5px;
vertical-align: middle;
width: 35px;
}
.freekit-icon {
vertical-align: top;
}
.product-trial-kit a:hover .freekit-icon,
.product-trial-kit a:hover .calc-icon {
background-color: #194A8F;
}
.coverage-calc a {
display: inline;
}
.coverage-calc a span {
text-decoration: underline;
}
.product-trial-kit a:hover,
.coverage-calc a:hover {
color: #194A8F;
text-decoration: none;
}
.coverage-calc a:hover .calc-icon {
background-color: #194A8F;
}
.product-trial-kit {
padding-bottom: 9px;
}
.x-product-layout-purchase__kits,
.x-product-layout-purchase__options {
border-bottom: 1px solid #E3E3E3;
margin-bottom: 0;
padding-bottom: 7px;
}
.t-product-cta-outer {
position: relative;
}
.t-product-cta-wrapper {
height: 100%;
}
.product-bottom-container {
margin-top: 1%;
}
.trial-product-flag {
background: #939191;
color: #FFF;
font-size: 26px;
height: 58px;
margin-bottom: 1.5em;
padding: 0.4em 1em;
position: relative;
text-align: left;
width: 185px;
}
.trial-product-flag:before {
border: 29px solid #939191;
bottom: 0em;
content: "";
display: block;
position: absolute;
z-index: -1;
}
.trial-product-flag:before {
border-left-width: 1.6em;
border-right-color: transparent;
right: -2em;
}
.trial-product-image a {
display: inline-block;
margin-bottom: 20px;
max-width: 200px;
}
.trial-kit-container {
box-shadow: 0 0 0 1px rgba(222, 222, 222, 0.1), 0 0px 8px rgba(0, 0, 0, 0.1);
height: 100%;
padding-bottom: 45px;
padding-top: 20px;
text-align: center;
}
.trial-product-subtitle {
background: #E4F4FD;
padding: 15px 10px;
}
.trial-kit-container .x-product-layout-purchase__name {
font-size: calc(16px * 1.125);
margin-bottom: 20px;
padding: 0 15px;
}
.trial-product-cover {
font-size: 16px;
padding: 0 14px;
}
.trial-product-price {
font-size: 1.25rem;
font-weight: 500;
}
.customer-also-bought {}
.customer-also-bought h4.c-heading-charlie {
font-size: 24px;
font-weight: 500;
}
.x-product-layout-purchase {
margin-bottom: 0;
}
.related-products {
/* padding:0 30px; */
}
.related-products .group-stars .ind_cnt {
display: none;
}
.customer-also-bought .owl-prev,
.customer-also-bought .owl-next {
margin-top: -50px;
outline: 0;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
transform: translateY(-50%);
}
.customer-also-bought .owl-carousel .owl-nav button.owl-prev {
border-bottom: 4px solid;
border-color: #D3D3D3;
border-left: 4px solid;
height: 30px;
left: 0px;
transform: rotate(45deg);
width: 30px;
}
.customer-also-bought .owl-carousel .owl-nav button.owl-next {
background: transparent;
border-bottom: 4px solid;
border-color: #D3D3D3;
border-left: 4px solid;
height: 30px;
right: 0;
transform: rotate(-135deg);
width: 30px;
}
.customer-also-bought .owl-carousel .owl-nav button span {
display: none;
}
.customer-also-bought .x-product-list__name {
/* min-height:45px;
*/
font-weight: 400;
margin-bottom: 4px;
padding: 0 10px;
}
.customer-also-bought .x-product-list__price {}
.customer-also-bought .x-product-list__image {
left: 0;
/* max-width:180px!important; */
margin-left: auto;
margin-right: auto;
max-height: 640px;
object-fit: cover;
top: 0;
vertical-align: top;
}
.customer-also-bought .x-product-list__item {
margin: 10px 20px 0 30px;
margin-bottom: 15px;
padding: 0 0 53px;
position: relative;
}
.customer-also-bought .x-product-list__item:hover {
box-shadow: 0 0 11px 5px rgba(222, 222, 222, 0.2), 0 2px 7px rgba(0, 0, 0, 0.2);
}
.x-product-list {}
.customer-also-bought .x-carousel__item {
align-items: inherit;
padding: 0 25px 10px;
}
.more-detail-button.related-product {
bottom: 15px;
margin: 0 auto;
opacity: 0;
position: absolute;
width: 100%;
}
.customer-also-bought .x-product-list__item:hover .more-detail-button.related-product {
opacity: 1;
}
@media ( max-width: 768px ) {
.customer-also-bought .owl-carousel .owl-nav button.owl-next {
right: 0px;
}
}
.product-bundle-items {
float: none !important;
}
.bundle-container {
border-top: 1px solid #E3E3E3;
margin-top: 20px;
padding-top: 25px;
}
.bundle_item_container {
align-items: center;
}
.bundle_item_group figcaption {
min-height: 74px;
text-align: center;
}
.bundle_item_group .c-form-select__dropdown {
font-size: 14px;
height: 32px;
}
.complete-bundle-item-name {
font-size: 12px;
padding: 2%;
text-align: center;
}
.bundle_item_group .x-product-list__name {
font-size: 13px;
font-weight: 400;
}
.bundle_item_group .x-product-layout-purchase__options-attribute {
display: block;
margin-right: 0;
text-align: center;
}
.bundle_item_group .x-product-layout-purchase__options-attribute .c-form-label {
font-size: 0.875rem;
font-weight: 500;
}
.bundle_item_group .product-attributes.show-attr {
margin-top: 0;
}
.purchase-buttons-spacer .c-button {
font-size: 0.75em;
}
.bundle-complete-item .product-details-2 .product-attributes {
display: none;
}
.prod-videos iframe {
padding: 0 10px;
width: 100%;
}
.prod-videos iframe {
width: 100% !important;
}
.swatch-popup #swatches li {
display: inline-block !important;
}
.swatch-popup #swatches li.active {
border: 2px solid #ED1E24;
-webkit-border-radius: 100%;
-moz-border-radius: 100%;
border-radius: 100%;
}
.swatch-popup {
display: none;
}
.swatch-popup {
background-color: #FFF;
left: 0;
margin: 0 auto;
max-width: 900px;
padding: 3% 30px;
position: fixed;
right: 0;
top: 25%;
width: 100%;
z-index: 99999;
}
.swatch-popup-overlay {
background-color: #000;
float: left;
height: 100%;
left: 0;
opacity: 0.8;
position: fixed;
top: 0;
width: 100%;
z-index: 999;
}
.close-the-spop {
background-color: #000;
border-radius: 20px;
color: #FFF;
padding: 0.5% 10px;
position: absolute;
right: 2%;
text-align: center;
top: 5%;
width: 32px;
}
.close-the-spop a {
color: #FFF;
font-size: 14px;
font-weight: bold;
}
.swatch-popup-overlay {
display: none;
}
.swatch-main-container {
padding-right: 19px;
}
#swatches li {
border-radius: 15px;
cursor: pointer;
margin-bottom: 2.4%;
margin-right: 4.5% !important;
}
.swatch-main-container div#swatches {
height: 100%;
max-height: 74px;
overflow-y: auto;
}
.prod-item-detail .select-column.color-swatch #swatches li {
margin-right: 4% !important;
}
.swatch-main-container div#swatches::-webkit-scrollbar {
-webkit-appearance: none;
}
.swatch-main-container div#swatches::-webkit-scrollbar:vertical {
width: 8px;
}
.swatch-main-container div#swatches::-webkit-scrollbar:horizontal {
height: 8px;
}
.swatch-main-container div#swatches::-webkit-scrollbar-thumb {
background-color: #E1E1E1;
border: 2px solid #E1E1E1;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
}
.swatch-main-container div#swatches::-webkit-scrollbar-track {
background-color: #FFFFFF;
border: 2px solid #E1E1E1;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
}
#swatches li img {
border-radius: 15px;
font-size: 0;
}
.show-all-swatches a {
font-size: 12px;
text-decoration: underline;
}
.video-li {
cursor: pointer !important;
position: relative;
}
img.youtube-play-button {
left: 0;
margin: 0 auto;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
}
.slick-prev:before,
.slick-next:before {
color: #404146 !important;
font-family: fontAwesome !important;
font-size: 30px !important;
}
.slick-prev:before {
content: "\f104" !important;
}
.slick-next:before {
content: "\f105" !important;
}
.slick-next.slick-disabled:before,
.slick-prev.slick-disabled:before {
opacity: 1 !important;
}
#lightSlider .slick-prev,
#lightSlider .slick-next {
margin-top: -10px;
}
.slick-list li {
outline: none;
}
.x-product-layout .slick-list li img {
border: 1px solid #DDDDDD;
box-shadow: none;
display: inline-block;
}
.x-product-layout .slick-list li img.youtube-play-button {
border: 0;
}
@media( min-width: 768px ) {
#thumbnails .slick-prev {
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
left: 10px;
margin: 0 auto;
right: 0;
top: -28px;
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
}
#thumbnails .slick-next {
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
}
#thumbnails .slick-next {
bottom: -28px;
left: 10px;
margin: 0 auto;
right: 0;
top: auto;
}
#thumbnails .slick-list {
height: 450px !important;
}
.big-image-gallery {
display: block;
margin: 0 auto;
width: 77%;
}
img.youtube-thumb {
margin: 0 auto;
width: 80px;
}
.customer-also-bought .x-product-list__link {
padding: 20px 0;
}
}
@media( min-width: 996px ) {
.bundle_item_group .c-form-select {
width: 68%;
}
#thumbnails .slick-list {
height: 432px !important;
}
.big-image-gallery {
height: 100%;
width: 100%;
}
.slick-slider .slick-arrow {
opacity: 0;
}
.slick-slider:hover .slick-arrow {
opacity: 1;
}
.slick-slider .slick-prev.slick-arrow {
left: -26px;
}
}
#lightSlider .slick-slide {
margin: 0 5px;
}
#thumbnails .slick-slide {
margin: 0 0 8px;
}
.customer-image-text {
font-size: 14px;
font-weight: 300;
line-height: normal;
margin-top: 10px;
}
.customer-image-text a {
color: #ED1E24;
text-decoration: underline;
}
.fancybox-show-thumbs .fancybox-thumbs {
background: transparent;
text-align: center;
}
.fancybox-thumbs__list {
display: inline-block;
width: auto !important;
}
.fancybox-navigation .fancybox-button {
background-color: transparent;
border: 1px solid rgba(180, 180, 180, 0);
border-radius: 100%;
box-shadow: none;
cursor: pointer;
font: 900 34px/1 "magictoolbox-thin";
-webkit-font-smoothing: antialiased;
height: 60px;
max-height: none;
max-width: none;
min-height: 0;
min-width: 0;
position: absolute;
speak: none;
text-align: center;
text-transform: none;
width: 60px;
}
.fancybox-navigation .fancybox-button:before {
color: inherit !important;
display: inline;
font: inherit !important;
-webkit-font-smoothing: inherit !important;
position: static;
}
button.fancybox-button.fancybox-button--arrow_right:before {
content: "\a003";
}
button.fancybox-button.fancybox-button--arrow_left:before {
content: "\a002";
}
.fancybox-navigation .fancybox-button div {
display: none;
}
.fancybox-thumbs__list a {
box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.3);
}
@media ( max-width: 47.9em ) {
.related-bundle-container {
margin-top: 50px;
}
.product-bottom-container {
margin-top: 2%;
}
.more-detail-button.related-product {
opacity: 1;
}
.x-product-description {
margin-bottom: 0;
padding-top: 0rem;
}
.x-product-description .x-flex-tabs__tab {
align-items: center;
display: flex;
justify-content: space-between;
}
.get-trial:after {
right: -4%;
}
.x-product-description .x-flex-tabs__tab:after {
content: "+";
display: inline-block;
font-size: 1rem;
line-height: 1;
}
.x-product-description input[ data-flex-tab ]:checked+ .x-flex-tabs__tab~ .x-flex-tabs__tab:after {
content: "-";
}
#thumbnails,
#lightSlider {
margin: 0 20px;
}
#thumbnails {
margin-bottom: 5px;
margin-top: 20px;
}
#lightSlider {
margin-top: 20px;
}
#thumbnails .slick-slide {
display: inline-block;
float: none;
margin: 0 5px;
}
a[ data-zoom-id ] img,
.mz-thumb img {
box-shadow: none !important;
}
.slick-slide img {
display: inherit !important;
}
.plus-sign,
.qual-sign {
display: none;
}
.bundle-item-container .c-button--full {
width: 100% !important;
}
figure.o-layout__item.u-text-center.x-product-layout-images {
margin-bottom: 40px;
}
.mob-order {
order: 1;
}
.customer-also-bought .x-product-list__name {
min-height: 0;
}
}
.x-product-description .x-flex-tabs__content {
/* font-size:0.875rem; */
}
.x-product-description .x-flex-tabs__content h2 {
clear: both;
font-size: 20px;
font-weight: 500;
margin-bottom: 10px;
/* padding-top:20px;
*/
padding-top: 0;
}
figure.wpb_wrapper.vc_figure {
margin-left: 0;
/* margin:20px 0;
*/
margin-right: 0;
}
figcaption.vc_figure-caption {
font-size: 14px;
font-weight: 600;
margin-bottom: 10px;
margin-top: 30px;
}
.x-flex-tabs iframe {
margin-bottom: 20px;
width: 50%;
}
.x-product-description fieldset {
width: 100%;
}
figure.wpb_wrapper.vc_figure {
margin-left: 0;
}
img {
max-width: 100% !important;
}
.full-width .vc_col-sm-6,
.full-width .wpb_column.vc_column_container.vc_col-sm-3 {
width: 100%;
}
@media( min-width: 768px ) {
.wpb_single_image,
.vc_col-sm-6 {}
.vc_col-sm-6 {
display: inline-block;
padding: 0 11px 0 0;
width: 49%;
}
.vc_col-sm-4 {
display: inline-block;
padding: 0 11px 0 0;
width: 25%;
}
.column-set .vc_col-sm-4 {
display: inline-block;
width: 33%;
}
.column3 .wpb_single_image,
.vc_col-sm-6 .wpb_single_image {
width: 100%;
}
}
.wpb_column.vc_column_container.vc_col-sm-3 {
display: inline-block;
vertical-align: top;
width: 24%;
}
.x-product-description .x-flex-tabs__content .column3 h2 {
font-size: 18px;
padding-top: 0;
}
.column3 figure.wpb_wrapper.vc_figure {
margin: 10px 0;
}
.column-set .vc_col-sm-4 .wpb_single_image {
width: 100%;
}
.column-set figure.wpb_wrapper.vc_figure,
.vc_col-sm-6 figure.wpb_wrapper.vc_figure {
margin-bottom: 0;
}
@media( max-width: 768px ) {
.wpb_column.vc_column_container.vc_col-sm-3 {
vertical-align: top;
width: 48%;
}
}
@media( max-width: 767px ) {
.x-product-description .x-flex-tabs__content .column3 h2 {
font-size: 13px;
}
.t-account-landing-section__content .c-table-responsive__row {
border-bottom: 1px solid #CCCCCC;
}
.t-account-landing-section__content .c-table-responsive__row:last-child {
border: 0;
}
.t-account-landing-section .c-heading-echo {
padding: 0;
}
.more-images a img {
width: 100%;
}
}
.t-basket__product-summary .c-table-responsive__row,
.t-basket__order-summary .c-table-simple__row {
border-color: #EAEAEA;
}
.t-basket__product-summary thead {
border-top: 1px solid #EAEAEA;
}
.t-basket__product-summary tbody .c-table-responsive__cell {
padding-top: 1.5rem;
}
.t-basket__product-details {
font-size: 0.875rem;
font-weight: 600;
}
.t-basket-update .x-quantify {
font-size: 0.875rem;
width: 10em;
}
.t-basket-update .x-quantify .c-control-group__button {
font-size: 0.875em;
padding-bottom: calc(0.625em * 2 + 1px);
padding-top: calc(0.625em * 2 + 1px);
}
.t-basket-update .x-quantify .c-control-group__button,
.t-basket-update .x-quantify .c-control-group__field {
flex-basis: calc(100% / 3);
max-width: calc(100% / 3);
}
.t-basket__product-remove {
height: 3em;
line-height: 3;
padding: 0;
width: 3em;
}
.t-basket__product-remove span {
line-height: 3;
}
.t-basket_basket-coupon-form-toggle:checked~ label> .u-icon-add:before {
content: "\3c";
}
.t-basket_basket-coupon-form-toggle:checked~ .t-basket_coupon-form {
height: 3rem;
-webkit-transform: scaleY(1);
-ms-transform: scaleY(1);
transform: scaleY(1);
}
.t-basket_coupon-form {
height: 0;
margin-bottom: 0;
-webkit-transform: scaleY(0);
-ms-transform: scaleY(0);
transform: scaleY(0);
transform-origin: top;
transition: all ease-in-out 0.2s;
}
.circle-wishlist {
border: 1px solid #939192;
border-radius: 100%;
color: #939192;
display: inline-block;
font-size: 14px;
height: 25px;
line-height: 17px;
margin-right: 6px;
padding: 5px;
text-align: left;
vertical-align: middle;
width: 25px;
}
.circle-wishlist:hover {
background: #1C55A6;
color: #FFFFFF;
}
.t-basket {
margin-top: 2rem;
}
.t-ocst-account-message {
display: block;
padding: 1em;
}
.t-checkout-log-in__form {
display: block;
margin-bottom: 0;
max-height: 0;
opacity: 0;
transition-delay: 0.15s, 0s, 0s;
visibility: hidden;
}
.t-checkout-log-in__label {
cursor: pointer;
}
.t-checkout-log-in__trigger:checked~ .t-checkout-log-in__form {
display: block;
max-height: 9rem;
opacity: 1;
overflow: hidden;
padding-top: 1em;
transition: visibility 0s ease, max-height 0.3s ease, opacity 0.3s ease;
transition-delay: 0s;
visibility: visible;
}
.guest-checkout {
height: auto;
position: relative;
}
#js-ORDL .guest-checkout:before {
background: #DDDDDD;
border-left: 1px solid #DDDDDD;
content: "";
height: 100%;
left: -65px;
position: absolute;
width: 1px;
}
.message-box-register {
font-size: 18px;
margin-left: -20%;
padding: 2% 0;
}
/* .guest-checkout:after {
content: '';
border-left: 1px solid #dddddd;
position: absolute;
left: -8px;
height: 100%;
background: #dddddd;
width: 1px;
} */
.t-checkout-basket-summary {
background-color: #F2F2F2;
height: calc(100% - 1rem);
padding: 2rem 2rem;
}
.t-checkout-basket-summary__product-summary tbody .c-table-simple__cell {
padding-top: 1.5rem;
}
.t-checkout-basket-summary__image {
margin-right: 2rem;
}
.t-checkout-basket-summary__promo-form,
.t-checkout-basket-summary__promo-form:first-child,
.t-checkout-basket-summary__promo-form:last-child {
background-color: #DEDEDE;
display: block;
margin: -1px -2rem;
padding-left: 2rem;
padding-right: 2rem;
}
.t-page-ocst .t-site-footer__disclaimer {
text-align: center !important;
}
@media ( max-width: 59.9em ) {
.t-page-ocst .t-site-header__logo,
.t-page-osel .t-site-header__logo,
.t-page-opay .t-site-header__logo {
flex-basis: calc(100% / 12 * 12);
max-width: calc(100% / 12 * 12);
}
}
@media ( min-width: 90em ) {
.t-page-ocst .t-main-content-element,
.t-page-osel .t-main-content-element,
.t-page-opay .t-main-content-element {
max-width: none;
padding-left: 0;
padding-right: 0;
}
.t-checkout-basket-summary {
height: 100%;
}
.t-checkout-basket-summary .c-table-simple {
width: 60%;
}
.t-checkout-basket-summary__promo-form,
.t-checkout-basket-summary__promo-form:first-child,
.t-checkout-basket-summary__promo-form:last-child {
margin: -1px 0;
}
.t-page-ocst .t-site-footer,
.t-page-osel .t-site-footer,
.t-page-opay .t-site-footer {
padding-top: 0;
}
.t-page-ocst .t-site-footer__disclaimer,
.t-page-osel .t-site-footer__disclaimer,
.t-page-opay .t-site-footer__disclaimer {
padding-bottom: 1em;
padding-top: 1em;
text-align: left;
}
.t-page-osel .t-site-footer__disclaimer .o-layout__item,
.t-page-opay .t-site-footer__disclaimer .o-layout__item {
flex: 0;
white-space: nowrap;
}
}
@media ( min-width: 48em ) {
.t-payment-cta {
flex-grow: 0;
}
.t-payment-form {
justify-content: center;
}
.t-payment-form .o-layout__item {
align-items: center;
display: flex;
max-width: 75%;
}
.t-payment-form .c-form-label {
margin-right: 1rem;
width: 25%;
}
.t-payment-form .c-form-input {
max-width: 50%;
}
.t-payment-form .c-form-input--cvv {
margin-right: 0.5rem;
max-width: 25%;
}
.t-payment-form .c-control-group {
flex-grow: 1;
max-width: 50%;
}
}
.t-checkout-customer-summary {
margin-bottom: 1rem;
padding: 1rem 2rem 0;
}
.t-checkout-customer-summary .c-keyline {
border-color: #C0C0C0;
}
.t-account-landing-section {
margin-bottom: 1rem;
}
.t-account-landing-section .x-category-tree__label {}
.t-account-landing-section .c-heading-echo {
font-size: 14px;
}
@media ( min-width: 48em ) {
.t-account-landing-section .c-heading-echo {
align-self: center;
font-size: 15px;
}
}
.t-account-landing-section__content {
padding-bottom: 0;
padding-right: 0;
padding-top: 0.5rem;
}
.t-account-landing-section__content.x-category-tree__row {}
.t-account-landing-section__content .x-category-tree__list--level-1:first-child .x-category-tree__link {
border: 0;
}
.t-account-landing-section__content.x-category-tree__row span.x-category-tree__link:hover {
text-decoration: none;
}
.t-account-landing-section__content .x-category-tree__link {}
.t-account-landing-section__content .x-category-tree__list--level-1 .x-category-tree__link {
font-weight: 500;
margin-top: 5px;
padding-bottom: 8px;
padding-left: 0;
padding-top: 10px;
}
.move-wishlist ul.c-form-list {
padding-left: 35px;
}
.t-wish-list-search .c-control-group {
border: 1px solid #EAEAEA;
}
.t-wish-list-search__button {
padding-left: calc(1em - 1px);
padding-right: calc(1em - 1px);
}
.t-wish-list__item .c-control-group__button {
flex: 1 1 50%;
padding-left: 0;
padding-right: 0;
}
.visuallyhidden {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
.print-content-prod.print-footer {
display: none;
}
.print-content-prod {
display: none;
}
.content-padd {
padding-left: 15px;
}
.direct-color-content li {
margin-bottom: 10px;
}
.imgborder img {
border: 1px solid #036;
}
.serving {
clear: both;
font-size: 13px;
}
.serving .list {
display: none;
margin: 10px 0;
}
.serving .on {
display: block;
}
.serving label {}
#navsite {
border-bottom: 3px solid #999;
list-style: none;
margin-bottom: 20px;
padding: 0;
}
#navsite ul {
list-style: none;
margin-bottom: -3px;
margin-left: 0;
margin-top: 4px;
padding: 3px 0;
}
#navsite li {
width: auto;
}
#navsite ul li,
#navsite li.noncurrent {
display: inline-block;
list-style: none;
margin-right: 1px;
}
#navsite ul li a,
#navsite li.noncurrent a {
display: block;
font-size: 15px;
font-weight: 200;
padding: 5px 16px;
text-decoration: none;
}
#navsite a:link,
#navsite a:visited {
color: #000;
}
#navsite li.current {}
#navsite li.current a {
background: #194A8F;
border-radius: 4px 4px 0 0;
color: #FFFFFF;
}
#srchUtil .search-txt {
font-size: 0.8em;
vertical-align: middle;
width: 7em;
}
#srchUtil .search-btn {
vertical-align: middle;
}
.input-wrappper .c-form-input {
width: 80%;
}
.popup-cal .caltypes .list .c-form-list__item {
max-width: 100%;
width: 100%;
}
#slabs ul.c-form-list .c-form-list__item.cubix-yard,
#footings ul.c-form-list .c-form-list__item.cubix-yard,
#columns ul.c-form-list .c-form-list__item.cubix-yard {
width: 80%;
}
#slabs ul.c-form-list li.c-form-list__item,
#slabs #bagsone .input-wrappper,
#footings ul.c-form-list li.c-form-list__item,
#footings #bagstwo .input-wrappper,
#columns ul.c-form-list li.c-form-list__item,
#columns #bagsthree .input-wrappper {
width: 33%;
}
#slabs ul.c-form-list li.c-form-list__item:nth-child(4),
#slabs ul.c-form-list li.c-form-list__item:nth-child(6),
#footings ul.c-form-list li.c-form-list__item:nth-child(4),
#footings ul.c-form-list li.c-form-list__item:nth-child(6),
#columns ul.c-form-list li.c-form-list__item:nth-child(3),
#columns ul.c-form-list li.c-form-list__item:nth-child(5) {
padding-right: 28px;
width: 100%;
}
#slabs #bagsone .o-layout,
#footings #bagstwo .o-layout,
#columns #bagsthree .o-layout {
margin: 0;
}
.columns-calculator h5 {
font-size: 14px;
font-weight: 500;
margin-bottom: 6px;
margin-top: 17px;
}
.popup-cal .caltypes .list .c-form-list__item input[ type="reset" ] {
background-color: #C1BCBC;
font-size: 16px;
font-weight: 500;
height: 45px;
line-height: 10px;
text-transform: uppercase;
width: 40%;
}
.popup-cal .caltypes .list .c-form-list__item input[ type="button" ] {
float: right;
font-size: 16px;
font-weight: 500;
height: 45px;
line-height: 10px;
text-transform: uppercase;
width: 40%;
}
.contact-need-help .support-links {
border: 0;
box-shadow: none;
display: block !important;
height: auto !important;
padding: 0 !important;
position: static;
}
.contact-need-help .help-link ul {
margin-left: 0;
}
.contact-need-help .help-link address {
padding-left: 0;
}
.help-link address {
margin-bottom: 30px;
}
.help-link a.c-button.u-bg-blue.u-text-bold.radius100 {
font-size: 15px;
min-width: 212px;
}
@media( max-width: 768px ) {
.contact-need-help .help-link {
float: left;
padding-right: 0;
width: 50%;
}
.contact-need-help .help-link .radius100 {
font-size: 12px;
}
span.showall {
width: 100% !important;
}
}
@supports (-ms-ime-align:auto) {
.u-width-2--m {
flex-basis: calc(16%);
}
}
input[ type=number ]::-webkit-outer-spin-button,
input[ type=number ]::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
input[ type=number ] {
-moz-appearance: textfield;
}
.home.blog .page-header h2.page-title {
font-size: 20px;
font-weight: 500;
}
.home.blog .entry-meta {
margin-top: 15px;
}
.home.blog h3.entry-title {
font-size: 22px;
}
.home.blog .entry-content .wpb_text_column .wpb_wrapper h1 {
font-size: 20px;
line-height: normal;
margin-bottom: 10px;
}
.home.blog .post-thumbnail {
margin-bottom: 30px;
max-width: 64%;
}
.home.blog .entry-content .wpb_text_column .wpb_wrapper h3 {
font-size: 22px;
font-weight: 500;
}
.broken_link,
a.broken_link {
text-decoration: none;
}
.post-line-heading .vc_separator.vc_separator_align_left h4 {
font-size: 19px;
font-weight: 500;
}
.post-line-heading .vc_gitem-zone {
border: 3px solid #DDDDDD;
}
.post-line-heading figure.wpb_wrapper.vc_figure {
margin: 0;
}
.logn-welcome-msg {
background-color: #FFD6D7;
border: 1px solid #FFD6D7;
border-radius: 4px;
margin-bottom: 3%;
padding: 1%;
width: 100%;
}
.logn-welcome-msg p {
font-size: 14px;
margin: 1%;
}
.logn-welcome-msg a {
color: inherit;
text-decoration: underline;
}
div#residential_address_field {
border: 1px solid #C0C0C0;
float: left;
margin: 5% 0 1.5% 0;
min-height: 53px;
padding: 5% 4% 4%;
position: relative;
width: 100%;
}
.osel-address-type {
float: left;
width: 100%;
}
#residential_address_field .field-class-label {
background-color: #FFF;
color: #707070;
font-weight: 600;
padding: 0 2%;
position: absolute;
top: -10px;
}
#residential_address_field .field-class-data {
float: left;
margin-top: 0px;
width: 100%;
}
.ocst-addt-res-label {
float: left;
margin-right: 0 !important;
}
.ocst-addt-com-label {
float: right;
margin-right: 0 !important;
}
.field-class-label {
color: #404146;
font-size: 14px;
font-weight: 500;
text-transform: uppercase;
}
.saved-ship-row {
margin-bottom: 0;
}
#js-OCST select {
height: 45px;
}
#js-OCST input[ type="text" ] {
height: 45px;
}
#js-OCST input[ type="email" ] {
height: 45px;
}
#js-OCST input[ type="password" ] {
height: 45px;
}
#js-OCST .t-checkout-log-in__form input.c-button.c-button--full.c-button--huge.u-bg-gray-50.u-font-small.u-text-bold.u-text-uppercase {
height: 45px;
}
#js-ORHL .o-layout--justify-around .c-form-list__item {
max-width: 100% !important;
text-align: left;
}
#js-ORHL .user-signup:before {
background: #DDDDDD;
border-left: 1px solid #DDDDDD;
content: "";
height: 100%;
left: -49px;
position: absolute;
width: 1px;
}
#js-ORHL section.o-layout.o-layout--justify-around {
margin-top: 2%;
}
a#miniModal_1 {
float: right;
text-align: right;
}
#js-WLGN .o-layout--justify-around .c-form-list__item {
max-width: 100% !important;
text-align: left;
}
#js-WLGN .user-signup:before {
background: #DDDDDD;
border-left: 1px solid #DDDDDD;
content: "";
height: 100%;
left: -49px;
position: absolute;
width: 1px;
}
.user-signup h2.c-heading-charlie.u-text-regular {
text-align: left;
}
#js-WLGN section.o-layout.o-layout--justify-around {
margin-top: 2%;
}
#js-ORDL .o-layout--justify-around .c-form-list__item {
max-width: 100% !important;
text-align: left;
}
.o-layout__item.u-width-12.u-width-12--m.u-width-12--l.u-text-left.continue-as-guest a {
font-size: 1.25em;
}
.o-layout__item.u-width-12.u-width-12--m.u-width-12--l.u-text-left.continue-as-guest .u-font-small {
font-size: 13px;
}
.o-layout__item.u-width-12.u-width-12--m.u-width-12--l.u-text-left.continue-as-guest a:hover {
text-decoration: underline;
}
#js-BASK a.c-button.c-button--full.c-button--huge.u-bg-blue.u-color-white.u-text-bold {
font-size: 16px;
padding: 4%;
}
.x-mini-basket .x-mini-basket__cta a.c-button.c-control-group__button.c-button--full.c-button--huge.u-bg-gray-40.u-font-small.u-text-bold.u-text-uppercase {
font-size: 15px;
}
.x-mini-basket .x-mini-basket__cta a.c-button.c-control-group__button.c-button--full.c-button--hollow.c-button--huge.u-bg-white.u-color-gray-40.u-font-small.u-text-bold.u-text-uppercase {
line-height: 28px;
}
#js-OPAY section.o-layout.u-grids-1.u-grids-3--m.t-checkout-customer-summary.u-bg-gray-10 a.u-text-uppercase.u-font-tiny.u-color-black {
font-size: 11px;
font-weight: 700;
text-decoration: underline;
}
.saved-ship-row label.c-form-label.u-text-bold.is-required.u-font-tiny {
color: #707070;
}
#js-WLST .o-layout--justify-around .c-form-list__item {
max-width: 100% !important;
text-align: left;
}
#js-WLST .user-signup:before {
background: #DDDDDD;
border-left: 1px solid #DDDDDD;
content: "";
height: 100%;
left: -49px;
position: absolute;
width: 1px;
}
#js-WLST section.o-layout.o-layout--justify-around {
margin-top: 2%;
}
.custom-msg {
margin-bottom: 0;
}
a#miniModal_0.messaage-text-forgot {
float: none;
}
.field-class-data input[ type="radio" ] {
position: relative;
top: 2px;
}
.field-class-data label {
color: #1F1F22 !important;
display: inline-block;
font-size: 15px !important;
margin-right: 5%;
text-transform: capitalize !important;
}
.field-class-data {
float: left;
font-size: 16px;
margin-top: 5px;
width: 100%;
}
.additional-container-new p {
float: left;
line-height: 15px;
margin-right: 2%;
margin-right: 2%;
margin-top: 0;
width: 31%;
}
.additional-container-new p:last-child {
margin-right: 0;
width: 34%;
}
.additional-container-new .input-text {
-moz-appearance: none;
-webkit-appearance: none;
background-color: #FFF;
border: 1px solid #C0C0C0;
border-radius: 0.125em;
box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2);
color: #1F1F22;
display: inline-block;
font-size: 14px;
height: 35px;
line-height: calc(2.875em - (1px * 2));
outline: 0;
padding: 0 calc(1em / 2);
transition: box-shadow 0.25s ease, border-color 0.25s ease;
width: 100%;
}
.additional-container-new .select.select2-hidden-accessible.enhanced {
-webkit-appearance: none;
-moz-appearance: none;
background-color: #FFF;
border: 1px solid #C0C0C0;
border-radius: 0.125em;
box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2);
color: #1F1F22;
cursor: pointer;
font-size: 14px;
height: 35px;
line-height: calc(2.875em - (1px * 2));
outline: 0;
padding: 0 calc(1em / 2);
transition: box-shadow 0.25s ease, border-color 0.25s ease;
width: 100%;
}
.select-extra-data:after {
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAAAkCAYAAAA5DDySAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAPVJREFUeNrk2s0NgzAMhmFno47EKGzQETpSR2CEjkCjyEg0aiAhP7Y/IuUSuLyPhDg4RLycc5PfH78fBLy48/3TyYcrb1iEv53RISxCqpM4dkVGSMSHTakHKAhH8RvAExXhLD58AvziCw0hJz7+E8AgFMcjIVyOR0CojreM0CzeIkLzeEsI3eItIHSP14wwLF4jwvB4TQhi8RoQxOMlEdTESyCoix+JoDZ+BIL6+J4IZuJ7IJiLb4lgNr4Fgvn4GgSY+CsIcPGFCDP0bCIDAXowU4OANZ8sRMCcUGciYN9ROEGAv6BxhHCP+B3CvLubsEjFfwUYAKjtGJxFvDJsAAAAAElFTkSuQmCC) no-repeat center center;
background-size: contain;
color: #1F1F22;
content: "";
height: calc(1em / 2);
margin-bottom: calc(1em / 4);
pointer-events: none;
position: absolute;
right: calc(3em / 5);
top: 65%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
width: calc(1em / 2);
}
.additional-container-new label {
color: #404146;
float: left;
font-size: 14px;
font-weight: normal;
margin-bottom: 5px;
text-transform: capitalize;
width: auto;
}
.order-custom-field {
clear: both;
float: left;
margin-top: 1.5%;
width: 100%;
}
.opay-order-extra-data label {
font-weight: normal;
}
.opay-order-extra-data {
font-size: 12px;
}
.t-checkout-customer-summary p {
color: #404146;
}
.delivery-note-label {
font-weight: normal;
}
#js-INVC .t-checkout-customer-summary p.u-font-small.u-color-gray-40 {
margin-bottom: 0;
}
#js-INVC .t-checkout-customer-summary p.u-font-small.u-color-gray-40 label {
font-weight: 500;
}
#js-ORDS .t-checkout-customer-summary p.u-font-small.u-color-gray-40 {
margin-bottom: 0;
}
#js-ORDS .t-checkout-customer-summary p.u-font-small.u-color-gray-40 label {
font-weight: 500;
}
.field-class-data label {
font-weight: normal;
}
hr.c-keyline {
clear: both;
}
ul.c-form-list.o-layout.o-layout--wide.u-text-uppercase {
clear: both;
}
p#dc_hear_about_us {
position: relative;
}
p#project_details_field {
position: relative;
}
.resources-dc img {
max-width: 90% !important;
}
@media screen and ( min-width: 1400px ) {
div#residential_address_field {
min-height: 58px;
padding: 7% 4% 4%;
}
}
/* Global Notice Bar */
.global-notice-bar {
background-color: #F7F7F7;
color: #000;
font-size: 0.6875rem;
position: relative;
}
.global-notice-bar--inner {
padding: 0.5rem 1.5rem 0.5rem 1rem;
}
.global-notice-bar--inner a {
text-decoration: underline;
}
.global-notice-bar--close {
cursor: pointer;
line-height: 0;
position: absolute;
right: 0.5rem;
top: 50%;
transform: translateY(-50%);
}
@media screen and ( min-width: 40em ) {
.global-notice-bar {
font-size: 0.75rem;
}
}
/* Quickview Pop up Additional Styling */
.mfp-wrap.quickview-popup .mfp-content {
height: 650px;
max-height: 90%;
}
.t-quickview {
padding: 2rem;
}
/* View All Colors Popup */
.view-all-colors-popup .mfp-content {
background-color: #FFF;
height: 100%;
max-height: 500px;
max-width: 840px;
width: 100%;
}
.view-all-colors-popup .x-product-layout-purchase__swatches {
margin-top: 0;
}
.view-all-colors-popup .x-product-layout-purchase__swatches ul {
max-height: 500px;
overflow-y: auto;
padding: 2rem;
}
.view-all-colors-popup .x-product-layout-purchase__swatches ul li {
height: 135px;
margin-bottom: 30px;
width: 135px;
}
.view-all-colors-popup .x-product-layout-purchase__swatches li img {
height: 135px;
width: 135px;
}
.view-all-colors-popup .o-list-inline__item span.dc_swatch_name {
display: block;
font-size: 14px;
line-height: 15px;
text-align: center;
}
.u-color-blue-link {
color: #194A8F;
}
/* ### PROD_template_inline_css resource ### */
section.step1-headingblock {
margin: 1% 0;
padding: 2% 0;
}
.step1-headingblock .step-heading,
.step2-headingblock .step-heading,
.step3-headingblock .step-heading {
font-size: 1em;
}
.step1 .x-product-list .x-product-list__item,
.step2 .x-product-list .x-product-list__item {
margin-bottom: 1rem;
}
.step1 .x-product-list__item a,
.step2 .x-product-list__item a {
border: 1px solid #CCC;
box-shadow: 0 0 0 1px rgba(222, 222, 222, 0.1), 0 0 8px rgba(0, 0, 0, 0.1);
height: 100%;
margin: 0 1% 1% 0;
padding: 15% 5%;
}
.step-top-container {
margin-bottom: 30px;
margin-top: 30px;
}
.step-top-container.step-4-top {
margin-top: 5%;
}
.popup-cal.kit-page {
max-width: 100% !important;
overflow-y: visible;
padding: 0;
position: static !important;
transform: none !important;
}
@media( min-width: 48em ) {
.prod-item {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
}
.prod-item-detail {
padding-left: 30px;
width: 100%;
}
}
.prod-item-detail .product-price {
padding-left: 0;
padding-right: 0;
text-align: left;
}
.prod-item-detail .select-column.color-swatch {
max-width: 100%;
padding: 0;
}
.prod-item-detail .color-swatch ul {
max-height: 67px;
width: 45%;
}
.swatch-sections {
max-height: 66px;
overflow-y: scroll;
width: 63%;
}
.prod-item-detail .color-swatch ul .o-list-inline__item:not(:last-child) {
margin-bottom: 7px;
margin-right: 3px;
}
.x-product-layout-purchase__swatches li img {
border: 2px solid rgba(0,0,0,0);
border-radius: 100%;
cursor: pointer;
height: 30px;
object-fit: cover;
width: 30px;
}
.swatch-popup .x-product-layout-purchase__swatches li img {
height: 119px;
width: 120px;
}
.product-details .color-swatch .x-product-layout-purchase__swatches ul li {
height: 27px;
width: 27px;
}
.product-details .color-swatch .x-product-layout-purchase__swatches ul li img {
height: 25px;
width: 25px;
}
.swatch-popup .x-product-layout-purchase__swatches ul li {
height: 120px;
margin-bottom: 30px;
width: 120px;
}
.x-product-layout-purchase__swatches ul,
.quick-view-container .color-swatch ul {
max-height: 85px;
overflow-y: auto;
}
.swatch-popup .x-product-layout-purchase__swatches ul {
max-height: 500px;
overflow: inherit;
}
.x-product-layout-purchase__swatches .o-list-inline__item:not(:last-child) {
margin-right: 7px;
}
.t-page-built-kit-template .swatch-popup .x-product-layout-purchase__swatches ul li {
height: auto;
}
.t-page-built-kit-template .x-product-layout-purchase__swatches .o-list-inline__item:not(:last-child) {
margin-right: 28px;
}
.t-page-built-kit-template .swatch-popup .x-product-layout-purchase__swatches ul li {
margin-bottom: 17px;
}
.quick-view-container .o-list-inline__item:not(:last-child) {
margin-right: 10px;
}
.show-all-swatches {}
.kit_swatch {
font-size: 0;
}
.product-thumbnail {
align-self: center;
flex-shrink: 0;
margin-bottom: 0;
max-width: 170px;
width: 100%;
}
.discount-price {
margin-bottom: 20px;
}
.purchase-buttons table {
float: left;
width: 50%;
}
.go-to-cart {
align-self: center;
}
.quanity {
float: left;
width: 112px;
}
.add-button {
float: left;
margin-left: 6px;
text-align: right;
}
.quanity span {
float: left;
padding: 8px 0;
width: 35%;
}
.quanity input[ type=text ] {
float: left;
text-align: center;
width: 65%;
}
div#swatches .o-list-inline__item:not(:last-child) {
margin-right: 4px;
}
.prod-item-detail .x-product-layout-purchase__options-attribute .c-form-label span {
font-weight: 400;
}
.loading-mask {
background: #000;
background-color: #CCC;
bottom: 100%;
display: none;
height: 100%;
left: 0;
max-height: 100%;
opacity: 0.5;
position: fixed;
top: 0;
width: 100%;
z-index: 999;
}
.loading-step-image {
display: none;
left: 50%;
position: fixed;
top: 50%;
}
.add-button a {
background-color: #F02;
color: #FFF;
float: right;
font-size: 13px;
font-weight: 600;
text-decoration: none;
text-transform: uppercase;
}
.add-button a:hover {
background: #3D70B2;
}
.product-item {
background: #F8F8F8;
border: 1px solid #CCC;
margin-bottom: 2%;
padding: 20px 0;
}
.go-cart {
float: left;
margin-bottom: 5%;
text-align: right;
width: 100%;
}
.go-cart a {
font-size: 14px;
font-weight: 600;
padding: 12px 35px;
text-transform: uppercase;
}
.go-cart a:hover {
background: #3D70B2;
}
.add-product-success {
background: #CCC;
border: 1px solid #CCC;
border-radius: 6px;
box-shadow: 0 0 10px 3px #333;
display: none;
left: 35%;
padding: 3%;
position: fixed;
top: 40%;
z-index: 999;
}
.success-text {
float: left;
text-align: center;
width: 100%;
}
.continueproduct {
float: left;
padding: 5% 0 0;
width: 100%;
}
.continueproduct a {
background: #F02;
color: #FFF;
float: right;
font-size: 14px;
font-weight: 600;
margin-top: 2%;
padding: 2% 5%;
text-decoration: none;
text-transform: uppercase;
}
.continueproduct a:hover {
background: #3D70B2;
}
span.errormsg {
clear: both;
color: red;
float: left;
}
.caltypes {
float: left;
}
.calculator .options .option {
display: none;
}
.calculator .options .option:nth-child(1) {
display: block;
}
.caltypes ul li {
font-size: 14px;
width: 32%;
}
div.option {
clear: both;
float: left;
}
iframe {
float: left;
}
.wpb_column.vc_column_container.vc_col-sm-6 {}
section.calculator-section {
float: left;
width: 100%;
}
section.product-dispaly-layout {
clear: left;
float: left;
width: 100%;
}
.calculator {
float: left;
width: 100%;
}
.caltypes {
float: left;
width: 100%;
}
.all-calculate-options {
float: left;
width: 100%;
}
.options.calculator-area {
background-color: #F8F8F8;
float: left;
margin-right: 2%;
padding: 2%;
width: 60%;
}
.first-option-container {
float: left;
width: 100%;
}
.options .option {
float: left;
width: 100%;
}
.calculator .options .option form {
float: left;
width: 100%;
}
.calculate-area {
float: left;
width: 100%;
}
.calculate-result {
display: none;
float: left;
width: 50%;
}
.result-right-side {
float: left;
width: 38%;
}
.calculator .options .Concrete_Acid_Stain_Calculator.option {
display: block;
}
.Concrete_Acid_Stain_Calculator.option h3 {
font-weight: 600;
}
.calculate-area label {}
span.or-break {
float: left;
font-weight: 700;
padding: 2% 0;
width: 100%;
}
.calculate-area input {
font-weight: 500;
}
.length-width input[ type=text ] {
margin-right: 5%;
width: 12%;
}
.continue-button {}
.reset-button {}
.continue-button input[ type=Button ],
.continue-button input[ type=submit ],
.reset-button input[ type=reset ] {
padding: calc(0.846em - 3px) calc(1.38em - 3px);
}
.options.calculator-area .option h3 {
font-weight: 700;
margin-bottom: 2%;
}
.result-right-inner h3 {
float: left;
font-size: 20px;
font-weight: 700;
margin-bottom: 0;
width: 100%;
}
.result-right-inner p {
float: left;
font-weight: 700;
margin-bottom: 2%;
padding-left: 10%;
width: 100%;
}
.main-result-area {
background-color: #DEDBDB;
float: left;
margin-left: 20%;
padding: 5%;
width: 80%;
}
.result-right-inner {
background-color: #E7EFF6;
float: left;
padding: 4%;
width: 100%;
}
.main-result-area span {}
.main-result-area label {
display: block;
}
.calculate-area select {
padding: 0.5%;
width: 15%;
}
.calculate-area p {}
.right-message {
float: left;
padding: 3%;
}
.right-note h3 {
font-weight: 700;
margin: 0;
}
.right-note p {
font-size: 15px;
}
.right-note ul li {
font-size: 15px;
}
.right-note-below {
margin-top: 15px;
}
.right-note-below h3 {
font-weight: 700;
margin: 0;
}
.right-note-below ul li {
line-height: 22px;
min-height: auto;
width: 100%;
}
.right-note-below ul {
list-style: none;
margin: 0;
}
.disclaimer {
line-height: inherit;
}
#js-PROD {
float: left;
width: 100%;
}
@media( max-width: 768px ) {
.options.calculator-area,
.result-right-side {
width: 100%;
}
.result-right-side {
margin-top: 15px;
}
}
@media( max-width: 767px ) {
.caltypes ul li {
font-size: 13px;
width: 49%;
}
.length-width input[ type=text ] {
width: 100%;
}
.main-result-area span {
width: auto;
}
.result-right-inner {
text-align: center;
}
.result-right-inner p {
padding-left: 0;
}
.main-result-area {
margin-left: 0;
width: 100%;
}
.prod-item {
padding-right: 16px;
}
.go-cart {
margin-top: 5%;
}
.product-thumbnail {
max-width: 100%;
}
}
.t-checkout-basket-summary__image {
font-size: 0;
max-width: 80px;
width: 100%;
}
.c-scroll {
display: block;
height: 100%;
max-height: 420px;
overflow-y: auto;
}
.swatch-sections-container {
overflow: auto;
width: 100%;
}
.swatch-sections-container:after {
clear: both;
content: "";
display: table;
}
.bundle_item_group .x-product-layout-purchase__options-attribute .c-form-select.u-hidden {
display: inline-block !important;
}
.x-product-layout-purchase img.active {
border: 4px solid #FC03F9;
}
.x-product-layout-purchase li.kit_sealer.active {
border: 1px solid #FC03F9 !important;
}
.x-product-layout-purchase img.extracolor {
border: 4px solid #0703FC;
}
.x-product-layout-purchase li.kit_sealer.extrasealer {
border: 1px solid #0703FC !important;
}
.kit_swatch {
border-radius: 50%;
cursor: pointer;
height: 30px;
margin-bottom: 2%;
margin-right: 4px;
width: 30px;
}
.x-product-layout-purchase .limitmessage,
.x-product-layout-purchase .sealer_limitmessage {
font-size: 14px;
padding-top: 0;
width: 100%;
}
.x-product-layout-purchase .limitmessage .limit,
.x-product-layout-purchase .sealer_limitmessage .limit {
color: #ED1E24;
font-weight: bold;
}
.x-product-layout-purchase .limitmessage .price,
.x-product-layout-purchase .sealer_limitmessage .price {
color: #ED1E24;
font-weight: bold;
}
.x-product-layout-purchase label.c-form-label.u-color-gray-50.u-text-bold.is-required.o-layout__item.u-width-12.kitproduct {
padding-left: 0;
padding-top: 0px;
}
.choose-color-sync.o-layout.add-class-swatch.choose-sealers ul {
float: left;
list-style: none;
margin-bottom: 0;
margin-left: 0;
}
.choose-color-sync.o-layout.add-class-swatch.choose-sealers ul li {
border: 1px solid;
border-radius: 5px;
float: left;
margin: 0 2% 2% 0;
padding: 0 2%;
}
#lightSlider,
#thumbnails {
display: none;
}
.prod-videos iframe {
border: 0;
}
#js-SRCH .c-form-checkbox__input:checked+ .c-form-checkbox__caption:after {
top: 2px;
}
.footer-image .o-layout__item.u-width-12.u-width-12--m.o-layout--align-self-center.card-icons {
max-width: 60%;
}
.inner-ul li {
list-style: circle;
}
.t-global-account__form .logn-welcome-msg p {
color: #404146;
}
.t-global-account__form .logn-welcome-msg pa {
color: #404146;
text-decoration: underline;
}
#login_message .logn-welcome-msg a#miniModal_1 {
float: none;
}
#mc4wp-form-1 input#mc_fname {
font-size: 14px;
padding: 2%;
}
#mc4wp-form-1 input#mc_email {
font-size: 14px;
padding: 2%;
}
form.mc4wp-form.mc4wp-form-82277 {
background: #D3D3D3;
background: url(../../../../graphics/00000001/spotlght-bg.jpg) no-repeat;
background-position: 53% 40%;
background-size: contain;
border: 1px solid #D3D3D3;
border-radius: 3%;
box-shadow: 0px 0px 5px 0px #333;
float: left;
margin-top: 1%;
padding: 4% 4% 0.5% 4%;
padding-top: 3%;
width: 100%;
}
#mc4wp-form-1 .mc4wp-form-fields {
margin: 0 auto;
/* float: none; */
width: 70%;
}
#mc4wp-form-1 .mc4wp-form-fields p {
float: left;
margin-right: 2%;
width: 100%;
}
#mc4wp-form-1 .mc4wp-form-fields p input {
width: 100%;
}
#mc4wp-form-1 .mc4wp-response {
float: none;
font-size: 14px;
font-weight: 500;
line-height: 16px;
margin: 0 auto;
text-align: center;
width: 70%;
}
#mc4wp-form-1 .mc4wp-alert.mc4wp-success {
color: green;
}
#mc4wp-form-1 .mc4wp-alert.mc4wp-error {
color: #FF0000;
}
.card-pay-img {
float: right;
margin-right: 0 !important;
padding-top: 1.5%;
width: 60% !important;
/* margin-left: 1%; */
}
a#bbblink img {
border: 0;
left: 0;
margin-left: 0;
max-width: 200% !important;
position: absolute;
top: 0;
}
#custfeedpopup input {
font-size: 14px;
font-weight: normal;
padding: 2%;
width: 100%;
}
.bask-coupon-name {
line-height: 40px;
}
.bask-coupon-form {
margin-bottom: 0;
}
.bask-coupon-form li {
margin-bottom: 0;
}
.bask-coupon-form button.c-button.c-button--clear.u-bg-transparent.u-color-red {
border: 1px solid;
}
.t-basket_coupon-form li.c-form-list__item.c-form-list__item--full.c-control-group.u-flex {
margin-top: 3%;
}
.shopperlink {
float: none;
max-width: 120px !important;
padding-right: 0 !important;
padding-top: 1%;
}
.choose-color-sync.o-layout.add-class-swatch.choose-sealers ul li {
min-height: 50px;
}
#post-76640 .wpb_column.vc_column_container.vc_col-sm-10 {
width: 70%;
}
#post-76640 .wpb_column.vc_column_container.vc_col-sm-2 {
width: 30%;
}
.payment-image img {
border: 1px solid #F2F2F2;
padding: 0.5%;
width: 10%;
}
span.payment-image.c-form-checkbox__caption:after .payment-inner-img {
border: 1px solid #194A8F;
}
.top-header-mid-promo2 {
font-weight: 500;
width: 95%;
}
.holiday-message p {
font-size: 13px;
margin: 0;
}
.holiday-message p b {
text-transform: uppercase;
}
.holiday-message {
background-color: #FFD6D7;
border: 1px solid #FFD6D7;
border-radius: 4px;
margin-bottom: 3%;
padding: 1%;
width: 100%;
}
article p a {
color: #194A8F !important;
text-decoration: underline !important;
}
.vc_row {
width: 100%;
}
.bg-audio_icon {
background: url("https://directcolors.com/mm5/graphics/00000001/resources_sprites.png") 7px 4px;
background-color: #ED1E24;
background-size: 220%;
height: 60px;
width: 60px;
}
.bg-calc_icon {
background: url("https://directcolors.com/mm5/graphics/00000001/resources_sprites.png") -54px -60px;
background-color: #ED1E24;
height: 60px;
width: 60px;
}
.bg-video_icon {
background: url("https://directcolors.com/mm5/graphics/00000001/resources_sprites.png") -38px 7px;
background-color: #ED1E24;
background-size: 210%;
height: 60px;
width: 60px;
}
.bg-pdf_icon {
background: url("https://directcolors.com/mm5/graphics/00000001/resources_sprites.png") 8px -45px;
background-color: #ED1E24;
background-size: 225%;
height: 60px;
width: 60px;
}
.bg-toolkit_icon {
background: url("https://directcolors.com/mm5/graphics/00000001/resources_sprites.png") -125px 4px;
background-color: #ED1E24;
background-size: 300%;
height: 60px;
width: 60px;
}
#js-PROD .x-product-description .vc_toggle.vc_toggle_default.vc_toggle_color_default.vc_toggle_size_md {
float: left;
width: 100%;
}
#js-PROD .print-page {
top: 0;
}
@media ( max-width: 767px ) {
.footer-image .o-layout__item.u-width-12.u-width-12--m.o-layout--align-self-center.card-icons {
max-width: 90%;
}
#bbblink {
margin-left: 9% !important;
}
.card-pay-img {
float: right;
padding-top: 5%;
width: 95% !important;
}
.shopperlink {
padding-top: 2%;
}
#dc_blog .post-item-inner .entry-image {
width: auto;
}
.home .wpb_column.vc_column_container.vc_col-sm-3 {
width: 100%;
}
.home #diy-leftbar .vc_column-inner {
padding-left: 0;
}
.vc_row {
margin-left: 0;
width: 100%;
}
.home #diy-leftbar div#project_category {
max-width: 100%;
}
.home #diy-leftbar ul.li-container {
margin-left: 0;
padding-right: 0;
}
.vc_gitem-zone {
float: left;
}
.vc_column_container> .vc_column-inner {
padding: 0;
}
.top-header-mid-promo2 {
font-weight: 500;
padding: 2% 0 0;
text-align: center;
width: 100%;
}
#storefront_more_from_dc span.mdc-icon.u-bg-red {
float: none;
margin: 0 auto;
margin-bottom: 5%;
}
.o-layout__item.u-width-12.u-width-10--l.u-width-10--w.u-text-center.u-text-left--l.header-notification {
max-width: 100% !important;
}
div#top_header_promo {
width: 100% !important;
}
#top_header_promo p {
font-size: 15px !important;
}
#js-PROD section.o-layout.x-product-description .o-layout__item {
max-width: 81%;
}
#js-PROD section.o-layout.x-product-description .calculator.o-layout__item {
max-width: 100%;
}
#js-PROD .calculator-area-right.o-layout__item {
max-width: 100% !important;
}
#js-PROD .calculator-area-left.o-layout__item {
max-width: 100% !important;
}
#js-PROD #calculator_content .slick-slider .slick-prev.slick-arrow {
left: -9px;
}
#js-PROD .all-calculate-options li.c-form-list__item.o-layout__item {
max-width: 100% !important;
}
#js-PROD {
overflow-x: hidden !important;
}
}
.product-description a {
color: #194A8F !important;
text-decoration: underline !important;
}
.page-template-default.page article.page.type-page .vc_col-sm-4 {
width: 33%;
}
.swatch-popup .x-product-layout-purchase__swatches ul li {
height: 145px;
margin-bottom: 30px;
width: 145px;
}
.swatch-popup .x-product-layout-purchase__swatches li img {
height: 145px;
width: 145px;
}
.build-kit-page .swatch-main-container {
padding-right: 0;
}
.t-page-built-kit-template .x-product-layout-purchase__swatches .o-list-inline__item:not(:last-child) {
margin-right: 7px;
}
.edit-address {
text-decoration: underline;
}
div#top_header_promo {
width: 74%;
}
#top_header_promo p {
font-size: 17px;
}
img.ca-flag-icons {
margin-left: 5px;
width: 42%;
}
img.us-flag-icons {
width: 40%;
}
.o-layout__item.u-width-12.u-width-10--l.u-width-10--w.u-text-center.u-text-left--l.header-notification {
max-width: 75%;
}
.t-site-footer-rating-image img {
margin-left: 7%;
}
.kit_swatch {
height: 45px;
width: 47px;
}
.kit-swatch-img-span {
float: left;
margin-bottom: 5px;
margin-right: 7px;
min-height: 65px;
text-align: center;
width: 14%;
}
.kit-color-swatch-name {
display: block;
float: left;
font-size: 9px;
line-height: 9px;
margin: 0 auto;
width: 80%;
width: 100%;
}
.swatch-popup .kit-swatch-img-span {
margin-bottom: 15px;
margin-right: 12px;
min-height: auto;
width: 15%;
}
.swatch-popup .kit-color-swatch-name {
font-size: 14px;
line-height: 23px;
}
span.made-in-sticky {
font-size: 11px;
}
.shop-proj-name {
clear: both;
color: #404146;
float: left;
font-weight: 500;
margin: 0 auto;
padding-bottom: 14px;
padding-top: 14px;
width: 100%;
}
.design-image-box:hover .shop-proj-name {
text-decoration: underline;
}
.design-image-box:hover .shop-proj-name {
text-decoration: underline;
}
#cookieConsent {
background-color: rgba(20, 20, 20, 0.8);
bottom: 0;
color: #CCC;
display: none;
font-size: 14px;
left: 0;
line-height: 26px;
min-height: 26px;
padding: 10px 0 10px 30px;
position: fixed;
right: 0;
z-index: 9999;
}
#cookieConsent p a {
color: #FFF;
font-weight: 700;
text-decoration: none;
}
#closeCookieConsent {
cursor: pointer;
display: inline-block;
float: right;
font-weight: bold;
height: 20px;
margin: -4px 0 0 0;
width: 20px;
}
#closeCookieConsent:hover {
color: #2567C3;
}
#cookie-confirmation-content p {
margin-bottom: 0;
}
#cookieConsent a.cookieConsentOK {
background-color: #2567C3;
border-radius: 0;
color: #FFF !important;
cursor: pointer;
display: inline-block;
float: right;
margin: 0 60px 0 10px;
padding: 12px 35px;
}
#cookieConsent a.cookieConsentOK:hover {
background-color: #2567C3;
}
div#cookie-confirmation-buttons {
display: inline;
margin: 10px 0 0 !important;
max-width: 200px;
text-align: right !important;
}
#cookieConsent div#cookie-confirmation-inner {
margin: 0 auto;
max-width: 1050px;
padding: 2px;
}
#cookie-confirmation-content {
color: #FFF;
display: inline-block;
letter-spacing: 0.04em;
max-width: 800px;
}
@-moz-document url-prefix() {
#cookie-confirmation-content {
letter-spacing: 0em;
}
}
@media only screen and ( max-width: 1080px ) {
#cookie-confirmation-content {
max-width: 730px;
}
}
@media only screen and ( max-width: 980px ) {
#cookie-confirmation-content {
max-width: 100%;
text-align: center;
}
div#cookie-confirmation-buttons {
display: block;
margin: 14px auto 0 !important;
text-align: center !important;
}
}
div.autocomplete-items {
background: #FFFFFF;
position: absolute;
width: 33.9%;
z-index: 1;
}
div.autocomplete-items div {
border: 1px solid #CCCCCC;
padding: 1%;
}
.mailchimp_message {
clear: both;
color: #FFF;
float: left;
font-size: 16px;
padding-left: 0;
position: absolute;
text-align: left;
top: 100%;
width: 100%;
}
a.image-project {
height: auto;
padding: 0;
z-index: 0;
}
input.c-button.add-to-wish-prod.c-button--primary.u-bg-blue.c-button--medium.u-color-white.add-to-cart.c-button--full {
background-color: #CCC;
border: 1px solid #CCC;
color: #333;
float: right;
font-size: 12px;
text-transform: uppercase;
width: 50%;
}
#js-PROD .product-bottom-container {
margin-top: 1%;
width: auto;
}
#js-PROD .customer-also-bought .x-product-list {
margin-bottom: 16px;
}
#js-PROD .customer-also-bought .x-product-list__item {
margin-bottom: 15px;
padding: 0 0 53px;
position: relative;
}
@media only screen and ( min-width: 600px ) {
.cat-dc_tools_and_supplies {
top: 300px !important;
}
.cat-dc_concrete_floor_wax {
top: 650px !important;
}
}
/* ### PROD_display_layout_inline_css ### */
#js-PROD .product-image-loader {
left: 26%;
position: absolute;
top: 5%;
}
#js-PROD section.o-layout.o-layout--wide.u-grids-1.u-grids-1.u-grids-2--l.x-product-layout {
position: relative;
}
#js-PROD .product-image-loader.price-loader {
left: 0;
position: absolute;
top: 8%;
}
.product-image-loader.price-loader .loading-step img {
width: 50%;
}
span.c-heading-delta.x-product-layout-purchase__pricing-original {
padding-right: 10px;
}
span.c-heading-delta.x-product-layout-purchase__pricing-original.for-variant-price {
padding-right: 0px;
}
.read-more-link {
cursor: pointer;
font-size: 12px;
font-weight: normal;
text-align: right;
text-decoration: underline;
width: 100%;
}
.read-more-link:hover {
text-decoration: underline;
}
.kit-swatch-img-span {
float: left;
margin-bottom: 10px;
margin-right: 7px;
}
.trialproduct .x-product-layout-purchase .swatch-popup img.kit_swatch {
height: 116px !important;
width: 116px !important;
}
.swatch-popup .kit-color-swatch-name {
display: block !important;
}
.pdf-data-sheet li span.data-sheet-pdf {
background-color: #ED1E24;
border-radius: 56px;
display: inline-block;
height: 50px;
margin: 1% 0;
padding: 8px 12px;
width: 50px;
}
.prod-37478-id .x-product-layout-purchase .choose-color-sync .select-size:nth-child(2):after {
border-bottom: 0;
}
.prod-37473-id .x-product-layout-purchase .choose-color-sync .select-size:nth-child(2):after {
border-bottom: 0;
}
.prod-37468-id .x-product-layout-purchase .choose-color-sync .select-size:nth-child(2):after {
border-bottom: 0;
}
.prod-37463-id .x-product-layout-purchase .choose-color-sync .select-size:nth-child(2):after {
border-bottom: 0;
}
.prod-25237-id .x-product-layout-purchase .choose-color-sync .select-size:nth-child(2):after {
border-bottom: 0;
}
.prod-25244-id .x-product-layout-purchase .choose-color-sync .select-size:nth-child(2):after {
border-bottom: 0;
}
.fancybox-lock .fancybox-overlay {
background-color: rgba(0, 0, 0, 0.8);
overflow: auto;
overflow-y: scroll;
}
.fancybox-thumbs__list a {
height: 50px;
width: 50px;
}
.fancybox-thumbs__list a:before {
border: 2px solid #FF5268;
}
.fancybox-show-thumbs .fancybox-thumbs {
bottom: 0;
display: inline-block;
float: none;
margin: 0 auto;
position: fixed;
right: 0;
top: auto;
width: 100%;
}
.fancybox-show-thumbs .fancybox-inner {
width: 100%;
}
.fancybox-image,
.fancybox-spaceball {
max-height: 95%;
max-width: 95%;
}
div.ui-widget-overlay.ui-front {
background: #000000;
height: 100%;
left: 0;
opacity: 0.5;
position: fixed;
top: 0;
width: 100%;
z-index: 1;
}
div#dialog-form h4 {
font-size: 18px;
font-weight: bold;
text-align: center;
}
div#dialog-form {
display: none;
}
.prod-videos li {
float: left;
list-style: none;
margin: 1% 0;
width: 33%;
}
.bundle-item-container .c-button--full {
width: auto;
}
.pdf-data-sheet li {
display: inline-block;
list-style: none;
margin: 1% 0;
text-align: center;
vertical-align: top;
width: 33%;
}
.pdf-data-sheet li p {
margin: 0 auto;
width: 65%;
}
#js-LOGN .o-layout--justify-around .c-form-list__item {
max-width: 100% !important;
text-align: left;
}
#js-LOGN .user-signup:before {
background: #DDDDDD;
border-left: 1px solid #DDDDDD;
content: "";
height: 100%;
left: -65px;
position: absolute;
width: 1px;
}
.user-signup {
position: relative;
}
.pdf-data-sheet li> span {
background-color: #ED1E24;
border-radius: 56px;
display: inline-block;
height: 50px;
margin: 1% 0;
padding: 8px 12px;
width: 50px;
}
.pdf-data-sheet li> span img {}
figure.o-layout__item.u-text-center.x-product-layout-images {
position: relative;
}
.lSAction.vertival.custom-trigger-vertical {
display: block;
height: 84%;
left: 0;
position: absolute;
top: 0;
width: 150px;
}
.lSAction.vertival.custom-trigger-vertical a.vertical_upslide {
background: transparent;
color: #404146;
font-size: 40px;
left: 0;
margin: 0 auto;
position: absolute;
right: 0;
text-decoration: none;
top: -21px;
transform: rotate(90deg);
transform-origin: 30px 20px;
}
.lSAction.vertival.custom-trigger-vertical a.vertical_upslide:hover {
text-decoration: none;
}
.lSAction.vertival.custom-trigger-vertical a.vertical_upslide:before {
content: " \2039";
opacity: 1;
}
.lSAction.vertival.custom-trigger-vertical a.vertical_downslide {
background: none;
bottom: 23px;
color: #404146;
font-size: 40px;
left: 0;
margin: 0 auto;
position: absolute;
right: 0;
text-decoration: none;
top: auto;
transform: rotate(90deg);
transform-origin: 26px 24px;
}
.lSAction.vertival.custom-trigger-vertical a.vertical_downslide:hover {
text-decoration: none;
}
.lSAction.vertival.custom-trigger-vertical a.vertical_downslide:before {
content: " \203A";
opacity: 1;
}
.lSSlideOuter.vertical .lSAction {
display: none !important;
}
#thumbnails .lslide a {}
.lSSlideOuter.vertical .lSSlideWrapper.usingCss {}
.lSAction.horizontal.custom-trigger-horizontal a.horizontal_prevslide {
color: #404146;
font-size: 40px;
left: -33px;
position: absolute;
text-decoration: none;
top: 15%;
}
.lSAction.horizontal.custom-trigger-horizontal a.horizontal_prevslide:hover {
text-decoration: none;
}
.lSAction.horizontal.custom-trigger-horizontal a.horizontal_prevslide:before {
content: " \2039";
opacity: 1;
}
.lSAction.horizontal.custom-trigger-horizontal a.horizontal_rightslide {
color: #404146;
font-size: 40px;
position: absolute;
right: -33px;
text-decoration: none;
top: 15%;
}
.lSAction.horizontal.custom-trigger-horizontal a.horizontal_rightslide:hover {
text-decoration: none;
}
.lSAction.horizontal.custom-trigger-horizontal a.horizontal_rightslide:before {
content: " \203A";
opacity: 1;
}
.lSAction.horizontal.custom-trigger-horizontal {
display: block;
}
label.more {
cursor: pointer;
display: block;
font-size: 14px;
font-weight: 500;
text-align: right;
text-decoration: underline;
}
label.more:hover {
color: #2567C3;
}
.t-faceting .x-category-tree__heading {
font-size: calc(16px * 1);
padding-bottom: 12px;
padding-top: 2px;
}
#checkout_basket_summary.t-checkout-basket-summary .c-table-simple {
margin-bottom: 0;
width: 100%;
}
#checkout_basket_summary.t-checkout-basket-summary .c-table-simple .c-table-simple__row {
display: block;
}
ul.o-layout.o-layout--align-center.o-list-inline.u-text-uppercase.u-font-small {
padding: 2% 0;
}
#order_instructions {
float: left;
font-size: 14px;
height: 7em;
margin-bottom: 0;
resize: none;
width: 100%;
}
#new-order-instruction li label {
font-size: 14px;
font-weight: normal;
text-transform: capitalize;
width: 100%;
}
ul#shipping-method-selection {
max-width: 25em;
}
aside.o-layout__item.u-width-12.u-width-4--l.u-width-5--w {
max-width: 450px;
}
#js-OPAY p.c-heading-echo.u-text-bold.u-text-uppercase span.c-heading--subheading {
font-size: 14px;
font-weight: 500;
line-height: 55px;
margin-top: 3%;
text-transform: capitalize;
}
li.c-navigation__list.has-child-menu.is-off-screen {
position: relative;
}
ul.c-navigation__row.is-hidden.shopby-Shop.by.Project.manin-nav-level1 {
background-color: #FFF;
box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.1), 0px 2px 4px rgba(0, 0, 0, 0.4);
left: 10px;
padding: 0 3%;
top: 100%;
}
.main-nav-level2:nth-child(2) a.c-navigation__link {
border: 0;
}
.main-nav-level2 a.c-navigation__link {
border-top: 1px solid #EFEFEF;
color: #333131 !important;
font-size: 14px;
font-weight: 600;
margin: 16px 0 8px;
margin-bottom: 3%;
margin-top: 3% !important;
text-transform: uppercase;
}
.mm_facet_rangeslider_track_selection {
background-color: #939191;
}
.main-nav-level2 a.c-navigation__link:hover {
color: #FF0022 !important;
}
.filter-box.Price .mm_facet_rangeslider_track_handle_low,
.filter-box.Price .mm_facet_rangeslider_track_handle_high {
background-color: #4888C8;
border: 1px solid #4888C8;
height: 1em;
width: 1em;
}
.filter-box.Price .mm_facet_rangeslider_input_container_low,
.filter-box.Price .mm_facet_rangeslider_input_container_high {
border: 0;
border: 0;
float: left;
margin-right: 3%;
margin-top: 14%;
padding-right: 5%;
position: static !important;
text-align: left;
top: 0;
width: auto !important;
}
.filter-box.Price .mm_facet_rangeslider.mm_facet_rangeslider_mini .mm_facet_rangeslider_track_container {
border: 0;
top: -7px;
}
.filter-box.Price .mm_facet_rangeslider.mm_facet_rangeslider_mini .mm_facet_rangeslider_input_container_low {
background: url(/mm5/themes/shadows/ui/images/price-sep.png) no-repeat;
background-position: right 35%;
}
.filter-box.Price .mm_facet_rangeslider.mm_facet_rangeslider_mini {
height: 4em;
}
.product-rating-heading h4 {
border-bottom: 2px solid #333;
font-size: 22px;
font-weight: 600;
}
.x-product-description {
margin-bottom: 1rem;
padding-top: 0;
}
.x-product-layout-purchase__name {
display: flex;
position: relative;
}
.x-product-layout-purchase__options .swatch-main-container {
padding-right: 0;
}
.x-product-layout-purchase__options #swatches li {
margin-right: 3% !important;
text-align: center;
}
.x-product-layout-purchase .x-product-layout-purchase__options {
border-top: 1px solid #E3E3E3;
margin-bottom: 0px;
max-width: 100%;
padding-bottom: 0;
vertical-align: top;
}
.x-product-layout-purchase .x-product-layout-purchase__kits {
border-bottom: 0;
border-top: 1px solid #CCCCCC;
display: inline-block;
margin-top: 0px;
max-width: 100%;
padding-top: 20px;
}
.x-product-layout-purchase .select-column.color-swatch:after,
.x-product-layout-purchase .get-trial:after {
display: none;
}
.x-product-layout-purchase .product-trial-kit {
margin: 0;
}
.x-product-layout-purchase .product-trial-kit> div {
margin-bottom: 25px;
}
.x-product-layout-purchase .product-trial-kit div+ div {
/* border-bottom: 1px solid #cccccc; padding-bottom: 5px; */
text-decoration: underline;
}
.margin-0 .wpb_single_image.vc_align_left,
.margin-0 .wpb_content_element {
margin-bottom: 0;
}
#js-PATR .t-main-content-element .u-text-center {
text-align: left;
}
#js-PATR section.o-layout.o-layout--justify-center {
justify-content: flex-start;
}
#js-PATR .x-product-layout-purchase__options {
border: 0;
margin-bottom: 15px;
}
#js-PATR .x-product-layout-purchase__options-attribute {
padding-left: 0;
}
.popup-cal-overlay {
background-color: #000;
float: left;
height: 100%;
left: 0;
opacity: 0.8;
position: fixed;
top: 0;
width: 100%;
z-index: 999;
}
.cat-build-your-kit {
display: none;
}
div.ui-widget-overlay.ui-front {
background: #000000;
height: 100%;
left: 0;
opacity: 0.5;
position: fixed;
top: 0;
width: 100%;
z-index: 1;
}
div#dialog-form h4 {
font-size: 18px;
font-weight: bold;
text-align: center;
}
div#dialog-form {
display: none;
}
.mm_facet_rangeslider_input_container_low {
visibility: hidden;
}
.mm_facet_rangeslider_input_container_high {
visibility: hidden;
}
.calculator .option {
display: none;
}
.calculatorswatches {
width: 500px;
}
.calculatorswatches div img {
cursor: pointer;
width: 60px;
}
.calculatorswatches div img.active {
border: 2px solid #2C87F0;
}
.x-product-layout-purchase img.active {
border: 4px solid #2567C3 !important;
}
.single-podcasts h1.entry-title.newtitle {
background: rgb(0, 0, 0, 0.5);
border-radius: 5px;
color: #FFF;
font-size: 26px;
font-weight: 500;
margin-bottom: 2%;
padding: 0 10px;
}
.single-podcasts .project-share {
/* border-bottom: 1px solid #ebebeb; */
margin-bottom: 25px;
padding-bottom: 10px;
}
.x-product-layout-purchase__pricing-original,
.x-product-layout-purchase__pricing-current {
font-size: 1.5rem;
font-weight: 600;
}
.t-site-header__logo a {
margin-top: 0;
}
.braintree-sheet__icons {
text-align: left;
}
.braintree-sheet__icons .braintree-sheet__card-icon {
display: inline-block;
}
.company-promises {
margin: 4rem 0;
}
.company-promises h3 {
margin-bottom: 10px;
}
.company-promises p {
font-size: 15px;
margin-bottom: 0;
}
.company-promises figure {
margin: 0 0 15px 0px;
}
.company-promises img {
width: 100px;
}
.t-page-ordl header.t-site-header {
margin-bottom: 4rem;
}
p.c-heading-delta.u-text-uppercase.font-bold {
font-weight: 500;
}
span.c-heading--subheading.u-text-revert.font-normal {
font-weight: normal;
}
.forgot-heading {
font-size: 24px;
font-weight: 600;
margin-bottom: 5px;
text-transform: uppercase;
}
.x-messages--info,
.x-messages--warning {
background-color: #F2F2F2;
color: #404146;
}
.contact-us-link {
font-weight: 500;
text-decoration: underline;
}
s#price-value-additional-variant {
color: #A9A9A9;
}
#product-discounts sub {
bottom: -1.25em;
font-size: 14px;
font-weight: 500;
}
.build-your-kit-leftcat {
display: none;
}
.fasten-header-phone:hover {
text-decoration: none;
}
.vc_btn3-container.vc_btn3-inline {
margin-right: 10px;
}
span#js-view-trial-kit:before {
content: none;
}
.x-product-layout-purchase__product-discounts sub {
bottom: 0;
font-size: 14px;
font-weight: 500;
}
.swatches-trial.show-all-swatches {
float: left;
margin-top: 2%;
width: 100%;
}
.t-site-header__logo a {
position: relative;
}
span.made-in-sticky {
color: #1F2930;
font-size: 7px;
font-weight: 500;
}
span.t-site-header__message a {
color: #FFF;
text-decoration: underline;
}
.footer-image .o-layout__item.u-width-12.u-width-12--m.o-layout--align-self-center.card-icons {
float: none;
margin: 0 auto;
max-width: 45%;
padding: 0;
width: 50%;
}
img.accredited-icon {
float: left;
margin-left: 2%;
margin-right: 1% !important;
}
img.footer-payment-icons {
float: right;
margin-right: 0 !important;
}
.shopperlink img {
margin-left: 1% !important;
margin-right: 0 !important;
padding-right: 0 !important;
}
.card-icons .shopperlink {
border-right: 0 !important;
margin-left: 1% !important;
margin-right: 0 !important;
}
#js-ACLN a.my-account {
margin-right: 0.5rem;
}
/* by deepak on sat-10aug19 */
.prod-24083-id .x-product-layout-purchase .choose-color-sync .select-size:nth-child(2):after {
bottom: -3px !important;
}
.prod-25252-id .x-product-layout-purchase .choose-color-sync .select-size:nth-child(2):after {
bottom: -3px !important;
}
.prod-25252-id .x-product-layout-purchase .choose-color-sync.single-active .select-size:nth-last-of-type(1) {
margin-top: 5px !important;
}
.prod-24083-id .x-product-layout-purchase .choose-color-sync .select-size:nth-child(6) {
margin-top: 4px !important;
}
.choose-color-sync.o-layout.add-class-swatch.choose-sealers {
padding-top: 5px;
}
.trialproduct .swatch-sections {
max-height: 74px;
}
.trialproduct .swatch-popup .swatch-sections {
max-height: 100%;
overflow-y: initial;
padding-top: 3%;
width: 100%;
}
.trialproduct .choose-color-sync.o-layout.add-class-swatch.choose-sealers ul {
margin-bottom: 0px;
}
.trialproduct .x-product-layout-purchase .swatch-popup img.kit_swatch {
height: 120px;
width: 120px;
}
li.c-form-list__item.c-form-list__item--full.x-product-layout-purchase__cta {
border-bottom: 1px solid #E3E3E3;
margin-bottom: 0px;
}
.o-layout.product-shipnote p {
font-size: 13px;
margin-bottom: 0;
padding: 3px 3%;
}
li.c-form-list__item.u-grids-1.u-grids-2--m.c-form-list__item--full.x-product-layout-purchase__shipnote {
border-bottom: 1px solid #E3E3E3;
}
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(2):after {
border-bottom: 1px solid rgba(204, 204, 204, 0.5);
bottom: -3px;
content: "";
left: 0;
position: absolute;
width: 100%;
}
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(2) {
border-left: 0;
border-right: 1px solid rgba(204, 204, 204, 0.5);
margin-bottom: 3px;
margin-top: 3px;
padding-bottom: 0px;
padding-left: 0;
padding-right: 50px;
position: relative;
}
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(6) {
border-right: 1px solid rgba(204, 204, 204, 0.5);
margin-bottom: 3px;
margin-top: 3px;
min-height: 92px;
}
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-column.color-swatch {
margin-bottom: 3px;
margin-top: 3px;
}
.quickview-product-detail .bdr-top {
padding-top: 3px;
}
.addtocart-container-q {
padding-left: 23px;
}
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-column.color-swatch:nth-child(2),
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-column.color-swatch:nth-child(5),
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-column.color-swatch:nth-child(9) {
border-right: 1px solid rgba(204, 204, 204, 0.5);
padding: 0;
padding-right: 15px;
}
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size.no-bdr:nth-child(4):after,
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size.no-bdr:nth-child(3):after,
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size.no-bdr:nth-child(7):after {
border-bottom: 1px solid rgba(204, 204, 204, 0.5);
bottom: -3px;
content: "";
left: 0;
position: absolute;
width: 100%;
}
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(4),
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(3),
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(7) {
position: relative;
}
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(4):after,
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(3):after,
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(7):after,
{
border-bottom: 1px solid rgba(204, 204, 204, 0.5);
bottom: -3px;
content: "";
left: 0;
position: absolute;
width: 100%;
}
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(5) {
border-right: 1px solid rgba(204, 204, 204, 0.5);
margin-bottom: 3px;
margin-top: 3px;
padding-left: 0px;
padding-right: 40px;
}
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(7) {
margin-bottom: 3px;
margin-top: 3px;
padding-right: 40px;
}
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-last-of-type(1) {
border-bottom: 0;
margin-bottom: 3px;
margin-top: 3px;
padding-right: 40px;
padding-top: 0px;
}
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(9) {
padding-left: 0px;
}
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.choose-color-sync .select-size:nth-child(5) {
margin-bottom: 3px;
margin-top: 3px;
padding-left: 0;
padding-left: 0;
padding-right: 40px;
padding-top: 0px;
}
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size.no-bdr:nth-child(4) {
align-self: auto;
margin-bottom: 3px;
margin-right: 0px;
margin-top: 3px;
padding-left: 15px;
position: relative;
}
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(4),
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(3),
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(7) {
position: relative;
}
.company-address ul li {
margin-top: 5px;
}
.calculator-area-right div.colorcodes {
color: black;
font-size: 9px;
text-align: center;
width: 72px;
}
.calculator-area-right span.colorname {
display: block;
}
.calculator-area-right span.colordetails {
display: block;
}
div#cfeedfly {
bottom: 20px;
left: 20px;
position: fixed;
z-index: 99;
}
.feed-main-text img {
border-radius: 50%;
}
div#cfeedfly a {
color: #FFF;
font-size: 15px;
font-weight: 500;
/* padding: 10px; */
line-height: 36px;
text-decoration: none;
text-transform: uppercase;
}
.closefeedback a {
font-size: 24px !important;
padding: 10px;
}
div#cfeedfly.closeaddclass {
border-radius: 50%;
}
#custfeedpopup {
background-color: #FFF;
border-radius: 10px;
bottom: 100px;
box-shadow: rgba(0, 0, 0, 0.16) 0px 5px 40px;
left: 20px;
margin-top: 1%;
opacity: 0;
padding: 20px;
position: fixed;
transition: visibility 0s, opacity 0.5s linear;
width: 375px;
z-index: 999;
}
#custfeedpopup textarea#comments {
font-size: 15px;
font-weight: normal;
height: 100px;
padding: 1% 2%;
width: 100%;
}
#custfeedpopup input {
width: 100%;
}
#customer_feedback_popup h5 {
font-weight: 500;
line-height: 17px;
text-align: left;
}
#customer_feedback_popup p {
font-weight: normal;
line-height: 17px;
text-align: left;
}
#customer_feedback_popup h4 {
font-size: 18px;
font-weight: 600;
line-height: 17px;
text-align: center;
text-transform: uppercase;
}
#customer_feedback_popup .control-group {
font-weight: 500;
}
.row.feedsubmit {
margin-top: 5%;
}
.row.feedsubmit {
float: none;
margin-top: 5%;
}
.row.feedsubmit .col-md-12 {
margin: 0 auto;
width: 50%;
}
.feedsubmit input.btn.btn-lg.btn-primary.btn-block {
background-color: #4888C8;
border: 0;
border: 1px solid #4888C8;
border-radius: 5px;
color: #FFF;
cursor: pointer;
float: none;
font-size: 15px;
font-weight: 500;
margin: 0 auto;
padding: 5%;
text-align: center;
text-transform: uppercase;
}
div#html_element_feed {
margin: 5%;
}
#custfeedpopup input#email {
font-size: 15px;
font-weight: normal;
height: 40px;
padding: 1% 2%;
}
div#captcha_fd {
text-align: center;
}
#js-Register section.o-layout.o-layout--justify-start ul.c-form-list li {
float: left;
margin-right: 12px;
width: 46%;
}
.closefeedback {
background-color: rgb(0, 113, 178);
border: 1px solid rgb(0, 113, 178);
border-radius: 50%;
padding: 11px 9px;
}
#js-ORDL .t-site-header__masthead {
padding-bottom: 1.5em;
padding-top: 1.5em;
}
#js-OCST .t-site-header__masthead {
padding-bottom: 1.5em;
padding-top: 1.5em;
}
#js-OSEL .t-site-header__masthead {
padding-bottom: 1.5em;
padding-top: 1.5em;
}
#js-OPAY .t-site-header__masthead {
padding-bottom: 1.5em;
padding-top: 1.5em;
}
.x-fasten-header--is-active .x-fasten-header {}
.t-site-footer__disclaimer p {
margin-bottom: 0;
padding-left: 32px;
}
.card-icons .accredited-icon {
width: 104px;
}
.x-fasten-header--is-active .x-fasten-header .t-site-header__logo a {
max-width: 70%;
}
.card-icons img {
margin-right: 10px;
}
.card-icons .shopperlink {
display: inline-block;
margin-right: 13px;
max-width: 110px;
}
.mdc-icon.calcs img {
margin-top: 6px;
max-width: 26px !important;
}
/* post detail page styleguide */
.wpb_widgetised_column.wpb_content_element h2.widget-title {
font-size: 18px;
font-weight: 500;
margin-bottom: 5px;
margin-top: 14px;
}
.testimonials-list .testimonials-text {
margin-bottom: 0;
margin-left: 0;
margin-right: 0;
}
.testimonials-list .testimonials-text p {
font-size: 14px;
margin-bottom: 3px;
}
.testimonials-list .quote {
margin-bottom: 16px;
}
.testimonials-list .author {
font-weight: 500;
}
.mc4wp-form-fields input[ type="text" ],
.mc4wp-form-fields input[ type="email" ] {
height: 35px;
width: 100%;
}
.mc4wp-form-fields p label {
display: block;
font-weight: 500;
padding-bottom: 5px;
}
.mc4wp-form-fields input[ type="submit" ] {
-webkit-appearance: none;
appearance: none;
background-color: #ED1E24;
border: 0;
border-radius: 0.3125em;
color: #FFF;
cursor: pointer;
display: inline-block;
font-family: inherit;
font-size: 1em;
font-weight: 700;
letter-spacing: 0;
line-height: normal;
margin: 0;
padding: calc(0.846em - 1px) calc(1.38em - 1px);
position: relative;
text-align: center;
text-decoration: none;
transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
vertical-align: middle;
}
.wpb_widgetised_column.wpb_content_element .widget_media_image img {
width: 100%;
}
.widget.widget_media_image,
.widget.nsfp_featured_post_widget,
.widget.widget_woothemes_testimonials,
.widget.widget_mc4wp_form_widget {
border-bottom: 1px solid #DDDDDD;
}
.widget.tawhidurrahmandeareightWidget center {
text-align: left;
}
.widget.tawhidurrahmandeareightWidget input[ type="button" ] {
background: transparent;
border: 0;
cursor: pointer;
cursor: pointer;
font-size: 12px;
font-weight: 500;
outline: none;
padding: 0;
}
.main-header-element h1 {
/* font-weight:500; */
}
.wpb_column .vc_column-inner .wpb_content_element {
margin-bottom: 20px !important;
}
.wptypeaheadfull .x-product-list__figure img {
height: 200px;
left: 0;
margin-bottom: 20px;
object-fit: cover;
top: 0;
vertical-align: top;
width: auto;
width: 100%;
}
@media print {
.product-bottom-container {
display: none;
}
}
@media( min-width: 768px ) {
.braintree-sheet__icons {
padding-top: 10px;
width: 100%;
}
.card-icons .shopperlink {
border-right: 1px solid rgba(31, 31, 34, 0.4);
padding-right: 17px;
}
#resources_mega_menu .design-image-box {
padding-bottom: 10px;
}
}
.product-trial-kit .coverage-calc {
border-bottom: 1px solid #E3E3E3;
padding-bottom: 20px;
}
.product-trial-kit .coverage-calc span {
display: inline-block;
vertical-align: bottom;
}
.kitpro-image {
padding-left: 14px;
width: 100%;
}
.kitpro-image img {
border-radius: 100%;
cursor: pointer;
margin-bottom: 5px;
}
@media ( min-width: 1350px ) {
.x-fasten-header {
padding: 1.6em;
}
}
@media ( min-width: 769px ) and ( max-width: 1024px ) {
.freekit-icon,
.calc-icon {
display: inline-block;
float: none;
}
}
#product_just_stars span {
float: left;
}
.print-page {
align-self: center;
cursor: pointer;
font-size: 12px;
font-weight: 500;
position: absolute;
right: 0;
text-align: end;
}
li.c-form-list__item.c-form-list__item--full.print-include {
position: relative;
}
.print-page:hover {
color: #194A8F;
text-decoration: underline;
}
.trialproduct li.c-form-list__item.c-form-list__item--full.product-whats-include {
border-bottom: 1px solid rgba(204, 204, 204, 0.5);
margin-bottom: 0px;
margin-top: 5px;
padding-bottom: 5px;
}
li.c-form-list__item.c-form-list__item--full.product-whats-include {
margin-top: 5px;
}
#product_just_stars .ind_cnt {
color: #404146;
font-size: 13px;
font-weight: 500;
line-height: 23px;
padding: 0 3% 0 0;
text-transform: capitalize;
width: auto;
}
#product_just_stars .on ~ .ind_cnt {
padding: 0 3%;
}
span.write-review {
color: #404146;
cursor: pointer;
font-size: 13px;
font-weight: 500;
line-height: 23px;
width: 40%;
}
span.write-review:before {
background: url(/mm5/themes/shadows/ui/images/wr-ratings.jpg) no-repeat;
background-position: 100% 45%;
content: " ";
margin-right: 2%;
padding: 7% 6%;
width: 100%;
}
span.write-review:hover {
text-decoration: underline;
}
li.c-form-list__item.c-form-list__item--full {
clear: both;
}
div#product_just_stars {
margin-bottom: 1%;
width: 100%;
}
#product_just_stars:after {
clear: both;
content: "";
display: table;
}
span.ind_cnt_desc {
float: right !important;
padding-left: 3px;
}
a.sa_jump_to_reviews {
float: left;
width: 100%;
}
#shopper_review_page .pr_link {
cursor: pointer;
margin-top: 0;
padding: 13px;
}
#review_header {
padding-left: 0;
}
#sa_product_comment_descriptions {
padding-bottom: 8px;
}
.sa_product_heading {
height: 35px;
margin-top: 10px;
padding: 5px !important;
}
#shopper_approved_product textarea {
padding: 5px !important;
}
#sa_product_optin input[ type="text" ] {
height: 30px;
padding: 5px;
}
#product_page #sa_sort {
padding: 5px;
}
.swatchone img.swatchopt {
height: 32px;
width: 32px;
}
.choose-color-sync.o-layout.add-class-swatch.choose-sealers ul li {
border: 1px solid #CCC;
border-radius: 5px;
cursor: pointer;
float: left;
font-size: 14px;
margin-bottom: 6px;
margin-right: 2%;
padding: 3px 10px !important;
width: 40%;
}
.choose-color-sync.o-layout.add-class-swatch.choose-sealers ul li.kit_sealer.active {
background-color: #4888C8;
border: 1px solid #4888C8 !important;
color: #FFFFFF;
}
.choose-color-sync.o-layout.add-class-swatch.choose-sealers ul {
margin-bottom: 15px;
}
.choose-color-sync.o-layout.add-class-swatch.choose-sealers .sealer_limitmessage {
margin-bottom: 3px;
}
.trial_message {
font-size: 14px;
width: 100%;
}
.trial_message span.limit {
color: #ED1E24;
font-weight: bold;
}
#js-CTGY span.ind_cnt {
display: none !important;
}
#js-CTGY .star_container,
.star_container {
margin-bottom: 0px;
min-height: 26px;
}
#js-SRCH span.ind_cnt {
display: none !important;
}
#js-SRCH .star_container {
min-height: 30px;
}
section.x-product-list.x-product-list--carousel span.ind_cnt {
display: none !important;
}
section.x-product-list.x-product-list--carousel .star_container {
min-height: 26px;
}
.fasten-header-phone {
font-size: 16px;
}
.bg-video_icon {
background: url("/mm5/themes/shadows/ui/images/small-sprites.png") -93px -10px;
float: left;
height: 41px;
width: 45px;
}
.bg-quote {
background: url("/mm5/themes/shadows/ui/images/small-sprites.png") -10px -10px;
float: left;
height: 49px;
width: 63px;
}
.bg-quality_icon {
background: url("/mm5/themes/shadows/ui/images/small-sprites.png") -158px -68px;
float: left;
height: 45px;
width: 40px;
}
.bg-professionals_icon {
background: url("/mm5/themes/shadows/ui/images/small-sprites.png") -69px -79px;
float: left;
height: 42px;
width: 50px;
}
.bg-pdf_icon {
background: url("/mm5/themes/shadows/ui/images/small-sprites.png") -10px -79px;
float: left;
height: 47px;
width: 39px;
}
.bg-calender_icon {
background: url("/mm5/themes/shadows/ui/images/small-sprites.png") -158px -10px;
float: left;
height: 38px;
width: 45px;
}
.why-dc li.o-list-inline__item {
line-height: 38px;
padding-left: 2%;
}
#product_just_stars .off {
display: block;
}
#review_header .stars .off {
background-image: url("https://www.shopperapproved.com/page/images_svg/star-empty.svg");
display: inline-block;
height: 24px;
margin: 1px;
width: 25px;
}
.group-stars .off {
background-image: url(https://www.shopperapproved.com/page/images_svg/star-empty.svg);
display: none;
height: 19px;
width: 20px;
}
.group-stars .off {
display: inline-block;
}
.t-site-footer-rating-image img {}
.card-icons img {
width: 440px;
}
.t-site-footer-rating-image .o-layout__item.u-width-12.u-width-2--m {
padding-top: 13px;
text-align: left;
}
.t-site-footer-rating-image .o-layout__item.u-width-12.u-width-2--m img {
float: left;
}
.x-product-description h3 {
font-weight: 600;
margin-bottom: 0;
}
.x-product-description .x-flex-tabs__content h3 {
margin: 7px 0 13px;
}
.bottom-margin {
color: #1F1F22;
margin-bottom: 0;
}
h3 span.flag-content {
font-size: 26px;
}
div#mce-error-response {
color: #FFF !important;
}
div#mce-success-response {
color: #FFF !important;
}
.c-form-select__dropdown {
color: #1F1F22;
font-size: 14px !important;
}
#calculator_content .options.calculator-area {
background-color: #FFF;
border: 1px solid #D1D1D1;
padding: 0;
width: 70%;
}
#calculator_content .result-right-side {
float: left;
width: 28.5%;
}
#calculator_content .all-calculate-options {
float: left;
width: 100%;
}
#calculator_content .disclaimer {
clear: both;
float: left;
font-size: 18px;
margin-top: 5%;
padding: 2% 5% 2% 0;
width: 100%;
}
#calculator_content .options .option {
clear: none;
float: left;
min-height: 530px;
width: 100%;
}
#calculator_content .options.calculator-area .option h3 {
color: #1F2930;
font-size: 18px;
font-weight: bold;
margin-bottom: 2%;
}
.choose-color-kit {
font-weight: 600;
margin-bottom: 3%;
}
#calculator_content .c-form-checkbox__caption {
margin-left: 0;
}
#calculator_content .c-form-checkbox__caption:after {
visibility: hidden;
}
#calculator_content .c-form-checkbox__caption:before {
visibility: hidden;
}
.popup-cal .caltypes .all-calculate-options ul li {
border-bottom: 1px solid #E1E1E1;
color: #757575;
line-height: 20px;
margin-bottom: 0;
max-width: 100%;
padding-top: 0%;
width: 100%;
}
.built-kit-cal .caltypes .all-calculate-options ul li {
border-bottom: 1px solid #E1E1E1;
color: #757575;
line-height: 40px;
margin-bottom: 0;
max-width: 100%;
padding-top: 2%;
width: 100%;
}
#calculator_content .calculator-area-left {
background-color: #F7F7F7;
float: left;
max-width: 100%;
padding-left: 0;
width: 25%;
}
#calculator_content .calculator-area-right {
float: left;
padding: 3% 0 0 4%;
width: 60%;
}
#calculator_content ul.c-form-list.o-layout {
margin: 0;
}
#calculator_content .caltypes {
width: auto;
}
#calculator_content .options.calculator-area.o-layout {
margin: 0 1% 0 calc(0px - 7px);
}
.cal-active {
background-color: #FFF;
border-left: 4px solid #4888C8;
color: #514F4F !important;
font-weight: 500;
}
#calculator_content .calculate-area input {
font-size: 14px;
font-weight: normal;
height: 40px;
max-width: initial;
width: 85%;
}
#calculator_content span.or-break {
float: left;
font-weight: bold;
padding: 4% 0;
text-align: left;
width: 80%;
}
#calculator_content .calculate-area .c-control-group {
display: initial;
float: left;
width: 100%;
}
#calculator_content .length-width {
float: left;
margin-bottom: 5%;
width: 100%;
}
.popup-cal #calculator_content .calculator-area-left {
width: 33%;
}
#calculator_content .first-option-container .continue-button.o-list-inline__item {
margin-right: 7%;
}
.popup-cal #calculator_content .calculatorswatches div img {
cursor: pointer;
height: 50px;
width: 70px;
}
#calculator_content .length-width input[ type="text" ] {
background: url(/mm5/themes/shadows/ui/images/css_sprites_calculator.png) 105px -84px;
background-position: right;
background-repeat: no-repeat;
margin-right: 0%;
width: 40%;
}
.first-option-container-input {
background: url("/mm5/themes/shadows/ui/images/css_sprites_calculator.png") 275px -42px;
background-position: right 25%;
background-repeat: no-repeat;
}
#calculator_content .continue-button.o-list-inline__item {
float: right;
margin-right: 0;
width: 47%;
}
#calculator_content .reset-button.o-list-inline__item input.c-button.u-bg-red.u-text-uppercase {
background-color: #C1BCBC;
font-weight: 500;
height: 40px;
line-height: 10px;
width: 100%;
}
#calculator_content .continue-button.o-list-inline__item input.c-button.u-bg-blue.u-text-uppercase {
font-weight: 500;
}
#calculator_content .disclaimer p {
line-height: 20px;
margin-bottom: 0;
}
#calculator_content .disclaimer p b {
float: left;
width: 100%;
}
#calculator_content .reset-button {
float: left;
width: 40%;
}
#calculator_content .calculatorswatches.slick-initialized.slick-slider {
width: 370px;
}
#built-kit-cal input.fifth-option-container-input {
margin-top: 7%;
}
#built-kit-cal #calculator_content .calculate-area .c-control-group {
margin-top: 2%;
}
.popup-cal #calculator_content .calculatorswatches.slick-initialized.slick-slider {
margin-left: auto;
margin-right: auto;
max-width: 395px;
width: 100%;
}
.popup-cal #calculator_content .slick-next {
right: 0px;
}
.second-cal-container.calculate-area label {
float: left;
width: 50%;
}
.third-option-container label {
float: left;
margin-bottom: 5%;
width: 60% !important;
}
input.third-option-container-input {
background: url("/mm5/themes/shadows/ui/images/css_sprites_calculator.png") 128px -42px;
background-position: right;
background-repeat: no-repeat;
font-size: 14px;
padding-left: 10px;
width: 70% !important;
}
.second-cal-container.calculate-area input.second-option-container-input {
background: url("/mm5/themes/shadows/ui/images/css_sprites_calculator.png") 128px -42px;
background-position: right;
background-repeat: no-repeat;
float: left;
font-size: 14px;
padding-left: 10px;
width: 86% !important;
}
.fourth-option-container input.fourth-option-container-input {
background: url("/mm5/themes/shadows/ui/images/css_sprites_calculator.png") 128px -42px;
background-position: right;
background-repeat: no-repeat;
float: left;
font-size: 14px;
padding-left: 10px;
width: 86% !important;
}
.fourth-option-container .calculate-area label {
float: left;
margin-bottom: 5%;
width: 50%;
}
#calculator_content .calculatorswatches.slick-initialized.slick-slider {
margin-bottom: 2%;
}
.second-option-container .c-control-group {
margin-top: 5%;
}
.fifth-option-container p {
font-size: 14px;
}
select.fifth-option-container-select {
color: #404146;
height: 40px;
width: 57%;
}
input.fifth-option-container-input {
background: url("/mm5/themes/shadows/ui/images/css_sprites_calculator.png") 265px -42px;
background-position: right;
background-repeat: no-repeat;
font-size: 14px;
padding-left: 10px;
width: 88% !important;
}
.built-kit-cal .fifth-option-container p {
float: left;
font-size: 14px;
font-weight: 500;
width: 49%;
}
.built-kit-cal select.fifth-option-container-select {
height: 40px;
width: 80%;
}
.built-kit-cal #calculator_content .calculate-area input {
font-weight: normal;
height: 45px;
margin-top: 7%;
max-width: initial;
}
.result-right-inner {
background-color: #F3F7FD !important;
}
.Calculate_Concrete_Slabs_Columns_and_Footing_Pours .wpb_wrapper h3 {
margin-bottom: 0 !important;
margin-top: 3%;
}
#calculator_content .main-result-area {
background-color: transparent;
float: left;
margin-left: 0;
padding: 3% 0;
width: 100%;
}
.columns-calculator {
background-color: transparent;
float: left;
margin-left: 0;
padding: 3% 0;
width: 100%;
}
.columns-calculator label {
background: transparent;
border-bottom: 1px solid #D7DADC;
display: block;
font-size: 14px;
line-height: 27px;
margin-bottom: 5px;
}
#calculator_content .result-right-inner p {
float: left;
font-weight: bold;
margin-bottom: 0;
margin-top: 2%;
padding-left: 0;
width: 100%;
}
#calculator_content .result-right-inner {
padding: 2%;
}
.main-result-area b {
margin-right: 5px;
padding-left: 28px;
}
.right-note-below li {
width: 100% !important;
}
.right-note .u-font-small {
font-size: 14px !important;
}
.main-result-area label {
border-bottom: 1px solid #D7DADC;
line-height: 27px;
margin-bottom: 5px;
}
.acid-stain-icon {
background: url("/mm5/themes/shadows/ui/images/css_sprites_calculator.png") -10px -10px;
background-repeat: no-repeat;
}
.conc-seal-icon {
background: url("/mm5/themes/shadows/ui/images/css_sprites_calculator.png") -10px -178px;
background-repeat: no-repeat;
}
.con-wax-icon {
background: url("/mm5/themes/shadows/ui/images/css_sprites_calculator.png") -10px -136px;
background-repeat: no-repeat;
}
.color-opt-icon {
background: url("/mm5/themes/shadows/ui/images/new-cal-icons.png") -6px -8px;
background-repeat: no-repeat;
border-bottom: 1px solid #D7DADC;
float: left;
width: 100%;
}
label.pigmnt-req-icon {
background: url("/mm5/themes/shadows/ui/images/new-cal-icons.png") -6px -36px;
background-repeat: no-repeat;
border-bottom: 0;
}
.built-kit-cal #calculator_content .calculatorswatches.slick-initialized.slick-slider {
width: 520px;
}
.built-kit-cal #calculator_content .slick-initialized .slick-slide div div {
text-align: center;
}
.built-kit-cal #calculator_content .slick-prev {
left: -25px;
}
.built-kit-cal #calculator_content .slick-next {
right: -2px;
}
.built-kit-cal #calculator_content .slick-next,
.slick-prev {
background: 0 0;
border: none;
color: transparent;
cursor: pointer;
display: block;
font-size: 0;
height: 20px;
line-height: 0;
outline: 0;
padding: 0;
position: absolute;
top: 50%;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
transform: translate(0, -50%);
width: 20px;
}
.built-kit-cal #calculator_content .wpb_column.vc_column_container.vc_col-sm-6 {
width: 100%;
}
#calculator_content .slick-next,
.slick-prev {
background: 0 0;
border: none;
color: transparent;
cursor: pointer;
display: block;
font-size: 0;
height: 20px;
line-height: 0;
outline: 0;
padding: 0;
position: absolute;
top: 50%;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
transform: translate(0, -50%);
width: 20px;
}
button.c-button.c-control-group__button.u-bg-white.u-color-gray-40.u-icon-subtract {
color: transparent;
}
.u-icon-subtract:before {
color: #707070;
margin-right: -13px;
}
button.c-button.c-control-group__button.u-bg-white.u-color-gray-40.u-icon-add {
color: transparent;
}
.u-icon-add:before {
color: #707070;
/* margin-right:-13px; */
}
/* #js-SRCH span.u-icon-chevron-right{color:transparent;} */
/* #js-SRCH .u-icon-chevron-right::before{color:#000;margin-right:-17px;} */
/* #js-SRCH .u-icon-chevron-right::before{color:#000;margin-right:-17px;} */
#js-SRCH span.u-icon-chevron-left {
color: transparent;
}
#js-SRCH a .u-icon-chevron-left:before {
color: #000;
margin-right: -14px;
}
#js-SRCH .u-icon-chevron-left:before {
color: #000;
}
#js-WLST .t-wish-list-search button.c-button.c-button--large.c-control-group__button.u-bg-transparent.u-color-gray-50.u-icon-search.u-border-none.t-wish-list-search__button {
color: transparent;
width: 15%;
}
#js-WLST .t-wish-list-search .u-icon-search:before {
color: #313131;
content: "\42";
/* margin-right:-50px; */
}
form.x-contact-form.u-hidden {
display: block;
}
.built-kit-cal .calculatorswatches div img {
cursor: pointer;
width: 80px !important;
}
.fourth-option-container label span {
float: left;
margin-top: 6.5%;
}
.second-option-container label span {
float: left;
margin-top: 6.5%;
}
.built-kit-cal #calculator_content .first-option-container .calculate-area input {
margin-top: 5px;
}
.popup-cal {
max-height: 625px !important;
max-width: 1025px !important;
min-height: 625px !important;
}
.right-note {
margin-top: 5%;
}
.popup-cal #calculator_content .fourth-option-container label span {
margin-top: 0;
}
.popup-cal #calculator_content .second-option-container label span {
margin-top: 0;
}
.customer-also-bought button.x-carousel__button.u-icon-chevron-left.relt-prev {
color: transparent;
}
.customer-also-bought button.x-carousel__button.u-icon-chevron-left.relt-prev:before {
color: #000;
margin-right: -15px;
}
.customer-also-bought button.x-carousel__button.u-icon-chevron-right.relt-next {
color: transparent;
}
.customer-also-bought button.x-carousel__button.u-icon-chevron-right.relt-next:before {
color: #000;
margin-right: -15px;
}
.choose-sealers-inner {
border-top: 1px solid rgba(204, 204, 204, 0.5);
margin-top: 5px;
padding-top: 3px;
}
.built-kit-cal .choose-color-kit input#kit_custom_batch {
margin-top: 1% !important;
padding: 0 2%;
width: 95.5% !important;
}
.built-kit-cal .choose-color-kit input#kit_truck_pour {
margin-top: 1% !important;
padding: 0 2%;
width: 95.5% !important;
}
.built-kit-cal .choose-color-kit input#kit_5000_psi {
margin-top: 1% !important;
padding: 0 2%;
width: 95.5% !important;
}
.built-kit-cal .choose-color-kit input#kit_ready_mix {
margin-top: 1% !important;
padding: 0 2%;
width: 95.5% !important;
}
.popup-cal .choose-color-kit input#custom_batch {
margin-top: 0 !important;
padding: 0 2%;
width: 92% !important;
}
.popup-cal .choose-color-kit input#truck_pour {
margin-top: 0 !important;
padding: 0 2%;
width: 92% !important;
}
.popup-cal .second-option-container .choose-color-kit input {
margin-top: 0 !important;
padding: 0 2%;
width: 92% !important;
}
.popup-cal .choose-color-kit input#ready_mix {
margin-top: 0 !important;
padding: 0 2%;
width: 92% !important;
}
#mini_basket button.c-button.u-bg-gray-40.u-icon-cross {
color: transparent;
}
#mini_basket button.c-button.u-bg-gray-40.u-icon-cross:before {
color: #FFF;
margin-right: -10px;
}
.instafeed {
display: flex;
flex: 0 1 auto;
flex-direction: row;
flex-wrap: wrap;
margin-left: auto;
margin-right: auto;
max-width: 100%;
}
.instafeed div.inner-insta-image {
display: block;
flex-basis: 100%;
height: auto;
max-width: calc(100% / 7);
overflow: hidden;
padding: 0;
text-align: center;
width: 320px;
}
.instafeed div.inner-insta-image a {
width: 100%;
}
.like-comment-insta {
max-width: 100% !important;
opacity: 0;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
transform: translateY(-50%);
width: 100% !important;
}
.inner-insta-image {
position: relative;
}
.insta-like {
display: inline-block;
width: 60px;
}
.insta-comment {
display: inline-block;
width: 55px;
}
.bg-comment_icon {
background: url(/mm5/themes/shadows/ui/images/insta-icons.png) -10px -10px;
background-repeat: no-repeat;
color: #FFF;
font-weight: 500;
height: 18px;
padding-left: 45%;
width: 19px;
}
.bg-like_icon {
background: url(/mm5/themes/shadows/ui/images/insta-icons.png) -49px -10px;
background-repeat: no-repeat;
color: #FFF;
font-weight: 500;
height: 17px;
padding-left: 45%;
width: 19px;
}
.image-insta:after {
background: rgba(0, 0, 0, 0.6);
content: "\A";
height: 100%;
left: 0;
opacity: 0;
position: absolute;
top: 0;
-webkit-transition: all 0.5s;
transition: all 0.5s;
width: 100%;
}
.inner-insta-image a:hover .image-insta:after {
opacity: 1;
}
.inner-insta-image a:hover .like-comment-insta {
opacity: 1;
}
i.fas.fa-file-pdf {
color: #ED1E24;
}
@media ( max-width: 736px ) {
.print-page {
display: block;
padding-top: 6px;
position: static;
text-align: unset;
}
.x-product-layout-purchase__name {
display: block;
}
span.write-review:before {
padding-left: 10px;
padding-right: 10px;
}
}
.x-transfigure-navigation .c-navigation__list:first-child> .c-navigation__link .c-navigation__link-carat {
right: 0;
}
.x-transfigure-navigation .c-navigation__link-carat {
right: 5px;
}
@media screen and ( min-width: 1025px ) {
.x-transfigure-navigation .c-navigation__link-carat {
right: 35px;
}
.x-transfigure-navigation .c-navigation__list:first-child> .c-navigation__link .c-navigation__link-carat {
font-size: 0.75em;
right: 22px;
}
}
.Nnq7C {
-webkit-box-direction: normal;
-webkit-box-orient: horizontal;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
}
.v1Nh3 {
display: block;
position: relative;
width: 100%;
}
.Nnq7C> * {
-webkit-box-flex: 1;
-webkit-flex: 1 0 0%;
-ms-flex: 1 0 0%;
flex: 1 0 0%;
}
.KL4Bh {
display: block;
overflow: hidden;
padding-bottom: 100%;
}
.instafeed div.inner-insta-image img {
height: 100%;
left: 0;
object-fit: cover;
padding: 0 4px;
position: absolute;
top: 0;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
width: 100%;
}
#swatches li img {
border-radius: 55px;
font-size: 0;
height: 100px;
width: 101px;
}
.swatch-popup {
background-color: #FFF;
height: 100%;
left: 0;
margin: 0 auto;
max-height: 500px;
max-width: 840px;
overflow-y: scroll;
padding: 2% 30px;
position: fixed;
right: 0;
top: 15%;
width: 100%;
z-index: 99999;
}
.swatch-popup #swatches li {
border: 0;
height: 104px;
margin-bottom: 10px;
margin-left: 1% !important;
margin-right: 1% !important;
width: 105px;
}
.popup-cal> h3 {
font-size: 20px;
font-weight: 500;
margin-bottom: 10px;
padding: 0.5%;
text-align: center;
}
#dialog-form.popup-cal {
padding: 10px 20px;
}
.Truck_Pour_Per_Yard_Calculator.option {
margin-top: -6px;
}
.right-message .u-font-small> p {
margin-bottom: 5px;
}
.right-note-below li a {
color: #404146;
}
.length-width span {
margin-right: 2%;
}
.basecolorgroup label {
float: none !important;
font-size: 14px;
margin-bottom: 0 !important;
width: 25% !important;
}
select.basecolor {
color: #404146;
font-size: 14px;
height: 35px;
width: 25%;
}
.basecolorgroup label:after {
/* content: ":"; */
}
.list input {
height: 40px;
}
.calculate-area label span {
color: #404146;
font-size: 14px;
}
.basecolorgroup {
float: left;
margin-bottom: 4%;
width: 100%;
}
.all-calculate-options .c-form-checkbox {
margin-bottom: 0;
padding: 6% 0;
}
div#row-footing.on {
display: block !important;
}
div#row-column.on {
display: block !important;
}
.new-cas-prod .for-cas-cal-prod img {
border: 1px solid #CCC;
margin-right: 2%;
margin-top: 1%;
width: 10%;
}
.new-cas-prod .for-cas-cal-prod span {
font-size: 13px;
vertical-align: top;
width: 30%;
}
.new-cas-prod {
clear: both;
float: left;
width: 100%;
}
.new-cas-prod .right-note-below h3 {
font-size: 15px !important;
line-height: 17px;
}
.new-cas-prod .right-note-below {
margin-top: 26px;
}
.right-note p {
font-size: 13px;
}
.popup-cal {
max-height: 600px;
}
.result-right-inner h3 {
font-size: 17px;
}
#calculator_content .result-right-inner p {
font-size: 15px;
}
#calculator_content .main-result-area {
font-size: 14px;
}
.last-cal-options .check {
display: block;
}
.last-cal-options .uncheck {
display: none;
}
div#dc_blog {
margin-top: 2.5%;
}
ul.osel-extra-order-info {
float: left;
margin-bottom: 0;
margin-left: 0;
width: 100%;
}
ul.osel-extra-order-info li.c-form-list__item.c-form-list__item--full {
float: left;
margin: 0;
}
#new-order-instruction li {
margin-bottom: 0;
}
ul#new-order-instruction {
float: left;
width: 64%;
}
.osel-custom-order-info {
background-color: #F2F2F2;
float: left;
margin-bottom: 2%;
padding: 2%;
width: 100%;
}
/* #project_details_field {margin-bottom:0;}
#project_other_field {margin-bottom:0;} */
.shipping-country-error {
color: #FF0000;
font-size: 14px;
}
#dc_blog .post-item-inner .entry-image {
width: 23%;
}
.prod-25218-id .x-product-layout-purchase .choose-color-sync.single-active .select-size:nth-child(4):after {
bottom: 1px;
}
.prod-25218-id .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-column.color-swatch:before {
bottom: -3px;
}
.prod-25218-id .x-product-layout-purchase .choose-color-sync.single-active .select-size:nth-child(6) {
min-height: auto;
}
.prod-24823-id .x-product-layout-purchase .choose-color-sync.single-active .select-size:nth-child(4):after {
bottom: 1px;
}
.prod-24823-id .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-column.color-swatch:before {
bottom: -3px;
}
.prod-24823-id .x-product-layout-purchase .choose-color-sync.single-active .select-size:nth-child(6) {
min-height: auto;
}
.prod-25225-id .x-product-layout-purchase .choose-color-sync .select-size:nth-child(4):after {
border-bottom: 1px solid rgba(204, 204, 204, 0.5);
bottom: 0px;
content: "";
left: 0;
position: absolute;
width: 100%;
}
.prod-25225-id .x-product-layout-purchase .choose-color-sync .select-size:nth-child(6) {
min-height: auto;
padding-left: 0;
}
.prod-24774-id .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-column.color-swatch:before {
border-bottom: 0;
}
.prod-25220-id .x-product-layout-purchase .choose-color-sync .select-size:nth-child(4):after {
border-bottom: 1px solid rgba(204, 204, 204, 0.5);
bottom: 0px;
content: "";
left: 0;
position: absolute;
width: 100%;
}
.prod-25220-id .x-product-layout-purchase .choose-color-sync .select-size:nth-child(6) {
min-height: auto;
padding-left: 0;
}
#js-PROD .x-product-layout #lightSlider .slick-list li img {
border: 1px solid #DDDDDD;
box-shadow: none;
display: inline-block;
min-height: 80px;
min-width: 80px;
object-fit: cover;
}
#js-PROD #lightSlider.slick-initialized .slick-slide {
display: inline-block;
float: none;
text-align: center;
width: 80px !important;
}
#js-PROD #lightSlider .slick-track {
/* width: 100% !important; */
margin: 0 auto;
text-align: center;
}
.register-message ul {
padding-left: 0;
}
div#register-benefits li {
font-size: 17px;
list-style: none;
}
div#register-benefits li i.fa.fa-angle-double-right.custom {
font-size: 20px;
}
.register-message label {
font-size: 20px;
font-weight: 600;
}
.o-layout__item.u-width-12.u-width-12--m.o-layout--align-self-center.register-message {
border-top: 0;
margin-top: 11%;
padding-top: 0;
}
.o-layout__item.u-width-12.u-width-12--m.u-width-12--l.u-text-left.continue-as-guest {
margin-top: 4%;
padding-left: 0;
text-align: center;
}
div#payWithAmazonDiv {
/* z-index: 9999; */
background: url(/mm5/graphics/00000001/amazon-pay.jpg);
background-repeat: no-repeat;
background-size: 100% 100%;
float: left;
height: 40px;
margin-bottom: 4%;
width: 60%;
}
div#payWithAmazonDiv img {
opacity: 0;
width: 100%;
}
.popup-wish a.c-button.c-button--hollow.c-button--large.u-bg-gray-10.u-color-gray-50.u-font-small.u-border-none.u-text-bold.u-text-uppercase {
font-size: 0.65em;
}
.popup-addcart {
position: relative;
}
.pleasewait-pooup.o-layout__item.u-width-12.u-width-12--m.u-width-12--l.u-width-12--xl img {
width: 30%;
}
.pleasewait-pooup.o-layout__item.u-width-12.u-width-12--m.u-width-12--l.u-width-12--xl {
left: 5%;
position: absolute;
text-align: center;
top: 3%;
}
.quickview-product-detail .popup-25231 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(2):after {
border-bottom: 0;
}
.quickview-product-detail .popup-25218 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-last-of-type(1) {
min-height: 30px;
padding-left: 0;
padding-right: 5px;
}
.quickview-product-detail .popup-25218 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(4):after,
.quickview-product-detail .popup-25218 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(3):after,
.quickview-product-detail .popup-25218 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(7):after {
bottom: -1px;
}
.quickview-product-detail .popup-25220 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(6) {
min-height: 30px;
padding-left: 0;
padding-right: 3%;
}
.quickview-product-detail .popup-25220 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-last-of-type(1) {
padding-left: 16px;
}
.quickview-product-detail .popup-23756 .show-all-swatches {
right: 3px;
}
.quickview-product-detail .popup-23756 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size.no-bdr {
padding-left: 0px;
}
.quickview-product-detail .popup-24083 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(6) {
min-height: 30px;
}
#js-BASK .u-font-small {
font-size: 14px;
}
#js-OCST .u-font-small,
#js-OSEL .u-font-small,
#js-OPAY .u-font-small {
font-size: 14px;
}
.continue-guest a {
font-weight: 500;
}
section.x-category-tree.t-account-landing-section .t-account-landing-section__content .x-category-tree__link {
font-size: 14px;
}
.t-account-landing-section .o-layout--justify-between {
background-color: #DDD;
border-bottom: 1px solid #DDD;
padding-bottom: 0.5%;
padding-top: 0.5%;
}
section.t-account-landing-section {
background: #F8F8F8;
}
.t-account-landing-section__content.x-category-tree__row {
padding-left: 5%;
padding-right: 5%;
}
.x-category-tree.t-account-landing-section a.c-button--huge {
background: #DDD;
}
.t-account-landing-section__content.x-category-tree__row hr.c-keyline {
margin: 0;
}
.subcat-container strong.x-product-list__name.u-text-uppercase {
font-weight: 500;
text-transform: capitalize;
}
.subcat-container figcaption {
border: 1px solid #CCC;
box-shadow: 0px 0px 5px 2px #DDD;
font-size: 14px;
line-height: 50px;
min-height: 57px;
padding: 1%;
text-align: center;
vertical-align: middle;
}
section.o-layout.u-grids-2.u-grids-3--l.x-product-list.subcat-container {
width: 100%;
}
.o-layout__item.cat-header-third {
float: left;
margin-bottom: 3%;
margin-top: 0;
width: 100%;
}
#js-OCST .c-form-checkbox__input:checked+ .c-form-checkbox__caption:after {
background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDEyOCAxMjgiIGhlaWdodD0iMTI4cHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAxMjggMTI4IiB3aWR0aD0iMTI4cHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxwYXRoIGQ9Ik0xMTYuMTU4LDI5LjMzNmwtNC45NzUtNC45NzVjLTMuNDY5LTMuNDY5LTkuMDg4LTMuNDc4LTEyLjU0OS0wLjAxOUw0OC4xMDMsNzQuODc1TDI5LjM2NCw1Ni4xMzYgIGMtMy40NTktMy40Ni05LjA3OC0zLjQ1LTEyLjU0OSwwLjAyMWwtNC45NzQsNC45NzRjLTMuNDcsMy40Ny0zLjQ4LDkuMDg5LTAuMDIsMTIuNTQ5TDQxLjgsMTAzLjY1NyAgYzEuNzQxLDEuNzQxLDQuMDI2LDIuNjAyLDYuMzEsMi41ODhjMi4yNzksMC4wMTEsNC41NTktMC44NTIsNi4yOTctMi41OWw2MS43NzEtNjEuNzcxICBDMTE5LjYzNywzOC40MjQsMTE5LjYzMSwzMi44MDcsMTE2LjE1OCwyOS4zMzZ6IiBmaWxsPSIjMjMyMzIzIi8+PC9zdmc+") no-repeat center center;
background-color: transparent;
background-size: 100% 100%;
border: 1px solid #CCC;
box-shadow: inset 0 0 0 1px #FFF;
color: #194A8F;
}
#js-INVC .u-font-small {
font-size: 14px;
}
#js-ORDS .u-font-small {
font-size: 14px;
}
section.o-layout.x-product-description li {
font-size: 15px;
}
#js-PRPO .t-main-content-element li {
list-style-type: disc;
}
/* Amazon Pay */
.amazonpay_outer {
display: -moz-inline-stack;
display: inline-block;
left: 0;
margin-top: 2%;
position: static;
vertical-align: middle;
width: 100%;
zoom: 1;
}
.amazonpay_inner {
left: 0;
position: static;
}
iframe#OffAmazonPaymentsWidgets0IFrame {
width: 100%;
}
div#OffAmazonPaymentsWidgets0 {
width: 100% !important;
}
iframe#OffAmazonPaymentsWidgets0IFrame .info-container ul li {
font-size: 14px;
overflow: hidden;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
white-space: nowrap;
}
iframe#OffAmazonPaymentsWidgets0IFrame .info-container {
height: 80px;
}
iframe#OffAmazonPaymentsWidgets0IFrame .address-list li a> span.address-text {
font-size: 14px;
}
iframe#OffAmazonPaymentsWidgets0IFrame .widget .widget_header h1 {
font-size: 18px;
}
.amazonpay-ocst-continue {
float: left;
margin-bottom: 5% !important;
text-align: center;
width: 100%;
}
div#OffAmazonPaymentsWidgets1 {
width: 100% !important;
}
.pdf-data-sheet li span.data-sheet-web {
background-color: #1C55A6;
border-radius: 56px;
display: inline-block;
height: 50px;
margin: 1% 0;
padding: 8px 12px;
width: 50px;
}
.cas-description .wpb_column.vc_column_container.vc_col-sm-6.desc-para {
float: left;
width: 70%;
}
.cas-description .wpb_column.vc_column_container.vc_col-sm-6.desc-img {
float: left;
padding: 0 2%;
width: 30%;
}
.cas-description .vc_row.wpb_row.vc_inner.vc_row-fluid.desc-last-img {
clear: both;
margin-top: 3%;
text-align: left;
}
.cas-description .wpb_text_column.wpb_content_element {
clear: both;
}
.cas-description .vc_row.wpb_row.vc_inner.vc_row-fluid {
clear: both;
}
.cas-description .wpb_column.vc_column_container.vc_col-sm-6 {
float: left;
}
.pigment-description .wpb_column.vc_column_container.vc_col-sm-6 {
float: left;
width: 50%;
}
.pigment-description .vc_row.wpb_row.vc_row-fluid {
float: left;
margin-bottom: 1%;
width: 100%;
}
.pigment-description .vc_toggle_content {
display: none;
margin-bottom: 3%;
}
.pigment-description .vc_toggle_title {
cursor: pointer;
font-weight: 500;
}
.pigment-description .vc_toggle_title h4 {
font-weight: 500;
margin-bottom: 1%;
padding-left: 4%;
}
.pigment-description .vc_toggle_title:before {
content: " +";
font-size: 20px;
margin-top: -4px;
position: absolute;
text-align: center;
}
.pigment-description .vc_toggle_title.close:before {
content: " -";
}
.pigment-description .vc_toggle.vc_toggle_square.vc_toggle_color_default.vc_toggle_size_md {
float: left;
width: 100%;
}
.pigment-description .vc_toggle_active .pigment-description .vc_toggle_title:before {
display: none;
}
.tinted-description .wpb_column.vc_column_container.vc_col-sm-6 {
float: left;
width: 50%;
}
.tinted-description .vc_row.wpb_row.vc_row-fluid {
float: left;
margin-bottom: 1%;
width: 100%;
}
.tinted-description .vc_toggle_content {
display: none;
margin-bottom: 3%;
}
.tinted-description .vc_toggle_title {
cursor: pointer;
font-weight: 500;
}
.tinted-description .vc_toggle_title h4 {
font-weight: 500;
padding-left: 20px;
}
.tinted-description p {
clear: both;
}
.tinted-description .vc_toggle_title:before {
content: " +";
font-size: 20px;
margin-top: -4px;
position: absolute;
text-align: center;
}
.tinted-description .vc_toggle_title.close:before {
content: " -";
}
.tinted-description .vc_toggle.vc_toggle_square.vc_toggle_color_default.vc_toggle_size_md {
float: left;
width: 100%;
}
.tinted-description .vc_toggle_active .vc_toggle_title:before {
display: none;
}
.tinted-description .wpb_column.vc_column_container.vc_col-sm-6 {
float: left;
}
.x-flex-tabs .tinted-description iframe {
margin-bottom: 20px;
width: 100%;
}
.tinted-description .wpb_column .vc_column-inner .wpb_content_element {
float: left;
margin-bottom: 20px !important;
width: 100%;
}
.tinted-description .wpb_column.vc_column_container.vc_col-sm-6.desc-para {
float: left;
width: 70%;
}
.tinted-description .wpb_column.vc_column_container.vc_col-sm-6.desc-img {
float: left;
padding: 0 2%;
width: 30%;
}
.pigment-description a {
color: #194A8F;
}
.tinted-description a {
color: #194A8F;
}
#js-project-consultation .left-fda-form {
margin-top: 0;
}
.pigment-description .wpb_column .vc_column-inner .wpb_content_element {
margin-bottom: 0px !important;
}
.pigment-description .vc_empty_space {
clear: both;
}
.srch-image-container {
min-height: 220px;
}
.prod-25979-id .x-product-layout-purchase .choose-color-sync.single-active .select-size:nth-child(7) {
display: none;
}
.prod-25979-id .x-product-layout-purchase .choose-color-sync.single-active .select-size:nth-of-type(3):after {
border: 0;
}
.prod-26134-id .x-product-layout-purchase .choose-color-sync.single-active .select-size:nth-child(7) {
display: none;
}
.prod-26134-id .x-product-layout-purchase .choose-color-sync.single-active .select-size:nth-of-type(3):after {
border: 0;
}
.quickview-product-detail .popup-26134 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(7) {
display: none;
}
.quickview-product-detail .popup-26134 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(5):after {
border-bottom: 0;
}
#js-CTGY_PRO_TYPE .subcat-container strong.x-product-list__name.u-text-uppercase {
display: table-cell;
font-weight: 500;
height: 48px;
line-height: 17px;
padding: 3% 7%;
text-transform: capitalize;
vertical-align: middle;
width: 305px;
}
#js-SRCH section#srch-content.hidecontent {
height: 456px;
overflow: hidden;
}
#js-SRCH section#srch-content.hidecontent.showcontent {
height: auto;
overflow: visible;
}
#js-SRCH .loadlesssearch {
background: #E3E3E3;
border-radius: 5px;
color: #333;
cursor: pointer;
font-size: 18px;
font-weight: normal;
margin: 0 auto;
margin-bottom: 5%;
padding: 0.5% 0.5%;
text-align: center;
text-transform: uppercase;
width: 13%;
}
#js-SRCH .loadmoresearch {
background: #E3E3E3;
border-radius: 5px;
color: #333;
cursor: pointer;
font-size: 18px;
font-weight: normal;
margin: 0 auto;
margin-bottom: 5%;
padding: 0.5% 0.5%;
text-align: center;
text-transform: uppercase;
width: 13%;
}
section.o-layout.u-grids-1.u-grids-3--m.u-grids-5--l.u-grids-7--wl.x-product-list.subcat-container {
counter-reset: section;
}
section.o-layout.u-grids-2.u-grids-4--l.x-product-list.subcat-container strong.x-product-list__name.u-text-uppercase:before {
content: ""counter(section) ") ";
counter-increment: section;
}
section.o-layout.u-grids-1.u-grids-7--l.x-product-list.subcat-container {
counter-reset: section;
}
/* section.o-layout.u-grids-1.u-grids-7--l.x-product-list.subcat-container strong.x-product-list__name.u-text-uppercase:before {
content: "" counter(section) ") ";
counter-increment: section;
} */
.or-pay {
float: left;
font-size: 16px;
line-height: 44px;
text-align: center;
text-transform: capitalize;
width: 28%;
}
.customer-also-bought h4.c-heading-charlie.u-text-bold.u-text-left.u-color-gray-50 {
margin-top: 2%;
padding-left: 2%;
}
#srch-content .srch-image-container {
line-height: 235px;
max-height: 235px;
min-height: 235px;
}
#srch-content .srch-image-container img {
vertical-align: middle;
}
#srch-content strong.x-product-list__name {
min-height: 40px;
}
#js-CTGY .srch-image-container {
line-height: 310px;
max-height: 310px;
min-height: 310px;
}
#js-CTGY .srch-image-container img {
vertical-align: middle;
}
#js-PROD .srch-image-container {
line-height: 300px;
max-height: 244px;
min-height: 244px;
}
#js-PROD .related-products figcaption {
font-size: 14px;
}
#js-PROD .srch-image-container img {
vertical-align: middle;
}
#js-PROD .owl-carousel .owl-item img {
display: inline-block;
width: 100%;
}
#js-PROD .customer-also-bought .x-product-list__name {
min-height: 45px;
}
#js-CTGY_PRO_TYPE .srch-image-container {
line-height: 250px;
max-height: 250px;
min-height: 250px;
}
#js-CTGY_PRO_TYPE .srch-image-container img {
vertical-align: middle;
}
.antq-description .vc_row.wpb_row.vc_row-fluid {
clear: both;
float: left;
width: 100%;
}
.antq-description .wpb_column.vc_column_container.vc_col-sm-6.desc-para {
float: left;
width: 70%;
}
.antq-description .wpb_column.vc_column_container.vc_col-sm-6.desc-img {
float: left;
padding: 0 2%;
width: 30%;
}
.antq-description .wpb_column.vc_column_container.vc_col-sm-6 {
float: left;
}
.antq-description .wpb_column.vc_column_container.vc_col-sm-6.desc-img .vc_empty_space {
display: none;
}
.antq-description .wpb_column.vc_column_container.vc_col-sm-6.desc-para .vc_empty_space {
display: none;
}
.antq-description .wpb_column.vc_column_container.vc_col-sm-4 {
float: left;
margin-top: 2%;
text-align: center;
}
.deco-description .vc_row.wpb_row.vc_row-fluid {
clear: both;
float: left;
width: 100%;
}
.deco-description .wpb_column.vc_column_container.vc_col-sm-6.desc-para {
float: left;
width: 70%;
}
.deco-description .wpb_column.vc_column_container.vc_col-sm-6.desc-img {
float: left;
padding: 0 2%;
width: 30%;
}
.deco-description .wpb_column.vc_column_container.vc_col-sm-6 {
float: left;
}
.decog-description .wpb_column.vc_column_container.vc_col-sm-6.desc-img .vc_empty_space {
display: none;
}
.decog-description .wpb_column.vc_column_container.vc_col-sm-6.desc-para .vc_empty_space {
display: none;
}
.deco-description .wpb_column.vc_column_container.vc_col-sm-4 {
float: left;
margin-top: 2%;
text-align: center;
}
.decog-description .vc_toggle.vc_toggle_default.vc_toggle_color_default.vc_toggle_size_md {
float: left;
width: 100%;
}
.decog-description .vc_toggle.vc_toggle_default.vc_toggle_color_default.vc_toggle_size_md {
float: left;
width: 100%;
}
.wpb_wrapper.antq-description a {
color: #194A8F;
}
.wpb_wrapper.decog-description a {
color: #194A8F;
}
.product-whats-include p {
margin-bottom: 0;
}
.prod-18678-id .x-product-layout-purchase .x-product-layout-purchase__options {
border-bottom: 0;
}
.prod-25271-id .x-product-layout-purchase .choose-color-sync.single-active .select-size:nth-child(6) {
min-height: 69px;
}
.prod-24811-id .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-column.color-swatch:before {
border-bottom: 0;
}
.prod-29410-id .x-product-layout-purchase .choose-color-sync.single-active .select-size:nth-child(6) {
min-height: 69px;
}
.prod-29410-id .x-product-layout-purchase .choose-color-sync .select-size:nth-child(6) {
min-height: 65px;
padding-left: 0;
}
.prod-29410-id .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(4) {
border-bottom: 1px solid rgba(204, 204, 204, 0.5);
}
.prod-28419-id .x-product-layout-purchase .choose-color-sync.single-active .select-size:nth-child(6) {
min-height: 69px;
}
.prod-28419-id .x-product-layout-purchase .choose-color-sync.single-active .select-size:nth-child(4):after {
bottom: 0;
}
.prod-28419-id .x-product-layout-purchase .choose-color-sync .select-size:nth-child(2):after {
bottom: -2px;
}
.prod-29410-id .x-product-layout-purchase .choose-color-sync .select-size:nth-child(2):after {
bottom: -2px;
}
.prod-29410-id .x-product-layout-purchase .choose-color-sync.single-active .select-size:nth-child(4):after {
bottom: 0px;
}
.prod-26553-id .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-column.color-swatch:before {
border-bottom: 0;
}
.prod-26604-id .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-column.color-swatch:before {
border-bottom: 0;
}
.prod-26656-id .x-product-layout-purchase .choose-color-sync.single-active .select-size:nth-child(4):after {
bottom: -1px;
}
.prod-26656-id .x-product-layout-purchase .choose-color-sync.single-active .select-size:nth-child(6) {
min-height: 69px;
}
#js-PROD .customer-also-bought {
margin-top: 5%;
}
.vc_empty_space {
float: left;
width: 100%;
}
.vc_toggle_title {
clear: both;
float: left;
}
.vc_toggle {
float: left;
}
#js-BASK .cart-ship-estimate {
text-decoration: underline;
text-transform: capitalize;
}
.commeon-description a {
color: #194A8F !important;
text-decoration: underline !important;
}
.commeon-description .pigment-description .vc_toggle_title {
width: 100%;
}
.mega-menu-navigation.o-layout.u-grids-1.u-grids-1--m.u-grids-4--l .o-layout__item.level-3 {
display: none;
}
.quickview-product-detail .popup-25252 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-last-of-type(1) {
min-height: 63px;
padding-left: 0;
}
.quickview-product-detail .popup-25252 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(3):after,
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(7):after {
bottom: 0;
}
.quickview-product-detail .popup-25271 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(6) {
border-bottom: 1px solid rgba(204, 204, 204, 0.5);
min-height: 69px;
}
.quickview-product-detail .popup-24083 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-last-of-type(1) {
padding-left: 5px;
}
.quickview-product-detail .popup-24083 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(7):after {
border-bottom: 0;
margin-bottom: 0;
}
.quickview-product-detail .popup-24083 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(6) {
border-bottom: 0;
margin-bottom: 0;
}
.quickview-product-detail .popup-23756 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(5):after {
border-bottom: 0;
}
.quickview-product-detail .popup-23756 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size.no-bdr:nth-child(3):after,
..quickview-product-detail .popup-23756 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size.no-bdr:nth-child(7):after {
bottom: -4px;
}
.quickview-product-detail .popup-23756 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size.no-bdr {
border-bottom: 0;
padding-left: 5px;
}
.quickview-product-detail .popup-24835 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(5) {
border-bottom: 1px solid rgba(204, 204, 204, 0.5);
min-height: 69px;
}
.quickview-product-detail .popup-25740 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(7):after {
border-bottom: 0;
}
.quickview-product-detail .popup-25740 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size.no-bdr {
min-height: 69px;
padding-left: 0px;
}
.quickview-product-detail .popup-23797 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(5):after {
border-bottom: 0;
}
.quickview-product-detail .popup-23797 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size.no-bdr:nth-child(4):after {
bottom: -4px;
}
.quickview-product-detail .popup-24083 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-column.color-swatch:before {
border-bottom: 0;
border-bottom: 1px solid rgba(204, 204, 204, 0.5);
bottom: -3px;
margin-bottom: 0;
}
.quickview-product-detail .popup-24823 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(4):after {
bottom: -1px;
}
.quickview-product-detail .popup-24823 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-last-of-type(1) {
margin-bottom: 0;
min-height: 69px;
padding-left: 0;
padding-right: 5px;
}
.quickview-product-detail .popup-25196 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(7):after {
bottom: -3px;
}
.quickview-product-detail .popup-25225 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(6) {
min-height: 63px;
padding-left: 0;
padding-right: 5px;
}
.quickview-product-detail .popup-24835 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-column.color-swatch:before {
bottom: 0;
}
.quickview-product-detail .popup-24835 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(7):after {
bottom: 0;
}
.quickview-product-detail .popup-25234 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(2):after {
border-bottom: 0;
}
.quickview-product-detail .popup-25252 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(2):after {
border-bottom: 1px solid rgba(204, 204, 204, 0.5);
}
.quickview-product-detail .popup-25252 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(4):after {
bottom: 0;
}
.quickview-product-detail .popup-25261 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(2):after {
border-bottom: 0;
}
.quickview-product-detail .popup-26236 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(2):after {
border-bottom: 0;
}
.quickview-product-detail .popup-26523 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(2) {
padding-right: 5px;
}
.quickview-product-detail .popup-26523 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(2):after {
border-bottom: 1px solid rgba(204, 204, 204, 0.5);
}
.quickview-product-detail .popup-26523 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-last-of-type(1) {
min-height: 63px;
padding-left: 0;
padding-right: 5px;
}
.quickview-product-detail .popup-26523 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(4):after {
bottom: 0px;
}
.quickview-product-detail .popup-26266 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(2):after {
border-bottom: 0;
}
.quickview-product-detail .popup-26544 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(4):after {
border-bottom: 0;
}
.quickview-product-detail .popup-26527 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(2) {
padding-right: 5px;
}
.quickview-product-detail .popup-26527 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(2):after {
border-bottom: 1px solid rgba(204, 204, 204, 0.5);
}
.quickview-product-detail .popup-26527 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-last-of-type(1) {
min-height: 63px;
padding-left: 0;
}
.quickview-product-detail .popup-26527 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(4):after {
border-bottom: 1px solid rgba(204, 204, 204, 0.5);
bottom: 0;
}
.quickview-product-detail .popup-26532 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(4):after {
bottom: 0;
padding-right: 5px;
}
.quickview-product-detail .popup-26532 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-last-of-type(1) {
min-height: 63px;
padding-left: 0;
}
.quickview-product-detail .popup-26282 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(2):after {
border-bottom: 0;
}
.quickview-product-detail .popup-26530 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(2) {
padding-right: 5px;
}
.quickview-product-detail .popup-26530 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(2):after {
border-bottom: 1px solid rgba(204, 204, 204, 0.5);
}
.quickview-product-detail .popup-26530 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(4):after {
bottom: 0;
}
.quickview-product-detail .popup-26530 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-last-of-type(1) {
min-height: 63px;
padding-left: 0;
}
.quickview-product-detail .popup-26530 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(2):after {
border-bottom: 1px solid rgba(204, 204, 204, 0.5);
}
.quickview-product-detail .popup-25265 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(2):after {
border-bottom: 0;
}
.quickview-product-detail .popup-25271 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(2):after {
border-bottom: 1px solid rgba(204, 204, 204, 0.5);
}
.quickview-product-detail .popup-25975 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(2):after {
border-bottom: 0;
}
.quickview-product-detail .popup-25979 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(7) {
display: none;
}
.quickview-product-detail .popup-25979 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(5):after {
border-bottom: 0;
}
.quickview-product-detail .popup-26219 .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-child(2):after {
border-bottom: 0;
}
.addtocart-container-q .quick-wishlist input.c-button {
font-size: 17px;
padding: 5%;
}
#design_idea_menu img {
max-width: 65% !important;
}
#js-PROD figure.mz-figure img {
object-fit: contain;
}
.calltoorderbutton {
float: left;
margin-top: 2%;
padding: 0;
width: 30%;
}
.calltoorderbutton .c-button.c-button--full.c-button--huge.u-bg-blue.u-color-white.u-text-bold.u-font-medium.u-text-uppercase {
float: right;
padding: 15px;
width: 100%;
}
.opencontact {
float: left;
padding: 2%;
width: 50%;
}
.opencontact span.u-text-bold.u-text-uppercase {
display: none;
}
.opencontact {
position: relative;
}
.opencontact div#helpful_info {
background-color: #F1F1F1;
border: 1px solid #F1F1F1;
border-radius: 10px;
padding: 1% 2%;
position: absolute;
right: 22%;
top: 13px;
}
.opencontact div#helpful_info p.u-color-gray-40.u-text-regular {
color: #404146;
margin-bottom: 5px;
}
.opencontact div#helpful_info:before {
border-color: #F1F1F1;
border-color: transparent #F1F1F1 transparent transparent;
border-style: solid;
/* margin-top: -5px; */
border-width: 13px;
content: "";
position: absolute;
right: 100%;
top: 10%;
}
#js-PROD .caltypes ul li {
width: 100%;
}
#js-PROD .caltypes #navsite li {
width: auto;
}
#js-PROD #calculator_content ul.c-form-list.o-layout {
margin: 0;
padding-left: 0;
}
#js-PROD .calculatorswatches div img {
cursor: pointer;
height: 50px;
width: 70px;
}
#js-PROD #calculator_content .calculatorswatches.slick-initialized.slick-slider {
margin: 0 auto;
}
#js-PROD #calculator_content .slick-slider .slick-prev.slick-arrow {
left: -33px;
}
#js-PROD #calculator_content .slick-slider .slick-next {
right: -9px;
}
#js-PROD .fourth-option-container label span {
float: left;
margin-top: -1.5%;
}
#js-PROD .second-option-container label span {
float: left;
margin-top: -1.5%;
}
.design-idea-menu.resources-dc {
padding-bottom: 3%;
}
#js-PROD input.c-button.add-to-wish-prod.c-button--primary.u-bg-blue.c-button--medium.u-color-white.add-to-cart.c-button--full {
width: auto;
}
@supports (-ms-ime-align:auto) {
.caltypes.o-layout {
margin-bottom: 2%;
}
.instafeed {
display: flex;
flex: none;
flex-direction: row;
flex-wrap: nowrap;
width: 100%;
}
}
@media( max-width: 767px ) {
#js-SRCH .c-form-checkbox__input:checked+ .c-form-checkbox__caption:after {
top: 2px;
}
.ctgy-prod-price-container {
font-size: 14px;
min-height: 42px;
}
#js-CTGY .ctgy-prod-price-container {
min-height: 42px !important;
}
#js-SRCH .ctgy-prod-price-container {
min-height: 42px !important;
}
#js-SRCH .ctgy-prod-price-inner {
font-size: 14px !important;
}
#js-CTGY .ctgy-prod-price-inner {
font-size: 14px !important;
}
.calltoorderbutton {
width: 100%;
}
.opencontact {
float: left;
padding: 2%;
width: 100%;
z-index: 9;
}
.opencontact div#helpful_info {
left: 0;
right: 0;
width: 100%;
}
.opencontact div#helpful_info:before {
border-color: #F1F1F1;
border-color: transparent transparent #F1F1F1 transparent;
border-style: solid;
/* margin-top: -5px; */
border-width: 13px;
content: "";
position: absolute;
right: 50%;
top: -27px;
}
#js-SRCH .loadmoresearch {
width: 50%;
}
.x-fasten-header--is-active .x-fasten-header .o-layout__item.u-width-12.u-width-3--l.u-width-3--w.u-text-center--m.u-text-center.u-text-right--l.company-phone {
margin-top: 2%;
}
.x-fasten-header--is-active .x-fasten-header .o-layout__item.u-width-12.u-width-5--l.u-width-6--w {
margin-top: 3%;
}
.x-fasten-header--is-active section.o-wrapper.t-site-header__masthead {
padding-bottom: 10px;
padding-top: 0;
}
.metallic-epoxy-countertop-tab> label {
background: transparent;
border-bottom: 2px solid;
font-weight: 500;
}
.metallic-epoxy-countertop-tab> label.active {
margin-bottom: 20px;
}
.metallic-epoxy-countertop-tab .tabcontent {
border-top: 1px solid #CCC !important;
padding-top: 15px;
}
.tabcontent .wpb_column.vc_column_container.vc_col-sm-6 {
float: left;
width: 100%;
}
.tabcontent .wpb_column.vc_column_container.vc_col-sm-6 img {
width: 100%;
}
label.tablinks.mobile-view.x-flex-tabs__tab.u-text-uppercase.active:after {
content: "_";
float: right;
}
.metallic-epoxy-countertop-tab> .tab {
display: none;
}
.metallic-epoxy-countertop-tab label.tablinks.mobile-view {
display: block;
}
tr.c-table-responsive__row.cart-item-iterator {
position: relative;
}
td.c-table-responsive__cell.u-font-small.u-text-right.close-icon {
position: absolute;
right: 0;
top: 0;
}
td.c-table-responsive__cell.u-text-right.item-subtotal {
padding-top: 0;
}
td.c-table-responsive__cell.item-qty {
padding-top: 0;
}
.item-sku-code {
margin-bottom: 0;
}
td.u-text-right.item-subtotal.c-table-responsive__cell:before {
content: attr(data-label);
display: block;
float: left;
font-weight: 700;
text-align: left;
width: 58%;
}
#js-PROD figure.mz-figure img {
height: auto;
}
#js-coverage_calculator .popup-cal #calculator_content .calculatorswatches div img {
margin: 0 auto;
}
#js-coverage_calculator .slick-initialized .slick-slide div div {
margin: 0 auto;
text-align: center;
}
#js-coverage_calculator #calculator_content .slick-prev {
left: -10px;
}
.apple-pay-button-with-text.apple-pay-button-black-with-text {
height: 50px !important;
margin: 0 0 7% 0 !important;
width: 100% !important;
}
.popup-cal #calculator_content .calculatorswatches div img {
margin: 0 auto;
}
.popup-cal .slick-initialized .slick-slide div div {
margin: 0 auto;
text-align: center;
}
.popup-cal #calculator_content .slick-prev {
left: -10px;
}
.pdf-data-sheet li {
width: 100% !important;
}
.desc-para {
width: 100% !important;
}
.desc-img {
width: 100% !important;
}
.dc-newsletter .u-width-12 {
flex-basis: initial;
}
section.o-layout.u-text-center.t-site-footer__disclaimer .u-width-12 {
flex-basis: initial;
}
#js-PROD .x-product-layout #lightSlider .slick-list li img {
min-height: 58px;
min-width: 58px;
}
#js-PROD #lightSlider.slick-initialized .slick-slide {
display: inline-block;
float: left;
text-align: center;
width: 50px !important;
}
#js-PROD #lightSlider .slick-track {
width: 767px !important;
}
.footer-image .o-layout__item.u-width-12.u-width-12--m.o-layout--align-self-center.card-icons {
max-width: 88%;
width: 100%;
}
.card-icons .shopperlink {
float: none;
}
.additional-container-new p {
margin-bottom: 2%;
width: 100%;
}
.card-icons .accredited-icon {
float: none;
}
.footer-payment-icons {
margin-top: 3%;
}
.print-page {
display: none;
}
div#residential_address_field {
border: 1px solid #C0C0C0;
float: left;
/* margin: 0 0 3% 0; */
padding: 4% 2%;
position: relative;
width: 100%;
}
.ocst-addt-res-label {
float: left;
margin-right: 10% !important;
}
.ocst-addt-com-label {
float: left;
margin-right: 10% !important;
}
body#js-Register section.o-layout.o-layout--justify-start ul.c-form-list li {
float: left;
margin-right: 0px;
width: 100% !important;
}
.swatch-popup {
max-height: 100%;
padding-left: 10px;
padding-right: 10px;
top: 0;
}
.swatch-popup .close-the-spop {
top: 2%;
}
.swatch-popup #swatches li {
height: 98px;
margin-bottom: 2%;
width: 31%;
}
.swatch-popup #swatches li img {
border-radius: 58px;
font-size: 0;
height: 100%;
padding: 5%;
width: 100%;
}
.prod-videos li {
width: 100%;
}
.prod-videos iframe {
padding: 0;
width: 100%;
}
.prod-videos {
margin-left: 0;
}
ul.pdf-data-sheet {
margin-left: 0;
}
.pdf-data-sheet li {
width: 30%;
}
.popup-cal #calculator_content .calculator-area-left {
width: 100%;
}
.built-kit-cal .fifth-option-container p {
width: 100%;
}
.built-kit-cal select.fifth-option-container-select {
height: 40px;
width: 90%;
}
.built-kit-cal input.fifth-option-container-input {
width: 90%;
}
#calculator_content .options.calculator-area.o-layout {
margin: 0;
width: 100%;
}
#calculator_content .calculator-area-left {
width: 100%;
}
#calculator_content .result-right-side {
float: left;
width: 100%;
}
#calculator_content .result-right-inner {
text-align: left;
}
.popup-cal {
height: 100% !important;
max-height: 100%;
max-width: 380px !important;
top: 50% !important;
}
.built-kit-cal {
max-width: 380px !important;
top: 36% !important;
}
#calculator_content .caltypes {
width: 106%;
}
.built-kit-cal #calculator_content .slick-prev {
left: -16px;
}
.built-kit-cal #calculator_content .slick-next {
right: -17px;
}
.built-kit-cal #calculator_content .calculatorswatches.slick-initialized.slick-slider {
width: 100%;
}
#calculator_content .calculator-area-right {
padding: 3% 4% 0 4%;
}
#calculator_content .calculatorswatches.slick-initialized.slick-slider {
width: 100%;
}
.slick-list img {
padding: 2%;
}
.slick-initialized .slick-slide div div {
text-align: center;
}
.slick-next {
right: -15px;
}
.slick-prev {
left: -14px;
}
#calculator_content .slick-next,
.slick-prev {
background: 0 0;
border: none;
color: transparent;
cursor: pointer;
display: block;
font-size: 0;
height: 20px;
line-height: 0;
outline: 0;
padding: 0;
position: absolute;
top: 50%;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
transform: translate(0, -50%);
width: 20px;
}
#calculator_content .calculate-area input {
width: 87%;
}
#calculator_content .length-width input[ type="text" ] {
width: 38%;
}
.popup-cal #calculator_content .calculatorswatches.slick-initialized.slick-slider {
width: 100%;
}
.popup-cal #calculator_content .slick-next {
right: -12px;
}
.popup-cal #calculator_content .fourth-option-container input.fourth-option-container-input {
width: 94% !important;
}
.popup-cal #calculator_content .fourth-option-container .calculate-area label {
width: 100%;
}
#calculator_content .reset-button {
width: 41%;
}
.built-kit-cal input.third-option-container-input {
width: 95% !important;
}
.built-kit-cal .third-option-container label {
width: 100% !important;
}
.built-kit-cal .choose-color-kit input#kit_custom_batch {
width: 100% !important;
}
.built-kit-cal .choose-color-kit input#kit_truck_pour {
width: 100% !important;
}
.built-kit-cal .choose-color-kit input#kit_5000_psi {
width: 100% !important;
}
.built-kit-cal .choose-color-kit input#kit_ready_mix {
width: 100% !important;
}
.popup-cal input.third-option-container-input {
width: 78% !important;
}
.popup-cal .third-option-container label {
width: 100% !important;
}
.popup-cal .choose-color-kit input#custom_batch {
width: 100% !important;
}
.popup-cal .choose-color-kit input#truck_pour {
width: 100% !important;
}
.popup-cal .second-option-container .choose-color-kit input {
width: 100% !important;
}
.popup-cal .choose-color-kit input#ready_mix {
width: 100% !important;
}
.built-kit-cal .fourth-option-container .calculate-area label {
width: 100%;
}
.built-kit-cal .fourth-option-container input.fourth-option-container-input {
width: 94% !important;
}
.built-kit-cal .fourth-option-container .calculate-area label:nth-child(4) {
margin-bottom: 0;
}
.popup-cal .second-option-container .calculate-area label {
width: 100%;
}
.popup-cal .second-option-container input.second-option-container-input {
margin-top: 2%;
width: 92% !important;
}
.popup-cal .fifth-option-container p {
font-size: 13px;
}
.dc-newsletter-form #newsletter_form.readytheme-contentsection .c-control-group .c-control-group__button {
top: 0;
}
#newsletter_form.readytheme-contentsection #mc_embed_signup_scroll .c-control-group .c-control-group__field {
float: left;
width: 60%;
}
.instafeed {
display: inline-block;
flex: 0 1 auto;
flex-direction: row;
flex-wrap: wrap;
float: left;
margin: 0 auto;
width: 100%;
}
.instafeed div.inner-insta-image {
display: inline-block;
flex-basis: 50%;
max-height: 100%;
max-width: 50%;
min-height: 100%;
width: 100%;
}
.hash-feed {
margin-bottom: 20px;
}
.swatch-popup .x-product-layout-purchase__swatches li img {
height: 109px;
width: 110px;
}
.x-product-layout-purchase__swatches .o-list-inline__item:not(:last-child) {
margin-right: 2%;
}
.swatch-popup .x-product-layout-purchase__swatches ul li {
height: 110px;
vertical-align: top;
width: 110px;
}
span.ocst-cont,
.osel-cont {
float: left !important;
width: auto !important;
}
}
@media only screen and ( min-device-width: 375px ) and ( max-device-width: 812px )and ( -webkit-device-pixel-ratio: 3 ) {
.popup-cal #calculator_content .calculator-area-left {
width: 100%;
}
.built-kit-cal .fifth-option-container p {
width: 100%;
}
.built-kit-cal select.fifth-option-container-select {
height: 40px;
width: 90%;
}
#calculator_content .options.calculator-area.o-layout {
margin: 0;
width: 100%;
}
#calculator_content .calculator-area-left {
width: 100%;
}
#calculator_content .result-right-side {
float: left;
width: 100%;
}
#calculator_content .result-right-inner {
text-align: left;
}
.popup-cal {
height: 100% !important;
max-height: 100%;
max-width: 380px !important;
top: 50% !important;
}
.built-kit-cal {
max-width: 380px !important;
top: 36% !important;
}
#calculator_content .caltypes {
width: 106%;
}
.built-kit-cal #calculator_content .slick-prev {
left: -16px;
}
.built-kit-cal #calculator_content .slick-next {
right: -17px;
}
.built-kit-cal #calculator_content .calculatorswatches.slick-initialized.slick-slider {
width: 100%;
}
#calculator_content .calculator-area-right {
padding: 3% 4% 0 4%;
}
#calculator_content .calculatorswatches.slick-initialized.slick-slider {
width: 100%;
}
.slick-list img {
padding: 2%;
}
.slick-initialized .slick-slide div div {
text-align: center;
}
.slick-next {
right: -20px;
}
.slick-prev {
left: -20px;
}
#calculator_content .slick-next,
.slick-prev {
background: 0 0;
border: none;
color: transparent;
cursor: pointer;
display: block;
font-size: 0;
height: 20px;
line-height: 0;
outline: 0;
padding: 0;
position: absolute;
top: 50%;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
transform: translate(0, -50%);
width: 20px;
}
#calculator_content .calculate-area input {
width: 87%;
}
#calculator_content .length-width input[ type="text" ] {
width: 40%;
}
.popup-cal #calculator_content .calculatorswatches.slick-initialized.slick-slider {
width: 100%;
}
.popup-cal #calculator_content .slick-next {
right: -12px;
}
.popup-cal #calculator_content .fourth-option-container input.fourth-option-container-input {
width: 92% !important;
}
#slabs ul.c-form-list li.c-form-list__item:nth-child(4) {
padding-right: 0;
}
#js-BASK .t-basket__product-summary tbody .c-table-responsive__cell {
padding-top: 0;
}
.apple-pay-button-with-text.apple-pay-button-black-with-text {
float: left;
height: 30px;
margin-bottom: 3%;
padding: 6.5% !important;
width: 69% !important;
}
.popup-cal #calculator_content .fourth-option-container .calculate-area label {
width: 100%;
}
.popup-cal #calculator_content .fourth-option-container label span {
float: left;
margin-top: 0;
}
#calculator_content .reset-button {
width: 41%;
}
.built-kit-cal input.third-option-container-input {
width: 95% !important;
}
.built-kit-cal .third-option-container label {
width: 100% !important;
}
.built-kit-cal .choose-color-kit input#kit_custom_batch {
width: 100% !important;
}
.built-kit-cal .choose-color-kit input#kit_truck_pour {
width: 100% !important;
}
.built-kit-cal .choose-color-kit input#kit_5000_psi {
width: 100% !important;
}
.built-kit-cal .choose-color-kit input#kit_ready_mix {
width: 100% !important;
}
.popup-cal input.third-option-container-input {
width: 80% !important;
}
.popup-cal .third-option-container label {
width: 100% !important;
}
.popup-cal .choose-color-kit input#custom_batch {
width: 100% !important;
}
.popup-cal .choose-color-kit input#truck_pour {
width: 100% !important;
}
.popup-cal .second-option-container .choose-color-kit input {
width: 100% !important;
}
.popup-cal .choose-color-kit input#ready_mix {
width: 100% !important;
}
.built-kit-cal .fourth-option-container .calculate-area label {
width: 100%;
}
.built-kit-cal .fourth-option-container input.fourth-option-container-input {
width: 94% !important;
}
.built-kit-cal .fourth-option-container .calculate-area label:nth-child(4) {
margin-bottom: 0;
}
.popup-cal .second-option-container .calculate-area label {
width: 100%;
}
.popup-cal .second-option-container input.second-option-container-input {
margin-top: 2%;
width: 92% !important;
}
.popup-cal .fifth-option-container p {
font-size: 13px;
}
#newsletter_form.readytheme-contentsection #mc_embed_signup_scroll .c-control-group .c-control-group__field {
float: left;
width: 100%;
}
.dc-newsletter-form #newsletter_form.readytheme-contentsection .c-control-group .c-control-group__button {
top: 0;
}
}
@media only screen and ( min-device-width: 768px ) and ( max-device-width: 1024px ) {
.popup-cal {
top: 27.5% !important;
}
.caltypes ul li {
font-size: 13px;
}
#calculator_content .calculate-area input {
font-size: 13px;
}
#calculator_content .options.calculator-area .option h3 {
font-size: 16px;
}
.first-option-container-input {
font-size: 12px;
}
.result-right-side {
margin-top: 0;
}
.result-right-inner h3 {
font-size: 16px;
}
#calculator_content .result-right-inner p {
font-size: 16px;
}
.main-result-area label {
font-size: 13px;
}
.columns-calculator label {
font-size: 13px;
}
#calculator_content .disclaimer p {
font-size: 15px;
}
.right-note .u-font-small {
font-size: 13px !important;
}
#calculator_content .calculatorswatches.slick-initialized.slick-slider {
width: 260px;
}
.instafeed div.inner-insta-image {
max-height: 170px;
}
.instafeed div.inner-insta-image img {
height: 181px;
}
}
@media only screen and ( min-device-width: 667px ) and ( max-device-width: 736px ) and ( orientation: landscape ) {
.t-storefront-build-kit .storefront-story {
max-width: 25.125em;
}
}
.design-idea-menu {
background: #FFFFFF;
border: 1px solid #E5E5E5;
box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.1), 0px 2px 4px rgba(0, 0, 0, 0.4);
display: none;
left: 0;
max-width: 88rem;
position: static;
width: 100%;
z-index: 99;
}
.design-heading.c-heading-delta {
border-bottom: 2px solid #DDDDDD;
color: #404146;
display: none;
font-size: 20px;
font-weight: 500;
margin: 20px 34px;
text-align: left;
}
.product-whats-include h2 {
font-weight: 500;
margin-bottom: 1%;
margin-top: 3%;
}
.product-whats-include ul {
margin-left: 0;
}
.product-whats-include li {
font-size: 14px;
font-weight: 400;
list-style: disc;
margin-left: 5%;
}
@media( min-width: 60em ) {
.design-idea-menu {
left: 0;
}
.design-idea-menu {
position: absolute;
top: 100%;
}
.design-heading.c-heading-delta {
display: block;
}
.mega-menu-navigation .design-heading.c-heading-delta {
flex-basis: 100%;
margin: 20px 20px 0;
max-width: 100%;
padding-left: 0;
}
}
@media( min-width: 70em ) {
/* .design-idea-menu{left:32px;} */
}
.design-heading.c-heading-delta span {
border-bottom: 4px solid #ED1E24;
display: inline-block;
margin-bottom: -3px;
padding-bottom: 10px;
}
.design-footer {
background: #F2F7FD;
font-size: 15px;
font-weight: 500;
margin-top: 30px;
padding: 20px;
text-align: center;
width: 100%;
}
.design-idea-menu figcaption {
color: #404146;
font-weight: 500;
padding-top: 14px;
}
.design-image-box {
border-right: 1px solid #DDDDDD;
padding: 13px 0 0;
}
#resources_mega_menu .design-image-box {
border-bottom: 0;
margin-bottom: 10px;
}
.design-footer a {
color: #194A8F;
display: inline-block;
text-decoration: underline;
}
.design-footer a.c-button {
color: #FFFFFF;
font-size: 12px;
text-decoration: none;
}
.ds-bdr {
border-right: 1px solid #D3DFED;
padding: 13px 20px;
}
.x-transfigure-navigation__row> .c-navigation__list.navid-5,
.x-transfigure-navigation__row> .c-navigation__list.navid-11,
.x-transfigure-navigation__row> .c-navigation__list.navid-10 {
position: static;
}
.shop-by-project {
display: none;
}
.shop-by-project.design-idea-menu .c-heading-delta {
border-bottom: 1px solid #DDDDDD;
margin-bottom: 0;
}
.shop-by-project.design-idea-menu .design-image-box {
border-bottom: 1px solid #DDDDDD;
height: 100%;
}
.shop-by-project.design-idea-menu figcaption {
padding-bottom: 14px;
}
.shop-by-project-box {
margin-left: 16px;
}
div.autocomplete-items div {
border: 1px solid #CCCCCC;
font-weight: normal !important;
padding: 1%;
}
div.autocomplete-items div strong {
font-weight: normal !important;
}
.quickview-product-detail .c-form-list__item.u-grids-1.u-grids-2--m.x-product-layout-purchase__options {
border-bottom: 0 !important;
max-width: 100%;
padding: 0 !important;
}
.quickview-product-detail #js-purchase-product {
margin-top: 0;
}
.quickview-product-detail .addtocart-container-q {
margin-top: 8px;
}
@media( min-width: 60em ) {
.shop-by-project-box .o-layout .o-layout__item:nth-child(4) .design-image-box {
border-right: 0;
}
.shop-by-project-box .o-layout .o-layout__item:nth-child(8) .design-image-box {
border-right: 0;
}
.shop-by-project-box .o-layout .o-layout__item:nth-child(+n+5) .design-image-box {
border-bottom: 0;
}
}
.view-all {
padding-top: 10px;
}
.all-in-one {
margin: 0;
padding-right: 0px;
padding-top: 40px;
text-align: center;
}
.all-in-one figcaption p {
line-height: normal;
margin-bottom: 5px;
}
.all-in-one figcaption .kit-price {
font-size: 22px;
font-weight: 600;
}
.x-transfigure-navigation .c-navigation__link-carat {
font-size: 0.75em;
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
}
@media( max-width: 768px ) {
.x-product-layout-purchase .x-product-layout-purchase__options,
.x-product-layout-purchase .x-product-layout-purchase__kits {
max-width: 100%;
}
.product-trial-kit .coverage-calc {
border: 0;
margin: 0;
padding: 0;
}
.x-product-layout-purchase .product-trial-kit {
padding-top: 0;
}
.x-product-layout-purchase .product-trial-kit> div {
max-width: 35%;
}
.x-product-layout-purchase .x-product-layout-purchase__options {
border: 0;
padding-right: 0;
}
.design-idea-menu figcaption {
padding-bottom: 14px;
}
.design-image-box {
padding-top: 0;
}
.ds-bdr {
border-bottom: 1px solid #D3DFED;
border-right: 0;
margin-bottom: 10px;
}
.design-footer {
margin-top: 0;
}
.shop-by-project-box {
margin-left: 0;
}
.shop-by-project-box .o-layout--flush {
padding-left: 0;
}
.all-in-one {
display: none;
}
.design-idea-menu {
box-shadow: none;
}
}
.colorant-menu-navigation,
.support-links {
background: #FFFFFF;
left: auto;
position: static;
width: 100%;
z-index: 99;
}
.colorant-menu-navigation .o-layout__item.level-1 a {
display: block;
position: relative;
text-align: left;
}
.colorant-menu-navigation .level-1 .main-cat-name {
border-bottom: 1px solid #EFEFEF;
color: #333131;
display: block;
font-size: 14px;
margin: 0 0 15px;
padding-bottom: 4px;
text-transform: uppercase;
}
.colorant-menu-navigation .design-heading.c-heading-delta {
flex-basis: 100%;
margin: 20px 20px 0;
max-width: 100%;
padding-left: 0;
}
li.c-navigation__list.navid-79,
li.c-navigation__list.navid-2 {
position: static;
}
.colorant-menu-navigation .level-1 ul li a {
color: #333131;
font-size: 14px;
font-weight: normal;
line-height: 19px;
margin-bottom: 6px;
}
@media( min-width: 60em ) {
.colorant-menu-navigation,
.support-links {
background: #FFFFFF;
border: 1px solid #E5E5E5;
box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.1), 0px 2px 4px rgba(0, 0, 0, 0.4);
display: flex;
display: none;
height: auto;
left: auto;
max-height: 626px;
max-width: 88rem;
overflow-y: auto;
position: absolute;
right: 0;
top: 100%;
width: 100%;
z-index: 99;
}
.colorant-menu-navigation .level-1 {
float: left;
max-width: 24.94%;
width: 24.94%;
}
.colorant-menu-navigation .level-1 {
padding: 10px 20px 15px;
}
.colorant-menu-navigation .level-1 .main-cat-name {
margin: 16px 0 8px;
}
}
@media( min-width: 70em ) {
.colorant-menu-navigation,
.support-links {
/* left:32px; */
}
}
@media( max-width: 767px ) {
.color-swatch ul {
text-align: left;
width: 100%;
}
}
@media( max-width: 640px ) {
.x-product-layout-purchase__options-quantity {
padding-bottom: 18px;
padding-top: 15px;
}
.x-product-layout-purchase__options-attribute {
margin-bottom: calc(20px / 2);
}
.x-product-layout-purchase__cta,
.x-product-layout-purchase .choose-color-sync.single-active .select-size:nth-child(7) {
margin-top: 0;
padding-top: 0;
}
.x-product-layout-purchase .choose-color-sync.single-active .select-size:nth-last-of-type(1) {
padding-bottom: 0;
}
.instafeed div.inner-insta-image img {
height: 200px;
}
.instafeed div.inner-insta-image:last-child {
display: none;
}
.product-trial-kit .coverage-calc span {
clear: both;
display: inline-block;
vertical-align: bottom;
}
.x-product-layout-purchase .product-trial-kit> div {
display: block;
margin: 0;
max-width: 100%;
padding: 0;
}
.contact-need-help .help-link {
margin-bottom: 10px;
width: 100%;
}
div#cfeedfly {
bottom: 20px;
}
.card-icons img {
margin-bottom: 10px;
width: 334px;
}
.shopperlink img {
padding-left: 15px;
}
.footer-image {
padding-top: 20px;
}
.swatch-popup .o-list-inline__item span.dc_swatch_name {
font-size: 13px;
}
}
@media only screen and ( max-width: 768px ) {
#custfeedpopup {
left: 0%;
padding: 5%;
width: 100%;
}
.company-promises {
margin-bottom: 0;
}
.company-promises h3 {
font-size: 1em;
font-weight: 500;
margin-bottom: 5px;
padding: 0 45px;
}
.company-promises figure {
margin: 10px 0 10px 0px;
}
.page-template-design_podcasts ul#project_category.o-layout {
box-shadow: none;
margin: 0;
width: 100%;
}
.page-template-design_podcasts h3.fliter-project {
margin: 0;
}
.page-template-design_podcasts div#project_gallery {
padding-left: 0;
}
.page-template-design_podcasts ul.project_category li {
margin-left: 0;
}
footer .o-layout--column {
flex-direction: inherit;
}
.footer-image .o-layout--column {
flex-direction: inherit;
}
section.o-layout.u-text-center.t-site-footer__disclaimer {
flex-direction: inherit;
}
.message-box-register {
margin-left: 0;
padding: 0;
}
}
/* for iPad */
@media only screen and ( min-device-width: 481px ) and ( max-device-width: 1024px ) and ( orientation: portrait ) {
.guest-checkout:before {
left: -8px;
}
}
@media only screen and ( min-device-width: 481px ) and ( max-device-width: 1024px ) and ( orientation: landscape ) {
/* For landscape layouts only */
.guest-checkout:before {
left: -49px;
}
}
.left-content-description {
float: left;
margin-right: 1%;
}
label.tablinks.mobile-view {
display: none;
}
.metallic-epoxy-countertop-tab .tab {
/* overflow: hidden;
border: 1px solid #ccc;
background-color: #f1f1f1; */
margin-bottom: 20px;
}
.metallic-epoxy-countertop-tab .tab button {
background-color: inherit;
border: none;
cursor: pointer;
float: left;
font-size: 17px;
outline: none;
padding: 14px 16px;
transition: 0.3s;
}
.metallic-epoxy-countertop-tab .tab button:hover {
background-color: #DDD;
}
.metallic-epoxy-countertop-tab .tab button.active {
background-color: #CCC;
}
.metallic-epoxy-countertop-tab .tab button {
text-transform: uppercase;
}
.metallic-epoxy-countertop-tab .tabcontent {
border: 1px solid #CCC;
display: none;
padding: 6px 12px;
padding-top: 20px;
}
.metallic-epoxy-countertop-tab {
margin-bottom: 40px;
}
label.tablinks.mobile-view.x-flex-tabs__tab.u-text-uppercase:after {
float: right;
}
.tab-buttons {
clear: both;
display: table;
margin: 0px auto;
width: auto;
}
.storefront_instagram-inner {
background-repeat: repeat;
background-size: 100% 100%;
padding-bottom: 34px;
padding-top: 20px;
position: relative;
}
.storefront_instagram-inner:after {
content: "";
height: 100%;
left: 0;
opacity: 0.2;
position: absolute;
right: 0;
top: 0;
width: 100%;
z-index: -1;
}
#js-BSKE .c-button--hollow {
margin-top: 10px;
}
.textwidget.custom-html-widget i.fas.fa-file-pdf {
left: -3px;
position: absolute;
top: 2px;
}
.textwidget.custom-html-widget span.todolist-content {
padding-left: 0px;
}
.textwidget.custom-html-widget li {
padding-left: 15px;
position: relative;
}
div#html_element_fd {
margin: 15px;
}
#product_just_stars .on {
background-image: url(../images/star-full.svg) !important;
background-size: 100%;
display: inline-block;
}
.bg-blue-dark {
background-color: #1C55A6 !important;
}
.prod-item-detail .color-swatch .buildkitswatch ul {
max-height: 81px;
width: 51%;
}
.product-details .color-swatch .x-product-layout-purchase__swatches.buildkitswatch ul li {
height: 43px;
margin-bottom: 15px;
width: 46px;
}
.product-details .color-swatch .x-product-layout-purchase__swatches.buildkitswatch ul li img {
float: left;
height: 43px;
width: 46px;
}
.build-kit-page .o-list-inline__item span.dc_swatch_name {
display: block;
float: left;
font-size: 9px;
line-height: 9px;
margin-bottom: 15px;
text-align: center;
width: 100%;
}
.build-kit-page .swatch-popup .o-list-inline__item span.dc_swatch_name {
font-size: 14px;
line-height: 18px;
margin-bottom: 15px;
}
.x-product-layout-purchase__swatches.buildkitswatch {
max-height: 82px;
overflow: hidden;
}
.swatch-popup .x-product-layout-purchase__swatches.buildkitswatch {
max-height: none;
overflow: hidden;
}
.t-site-header__links {
position: relative;
}
#intercom-container {
display: none;
}
.o-layout__item .u-over-everything.t-global-account.is-open {
display: block;
}
.u-over-everything.t-global-account {
display: none;
}
div#storefront_more_from_dc {
padding-bottom: calc(2.3375em * 1 + 1px);
padding-top: calc(3.9375em * 1 + 1px);
}
div#top_header_promo {
float: left;
text-align: right;
width: 71.3%;
}
span#header_message_2 {
float: left;
}
#top_header_promo p {
font-size: 15px;
margin-bottom: 0;
padding: 2px;
}
span.red-text {
color: #FF0022;
font-weight: 600;
}
.t-site-header__top-navigation {
padding: 8px 0;
}
#js-PROD .x-product-layout-purchase__options .swatch-main-container {
position: relative;
}
#js-PROD .show-all-swatches {
position: absolute;
right: 0px;
text-align: right;
top: 0;
width: 90px;
}
#js-PROD button.c-button.c-control-group__button.u-bg-white.u-color-gray-40.u-icon-add {
font-size: 10px;
max-width: 40px;
padding: 0;
text-align: center;
}
#js-PROD button.c-button.c-control-group__button.u-bg-white.u-color-gray-40.u-icon-subtract {
font-size: 10px;
max-width: 40px;
padding: 0;
text-align: center;
}
#js-PROD .u-icon-add:before {
color: #707070;
margin-right: -10px;
}
#js-PROD .u-icon-subtract:before {
margin-right: -12px;
}
#js-PROD input#qtyy {
font-size: 14px;
height: 40px;
max-width: 50px;
}
#js-PROD .get-trial {
padding-bottom: 0;
padding-left: 0;
}
#js-PROD .freekit-icon {
background-size: 15px;
height: 30px;
width: 30px;
}
#js-PROD .get-trial a.biz-quick-popup {
font-size: 17px;
line-height: 30px;
text-decoration: none;
}
#js-PROD a.biz-quick-popup:hover {
text-decoration: none;
}
#js-PROD a.biz-quick-popup span.u-font-medium {
font-size: 14px;
font-weight: 500;
}
#js-PROD .get-trial .u-inline-block.u-text-left--m.u-text-left--l .u-font-medium {
text-decoration: underline;
}
#js-PROD .get-trial .u-inline-block.u-text-left--m.u-text-left--l .u-font-medium:hover {
text-decoration: underline;
}
#js-PROD .get-trial:hover .freekit-icon {
background-color: #194A8F;
}
#js-PROD .get-trial:hover .biz-quick-popup {}
#js-PROD .x-product-layout-purchase__options-attribute .c-form-label {
margin-bottom: 0;
}
#js-PROD .o-layout__item.u-width-6.u-width-4--m.x-product-layout-purchase__options-quantity p.c-form-label.u-text-bold.u-font-medium.u-color-gray-50.is-required {
margin-bottom: 0;
}
#js-PROD section.x-product-layout {
padding: 0;
}
#js-PROD .t-breadcrumbs {
margin-bottom: 5px;
}
#js-PROD .x-product-layout .c-form-list .product-description {
padding: 5px 0px 0px;
}
/* Quick View Popup */
.quickview-product-detail .freekit-icon,
.calc-icon {
background-size: 15px;
height: 30px;
width: 30px;
}
.quickview-product-detail .o-layout__item.get-trial span.u-font-medium {
font-size: 12px;
font-weight: 500;
}
.quickview-product-detail .swatch-main-container {
padding-right: 0;
}
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-column.color-swatch {
padding-right: 5px !important;
}
.quickview-product-detail .x-product-layout-purchase__pricing-current {
font-size: 1.5rem !important;
}
.quickview-product-detail .item-code {
font-size: 12px !important;
margin-bottom: 3px;
}
.quickview-product-detail .get-trial {
margin-bottom: 3px;
padding: 0;
}
.quickview-product-detail .get-trial a.biz-quick-popup {
line-height: 27px;
}
.for-quickview {
max-width: 860px !important;
}
.quickview-product-detail .show-all-swatches {
position: absolute;
right: 0px;
text-align: right;
top: 0;
width: 90px;
}
.quickview-product-detail .c-form-list__item.c-form-list__item--full.product-description h2 {
font-size: 14px;
}
.quickview-product-detail div#product_just_stars {
margin-bottom: -3px;
}
.quickview-product-detail .x-product-layout-purchase__options-attribute .c-form-label {
margin-bottom: 0;
}
.quickview-product-detail .quantity-wrap .prd-qty {
padding-bottom: 2px;
}
.quickview-product-detail .get-trial .u-inline-block.u-text-left--m.u-text-left--l:hover {}
.quickview-product-detail a.biz-quick-popup {
text-decoration: none;
}
.quickview-product-detail p {
margin-bottom: 0px !important;
}
.quickview-product-detail .c-form-list__item.c-form-list__item--full.product-description {
margin-bottom: 0 !important;
}
.quick-view-container .product-image-loader.price-loader-quick {
position: absolute;
top: 72px;
}
.quick-view-container h2.bottom-margin {
margin-top: 0;
}
.hastrialp.quickview-product-detail .addtocart-container-q {
margin-left: 0;
margin-top: 8px;
padding-left: 0;
width: 75%;
}
.quickview-product-detail span.swatch_label {
font-size: 12px;
}
.quickview-product-detail .select-column.color-swatch:after,
.get-trial:after {
border-right: 0 !important;
}
.quick-view-container .color-swatch ul::-webkit-scrollbar {
-webkit-appearance: none;
}
.quick-view-container .color-swatch ul::-webkit-scrollbar {
-webkit-appearance: none;
}
::-webkit-scrollbar:vertical {
width: 10px;
}
.quick-view-container .color-swatch ul::-webkit-scrollbar {
-webkit-appearance: none;
}
::-webkit-scrollbar:horizontal {
height: 20px;
}
.quick-view-container .color-swatch ul::-webkit-scrollbar {
-webkit-appearance: none;
}
::-webkit-scrollbar-thumb {
background-color: rgba(0, 0, 0, 0.5);
border: 2px solid #FFFFFF;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
}
.quick-view-container .color-swatch ul::-webkit-scrollbar {
-webkit-appearance: none;
}
::-webkit-scrollbar-track {
background-color: #FFFFFF;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
}
.quick-view-container .o-list-inline__item:not(:last-child) {
margin-right: 8px !important;
}
.quickview-product-detail .get-trial .u-inline-block.u-text-left--m.u-text-left--l .u-font-medium {
text-decoration: underline;
}
.quickview-product-detail .get-trial:hover .biz-quick-popup .u-font-medium {}
.quickview-product-detail .get-trial:hover .freekit-icon {
background-color: #194A8F;
}
.quickview-product-detail .coverage-calc a {
font-size: 14px;
}
a.for-quickviewpopup {
display: none;
}
.quickview-product-detail .for-quickviewpopup {
display: block;
}
.quickview-product-detail .for-normalwindow {
display: none;
}
.trialproduct .choose-color-sync.o-layout.add-class-swatch.single-active {
margin-top: 3px;
position: relative;
}
#js-PROD .trialproduct .show-all-swatches {
left: 37%;
top: 4px;
}
#js-PROD .quickview-product-detail .product-image-loader.price-loader-quick img {
width: 9% !important;
}
#js-PROD .quickview-product-detail .product-image-loader.price-loader-quick {
top: 12% !important;
}
.ui-dialog.ui-corner-all.ui-widget.ui-widget-content.ui-front.ui-draggable.ui-resizable.for-quickview {
max-width: 860px !important;
}
.customer-also-bought h4.c-heading-charlie {
font-size: 20px;
}
.quickview-product-detail .o-layout__item.u-width-12.u-width-6--m.u-width-6--xl.select-size:nth-last-of-type(1) {
padding-right: 5px;
}
.fbx-social .fbx-buffer {
display: none;
}
.fbx-social .fbx-digg {
display: none;
}
.fbx-social .fbx-tumblr {
display: none;
}
.fbx-social .fbx-reddit {
display: none;
}
.trialproduct .swatch-sections {
float: left;
max-height: 78px;
overflow-y: auto;
padding-top: 3px;
width: 60%;
}
.trialproduct .kit_swatch {
margin-bottom: 2.5%;
}
.trialproduct .x-product-layout-purchase .is-required {
padding-bottom: 0;
}
.trialproduct .limitmessage {
border-left: 1px solid rgba(204, 204, 204, 0.5);
float: right;
margin-top: -27px;
padding-left: 15px;
width: 38% !important;
}
.limitmessage .limit {
color: #404146 !important;
font-size: 13px;
font-weight: normal !important;
text-transform: capitalize !important;
}
#js-PROD .show-all-swatches {
top: 1px;
}
.trialproduct .trial_message {
line-height: 17px;
min-height: 102px;
padding-top: 8px;
}
.sealer_limitmessage .trial_message {
min-height: auto;
}
.trialproduct .x-product-layout-purchase .x-product-layout-purchase__options {
margin-bottom: 2px;
padding-bottom: 1px;
position: relative;
}
.trialproduct.prod-26296-id .show-all-swatches {
top: 2px;
}
.trialproduct.prod-26296-id .x-product-layout-purchase .x-product-layout-purchase__options {
padding-bottom: 2px;
}
.build-kit-content {
background-color: rgba(255, 255, 255, 0.5);
border-bottom-right-radius: 20%;
border-top-left-radius: 20%;
margin-bottom: 1em;
padding: 3em 2em 2.5em;
}
.recent-blogs-section1 .entry-details .td-module-title {
min-height: 38px;
}
.t-page-built-kit-template .prod-item-detail {
position: relative;
}
.t-page-built-kit-template .show-all-swatches {
left: 90px;
top: 32px !important;
}
.t-page-built-kit-template .prod-item-detail .color-swatch .buildkitswatch ul {
width: 60%;
}
div#captcha {
margin-top: 1%;
padding-left: 0;
position: relative;
}
div#captcha span {
color: green;
font-size: 16px !important;
font-weight: 500;
left: -5px;
position: absolute;
top: 5px;
width: 302px;
}
.x-product-layout .c-form-list .product-description {
border-bottom: 0;
}
li.c-form-list__item.c-form-list__item--full.product-readmore {
border-bottom: 1px solid #E3E3E3;
margin-bottom: 0;
}
.product-readmore p {
margin-bottom: 2px;
margin-top: 0;
}
#product_disclaimer p {
color: #1F1F22;
font-size: 14px;
margin-bottom: 0;
}
.prod-18677-id.trialproduct li.c-form-list__item.c-form-list__item--full.product-whats-include {
border-bottom: 0;
}
.prod-18677-id.trialproduct .x-product-layout-purchase .x-product-layout-purchase__options {
border-bottom: 0;
}
p.product-disclaimer {
color: #1F1F22;
font-size: 13px;
margin-bottom: 0;
padding-top: 1%;
}
section.o-layout.x-product-description p {
font-size: 15px;
margin-bottom: 8px;
}
section.o-layout.x-product-description p em {
font-size: 13px;
font-style: normal;
}
.x-product-description .x-flex-tabs__content h3 {
/* margin: 7px 0 0px; */
}
.x-product-description .x-flex-tabs__content ul {
margin-bottom: 5px;
padding-left: 10px;
}
.storefront-hero-image {
max-width: 100%;
padding: 0;
}
@media( min-width: 991px ) {
#storefront_topsection .owl-carousel .owl-item img {
height: 580px;
left: 0;
object-fit: cover;
top: 0;
width: 100%;
width: 100%;
}
div#storefront_topsection {
margin-bottom: 44px;
}
.single-row-image figure.wpb_wrapper.vc_figure {
float: left;
margin-top: 19px;
width: 20%;
}
.single-row-image div.wpb_wrapper {
float: left;
padding-left: 20px;
width: 77%;
}
}
@media( min-width: 768px ) and ( max-width: 990px ) {
.o-layout.t-storefront-build-kit {
min-height: 30vh;
}
}
@media( min-width: 991px ) and ( max-width: 1024px ) {
.o-layout.t-storefront-build-kit {
min-height: 53vh;
}
}
#js-SFNT .t-site-navigation {
margin-bottom: 0;
}
.storefront-hero-image-slide {
position: relative;
}
.storefront-hero-image-slider .slick-list img {
padding: 0;
}
.storefront-hero-image-slider:not(.slick-initialized) .storefront-hero-image-slide:not(:first-child) {
display: none;
}
.storefront-hero-image .slick-slider .slick-prev,
.storefront-hero-image .slick-slider .slick-next {
border: 0;
font-size: 0;
opacity: 1;
z-index: 1000;
}
.storefront-hero-image .slick-slider .slick-prev:before,
.storefront-hero-image .slick-slider .slick-next:before {
display: none;
}
.storefront-hero-image .slick-slider .slick-prev {
background-color: #1C55A6;
height: 47px;
margin-top: 18px;
width: 50px;
}
.storefront-hero-image .slick-slider .slick-prev:after {
background: transparent;
border-bottom: 4px solid;
border-color: #FFFFFF;
border-left: 4px solid;
color: #FFFFFF;
content: "";
height: 20px;
margin-top: -10px;
outline: 0;
position: absolute;
right: 10px;
transform: rotate(45deg);
width: 20px;
}
.storefront-hero-image .slick-slider .slick-next {
background-color: #1C55A6;
height: 47px;
margin-top: 18px;
width: 50px;
}
.storefront-hero-image .slick-slider .slick-next:after {
background: transparent;
border-bottom: 4px solid;
border-color: #FFFFFF;
border-left: 4px solid;
color: #FFFFFF;
content: "";
height: 20px;
margin-top: -10px;
outline: 0;
position: absolute;
right: 20px;
transform: rotate(-137deg);
width: 20px;
}
.storefront-hero-image .slick-slider .slick-prev {
left: 20px;
outline: 0;
position: absolute;
top: 47%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
transform: translateY(-50%);
}
.storefront-hero-image .slick-slider .slick-next {
position: absolute;
right: 20px;
top: 47%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
transform: translateY(-50%);
}
.storefront-hero-image .caption h2 {
font-size: 30px;
font-weight: 300;
line-height: 30px;
margin-bottom: 0;
padding: 0.6% 0;
text-align: center;
}
.storefront-hero-image .caption {
background-color: rgb(128, 128, 128, 0.8);
color: #FFF;
left: 0;
margin: 0 auto;
max-width: 100%;
position: absolute;
right: 0;
top: 0;
top: 0;
width: 100%;
}
.o-layout.t-storefront-build-kit {
margin-top: 1.3em;
}
span.resource-search:hover {
background-color: #EAEAEA;
text-decoration: none !important;
}
span.resource-search {
float: left;
margin-top: 5px;
padding: 5px 10px;
width: 100%;
}
.resource-search {
display: none;
}
@media only screen and ( max-width: 840px ) {
div#captcha span {
left: 0px;
top: 5px;
}
div#top_header_promo {
line-height: 18px;
margin-bottom: 1%;
text-align: center;
width: 100%;
}
span#header_message_2 {
float: left;
width: 100%;
}
.t-site-header__top-navigation .o-wrapper {
padding-right: 0;
}
#js-PROD .trialproduct .show-all-swatches {
left: 27%;
top: 1%;
}
.choose-color-sync.o-layout.add-class-swatch.choose-sealers ul li {
width: 48%;
}
.choose-color-sync.o-layout.add-class-swatch.choose-sealers .sealer_limitmessage {
left: 58%;
position: absolute;
top: -2px;
width: auto;
}
.storefront-hero-image .caption h2 {
font-size: 16px;
line-height: 16px;
margin: 0 auto;
text-align: center;
width: auto;
}
.storefront-hero-image .caption {
max-width: 450px;
}
.storefront-hero-image .slick-slider .slick-prev {
height: 20px;
width: 20px;
}
.storefront-hero-image .slick-slider .slick-next {
height: 20px;
width: 20px;
}
.storefront-hero-image .owl-prev {
top: 52%;
}
.storefront-hero-image .owl-next {
top: 52%;
}
.storefront-hero-image .owl-carousel .owl-item img {
height: 170px;
object-fit: cover;
}
.storefront-hero-image .slick-slider .slick-prev:after {
border-bottom: 2px solid;
border-left: 2px solid;
color: #FFF;
height: 7px;
margin-top: -4px;
right: 5px;
width: 7px;
}
.storefront-hero-image .slick-slider .slick-next:after {
border-bottom: 2px solid;
border-left: 2px solid;
color: #FFF;
height: 7px;
margin-top: -4px;
right: 8px;
width: 7px;
}
#storefront_project {
margin-top: 7%;
}
}
@media screen and ( min-width: 1300px ) {
.o-layout.t-storefront-build-kit {
height: 75vh;
padding: 0;
}
.build-kit-content .c-heading-alpha {
font-size: 1.7em;
}
.build-kit-content {
margin-top: 0;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
}
.build-kit-content .c-heading-bravo .c-button--huge {
font-size: 22px;
}
}
@media screen and ( min-width: 1600px ) {
.build-kit-content .c-heading-alpha {
font-size: 2em;
}
.build-kit-content .c-heading-bravo .c-button--huge {
font-size: 22px;
}
}
.build-kit-content {
margin-right: 50px;
}
@media screen and ( min-width: 1900px ) {
.build-kit-content .c-heading-alpha {
font-size: 2.2em;
line-height: 45px;
}
.build-kit-content .c-heading-bravo .c-button--huge {
font-size: 22px;
}
}
@media( max-width: 767px ) {
#js-PROD .srch-image-container {
line-height: 300px;
max-height: 261px;
min-height: 261px;
}
.o-layout.t-storefront-build-kit {
background-size: 100%;
}
.build-kit-content {
margin-right: 0;
margin-top: 12em;
padding: 0;
}
}
@media( max-width: 360px ) {
.popup-cal input.third-option-container-input {
width: 77% !important;
}
.popup-cal .caltypes .list .c-form-list__item input[ type="button" ] {
width: 48%;
}
#slabs ul.c-form-list li.c-form-list__item:nth-child(4),
#slabs ul.c-form-list li.c-form-list__item:nth-child(6),
#footings ul.c-form-list li.c-form-list__item:nth-child(4),
#footings ul.c-form-list li.c-form-list__item:nth-child(6),
#columns ul.c-form-list li.c-form-list__item:nth-child(3),
#columns ul.c-form-list li.c-form-list__item:nth-child(5) {
padding-right: 0px;
}
.popup-cal #calculator_content .fourth-option-container input.fourth-option-container-input {
width: 93% !important;
}
select.fifth-option-container-select {
width: 50%;
}
.t-checkout-basket-summary {
padding: 2rem 1rem;
}
}
#navsite li.current a {
background: #4888C8;
font-weight: 500;
}
body#js-OSEL .apple-pay-button-with-text.apple-pay-button-black-with-text,
body#js-OCST .apple-pay-button-with-text.apple-pay-button-black-with-text {
display: none !important;
}
#js-SRCH .c-form-checkbox__input:checked+ .c-form-checkbox__caption:after {
top: 2px;
}
.footer-image .o-layout__item.u-width-12.u-width-12--m.o-layout--align-self-center.card-icons {
max-width: 60%;
}
.inner-ul li {
list-style: circle;
}
.t-global-account__form .logn-welcome-msg p {
color: #404146;
}
.t-global-account__form .logn-welcome-msg p a {
color: #404146;
text-decoration: underline;
}
#login_message .logn-welcome-msg a#miniModal_1 {
float: none;
}
#mc4wp-form-1 input#mc_fname {
font-size: 14px;
padding: 2%;
}
#mc4wp-form-1 input#mc_email {
font-size: 14px;
padding: 2%;
}
form.mc4wp-form.mc4wp-form-82277 {
background: #D3D3D3;
background: url(../../../../graphics/00000001/spotlght-bg.jpg) no-repeat;
background-position: 53% 40%;
background-size: contain;
border: 1px solid #D3D3D3;
border-radius: 3%;
box-shadow: 0px 0px 5px 0px #333;
float: left;
margin-top: 1%;
padding: 4% 4% 0.5% 4%;
padding-top: 3%;
width: 100%;
}
#mc4wp-form-1 .mc4wp-form-fields {
margin: 0 auto;
/* float: none; */
width: 70%;
}
#mc4wp-form-1 .mc4wp-form-fields p {
float: left;
margin-right: 2%;
width: 100%;
}
#mc4wp-form-1 .mc4wp-form-fields p input {
width: 100%;
}
#mc4wp-form-1 .mc4wp-response {
float: none;
font-size: 14px;
font-weight: 500;
line-height: 16px;
margin: 0 auto;
text-align: center;
width: 70%;
}
#mc4wp-form-1 .mc4wp-alert.mc4wp-success {
color: green;
}
#mc4wp-form-1 .mc4wp-alert.mc4wp-error {
color: #FF0000;
}
.card-pay-img {
float: right;
margin-right: 0 !important;
padding-top: 1.5%;
width: 60% !important;
/* margin-left: 1%; */
}
a#bbblink img {
border: 0;
left: 0;
margin-left: 0;
max-width: 200% !important;
position: absolute;
top: 0;
}
#custfeedpopup input {
font-size: 14px;
font-weight: normal;
padding: 2%;
width: 100%;
}
.bask-coupon-name {
line-height: 40px;
}
.bask-coupon-form {
margin-bottom: 0;
}
.bask-coupon-form li {
margin-bottom: 0;
}
.bask-coupon-form button.c-button.c-button--clear.u-bg-transparent.u-color-red {
border: 1px solid;
}
.t-basket_coupon-form li.c-form-list__item.c-form-list__item--full.c-control-group.u-flex {
margin-top: 3%;
}
.shopperlink {
float: none;
max-width: 120px !important;
padding-right: 0 !important;
padding-top: 1%;
}
.choose-color-sync.o-layout.add-class-swatch.choose-sealers ul li {
min-height: 50px;
}
#post-76640 .wpb_column.vc_column_container.vc_col-sm-10 {
width: 70%;
}
#post-76640 .wpb_column.vc_column_container.vc_col-sm-2 {
width: 30%;
}
.payment-image img {
border: 1px solid #F2F2F2;
padding: 0.5%;
width: 10%;
}
span.payment-image.c-form-checkbox__caption:after .payment-inner-img {
border: 1px solid #194A8F;
}
.top-header-mid-promo2 {
font-weight: 500;
width: 95%;
}
.holiday-message p {
font-size: 13px;
margin: 0;
}
.holiday-message p b {
text-transform: uppercase;
}
.holiday-message {
background-color: #FFD6D7;
border: 1px solid #FFD6D7;
border-radius: 4px;
margin-bottom: 3%;
padding: 1%;
width: 100%;
}
article p a {
color: #194A8F !important;
text-decoration: underline !important;
}
.vc_row {
width: 100%;
}
.bg-audio_icon {
background: url("../../../../graphics/00000001/resources_sprites.png") 7px 4px;
background-color: #ED1E24;
background-size: 220%;
height: 60px;
width: 60px;
}
.bg-calc_icon {
background: url("../../../../graphics/00000001/resources_sprites.png") -54px -60px;
background-color: #ED1E24;
height: 60px;
width: 60px;
}
.bg-video_icon {
background: url("../../../../graphics/00000001/resources_sprites.png") -38px 7px;
background-color: #ED1E24;
background-size: 210%;
height: 60px;
width: 60px;
}
.bg-pdf_icon {
background: url("../../../../graphics/00000001/resources_sprites.png") 8px -45px;
background-color: #ED1E24;
background-size: 225%;
height: 60px;
width: 60px;
}
.bg-toolkit_icon {
background: url("../../../../graphics/00000001/resources_sprites.png") -125px 4px;
background-color: #ED1E24;
background-size: 300%;
height: 60px;
width: 60px;
}
#js-PROD .x-product-description .vc_toggle.vc_toggle_default.vc_toggle_color_default.vc_toggle_size_md {
float: left;
width: 100%;
}
#js-PROD .print-page {
top: 0;
}
@media ( max-width: 767px ) {
.footer-image .o-layout__item.u-width-12.u-width-12--m.o-layout--align-self-center.card-icons {
max-width: 90%;
}
#bbblink {
margin-left: 9% !important;
}
.card-pay-img {
float: right;
padding-top: 5%;
width: 95% !important;
}
.shopperlink {
padding-top: 2%;
}
#dc_blog .post-item-inner .entry-image {
width: auto;
}
.home .wpb_column.vc_column_container.vc_col-sm-3 {
width: 100%;
}
.home #diy-leftbar .vc_column-inner {
padding-left: 0;
}
.vc_row {
margin-left: 0;
width: 100%;
}
.home #diy-leftbar div#project_category {
max-width: 100%;
}
.home #diy-leftbar ul.li-container {
margin-left: 0;
padding-right: 0;
}
.vc_gitem-zone {
float: left;
}
.vc_column_container> .vc_column-inner {
padding: 0;
}
.top-header-mid-promo2 {
font-weight: 500;
padding: 2% 0 0;
text-align: center;
width: 100%;
}
#storefront_more_from_dc span.mdc-icon.u-bg-red {
float: none;
margin: 0 auto;
margin-bottom: 5%;
}
}
.product-description a {
color: #194A8F !important;
text-decoration: underline !important;
}
.page-template-default.page article.page.type-page .vc_col-sm-4 {
width: 33%;
}
.swatch-popup .x-product-layout-purchase__swatches ul li {
height: 145px;
margin-bottom: 30px;
width: 145px;
}
.swatch-popup .x-product-layout-purchase__swatches li img {
height: 145px;
width: 145px;
}
.build-kit-page .swatch-main-container {
padding-right: 0;
}
.t-page-built-kit-template .x-product-layout-purchase__swatches .o-list-inline__item:not(:last-child) {
margin-right: 7px;
}
/* global Footer Css */
#js-SRCH .c-form-checkbox__input:checked+ .c-form-checkbox__caption:after {
top: 2px;
}
.footer-image .o-layout__item.u-width-12.u-width-12--m.o-layout--align-self-center.card-icons {
max-width: 60%;
}
.inner-ul li {
list-style: circle;
}
.t-global-account__form .logn-welcome-msg p {
color: #404146;
}
.t-global-account__form .logn-welcome-msg pa {
color: #404146;
text-decoration: underline;
}
#login_message .logn-welcome-msg a#miniModal_1 {
float: none;
}
#mc4wp-form-1 input#mc_fname {
font-size: 14px;
padding: 2%;
}
#mc4wp-form-1 input#mc_email {
font-size: 14px;
padding: 2%;
}
form.mc4wp-form.mc4wp-form-82277 {
background: #D3D3D3;
background: url(../../../../graphics/00000001/spotlght-bg.jpg) no-repeat;
background-position: 53% 40%;
background-size: contain;
border: 1px solid #D3D3D3;
border-radius: 3%;
box-shadow: 0px 0px 5px 0px #333;
float: left;
margin-top: 1%;
padding: 4% 4% 0.5% 4%;
padding-top: 3%;
width: 100%;
}
#mc4wp-form-1 .mc4wp-form-fields {
/* float: none; */
margin: 0 auto;
width: 70%;
}
#mc4wp-form-1 .mc4wp-form-fields p {
float: left;
margin-right: 2%;
width: 100%;
}
#mc4wp-form-1 .mc4wp-form-fields p input {
width: 100%;
}
#mc4wp-form-1 .mc4wp-response {
float: none;
font-size: 14px;
font-weight: 500;
line-height: 16px;
margin: 0 auto;
text-align: center;
width: 70%;
}
#mc4wp-form-1 .mc4wp-alert.mc4wp-success {
color: green;
}
#mc4wp-form-1 .mc4wp-alert.mc4wp-error {
color: #FF0000;
}
.card-pay-img {
float: right;
margin-right: 0 !important;
padding-top: 1.5%;
width: 60% !important;
/* margin-left: 1%; */
}
a#bbblink img {
border: 0;
left: 0;
margin-left: 0;
max-width: 200% !important;
position: absolute;
top: 0;
}
#custfeedpopup input {
font-size: 14px;
font-weight: normal;
padding: 2%;
width: 100%;
}
.bask-coupon-name {
line-height: 40px;
}
.bask-coupon-form {
margin-bottom: 0;
}
.bask-coupon-form li {
margin-bottom: 0;
}
.bask-coupon-form button.c-button.c-button--clear.u-bg-transparent.u-color-red {
border: 1px solid;
}
.t-basket_coupon-form li.c-form-list__item.c-form-list__item--full.c-control-group.u-flex {
margin-top: 3%;
}
.shopperlink {
float: none;
max-width: 120px !important;
padding-right: 0 !important;
padding-top: 1%;
}
.choose-color-sync.o-layout.add-class-swatch.choose-sealers ul li {
min-height: 50px;
}
#post-76640 .wpb_column.vc_column_container.vc_col-sm-10 {
width: 70%;
}
#post-76640 .wpb_column.vc_column_container.vc_col-sm-2 {
width: 30%;
}
.payment-image img {
border: 1px solid #F2F2F2;
padding: 0.5%;
width: 10%;
}
span.payment-image.c-form-checkbox__caption:after .payment-inner-img {
border: 1px solid #194A8F;
}
.top-header-mid-promo2 {
font-weight: 500;
width: 95%;
}
.holiday-message p {
font-size: 13px;
margin: 0;
}
.holiday-message p b {
text-transform: uppercase;
}
.holiday-message {
background-color: #FFD6D7;
border: 1px solid #FFD6D7;
border-radius: 4px;
margin-bottom: 3%;
padding: 1%;
width: 100%;
}
article p a {
color: #194A8F !important;
text-decoration: underline !important;
}
.vc_row {
width: 100%;
}
.bg-audio_icon {
background: url("https://directcolors.com/mm5/graphics/00000001/resources_sprites.png") 7px 4px;
background-color: #ED1E24;
background-size: 220%;
height: 60px;
width: 60px;
}
.bg-calc_icon {
background: url("https://directcolors.com/mm5/graphics/00000001/resources_sprites.png") -54px -60px;
background-color: #ED1E24;
height: 60px;
width: 60px;
}
.bg-video_icon {
background: url("https://directcolors.com/mm5/graphics/00000001/resources_sprites.png") -38px 7px;
background-color: #ED1E24;
background-size: 210%;
height: 60px;
width: 60px;
}
.bg-pdf_icon {
background: url("https://directcolors.com/mm5/graphics/00000001/resources_sprites.png") 8px -45px;
background-color: #ED1E24;
background-size: 225%;
height: 60px;
width: 60px;
}
.bg-toolkit_icon {
background: url("https://directcolors.com/mm5/graphics/00000001/resources_sprites.png") -125px 4px;
background-color: #ED1E24;
background-size: 300%;
height: 60px;
width: 60px;
}
#js-PROD .x-product-description .vc_toggle.vc_toggle_default.vc_toggle_color_default.vc_toggle_size_md {
float: left;
width: 100%;
}
#js-PROD .print-page {
top: 0;
}
@media ( max-width: 767px ) {
.footer-image .o-layout__item.u-width-12.u-width-12--m.o-layout--align-self-center.card-icons {
max-width: 90%;
}
#bbblink {
margin-left: 9% !important;
}
.card-pay-img {
float: right;
padding-top: 5%;
width: 95% !important;
}
.shopperlink {
padding-top: 2%;
}
#dc_blog .post-item-inner .entry-image {
width: auto;
}
.home .wpb_column.vc_column_container.vc_col-sm-3 {
width: 100%;
}
.home #diy-leftbar .vc_column-inner {
padding-left: 0;
}
.vc_row {
margin-left: 0;
width: 100%;
}
.home #diy-leftbar div#project_category {
max-width: 100%;
}
.home #diy-leftbar ul.li-container {
margin-left: 0;
padding-right: 0;
}
.vc_gitem-zone {
float: left;
}
.vc_column_container> .vc_column-inner {
padding: 0;
}
.top-header-mid-promo2 {
font-weight: 500;
padding: 2% 0 0;
text-align: center;
width: 100%;
}
#storefront_more_from_dc span.mdc-icon.u-bg-red {
float: none;
margin: 0 auto;
margin-bottom: 5%;
}
.o-layout__item.u-width-12.u-width-10--l.u-width-10--w.u-text-center.u-text-left--l.header-notification {
max-width: 100% !important;
}
div#top_header_promo {
width: 100% !important;
}
#top_header_promo p {
font-size: 15px !important;
}
.top-flag-section {
margin: 0 auto;
}
#js-PROD section.o-layout.x-product-description .o-layout__item {
max-width: 100%;
}
#js-PROD section.o-layout.x-product-description .calculator.o-layout__item {
max-width: 100%;
}
#js-PROD .calculator-area-right.o-layout__item {
max-width: 100% !important;
}
#js-PROD .calculator-area-left.o-layout__item {
max-width: 100% !important;
}
#js-PROD #calculator_content .slick-slider .slick-prev.slick-arrow {
left: -9px;
}
#js-PROD .all-calculate-options li.c-form-list__item.o-layout__item {
max-width: 100% !important;
}
#js-PROD {
overflow-x: hidden !important;
}
}
.product-description a {
color: #194A8F !important;
text-decoration: underline !important;
}
.page-template-default.page article.page.type-page .vc_col-sm-4 {
width: 33%;
}
.swatch-popup .x-product-layout-purchase__swatches ul li {
height: 145px;
margin-bottom: 30px;
width: 145px;
}
.swatch-popup .x-product-layout-purchase__swatches li img {
height: 145px;
width: 145px;
}
.build-kit-page .swatch-main-container {
padding-right: 0;
}
.t-page-built-kit-template .x-product-layout-purchase__swatches .o-list-inline__item:not(:last-child) {
margin-right: 7px;
}
.edit-address {
text-decoration: underline;
}
div#top_header_promo {
width: 74%;
}
#top_header_promo p {
font-size: 17px;
}
img.ca-flag-icons {
margin-left: 5px;
width: 42%;
}
img.us-flag-icons {
width: 40%;
}
.o-layout__item.u-width-12.u-width-10--l.u-width-10--w.u-text-center.u-text-left--l.header-notification {
max-width: 75%;
}
.t-site-footer-rating-image img {
margin-left: 7%;
}
.kit_swatch {
height: 45px;
width: 47px;
}
.kit-swatch-img-span {
float: left;
margin-bottom: 5px;
margin-right: 7px;
min-height: 65px;
text-align: center;
width: 14%;
}
.kit-color-swatch-name {
display: block;
float: left;
font-size: 9px;
line-height: 9px;
margin: 0 auto;
width: 80%;
width: 100%;
}
.swatch-popup .kit-swatch-img-span {
margin-bottom: 15px;
margin-right: 12px;
min-height: auto;
width: 15%;
}
.swatch-popup span.kit-color-swatch-name {
font-size: 14px !important;
line-height: 23px;
}
span.made-in-sticky {
font-size: 11px;
}
.shop-proj-name {
clear: both;
color: #404146;
float: left;
font-weight: 500;
margin: 0 auto;
padding-bottom: 14px;
padding-top: 14px;
width: 100%;
}
.design-image-box:hover .shop-proj-name {
text-decoration: underline;
}
.design-image-box:hover .shop-proj-name {
text-decoration: underline;
}
#cookieConsent {
background-color: rgba(20, 20, 20, 0.8);
bottom: 0;
color: #CCC;
display: none;
font-size: 14px;
left: 0;
line-height: 26px;
min-height: 26px;
padding: 10px 0 10px 30px;
position: fixed;
right: 0;
z-index: 9999;
}
#cookieConsent p a {
color: #FFF;
font-weight: 700;
text-decoration: none;
}
#closeCookieConsent {
cursor: pointer;
display: inline-block;
float: right;
font-weight: bold;
height: 20px;
margin: -4px 0 0 0;
width: 20px;
}
#closeCookieConsent:hover {
color: #2567C3;
}
#cookie-confirmation-content p {
margin-bottom: 0;
}
#cookieConsent a.cookieConsentOK {
background-color: #2567C3;
border-radius: 0;
color: #FFF !important;
cursor: pointer;
display: inline-block;
float: right;
margin: 0 60px 0 10px;
padding: 12px 35px;
}
#cookieConsent a.cookieConsentOK:hover {
background-color: #2567C3;
}
div#cookie-confirmation-buttons {
display: inline;
margin: 10px 0 0 !important;
max-width: 200px;
text-align: right !important;
}
#cookieConsent div#cookie-confirmation-inner {
margin: 0 auto;
max-width: 1050px;
padding: 2px;
}
#cookie-confirmation-content {
color: #FFF;
display: inline-block;
letter-spacing: 0.04em;
max-width: 800px;
}
@-moz-document url-prefix() {
#cookie-confirmation-content {
letter-spacing: 0em;
}
}
@media only screen and ( max-width: 1080px ) {
#cookie-confirmation-content {
max-width: 730px;
}
}
@media only screen and ( max-width: 980px ) {
#cookie-confirmation-content {
max-width: 100%;
text-align: center;
}
div#cookie-confirmation-buttons {
display: block;
margin: 14px auto 0 !important;
text-align: center !important;
}
}
div.autocomplete-items {
background: #FFFFFF;
position: absolute;
width: 33.9%;
z-index: 1;
}
div.autocomplete-items div {
border: 1px solid #CCCCCC;
padding: 1%;
}
.mailchimp_message {
clear: both;
color: #FFF;
float: left;
font-size: 16px;
padding-left: 0;
position: absolute;
text-align: left;
top: 100%;
width: 100%;
}
a.image-project {
height: auto;
padding: 0;
z-index: 0;
}
input.c-button.add-to-wish-prod.c-button--primary.u-bg-blue.c-button--medium.u-color-white.add-to-cart.c-button--full {
background-color: #CCC;
border: 1px solid #CCC;
color: #333;
float: right;
font-size: 12px;
text-transform: uppercase;
width: 50%;
}
#js-CTGY_PRO_TYPE .srch-image-container img {
vertical-align: middle;
width: 60%;
}
.quick-view-container .x-product-layout-purchase__swatches ul.o-list-inline {
max-height: 85px;
overflow-y: auto;
}
.quick-view-container .x-product-layout-purchase__swatches li img {
border-radius: 100%;
float: left;
height: 46px;
width: 46px;
}
.quick-view-container .x-product-layout-purchase__swatches .o-list-inline__item:not(:last-child) {
margin-right: 6px !important;
}
#js-SRCH li.c-form-list__item.x-facet-set.facet-li-code-attribute-Color {
display: none;
}
/* ### PROD_content_quickview_inline_css ### */
/* Miva Updates */
.x-product-attributes .x-product-layout-purchase__options-attribute,
.x-product-layout-purchase__options-quantity,
.t-product-cta-outer {
padding-bottom: 0.75rem;
padding-top: 0.75rem;
position: relative;
}
.x-product-layout-purchase__swatches {
margin-top: 0.5rem;
}
@media screen and ( min-width: 48em ) {
.x-product-attributes .x-product-layout-purchase__options-attribute {
border-top: 1px solid #E3E3E3;
}
.x-product-attributes .attribute-odd,
.x-product-layout-purchase__cta .x-product-layout-purchase__options-quantity {
padding-right: 1rem;
}
.x-product-attributes .attribute-even,
.x-product-layout-purchase__cta .t-product-cta-outer {
padding-left: 1rem;
}
.x-product-attributes .attribute-even:before,
.t-product-cta-outer:before {
background: #E3E3E3;
content: "";
height: calc(100% - 2px);
left: -1px;
position: absolute;
top: 2px;
width: 1px;
}
.x-product-attributes .x-product-layout-purchase__options-attribute:nth-child(1),
.x-product-attributes .x-product-layout-purchase__options-attribute:nth-child(2),
.x-product-layout-purchase__options-attribute.attribute-full {
border-top: 0;
}
.x-product-attributes .x-product-layout-purchase__options-attribute.x-product-layout-dc_kit_2_show_sealers-swatches {
border-top: 1px solid #E3E3E3;
}
}