8889841chome/clixcotz/gj.clix.co.tz/wp-content/themes/superio/sass/template/_woocommerce.scss000064400000312707150514204360025147 0ustar00/*------------------------------------------- Style for woocommerce -------------------------------------------*/ .added_to_cart, .woocommerce input.button:disabled, .woocommerce input.button:disabled[disabled], .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt, .woocommerce #respond input#submit, .woocommerce input.button, .woocommerce button.button,.woocommerce a.button{ @include border-radius(8px); line-height: 1; font-size: 16px; font-weight: 500; text-align:center; display: inline-block; padding:17px 25px !important; border:0; background:$theme-color; @include transition(all 0.4s ease-in-out 0s); color: #fff; &:hover,&:focus{ background: var(--superio-theme-hover-color); color: #fff; } } .pp_gallery ul{ height: auto; a{ height: auto; } } .woocommerce table.shop_attributes{ th{ font-size: 16px; font-family:$font-family-second; font-weight: normal; text-transform: uppercase; width:30%; padding:18px; background-color:#fff !important; } td{ padding:18px; background-color:#fff !important; p{ padding:0; } } } .woocommerce div.product form.cart .variations select{ height: 40px; } .woocommerce #respond input#submit.loading, .woocommerce a.button.loading, .woocommerce button.button.loading, .woocommerce input.button.loading{ @include opacity(1); padding-right:$padding-base-horizontal; &:after{ top: 50%; right: 0; color:$theme-color; margin:0; z-index:3; width:100%; margin-top: -7px; } &:before{ @include opacity(0.9); z-index:2; position:absolute; top:0; left:0; background:#fff; @include size(100%,100%); content:''; } } .woocommerce div.product div.images .woocommerce-product-gallery__trigger{ border:1px solid $theme-color; background:$theme-color; @include transition(all 0.2s ease-in-out 0s); &:hover,&:active{ background: var(--superio-theme-hover-color); } &:before{ border-color:#fff; } &:after{ background:#fff; } } @media(min-width:1200px){ .woocommerce div.product div.images .flex-control-thumbs li{ width: 33.33%; &:nth-child(3n + 1){ clear: left; } } } .woocommerce div.product div.images .flex-control-thumbs{ margin-left: -10px; margin-right: -10px; margin-top: 20px; li{ padding-right:10px; padding-left:10px; margin-bottom: 20px; img{ border:1px solid #fff; @include opacity(0.8); @include transition(all 0.2s ease-in-out 0s); &:hover, &:active, &.flex-active{ border-color:$theme-color; } } } } .shop-pagination{ .apus-pagination{ margin:0; @include rtl-float-left(); } .woocommerce-result-count{ @include rtl-float-right(); margin:5px 0 0; } } .woocommerce div.product form.cart .variations{ margin-bottom: 0; } table.variations{ .tawcvs-swatches .swatch-color{ @include opacity(1); @include size(24px,24px); line-height: 24px; position:relative; border:none; @include rtl-margin-right(15px); &:before{ display:none !important; } &:after{ content:''; @include border-radius(50%); z-index:2; position:absolute; top:-1px; left:-1px; @include size(26px,26px); border:5px solid #fff; } &.selected{ @include box-shadow(none); &:after{ top:1px; left:1px; @include size(22px,22px); border:3px solid #fff; } } } .tawcvs-swatches .swatch-label{ font-size:12px; font-weight:400; color:$text-color; padding:9px; display:inline-block; line-height:1; background:#f2f3f5; min-width:30px; text-align:center; height:auto; width:auto; border:none !important; @include border-radius(50%); @include rtl-margin-right(8px); text-transform:uppercase; @include opacity(1); &.selected{ @include box-shadow(none); background:$theme-color; color:#fff; } } tr:last-child{ } } .woocommerce div.product form.cart .variations td.label{ padding:10px 0; text-align: inherit; display: table-cell; vertical-align: middle; label{ margin:0; } } .woocommerce div.product form.cart.swatches-support .variations td.label{ vertical-align:top; } .woocommerce div.product form.cart .reset_variations{ color: $brand-danger; i{ font-size: 12px; @include rtl-margin-right(3px); color: #e23e1d; } } .woocommerce #respond input#submit.added:after, .woocommerce a.button.added:after, .woocommerce button.button.added:after, .woocommerce input.button.added:after{ display: none; } .woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea{ line-height: $line-height-base; resize: none; border:1px solid #F0F5F7; background:#F0F5F7; @include transition(all 0.2s ease-in-out 0s); @include box-shadow(none !important); @include border-radius($border-radius-base); text-align: inherit; &::-webkit-input-placeholder { /* Chrome/Opera/Safari */ @include opacity(1); } &::-moz-placeholder { /* Firefox 19+ */ @include opacity(1); } &:-ms-input-placeholder { /* IE 10+ */ @include opacity(1); } &:-moz-placeholder { /* Firefox 18- */ @include opacity(1); } &:focus{ border-color:$theme-color; background-color: transparent; } } .refund-shop{ margin-bottom:$theme-margin; } .woocommerce form .form-row { textarea{ padding:20px; height:150px; resize:none; @media(min-width: 1200px){ height: 200px; } } } .woocommerce table.wishlist_table thead th{ padding:10px 0; color:$headings-color; border-bottom:1px solid $border-color; @media(min-width:992px){ padding:20px 0; } } .woocommerce table.wishlist_table tbody td{ padding:10px 0; text-align: inherit; border-width:0 0 1px; border-bottom:1px solid $border-color; @media(min-width:992px){ padding:20px 0; } } .woocommerce table.wishlist_table tfoot td { border:none; } .woocommerce table.wishlist_table{ font-size:$font-size-base; .product-name{ white-space: nowrap; padding-right:20px; padding-left:20px; @media(min-width:992px){ padding-right:50px; padding-left:50px; } } .media-body{ width:auto; } .product-thumbnail{ a{ display: block; width: 80px; @media(min-width: 1200px){ width:170px; } } } } .yith-wcwl-share{ margin: 20px 0; > *{ vertical-align: middle; display: inline-block; } .yith-wcwl-share-title{ font-size: 18px; margin: 0; @include rtl-padding-right(10px); } ul{ li{ + li{ @include rtl-margin-left(5px); } } } } #yith-wcwl-popup-message{ line-height: inherit; color: $brand-success; } #yith-wcwl-popup-message{ border:1px solid $brand-success; } .track_order{ max-width:770px; margin:auto; padding:$theme-margin / 2; background:#f2f3f5; @media(min-width:992px){ padding:70px; } .form-row{ width:100% !important; input.input-text{ padding:5px 20px; background:#fff !important; height:$input-height-base; } &:last-child{ margin-bottom:0; } label{ font-family: $font-family-second; color:$link-color; } } } .woocommerce-message{ line-height: 2.5; } .apus-filter{ .woocommerce-message{ display: none; } } #add_payment_method #payment ul.payment_methods, .woocommerce-cart #payment ul.payment_methods, .woocommerce-checkout #payment ul.payment_methods{ border:0; padding:0; li{ margin-bottom: 12px; .payment_box{ padding:5px 25px 0; margin: 0; font-size: 14px; background-color: transparent !important; color: $text-color-second; &:before{ display: none !important; } } label{ display: inline; font-size: 16px; cursor: pointer; font-weight: 500; color: $link-color; } .about_paypal{ margin:0 10px; float:none; } } } #add_payment_method #payment ul.payment_methods li input, .woocommerce-cart #payment ul.payment_methods li input, .woocommerce-checkout #payment ul.payment_methods li input{ @include rtl-margin-right(10px); } // thank you .icon-thankyou{ display: inline-block; @include border-radius(50%); line-height: 50px; @include size(50px,50px); font-size: 21px; color: $theme-color; background-color: var(--superio-theme-color-015); @media(min-width: 1200px){ line-height: 80px; @include size(80px,80px); font-size: 28px; } text-align: center; } .woocommerce table.shop_table{ border:0; @include border-radius(0); th{ border:0; padding: 15px; @media(min-width:1200px){ padding: 25px 30px; } color: $theme-color; font-size: 16px; font-weight: 500; } .reader-text{ display: none; } td{ border:none; border-top:1px solid $border-color; overflow: hidden; padding:15px; @media(min-width:1200px){ padding:30px; } } .quantity-wrapper{ > label{ display: none; } } .product-remove{ .remove{ display: inline-block; @include size(30px,30px); border:0; line-height: 30px; text-align: center; font-size: 12px; color:$text-color !important; background-color: transparent !important; @include transition(all 0.2s ease-in-out 0s); margin:0; &:hover,&:active{ color:$brand-danger !important; } } } tbody{ .actions{ p{ margin: 0; } } .product-subtotal{ color: $link-color; font-size: 16px; } .order-total{ .woocommerce-Price-amount{ color: #222; font-weight:600; font-size: 15px; } } .product-name{ font-weight: 500; font-size: 16px; } .cart-subtotal, .order-total{ .woocommerce-Price-amount{ font-size: 20px; font-weight: 400; } } } thead{ overflow: hidden; background-color: #F5F7FC; @include border-radius($border-radius-base); } .list-bundles{ font-size:14px; list-style:none; @include rtl-padding-left(25px); strong{ font-weight:500; } ul{ list-style:inside none disc; padding:0; margin:0; } } } .woocommerce .cart_totals{ > h2{ margin:0 0 15px; font-size: 18px; @media(min-width:992px){ margin:0 0 20px; } } table.shop_table{ border:none; margin:0; th,td{ border-color: $border-color; padding:10px 0; background-color: transparent !important; @media(min-width:992px){ padding:15px 0; } .woocommerce-Price-amount{ color: $text-color-second; font-size:15px; font-weight:400; } } label{ font-weight:400; } strong{ font-weight: 500; } th{ color: $link-color; font-weight: 500; font-size: 16px; } } .wc-proceed-to-checkout{ padding:10px 0 0; } } .woocommerce-error li, .woocommerce-info li, .woocommerce-message li{ font-weight: 400; } #add_payment_method #payment, .woocommerce-cart #payment, .woocommerce-checkout #payment{ .place-order{ padding:0 !important; margin: 0; } } .woocommerce #customer_details{ .woocommerce-shipping-fields, .woocommerce-account-fields{ margin-top: 10px; } h3.form-row{ font-size: 18px; font-weight: 400; text-transform: capitalize; margin: 0; padding:20px 0; } .shipping_address{ > *{ > .select2-hidden-accessible{ height: 0; } } } } .woocommerce form .woocommerce-billing-fields, .woocommerce form .woocommerce-shipping-fields{ > h3{ font-size: 18px; margin: 0 0 20px; input[type="checkbox"]{ position:static; margin:0; @include rtl-margin-right(5px); } } .select2-container{ height:$input-height-base; } .woocommerce-billing-fields__field-wrapper{ > *{ > label{ font-weight: 400; color: $link-color; margin-bottom: 7px; } > .select2-container, > select, > input{ overflow: hidden; width: calc(100% - 200px) !important; border-width:0 0 1px; border-style:solid; border-color:$border-color; padding:10px 0; @include border-radius(0 !important); @include rtl-float-right(); &:focus{ border-color:$theme-color; } } > .select2-hidden-accessible{ height: 0; } } } } .woocommerce .cart-collaterals .cart_totals, .woocommerce-page .cart-collaterals .cart_totals{ width: 100%; float: none; } .cart-collaterals{ padding:15px; @media(min-width: 1200px){ padding:$theme-margin; } background-color: #F5F7FC; @include border-radius($border-radius-base); } .yith-wcwl-add-to-wishlist .ajax-loading{ margin: auto; position: absolute; top:0; bottom: 0; left: 0; right: 0; } .yith-wcwl-add-button{ position: relative; } .woocommerce div.product .product_title{ font-size: 25px; margin:0 0 5px; font-weight: 500; @media(min-width: 1200px){ font-size: 30px; margin:0 0 15px; } } .woocommerce p.stars.selected a.active::before, .woocommerce p.stars:hover a::before, .woocommerce p.stars.selected a:not(.active):before{ content: ''; } .woocommerce div.product .stock{ font-size: $font-size-base; color: $text-color-second; &:before{ content: "\f058"; font-weight: 900; font-family: 'Font Awesome 5 Free'; display: inline-block; @include rtl-margin-right(5px); font-size: 16px; } } .woocommerce div.product p.price, .woocommerce div.product span.price{ color: $text-color; font-size: 15px; font-weight: 400; del{ font-size: 14px; color: $text-color; font-weight: 400; } ins{ font-weight: 500; } } .woocommerce div.product p.price del, .woocommerce div.product span.price del{ @include opacity(1); } .variations{ label{ color: $text-color; font-size: 15px; text-transform: capitalize; font-weight: 400 !important; @include rtl-padding-right(5px); } .value{ padding: 0; } } .woocommerce div.product form.cart .group_table{ border:none; margin-bottom: 10px; .price del{ font-size: 12px !important; } .price, .price ins{ font-size: 15px !important; color: $theme-color; } label{ font-weight:500; } td{ vertical-align: middle; &:first-child{ padding-right:0; @include rtl-text-align-left(); } } .quantity{ .reader-text{ display:none; } } } .woocommerce div.product form.cart.group_product{ width:100%; + .yith-wcwl-add-to-wishlist{ margin:10px 0 0; } } .woocommerce div.product form.cart .group_table .label{ padding: 0.5em; vertical-align: middle; font-size:14px; display: table-cell; text-align: inherit; white-space: normal; label{ font-weight: 400; } } .woocommerce div.product form.cart .variations td{ line-height: inherit; font-size: inherit; .tawcvs-swatches{ padding:0; } padding:10px 0; vertical-align: middle; } .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; height: 50px; padding: 5px 20px !important; @include rtl-margin-right(10px !important); @media(min-width: 1200px){ @include rtl-margin-right(20px !important); } @include border-radius($border-radius-base); } .woocommerce table.cart td.actions{ padding-left: 0; padding-right: 0; [name="apply_coupon"]{ @media(min-width: 1200px){ min-width: 200px; text-align: center; } } [name="update_cart"]{ @media(min-width: 1200px){ min-width: 200px; text-align: center; } background-color: var(--superio-theme-color-007); color: $theme-color; @include opacity(1); &:hover,&:focus{ color: #fff; background-color: $theme-color; } } } .page-cart{ margin-bottom: $theme-margin; @media(min-width: 1200px){ margin-bottom: 50px; &.row{ margin-left: -25px; margin-right: -25px; > [class *="col"]{ padding-left: 25px; padding-right: 25px; } } } } #add_payment_method table.cart img, .woocommerce-cart table.cart img, .woocommerce-checkout table.cart img{ width: 100px; padding:5px; border:1px solid $border-color; @include border-radius($border-radius-base); } .woocommerce .percent-sale, .woocommerce span.onsale{ color:#fff; font-size: 12px; background:$theme-color; padding:6px 10px; position: absolute; text-align: center; left:0; text-transform:uppercase; top: 0; min-height: auto; z-index: 9; @include border-radius(2px); display: inline-block; line-height: 1; &:before{ content:''; position:absolute; top:100%; right:6px; border-width:3px; border-style:solid; border-color:$theme-color $theme-color transparent transparent; } } //popup-cart .popup-cart{ .title-count, .title-add{ font-size: 20px; margin: 0 0 20px; } .gr-buttons{ margin: 50px 0 0; } .title-add{ color: $brand-success; } .image{ img{ max-width: 100px; } } .name{ margin: 30px 0 0; } .widget-product{ margin-top: 30px; } } #apus-cart-modal{ .btn-close{ position: absolute; top:0; @include rtl-right(0); z-index: 99; background: #fff; @include size(30px,30px); line-height: 26px; text-align: center; display: inline-block; } .modal-content{ background: #ffffff none repeat scroll 0 0; min-width: 1000px; max-width: 100%; margin-top: 50px; } .modal-body{ padding: 60px; } } .name{ @include font-size(font-size,14px); margin: 0 0 18px; @include text-overflow(); } .product-block{ position:relative; .sale-perc{ background: #fd5f5c; color: #ffffff; font-size: 14px; font-weight: 400; padding: 0 5px; line-height: 1.7; position: absolute; @include rtl-left(12px); text-transform: uppercase; font-family: $font-family-three; top: 12px; z-index: 8; } .out-of-stock{ background: darken(#e1e1e1, 5%); color: #fff !important; font-size: 14px !important; font-weight: 400; padding: 0 8px; position: absolute; @include rtl-right(12px); text-transform: uppercase; font-family: $font-family-second; top: 12px; z-index: 8; } .image{ position: relative; overflow: hidden; .downsale{ font-size: 12px; font-weight: 500; display: inline-block; position: absolute; right:0; top:0; z-index: 8; padding:2px 10px; @include border-radius(2px); background:#d42e2e; color: #fff; } img{ display: inline-block; @include transition(all 0.5s ease-in-out 0s); } .image-effect{ top: 0; position: absolute; left:50%; @include translateX(-50%); z-index: 2; @include opacity(0); } .image-no-effect{ @include scale(1); } } .block-inner{ &:hover{ .image{ .image-hover{ @include opacity(0); } .image-effect{ @include opacity(1); } } } &.text-center{ .image{ img{ margin:auto; } .image-effect{ left:50%; @include translateX(-50%); } } } } .rating{ > *{ display: inline-block !important; vertical-align: middle; margin:0 !important; float: none; } .counts{ color: #999591; font-size: 13px; } } .feedback, .sub-title{ display: none; } .product-image{ position:relative; display:block; } .metas{ margin-top: 15px; @include transition(all 0.3s ease-in-out 0s); } &:hover{ .image .image-no-effect{ @include scale(1.1); } } // product grid &.grid{ position:relative; margin:0 0 15px; padding:$theme-margin / 2; @media(min-width:768px){ margin-bottom:$theme-margin; padding:$theme-margin $theme-margin 25px; } background: #fff; border:1px solid $border-color; @include border-radius(8px); overflow:hidden; @include transition(all 0.4s ease-in-out 0s); .name{ font-size:16px; margin:0; } .image{ &.out{ .product-image{ @include opacity(0.5); } } } .groups-button{ .button, .add_to_cart_button{ &.added{ display: none; } } } .product-cat{ margin: 0 0 8px; font-size:12px; font-family: $font-family-three; letter-spacing: 2px; text-transform: uppercase; a{ color: $theme-color; } } .groups-button{ @include transition(all 0.3s ease-in-out 0s); position: absolute; width: 100%; z-index: 1; bottom: 0; left: 0; padding:0 15px 15px; @media(min-width:1200px){ padding:0 30px 30px; } @include opacity(0); @include translateY(15px); visibility: hidden; } .add-cart{ .added_to_cart, .button{ width: 100%; } } &:hover{ @include box-shadow( 0 6px 15px 0 rgba(#404F68,0.1) ); .metas{ @include opacity(0); } .groups-button{ @include opacity(1); @include translateY(0); visibility: visible; } } } } .product-block-search{ @media(min-width: 768px){ .price{ margin-bottom: 15px; display: block; } } h4.entry-title{ margin:0 0 10px; } @media(max-width: 767px){ .groups-button{ display: none; } } } // products list .products-list{ .product-block-list{ margin:0 0 20px; @media(min-width:768px){ margin:0 0 30px; } } } .product-block-list{ padding:15px; border:1px solid $border-color; overflow: hidden; @include transition(all 0.3s ease-in-out 0s); @media(min-width: 1200px){ padding:30px; background:#fff; } .onsale{ top:0 !important; left:0 !important; } &:hover{ border-color:$theme-color; } .quickview{ font-size: 13px; font-family: $font-family-three; display: block; text-align: center; background:#f1f3fa; color: $link-color; padding:9px; text-transform: uppercase; @include transition(all 0.3s ease-in-out 0s); &:hover,&:focus{ color: #fff; background:$theme-color; } &.loading{ position:relative; &:before{ font-family: 'WooCommerce'; content: '\e01c'; vertical-align: top; -webkit-font-smoothing: antialiased; font-weight: 400; position: absolute; top: 11px; right: 46%; animation: spin 2s linear infinite; -webkit-animation: spin 2s linear infinite; color: $text-color; z-index: 9; } &:after{ background:rgba(255, 255, 255, 0.9); position:absolute; top: 0; left: 0; @include size(100%,100%); z-index: 8; content: ''; } } } .product-cat{ font-family: $font-family-three; text-transform: uppercase; letter-spacing: 2px; font-size: 12px; } .name{ font-family: $font-family-second; font-size: 24px; margin:0 0 10px; font-weight:400; @media(min-width: 1200px){ font-size: 30px; } } // wishlist .yith-wcwl-add-to-wishlist{ .sub-title{ display: none; } } .cate-wrapper{ margin: 0 0 8px; .product-cats{ margin:0; } } .compare{ white-space: nowrap; font-size: 14px; font-family:$font-family-three; display: inline-block; width:100%; padding:15px; background:#fff; color: #4c4c4c; text-transform: uppercase; text-align: center; @include transition(all 0.3s ease-in-out 0s); @include border-radius(50px); border:1px solid $border-color; line-height: 1; &.added, &:hover,&:focus{ color: #fff; border-color:$theme-color; background:$theme-color; } } // action .add-cart { margin-bottom: 10px; margin-top: 10px; @media(min-width: 1200px){ margin-top: 20px; } .added{ display: none !important; } .wc-forward { width: 100%; } .added_to_cart, a.button{ font-size: 14px; font-family:$font-family-three; display: inline-block; width:100%; padding:15px; background:#fff; color: $theme-color; text-transform: uppercase; text-align: center; @include transition(all 0.3s ease-in-out 0s); @include border-radius(50px); border:1px solid $theme-color; line-height: 1; &:hover,&:focus{ color:#fff; background:$theme-color; border-color:$theme-color; } &.loading{ &:after{ margin-top: -7px; } } } } .top-list-info{ position:relative; .yith-wcwl-add-to-wishlist{ position: absolute; top:0; @include rtl-right(0); } } .yith-wcwl-add-to-wishlist{ display:inline-block; a{ display:inline-block; padding:0; font-size:18px; @include transition(all 0.2s ease-in-out 0s); &:hover,&:focus{ color:$theme-color; } &:not(.add_to_wishlist){ color:$theme-color; } } } .rating{ margin-bottom:15px; > *{ display: inline-block; float: none; vertical-align: text-top; line-height: 1; } .counts{ @include rtl-margin-left(2px); } } // price .price{ display: block; margin-top: 10px; @media(min-width: 1200px){ margin-top: 20px; } font-family: $font-family-second; font-weight:400; font-size: 24px !important; color:$theme-color !important; margin:0; del{ color: #b7b7b7; font-family: $font-family-base; font-size:14px !important; } } .avaibility-wrapper{ margin-bottom: 20px; font-size: 14px; } .bottom-list{ margin-top:35px; > div{ @include rtl-float-left(); } } .flex-middle{ overflow: hidden; } .left-infor{ @include rtl-padding-left(20px); position:relative; @media(min-width: 1200px){ @include rtl-padding-left(30px); } &:before{ content:''; position:absolute; top:-200px; @include rtl-left(0); @include size(1px,1000px); background:$border-color; } } .bottom-list{ > *{ display:inline-block; vertical-align:top; } } .wrapper-image{ position:relative; .quickview{ position:absolute; bottom:0; left:0; width:100%; @include translateY(10px); @include opacity(0); z-index: 8; } .swatches-wrapper{ z-index:8; list-style:none; padding:0; margin:0; line-height:1.2; text-align:center; position:absolute; left:0; width:100%; bottom:20px; li{ display:inline-block; vertical-align:middle; @include rtl-margin-right(5px); &:last-child{ @include rtl-margin-right(0); } } .label{ padding:5px 8px; font-size:$font-size-base; color:$text-color; font-weight:500; display:inline-block; background:#fff; @include border-radius(0); } .swatch-color{ display:inline-block; @include size(12px,12px); @include border-radius(50%); } } &:hover{ .quickview{ @include opacity(1); @include translateY(0); } } } } // list small .shop-list-small{ @include transition(all 0.2s ease-in-out 0s); border:1px solid $border-color; padding:10px; @media(min-width: 1200px){ padding:30px; } .content-left{ width: 110px; @include rtl-base-toprightbottomleft(padding,0,15px,0,0); @include rtl-float-left(); } .content-body{ overflow: hidden; width: calc(100% - 110px); } .name{ margin:0 0 2px; font-size: 16px; font-family: $font-family-second; } &:hover{ border-color:$theme-color; z-index: 2; } } .shop-list-normal{ margin-bottom:20px; .content-left{ @include transition(all 0.2s ease-in-out 0s); width:90px; @include rtl-float-left(); border:1px solid $border-color; padding:5px; @media(min-width: 1200px){ width: 110px; } } .content-body{ width:calc(100% - 90px); overflow: hidden; @include rtl-padding-left(15px); @media(min-width: 1200px){ @include rtl-padding-left(25px); width:calc(100% - 110px); } } .name{ margin:0 0 2px; font-size: 16px; font-family: $font-family-second; } &:hover{ .content-left{ border-color:$theme-color; } } } // shop-list-smallest .shop-list-smallest{ .name{ a{ color: $link-color; &:hover,&:active{ color:$theme-color; text-decoration: none; } } } .content-left{ width: 90px; @include rtl-padding-right(20px); } } .woocommerce.carousel.inner-list-smallest{ border-top:1px solid $border-color; .shop-list-smallest{ margin-bottom:0; border-top:none; } } // single product .woocommerce .woocommerce-product-rating{ .star-rating{ margin: 0; display: inline-block; float: none; vertical-align: middle; } .woocommerce-review-link{ display: inline-block; font-size:14px; vertical-align: sub; } } .woocommerce #content div.product div.summary, .woocommerce div.product div.summary, .woocommerce-page #content div.product div.summary, .woocommerce-page div.product div.summary, .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: 100%; } .single_variation_wrap{ div.qty{ font-size: 15px; text-transform: uppercase; color: $text-color; font-family: $font-family-three; margin-top: 10px; @include rtl-margin-right(10px); } } .wrapper-shop{ @media(min-width:1024px){ padding-top:50px; padding-bottom:50px; } .apus-pagination{ border-top:1px solid $border-color; padding-top: 40px; margin-top: 0; } aside.sidebar{ background: transparent; } } .thumbnails-image{ ul{ list-style: none; margin:0; padding:0; } .prev, .next{ display: block; width: 100%; text-align:center; font-size: 18px; color: #000; } .thumb-link{ display: block; @include opacity(0.4); margin: 10px 0; &:hover, &.active{ @include opacity(1); } } } .user_photo_thumbs{ list-style: none; padding: 0; text-align: center; margin: 10px 0 0; li{ display: inline-block; margin:0 4px; width: 70px; @include opacity(0.4); @include transition(all 0.3s ease-in-out 0s); &:hover,&.active,&:active{ @include opacity(1); } } } .user_photo{ margin-top: 50px; } .delivery_info{ text-align:center; background:#f5f5f5; font-size: 14px; padding:8px; @include transition(all 0.3s ease-in-out 0s); &:hover{ background:darken(#f5f5f5, 10%); } i{ font-size: 16px; @include rtl-margin-right(10px); } } .details-product{ color: $text-color-second; .shipping_info{ margin-top: 15px; @media(min-width:1200px){ margin-top: 40px; } @include transition(all 0.3s ease-in-out 0s); &:hover{ color: $text-color; } ul{ list-style: none; padding:0; margin:0; i{ @include rtl-margin-right(6px); } li{ margin-bottom:0px; @media(min-width: 1200px){ margin-bottom:5px; } &:last-child{ margin-bottom: 0; } } } } .price-rating-wrapper{ margin-top: 10px; @media(min-width: 1200px){ margin-top: 20px; } clear: both; overflow: hidden; .price{ @include rtl-margin-right(15px !important); line-height: 1.4; del{ display: block !important; } } > *{ display: inline-block; vertical-align: bottom; } } .pro-info{ @media(min-width: 1200px){ font-size: 30px; } margin: 0 0 20px; } .popup-video{ background:#fff; height: 40px; line-height: 40px; min-width: 40px; overflow: hidden; display: inline-block; @include box-shadow(0 0 10px 0 rgba(0, 0, 0, 0.2)); @include border-radius(50px); @include transition(all 0.3s ease-in-out 0s); @include flexbox; align-items: center; -webkit-align-items: center; /* Safari 7.0+ */ flex-direction:row; -webkit-flex-direction:row; i{ height: 40px; line-height: 40px; width: 40px; font-size: 13px; text-align: center; text-indent: 3px; } span{ @include transition(all 0.3s ease-in-out 0s); white-space:nowrap; max-width: 0; padding: 0; overflow: hidden; } &:hover{ span{ max-width: 280px; @include rtl-padding-right(12px); } } } .product-cat{ font-family: $font-family-three; text-transform: uppercase; letter-spacing: 2px; font-size: 12px; a{ color: $theme-color; } } // tab div.video{ z-index: 8; position:absolute; @include rtl-left(10px); bottom:10px; @media(min-width: 768px){ @include rtl-left(20px); bottom:20px; } } .apus-countdown { margin-top: 5px; } .special-product{ padding:8px 0; } .apus-countdown .times{ > span{ color: $theme-color-second; margin-bottom:5px; } margin-bottom: 5px; > div{ text-align: center; vertical-align: middle; min-width: 40px; font-size: 12px; display: inline-block; font-weight: 400; text-transform: uppercase; margin:0 5px; padding:8px; &:first-child{ @include rtl-margin-left(0); } span{ font-weight: 500; margin-bottom:5px; @include border-radius(3px); font-size: 18px; display: block; color: $link-color; } } } .top-content{ margin-bottom: 30px; @media(min-width: 1200px){ margin-bottom: 80px; } } .apus-woocommerce-product-gallery-thumbs{ .slick-slide{ &:hover, &:active, &.slick-current{ .thumbs-inner{ border-color:$theme-color; } } .thumbs-inner{ @include transition(all 0.2s ease-in-out 0s); max-width:100%; display: block; cursor: pointer; position: relative; border:1px solid $border-color; padding:5px; @include border-radius(4px); overflow: hidden; &:hover{ border-color:$theme-color; } } } // fix for position &.vertical{ margin:0; .slick-slide{ padding:0; margin-bottom: 10px; border:none; } .slick-arrow{ text-align: center; background-color:transparent !important; border:none !important; @include box-shadow(none !important); i{ @include size(30px,30px); background-color:#fff; @include border-radius(50%); @include box-shadow(0 0 1px 1px rgba(0, 0, 0, 0.2)); line-height: 30px; display: inline-block; @include transition(all 0.2s ease-in-outs 0s); } &:hover,&:focus{ i{ color: #fff; background-color:$theme-color; @include box-shadow(none); } } } .slick-prev{ top: -40px; bottom:100%; @include translate(0,-5px); width: 100%; left:0; font-size: 11px; } .slick-next{ width: 100%; top: 100%; bottom:inherit; @include translate(0,0); right:0; font-size: 11px; } } } .image-mains{ max-width:100%; position:relative; text-align: center; .apus-woocommerce-product-gallery-wrapper.full-width{ width:100% !important; float: none !important; } .slick-slide img{ display: inline-block; } &.thumbnails-bottom{ @media(max-width: 991px){ .apus-woocommerce-product-gallery-wrapper{ margin-bottom:20px; } } .slick-carousel{ margin-left: -10px; margin-right: -10px; .slick-slide{ padding-left:10px; padding-right:10px; } } } &.thumbnails-left{ .apus-woocommerce-product-gallery-wrapper{ width:calc(100% - 100px); @media(min-width: 1200px){ width:calc(100% - 160px); } float:right; } .wrapper-thumbs{ float:left; width:100px; padding-right:20px; @media(min-width: 1200px){ padding-right:30px; width:160px; } } @media(max-width:767px){ .apus-woocommerce-product-gallery-wrapper{ width:calc(100% - 70px); } .wrapper-thumbs{ width:70px; padding-right:10px; } } } &.thumbnails-right{ .apus-woocommerce-product-gallery-wrapper{ width:calc(100% - 160px); float:left; } .wrapper-thumbs{ float:right; width:160px; padding-left:20px; @media(min-width: 1200px){ padding-left:30px; } } @media(max-width:767px){ .apus-woocommerce-product-gallery-wrapper{ width:calc(100% - 70px); } .wrapper-thumbs{ width:70px; padding-left:10px; } } } } .description{ .title{ font-size:21px; } } .apus-woocommerce-product-gallery-wrapper{ position: relative; padding:15px; background-color:#fff; @include border-radius($border-radius-base); border:1px solid $border-color; .downsale{ font-size: 12px; font-weight: 500; display: inline-block; position: absolute; left:0; top:0; z-index: 9; padding:2px 10px; @include border-radius(0); background:#d42e2e; color: #fff; } .apus-woocommerce-product-gallery { margin:0; overflow: hidden; @include border-radius(4px); .slick-slide{ padding:0; } } .woocommerce-product-gallery__trigger{ position: absolute; z-index: 8; top: 15px; @include opacity(0.7); @include rtl-right(15px); @include size(35px,35px); line-height: 35px; @media(min-width: 1200px){ top: 30px; @include rtl-right(30px); @include size(45px,45px); line-height: 45px; } display: inline-block; text-align: center; border:0; @include border-radius(50%); font-size: 14px; @include transition(all 0.3s ease-in-out 0s); color:#fff; background: $theme-color; &:hover,&:active{ @include opacity(1); } } &:hover{ .woocommerce-product-gallery__trigger{ @include opacity(1); } } } .woocommerce-product-details__short-description{ &.hideContent{ overflow: hidden; height: 60px; @include transition(all 0.2s ease-in-out 0s); } } .woocommerce-variation-add-to-cart{ width: 100%; overflow: hidden; } .list{ li{ margin-bottom: 10px; } i{ color: $theme-color; @include rtl-margin-right(8px); } } .woocommerce-variation-price{ margin-bottom: 15px; } .product_meta{ overflow:hidden; clear:both; margin-top:15px; @media(min-width:1200px){ margin-top:30px; } > span{ display: block; margin-bottom: 2px; a{ color: $text-color-second; &:hover,&:focus{ color: $link-color; } } } .sub_title{ display: inline-block; @media(min-width: 1200px){ min-width: 110px; } } } .information{ position: relative; overflow: hidden; @media(min-width: 1200px){ @include rtl-padding-left(10px); } .summary { float: none !important; width: 100%; margin: 0 !important; } .single_variation_wrap{ padding-top:10px; } .price{ color: $link-color !important; font-size: 26px !important; font-weight: 500 !important; margin-bottom: 20px; } .woocommerce-product-rating{ margin-bottom:10px !important; } .woocommerce-product-details__short-description{ margin-bottom:15px; p:last-child{ margin-bottom: 0; } ul{ list-style: none; padding:0; margin:0; i{ display: inline-block; @include rtl-margin-right(7px); } li{ margin-bottom: 5px; &:last-child{ margin-bottom: 0; } } } } .view-more-desc{ font-size: 14px; color: #b7b7b7; @include transition(all 0.2s ease-in-out 0s); &:hover{ color: $link-color; } &.view-less{ color: $brand-danger; } } .woocommerce-product-details__short-description-wrapper.v2{ margin-bottom: 15px; @media(min-width: 1200px){ margin-bottom: 30px; } .woocommerce-product-details__short-description{ margin-bottom: 3px; } } .top-info-detail{ margin-bottom:15px; } .cart{ width:100%; &.grouped_form, &.variations_form{ + .yith-wcwl-add-to-wishlist{ margin:0; } } margin:0 0 10px !important; @media(min-width: 1200px){ margin: 0 0 25px !important; } .group_table{ tr{ td:first-child{ div.quantity{ margin:0 !important; } } } ~ .button{ @include rtl-margin-left(0); } } div.quantity-wrapper{ overflow: hidden; margin:0; @include rtl-float-left(); > *{ display: inline-block; vertical-align: middle; float: none !important; } > label{ display: none; } } .button{ @include rtl-margin-left(10px); @media(min-width: 1200px){ @include rtl-margin-left(15px); min-width: 240px; text-align: center; } } .quantity.hidden{ + .button{ margin:0; } } &.grouped_form{ .quantity-wrapper{ margin:0 !important; label{ display: none; } } } } // creat button .compare{ white-space: nowrap; font-size: 14px; font-family:$font-family-three; display: inline-block; width:100%; padding:15px; background:#fff; color: #4c4c4c; text-transform: uppercase; text-align: center; @include transition(all 0.3s ease-in-out 0s); @include border-radius(50px); border:1px solid $border-color; line-height: 1; &:hover,&:focus{ color: #fff; border-color:$theme-color; background:$theme-color; } &.added{ color: #fff; border-color:$theme-color; background:$theme-color; } } .clear{ display: none; } .product_title{ clear: both; } } .title-cat-wishlist-wrapper{ position:relative; @include rtl-padding-right(30px); margin-bottom:20px; @media(min-width: 1200px){ margin-bottom: 30px; } // wishlist .yith-wcwl-add-to-wishlist{ position:absolute; top:5px; @include rtl-right(0); margin:0; line-height: 1; .feedback{ display:none; } a{ white-space: nowrap; display:inline-block; font-size:24px; color:$link-color; @include transition(all 0.2s ease-in-out 0s); &:focus, &:hover{ color:$theme-color; } &:not(.add_to_wishlist){ color:$theme-color; } .sub-title{ display:none; } } } } // social .apus-social-share{ margin-top: 10px; span{ font-size:15px; display:inline-block; @include rtl-margin-right(15px); } a{ @include rtl-margin-right(10px); @media(min-width: 1200px){ @include rtl-margin-right(15px); } display: inline-block; color: #b3b7c8; &:hover,&:active{ color: $theme-color; } } } // discount .apus-discounts{ margin:20px 0 15px; padding:15px 20px; background: #eceff6; font-size: 13px; ul{ margin:0; list-style: none; padding:0; li{ margin: 0 0 3px; &:before{ font-family: 'FontAwesome'; color:$theme-color; content: "\f00c"; @include rtl-margin-right(8px); } } } .icon{ display: inline-block; vertical-align: middle; @include size(35px,35px); text-align: center; line-height: 35px; color: #fff; background: darken(#eceff6,20%); font-size: 14px; @include border-radius(50%); @include rtl-margin-right(10px); } .title{ font-size: 18px; margin:0 0 10px; } } .product-free-gift{ margin:0 0 20px; padding:15px 20px; background: $state-danger-bg; .icon{ display: inline-block; vertical-align: middle; @include size(35px,35px); text-align: center; line-height: 35px; color: #fff; background: #e23e1d; font-size: 14px; @include border-radius(50%); @include rtl-margin-right(10px); } .title{ font-size: 18px; margin:0 0 10px; } .list-gift{ font-size: 13px; list-style: none; padding:0; margin:0; li{ margin-bottom: 3px; } i{ color: #e23e1d; } } .hightcolor{ font-weight: 500; color: #e23e1d; } } } .accessoriesproducts-wrapper{ position: relative; &.loading:before{ position: absolute; @include size(100%,100%); top: 0; left: 0; z-index: 99; content: ''; background:url('#{$image-theme-path}loading-quick.gif') center center no-repeat rgba(255,255,255,0.9); } } .accessoriesproducts{ .product-block.grid{ margin-bottom: 25px; .accessory-add-product{ position: absolute; @include rtl-left(10px); bottom: -25px; } } .check-all-items-wrapper{ margin: 0 0 10px; input{ @include rtl-margin-right(6px); } } .total-price-wrapper{ font-size: 14px; color: $link-color; margin: 0 0 5px; } .total-price{ display: block; color: $theme-color-second; font-size: 18px; font-weight: normal; } } /*------------------------------------*\ Product Category and Subcategories \*------------------------------------*/ .product-category{ .product-category-content{ position: relative; overflow: hidden; min-height: $product-category-content-height; margin: $product-category-content-margin; } .product-category-image{ display: block; img{ @include img-responsive(); } } .product-category-title{ text-transform: none; position: absolute; text-align: center; bottom: 0; @include rtl-left(0); width: 100%; font-weight: $product-category-title-font-weight; @include font-size(font-size,$product-category-title-font-size); color: $product-category-title-color; margin: $product-category-title-margin; padding: $product-category-title-padding; background: rgba($product-category-title-bg, .3); .count{ background: transparent; color: $product-category-title-color; } } } /*------------------------------------*\ Quickview \*------------------------------------*/ #apus-quickview-modal{ .product_meta{ margin: ($theme-margin / 2) 0 0; } } /** * * Woocommerce Form */ .form-row { .checkbox, .input-radio{ margin-bottom: 0; margin-top: 0; } } .woocommerce form .form-row{ margin: 0 0 20px; padding:0; } .woocommerce .col2-set .col-2, .woocommerce-page .col2-set .col-2, .woocommerce .col2-set .col-1, .woocommerce-page .col2-set .col-1{ width: 100%; } /* End ------------------------------------------------*/ p.demo_store { top: 0; position:fixed; @include rtl-left(0); @include rtl-right(0); @include size(percentage(1),auto); @include rtl-text-align-center(); @include font-size(font-size,$font-size-md); padding: .5em 0; z-index: 99998; border: 1px solid darken($border-color, 10); @include box-shadow(0, 0, 0, 3px, rgba($white,0.2)); } /*-------------------------------*\ Utilities \*------------------------------------*/ #respond { h3.comment-reply-title{ font-size:18px; margin:0 0 20px; #cancel-comment-reply-link{ color:$brand-danger; } } label{ color: $text-color; font-weight: 400; } } .woocommerce #reviews #comment { height: 150px; resize: none; @media(min-width: 1200px){ height: 200px; } } /*------------------------------------*\ Quantity inputs \*------------------------------------*/ .woocommerce .quantity .qty{ width: 100px; @include border-radius(8px); height:50px; border:1px solid $border-color; padding:10px 20px; color:$text-color; outline: none !important; } .woocommerce .quantity{ .reader-text{ font-size: 14px; font-weight: 400; margin-bottom: 0; @include rtl-margin-right(10px); } } .woocommerce a.remove{ @include border-radius(0); } /*------------------------------------*\ Forms \*------------------------------------*/ .form-row { @include clearfix(); label.hidden { visibility:hidden; } label.inline { display: inline; } label{ display: block; font-weight: 400; color: $link-color; } select { cursor: pointer; } .required { color: $red; font-weight: $headings-font-weight; border: 0; } .input-text{ width: 100%; padding: 11px 20px; } &.form-row-first{ width: 47%; @include rtl-float-left(); } &.form-row-last{ width: 47%; @include rtl-float-right(); } &.form-row-wide{ clear: both; } } .select2-container .select2-choice{ padding:5px 7px; } .product-quantity{ .input-text{ @include input-size('.input-sm', $input-height-small, $padding-base-vertical, $padding-base-vertical, $font-size-small, $line-height-small, 0); } } .i-am-new{ li{ background-image: none !important; background-color: $white !important; -webkit-border-radius: 0px !important; border-radius: 0px !important; .noty_message{ padding: 20px 0 !important; } } } /*------------------------------------*\ Mini cart and wishlist \*------------------------------------*/ .total-minicart{ color: $link-color; font-weight:normal; font-family: $font-family-three; font-size: 16px; @include rtl-margin-left(5px); display: inline-block; } .wishlist-icon, .mini-cart{ display: inline-block; position:relative; padding:0; color:$link-color; i{ font-size: 22px; margin:0 !important; } .count{ position:absolute; top:-5px; left:15px; display: inline-block; font-size: 10px; color: #fff; background:$theme-color; @include border-radius(50%); line-height: 15px; min-width: 15px; padding:0 3px; text-align: center; } } .wishlist-icon{ i{ @include rtl-margin-right(6px); } } /*------------------------------------*\ Star ratings \*------------------------------------*/ .woocommerce p.stars{ a:before{ content: "\53"; font-family: 'star'; color: $star-rating-active-color; @include transition(all 0.1s ease-in-out 0s); } &:hover{ a:before{ content: "\53"; font-family: 'star'; } } a:hover{ ~ a:before{ content: "\53"; color: $star-rating-color; } } &.selected{ a:not(.active)::before{ content: "\53"; } a.active{ &:before{ content: "\53"; } ~ a:before{ content: "\53"; color: $star-rating-color; } } } } .woocommerce #review_form #respond{ border:1px solid $border-color; @include border-radius(10px); padding:20px; margin-top: 25px; @media(min-width: 1200px){ padding:50px; margin-top: 55px; } #commentform{ margin: 0; } .stars{ font-size: 14px; height: 16px; margin:0; letter-spacing: 3px; } [for="rating"]{ @include rtl-margin-left(12px); } .comment-form-cookies-consent{ margin-bottom: 15px; } .comment-form-rating-woo{ margin-bottom: 15px; } .form-submit{ margin-bottom: 0; } #submit{ min-width: 330px; text-align: center; } } .woocommerce { .star-rating { margin: auto 0; overflow: hidden; position: relative; @include size(83px, 1.2em); line-height: 1em; font-family: 'star'; @include font-size(font-size,$star-rating-font-size); letter-spacing: 3px; &:before { content: "\53\53\53\53\53"; color: $star-rating-color; @include rtl-float-left(); top: 0; @include rtl-left(0); position: absolute; } span { overflow: hidden; @include rtl-float-left(); top: 0; @include rtl-left(0); position: absolute; padding-top: 1.5em; } span:before { content: "\53\53\53\53\53"; top: 0; position: absolute; @include rtl-left(0); color: $star-rating-active-color; } } .woocommerce-review-link{ color: #999591; } } /*------------------------------------*\ Filter \*------------------------------------*/ .archive-shop{ padding-bottom: 20px; @media(min-width: 1200px){ padding-bottom: 70px; } .page-title{ display: none; } } .show-filter{ font-size:18px; color:$theme-color; cursor:pointer; font-weight:400; text-transform:uppercase; letter-spacing:1px; @include transition(all 0.2s ease-in-out 0s); &:hover,&:active{ color:$theme-color; } i{ @include rtl-margin-left(10px); } } .apus-shop-menu{ font-size: 15px; margin:0; position:relative; .filter-action{ i{ @include rtl-margin-right(3px); } } ul.apus-filter-menu{ padding:0; margin:5px 0 0; list-style: none; @include rtl-float-right(); li{ display: inline-block; } } ul.apus-categories{ @include rtl-float-left(); padding:0; margin:2px 0 0; list-style: none; li{ display: inline-block; @include rtl-margin-right(40px); a{ text-transform: capitalize; padding:0; font-size: 16px; font-weight:500; color:$link-color; position:relative; display:inline-block; } .product-count{ font-size: 14px; color: $text-color; margin: 0 2px; vertical-align: top; display: inline-block; } &.current-cat{ > a{ color:$theme-color; } } } .apus-shop-sub-categories{ padding:0px; margin: 10px 0 0; li{ a{ font-size: 16px; } } } } .content-inner{ #apus-orderby{ @include rtl-margin-left(40px); } } } //apus-shop-header .apus-shop-header{ background: transparent; @include transition(all 0.3s ease); &.filter-active{ background: #ffffff; border-bottom: 1px solid #eeeeee; margin-bottom: 30px; } .apus-sidebar-header{ display: none; border:1px solid $theme-color; padding:20px 30px; background:#fff; } .apus-widget-scroll{ ul{ li{ padding:0; list-style: none; font-size: 14px; margin: 0 0 10px; } } } .apus-sidebar-inner{ padding: 0 15px; ul{ padding:0; margin:0; list-style: none; } .apus-widget-title{ font-weight: 400; font-size: 18px; text-transform: capitalize; margin:0 0 20px; } } .widget_layered_nav ul li a, .product-categories li a{ font-size: 14px; padding:0 !important; } .widget_layered_nav ul li .count, .product-categories li .count{ float: none; } .widget_layered_nav , .product-categories{ li.chosen{ color: $theme-color; > a{ color: $theme-color; } } } } .apus-categories-dropdown{ appearance: none; -webkit-appearance: none; -moz-appearance: none; border:none; color: $link-color; font-size: 14px; margin-top: 4px; .category-dropdown-label{ cursor: pointer; } option { font-size: 16px; color: $text-color; &[selected="selected"]{ color: $link-color; } } .dropdown-menu{ min-width: 200px; padding:20px 30px; @include border-radius(0); border:1px solid $theme-color; @include box-shadow(none); ul{ list-style:none; padding:0; margin:0; li{ margin: 0 0 5px; a{ color: $text-color; &:hover,&:active{ color: $link-color; } } &.active{ color: $link-color; } &:last-child{ margin: 0; } } } } } .before-shop-header-wrapper{ position:relative; @media(min-width:768px){ .before-shop-loop-fillter{ position:absolute; top:20px; } } } .pagination-top{ margin-top:-6px; .apus-pagination.pagination-woo{ margin:0; } .apus-pagination .apus-pagination-inner{ padding:0; } &.has-fillter{ .apus-pagination .apus-pagination-inner{ padding:0 $theme-margin; } } } .apus-filter{ margin-bottom: $theme-margin / 2; @media(min-width: 1200px){ margin-bottom: $theme-margin; } .woocommerce-result-count{ margin:0; color: $link-color; } #apus-orderby{ @include rtl-float-left(); } .woocommerce-ordering{ margin:0; } .orderby-wrapper{ > *{ display:inline-block; vertical-align:middle; float:none; } } select{ font-size: 14px; color: $text-color-second; appearance: none; -webkit-appearance: none; -moz-appearance: none; background: url("#{$image-theme-path}select.png") #F0F5F7 right 20px center no-repeat; font-weight: 400; padding:10px 20px; @include border-radius($border-radius-base); border:1px solid #F0F5F7; margin:0; @include transition(all 0.3s ease-in-out 0s); &:focus{ border-color: $theme-color; } } .display-mode{ margin-top: 4px; } .change-view{ color: #cccccc; i{ font-size: 24px; vertical-align: middle; } display: inline-block; + .change-view{ @include rtl-margin-left(10px); @media(min-width: 1200px){ @include rtl-margin-left(20px); } } &:hover, &.active{ color: $theme-color; } } .form-superio-ppp{ .superio-wc-wppp-select{ @media(min-width: 1200px){ min-width: 190px; } } } } // show .form-superio-ppp{ @include rtl-float-left(); select{ font-size: 16px; color: $text-color; appearance: none; -webkit-appearance: none; -moz-appearance: none; background: url("#{$image-theme-path}select.png") #fff right 10px center no-repeat; font-weight: 400; border:1px solid $border-color; padding:3px 20px; @include border-radius(2px); margin:0; border:1px solid $border-color; } } #apus-orderby{ .orderby-label{ color: $text-color; display: inline-block; font-size:14px; font-weight: 300; cursor: pointer; border:1px solid $border-color; @include border-radius(50px); padding:4px 15px; } .dropdown-menu{ min-width: 200px; padding:20px 30px; @include border-radius(5px); @include border-radius(0); border:1px solid $theme-color; @include box-shadow(none); ul{ list-style:none; padding:0; margin:0; li{ margin: 0 0 5px; a{ color: $text-color; &:hover,&:active{ color: $link-color; } } &.active{ color: $link-color; } &:last-child{ margin: 0; } } } } } /*------------------------------------*\ Mini Cart \*------------------------------------*/ .apus-topcart{ // cursor: pointer; .dropdown-menu{ top: 50px; margin:0; padding: 20px; min-width: 280px; @media(min-width: 1200px){ max-width: 340px; } display: block; border:none; @include border-radius(0); @include box-shadow(0 10px 40px -10px rgba(0,0,0,0.15)); background: #fff; @include opacity(0); display: none; } .buttons{ margin: 0; .btn{ @include border-radius(50px); } .wc-forward{ text-transform: uppercase; display: block; margin-bottom: 10px; &:last-child{ margin: 0; } &:after{ vertical-align: text-top; } } } .open{ .dropdown-menu{ display: block; @include opacity(1); } } .overlay-offcanvas-content{ background:rgba(0,0,0,0.5); position:fixed; top:0; left:0; @include size(100%,100%); @include opacity(0); @include transition(all 0.3s ease-in-out 0s); cursor: no-drop; @include translateX(-30px); visibility: hidden; z-index: 2; &.active{ visibility: visible; @include opacity(1); @include translateY(0); } } .offcanvas-content{ z-index: 3; position:fixed; right:0; top:0; background:#fff; @include transition(all 0.35s ease-in-out 0s); @include opacity(0); width:400px; height: 100vh; @include translateX(100%); &.active{ @include opacity(1); @include translateY(0); } .shopping_cart_content .cart_list{ max-height: calc(100% - 180px); } .title-cart-canvas{ font-size: 16px; text-align: center; margin:0 0 10px; padding:10px; border-bottom:1px solid $border-color; text-transform: uppercase; position:relative; .close-cart{ position:absolute; top:11px; @include rtl-left(14px); z-index: 1; background:#fff; font-size: 18px; cursor: pointer; color: $brand-danger; } } .shopping_cart_content{ padding:10px; @media(min-width: 1200px){ padding:15px 15px 30px; } height: calc(100vh - 50px); display: -webkit-flex; /* Safari */ display: flex; flex-wrap:wrap; -webkit-flex-wrap: wrap; .cart-bottom{ align-self:flex-end; -webkit-align-self:flex-end; width:100%; } .cart_list { width:100%; } } } } .shopping_cart_content{ font-size: 14px; .variation{ margin:0 0 3px; overflow: hidden; dt{ @include rtl-margin-right(5px); } dt,dd{ @include rtl-float-left(); p{ margin: 0; } } } .cart_list{ padding:0 0 10px; max-height: 270px; overflow: hidden; > div{ margin: 0 0 20px; overflow:hidden; &.empty{ border:none; margin:0; color: $link-color; } &:last-child{ border:none; } } .image{ @include size(70px,70px); padding:5px; border:1px solid $border-color; display: block; img{ @include size(60px,60px); max-width: none; } } .quantity{ font-family:$font-family-second; font-size:16px; color:$theme-color; padding:0; line-height: 1; } .name{ font-family: $font-family-base; margin:0; font-size:14px; } .cart-item{ margin: 0; font-size: 16px; } .media-body{ width: 1000px; @include rtl-padding-right(20px); } .cart-main-content{ @include rtl-text-align-left(); position: relative; .remove{ position: absolute; @include rtl-right(0); top: 25px; z-index: 9; font-size: 13px; background:transparent !important; color:$text-color !important; &:hover,&:focus{ color: $brand-danger !important; } } } .cart-item{ overflow:hidden; } } .total{ color: $theme-color; border-top:1px solid $border-color; overflow: hidden; position: relative; margin: 0; font-weight: 400; text-transform: uppercase; padding:20px 0; font-size:14px; font-family:$font-family-second; strong { font-weight:400; } .amount{ font-size: 18px; @include rtl-float-right(); } &.empty{ border:none; margin:0; padding-top:0; } } } .woocommerce a.remove{ padding:0; margin: auto; color: $brand-danger; font-size: 32px; background:transparent; } /** Plugins add to wishlist, compare **/ .place-order{ padding: $theme-margin; } .yith-wcwl-add-button > a i, .wishlist_table .add_to_cart.button i{ margin: 0!important; } .yith-wcwl-share{ ul{ @include clear-list; } } .input-text { border: 1px solid #e5e5e5; padding: 5px 10px; } .woocommerce{ address{ margin-bottom: 20px; } } .product-categories{ list-style: none; margin: 0; font-size: 14px; padding:0; overflow:hidden; + .view-more-list-cat{ position:absolute; background:#fff; bottom:1px; left:1px; width: calc(100% - 2px); z-index: 99; display: block; color: $brand-success; padding:5px 54px 15px; &.view-less{ color: $brand-danger; } &:hover,&:active{ text-decoration: underline; } } &.hideContent{ height: 435px; } &.showContent{ height: auto; } .children{ list-style: none; padding:0; } li{ li{ @include rtl-padding-left(20px); } line-height: 32px; &.current-cat-parent, &.current-cat, &:hover{ > .count{ color: $theme-color; } > a{ color: $theme-color; } } .count{ font-family: $font-family-base; font-size: 14px; font-weight: 400; display: inline-block; @include rtl-float-right(); margin-top:3px; } a{ @include transition(all 0.2s ease-in-out 0s); color: $text-color; &:hover,&:active{ color: $theme-color; } } &.cat-parent{ position:relative; > i{ @include rtl-padding-right(12px); cursor: pointer; position:absolute; @include rtl-left(0); top:13px; } } } } .top-archive-shop{ padding-bottom:$theme-margin; } .add-cart{ >.added{ display: none !important; } .added_to_cart{ &:after{ display: none; } } } .apus-shop-products-wrapper{ &.loading{ position:relative; &:before{ background: url('#{$image-theme-path}loading-quick.gif') center 100px / 50px no-repeat rgba(#ffffff, 0.9); position: absolute; width: 100%; height: 100%; content: ""; left: 0; top: 0; z-index: 99; } } } // my account .woocommerce-account .woocommerce-MyAccount-content, .woocommerce-account .woocommerce-MyAccount-navigation{ width: 100%; float: none; } .woocommerce-account .woocommerce-MyAccount-navigation{ border-bottom: 2px solid #eeeeee; .woocommerce-MyAccount-navigation-link{ @include rtl-margin-right(30px); display: inline-block; a{ padding: 0 0 7px; position: relative; display: inline-block; &:before{ @include size(100%,2px); background: $theme-color; position: absolute; bottom:-2px; left: 0; content: ''; @include scale(0); @include transition(all 0.2s ease-in-out 0s); } } &.is-active,&:hover,&:active{ > a{ color: $theme-color; &:before{ @include scale(1); } } } } } .woocommerce-MyAccount-content{ padding:20px 0; h2{ margin: 20px 0 10px; text-transform: uppercase; font-size: 18px; font-family: $font-family-second; } } .edit-account{ br{ display: none; } input[ type="text"], input[ type="password"]{ height: 40px; @include border-radius(3px); &:focus{ border-color: $border-color; } } legend{ font-size: 72px; font-weight: 300; border:none; margin: 30px 0 0; } label{ font-weight: normal; font-size: 16px; color: $link-color; } } .woocommerce-MyAccount-content, .woocommerce-MyAccount-navigation{ max-width: 970px; margin: auto; } .user{ .title{ font-size: 20px; margin:0 0 20px; text-align: center; @media(min-width: 1200px){ font-size: 25px; } } } form.login, form.register{ margin: 0 !important; border:none !important; padding:0 !important; br{ display: none; } label{ font-weight: 400; } .form-control{ padding: 5px 20px; } .form-group { margin: 0 0 20px; &:last-child{ margin-bottom:0; } } .lost_password { a{ text-decoration: underline; } } .action-group{ font-size: 14px; } .input-text{ background:#fff !important; border:1px solid $border-color !important; height: 40px; &:focus{ border-color:darken($border-color, 10%) !important; } } input[ type="checkbox"]{ @include rtl-margin-right(7px); } .input-submit { ~ span{ margin:10px 0 0; &.pull-left{ @include rtl-margin-left(15px); } &.lost_password{ a{ color: $theme-color; } } } } .user-role{ padding-left:20px; [type="radio"]{ margin-top:11px; } } } .login-wrapper{ .mfp-content{ width:500px !important; max-width:80%; background-color:#fff; } .title{ text-align: center; } .apus-mfp-close{ font-size: 20px; display: inline-block; background:$brand-danger; color: #fff; display: inline-block; @include size(42px,42px); line-height: 42px; border:none; margin:-21px; @include border-radius(50%); @include transition(all 0.3s ease-in-out 0s); @include opacity(0.9); &:hover,&:focus{ @include opacity(1); } } } //cart .cart_item{ margin: 0 0 20px; padding:0 0 20px; border-bottom: 1px solid $border-color; > .media-left{ width: 70%; } img{ width: 90px; max-width:none; } .content-left{ overflow: hidden; @include rtl-padding-left(20px); } .price{ font-size: 20px; font-family: $font-family-second; color: #4c4c4c; font-weight: 400; } a.remove{ margin: 0 0 15px; display: inline-block; font-size: 32px; color: $text-color !important; &:hover,&:active{ color: $brand-danger !important; } } } div.cart{ .input-text { height: 53px; border:2px solid $border-color; &:focus,&:active{ border-color:$link-color; } } label{ font-size: 18px; color: #000; } } //order_review .woocommerce .order-review{ #order_review_heading{ font-size: 18px; margin: 0 0 10px; } table.shop_table{ margin:0; } } .review-order_table{ border:0; margin:0; td,th{ padding:12px 0; border:0; } th{ font-size: 16px; font-weight: 500; color: $link-color; &:nth-child( 2n ){ @include rtl-text-align-right(); } } td:nth-child( 2n ){ @include rtl-text-align-right(); } tbody{ strong{ font-weight: 400; } th,td{ border-top: 1px solid $border-color; } } tfoot{ strong{ font-weight: 500; } td{ font-weight: 500; font-size: 16px; color: $link-color; } } label{ font-weight: 500; } } .box-review-order{ background-color: #F5F7FC !important; @include border-radius($border-radius-base !important); padding:$theme-margin / 2; margin-bottom: 20px; @media(min-width: 1200px){ margin-bottom: $theme-margin; padding: $theme-margin; } } // step check out .apus-checkout-step{ padding:0 0 30px; ul{ padding:0; list-style:none; margin:0 auto; text-transform: uppercase; width: 100%; li{ position:relative; text-align: center; @include rtl-float-left(); @media(min-width:768px){ width: 33.33%; } } } li{ font-size: 20px; font-weight: 500; color: #232530; line-height: 60px; overflow: hidden; position: relative; background: #fff; &:first-child{ &:before{ display:none; } &:after{ border-width: 1px 0 1px 1px; } } &:before{ content:''; z-index: 1; position: absolute; top: 0px; left:-43px; border:1px solid $border-color; @include size(60px,60px); @include rotate(45deg); background: #fff; } &:after{ position:absolute; content:''; border-width: 1px 0; border-style: solid; border-color: $border-color; @include size(calc(100% - 30px),100%); z-index: 5; @include rtl-left(0); top:0; } .inner{ position: relative; &:after{ content:''; z-index: 1; position: absolute; top: 0px; right:-30px; border-style: solid; border-color:#fff #fff #fff transparent; border-width: 30px; @include size(60px,60px); background: #fff; } &:before{ content:''; z-index: 1; position: absolute; top: 0px; right:12px; border:1px solid $border-color; border-width: 1px 1px 0 0; @include size(60px,60px); @include rotate(45deg); background: #fff; z-index: 2; } } &.active{ background: $theme-color; color: #fff; &:after{ border-color:$theme-color; } .inner:after{ border-color:#fff $theme-color; } .inner:before{ display: none; } .step{ @include opacity(0.1); color: #fff; } } } .inner-step{ position: relative; z-index: 7; } .step{ z-index: 6; position: absolute; top: -1px; @include rtl-right(70px); line-height: 60px; font-size: 48px; text-transform: uppercase; font-weight: 600; display: inline-block; text-align: center; color: #eae9ec; } } .woocommerce-thankyou-order-received{ font-size: 22px; font-weight: 500; text-align:center; color: $headings-color; margin: 15px 0 0; @media(min-width:768px){ font-size: 30px; } } .woocommerce-order{ max-width: 770px; margin-right: auto; margin-left: auto; } .woocommerce-customer-details, .woocommerce-order-details{ padding:20px; margin-top: 30px; @media(min-width: 1200px){ padding:45px 50px 50px; margin-top: 60px; } border:1px solid $border-color; @include border-radius($border-radius-base); .woocommerce-column__title, .woocommerce-order-details__title{ font-size: 18px; margin:0 0 15px; } } .woocommerce .woocommerce-customer-details{ @media(min-width: 1200px){ margin-bottom: 90px; } address{ border:0; padding:0; line-height: 2; } } .woocommerce ul.order_details{ padding:15px; @include border-radius($border-radius-base); background-color: #F5F7FC; margin: 20px 0 0; clear: both; overflow: hidden; @media(min-width: 1200px){ margin-top: 40px; padding:40px; } li{ text-transform: capitalize; margin:0 0 10px; @include rtl-float-left(); font-size: $font-size-base; border: 0; width: 50%; padding:0 5px; @media(min-width: 768px){ width: 25%; padding:0 10px; margin-bottom: 0; } strong{ margin-top: 10px; font-weight: 500; font-size: 16px; color:$link-color; } } } .woo-pay-perfect{ font-size: 18px; font-weight: 600; text-align:center; margin-bottom: 20px; } .product-top-title{ position: relative; .view-more{ position:absolute; top: 5px; @include rtl-right(0); } } .layout-detail-product{ #tabs-list-specifications{ td{ padding:15px; border-color:#eff0f2; } td:first-child{ font-weight: 500; text-transform: uppercase; } } } .accessoriesproducts{ .list-accesories{ margin-bottom: 10px; } .check-item{ margin-top: 10px; } } // style for vendors .wcv-pro-vendorlist{ margin:0 0 30px; padding:0 0 30px; border-bottom: 1px solid $border-color; border-top: none; background: #fff; height: auto; .name-store{ font-size: 18px; margin:10px 0; } &:hover{ .avatar:before{ @include opacity(0.5); } } .avatar{ display: inline-block; position: relative; line-height: 0; max-width: 100%; &:before{ @include transition(all 0.2s ease 0s); content: ''; position: absolute; top: 0; left: 0; @include size(100%,100%); background:$theme-color; @include opacity(0); } } .metas{ margin:0 0 5px; > *{ display: inline-block; font-size: 14px; + *{ @include rtl-margin-left(20px); } } .total-value{ font-weight: normal; } } .store-address, .store-phone{ font-size: 14px; margin:0 0 7px; &:last-child{ margin: 0; } } } .pv_shop_description{ padding:0 ($theme-padding / 2) $theme-padding; } .special-progress{ margin: 5px 0 0; .claimed{ strong{ color: $link-color; } margin-bottom: 2px; } .progress{ background: #eaeaea; @include border-radius(50px); height: 12px; margin: 5px 0 17px; .progress-bar{ background: $theme-color; @include border-radius(50px); @include gradient-striped(); background-size: 10px 10px; } } } .single-rating{ margin:0 0 30px; padding:0 0 20px; border-bottom:1px solid $border-color; &:last-child{ border:none; padding:0; margin: 0; } .avatar{ max-width: none; min-width: 70px; @include border-radius(50%); } .media-left{ @include rtl-padding-right(20px); } .stars-value{ @include rtl-float-right(); .fa-star{ color: #fednormal; } } h4{ font-weight: 400; font-size: 10px; margin: 0 0 15px; color: $text-color; .name{ font-weight: normal; font-size: 12px; color: #464646; text-transform: uppercase; } } h6{ margin:0 0 15px; } } // style for dokan mutivendors .btn-showserach-dokan{ cursor: pointer; } .wrapper-dokan{ .btn-showserach-dokan { padding: 6px 9px; @include border-radius(50px); border-width: 2px; } .dokan-seller-search-form{ font-size: 14px; margin:0; width: 0; overflow: hidden; @include transition(all 0.2s ease-in-out 0s); input{ width: 100% !important; padding-top: 3px !important; padding-bottom: 3px !important; } &.active{ width: 220px; } } > *{ display: inline-block; vertical-align: top; @include rtl-margin-right(10px); } } #dokan-seller-listing-wrap ul.dokan-seller-wrap li{ margin-bottom: $theme-margin; } .dokan-list-inline{ > li{ > a{ font-family: $headings-font-family; } } } .dokan-widget-area, .dokan-store-menu{ #cat-drop-stack > ul{ list-style: none; padding:0; li { margin-bottom: 5px; &:last-child{ margin-bottom:0; } } a:hover,&:focus{ color: $theme-color; } } } .dokan-single-store .profile-frame.profile-frame-no-banner .profile-layout-layout3 .profile-info-summery-wrapper .profile-info-summery .profile-info .store-name{ font-weight: 500; } .dokan-single-store .profile-info .dokan-store-info{ list-style: none; font-size: 14px; li{ float: none !important; &:before{ display:none; } } } .dokan-store-location, .dokan-store-contact{ list-style: none; ul{ list-style: none; padding:0; } } .dokan-store-tabss{ .dokan-right{ margin:0; margin-top: 10px; } margin-bottom: 20px; @media(min-width: 768px){ margin-bottom: 30px; } } .dokan-store-sidebar #dokan-store-location{ height: 200px; width: 100%; } // style for gift .wfg-popup{ border:none !important; } .wfg-popup h2.wfg-title{ background:$theme-color; color: #fff; @include border-radius(0); @include box-shadow(none); } .wfg-gifts .wfg-gift-item h3{ background:#fff; color: $link-color; border-top:1px solid $border-color; } .wfg-gifts .wfg-gift-item{ border:1px solid $border-color; } // fix dokan vendors #dokan-seller-listing-wrap ul.dokan-seller-wrap li .store-footer .seller-avatar img{ margin:0; } #dokan-seller-listing-wrap{ ul.dokan-seller-wrap { .btn{ @include border-radius(50px); border-width:2px; padding:8px 30px; } } } #dokan-seller-listing-wrap ul.dokan-seller-wrap li .store-wrapper{ @include transition(all 0.3s ease-in-out 0s); &:hover{ @include box-shadow(0px 0px 35px 0px rgba(0,0,0,0.2)); } } .product-block{ .wcvendors_sold_by_in_loop{ position:absolute; z-index: 99; top:0; @include rtl-left(0); @include size(50px,50px); img{ max-width: 100%; max-height: 100%; @include border-radius(50%); } } } .seller-info-social{ list-style: none; li{ display: inline-block; @include rtl-margin-right(20px); } } .seller-info-top{ margin-bottom: 20px; .store-brand img{ max-width: none; } } // accoudion for detail #woocommerce-accordion{ .panel{ margin:0; border:none; border-bottom:1px solid $border-color; @include border-radius(0); > .panel-heading{ text-transform: uppercase; border:none; padding:18px 0; font-weight: 400; font-size: 16px; @include border-radius(0); background: #fff !important; &:hover,&:active{ a{ color: $theme-color; } } } .panel-title{ font-size: 16px; font-weight: 400; > :not(.collapsed){ color: $theme-color; } } .panel-body{ padding:0; border:none; } } .title{ margin:0 0 10px; font-size: 24px; } } //categories .wrapper-filter{ min-height:73px; position:relative; padding:20px 0; border-bottom:1px solid $border-color; } .shop-top-sidebar-wrapper{ background:#fff; padding:20px 0 0; @media(min-width:992px){ padding:40px 0 0; } display:block; overflow:hidden; width:100% !important; .dropdown{ > span{ color:#252525; font-weight:500; font-size:15px; display:block; margin:0 0 15px; text-transform:uppercase; } } .widget{ margin-bottom:0; } @media(max-width:767px){ margin-bottom:15px; } .shop-top-sidebar-wrapper-inner { margin-left:-15px; margin-right:-15px; > *{ padding-left:15px; padding-right:15px; @include rtl-float-left(); width:100%; @media(min-width:768px){ width:20%; } } } .wrapper-limit{ padding:10px; .apus-product-sorting, .apus-price-filter{ padding:0; margin:0; list-style:none; li{ margin-bottom:8px; &:last-child{ margin:0; } } a{ white-space:nowrap; } .active, .current{ color:$theme-color; } } .apus-product-sorting, .apus-price-filter, .woocommerce-widget-layered-nav-list{ height:200px; } } .tagcloud { height:200px; } } // fix for shop banner .products-wrapper-grid-banner{ .cl-3, .cl-2{ div.product{ &.col-sm-4{ &.first{ clear:none; } @media(min-width:768px){ &:nth-child(3n + 1){ clear:both; } } } } } .col-md-cus-5{ @include rtl-float-left(); padding-left:$theme-margin / 2; padding-right:$theme-margin / 2; @media(min-width:992px){ width:20%; } } } // style for bundles .product-bundles{ padding:20px 0; .product-item{ overflow:hidden; clear:both; margin-bottom:10px; .product-image{ @include rtl-float-left(); width:80px; @include rtl-padding-right(10px); } .product-content{ overflow:hidden; } .product-name{ display:block; color:$link-color; margin:3px 0; } } .total{ padding-bottom:10px; } .total-discount{ color:$brand-success; } .total-price{ font-size:18px; font-weight:500; color:$link-color; } } // categories .product-category { h3{ margin:15px 0 0; font-size: 18px; .count{ background:transparent; padding:0; } } .category-body{ margin:0 0 20px; text-align: center; @media(min-width: 768px){ margin:0 0 30px; } } } .related { margin-top: $theme-margin; } form.woocommerce-form-coupon{ .form-row{ width: 50% !important; } .form-row-first{ @include rtl-padding-right( $theme-padding / 2 ); @media(min-width: 1200px){ @include rtl-padding-right($theme-padding); } } }