/* Theme Name: Flatsome Child Template: flatsome Version: 3.0.78 Description: This is a child theme for Flatsome Theme. This same CSS-file is used for both Elcykelpunkten and Greenbenefits Author: Stefan Elmgren (Stel) */ /* UX-Themes: The responsive breakpoints are preset and can not be changed. We have for Mobile (550px), Tablet (550-850px) and Desktop 850px+ */ /*************** ADD CUSTOM CSS HERE. FOR ALL SCREENS *****************/ /* Variables */ :root { --live-search-bg-color: #f3f3f3; --search-result-hover-color: #e6e6e6; --link-color-a: #008000; --input-txt-field-font-size: 20px; } /* Checkout page. Hide "Hemleverans kväll elcykel: 299 kr" */ body.woocommerce-checkout .woocommerce-shipping-totals .shipping__inner { display: none } /* Checkout page */ .price .wholesale_price_container .wholesale_price_title { font-size: unset; } /** * Bread text header colour. Highlighted, not normal --------------------------------------------- START **/ /* Uppgradera batteri? */ body.single-product form.cart .wc-pao-required-addon h3.wc-pao-addon-name, body.single-product .single_variation_wrap .wc-pao-required-addon h3.wc-pao-addon-name { color: #000; } /* Headers */ h1.stel-highlighted-header, h2.stel-highlighted-header, h3.stel-highlighted-header, h4.stel-highlighted-header { color: #008000; color: var(--link-color-a); } /* Förmåncykel-page */ body.page-id-2259 p.stel-highlighted-header span b, body.page-id-2259 p.stel-highlighted-header span strong, body.page-id-2259 p.stel-highlighted-header strong span { color: #008000; color: var(--link-color-a); } /* Single product page & GreenBenefits single product page */ body.single-product .col-inner.text-left h1.product-title, body.single-product .col-inner.text-left h2, body.single-product .col-inner.text-left h3, body.single-product .col-inner.text-left h4 { color: #008000; color: var(--link-color-a); } /* Single product page. White box with icon */ body.single-product .stel-section-img-box-highlight p strong, body.single-product .stel-section-img-box-highlight p strong a { color: #000; } .product span.not_purchasable_notice { display: block; width: 1080px; margin-left: auto; margin-right: auto; background: #DD3333; color: #ffffff; padding: 7px 20px; text-align: center; } .product .custom-product-page.ux-layout-1566.ux-layout-scope-global { background: #ffffff; } /* Brand/varumärke tab on single product page & GreenBenefits Brand/varumärke tab on single product page */ body.single-product #tab-pwb_tab-content h1, body.single-product #tab-pwb_tab-content h1 span strong, body.single-product #tab-pwb_tab-content h2, body.single-product #tab-pwb_tab-content h2 strong, body.single-product #tab-pwb_tab-content h3, body.single-product #tab-pwb_tab-content h3 strong, body.single-product #tab-pwb_tab-content h4, body.single-product #tab-pwb_tab-content h4 strong { color: #008000; color: var(--link-color-a); } /* Brand/varumärke-page & GreenBenefits brand/varumärke-page*/ body.archive.tax-pwb-brand .pwb-brand-description h1, body.archive.tax-pwb-brand .pwb-brand-description h2, body.archive.tax-pwb-brand .pwb-brand-description h3, body.archive.tax-pwb-brand .pwb-brand-description h4 { color: #008000; color: var(--link-color-a); } /* GreenBenefits Employer/Arbetsgivare-page */ body.page-id-8940 p.stel-highlighted-header span b, body.page-id-8940 p.stel-highlighted-header span strong, body.page-id-8940 p.stel-highlighted-header strong span { color: #008000; color: var(--link-color-a); } /* GreenBenefits Employee/Anställd-page */ body.page-id-8960 p.stel-highlighted-header span b, body.page-id-8960 p.stel-highlighted-header span strong, body.page-id-8960 p.stel-highlighted-header strong span { color: #008000; color: var(--link-color-a); } /* GreenBenefits Questions and answers/Frågor och svar-page*/ body.page-id-8960 p.stel-highlighted-header span b { color: #008000; color: var(--link-color-a); } /* Presentkort-pages */ body.postid-3700 .product-container .product-main h1.product-title, /* Fysiskt */ body.postid-3700 .gift-card-content-editor .gift-card-content-editor.step-content span.ywgc-editor-section-title, body.postid-3622 .product-container .product-main h1.product-title, /* Digitalt */ body.postid-3622 .gift-card-content-editor .gift-card-content-editor.step-content span.ywgc-editor-section-title { color: #008000; color: var(--link-color-a); } /** * Bread text header colour. Highlighted, not normal --------------------------------------------- END **/ body.archive .product-small .col-inner .product-small.box { padding-bottom: 7px; } /** * You Save ------------------------------------------------------------------------------------ START **/ span.you-save { color: #fff; font-size: 1.1em; font-weight: bold; color: #fff; background: #008000; padding: 5px 11px 5px 11px; border-radius: 7px; } /* You save below price on Single product page */ body.single-product .product_meta .you-save-wrapper, body.single-product div.price-wrapper span.price { font-size: 1.3em; margin-top: 6px; margin-bottom: 10px; } /* Above you save */ .box-text-products div.price-wrapper { margin-bottom: 5px; } /* Below you save */ body.archive #main .product-small .box-text.box-text-products { padding-bottom: 0.1em; } /** * You Save ------------------------------------------------------------------------------------ END **/ /** * CFF, Calculated Fields Form "you_save_XXX" has some CSS in the plugin under: Settings/Form setting tab/Customize form design **/ /* Checkout page. Hide "Hemleverans kväll elcykel: 299 kr" */ body.woocommerce-checkout .woocommerce-shipping-totals .shipping__inner { display: block; } /** * Remove icon. For example to remove product from cart ------------------------------------- START **/ #main td.product-remove { visibility: hidden; /* Hide remove X in cart etc */ } body a.remove, a.icon-remove { font-family: "fl-icons"; font-size: 26px !important; border-radius: 0; color: #000; font-weight: normal; border: none; } body a.remove:hover, body .widget_shopping_cart .product_list_widget a:hover { color: #999999; } .woocommerce-cart-form__cart-item.cart_item a.remove, .woocommerce-cart-form__cart-item.cart_item a.icon-remove { position: relative; top: 50%; transform: translateY(-50%); margin-top: -30px; } /** * Remove icon. For example to remove product from cart ------------------------------------- END **/ /** * Recently viewed products ------------------------------------------------------------------ START **/ .widget_recently_viewed_products ul.product_list_widget li img { width: 150px; height: 100px; object-fit: contain; } .widget_recently_viewed_products ul.product_list_widget li { min-height: 110px; } .custom-product-page .product-page-sidebar #custom_widget_optional_accesories-2 .optional-accessories h2 { text-align: center; } /** * Recently viewed products ------------------------------------------------------------------ END **/ /* Sale bubble */ li.ralated-product .product-image .badge-container { margin: 0; } /** * Accept cookies ---------------------------------------------------------------------------- START **/ #cookie-notice { opacity: 0.9; } #cn-notice-text a { color: #008000; line-height: 1.2; } /* Button */ #cn-accept-cookie { background-color: #008000; background-image: none; margin-top: 5px; width: 160px; } /* Button hover */ #cn-accept-cookie:hover { background-color: #007000; } /** * Accept cookies ---------------------------------------------------------------------------- END **/ /** * Wholesale -------------------------------------------------------------------------------- START **/ /* Small white boxes */ .price-wrapper>.price>.wholesale_price_container>ins>.woocommerce-Price-amount, .price-wrapper>.price>.wholesale_price_container>ins>.woocommerce-Price-amount>.woocommerce-Price-currencySymbol { color: black; } /* Small white boxes */ /* Also "liknande produkter" and "tillbehör" at bottom of single produkt page */ .price-wrapper>.price>.wholesale_price_container>ins>.woocommerce-Price-amount, .price-wrapper>.price>.wholesale_price_container>ins>.woocommerce-Price-amount>.woocommerce-Price-currencySymbol, .price-wrapper>.price>.wholesale_price_container>ins>.woocommerce-price-suffix { font-size: 16px; font-weight: bold; } /* Product pages */ .price-wrapper>.product-page-price>.wholesale_price_container>ins>.woocommerce-price-suffix, .price-wrapper>.product-page-price>.wholesale_price_container>ins>.woocommerce-Price-amount, .price-wrapper>.product-page-price>.wholesale_price_container>ins>.woocommerce-Price-amount>.woocommerce-Price-currencySymbol { font-size: 22px; font-weight: bold; } /** * Wholesale ---------------------------------------------------------------------------------- END **/ /* Logo --------------------------------------------------------------------------------------- START */ #logo { margin-top: 4px; } /* Text below logo */ .logo-tagline { font-family: sans-serif; letter-spacing: 1px; font-style: italic; font-size: 13px; color: #3c3c3c; line-height: 1.2; /* Increased from 1 because the "g" in "Sveriges" was cut off at the bottom */ text-align: center; font-weight: 500; margin-top: -8px; } /* Logo --------------------------------------------------------------------------------------- END */ /* Product page */ .custom-product-page .col-inner, .custom-product-page .tab-panels { border-radius: 5px; } /* Hide premium bubble * Also hidden by style="display:none; in functions.php ( add_shortcode("ux_premium_bubble", function ($atts) ) */ .product_cat-elcykel #premium-savings-badge { display: none !important; } /* Hide the "Varumärke" in the top left of the "varumärke"-tab in the single product page. Stefan Elmgren 19-01-25 */ .tab-panels>#tab-pwb_tab>h2:nth-child(1) { display: none; } /* Hide the Brand name (e.g "Batavus") in the top left of the "varumärke"-tab in the single product page. Stefan Elmgren */ .tab-panels>#tab-pwb_tab>#tab-pwb_tab-content>h3:nth-child(1) { display: none; } .page-wrapper { padding: 0; } /* Stel 19-02-06 */ div.product-short-description a { color: #008000; color: var(--link-color-a); } /* Breadcrumbs ------------------------------------------------------------------------------------ START */ .breadcrumbs a:hover { color: #008000; color: var(--link-color-a); } .breadcrumbs a { color: rgba(0, 0, 0, 0.62); font-weight: 100; } /* Breadcrumbs -------------------------------------------------------------------------------------- END */ /* Image in productgallery with padding */ .box-image img { padding-left: 1.0em; padding-right: 1.0em; padding-top: 1.0em; } /* Information icon on some attributes ---------------------------------------------------------------- START */ .attribute-pair .attr-name a { font-size: 1.3em; font-weight: 500; margin-left: 7px; color: #008000; color: var(--link-color-a); } .attribute-pair .attr-name a:hover { text-decoration: none; } /* Information icon on some attributes ---------------------------------------------------------------- END */ /* ** Adjustments of product filter ----------------------------------------------------------------------------- START */ /* Filter collector ---------------------------------------------------------------------------------- START */ aside.prdctfltr-widget .prdctfltr_collector { font-size: 16px; } aside.prdctfltr-widget .prdctfltr_collector .prdctfltr_title_remove { /* The cross */ font-size: 20px } aside.prdctfltr-widget .prdctfltr_collector>span { margin-bottom: 1em; } aside.prdctfltr-widget .prdctfltr_collector .prdctfltr_title_selected { /* The small selected collector rectangle */ background-color: #fff; } /* Filter collector ------------------------------------------------------------------------------------ END */ /* Plus minus sign after taxonomy/filter group --------------------------------------------------------- START */ .prdctfltr_widget_title .prdctfltr-down, .prdctfltr_widget_title .prdctfltr-up { opacity: 1; font-size: 1.7em; color: #008000; } .prdctfltr_widget_title .prdctfltr-down, /* Plus */ .prdctfltr_widget_title .prdctfltr-up { /* Minus */ margin-top: -15px; } .prdctfltr_widget_title .prdctfltr-down::before { /* Plus */ /* content: "\271A"; */ content: "\002B"; font-weight: bold !important; } .prdctfltr_widget_title .prdctfltr-up::before { /* Minus */ /* content: "\275A"; */ content: "\2212"; font-weight: bold !important; } /* Plus minus sign after taxonomy/filter group --------------------------------------------------------- END */ /** * Filtering check boxes ------------------------------------------------------------------------------ START **/ #prdctfltr-2>.prdctfltr_woocommerce>.prdctfltr_woocommerce_ordering>.prdctfltr_filter_wrapper>.prdctfltr_filter_inner>.prdctfltr_filter { padding: 10px 15px 0 15px; margin-bottom: 20px; background-color: white; box-shadow: 0 1px 3px -2px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); } .prdctfltr_checkboxes .prdctfltr_sub { margin-left: 15px; } .prdctfltr_checkboxes label { margin-bottom: 0.3em; } /** * Filtering check boxes ------------------------------------------------------------------------------ END **/ /** * Scroll bar ----------------------------------------------------------------------------------------- START **/ .prdctfltr_wc .prdctfltr_filter .mCSB_scrollTools { width: 25px; } .prdctfltr_wc .prdctfltr_filter .mCSB_scrollTools .mCSB_draggerRail, .prdctfltr_wc .prdctfltr_filter .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; } .prdctfltr_wc .prdctfltr_filter .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .prdctfltr_wc .prdctfltr_filter .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar, .prdctfltr_wc .prdctfltr_filter .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .prdctfltr_wc .prdctfltr_filter .mCSB_scrollTools .mCSB_draggerRail, .prdctfltr_wc .prdctfltr_filter .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail, .prdctfltr_wc .prdctfltr_filter .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { width: 8px; } .prdctfltr_wc .prdctfltr_filter .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: rgba(0, 0, 0, 0.2); } .prdctfltr_wc .prdctfltr_filter .mCSB_scrollTools .mCSB_draggerRail { background-color: #ebebeb; } /** * Scroll bar ----------------------------------------------------------------------------------------- END **/ /* Filter slider */ .prdctfltr_add_scroll { padding-bottom: 10px; } /* Removes various elements in the filtering boxes */ .prdctfltr_buttons, .prdctfltr-plus, .prdctfltr_filter .is-divider { display: none; } .prdctfltr_wc .prdctfltr_filter_inner { padding-top: 0.2em; } /* Border under title in filtering box */ .pf-help-title { border-bottom: 1px solid #008000; margin-bottom: 10px; } /* produktfilter, lägger till streck plus fixar space mellan linjen */ .prdctfltr_filter label { font-weight: 300; font-size: 95%; } /* Checkboxes in productfilter -------------------------------------------------------------------- START */ .prdctfltr_wc.prdctfltr_checkbox .prdctfltr_filter label>span:before { width: 18px; height: 18px; border-color: black; box-sizing: border-box; } .prdctfltr_wc.prdctfltr_checkbox .prdctfltr_filter label:hover>span:before { border-width: 2px; } .prdctfltr_wc.prdctfltr_checkbox .prdctfltr_filter label.prdctfltr_active>span:after { font-size: 16px; left: 1px; color: #008000; } /* Checkboxes in productfilter ---------------------------------------------------------------------- END */ /* ** Adjustments of product filter ----------------------------------------------------------------------------- END */ /* I footer - strecket som skiljer mellan rubriken och texten därnere (kan även påverka andra "dividers") */ .dark .is-divider { background-color: #ffffff; opacity: .3; height: 0px; } /* Bort med Out of stock skylten i galleriet */ .product-small.out-of-stock .out-of-stock-label { display: none; } /* h1, h2, h3, h4 { letter-spacing: -0.8px !important; } */ banner h1, h2 { font-weight: 700; } /** * Skicka/send button on contact page. Maybe also somewhere else. nf = Ninja Forms ---------------- START **/ #nf-field-4 { background-color: #dd3333; color: #fff; /* I added this because someone wanted to know how to color the button text. */ } #nf-field-4:hover { background-color: #ae1e1e; } /* Red sale badge/bubble */ .product-small .col-inner .badge-container { margin-top: 7px; } /** * Skicka/send button on contact page. Maybe also somewhere else. nf = Ninja Forms ---------------- END **/ /* #customers -------------------------------------------------------------------------------------- START */ #customers td, #customers th { border: 1px solid #ddd; padding: 8px; } #customers tr:nth-child(even) { background-color: #f2f2f2; } #customers tr:hover { background-color: #ddd; } #customers th { padding-top: 12px; padding-bottom: 12px; text-align: left; background-color: #4CAF50; color: white; } /* #customers -------------------------------------------------------------------------------------- END */ /* Hide price in sidebar "Senast visad" */ .sidebar-wrapper .widget_recently_viewed_products .product_list_widget .wholesale_price_container { display: none !important; } /*****************************************************************************************************************************************/ /*****************************************************************************************************************************************/ @media only screen and (min-width: 850px) { /**********************************************************************************************/ /*****************************************************************************************************************************************/ /********************************************** ADD DESKTOP SCREEN ONLY CSS HERE ********************************************************/ /* Meta information single product page. To get green "you save" sign closer to product price */ .custom-product-page .product_meta { margin-top: -33px; } /** * Compare --------------------------------------------------------------------------------------------------------------------------- START **/ /* Compare button invisible/gone except on elcykel and elcykel-product pages. + next css block. BLOCKS TOGETHER, START-------------*/ /* Compare button all pages (Checkbox + text) */ a.compare.button { display: none; margin-bottom: 0; padding: 3px; padding-left: 1.2em; opacity: 0.7; } /* Compare button invisible/gone except on elcykel and elcykel-product pages. + previous css block */ body.archive a.compare.button, body.single-product a.compare.button { display: inline-block; } /* ------------------------------------------------------------------------------------------------ BLOCKS TOGETHER, END-----------*/ body.archive #main .shop-container a.compare-checkbox-stel.compare.added.button { color: #008000; color: var(--link-color-a); } /* Compare button single product page (Checkbox + text) */ body.single-product a.compare.button { font-size: 0.919em; padding-left: 0; } /* Compare button single product page (Checkbox) */ body.single-product a.compare.button::before, body.single-product a.compare.button:before { margin-left: 0; } /* Compare checkmark "V" single product page */ body.single-product a.compare.button::after, body.single-product a.compare.button:after { left: 2px; top: 13px; } /* Compare button archive page (Checkbox + text) */ a.compare.button { font-size: 0.679em; background-color: transparent; color: #000; border: none; margin-right: 0; font-weight: normal; } /* Compare checkbox */ a.compare.button::before, a.compare.button:before { content: ""; display: inline-block; height: 13px; width: 13px; border: 1px solid; margin-left: 5px; margin-right: 4px; vertical-align: -8%; opacity: 0.7; } #main .shop-container a.compare.button:hover { text-decoration: underline; box-shadow: none; } /* Compare checkmark "V" */ a.compare.button.added::after, a.compare.button.added:after { position: absolute; content: ""; display: inline-block; height: 9px; width: 12px; border-left: 1px solid; border-bottom: 1px solid; transform: rotate(-50deg); color: #006600; left: 20px; top: 7px; opacity: 1; } /* Compare table first column */ table#yith-woocompare-table thead tr th:first-child, table#yith-woocompare-table tbody tr td:first-child { width: 11em; min-width: 11em; max-width: 11em; word-break: break-all; } /* Hide compare button on related products on single product page */ body.single-product .related .compare-button, body.single-product .related .compare.button { display: none; } /* Original/not sale -Price in compare table */ #yith-woocompare-table tr.price del { opacity: 1; } /* Price in compare table */ #yith-woocompare-table tr.price td { font-size: 18px; } /* Product title */ #yith-woocompare-table .product_info h4.product_title { font-weight: 500; } /* Text above compare button */ body.archive #main .product-small .box-text, body.single-product #main .product-small .box-text { padding-bottom: 0.6em; } #yith-woocompare-table .image-wrap img.size-yith-woocompare-image { width: 160px; } #yith-woocompare-table .product_info .image-wrap { display: block; margin-right: auto; margin-left: auto; width: 160px; } #yith-woocompare-related { margin-top: 40px; } #yith-woocompare-related .ralated-product .product-price ins .woocommerce-Price-amount, #yith-woocompare-table .price ins .woocommerce-Price-amount { color: red; } /* Only show the "X" in "X ta bort" */ #yith-woocompare-table .product_info .remove { white-space: nowrap; overflow: hidden; float: right; } #yith-woocompare-table .product_info .remove a { color: transparent; } /* Compare table remove "X" */ #yith-woocompare-table .product_info .remove a>span.remove { color: #777777; } /* Back/forward arrows related products */ #yith-woocompare-related .yith-woocompare-related-wrapper .related-slider-nav div { top: -57px; border: none; } #yith-woocompare-related ul.related-products li.ralated-product .product-price { font-size: 18px; } #yith-woocompare .yith-woocompare-related-wrapper ul.related-products li.ralated-product p.product-title { font-size: 0.9em; font-weight: 400; letter-spacing: normal; line-height: 1.3; } #yith-woocompare .yith-woocompare-related-wrapper ul.related-products li.ralated-product p.product-title:hover { color: #008000; color: var(--link-color-a); } #yith-woocompare-related .yith-woocompare-related-wrapper .owl-carousel .owl-stage .owl-item { padding-left: 0; padding-right: 0; } #yith-woocompare-related .yith-woocompare-related-wrapper ul.related-products .product-image { padding-bottom: 5px; } .compare-header-stel .entry-title { font-size: 36.1667px; font-weight: 900; } /* Remove crap? on top of compare table */ body.stel_compare_tbl_page #yith-woocompare-table_wrapper .dataTables_scroll .dataTables_scrollHead .dataTables_scrollHeadInner .compare-list { display: none; } #yith-woocompare table.compare-list tbody th { background-color: transparent; } #yith-woocompare-related { background-color: #fff; border-radius: 5px; } .stel_compare_tbl_page #yith-woocompare-related .yith-woocompare-related-title { font-size: 24.3167px; text-align: center; padding-top: 24px; padding-bottom: 15px; } #custom_widget_optional_accesories-2 { margin-left: -15px; margin-right: -15px; } #content .normal-title { background-color: transparent; border-top: none; border-bottom: none; } /* Clear all button align center */ #yith-woocompare div.compare-table-clear { text-align: center; } /* Hide buttons */ #yith-woocompare .button, #yith-woocompare-related .yith-woocompare-related-wrapper ul.related-products .button { display: none; } #yith-woocompare .yith_woocompare_clear { display: inline-block; background-color: #DD3333; border-radius: 0; padding: 10px 8px; } #yith-woocompare-table tr:not(:first-child) { font-weight: normal; } #yith-woocompare-table .remove { text-align: right; } body.stel_compare_tbl_page #yith-woocompare-table tbody tr:first-child th { border-radius: 5px 0 0 0; } body.stel_compare_tbl_page #yith-woocompare-table tbody tr:first-child td:last-child { border-radius: 0 5px 0 0; } body.stel_compare_tbl_page #yith-woocompare-table tbody tr:last-child th { border-radius: 0 0 0 5px; } body.stel_compare_tbl_page #yith-woocompare-table tbody tr:last-child td:last-child { border-radius: 0 0 5px 0; } body.stel_compare_tbl_page #yith-woocompare-table tbody tr td, body.stel_compare_tbl_page #yith-woocompare-table tbody tr th { background-color: white; } body.stel_compare_tbl_page #yith-woocompare-table tbody tr { background-color: transparent; } .related-slider-nav .related-slider-nav-prev, .related-slider-nav .related-slider-nav-next { margin-right: 10px; } /** * Compare ---------------------------------------------------------------------------------------------------------------------- END **/ /** * Flickity thumbnails on product page. Below main product ------------------------------------------- START **/ /* Stop thumnail animation up/down */ body.single-product .product-thumbnails a:hover img, .product-thumbnails .is-nav-selected a img { transform: translateY(0px); } body.single-product .thumbnails .flickity-viewport .flickity-slider .col { width: unset; } body.single-product .thumbnails .flickity-viewport .flickity-slider .col img { width: 91px; height: 61px; margin-bottom: 0; } body.single-product .flickity-viewport { height: 60px; } /* Left/right arrows */ body.single-product .thumbnails button.flickity-button.flickity-prev-next-button { visibility: hidden; } body.single-product .flickity-viewport .flickity-slider .col:nth-child(2) { left: 105px !important; } body.single-product .flickity-viewport .flickity-slider .col:nth-child(3) { left: 210px !important; } body.single-product .flickity-viewport .flickity-slider .col:nth-child(4) { left: 315px !important; } body.single-product .flickity-viewport .flickity-slider .col:nth-child(5) { left: 420px !important; } body.single-product .flickity-viewport .flickity-slider .col:nth-child(6) { left: 525px !important; } body.single-product .flickity-viewport .flickity-slider .col:nth-child(7) { left: 630px !important; } body.single-product .flickity-viewport .flickity-slider .col:nth-child(8) { left: 735px !important; } body.single-product .flickity-viewport .flickity-slider .col:nth-child(9) { left: 840px !important; } body.single-product .flickity-viewport .flickity-slider .col:nth-child(10) { left: 945px !important; } /** * Flickity thumbnails on product page. Below main product -------------------------------------------- END **/ /** * Filtering check boxes -------------------------------------------------------------------------------- START **/ .prdctfltr_woocommerce>.prdctfltr_woocommerce_ordering>.prdctfltr_filter_wrapper>.prdctfltr_filter_inner>.prdctfltr_filter { padding: 10px 10px 0 14px; } .prdctfltr_wc.prdctfltr_checkbox .prdctfltr_filter label>span::before { width: 15px; height: 15px; } .prdctfltr_wc.prdctfltr_checkbox .prdctfltr_filter label>span::before { margin-right: 6px; } /** * Filtering check boxes -------------------------------------------------------------------------------- END **/ /* body.archive #shop-sidebar.col-inner { */ body.archive #shop-sidebar.sidebar-inner { margin-right: -10px; } body.archive .large-3 { padding-left: 0; } /* Sublinks in menu */ .nav-column li>a, .nav-dropdown>li>a { padding: 5px 20px; } /* Keep header links black */ #wrapper .header:not(.transparent) .header-bottom-nav.nav>li>a:hover, #wrapper .header:not(.transparent) .header-bottom-nav.nav>li.active>a, #wrapper .header:not(.transparent) .header-bottom-nav.nav>li.current>a, #wrapper .header:not(.transparent) .header-bottom-nav.nav>li>a.active, #wrapper .header:not(.transparent) .header-bottom-nav.nav>li>a.current, #wrapper .header:not(.transparent) .header-bottom-nav.nav>li>a { color: #000 } /** * Menu links mouse over grow/shrink width animation -------------------------------------------------- START **/ #header .nav-line-bottom>li:hover>a::before, #header .nav-line-grow>li:hover>a::before, #header .nav-line-bottom>li.active>a::before, #header .nav-line-grow>li.active>a::before, #header .nav-line>li.active>a::before, #header .nav-line>li:hover>a::before { width: 100%; } #header .nav-line-bottom>li>a::before, #header .nav-line-grow>li>a::before, #header .nav-line>li>a::before { opacity: 1; width: 0%; transition: all 0.4s; height: 2px; } #header .header-bottom-nav.nav-line-bottom>li>a::before, #header .header-bottom-nav.nav-line-grow>li>a::before, #header .header-bottom-nav.nav-line>li>a::before, #header .header-bottom-nav.nav-box>li>a:hover, #header .header-bottom-nav.nav-box>li.active>a, #header .header-bottom-nav.nav-pills>li>a:hover, #header .header-bottom-nav.nav-pills>li.active>a { color: #008000; background-color: var(--link-color-a); } .nav-line-bottom>li>a::before { bottom: 3px; } /** * Menu links mouse over grow/shrink width animation -------------------------------------------------- END **/ /* Sublinks menu */ .menu-item .nav-dropdown>li>a { color: #000; background-color: #ffffff; } /* Links in "Varumärke" tab */ .woocommerce-tabs .tab-panels #tab-pwb_tab #tab-pwb_tab-content div .row .col .col-inner a { color: #008000; color: var(--link-color-a); } /** * Search input text field ----------------------------------------------------------------------------- START **/ /* div.asp_m.ajaxsearchpro .probox .proinput */ .header-inner .header-nav .ajaxsearchpro .probox .proinput { width: 400px; } /* Normal text input */ .flex-col .header-nav .html .asp_w .probox .proinput form .orig { font-size: 16px !important; } /* Placeholder text */ /* The placeholder attribute specifies a short hint that describes the expected value of an input field (e.g. a sample value or a short description of the expected format). The short hint is displayed in the input field before the user enters a value */ .flex-col .header-nav .html .asp_w .probox .proinput form .orig::-webkit-input-placeholder { font-family: "Roboto", sans-serif !important; font-size: 16px !important; color: #666666 !important; } /* Placeholder text */ .flex-col .header-nav .html .asp_w .probox .proinput form .orig:-ms-input-placeholder { font-family: "Roboto", sans-serif !important; font-size: 16px !important; color: #666666 !important; } /* Placeholder text*/ .flex-col .header-nav .html .asp_w .probox .proinput form .orig::-moz-placeholder { /* Firefox 19+ */ font-family: "Roboto", sans-serif !important; font-size: 16px !important; color: #666666 !important; } /* Placeholder text*/ .flex-col .header-nav .html .asp_w .probox .proinput form .orig:-moz-placeholder { /* Firefox 18- */ font-family: "Roboto", sans-serif !important; font-size: 16px !important; color: #666666 !important; } /* Autocomplete text*/ /* The autocomplete allows the browser to predict the value. When a user starts to type in a field, the browser should display options to fill in the field, based on earlier typed values. */ .flex-col .header-nav .html .asp_w .probox .proinput form .autocomplete { font-size: 16px !important; color: #666666 !important; } /** * Search input text field ----------------------------------------------------------------------------- END **/ /** ******************************************************************************************** * Ajax Search Pro search results dropdown. Stel 19-02-06. ************************** START *** **/ /******************************************************************************************/ /* Hide the mobile search text field */ .mfp-wrap .mfp-container .mfp-content #main-menu .sidebar-menu { visibility: hidden; } /* Hide the scrollbar */ .asp_simplebar-scrollbar, #mCSBap_1_scrollbar_vertical, #mCSBap_2_scrollbar_vertical, #mCSBap_3_scrollbar_vertical, #mCSBap_4_scrollbar_vertical, #mCSBap_8_scrollbar_vertical { display: none !important; } div.asp_w.ajaxsearchpro .asp_simplebar-content { margin-right: 0; } /* Results dropdown area */ body div.asp_r.ajaxsearchpro.vertical { margin-left: -227px !important; width: 854px !important; background-color: #fff !important; border-radius: 5px !important; } body div.asp_r.ajaxsearchpro.vertical>.results { max-height: 404px !important; padding-top: 15px; } /* First result image */ div.item:nth-child(1)>div:nth-child(1)>a:nth-child(1)>div:nth-child(1) { width: 200px !important; height: 134px !important; margin: 3px 30px 3px 0 !important; } /* Result 2, 3, 4 and 5 image */ div.item:nth-child(2)>div:nth-child(1)>a:nth-child(1)>div:nth-child(1), div.item:nth-child(3)>div:nth-child(1)>a:nth-child(1)>div:nth-child(1), div.item:nth-child(4)>div:nth-child(1)>a:nth-child(1)>div:nth-child(1), div.item:nth-child(5)>div:nth-child(1)>a:nth-child(1)>div:nth-child(1) { width: 100px !important; height: 67px !important; margin: 3px 20px 3px 0 !important; } /* All results */ div.item:nth-child(1), div.item:nth-child(2), div.item:nth-child(3), div.item:nth-child(4), div.item:nth-child(5) { border-radius: 5px !important; } /* All results background not hovered */ #ajaxsearchprores1_1 .results .resdrg div.item, #ajaxsearchprores4_1 .results .resdrg div.item, #ajaxsearchprores5_1 .results .resdrg div.item, #ajaxsearchprores6_1 .results .resdrg div.item, #ajaxsearchprores8_1 .results .resdrg div.item, #ajaxsearchprores9_1 .results .resdrg div.item { background: #f3f3f3; } /* All results background hovered */ #ajaxsearchprores1_1 .results .resdrg div.item:hover, #ajaxsearchprores4_1 .results .resdrg div.item:hover, #ajaxsearchprores5_1 .results .resdrg div.item:hover, #ajaxsearchprores6_1 .results .resdrg div.item:hover, #ajaxsearchprores8_1 .results .resdrg div.item:hover, #ajaxsearchprores9_1 .results .resdrg div.item:hover { background: #e6e6e6; } /* First result */ .results .asp_simplebar-wrapper .asp_simplebar-content .resdrg div.item:nth-child(1) { margin-top: 2px; margin-left: 16px; margin-right: 16px; margin-bottom: 17px; } /* Results search word highlighted */ .asp_simplebar-content .resdrg .item h3 .highlighted { font-weight: 900; } /* First result title */ #ajaxsearchprores1_1 .results .asp_simplebar-content .resdrg .asp_r_pagepost .asp_content:nth-child(1) h3 .asp_res_url, #ajaxsearchprores1_2 .results .asp_simplebar-content .resdrg .asp_r_pagepost .asp_content:nth-child(1) h3 .asp_res_url, #ajaxsearchprores4_1 .results .asp_simplebar-content .resdrg .asp_r_pagepost .asp_content:nth-child(1) h3 .asp_res_url, #ajaxsearchprores4_2 .results .asp_simplebar-content .resdrg .asp_r_pagepost .asp_content:nth-child(1) h3 .asp_res_url, #ajaxsearchprores5_1 .results .asp_simplebar-content .resdrg .asp_r_pagepost .asp_content:nth-child(1) h3 .asp_res_url, #ajaxsearchprores5_2 .results .asp_simplebar-content .resdrg .asp_r_pagepost .asp_content:nth-child(1) h3 .asp_res_url, #ajaxsearchprores6_1 .results .asp_simplebar-content .resdrg .asp_r_pagepost .asp_content:nth-child(1) h3 .asp_res_url, #ajaxsearchprores6_2 .results .asp_simplebar-content .resdrg .asp_r_pagepost .asp_content:nth-child(1) h3 .asp_res_url, #ajaxsearchprores8_1 .results .asp_simplebar-content .resdrg .asp_r_pagepost .asp_content:nth-child(1) h3 .asp_res_url, #ajaxsearchprores8_2 .results .asp_simplebar-content .resdrg .asp_r_pagepost .asp_content:nth-child(1) h3 .asp_res_url, #ajaxsearchprores8_2 .results .asp_simplebar-content .resdrg .asp_r_pagepost .asp_content:nth-child(1) h3 .asp_res_url { font-size: 26px; font-weight: normal; color: #000; } /* First result lower text line */ .results .asp_simplebar-content .resdrg .item:nth-child(1) .asp_content .asp_res_text, .results .asp_simplebar-content .resdrg .item:nth-child(1) .asp_content .asp_res_text .wholesale_price_title, .results .asp_simplebar-content .resdrg .item:nth-child(1) .asp_content .asp_res_text .woocommerce-price-suffix { font-size: 30px; font-weight: normal; } /* Results 2, 3, 4 and 5 lower text line */ .results .asp_simplebar-content .resdrg .item:nth-child(2) .asp_content .asp_res_text, .results .asp_simplebar-content .resdrg .item:nth-child(3) .asp_content .asp_res_text, .results .asp_simplebar-content .resdrg .item:nth-child(4) .asp_content .asp_res_text, .results .asp_simplebar-content .resdrg .item:nth-child(5) .asp_content .asp_res_text, .results .asp_simplebar-content .resdrg .item:nth-child(2) .asp_content .asp_res_text .wholesale_price_title, .results .asp_simplebar-content .resdrg .item:nth-child(3) .asp_content .asp_res_text .wholesale_price_title, .results .asp_simplebar-content .resdrg .item:nth-child(4) .asp_content .asp_res_text .wholesale_price_title, .results .asp_simplebar-content .resdrg .item:nth-child(5) .asp_content .asp_res_text .wholesale_price_title, .results .asp_simplebar-content .resdrg .item:nth-child(2) .asp_content .asp_res_text .woocommerce-price-suffix, .results .asp_simplebar-content .resdrg .item:nth-child(3) .asp_content .asp_res_text .woocommerce-price-suffix, .results .asp_simplebar-content .resdrg .item:nth-child(4) .asp_content .asp_res_text .woocommerce-price-suffix, .results .asp_simplebar-content .resdrg .item:nth-child(5) .asp_content .asp_res_text .woocommerce-price-suffix { font-size: 16px; font-weight: normal; } /* First result red price. Stel 19-02-12 */ .results .asp_simplebar-content .resdrg .asp_r_pagepost .asp_content .asp_res_text ins .woocommerce-Price-amount { color: red; } /* GB. First result price, default color. Stel 19-02-12 */ /*.results .asp_simplebar-content .resdrg .asp_r_pagepost .asp_content .asp_res_text ins .woocommerce-Price-amount{ color: unset; }*/ /* Ordinary (not red) price */ .results .asp_simplebar-content .resdrg .asp_r_pagepost .asp_content .asp_res_text del { text-decoration: line-through; } /* First result title (h3) position */ #ajaxsearchprores1_1 div.item:nth-child(1)>div:nth-child(1)>h3:nth-child(2), #ajaxsearchprores4_1 div.item:nth-child(1)>div:nth-child(1)>h3:nth-child(2), #ajaxsearchprores5_1 div.item:nth-child(1)>div:nth-child(1)>h3:nth-child(2), #ajaxsearchprores6_1 div.item:nth-child(1)>div:nth-child(1)>h3:nth-child(2), #ajaxsearchprores8_1 div.item:nth-child(1)>div:nth-child(1)>h3:nth-child(2), #ajaxsearchprores9_1 div.item:nth-child(1)>div:nth-child(1)>h3:nth-child(2) { display: block; margin-left: 225px; margin-top: 25px; } /* First result price position */ #ajaxsearchprores1_1 div.item:nth-child(1)>div:nth-child(1)>div:nth-child(4), #ajaxsearchprores4_1 div.item:nth-child(1)>div:nth-child(1)>div:nth-child(4), #ajaxsearchprores4_1 div.item:nth-child(1)>div:nth-child(1)>div:nth-child(4), #ajaxsearchprores5_1 div.item:nth-child(1)>div:nth-child(1)>div:nth-child(4), #ajaxsearchprores6_1 div.item:nth-child(1)>div:nth-child(1)>div:nth-child(4), #ajaxsearchprores8_1 div.item:nth-child(1)>div:nth-child(1)>div:nth-child(4), #ajaxsearchprores9_1 div.item:nth-child(1)>div:nth-child(1)>div:nth-child(4) { margin-top: 20px; } /* Result titles 2, 3, 4 and 5 */ #ajaxsearchprores1_1 .results .asp_simplebar-content .resdrg div.item:nth-child(2)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1), #ajaxsearchprores1_1 .results .asp_simplebar-content .resdrg div.item:nth-child(3)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1), #ajaxsearchprores1_1 .results .asp_simplebar-content .resdrg div.item:nth-child(4)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1), #ajaxsearchprores1_1 .results .asp_simplebar-content .resdrg div.item:nth-child(5)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1), #ajaxsearchprores4_1 .results .asp_simplebar-content .resdrg div.item:nth-child(2)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1), #ajaxsearchprores4_1 .results .asp_simplebar-content .resdrg div.item:nth-child(3)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1), #ajaxsearchprores4_1 .results .asp_simplebar-content .resdrg div.item:nth-child(4)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1), #ajaxsearchprores4_1 .results .asp_simplebar-content .resdrg div.item:nth-child(5)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1), #ajaxsearchprores5_1 .results .asp_simplebar-content .resdrg div.item:nth-child(2)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1), #ajaxsearchprores5_1 .results .asp_simplebar-content .resdrg div.item:nth-child(3)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1), #ajaxsearchprores5_1 .results .asp_simplebar-content .resdrg div.item:nth-child(4)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1), #ajaxsearchprores5_1 .results .asp_simplebar-content .resdrg div.item:nth-child(5)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1), #ajaxsearchprores6_1 .results .asp_simplebar-content .resdrg div.item:nth-child(2)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1), #ajaxsearchprores6_1 .results .asp_simplebar-content .resdrg div.item:nth-child(3)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1), #ajaxsearchprores6_1 .results .asp_simplebar-content .resdrg div.item:nth-child(4)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1), #ajaxsearchprores6_1 .results .asp_simplebar-content .resdrg div.item:nth-child(5)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1), #ajaxsearchprores8_1 .results .asp_simplebar-content .resdrg div.item:nth-child(2)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1), #ajaxsearchprores8_1 .results .asp_simplebar-content .resdrg div.item:nth-child(3)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1), #ajaxsearchprores8_1 .results .asp_simplebar-content .resdrg div.item:nth-child(4)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1), #ajaxsearchprores8_1 .results .asp_simplebar-content .resdrg div.item:nth-child(5)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1), #ajaxsearchprores9_1 .results .asp_simplebar-content .resdrg div.item:nth-child(2)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1), #ajaxsearchprores9_1 .results .asp_simplebar-content .resdrg div.item:nth-child(3)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1), #ajaxsearchprores9_1 .results .asp_simplebar-content .resdrg div.item:nth-child(4)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1), #ajaxsearchprores9_1 .results .asp_simplebar-content .resdrg div.item:nth-child(5)>div:nth-child(1)>h3:nth-child(2)>a:nth-child(1) { font-size: 14px; line-height: normal; } /* Result prices 2, 3, 4 and 5 */ div.item:nth-child(2)>div:nth-child(1)>div:nth-child(4) .woocommerce-Price-amount, div.item:nth-child(3)>div:nth-child(1)>div:nth-child(4) .woocommerce-Price-amount, div.item:nth-child(4)>div:nth-child(1)>div:nth-child(4) .woocommerce-Price-amount, div.item:nth-child(2)>div:nth-child(1)>div:nth-child(4) .woocommerce-Price-amount { font-size: 16px; } /* Results 2, 3, 4 and 5 */ #ajaxsearchprores1_1 .results .asp_simplebar-content .resdrg div.item:nth-child(2), #ajaxsearchprores1_1 .results .asp_simplebar-content .resdrg div.item:nth-child(3), #ajaxsearchprores1_1 .results .asp_simplebar-content .resdrg div.item:nth-child(4), #ajaxsearchprores1_1 .results .asp_simplebar-content .resdrg div.item:nth-child(5), #ajaxsearchprores4_1 .results .asp_simplebar-content .resdrg div.item:nth-child(2), #ajaxsearchprores4_1 .results .asp_simplebar-content .resdrg div.item:nth-child(3), #ajaxsearchprores4_1 .results .asp_simplebar-content .resdrg div.item:nth-child(4), #ajaxsearchprores4_1 .results .asp_simplebar-content .resdrg div.item:nth-child(5), #ajaxsearchprores5_1 .results .asp_simplebar-content .resdrg div.item:nth-child(2), #ajaxsearchprores5_1 .results .asp_simplebar-content .resdrg div.item:nth-child(3), #ajaxsearchprores5_1 .results .asp_simplebar-content .resdrg div.item:nth-child(4), #ajaxsearchprores5_1 .results .asp_simplebar-content .resdrg div.item:nth-child(5), #ajaxsearchprores6_1 .results .asp_simplebar-content .resdrg div.item:nth-child(2), #ajaxsearchprores6_1 .results .asp_simplebar-content .resdrg div.item:nth-child(3), #ajaxsearchprores6_1 .results .asp_simplebar-content .resdrg div.item:nth-child(4), #ajaxsearchprores6_1 .results .asp_simplebar-content .resdrg div.item:nth-child(5), #ajaxsearchprores8_1 .results .asp_simplebar-content .resdrg div.item:nth-child(2), #ajaxsearchprores8_1 .results .asp_simplebar-content .resdrg div.item:nth-child(3), #ajaxsearchprores8_1 .results .asp_simplebar-content .resdrg div.item:nth-child(4), #ajaxsearchprores8_1 .results .asp_simplebar-content .resdrg div.item:nth-child(5), #ajaxsearchprores9_1 .results .asp_simplebar-content .resdrg div.item:nth-child(2), #ajaxsearchprores9_1 .results .asp_simplebar-content .resdrg div.item:nth-child(3), #ajaxsearchprores9_1 .results .asp_simplebar-content .resdrg div.item:nth-child(4), #ajaxsearchprores9_1 .results .asp_simplebar-content .resdrg div.item:nth-child(5) { width: 395px; margin-bottom: 18px; } /* Results 2 and 4 */ #ajaxsearchprores1_1 .results .asp_simplebar-content .resdrg div.item:nth-child(2), #ajaxsearchprores1_1 .results .asp_simplebar-content .resdrg div.item:nth-child(4) #ajaxsearchprores4_1 .results .asp_simplebar-content .resdrg div.item:nth-child(2), #ajaxsearchprores4_1 .results .asp_simplebar-content .resdrg div.item:nth-child(4), #ajaxsearchprores5_1 .results .asp_simplebar-content .resdrg div.item:nth-child(2), #ajaxsearchprores5_1 .results .asp_simplebar-content .resdrg div.item:nth-child(4), #ajaxsearchprores6_1 .results .asp_simplebar-content .resdrg div.item:nth-child(2), #ajaxsearchprores6_1 .results .asp_simplebar-content .resdrg div.item:nth-child(4), #ajaxsearchprores8_1 .results .asp_simplebar-content .resdrg div.item:nth-child(2), #ajaxsearchprores8_1 .results .asp_simplebar-content .resdrg div.item:nth-child(4), #ajaxsearchprores9_1 .results .asp_simplebar-content .resdrg div.item:nth-child(2), #ajaxsearchprores9_1 .results .asp_simplebar-content .resdrg div.item:nth-child(4) { margin-left: 16px; } /* Results 3 and 5 */ #ajaxsearchprores1_1 .results .asp_simplebar-content .resdrg div.item:nth-child(3), #ajaxsearchprores1_1 .results .asp_simplebar-content .resdrg div.item:nth-child(5), #ajaxsearchprores4_1 .results .asp_simplebar-content .resdrg div.item:nth-child(3), #ajaxsearchprores4_1 .results .asp_simplebar-content .resdrg div.item:nth-child(5), #ajaxsearchprores5_1 .results .asp_simplebar-content .resdrg div.item:nth-child(3), #ajaxsearchprores5_1 .results .asp_simplebar-content .resdrg div.item:nth-child(5), #ajaxsearchprores6_1 .results .asp_simplebar-content .resdrg div.item:nth-child(3), #ajaxsearchprores6_1 .results .asp_simplebar-content .resdrg div.item:nth-child(5), #ajaxsearchprores8_1 .results .asp_simplebar-content .resdrg div.item:nth-child(3), #ajaxsearchprores8_1 .results .asp_simplebar-content .resdrg div.item:nth-child(5), #ajaxsearchprores9_1 .results .asp_simplebar-content .resdrg div.item:nth-child(3), #ajaxsearchprores9_1 .results .asp_simplebar-content .resdrg div.item:nth-child(5) { margin-left: 430px; margin-top: -110px; } /* "Show more/se alla resultat"-link */ #ajaxsearchprores1_1 .asp_showmore_container .asp_showmore, #ajaxsearchprores4_1 .asp_showmore_container .asp_showmore, #ajaxsearchprores5_1 .asp_showmore_container .asp_showmore, #ajaxsearchprores6_1 .asp_showmore_container .asp_showmore, #ajaxsearchprores8_1 .asp_showmore_container .asp_showmore, #ajaxsearchprores9_1 .asp_showmore_container .asp_showmore { color: #000; text-transform: uppercase; font-size: 18px; padding-bottom: 17px; padding-top: 0px; } /* Search results "Show more" hover */ div#ajaxsearchprores1_1 div.asp_showmore_container p.showmore a.asp_showmore:hover, div#ajaxsearchprores4_1 div.asp_showmore_container p.showmore a.asp_showmore:hover, div#ajaxsearchprores5_1 div.asp_showmore_container p.showmore a.asp_showmore:hover, div#ajaxsearchprores6_1 div.asp_showmore_container p.showmore a.asp_showmore:hover, div#ajaxsearchprores8_1 div.asp_showmore_container p.showmore a.asp_showmore:hover, div#ajaxsearchprores9_1 div.asp_showmore_container p.showmore a.asp_showmore:hover { text-decoration: underline; } /* Search results hide scrow bar */ div.asp_w.ajaxsearchpro .mCSBap_scrollTools .mCSBap_buttonUp+.mCSBap_draggerContainer { display: none; } /** ******************************************************************************************** * Ajax Search Pro search results dropdown. Stel 19-02-06. **************************** END *** **/ /******************************************************************************************/ } /* Custom optional accessories widget, "PASSANDE TILLBEHÖR" ------------------------------------------------------------------------ START */ aside.widget_custom_widget_optional_accesories { margin-bottom: 0; } aside.widget_custom_widget_optional_accesories h2 { font-size: 1em; font-weight: 400 !important; text-transform: uppercase; line-height: 1.05; letter-spacing: .05em !important; } aside.widget_custom_widget_optional_accesories div.product-small { min-width: 49%; padding-left: 0; padding-right: 0; margin-bottom: 0; } aside.widget_custom_widget_optional_accesories div.product-small .box-text { padding-left: 0.5em; padding-right: 0.5em; } aside.widget_custom_widget_optional_accesories .col-inner:hover { box-shadow: none; } /* Hide on products in sidebar "PASSANDE TILLBEHÖR" */ .optional-accessories.products .box-text-products .title-wrapper { display: none; } .optional-accessories.products>.products>.product-small { padding-bottom: 0; } aside.widget_custom_widget_optional_accesories .optional-accessories.products>.products>.product-small { padding-bottom: 5px !important; } .sidebar-wrapper #custom_widget_optional_accesories-2 { margin-left: -10px; margin-right: -15px; } #custom_widget_optional_accesories-2 .optional-accessories.products .wholesale_price_title { font-size: 13px; display: block; /* Line break after "Ca Brutto:" */ } /* The price */ .optional-accessories.products .price-wrapper>.price .woocommerce-Price-amount, .optional-accessories.products .price-wrapper>.price .woocommerce-Price-amount>.woocommerce-Price-currencySymbol, .optional-accessories.products .price-wrapper>.price .woocommerce-price-suffix { font-size: 17px; font-weight: bold; } .optional-accessories.products .price-wrapper>.price>del>.woocommerce-Price-amount, .optional-accessories.products .price-wrapper>.price>del>.woocommerce-Price-amount>.woocommerce-Price-currencySymbol, .optional-accessories.products .price-wrapper>.price>del>.woocommerce-price-suffix { font-weight: normal; } /* You save */ aside.widget_custom_widget_optional_accesories .you-save-wrapper { margin-top: -5px; } aside.widget_custom_widget_optional_accesories .you-save-wrapper .you-save { border-radius: 3px; font-size: 15px; padding: 2px 2px 2px 2px; } aside.widget_custom_widget_optional_accesories .product-small .badge-container { margin-top: 0px; } aside.widget_custom_widget_optional_accesories .badge-container .badge-circle { font-size: 75%; } aside.widget_custom_widget_optional_accesories div.product-small { max-width: 100%; margin-bottom: 0; } /* Custom optional accessories widget, "PASSANDE TILLBEHÖR" -------------------------------------------------------------------------- END */ /********************************************************************************************************************************************/ /********************************************************************************************************************************************/ @media only screen and (max-width: 849px) { /************************************************************************************************/ /************************************************ ADD MOBILE/TABLET ONLY CSS HERE **********************************************************/ /********************************************************************************************************************************************/ /** * Both mobile and tablet have the same style. Stefan Elmgren 19-02-19 **/ /* Thumbnail slider below main image */ .product-thumbnails .flickity-viewport { height: 60px !important; } /** * Customised attribute tab ------------------------------------------------------------------------------- START **/ #stel-attributes-tab { margin-left: -20px; margin-right: -20px; } #stel-attributes-tab .attribute-group { -webkit-columns: 1 7px; -moz-columns: 1 7px; columns: 1 7px; -webkit-column-gap: 1em; -moz-column-gap: 1em; column-gap: 1em; } /** * Customised attribute tab ------------------------------------------------------------------------------- END **/ /* Hide compare button(s) on all mobile/desktop pages */ .compare-button, .compare.button { display: none; } /* * Product page thumbnails/miljöbilder --------------------------------------------------------------------- START */ body.single-product .thumbnails .flickity-viewport .flickity-slider .col img { margin-bottom: 0; } /* Stop thumnail animation up/down */ body.single-product .product-thumbnails a:hover img, .product-thumbnails .is-nav-selected a img { transform: translateY(0px); } /* * Product page thumbnails/miljöbilder --------------------------------------------------------------------- END */ /* Compare button */ a.compare.button { font-size: 0.7em; overflow: hidden; white-space: nowrap; } /* Compare checkmark, not Firefox*/ a.compare.button.added::after, a.compare.button.added::after { top: 6px; } /* Compare checkmark, Firefox */ @-moz-document url-prefix() { a.compare.button.added::after, a.compare.button.added::after { top: 10px; } } /** * Product filter tablet/mobile ---------------------------------------------------------------------- START **/ body.archive .prdctfltr_filter span.widget-title { font-size: 1.25em; } body.archive .prdctfltr_wc.prdctfltr_checkbox .prdctfltr_filter label>span:before { width: 22px; height: 22px; border-color: black; box-sizing: border-box; } body.archive .prdctfltr_filter label { font-size: 107%; } /* The ticked V */ body.archive .prdctfltr_wc.prdctfltr_checkbox .prdctfltr_filter label.prdctfltr_active>span::after { font-size: 22px; left: 0; top: 3px; } body.archive .prdctfltr_checkboxes .prdctfltr_sub { margin-left: 21px; } body.archive #shop-sidebar { padding: 30px 10px; } body.archive #prdctfltr-2>.prdctfltr_woocommerce>.prdctfltr_woocommerce_ordering>.prdctfltr_filter_wrapper>.prdctfltr_filter_inner>.prdctfltr_filter { margin-bottom: 40px !important; } /** * Product filter tablet/mobile ---------------------------------------------------------------------- END **/ /* No horizontal scroll */ html, body { max-width: 100%; overflow-x: hidden; } /** * Accept cookie ------------------------------------------------------------------------------------------ START **/ #cookie-notice { padding-bottom: 60px; } #cn-notice-text { padding-top: 10px; } /** * Accept cookie ------------------------------------------------------------------------------------------ END **/ /** * Rea mobile --------------------------------------------------------------------------------------------- START **/ body.page-id-336 .col .col-inner .section_rea_txt_stel { padding-left: 0; padding-right: 0; } body.page-id-336 .section_rea_txt_stel .section-content .row_rea_txt_stel .col .col-inner { padding: 25px 12px 25px 12px !important; } body.page-id-336 .row_rea_txt_stel>.col>.col-inner { margin-left: -7px; margin-right: -7px; } body.page-id-336 #content .row .col { padding: 0 14px 30px; } /** * Rea mobile --------------------------------------------------------------------------------------------- END **/ /** * Shipping page, mobile ---------------------------------------------------------------------------------- START **/ .column_shipping_stel { padding: 0 7px 30px; } .column_shipping_stel>.col-inner { padding-left: 12px; padding-right: 12px; } /** * Shipping page, mobile ---------------------------------------------------------------------------------- END **/ /** * Cart and Filter on mobile ----------------------------------------------------------------------------- START **/ .mfp-wrap .mfp-container .mfp-content { vertical-align: top; width: 100%; } .off-canvas-right.mfp-ready .mfp-content, .mfp-container .mfp-content, .mfp-bg.mfp-ready { opacity: 1; } /** * Cart and Filter on mobile ----------------------------------------------------------------------------- END **/ /* Close X */ .mfp-wrap .mfp-close { font-size: 50px; font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; opacity: 0.7; } .mfp-bg, #cart-popup { background: #fff; } /** * Liknande produkter/related products on product page ------------------------------------------------------ START **/ .custom-product-page>.section>.section-content>.row>.col { padding: 0 0px 30px !important; } .section .section-content .row .col .col-inner .product-section { border-top: none; } .custom-product-page .section .section-content .row .col .col-inner { /* padding: 0; */ padding: 0px 10px 0px 10px; } .section .section-content.relative .row .col .col-inner .related-products-wrapper .row { margin-left: -30px; margin-right: -30px; } .section .section-content.relative .row .col .col-inner .related-products-wrapper .row .product-small .col-inner { padding: 0px 1px 0px 1px; } /* Sale bubble related products */ .related-products-wrapper .product-small .col-inner .badge-container { margin-left: 10px; } .col .col-inner .related-products-wrapper .row .product-small { padding: 0 !important; } .product .custom-product-page .row .col { padding: 0 7px 30px !important; } .shop-container .product .custom-product-page .woocommerce-tabs { padding-left: 7px; padding-right: 7px; } /* Bread crumbs */ .page-title-inner>.flex-col>.is-medium { text-align: left !important; } .page-title-inner>.flex-col>.category-filtering { font-size: 1.2em; } #wrapper .page-title-inner { padding-top: 17px; } .page-title-inner .category-filter-row { padding: 1px 0 3px 0; } aside.widget_custom_widget_optional_accesories .you-save-wrapper .you-save { font-size: 17px; } /** * Liknande produkter/related products on product page ------------------------------------------------------ END **/ /** * Filtering sorting. Also see javascript. Stel 19-03-13 ---------------------------------------------------- START **/ .woocommerce-ordering>.orderby { text-align: center !important; } /* Ordering */ .shop-page-title .medium-flex-wrap .flex-col { padding-top: 2px; } select.orderby { height: 38px; font-size: 110%; } .flex-col>.woocommerce-ordering { margin-left: 5px; } .medium-flex-wrap .flex-col { padding-left: 5px; } #main>.category-page-row { padding-top: 0; } /** * Filtering sorting. Also see javascript. Stel 19-03-13 ---------------------------------------------------- END **/ /** * Tillbehör on product page ------------------------------------------------------------------------------- START **/ body.single-product .custom-product-page .row-collapse .col .col-inner .woocommerce .products .product-small { padding: 0 9px 7px 9px !important; } body.single-product #main .shop-container .product .row-collapse .col .col-inner { padding: 24px 1px 0px 1px; } body.single-product #main .shop-container .product .row-collapse .col .col-inner .product-small .box-image img { padding-left: 0.2em; padding-right: 0.2em; padding-top: 0.2em; } body.single-product .col .col-inner .woocommerce .products .product-small .col-inner .product-small .box-text-products { padding-left: 0px; padding-right: 0px; } .product-small .box-text-products .price-wrapper span.price { margin: 0; } /** * Tillbehör on product page ------------------------------------------------------------------------------- END **/ /** * Varumärke tab ------------------------------------------------------------------------------------------- START **/ div#tab-pwb_tab-content>div>.row { margin-left: -30px; margin-right: -30px; } div#tab-pwb_tab-content>div>.row>.col>.col-inner { padding: 25px 7px 25px 7px; } /** * Varumärke tab ------------------------------------------------------------------------------------------- END **/ /* Description/Beskrivning tab */ .woocommerce-tabs .tab-panels #tab-description { margin-left: -20px; margin-right: -20px; } /** * Padding small white product boxes. Stel 19-03-08 -------------------------------------------------------- START * All pages in .../kategori/... * (Some pages are padded in custom_script.js) **/ #main>.category-page-row>.col { padding: 14px 16px; } .row-small>.product-small { padding: 0 4px 19.6px 5px; } .products>.product-small>.col-inner>.product-small>.box-text { padding-left: 7px; padding-right: 3px; } /** * Padding small white product boxes. Stel 19-03-08 -------------------------------------------------------- END **/ /** * Product page -------------------------------------------------------------------------------------------- START **/ .shop-container>.product>.custom-product-page>.section { padding: 7px; } .woocommerce-product-gallery>.badge-container { margin: 2% 0 0 0; padding-left: 6px; } .col>.woocommerce-product-gallery>.badge-container>.badge-circle { height: 13vw; width: 13vw; } .product>.custom-product-page .woocommerce-product-gallery .badge-circle .onsale { font-size: 4vw; } .product-price-container.is-xxlarge { font-size: 1.5em; } .product-price-container.is-xxlarge .product-page-price { margin-bottom: 0.5em; } .related-products-wrapper .product-section-title-related { font-size: 1.6em; text-align: center; font-weight: 700; } /** * Product page -------------------------------------------------------------------------------------------- END **/ /* Text below the logo*/ .logo-tagline { font-size: 2vw; white-space: nowrap; /* No line break */ } /* Dark overlay rest of page when searching */ #overlay { position: fixed; /* Sit on top of the page content */ display: none; /* Hidden by default */ width: 100%; /* Full width (cover the whole page) */ height: 100%; /* Full height (cover the whole page) */ top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.75); /* Black background with opacity */ z-index: 100; /* Specify a stack order in case you're using a different order for other elements */ cursor: pointer; /* Add a pointer on hover */ } /* Overscroll x off */ body { overscroll-behavior-x: none; } /** * Search text field input. Mobile ------------------------------------------------------------------------ START **/ li:nth-child(1) #ajaxsearchpro1_2 .probox .proinput form input[type="search"], /* Ajax Search Pro instance 1 */ li:nth-child(1) #ajaxsearchpro4_2 .probox .proinput form input[type="search"], /* Ajax Search Pro instance 4 */ li:nth-child(1) #ajaxsearchpro5_2 .probox .proinput form input[type="search"], /* Ajax Search Pro instance 5 */ li:nth-child(1) #ajaxsearchpro8_2 .probox .proinput form input[type="search"], /* Ajax Search Pro instance 8 */ li:nth-child(1) #ajaxsearchpro6_2 .probox .proinput form input[type="search"], /* Ajax Search Pro instance 6 */ li:nth-child(1) #ajaxsearchpro9_2 .probox .proinput form input[type="search"] { /* Ajax Search Pro instance 9 */ font-size: 20px; } li:nth-child(1) #ajaxsearchpro1_2 .probox .proinput form input.autocomplete, li:nth-child(1) #ajaxsearchpro4_2 .probox .proinput form input.autocomplete, li:nth-child(1) #ajaxsearchpro5_2 .probox .proinput form input.autocomplete, li:nth-child(1) #ajaxsearchpro6_2 .probox .proinput form input.autocomplete, li:nth-child(1) #ajaxsearchpro8_2 .probox .proinput form input.autocomplete, li:nth-child(1) #ajaxsearchpro9_2 .probox .proinput form input.autocomplete { font-size: 20px; } li:nth-child(1) #ajaxsearchpro1_2 .probox .proinput form input::placeholder, /* Chrome, Firefox, Opera, Safari 10.1+ */ li:nth-child(1) #ajaxsearchpro4_2 .probox .proinput form input::placeholder, /* Chrome, Firefox, Opera, Safari 10.1+ */ li:nth-child(1) #ajaxsearchpro5_2 .probox .proinput form input::placeholder, /* Chrome, Firefox, Opera, Safari 10.1+ */ li:nth-child(1) #ajaxsearchpro8_2 .probox .proinput form input::placeholder, /* Chrome, Firefox, Opera, Safari 10.1+ */ li:nth-child(1) #ajaxsearchpro6_2 .probox .proinput form input::placeholder, /* Chrome, Firefox, Opera, Safari 10.1+ */ li:nth-child(1) #ajaxsearchpro9_2 .probox .proinput form input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */ color: #666666; font-size: 20px; opacity: 1; /* Firefox */ } li:nth-child(1) #ajaxsearchpro1_2 .probox .proinput form input:-ms-input-placeholder, /* Internet Explorer 10-11 */ li:nth-child(1) #ajaxsearchpro4_2 .probox .proinput form input:-ms-input-placeholder, /* Internet Explorer 10-11 */ li:nth-child(1) #ajaxsearchpro5_2 .probox .proinput form input:-ms-input-placeholder, /* Internet Explorer 10-11 */ li:nth-child(1) #ajaxsearchpro8_2 .probox .proinput form input:-ms-input-placeholder, /* Internet Explorer 10-11 */ li:nth-child(1) #ajaxsearchpro6_2 .probox .proinput form input:-ms-input-placeholder, /* Internet Explorer 10-11 */ li:nth-child(1) #ajaxsearchpro9_2 .probox .proinput form input:-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #666666; font-size: 20px; } li:nth-child(1) #ajaxsearchpro1_2 .probox .proinput form input::-ms-input-placeholder, /* Microsoft Edge */ li:nth-child(1) #ajaxsearchpro4_2 .probox .proinput form input::-ms-input-placeholder, /* Microsoft Edge */ li:nth-child(1) #ajaxsearchpro5_2 .probox .proinput form input::-ms-input-placeholder, /* Microsoft Edge */ li:nth-child(1) #ajaxsearchpro8_2 .probox .proinput form input::-ms-input-placeholder, /* Microsoft Edge */ li:nth-child(1) #ajaxsearchpro6_2 .probox .proinput form input::-ms-input-placeholder, /* Microsoft Edge */ li:nth-child(1) #ajaxsearchpro9_2 .probox .proinput form input::-ms-input-placeholder { /* Microsoft Edge */ color: #666666; font-size: 20px; } /* Autocomplete */ .flex-col .header-nav .html .asp_w .probox .proinput form .autocomplete { font-size: 16px !important; color: #666666 !important; } /* Search text box position */ .mfp-wrap .mfp-container .mfp-content #main-menu .sidebar-menu { padding: 0; } /* Search text field */ .html_nav_position_text_top #ajaxsearchpro1_2, .html_nav_position_text_top #ajaxsearchpro4_2, .html_nav_position_text_top #ajaxsearchpro5_2, .html_nav_position_text_top #ajaxsearchpro6_2, .html_nav_position_text_top #ajaxsearchpro8_2, .html_nav_position_text_top #ajaxsearchpro9_2 { margin-top: -16px; } /* Search text field */ .html_nav_position_text_top #ajaxsearchpro1_2 .probox, .html_nav_position_text_top #ajaxsearchpro4_2 .probox, .html_nav_position_text_top #ajaxsearchpro5_2 .probox, .html_nav_position_text_top #ajaxsearchpro6_2 .probox, .html_nav_position_text_top #ajaxsearchpro8_2 .probox, .html_nav_position_text_top #ajaxsearchpro9_2 .probox { height: 45px; padding-top: 6px !important; } /** * Search text field input ------------------------------------------------------------------------------- END **/ /** * Icon hamburger and looking glass --------------------------------------------------------------------- START **/ div.container ul.nav li.nav-icon { margin-right: 10px; font-size: 135%; } /* Hamburger or looking glass icon clicked */ .has-off-canvas div.header-inner .current-lightbox-clicked { opacity: 1 !important; -ms-transform: none; transform: none; } /* Hamburger and looking glass no hover or click decoration */ li.nav-icon>a:hover, li.nav-icon>a:active { text-decoration: none; } /** * Icon hamburger and looking glass --------------------------------------------------------------------- END **/ /** * Mobile menu ------------------------------------------------------------------------------------------ START **/ .off-canvas-center .mfp-container .mfp-content { padding-top: 65px; } /* Hide the close (X) button */ body .off-canvas-center:not(.dark) .mfp-close { visibility: hidden; } .mfp-wrap .mfp-container .mfp-content { vertical-align: top; } ul.nav li.menu-item a.nav-top-link { text-align: left; } /** * Mobile menu. Turning off transformation/animation ----------------------------------------------------- PART START **/ .mfp-content, .mfp-bg .mpf-ready, .nav>li>a, .mfp-bg, .nav-anim>li { -webkit-transition: none !important; -moz-transition: none !important; -o-transition: none !important; transition: none !important; } .mfp-close, .mfp-ready .nav-anim>li, .mfp-container .mfp-content { -ms-transform: none !important; transform: none !important; } /** * Mobile menu. Turning off transformation/animation ----------------------------------------------------- PART END **/ /* Links in ul mobile menu */ #main-menu .nav>li>a, #main-menu .nav-dropdown>li>a, #main-menu .nav-column>li>a, #main-menu .nav-vertical>li>ul li a { color: #404040; } /* Links in ul mobile menu */ body .off-canvas .nav-vertical>li>a { padding-top: 6px; padding-bottom: 6px; } /* Sub links in ul mobile menu */ body .off-canvas .nav-vertical li ul.children li { font-size: 1.2em; text-align: left; margin-left: 64px; text-transform: uppercase; } /* First sub link in ul mobile menu */ body .off-canvas .nav-vertical li ul.children li:first-child { margin-left: 64px !important; } /** * Mobile menu ------------------------------------------------------------------------------------------ END **/ /** * Search result dropdown. Mobile -------------------------------------------------------------------------- START **/ /* All results */ #ajaxsearchprores1_2 .results .mCSBap_vertical .asp_simplebar-content .resdrg .item, /* Ajax Search Pro instance 1 */ #ajaxsearchprores4_2 .results .mCSBap_vertical .asp_simplebar-content .resdrg .item, /* Ajax Search Pro instance 4 */ #ajaxsearchprores5_2 .results .mCSBap_vertical .asp_simplebar-content .resdrg .item, /* Ajax Search Pro instance 5 */ #ajaxsearchprores8_2 .results .mCSBap_vertical .asp_simplebar-content .resdrg .item, /* Ajax Search Pro instance 8 */ #ajaxsearchprores6_2 .results .mCSBap_vertical .asp_simplebar-content .resdrg .item, /* Ajax Search Pro instance 6 */ #ajaxsearchprores9_2 .results .mCSBap_vertical .asp_simplebar-content .resdrg .item { /* Ajax Search Pro instance 6 */ margin-bottom: 10px; background: #f3f3f3; } /* All results fonts */ .results #mCSBap_1 .asp_simplebar-content .resdrg .item .asp_content .asp_res_url, .results #mCSBap_2 .asp_simplebar-content .resdrg .item .asp_content .asp_res_url, .results #mCSBap_3 .asp_simplebar-content .resdrg .item .asp_content .asp_res_url, .results #mCSBap_4 .asp_simplebar-content .resdrg .item .asp_content .asp_res_url, .results #mCSBap_8 .asp_simplebar-content .resdrg .item .asp_content .asp_res_url, .results #mCSBap_9 .asp_simplebar-content .resdrg .item .asp_content .asp_res_url { color: #000; font-weight: normal; } /* Seach results sale price */ .results #mCSBap_1 .asp_simplebar-content .resdrg .item .asp_content .asp_res_text ins .woocommerce-Price-amount, .results #mCSBap_2 .asp_simplebar-content .resdrg .item .asp_content .asp_res_text ins .woocommerce-Price-amount, .results #mCSBap_3 .asp_simplebar-content .resdrg .item .asp_content .asp_res_text ins .woocommerce-Price-amount, .results #mCSBap_4 .asp_simplebar-content .resdrg .item .asp_content .asp_res_text ins .woocommerce-Price-amount, .results #mCSBap_8 .asp_simplebar-content .resdrg .item .asp_content .asp_res_text ins .woocommerce-Price-amount, .results #mCSBap_9 .asp_simplebar-content .resdrg .item .asp_content .asp_res_text ins .woocommerce-Price-amount { color: red; } /* Seach results ordinary price */ .results #mCSBap_1 .asp_simplebar-content .resdrg .item .asp_content .asp_res_text del, .results #mCSBap_2 .asp_simplebar-content .resdrg .item .asp_content .asp_res_text del, .results #mCSBap_3 .asp_simplebar-content .resdrg .item .asp_content .asp_res_text del, .results #mCSBap_4 .asp_simplebar-content .resdrg .item .asp_content .asp_res_text del, .results #mCSBap_8 .asp_simplebar-content .resdrg .item .asp_content .asp_res_text del, .results #mCSBap_9 .asp_simplebar-content .resdrg .item .asp_content .asp_res_text del { text-decoration: line-through; } /* Result images */ .results #mCSBap_1 #mCSBap_1_container .resdrg .item .asp_content .asp_res_image_url .asp_image, .results #mCSBap_2 #mCSBap_2_container .resdrg .item .asp_content .asp_res_image_url .asp_image, .results #mCSBap_3 #mCSBap_3_container .resdrg .item .asp_content .asp_res_image_url .asp_image, .results #mCSBap_4 #mCSBap_4_container .resdrg .item .asp_content .asp_res_image_url .asp_image, .results #mCSBap_8 #mCSBap_8_container .resdrg .item .asp_content .asp_res_image_url .asp_image, .results #mCSBap_9 #mCSBap_8_container .resdrg .item .asp_content .asp_res_image_url .asp_image { width: 100px; height: 67px; margin: 3px 20px 3px 0; } #ajaxsearchprores1_2.vertical.ajaxsearchpro, #ajaxsearchprores1_2.vertical.ajaxsearchpro .results, #ajaxsearchprores4_2.vertical.ajaxsearchpro, #ajaxsearchprores4_2.vertical.ajaxsearchpro .results, #ajaxsearchprores5_2.vertical.ajaxsearchpro, #ajaxsearchprores5_2.vertical.ajaxsearchpro .results, #ajaxsearchprores6_2.vertical.ajaxsearchpro, #ajaxsearchprores6_2.vertical.ajaxsearchpro .results, #ajaxsearchprores8_2.vertical.ajaxsearchpro, #ajaxsearchprores8_2.vertical.ajaxsearchpro .results, #ajaxsearchprores9_2.vertical.ajaxsearchpro, #ajaxsearchprores9_2.vertical.ajaxsearchpro .results { background-color: #fff; } /* Search results "Show more" */ div#ajaxsearchprores1_2 div.asp_showmore_container, div#ajaxsearchprores4_2 div.asp_showmore_container, div#ajaxsearchprores5_2 div.asp_showmore_container, div#ajaxsearchprores6_2 div.asp_showmore_container, div#ajaxsearchprores8_2 div.asp_showmore_container, div#ajaxsearchprores9_2 div.asp_showmore_container { padding-bottom: 7px; } /* Search results "Show more" */ div#ajaxsearchprores1_2 div.asp_showmore_container p.showmore a.asp_showmore, div#ajaxsearchprores4_2 div.asp_showmore_container p.showmore a.asp_showmore, div#ajaxsearchprores5_2 div.asp_showmore_container p.showmore a.asp_showmore, div#ajaxsearchprores6_2 div.asp_showmore_container p.showmore a.asp_showmore, div#ajaxsearchprores8_2 div.asp_showmore_container p.showmore a.asp_showmore, div#ajaxsearchprores9_2 div.asp_showmore_container p.showmore a.asp_showmore { font-size: 15px; text-transform: uppercase; color: #000; font-weight: bold; } /*ajaxsearchprores image*/ #ajaxsearchprores1_2.vertical .results .item .asp_image, div.asp_r.asp_r_1.vertical .results .item .asp_image, #ajaxsearchprores4_2.vertical .results .item .asp_image, div.asp_r.asp_r_4.vertical .results .item .asp_image, #ajaxsearchprores5_2.vertical .results .item .asp_image, div.asp_r.asp_r_5.vertical .results .item .asp_image, #ajaxsearchprores6_2.vertical .results .item .asp_image, div.asp_r.asp_r_6.vertical .results .item .asp_image, #ajaxsearchprores8_2.vertical .results .item .asp_image, div.asp_r.asp_r_8.vertical .results .item .asp_image, #ajaxsearchprores9_2.vertical .results .item .asp_image, div.asp_r.asp_r_8.vertical .results .item .asp_image { width: 100px; } /** * Search result dropdown ------------------------------------------------------------------------------- END **/ /* Product and brand pages, from price and down. Padding */ #main>.shop-container>.product>.custom-product-page>.row>.col>.text-left, /* Body text on the left. Product page (?product=) */ #main>.row>.col>.shop-container>.pwb-brand-banner-cont>.pwb-brand-description>.row>.col>.col-inner { /* Body text. Brand page (?pwb-brand=) */ padding: 25px 14px 25px 14px; } /* ELCYKEL ONLINE section on front page */ .section>.section-content>.row>.col { padding: 0 5px 30px; } /* Text in the small white product boxes. Pages with pageID 334 and 336 are set in js-page*/ .product-small>.col-inner>.box>.box-text-products { padding-left: 7px; padding-right: 3px; } /* Product title in the small white product boxes */ .product-small>.col-inner>.box>.box-text-products>.title-wrapper>.product-title { font-size: 14px; } /* Prices in the small white product boxes */ .product-small>.col-inner>.box>.box-text-products>.price-wrapper>.price { font-size: 17px; } /* Red sale badge/bubble */ .product-small .col-inner .badge-container { margin-top: 0; } .custom-product-page .woocommerce-product-gallery .badge-container .badge-circle { height: 3.5em; width: 3.5em; } /** * Product page -------------------------------------------------------------------------------- START **/ .product-title { font-size: 1.2em; } .product-price-container.is-xxlarge { font-size: 1.5em; } .product-price-container.is-xxlarge .product-page-price { margin-bottom: 0.5em; } .related-products-wrapper .product-section-title-related { font-size: 1.6em; text-align: center; font-weight: 700; } .product_cat-elcykel #premium-savings-badge { display: none !important; } .custom-product-page .woocommerce-product-gallery .badge-circle { height: 3.5em; width: 3.5em; } .custom-product-page .woocommerce-product-gallery .badge-circle .onsale { font-size: 1.2em; } /** * Product page -------------------------------------------------------------------------------- END **/ /* Checkout page */ .cart_totals tr.shipping td ul { padding-left: 0 !important; } } /**------------------------------------------------------------------------------------------------ *Written by Demis *Custmize swatches plugin, product varations size selecter button . *-------------------------------------------------------------------------------------------------- **/ .woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item):hover { box-shadow: 0 0 0 1px rgb(0, 0, 0); } .woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).selected, .woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).selected:hover, .woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).selected, .woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).selected:hover { box-shadow: 0 0 0 2px rgba(0, 128, 0); background: rgb(0, 128, 0); color: #fff; } .woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item):hover { box-shadow: 0 0 0 3px rgba(0, 0, 0, .6); } td label, td .label, td input, td select, td form, td dl, td p { padding: 0 0 0.5em 0; } .variation th, td, label, legend { font-size: 1.0em; } .woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item) { box-shadow: 0 0 0 1px rgba(0, 0, 0, .3); margin: 4px 10px 4px 0; border-radius: 8px; } .variations td { display: flex; } .wvs-style-squared .button-variable-item, .woo-variation-swatches.woo-variation-swatches-style-squared .variable-items-wrapper .variable-item.button-variable-item { min-width: 73px; height: 35px; } /**************************************************************************************************************************/ /**************************************************************************************************************************/ @media only screen and (max-width: 549px) { /******************************************************************************/ /**************************************************************************************************************************/ /**************************************************************************************************************************/ /* Show only two products in: */ /* "POPULÄRA ELCYKLAR", "BILLIGA ELCYKLAR PÅ REA" and "KVALITETSCYKLAR FRÅN BATAVUS" on start page --------- START */ .col-inner>.row>.col>.col-inner>.columns-3>.products>div.product-small:nth-child(3), .col-inner>.row>.col>.col-inner>.columns-3>.products>div.product-small:nth-child(4) { display: none; } /* Hide cart/checkout tillbehör */ .cart-container>.row>.col>.col-inner>.woocommerce>.products>div.product-small:nth-child(3) { display: none; } /* Hide tillbehör/accessorie 3 and 4 on product page */ body.single-product #main>.shop-container>.product>.custom-product-page>.row>.col>.col-inner>.woocommerce>.products>.product-small:nth-child(3), body.single-product #main>.shop-container>.product>.custom-product-page>.row>.col>.col-inner>.woocommerce>.products>.product-small:nth-child(4) { display: none; } /* Show only two products in: */ /* "POPULÄRA ELCYKLAR", "BILLIGA ELCYKLAR PÅ REA" and "KVALITETSCYKLAR FRÅN BATAVUS" on start page ----------- END */ /* Text below the logo*/ .logo-tagline { font-size: 2.5vw; } } /*for displaying submenu in checkout page eyahya 22-04-2021*/ .nav>li:hover ul { opacity: unset; left: 0; } /*display rabatt calculation eyahya 24-04-2021*/ #stel-calc-savings { width: 360px; } /*customise jamfor button in product page eyahya 26-06-2021*/ .woocommerce.product.compare-button { padding: 1px 8px; float: left; } .woocommerce-variation-availability { border-bottom: none!important; } img.size-full.alignnone { margin-bottom: 0; } .text-center { margin-top: -15px; } a.compare.button { border: 1px solid #000000!important; margin-top: -32px; padding: 1px 8px!important; border-radius: 7px; /*float: left;*/ margin: -15px 0px 4px 17px; } a.compare.button.added::after, a.compare.button.added:after { margin-left: -3px; margin-top: -3px; } body.single-product a.compare.button::before, body.single-product a.compare.button:before { margin-left: 7px!important; } body.single-product a.compare.button::after, body.single-product a.compare.button:after { left: 10px!important; } .woocommerce.product.compare-button { float: right; } /* Cookie Banner Css - 28-11-22 - Huptech */ @media (min-width: 768px){ /*#cookie-law-info-bar[data-cli-type=popup], .wt-cli-cookie-bar[data-cli-type=popup]{ right: 15px !important; left: auto !important; bottom: 15px !important; max-width: 370px !important; }*/ } #cookie-law-info-bar[data-cli-type=popup], .wt-cli-cookie-bar[data-cli-type=popup]{ right: 0px !important; left: 0 !important; bottom: 0px !important; z-index: 100001; position: fixed !important; margin: 0 !important; top: unset !important; transform: none !important; padding: 22px 18px 14px !important; text-align: center; max-width: 370px !important; } #cookie-law-info-bar[data-cli-type=popup] .cli-bar-message{ text-align: center; margin: 5px 0 24px 0; } #cookie-law-info-bar[data-cli-type=popup] .cli-bar-btn_container{ display: flex; flex-direction: column-reverse; } #cookie-law-info-bar[data-cli-type=popup] .cli-bar-btn_container a { text-align: center; } #cookie-law-info-bar[data-cli-type=popup] .cli-bar-btn_container a#wt-cli-settings-btn{ margin: 12px auto 10px; border-radius: 0; padding: 0px 2px 5px; font-weight: 600; text-transform: capitalize; } #cookie-law-info-bar[data-cli-type=popup] a#wt-cli-accept-btn{ margin: 0px auto 1em !important; max-width: 300px !important; display: block !important; width: 100%; padding: 10px 25px !important; } .cli-modal .cli-modal-dialog { max-width: 370px; margin: 0 15px 0 auto; transform: none !important; top: unset; bottom: 15px; align-items: end; height: 100%; } .cli-modal-content{border-radius: 0;} /* firefox */ .cli-modal .cli-tab-container .cli-row:-webkit-scrollbar{width: 4px;} .cli-modal .cli-tab-container .cli-row:-webkit-scrollbar-track{box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);} .cli-modal .cli-tab-container .cli-row:-webkit-scrollbar-thumb{background-color: darkgrey;} /* webkit */ .cli-modal .cli-tab-container .cli-row::-webkit-scrollbar{width: 4px;} .cli-modal .cli-tab-container .cli-row::-webkit-scrollbar-track{box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);} .cli-modal .cli-tab-container .cli-row::-webkit-scrollbar-thumb{background-color: darkgrey;} .cli-modal .cli-btn{ width: 100%;margin: 0;background-color: rgb(0, 128, 0) !important; border-radius: 0; } @media (min-width: 768px){ #cookie-law-info-bar[data-cli-type=popup], .wt-cli-cookie-bar[data-cli-type=popup]{ right: 15px !important; left: auto !important; bottom: 15px !important; max-width: 370px !important; } } @media (max-width: 767px){ #cookie-law-info-bar[data-cli-type=popup], .wt-cli-cookie-bar[data-cli-type=popup]{ width: 100% !important; max-width: initial !important; } .cli-modal .cli-modal-dialog {max-width: initial;margin: 0 auto;bottom: 0;} } /* 22-11-22 */ #wt-cli-cookie-banner-title{text-align: center;} @media (min-width: 768px){ #wt-cli-cookie-banner-title{text-align: left;} #cookie-law-info-bar[data-cli-type=popup], .wt-cli-cookie-bar[data-cli-type=popup] { right: 0 !important; left: auto !important; bottom: 0 !important; max-width: 100% !important; width: 100% !important; background: rgb(167 167 167 / 97%) !important; } #cookie-law-info-bar[data-cli-type=widget] .cli-bar-container, #cookie-law-info-bar[data-cli-type=popup] .cli-bar-container { display: flex; } #cookie-law-info-bar[data-cli-type=widget] .cli-bar-message, #cookie-law-info-bar[data-cli-type=popup] .cli-bar-message{ width: 70%; } #cookie-law-info-bar[data-cli-type=popup] .cli-bar-btn_container{width: 30%;} #cookie-law-info-bar[data-cli-type=popup] .cli-bar-message{text-align: left;} } #cookie-law-info-bar[data-cli-type=popup] .cli-bar-btn_container a#wt-cli-settings-btn { background: transparent !important; }