/* -------------------------------------- */ /* 23. WooCommerce /* -------------------------------------- */ /* Product Page */ .woocommerce #content div.product div.images, .woocommerce div.product div.images, .woocommerce-page #content div.product div.images, .woocommerce-page div.product div.images { width: 52%; } .woocommerce #content div.product div.summary, .woocommerce div.product div.summary, .woocommerce-page #content div.product div.summary, .woocommerce-page div.product div.summary { width: 44%; } .woocommerce div.product div.images, .woocommerce div.product div.summary { margin-bottom: 60px; } .woocommerce div.product div.images .flex-control-thumbs { display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 12px; margin-top: 12px; } .woocommerce div.product div.images .flex-control-thumbs li { width: 100%; } .woocommerce div.product .product_title { font-size: 26px; margin-bottom: 8px; } .related.products { clear: both; } .woocommerce div.product p.price, .woocommerce div.product span.price { color: #666; font-weight: 300; margin-bottom: 15px; } .woocommerce-product-details__short-description { margin-bottom: 30px; } .woocommerce-product-details__short-description p, .woocommerce-tabs p { font-size: 16px; } .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: #000; font-weight: 500; text-transform: uppercase; letter-spacing: 1.5px; font-size: 11px; border-radius: 0; padding: 14px 18px; } .woocommerce button.button.alt:hover { opacity: 0.8; background: #000; } .woocommerce .quantity .qty { height: 39px; line-height: 39px; border: 1px solid #d5d5d5; margin-right: 5px; } .product_meta { font-size: 12px; } .product_meta a { color: #999; } /* ----- Shop Page ----- */ .woocommerce ul.products li.product, .woocommerce-page ul.products li.product { margin-bottom: 30px; } .woocommerce .page-title { font-size: 30px; font-weight: 300; margin-bottom: -3px; } .woocommerce .woocommerce-result-count { color: #999; font-size: 14px; font-style: italic; } .woocommerce .woocommerce-ordering select { padding: 7px 9px; color: #999; border-radius: 2px; font-size: 13px; border: 1px solid #e5e5e5; max-width: 190px; } .woocommerce .woocommerce-ordering { margin-top: -15px; margin-bottom: 40px; } /* ----- Shop Page Catalog Items ----- */ .woocommerce ul.products li.product a img { margin-bottom: 8px; } .woocommerce ul.products li.product .woocommerce-loop-category__title, .woocommerce ul.products li.product .woocommerce-loop-product__title, .woocommerce ul.products li.product h3 { color: #000; font-weight: 400; padding-bottom: 4px; font-size: 16px; text-align: center; text-transform: none; letter-spacing: 0; } .woocommerce ul.products li.product .price { text-align: center; font-size: 14px; color: #888; } .woocommerce ul.products li.product .price del { display: inline; margin-right: 3px; } .woocommerce ul.products li.product .price ins { font-weight: 400; text-decoration: none; } .woocommerce ul.products li.product .button { display: none; } .woocommerce span.onsale { height: 38px; width: 38px; line-height: 38px; padding: 0; font-weight: 400; font-size: 12px; color: #ffffff; background-color: #222; margin: -0.8em -0.8em 0 0; } .woocommerce ul.products li.product .onsale { margin: -0.8em -0.8em 0 0; } .woocommerce ul.products li.product .star-rating { display: none; } /* ----- Shop Page Pagination ----- */ .woocommerce nav.woocommerce-pagination ul { border: none; } .woocommerce nav.woocommerce-pagination ul li { border: 1px solid #e5e5e5; margin: 0 3px; border-radius: 3px; } .woocommerce nav.woocommerce-pagination ul li a:focus, .woocommerce nav.woocommerce-pagination ul li a:hover, .woocommerce nav.woocommerce-pagination ul li span.current { background: #f4f4f4; color: #888; } .woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span { color: #999; font-size: 12px; padding: 6px 9px; } /* ----- Single Product Page ----- */ .woocommerce div.product .product_title { font-size: 28px; color: #000; } .woocommerce .star-rating { font-size: 11px; color: #dea08c; } .woocommerce .woocommerce-product-rating .star-rating { margin: 10px 6px 0 0; } a.woocommerce-review-link { font-size: 13px; color: #999; font-style: italic; } .woocommerce div.product .woocommerce-product-rating { margin-bottom: 2px; margin-top: -8px; } .woocommerce div.product .entry-summary p.price, .woocommerce div.product .entry-summary span.price { font-size: 22px; color: #000; margin: 5px 0 38px; position: relative; font-weight: 300; } .woocommerce div.product .entry-summary p.price:after { content: ""; position: absolute; bottom: -18px; left: 0; height: 1px; width: 44px; border-top: 1px solid; border-color: #d5d5d5; } .woocommerce div.product p.price ins, .woocommerce div.product span.price ins { font-weight: 400; text-decoration: none; } .woocommerce div.product div.summary p { margin-bottom: 16px; color: #444; } .woocommerce div.product div.summary p:last-child { margin-bottom: 30px; } .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background-color: #999; } .woocommerce .quantity .qty { padding: 10px 4px; margin-right: 10px; width: 4em; } .woocommerce div.product form.cart div.quantity { margin-right: 2px; } .product_meta { color: #949494; font-size: 12px; } .product_meta .sku_wrapper, .product_meta .posted_in, .product_meta .tagged_as { display: block; margin-bottom: 2px; } .product_meta a { color: #aaa; } .woocommerce div.product .woocommerce-tabs .panel #review_form #respond p.comment-form-author, .woocommerce div.product .woocommerce-tabs .panel #review_form #respond p.comment-form-email { width: 100%; max-width: 300px; float: left; margin-right: 20px; } /* ----- Single Product Widths ----- */ .woocommerce #content div.product div.images, .woocommerce div.product div.images, .woocommerce-page #content div.product div.images, .woocommerce-page div.product div.images { width: 52%; } .woocommerce #content div.product div.summary, .woocommerce div.product div.summary, .woocommerce-page #content div.product div.summary, .woocommerce-page div.product div.summary { width: 43%; } .woocommerce div.product div.images, .woocommerce div.product div.summary { margin-bottom: 50px; } /* ----- Single Product Tabs ----- */ .woocommerce div.product .woocommerce-tabs ul.tabs li a { padding: 14px 10px 10px; font-size: 11px; text-transform: uppercase; letter-spacing: 2px; font-weight: 400; } .woocommerce div.product .woocommerce-tabs .panel h2, .related.products h2, .upsells.products h2 { margin-bottom: 20px; text-transform: uppercase; letter-spacing: 2px; font-size: 12px; font-weight: 700; position: relative; font-style: normal; } .woocommerce div.product .woocommerce-tabs ul.tabs { margin-bottom: 30px; } .woocommerce div.product .woocommerce-tabs ul.tabs li { background-color: #f4f4f4; border-color: #e2e2e2; border-radius: 0; } .woocommerce div.product .woocommerce-tabs ul.tabs li:after, .woocommerce div.product .woocommerce-tabs ul.tabs li:before { display: none; } .woocommerce div.product .woocommerce-tabs ul.tabs:before { border-color: #e2e2e2; } /* ----- Attributes ----- */ .woocommerce table.shop_attributes th { font-weight: 400; } .woocommerce table.shop_attributes td { padding: 10px 0px; } .woocommerce table.shop_attributes td, .woocommerce table.shop_attributes th { border-bottom: none; } .woocommerce table.shop_attributes { border-top: none; } .woocommerce table.shop_attributes td { color: #888; } .related.products h2 { margin-bottom: 30px; } /* ----- Comments ----- */ .woocommerce #reviews #comments ol.commentlist { padding-left: 0; margin-left: 0; } .woocommerce #reviews #comments ol.commentlist li img.avatar { position: relative; border: none; background: none; border-radius: 100%; height: 50px; width: 50px; } .woocommerce #reviews #comments ol.commentlist li .comment-text { border: none; border-radius: 0; margin-left: 55px; padding: 0 0 0 10px; } .woocommerce #reviews #comments ol.commentlist li .comment-text p { margin-bottom: 3px; } .woocommerce .comment-text p.meta strong { color: #000; text-transform: uppercase; font-size: 12px; letter-spacing: 2px; } .woocommerce .star-rating { float: none; margin-bottom: 8px; } .woocommerce #reviews #comments ol.commentlist li { border-bottom: 1px solid #eee; padding-bottom: 25px; list-style: none; } .woocommerce #review_form #respond p.comment-form-comment, .woocommerce #review_form #respond p.comment-form-author, .woocommerce #review_form #respond p.comment-form-email { text-transform: uppercase; font-size: 12px; letter-spacing: 1px; } .woocommerce #reviews h3 { margin-bottom: 10px; font-style: normal; } .woocommerce #review_form #respond p { margin-bottom: 10px; } .woocommerce .comment-notes { font-size: 13px; color: #888; } .woocommerce #review_form #respond textarea { margin-bottom: 0; } .woocommerce #reviews #comment { height: 120px; } .woocommerce a.button, .woocommerce button.button, .woocommerce input.button { text-transform: uppercase; letter-spacing: 2px; background: #eee; border-radius: 0; font-size: 11px; color: #888; padding: 11px 21px 10px; display: inline-block; border: none; -o-transition: 0.3s; -ms-transition: 0.3s; -moz-transition: 0.3s; -webkit-transition: 0.3s; transition: 0.3s; cursor: pointer; border-radius: 30px; width: auto; font-weight: 400; } .woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover { background: #333; color: #fff; } .woocommerce-page .post-meta { display: none; } .woocommerce table.shop_table { border-radius: 0; } .woocommerce-account .addresses .title h3, .woocommerce-account h2 { font-style: normal; } /* ----- My Account ----- */ .woocommerce-account .addresses .title h3, .woocommerce-account h2 { text-transform: uppercase; font-size: 14px; letter-spacing: 2px; } .woocommerce table.my_account_orders th { font-size: 11px; text-transform: uppercase; letter-spacing: 2px; font-weight: 400; padding: 10px; } .woocommerce table.shop_table td { border: none; } .woocommerce table.my_account_orders .order-actions .button { padding: 7px 14px 8px 16px; font-size: 10px; } .woocommerce table.my_account_orders td, .woocommerce table.my_account_orders th { padding: 8px 8px; } .woocommerce table.shop_table { margin-bottom: 35px; } .woocommerce-page .col2-set.addresses { margin-top: 30px; } .woocommerce-page .col2-set.addresses address { color: #888; } p.myaccount_user { margin-bottom: 35px; } address { line-height: 24px; } .woocommerce-account .addresses .title .edit { font-size: 11px; text-decoration: underline; } .post-entry .woocommerce-MyAccount-navigation ul { padding-left: 0; margin: 0; list-style: none; } .woocommerce-MyAccount-navigation ul li { border-bottom: 1px solid #e8e8e8; list-style: none; padding-bottom: 10px; } .woocommerce-MyAccount-navigation ul li a { color: #888; font-size: 14px; box-shadow: none; } .woocommerce-MyAccount-navigation ul li a:hover { color: #000; box-shadow: none; } .woocommerce-account .woocommerce-MyAccount-navigation { width: 26%; } .woocommerce-EditAccountForm legend { padding: 15px 0 10px 2px; font-weight: 700; } /* ----- Empty Cart ----- */ .cart-empty { text-align: center; } .return-to-shop { text-align: center; } /* ----- Order ID ----- */ .woocommerce table.shop_table tfoot th, .woocommerce table.shop_table tbody th { border-bottom: none; } .woocommerce table.shop_table tbody th, .woocommerce table.shop_table tfoot td, .woocommerce table.shop_table tfoot th { font-weight: 400; } mark { background-color: #fff; border-bottom: 3px solid #eee; } /* ----- Checkout ----- */ .woocommerce .woocommerce-info:before { color: #888; } .woocommerce .woocommerce-error, .woocommerce .woocommerce-info, .woocommerce .woocommerce-message { padding: 0.8em 2em 1em 3.5em !important; background-color: #f7f7f7; } .woocommerce .woocommerce-info { border-top-color: #e5e5e5; } a.showcoupon { text-decoration: underline; } .woocommerce-page .woocommerce-checkout h3 { text-transform: uppercase; font-size: 13px; letter-spacing: 1.5px; font-style: normal; } input#ship-to-different-address-checkbox { width: auto; vertical-align: middle; } .woocommerce-checkout h3 { margin-top: 30px; } .woocommerce-checkout #payment ul.payment_methods li { list-style: none; } .woocommerce-checkout #payment ul.payment_methods li input { width: auto; } .woocommerce-checkout #payment { background-color: #f7f7f7; } .woocommerce-checkout #payment ul.payment_methods { border-bottom: none; } .woocommerce-checkout #payment div.payment_box:before { border: 1em solid #ebebeb; border-right-color: transparent; border-left-color: transparent; border-top-color: transparent; } .woocommerce-checkout #payment div.payment_box { background-color: #ebebeb; color: #888; } .woocommerce form.checkout_coupon, .woocommerce form.login, .woocommerce form.register { border: 1px solid #e5e5e5; } .woocommerce form .form-row label, .woocommerce form .form-row .select2-container { font-size: 13px; } .select2-container--default .select2-selection--single { border-color: #ddd; } .woocommerce form .form-row textarea { height: 8em; } .woocommerce-checkout #payment li, .woocommerce-checkout #payment p { font-size: 14px; } .select2-container--default .select2-selection--single { border-radius: 0; height: 38px; } .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 38px; } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 36px; } /* ----- Order Received ----- */ .woocommerce .order_details li { list-style: none; } .woocommerce .order_details { padding-left: 0; } .woocommerce .woocommerce-error:before, .woocommerce .woocommerce-info:before, .woocommerce .woocommerce-message:before { top: 11px; } .woocommerce .woocommerce-error, .woocommerce .woocommerce-info, .woocommerce .woocommerce-message { border-top-color: #e5e5e5; line-height: 32px; font-size: 14px; } .woocommerce .woocommerce-error li, .woocommerce .woocommerce-info li, .woocommerce .woocommerce-message li { margin-bottom: 0; } /* ----- Cart ----- */ .woocommerce .cart-collaterals .cart_totals, .woocommerce-page .cart-collaterals .cart_totals { width: 100%; } .woocommerce-cart .cart-collaterals .cart_totals table td, .woocommerce-cart .cart-collaterals .cart_totals table th { padding-left: 15px; } .woocommerce-cart .cart-collaterals .cart_totals tr td, .woocommerce-cart .cart-collaterals .cart_totals tr th { border-top: none; } .woocommerce .cart .button, .woocommerce .cart input.button { font-size: 10px; padding: 8px 14px 9px; } .woocommerce-cart table.cart td.actions .coupon .input-text { padding: 4px 6px; margin-right: 10px; line-height: 1.3; } .woocommerce table.cart td.actions .input-text, .woocommerce-page #content table.cart td.actions .input-text, .woocommerce-page table.cart td.actions .input-text { width: 110px; } .woocommerce-cart .cart-collaterals .cart_totals table th { background: #f7f7f7; } .woocommerce #content table.cart td.actions, .woocommerce table.cart td.actions, .woocommerce-page #content table.cart td.actions, .woocommerce-page table.cart td.actions { padding: 15px; border-top: 1px solid #e5e5e5; } .woocommerce a.remove { color: #999 !important; } .woocommerce a.remove:hover { background: none !important; color: #000 !important; text-decoration: none; } .cart_item a { color: #000; } .woocommerce .widget_shopping_cart .cart_list li, .woocommerce.widget_shopping_cart .cart_list li { padding-left: 25px; } /* ----- Login ----- */ input#rememberme { width: auto; } .woocommerce .login #password { margin-bottom: 20px; } .woocommerce .login .button { margin-right: 10px; } .woocommerce form .form-row .input-checkbox { width: auto; } .lost_password { font-size: 11px; } /* ----- Widgets ----- */ /* ----- Cart Widget ----- */ .woocommerce .widget_shopping_cart .cart_list li a.remove, .woocommerce.widget_shopping_cart .cart_list li a.remove { font-size: 16px; line-height: 18px; font-weight: 700; } .woocommerce ul.cart_list li a, .woocommerce ul.product_list_widget li a { font-weight: 300; } #dt-sidebar .woocommerce ul.cart_list li a, #dt-sidebar .woocommerce ul.product_list_widget li a, .footer-widget .woocommerce ul.cart_list li a, .footer-widget .woocommerce ul.product_list_widget li a { font-weight: 400; } .woocommerce ul.cart_list li img, .woocommerce ul.product_list_widget li img { width: 60px; } .woocommerce .widget_shopping_cart .cart_list li, .woocommerce.widget_shopping_cart .cart_list li { margin-bottom: 8px; text-align: left; } .widget_shopping_cart .quantity { color: #999; } .woocommerce ul.cart_list { margin-bottom: 15px; } .woocommerce .widget_shopping_cart .total, .woocommerce.widget_shopping_cart .total { border-top: 1px solid #eee; padding-top: 10px; margin-bottom: 15px; } .widget_shopping_cart a.button, .woocommerce .widget_price_filter .price_slider_amount .button { font-size: 10px; padding: 11px 15px 9px; margin: 0 5px 0 0; } .woocommerce .widget_shopping_cart .cart_list li a.remove, .woocommerce.widget_shopping_cart .cart_list li a.remove { top: 2px; } /* ----- Product Widgets ----- */ .woocommerce.widget_products ul.product_list_widget li img, .woocommerce.widget_recently_viewed_products ul.product_list_widget li img, .woocommerce.widget_recent_reviews ul.product_list_widget li img, .woocommerce.widget_top_rated_products ul.product_list_widget li img { float: left; margin-left: 0; margin-right: 14px; width: 80px; } .woocommerce.widget_products ul.product_list_widget li, .woocommerce.widget_recently_viewed_products ul.product_list_widget li, .woocommerce.widget_recent_reviews ul.product_list_widget li, .woocommerce.widget_top_rated_products ul.product_list_widget li { margin-bottom: 14px; padding-bottom: 14px; padding-top: 0; text-align: left; } .woocommerce.widget_products ul.product_list_widget li:last-child, .woocommerce.widget_recently_viewed_products ul.product_list_widget li:last-child, .woocommerce.widget_recent_reviews ul.product_list_widget li:last-child, .woocommerce.widget_top_rated_products ul.product_list_widget li:last-child { margin-bottom: 0; padding-bottom: 0; } .woocommerce.widget_products .amount, .woocommerce.widget_recently_viewed_products .amount, .woocommerce.widget_recent_reviews .amount, .woocommerce.widget_top_rated_products .amount { color: #888; font-weight: 300; font-size: 13px; } .woocommerce.widget_products span.product-title, .woocommerce.widget_recently_viewed_products span.product-title, .woocommerce.widget_recent_reviews span.product-title, .woocommerce.widget_top_rated_products span.product-title { margin-bottom: 5px; } /* ----- Review Widget ----- */ .woocommerce ul.cart_list li .star-rating { margin-top: 8px; margin-bottom: 3px; } .woocommerce ul.product_list_widget li .star-rating { margin-top: 3px; margin-bottom: 3px; } .woocommerce ul.product_list_widget .reviewer { color: #999; font-style: italic; font-size: 12px; } /* ----- Filter Widget ----- */ .woocommerce.widget_layered_nav_filters ul li { margin-right: 10px; } .woocommerce.widget_layered_nav ul li .count { color: #999; } .woocommerce.widget_layered_nav ul li a:hover { text-decoration: none; } .woocommerce .widget_price_filter .price_slider_wrapper .ui-widget-content { background-color: #f2f2f2; } .woocommerce .widget_price_filter .ui-slider .ui-slider-range, .woocommerce .widget_price_filter .ui-slider .ui-slider-handle { background-color: #ccc; } /* ----- Rating Filter ----- */ .woocommerce .widget_rating_filter ul li .star-rating { margin-bottom: 0; } .woocommerce .widget_rating_filter ul li a { color: #a5a5a5; } /* ----- Pagination ----- */ .woocommerce nav.woocommerce-pagination { margin-bottom: 40px; } /* ----- Product Categories ----- */ .widget_product_categories { text-align: center; } .widget_product_categories .count { color: #999; font-size: 13px; } .widget_layered_nav, .widget_rating_filter { text-align: center; } /* ----- Gutenberg blocks ----- */ .wc-block-grid { margin-bottom: 40px; } .wc-block-grid .woocommerce-Price-amount { color: #888; font-size: 14px; margin-bottom: 2px; } .wc-block-grid__product-price { line-height: 1.5; } .wc-block-grid__product-title { font-size: 16px; margin-bottom: 4px; } .wc-block-grid .wp-block-button__link { padding: 9px 20px; font-size: 12px; } .wc-block-grid__product:hover .wc-block-grid__product-title { color: #000; }