@media all and (min-width: 769px) { :root { --layout-outer-width: 94%; } /* Reverse Layout for Even Items */ .spice-categories .spice-item:nth-child(even) { flex-direction: row-reverse; } /**** GLOBAL ***/ html:not(.html-home-page) .master-wrapper-content, .html-home-page .topic-block, .html-home-page .home-page-category-grid, .html-home-page .news-list-homepage, .html-home-page .home-page-polls, .html-home-page .home-page-product-grid { width: var(--layout-outer-width); } .home-page-polls li { min-width: 100px; } /**** GLOBAL TABLES ***/ .cart tr { width: 31.33333%; margin: 40px 1% 0; } .cart tr:nth-child(2n+1) { clear: none; } .cart tr:nth-child(3n+1) { clear: both; } .order-details-page .data-table tr { width: 31.33333%; margin: 40px 1% 0; } .order-details-page .data-table tr:nth-child(2n+1) { clear: none; } .order-details-page .data-table tr:nth-child(3n+1) { clear: both; } /*** HEADER ***/ .header-selectors-wrapper > div { width: 20%; } /*** FOOTER ***/ .footer-block { display: inline-block; width: 25.33333%; margin: 0 4%; vertical-align: top; } .footer-block .title { margin: 0 0 15px; background: none; padding: 0; cursor: auto; } .footer-block .list { display: block !important; /* prevents toggle display:none on resize */ background: none; padding: 0; } .footer-block .title strong { font-weight: 700; } .footer-block .list li { padding: 5px 0; font-size: 18px; } .footer-block .list a { display: inline; padding: 0; } /*footer ui*/ .follow-us { display: flex; justify-content: center; gap: 30px; flex-wrap: wrap; padding-block: 40px; width: 100%; } .follow-us > div { width: calc(33% - 20px); margin: 0; text-align: center; } .follow-us .title { text-align: center; } .newsletter-email { display: flex; justify-content: center; align-items: center; margin-bottom: 0; padding-bottom: 0; border: 0; } /*** Homepage Categories TABLES ***/ /* Target only the home page category grid */ .home-page-category-grid .category-item { overflow: hidden; } .home-page-category-grid .item-box .picture, .home-page-category-grid .item-box .picture a { position: static; margin: 0; } .home-page-category-grid .item-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; } /* Style for each item */ .home-page-category-grid .item-grid .item-box { width: 100%; margin: 0; grid-column: span 2; grid-row: span 1; } .home-page-category-grid .item-box:nth-child(5n + 4), .home-page-category-grid .item-box:nth-child(5n + 5) { grid-column: span 3; grid-row: span 1; } /* Every first item in a set of 5 spans 2 columns and 2 rows */ .home-page-category-grid .item-box:nth-child(5n + 1) { grid-column: span 4; grid-row: span 2; } /*** CATEGORY ***/ .product-selectors { text-align: left; } .product-selectors .product-viewmode { display: inline-block; float: right; } .product-selectors .product-viewmode span { display: none; } .product-selectors .product-viewmode a { display: inline-block; width: 24px; height: 32px; margin: 0 0 0 12px; background-position: center; background-repeat: no-repeat; opacity: 0.5; } .product-selectors .product-viewmode a.grid { background-image: url('../images/view-grid.png'); } .product-selectors .product-viewmode a.list { background-image: url('../images/view-list.png'); } .product-selectors .product-viewmode a.selected { opacity: 1; } .item-box { width: 47%; margin: 0 1.5% 50px; } .category-grid .item-box:nth-child(2n+1) { clear: none; } .category-grid .item-box:nth-child(3n+1) { clear: both; } .item-box:nth-child(n+1) { clear: none; } .item-box:nth-child(2n+1) { clear: both; } .product-list .item-box { float: none; width: auto; margin: 0 5px 30px; padding-bottom: 30px; } .product-list .item-box:not(:last-child) { border-bottom: 1px solid #ddd; } .product-list .item-box .product-item:after { content: ""; display: block; clear: both; } .product-list .item-box .picture { float: left; width: 220px; } .product-list .item-box:hover .picture a img, .product-list .item-box:focus .picture a img { opacity: 1; } .product-list .item-box .picture:hover a img, .product-list .item-box .picture:focus a img { opacity: 0.85; } .product-list .item-box .picture ~ .buttons, .product-list .item-box .picture + .details { margin: 0 0 0 240px; } .product-list .item-box .product-title { height: auto; padding: 10px 0; font-size: 18px; } .product-list .item-box .description { display: block; margin: 0 0 10px; line-height: 22px; } .product-list .item-box .prices { min-height: initial; margin: 0 0 15px; } .product-list .item-box .buttons { } .product-list .item-box .product-box-add-to-cart-button { width: auto; min-width: 150px; padding: 0 20px; } .product-list .item-box .add-to-compare-list-button, .product-list .item-box .add-to-wishlist-button { width: auto; padding-inline: 30px; } /*** PRODUCT PAGE ***/ .gallery { width: 550px; } .variant-picture { float: left; } .variant-picture + .variant-overview { width: auto; margin: 0 0 0 240px; } .variant-overview { text-align: left; } /*** PRODUCT REVIEWS ***/ .product-review-item .review-title { float: left; max-width: 600px; } .product-review-item .product-review-box { float: right; } .write-review .review-rating div { display: inline-block; margin: 0 0 0 5px; cursor: default; vertical-align: middle; font-size: 14px; height: 17px; } /*** REGISTRATION, LOGIN, ACCOUNT ***/ .address-list-page .section, .order-list-page .section, .return-request-list-page .section { display: inline-block; width: 45%; margin: 20px 1%; vertical-align: top; } .recurring-payments { width: 100% !important; margin: 20px 0 !important; } /*** SHOPPING CART ***/ .order-progress { padding: 20px; } .order-progress li { margin: 0 10px; } .order-progress a { min-width: 80px; } .cart-options .common-buttons { text-align: right; } .cart-options .checkout-attributes, .cart-options .selected-checkout-attributes { padding: 0 10px; } .cart-footer .totals { float: right; width: 45%; margin: 0 2.5%; } .cart-footer .terms-of-service { text-align: left; } .cart-footer .checkout-buttons, .cart-footer .addon-buttons { text-align: right; } .cart-footer .cart-collaterals { float: left; width: 45%; margin: 0 2.5%; } .cart-footer .cart-collaterals div, .cart-footer .cart-collaterals label { text-align: left; } .cart-footer .estimate-shipping label { display: block; margin: 0 0 10px; } .cart-footer .estimate-shipping .buttons { text-align: right; } /*** CHECKOUT ***/ .checkout-page .selected-checkout-attributes { float: right; text-align: right; } .checkout-page .cart-footer .totals { max-width: 350px; margin: 0; } .checkout-page .address-grid { overflow: hidden; } .checkout-page .address-item { display: inline-block; vertical-align: top; zoom: 1; width: 48%; margin: 0 1% 40px; } .shipping-method .method-list li, .payment-method .method-list li { display: inline-block; width: 25%; margin: 20px 2%; vertical-align: top; } .shipping-method .method-name { background-color: #f6f6f6; padding: 10px; } .payment-method .payment-logo { display: block; background-color: #f6f6f6; padding: 10px; } .payment-method .payment-details { display: block; width: auto; min-width: 0; margin: 10px 0 0; text-align: center; } .payment-info .info { padding: 30px 75px; } .order-review-data, .order-details-area, .shipment-details-area { overflow: hidden; } .order-review-data > div, .order-details-area > div, .shipment-details-area > div { float: left; width: 48%; margin: 0 1% 40px; } /*** ORDER DETAILS & SHIPPING DETAILS ***/ .order-details-page .section.options { text-align: right; } .order-details-page .selected-checkout-attributes { padding: 0 10px; } .order-details-page .tax-shipping-info { text-align: right; } .order-details-page .totals { float: right; clear: both; } .shipment-details-page .tracking-number .tracking-url { color: var(--theme-color); } /*** BLOG & NEWS ***/ .blog-posts .tags { float: right; width: 80%; text-align: right; } .blog-posts .buttons { float: left; width: 20%; text-align: left; } .new-comment { text-align: center; } .new-comment .buttons { text-align: center; } .comment-list .comment { display: table; width: 100%; margin: 0; } .comment-list .comment:last-child { border-bottom: 1px solid #ddd; } .comment-info { display: table-cell; width: 15%; margin: 0; vertical-align: top; } .comment-info .username { min-height: 40px; margin: 0; border: none; text-align: center; } .comment-info .avatar { border: none; } .comment-info .avatar img { max-width: 80%; max-height: 80%; } .comment-content { display: table-cell; width: 85%; border-left: 1px solid #ddd; vertical-align: top; text-align: left; } .comment-time { min-height: 40px; margin: 0; background-color: #f6f6f6; padding: 10px 15px; font-size: 14px; font-weight: normal; } .comment-title { margin: 0 0 -20px; padding: 20px; } .comment-body { padding: 20px; } /*** FORUM & PROFILE ***/ .forum-actions, .topic-actions { overflow: hidden; } .forum-actions .actions, .topic-actions .actions { float: left; } .forum-actions .pager, .topic-actions .pager { float: right; max-width: 450px; } .forum-actions .pager li, .topic-actions .pager li { margin: 2px 4px; } .forum-actions .pager.upper { display: block; } .topic-actions.lower .actions { display: block; } .topic-posts { margin: 0 0 30px; } .topic-post { display: table; width: 100%; margin: 0; } .topic-post .post-info { display: table-cell; width: 15%; margin: 0; vertical-align: top; text-align: left; } .topic-post .user-info { width: auto; } .topic-post .username { min-height: 40px; margin: 0; border: none; text-align: center; } .topic-post .avatar { margin: auto; border: none; } .topic-post .avatar img { max-width: 80%; max-height: 80%; } .topic-post .user-stats li { margin: 0; } .topic-post .send-pm { margin: 0 0 20px; } .topic-post .pm-button, .profile-info-box .pm-button { padding: 8px 16px; font-size: 13px; } .topic-post .post-content { display: table-cell; width: 85%; border-left: 1px solid #ddd; vertical-align: top; text-align: left; } .topic-post .post-head { min-height: 40px; overflow: hidden; background-color: #f6f6f6; } .topic-post .post-time { float: left; margin: 0; font-size: 14px; font-weight: normal; } .topic-post .post-actions { float: right; margin: 0; } .topic-post .post-actions a { margin: 0; line-height: 20px; } .topic-post .post-actions .manage-post a { } .topic-post .post-actions .quote-post a { min-width: 70px; } .topic-post .post-actions a.post-link-button { margin: 0 0 0 10px; border-left: 1px solid #ddd; text-align: center; } .topic-post .post-text { padding: 20px 5px; } .topic-post .post-vote { padding: 20px 0 20px 15px; } .forum-table th.replies, .forum-table th.views, .forum-table th.votes, .forum-table td.replies, .forum-table td.views, .forum-table td.votes { display: table-cell; } .forum-table td.image { max-width: none; } .forum-table td.image div { max-width: none; background-size: initial; } .ui-tabs-nav { text-align: left; } .ui-tabs-nav li { margin: 0 10px -1px 0; /*override jQuery UI styles, do not delete doubled properties*/ margin: 0 10px -1px 0 !important; } .profile-info-box .avatar { float: left; margin: 0 15px 15px 0; } .profile-info-box .profile-stats { float: left; text-align: left; } .profile-info-box .title { text-align: left; } .profile-info-box .send-pm { clear: both; text-align: left; } }