/* Homepage Buttons */
/* CSS Document Original Penguin*/
//========= Media Queries =========//
$grid-medium: 1025px;
$grid-large: 1026px;
$grid-widescreen: 1050px;
$small: 'small';
$medium: 'medium';
$medium-down: 'medium-down';
$medium-up: 'medium-up';
$large: 'large';
$large-down: 'large-down';
$large-up: 'large-up';
$ipad-only: 'ipad-only';
$mobile-only: 'mobile-only';
$widescreen: 'widescreen';
$grid-breakpoint-has-widths: ($small, $medium-up, $widescreen);
$grid-breakpoint-has-utility: ($small, $medium-down, $medium-up, $widescreen);
$grid-breakpoint-has-push: ($medium-up, $widescreen);
// The `$grid-breakpoints` list is used to build our media queries.
// You can use these in the media-query mixin.
$grid-breakpoints: ( $mobile-only '(max-width: 759px)', $small '(max-width: #{$grid-medium - 1})', $medium '(min-width: #{$grid-medium}) and (max-width: #{$grid-large - 1})', $medium-down '(max-width: #{$grid-large - 1})', $medium-up '(min-width: #{$grid-medium})', $large '(min-width: #{$grid-large}) and (max-width: #{$grid-widescreen - 1})', $large-down '(max-width: #{$grid-widescreen - 1})', $large-up '(min-width: #{$grid-large})', $widescreen '(min-width: #{$grid-widescreen})', $ipad-only '(min-width: 760px) and (max-width: 1025px)');
@mixin media-query($media-query) {
@each $breakpoint in $grid-breakpoints {
$name: nth($breakpoint, 1);
$declaration: nth($breakpoint, 2);
@if $media-query==$name and $declaration {
@media only screen and #{$declaration} {
@content;
}
}
}
}
//========= End Media Queries =========//
//========= Variables =========//
$primary:#242a2d;
$white:#ffffff;
$black:#000000;
$grey:#fafafa;
$grey-border:#e8e8e1;
$sale:#ea0606;
$checkout:#060;
//========= END Variables =========//
//========= Mixins =========//
@mixin text-centered {
margin: 0;
position: absolute;
top: 50%;
left: 50%;
margin-right: -50%;
transform: translate(-50%, -50%);
background-color:#142b3b;
opacity: .9;
padding: 3rem;
@include media-query($medium-down) {
padding: 1rem;
}
}
@mixin text-centered-left {
margin: 0;
position: absolute;
top: 50%;
left: 18%;
margin-right: -50%;
transform: translate(-50%, -50%);
padding: 3rem;
@include media-query($medium-down) {
padding: 1rem;
}
}
@mixin box-shadow($x-axis: 0, $y-axis: 1px, $blur: 2px, $spread: 2, $color: $default) {
box-shadow: $x-axis $y-axis $blur $spread $color;
-webkit-box-shadow: $x-axis $y-axis $blur $spread $color;
-moz-box-shadow: $x-axis $y-axis $blur $spread $color;
-ms-box-shadow: $x-axis $y-axis $blur $spread $color;
}
@mixin border-radius($radius) {
-webkit-border-radius: $radius;
-moz-border-radius: $radius;
-ms-border-radius: $radius;
border-radius: $radius;
}
//========= END Mixins =========//
//========= NAV =========//
.site-nav__dropdown-link {
display: inline-block;
}
.site-nav__dropdown-link:hover, .site-footer__linklist a:hover{
padding-bottom:3px;
border-bottom: 1px solid #ddd;
}
.site-nav__link--underline:after {
margin: 0px 8px;
border-bottom: 1px solid #242a2d;
}
.site-nav .nav-pride, .mobile-nav .nav-pride{
box-sizing: border-box;
background: url(https://cdn.shopify.com/s/files/1/0051/3723/6054/files/pride-logo-c.png?v=1588911905) center/contain no-repeat;
text-indent: -999999px;
width: 70px;
}
.mobile-nav .nav-pride{
margin-left: 13px;
}
.site-nav .nav-pride:after {
border-bottom: 0px solid #fff;
}
//========= HOMEPAGE BLOCKS =========//
@include media-query($medium-down) {
.promo-grid__container {
.promo-grid__bg {
background-color: #e7e7e7;
img{ }
}
}
}
.mob-nav-sale-top-banner {display:none;}
//========= PROMOTION BLOCKS =========//
.template-index .promo-grid .rte--block {
margin-bottom:0px;
}
.template-index .promo-grid .cta_underline {
margin:0px;
}
@include media-query($ipad-only) {
.template-index .flex-grid .type-advanced .promo-grid__container--boxed .promo-grid__bg{
max-height: 85%;
height:100%;
}
.background-media-text__aligner {
padding-bottom: 5%;
}
}
//========= UNICORN BLOCKS =========//
@include media-query($medium-down) {
div.unicorn-left{display:none;}
div.unicorn-header{
display:block!important;margin-bottom: -40px;background-color: #121414;
img {margin-left: 0;}
}
div.unicorn-right{
background-color: #e7e7e7;
img {margin-left: 0;}
margin-left:0px!important;
margin-top:0px!important;
}
}
div.unicorn-left{margin-right:-6px;margin-top:-20px;}
div.unicorn-right{margin-left:-6px;margin-top:-20px;}
div.unicorn-header{display:none;}
//========= STICKY BUTTON =========//
.sticky_btn_signup.setup-copy {
bottom:50px!important;
left:20px!important;
cursor: pointer;
@include media-query($medium-down) {
bottom:20px!important;
left:-5px!important;
}
}
.sticky_btn_signup.setup-copy .sticky_btn_copy{
-webkit-border-radius: 7px!important;
-moz-border-radius: 7px!important;
-ms-border-radius: 7px!important;
border-radius: 7px!important;
}
.sticky_btn_signup.setup-copy .sticky_btn_close{
font-weight: 200!important;
border: 1px solid #ddd!important;
font-size: 18px!important;
cursor: pointer;
background-color: #ddd!important;
opacity:.8;
}
.sticky_btn_signup.setup-copy .sticky_btn_close:hover{
opacity:1;
border: 1px solid #ddd!important;
}
.sticky_btn_signup.setup-copy .sticky_btn_close span{
display:block;
margin-top: -2px;
}
//========= END SALE ELEMENTS =========//
.nav-vip-sale,
.nav-offers,#Label-collections-offers3,
.on-sale,
.nav-sale
/*.nav-sale-shirts, */
/*.nav-sale-jumpers, */
/*.nav-sale-t-shirts,*/
/*.nav-sale-polos,*/
/*.nav-sale-jackets-coats*/
{color: $sale!important;}
.nav-sale:hover,
.nav-sale:hover,
.nav-sale-shirts:hover,
.nav-sale-jumpers:hover,
.nav-sale-t-shirts:hover,
.nav-sale-polos:hover{/*color: $sale!important;*/}
.site-nav--has-dropdown .nav-sale{/*color:$sale!important;*/}
.site-nav--has-dropdown .nav-sale:after{}
.nav-vip-sale:after {border-bottom: 2px solid $sale;}
.nav-sale:after {}
.template-customers-login .countdown-top-banner,
.template-customers-account .countdown-top-banner,
.template-customers-order .countdown-top-banner,
.template-customers-addresses .countdown-top-banner{display:none!important;}
.vip-badge {
position: absolute;
background: rgba(255,255,255,1);
color: #000;
padding: 2px 5px;
text-transform: uppercase;
font-weight:500;
bottom: 0;
left: 0;
border-radius: 0;
top: initial;
right: initial;
span{padding-left: 3px;}
}
.vip-banner-callout{
padding: 3px;
display: block;
}
.vip-mobnav-banner{
background-color: #000;
color: #fff;
padding: 10px;
text-transform: uppercase;
text-align: center;
h3{margin:0;line-height:1.4;}
}
//========= COUNTDOWN BLOCK HOMEPAGE =========//
.animation-contents{
.countdown-top-banner{
@include media-query($medium-up) {
width:100%;
}
}
.countdown-copy{
font-size: 12px !important;
display:block;
@include media-query($medium-up) {
font-size: 12px !important;
}
}
.cd_cell{
font-size: 24px !important;
@include media-query($medium-up) {
font-size: 35px !important;
}
}
.cd_label{
font-size: 8px !important;
display:block!important;;
@include media-query($medium-up) {
font-size: 12px !important;
}
}
.countdown-banner{
background: none !important;
}
}
//========= COUNTDOWN BLOCK HOMEPAGE =========//
//========= END SALE ELEMENTS =========//
h1,.h1,h2,.h2,h3,.h3,h4,.h4,h5 {
letter-spacing: .5px;
}
/*//========= Globale Banner =========//
.sale-banner{
width:100%;
display: block;
background-color: #200b49;
color: #bdd7f3;
padding: 10px 0px;
text-align: center;
margin-bottom: 5px;
}
.sale-banner h1 {
display: inline-block;
margin: 0;
font-size:1.4em;
line-height: 1.2;
@include media-query($mobile-only) {
font-size:1.2em;
}
.top-banner-copy{
color:$white;
@include media-query($mobile-only) {
display:block;
}
}
.show-for-global-e{
@include media-query($mobile-only) {
font-size:.9em;
}
}
}
.sale-banner .on-sale{
}
//========= END Globale Banner =========//
*/
.section--divider {border-top: 0px solid #fff;
padding-top: 0px;
@include media-query($medium-down) {
padding-top: 20px;
}
}
//========= Global E =========//
.ge-free-shipping-container {
padding:8px;
letter-spacing:.5px;
font-family: 'Montserrat', sans-serif!important;
text-transform: capitalize;
background-color: #006699!important;
.ge-free-shipping-msg-desktop{
font-size:.9rem;
}
.ge-free-shipping-msg-mobile{
font-size:.7rem;
}
}
.ge-checkout-page{
.ge-checkout-logo{
padding:0px;
img {
width:auto;
height: 140px;
margin-top: -30px;
}
}
#checkoutContainer {
margin-top:-45px;
}
}
.globale_popup_wrapper{
.gle_mobile {
right: 0px;
max-width: 360px;
}
.gle_mobile, .gle_desktop
{
border: solid 10px $white;
@include box-shadow(-4px, 5px, 30px, -7px, #242a2d);
@include border-radius(5px);
margin:20px auto;
width: auto;
.gePopupsContainer {
border-color: $white;
width:auto;
}
}
#globale_csc_popup, #globale_popup {
.glDefaultPopupContainer{
padding-top: 0px;
border-color: $white;
.glLogo:after{
height: 67px;
width: 150px;
height: 80px;
background-size: 120px 120px;
background-repeat: no-repeat;
}
.glPopupContent{
.country .dropDownRow .caption,
.currency .dropDownRow .caption{
font-family: 'Muli', sans-serif;
font-size:12px;
}
.country .dropDownRow .dropdown,
.currency .dropDownRow .dropdown{
font-family: 'Muli', sans-serif;
}
}
.glControls{
.glCancelBtn, .glDefaultBtn {
@include border-radius(5px);
}
.glCancelBtn,
.Backtoshop, .changeShipping{
font-family: 'Muli', sans-serif;
&:hover{
font-weight: normal;
}
}
}
}
}
}
//========= END Global E =========//
//========= Navigation =========//
.megamenu {
margin-top: 22px;
.megamenu__colection-image {
}
}
//========= END Navigation =========//
//========= Page Loader =========//
.template-collection {
#bc-sf-filter-loading {
background: url(/cdn/shop/files/page-loader-op.gif?10468) center no-repeat rgba(255,255,255,0.95);
}
}
//========= END Page Loader =========//
//========= PDP =========//
.template-product{
.main-content {
.page-content--bottom {
padding-top: 0px;
padding-bottom: 0px;
.return-link {display:none;}
}
.hr--large{
margin: 0px auto;
}
}
.reveal-overlay .reveal{
min-height: auto;
height: auto;
}
.page-content--product{
@include media-query($medium-down) {
padding-top: 10px;
}
padding-top: 50px;
.product__photos{
.slick-current{
opacity: 1!important;
}
.slick-slide{
opacity: .5;
}
}
.product-single__meta{
text-align: left;
.breadcrumb {
margin-bottom:10px;
}
.product-single__title{
font-size: 1.4rem;
line-height: 1.2;
}
.product__price{
font-size: 1rem;
font-weight: bold
}
.hr--medium {
margin:15px auto;
border-top: 1px solid $white;
}
.master-swatch {
img{
width:30px;
height:30px;
margin: 3px 5px;
}
}
.product-single__form{
width:75%;
@include media-query($medium-down) {
width:100%;
}
margin-top: 15px;
margin-bottom: 0px;
select, .sizeguide_wrapper {
float:left;
img {
height: 30px;
width: 30px;
margin-top: -4px;
opacity: .6;
}
}
select{
width:70%;
@include media-query($medium-down) {
width:80%;
}
}
.sizeguide_wrapper {
padding-left: 12px;
text-align: center;
@include media-query($medium-down) {padding-top: 5px;}
margin-bottom: -5px;
#sizeguide {
font-size:10px;
}
}
.add-to-cart{
margin: 20px 0px;
padding: 16px;
width:80%;
display: inline-block;
}
.product__inventory {
display:none;
}
}
.product-single__description {
font-size:.9rem;
border-top: 1px solid $grey-border;
border-bottom: 1px solid $grey-border;
padding: 1rem 0rem;
}
.shipping_method_wrapper{
text-indent: 1rem;
line-height:1.4;
}
.next_working_day_orderby_placeholder{
font-size: 10px;
}
}
}
}
//========= END PDP =========//
//========= Sale End Holding Page =========//
#shopify-section-collection-saleended, #shopify-section-collection-vipended {
.sale-page{
position: relative;
max-width: 1400px;
margin: auto;
}
.head .btn-underline, .foot .btn-underline{
font-size:1.4em;
}
h1{
margin-bottom: 0;
}
h3{
margin-bottom: 0;
font-size:12px;
}
.form{
background-color: white;
text-align: center;
padding: 2em;
.content{
max-width: 600px;
margin: auto;
text-align: center;
padding:1em;
h2 {
margin-bottom:2px;
}
p{
font-size:11px;
}
.one_click_signup{
.one_click_content{
width:100%;
.ocsu_email{
text-align:center;
}
.custombtn {
max-width:200px;
margin: 20px;
}
.signup_t_and_c{
max-width:300px;
margin:auto;
}
}
}
}
}
//desktop
@media only screen and (min-width: 1025px){
.head {
top: 100px;
width:50%;
left:10%;
}
.form {
position: absolute;
top:255px!important;
width:50%;
left:10%!important;
@include box-shadow(-4px, 5px, 30px, -7px, #242a2d);
@include border-radius(5px);
.content{
}
}
h1{
font-size:1.8em!important;
padding: 0 10px!important;
}
}
//mobile
@media only screen and (max-width: 1024px){
.head {
padding:2em;
h1{font-size:1.8em!important;}
}
h1{
font-size:1.6em!important;
padding:0px!important;
}
.form {
h2{
font-size:1.6em!important;
}
}
.foot p {
font-size:12px;
}
}
}
//========= END : Sale End Holding Page =========//
//========= PLP Cat banner =========//
@media only screen and (min-width: 420px){
.collection-header-wrapper {
background-position: calc(80% - 0px) 0;
height: 290px;
}
}
@include media-query($medium-up) {
.seo_sublink_wrapper .cta_seo_sublink {
}
.seo_sublink_wrapper .cta_seo_sublink:hover {
}
.seo_sublink_wrapper .custom:hover {
}
}
@include media-query($medium-down) {
.collection-header-inner-wrapper {
margin-bottom:0px!important;
background: linear-gradient(0deg, rgba(255,255,255,1) 40%, rgba(255,255,255,0) 80%);
}
.collection-header-wrapper .section-header__title {
font-size:2em!important;
}
}
.collection-header-wrapper .collection-header-copy {
background-color:transparent;
padding:0px;
}
.collection-header-wrapper .section-header__title {
font-size:3em;
}
.seo_sublink_wrapper {
margin-bottom:10px;
}
.seo_sublink_wrapper:after{
height:100%;
}
.seo_sublink_wrapper .cta_seo_sublink {
display: inline;
padding: 0px;
color:#1d1e20;
border: 0;
border-bottom: 1px solid #666;
border-radius: 0px;
margin-right: 20px;
margin-left:0px;
padding-bottom: 0px;
text-transform: uppercase;
font-weight: 800;
}
.seo_sublink_wrapper .custom {
background-color:#fff;
color:#000;
border:#ddd 1px solid;
}
//========= END PLP Cat banner =========//
//========= PLP Filters =========//
#CollectionAjaxResult .boost-pfs-filter-tree-h .boost-pfs-filter-option{border: 1px solid #ddd;}
#CollectionAjaxResult .boost-pfs-filter-tree-h .boost-pfs-filter-option:hover{border: 1px solid #333;}
@include media-query($medium-up) {
#CollectionAjaxResult .boost-pfs-filter-option-item-list.boost-pfs-filter-option-item-list-box .boost-pfs-filter-option-item>button {
border: 1px #ddd solid;
min-width: 45px;
}
#CollectionAjaxResult .boost-pfs-filter-option-item-list.boost-pfs-filter-option-item-list-box .boost-pfs-filter-option-item>button:hover {
border: 1px #333 solid;
background:#333333;
}
}
.boost-pfs-filter-tree-h .boost-pfs-filter-option-title-heading {font-size: 12px!important;}
#boost-pfs-filter-top-sorting-select:hover, .boost-pfs-filter-top-sorting-select {;border: 1px solid #ddd!important;height: auto!important;}
#boost-pfs-filter-top-sorting-select:hover, .boost-pfs-filter-top-sorting-select option{font-size: 12px;}
#boost-pfs-filter-top-sorting-select:hover, .boost-pfs-filter-top-sorting-select:hover {border: 1px solid #333!important;}
.boost-pfs-filter-tree-mobile-button{border-color: #ddd}
@include media-query($medium-up) {
.boost-pfs-filter-top-sorting-select {padding: 8px 30px;font-size:12px!important;}
.collection-filter{padding-top:0px;}
}
//========= END PLP Filters =========//
//========= Customer login =========//
.template-customers-login, .template-customers-register {
.hr--small {
border-top: 1px solid $grey;
}
#customer_login_guest .btn{
width:100%
}
@include media-query($ipad-only){
.medium-up--push-one-third {
max-width: 60%;
margin: auto;
float: none;
}
}
}
//========= Account Pages =========//
.template-customers-addresses{
.page-content{
.grid .grid__item{
text-align: left!important;
h2{
padding-left: 0px;
}
@include media-query($medium-up){
width:100%!important;
left: 0px;
}
.form-vertical input[type="checkbox"]{
width:auto;
}
}
}
}
.template-customers-account,
.template-customers-order,
.template-customers-addresses{
.page-content{
.breadcrumb {
position: absolute;
padding-top: 70px;
padding-left:17px;
text-transform: uppercase;
a{text-decoration: underline;}
}
.section-header{
background-color: $grey;
text-align: left;
padding: 30px 15px;
min-height: 127px;
h1{
display: inline-block;
padding: 5px 0px;
vertical-align: super;
}
.btn--secondary{
border: none;
text-decoration: underline;
padding: 0px;
text-align: left;
width:100%;
margin-left: 35px;
min-height: auto;
margin:0px;
}
.address-new-toggle{
display:block!important;
font-size: 8px;
text-transform: uppercase;
display: inline-block;
padding: 11px 20px;
margin-top:30px;
width: auto;
vertical-align: middle;
cursor: pointer;
text-decoration: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-appearance: none;
-moz-appearance: none;
color: $white;
background: #242a2d;
@include border-radius(3px);
letter-spacing: .5px;
}
}
.grid .grid__item{
.hr--medium {border-top:solid 1px $grey-border;}
width:100%;
h2, h3{
font-size: 1.8em;
padding-left: 15px;
margin-bottom: 10px;
}
p {
padding-left: 15px;
font-size:12px;
.text-link{
font-size: 10px;
text-transform: uppercase;
display: inline-block;
padding: 11px 20px;
margin:10px 0px;
width: auto;
vertical-align: middle;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-appearance: none;
-moz-appearance: none;
color: $white;
background: #242a2d;
@include border-radius(3px);
letter-spacing: .5px;
}
}
table {
@include media-query($medium-up){
font-size: 12px;
}
border: 1px solid $grey-border;
border-spacing: 0px;
background: $white;
a {color:#006699;text-decoration: underline;}
@include media-query($medium-down){
td[data-label="Order No."]{
background-color: $grey;
}
}
tfoot td{
@include media-query($medium-down){
background-color: $grey;
@include media-query($medium-down){
padding: 8px 10px;
}
}
}
thead th{
background-color: $grey;
}
tbody td{
@include media-query($medium-up){
padding: 8px 15px;
}
padding: 8px 10px;
}
}
}
}
}
.template-customers-addresses {
.section-header{
.btn--secondary{
width:auto;
margin-left: 0px;
}
}
}
.template-customers-account .section-header::before{
background: url(//cdn.shopify.com/s/files/1/0021/1514/1731/files/icon-cs-account.svg?276774);
content: "";
margin-right: 5px;
width: 30px;
height: 30px;
display: inline-block;
background-repeat: no-repeat;
}
//========= End Account Pages =========//
//========= Footer Pages =========//
#footerpages {
text-align: left;
.box {
background-color: $grey;
padding: 2rem;
margin: 1rem 0rem;
}
}
// Customer Service Contact Us Page
.faq-accordion .tab-title-Shopping::before {
background: url(//cdn.shopify.com/s/files/1/0021/1514/1731/files/icon-cs-shopping.svg?276755);
@include media-query($medium-up) {
height: 60px!important;
width: 35px!important;
}
height:20px!important;
left: 3px;
}
.faq-accordion .tab-title-Delivery::before {
background: url(//cdn.shopify.com/s/files/1/0021/1514/1731/files/icon-cs-delivery.svg?276774);
top: 9px;
@include media-query($medium-up) {
top: 18px !important;
}
}
.faq-accordion .tab-title-Returns::before {
background: url(//cdn.shopify.com/s/files/1/0021/1514/1731/files/icon-cs-returns.svg?276774);
@include media-query($medium-up) {
width: 50px!important;
}
}
.faq-accordion .tab-title-Account::before {
background: url(//cdn.shopify.com/s/files/1/0021/1514/1731/files/icon-cs-account.svg?276774);
@include media-query($medium-up) {
width: 50px!important;
height: 60px!important;
}
height:20px!important;
}
#contactusdeeplink {
h3 {text-transform: uppercase;}
}
.customer-form-wrapper{
background:$grey;
border:none;
padding: 1rem;
.contact-query-select{
background-color: $white;
@include border-radius(5px);
}
.ace-cf-row{
padding:0px;
margin-left: -21px;
margin-right: -21px;
form {
.ace-cf-panel{
background:$grey;
@include box-shadow(0px, 0px, 0px, 0px, $grey);
border:none;
@include media-query($medium-up){
padding: 1rem 5rem;
}
}
.form-field-wrapper {
.has-error .checkbox, .has-error .checkbox-inline, .has-error.checkbox-inline label, .has-error.checkbox label,
.has-error .control-label, .has-error .help-block, .has-error .radio, .has-error .radio-inline,
.has-error.radio-inline label, .has-error.radio label {
color: $sale;
}
.form-group {
label {
letter-spacing: .5px;
padding-left: 10px;
font-size: 12px;
}
input, select, textarea {
background-color:$white;
border: 1px $grey-border solid;
@include box-shadow(0px, 0px, 0px, 0px, $grey);
height: 40px;
}
}
}
.submit-button-wrapper .cf-btn{
background: $primary;
line-height: 1.42;
white-space: normal;
font-weight: bold;
color: #fff;
text-transform: uppercase;
&:hover{
background: $primary;
transition: 0.5s;
}
}
}
}
}
.faq-accordion .tabs-title{
width: 25%;
margin: 0%;
border:5px solid $white;
border-top:10px solid $white;
}
.faq-accordion .tabs-title a{
background-color: $grey;
min-height: 95px;
}
.faq-accordion .tabs-title:first-child{
border-left:0px solid $white;
}
.faq-accordion .tabs-title:last-child{
border-right:0px solid $white;
}
.faq-accordion .tabs-title a span {
margin-left: -15px;
}
.faq-accordion .tabs-title a span,
.accordion-title span {
text-transform: uppercase;
}
.faq-accordion .is-active>.accordion-title::after,
.faq-accordion .is-active.tabs-title a::after {
content: "";
background: url(//cdn.shopify.com/s/files/1/0021/1514/1731/files/icon-cs-arrow-dn.svg?276880);
height: 20px;
width: 13px;
display: inline-block;
background-repeat: no-repeat;
transform: rotate(0deg);
position: absolute;
margin-top: -8px;
}
.faq-accordion .tabs-title a::after,
.faq-accordion .accordion-title::after {
content: "";
background: url(//cdn.shopify.com/s/files/1/0021/1514/1731/files/icon-cs-arrow-dn.svg?276880);
height: 16px;
width: 16px;
display: inline-block;
background-repeat: no-repeat;
transform: rotate(90deg);
position: absolute;
margin-left: 10px;
}
.faq-accordion .accordion-title{
background-color:$grey;
}
.faq-accordion .accordion-title:hover,
.faq-accordion .accordion-title:focus{
background-color:$grey;
}
@include media-query($medium-down) {
.faq-accordion .accordion-title::before,
.faq-accordion .tabs-title a::before {
width: 25px;
height: 25px;
}
}
//========= End Footer Pages =========//
//========= Shopping Bag =========//
.cart__row {
.cart-info-wrapper {
padding: 10px;
.cart__product-name {
@include media-query($medium-up) {
font-size: 130%;
max-width: 65%;
letter-spacing: .5px;
}
}
.vertical-middle {
@include media-query($medium-up) {
bottom: 0%;
top: auto;
}
.cart-quantity {
@include media-query($medium-down) {
.cart__product-qty {
max-width: 40px;
max-height: 35px;
}
}
}
.cart__update {
@include media-query($medium-up) {
margin-top: -2px;
}
padding: 10px;
background: #f5f5f5;
font-size: 10px!important;
margin-top: -5px;
font-weight: 500;
vertical-align: middle;
}
}
.vertical-bottom {
@include media-query($medium-up) {
width: 25%;
top: 10px;
right: 40px;
}
.cart-remove {
@include media-query($medium-down) {
height: 25px;
position: absolute;
bottom: 0;
}
@include media-query($medium-up) {
top: 0px;
width: 100%;
}
.btn {
float: right;
border: none;
padding: 5px;
margin-right: -10px;
small {
font-size: .6rem;
}
small::before {
display: inline-block;
height: 24px;
width: 24px;
content: '';
background-repeat: no-repeat!important;
vertical-align: middle;
background: url(//cdn.shopify.com/s/files/1/0021/1514/1731/files/icon-basket.svg?267612);
}
}
}
.cart-price {
font-size: 150%;
font-weight: 800;
letter-spacing: .5px;
@include media-query($medium-down) {
margin-right: 10px;
}
@include media-query($medium-up) {
bottom: 0px;
position: absolute;
width: 100%;
}
}
}
}
}
.desktop-right {
.grid__item {
@include media-query($medium-down) {
padding: 15px!important;
}
.text-left {
.standard_placeholder_wrapper,
.next_working_day_placeholder_wrapper,
.returns_wrapper{
font-size: 12px;
@include media-query($medium-down) {
font-size:11px;
}
}
.dcodeErrorMessage {
color: red;
}
.dcode-discount-label-dynamic {
font-weight: 800;
color: $primary;
text-transform: uppercase;
}
#dcodeSubmit {
padding: 5px;
@include media-query($medium-up) {
min-height: 36px;
}
}
.dcodeOuterWrapper {
border-top: 1px solid $grey-border;
border-bottom: 1px solid $grey-border;
padding: 10px 0px;
.dcodeTable td {
padding: 5px 0px;
}
}
.cart-subtotal-title,
.cart-subtotal-price {
width: 50%;
float: left;
padding: 20px 0px 0px;
p.h4 {
border-bottom: none;
}
}
.cart-subtotal-price {
text-align: right;
.dcodeLineThrough {
font-size: 70%;
}
}
}
.additional_checkout_buttons {
margin-top: 0px;
.shopify-cleanslate div[data-testid="grid-cell"] {
@include media-query($medium-up) {
-webkit-flex-basis: 48% !important;
-ms-flex-preferred-size: 48% !important;
flex-basis: 48% !important;
margin: 0 1% 1% !important;
}
}
}
.text-center {
margin-top: 60px;
}
a.cart__checkout {
padding: 14px;
}
}
}
//========= End Shopping Bag =========//
//========= Collection Pages =========//
.custom-badge {
margin: -19px 0 0 0;
position: absolute;
background: #f5f5f5;
color: #000;
padding: 2px 4px;
text-transform: uppercase;
font-weight:500;
@include media-query($medium-up) {
padding: 0px 4px;
}
}
.secondary-badge-sustainable
{ position: absolute;
top: 10px;
left: 10px;
width: 20px;
height: 20px;
background-image: url(/cdn/shop/files/sustainable-1.svg?v=1624464727);
background-repeat: no-repeat;
background-size: 20px 20px;
}
#bc-sf-filter-tree-mobile button {
margin: 10px 0px!important;
}
#bc-sf-filter-mobile-toolbar {
background-color: $white;
padding: 10px 5px;
.bc-sf-filter-mobile-toolbar-header,
.bc-sf-filter-mobile-toolbar-items {
border-bottom: 1px solid $white;
}
.bc-sf-filter-mobile-toolbar-items .bc-sf-filter-close-btn {
color: $primary;
}
.bc-sf-filter-mobile-toolbar-items .bc-sf-filter-mobile-toolbar-left a:before {
top: 5px;
}
}
.bc-sf-filter-selection-wrapper{
.bc-sf-filter-selected-items{
.bc-sf-filter-option-label{
a {
width:100%;
.bc-sf-filter-clear{
background:none!important;
}
.bc-sf-filter-clear:before{
background:#000!important;
}
.bc-sf-filter-clear:after{
background:#000!important;
}
}
}
}
}
#bc-sf-filter-options-wrapper {
.bc-sf-filter-block-title h3 {
font-weight: 200;
}
}
#bc-sf-filter-mobile-footer button {
background: $checkout;
}
.bc-sf-filter-tree-mobile-full-width .bc-sf-filter-option-block .bc-sf-filter-block-title:after {
top: 15%;
}
.collection-filter__item--count {
padding-bottom: 10px;
}
.grid-product__content {
.grid-product__image-mask {}
.grid-product__title {
font-size: 10px;
}
.grid-product__price {
font-size: 12px;
font-weight: 800;
}
}
.bc-sf-filter-selection-wrapper .bc-sf-filter-block-title h3 {
padding: 5px 5px;
}
.template-collection .bc-sf-filter-selection-wrapper .bc-sf-filter-selected-items {
.bc-sf-filter-option-label {
margin: 8px 0px;
display: block!important;
}
}
.template-collection .bc-sf-filter-option-block .bc-sf-filter-block-content {
.bc-sf-filter-option-swatch li {
width: 46%!important;
.bc-sf-filter-option-value {
@include media-query($medium-up) {
margin-left: 5px!important;
font-size: .7rem;
}
}
.bc-sf-filter-option-value {
@include media-query($medium-down) {
font-size: .75rem;
padding-left: 8px;
}
}
.bc-sf-filter-option-amount {
font-size: .6rem;
}
.bc-sf-filter-option-swatch-image {
height: 33px!important;
}
}
.bc-sf-filter-option-box li a {
padding: 6px;
font-size: .8rem;
font-weight: 200;
@include media-query($medium-down) {
font-size: .9rem;
}
}
}
//========= End Collection Pages =========//
//========= Content Page =========//
.single-page-wrapper {
text-align: center;
margin: 1rem 0rem;
p a {
text-decoration: underline;
}
@include media-query($medium-up) {
font-size: 14px;
}
}
//========= END Content Page =========//
//========= Mini Drop Down=========//
.cart_drawer_wrapper {
@include media-query($medium-up) {
background: transparent;
padding-top: 16px;
width: 40px;
}
}
#CartDrawer.drawer.drawer--is-open {
padding: 0px;
-webkit-box-shadow: -2px 6px 5px rgba(50, 50, 50, 0.25);
-moz-box-shadow: -2px 6px 5px rgba(50, 50, 50, 0.25);
box-shadow: -2px 6px 5px rgba(50, 50, 50, 0.25);
}
#CartDrawer {
border-top: 1px solid $grey-border;
background: #fff!important;
.drawer__fixed-header--full {
background-color: $white;
padding: 20px 20px 0px 20px;
.drawer__title {
font-weight: 100;
text-transform: uppercase;
font-size: 16px;
margin-bottom: 7px;
}
}
.drawer__inner {
p.appear-delay-3 {
padding: 20px;
}
.ajaxcart__product {
.ajaxcart__row {
padding: 10px 20px;
margin-bottom: 0px;
.grid {
.grid__item {
.ajaxcart__product-name {
white-space: initial;
font-size: 10px;
}
}
}
}
}
}
.drawer__footer {
padding-top: 0px;
background-color: $grey;
padding: 20px;
.grid {
.grid__item {
.ajaxcart__price,
.ajaxcart__subtotal {
font-size: 16px;
font-weight: bold;
}
}
}
.btn--full {
background-color: $primary;
font-size: 12px;
}
}
}
//========= END Mini Drop Down=========//
//========= Delivery Options =========//
.cart__image img {
margin: 25px 0px;
}
.pdp-delivery-returns::before {
background: url(//cdn.shopify.com/s/files/1/0021/1514/1731/files/icon-delivery-01.png?v=1597753591);
background-size: contain;
opacity: 1;
}
.drawer{
.shipping_method_wrapper {
.standard_placeholder_wrapper, .next_working_day_placeholder_wrapper, .next_working_day_orderby_placeholder, .returns_wrapper{
font-size:10px;}
}
}
.shipping_method_wrapper {
margin-bottom:0px;
.delivery_special_callout{
font-size:12px;
line-height: 1.4;
}
h4 {
margin: 0px 0px 5px 0px;
letter-spacing: .5px;
font-size: 10px;
font-weight: 200;
}
.standard_placeholder_wrapper::before, .next_working_day_placeholder_wrapper::before, .returns_wrapper::before {
content: "\2713";
color:#333;
padding-right:4px;
display:inline;
}
.standard_placeholder_wrapper, .next_working_day_placeholder_wrapper, .next_working_day_orderby_placeholder, .returns_wrapper{
text-transform: uppercase;
font-weight:800;
.standard_placeholder, .next_working_day_placeholder{
padding-left: 14px;
font-size: 10px;
font-weight:200;
}
}
.next_working_day_placeholder_wrapper span:first-child {
display: inline;
}
.standard_placeholder_wrapper,
.saturday_placeholder_wrapper,
.next_working_day_placeholder_wrapper,
.next_working_day_by_noon_placeholder_wrapper {
span {
display: block;
}
}
.next_working_day_orderby_placeholder {
padding: 2px 0px;
text-decoration: none;
text-transform: uppercase;
margin-left:13px;
font-weight: 200;
font-size:10px!important;
}
}
//========= Delivery Options=========//
//========= Site Buttons =========//
.cf-btn,
.custombtn,
.btn {
font-size: 12px!important;
padding: 10px;
margin: 5px 0px;
letter-spacing: 0.1em;
min-height: 40px;
vertical-align: baseline;
}
//========= END Site Buttons =========//
//========= Header Icons =========//
.global-e-wrapper {
padding:10px 5px;
}
.site-nav__link {
padding-left: 7px!important;
padding-right: 7px!important;
}
.site-nav__link--icon {
.icon-user {
width: 22px;
height: 22px;
}
.icon-bag {
width: 25px;
height: 25px;
margin: 0 0 0 -4px;
}
}
.cart-link__bubble--visible {
top: 60%;
right: -5px;
}
//========= END Header Icons =========//
//========= Sign Up Form =========//
.one_click_signup {
.one_click_content {
@include media-query($medium-up) {
}
h1 {
text-transform: uppercase;
@include media-query($medium-down) {
font-size: 1rem;
}
}
h2 {
text-transform: inherit;
@include media-query($medium-down) {
font-size: 1rem;
line-height: 1.4;
}
}
p {
@include media-query($medium-down) {
font-size: .6rem;
}
}
.ocsu_email {
background-color: $white;
@include border-radius(2px);
min-height: 40px;
font-size: 14px;
width:400px;
@include media-query($medium-down) {
width: 100%
}
}
.ocsu_signup {
@include media-query($medium-up) {
width:190px;
}
}
}
.successful_signup {
h2 {
font-size: 1.5rem;
text-transform: inherit;
}
p {
font-size: 1rem;
}
}
}
//========= END Sign Up Form =========//
//========= Footer =========//
.site-footer {
border-top: none;
.signup {
background-color: $grey;
padding: 2rem 2rem;
text-align: center;
border-top: 1px solid $grey-border;
border-bottom: 1px solid $grey-border;
}
.footer__title {
font-weight: 800;
@include media-query($medium-down) {
font-size: 12px;
}
}
.footer__collapsible {
font-size: 12px;
}
.grid {
@include media-query($medium-up) {
padding: 1rem 0rem;
margin-left: 0px;
border-bottom: 1px solid $grey-border;
border-top: 1px solid $grey-border;
}
.footer__item-padding {
text-align: center;
@include media-query($medium-up) {
text-align: right;
}
}
}
.announcement-bar {
border-bottom: none;
@include media-query($medium-up) {
margin: 1rem 0rem;
}
.page-width {
padding: 0px;
}
}
}
//Footer Icons for social//
.site-footer .grid .grid__item li.footer_link_facebook:before,
.site-footer .grid .grid__item li.footer_link_instagram:before,
.site-footer .grid .grid__item li.footer_link_twitter:before,
.site-footer .grid .grid__item li.footer_link_youtube:before,
{
padding: 5px 10px;
content: " ";
margin-right: 5px;
background-repeat: no-repeat!important;
}
.site-footer .grid .grid__item li.footer_link_facebook:before {
background: url(/cdn/shop/files/social-facebook.png?4517);
}
.site-footer .grid .grid__item li.footer_link_instagram:before {
background: url(/cdn/shop/files/social-instagram.png?4517);
}
.site-footer .grid .grid__item li.footer_link_twitter:before {
background: url(/cdn/shop/files/social-twitter.png?4517);
}
.site-footer .grid .grid__item li.footer_link_youtube:before {
background: url(/cdn/shop/files/social-youtube.png?4517);
}
//========= END Footer =========//
//========= Announcement Bar =========//
.usp-icon-0::before,
.usp-icon-1::before,
.usp-icon-2::before,
.usp-icon-3::before {
@include media-query($medium-down) {
width: 30px;
height: 30px;
}
width: 32px;
height: 32px;
content: '';
display: inline-block;
background-repeat: no-repeat!important;
background-size: contain!important;
margin-right: 10px;
vertical-align: middle;
opacity: 1;
margin-bottom: 3px;
}
.announcement-text {
font-weight: normal;
font-size: 115%;
@include media-query($medium-down) {
padding:5px 0px 0px 0px;
font-size: 108%!important;
}
}
.announcement-bar{
background-color:#ffffff;
}
.usp-icon-0::before{
background: url(/cdn/shop/files/icon-delivery-01.png?v=1597326349);
}
.usp-icon-1::before{
background: url(/cdn/shop/files/icon-returns-01.png?v=1597326894);
//background: url(//cdn.shopify.com/s/files/1/0021/1514/1731/files/icon-nextday.svg?242150);
}
.usp-icon-2::before{
//background: url(/cdn/shop/files/icon-op-xmas-return.png?v=1637252165);
background: url(/cdn/shop/files/icon-global-01.png?v=1597333883);
//background: url(//cdn.shopify.com/s/files/1/0021/1514/1731/files/icon-nextday.svg?242150);
}
.usp-icon-3::before{
background: url(/cdn/shop/files/icon-signup2.svg?v=1618307825);
//background: url(/cdn/shop/files/icon-student-01_b40d4ca0-8dae-45b9-9cfd-772bbefa541d.png?v=1597335135);
//background: url(/cdn/shop/files/icon-info-01.png?v=1597328625);
}
//========= END Announcement Bar =========//
//========= Mobile Nav =========//
.subnav-blog::before,
.subnav-editorial::before,
.subnav-my-account::before,
.subnav-faqs::before,
.subnav-contact-us::before,
.subnav-size-guide::before,
.subnav-login::before {
width: 21px;
height: 21px;
content: '';
display: inline-block;
background-repeat: no-repeat!important;
vertical-align: text-top;
margin-left: 15px;
margin-top: -3px;
}
.mobile-nav__link--top-level {
font-size: 1.5em;
text-transform:uppercase;
}
.mobile-nav>.mobile-nav__item .mobile-nav__child-item .mobile-nav__faux-link{font-size: 1.2em!important;text-transform:uppercase;}
.mobile-nav>.mobile-nav__item .mobile-nav__child-item .mobile-nav__link{font-size: 1.2em!important;text-transform:uppercase;}
.mobile-nav>.mobile-nav__item .mobile-nav__sublist .mobile-nav__grandchildlist .mobile-nav__link{font-size: 1.2em!important;text-transform:uppercase;}
.mobile-nav>.mobile-nav__item .mobile-nav__sublist{ padding-left:.5rem;}
.mobile-nav>.mobile-nav__item--secondary {
background: $grey;
.mobile-nav__link {
font-size: .8rem;
vertical-align: middle;
}
.grid__item {
padding: 5px 17px;
}
}
.subnav-blog::before {
background: url(/cdn/shop/files/icon-op-logo.svg?4465);
padding-right: 28px;
height: 24px;
}
.subnav-editorial::before {
background: url(//cdn.shopify.com/s/files/1/0021/1514/1731/files/icon-far-logo.svg?245139);
padding-right: 28px;
height: 24px;
}
.subnav-my-account::before {
background: url(//cdn.shopify.com/s/files/1/0021/1514/1731/files/icon-account.svg?245121);
padding-right: 28px;
}
.subnav-faqs::before {
background: url(//cdn.shopify.com/s/files/1/0021/1514/1731/files/icon-faq.svg?245025);
padding: 14px;
}
.subnav-contact-us::before {
background: url(//cdn.shopify.com/s/files/1/0021/1514/1731/files/icon-contact.svg?245136);
padding: 14px;
}
.subnav-size-guide::before {
background: url(//cdn.shopify.com/s/files/1/0021/1514/1731/files/icon-sizeguide.svg?245132);
padding: 14px;
}
.subnav-login {
display: none;
}
.subnav-login::before {
background: url(//cdn.shopify.com/s/files/1/0021/1514/1731/files/icon-account.svg?242247);
}
//========= END Mobile Nav =========//
/* Scss Document */
//========= Header (one block) fix =========//
.announcement-link{
height: auto;
.announcement-text{
width: 100%;
white-space: normal;
span{
display: block;
@include media-query($medium-up) {
display: inline-block;
}
}
}
}
//========= END Header (one block) fix =========//
.template-index .flex-grid .type-banner{
margin: 5px 0;
padding: 0 5px;
}