/* The max width test in ClientInfo.IsMobile needs to match this */ /* Default screens is Phones (Up to 800px) */ @media (max-width:800px) { .accessories-item { line-height: normal !important; font-size: 14px; } .accordion-toggle { border-bottom: 1px solid #2f2f2f; border-top: 1px solid transparent; } #back-top { display: none !important; visibility: hidden; } .back-top-mobile { background-color: #2a2a2a; color: #fff; padding: 10px 5px; } .back-to-top { font-size: 12px; cursor: pointer; padding-right: 20px; } .CartBottomWrapper { margin-top: 0; } .CartCouponEdit { width: 50% !important; } .CartProceedLower { width: auto !important; float: none !important; } .CartProceedUpper { text-align: center; } .CartShipZipEdit { width: 60% !important; } .CartItemTotal { width: auto !important; text-align: left; padding: 0 !important; } .CartTable { border: 0 !important; } .CartControlWrap { float: none !important; } .CartProceedChkout { display: block; } .checkout .box { width: 100%; margin-bottom: 20px; } .checkout .cclist li { padding: 20px 20px 0 0; } .checkout .feedback { padding: 20px; } .checkout-vertical-gutter-top-xs { margin-top: 0 !important; padding-top: 0 !important; } .checkout-no-vertical-gutter-xs { margin: 0 !important; } .checkout-no-vertical-padding-xs { padding: 0 !important; } .checkout .showcreditcards { margin: 0; padding: 0; border: 0; } .checkout .submit ul li { margin: 0; display: block; } .checkout .submit ul li:last-child { margin: 0; } .pagination-arrows-mobile:nth-child(-n+5) .CounterPagerNP span { text-align: left !important; display: inline-block !important; float: right; padding: 2px 0 2px 10px; } .pagination-arrows-mobile:nth-child(n+6) .CounterPagerNP span { text-align: right !important; display: inline-block !important; } .creditcards { background: url(/content/images/icon-creditcards.png) no-repeat 40px 40px !important; height: 100px; } .clear1 { height: auto !important; } .col-xs-12-block { display: block; } .col-xs-3-mobile { width: 25% !important; float: left; } .col-xs-4-mobile { width: 33.33333333% !important; float: left; } .col-xs-6-mobile { width: 50% !important; float: left; } .col-xs-9-mobile { width: 75% !important; float: left; } .col-xs-12-mobile { width: 100% !important; display: block !important; clear: both; } .col-xs-12-mobile .btn-lg { width: 100% !important; display: block !important; } .col-xs-12-mob { width: 100%; } .filter img { width: 24px; height: 24px; } .filter-text { font-size: 14px !important; } .filter-type-title { font-size: 14px !important; } .filter-group-category { font-size: 16px !important; } .filter-wrapper { margin-bottom: 10px; } .flex-table.linearize thead { display: none; } .flex-table.linearize tr, .flex-table.linearize th, .flex-table.linearize td { display: block; } .flex-table.linearize tbody tr td { padding: 0; border: 0; margin: 0 20px 10px 20px; } .footer { min-height: 0 !important; } .footer-links { border-bottom: 1px solid #bdbdbd; padding-bottom: 15px !important; margin-bottom: 20px; } .footer-links li { padding: 0 10px 0 0; line-height: 27px; float: left; } .footer-links li.jQRefIdTarget { float: none; clear: both; } .footerBar { padding-bottom: 0 !important; } .helpful-links { border-left: 0 !important; border-top: 1px solid #ccc; min-height: 0 !important; } #hero-slider .flex-control-nav { display: none; visibility: visible; } iframe { width: 100% !important; } .social-media iframe { width: 20px !important; } .info-box { padding-bottom: 20px; } .info-box { margin: 0; padding: 15px; } .info-box h4 { margin-top: 0; } .info-box ul li:last-child { display: none; visibility: hidden; } .image-hide-xs { padding: 10px 0 !important; } select, select:focus, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"] { font-size: 16px; } /* Auto Zoom disabled on form fields for browsers on IOS devices. This should also work on Android devices. */ .jQCartItemUpdate, .jQCartItemRemove { font-size: 14px; } .jQStImg { margin: 0; float: none !important; display: block; } .livechat { display: none; } .sub-link-only { color: #999; } .sub-link-only:hover { color: #FFF; } .OrderFormValue:before, .OrderFormValueDiscount:before { font-weight: bold; } .mbzone { display: none; visibility: hidden; } .menu3dmega ul { display: inherit !important; } .menu3dmega li .dropdown-menu { width: 99%; position: inherit; } .menu3dmega > ul li > .dropdown-menu { font-size: 13px; text-transform: capitalize; } .mob-search { float: none !important; } .mob-vertical { padding-bottom: 15px; } .mob-center-xs { text-align: center; margin: 0 auto; padding-left: 0; padding-right: 0; } .mob-center { text-align: center; margin: 0 auto; padding-left: 0; padding-right: 0; } .mob-footer { padding: 0; } .mob-only { display: block !important; visibility: visible !important; padding: 10px 20px; color: #999; font-size: 15px; font-weight: normal; outline: 0; text-decoration: none; text-transform: uppercase; cursor: pointer; } .mob-only:hover { background-color: #2a2a2a; color: #fff; } .mob-footer-phone { font-size: 14px; text-align: center; } .mob-footer { min-height: inherit; } .mob-navbar { background: #FFF; position: relative; min-height: 50px; margin-bottom: 20px; border: 1px solid transparent; } .mob-navbar-fixed-top { position: fixed; right: 0; left: 0; z-index: 1030; } .mob-navbar-offset-top { margin-top: 300px; } .mob-btn { display: block; padding: 10px !important; margin-top: 10px; } .mob-textcenter { text-align: center; } .mobile-filter { display: none; } .mobile-product-photo img { display: block; max-width: 100%; height: auto; width: 100%; } .mobile-row { width: 100%; box-sizing: border-box; } .mobile-sub-menu { background-color: #2a2a2a; font-size: 14px; } .myBuyton { float: none !important; margin: 0 auto; display: table; } nav#hours { display: inline-block; } nav#hours li:last-child { margin-right: 0; } .no-gutter-xs { margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; } .no-gutter-left-xs { margin-left: 0 !important; padding-left: 0 !important; } .no-gutter-right-xs { margin-right: 0 !important; padding-right: 0 !important; } .no-gutter-top-xs { margin-top: 0 !important; padding-top: 0 !important; } .no-gutter-bottom-xs { margin-bottom: 0 !important; padding-bottom: 0 !important; } .no-mobile { display: none; visibility: hidden; } .coupon-message { font-size: 10px !important; } .promo-supplier { text-align: center; } .PrDesc { padding: 10px 10px 0 10px; } .PrDescTitle { margin: 0 0 15px 0 !important; } .pr-snippet { text-align: center; margin: 0 auto; display: table; } #product-info-content { padding: 0 !important; } .product-info li { width: 100%; box-sizing: border-box; margin: 0 !important; } .promo-links h6 { font-size: 16px !important; padding-bottom: 17px !important; text-transform: capitalize !important; } .promo-links ul li { font-size: 14px !important; padding-bottom: 13px; } .promo-links ul li:last-child { padding-bottom: 0; } .promo-review { margin: 0 !important; padding: 10px 0 !important; } .recommend-mobile { margin: 0 0 20px 0; } .results-message { color: inherit !important; } .results-text { margin: 0 0 20px 0; padding: 0 0 30px 0; border-bottom: 1px solid #b4b4b4; } .search-label-nonmobile { display: none; } .search-label-mobile:before { content: "Searched: "; font-weight: bold; } .results-wrapper { margin-left: 0; padding-left: 0; } .search_button input, .search_button div { -webkit-border-radius: 0 !important; -moz-border-radius: 0 !important; border-radius: 0 !important; } .search_textbox { float: none !important; } .search_textbox input { display: inline-block; font-size: 16px !important; padding: 10px 0 10px 10px; border: 0 !important; } .select-finish { width: 100%; box-sizing: border-box; } .selected-finish { width: 100%; box-sizing: border-box; } .SelectorTooltipAct { display: none; visibility: hidden; } .sidebar { color: white; background-color:#b0120a; } .sidebar li { margin: .5em 0; padding: 0 1em; line-height: 32px; } .social-mobile { text-align: center; margin: 0 auto; display: table; padding: 0; } .product-details-module .social-mobile { display: block; } .socialNav { display: inline-block; margin: 0 auto; } .socialNav li { margin: 0 5px !important; float: left; } .socialsprite { background: url(/content/images/socialsprite4-mobile.png) no-repeat !important; } .mobile-social li iframe { width: 50px !important; } .sorting { margin: 0 auto 10px auto; text-align: center !important; } .sort-textbox { width: 49% !important; } .styleComboWrapper select { width: 100%; box-sizing: border-box; } .styleDescTitle { margin: 0; } .styleDesc { padding: 0; line-height: normal !important; } #StyleListDiv .style-part-title { color: #252525 !important; text-align: left !important; float: none !important; font-size: 11px !important; font-weight: bold; } #StyleListDiv .purchase-buttons { text-align: center !important; } td.CartItemImageCell { width: inherit !important; } .text-left-xs { text-align: left; } .text-center-xs { text-align: center; } .text-right-xs { text-align: right; } .ui-dialog .ui-dialog-content { padding: 1em !important; } ul#menu_h_nav { float: none; display: table; margin: 0 auto; } ul#menu_h_nav li { float: none; } .vertical-gutter-xs { padding: 15px 0 !important; } .vertical-gutter-top-xs { padding-top: 15px; } .vertical-gutter-bottom-xs { margin-bottom: 15px; } .vertical-gutter-bottom-lite-xs { margin-bottom: 7px; } .gutter-top-xs { padding-top: 10px; } .gutter-left-xs { padding-left: 10px; } .gutter-right-xs { padding-right: 10px; } .gutter-bottom-xs { padding-bottom: 10px; } .gutter-bottom-line-xs { border-bottom: 1px solid #CCC; } .gutter-top-large-xs { padding-top: 20px; } .gutter-left-large-xs { padding-left: 20px; } .gutter-right-large-xs { padding-right: 20px; } .gutter-bottom-large-xs { padding-bottom: 20px; } .gutter-margin-top-large-xs { margin-top: 20px; } .gutter-margin-left-large-xs { margin-left: 20px; } .gutter-margin-right-large-xs { margin-right: 20px; } .gutter-margin-bottom-large-xs { margin-bottom: 20px; } .no-vertical-gutter-xs { margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; } .vpsBar .box img { display: table; margin: 0 auto; padding-bottom: 15px; } .truck-message h6 { margin: 7px 0 !important; } .SpecImagePanel { display: none !important; visibility: hidden !important; position: inherit !important; } .selection-wrapper h2 { padding: 13px 0; } .config-wrapper .col-xs-12 { padding: 0; } .rr-box { margin: 0 0 20px 0 !important; } .rr-wrapper .rr-grid:nth-child(n+3) { display: none; opacity: 1; visibility: hidden; } .tab-okay { display: none; visibility: hidden; } .desk-okay { display: none; visibility: hidden; } .mob-okay { display: block; visibility: visible; } #back-top { bottom: 62px; } .mob-bold { font-weight: bold; } .mob-display-xs { display: block !important; float: left !important; } .tab-count { background-color: #e74c3c; padding: 3px 5px; color: #FFF; position: absolute; right: 7px; font-size: 12px; border-radius: 2px; -webkit-border-radius: 2px; } .RefinementBanner { padding: 15px 16px 35px 10px; } .CartExplanation { left: -93px; top: 52px; } .CartExplanationHide { } .detail-container-wrapper h1 { font-size: 20px !important; } #StyleListDiv .style-part-title span { font-size: 11px; } .ui-tabs .ui-tabs-nav li a { display: block; float: none; } .img-responsive-xs { display: block; max-width: 100%; height: auto; width: 100%; } .CartHeader { padding-bottom: 1px; background-color: #CCC; } .product-qty .cart-qty-increment { width: inherit; } .style-select-ui .jQNsaSel { font-size: 16px; } .hidden-xs .cart-cell-outer, .CartItemQty .cart-cell-outer, .CartItemTotal .cart-cell-outer { height: 0 !important; } #promo-slider .valuePropExpand h2 { text-align: left; } #promo-slider .valuePropExpand h2 { text-align: left; } .promo-content h2 { font-size: 17px; } .filter-group-title { margin: 0; border-top: 0; padding: 15px 0; } .btn-xs-mobile { padding: 1px 5px !important; font-size: 12px; line-height: 1.5; border-radius: 3px !important; } .menu-help { display: none !important; visibility: hidden; } .mobile-cart-count { background: #000; color: #FFF; font-size: 9px; font-weight: bold; padding: 2px; margin-top: -9px; border-radius: 3px; position: absolute; right: 20%; } .login { margin-top: 20px; } .login .cms-area { margin-top: 50px; } .checkout .cart-vertical-spacing { margin: 20px 0 0 0; } .checkout .account-box { min-height: inherit; } .clearfix-mob:before, .clearfix-mob:after { content: " "; display: table; } .clearfix-mob:after { clear: both } .form-horizontal .no-control-label-xs { padding-top: 0; } .resp-content .btn-subnav { display: block; margin-bottom: 40px; } .resp-content .sub-nav { background: #f3f3f1; border-bottom: 1px solid #bac5c6; border-top: 1px solid #bac5c6; display: none; margin-bottom: 1.5em; margin-left: -1.25em; padding: 1.25em 1.1em .25em; position: relative; width: 100%; } .resp-content .sub-nav li { font-size: 90%; } .resp-content .sub-nav #menu-accordion ul li a { font-size: 1.1em !important; font-weight: normal; } .header-xs .phone-xs a, .header-xs .cart-xs a { margin-top: 4px; font-size: 2.75em; } .mobile-cart-count { background: #222; color: #FFF; font-size: 0.3em; top: 5%; right: 25%; padding: 0 3px 2px 3px; } #ConfiguratorMenu h3 { margin: 0; } .selection-wrapper .item-details .icon, .selection-wrapper .item-details .desc { padding: 0; } .config-wrapper { padding: 0 20px; } .second-product-page-wrapper { margin-bottom: 20px; } .shipping-info .jQBack { right: 15px; } .remodal .add-to-cart-hook .dialog-form { padding: 40px 20px 20px 20px; } .CheckoutOptions { display: block; position: relative; top: -50px; visibility: hidden; } .checkout-mobile { margin: 15px 0; } .submit-wrapper { border: 0; border-top: 1px solid #ecf0f1; } .form-control { font-size: 16px; } .discounts { background: #EEE; } .product-info-model-delivery { padding: 15px; } .list-inline>li.pagination-arrows-mobile { display: block; padding: 0; } .list-inline>li.pagination-arrows-mobile { box-shadow: 0 2px 2px 0 rgba(0,0,0,0.16), 0 0 0 1px rgba(0,0,0,0.08); } .list-inline>li.pagination-arrows-mobile>a.CounterPagerNP { display: block; padding: 20px 0; } .list-inline>li.pagination-arrows-mobile:hover { background: #FFF; } .product-details-module #StyleListDiv .add-to-cart-qty { margin: 0 0 0 8px; border-radius: unset; } .cart-top { margin-top: 0 !important; } .styleShip { font-size: 12px !important; } .delivery_text { font-weight: normal !important; font-size: 11px !important; padding: 0; } .jQSearchReset { background-color: #e0e0e0; font-size: 19px; line-height: unset; color: #fff; border: 0; border-radius: 60% !important; position: absolute; top: 7px; right: 60px; padding: 2px 7px !important; } .mobile-home-link a { font-size: 15px !important; padding: 0 !important; } .remodal .modal-favorites-lists .dialog-form { padding: 45px 0 15px 0; } .pull-right-xs { float: right !important; } .pull-left-xs { float: left !important; } .checkout .stepbar .active { background: #f5f5f5 !important; color: #000; text-align: left; margin-bottom: 20px; padding: 10px; } .ccpa-wrapper { width: initial; border-radius: 0; border-left: 0; border-right: 0; border-bottom: 0; } .ccpa-close-button { top: 10px; right: 8px; } .login { font-size: 14px; padding: 15px; } .login .form { display: grid; grid-template-columns: 100%; } .login .form-divider { border: 0; } .login h2 { text-align: center; } .login .form-col-width { width: unset; margin: unset; padding: 10px; } .login .form-col-right { padding-left: 0; border-top: 1px solid #666; padding-top: 40px; margin-top: 40px; } .login .jQLogin { width: 100%; } .login a { display: block; } .signup .form { grid-template-columns: 1fr; } .display-block-xs { display: block; } .option-gallery-grid { grid-template-columns: repeat(4, 1fr); } .survey-modal span { width: 100px; } } /* Small screens like iPad Minis (minimum 800px) */ @media (min-width:801px) { .container { min-width: 749px; } nav#hours { display: inline-block; } .livechat { display: none; } nav#hours li:last-child { margin-right: 0; } .vertical-gutter-bottom-sm { margin-bottom: 10px; } .vertical-gutter-bottom-lite-sm { margin-bottom: 7px; } .search_textbox { float: none !important; } .search_textbox input { width: 96%; display: block; font-size: 12px !important; padding: 10px 0 10px 10px; } .mob-search { float: none !important; } .mob-center { text-align: center; margin: 0 auto; padding-left: 0; padding-right: 0; } .menu3dmega > ul > li > h2, .menu3dmega > ul > li > h2 a, .menu3dmega > ul > li > h2 span { font-size: 13px; line-height: 24px; } .socialNav { display: inline-block; margin: 0 auto; } .socialNav li { float: left; } .mob-only { display: none !important; visibility: hidden !important; } .quote-modal .parts-quote-wrapper { height: 200px; overflow-y: auto; } .mob-okay { display: none; visibility: hidden; } .desk-okay { display: none; visibility: hidden; } .tab-okay { display: block; visibility: visible; } .text-left-sm { text-align: left; } .text-center-sm { text-align: center; } .text-right-sm { text-align: right; } #back-top { bottom: 122px; } .tab-count { background-color: #e74c3c; padding: 3px 5px; color: #FFF; position: absolute; top: -13px; right: 7px; font-size: 14px; border-radius: 2px; -webkit-border-radius: 2px; } .mob-spacing-top { margin-top: 40px; } .RefinementBanner { padding: 15px; } .CartHeader { padding-bottom: 5px; } #promo-header { font-size: 14px; padding: 10px; } .filter-group-title { margin: 0; border-top: 0; padding: 15px 0; } .menu-help { display: none !important; visibility: hidden; } .resp-content .grid-fixed-side { padding-left: 13.625em } .resp-content .grid-fixed-side .fixed-side-col { float: left; margin-left: -13.625em; width: 12.375em; position: absolute; } .resp-content .sub-nav { display: block !important; margin-top: .875em } .img-responsive-sm { display: block; max-width: 100%; height: auto; width: 100%; } .remodal .add-to-cart-hook .dialog-form { padding: 40px 20px 20px 20px; } .no-gutter-sm { margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; } .no-gutter-left-sm { margin-left: 0 !important; padding-left: 0 !important; } .no-gutter-right-sm { margin-right: 0 !important; padding-right: 0 !important; } .no-gutter-top-sm { margin-top: 0 !important; padding-top: 0 !important; } .no-gutter-bottom-sm { margin-bottom: 0 !important; padding-bottom: 0 !important; } .gutter-top-sm { padding-top: 10px; } .gutter-left-sm { padding-left: 10px; } .gutter-right-sm { padding-right: 10px; } .gutter-bottom-sm { padding-bottom: 10px; } .gutter-top-large-sm { padding-top: 20px; } .gutter-left-large-sm { padding-left: 20px; } .gutter-right-large-sm { padding-right: 20px; } .gutter-bottom-large-sm { padding-bottom: 20px; } .submit-wrapper { border: 0; border-top: 1px solid #ecf0f1; } .no-vertical-gutter-sm { margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; } .group-logo ul#menu_h_nav { float: unset; display: inline-block; } .group-logo nav#hours { margin: 14px 5px; } .jQSearchReset { background-color: #e0e0e0; font-size: 19px; line-height: unset; color: #fff; border: 0; border-radius: 60% !important; position: absolute; top: 7px; right: 87px; padding: 2px 7px !important; } .modal-login .login-form { margin: auto 24% !important; } .pull-right-sm { float: right !important; } .pull-left-sm { float: left !important; } .ccpa-wrapper { margin-bottom: 20px; } .form-col-left-sm { padding-right: 30px; } .option-gallery-grid { grid-template-columns: repeat(6, 1fr); } span.discount-banner-top-left.logged-in { border-radius: 20px; } iframe.paypal-iframe { width: 80% !important; } } @media (max-width:992px) { #UserBar { display: none; } #back-top { bottom: 122px; } .hidden-xs .cart-cell-outer, .CartItemQty .cart-cell-outer, .CartItemTotal .cart-cell-outer { height: inherit !important; } .jQpacHide { display: none !important; } } @media (min-width: 992px) and (max-width: 1199px) { .bootstrap-cart-price-md { width: 130px; margin-left: 30px !important; } /*a hack until we convert the cart to CSS grid */ } /* Medium screens like iPads (minimum width 992px) */ @media (min-width:992px) { .container { width: 970px; } .menu3dmega > ul > li > h2, .menu3dmega > ul > li > h2 a, .menu3dmega > ul > li > h2 span { font-size: 13px; line-height: 24px; } .cloudzoom-instructions:after { content: "Touch image to magnify"; } .livechat { display: inline-block; } .mob-only { display: none !important; visibility: hidden !important; } .quote-modal .parts-quote-wrapper { height: 200px; overflow-y: auto; } .vertical-gutter-md { padding: 15px 0 !important; } .vertical-gutter-top-md { padding-top: 15px; } .vertical-gutter-bottom-md { margin-bottom: 15px; } #back-top { bottom: 122px; } .tab-count { background-color: #e74c3c; padding: 3px 5px; color: #000; position: absolute; top: -13px; right: 7px; font-size: 14px; border-radius: 2px; -webkit-border-radius: 2px; } .text-left-md { text-align: left; } .text-center-md { text-align: center; } .text-right-md { text-align: right; } .cart-wrapper { background: url(/content/images/cart-tile-md.png) repeat-y; } .child-item-row { background: url(/content/images/cart-tile-md-child.png); } .cart-cell-outer { width: 100%; height: 90px; display: table; } .cart-cell-inner { display: table-cell; vertical-align: middle; } .gutter-margin-top-large { margin-top: 10px; } .gutter-margin-left-large { margin-left: 10px; } .gutter-margin-right-large { margin-right: 10px; } .gutter-margin-bottom-large { margin-bottom: 10px; } .filter-group-title { margin: 10px 0; border-top: 1px solid #ddd; padding: 10px 0; } .form-horizontal .control-label-desk, .form-horizontal .radio-xs-desk, .form-horizontal .checkbox-xs-desk, .form-horizontal .radio-inline-xs-desk, .form-horizontal .checkbox-inline-desk { margin-top: 0; margin-bottom: 0; padding-top: 10px; text-align: left; } #ConfiguratorMenu .tab { margin: 0 40px; } .img-responsive-md { display: block; max-width: 100%; height: auto; width: 100%; } .remodal .add-to-cart-hook .dialog-form { padding: 40px 30px 0 30px; } .no-gutter-md { margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; } .no-gutter-left-md { margin-left: 0 !important; padding-left: 0 !important; } .no-gutter-right-md { margin-right: 0 !important; padding-right: 0 !important; } .no-gutter-top-md { margin-top: 0 !important; padding-top: 0 !important; } .no-gutter-bottom-md { margin-bottom: 0 !important; padding-bottom: 0 !important; } .gutter-top-large-md { padding-top: 20px; } .gutter-left-large-md { padding-left: 20px; } .gutter-right-large-md { padding-right: 20px; } .gutter-bottom-large-md { padding-bottom: 20px; } .submit-wrapper { border: 1px solid #ecf0f1; } .mz-lens { width: 153px !important; height: 153px !important; } .gutter-left-md { padding-left: 10px; } .gutter-right-md { padding-right: 10px; } .gutter-top-md { padding-top: 10px; } .gutter-bottom-md { padding-bottom: 10px; } .group-logo ul#menu_h_nav { float: right; display: inline-block; } .pull-right-md { float: right !important; } .pull-left-md { float: left !important; } .form-col-left-md { padding-right: 30px; } .option-gallery-grid { display: grid; grid-template-columns: repeat(6, 1fr); column-gap: 10px; row-gap: 10px; position: relative; font-size: 14px; text-align: center; } } /* Large screens like Desktop (minimum width 1200px) */ @media (min-width:1200px) { .container { width: 1170px; } .menu3dmega > ul > li > h2, .menu3dmega > ul > li > h2 a, .menu3dmega > ul > li > h2 span { font-size: 15px; line-height: 24px; } .cloudzoom-instructions:after { content: "Hover over image to magnify"; } .livechat { display: inline-block; } .mob-only { display: none !important; visibility: hidden !important; } .quote-modal .parts-quote-wrapper { height: 200px; overflow-y: auto; } .mob-okay { display: none; visibility: hidden; } .tab-okay { display: none; visibility: hidden; } .desk-okay { display: block; visibility: visible; } .UseBarNav { padding: 0 10px; } .vertical-gutter-lg { padding: 15px 0 !important; } .vertical-gutter-top-lg { padding-top: 15px; } .vertical-gutter-bottom-lg { margin-bottom: 15px; } #back-top { bottom: 122px; } .text-left-lg { text-align: left; } .text-center-lg { text-align: center; } .text-right-lg { text-align: right; } .cart-wrapper { background: url(/content/images/cart-tile-lg.png) repeat-y 0 0; } .child-item-row { background: url(/content/images/cart-tile-lg-child.png) repeat-y 0 0; } .cart-cell-outer { width: 100%; height: 90px; display: table; } .cart-cell-inner { display: table-cell; vertical-align: middle; } .gutter-lg { padding-left: 15px !important; padding-right: 15px !important;} .gutter-margin-top-large { margin-top: 20px; } .gutter-margin-left-large { margin-left: 20px; } .gutter-margin-right-large { margin-right: 20px; } .gutter-margin-bottom-large { margin-bottom: 20px; } #ConfiguratorMenu .tab { margin: 0 60px; } .img-responsive-lg { display: block; max-width: 100%; height: auto; width: 100%; } .remodal .add-to-cart-hook .dialog-form { padding: 40px 30px 0 30px; } .no-gutter-lg { margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; } .no-gutter-left-lg { margin-left: 0 !important; padding-left: 0 !important; } .no-gutter-right-lg { margin-right: 0 !important; padding-right: 0 !important; } .no-gutter-top-lg { margin-top: 0 !important; padding-top: 0 !important; } .no-gutter-bottom-lg { margin-bottom: 0 !important; padding-bottom: 0 !important; } .gutter-left-lg { padding-left: 10px; } .gutter-right-lg { padding-right: 10px; } .gutter-top-lg { padding-top: 10px; } .gutter-bottom-lg { padding-bottom: 10px; } .gutter-top-large-lg { padding-top: 20px; } .gutter-left-large-lg { padding-left: 20px; } .gutter-right-large-lg { padding-right: 20px; } .gutter-bottom-large-lg { padding-bottom: 20px; } .pull-right-lg { float: right !important; } .pull-left-lg { float: left !important; } .form-col-left-lg { padding-right: 30px; } span.discount-banner-top-left.logged-in { border-radius: 20px 0 0 20px; } } /* XL - Extra Large desktop only displays (1440px and up) (SERPS only) */ @media (min-width:1440px) { .container-xl { width: 1440px; } .container-clamp { width: clamp(16rem, 90vw, 100rem); } .vertical-gutter-xl { padding: 15px 0 !important; } .vertical-gutter-top-xl { padding-top: 15px; } .vertical-gutter-bottom-xl { margin-bottom: 15px; } .container-xl .cart-wrapper { background: url(/content/images/cart-tile-xl.png) repeat-y 10px 0; } .container-xl .child-item-row { background: #f3f3f3 url(/content/images/cart-tile-xl-child.png) repeat-y 10px 0; } .container-clamp .cart-wrapper { background: url(/content/images/cart-tile-xl-wide.png) repeat-y 0 0; background-position: right; } .container-clamp .child-item-row { background: #f3f3f3 url(/content/images/cart-tile-xl-wide-child.png) repeat-y 0 0; background-position: right; } .no-gutter-xl { margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; } .no-gutter-left-xl { margin-left: 0 !important; padding-left: 0 !important; } .no-gutter-right-xl { margin-right: 0 !important; padding-right: 0 !important; } .no-gutter-top-xl { margin-top: 0 !important; padding-top: 0 !important; } .no-gutter-bottom-xl { margin-bottom: 0 !important; padding-bottom: 0 !important; } .gutter-left-xl { padding-left: 10px; } .gutter-right-xl { padding-right: 10px; } .gutter-top-xl { padding-top: 10px; } .gutter-bottom-xl { padding-bottom: 10px; } .gutter-top-large-xl { padding-top: 20px; } .gutter-left-large-xl { padding-left: 20px; } .gutter-right-large-xl { padding-right: 20px; } .gutter-bottom-large-xl { padding-bottom: 20px; } .pull-right-xl { float: right !important; } .pull-left-xl { float: left !important; } } /* * ================================================================== * Belami Menu Shelf - v35RC1 * CSS is found in content/resp.globalmaster.css (2484 - 2568) * Breakpoints is found in scripts/bootstrap-custom.css (83 - 183) * jQuery script is found in scripts/site-for-shelf.js (1426 - 1530) * ================================================================== */ /* Default screens is Phones (800px and up) */ @media (max-width:800px) { #belami-menu .header { display: inline; } #belami-menu .nav-collapse { -webkit-transform:translate3d(0,0,0) } .off-canvas { width:100%; overflow-x:hidden; position:relative } .off-canvas body { width:100%; overflow-x:hidden; -moz-box-sizing:border-box; -webkit-box-sizing:border-box } .off-canvas body > * { left:0; transform:translateX(0); transition: transform 500ms ease; backface-visibility:hidden } .off-canvas #off-canvas-nav { display:block; position:absolute; top:0; left:0; width:0; z-index:1; background:none } .off-canvas #off-canvas-nav .mainnav { margin:0; position:absolute; left:0; top:0; width:250px; transform:translateX(-100%) } .off-canvas #off-canvas-nav .mainnav .nav-collapse { height:auto; background:none; display: block; } .off-canvas-enabled body > * { transform:translateX(250px); transition: transform 500ms ease; } #belami-menu .navbar .container { width:auto; padding:0 } #belami-menu .nav-collapse { clear:both } #belami-menu .nav-collapse .nav { float:none; margin:0 0 10px } #belami-menu .nav-collapse .nav > li { float:none } #belami-menu .nav-collapse .nav > li > a { margin-bottom:2px } #belami-menu .nav-collapse .nav > li > a { padding:9px 15px; font-weight:bold; color:#bbe6ff; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px } #belami-menu .nav-collapse .btn { padding:4px 10px 4px; font-weight:normal; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px } #belami-menu .nav-collapse .nav > li > a:hover, #belami-menu .nav-collapse .nav > li > a:focus { background-color:#07b } #belami-menu .nav-collapse.in .btn-group { margin-top:5px; padding:0 } #belami-menu .navbar .nav-collapse .nav.pull-right { float:none; margin-left:0 } #belami-menu .nav-collapse, #belami-menu .nav-collapse.collapse { overflow:hidden; height:0 } #belami-menu .navbar .btn-navbar { display: inline-block !important; } .mainnav { height:auto; margin-left:0; margin-right:0; margin-bottom:0 } .mainnav .navbar-inner { padding:0 } .mainnav .nav-collapse { background:#fff } .mainnav .nav-collapse .nav { width: 100%; margin:0; border-left:0 } .mainnav .nav-collapse .nav > li > a { margin-bottom:0; border-bottom:1px solid #eee; border-right:0; padding:10px 20px; font-weight:bold; text-shadow:none; } .mainnav .nav-collapse .nav > li > a { -webkit-border-radius:0; -moz-border-radius:0; border-radius:0 } .mainnav .nav-collapse .nav > li > a:hover { background-color: transparent; background-image:none; filter:none } #off-canvas-nav, #off-canvas-nav .mainnav { height:100% } .off-canvas .mainnav .nav-collapse .nav > li > a { border-color:#2f2f2f; width: auto; } .off-canvas .mainnav .nav-collapse .nav > li > a:hover { background-color:#2a2a2a; color:#fff } .navbar-collapse-fixed-top { border-top:none; position:fixed; left:0; top:0; width:100%; z-index:1000 } .navbar-collapse-fixed-top .nav-collapse { position:absolute; width:100%; left:0; top:51px; margin:0 } .navbar-collapse-fixed-top .nav-collapse.in { overflow-y:auto; -webkit-overflow-scrolling:touch } .navbar-collapse-fixed-top .nav-collapse.in > * { -webkit-transform:translateZ(0) } .navbar-collapse-fixed-top .nav-collapse.animate { overflow:hidden; } .header-top { background: #FFF; } .search-box { width: inherit !important; } .search-box, .search_textbox_wrapper { margin: 0 !important; width: inherit; } .search_textbox input, .search_button input { border-radius: 0 !important; } .search_button input { width: 50px !important; } .menu3dmega > ul > li { width: 100%; display: inherit; } .accordion-toggle { cursor: pointer; } .accordion-content { display: none; } .accordion-content.default { display: block; } } /* Small screens like iPad Minis (800px and up) */ @media (min-width:801px) { .nav-collapse.collapse { height:auto !important; overflow:visible !important } #content-shift-wrapper { margin-top: 0; } #belami-menu .collapse { display: block !important; } } /* * ================================================================== * Device Specific Media Queries * ================================================================== */ /* iPhone portrait & landscape (Unless special tweaking is required this is for all versions of iPhone) */ @media only screen and (min-device-width : 320px) and (max-device-width : 568px) { .livechat { display: none; } nav#hours { display: inline-block; } ul#menu_h_nav { float: none; display: table; margin: 0 auto; } ul#menu_h_nav li { float: none; } nav#hours li:last-child { margin-right: 0; } .search_textbox { float: none !important; } .search_textbox input { width: 96%; display: block; } .mob-search { float: none !important; } .menu3dmega > ul > li > h2 a, .mob-vertical { padding-bottom: 15px; } .mob-center { text-align: center; margin: 0 auto; padding-left: 0; padding-right: 0; } .mob-footer { padding: 0; } .socialNav { display: inline-block; margin: 0 auto; } .socialNav li { float: left; } .vpsBar .box img { display: table; margin: 0 auto; padding-bottom: 15px; } /* Placeholder */ .LinkLogo img { display: block; max-width: 100%; height: auto; width: 100%; } /* Unique */ nav#hours li { float: none; } .badges { margin: 0 auto; text-align: center; } .badges img { width: 33%; padding-left: 10px; float: left; } } /* iPhone landscape only (Unless special tweaking is required this is for all versions of iPhone) */ @media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : landscape) { .menu3dmega > ul > li > h2 a, .menu3dmega > ul > li > h2 span { font-style: italic; } } /* New generation iPads landscape */ @media only screen and (min-device-width : 2048px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio: 2) and (min-resolution: 200dpi) { .container { width: 1024px; } /* Set to 1100px to show the maximum amount of site on iPad */ } /* Older generation iPads landscape */ @media only screen and (min-device-width : 801px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio: 1) and (min-resolution: 200dpi) { .container { width: 1024px; } /* Set to 1100px to show the maximum amount of site on iPad */ } /* Newer generation iPads portrait */ @media only screen and (min-device-width : 1536px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio: 2) and (min-resolution: 200dpi) { .container { width: 1024px; } /* Set to 1100px to show the maximum amount of site on iPad */ } /* Older generation iPads portrait */ @media only screen and (min-device-width : 801px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio: 1) and (min-resolution: 200dpi) { .container { width: 1024px; } /* Set to 1100px to show the maximum amount of site on iPad */ } /* Custom additions to the Bootstrap framework */ .btn-left { margin-right: 5px; } .btn-right { margin-left: 5px; } .fa-lg { font-size: 1.33333333em; line-height: .75em; vertical-align: -15% } .fa-2x { font-size: 2em } .fa-3x { font-size: 3em } .fa-4x { font-size: 4em } .fa-5x { font-size: 5em } .fixed-ratio-resize { max-width: 100%; height: auto; width: auto\9; } /* Default screens is Phones (Up to 800px) */ @media (max-width:800px) { /* These are the updated styles for the 2021 mobile menu update. */ .off-canvas #off-canvas-nav .mainnav .revamped-mobile-menu .nav .mob-only { font-weight: bold; text-transform: unset; } .off-canvas #off-canvas-nav .mainnav .revamped-mobile-menu .nav .LIBrand > div, .off-canvas #off-canvas-nav .mainnav .revamped-mobile-menu .nav .LICategories > div { color: #2f2f2f; } .off-canvas #off-canvas-nav .mainnav .revamped-mobile-menu .nav > li > a { width: auto; border: 0; border-bottom: 1px solid #f0f0f0; } .off-canvas #off-canvas-nav .mainnav .revamped-mobile-menu .nav .dropdown-menu { border: 0; box-shadow: none; -webkit-box-shadow: none; } .off-canvas #off-canvas-nav .mainnav .revamped-mobile-menu .nav .navHomeLink .button { font-size: 15px; font-weight: bold; vertical-align: middle; cursor: pointer; padding: 10px 20px; line-height: 1.42857143; } .off-canvas #off-canvas-nav .mainnav .revamped-mobile-menu .nav .LIHelp a { font-size: 13px; padding: 5px 20px; border-bottom: 0; } .off-canvas #off-canvas-nav .mainnav .revamped-mobile-menu .nav .LIHelp a:first-child { padding-top: 10px; } .off-canvas #off-canvas-nav .mainnav .revamped-mobile-menu .nav .LIHelp a:hover, .off-canvas #off-canvas-nav .mainnav .revamped-mobile-menu .nav .mob-only:hover, .off-canvas #off-canvas-nav .mainnav .revamped-mobile-menu .nav .mobile-sub-menu { background-color: unset !important; color: unset; text-decoration: none; } .off-canvas #off-canvas-nav .mainnav { width: 300px; z-index: 3000; } .off-canvas #off-canvas-nav .mainnav .revamped-mobile-menu .nav .accordion-toggle { border-color: #f0f0f0; } .off-canvas #off-canvas-nav .mainnav .revamped-mobile-menu .dropdown-menu div > ul > li:nth-child(1) > a { font-weight: bold; border-bottom: 1px solid #999; padding-bottom: 5px; margin-bottom: 5px; } .off-canvas-enabled body > * { -webkit-transform:translateX(300px); -moz-transform:translateX(300px); -o-transform:translateX(300px); transform:translateX(300px) } .off-canvas .mainnav-overlay { width: 600px; height: calc(100%); background-color: black; opacity: .5; position: absolute; top: 0; left: 0; z-index: 2500; } /* The default color is 1Stop. Update the colors in the custom.css files. */ .off-canvas #off-canvas-nav .mainnav .revamped-mobile-menu .nav > li > a, .off-canvas #off-canvas-nav .mainnav .revamped-mobile-menu .nav .navHomeLink .button, .off-canvas #off-canvas-nav .mainnav .revamped-mobile-menu .nav .LIHelp a { color: #5B7EA7; } } /* Overrides bootstrap.css's precidence over resp.globalmaster.css */ /* FAVORITES */ /* Default screens is Phones (Up to 800px) - XS */ @media (max-width:800px) { .grid-container { grid-template-columns: 100% !important; } } /* Small screens like iPad Minis (minimum 800px) - SM */ @media (min-width:801px) { .grid-container { grid-template-columns: 25% 25% 25% 25%; } } .btn-wishlist { padding: 10px 20px; } .faved, .faved:hover { color: #c54818; padding-top: 9px; padding-bottom: 9px; } .not-faved, .not-faved:hover { color: unset; padding-top: 9px; padding-bottom: 9px; } .grid-container { display: grid; } .grid-container > div { min-height: 540px; background-color: #f0f0f0; padding: 10px; border: 5px solid #fff; } .card-details { min-height: 420px; background-color: #fff; padding: 10px; margin-bottom: 10px; } .favorites-modal-header { background-color: #f0f0f0; padding: 20px; text-align: left; } .favorites-modal-header h1 { font-size: 16px; font-weight: normal; } .favorites-modal-header h2 { font-size: 13px; font-weight: normal; font-style: italic; } /* General */ input.form-control.half { padding: 0 6px; } .form-minimal { padding: 5px; border: 1px solid #ccc; } .btn-lg, .btn-group-lg>.btn { font-size: 14px; border-radius: 4px; padding: 9px ​40px; line-height: 1; } .accordion-single .acc-content-inner.social-media { padding: 5px; } .accordion-single .acc-content-inner.social-media a { padding: 0 2px; } .accordion-single .acc-content-inner.social-media i { font-size: 19px; } .no-background-color { background-color: transparent !important; } .no-border { border: 0 !important; } .no-border-top { border-top: 0 !important; } .no-border-right { border-right: 0 !important; } .no-border-bottom { border-bottom: 0 !important; } .no-border-left { border-left: 0 !important; } .hidden-input { position: absolute; left: -9999px; } .padding-5 { padding: 5px; } .padding-10 { padding: 10px; } .padding-16 { padding: 16px; } .padding-20 { padding: 20px; } .padding-26 { padding: 26px; } .alert-success-outline { border: 2px solid #3c763d; } /* Product Details redesign 2022 */ section.product-overview-body { font-size: 15px; } .panel.panel-product-details { box-shadow: none; } .panel-product-details { border: 0; } .panel-product-details .panel-heading { background-color: unset; color: unset; border-color: unset; border-bottom: 1px solid #d9d9d9; border-radius: 0; padding: 0; } .panel-product-details .panel-heading div { background: #303030; color: #fff; } .product-page-redesign h4 { text-align: center; } .product-info-content { border: 1px solid #ddd; padding: 20px; } .yotpo-reviews-alternate h4, .panel-product-details .accordion-btn h4, h4.section-title { font-size: 16px; margin: 0; padding: 0; } h4.section-title { text-align: center; } .section-body { margin-top: 20px; padding: 20px; border: 1px solid #d9d9d9; } .yotpo-reviews-alternate h4 { margin: 0; padding: 0 0 10px 0; } .rr-wrapper.product-page-redesign, .rr-wrapper.product-page-redesign .rr-wrapper { padding: 0; } .product-spec-grid { display: grid; grid-template-columns: 6fr 6fr; column-gap: 20px; padding: 20px; border: 1px solid #d9d9d9; border-top: 0; } .product-spec-table-grid { display: grid; grid-template-columns: 1fr; } .product-spec-table-grid .header { background: #ddd; font-weight: 600; border: 1px solid #bbb; padding: 10px; } .product-spec-cell-grid { display: grid; grid-template-columns: 6fr 6fr; } .product-spec-cell-grid div { border: 1px solid #bbb; padding: 10px; } .product-spec-cell-grid div:nth-child(odd) { font-weight: 600; } .product-spec-vp-grid { display: grid; grid-template-columns: 1fr; align-content: baseline; } .product-spec-vp-grid > div:last-child { margin-top: 10px; } .vp-grid { display: grid; grid-template-columns: 3fr 9fr; column-gap: 10px; align-items: center; padding: 10px; border-bottom: 1px solid #d9d9d9; } .info-cards-grid { display: grid; grid-template-columns: 6fr 6fr; column-gap: 10px; row-gap: 10px; background: #ddd; padding: 20px; } .info-cards-grid div { padding: 10px; } .product-accordion-content { padding: 20px; border: 1px solid #d9d9d9; border-top: 0; } .option-gallery-grid { display: grid; column-gap: 10px; row-gap: 10px; font-size: 14px; text-align: center; position: relative; } .option-gallery-grid div { border: 1px solid #EEE; } .btn-round { border-radius: 100px; } .btn-belami { padding: 10px; } @media (max-width:800px) { .product-spec-grid, .info-cards-grid { grid-template-columns: 1fr; } .info-cards-grid div { padding: 0 0 10px 0; } }