.wcct_countdown_highlight_1:after,.wcct_countdown_round_fill:after,.wcct_countdown_round_ghost:after,.wcct_countdown_square_fill:after,.wcct_countdown_square_ghost:after{content:'';clear:both}.wcct_pl5{padding-left:5px}.wcct_pl10{padding-left:10px}.wcct_pr5{padding-right:5px}.wcct_pr10{padding-right:10px}.wcct_countdown_timer{margin-bottom:0;display:inline-block}.cart_totals .wcct_countdown_timer{display:block}.wcct_countdown_timer *{font-family:arial,sans-serif}.wcct_countdown_timer p:empty,.wcct_counter_bar p:empty{display:none}.wcct_countdown_timer .wcct_border_none{border-color:transparent!important}.wcct_timer_wrap{display:inline-block;margin-bottom:10px}.wcct_table{display:table;height:100%;width:100%}.wcct_table_cell{display:table-cell;vertical-align:middle}.wcct_countdown_timer .wcct_table_cell{font-size:12px;line-height:1.5;vertical-align:top}.wcct_colon_sep{padding:0 0 0 10px}.wcct_countdown_round_fill:after{display:table}.wcct_countdown_round_fill .wcct_timer_wrap *{font-family:arial,sans-serif;text-align:center}.wcct_countdown_round_fill .wcct_timer_wrap .wcct_round_wrap{position:relative;width:60px;height:60px;border-radius:50%;background:#000;color:#fff;float:left;margin:0 5px;text-align:center}.wcct_countdown_round_fill .wcct_timer_wrap .wcct_round_wrap span{display:block;max-width:80%;margin:0 auto;padding-top:8px;font-size:18px;line-height:1.2}.wcct_countdown_round_ghost:after{display:table}.wcct_countdown_round_ghost .wcct_timer_wrap *{font-family:arial,sans-serif;text-align:center}.wcct_countdown_round_ghost .wcct_timer_wrap .wcct_round_wrap{position:relative;width:60px;height:60px;border-radius:50%;border:2px solid #000;color:#000;float:left;margin:0 5px;text-align:center}.wcct_countdown_round_ghost .wcct_timer_wrap .wcct_round_wrap span{display:block;max-width:80%;margin:0 auto;padding-top:8px;font-size:18px;line-height:1.2}.wcct_countdown_square_fill:after{display:table}.wcct_countdown_square_fill .wcct_timer_wrap *{font-family:arial,sans-serif;text-align:center}.wcct_countdown_square_fill .wcct_timer_wrap .wcct_square_wrap{position:relative;width:60px;height:60px;background:#000;color:#fff;float:left;margin:0 5px;text-align:center}.wcct_countdown_square_fill .wcct_timer_wrap .wcct_square_wrap span{display:block;max-width:80%;margin:0 auto;padding-top:8px;font-size:18px;line-height:1.2}.wcct_countdown_square_ghost:after{display:table}.wcct_countdown_square_ghost .wcct_timer_wrap *{font-family:arial,sans-serif;text-align:center}.wcct_countdown_square_ghost .wcct_timer_wrap .wcct_square_wrap{position:relative;width:60px;height:60px;border:2px solid #000;color:#000;float:left;margin:0 5px;text-align:center}.wcct_countdown_square_ghost .wcct_timer_wrap .wcct_square_wrap span{display:block;max-width:80%;margin:0 auto;padding-top:8px;font-size:18px;line-height:1.2}.wcct_countdown_highlight_1:after{display:table}.wcct_countdown_highlight_1 .wcct_timer_wrap{font-family:arial,sans-serif;margin-bottom:5px}.wcct_countdown_highlight_1 .wcct_timer_wrap .wcct_highlight_1_wrap{color:#000;display:inline-block;padding:5px;text-align:center;font-size:15px;line-height:1.2}.wcct_countdown_highlight_1 .wcct_timer_wrap .wcct_highlight_1_wrap span{margin:0 auto;font-size:25px;display:inline-block}.wcct_countdown_highlight_1[data-type=single] .wcct_timer_wrap .wcct_highlight_1_wrap{padding:0 5px}.wcct_countdown_highlight_1[data-type=single] .wcct_timer_wrap .wcct_highlight_1_wrap .wcct_colon_sep{padding:0 0 0 10px}.wcct_countdown_timer.wcct_countdown_round_ghost .wcct_wrap_border,.wcct_countdown_timer.wcct_countdown_square_ghost .wcct_wrap_border{border:2px solid #000;position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px}.wcct_countdown_timer.wcct_countdown_round_fill .wcct_wrap_border,.wcct_countdown_timer.wcct_countdown_square_fill .wcct_wrap_border{border:4px solid #000;position:absolute;top:0;left:0;right:0;bottom:0}.wcct_countdown_timer.wcct_countdown_round_fill .wcct_wrap_border,.wcct_countdown_timer.wcct_countdown_round_ghost .wcct_wrap_border{border-radius:50%}.wcct_timer_wrap .wcct_highlight_1_wrap:first-child,.wcct_timer_wrap .wcct_round_wrap:first-child,.wcct_timer_wrap .wcct_square_wrap:first-child{margin-left:0}.wcct_timer_wrap .wcct_highlight_1_wrap:last-child,.wcct_timer_wrap .wcct_round_wrap:last-child,.wcct_timer_wrap .wcct_square_wrap:last-child{margin-right:0}.wcct_countdown_timer[data-type=single] p,.wcct_counter_bar[data-type=single] p{font-family:inherit;font-size:15px;margin-top:0;margin-bottom:10px}.wcct_countdown_timer[data-type=single] p:last-child,.wcct_counter_bar[data-type=single] p:last-child{margin-bottom:0}.wcct_countdown_timer[data-type=single] p span{color:#ee303c}.wcct_countdown_timer[data-type=single],.wcct_counter_bar[data-type=single]{margin-bottom:10px}.wcct_countdown_timer[data-type=grid] p,.wcct_counter_bar[data-type=grid] p{font-family:verdana,sans-serif;font-size:14px;margin-bottom:5px}.wcct_countdown_timer.wcct_countdown_default{display:block}.wcct_countdown_timer.wcct_countdown_default .wcct_timer_wrap{display:inline;font-family:inherit}.wcct_counter_bar{display:none;margin-bottom:0}.wcct_progress_aria{overflow:hidden;height:16px;max-width:320px;margin-bottom:10px;background-color:#ccc;-webkit-box-shadow:inset 0 1px 2px rgba(0,0,0,.1);box-shadow:inset 0 1px 2px rgba(0,0,0,.1)}.wcct_progress_aria .wcct_progress_bar{width:0;height:100%;background-color:#ee303c;-moz-transition:ease-in-out 1s all;-webkit-transition:ease-in-out 1s all;transition:ease-in-out 1s all;-o-transition:ease-in-out 1s all;-ms-transition:ease-in-out 1s all}.wcct_progress_aria .wcct_progress_bar.wcct_bar_orientation_rtl{width:100%}.wcct_bar_stripe .wcct_progress_bar{background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-size:40px 40px}.wcct_bar_stripe.wcct_bar_stripe_animate .wcct_progress_bar{-webkit-animation:wcct-progress-bar-stripes 2s linear infinite;animation:wcct-progress-bar-stripes 2s linear infinite;-moz-animation:wcct-progress-bar-stripes 2s linear infinite}.wcct_bar_edge_smooth{border-radius:4px;-moz-border-radius:4px;-webkit-border-radius:4px}.wcct_counter_timer_expiry p{border:1px solid #ccc;padding:5px}.wcct_timer.wcct_countdown_default .wcct_timer_wrap{padding:0}.wcct_animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.wcct_custom_text{margin-bottom:10px;display:inline-block}.wcct_custom_text p:last-child{margin-bottom:0}@-webkit-keyframes wcctEffectPulse{from,to{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}50%{-webkit-transform:scale3d(1.04,1.04,1.04);transform:scale3d(1.04,1.04,1.04)}}@keyframes wcctEffectPulse{from,to{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}50%{-webkit-transform:scale3d(1.04,1.04,1.04);transform:scale3d(1.04,1.04,1.04)}}.wcct_pulse{-webkit-animation-name:pulse;animation-name:wcctEffectPulse}@-webkit-keyframes wcct-progress-bar-stripes{from{background-position:40px 0}to{background-position:0 0}}@-o-keyframes wcct-progress-bar-stripes{from{background-position:40px 0}to{background-position:0 0}}@keyframes wcct-progress-bar-stripes{from{background-position:40px 0}to{background-position:0 0}}@media (max-width:991px){.wcct_countdown_round_fill .wcct_timer_wrap .wcct_round_wrap,.wcct_countdown_round_ghost .wcct_timer_wrap .wcct_round_wrap,.wcct_countdown_square_fill .wcct_timer_wrap .wcct_square_wrap,.wcct_countdown_square_ghost .wcct_timer_wrap .wcct_square_wrap{width:50px;height:50px;margin:0 2px}.wcct_countdown_round_ghost .wcct_timer_wrap .wcct_round_wrap{border-width:1px}.wcct_table_cell{font-size:9px}.wcct_countdown_highlight_1 .wcct_timer_wrap .wcct_highlight_1_wrap{margin:0 2px;font-size:13px}.wcct_countdown_highlight_1 .wcct_timer_wrap .wcct_highlight_1_wrap span{font-size:20px}.wcct_countdown_highlight_1 .wcct_timer_wrap .wcct_highlight_1_wrap span.wcct_pl10{padding-left:5px}}.wcct_admin_page_node .ab-sub-wrapper .ab-submenu li span.ab-item{padding:0 10px!important}.wcct_admin_page_node .ab-sub-wrapper .ab-submenu li span.ab-item a{display:inline-block!important;padding:0!important;text-decoration:underline!important}li.wcct_admin_page_node>.ab-item{background:#0073aa!important;color:#fff!important}ul#wp-admin-bar-wcct_admin_page_node-default{-webkit-column-count:2;-moz-column-count:2;column-count:2}ul#wp-admin-bar-wcct_admin_page_node-default>li{width:270px;padding:0 10px}ul#wp-admin-bar-wcct_admin_page_node-default>li>span{height:auto!important;white-space:initial!important;padding:0!important;line-height:19px!important}body.single-product li.wcct_admin_page_node .ab-sub-wrapper:before{content:"Finale Campaigns Details";padding:0 10px;text-decoration:underline;font-size:14px} .tax-product_brand .brand-description{overflow:hidden;zoom:1}.tax-product_brand .brand-description img.brand-thumbnail{width:25%;float:right}.tax-product_brand .brand-description .text{width:72%;float:left}.widget_brand_description img{box-sizing:border-box;width:100%;max-width:none;height:auto;margin:0 0 1em}ul.brand-thumbnails{margin-left:0;margin-bottom:0;clear:both;list-style:none}ul.brand-thumbnails:before{clear:both;content:"";display:table}ul.brand-thumbnails:after{clear:both;content:"";display:table}ul.brand-thumbnails li{float:left;margin:0 3.8% 1em 0;padding:0;position:relative;width:22.05%}ul.brand-thumbnails.fluid-columns li{width:auto}ul.brand-thumbnails:not(.fluid-columns) li.first{clear:both}ul.brand-thumbnails:not(.fluid-columns) li.last{margin-right:0}ul.brand-thumbnails.columns-1 li{width:100%;margin-right:0}ul.brand-thumbnails.columns-2 li{width:48%}ul.brand-thumbnails.columns-3 li{width:30.75%}ul.brand-thumbnails.columns-5 li{width:16.95%}ul.brand-thumbnails.columns-6 li{width:13.5%}.brand-thumbnails li img{box-sizing:border-box;width:100%;max-width:none;height:auto;margin:0}@media screen and (max-width:768px){ul.brand-thumbnails:not(.fluid-columns) li{width:48%!important}ul.brand-thumbnails:not(.fluid-columns) li.first{clear:none}ul.brand-thumbnails:not(.fluid-columns) li.last{margin-right:3.8%}ul.brand-thumbnails:not(.fluid-columns) li:nth-of-type(odd){clear:both}ul.brand-thumbnails:not(.fluid-columns) li:nth-of-type(even){margin-right:0}}.brand-thumbnails-description li{text-align:center}.brand-thumbnails-description li .term-thumbnail img{display:inline}.brand-thumbnails-description li .term-description{margin-top:1em;text-align:left}#brands_a_z h3:target{text-decoration:underline}ul.brands_index{list-style:none outside;overflow:hidden;zoom:1}ul.brands_index li{float:left;margin:0 2px 2px 0}ul.brands_index li a,ul.brands_index li span{border:1px solid #ccc;padding:6px;line-height:1em;float:left;text-decoration:none}ul.brands_index li span{border-color:#eee;color:#ddd}ul.brands_index li a:hover{border-width:2px;padding:5px;text-decoration:none}ul.brands_index li a.active{border-width:2px;padding:5px}div#brands_a_z a.top{border:1px solid #ccc;padding:4px;line-height:1em;float:right;text-decoration:none;font-size:.8em} /*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */ /* Document ========================================================================== */ /** * 1. Correct the line height in all browsers. * 2. Prevent adjustments of font size after orientation changes in * IE on Windows Phone and in iOS. */ html { line-height: 1.15; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ } /* Sections ========================================================================== */ /** * Remove the margin in all browsers (opinionated). */ body { margin: 0; } /** * Add the correct display in IE 9-. */ article, aside, footer, header, nav, section { display: block; } /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Firefox, and Safari. */ h1 { font-size: 2em; margin: 0.67em 0; } /* Grouping content ========================================================================== */ /** * Add the correct display in IE 9-. * 1. Add the correct display in IE. */ figcaption, figure, main { /* 1 */ display: block; } /** * Add the correct margin in IE 8. */ figure { margin: 1em 40px; } /** * 1. Add the correct box sizing in Firefox. * 2. Show the overflow in Edge and IE. */ hr { box-sizing: content-box; /* 1 */ height: 0; /* 1 */ overflow: visible; /* 2 */ } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ pre { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /* Text-level semantics ========================================================================== */ /** * 1. Remove the gray background on active links in IE 10. * 2. Remove gaps in links underline in iOS 8+ and Safari 8+. */ a { background-color: transparent; /* 1 */ -webkit-text-decoration-skip: objects; /* 2 */ } /** * 1. Remove the bottom border in Chrome 57- and Firefox 39-. * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. */ abbr[title] { border-bottom: none; /* 1 */ text-decoration: underline; /* 2 */ text-decoration: underline dotted; /* 2 */ } /** * Prevent the duplicate application of `bolder` by the next rule in Safari 6. */ b, strong { font-weight: inherit; } /** * Add the correct font weight in Chrome, Edge, and Safari. */ b, strong { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ code, kbd, samp { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font style in Android 4.3-. */ dfn { font-style: italic; } /** * Add the correct background and color in IE 9-. */ mark { background-color: #ff0; color: #000; } /** * Add the correct font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` elements from affecting the line height in * all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } /* Embedded content ========================================================================== */ /** * Add the correct display in IE 9-. */ audio, video { display: inline-block; } /** * Add the correct display in iOS 4-7. */ audio:not([controls]) { display: none; height: 0; } /** * Remove the border on images inside links in IE 10-. */ img { border-style: none; } /** * Hide the overflow in IE. */ svg:not(:root) { overflow: hidden; } /* Forms ========================================================================== */ /** * 1. Change the font styles in all browsers (opinionated). * 2. Remove the margin in Firefox and Safari. */ button, input, optgroup, select, textarea { font-family: sans-serif; /* 1 */ font-size: 100%; /* 1 */ line-height: 1.15; /* 1 */ margin: 0; /* 2 */ } /** * Show the overflow in IE. * 1. Show the overflow in Edge. */ button, input { /* 1 */ overflow: visible; } /** * Remove the inheritance of text transform in Edge, Firefox, and IE. * 1. Remove the inheritance of text transform in Firefox. */ button, select { /* 1 */ text-transform: none; } /** * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video` * controls in Android 4. * 2. Correct the inability to style clickable types in iOS and Safari. */ button, html [type="button"], /* 1 */ [type="reset"], [type="submit"] { -webkit-appearance: button; /* 2 */ } /** * Remove the inner border and padding in Firefox. */ button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; } /** * Restore the focus styles unset by the previous rule. */ button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } /** * Correct the padding in Firefox. */ fieldset { padding: 0.35em 0.75em 0.625em; } /** * 1. Correct the text wrapping in Edge and IE. * 2. Correct the color inheritance from `fieldset` elements in IE. * 3. Remove the padding so developers are not caught out when they zero out * `fieldset` elements in all browsers. */ legend { box-sizing: border-box; /* 1 */ color: inherit; /* 2 */ display: table; /* 1 */ max-width: 100%; /* 1 */ padding: 0; /* 3 */ white-space: normal; /* 1 */ } /** * 1. Add the correct display in IE 9-. * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera. */ progress { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ } /** * Remove the default vertical scrollbar in IE. */ textarea { overflow: auto; } /** * 1. Add the correct box sizing in IE 10-. * 2. Remove the padding in IE 10-. */ [type="checkbox"], [type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Chrome. */ [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } /** * 1. Correct the odd appearance in Chrome and Safari. * 2. Correct the outline style in Safari. */ [type="search"] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Remove the inner padding and cancel buttons in Chrome and Safari on macOS. */ [type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style clickable types in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /* Interactive ========================================================================== */ /* * Add the correct display in IE 9-. * 1. Add the correct display in Edge, IE, and Firefox. */ details, /* 1 */ menu { display: block; } /* * Add the correct display in all browsers. */ summary { display: list-item; } /* Scripting ========================================================================== */ /** * Add the correct display in IE 9-. */ canvas { display: inline-block; } /** * Add the correct display in IE. */ template { display: none; } /* Hidden ========================================================================== */ /** * Add the correct display in IE 10-. */ [hidden] { display: none; } /* Theme Name: Matthew Duke Photography Description: Matthew Duke Photography custom WordPress Theme Version: 1 Author: Launch Interactive Author URI: http://launchinteractive.com.au */ /** * For modern browsers * 1. The space content is one way to avoid an Opera bug when the * contenteditable attribute is included anywhere else in the document. * Otherwise it causes space to appear at the top and bottom of elements * that are clearfixed. * 2. The use of `table` rather than `block` is only necessary if using * `:before` to contain the top-margins of child elements. */ .cf:before, .cf:after { content: " "; /* 1 */ display: table; /* 2 */ } .cf:after { clear: both; } /* WordPress Presentational Classes*/ .aligncenter, .alignleft, .alignright { display:block; margin:0 auto; } .wp-caption { border:1px solid #666; text-align:center; background:#ccc; padding:10px; margin:10px } img.rounded { border-radius: 50%; shape-outside:circle(50% at calc(50% + 10px) calc(50% - 10px)); shape-margin: 10px; margin-bottom:20px; } * { box-sizing: border-box; } html { background: #333;/* Should be the same as the site footer */ } body { background: #fff; -webkit-font-smoothing: antialiased; line-height: 1.5; font-family: 'Open Sans', sans-serif; font-weight: 300; } /* ::-webkit-scrollbar ::-webkit-scrollbar-button ::-webkit-scrollbar-track ::-webkit-scrollbar-track-piece   ::-webkit-scrollbar-thumb ::-webkit-scrollbar-corner ::-webkit-resizer :horizontal :vertical :decrement :increment :start :end :double-button :single-button :no-button :corner-present :window-inactive */ ::-webkit-scrollbar { width: 12px; height: 12px; } ::-webkit-scrollbar-track { background: #ddd; } ::-webkit-scrollbar-thumb { background: #AAA; } a { color: #10466D; } a[href^=tel] { color:inherit; text-decoration: none; } .central { max-width: 1200px; padding-left: 20px; padding-right: 20px; margin: 0 auto; position: relative; text-align: justify; } img { max-width: 100%; height: auto; } hr { border-bottom: none; } .twoColumn { margin-bottom: 30px; } h1, h2, h3, h4 { margin: .8em 0; } h2 + p, h3 + p { margin-top: -.8em; } @media all and (min-width: 700px) { .central { text-align: left; } .alignleft { float:left; margin:0 20px 20px 0; } .alignright { float:right; margin:0 0 20px 20px; } .twoColumn { width: 50%; display: inline-block; vertical-align: top; margin-bottom: 0; } .twoColumn:first-of-type { padding-right:20px; } .twoColumn:last-of-type { padding-left:20px; } .twoColumn > :first-child { margin-top: 0; } .twoColumn > :last-child { margin-bottom: 0; } } .centred { text-align: center; } /* @media all and (max-width: 960px) { } @media all and (max-width: 320px) { } */ #slider { position: relative; background: #f5f5f5; } #slider .central { padding: 0; } #slider a, #slider span { display: none; height: 60vh; max-height: 66vw;/* close enough to 6:4 at 1200px */ width: 100%; -webkit-transition: opacity 0.5s linear; transition: opacity 0.5s linear; } #slider.ready a, #slider.ready span { opacity: 0; display: block; display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; } #slider a:first-child, #slider span:first-child { position: relative; display: block; display: flex; align-items: center; justify-content: center; } #slider.ready a.show, #slider.ready span.show { opacity: 1; z-index: 1; } #slider img { display: block; max-height: 100%; width: auto; /* max-width and height are set in img {} (style.css) */ margin: 0 auto; } @media all and (min-width: 1200px) { #slider a, #slider span { max-height: 800px;/* 6:4 at 1200px */ } } #siteHeader { position: sticky; top:0px; z-index: 10; background: #FFF; padding:0 20px; box-shadow: 0 0 10px -4px #000; } #siteHeader .central { padding: 0 0 20px; display: flex; align-items: stretch; flex-wrap: wrap; justify-content: center; text-align: center; } #logo { display: block; text-align: center; width: 100%; margin: 20px 0; } #logo img { vertical-align: bottom; /*To be removed when the final logo is installed*/ width: 320px; } #mainMenu { position: fixed; top: 0; right: -305px; width: 300px; height: 100vh; overflow: auto; z-index: 15; background: #fff; padding: 20px 50px 20px 20px; box-shadow: 0 0 10px -5px #000; transition: right 0.2s ease-in; } #mainMenu.visible { right: 0; transition: right 0.3s ease-out; } #mainMenu ul { list-style: none; padding: 0; margin: 0; } #mainMenu li { margin: 10px 0; } #mainMenu a { border: 2px solid #FFF; border-width: 0 0 2px; display: block; color: #999; text-decoration: none; text-transform: capitalize; height: 100%; display: flex; align-items: center; transition: border-color .3s linear; } .cartwrap, .social, #search { display: inline-flex; align-items: center; margin: 0 5px; } .cartwrap a { text-decoration: none; } .cart-contents { padding: 7px; border-radius: 3px; background: #044c77; color: #fff; height: auto; border:0; } .cart-contents::after { font-family:WooCommerce; content: "\e01d"; font-size:1em; font-style:normal; font-weight:400; padding-left:2px; vertical-align: bottom; } .social svg, #search svg { display: block; } .social path { fill: #999; } #search path, #search circle { stroke: #999; } #menuToggle { position: relative; display: inline-block; text-align: center; display: inline-flex; align-items: center; justify-content: center; width: 44px; margin: 0 10px; } #menuToggle::before { content: ' '; background: #999; height: 20px; width: 30px; } #menuToggle::after { content: ' '; position: absolute; position: absolute; top: calc(50% - 6px); border: 2px solid #fff; border-width: 4px 0; height: 12px; width: 30px; box-sizing: border-box; } #closeMenu { position: absolute; top: 5px; right: 5px; font-size: 2em; width: 44px; padding-right: 15px; } #closeMenu a { justify-content: flex-end; } #mainMenu .current-menu-item a { color: #333; border-color: #00467F; } @media(hover:hover) { #mainMenu :not(.noborder) > a:hover { color: #333; border-color: currentcolor; } .cart-contents:hover { background: #36688D; } .social a:hover path.facebook { fill: #3b5998; } .social a:hover path.instagram { fill: #fbad50; } #search:hover path, #search:hover circle { stroke: #777; } } @media all and (min-width: 601px) { .admin-bar #siteHeader { top:46px; } } @media (min-width: 660px) { #logo { display: inline-block; vertical-align: middle; width: auto; } #menuToggle { margin-left :auto; } #siteHeader .central { padding: 0; } } @media all and (min-width: 783px) { .admin-bar #siteHeader { top:32px; } } @media (min-width: 970px) { #menuToggle, #mainMenu #closeMenu { display: none; } #mainMenu { /*Undo mobile options*/ width: auto; height: auto; overflow: visible; padding: 0; box-shadow: none; position: static; display: inline-block; vertical-align: top; margin-left: auto; } #mainMenu ul { height: 100%; } #mainMenu li { display: inline-block; margin: 0 10px; height: 100%; vertical-align: top; } #mainMenu a { border-width: 5px 0 0; } } #siteFooter { background: #333; color: #ddd; padding: 0 0 20px; margin-top: 30px; text-align: center; } #siteFooter a { color: #ddd; text-decoration: none; } #siteFooter .contactDetails { width: 320px; display: inline-block; vertical-align: bottom; margin: 0; margin-top:20px; } footer .menuContent { text-align: center; margin-top: 20px; } footer nav ul.categories { columns:2; } footer nav ul { list-style: none; margin: 0; padding: 0; } #siteFooter nav li.current-menu-item > a { color: #fff; font-weight: 400; } #footerMenu { margin-top:14px; } #footerMenu li { display: inline-block; margin: 0 10px; } #footerMenu a { text-decoration: none; } #footerMenu li:first-of-type { margin-left: 0; } #footerMenu li:last-of-type { margin-right: 0; } #copyright { text-align: center; font-size: 0.9em; margin: 20px 0; color: #999; } #copyright a { color: #999; } #mailchimpForm { padding: 20px; background: #555 } #mailchimpForm h2 { margin-top:0; color: #fff; font-size: 1.3em; } #mailchimpForm label { position: relative; margin: 0 auto 10px; max-width: 500px; } #mailchimpForm input { width: 100%; padding: 7px 10px 7px 57px; border: none; } #mailchimpForm span { position: absolute; color: #555; top: 0; line-height: 2.4; left: 7px; border-right: 1px solid #ccc; padding-right: 10px; bottom: 0; font-size: 0.8em; width: 45px; text-align: left; } #mailchimpForm button { margin-top: 10px; min-width: 200px; } #paymentIcons { text-align: center; margin: 30px 0; } #paymentIcons img { width: 50px; margin-right: 10px; } #paymentIcons img:last-child { margin: 0; } @media(-moz-touch-enabled:0),(pointer:fine) { #siteFooter a:hover { color: #fff; } #copyright a:hover { color: #999; } } @media(hover:hover) { #siteFooter a:hover { color: #fff; } #copyright a:hover { color: #999; } } @media all and (min-width: 500px) { footer nav ul.categories { columns:3; } #mailchimpForm span { width: 100px; } #mailchimpForm input { padding-left: 118px; } } @media (min-width: 870px) { #mailchimpForm h2 { text-align: left; } #mailchimpForm label, #mailchimpForm button { display: inline-block; vertical-align: middle; width: calc(33.33% - 20px); margin: 0; } #mailchimpForm label { margin-right: 30px; } #mailchimpForm span { width: 45px; } #mailchimpForm input { padding-left: 65px; } } @media all and (min-width: 1000px) { #siteFooter div.central { text-align: right; } footer .menuContent { text-align: left; display: inline-block; vertical-align: bottom; width: calc(100% - 320px); } footer nav ul.categories { columns:4; } } @media (min-width: 1200px) { #mailchimpForm { padding: 20px calc(50% - 580px) 30px; } } dt.businessName, dt.address, dt.phone, dt.email { position: fixed; left: 110%; } .contactDetails dd { margin-bottom: 5px; } .contactDetails dd:last-child { margin-bottom: 0; } .contactDetails img { display: inline-block; margin-right: 5px; } .contactDetails address { display: inline; font-style: normal; } .post { margin-bottom: 20px; } .post img { display: block; } .post div { padding: 10px 20px; border: 1px solid #ddd; border-top: 0; position: relative; background:#f5f5f5; flex: 1 0 auto; } .post h2 { margin: 5px 0; } .post a { text-decoration: none; color: inherit; } .post p { margin: 0; } .post .date { margin-bottom: 5px; } #featured { height: 80vh; max-height: 66vw;/* close enough to 6:4 at 1200px */ position: relative; background: #f5f5f5; } hr#featured { height: 2vh; border: none; } #featured.small { max-height: 20vh; min-height: 30px; height: auto; overflow: hidden; display: flex; align-items: center; } #featured .central { padding: 0; height: 100%; display: flex; align-items: center; justify-content: center; } #featured img { display: block; max-height: 100%; width: auto; /* max-width and height are set in img {} (style.css) */ margin: 0 auto; } #featured.small img { max-height: none; width: 100%; } .sidebar { display: none; } @media all and (min-width: 400px) { .post h2 { padding-right: 130px; } .post .date { position: absolute; top: 20px; right: 20px; } } @media all and (min-width: 550px) { #singleTitle { padding-right: 160px; } #singleTitle + .date { position: absolute; top: 10px; margin-top: 0; right: 40px; padding: 5px 10px; } } @media all and (min-width: 850px) { #posts { display: flex; flex-wrap: wrap; } .post { display: inline-block; vertical-align: top; width: 50%; padding-right: 15px; display: flex; flex-direction: column; } .post:nth-child(even) { padding: 0 0 0 15px; } #singleTitle + .date { top: 30px; } article { width: 75%; display: inline-block; vertical-align: top; position: relative; padding-right: 40px; } .sidebar { width: 25%; display: inline-block; vertical-align: top; margin-top: 30px; background: #F5F5F5; padding: 30px 40px; border-radius: 4px; } .sidebar h3 { margin-bottom: .1em; } .sidebar > ul > li:first-of-type h3 { margin-top:0; } .sidebar ul { margin: 0; padding: 0; } .sidebar > ul { list-style: none; } .sidebar ul ul { margin-left: 1.5em; } } @media all and (min-width: 1200px) { #featured { max-height: 800px;/* 6:4 at 1200px */ } } #searchForm { position: fixed; top: 0; left: 110%; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.8); z-index: 15; padding: 50px 20px; text-align: center; font-size: 1.5em; display: flex; align-items: center; justify-content: center; } #searchForm.show { left: 0; } #searchForm input { -webkit-appearance: none; appearance: normal; border: 1px solid #999; border-width: 0 0 1px; max-width: 15em; width: 100%; padding: 5px 10px; margin-right: 20px; background: transparent; } #searchForm input:focus { background: rgba(245, 245, 245, 0.5); } #closeSearchForm { position: absolute; top: 10px; right: 20px; font-size: 2em; color: #aaa; text-decoration: none; line-height: 1; } @media(-moz-touch-enabled:0),(pointer:fine) { #closeSearchForm:hover { color: #777; } } @media(hover:hover) { #closeSearchForm:hover { color: #777; } } .pagination { text-align: center; } :not(ul).page-numbers, .woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span { display: inline-block; margin: 0 5px 15px; text-decoration: none; padding: 4px 10px; border: 1px solid #aaa; border-radius: 3px; color: #444; line-height: inherit; } span.page-numbers { color: #aaa; border-color: #ddd } .page-numbers.dots { border: 0; padding: 0; color: #444; } .next span, .prev span { display: none; } .woocommerce nav.woocommerce-pagination ul, .woocommerce nav.woocommerce-pagination ul li { border: none; } @media all and (min-width: 590px) { .next span, .prev span { display: inline; } } input:not([type=checkbox]):not([type=radio]):not([type=button]):not(.button), textarea { border: 1px solid #aaa; padding: 5px 7px; font-family: inherit;/*Normalize.css overrights the boy style*/ } textarea { resize: vertical; } label { display: block; margin-bottom: 10px; } .button, input[type=submit], input[type=reset], input[type=button], button { border: none; -webkit-appearance: none; background: #333; color: #fff; padding: 7px 15px 6px; border-radius: 3px; cursor: pointer; text-decoration: none; font-weight: 400; } .button.larger, .woocommerce .button.larger { font-size: 1.5em; background: #044c77; color:#FFF; font-weight: normal; } .woocommerce-message .button.wc-forward { background: #044c77; color: #fff; } .post-type-archive .button.larger { margin-bottom: 1em; } @media(hover:hover) { .button:hover, input[type=submit]:hover, input[type=reset]:hover, input[type=button]:hover, button:hover { background: #777; } .button.larger:hover, .woocommerce-message .button.wc-forward:hover, .woocommerce .button.larger:hover { background: #36688D; color: #fff; } } .threeColumns { margin-top: 30px; margin-bottom: 30px; } .threeColumns > .column { width: 100%; max-width: 500px; margin: 0 auto 30px; display: block; } .threeColumns > .column:last-of-type { margin-bottom: 0; } @media all and (min-width: 880px) { .threeColumns > div, .threeColumns > .column { display: inline-block; vertical-align: top; width: calc(33.33% - 20px); margin-right: 30px; margin-bottom: 0; } .threeColumns > div:last-of-type, .threeColumns > .column:last-child { margin: 0; } } .threeColumns h2 { text-align: center; } .recent a { text-decoration: none; color: inherit; } .recent h3 { margin: 0 0 5px; } .recent p { margin: 0; } .home .featured img { width: 100%; } .instagram_feed { text-align: center; margin-top:30px; margin-bottom: 15px; border-top: 1px solid #ccc; padding-top: 60px; background:url(/wp-content/themes/mdp/images/instagram-wordmark.svg) center 30px no-repeat; background-size: 100px; max-width: 730px; } .instagram_feed a { position: relative; margin:15px; display: inline-block; } .instagram_feed a > span { position: absolute; top:0; left:0; right:0; bottom:0; background: rgba(0,0,0,.5); display: none; align-items: center; justify-content: center; } .instagram_feed a:hover > span { display: flex; } .instagram_feed span span { color:#FFF; font-weight: bold; font-size: .8em; } .instagram_feed img { vertical-align: top; max-width: 110px; } .instagram_feed .likes { background:url(/wp-content/themes/mdp/images/heart.svg) center left no-repeat; background-size: 16px; padding-left:20px; margin-right: 10px; } .instagram_feed .comments { background:url(/wp-content/themes/mdp/images/comments.svg) center left no-repeat; background-size: 16px; padding-left:20px; } .homeContent { margin-top: 30px; margin-bottom: 30px; } @media all and (min-width: 500px) { .instagram_feed { max-width: 500px; } } @media all and (min-width: 880px) { .threeColumns h2 { text-align: left; } } @media all and (min-width: 1024px) { .instagram_feed { max-width: 100%; } } .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background:#333; } .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background:#000; } .woocommerce-cart table.cart td.actions .coupon .input-text { min-width: 200px; } .product_meta > span { display: block; font-size: 0.8em; } .woocommerce ul.products li.product .onsale { box-sizing: content-box; } .woocommerce .woocommerce-breadcrumb { margin-top: 30px; } #mdpTerms { font-size: 0.8em; } .pswp__caption__center { text-align: center; } .products .product a.woocommerce-loop-product__link, .featured { position: relative; display: inline-block; transform: scale(1); box-shadow: 0 0 0 0 #000; transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out; } .products .product a.woocommerce-loop-product__link:hover, .featured:hover { transform: scale(1.05); box-shadow: 2px 2px 5px -3px #000; z-index: 1 } #siteBody .products .product a h2, .featured h2 { position: absolute; background: rgba(0, 0, 0, 0.6); color: #fff; text-align: center; padding: 0.5em 15px; width: 100%; bottom: 0; margin: 0; font-size: 1em; } .woocommerce ul.products li.product a img { margin-bottom: 0; } .featured img { display: block; } .products .product { text-align: center; } .woocommerce-loop-category__title mark { display:none; } .woocommerce button.button.alt.disabled, .woocommerce button.button.alt.disabled:hover { background:#00467F; } .woocommerce div.product p.price, .woocommerce div.product span.price { color:#00467F; } .woocommerce ul.products li.product .price { color:#00467F; } .woocommerce ul.products li.product .button { margin-bottom: 10px; } @media all and (min-width: 769px) { .woocommerce-page div.product div.images { width: 58%; } .woocommerce div.product div.summary, div.product div.summary { width: 38%; } } .tallBlock { background: #333; color: #fff; padding: 20px; display: flex; flex-direction: column; margin-bottom: 30px; align-items: flex-start; } .tallBlock h1 { margin: 0; font-size: 21px; } .tallBlock > a { text-decoration: none; margin-top: auto; background: #aaa; color: #333; } @media(-moz-touch-enabled:0),(pointer:fine) { .tallBlock > a:hover { background: #eee; color: #000; } } @media(hover:hover) { .tallBlock > a:hover { background: #eee; color: #000; } } .tallBlock img { display: block; width: calc(100% + 40px); margin: 20px -20px -20px; max-width: none; } @media (min-width: 880px) { .tallBlocks { display: flex; flex-wrap: wrap; } .tallBlocks .tallBlock { display: flex; margin-bottom: 0; } } .contact_social { color: #000; } .contact_social svg { vertical-align: middle; margin-right: 10px; }