/* Minification failed. Returning unminified contents. (3394,1): run-time error CSS1019: Unexpected token, found '@charset' (3394,10): run-time error CSS1019: Unexpected token, found '"utf-8"' (3394,17): run-time error CSS1019: Unexpected token, found ';' (3513,1): run-time error CSS1019: Unexpected token, found '@-webkit-keyframes' (3514,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%' (3517,1): run-time error CSS1019: Unexpected token, found '@keyframes' (3518,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%' (3523,1): run-time error CSS1019: Unexpected token, found '@-webkit-keyframes' (3524,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%' (3527,1): run-time error CSS1019: Unexpected token, found '@keyframes' (3528,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%' (4586,1): run-time error CSS1019: Unexpected token, found '@charset' (4586,10): run-time error CSS1019: Unexpected token, found '"utf-8"' (4586,17): run-time error CSS1019: Unexpected token, found ';' */ @font-face { font-family: "magictoolbox-thin"; font-weight: normal; font-style: normal; src:url("fonts/magictoolbox-thin.eot"); src:url("fonts/magictoolbox-thin.eot?#iefix") format("embedded-opentype"), url("fonts/magictoolbox-thin.woff") format("woff"), url("fonts/magictoolbox-thin.ttf") format("truetype"), url("fonts/magictoolbox-thin.svg#magictoolbox-thin") format("svg"); } .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; overflow: hidden; 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; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } .MagicZoom { -webkit-transform: translate3d(0,0,0); -ms-touch-action: pan-y; touch-action: pan-y; } figure.mz-figure { -webkit-perspective: 300px; perspective: 300px; margin: 0 !important; } .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-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-zoom-window.mz-magnifier.mz-expanded { z-index: 2147483647; } .mz-zoom-window img { left: -1000%; right: -1000%; top: -1000%; bottom: -1000%; margin: auto !important; -ms-transform-origin: 50% 50% !important; -webkit-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; -webkit-transform: none !important; transform: none !important; width: 100% !important; height: auto !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; } /** * 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-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-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: 50%; 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; } .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); transition: transform .22s cubic-bezier(0.25, 0.5, 0.5, 0.9); } /* 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; -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 */ .mobile-magic .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%); } .mobile-magic .mz-expand .mz-hint-message { padding: 1.1em; } .mobile-magic .mz-expand .mz-hint-message:before { display: none; } .mobile-magic .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 { 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; vertical-align: middle; margin: auto; z-index: -100; max-width: none !important; max-height: none !important; -webkit-transform: translate3d(0,0,0) scale(10) rotate(0.01deg); -ms-transform: translate(0,0) scale(10,10) rotate(0.01deg); transform: translate3d(0,0,0) scale(10) rotate(0.01deg); -webkit-perspective: 600px; perspective: 600px; background-repeat: no-repeat; background-size: cover; } .mz-expand .mz-expand-bg > img { margin: auto; filter: url("data:image/svg+xml;utf8,#blur"); -webkit-filter: blur(20px) brightness(60%); filter: blur(20px) brightness(60%); -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); -webkit-backface-visibility: hidden; backface-visibility: hidden; } .mz-expand .mz-expand-bg > svg { margin: auto; opacity: .6; } .lt-ie10-magic .mz-expand .mz-expand-bg { display: none !important; } .lt-ie9-magic .mz-expand { background: #1f1f1f; } /** 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 60px; } .mobile-magic .mz-expand .mz-expand-stage.mz-zoom-in .mz-image-stage { padding-top: 0; } .mobile-magic .mz-expand .mz-expand-thumbnails { padding: 0; height: 60px; } /** * 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; } 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: 30px !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 { background: rgba(255, 255, 255, .12) !important; border-color: rgba(180, 180, 180, .3) !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 */ .mz-thumb, .mz-thumb:focus { display: inline-block; line-height: 0; outline: none; } .mz-thumb img { border: 0; box-shadow: 0 0 1px 0px rgba(0,0,0,0.3); box-sizing: border-box; } .mz-thumb:hover:not(.mz-thumb-selected) img { -webkit-filter: brightness(70%); filter: brightness(70%); } .mz-thumb-selected img { -webkit-filter: brightness(50%); filter: brightness(50%); } .no-cssfilters-magic .mz-thumb { background: #000; } .no-cssfilters-magic .mz-thumb:hover:not(.mz-thumb-selected) img { opacity: .7; filter: alpha(opacity=70); } .no-cssfilters-magic .mz-thumb-selected img { opacity: .5; filter: alpha(opacity=50); } .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); } .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 { padding: 0 !important; -webkit-transition: none !important; transition: none !important; -webkit-transform: none !important; -moz-transform: none !important; -ms-transform: none !important; transform: none !important; left: 0 !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-height: 100%; 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%; max-height: none; } .ie8-magic .magic-thumbs-vertical ul li > img { width: 100%; } /** * Buttons */ .magic-thumbs .magic-thumbs-button { cursor: pointer; z-index: 90; background-repeat: no-repeat; background-color: transparent; background-image: none; border: 0; border-radius: 0; overflow: hidden; position: absolute; font-family: "magictoolbox-thin"; font-style: normal; font-weight: 200; font-variant: normal; text-transform: none !important; speak: none; line-height: 1; text-align: center; color: #bbb; -webkit-font-smoothing: antialiased; font-size: 30px; width: 30px; height: 100%; top: 0; bottom: 0; } .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"; } .magic-thumbs-button:before { -webkit-transition: opacity .25s; transition: opacity .25s; opacity: .6; } .magic-thumbs .magic-thumbs-button:hover:before { opacity: 1; } /* 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); } a[href="http://www.magictoolbox.com/magiczoomplus/"] { display:none;} /* Ion.RangeSlider // css version 1.8.1 // by Denis Ineshin | ionden.com // ===================================================================================================================*/ /* ===================================================================================================================== // RangeSlider */ .irs { position: relative; display: block; } .irs-line { position: relative; display: block; overflow: hidden; margin:0 2px; } .irs-line-left, .irs-line-mid, .irs-line-right { position: absolute; display: block; top: 0; } .irs-line-left { left: 0; width: 10%; } .irs-line-mid { left: 10%; width: 80%; } .irs-line-right { right: 0; width: 10%; } .irs-diapason { position: absolute; display: block; left: 0; width: 100%; } .irs-slider { position: absolute; display: block; cursor: default; z-index: 1; } .irs-slider.single { left: 10px; } .irs-slider.single:before { position: absolute; display: block; content: ""; top: -50%; left: -100%; width: 300%; height: 200%; background: rgba(0,0,0,0.0); } .irs-slider.from { left: 100px; } .irs-slider.from:before { position: absolute; display: block; content: ""; top: -50%; left: -200%; width: 300%; height: 200%; background: rgba(0,0,0,0.0); } .irs-slider.to { left: 300px; } .irs-slider.to:before { position: absolute; display: block; content: ""; top: -50%; left: 0; width: 300%; height: 200%; background: rgba(0,0,0,0.0); } .irs-slider.last { z-index: 2; } .irs-min { position: absolute; display: block; left: 0; cursor: default; } .irs-max { position: absolute; display: block; right: 0; cursor: default; } .irs-from, .irs-to, .irs-single { position: absolute; display: block; top: 45px; left: 0; cursor: default; white-space: nowrap; } .irs-grid { position: absolute; display: none; bottom: 0; left: 0; width: 100%; height: 20px; } .irs-with-grid .irs-grid { display: block; } .irs-grid-pol { position: absolute; top: 0; left: 0; width: 1px; height: 8px; background: #000; } .irs-grid-pol.small { height: 4px; } .irs-grid-text { position: absolute; bottom: 0; left: 0; width: 100px; white-space: nowrap; text-align: center; font-size: 9px; line-height: 9px; color: #000; } /* Ion.RangeSlider, Flat UI Skin // css version 1.8.1 // by Denis Ineshin | ionden.com // ===================================================================================================================*/ /* ===================================================================================================================== // Skin details */ .irs-line-mid, .irs-line-left, .irs-line-right, .irs-diapason, .irs-slider { background: url(../images/sprite-skin-flat.png) repeat-x; } .irs { height: 75px; } .irs-with-grid { height: 60px; } .irs-line { height: 8px; top: 25px; } .irs-line-left { height: 8px; background-position: 0 0px; } .irs-line-mid { height: 8px; background-position: 0 0px; } .irs-line-right { height: 8px; background-position: 100% 0px; } .irs-diapason { height: 12px; top: 25px; background-position: 0 -60px; } .irs-slider { width: 17px; height: 17px; top: 20px; background-position: 0 -12px; cursor:pointer; } .irs-min, .irs-max { color: #999; font-size: 10px; line-height: 1.333; text-shadow: none; top: 0; padding: 1px 3px; background: #e1e4e9; border-radius: 4px; opacity:0; } .irs-from, .irs-to, .irs-single { color: #666666; font-size: 14px; line-height: 16px; text-shadow: none; padding: 0; background: none; border-radius: 0; color:#666666; } .irs-grid-pol { background: #e1e4e9; } .irs-grid-text { color: #999; } div.fancy-select { position: relative; width:100%; } div.fancy-select.disabled { opacity: 0.5; } div.fancy-select select:focus + div.trigger { } div.fancy-select select:focus + div.trigger.open { box-shadow: none; } div.fancy-select div.trigger { cursor: pointer; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; position: relative; width:100%; transition: all 240ms ease-out; -webkit-transition: all 240ms ease-out; -moz-transition: all 240ms ease-out; -ms-transition: all 240ms ease-out; -o-transition: all 240ms ease-out; } div.fancy-select div.trigger:after { content: ""; display: block; position: absolute; top: 0; right: 0; } div.fancy-select div.trigger.open { } div.fancy-select div.trigger.open:after { } div.fancy-select ul.options { box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; list-style: none; margin: 0; position: absolute; top: 0px; left: 0; visibility: hidden; opacity: 0; z-index: 50; max-height: 200px; overflow: auto; min-width: 100%; transition: opacity 300ms ease-out, top 300ms ease-out, visibility 300ms ease-out; -webkit-transition: opacity 300ms ease-out, top 300ms ease-out, visibility 300ms ease-out; -moz-transition: opacity 300ms ease-out, top 300ms ease-out, visibility 300ms ease-out; -ms-transition: opacity 300ms ease-out, top 300ms ease-out, visibility 300ms ease-out; -o-transition: opacity 300ms ease-out, top 300ms ease-out, visibility 300ms ease-out; } div.fancy-select ul.options.open { visibility: visible; top: 100%; opacity: 1; /* have to use a non-visibility transition to prevent this iOS issue (bug?): */ /*http://stackoverflow.com/questions/10736478/css-animation-visibility-visible-works-on-chrome-and-safari-but-not-on-ios*/ transition: opacity 300ms ease-out, top 300ms ease-out; -webkit-transition: opacity 300ms ease-out, top 300ms ease-out; -moz-transition: opacity 300ms ease-out, top 300ms ease-out; -ms-transition: opacity 300ms ease-out, top 300ms ease-out; -o-transition: opacity 300ms ease-out, top 300ms ease-out; } div.fancy-select ul.options.overflowing { top: auto; bottom: 0; transition: opacity 300ms ease-out, bottom 300ms ease-out, visibility 300ms ease-out; -webkit-transition: opacity 300ms ease-out, bottom 300ms ease-out, visibility 300ms ease-out; -moz-transition: opacity 300ms ease-out, bottom 300ms ease-out, visibility 300ms ease-out; -ms-transition: opacity 300ms ease-out, bottom 300ms ease-out, visibility 300ms ease-out; -o-transition: opacity 300ms ease-out, bottom 300ms ease-out, visibility 300ms ease-out; } div.fancy-select ul.options.overflowing.open { top: auto; bottom: 100%; transition: opacity 300ms ease-out, bottom 300ms ease-out; -webkit-transition: opacity 300ms ease-out, bottom 300ms ease-out; -moz-transition: opacity 300ms ease-out, bottom 300ms ease-out; -ms-transition: opacity 300ms ease-out, bottom 300ms ease-out; -o-transition: opacity 300ms ease-out, bottom 300ms ease-out; } div.fancy-select ul.options li { cursor: pointer; white-space: nowrap; transition: all 150ms ease-out; -webkit-transition: all 150ms ease-out; -moz-transition: all 150ms ease-out; -ms-transition: all 150ms ease-out; -o-transition: all 150ms ease-out; } div.fancy-select ul.options li.selected { } div.fancy-select ul.options li.hover { } @media all and (-ms-high-contrast:none) { div.fancy-select ul.options { width:90%; } /* IE10 */ *::-ms-backdrop, div.fancy-select ul.options { width:90%; } /* IE11 */ } /* Custom */ .sort .fancy-select { background:none; border:1px solid #e5e5e5; } .sort .fancy-select div.trigger { padding: 7px 28px 5px 5px; color: #353535; font-size:13px; } .sort .fancy-select div.trigger:after { width: 28px; height: 28px; background:url(../images/select_arrow.png) no-repeat center center;} .sort .fancy-select div.open.trigger:after { transform:rotate(180deg); -webkit-transform:rotate(180deg); -moz-transform:rotate(180deg); -ms-transform:rotate(180deg); -o-transform:rotate(180deg);} .sort .fancy-select ul.options { background:#fff; border:1px solid #e5e5e5; padding:8px 0; left:-1px; right:-1px;} .sort .fancy-select ul.options li { padding: 0 10px; color: #000; line-height:25px; font-size:13px;} .sort .fancy-select ul.options li.selected { background: #e3e3e3; } .sort .fancy-select ul.options li.hover { background: #e3e3e3;} input[type=radio],input[type=checkbox] { margin-bottom: 0;} .checkator_source { position: relative; z-index: 2; display: block;} .checkator_holder { display: inline-block; position: relative;} .checkator { display: block; position: absolute; top:0; right: 0; bottom: 0; left: 0; z-index: 1;} .checkator_source:checked+.checkator:after { display: block; content: ' '; width:100%; height:100%; position: absolute;} /* RADIO SETTINGS */ .checkator.radio { background:url(../images/radio.png) no-repeat; width:18px; height:18px; } .checkator.radio:after { background:url(../images/radio_checked.png) no-repeat; } /* CHECKBOX SETTINGS */ .checkator.checkbox { /* New element */ background:url(../images/check.png) no-repeat; width:15px; height:15px; } .checkator.checkbox:after { background:url(../images/checked.png) no-repeat; } .ra_label { line-height:18px; display:block; font-size:16px; color:#7d7d7d; } .ch_label { line-height:15px; display:block; font-weight:500; font-size:13px; color:#353535; text-transform:uppercase;} .checkbox { width:15px; height:15px; float:left; margin-right:11px;} .radio { width:18px; height:18px; float:left; margin-right:8px; font-size:13px;} /* == malihu jquery custom scrollbar plugin == Plugin URI: http://manos.malihu.gr/jquery-custom-content-scroller */ /* CONTENTS: 1. BASIC STYLE - Plugin's basic/essential CSS properties (normally, should not be edited). 2. VERTICAL SCROLLBAR - Positioning and dimensions of vertical scrollbar. 3. HORIZONTAL SCROLLBAR - Positioning and dimensions of horizontal scrollbar. 4. VERTICAL AND HORIZONTAL SCROLLBARS - Positioning and dimensions of 2-axis scrollbars. 5. TRANSITIONS - CSS3 transitions for hover events, auto-expanded and auto-hidden scrollbars. 6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS 6.1 THEMES - Scrollbar colors, opacity, dimensions, backgrounds etc. via ready-to-use themes. */ /* ------------------------------------------------------------------------------------------------------------------------ 1. BASIC STYLE ------------------------------------------------------------------------------------------------------------------------ */ .mCustomScrollbar{ -ms-touch-action: pinch-zoom; touch-action: pinch-zoom; /* direct pointer events to js */ } .mCustomScrollbar.mCS_no_scrollbar, .mCustomScrollbar.mCS_touch_action{ -ms-touch-action: auto; touch-action: auto; } .mCustomScrollBox{ /* contains plugin's markup */ position: relative; overflow: hidden; height: 100%; max-width: 100%; outline: none; direction: ltr; } .mCSB_container{ /* contains the original content */ overflow: hidden; width: auto; height: auto; } /* ------------------------------------------------------------------------------------------------------------------------ 2. VERTICAL SCROLLBAR y-axis ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden{ margin-right: 0; } /* non-visible scrollbar */ .mCS-dir-rtl > .mCSB_inside > .mCSB_container{ /* RTL direction/left-side scrollbar */ margin-right: 0; margin-left: 30px; } .mCS-dir-rtl > .mCSB_inside > .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden{ margin-left: 0; } /* RTL direction/left-side scrollbar */ .mCSB_outside + .mCSB_scrollTools{ right: -26px; } /* scrollbar position: outside */ .mCS-dir-rtl > .mCSB_inside > .mCSB_scrollTools, .mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools{ /* RTL direction/left-side scrollbar */ right: auto; left: 0; } .mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools{ left: -26px; } /* RTL direction/left-side scrollbar (scrollbar position: outside) */ .mCSB_scrollTools .mCSB_draggerContainer{ /* contains the draggable element and dragger rail markup */ position: absolute; top: 0; left: 0; bottom: 0; right: 0; height: auto; } .mCSB_scrollTools a + .mCSB_draggerContainer{ margin: 20px 0; } .mCSB_scrollTools .mCSB_dragger{ /* the draggable element */ cursor: pointer; width: 100%; height: 30px; /* minimum dragger height */ z-index: 1; } .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{ width: 12px; /* auto-expanded scrollbar */ } .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ width: 8px; /* auto-expanded scrollbar */ } .mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonDown{ display: block; position: absolute; height: 20px; width: 100%; overflow: hidden; margin: 0 auto; cursor: pointer; } .mCSB_scrollTools .mCSB_buttonDown{ bottom: 0; } /* ------------------------------------------------------------------------------------------------------------------------ 3. HORIZONTAL SCROLLBAR x-axis ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_horizontal.mCSB_inside > .mCSB_container{ margin-right: 0; margin-bottom: 30px; } .mCSB_horizontal.mCSB_outside > .mCSB_container{ min-height: 100%; } .mCSB_horizontal > .mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden{ margin-bottom: 0; } /* non-visible scrollbar */ .mCSB_scrollTools.mCSB_scrollTools_horizontal{ width: auto; height: 16px; top: auto; right: 0; bottom: 0; left: 0; } .mCustomScrollBox + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal{ bottom: -26px; } /* scrollbar position: outside */ .mCSB_scrollTools.mCSB_scrollTools_horizontal a + .mCSB_draggerContainer{ margin: 0 20px; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail{ width: 100%; height: 2px; margin: 7px 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 30px; /* minimum dragger width */ height: 100%; left: 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ width: 100%; height: 4px; margin: 6px auto; } .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{ height: 12px; /* auto-expanded scrollbar */ margin: 2px auto; } .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ height: 8px; /* auto-expanded scrollbar */ margin: 4px 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft, .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight{ display: block; position: absolute; width: 20px; height: 100%; overflow: hidden; margin: 0 auto; cursor: pointer; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft{ left: 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight{ right: 0; } /* ------------------------------------------------------------------------------------------------------------------------ 4. VERTICAL AND HORIZONTAL SCROLLBARS yx-axis ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_container_wrapper{ position: absolute; height: auto; width: auto; overflow: hidden; top: 0; left: 0; right: 0; bottom: 0; margin-right: 30px; margin-bottom: 30px; } .mCSB_container_wrapper > .mCSB_container{ padding-right: 30px; padding-bottom: 30px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_vertical{ bottom: 20px; } .mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ right: 20px; } /* non-visible horizontal scrollbar */ .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden + .mCSB_scrollTools.mCSB_scrollTools_vertical{ bottom: 0; } /* non-visible vertical scrollbar/RTL direction/left-side scrollbar */ .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ right: 0; } /* RTL direction/left-side scrollbar */ .mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ left: 20px; } /* non-visible scrollbar/RTL direction/left-side scrollbar */ .mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal{ left: 0; } .mCS-dir-rtl > .mCSB_inside > .mCSB_container_wrapper{ /* RTL direction/left-side scrollbar */ margin-right: 0; margin-left: 30px; } .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden > .mCSB_container{ padding-right: 0; } .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden > .mCSB_container{ padding-bottom: 0; } .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden{ margin-right: 0; /* non-visible scrollbar */ margin-left: 0; } /* non-visible horizontal scrollbar */ .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden{ margin-bottom: 0; } /* ------------------------------------------------------------------------------------------------------------------------ 5. TRANSITIONS ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_scrollTools, .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonDown, .mCSB_scrollTools .mCSB_buttonLeft, .mCSB_scrollTools .mCSB_buttonRight{ -webkit-transition: opacity .2s ease-in-out, background-color .2s ease-in-out; -moz-transition: opacity .2s ease-in-out, background-color .2s ease-in-out; -o-transition: opacity .2s ease-in-out, background-color .2s ease-in-out; transition: opacity .2s ease-in-out, background-color .2s ease-in-out; } .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar, /* auto-expanded scrollbar */ .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail{ -webkit-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; -moz-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; -o-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; } /* ------------------------------------------------------------------------------------------------------------------------ 6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS ------------------------------------------------------------------------------------------------------------------------ */ /* ---------------------------------------- 6.1 THEMES ---------------------------------------- */ /* default theme ("light") */ .mCSB_scrollTools{ opacity: 0.75; filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; } .mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools{ opacity: 1; filter: "alpha(opacity=1)"; -ms-filter: "alpha(opacity=1)"; } .mCustomScrollbar > .mCustomScrollBox > .mCSB_scrollTools.mCSB_scrollTools_onDrag, .mCustomScrollbar > .mCustomScrollBox ~ .mCSB_scrollTools.mCSB_scrollTools_onDrag, .mCustomScrollBox:hover > .mCSB_scrollTools, .mCustomScrollBox:hover ~ .mCSB_scrollTools, .mCS-autoHide:hover > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide:hover > .mCustomScrollBox ~ .mCSB_scrollTools{ opacity: 1; filter: "alpha(opacity=100)"; -ms-filter: "alpha(opacity=100)"; } .mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.4); filter: "alpha(opacity=40)"; -ms-filter: "alpha(opacity=40)"; } .mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonDown, .mCSB_scrollTools .mCSB_buttonLeft, .mCSB_scrollTools .mCSB_buttonRight{ background-image: url(mCSB_buttons.png); /* css sprites */ background-repeat: no-repeat; opacity: 0.4; filter: "alpha(opacity=40)"; -ms-filter: "alpha(opacity=40)"; } .mCSB_scrollTools .mCSB_buttonUp{ background-position: 0 0; /* sprites locations light: 0 0, -16px 0, -32px 0, -48px 0, 0 -72px, -16px -72px, -32px -72px dark: -80px 0, -96px 0, -112px 0, -128px 0, -80px -72px, -96px -72px, -112px -72px */ } .mCSB_scrollTools .mCSB_buttonDown{ background-position: 0 -20px; /* sprites locations light: 0 -20px, -16px -20px, -32px -20px, -48px -20px, 0 -92px, -16px -92px, -32px -92px dark: -80px -20px, -96px -20px, -112px -20px, -128px -20px, -80px -92px, -96px -92px, -112 -92px */ } .mCSB_scrollTools .mCSB_buttonLeft{ background-position: 0 -40px; /* sprites locations light: 0 -40px, -20px -40px, -40px -40px, -60px -40px, 0 -112px, -20px -112px, -40px -112px dark: -80px -40px, -100px -40px, -120px -40px, -140px -40px, -80px -112px, -100px -112px, -120px -112px */ } .mCSB_scrollTools .mCSB_buttonRight{ background-position: 0 -56px; /* sprites locations light: 0 -56px, -20px -56px, -40px -56px, -60px -56px, 0 -128px, -20px -128px, -40px -128px dark: -80px -56px, -100px -56px, -120px -56px, -140px -56px, -80px -128px, -100px -128px, -120px -128px */ } .mCSB_scrollTools .mCSB_buttonUp:hover, .mCSB_scrollTools .mCSB_buttonDown:hover, .mCSB_scrollTools .mCSB_buttonLeft:hover, .mCSB_scrollTools .mCSB_buttonRight:hover{ opacity: 0.75; filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; } .mCSB_scrollTools .mCSB_buttonUp:active, .mCSB_scrollTools .mCSB_buttonDown:active, .mCSB_scrollTools .mCSB_buttonLeft:active, .mCSB_scrollTools .mCSB_buttonRight:active{ opacity: 0.9; filter: "alpha(opacity=90)"; -ms-filter: "alpha(opacity=90)"; } /* theme: "dark" */ .mCS-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.15); } .mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); } .mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: rgba(0,0,0,0.85); } .mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: rgba(0,0,0,0.9); } .mCS-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -80px 0; } .mCS-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -80px -20px; } .mCS-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -80px -40px; } .mCS-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -80px -56px; } /* ---------------------------------------- */ /* theme: "light-2", "dark-2" */ .mCS-light-2.mCSB_scrollTools .mCSB_draggerRail, .mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail{ width: 4px; background-color: #fff; background-color: rgba(255,255,255,0.1); -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; } .mCS-light-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 4px; background-color: #fff; background-color: rgba(255,255,255,0.75); -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; } .mCS-light-2.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-light-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ width: 100%; height: 4px; margin: 6px auto; } .mCS-light-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); } .mCS-light-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-light-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.9); } .mCS-light-2.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px 0; } .mCS-light-2.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -20px; } .mCS-light-2.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -40px; } .mCS-light-2.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -56px; } /* theme: "dark-2" */ .mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.1); -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; } .mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; } .mCS-dark-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); } .mCS-dark-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); } .mCS-dark-2.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px 0; } .mCS-dark-2.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -20px; } .mCS-dark-2.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -40px; } .mCS-dark-2.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -56px; } /* ---------------------------------------- */ /* theme: "light-thick", "dark-thick" */ .mCS-light-thick.mCSB_scrollTools .mCSB_draggerRail, .mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail{ width: 4px; background-color: #fff; background-color: rgba(255,255,255,0.1); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 6px; background-color: #fff; background-color: rgba(255,255,255,0.75); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail{ width: 100%; height: 4px; margin: 6px 0; } .mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ width: 100%; height: 6px; margin: 5px auto; } .mCS-light-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); } .mCS-light-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-light-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.9); } .mCS-light-thick.mCSB_scrollTools .mCSB_buttonUp{ background-position: -16px 0; } .mCS-light-thick.mCSB_scrollTools .mCSB_buttonDown{ background-position: -16px -20px; } .mCS-light-thick.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -20px -40px; } .mCS-light-thick.mCSB_scrollTools .mCSB_buttonRight{ background-position: -20px -56px; } /* theme: "dark-thick" */ .mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.1); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); } .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); } .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonUp{ background-position: -96px 0; } .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonDown{ background-position: -96px -20px; } .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -100px -40px; } .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonRight{ background-position: -100px -56px; } /* ---------------------------------------- */ /* theme: "light-thin", "dark-thin" */ .mCS-light-thin.mCSB_scrollTools .mCSB_draggerRail{ background-color: #fff; background-color: rgba(255,255,255,0.1); } .mCS-light-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 2px; } .mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail{ width: 100%; } .mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ width: 100%; height: 2px; margin: 7px auto; } /* theme "dark-thin" */ .mCS-dark-thin.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.15); } .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); } .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); } .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); } .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonUp{ background-position: -80px 0; } .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonDown{ background-position: -80px -20px; } .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -80px -40px; } .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonRight{ background-position: -80px -56px; } /* ---------------------------------------- */ /* theme "rounded", "rounded-dark", "rounded-dots", "rounded-dots-dark" */ .mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 14px; } .mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ height: 14px; margin: 1px 0; } .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{ width: 16px; /* auto-expanded scrollbar */ height: 16px; margin: -1px 0; } .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ width: 4px; /* auto-expanded scrollbar */ } .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{ height: 16px; /* auto-expanded scrollbar */ width: 16px; margin: 0 -1px; } .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ height: 4px; /* auto-expanded scrollbar */ margin: 6px 0; } .mCS-rounded.mCSB_scrollTools .mCSB_buttonUp{ background-position: 0 -72px; } .mCS-rounded.mCSB_scrollTools .mCSB_buttonDown{ background-position: 0 -92px; } .mCS-rounded.mCSB_scrollTools .mCSB_buttonLeft{ background-position: 0 -112px; } .mCS-rounded.mCSB_scrollTools .mCSB_buttonRight{ background-position: 0 -128px; } /* theme "rounded-dark", "rounded-dots-dark" */ .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); } .mCS-rounded-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.15); } .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); } .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); } .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -80px -72px; } .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -80px -92px; } .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -80px -112px; } .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -80px -128px; } /* theme "rounded-dots", "rounded-dots-dark" */ .mCS-rounded-dots.mCSB_scrollTools_vertical .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools_vertical .mCSB_draggerRail{ width: 4px; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{ background-color: transparent; background-position: center; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail{ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg=="); background-repeat: repeat-y; opacity: 0.3; filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)"; } .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{ height: 4px; margin: 6px 0; background-repeat: repeat-x; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonUp{ background-position: -16px -72px; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonDown{ background-position: -16px -92px; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -20px -112px; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonRight{ background-position: -20px -128px; } /* theme "rounded-dots-dark" */ .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail{ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYV2NkIAAYSVFgDFR8BqrBBEifBbGRTfiPZhpYjiQFBK3A6l6CvgAAE9kGCd1mvgEAAAAASUVORK5CYII="); } .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -96px -72px; } .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -96px -92px; } .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -100px -112px; } .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -100px -128px; } /* ---------------------------------------- */ /* theme "3d", "3d-dark", "3d-thick", "3d-thick-dark" */ .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-repeat: repeat-y; background-image: -moz-linear-gradient(left, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 100%); background-image: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0.5)), color-stop(100%,rgba(255,255,255,0))); background-image: -webkit-linear-gradient(left, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); background-image: -o-linear-gradient(left, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); background-image: -ms-linear-gradient(left, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); background-image: linear-gradient(to right, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); } .mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ background-repeat: repeat-x; background-image: -moz-linear-gradient(top, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 100%); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.5)), color-stop(100%,rgba(255,255,255,0))); background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); background-image: -o-linear-gradient(top, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); background-image: -ms-linear-gradient(top, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); background-image: linear-gradient(to bottom, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); } /* theme "3d", "3d-dark" */ .mCS-3d.mCSB_scrollTools_vertical .mCSB_dragger, .mCS-3d-dark.mCSB_scrollTools_vertical .mCSB_dragger{ height: 70px; } .mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 70px; } .mCS-3d.mCSB_scrollTools, .mCS-3d-dark.mCSB_scrollTools{ opacity: 1; filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)"; } .mCS-3d.mCSB_scrollTools .mCSB_draggerRail, .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; } .mCS-3d.mCSB_scrollTools .mCSB_draggerRail, .mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail{ width: 8px; background-color: #000; background-color: rgba(0,0,0,0.2); box-shadow: inset 1px 0 1px rgba(0,0,0,0.5), inset -1px 0 1px rgba(255,255,255,0.2); } .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-3d.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-3d.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #555; } .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 8px; } .mCS-3d.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{ width: 100%; height: 8px; margin: 4px 0; box-shadow: inset 0 1px 1px rgba(0,0,0,0.5), inset 0 -1px 1px rgba(255,255,255,0.2); } .mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ width: 100%; height: 8px; margin: 4px auto; } .mCS-3d.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; } .mCS-3d.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; } .mCS-3d.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; } .mCS-3d.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; } /* theme "3d-dark" */ .mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.1); box-shadow: inset 1px 0 1px rgba(0,0,0,0.1); } .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{ box-shadow: inset 0 1px 1px rgba(0,0,0,0.1); } .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; } .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; } .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; } .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; } /* ---------------------------------------- */ /* theme: "3d-thick", "3d-thick-dark" */ .mCS-3d-thick.mCSB_scrollTools, .mCS-3d-thick-dark.mCSB_scrollTools{ opacity: 1; filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)"; } .mCS-3d-thick.mCSB_scrollTools, .mCS-3d-thick-dark.mCSB_scrollTools, .mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer{ -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; } .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .mCSB_inside + .mCS-3d-thick.mCSB_scrollTools_vertical, .mCSB_inside + .mCS-3d-thick-dark.mCSB_scrollTools_vertical{ right: 1px; } .mCS-3d-thick.mCSB_scrollTools_vertical, .mCS-3d-thick-dark.mCSB_scrollTools_vertical{ box-shadow: inset 1px 0 1px rgba(0,0,0,0.1), inset 0 0 14px rgba(0,0,0,0.5); } .mCS-3d-thick.mCSB_scrollTools_horizontal, .mCS-3d-thick-dark.mCSB_scrollTools_horizontal{ bottom: 1px; box-shadow: inset 0 1px 1px rgba(0,0,0,0.1), inset 0 0 14px rgba(0,0,0,0.5); } .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ box-shadow: inset 1px 0 0 rgba(255,255,255,0.4); width: 12px; margin: 2px; position: absolute; height: auto; top: 0; bottom: 0; left: 0; right: 0; } .mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ box-shadow: inset 0 1px 0 rgba(255,255,255,0.4); } .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #555; } .mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ height: 12px; width: auto; } .mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer{ background-color: #000; background-color: rgba(0,0,0,0.05); box-shadow: inset 1px 1px 16px rgba(0,0,0,0.1); } .mCS-3d-thick.mCSB_scrollTools .mCSB_draggerRail{ background-color: transparent; } .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; } .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; } .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; } .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; } /* theme: "3d-thick-dark" */ .mCS-3d-thick-dark.mCSB_scrollTools{ box-shadow: inset 0 0 14px rgba(0,0,0,0.2); } .mCS-3d-thick-dark.mCSB_scrollTools_horizontal{ box-shadow: inset 0 1px 1px rgba(0,0,0,0.1), inset 0 0 14px rgba(0,0,0,0.2); } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ box-shadow: inset 1px 0 0 rgba(255,255,255,0.4), inset -1px 0 0 rgba(0,0,0,0.2); } .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ box-shadow: inset 0 1px 0 rgba(255,255,255,0.4), inset 0 -1px 0 rgba(0,0,0,0.2); } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #777; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer{ background-color: #fff; background-color: rgba(0,0,0,0.05); box-shadow: inset 1px 1px 16px rgba(0,0,0,0.1); } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: transparent; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; } /* ---------------------------------------- */ /* theme: "minimal", "minimal-dark" */ .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical, .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical{ right: 0; margin: 12px 0; } .mCustomScrollBox.mCS-minimal + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox.mCS-minimal + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal{ bottom: 0; margin: 0 12px; } /* RTL direction/left-side scrollbar */ .mCS-dir-rtl > .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical, .mCS-dir-rtl > .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical{ left: 0; right: auto; } .mCS-minimal.mCSB_scrollTools .mCSB_draggerRail, .mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: transparent; } .mCS-minimal.mCSB_scrollTools_vertical .mCSB_dragger, .mCS-minimal-dark.mCSB_scrollTools_vertical .mCSB_dragger{ height: 50px; } .mCS-minimal.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-minimal-dark.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 50px; } .mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.2); filter: "alpha(opacity=20)"; -ms-filter: "alpha(opacity=20)"; } .mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.5); filter: "alpha(opacity=50)"; -ms-filter: "alpha(opacity=50)"; } /* theme: "minimal-dark" */ .mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.2); filter: "alpha(opacity=20)"; -ms-filter: "alpha(opacity=20)"; } .mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.5); filter: "alpha(opacity=50)"; -ms-filter: "alpha(opacity=50)"; } /* ---------------------------------------- */ /* theme "light-3", "dark-3" */ .mCS-light-3.mCSB_scrollTools .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail{ width: 6px; background-color: #000; background-color: rgba(0,0,0,0.2); } .mCS-light-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 6px; } .mCS-light-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-light-3.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_draggerRail{ width: 100%; height: 6px; margin: 5px 0; } .mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ width: 12px; } .mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ height: 12px; margin: 2px 0; } .mCS-light-3.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; } .mCS-light-3.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; } .mCS-light-3.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; } .mCS-light-3.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; } /* theme "dark-3" */ .mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); } .mCS-dark-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); } .mCS-dark-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); } .mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.1); } .mCS-dark-3.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; } .mCS-dark-3.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; } .mCS-dark-3.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; } .mCS-dark-3.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; } /* ---------------------------------------- */ /* theme "inset", "inset-dark", "inset-2", "inset-2-dark", "inset-3", "inset-3-dark" */ .mCS-inset.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail{ width: 12px; background-color: #000; background-color: rgba(0,0,0,0.2); } .mCS-inset.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 6px; margin: 3px 5px; position: absolute; height: auto; top: 0; bottom: 0; left: 0; right: 0; } .mCS-inset.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ height: 6px; margin: 5px 3px; position: absolute; width: auto; top: 0; bottom: 0; left: 0; right: 0; } .mCS-inset.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{ width: 100%; height: 12px; margin: 2px 0; } .mCS-inset.mCSB_scrollTools .mCSB_buttonUp, .mCS-inset-2.mCSB_scrollTools .mCSB_buttonUp, .mCS-inset-3.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; } .mCS-inset.mCSB_scrollTools .mCSB_buttonDown, .mCS-inset-2.mCSB_scrollTools .mCSB_buttonDown, .mCS-inset-3.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; } .mCS-inset.mCSB_scrollTools .mCSB_buttonLeft, .mCS-inset-2.mCSB_scrollTools .mCSB_buttonLeft, .mCS-inset-3.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; } .mCS-inset.mCSB_scrollTools .mCSB_buttonRight, .mCS-inset-2.mCSB_scrollTools .mCSB_buttonRight, .mCS-inset-3.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; } /* theme "inset-dark", "inset-2-dark", "inset-3-dark" */ .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); } .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); } .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); } .mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.1); } .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonUp, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonUp, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; } .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonDown, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonDown, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; } .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonLeft, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonLeft, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; } .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonRight, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonRight, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; } /* theme "inset-2", "inset-2-dark" */ .mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: transparent; border-width: 1px; border-style: solid; border-color: #fff; border-color: rgba(255,255,255,0.2); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail{ border-color: #000; border-color: rgba(0,0,0,0.2); } /* theme "inset-3", "inset-3-dark" */ .mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail{ background-color: #fff; background-color: rgba(255,255,255,0.6); } .mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.6); } .mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); } .mCS-inset-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); } .mCS-inset-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-inset-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); } .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.75); } .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); } .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.9); } /* ---------------------------------------- */ .scrollbar { overflow: auto; position: relative; padding: 0; color:#000; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } /* Margin for scroller */ .mCSB_inside > .mCSB_container{ margin-right: 15px; } /* Total width */ .mCSB_scrollTools{ /* contains scrollbar markup (draggable element, dragger rail, buttons etc.) */ position: absolute; width: 9px; height: auto; left: auto; top: 0; right: 0; bottom: 0; } /* Line width */ .mCSB_scrollTools .mCSB_draggerRail{ width: 1px; height: 100%; margin: 0 auto; -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; } /* Line color */ .mCS-rounded.mCSB_scrollTools .mCSB_draggerRail{ background-color: #e5e5e5; } /* Dot color */ .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #d1d1d1; } /* Dot On Drag */ .mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #d1d1d1; } /* Dot On Drag Hover*/ .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ } .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ /* the dragger element */ position: relative; width: 4px; height: 100%; margin: 0 auto; border-radius: 0; text-align: center; } /* Dot Height */ .mCS-rounded.mCSB_scrollTools .mCSB_dragger, .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger, .mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger{ height: 14px; } /* Dot Width */ .mCS-rounded.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 9px; margin: 0 0px; } /*! fancyBox v2.1.5 fancyapps.com | fancyapps.com/fancybox/#license */ .fancybox-wrap, .fancybox-skin, .fancybox-outer, .fancybox-inner, .fancybox-image, .fancybox-wrap iframe, .fancybox-wrap object, .fancybox-nav, .fancybox-nav span, .fancybox-tmp { padding: 0; margin: 0; border: 0; outline: none; vertical-align: top; } .fancybox-wrap { position: absolute; top: 0; left: 0; z-index: 8020; } .fancybox-skin { position: relative; background: #f9f9f9; color: #444; text-shadow: none; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .fancybox-opened { z-index: 8030; } .fancybox-opened .fancybox-skin { -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); } .fancybox-outer, .fancybox-inner { position: relative; } .fancybox-inner { overflow: hidden; } .fancybox-type-iframe .fancybox-inner { -webkit-overflow-scrolling: touch; } .fancybox-error { color: #444; font: 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; margin: 0; padding: 15px; white-space: nowrap; } .fancybox-image, .fancybox-iframe { display: block; width: 100%; height: 100%; } .fancybox-image { max-width: 100%; max-height: 100%; } #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span { background-image: url('../images/popup/fancybox_sprite.png'); } #fancybox-loading { position: fixed; top: 50%; left: 50%; margin-top: -22px; margin-left: -22px; background-position: 0 -108px; opacity: 0.8; cursor: pointer; z-index: 8060; } #fancybox-loading div { width: 44px; height: 44px; background: url('../images/popup/fancybox_loading.gif') center center no-repeat; } .fancybox-close { position: absolute; top: 15px; right: 20px; width: 20px; height: 20px; cursor: pointer; background:url(../images/remove_icon.png) no-repeat !important; border-radius:2px; z-index: 8040; } .fancybox-close:hover { background-position:0 100% !important;} .fancybox-nav { position: absolute; top: 0; width: 40%; height: 100%; cursor: pointer; text-decoration: none; background: transparent url('../images/popup/blank.gif'); /* helps IE */ -webkit-tap-highlight-color: rgba(0,0,0,0); z-index: 8040; } .fancybox-prev { left: 0; } .fancybox-next { right: 0; } .fancybox-nav span { position: absolute; top: 50%; width: 36px; height: 34px; margin-top: -18px; cursor: pointer; z-index: 8040; visibility: hidden; } .fancybox-prev span { left: 10px; background-position: 0 -36px; } .fancybox-next span { right: 10px; background-position: 0 -72px; } .fancybox-nav:hover span { visibility: visible; } .fancybox-tmp { position: absolute; top: -99999px; left: -99999px; visibility: hidden; max-width: 99999px; max-height: 99999px; overflow: visible !important; } /* Overlay helper */ .fancybox-lock { overflow: hidden !important; width: auto; } .fancybox-lock body { overflow: hidden !important; } .fancybox-lock-test { overflow-y: hidden !important; } .fancybox-overlay { position: absolute; top: 0; left: 0; overflow: hidden; display: none; z-index: 8010; background: url('../images/popup/fancybox_overlay.png'); } .fancybox-overlay-fixed { position: fixed; bottom: 0; right: 0; } .fancybox-lock .fancybox-overlay { overflow: auto; overflow-y: scroll; } /* Title helper */ .fancybox-title { visibility: hidden; font: normal 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; position: relative; text-shadow: none; z-index: 8050; } .fancybox-opened .fancybox-title { visibility: visible; } .fancybox-title-float-wrap { position: absolute; bottom: 0; right: 50%; margin-bottom: -35px; z-index: 8050; text-align: center; } .fancybox-title-float-wrap .child { display: inline-block; margin-right: -100%; padding: 2px 20px; background: transparent; /* Fallback for web browsers that doesn't support RGBa */ background: rgba(0, 0, 0, 0.8); -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; text-shadow: 0 1px 2px #222; color: #FFF; font-weight: bold; line-height: 24px; white-space: nowrap; } .fancybox-title-outside-wrap { position: relative; margin-top: 10px; color: #fff; } .fancybox-title-inside-wrap { padding-top: 10px; } .fancybox-title-over-wrap { position: absolute; bottom: 0; left: 0; color: #fff; padding: 10px; background: #000; background: rgba(0, 0, 0, .8); } /*Retina graphics!*/ @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5){ #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span { background-image: url('../images/popup/fancybox_sprite@2x.png'); background-size: 44px 152px; /*The size of the normal image, half the size of the hi-res image*/ } #fancybox-loading div { background-image: url('../images/popup/fancybox_loading@2x.gif'); background-size: 24px 24px; /*The size of the normal image, half the size of the hi-res image*/ } } /* * Core Owl Carousel CSS File * v1.3.3 */ /* clearfix */ .owl-carousel .owl-wrapper:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } /* display none until init */ .owl-carousel{ display: none; position: relative; width: 100%; -ms-touch-action: pan-y; } .owl-carousel .owl-wrapper{ display: none; position: relative; -webkit-transform: translate3d(0px, 0px, 0px); } .owl-carousel .owl-wrapper-outer{ overflow: hidden; position: relative; width: 100%; } .owl-carousel .owl-wrapper-outer.autoHeight{ -webkit-transition: height 500ms ease-in-out; -moz-transition: height 500ms ease-in-out; -ms-transition: height 500ms ease-in-out; -o-transition: height 500ms ease-in-out; transition: height 500ms ease-in-out; } .owl-carousel .owl-item{ float: left; } .owl-controls .owl-page, .owl-controls .owl-buttons div{ cursor: pointer; } .owl-controls { -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } /* mouse grab icon */ .grabbing { cursor:url(grabbing.png) 8 8, move; } /* fix */ .owl-carousel .owl-wrapper, .owl-carousel .owl-item{ -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -webkit-transform: translate3d(0,0,0); -moz-transform: translate3d(0,0,0); -ms-transform: translate3d(0,0,0); } /* * Owl Carousel Owl Demo Theme * v1.3.3 */ .owl-theme .owl-controls{ text-align: left; } /* Styling Next and Prev buttons */ .owl-theme .owl-controls .owl-buttons div{ display:block; background: #000; width:20px; height:20px; } .owl-theme .owl-controls.clickable .owl-buttons div:hover{ background:#F00; } /* Styling Pagination*/ .owl-theme .owl-controls .owl-page{ display: inline-block; zoom: 1; *display: inline;/*IE7 life-saver */ } .owl-theme .owl-controls .owl-page span{ display: block; width: 12px; height: 12px; margin: 5px 7px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; background: #000; } .owl-theme .owl-controls .owl-page.active span, .owl-theme .owl-controls.clickable .owl-page:hover span{ background: #F00; } /* If PaginationNumbers is true */ .owl-theme .owl-controls .owl-page span.owl-numbers{ height: auto; width: auto; color: #FFF; padding: 2px 10px; font-size: 12px; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; } /* preloading images */ .owl-item.loading{ min-height: 150px; background: url(../images/AjaxLoader.gif) no-repeat center center; } /* * Owl Carousel CSS3 Transitions * v1.3.2 */ .owl-origin { -webkit-perspective: 1200px; -webkit-perspective-origin-x : 50%; -webkit-perspective-origin-y : 50%; -moz-perspective : 1200px; -moz-perspective-origin-x : 50%; -moz-perspective-origin-y : 50%; perspective : 1200px; } /* fade */ .owl-fade-out { z-index: 10; -webkit-animation: fadeOut .7s both ease; -moz-animation: fadeOut .7s both ease; animation: fadeOut .7s both ease; } .owl-fade-in { -webkit-animation: fadeIn .7s both ease; -moz-animation: fadeIn .7s both ease; animation: fadeIn .7s both ease; } /* backSlide */ .owl-backSlide-out { -webkit-animation: backSlideOut 1s both ease; -moz-animation: backSlideOut 1s both ease; animation: backSlideOut 1s both ease; } .owl-backSlide-in { -webkit-animation: backSlideIn 1s both ease; -moz-animation: backSlideIn 1s both ease; animation: backSlideIn 1s both ease; } /* goDown */ .owl-goDown-out { -webkit-animation: scaleToFade .7s ease both; -moz-animation: scaleToFade .7s ease both; animation: scaleToFade .7s ease both; } .owl-goDown-in { -webkit-animation: goDown .6s ease both; -moz-animation: goDown .6s ease both; animation: goDown .6s ease both; } /* scaleUp */ .owl-fadeUp-in { -webkit-animation: scaleUpFrom .5s ease both; -moz-animation: scaleUpFrom .5s ease both; animation: scaleUpFrom .5s ease both; } .owl-fadeUp-out { -webkit-animation: scaleUpTo .5s ease both; -moz-animation: scaleUpTo .5s ease both; animation: scaleUpTo .5s ease both; } /* Keyframes */ /*empty*/ @-webkit-keyframes empty { 0% {opacity: 1} } @-moz-keyframes empty { 0% {opacity: 1} } @keyframes empty { 0% {opacity: 1} } @-webkit-keyframes fadeIn { 0% { opacity:0; } 100% { opacity:1; } } @-moz-keyframes fadeIn { 0% { opacity:0; } 100% { opacity:1; } } @keyframes fadeIn { 0% { opacity:0; } 100% { opacity:1; } } @-webkit-keyframes fadeOut { 0% { opacity:1; } 100% { opacity:0; } } @-moz-keyframes fadeOut { 0% { opacity:1; } 100% { opacity:0; } } @keyframes fadeOut { 0% { opacity:1; } 100% { opacity:0; } } @-webkit-keyframes backSlideOut { 25% { opacity: .5; -webkit-transform: translateZ(-500px); } 75% { opacity: .5; -webkit-transform: translateZ(-500px) translateX(-200%); } 100% { opacity: .5; -webkit-transform: translateZ(-500px) translateX(-200%); } } @-moz-keyframes backSlideOut { 25% { opacity: .5; -moz-transform: translateZ(-500px); } 75% { opacity: .5; -moz-transform: translateZ(-500px) translateX(-200%); } 100% { opacity: .5; -moz-transform: translateZ(-500px) translateX(-200%); } } @keyframes backSlideOut { 25% { opacity: .5; transform: translateZ(-500px); } 75% { opacity: .5; transform: translateZ(-500px) translateX(-200%); } 100% { opacity: .5; transform: translateZ(-500px) translateX(-200%); } } @-webkit-keyframes backSlideIn { 0%, 25% { opacity: .5; -webkit-transform: translateZ(-500px) translateX(200%); } 75% { opacity: .5; -webkit-transform: translateZ(-500px); } 100% { opacity: 1; -webkit-transform: translateZ(0) translateX(0); } } @-moz-keyframes backSlideIn { 0%, 25% { opacity: .5; -moz-transform: translateZ(-500px) translateX(200%); } 75% { opacity: .5; -moz-transform: translateZ(-500px); } 100% { opacity: 1; -moz-transform: translateZ(0) translateX(0); } } @keyframes backSlideIn { 0%, 25% { opacity: .5; transform: translateZ(-500px) translateX(200%); } 75% { opacity: .5; transform: translateZ(-500px); } 100% { opacity: 1; transform: translateZ(0) translateX(0); } } @-webkit-keyframes scaleToFade { to { opacity: 0; -webkit-transform: scale(.8); } } @-moz-keyframes scaleToFade { to { opacity: 0; -moz-transform: scale(.8); } } @keyframes scaleToFade { to { opacity: 0; transform: scale(.8); } } @-webkit-keyframes goDown { from { -webkit-transform: translateY(-100%); } } @-moz-keyframes goDown { from { -moz-transform: translateY(-100%); } } @keyframes goDown { from { transform: translateY(-100%); } } @-webkit-keyframes scaleUpFrom { from { opacity: 0; -webkit-transform: scale(1.5); } } @-moz-keyframes scaleUpFrom { from { opacity: 0; -moz-transform: scale(1.5); } } @keyframes scaleUpFrom { from { opacity: 0; transform: scale(1.5); } } @-webkit-keyframes scaleUpTo { to { opacity: 0; -webkit-transform: scale(1.5); } } @-moz-keyframes scaleUpTo { to { opacity: 0; -moz-transform: scale(1.5); } } @keyframes scaleUpTo { to { opacity: 0; transform: scale(1.5); } } @charset "utf-8"; /* CSS Document */ * { margin:0; padding:0; box-sizing: border-box; } *:before, *:after { box-sizing: border-box; } :before, :after { box-sizing: border-box; } html { font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; } body { margin:0; padding:0; color:#7d7d7d; font-size:14px; font-family: 'Roboto', sans-serif; background:#f8f8f8; } :focus { outline:none; } ul, li, ol { list-style:none; } a { text-decoration:none; background-color: transparent; color:inherit; -webkit-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; } a:active, a:hover { outline: 0; } a img, img { border:none; vertical-align:middle; max-width: 100%; height: auto; } h1, h2, h3, h4, h5, h6 { font-weight:normal; } article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; } button, input, optgroup, select, textarea { margin: 0; font: inherit; color: inherit; } button { overflow: visible; } button, select { text-transform: none; } button::-moz-focus-inner, input::-moz-focus-inner { padding: 0; border: 0; } input { line-height: normal; } button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; border:none; -webkit-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; } button::-moz-focus-inner, input::-moz-focus-inner { padding: 0; border: 0; -webkit-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; } input[type="checkbox"], input[type="radio"] { padding: 0; box-sizing: border-box; } input[type="search"], input[type="text"], input[type="email"], input[type="password"], textarea { padding:0 10px; border:1px solid #ccc; -webkit-appearance: textfield; box-sizing: border-box; } textarea { padding:10px; resize:none; overflow: auto; } table { border-spacing: 0; border-collapse: collapse; } td, th { padding: 0; } input[type="search"]:focus, input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus, textarea:focus { } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } .relative { position:relative; } @-webkit-keyframes menuDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); transform: translateY(-20px);} 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0);} } @keyframes menuDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px);} 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0);} } .menuDown { -webkit-animation-name: menuDown; animation-name: menuDown;} @-webkit-keyframes menuRight { 0% { opacity: 0; -webkit-transform: translateX(20px); transform: translateX(20px);} 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0);} } @keyframes menuRight { 0% { opacity: 0; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px);} 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0);} } .menuRight { -webkit-animation-name: menuRight; animation-name: menuRight;} input:focus::-webkit-input-placeholder { color:transparent; } input:focus:-moz-placeholder { color:transparent; } /* FF 4-18 */ input:focus::-moz-placeholder { color:transparent; } /* FF 19+ */ input:focus:-ms-input-placeholder { color:transparent; } /* IE 10+ */ #top { display:none; position:fixed; cursor:pointer; bottom:60px; right:10px; font-size:0; background:#e12626 url("../images/to-top-arrow.png") no-repeat scroll center center; border-radius: 2px; line-height:40px; -webkit-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; width:45px; height:40px; z-index:99; } #top:hover { background-color:#c71a1a;} .menu-icon { display:none; background-color:transparent; } .menu-icon span { display:block; background-color:#e12626; height:3px; width:25px; -webkit-border-radius:1px; -moz-border-radius:1px; border-radius:1px; } .menu-icon span + span { margin-top:2px; } .clearfix {} .clearfix:before, .clearfix:after { display:table; content:""; } .clearfix:after { clear:both; } .container { width:1120px; margin:0 auto; } .container:before, .container:after { display:table; content:" "; } .container:after { clear:both; } #cookie { background:rgba(0,0,0,0.5); position:fixed; left:0; top:0; right:0; bottom:0; z-index:9999;} #cookie .detail { background:#e12626; padding:30px 0;} #cookie .detail .head { float:left; width:180px; font-weight:600; font-size:18px; color:#ffffff;} #cookie .detail .txt { overflow:hidden; font-size:14px; color:#fff; line-height:20px; max-width:669px; text-align:justify;} #cookie .detail .txt a { text-decoration:underline; font-weight:500;} #cookie .detail .close { position:absolute; right:0; top:0;} #cookie .detail .close a { display:block; width:30px; height:30px; background:url(../images/close.png) no-repeat 0 0;} #cookie .detail .close a:hover { background-position:0 100%;} #header { background:#fff; position:relative; z-index:99; } #header .header {} #header .header .logo { float:left; padding:25px 0 22px 0;} #header .header .right { float:right; text-align:right;} #header .header .right .top { padding:12px 0 0 0;} #header .header .right .top a { display:inline-block; margin:0 -2px; font-size:13px; color:#7d7d7d; padding:0 0 0 23px; line-height:15px;} #header .header .right .top a + a { margin-left:13px;} #header .header .right .top a.abt-icon { background:url(../images/abt-icon.png) no-repeat 0 0;} #header .header .right .top a.abt-icon:hover { background:url(../images/abt-icon.png) no-repeat 0 100%; color:#757575;} #header .header .right .top a.login { background:url(../images/login_icon.png) no-repeat 0 0;} #header .header .right .top a.login:hover { background:url(../images/login_icon.png) no-repeat 0 100%; color:#757575;} #header .header .right .top a.logout { padding-left:0; border-left:1px solid #C5C5C5; padding-left:7px; margin-left:5px;} #header .header .right .top a.wishlist { background:url(../images/wishlist_icon.png) no-repeat 0 1px;} #header .header .right .top a.wishlist:hover { background:url(../images/wishlist_icon.png) no-repeat 0 100%; color:#757575;} #header .header .right .bottom { padding:14px 0 0 0; text-align:right;} #header .header .right .bottom > div { display:inline-block; margin:0 -2px; text-align:left;} #header .header .right .bottom .phone { padding:0 0 0 40px; line-height:40px; font-weight:500; color:#e12626; background:url(../images/phone_icon.png) no-repeat left center; font-size:16px;} #header .header .right .bottom .search { position:relative; width:250px; margin:0 18px 0 28px;} #header .header .right .bottom .search .inpt_bx { border:1px solid #e5e5e5; padding:0 68px 0 12px; width:100%; height:40px; font-size:13px; color:#7d7d7d;} #header .header .right .bottom .search .sbt { position:absolute; right:1px; top:1px; background:url(../images/search_icon.png) no-repeat center center #e12626; width:38px; height:38px; border-left:1px solid #e5e5e5;} #header .header .right .bottom .search .sbt:hover { background-color:#c71a1a;} #header .header .right .bottom .cart { border:1px solid #e5e5e5; width:204px; padding-left:39px; position:relative;} #header .header .right .bottom .cart a.basket { display:block; width:100%; background:#e12626; text-align:center; font-weight:500; color:#fff; font-size:13px; text-transform:uppercase; line-height:38px; position:relative;} #header .header .right .bottom .cart a.basket:hover { background:#c71a1a;} #header .header .right .bottom .cart a.basket:after { width:38px; height:38px; background:url(../images/cart_icon.png) no-repeat center center; border-right:1px solid #e5e5e5; position:absolute; left:-38px; top:0; content:" "; background-position:0 0; -webkit-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out;} #header .header .right .bottom .cart a.basket:hover:after { background-position:0 100%;} .cart .cart_detail { width:314px; position:absolute; top:100%; right:0; background:#fff; box-shadow:10px 10px 10px rgba(0,0,0,0.5); z-index:999; margin-top:1px; display:none; -webkit-animation: menuDown .3s ease-in; -moz-animation: menuDown .3s ease-in; animation:menuDown .3s ease-in;} @media (min-width: 993px) { .cart:hover .cart_detail { display:block;} } .cart .cart_detail .empty { padding:47px 0 30px; text-align:center;} .cart .cart_detail .empty p { font-size:13px; color:#7d7d7d; padding-top:15px;} .cart .cart_detail .item_added { padding:15px 0 0 0; text-align:left;} .cart .cart_detail .item_added .pdts { max-height:288px; overflow-y:auto;} .cart .cart_detail .item_added .pdts .box { border-bottom:1px solid #e5e5e5; padding:10px;} .cart .cart_detail .item_added .pdts .box .img { float:left;} .cart .cart_detail .item_added .pdts .box .img a { display:block; background:#f3f3f3; width:75px; line-height:75px; text-align:center;} .cart .cart_detail .item_added .pdts .box .img a img { line-height:75px;} .cart .cart_detail .item_added .pdts .box .pdt_detail { overflow:hidden; padding-left:12px; max-width:177px;} .cart .cart_detail .item_added .pdts .box .pdt_detail .pdt_name { font-size:13px; color:#e12626; line-height:18px; padding-bottom:4px;} .cart .cart_detail .item_added .pdts .box .pdt_detail .pdt_qty {} .cart .cart_detail .item_added .pdts .box .pdt_detail .pdt_qty span { display:block; float:left; line-height:20px; font-size:13px; color:#353535;} .cart .cart_detail .item_added .pdts .box .pdt_detail .pdt_qty a.remove { width:20px; height:20px; background:url(../images/remove_icon.png) no-repeat; float:right; border-radius:2px;} .cart .cart_detail .item_added .pdts .box .pdt_detail .pdt_qty a.remove:hover { background-position:0 100%;} .cart .cart_detail .item_added .sub_detail { padding:20px 10px 15px;} .cart .cart_detail .item_added .sub_detail .total { margin-bottom:20px;} .cart .cart_detail .item_added .sub_detail .total span { display:block; float:left; text-align:center; font-weight:500; font-size:14px; color:#353535; border:1px solid #e5e5e5; line-height:33px; width:50%;} .cart .cart_detail .item_added .sub_detail .total span + span { border-left:1px solid #e5e5e5;} .cart .cart_detail .item_added .sub_detail .btns {} .cart .cart_detail .item_added .sub_detail .btns a { width:135px; line-height:30px; text-align:center; font-weight:500; font-size:13px; color:#fff; text-transform:uppercase; display:block; float:left;} .cart .cart_detail .item_added .sub_detail .btns a.checkout { background:#353535;} .cart .cart_detail .item_added .sub_detail .btns a.checkout:hover { background:#141414;} .cart .cart_detail .item_added .sub_detail .btns a.view_cart { background:#e12626; float:right;} .cart .cart_detail .item_added .sub_detail .btns a.view_cart:hover { background:#c71a1a; } .cart .cart_detail .item_added .sub_detail .btns a img { margin-right:10px;} #header .menu { border-bottom:3px solid #e12626; } #nav { border:1px solid #e5e5e5; border-bottom:none; position:relative; padding:0 15px 0 54px; background:#f8f8f8;} #nav .search { position:relative; width:100%; margin:0 0 10px 0; display:none;} #nav .search .inpt_bx { border:1px solid #e5e5e5; padding:0 68px 0 12px; width:100%; height:40px; font-size:13px; color:#7d7d7d;} #nav .search .sbt { position:absolute; right:1px; top:1px; background:url(../images/search_icon.png) no-repeat center center #e12626; width:38px; height:38px; border-left:1px solid #e5e5e5;} #nav .search .sbt:hover { background-color:#c71a1a;} #nav > ul { text-align:right;} #nav > ul > li { display:inline-block; vertical-align:top; } #nav > ul > li + li { border-left:1px solid #e5e5e5;} #nav > ul > li > a { display:block; position:relative; padding:17px 20px 19px; font-weight:500; font-size:13px; color:#353535; text-transform:uppercase; -webkit-transition: all 0s ease-in-out; transition: all 0s ease-in-out;} #nav > ul > li.hide { display:none;} #nav > ul > li.submenu > a:before { border-left: 5px solid transparent; border-right: 5px solid transparent; -webkit-transform:translateX(-50%) rotate(180deg); -moz-transform:translateX(-50%) rotate(180deg); -ms-transform:translateX(-50%) rotate(180deg); -o-transform:translateX(-50%) rotate(180deg); transform:translateX(-50%) rotate(180deg); content: ""; position: absolute; left: 50%; bottom:0; top:0; } #nav > ul > li.submenu:hover > a:before { display:block; border-top: 5px solid #e12626; } #nav > ul > li:hover > a { color:#F00;} #nav > ul > li.cart { display:none;} #nav > ul > li.cart > a { display:block; width:54px; height:54px; background:url(../images/cart_icon_1.png) no-repeat center center; background-position:center 0;} #nav > ul > li.cart > a:hover { background-position:center 100%;} #nav > ul > li.cart .cart_detail { margin-top:0; border-top:3px solid #e12626;} #nav > ul > li:nth-child(2) { border:none;} #nav > ul > li:nth-child(3) { border:none;} #nav > ul > li.home { position:absolute; left:0; top:0;} #nav > ul > li.home a { display:block; background:url(../images/home_icon.png) no-repeat center center #e12626; width:54px; height:54px;} #nav > ul > li.home a:hover { background-color:#c71a1a;} @media (min-width: 993px) { #nav > ul > li .mega_menu { position:absolute; left:-1px; right:-1px; top:100%; background:#fff; z-index:999; border-top:3px solid #e12626; visibility: hidden; opacity: 0;} #nav > ul > li:hover .mega_menu { opacity: 1; visibility: visible; z-index: 1;} } #nav > ul > li .mega_menu:after { width:100%; height:16px; bottom:-16px; width:100%; left:0; position:absolute; background:url(../images/menu_gradiant.png) repeat-x; content:" ";} #nav > ul > li .mega_menu .inner { border:1px solid #d7d7d7; border-top:none; min-height:320px; padding:24px 20px; text-align:left;} #nav > ul > li .mega_menu .inner .link_box { width:80%; float:left;} #nav > ul > li .mega_menu .inner .link_box .box { width:20%; float:left; padding-right:10px; margin-bottom:20px;} #nav > ul > li .mega_menu .inner .link_box .box h2 { font-weight:500; font-size:13px; color:#353535; text-transform:uppercase; padding-bottom:14px; position:relative; margin-bottom:18px;} #nav > ul > li .mega_menu .inner .link_box .box h2 a:hover { color:#000;} #nav > ul > li .mega_menu .inner .link_box .box h2:after { width:25px; height:1px; background:#e12626; position:absolute; left:0; bottom:0; content:" ";} #nav > ul > li .mega_menu .inner .link_box .box h2 a { display:inline-block;} #nav > ul > li .mega_menu .inner .link_box .box h2 span { display:none;} #nav > ul > li .mega_menu .inner .link_box .box ul {} #nav > ul > li .mega_menu .inner .link_box .box ul li {} #nav > ul > li .mega_menu .inner .link_box .box ul li + li { margin-top:13px;} #nav > ul > li .mega_menu .inner .link_box .box ul li a { display:block; font-size:13px; color:#7d7d7d; transition:all 0.5s ease 0s; -webkit-transition:all 0.5s ease 0s; font-weight:400; } #nav > ul > li .mega_menu .inner .link_box .box ul li a:hover { color:#e12626; padding-left:10px;} #nav > ul > li .mega_menu .inner .brands { background:url(../images/shadow.png) no-repeat left center; padding-left:50px; min-height:259px; width:200px; float:right;} #nav > ul > li .mega_menu .inner .brands h2 { font-weight:500; font-size:13px; color:#353535; text-transform:uppercase; padding-bottom:14px; position:relative; margin-bottom:18px;} #nav > ul > li .mega_menu .inner .brands h2:after { width:25px; height:1px; background:#e12626; position:absolute; left:0; bottom:0; content:" ";} #nav > ul > li .mega_menu .inner .brands h2 a {} #nav > ul > li .mega_menu .inner .brands h2 a:hover { color:#000;} #nav > ul > li .mega_menu .inner .brands h2 span { display:none;} #nav > ul > li .mega_menu .inner .brands ul {} #nav > ul > li .mega_menu .inner .brands ul li {} #nav > ul > li .mega_menu .inner .brands ul li + li { margin-top:13px;} #nav > ul > li .mega_menu .inner .brands ul li a { display:block; font-size:13px; color:#7d7d7d; transition:all 0.5s ease 0s; -webkit-transition:all 0.5s ease 0s; font-weight:400; text-transform:uppercase; } #nav > ul > li .mega_menu .inner .brands ul li a:hover { color:#e12626; padding-left:10px;} #nav > ul > li .mega_menu .inner .brands .new_arrivals { padding:32px 0 0 0;} #nav > ul > li .mega_menu .inner .brands .new_arrivals a { font-size:13px; color:#e12626; text-transform:uppercase; font-weight:500;} #nav > ul > li .mega_menu .inner .brands .new_arrivals a:hover { color:#991a1a;} #header .menu.sticky { position:fixed; left:0; right:0; z-index:999; background:#fff;} #header .menu.sticky #nav { padding-right:0;} #header .menu.sticky #nav > ul > li > a { padding:18px 16px; -webkit-transition: all 0s ease-in-out; transition: all 0s ease-in-out;} #header .menu.sticky #nav > ul > li.cart { display:inline-block;} #sucess { text-align:center; margin-top:20px;} #sucess .data { background:#dff0d8; border:1px solid #c3e3b6; padding:9px 0;} #sucess .data p { display:inline-block; padding:0 80px 0 25px; line-height:20px; background:url(../images/sucess.png) no-repeat left 2px; position:relative; text-align:left;} #sucess .data p i { font-style:normal;} #sucess .data p span { font-weight:500; font-size:14px; color:#31870e;} #sucess .data p span a:hover { color:#e12626;} #sucess .data p b { font-weight:normal;} #sucess .data p a.close { display:block; width:20px; height:20px; background:url(../images/delete.png) no-repeat 0 0; position:absolute; right:0; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); -o-transform:translateY(-50%);} #sucess .data p a.close:hover { background-position:0 100%;} #banner { padding:20px 0;} #banner .owl-buttons { display:none;} #main_banner:hover .owl-buttons { display:block;} #banner .owl-prev { width:50px; height:50px; background:url(../images/prev.png) no-repeat; position:absolute; left:30px; top:50%; margin-top:-25px; content:" ";} #banner .owl-next { width:50px; height:50px; background:url(../images/next.png) no-repeat; position:absolute; right:30px; top:50%; margin-top:-25px; content:" ";} #content { margin:0; padding:0; position:relative; z-index:9;} .mr_bot { margin-bottom:30px;} .new_product { border:1px solid #e5e5e5; background:#fff;} .new_product h2 { border-bottom:1px solid #e5e5e5; padding:7px 25px 9px; text-transform:uppercase; font-weight:300; font-size:26px; color:#7d7d7d;} .new_product h2 span { font-weight:700; color:#e12626;} .new_product .np { padding:20px 7px;} .new_product .np .item { padding:0 13px;} .new_product .np .owl-prev, .new_product .np .owl-next { background:url(../images/np_arrow.png) no-repeat !important; width:28px !important; height:28px !important; -webkit-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out;} .new_product .np .owl-prev { background-position:-28px 0 !important; position:absolute; top:-41px; right:52px;} .new_product .np .owl-next { background-position:-58px 0 !important; position:absolute; top:-41px; right:22px;} .new_product .np .owl-prev:hover { background-position:0 0 !important; } .new_product .np .owl-next:hover { background-position:-86px 0 !important; } /* Product box */ .product_box { position:relative;} .product_box .img { position:relative;} .product_box .img { display:block; background:#f3f3f3; border:1px solid #e5e5e5; padding:5px; text-align:center; line-height:183px; position:relative; overflow:hidden;} .product_box .img img { -webkit-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out;} .product_box .img:hover img { transform:scale(1.2);} .product_box .img .box-hover { float:right; text-align:right; position:absolute; left:0; top:0; right:0; bottom:0; background:rgba(255,255,255,0.8); visibility:hidden; opacity:0; -webkit-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; } .product_box .img:hover .box-hover { visibility:visible; opacity:1;} .product_box .img .box-hover ul.add-to-links { top:50%; margin-top:-31px; position:absolute; right:-100%;} .product_box .img:hover .box-hover ul.add-to-links { right:0;} .product_box .img .box-hover ul.add-to-links li {} .product_box .img .box-hover ul.add-to-links li + li { margin-top:2px;} .product_box .img .box-hover ul.add-to-links li a { line-height:30px; height:30px; padding-right:30px; display:block; color:#fff; font-size:12px; text-transform:uppercase; position:relative; font-size:0; -webkit-transition: width 2s; /* Safari */ transition: width 2s;} .product_box .img .box-hover ul.add-to-links li a.link-quickview:hover { background:#e12626; font-size:12px; padding-left:10px; padding-right:40px;} .product_box .img .box-hover ul.add-to-links li a.link-quickview:after { width:30px; height:30px; background:url(../images/search_icon_1.png) no-repeat center center; position:absolute; right:0; top:0; content:" "; background-color:#404040; } .product_box .img .box-hover ul.add-to-links li a.link-quickview:hover:after { background-color:#c71a1a;} .product_box .img .box-hover ul.add-to-links li a.link-wishlist:hover { background:#e12626; font-size:12px; padding-left:10px; padding-right:40px;} .product_box .img .box-hover ul.add-to-links li a.link-wishlist:after { width:30px; height:30px; background:url(../images/wishlist_icon_1.png) no-repeat center center; position:absolute; right:0; top:0; content:" "; background-color:#404040; } .product_box .img .box-hover ul.add-to-links li a.link-wishlist:hover:after { background-color:#c71a1a;} .product_box .new { width:72px; background:#e12626; text-align:center; font-size:11px; color:#fff; text-transform:uppercase; position:absolute; right:0; top:0; content:" "; padding:0 0; -webkit-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; line-height:25px;} .product_box .pdt_detail { text-align:center;} .product_box .pdt_detail .pdt_name { font-size:14px; color:#353535; line-height:20px; padding:12px 2px 14px; } .product_box .pdt_detail .pdt_name.db { min-height:66px;} .product_box .pdt_detail .pdt_price { font-weight:700; font-size:16px; color:#000000; padding-bottom:15px;} .product_box .pdt_detail .pdt_price span { color:#7d7d7d; text-decoration:line-through; padding-left:20px;} .product_box .pdt_detail .add_to_cart {} .product_box .pdt_detail .add_to_cart a { display:inline-block; margin:0 -2px; border:1px solid #d1d1d1; padding:7px 15px 6px; font-size:12px; color:#353535; text-transform:uppercase;} .product_box:hover .pdt_detail .pdt_name { color:#e12626;} .product_box:hover .pdt_detail .add_to_cart a { background:#e12626; border-color:#e12626; color:#fff;} /* Product box */ .best_seller { border:1px solid #e5e5e5; background:#fff;} .best_seller .left { width:222px; float:left;} .best_seller .left .block-title { background:#e12626; padding:24px 18px; font-weight:300; font-size:26px; color:#fff; text-transform:uppercase;} .best_seller .left .block-title span { font-weight:700; display:block; line-height:30px;} .best_seller .left .txt { padding:27px 18px;} .best_seller .left .txt p { line-height:24px; font-size:14px; color:#7d7d7d; padding-bottom:25px;} .best_seller .left .txt a { display:inline-block; padding:7px 17px; border:1px solid #ccc; font-size:12px; color:#353535; text-transform:uppercase;} .best_seller .left .txt a:hover { background:#e12626; color:#fff; border-color:#e12626; border-bottom:1px solid #ccc;} .best_seller .right { width:896px; float:right; border-left:1px solid #e5e5e5; padding:20px 5px;} .best_seller .right .item { padding:0 13px;} #best_seller .owl-prev, #best_seller .owl-next { width:10px; height:22px; background:url(../images/bs_arrow.png) no-repeat; opacity:0.5; -webkit-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out;} #best_seller .owl-prev:hover, #best_seller .owl-next:hover { opacity:1;} #best_seller .owl-prev { position:absolute; left:-66px; top:23px; } #best_seller .owl-next { position:absolute; left:-36px; top:23px; background-position:-30px 0; } .clearance { border:1px solid #e5e5e5; background:#fff;} .clearance .right { width:222px; float:right;} .clearance .right .block-title { background:#1f8ceb; padding:40px 18px; font-weight:300; font-size:26px; color:#fff; text-transform:uppercase;} .clearance .right .block-title span { font-weight:700; display:block; line-height:30px;} .clearance .right .txt { padding:27px 18px;} .clearance .right .txt p { line-height:24px; font-size:14px; color:#7d7d7d; padding-bottom:25px;} .clearance .right .txt a { display:inline-block; padding:7px 17px; border:1px solid #ccc; font-size:12px; color:#353535; text-transform:uppercase;} .clearance .right .txt a:hover { background:#e12626; color:#fff; border-color:#e12626; border-bottom:1px solid #ccc;} .clearance .left { width:896px; float:left; border-right:1px solid #e5e5e5; padding:20px 5px;} .clearance .left .item { padding:0 13px;} #clearance .owl-prev, #clearance .owl-next { width:10px; height:22px; background:url(../images/bs_arrow.png) no-repeat; opacity:0.5; -webkit-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out;} #clearance .owl-prev:hover, #clearance .owl-next:hover { opacity:1;} #clearance .owl-prev { position:absolute; right:-190px; top:25px; } #clearance .owl-next { position:absolute; right:-220px; top:25px; background-position:-30px 0; } .brand { border:1px solid #e5e5e5; background:#fff;} .brand .item { padding:20px 30px;} .brand .item a { display:block; width:175px; line-height:125px; text-align:center;} .glance { border:1px solid #e5e5e5; position:relative; background:#fff;} .glance .left { float:left; width:25%; position:absolute; left:0; top:0; height:100%; background:#e12626; text-transform:uppercase;} .glance .left span { display:block; text-align:center; font-weight:300; font-size:26px; color:#fff; position:absolute; top:50%; left:0; right:0; transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -o-transform:translateY(-50%); -ms-transform:translateY(-50%);} .glance .right { float:right; padding:30px; width:75%;} .glance .right p { font-size:14px; color:#7d7d7d; line-height:20px; text-align:justify;} .glance .right p + p { margin-top:20px;} .three_box { margin-left:-30px; margin-top:50px;} .three_box .box { width:353px; background:#fff; float:left; margin-left:30px; border:1px solid #e5e5e5; padding:30px 0;} .three_box .box .img { float:left; width:120px; text-align:right; line-height:70px;} .three_box .box .img img { margin-right:25px;} .three_box .box .detail { overflow:hidden; padding-right:15px;} .three_box .box .detail h6 { font-weight:700; font-size:14px; color:#e12626; text-transform:uppercase; padding-bottom:7px;} .three_box .box .detail p { font-size:14px; color:#7d7d7d; line-height:20px;} #footer { background:#000; border-top:5px solid #e12626; margin-top:30px;} #footer .top { border-bottom:1px solid #262626; padding:30px 0 40px;} #footer .top .left { float:left;} #footer .top .left .box { float:left;} #footer .top .left .box_1 { width:207px;} #footer .top .left .box_2 { width:190px;} #footer .top .left .box_3 { width:100px;} #footer .top .left .box h3 { font-size:16px; color:#fff; text-transform:uppercase; padding-bottom:22px;} #footer .top .left .box ul {} #footer .top .left .box ul li {} #footer .top .left .box ul li + li { margin-top:13px;} #footer .top .left .box ul li a { display:block; font-size:13px; color:#7d7d7d; padding:0 0 0 16px; background:url(../images/link_arrow.png) no-repeat 0 4px;} #footer .top .left .box ul li a:hover { color:#e12626;} #footer .top .right { float:right; width:395px;} #footer .top .right h3 { font-size:16px; color:#fff; text-transform:uppercase; padding-bottom:30px;} #footer .top .right .subscribe {} #footer .top .right .subscribe .inpt_bx { float:left; width:265px; height:40px; background:#fff; border:none; padding:0 10px; font-size:13px; color:#7d7d7d;} #footer .top .right .subscribe .sbt { float:right; padding:0 13px 0 40px; height:40px; background:url(../images/sub_icon.png) no-repeat 13px center #e12626; font-weight:500; font-size:13px; color:#fff; text-transform:uppercase;} #footer .top .right .subscribe .sbt:hover { background-color:#c71a1a;} #footer .top .right .payment { margin-top:30px;} #footer .bottom { padding:17px 0;} #footer .bottom .left { float:left; line-height:30px;} #footer .bottom .left p { float:left;} #footer .bottom .left .social { float:left; margin-left:25px;} #footer .bottom .left .social a { display:block; float:left; background:url(../images/social.png) no-repeat; width:30px; height:30px; border-radius:50%;} #footer .bottom .left .social a + a { margin-left:10px;} #footer .bottom .left .social a.fb { background-position:0 -30px;} #footer .bottom .left .social a.tw { background-position:-40px -30px;} #footer .bottom .left .social a.fb:hover { background-position:0 0;} #footer .bottom .left .social a.tw:hover { background-position:-40px 0;} #footer .bottom .right { float:right;} #footer .bottom .right a { margin:4px 0; display:block; line-height:23px; padding-right:35px; background:url(../images/wm_icon.png) no-repeat right center; font-size:13px; color:#7d7d7d;} #footer .bottom .right a:hover { color:#a7a7a7;} /* Product Listing */ .bread_cum { padding:16px 0 17px;} .bread_cum ul { float:left;} .bread_cum ul li { font-size:13px; color:#353535; display:block; float:left; position:relative; padding-right:11px; margin-bottom:5px;} .bread_cum ul li + li { padding-left:16px;} .bread_cum ul li + li:before { width:5px; height:100%; content:" "; background:url(../images/brad_arrow.png) no-repeat left center; position:absolute; left:0; top:0;} .bread_cum ul li a { color:#7d7d7d; display:block;} .bread_cum ul li a:hover { color:#f00;} .bread_cum .back { float:right;} .bread_cum .back a { display:block; padding:0 0 0 10px; font-size:13px; color:#353535; background:url(../images/back_arrow.png) no-repeat left center;} .bread_cum .back a:hover { padding-left:15px; color:#e12626;} .pdt_listing {} .pdt_listing .sidebar { width:240px; float:left; margin-right:30px;} .pdt_listing .sidebar .filter_icon { width:100%; cursor:pointer; display:none; height:30px; margin-bottom:20px; padding:0 10px 0 10px; line-height:30px; text-transform:uppercase; background:#e12626; -webkit-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;} .pdt_listing .sidebar .filter_icon span { display:block; background:url(../images/filter_icon.png) no-repeat right center ; background-size:15px auto; color:#fff;} .pdt_listing .sidebar .filter_icon:hover { background:#c71a1a;} .pdt_listing .sidebar .filter_content { } .pdt_listing .sidebar .box { border:1px solid #e5e5e5; margin-bottom:20px; background:#fff;} .pdt_listing .sidebar .box .title { font-weight:700; font-size:13px; color:#353535; text-transform:uppercase; padding:11px 10px; border-bottom:1px solid #e5e5e5; position:relative;} .pdt_listing .sidebar .box .title .reload { width:14px; height:14px; background:url(../images/reload.png) no-repeat ; position:absolute; right:10px; top:15px;} .pdt_listing .sidebar .box .title .reload:hover { transform:rotate(360deg); -webkit-transform:rotate(360deg); -moz-transform:rotate(360deg); -o-transform:rotate(360deg); -ms-transform:rotate(360deg);} .pdt_listing .sidebar .partners { padding:15px 11px;} .pdt_listing .sidebar .partners > ul {} .pdt_listing .sidebar .partners > ul > li { position:relative; padding-right:12px;} .pdt_listing .sidebar .partners > ul > li + li { margin-top:12px;} .pdt_listing .sidebar .partners > ul > li > a { display:block; padding:0 0 0 15px; font-weight:700; font-size:13px; color:#353535; text-transform:uppercase; background:url(../images/listing_arrow.png) no-repeat 0 -15px; position:relative;} .pdt_listing .sidebar .partners > ul > li > a:hover { color:#e12626; background:url(../images/listing_arrow.png) no-repeat 0 4px;} .pdt_listing .sidebar .partners > ul > li.open > a { color:#e12626; background:url(../images/listing_arrow.png) no-repeat 0 4px; } .pdt_listing .sidebar .partners > ul > li span { display:none;} .pdt_listing .sidebar .partners > ul > li.submenu > span { display:block; width:10px; height:10px; position:absolute; right:0; top:3px; content:" "; background:url(../images/p_plus.png) no-repeat; cursor:pointer;} .pdt_listing .sidebar .partners > ul > li.submenu.open > span { background:url(../images/p_minus.png) no-repeat;} .pdt_listing .sidebar .partners > ul > li > ul { padding:10px 0 5px 15px; display:none;} .pdt_listing .sidebar .partners > ul > li > ul li {} .pdt_listing .sidebar .partners > ul > li > ul li + li { margin-top:10px;} .pdt_listing .sidebar .partners > ul > li > ul li .ch_label { font-size:13px; color:#7d7d7d; text-transform:none; font-weight:400; padding-left:26px; position:relative;} .pdt_listing .sidebar .partners > ul > li > ul li .ch_label .checkbox { position:absolute; left:0; top:0;} .pdt_listing .sidebar .brands { padding:10px 11px;} .pdt_listing .sidebar .brands ul {} .pdt_listing .sidebar .brands ul li {} .pdt_listing .sidebar .brands ul li + li { margin-top:13px;} .pdt_listing .sidebar .range { padding:0 11px;} .pdt_listing .sidebar .range .irs-line { background:#d1d1d1; height:13px;} .pdt_listing .sidebar .range .irs-from { font-weight:500; font-size:13px; color:#353535;} .pdt_listing .sidebar .range .irs-to { font-weight:500; font-size:13px; color:#353535;} .pdt_listing .sidebar .range .irs-slider { background:#e12626; width:15px; height:15px; top:24px;} .pdt_listing .listing { overflow:hidden; } .pdt_listing .listing .product_banner {} .pdt_listing .listing .middle { padding:20px 0;} .pdt_listing .listing .middle .left { float:left; line-height:30px; font-size:16px; color:#353535;} .pdt_listing .listing .middle .left span { color:#e12626; text-transform:uppercase; font-weight:500;} .pdt_listing .listing .middle .right { float:right; } .pdt_listing .listing .middle .right .sort .fancy-select { width:120px; background:#fff;} .pdt_listing .listing .middle .right .sort .fancy-select div.trigger:after { height:30px;} .pdt_listing .listing .pdts { border:1px solid #e5e5e5; background:#fff; padding:30px 24px;} .pdt_listing .listing .pdts .boxes { margin-left:-25px;} .pdt_listing .listing .pdts .boxes .box { width:250px; float:left; margin-left:25px; margin-bottom:30px;} .pdt_listing .listing .pdts .load_more { text-align:center; padding:10px 0 0 0;} .pdt_listing .listing .pdts .load_more a { display:inline-block; background:#acacac; line-height:35px; width:100px; text-align:center; font-weight:500; font-size:12px; color:#fff;} .pdt_listing .listing .pdts .load_more a:hover { background:#e12626;} /* Product Listing */ /* Product Detail */ .product_detail { border:1px solid #e5e5e5; padding:30px; background:#fff;} .product_detail .left { float:left; width:500px; position:relative;} .product_detail .left .new { width:72px; background:#e12626; text-align:center; font-size:11px; color:#fff; text-transform:uppercase; position:absolute; right:0; top:0; content:" "; padding:0 0; -webkit-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; line-height:25px; z-index:999;} .product_detail .left .MagicZoom { border:1px solid #e5e5e5; background:#f3f3f3; margin-bottom:10px; width:100%;} .product_detail .left .MagicZoom figure { width:100%;} .product_detail .left .MagicZoom figure > img { max-width:100% !important; max-height:100% !important;} .product_detail .left .zoomer_thumb { margin-left:-10px;} .product_detail .left .mz-thumb { width:75px; line-height:75px; border:1px solid #e5e5e5; margin:0 0 0 10px; display:block; float:left;} .product_detail .left .mz-thumb img { filter: brightness(100%); box-shadow:none; } .product_detail .left .mz-thumb-selected { border:1px solid #c71a1a;} .product_detail .left .mz-thumb:hover:not(.mz-thumb-selected) img { filter: brightness(100%);} .product_detail .right { width:520px; float:right;} .product_detail .right .row_1 { padding-bottom:30px; background:url(../images/gradiant_1.png) no-repeat center bottom;} .product_detail .right .row_1 .code { float:left; font-size:12px; color:#757575; line-height:50px;} .product_detail .right .row_1 .code span { font-weight:500; font-size:14px;} .product_detail .right .row_1 .b_img { float:right;} .product_detail .right .row_2 { font-weight:500; font-size:20px; color:#353535; line-height:20px; padding:17px 0 30px 0; border-bottom:1px solid #e5e5e5; } .product_detail .right .row_3 { border-bottom:1px solid #e5e5e5; padding:20px 0; font-weight:500; font-size:20px; color:#000000; vertical-align:top; } .product_detail .right .row_3 i { font-style:normal; font-weight:400; font-size:14px; color:#7d7d7d; padding:0 20px 0 10px; line-height:20px; display:inline-block; font-weight:500;} .product_detail .right .row_3 span { color:#7d7d7d; text-decoration:line-through; } .product_detail .right .row_4 { padding-bottom:35px; padding-top:25px; background:url(../images/gradiant_1.png) no-repeat center bottom;} .product_detail .right .row_4 .qty { float:left;} .product_detail .right .row_4 .qty label { width:37px; line-height:35px; font-weight:500; font-size:14px; color:#757575; float:left;} .product_detail .right .row_4 .qty .inpt_bx { width:65px; height:35px; border:1px solid #e5e5e5; text-align:center; font-size:14px; color:#353535;} .product_detail .right .row_4 .cart_icon { line-height:35px; background:url(../images/cart_icon_3.png) no-repeat 11px center #e12626; padding:0 11px 0 37px; font-weight:500; font-size:14px; color:#ffffff; text-transform:uppercase; margin:0 20px; display:block; float:left;} .product_detail .right .row_4 .cart_icon:hover { background-color:#c71a1a;} .product_detail .right .row_4 .btn { text-transform:uppercase; padding:0 17px; font-size:12px; float:left; line-height:33px;} .product_detail .right .row_4 .btn.stock { border:1px solid #7fb81d; color:#7fb81d;} .product_detail .right .row_4 .btn.limited { border:1px solid #7fb81d; color:#7fb81d;} .product_detail .right .row_4 .btn.out_stock { border:1px solid #e5e5e5; color:#a2a2a2; background:#f8f8f8;} .product_detail .right .row_4 .btn.out_stock span { padding:0 0 0 5px; color:#e12626; } .product_detail .right .row_4 p { font-size:12px; color:#757575; padding-top:10px;} .product_detail .right .row_4 p span { color:#e12626;} .product_detail .right.out .row_3 { padding:15px 0;} .product_detail .right.out .row_4 { padding-bottom:25px;} .product_detail .right .row_5 { padding:12px 0 25px;} .product_detail .right .row_5 .socail { float:left;} .product_detail .right .row_5 .socail a { display:block; float:left; width:45px; height:45px; border:1px solid #d1d1d1; background:url(../images/icons.png) no-repeat -2px 0 ;} .product_detail .right .row_5 .socail a + a { margin-left:10px;} .product_detail .right .row_5 .socail a.wi { background-position:-2px -2px; } .product_detail .right .row_5 .socail a.fb { background-position:-54px -2px; } .product_detail .right .row_5 .socail a.tw { background-position:-109px -2px; } .product_detail .right .row_5 .socail a.em { background-position:-162px -2px; } .product_detail .right .row_5 .socail a.wi:hover { background-position:-2px -46px; } .product_detail .right .row_5 .socail a.fb:hover { background-position:-54px -46px; } .product_detail .right .row_5 .socail a.tw:hover { background-position:-109px -46px; } .product_detail .right .row_5 .socail a.em:hover { background-position:-162px -46px; } .product_detail .right .row_5 .info { float:left; margin-left:10px;} .product_detail .right .row_5 .info a {display:block; float:left; border:1px solid #d1d1d1; background:url(../images/icons.png) no-repeat;} .product_detail .right .row_5 .info a.in { padding:0 12px 0 30px; font-weight:500; line-height:43px; font-size:11px; color:#e12626; margin-right:10px; text-transform:uppercase; background-position:-217px 0; } .product_detail .right .row_5 .info a.in:hover { background-position:-217px -46px; background-color:#a2a2a2; border-color:#a2a2a2; color:#fff;} .product_detail .right .row_5 .info a.attach { width:45px; height:45px; background-position:-326px -2px; } .product_detail .right .row_5 .info a.attach + a.attach { border-left:none;} .product_detail .right .row_5 .info a.attach:hover { background-position:-326px -46px; background-color:#e12626;} .product_detail .right .row_6 {} .product_detail .right .row_6 h4 { font-weight:500; font-size:16px; color:#353535; text-transform:uppercase; padding-bottom:15px;} .product_detail .right .row_6 ul { max-height:153px; overflow-y:scroll;} .product_detail .right .row_6 ul li { padding:0 0 0 20px; background:url(../images/dot.png) no-repeat 0 7px; font-size:13px; color:#757575;} .product_detail .right .row_6 ul li + li { margin-top:10px;} .fancybox-skin { padding:15px 22px !important;} .popup {} .popup h3 { font-size:16px; color:#7d7d7d; text-transform:uppercase; padding-bottom:15px; border-bottom:1px solid #e5e5e5; margin-bottom:20px;} .popup .left { float:left; width:325px; position:relative;} .popup .left .new { width:72px; background:#e12626; text-align:center; font-size:11px; color:#fff; text-transform:uppercase; position:absolute; right:0; top:0; content:" "; padding:0 0; -webkit-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; line-height:25px; z-index:999;} .popup .left .MagicZoom { background:#f3f3f3; margin-bottom:10px;} .popup .left .zoomer_thumb { margin-left:-5px;} .popup .left .mz-thumb { width:50px; line-height:50px; border:1px solid #e5e5e5; margin:0 0 0 5px; display:block; float:left;} .popup .left .mz-thumb img { filter: brightness(100%); box-shadow:none; } .popup .left .mz-thumb-selected { border:1px solid #c71a1a;} .popup .left .mz-thumb:hover:not(.mz-thumb-selected) img { filter: brightness(100%);} .popup .right { width:425px; float:right;} .popup .right .row_1 { padding-bottom:30px; background:url(../images/gradiant_2.png) no-repeat center bottom;} .popup .right .row_1 .code { float:left; font-size:12px; color:#757575; line-height:50px;} .popup .right .row_1 .code span { font-weight:500; font-size:14px;} .popup .right .row_1 .b_img { float:right;} .popup .right .row_2 { font-weight:500; font-size:20px; color:#353535; line-height:20px; padding:17px 0 30px 0; border-bottom:1px solid #e5e5e5; } .popup .right .row_3 { border-bottom:1px solid #e5e5e5; padding:20px 0; font-weight:500; font-size:20px; color:#000000; vertical-align:top; } .popup .right .row_3 i { font-style:normal; font-weight:400; font-size:14px; color:#7d7d7d; padding:0 20px 0 10px; line-height:20px; display:inline-block; font-weight:500;} .popup .right .row_3 span { color:#7d7d7d; text-decoration:line-through; } .popup .right .row_4 { padding-bottom:35px; padding-top:25px; background:url(../images/gradiant_2.png) no-repeat center bottom;} .popup .right .row_4 .qty { float:left;} .popup .right .row_4 .qty label { width:37px; line-height:35px; font-weight:500; font-size:14px; color:#757575; float:left;} .popup .right .row_4 .qty .inpt_bx { width:65px; height:35px; border:1px solid #e5e5e5; text-align:center; font-size:14px; color:#353535;} .popup .right .row_4 .cart_icon { line-height:35px; background:url(../images/cart_icon_3.png) no-repeat 11px center #e12626; padding:0 11px 0 37px; font-weight:500; font-size:14px; color:#ffffff; text-transform:uppercase; margin:0 20px; display:block; float:left;} .popup .right .row_4 .cart_icon:hover { background-color:#c71a1a;} .popup .right .row_4 .btn { text-transform:uppercase; padding:0 17px; font-size:12px; float:left; line-height:33px;} .popup .right .row_4 .btn.stock { border:1px solid #7fb81d; color:#7fb81d;} .popup .right .row_4 .btn.limited { border:1px solid #7fb81d; color:#7fb81d;} .popup .right .row_4 .btn.out_stock { border:1px solid #e5e5e5; color:#a2a2a2;} .popup .right .row_4 .btn.out_stock { border:1px solid #e5e5e5; color:#a2a2a2; background:#f8f8f8;} .popup .right .row_4 .btn.out_stock span { padding:0 0 0 5px; color:#e12626; } .popup .right .row_4 p { font-size:12px; color:#757575; padding-top:10px;} .popup .right .row_4 p span { color:#e12626;} .popup .right.out .row_2 { padding-bottom:23px;} .popup .right.out .row_3 { padding:15px 0;} .popup .right.out .row_4 { padding-bottom:25px;} .popup .right .row_5 { padding:26px 0 0 0;} .popup .right .row_5 .pd_detail { border:1px solid #d1d1d1; line-height:45px; padding:0 10px; font-weight:500; font-size:11px; color:#e12626; text-transform:uppercase; display:inline-block;} .popup .right .row_5 .pd_detail:hover { background:#a2a2a2; border-color:#a2a2a2; color:#fff;} .fancybox-skin { background:#fff;} .empty_cart { border:1px solid #e5e5e5; padding:70px 10px 105px; text-align:center; background:#fff;} .empty_cart span { display:inline-block; padding:0 0 0 55px; font-weight:500; font-size:24px; color:#353535; line-height:26px; background:url(../images/cart_icon_4.png) no-repeat left center;} .empty_cart p { font-size:14px; color:#7d7d7d; padding-top:30px;} .empty_cart p a { color:#e12626;} .empty_cart p a:hover { color:#c71a1a;} .login_register {} .login_register .login_box { width:525px; float:left; border:1px solid #e5e5e5; padding:30px; background:#fff;} .login_register .login_box .title { background:url(../images/login_icon_1.png) no-repeat left 2px; padding:0 0 0 30px; font-size:16px; color:#7d7d7d;} .login_register .login_box .title span { font-size:18px; color:#e12626; font-weight:500;} .login_register .login_box .title span i { font-style:normal; padding:0 8px;} .login_register .login_box .note { font-size:13px; color:#7d7d7d; padding:20px 0;} .login_register .login_box .note span { color:#e12626;} .login_register .login_box .form { max-width:420px;} .login_register .login_box .form .input { position:relative;} .login_register .login_box .form .input + .input { margin-top:20px;} .login_register .login_box .form .input .inpt_bx { border:1px solid #d1d1d1; background:#f3f3f3; padding:0 13px; font-size:13px; color:#7d7d7d; width:100%; height:40px; } .login_register .login_box .form .input.required:after { position:absolute; right:-16px; top:0; content:"*"; font-size:13px; color:#e12626; line-height:40px;} .login_register .login_box .form .sbt_box { margin-top:30px;} .login_register .login_box .form .sbt_box .forgot { float:left; padding:15px 0; } .login_register .login_box .form .sbt_box .forgot a { font-size:14px; color:#7d7d7d; display:inline-block; line-height:14px;} .login_register .login_box .form .sbt_box .forgot a:hover { color:#C81B1B;} .login_register .login_box .form .sbt_box .sbt { float:right; background:#e12626; padding:0 50px; height:45px; border:none; font-weight:500; font-size:14px; color:#fff; text-transform:uppercase;} .login_register .login_box .form .sbt_box .sbt:hover { background:#C81B1B;} .login_register .reg_box { width:525px; float:right; border:1px solid #e5e5e5; padding:30px; background:#fff;} .login_register .reg_box .title { background:url(../images/login_icon_2.png) no-repeat left 2px; padding:0 0 0 30px; font-size:16px; color:#7d7d7d;} .login_register .reg_box .title span { font-size:18px; color:#e12626; font-weight:500;} .login_register .reg_box .title span i { font-style:normal; padding:0 8px;} .login_register .reg_box .highlight { margin:19px -29px 0; background:#f3f3f3; font-size:14px; color:#7d7d7d; line-height:23px; padding:20px;} .login_register .reg_box .note { font-size:13px; color:#7d7d7d; padding:20px 0;} .login_register .reg_box .note span { color:#e12626;} .login_register .reg_box .form { max-width:420px;} .login_register .reg_box .form .input { position:relative;} .login_register .reg_box .form .input + .input { margin-top:20px;} .login_register .reg_box .form .input .inpt_bx { border:1px solid #d1d1d1; background:#f3f3f3; padding:0 13px; font-size:13px; color:#7d7d7d; width:100%; height:40px; } .login_register .reg_box .form .input.required:after { position:absolute; right:-16px; top:0; content:"*"; font-size:13px; color:#e12626; line-height:40px;} .login_register .reg_box .form .input.dob .inpt_bx { background:url(../images/calendar_icon.png) no-repeat right center #f3f3f3;} .login_register .reg_box .form .input.code { padding-left:90px; position:relative;} .login_register .reg_box .form .input.code .select_box { width:80px; position:absolute; left:0; top:0;} .login_register .reg_box .form .input .select_box {} .login_register .reg_box .form .input .select_box .fancy-select { background:#f3f3f3; border:1px solid #d1d1d1; } .login_register .reg_box .form .input .select_box .fancy-select div.trigger { padding: 0 50px 0 13px; line-height: 38px; font-size:13px; color:#7d7d7d; } .login_register .reg_box .form .input .select_box .fancy-select div.trigger:after { width: 50px; height: 38px; background:url(../images/select_arrow.png) no-repeat center center;} .login_register .reg_box .form .input .select_box .fancy-select div.open.trigger:after { transform:rotate(180deg); -webkit-transform:rotate(180deg); -moz-transform:rotate(180deg); -ms-transform:rotate(180deg); -o-transform:rotate(180deg);} .login_register .reg_box .form .input .select_box .fancy-select ul.options { background:#f3f3f3; border:1px solid #d1d1d1; padding:8px 0; left:-1px; right:-1px;} .login_register .reg_box .form .input .select_box .fancy-select ul.options li { padding: 0 13px; font-size:13px; color:#7d7d7d; line-height:24px;} .login_register .reg_box .form .input .select_box .fancy-select ul.options li.selected { background: #e3e3e3; } .login_register .reg_box .form .input .select_box .fancy-select ul.options li.hover { background: #e3e3e3;} .login_register .reg_box .form p { font-size:13px; color:#7d7d7d; line-height:20px; padding:10px 0 18px;} .login_register .reg_box .form .gender { padding:25px 0 30px; font-size:16px; color:#7d7d7d;} .login_register .reg_box .form .gender label { float:left; margin-right:13px; line-height:16px;} .login_register .reg_box .form .gender .ra_label { float:left; font-size:13px; line-height:18px;} .login_register .reg_box .form .sign {} .login_register .reg_box .form .sign .ch_label { font-size:16px; color:#7d7d7d; text-transform:none; font-weight:400; position:relative; padding:0 0 0 35px;} .login_register .reg_box .form .sign .ch_label span { display:block; font-size:13px; padding-top:8px;} .login_register .reg_box .form .sign .ch_label .checkbox { position:absolute; left:0; top:0;} .login_register .reg_box .form .sbt_box { text-align:center; padding:40px 0 0 0;} .login_register .reg_box .form .sbt_box .sbt { background:#e12626; padding:0 50px; height:45px; border:none; font-weight:500; font-size:14px; color:#fff; text-transform:uppercase;} .login_register .reg_box .form .sbt_box .sbt:hover { background:#C81B1B;} @media (min-width: 1201px) { .shopping_cart .cart_box .items.history ul.head li:nth-child(1) { width:665px;} .shopping_cart .cart_box .items.history ul.head li:nth-child(3) { width:110px;} .shopping_cart .cart_box .items.history ul.pdt_row li:nth-child(1) { width:665px; } .shopping_cart .cart_box .items.history ul.pdt_row li:nth-child(3) { width:110px; } .shopping_cart .cart_box .items.history ul.head li.large:nth-child(1), .shopping_cart .cart_box .items.history ul.pdt_row li.large:nth-child(1) { width:662px; } } .shopping_cart {} .shopping_cart .links { padding-bottom:20px;} .shopping_cart .links ul {} .shopping_cart .links ul li { display:block; float:left;} .shopping_cart .links ul li + li { margin-left:10px;} .shopping_cart .links ul li a { display:block; width:240px; border:1px solid #e5e5e5; background:#fff; color:#e12626; font-weight:500; font-size:14px; text-transform:uppercase; padding:14px 0; line-height:14px; text-align:center; cursor:pointer;} .shopping_cart .links ul li.disable a { background:#e5e5e5; color:#a0a0a0; cursor:not-allowed; } .shopping_cart .cart_box { background:#fff; padding:30px; background:#fff; border:1px solid 3e5e5e5; border:1px solid #e5e5e5;} .shopping_cart .cart_box .title { font-weight:500; font-size:24px; color:#353535; padding-bottom:25px;} .shopping_cart .cart_box .items {} .shopping_cart .cart_box .items.history {} .shopping_cart .cart_box .items ul.head { background:#f3f3f3;} .shopping_cart .cart_box .items ul.head li { font-size:14px; color:#353535; text-transform:uppercase; line-height:14px; padding-top:20px; padding-bottom:19px; float:left;} .shopping_cart .cart_box .items ul.head li:nth-child(1) { padding-left:22px; width:541px; } .shopping_cart .cart_box .items ul.head li:nth-child(2) { width:100px; margin-right:60px; text-align:center; } .shopping_cart .cart_box .items ul.head li:nth-child(3) { width:235px; padding-left:25px; } .shopping_cart .cart_box .items ul.head li:nth-child(4) { padding-right:18px; width:122px; } .shopping_cart .cart_box .items ul.pdt_row { padding:30px 0;} .shopping_cart .cart_box .items ul.pdt_row + ul.pdt_row { border-top:1px solid #e5e5e5;} .shopping_cart .cart_box .items ul.pdt_row li { display:block; float:left;} .shopping_cart .cart_box .items ul.pdt_row li .none { display:none;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) { width:541px; } .shopping_cart .cart_box .items ul.pdt_row li:nth-child(2) { width:100px; margin-right:60px; text-align:center; } .shopping_cart .cart_box .items ul.pdt_row li:nth-child(3) { width:235px; } .shopping_cart .cart_box .items ul.pdt_row li:nth-child(4) { width:122px; padding-right:18px; text-align:center; } .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) .img { margin-right:20px; float:left;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) .img a { display:block; background:#f3f3f3; border:1px solid #e5e5e5; width:100px; text-align:center; line-height:100px;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) .img_detail { overflow:hidden; padding:0 0 0 0;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) .img_detail .name { font-weight:500; font-size:18px; color:#353535; padding-bottom:10px;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) .img_detail .name a:hover { color:#c81b1b ;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) .img_detail .code { font-size:12px; color:#757575; padding-bottom:11px;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) .img_detail .code span { font-weight:500; font-size:14px;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) .img_detail .code span i { font-style:normal; padding:0 7px;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) .img_detail .status {} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) .img_detail .status span { display:block; font-size:12px; color:#e12626; text-transform:uppercase; padding-bottom:0px;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) .img_detail .status span.stock { color:#7fb81d;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) .img_detail .status span.limited { color:#7fb81d;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) .img_detail .status span.out_stock { color:#e12626;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) .img_detail .status p { color:#757575; font-size:12px;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) .img_detail .status p b { font-weight:normal; color:#e12626; } .shopping_cart .cart_box .items ul.pdt_row li:nth-child(2) { font-weight:500; font-size:18px; color:#000000; margin-top:10px; } .shopping_cart .cart_box .items ul.pdt_row li:nth-child(2).offer { margin-top:-3px;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(2) span { display:block; text-decoration:line-through; color:#7d7d7d; padding-top:6px;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(3) .qty { float:left; border:1px solid #e5e5e5; height:45px; width:75px; font-size:14px; color:#353535; text-align:center;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(3) .btn { float:left; border:1px solid #e5e5e5; margin-left:10px;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(3) .btn a { display:block; width:43px; height:43px; float:left;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(3) .btn a + a { border-left:1px solid #e5e5e5;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(3) .btn a.wish { background:url(../images/icons.png) no-repeat -2px 0 ;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(3) .btn a.wish:hover { background-position:-2px -46px; } .shopping_cart .cart_box .items ul.pdt_row li:nth-child(3) .btn a.edit_o { background:url(../images/edti_icon.png) no-repeat -0px -2px ;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(3) .btn a.edit_o:hover { background-position:-2px -46px; } .shopping_cart .cart_box .items ul.pdt_row li:nth-child(3) .btn a.remove { background:url(../images/x_icon.png) no-repeat 0 0 ; } .shopping_cart .cart_box .items ul.pdt_row li:nth-child(3) .btn a.remove:hover { background-position:0 -46px; } .shopping_cart .cart_box .items ul.pdt_row li:nth-child(3) .bag { float:left; padding-left:10px;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(3) .bag a { display:block; line-height:45px; width:94px; text-align:center; background:#acacac; font-weight:500; font-size:12px; color:#ffffff; text-transform:uppercase;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(3) .bag a:hover { background:#e12626;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(4) { font-weight:500; font-size:18px; color:#000000; margin-top:10px;} .shopping_cart .cart_box .block { padding:40px 0 0 0;} .shopping_cart .cart_box .block .left { float:left; width:595px;} .shopping_cart .cart_box .block .left.more { width:640px;} .shopping_cart .cart_box .block .left .data { background:#f5f5f5; padding:16px 13px 15px; font-size:14px; color:#353535;} .shopping_cart .cart_box .block .left .charge { margin:5px 0; position:relative;} .shopping_cart .cart_box .block .left .charge a { display:block; padding: 16px 28px 15px 13px; background:#f5f5f5; color: #353535; font-size:14px; position:relative;} .shopping_cart .cart_box .block .left .charge a:after { width: 42px; height: 50px; background:url(../images/select_arrow.png) no-repeat center center; position:absolute; right:0; top:0; content:" ";} .shopping_cart .cart_box .block .left .charge a.open:after { transform:rotate(180deg);} .shopping_cart .cart_box .block .left .charge ul { background:#f5f5f5;padding:8px 13px; left:0; right:0; top:100%; position:absolute; display:none;} .shopping_cart .cart_box .block .left .charge ul li { padding: 5px 13px; color: #000; line-height:25px; font-size:13px; background: #fff;} .shopping_cart .cart_box .block .left .charge ul li.hover { background: #fff;} .shopping_cart .cart_box .block .left .contact { padding:16px 13px 15px; font-size:14px; color:#7d7d7d; border-bottom:1px solid #e5e5e5;} .shopping_cart .cart_box .block .left .safe { margin-top:30px; min-height:26px; padding:5px 0 0 37px; background:url(../images/lock_icon.png) no-repeat 0 0; font-size:14px; color:#7d7d7d;} .shopping_cart .cart_box .block .left .two_box {} .shopping_cart .cart_box .block .left .two_box .box { float:left; width:49%; background:#f5f5f5; padding:25px; position:relative;} .shopping_cart .cart_box .block .left .two_box .box + .box { float:right;} .shopping_cart .cart_box .block .left .two_box .box .caption { font-size:16px; color:#353535; text-transform:uppercase; padding-bottom:18px;} .shopping_cart .cart_box .block .left .two_box .box p { font-size:13px; line-height:22px; color:#7d7d7d;} .shopping_cart .cart_box .block .left .two_box .box p + p { margin-top:22px;} .shopping_cart .cart_box .block .left .two_box .box .edit_icon { position:absolute; right:25px; top:25px;} .shopping_cart .cart_box .block .left .two_box .box .edit_icon a { display:block; width:14px; height:14px; background:url(../images/edti_icon_1.png) no-repeat;} .shopping_cart .cart_box .block .left .two_box .box .edit_icon a:hover { background-position:0 100%;} .shopping_cart .cart_box .block .right { float:right; width:100%; max-width:310px;} .shopping_cart .cart_box .block .right .total { border:1px solid #e5e5e5; margin-left:10px;} .shopping_cart .cart_box .block .right .total .row { line-height:35px; padding:0 22px 0 22px;} .shopping_cart .cart_box .block .right .total .row + .row { border-top:1px solid #e5e5e5;} .shopping_cart .cart_box .block .right .total .row .label { float:left; font-size:14px; color:#7d7d7d;} .shopping_cart .cart_box .block .right .total .row .cost { float:right; font-size:14px; color:#000000;} .shopping_cart .cart_box .block .right .total .row span { font-weight:500;} .shopping_cart .cart_box .block .right .btn { margin-top:40px; text-align:right;} .shopping_cart .cart_box .block .btn a { display:inline-block; background:#e12626; padding:17px 20px; font-weight:500; color:#fff; text-transform:uppercase; font-size:14px; line-height:14px;} .shopping_cart .cart_box .block .right .btn a + a { margin-left:10px;} .shopping_cart .cart_box .block .right .btn a:hover { background:#C81B1B;} .shopping_cart .cart_box .pay { padding-top:25px;} .sub_title { font-weight:500; font-size:24px; color:#353535; padding:0 35px 25px;} .sub_title span { float:left;} .sub_title .back { float:right; padding-top:10px;} .sub_title .back a { display:block; padding:0 0 0 10px; font-size:13px; color:#353535; background:url(../images/back_arrow.png) no-repeat left center;} .sub_title .back a:hover { padding-left:15px; color:#e12626;} .billing_shipping {} .billing_shipping .block {} .billing_shipping .block .billing { border:1px solid #e5e5e5; padding:30px; width:525px; float:left; background:#fff;} .billing_shipping .block .billing .title { padding-bottom:23px; max-width:420px;} .billing_shipping .block .billing .title span { color:#e12626; font-weight:500; font-size:18px;} .billing_shipping .block .billing .title a { display:block; float:right; font-size:13px; color:#7d7d7d; text-decoration:underline;} .billing_shipping .block .billing .title a:hover { color:#e12626;} .billing_shipping .block .billing .form { max-width:420px;} .billing_shipping .block .billing .form .input { position:relative;} .billing_shipping .block .billing .form .input + .input { margin-top:20px;} .billing_shipping .block .billing .form .input .inpt_bx { border:1px solid #d1d1d1; background:#f3f3f3; padding:0 13px; font-size:13px; color:#7d7d7d; width:100%; height:40px; } .billing_shipping .block .billing .form .input.required:after { position:absolute; right:-16px; top:0; content:"*"; font-size:13px; color:#e12626; line-height:40px;} .billing_shipping .block .billing .form .input .select_box {} .billing_shipping .block .billing .form .input .select_box .fancy-select { background:#f3f3f3; border:1px solid #d1d1d1; } .billing_shipping .block .billing .form .input .select_box .fancy-select div.trigger { padding: 0 50px 0 13px; line-height: 38px; font-size:13px; color:#7d7d7d; } .billing_shipping .block .billing .form .input .select_box .fancy-select div.trigger:after { width: 50px; height: 38px; background:url(../images/select_arrow.png) no-repeat center center;} .billing_shipping .block .billing .form .input .select_box .fancy-select div.open.trigger:after { transform:rotate(180deg); -webkit-transform:rotate(180deg); -moz-transform:rotate(180deg); -ms-transform:rotate(180deg); -o-transform:rotate(180deg);} .billing_shipping .block .billing .form .input .select_box .fancy-select ul.options { background:#f3f3f3; border:1px solid #d1d1d1; padding:8px 0; left:-1px; right:-1px;} .billing_shipping .block .billing .form .input .select_box .fancy-select ul.options li { padding: 0 13px; font-size:13px; color:#7d7d7d; line-height:24px;} .billing_shipping .block .billing .form .input .select_box .fancy-select ul.options li.selected { background: #e3e3e3; } .billing_shipping .block .billing .form .input .select_box .fancy-select ul.options li.hover { background: #e3e3e3;} .billing_shipping .block .billing .form .input.code { padding-left:90px; position:relative;} .billing_shipping .block .billing .form .input.code .select_box { width:80px; position:absolute; left:0; top:0;} .billing_shipping .block .shipping { border:1px solid #e5e5e5; padding:30px; width:525px; float:right; background:#fff;} .billing_shipping .block .shipping .title { padding-bottom:23px; max-width:420px;} .billing_shipping .block .shipping .title span { color:#e12626; font-weight:500; font-size:18px;} .billing_shipping .block .shipping .title a { display:block; float:right; font-size:13px; color:#7d7d7d; text-decoration:underline;} .billing_shipping .block .shipping .title a:hover { color:#e12626;} .billing_shipping .block .shipping .highlight { margin:0 -30px 25px; background:#f3f3f3; font-size:14px; color:#7d7d7d; line-height:23px; padding:20px;} .billing_shipping .block .shipping .highlight .ra_label { font-size:14px; color:#7d7d7d;} .billing_shipping .block .shipping .highlight .ra_label + .ra_label { margin-top:13px;} .billing_shipping .block .shipping .form { max-width:420px;} .billing_shipping .block .shipping .form .input { position:relative;} .billing_shipping .block .shipping .form .input + .input { margin-top:20px;} .billing_shipping .block .shipping .form .input .inpt_bx { border:1px solid #d1d1d1; background:#f3f3f3; padding:0 13px; font-size:13px; color:#7d7d7d; width:100%; height:40px; } .billing_shipping .block .shipping .form .input.required:after { position:absolute; right:-16px; top:0; content:"*"; font-size:13px; color:#e12626; line-height:40px;} .billing_shipping .block .shipping .form .input .select_box {} .billing_shipping .block .shipping .form .input .select_box .fancy-select { background:#f3f3f3; border:1px solid #d1d1d1; } .billing_shipping .block .shipping .form .input .select_box .fancy-select div.trigger { padding: 0 50px 0 13px; line-height: 38px; font-size:13px; color:#7d7d7d; } .billing_shipping .block .shipping .form .input .select_box .fancy-select div.trigger:after { width: 50px; height: 38px; background:url(../images/select_arrow.png) no-repeat center center;} .billing_shipping .block .shipping .form .input .select_box .fancy-select div.open.trigger:after { transform:rotate(180deg); -webkit-transform:rotate(180deg); -moz-transform:rotate(180deg); -ms-transform:rotate(180deg); -o-transform:rotate(180deg);} .billing_shipping .block .shipping .form .input .select_box .fancy-select ul.options { background:#f3f3f3; border:1px solid #d1d1d1; padding:8px 0; left:-1px; right:-1px;} .billing_shipping .block .shipping .form .input .select_box .fancy-select ul.options li { padding: 0 13px; font-size:13px; color:#7d7d7d; line-height:24px;} .billing_shipping .block .shipping .form .input .select_box .fancy-select ul.options li.selected { background: #e3e3e3; } .billing_shipping .block .shipping .form .input .select_box .fancy-select ul.options li.hover { background: #e3e3e3;} .billing_shipping .block .shipping .form .input.code { padding-left:90px; position:relative;} .billing_shipping .block .shipping .form .input.code .select_box { width:80px; position:absolute; left:0; top:0;} .billing_shipping .btn { text-align:right; padding-top:30px;} .billing_shipping .btn a { display:inline-block; background:#e12626; padding:18px 20px 16px; font-weight:500; font-size:14px; color:#ffffff; text-transform:uppercase; line-height:14px; } .billing_shipping .btn a:hover { background:#c71a1a;} .payment {} .payment .left { width:650px; float:left;} .payment .left .bg_box { background:#f5f5f5; padding:20px;} .payment .left .bg_box + .bg_box { margin-top:20px;} .payment .left .bg_box .ra_label { font-weight:500; font-size:18px; color:#353535;} .payment .left .bg_box .ra_label .radio { margin-right:23px;} .payment .left .bg_box .detail { padding:15px 0 0 40px;} .payment .left .bg_box .detail p { font-size:14px; color:#757575; padding-bottom:10px;} .payment .left .bg_box .detail .safe { margin-top:13px; min-height:26px; padding:5px 0 0 37px; background:url(../images/lock_icon.png) no-repeat 0 0; font-size:14px; color:#7d7d7d;} .payment .left .bg_box .detail p {} .payment .left .bg_box .detail p span { color:#e12626;} .payment .left .bg_box .detail p a { color:#e12626;} .payment .left .bg_box .detail p a:hover { color:#c71a1a;} .payment .left .btn { padding-top:30px;} .payment .left .btn a { display:inline-block; background:#e12626; padding:18px 20px 16px; font-weight:500; font-size:14px; color:#ffffff; text-transform:uppercase; line-height:14px; } .payment .left .btn a:hover { background:#c71a1a;} .payment .right { width:315px; float:right;} .payment .right .total { border:1px solid #e5e5e5; margin-left:10px; margin-bottom:30px;} .payment .right .total .row { line-height:35px; padding:0 22px 0 22px;} .payment .right .total .row + .row { border-top:1px solid #e5e5e5;} .payment .right .total .row .label { float:left; font-size:14px; color:#7d7d7d;} .payment .right .total .row .cost { float:right; font-size:14px; color:#000000;} .payment .right .total .row span { font-weight:500;} .payment .right .box { background:#f5f5f5; padding:25px; position:relative;} .payment .right .box + .box { margin-top:12px; } .payment .right .box .caption { font-size:16px; color:#353535; text-transform:uppercase; padding-bottom:18px;} .payment .right .box p { font-size:13px; line-height:22px; color:#7d7d7d;} .payment .right .box p + p { margin-top:22px;} .payment_done { border:1px solid #e5e5e5; padding:50px 10px; text-align:center; background:#fff;} .payment_done .cap { display:inline-block; line-height:48px; font-weight:500; font-size:24px; color:#353535;} .payment_done .cap img { margin-right:23px;} .payment_done p { font-size:14px; color:#7d7d7d; line-height:36px; padding:30px 0 40px; } .payment_done .btn { } .payment_done .btn a { display:inline-block; background:#e12626; padding:17px 20px; font-weight:500; color:#fff; text-transform:uppercase; font-size:14px; line-height:14px;} .payment_done .btn a + a { margin-left:40px;} .payment_done .btn a:hover { background:#C81B1B;} .retrive { border:1px solid #e5e5e5; padding:30px; background:#fff;} .retrive .title { background:url(../images/login_icon_1.png) no-repeat left 2px; padding:0 0 0 30px; font-size:16px; color:#7d7d7d;} .retrive .title span { font-size:18px; color:#e12626; font-weight:500;} .retrive .title span i { font-style:normal; padding:0 8px;} .retrive .note { font-size:13px; color:#7d7d7d; padding:20px 0;} .retrive .note span { color:#e12626;} .retrive .form { max-width:420px;} .retrive .form .input { position:relative;} .retrive .form .input + .input { margin-top:20px;} .retrive .form .input .inpt_bx { border:1px solid #d1d1d1; background:#f3f3f3; padding:0 13px; font-size:13px; color:#7d7d7d; width:100%; height:40px; } .retrive .form .input.required:after { position:absolute; right:-16px; top:0; content:"*"; font-size:13px; color:#e12626; line-height:40px;} .retrive .form .sbt_box { margin-top:30px;} .retrive .form .sbt_box .back_login { float:left; padding:0 0; } .retrive .form .sbt_box .back_login a { font-size:14px; color:#7d7d7d; display:inline-block; line-height:45px; padding-right:32px; background:url(../images/back.png) no-repeat right 2px;} .retrive .form .sbt_box .back_login a:hover { color:#C81B1B; background:url(../images/back.png) no-repeat right -45px;} .retrive .form .sbt_box .sbt { float:right; background:#e12626; padding:0 50px; height:45px; border:none; font-weight:500; font-size:14px; color:#fff; text-transform:uppercase;} .retrive .form .sbt_box .sbt:hover { background:#C81B1B;} .dash_link {} .dash_link ul { margin-left:-10px;} .dash_link ul li { display:block; float:left; margin-left:10px;} .dash_link ul li a { display:block; border:1px solid #e5e5e5; padding:9px 20px 8px; font-weight:500; font-size:14px; color:#7d7d7d; text-transform:uppercase; background:#fff;} .dash_link ul li a:hover { color:#e12626;} .dash_link ul li.active a { color:#e12626;} .dashboard { } .dashboard .top { padding:30px;} .dashboard .top .title { font-weight:500; font-size:24px; color:#353535; padding-bottom:10px;} .dashboard .top p { line-height:24px; color:#7d7d7d; font-size:14px;} .dashboard .top p span { display:block; color:#353535;} .dashboard .recent_order { border:1px solid #e5e5e5; padding:20px 30px; margin-bottom:30px; background:#fff;} .dashboard .recent_order.pad { padding:30px; } .dashboard .recent_order h2 { font-weight:500; font-size:16px; color:#e12626; padding-bottom:20px;} .dashboard .recent_order p { font-size:14px; color:#757575;} .dashboard .recent_order .order_table {} .dashboard .recent_order .order_table ul { padding:0 22px;} .dashboard .recent_order .order_table ul.head { background:#f3f3f3; } .dashboard .recent_order .order_table ul li { font-size:14px; padding-top:16px; padding-bottom:14px; float:left; color:#757575;} .dashboard .recent_order .order_table ul.head li { color:#353535; text-transform:uppercase;} .dashboard .recent_order .order_table ul li span.none { display:none; font-size:14px; color:#353535; text-transform:uppercase;} .dashboard .recent_order .order_table ul li:nth-child(1) { width:130px;} .dashboard .recent_order .order_table ul li:nth-child(2) { width:140px;} .dashboard .recent_order .order_table ul li:nth-child(3) { width:130px;} .dashboard .recent_order .order_table ul li i { font-style:normal;} .dashboard .recent_order .order_table ul li i.pending { color:#e12626;} .dashboard .recent_order .order_table ul li i.delivered { color:#31870e;} .dashboard .recent_order .order_table ul li i.cancelled { color:#6588e9;} .dashboard .recent_order .order_table ul li:nth-child(4) { width:150px;} .dashboard .recent_order .order_table ul li:nth-child(5) { width:275px; padding-right:10px;} .dashboard .recent_order .order_table ul li:nth-child(6) { width:185px;} .dashboard .recent_order .order_table ul li a { font-size:14px; color:#757575;} .dashboard .recent_order .order_table ul li a:hover { color:#e12626;} .dashboard .recent_order .order_table ul li .track { float:left; } .dashboard .recent_order .order_table ul li .view { float:right;} .dashboard .recent_order .order_table ul li .view i { font-style:italic;} .dashboard .recent_order .order_table .records { padding:20px 0;} .dashboard .info {} .dashboard .info .ac_info { float:left; width:525px; border:1px solid #e5e5e5; background:#fff; } .dashboard .info .ac_info .block_1 { padding:15px 30px; border-bottom:1px solid #e5e5e5; } .dashboard .info .ac_info .block_1 h2 { font-weight:500; font-size:16px; color:#e12626; padding-bottom:20px; padding-bottom:20px;} .dashboard .info .ac_info .block_1 h2 span {} .dashboard .info .ac_info .block_1 h2 span a { font-size:13px; color:#7d7d7d; text-decoration:underline; margin-left:20px; font-weight:400;} .dashboard .info .ac_info .block_1 h2 span a:hover { color:#e12626;} .dashboard .info .ac_info .block_1 ul {} .dashboard .info .ac_info .block_1 ul li { font-weight:400;} .dashboard .info .ac_info .block_1 ul li + li { margin-top:15px;} .dashboard .info .ac_info .block_1 ul li span { display:block; float:left; width:85px; font-weight:500; font-size:13px; color:#353535; position:relative;} .dashboard .info .ac_info .block_1 ul li span:after { position:absolute; right:0; color:#7d7d7d; content:":";} .dashboard .info .ac_info .block_1 ul li i { overflow:hidden; display:block; font-style:normal; padding-left:20px;} .dashboard .info .ac_info .block_2 { padding:15px 30px;} .dashboard .info .ac_info .block_2 .link {} .dashboard .info .ac_info .block_2 .link a { font-weight:500; font-size:16px; color:#757575; display:inline-block;} .dashboard .info .ac_info .block_2 .link a:hover { color:#e12626;} .dashboard .info .ac_info .block_2 .link + .link { margin-top:15px;} .dashboard .info .ac_info .block_2 .link span { font-size:14px; color:#31870e; display:inline-block; padding-left:20px;} .dashboard .info .ac_info .block_2 .link span .unsucribed { color:#e12626;} .dashboard .info .add_info { float:right; width:525px; border:1px solid #e5e5e5; background:#fff; } .dashboard .info .add_info .block { padding:15px 30px 20px; border-bottom:1px solid #e5e5e5; } .dashboard .info .add_info .block h2 { font-weight:500; font-size:16px; color:#e12626; padding-bottom:20px; padding-bottom:20px;} .dashboard .info .add_info .block h2 span {} .dashboard .info .add_info .block h2 span a { font-size:13px; color:#7d7d7d; text-decoration:underline; margin-left:20px; font-weight:400;} .dashboard .info .add_info .block h2 span a:hover { color:#e12626;} .dashboard .info .add_info .block p { font-size:13px; color:#7d7d7d; line-height:24px;} .dashboard .info .add_info .br_none { border-bottom:none; padding-top:20px;} .mr_top { margin-top:25px;} .right_btn { text-align:right; margin-top:30px;} .right_btn a { display:inline-block; background:#e12626; padding:18px 20px 16px; font-weight:500; font-size:14px; color:#ffffff; text-transform:uppercase; line-height:14px; } .right_btn a:hover { background:#c71a1a;} .o_detail {} .o_detail h2 { color: #e12626; font-size: 16px; font-weight: 500; padding-bottom: 20px;} .o_detail ul { padding-bottom:30px;} .o_detail ul li { width:140px; float:left; font-size:14px; color:#757575;} .o_detail ul li span { color:#353535; text-transform:uppercase; padding-bottom:15px; display:block; } .personal_info {} .personal_info .left { background: #fff; border: 1px solid #e5e5e5; float: left; padding: 30px; width: 525px;} .personal_info .left .title { background:url(../images/login_icon_2.png) no-repeat left 2px; padding:0 0 0 35px; font-size:16px; color:#7d7d7d; margin-bottom:20px; max-width:420px;} .personal_info .left .title span { font-size:18px; color:#e12626; font-weight:500;} .personal_info .left .title span i { font-style:normal; padding:0 8px;} .personal_info .left .title a { display:block; float:right; font-size:13px; color:#7d7d7d; text-decoration:underline; line-height:26px;} .personal_info .left .title a:hover { color:#e12626;} .personal_info .left .form { max-width:420px;} .personal_info .left .form .input { position:relative;} .personal_info .left .form .input + .input { margin-top:20px;} .personal_info .left .form .input .inpt_bx { border:1px solid #d1d1d1; background:#f3f3f3; padding:0 13px; font-size:13px; color:#7d7d7d; width:100%; height:40px; } .personal_info .left .form .input.required:after { position:absolute; right:-16px; top:0; content:"*"; font-size:13px; color:#e12626; line-height:40px;} .personal_info .left .form .input.code { padding-left:90px; position:relative;} .personal_info .left .form .input.code .select_box { width:80px; position:absolute; left:0; top:0;} .personal_info .left .form .input .select_box {} .personal_info .left .form .input .select_box .fancy-select { background:#f3f3f3; border:1px solid #d1d1d1; } .personal_info .left .form .input .select_box .fancy-select div.trigger { padding: 0 50px 0 13px; line-height: 38px; font-size:13px; color:#7d7d7d; } .personal_info .left .form .input .select_box .fancy-select div.trigger:after { width: 50px; height: 38px; background:url(../images/select_arrow.png) no-repeat center center;} .personal_info .left .form .input .select_box .fancy-select div.open.trigger:after { transform:rotate(180deg); -webkit-transform:rotate(180deg); -moz-transform:rotate(180deg); -ms-transform:rotate(180deg); -o-transform:rotate(180deg);} .personal_info .left .form .input .select_box .fancy-select ul.options { background:#f3f3f3; border:1px solid #d1d1d1; padding:8px 0; left:-1px; right:-1px;} .personal_info .left .form .input .select_box .fancy-select ul.options li { padding: 0 13px; font-size:13px; color:#7d7d7d; line-height:24px;} .personal_info .left .form .input .select_box .fancy-select ul.options li.selected { background: #e3e3e3; } .personal_info .left .form .input .select_box .fancy-select ul.options li.hover { background: #e3e3e3;} .personal_info .left .form .gender { padding:25px 0 30px; font-size:16px; color:#7d7d7d;} .personal_info .left .form .gender label { float:left; margin-right:13px; line-height:16px;} .personal_info .left .form .gender .ra_label { float:left; font-size:13px; line-height:18px;} .personal_info .left .form .input.dob .inpt_bx { background:url(../images/calendar_icon.png) no-repeat right center #f3f3f3;} .personal_info .right { float: right; width: 525px;} .personal_info .right .box { background:#fff; border:1px solid #e5e5e5; padding:30px;} .personal_info .right .box + .box { margin-top:30px;} .personal_info .right .box .title_1 { background:url(../images/login_icon_1.png) no-repeat left 2px; padding:0 0 0 30px; font-size:16px; color:#7d7d7d; margin-bottom:20px; max-width:420px;} .personal_info .right .box .title_1 span { font-size:18px; color:#e12626; font-weight:500;} .personal_info .right .box .title_1 span i { font-style:normal; padding:0 8px;} .personal_info .right .box .title_1 a { display:block; float:right; font-size:13px; color:#7d7d7d; text-decoration:underline; line-height:26px;} .personal_info .right .box .title_1 a:hover { color:#e12626;} .personal_info .right .box .title_2 { background:url(../images/mail_icon.png) no-repeat left 6px; padding:0 0 0 30px; font-size:16px; color:#7d7d7d; margin-bottom:20px; max-width:420px;} .personal_info .right .box .title_2 span { font-size:18px; color:#e12626; font-weight:500;} .personal_info .right .box .title_2 span i { font-style:normal; padding:0 8px;} .personal_info .right .box .title_2 a { display:block; float:right; font-size:13px; color:#7d7d7d; text-decoration:underline; line-height:26px;} .personal_info .right .box .title_2 a:hover { color:#e12626;} .personal_info .right .box .form { max-width:420px;} .personal_info .right .box .form .input { position:relative;} .personal_info .right .box .form .input + .input { margin-top:20px;} .personal_info .right .box .form .input .inpt_bx { border:1px solid #d1d1d1; background:#f3f3f3; padding:0 13px; font-size:13px; color:#7d7d7d; width:100%; height:40px; } .personal_info .right .box .form .input.required:after { position:absolute; right:-16px; top:0; content:"*"; font-size:13px; color:#e12626; line-height:40px;} .personal_info .right .box .form .sign { margin-top:30px;} .personal_info .right .box .form .sign .ch_label { font-size:16px; color:#7d7d7d; text-transform:none; font-weight:400; position:relative; padding:0 0 0 35px;} .personal_info .right .box .form .sign .ch_label span { display:block; font-size:13px; padding-top:8px;} .personal_info .right .box .form .sign .ch_label .checkbox { position:absolute; left:0; top:0;} .personal_info .right .btn { text-align:center; padding:30px 0;} .personal_info .right .btn a { display:inline-block; background:#e12626; padding:18px 20px 16px; font-weight:500; font-size:14px; color:#ffffff; text-transform:uppercase; line-height:14px; } .personal_info .right .btn a + a { margin-left:10px;} .personal_info .right .btn a:hover { background:#c71a1a;} .detail_content {} .detail_content .link { width:240px; float:left; margin-right:29px; border:1px solid #e5e5e5; background:#fff;} .detail_content .link h3 { padding:15px; font-weight:700; font-size:13px; color:#353535; text-transform:uppercase; line-height:13px; border-bottom:1px solid #e5e5e5;} .detail_content .link ul { padding:0 15px;} .detail_content .link ul li {} .detail_content .link ul li + li { border-top:1px solid #e5e5e5;} .detail_content .link ul li a { display:block; padding:15px 16px; background:url(../images/li_bg.png) no-repeat 0 -21px; font-size:13px; color:#7d7d7d;} .detail_content .link ul li.active a { color:#e12626; background-position:0 20px;} .detail_content .link ul li:hover a { color:#e12626; background-position:0 20px;} .detail_content .detail { overflow:hidden; background:#fff;} .detail_content .detail .title { padding:24px 42px 20px; font-weight:600; color:#fff; background:url(../images/title_Bg.png) no-repeat center center; background-size:cover; font-size:30px;} .detail_content .detail .data { border:1px solid #e5e5e5; border-top:none; padding:40px;} .detail_content .detail .data .map { width:500px; height:300px; float:left;} .detail_content .detail .data .contact_info { width:215px; float:right;} .detail_content .detail .data .contact_info h4 { font-weight:700; font-size:20px; color:#e12626; padding-bottom:7px;} .detail_content .detail .data .contact_info p { font-size:14px; color:#7d7d7d; line-height:23px; padding-bottom:25px;} .detail_content .detail .data .contact_info p a { color:#7d7d7d;} .detail_content .detail .data .contact_info p a:hover { color:#e12626;} .detail_content .detail .data .contact_info h6 { font-size:14px; color:#e12626; padding-bottom:7px;} .detail_content .detail .data > p { font-size:14px; color:#7d7d7d; line-height:20px; padding-bottom:20px; text-align:justify;} .detail_content .detail .data > p:last-child { padding-bottom:0;} .detail_content .detail .data > p a { color:#e12626;} .detail_content .detail .data > p a:hover { color:#333;} .detail_content .detail .data > p span { color:#e12626;} .detail_content .detail .data > p strong { font-weight:500;} .detail_content .detail .data hr { margin:30px 0; border:none; width:100%; height:1px; background:#e5e5e5;} .detail_content .detail .data h2 { font-weight:700; font-size:20px; color:#e12626; padding-bottom:15px;} .detail_content .detail .data h3 { font-size:14px; color:#e12626; padding-bottom:17px;} .detail_content .detail .data h4 { font-weight:500; font-size:18px; color:#353535; padding-bottom:15px; text-transform:uppercase;} .detail_content .detail .data h5 { font-size:14px; color:#353535; padding-bottom:15px;} .detail_content .detail .data > ul { padding-bottom:20px;} .detail_content .detail .data > ul > li { font-size:14px; color:#7d7d7d; line-height:20px; padding:0 0 0 20px; background:url(../images/bullet.png) no-repeat 0 7px;} .detail_content .detail .data > ul > li + li { margin-top:10px;} .detail_content .detail .note { font-size:13px; color:#7d7d7d; border-bottom:1px solid #e5e5e5; padding:0 0 18px; margin-bottom:20px;} .detail_content .detail .note b { font-weight:400; color:#e12626;} .detail_content .detail .form { padding-right:15px;} .detail_content .detail .form .row {} .detail_content .detail .form .row + .row { margin-top:19px;} .detail_content .detail .form .row .half { float:left; width:47.5%;} .detail_content .detail .form .row .half + .half { float:right;} .detail_content .detail .form .row .input .select_box .fancy-select { background:#f3f3f3; border:1px solid #d1d1d1; } .detail_content .detail .form .row .input .select_box .fancy-select div.trigger { padding: 0 50px 0 13px; line-height: 38px; font-size:13px; color:#7d7d7d; } .detail_content .detail .form .row .input .select_box .fancy-select div.trigger:after { width: 50px; height: 38px; background:url(../images/select_arrow.png) no-repeat center center;} .detail_content .detail .form .row .input .select_box .fancy-select div.open.trigger:after { transform:rotate(180deg); -webkit-transform:rotate(180deg); -moz-transform:rotate(180deg); -ms-transform:rotate(180deg); -o-transform:rotate(180deg);} .detail_content .detail .form .row .input .select_box .fancy-select ul.options { background:#f3f3f3; border:1px solid #d1d1d1; padding:8px 0; left:-1px; right:-1px;} .detail_content .detail .form .row .input .select_box .fancy-select ul.options li { padding: 0 13px; font-size:13px; color:#7d7d7d; line-height:24px;} .detail_content .detail .form .row .input .select_box .fancy-select ul.options li.selected { background: #e3e3e3; } .detail_content .detail .form .row .input .select_box .fancy-select ul.options li.hover { background: #e3e3e3;} .detail_content .detail .form .row .input { position:relative;} .detail_content .detail .form .row .input .inpt_bx { border:1px solid #d1d1d1; background:#f3f3f3; padding:0 13px; font-size:13px; color:#7d7d7d; width:100%; height:40px; } .detail_content .detail .form .row .input .area { border:1px solid #d1d1d1; background:#f3f3f3; padding:10px 13px; font-size:13px; color:#7d7d7d; width:100%; height:100px; } .detail_content .detail .form .row .input.capcha .inpt_bx { padding-right:165px;} .detail_content .detail .form .row .input.capcha .reload { position:absolute; right:1px; top:1px; bottom:1px; width:39px; height:38px; background:url(../images/reload_1.png) no-repeat center center #fff; } .detail_content .detail .form .row .input.capcha .txt { width:110px; position:absolute; right:41px; top:0;} .detail_content .detail .form .row .input.required:after { position:absolute; right:-16px; top:50%; content:"*"; font-size:13px; color:#e12626; transform:translateY(-50%); -moz-transform:translateY(-50%); -webkit-transform:translateY(-50%); -ms-transform:translateY(-50%); -o-transform:translateY(-50%);} .detail_content .detail .form .sbt_box { margin-top:30px;} .detail_content .detail .form .sbt_box .sbt { background:#e12626; padding:0 50px; height:45px; border:none; font-weight:500; font-size:14px; color:#fff; text-transform:uppercase;} .detail_content .detail .form .sbt_box .sbt:hover { background:#C81B1B;} .input.code .select_box .fancy-select div.trigger { padding: 0 20px 0 13px !important; } .input.code .select_box .fancy-select div.trigger:after { width: 25px !important; height: 38px; background:url(../images/select_arrow.png) no-repeat center center;} @charset "utf-8"; /* CSS Document */ @media (max-width: 1200px) { .container { width:970px;} #header .header .right .bottom .search { margin:0 8px 0 18px; width:200px;} #nav > ul > li > a { padding:17px 8px 19px;} #header .menu.sticky #nav > ul > li > a { padding:18px 9px 19px; font-size:12px;} .three_box { margin-left:-2%;} .three_box .box { width:31.33%; margin-left:2%;} .three_box .box .detail p br { display:none;} #nav > ul > li .mega_menu .inner .link_box { width:78%; float:left;} .pdt_listing .listing .pdts .boxes { margin-left:-2%;} .pdt_listing .listing .pdts .boxes .box { width:31.33%; margin-left:2%;} .product_detail .left { width:45%;} .product_detail .left .mz-thumb { margin-bottom:10px;} .product_detail .right { width:52%;} .login_register .login_box, .login_register .reg_box, .personal_info .left, .personal_info .right { width:47%;} .billing_shipping .block .billing, .billing_shipping .block .shipping { width:47%;} .shopping_cart .links ul li a { width:225px;} .shopping_cart .cart_box .items ul.head li:nth-child(1), .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) { width:430px; } .shopping_cart .cart_box .items ul.head li:nth-child(2), .shopping_cart .cart_box .items ul.pdt_row li:nth-child(2) { width:100px; margin-right:50px; } .shopping_cart .cart_box .items ul.head li:nth-child(3), .shopping_cart .cart_box .items ul.pdt_row li:nth-child(3) { width:200px; } .shopping_cart .cart_box .items ul.head li:nth-child(4), .shopping_cart .cart_box .items ul.pdt_row li:nth-child(4) { width:122px; } .shopping_cart .cart_box .block .left.more { width:595px;} .payment .left { width:570px;} .dashboard .info .ac_info, .dashboard .info .add_info { width:48%;} .dashboard .recent_order .order_table ul li:nth-child(1) { width:100px;} .dashboard .recent_order .order_table ul li:nth-child(2) { width:140px;} .dashboard .recent_order .order_table ul li:nth-child(3) { width:120px;} .dashboard .recent_order .order_table ul li:nth-child(4) { width:125px;} .dashboard .recent_order .order_table ul li:nth-child(5) { width:200px;} .dashboard .recent_order .order_table ul li:nth-child(6) { width:175px;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(3) .bag { padding:10px 0 0 0;} .best_seller .right, .clearance .left { width:746px;} .shopping_cart .cart_box .items.history ul.head li.large:nth-child(1), .shopping_cart .cart_box .items.history ul.pdt_row li.large:nth-child(1) { width:525px; } .detail_content .detail .data .map { width:60%; } } @media (max-width: 992px) { .container { width:750px;} .three_box .box .detail p { font-size:13px;} #footer .top .right { width:330px;} #footer .top .right .subscribe .inpt_bx { width:200px;} #footer .top .left .box_1 { width:150px;} #footer .top .left .box_2 { width:130px;} #footer .top .left .box_3 { width:100px;} .best_seller .left { width:30%;} .best_seller .right { width:70%;} .clearance .left { width:70%;} .clearance .right { width:30%;} #nav > ul > li.hide { display:block;} #header .menu { border-bottom:none; } #header .header { border-bottom:3px solid #e12626; height:58px;} #nav > ul > li .mega_menu .inner .box:hover h2 { color:#e12626;} .menu_i { position:absolute; left:15px; top:20px;} .menu_i a.menu-icon { display:inline-block; } #nav { border:none; padding:0; background:#fff;} #nav ul { display:none; margin-top:20px; } #nav > ul > li { width:100%; margin:0; text-align:left; } #nav > ul > li > a { border-bottom:1px solid #e5e5e5 ;} #nav > ul > li { border-left:1px solid #e5e5e5 ; border-right:1px solid #e5e5e5 ;} #nav > ul > li:nth-child(1) { border-left:none; border-right:none;} #nav > ul > li:nth-child(2) { border-left:none; border-right:none;} #nav > ul > li:nth-child(3){ border-left:1px solid #e5e5e5 ; border-right:1px solid #e5e5e5 ;} #nav > ul > li.home { position:static;} #nav > ul > li.home a { display:block; width:100%;} #nav ul li.submenu > a:after { position:absolute; right:20px; top:50%; margin-top:-7px; width:14px; height:14px; background:url(../images/plus.png) no-repeat left center; content:" "; } #nav ul li.submenu > a.open:after { position:absolute; right:20px; top:50%; margin-top:-7px; width:14px; height:14px; background:url(../images/minus.png) no-repeat left center; content:" "; } #nav > ul > li .mega_menu { display:none; } #nav > ul > li .mega_menu .inner { min-height:0; padding:0; border:none; background:#f3f3f3;} #nav > ul > li .mega_menu .inner .link_box { float:none; width:100%;} #nav > ul > li .mega_menu .inner .brands { float:none; width:100%; padding:0; background:none; min-height:0;} #nav > ul > li .mega_menu .inner .link_box .box { float:none; width:100%; margin:0; padding:0;} #nav > ul > li .mega_menu .inner .link_box .box h2 { padding:0; margin:0; color:#e12626; position:relative; padding-right:30%;} #nav > ul > li .mega_menu .inner .link_box .box h2 a { display:block; padding:10px 15px;} #nav > ul > li .mega_menu .inner .link_box .box h2:after { width:100%; background:#e5e5e5;} #nav > ul > li .mega_menu .inner .link_box .box h2 span { display:block; position:absolute; right:0; top:0; width:50px; height:100%; background:url(../images/back_arrow.png) no-repeat center center; content:" "; cursor:pointer; transform:rotate(180deg); -webkit-transform:rotate(180deg); -moz-transform:rotate(180deg); -o-transform:rotate(180deg); -ms-transform:rotate(180deg);} #nav > ul > li .mega_menu .inner .link_box .box h2 span:hover { background-color:#fff !important;} #nav > ul > li .mega_menu .inner .link_box .box h2.open span { background:url(../images/top.png) no-repeat center center;} #nav > ul > li .mega_menu .inner .link_box .box ul { margin-top:0; padding:10px 15px; background:#fff; border-bottom:1px solid #e5e5e5 ;} #nav > ul > li .mega_menu .inner .brands h2 { margin:0; padding:0; cursor:pointer; color:#e12626;} #nav > ul > li .mega_menu .inner .brands h2 a { display:block; padding:10px 15px;} #nav > ul > li .mega_menu .inner .brands h2 span { display:block; position:absolute; right:0; top:0; width:50px; height:100%; background:url(../images/back_arrow.png) no-repeat center center; content:" "; cursor:pointer; transform:rotate(180deg); -webkit-transform:rotate(180deg); -moz-transform:rotate(180deg); -o-transform:rotate(180deg); -ms-transform:rotate(180deg);} #nav > ul > li .mega_menu .inner .brands h2 span:hover { background-color:#fff !important;} #nav > ul > li .mega_menu .inner .brands h2.open span { background:url(../images/top.png) no-repeat center center;} #nav > ul > li .mega_menu .inner .brands h2:after { width:100%; background:#e5e5e5;} #nav > ul > li .mega_menu .inner .brands ul { margin-top:0; padding:10px 15px; background:#fff; border-bottom:1px solid #e5e5e5 ;} #nav > ul > li .mega_menu .inner .brands .new_arrivals {padding:10px 15px; border-bottom:1px solid #e5e5e5 ;} #nav > ul > li .mega_menu .inner .brands .new_arrivals a { display:block;} #header .header .logo { float:none; text-align:center; padding:10px 0 10px;} #header .header .logo a { display:inline-block; max-width:200px; margin:0 auto;} #header .header .right { height:0;} #header .header .right .top a.wishlist, #header .header .right .bottom .search, #header .header .right .bottom .phone { display:none;} #header .header .right .top a.abt-icon { display:none;} #header .header .right .top a.login { position:absolute; right:15px; top:10px; font-size:0; display:none;} #header .header .right .top a.logout { position:absolute; right:15px; top:10px; font-size:0; display:none;} #header .header .right .bottom .cart { width:26px; position:absolute; right:18px; top:12px; border:none; padding-left:26px;} #header .header .right .bottom .cart a.basket { line-height:28px;} #header .header .right .bottom .cart a.basket:after { border:none; left:-34px; top:-4px;} #header .header .right .bottom .cart a.basket:hover::after { background-position: 0 0;} #header .header .right .bottom .cart a.basket { font-size:0;} .cart .cart_detail { margin-top:5px;} #header .header { position:fixed; left:0; right:0; z-index:999; background:#fff; -webkit-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out;} body { padding-top:58px !important;} #cookie .detail .txt { padding-right:50px;} #cookie .detail .head { width:140px;} #nav > ul > li.home a { height:40px; padding:0; background:#e12626 url("../images/home_icon.png") no-repeat scroll 15px center;} #nav > ul > li.submenu > a:before { display:none !important;} #nav > ul > li > a { padding:10px 15px 10px;} #top { bottom:15px; right:15px;} #nav .search { display:block;} .new_product .np .owl-prev:hover { background-position:-28px 0 !important;} .new_product .np .owl-next:hover { background-position:-58px 0 !important;} #best_seller .owl-prev, #best_seller .owl-next { opacity:1;} #clearance .owl-prev, #clearance .owl-next { opacity:1;} #header .header.sticky { position:fixed; left:0; right:0; z-index:999; background:#fff; -webkit-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out;} #nav > ul > li .mega_menu .inner .box .new_arrivals { padding-top:0; padding:0 10px;} #nav > ul > li .mega_menu .inner .box .new_arrivals a:hover { padding-left:10px;} .pdt_listing .listing .pdts .boxes { margin-left:-4%;} .pdt_listing .listing .pdts .boxes .box { width:46%; margin-left:4%;} .popup { width:100% !important;} .popup .left { width:48%;} .popup .right { width:48%;} .popup .right .row_4 .btn { margin:10px 0 0 37px;} .product_detail .right .row_4 .btn { margin:10px 0 0 37px;} .product_detail .right .row_5 .info { margin:10px 0 0 0;} .new_product .np .owl-prev { right:40px !important;} .new_product .np .owl-next { right:10px !important;} .login_register .login_box, .login_register .reg_box { padding:20px;} .billing_shipping .block .billing, .billing_shipping .block .shipping { padding:20px;} .login_register .reg_box .highlight { margin:19px -15px 0;} .billing_shipping .block .shipping .highlight { margin:0 -20px 25px;} .login_register .login_box .form .input.required:after, .login_register .reg_box .form .input.required:after { right:-10px;} .billing_shipping .block .billing .form .input.required:after, .billing_shipping .block .shipping .form .input.required:after { right:-10px;} .login_register .reg_box .form .sign .ch_label { font-size:14px;} .login_register .login_box .title span i,.login_register .reg_box .title span i { padding:0 2px;} .shopping_cart .cart_box .items ul.head li:nth-child(1), .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) { width:350px; padding-right:10px; } .shopping_cart .cart_box .items ul.head li:nth-child(2), .shopping_cart .cart_box .items ul.pdt_row li:nth-child(2) { width:100px; margin-right:10px; } .shopping_cart .cart_box .items ul.head li:nth-child(3), .shopping_cart .cart_box .items ul.pdt_row li:nth-child(3) { width:100px; } .shopping_cart .cart_box .items ul.head li:nth-child(4), .shopping_cart .cart_box .items ul.pdt_row li:nth-child(4) { width:122px; } .shopping_cart .cart_box .items ul.pdt_row li:nth-child(3) .qty { float:none;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(3) .btn { margin:10px 0 0 0;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) .img_detail { padding-top:10px;} .shopping_cart .links ul li a { width:180px;} .shopping_cart .cart_box .block .left { width:100%; margin-bottom:30px;} .shopping_cart .cart_box .block .left.more { width:100%; margin-bottom:30px;} .payment .left { width:380px;} .payment .right { width:280px;} .dashboard .info .ac_info .block_2 .link a { font-size:14px;} .dashboard .info .ac_info .block_2 .link span { padding-left:10px;} .dash_link ul li a { padding:9px 15px 8px;} .dashboard .info .add_info .block p { line-height:23px;} .dashboard .recent_order .order_table ul li:nth-child(1) { width:95px;} .dashboard .recent_order .order_table ul li:nth-child(2) { width:105px;} .dashboard .recent_order .order_table ul li:nth-child(3) { width:80px;} .dashboard .recent_order .order_table ul li:nth-child(4) { width:100px;} .dashboard .recent_order .order_table ul li:nth-child(5) { width:170px;} .dashboard .recent_order .order_table ul li:nth-child(6) { width:80px; padding-top:5px;} .dashboard .recent_order .order_table ul li .track, .dashboard .recent_order .order_table ul li .view { float:none;} .dashboard .recent_order .order_table ul li .track { margin-bottom:5px;} .dashboard .recent_order .order_table ul li a { display:block;} .login_register .login_box, .login_register .reg_box, .personal_info .left, .personal_info .right .box { padding:15px;} .personal_info .left .form .input.required:after { right:-10px;} .personal_info .right .box .form .input.required:after { right:-10px;} .personal_info .right .box .form .sign .ch_label { font-size:14px;} .popup .right .row_4 .cart_icon { margin:0 70px 0 20px;} .shopping_cart .cart_box .items.history ul.head li.large:nth-child(1), .shopping_cart .cart_box .items.history ul.pdt_row li.large:nth-child(1) { width:350px; } .detail_content .detail .data .map { width:100%; margin-bottom:30px; } .detail_content .detail .data .contact_info { width:100%;} .detail_content .detail .form .row .half { width:100%;} .detail_content .detail .form .row .half + .half { margin-top:19px;} .shopping_cart .cart_box .pay { text-align:right;} } @media (min-width: 993px) { #nav > ul { display:block !important;} #nav ul li:hover > ul { display:block; } #nav ul li ul { -webkit-animation: menuDown .3s ease-in; -moz-animation: menuDown .3s ease-in; animation:menuDown .3s ease-in; } #nav ul li ul li ul { -webkit-animation: fadeInLeft .3s ease-in; -moz-animation: fadeInLeft .3s ease-in; animation:menuRight .3s ease-in;} .shopping_cart .cart_box .items.history ul.head li:nth-child(1) { width:525px;} .shopping_cart .cart_box .items.history ul.head li:nth-child(3) { width:110px;} .shopping_cart .cart_box .items.history ul.pdt_row li:nth-child(1) { width:525px; } .shopping_cart .cart_box .items.history ul.pdt_row li:nth-child(3) { width:110px; } } @media (min-width: 768px) { .pdt_listing .sidebar .filter_content { display:block !important; } } @media (max-width: 767px) { .container { width:100%; padding:0 15px; } #footer .top .right { width:310px;} #footer .top .right .subscribe .inpt_bx { width:188px;} #footer .top .right .subscribe .sbt { background-position:7px center; padding:0 13px 0 30px; } .three_box .box .img { float:none; width:100%; text-align:center; margin-bottom:5px;} .three_box .box .detail { float:none; width:100%; text-align:center; padding:0;} .three_box .box { padding:15px 5px;} .three_box .box .detail h6 { min-height:47px;} #footer .top .left { float:none; width:100%; margin-bottom:30px;} #footer .top .left .box { width:33.33%;} #footer .top .right { float:none; width:100%; max-width:307px;} #footer .top .right .subscribe .sbt { float:left; margin-left:5px;} .best_seller .left { width:35%;} .best_seller .right { width:65%;} .clearance .left { width:65%;} .clearance .right { width:35%;} .clearance .right .block-title { font-size:24px;} #clearance .owl-prev { right:-180px;} #clearance .owl-next { right:-210px;} #sucess .data { padding:9px 10px;} .new_product h2 { padding-left:15px; padding-right:15px;} .new_product .np { padding:15px 0;} .new_product .np .item { padding:0 15px;} #cookie .detail { padding:15px 0;} #cookie .detail .head { float:none; width:100%; padding-right:30px; padding-bottom:5px;} #cookie .detail .txt { padding-right:0; max-width:100%;} #cookie .detail .close { right:15px; top:-5px;} .three_box .box .img img { margin:0;} .pdt_listing .sidebar { float:none; width:100%; position:relative; z-index:9; margin:0;} .pdt_listing .sidebar .range { overflow:hidden;} .pdt_listing .listing { float:none; width:100%; position:relative; z-index:99;} .pdt_listing .sidebar .filter_content { visibility:hidden; height:0; } .pdt_listing .sidebar.open .filter_content { visibility:visible; height:auto; } .pdt_listing .sidebar .filter_icon { display:block;} .pdt_listing .sidebar .partners > ul > li > a { transition:0s; -webkit-transition:0s;} .popup .left { width:100%; max-width:450px; margin:0 auto 20px; float:none;} .popup .right { width:100%; max-width:450px; margin:0 auto; float:none;} .popup .right .row_4 .btn { margin:0;} .fancybox-close { right:5px; top:5px;} .product_detail .left { width:100%; float:none; margin:0 0 20px; max-width:500px;} .product_detail .right { width:100%; float:none; margin:0;} .product_detail .right .row_4 .btn { margin: 0 0 0 0;} .product_detail .right .row_5 .info { margin:0 0 0 10px;} .login_register .login_box, .login_register .reg_box { width:100%; float:none;} .billing_shipping .block .billing, .billing_shipping .block .shipping { width:100%; float:none;} .login_register .login_box { margin-bottom:20px;} .billing_shipping .block .billing { margin-bottom:20px;} .login_register .login_box .form, .login_register .reg_box .form { max-width:100%;} .billing_shipping .block .billing .form, .billing_shipping .block .shipping .form { max-width:100%;} .billing_shipping .block .billing .title, .billing_shipping .block .shipping .title { max-width:100%;} .sub_title { padding:0 20px 25px;} .shopping_cart .cart_box .items ul.head { display:none;} .shopping_cart .links ul { margin-left:-2%;} .shopping_cart .links ul li { float:left; width:48%; margin-bottom:10px; margin-left:2%;} .shopping_cart .links ul li a { width:100%; font-size:13px;} .shopping_cart .links ul li + li { margin:0 0 10px 2%;} .shopping_cart .cart_box .items ul.head li:nth-child(1), .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) { width:100%; padding-right:0; margin-bottom:20px; } .shopping_cart .cart_box .items ul.head li:nth-child(2), .shopping_cart .cart_box .items ul.pdt_row li:nth-child(2) { width:100%; margin-bottom:20px; margin-right:0; text-align:left; } .shopping_cart .cart_box .items ul.pdt_row li:nth-child(2) span { display:inline-block; padding:0 0 0 10px;} .shopping_cart .cart_box .items ul.head li:nth-child(3), .shopping_cart .cart_box .items ul.pdt_row li:nth-child(3) { width:100%; margin-bottom:20px; } .shopping_cart .cart_box .items ul.head li:nth-child(4), .shopping_cart .cart_box .items ul.pdt_row li:nth-child(4) { width:100%; padding:0; text-align:left; } .shopping_cart .cart_box .items ul.pdt_row li:nth-child(3) .qty { float:left;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(3) .btn { float:left; margin:0 0 0 10px;} .shopping_cart .cart_box .items ul.pdt_row li .none { display:block; font-size:14px; color:#353535; text-transform:uppercase; line-height:14px; padding-bottom:8px; } .payment .left { width:100%; margin-bottom:20px;} .payment .right { width:100%;} .retrive .note { position:relative; padding-left:10px;} .retrive .note span { position:absolute; left:0; top:21px;} .bread_cum ul li + li:before { top:-1px;} .dash_link ul li a { margin-bottom:10px;} .dashboard .info .ac_info, .dashboard .info .add_info { width:100%;} .dashboard .info .ac_info { margin-bottom:30px;} .dashboard .recent_order .order_table ul.head { display:none;} .dashboard .recent_order .order_table .records { padding:0;} .dashboard .recent_order .order_table ul li { float:left; width:33.33% !important; padding:0; margin-bottom:15px;} .dashboard .recent_order .order_table ul { padding:0;} .dashboard .recent_order .order_table ul li span.none { display:block;} .dashboard .recent_order .order_table ul li a { display:inline; float:none;} .dashboard .recent_order .order_table ul li:nth-child(6) { padding-bottom: 14px; padding-top: 16px; } .dashboard .recent_order .order_table ul li .track { float:left !important;} .dashboard .recent_order .order_table ul li .view { float:right !important;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(3) .bag { padding:0 0 0 10px;} .dashboard .recent_order .order_table ul { padding-bottom:5px;} .dashboard .recent_order .order_table ul + ul { border-top:1px solid #e5e5e5; padding-top:15px;} .personal_info .left, .personal_info .right { width:100%;} .personal_info .left { margin-bottom:20px;} .personal_info .left .title, .personal_info .left .form, .personal_info .right .box .title_1, .personal_info .right .box .title_2, .personal_info .right .box .form { max-width:100%;} .popup .right .row_4 .cart_icon { margin:0 20px;} .billing_shipping .btn, .right_btn { text-align:center;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(2), .shopping_cart .cart_box .items ul.pdt_row li:nth-child(2).offer, .shopping_cart .cart_box .items ul.pdt_row li:nth-child(4) { margin-top:0;} .shopping_cart .cart_box .items.history ul.head li.large:nth-child(1), .shopping_cart .cart_box .items.history ul.pdt_row li.large:nth-child(1) { width:100%; } .dash_link ul { margin-left:-2%;} .dash_link ul li { width:48%; margin-left:2%; text-align:center;} .dash_link ul li a { font-size:12px;} .detail_content .link { float:none; width:100%; margin:0 0 30px;} .detail_content .detail { overflow:visible;} } @media (max-width: 640px) { .best_seller .left { float:none; width:100%;} .best_seller .right { float:none; width:100%; padding-top:0; border:none; padding:0 0 20px 0;} .best_seller .right .item { padding:0 15px;} #best_seller .owl-prev { left:auto; right:49px; top:30px;} #best_seller .owl-next { left:auto; right:19px; top:30px;} #best_seller { position:static;} .best_seller { position:relative;} .best_seller .left .block-title { padding:15px 15px; line-height:28px;} .best_seller .left .txt { padding:15px 15px;} .best_seller .left .txt p { line-height:20px; padding-bottom:10px;} .clearance .left { float:none; width:100%; border:none; padding:0 0 20px;} .clearance .left .item { padding:0 15px;} .clearance .right { float:none; width:100%; padding-top:0;} #clearance .owl-prev { left:auto; right:49px; top:20px;} #clearance .owl-next { left:auto; right:19px; top:20px;} #clearance { position:static;} .clearance { position:relative;} .clearance .right .block-title { padding:15px 15px; line-height:28px;} .clearance .right .txt { padding:15px 15px;} .clearance .right .txt p { line-height:20px; padding-bottom:10px;} .glance .left { float:none; width:100%; position:static;} .glance .left span { position:static; padding:40px 0;transform:translateY(0); -webkit-transform:translateY(0); -moz-transform:translateY(0); -o-transform:translateY(0); -ms-transform:translateY(0);} .glance .right { float:none; width:100%; padding:15px;} .brand .item a { width:100%;} .three_box { margin-left:0;} .three_box .box { width:100%; margin:0;} .three_box .box + .box { margin-top:20px;} .three_box .box .detail h6 { min-height:0;} .three_box .box .detail p br { display:block;} .shopping_cart .cart_box .block .left .two_box .box { float:none; width:100%;} .shopping_cart .cart_box .block .left .two_box .box + .box { float:none; margin-top:20px;} } @media (max-width: 600px) { .new_product .np .owl-next { right:15px;} .dashboard .recent_order .order_table ul li { width:50% !important; } #sucess .data p { padding-right:30px;} } @media (max-width: 568px) { #footer .top .left .box { width:100%; float:none;} #footer .top .left .box + .box { margin-top:30px;} #footer .top .right .subscribe .inpt_bx { width:152px;} #footer .bottom .left { float:none; text-align:center;} #footer .bottom .left p { float:none; text-align:center;} #footer .bottom .left .social { display:block; float:none; text-align:center; margin:0; padding:10px 0 0;} #footer .bottom .left .social a { display:inline-block; float:none;} #footer .bottom .right { float:none; text-align:center;} #footer .bottom .right a { display:inline-block;} #header .header .logo { padding:13px 0;} #header .header .logo a { max-width:150px;} .product_detail .right .row_5 .socail { float:none} .product_detail .right .row_5 .info { float:none; margin:10px 0 0 0;} .product_detail .right .row_4 .qty { float:none;} .product_detail .right .row_4 .qty .inpt_bx { width:150px;} .product_detail .right .row_4 .cart_icon { float:none; margin-left:37px; margin-top:10px; width:150px;} .product_detail .right .row_4 .btn { margin:10px 0 0 37px;} .product_detail .right .row_4 .btn { width:150px; text-align:center;} .o_detail ul li { width:33.33%;} .detail_content .detail .title { padding-left:25px; padding-right:25px;} .detail_content .detail .data { padding:15px;} } @media (max-width: 480px) { #sucess .data p { font-size:12px; text-align:left;} #sucess .data i { font-style:normal; display:block; width:100%;} #sucess .data p span { font-size:14px;} .popup .right .row_4 .btn { margin: 10px 0 0 37px;} .new_product h2 { padding-left:20px;} .new_product .np .owl-prev { right:50px;} .new_product .np .owl-next { right:20px;} .cart .cart_detail { width:100%; min-width:272px;} .cart .cart_detail .item_added .sub_detail .btns a { width:120px;} .new_product h2 { font-size:20px; padding-top:13px;} #footer .bottom .left p { font-size:12px;} .new_product .np .owl-prev, .new_product .np .owl-next { top:-37px;} #sucess .data p { max-width:100%; margin:0 auto; display:block;} .db { min-height:0 !important;} .pdt_listing .listing .pdts .boxes { margin-left:0;} .pdt_listing .listing .pdts .boxes .box { width:100%; float:none; margin-left:0;} .pdt_listing .listing .middle .left { float:none; padding-bottom:5px;} .pdt_listing .listing .middle .right { float:none;} .popup .left .mz-thumb { margin-bottom:5px;} .popup .right .row_1 .code { float:none;} .popup .right .row_1 .b_img { float:none;} .popup .right .row_4 .qty { float:none; width:100%; margin-bottom:10px;} .popup .right .row_4 .qty .inpt_bx { width:150px;} .popup .right .row_4 .cart_icon { float:none; margin-left:37px; width:150px;} .popup .right .row_4 .btn.stock { width:150px; text-align:center;} .popup .right .row_5 .pd_detail { width:150px; text-align:center; font-size:13px;} .popup .right .row_5 .pd_detail { margin-left:37px;} .popup .right .row_3 i { padding-right:10px;} .product_detail { padding:10px;} .product_detail .right .row_1 .code { float:none;} .product_detail .right .row_1 .b_img { float:none;} .bread_cum ul { float:none;} .bread_cum .back { float:none; padding-top:10px;} .login_register .login_box .title span, .login_register .reg_box .title span { display:block;} .login_register .login_box .title span i,.login_register .reg_box .title span i { display:none;} .login_register .reg_box .form .sign .ch_label { padding-left:25px;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) .img { margin-right:10px;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) .img a { width:80px; line-height:80px; padding:5px;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) .img_detail { padding-top:10px;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) .img_detail .name { font-size:16px;} .shopping_cart .cart_box .items ul.pdt_row li:nth-child(1) .img_detail .code span i { padding:0 2px;} .shopping_cart .cart_box { padding:15px;} .shopping_cart .cart_box .block .right .btn a { display:block; text-align:center;} .shopping_cart .cart_box .block .right .btn a + a { margin:10px 0 0 0;} .shopping_cart .cart_box .block .right { max-width:100%;} .shopping_cart .cart_box .block .right .total { margin:0;} .shopping_cart .cart_box .title { padding:10px 0;} .payment .left .bg_box .ra_label .radio { margin-right:13px !important;} .payment .left .bg_box .detail { padding-left:31px;} .payment .left .bg_box { padding:15px;} .payment .right .total { margin-left:0;} .payment .right .box { padding:15px;} .payment_done p br { display:none;} .payment_done .btn a { display:block;} .payment_done .btn a + a { margin-left:0; margin-top:10px;} .retrive { padding:15px;} .retrive .form .input.required:after { right:-10px;} .retrive .form .sbt_box .sbt { padding:0 30px;} .retrive .title { padding-left:25px;} .login_register .login_box .form .sbt_box { margin-top:10px;} .login_register .login_box .form .sbt_box .forgot { float:none; text-align:center;} .login_register .login_box .form .sbt_box .sbt { float:none; width:100%;} .login_register .login_box .title { padding-top:3px;} .login_register .reg_box .title { padding-top:1px;} .login_register .reg_box .form .gender .ra_label { line-height:19px;} .billing_shipping .block .shipping .highlight .ra_label .radio { margin-bottom:5px !important;} .dashboard .top, .dashboard .recent_order, .dashboard .info .ac_info .block_1, .dashboard .info .ac_info .block_2, .dashboard .info .add_info .block { padding-left:15px; padding-right:15px;} .dashboard .info .ac_info .block_2 .link span { display:block; padding:5px 0 0 0;} .dashboard .info .ac_info .block_1 ul li span { width:80px;} .dashboard .recent_order .order_table ul li .track, .dashboard .recent_order .order_table ul li .view { float:none !important; width:100% !important; display:block !important;} .dashboard .recent_order .order_table ul li:nth-child(6) { padding:0 0 0 0;} .o_detail ul li { width:100%;} .o_detail ul li + li { margin-top:20px;} .o_detail ul li span { padding-bottom:5px;} .personal_info .right .box .form .sign .ch_label { padding-left:25px;} #sucess .data p b { display:block;} } @media (max-device-width: 480px) and (orientation: landscape) { #nav ul { max-height: 200px; overflow-y:auto;} } @media (max-width: 360px) { } @media (max-width: 320px) { }