.prodBreadcrumbs, .prodBreadcrumbs h2, .prodBreadcrumbs .prodCrumbLink{ font-size:20px; line-height:24px; margin:0; padding:8px 0 0 0; color:#333; text-decoration:none; } .prodBreadcrumbs h2{ display:inline; } .prodBreadcrumbs{ border-bottom:1px solid #DDD; } .prodCrumbLink:hover{ color:#000; text-decoration:underline; } .prodNewColors { color:#FF0000; } .prodNavTable{ padding-bottom:10px; } .prodDisplay { clear: both; font-size:10pt; color :#444; padding-bottom:80px; } .prodImg { padding-bottom:5px; position:relative;} .imgUpper{ padding-top:10px } .prodImg .MagicZoom{ width:100%; } .millSizesImg{ max-width:100%; max-height:50vh; } .prodDesc { padding:0px 5px 5px 5px; } .prodTitle { padding-top:0; margin-top:0; } .prodOrder { padding-top: 10px; } .prodCatalogDesc { padding:10px 0px; line-height: 1.2; } .prodColors { clear: both; } .prodSizes { clear: both; } .prodOrder { clear: both; } .colorHeading { clear: both; font-size: 11pt; } .sizeHeading { clear: both; font-size: 11pt; } .imgDesc { } #imgMsg,#imgMsgRetail{ position:absolute; opacity:0.6; background-color:#333; padding:8px; border-radius:16px; z-index:1000; color:#fff; } .sizeOuter { float: left; margin:3px; cursor:pointer; text-align:center; border:2px solid #CCCCCC; color:#666666; border-radius:18px;} .colorOuter { float: left; margin:3px; cursor:pointer; background-color:#FFF; border-radius:18px; } .colorOuter a{ display:block!important; /* magiczoom auto adds display:inline-block... can't prevent with options */ } .sizeOuter.OOS, .colorOuter.OOS { border-style:dotted; position:relative; } .colorOuter.OOS { margin:1px; border-width:2px; } .OOS .sizeInner{ opacity:0.8; } .colorOuter.OOS .colorInnerWrap:after, .sizeOuter.OOS a:after { content: "\f00d"; /* Close icon */ font-family: FontAwesome; font-style: normal; font-weight: normal; text-decoration: inherit; position: absolute; font-size: 28px; color: #999; top: 50%; left: 50%; margin: -20px 0 0 -11px; z-index: 1; opacity:0.8; } .colorOuter.OOS .colorInnerWrap:after{ opacity:0.8 } .sizeOuter.selected, .colorOuter.selected { border-color: #666; } .colorOuter.selected, .sizeOuter.selected{ box-shadow: 0 0 6px #666; } .colorInner { width:30px; height:30px; margin: 1px; border-radius:15px; overflow:hidden;} .colorInner img { width:30px; height:30px; } .sizeInner { font-size:11pt; vertical-align:middle; text-align:center; line-height:30px; height:30px; margin: 0 2px; min-width:28px; border-radius:15px; } .sizeOuter a{ text-decoration:none; color:#666666; width:30px; border-radius:18px;} .selectedColor, .selectedSize { font-weight:bold; } .prodTopTabOuter .tab-pane{ padding:5px; } /* Multi Hex value colors */ .multiHex{ float:left; height:100%; border:0; margin:0; padding:0; } .multi1of2, .multi2of2{ width:50%; } .multi1of3{ width:50%; } .multi2of3, .multi3of3{ width:25%; } .multi1of4, .multi2of4, .multi3of4, .multi4of4{ width:25%; } /*** New PreSell Classes ***/ .presellDesc{ color:#EE159B; float:left; } .streetDate { color:#00CC00; float:left; margin-left: 8px; } .preSellCopy{ color:#008800; clear:both; } .colorOuter.preSell, .sizeOuter.preSell{ border-color: #008800; } .colorOuter.preSell.selected, .sizeOuter.preSell.selected{ border-color:#00CC00; } .prodIcons {} .featureIcon { padding:4px; } .imgUpper { display:block; clear: both; } .imgLower { display:block; clear: both; text-align:center;} .prodPrice {font-size: 11pt;} .regPriceLabel { float:left; } .regPrice { float:left; } .priceStrike { float:left; text-decoration: line-through; padding-right:8px;} .salePriceLabel { float:left; } .salePrice { float:left; color: red; } .optLinkRow{ display:inline-block; } .optLinkRow a { white-space: nowrap; margin: 0 2px; } /*========-------- Cart Button Display --------========*/ .colorSelect { float: left; } .sizeSelect { } .prodQty { } .prodCartBtn { padding-top:8px; } .orderBtnRow { } .addToCart { } .cartError { height: 20px; color: red; } .viewCart { } /*========-------- Image Overlay Display --------========*/ #imgMessage { display:none; width:175px; position: absolute; opacity: 0.60; -moz-opacity: 0.60; -khtml-opacity: 0.60; filter: alpha(opacity=60); z-index:5; border-radius:9px; } .imgMessageText { font-size:12pt; color: #ffffff; width:175px; background-color:#4a4a4a; text-align:center; } /*========-------- Image Library styles --------========*/ .imgLibDiv { z-index: 5; } .heightPad {padding-top: 3px; padding-bottom: 3px; vertical-align: middle;} .imgLibTable {border: 1px solid black; background-color: #FFFFFF; text-align: center; width: 100%; hasLayout: true; -moz-box-shadow: 0 1px 5px #444; -webkit-box-shadow: 0 1px 5px #444; box-shadow:0 1px 5px #444; } .imgLibHdr { background: #e9e9e9; color: #444; font-weight: bold; font-size: 12px; border-bottom: 1px solid black; padding: 2px;} .imgLibButton { display: block; vertical-align: middle; background: #DCDCDC; border-radius:7px; width:70px; height:17px; line-height:15px; font-size:9px; text-decoration:none; cursor: pointer;} a.imgLibLink, a.imgLibLink:active, a.imgLibLink:link, a.imgLibLink:visited, a.imgLibLink:hover { font-size: 9px; text-decoration: none; vertical-align: middle; } .closeButton { border: 2px solid white; font-weight: bold; text-align: center; vertical-align: middle; font-size: 12px; cursor: pointer; } .prodImgInner { text-align:center; } /* Alternet View Styles */ .altViews { clear:both; } .altViewInner{ float:left; max-width:50px; } .altViewInner a, .altViewInner img{ width: 100%; height:auto; } /*========-------- Magic Zoom styles --------========*/ #mzoom, #mainProdImg1{ width:100%!important; height:auto!important; max-width:400px; } /* responsive fix for magiczoom */ .MagicZoom, .MagicZoom * { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; } /* Style of the small image link */ .MagicZoom, .MagicZoom:hover { display: inline-block; outline: 0 !important; font-size: 0 !important; line-height: 100% !important; direction: ltr; max-width: 100%; } /* Style of the main image */ .MagicZoom img { border: 0 !important; margin: 0 !important; outline: 0 !important; padding: 0 !important; height: auto; } .MagicZoom > img { width: 100%; } .MagicZoom.magic-for-ie8, .MagicZoom.magic-for-ie8 > img { max-width: none !important; } .MagicZoom.magic-for-ie7 > img, .MagicZoom.magic-for-ie5 img { width: auto; } td > .MagicZoom > img, td > .MagicZoom.magic-for-ie8 > img { max-width: none; width: auto; } /* Style of the hint text and image */ .MagicZoomHint { background: url(graphics/hint.gif) no-repeat 2px 50%; color: #444; font-size: 8pt; font-family: sans-serif; line-height: 24px; margin: 0; min-height: 24px; padding: 2px 2px 2px 20px !important; text-align: left; text-decoration: none; } /* Style of loading message and icon shown during load */ .MagicZoomLoading { background: #fff url(graphics/loader.gif) no-repeat 2px 50%; border: 1px solid #ccc; color: #444; font-family: sans-serif; font-size: 8pt; line-height: 1.5em; margin: 0; padding: 4px 4px 4px 24px !important; text-align: left; text-decoration: none; } /* Style to hide external title on a page. Only needed for #id method */ .MagicZoomExternalTitle { display: none; } .magic-temporary-img img { max-height: none !important; max-width: none !important; } /* Style of the zoomed image */ .MagicZoomBigImageCont { background: #ffffff; border: 1px solid #999; -webkit-transition: none !important; -moz-transition: none !important; transition: none !important; } .MagicZoomBigImageCont.inner-zoom { border: 0; } .MagicZoomBigImageCont img { max-width: none !important; max-height: none !important; height: auto !important; width: auto !important; } /* Style of text on the zoomed image */ .MagicZoomHeader { background: #666; color: #fff; font-size: 10pt !important; line-height: normal !important; text-align: center !important; } /* Style of square magnify area under the cursor */ .MagicZoomPup { background: #dadad1; border: 3px solid #aaa; cursor: move; } /* Style of loading message and icon shown during load */ .MagicZoomLoading { background: #fff url(graphics/loader.gif) no-repeat 2px 50%; border: 1px solid #ccc; color: #444; font-family: sans-serif; font-size: 8pt; line-height: 1.5em; margin: 0; padding: 4px 4px 4px 24px !important; text-align: left; text-decoration: none; } /* Style of shadow effect behind zoomed image */ .MagicBoxShadow { -moz-box-shadow: 3px 3px 4px #888888; -webkit-box-shadow: 3px 3px 4px #888888; box-shadow: 3px 3px 4px #888888; border-collapse: separate; /* For IE 5.5 - 7 */ filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#888888') !important; /* For IE 8 */ -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#888888')" !important; } /* Style of glow effect behind zoomed image */ .MagicBoxGlow { -moz-box-shadow: 0px 0px 4px 4px #888888; -webkit-box-shadow: 0px 0px 4px 4px #888888; box-shadow: 0px 0px 4px 4px #888888; border-collapse: separate; /* For IE 5.5 - 7 */ filter: progid:DXImageTransform.Microsoft.Glow(Strength=4, Color='#888888') !important; /* For IE 8 */ -ms-filter: "progid:DXImageTransform.Microsoft.Glow(Strength=4, Color='#888888')" !important; } /* =============== ToolTip Class =============== */ .descTooltip{ position: relative; transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out; display:block; padding:0; margin:0; } .descTooltip:after{ background: #000; background: rgba(0,0,0,.8); border-radius: 6px; top: -30px; color: #fff; content: attr(data-desc); left: -9999px; white-space:nowrap; min-width:20px; padding: 0 5px; margin:0; position: absolute; z-index: 9930; border:1px solid #fff; box-shadow:0 0 10px #000; transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out; opacity:0; text-align:center; min-width:50px; } .descTooltip:before{ border: solid; border-color: #FFF transparent; border-width: 8px 8px 0 8px; top: -10px; content: ""; margin:0; padding:0; left: -9999px; position: absolute; z-index: 9940; transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out; opacity:0; } .descTooltip:hover:after{ left: -8px; opacity:100; } .descTooltip:hover:before{ left: 8px; opacity:100; } .selected .descTooltip:after, .selected .descTooltip:before{ display:none; } /* FDM4 Decorator Styles */ #fdm4Decorator { z-index:100; width:96%; /*height:720px;*/ padding:10px; position:absolute; top:70px; margin: 0 auto; text-align:center; left: 0; right: 0; background:#DDDDDD; border:1px solid #333; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; -moz-box-shadow: 0 0 55px #333 ; -webkit-box-shadow: 0 0 55px #333 ; box-shadow: 0 0 55px #333 ; -webkit-transition: opacity 0.7s; transition: opacity 0.7s; opacity:1; } #fdm4Decorator.offScreen{ left:-9999px; display:block; opacity:0.01; } #fdm4DecoratorIframe{ width:100%; height:680px; border: 1px solid #999; } .decorateLineBtn{ text-align:center; position:relative; top:8px; } a.decoratorClose, a.decoratorClose:active,a.decoratorClose:link, a.decoratorClose:hover, a.decoratorClose:visited{ position:absolute; right:-13px; top:-13px; background:#fff; color: #4d4d4d; border:2px solid #333; border-radius:15px; display:block; width:25px; height:25px; text-align:center; line-height:20px; font-size:28px; /*box-shadow: 1px 1px 2px #000; */ text-decoration:none; } a.decoratorClose:hover { color: #b2151b; } #wishlistAddStub{ min-width:200px; min-height:100px; padding:10px; background:#FAFAFA; border:1px solid #DDD; border-radius:6px; box-shadow:0 0 10px #000; position:absolute; display:none; z-index:15; } #wishlistAddStub.showWishlistAdd{ display:block; } .featTypeDesc{ font-weight:bold; } /* Item Notification */ .itemNotifyBtn i { font-size: 24px; color: #888; } .itemNotifyBtn.selected i { color: #6a975d; } .downloadsizechart { font-size: 18px; margin-left: 25px; } #colorContainer { margin-top: 30px; display: none; } .sizeWrapper { padding-left: 0px; margin-top: 15px; } #buttonContainer { padding-left: 0px; } a.addToCartBtn.btn.btn-primary { height: auto; } #colorsLabel, #sizesLabel { font-size: 16px; font-weight:bold; color: #111; } .selectedColorDesc, .selectedSizeDesc { padding-left: 10px; font-size: 16px; color: #111; } #prodDescription { margin-top:10px; } #productDescAccordion .panel-heading { padding:0; } #productDescAccordion .panel-heading a { display:inline-block; width:100%; padding:20px 15px; font-size: 20px; font-weight:bold; color: #111; } #productDescAccordion .panel-body { padding:30px; font-size: 20px; color: #111; } #msgArea { /* margin-top:30px; */ margin-bottom: 0px; } /* slick slider css */ .main-product-slider{ position:relative; float:left; width: 25%; } .main-product-slider::after{ display:block; content:""; clear:both; } .slider-main-product{ /*padding-left:150px;*/ width: 72%; float:right; margin-right:10px; } @media (max-width:1439px){ .slider-main-product { /*padding-left:80px;*/ } } @media (max-width:1023px){ .slider-main-product { padding-left:0; float:right; } } @media (max-width:767px){ .verifiedPurchase{ margin-left: 0px !important; } .slider-main-product .slick-slide img { max-width:345px; margin-left:auto; margin-right:auto; } .btn-default{ width: 100%; margin-bottom: 10px; } #buttonContainer{ padding-right: 0px; } } .slider-main-product-nav { margin-top:1.5rem!important; } .slider-main-product-nav{ width:150px; margin-top:.5rem; float:left; position:relative; z-index:1; } .slider-main-product-nav .slick-slide{ border:1px solid transparent; margin-bottom:1.75rem; -webkit-transition:border-color .4s; transition:border-color .4s; } .slider-main-product-nav .slick-current{ border:1px solid #b1b1b1; } @media (max-width:1439px){ .slider-main-product-nav { width:70px; } .slider-main-product-nav .slick-slide { margin-bottom:2.5rem; } /* .prodImgInner { max-width:418px !important; } */ } @media (max-width:1023px){ .slider-main-product-nav { /*display:none;*/ } .main-product-slider { width:15%; } .slider-main-product { width:82%; } } .slick-list,.slick-slider{ position:relative; display:block; } .slick-slider{ box-sizing:border-box; -webkit-touch-callout:none; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; -ms-touch-action:pan-y; touch-action:pan-y; -webkit-tap-highlight-color:transparent; } .slick-list{ overflow:hidden; margin:0; padding:0; } .slick-list:focus, .slick-list:active{ outline:1px solid #6d6d6d; } .slick-slider .slick-list,.slick-slider .slick-track{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } .slick-track{ position:relative; left:0; top:0; display:block; max-width: 520px !important; } .slick-track:after,.slick-track:before{ content:""; display:table; } .slick-track:after{ clear:both; } .slick-slide{ float:left; height:100%; min-height:1px; display:none; } .slick-initialized .slick-slide{ display:block; } .slick-vertical .slick-slide{ display:block; height:auto; border:1px solid transparent; } .slick-slide { float: left; height: 100%; min-height: 1px; margin: 0 auto!important; /*width: 570px;*/ } .slick-slide img { display: block; margin: 0 auto!important; width: auto; /*max-width: 450px!important;*/ height: auto; /*max-height: 630px!important;*/ } .img-fluid:focus { outline-color: #ccc!important; } .img-fluid:active { outline-color: #ccc!important; border-color: #ccc; } .img-fluid { /*padding-bottom: 5px;*/ } .slick-slider .slick-list { height: auto!important; } .slick-vertical .slick-slide { border: none!; } /* Reviews */ /* .reviewAverage{ padding-top:15px; } */ .reviewAverageTxt{margin-left:5px; position:relative; top:-5px; } div#reviews { font-size: 12pt; } #reviewBottomSection{ padding-left: 2px; } .reviewTitle{ font-size: 14pt; } .reviewDetail{ font-size: 11pt; margin-bottom: 10px; } .reviewTitle{ font-weight: bold; } #reviewedBy{ display: inline-block; vertical-align: middle; margin-bottom: 10px; } .reviewRating { display: inline-block; } .starFull{ display:inline-block; width:20px; height:20px; background: url('../img/starFullSm.png') no-repeat top center; } .starHalf{ display:inline-block; width:20px; height:20px; background: url('../img/starHalfSm.png') no-repeat top center; } .starEmpty{ display:inline-block; width:20px; height:20px; background: url('../img/starEmptySm.png') no-repeat top center; } .helpfulOuter { margin-bottom: 5px; } .helpfulOuter a { font-size: 12pt; padding: 1px 9px; border-radius: 20px; width: 100px; } .verifiedPurchase{ display:inline-block; height:20px; margin-left:10px; vertical-align: middle; margin-bottom: 10px; } .verifiedPurchase i {color:#5cb85c;font-size:20px;} a#viewReviews { vertical-align: middle; margin-bottom: 10px; font-size: 11pt; display: inline-block; text-decoration: none; } a:hover#viewReviews { vertical-align: middle; margin-bottom: 10px; font-size: 11pt; display: inline-block; text-decoration: underline !important; } a:focus#viewReviews { vertical-align: middle; margin-bottom: 10px; font-size: 11pt; display: inline-block; text-decoration: underline !important; } /* Comparables */ #comparablesContainer{ text-align: center; } /* .compDetail { padding-top:10px; } */ @media (min-width: 768px) { .compDetail:first-child { padding-left:0px; } .compDetail .thumbnail:first-child { margin-left:0px; } } .compDetail .thumbnail { min-height: 225px; max-width: 225px; margin-left: auto; margin-right: auto; } .compDetailRegPriceStrike { text-decoration: line-through; float: right; } .compDetailSalePriceOuter { float: left; color: red; } /***** b2b css *****/ .upperButtonWrapper { display: none; } .product-links .qoAddBtn { display: block; } #styleMsg { padding-left: 15px; } #loggedOutB2BDiv{ padding-top: 30px; padding-left: 0px; font-size: 14pt; } @media (min-width: 768px) { .designNameOuter{ margin-bottom:0; } .deco-grid-price{ display: none ; } .deco-grid-header{ display: inline ; } } @media (max-width: 767px) { .deco-grid-header{ display: none ; } .deco-grid-price { display: inline; } } .design-label{ padding-left: 20px; width: auto; } .retailGrid .swatch-wrapper{ margin-bottom:0; } .retailGrid .product-grid-heading .product-description{ display:flex!important;; } .retailGrid .product-grid-heading .product-elem { width: 70px; } @media (min-width: 1149px) { .retailGrid .product-item, .retailGrid .product-grid-heading{ display:flex; flex-direction:row; } .retailGrid .product-head{ width:15%; margin-bottom:0; } .retailGrid .product-head{ display:block!important; } .retailGrid .product-description{ width:85%; } .retailGrid .prod-whse-cutoff{ font-size:13px; } } .designQty img{ max-height: 26px; max-width: 26px; } .designImgOuter{ height: 26px; } .designQtyInner{ height: 50px; } .product-grid-pricing { background-color: #F9F9F9; } .pricesales { background-color: #ffffff; color: black; } @media (min-width: 1149px) { .priceDivTable { width: fit-content; border-spacing: 3px; border-radius: 5px; height: 40px; background-color: #ed1b24; color: white; } .priceDivRow { width: 100px; float: left; } .priceDivCell { float: left; width: 100px; height: 20px; } } .priceDivTable { width: fit-content; border-spacing: 3px; border-radius: 5px; background-color: #ed1b24; color: white; } .priceDivRow { display:table-row; width: 100px; } .priceDivCell { float:left; display:table-column; width:100px; height: 20px; } /* Magic Zoom Plus v5.2.9 Copyright 2019 Magic Toolbox Buy a license: https://www.magictoolbox.com/magiczoomplus/ License agreement: https://www.magictoolbox.com/license/ */ @font-face { font-family: "magictoolbox-thin"; font-weight: normal; font-style: normal; src: url("fonts/magictoolbox-thin.eot?#iefix") format("embedded-opentype"), url("data:font/opentype;base64,AAEAAAANAIAAAwBQRkZUTXJLSEgAAAdAAAAAHEdERUYAKQAPAAAHIAAAAB5PUy8yAlYL4QAAAVgAAABWY21hcEAYY70AAAHUAAABSmdhc3D//wADAAAHGAAAAAhnbHlmMMVOJwAAAzQAAAGIaGVhZAmWUYMAAADcAAAANmhoZWEP9QamAAABFAAAACRobXR4L0EAQAAAAbAAAAAkbG9jYQGGAgAAAAMgAAAAFG1heHAAUAAcAAABOAAAACBuYW1l6MPgdAAABLwAAAH1cG9zdLaTuyIAAAa0AAAAZAABAAAAAQAAEWdxz18PPPUACwgAAAAAANDtg/MAAAAA0O2D8wAA/gIInAaeAAAACAACAAAAAAAAAAEAAAae/gIAuAibAAD//wicAAEAAAAAAAAAAAAAAAAAAAAJAAEAAAAJABkABQAAAAAAAgAAAAEAAQAAAEAAAAAAAAAAAQZeAZAABQAIBTMFmQAAAR4FMwWZAAAD1wBmAhIAAAAABQAAAAAAAAAAAAAAAAAAAAACAAAAAAAAUGZFZABAoAGgBgZm/mYAuAaeAf4AAAABAAAAAAAABAAAAAAAAAACqgAACJsAAAOlAAADpQAACJsAAAibAAAHfABAAAAAAwAAAAMAAAAcAAEAAAAAAEQAAwABAAAAHAAEACgAAAAGAAQAAQACAACgBv//AAAAAKAB//8AAGACAAEAAAAAAAAAAAEGAAABAAAAAAAAAAECAAAAAgAAAAAAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAqACoAKgBMAGAAdACIAJwAxAAFAAAAAAQABZoAAgAFAAgACwAPAAATEQkBIQE3AREJASEDESERZgFd/uECuP6kPQFd/mYBXP1IpAQABNf77AIK/ZkCC1z99gQU/lICCvrNBZr6ZgABAAD+AgicBp4ACwAACQEHCQEnCQE3CQEXBHEEKyP71fvVIwQr+9UjBCsEKyMCUPvVIwQr+9UjBCsEKyP71QQrIwAAAAEAAP4CA6YGngAFAAARARcJAQcDixv8iQN1GwJQBE4X+8n7yRcAAAABAAD+AgOmBp4ABQAACQEnCQE3A6b8dxsDd/yHGwJQ+7IXBDcENxcAAQAAADcInAPdAAUAACUBNwkBFwRO+7IXBDcENxc3A4oa/IkDeRoAAAEAAAA3CJwD3QAFAAAJAQcJAScETgROF/vJ+8kXA938dxsDd/yHGwACAEAAQAHAAcAADQAYAAAlBycGIyImNDYyFhUUDwEWMzI2NCYiBhUUAcAXcSk3P1lZflkh1yc5OFBQcFBXF3EhWX5ZWT82KQInUHBQUDg5AAAADACWAAEAAAAAAAEAEQAkAAEAAAAAAAIABABAAAEAAAAAAAMALQChAAEAAAAAAAQAEQDzAAEAAAAAAAUACwEdAAEAAAAAAAYAEQFNAAMAAQQJAAEAIgAAAAMAAQQJAAIACAA2AAMAAQQJAAMAWgBFAAMAAQQJAAQAIgDPAAMAAQQJAAUAFgEFAAMAAQQJAAYAIgEpAE0AYQBnAGkAYwBUAG8AbwBsAGIAbwB4AC0AVABoAGkAbgAATWFnaWNUb29sYm94LVRoaW4AAFQAaABpAG4AAFRoaW4AAEYAbwBuAHQARgBvAHIAZwBlACAAMgAuADAAIAA6ACAATQBhAGcAaQBjAFQAbwBvAGwAYgBvAHgALQBUAGgAaQBuACAAOgAgADIANwAtADEALQAyADAAMQA1AABGb250Rm9yZ2UgMi4wIDogTWFnaWNUb29sYm94LVRoaW4gOiAyNy0xLTIwMTUAAE0AYQBnAGkAYwBUAG8AbwBsAGIAbwB4AC0AVABoAGkAbgAATWFnaWNUb29sYm94LVRoaW4AAFYAZQByAHMAaQBvAG4AIAAxAC4AMAAAVmVyc2lvbiAxLjAAAE0AYQBnAGkAYwBUAG8AbwBsAGIAbwB4AC0AVABoAGkAbgAATWFnaWNUb29sYm94LVRoaW4AAAAAAAIAAAAAAAD/mgBmAAAAAAAAAAAAAAAAAAAAAAAAAAAACQAAAAEAAgECAQMBBAEFAQYBBwd1bmlBMDAxB3VuaUEwMDIHdW5pQTAwMwd1bmlBMDA0B3VuaUEwMDUHdW5pQTAwNgAAAAH//wACAAEAAAAMAAAAFgAAAAIAAQADAAgAAQAEAAAAAgAAAAAAAAABAAAAANBwQGEAAAAA0O2D8wAAAADQ7YPz"); } .MagicZoom, .mz-figure, .mz-lens, .mz-zoom-window, .mz-loading, .mz-hint, .mz-expand .mz-expand-stage, .mz-expand .mz-expand-stage .mz-image-stage, .mz-expand .mz-image-stage > figure .mz-caption, .mz-thumb img, .mz-expand-thumbnails, .mz-expand-controls, .mz-button { -webkit-box-sizing: border-box; box-sizing: border-box; } .MagicZoom, .mz-figure { display: inline-block; outline: 0 !important; font-size: 0 !important; line-height: 100% !important; direction: ltr !important; position: relative; z-index: 1; margin: 0 auto; vertical-align: middle; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .MagicZoom { -webkit-transform: translate3d(0,0,0); -ms-touch-action: pan-y; touch-action: pan-y; } figure.mz-figure { overflow: hidden; margin: 0 !important; width: 100%; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } .MagicZoom img, .mz-figure img { border: 0 !important; margin: 0 !important; outline: 0 !important; padding: 0 !important; } .MagicZoom > img, .mz-figure > img { width: 100%; height: auto; } .ie8-magic .MagicZoom > img, .ie8-magic .mz-figure > img { width: 100%; max-width: none !important; } .mz-figure.mz-no-zoom.mz-no-expand, .mz-expand .mz-figure.mz-no-zoom { cursor: default !important; } .mz-figure.mz-active, .mz-expand { -ms-touch-action: none; touch-action: none; } .mz-lens, .mz-zoom-window { position: absolute !important; overflow: hidden !important; pointer-events: none !important; } .mz-lens img, .mz-zoom-window img { position: absolute !important; max-width: none !important; max-height: none !important; } .mz-lens img { -webkit-transition: none !important; transition: none !important; } .mz-zoom-window { z-index: 2000000000; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); } .mz-zoom-window.mz-magnifier { -webkit-mask-image: -webkit-radial-gradient(circle, white, black); -webkit-mask-clip: content; cursor: none; } .mz-figure.mz-active .mz-zoom-window.mz-magnifier { pointer-events: auto !important; cursor: inherit !important; } .mz-zoom-window.mz-magnifier.mz-expanded { z-index: 2147483647; } .mz-zoom-window img { width: auto; height: auto; left: -1000%; right: -1000%; top: -1000%; bottom: -1000%; margin: auto !important; -webkit-transition: none !important; transition: none !important; -webkit-transform-origin: 50% 50% !important; -ms-transform-origin: 50% 50% !important; transform-origin: 50% 50% !important; } .mz-zoom-window.mz-preview img { top: 0 !important; bottom: 0 !important; left: 0 !important; right: 0 !important; margin: 0 !important; width: 100% !important; height: auto !important; -webkit-transform: none !important; transform: none !important; } .lt-ie9-magic .mz-zoom-window img { margin: 0 !important; } .mz-expand-controls { z-index: 2147483647; } .mz-fade { -webkit-transition: opacity .25s; transition: opacity .25s; } .mz-hidden { opacity: 0; } .mz-visible { opacity: 1; } .mobile-magic .mz-expand .mz-expand-bg { -webkit-transform-style: flat !important; transform-style: flat !important; } .mobile-magic .mz-expand .mz-image-stage > figure .mz-caption { display: none !important; } .mobile-magic .mz-expand-controls.mz-fade { transition: none !important; } .mobile-magic .mz-expand > .mz-zoom-window { top: 0 !important; left: 0 !important; } .mz-expanded-view-open, .mz-expanded-view-open body { overflow: hidden !important; } .mz-expanded-view-open body { height: auto !important; } /** * Main figure */ .mz-figure.mz-active { background: #fff; } .mz-figure.mz-no-zoom, .mz-figure.mz-click-zoom, .mz-figure.mz-active { cursor: pointer; cursor: -webkit-zoom-in; cursor: -moz-zoom-in; cursor: zoom-in; } .mz-figure.mz-active.mz-no-expand { cursor: crosshair; } .mz-figure.mz-active.mz-click-zoom.mz-no-expand { cursor: crosshair; cursor: -webkit-zoom-out; cursor: -moz-zoom-out; cursor: zoom-out; } .mz-figure.mz-active.mz-magnifier-zoom.mz-hover-zoom.mz-no-expand { cursor: none; } .mz-figure.mz-magnifier-zoom.mz-active { overflow: visible !important; } .mz-figure.mz-active > img { filter: url("data:image/svg+xml;utf8,#grayscale"); -webkit-filter: grayscale(80%) opacity(60%); filter: grayscale(80%) opacity(60%); } .no-cssfilters-magic .mz-figure.mz-active > img { opacity: 0.6; } .lt-ie10-magic .mz-figure.mz-active > img { opacity: 1; filter: progid:DXImageTransform.Microsoft.BasicImage(grayScale=1,opacity=0.6); } .mz-figure.mz-active.mz-inner-zoom, .lt-ie11-magic .mz-expand .mz-figure.mz-active.mz-inner-zoom, .lt-ie11-magic .mz-figure.mz-active.mz-inner-zoom > img { opacity: 0; } .lt-ie11-magic .mz-figure.mz-active.mz-inner-zoom, .lt-ie11-magic .mz-figure.mz-active.mz-inner-zoom > .mz-zoom-window { opacity: 1; } .lt-ie10-magic .mz-expand .mz-figure.mz-active.mz-inner-zoom, .lt-ie10-magic .mz-figure.mz-active.mz-inner-zoom > img { filter: alpha(opacity=0); } .ie9-magic .mz-expand .mz-figure.mz-active.mz-inner-zoom { background: transparent; } /** * Zoom lens */ .mz-lens { border: 1px solid #aaa; border-color: rgba(170,170,170,0.7); box-shadow: 0 0 5px rgba(0,0,0,.3); cursor: none; z-index: 10; opacity: 0; } .mz-figure.mz-active .mz-lens { opacity: 1; -webkit-transition: opacity .3s cubic-bezier(0.25, 0.5, 0.5, 0.9) .1s; transition: opacity .3s cubic-bezier(0.25, 0.5, 0.5, 0.9) .1s; } .mz-figure.mz-active.mz-magnifier-zoom .mz-lens { border-radius: 50%; opacity: 0; cursor: none; } /** * Zoom window */ .mz-zoom-window { background: #fff; box-shadow: 0 0 3px rgba(0, 0, 0, .2); } .mz-zoom-window.mz-magnifier { border-radius: 100%; border: 0; background: rgba(255,255,255,.3); } .mz-zoom-window.mz-magnifier:before { content: ""; display: block; position: absolute; top: 0;bottom: 0; left: 0; right: 0; border-radius: 100%; border: 1px solid rgba(170,170,170,0.7); box-shadow: inset 0 0 20px 1px rgba(0,0,0,.3); background: transparent; z-index: 1; } .mz-zoom-window.mz-magnifier.mz-square, .mz-zoom-window.mz-magnifier.mz-square:before { border-radius: 0 !important; } .lt-ie9-magic .mz-zoom-window { border: 1px solid #e5e5e5; } .mz-zoom-window.mz-inner { border: none; box-shadow: none; } /* Caption in zoom window */ .mz-zoom-window .mz-caption { background: #777; color: #fff; font-size: 10pt; opacity: 0.8; position: absolute; top: 0; z-index: 150; padding: 3px; width: 100%; line-height: normal !important; text-align: center !important; } .lt-ie9-magic .mz-zoom-window .mz-caption { filter: alpha(opacity=80); } .mz-zoom-window.caption-bottom .mz-caption { top: auto; bottom: 0; } .mz-zoom-window.mz-expanded > .mz-caption { display: none; } /* Zoom window animations */ .mz-zoom-window.mz-deactivating, .mz-zoom-window.mz-activating { -webkit-transition: opacity 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9), -webkit-transform 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9); transition: opacity 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9), transform 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9); } .mz-zoom-window.mz-deactivating { -webkit-transition-duration: .25s, .25s, .25s; transition-duration: .25s, .25s, .25s; } .mz-zoom-window.mz-p-right, .mz-zoom-window.mz-p-left, .mz-zoom-window.mz-p-top, .mz-zoom-window.mz-p-bottom { opacity: 0; z-index: -100; } .mz-zoom-window.mz-p-right { -webkit-transform: translate3d(-20%, 0, 0); transform: translate3d(-20%, 0, 0); } .mz-zoom-window.mz-p-left { -webkit-transform: translate3d(20%, 0, 0); transform: translate3d(20%, 0, 0); } .mz-zoom-window.mz-p-top { -webkit-transform: translate3d(0, 20%, 0); transform: translate3d(0, 20%, 0); } .mz-zoom-window.mz-p-bottom { -webkit-transform: translate3d(0, -20%, 0); transform: translate3d(0, -20%, 0); } /* Inner mode animation */ .mz-zoom-window > img { -webkit-transform: translate3d(0, 0, 0) scale(1); transform: translate3d(0, 0, 0) scale(1); -webkit-backface-visibility: hidden; backface-visibility: hidden; } .mz-zoom-window.mz-p-inner.mz-deactivating > img, .mz-zoom-window.mz-p-inner.mz-activating > img { -webkit-transition: -webkit-transform .22s cubic-bezier(0.25, 0.5, 0.5, 0.9) !important; transition: transform .22s cubic-bezier(0.25, 0.5, 0.5, 0.9) !important; } /* Magnifier mode animation */ .mz-zoom-window.mz-p-magnifier { -webkit-transform: scale(.1); transform: scale(.1); } /* Preview mode animation */ .mz-zoom-window.mz-preview.mz-deactivating, .mz-zoom-window.mz-preview.mz-activating, .mz-zoom-window.mz-custom.mz-deactivating, .mz-zoom-window.mz-custom.mz-activating { -webkit-transition: opacity 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9); transition: opacity 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9); } .mz-zoom-window.mz-preview.mz-deactivating, .mz-zoom-window.mz-custom.mz-deactivating { -webkit-transition-duration: .2s; transition-duration: .2s; } .mz-zoom-window.mz-p-preview, .mz-zoom-window.mz-p-custom { opacity: 0; } /** * Hint & Loading */ .mz-hint, .mz-loading { color: #eee; background: rgba(49,51,61,0.7); font: normal 12px/1.2em 'Lucida Grande', 'Lucida Sans Unicode', Verdana, 'Helvetica Neue', Arial, Helvetica, sans-serif; text-decoration: none; text-align: center; direction: ltr; display: inline-block; margin: 0; position: absolute; z-index: 1000; pointer-events: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-transition: opacity 0.25s ease; transition: opacity 0.25s ease; } .mz-hint { bottom: 8px; left: 0; right: 0; padding: 0 10%; background-color: transparent; -webkit-transition: opacity 0.25s ease, z-index 0.25s ease; transition: opacity 0.25s ease, z-index 0.25s ease; } .mz-hint-message { display: inline-block; background: rgba(49,51,61,0.7); border-radius: 2em; padding: .7em 1.1em; } .mz-hint-message:before { content: '\02295'; font-family: serif; font-size: 1.5em; speak: none; text-align: center; vertical-align: -2px; margin-right: 6px; -webkit-transition: opacity 0.25s ease; transition: opacity 0.25s ease; } .mobile-magic .mz-hint-message:before { display: none; } .mz-hint-hidden { opacity: 0; z-index: -1; -webkit-transition-delay: .6s; transition-delay: .6s; } /* Hint in the expanded view on mobile */ .mz-expand .mz-hint { font-size: 18px; line-height: 1.1em; top: 50%; bottom: auto; margin: 0; -webkit-transform: translate(0,-50%); -ms-transform: translate(0,-50%); transform: translate(0,-50%); } .mz-expand .mz-hint-message { padding: 1.1em; } .mz-expand .mz-hint-message:before { display: none; } .mz-expand .mz-hint-hidden { -webkit-transition-delay: 1s; transition-delay: 1s; opacity: 0; } /* Loading indicator */ .mz-loading { font-size: 0; border-radius: 100%; opacity: 0; padding: 0; width: 36px; height: 36px; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .mz-loading:after { content: ''; position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 24px; height: 24px; margin: auto; text-indent: -9999em; border-radius: 50%; border: 2px solid rgba(255, 255, 255, 1); border-top-color: transparent; box-sizing: border-box; } .mz-loading.shown { opacity: 1; z-index: 1; -webkit-transition: opacity 0s; transition: opacity 0s; } .mz-loading.shown:after { -webkit-animation: spin-loading .9s infinite linear; animation: spin-loading .9s infinite linear; } @-webkit-keyframes spin-loading { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes spin-loading { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } .lt-ie10-magic .mz-loading { border-radius: 2em; font-size: 12px; padding: .7em 1.1em; width: auto; height: auto; } .lt-ie10-magic .mz-loading:after { content: 'Loading...'; text-indent: 0; border: none; position: relative; } .lt-ie9-magic .mz-loading { filter: alpha(opacity=0); right: 0; left: 0; width: 126px; margin: auto; } .lt-ie9-magic .mz-hint-message, .lt-ie9-magic .mz-loading.shown { background: transparent !important; filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#7c31333D', EndColorStr='#7c31333D'); } .lt-ie9-magic .mz-hint-hidden { filter: alpha(opacity=0); } /** * Expanded view */ .mz-expand, .mz-expand .mz-expand-bg, .mz-expand .mz-expand-bg > img, .mz-expand .mz-expand-bg > svg, .mz-expand .mz-expand-stage, .mz-expand .mz-expand-stage .mz-image-stage { position: absolute; top: 0; bottom: 0; left: 0; right: 0; } .mz-expand .mz-expand-bg, .mz-expand .mz-expand-bg > img, .mz-expand .mz-expand-bg > svg { width: auto !important; height: auto !important; } .mz-expand .mz-expand-bg, .mz-expand .mz-expand-bg > svg { min-width: 100% !important; min-height: 100% !important; } .mz-expand { background-color: rgba(0, 0, 0, 1); text-align: center; vertical-align: middle; display: block; overflow: hidden; z-index: 2100000000; position: fixed; width: auto; height: auto; -webkit-perspective: 600px; perspective: 600px; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-backface-visibility: hidden; backface-visibility: hidden; -ms-overflow-style: none; } /* Expanded view background */ .mz-expand .mz-expand-bg { display: inline-block; max-width: none !important; max-height: none !important; margin: auto; vertical-align: middle; z-index: -100; background-repeat: no-repeat; background-size: cover; -webkit-perspective: 600px; perspective: 600px; -webkit-transform: translate3d(0, 0, 0) scale(10) rotate(0.01deg); transform: translate3d(0, 0 ,0) scale(10) rotate(0.01deg); } :root:not([data-magic-ua=safari]) .mz-expand .mz-expand-bg { filter: url("data:image/svg+xml;utf8,#blur"); -webkit-filter: blur(20px) brightness(60%); filter: blur(20px) brightness(60%); } .mz-expand .mz-expand-bg > img { margin: auto; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); -webkit-backface-visibility: hidden; backface-visibility: hidden; } [data-magic-ua=safari] .mz-expand .mz-expand-bg > img { filter: url("data:image/svg+xml;utf8,#blur"); -webkit-filter: blur(20px) brightness(60%); filter: blur(20px) brightness(60%); } .mz-expand .mz-expand-bg > svg { margin: auto; opacity: .6; } [data-magic-ua=edge] .mz-expand .mz-expand-bg, .lt-ie10-magic .mz-expand .mz-expand-bg { display: none !important; } .lt-ie9-magic .mz-expand { background: #1f1f1f; } [data-magic-ua=edge] .mz-expand { background-color: rgba(31, 31, 31, .96); } /** Plain backgrounds: dark-bg, white-bg **/ .mz-expand.plain-bg .mz-expand-bg, .mz-expand.dark-bg .mz-expand-bg, .mz-expand.white-bg .mz-expand-bg { display: none !important; } .mz-expand.dark-bg { background-color: #1f1f1f; background-color: rgba(31, 31, 31, .96); } .mz-expand.white-bg { background-color: #fff; } /* Expanded view stage */ .mz-expand .mz-expand-stage { z-index: 2100000000; padding: 0; } .mz-expand .mz-expand-stage .mz-image-stage { z-index: 50; left: 120px; right: 120px; padding: 20px 0 40px 0; margin: 0; text-align: center; vertical-align: middle; -webkit-perspective: 600px; perspective: 600px; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .mz-expand .mz-expand-stage.with-thumbs .mz-image-stage { padding-bottom: 120px; } .mz-expand .mz-expand-stage.mz-zoom-in .mz-image-stage { padding: 0 !important; left: 0; right: 0; } .mz-expand .mz-image-stage > figure:before, .mz-expand .mz-image-stage:before { content: ''; display: inline-block; vertical-align: middle; height: 100%; font-size: 0; line-height: 100%; width: 0; } .mz-expand .mz-image-stage > figure { width: 100%; max-width: 100%; max-height: 100%; padding: 0; margin: 0; display: inline-block; vertical-align: middle; font-size: 0; line-height: 100%; position: relative; } .mz-expand .mz-figure { overflow: visible; max-width: 100% !important; } .mz-expand .mz-figure > img { max-width: 100%; width: auto; height: auto; } .mz-expand .mz-zoom-in .mz-image-stage > figure, .mz-expand .mz-zoom-in .mz-image-stage > figure .mz-figure.mz-activating, .mz-expand .mz-zoom-in .mz-image-stage > figure .mz-figure.mz-active { width: 100%; height: 100%; } .mz-expand .mz-figure { cursor: pointer; cursor: -webkit-zoom-in; cursor: -moz-zoom-in; cursor: zoom-in; } .mz-expand .mz-figure.mz-active { cursor: crosshair; cursor: -webkit-zoom-out; cursor: -moz-zoom-out; cursor: zoom-out; } /* When inner zoom is always shown */ .mz-expand .mz-expand-stage.mz-zoom-in.mz-always-zoom .mz-image-stage > figure > figure > img { z-index: 1; position: absolute !important; top: -5000px !important; bottom: -5000px !important; left: -5000px !important; right: -5000px !important; margin: auto !important; } .lt-ie10-magic .mz-zoom-window.mz-expanded img { filter: alpha(opacity=100); } .lt-ie10-magic .mz-expand .mz-figure.mz-magnifier-zoom { overflow: hidden; filter: alpha(opacity=100); } /* Caption in expanded view */ .mz-expand .mz-caption { color: #fff; text-shadow: 0px 0px 46px #000; padding: 10px 4px; font: normal 10pt/1em 'Lucida Grande', 'Lucida Sans Unicode', Verdana, 'Helvetica Neue', Arial, Helvetica, sans-serif; text-align: center; width: 100%; position: absolute; left: 0; opacity: 0; } .mz-expand .mz-caption.mz-show { -webkit-transition: opacity 0.15s ease-out; transition: opacity 0.15s ease-out; opacity: 1; } .mz-expand .mz-caption a { color: inherit; cursor: pointer; } .mz-expand.white-bg .mz-caption { color: #555; text-shadow: none; } .lt-ie9-magic .mz-expand .mz-caption { top: 100%; } .mz-expand .mz-zoom-window { box-shadow: none; background: transparent; } .lt-ie9-magic .mz-expand .mz-zoom-window { border: 0; } /* Expanded view on mobile */ .mobile-magic .mz-expand-stage .mz-expand-thumbnails, .mobile-magic .mz-expand-stage .mz-image-stage { left: 0px; right: 0px; } .mobile-magic .mz-expand .mz-expand-stage.with-thumbs { bottom: 0px; } .mobile-magic .mz-expand-stage .mz-image-stage { padding: 0; } .mobile-magic .mz-expand .mz-expand-stage.with-thumbs .mz-image-stage { padding: 5px 0 90px; } .mobile-magic .mz-expand .mz-expand-stage.mz-zoom-in .mz-image-stage { padding-top: 0; } .mobile-magic .mz-expand .mz-expand-thumbnails { padding: 15px 0; height: 90px; } /** * Buttons & Arrows */ .mz-expand-controls, button.mz-button { margin: 0 !important; padding: 0 !important; outline: 0 !important; } button.mz-button { color: #b4b4b4 !important; font: 900 34px/1 'magictoolbox-thin' !important; cursor: pointer; z-index: 90 !important; background-color: transparent !important; border: 1px solid rgba(180, 180, 180, 0) !important; border-radius: 100% !important; box-shadow: none !important; position: absolute !important; text-transform: none !important; text-align: center; speak: none; -webkit-font-smoothing: antialiased; width: 60px !important; height: 60px !important; min-width: 0 !important; min-height: 0 !important; max-width: none !important; max-height: none !important; } button.mz-button:before { display: inline; position: static; color: inherit !important; font: inherit !important; -webkit-font-smoothing: inherit !important; } button.mz-button.mz-button-prev, button.mz-button.mz-button-next { margin: auto 10px !important; top: 0 !important; bottom: 0 !important; overflow: hidden !important; } button.mz-button.mz-button-prev { left: 0 !important; } button.mz-button.mz-button-next { right: 0 !important; } button.mz-button.mz-button-close { font-size: 26px !important; margin: 10px !important; top: 0 !important; right: 0 !important; z-index: 95 !important; } :root:not(.mobile-magic) button.mz-button { color: rgba(180, 180, 180, .75) !important; -webkit-transform: scale(.85) !important; transform: scale(.85) !important; -webkit-transition: color .25s, border-color .25s, -webkit-transform .25s !important; transition: color .25s, border-color .25s, transform .25s !important; } :root:not(.mobile-magic) button.mz-button:hover { color: rgba(180, 180, 180, 1) !important; border-color: rgba(180, 180, 180, .6) !important; -webkit-transform: scale(1) !important; transform: scale(1) !important; } .mobile-magic button.mz-button { -webkit-transition: -webkit-transform .1s !important; transition: transform .1s !important; } .mobile-magic button.mz-button:active { border-color: rgba(180, 180, 180, .6) !important; -webkit-transform: scale(.95) !important; transform: scale(.95) !important; } button.mz-button.mz-button-close:before { content: "\a001"; } button.mz-button.mz-button-prev:before { content: "\a002"; } button.mz-button.mz-button-next:before { content: "\a003"; } @media screen and (max-device-width: 767px) { button.mz-button-prev, button.mz-button-next { display: none !important; } .mobile-magic .mz-expand button.mz-button { width: 44px !important; height: 44px !important; font-size: 18px !important; color: rgba(255, 255, 255, 0.8) !important; background-color: rgba(49,51,61,0.3) !important; border-color: transparent !important; } } .lt-ie9-magic button.mz-button { border: 0; filter: alpha(opacity=75); } .lt-ie9-magic button.mz-button:hover { filter: alpha(opacity=100); } /** * Thumbnails */ /* Thumbnails on the page */ /* a[data-zoom-id], .mz-thumb, .mz-thumb:focus { display: inline-block; line-height: 0; outline: none; } */ a[data-zoom-id] img, .mz-thumb img { border: 0; box-shadow: 0 0 1px 0px rgba(0,0,0,0.3); box-sizing: border-box; } /** * egj remove the hover on effect */ /* .mz-thumb:hover:not(.mz-thumb-selected) img { -webkit-filter: brightness(75%); filter: brightness(75%); } .mz-thumb-selected img { -webkit-filter: brightness(60%); filter: brightness(60%); } */ .no-cssfilters-magic .mz-thumb:hover, .no-cssfilters-magic .mz-thumb.mz-thumb-selected { background: #000; } .no-cssfilters-magic .mz-thumb:hover:not(.mz-thumb-selected) img { opacity: .75; filter: alpha(opacity=75); } .no-cssfilters-magic .mz-thumb-selected img { opacity: .6; filter: alpha(opacity=60); } .ie9-magic .mz-thumb img { box-shadow: 0 0 4px 0px rgba(0,0,0,0.3); } /* Thumbnails in expanded view */ .mz-expand-thumbnails { z-index: 50; position: absolute; bottom: 0; left: 65px; right: 65px; height: 80px; padding: 10px 0; box-sizing: border-box; } .mz-expand-thumbnails .magic-thumbs .magic-thumb { padding: 10px 2px; } .mz-expand-thumbnails .magic-thumb > img { cursor: pointer; height: 40px; box-shadow:0 0 5px 1px rgba(0,0,0,0.3); } .mz-expand-thumbnails .magic-thumb:not(.magic-thumb-selected) > img:hover { -webkit-filter: brightness(70%); filter: brightness(70%); } .mz-expand-thumbnails .magic-thumb-selected img { -webkit-filter: brightness(50%); filter: brightness(50%); } .mz-expand-thumbnails .magic-thumbs .magic-thumbs-button { box-shadow: none; } .mz-expand-thumbnails .magic-thumbs .magic-thumbs-button-disabled { opacity: 0; } .no-cssfilters-magic .mz-expand-thumbnails .magic-thumb:hover:not(.magic-thumb-selected) img { opacity: .7; filter: alpha(opacity=70); } .no-cssfilters-magic .mz-expand-thumbnails .magic-thumb-selected img { opacity: .5; filter: alpha(opacity=50); } /** Hide thumbnails in expanded view with .no-expand-thumbnails class **/ .mz-expand.no-expand-thumbnails .mz-expand-stage.with-thumbs .mz-image-stage { padding-bottom: 40px; } .mz-expand.no-expand-thumbnails .mz-expand-thumbnails { display: none; } .mobile-magic .mz-expand.no-expand-thumbnails .mz-expand-stage.with-thumbs .mz-image-stage { padding: 0; } .magic-thumbs, .magic-thumbs .magic-thumbs-wrapper, .magic-thumbs ul, .magic-thumbs li, .magic-thumbs li:before, .magic-thumbs li:after, .magic-thumbs li img, .magic-thumbs .magic-thumbs-button { margin: 0; padding: 0; outline: 0; -webkit-box-sizing: border-box; box-sizing: border-box; } .magic-thumbs { direction: ltr; overflow: visible; z-index: 100; position: relative; left: 0; top: 0; padding: 0 30px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent; -ms-touch-action: none; touch-action: none; } .magic-thumbs { width: 100%; height: 100%; white-space: nowrap; } .magic-thumbs.no-buttons { padding: 0 !important; } .magic-thumbs-wrapper { display: block; width: 100%; height: 100%; position: relative; overflow: hidden; text-align: center; } .magic-thumbs ul { list-style: none; font-size: 0; display: inline-block; vertical-align: middle; height: 100%; position: relative; white-space: nowrap; } .magic-thumbs.no-buttons ul { left: 0 !important; padding: 0 !important; -webkit-transition: none !important; transition: none !important; -webkit-transform: none !important; -ms-transform: none !important; transform: none !important; } .magic-thumbs ul li { margin: 0 4px; height: 100%; width: auto; vertical-align: top; line-height: 0; display: inline-block; } .magic-thumbs ul li:after { content: ''; display: inline-block; vertical-align: middle; height: 100%; width: 0; } .magic-thumbs ul li > img { width: auto; height: auto; max-width: none !important; max-height: 100% !important; vertical-align: middle; } .ie8-magic .magic-thumbs ul li > img { max-width: none !important; max-height: none !important; } /* vertical */ .magic-thumbs.magic-thumbs-vertical { height: 100%; } .magic-thumbs-vertical { padding: 30px 0; } .magic-thumbs-vertical ul { height: auto; width: 100%; white-space: normal; } .magic-thumbs-vertical ul li { width: 100%; height: auto; } .magic-thumbs-vertical ul li { margin: 4px 0; } .magic-thumbs-vertical ul li > img { max-width: 100% !important; max-height: none !important; } .ie8-magic .magic-thumbs-vertical ul li > img { width: 100%; } /** * Buttons */ .magic-thumbs button.magic-thumbs-button { color: #b4b4b4 !important; font: 900 24px/1 'magictoolbox-thin' !important; cursor: pointer; z-index: 90 !important; background-repeat: no-repeat; background-color: transparent !important; background-image: none; border: 0; border-radius: 0; box-shadow: none !important; overflow: hidden; position: absolute; text-transform: none !important; speak: none; text-align: center; -webkit-font-smoothing: antialiased; width: 30px; height: 100%; top: 0; bottom: 0; min-width: 0 !important; min-height: 0 !important; max-width: none !important; max-height: none !important; } .magic-thumbs button.magic-thumbs-button:before { display: inline; position: static; color: inherit !important; font: inherit !important; -webkit-font-smoothing: inherit !important; } .magic-thumbs .magic-thumbs-button-prev { left: 0; } .magic-thumbs .magic-thumbs-button-next { right: 0; } .magic-thumbs .magic-thumbs-button-prev:before { content: "\a002"; } .magic-thumbs .magic-thumbs-button-next:before { content: "\a003"; } :root:not(.mobile-magic) .magic-thumbs button.magic-thumbs-button { color: rgba(180, 180, 180, .75) !important; -webkit-transform: scale(.85) !important; transform: scale(.85) !important; -webkit-transition: color .25s, -webkit-transform .25s !important; transition: color .25s, transform .25s !important; } :root:not(.mobile-magic) .magic-thumbs button.magic-thumbs-button:hover { color: rgba(180, 180, 180, 1) !important; -webkit-transform: scale(1) !important; transform: scale(1) !important; } /* Vertical buttons */ .magic-thumbs-vertical .magic-thumbs-button { width: 100%; height: 30px; left: 0; right: 0; top: auto; bottom: auto; } .magic-thumbs-vertical .magic-thumbs-button-prev { top: 0; } .magic-thumbs-vertical .magic-thumbs-button-next { bottom: 0; } .magic-thumbs-vertical .magic-thumbs-button-prev:before { content: "\a005"; } .magic-thumbs-vertical .magic-thumbs-button-next:before { content: "\a004"; } .magic-thumbs.no-buttons .magic-thumbs-button { display: none !important; } .magic-thumbs-button-disabled { opacity: 0.2; filter: alpha(opacity = 20); } .select2-results__option{ display:flex; } .s2designMore{ display:flex; justify-content:space-between; } .s2img{ width:75px; } .s2desc{ width: 100%; font-weight: bold; font-size: 110%; display: flex; flex-direction: column; justify-content: space-around; } .s2desc.appliedDesign .s2descInner{ color:green; } .s2designMore{ width:100%; font-weight:normal;font-size:80%; } .s2status{ margin-left:5px; font-style: italic; color: #999; } .s2descInner{ display: flex; justify-content: space-between; } .s2Price{ font-weight: normal; font-size: 80%; } .imgUpper { padding: 10px 15px 0px 0px; } button.addToWishlistBtn, button.viewCartBtn { margin-bottom: 10px; min-width: 185px; } /* ================== Quickorder ======================= */ .orderGrid{ width:100%; } .orderGrid td{ text-align:center; line-height:1.5; } .orderGrid th{ text-align:center; } .orderGrid thead tr th{ border-right: 1px solid #999; } .orderGrid tr{ border:1px solid #999; text-shadow:0 1px 0 #fff; background: #ffffff; background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjQ3JSIgc3RvcC1jb2xvcj0iI2Y2ZjZmNiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlZGVkZWQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #ffffff 0%, #f6f6f6 47%, #ededed 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(47%,#f6f6f6), color-stop(100%,#ededed)); background: -webkit-linear-gradient(top, #ffffff 0%,#f6f6f6 47%,#ededed 100%); background: -o-linear-gradient(top, #ffffff 0%,#f6f6f6 47%,#ededed 100%); background: -ms-linear-gradient(top, #ffffff 0%,#f6f6f6 47%,#ededed 100%); background: linear-gradient(to bottom, #ffffff 0%,#f6f6f6 47%,#ededed 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 ); } .orderGrid .qoDesc{ border-right:1px solid #999; background:#fff; text-align:left; /*box-shadow: 0 0 0 2px #FFFFFF inset;*/ } .qoGridItem,.qoNotify,.qoPrepack { border-right: 1px solid #999; } .qoRegPrice{ display:inline; } .qoSalePrice{ display:block; color:red;} .qoPriceStrike{ text-decoration: line-through; } .txtLight{ color:#fff; font-weight:bold; text-shadow:none; /*text-shadow:0 1px 0 #222;*/ } .txtDark{ color:#000; font-weight:bold; text-shadow:none; /*text-shadow:0 -1px 0 #EEE;*/ } .stockLabel, .expStockLabel, .eachLabel{ font-weight:normal; text-shadow:none; text-align:right; margin-right:6px; /*font-style: italic;*/ opacity:0.6; } .stockLabel, .expStockLabel{ cursor: pointer; text-decoration:underline; } .gridSwatch{ border: 1px solid #fff; box-shadow: 0 0 1px #000; width:40px; height:40px; } /* =============== Quickorder Sale Expiry ToolTip Class =============== */ .qoSaleExpTooltip{ position: relative; transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out; display:block; padding:0; margin:0; } .qoSaleExpTooltip:after{ background: #000; background: rgba(0,0,0,.8); border-radius: 6px; top: -30px; color: #fff; content: attr(data-sale_expiry); left: -9999px; white-space:nowrap; min-width:20px; padding: 0 5px; margin:0; position: absolute; z-index: 9930; border:1px solid #fff; box-shadow:0 0 10px #000; transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out; opacity:0; } .qoSaleExpTooltip:before{ border: solid; border-color: #FFF transparent; border-width: 8px 8px 0 8px; top: -9px; content: ""; margin:0 0 0 35%; padding:0; left: -9999px; position: absolute; z-index: 9940; transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out; opacity:0; } .qoSaleExpTooltip:hover:after{ left: -1px; opacity:45; } .qoSaleExpTooltip:hover:before{ left: 12px; opacity:45; } /*===================================================*/ /* Backorder Overlay */ /*===================================================*/ .backorderDialog{ position:absolute; display:none; background:#fff; border:1px solid #ccc; border-radius:6px; padding:6px; z-index: 9900; /* must be higher z-index than overlay (9800) */ text-align:center; box-shadow: 0 0 50px #000000; } .backorderTitle{ text-align:center; margin: -6px -6px 0 -6px; padding:0 6px; } .boMessage{ font-weight:bold; padding: 10px 0 6px 0; } .backorderDialog li{ list-style:none; } .boChoiceTable{ margin:0 auto; } .boChoiceTable td, .boChoiceTable th{ padding: 0 5px; } .boOptList{ text-align:left; width:100%; margin:0 auto 8px auto; background:#F6F6F6; padding: 5px; } .boChoiceTable th:first-child, .boChoiceTable td:first-child{ text-align:left; } .boChoiceTable{ border: 1px solid #EEE; margin-bottom:8px; text-shadow: 0 1px 0 #FFF; } .boChoiceTable th{ border-right:1px solid #EEE; border-left:1px solid #EEE; margin: 0 -1px; font-variant:small-caps; background: #F0F0F0; } .boChoiceTable thead{ border-bottom: 1px solid #EEE; } .boChoiceTable tr:nth-child(even){ background:#F3F3F3; } .boChoiceTable tr:nth-child(odd){ background:#F9F9F9; } /* Item Notification */ .qoNotifyBtn i { font-size: 24px; color: #888; } .qoNotifyBtn.selected i { color: #6a975d; } /* Prepack Dialog */ .fdm4DecoratorTitle{ font-size: 20px; font-weight: bold; font-style: italic; } .btn-decorate{ position:relative; padding-left: 46px; } .btn-decorate img{ position:absolute; top:-14px; left:3px; } /* FDM4 Decorator Styles */ #fdm4Decorator { z-index:100; width:96%; /*height:720px;*/ padding:10px; position:absolute; top:70px; margin: 0 auto; text-align:center; left: 0; right: 0; background:#DDDDDD; border:1px solid #333; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; -moz-box-shadow: 0 0 55px #333 ; -webkit-box-shadow: 0 0 55px #333 ; box-shadow: 0 0 55px #333 ; -webkit-transition: opacity 0.7s; transition: opacity 0.7s; opacity:1; } #fdm4Decorator.offScreen{ left:-9999px; display:block; opacity:0.01; } #fdm4DecoratorIframe{ width:100%; height:680px; border: 1px solid #999; } .decorateLineBtn{ text-align:center; position:relative; top:8px; } a.decoratorClose, a.decoratorClose:active,a.decoratorClose:link, a.decoratorClose:hover, a.decoratorClose:visited{ position:absolute; right:-13px; top:-13px; background:#fff; color: #4d4d4d; border:2px solid #333; border-radius:15px; display:block; width:25px; height:25px; text-align:center; line-height:20px; font-size:28px; /*box-shadow: 1px 1px 2px #000; */ text-decoration:none; } a.decoratorClose:hover { color: #b2151b; } #applyDesignDialog{ z-index: 9999; display: none; position: absolute; width: 980px; background-color : #ffffff; top: 125px; border: 1px solid #666; border-radius: 6px; box-shadow: 0 0 75px #000; box-sizing: border-box; } #applyDesignDialog div{ box-sizing: border-box; } #applyDesignTitle{ font-size:16px; font-weight:bold; background:#eee; border-bottom:1px solid #999; text-align:center; line-height:28px; border-radius: 6px 6px 0 0; margin-bottom:10px; position:relative; } #applyDesignForm{ display:none; } .designPreview{ width:175px; float:left; border:2px solid #CCC; margin:10px; border-radius:6px; cursor:pointer; } .designPreview.selected{ border-color: #00d6c9; box-shadow:0 0 10px #00d6c9;; } .designTitle{ text-align:center; font-size:12px; text-overflow: ellipsis; overflow:hidden; white-space:nowrap; } .designLocPreview{ float:left; position:relative; } .designLocPreview.selected{ /*font-weight:bold;*/ text-decoration:underline; border-radius:4px; } .designLocPreview.selected::before{ content:''; width:100%; height:100%; position:absolute; box-shadow:inset 0 0 6px 0 #999; border-radius: 4px; } .designPreview.selected .designLocPreview.selected::before{ box-shadow:inset 0 0 6px 0 #00d6c9; } .designLocTitle{ text-align:center; font-size:11px; } .designImg, .designPreview img{ width:100%; height:auto; display:block;} #decMsgArea{ text-align:center; margin: 8px 0.5%; } #decMsgArea .decMsgSuccess, #decMsgArea .decMsgError { border-radius:6px; padding:6px; } #decMsgArea .decMsgSuccess{ color: #3c763d; background-color: #dff0d8; background-image: -webkit-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%); background-image: -o-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%); background-image: -webkit-gradient(linear, left top, left bottom, from(#dff0d8), to(#c8e5bc)); background-image: linear-gradient(to bottom, #dff0d8 0%, #c8e5bc 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffc8e5bc', GradientType=0); background-repeat: repeat-x; border:1px solid #b2dba1; } #decMsgArea .decMsgError{ color: #a94442; background-color: #f2dede; background-image: -webkit-linear-gradient(top, #f2dede 0%, #e7c3c3 100%); background-image: -o-linear-gradient(top, #f2dede 0%, #e7c3c3 100%); background-image: -webkit-gradient(linear, left top, left bottom, from(#f2dede), to(#e7c3c3)); background-image: linear-gradient(to bottom, #f2dede 0%, #e7c3c3 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffe7c3c3', GradientType=0); background-repeat: repeat-x; border:1px solid #dca7a7; } .designOverlay{ background: #000; opacity: 0; position: absolute; z-index: 99; border-radius:6px; } #applyDesignGrid{ width:99%; margin:5px 0.5%; background-color:#999; border-spacing:1px; border-collapse:separate; border-radius:6px; text-align:center; border:1px solid #999; font-size:14px; } table#applyDesignGrid tbody tr:last-child td:first-child { border-radius: 0 0 0 5px; } table#applyDesignGrid tbody tr:last-child td:last-child { border-radius: 0 0 5px 0; } #applyDesignGrid .laGridRow_even{ background: #EEE; /* background: -moz-linear-gradient(top, #dddddd 0%, #cccccc 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#dddddd), color-stop(100%,#cccccc)); background: -webkit-linear-gradient(top, #dddddd 0%,#cccccc 100%); background: -o-linear-gradient(top, #dddddd 0%,#cccccc 100%); background: linear-gradient(to bottom, #dddddd 0%,#cccccc 100%); */ } #applyDesignGrid .laGridRow_odd{ background: #F9F9F9; /* background: -moz-linear-gradient(top, #ffffff 0%, #fafafa 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#fafafa)); background: -webkit-linear-gradient(top, #ffffff 0%,#fafafa 100%); background: -o-linear-gradient(top, #ffffff 0%,#fafafa 100%); background: linear-gradient(to bottom, #ffffff 0%,#fafafa 100%); */ } #applyDesignGrid .swatchborder{ margin: 0 auto 4px auto; border-radius:5px !important; } #applyDesignGrid th{ font-size: 14px; text-shadow: 0 -1px 0 #000; color:#fff; min-width:60px; } .laGridWhse{ text-align:left; margin-left:10px; } .laGridLabel{ text-align:right; font-size: 11px; line-height:18px; font-weight: normal; text-decoration: none; font-style: italic; opacity:0.6; margin-right:10px; } .la_avail, .la_ordered{ font-size:12px; line-height:18px;} .la_design_input{ width:50px; text-align:center; } .laGridColor{ text-align:center; font-weight:bold; } .laGridCell{ text-align:center; } .laGridButtonRow{ width:99%; margin: 8px 0.5%; border:1px solid #AAA; background:#EEE; border-radius:6px; } .laGridButtonRow .fdm4Button{ float:right; } .laGridButtonRow .fdm4Button a{ margin:3px; } .laSelectedDesign{ float:left; margin-left:5px; line-height:35px} .laSelectedDesign label{ font-weight:bold; margin-right:5px; } .unapplied{ box-shadow:inset 0 0 10px -3px #00d6c9; } /***^^ 010003 ^^***/ /* For design selection slider */ .designArrow{ position:absolute; display:table-cell; vertical-align:middle; text-align:center; height:100%; width:25px; z-index:10; opacity:0.7; cursor:pointer; } .designArrow img{ margin-top:130px; padding:2px; border:2px solid #333; border-radius:20px; background:#fff; } #applyDesignDialog .arrowOn{ opacity:1; } #applyDesignDialog .arrowOn img{ box-shadow:0 0 15px #EEE; } #selDesignLeft { left:5px; display:none; } #selDesignRight{ right:5px; display:none; } #selectDesign{ overflow:hidden; position:relative } #selectDesignInner{ position:absolute; left:0;} .designLocTitle{ width: 100%; text-align:center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .designInstruct{ margin-left: 10px; } .designInstruct span{ border-bottom:1px solid #ccc; padding-bottom:3px; } #applyDesignTitle .decoratorClose{ font-weight:normal; width:24px; height:24px; top:-13px; right:-13px; } /* loading msg on top of overlay */ #loadingDesign{ position:absolute; border:1px solid #000; border-radius:25px; background:rgba(0,0,0,0.5); width:325px; z-index:9801; text-align:center; box-shadow: inset 0 0 100px -25px #000; padding:25px; } #loadingDesignMsg{ color:#F6F6F6; text-shadow:0 0 15px #000; } .submitDecoRemoved{ color:#900; display:block; text-align:center; } .swatchborder{ border: 1px solid #000; width:45px; height:45px; border-radius:5px; } div.swatchborder img{ border:1px solid #fff; width:43px; height:43px; border-radius:5px; } table.swatchborder{ width:45px; height:45px; border-collapse: separate; } table.swatchborder td.swatchborder { border-color: #FFF; border-radius:5px; } .qoDecImage{ cursor: pointer; margin-right:2px; } .laGridBtns{ float:right; margin:3px 5px 0 0; } .laGridBtns .btn{ margin: 0 3px; } .applySizeCol{ text-align:center; } .gridLegend{ margin:0; padding:0; } .gridLegend li{ float:left; list-style:none; margin:0; padding: 0 15px 0 0; } #orderGridLoading img { width:80px; } .gridInput { padding: 0px 3px; } .gridOOS .qoGridItem { vertical-align: text-top; } /* Responsive Redesign Styling */ /* limited Flex classes from bootstrap 4 .... use with caution if at all ... */ .d-flex { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; } .d-inline-flex { display: -webkit-inline-box !important; display: -ms-inline-flexbox !important; display: inline-flex !important; } .flex-first { -webkit-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; } .flex-last { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } .flex-unordered { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; } .flex-row { -webkit-box-orient: horizontal !important; -webkit-box-direction: normal !important; -ms-flex-direction: row !important; flex-direction: row !important; } .flex-column { -webkit-box-orient: vertical !important; -webkit-box-direction: normal !important; -ms-flex-direction: column !important; flex-direction: column !important; } .flex-row-reverse { -webkit-box-orient: horizontal !important; -webkit-box-direction: reverse !important; -ms-flex-direction: row-reverse !important; flex-direction: row-reverse !important; } .flex-column-reverse { -webkit-box-orient: vertical !important; -webkit-box-direction: reverse !important; -ms-flex-direction: column-reverse !important; flex-direction: column-reverse !important; } .flex-wrap { -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; } .flex-nowrap { -ms-flex-wrap: nowrap !important; flex-wrap: nowrap !important; } .flex-wrap-reverse { -ms-flex-wrap: wrap-reverse !important; flex-wrap: wrap-reverse !important; } .justify-content-start { -webkit-box-pack: start !important; -ms-flex-pack: start !important; justify-content: flex-start !important; } .justify-content-end { -webkit-box-pack: end !important; -ms-flex-pack: end !important; justify-content: flex-end !important; } .justify-content-center { -webkit-box-pack: center !important; -ms-flex-pack: center !important; justify-content: center !important; } .justify-content-between, .login-page-checkout .nav-tabs { -webkit-box-pack: justify !important; -ms-flex-pack: justify !important; justify-content: space-between !important; } .justify-content-around { -ms-flex-pack: distribute !important; justify-content: space-around !important; } .align-items-start { -webkit-box-align: start !important; -ms-flex-align: start !important; align-items: flex-start !important; } .align-items-end { -webkit-box-align: end !important; -ms-flex-align: end !important; align-items: flex-end !important; } .align-items-center { -webkit-box-align: center !important; -ms-flex-align: center !important; align-items: center !important; } .align-items-baseline { -webkit-box-align: baseline !important; -ms-flex-align: baseline !important; align-items: baseline !important; } .align-items-stretch { -webkit-box-align: stretch !important; -ms-flex-align: stretch !important; align-items: stretch !important; } .align-content-start { -ms-flex-line-pack: start !important; align-content: flex-start !important; } .align-content-end { -ms-flex-line-pack: end !important; align-content: flex-end !important; } .align-content-center { -ms-flex-line-pack: center !important; align-content: center !important; } .align-content-between { -ms-flex-line-pack: justify !important; align-content: space-between !important; } .align-content-around { -ms-flex-line-pack: distribute !important; align-content: space-around !important; } .align-content-stretch { -ms-flex-line-pack: stretch !important; align-content: stretch !important; } .align-self-auto { -ms-flex-item-align: auto !important; -ms-grid-row-align: auto !important; align-self: auto !important; } .align-self-start { -ms-flex-item-align: start !important; align-self: flex-start !important; } .align-self-end { -ms-flex-item-align: end !important; align-self: flex-end !important; } .align-self-center { -ms-flex-item-align: center !important; -ms-grid-row-align: center !important; align-self: center !important; } .align-self-baseline { -ms-flex-item-align: baseline !important; align-self: baseline !important; } .align-self-stretch { -ms-flex-item-align: stretch !important; -ms-grid-row-align: stretch !important; align-self: stretch !important; } @media (min-width: 375px) { .flex-sm-first { -webkit-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; } .flex-sm-last { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } .flex-sm-unordered { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; } .flex-sm-row { -webkit-box-orient: horizontal !important; -webkit-box-direction: normal !important; -ms-flex-direction: row !important; flex-direction: row !important; } .flex-sm-column { -webkit-box-orient: vertical !important; -webkit-box-direction: normal !important; -ms-flex-direction: column !important; flex-direction: column !important; } .flex-sm-row-reverse { -webkit-box-orient: horizontal !important; -webkit-box-direction: reverse !important; -ms-flex-direction: row-reverse !important; flex-direction: row-reverse !important; } .flex-sm-column-reverse { -webkit-box-orient: vertical !important; -webkit-box-direction: reverse !important; -ms-flex-direction: column-reverse !important; flex-direction: column-reverse !important; } .flex-sm-wrap { -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; } .flex-sm-nowrap { -ms-flex-wrap: nowrap !important; flex-wrap: nowrap !important; } .flex-sm-wrap-reverse { -ms-flex-wrap: wrap-reverse !important; flex-wrap: wrap-reverse !important; } .justify-content-sm-start { -webkit-box-pack: start !important; -ms-flex-pack: start !important; justify-content: flex-start !important; } .justify-content-sm-end { -webkit-box-pack: end !important; -ms-flex-pack: end !important; justify-content: flex-end !important; } .justify-content-sm-center { -webkit-box-pack: center !important; -ms-flex-pack: center !important; justify-content: center !important; } .justify-content-sm-between { -webkit-box-pack: justify !important; -ms-flex-pack: justify !important; justify-content: space-between !important; } .justify-content-sm-around { -ms-flex-pack: distribute !important; justify-content: space-around !important; } .align-items-sm-start { -webkit-box-align: start !important; -ms-flex-align: start !important; align-items: flex-start !important; } .align-items-sm-end { -webkit-box-align: end !important; -ms-flex-align: end !important; align-items: flex-end !important; } .align-items-sm-center { -webkit-box-align: center !important; -ms-flex-align: center !important; align-items: center !important; } .align-items-sm-baseline { -webkit-box-align: baseline !important; -ms-flex-align: baseline !important; align-items: baseline !important; } .align-items-sm-stretch { -webkit-box-align: stretch !important; -ms-flex-align: stretch !important; align-items: stretch !important; } .align-content-sm-start { -ms-flex-line-pack: start !important; align-content: flex-start !important; } .align-content-sm-end { -ms-flex-line-pack: end !important; align-content: flex-end !important; } .align-content-sm-center { -ms-flex-line-pack: center !important; align-content: center !important; } .align-content-sm-between { -ms-flex-line-pack: justify !important; align-content: space-between !important; } .align-content-sm-around { -ms-flex-line-pack: distribute !important; align-content: space-around !important; } .align-content-sm-stretch { -ms-flex-line-pack: stretch !important; align-content: stretch !important; } .align-self-sm-auto { -ms-flex-item-align: auto !important; -ms-grid-row-align: auto !important; align-self: auto !important; } .align-self-sm-start { -ms-flex-item-align: start !important; align-self: flex-start !important; } .align-self-sm-end { -ms-flex-item-align: end !important; align-self: flex-end !important; } .align-self-sm-center { -ms-flex-item-align: center !important; -ms-grid-row-align: center !important; align-self: center !important; } .align-self-sm-baseline { -ms-flex-item-align: baseline !important; align-self: baseline !important; } .align-self-sm-stretch { -ms-flex-item-align: stretch !important; -ms-grid-row-align: stretch !important; align-self: stretch !important; } } @media (min-width: 768px) { .flex-md-first { -webkit-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; } .flex-md-last { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } .flex-md-unordered { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; } .flex-md-row { -webkit-box-orient: horizontal !important; -webkit-box-direction: normal !important; -ms-flex-direction: row !important; flex-direction: row !important; } .flex-md-column { -webkit-box-orient: vertical !important; -webkit-box-direction: normal !important; -ms-flex-direction: column !important; flex-direction: column !important; } .flex-md-row-reverse { -webkit-box-orient: horizontal !important; -webkit-box-direction: reverse !important; -ms-flex-direction: row-reverse !important; flex-direction: row-reverse !important; } .flex-md-column-reverse { -webkit-box-orient: vertical !important; -webkit-box-direction: reverse !important; -ms-flex-direction: column-reverse !important; flex-direction: column-reverse !important; } .flex-md-wrap { -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; } .flex-md-nowrap { -ms-flex-wrap: nowrap !important; flex-wrap: nowrap !important; } .flex-md-wrap-reverse { -ms-flex-wrap: wrap-reverse !important; flex-wrap: wrap-reverse !important; } .justify-content-md-start { -webkit-box-pack: start !important; -ms-flex-pack: start !important; justify-content: flex-start !important; } .justify-content-md-end { -webkit-box-pack: end !important; -ms-flex-pack: end !important; justify-content: flex-end !important; } .justify-content-md-center { -webkit-box-pack: center !important; -ms-flex-pack: center !important; justify-content: center !important; } .justify-content-md-between { -webkit-box-pack: justify !important; -ms-flex-pack: justify !important; justify-content: space-between !important; } .justify-content-md-around { -ms-flex-pack: distribute !important; justify-content: space-around !important; } .align-items-md-start { -webkit-box-align: start !important; -ms-flex-align: start !important; align-items: flex-start !important; } .align-items-md-end { -webkit-box-align: end !important; -ms-flex-align: end !important; align-items: flex-end !important; } .align-items-md-center { -webkit-box-align: center !important; -ms-flex-align: center !important; align-items: center !important; } .align-items-md-baseline { -webkit-box-align: baseline !important; -ms-flex-align: baseline !important; align-items: baseline !important; } .align-items-md-stretch { -webkit-box-align: stretch !important; -ms-flex-align: stretch !important; align-items: stretch !important; } .align-content-md-start { -ms-flex-line-pack: start !important; align-content: flex-start !important; } .align-content-md-end { -ms-flex-line-pack: end !important; align-content: flex-end !important; } .align-content-md-center { -ms-flex-line-pack: center !important; align-content: center !important; } .align-content-md-between { -ms-flex-line-pack: justify !important; align-content: space-between !important; } .align-content-md-around { -ms-flex-line-pack: distribute !important; align-content: space-around !important; } .align-content-md-stretch { -ms-flex-line-pack: stretch !important; align-content: stretch !important; } .align-self-md-auto { -ms-flex-item-align: auto !important; -ms-grid-row-align: auto !important; align-self: auto !important; } .align-self-md-start { -ms-flex-item-align: start !important; align-self: flex-start !important; } .align-self-md-end { -ms-flex-item-align: end !important; align-self: flex-end !important; } .align-self-md-center { -ms-flex-item-align: center !important; -ms-grid-row-align: center !important; align-self: center !important; } .align-self-md-baseline { -ms-flex-item-align: baseline !important; align-self: baseline !important; } .align-self-md-stretch { -ms-flex-item-align: stretch !important; -ms-grid-row-align: stretch !important; align-self: stretch !important; } } @media (min-width: 1024px) { .flex-lg-first { -webkit-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; } .flex-lg-last { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } .flex-lg-unordered { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; } .flex-lg-row { -webkit-box-orient: horizontal !important; -webkit-box-direction: normal !important; -ms-flex-direction: row !important; flex-direction: row !important; } .flex-lg-column, .tab-collapse-inner .nav-pills { -webkit-box-orient: vertical !important; -webkit-box-direction: normal !important; -ms-flex-direction: column !important; flex-direction: column !important; } .flex-lg-row-reverse { -webkit-box-orient: horizontal !important; -webkit-box-direction: reverse !important; -ms-flex-direction: row-reverse !important; flex-direction: row-reverse !important; } .flex-lg-column-reverse { -webkit-box-orient: vertical !important; -webkit-box-direction: reverse !important; -ms-flex-direction: column-reverse !important; flex-direction: column-reverse !important; } .flex-lg-wrap { -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; } .flex-lg-nowrap { -ms-flex-wrap: nowrap !important; flex-wrap: nowrap !important; } .flex-lg-wrap-reverse { -ms-flex-wrap: wrap-reverse !important; flex-wrap: wrap-reverse !important; } .justify-content-lg-start { -webkit-box-pack: start !important; -ms-flex-pack: start !important; justify-content: flex-start !important; } .justify-content-lg-end { -webkit-box-pack: end !important; -ms-flex-pack: end !important; justify-content: flex-end !important; } .justify-content-lg-center { -webkit-box-pack: center !important; -ms-flex-pack: center !important; justify-content: center !important; } .justify-content-lg-between { -webkit-box-pack: justify !important; -ms-flex-pack: justify !important; justify-content: space-between !important; } .justify-content-lg-around { -ms-flex-pack: distribute !important; justify-content: space-around !important; } .align-items-lg-start { -webkit-box-align: start !important; -ms-flex-align: start !important; align-items: flex-start !important; } .align-items-lg-end { -webkit-box-align: end !important; -ms-flex-align: end !important; align-items: flex-end !important; } .align-items-lg-center { -webkit-box-align: center !important; -ms-flex-align: center !important; align-items: center !important; } .align-items-lg-baseline { -webkit-box-align: baseline !important; -ms-flex-align: baseline !important; align-items: baseline !important; } .align-items-lg-stretch { -webkit-box-align: stretch !important; -ms-flex-align: stretch !important; align-items: stretch !important; } .align-content-lg-start { -ms-flex-line-pack: start !important; align-content: flex-start !important; } .align-content-lg-end { -ms-flex-line-pack: end !important; align-content: flex-end !important; } .align-content-lg-center { -ms-flex-line-pack: center !important; align-content: center !important; } .align-content-lg-between { -ms-flex-line-pack: justify !important; align-content: space-between !important; } .align-content-lg-around { -ms-flex-line-pack: distribute !important; align-content: space-around !important; } .align-content-lg-stretch { -ms-flex-line-pack: stretch !important; align-content: stretch !important; } .align-self-lg-auto { -ms-flex-item-align: auto !important; -ms-grid-row-align: auto !important; align-self: auto !important; } .align-self-lg-start { -ms-flex-item-align: start !important; align-self: flex-start !important; } .align-self-lg-end { -ms-flex-item-align: end !important; align-self: flex-end !important; } .align-self-lg-center { -ms-flex-item-align: center !important; -ms-grid-row-align: center !important; align-self: center !important; } .align-self-lg-baseline { -ms-flex-item-align: baseline !important; align-self: baseline !important; } .align-self-lg-stretch { -ms-flex-item-align: stretch !important; -ms-grid-row-align: stretch !important; align-self: stretch !important; } } @media (min-width: 1440px) { .flex-xl-first { -webkit-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; } .flex-xl-last { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } .flex-xl-unordered { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; } .flex-xl-row { -webkit-box-orient: horizontal !important; -webkit-box-direction: normal !important; -ms-flex-direction: row !important; flex-direction: row !important; } .flex-xl-column { -webkit-box-orient: vertical !important; -webkit-box-direction: normal !important; -ms-flex-direction: column !important; flex-direction: column !important; } .flex-xl-row-reverse { -webkit-box-orient: horizontal !important; -webkit-box-direction: reverse !important; -ms-flex-direction: row-reverse !important; flex-direction: row-reverse !important; } .flex-xl-column-reverse { -webkit-box-orient: vertical !important; -webkit-box-direction: reverse !important; -ms-flex-direction: column-reverse !important; flex-direction: column-reverse !important; } .flex-xl-wrap { -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; } .flex-xl-nowrap { -ms-flex-wrap: nowrap !important; flex-wrap: nowrap !important; } .flex-xl-wrap-reverse { -ms-flex-wrap: wrap-reverse !important; flex-wrap: wrap-reverse !important; } .justify-content-xl-start { -webkit-box-pack: start !important; -ms-flex-pack: start !important; justify-content: flex-start !important; } .justify-content-xl-end { -webkit-box-pack: end !important; -ms-flex-pack: end !important; justify-content: flex-end !important; } .justify-content-xl-center { -webkit-box-pack: center !important; -ms-flex-pack: center !important; justify-content: center !important; } .justify-content-xl-between { -webkit-box-pack: justify !important; -ms-flex-pack: justify !important; justify-content: space-between !important; } .justify-content-xl-around { -ms-flex-pack: distribute !important; justify-content: space-around !important; } .align-items-xl-start { -webkit-box-align: start !important; -ms-flex-align: start !important; align-items: flex-start !important; } .align-items-xl-end { -webkit-box-align: end !important; -ms-flex-align: end !important; align-items: flex-end !important; } .align-items-xl-center { -webkit-box-align: center !important; -ms-flex-align: center !important; align-items: center !important; } .align-items-xl-baseline { -webkit-box-align: baseline !important; -ms-flex-align: baseline !important; align-items: baseline !important; } .align-items-xl-stretch { -webkit-box-align: stretch !important; -ms-flex-align: stretch !important; align-items: stretch !important; } .align-content-xl-start { -ms-flex-line-pack: start !important; align-content: flex-start !important; } .align-content-xl-end { -ms-flex-line-pack: end !important; align-content: flex-end !important; } .align-content-xl-center { -ms-flex-line-pack: center !important; align-content: center !important; } .align-content-xl-between { -ms-flex-line-pack: justify !important; align-content: space-between !important; } .align-content-xl-around { -ms-flex-line-pack: distribute !important; align-content: space-around !important; } .align-content-xl-stretch { -ms-flex-line-pack: stretch !important; align-content: stretch !important; } .align-self-xl-auto { -ms-flex-item-align: auto !important; -ms-grid-row-align: auto !important; align-self: auto !important; } .align-self-xl-start { -ms-flex-item-align: start !important; align-self: flex-start !important; } .align-self-xl-end { -ms-flex-item-align: end !important; align-self: flex-end !important; } .align-self-xl-center { -ms-flex-item-align: center !important; -ms-grid-row-align: center !important; align-self: center !important; } .align-self-xl-baseline { -ms-flex-item-align: baseline !important; align-self: baseline !important; } .align-self-xl-stretch { -ms-flex-item-align: stretch !important; -ms-grid-row-align: stretch !important; align-self: stretch !important; } } /* END Flex columns */ .product-content .product-input { margin-bottom: 5px; } .product-content .product-input .form-control { text-align: center; color: #000; font-size: 16px; padding: 0.6875rem 0.25rem; } .product-content .product-input .form-control::-webkit-input-placeholder { color: #9b9b9b; } .product-content .product-input .form-control:-ms-input-placeholder { color: #9b9b9b; } .product-content .product-input .form-control::placeholder { color: #9b9b9b; } .product-content .product-size { /* LAT010006 */ letter-spacing: 0.5px; text-transform: uppercase; } /*v LAT010006 v*/ .product-content .product-price { letter-spacing: 0.5px; text-transform: none; } /*^ LAT010006 ^*/ .product-content .product-count { font-size: 0.8125rem; letter-spacing: 0.5px; color: #4a4a4a; } .product-content .product-stock { font-size: 0.875rem; color: #d0011b; } .product-content .product-elem { text-align: center; } .product-content .product-elem .form-control { display: inline-block; width: 70px; height: 25px; border-color: rgba(0, 0, 0, 0.5); } .product-content .product-elem .form-control:focus { border-color: rgba(0, 0, 0, 0.5); } @media (max-width: 1023px) { .product-content .product-elem .form-control { width: 55px; height: 45px; } } @media (max-width: 767px) { .product-content .product-elem .form-control { width: 64px; height: 54px; } } @media (max-width: 374px) { .product-content .product-elem .form-control { width: 50px; width: 3.125rem; height: 45px; height: 2.8125rem; } } @media (max-width: 767px) { .product-content .product-elem { width: 25%; margin-bottom: 10px; margin-bottom: 0.625rem; } } .product-content .product-elem-stock .product-price { color: #9b9b9b; text-decoration: line-through; } .product-content .product-elem-disabled { pointer-events: none; } .product-content .product-elem-disabled .product-size, .product-content .product-elem-disabled .form-control, .product-content .product-elem-disabled .product-count, .product-content .product-elem-disabled .product-price { color: #cecece; } .product-content .product-elem-disabled .form-control { color: #cecece; border-color: #cecece; } .product-content .product-elem-disabled .form-control::-webkit-input-placeholder { color: #cecece; } .product-content .product-elem-disabled .form-control:-ms-input-placeholder { color: #cecece; } .product-content .product-elem-disabled .form-control::placeholder { color: #cecece; } .product-content .product-elem-active .product-count { color: #f6a623; } /* .product-item:nth-child(even){ background: #FAFFFF; } .product-item:nth-child(odd){ background: #FFFFFA; } */ .product-item .product-qty, .product-item .prod-whse-cutoff{ font-size: 15px letter-spacing: 1px; } @media (max-width: 767px) { .product-item .product-qty, .product-item .prod-whse-cutoff { margin-bottom: 10px; margin-bottom: 0.625rem; } } /* this uses rem that is calculated based on the html font-size - set appropriatly here ... */ html{ font-size:16px; } .swatch-name{ font-weight:bold;} /* More missing css from bella mockups ... not begining with .product-content ... */ .product-full { margin-bottom: 5px; } .product-full .product-grid-heading .product-grid-action { padding-top: 0; padding-bottom: 0; } @media (min-width: 768px) { .product-full .product-grid-heading { border-bottom: 1px solid rgba(0, 0, 0, 0.2); margin-bottom: 0; } } .product-full .product-head { margin-bottom:10px; } @media (max-width: 767px) { .product-full .product-head { margin-bottom: 0.875rem; -ms-flex-wrap: wrap; flex-wrap: wrap; } .qoGridWhse .product-head{ margin-bottom:0; } .qoGridWhse .product-grid-heading{ padding-bottom:0!important; } } .product-full .product-grid-action { padding: 1rem 0; } @media (max-width: 1023px) { .product-full .product-grid-action { -ms-flex-wrap: wrap; flex-wrap: wrap; text-align: right; } .product-full .product-grid-action > *:not(.btn):not(.banner-about-us-video .link-main):not(.banner-about-us-video .card-hover .card-link):not(.card-hover .banner-about-us-video .card-link):not(.banner-about-us-video .card-cover .card-link):not(.card-cover .banner-about-us-video .card-link):not(.banner-about-us-video .slider-home-inner .slider-link):not(.slider-home-inner .banner-about-us-video .slider-link) { -ms-flex-preferred-size: 100%; flex-basis: 100%; } .product-full .product-grid-action .btn, .product-full .product-grid-action .banner-about-us-video .link-main, .banner-about-us-video .product-full .product-grid-action .link-main, .product-full .product-grid-action .banner-about-us-video .card-hover .card-link, .banner-about-us-video .card-hover .product-full .product-grid-action .card-link, .product-full .product-grid-action .card-hover .banner-about-us-video .card-link, .card-hover .banner-about-us-video .product-full .product-grid-action .card-link, .product-full .product-grid-action .banner-about-us-video .card-cover .card-link, .banner-about-us-video .card-cover .product-full .product-grid-action .card-link, .product-full .product-grid-action .card-cover .banner-about-us-video .card-link, .card-cover .banner-about-us-video .product-full .product-grid-action .card-link, .product-full .product-grid-action .banner-about-us-video .slider-home-inner .slider-link, .banner-about-us-video .slider-home-inner .product-full .product-grid-action .slider-link, .product-full .product-grid-action .slider-home-inner .banner-about-us-video .slider-link, .slider-home-inner .banner-about-us-video .product-full .product-grid-action .slider-link { margin: 0.75rem 0; } } .product-full .product-content { flex: 1 0 auto; -webkit-box-flex: 1; -ms-flex: 1 0 auto; } .product-full .product-item { padding: 5px 15px; border-bottom: 1px solid rgba(0, 0, 0, 0.2); margin:0 -15px; } .product-full .product-links { padding-left: 2rem; padding-top: 25px; } @media (min-width: 1440px) { .product-full .product-links .btn, .product-full .product-links .banner-about-us-video .link-main, .banner-about-us-video .product-full .product-links .link-main, .product-full .product-links .banner-about-us-video .card-hover .card-link, .banner-about-us-video .card-hover .product-full .product-links .card-link, .product-full .product-links .card-hover .banner-about-us-video .card-link, .card-hover .banner-about-us-video .product-full .product-links .card-link, .product-full .product-links .banner-about-us-video .card-cover .card-link, .banner-about-us-video .card-cover .product-full .product-links .card-link, .product-full .product-links .card-cover .banner-about-us-video .card-link, .card-cover .banner-about-us-video .product-full .product-links .card-link, .product-full .product-links .banner-about-us-video .slider-home-inner .slider-link, .banner-about-us-video .slider-home-inner .product-full .product-links .slider-link, .product-full .product-links .slider-home-inner .banner-about-us-video .slider-link, .slider-home-inner .banner-about-us-video .product-full .product-links .slider-link { min-width: 10.5rem; } } .product-full .swatch-wrapper { font-size: 15px } .product-full .swatch-wrapper .swatch-select { float: left; width: 28px; height: 28px; margin-right: 15px; } .img-select{ width: 28px; height: 28px; } .product-full .swatch-wrapper .swatch-name { display: block; padding-left: 43px; margin-top:4px; } @media (max-width: 1023px) { .product-full .product-links { padding-left: 1rem; } .product-full .product-links .btn, .product-full .product-links .banner-about-us-video .link-main, .banner-about-us-video .product-full .product-links .link-main, .product-full .product-links .banner-about-us-video .card-hover .card-link, .banner-about-us-video .card-hover .product-full .product-links .card-link, .product-full .product-links .card-hover .banner-about-us-video .card-link, .card-hover .banner-about-us-video .product-full .product-links .card-link, .product-full .product-links .banner-about-us-video .card-cover .card-link, .banner-about-us-video .card-cover .product-full .product-links .card-link, .product-full .product-links .card-cover .banner-about-us-video .card-link, .card-cover .banner-about-us-video .product-full .product-links .card-link, .product-full .product-links .banner-about-us-video .slider-home-inner .slider-link, .banner-about-us-video .slider-home-inner .product-full .product-links .slider-link, .product-full .product-links .slider-home-inner .banner-about-us-video .slider-link, .slider-home-inner .banner-about-us-video .product-full .product-links .slider-link { padding-left: 0.5rem; padding-right: 0.5rem; } } @media (max-width: 767px) { .product-full { margin-bottom: 0; } .product-full .product-item { padding: 20px 15px; } .product-full .product-links { padding: 0.75rem 0 0; } .product-full .product-links .btn, .product-full .product-links .banner-about-us-video .link-main, .banner-about-us-video .product-full .product-links .link-main, .product-full .product-links .banner-about-us-video .card-hover .card-link, .banner-about-us-video .card-hover .product-full .product-links .card-link, .product-full .product-links .card-hover .banner-about-us-video .card-link, .card-hover .banner-about-us-video .product-full .product-links .card-link, .product-full .product-links .banner-about-us-video .card-cover .card-link, .banner-about-us-video .card-cover .product-full .product-links .card-link, .product-full .product-links .card-cover .banner-about-us-video .card-link, .card-cover .banner-about-us-video .product-full .product-links .card-link, .product-full .product-links .banner-about-us-video .slider-home-inner .slider-link, .banner-about-us-video .slider-home-inner .product-full .product-links .slider-link, .product-full .product-links .slider-home-inner .banner-about-us-video .slider-link, .slider-home-inner .banner-about-us-video .product-full .product-links .slider-link { max-width: 10rem; margin-left: auto; margin-right: auto; } .product-full .product-grid-action { font-size: 1.125rem; text-align: center; margin-top: 6rem; } .product-full .product-grid-action .btn, .product-full .product-grid-action .banner-about-us-video .link-main, .banner-about-us-video .product-full .product-grid-action .link-main, .product-full .product-grid-action .banner-about-us-video .card-hover .card-link, .banner-about-us-video .card-hover .product-full .product-grid-action .card-link, .product-full .product-grid-action .card-hover .banner-about-us-video .card-link, .card-hover .banner-about-us-video .product-full .product-grid-action .card-link, .product-full .product-grid-action .banner-about-us-video .card-cover .card-link, .banner-about-us-video .card-cover .product-full .product-grid-action .card-link, .product-full .product-grid-action .card-cover .banner-about-us-video .card-link, .card-cover .banner-about-us-video .product-full .product-grid-action .card-link, .product-full .product-grid-action .banner-about-us-video .slider-home-inner .slider-link, .banner-about-us-video .slider-home-inner .product-full .product-grid-action .slider-link, .product-full .product-grid-action .slider-home-inner .banner-about-us-video .slider-link, .slider-home-inner .banner-about-us-video .product-full .product-grid-action .slider-link { margin-top: 1.5rem; padding: 1rem; } .product-full .swatch-wrapper .swatch-select { margin-right: 0.625rem; } .product-full .swatch-wrapper .swatch-name { display: block; padding-left: 2.375rem; } } .program-item .product-links, .program-color-select .product-links, .program-fabric-select .product-links { text-align: right; white-space: nowrap; } .program-item .product-links .link-simple + .link-simple, .program-color-select .product-links .link-simple + .link-simple, .program-fabric-select .product-links .link-simple + .link-simple { margin-left: 1rem; } .qoCell{ text-align:center; } .qoCell::-webkit-inner-spin-button, .qoCell::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } .product-sublinks .btn-default{ margin-top:5px; } .product-elem-disabled .qoCell{ background:#FEFEFE; } .image-select{ display:inline-block; vertical-align:middle; height: 28px; width: 28px; } .image-select,.img-select{ border-radius:3px; border:1px solid #ddd; } /* END Responsive Redesign Styling */ .select2-container { box-sizing: border-box; display: inline-block; margin: 0; position: relative; vertical-align: middle; } .select2-container .select2-selection--single { box-sizing: border-box; cursor: pointer; display: block; height: 28px; user-select: none; -webkit-user-select: none; } .select2-container .select2-selection--single .select2-selection__rendered { display: block; padding-left: 8px; padding-right: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .select2-container .select2-selection--single .select2-selection__clear { position: relative; } .select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered { padding-right: 8px; padding-left: 20px; } .select2-container .select2-selection--multiple { box-sizing: border-box; cursor: pointer; display: block; min-height: 32px; user-select: none; -webkit-user-select: none; } .select2-container .select2-selection--multiple .select2-selection__rendered { display: inline-block; overflow: hidden; padding-left: 8px; text-overflow: ellipsis; white-space: nowrap; } .select2-container .select2-search--inline { float: left; } .select2-container .select2-search--inline .select2-search__field { box-sizing: border-box; border: none; font-size: 100%; margin-top: 5px; padding: 0; } .select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; } .select2-dropdown { background-color: white; border: 1px solid #aaa; border-radius: 4px; box-sizing: border-box; display: block; position: absolute; left: -100000px; width: 100%; z-index: 1051; } .select2-results { display: block; } .select2-results__options { list-style: none; margin: 0; padding: 0; } .select2-results__option { padding: 6px; user-select: none; -webkit-user-select: none; } .select2-results__option[aria-selected] { cursor: pointer; } .select2-container--open .select2-dropdown { left: 0; } .select2-container--open .select2-dropdown--above { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--open .select2-dropdown--below { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; } .select2-search--dropdown { display: block; padding: 4px; } .select2-search--dropdown .select2-search__field { padding: 4px; width: 100%; box-sizing: border-box; } .select2-search--dropdown .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; } .select2-search--dropdown.select2-search--hide { display: none; } .select2-close-mask { border: 0; margin: 0; padding: 0; display: block; position: fixed; left: 0; top: 0; min-height: 100%; min-width: 100%; height: auto; width: auto; opacity: 0; z-index: 99; background-color: #fff; filter: alpha(opacity=0); } .select2-hidden-accessible { border: 0 !important; clip: rect(0 0 0 0) !important; -webkit-clip-path: inset(50%) !important; clip-path: inset(50%) !important; height: 1px !important; overflow: hidden !important; padding: 0 !important; position: absolute !important; width: 1px !important; white-space: nowrap !important; } .select2-container--default .select2-selection--single { background-color: #fff; border: 1px solid #aaa; border-radius: 4px; } .select2-container--default .select2-selection--single .select2-selection__rendered { color: #444; line-height: 28px; } .select2-container--default .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; } .select2-container--default .select2-selection--single .select2-selection__placeholder { color: #999; } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 26px; position: absolute; top: 1px; right: 1px; width: 20px; } .select2-container--default .select2-selection--single .select2-selection__arrow b { border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; height: 0; left: 50%; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; } .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; } .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow { left: 1px; right: auto; } .select2-container--default.select2-container--disabled .select2-selection--single { background-color: #eee; cursor: default; } .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear { display: none; } .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px; } .select2-container--default .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; } .select2-container--default .select2-selection--multiple .select2-selection__rendered { box-sizing: border-box; list-style: none; margin: 0; padding: 0 5px; width: 100%; } .select2-container--default .select2-selection--multiple .select2-selection__rendered li { list-style: none; } .select2-container--default .select2-selection--multiple .select2-selection__placeholder { color: #999; margin-top: 5px; float: left; } .select2-container--default .select2-selection--multiple .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; margin-top: 5px; margin-right: 10px; } .select2-container--default .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove { color: #999; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 2px; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover { color: #333; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__placeholder, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-search--inline { float: right; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice { margin-left: 5px; margin-right: auto; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { margin-left: 2px; margin-right: auto; } .select2-container--default.select2-container--focus .select2-selection--multiple { border: solid black 1px; outline: 0; } .select2-container--default.select2-container--disabled .select2-selection--multiple { background-color: #eee; cursor: default; } .select2-container--default.select2-container--disabled .select2-selection__choice__remove { display: none; } .select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple { border-top-left-radius: 0; border-top-right-radius: 0; } .select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--default .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; } .select2-container--default .select2-search--inline .select2-search__field { background: transparent; border: none; outline: 0; box-shadow: none; -webkit-appearance: textfield; } .select2-container--default .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; } .select2-container--default .select2-results__option[role=group] { padding: 0; } .select2-container--default .select2-results__option[aria-disabled=true] { color: #999; } .select2-container--default .select2-results__option[aria-selected=true] { background-color: #ddd; } .select2-container--default .select2-results__option .select2-results__option { padding-left: 1em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__group { padding-left: 0; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option { margin-left: -1em; padding-left: 2em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -2em; padding-left: 3em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -3em; padding-left: 4em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -4em; padding-left: 5em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -5em; padding-left: 6em; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background-color: #5897fb; color: white; } .select2-container--default .select2-results__group { cursor: default; display: block; padding: 6px; } .select2-container--classic .select2-selection--single { background-color: #f7f7f7; border: 1px solid #aaa; border-radius: 4px; outline: 0; background-image: -webkit-linear-gradient(top, white 50%, #eeeeee 100%); background-image: -o-linear-gradient(top, white 50%, #eeeeee 100%); background-image: linear-gradient(to bottom, white 50%, #eeeeee 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } .select2-container--classic .select2-selection--single:focus { border: 1px solid #5897fb; } .select2-container--classic .select2-selection--single .select2-selection__rendered { color: #444; line-height: 28px; } .select2-container--classic .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; margin-right: 10px; } .select2-container--classic .select2-selection--single .select2-selection__placeholder { color: #999; } .select2-container--classic .select2-selection--single .select2-selection__arrow { background-color: #ddd; border: none; border-left: 1px solid #aaa; border-top-right-radius: 4px; border-bottom-right-radius: 4px; height: 26px; position: absolute; top: 1px; right: 1px; width: 20px; background-image: -webkit-linear-gradient(top, #eeeeee 50%, #cccccc 100%); background-image: -o-linear-gradient(top, #eeeeee 50%, #cccccc 100%); background-image: linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0); } .select2-container--classic .select2-selection--single .select2-selection__arrow b { border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; height: 0; left: 50%; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; } .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; } .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow { border: none; border-right: 1px solid #aaa; border-radius: 0; border-top-left-radius: 4px; border-bottom-left-radius: 4px; left: 1px; right: auto; } .select2-container--classic.select2-container--open .select2-selection--single { border: 1px solid #5897fb; } .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow { background: transparent; border: none; } .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px; } .select2-container--classic.select2-container--open.select2-container--above .select2-selection--single { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; background-image: -webkit-linear-gradient(top, white 0%, #eeeeee 50%); background-image: -o-linear-gradient(top, white 0%, #eeeeee 50%); background-image: linear-gradient(to bottom, white 0%, #eeeeee 50%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } .select2-container--classic.select2-container--open.select2-container--below .select2-selection--single { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; background-image: -webkit-linear-gradient(top, #eeeeee 50%, white 100%); background-image: -o-linear-gradient(top, #eeeeee 50%, white 100%); background-image: linear-gradient(to bottom, #eeeeee 50%, white 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0); } .select2-container--classic .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; outline: 0; } .select2-container--classic .select2-selection--multiple:focus { border: 1px solid #5897fb; } .select2-container--classic .select2-selection--multiple .select2-selection__rendered { list-style: none; margin: 0; padding: 0 5px; } .select2-container--classic .select2-selection--multiple .select2-selection__clear { display: none; } .select2-container--classic .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; } .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove { color: #888; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 2px; } .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover { color: #555; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice { float: right; margin-left: 5px; margin-right: auto; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { margin-left: 2px; margin-right: auto; } .select2-container--classic.select2-container--open .select2-selection--multiple { border: 1px solid #5897fb; } .select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; } .select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--classic .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; outline: 0; } .select2-container--classic .select2-search--inline .select2-search__field { outline: 0; box-shadow: none; } .select2-container--classic .select2-dropdown { background-color: white; border: 1px solid transparent; } .select2-container--classic .select2-dropdown--above { border-bottom: none; } .select2-container--classic .select2-dropdown--below { border-top: none; } .select2-container--classic .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; } .select2-container--classic .select2-results__option[role=group] { padding: 0; } .select2-container--classic .select2-results__option[aria-disabled=true] { color: grey; } .select2-container--classic .select2-results__option--highlighted[aria-selected] { background-color: #3875d7; color: white; } .select2-container--classic .select2-results__group { cursor: default; display: block; padding: 6px; } .select2-container--classic.select2-container--open .select2-dropdown { border-color: #5897fb; } /*! * Select2 Bootstrap Theme v0.1.0-beta.10 (https://select2.github.io/select2-bootstrap-theme) * Copyright 2015-2017 Florian Kissling and contributors (https://github.com/select2/select2-bootstrap-theme/graphs/contributors) * Licensed under MIT (https://github.com/select2/select2-bootstrap-theme/blob/master/LICENSE) */ .select2-container--bootstrap { display: block; /*------------------------------------* #COMMON STYLES \*------------------------------------*/ /** * Search field in the Select2 dropdown. */ /** * No outline for all search fields - in the dropdown * and inline in multi Select2s. */ /** * Adjust Select2's choices hover and selected styles to match * Bootstrap 3's default dropdown styles. * * @see http://getbootstrap.com/components/#dropdowns */ /** * Clear the selection. */ /** * Address disabled Select2 styles. * * @see https://select2.github.io/examples.html#disabled * @see http://getbootstrap.com/css/#forms-control-disabled */ /*------------------------------------* #DROPDOWN \*------------------------------------*/ /** * Dropdown border color and box-shadow. */ /** * Limit the dropdown height. */ /*------------------------------------* #SINGLE SELECT2 \*------------------------------------*/ /*------------------------------------* #MULTIPLE SELECT2 \*------------------------------------*/ /** * Address Bootstrap control sizing classes * * 1. Reset Bootstrap defaults. * 2. Adjust the dropdown arrow button icon position. * * @see http://getbootstrap.com/css/#forms-control-sizes */ /* 1 */ /*------------------------------------* #RTL SUPPORT \*------------------------------------*/ } .select2-container--bootstrap .select2-selection { -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); background-color: #fff; border: 1px solid #ccc; border-radius: 4px; color: #555555; font-size: 14px; outline: 0; } .select2-container--bootstrap .select2-selection.form-control { border-radius: 4px; } .select2-container--bootstrap .select2-search--dropdown .select2-search__field { -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); background-color: #fff; border: 1px solid #ccc; border-radius: 4px; color: #555555; font-size: 14px; } .select2-container--bootstrap .select2-search__field { outline: 0; /* Firefox 18- */ /** * Firefox 19+ * * @see http://stackoverflow.com/questions/24236240/color-for-styled-placeholder-text-is-muted-in-firefox */ } .select2-container--bootstrap .select2-search__field::-webkit-input-placeholder { color: #999; } .select2-container--bootstrap .select2-search__field:-moz-placeholder { color: #999; } .select2-container--bootstrap .select2-search__field::-moz-placeholder { color: #999; opacity: 1; } .select2-container--bootstrap .select2-search__field:-ms-input-placeholder { color: #999; } .select2-container--bootstrap .select2-results__option { padding: 6px 12px; /** * Disabled results. * * @see https://select2.github.io/examples.html#disabled-results */ /** * Hover state. */ /** * Selected state. */ } .select2-container--bootstrap .select2-results__option[role=group] { padding: 0; } .select2-container--bootstrap .select2-results__option[aria-disabled=true] { color: #777777; cursor: not-allowed; } .select2-container--bootstrap .select2-results__option[aria-selected=true] { background-color: #f5f5f5; color: #262626; } .select2-container--bootstrap .select2-results__option--highlighted[aria-selected] { background-color: #337ab7; color: #fff; } .select2-container--bootstrap .select2-results__option .select2-results__option { padding: 6px 12px; } .select2-container--bootstrap .select2-results__option .select2-results__option .select2-results__group { padding-left: 0; } .select2-container--bootstrap .select2-results__option .select2-results__option .select2-results__option { margin-left: -12px; padding-left: 24px; } .select2-container--bootstrap .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -24px; padding-left: 36px; } .select2-container--bootstrap .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -36px; padding-left: 48px; } .select2-container--bootstrap .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -48px; padding-left: 60px; } .select2-container--bootstrap .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -60px; padding-left: 72px; } .select2-container--bootstrap .select2-results__group { color: #777777; display: block; padding: 6px 12px; font-size: 12px; line-height: 1.42857143; white-space: nowrap; } .select2-container--bootstrap.select2-container--focus .select2-selection, .select2-container--bootstrap.select2-container--open .select2-selection { -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6); -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s; -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s; -webkit-transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s; transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s; transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s; transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s; border-color: #66afe9; } .select2-container--bootstrap.select2-container--open { /** * Make the dropdown arrow point up while the dropdown is visible. */ /** * Handle border radii of the container when the dropdown is showing. */ } .select2-container--bootstrap.select2-container--open .select2-selection .select2-selection__arrow b { border-color: transparent transparent #999 transparent; border-width: 0 4px 4px 4px; } .select2-container--bootstrap.select2-container--open.select2-container--below .select2-selection { border-bottom-right-radius: 0; border-bottom-left-radius: 0; border-bottom-color: transparent; } .select2-container--bootstrap.select2-container--open.select2-container--above .select2-selection { border-top-right-radius: 0; border-top-left-radius: 0; border-top-color: transparent; } .select2-container--bootstrap .select2-selection__clear { color: #999; cursor: pointer; float: right; font-weight: bold; margin-right: 10px; } .select2-container--bootstrap .select2-selection__clear:hover { color: #333; } .select2-container--bootstrap.select2-container--disabled .select2-selection { border-color: #ccc; -webkit-box-shadow: none; box-shadow: none; } .select2-container--bootstrap.select2-container--disabled .select2-selection, .select2-container--bootstrap.select2-container--disabled .select2-search__field { cursor: not-allowed; } .select2-container--bootstrap.select2-container--disabled .select2-selection, .select2-container--bootstrap.select2-container--disabled .select2-selection--multiple .select2-selection__choice { background-color: #eeeeee; } .select2-container--bootstrap.select2-container--disabled .select2-selection__clear, .select2-container--bootstrap.select2-container--disabled .select2-selection--multiple .select2-selection__choice__remove { display: none; } .select2-container--bootstrap .select2-dropdown { -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); border-color: #66afe9; overflow-x: hidden; margin-top: -1px; } .select2-container--bootstrap .select2-dropdown--above { -webkit-box-shadow: 0px -6px 12px rgba(0, 0, 0, 0.175); box-shadow: 0px -6px 12px rgba(0, 0, 0, 0.175); margin-top: 1px; } .select2-container--bootstrap .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; } .select2-container--bootstrap .select2-selection--single { height: 34px !important; line-height: 1.42857143 !important; padding: 6px 24px 6px 12px; /** * Adjust the single Select2's dropdown arrow button appearance. */ } .select2-container--bootstrap .select2-selection--single .select2-selection__arrow { position: absolute; bottom: 0; right: 12px; top: 0; width: 4px; } .select2-container--bootstrap .select2-selection--single .select2-selection__arrow b { border-color: #999 transparent transparent transparent; border-style: solid; border-width: 4px 4px 0 4px; height: 0; left: 0; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; } .select2-container--bootstrap .select2-selection--single .select2-selection__rendered { color: #555555; padding: 0; } .select2-container--bootstrap .select2-selection--single .select2-selection__placeholder { color: #999; } .select2-container--bootstrap .select2-selection--multiple { min-height: 34px; padding: 0; height: auto; /** * Make Multi Select2's choices match Bootstrap 3's default button styles. */ /** * Minus 2px borders. */ /** * Clear the selection. */ } .select2-container--bootstrap .select2-selection--multiple .select2-selection__rendered { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; display: block; line-height: 1.42857143; list-style: none; margin: 0; overflow: hidden; padding: 0; width: 100%; text-overflow: ellipsis; white-space: nowrap; } .select2-container--bootstrap .select2-selection--multiple .select2-selection__placeholder { color: #999; float: left; margin-top: 5px; } .select2-container--bootstrap .select2-selection--multiple .select2-selection__choice { color: #555555; background: #fff; border: 1px solid #ccc; border-radius: 4px; cursor: default; float: left; margin: 5px 0 0 6px; padding: 0 6px; } .select2-container--bootstrap .select2-selection--multiple .select2-search--inline .select2-search__field { background: transparent; padding: 0 12px; height: 32px; line-height: 1.42857143; margin-top: 0; min-width: 5em; } .select2-container--bootstrap .select2-selection--multiple .select2-selection__choice__remove { color: #999; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 3px; } .select2-container--bootstrap .select2-selection--multiple .select2-selection__choice__remove:hover { color: #333; } .select2-container--bootstrap .select2-selection--multiple .select2-selection__clear { margin-top: 6px; } .select2-container--bootstrap .select2-selection--single.input-sm, .input-group-sm .select2-container--bootstrap .select2-selection--single, .form-group-sm .select2-container--bootstrap .select2-selection--single { border-radius: 3px; font-size: 12px; height: 30px; line-height: 1.5; padding: 5px 22px 5px 10px; /* 2 */ } .select2-container--bootstrap .select2-selection--single.input-sm .select2-selection__arrow b, .input-group-sm .select2-container--bootstrap .select2-selection--single .select2-selection__arrow b, .form-group-sm .select2-container--bootstrap .select2-selection--single .select2-selection__arrow b { margin-left: -5px; } .select2-container--bootstrap .select2-selection--multiple.input-sm, .input-group-sm .select2-container--bootstrap .select2-selection--multiple, .form-group-sm .select2-container--bootstrap .select2-selection--multiple { min-height: 30px; border-radius: 3px; } .select2-container--bootstrap .select2-selection--multiple.input-sm .select2-selection__choice, .input-group-sm .select2-container--bootstrap .select2-selection--multiple .select2-selection__choice, .form-group-sm .select2-container--bootstrap .select2-selection--multiple .select2-selection__choice { font-size: 12px; line-height: 1.5; margin: 4px 0 0 5px; padding: 0 5px; } .select2-container--bootstrap .select2-selection--multiple.input-sm .select2-search--inline .select2-search__field, .input-group-sm .select2-container--bootstrap .select2-selection--multiple .select2-search--inline .select2-search__field, .form-group-sm .select2-container--bootstrap .select2-selection--multiple .select2-search--inline .select2-search__field { padding: 0 10px; font-size: 12px; height: 28px; line-height: 1.5; } .select2-container--bootstrap .select2-selection--multiple.input-sm .select2-selection__clear, .input-group-sm .select2-container--bootstrap .select2-selection--multiple .select2-selection__clear, .form-group-sm .select2-container--bootstrap .select2-selection--multiple .select2-selection__clear { margin-top: 5px; } .select2-container--bootstrap .select2-selection--single.input-lg, .input-group-lg .select2-container--bootstrap .select2-selection--single, .form-group-lg .select2-container--bootstrap .select2-selection--single { border-radius: 6px; font-size: 18px; height: 46px; line-height: 1.3333333; padding: 10px 31px 10px 16px; /* 1 */ } .select2-container--bootstrap .select2-selection--single.input-lg .select2-selection__arrow, .input-group-lg .select2-container--bootstrap .select2-selection--single .select2-selection__arrow, .form-group-lg .select2-container--bootstrap .select2-selection--single .select2-selection__arrow { width: 5px; } .select2-container--bootstrap .select2-selection--single.input-lg .select2-selection__arrow b, .input-group-lg .select2-container--bootstrap .select2-selection--single .select2-selection__arrow b, .form-group-lg .select2-container--bootstrap .select2-selection--single .select2-selection__arrow b { border-width: 5px 5px 0 5px; margin-left: -5px; margin-left: -10px; margin-top: -2.5px; } .select2-container--bootstrap .select2-selection--multiple.input-lg, .input-group-lg .select2-container--bootstrap .select2-selection--multiple, .form-group-lg .select2-container--bootstrap .select2-selection--multiple { min-height: 46px; border-radius: 6px; } .select2-container--bootstrap .select2-selection--multiple.input-lg .select2-selection__choice, .input-group-lg .select2-container--bootstrap .select2-selection--multiple .select2-selection__choice, .form-group-lg .select2-container--bootstrap .select2-selection--multiple .select2-selection__choice { font-size: 18px; line-height: 1.3333333; border-radius: 4px; margin: 9px 0 0 8px; padding: 0 10px; } .select2-container--bootstrap .select2-selection--multiple.input-lg .select2-search--inline .select2-search__field, .input-group-lg .select2-container--bootstrap .select2-selection--multiple .select2-search--inline .select2-search__field, .form-group-lg .select2-container--bootstrap .select2-selection--multiple .select2-search--inline .select2-search__field { padding: 0 16px; font-size: 18px; height: 44px; line-height: 1.3333333; } .select2-container--bootstrap .select2-selection--multiple.input-lg .select2-selection__clear, .input-group-lg .select2-container--bootstrap .select2-selection--multiple .select2-selection__clear, .form-group-lg .select2-container--bootstrap .select2-selection--multiple .select2-selection__clear { margin-top: 10px; } .select2-container--bootstrap .select2-selection.input-lg.select2-container--open .select2-selection--single { /** * Make the dropdown arrow point up while the dropdown is visible. */ } .select2-container--bootstrap .select2-selection.input-lg.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #999 transparent; border-width: 0 5px 5px 5px; } .input-group-lg .select2-container--bootstrap .select2-selection.select2-container--open .select2-selection--single { /** * Make the dropdown arrow point up while the dropdown is visible. */ } .input-group-lg .select2-container--bootstrap .select2-selection.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #999 transparent; border-width: 0 5px 5px 5px; } .select2-container--bootstrap[dir="rtl"] { /** * Single Select2 * * 1. Makes sure that .select2-selection__placeholder is positioned * correctly. */ /** * Multiple Select2 */ } .select2-container--bootstrap[dir="rtl"] .select2-selection--single { padding-left: 24px; padding-right: 12px; } .select2-container--bootstrap[dir="rtl"] .select2-selection--single .select2-selection__rendered { padding-right: 0; padding-left: 0; text-align: right; /* 1 */ } .select2-container--bootstrap[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; } .select2-container--bootstrap[dir="rtl"] .select2-selection--single .select2-selection__arrow { left: 12px; right: auto; } .select2-container--bootstrap[dir="rtl"] .select2-selection--single .select2-selection__arrow b { margin-left: 0; } .select2-container--bootstrap[dir="rtl"] .select2-selection--multiple .select2-selection__choice, .select2-container--bootstrap[dir="rtl"] .select2-selection--multiple .select2-selection__placeholder, .select2-container--bootstrap[dir="rtl"] .select2-selection--multiple .select2-search--inline { float: right; } .select2-container--bootstrap[dir="rtl"] .select2-selection--multiple .select2-selection__choice { margin-left: 0; margin-right: 6px; } .select2-container--bootstrap[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { margin-left: 2px; margin-right: auto; } /*------------------------------------* #ADDITIONAL GOODIES \*------------------------------------*/ /** * Address Bootstrap's validation states * * If a Select2 widget parent has one of Bootstrap's validation state modifier * classes, adjust Select2's border colors and focus states accordingly. * You may apply said classes to the Select2 dropdown (body > .select2-container) * via JavaScript match Bootstraps' to make its styles match. * * @see http://getbootstrap.com/css/#forms-control-validation */ .has-warning .select2-dropdown, .has-warning .select2-selection { border-color: #8a6d3b; } .has-warning .select2-container--focus .select2-selection, .has-warning .select2-container--open .select2-selection { -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b; border-color: #66512c; } .has-warning.select2-drop-active { border-color: #66512c; } .has-warning.select2-drop-active.select2-drop.select2-drop-above { border-top-color: #66512c; } .has-error .select2-dropdown, .has-error .select2-selection { border-color: #a94442; } .has-error .select2-container--focus .select2-selection, .has-error .select2-container--open .select2-selection { -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483; border-color: #843534; } .has-error.select2-drop-active { border-color: #843534; } .has-error.select2-drop-active.select2-drop.select2-drop-above { border-top-color: #843534; } .has-success .select2-dropdown, .has-success .select2-selection { border-color: #3c763d; } .has-success .select2-container--focus .select2-selection, .has-success .select2-container--open .select2-selection { -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168; border-color: #2b542c; } .has-success.select2-drop-active { border-color: #2b542c; } .has-success.select2-drop-active.select2-drop.select2-drop-above { border-top-color: #2b542c; } /** * Select2 widgets in Bootstrap Input Groups * * @see http://getbootstrap.com/components/#input-groups * @see https://github.com/twbs/bootstrap/blob/master/less/input-groups.less */ /** * Reset rounded corners */ .input-group > .select2-hidden-accessible:first-child + .select2-container--bootstrap > .selection > .select2-selection, .input-group > .select2-hidden-accessible:first-child + .select2-container--bootstrap > .selection > .select2-selection.form-control { border-bottom-right-radius: 0; border-top-right-radius: 0; } .input-group > .select2-hidden-accessible:not(:first-child) + .select2-container--bootstrap:not(:last-child) > .selection > .select2-selection, .input-group > .select2-hidden-accessible:not(:first-child) + .select2-container--bootstrap:not(:last-child) > .selection > .select2-selection.form-control { border-radius: 0; } .input-group > .select2-hidden-accessible:not(:first-child):not(:last-child) + .select2-container--bootstrap:last-child > .selection > .select2-selection, .input-group > .select2-hidden-accessible:not(:first-child):not(:last-child) + .select2-container--bootstrap:last-child > .selection > .select2-selection.form-control { border-bottom-left-radius: 0; border-top-left-radius: 0; } .input-group > .select2-container--bootstrap { display: table; table-layout: fixed; position: relative; z-index: 2; width: 100%; margin-bottom: 0; /** * Adjust z-index like Bootstrap does to show the focus-box-shadow * above appended buttons in .input-group and .form-group. */ /** * Adjust alignment of Bootstrap buttons in Bootstrap Input Groups to address * Multi Select2's height which - depending on how many elements have been selected - * may grow taller than its initial size. * * @see http://getbootstrap.com/components/#input-groups */ } .input-group > .select2-container--bootstrap > .selection > .select2-selection.form-control { float: none; } .input-group > .select2-container--bootstrap.select2-container--open, .input-group > .select2-container--bootstrap.select2-container--focus { z-index: 3; } .input-group > .select2-container--bootstrap, .input-group > .select2-container--bootstrap .input-group-btn, .input-group > .select2-container--bootstrap .input-group-btn .btn { vertical-align: top; } /** * Temporary fix for https://github.com/select2/select2-bootstrap-theme/issues/9 * * Provides `!important` for certain properties of the class applied to the * original `` element to hide it. * * @see https://github.com/select2/select2/pull/3301 * @see https://github.com/fk/select2/commit/31830c7b32cb3d8e1b12d5b434dee40a6e753ada */ .form-control.select2-hidden-accessible { position: absolute !important; width: 1px !important; } /** * Display override for inline forms */ @media (min-width: 768px) { .form-inline .select2-container--bootstrap { display: inline-block; } } /* New Desktop Condensed Look */ .product-grid-heading{ padding:5px 15px 5px 20px; background-color:#F9F9F9; position: -webkit-sticky; position: sticky; top: 83px; /* This should match the header height if it is sticky or be 0 - collaped header is slightly smaller... */ /* LAT010006 */ z-index:10; display:block; box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.20); border:0; margin:0px -30px 0px -15px; /* LAT010006 */ } @media (max-width: 810px){ .product-grid-heading{ top: 52px; /* LAT010006 need to reduce the top padding when .hidden-xs is hidden */ } } .qoGridWhse .product-grid-heading .product-links{ padding-top:0; padding-bottom:0; } .qoGridWhse .product-grid-heading .product-description{ display:none!important; } .qoGridWhse .swatch-wrapper{ margin-bottom:4px; } @media (min-width: 768px) { .qoGridWhse .product-grid-heading{ top: 83px; /* This should match the header height if it is sticky or be 0 */ /* LAT010006 */ } .quickorderGrid .swatch-wrapper{ margin-bottom:0; } .quickorderGrid .product-grid-heading .product-description{ display:flex!important;; } .qoGridWhse .product-item .product-price{ display:none; } } @media (min-width: 1024px) { .product-content .product-elem .form-control { width: 70px; height: 25px; padding: 0; } .product-full .product-links{ padding-top:15px; } .quickorderGrid .product-grid-heading .product-elem { width: 70px; } } /* Move warehouse / cutoff to left on large displays */ @media (min-width: 1149px) { .quickorderGrid .product-item, .quickorderGrid .product-grid-heading{ display:flex; flex-direction:row; } .quickorderGrid .product-head{ width:15%; margin-bottom:0; } .quickorderGrid .product-head{ display:block!important; } .quickorderGrid .product-description{ width:85%; } .qoGridColor .swatch-wrapper{ margin-top:17px; } .qoGridColor.product-full .swatch-wrapper .swatch-name{ position:relative; top:4px; } .quickorderGrid .prod-whse-cutoff{ font-size:13px; } } .whseDescHead{ margin-right:auto; font-weight:bold; font-size:14px; color: #444; } .whseCutoffHead{ margin-left:auto; margin-right:10px; /* LAT010006 */ } /*v LAT010000 v*/ /* incoming stock dialog */ table.weeklyStock th.weekHeading,table.weeklyStock th.sizeHeading { background-color: #537DAF; color: white; } .weeklyStockTopText, .weeklyStockTitle { font-weight:bold; } .weeklyStockTitle { margin-top: 5px; } .modal-dialog { width:350px; } @media (min-width: 520px) { .modal-dialog { width:500px; } } @media (min-width: 768px) { .modal-dialog { width:740px; } } @media (min-width: 992px) { .modal-dialog { width:900px; } } ::placeholder { color:#ccc; } .whseSelect,#colorSelectOuter { margin:10px 0px 5px 0px; } /* LAT021002 */ /* LAT010005 */ .whseSelect label,#gridModeOuter label,#colorSelectOuter label { margin-top:5px; text-align:right; } /* LAT021002 */ /* LAT010005 */ /*^ LAT010000 ^*/ .s2Swatch,.img-select { border:none; } /* LAT010005 */ .product-grid-heading { padding-left:16px; } /* LAT010005 */ #gridMsg { margin: 10px 0px; } /* LAT010005 */ .prodReviews{ } .reviewDetail{ } .reviewRating{ } .reviewTitle{ font-weight: bold; } .reviewDate{ } .reviewBy{ margin: 5px 0px; } .reviewBy span { padding-left: 3px; } .prodReviewForm{ } .starFull{ display:inline-block; width:20px; height:20px; background: url('../img/starFullSm.png') no-repeat top center; } .starHalf{ display:inline-block; width:20px; height:20px; background: url('../img/starHalfSm.png') no-repeat top center; } .starEmpty{ display:inline-block; width:20px; height:20px; background: url('../img/starEmptySm.png') no-repeat top center; } .helpfulOuter { margin-bottom: 5px; } .helpfulOuter a { font-size: 20px; padding: 2px 9px; border-radius: 20px; } .reviewAverage{ padding-top:15px; } .reviewAverageTxt{margin-left:5px; position:relative; top:-5px; }