/* * * PRODUCTS LIST * */ .products > li { text-align: center; } .woocommerce ul.products li.product, .woocommerce-page ul.products li.product { clear: none; } .woocommerce ul.products li.product .price > del { display: inline; margin-right: 5px; } .woocommerce ul.products li.product .button { background: none; padding: 0; border: 0; font-size: 12px; font-weight: 600; } a.button .fa.fa-shopping-cart { margin-right: 5px; } .outofstock .fa.fa-shopping-cart, .product-type-grouped .fa.fa-shopping-cart, .product-type-variable .fa.fa-shopping-cart { display:none; } .added_to_cart.wc-forward { font-size: 12px; font-weight: 600; } .woocommerce a.button.loading::after { right:-15px; top:0; } .woocommerce span.onsale { min-height: 4em; min-width: 4em; padding:0; line-height: 4em; top: 0.5em; left: 0.5em; font-size: 1em; } .woocommerce ul.products li.product .onsale { top: 0; right: 0; left: auto; margin: 0.5em 0.5em 0 0; } /* Products navigation */ .woocommerce nav.woocommerce-pagination ul { border:0; } .woocommerce nav.woocommerce-pagination ul li { margin: 0 5px 0; border:1px solid #d3ced2; } .woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span.current { padding:10px 16px; } /* Buttons */ .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button { border:1px solid; border-radius:0; } /* Orderby dropdown */ .sorting, .sorting ul { list-style-type: none; padding: 0; margin: 0; } .sorting ul { position: absolute; top: 0; left: 0; width: 100%; z-index: 9999; } .sorting { display: inline-block; float: right; width:35%; margin-bottom:20px; background-color: #78bca1; color: #fff; cursor: pointer; } .sorting > li, .orderby-list a { padding: 5px 10px; margin: 0; } .sort-item { display: none; } .selected-order{ position: relative; width: 100%; z-index: 999; border:1px solid; } .selected-order:after { display: block; padding: 5px 0; content: '\f347'; font-family: dashicons; z-index: 101; position: absolute; top: 0; right: 0; text-align: center; width: 39px; } .sorting li.orderby-list { position: relative; padding: 0; } .sorting li { margin: 0; } .orderby-list ul { display: none; border:1px solid; border-top:0; } .sorting:hover ul { display: block; } .orderby-list a.button { display: inline-block; width: 100%; border:0; border-radius: 0; font-weight:normal; background-color: #78bca1; color: #fff; } .woocommerce .products .star-rating { margin:0; } .star-rating-wrapper { position: absolute; display: inline-block; bottom: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); padding: 5px 10px; background-color: rgba(0,0,0,0.2); opacity: 0; transition: opacity 0.2s ease; } .star-rating { color:gold; } .woocommerce ul.products li.product a:hover .star-rating-wrapper { opacity: 1; } .woocommerce ul.products li.product .price { color: } /* Cart */ .woocommerce #content table.cart td.actions .input-text, .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: auto; } /* Filter by price widget */ .woocommerce .widget_price_filter .price_slider_wrapper .ui-widget-content { background-color: #ccc; } /* Tablet */ @media( max-width: 768px ) { .woocommerce #content table.cart td.actions .coupon .button, .woocommerce #content table.cart td.actions .coupon .input-text, .woocommerce #content table.cart td.actions .coupon input, .woocommerce table.cart td.actions .coupon .button, .woocommerce table.cart td.actions .coupon .input-text, .woocommerce table.cart td.actions .coupon input, .woocommerce-page #content table.cart td.actions .coupon .button, .woocommerce-page #content table.cart td.actions .coupon .input-text, .woocommerce-page #content table.cart td.actions .coupon input, .woocommerce-page table.cart td.actions .coupon .button, .woocommerce-page table.cart td.actions .coupon .input-text, .woocommerce-page table.cart td.actions .coupon input, .woocommerce #content table.cart td.actions .coupon .button.alt, .woocommerce #content table.cart td.actions .coupon .input-text + .button, .woocommerce table.cart td.actions .coupon .button.alt, .woocommerce table.cart td.actions .coupon .input-text + .button, .woocommerce-page #content table.cart td.actions .coupon .button.alt, .woocommerce-page #content table.cart td.actions .coupon .input-text + .button, .woocommerce-page table.cart td.actions .coupon .button.alt, .woocommerce-page table.cart td.actions .coupon .input-text + .button { width:100%; } .woocommerce #content table.cart td.actions .coupon .button.alt, .woocommerce #content table.cart td.actions .coupon .input-text + .button, .woocommerce table.cart td.actions .coupon .button.alt, .woocommerce table.cart td.actions .coupon .input-text + .button, .woocommerce-page #content table.cart td.actions .coupon .button.alt, .woocommerce-page #content table.cart td.actions .coupon .input-text + .button, .woocommerce-page table.cart td.actions .coupon .button.alt, .woocommerce-page table.cart td.actions .coupon .input-text + .button { margin:10px 0; } .sorting { width:100%; } } /* * * PRODUCT PAGE * */ .woocommerce div.product form.cart { margin-top: 2em; } .woocommerce div.product form.cart .variations select { width:100%; } .woocommerce div.product form.cart .variations td, .woocommerce div.product form.cart .group_table td { vertical-align: baseline; } td.label { color: inherit; font-size: inherit; } .woocommerce div.product form.cart .reset_variations { float: right; font-size: 1em; } .woocommerce div.product form.cart .button { height:2.8em; } /* Product meta tabs */ .woocommerce div.product .woocommerce-tabs ul.tabs { padding: 0; } .woocommerce div.product .woocommerce-tabs ul.tabs li, .woocommerce div.product .woocommerce-tabs ul.tabs li.active { margin: 0; padding: 8px 0; background-color: transparent; border: 0; border-bottom: 1px solid rgba(0,0,0,0.1); } .woocommerce div.product .woocommerce-tabs ul.tabs::before, .woocommerce div.product .woocommerce-tabs ul.tabs li::after { border:0; box-shadow:none; } .woocommerce #content div.product .woocommerce-tabs ul.tabs li, .woocommerce div.product .woocommerce-tabs ul.tabs li, .woocommerce-page #content div.product .woocommerce-tabs ul.tabs li, .woocommerce-page div.product .woocommerce-tabs ul.tabs li { display:block; } .woocommerce div.product .woocommerce-tabs ul.tabs li a { font-weight: 600; text-transform: uppercase; } .woocommerce div.product .woocommerce-tabs .panel { padding:20px; border: 1px solid rgba(0,0,0,0.1); background-color: transparent; }