/* annasta Woocommerce Product Filters Wordpress Plugin Stylesheet */ /** Typography * * Font Awesome Free 5.3.1 by @fontawesome - https://fontawesome.com * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) */ @font-face { font-family: 'Font Awesome 5 Free'; font-style: normal; font-weight: 400; src: url("fonts/fa-regular-400.eot"); src: url("fonts/fa-regular-400.eot?#iefix") format("embedded-opentype"), url("fonts/fa-regular-400.woff2") format("woff2"), url("fonts/fa-regular-400.woff") format("woff"), url("fonts/fa-regular-400.ttf") format("truetype"), url("fonts/fa-regular-400.svg#fontawesome") format("svg"); } @font-face { font-family: 'Font Awesome 5 Free'; font-style: normal; font-weight: 900; src: url("fonts/fa-solid-900.eot"); src: url("fonts/fa-solid-900.eot?#iefix") format("embedded-opentype"), url("fonts/fa-solid-900.woff2") format("woff2"), url("fonts/fa-solid-900.woff") format("woff"), url("fonts/fa-solid-900.ttf") format("truetype"), url("fonts/fa-solid-900.svg#fontawesome") format("svg"); } .awf-clearfix::before, .awf-clearfix::after { content: " "; display: table; } .awf-clearfix::after { clear: both; } .awf-preset-title { margin: 0.3em 0.5em 0.33em 0; font-size: 1.5em; } .awf-active-badges-container { margin-bottom: 1em; padding-left: 5px; } .awf-active-badges-container > div { cursor: default; margin: 0 0 -0.4em; padding: 0.1em; font-weight: 200; border-radius: 5px; overflow: hidden; } .awf-active-badges-container > div:hover { color: #96588a; } .awf-active-badges-container i { float: right; cursor: pointer; padding: 0.3em 0.5em 0.3em 0.3em; line-height: 1em; color: #96588a; } .awf-reset-btn { margin-bottom: 1em; } #secondary .awf-reset-btn { width: 100%; } .header-widget-region .awf-preset-wrapper { display: flex; flex-wrap: wrap; margin-top: 1em; } .header-widget-region .awf-preset-wrapper > div { } .header-widget-region .awf-preset-wrapper > form { display: flex; flex-wrap: wrap; align-items: stretch; min-width: 100%; flex: 0 0 100%; } .header-widget-region .awf-preset-title, .header-widget-region .awf-preset-wrapper > .awf-active-badges-container { /* display: table-cell; vertical-align: top; */ line-height: 1.1em; font-size: 1.5em; } .header-widget-region .awf-preset-title { margin: 0 0.5em 0 0; } .header-widget-region .awf-preset-wrapper > .awf-active-badges-container { margin: 0; padding: 0 0 0.5em; } .header-widget-region .awf-preset-wrapper > .awf-active-badges-container > div { display: inline-block; margin: 0 0.5em 0 0; font-size: 0.7em; } .header-widget-region .awf-active-badges-container > div { padding: 0; font-weight: 200; } .header-widget-region .awf-active-badges-container i { float: none; font-size: 0.7em; } .header-widget-region .awf-preset-wrapper > .awf-reset-btn-container { flex-grow: 1; text-align: right; } .header-widget-region .awf-reset-btn { display: block; clear: both; } .header-widget-region .awf-preset-wrapper > .awf-reset-btn-container .awf-reset-btn { display: inline-block; } .header-widget-region .awf-filter-title { font-size: 18px; } .awf-filter-wrapper { margin-bottom: 1.5em; } .awf-filter-wrapper .awf-hidden { display: none; } .awf-instant .awf-form-submit-btn { display: none; } .awf-filter-wrapper .awf-filter-title-container { cursor: pointer; display: flex; flex-wrap: nowrap; margin-bottom: 1em; height: 38px; max-height: 38px; line-height: 35px; padding-bottom: 2px; color: #777777; font-size: 20px; font-weight: 300; border-bottom: 1px solid #d1d1d1; } .awf-filter-wrapper .awf-filter-title { flex-grow: 1; overflow: hidden; line-height: 35px; } .awf-filter-wrapper .awf-collapse-btn { width: 25px; } .awf-filter-wrapper .awf-collapse-btn::before { content: "\f0de"; cursor: pointer; padding: 10px; color: #777777; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 0.7em; } .awf-filter-wrapper .awf-collapse-btn::before:hover { color: #333333; } .awf-filter-wrapper.awf-collapsed .awf-collapse-btn::before { content: "\f107"; font-size: 15px; } .awf-filter-wrapper .awf-filters-container.awf-style-range-slider:not(.awf-scrollbars-on), .awf-filter-wrapper .awf-filters-container.awf-filters-s:not(.awf-scrollbars-on) { overflow: visible; } .awf-filter-wrapper.awf-collapsed .awf-filters-container { visibility: hidden; height: 0; } .awf-filter-wrapper.awf-collapsed .awf-range-slider-container { margin-top: 0; margin-bottom: 0; height: 0; } .awf-filter-wrapper .awf-filters-container:not(.awf-scrollbars-on) .awf-filters-search-container { margin-top: -1.25em; } .awf-filter-wrapper .awf-filters-search-container { margin-bottom: 0.75em; } .awf-filter-wrapper .awf-filters-search { width: 100%; padding: 10px 5px; text-align: center; font-size: 14px; background-color: #fbfbfb; } .awf-filter-wrapper .awf-filters-search:focus { background-color: #f8f8f8; } .awf-filter-wrapper.awf-dropdown { position: relative; } .awf-dropdown .awf-filter-title-container { margin-bottom: 0; padding-left: 7px; border: 1px solid #cccccc; border-top-left-radius: 3px; border-top-right-radius: 3px; } .awf-dropdown .awf-filters-container { position: absolute; top: 40px; right: 0; width: 100%; padding: 0.7em 0.7em 0.5em; background: #fff; border: 1px solid #cccccc; box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1); z-index: 1; } .awf-filters-container ul { margin: 0 0 0 1em; list-style: none; } .awf-filters-container > ul { margin-left: 0; } .awf-filters-container.awf-pretty-scrollbars > ul { margin-right: 18px; } .awf-collapsible-children .awf-parent-container::after { content: "\f107"; float: right; cursor: pointer; padding: 0.5em 0.8em 0.2em; color: #777777; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 0.7em; } .awf-collapsible-children .awf-parent-container.awf-collapsed-on::after { content: "\f0d7"; } .awf-collapsible-children .awf-parent-container::after:hover { color: #333333; } .awf-children-container.awf-collapsed { display: none; } .awf-filter-container { white-space: nowrap; } .awf-filter-container.awf-empty-css.awf-empty { opacity: 0.6; } .awf-filter-container > *, .awf-filter-container > a > * { display: inline-block; vertical-align: middle; } .awf-filter-container:not(.awf-product-search-container) .awf-filter, .awf-filter-container:not(.awf-product-search-container) label { cursor: pointer; white-space: nowrap; } .awf-filter-container.awf-product-search-container .awf-filter { margin-left: -1em; width: 100%; padding-left: 3em; } .awf-filter-container.awf-product-search-container::before { content: "\f002"; position: relative; left: 1em; font-family: 'Font Awesome 5 Free'; font-weight: 900; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; vertical-align: text-top; } .awf-filter-container:not(.awf-product-search-container) label { margin-right: 0.5em; } .awf-filter-container.awf-empty-disabled.awf-empty > .awf-filter, .awf-filter-container.awf-empty-disabled.awf-empty > label, .awf-filter-container.awf-empty-disabled.awf-empty > a, .awf-filter-container.awf-empty-disabled.awf-empty > a > * { cursor: default; } .awf-filter-container.awf-empty-disabled.awf-empty label { opacity: 0.8; } input[type=checkbox].awf-filter { margin-top: 0.1em; } .awf-filter-container > a { color: #777777; } .awf-filter-container:not(.awf-empty-disabled) > a:hover, .awf-filter-container:not(.awf-empty-disabled) > label:hover { color: #333333; } .awf-style-icons label::before, .awf-style-custom-terms label::before { margin: 0 0.5em 0 0; color: #bbb; font-family: 'Font Awesome 5 Free'; font-weight: 400; font-size: 0.8em; } .awf-style-custom-terms .awf-filter-container:hover label::before { color: #6d6d6d; } .awf-style-custom-terms .awf-filter-container.awf-active label::before { color: #d33333; } .awf-style-images li, .awf-style-tags li, .awf-style-colours li { margin: 0 0.5em 0.7em 0; } .awf-style-colours a:focus, .awf-style-images a:focus { outline: none !important; } .awf-style-colours label, .awf-style-images label { position: relative; height: 40px; padding: 5px 0 0 45px; } .awf-style-images label::after { background-position: left top; background-size: cover; background-image: none; } .awf-style-images label::before, .awf-style-colours label::before { content: ""; position: absolute; left: 0; top: 0; width: 40px; height: 40px; border: 1px solid #cccccc; box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.02); } .awf-style-images label::after, .awf-style-colours label::after { content: ""; position: absolute; left: 4px; top: 4px; width: 34px; height: 34px; border: 1px solid #f1f1f1; box-sizing: border-box; } .awf-style-images label:hover::before, .awf-style-colours label:hover::before { box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.5); } .awf-style-images .awf-active label::before, .awf-style-colours .awf-active label::before { border-color: #bbbbbb; box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.5); } .awf-style-images .awf-active label:hover::before, .awf-style-colours .awf-active label:hover::before { border-color: #cccccc; box-shadow: inset 0px 0px 0px 2px rgba(0,0,0,0.02); } .awf-style-colours a:focus label::before, .awf-style-images a:focus label::before, .awf-style-images a:focus .awf-active label::before, .awf-style-colours a:focus .awf-active label::before { border: 1px solid #666666; box-shadow: none; } .awf-style-images .awf-active label:hover::after, .awf-style-colours .awf-active label:hover::after { top: 5px; left: 5px; width: 32px; height: 32px; } .awf-style-images .awf-filter-container .awf-count-wo-label .awf-filter-count, .awf-style-colours .awf-filter-container .awf-count-wo-label .awf-filter-count { position: absolute; right: 7px; bottom: 2px; margin: 0; padding: 0px 3px; line-height: 12px; background: white; border: 1px solid #dddddd; z-index: 1; opacity: 0.9; } .awf-style-tags .awf-filter-container { margin-right: 0.2em; padding: 0.5em; text-align: center; background: none; border: 2px solid #cccccc; border-radius: 3px; } .awf-style-tags .awf-filter-container:hover { background: #F8F8F8; border-color: #999999; } .awf-style-tags .awf-filter-container.awf-empty.awf-empty-disabled:hover:not(.awf-active) { background: none; border-color: #cccccc; } .awf-style-tags .awf-filter-container.awf-active { background: #F8F8F8; border-color: #777777; } .awf-style-tags .awf-filter-container.awf-active:hover { border-color: #cccccc; } .awf-style-tags input[type=checkbox]+label, .awf-style-tags input[type=radio]+label { margin: 0; font-size: 0.9em; } .awf-style-labels .awf-active label { font-weight: bold; } .awf-filter-container .awf-filter-count { margin: 0 0.8em 0 0.5em; vertical-align: text-bottom; color: #777777; font-size: 10px; } .awf-filter-container > a > .awf-filter-count { margin-top: -0.1em; } .awf-filter-container .awf-filter-count::before { content: " ("; } .awf-filter-container .awf-filter-count::after { content: ")"; } .awf-filter-container .awf-count-wo-label .awf-filter-count::before { content: ""; } .awf-filter-container .awf-count-wo-label .awf-filter-count::after { content: ""; } .awf-range-slider-container, .awf-taxonomy-range-slider-container { margin: 55px 30px 60px 22px; } .awf-range-slider-container > *, .awf-taxonomy-range-slider-container > * { display: block; vertical-align: top; } .awf-taxonomy-range-slider-container .awf-filter-container { display: none; } .awf-style-range-stars label { position: relative; padding-left: 84px; font-size: 16px; } .awf-style-range-stars label::before { content: ""; position: absolute; top: 3px; left: 0; color: #bbb; font-family: 'Font Awesome 5 Free'; font-weight: 400; font-size: 12px; letter-spacing: 0.5px } .awf-style-range-stars label::after { content: ""; position: absolute; top: 3px; left: 0; width: 0; height: 100%; overflow: hidden; color: #bbb; font-family: 'Font Awesome 5 Free'; font-weight: 900; font-size: 12px; letter-spacing: 0.5px } .awf-style-range-stars .awf-active label::after, .awf-style-range-stars label:hover::after{ color: #d33333; } .awf-style-range-stars label.awf-1-stars::after { width: 14px; } .awf-style-range-stars label.awf-2-stars::after { width: 28px; } .awf-style-range-stars label.awf-3-stars::after { width: 42px; } .awf-style-range-stars label.awf-4-stars::after { width: 56px; } .awf-style-range-stars label.awf-5-stars::after { width: 70px; } .awf-overlay-container { position: relative; } .awf-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: table; text-align: center; background: rgba(255,255,255); opacity: 0.5; z-index: 10000; } .awf-overlay i { font-size: 40px; display: table-cell; vertical-align: middle; } @media (max-width: 1024px) { .awf-range-slider-container, .awf-taxonomy-range-slider-container { transform: scale(0.8); margin-right: 0; margin-left: 0; } } /* WooCommerce layout related */ .header-widget-region .awf-preset-wrapper .awf-filter-wrapper { margin-right: 2%; width: 23%; } /* Pretty Scrollbar adjustments */ .awf-filters-container.awf-pretty-scrollbars .ps__rail-y { right: 0px; width: 11px; border-radius: 8px; opacity: 0.8; } .awf-filters-container.awf-pretty-scrollbars .ps__rail-y > .ps__thumb-y { right: 0px; } /* end of Pretty Scrollbar adjustments */