@charset "UTF-8"; /*** CONTENT ***/ /*****************************************************************/ /* /*** 00. Reset (Normalize) /*** 01. Global /*** 02. Header /*** 03. Pages / Blog / Portfolio /*** 04. Shop Categories /*** 05. Product page /*** 06. Cart /*** 07. Checkout /*** 08. Sliders /*** 09. Banners /*** 10. Lightbox /*** 11. Shortcodes /*** 12. Widgets /*** 13. Dark styles (Styles for dark backgrounds) /*** 14. Div Fixes /*** 15. Mobile styles /*** 16. Foundation Components (Grid, Buttons,Type,Forms,Alert boxes,pagination) */ /* /*****************************************************************/ /* /* /*/ /* normalize.css v2.1.2 | MIT License | git.io/normalize */ /* ========================================================================== HTML5 display definitions ========================================================================== */ /** * Correct `block` display not defined in IE 8/9. */ article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; } /** * Correct `inline-block` display not defined in IE 8/9. */ audio, canvas, video { display: inline-block; } /** * Prevent modern browsers from displaying `audio` without controls. * Remove excess height in iOS 5 devices. */ audio:not([controls]) { display: none; height: 0; } /** * Address `[hidden]` styling not present in IE 8/9. * Hide the `template` element in IE, Safari, and Firefox < 22. */ [hidden], template { display: none; } script { display: none !important; } /* ========================================================================== Base ========================================================================== */ /** * 1. Set default font family to sans-serif. * 2. Prevent iOS text size adjust after orientation change, without disabling * user zoom. */ html { font-family: sans-serif; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ } /** * Remove default margin. */ body { margin: 0; } /* ========================================================================== Links ========================================================================== */ /** * Remove the gray background color from active links in IE 10. */ a { background: transparent; } /** * Address `outline` inconsistency between Chrome and other browsers. */ a:focus { outline: thin dotted; } /** * Improve readability when focused and also mouse hovered in all browsers. */ a:active, a:hover { outline: 0; } /* ========================================================================== Typography ========================================================================== */ /** * Address variable `h1` font-size and margin within `section` and `article` * contexts in Firefox 4+, Safari 5, and Chrome. */ h1 { font-size: 2em; margin: 0.67em 0; } /** * Address styling not present in IE 8/9, Safari 5, and Chrome. */ abbr[title] { border-bottom: 1px dotted; } /** * Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome. */ b, strong { font-weight: bold; } /** * Address styling not present in Safari 5 and Chrome. */ dfn { font-style: italic; } /** * Address differences between Firefox and other browsers. */ hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0; } /** * Address styling not present in IE 8/9. */ mark { background: #ff0; color: #000; } /** * Correct font family set oddly in Safari 5 and Chrome. */ code, kbd, pre, samp { font-family: monospace, serif; font-size: 1em; } /** * Improve readability of pre-formatted text in all browsers. */ pre { white-space: pre-wrap; } /** * Set consistent quote types. */ q { quotes: "\201C" "\201D" "\2018" "\2019"; } /** * Address inconsistent and variable font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` affecting `line-height` in all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } /* ========================================================================== Embedded content ========================================================================== */ /** * Remove border when inside `a` element in IE 8/9. */ img { border: 0; } /** * Correct overflow displayed oddly in IE 9. */ svg:not(:root) { overflow: hidden; } /* ========================================================================== Figures ========================================================================== */ /** * Address margin not present in IE 8/9 and Safari 5. */ figure { margin: 0; } /* ========================================================================== Forms ========================================================================== */ /** * Define consistent border, margin, and padding. */ fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } /** * 1. Correct `color` not being inherited in IE 8/9. * 2. Remove padding so people aren't caught out if they zero out fieldsets. */ legend { border: 0; /* 1 */ padding: 0; /* 2 */ } /** * 1. Correct font family not being inherited in all browsers. * 2. Correct font size not being inherited in all browsers. * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome. */ button, input, select, textarea { font-family: inherit; /* 1 */ font-size: 100%; /* 2 */ margin: 0; /* 3 */ } /** * Address Firefox 4+ setting `line-height` on `input` using `!important` in * the UA stylesheet. */ button, input { line-height: normal; } /** * Address inconsistent `text-transform` inheritance for `button` and `select`. * All other form control elements do not inherit `text-transform` values. * Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+. * Correct `select` style inheritance in Firefox 4+ and Opera. */ button, select { text-transform: none; } /** * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` * and `video` controls. * 2. Correct inability to style clickable `input` types in iOS. * 3. Improve usability and consistency of cursor style between image-type * `input` and others. */ button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ } /** * Re-set default cursor for disabled elements. */ button[disabled], html input[disabled] { cursor: default; } /** * 1. Address box sizing set to `content-box` in IE 8/9. * 2. Remove excess padding in IE 8/9. */ input[type="checkbox"], input[type="radio"] { -moz-box-sizing: border-box; box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } /** * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome. * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome * (include `-moz` to future-proof). */ input[type="search"] { -webkit-appearance: textfield; /* 1 */ -moz-box-sizing: content-box; /* 2 */ box-sizing: content-box; } /** * Remove inner padding and search cancel button in Safari 5 and Chrome * on OS X. */ input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /** * Remove inner padding and border in Firefox 4+. */ button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } /** * 1. Remove default vertical scrollbar in IE 8/9. * 2. Improve readability and alignment in all browsers. */ textarea { overflow: auto; /* 1 */ vertical-align: top; /* 2 */ } /* ========================================================================== Tables ========================================================================== */ /** * Remove most spacing between table cells. */ table { border-collapse: collapse; border-spacing: 0; } /**********************************************************************/ /**********------------------- 01. GLOBAL ----------------*************/ /**********************************************************************/ *, *:before, *:after { -moz-box-sizing: border-box; box-sizing: border-box; } html, body { font-size: 100%; } body { background: #fff; color: #777; padding: 0; margin: 0; font-family: "Helvetica", Helvetica, Arial, sans-serif; font-weight: normal; font-style: normal; line-height: 1; position: relative; cursor: default; } a:hover { cursor: pointer; } a:focus { outline: none; } img, object, embed { max-width: 100%; height: auto; } object, embed { height: 100%; } img { -ms-interpolation-mode: bicubic; } #map_canvas img, #map_canvas embed, #map_canvas object, .map_canvas img, .map_canvas embed, .map_canvas object { max-width: none !important; } .left { float: left !important; } .right { float: right !important; } .text-left { text-align: left !important; } .text-right { text-align: right !important; } .text-center { text-align: center !important; } .text-justify { text-align: justify !important; } .hide { display: none; } .antialiased { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } img { display: inline-block; vertical-align: middle; } textarea { height: auto; min-height: 50px; } select { width: 100%; } /* -- containers / wrappers -- */ body, html { min-height: 100%; } body { background-color: #cccccc; } body.bg-full-size { background-size: cover; background-attachment: fixed; background-repeat: none; background-position: 50% 50%; } #wrapper { background-color: #ffffff; } body.full-width #wrapper { width: 100%; } body.boxed #wrapper { max-width: 71.25em; margin: 0 auto; } body.framed-layout { padding-top: 30px; padding-bottom: 40px; background-color: #555555; } body.boxed { background-color: #555555; } .page-wrapper { padding: 30px 0 30px; *zoom: 1; } .page-wrapper:before, .page-wrapper:after { content: " "; display: table; } .page-wrapper:after { clear: both; } .category-page { padding-top: 30px; } .product-page { padding-top: 30px; } .row.container { margin-bottom: 30px !important; } .row.custom-width { margin-left: auto !important; margin-right: auto !important; } .nav-dropdown { max-width: 67.5em; } .clearfix, .clear { *zoom: 1; } .clearfix:before, .clearfix:after, .clear:before, .clear:after { content: " "; display: table; } .clearfix:after, .clear:after { clear: both; } /* remove spacing before footer */ #content > .ux_banner:last-child, #content > .ux-section:last-child, #content > .iosSlider.default:last-child, #content > .ux-block:last-child > .ux-section:last-child, #content > .ux-block:last-child > .iosSlider.default:last-child { margin-bottom: 0 !important; } .ux-section-content > .row.container:last-of-type, .ux-section-content > .row.column-slider:last-of-type > .iosSlider { margin-bottom: 0 !important; } /* -- row - divided style -- */ .row.divided .columns { border-right: 1px solid rgba(0, 0, 0, 0.05); } .row.divided .columns:last-child { border: 0; } .column-inner { float: left; width: 100%; display: block; *zoom: 1; } .column-inner:before, .column-inner:after { content: " "; display: table; } .column-inner:after { clear: both; } /* -- row - boxed style -- */ .row.boxed .columns > .column-inner { background-color: #f1f1f1; padding: 30px; } /* -- top divider (shown for white header) -- */ .top-divider { border-top: 1px solid #EEE; position: relative; top: 1px; } /* -- global styles -- */ .uppercase { text-transform: uppercase; } .thin-font { font-weight: normal !important; font-weight: 300 !important; } .normal-font { font-weight: normal !important; } p:empty { display: none !important; } p.small { font-size: 95%; } .small-font { font-size: 90%; opacity: .9; } .smaller-font { font-size: 80%; opacity: .85; } .smallest-font { font-size: 70%; opacity: .85; } table { width: 100%; } .box-shadow { box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.15); } .drop-shadow { text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3); } .stick-bottom { bottom: 0 !important; top: auto; } .stick-top { top: 0 !important; bottom: auto; } .text-pull-inn { max-width: 800px; margin-left: auto; margin-right: auto; text-align: center; } /* -- social icons -- */ .social-icons { line-height: 100%; } .social-icons .icon, .yith-wcwl-share li a { position: relative; padding: 0; width: 34px; height: 34px; line-height: 31px; text-align: center; font-size: 16px; border: 2px solid #cccccc; display: inline-block; margin: 0 5px 5px 0; color: #cccccc; border-radius: 99px; -webkit-transition: "background-color" 200ms ease-out; transition: "background-color" 200ms ease-out; } .social-icons.size-small .icon, #top-bar .social-icons .icon { height: 12px; width: 13px; line-height: 1px; font-size: 12px; border: 0; padding: 0; margin-right: 5px; margin-bottom: 0; } .social-icons .icon:hover, .yith-wcwl-share li a:hover { color: #ffffff; text-decoration: none; } .social-icons .icon.icon_facebook:hover, .yith-wcwl-share li a.facebook:hover { background-color: #3a589d; border-color: #3a589d; } .social-icons .icon.icon_whatsapp:hover { background-color: #51cb5a; border-color: #51cb5a; } @media only screen and (min-width: 48em) { .social-icons .icon.icon_whatsapp { display: none; } } .social-icons .icon.icon_twitter:hover, .yith-wcwl-share li a.twitter:hover { background-color: #2478ba; border-color: #2478ba; } .social-icons .icon.icon_email:hover, .yith-wcwl-share li a.email:hover { background-color: #111111; border-color: #111111; } .social-icons .icon.icon_pintrest:hover, .yith-wcwl-share li a.pinterest:hover { background-color: #cb2320; border-color: #cb2320; } .social-icons .icon.icon_rss:hover { background-color: #fc7600; border-color: #fc7600; } .social-icons .icon.icon_twitter:hover { background-color: #2478ba; border-color: #2478ba; } .social-icons .icon.icon_tumblr:hover { background-color: #36455d; border-color: #36455d; } .social-icons .icon.icon_instagram:hover { background-color: #3b6994; border-color: #3b6994; } .social-icons .icon.icon_vk:hover { background-color: #527498; border-color: #527498; } .social-icons .icon.icon_googleplus:hover, .yith-wcwl-share li a.googleplus:hover { background-color: #dd4e31; border-color: #dd4e31; } .social-icons .icon.icon_linkedin:hover { background-color: #0072b7; border-color: #0072b7; } .social-icons .icon.icon_youtube:hover { background-color: #c33223; border-color: #c33223; } .social-icons .icon.icon_flickr:hover { background-color: #e5086f; border-color: #e5086f; } .social-icons.size-small .icon:hover { color: #000000 !important; background: none !important; } .yith-wcwl-share ul { margin-left: 0 !important; } .yith-wcwl-share li a { font-family: 'icomoon'; } .yith-wcwl-share li a.facebook:before { content: '\e002' !important; } .yith-wcwl-share li a.twitter:before { content: '\e001' !important; } .yith-wcwl-share li a.pinterest:before { content: '\e010' !important; } .yith-wcwl-share li a.googleplus:before { content: '\e00f' !important; } .yith-wcwl-share li a.email:before { content: '\e003' !important; } .product-page .social-icons { margin-bottom: 30px; } /* -- social share-row -- */ .social-icons.share-row span.title { font-weight: bold; margin-right: 5px; } .product-info .social-icons { border-top: 1px dotted #DDD; padding-top: 25px; } /* -- stars -- */ .star-rating, .star-rating { text-align: left !important; font-size: 16px; overflow: hidden; position: relative; height: 1em; line-height: 1em; width: 5.4em; font-family: "icomoon" !important; } .star-rating:before, .woocommerce-page .star-rating:before { content: '\e006 \e006 \e006 \e006 \e006'; color: #d26e4b; float: left; top: 0; left: 0; position: absolute; } .star-rating span { overflow: hidden; float: left; top: 0; left: 0; position: absolute; padding-top: 1.5em; font-weight: normal !important; } .star-rating span:before { content: '\e005 \e005 \e005 \e005 \e005'; color: #d26e4b; top: 0; position: absolute; left: 0; } li.product-small .star-rating { font-size: 80% !important; margin-bottom: 5px; } li.product-small .text-center .star-rating { margin: 0 auto 5px; } .product-info .star-rating { margin-bottom: 20px; } .text-center .star-rating { margin: 0 auto; text-align: center; } /* -- tabbed content -- */ ul.tabs { margin-left: 0 !important; } .tabbed-content { *zoom: 1; } .tabbed-content:before, .tabbed-content:after { content: " "; display: table; } .tabbed-content:after { clear: both; } .tabbed-content ul.tabs { display: block; width: 100%; overflow: hidden; margin-bottom: 10px; } .tabbed-content ul.tabs li { list-style: none; display: inline-block; vertical-align: top; } .tabbed-content ul.tabs li a { color: #999999; font-weight: bold; text-transform: uppercase; margin-right: 25px; font-size: 90%; border-top: 4px solid transparent; padding: 10px 0; display: block; -webkit-transition: border 200ms ease-out; transition: border 200ms ease-out; } .tabbed-content ul.tabs li a:hover { border-color: #777777; color: #777777; } .tabbed-content ul.tabs li.active a, .tabbed-content ul.tabs li.current_page_item a { border-color: #333333; color: #333333; } .tabbed-content.shortcode_tabgroup .tabs { border-top: 2px solid #eeeeee; } .tabbed-content .entry-content { padding-top: 0; } .shortcode_tabgroup h3 { margin-bottom: 15px; } .shortcode_tabgroup.pos_pills h3, .shortcode_tabgroup.pos_center h3 { margin-bottom: 30px; } .shortcode_tabgroup_vertical, .shortcode_tabgroup { margin-bottom: 30px; } .tabbed-content .iosSlider, .tabbed-content .product-small { margin-bottom: 0; } .tabbed-content.pos_pills > h3, .tabbed-content.pos_center > h3 { text-align: center; } .tabbed-content.pos_pills > ul.tabs, .tabbed-content.pos_center > ul.tabs { border: 0; text-align: center; } .tabbed-content.pos_pills ul.tabs li { border-right: 1px solid rgba(0, 0, 0, 0.1); } .tabbed-content.pos_pills ul.tabs li:last-child { border: 0; } .tabbed-content.pos_pills ul.tabs li a { border: 0; padding: 5px 10px; border-radius: 30px; font-size: 80%; margin: 0 15px; } .tabbed-content.pos_pills ul.tabs li.active a, .tabbed-content.pos_pills ul.tabs li.current_page_item a { background: #627f9a; color: #ffffff; } .tabbed-content.pos_pills ul.tabs { margin-bottom: 30px; } /* -- vertical tabs -- */ .vertical-tabs { padding-top: 20px; } .vertical-tabs ul.tabs-nav { margin-top: 15px; margin-left: 0; z-index: 9; border-right: 1px solid #DDD; margin-right: -1px; height: 100%; } .vertical-tabs ul.tabs-nav li { list-style: none; font-size: 90%; text-transform: uppercase; font-weight: bold; } .vertical-tabs ul.tabs-nav li a { border-bottom: 1px solid #EEE; padding: 10px 0; display: block; color: #999999; -webkit-transition: border 200ms ease-out; transition: border 200ms ease-out; } .vertical-tabs ul.tabs-nav li.current a, .vertical-tabs ul.tabs-nav li.current_page_item a, .vertical-tabs ul.tabs-nav li a:hover, .vertical-tabs ul.tabs-nav li.current-menu-item a { color: #333333; border-right: 4px solid #DDD; } .vertical-tabs .tabs-inner { border-left: 1px solid #DDD; padding-left: 40px; } .vertical-tabs .tabs-inner.active { padding-top: 5px; } .shortcode_tabgroup_vertical h3 { border-bottom: 2px solid #eeeeee; padding-bottom: 15px; margin: 0; } /* -- tab content -- */ .vertical-tabs .tabs-inner, .tabbed-content .panel { zoom: 1; float: left; visibility: hidden; height: 0; display: block; overflow: hidden; opacity: .0; -webkit-transition: opacity 0ms ease-out; transition: opacity 0ms ease-out; } .vertical-tabs .tabs-inner.active, .tabbed-content .panel.active { margin: 15px 0; float: none; line-height: 130%; visibility: visible; height: auto; overflow: visible; opacity: 1.0; -webkit-transition: opacity 300ms ease-out; transition: opacity 300ms ease-out; } /* -- accordion -- */ .accordion_title { padding-bottom: 10px; } .accordion { margin-bottom: 30px; } .accordion .accordion-inner { display: none; padding: 15px 30px 10px; } .accordion .accordion-title a { font-size: 110%; line-height: 130%; color: #999999; padding: 20px 15px; display: block; border-top: 1px solid #DDD; -webkit-transition: border 200ms ease-out; transition: border 200ms ease-out; } .accordion .accordion-title.active a { color: #333333; background-color: #f9f9f9; border-top: 3px solid #DDD; border-bottom: 1px solid #EEE; } .product-details .accordion-title.active a { background: transparent; border-width: 1px; } .large-6 .accordion-title a, .large-5 .accordion-title a, .large-4 .accordion-title a, .large-7 .accordion-title a { font-size: 95%; } .accordion .accordion-title a:before { font-family: 'icomoon'; content: '\e00c'; font-size: 16px; margin-right: 15px; } .accordion .accordion-title.active a:before { content: '\e00d'; } /* -- icon styles -- */ .span.icon-instagram { font-size: 16px; } .search-icon { font-size: 16px !important; } /* -- Avatar + extras -- */ .avatar, .circle { border-radius: 999px; } /* -- quantity box -- */ .quantity { display: inline-block; } .quantity .input-text.qty { width: 35px; height: 41px; padding: 0 5px; text-align: center; } .quantity.buttons_added { text-align: left; position: relative; white-space: nowrap; vertical-align: top; } .quantity.buttons_added input { display: inline-block; margin: 0; vertical-align: top; } .quantity.buttons_added .minus, .quantity.buttons_added .plus { padding: 7px 10px 8px; height: 41px; background-color: #ffffff; border: 1px solid #cccccc; } .quantity.buttons_added .minus { border-right: 0; } .quantity.buttons_added .plus { border-left: 0; } .quantity.buttons_added .minus:hover, .quantity.buttons_added .plus:hover { background: #eeeeee; } .quantity input::-webkit-outer-spin-button, .quantity input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } .product-info .quantity { margin-left: 10px; } /* -- message box -- */ .alert-box a.button { margin: 0 15px 0 0; display: inline-block; } .alert-box ul { margin-bottom: 0; } .alert-box li { list-style: none; } /* -- woocommerce message --*/ .woocommerce-message { color: #7a9c59 !important; font-size: 120%; position: relative; margin: 30px 0; } .woocommerce-message { padding-right: 320px; background: none !important; border: 0; } .woocommerce-message a.button { position: absolute; right: 0; font-size: 80%; padding: 10px 20px; margin-top: -8px; } .woocommerce-message:before { color: #ffffff; background: #7a9c59; border-radius: 99px; padding: 3px; font-family: 'icomoon'; content: '\e00a'; margin-right: 10px; } .single-product .woocommerce-message { margin-bottom: 0; } /* -- scroll to top -- */ #top-link { position: fixed; right: 35px; text-align: center; bottom: 10%; color: #ffffff; font-weight: bold; text-decoration: none; border-radius: 100%; background: #111111; width: 40px; height: 40px; padding: 0px 8px 6px; font-size: 32px; opacity: .9; z-index: 99; } #top-link.active { display: block; } /* -- Global UL / OL -- */ .column-inner ul, .column-inner ol, .entry-content > ul, .short-description > ul, .tabs-inner ul, .tabs-inner ol, .accordion-inner ul, .accordion-inner ol, .woocommerce > ul, .woocommerce > ol { margin-left: 20px; } ul.checkmarks li { margin-bottom: 10px; padding: 0 0 15px; border-bottom: 1px dotted #DDD; line-height: 110%; } ol.commentlist li { list-style: none; } .entry-content ol { margin-left: 20px; } #content > ul { margin-left: 20px; } ul li.bullet-checkmark, ul li.bullet-arrow, ul li.bullet-star { list-style: none; font-size: 95%; padding-bottom: 7px; } ul li.bullet-checkmark:before { color: #7a9c59; font-family: 'icomoon'; content: "\e00a" !important; font-size: 80%; padding-right: 10px; } ul li.bullet-arrow:before { color: #7a9c59; font-family: 'icomoon'; content: "\f105" !important; font-size: 80%; padding-right: 10px; } ul li.bullet-star:before { color: #7a9c59; font-family: 'icomoon'; content: "\e005" !important; font-size: 80%; padding-right: 10px; } /* -- Paginations -- */ .pagination-centered { padding-top: 20px; border-top: 1px solid #EEE; margin-bottom: 30px; } ul.page-numbers { line-height: 42px; } ul.page-numbers a, .page-numbers li > span { text-align: center; border: 2px solid #627f9a; padding: 6px 12px 7px; font-weight: bold; -webkit-transition: background 200ms ease-out; transition: background 200ms ease-out; } ul.page-numbers a:hover { background-color: #627f9a; border-color: #627f9a; color: #ffffff; } ul.page-numbers li > span { color: #ffffff; background-color: #627f9a; border-color: #627f9a; } /* -- section titles -- */ h3.section-title { margin: 0 auto 30px; max-width: 1050px; text-transform: uppercase; border-bottom: 3px solid #f1f1f1; } h3.section-title a { float: right; padding-top: 5px; font-size: 80%; } h3.section-title a:after { font-family: 'icomoon'; content: '\f105'; color: #627f9a; margin-left: 10px; } h3.section-title span { display: inline-block; position: relative; padding-bottom: 15px; border-bottom: 3px solid #DDD; margin-bottom: -3px; } h3.section-title.title_center { text-align: center; border: 0; margin-bottom: 30px; overflow: hidden; } h3.section-title.title_center span { padding: 0 15px; border: 0; } h3.section-title.title_center span:after, h3.section-title.title_center span:before { content: ' '; display: block; height: 0; border-bottom: 3px solid #EEE; width: 1000px; position: absolute; top: 50%; } h3.section-title.title_center span:before { left: -1010px; } h3.section-title.title_center span:after { right: -1010px; } h3.section-title.title_bold, h3.section-title.title_bold_center { border-width: 3px; margin-top: 50px; margin-bottom: 60px; height: 0; } h3.section-title.title_bold span, h3.section-title.title_bold_center span { border: 3px solid #EEE; padding: 8px 15px; position: relative; top: -25px; left: 15px; background-color: #ffffff; } h3.section-title.title_bold a { border: 3px solid #EEE; padding: 5px 10px; position: relative; top: -20px; right: 15px; background-color: #ffffff; } h3.section-title.title_bold_center { text-align: center; } h3.section-title.title_bold_center span { left: auto; } h3.section-title.title_divided, h3.section-title.title_divided span { text-align: center; border: 0; } h3.section-title.title_divided a { display: block; float: none; } /* -- text dividers -- */ .tx-div { display: block; height: 3px; background-color: #000000; opacity: .1; margin: 15px 0 15px; } .text-center .tx-div { margin: 15px auto 15px auto; } .text-right .tx-div { margin: 15px 0 15px auto; } .tx-div.small { width: 30px; } .tx-div.medium { width: 60px; } .tx-div.full { width: 100%; } /* -- ux image -- */ .ux-img-container img { height: auto; width: 100%; } /* -- UX BOX model (Used for different shortcodes and elements) -- */ .ux-box .inner { position: relative; } .ux-box > a { display: block; } .ux-box .ux-box-image { overflow: hidden; top: 0; } .ux-box .ux-box-image img { min-width: 100%; top: 0; position: relative; } .ux-box .ux-box-text { padding: 10px; } /* -- UX Box Texts -- */ .ux-box a { color: #777777; } .ux-box h1, .ux-box h2, .ux-box h3, .ux-box h4, .ux-box h5 { line-height: 120%; } .ux-box p { padding: 0; margin-bottom: 10px; } .ux-box h4 { margin-bottom: 5px; } .ux-box h4 span { font-size: 90%; } .ux-box .ux-box-text { font-size: 90%; } .ux-box.text-center .ux-box-text { padding-left: 5px; padding-right: 5px; } .ux-box .social-icons { margin-bottom: 15px; } /* - text circle */ .ux-box.ux-text-circle .ux-box-image { margin-left: 30px; margin-right: 30px; border-radius: 999px; } .ux-section .ux-text-circle .inner-wrap { padding-top: 30px !important; } /* boxed */ .ux-box.ux-text-boxed .inner { margin-bottom: 10px; } .ux-box.ux-text-boxed .inner-wrap { box-shadow: 1px 1px 5px 0 rgba(0, 0, 0, 0.1); -webkit-transition: box-shadow .3s; transition: box-shadow .3s; border: 1px solid #dddddd; color: #ffffff; } .ux-box.ux-text-boxed:hover .inner-wrap { box-shadow: 1px 1px 10px 0 rgba(0, 0, 0, 0.2); } .ux-box.ux-text-boxed .ux-box-text { padding: 15px; } /* - text overlay */ .ux-box.ux-text-overlay { margin-bottom: 0; } .ux-box.ux-text-overlay .ux-box-text { position: absolute; bottom: 5%; left: 15px; right: 15px; opacity: 0; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2); -webkit-transition: all 300ms ease-out; transition: all 300ms ease-out; } .ux-box.ux-text-overlay.team-member .ux-box-text { bottom: 0; } .ux-box.ux-text-overlay:hover .ux-box-text { opacity: 1; bottom: 10%; } .ux-box.post-item.ux-text-overlay:hover .ux-box-text { opacity: 1; bottom: 5px; } .ux-box.ux-text-overlay .ux-box-image { background-color: #627f9a; } .ux-box.ux-text-overlay:hover .ux-box-image img { top: 0 !important; -webkit-transform: scale(1.05); opacity: .3; } .ux-box.ux-text-overlay .ux-box-text * { color: #ffffff !important; } .ux-box.ux-text-overlay .ux-box-text .tx-div { background-color: rgba(255, 255, 255, 0.3) !important; } .ux-box.ux-text-overlay .ux-box-text.show-first { opacity: 1; } .ux-box.ux-text-overlay .show-next { opacity: 0; position: relative; bottom: -10px; } .ux-box.ux-text-overlay:hover .show-next { opacity: 1; bottom: 0; } /* - blog post overlay */ .ux-box.post-item.ux-text-overlay .ux-box-text { left: 30px; right: 30px; padding: 0 30px; } .ux-box.post-item.ux-text-overlay .from_the_blog_comments { display: none; } /* - text bounce */ .ux-box.ux-text-bounce .ux-box-text { background-color: #ffffff; position: relative; top: -3px; padding: 15px 30px; -webkit-transition: all 200ms ease-out; transition: all 200ms ease-out; } .ux-box.ux-text-bounce:hover .ux-box-text { top: -15px; background-color: #f9f9f9; } .ux-box.ux-text-bounce:hover .ux-box-image img { top: -10px; } /* - text badge */ .ux-box.ux-text-badge .ux-box-text { position: absolute; bottom: 40px; padding: 11px 0 8px; left: 0; right: 0; text-align: center; background-color: #ffffff; background-color: rgba(255, 255, 255, 0.9); } .ux-box.ux-text-badge .ux-box-text span { opacity: .5; } .slider .ux-box.ux-text-badge .ux-box-text { left: 15px; right: 15px; } .ux-box.ux-text-badge:hover .ux-box-text { background-color: #627f9a; } .ux-box.ux-text-badge:hover .ux-box-text * { color: #ffffff !important; } /* -- background / sections -- */ .ux-section { padding: 30px; position: relative; } .ux-section .blog_shortcode_text { margin-top: -20px; } .ux-section .slider-nav-reveal .flickity-prev-next-button { background: none !important; box-shadow: none !important; } .ux-section.dark h3.section-title span { border-color: #ffffff; } .ux-section .product-small .info { padding: 5px 5px 15px; } .collapse .row .column, .collapse .row .columns { position: relative; padding-left: 0; padding-right: 0; float: left; } /* -- section / boxed styles -- */ .ux-section .row.boxed .columns > .column-inner { padding: 20px 30px; } .ux-section .row.boxed .columns > .column-inner, .ux-section .product-small .info, .ux-section .ux-box .inner-wrap { background: #f1f1f1; background: rgba(255, 255, 255, 0.9); box-shadow: 0 0 9px 0 rgba(0, 0, 0, 0.1); } .dark .ux-box.ux-text-bounce .ux-box-text, .dark .ux-box.ux-text-bounce:hover.ux-box-text, .dark .row.boxed .columns > .column-inner, .ux-section.dark .product-small .info, .ux-section.dark .ux-box .inner-wrap { background-color: #333333; background-color: rgba(0, 0, 0, 0.9); } .dark .ux-box.ux-text-bounce .inner-wrap { background: none; box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none; } /* -- Select boxes */ select, .select2-container .select2-choice { font-size: 95%; color: #333333; border: 1px solid #DDD; border-radius: 0; height: 36px; padding: 0 10px; box-shadow: inset 0 -1.3em 1em 0 rgba(0, 0, 0, 0.02); background-color: #ffffff; -webkit-appearance: none; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAHCAYAAAD9NeaIAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA+hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDIxIDc5LjE1NDkxMSwgMjAxMy8xMC8yOS0xMTo0NzoxNiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczpkYz0iaHR0cDovL3B1cmwub3JnL2RjL2VsZW1lbnRzLzEuMS8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgKE1hY2ludG9zaCkiIHhtcDpDcmVhdGVEYXRlPSIyMDE1LTA0LTE3VDE3OjEyOjQyKzAyOjAwIiB4bXA6TW9kaWZ5RGF0ZT0iMjAxNS0wNC0yMFQxNzoxNjoyNCswMjowMCIgeG1wOk1ldGFkYXRhRGF0ZT0iMjAxNS0wNC0yMFQxNzoxNjoyNCswMjowMCIgZGM6Zm9ybWF0PSJpbWFnZS9wbmciIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RTU4MjBDRURERjVCMTFFNEEzN0FCODBEM0I5MTExMjkiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RTU4MjBDRUVERjVCMTFFNEEzN0FCODBEM0I5MTExMjkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo2RUVFRDJCNkREQzMxMUU0QTM3QUI4MEQzQjkxMTEyOSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpFNTgyMENFQ0RGNUIxMUU0QTM3QUI4MEQzQjkxMTEyOSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PuShL/sAAABeSURBVHjaYszOzjZnYGDYCcT8DMSBv0AcP2XKlKVEqmdgAuKTQOwOxB+JtQCIibYAZgkDkRaRZQGyJYQsItsCdEtwWUSRBdgsQbeIYgtAgAWHOMwiJSBezkAhAAgwAJSTG/DI0S9VAAAAAElFTkSuQmCC"); background-position: 100% 50%; background-repeat: no-repeat; background-size: auto 15%; border-radius: 0; } select { line-height: 30px; } .select2-container .select2-chosen { line-height: 24px; } .select2-container .select2-choice { background-image: none; } select:hover, .select2-container .select2-choice:hover { box-shadow: inset 0 -1.8em 1em 0 transparent; } /* Select Browser Hacks */ @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { select::-ms-expand { display: none; } select:focus::-ms-value { background: transparent; color: #222222; } } @-moz-document url-prefix() { select { background-image: none; } } select::-moz-focusring { color: transparent; text-shadow: 0 0 0 #000000; } /* -- Product lightbox --*/ .product-lightbox { background: #ffffff; width: 90%; max-width: 875px; margin: 0 auto; position: relative; } .product-lightbox form.custom select { visibility: visible; } .product-lightbox-inner { padding: 30px 30px 10px; } .product-lightbox p, .product-lightbox .product_meta { font-size: 90%; } .product-lightbox-inner .short-description { max-height: 220px; overflow-x: auto; } .lightbox-white { position: relative; background: #ffffff; padding: 20px; width: auto; max-width: 500px; margin: 20px auto; } /*------------------------------------*\ Loading Bar \*------------------------------------*/ .ux-loading { content: " "; z-index: 99999; font-size: 10px; position: absolute; pointer-events: none; top: 50%; left: 50%; margin-left: -15px; margin-top: -15px; text-indent: -9999em; border-top: 3px solid rgba(0, 0, 0, 0.1); border-right: 3px solid rgba(0, 0, 0, 0.1); border-bottom: 3px solid rgba(0, 0, 0, 0.1); opacity: .8; border-left: 3px solid #627f9a; -webkit-animation: spin .5s infinite linear; animation: spin .5s infinite linear; } .dark.ux-loading { border-left: 3px solid #fff !important; } .ux-loading, .ux-loading:after { border-radius: 50%; width: 30px; height: 30px; } .site-header .ux-loading, .site-header .ux-loading:after { width: 26px; height: 26px; } /* -- Loading end -- */ .flickity-enabled + .ux-loading { -webkit-animation: fadeOutRotate 1s; animation: fadeOutRotate 1s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; } @-webkit-keyframes fadeOutRotate { 0% { opacity: 1; -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { opacity: 0; -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes fadeOutRotate { 0% { opacity: 1; -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { opacity: 0; -webkit-transform: rotate(360deg); transform: rotate(360deg); } } /* -- Spin -- */ @-webkit-keyframes spin { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes spin { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } /* -- edit block links for admins -- */ .ux_block { position: relative; } .ux_block .edit-link { position: absolute; top: 25%; left: 0; z-index: 9999; background: #000000; color: #ffffff; padding: 5px; display: none; } .ux_block:hover .edit-link { display: block; } /* -- div fixes -- */ a.lost_password { margin-left: 15px; } .columns > br, .row > br { display: none !important; } /* -- pre -- */ pre { border: 1px solid #dddddd; padding: 20px !important; background: #f1f1f1; margin-bottom: 30px !important; margin-top: 20px !important; } /* -- catalogue mode -- */ .catalog-mode-header { padding-top: 15px; text-align: right; float: right; } .catalog-mode-header > div { display: inline-block; } .catalog-mode-header input, .catalog-mode-header form, .catalog-mode-header button { margin: 0 !important; } .no-prices span.amount, .no-prices form.cart { display: none !important; } .catalog-product-text { padding-bottom: 15px; } .catalog-product-text .accordion { margin: 0; } /* -- woocommerce extra -- */ .woocommerce-info { padding: 15px 0; } /* -- Home intro -- */ .home-intro { display: block; margin-bottom: -1px; } .home-intro .iosSlider { margin-bottom: 0 !important; } /* -- Column hover effects --*/ .col_hover_focus .column-inner, .col_hover_fade .column-inner, .col_hover_blur .column-inner { -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; position: relative; } .col_hover_focus:hover .column-inner { opacity: 1 !important; } .col_hover_fade .column-inner { opacity: .6; } .col_hover_fade:hover .column-inner { opacity: 1; } .col_hover_blur .column-inner { -webkit-filter: blur(3px); } .col_hover_blur:hover .column-inner { -webkit-filter: blur(0px); } .row:hover .col_hover_focus .column-inner:not(:hover) { opacity: 0.6 !important; } /* -- TOOLTIP -- */ .tooltipster-default { border-radius: 5px; background-color: #000000; background-color: rgba(0, 0, 0, 0.8); color: #ffffff; } .tooltipster-default img { max-width: 200px; } .tooltipster-default .tooltipster-content { font-family: Arial, sans-serif; font-size: 14px; line-height: 16px; padding: 8px 10px; overflow: hidden; } .tooltipster-base { padding: 0; font-size: 0; line-height: 0; position: absolute; left: 0; top: 0; z-index: 9999999; pointer-events: none; width: auto; overflow: visible; } .tooltipster-base .tooltipster-content { overflow: hidden; } .tooltipster-arrow { display: block; text-align: center; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: -1; } .tooltipster-arrow span, .tooltipster-arrow-border { display: block; width: 0; height: 0; position: absolute; } .tooltipster-arrow-top span, .tooltipster-arrow-top-right span, .tooltipster-arrow-top-left span { border-left: 8px solid transparent !important; border-right: 8px solid transparent !important; border-top: 8px solid; bottom: -8px; } .tooltipster-arrow-top .tooltipster-arrow-border, .tooltipster-arrow-top-right .tooltipster-arrow-border, .tooltipster-arrow-top-left .tooltipster-arrow-border { border-left: 9px solid transparent !important; border-right: 9px solid transparent !important; border-top: 9px solid; bottom: -7px; } .tooltipster-arrow-bottom span, .tooltipster-arrow-bottom-right span, .tooltipster-arrow-bottom-left span { border-left: 8px solid transparent !important; border-right: 8px solid transparent !important; border-bottom: 8px solid; top: -8px; } .tooltipster-arrow-bottom .tooltipster-arrow-border, .tooltipster-arrow-bottom-right .tooltipster-arrow-border, .tooltipster-arrow-bottom-left .tooltipster-arrow-border { border-left: 9px solid transparent !important; border-right: 9px solid transparent !important; border-bottom: 9px solid; top: -7px; } .tooltipster-arrow-top span, .tooltipster-arrow-top .tooltipster-arrow-border, .tooltipster-arrow-bottom span, .tooltipster-arrow-bottom .tooltipster-arrow-border { left: 0; right: 0; margin: 0 auto; } .tooltipster-arrow-top-left span, .tooltipster-arrow-bottom-left span { left: 6px; } .tooltipster-arrow-top-left .tooltipster-arrow-border, .tooltipster-arrow-bottom-left .tooltipster-arrow-border { left: 5px; } .tooltipster-arrow-top-right span, .tooltipster-arrow-bottom-right span { right: 6px; } .tooltipster-arrow-top-right .tooltipster-arrow-border, .tooltipster-arrow-bottom-right .tooltipster-arrow-border { right: 5px; } .tooltipster-arrow-left span, .tooltipster-arrow-left .tooltipster-arrow-border { border-top: 4px solid transparent !important; border-bottom: 4px solid transparent !important; border-left: 4px solid; top: 50%; margin-top: -4px; right: -4px; } .tooltipster-arrow-left .tooltipster-arrow-border { border-top: 9px solid transparent !important; border-bottom: 9px solid transparent !important; border-left: 9px solid; margin-top: -8px; } .tooltipster-arrow-right span, .tooltipster-arrow-right .tooltipster-arrow-border { border-top: 8px solid transparent !important; border-bottom: 8px solid transparent !important; border-right: 8px solid; top: 50%; margin-top: -7px; left: -7px; } .tooltipster-arrow-right .tooltipster-arrow-border { border-top: 9px solid transparent !important; border-bottom: 9px solid transparent !important; border-right: 9px solid; margin-top: -8px; } .tooltipster-fade { opacity: 0; -webkit-transition-property: opacity; transition-property: opacity; } .tooltipster-fade-show { opacity: 1; } /* -- ANIMATION -- */ .show-first, .show-next, .ux-box .ux-box-text, .widget_product_tag_cloud a, .product_list_widget li a, .widget_tag_cloud a, .widget_layered_nav_filters .chosen a, .ux_logo a, .ux-header-element a, .iosSlider .sliderNav a span, .iosSlider .sliderNav a, .product-page-aside .product, .post-date, .featured_item_text, ul.pinterest-style, .blog-pinterest-style article.type-post, .blog-pinterest-style article.hentry, .cat-count, .cat-title, .cart-icon strong, .cart-icon-handle, strong.cart-name, span.cart-price, .back-image img, .quick-view, .yith-wcwl-add-to-wishlist a, ul.header-nav li a { -webkit-transition: all 200ms ease-out; transition: all 200ms ease-out; } .featured-item > a { -webkit-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } .ux-box .ux-box-image img, .product-thumbnails .thumb img { -webkit-transition: all 400ms ease-out; transition: all 400ms ease-out; } .banner-bg, .parallax_img_inner, .mfp-bg, .mob-helper, .featured-product .product-bg, .featured-product .product-text, .product-thumbnails .thumb { -webkit-transition: opacity 200ms ease-out; transition: opacity 200ms ease-out; } /* -- Site wide notice -- */ p.demo_store { margin: 0; padding: 6px 0 8px 0; text-align: center; color: #999999; background-color: #111111; } /**********************************************************************/ /****************------------- 02. HEADER -------------***************/ /**********************************************************************/ /* -- top bar -- */ #top-bar { background-color: #627f9a; color: #ffffff; z-index: 11; position: relative; } #top-bar li > a { color: #ffffff; } #top-bar .left-text { opacity: 1; font-size: 80%; padding: 10px 0; } #top-bar .right-text { font-size: 80%; padding: 10px 0; } #top-bar .row { position: relative; } #top-bar span { opacity: 1; font-weight: normal; } #top-bar .html > * { display: inline-block; } /* -- header container -- */ .header-wrapper { z-index: 99; position: relative; } #masthead { height: 120px; } #masthead { background-color: #ffffff; top: -200px; -webkit-transition: top .6s, opacity .6s, background .3s; transition: top .6s, opacity .6s, background .3s; background-position: bottom center; background-repeat: repeat-x; } /* -- logo -- */ #logo { height: 100%; text-transform: uppercase; display: table-cell; vertical-align: middle; } #logo a { display: block; padding-top: 10px; margin: 0; font-size: 200%; line-height: 100%; font-weight: bold; float: left; width: 100%; } #logo a img { max-height: 999px; height: auto; width: auto; } #logo.logo-center a img { margin: 0 auto; } #logo a { color: #627f9a; } /* -- header layout -- */ #masthead .row { height: 100%; } #masthead .header-container { display: table; height: 100%; width: 100%; } #masthead .left-links { display: table-cell; vertical-align: middle; } #masthead .right-links { display: table-cell; vertical-align: middle; } #masthead .left-links > ul { float: left; padding-top: 15px; margin-left: 15px; } #masthead .right-links > ul { float: right; padding-top: 15px; } /* -- sticky header -- **/ #masthead.stuck { opacity: .95; position: fixed; top: -200px; left: 0; right: 0; z-index: 100; box-shadow: 0 1px 15px 0 rgba(0, 0, 0, 0.2); } #masthead.stuck:hover, .wide-nav.stuck:hover { opacity: 1; } #masthead.stuck.move_down { height: 70px; top: 0; } #masthead.stuck.move_down .catalog-mode-header, #masthead.stuck.move_down .left-links > ul, #masthead.stuck.move_down .right-links > ul, #masthead.stuck.move_down #logo a { padding: 0 !important; } #masthead.stuck.move_down #logo a { float: none; } #masthead.stuck.move_up { top: -500px; } /* -- sticky logo -- */ .stuck .has_sticky_logo, .header_logo_sticky { display: none; } .stuck.move_down .header_logo_sticky { display: block; } /* -- boxed header style --*/ .boxed #masthead, .boxed .wide-nav { max-width: 71.25em; width: 100%; left: auto; right: auto; } .boxed #masthead.stuck, .boxed .wide-nav.stuck { left: auto; right: auto; } /* -- centered logo -- */ .logo-center #masthead .left-links { width: 40%; } .logo-center #masthead .right-links { width: 40%; } .logo-center #masthead #logo { width: 20%; text-align: center; } .logo-center #masthead .left-links > ul { margin-left: 0; } .logo-center #masthead .left-links > ul > li { margin-left: 0; margin-right: 20px; } /* -- navigation -- */ ul.header-nav { margin: 0; } ul.header-nav li { float: left; margin-left: 15px; list-style: none; } ul.header-nav li a { text-transform: uppercase; font-size: 80%; font-weight: bold; padding: 10px 0; } .right-links > ul.header-nav { white-space: nowrap; } .right-links > ul.header-nav > li { display: inline-block !important; float: none; } /* -- dropdown -- */ .nav-dropdown, .sub-menu.submenu-languages { display: none; background: #ffffff; padding: 20px 10px 20px 30px; z-index: 999; border: 3px solid #DDD; position: absolute; margin-top: 10px; box-shadow: 2px 2px 10px 2px rgba(0, 0, 0, 0.1); } .active .nav-dropdown { display: block !important; } .right-links .nav-dropdown, .left-links .nav-dropdown, .account-dropdown .nav-dropdown { margin-left: -15px; } .nav-dropdown > ul, .nav-dropdown > .row, .nav-dropdown-inner { position: relative; } /* -- dropdown arrow -- */ .nav-dropdown > ul:after, .nav-dropdown > .row:after, .nav-dropdown-inner:after, .menu-item-language .sub-menu:after { top: -37px; border: solid transparent; content: ' '; height: 0; width: 0; position: absolute; pointer-events: none; } .nav-dropdown > ul:after, .nav-dropdown > .row:after, .nav-dropdown-inner:after, .menu-item-language .sub-menu:after { border-color: rgba(221, 221, 221, 0); border-bottom-color: #dddddd; border-width: 7px; left: 8px; margin-left: -7px; } .nav-dropdown > .row:after { left: -12px; } /* search dropdown fix */ .nav-dropdown-inner:after { left: auto; right: -25px; } /* cart dropdown fix */ .menu-item-language .sub-menu:after { top: -15px; left: auto; right: 20px; } .no-arrow.nav-dropdown > ul:after { opacity: 0; } /* -- dropdown styles -- */ ul.header-nav li ul { margin: 0; } ul.header-nav li ul.menu li { width: 160px; float: none; } ul.header-nav li .nav-dropdown li { display: block; width: 100%; min-width: 170px; margin: 0; float: none; } ul.header-nav li .nav-dropdown li a { font-weight: normal; border-bottom: 1px solid #f2f2f2; font-size: 78%; display: block; padding: 8px 0; margin-right: 20px; } ul.header-nav li .nav-dropdown li.bold a { font-weight: bold; color: #000000; margin-top: 10px; } ul.header-nav li .nav-dropdown > ul > li.menu-parent-item { float: left !important; width: 160px !important; } ul.header-nav li .nav-dropdown > ul > li:last-child > a { border: 0; } /* 4. level items and down */ #site-navigation .nav-dropdown .nav-column-links .nav-column-links { padding-left: 7px; } ul.header-nav li .nav-dropdown > ul > li.menu-parent-item ul ul li a { font-size: 11px; padding: 6px 0; border-bottom: none; } ul.header-nav li .nav-dropdown > ul > li.menu-parent-item ul ul ul li a { padding: 4px 0; } /* -- add a arrow to top links if it has dropdown -- */ li.menu-parent-item > a.nav-top-link:after { font-family: 'icomoon'; content: '\f107'; opacity: .7; margin-left: 5px; line-height: 0; top: 1px; position: relative; } /* -- image column for dropdown -- */ ul.header-nav li .nav-dropdown li.image-column { position: relative; float: left !important; width: 160px !important; } ul.header-nav li .nav-dropdown li.image-column a { line-height: 0; font-size: 0; margin: 0; padding: 0; margin-right: -10px; margin-top: -20px; margin-bottom: -20px; } ul.header-nav li .nav-dropdown li.image-column a img { width: 100%; } ul.header-nav li .nav-dropdown li.image-column a:hover { opacity: .9; } #jPanelMenu-menu li.image-column { display: none !important; } /* -- Dropdown labesl (new in 1.8) -- */ .label-new.menu-item > a:after, .label-hot.menu-item > a:after, .label-sale.menu-item > a:after, .label-popular.menu-item > a:after { content: ''; display: inline-block; font-size: 9px; margin-left: 7px; background-color: #000000; color: #ffffff; padding: 0 3px; position: relative; top: -2px; } .label-new.menu-item > a:after { background-color: #627f9a; } .label-sale.menu-item > a:after { background-color: #d26e4b; } .label-popular.menu-item > a:after { background-color: #7a9c59; } .label-hot.menu-item > a:after { background-color: #b20000; } /* -- main navigation link colors -- */ ul.header-nav a.nav-top-link { color: #000000; opacity: .5; } ul.header-nav li.active a.nav-top-link { color: #000000; opacity: 1; } ul.header-nav li .nav-dropdown a { color: #777777; } ul.header-nav li .nav-dropdown > ul > li.menu-parent-item > a { color: #000000; font-weight: bold; border-bottom: 1px solid #f2f2f2 !important; } ul.header-nav li .nav-dropdown a:hover { color: #000000; } a.nav-top-link:before { margin-right: 5px !important; position: relative; top: 1px; } /* -- search dropdown */ .search-wrapper button, .search-wrapper input { margin: 0 !important; } .search-dropdown .nav-dropdown { width: 260px; padding-right: 30px !important; } .search-dropdown input { -webkit-appearance: none; border-radius: 0; -webkit-border-radius: 0; } /* -- account dropdown -- */ .header-nav li.account-dropdown { border-right: 1px solid rgba(0, 0, 0, 0.1); padding-right: 15px; } .header-nav li.account-dropdown .nav-dropdown { max-width: 300px; } .header-nav li.account-dropdown ul { width: 160px; } .header-nav li.account-dropdown ul li { white-space: normal; } .header-nav li:last-child { border-right: 0 !important; padding-right: 0 !important; } /* -- Nav breaks fixes -- */ .nav-crop-right-links .right-links .li.mini-cart { margin-left: 5px !important; } .nav-crop-right-links .right-links ul.header-nav li { margin-left: 5px !important; } .nav-crop-right-links .right-links ul.header-nav li.account-dropdown { padding-right: 5px !important; } .nav-crop-left-links .left-links ul.header-nav > li { margin-left: 5px !important; } /* -- live search style -- */ .autocomplete-suggestions { padding-top: 10px; overflow-y: scroll; -webkit-overflow-scrolling: touch; padding-bottom: 10px; border: 1px solid #cccccc; border-radius: 3px; -moz-box-sizing: border-box; box-sizing: border-box; } .autocomplete-suggestion { position: relative; padding-left: 15px; overflow: hidden; cursor: pointer; text-align: left; line-height: 25px; font-size: 12px; } .autocomplete-suggestion:hover { background-color: #efefef; } .yith-ajaxsearchform-container { position: relative; } .yith-ajaxsearchform-container form { margin-bottom: 2em; } .autocomplete-suggestions { border: 0; width: 100% !important; } .nav-dropdown .autocomplete-suggestions, .widget .autocomplete-suggestions { position: relative !important; } .autocomplete-suggestion { padding: 10px 5px; border-bottom: 1px solid #eeeeee; font-size: 100%; } .autocomplete-selected a { color: #000000; } /* -- top bar menu -- */ #top-bar .html, .top-bar-nav { display: inline-block; } ul.top-bar-nav { margin: 0; line-height: 100%; } ul.top-bar-nav li { line-height: 12px; list-style: none; position: relative; display: inline-block; border-left: 1px solid rgba(255, 255, 255, 0.2); padding-left: 10px; margin-left: 10px; } ul.top-bar-nav li:first-child { border: 0; } ul.top-bar-nav li a:hover { border-bottom: 1px solid #ffffff; } ul.top-bar-nav .nav-dropdown { padding: 3px; right: 0; } ul.top-bar-nav .nav-dropdown ul { margin: 0; min-width: 100px; } ul.top-bar-nav .nav-dropdown ul li { margin: 0; padding: 0; border-bottom: 1px solid #eeeeee; display: block; } ul.top-bar-nav .nav-dropdown > ul:after { top: -20px; right: 20px; left: auto; } ul.top-bar-nav .nav-dropdown li a { font-size: 90%; display: block; color: #111111 !important; text-transform: uppercase; padding: 5px 10px; border: 0; } ul.top-bar-nav .nav-dropdown li a:hover { color: #777777 !important; } ul.top-bar-nav .nav-dropdown ul li:last-child { border: 0; } /* -- icon fix -- */ .menu-item:before { margin-right: 8px; font-size: 100%; top: 1px; position: relative; } /* -- wide navigation -- */ .wide-nav { -webkit-transition: top 650ms ease, opacity 600ms; transition: top 650ms ease, opacity 600ms; top: -300px; background-color: #eeeeee; box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.4); } .wide-nav.stuck { position: fixed; opacity: .9; top: -300px; right: 0; left: 0; z-index: 99; } .wide-nav .header-nav > li { margin-left: 0; line-height: 50px; display: inline-block; float: none; } .wide-nav .wide-nav-right { display: table-cell; height: 50px; vertical-align: middle; } .wide-nav .wide-nav-right > div { display: table-cell; vertical-align: middle; } .wide-nav .wide-nav-right button, .wide-nav .wide-nav-right input { margin-bottom: 0; } .wide-nav .wide-nav-right form { margin-left: 15px; width: 230px; } .wide-nav .header-nav a.nav-top-link { padding-right: 15px; } .wide-nav.nav-center .nav-wrapper > #site-navigation { text-align: center; } .wide-nav.nav-center .nav-wrapper > #site-navigation li { text-align: left; } .wide-nav.nav-left .nav-wrapper > #site-navigation { float: left; } .wide-nav .nav-dropdown { margin-top: -3px; } .wide-nav.nav-center .nav-dropdown > ul:after, .wide-nav.nav-center .nav-dropdown > .row:after { left: 60px; } .wide-nav-search form { width: 260px; } .wide-nav-search > li { margin-left: 0 !important; margin-right: 30px; } .wide-nav-search > div { display: table-cell; vertical-align: middle; padding-top: 15px; padding-left: 20px; } .logo-center .wide-nav-search > div { padding-left: 0; padding-right: 20px; } .wide-nav-search form, .wide-nav-search input, .wide-nav-search button { margin-bottom: 0 !important; } .wide-nav-search .autocomplete-suggestions, .wide-nav-right .autocomplete-suggestions { position: absolute !important; top: 35px; background-color: #ffffff; box-shadow: 1px 1px 5px 0 rgba(0, 0, 0, 0.1); } .wide-nav-search .autocomplete-suggestion, .wide-nav-right .autocomplete-suggestion { padding-left: 15px; } /* -- Transparent / blank header style / boxed header -- */ .transparent-header .header-wrapper, .transparent-header.boxed-header .header-wrapper, .transparent-header .header-wrapper { position: absolute; top: 0; left: 0; right: 0; width: 100%; z-index: 99; } .page-template-page-transparent-header-php .before-sticky #masthead, .page-template-page-transparent-header-php .before-sticky .wide-nav, .page-template-page-transparent-header-light-php .before-sticky #masthead, .page-template-page-transparent-header-light-php .before-sticky .wide-nav { background: none !important; box-shadow: none !important; } .transparent-header.hide-header #masthead.site-header { display: none; } .page-template-page-transparent-header-light-php .before-sticky .header_logo { display: none; } .page-template-page-transparent-header-light-php .stuck .header_logo_dark { display: none; } .page-template-page-transparent-header-light-php.org-dark-header .header_logo { display: block !important; } .page-template-page-transparent-header-light-php.org-dark-header .header_logo_dark { display: none !important; } .transparent-header ul.header-nav li a { -webkit-transition: none; transition: none; } .boxed-header .header-wrapper { margin-top: 50px; max-width: 69em; margin-left: auto; margin-right: auto; box-shadow: 1px 1px 5px 0 rgba(50, 50, 50, 0.11); } .boxed-header #masthead { opacity: .90; } .boxed-header #masthead:hover { opacity: 1; } .boxed.boxed-header .header-wrapper { margin-top: 20px; } .boxed.transparent-header .header-wrapper, .boxed.no-header .header-wrapper { left: auto; right: auto; max-width: 71.25em; } .boxed-header .top-divider { display: none !important; } .boxed.boxed-header .header-wrapper { margin-top: 0; } .framed-layout .header-wrapper { margin-top: 30px; } .page-template-page-blank-header-php .header-wrapper { position: absolute; top: -300px; } .page-template-page-blank-header-php .top-divider { display: none; } /* header elements */ .ux-header-element a { color: #c1c1c1; display: inline-block; margin-left: 7.5px; border: 2px solid #cccccc; padding: 8px 15px !important; line-height: 16px; font-size: 14px !important; } .ux-header-element a:hover { color: #ffffff; background: #627f9a; border-color: #627f9a; } .html-block-inner > * { display: inline-block; } .html-block-inner .search-wrapper { height: 23px !important; margin-left: 7.5px !important; } .html-block-inner * { margin-bottom: 0 !important; } /* Mobile Menu / Sidebar menu */ #jPanelMenu { height: 100%; } .mobile-sidebar { padding: 30px 0 100px; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; -o-user-select: none; } .mobile-sidebar .search { padding-bottom: 15px; } .mobile-sidebar li { position: relative; z-index: 99; display: block; padding: 0 30px; border-bottom: 1px solid rgba(0, 0, 0, 0.05); -webkit-transition: all .3s; transition: all .3s; } .mobile-sidebar li li { padding: 0; } .mobile-sidebar li:last-child, .mobile-sidebar li:last-of-type, .mobile-sidebar li.menu-item-has-children.active { border: 0; } .mobile-sidebar li a { text-transform: uppercase; font-size: 80%; font-weight: bold; width: 80%; display: inline-block; padding: 20px 0; color: #000000; opacity: .5; } .mobile-sidebar li.open > a, .mobile-sidebar li a:hover, .mobile-sidebar li.active > a, .mobile-sidebar li.current-menu-item > a { opacity: 1; } .mobile-sidebar .top-bar-mob li.menu-item a { font-size: 80%; padding: 15px 0; text-transform: none; font-weight: normal; } .mobile-sidebar li.menu-item-has-children li li a { padding: 15px 0; text-transform: none; font-weight: normal; } .mobile-sidebar .menu-html li { padding: 15px 0; } .mobile-sidebar .autocomplete-suggestions { position: relative !important; } /* Open menu icon */ .mobile-sidebar li ul:before { font-family: 'icomoon'; content: '\f107'; font-size: 22px; line-height: 18px; margin: 0; padding: 20px 30px; text-align: center; opacity: .5; position: absolute; right: 0; top: 0; } .mobile-sidebar .top-bar-mob li ul:before { padding: 15px 30px; line-height: 14px; } .mobile-sidebar li ul:hover:before { opacity: 1; } .mobile-sidebar li.open { background-color: rgba(0, 0, 0, 0.02); } .mobile-sidebar li.open ul:before { content: '\f106'; } .mobile-sidebar li ul li ul:before { display: none; } /* Html blocks */ .mobile-sidebar .html-block { text-align: center; padding: 12px 28px; } .mobile-sidebar .html-block .social-icons.size-small a { font-size: 120%; margin: 8px; color: #999; } .mobile-sidebar input { -webkit-appearance: none; border-radius: 0; } .mobile-sidebar li ul { max-height: 0; overflow: hidden; border-left: 2px solid rgba(0, 0, 0, 0.05); padding-left: 15px; } .mobile-sidebar li.open ul { max-height: none; margin: 0 0 30px; } .mobile-sidebar li ul ul { border: 0; display: block; } .mobile-sidebar .image-column { display: none; } /* Uber menu fix */ @media only screen and (max-width: 767px) { #megaMenuToggle { display: none; } #megaMenu.megaResponsiveToggle ul.megaMenu { display: block !important; } } /**********************************************************************/ /*******************------------- 03. FOOTER -------------*************/ /**********************************************************************/ .footer { padding: 30px 0 0; border-top: 1px solid #EEE; } .footer.light { background-color: #ffffff; } .footer.dark { background-color: #777; border: 0; } .absolute-footer { padding: 15px 0 25px; } .absolute-footer.dark { background: #111111; } .absolute-footer .left { font-size: 90%; } .absolute-footer .right { font-size: 90%; } .footer-1, .footer-2 { background-size: cover; background-repeat: no-repeat; } .absolute-footer ul { margin: 0 0 10px; overflow: hidden; } .absolute-footer ul li { float: left; list-style: none; padding-right: 15px; border-bottom: 1px solid rgba(255, 255, 255, 0.1); } .absolute-footer ul li:last-child { padding: 0; } .absolute-footer ul li a { display: block; padding-bottom: 5px; text-transform: uppercase; font-size: 80%; color: #999999; } .absolute-footer ul li a:hover { color: #000000; } .copyright-footer { opacity: .6; } /**********************************************************************/ /**************------------- 03. PAGES / BLOG -------------************/ /**********************************************************************/ /* -- sidebar -- */ #secondary { padding-top: 30px; } /* -- layout -- */ article.type-post, article.hentry { margin-bottom: 60px; } .page-left-sidebar .page-inner { padding-left: 30px; border-left: 1px solid #eeeeee; } .page-right-sidebar .page-inner { padding-right: 30px; border-right: 1px solid #eeeeee; } .page-no-sidebar > .row { max-width: 900px; } .page-no-sidebar.blog-pinterest > .row { max-width: 67.5em; } /*-- entry header -- */ .entry-header { margin-bottom: 30px; } /* -- titles -- */ h1.entry-title { margin: 0 0 5px; -ms-word-wrap: break-word; word-wrap: break-word; } .type-page h1.entry-title, .search-results .text-center h1.entry-title { margin-bottom: 30px; text-transform: uppercase; } .type-page .text-center h1.entry-title, .search-results .text-center h1.entry-title { margin-bottom: 15px; text-transform: uppercase; } .page .parallax-title { margin-bottom: 30px; } .parallax-title .ux_banner h1 { font-size: 270%; line-height: 115%; font-weight: normal; } /* -- breadcrumbs -- */ .page-breadcrumb .tabbed-content { margin: 0; font-size: 85%; } .page-breadcrumb .tabs { margin: 0 !important; } .page-breadcrumb .tabs h1 { padding: 15px 40px 10px 0; margin: 0; } .ux_banner .page-breadcrumb .tabs h1 { padding: 0 30px 0 0; } .page-breadcrumb .tabbed-content ul.tabs li a { padding: 15px 0; } /* -- entry image -- */ .entry-image { position: relative; margin: 10px 0 15px; } .entry-image img { width: 100%; } .entry-image .post-date, .ux-box .post-date { font-size: 17px; line-height: 14px; position: absolute; top: 40px; left: -9px; width: 55px; height: 55px; background: #ffffff; padding-top: 11px; border-width: 2px; z-index: 1; } .column-slider .ux-box .post-date { left: 0; } /* -- entry meta -- */ .entry-meta { font-size: 90%; padding: 10px 0; } .entry-meta span.divider { opacity: .5; margin: 0 5px; } .entry-meta-footer { border-top: 1px dotted #DDD; border-bottom: 3px solid #DDD; padding: 15px 0; overflow: hidden; } /* -- archive -- */ body.archive h1.page-title, body.search-results h1.page-title { font-size: 120%; text-transform: uppercase; text-align: center; margin-bottom: 30px; color: #777777; } /* -- blog/attachment pagination --*/ .navigation-paging { width: 100%; overflow: hidden; font-size: 100%; } .navigation-paging .nav-previous { float: left; } .navigation-paging .nav-next { float: right; } .navigation-paging a, .navigation-image a { display: block; border: 3px solid #627f9a; padding: 5px 10px 7px; text-transform: uppercase; } .navigation-paging a:hover, .navigation-image a:hover { color: #ffffff; background-color: #627f9a; } .navigation-image { margin-top: 15px; } .navigation-image > div { display: inline-block; margin-right: 10px; } /* -- date box -- */ .post-date { pointer-events: none; border: 2px solid #627f9a; margin-right: 10px; text-align: center; font-size: 70%; padding: 3px 3px; color: #627f9a; font-weight: bold; line-height: 100%; text-transform: uppercase; } .post-date .post-date-day { display: block; } .post-date .post-date-month { font-weight: normal; font-size: 80%; } .post-item:hover .post-date { background: #627f9a; color: #ffffff; } /* -- author box --*/ .author-box { padding: 30px 0; border-bottom: 1px solid #DDD; } .author-box p { font-size: 80%; } .author-box .author-name { margin: 0; } .author-box .author-title { text-transform: uppercase; } /* -- blog footer --*/ footer.entry-meta { margin-top: 30px; padding: 15px 0; border-top: 1px dotted #EEE; border-bottom: 2px solid #DDD; } .navigation-post { border-bottom: 1px solid #DDD; overflow: hidden; } .navigation-post a { padding: 30px 20px; display: block; width: 100%; } .navigation-post span { display: inline-block; margin: 0 5px; top: 1px; position: relative; } .navigation-post .nav-next { text-align: right; border-left: 1px solid #dddddd; } .navigation-post > div { display: inline-block; width: 48%; } /* -- gallery styles -- */ .gallery { margin-bottom: 30px !important; margin-left: -5px !important; margin-right: -10px !important; } .gallery img { max-width: 100% !important; border: 0 !important; width: 100% !important; height: auto !important; display: block; } .gallery-item { margin-bottom: 0; margin-top: 0 !important; padding: 5px; } .gallery-item a img { cursor: pointer; cursor: -webkit-zoom-in; cursor: -moz-zoom-in; cursor: zoom-in; } .gallery dl dt { margin: 0 !important; } /* -- entry styles -- */ .entry-content .more-link { margin-top: 20px; } /* -- content layout styles --*/ .alignleft { display: inline; float: left; margin-right: 1.5em; } .alignright { display: inline; float: right; margin-left: 1.5em; } .aligncenter { clear: both; display: block; margin: 0 auto; } .post.sticky { border: 3px solid #627f9a; padding: 30px; } .post.sticky footer.entry-meta { border-bottom: 0; } .hentry { margin: 0 0 1.5em; } .updated:not(.published) { display: none; } .single .byline, .group-blog .byline { display: inline; } .page-content, .entry-content, .entry-summary { margin: 1.5em 0 0; -ms-word-wrap: break-word; word-wrap: break-word; } .page-links { clear: both; margin: 0 0 1.5em; } /* blog styles */ .blog-list-style { border-bottom: 1px solid #eeeeee; margin-bottom: 30px; } .blog-list-style article { margin-bottom: 30px; } .blog-list-style .entry-content, .blog-list-style .entry-image { margin-top: 0; } .blog-list-style .cat-links a { text-transform: uppercase; color: #999999; font-size: 80%; } .blog-list-style .post-date { top: 20px; } .blog-pinterest-style { margin-right: -5px; margin-left: -5px; } .blog-pinterest-style .post-date { top: 20px; } .blog-pinterest-style .cat-links a { text-transform: uppercase; color: #999999; font-size: 75%; } .blog-pinterest-style .entry-content { margin-top: 0; padding: 15px; border-left: 1px solid #eeeeee; border-bottom: 1px solid #eeeeee; border-right: 1px solid #eeeeee; } .blog-pinterest-style .entry-image { margin-bottom: 0; } .blog-pinterest-style p { font-size: 90%; line-height: 140%; } .blog-pinterest-style .comments-link a, .blog-pinterest-style span.sep, .blog-pinterest-style .tags-links { font-size: 60%; text-transform: uppercase; color: #555555; } .blog-pinterest-style span.sep { opacity: .3; margin: 0 7px; } .blog-pinterest-style article.type-post, .blog-pinterest-style article.hentry { margin-bottom: 15px; } .blog-pinterest-style:hover article { box-shadow: 0 0 19px 0 rgba(50, 50, 50, 0.33); } .navigation-container { padding: 0 !important; } .blog-pinterest-container { padding-bottom: 30px; } .blog-pinterest-container .navigation-paging { margin-top: 15px; } .blog-pinterest-container .navigation-container { margin-left: -5px; margin-right: -5px; padding-left: 0.9375em !important; padding-right: 0.9375em !important; } .blog-pinterest-container .navigation-container .nav-next { margin-right: 20px; } /* -- media -- */ .page-content img.wp-smiley, .entry-content img.wp-smiley, .comment-content img.wp-smiley { border: none; margin-bottom: 0; margin-top: 0; padding: 0; } .wp-caption { border: 1px solid #dddddd; margin-bottom: 1.5em; max-width: 100%; background: #f6f6f6; } .wp-caption img[class*='wp-image-'] { display: block; margin: 1.2% auto 0; max-width: 98%; } .wp-caption-text { text-align: center; } .wp-caption .wp-caption-text { padding: 10px 0; margin: 0; } .site-main .gallery { margin-bottom: 1.5em; } .gallery-caption { display: inline-block; } .site-main .gallery a img { border: none; height: auto; width: 100%; max-width: 90%; } .site-main .gallery dd { margin: 0; } .size-auto, .size-full, .size-large, .size-medium, .size-thumbnail { max-width: 100%; height: auto; } /* Make sure embeds and iframes fit their containers */ embed, iframe, object { max-width: 100%; } /* -- image attchments --*/ .entry-attachment .attachment { margin-bottom: 15px; } /* -- blog share icons --*/ .blog-share { margin-top: 30px; text-align: center; } /* -- comments -- */ .comment-content a { word-wrap: break-word; } .bypostauthor { display: inline-block; } .comments-title { text-transform: uppercase; font-weight: normal; } .comments-title span { font-weight: bold; } .comment-author { text-align: center; } .form-allowed-tags { font-size: 80%; } #comments ul li, #comments ol li { list-style: none; width: 100%; } .comment-inner { padding: 15px 0; } .comment-list > li { margin-bottom: 0; } .comment-list cite.fn { font-style: normal; margin-right: 5px; color: #000; } .comment-list .says { display: none; } .comment-meta.commentmetadata { font-size: 70%; text-transform: uppercase; } .comment-form-author input, .comment-form-email input, .comment-form-url input { margin-bottom: 0; } .comment-form-author, .comment-form-email, .comment-form-url { display: inline-block; width: 32.8%; position: relative; } .comment-form-author, .comment-form-email { padding-right: 10px; } #comments .reply a { color: #777; font-size: 80%; } .comment-form span.required { display: none; } #add_review .comment-form-author, #add_review .comment-form-email, #add_review .comment-form-url { width: 40%; margin-bottom: 0; } /* -- hide stuff before user click message form --*/ #respond .form-allowed-tags, #respond .form-submit { display: none; } /* -- comments level 1 -- */ .comment-list > li.comment > .comment-inner { border-top: 3px solid #EEE; } .comment-list > li.comment:last-child > .comment-inner { border-bottom: 0; } #comments ul.children { margin-left: 35px; } /* -- comments level 2 -- */ .comment-list .children .comment-inner, .children #respond { border-top: 1px solid #EEE; padding: 15px; margin-right: 0; } .children #respond { padding: 15px 30px; } /* -- comments level 3 --*/ .comment-list .comment:last-child { border: 0; } .children .comment { border: 0; } /* -- ACCOUNT PAGES -- */ .my-account h1 { text-transform: uppercase; padding-bottom: 15px; border-bottom: 1px solid #dddddd; margin-bottom: 30px; } .my-account h2 { text-transform: uppercase; color: #777777; font-size: 120%; } td.order-actions { text-align: right; } .col2-set { overflow: hidden; } .col2-set .col-1, .col2-set .col-2 { float: left; margin-right: 30px; } .account-user { position: relative; padding-left: 80px; padding-top: 15px; margin-top: 15px; overflow: hidden; } .account-user .avatar { position: absolute; left: 0; top: 0; } .account-user span { display: block; } .account-user span a { text-transform: uppercase; display: inline-block; margin-top: 4px; font-size: 60%; padding: 3px 8px; background: #eeeeee; border-radius: 10px; } .account-user em { color: #cccccc; } /* -- WISHLIST PAGE -- */ .wishlist_table .add_to_cart, .yith-wcwl-add-button > a.button.alt { border-radius: 0; -moz-border-radius: 0; -webkit-border-radius: 0; } .wishlist_table .product-thumbnail img { width: 114px !important; padding-left: 0; margin-left: 20px; } .yith-wcwl-share { text-align: left; } /* -- FEATURED ITEMS (Blog posts etc) -- */ .page-featured-item #content > ul { margin-left: -7.5px; } .page-featured-item h1 { text-transform: uppercase; } .page-featured-item .item-tags { text-transform: uppercase; font-size: 80%; padding-top: 10px; border-top: 1px dotted #dddddd; margin-bottom: 15px; } .page-featured-item .item-tags span { font-weight: bold; margin-right: 10px; } .page-featured-item .social-icons { margin-bottom: 15px; } .page-featured-item .featured_item_cats { text-transform: uppercase; margin-bottom: 15px; font-size: 80%; } /* -- BACK TO SITE -- */ #back-to-site { position: fixed; top: 0; left: 0; z-index: 10; text-transform: uppercase; opacity: .8; font-weight: bold; } #back-to-site a { background: #000000; padding: 5px; color: #ffffff; } /**********************************************************************/ /************------------- 04. SHOP CATEGORIES -------------***********/ /**********************************************************************/ /* -- breadcrumbs -- */ .breadcrumb-row { margin-bottom: 30px; overflow: hidden; } .breadcrumb { text-transform: uppercase; font-size: 125%; text-transform: uppercase; } .breadcrumb-medium h3.breadcrumb { font-size: 115%; padding-bottom: 5px; } .breadcrumb-small h3.breadcrumb { font-size: 95%; padding-bottom: 10px; } .breadcrumb a { color: #999999; font-weight: normal; } .breadcrumb span { display: inline-block; margin: 0 5px; color: #cccccc; } h3.breadcrumb { margin: 0; padding-top: 5px; } h4.breadcrumb { font-size: 115%; } h4.breadcrumb a { font-weight: bold; } h4.breadcrumb span { font-size: 60%; } /* -- category header --*/ .cat-header > .row, .cat-header > div > .row { margin-bottom: 0 !important; } .cat-footer { padding-bottom: 30px; } /* -- product categories header -- */ .woocommerce-result-count { margin-right: 20px; } .woocommerce-result-count, .woocommerce-ordering { display: inline-block; margin-bottom: 0; } .woocommerce-ordering, .woocommerce-ordering .custom.dropdown, .woocommerce-ordering select { margin: 0 0 1px 0 !important; } li.product-small { margin-bottom: 15px; } li.product-small.grid2, li.product-small.grid3, li.product-small.grid5 { margin-bottom: 0; } ul.products { margin-bottom: 20px; } /* -- category box --*/ .product-category .header-title { margin-bottom: 0; line-height: 100%; } /* -- product list -- */ .product-small { position: relative; display: block; } .product-small h5 { margin-bottom: 0; text-transform: uppercase; font-size: 70%; color: #999999; font-weight: bolder; } .product-small p { margin-bottom: 5px; line-height: 120%; margin-top: 5px; } .product-small .name { font-size: 90%; } .product-small .tx-div { border-width: 3px; width: 20px; margin: 4px auto 4px auto !important; } .product-small.out-of-stock .add-to-cart-grid { display: none; } .product-small.out-of-stock .out-of-stock-label { color: #333333; font-weight: bold; text-transform: uppercase; position: absolute; top: 40%; left: 0; right: 0; background: #ffffff; padding: 20px 0; background: rgba(255, 255, 255, 0.9); text-align: center; opacity: .9; } .product-small .short-description { font-size: 80%; } /* -- product list images -- */ .product-image img.attachment-shop_catalog, .product-image img.attachment-shop_single, .product-image img.attachment-shop_thumbnail { display: block; min-width: 100%; } .product-image { position: relative; display: block; overflow: hidden; } .product-image .front-image { display: block; width: auto; height: auto; } .product-image .front-image img { min-width: 99.9%; max-width: 101% !important; width: auto !important; height: auto !important; display: block; } .product-image .back-image img { min-width: 100%; opacity: 0; position: absolute; top: 0; width: auto !important; height: auto !important; display: block; backface-visibility: hidden; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; } .product-image:hover .back-image img { opacity: 1; } /* -- product list images zoom effects -- */ .product-image.hover_zoom_in:hover .back-image img { zoom: 1.3; -moz-transform: scale(1.3); -moz-transform-origin: 50% 50%; -o-transform: scale(1.3); -o-transform-origin: 50% 50%; -webkit-transform: scale(1.3); -webkit-transform-origin: 50% 50%; -webkit-transform: scale(1.3); -ms-transform: scale(1.3); transform: scale(1.3); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } /* -- prices styles --*/ .price { font-size: 120%; color: #000000; font-weight: bold; line-height: 100%; } .price.large { font-size: 190%; margin-bottom: 20px; } .price del, .prod-price del { color: #777777; font-weight: normal; } .price ins, .prod-price ins { text-decoration: none; } .price .from { font-weight: normal; color: #777777; font-size: 80%; } /* -- callout bubble (sale) -- */ .callout { position: absolute; left: 0; top: 20px; z-index: 9; text-transform: uppercase; pointer-events: none; opacity: .95; } .callout .inner { background: #d26e4b; position: relative; display: table; } .callout.has-sale { margin-top: 40px; -webkit-transform: scale(0.8); opacity: .9; } .callout.large.has-sale { margin-top: 65px; } .small .callout.has-sale { margin-top: 25px; } .callout.style1 .inner { width: 55px; height: 55px; border-radius: 999px; } .callout .inner .inner-text { display: table-cell; vertical-align: middle; text-align: center; font-size: 16px; line-height: 16px; color: #ffffff; font-weight: bold; } .callout.style1.large { top: 30px; left: -5px; } .callout.style1.large .inner { width: 90px; height: 90px; } .callout.large .inner .inner-text { font-size: 28px; line-height: 28px; } .product.small .inner { width: 34px; height: 34px; } .product.small .callout .inner-text { font-size: 11px; } .callout.style2 { left: 10px; top: 40px; } .callout.style2.large { left: 15px; top: 60px; } .callout.style2 .inner { padding: 10px; } .callout.style2.large .inner { padding: 10px; } .callout.style3 { left: 20px; top: 10px; } .callout.style3 .inner { background: none !important; border: 2px solid #627f9a; } .callout.style3 .inner .inner-text { color: #627f9a; font-size: 12px; padding: 0 3px; } .callout.style3.large { top: 30px; left: 40px; } .callout.style3.large .inner .inner-text { font-size: 16px; padding: 0 10px; } /* -- quick view button -- */ .quick-view { font-weight: bold; font-size: 78%; opacity: 0; position: absolute; left: 0; right: 0; bottom: 0; color: #ffffff; background: #627f9a; text-align: center; text-transform: uppercase; padding: 5px 0; -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); } .product-image:hover .quick-view { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: .9; } .product-image .quick-view:hover { text-decoration: underline; } /* -- price slider fix -- */ .widget_price_filter input { display: none !important; } /* -- filter */ .category-filtering { margin: -25px 0 5px; } a.filter-button { font-size: 16px; font-weight: bold; color: #000000; opacity: .6; position: relative; text-transform: uppercase; padding: 15px 0; display: inline-block; } .dark a.filter-button { color: #ffffff; } a.filter-button span { margin-right: 5px; position: relative; top: 0; } a.filter-button:hover { opacity: 1; } .category-filtering .widget { position: relative; top: 7px; margin: 0 15px; display: inline-block; } .category-filtering .widget_layered_nav_filters li { margin-bottom: 0; } /* -- Add to cart button - icon -- */ .add-to-cart-grid { position: absolute; bottom: -30px; -webkit-transition: all 350ms ease-out; transition: all 350ms ease-out; left: 10px; display: block; top: auto; right: auto; padding: 0; margin: 0; } .product-image:hover .add-to-cart-grid { bottom: 35px; } .product-image .added_to_cart { display: none !important; } .product-image .cart-icon strong { padding: 1px 3px 0; font-size: 8px; margin: 0; line-height: 14px; } .product-image .cart-icon .cart-icon-handle { top: 0px; height: 6px; width: 10px; right: 50%; margin-right: -5px; } .add-to-cart-grid .cart-icon strong:hover { color: #ffffff; } .add-to-cart-grid.added .cart-icon strong, .add-to-cart-grid.loading .cart-icon strong { color: #ffffff; border-color: #7a9c59; background-color: #7a9c59; } .add-to-cart-grid.added .cart-icon .cart-icon-handle { border-color: #7a9c59; } .add-to-cart-grid .icon-inner:before { content: '\e00c'; font-weight: normal; } .add-to-cart-grid.added .icon-inner:before, .add-to-cart-grid.loading .icon-inner:before { content: '\e00a'; } /* -- Add to cart button - button -- */ .add_to_cart_button.button { margin-top: 15px; margin-bottom: 15px; } /* -- Grid frames -- */ .product-small.grid-frame .inner-wrap { padding: 8px; border: 1px solid #eeeeee; } .product-small.grid-boxed .inner-wrap { background-color: #ffffff; box-shadow: 1px 1px 6px 0 rgba(0, 0, 0, 0.2); } .product-small.grid-boxed .info { padding: 5px 15px 12px; } .product-small.grid-boxed table { margin: 0; } /* -- add to wishlist --*/ .yith-wcwl-add-to-wishlist { position: absolute; top: 10px; right: 20px; margin-top: 0; z-index: 98; height: 30px; } .yith-wcwl-wishlistexistsbrowse .feedback, .yith-wcwl-wishlistaddedbrowse .feedback { display: none; } .yith-wcwl-wishlistexistsbrowse a, .yith-wcwl-add-button a.add_to_wishlist, .yith-wcwl-wishlistaddedbrowse a { text-indent: -9999px; display: block; width: 30px; height: 30px; position: relative; border: 3px solid #000000; border-radius: 99px; color: #000000; padding: 5px; } .yith-wcwl-wishlistexistsbrowse a:before, .yith-wcwl-add-button a.add_to_wishlist:before, .yith-wcwl-wishlistaddedbrowse a:before { position: absolute; left: 0; right: 0; text-align: center; text-indent: 0; content: '\e000'; font-size: 16px; font-family: 'icomoon'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; } .yith-wcwl-add-to-wishlist a { color: #000000; opacity: 0; } .product-small:hover .yith-wcwl-add-to-wishlist a, .featured-product:hover .yith-wcwl-add-to-wishlist a, .product-gallery:hover .yith-wcwl-add-to-wishlist a { opacity: .3; } .yith-wcwl-add-to-wishlist a:hover { color: #c60000; border-color: #c60000; opacity: 1 !important; } .yith-wcwl-wishlistexistsbrowse a, .yith-wcwl-wishlistaddedbrowse a { color: #c60000; border-color: #c60000; } .product-info .yith-wcwl-add-to-wishlist { display: none; } .column-slider .yith-wcwl-add-to-wishlist { right: 25px; } /* Popup message */ #yith-wcwl-popup-message { background: #ffffff; border: 1px solid #dddddd; line-height: 50px; padding: 15px; font-size: 120%; position: fixed; text-align: center; top: 50%; left: 50%; z-index: 10000; /* Thanks WP -.- */ } /* -- add to wishlist product page -- */ .product-image .yith-wcwl-add-to-wishlist { top: 30px; right: 30px; } .product-image .yith-wcwl-wishlistexistsbrowse a, .product-image .yith-wcwl-add-button a.add_to_wishlist, .product-image .yith-wcwl-wishlistaddedbrowse a { padding: 10px; height: 40px; width: 40px; } /* -- New Grid styles -- */ .style-grid3 .price span { font-size: 85%; } .style-grid3 .price span:last-of-type { display: block; } .style-grid3 td { vertical-align: top; } .style-grid3 .name { margin-top: 0; padding-right: 5px; margin-right: 10px; border-right: 1px solid #eeeeee; } .style-grid3 .star-rating { font-size: 70%; } .style-grid3 .category { opacity: .4; } /* -- List style -- */ @media only screen and (min-width: 768px) { ul.large-block-grid-1 .product-category { width: 33.3333%; clear: none !important; } ul.large-block-grid-1 .inner-wrap p.name { font-size: 150%; } ul.large-block-grid-1 .inner-wrap > a, ul.large-block-grid-1 .inner-wrap > .info { display: inline-block; vertical-align: middle; } ul.large-block-grid-1 .inner-wrap > a { width: 25%; } ul.large-block-grid-1 .inner-wrap > .info { padding: 10px 30px; width: 70%; } } /* -- YITH ajax navigation plugin compability -- */ .woocommerce-page .widget_layered_nav .yith-wcan-select-wrapper ul li.chosen a, .woocommerce-page .widget_layered_nav .yith-wcan-select-wrapper ul li.chosen a { background-position: right; width: 100%; } .yith-wcan-select-wrapper ul.yith-wcan-select.yith-wcan li:hover, .woocommerce-page .widget_layered_nav .yith-wcan-select-wrapper ul li, .woocommerce-page .widget_layered_nav .yith-wcan-select-wrapper ul li.chosen { border-top: 0 !important; border-bottom: 0 !important; box-shadow: none !important; } .yith-wcan-select-wrapper ul.yith-wcan-select.yith-wcan li:hover { background-color: #f9f9f9; } .button.yith-wcan-reset-navigation { margin-bottom: 0; font-size: 75%; } .yith-wcan-loading { background-image: url("loader.gif"); height: 300px; position: relative; } .yith-wcan-color li { border-bottom: 0 !important; } /**********************************************************************/ /**************------------- 05. PRODUCT PAGE -------------************/ /**********************************************************************/ /* -- variation select box --*/ .single_variation_wrap { display: none; } .single_variation_wrap span.price { margin-bottom: 15px; display: block; } /* -- Product Image tools -- */ .product-image-tools { position: absolute; left: 30px; bottom: 50px; } .product-image-tools a { margin-top: 15px; z-index: 98; opacity: .5; font-size: 16px; text-align: center; display: block; line-height: 38px; height: 42px; width: 42px; border: 3px solid #000000; color: #000000; border-radius: 99px; cursor: pointer; -webkit-transition: all 0.3s; transition: all 0.3s; } .product-image-tools a:hover { opacity: 1; } .product-zoom-lightbox .mfp-img { cursor: -moz-zoom-out; cursor: -webkit-zoom-out; cursor: zoom-out; } /* Product-page-sidebar (Upsell etc.) */ .product-page-aside { padding-top: 7px; } .product-page-aside h6 { font-size: 11px; text-transform: uppercase; } .product-page-aside .product { opacity: .7; margin-bottom: 10px; } .product-page-aside .product:hover { opacity: 1; } .up-sell.large-block-grid-2 li { padding: 0 3px 6px 3px !important; margin-bottom: 0; } .up-sell.large-block-grid-2 li img { display: block; } .up-sell .product.small { position: relative; } .product-sidebar-right > .inner { border-left: 1px solid #eeeeee; padding-left: 30px; } .product-sidebar-left > .inner { border-right: 1px solid #eeeeee; padding-right: 30px; } /* -- product text top -- */ .product-page .size-chart { font-size: 80%; font-weight: normal; } .product-page .custom.dropdown { width: 80% !important; } .product-page .text-center .custom.dropdown { width: 80% !important; margin-left: auto !important; margin-right: auto !important; } .product-page .prefix.last { border-radius: "0px 10px 0px 10px"; } /* -- product text -- */ .product-info h4 span { color: #999999; text-transform: none; } .product-info h4 a { font-size: 70%; text-transform: uppercase; } .product-info p.stock { font-weight: bold; } /* -- attributes tab-- */ .shop_attributes th { width: 100px; padding-right: 15px; } .shop_attributes tr { border-bottom: 1px solid #EEE; } .shop_attributes p { margin: 0; } /* -- product details -- */ .product-details { border-top: 1px solid #EEE; } .product-details.sections-style { border: 0; } .product-details .pos_pills { margin-top: 30px; } /* -- prodcut meta -- */ .product_meta > span { display: block; border-top: 1px dotted #DDD; padding: 7px 0; font-size: 80%; } /* -- variations -- */ .variations .value { margin-left: 0; } .variations .value .minus, .variations .value .plus { display: none !important; } .variations select { margin-bottom: 0; } .variations td { vertical-align: middle; } .variations label { font-size: 95%; font-weight: bolder; margin: 0; } .variations_button button { vertical-align: top; } .variations_form { position: relative; } .woocommerce-reset-row, .variation_form_section { position: relative; } a#variations_clear, a.reset_variations { opacity: 0.5; display: none; position: absolute; font-size: 11px; top: -10px; right: 0; } form.swatches .quantity { margin: 0 10px 0 0; } /* -- related products --*/ .related-product h2 { text-transform: uppercase; padding-top: 0; font-size: 130%; } /* -- Product info section style -- */ .product-page-sections h5 { text-transform: uppercase; opacity: .6; color: #111111; } .product-page-sections #reviews h2 { display: none; } .product-page-sections #reviews hr { display: none; } .product-page-sections .entry-content { margin-top: 0; } /* -- Product info tabs_vertical-style --*/ .tabs_vertical-style h3 { border-bottom: 0; padding-bottom: 15px; } .tabs_vertical-style #reviews > .row { margin: 0 !important; } .tabs_vertical-style #add_review.large-5 { padding-left: 15px; } /* -- next prev products navigation -- */ .next-prev-nav { text-align: right; position: relative; margin-bottom: 30px; } .next-prev-nav .prod-dropdown > a { font-size: 16px; line-height: 16px; display: block; padding-top: 2px; text-align: center; width: 25px; height: 25px; border: 2px solid; display: inline-block; border-radius: 99px; color: #cccccc; } .next-prev-nav .prod-dropdown > a:hover { border-color: #627f9a; background-color: #627f9a; color: #ffffff; } .next-prev-nav .icon-angle-left { padding-right: 2px; } .next-prev-nav .icon-angle-right { padding-left: 2px; } .prod-dropdown { display: inline-block; z-index: 99; } .prod-dropdown .nav-dropdown { left: auto; right: 0 !important; width: auto; padding: 3px; margin: 0; } .prod-dropdown .nav-dropdown img { width: auto; display: block; } /****** PRODUCT REVIEWS ******/ #reviews .star-rating, #reviews p.meta { display: inline-block; } #reviews p.meta { margin-bottom: 5px; } #reviews h2 { font-size: 130%; font-weight: normal; } #reviews h2 strong { font-weight: bolder; } #review_form { background: #ffffff; margin: 0 auto; padding: 40px; } textarea#comment { height: 100px; } .product-details.tabs_vertical-style #comments { width: 100%; } .product-details.tabs_vertical-style #add_review { width: 100%; padding: 0; } /* -- add review form -- */ #add_review .inner { padding: 15px 30px; position: relative; background: #ffffff; border: 3px solid #dddddd; } /* -- review-item -- */ .review-item { position: relative; border-bottom: 2px dotted #EEE; margin-bottom: 15px; font-size: 90%; min-height: 85px; padding-left: 90px; } .review-item .avatar { position: absolute; left: 0; top: -5px; } .review-item .description { color: #777777; font-style: italic; font-family: georgia; font-size: 105%; padding-right: 20%; } /* -- review star rating form -- */ .woocommerce p.stars:after, .woocommerce-page p.stars:after { content: ''; display: block; clear: both; } .woocommerce p.stars span, .woocommerce-page p.stars span { width: 80px; height: 16px; position: relative; float: left; background: url(star.png) repeat-x left 0; } .woocommerce p.stars span a, .woocommerce-page p.stars span a { float: left; position: absolute; left: 0; top: 0; width: 16px; height: 0; padding-top: 16px; overflow: hidden; } .woocommerce p.stars span a:hover, .woocommerce-page p.stars span a:hover, .woocommerce p.stars span a:focus, .woocommerce-page p.stars span a:focus { background: url(star.png) repeat-x left -16px; } .woocommerce p.stars span a.active, .woocommerce-page p.stars span a.active { background: url(star.png) repeat-x left -32px; } .woocommerce p.stars span a.star-1, .woocommerce-page p.stars span a.star-1 { width: 16px; z-index: 10; } .woocommerce p.stars span a.star-2, .woocommerce-page p.stars span a.star-2 { width: 32px; z-index: 9; } .woocommerce p.stars span a.star-3, .woocommerce-page p.stars span a.star-3 { width: 48px; z-index: 8; } .woocommerce p.stars span a.star-4, .woocommerce-page p.stars span a.star-4 { width: 64px; z-index: 7; } .woocommerce p.stars span a.star-5, .woocommerce-page p.stars span a.star-5 { width: 80px; z-index: 6; } /* -- yith_magnifier_zoom_wrap fix --*/ .product-gallery { margin-bottom: 25px; } .yith_magnifier_zoom_wrap { z-index: 8 !important; } /* -- Additional fields --*/ .product-addon { width: 100%; border-top: 1px solid #eeeeee; padding-top: 15px; font-size: 90%; } .product-addon > h3 { font-size: 14px; } .product-addon .select-wrapper { width: 90%; } .product-addon input { margin-bottom: 3px; } /* -- Easy Zoom -- */ .easyzoom { position: relative; display: inline-block; *display: inline; *zoom: 1; } .easyzoom img { vertical-align: bottom; } .easyzoom.is-loading img { cursor: progress; } .easyzoom.is-error img { cursor: not-allowed; } .easyzoom-notice { position: absolute; top: 50%; left: 50%; z-index: 150; width: 10em; margin: -1em 0 0 -5em; line-height: 2em; text-align: center; } .easyzoom-flyout { position: absolute; z-index: 97; overflow: hidden; background: #ffffff; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; -webkit-transition: opacity 0.3s ease-out; transition: opacity 0.3s ease-out; } /** * EasyZoom layout variations */ .easyzoom-flyout:hover { opacity: 1; } .product-gallery-slider .slide .easyzoom-flyout img { max-width: 1400px !important; width: 1400px !important; } /**********************************************************************/ /******************------------- 06. CART -------------****************/ /**********************************************************************/ /* -- mini cart -- */ li.mini-cart .nav-dropdown { right: 15px; width: 330px; } .cart-icon { display: inline-block; position: relative; margin-bottom: -.2em; } .cart-icon strong { display: inline-block; color: #627f9a; border: 2px solid #627f9a; position: relative; padding: 2px 8px; margin-left: 15px; z-index: 10; } .cart-icon .cart-icon-handle { border: 2px solid #627f9a; border-bottom: 0; right: 50%; margin-right: -15px; top: -6px; height: 8px; width: 15px; position: absolute; -webkit-border-top-left-radius: 99px; -webkit-border-top-right-radius: 99px; -moz-border-radius-topleft: 99px; -moz-border-radius-topright: 99px; border-top-left-radius: 99px; border-top-right-radius: 99px; } li.mini-cart:hover .cart-icon .cart-icon-handle { top: -8px; } li.mini-cart .nav-dropdown { padding-right: 30px !important; } li.mini-cart .nav-dropdown button { margin-bottom: 5px; } strong.cart-name, span.cart-price { color: #000000; opacity: .5; } .active strong.cart-name, .active span.cart-price { color: #000000; opacity: 1; } li.mini-cart.active .cart-icon strong { background-color: #627f9a; color: #ffffff; } /* -- mini cart in top bar -- */ .mini-cart-top-bar span.label { font-weight: bolder; line-height: 0; padding: 2px 5px; margin-left: 5px; outline: 2px solid #ffffff; } @media only screen and (min-width: 48em) { .right-links > ul.header-nav > li.mini-cart.hide-for-medium { display: none !important; } } /* -- mini cart dropdown -- */ li.mini-cart { -webkit-backface-visibility: hidden; backface-visibility: hidden; } li.mini-cart .cart_list { max-height: 450px; max-height: 60vh; overflow-y: auto; z-index: 99; -webkit-overflow-scrolling: touch; } .cart-inner p.empty { margin: 0; white-space: normal; } /* -- custom cart icon -- */ .custom-cart-inner { display: block; width: 42px; padding-left: 32px; position: relative; } .custom-cart-icon { position: absolute; right: 0; bottom: -8px; max-width: 32px; } .custom-cart-count { position: absolute; font-size: 80%; font-weight: bolder; display: block; text-align: center; line-height: 20px; height: 20px; width: 20px; right: 0; z-index: 3; bottom: 7px; right: -10px; color: #ffffff; background-color: #d26e4b; font-weight: bold; border-radius: 100%; } .mini-cart:hover .custom-cart-count { background: #000000; } /* Mini Cart links */ .mini-cart .nav-dropdown a.button { color: #ffffff !important; padding: 13px 0; margin: 8px 0 0 0; display: block; } .mini-cart .product_list_widget a:not(.remove) { border-bottom: 0 !important; font-weight: bolder !important; line-height: 140%; margin: 0; padding: 0; } .mini-cart .product_list_widget li { padding-right: 30px !important; min-height: 90px; } .mini-cart .product_list_widget .quantity { font-size: 85%; } /* -- delete icon -- */ .remove .icon-close, ul.header-nav li .nav-dropdown li a.remove, .product_list_widget a.remove { border: 2px solid #DDD; display: block; font-weight: bolder; height: 25px; width: 25px; padding: 0; line-height: 22px; text-align: center; color: #DDD; border-radius: 99px; font-size: 10px; margin-top: 25%; display: inline-block; } ul.header-nav li .nav-dropdown li a.remove, .product_list_widget a.remove { position: absolute; top: 10px; margin: 0; right: 0; font-size: 16px; line-height: 21px; } .remove .icon-close:hover, ul.header-nav li .nav-dropdown li a.remove:hover, .product_list_widget a.remove:hover { border-color: #000000; color: #000000; } /* -- Cart tables -- */ table tr { border-bottom: 1px dotted #DDD; } .shop_table .product-thumbnail { width: 90px; } .shop_table thead th { padding-top: 4px; padding-bottom: 12px; } .shop_table dl.variation { margin: 0; font-size: 80%; opacity: .6; } .shop_table dl.variation p { margin: 0; } .shop_table dl.variation dt, .shop_table dl.variation dd { display: inline-block; margin: 0; } .shop_table dl.variation dt { margin-right: 5px; } .shop_table dl.variation dd { margin-right: 10px; } .shop_table .product-price { padding-right: 20px; } .shop_table .product-subtotal { font-weight: bold; } .shop_table.cart td.product-name { padding: 0 30px; font-size: 100%; width: 35%; } .shop_table td.product-quantity .quantity { margin-top: 10px; } .shop_table.order_details .product-total, .shop_table .product-total { text-align: right; } .shop_table .total { color: #222222; } .shop_table .shipping th { padding-right: 15px; } .shop_table .shipping td { font-weight: normal; } .shop_table.my_account_orders .order-total { border: 0; } .cart_totals .order-total, .shop_table .order-total { vertical-align: center; border-bottom: 3px solid #DDD; border-top: 1px solid #DDD; } .cart_totals td { text-align: right; } .cart_totals h2 { border-bottom: 3px solid #dddddd; padding-bottom: 10px; text-transform: uppercase; font-size: 95%; } .shop_table .cart-subtotal { border-top: 1px solid #dddddd; } .checkout_table_item { border-bottom: 1px dotted #DDD; } .checkout_table_item .product-total { text-align: right; font-weight: bold; } .cart_totals p { line-height: 100%; } .shop_table tfoot th { text-transform: uppercase; font-size: 80%; } .shop_table tfoot td { text-align: right; font-weight: bold; } ul#shipping_method { margin-bottom: 0; } ul#shipping_method li { list-style: none; line-height: 90%; padding: 5px 0; } ul#shipping_method li input, ul#shipping_method li label { display: inline; } ul#shipping_method li input { margin: 0 5px 0 0; } /* -- shopping cart page -- */ .shop_table { margin-top: 4px; } .shop_table thead { border-bottom: 3px solid #DDD; text-transform: uppercase; color: #555555; } .shop_table .product-subtotal { text-align: right; } .items_found_cart { margin-bottom: 15px; display: block; } .cart-wrapper { padding-right: 30px; border-right: 1px solid #DDD; } .cart-sidebar .button { margin-bottom: 10px; } .cart-sidebar .widget-title { border-bottom: 3px solid #DDD; padding-bottom: 10px; } .checkout-button { margin-bottom: 30px !important; } tr.shipping td { padding-left: 15px; } .shipping-calculator-form select { margin-bottom: 0; } a.shipping-calculator-button { text-transform: uppercase; font-size: 80%; padding: 5px 0; margin: 5px 0 0 0; border-top: 1px dashed #DDD; display: block; width: 100%; } a.shipping-calculator-button:before { font-family: 'icomoon'; content: "\e00c" !important; margin-right: 5px; font-size: 6px; position: relative; top: -2px; } /* -- cross sells -- */ .cross-sells h2 { font-size: 100%; text-transform: uppercase; margin-top: 30px; margin-bottom: 15px; padding-top: 15px; border-top: 3px solid #DDD; } .cross-sells ul { margin-left: 0; } .cross-sells .row > .columns { padding: 0 !important; } .woocommerce-cart .cart-empty, .woocommerce-cart .return-to-shop { text-align: center; } /**********************************************************************/ /****************------------- 07. CHECKOUT -------------**************/ /**********************************************************************/ /* -- Hide stuff for cleaner checkout (footers and banners) -- */ .woocommerce-checkout .footer-1, .woocommerce-checkout .footer-2 { display: none !important; } /* Custom country select box style */ .woocommerce-checkout .select2-container .select2-choice { padding: 4px 0 4px 8px; border-radius: 0; } /* -- checkout breadcrumb --*/ .checkout-breadcrumb h1 { text-align: center; margin-bottom: 45px; text-transform: uppercase; font-weight: normal; color: #cccccc; font-size: 150%; } .checkout-breadcrumb span.divider { display: inline-block; margin: 0 10px; opacity: .6; } .woocommerce-cart .title-cart, .woocommerce-checkout .title-checkout { font-weight: bolder; color: #333333; } /* -- general checkout layout -- */ .woocommerce .order-review, .woocommerce-checkout form.login { border: 3px solid #627f9a; padding: 30px; } .woocommerce .checkout-group label { font-weight: bold; } .checkout-group h3 { color: #627f9a; font-size: 130%; text-transform: uppercase; padding: 8px 0 10px; margin-bottom: 15px; border-top: 3px solid #DDD; width: 98.5%; border-bottom: 1px solid #EEE; } .checkout-group h3:before, .order-review h3:before { content: '\f107'; font-family: 'icomoon'; margin-right: 10px; } .woocommerce-checkout .entry-title { width: 50%; display: inline-block; } /* -- checkout fields -- */ .woo-billing p { display: inline-block; margin-bottom: 25px; width: 98.5%; } .woo-billing p input { margin-bottom: 0; } #billing_address_1_field { margin-bottom: 10px; } #billing_first_name_field, #billing_last_name_field, #billing_email_field, #billing_phone_field { width: 49%; } #billing_first_name_field, #billing_email_field { padding-right: 2%; } label.checkbox { display: inline-block; margin-left: 10px; font-weight: normal; } p.create-account-row { display: inline-block; width: 98.5%; padding: 15px 0 10px; border-bottom: 1px solid #DDD; } .input-checkbox { display: inline-block; } #order_comments { width: 98.5%; } /* -- ship to other -- */ h3#ship-to-different-address { font-size: 100%; border-width: 1px; } h3#ship-to-different-address:before { display: none; } h3#ship-to-different-address label.checkbox { margin-left: 0; } h3#ship-to-different-address input { margin-bottom: 0; margin-left: 10px; } h3#ship-to-different-address:hover { color: #000000; } /* -- checkout order review -- */ .order-review h3 { padding: 0 0 10px; color: #627f9a; text-transform: uppercase; } ul.payment_methods { margin: 0 0 30px 0 !important; } ul.payment_methods .input-radio { margin-bottom: 15px; } ul.payment_methods li { list-style: none; border-bottom: 1px solid #DDD; padding-top: 5px; } ul.payment_methods li label { display: inline-block; margin-left: 10px; } ul.payment_methods p { font-size: 90%; line-height: 110%; opacity: .8; } a.about_paypal { display: none; } .form-row.terms { position: relative; } .form-row.terms .checkbox { padding-left: 25px; margin: 0; } .form-row.terms .input-checkbox { position: absolute; left: 0; top: 4px; } /* -- checkout page -- */ .page-checkout .woocommerce-info { margin-bottom: 0; padding-top: 0; } .woocommerce-checkout .shipping_address { display: none; } /* -- payment methods -- */ .payment_method_paypal img { max-width: 150px; margin-left: 5px; } a.about_paypal { font-size: 10px; margin-left: 5px; } /* -- checkout country dropdown fixes -- */ a.chzn-single { background: #ffffff !important; -webkit-border-radius: 0 !important; } .woocommerce-checkout .form-row .chzn-container-single .chzn-single { height: 32px !important; line-height: 33px !important; } /* -- Thank you -- */ .page-checkout .addresses { margin-bottom: 30px; } /**********************************************************************/ /*****************------------- 08. SLIDERS -------------**************/ /**********************************************************************/ /* Slider options \*------------------------------------*/ /* Sliders \*------------------------------------*/ .ux-slider-wrapper { position: relative; } /* Dragging */ .is-dragging .flickity-viewport > * { pointer-events: none; } .ux-slider, .ux-row-slider { margin-bottom: 30px; position: relative; overflow: hidden; } .js-flickity:not(.flickity-enabled) { white-space: nowrap; overflow-y: hidden; overflow-x: auto; width: auto; } .js-flickity:not(.flickity-enabled) > * { display: inline-block !important; white-space: normal !important; vertical-align: top; } .js-flickity:not(.flickity-enabled) > a { width: 100%; } /* Before slider is loaded */ .ux-slider > .slide, .ux-slider > a, .ux-slider > a > img, .ux-slider > img, .ux-slider > .ux-img-container { width: 100%; } /* Add Fading effect */ .flickity-slider > * { -webkit-transition: -webkit-transform .6s, opacity .6s, box-shadow 0.6s; transition: transform .6s, opacity .6s, box-shadow 0.6s; } /* When slider is loaded */ .flickity-slider > .ux_banner, .flickity-slider > .row, .flickity-slider > a, .flickity-slider > a > img, .flickity-slider > .slide, .flickity-slider > img, .flickity-slider > figure, .flickity-slider .ux-img-container { width: 100%; padding: 0; margin: 0; } .flickity-enabled { position: relative; } .flickity-enabled:focus { outline: none; } .flickity-viewport { overflow: hidden; position: relative; height: 100%; width: 100%; } .flickity-slider { position: absolute; width: 100%; height: 100%; } /* draggable */ .flickity-enabled.is-draggable { -webkit-tap-highlight-color: transparent; tap-highlight-color: transparent; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .flickity-enabled.is-draggable .flickity-viewport { cursor: move; cursor: -webkit-grab; cursor: -moz-grab; cursor: grab; } .flickity-enabled.is-draggable .flickity-viewport.is-pointer-down { cursor: -webkit-grabbing; cursor: -moz-grabbing; cursor: grabbing; } /* ---- previous/next buttons ---- */ .flickity-prev-next-button.previous { left: 0; } .row.js-flickity .flickity-prev-next-button.previous { -webkit-transform: translateX(-30px); -ms-transform: translateX(-30px); transform: translateX(-30px); } .flickity-prev-next-button.next { right: 0; } .row.js-flickity .flickity-prev-next-button.next { -webkit-transform: translateX(30px); -ms-transform: translateX(30px); transform: translateX(30px); } /* right to left */ .flickity-rtl .flickity-prev-next-button.previous { left: auto; right: 0; } .flickity-rtl .flickity-prev-next-button.next { right: auto; left: 0; } .flickity-prev-next-button { position: absolute; top: 0; bottom: 0; background-color: transparent; margin: 0; padding: 0; width: 15%; max-width: 80px; color: #111; border: none; cursor: pointer; opacity: 0; -webkit-transition: -webkit-transform 0.3s, opacity 0.3s, background 0.3s; transition: transform 0.3s, opacity 0.3s, background 0.3s; } .js-flickity:hover .flickity-prev-next-button { opacity: 0.7; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } .js-flickity .flickity-prev-next-button:hover { box-shadow: none; opacity: 1; } .js-flickity .flickity-prev-next-button:hover svg, .js-flickity .flickity-prev-next-button:hover .arrow { fill: #627f9a; } .flickity-prev-next-button:disabled, button.flickity-prev-next-button[disabled] { opacity: 0 !important; background: none !important; cursor: auto; box-shadow: none !important; pointer-events: none; } .flickity-prev-next-button svg { position: absolute; padding: 10%; left: 50%; top: 50%; width: 100%; max-width: 36px; max-height: 36px; height: auto; -webkit-transition: all 0.3s; transition: all 0.3s; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .slider-nav-push .flickity-prev-next-button svg { margin-top: -40px; } .flickity-prev-next-button svg, .flickity-prev-next-button .arrow { border-color: currentColor; fill: #111; -webkit-transition: all 0.3s; transition: all 0.3s; } /* color & size if no SVG - IE8 and Android 2.3 */ .flickity-prev-next-button.no-svg { color: #111; font-size: 26px; } /* ---- Navigation styles ----- */ .ux-slider .flickity-prev-next-button.next, .ux-row-slider .flickity-prev-next-button.next { -webkit-transform: translate(15%); -ms-transform: translate(15%); transform: translate(15%); } .ux-slider .flickity-prev-next-button.previous, .ux-row-slider .flickity-prev-next-button.previous { -webkit-transform: translateX(-15%); -ms-transform: translateX(-15%); transform: translateX(-15%); } .ux-slider:hover .flickity-prev-next-button.next, .ux-row-slider:hover .flickity-prev-next-button.next { -webkit-transform: translate(0); -ms-transform: translate(0); transform: translate(0); } .ux-slider:hover .flickity-prev-next-button.previous, .ux-row-slider:hover .flickity-prev-next-button.previous { -webkit-transform: translate(0); -ms-transform: translate(0); transform: translate(0); } .ux-row-slider .flickity-prev-next-button { width: 35px; } .slider-nav-outside { overflow-x: visible; } .slider-nav-outside .flickity-prev-next-button { width: 40px; } .slider-nav-outside .flickity-prev-next-button.next { right: auto; left: 100%; } .slider-nav-outside .flickity-prev-next-button.previous { left: auto; right: 100%; } .slider-nav-reveal { overflow-x: hidden; } .slider-nav-reveal .flickity-prev-next-button { width: 30px; background-color: #FFF; box-shadow: 0 -150px 30px 0 rgba(0, 0, 0, 0.2); } .slider-nav-reveal .flickity-prev-next-button:hover { box-shadow: 0 -150px 30px 0 rgba(0, 0, 0, 0.2); } .slider-nav-reveal .flickity-prev-next-button svg { max-width: 25px; max-height: 25px; } .slider-nav-circle .flickity-prev-next-button svg, .slider-nav-circle .flickity-prev-next-button .arrow { border-radius: 100%; border: 3px solid currentColor; } .slider-nav-circle .flickity-prev-next-button:hover svg, .slider-nav-circle .flickity-prev-next-button:hover .arrow { background-color: #627f9a; border-color: #627f9a; fill: #fff !important; } .slider-nav-small svg { max-width: 32px; max-height: 32px; border-width: 2px !important; } /* Fix slider for Mobile Screens */ @media screen and (max-width: 48em) { .ux-slider .flickity-prev-next-button { display: none; } .ux-row-slider .flickity-prev-next-button { width: 15px !important; opacity: 0.8; box-shadow: none !important; } .flickity-prev-next-button svg { padding: 0; border: 0 !important; } .flickity-page-dots { pointer-events: none; } } /* ---- page dots ---- */ .flickity-page-dots { position: absolute; width: 100%; bottom: 20px; left: 0; right: 0; padding: 0; margin: 0; list-style: none; text-align: center; line-height: 1; } .row.js-flickity .flickity-page-dots { position: relative; bottom: 0; margin-bottom: 30px; } .flickity-rtl .flickity-page-dots { direction: rtl; } .flickity-page-dots .dot { display: inline-block; width: 14px; height: 14px; margin: 0 3px; border: 3px solid #111; border-radius: 50%; opacity: 0.4; cursor: pointer; -webkit-transition: opacity .3s; transition: opacity .3s; /* Small dots */ } .nav-dots-small .flickity-page-dots .dot, .row.js-flickity .flickity-page-dots .dot { opacity: 0.2; width: 10px; height: 10px; border: 0; background-color: #111; } .flickity-page-dots .dot:hover { opacity: 0.7; } .flickity-page-dots .dot.is-selected { background-color: #111; opacity: 1 !important; } /* Slider colors */ .slider-nav-light { /* Arrows */ /* Dots */ } .slider-nav-light .flickity-prev-next-button { color: #FFF; } .slider-nav-light .flickity-prev-next-button svg, .slider-nav-light .flickity-prev-next-button .arrow { fill: #FFF; } .slider-nav-light .flickity-page-dots .dot { border-color: #FFF; } .slider-nav-light .flickity-page-dots .dot.is-selected { background-color: #FFF; } /* No arrows */ .slider-no-arrows .flickity-prev-next-button { display: none !important; } /* Slider Style - Conatiner */ .slider-style-container, .slider-style-focus { background-color: #333; } .slider-style-container .flickity-slider > *, .slider-style-focus .flickity-slider > * { max-width: 1080px; margin: 0 auto; } .slider-style-container:not(.flickity-enabled) .ux_banner, .slider-style-focus:not(.flickity-enabled) .ux_banner { opacity: 0 !important; } .slider-style-container .ux_banner, .slider-style-focus .ux_banner { opacity: 1; } .slider-style-container .flickity-slider > *:not(.is-selected), .slider-style-focus .flickity-slider > *:not(.is-selected) { opacity: 0.5; } /* Slider Style - Focus */ .slider-style-focus { background-color: transparent; padding: 30px 0; } .slider-style-focus .flickity-page-dots { bottom: 0; } .slider-style-focus .flickity-slider > * { max-width: 1050px; } .slider-style-focus .flickity-slider > *:not(.is-selected) { -webkit-transform: scale(0.93); -ms-transform: scale(0.93); transform: scale(0.93); } /* -- product gallery slider -thumbnails -- */ .product-gallery-slider { margin-bottom: 20px; } .product-gallery-slider img, .product-thumbnails img { min-width: 100%; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .product-thumbnails { margin-left: -7.5px; margin-right: -7.5px; } .product-thumbnails li { list-style: none; float: left; width: 25%; padding: 0 7.5px; } .product-thumbnails:not(.flickity-enabled) li:nth-child(n+5) { display: none; } .product-thumbnails a { overflow: hidden; display: block; border: 1px solid transparent; } .product-thumbnails .is-nav-selected a { border-color: #ccc; } .product-thumbnails img { margin-bottom: -10px; opacity: 0.5; -webkit-transition: -webkit-transform 0.6s, opacity 0.6s; transition: transform 0.6s, opacity 0.6s; } .product-thumbnails a:hover img, .product-thumbnails .is-nav-selected a img { -webkit-transform: translateY(-10px); -ms-transform: translateY(-10px); transform: translateY(-10px); opacity: 1; } /**********************************************************************/ /**************------------- 09. BANNER SYSTEM -------------***********/ /**********************************************************************/ /* -- banner grid */ .ux_banner-grid { margin-left: -7.5px !important; margin-right: -7.5px !important; } .ux_banner-grid .columns { margin-bottom: 15px; margin-left: -.1px; } .ux_banner-grid .columns > .column-inner { padding-left: 7.5px; padding-right: 7.5px; } .ux_banner-grid .columns > img { margin-bottom: 10px; } .ux_banner-grid .iosSlider { margin-bottom: 0 !important; top: 0 !important; } .ux-grid-column .column-inner, .ux-grid-column .ux_banner, .ux-grid-column .ux-slider-wrapper, .ux-grid-column .ux-slider-wrapper .ux-slider, .ux-grid-column .ux-slider-wrapper .flickity-viewport { height: 100% !important; } .ux-grid-column.columns { margin-bottom: 15px; } /* -- ux banner -- */ .ux_banner .inner-wrap.animated { opacity: 0; } #content > .ux_banner, #content > .ux_block > .ux_banner { margin-bottom: 30px; } .ux_banner { word-wrap: normal; width: 100%; background: #627f9a; line-height: 140%; display: block; position: relative; overflow: hidden; } .ux_banner, .ux_slider_wrapper { -ms-user-select: none; -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; user-select: none; } .ux_banner.light { background: #f9f9f9; } .ux_banner .banner-bg, .ux-section .banner-bg, .ux-section .bg-overlay, .ux_banner .bg-overlay, .ux-section-img { z-index: 1; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-size: cover; background-repeat: no-repeat; background-position: 50% 50%; } .ux_banner .bg-overlay { z-index: 2; } .ux_banner .banner-effect { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; overflow: hidden; background-color: transparent; } .ux_banner.full-height { min-height: 100vh; } .ux_banner .row { position: relative; height: 100%; z-index: 2; max-width: 67.5em !important; margin-left: auto !important; margin-right: auto !important; } /* UX Sections */ .ux-section { position: relative; overflow: hidden; } .ux-section.dark { background-color: #000000; } .ux-section .banner-bg.ux_parallax, .ux_banner .banner-bg.ux_parallax { background-attachment: scroll !important; opacity: 0; } .ux-section .ux-section-content { z-index: 10; position: relative; } #content .slider .ux-section { padding-left: 0 !important; padding-right: 0 !important; } .ux-section-img { left: auto; right: 0; width: 50%; background-position: bottom left; background-size: auto 100%; } .ux-section-img img { display: none; } .ux-section-img.left { right: auto; left: 0; background-position: bottom right; } .ux-section-img.top, .ux-section-img.bottom { position: relative; width: 100% !important; } .ux-section-img.top { margin-bottom: 30px; background-position: top center; } .ux-section-img.bottom { margin-top: 30px; background-position: bottom center; } .ux-section-img.bottom img, .ux-section-img.top img { display: block; margin: 0 auto; visibility: hidden; width: 100%; max-width: 67.5em; } .ux-section.has-img-top { padding-top: 0 !important; } .ux-section.has-img-bottom { padding-bottom: 0 !important; } .ux_parallax.parallax-active { opacity: 1; } .parallax_img_inner { opacity: 0; } /* section title */ .ux-bg-title { text-align: center; position: relative; bottom: -26px; z-index: 99; } .ux-bg-title span { color: #627f9a; font-size: 80%; display: inline-block; background: #ffffff; text-transform: uppercase; padding: 5px 15px; border: 2px solid #627f9a; } .text-center .button { margin: 10px 5px 10px; } .text-right .button { margin: 10px 0 10px 10px; } .text-left .button { margin: 10px 10px 10px 0; } .ux_banner .center, .ux-text-overlay .text-vertical-center { bottom: 50% !important; top: auto !important; text-align: center; -webkit-transform: translateY(50%) !important; -ms-transform: translateY(50%) !important; transform: translateY(50%) !important; } .ux_banner .center.bottom, .ux_banner .center.top { -webkit-transform: translateY(0) !important; -ms-transform: translateY(0) !important; transform: translateY(0) !important; } /* ux banner inner */ .ux_banner .inner { white-space: normal; z-index: 3; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: 0 auto; } .ux_banner .inner.left { left: 10%; right: auto; text-align: left; } .ux_banner .inner.far-left { left: 20px; right: auto; text-align: left; } .ux_banner .inner.right { left: auto; right: 10%; text-align: right; } .ux_banner .inner.far-right { left: auto; right: 20px; text-align: right; } .ux_banner .inner.top { top: 12% !important; margin: 0 auto !important; bottom: auto !important; } .ux_banner .inner.bottom { bottom: 12% !important; margin: 0 auto !important; top: auto !important; } .ux_banner .inner.far-bottom { bottom: 0 !important; top: auto !important; } .ux_banner .inner.far-top { top: 0 !important; bottom: auto !important; } .ux_banner .inner.full-width { left: 0 !important; right: 0 !important; width: 100% !important; } .ux_banner .center .tx-div, .ux_banner .center p { margin: 0 auto; max-width: 90%; } .ux_banner .left .tx-div, .ux_banner .left p, .ux_banner .far-left .tx-div, .ux_banner .far-left p { margin: 0 auto 0 0; max-width: 90%; } .ux_banner .right .tx-div, .ux_banner .far-right .tx-div, .ux_banner .right p, .ux_banner .far-right p { margin: 0 0 0 auto; max-width: 90%; } .ux_banner .text-center .tx-div, .ux_banner .text-center p { margin: 0 auto; max-width: 90%; } .ux_banner .text-left .tx-div, .ux_banner .text-left p { margin: 0 auto 0 0; max-width: 90%; } .ux_banner .text-right .tx-div, .ux_banner .text-right p { margin: 0 0 0 auto; max-width: 90%; } .ux_banner .tx-div { margin-top: 20px !important; margin-bottom: 20px !important; } .ux_banner .social-icons { margin-top: 10px; margin-bottom: 10px; } .text-box-dark, .text-box-light, .text-box-primary { display: inline; line-height: 140% !important; padding: 5px 15px 6px; } .text-box-dark { background-color: rgba(0, 0, 0, 0.8); color: #ffffff; } .text-box-light { background-color: #ffffff; color: #111111; } .text-box-primary { background: #627f9a; color: #ffffff; } .dark .text-box-light { color: #000000; } .ux_banner .inner.text-boxed > .inner-wrap { box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.1); } /* -- text styles -- */ .text-bordered-white, .text-bordered-primary, .text-bordered-dark { border: 2px solid #ffffff; padding: 5px; display: inline-block; } .text-bordered-dark { border-color: #000000; } h1.text-bordered-white, h1.text-bordered-primary, h1.text-bordered-dark { padding: 15px; } .text-boarder-top-bottom-white, .text-boarder-top-bottom-dark { border-top: 3px solid #ffffff; padding-top: 15px; border-bottom: 3px solid #ffffff; padding-bottom: 15px; display: inline-block; } .text-boarder-top-bottom-dark { border-color: #000000; } /* -- category banners -- */ .ux_banner .cat-count, .ux_banner .cat-title { position: relative; } .ux_banner .cat-title { bottom: -10px; } .ux_banner .cat-count { opacity: 0; bottom: -15px; font-size: 13px; } .ux_banner:hover .cat-count { opacity: 1; bottom: 0; } .ux_banner:hover .cat-title { opacity: 1; bottom: 0; } /* -- hover styles -- */ .ux_banner.hover_fade .banner-bg, .ux_banner.hover_zoom .banner-bg, .ux_banner.hover_blur .banner-bg { -webkit-transition: all .3s ease-out; transition: all .3s ease-out; } /* -- hover style : fade effect --*/ .ux_banner.hover_fade:hover .banner-bg { opacity: .5; } /* -- hover style : hover zoom --*/ .ux_banner.hover_zoom:hover .banner-bg { opacity: .5; -webkit-transform: scale(1.15); -ms-transform: scale(1.15); transform: scale(1.15); } /* -- hover style : blur -- */ .ux_banner.hover_blur { background-color: #666666 !important; } .ux_banner.hover_blur:hover .banner-bg { opacity: .7; filter: blur(4px); -o-filter: blur(4px); -ms-filter: blur(4px); -moz-filter: blur(4px); -webkit-filter: blur(4px); } /* -- Slide Effects -- */ .ux-slider .slide-zoom-in { -webkit-transition: -webkit-transform 15s linear !important; transition: transform 15s linear !important; -webkit-transform: translateY(0) scale(1) !important; -ms-transform: translateY(0) scale(1) !important; transform: translateY(0) scale(1) !important; } .ux-slider .is-selected .slide-zoom-in { -webkit-transform: translateY(15%) scale(1.3) !important; -ms-transform: translateY(15%) scale(1.3) !important; transform: translateY(15%) scale(1.3) !important; } .ux-slider .flickity-slider .slide-zoom-out { -webkit-transition: -webkit-transform 15s linear !important; transition: transform 15s linear !important; -webkit-transform: translateY(15%) scale(1.3) !important; -ms-transform: translateY(15%) scale(1.3) !important; transform: translateY(15%) scale(1.3) !important; } .ux-slider .is-selected .slide-zoom-out { -webkit-transform: translateY(0) scale(1) !important; -ms-transform: translateY(0) scale(1) !important; transform: translateY(0) scale(1) !important; } /* -- video overlay -- */ .ux-banner-video { position: absolute; top: 0; left: 0; bottom: 0; right: 0; min-width: 100%; min-height: 100%; z-index: 1; } .ux-youtube { position: absolute; top: 0; bottom: 0; right: 0; left: 0; z-index: 2; } /* -- font sizes -- */ .ux_banner h1, .ux_text h1 { font-weight: bolder; font-size: 350%; line-height: 95%; margin: 15px 0; } .ux_banner h2, .ux_text h2 { font-size: 300%; line-height: 100%; margin: 15px 0; } .ux_banner h3, .ux_text h3 { font-size: 200%; line-height: 100%; margin: 15px 0; } .ux_banner h4, .ux_text h4 { font-size: 150%; line-height: 100%; margin: 10px 0; } .ux_banner h5, .ux_text h5 { font-size: 100%; line-height: 100%; margin: 10px 0; } .ux_banner h6, .ux_text h6 { font-size: 60%; line-height: 100%; margin: 10px 0; } .ux_banner p { font-size: 60%; line-height: 120%; margin-bottom: 15px !important; } .ux_banner strong { font-weight: 800; } /* large headers */ .h-large { font-size: 200%; line-height: 100%; } .h-xlarge { font-size: 300%; line-height: 100%; } .h-xxlarge { font-size: 400%; line-height: 100%; } .ux_banner .h-large, .ux_text .h-large { font-size: 650%; line-height: 85%; padding: 0 !important; } .ux_banner .h-xlarge, .ux_text .h-xlarge { font-size: 1200%; line-height: 85%; padding: 0 !important; } .ux_banner .h-xxlarge, .ux_text .h-xxlarge { font-size: 1500%; line-height: 85%; padding: 0 !important; } .large-1 .ux_banner, .large-2 .ux_banner { font-size: 7px; } .grid-small-height.large-6 .ux_banner, .large-3 .ux_banner, .large-4 .ux_banner { font-size: 8px; } .large-6 .ux_banner { font-size: 14px; } .large-7 .ux_banner { font-size: 14px; } .large-8 .ux_banner { font-size: 14px; } .large-9 .ux_banner { font-size: 14px; } .large-1 .ux_banner .button, .large-2 .ux_banner .button, .large-3 .ux_banner .button, .large-4 .ux_banner .button { font-size: 140%; } .large-6 .ux_banner .text-boxed, .large-5 .ux_banner .text-boxed, .large-4 .ux_banner .text-boxed { min-width: 50%; } .large-3 .ux_banner .text-boxed { min-width: 80%; } /* input styles */ .ux_banner .text-center input.ninja-forms-field { text-align: center; } .ux_banner input.ninja-forms-field.button { margin-top: 0 !important; } .ux_banner input[type='text'].ninja-forms-field { padding: .6em; font-size: 100%; } .ux_banner .ninja-forms-success-msg p { color: #000000; padding: 10px; border: 1px solid #000000; margin: 0; } .ux_banner.dark .ninja-forms-success-msg p { color: #ffffff; padding: 10px; border: 1px solid #ffffff; margin: 0; } /* -- UX texts -- */ .ux_text { display: table; height: 100%; width: 100%; } .ux_text .inner { display: table-cell; height: 100%; vertical-align: middle; } .ux_text.top .inner { vertical-align: top; } .ux_text.bottom .inner { vertical-align: bottom; } .ux_text.text-center { margin: 0 auto; } /* rotate styles */ .ux_banner .tilt-right { -ms-transform: rotate(3deg); /* IE 9 */ -webkit-transform: rotate(3deg); /* Chrome, Safari, Opera */ transform: rotate(3deg); } .ux_banner .tilt-left { -ms-transform: rotate(-3deg); /* IE 9 */ -webkit-transform: rotate(-3deg); /* Chrome, Safari, Opera */ transform: rotate(-3deg); } /* smaller font sizes on small columns */ @media only screen and (max-width: 500px) { .ux_banner .inner { min-width: 60% !important; } .ux_banner { font-size: 9px; } .ux_banner p { font-size: 120%; } } @media only screen and (min-width: 500px) { .ux_banner { font-size: 10px; } .ux_banner p { font-size: 115%; } } @media only screen and (min-width: 600px) { .ux_banner { font-size: 12px; } .ux_banner p { font-size: 110%; } } @media only screen and (min-width: 48em) { .ux_banner { font-size: 16px; } .ux_banner p { font-size: 100%; } } /* mobile fixes */ @media only screen and (max-width: 48em) { .ux-section .banner-bg, .ux_banner .banner-bg { margin-top: 0 !important; -webkit-transform: none !important; -ms-transform: none !important; transform: none !important; opacity: 1 !important; } } /* Touch fix */ html[data-useragent*='iPad'] .ux-banner-video { display: none !important; } html[data-useragent*='iPad'] .ux-section .banner-bg.ux_parallax, html[data-useragent*='iPad'] .ux_banner .banner-bg.ux_parallax, html[data-useragent*='iPhone'] .ux-section .banner-bg.ux_parallax, html[data-useragent*='iPhone'] .ux_banner .banner-bg.ux_parallax { background-position: 50% 20% !important; background-size: cover !important; background-attachment: scroll !important; opacity: 1 !important; } /**********************************************************************/ /*************------------- 10. LIGHTBOX -------------*****************/ /**********************************************************************/ /*------------------------------------*\ Popups \*------------------------------------*/ /* - Magnific Popup CSS - */ .mfp-bg { top: 0; left: 0; width: 100%; height: 100%; z-index: 1042; overflow: hidden; position: fixed; background: #0b0b0b; opacity: 0; -webkit-transition: opacity 0.2s; transition: opacity 0.2s; } .mfp-bg.mfp-ready { opacity: 0.6; } .mfp-bg.mfp-removing { opacity: 0 !important; } .mfp-wrap { top: 0; left: 0; width: 100%; height: 100%; z-index: 1043; position: fixed; outline: none !important; -webkit-backface-visibility: hidden; } .mfp-container { text-align: center; position: absolute; width: 100%; height: 100%; left: 0; top: 0; padding: 0; -moz-box-sizing: border-box; box-sizing: border-box; } .mfp-container:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; } .mfp-image-holder { padding: 40px 6.66%; } .mfp-align-top .mfp-container:before { display: none; } .mfp-content { position: relative; display: inline-block; vertical-align: middle; margin: 0 auto; text-align: left; z-index: 1045; -webkit-transform: translateY(-20px) scale(0.95); -ms-transform: translateY(-20px) scale(0.95); transform: translateY(-20px) scale(0.95); opacity: 0; -webkit-transition: -webkit-transform 0.3s, opacity 0.3s, scale 0.3s; transition: transform 0.3s, opacity 0.3s, scale 0.3s; } .mfp-content-inner { box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.2); } .mfp-ready .mfp-content { opacity: 1; -webkit-transform: translateY(0px) scale(1); -ms-transform: translateY(0px) scale(1); transform: translateY(0px) scale(1); } .mfp-ready.mfp-removing .mfp-content { opacity: 0; } .mfp-inline-holder .mfp-content, .mfp-ajax-holder .mfp-content { width: 100%; cursor: auto; } .mfp-ajax-cur { cursor: progress; } .mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close { cursor: -moz-zoom-out; cursor: -webkit-zoom-out; cursor: zoom-out; } .mfp-zoom { cursor: pointer; cursor: -webkit-zoom-in; cursor: -moz-zoom-in; cursor: zoom-in; } .mfp-auto-cursor .mfp-content { cursor: auto; } .mfp-close, .mfp-arrow, .mfp-preloader, .mfp-counter { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .mfp-loading.mfp-figure { display: none; } .mfp-hide { display: none !important; } .mfp-preloader { color: #cccccc; position: absolute; top: 50%; width: auto; text-align: center; margin-top: -0.8em; left: 8px; right: 8px; z-index: 1044; } .mfp-preloader a { color: #cccccc; } .mfp-preloader a:hover { color: white; } .mfp-s-ready .mfp-preloader { display: none; } .mfp-s-error .mfp-content { display: none; } button.mfp-close, button.mfp-arrow { overflow: visible; cursor: pointer; background: transparent; border: 0; -webkit-appearance: none; display: block; outline: none; padding: 0; z-index: 1046; box-shadow: none; } button::-moz-focus-inner { padding: 0; border: 0; } .mfp-close { width: 40px; height: 40px; line-height: 40px; position: absolute; right: 0; top: 0; text-decoration: none; text-align: center; opacity: 0.65; filter: alpha(opacity=65); padding: 0 0 18px 10px; margin: 0 !important; color: white; font-style: normal; font-size: 28px; font-family: Arial, monospace; } .mfp-close:hover, .mfp-close:focus { opacity: 1; filter: alpha(opacity=100); } .mfp-close:active { top: 1px; } .mfp-close-btn-in .mfp-close { color: currentColor; } .mfp-counter { position: absolute; top: 0; right: 0; color: #cccccc; font-size: 12px; line-height: 18px; } .mfp-arrow { position: fixed; opacity: 0.4; filter: alpha(opacity=40); background-color: #555 !important; margin: 0; top: 50%; margin-top: -55px; padding: 0; width: 90px; height: 110px; -webkit-tap-highlight-color: transparent; } .mfp-arrow:active { margin-top: -54px; } .mfp-arrow:hover, .mfp-arrow:focus { opacity: 1; filter: alpha(opacity=100); } .mfp-arrow:before, .mfp-arrow:after, .mfp-arrow .mfp-b, .mfp-arrow .mfp-a { content: ''; display: block; width: 0; height: 0; position: absolute; left: 0; top: 0; margin-top: 35px; margin-left: 35px; border: medium inset transparent; } .mfp-arrow:after, .mfp-arrow .mfp-a { border-top-width: 13px; border-bottom-width: 13px; top: 8px; } .mfp-arrow:before, .mfp-arrow .mfp-b { border-top-width: 21px; border-bottom-width: 21px; opacity: 0.7; } .mfp-arrow-left { left: 0; -webkit-transition: all 0.2s; transition: all 0.2s; } .mfp-removing .mfp-arrow-left { left: -100px; } .mfp-removing .mfp-arrow-right { right: -100px; } .mfp-arrow-left:after, .mfp-arrow-left .mfp-a { border-right: 17px solid white; margin-left: 31px; } .mfp-arrow-right { right: 0; } .mfp-arrow-right:after, .mfp-arrow-right .mfp-a { border-left: 17px solid white; margin-left: 39px; } .mfp-iframe-holder { padding-top: 40px; padding-bottom: 40px; } .mfp-iframe-holder .mfp-content { line-height: 0; width: 100%; max-width: 900px; } .mfp-iframe-holder .mfp-close { top: -40px; } .mfp-iframe-scaler { width: 100%; height: 0; overflow: hidden; padding-top: 56.25%; } .mfp-iframe-scaler iframe { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: black; } /* Main image in popup */ img.mfp-img { width: auto; max-width: 100%; height: auto; display: block; line-height: 0; -moz-box-sizing: border-box; box-sizing: border-box; padding: 0 0 40px; margin: 0 auto; } /* The shadow behind the image */ .mfp-figure { line-height: 0; } .mfp-figure:after { content: ''; position: absolute; left: 0; top: 40px; bottom: 40px; display: block; right: 0; width: auto; height: auto; z-index: -1; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #444444; } .mfp-figure small { color: #bdbdbd; display: block; font-size: 12px; line-height: 14px; } .mfp-figure figure { margin: 0; } .mfp-bottom-bar { margin-top: -36px; position: absolute; top: 100%; left: 0; width: 100%; cursor: auto; } .mfp-title { font-size: 11px; text-align: left; line-height: 18px; color: #f3f3f3; word-wrap: break-word; padding-right: 36px; } .mfp-image-holder .mfp-content { max-width: 100%; } .mfp-gallery .mfp-image-holder .mfp-figure { cursor: pointer; } @media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) { /** Remove all paddings around the image on small screen */ .mfp-img-mobile .mfp-image-holder { padding-left: 0; padding-right: 0; } .mfp-img-mobile img.mfp-img { padding: 0; } .mfp-img-mobile .mfp-figure:after { top: 0; bottom: 0; } .mfp-img-mobile .mfp-figure small { display: inline; margin-left: 5px; } .mfp-img-mobile .mfp-bottom-bar { background: rgba(0, 0, 0, 0.6); bottom: 0; margin: 0; top: auto; padding: 3px 5px; position: fixed; -moz-box-sizing: border-box; box-sizing: border-box; } .mfp-img-mobile .mfp-bottom-bar:empty { padding: 0; } .mfp-img-mobile .mfp-counter { right: 5px; top: 3px; } .mfp-img-mobile .mfp-close { top: 0; right: 0; width: 35px; height: 35px; line-height: 35px; position: fixed; text-align: center; padding: 0; } } @media all and (max-width: 900px) { .mfp-arrow { -webkit-transform: scale(0.75); -ms-transform: scale(0.75); transform: scale(0.75); } .mfp-arrow-left { -webkit-transform-origin: 0; -ms-transform-origin: 0; transform-origin: 0; } .mfp-arrow-right { -webkit-transform-origin: 100%; -ms-transform-origin: 100%; transform-origin: 100%; } } .mfp-ie7 .mfp-img { padding: 0; } .mfp-ie7 .mfp-bottom-bar { width: 600px; left: 50%; margin-left: -300px; margin-top: 5px; padding-bottom: 5px; } .mfp-ie7 .mfp-container { padding: 0; } .mfp-ie7 .mfp-content { padding-top: 44px; } .mfp-ie7 .mfp-close { top: 0; right: 0; padding-top: 0; } /* Off canvas popups */ .off-canvas .mfp-content, .off-canvas.mfp-ready.mfp-removing .mfp-content { position: fixed; top: 0; bottom: 0; height: 100%; width: 260px; background-color: #333; left: 0; overflow-y: scroll; -webkit-overflow-scrolling: touch; -webkit-transition: -webkit-transform 0.2s; transition: transform 0.2s; -webkit-transform: translateX(-270px); -ms-transform: translateX(-270px); transform: translateX(-270px); box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5); } .off-canvas .mfp-content::-webkit-scrollbar { width: 0 !important; height: 0 !important; } .off-canvas .mfp-close { display: none; } .off-canvas.right .mfp-content, .off-canvas.right.mfp-ready.mfp-removing .mfp-content { left: auto; right: 0; -webkit-transform: translateX(260px); -ms-transform: translateX(260px); transform: translateX(260px); } .off-canvas.light .mfp-content, .off-canvas.light.mfp-ready.mfp-removing .mfp-content { background-color: #f6f6f6; } .mfp-ready .mfp-content, .off-canvas.mfp-ready .mfp-content, .popup-box.mfp-ready .mfp-content { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); opacity: 1; } .off-canvas .sidebar-inner, .off-canvas .inner { padding: 30px; } /* Fixes */ .mfp-content .large-12 { padding: 0 !important; margin-bottom: 0 !important; } .mfp-content .nav-dropdown-inner { padding: 30px 15px; } .off-canvas .hide-for-small { display: block !important; } .mfp-content .widget_product_categories li ul.children { display: block !important; } /**********************************************************************/ /*************------------- 11. SHORTCODES -------------***************/ /**********************************************************************/ /* -- Google maps --*/ #map_container { position: relative; margin-bottom: 30px; } #map_container .map-info { position: absolute; bottom: 30px; left: 0; right: 30px; } #map_container .map_inner { padding: 15px; background-color: #ffffff; background-color: rgba(255, 255, 255, 0.8); } /* -- Featured products. Used in Pintrest style / lookbook -- */ .featured-product { margin-bottom: 10px; } .featured-product .product-bg { position: absolute; bottom: 0; top: 0; left: 0; right: 0; background: #627f9a; opacity: 0; color: #ffffff; } .featured-product:hover .product-bg { opacity: .4; } .featured-product .product-text { font-size: 80%; padding: 0 15%; position: absolute; top: 30%; width: 100%; text-align: center; opacity: 0; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2); } .featured-product .product-text h3 { text-transform: uppercase; color: #ffffff; } .featured-product:hover .product-text { opacity: 1; } .featured-product .front-image img { width: 100% !important; } .featured-product .price { font-size: 150%; } .featured-product .star-rating { margin: 0 auto 10px; } .featured-product .price .from, .featured-product .price .amount { color: #ffffff; } /* -- zoom style for pinterest grid -- */ .pinterest-style { margin-left: -5px; margin-right: -5px; } .pinterest-style li { float: left; list-style: none; margin: 0; min-height: 200px; } .pinterest-style .featured-product > a { display: block; overflow: hidden; margin: 5px; } .pinterest-style .featured-product img { -webkit-transition: -webkit-transform 3s ease; transition: transform 3s ease; } .pinterest-style .featured-product:hover img { -webkit-transform: scale(1.25); -ms-transform: scale(1.25); transform: scale(1.25); } /* -- lookbook slider -- */ .lookbook-slider ul { margin: 0 !important; } .lookbook-slider li { padding: 0 !important; } .lookbook-slider .quick-view { bottom: 42%; font-size: 95%; margin: 0 auto; opacity: 0; background: #ffffff !important; color: #000000; padding: 10px 20px; width: 170px; } .lookbook-slider .product-image:hover .quick-view { bottom: 45%; opacity: .8; } .lookbook-slider .callout { left: 20px !important; } /* -- Testimonials -- */ .testimonial_inner { position: relative; padding-top: 15px; margin-bottom: 30px; } .testimonial_text { font-style: italic; } .testimonial_image img { width: 120px; margin-bottom: 30px; } .text-left .testimonial_text { padding-left: 100px; } .text-left .testimonial_image img { position: absolute; left: 0; top: 15px; width: 80px; } .testimonial_text .test_content { line-height: 135%; } .testimonial_text .test_name { display: inline-block; font-weight: bold; } .testimonial_text .test_company { display: inline-block; margin-left: 5px; color: #777; } .testimonial_text .star-rating { margin-bottom: 10px; font-style: normal; } .slider > .testimonial.text-center > .testimonial_inner { padding: 30px; } .slider.columns-1 > .testimonial.text-center > .testimonial_inner { padding: 30px 120px 40px; } /* -- featured box -- */ .featured-box { position: relative; -webkit-transition: opacity 200ms ease-out; transition: opacity 200ms ease-out; } .featured-box .featured-img { margin-bottom: 10px; } .featured-box .featured-img img { vertical-align: inherit; } .featured-box h4 { font-size: 100%; margin-bottom: 5px; text-transform: uppercase; } .featured-box h4 span { display: block; font-weight: normal; font-weight: 300; opacity: .9; text-transform: none; } .featured-box p { font-size: 95%; } .featured-box p:last-of-type { padding-bottom: 0; margin-bottom: 0; } .featured-box.pos-left { padding-left: 70px; } .featured-box.pos-left .featured-img { position: absolute; left: 0; top: 3px; max-width: 50px; } .row.boxed .featured-box.pos-left { padding-left: 40px; } .row.boxed .featured-box.pos-left .featured-img { left: -20px; top: 20px; background: #000000; border-radius: 99px; padding: 5px; } .featured-box.pos-center { text-align: center; } .featured-box.pos-center .tx-div { margin: 0 auto 10px; } .featured-box .box-inner img.featured-img { margin-bottom: 10px; } /* -- UX Icons -- */ .featured-img { position: relative; display: inline-block; -webkit-transition: all 200ms ease-out; transition: all 200ms ease-out; text-align: center; } .featured-img svg { -webkit-transition: all 200ms ease-out; transition: all 200ms ease-out; } .featured-img-circle { border-radius: 999px; border: 1px solid #000000; } .ux-section.dark svg { fill: #ffffff; } /* -- message box -- */ .message-box { background-repeat: repeat-x; padding: 10px; text-align: center; text-transform: uppercase; font-weight: bold; font-size: 110%; } .message-box .inner { padding: 15px; } .message-box .inner .button { margin: 0 15px; } .message-box p { padding: 0; margin: 0; } /* -- add to cart shortcode --*/ p.product.woocommerce { border: 0 !important; } p.product.woocommerce span.amount { display: block; font-size: 200%; font-weight: bold; margin-bottom: 5px; } p.product.woocommerce .added_to_cart { display: block; } /* -- price table -- */ .ux_price_table { background: #ffffff; border: 1px solid #eeeeee; -webkit-transition: all 200ms ease-out; transition: all 200ms ease-out; } .ux_price_table:hover { box-shadow: 0 0 19px 0 rgba(50, 50, 50, 0.33); } .ux_price_table li { list-style: none; border-top: 1px solid rgba(0, 0, 0, 0.05); margin: 0 30px; } .ux_price_table ul { margin: 0; } .ux_price_table .bullet-item { padding: 10px 0; } .ux_price_table .price { font-weight: 400; font-size: 230%; padding: 30px 0; border: 0; } .ux_price_table .description { font-size: 80%; opacity: .8; text-transform: uppercase; padding: 0 0 15px; border: 0; } .ux_price_table .title { margin: 0; border: 0; text-transform: uppercase; font-weight: bold; padding: 5px 0; background-color: rgba(0, 0, 0, 0.01); border-bottom: 1px solid rgba(0, 0, 0, 0.05); } .ux_price_table .cta-button { background-color: rgba(0, 0, 0, 0.01); padding: 20px 0 30px; margin: 15px 0 0 0; } .featured-table.ux_price_table { border: 2px solid #627f9a; margin-top: -15px; z-index: 3; } .featured-table.ux_price_table .title { background-color: #627f9a; color: #ffffff; } .featured-table.ux_price_table .price { font-size: 300%; } .bullet-more-info { display: inline-block; background: #dddddd; font-weight: bolder; font-size: 11px; width: 15px; height: 15px; padding: 0; line-height: 15px; color: #ffffff; margin-left: 5px; } .scroll-to { height: 0; display: block; position: relative; visibility: hidden; } .scroll-to-bullets { position: fixed; right: 45px; top: 40%; z-index: 99; text-align: right; } .scroll-to-bullets a, .scroll-to-bullets a strong { display: block; border-radius: 99px; -webkit-transition: all 200ms ease-out; transition: all 200ms ease-out; } .scroll-to-bullets a { padding: 3px; margin-bottom: 3px; } .scroll-to-bullets a strong { display: block; background-color: #627f9a; height: 10px; width: 10px; padding: 2px; box-shadow: 1px 1px 0 0 rgba(0, 0, 0, 0.1); } .scroll-to-bullets a.active, .scroll-to-bullets a:hover { background-color: #627f9a; } .scroll-to-bullets a.active strong, .scroll-to-bullets a:hover strong { background-color: #ffffff; } /* -- ux_logo --*/ .ux_logo { display: inline-block; } .ux_logo a { display: block; opacity: .6; } .ux_logo a:hover { opacity: 1; } .ux_logo img { display: block; } /* Instagram Feed */ .null-instagram-feed .widget-title:before { font-family: "icomoon" !important; content: "\e00e" !important; margin-right: 5px; font-size: 16px; font-weight: normal; opacity: 0.6; } ul.instagram-pics { margin: 0; } ul.instagram-pics li { list-style: none; display: inline-block; width: 20%; background-color: #FFF; margin: 0; padding: 0; } ul.instagram-pics a { -webkit-transition: opacity .3s; transition: opacity .3s; -webkit-backface-visibility: hidden; backface-visibility: hidden; display: block; margin: 0 !important; padding: 0 !important; } ul.instagram-pics a:hover { opacity: 0.8; } @media only screen and (max-width: 48em) { ul.instagram-pics li { width: 50%; } } .widget-area ul.instagram-pics li { width: 33.3333%; } /**********************************************************************/ /***************------------- 12. WIDGETS -------------****************/ /**********************************************************************/ /* -- widget layout -- */ .page #secondary { padding-top: 5px; } .widget { margin-bottom: 30px; } .widget .tx-div { margin-bottom: 20px; } .widget-title { text-transform: uppercase; font-size: 95%; } .widget h3.widget-title.shop-sidebar { border-bottom: 3px solid #EEE; padding: 0 0 5px; margin-bottom: 15px; } /* -- widget list reset -- */ .widget ul li { line-height: 120%; list-style: none; } .widget ul li:last-child { border: 0; } .widget ul li:first-child { padding-top: 0; } .widget ul { margin: 0; padding: 0; } .widget li a { padding-bottom: 5px; display: block; } /* -- woocommerce widget_product_categories /layered nav / layered nav filters -- */ .widget_product_categories li a, .widget_layered_nav li a, .widget_layered_nav li span:not(.count), .widget_layered_nav_filters li a { font-size: 90%; padding: 8px 0; color: #777777; display: inline-block; text-transform: uppercase; } .widget_product_categories li a:hover, .widget_layered_nav li a:hover, .widget_layered_nav_filters li a:hover { color: #000000; text-decoration: underline; } .widget_layered_nav_filters .chosen a, .dark .widget_layered_nav_filters .chosen a { font-size: 80%; color: #999999; border: 1px solid #cccccc; background: #f1f1f1; display: inline-block; padding: 2px 6px 2px; border-radius: 32px; } .widget_layered_nav_filters .chosen a:hover { background: #000000; border-color: #000000; text-decoration: none; color: #ffffff; } .widget_layered_nav_filters .chosen a:before { content: 'x'; margin-right: 5px; font-size: 80%; color: #999999; } .widget_product_categories li { position: relative; } .widget_product_categories li .count, .widget_layered_nav li .count { color: #cccccc; font-size: 80%; float: right; padding-top: 9px; } .widget_product_categories > ul > li, .widget_layered_nav > ul > li { border-bottom: 1px solid #eeeeee; } .widget_layered_nav .chosen a { font-weight: bold; } .widget_product_categories li { position: relative; } .widget_product_categories li a { padding-right: 15px; } .widget_product_categories li .count { position: absolute; top: 0; right: 0; } .widget_product_categories li ul.children { display: none; padding: 5px 0 10px 15px; } .widget_product_categories li ul.children li { border-top: 1px solid #f1f1f1; } .widget_product_categories li.current-cat-parent ul.children { display: block; } .widget_product_categories li.current-cat ul.children { display: block; } .widget_product_categories li.current-cat > a { color: #000000; font-weight: bold; } .widget_layered_nav_filters li { float: left; margin: 0 5px 5px 0; } .widget_layered_nav_filters { overflow: hidden; } /* -- product listing widget -- */ .product_list_widget .wp-post-image { position: absolute; left: 0; width: 60px !important; } .product_list_widget li { white-space: normal; border-bottom: 1px solid #EEE; padding: 10px 30px 10px 75px; position: relative; overflow: hidden; width: 100%; } .product_list_widget li a { display: block; font-size: 95%; } .product_list_widget span.amount { display: inline-block; font-weight: bold; color: #000000; margin-top: 3px; } .product_list_widget del span.amount { color: #777777; font-weight: normal; text-decoration: line-through; } .product_list_widget .variation { font-size: 80%; margin: 0; } .product_list_widget .variation dt, .product_list_widget .variation dd { display: inline-block; } .product_list_widget .variation dd { margin: 0 0 0 5px; } .product_list_widget .star-rating { font-size: 80%; margin-top: 5px; } .product_list_widget .reviewer { font-size: 70%; text-transform: uppercase; } /* -- shopping cart widget -- */ .widget_shopping_cart_content p.total { color: #000000; text-align: center; padding: 10px 0; margin: 0; border-top: 2px solid #EEE; } .widget_shopping_cart_content .buttons { text-align: center; } /* -- recent comments widget -- */ .widget_recent_comments li { margin-bottom: 10px; padding-bottom: 5px; border-bottom: 1px solid #eeeeee; } /* -- blog post widget -- */ .flatsome_recent_posts li { border-bottom: 1px solid #EEE; position: relative; padding: 0 0 10px 45px; margin-bottom: 10px; } .flatsome_recent_posts li a { padding-bottom: 0; } .flatsome_recent_posts .post-date { position: absolute; left: 0; top: 5px; width: 30px; } .flatsome_recent_posts .post_comments { font-size: 80%; display: block; margin-top: 5px; } /* -- text widget -- */ .textwidget { line-height: 160%; font-size: 100%; } /* -- Cart widgets */ .widget_shopping_cart dd p { padding: 0; margin: 0; } /* -- calender widget -- */ .widget_calendar caption { text-transform: uppercase; font-weight: bold; padding: 15px 0; border-top: 2px solid #DDD; } /* -- rss widget -- */ .widget_rss ul li { margin-bottom: 15px; } .widget_rss ul li a.rsswidget { display: block; } .widget_rss .rss-date { text-transform: uppercase; font-size: 80%; } /* -- Nav menu -- */ .widget_nav_menu .menu { height: 100%; padding-bottom: 30px; } .widget_nav_menu ul li { font-size: 90%; text-transform: uppercase; font-weight: bold; } .widget_nav_menu ul li a { display: block; padding: 10px 0; color: #999999; border-bottom: 1px solid #eeeeee; } .widget_nav_menu ul li a:hover { color: #111111; } .widget_nav_menu ul li.current-menu-item a { color: #000000; border-right: 3px solid #dddddd; } .widget_nav_menu ul li ul { margin-left: 10px; display: none; } /* -- product tag cloud widget -- */ .widget_product_tag_cloud, .widget_tag_cloud { overflow: hidden; } .widget_product_tag_cloud a, .widget_tag_cloud a { color: #627f9a; display: inline-block; font-size: 12px !important; float: left; border: 1px solid #627f9a; padding: 4px 8px; margin: 0 5px 5px 0; } .widget_product_tag_cloud a:hover, .widget_tag_cloud a:hover { background: #627f9a; color: #ffffff; } .dark .widget_product_tag_cloud a, .dark .widget_tag_cloud a { color: #ffffff; border-color: #ffffff; opacity: .6; } .dark .widget_product_tag_cloud a:hover, .dark .widget_tag_cloud a:hover { background: #ffffff; color: #333333; opacity: 1; } /* -- ninjaforms fix -- */ .ninja-forms-field-error, .ninja-forms-required-items, .footer .widget_ninja_forms_widget .ninja-forms-req-symbol, .footer .widget_ninja_forms_widget #ninja_forms_required_items { display: none !important; } .footer .widget_ninja_forms_widget .ninja-forms-form-wrap .ninja-forms-form .field-wrap.label-left .ninja-forms-field { margin: 0 !important; } .ninja-forms-form-wrap .ninja-forms-form .field-wrap.label-left .ninja-forms-field, .ninja-forms-form-wrap .ninja-forms-form .field-wrap.label-left .ninja-forms-star-rating-control { margin-left: 0 !important; } /* -- Price filter widget */ .widget_price_filter .price_slider { margin-bottom: 1em; background: #eeeeee; } .widget_price_filter .price_label { padding-top: 6px; } .widget_price_filter .price_slider_amount { text-align: right; line-height: 1; font-size: .8751em; } .widget_price_filter .price_slider_amount .button { float: left; font-size: 90%; } .widget_price_filter .ui-slider { position: relative; text-align: left; } .widget_price_filter .ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: .9em; height: .9em; cursor: pointer; outline: none; top: -.2em; border-radius: 99px; background-color: #777777; } .widget_price_filter .ui-slider .ui-slider-handle:last-child { margin-left: -13px; } .widget_price_filter .ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; background: #999999; } .widget_price_filter .ui-slider-horizontal { height: .5em; } .widget_price_filter .ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; } .widget_price_filter .ui-slider-horizontal .ui-slider-range-min { left: -1px; } .widget_price_filter .ui-slider-horizontal .ui-slider-range-max { right: -1px; } /**********************************************************************/ /************------------- 13. DARK BG TYPE -------------**************/ /**********************************************************************/ /* -- general -- */ .dark { color: #dddddd; } .dark a { color: #ffffff; } .dark a:hover { color: #dddddd; } .dark h1, .dark h2, .dark h3, .dark h4, .dark h5 { color: #ffffff; } .dark p { color: #dddddd; } .dark .price { color: #ffffff; } .dark .price del, .dark .price .from { color: #eeeeee; } .dark .tx-div { background-color: #ffffff; opacity: .3; } .dark li.account-dropdown { border-color: rgba(255, 255, 255, 0.1) !important; } /* -- header -- */ .dark-header #masthead #logo a, .dark .testimonial_text .test_company, .dark-header #masthead .wide-nav-search, .dark-header .wide-nav-right { color: #ffffff !important; } .dark-header #masthead .html-block a, .dark-header #masthead .wide-nav-search a { color: #ffffff; opacity: .8; } .dark-header #masthead .html-block a:hover, .dark-header #masthead .wide-nav-search a:hover { opacity: 1; } /* -- slider -- */ .dark > .sliderNav a span { border-color: #000000; color: #000000; } .dark > .sliderBullets .bullet, .flipContainer .pager span.dot { border-color: #000000; } .dark > .sliderBullets .bullet.active, .dark > .sliderBullets .bullet:hover, .flipContainer .pager span.dot.current { background: #000000; } /* -- navigation link colors -- */ .dark-header #masthead ul.header-nav a.nav-top-link, .dark-header.wide-nav ul.header-nav a.nav-top-link, .dark-header.wide-nav ul.header-nav a.nav-top-link, .dark-header.wide-nav .wide-nav-right a { color: #ffffff; opacity: .8; } .dark-header #masthead ul.header-nav li.active a.nav-top-link, .dark-header.wide-nav ul.header-nav li.active a.nav-top-link, .dark-header.wide-nav .wide-nav-right a:hover { color: #ffffff; opacity: 1; } .dark-header #masthead .mobile-menu a { font-size: 32px; color: #ffffff; } .dark-header #masthead strong.cart-name, .dark-header span.cart-price { color: #ffffff; opacity: .8; } .dark-header #masthead .active strong.cart-name, .dark-header .active span.cart-price { color: #ffffff; opacity: 1; } /* -- dropdown hover links -- */ .dark-header #masthead .header-nav li.mini-cart .cart-icon strong { border-color: #ffffff; color: #ffffff; background-color: transparent; } .dark-header #masthead .header-nav li.mini-cart.active .cart-icon strong { border-color: #ffffff; color: #000000; background-color: #ffffff !important; } .dark-header #masthead .header-nav li.mini-cart .cart-icon .cart-icon-handle { border-color: #ffffff; } .dark-header #masthead .header-nav li.account-dropdown, .dark-header #masthead .header-nav li.html-block { border-color: rgba(255, 255, 255, 0.3); } .dark-header .ux_banner-grid { margin-top: 40px; } .dark-header .top-divider { display: none; } /* -- forms --*/ .dark form label { color: #eeeeee; } /* -- social icons -- */ .dark .social-icons .icon, .dark-header #masthead .social-icons .icon { border-color: #ffffff; color: #ffffff; } /* -- widgets -- */ .dark .widget .post-date { border-color: #cccccc; color: #cccccc; } .dark .widget .post-item:hover .post-date { background: #ffffff; color: #627f9a; border-color: #ffffff; } .dark .product_list_widget span.amount { color: #ffffff; } .dark .flatsome_recent_posts li, .dark .product_list_widget li { border-color: #cccccc; border-color: rgba(255, 255, 255, 0.2); } .dark .widget_nav_menu ul li a { color: #ffffff; } .dark .widget_nav_menu ul li a:hover { color: #cccccc; } .dark .widget_nav_menu ul li a { border-color: rgba(255, 255, 255, 0.2); } /* -- footer -- */ .dark.absolute-footer ul li a:hover { color: #ffffff; } /* -- div --*/ .dark #add_review .inner { background: #000000; background: rgba(0, 0, 0, 0.3); border: 0; } .dark .shop_table thead { color: #eeeeee; } .dark .top-divider { display: none; } .dark .checkout-breadcrumb h1 { color: #cccccc; } .woocommerce-cart .dark .title-cart, .woocommerce-checkout .dark .title-checkout, .dark .tabbed-content ul.tabs li.active a, .dark .shop_table .total, .dark .comment-list cite.fn, .wide-nav.dark-header { color: #ffffff; } .dark .woocommerce .order-review, .dark .woocommerce-checkout form.login { background-color: #000000; background-color: rgba(0, 0, 0, 0.3); } #top-bar .social-icons a, .dark .social-icons a, .dark .checkout-group h3, .dark .order-review h3 { color: #ffffff !important; } .dark .widget_product_categories li a, .dark .widget_layered_nav li a, .dark .widget_layered_nav_filters li a { color: #eeeeee; } .dark .ux_price_table, .dark .ux_price_table .title { background: #000000; background: rgba(0, 0, 0, 0.9); border-color: black; } .dark .tabbed-content ul.tabs li.active a, .dark .tabbed-content ul.tabs li.current_page_item a { border-color: #ffffff; } .site-main.dark .ux-box.ux-text-badge .ux-box-text { background-color: #000000; } /* borders */ .dark-header .ux-header-element a, #top-bar .social-icons a, .dark .social-icons a.icon, .dark-header #masthead .social-icons a.icon, .dark .row.divided .columns > .column-inner, .dark .row.divided .columns, .dark h3.section-title.title_center span:before, .dark h3.section-title.title_center span:after, .dark .ux_price_table .bullet-item, .dark .ux_price_table .description, .dark .author-box, .dark .tabbed-content ul.tabs li a, .dark .product-details, .dark .comment-list .children .comment-inner, .dark .comment-list > li.comment > .comment-inner, .dark .navigation-post .nav-next, .dark .navigation-post, .dark footer.entry-meta, .dark .blog-pinterest-style .entry-content, .dark .pagination-centered, .dark .product-sidebar-right .inner, .dark .widget h3.widget-title.shop-sidebar, .dark .widget_product_categories > ul > li, .dark .widget_layered_nav > ul > li, .dark hr, .dark .product_meta > span, .dark .review-item, .dark h3.section-title, .dark .shop_table thead, .dark .cart_table_item, .dark .cart-wrapper, .dark .cart-sidebar .widget-title, .dark .cart_totals .total, .dark .shop_table .total, .dark table tr, .product-info .social-icons { border-color: #666666; border-color: rgba(255, 255, 255, 0.2); } /**********************************************************************/ /***************------------- 14. FIXES -------------******************/ /**********************************************************************/ @-moz-document url-prefix() { .select-wrapper:after { display: none; } .product-lightbox .quantity { display: none; } .quantity input[type=number] { -moz-appearance: textfield; } } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .select-wrapper:after { display: none; } } /**********************************************************************/ /***************------------- 15. MOBILE -------------*****************/ /**********************************************************************/ @media only screen and (max-width: 48em) { /* -- layout -- */ body { background: none !important; } #main-content { margin-top: 0 !important; } .row.container > .columns { margin-bottom: 15px; } .page-inner, body.framed-layout { padding: 0 !important; border: 0 !important; } #content .ux-section { padding-left: 0 !important; padding-right: 0 !important; } .ux_parallax, .parallax_img_inner { opacity: 1 !important; } /* -- Global -- */ #top-bar .left-text { width: 100%; text-align: center; } #masthead .mobile-menu { display: table-cell !important; vertical-align: middle; padding-top: 16px; } #masthead .mobile-menu a { font-size: 32px; color: #627f9a; display: block; padding: 5px 5px 5px 0; } #masthead .right-links, #masthead .left-links { min-width: 32px; max-width: 32px; } #masthead.stuck .mobile-menu { padding: 0; } #masthead #logo { width: 100% !important; text-align: center; padding: 0 20px; } #masthead #logo a { float: none; margin: 0 auto; } #masthead #logo a img { margin: 0 auto; max-width: 100% !important; } html[data-useragent*='IEMobile'] #masthead #logo a img { max-width: 180px !important; } .mob-center { text-align: center !important; } .logo-center #logo { position: relative; } #masthead .left-links, .wide-nav, #top-bar .right-text, #top-link, #masthead .right-links .menu-item, #masthead .right-links .search-dropdown, .html-block-inner .search-wrapper { display: none !important; } .ux-box.ux-text-overlay .ux-box-text { opacity: 1; bottom: 10%; } .ux-box.ux-text-overlay .ux-box-image img { top: 0 !important; -webkit-transform: scale(1.05); opacity: .3; } .ux-box.ux-text-overlay .show-next { opacity: 1; bottom: 0; } li.mini-cart { padding: 0; } .cart-icon, .cart-icon strong { margin: 0; } .cart-icon .cart-icon-handle { margin-right: -8px; } ul.header-nav li { margin: 0; } .catalog-mode-header { display: none; } /* ux section */ .ux-section-img { width: 100% !important; position: relative; width: 100%; background-size: cover; margin-bottom: 30px; } .ux-section-img img { display: block; width: 100%; visibility: hidden; } .ux-section.has-img { padding-bottom: 30px !important; padding-top: 30px !important; } .ux-section.has-img-top, .ux-section.has-img-left, .ux-section.has-img-right { padding-top: 0 !important; } .ux-section.has-img-bottom { padding-bottom: 0 !important; } .ux-section-img.bottom { margin-bottom: 0; } /* div header */ .woocommerce-message a.button { position: relative; float: right; left: 0; right: 0; } .boxed-header .header-wrapper { margin-top: 0; } /* -- footer -- */ .absolute-footer .left, .absolute-footer .right { float: none !important; width: 100%; } .absolute-footer ul { overflow: hidden; width: 100%; } .absolute-footer li { width: 100%; } .absolute-footer li a { padding: 15px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.1); font-size: 110%; } .absolute-footer .right { padding-top: 15px; } /* -- messages -- */ .woocommerce-message { padding-right: 0; } /* -- product page -- */ .icons-row { margin-top: 0; } .icons-row a { width: 95%; display: block; border: 0 !important; margin: 0; } .product-gallery { margin-bottom: 0; width: 100%; } /* -- accordion /tabs -- */ .tabbed-content.tabs .accordion-title { display: block; width: 100%; } .product-page-tabs .tabbed-content { border: 0; margin: 0 -15px; } .vertical-tabs .tabs-inner { padding-left: 0; border: 0; } .vertical-tabs ul.tabs-nav { margin-top: 0; } /* -- sliders --*/ .column-slider .small-block-grid-2 > li { width: 47%; } .column-slider .product-small .inner-wrap > a { padding: 0 10px; } /* -- dropdown -- */ ul.header-nav li .nav-dropdown { position: relative; } ul.header-nav li.account-dropdown, ul.header-nav li.html-block { display: none !important; } /* -- mini cart fix -- */ .mini-cart .nav-dropdown, .mini-cart .dropdown-toggle { display: none !important; } .mini-cart .cart-price { margin-right: 15px; } /* -- blog/pages -- */ .page-right-sidebar .blog-entry { padding-right: 0; border-right: 0; } .title-header { text-align: center; } .title-header .widget { border-top: 1px solid rgba(255, 255, 255, 0.2); } .title-header .tx-div { margin: 0 auto; } /* -- shopping cart -- */ .cart-sidebar .widget-title { display: none; } .cart_totals { margin-top: 10px; } /* -- category page -- */ .woocommerce-result-count { display: none !important; } #product-image-zoomer { display: none; } .breadcrumb-row { font-size: 80%; } .breadcrumb-row .right { width: 100%; text-align: center; } .breadcrumb-row .left { width: 100%; text-align: center; margin-bottom: 15px; } .product-small .front-image img { width: 100% !important; } .quick-view, .back-image { display: none !important; } .yith-wcwl-add-to-wishlist a { opacity: .3; } .product-image:hover .add-to-cart-grid, .product-image .add-to-cart-grid { bottom: 10px; } a.filter-button { font-size: 20px; display: block; } .category-filtering .widget_layered_nav_filters { margin-bottom: 15px; } /* -- checkout --*/ .checkout-breadcrumb h1 { margin-bottom: 10px; padding-bottom: 10px; } .checkout-breadcrumb span, .checkout-breadcrumb span.divider { display: none; } .woocommerce-checkout span.title-checkout { display: inline-block; } .woocommerce-cart span.title-cart { display: inline-block; } /* Mobile Cart */ .cart-wrapper th.product-subtotal, .cart-wrapper td.product-subtotal, .cart-wrapper th.product-price, .cart-wrapper td.product-price { display: none; } .cart-wrapper th.product-quantity, td.product-quantity { text-align: right; } .shop_table.cart td.product-name { width: 50%; padding: 10px; } .cart-wrapper td { vertical-align: top; } .cart-wrapper .quantity.buttons_added .minus, .cart-wrapper .quantity.buttons_added .plus { padding-left: 7px; padding-right: 7px; } .cart-wrapper .quantity .input-text.qty { width: 30px; } .mobile-price { padding: 10px 0; } .cart-wrapper .mobile-cart td.product-name, .cart-wrapper .mobile-cart td.product-thumbnail { width: auto; } .woocommerce-cart .cross-sells { display: none !important; } #yith-wcwl-form { overflow: auto; -webkit-overflow-scrolling: touch; } .cart-wrapper { margin-left: -15px; margin-right: -15px; padding-left: 15px; padding-right: 15px; padding-top: 10px; } .cart-wrapper, .shop_table.wishlist_table { overflow-x: scroll; -webkit-overflow-scrolling: touch; border-top: 1px solid #dddddd; border-bottom: 1px solid #dddddd; overflow-y: hidden; box-shadow: inset -10px 0 40px 0 rgba(0, 0, 0, 0.05); } .shop_table.wishlist_table { min-width: 600px; } /* -- slider columns fix --*/ .slider.columns-2 > *, .slider.columns-3 > *, .slider.columns-4 > * { max-width: 100% !important; } } /* medium view fix **/ @media only screen and (max-width: 768px) and (min-width: 460px) { .column-slider .small-block-grid-2 > li { width: 33.333%; } .lookbook-slider .small-block-grid-1 > li { width: 50%; } } /* ipad potrait fixes */ @media all and (device-width: 768px) and (device-height: 1024px) and (orientation: portrait) { .column-slider .small-block-grid-2 > li { width: 40%; } .column-slider .sliderControlls { display: none; } #top-bar .left-text { float: left; text-align: left; font-size: 60%; width: auto; } .mini-cart .cart-inner { position: relative; } .mini-cart.active .nav-dropdown { display: block !important; position: absolute; top: 20px; right: 0; } .woocommerce-cart .woocommerce .row .large-8, .woocommerce-cart .woocommerce .row .large-4 { width: 100%; } .columns.product-gallery, .product-info.columns, .product-page-aside.columns { width: 100%; } .quick-view { bottom: 0; opacity: 1; display: block !important; background: rgba(0, 0, 0, 0.1); } } /* ipad Grid fixes */ html[data-useragent*='iPad'] .yith-wcwl-add-to-wishlist a { opacity: .3; } html[data-useragent*='iPad'] .parallax_img_inner, html[data-useragent*='iPhone'] .parallax_img_inner { opacity: 1 !important; } html[data-useragent*='iPhone'] .yith-wcwl-add-to-wishlist a { opacity: .3; } html[data-useragent*='iPad'] .quick-view { bottom: 0; opacity: 1; background: rgba(0, 0, 0, 0.1); } html[data-useragent*='iPad'] .back-image, html[data-useragent*='iPhone'] .back-image { display: none !important; } /**********************************************************************/ /******------------- 16. FOUNDATION COMPONENTS (Grid, buttons, etc) -------------********/ /**********************************************************************/ /* Grid HTML Classes */ .row { width: 100%; margin-left: auto; margin-right: auto; margin-top: 0; margin-bottom: 0; max-width: 67.5em; *zoom: 1; } .row:before, .row:after { content: " "; display: table; } .row:after { clear: both; } .row.collapse .column, .row.collapse .columns { position: relative; padding-left: 0; padding-right: 0; float: left; } .row .row { width: auto; margin-left: -0.9375em; margin-right: -0.9375em; margin-top: 0; margin-bottom: 0; max-width: none; *zoom: 1; } .row .row:before, .row .row:after { content: " "; display: table; } .row .row:after { clear: both; } .row .row.collapse { width: auto; margin: 0; max-width: none; *zoom: 1; } .row .row.collapse:before, .row .row.collapse:after { content: " "; display: table; } .row .row.collapse:after { clear: both; } .column, .columns { position: relative; padding-left: 0.9375em; padding-right: 0.9375em; width: 100%; float: left; } @media only screen { .column, .columns { position: relative; padding-left: 0.9375em; padding-right: 0.9375em; float: left; } .small-1 { position: relative; width: 8.33333%; } .small-2 { position: relative; width: 16.66667%; } .small-3 { position: relative; width: 25%; } .small-4 { position: relative; width: 33.33333%; } .small-5 { position: relative; width: 41.66667%; } .small-6 { position: relative; width: 50%; } .small-7 { position: relative; width: 58.33333%; } .small-8 { position: relative; width: 66.66667%; } .small-9 { position: relative; width: 75%; } .small-10 { position: relative; width: 83.33333%; } .small-11 { position: relative; width: 91.66667%; } .small-12 { position: relative; width: 100%; } [class*="column"] + [class*="column"]:last-child { float: right; } [class*="column"] + [class*="column"].end { float: left; } } /* Styles for screens that are atleast 768px; */ @media only screen and (min-width: 48em) { .large-1 { position: relative; width: 8.33333%; } .large-2 { position: relative; width: 16.66667%; } .large-3 { position: relative; width: 25%; } .large-4 { position: relative; width: 33.33333%; } .large-5 { position: relative; width: 41.66667%; } .large-6 { position: relative; width: 50%; } .large-7 { position: relative; width: 58.33333%; } .large-8 { position: relative; width: 66.66667%; } .large-9 { position: relative; width: 75%; } .large-10 { position: relative; width: 83.33333%; } .large-11 { position: relative; width: 91.66667%; } .large-12 { position: relative; width: 100%; } } /* Foundation Block Grids for below small breakpoint */ @media only screen { [class*="block-grid-"] { display: block; padding: 0; margin: 0 -0.625em !important; *zoom: 1; } [class*="block-grid-"]:before, [class*="block-grid-"]:after { content: " "; display: table; } [class*="block-grid-"]:after { clear: both; } [class*="block-grid-"] > li, [class*="block-grid-"] > div > div > li { display: inline; height: auto; float: left; padding: 0 0.625em 1.25em; } .small-block-grid-1 > li, .small-block-grid-1 > div > div > li { width: 100%; padding: 0 0.625em 1.25em; } .small-block-grid-1 > li:nth-of-type(n), .small-block-grid-1 > div > div > li:nth-of-type(n) { clear: none; } .small-block-grid-1 > li:nth-of-type(1n+1), .small-block-grid-1 > div > div > li:nth-of-type(1n+1) { clear: both; } .small-block-grid-2 > li, .small-block-grid-2 > div > div > li { width: 50%; padding: 0 0.625em 1.25em; } .small-block-grid-2 > li:nth-of-type(n), .small-block-grid-2 > div > div > li:nth-of-type(n) { clear: none; } .small-block-grid-2 > li:nth-of-type(2n+1), .small-block-grid-2 > div > div > li:nth-of-type(2n+1) { clear: both; } .small-block-grid-3 > li, .small-block-grid-3 > div > div > li { width: 33.33333%; padding: 0 0.625em 1.25em; } .small-block-grid-3 > li:nth-of-type(n), .small-block-grid-3 > div > div > li:nth-of-type(n) { clear: none; } .small-block-grid-3 > li:nth-of-type(3n+1), .small-block-grid-3 > div > div > li:nth-of-type(3n+1) { clear: both; } .small-block-grid-4 > li, .small-block-grid-4 > div > div > li { width: 25%; padding: 0 0.625em 1.25em; } .small-block-grid-4 > li:nth-of-type(n), .small-block-grid-4 > div > div > li:nth-of-type(n) { clear: none; } .small-block-grid-4 > li:nth-of-type(4n+1), .small-block-grid-4 > div > div > li:nth-of-type(4n+1) { clear: both; } .small-block-grid-5 > li, .small-block-grid-5 > div > div > li { width: 20%; padding: 0 0.625em 1.25em; } .small-block-grid-5 > li:nth-of-type(n), .small-block-grid-5 > div > div > li:nth-of-type(n) { clear: none; } .small-block-grid-5 > li:nth-of-type(5n+1), .small-block-grid-5 > div > div > li:nth-of-type(5n+1) { clear: both; } .small-block-grid-6 > li, .small-block-grid-6 > div > div > li { width: 16.66667%; padding: 0 0.625em 1.25em; } .small-block-grid-6 > li:nth-of-type(n), .small-block-grid-6 > div > div > li:nth-of-type(n) { clear: none; } .small-block-grid-6 > li:nth-of-type(6n+1), .small-block-grid-6 > div > div > li:nth-of-type(6n+1) { clear: both; } .small-block-grid-7 > li, .small-block-grid-7 > div > div > li { width: 14.28571%; padding: 0 0.625em 1.25em; } .small-block-grid-7 > li:nth-of-type(n), .small-block-grid-7 > div > div > li:nth-of-type(n) { clear: none; } .small-block-grid-7 > li:nth-of-type(7n+1), .small-block-grid-7 > div > div > li:nth-of-type(7n+1) { clear: both; } .small-block-grid-8 > li, .small-block-grid-8 > div > div > li { width: 12.5%; padding: 0 0.625em 1.25em; } .small-block-grid-8 > li:nth-of-type(n), .small-block-grid-8 > div > div > li:nth-of-type(n) { clear: none; } .small-block-grid-8 > li:nth-of-type(8n+1), .small-block-grid-8 > div > div > li:nth-of-type(8n+1) { clear: both; } .small-block-grid-9 > li, .small-block-grid-9 > div > div > li { width: 11.11111%; padding: 0 0.625em 1.25em; } .small-block-grid-9 > li:nth-of-type(n), .small-block-grid-9 > div > div > li:nth-of-type(n) { clear: none; } .small-block-grid-9 > li:nth-of-type(9n+1), .small-block-grid-9 > div > div > li:nth-of-type(9n+1) { clear: both; } .small-block-grid-10 > li, .small-block-grid-10 > div > div > li { width: 10%; padding: 0 0.625em 1.25em; } .small-block-grid-10 > li:nth-of-type(n), .small-block-grid-10 > div > div > li:nth-of-type(n) { clear: none; } .small-block-grid-10 > li:nth-of-type(10n+1), .small-block-grid-10 > div > div > li:nth-of-type(10n+1) { clear: both; } .small-block-grid-11 > li, .small-block-grid-11 > div > div > li { width: 9.09091%; padding: 0 0.625em 1.25em; } .small-block-grid-11 > li:nth-of-type(n), .small-block-grid-11 > div > div > li:nth-of-type(n) { clear: none; } .small-block-grid-11 > li:nth-of-type(11n+1), .small-block-grid-11 > div > div > li:nth-of-type(11n+1) { clear: both; } .small-block-grid-12 > li, .small-block-grid-12 > div > div > li { width: 8.33333%; padding: 0 0.625em 1.25em; } .small-block-grid-12 > li:nth-of-type(n), .small-block-grid-12 > div > div > li:nth-of-type(n) { clear: none; } .small-block-grid-12 > li:nth-of-type(12n+1), .small-block-grid-12 > div > div > li:nth-of-type(12n+1) { clear: both; } } /* Foundation Block Grids for above small breakpoint */ @media only screen and (min-width: 48em) { /* Remove small grid clearing */ .small-block-grid-1 > li:nth-of-type(1n+1) { clear: none; } .small-block-grid-1 > div > div > li:nth-of-type(1n+1) { clear: none; } .small-block-grid-2 > li:nth-of-type(2n+1) { clear: none; } .small-block-grid-2 > div > div > li:nth-of-type(2n+1) { clear: none; } .small-block-grid-3 > li:nth-of-type(3n+1) { clear: none; } .small-block-grid-3 > div > div > li:nth-of-type(3n+1) { clear: none; } .small-block-grid-4 > li:nth-of-type(4n+1) { clear: none; } .small-block-grid-4 > div > div > li:nth-of-type(4n+1) { clear: none; } .small-block-grid-5 > li:nth-of-type(5n+1) { clear: none; } .small-block-grid-5 > div > div > li:nth-of-type(5n+1) { clear: none; } .small-block-grid-6 > li:nth-of-type(6n+1) { clear: none; } .small-block-grid-6 > div > div > li:nth-of-type(6n+1) { clear: none; } .small-block-grid-7 > li:nth-of-type(7n+1) { clear: none; } .small-block-grid-7 > div > div > li:nth-of-type(7n+1) { clear: none; } .small-block-grid-8 > li:nth-of-type(8n+1) { clear: none; } .small-block-grid-8 > div > div > li:nth-of-type(8n+1) { clear: none; } .small-block-grid-9 > li:nth-of-type(9n+1) { clear: none; } .small-block-grid-9 > div > div > li:nth-of-type(9n+1) { clear: none; } .small-block-grid-10 > li:nth-of-type(10n+1) { clear: none; } .small-block-grid-10 > div > div > li:nth-of-type(10n+1) { clear: none; } .small-block-grid-11 > li:nth-of-type(11n+1) { clear: none; } .small-block-grid-11 > div > div > li:nth-of-type(11n+1) { clear: none; } .small-block-grid-12 > li:nth-of-type(12n+1) { clear: none; } .small-block-grid-12 > div > div > li:nth-of-type(12n+1) { clear: none; } .large-block-grid-1 > li, .large-block-grid-1 > div > div > li { width: 100%; padding: 0 0.625em 1.25em; } .large-block-grid-1 > li:nth-of-type(n), .large-block-grid-1 > div > div > li:nth-of-type(n) { clear: none; } .large-block-grid-1 > li:nth-of-type(1n+1), .large-block-grid-1 > div > div > li:nth-of-type(1n+1) { clear: both; } .large-block-grid-2 > li, .large-block-grid-2 > div > div > li { width: 50%; padding: 0 0.625em 1.25em; } .large-block-grid-2 > li:nth-of-type(n), .large-block-grid-2 > div > div > li:nth-of-type(n) { clear: none; } .large-block-grid-2 > li:nth-of-type(2n+1), .large-block-grid-2 > div > div > li:nth-of-type(2n+1) { clear: both; } .large-block-grid-3 > li, .large-block-grid-3 > div > div > li { width: 33.33333%; padding: 0 0.625em 1.25em; } .large-block-grid-3 > li:nth-of-type(n), .large-block-grid-3 > div > div > li:nth-of-type(n) { clear: none; } .large-block-grid-3 > li:nth-of-type(3n+1), .large-block-grid-3 > div > div > li:nth-of-type(3n+1) { clear: both; } .large-block-grid-4 > li, .large-block-grid-4 > div > div > li { width: 25%; padding: 0 0.625em 1.25em; } .large-block-grid-4 > li:nth-of-type(n), .large-block-grid-4 > div > div > li:nth-of-type(n) { clear: none; } .large-block-grid-4 > li:nth-of-type(4n+1), .large-block-grid-4 > div > div > li:nth-of-type(4n+1) { clear: both; } .large-block-grid-5 > li, .large-block-grid-5 > div > div > li { width: 20%; padding: 0 0.625em 1.25em; } .large-block-grid-5 > li:nth-of-type(n), .large-block-grid-5 > div > div > li:nth-of-type(n) { clear: none; } .large-block-grid-5 > li:nth-of-type(5n+1), .large-block-grid-5 > div > div > li:nth-of-type(5n+1) { clear: both; } .large-block-grid-6 > li, .large-block-grid-6 > div > div > li { width: 16.66667%; padding: 0 0.625em 1.25em; } .large-block-grid-6 > li:nth-of-type(n), .large-block-grid-6 > div > div > li:nth-of-type(n) { clear: none; } .large-block-grid-6 > li:nth-of-type(6n+1), .large-block-grid-6 > div > div > li:nth-of-type(6n+1) { clear: both; } .large-block-grid-7 > li, .large-block-grid-7 > div > div > li { width: 14.28571%; padding: 0 0.625em 1.25em; } .large-block-grid-7 > li:nth-of-type(n), .large-block-grid-7 > div > div > li:nth-of-type(n) { clear: none; } .large-block-grid-7 > li:nth-of-type(7n+1), .large-block-grid-7 > div > div > li:nth-of-type(7n+1) { clear: both; } .large-block-grid-8 > li, .large-block-grid-8 > div > div > li { width: 12.5%; padding: 0 0.625em 1.25em; } .large-block-grid-8 > li:nth-of-type(n), .large-block-grid-8 > div > div > li:nth-of-type(n) { clear: none; } .large-block-grid-8 > li:nth-of-type(8n+1), .large-block-grid-8 > div > div > li:nth-of-type(8n+1) { clear: both; } .large-block-grid-9 > li, .large-block-grid-9 > div > div > li { width: 11.11111%; padding: 0 0.625em 1.25em; } .large-block-grid-9 > li:nth-of-type(n), .large-block-grid-9 > div > div > li:nth-of-type(n) { clear: none; } .large-block-grid-9 > li:nth-of-type(9n+1), .large-block-grid-9 > div > div > li:nth-of-type(9n+1) { clear: both; } .large-block-grid-10 > li, .large-block-grid-10 > div > div > li { width: 10%; padding: 0 0.625em 1.25em; } .large-block-grid-10 > li:nth-of-type(n), .large-block-grid-10 > div > div > li:nth-of-type(n) { clear: none; } .large-block-grid-10 > li:nth-of-type(10n+1), .large-block-grid-10 > div > div > li:nth-of-type(10n+1) { clear: both; } .large-block-grid-11 > li, .large-block-grid-11 > div > div > li { width: 9.09091%; padding: 0 0.625em 1.25em; } .large-block-grid-11 > li:nth-of-type(n), .large-block-grid-11 > div > div > li:nth-of-type(n) { clear: none; } .large-block-grid-11 > li:nth-of-type(11n+1), .large-block-grid-11 > div > div > li:nth-of-type(11n+1) { clear: both; } .large-block-grid-12 > li, .large-block-grid-12 > div > div > li { width: 8.33333%; padding: 0 0.625em 1.25em; } .large-block-grid-12 > li:nth-of-type(n), .large-block-grid-12 > div > div > li:nth-of-type(n) { clear: none; } .large-block-grid-12 > li:nth-of-type(12n+1), .large-block-grid-12 > div > div > li:nth-of-type(12n+1) { clear: both; } } p.lead { font-size: 1.21875em; line-height: 1.6; } /* Typography resets */ div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, th, td { margin: 0; padding: 0; direction: ltr; } /* Default Link Styles */ a { color: #627f9a; text-decoration: none; line-height: inherit; } a:hover, a:focus { color: #000; } a img { border: none; } /* Default paragraph styles */ p { font-family: inherit; font-weight: normal; font-size: 1em; line-height: 1.6; margin-bottom: 1.25em; text-rendering: optimizeLegibility; } /* Default header styles */ h1, h2, h3, h4, h5, h6 { font-family: "Helvetica", Helvetica, Arial, sans-serif; font-weight: bold; font-style: normal; color: #555; text-rendering: optimizeLegibility; margin-top: 0.2em; margin-bottom: 0.5em; line-height: 1.2125em; } h1 small, h2 small, h3 small, h4 small, h5 small, h6 small { font-size: 60%; color: #a2a2a2; line-height: 0; } h1 { font-size: 1em; } h2 { font-size: 0.875em; } h3 { font-size: 0.9375em; } h4 { font-size: 0.8125em; } h5 { font-size: 1em; } h6 { font-size: 1em; } hr { border: solid #eee; border-width: 1px 0 0; clear: both; margin: 1.875em 0 1.8125em; height: 0; } /* Helpful Typography Defaults */ em, i { font-style: italic; line-height: inherit; } strong, b { font-weight: bold; line-height: inherit; } small { font-size: 60%; line-height: inherit; } code { font-family: Consolas, "Liberation Mono", Courier, monospace; font-weight: bold; color: #660000; } /* Lists */ ul, ol, dl { font-size: 1em; line-height: 1.6; margin-bottom: 1.25em; list-style-position: outside; font-family: inherit; } ul, ol { margin-left: 0; } ul.no-bullet, ol.no-bullet { margin-left: 0; } /* Unordered Lists */ ul li ul, ul li ol { margin-left: 1.25em; margin-bottom: 0; font-size: 1em; /* Override nested font-size change */ } ul.square li ul, ul.circle li ul, ul.disc li ul { list-style: inherit; } ul.square { list-style-type: square; } ul.circle { list-style-type: circle; } ul.disc { list-style-type: disc; } ul.no-bullet { list-style: none; } /* Ordered Lists */ ol li ul, ol li ol { margin-left: 1.25em; margin-bottom: 0; } /* Definition Lists */ dl dt { margin-bottom: 0.3em; font-weight: bold; } dl dd { margin-bottom: 0.75em; } /* Abbreviations */ abbr, acronym { text-transform: uppercase; font-size: 90%; color: #777; border-bottom: 1px dotted #ddd; cursor: help; } abbr { text-transform: none; } /* Blockquotes */ blockquote { margin: 0 0 1.25em; padding: 0 1.25em 0 1.875em; border-left: 2px solid #ddd; } blockquote cite { display: block; font-size: 0.0625em; color: #888888; } blockquote cite:before { content: "\2014 \0020"; } blockquote cite a, blockquote cite a:visited { color: #888888; } blockquote, blockquote p { line-height: 1.6; color: #999; font-style: italic; font-size: 110%; } .vevent .summary { font-weight: bold; } .vevent abbr { cursor: default; text-decoration: none; font-weight: bold; border: none; padding: 0 0.0625em; } @media only screen and (min-width: 48em) { h1, h2, h3, h4, h5, h6 { line-height: 1.4; } h1 { font-size: 1.625em; } h2 { font-size: 1.5em; } h3 { font-size: 1.25em; } h4 { font-size: 1.125em; } } /* * Print styles. * * Inlined to avoid required HTTP connection: www.phpied.com/delay-loading-your-print-css/ * Credit to Paul Irish and HTML5 Boilerplate (html5boilerplate.com) */ .print-only { display: none !important; } @media print { * { background: transparent !important; color: #000 !important; /* Black prints faster: h5bp.com/s */ box-shadow: none !important; text-shadow: none !important; } a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } abbr[title]:after { content: " (" attr(title) ")"; } .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } thead { display: table-header-group; /* h5bp.com/t */ } tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } .hide-on-print { display: none !important; } .print-only { display: block !important; } .hide-for-print { display: none !important; } .show-for-print { display: inherit !important; } } #submit, button, .button, input[type="submit"] { border: 0; text-transform: uppercase; cursor: pointer; font-family: inherit; font-weight: normal; line-height: 1; margin: 0 0 1.25em; position: relative; text-decoration: none; text-align: center; -webkit-transition: all 200ms ease-out; transition: all 200ms ease-out; display: inline-block; padding-top: 0.75em; padding-right: 1.5em; padding-bottom: 0.8125em; padding-left: 1.5em; font-size: 1em; background-color: #627f9a; border-color: #627f9a; color: #fff; } #submit:hover, #submit:focus, button:hover, button:focus, .button:hover, .button:focus, input[type="submit"]:hover, input[type="submit"]:focus { box-shadow: inset 0px 150px 20px 50px rgba(0, 0, 0, 0.2); } #submit:hover, #submit:focus, button:hover, button:focus, .button:hover, .button:focus, input[type="submit"]:hover, input[type="submit"]:focus { color: #fff; } #submit.secondary, button.secondary, .button.secondary, input[type="submit"].secondary { background-color: #d26e4b; border-color: #d26e4b; color: #fff; } #submit.secondary:hover, #submit.secondary:focus, button.secondary:hover, button.secondary:focus, .button.secondary:hover, .button.secondary:focus, input[type="submit"].secondary:hover, input[type="submit"].secondary:focus { box-shadow: inset 0px 150px 20px 50px rgba(0, 0, 0, 0.2); } #submit.secondary:hover, #submit.secondary:focus, button.secondary:hover, button.secondary:focus, .button.secondary:hover, .button.secondary:focus, input[type="submit"].secondary:hover, input[type="submit"].secondary:focus { color: #fff; } #submit.white, button.white, .button.white, input[type="submit"].white { background-color: #FFF; border-color: #FFF; color: #333; } #submit.white:hover, #submit.white:focus, button.white:hover, button.white:focus, .button.white:hover, .button.white:focus, input[type="submit"].white:hover, input[type="submit"].white:focus { box-shadow: inset 0px 150px 20px 50px rgba(0, 0, 0, 0.2); } #submit.white:hover, #submit.white:focus, button.white:hover, button.white:focus, .button.white:hover, .button.white:focus, input[type="submit"].white:hover, input[type="submit"].white:focus { color: #333; } #submit.success, button.success, .button.success, input[type="submit"].success { background-color: #7a9c59; border-color: #7a9c59; color: #fff; } #submit.success:hover, #submit.success:focus, button.success:hover, button.success:focus, .button.success:hover, .button.success:focus, input[type="submit"].success:hover, input[type="submit"].success:focus { box-shadow: inset 0px 150px 20px 50px rgba(0, 0, 0, 0.2); } #submit.success:hover, #submit.success:focus, button.success:hover, button.success:focus, .button.success:hover, .button.success:focus, input[type="submit"].success:hover, input[type="submit"].success:focus { color: #fff; } #submit.alert, button.alert, .button.alert, input[type="submit"].alert { background-color: #b20000; border-color: #b20000; color: #fff; } #submit.alert:hover, #submit.alert:focus, button.alert:hover, button.alert:focus, .button.alert:hover, .button.alert:focus, input[type="submit"].alert:hover, input[type="submit"].alert:focus { box-shadow: inset 0px 150px 20px 50px rgba(0, 0, 0, 0.2); } #submit.alert:hover, #submit.alert:focus, button.alert:hover, button.alert:focus, .button.alert:hover, .button.alert:focus, input[type="submit"].alert:hover, input[type="submit"].alert:focus { color: #fff; } #submit.large, button.large, .button.large, input[type="submit"].large { padding-top: 1em; padding-right: 2em; padding-bottom: 1.0625em; padding-left: 2em; font-size: 1.25em; } #submit.small, button.small, .button.small, input[type="submit"].small { padding-top: 0.5625em; padding-right: 1.125em; padding-bottom: 0.625em; padding-left: 1.125em; font-size: 0.8125em; } #submit.tiny, button.tiny, .button.tiny, input[type="submit"].tiny { padding-top: 0.4375em; padding-right: 0.875em; padding-bottom: 0.5em; padding-left: 0.875em; font-size: 0.6875em; } #submit.expand, button.expand, .button.expand, input[type="submit"].expand { padding-right: 0px; padding-left: 0px; width: 100%; } #submit.left-align, button.left-align, .button.left-align, input[type="submit"].left-align { text-align: left; text-indent: 0.75em; } #submit.right-align, button.right-align, .button.right-align, input[type="submit"].right-align { text-align: right; padding-right: 0.75em; } #submit.disabled, #submit[disabled], button.disabled, button[disabled], .button.disabled, .button[disabled], input[type="submit"].disabled, input[type="submit"][disabled] { background-color: #627f9a; border-color: #627f9a; color: #fff; cursor: default; opacity: 0.6; box-shadow: none; } #submit.disabled:hover, #submit.disabled:focus, #submit[disabled]:hover, #submit[disabled]:focus, button.disabled:hover, button.disabled:focus, button[disabled]:hover, button[disabled]:focus, .button.disabled:hover, .button.disabled:focus, .button[disabled]:hover, .button[disabled]:focus, input[type="submit"].disabled:hover, input[type="submit"].disabled:focus, input[type="submit"][disabled]:hover, input[type="submit"][disabled]:focus { box-shadow: inset 0px 150px 20px 50px rgba(0, 0, 0, 0.2); } #submit.disabled:hover, #submit.disabled:focus, #submit[disabled]:hover, #submit[disabled]:focus, button.disabled:hover, button.disabled:focus, button[disabled]:hover, button[disabled]:focus, .button.disabled:hover, .button.disabled:focus, .button[disabled]:hover, .button[disabled]:focus, input[type="submit"].disabled:hover, input[type="submit"].disabled:focus, input[type="submit"][disabled]:hover, input[type="submit"][disabled]:focus { color: #fff; } #submit.disabled:hover, #submit.disabled:focus, #submit[disabled]:hover, #submit[disabled]:focus, button.disabled:hover, button.disabled:focus, button[disabled]:hover, button[disabled]:focus, .button.disabled:hover, .button.disabled:focus, .button[disabled]:hover, .button[disabled]:focus, input[type="submit"].disabled:hover, input[type="submit"].disabled:focus, input[type="submit"][disabled]:hover, input[type="submit"][disabled]:focus { background-color: #627f9a; } #submit.disabled.secondary, #submit[disabled].secondary, button.disabled.secondary, button[disabled].secondary, .button.disabled.secondary, .button[disabled].secondary, input[type="submit"].disabled.secondary, input[type="submit"][disabled].secondary { background-color: #d26e4b; border-color: #d26e4b; color: #fff; cursor: default; opacity: 0.6; box-shadow: none; } #submit.disabled.secondary:hover, #submit.disabled.secondary:focus, #submit[disabled].secondary:hover, #submit[disabled].secondary:focus, button.disabled.secondary:hover, button.disabled.secondary:focus, button[disabled].secondary:hover, button[disabled].secondary:focus, .button.disabled.secondary:hover, .button.disabled.secondary:focus, .button[disabled].secondary:hover, .button[disabled].secondary:focus, input[type="submit"].disabled.secondary:hover, input[type="submit"].disabled.secondary:focus, input[type="submit"][disabled].secondary:hover, input[type="submit"][disabled].secondary:focus { box-shadow: inset 0px 150px 20px 50px rgba(0, 0, 0, 0.2); } #submit.disabled.secondary:hover, #submit.disabled.secondary:focus, #submit[disabled].secondary:hover, #submit[disabled].secondary:focus, button.disabled.secondary:hover, button.disabled.secondary:focus, button[disabled].secondary:hover, button[disabled].secondary:focus, .button.disabled.secondary:hover, .button.disabled.secondary:focus, .button[disabled].secondary:hover, .button[disabled].secondary:focus, input[type="submit"].disabled.secondary:hover, input[type="submit"].disabled.secondary:focus, input[type="submit"][disabled].secondary:hover, input[type="submit"][disabled].secondary:focus { color: #fff; } #submit.disabled.secondary:hover, #submit.disabled.secondary:focus, #submit[disabled].secondary:hover, #submit[disabled].secondary:focus, button.disabled.secondary:hover, button.disabled.secondary:focus, button[disabled].secondary:hover, button[disabled].secondary:focus, .button.disabled.secondary:hover, .button.disabled.secondary:focus, .button[disabled].secondary:hover, .button[disabled].secondary:focus, input[type="submit"].disabled.secondary:hover, input[type="submit"].disabled.secondary:focus, input[type="submit"][disabled].secondary:hover, input[type="submit"][disabled].secondary:focus { background-color: #d26e4b; } #submit.disabled.white, #submit[disabled].white, button.disabled.white, button[disabled].white, .button.disabled.white, .button[disabled].white, input[type="submit"].disabled.white, input[type="submit"][disabled].white { background-color: #eee; border-color: #eee; color: #333; } #submit.disabled.white:hover, #submit.disabled.white:focus, #submit[disabled].white:hover, #submit[disabled].white:focus, button.disabled.white:hover, button.disabled.white:focus, button[disabled].white:hover, button[disabled].white:focus, .button.disabled.white:hover, .button.disabled.white:focus, .button[disabled].white:hover, .button[disabled].white:focus, input[type="submit"].disabled.white:hover, input[type="submit"].disabled.white:focus, input[type="submit"][disabled].white:hover, input[type="submit"][disabled].white:focus { box-shadow: inset 0px 150px 20px 50px rgba(0, 0, 0, 0.2); } #submit.disabled.white:hover, #submit.disabled.white:focus, #submit[disabled].white:hover, #submit[disabled].white:focus, button.disabled.white:hover, button.disabled.white:focus, button[disabled].white:hover, button[disabled].white:focus, .button.disabled.white:hover, .button.disabled.white:focus, .button[disabled].white:hover, .button[disabled].white:focus, input[type="submit"].disabled.white:hover, input[type="submit"].disabled.white:focus, input[type="submit"][disabled].white:hover, input[type="submit"][disabled].white:focus { color: #333; } #submit.disabled.success, #submit[disabled].success, button.disabled.success, button[disabled].success, .button.disabled.success, .button[disabled].success, input[type="submit"].disabled.success, input[type="submit"][disabled].success { background-color: #7a9c59; border-color: #7a9c59; color: #fff; cursor: default; opacity: 0.6; box-shadow: none; } #submit.disabled.success:hover, #submit.disabled.success:focus, #submit[disabled].success:hover, #submit[disabled].success:focus, button.disabled.success:hover, button.disabled.success:focus, button[disabled].success:hover, button[disabled].success:focus, .button.disabled.success:hover, .button.disabled.success:focus, .button[disabled].success:hover, .button[disabled].success:focus, input[type="submit"].disabled.success:hover, input[type="submit"].disabled.success:focus, input[type="submit"][disabled].success:hover, input[type="submit"][disabled].success:focus { box-shadow: inset 0px 150px 20px 50px rgba(0, 0, 0, 0.2); } #submit.disabled.success:hover, #submit.disabled.success:focus, #submit[disabled].success:hover, #submit[disabled].success:focus, button.disabled.success:hover, button.disabled.success:focus, button[disabled].success:hover, button[disabled].success:focus, .button.disabled.success:hover, .button.disabled.success:focus, .button[disabled].success:hover, .button[disabled].success:focus, input[type="submit"].disabled.success:hover, input[type="submit"].disabled.success:focus, input[type="submit"][disabled].success:hover, input[type="submit"][disabled].success:focus { color: #fff; } #submit.disabled.success:hover, #submit.disabled.success:focus, #submit[disabled].success:hover, #submit[disabled].success:focus, button.disabled.success:hover, button.disabled.success:focus, button[disabled].success:hover, button[disabled].success:focus, .button.disabled.success:hover, .button.disabled.success:focus, .button[disabled].success:hover, .button[disabled].success:focus, input[type="submit"].disabled.success:hover, input[type="submit"].disabled.success:focus, input[type="submit"][disabled].success:hover, input[type="submit"][disabled].success:focus { background-color: #7a9c59; } #submit.disabled.alert, #submit[disabled].alert, button.disabled.alert, button[disabled].alert, .button.disabled.alert, .button[disabled].alert, input[type="submit"].disabled.alert, input[type="submit"][disabled].alert { background-color: #b20000; border-color: #b20000; color: #fff; cursor: default; opacity: 0.6; box-shadow: none; } #submit.disabled.alert:hover, #submit.disabled.alert:focus, #submit[disabled].alert:hover, #submit[disabled].alert:focus, button.disabled.alert:hover, button.disabled.alert:focus, button[disabled].alert:hover, button[disabled].alert:focus, .button.disabled.alert:hover, .button.disabled.alert:focus, .button[disabled].alert:hover, .button[disabled].alert:focus, input[type="submit"].disabled.alert:hover, input[type="submit"].disabled.alert:focus, input[type="submit"][disabled].alert:hover, input[type="submit"][disabled].alert:focus { box-shadow: inset 0px 150px 20px 50px rgba(0, 0, 0, 0.2); } #submit.disabled.alert:hover, #submit.disabled.alert:focus, #submit[disabled].alert:hover, #submit[disabled].alert:focus, button.disabled.alert:hover, button.disabled.alert:focus, button[disabled].alert:hover, button[disabled].alert:focus, .button.disabled.alert:hover, .button.disabled.alert:focus, .button[disabled].alert:hover, .button[disabled].alert:focus, input[type="submit"].disabled.alert:hover, input[type="submit"].disabled.alert:focus, input[type="submit"][disabled].alert:hover, input[type="submit"][disabled].alert:focus { color: #fff; } #submit.disabled.alert:hover, #submit.disabled.alert:focus, #submit[disabled].alert:hover, #submit[disabled].alert:focus, button.disabled.alert:hover, button.disabled.alert:focus, button[disabled].alert:hover, button[disabled].alert:focus, .button.disabled.alert:hover, .button.disabled.alert:focus, .button[disabled].alert:hover, .button[disabled].alert:focus, input[type="submit"].disabled.alert:hover, input[type="submit"].disabled.alert:focus, input[type="submit"][disabled].alert:hover, input[type="submit"][disabled].alert:focus { background-color: #b20000; } #submit, button, .button, input[type="submit"] { padding-top: 0.8125em; padding-bottom: 0.75em; } #submit.tiny, button.tiny, .button.tiny, input[type="submit"].tiny { padding-top: 0.5em; padding-bottom: 0.4375em; } #submit.small, button.small, .button.small, input[type="submit"].small { padding-top: 0.625em; padding-bottom: 0.5625em; } #submit.large, button.large, .button.large, input[type="submit"].large { padding-top: 1.03125em; padding-bottom: 1.03125em; } @media only screen and (min-width: 48em) { #submit, button, .button, input[type="submit"] { display: inline-block; } } /* alternative button styles*/ .button.alt-button:hover { box-shadow: none !important; background-color: #627f9a !important; } .primary.alt-button:hover { background-color: #627f9a !important; } .secondary.alt-button:hover { background-color: #d26e4b !important; } .alert.alt-button:hover { background-color: #b20000 !important; } .success.alt-button:hover { background-color: #7a9c59 !important; } .button.success.alt-button { color: #7a9c59; } .button.alert.alt-button { color: #b20000; } .secondary.alt-button { color: #d26e4b; } .alt-button { color: #627f9a; } .alt-button { background-color: transparent !important; border-width: 2px !important; border-style: solid !important; } .alt-button:hover { color: #FFF !important; } .button.white.alt-button { color: #FFF; } .button.white.alt-button:hover { color: #000 !important; background-color: #FFF !important; } .button.black.alt-button { color: #333; } .button.black.alt-button:hover { color: #000 !important; background-color: #FFF !important; } .facebook-button { background-color: #3a589d !important; } .ux_banner .button { padding-top: 0.93em; padding-bottom: 1em; } .ux_banner .button.alt-button { padding-top: 0.80em; padding-bottom: 0.90em; } /* Add to cart buttons */ .button.loading { opacity: 0.6; } .button.added { display: none; } .added_to_cart.wc-forward { display: inline-block; } /* Standard Forms */ form { margin: 0 0 1em; } /* Using forms within rows, we need to set some defaults */ form .row .row { margin: 0 -0.5em; } form .row .row .column, form .row .row .columns { padding: 0 0.5em; } form .row .row.collapse { margin: 0; } form .row .row.collapse .column, form .row .row.collapse .columns { padding: 0; } form .row input.column, form .row input.columns, form .row textarea.column, form .row textarea.columns { padding-left: 0.5em; } /* Label Styles */ label { font-size: 0.875em; color: #4d4d4d; cursor: pointer; display: block; font-weight: 500; margin-bottom: 0.1875em; } label.right { float: none; text-align: right; } label.inline { margin: 0 0 1em 0; padding: 0.625em 0; } /* Attach elements to the beginning or end of an input */ .prefix, .postfix { display: block; position: relative; z-index: 2; text-align: center; width: 100%; padding-top: 0; padding-bottom: 0; border-style: solid; border-width: 1px; overflow: hidden; font-size: 0.875em; height: 2.3125em; line-height: 2.3125em; } /* Adjust padding, alignment and radius if pre/post element is a button */ .postfix.button { padding-left: 0; padding-right: 0; padding-top: 0; padding-bottom: 0; text-align: center; line-height: 2.125em; } .prefix.button { padding-left: 0; padding-right: 0; padding-top: 0; padding-bottom: 0; text-align: center; line-height: 2.125em; } .prefix.button.radius { border-radius: 0; -moz-border-radius-bottomleft: 5px; -moz-border-radius-topleft: 5px; -webkit-border-bottom-left-radius: 5px; -webkit-border-top-left-radius: 5px; border-bottom-left-radius: 5px; border-top-left-radius: 5px; } .postfix.button.radius { border-radius: 0; -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 5px; -webkit-border-top-right-radius: 5px; -webkit-border-bottom-right-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; } .prefix.button.round { border-radius: 0; -moz-border-radius-bottomleft: 1000px; -moz-border-radius-topleft: 1000px; -webkit-border-bottom-left-radius: 1000px; -webkit-border-top-left-radius: 1000px; border-bottom-left-radius: 1000px; border-top-left-radius: 1000px; } .postfix.button.round { border-radius: 0; -moz-border-radius-topright: 1000px; -moz-border-radius-bottomright: 1000px; -webkit-border-top-right-radius: 1000px; -webkit-border-bottom-right-radius: 1000px; border-top-right-radius: 1000px; border-bottom-right-radius: 1000px; } /* Separate prefix and postfix styles when on span so buttons keep their own */ span.prefix { background: #f2f2f2; border-color: #d9d9d9; border-right: none; color: #333; } span.prefix.radius { border-radius: 0; -moz-border-radius-bottomleft: 6px; -moz-border-radius-topleft: 6px; -webkit-border-bottom-left-radius: 6px; -webkit-border-top-left-radius: 6px; border-bottom-left-radius: 6px; border-top-left-radius: 6px; } span.postfix { background: #f2f2f2; border-color: #cccccc; border-left: none; color: #333; } span.postfix.radius { border-radius: 0; -moz-border-radius-topright: 6px; -moz-border-radius-bottomright: 6px; -webkit-border-top-right-radius: 6px; -webkit-border-bottom-right-radius: 6px; border-top-right-radius: 6px; border-bottom-right-radius: 6px; } /* Input groups will automatically style first and last elements of the group */ .input-group.radius > *:first-child, .input-group.radius > *:first-child * { -moz-border-radius-bottomleft: 6px; -moz-border-radius-topleft: 6px; -webkit-border-bottom-left-radius: 6px; -webkit-border-top-left-radius: 6px; border-bottom-left-radius: 6px; border-top-left-radius: 6px; } .input-group.radius > *:last-child, .input-group.radius > *:last-child * { -moz-border-radius-topright: 6px; -moz-border-radius-bottomright: 6px; -webkit-border-top-right-radius: 6px; -webkit-border-bottom-right-radius: 6px; border-top-right-radius: 6px; border-bottom-right-radius: 6px; } .input-group.round > *:first-child, .input-group.round > *:first-child * { -moz-border-radius-bottomleft: 1000px; -moz-border-radius-topleft: 1000px; -webkit-border-bottom-left-radius: 1000px; -webkit-border-top-left-radius: 1000px; border-bottom-left-radius: 1000px; border-top-left-radius: 1000px; } .input-group.round > *:last-child, .input-group.round > *:last-child * { -moz-border-radius-topright: 1000px; -moz-border-radius-bottomright: 1000px; -webkit-border-top-right-radius: 1000px; -webkit-border-bottom-right-radius: 1000px; border-top-right-radius: 1000px; border-bottom-right-radius: 1000px; } /* We use this to get basic styling on all basic form elements */ input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], textarea { background-color: #fff; font-family: inherit; border: 1px solid #cccccc; box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); color: rgba(0, 0, 0, 0.75); display: block; font-size: 0.875em; margin: 0 0 1em 0; padding: 0.5em; height: 2.3125em; width: 100%; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition: box-shadow 0.45s, border-color 0.45s ease-in-out; transition: box-shadow 0.45s, border-color 0.45s ease-in-out; } input[type="text"]:focus, input[type="password"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="time"]:focus, input[type="url"]:focus, textarea:focus { box-shadow: 0 0 5px #999999; border-color: #999999; } input[type="text"]:focus, input[type="password"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="time"]:focus, input[type="url"]:focus, textarea:focus { background: #fafafa; border-color: #999999; outline: none; } input[type="text"][disabled], input[type="password"][disabled], input[type="date"][disabled], input[type="datetime"][disabled], input[type="datetime-local"][disabled], input[type="month"][disabled], input[type="week"][disabled], input[type="email"][disabled], input[type="number"][disabled], input[type="search"][disabled], input[type="tel"][disabled], input[type="time"][disabled], input[type="url"][disabled], textarea[disabled] { background-color: #ddd; } /* Adjust margin for form elements below */ input[type="file"], input[type="checkbox"], input[type="radio"], select { margin: 0 0 1em 0; } /* Checkbox labels */ ​input[type="checkbox"] + label { display: inline-block; margin-left: 15px; } /* Normalize file input width */ input[type="file"] { width: 100%; } /* We add basic fieldset styling */ fieldset { border: solid 1px #ddd; padding: 1.25em; margin: 1.125em 0; } fieldset legend { font-weight: bold; background: #fff; padding: 0 0.1875em; margin: 0; margin-left: -0.1875em; } /* Error Handling */ .error input, input.error, .error textarea, textarea.error { border-color: #b20000; background-color: rgba(178, 0, 0, 0.1); } .error input:focus, input.error:focus, .error textarea:focus, textarea.error:focus { background: #fafafa; border-color: #999999; } .error label, label.error { color: #b20000; } .error small, small.error { display: block; padding: 0.375em 0.25em; margin-top: -1.3125em; margin-bottom: 1em; font-size: 0.75em; font-weight: bold; background: #b20000; color: #fff; } /* Error Handling WooCommerce */ .woocommerce-invalid input, .woocommerce-invalid input, input.woocommerce-invalid, .woocommerce-invalid textarea, textarea.woocommerce-invalid { border-color: #b20000; background-color: rgba(178, 0, 0, 0.1); } .woocommerce-invalid input:focus, .woocommerce-invalid input:focus, input.woocommerce-invalid:focus, .woocommerce-invalid textarea:focus, textarea.woocommerce-invalid:focus { background: #fafafa; border-color: #999999; } .woocommerce-invalid label, label.woocommerce-invalid { color: #b20000; } .woocommerce-invalid small, small.woocommerce-invalid { display: block; padding: 0.375em 0.25em; margin-top: -1.3125em; margin-bottom: 1em; font-size: 0.75em; font-weight: bold; background: #b20000; color: #fff; } /* Foundation Alerts */ .alert-box { border-style: solid; border-width: 1px; display: block; font-weight: bold; margin-bottom: 1.25em; position: relative; padding: 0.6875em 1.3125em 0.75em 0.6875em; font-size: 0.875em; background-color: #627f9a; border-color: #4e657b; color: #fff; } .alert-box .close { font-size: 1.375em; padding: 5px 4px 4px; line-height: 0; position: absolute; top: 0.4375em; right: 0.3125em; color: #333; opacity: 0.3; } .alert-box .close:hover, .alert-box .close:focus { opacity: 0.5; } .alert-box.radius { border-radius: 6px; } .alert-box.round { border-radius: 1000px; } .alert-box.success { background-color: #7a9c59; border-color: #617c46; color: #fff; } .alert-box.alert { background-color: #b20000; border-color: #7f0000; color: #fff; } .alert-box.secondary { background-color: #d26e4b; border-color: #bb532f; color: #fff; } /* Pagination */ .pagination { display: block; height: 1.5em; margin-left: -0.3125em; } .pagination li { display: block; float: left; height: 1.5em; color: #222; font-size: 0.875em; margin-left: 0.3125em; } .pagination li a { display: block; padding: 0.0625em 0.4375em 0.0625em; color: #999; } .pagination li:hover a, .pagination li a:focus { background: #e6e6e6; } .pagination li.unavailable a { cursor: default; color: #999; } .pagination li.unavailable:hover a, .pagination li.unavailable a:focus { background: transparent; } .pagination li.current a { background: #627f9a; color: #fff; font-weight: bold; cursor: default; } .pagination li.current a:hover, .pagination li.current a:focus { background: #627f9a; } .pagination-centered { text-align: center; } .pagination-centered ul > li { float: none; display: inline-block; } /* Tables */ table { margin-bottom: 1.25em; width: 100%; } table thead, table tfoot { font-weight: bold; } table thead tr th, table thead tr td, table tfoot tr th, table tfoot tr td { padding: 0.5em 0; font-size: 0.875em; text-align: left; } table tr th, table tr td { padding: 0.5625em 0em; font-size: 0.875em; } table thead tr th, table tfoot tr th, table tbody tr td, table tr td, table tfoot tr td { display: table-cell; line-height: 1.125em; } table th { font-weight: bold; } table td, table th { padding: 0px 10px 15px; text-align: left; } table tr:last-child { border-bottom: 0; } /* Foundation Visibility HTML Classes */ .show-for-small, .show-for-medium-down, .show-for-large-down { display: inherit !important; } .show-for-medium, .show-for-medium-up, .show-for-large, .show-for-large-up, .show-for-xlarge, li.show-for-medium, li.show-for-medium-up, li.show-for-large, li.show-for-large-up, li.show-for-xlarge { display: none !important; } .hide-for-medium, .hide-for-medium-up, .hide-for-large, .hide-for-large-up, .hide-for-xlarge { display: inherit !important; } .hide-for-small, .hide-for-medium-down, .hide-for-large-down, li.hide-for-small, li.hide-for-medium-down, li.hide-for-large-down { display: none !important; } /* Specific visilbity for tables */ /* Medium Displays: 768px - 1279px */ @media only screen and (min-width: 48em) { .show-for-medium, .show-for-medium-up { display: inherit !important; } .show-for-small { display: none !important; } .hide-for-small { display: inherit !important; } .hide-for-medium, .hide-for-medium-up { display: none !important; } /* Specific visilbity for tables */ } /* Large Displays: 1280px - 1440px */ @media only screen and (min-width: 80em) { .show-for-large, .show-for-large-up { display: inherit !important; } .show-for-medium, .show-for-medium-down { display: none !important; } .hide-for-medium, .hide-for-medium-down { display: inherit !important; } .hide-for-large, .hide-for-large-up { display: none !important; } /* Specific visilbity for tables */ } /* X-Large Displays: 1400px and up */ @media only screen and (min-width: 90em) { .show-for-xlarge { display: inherit !important; } .show-for-large, .show-for-large-down { display: none !important; } .hide-for-large, .hide-for-large-down { display: inherit !important; } .hide-for-xlarge { display: none !important; } /* Specific visilbity for tables */ } /* Orientation targeting */ .show-for-landscape, .hide-for-portrait { display: inherit !important; } .hide-for-landscape, .show-for-portrait { display: none !important; } /* Specific visilbity for tables */ @media only screen and (orientation: landscape) { .show-for-landscape, .hide-for-portrait { display: inherit !important; } .hide-for-landscape, .show-for-portrait { display: none !important; } /* Specific visilbity for tables */ } @media only screen and (orientation: portrait) { .show-for-portrait, .hide-for-landscape { display: inherit !important; } .hide-for-portrait, .show-for-landscape { display: none !important; } /* Specific visilbity for tables */ } /* Touch-enabled device targeting */ .show-for-touch { display: none !important; } .hide-for-touch { display: inherit !important; } .touch .show-for-touch { display: inherit !important; } .touch .hide-for-touch { display: none !important; } /* Specific visilbity for tables */