/* CSS Document */ /* Table of Content ================================================== 1.0 - Transition 2.0 - Type 12 3.0 - General 4.0 - Browser Fix 5.0 - Default Color 6.0 - Responsive 7.0 - Skin Colors*/ /*-------------------------------------------------------------- 1.0 - Transition --------------------------------------------------------------*/ ul.products li.product .woo-type12 .product-wrapper, ul.products li.product .woo-type12 .product-details h5:before, ul.products li.product .woo-type12 .product-details h5:after, ul.products li.product .woo-type12 .product-details { -webkit-transition: all 300ms linear 0s; -moz-transition: all 300ms linear 0s; -ms-transition: all 300ms linear 0s; -o-transition: all 300ms linear 0s; transition: all 300ms linear 0s; } /*-------------------------------------------------------------- 2.0 - Type 12 --------------------------------------------------------------*/ ul.products li.product .woo-type12 .product-wrapper { border-style: solid; border-width: 1px 1px 0; } ul.products li.product .woo-type12 .featured-tag { top: 10px; } ul.products li.product .woo-type12 .product-details h5 { border: none; margin: 0 0 15px; position: relative; text-transform: uppercase; } ul.products li.product .woo-type12 .product-details h5 a, .woo-type12 ul.products li.product-category .product-details h5 { padding: 20px 0 18px; } ul.products li.product .woo-type12 .product-details h5:before, ul.products li.product .woo-type12 .product-details h5:after { content: ""; height: 1px; margin: 0 auto; position: absolute; bottom: 0; left: 0; right: 0; } .woo-type12 ul.products li.product-category .product-wrapper h3:before { bottom: 30px; } ul.products li.product .woo-type12 .product-details h5:before { width: 75%; } ul.products li.product .woo-type12 .product-details h5:after { width: 50px; } ul.products li.product:hover .woo-type12 .product-details h5:after { width: 75px; } ul.products li.product:hover .woo-type12 .product-details h5:before { width: calc(100% - 30px); } ul.products li.product .woo-type12 .product-details .product-price { padding: 0 15px; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } ul.products li.product:hover .woo-type12 .product-details .product-rating-wrapper { right: 12px; } .woo-type12.woocommerce ul.products li:hover:not(.purchasable) .product-details .product-rating-wrapper, .woo-type12 .woocommerce ul.products li:hover:not(.purchasable) .product-details .product-rating-wrapper { right: 50%; } ul.products li.product .woo-type12 .product-details .product-rating-wrapper .star-rating { margin: 8px 0 0; } .page-with-sidebar ul.products li.product .woo-type12 .dt-sc-one-fourth .product-details h5, .page-with-sidebar .woocommerce.columns-4 ul.products li.product .woo-type12 .dt-sc-one-fourth .product-details h5, .with-both-sidebar ul.products li.product .woo-type12 .dt-sc-one-third .product-details h5, .with-both-sidebar .woocommerce.columns-3 ul.products li.product .woo-type12 .dt-sc-one-third .product-details h5 { font-size: 10px; margin: 0 0 10px; } .page-with-sidebar ul.products li.product:hover .woo-type12 .dt-sc-one-fourth .product-details h5:before, .page-with-sidebar .woocommerce.columns-4 ul.products li.product:hover .woo-type12 .dt-sc-one-fourth .product-details h5:before, .with-both-sidebar ul.products li.product:hover .woo-type12 .dt-sc-one-third .product-details h5:before, .with-both-sidebar .woocommerce.columns-3 ul.products li.product:hover .woo-type12 .dt-sc-one-third .product-details h5:before { width: calc(100% - 20px); } .page-with-sidebar ul.products li.product .woo-type12 .dt-sc-one-fourth .product-details .product-price, .page-with-sidebar .woocommerce.columns-4 ul.products li.product .woo-type12 .dt-sc-one-fourth .product-details .product-price, .with-both-sidebar ul.products li.product .woo-type12 .dt-sc-one-third .product-details .product-price, .with-both-sidebar .woocommerce.columns-3 ul.products li.product .woo-type12 .dt-sc-one-third .product-details .product-price { padding: 0 10px; } .page-with-sidebar ul.products li.product .woo-type12 .dt-sc-one-fourth .price, .page-with-sidebar .woocommerce.columns-4 ul.products li.product .woo-type12 .dt-sc-one-fourth .price, .with-both-sidebar ul.products li.product .woo-type12 .dt-sc-one-third .price, .with-both-sidebar .woocommerce.columns-3 ul.products li.product .woo-type12 .dt-sc-one-third .price { font-size: 10px; } .page-with-sidebar ul.products li.product:hover .woo-type12 .dt-sc-one-fourth .product-details .product-rating-wrapper, .page-with-sidebar .woocommerce.columns-4 ul.products li.product:hover .woo-type12 .dt-sc-one-fourth .product-details .product-rating-wrapper, .with-both-sidebar ul.products li.product:hover .woo-type12 .dt-sc-one-third .product-details .product-rating-wrapper, .with-both-sidebar .woocommerce.columns-3 ul.products li.product:hover .woo-type12 .dt-sc-one-third .product-details .product-rating-wrapper { right: 8px; } .page-with-sidebar ul.products li.product:hover:not(.purchasable) .woo-type12 .dt-sc-one-fourth .product-details .product-rating-wrapper, .page-with-sidebar .woocommerce.columns-4 ul.products li.product:hover:not(.purchasable) .woo-type12 .dt-sc-one-fourth .product-details .product-rating-wrapper, .with-both-sidebar ul.products li.product:hover:not(.purchasable) .woo-type12 .dt-sc-one-third .product-details .product-rating-wrapper, .with-both-sidebar .woocommerce.columns-3 ul.products li.product:hover:not(.purchasable) .woo-type12 .dt-sc-one-third .product-details .product-rating-wrapper { margin-right: 0; right: 50%; width: auto; -webkit-transform: translateX(50%); -moz-transform: translateX(50%); transform: translateX(50%); } .woo-type12 .page-with-sidebar ul.products li.product .woo-type12 .dt-sc-one-fourth .product-details .product-rating-wrapper .star-rating, .woo-type12 .page-with-sidebar .woocommerce.columns-4 ul.products li.product .woo-type12 .dt-sc-one-fourth .product-details .product-rating-wrapper .star-rating, .woo-type12 .with-both-sidebar ul.products li.product .woo-type12 .dt-sc-one-third .product-details .product-rating-wrapper .star-rating, .woo-type12 .with-both-sidebar .woocommerce.columns-3 ul.products li.product .woo-type12 .dt-sc-one-third .product-details .product-rating-wrapper .star-rating { font-size: 9px; margin: 10px 0 0; } .woo-type12 div.product .woocommerce-tabs ul.tabs li.active a:after { height: 1.5px; } .woo-type12 .product .summary div[itemprop="description"], .woo-type12 div.product .woocommerce-tabs .panel { line-height: 30px; } .woo-type12 .quantity .qty, .woo-type12.woocommerce-page .quantity .qty, .woo-type12 #coupon_code.input-text { height: 40px; min-height: 40px; } .woo-type12 .quantity .qty, .woo-type12.woocommerce-page .quantity .qty { padding: 0; } .woo-type12 #coupon_code.input-text { padding-top: 0; padding-bottom: 0; } .woo-type12 form .form-row .select2-container { line-height: 39px; } .woocommerce ul.products li.product-category .woo-type12 .product-details h5 { padding:15px 0 20px; } .woocommerce ul.products li.product .woo-type12 .product-thumb:after { content: ""; overflow: hidden; position: absolute; right: 0; top: 0; z-index: 1; width:100%; height:100%; left:0; z-index:0; } .woocommerce ul.products li.product.outofstock .woo-type12 .product-thumb:after, .woocommerce ul.products li.product.sale .woo-type12 .product-thumb:after { content: ""; border-style: none solid solid none; border-width: 0 40px 40px 0; overflow: hidden; position: absolute; right: 0; top: 0; z-index: 1; border-color: rgba(255,255,255,0.35) rgba(255,255,255,0.35) rgba(255,255,255,0.75) rgba(255,255,255,0.75); width:auto; height:auto; left:auto; z-index:0; } .woocommerce ul.products li.product.outofstock:hover .woo-type12 .product-thumb:after, .woocommerce ul.products li.product.sale:hover .woo-type12 .product-thumb:after, .woocommerce ul.products li.product:hover .woo-type12 .product-thumb:after { background-color: rgba(255,255,255,0.65); width:100%; height:100%; left:0; border:none; } .woocommerce ul.products.list-view li.product .woo-type12 .product-description { color:#fff; } /*-------------------------------------------------------------- 3.0 - General --------------------------------------------------------------*/ .woo-type12.woocommerce input[type="text"], .woo-type12.woocommerce input[type="password"], .woo-type12.woocommerce input[type="email"], .woo-type12.woocommerce input[type="url"], .woo-type12.woocommerce input[type="tel"], .woo-type12.woocommerce input[type="number"], .woo-type12.woocommerce input[type="range"], .woo-type12.woocommerce input[type="date"], .woo-type12.woocommerce textarea, .woo-type12.woocommerce input.text, .woo-type12.woocommerce input[type="search"], .woo-type12.woocommerce select, .woo-type12 .woocommerce input[type="text"], .woo-type12 .woocommerce input[type="password"], .woo-type12 .woocommerce input[type="email"], .woo-type12 .woocommerce input[type="url"], .woo-type12 .woocommerce input[type="tel"], .woo-type12 .woocommerce input[type="number"], .woo-type12 .woocommerce input[type="range"], .woo-type12 .woocommerce input[type="date"], .woo-type12 .woocommerce textarea, .woo-type12 .woocommerce input.text, .woo-type12 .woocommerce input[type="search"], .woo-type12 .woocommerce select { font-family: inherit; font-size: inherit; } /*-------------------------------------------------------------- 4.0 - Browser Fix --------------------------------------------------------------*/ @-moz-document url-prefix() { .woo-type12 .quantity .qty, .woo-type12.woocommerce-page .quantity .qty { height: 42px; min-height: 42px; } .woo-type12 #coupon_code.input-text { height: 38px; min-height: 38px; } .woo-type12 form .form-row .select2-container { line-height: 40px; } } /*-------------------------------------------------------------- 5.0 - Default Color --------------------------------------------------------------*/ /*----*****---- << Backgrounds >> --****--*/ ul.products li.product .woo-type12 .product-details { background-color: #000; } ul.products li.product .woo-type12 .product-details h5:before { background: rgba(255,255,255,0.2); } ul.products li.product:hover .woo-type12 .product-content, ul.products li.product:hover .woo-type12 .product-details h5:before { background-color: rgba(255, 255, 255,0.75); } /*----*****---- << Borders >> --****--*/ ul.products li.product:hover .woo-type12 .product-content:after { border-color: rgba(255, 255, 255,0.75) rgba(255, 255, 255,0.75) rgba(255, 255, 255,0.35) rgba(255, 255, 255,0.35); } ul.products li.product .woo-type12 .product-wrapper { border-color: rgba(0,0,0,0); } ul.products li.product .woo-type12 .product-thumb a.add_to_cart_button, ul.products li.product .woo-type12 .product-thumb a.button.product_type_simple, ul.products li.product .woo-type12 .product-thumb a.button.product_type_variable, ul.products li.product .woo-type12 .product-thumb a.added_to_cart.wc-forward, ul.products li.product .woo-type12 .product-thumb a.add_to_wishlist, ul.products li.product .woo-type12 .product-thumb .yith-wcwl-wishlistaddedbrowse a, ul.products li.product .woo-type12 .product-thumb .yith-wcwl-wishlistexistsbrowse a, .woocommerce ul.products li.product .woo-type12 .product-buttons-wrapper a.yith-wcqv-button, .woocommerce ul.products li.product .woo-type12 .product-buttons-wrapper a.yith-woocompare-button { -webkit-box-shadow: 0 0 0 3px #fff; -moz-box-shadow: 0 0 0 3px #fff; -ms-box-shadow: 0 0 0 3px #fff; -o-box-shadow: 0 0 0 3px #fff; box-shadow: 0 0 0 3px #fff; } /*----*****---- << Colors >> --****--*/ ul.products li.product .woo-type12 .product-details h5 a, .woo-type12 ul.products li.product-category .product-details h5, .woo-type12 ul.products li.product-category .product-details h5 .count, ul.products li.product .woo-type12 .product-details .product-price .amount, ul.products li.product .woo-type12 .product-details span.price, ul.products li.product .woo-type12 .product-details span.price del, ul.products li.product .woo-type12 .product-details span.price del .amount, ul.products li.product .woo-type12 .product-details span.price ins, ul.products li.product .woo-type12 .product-details span.price ins .amount, ul.products li.product .woo-type12 .product-details .product-rating-wrapper .star-rating:before, ul.products li.product .woo-type12 .product-details .product-rating-wrapper .star-rating span:before, .woocommerce ul.products li.product .woo-type12 .product-details h5 .count, ul.products li.product .woo-type12 .product-details h5 { color: #fff; } /*-------------------------------------------------------------- 6.0 - Responsive --------------------------------------------------------------*/ /* Note: Design for a width of 960px */ @media only screen and (min-width:992px) and (max-width:1199px) { ul.products li.product .woo-type12 .product-details h5 { font-size: 12px; } } /*----*****---- << Tablet (Portrait) >> ----*****----*/ /* Note: Design for a width of 768px */ @media only screen and (min-width:768px) and (max-width:991px) { ul.products li.product .woo-type12 .product-details h5 { font-size: 10px; } ul.products li.product .woo-type12 .product-details .product-price { padding: 0 10px; } ul.products li.product:hover .woo-type12 .product-details .product-rating-wrapper { right: 8px; } } @media only screen and (max-width: 319px) { .woocommerce ul.products li.product .woo-type12 .dt-sc-one-fourth .product-buttons-wrapper a.add_to_cart_button, .woocommerce ul.products li.product .woo-type12 .dt-sc-one-fourth .product-buttons-wrapper a.button.product_type_simple, .woocommerce ul.products li.product .woo-type12 .dt-sc-one-fourth .product-buttons-wrapper a.button.product_type_variable, .woocommerce ul.products li.product .woo-type12 .dt-sc-one-fourth .product-buttons-wrapper a.added_to_cart.wc-forward, .woocommerce ul.products li.product .woo-type12 .dt-sc-one-fourth .product-buttons-wrapper a.add_to_wishlist, .woocommerce ul.products li.product .woo-type12 .dt-sc-one-fourth .product-buttons-wrapper .yith-wcwl-wishlistaddedbrowse a, .woocommerce ul.products li.product .woo-type12 .dt-sc-one-fourth .product-buttons-wrapper .yith-wcwl-wishlistexistsbrowse a, .woocommerce ul.products li.product .woo-type12 .dt-sc-one-fourth .product-buttons-wrapper a.yith-wcqv-button, .woocommerce ul.products li.product .woo-type12 .dt-sc-one-fourth .product-buttons-wrapper a.yith-woocompare-button { width: 35px; height: 35px; } .woocommerce ul.products li.product .woo-type12 .dt-sc-one-fourth .product-buttons-wrapper a.add_to_cart_button:before, .woocommerce ul.products li.product .woo-type12 .dt-sc-one-fourth .product-buttons-wrapper a.added_to_cart.wc-forward:before, .woocommerce ul.products li.product .woo-type12 .dt-sc-one-fourth .product-buttons-wrapper a.button.product_type_simple:before, .woocommerce ul.products li.product .woo-type12 .dt-sc-one-fourth .product-buttons-wrapper a.button.product_type_variable:before, .woocommerce ul.products li.product .woo-type12 .dt-sc-one-fourth .product-buttons-wrapper .add_to_wishlist:before, .woocommerce ul.products li.product .woo-type12 .dt-sc-one-fourth .product-buttons-wrapper .yith-wcwl-wishlistaddedbrowse a:before, .woocommerce ul.products li.product .woo-type12 .dt-sc-one-fourth .product-buttons-wrapper .yith-wcwl-wishlistexistsbrowse a:before, .woocommerce ul.products li.product .woo-type12 .dt-sc-one-fourth .product-buttons-wrapper a.yith-wcqv-button:before, .woocommerce ul.products li.product .woo-type12 .dt-sc-one-fourth .product-buttons-wrapper a.yith-woocompare-button:before { font-size: 17px; line-height: 35px; } }