/* Font Code */ @import url(https://fonts.googleapis.com/css?family=Montserrat:700,600); @import url(https://fonts.googleapis.com/css?family=PT+Sans:700); /* @end --------- */ body { background-color:#fff; color:#333; font-family:Arial,"Helvetica Neue",Helvetica,sans-serif; text-rendering:optimizeLegibility; } .static { position:static !important; } /* Root element styles */ a { color:#333; text-decoration: underline; outline:none; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; transition:all 0.3s; } #main-header a, #breadcrumbs-bar a, #footer-menu a, #footer-boxes a, .banner-content a { text-decoration:none; } a:focus { outline:none; color:#333; text-decoration:none; } .phone a:focus { outline:none; outline:5px auto -webkit-focus-ring-color; outline-offset:-2px; text-decoration:none; } a:hover { color:#333; text-decoration:none; outline:none; } a:active { outline:none; text-decoration:none; } .block-link { display:block; } sub, sup { position:relative; font-size:75%; line-height:0; vertical-align:baseline; } sup { top:-0.5em } sub { bottom:-0.25em } img { border:0 } .img-rounded { border-radius:500px } .img-polaroid { padding:4px; background-color:#fff; border:1px solid #ccc; border:1px solid rgba(0,0,0,0.2); -webkit-box-shadow:0 1px 3px rgba(0,0,0,0.1); -moz-box-shadow:0 1px 3px rgba(0,0,0,0.1); box-shadow:0 1px 3px rgba(0,0,0,0.1); } .img-circle { border-radius:500px } /* Text */ p { margin:0 0 10px; line-height:1.6em; color:#666; font-size:15px; } .lead { color:#999; font-style:italic; font-weight:200; font-size:15px; } .align-right { text-align:right; } small { font-size:85% } strong { font-weight:bold } em { font-style:italic } cite { font-style:normal } h1, h2, h3, h4, h5, h6, .title { margin:10px 0; font-family:inherit; font-family:'Montserrat', sans-serif; line-height:1.4em; font-weight:bold; } h1 small, h2 small, h3 small, h4 small, h5 small, h6 small { font-weight:normal; line-height:1; color:#999; } h6 small > a { color:#999 } h1, .h1 { color:#001412; font-size:30px; text-transform:uppercase; display:block; line-height:1.2em; } body h1:first-child { margin-top:0 } body.home h1 { margin-top:50px; margin-bottom:0; } h2, .h2 { font-size:30px; line-height:1.2em; text-transform:uppercase; } h3, .h3 { font-size:24.5px; line-height:1.4em; text-transform:uppercase; } h4, .h4 { font-size:17.5px; text-transform:uppercase; } h5, .h5 { font-size:14px; text-transform:uppercase; } h6, .h6 { font-size:11px } .title { display:block; } .bold { font-weight: bold;} /* Colours */ .yellow { color:#ffc000; } .grid-wrap h3 span{color:#ffc000;} .dark-grey {color: #333333} /* Backgrounds */ .grey-bg { background:#f4f4f4; } .dark-bg { background:#2d2d2d; } /* Lists */ ul, ol { padding:0; margin:0 0 10px 25px; } li { line-height:20px } ul.unstyled, ol.unstyled { margin-left:0; list-style:none; } ul.inline, ol.inline { margin-left:0; list-style:none; } ul.inline>li, ol.inline>li { padding-right:5px; padding-left:5px; } dl { margin-bottom:20px } dt, dd { line-height:20px } dt { font-weight:bold } dd { margin-left:10px } hr { margin:20px 0; border:0; border-top:1px solid #eee; border-bottom:1px solid #fff; } /* @end Root */ /* Table styles */ table { } .table { } .table th, .table td { } .table th { } .table thead th { } .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td { text-transform:uppercase } /* @end Table */ /* ****** Captcha */ .captcha-area { *zoom:1; margin-bottom:10px; } .captcha-area:before, .captcha-area:after { content:" "; display:table; } .captcha-area:after { clear:both } #captcha-reload { float:left; width:345px; margin-right:10px; } .captchaimg { height:36px; width:160px; border-radius:5px; background:#666; float:left; } .captchaimg img { border-radius:5px } #CaptchaV2 { height:37px; border-radius:5px; border:1px solid #ccc; float:left; margin-left:10px; text-align:center; font-size:21px; } #CaptchaV2:focus { } #reload-captcha { height:37px; float:left; } /* @end --------- */ /* Social */ .social-likes { margin:15px 0; padding:10px 0; border:1px solid #f5f5f5; border-left:0 none; border-right:0 none; } .social-likes li { display:inline-block; list-style:none; position:relative; } .twitter { } .fb-like span { position:absolute; left:0; top:4px; } #sidebar .fb-page { margin:40px 0; } .social-icon { max-width: 32px; } .social-articles {border: none;} .social-share { display: flex; align-items: center; background: #f9f9f9; padding: 20px 13px; margin-top: 40px;} .social-share-icons {margin-left: 20px; margin-top: 3px;} .social-share-icons svg {fill:#ffc000; } .social-share svg { margin-right: 6px;} /* @end --------- */ /* Form Style */ form { } form fieldset { margin:15px 0; } form legend { border:0 none } form legend small { display:block; color:#999; } .form-control,.rendered-form .form-control,textarea.ooc_aq,#form-box input,#form-box textarea,#form-box select {padding: 6px 12px;width:100%; height:56px; border:1px solid #ececec; font-size:13px; color:#999; border-radius:0; box-shadow:none; margin-bottom:20px; } #form-box textarea ,textarea.ooc_aq{ height: 120px; } textarea.ooc_aq:focus{outline:0;} .rendered-form .form-group{margin-bottom:0px !important;} .form-control:focus { color:#333; } .form-control::-webkit-input-placeholder { color:#bcbcbc; } .form-control:-moz-placeholder { color:#bcbcbc; } .form-control::-moz-placeholder { color:#bcbcbc; } .form-control:-ms-input-placeholder { color:#bcbcbc; } .form-control:-placeholder { color:#bcbcbc; } select.form-control { padding:8px 12px 6px 12px } input[type="checkbox"] { border-radius:0; border:1px solid #ccc; } input[type="radio"], select { cursor:pointer } label { font-weight:normal; font-style:italic; } input[type=radio] { cursor:pointer } select.form-control { font-weight:normal } textarea.form-control { height:120px; } .form-item { margin-bottom:15px } .form-notice { padding:0; margin-bottom:12px; font-size:12px; color:#999; line-height:1.4em; } input[type="search"]::-ms-clear { display:none } input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-results-button, input[type="search"]::-webkit-search-results-decoration { display:none } /* @end --------- */ /* Crumbs */ .crumbs { color:#666; font-size:12px; line-height:12px; text-transform:uppercase; font-weight:bold; } .crumbs > a { color:#666 } .crumbs > a:hover { text-decoration:none; color:#d7df3a; } /* @end --------- */ /* Modals */ .modal-overlay { position:fixed; top:0; left:0; right:0; bottom:0; z-index:-1; background-color:rgba(255, 255, 255, 0.7); -webkit-backface-visibility:hidden; backface-visibility:hidden; pointer-events:none; opacity:0; -webkit-transition:opacity .5s; transition:opacity .5s; } .modal-overlay.active { opacity:1; pointer-events:all; z-index:1000; } .modal { background:transparent; position:absolute; z-index:-1; top:50vh; width:80vw; max-width:80rem; margin:0 auto; -webkit-perspective:1000; opacity:0; overflow-y:auto; pointer-events:none; -webkit-transform: translate3d(0, 0, 0) translateZ(0) translateY(-50%); transform: translate3d(0, 0, 0) translateZ(0) translateY(-50%); -webkit-backface-visibility:hidden; backface-visibility:hidden; -webkit-transition:opacity .5s, -webkit-transform .5s; transition:opacity .5s, transform .5s; } .videopopup .modal{max-width:560px;} .modal-wrapper { width:100%; position:relative; pointer-events:none; } .modal-content { width:100%; height:100%; padding:40px; -webkit-border-radius:0; -moz-border-radius:0; border-radius:0; box-shadow:none; } .modal-close1 { padding:6px 12px; overflow:hidden; font-style:normal; font-size:16px; font-weight:700; position:absolute; top:0; right:0; color:#fff; opacity:0; pointer-events:none; display:block; text-align:center; background:#ccc; border:1px solid #ccc; -webkit-transform:translateY(0) translate3d(0, 0, 0) translateZ(0); transform:translateY(0) translate3d(0, 0, 0) translateZ(0); -webkit-backface-visibility:hidden; cursor:pointer; backface-visibility:hidden; z-index:-1; -webkit-transition:all 0.5s linear 0s; transition:all 0.5s linear 0s; text-transform:uppercase; font-family:"PT Sans",sans-serif; } .modal-close1:hover, .modal-close1:focus { cursor:pointer; background:#333; border-color:#333; } .need-help { text-decoration:underline; color:#333; } .modal.active,.modal.show { pointer-events:auto; opacity:1; z-index:1001; display:block; } .modal.active .modal-wrapper, .modal.active .modal-content, .modal.active .modal-close1 { pointer-events:all !important; } .modal-overlay.active .modal-close1 { opacity:1; z-index:1005; } #large-product-modal .modal { top:70px; } #large-product-modal .modal-content > img { width:100% height:auto; display:block; margin:0 auto; } #services-modal .modal-title { font-size:30px; } /* @end --------- */ /* Pagination */ .pager { } .pagination-block { } .pagination { color:#333; color:#333; font-size:17px; font-family:'PT Sans', sans-serif; font-weight:bold; width:100%; text-align:right; } .pagination:before, .pagination:after { content:" "; display:table; } .pagination:after { clear:both } .pagination { *zoom:1 } .pagination > li { display:inline-block; } .pagination > li > a, .pagination > li > span { border-color:#333; color:#333; margin:0; } .pagination > li:last-child > a, .pagination > li:last-child > span { border-radius:0 } .pagination > li:first-child > a, .pagination > li:first-child > span { border-radius:0 } li.pag-current { padding:6px 12px; border:1px solid #d9dee1; background-color:#dae3e8; color:#415a68; } .pagination > li.page-numbers #pagination { border:0; } .pagination > li.page-numbers #pagination:hover { background:transparent; color:#333; } .pagination > li > a:focus, .pagination > li > a:hover, .pagination > li > span:focus, .pagination > li > span:hover { color:#333; } /* Buttons */ .btn { border-radius:0; /*padding:11px 12px 8px;*/ padding:6px 12px; text-transform:uppercase; font-weight:700; color:#333; font-size:16px; font-family:'PT Sans', sans-serif; -webkit-transition:all 0.5s linear; -moz-transition:all 0.5s linear; -o-transition:all 0.5s linear; transition:all 0.5s linear; letter-spacing:0.02em; text-decoration: none; } .btn-default { background-color:#ffc000; border-color:transparent; } .btn-default:hover, .btn-default:active { background-color:#333; border-color:transparent; color:#fff; } .btn-primary { background-color:#ccc; border-color:#ccc; } .btn-primary:hover, .btn-primary:active { background-color:#666; border-color:#666; color:#fff; } .btn-inverse { background-color:#666; color:#fff; } .btn-inverse:hover, .btn-inverse:active { background-color:#878787; color:#fff; } .btn-mid-grey { background-color:#999; color:#fff; } .btn-mid-grey:hover, .btn-mid-grey:active { background-color:#666; border-color:#666; color:#fff; } .btn-success { background-color:#67a74b; color:#fff; } .btn-success:hover, .btn-success:active { background-color:#333; color:#fff; border-color:transparent; } .btn-white { border-color:#fff; color:#fff; } .btn-white:hover { border-color:#ffc000; background:#ffc000; } .btn-dark { border-color:#333; color:#333; } .btn-dark:hover { border-color:#ffc000; background:#ffc000; } .btn-outline { background-color:transparent; } .btn-outline:hover, .btn-outline:active, .btn-outline:focus { background:#333; border-color:transparent; color:#fff; } .btn-inverse.btn-outline { border-color:#333; color:#333; } .btn-success.btn-outline:hover, .btn-success.btn-outline:active, .btn-success.btn-outline:focus { border-color:#ffc000; color:#fff; } .btn-rounded { position:relative; color:#666; font-size:12px; font-weight:bold; border:1px solid #ccc; padding:5px 10px; border-radius:50px; background:#fff; } .btn-rounded:hover { background:#f0f0f0; } .btn-down-arrow::before, .btn-down-arrow::after { display:inline-block; position:absolute; top:50%; content:""; transform-origin:50% 50% 0px; height:2px; margin-top:-1px; background:#666; width:7px; padding:10px 30px 10px 10px; } .btn-down-arrow::before { right:18px; transform:rotate(45deg); } .btn-down-arrow::after { right:13px; transform:rotate(-45deg); } .btn-rounded.btn-down-arrow { margin-right:40px; } .btn-lg { line-height:1.5em; padding:15px 40px; } /* Custom Animation Sets */ .hover-opacity { -webkit-transition:opacity 0.3s linear; -moz-transition:opacity 0.3s linear; -o-transition:opacity 0.3s linear; transition:opacity 0.3s linear; } .base-animation { -webkit-transition:all 0.3s linear; -moz-transition:all 0.3s linear; -o-transition:all 0.3s linear; transition:all 0.3s linear; } @keyframes smallBounce { 0%, 20%, 60%, 100% { -webkit-transform:translateY(0); transform:translateY(0); } 40% { -webkit-transform:translateY(-5px); transform:translateY(-5px); } 80% { -webkit-transform:translateY(-2px); transform:translateY(-2px); } } @keyframes menuBounce { 0%, 20%, 60%, 100% { -webkit-transform:translateY(0); transform:translateY(0); } 40% { -webkit-transform:translateY(-25px); transform:translateY(-25px); } 80% { -webkit-transform:translateY(-12px); transform:translateY(-12px); } } @keyframes pulsing { 0% { transform:scale(1); } 50% { transform:scale(1.1); } 100% { transform:scale(1); } } /* @end --------- */ /* **************** General Styles **************** */ /* Main components */ /*main, header { -webkit-transform:translateZ(0px); -moz-transform:translateZ(0px); -ms-transform:translateZ(0px); -o-transform:translateZ(0px); transform:translateZ(0px); will-change:transform; } main, header, header > .container { position:relative; -webkit-transition:-webkit-transform 0.3s; -moz-transition:-moz-transform 0.3s; transition:transform 0.3s; } */ main { background:#fff; min-height:100vh; z-index:2; } #main-header { height:116px; background:#fff; z-index:3; } #main-header > .container { position:relative; } /* Class if you want fixed nav */ .nav-is-fixed header { position:fixed; top:0; left:0; width:100%; } .header-buttons { position:absolute; display:inline-block; top:0; right:15px; padding:0; margin:0; z-index:4; } .header-buttons li { display:inline-block; } .nav-trigger { width:32px; height:50px; line-height:50px; position:relative; display:block; overflow:hidden; white-space:nowrap; z-index:3; } .search-trigger { display:block; width:43px; height:50px; line-height:50px; text-align:center; overflow:hidden; font-size:17px; color:#666; } .search-trigger:hover, .search-trigger:focus { color:#ccc; } .nav-trigger .line { width:100%; height:3px; display:block; background:#666; position:absolute; left:0; right:0; border-radius:4px; -webkit-transition:all 0.4s; -moz-transition:all 0.4s; transition:all 0.4s; } .nav-trigger .line.line-1 { top:30%; } .nav-trigger .line.line-2 { top:50%; } .nav-trigger .line.line-3 { top:70%; } .nav-trigger:hover .line { color:#ccc; } .nav-trigger.nav-is-visible .line-1 { transform:translateY(10px) translateX(0) rotate(45deg); -webkit-transform:translateY(10px) translateX(0) rotate(45deg); -moz-transform:translateY(10px) translateX(0) rotate(45deg); } .nav-trigger.nav-is-visible .line-2 { opacity:0; } .nav-trigger.nav-is-visible .line-3 { transform:translateY(-11px) translateX(0) rotate(-45deg); -webkit-transform:translateY(-11px) translateX(0) rotate(-45deg); -moz-transform:translateY(-11px) translateX(0) rotate(-45deg); } .primary-nav, .primary-nav ul { position:fixed; top:0; right:0; height:100%; width:100%; background:#ffc000; overflow:auto; -webkit-overflow-scrolling:touch; z-index:3; -webkit-transform:translateZ(0px); -moz-transform:translateZ(0px); -ms-transform:translateZ(0px); -o-transform:translateZ(0px); transform:translateZ(0px); -webkit-transform:translateX(0px); -moz-transform:translateX(0px); -ms-transform:translateX(0px); -o-transform:translateX(0px); transform:translateX(0px); -webkit-transition:-webkit-transform 0.3s; -moz-transition:-moz-transform 0.3s; transition:transform 0.3s; } .primary-nav a, .primary-nav ul a { display:block; height:49px; line-height:49px; padding:0 20px; color:#666; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; overflow:hidden; white-space:nowrap; border-bottom:1px solid #d3d1c8; -webkit-transform:translateZ(0px); -moz-transform:translateZ(0px); -ms-transform:translateZ(0px); -o-transform:translateZ(0px); transform:translateZ(0px); will-change:transform, opacity; -webkit-transition:-webkit-transform 0.3s, opacity 0.3s; -moz-transition:-moz-transform 0.3s, opacity 0.3s; transition:transform 0.3s, opacity 0.3s; } .primary-nav.is-hidden, .primary-nav ul.is-hidden { -webkit-transform:translateX(100%); -moz-transform:translateX(100%); -ms-transform:translateX(100%); -o-transform:translateX(100%); transform:translateX(100%); } .primary-nav.moves-out > li > a, .primary-nav ul.moves-out > li > a { -webkit-transform:translateX(-100%); -moz-transform:translateX(-100%); -ms-transform:translateX(-100%); -o-transform:translateX(-100%); transform:translateX(-100%); opacity:0; } .primary-nav .see-all a { color:#000; } .primary-nav .nav-gallery .nav-item, .primary-nav .nav-icons .nav-item { height:80px; line-height:80px; } .primary-nav .nav-gallery .nav-item h3, .primary-nav .nav-icons .nav-item h3 { overflow:hidden; text-overflow:ellipsis; } .primary-nav .nav-gallery .nav-item { padding-left:90px } .primary-nav .nav-gallery .nav-item img { position:absolute; display:block; height:40px; width:auto; left:20px; top:50%; margin-top:-20px; } .primary-nav .nav-icons .nav-item { padding-left:75px } .primary-nav .nav-icons .nav-item p { color:#2e3233; font-size:1.3rem; display:none; } .primary-nav .nav-icons .nav-item::before { content:''; display:block; position:absolute; left:20px; top:50%; margin-top:-20px; width:40px; height:40px; background-repeat:no-repeat; background-position:center center; background-size:40px 40px; } .primary-nav .nav-icons .nav-item.item-1::before { background-image:url("../img/line-icon-1.svg") } .primary-nav .nav-icons .nav-item.item-2::before { background-image:url("../img/line-icon-2.svg") } .primary-nav .nav-icons .nav-item.item-3::before { background-image:url("../img/line-icon-3.svg") } .primary-nav .nav-icons .nav-item.item-4::before { background-image:url("../img/line-icon-4.svg") } .primary-nav .nav-icons .nav-item.item-5::before { background-image:url("../img/line-icon-5.svg") } .primary-nav .nav-icons .nav-item.item-6::before { background-image:url("../img/line-icon-6.svg") } .primary-nav .nav-icons .nav-item.item-7::before { background-image:url("../img/line-icon-7.svg") } .primary-nav .nav-icons .nav-item.item-8::before { background-image:url("../img/line-icon-8.svg") } .search { position:absolute; height:50px; width:100%; top:50px; left:0; z-index:3; opacity:0; visibility:hidden; -webkit-transition:opacity .3s 0s, visibility 0s .3s; -moz-transition:opacity .3s 0s, visibility 0s .3s; transition:opacity .3s 0s, visibility 0s .3s; } .search form { height:100%; width:100%; } .search input { border-radius:0; border:none; background:#f8f8f8; height:100%; width:100%; color:#666; padding:0 5%; box-shadow:none; -webkit-appearance:none; -moz-appearance:none; -ms-appearance:none; -o-appearance:none; appearance:none; } #search-field::-webkit-input-placeholder { color:#666; opacity:1; } #search-field::-moz-placeholder { color:#666; opacity:1; } #search-field:-moz-placeholder { color:#666; opacity:1; } #search-field:-ms-input-placeholder { color:#666; opacity:1; } #search-field:-placeholder { color:#666; opacity:1; } .search input:focus { outline:none } .search.is-visible { opacity:1; visibility:visible; -webkit-transition:opacity .3s 0s, visibility 0s 0s; -moz-transition:opacity .3s 0s, visibility 0s 0s; transition:opacity .3s 0s, visibility 0s 0s; } .nav-is-fixed .search { position:fixed } .search { height:auto; top:126px; background:#F8F8F8; } .search input { padding:2px 0 2px 15px; margin:25px 0; font-size:15px; font-weight:normal; border-left:1px solid #999; } .search input:focus { border:none; box-shadow:none; border-left:1px solid #999; } .search fieldset { margin:0; } .overlay { position:fixed; z-index:2; height:100%; width:100%; top:0; left:0; cursor:pointer; background-color:rgba(105, 170, 111, 0.8); visibility:hidden; opacity:0; -webkit-backface-visibility:hidden; backface-visibility:hidden; -webkit-transition:opacity 0.3s 0s, visibility 0s 0.3s, -webkit-transform 0.3s 0s; -moz-transition:opacity 0.3s 0s, visibility 0s 0.3s, -moz-transform 0.3s 0s; transition:opacity 0.3s 0s, visibility 0s 0.3s, transform 0.3s 0s; } .overlay.is-visible { opacity:1; visibility:visible; -webkit-transition:opacity 0.3s 0s, visibility 0s 0s, -webkit-transform 0.3s 0s; -moz-transition:opacity 0.3s 0s, visibility 0s 0s, -moz-transform 0.3s 0s; transition:opacity 0.3s 0s, visibility 0s 0s, transform 0.3s 0s; } /* support for no js */ .no-js .primary-nav { position:relative; height:auto; width:100%; overflow:visible; visibility:visible; z-index:2; } .no-js .search { position:relative; top:0; opacity:1; visibility:visible; } /* @end --------- */ /* Cart Summary */ #cart-summary { position:absolute; top:0; right:15px; z-index:10; display:block; width:47px; height:57px; text-align:center; background:#FFC000; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;} #cart-summary.cart-active { width:400px; border-radius:0; } #cart-summary-btn { position:absolute; z-index:11; display:block; overflow:hidden; cursor:pointer; -webkit-backface-visibility:hidden; backface-visibility:hidden; width:47px; height:57px; right:0; } .cart-active #cart-summary-btn { cursor:default; } #cart-summary-btn:focus { outline:none; } .itemno { width:18px; height:18px; padding:0; border-radius:50%; text-align:center; line-height:17px; font-size:9px; font-weight:bold; color:#333; overflow:hidden; position:absolute; top:10%; right:25%; background-color:#f4f4f4; } #cart-summary .title { display:none; margin:0; opacity:0; visibility:hidden; position:relative; line-height:56px; color:#024f2b; } #cart-summary.cart-active .title { opacity:1; visibility:visible; display:block; } .cart-text { display:block; padding:0.8em 0 0; color:#fff; font-weight:400; font-size:1.25em; } .cart-icon { display:block; margin:22px auto 0 auto; } #cart-summary-order { position:static; opacity:0; visibility:hidden; width:0px; text-align:right; pointer-events:none; border-top:5px solid #f5f5f5; padding-bottom:20px; } .cart-active #cart-summary-order { pointer-events:auto; background:#F9F9F9; width:400px; opacity:1; visibility:visible; } .cart-order-inner { position:relative; padding:0; opacity:0; } .cart-order-inner.empty { margin-top:20px; } .cart-head { padding:0 1em; text-align:left; display:none; } .cart-active .cart-head { display:block; } .cart-total { line-height:70px; } .cart-amount { color:#024f2b; font-size:16px; font-weight:bold; padding-right:10px; display:inline-block; font-weight:bold; } .cart-image { width:68px; height:68px; } .cart-product-name { text-transform:uppercase; font-size:13px; font-family:'PT Sans', sans-serif; } .cart-active .cart-order-inner { opacity:1; } .cart-close { position:absolute; top:1.5em; left:0.9em; overflow:hidden; width:20px; height:20px; border:none; background:transparent; color:transparent; text-indent:100%; opacity:0; backface-visibility:hidden; z-index:1; } .cart-close:focus { outline:none; } .cart-active .cart-close { opacity:1; } .cart-active .cart-close:hover { cursor:pointer; } #cart-summary .icon { position:absolute; top:0; left:0; color:#fff; text-indent:0; } #cart-summary .icon:hover { color:#426a98; } .cart-summary { margin:0 1em 1em 1em; color:#666; text-align:left; letter-spacing:1px; font-size:1em; line-height:1.5; min-width:80%; display:none; } .cart-active .cart-summary { display:block; } .cart-summary a { color:#333; } .cart-summary a:hover { color:#ffc000; } .cart-summary thead th, .cart-summary tfoot th { color:#024f2b; line-height:2.5; text-transform:none; } .cart-summary tbody tr:first-child td { padding-top:0.5em; } .cart-summary tbody td { padding:0.5em; font-weight:700; font-size:1.3rem; vertical-align:top; } .cart-summary tbody td:last-child, .cart-summary .cart-amount { font-family:"Helvetica Neue", Helvetica, Arial, sans-serif } .cart-summary tbody td span { color:#68676a; font-weight:400; } .cart-option { display:block; margin-top:1em; padding:0.5em 2em; border:none; text-transform:uppercase; font-weight:700; color:#fff; font-size:16px; font-family:'PT Sans', sans-serif; background:#024f2b; float:right; } .cart-option:hover { background:#ffc000; color:#333; } .cart-option-silent { background:none; color:#024F2B; font-weight:500; font-size:0.85em; } .cart-option-silent:hover { background:none; color:#333; } .cart-option:focus { outline:none; } .cart-active .cart-option { opacity:1; } .cart-summary .cart-remove { padding:3px 6px; overflow:hidden; font-style:normal; font-size:8px; font-weight:700; color:#fff; text-align:center; background:#ccc; border:1px solid #ccc; -webkit-backface-visibility:hidden; cursor:pointer; backface-visibility:hidden; text-transform:uppercase; font-family:"PT Sans",sans-serif; } .cart-summary .cart-remove:hover { background:#333; color:#fff; border-color:#333; } /* Header - Contact Number */ .contact-number .contact-phone, .contact-icon { float:right; font-size:24px; color:#024f2b; text-align:right; line-height:1em; margin:20px 70px 0 0; font-family:'', sans-serif; font-weight:bold; } .contact-number .contact-phone a { color:#024f2b; } .contact-number .contact-phone > span { display:block; color:#999; font-size:11px; text-transform:uppercase; font-family:'Montserrat', sans-serif; font-weight:bold; line-height:1.2em; } .contact-icon { display:none; } .contact-icon > a { color:#666; display:block; margin-top:10px; } .contact-icon > a > .fa { font-size:30px; padding:0 5px 0; } /* Header - Location */ #closest-location { float:right; margin-top:25px; color:#68676a; font-size:12px; } #closest-location span { display:inline-block; margin-right:30px; } #closest-location .location-label { margin:0; display:inline; } #closest-location .fa { font-size:16px; margin-right:5px; } .location-dropdown { position:relative; display:block; float:right; z-index:5; } #location-btn { position:relative; color:#fff; font-size:12px; font-weight:bold; background:#024f2b; padding:10px 30px 10px 10px; border-radius:50px; margin-right:40px; } #location-btn:before, #location-btn:after { display:inline-block; position:absolute; top:50%; content:""; transform-origin:50% 50% 0px; height:2px; margin-top:-1px; background:#fff; width:7px; } #location-btn:before { right:18px; transform:rotate(45deg); } #location-btn:after { right:13px; transform:rotate(-45deg); } #location-btn.active:before { transform:rotate(-45deg); } #location-btn.active:after { transform:rotate(45deg); } #location-btn:hover, #location-btn.active { background:#666; } #head-location-dropdown { position:absolute; z-index:2; background:#fff; padding:20px; top:41px; left:-50%; visibility:hidden; opacity:0; -webkit-transition:opacity .3s 0s, visibility 0s .3s; -moz-transition:opacity .3s 0s, visibility 0s .3s; transition:opacity .3s 0s, visibility 0s .3s; } #head-location-finder fieldset { border-bottom:1px solid #ccc; } #head-location-finder .title { display:block; color:#68676a; font-size:14px; margin-bottom:10px; font-weight:bold; } #head-location-finder .find-store { position:relative; } #head-location-finder .find-store > .sml-search { position:absolute; top:0; right:0; height:100%; } #head-location-dropdown.show { opacity:1; visibility:visible; -webkit-transition:opacity .3s 0s, visibility 0s 0s; -moz-transition:opacity .3s 0s, visibility 0s 0s; transition:opacity .3s 0s, visibility 0s 0s; } /* Search */ .search { position:absolute; height:auto; width:100%; top:126px; left:0; z-index:4; opacity:0; visibility:hidden; -webkit-transition:opacity .3s 0s, visibility 0s .3s; -moz-transition:opacity .3s 0s, visibility 0s .3s; transition:opacity .3s 0s, visibility 0s .3s; } .search form { height:100%; width:100%; } /*.search input { border-radius:0; border:none; background:#fff; height:100%; width:100%; padding:0 5%; box-shadow:inset 0 1px 0 #e2e3df, 0 3px 6px rgba(0, 0, 0, 0.05); -webkit-appearance:none; -moz-appearance:none; -ms-appearance:none; -o-appearance:none; appearance:none; }*/ .search input::-webkit-input-placeholder { color:#c9cbc4; } .search input::-moz-placeholder { color:#c9cbc4; } .search input:-moz-placeholder { color:#c9cbc4; } .search input:-ms-input-placeholder { color:#c9cbc4; } .search input:focus { outline:none; } .search.is-visible { opacity:1; visibility:visible; -webkit-transition:opacity .3s 0s, visibility 0s 0s; -moz-transition:opacity .3s 0s, visibility 0s 0s; transition:opacity .3s 0s, visibility 0s 0s; } .nav-is-fixed .search { position:fixed; } .search-close { position:absolute; top:50%; right:33px; font-size:20px; line-height:1.5em; color:#ccc; margin-top:-15px; } .search-close:hover { color:#666; } /* @end --------- */ /* Logo */ #logo { position:absolute; margin:0; padding:0; z-index:5; } #logo img { position:relative; display:block } /* @end --------- */ /* Overlay */ .overlay { position:fixed; z-index:2; height:100%; width:100%; top:126px; left:0; cursor:pointer; background-color:rgba(255, 255, 255, 0.7); visibility:hidden; opacity:0; -webkit-backface-visibility:hidden; backface-visibility:hidden; -webkit-transition:opacity 0.3s 0s, visibility 0s 0.3s, -webkit-transform 0.3s 0s; -moz-transition:opacity 0.3s 0s, visibility 0s 0.3s, -moz-transform 0.3s 0s; transition:opacity 0.3s 0s, visibility 0s 0.3s, transform 0.3s 0s; } .overlay.is-visible { opacity:1; visibility:visible; -webkit-transition:opacity 0.3s 0s, visibility 0s 0s, -webkit-transform 0.3s 0s; -moz-transition:opacity 0.3s 0s, visibility 0s 0s, -moz-transform 0.3s 0s; transition:opacity 0.3s 0s, visibility 0s 0s, transform 0.3s 0s; } /* Main */ main { min-height:100vh; z-index:2; } .grey-box { padding:20px; background-color:#f0f0f0; margin-bottom:20px; } .grey-box .form-control { margin-bottom:0; } .view-all { position:relative; display:block; color:#333; font-size:15px; font-family:'PT Sans', sans-serif; font-weight:bold; padding-right:15px; } .view-all:after { content:'\f105'; font-family:'FontAwesome'; font-style:normal; font-weight:normal; text-decoration:inherit; color:#333; font-size:15px; position:absolute; top:0; right:0; } .view-all:hover, .view-all:hover:after { color:#ffc000; } /* @end --------- */ /* Banners */ #banner-area { height:37vw; } #banner-area.loaded { height:auto; } .banner-slide { opacity:0; visibility:hidden; -moz-transition:all 0.2s linear; -o-transition:all 0.2s linear; -webkit-transition:all 0.2s linear; transition:all 0.2s linear; } #banner-area.loaded .banner-slide { opacity:1; visibility:visible; } .banner-slide, #strip-banner { height:37vw; background-position:center center; background-repeat:no-repeat; background-size:cover; color:#fff; } .banner-slide * { -moz-transition:all 0.2s linear; -o-transition:all 0.2s linear; -webkit-transition:all 0.2s linear; transition:all 0.2s linear; } .banner-slide .btn { color:#fff; } .banner-content { width:55%; height:100%; margin:0 auto; padding-top:9vw; text-align:center; } .banner-content.centre { margin:0 auto; } .banner-content.left { margin-left:80px; } .banner-content h3,.banner-content h1, .banner-title { font-size:3.7vw; font-family:'Montserrat', sans-serif; font-weight:700; text-transform:uppercase; text-transform:none; line-height:1.15em; display:block; } .banner-content .banner-text { display:block; color:#fff; font-size:18px; font-weight:700; font-family:'PT Sans', sans-serif; line-height:1.2em; text-align:center; margin:45px 0; } .banner-overlay { position:absolute; top:0; left:0; background:#333; opacity:0.5; width:100%; height:100%; } /* V2 */ #banner-areav2 { height:37vw; background:url(img/loading.gif) no-repeat center center; position:relative; } #banner-areav2.loaded { height:auto; } #banner-areav2 .banner-slide { opacity:0; visibility:hidden; -moz-transition:all 0.2s linear; -o-transition:all 0.2s linear; -webkit-transition:all 0.2s linear; transition:all 0.2s linear; } #banner-areav2.loaded .banner-slide { opacity:1; visibility:visible; } #banner-areav2 .banner-slide { width:100%; height:27vw; max-height:615px; background-position:center center; background-repeat:no-repeat; background-size:cover; color:#fff; position:relative; resize:both; } #banner-areav2 .banner-slide * { -moz-transition:all 0.2s linear; -o-transition:all 0.2s linear; -webkit-transition:all 0.2s linear; transition:all 0.2s linear; } #banner-areav2 .banner-slide .btn { color:#fff; } #banner-areav2 .banner-content { height:auto; width:50%; padding:0; text-align:center; transform:translate(-50%, -50%); position:absolute; top:50%; left:50%; margin:0; } #banner-areav2 .banner-content.centre { transform:translate(-50%, -50%); } #banner-areav2 .banner-content.left { margin:0; left:10%; transform:translate(-10%, -50%); } #banner-areav2 .banner-content h3,#banner-areav2 .banner-content h1, #banner-areav2 .banner-title { color:#fff;font-size:3.7vw; font-family:'Montserrat', sans-serif; font-weight:700; text-transform:uppercase; text-transform:none; line-height:1em; letter-spacing:0.025em; display:block; text-transform:uppercase; } #banner-areav2 .banner-content h3.banner-title-larger,#banner-areav2 .banner-content h1.banner-title-larger, #banner-areav2 .banner-title-larger { font-size:30px; margin-top: 0} #banner-areav2 .banner-pre-title {font-weight: bold;color: #fff;} #banner-areav2 .banner-content .banner-text { display:block; color:#fff; font-size:18px; font-weight:700; font-family:'PT Sans', sans-serif; line-height:1.2em; text-align:center; margin:45px 0; } #banner-areav2 .banner-overlay { position:absolute; top:0; left:0; background:#333; opacity:0.5; width:100%; height:100%; } #banner-areav2 .banner-slide.desktop-left { background-position:left center; } #banner-areav2 .banner-slide.desktop-centre { background-position:center center; } #banner-areav2 .banner-slide.desktop-right { background-position:right center; } .bscroll-down { display:none; position:absolute; left:50%; bottom:18px; text-align:center; font-size:20px; z-index:100; text-decoration:none; text-shadow:0; width:13px; height:13px; border-bottom:2px solid #fff; border-right:2px solid #fff; z-index:9; left:50%; -webkit-transform:translate(-50%, 0%) rotate(45deg); -moz-transform:translate(-50%, 0%) rotate(45deg); transform:translate(-50%, 0%) rotate(45deg); -webkit-animation:fade_move_down 4s ease-in-out infinite; -moz-animation:fade_move_down 4s ease-in-out infinite; animation:fade_move_down 4s ease-in-out infinite; } #banner-areav2 .owl-theme .owl-controls .owl-buttons .owl-next { right:0px; } #banner-areav2 .owl-theme .owl-controls .owl-buttons .owl-prev { left:0px; } /* v3 */ #banner-areav2.bannerv3 { display: flex; align-items: center; justify-content: center; width: 100%; } #banner-areav2.bannerv3 .banner-content h3,#banner-areav2.bannerv3 .banner-content h1, #banner-areav2.bannerv3 .banner-title { line-height: 1; font-weight: 600; font-size: 3.3vw;color:#fff; } #banner-areav2.bannerv3 .banner-content h1{padding-bottom:20px;} #banner-areav2.bannerv3 .banner-subtitle { font-size: 35px; } #banner-areav2.bannerv3 .script-text { display: inline-block; } #banner-areav2.bannerv3 .script-text img { max-width: 100%; } #banner-areav2.bannerv3 .bscroll-down { left: auto; } .banner-line-2.nature img { margin-top: -27px; } .banner-line-2.eachother img { margin-top: -35px; } .banner-line-2.nature { margin-top: 25px; } .banner-line-2.eachother{ margin-top: 30px; } @media(min-width:1499px){ #banner-areav2.bannerv3 .banner-content h3 .banner-line-2,#banner-areav2.bannerv3 .banner-content h1 .banner-line-2, #banner-areav2.bannerv3 .banner-title { font-size: 44px; } .banner-line-2 { margin-top: 10px; } .banner-line-2.taste { margin-top: 0px; } .banner-line-2.nature { margin-top: 20px; } .banner-line-2.yourself { margin-top: -5px; } .banner-line-2.garden { margin-top: -10px; } } @media(max-width: 1499px) { #banner-areav2.bannerv3 .banner-subtitle { font-size: 2.5vw; } } @media(max-width:991px){ #banner-areav2.bannerv3 .script-text img { max-width: 95%; } } @media(max-width:831px){ #banner-areav2.bannerv3 .banner-content h3 .banner-line-2,#banner-areav2.bannerv3 .banner-content h1 .banner-line-2, #banner-areav2.bannerv3 .banner-title { line-height: 1.5em; } } @media(max-width: 713px) { #banner-areav2.bannerv3 .banner-subtitle { font-size: 16px; } #banner-areav2.bannerv3 .banner-content h3 .banner-line-2,#banner-areav2.bannerv3 .banner-content h1 .banner-line-2, #banner-areav2.bannerv3 .banner-title { font-size: 30px; } } @media(max-width: 664px){ .banner-line-2.eachother, .banner-line-2.nature, .banner-line-2.nature { margin-top: 0px; } .banner-line-2.eachother img { margin-top: -8px; } } @media(max-width: 582px){ .banner-line-2.nature img { margin-top: 2px; } } @media only screen and (min-width:767px) and (max-width:829px){ #banner-areav2.bannerv3 .script-text img { max-width: 297.1px; } } @media only screen and (min-width:481px) and (max-width:719px){ #banner-areav2.bannerv3 .script-text img { max-width: 297.1px; } } /*animated scroll arrow animation*/ @-webkit-keyframes fade_move_down { 0% { -webkit-transform:translate(0,-10px) rotate(45deg); opacity:0; } 50% { opacity:1; } 100% { -webkit-transform:translate(0,10px) rotate(45deg); opacity:0; } } @-moz-keyframes fade_move_down { 0% { -moz-transform:translate(0,-10px) rotate(45deg); opacity:0; } 50% { opacity:1; } 100% { -moz-transform:translate(0,10px) rotate(45deg); opacity:0; } } @keyframes fade_move_down { 0% { transform:translate(0,-10px) rotate(45deg); opacity:0; } 50% { opacity:1; } 100% { transform:translate(0,10px) rotate(45deg); opacity:0; } } /* @end --------- */ /* Embedded youtube videos */ .video-wrapper { position: relative; padding-bottom: 56.25%; /* 16:9 */ /*padding-top: 25px;*/ height: 0; } .video-wrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* @end ------------- */ /* Strip Banners */ #strip-banner { max-height:344px; height:20vw; position:relative; } #strip-banner.bnr-nobtn { height:auto; } #strip-banner .banner-content { padding-top:3vw; width:75%;padding-bottom:3vw; position:relative; z-index:1; } #strip-banner .banner-title { font-size:3.5vw; margin-bottom:2vw; margin-top:2vw;text-transform:uppercase; color:#fff;} #strip-banner .banner-content.single-title { padding-top:7vw; } .monthly-specials #strip-banner .banner-content { padding-top:0; position:absolute; top:50%; left:50%; -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); transform:translate(-50%,-50%); } /* @end --------- */ /* Home - Monthly Specials */ #monthly-specials { margin-bottom:40px; } /* Home - Store Finder */ .inner-store-finder { position:relative; padding:40px 0; } #home-store-finder h3 { font-size:36px; } #home-store-finder .bg-graphic { background:url('img/bg/palm-grey-bg.png'); background-position:center center; background-repeat:no-repeat; background-size:cover; position:absolute; bottom:0; right:0; width:55%; height:20vw; max-height:228px; } /* Product Feature Slider */ .product-feature-item { position:relative; margin-right:20px; max-width:285px; } .product-feature-item .sp-info { padding:20px; background:#f0f0f0; -webkit-transition:background 0.35s; transition:background 0.35s; } .product-feature-link { display:block; position:absolute; top:0; left:0; border:8px solid #ffc000; width:100%; height:100%; opacity:0; -webkit-transition:opacity 0.35s, -webkit-transform 0.35s; transition:opacity 0.35s, transform 0.35s; -webkit-transform:scale3d(1.2,1.2,1); transform:scale3d(1.2,1.2,1); } .product-feature-link:after { width:0; height:0; content:''; border-style:solid; border-width:0 0 60px 90px; border-color:transparent transparent #ffc000 transparent; position:absolute; bottom:0; right:0; } .product-feature-icon { position:absolute; bottom:10px; right:10px; z-index:2; } .product-feature-item:hover > .prod-info { background:#fff; } .product-feature-item:hover > .product-feature-link { opacity:1; -webkit-transform:scale3d(1,1,1); transform:scale3d(1,1,1); } .product-feature-item:hover > .sp-new, .product-feature-item:hover > .sp-sale { opacity:1; -webkit-transform:perspective(1000px) rotate3d(1,0,0,0); transform:perspective(1000px) rotate3d(1,0,0,0); } #product-feature-slider .owl-controls .owl-buttons .owl-next { position:absolute; top:21%; right:0; color:#333; font-size:24px; } #product-feature-slider .owl-controls .owl-buttons .owl-next:hover { color:#ffc000; } /* Core Owl Carousel CSS File */ .owl-carousel .owl-wrapper:after { content:"."; display:block; clear:both; visibility:hidden; line-height:0; height:0; } .owl-carousel { display:none; position:relative; width:100%; -ms-touch-action:pan-y; } .owl-carousel .owl-wrapper { display:none; position:relative; -webkit-transform:translate3d(0px, 0px, 0px); } .owl-carousel .owl-wrapper-outer { overflow:hidden; position:relative; width:100%; } .owl-carousel .owl-wrapper-outer.autoHeight { -webkit-transition:height 500ms ease-in-out; -moz-transition:height 500ms ease-in-out; -ms-transition:height 500ms ease-in-out; -o-transition:height 500ms ease-in-out; transition:height 500ms ease-in-out; } .owl-carousel .owl-item { float:left; } .owl-controls .owl-page, .owl-controls .owl-buttons div { cursor:pointer; } .owl-controls { -webkit-user-select:none; -khtml-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; -webkit-tap-highlight-color:rgba(0, 0, 0, 0); } .grabbing { cursor:url(/stylesheets/img/grabbing.png) 8 8, move; } .owl-carousel .owl-wrapper, .owl-carousel .owl-item { -webkit-backface-visibility:hidden; -moz-backface-visibility:hidden; -ms-backface-visibility: hidden; -webkit-transform:translate3d(0,0,0); -moz-transform:translate3d(0,0,0); -ms-transform:translate3d(0,0,0); } .owl-theme .owl-controls .owl-buttons div { color:#fff; display:inline-block; zoom:1; *display:inline; margin:5px; padding:3px 10px; font-size:12px; -webkit-border-radius:30px; -moz-border-radius:30px; border-radius:30px; opacity:1; font-size:24px; } .owl-theme .owl-controls.clickable .owl-buttons div:hover { filter:Alpha(Opacity=50); opacity:0.5; text-decoration:none; } .owl-theme .owl-controls .owl-buttons .owl-next { position:absolute; top:50%; right:0px; margin-top:-20px;} .owl-theme .owl-controls .owl-buttons .owl-prev { position:absolute; top:50%; left:0px;margin-top:-20px; } .owl-theme .owl-controls .owl-page { display:inline-block; zoom:1; *display:inline; } .owl-theme .owl-controls .owl-page span { display:block; width:12px; height:12px; margin:5px 7px; background-color:#ccc; border:2px solid transparent; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius:20px; } .owl-theme .owl-controls .owl-page.active span, .owl-theme .owl-controls.clickable .owl-page:hover span { background-color:#67a74b; border-color:#67a74b; } .owl-theme .owl-controls .owl-page span.owl-numbers { height:auto; width:auto; color:#fff; padding:2px 10px; font-size:12px; -webkit-border-radius:30px; -moz-border-radius:30px; border-radius:30px; } .owl-item.loading { min-height:150px; background:url(/stylesheets/img/AjaxLoader.gif) no-repeat center center } /* Grids */ .grid-wrap { margin-bottom:30px; } .grid-wrap .view-all { float:right; } .grid-wrap h1, .grid-wrap h3 { font-size:36px; margin-bottom:0; } .grid { position:relative; height:285px; margin:0 10px 20px 10px; } .grid.first-in-row { margin-left:0; } .grid.last-in-row { margin-right:0; } .grid figure { position:relative; float:left; overflow:hidden; width:100%; height:275px; margin:0; background:#3085a3; text-align:center; cursor:pointer; } .grid figure img { position:relative; display:block; min-height:100%; max-width:100%; width:100%; opacity:0.8; object-fit: cover; } .grid figure figcaption { padding:2em; color:#fff; text-transform:uppercase; font-size:1.25em; -webkit-backface-visibility:hidden; backface-visibility:hidden; } .grid figure figcaption::before, .grid figure figcaption::after { pointer-events:none } .grid figure figcaption, .grid figure figcaption > a { position:absolute; top:0; left:0; width:100%; height:100%; -webkit-transform:translate3d(0, 0, 0); -moz-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } .grid figure figcaption > a { z-index:1000; text-indent:200%; white-space:nowrap; font-size:0; opacity:0; } .grid figure h2 ,#main-content .grid figure h2 { color:#fff;font-size:16px; font-family:'PT Sans', sans-serif; margin:0; text-rendering:optimizeLegibility; } /* Grid Honey Transition Effect */ figure.effect-honey { background:#000; } figure.effect-honey img {display:block; opacity:0.7; -webkit-backface-visibility:hidden; -moz-backface-visibility:hidden; backface-visibility:hidden; -webkit-transition:all 0.45s ease-in-out; -moz-transition:all 0.45s ease-in-out; -ms-transition:all 0.45s ease-in-out; -o-transition:all 0.45s ease-in-out; transition:all 0.45s ease-in-out; -webkit-transform:translate3d(0,0,0) scale(1); -moz-transition:translate3d(0,0,0) scale(1); -ms-transition:translate3d(0,0,0) scale(1); -o-transition:translate3d(0,0,0) scale(1); transform:translate3d(0,0,0) scale(1); } figure.effect-honey:hover img { opacity:0.4; transform:scale(1.05); } figure.effect-honey figcaption::before { position:absolute; bottom:0; left:0; width:100%; height:10px; background:#ffc000; content:''; -webkit-transform:translate3d(0,10px,0); transform:translate3d(0,10px,0); } figure.effect-honey h2 { position:absolute; bottom:15px; left:15px; width:auto; text-align:left; /* -webkit-transform:translate3d(15px,-15px,0) translateZ(0); -moz-transform:translate3d(15px,-15px,0) translateZ(0); -ms-transform:translate3d(15px,-15px,0) translateZ(0); -o-transform:translate3d(15px,-15px,0) translateZ(0); transform:translate3d(15px,-15px,0) translateZ(0);*/ } figure.effect-honey h2 i { font-style:normal; opacity:0; -webkit-transition:opacity 0.35s, -webkit-transform 0.35s; transition:opacity 0.35s, transform 0.35s; -webkit-transform:translate3d(0,-30px,0); transform:translate3d(0,-30px,0); } figure.effect-honey figcaption::before, figure.effect-honey h2 { -webkit-transition:-webkit-transform 0.35s; transition:transform 0.35s; } figure.effect-honey:hover figcaption::before { opacity:1; -webkit-transform:translate3d(0,0,0); transform:translate3d(0,0,0); } figure.effect-honey:hover h2 { opacity:1; -webkit-transform:translate3d(0px,-10px,0); -moz-transform:translate3d(0px,-10px,0); -ms-transform:translate3d(0px,-10px,0) ; -o-transform:translate3d(0px,-25px,0); transform:translate3d(0px,-10px,0); } @media screen and (max-width:50em) { .grid figure { display:inline-block; float:none; margin:10px auto; width:100%; } } /* Advertising Boxes */ #advertising-boxes { margin-bottom:30px; } .ad-item { color:#fff; position:relative; overflow:hidden; display:block; margin-top:30px; height:256px; background-position:center center; background-repeat:no-repeat; background-size:cover; } .ad-inner { position:absolute; top:0; left:0; padding:20px; width:100%; height:100%; } .ad-inner > h4 { font-family:'Montserrat', sans-serif; font-weight:bold; font-size:24px; } .ad-description { display:block; margin-bottom:20px; } .ad-link { position:absolute; top:0; left:0; padding:20px; width:100%; height:100%; color:transparent; text-indent:-99999px; opacity:0; background:#fff; -webkit-transition:opacity 0.35s; transition:opacity 0.35s; } .ad-link:hover { opacity:0.2; } /* DIY - Advice */ #diy { padding:20px 0 0 0; } #diy .view-all { float:right; } #diy h3 { font-size:36px; margin-bottom:0; } #diy-list { margin:30px 0; } .diy-item { margin-bottom:30px; } .diy-item > .categories { display:block; margin-bottom:10px; } .diy-item > .categories > a { color:#999; font-weight:bold; } .diy-item > .categories > a:hover { color:#ffc000; } .diy-img-wrap { display:block; width:100%; max-width:550px; margin-bottom:15px; overflow:hidden; -webkit-transform:translate3d(0, 0, 0); -moz-transform:translate3d(0, 0, 0); -ms-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); background:#000; } .diy-img { object-fit: cover; max-height:128px; height:auto; width:100%; opacity:1; -webkit-backface-visibility:hidden; -moz-backface-visibility:hidden; backface-visibility:hidden; -webkit-transition:all 0.45s ease-in-out; -moz-transition:all 0.45s ease-in-out; -ms-transition:all 0.45s ease-in-out; -o-transition:all 0.45s ease-in-out; transition:all 0.45s ease-in-out; -webkit-transform:translate3d(0,0,0) scale(1); -moz-transition:translate3d(0,0,0) scale(1); -ms-transition:translate3d(0,0,0) scale(1); -o-transition:translate3d(0,0,0) scale(1); transform:translate3d(0,0,0) scale(1); } .diy-img-wrap:hover > .diy-img { opacity:0.7; -webkit-transform:translate3d(0,0,0) scale(1.05); -moz-transform:translate3d(0,0,0) scale(1.05); -ms-transform:translate3d(0,0,0) scale(1.05); -o-transform:translate3d(0,0,0) scale(1.05); transform:translate3d(0,0,0) scale(1.05); } .diy-item h2, .diy-item h4 { font-size:24px; margin:0 0 15px 0; line-height:1.2em; } .diy-item h2 a, .diy-item h4 a { color:#333; } .diy-item h2 a:hover, .diy-item h4 a:hover { color:#ffc000; text-decoration:none; } .diy-item p { margin-bottom:15px; } #advice-search fieldset, #advice-search .form-group { margin:0; } #diy-listing-block { margin:40px 0; } #diy-listing-block .diy-item { height:450px; overflow:hidden; } #diy-listing-block .diy-item p { font-size:14px; } .popular-advice { padding:30px 0; } .popular-advice h3 { display:inline-block; } .popular-advice .view-all { top:15px; } #advice-search .btn { padding:15px 0; width:100%; } #diy-list a {text-decoration: none;} /* @end --------- */ /* DIY - Advice - Detail View */ #advice-banner { height:37vw; max-height:500px; background-position:center center; background-repeat:no-repeat; background-size:cover; position: relative; z-index: 2; } #advice-banner::after { content: ""; position: absolute; top: 0; left: 0; height: 100%; width: 100%; background: #302e2e; opacity: 0.3; z-index: -1 } #advice-banner .banner-content { width:65%; margin:0 auto; padding-top:8vw; text-align:center; } #advice-banner h1 { font-size:4vw; font-family:'Montserrat', sans-serif; font-weight:700; text-transform:uppercase; line-height:1.1em; color:#fff; } #advice-banner p { display:block; color:#fff; font-size:18px; font-weight:700; font-family:'PT Sans', sans-serif; line-height:1.2em; text-align:center; margin:4vw 0; } #advice-banner .categories > a:hover { color:#666; } #advice-detail h3 { font-size:24px; color:#666; } .content-row { margin:40px 0; } .content-row .row-title { margin-top:0; } .content-row .row-img { margin-bottom:20px; } #advice-related-products { padding:30px 0; margin-top:20px; } #advice-detail h3.related-products-heading {margin-top:0; margin-bottom: 15px; font-size: 20px;} .banner-content .categories a { color: #ffc000} /* @end --------- */ /* Professional Support Portal */ /* Header */ #logout-btn-box {position:absolute; top:0; right:15px; z-index:10; display:block; width:47px; height:57px; text-align:center; background:#FFC000;-webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale} #logout-btn-box #logout-btn {position:absolute; z-index:11; display:block; overflow:hidden; cursor:pointer; -webkit-backface-visibility:hidden; backface-visibility:hidden; width:47px; height:57px; right:0} #logout-btn-box #logout-btn i {color:#333;font-size:30px;line-height:57px;padding-left:5px} /* Login */ #login-form .action-links {margin-bottom:0} #login-form a {color:#333} #login-form a:hover {color:#ffc000} #login-form button {width:100%} /* Registration */ #registration-form {display:none} /* Items */ #diy-listing-block .diy-item.psp-item {height:auto} /* Products Doc Tiles */ .prd-tile {padding:0 8px} .prd-tile article {border:2px solid #ebebeb;height:auto;margin-bottom:16px;padding:16px 16px 62px;position:relative} #diy-listing-block .psp-items .diy-item {height:auto} .prd-tile article .doc-prd {position:relative} .prd-tile article .doc-prd .main-attribute {background:#f0f0f0;border-radius:6px;display:inline-block;padding:4px 12px} .prd-tile article .doc-prd .prd-ctn {margin-bottom:16px} .prd-tile article .product-foot {background:#f0f0f0;bottom:-62px;left:-16px;padding:16px;position:absolute;right:-16px; } .prd-tile article .product-foot a {color:#000; } .prd-tile article .product-foot .download-file {float:right; } .prd-tile article .product-foot .download-file i {font-size:1.2em; } /* Side Bar */ #diy-listing-block .side-bar {background:#f0f0f0;padding:10px; } #diy-listing-block .side-bar .side-bar-title {background:#fff;font-size:18px;line-height:40px;padding:0 16px;text-transform:uppercase; } #diy-listing-block .side-bar .side-bar-title a {color:#999;display:block;position:relative; } #diy-listing-block .side-bar .side-bar-title a i {display:none; } #diy-listing-block .side-bar ul {list-style:none;margin:0;padding:16px; } #diy-listing-block .side-bar ul li {line-height:1.3; margin-bottom:15px;padding:0 8px;position:relative; } #diy-listing-block .side-bar ul li span {cursor:pointer;display:none;position:absolute;right:5px;text-align:center;top:0;width:32px; } #diy-listing-block .side-bar ul li span i {font-size:1.2em; } #diy-listing-block .side-bar ul li:last-child {margin-bottom:0; } #diy-listing-block .side-bar ul li a {color:#000;display:inline-block; } #diy-listing-block .side-bar ul li a:hover {color:#ffc000; } #diy-listing-block .side-bar ul li.active {background:#fff; } #diy-listing-block .side-bar ul li.active span {display:block; } #diy-listing-block .side-bar ul li.psp-heading { margin-bottom:15px; margin-top:20px; line-height:1em; text-align:left; cursor: default; } #diy-listing-block .side-bar ul li.psp-heading.first-child { margin-top:0; } #diy-listing-block .side-bar ul li.psp-heading span { display:inline-block; text-align:left; font-weight:bold; position: relative; left:auto; right:auto; top:auto; bottom:auto; cursor:default; } /* Product Doc Details */ .prd-doc-details {padding-top:32px;} .prd-doc-details .main-download-btn {border:1px solid #ffc000;color:#000;display:inline-block;font-size:1.2em;font-weight:bold;height:60px;line-height:62px;margin-bottom:32px;text-align:center;text-transform:uppercase;width:220px} .prd-doc-details .main-download-btn i {padding-left:16px} /* @end --------- */ /* Services */ .service-contacts strong { font-size:20px; display:inline-block; margin-bottom:5px; } .service-contacts span, .service-contacts a { display:block; color:#666; } .service-contacts a:hover { color:#333; } .s-contact.first-item { border:0 none; padding:0; } .s-contact { border-left:1px solid #ccc; padding-left:3vw; } /* @end --------- */ /* Main Content */ #main-content { padding:40px 0; } #main-content h2, #main-content h3 { color:#666; } #main-content h2 { font-size:24px; } #main-content h3 { font-size:16px; text-transform:none; } /* @end --------- */ /* Page Specific */ .mulch-images > img { width:16%; } /* @end --------- */ /* Default Sidebar */ .default-sidebar { margin-bottom:20px } .sidebar-item { margin-bottom:20px } /* @end --------- */ /* Breadcrumbs */ #breadcrumbs-bar { background:#f9f9f9; border-top:1px solid #d3d1c8; border-bottom:1px solid #d3d1c8; padding:5px 0; } #breadcrumbs-bar h1 { color:#666; font-size:14px; font-weight:bold; text-transform:none; margin:0; padding:10px 0; } .breadcrumbs { float:left; padding:10px 0; font-weight:bold; } .breadcrumbs > a { color:#666; font-size:14px; font-weight:normal; margin-right:15px; } .breadcrumbs > a:hover { color:#ffc000; } .breadcrumbs > i { font-size:16px; margin-right:15px; } /* @end --------- */ /* Locations */ #map-frame { height:100%; width:100%; position:relative; margin:30px 0; } #map-frame.no-locations { height:100px; } #map-search { margin-bottom:20px; } #location-map { height:550px; width:100%; max-width:100%; background:transparent url('img/bg/map-loading.jpg') no-repeat center center; background-size:cover; } .location-info-pin h5 { font-size:16px; font-family:'Montserrat', sans-serif; margin-bottom:5px; } #location-finder fieldset { margin:0; } #location-finder .title { display:block; color:#333; line-height:1.4em; text-transform:uppercase; font-size:28px; font-family:'Montserrat', sans-serif; } #location-finder .title > .fa { margin-right:10px; } #location-finder .btn { width:100%; } #location-finder #webappsearchresults13003 { visibility:hidden; display:none; height:0; width:0; z-index:0; } .location-list-items { margin:30px 0; } .location-item { height:165px; overflow:hidden; } .location-item h6 { text-transform:uppercase; font-weight:800; line-height:1.125em; padding-bottom:0; margin-top:0; margin-bottom:6px; font-size:17px; } .location-item h6 > a { color:#333; } .location-item h6 > a:hover, .location-item h6 > a:active { color:#ffc000;} .location-item address { margin-bottom:5px; } .chosen-results li.hidden { display:none; } .location-listing { margin:20 0 30px 0; } /* @end --------- */ /* Locations - Detail View */ #location-detail aside > .location-img { width:100%; } #location-detail aside > #sidebar-map > iframe { width:100% !important; } #location-detail aside > #sidebar-map { margin:20px 0; } .location-enquiry-wrap { margin:20px 0; } /* @end --------- */ /* Spring Bathurst BBQ */ .no-padding {padding: 0} .aqua-bg { background-color: #44d0d2;} .yellow-bg {background-color: #ffc000;} .aqua {color: #44d0d2;} .launch-into-spring-orange .icon {height: 24px; width: 44px;} .launch-into-spring-orange hr {height: 2px; color: #cccccc; background: #cccccc; font-size: 0; border: 0; } .launch-into-spring-orange .btn-row {padding-top: 20px; text-align: center;} .launch-into-spring-orange .btn-row hr {width: 38%; display: none; margin-bottom: 0;} .launch-into-spring-orange .btn-row .btn-container {width: auto; display: inline-block;} .hero-sub-heading { height: auto; line-height: auto; padding: 0 15px; display: inline-block;} .hero-sub-heading a { font-family:'Montserrat', sans-serif; color:#000; font-size: 14px; line-height:56px; text-transform: uppercase;} .hero-sub-heading img { margin-bottom: 9px} #banner-areav2 .banner-content { padding:0; width:100%; } .launch-into-spring-orange #banner-areav2 .banner-content { resize: none; overflow: hidden; width: 50%;} .launch-into-spring-orange #banner-areav2 .spring-banner h3,.launch-into-spring-orange #banner-areav2 .spring-banner h1 {font-size: 25px; color: white; margin-top: 0;} .launch-into-spring-orange #banner-areav2 .spring-banner p {font-size: 18px; color: white; font-weight: bold; margin-bottom: 0;} #banner-areav2.bannerv3 .banner-content { padding:0; width:95%; } .spring-video-container {text-align: center;} .spring-video-container p {font-size: 17px;} #main-content .spring-video-container h2 { text-transform: uppercase; font-size: 25px; color: #333333;} .spring-video-section { background: none; position:relative;} .spring-video-section > div { position:relative; } .spring-video-section img { z-index: 1; max-width: 100%;} /* .spring-video-section img:hover { opacity: .8;} */ .spring-video-section a {display:inline-block;left:0;position:absolute;top:0;width:100%;z-index:1} .play-btn {-webkit-transform:translate(-50%,-50%);-webkit-border-radius:100%;-o-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-moz-border-radius:100%;background:#ffc000;border-radius:100%;color:#fff;height:14vw;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:14vw} .play-btn i {font-size:6vw;line-height:14vw;margin-left:5px} .play-video:hover {-webkit-transition:all 300ms linear;-webkit-opacity:.8;-o-transition:all 300ms linear;-ms-transition:all 300ms linear;-moz-transition:all 300ms linear;-moz-opacity:.8;opacity:.8;transition:all 300ms linear} .video-wrap {margin:0 auto;max-width:715px} .video-box { position: relative; padding-bottom: 52.7%; /* Standard is 56.25%; Adjust to remove black edges */ /* 16:9 */ padding-top: 25px; height: 0; } .video-box iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index:2 } @media (min-width:786px){ .modal {height:500px;} .play-btn {height:110px;width:110px} .play-btn i {font-size:46px;line-height:110px;} } .spring-video-section iframe { z-index: 2; max-width: 100%} .spring-info-row { padding-top: 20px; padding-bottom: 20px;} .spring-image-container {padding-top: 20px; padding-bottom: 20px;} .spring-image-container img {max-width: 100%; width: 100%;} .spring-text-container {position: relative;} .spring-text-info .table-right {padding-left: 10px;} .bbq {display: inline-block;} .map-details h2 {font-size: 25px; color: #000} .map-details .details-left {font-family:'Montserrat', sans-serif; color: #000; font-size: 13px; padding-top: 15px; text-decoration: underline; width: 40%;} .map-details .details-right {color: #000; font-size: 13px; padding-top: 15px; width: 60%;} .feature-left-side {position: relative; height: 350px; padding: 10px 0; background: none} .feature-right-side {position: relative; height: 350px;} .feature-left-side .content {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); padding: 50px 0;} #location-bar { text-align: center; padding: 80px 0; background: #ffc000;} #location-bar h2 { font-size: 30px; } #location-bar p { font-size: 20px; color: #333;} #location-bar .fa { font-size: 30px;} .location-details-container { display: inline-block; margin: 10px 20px;} .location-details-container .btn { background: #fff;} .location-details-container .btn:hover { background: #333; color: #fff;} #CAT_Custom_152295 { margin-top:10px; } #contact-form .btn.btn-default { margin-top:10px; } /* Monthly Specials */ #monthly-specials-page .small-product { margin-bottom:40px; } #monthly-specials .owl-swiper { margin-top:30px; } #monthly-specials .owl-pagination { text-align:center; margin-top:10px; } /* Login */ #user { height:50px; line-height:50px; float:right; margin:0 10px; position:relative; } #user > a { text-decoration:none } #login-dropdown { min-width:210px; padding:15px; display:none; line-height:1em; margin:0 0 0 -50%; -webkit-box-shadow:0 1px 5px 0 rgba(0,0,0,0.3); box-shadow:0 1px 5px 0 rgba(0,0,0,0.3); -webkit-transition:all 0.4s ease-in-out; -moz-transition:all 0.4s ease-in-out; -ms-transition:all 0.4s ease-in-out; -o-transition:all 0.4s ease-in-out; transition:all 0.4s ease-in-out; } #login-dropdown .btn { margin-top:6px } #quick-loginform { position:relative } #quick-loginform:after { width:0; height:0; position:absolute; top:-33px; left:66%; border:solid transparent; content:" "; pointer-events:none; border-color:rgba(255, 255, 255, 0); border-bottom-color:#fff; border-width:10px; margin-left:-10px; } .user { display:block; height:50px; width:50px; margin:0 auto 10px auto; text-align:center; font-size:24px; border-radius:50px; border:1px solid #ccc; } .user i { display:inline; line-height:50px; } .remb, .help { display:block; text-align:center; margin-top:7px; font-size:12px; } .need-help { font-style:italic } /* @end --------- */ /* Members Area */ .members-bar { background-color:#fff; padding-bottom:25px; } .user-profile { color:#999; font-size:16px; font-style:italic; } .members-content { background-color:#f5f5f5; padding:30px 0; } .membership #main-content { margin-bottom:0 } .edit-profile, .go-back { font-size:16px; color:#333; font-style:italic; } .edit-profile:hover, .go-back:hover { color:#000 } .profile-box { margin-bottom:20px; padding:15px; background-color:#fff; } .pb-title { display:block; font-size:15px; text-transform:uppercase; color:#999; margin-bottom:5px; } .profile-box table td { padding-bottom:5px } .pr-heading { width:45%; padding-right:10px; } .profile { } .profile .today { color:#999 } .case-list { margin-bottom:10px } .cnumber { width:10%; color:#333; padding-right:15px; } .subject { width:65%; color:#999; } .status { width:20%; color:#ccc; } .zoneSubscriptions { margin:0; padding:0; } .zoneSubscriptions li { list-style:none } .zoneSubscriptions li> ul { margin:0 0 7px 0 } .zoneName a { color:#333 } .reporttable { width:100% } .order-list { background-color:#fff; padding:15px; } .order-item { margin-bottom:10px; padding-bottom:10px; border-bottom:1px dashed #ccc; } .order-item:last-child { margin-bottom:0; padding-bottom:0; border-bottom:0 none; } .order-heading { margin-bottom:8px; font-size:16px; color:#999; } .o-title { width:50%; padding-right:5px; color:#999; } .order-status { margin-bottom:10px; font-size:14px; color:#666; } .order-status strong { color:#333; font-size:13px; } .os-goods-dispatched { color:#13b322 } .os-order-recieved { color:#999 } /* @end --------- */ /* Site Search Page */ .search-controls { margin-bottom:15px; padding-bottom:15px; border-bottom:1px solid #ccc; } #site-search-detail { width:100% } #search-field { } #filter-search { } .type { } .search-result-item { margin-bottom:10px; padding-bottom:10px; border-bottom:1px dashed #ccc; } .search-result-item h4 { font-size:16px } .search-result-item h4 a { color:#333; } .sr-desc { font-size:12px; margin-top:0; } /* @end --------- */ /* Product Search */ #product-search-results .small-product { margin-bottom:40px; height:450px; } /* @end --------- */ /* ECOMMERCE SECTION */ /* General */ #ecomerce { } .shop-sidebar { } #listing-area { } .catalogueList { clear:both; } .catalogueItemNotFound, .productItemNotFound { display:none } #catpop-products > h3, #recview-products > h3 { margin-bottom:30px; } /* Shop Breadcrumbs */ .cat-back { display:block; float:left; background:#fff; margin-right:15px; border:1px solid #dbdbdb; padding:10px; font-weight:700; font-size:12px; color:#666; border-radius:50px; } .cat-back:hover { background:#f0f0f0; color:#666; } /* Catalog */ #cat-header { padding-top:40px; } #cat-header > h1 { display:block; font-size:30px; } .cat-description { display:block; color:#666; font-style:italic; margin-bottom:20px; } .cat-description > p { font-size:14px; font-style:normal; } .catalogueList { margin:0 0 20px 0 } .catalogueItem > .grid { max-height:285px; height:auto; } .catalogueItem, .catalogueItemLast { width:25%; list-style:none; float:left; padding-right:1%; margin-bottom:80px; } .catalogueItemLast { margin-right:0 } .catalogueItem .grid, .catalogueItemLast .grid { margin:0; } .catalog-box { } .view-catalog { } /* Small Product */ .productList.productSmall { margin:0; padding:0; clear:both; } .productItem, .productItemLast { width:24.2%; list-style:none; float:left; margin-right:1%; margin-bottom:30px; } .productItem.prodcol1,.productItemLast.prodcol1 {width:100%;margin-right:0px;} .productItem.prodcol2,.productItemLast.prodcol2 {width:49.5%;} .productItem.prodcol3,.productItemLast.prodcol3 {width:32.66%;} .productItem.prodcol5,.productItemLast.prodcol5 {width:19.2%;} .productItem.prodcol6,.productItemLast.prodcol6 {width:15.83%;} .productItemLast { margin-right:0 } .row.no-gutter .small-product { margin-right:3.8%; } .small-product { position:relative; } .sp-new { font-family:'Montserrat', sans-serif; background:#333; border-radius:50%; display:block; color:#ffc000; position:absolute; top:15px; right:15px; width:50px; height:50px; text-align:center; line-height:50px; opacity:0; -webkit-transition:opacity 0.35s, -webkit-transform 0.35s; transition:opacity 0.35s, transform 0.35s; -webkit-transform:perspective(1000px) rotate3d(1,0,0,90deg); transform:perspective(1000px) rotate3d(1,0,0,90deg); -webkit-transform-origin:50% 0%; transform-origin:50% 0%; text-transform:uppercase; } .sp-sale { font-family:'Montserrat', sans-serif; color:#333; background:#ffc000; border-radius:50%; display:block; position:absolute; top:15px; right:15px; width:50px; height:50px; text-align:center; line-height:50px; } .sp-image { width:100%; position: relative; padding-top: 100%;overflow:hidden;} .sp-image img { position:absolute;top:0px;object-fit: contain;width:100%;} .sp-info { padding:10px 0 0 0; -webkit-transition:background 0.35s; transition:background 0.35s; } .sp-info > h4 { font-family:'PT Sans', sans-serif; color:#333; font-size:16px; font-weight:bold; text-transform:none; height:50px; overflow:hidden; } .sp-price, .sp-rrp { font-family:'Montserrat', sans-serif; color:#333; font-size:18px; display:inline-block; } .sp-price.sale { font-size:16px; text-decoration:line-through; font-weight:400; color:#999; display:inline-block; margin-right:5px; } .sp-unit { } .sp-link { display:block; position:absolute; top:-8px; left:-8px; border:8px solid #ffc000; width:105%; height:105%; opacity:0; -webkit-transition:opacity 0.35s, -webkit-transform 0.35s; transition:opacity 0.35s, transform 0.35s; -webkit-transform:scale3d(1.2,1.2,1); transform:scale3d(1.2,1.2,1); } .sp-link:after { width:0; height:0; content:''; border-style:solid; border-width:0 0 60px 90px; border-color:transparent transparent #ffc000 transparent; position:absolute; bottom:0; right:0; } .sp-icon.fa { position:absolute; bottom:5px; right:10px; z-index:2; font-size:25px; color:#024f2b; } .small-product:hover > .sp-info { background:#fff; } .small-product:hover > .sp-link { opacity:1; -webkit-transform:scale3d(1,1,1); transform:scale3d(1,1,1); } .small-product:hover > .sp-new { opacity:1; -webkit-transform:perspective(1000px) rotate3d(1,0,0,0); transform:perspective(1000px) rotate3d(1,0,0,0); } /* Large Product */ .productList.productLarge { margin:0; padding:0; } .productList.productLarge .productItem { width:100%; margin:0; float:none; } .large-product-layout { } .prod-img-wrap { width:100%; height:auto; max-height:580px; overflow:hidden; border:1px solid #ccc; position:relative; } .prod-img { width:100%; height:auto; } .prod-title { font-size:24px; color:#333; text-transform:none; font-family:Arial,"Helvetica Neue",Helvetica,sans-serif; } .prod-rating { display:inline-block; } .prod-rating i { font-size:20px; margin-right:5px; color:#ccc; } .rating-stars > .ratings-count { display:inline-block; color:#ffc000; } #review-link { text-decoration:underline; display:inline-block; margin-left:5px; } #review-link:hover { text-decoration:none; } .prod-price { } .prod-price, .sale-price { font-family:Arial,"Helvetica Neue",Helvetica,sans-serif; display:block; font-size:24px; color:#333; font-weight:bold; line-height:1.3em; } .prod-price { margin:30px 0;} .prod-price.on-sale { font-size:18px; font-weight:normal; margin-bottom:0px; text-decoration:line-through; } .sale-price { margin-bottom:30px; } .prod-unit { font-size:14px; text-transform:uppercase; } .prod-info-link { display:block; margin:20px 0; color:#333; text-decoration:underline; } .prod-info-link:hover { color:#FFC000; text-decoration:none; } .prod-help { font-family:'PT Sans', sans-serif; font-weight:bold; text-transform:uppercase; } .help-msg { display:block; color:#333; font-size:12px; } .help-link { display:inline-block; color:#024f2b; font-size:16px; position:relative; margin-bottom:30px; text-decoration: none; } .help-link:after { content:'\f105'; font-family:'FontAwesome'; font-style:normal; font-weight:normal; text-decoration:inherit; color:#333; font-size:16px; position:absolute; top:0; right:-15px; } .help-link:hover, .help-link:hover:after { color:#ffc000; } .shipping-icon { display:block; float:left; margin:0 15px 40px 10px; } .shipping-title { display:block; color:#999; font-size:14px; font-weight:bold; text-transform:uppercase;color:#000; } .shipping-msg { color:#999; font-size:14px; } .shipping-msg strong {color:#000;} .productAttributes { } .catProductAttributeGroup { } .catProdAttributeTitle { font-weight:bold; font-size:14px; } .catProdAttributeItem { margin-bottom:10px } .catProdAttributeItem select { } .catProdAttributeItem input[type=checkbox] { margin-right:5px } .catProdAttributeItem input[type=radio] { margin-right:5px } .volume-pricing { margin:0 0 10px 0 } .volume-pricing li { list-style:none; margin-bottom:5px; } .volume-pricing li:last-child { margin-bottom:0 } .poplets { margin:10px 0 0 0; padding:0; text-align:center; } .poplets li { list-style:none; display:inline-block; } .poplets a { display:block } .poplets img { } .purchase-options { margin-bottom:21px; } .addtocart { font-size:24px; padding:20px 40px; height:76px; } #qty { display:block; float:left; height:76px; } .qty-control { display:block; float:left; width:33.33%; height:76px; font-size:25px; text-align:center; color:#999; background:#f0f0f0; line-height:75px; font-weight:bold; -webkit-transition:all 0.5s linear; -moz-transition:all 0.5s linear; -o-transition:all 0.5s linear; transition:all 0.5s linear; } .qty-control:hover { cursor:pointer; background:#333; color:#fff; } .qty-input { display:block; float:left; width:33.33%; height:76px; text-align:center; color:#999; border:none; font-size:16px; border-top:1px solid #f0f0f0; border-bottom:1px solid #f0f0f0; } .qty-input-cart { display:block; float:left; width:33.33%; text-align:center; color:#999; border:none; font-size:16px; border-top:1px solid #f0f0f0; border-bottom:1px solid #f0f0f0; } .qty-wrap { display:block; float:left; background:#ffc000; padding:10px 25px; height:76px; border:1px solid #e4ac00; } .shipping-note { background:#f0f0f0; padding:15px;margin-bottom:20px; } #product-content { margin-top:60px; } #product-content .tab-nav { margin:0; list-style:none; display:block; width:100%; } #product-content .tab-nav li { width:auto; float:left; } #product-content .tab-nav a { display:block; text-align:center; text-decoration:none; text-transform:uppercase; padding:0; margin:0; color:#333; border:1px solid #ddd; border-right-color:transparent; font-weight:600; position:relative; font-size:12px; padding:15px 20px; border-bottom:0 none; } #product-content .tab-nav li:first-child a { border-left-color:transparent; } #product-content .tab-nav li.first-child a { border-right-color:transparent;border-left:1px solid #ddd; } #product-content .tab-nav li:last-child a { border-right-color:#ddd; } #product-content .tab-nav li.last-child a { border-right-color:#ddd; } #product-content .tab-nav a:hover, #product-content .tab-nav .active a { background:#f0f0f0; } #product-content .tab-nav a > .prod-rating { float:right; margin-left:10px; } #product-content .tab-nav a > .ratings-count { color:#666; font-size:14px; display:block; float:right; margin-left:10px; font-weight:normal; text-transform:none; } #product-content .tab-group { padding:20px 15px 0 15px; border:1px solid #eee; } #product-content .tab-group img { width:auto; max-width:100%; height:auto; } #product-content .tab-content { padding-bottom:10px; } #product-content h2 { font-size:15px; font-family:Verdana,Geneva,sans-serif; line-height:1.17em; margin:0 0 10px 0; font-weight:800; } #product-content .title { display:block; color:#999; font-size:24px; font-weight:bold; text-transform:uppercase; font-family:'Montserrat', sans-serif; } .review-header { color:#666; font-size:14px; margin-bottom:30px; padding-bottom:30px; border-bottom:1px solid #e5e5e5; } .review-header button { margin-left:20px; } .rating-summary { font-weight:bold; } .rating-summary .prod-rating > i { font-size:14px; } .rating-summary .prod-name { font-weight:normal; display:block; } .review-title { font-weight:bold; } .review-msg { display:block; } .review-rating > i { color:#ccc; } .review-card { padding:20px 0; margin-bottom:20px; border-bottom:1px solid #e5e5e5; } .review-body { color:#666; } .review-items, .leave-review { visibility:hidden; opacity:0; height:0px; -webkit-transition:opacity 0.6s; transition:opacity 0.6s; } .review-items.show, .leave-review.show { visibility:visible; opacity:1; height:auto; margin-bottom:20px;} .btn-rounded.active { background:#f0f0f0; } .review-items .review-title { color:#666; } .rate-product { width:20%; height:34px; line-height:31px; padding:1px 0; border:1px solid #ccc; margin-bottom:15px; } .rheart { width:15%; height:30px; line-height:30px; display:block; float:left; text-align:center; color:#ccc; overflow:hidden; border-right:1px solid #ccc; } .radio-icons { width:90%; height:30px; margin:0 auto; } .raterad { width:auto; float:left; display:block; margin-right:1px; font-size:24px; cursor:pointer; } .raterad input { width:1px; height:1px; overflow:hidden; opacity:0; } .raterad .fa { color:#ccc; } .raterad:hover.selectedrate .fa { color:#ccc; } .raterad:hover .fa, .raterad.hoverrate .fa, .raterad.selectedrate .fa { opacity:0.6; } #product-content .faq-title { color:#666; font-size:14px; font-weight:bold; display:block; } .faq-item { margin-top:20px; padding-top:20px; border-top:1px solid #ccc; } #product-content .faq-item .faq-title { font-weight:normal; display:inline-block; } .faq-btn { position:relative; padding:6px 12px; } .faq-btn:before { content:'\f067'; font-family:'FontAwesome'; font-style:normal; font-weight:normal; text-decoration:inherit; color:#fff; font-size:18px; } .faq-btn.active { background:#333; } .faq-btn.active:before { content:'\f068'; } .faq-answer { height:0px; opacity:0; visibility:hidden; -webkit-transition:all 0.6s; transition:all 0.6s; } .faq-answer > p { font-size:14px; font-style:italic; } .faq-answer.open { height:auto; opacity:1; visibility:visible; } .item-added { background:#f0f0f0; padding:20px; margin-bottom:40px; } .item-added > .title { display:block; padding-bottom:15px; border-bottom:1px solid #333; color:#333; font-size:18px; font-weight:bold; margin-bottom:20px; line-height:1.5em; } .tick { background:#333; border-radius:50%; padding:3px; color:#fff; margin-right:10px; } .mprod-img-wrap { display:block; float:left; } .mprod-img { width:72px; height:72px; } .mprod-info { display:block; float:left; margin-left:15px; font-weight:bold; } .mprod-name { display:block; color:#333; font-size:14px; font-family:'PT Sans', sans-serif; } .mprod-qty { display:block; color:#999; font-size:14px; font-family:'PT Sans', sans-serif; } .mprod-price { display:block; color:#333; font-size:16px; font-family:'Montserrat', sans-serif; line-height:1.7em; } .order-details { border-bottom:1px solid #ccc; padding-bottom:30px; } .order-total { display:block; color:#333; font-size:20px; } .order-price { font-weight:bold; } .your-cart { line-height:2em; color:#666; font-size:14px; } .your-cart > .edit-cart { color:#ffc000; font-size:12px; margin-left:10px; text-decoration:underline; } .your-cart > .edit-cart:hover { color:#024f2b; } .order-details .btn { padding:20px; margin-left:15px; } .order-details .btn-primary { color:#fff; } #mprod-related { margin:40px 0; } #mprod-related > .title { color:#333; font-size:18px; text-transform:uppercase; font-family:'Montserrat', sans-serif; } #mprod-related .small-product { margin:15px 0; } #mprod-related .sp-image { width:100%; max-height:192px; height:auto; } #mprod-related .sp-info { padding:0; } #mprod-related .sp-info > h4 { font-size:14px; height:60px; } #mprod-related .sp-info > h4 > a { color:#333; } #mprod-related .sp-info > h4 > a:hover { color:#ffc000; } #mprod-related .sp-price { font-size:15px; } #related-products { margin:40px 0; } #related-products > h3 { margin-bottom:10px; } .related-products { margin:10px 0 } .related-product { margin-bottom:20px } /* Shopping Cart */ #check-out-steps { margin:0; padding:4px 0; float:right; } #check-out-steps li { list-style:none; display:block; float:left; } #check-out-steps .active > .indicator { background:#ffc000; color:#fff; border-color:#ffc000; } #check-out-steps li > .indicator { border:1px solid #dbdbdb; float:left; display:block; background:#fff; border-radius:50px; width:25px; height:25px; text-align:center; line-height:25px; font-size:13px; font-style:italic; } #check-out-steps li > i { margin:5px 5px 0 5px; } #cart-products { margin:40px 0; } #full-shopping-cart { } #full-shopping-cart .crumbs { margin-bottom:25px } #product-summary th.quantity { width:40px; text-align:center; padding-right:10px; } #product-summary tr.val td { max-height:95px; overflow:hidden; } #product-summary td.pimage { width:100px } #product-summary td.pimage .productitemcell { width:100px } #product-summary td.pimage img { max-width:100%; height:auto; display:block; } #product-summary td.quantity { width:40px; padding-right:15px; } #product-summary td.quantity .productitemcell { width:40px; text-align:center; } #product-summary td.quantity input { width:40px; text-align:center; } #product-summary td.quantity input { border:1px solid #ccc; padding-top:4px; padding-bottom:4px; color:#999; } #product-summary td.pname .productitemcell, #product-summary td.quantity .productitemcell, #product-summary td.ptaxrate .productitemcell, #product-summary td.ptotal .productitemcell, #product-summary td.premove .productitemcell { margin-top:20px } #order-summary small { display:block; font-size:11px; font-style:italic; text-align:center; margin:0 auto 16px auto; } #discount-area { margin-bottom:10px; } #discount-area label { font-style:normal; text-transform:uppercase; font-weight:700; font-size:14px; color:#001412; } .disc { margin-bottom:10px } .cart-field > input[type=text] { width:100%; border:1px solid #ccc; padding:5px; } .update { background:#ccc; border:0 none; color:#fff; text-transform:uppercase; font-weight:700; text-align:center; padding:5px 10px; } .shipping-summary { margin-bottom:10px } .shippingDiv { display:none; } #shippingSpan { display:block; text-transform:uppercase; color:#666; font-size:14px; font-weight:700; position:relative; margin-top:-7px; } #shippingSpan > input { padding-top:7px; padding-bottom:7px; width:100%; } /* calculate shipping */ .calc-shipping-group { display: flex; flex-wrap: wrap; justify-content: space-between; } .calc-shipping-group .btn-calculate-shipping { width: 48%; height: 100%; margin-top: 0; padding: 12px } .ship-location-input { width: 48%; } input[type="text"]#location-search { height: 50px; } input[type="text"]#location-search::placeholder { color: #666; padding-left: 10px;} .free-ship-headline { background: #2d2d2d; color: #fff; text-transform: uppercase; font-size: 20px; padding: 6px 20px; margin-bottom: 0px; } .free-ship-details { background: #f9f9f9; padding: 6px 20px;} .free-ship-subtitle { color:#333; font-size: 20px; margin-bottom: 0; } .free-ship-small { font-size: 14px;} .free-ship-group {margin-top: 20px} #auto-results { display:none; width:100%; height:auto; min-height:30px; padding:10px; background-color:#fff; border:1px solid #bfbfbf; border-top:1px dotted #bfbfbf; position:absolute; top:100%; left:0; z-index:2; margin-top:-1px; } #auto-results >div { font-weight:normal; } #auto-results >div:hover, #auto-results >div.selected { color:#ffc000; cursor:pointer; } .store-head { display:block; text-transform:uppercase; font-weight:bold; margin-top:10px; margin-bottom:2px; } #click-and-collect, #ship-work { display:none; } #cart-info-box { margin-bottom:10px; } #cart-info-box p { font-size:16px; line-height:1.45em; } #cart-info-box p:last-child { margin-bottom:20px; } .collect-select #click-and-collect { display:block; } /* .collect-select #ship-work { display:none; } .shipping-select #click-and-collect { display:none; } */ .shipping-select #ship-work { display:block; } #ShippingOptions, #shippingCountry, #shippingState { width:100%; border:1px solid #ccc; padding-top:4px; padding-bottom:4px; } #main-summary { width:93%; margin:10px auto 0 auto; } .shipping-intro p { line-height:1.4em; font-size: 13px } .fa.discount-trigger-icon { display:none; } .discount-content { display:block; -webkit-transition:all 0.45s ease-in-out; -moz-transition:all 0.45s ease-in-out; -ms-transition:all 0.45s ease-in-out;-o-transition:all 0.45s ease-in-out; transition:all 0.45s ease-in-out; } #confirmation #back-to-shop { border-radius:0; line-height:56px; padding:0; text-transform:uppercase; font-weight:700; color:#333; font-size:16px; font-family:'PT Sans', sans-serif; -webkit-transition:all 0.5s linear; -moz-transition:all 0.5s linear; -o-transition:all 0.5s linear; transition:all 0.5s linear; letter-spacing:0.02em; display:inline-block; } #confirmation #back-to-shop:hover { color:#ffc000; } /* #ShippingOptions,.shippingDiv { display:none; } */ /*#catshopbuy { display:none } #catshopbuy2 { margin:15px auto 8px }*/ .header-row { padding-bottom:20px; border-bottom:1px solid #ccc; margin-bottom:20px; } .header-row > div { text-transform:none; font-weight:bold; color:#333; font-size:14px; color:#999; } .pname > a { display:block; font-family:'PT Sans', sans-serif; color:#333; font-size:18px; font-weight:bold; margin-bottom:10px; } .pname > a:hover { color:#ffc000; } .quantity .cartInputText { width:60%; text-align:center; font-size:11px; padding-bottom:5px; padding-top:5px; } .btn-calculate-shipping { width:100%; margin-top:5px; } .btn-refresh { color:#333; font-size:17px; position:relative; top:3px; } .btn-refresh:focus, .btn-refresh:hover, .btn-refresh:active { color:#ffc000; } .premove > a { padding:6px 12px; overflow:hidden; font-style:normal; font-size:16px; font-weight:700; text-decoration: none; color:#fff; text-align:center; background:#ccc; border:1px solid #ccc; -webkit-backface-visibility:hidden; cursor:pointer; backface-visibility:hidden; -webkit-transition:all 0.5s linear 0s; transition:all 0.5s linear 0s; text-transform:uppercase; font-family:"PT Sans",sans-serif; } .premove > a:hover { background-color:#333; border-color:#333; } .product-row { margin-bottom:10px; } .pimage { } .pimage img { width:100%; max-width:100%; max-height:125px; height:125px; } .pname { } #discount-area { padding:20px; background-color:#f0f0f0; margin-bottom:15px; } #discount-area .title { display:block; color:#999; font-size:13px; font-weight:bold; text-transform:uppercase; margin-bottom:10px; } #discount-area input[type=text] { width:100%; height:56px; padding:6px 12px; font-size:13px; border-radius:0; border:1px solid #ccc; } #discount-area input[type=text]:focus { box-shadow:none; outline:none; -webkit-appearance:none; -moz-appearance:none; } #shipping-area { border-top:1px solid #ccc; border-bottom:1px solid #ccc; margin:30px 0; padding:30px 0; } .shipping-calculate { margin-top:20px; } .shipping-fee { text-align:right; margin-top:0px; text-transform: uppercase; color: #666; font-size: 14px; font-weight: 700; } .shipping-total { text-align:right; font-size:20px; } .total { display:block; text-align:right; margin:40px 0; font-family:Arial,"Helvetica Neue",Helvetica,sans-serif; display:block; font-size:24px; color:#333; line-height:1.3em; } .total small { font-size:14px; } .shippingDropDown, .pgrandtotal { display:none; } .total-order { font-weight:bold; } .actions { border-bottom:1px solid #ccc; padding-bottom:50px; } .actions a { border-radius:0; line-height:1.5em; padding:15px 30px; text-transform:uppercase; font-weight:700; color:#333; font-size:16px; font-family:'PT Sans', sans-serif; -webkit-transition:all 0.5s linear; -moz-transition:all 0.5s linear; -o-transition:all 0.5s linear; transition:all 0.5s linear; letter-spacing:0.02em; display:inline-block; text-decoration: none; } #catshopbuy { background-color:#ffc000; border-color:#ffc000; float:right; width:40%; margin-left:10px; text-align:center; display:block; } #catshopbuy:hover, #catshopbuy:active { background-color:#333; border-color:#333; color:#fff; } #catshopquote { background-color:#ccc; border-color:#ccc; margin-left:10px; position:relative; padding-left:45px; } #catshopquote:before { content:"\f0f6"; font-family:'FontAwesome'; font-style:normal; font-weight:normal; text-decoration:inherit; color:#333; font-size:16px; padding-right:0.5em; position:absolute; left:20px; -webkit-transition:all 0.5s linear; -moz-transition:all 0.5s linear; -o-transition:all 0.5s linear; transition:all 0.5s linear; } #catshopquote:hover, #catshopquote:active { background-color:#666; border-color:#666; color:#fff; } #catshopquote:hover:before { color:#fff; } #catshopclear { color:#333; padding:0 30px 15px 25px; position:relative; } #catshopclear:before { position:absolute; content:"\f014"; font-family:'FontAwesome'; font-style:normal; font-weight:normal; text-decoration:inherit; top:0; left:0; color:#333; font-size:18px; padding-right:0.5em; -webkit-transition:all 0.5s linear; -moz-transition:all 0.5s linear; -o-transition:all 0.5s linear; transition:all 0.5s linear; } #catshopclear:hover:before, #catshopclear:hover, #catshopclear:active { color:#ffc000; } #back-to-shop { color:#333; padding:0 15px 15px 0; } #back-to-shop:hover, #back-to-shop:active { color:#ffc000; } .quantity { } .punitprice,.ptaxrate { text-align:right;} .ptotal {text-align:right;} .premove { text-align:right; } #catCartDetails .cartLink { max-width:1199px; margin:0 auto; display:block; } .ui-autocomplete { position:absolute; top:0; left:0; cursor:default; } .ui-front { z-index:100; } .ui-menu { list-style:none; padding:0; margin:0; display:block; outline:none; } .ui-menu .ui-menu { position:absolute } .ui-menu .ui-menu-item { position:relative; margin:0; padding:3px 1em 3px .4em; cursor:pointer; min-height:0; list-style-image:url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7"); } .ui-menu .ui-menu-item:hover { color:#ffc000; } .ui-menu .ui-menu-divider { margin:5px 0; height:0; font-size:0; line-height:0; border-width:1px 0 0 0; } .ui-menu .ui-state-focus, .ui-menu .ui-state-active { } /* icon support */ .ui-menu-icons { position:relative } .ui-menu-icons .ui-menu-item { padding-left:2em } /* left-aligned */ .ui-menu .ui-icon { position:absolute; top:0; bottom:0; left:.2em; margin:auto 0; } /* right-aligned */ .ui-menu .ui-menu-icon { left:auto; right:0; } .ui-widget { font-family:Verdana,Arial,sans-serif; font-size:1.1em; } .ui-widget .ui-widget { font-size:1em } .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family:Verdana,Arial,sans-serif; font-size:1em; } .ui-widget-content { border:1px solid #ccc; background:#fff; color:#222; } .ui-widget-content a { color:#222 } .ui-widget-header { border:1px solid #ccc; background:#ccc; color:#222; font-weight:bold; } .ui-widget-header a { color:#222 } /* Payment Page */ #billing-details, #howHearVal { display:none } .po { } .po i { font-size:30px } .payment-type { display:none } .po.disable { opacity:0.5 } .purchase-confirmation { padding:30px 0; } #confirmation > .sign-up { font-size:12px; color:#999; font-style:italic; line-height:1.2em; margin-bottom:5px; display:block; margin-top:10px; } legend > i { font-size:18px; color:#999; } legend > i:hover { cursor:pointer; } .cc-box { background:#f0f0f0; padding:20px; margin-bottom:20px; } .cc-verify span { font-size:12px; color:#999; font-style:italic; line-height:1.2em; margin-bottom:5px; display:block; margin-top:10px; } .payment-cc-icons > i { font-size:110px; color:#f0f0f0; margin-right:1vw; } .info-tooltip-trigger.active { color:#333; } .info-tooltip { display:inline-block; position:relative; height:0px; } .info-help { opacity:0; visibility:hidden; display:inline-block; position:absolute; top:-30px; left:10px; padding:10px; background-color:#fff; border:1px solid #ccc; border-radius:6px; -webkit-box-shadow:0 5px 10px rgba(0,0,0,.2); box-shadow:0 5px 10px rgba(0,0,0,.2); z-index:1; width:400px; -webkit-transition:all 0.45s ease-in-out; -moz-transition:all 0.45s ease-in-out; -ms-transition:all 0.45s ease-in-out; -o-transition:all 0.45s ease-in-out; transition:all 0.45s ease-in-out; font-size:14px; font-style:italic; } .info-help.show { opacity:1; visibility:visible; } /* @end --------- */ /* Shipping Footer */ .shipping-footer { padding-top:50px; } .shipping-footer h3 { font-size:18px; color:#999; } .shipping-footer span, .shipping-footer p { color:#999; font-weight:bold; font-size:14px; font-family:Arial,"Helvetica Neue",Helvetica,sans-serif; padding-right:15px; } .shipping-footer-icon { margin-right:15px; float:left; margin-bottom:80px; } .shipping-footer-note.border-right { border-right:1px solid #ccc; } .shipping-footer-note { padding:0; } /* @end --------- */ /* Blog */ .blog-search-btn { padding:8px 12px; border-left-color:#fff; } .BlogTagCloud a { display:block; float:left; margin-right:8px; margin-bottom:8px; padding:4px 7px; color:#666; font-size:16px; background:#f3f3f3; } .BlogTagCloud a:hover { background-color:#ccc } #blog-archive a:link { font-size:15px; text-transform:capitalize; } .blog-recent { margin:0; padding:0; } .blog-recent li { margin:0 0 10px 0; padding:0; list-style:none; padding-bottom:10px; border-bottom:1px solid #d6d6d6; } .blog-recent a { font-size:14px; text-transform:none; color:#666; line-height:1.37em; } .blog-recent a:hover { color:#9FC52C } .blog-recent .postdate { display:block; font-size:12px; color:#999; padding-top:3px; } .blog-archive ul { margin:0; padding:0; } .blog-archive li { margin:0 0 10px 0; padding:0; list-style:none; } .blog-archive a:hover { color:#9FC52C } /* @end --------- */ /* Articles */ #advice-detail img { width: 100%; } .articles-sidebar { margin-top: 40px; } .articles-sidebar .form-control { height: 40px; } .articles-sidebar input[type=submit] { font-size: 13px; padding: 10px 20px; background: #ffc000; border: none; } .articles-sidebar .sidebar-item.sidebar-newsletter { padding: 15px; background: #2d2d2d; color:#ccce; } .articles-sidebar .sidebar-item p { color:#ccce; } .sidebar-newsletter-title { margin-top: 0px; color: white; } #sidebar-subscribe .form-group { margin-bottom: 5px; } .recent-articles-name { line-height: 1.3em; margin-bottom: 5px; color: #333; } .recent-articles-date { margin: 0; font-size: 12px; } .recent-articles a { text-decoration: none; } .article-main-content { padding-right: 30px; } @media(max-width:768px) { .articles-sidebar { margin-left: -15px; margin-right: -15px; } .article-main-content { padding-right: 15px; } } @media(min-width:769px) and (max-width:991px) { } /* Footer */ footer { padding-top:35px; } #footer-boxes { border-top:1px solid #ccc; border-bottom:1px solid #ccc; padding:} .footer-boxes { margin:0; padding:30px 0; list-style:none; display:block; width:100%; } .footer-boxes > li { display:inline-block; width:24%; vertical-align:middle; border-right:1px solid #ccc; color:#999; font-size:14px; font-weight:bold; padding:0 20px; } .footer-boxes > li:last-child { border:none; } .footer-boxes > li > a { color:#999; } .footer-boxes > li > a:hover { opacity:0.7; } .footer-box-icon { float:left; margin-bottom:15px; } .footer-box-text { display:block; margin-top:10px; line-height:1.2em; } #subscribe { margin:30px 0; } #subscribe .title { display:block; font-size:24px; color:#999; font-family:'Montserrat', sans-serif; font-weight:700; text-transform:uppercase; } #subscribe .info { display:block; font-size:12px; color:#999; } #subscribe .form-control { height:38px; border-color:#ececec; font-size:13px; color:#999; border-radius:0; margin-bottom:15px; box-shadow:none; } #subscribe .form-control.lg-field { height:56px; } #subscribe .form-control:focus { color:#999; } #subscribe .form-control::-webkit-input-placeholder { color:#999; } #subscribe .form-control:-moz-placeholder { color:#999; } #subscribe .form-control::-moz-placeholder { color:#999; } #subscribe .form-control:-ms-input-placeholder { color:#999; } #subscribe .form-control:-placeholder { color:#999; } #subscribe .btn { width:100%; } #footer-menu { border-bottom:8px solid #ffc000; } .inner-footer-menu { padding:25px 0; position:relative;width:100%; } .inner-footer-menu .bg-graphic { background:url('img/bg/palm-nine-leaves-bg.png'); background-position:center center; background-repeat:no-repeat; background-size:cover; position:absolute; bottom:0; right:0; width:33%; height:17vw; max-height:228px; } .footer-menu { margin:0; list-style:none; } .footer-menu a { display:block; font-size:14px; color:#ccc; margin-bottom:5px; 20} .footer-menu > li > a { font-weight:bold; } .footer-menu > .column-2 > a { font-size:12px; } .footer-menu-img { padding-right:10px; } .footer-menu > li:hover > img, .footer-menu li a:hover { opacity:0.7; } .sub-footer-menu { margin:0; list-style:none; } .sub-footer-menu > li > a { font-size:12px; } #footer-information { padding:25px 0; } .footer-tagline { display:block; color:#024f2b; font-size:24px; line-height:1em; font-style:italic; text-transform:uppercase; margin-bottom:20px; font-family:'Montserrat', sans-serif; font-weight:bold; } .footer-text { display:block; color:#666; font-size:12px; } .cc-icons { float:right; } .post-preview a:first-child { display:none; } .post-list .blog-post { border-bottom:1px solid #eee; margin-bottom:60px; padding-bottom:50px; } .post-list .blog-post:last-child { border-bottom:0; } .post-list #nextpage { display:none !important; } /* **************** Utility Styles **************** */ .row.no-gutter { margin-right:0; margin-left:0; } .row.no-gutter > [class^="col"], .row.no-gutter > [class*=" col"] { padding-right:0; padding-left:0; } @-webkit-keyframes bounceIn { from, 20%, 40%, 60%, 80%, to { -webkit-animation-timing-function:cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function:cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity:0; -webkit-transform:scale3d(.3, .3, .3); transform:scale3d(.3, .3, .3); } 20% { -webkit-transform:scale3d(1.1, 1.1, 1.1); transform:scale3d(1.1, 1.1, 1.1); } 40% { -webkit-transform:scale3d(.9, .9, .9); transform:scale3d(.9, .9, .9); } 60% { opacity:1; -webkit-transform:scale3d(1.03, 1.03, 1.03); transform:scale3d(1.03, 1.03, 1.03); } 80% { -webkit-transform:scale3d(.97, .97, .97); transform:scale3d(.97, .97, .97); } to { opacity:1; -webkit-transform:scale3d(1, 1, 1); transform:scale3d(1, 1, 1); } } @keyframes bounceIn { from, 20%, 40%, 60%, 80%, to { -webkit-animation-timing-function:cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function:cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity:0; -webkit-transform:scale3d(.3, .3, .3); transform:scale3d(.3, .3, .3); } 20% { -webkit-transform:scale3d(1.1, 1.1, 1.1); transform:scale3d(1.1, 1.1, 1.1); } 40% { -webkit-transform:scale3d(.9, .9, .9); transform:scale3d(.9, .9, .9); } 60% { opacity:1; -webkit-transform:scale3d(1.03, 1.03, 1.03); transform:scale3d(1.03, 1.03, 1.03); } 80% { -webkit-transform:scale3d(.97, .97, .97); transform:scale3d(.97, .97, .97); } to { opacity:1; -webkit-transform:scale3d(1, 1, 1); transform:scale3d(1, 1, 1); } } .bounceIn { -webkit-animation-name:bounceIn; animation-name:bounceIn; } /* **************** Media Query Ranges **************** */ /* Container utility queires ONLY */ @media (min-width:768px){ .responsive #banner-slides li .container { margin-left:-375px } #diy-listing-block .diy-item.psp-item {height:250px} } @media (min-width:992px){ .responsive #banner-slides li .container { margin-left:-485px } } /* Large desktops and laptops */ @media (min-width:1200px){ .banner-content { padding-top:4vw; } .primary-nav > li { margin-right:1em; } /*.owl-theme .owl-controls .owl-buttons .owl-next { right:25vw; } .owl-theme .owl-controls .owl-buttons .owl-prev { left:25vw; }*/ /* Footer */ .footer-box-icon { margin-bottom:0; } /* Large Product */ .qty-wrap { height:76px; } } /* Large desktops */ @media (min-width:1499px){ .banner-content { padding-top:10vw; width:42%; } #banner-areav2 .banner-content { padding:0; width:40%; } #banner-areav2 .banner-content h3,#banner-areav2 .banner-content h1, #banner-areav2 .banner-title { font-size:50px; } #banner-areav2 .banner-content h3.banner-title-larger,#banner-areav2 .banner-content h1.banner-title-larger, #banner-areav2 .banner-title-larger { font-size:90px; margin-top: 0} #banner-areav2 .banner-pre-title {font-weight: bold;color: #fff;font-size: 25px;margin-bottom: 0;} .banner-content.bannerv3 { padding-top:0; width:100%; } #banner-areav2.bannerv3 .banner-content { padding:0; width:90%; } #banner-areav2 .banner-content h3,#banner-areav2 .banner-content h1, #banner-areav2 .banner-title { font-size:50px; } #banner-areav2 .banner-content h3.banner-title-larger,#banner-areav2 .banner-content h1.banner-title-larger, #banner-areav2 .banner-title-larger { font-size:90px; margin-top: 0} #banner-areav2 .banner-pre-title {font-weight: bold;color: #fff;font-size: 25px;margin-bottom: 0;} } @media (min-width:1560px) { #bbq-location-bar { background: #44d0d2 url('../images/garden-lovers/grass-trees-bg.png') no-repeat center; background-size: contain;} } @media (min-width:1900px){ #advice-banner h1 { font-size:3vw; } #advice-banner .banner-content { padding-top:5vw; } #strip-banner .banner-content.single-title { padding-top:5vw; } #strip-banner .banner-content { width:80%; } } /* Menu Controller */ /* -------------- */ @media only screen and (max-width:991px) { body.nav-on-left.overflow-hidden { overflow:hidden; } /*main.nav-is-visible, header.nav-is-visible { -webkit-transform:translateX(-100%); -moz-transform:translateX(-100%); -ms-transform:translateX(-100%); -o-transform:translateX(-100%); transform:translateX(-100%); } .nav-on-left main.nav-is-visible, .nav-on-left header.nav-is-visible { -webkit-transform:translateX(100%); -moz-transform:translateX(100%); -ms-transform:translateX(100%); -o-transform:translateX(100%); transform:translateX(100%); } */ .nav-on-left .logo { left:auto; right:5%; } .nav-on-left .header-buttons { right:auto; left:5%; } .nav-on-left .header-buttons li { float:right } .nav-on-left .primary-nav, .nav-on-left .primary-nav ul { right:auto; left:0; } .primary-nav { visibility:hidden; z-index:10; -webkit-transform:translateX(100%); -moz-transform:translateX(100%); -ms-transform:translateX(100%); -o-transform:translateX(100%); transform:translateX(100%); } .primary-nav.nav-is-visible { visibility:visible; -webkit-transform:translateX(0px); -moz-transform:translateX(0px); -ms-transform:translateX(0px); -o-transform:translateX(0px); transform:translateX(0px); } .primary-nav .first-child { padding-top:50px; } /*.overlay.is-visible { -webkit-transform:translateX(-100%); -moz-transform:translateX(-100%); -ms-transform:translateX(-100%); -o-transform:translateX(-100%); transform:translateX(-100%); } .nav-on-left .overlay.is-visible { -webkit-transform:translateX(100%); -moz-transform:translateX(100%); -ms-transform:translateX(100%); -o-transform:translateX(100%); transform:translateX(100%); }*/ .overlay.is-visible.search-is-visible, .nav-on-left .overlay.is-visible.search-is-visible { -webkit-transform:translateX(0px); -moz-transform:translateX(0px); -ms-transform:translateX(0px); -o-transform:translateX(0px); transform:translateX(0px); } .has-children > a, .go-back a { position:relative } .has-children > a::before, .has-children > a::after, .go-back a::before, .go-back a::after { content:''; position:absolute; top:50%; margin-top:-1px; display:inline-block; height:2px; width:10px; background:#fff; -webkit-backface-visibility:hidden; backface-visibility:hidden; } .has-children > a::before, .go-back a::before { -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -ms-transform:rotate(45deg); -o-transform:rotate(45deg); transform:rotate(45deg); } .has-children > a::after, .go-back a::after { -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -ms-transform:rotate(-45deg); -o-transform:rotate(-45deg); transform:rotate(-45deg); } .has-children > a { padding-right:40px } .has-children > a::before, .has-children > a::after { right:20px; -webkit-transform-origin:9px 50%; -moz-transform-origin:9px 50%; -ms-transform-origin:9px 50%; -o-transform-origin:9px 50%; transform-origin:9px 50%; } .primary-nav .go-back a { padding-left:40px } .primary-nav .go-back a::before, .primary-nav .go-back a::after { left:20px; -webkit-transform-origin:1px 50%; -moz-transform-origin:1px 50%; -ms-transform-origin:1px 50%; -o-transform-origin:1px 50%; transform-origin:1px 50%; } .close-menu { display:block; } .primary-nav a, .primary-nav ul a { border-bottom:0 none; color:#fff; font-family:'PT Sans', sans-serif; font-weight:bold; font-size:17px; } .primary-nav li { width:320px; margin:0 auto; list-style:none; border-bottom:1px solid #e4ac00; } .primary-nav li.primary-description { position:absolute; top:0; width:100%; background:#e4ac00; padding-left:0; } .primary-info { text-align:center; } .primary-img, .primary-tooltip { display:none; } /* Header */ #cart-summary { right:15px; } #main-header { height:57px; } #logo { left:50%; margin-left:-94px; } #logo img { height:57px; width:auto; } #closest-location { margin-top:5px; } #closest-location .fa { font-size:30px; margin:0; } .location-dropdown { margin-top:7px; } #location-btn { margin-right:20px; padding:0; border-radius:0; border:0 none; } #location-btn::before, #location-btn::after { display:none; } .header-buttons { left:15px; width:80px; } .nav-is-visible .header-buttons { z-index:11; } .nav-trigger .line { } .nav-is-visible .nav-trigger .line { background:#fff; } #location-btn .location-label { display:none; } .contact-number { } .contact-phone { display:none; } .contact-icon { display:block; margin:5px 70px 0 20px; } .search { top:57px; } #head-location-dropdown { top:44px; left:-143px; } body.tablet .search-trigger, body.phone .search-trigger { top:-20px; position:relative; } /* Home - Grids */ .grid { margin:0; height:285px;border:1px solid #fff; } .grid-item { height:auto; } .grid figure { height:285px; margin:0;} /* Location Detail */ #contact-form.location-enquiry .form-control { margin-bottom:20px; } /* Product - Detail View */ .prod-img-wrap { margin-bottom:10px; max-width:580px; } #product-content .tab-nav li { float:left; } #product-content .tab-nav a { text-align:left; padding:10px 7px; font-size:11px; } #product-content .tab-group { border:1px solid #ddd; } .shipping-footer-note.border-right { border-bottom:1px solid #ccc; padding-bottom:15px; margin-bottom:15px; border-right:transparent; } .shipping-footer-icon { margin-bottom:40px; } .rate-product { width:180px; } .qty-wrap { padding:10px 15px; } .addtocart { padding:20px; } /* Shopping Cart */ .actions a { padding:15px 20px; } .total, .shipping-total { margin-right:0; text-align:right; } .addtocart { padding:23px; } #qty { width:150px; } .calc-shipping-group .btn-calculate-shipping {width: 100%; margin-top: 5px;} .ship-location-input {width: 100%;} .free-ship-group {margin-top: 20px;} /* Social */ #sidebar .fb-page { margin:0 0 40px 0; } /* Shopping Cart Buttons */ #catshopquote { margin:0; padding:15px 20px; font-size:14px; background-color:transparent; } #catshopquote:before { left:0px; } #catshopquote:hover, #catshopquote:hover:before, #catshopquote:active { background-color:transparent; color:#ffc000; } #catshopbuy { width:50%; } #back-to-shop { font-size:12px; } #catshopclear { padding:0 15px 15px 15px; } #catshopclear, #catshopclear:before { font-size:14px; } .info-tooltip { display:block; width:100%; } .info-help { top:0; left:0; } #logout-btn-box { right:15px } } /* -------------- */ @media only screen and (min-width:820px) { .hero-sub-heading { /* height: 72px; line-height: 72px; padding: 0 15px; */} } @media only screen and (min-width:992px) { #bbq-location-bar h2 { font-size: 3vw;} #bbq-location-bar .fa { font-size: 30px;} #main-header { height:126px; } header::after { clear:both; content:""; display:table; } #logo { top:18px; left:15px; z-index:5; } .header-buttons { top:60px; right:12px; } .nav-trigger { display:none } .primary-nav { position:relative; padding:0 46px 10px; margin:0; height:auto; width:auto; float:right; overflow:visible; background:transparent; width:100%; text-align:right; z-index:4; } .primary-nav::after { clear:both; content:""; display:table; } .primary-nav.moves-out > li > a { -webkit-transform:translateX(0px); -moz-transform:translateX(0px); -ms-transform:translateX(0px); -o-transform:translateX(0px); transform:translateX(0px); opacity:1; } .primary-nav ul { position:static; height:auto; width:auto; background:transparent; overflow:visible; z-index:4; } .primary-nav ul.is-hidden { -webkit-transform:translateX(0px); -moz-transform:translateX(0px); -ms-transform:translateX(0px); -o-transform:translateX(0px); transform:translateX(0px); } .primary-nav ul.moves-out > li > a { -webkit-transform:translateX(0px); -moz-transform:translateX(0px); -ms-transform:translateX(0px); -o-transform:translateX(0px); transform:translateX(0px); opacity:1; } .primary-nav > li { display:inline-block; margin-right:0; list-style:none; padding:0; } .primary-nav > li.li-selected { position:static; } .primary-nav > li > a { position:relative; display:inline-block; font-family:'PT Sans', sans-serif; font-weight:bold; font-size:17px; height:59px; line-height:59px; padding:0 10px; color:#666; overflow:visible; border-bottom:none; -webkit-transition:color 0.3s, box-shadow 0.3s; -moz-transition:color 0.3s, box-shadow 0.3s; transition:color 0.3s, box-shadow 0.3s; } .primary-nav > li > a:hover { color:#ffc000; text-decoration:none; } .primary-nav > li.active > a { color:#ffc000; } .primary-nav > li > a.selected { color:#024F2B; text-decoration:none; } .primary-nav .go-back, .primary-nav .see-all { display:none } .primary-nav .secondary-nav, .primary-nav .nav-gallery, .primary-nav .nav-icons { position:absolute; top:100%; width:100%; background:#f9f9f9; padding:35px 20px 0 20px; -webkit-transform:translateX(0px); -moz-transform:translateX(0px); -ms-transform:translateX(0px); -o-transform:translateX(0px); transform:translateX(0px); -webkit-transition:opacity .3s 0s, visibility 0s 0s; -moz-transition:opacity .3s 0s, visibility 0s 0s; transition:opacity .3s 0s, visibility 0s 0s; border-top:1px solid #d3d1c8; text-align:left; } .primary-nav .secondary-nav.simple-menu { width:100%; left:0; padding:20px; margin:0; } .primary-nav .secondary-nav::after, .primary-nav .nav-gallery::after, .primary-nav .nav-icons::after { clear:both; content:""; display:table; } .primary-nav .secondary-nav.is-hidden, .primary-nav .nav-gallery.is-hidden, .primary-nav .nav-icons.is-hidden { opacity:0; visibility:hidden; -webkit-transition:opacity .3s 0s, visibility 0s .3s; -moz-transition:opacity .3s 0s, visibility 0s .3s; transition:opacity .3s 0s, visibility 0s .3s; } .primary-nav .secondary-nav > .see-all, .primary-nav .nav-gallery > .see-all, .primary-nav .nav-icons > .see-all { display:block; position:absolute; left:0; bottom:0; height:80px; width:100%; overflow:hidden; /* reset some inherited style */ margin:0; padding:0; } .primary-nav .secondary-nav > .see-all a, .primary-nav .nav-gallery > .see-all a, .primary-nav .nav-icons > .see-all a { position:absolute; width:100%; height:100%; top:0; left:0; font-size:2.2rem; font-weight:bold; text-align:center; line-height:80px; border-top:1px solid #e2e3df; /* reset some inherited style */ border-bottom:none; margin:0; padding:0; -webkit-transition:color 0.2s, background 0.2s, border 0.2s; -moz-transition:color 0.2s, background 0.2s, border 0.2s; transition:color 0.2s, background 0.2s, border 0.2s; } .primary-nav .secondary-nav > .see-all a:hover, .primary-nav .nav-gallery > .see-all a:hover, .primary-nav .nav-icons > .see-all a:hover { background:#2e3233; border-color:#2e3233; color:#fff; } .primary-nav .secondary-nav > li { list-style:none; height:auto; width:22%; float:left; margin-right:2.66%; overflow:hidden; overflow-x:hidden; overflow-y:auto; -webkit-overflow-scrolling:touch; border-bottom:1px solid #afafaf; margin-bottom:0.6em; } .primary-nav .secondary-nav > li:last child, .primary-nav .secondary-nav > li.last-child { margin-right:0; border-right:none; } .primary-nav .secondary-nav.simple-menu > li { width:100%; height:auto; float:none; margin:0; border:0 none; } .primary-nav .secondary-nav > li.primary-description { position:relative; height:100%; width:48%; margin:0; border:0 none; } .primary-img { display:inline-block; max-width:50%; } .primary-info { display:inline-block; width:45%; padding-left:10px; vertical-align:bottom; } .primary-nav .secondary-nav > li.primary-description > .primary-info > .primary-title { display:inline-block; font-size:24px; color:#024f2b; text-transform:uppercase; font-family:'Montserrat', sans-serif; font-weight:bold; white-space:normal; overflow:visible; line-height:1.2em; text-shadow:none; } .primary-nav .secondary-nav > li.primary-description > .primary-info > .primary-title:hover { color:#FFC000; } .primary-tooltip { display:inline-block; font-size:11px; color:#999; line-height:1.4em; font-style:italic; margin:20px 0; } .primary-nav .secondary-nav > li > a { color:#000; font-size:1.6rem; margin-bottom:.6em; } .primary-nav .secondary-nav > li > a { font-size:1.4rem; color:#666; position:relative; } .primary-nav .secondary-nav > li > a:after { content:"\f105"; font-family:FontAwesome; font-style:normal; font-weight:normal; text-decoration:inherit; position:absolute; right:0; } .primary-nav .secondary-nav a { height:30px; line-height:30px; padding:0 18% 0 0; color:#2e3233; border-bottom:none; font-size:1.4rem; text-shadow:1px 0 0 transparent; -webkit-transition:text-shadow 3s ease; -moz-transition:text-shadow 3s ease; transition:text-shadow 0.3s ease; } .primary-nav .secondary-nav a:hover { text-shadow:1px 0 0 #333; } .primary-nav .secondary-nav > li > a:hover:after { color:#333; } .primary-nav .secondary-nav ul { margin:0; padding:0; -webkit-transform:translateZ(0px); -moz-transform:translateZ(0px); -ms-transform:translateZ(0px); -o-transform:translateZ(0px); transform:translateZ(0px); list-style:none; } .primary-nav .secondary-nav ul ul { position:absolute; top:0; left:0; height:100%; width:100%; list-style:none; } .primary-nav .secondary-nav ul ul.is-hidden { -webkit-transform:translateX(100%); -moz-transform:translateX(100%); -ms-transform:translateX(100%); -o-transform:translateX(100%); transform:translateX(100%); } .primary-nav .secondary-nav ul ul .go-back { display:block } .primary-nav .secondary-nav ul ul .go-back a { color:transparent } .primary-nav .secondary-nav ul ul .see-all { display:block } .primary-nav .secondary-nav .moves-out > li > a { -webkit-transform:translateX(-100%); -moz-transform:translateX(-100%); -ms-transform:translateX(-100%); -o-transform:translateX(-100%); transform:translateX(-100%); } .primary-nav .nav-gallery li { /* set here number of columns - use width percentage */ width:22%; float:left; margin:0 4% 40px 0; } .primary-nav .nav-gallery li:nth-child(4n+2) { /* +2 because we have two additional list items with display:none */ margin-right:0; } .primary-nav .nav-gallery .nav-item { border-bottom:none; padding:0; height:auto; line-height:1.2; } .primary-nav .nav-gallery .nav-item img { position:static; margin-top:0; height:auto; width:100%; margin-bottom:.6em; } .primary-nav .nav-gallery .nav-item h3 { color:#000; font-weight:bold; padding:0 .4em; } .primary-nav .nav-icons li { /* set here number of columns - use width percentage */ width:32%; float:left; margin:0 2% 20px 0; } .primary-nav .nav-icons li:nth-child(3n+2) { /* +2 because we have two additional list items with display:none */ margin-right:0; } .primary-nav .nav-icons .nav-item { border-bottom:none; height:80px; line-height:1.2; padding:24px 0 0 85px; position:relative; } .primary-nav .nav-icons .nav-item:hover { background:#f6f6f5 } .primary-nav .nav-icons .nav-item h3 { color:#000; font-weight:bold; } .primary-nav .nav-icons .nav-item p { display:block } .primary-nav .nav-icons .nav-item::before { left:25px } .no-js .primary-nav { position:absolute; z-index:3; display:inline-block; width:auto; top:0; right:150px; padding:0; } .no-js .nav-is-fixed .primary-nav { position:fixed } .primary-nav > .close-menu, .primary-nav .secondary-nav > .close-menu { display:none; } .sub-menu-bg { width:100%; top:126px; position:absolute; background:#f9f9f9; border-top:1px solid #d3d1c8; z-index:3; -webkit-transform:translateX(0px); -moz-transform:translateX(0px); -ms-transform:translateX(0px); -o-transform:translateX(0px); transform:translateX(0px); -webkit-transition:opacity .3s 0s, visibility 0s 0s; -moz-transition:opacity .3s 0s, visibility 0s 0s; transition:opacity .3s 0s, visibility 0s 0s; } .sub-menu-bg.is-hidden { opacity:0; visibility:hidden; -webkit-transition:opacity .3s 0s, visibility 0s .3s; -moz-transition:opacity .3s 0s, visibility 0s .3s; transition:opacity .3s 0s, visibility 0s .3s; } .launch-into-spring-orange .btn-row {padding-top: 20px;} .spring-info-row { padding-top: 40px; padding-bottom: 60px;} .launch-into-spring-orange #banner-areav2 .spring-banner h3 {font-size:3.1vw;} .launch-into-spring-orange #banner-areav2 .spring-banner p {font-size:2vw;} .launch-into-spring-orange #banner-areav2 .spring-banner span {font-size:2vw;} .hero-sub-heading span { font-size: 4vw; } .spring-text-info {/* position: absolute; */ /* top: 50%; */width: 100%; padding:0 10%;} .launch-into-spring-orange .btn-row hr { display: inline-block; } .launch-into-spring-orange .icon {height: 48px; width: 87px;} .launch-into-spring-orange .btn-row .btn-container { width: 23%; } .map-details h2 {font-size: 39px;} #main-content .spring-video-container h2 { text-transform: uppercase; font-size: 45px;} } @media only screen and (min-width:1199px){ .feature-left-side {background: url("../images/spring-bbq/details-bg.png") bottom no-repeat; background-size: contain} .spring-video-section { background: url('../images/spring-bbq/video-background.png') no-repeat 32px 100%;} } /* Portrait tablets and medium desktops */ @media (min-width:992px) and (max-width:1199px){ } /* Portrait tablets and small desktops */ @media (min-width:768px) and (max-width:991px){ form .col-sm-6 input[type=text], form .col-sm-6 input[type=password], form .col-sm-6 select, form .col-sm-6 textarea { margin-bottom:15px } #logo { left:15%; margin:0; } /* Banners */ .banner-content { width:90%; padding-top:3vw; } .banner-content .banner-text { margin:30px 0; } .owl-theme .owl-controls .owl-buttons .owl-prev { left:0vw; } .owl-theme .owl-controls .owl-buttons .owl-next { right:0vw; } /* Breadcrumbs */ .breadcrumbs > a { font-size:12px; } #breadcrumbs-bar .cat-back { display:none; } /* Footer */ .inner-footer-menu .bg-graphic { width:20%; height:10vw; } .footer-boxes > li { padding:0 5px 0 20px; height:130px; } .footer-box-icon { margin:0; float:none; } /* Catalogue List View */ .catalogueItem, .catalogueItemLast { width:33.333%; } #cat-header > h1 { font-size:24px; } /* Product List */ .small-product { max-width:285px; width:100%; margin:0 auto 20px auto; } .productSmall .productItem, .productSmall .productItemLast { width:32.33% !important; } .productItemLast { margin-right:1% !important; } /* Shopping Cart */ .pimage img { width:100%; max-width:100%; max-height:95px; height:95px; } .quantity .cartInputText { width:100%; } .btn-refresh { top:-33px;left:40px; } #banner-areav2 .banner-slide.tablet-left { background-position:left center; } #banner-areav2 .banner-slide.tablet-centre { background-position:center center; } #banner-areav2 .banner-slide.tablet-right { background-position:right center; } .diy-img { max-height: 210px; } } /* Landscape phones and portrait tablets */ @media (max-width:767px){ .responsive-table table, .responsive-table thead, .responsive-table tbody, .responsive-table th, .responsive-table td, .responsive-table tr { display:block } .responsive-table thead tr { position:absolute; top:-9999px; left:-9999px; } .responsive-table tr { border:0 none } .responsive-table td { border:none; position:relative; text-align:center; } form .col-xs-12 input[type=text], form .col-xs-12 input[type=password], form .col-xs-12 select, form .col-xs-12 textarea { margin-bottom:15px } #product-summary td.quantity { width:auto } #product-summary td.pimage { width:auto; text-align:center; } #product-summary td.pimage img { margin:0 auto } /* Home */ body.home h1 { margin-top:20px; } /* Header */ #main-header { height:112px; } .search-trigger { display:none; } #search { visibility:visible; opacity:1; border-top:1px solid #d3d1c8; border-bottom:1px solid #d3d1c8; } .search input { margin:15px 0; } .search-close { display:none; } #cart-summary { right:0; } #cart-summary.cart-active { width:100%; } #cart-summary-order { height:100vh; } .cart-active #cart-summary-order { width:100%; } .header-buttons { left:5px; } .contact-icon { margin:5px 50px 0 20px; } .location-dropdown { margin-top:9px; } #location-btn { margin-right:15px; } #location-btn { border:none; background:none; margin-right:0; } #location-btn:before, #location-btn:after { display:none; } #location-btn:hover, #location-btn.active { background:none; } #logo { left:45%; margin:0 0 0 -42px; } /* Shopping Cart */ #catCartDetails > #breadcrumbs-bar { display:block; } /* Breadcrumbs */ #breadcrumbs-bar { display:none; } /* Banners */ .banner-content .banner-text { display:none; } .owl-theme .owl-controls .owl-buttons .owl-next { top:50%; right:0; } .owl-theme .owl-controls .owl-buttons .owl-prev { top:50%; left:0; } .banner-slide { height:85vw; } .banner-slide .banner-content { width:90%; padding-top:20vw; } .banner-content h3 { font-size:8vw; } .banner-content .banner-text { margin:30px 0; } #strip-banner { height:28vw; } #banner-areav2 .banner-slide { height:43vw; } #banner-areav2 .banner-content { /* padding:0; width:100%; */ } #banner-areav2 .spring-banner { /* width: initial; */} #banner-areav2 .banner-slide.tablet-left { background-position:left center; } #banner-areav2 .banner-slide.tablet-centre { background-position:center center; } #banner-areav2 .banner-slide.tablet-right { background-position:right center; } /* Advertising Boxes */ .ad-item { margin:30px auto 0 auto; max-width:360px; } .ad-item > h4 { font-size:5.5vw; } /* Main */ .grey-box .form-control { margin-bottom:20px; } /* Breadcrumbs */ .cat-back { display:none; } .breadcrumbs > a { font-size:12px; line-height:2.5em; } /* Footer */ .footer-boxes > li { padding:0; height:auto; margin-bottom:30px; width:49%; text-align:center; } .footer-boxes > li:nth-of-type(even) { border:0; } .footer-box-icon { margin:0; float:none; } .cc-icons { float:none; margin-bottom:20px; } /* Catalogue List View */ .catalogueItem, .catalogueItemLast { width:50%; margin-bottom:1%; } #cat-header > h1 { font-size:24px; width:100%; border:none; max-width:100%; } .cat-description { display:none; } .catalogueList figure.effect-honey h2 { padding-right:20%; } .catalogueList .grid figure, .catalogueList .grid { height:auto; max-height:275px; } /* eCommerce Section */ body.ot-2008 #search { display:none; } body.ot-2008 #main-header { height:57px; } #check-out-steps { float:left; } #paymentSubmit { width:100%; padding:30px 0;} #quote-submit { width:100%; padding:30px 0; } .header-row { padding:0; margin:0; border:0 none; } .pimage { width:175px; float:left; clear:both; position:relative;} .pimage img { max-width:125px; height:auto; } .pname { padding-bottom:10px;position:relative; width:auto;padding-right:30px;} .ptaxrate { display:none;} .ptotal { margin-top:10px; font-weight:bold; font-size:16px;position:relative;width:auto; } .quantity .cartInputText { width:60px; } .plabel { text-transform:none; font-weight:bold; color:#333; font-size:14px; color:#999; margin-right:10px; margin-bottom:10px; } .product-row { border-bottom:1px solid #f0f0f0; position:relative; margin-bottom:30px; padding-bottom:15px; } .product-row .product-row{ border-bottom:0px; position:relative; margin-bottom:0px;padding-bottom:0px; } .premove { position:static; } .premove > a { padding:3px 6px; position:absolute; top:0; right:5px; font-size:12px; } #discount-area input[type="text"] { max-width:320px; } #btn-discount-code { width:100%; margin-top:15px; max-width:320px; } #catshopbuy { margin:0 0 20px 0; width:100%; float:none; padding:20px; } .actions { padding-bottom:10px; position:relative; height:250px; } #back-to-shop { position:absolute; left:0; bottom:0; } #catshopclear { position:absolute; left:120px; bottom:0; } #catshopquote { width:100%; display:block; text-align:center; border:3px solid #333; color:#333; } #catshopquote:before { position:static; } #catshopquote:hover { color:#fff; background-color:#333; border-color:#333; } #catshopquote:hover:before { color:#fff; } body.phone .actions { border:0 none; } #discount-area .title { text-align:center; } .fa.discount-trigger-icon { display:inline-block; } .discount-trigger { cursor:pointer; } #discount-area .discount-trigger.active > .title, #discount-area .discount-trigger.active > .title .discount-trigger-icon { color:#333; } .discount-content { text-align:center; display:block; opacity:0; visibility:hidden; -webkit-transition:all 0.45s ease-in-out; -moz-transition:all 0.45s ease-in-out; -ms-transition:all 0.45s ease-in-out;-o-transition:all 0.45s ease-in-out; transition:all 0.45s ease-in-out; max-height:0px; } .discount-content.show { opacity:1; visibility:visible; max-height:500px; } /* Product List */ .row.no-gutter .small-product, .small-product { max-width:285px; width:100%; margin:0 auto; } .productSmall .productItem, .productSmall .productItemLast { width:49% !important;margin-right:1% !important; } /* Product - Detail */ .addtocart { margin-top:20px; width:100%; } .item-added > .title { border:0 none; padding-bottom:0; margin-bottom:0; } #related-product-slider .owl-controls .owl-buttons .owl-next, #modal-product-slider .owl-controls .owl-buttons .owl-next, #related-product-slider .owl-controls .owl-buttons .owl-prev, #modal-product-slider .owl-controls .owl-buttons .owl-prev { color:#333; font-size:24px; top:100%; } #related-product-slider .owl-controls .owl-buttons .owl-next, #modal-product-slider .owl-controls .owl-buttons .owl-next { right:0px; } /* Advice - Detail */ #advice-banner .banner-content { width:95%; } #advice-banner h1 { font-size:6vw; } #advice-banner { height:55vw; } /* Services */ .s-contact, .s-contact.first-item { border-left:0 none; padding:0 0 20px; border-bottom:1px solid #ccc; margin:0 0 20px; } /* Modal */ #large-product-modal .modal, .modal { width:90%; } #news-modal .modal{top:0px;transform:translateY(0);} .ecommerce #site, #shop, #shop > .container, .shop-area, .productList.productLarge, .productList.productLarge > productItem { position:static; } /* Locations */ #location-detail aside { max-width:300px; margin:20px auto; } .location-item { height:auto; overflow:hidden; margin-bottom:20px; } /* Mulch Images */ .mulch-images > img { width:100%; margin-bottom:10px; max-width:250px; } #logout-btn-box { right:0 } #diy-listing-block.psp-wrap, #diy-listing-block .psp-items {margin-top:0} #diy-listing-block .side-bar-container {margin-bottom:16px;padding:0 25px} .switch-container {padding:0 10px} #switch-application {margin-bottom:0} #diy-listing-block .side-bar .side-bar-title {margin-bottom:0} #diy-listing-block .side-bar .side-bar-title a i {display:block;font-size:1.2em;line-height:40px;position:absolute;right:0;top:0} #diy-listing-block .side-bar ul {display:none} .diy-img { max-height: 260px; } } /* Landscape phones and smaller */ @media (max-width:480px){ /* Header */ #logo img { width:90px; height:auto; margin-top:5px; } .location-dropdown { margin-top:9px; } #location-btn { border:none; background:none; margin-right:0; } #location-btn:before, #location-btn:after { display:none; } #location-btn:hover, #location-btn.active { background:none; } .cart-close { display:none; } .cart-active .cart-close { display:block; } #cart-summary { transition:none; -webkit-transition:none; } .primary-nav li { width:100%; padding-left:30px; } #logo { left:15%; margin:0; } /* Home - Grids */ .grid-wrap .grid figure img { width:auto; min-height:100%; } .grid-wrap .grid, .grid-wrap .grid figure { height:145px; } .grid-wrap h1, .grid-wrap h3 { font-size:8vw; line-height:1em; } .grid-wrap .view-all, #diy .view-all { float:none; margin:5px 0; display:inline-block; } .grid figure h2 { font-size:14px; padding-right:10px; } /* Home */ #home-store-finder h3, #diy h3 { font-size:8vw; } .product-feature-item, .owl-item:first-child > .product-feature-item { margin:0 auto;} /* Banners */ .banner-slide { height:85vw; } .banner-slide .banner-content { padding-top:20vw; } .banner-content h3 { font-size:8vw; } .banner-content .banner-text { display:none; } #strip-banner { height:65vw; } #strip-banner .banner-title { font-size:8vw; } #strip-banner .banner-content { width:90%; padding-top:12vw; } .owl-theme .owl-controls .owl-buttons .owl-next { top:50%; right:0; } .owl-theme .owl-controls .owl-buttons .owl-prev { top:50%; left:0; } .responsive-table table, .responsive-table table thead, .responsive-table table tbody, .responsive-table table th, .responsive-table table td, .responsive-table table tr { display:block } .responsive-table table thead tr { position:absolute; top:-9999px; left:-9999px; } .responsive-table table tr { border:0 none; position:relative; border-bottom:1px solid #ccc; margin-bottom:10px; padding-bottom:10px; } .responsive-table table tr td { border:0 none; position:relative; padding-left:0; } form .col-xs-12 input[type=text], form .col-xs-12 input[type=password], form .col-xs-12 select, form .col-xs-12 textarea { margin-bottom:15px } #banner-areav2 .banner-slide { height:65vw; } #banner-areav2 .banner-content { padding:0; width:100%; } #banner-areav2 .banner-slide.phone-left { background-position:left center; } #banner-areav2 .banner-slide.phone-centre { background-position:center center; } #banner-areav2 .banner-slide.phone-right { background-position:right center; } .bscroll-down { display:block; } /* Catalogue List */ .catalogueList { margin:0 0 10px 0; } .catalogueItem, .catalogueItemLast { width:50%; list-style:none; float:left; padding-right:1%; margin-bottom:0; } .catalogueItem .grid figure img { width:100%; min-height:0px; max-height:220px; } .catalogueItem .grid figure { height:auto; max-height:220px; } #cat-header > h1 { margin:0; } /* Product List */ .small-product { max-width:285px; width:100%; margin:0 auto 20px auto; } .row.no-gutter .small-product { margin:0 auto 20px auto; } .productSmall .productItem, .productSmall .productItemLast { width:49% !important; margin-bottom:0; } .sp-info > h4 { height:45px; } /* Product Detail */ #product-content .tab-nav a > .prod-rating { margin:10px 0 0 0; } .review-header button { margin:20px 0 0 20px; } .mprod-img-wrap { float:none;} .mprod-img { width:100%; height:auto; margin-bottom:10px; } .mprod-info { margin:20px 0 0 0; } .order-details .btn { display:block; width:100%; margin-top:20px; } #product-content .tab-nav a > .prod-rating { display:none;} .addtocart { display:inline-block; width:100%; margin-top:20px; } #related-products { overflow:hidden; padding-bottom:50px; } #related-products .small-product { margin:20px auto; height:120%:} #related-product-slider, #modal-product-slider { position:relative; } #modal-product-slider { width:270px; margin:0 auto; } #related-product-slider .owl-controls .owl-buttons .owl-next, #modal-product-slider .owl-controls .owl-buttons .owl-next, #related-product-slider .owl-controls .owl-buttons .owl-prev, #modal-product-slider .owl-controls .owl-buttons .owl-prev { color:#333; font-size:24px; top:100%; left:50%; } #related-product-slider .owl-controls .owl-buttons .owl-next, #modal-product-slider .owl-controls .owl-buttons .owl-next { right:-45%; margin-right:-20px; } #related-product-slider .owl-controls .owl-buttons .owl-prev, #modal-product-slider .owl-controls .owl-buttons .owl-prev { left:45%; margin-left:-20px; } #product-content .tab-nav a { text-align:center; } #product-content .tab-nav li { width:25%; } /* Advice - Detail */ #advice-banner .banner-content { padding-top:12vw; } #advice-banner { height:85vw; } /* eCommerce - Shopping Cart */ #catshopbuy { text-align:center; margin:0 0 20px 0; padding:30px; } .pimage { width:90px; float:left; clear:both; position:relative;} .pimage img { max-width:110px; height:auto; } #catshopquote, #catshopclear, #back-to-shop { display:block; width:100%; margin-bottom:5px; padding-bottom:5px; } #catshopquote { padding:15px 10px; } /* Footer */ .footer-menu-img { display:none; } /* Additional Bootstrap Styles */ .col-tn-1,.col-tn-2,.col-tn-3,.col-tn-4,.col-tn-5,.col-tn-6,.col-tn-7,.col-tn-8,.col-tn-9,.col-tn-10,.col-tn-11,.col-tn-12{position:relative;min-height:1px;padding-right:15px;padding-left:15px;float:left}.col-tn-12{width:100%}.col-tn-11{width:91.66666667%}.col-tn-10{width:83.33333333%}.col-tn-9{width:75%}.col-tn-8{width:66.66666667%}.col-tn-7{width:58.33333333%}.col-tn-6{width:50%}.col-tn-5{width:41.66666667%}.col-tn-4{width:33.33333333%}.col-tn-3{width:25%}.col-tn-2{width:16.66666667%}.col-tn-1{width:8.33333333%}.col-tn-pull-12{right:100%}.col-tn-pull-11{right:91.66666667%}.col-tn-pull-10{right:83.33333333%}.col-tn-pull-9{right:75%}.col-tn-pull-8{right:66.66666667%}.col-tn-pull-7{right:58.33333333%}.col-tn-pull-6{right:50%}.col-tn-pull-5{right:41.66666667%}.col-tn-pull-4{right:33.33333333%}.col-tn-pull-3{right:25%}.col-tn-pull-2{right:16.66666667%}.col-tn-pull-1{right:8.33333333%}.col-tn-pull-0{right:auto}.col-tn-push-12{left:100%}.col-tn-push-11{left:91.66666667%}.col-tn-push-10{left:83.33333333%}.col-tn-push-9{left:75%}.col-tn-push-8{left:66.66666667%}.col-tn-push-7{left:58.33333333%}.col-tn-push-6{left:50%}.col-tn-push-5{left:41.66666667%}.col-tn-push-4{left:33.33333333%}.col-tn-push-3{left:25%}.col-tn-push-2{left:16.66666667%}.col-tn-push-1{left:8.33333333%}.col-tn-push-0{left:auto}.col-tn-offset-12{margin-left:100%}.col-tn-offset-11{margin-left:91.66666667%}.col-tn-offset-10{margin-left:83.33333333%}.col-tn-offset-9{margin-left:75%}.col-tn-offset-8{margin-left:66.66666667%}.col-tn-offset-7{margin-left:58.33333333%}.col-tn-offset-6{margin-left:50%}.col-tn-offset-5{margin-left:41.66666667%}.col-tn-offset-4{margin-left:33.33333333%}.col-tn-offset-3{margin-left:25%}.col-tn-offset-2{margin-left:16.66666667%}.col-tn-offset-1{margin-left:8.33333333%}.col-tn-offset-0{margin-left:0}.col-tn-float-right{float:right}.col-tn-float-left{float:left} #logout-btn-box { transition:none; -webkit-transition:none; } } @media only screen and (min-device-width : 375px) and (max-device-width : 667px) and (orientation : landscape){ #banner-areav2.loaded { height:calc(100vh - 112px); } #banner-areav2 .banner-slide { height:calc(100vh - 112px); } .banner-content { transform:translate(-10%, -70%); } .bscroll-down { bottom:30px; } } /* Landscape */ @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) { .bscroll-down { bottom:30px; } } .question-form label,#form-box label{} #form-box button[type='submit']{ line-height: 1.5em; padding: 15px 40px; background-color: #ffc000; border-color: transparent; border-radius: 0; text-transform: uppercase; font-weight: 700; color: #333; font-size: 16px; font-family: 'PT Sans', sans-serif; -webkit-transition: all 0.5s linear; -moz-transition: all 0.5s linear; -o-transition: all 0.5s linear; transition: all 0.5s linear; letter-spacing: 0.02em; text-decoration: none;margin-right:10px;margin-bottom:5px; } #form-box button[type='submit']:hover{#background-color: #333; color: #fff; } #news-modal .modal-content{background:url('../images/bg-news.jpg') no-repeat center center;background-size:cover;} #news-modal h3,#news-modal p{color:#fff;} #news-modal label{display:none;color:#fff;} a.link-file{display:inline-block;border:1px solid #ccc;border-radius:15px;padding:5px 20px;text-decoration:none;} a.link-file:hover{background:#f2f2f2;} .covid{ position: fixed; top: 99px; right: 30px; z-index: 999; } .covid img{max-width:100%;} @media(max-width:991px) { .covid { top: 44px; width: 100px; } } @media(max-width:767px) { body{overflow-x:hidden;} .covid { top:103px;right:10px; position:absolute;width:70px; } } a.link-job{text-decoration: none; font-weight: bold; display: block; border-top: 1px solid #eee; padding: 10px;} a.link-job:hover{background:#f2f2f2;} .btn-full{width:100%;text-align:center;margin-top:10px;padding: 15px 12px;background:#024f2b;color:#fff;} #form-box.form-career label{display: block; font-style: normal; color: #999;} #diy-listing-block.smaller-block .diy-item { height: 350px;} #form-box.smaller-box .form-control, #form-box.smaller-box .rendered-form .form-control, #form-box.smaller-box .form-control { height: 30px; margin-bottom: 5px;}#form-box.smaller-box textarea.form-control { height: 80px; } @media(max-width:1199px) { #product-search-results .small-product { margin-bottom:40px; height:350px; } } @media(max-width:1023px) { #product-search-results .small-product { margin-bottom:40px; height:400px; } } @media(max-width:767px) { #main-content img{max-width:100% !important;height:auto !important;} #product-search-results .small-product { margin-bottom:40px; height:350px; } #strip-banner .banner-title { margin-bottom:0px !important; margin-top:0px !important; } .banner-content{padding-top:30px !important;padding-bottom:30px !important;} } img.img-responsive{max-width:100%;height:auto;} .video-responsive{ overflow:hidden; padding-bottom:56.25%; position:relative; height:0;background:center center no-repeat transparent;background-size:cover;cursor:pointer; } .video-responsive iframe{ left:0; top:0; height:100%; width:100%; position:absolute; } .card-img-top{max-width:100%;} #banner-shop{overflow:hidden;height:270px; background: url(img/loading.gif) no-repeat center center;} #banner-shop.loaded{height:auto;} .vid{display:inline-block;margin-left:30px;} .shadow-box{box-shadow:0 0 5px 0px #ccc;padding:20px;margin-bottom:20px;} a.contact-btn{background:#ffc000;color:#000;display:inline-block;padding:10px 20px;text-transform:uppercase;font-weight:bold;text-decoration:none;} a.contact-btn:hover{background:#999;} .s-note-cart{margin-left:60%;} .menu-location{display:none !important;} @media only screen and (max-width: 991px){.s-note-cart{margin-left:50%;}.menu-location{display: list-item !important;}} @media only screen and (max-width: 767px){.s-note-cart{margin-left:0px;}} .setcookie{margin-top:5px;color:#fff;cursor: pointer;}