/* Theme Name: Storefront Child Theme Theme URI: https://github.com/stuartduff/storefront-child-theme Author: Stuart Duff Author URI: http://stuartduff.com Template: storefront Description: This is a blank child theme for WooThemes StoreFront theme Version: 1.0.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: storefront Tags: black, white, light, two-columns, left-sidebar, right-sidebar, responsive-layout, custom-background, custom-colors, custom-header, custom-menu, featured-images, full-width-template, threaded-comments, accessibility-ready This theme, like WordPress, is licensed under the GPL. Use it to make something cool, have fun, and share what you've learned with others. Storefront is based on Underscores http://underscores.me/, (C) 2012-2014 Automattic, Inc. Resetting and rebuilding styles have been helped along thanks to the fine work of Eric Meyer http://meyerweb.com/eric/tools/css/reset/index.html along with Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/ FontAwesome License: SIL Open Font License - http://scripts.sil.org/OFL Images License: GNU General Public License v2 or later */ /* * Add your own custom css below this text. */ /* - - - - - - - - - GLOBAL - START - - - - - - - - */ @import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@300;400;600;700&display=swap'); body {font-family: 'Nunito Sans', sans-serif; font-weight: 300; color: #191919; background: #fcfbf9} body.woocommerce #primary {float: none; width: 100%} button, .button, input {font-family: 'Nunito Sans', sans-serif; border-radius: 3px!important} b, strong {font-weight: 700} .elementor-widget:not(:last-child) {margin-bottom: 0!important} .no-margin-para p {margin-bottom: 0} a {color: #293586} a:focus, input:focus, textarea:focus, button:focus {outline: none} .terms-txt h1 {font-weight: 600} .terms-txt h2 {font-weight: 600; font-size: 26px; margin: 35px 0 10px} .terms-txt p {font-size: 14px; line-height: 1.3} #page {position: relative} /* header - start */ .header-top-wrapper {position: relative} .fixed-header-top {position: absolute; left: 0; right: 0; margin: 0!important} .fixed-header-top.header-top a, .fixed-header-top.header-top a .svg-icon {color: #FFFFFF} .site-header {border-bottom: none; margin-bottom: 0!important; background: #fcfbf9} .site-header .site-branding {margin-bottom: 38px} .header-top {padding: 15px 30px 0; max-width: 100%} .header-top .svg-icon {display: inline-block; width: 15px; height: 15px; text-align: center; line-height: 1} .header-top .cover__directions .svg-icon {width: 13px; height: 13px} .header-top > div {float: right; padding-left: 20px; font-weight: 600} .header-top a {color: #000000} .main-navigation ul li a {font-weight: 400} #sog-search-btn, #sog-cart-btn {position: fixed; top: 75px; right: 20px; z-index: 1000; border: 1px solid #e6e5e5; box-shadow: 0 2px 10px 0 rgb(0 0 0 / 15%); background-color: #fff; padding: 15px; border-radius: 40px} .home #sog-search-btn, .home #sog-cart-btn {top: 25px; position: absolute} #sog-search-btn a, #sog-cart-btn a {width: 36px; height: 36px; display: block; color: #191919} #sog-cart-btn {top: 165px} .home #sog-cart-btn {top: 110px} #sog-cart-count {position: absolute; top:0; right: 0; color: #FFFFFF; background: #273583; border-radius: 50%; display: block; width: 20px; height: 20px; font-size: 11px; font-weight: 700; text-align: center; line-height: 20px} #sog-search-wrapper {max-width: 400px; margin: 0 auto} @media only screen and (min-width: 768px) { .main-navigation ul.menu, .main-navigation ul.nav-menu {padding-left: 15px; padding-right: 15px; padding-bottom: 35px} .main-navigation ul.menu>li>a, .main-navigation ul.nav-menu>li>a {padding: 0.4em 1em} .woocommerce-active .site-header .site-branding {width: 100%; float: none; margin-right: 0} .site-header .site-branding img {margin-left: auto; margin-right: auto; max-width: 300px} .woocommerce-active .site-header .site-search {display: none} .woocommerce-active .site-header .main-navigation {width: 100%; float: none; margin-right: 0; text-align: center} .woocommerce-active .site-header .site-header-cart {display: none} } @media only screen and (max-width: 1024px) { #sog-search-btn {top: 90px} .home #sog-search-btn {top: 25px} #sog-cart-btn {top: 175px} .home #sog-cart-btn {top: 110px} } @media only screen and (max-width: 767px) { .site-header {padding-bottom: 0} .site-header button.menu-toggle {margin-top: 22px} .header-top {font-size: 12px} .header-top > div {padding-left: 15px} .header-top .svg-icon {width: 9px; height: 9px} .header-top .cover__directions .svg-icon {width: 8px; height: 8px} } @media only screen and (max-width: 480px) { .header-top {padding: 15px 15px 0} .home #sog-search-btn, #sog-search-btn, .home #sog-cart-btn, #sog-cart-btn {top: auto; bottom: 10px; right: 10px; padding: 10px} #sog-search-btn a, #sog-search-btn a svg, #sog-cart-btn a, #sog-cart-btn a svg {width: 20px; height: 20px} .home #sog-cart-btn, #sog-cart-btn {bottom: 65px} #sog-cart-count {top:-3px; right:-3px; width: 18px; height: 18px; font-size: 10px; line-height: 18px} } /* header - End */ /* footer - start */ #sog-footer-btns-wrapper {padding-bottom: 30px; border-bottom: solid 3px #e6e5e5; margin-bottom: 45px} #sog-footer-btns {display: flex; flex-wrap: nowrap; align-items: flex-start; justify-content: center; width: 100%; margin-right: auto; margin-left: auto; padding: 0; list-style: none} #sog-footer-btns .ec-footer__cell {width: 150px; padding-bottom: 20px; text-align: center} #sog-footer-btns .ec-footer__link {max-width: 100%; padding: 0 10px; line-height: 1.2; text-align: center; word-wrap: break-word; display: inline-block; color: #757575} #sog-footer-btns .svg-icon {display: flex; align-items: center; justify-content: center; height: 24px; margin-bottom: 5px} .location-txt h3 {font-size: 16px; font-weight: 700; color: #000000} .location-txt-opening-hours p {margin-bottom: 10px} #contact-us-html .data {text-align: center} #contact-us-html .data > div {display: inline-block; padding: 0 12px 10px} #contact-us-html .data a {color: #000000; font-weight: 400} #contact-us-html .data .icon {margin-right: 3px} #contact-us-html .channels {text-align: center; padding-top: 30px} #contact-us-html .facebook {display: inline-block} #contact-us-html .facebook a {display: flex; align-items: center; text-align: left; position: relative; font-weight: 600; margin: 0 18px; word-wrap: break-word; max-width: 100%; transition: opacity .1s ease-in-out 0s; color: #000000} #contact-us-html .facebook a:before {background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'%3E%3Cpath fill='%233B5998' fill-rule='evenodd' d='M48 45c0 1.656-1.344 3-3 3H3c-1.656 0-3-1.344-3-3V3c0-1.656 1.344-3 3-3h42c1.656 0 3 1.344 3 3v42zm-15 3V30h6l1.5-7.5H33v-3c0-3 1.503-4.5 4.5-4.5h3V7.5h-6c-5.512 0-9 4.322-9 10.5v4.5h-6V30h6v18H33z'/%3E%3C/svg%3E"); width: 24px; height: 24px; min-width: 24px; margin: 0 8px 0 0; content: ""; display: block; background-size: contain; background-repeat: no-repeat; background-position: center center} /* footer - end */ /* popup - start */ .hover_bkgr_sog {background:rgba(0,0,0,.75); cursor:pointer; display:none; height:100%; position:fixed; text-align:center; top:0; width:100%; z-index:10000 } .hover_bkgr_sog .helper {display:inline-block; height:100%; vertical-align:middle} .hover_bkgr_sog > div {background-color: transparent; display: inline-block; height: auto; max-width: 400px; vertical-align: middle; width: 100%; position: relative; padding: 35px 0 40px; text-align:left} .hover_bkgr_sog > div form {box-shadow: 10px 10px 60px #555} .popupCloseButton {background-color: #FEDB78; cursor: pointer; display: inline-block; font-weight: 300; position: absolute; top: 0px; right: 0px; font-size: 18px; line-height: 28px; width: 26px; height: 28px; text-align: center; color:#000000} .popupCloseButton:hover {background-color: #fff590} .aws-container .aws-search-field {font-size: 16px; padding: 6px 10px} @media only screen and (max-width: 480px) { .hover_bkgr_sog > div {max-width: 320px} } /* popup - end */ /* - - - - - - - - - GLOBAL - END - - - - - - - - - */ /* - - - - - - - - - HOMEPAGE - START - - - - - - - - */ #sog-homepage-content {background: url(img/homepage-bg.jpg) no-repeat center center; background-size: cover; color: #FFFFFF; text-align: center; padding: 0 30px; height:100vh} #sog-homepage-content-table {display: table; vertical-align: middle; height: 100%; width: 100%} #sog-homepage-content-cell {display: table-cell; vertical-align: middle; height: 100%; width: 100%} #sog-homepage-content-cell > img {display: inline-block; width: 400px; height: auto; margin-bottom: 30px} #sog-homepage-content h1 {color: #FEDB78; font-size: 51px; line-height: 1.1; font-weight: 700; max-width: 820px; margin: 0 auto 30px} #sog-homepage-content p {font-size: 21px; max-width: 820px; margin: 0 auto 30px; line-height: 1.35} #sog-homepage-content p.separator {font-size: 16px} #sog-homepage-content button {background: #FEDB78; font-size: 18px; border-radius: 4px; margin: 20px 0} #sog-homepage-content .arrow {color: #FFFFFF} #hp-links {display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 15px} #hp-links a {display: flex; border-radius: 3px; color: #FFFFFF; text-decoration: none; text-align: center; font-size: 21px; font-weight: 700; min-height: 250px; line-height: 1.3; background-size: cover} #hp-links a > span {width: 100%; height: 100%; display: flex; align-items: flex-end; padding: 15px; background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.55) 100%); justify-content: center} #hp-links a > span > span {transition: transform 0.4s ease-out} #hp-links a:hover > span > span {transform: translateY(-5px); transition: transform 0.4s ease-out} @media only screen and (max-height: 900px) { #sog-homepage-content {height: auto; padding: 45px 30px} } @media only screen and (max-width: 1024px) { #hp-links {grid-template-columns: 1fr 1fr 1fr} } @media only screen and (max-width: 767px) { #sog-homepage-content h1 {font-size: 30px} #sog-homepage-content p {font-size: 17px} #hp-links {grid-template-columns: 1fr 1fr} } @media only screen and (max-width: 480px) { #sog-homepage-content {padding: 60px 30px 35px} #sog-homepage-content-cell > img {margin-bottom:20px} #sog-homepage-content h1 {font-size: 24px; margin-bottom: 20px} #sog-homepage-content p {font-size: 16px; margin-bottom: 20px} #hp-links {grid-template-columns: 1fr} } /* - - - - - - - - - HOMEPAGE - END - - - - - - - - - */ /* - - - - - - - - - SHOP - START - - - - - - - - */ .woocommerce-message {position: fixed; top: 30px; right: 30px; z-index: 1000; margin: 0!important} .storefront-breadcrumb {display: none} .woocommerce-products-header__title {font-weight: 700; font-size: 30px} .page-template-template-fullwidth-php .site-main ul.products.columns-4 li.product-category {width: 23%; margin-right: 2%} .page-template-template-fullwidth-php .site-main .elementor-products-grid ul.products.columns-4 li.product {width: 100%} ul.products li.product-category {display: block; border-radius: 4px} ul.products li.product-category a {position: relative; width: 100%; display: block; border: solid 1px rgba(0,0,0,0.1); color:#FFFFFF} ul.products li.product-category a:before {position: absolute; width: 100%; height: 100%; background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.1) 55%, rgba(0,0,0,0.4) 100%); content: ''; left: 0} ul.products li.product-category a img {margin-bottom: 0!important; opacity: 1; border-radius: 0} ul.products li.product .woocommerce-loop-category__title {position: absolute; bottom: 10px; width: 100%; color: #FFFFFF; text-shadow: 0 1px 1px rgb(0 0 0 / 25%); font-size: 20px; font-weight: 700; line-height: 1.25; padding: 0 15px} ul.products li.product .woocommerce-loop-category__title mark {display: none} .elementor-shortcode ul.products {display: grid; grid-template-columns: repeat(4,1fr); grid-column-gap: 20px; grid-row-gap: 20px} .elementor-shortcode ul.products:before {display: none} .elementor-shortcode ul.products > li {width: 100%!important; margin: 0!important} ul.products li.product img {margin-bottom: 15px} ul.products li.product .woocommerce-loop-product__title {margin-bottom: 0} ul.products li.product .price {margin-bottom: 0; font-size: 22px; color: #000000} ul.products li.product .price ins .amount {font-weight: 700} ul.products li.product .price del+ins {margin-left: 6px} ul.products li.product .add_to_cart_button {display: none} .onsale {background: #fe9800; color: #FFFFFF; border: none; border-radius: 0; padding: 3px 7px 2px!important; font-size: 14px} ul.products li.product span.onsale {position: absolute; top: 10px; right: 0!important; left: auto!important; display: inline-block!important} .product h1.entry-title {font-size: 26px; font-weight: 600} .single-product div.product p.price {font-size: 26px; margin: 20px 0} .product .price ins {color: #000000} .storefront-sticky-add-to-cart {color: #000000} .woocommerce-MyAccount-navigation ul {list-style: none; margin-left: 0} .single-product div.product .product_meta {display: none} .variations input[type="radio"]:disabled + label {opacity: 0.3} @media only screen and (max-width: 1024px) { .elementor-shortcode ul.products {grid-template-columns: repeat(3,1fr)} } @media only screen and (max-width: 767px) { .elementor-shortcode ul.products {grid-template-columns: repeat(2,1fr)} ul.products {grid-template-columns: 1fr 1fr; display: grid; column-gap: 30px} ul.products:after, ul.products:before {display: none} } @media only screen and (max-width: 480px) { ul.products li.product .woocommerce-loop-category__title {font-size: 17px} .woocommerce-message {left:15px; right: 15px; padding: 1em; font-size: 13px} .woocommerce-message:before {display: none} .woocommerce-message a:after {display: none} } /* - - - - - - - - - SHOP - END - - - - - - - - - */ /* Hide Select Option Button in products list - START */ .product_type_variable { display: none; } /* Hide Select Option Button in products list - END */ /* - - - - - - - - - KILT MEASUREMENTS PAGE & CAT PAGE - START - - - - - - - - */ #kilt-measurements-txt h2 {font-size: 21px; text-transform: uppercase; margin-top: 45px} #kilt-measurements-txt .elementor-widget-container h2:first-of-type {margin-top: 0} .term-kilt-hire .term-description {display: none} #kilt-cat-desc {text-align: center} #kilt-cat-desc > p > a {font-weight: 700; font-size: 28px; color: #1a7ac4} #kilt-cat-img-link {display: flex; width: 100%; justify-content: center; padding: 8px 0 45px} #kilt-cat-img-link a {position: relative; max-width: 300px; width: 100%; border: solid 1px #444444} #kilt-cat-img-link a:before {position: absolute; width: 100%; height: 100%; background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(255,255,255,1) 100%); content: ''; left: 0; z-index: 1} #kilt-cat-img-link a span {position: absolute; width: 70%; bottom: 10px; display: block; color: #191919; font-size: 24px; z-index: 2; margin: 0 auto; left: 15%; right: 15%; font-weight: 700; line-height: 1.2} /* - - - - - - - - - KILT MEASUREMENTS PAGE & CAT PAGE - END - - - - - - - - - */