@font-face { font-family: 'robotomedium_italic'; src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-mediumitalic-webfont.eot'); src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-mediumitalic-webfont.eot?#iefix') format('embedded-opentype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-mediumitalic-webfont.woff2') format('woff2'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-mediumitalic-webfont.woff') format('woff'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-mediumitalic-webfont.ttf') format('truetype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-mediumitalic-webfont.svg#robotomedium_italic') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'robotoregular'; src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-regular-webfont.eot'); src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-regular-webfont.eot?#iefix') format('embedded-opentype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-regular-webfont.woff2') format('woff2'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-regular-webfont.woff') format('woff'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-regular-webfont.ttf') format('truetype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-regular-webfont.svg#robotoregular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'robotothin'; src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-thin-webfont.eot'); src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-thin-webfont.eot?#iefix') format('embedded-opentype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-thin-webfont.woff2') format('woff2'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-thin-webfont.woff') format('woff'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-thin-webfont.ttf') format('truetype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-thin-webfont.svg#robotothin') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'robotothin_italic'; src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-thinitalic-webfont.eot'); src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-thinitalic-webfont.eot?#iefix') format('embedded-opentype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-thinitalic-webfont.woff2') format('woff2'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-thinitalic-webfont.woff') format('woff'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-thinitalic-webfont.ttf') format('truetype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-thinitalic-webfont.svg#robotothin_italic') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'robotoitalic'; src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-italic-webfont.eot'); src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-italic-webfont.eot?#iefix') format('embedded-opentype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-italic-webfont.woff2') format('woff2'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-italic-webfont.woff') format('woff'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-italic-webfont.ttf') format('truetype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-italic-webfont.svg#robotoitalic') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'robotolight'; src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-light-webfont.eot'); src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-light-webfont.eot?#iefix') format('embedded-opentype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-light-webfont.woff2') format('woff2'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-light-webfont.woff') format('woff'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-light-webfont.ttf') format('truetype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-light-webfont.svg#robotolight') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'robotolight_italic'; src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-lightitalic-webfont.eot'); src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-lightitalic-webfont.eot?#iefix') format('embedded-opentype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-lightitalic-webfont.woff2') format('woff2'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-lightitalic-webfont.woff') format('woff'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-lightitalic-webfont.ttf') format('truetype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-lightitalic-webfont.svg#robotolight_italic') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'robotomedium'; src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-medium-webfont.eot'); src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-medium-webfont.eot?#iefix') format('embedded-opentype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-medium-webfont.woff2') format('woff2'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-medium-webfont.woff') format('woff'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-medium-webfont.ttf') format('truetype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-medium-webfont.svg#robotomedium') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'robotoblack'; src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-black-webfont.eot'); src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-black-webfont.eot?#iefix') format('embedded-opentype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-black-webfont.woff2') format('woff2'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-black-webfont.woff') format('woff'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-black-webfont.ttf') format('truetype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-black-webfont.svg#robotoblack') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'robotoblack_italic'; src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-blackitalic-webfont.eot'); src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-blackitalic-webfont.eot?#iefix') format('embedded-opentype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-blackitalic-webfont.woff2') format('woff2'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-blackitalic-webfont.woff') format('woff'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-blackitalic-webfont.ttf') format('truetype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-blackitalic-webfont.svg#robotoblack_italic') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'robotobold'; src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-bold-webfont.eot'); src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-bold-webfont.eot?#iefix') format('embedded-opentype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-bold-webfont.woff2') format('woff2'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-bold-webfont.woff') format('woff'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-bold-webfont.ttf') format('truetype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-bold-webfont.svg#robotobold') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'robotobold_italic'; src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-bolditalic-webfont.eot'); src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-bolditalic-webfont.eot?#iefix') format('embedded-opentype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-bolditalic-webfont.woff2') format('woff2'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-bolditalic-webfont.woff') format('woff'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-bolditalic-webfont.ttf') format('truetype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/roboto-bolditalic-webfont.svg#robotobold_italic') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'iconfont'; src:url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/icomoon.eot?-d5e2v'); src:url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/icomoon.eot?#iefix-d5e2v') format('embedded-opentype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/icomoon.ttf?-d5e2v') format('truetype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/icomoon.woff?-d5e2v') format('woff'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/icomoon.svg?-d5e2v#icomoon') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'fontello'; src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/fontello.eot?95752708'); src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/fontello.eot?95752708#iefix') format('embedded-opentype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/fontello.woff2?95752708') format('woff2'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/fontello.woff?95752708') format('woff'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/fontello.ttf?95752708') format('truetype'), url('https://www.tudecora.com/skin/frontend/onestic/tudecora/fonts/fontello.svg?95752708#fontello') format('svg'); font-weight: normal; font-style: normal; } [class^="icon-"], [class*=" icon-"] { font-family: 'iconfont'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-paint:before { content: "\e622"; } .icon-client2:before { content: "\e623"; } .icon-american:before { content: "\e600"; } .icon-arrow-forward:before { content: "\e601"; } .icon-arrow:before { content: "\e602"; } .icon-check:before { content: "\e603"; } .icon-chevron-left:before { content: "\e604"; } .icon-chevron-right:before { content: "\e605"; } .icon-close-black:before { content: "\e606"; } .icon-delivery:before { content: "\e607"; } .icon-email:before { content: "\e608"; } .icon-expand-less:before { content: "\e609"; } .icon-expand-more:before { content: "\e60a"; } .icon-facebook:before { content: "\e60b"; } .icon-google-plus:before { content: "\e60c"; } .icon-linkedin:before { content: "\e60d"; } .icon-locked:before { content: "\e60e"; } .icon-mail-black:before { content: "\e60f"; } .icon-mastercard:before { content: "\e610"; } .icon-more-black:before { content: "\e611"; } .icon-more-horizontal:before { content: "\e612"; } .icon-paypal:before { content: "\e613"; } .icon-pinterest:before { content: "\e614"; } .icon-refresh:before { content: "\e615"; } .icon-right:before { content: "\e616"; } .icon-schedule:before { content: "\e617"; } .icon-search-black:before { content: "\e618"; } .icon-shopping-cart:before { content: "\e619"; } .icon-tag:before { content: "\e61a"; } .icon-twitter:before { content: "\e61b"; } .icon-view-list:before { content: "\e61c"; } .icon-view-module:before { content: "\e61d"; } .icon-visa-black:before { content: "\e61e"; } .icon-visa:before { content: "\e61f"; } .icon-youtube:before { content: "\e620"; } .icon-zoom-in:before { content: "\e621"; } /**** FONTELLO ****/ /* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */ /* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */ /* @media screen and (-webkit-min-device-pixel-ratio:0) { @font-face { font-family: 'fontello'; src: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/font/fontello.svg?95752708#fontello') format('svg'); } } */ [class^="icon-fontello-"]:before, [class*=" icon-fontello-"]:before { font-family: "fontello"; font-style: normal; font-weight: normal; speak: never; display: inline-block; text-decoration: inherit; width: 1em; margin-right: .2em; text-align: center; /* opacity: .8; */ /* For safety - reset parent styles, that can break glyph codes*/ font-variant: normal; text-transform: none; /* fix buttons height, for twitter bootstrap */ line-height: 1em; /* Animation center compensation - margins should be symmetric */ /* remove if not needed */ margin-left: .2em; /* you can be more comfortable with increased icons size */ /* font-size: 120%; */ /* Font smoothing. That was taken from TWBS */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; /* Uncomment for 3D effect */ /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */ } .icon-fontello-instagram-1:before { content: '\f32d'; margin: 0 0 0 1px; } /* '' */ /* == 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: none; touch-action: none; /* MSPointer events - direct all pointer events to js */ } .mCustomScrollbar.mCS_no_scrollbar{ -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; height: auto; width: 100% !important; } /* ------------------------------------------------------------------------------------------------------------------------ 2. VERTICAL SCROLLBAR y-axis ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_inside > .mCSB_container{ margin-right: 30px; } .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_scrollTools{ /* contains scrollbar markup (draggable element, dragger rail, buttons etc.) */ position: absolute; width: 16px; height: auto; left: auto; top: 0; right: 0; bottom: 0; } .mCSB_outside + .mCSB_scrollTools{ right: -4px; } /* 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_draggerRail{ width: 2px; height: 100%; margin: 0 auto; -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; } .mCSB_scrollTools .mCSB_dragger{ /* the draggable element */ cursor: pointer; width: 100%; height: 30px; /* minimum dragger height */ z-index: 1; } .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ /* the dragger element */ position: relative; width: 4px; height: 100%; margin: 0 auto; -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; text-align: center; } .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; } .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; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden > .mCSB_container{ padding-bottom: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .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: 0; filter: "alpha(opacity=0)"; -ms-filter: "alpha(opacity=0)"; } .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_dragger .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.75); filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; } .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); filter: "alpha(opacity=85)"; -ms-filter: "alpha(opacity=85)"; } .mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.9); filter: "alpha(opacity=90)"; -ms-filter: "alpha(opacity=90)"; } .mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonDown, .mCSB_scrollTools .mCSB_buttonLeft, .mCSB_scrollTools .mCSB_buttonRight{ background-image: url(https://www.tudecora.com/skin/frontend/onestic/tudecora/css/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 .mCSB_draggerRail{ background-color: #fff; background-color: rgba(255,255,255,0.15); } .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; } .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: 14px; margin: 0 1px; } .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: #D5D5D5; border-radius:0; } .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: #676664; } .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); } /* ---------------------------------------- */ /*! 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: #ffffff; 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-prev span, .fancybox-next span { background-image: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/images/fancybox_arrows.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('https://www.tudecora.com/skin/frontend/onestic/tudecora/images/fancybox_loading.gif') center center no-repeat; } .fancybox-close { position: absolute; top: 0px; right: -55px; width: 45px; height: 45px; cursor: pointer; z-index: 8040; background: transparent url('https://www.tudecora.com/skin/frontend/onestic/tudecora/images/close-fancybox.png') no-repeat; } .cms-home .fancybox-close { top: 0px; right: 0px; width: 28px; height: 26px; background: transparent url('https://www.tudecora.com/skin/frontend/onestic/tudecora/images/close-fancybox-grey.png') no-repeat; } .fancybox-nav { position: absolute; top: 0; width: 40%; height: 100%; cursor: pointer; text-decoration: none; background: transparent url('https://www.tudecora.com/skin/frontend/onestic/tudecora/images/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: 35px; height: 30px; margin-top: -18px; cursor: pointer; z-index: 8040; visibility: hidden; } .fancybox-prev span { left: 2px; background-position: 0 0px; } .fancybox-next span { right: 2px; background-position: 35px 0px; } .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('https://www.tudecora.com/skin/frontend/onestic/tudecora/images/fancybox_overlay.png'); } .fancybox-overlay-fixed { position: fixed; bottom: 0; right: 0; } .fancybox-lock .fancybox-overlay { overflow: auto; overflow-y: scroll; z-index: 99999; } /* 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 */ -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 div { background-image: url('https://www.tudecora.com/skin/frontend/onestic/tudecora/images/fancybox_loading@2x.gif'); background-size: 24px 24px; /*The size of the normal image, half the size of the hi-res image*/ } } /* // ---------------------------------------------- // Usage example: // For IE set $mq-support to false. // Set the fixed value. // Then use mixins to test whether styles should be applied. // ---------------------------------------------- $mq-support: false; $mq-fixed-value: 1024; // Renders at fixed value @include bp (min-width, 300px) { div { color:#000; } } // Doesn't render without MQ support @include bp (min-width, 1200px) { div { color:#FFF; } } // Doesn't render without MQ support @include bp (max-width, 300px) { div { color:#444; } } // Renders at fixed value @include bp (max-width, 1200px) { div { color:#888; } } // ---------------------------------------------- */ /** * Magento * * NOTICE OF LICENSE * * This source file is subject to the Academic Free License (AFL 3.0) * that is bundled with this package in the file LICENSE_AFL.txt. * It is also available through the world-wide-web at this URL: * http://opensource.org/licenses/afl-3.0.php * If you did not receive a copy of the license and are unable to * obtain it through the world-wide-web, please send an email * to license@magentocommerce.com so we can send you a copy immediately. * * DISCLAIMER * * Do not edit or add to this file if you wish to upgrade Magento to newer * versions in the future. If you wish to customize Magento for your * needs please refer to http://www.magentocommerce.com for more information. * * @category design * @package default_default * @copyright Copyright (c) 2014 Magento Inc. (http://www.magentocommerce.com) * @license http://opensource.org/licenses/afl-3.0.php Academic Free License (AFL 3.0) */ /*! normalize.css v2.0.1 | MIT License | git.io/normalize */ /* ========================================================================== HTML5 display definitions ========================================================================== */ /* * Corrects `block` display not defined in IE 8/9. */ article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary { display: block; } /* * Corrects `inline-block` display not defined in IE 8/9. */ audio, canvas, video { display: inline-block; } /* * Prevents modern browsers from displaying `audio` without controls. * Remove excess height in iOS 5 devices. */ audio:not([controls]) { display: none; height: 0; } /* * Addresses styling for `hidden` attribute not present in IE 8/9. */ [hidden] { display: none; } /* ========================================================================== Base ========================================================================== */ /* * 1. Sets default font family to sans-serif. * 2. Prevents iOS text size adjust after orientation change, without disabling * user zoom. */ html { font-family: sans-serif; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ -ms-text-size-adjust: 100%; /* 2 */ } /* * Removes default margin. */ body { margin: 0; } /* ========================================================================== Links ========================================================================== */ /* * Addresses `outline` inconsistency between Chrome and other browsers. */ a:focus { outline: thin dotted; } /* * Improves readability when focused and also mouse hovered in all browsers. */ a:active, a:hover { outline: 0; } /* ========================================================================== Typography ========================================================================== */ /* * Addresses `h1` font sizes within `section` and `article` in Firefox 4+, * Safari 5, and Chrome. */ h1 { font-size: 2em; } /* * Addresses styling not present in IE 8/9, Safari 5, and Chrome. */ abbr[title] { border-bottom: 1px dotted; } /* * Addresses style set to `bolder` in Firefox 4+, Safari 5, and Chrome. */ b, strong { font-weight: bold; } /* * Addresses styling not present in Safari 5 and Chrome. */ dfn { font-style: italic; } /* * Addresses styling not present in IE 8/9. */ mark { background: #ff0; color: #000; } /* * Corrects font family set oddly in Safari 5 and Chrome. */ code, kbd, pre, samp { font-family: monospace, serif; font-size: 1em; } /* * Improves readability of pre-formatted text in all browsers. */ pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; } /* * Sets consistent quote types. */ q { quotes: "\201C" "\201D" "\2018" "\2019"; } /* * Addresses inconsistent and variable font size in all browsers. */ small { font-size: 80%; } /* * Prevents `sub` and `sup` affecting `line-height` in all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } /* ========================================================================== Embedded content ========================================================================== */ /* * Removes border when inside `a` element in IE 8/9. */ img { border: 0; } /* * Corrects overflow displayed oddly in IE 9. */ svg:not(:root) { overflow: hidden; } /* ========================================================================== Figures ========================================================================== */ /* * Addresses margin not present in IE 8/9 and Safari 5. */ figure { margin: 0; } /* ========================================================================== Forms ========================================================================== */ /* * Define consistent border, margin, and padding. */ fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } /* * 1. Corrects color not being inherited in IE 8/9. * 2. Remove padding so people aren't caught out if they zero out fieldsets. */ legend { border: 0; /* 1 */ padding: 0; /* 2 */ } /* * 1. Corrects font family not being inherited in all browsers. * 2. Corrects font size not being inherited in all browsers. * 3. Addresses margins set differently in Firefox 4+, Safari 5, and Chrome */ button, input, select, textarea { font-family: inherit; /* 1 */ font-size: 100%; /* 2 */ margin: 0; /* 3 */ } /* * Addresses Firefox 4+ setting `line-height` on `input` using `!important` in * the UA stylesheet. */ button, input { line-height: normal; } /* * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` * and `video` controls. * 2. Corrects inability to style clickable `input` types in iOS. * 3. Improves usability and consistency of cursor style between image-type * `input` and others. */ button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ } /* * Re-set default cursor for disabled elements. */ button[disabled], input[disabled] { cursor: default; } /* * 1. Addresses box sizing set to `content-box` in IE 8/9. * 2. Removes excess padding in IE 8/9. */ input[type="checkbox"], input[type="radio"] { -webkit-box-sizing: border-box; box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } /* * 1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome. * 2. Addresses `box-sizing` set to `border-box` in Safari 5 and Chrome * (include `-moz` to future-proof). */ input[type="search"] { -webkit-appearance: textfield; /* 1 */ -webkit-box-sizing: content-box; /* 2 */ box-sizing: content-box; } /* * Removes inner padding and search cancel button in Safari 5 and Chrome * on OS X. */ input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /* * Removes inner padding and border in Firefox 4+. */ button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } /* * 1. Removes default vertical scrollbar in IE 8/9. * 2. Improves readability and alignment in all browsers. */ textarea { overflow: auto; /* 1 */ vertical-align: top; /* 2 */ } /* ========================================================================== Tables ========================================================================== */ /* * Remove most spacing between table cells. */ table { border-collapse: collapse; border-spacing: 0; } /* ============================================ * * Reset * ============================================ */ *, *:before, *:after { -webkit-box-sizing: border-box; box-sizing: border-box; margin: 0; padding: 0; } html { -webkit-tap-highlight-color: transparent; /* Prevent tap highlight on iOS/Android */ -webkit-text-size-adjust: 100%; /* Prevent automatic scaling on iOS */ } body { background: #FFFFFF; color: #000000; line-height: 1; } html, body, img, fieldset, abbr, acronym { border: 0; } h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; } th, code, cite, caption { font-weight: normal; font-style: normal; text-align: left; } address { font-style: normal; } fieldset { margin: 0; padding: 0; border: 0; } img { display: block; } ol, ul { list-style: none; } q:before, q:after { content: ''; } input:focus, input[type="search"]:focus { outline-offset: -2px; } input[type="search"] { -webkit-appearance: none; /* 1 */ -webkit-box-sizing: border-box; /* 2 */ box-sizing: border-box; } /* ============================================ * * Base Styles * ============================================ */ @-ms-viewport { width: device-width; } @viewport { width: device-width; } a, button { -ms-touch-action: manipulation; touch-action: manipulation; } body, button, input, select, table, textarea { font-family: "robotoregular", Verdana, Arial, sans-serif; color: #636363; font-size: 14px; line-height: 1.5; } a { color: #636363; text-decoration: none; outline: 0; } a:hover { color: #1F983E; } a:focus { outline: 0; } ol, ul { list-style: none; margin: 0; padding: 0; } /* ============================================ * * Typography * ============================================ */ h1, .h1 { margin: 0; margin-bottom: 0.7em; color: #636363; font-family: "robotomedium", Verdana, Arial, sans-serif; font-size: 28px; font-style: normal; line-height: 1.2; text-rendering: optimizeLegibility; } h2, .h2 { margin: 0; margin-bottom: 0.5em; color: #636363; font-family: "robotomedium", Verdana, Arial, sans-serif; font-size: 24px; font-style: normal; line-height: 1.2; text-rendering: optimizeLegibility; } h3, .h3 { margin: 0; margin-bottom: 0.5em; color: #636363; font-family: "robotomedium", Verdana, Arial, sans-serif; font-size: 18px; font-style: normal; line-height: 1.4; text-rendering: optimizeSpeed; } h4, .h4 { margin: 0; margin-bottom: 0.5em; color: #636363; font-family: "robotomedium", Verdana, Arial, sans-serif; font-size: 14px; font-style: normal; line-height: 1.4; text-rendering: optimizeSpeed; } h5, .h5 { margin: 0; margin-bottom: 0.5em; color: #636363; font-family: "robotomedium", Verdana, Arial, sans-serif; font-size: 13px; font-style: normal; line-height: 1.4; text-rendering: optimizeSpeed; } h6, .h6 { margin: 0; margin-bottom: 5px; color: #636363; font-family: "robotomedium", Verdana, Arial, sans-serif; font-size: 12px; font-weight: bold; font-style: normal; line-height: 1.4; text-rendering: optimizeSpeed; } .page-title, .title { position: relative; margin: 1em 0; padding-left: 15px; } .page-title:after, .title:after { content: ''; display: table; clear: both; } .inline-icon { margin-right: 5px; } /* ============================================ * * Shared Classes * ============================================ */ .address-list address { margin-bottom: 1em; } .availability { margin-bottom: 0; font-size: 13px; text-transform: uppercase; } .availability .label { display: none; } .availability.in-stock { color: #11B400; } .availability.available-soon, .availability.out-of-stock { color: #DF280A; } .availability-only { color: #DF280A; margin-bottom: 10px; } /* -------------------------------------------- * * Block Module */ .block, .col-left-first { margin-bottom: 20px; float: left; width: 100%; } .col-left-first .block:last-of-type { margin-bottom: 0; } .block-title { position: relative; } .block-title h2, .block-title h3, .block-title strong { margin: 20px 0; padding: 0 20px; font-size: 18px; text-transform: uppercase; } .block-title small { font-size: 100%; font-weight: normal; color: #A0A0A0; } body:not(.customer-account) .block:first-child .block-title { border-top: none; padding-top: 0; } .block-subtitle { font-weight: bold; margin-bottom: 7px; } .block-content { margin-top: 5px; } .block-content.unpad { padding: 0; } .block-content li.item { margin: 0 0 10px 9px; } .block-content li.item:last-child { margin-bottom: 0; } .block .actions { margin: 10px 0 0; } .block .actions:after { content: ''; display: table; clear: both; } .block .actions a { float: left; } .block .actions .button { float: right; } .col-left .block .actions .button ~ a, .col-right .block .actions .button ~ a { line-height: 33px; margin-right: 5px; } @media only screen and (max-width: 770px) { .sidebar .block:not(.block-layered-nav) { margin-bottom: 0; } .sidebar .block:not(.block-layered-nav) .block-title { padding: 0; margin-top: 0; border-bottom: none; border-top: none; margin-bottom: 0; } .sidebar .block:not(.block-layered-nav) .block-title > strong { margin: 0; margin-bottom: 10px; color: #636363; font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 14px; font-weight: bold; font-style: normal; line-height: 1.4; text-rendering: optimizeSpeed; -moz-user-select: none; -ms-user-select: none; -webkit-user-select: none; -o-user-select: none; user-select: none; font-weight: normal; margin-bottom: 0px; padding: 7px 10px; position: relative; background-color: #E0E0E0; display: block; width: 100%; cursor: pointer; border-bottom: 0; } .sidebar .block:not(.block-layered-nav) .block-title > strong:after { content: ''; position: absolute; width: 0; height: 0; display: block; border-top: 4px solid transparent; border-bottom: 4px solid transparent; border-left: 4px solid #159939; border-right: none; left: 10px; top: 50%; margin-top: -3px; } .sidebar .block:not(.block-layered-nav) .block-title.active > strong { margin: 0; margin-bottom: 10px; color: #636363; font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 14px; font-weight: bold; font-style: normal; line-height: 1.4; text-rendering: optimizeSpeed; -moz-user-select: none; -ms-user-select: none; -webkit-user-select: none; -o-user-select: none; user-select: none; font-weight: normal; margin-bottom: 0px; padding: 7px 10px; position: relative; background-color: #E0E0E0; } .sidebar .block:not(.block-layered-nav) .block-title.active > strong:after { content: ''; position: absolute; width: 0; height: 0; display: block; border-right: 4px solid transparent; border-left: 4px solid transparent; border-top: 4px solid #159939; border-bottom: none; left: 10px; top: 50%; margin-top: -3px; } .sidebar .block:not(.block-layered-nav) .block-content { padding: 10px; margin-top: 0; border-width: 0 1px; border-style: solid; border-color: #CCCCCC; } .sidebar .block:last-of-type { border-bottom: 1px solid #CCCCCC; } } /* -------------------------------------------- * * Secondary Navigation */ .block-account .block-title, .block-cms-menu .block-title { padding-top: 0; border-top: none; } .block-account li, .block-cms-menu li { margin: 7px 0; } .block-account li strong, .block-cms-menu li strong { font-weight: 400; color: #159939; } .block-account li a, .block-cms-menu li a { color: #636363; } .block-account li a:hover, .block-cms-menu li a:hover { color: #159939; } /* ============================================ * * Buttons * ============================================ */ /* Secondary Buttons */ .cart .buttons-set .button, .cart-table .button, .sidebar .actions .button, .button.button-secondary { background: #DDDDDD; color: #636363; padding: 7px 15px; } .cart .buttons-set .button:hover, .cart-table .button:hover, .sidebar .actions .button:hover, .button.button-secondary:hover { background: #d0d0d0; cursor: pointer; } .cart .buttons-set .button:active, .cart-table .button:active, .sidebar .actions .button:active, .button.button-secondary:active { background: #c4c4c4; color: #636363; } .cart .buttons-set .button:focus, .cart-table .button:focus, .sidebar .actions .button:focus, .button.button-secondary:focus { color: #636363; background: #c4c4c4; outline: none; } .sidebar .actions button.button { white-space: normal; } /* Primary Buttons */ .button, .btn, .cart-table .product-cart-actions .button, #co-shipping-method-form .buttons-set .button, .footer .button { display: inline-block; width: auto; height: 42px; line-height: 42px; margin: 0; padding: 0 15px; font: 14px/42px robotomedium, Verdana, Arial, sans-serif; text-align: center; color: #ffffff; text-transform: uppercase; text-decoration: none; background-color: #159939; border: 0; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-transition: all 0.3s ease-in; -webkit-transition-delay: 0s; -webkit-transition: all 0.3s ease-in 0s; transition: all 0.3s ease-in 0s; cursor: pointer; } .button:hover, .btn:hover, .cart-table .product-cart-actions .button:hover, #co-shipping-method-form .buttons-set .button:hover, .footer .button:hover { background-color: #44AA5E; color: #ffffff; } .button:active, .button:focus, .btn:active, .btn:focus, .cart-table .product-cart-actions .button:active, .cart-table .product-cart-actions .button:focus, #co-shipping-method-form .buttons-set .button:active, #co-shipping-method-form .buttons-set .button:focus, .footer .button:active, .footer .button:focus { border: 0; } /* Disabled - class for anchor, state for form elements */ .button.disabled, .button:disabled { background: #C8C8C8; opacity: 0.6; cursor: not-allowed; } /* Adjacent buttons */ .button + .button { margin-left: 5px; } .button2 { border: 0; padding: 0 5px; margin: 0; background: transparent; cursor: pointer; vertical-align: middle; } .button2:focus { outline: none; } .button2 span, .button2 span span { line-height: 30px; height: 30px; text-decoration: underline; text-transform: uppercase; display: inline-block; color: #159939; font-family: "robotobold", Verdana, Arial, sans-serif; } .button2 span:hover, .button2 span span:hover { text-decoration: none; color: #0c5620; } @media only screen and (max-width: 770px) { .col2-set .buttons-set .button, .col2-set .buttons-set .button2 { float: none; width: 100%; margin-left: 0; margin-right: 0; } .col2-set .buttons-set .back-link { display: none; } .col2-set .buttons-set .required { display: none; } } @media only screen and (max-width: 479px) { .buttons-set .button { float: none; width: 100%; margin-left: 0; margin-right: 0; margin-bottom: 7px; } .buttons-set .back-link { display: none; } .buttons-set .required { display: none; } } /* -------------------------------------------- * * Paypal Button */ .paypal-logo.paypal-after { float: left; } .paypal-after .paypal-or { float: left; } .paypal-or { line-height: 34px; margin: 0px 10px 5px; } .paypal-after .paypal-button { float: left; } .paypal-button { line-height: 0px; } .paypal-button img { display: inline; } @media only screen and (max-width: 740px) { .paypal-or { line-height: 20px; } .paypal-logo, .paypal-or, .paypal-button { text-align: center; width: 100%; display: block; margin-right: 0; margin-left: 0; float: none; } } /* -------------------------------------------- * * Button Sets */ .buttons-set { clear: both; margin: 10px 0 0; padding-top: 10px; border-top: 1px solid #EDEDED; text-align: right; } .buttons-set p.required { margin: 0; margin-left: 10px; line-height: 33px; float: right; } .buttons-set .back-link { float: left; margin: 0; line-height: 33px; } .buttons-set a:not(.button) { line-height: 20px; display: inline-block; padding: 5px; } .buttons-set button.button { float: right; margin-left: 5px; min-width: 140px; } .buttons-set:after { content: ''; display: table; clear: both; } /* -------------------------------------------- * * Icons */ .icon-sprite, .btn-remove2, .ratings .rating-box, .ratings .rating-box .rating, .sorter > .sort-by .sort-by-switcher, .sorter > .view-mode .grid, .sorter > .view-mode .list, .skip-nav .icon, .skip-search .icon, .skip-account .icon, .skip-cart .icon, .review-summary-table .rating-box .rating-number:after, .ratings-table .rating-box, .ratings-table .rating-box .rating { background-image: url(https://www.tudecora.com/skin/frontend/onestic/tudecora/images/icon_sprite.png); background-repeat: no-repeat; text-indent: -9999px; } @media (-webkit-min-device-pixel-ratio: 2), (min--moz-device-pixel-ratio: 2), (min-device-pixel-ratio: 2), (min-resolution: 192dpi), (min-resolution: 2dppx) { .icon-sprite, .btn-remove2, .ratings .rating-box, .ratings .rating-box .rating, .sorter > .sort-by .sort-by-switcher, .sorter > .view-mode .grid, .sorter > .view-mode .list, .skip-nav .icon, .skip-search .icon, .skip-account .icon, .skip-cart .icon, .review-summary-table .rating-box .rating-number:after, .ratings-table .rating-box, .ratings-table .rating-box .rating { background-image: url(https://www.tudecora.com/skin/frontend/onestic/tudecora/images/icon_sprite@2x.png); background-size: 100px 1000px; } } /* -------------------------------------------- * * Breadcrumbs */ .breadcrumbs { overflow: hidden; } .breadcrumbs ul { float: left; padding: 20px 0; overflow: hidden; } .breadcrumbs ul li { float: left; font-size: 13px; font-family: "robotoregular", Verdana, Arial, sans-serif; text-transform: uppercase; } .breadcrumbs a { float: left; } .breadcrumbs a:hover { color: inherit; text-decoration: underline; } .breadcrumbs strong { font-weight: bold; } .breadcrumbs span { float: left; padding: 0 7px; } .catalog-category-view .breadcrumbs { float: left; width: auto; max-width: none; min-width: auto; padding: 0 0 0 10px; } .catalog-category-view .breadcrumbs ul { padding: 0; line-height: 32px; } @media only screen and (max-width: 770px) { .breadcrumbs { display: none; } } /* -------------------------------------------- * * Button - Remove / Previous */ .btn-remove, .btn-previous { display: inline-block; margin-left: 10px; height: 20px; text-align: center; /* Hide text */ font: 0/0 a; text-shadow: none; color: transparent; position: relative; } .btn-remove:after { color: #159939; height: 20px; line-height: 20px; width: 100%; font-size: 12px; font-family: "robotoregular", Verdana, Arial, sans-serif, Arial; font-weight: bold; } .btn-remove2 { background-position: 4px -648px; border: none; vertical-align: top; } .btn-remove2:after { display: none; } .btn-remove2:hover { background-color: transparent; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80); opacity: 0.8; } .btn-previous:after { content: ''; position: absolute; width: 0; height: 0; display: block; border-top: 4px solid transparent; border-bottom: 4px solid transparent; border-right: 4px solid #159939; border-left: none; position: absolute; top: 50%; left: 50%; margin-left: -2px; margin-top: -4px; } .btn-previous:hover:after { content: ''; position: absolute; width: 0; height: 0; display: block; border-top: 4px solid transparent; border-bottom: 4px solid transparent; border-right: 4px solid #FFFFFF; border-left: none; } .block-layered-nav .currently .btn-remove, .block-layered-nav .currently .btn-previous, .mini-products-list .btn-remove, .mini-products-list .btn-previous, #compare-items .btn-remove, #compare-items .btn-previous { float: right; margin-left: 6px; } .block-layered-nav .currently .btn-remove { color: inherit; font-size: 1.2em; line-height: inherit; } /* -------------------------------------------- * * Checkout Agreements */ .checkout-agreements li { margin-bottom: 20px; } .checkout-agreements .agreement-content { overflow-y: auto; max-width: 670px; max-height: 125px; margin-bottom: 10px; padding: 10px; border: 1px solid #CCCCCC; } /* -------------------------------------------- * * CVV Security Code */ .cvv-what-is-this { margin-left: 10px; font-size: 13px; line-height: 24px; } /* -------------------------------------------- * * Container */ .main-container, .footer-container { position: relative; margin: 0 auto; } .main-container:after, .footer-container:after { content: ''; display: table; clear: both; } .main-container, .footer-container { padding: 0; float: left; width: 100%; } .main-container .main { padding-bottom: 40px; } .cms-index-index .main-container .main, .catalog-category-view .main-container .main, .catalog-product-view .main-container .main { padding-top: 0; } .wrap-content, .catalogsearch-result-index .col-main, .catalog-category-view .main .content, .cms-page-view .main .content, .cms-no-route .main .content, .category-ofertas .category-image { width: 100%; max-width: 1440px; min-width: 1024px; margin: 0 auto; display: block; position: relative; } .pre-header .wrap-content, #header .wrap-content { padding: 0 0 0 15px; } @media only screen and (max-width: 1440px) { .wrap-content { padding: 0 15px; } } /* -------------------------------------------- * * Column Layouts */ .main:after, .col-wrapper:after { content: ''; display: table; clear: both; } .col-left, .col-right, .col-main { padding: 0 10px; } .col-left { float: left; width: 240px; padding-left: 0; clear: left; } .col-left img { max-width: 100%; } .col-right { float: right; width: 25%; padding-right: 0; /* Remove the 15px padding */ } .col-right img { max-width: 100%; } .col-main { float: left; width: calc(100% - 240px); } .col1-layout .col-main { float: none; width: auto; padding: 0; /* Remove the 15px padding */ } .col2-left-layout .col-main { float: right; padding-right: 0; /* Remove the 15px padding */ } .col2-right-layout .col-main { padding-left: 0; /* Remove the 15px padding */ } .col3-layout .col-right { width: 20.83333%; } .col3-layout .col-wrapper { float: left; width: 79.16667%; } .col3-layout .col-wrapper .col-main { float: right; width: 73.68421%; } .col3-layout .col-wrapper .col-left { width: 26.31579%; } @media only screen and (max-width: 1000px) { .col3-layout .col-right { float: left; clear: left; padding-left: 0; padding-right: 10px; width: 25%; } .col3-layout .col-wrapper { float: right; width: 100%; } .col3-layout .col-wrapper .col-main { float: right; width: 75%; } .col3-layout .col-wrapper .col-left { width: 25%; } } /* Content Columns */ .col2-set { width: 100%; } .col2-set .col-1, .col2-set .col-2 { padding: 20px; } @media only screen and (max-width: 770px) { .col2-set .col-1, .col2-set .col-2 { padding: 10px; } } .col2-set .col-1 { float: left; padding-left: 0; } .col2-set .col-2 { float: left; padding-right: 0; } .col2-set .narrow { width: 33%; } .col2-set .wide { width: 65%; } .col2-set:after { content: ''; display: table; clear: both; } /* -------------------------------------------- * * Top Container */ @media only screen and (min-width: 771px) { .top-container { max-width: 1055px; margin: 0 auto; padding: 0 30px; } } /* -------------------------------------------- * * Global Site Notice */ .global-site-notice { background: #676157; color: #E6E6E6; font-size: 11px; } .global-site-notice .notice-inner { padding-left: 120px; width: 1440px; margin-left: auto; margin-right: auto; line-height: 11px; min-height: 40px; padding-top: 14.5px; padding-bottom: 14.5px; background-image: url("https://www.tudecora.com/skin/frontend/onestic/tudecora/images/demo-logo.png"); background-position: left; background-repeat: no-repeat; } .global-site-notice p { margin-bottom: 0; } /* -------------------------------------------- * * Promotional Message Banner */ .promo-msg { color: #636363; text-align: center; margin: 10px; text-transform: uppercase; font-family: "robotobold", Verdana, Arial, sans-serif; } /* -------------------------------------------- * * Grid */ .grid:after { content: ''; display: table; clear: both; } /* -------------------------------------------- * * Messages */ .success { color: #11B400; } .error { color: #DF280A; font-weight: bold; } .notice { color: #E26703; font-weight: bold; } /* -------------------------------------------- * * Messages */ .messages { margin-bottom: 10px; } .messages li li { position: relative; margin-bottom: 5px; padding: 7px 10px 7px 20px; background: #F4F4F4; font-size: 15px; } .messages li li:before { top: 50%; left: 0; margin-top: -6px; } .messages .error-msg li { color: #636363; border-left: 5px solid #DF280A; background-color: #f1f1f1; } .messages .error-msg li:before { content: ''; position: absolute; width: 0; height: 0; display: block; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 6px solid #DF280A; border-right: none; } .messages .notice-msg li { color: #636363; border-left: 5px solid #E26703; background-color: #f1f1f1; } .messages .notice-msg li:before { content: ''; position: absolute; width: 0; height: 0; display: block; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 6px solid #E26703; border-right: none; } .messages .success-msg li { color: #636363; border-left: 5px solid #159939; background-color: #f1f1f1; } .messages .success-msg li:before { content: ''; position: absolute; width: 0; height: 0; display: block; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 6px solid #159939; border-right: none; } @media only screen and (min-width: 915px) { .order-list-grid .col-1 { width: 30%; } .order-list-grid .col-2 { width: 50%; padding-right: 20px; } .order-list-grid .col-3 { clear: none; width: 20%; padding-top: 0; } } /* -------------------------------------------- * * Page Popup */ .page-popup { padding: 20px; background: #FFFFFF; height: auto; } .page-popup h1 { margin: 0 0 0.5em; font-size: 36px; } /* -------------------------------------------- * * Payment Methods */ .payment-methods { margin-bottom: 20px; } .payment-methods dt { padding: 5px 0; } .payment-methods dd { padding-top: 10px; } .payment-methods .form-list { position: relative; display: inline-block; max-width: 100%; margin: 5px 15px 15px; padding: 15px; border: 1px solid #CCCCCC; background: #F4F4F4; } .payment-methods .form-list:before { content: ''; position: absolute; width: 0; height: 0; display: block; border-right: 10px solid transparent; border-left: 10px solid transparent; border-bottom: 10px solid #CCCCCC; border-top: none; top: -11px; left: 30px; } .payment-methods .form-list:after { content: ''; position: absolute; width: 0; height: 0; display: block; border-right: 10px solid transparent; border-left: 10px solid transparent; border-bottom: 10px solid #F4F4F4; border-top: none; top: -10px; left: 30px; } .payment-methods .form-list li:last-child { margin-bottom: 0; } /* -------------------------------------------- * * Please Wait (Loading Indicator) */ .please-wait { display: inline-block; margin-left: 10px; margin-top: 5px; line-height: 24px; height: 24px; white-space: nowrap; /* Prevent the linebreak in the HTML from causing layout issues */ } .please-wait img { float: left; margin-right: 5px; width: 24px; } /* -------------------------------------------- * * Price Box - Standard */ .price-box { margin: 7px 0; font-family: "robotoregular", Verdana, Arial, sans-serif; } .price-box p { margin-bottom: 0; } .price-notice { color: #A0A0A0; } .price-box .price { color: #636363; font-size: 16px; } .price-box .price, .price { font-family: "robotoregular", Verdana, Arial, sans-serif; } .price-box .price-label { color: #A0A0A0; white-space: nowrap; font-family: "robotobold", Verdana, Arial, sans-serif; } .price-box .minimal-price-link { display: block; /* We want this to show on its own line, otherwise the layout looks funky */ } .price-box .minimal-price-link .label { color: #159939; } .catalog-product-view .price-box .label { display: none; } .catalog-product-view .block-related .price-box .label { display: block; float: left; margin-right: 3px; } /* -------------------------------------------- * * Price Box - Special */ .price-box .old-price, .price-box .special-price { display: inline-block; } .price-box .old-price .price-label, .price-box .special-price .price-label { display: none; } .price-box .old-price .price, .price-box .special-price .price { display: inline-block; } .price-box .old-price .price { color: #A0A0A0; text-decoration: line-through; } .price-box .special-price { color: #636363; padding-left: 1em; } .price-box .special-price .price-label { color: #D84D3C; } /* -------------------------------------------- * * Price Box - Taxes */ .price-box .price-excluding-tax, .price-box .price-including-tax { display: block; } span.weee { display: block; } /* -------------------------------------------- * * Tier Prices */ .product-pricing, .tier-prices, .tier-prices-grouped { display: inline-block; padding: 4px 8px; background: #FBF4DE; border: 1px solid #E2D4C7; margin-top: 7px; } .product-pricing li, .tier-prices li, .tier-prices-grouped li { font-size: 12px; } .product-pricing .benefit, .tier-prices .benefit, .tier-prices-grouped .benefit { font-style: italic; } .product-pricing .price, .tier-prices .price, .tier-prices-grouped .price { font-weight: bold; } /* ============================================ * * Item Options * ============================================ */ .item-options { font-size: 14px; font-family: "robotomedium", Verdana, Arial, sans-serif; } .item-options:after { content: ''; display: table; clear: both; } .item-options dt { } .item-options dt:after { content: ': '; } .item-options dd { margin: 0 0 5px; padding-left: 10px; font-family: "robotoregular", Verdana, Arial, sans-serif; } .truncated, .truncated a.dots { cursor: help; position: relative; } .cart-table .truncated, .cart-table .truncated a.dots { cursor: text; } .truncated a.details { cursor: help; height: 16px; line-height: 16px; } .truncated a.details:hover { text-decoration: none; } .truncated .truncated_full_value { position: relative; z-index: 300; } .truncated .truncated_full_value .item-options { display: none; position: absolute; z-index: 300; width: 200px; padding: 8px; border: 1px solid #159939; background-color: #F6F6F6; top: 21px; left: -100px; } .truncated .truncated_full_value .item-options:after { content: ''; position: absolute; width: 0; height: 0; display: block; border-right: 7px solid transparent; border-left: 7px solid transparent; border-bottom: 7px solid #159939; border-top: none; left: 97px; top: -7px; } .truncated .truncated_full_value .item-options > p { font-weight: bold; text-transform: uppercase; margin-bottom: 8px; } .truncated .show .item-options { display: block; position: absolute; left: 14px; top: 9px; width: 240px; } @media only screen and (max-width: 479px) { .truncated { cursor: inherit; } .truncated a.details { display: none; } .truncated .truncated_full_value .item-options { display: block; position: static; z-index: 1; width: 100%; border: none; background-color: transparent; } .truncated .truncated_full_value .item-options p { float: none; } .truncated .truncated_full_value .item-options:after { display: none; } } /* -------------------------------------------- * * Printer Friendly Page */ .page-print { width: 6.5in; margin: 20px; background: #FFFFFF; } /* -------------------------------------------- * * Add to links */ .add-to-links { margin: 7px 0; } .add-to-links a { display: inline-block; padding: 0px 3px 3px; } .add-to-links .separator { display: none; } /* -------------------------------------------- * * Product Image */ /* -------------------------------------------- * * Ratings */ .ratings { margin: 7px 0; } .ratings .rating-box, .ratings .rating-links { margin: 5px 0; } .ratings .rating-box { width: 65px; height: 13px; background-repeat: repeat-x; background-position: 0 -615px; overflow: hidden; } .ratings .rating-box .rating { float: left; height: 13px; background-repeat: repeat-x; background-position: 0 -600px; } .ratings .amount { display: block; margin: 5px auto; } .ratings .rating-links .separator { margin: 0 3px; } /* -------------------------------------------- * * Standard Formatted Text Block */ .std p { margin: 0 0 1.5em; } .std ol { list-style: decimal outside; margin-bottom: 1.5em; } .std ol li { margin-left: 2em; } .std ul { list-style: disc outside; margin-bottom: 1.5em; } .std ul li { margin-left: 2em; } .std .note { color: #A0A0A0; font-size: 13px; } /* -------------------------------------------- * * Tabs */ .tabs { margin-bottom: 10px; background: #FFFFFF; } /* -------------------------------------------- * * Toolbar */ .catalogsearch-result-index .toolbar { padding: 0 0 25px 15px; } .toolbar:after { content: ''; display: table; clear: both; } .toolbar .select-ajax { float: left; } .toolbar .sort-by .custom-select-container { width: 110px; } .toolbar .sort-by .custom-select-container select { position: relative; opacity: 1; } .toolbar .sort-by .custom-select-container span { display: none; } .toolbar .pager, .toolbar .count-container, .toolbar .currently, .toolbar-bottom .sort-by, .toolbar-bottom .count-container, .toolbar-bottom .view-mode { display: none; } .toolbar-bottom .pager { display: block; } .pager-no-toolbar { margin-bottom: 10px; } .pager-no-toolbar ~ .pager-no-toolbar { margin-top: 10px; } .toolbar, .pager { color: #636363; line-height: 30px; font-size: 12px; } /* Filters applied*/ .toolbar .currently { float: left; border-top: 1px solid #CCC; border-bottom: 1px solid #CCC; padding-right: 5px; width: 100%; margin-bottom: 15px; } .toolbar .currently li { float: left; width: auto; margin-right: 10px; } .toolbar .currently li .btn-remove { border: 0; float: right; margin-left: 5px; } .toolbar .currently li .btn-remove:before { content: 'X'; color: #CCCCCC; font-size: 12px; line-height: 32px; display: inline-block; } .toolbar .sorter-pager { width: 100%; clear: both; } .toolbar label, .pager-no-toolbar label { font-weight: normal; } .sorter label { float: left; margin-right: 10px; } .sorter label:after { content: ':'; } .sorter > .sort-by { float: left; margin-right: 10px; } .sorter > .sort-by .sort-by-switcher { width: 30px; height: 30px; display: inline-block; margin-top: 3px; } .sorter > .sort-by .sort-by-switcher--asc { background: none; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); text-indent: inherit; color: #636363; font-size: 25px; } .sorter > .sort-by .sort-by-switcher--asc:hover { color: #159939; } .sorter > .sort-by .sort-by-switcher--desc { background: none; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); text-indent: inherit; color: #636363; font-size: 16px; margin-top: -3px; float: left; } .sorter > .sort-by .sort-by-switcher--desc:hover { color: #159939; } .sorter > .sort-by ul { width: 300px; } .sorter > .sort-by ul li { cursor: pointer; float: left; margin: auto 5px; height: 38px; width: 110px; text-align: center; background-color: #ffffff; font-size: 14px; border: 1px solid #dddddd; border-radius: 3px; -webkit-box-shadow: 3px 2px 10px -3px #c7c7c7; box-shadow: 3px 2px 10px -3px #c7c7c7; } .sorter > .sort-by ul li label { font-size: 14px; } .sorter > .sort-by ul li a { color: #636363; vertical-align: middle; white-space: nowrap; line-height: 30px; font-size: 13px; font-family: "robotobold", Georgia, Times, "Times New Roman", serif; } .sorter > .view-mode { float: right; margin-top: -44px; } .sorter > .view-mode .grid, .sorter > .view-mode .list { float: left; width: 30px; height: 30px; } .sorter > .view-mode .grid { margin-right: 5px; background-position: 8px -492px; } .sorter > .view-mode strong.grid, .sorter > .view-mode a.grid:hover { background-position: -42px -492px; } .sorter > .view-mode .list { background-position: 11px -517px; } .sorter > .view-mode strong.list, .sorter > .view-mode a.list:hover { background-position: -39px -517px; } .sorter > .view-mode .icon-view-module { font-size: 41px; float: right; } p.view-mode span { font-size: 38px; color: #636363; } p.view-mode span.active { color: #cccccc; } .pager { position: relative; clear: both; } .pager > .count-container { float: left; } .pager .amount { float: left; font-family: "robotoregular", Verdana, Arial, sans-serif; white-space: nowrap; margin: 0 15px 0 0; } .pager .limiter { float: left; line-height: 30px; } .pager .limiter > label { padding-right: 5px; float: left; } .pager .limiter > label:after { content: ':'; } .pager .amount, .pager .limiter { margin-bottom: 5px; } .pages { font-size: 16px; text-align: center; overflow: hidden; } .pages strong { display: none; } .pages ol { clear: both; } .pages ol li { display: inline-block; margin: 0; padding: 0 10px; } .pages a, .pages .current { display: inline-block; margin: auto 5px; padding: 0; border: 0; line-height: 30px; font-family: "robotoregular", Verdana, Arial, sans-serif; font-size: 16px; text-align: center; vertical-align: middle; white-space: nowrap; } .pages .current, .pages .current:hover { color: #159939; cursor: default; } .pages .next-arrow, .pages .previous-arrow { background-color: transparent; font-size: 16px; color: #cccccc; font-family: "robotomedium", Verdana, Arial, sans-serif; } .pages .next-arrow { float: right; } .pages .previous-arrow { float: left; } .pages .next-arrow i, .pages .previous-arrow i { font-size: 1.3em; vertical-align: text-bottom; } .catalog-category-view .productsCount, .catalog-category-view .toolbar { float: right; padding: 0; font-size: 13px; font-family: "robotomedium", Verdana, Arial, sans-serif; text-transform: uppercase; line-height: 32px; } .catalog-category-view .productsCount{ padding-right: 30px; } .catalog-category-view .toolbar-bottom .toolbar { float: none; margin: 20px 0; } .catalog-category-view .category-products { clear: both; padding-top: 15px; } @media only screen and (max-width: 479px) { .pager .amount--has-pages { display: none; } .pages { float: left; } .limiter label { display: none; } } @media only screen and (max-width: 770px) { .col1-layout .sorter, .col1-layout .pager { width: 100%; } .col1-layout .pager { float: left; clear: both; } .col1-layout .pager .pages { float: left; margin-left: 0; } .col1-layout .pager .count-container { float: right; } } @media only screen and (max-width: 1279px) { .toolbar .view-mode > label { display: none; } } /* ============================================ * * Tax - Full Tax Summary * ============================================ */ #checkout-review-table .summary-collapse, #shopping-cart-totals-table .summary-collapse, body.customer-account .data-table .summary-collapse { position: relative; cursor: pointer; } #checkout-review-table .summary-collapse:before, #shopping-cart-totals-table .summary-collapse:before, body.customer-account .data-table .summary-collapse:before { content: ''; position: absolute; width: 0; height: 0; display: block; border-right: 7px solid transparent; border-left: 7px solid transparent; border-top: 7px solid #159939; border-bottom: none; position: static; display: inline-block; margin-right: 5px; } #checkout-review-table .summary-collapse:hover:before, #shopping-cart-totals-table .summary-collapse:hover:before, body.customer-account .data-table .summary-collapse:hover:before { content: ''; position: absolute; width: 0; height: 0; display: block; border-right: 7px solid transparent; border-left: 7px solid transparent; border-top: 7px solid #44AA5E; border-bottom: none; position: static; display: inline-block; margin-right: 5px; } #checkout-review-table .show-details .summary-collapse:before, #shopping-cart-totals-table .show-details .summary-collapse:before, body.customer-account .data-table .show-details .summary-collapse:before { content: ''; position: absolute; width: 0; height: 0; display: block; border-right: 7px solid transparent; border-left: 7px solid transparent; border-bottom: 7px solid #159939; border-top: none; position: static; display: inline-block; margin-right: 5px; } #checkout-review-table .show-details .summary-collapse:hover:before, #shopping-cart-totals-table .show-details .summary-collapse:hover:before, body.customer-account .data-table .show-details .summary-collapse:hover:before { content: ''; position: absolute; width: 0; height: 0; display: block; border-right: 7px solid transparent; border-left: 7px solid transparent; border-bottom: 7px solid #44AA5E; border-top: none; position: static; display: inline-block; margin-right: 5px; } #shopping-cart-totals-table tfoot td .summary-collapse:before, #shopping-cart-totals-table tfoot td .summary-collapse:hover:before { margin-bottom: 5px; } /* ============================================ * * Magento Helpers * ============================================ */ .a-center { text-align: center; } .a-right, .align-right { text-align: right; } .no-display { display: none !important; } .nobr, .nowrap { white-space: nowrap; } .width-full { width: 100%; } /* ============================================ * * Custom Helpers * ============================================ */ .hidden { display: none; } .flip-horizontal { -webkit-transform: scale(-1, 1); -ms-transform: scale(-1, 1); transform: scale(-1, 1); } /* ============================================ * * Print Styles * ============================================ */ .page-print .print-head { margin: 0 0 15px; } .page-print .print-head .logo { float: none; max-height: 50px; width: auto; } /* ============================================ * * Category List Col Left * ============================================ */ .col-left .sidebar .block-layered-nav .block-content > dl > dt { font-family: "robotobold", Georgia, Times, "Times New Roman", serif; font-size: 20px; background-color: #cccccc; border-top: 4px solid #159939; } /* ============================================ * * FORMS - COMMON * ============================================ */ /* -------------------------------------------- * * Fieldsets */ .fieldset p { margin-bottom: 7px; } .fieldset p.required { margin-bottom: 5px; float: right; font-size: 12px; margin-top: 0px; } .fieldset + .fieldset { margin-top: 5px; } form .legend { margin: 0; margin-bottom: 10px; color: #636363; font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 18px; font-weight: 400; font-style: normal; line-height: 1.4; text-rendering: optimizeSpeed; margin-bottom: 15px; padding-bottom: 7px; } /* -------------------------------------------- * * Input Box */ .input-box { padding-top: 2px; } .input-box:after { content: ''; display: table; clear: both; } li.centinel-logos div.input-box img { display: inline; vertical-align: middle; } /* For adjacent select inputs. */ /* Example: credit card expiration month and year. */ .input-box .v-fix { float: left; margin-right: 5px; max-width: 100%; } /* -------------------------------------------- * * Labels */ label { display: inline-block; font-family: "robotomedium", Verdana, Arial, sans-serif; -moz-user-select: none; -ms-user-select: none; -webkit-user-select: none; -o-user-select: none; user-select: none; } label.required:after, span.required:after { content: ' *'; } label.required em, span.required em { display: none; } /* -------------------------------------------- * * Hints */ .input-hint { color: #A0A0A0; font-size: 12px; } /* -------------------------------------------- * * Select */ select + select { margin-left: 5px; } select[multiple] { width: 270px; border: 0; font-size: 15px; padding: 5px; } select[multiple]:focus { background: #f1f1f1; outline: 0 none; border-color: #E5E5E5 !important; } .custom-select-container { position: relative; } .custom-select-container select, .custom-select-container select:focus, .custom-select-container select:active { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; background: transparent; } .custom-select-container select { opacity: 0; position: absolute; top: 0; left: 0; width: 100%; padding: 5px 25px 5px 10px; font: 14px/22px "robotoregular", Georgia, Times, "Times New Roman", serif; background: url("https://www.tudecora.com/skin/frontend/onestic/tudecora/images/select-arrow.png") no-repeat scroll 95% center #ffffff; border: 1px solid #ddd; border-radius: 3px; cursor: pointer; z-index: 2; } .custom-select-container span { display: block; width: 100%; min-height: 35px; padding: 5px 25px 5px 10px; font: 14px/22px "robotoregular", Georgia, Times, "Times New Roman", serif; color: #636363; /* background: url("https://www.tudecora.com/skin/frontend/onestic/tudecora/images/select-arrow.png") no-repeat scroll 90% center #ffffff; */ border: 1px solid #ddd; border-radius: 3px; cursor: pointer; } .catalog-category-view .custom-select-container select, .catalog-category-view .custom-select-container span { text-transform: uppercase; } .custom-select-container span:after { content: ''; display: block; width: 15px; height: 15px; position: absolute; right: 10px; top: 50%; transform: translate(0,-50%); -webkit-transform: translate(0,-50%); -moz-transform: translate(0,-50%); -o-transform: translate(0,-50%); background: url("https://www.tudecora.com/skin/frontend/onestic/tudecora/images/select-arrow.png") no-repeat scroll center center #ffffff; z-index: 1; } .custom-select-container span.focused:after { display: none; } .custom-select-container span.select-something { border: 1px solid #DF280A; } .custom-select-container span.select-something.validation-passed { border-color: #FFFFFF !important; } .custom-select-container .boxShadow { -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px #159939; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px #159939; outline: 0 none; } /* -------------------------------------------- * * focus */ .focused { background: #eee; outline: 0 none; border-color: #eee !important; } .product-essential .custom-select-container .focused { /*border-color: #DF280A !important;*/ } .product-essential .custom-select-container .focused.validation-passed { border-color: #eee !important; } /* -------------------------------------------- * * Textarea */ textarea { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 100%; padding: 5px 10px; border: 1px solid #ddd; border-radius: 3px; font-family: "robotolight", Verdana, Arial, sans-serif; font-size: 13px; } textarea:focus { background: #f1f1f1; outline: 0 none; } /* -------------------------------------------- * * Inputs */ input[type="text"], input[type="password"], input[type="email"], input[type="search"], input[type="number"], input[type="tel"], .input-text { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 100%; height: 35px; padding: 0 10px; border: 1px solid #ddd; border-radius: 3px; font-family: "robotolight", Verdana, Arial, sans-serif; font-size: 13px; } input:focus, .input-text:focus { background: #f1f1f1; outline: 0 none; } div.custom-select-container.validation-failed span { border: 1px solid #DF280A; height: 45px; } .product-shop div.custom-select-container.validation-failed span { height: auto; } .input-text.validation-failed { border-color: #DF280A; } .input-text.validation-failed:focus, .validation-failed:focus { outline-color: #ef9485; } /* -------------------------------------------- * * Inputs - Quantity */ input[type=number].qty, input[type=text].qty { width: 3em; text-align: center; vertical-align: middle; } /* -------------------------------------------- * * Placeholder */ ::-webkit-input-placeholder { color: #A0A0A0; } input:-moz-placeholder { color: #A0A0A0; } /* -------------------------------------------- * * Checkbox And Radio */ .checkbox, .radio { position: relative; display: inline-block; } .checkbox + label, .radio + label { width: auto; max-width: 85%; padding: 0 0 0 8px; vertical-align: text-bottom; } /* -------------------------------------------- * * Validation */ p.required, .validation-advice { margin: 5px 0 0; color: #DF280A; font-size: 13px; } /* ============================================ * * Form List * ============================================ */ .form-list > li { margin-bottom: 10px; } .form-list .field, .form-list .wide, .form-list .control { margin-bottom: 10px; } .form-list .fields { margin: 0 -10px; overflow: hidden; } .form-list .fields .field { float: left; width: calc(50% - 20px); margin-left: 10px; margin-right: 10px; } /* Turn the label of controls (radio/checkbox) into a button style that wraps the input */ .form-list .control, .sp-methods dt, #checkout-shipping-method-load .sp-methods dd, #co-shipping-method-form .sp-methods dd, .product-options ul.options-list { /* When a label is next to an input that is set to not display, we should style the label in a non-clickable state */ } .form-list .control div.input-box, .sp-methods dt div.input-box, #checkout-shipping-method-load .sp-methods dd div.input-box, #co-shipping-method-form .sp-methods dd div.input-box, .product-options ul.options-list div.input-box { display: inline; float: left; } .form-list .control div.input-box:after, .sp-methods dt div.input-box:after, #checkout-shipping-method-load .sp-methods dd div.input-box:after, #co-shipping-method-form .sp-methods dd div.input-box:after, .product-options ul.options-list div.input-box:after { display: none; } .form-list .control input.radio, .form-list .control input.checkbox, .sp-methods dt input.radio, .sp-methods dt input.checkbox, #checkout-shipping-method-load .sp-methods dd input.radio, #checkout-shipping-method-load .sp-methods dd input.checkbox, #co-shipping-method-form .sp-methods dd input.radio, #co-shipping-method-form .sp-methods dd input.checkbox, .product-options ul.options-list input.radio, .product-options ul.options-list input.checkbox { float: left; margin: 11px 5px; } .form-list .control label, .sp-methods dt label, #checkout-shipping-method-load .sp-methods dd label, #co-shipping-method-form .sp-methods dd label, .product-options ul.options-list label { padding: 5px 10px; display: inline-block; max-width: none; float: none; } .form-list .control .no-display + label, .sp-methods dt .no-display + label, #checkout-shipping-method-load .sp-methods dd .no-display + label, #co-shipping-method-form .sp-methods dd .no-display + label, .product-options ul.options-list .no-display + label { padding-left: 10px; background-color: transparent; } .form-list .control .no-display + label:hover, .sp-methods dt .no-display + label:hover, #checkout-shipping-method-load .sp-methods dd .no-display + label:hover, #co-shipping-method-form .sp-methods dd .no-display + label:hover, .product-options ul.options-list .no-display + label:hover { background-color: transparent; } .product-options ul.options-list label, .col2-set .form-list .control label { min-width: inherit; width: 250px; max-width: 100%; } .form-list .control.remember-me-box label { width: auto; max-width: none; min-width: inherit; } .form-list .control { margin-top: 10px; } .form-list .control label { float: none; } .form-list .control .radio, .form-list .control .checkbox { margin-right: 6px; } .form-list .control .input-box { clear: none; display: inline-block; width: auto; padding: 0; } form .form-instructions { font-size: 13px; } input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill { background-color: #E5E5E5 !important; } input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px #E5E5E5 inset; } button:focus { outline: 0; } .validation-failed-swatch { border: 1px solid #DF280A; } .validation-passed-swatch { border: 1px solid #ffffff; } ul.select-something { border: 1px solid #DF280A; } ul.no-select-something { border: none !important; } /* ============================================ * * Table Helpers * ============================================ */ .hide-th { text-indent: -9999px; } /* ============================================ * * Data Table * ============================================ */ .data-table { width: 100%; } .data-table td, .data-table th { padding: 15px 10px; vertical-align: top; } .data-table th { background: #F4F4F4; text-transform: uppercase; font-family: "robotobold", Verdana, Arial, sans-serif; line-height: 1.4; white-space: nowrap; } .data-table thead th, .data-table tbody td { border-bottom: 1px solid #C0C0C0; } .data-table tbody td, .data-table tfoot td { font-family: "robotoregular", Verdana, Arial, sans-serif; } .data-table tfoot tr { background: #F4F4F4; } .data-table tbody td .item-options { margin-left: 20px; margin-top: 10px; } .data-table tbody td .item-options dt:after { content: ':'; } /* ============================================ * * Generic Info Table * ============================================ */ .info-box { border: 1px solid #C0C0C0; padding: 12px 15px; margin: 0 0 15px; } .info-box h2 { font-weight: bold; font-size: 13px; } .info-table th, .info-table td { vertical-align: top; } .info-table th { font-weight: bold; padding: 4px 20px 4px 0; } .info-table td { padding: 4px 0; } /* ============================================ * * Zebra-Stripe Table * ============================================ */ .zebra-table tr:first-child, .zebra-table th:first-child { border-top: 1px solid #C0C0C0; } .zebra-table td, .zebra-table th { border-bottom: 1px solid #C0C0C0; padding: 6px; background-color: transparent; } .zebra-table tr { background-color: #EEEDED; } .zebra-table tr:nth-child(odd) { background-color: #F8F7F5; } /* ============================================ * * Linearize Table * ============================================ */ /* ============================================ * * Global * ============================================ */ html, body { position: relative; overflow-x: hidden; } body * { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .wrapper { min-height: 100%; margin: 0 auto; background: #FFFFFF; } .wrapper:after { content: ''; display: table; clear: both; } #back-top { position: fixed; bottom: 230px; right: 20px; display: none; } #back-top a { display: block; width: 50px; height: 50px; border-radius: 100%; -webkit-transition: 1s; transition: 1s; border: 1px solid #dddddd; background-color: #ffffff; -webkit-box-shadow: 0px 0px 22px -9px #c7c7c7; box-shadow: 0px 0px 22px -9px #c7c7c7; } #back-top a:before { font-style: normal; font-weight: normal; speak: none; display: inline-block; text-decoration: none; text-align: center; font-variant: normal; text-transform: none; line-height: 1em; font-size: 45px; color: #dddddd; float: right; margin: 2px 1px 0 0px; } /* MAIN LAYOUT */ .category-ofertas .col-main h1, .category-acabados-muebles .col-main h1 { font: 26px "robotobold", Georgia, Times, "Times New Roman", serif; color: #636363; width: 100%; margin: .7em 0; } .category-ofertas .col-main h2, .category-acabados-muebles .col-main h2 { font: 18px "robotomedium", Verdana, Arial, sans-serif; color: #636363; float: left; width: 100%; } .category-ofertas .col-main h3, .category-acabados-muebles .col-main h3 { font: 18px "robotomedium", Verdana, Arial, sans-serif; color: #636363; float: left; width: 100%; } .category-ofertas .col-main h3 span.icono, .category-acabados-muebles .col-main h3 span.icono { font-size: 45px; float: left; margin: 0 10px 0 0; } .category-ofertas .col-main p, .category-acabados-muebles .col-main p { font: 15px "robotolight", Verdana, Arial, sans-serif; color: #636363; float: left; width: 100%; margin: 0 0 1.5em; } .category-ofertas .col-main .space, .category-acabados-muebles .col-main .space { margin: 15px 0; height: 100%; float: left; width: 100%; } .category-ofertas .col-main .green, .category-acabados-muebles .col-main .green { color: #159939; } .category-ofertas .col-main ul, .category-acabados-muebles .col-main ul { list-style: disc outside; margin-bottom: 1.5em; } .category-ofertas .col-main ul li, .category-acabados-muebles .col-main ul li { font: 15px "robotolight", Verdana, Arial, sans-serif; color: #636363; float: left; width: 100%; margin-left: 2em; } .category-ofertas .category-acabados-muebles a, .category-acabados-muebles .category-acabados-muebles a { text-decoration: underline; } .category-ofertas .category-title, .category-acabados-muebles .category-title { display: none; } .icon-delivery:before { content: "\e607"; } .only-mobile { display: none; } body.catalog-category-view .main .col-main > .content, body.catalog-category-view .main .col-main > .content ~ * { padding: 0 15px; } /* ============================================ * * Header * ============================================ */ #header { height: 70px; background: #fff; border-bottom: 1px solid #eeeeee; } #header.sticky { position: fixed; top: 0; width: 100%; z-index: 9999; } /* ============================================ * * Header checkout * ============================================ */ .header-checkout .logo-wrapper { width: 245px; } .header-checkout .header-contact { float: right; border-left: 1px solid #EDEDED; } .header-checkout .header-contact ul { overflow: hidden; } .header-checkout .header-contact ul li { display: inline-block; padding: 0 15px; text-transform: uppercase; line-height: 70px; border-right: 1px solid #EDEDED; } .header-checkout .header-contact ul li a { display: inline-block; cursor: pointer; } .header-checkout .header-contact .checkout-telephone { width: 135px; float: left; line-height: 1.2; margin: 8px 0 0 0; } .header-checkout .header-contact .checkout-payments { width: 167px; float: left; line-height: 1.2; margin: 8px 0 0 0; } .header-checkout .header-contact span { font-size: 27px; color: #636363; margin-top: -6px; margin-right: 5px; } .header-checkout .page-header #info { float: right; width: 600px; height: 100px; } /* ============================================ * * Pre Header * ============================================ */ .pre-header { border-bottom: 1px solid #eeeeee; font-family: "robotomedium", Verdana, Arial, sans-serif; font-size: 12px; line-height: 35px; } .pre-header a { color: #636363; } .pre-header a:hover { color: #bbbbbb; } .pre-header:after { content: ''; display: table; clear: both; } .pre-header .form-language, .pre-header .currency-switcher { float: left; margin-right: 10px; } .pre-header .header-text { float: left; } .pre-header .account-cart-wrapper, .pre-header .header-contact { float: right; } .pre-header .header-contact ul { overflow: hidden; } .pre-header .header-contact ul li { display: inline-block; } .pre-header .header-contact ul li a, .header-login .skip-account { display: inline-block; padding: 0 15px; cursor: pointer; text-transform: uppercase; } /* ============================================ * * Logo * ============================================ */ .logo-wrapper { position: relative; float: left; width: 17%; height: 70px; border-right: 1px solid #EDEDED; } .logo-wrapper .logo img { width: auto; height: auto; max-width: calc( 100% - 20px); max-height: 50px; position: absolute; left: 0; top: 50%; transform: translate(0,-50%); -webkit-transform: translate(0,-50%); -moz-transform: translate(0,-50%); -o-transform: translate(0,-50%); } .logo-wrapper h1 { position: absolute; top: -1000px; left: -1000px; } /* ============================================ * * Skip Links * ============================================ */ .skip-links { clear: both; overflow: hidden; border-top: 1px solid #EDEDED; border-bottom: 1px solid #EDEDED; } @media only screen and (min-width: 771px) { .skip-links { border: 0; } } /* -------------------------------------------- * * Skip - Link */ .skip-link { position: relative; float: left; width: 20%; text-align: center; } a.skip-link { text-decoration: none; } @media only screen and (max-width: 770px) { .skip-link { border-right: 1px solid #EDEDED; } .skip-link:last-child { border-right: 0; } } /* -------------------------------------------- * * Skip Link - Active */ @media only screen and (max-width: 770px) { .skip-link.skip-active { background: #EDEDED; color: inherit; } .skip-link.skip-active span { color: inherit; } } /* -------------------------------------------- * * Skip Link - Label */ .skip-link .label { display: none; } @media only screen and (min-width: 500px) { .skip-link .label { display: inline; } } /* ============================================ * * Skip Content * ============================================ */ .skip-content.skip-active { display: block; background: #EDEDED; } /* ============================================ * * Global Header Navigation * ============================================ */ .telephone-image { background: url(https://www.tudecora.com/skin/frontend/onestic/tudecora/images/telephone.png) no-repeat center center; display: block; width: 25px; height: 25px; float: left; margin-right: 12px; } /* ============================================ * * Nav - Skip Link * ============================================ */ .skip-nav { width: 40%; } .skip-nav:not(.skip-active):hover { text-decoration: none; } .skip-nav:not(.skip-active):hover .icon { background-position: -46px 4px; } .skip-nav .label { display: inline; } .skip-nav .icon { background-position: 4px 4px; } @media only screen and (min-width: 771px) { .skip-nav { display: none; } } /* ============================================ * * Nav Primary * ============================================ */ #header-nav { display: block; float: right; width: 73%; border-right: 1px solid #eee; } .nav-primary { display: flex; justify-content: center; min-height: 70px; /*li.level0:hover > a { border-bottom: 5px solid $td-white; }*/ /* Level 2+ */ /* Class for js to add briefly to evaluate element positioning. */ /* Correct menus that will hang off the page (class added by js) */ /* Level 1+ */ } /* ============================================ * * General Navigation Styles * ============================================ */ .nav-primary a { text-decoration: none; position: relative; display: block; color: #636363; line-height: 34px; /*max-width: 1055px;*/ font-family: "robotomedium", Verdana, Arial, sans-serif; } .nav-primary li.level0:hover, .nav-primary a.level0:hover, .nav-primary a:hover, .nav-primary .active > a { cursor: pointer; text-decoration: underline; } .nav-primary li { position: relative; } .nav-primary .menu-active > ul.level0, .nav-primary li.level0 li.sub-menu-active > ul { display: block; } /* ============================================ * * Large Viewports - Dropdown Menu * ============================================ */ .nav-primary li.level0 { display: flex; flex-grow: 1; min-height: 70px; } .nav-primary a.level0 { width: 100%; padding: 0px 10px; align-self: center; text-transform: uppercase; text-align: center; line-height: 1.2; } .nav-primary li.last a.level0 { color: #159939; } .nav-primary .current-menu a { } .nav-primary .menu-active { z-index: 200; } .nav-primary li.level1 a { border-bottom: 1px solid #CCCCCC; } .nav-primary li.level1 ul { left: 60px; top: 15px; } .nav-primary li.level0 ul.level0.position-test { display: block; } .nav-primary li.level0 ul.level0.spill { right: 0; left: auto; } .nav-primary li.level0 ul.level0.spill li.level1 ul { left: auto; right: 50px; top: 20px; } .nav-primary li.level0 li.parent > a { position: relative; } .nav-primary li.level0 li.parent > a:after { content: ''; position: absolute; width: 0; height: 0; display: block; right: 5px; top: 50%; margin-top: -3px; } .nav-primary li.menu-active > ul { display: block; } /* Dropdown Menu */ #nav { position: relative; z-index: 100; width: 100%; } #nav .submenu-1, #nav .submenu-2, #nav .submenu-3, #nav .submenu-4, #nav .submenu-5, #nav .submenu-6, #nav .submenu-7 { display: none; } #nav .nav-primary li .dropmenubase { display: none; } #nav li { position: static; } #nav li:hover { position: static; } #nav li:hover .dropmenu { display: block; } #nav li:hover .dropmenu ul { display: block; } #nav li ul.shown-sub, #nav li div.shown-sub { z-index: 999; } .dropmenu { display: none; width: 100%; min-height: 190px; position: absolute; z-index: 9999; background-color: #ffffff; padding: 0 0 0 15px; border: 1px solid #eeeeee; border-top: none; overflow: hidden; } .dropmenu .drop-m-content ul { padding-top: 11px; width: 33%; float: left; } .dropmenu .drop-m-content a { color: #636363; font-family: "robotoregular", Verdana, Arial, sans-serif; line-height: 1.6em; font-size: 15px; } .dropmenu .drop-m-content a:hover { color: #5D5D5A; text-decoration: underline; } .dropmenu .drop-m-content li { position: static; line-height: 1.2; padding: 5px 0 0 8px; } .dropmenu .drop-m-content .imgsubmenu { display: block; float: left; width: 406px; height: 190px; } .dropmenu .drop-m-content .dm-col-auto { width: auto; } .dropmenu .drop-m-content .dm-col-left-1 { width: calc(100% - 406px); float: left; } @media only screen and (max-width: 1440px) { .dropmenu .drop-m-content .dm-col-left-1 { width: 100%; } .dropmenu .drop-m-content .imgsubmenu { display: none !important; } } /* ============================================ * * Search - Skip Link * ============================================ */ .skip-search:not(.skip-active):hover .icon { background-position: -46px -146px; } .skip-search .icon { background-position: 4px -146px; } /* ============================================ * * Search - Skip Content * ============================================ */ #search_mini_form .input-box { position: relative; padding-top: 0; } #search_mini_form label { display: none; } #search_mini_form .input-text { float: left; width: 226px; height: 42px; background-color: #f1f1f1; border-radius: 3px 0px 0px 3px; } #search_mini_form .search-button { width: 55px; float: left; padding: 3px 11px; border-radius: 0 3px 3px 0; font-size: 18px; } /* ============================================ * * Header - Account * ============================================ */ /* -------------------------------------------- * .uno { height: 25px; background-color: rgba(225, 225, 225, 0.9); padding: 5px; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; width: 178px; /**/ position: absolute; opacity: 0; bottom: 0px; } .dos { bottom: 78px; /**/ opacity: 1; } .header-login.opened .skip-account { color: #159939; } .header-login .block-login { display: none; position: absolute; z-index: 9999; top: 40px; right: 0; width: 395px; background-color: #ffffff; padding: 15px; font-size: 13px; line-height: 1.5; font-family: "robotoregular", Verdana, Arial, sans-serif; text-align: left; border: 1px solid #ddd; } #header-account .block-title strong { padding: 0; font-size: 14px; text-transform: none; } #header-account .button { width: 155px; } #header-account input { margin: 5px 0; } #header-account a { font-size: 13px; } #header-account .line-separator { border-top: 1px solid #eee; margin: 15px 0; } #header-account .buttons-set .new-user { width: 100%; clear: both; text-align: left; font-size: 15px; font-family: "robotobold", Georgia, Times, "Times New Roman", serif; padding-top: 17px; } #header-account .buttons-set .new-user p { font-family: #636363; font-size: 12px; } #header-account .buttons-set p { float: left; font-size: 13px; text-align: left; padding-top: 20px; } #header-account .password { font-family: "robotobold", Georgia, Times, "Times New Roman", serif; } /* ============================================ * * Header - Cart * ============================================ */ /* -------------------------------------------- * * Skip Link - Cart */ .skip-cart:not(.skip-active):hover .icon { background-position: -50px -95px; } .skip-cart .icon { background-position: 0px -95px; } .skip-cart { width: auto; } #header-cart.skip-active { display: block; position: absolute; z-index: 200; top: 30px; right: 0; width: 275px; } /* -------------------------------------------- * * Skip Cart Notifier */ .skip-cart .count { border-radius: 12px; display: inline-block; top: -6px; position: relative; z-index: 5; width: 22px; height: 22px; background: rgba(21, 153, 57, 0.9); color: #FFFFFF; font-size: 11px; line-height: 22px; text-align: center; font-family: "robotoregular", Verdana, Arial, sans-serif; } .skip-cart.no-count .count { display: none; } @media only screen and (max-width: 499px) { .skip-cart .count { margin-left: -12px; } } .skip-cart:hover { text-decoration: none; } .skip-cart .count { border-radius: 0px; position: static; background: none; margin-left: 0px; font-size: 14px; width: auto; } .skip-cart .count:before { content: '('; } .skip-cart .count:after { content: ')'; } .skip-cart .count, .skip-link.skip-active .count { color: #159939; } .skip-cart .count.empty { display: none; } /* -------------------------------------------- * * Mini Cart - Empty */ .cart-menu .empty { padding: 20px; text-align: center; } /* -------------------------------------------- * * Mini Cart - Full */ /* Actions */ .cart-menu .actions { overflow: hidden; padding: 15px; } .cart-menu .actions .button { float: left; width: 48%; } .cart-menu .actions .button + .button { margin-left: 4%; } /* Subtotal */ .cart-menu .subtotal { padding: 0 15px 15px; font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 24px; line-height: 1.2; } /* List */ .mini-cart-list { margin-bottom: 5px; } .mini-cart-list li { position: relative; min-height: 90px; padding: 15px 15px 15px 90px; border-top: 1px solid #CCCCCC; font-size: 13px; line-height: 1.35; } .mini-cart-list .product-name { display: inline-block; width: 170px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .mini-cart-list .product-image { position: absolute; left: 15px; top: 15px; } .mini-cart-list .product-image img { width: 60px; height: 60px; } .mini-cart-list .has-options { margin-bottom: 0; color: #A0A0A0; font-size: 12px; } /* Too full - additional items will be shown in cart */ .cart-menu .last-added { padding: 10px 15px 15px; border-top: 1px solid #CCCCCC; font-size: 13px; } .minicart-actions { height: 45px; } .minicart-actions ul { padding-top: 10px; } .minicart-actions ul li { float: left; width: 50%; } .minicart-actions ul li .subtotal { color: #636363; text-align: left; font-family: "robotobold", Georgia, Times, "Times New Roman", serif; font-size: 16px; text-transform: uppercase; margin-top: 8px; } .minicart-actions ul li .subtotal .price { font-family: "robotobold", Georgia, Times, "Times New Roman", serif; color: #159939; } .minicart-actions ul li .checkout-button { float: right; } /* ============================================ * * Footer * ============================================ */ /* -------------------------------------------- * * Footer */ .footer, .footer button { font-family: "robotoregular", Verdana, Arial, sans-serif; } .footer { clear: both; width: 100%; /* -------------------------------------------- * * FOOTER BLOCKS * -------------------------------------------- */ /* Footer Social Media */ /* Footer links */ /* Footer Safety Payment */ } .footer a { color: #636363; } .footer a:hover { -webkit-transition: 0.25s ease; transition: 0.25s ease; text-decoration: underline; } .footer .inline-icon { margin-right: 10px; font-size: 20px; vertical-align: text-bottom; } .footer .validation-advice { float: left; width: 100%; } .footer .logosSafetyPayment { max-width: 100%; } .footer .footer-general, .footer .newsletter { width: 100%; clear: both; } .footer .links-block { display: flex; margin: 35px -10px; } .footer .social-media { background: #eee; padding: 1px 0; } .footer .social-media .social-tab { display: flex; flex-grow: 1; border: 1px solid #ddd; margin: 0 10px; } .footer .social-media .social-tab a { display: inline-block; width: 100%; padding: 15px; align-self: center; } .footer .social-media .social-tab.social-icons { padding: 10px 20px; } .footer .social-media .social-tab.social-icons a { padding: 0; } .footer .links-block ul { flex-grow: 1; flex-basis: 0; margin: 0 10px; } .footer .links-block ul li { padding: 7px 0; text-transform: uppercase; } .footer .links-block ul .title { margin-bottom: 10px; font-family: "robotomedium", Verdana, Arial, sans-serif; font-weight: bold; } .footer .newsletter { float: left; width: 100%; } .footer .newsletter .block-subscribe { margin: 5% 0 5% 0; } .footer .newsletter .left { width: 50%; float: left; } .footer .newsletter .right { width: 40%; margin-left: 10%; float: left; } .footer .newsletter .form-subscribe-header label { font: 26px "robotomedium", Verdana, Arial, sans-serif; color: #636363; } .footer .newsletter .subscribe-message { color: #cccccc; font: 16px "robotoregular", Verdana, Arial, sans-serif; } .footer .newsletter .icon-email { color: #cccccc; font-size: 30px; } .footer .newsletter input[type=email] { float: left; padding-left: 20px; } .footer .newsletter .button { width: 127px; } .footer .newsletter .checkPolitica { margin-top: 15px; width: 100%; } .footer .newsletter .checkPolitica label { color: #636363; font-size: 15px; font-family: "robotomedium", Verdana, Arial, sans-serif; text-align: left; text-transform: initial; background: url("https://www.tudecora.com/skin/frontend/onestic/tudecora/images/checkbox_small.png") no-repeat scroll 0px 4px transparent; padding: 0 0 0 25px !important; cursor: pointer; } .footer .newsletter .checkPolitica a { text-decoration: underline; color: #636363; font-style: italic; font-weight: 900; } .footer .newsletter .checkPolitica a:hover { color: #636363; } .footer .newsletter .checkPolitica input { position: absolute; opacity: 0; } .footer .newsletter .checkPolitica .checkbox:checked + label { background: url("https://www.tudecora.com/skin/frontend/onestic/tudecora/images/checkbox-active_small.png") no-repeat scroll 0px 4px transparent; cursor: pointer; } .footer .copyright { background-color: #eee; line-height: 50px; margin-top: 21px; text-align: right; } /* ================================================= * * General Product List Styles (not module-specific) * ================================================= */ /* -------------------------------------------- * * Product List General */ .category-image { margin-bottom: 1.5em; } .products-list .action .button, .products-grid .actions .button { white-space: normal; } /* -------------------------------------------- * * Product Name */ h2.product-name, h3.product-name, h4.product-name, h5.product-name, p.product-name { margin: 0; margin-bottom: 0.5em; color: #636363; font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 24px; font-weight: 400; font-style: normal; line-height: 1.2; text-rendering: optimizeLegibility; font-size: 13px; font-family: "robotoregular", Verdana, Arial, sans-serif; font-weight: normal; line-height: 1.4; } h2.product-name a, h3.product-name a, h4.product-name a, h5.product-name a, p.product-name a { color: #636363; } /* ============================================ * * Product Grid * ============================================ */ .products-grid { position: relative; margin: 0 -10px 40px; } .products-grid:after { content: ''; display: table; clear: both; } .products-grid > li { position: relative; margin: 0px 10px; padding: 0; padding-bottom: 20px; text-align: left; } .bx-wrapper .products-grid, .bx-wrapper .products-grid > li { margin: 0; padding: 0; padding-bottom: 10px; } .products-grid-flex { position: relative; display: flex; margin: 0 -10px; } .products-grid-flex > li { position: relative; flex-grow: 1; flex-basis: 0; max-width: 21.7%; margin: 0px 20px 40px; padding: 0; text-align: left; } .products-grid > li .item-inbox { border: 1px solid #eee; } .bx-wrapper .products-grid > li .item-inbox { margin-right: 8px; } .products-grid > li:hover .item-inbox { -webkit-box-shadow: 3px 2px 10px -3px #c7c7c7; box-shadow: 3px 2px 10px -3px #c7c7c7; } .products-grid .product-image { display: block; width: 100%; } .products-grid .product-image img:hidden { display: none; } .products-grid .product-name { margin: 15px 0 5px 0; } .products-grid .product-info { position: relative; padding: 0 15px 10px; z-index: 999; } .products-grid .actions { padding-top: 10px; position: absolute; bottom: 0px; width: 100%; } .products-grid .ratings .rating-box { margin: 0 auto; } .products-grid .ratings .amount { display: none; } .products-grid .price-box { color: #A0A0A0; font-size: 13px; text-transform: uppercase; margin: 0; } .products-grid .add-to-links { margin-bottom: 0; } .products-grid .product-image:before, .products-grid .product-image:after { content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; display: none; } .products-grid .product-image:before { background-color: white; opacity: 0.8; z-index: 2; } .products-grid .product-image:after { background-image: url("https://www.tudecora.com/skin/frontend/onestic/tudecora/images/opc-ajax-loader.gif"); background-repeat: no-repeat; background-position: center; z-index: 3; } .products-grid .product-image.loading { position: relative; } .products-grid .product-image.loading:before, .products-grid .product-image.loading:after { display: block; } /* ============================================ * * Product List * ============================================ */ .products-list { margin-top: 20px; margin-bottom: 20px; } .products-list > li { padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #EDEDED; } .products-list > li:after { content: ''; display: table; clear: both; } .products-list > li .product-image { float: left; width: 33.33333%; } .products-list > li:last-child { padding-bottom: 0; border-bottom: none; } .products-list .product-shop .ratings { margin: 0; } .products-list .product-shop .ratings .rating-box, .products-list .product-shop .ratings .rating-links { float: left; margin-right: 7px; } .products-list .product-shop .ratings .rating-links { margin-top: 4px; } .products-list .product-shop .price-box { margin-top: 0; } .products-list .product-shop .action { margin: 7px 0; } .products-list .product-shop .desc { margin-top: 7px; } .products-list .product-shop .product-primary, .products-list .product-shop .desc { float: left; width: 65%; overflow: hidden; } .products-list .product-shop .product-secondary { float: right; width: 35%; text-align: right; clear: right; } @media only screen and (min-width: 480px) { .products-list .product-name a { font-size: 18px; } } @media only screen and (max-width: 1279px) { .products-list .product-shop .product-primary, .products-list .product-shop .desc { float: left; width: 60%; padding-right: 20px; } .products-list .product-shop .product-secondary { float: right; width: 40%; } } @media only screen and (max-width: 600px) { .products-list .product-shop .price-box .special-price { padding-left: 0; } .products-list .product-shop .product-primary, .products-list .product-shop .product-secondary, .products-list .product-shop .desc { float: none; width: 100%; padding-right: 0; text-align: left; } } /* Grid / List - Labels */ .products-grid > li .label-list, .products-list > li .label-list { display: block; position: absolute; top: 15px; right: 15px; z-index: 10; } .products-grid > li .label-list p, .products-list > li .label-list p { padding: 4px 10px; text-align: center; font-size: 15px; height: 32px; font-weight: 900; color: #ffffff; background-color: #159939; border-radius: 3px; } .products-grid > li .label-list p, .products-grid > li .label-list span, .products-list > li .label-list p, .products-list > li .label-list span { float: left; } .products-grid > li .label-list .icon-tag, .products-list > li .label-list .icon-tag { color: #159939; font-size: 50px; margin-top: -8px; } .products-grid > li .label-list-discount, .products-list > li .label-list-discount { right: -27px; } .no-products { min-height: 250px; margin-top: 50px; } #sln-overlay-products-list { z-index: 999; } /* ============================================ * * Mini Product List * ============================================ */ .mini-products-list .product-image { float: left; min-width: 70px; margin: 0 10px; } .mini-products-list .product-details { margin-left: 60px; } .mini-products-list .product-details .product-name { padding-top: 10px; } .mini-products-list li { margin-bottom: 10px; clear: both; } .mini-products-list li:after { content: ''; display: table; clear: both; } .mini-products-images-list:after { content: ''; display: table; clear: both; } .mini-products-images-list li.item { float: left; width: 50%; margin: 0; padding: 0 5px 10px 0; } .mini-products-images-list li.item:nth-child(even) { padding-right: 0; padding-left: 5px; } .mini-products-images-list li.item .product-image { display: block; } .mini-products-images-list li.item .product-image img { width: 100%; max-width: 100%; } /* ============================================ * * Catalog - List * ============================================ */ .category-image { border: 1px solid #CCCCCC; padding: 10px; } .category-image img { width: 100%; max-width: 100%; } .category-image img:hidden { display: none; } /* ============================================ * * Layered Navigation * ============================================ */ .block-layered-nav .block-subtitle--filter { display: none; margin: 0; margin-bottom: 10px; color: #636363; font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 14px; font-weight: bold; font-style: normal; line-height: 1.4; text-rendering: optimizeSpeed; -moz-user-select: none; -ms-user-select: none; -webkit-user-select: none; -o-user-select: none; user-select: none; font-weight: normal; margin-bottom: 0px; padding: 7px 10px; position: relative; background-color: #E0E0E0; cursor: pointer; } .block-layered-nav .block-subtitle--filter:after { content: ''; position: absolute; width: 0; height: 0; display: block; border-right: 4px solid transparent; border-left: 4px solid transparent; border-top: 4px solid #159939; border-bottom: none; left: 10px; top: 50%; margin-top: -3px; } .block-layered-nav .block-content .toggle-tabs { display: none; } .block-layered-nav .block-content > dl > dt { margin: 0; margin-bottom: 10px; color: #636363; font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 14px; font-weight: bold; font-style: normal; line-height: 1.4; text-rendering: optimizeSpeed; -moz-user-select: none; -ms-user-select: none; -webkit-user-select: none; -o-user-select: none; user-select: none; font-weight: normal; margin-bottom: 0px; padding: 7px 10px; position: relative; background-color: #E0E0E0; display: block; } .block-layered-nav .block-content > dl > dt:after { content: ''; position: absolute; width: 0; height: 0; display: block; border-right: 4px solid transparent; border-left: 4px solid transparent; border-top: 4px solid #159939; border-bottom: none; left: 10px; top: 50%; margin-top: -3px; } .block-layered-nav .block-content > dl > dd { padding: 8px 0 8px 15px; margin: 0; } .menu_category { float: left; width: 100%; border-radius: 5px; margin-bottom: 20px; } .menu_category #title_category { position: relative; display: block; margin: 0 0 10px; padding: 10px 0; font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 18px; line-height: 1.2; text-transform: uppercase; text-rendering: optimizeSpeed; -moz-user-select: none; -ms-user-select: none; -webkit-user-select: none; -o-user-select: none; user-select: none; } .menu_category ul { float: left; } .menu_category ul li { float: left; width: 100%; } .menu_category ul li a { display: block; font-size: 14px; padding: 8px 0 8px 15px; margin: 0; } .menu_category ul li.menu_subcategory_list:before { font-family: "iconfont"; font-style: normal; font-weight: normal; speak: none; display: inline-block; text-decoration: none; text-align: center; font-variant: normal; text-transform: none; line-height: 1em; content: '\e603'; font-size: 25px; float: right; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); margin: 8px 7px 0 0px; cursor: pointer; } .menu_category ul li.menu_subcategory_list a { width: 150px; } .menu_category .menu_subcategory_list ul { display: none; } .menu_category .current-category ul { display: block; } .menu_category .current-category .levels_4 a { content: none; } .menu_category .custom-select-container select, .menu_category .custom-select-container span { padding-top: 10px; padding-bottom: 10px; } .block-layered-nav dl dd { max-height: 250px; overflow-y: auto; padding: 0 15px 0 0; } .block-layered-nav dl dd ol > li > span, .block-layered-nav dl dd ol > li > a { display: block; margin-bottom: 5px; font-size: 14px; color: #636363; overflow: hidden; } .block-layered-nav dl dd ol > li > span:hover, .block-layered-nav dl dd ol > li > a:hover { color: #636363; } .block-layered-nav dl dd ol > li > span .label, .block-layered-nav dl dd ol > li > a .label { float: left; width: calc(100% - 35px); } .block-layered-nav dl dd ol > li > span .count, .block-layered-nav dl dd ol > li > a .count { float: right; max-width: 35px; } .block-layered-nav dl dd ol { } .block-layered-nav dl dd li { margin: 0; } .block-layered-nav dl dd li.disabled a { color: #bbb; } .block-layered-nav dl dd .sln-type-image { padding: 8px; } .block-layered-nav dl dd .sln-type-image li { border: none; padding: 0; } .block-layered-nav dl dd .sln-type-image li img { float: left; padding: 2px; height: 48px; margin: 1px; } .block-layered-nav dt { cursor: inherit; } .block-layered-nav dt span, .block-layered-nav .currently .block-subtitle { width: 100%; padding-bottom: 10px; font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 15px; line-height: 1; text-transform: uppercase; } .block-layered-nav dt.filter-title-price span { border-bottom: 0; } .block-layered-nav .filter, .block-layered-nav .currently { margin-bottom: 20px; padding: 15px 2px 15px 10px; border: 1px solid #eee; } .block-layered-nav .filter.numerico ol { display: flex; flex-flow: row wrap; justify-content: flex-start; margin: 0 -5px; } .block-layered-nav .filter.numerico ol li { display: flex; width: calc(25% - 10px); padding: 5px 0px; margin: 5px; border: 1px solid #eee; border-radius: 4px; } .block-layered-nav .filter.numerico li a { width: 100%; margin: 0; text-align: center; line-height: 1.2; } .block-layered-nav .filter.numerico li a span { float: none; } .block-layered-nav .filter.numerico li span.count { display: none; } .block-layered-nav .filter.numerico dt span { border-bottom: 0; } .block-layered-nav .filter.numerico li.disabled { border: 1px solid #636363; } .block-layered-nav .filter.numerico li.disabled a { color: #636363; } .block-layered-nav dl .filter-items-cat { max-height: none; overflow-y: hidden; } .block-layered-nav dl .filter-items-price { overflow: hidden; } .block-layered-nav dl .filter-items-price .tpgRangeIndicator { background-color: #bbbbbb !important; height: 3px !important; opacity: 1 !important; border-radius: 10px; top: 1px !important; } .block-layered-nav dl .filter-items-price .tpgSliderInnerRail { border-radius: 10px; background-color: #969696 !important; height: 5px !important; top: 0px !important; width: 120px !important; } .block-layered-nav dl .filter-items-price .tpgSliderRail div:nth-child(5) { left: 80px !important; } .block-layered-nav dl .filter-items-price .tpgSliderRail div:nth-child(5) span:after { /*content: 'euro'; compass error*/ margin-left: -3px; } .block-layered-nav dl .filter-items-price .tpgSliderRail div:nth-child(3) { left: 0px !important; } .block-layered-nav dl .filter-items-price .tpgSliderRail div:nth-child(3) span:after { /*content: 'euro'; compass error*/ margin-left: -3px; } .block-layered-nav dl .filter-items-price .tpgHorizontalSlider { margin-top: 38px; } .block-layered-nav dl .filter-items-price .tpgHorizontalSlider .tpgDynLabel { background-color: #159939; color: #ffffff; font-size: 13px; font-family: "robotobold", Georgia, Times, "Times New Roman", serif; top: -36px; padding: 5px 7px; border-radius: 5px; -webkit-box-shadow: 0px 3px 2px 1px #c7c7c7; box-shadow: 0px 3px 2px 1px #c7c7c7; } .block-layered-nav dl .filter-items-price .tpgSliderThumb { height: 15px; width: 15px; border-radius: 100px 100px 100px 100px; -moz-border-radius: 100px 100px 100px 100px; -webkit-border-radius: 100px 100px 100px 100px; background: #ffffff; border: 1px solid #636363 !important; padding: 0px !important; cursor: pointer; top: -3px !important; } .block-layered-nav dl .filter-items-price #tpgSlider_tpgDoubleSlider_doubleSlider_price_end { left: 118px !important; } .block-layered-nav .block-content > dl > dt { padding-left: 10px; font-family: "robotomedium", Verdana, Arial, sans-serif; font-size: 15px; text-transform: inherit; color: #636363; } .menu_category #title_category:after, .block-layered-nav .block-content > dl > dt:after { display: none; } .menu_category ul li a, .block-layered-nav dl dd li { padding: 4px 0 4px 0px; } #doubleSlider_price { height: 60px; } .block-layered-nav .currently { padding-right: 10px; } .block-layered-nav .currently ol li { margin-bottom: 5px; } .block-layered-nav .currently ol li .label { font-weight: bold; } .block-layered-nav .currently ol li:after { content: ''; display: table; clear: both; } .block-layered-nav .actions { width: 100%; padding: 0 !important; text-align: center; background: none; } .block-layered-nav .actions a { float: none; width: 100% !important; color: #159939; } /* CATEGORY HEADER */ .category-header { min-height: 300px; margin-bottom: 20px; background-color: #DDD; background-repeat: no-repeat; background-size: cover; background-position: center; } .category-header .wrap-content { min-height: 300px; } .category-header .category-info { position: absolute; bottom: 25px; right: 25px; width: 50%; padding: 30px 30px 20px 30px; background-color: rgba(255,255,255,.7); font-family: "robotomedium", Verdana, Arial, sans-serif; font-size: 14px; } .category-header .page-title { margin: 0; padding: 0; } .category-header h1 { font-family: "robotobold", Georgia, Times, "Times New Roman", serif; font-size: 18px; text-transform: uppercase; } .category-header .std p { margin-bottom: 10px; } .subcategories-empty { margin-bottom: 10px; float: left; width: 100%; height: 25px; } .subcategories { float: left; position: relative; width: 100%; height: 160px; margin-bottom: 10px; } .subcategories .subcat-wrapper { width: 995px; margin: auto; height: 160px; padding: 20px 0; position: relative; } .subcategories .subcat-wrapper span { position: absolute; width: 360px; height: 160px; display: block; line-height: 1.2; } .subcategories .subcat-wrapper .catnobxslider { height: 160px; } .subcategories .subcat-wrapper span.bg-left { left: -360px; bottom: 0px; } .subcategories .subcat-wrapper span.bg-right { right: -360px; bottom: 0px; } .subcategories .subcat-wrapper li { float: left; width: 124px; text-align: center; } .subcategories .subcat-wrapper li img { width: 116px; height: 116px; border-radius: 150px; margin: auto; } .subcategories .subcat-wrapper li .subcat-name { float: left; margin-top: -35px; position: relative; padding: 0 2px; width: 100%; text-align: center; height: 30px; display: table; } .subcategories .subcat-wrapper li .subcat-name p { display: table-cell; vertical-align: middle; position: relative; } .subcategories .subcat-wrapper li .subcat-name-bkg { position: relative; height: 125px; width: 112px; float: left; margin-top: -122px; margin-left: 2px; } .subcategories .subcat-wrapper li:hover img { border-color: #E6C900; } .subcategories .subcat-wrapper li .active img { border-color: #E6C900; } .actions-current { position: absolute; top: 27.5%; width: 100%; max-width: 993px; text-align: right; } /* ============================================ * * Catalog - Product * ============================================ */ #messages_product_view .notice-msg { width: 995px; margin: 0 auto; } .product-view .product-essential .extra-info .ratings .rating-box, .product-view .product-essential .extra-info .ratings .amount { float: left; } .product-view .product-essential .extra-info .ratings .rating-box { margin-top: 8px; margin-right: 10px; } .product-view .product-essential .extra-info .ratings:after { content: ''; display: table; clear: both; } .product-view .product-essential:after { content: ''; display: table; clear: both; } .product-view .product-shop .product-name .h1, .product-view .product-img-box .product-name h1 { color: #159939; margin-bottom: 10px; border: 0; } .product-view .product-shop { width: 45%; float: right; } .product-view .product-shop .top-info .price-info { display: none; } .product-view .product-shop .product-name h1 { font-size: 18px; text-transform: uppercase; } .product-view .product-shop .product-name h1::first-letter { text-transform: uppercase; } .product-view .product-shop .sku { color: #ccc; } .product-view .product-shop .extra-info { float: left; padding-right: 15px; clear: left; width: 70%; } .product-view .product-shop .price-info { float: right; padding-left: 15px; text-align: right; } .product-view .product-shop .extra-info, .product-view .product-shop .price-info { max-width: 70%; margin-bottom: 10px; } .product-view .product-shop .short-description { padding: 20px 0; text-align: justify; } .product-view .product-shop .short-description p, .product-view .product-shop .short-description ul { margin-bottom: 0; } .product-view .product-shop .short-description .std > * > br { display: none; } .product-view .product-shop .ratings { margin-bottom: 8px; } .product-view .product-shop .availability { font-size: 16px; } .product-view .product-shop label.required:after, .product-view .product-shop span.required:after { content: no-close-quote; } .product-view .product-shop .choose-options { font-weight: bold; text-transform: uppercase; } .product-view .product-shop .price-box { float: left; width: 30%; min-width: 150px; margin: 5px 0 0; } .product-view .product-shop .price-box .old-price { margin: 9px 0 0 0px; } .product-view .product-shop .price-box .old-price, .product-view .product-shop .price-box .special-price, .product-view .product-shop .price-box .regular-price { padding-right: 0; line-height: 1.2; float: left; } .product-view .product-shop .price-box .old-price .tax, .product-view .product-shop .price-box .special-price .tax, .product-view .product-shop .price-box .regular-price .tax { color: #dddddd; font-family: "robotoregular", Verdana, Arial, sans-serif; font-size: 12px; text-transform: uppercase; } .product-view .product-shop .price-box .regular-price .price, .product-view .product-shop .price-box .special-price .price, .product-view .product-shop .price-box .full-product-price .price { font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 24px; color: #159939; } .product-view .product-shop .price-box .special-price .price-label { font-size: 16px; text-transform: uppercase; } .product-view .product-shop .price-box .special-price span.weee { color: #636363; } .product-view .product-shop .price-box .special-price span.weee span.price { font-size: 16px; } .product-view .product-shop .price-box .price-excluding-tax, .product-view .product-shop .price-box .price-including-tax { display: block; line-height: 1.2; color: #636363; } .product-view .product-shop .price-box .price-excluding-tax .label, .product-view .product-shop .price-box .price-including-tax .label { font-size: 16px; font-weight: 300; } .product-view .product-shop .price-box .price-excluding-tax .price, .product-view .product-shop .price-box .price-including-tax .price { font-size: 20px; } .product-view .product-shop .price-box.map-info a { display: inherit; } .product-view .product-shop .old-price .price-label { display: none; } .product-view .add-to-cart-wrapper { float: right; clear: right; } .product-view .add-to-cart-wrapper .no-stock .no-stock-text { float: left; width: 50%; color: #159939; vertical-align: middle; height: 50px; padding: 12px; border: 3px solid #159939; border-radius: 3px; } .product-view .add-to-cart-wrapper .no-stock .no-stock-text p { text-transform: uppercase; text-align: center; } .product-view .add-to-cart-wrapper .no-stock .category-links { float: right; width: 100%; color: #bbbbbb; margin: 30px 0 0 0; } .product-view .add-to-cart-wrapper .no-stock a { color: #bbbbbb; margin-left: 5px; } .product-view .add-to-cart-wrapper .no-stock a .icon-arrow { font-size: 9px; } .product-view .add-to-cart-wrapper .no-stock a:hover { color: #159939; } @media only screen and (max-width: 850px) { .product-view .product-shop .price-box .price-excluding-tax .label, .product-view .product-shop .price-box .price-including-tax .label { font-size: 15px; } .product-view .product-shop .price-box .price-excluding-tax .price, .product-view .product-shop .price-box .price-including-tax .price { font-size: 18px; } } @media only screen and (max-width: 420px) { .product-view .product-shop .price-box .price-excluding-tax, .product-view .product-shop .price-box .price-including-tax { margin-bottom: 5px; } .product-view .product-shop .price-box .price-excluding-tax span, .product-view .product-shop .price-box .price-including-tax span { display: block; } } .product-img-box { width: 53%; float: left; } .product-img-box .product-name h1 { border: 0; } .product-img-box .product-image a, .product-img-box .product-image a:hover { display: block; position: relative; margin: 0 auto; width: 100%; } .product-img-box .product-image img { max-width: 100%; max-height: 750px; margin: 0 auto; } .label-discount { display: block; position: absolute; height: 60px; width: 102px; top: 68px; z-index: 10; font-weight: 900; } .label-discount p { padding: 10px 0; text-align: center; font-size: 18px; text-transform: uppercase; } .label-discount span { font-size: 24px; } .product-image-gallery { position: relative; border: 1px solid #eee; } .product-image-gallery .gallery-image { display: none; } .product-image-gallery .gallery-image.visible { display: block; } .product-image-gallery .gallery-image.visible.hidden { visibility: hidden; } .product-image-gallery .icon-zoom-in { font-size: 24px; padding: 2%; z-index: 50; position: absolute; float: left; color: #f1f1f1; left: 0; top: 0; display: none; } .product-image-gallery:before, .product-image-gallery:after { content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; display: none; } .product-image-gallery:before { background-color: white; opacity: 0.8; z-index: 2; } .product-image-gallery:after { background-image: url("https://www.tudecora.com/skin/frontend/onestic/tudecora/images/opc-ajax-loader.gif"); background-repeat: no-repeat; background-position: center; z-index: 3; } .product-image-gallery.loading { position: relative; } .product-image-gallery.loading:before, .product-image-gallery.loading:after { display: block; } .product-image-gallery:hover .icon-zoom-in { display: block; } .product-image-thumbs li { display: inline-block; width: 140px; height: 140px; margin: 10px 4px; border: 1px solid #eee; } .product-image-thumbs li:not(.li-product-image) a { background-color: white; } .product-image-thumbs li:not(.li-product-image) a img { padding-top: 10px; } .product-image-thumbs a { position: relative; display: block; } .product-image-thumbs a img { width: 100%; height: auto; } .product-image-thumbs a.fancy-video { padding: 15px 0; } .product-image-thumbs span.fancy-video { display: block; width: 70px; height: 70px; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); background: transparent url(https://www.tudecora.com/skin/frontend/onestic/tudecora/images/video-link-red.png) no-repeat center center; z-index: 999; } .no-touch .product-image-thumbs a:hover { background-color: #f1f1f1; } .no-touch .product-image-thumbs a.fancy-video:hover { background-color: initial; } .product-view .product-shop, .product-view .add-to-cart-wrapper { padding-left: 0; } .product-img-box { padding-right: 0; } .product-view .product-shop, .product-img-box, .product-collateral, .box-collateral { margin-bottom: 10px; } .product-view { /* Set a min-height so that the floated elements break appropriately */ } .product-view .add-to-box:after, .product-view .add-to-cart:after { content: ''; display: table; clear: both; } .product-view .add-to-box { position: relative; width: 100%; padding: 15px; border: 1px solid #ddd; overflow: hidden; } .product-view .add-to-cart { float: right; width: 70%; } .product-view .add-to-cart .qty-wrapper { float: left; width: 130px; margin-top: 5px; } .product-view .add-to-cart .qty-wrapper label { float: left; margin-right: 10px; } .product-view .qty-wrapper p { margin-top: 5px; float: left; } .product-view .qty-wrapper .qty { float: left; height: 32px; margin-left: 12px; padding: 5px; } .product-view .qty-wrapper .more-less { float: left; width: 23px; height: 32px; margin-left: -1px; background: none; border: 1px solid #ddd; border-radius: 2px; } .product-view .qty-wrapper .more-less .more, .product-view .qty-wrapper .more-less .less { float: left; width: 100%; height: 16px; font-size: 18px; padding: 0% 6%; margin-top: -1px; } .product-view .qty-wrapper .more-less .more:hover, .product-view .qty-wrapper .more-less .less:hover { background-color: #ddd; } .product-view .add-to-cart .qty-wrapper label { line-height: 40px; } .product-view .add-to-cart-buttons { float: right; width: calc(100% - 150px); } .product-view .add-to-cart-buttons .paypal-logo { clear: left; text-align: center; } .product-view .add-to-cart-buttons .paypal-logo .paypal-button { margin: 0 auto; display: block; width: 170px; } .product-view .add-to-cart-buttons .paypal-logo .bml_button { display: block; width: 174px; margin: 0 auto; } .product-view .add-to-cart-buttons .paypal-logo .bml_button a { text-align: center; } .product-view .add-to-cart-buttons .paypal-logo .paypal-or { display: block; margin-bottom: 10px; margin-left: 0; margin-right: 0; line-height: 1; text-align: center; } .product-view .add-to-cart-buttons .button { width: 100%; height: 42px; font-size: 16px; } .product-view .add-to-cart-buttons .button:hover { background-color: #44AA5E; } .product-view .add-to-cart-buttons .button:active, .product-view .add-to-cart-buttons .button:focus { border: 0; } .product-view .add-to-cart-buttons span#ajax_loader img { width: 2%; margin: 1px 0 0 -45px; position: absolute; } .product-view .alert-price, .product-view .alert-stock { clear: both; } /* This is the "or" that separates the "Add to Cart" and "Add to X" links */ .add-to-box .or { display: none; } .product-view .add-to-links { margin: 0px; float: left; } .product-view .add-to-links:after { content: ''; display: table; clear: both; } .product-view .add-to-links li { float: left; } .product-view .add-to-links a { padding: 0px 0px 0px 14px; margin-left: 7px; border-right: 1px solid #CCCCCC; font-size: 34px; color: #636363; float: right; } .product-view .add-to-links li:first-child a { margin-left: 0px; margin-top: -6px; } .product-view .add-to-links li:last-child a { border-right: 0px; } .product-view .sharing-links { float: left; width: 100%; margin-bottom: 38px; } .product-view .sharing-links span { float: left; padding: 30px 0 10px; width: 100%; } .product-view .sharing-links:after { content: ''; display: table; clear: both; } .product-view .sharing-links li { float: left; padding: 0px; } .product-view .sharing-links a { font-size: 25px; color: #cccccc; margin-right: 14px; } .product-view .sharing-links a:hover { color: #636363; } @media only screen and (max-width: 599px) { .add-to-box .add-to-links a { float: none; width: auto; text-indent: 0; } } .collateral-tabs dd h2 { display: none; } .box-collateral { clear: both; } @media only screen and (min-width: 771px) { .product-collateral .toggle-tabs { display: block; width: 100%; position: relative; border: 1px solid #CCCCCC; background-color: #F4F4F4; } .product-collateral .toggle-tabs li { float: left; border-right: 1px solid transparent; border-left: 1px solid transparent; } .product-collateral .toggle-tabs li > span { -moz-user-select: none; -ms-user-select: none; -webkit-user-select: none; -o-user-select: none; user-select: none; display: inline-block; padding: 0 30px; height: 40px; line-height: 40px; cursor: pointer; text-transform: uppercase; font-size: 12px; position: relative; bottom: -1px; } .product-collateral .toggle-tabs li.current { border-right: 1px solid #CCCCCC; border-left: 1px solid #CCCCCC; } .product-collateral .toggle-tabs li.current > span { background-color: #FFFFFF; z-index: 5; } .product-collateral .toggle-tabs li.current span, .product-collateral .toggle-tabs li:hover span { color: #159939; } .product-collateral .toggle-tabs li:first-child { border-left: none; } .product-collateral .toggle-tabs:after { content: ''; display: table; clear: both; } .product-collateral > dl { width: 100%; } .product-collateral > dl > dt { display: none; } .product-collateral > dl > dd { width: 100%; display: none; padding: 15px; border: 1px solid #CCCCCC; border-top: 0; } .product-collateral > dl > dd.current { display: block; } } .product-img-box .product-name { display: none; } .product-view .ratings .rating-links { clear: left; float: left; margin-top: 0; } #product-attribute-specs-table { max-width: 50em; border: 1px solid #C0C0C0; } #product-attribute-specs-table th { border-right: 1px solid #C0C0C0; border-bottom: 1px solid #C0C0C0; } /* -------------------------------------------- * * Catalog - Grouped Product List */ .grouped-items-table-wrapper { border: solid 1px #C0C0C0; width: 100%; padding: 10px; margin-bottom: 15px; } .grouped-items-table-wrapper tbody tr:last-child td { border-bottom: none; } .grouped-items-table .name-wrapper { color: #636363; font-family: "robotobold", Verdana, Arial, sans-serif; } .grouped-items-table .qty-wrapper { padding-top: 7px; } .grouped-items-table .qty-label { margin-left: 7px; } .grouped-items-table td { padding: 4px; } .grouped-items-table td:last-child { width: 30%; text-align: left; } .grouped-items-table .price-box { text-align: right; } /* -------------------------------------------- * * Catalog - Product Options */ .product-options { overflow: hidden; } .product-options .option .validation-advice { width: 100%; float: left; } .product-options .option { float: left; width: 100%; margin-top: 20px; } .product-options .option:first-child { margin-top: 0; } .product-options .customScrollBar { height: auto; overflow: auto; width: 100%; clear: both; } .product-options .mCSB_container { display: flex; flex-wrap: wrap; } .product-options .option li.swatch { display: block; margin: 10px 15px 0 0; width: 95px; } .product-options .option li.swatch img { width: 100%; } .product-options .option li.swatch a { display: block; width: 100%; } .product-options .option li.swatch .title-color { margin-top: 5px; font-size: 12px; text-align: center; font-family: "robotolight", Verdana, Arial, sans-serif; color: #636363; width: 100%; } .option img.swatch, .option div.swatch { border: 1px solid #eee; } .product-options .option div.swatch-color { border: 1px solid #dddddd; } .product-options .option img.swatch-selected, .product-options .option div.swatch-selected { border: 1px solid #212121; width: 100%; } .product-options .option div.container-swatch-color { margin-bottom: 5px; } .product-options .custom-select-container .custom-required-field, .product-options .custom-required-field { display: none; margin-top: 5px; float: left; width: 100%; color: #DF280A; font-family: "robotoregular", Verdana, Arial, sans-serif; } .product-options dd.select-something .custom-required-field { display: block; } .product-options .custom-required-field.no-select-something { display: none !important; } .product-options .custom-select-container .custom-required-field.validation-passed { display: none !important; } .product-options .custom-select-container.validation-failed .custom-required-field { display: block; } .no-options .product-options { border: none; background: none; margin: 0; padding: 20px 0 0 0; -webkit-box-shadow: none; box-shadow: none; } .product-options p.required { margin-top: 7px; float: right; color: #636363; font-size: 11px; font-style: italic; } @media only screen and (max-width: 979px) { .product-view .product-options .required { position: static; } } .product-options dt { margin: 10px 0 5px; } .product-options dt:first-child { margin-top: 0; } .product-options dd .qty-holder { display: block; padding: 10px 0 0 0; } .product-options dd .qty-holder .qty { width: 3em; } .product-options dd .qty-holder label { vertical-align: middle; } .product-options dd .qty-disabled { background: none; border: 0; padding: 0 2px; } .product-options dd ul { background-color: #ffffff; } .product-options dd ul.options-list { background-color: initial; float: left; background: #ffffff; width: 325px; margin: 6px 0 0 0; -webkit-box-shadow: 6px 5px 11px 2px #c7c7c7; box-shadow: 6px 5px 11px 2px #c7c7c7; } .product-options dl.last dd.last { border-bottom: 0; padding-bottom: 5px; margin-bottom: 0; } .product-options dd .input-text { width: 100%; background-color: #ffffff; border-radius: 0; } .product-options dd .input-box { padding-top: 0; } .product-options dd input.datetime-picker { width: 150px; } .product-options dd .time-picker { display: -moz-inline-stack; display: inline-block; vertical-align: middle; *vertical-align: auto; zoom: 1; *display: inline; padding: 2px 0; vertical-align: middle; } .product-options dd textarea { width: 100%; max-width: 100%; height: 8em; -webkit-box-shadow: 6px 5px 11px 2px #c7c7c7; box-shadow: 6px 5px 11px 2px #c7c7c7; } .product-options ul.options-list { margin-right: 5px; } .product-options ul.options-list li { line-height: 1.5; margin-bottom: 7px; } .product-options ul.options-list li:last-child { margin-bottom: 0; } .product-options ul.options-list .radio, .product-options ul.options-list .checkbox { float: left; margin-top: 5px; } .product-options ul.options-list .label { display: block; padding: 0; } .product-options ul.options-list .label:hover { background-color: #f1f1f1; } .product-options ul.options-list label { font-weight: normal; background: none; padding: 4px 10px 2px 40px; } .product-options ul.options-list label:hover { background: none; } .product-options p.note { margin: 0; font-size: 11px; } .product-options-bottom { position: relative; padding-top: 30px; margin-top: 15px; border-top: 1px solid #eee; } .product-options-bottom .sharing-links { display: none; } .product-options-bottom .tax { position: absolute; top: 15px; left: 0; font-size: 11px; } .product-options-bottom:after { content: ''; display: table; clear: both; } .product-options-bottom .product-pricing, .product-options-bottom .tier-prices { float: right; margin: 0; padding: 0 0 10px; border: 0; background: 0; color: #636363; } @media only screen and (max-width: 1199px) { .product-options-bottom .product-pricing, .product-options-bottom .tier-prices { float: none; width: 100%; text-align: right; padding-bottom: 5px; margin-bottom: 10px; border-bottom: 1px solid #CCCCCC; } } .product-options-bottom .tier-prices li { background: 0; padding: 2px 0; } .product-options-bottom .tier-prices .price, .product-options-bottom .tier-prices .benefit { color: #636363; } /* -------------------------------------------- * * Related Products */ /* -------------------------------------------- * * Upsell Products */ .box-up-sell { margin-top: 20px; } .box-up-sell .ratings { display: none; } /* ============================================ * * Catalog - MSRP MAP Popup * ============================================ */ .cart-msrp-totals { color: red; font-size: 12px !important; font-weight: bold; margin: 10px 10px 0; padding: 10px; text-align: right; text-transform: uppercase; } .map-cart-sidebar-total { color: red; display: block; font-size: 10px; font-weight: bold; text-align: left; padding: 2px 5px; } .map-popup { background: #FFFFFF; border: 5px solid #CCCCCC; margin: 12px 0 0; position: absolute; text-align: left; width: 450px; z-index: 100; } @media only screen and (min-width: 771px) { .map-popup.map-popup-right { left: 10px !important; } .map-popup.map-popup-left { left: auto !important; right: 10px !important; } } @media only screen and (max-width: 770px) { .map-popup { width: 100%; left: 0px !important; } } .map-popup .map-popup-heading { padding: 8px 10px; margin-right: 40px; width: auto; } .map-popup .map-popup-heading h3 { font-size: 14px; margin: 0; overflow: hidden; white-space: nowrap; word-wrap: break-word; text-align: left; text-overflow: ellipsis; } @media only screen and (max-width: 479px) { .map-popup .map-popup-heading h3 { text-align: center; } } .map-popup .map-popup-close { display: block; position: absolute; top: 0px; right: 0px; height: 36px; width: 36px; font-size: 20px; line-height: 32px; text-align: center; } .map-popup .map-popup-content { border-top: 1px solid #EDEDED; padding: 10px; margin: 0 10px; overflow: hidden; text-align: left; } @media only screen and (max-width: 479px) { .map-popup .map-popup-content { text-align: center; } } .map-popup .map-popup-checkout { padding: 10px 0; } .map-popup .map-popup-checkout form:after { content: ''; display: table; clear: both; } .map-popup .map-popup-checkout span { display: block; } .map-popup .map-popup-checkout .button { float: left; margin: 0 2px; clear: left; } .map-popup .map-popup-checkout .additional-addtocart-box { float: left; min-width: 210px; } .map-popup .map-popup-checkout .additional-addtocart-box li { list-style-type: none; } .map-popup .map-popup-checkout .paypal-logo { width: auto; } .map-popup .map-popup-checkout .paypal-logo a { display: inline-block; float: left; clear: left; } .map-popup .map-popup-checkout .paypal-logo .paypal-or { float: left; text-align: center; padding: 5px 15px; clear: left; } .map-popup .map-popup-checkout .paypal-logo:after { content: ''; display: table; clear: both; } .map-popup .map-popup-checkout .paypal-logo .bml_button a { clear: left; } @media only screen and (max-width: 479px) { .map-popup .map-popup-checkout { text-align: center; } .map-popup .map-popup-checkout .button, .map-popup .map-popup-checkout .additional-addtocart-box, .map-popup .map-popup-checkout .paypal-logo a, .map-popup .map-popup-checkout .paypal-logo .paypal-or { float: none; } .map-popup .map-popup-checkout .additional-addtocart-box { min-width: 0px; } .map-popup .map-popup-checkout .paypal-logo .paypal-or { margin: 0px; margin-bottom: 10px; } } .map-popup .map-popup-checkout:after { content: ''; display: table; clear: both; } .map-popup .map-popup-price { padding: 10px 0; } @media only screen and (max-width: 479px) { .map-popup .map-popup-price { text-align: center; padding-top: 0px; } } .map-popup .map-popup-price .price-box, .map-popup .map-popup-price .price-box .special-price { display: inline-block; margin: 0; padding: 0; } .map-popup .map-popup-price .price-box .minimal-price-link { display: inline-block; } .map-popup .map-popup-text { padding: 10px 0; margin: 0 10px; word-wrap: break-word; } .map-popup .map-popup-text, .map-popup .map-popup-only-text { border-top: 1px solid #EDEDED; } /* ============================================ * * Catalog - MSRP Product Listing * ============================================ */ .price-box .map-link { display: block; text-align: center; } /* ============================================ * * Catalog - Compare * ============================================ */ .block-compare .product-name:after { content: ''; display: table; clear: both; } .compare-table .product-image { display: inline-block; } .compare-table .product-shop-row.top td { padding-bottom: 0; border-bottom: 0; } .compare-table .product-shop-row.bottom td { padding-top: 0; } /* ============================================ * * Checkout - Layout * ============================================ */ .cart-table .btn-remove2 { border: 0; } .cart-table h2.product-name, .cart-table h2 { font-size: 14px; font-family: "robotoregular", Verdana, Arial, sans-serif; text-transform: uppercase; line-height: 1.3em; } .cart-table h2.product-name::first-letter, .cart-table h2::first-letter { text-transform: uppercase; } .cart-table .product-cart-image, .cart-table .product-cart-price, .cart-table .product-cart-actions, .cart-table .product-cart-total, .cart-table .product-cart-info, .cart-table .product-cart-name, .cart-table .product-cart-remove { float: left; } .cart-table .product-cart-remove { border-radius: 50%; float: right; width: 10%; } .cart-table .product-cart-remove .icon-close-black { color: #bbbbbb; font-size: 20px; } .cart-table .product-cart-remove .icon-close-black:hover { color: #636363; } .cart-table .product-cart-remove .btn-remove:after { border-radius: 50%; } .cart-table .product-cart-name { width: 50%; float: left; margin: 0px 0 0 0; font-family: "robotobold", Georgia, Times, "Times New Roman", serif; color: #636363; } .cart-table .product-sku { float: left; margin-top: 5px; width: 100%; } .cart-table .product-sku .ref { font-family: "robotolight", Verdana, Arial, sans-serif; font-size: 12px; } .cart-table .product-cart-info { width: 93%; margin: 0; padding: 0; } .cart-table .product-cart-info .item-options { margin: 15px 0; padding: 0; font-family: "robotoregular", Verdana, Arial, sans-serif; font-size: 14px; line-height: 1.2em; } .cart-table .cart-price, .cart-table .quantity { font-family: "robotoregular", Verdana, Arial, sans-serif; font-size: 14px; } .cart-table .cart-price span, .cart-table .quantity span { padding-left: 5px; } .cart-table .cart-price span { color: #159939; font-family: "robotomedium", Verdana, Arial, sans-serif; } .cart-totals-wrapper { margin-bottom: 20px; } .cart-totals-wrapper .checkout-types { width: 100%; } .cart-totals-wrapper .checkout-types .btn-checkout { float: right; } .cart-totals-wrapper #shopping-cart-totals-table td { text-align: left; width: 150px; } .cart-totals-wrapper #shopping-cart-totals-table td span.price { float: right; } .cart-totals-wrapper .payment-info { float: left; margin: 8px 0; color: #999; font-family: "robotomedium", Verdana, Arial, sans-serif; font-size: 15px; } .cart-totals-wrapper .payment-info .icon-locked { font-size: 24px; margin-right: 5px; color: #bbbbbb; vertical-align: text-bottom; } .cart-totals-wrapper .payment-img { float: right; max-width: 275px; margin-left: 5px; } .cart-totals-wrapper .payment-img img { width: 100%; } .cart-forms, .cart-totals-wrapper, .crosssell { float: right; clear: right; width: 37%; } .cart-totals, .cart-forms .discount, .cart-forms .giftcard, .cart-forms .shipping { padding: 15px; border: 1px solid #eee; } .cart-summary { margin-bottom: 20px; font-family: "robotomedium", Georgia, Times, "Times New Roman", serif; font-size: 20px; } .cart-totals, .cart-forms .discount, .cart-forms .giftcard, .cart-forms .shipping { margin-bottom: 20px; } .checkout-cart-index #postcode { width: 100%; } .display-both-prices .cart-table { float: none; width: 100%; } .display-both-prices .cart-forms { float: left; padding-right: 10px; padding-left: 0; } .display-both-prices .cart-totals-wrapper, .display-both-prices .crosssell { padding-left: 10px; } .display-both-prices .cart-forms, .display-both-prices .cart-totals-wrapper, .display-both-prices .crosssell { width: 50%; } .display-both-prices .crosssell { clear: right; float: right; } .display-single-price:after { content: ''; display: table; clear: both; } /* ============================================ * * Checkout - Cart * ============================================ */ .cart .page-title h1 { float: left; margin: 0; } .cart .left { float: left; width: 58%; } .cart .left .products-info { } .cart .left .cart-pre-footer { padding: 15px 15px 40px; clear: both; } .cart .left .cart-pre-footer p { margin-top: 10px; color: #636363; } .cart .left .update-cart { float: right; margin-top: 5px; } .cart .left .update-cart .btn-update { position: relative; width: auto; height: 40px; margin: 0; text-transform: none; background-color: inherit; border: 0; -webkit-transition: all 0.2s ease 0s; transition: all 0.2s ease 0s; } .cart .left .update-cart .btn-update p { text-decoration: none; color: #636363; font-size: 15px; font-family: "robotoregular", Verdana, Arial, sans-serif; margin: 0 10px 0 35px; } .cart .left .update-cart .btn-update span { position: absolute; top: 10px; left: 5px; color: #636363; font-size: 25px; } .cart .left .update-cart .btn-update:hover { color: #636363; } .cart .left .update-cart .btn-update:active, .cart .left .update-cart .btn-update:focus { border: 0; } .cart .left .update-cart .btn-continue p { font-size: 14px; font-family: "robotoregular", Verdana, Arial, sans-serif; text-decoration: none; text-transform: none; } .cart .left .update-cart .btn-continue p span.link { display: block; width: 25px; margin: -8px 0 0 20px; height: 39px; float: left; } .cart .left .update-cart .btn-continue p:hover { color: #000000; } .checkout-cart-index .no-cart-content, .account-menu .no-cart-content { width: 100%; height: 244px; background: #f1f1f1; padding: 30px; margin-bottom: 130px; } .checkout-cart-index .no-cart-content .no-cart-content-box, .account-menu .no-cart-content .no-cart-content-box { width: 650px; background: #ffffff; padding: 30px; margin: 0px auto; border: 1px solid #eee; border-radius: 3px; overflow: hidden; } .checkout-cart-index .no-cart-content .no-cart-content-box .page-title, .account-menu .no-cart-content .no-cart-content-box .page-title { padding: 0; } .checkout-cart-index .no-cart-content .no-cart-content-box .cart-empty a, .account-menu .no-cart-content .no-cart-content-box .cart-empty a { text-decoration: underline; color: #636363; } .checkout-cart-index .item1, .checkout-cart-index .item2, .checkout-cart-index .item3, .account-menu .item1, .account-menu .item2, .account-menu .item3 { float: left; margin-right: 20px; margin-top: 40px; } .checkout-cart-index .item1 h2, .checkout-cart-index .item2 h2, .checkout-cart-index .item3 h2, .account-menu .item1 h2, .account-menu .item2 h2, .account-menu .item3 h2 { font: 16px "robotomedium", Verdana, Arial, sans-serif; text-transform: none; text-align: center; } .checkout-cart-index .item1 h2:hover, .checkout-cart-index .item2 h2:hover, .checkout-cart-index .item3 h2:hover, .account-menu .item1 h2:hover, .account-menu .item2 h2:hover, .account-menu .item3 h2:hover { color: #159939; } .checkout-types { float: right; text-align: right; max-width: 100%; /* We always want this shipping method to display on its own line */ } .checkout-types li { vertical-align: top; margin: 0 0 5px 5px; } .checkout-types li:after { content: ''; display: table; clear: both; } .checkout-types li img { display: inline; vertical-align: top; } .checkout-types li:first-child { margin-left: 0; } .checkout-types .method-checkout-cart-methods-multishipping { display: block; } .checkout-types.top li { display: inline-block; } .checkout-types.top .bml_button { display: inline-block; vertical-align: top; } .checkout-types.top .bml_button img { display: block; } .checkout-types.top .paypal-logo .paypal-or { margin-top: 5px; } .checkout-types.bottom .paypal-logo a, .checkout-types.minicart .paypal-logo a { display: block; } .checkout-types.bottom .paypal-or, .checkout-types.minicart .paypal-or { margin: 0px; display: block; text-align: center; } .checkout-types .button2 { width: 188px; text-align: right; margin: 11px 5px 0px 0px; padding: 0; } .checkout-types .button2 p { font-family: "robotomedium", Verdana, Arial, sans-serif; font-size: 15px; color: #636363; } .checkout-types span.icon-arrow-forward { float: right; margin-top: 14px; } .checkout-types.top { height: 5px; } .checkout-types.top button.button.btn-continue { background: none; color: grey; } @media only screen and (min-width: 741px) { .checkout-types.bottom .paypal-or { text-align: right; padding-right: 70px; } } @media only screen and (max-width: 740px) { .checkout-types { float: none; text-align: center; } .checkout-types.bottom .paypal-or, .checkout-types.minicart .paypal-or { width: auto; float: none; } .checkout-types li { float: none; width: 100%; margin-left: 0; } } .cart-table { } .cart-table th, .cart-table td, .cart-table tbody td { border-bottom: none; vertical-align: top; } .cart-table h2 { color: #636363; font-size: 14px; font-weight: 600; margin-bottom: 0; } .cart-table tbody td.last { width: 100%; } .cart-table tr { border: 1px solid #eee; border-bottom: 0; } .cart-table tr.last { border-bottom: 1px solid #eee; } .cart-table tfoot tr { background: none; } .cart-table tfoot tr > td:after { content: ''; display: table; clear: both; } .cart-table span.or { font-size: 9px; padding: 0 5px; text-transform: uppercase; font-family: "robotobold", Verdana, Arial, sans-serif; } .cart-table .product-cart-image .cart-links, .cart-table .product-cart-info .btn-remove, .cart-table .product-cart-actions .button { display: none; } .cart-table .product-cart-image { padding-left: 0; padding-right: 0; } .cart-table .product-cart-image .product-image img { max-width: 100%; width: 100%; } .cart-table .product-cart-image a.cart-edit { display: none; } .cart-table .product-cart-sku { font-family: "robotoregular", Verdana, Arial, sans-serif; font-style: italic; font-size: 12px; margin: 5px 0 12px; } .cart-table .product-cart-sku .label { font-weight: 600; } .cart-table .btn-empty { float: left; } .cart-table .product-cart-total, .cart-table .product-cart-price { text-align: center; margin-top: 1px; } .cart-table .product-cart-actions { width: 20%; float: left; } .cart-table .product-cart-total { padding-right: 15px; float: left; width: 20%; } .cart-table .cart-tax-total { position: relative; cursor: pointer; } .cart-table .cart-tax-total:after { content: ''; position: absolute; width: 0; height: 0; display: block; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-right: 6px solid #636363; border-left: none; position: absolute; top: 3px; right: -11px; } .cart-table .cart-tax-total.cart-tax-total-expanded:after { content: ''; position: absolute; width: 0; height: 0; display: block; border-right: 6px solid transparent; border-left: 6px solid transparent; border-top: 6px solid #636363; border-bottom: none; right: -15px; top: 6px; } .cart-table .cart-links > li { white-space: nowrap; line-height: 1.3; margin-bottom: 5px; min-width: 65px; font-size: 13px; } .cart-table .cart-links > li > a { display: block; } .cart-table .cart-links > li:last-child { margin-bottom: 0; } .cart-table .product-cart-actions { min-width: 60px; text-align: center; } .cart-table .product-cart-actions .qty { height: 25px; border-radius: 0; text-align: center; width: 35px; background-color: #ffffff; font-family: "robotomedium", Verdana, Arial, sans-serif; } .cart-table .product-cart-actions .button { margin-bottom: 5px; } .cart-table .item-options { padding-left: 15px; } /* ============================================ * * Checkout - Estimate Shipping and Tax * ============================================ */ .shipping h2 { font-size: 12px; font-weight: bold; margin: 0 0 5px; } .shipping select { max-width: 100%; height: 30px; display: block; border: 1px solid #C0C0C0; } .shipping select.validation-failed { border-color: #DF280A; } .shipping .shipping-desc { display: none; } .shipping .buttons-set { border: none; margin: 0; padding: 0; } .shipping .form-list:after { content: ''; display: table; clear: both; } .shipping .form-list li { float: left; margin: 5px 2% 10px 0; } .shipping .form-list .shipping-country { width: 37%; } .shipping .form-list .shipping-region { width: 41%; } .shipping .form-list .shipping-postcode { margin-right: 0; width: 18%; } .shipping .form-list .shipping-postcode input { margin-top: 4px; } .shipping .form-list .input-box { padding-top: 0; } .shipping .form-list input { height: 30px; margin-top: 4px; } .shipping .form-list label { font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 13px; font-weight: 400; text-transform: uppercase; white-space: nowrap; } .shipping .sp-methods { padding: 10px 0 0; text-align: left; } .shipping .sp-methods dd { margin-bottom: 10px; } .shipping .sp-methods label { font-family: "robotoregular", Verdana, Arial, sans-serif; font-size: 12px; font-style: italic; min-width: 100px; } .shipping .sp-methods label span { font-family: "robotobold", Verdana, Arial, sans-serif; font-weight: bold; font-style: normal; } .shipping #co-shipping-method-form .buttons-set .button { float: left; margin-left: 0; } .shipping #co-shipping-method-form .sp-methods dd label { border: 1px solid #CCCCCC; background-color: #ededed; min-width: 220px; } .shipping #co-shipping-method-form .sp-methods dd label:hover { background-color: gainsboro; } @media only screen and (max-width: 770px) { .shipping .shipping-form .form-list > li { width: 100%; float: none; } .shipping .shipping-form .form-list > li label { display: block; } .shipping .shipping-form .form-list > li input, .shipping .shipping-form .form-list > li select { width: 100%; } } .cart .cart-totals:after { content: ''; display: table; clear: both; } .cart .cart-totals table { font-family: "robotomedium", Verdana, Arial, sans-serif; font-size: 14px; width: 100%; color: #636363; } .cart .cart-totals table td { padding: 2px 0px; } .cart .cart-totals table td:first-child { padding-right: 10px; min-width: 120px; } .cart .cart-totals table tbody tr:last-child td, .cart .cart-totals table tbody tr:last-child th { padding-bottom: 10px; } .cart .cart-totals table tfoot td { font-size: 24px; padding: 2px 0px; vertical-align: top; } .cart .cart-totals table tfoot strong span, .cart .cart-totals table tfoot span.price { font-family: "robotobold", Georgia, Times, "Times New Roman", serif; color: #636363; } .cart .cart-totals table tfoot strong { font-weight: 400; font-size: 20px; } .cart .cart-totals table tfoot span.price { color: #159939; font-size: 26px; } .cart .cart-totals span.tax { margin-bottom: 20px; margin-top: -10px; width: 100%; float: left; font: 14px "robotomedium", Verdana, Arial, sans-serif; color: #636363; } @media only screen and (max-width: 600px) { .cart-totals { text-align: right; } } @media only screen and (max-width: 770px) { .cart .cart-totals table tfoot td { font-size: 18px; } } .discount-form:after, #giftcard-form:after { content: ''; display: table; clear: both; } #discount-coupon-form, .cart .giftcard { width: 100%; } #discount-coupon-form h2, .cart .giftcard h2 { display: none; } #discount-coupon-form label, .cart .giftcard label { display: block; margin-bottom: 10px; font-size: 16px; text-align: left; font-weight: normal; } #discount-coupon-form .field-wrapper, .cart .giftcard .field-wrapper { display: inline-block; } #discount-coupon-form .validation-advice, .cart .giftcard .validation-advice { display: inline; float: left; } #discount-coupon-form .button-wrapper, .cart .giftcard .button-wrapper { display: inline-block; vertical-align: bottom; } #discount-coupon-form .button-wrapper > button, .cart .giftcard .button-wrapper > button { float: left; font-size: 13px; border-radius: 0px 3px 3px 0px; } .cart .giftcard p { margin-bottom: 7px; } .cart .giftcard .check-gc-status { float: left; padding: 0px; } .cart .giftcard .check-gc-status > span > span { font-size: 14px; text-transform: none; } .cart .cart-forms .discount-form #coupon_code { float: left; height: 42px; width: 205px; border-radius: 3px 0px 0px 3px; } .cart .cart-forms .discount-form .button2 { width: 80px; height: 40px; margin: 4px 0px 0 0; } .cart .cart-forms .discount-form .button2 span { text-decoration: none; font-size: 14px; font-family: "robotoregular", Verdana, Arial, sans-serif; } /* ============================================ * * Checkout - Cart Cross sell * ============================================ */ .crosssell h2 { color: #3399CC; } .crosssell .item a.product-image { width: auto; float: left; } /* Change the layout to 2 columns at a breakpoint that is higher than a 3 columns layout would normally break */ @media only screen and (max-width: 979px) { .crosssell { /* Undo three-column config */ } .crosssell .products-grid > li:nth-child(even), .crosssell .products-grid > li:nth-child(3n), .crosssell .products-grid > li { width: 47.72727%; margin-right: 4.54545%; } .crosssell .products-grid > li:nth-child(odd) { clear: left; } .crosssell .products-grid > li:nth-child(even) { margin-right: 0; } .crosssell .products-grid > li:nth-child(3n+1) { clear: none; } } /* ============================================ * * Checkout - One Page * ============================================ */ .checkout-onepage-index .col-right, .checkout-onepage-index .col-left { display: none; } .checkout-onepage-index .col-main { width: auto; float: none; } .opc-index-index .newsletter, .opc-index-index .social-media, .opc-index-index .footer-general { display: none; } .opc-index-index .safety { margin-top: 7px; } .checkout { float: left; width: 100%; padding-bottom: 81px; min-height: 650px; } .checkout .title { float: left; } .checkout .opc-menu { float: right; width: 65%; position: relative; } .checkout .opc-menu .messages { float: left; padding-top: 1%; } .checkout .opc-menu .icon-arrow-forward { font-family: "iconfont"; color: #636363; font-size: 20px; padding: 2%; margin: 10px 12px 0 -30px; float: right; display: none; } .checkout h4 .tax { font-size: 14px; width: 100%; float: left; color: #636363; } .checkout .grand_total .price { font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 26px; color: #159939; margin-top: -5px; float: right; margin-left: 0px; } .checkout .review-menu-block .polygon { border-top: #159939; } .checkout #opc-address-form-billing, .checkout #opc-address-form-shipping, .checkout .checkout-shipping-block, .checkout .payment-block, .checkout .opc-review-actions, .checkout .comment-block { border: 1px solid #eee; padding: 20px; margin-bottom: 20px; } .checkout .opc-col-left .form-list { overflow: hidden; } .checkout .opc-wrapper-opc .btn span span .opc-col-center .checkout-shipping-block { -webkit-box-shadow: 0px 5px 10px 4px #f3f3f3; box-shadow: 0px 5px 10px 4px #f3f3f3; background-color: #ffffff; } .checkout .opc-wrapper-opc * .check-privacy-checkout-message .checkPolitica { float: right; padding-top: 25px; } .checkout .opc-wrapper-opc * .check-privacy-checkout-message .checkPolitica span { display: block; padding-top: 15px; } .checkout .opc-wrapper-opc a.review-total .opc-col-center .checkout-shipping-block { -webkit-box-shadow: 0px 5px 10px 4px #f3f3f3; box-shadow: 0px 5px 10px 4px #f3f3f3; background-color: #ffffff; } .checkout .opc-wrapper-opc #opc-review-block { width: 400px; border-radius: 3px; } .checkout .opc-wrapper-opc .opc-review-actions { float: left; min-width: 318px; } .checkout .opc-wrapper-opc .back-link { margin: 7% 0 0 0; font-size: 15px; font-family: "robotomedium", Verdana, Arial, sans-serif; } .checkout .opc-wrapper-opc .cart-pre-footer { float: right; } .checkout .opc-wrapper-opc .back-link a, .checkout .opc-wrapper-opc .back-link span { color: #636363; } .checkout .opc-wrapper-opc .back-link span { font-family: "iconfont"; font-size: 20px; margin: 3px 12px 0px 4px; float: right; } .checkout .opc-wrapper-opc .back-link:hover a, .checkout .opc-wrapper-opc .back-link:hover span { color: #636363; } .checkout .opc-wrapper-opc .btn span span:hover, .checkout .discount-block .button span, .checkout .opc-messages-action .button span span { background: #44AA5E; } .checkout .opc-wrapper-opc .login-trigger { position: absolute; right: 153px; top: 13px; height: 35px; line-height: 35px; margin-right: 20px; text-transform: none; } .checkout a.login-trigger:hover { color: #fff; } .checkout a.login-trigger:hover .icon-arrow-forward { color: #636363; } .checkout .discount-block { margin-top: 40px; } .checkout .discount-block .expand_plus { margin: -3px 0 0 10px; } .checkout .discount-block .open-block .expand_plus { margin: -3px 0 0 10px; } .checkout .discount-block .collapse-block { border: none; margin-top: 0px; } .checkout .opc-wrapper-opc .payment-block dt { background: #ffffff; } .checkout .opc-wrapper-opc .payment-block dt label { height: 40px; line-height: 36px; cursor: pointer; background: url("https://www.tudecora.com/skin/frontend/onestic/tudecora/images/checkbox.png") no-repeat scroll -3px center transparent !important; padding: 0 0 0 50px !important; } .checkout .opc-wrapper-opc .payment-block dt.active label { background: url("https://www.tudecora.com/skin/frontend/onestic/tudecora/images/checkbox-active.png") no-repeat scroll -3px center transparent !important; color: #636363; } .checkout .opc-wrapper-opc .payment-block #payment_form_serviredpro, .checkout .opc-wrapper-opc #payment_form_paypal_express, .checkout .opc-wrapper-opc #payment_form_cofidis { overflow-y: auto; max-height: 125px; margin-bottom: 15px; padding: 10px; border: 1px solid #CCCCCC; } .checkout .opc-wrapper-opc #payment_form_cofidis p { font-size: 14px; text-align: center; } .checkout .opc-wrapper-opc .payment-block .form-alt { font-family: 'Open Sans', Arial, Helvetica; color: #393939; font-size: 14px; font-style: normal; margin-bottom: 0px; text-align: center; } .checkout .md-content-wrapper input[type="text"], .checkout .md-content-wrapper input[type="password"] { padding-left: 15px; } .checkout .opc-review-actions .checkPolitica label { max-width: unset; min-height: 20px; padding: 0 0 0 25px !important; background: url("https://www.tudecora.com/skin/frontend/onestic/tudecora/images/checkbox_small.png") no-repeat scroll 0px 0px transparent !important; cursor: pointer; } .checkout .opc-review-actions .checkPolitica a { text-decoration: underline; color: #636363; font-style: italic; } .checkout .opc-review-actions .checkPolitica a:hover { color: #636363; } .checkout .opc-review-actions .checkPolitica input { position: absolute; opacity: 0; top: auto !important; } .checkout .opc-review-actions .checkPolitica .checkbox:checked + label { background: url("https://www.tudecora.com/skin/frontend/onestic/tudecora/images/checkbox-active_small.png") no-repeat scroll 0px 0px transparent !important; cursor: pointer; } .checkout .footer .newsletter, .checkout .footer .social-media, .checkout .footer .footer-general { display: none; } .checkout #checkout-review-table thead { display: none; } .checkout #checkout-review-table tbody td { float: left; } .checkout #checkout-review-table tbody td.last { float: right; } .checkout-onepage-success .success-page { width: 100%; height: 244px; background: #f1f1f1; padding: 30px; margin: 30px 0 130px 0; } .checkout-onepage-success .success-page .success-content { width: 650px; background: #ffffff; padding: 30px; margin: 0px auto; border: 1px solid #eee; border-radius: 3px; } .checkout-onepage-success .success-page .page-title { padding-left: 0; } .checkout-onepage-success .success-page .page-title h1 { width: 400px; text-align: left; float: left; border-bottom: none; margin: 0px; padding: 0px; font-size: 26px; font-family: "robotomedium", Verdana, Arial, sans-serif; color: #636363; } .checkout-onepage-success .success-page h2, .checkout-onepage-success .success-page p { text-align: left; } .checkout-onepage-success .success-page .buttons-set { border: 0; } .checkout-onepage-success .success-page .buttons-set button { float: right; } .checkout-onepage-success .success-page .button span span { vertical-align: middle; white-space: nowrap; font-family: "robotoregular", Verdana, Arial, sans-serif; font-size: 14px; } .checkout-onepage-success .success-page a.print { text-decoration: underline; } @media only screen and (min-width: 980px) { .checkout-onepage-index .col-main { float: left; width: 68.75%; padding-right: 20px; } .checkout-onepage-index .col-right, .checkout-onepage-index .col-left { width: 31.25%; display: block; } .checkout-onepage-index .col-right { padding-left: 0; } } .opc select { width: 365px; } /* -------------------------------------------- * * Section Styling - Default */ .opc .section .step-title { width: 100%; border-top: 1px solid #ECECEC; position: relative; -moz-user-select: none; -ms-user-select: none; -webkit-user-select: none; -o-user-select: none; user-select: none; } .opc .section .step-title:after { content: ''; display: table; clear: both; } .opc .section.allow:not(.active) .step-title { cursor: pointer; } /* Using .no-touch since touch devices emulate hover, thereby making steps look active that are not */ .no-touch .opc .section.allow:not(.active) .step-title:hover { background-color: #F4F4F4; } .opc .section.active .step-title { border-bottom: 1px solid #ECECEC; } .opc .section .step-title a { display: none; } .opc .section.allow:not(.active) .step-title a { display: block; float: right; line-height: 40px; height: 40px; padding: 0px 10px; } .no-touch .opc .section .step-title a:hover { text-decoration: none; } .opc .section .step-title .number, .opc .section.allow.active .step-title .number, .no-touch .opc .section.allow:hover .step-title .number { width: 26px; height: 26px; text-align: center; color: #FFFFFF; line-height: 26px; background-color: #159939; display: block; position: absolute; top: 50%; left: 10px; margin-top: -13px; } .opc .section.allow .step-title .number { background-color: #8acc9c; } .opc .section.allow .step-title h2 { color: #A0A0A0; } .opc .section.allow .step-title:hover h2, .opc .section.active .step-title h2 { color: #636363; } .opc .section .step-title h2 { font-size: 16px; font-weight: 400; line-height: 40px; height: 40px; float: left; margin: 0px 4px 0px 45px; } .opc .section .step { padding: 20px; } .opc .section .step:after { content: ''; display: table; clear: both; } @media only screen and (max-width: 979px) { .opc .section .step { padding: 10px; } } .opc select { max-width: 365px; width: 100%; } .opc h3 { font-weight: 500; } .opc .buttons-set { text-align: left; } .opc .buttons-set button.button { float: left; margin-left: 0; margin-right: 10px; margin-bottom: 0; } .opc .buttons-set p.required { float: right; margin-left: 5px; margin-bottom: 0; } .opc .buttons-set .back-link { float: right; margin: 0; } .opc .buttons-set a { line-height: 20px; display: inline-block; padding: 5px 5px 5px 0; } @media only screen and (max-width: 479px) { .opc .buttons-set .button + .buttons-set .button, .paypal-express-review .buttons-set .button + .buttons-set .button { margin-left: 0; } } .opc #opc-login .step { padding: 0px; } .opc #opc-login .buttons-set { border-top: 0; padding-top: 5px; } @media only screen and (max-width: 770px) { .opc #opc-login .description, .opc #opc-login p.required { display: none; } } #opc-payment .note { padding: 10px; } /* -------------------------------------------- * * This section hides everything but the "Checkout Method" step of the checkout process and fades in the content * once the customer progresses to the next step. The purpose of this is to simplify what the customer has to focus on. * It is limited to larger viewports since smaller devices are inherently going to be focused solely on the * "Checkout Method" step. */ .opc.opc-firststep-login .section:not(#opc-login) .step-title, .opc-block-progress-step-login { -webkit-transition: opacity 300ms linear; -webkit-transition-delay: 0; -webkit-transition: opacity 300ms linear 0; transition: opacity 300ms linear 0; } .opc.opc-firststep-login .section#opc-login .step-title .number { -webkit-transition: width 80ms linear; -webkit-transition-delay: 0; -webkit-transition: width 80ms linear 0; transition: width 80ms linear 0; } .opc.opc-firststep-login .section#opc-login .step-title h2 { -webkit-transition: margin-left 80ms linear; -webkit-transition-delay: 0; -webkit-transition: margin-left 80ms linear 0; transition: margin-left 80ms linear 0; } /* When a user progresses from the "Checkout Method" to "Billing Information" for the first time, the */ /* "opc-has-progressed-from-login" class gets added to the body. Also, the .opc element will only have the */ /* "opc-firststep-login" class if the first step of the checkout is the "Checkout Method" (eg, not when logged in) */ body:not(.opc-has-progressed-from-login) .opc.opc-firststep-login .section:not(#opc-login) .step-title, body:not(.opc-has-progressed-from-login) .opc-block-progress-step-login { opacity: 0; } body:not(.opc-has-progressed-from-login) .opc.opc-firststep-login .section#opc-login .step-title .number { width: 0px; overflow: hidden; } body:not(.opc-has-progressed-from-login) .opc.opc-firststep-login .section#opc-login .step-title h2 { margin-left: 0px; } /* -------------------------------------------- * * Shipping and Payment methods */ .sp-methods { margin: 0 0 8px; } .sp-methods dt { margin: 10px 0 5px; } .sp-methods dt:first-child { margin: 0 0 5px; } .sp-methods dd li { margin: 5px 0; } .sp-methods label img { float: left; } .sp-methods label a { margin-top: 6px; float: right; margin-left: 10px; } .sp-methods .price { font-weight: bold; } .sp-methods .form-list { padding-left: 20px; } .sp-methods .form-list li { margin: 0 0 8px; } .sp-methods select.month { width: 120px; margin-right: 10px; } .sp-methods select.year { width: 96px; } .sp-methods input.cvv { width: 4em !important; } .sp-methods #advice-validate-cc-exp-ccsave_expiration { max-width: 130px; } .sp-methods .checkmo-list li { margin: 0 0 5px; content: ''; display: table; clear: both; } .sp-methods .checkmo-list label { width: 165px; padding-right: 15px; text-align: right; float: left; } .sp-methods .checkmo-list address { float: left; } @media only screen and (max-width: 479px) { .sp-methods .checkmo-list { padding-left: 0; } .sp-methods .checkmo-list label { width: 135px; } } .sp-methods .release-amounts { margin: 0.5em 0; } .sp-methods .release-amounts button { float: left; margin: 5px 10px 0 0; } /* One Page Checkout */ .block-progress { border: 0; margin: 0; border-left: 1px solid #CCCCCC; padding-left: 20px; } .block-progress .block-content { font-size: 13px; } .block-progress dt { padding-top: 6px; margin: 0; margin-bottom: 10px; color: #636363; font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 14px; font-weight: bold; font-style: normal; line-height: 1.4; text-rendering: optimizeSpeed; margin-bottom: 6px; text-transform: uppercase; font-weight: normal; color: #A0A0A0; } .block-progress dt.complete { color: #636363; } .block-progress dd { padding-left: 15px; margin-bottom: 10px; font-family: "robotoregular", Verdana, Arial, sans-serif; font-style: italic; } .block-progress dd address { font-style: italic; } .block-progress #payment-progress-opcheckout .subtitle { margin-bottom: 3px; } .block-progress .payment-info dt { padding: 0; margin: 0 0 3px 0; color: #636363; font-family: "robotoregular", Verdana, Arial, sans-serif; text-transform: none; font-style: italic; float: left; clear: both; font-size: 13px; } .block-progress .payment-info dt:after { content: ': '; } .block-progress .payment-info dd { float: left; margin-bottom: 3px; font-size: 13px; } .block-progress .payment-info:after { content: ''; display: table; clear: both; } /* review step */ #checkout-review-table .btn-remove img { display: none; } #checkout-review-table-wrapper { clear: both; } #review-buttons-container { width: 100%; margin-top: 15px; margin-bottom: 15px; } #review-buttons-container .btn-checkout { min-width: 220px; } #review-buttons-container .please-wait { float: left; margin-right: 10px; } #review-buttons-container .f-left { float: right; } @media only screen and (max-width: 599px) { .linearize-table-large.checkout-review-table thead tr:nth-child(1n+2) { display: none; } } @media only screen and (max-width: 479px) { .linearize-table.checkout-review-table thead tr:nth-child(1n+2) { display: none; } } /* show/hide "change" link for progress step depend on complete status * should be placed in .css file */ .opc-block-progress dt.complete a, .opc-block-progress dt.complete .separator { display: inline; } .opc-block-progress dt a, .opc-block-progress dt .separator { display: none; } /* On small screens, the progress review content will be moved to the review step via JS. Styled via this CSS: */ #checkout-step-review .opc-block-progress { border-left: none; padding-left: 0; } #checkout-step-review .opc-block-progress .block-title { display: none; } #checkout-step-review .opc-block-progress .block-content { display: block !important; padding: 0; } #checkout-step-review .opc-block-progress .block-content > dl > div { float: left; width: 50%; } @media only screen and (max-width: 479px) { #checkout-step-review .opc-block-progress .block-content > dl > div { float: none; width: auto; } } #checkout-step-review .opc-block-progress .block-content .changelink { display: none; } @media only screen and (max-width: 479px) { #checkout-review-table thead > tr > th { display: none; } #checkout-review-table thead > tr > th:first-child { display: block; } #checkout-review-table thead > tr > th:first-child { display: block; } } #checkout-step-review .centinel > p { margin-bottom: 10px; } #checkout-step-review .centinel iframe { width: 100%; min-height: 400px; } /* Gift options */ .gift-messages-form .item { content: ''; display: table; clear: both; margin-top: 30px; } .gift-messages-form .item h5 { font-weight: bold; } .gift-messages-form .item .product-img-box { width: auto; float: left; padding-right: 15px; } .gift-messages-form .item .details { float: left; } .gift-message-form .inner-box > div { content: ''; display: table; clear: both; width: 100%; margin-top: 15px; display: block; } .gift-message-form .inner-box > div.extra-options-container p { margin-bottom: 15px; } .gift-message-form .gift-wrapping-form label { margin-right: 10px; } .gift-message-form .gift-wrapping-form img { float: left; } .gift-message-form .gift-wrapping-form .gift-wrapping-design { height: 75px; } .gift-message-form .gift-wrapping-form .gift-wrapping-design:after { content: ''; display: table; clear: both; } .gift-message-form .gift-wrapping-form .gift-wrapping-design .image-box { margin-right: 5px; } .gift-message-form .gift-item { padding-bottom: 10px; margin-bottom: 10px; border-bottom: solid 1px #ECECEC; } .gift-message-form .gift-item:after { content: ''; display: table; clear: both; } .gift-message-form .gift-item .product-img-box { width: 200px; } .gift-message-form .gift-item .product-img-box .product-image { width: 75px; margin-left: auto; margin-right: auto; } .gift-message-form .gift-item .product-img-box .product-name { display: block; } .gift-message-form .gift-item .fieldset { margin-left: 200px; } @media only screen and (max-width: 770px) { .gift-message-form .giftmessage-area { max-width: 100%; } .gift-message-form .gift-item .product-img-box { width: 100%; float: none; } .gift-message-form .gift-item .fieldset { margin-left: 0px; } .gift-message-form .gift-item .fieldset textarea { width: 100%; } } #opc-address-form-billing .control label { background: url("https://www.tudecora.com/skin/frontend/onestic/tudecora/images/checkbox_small.png") no-repeat scroll 0px 0px transparent !important; padding: 0 0 0 30px !important; cursor: pointer; } #opc-address-form-billing .control input { position: absolute; opacity: 0; top: auto !important; } #opc-address-form-billing .control .checkbox:checked + label { background: url("https://www.tudecora.com/skin/frontend/onestic/tudecora/images/checkbox-active_small.png") no-repeat scroll 0px 0px transparent !important; cursor: pointer; } /* ============================================ * * Checkout - Success * ============================================ */ .checkout-onepage-success .col-main { padding: 0; text-align: center; } .checkout-onepage-success .buttons-set { margin: 10px 0; text-align: center; } .checkout-onepage-success .buttons-set button { float: none; } /* ============================================ * * Configurable Swatches * ============================================ */ /* Clears */ .clearfix:after, .configurable-swatch-list:after, .product-view .product-options .swatch-attr:after { content: ''; display: table; clear: both; } /* General Swatch Styling */ .swatch-link, .swatch-label { display: block; border-radius: 3px; font-size: 14px; text-align: center; color: #636363; text-decoration: none; -webkit-box-sizing: content-box; box-sizing: content-box; } .swatch-link { border: 1px solid #CCCCCC; margin: 0 0 3px; } .swatch-link img { border-radius: 2px; } .swatch-link:hover { cursor: pointer; text-decoration: none; } .swatch-link .x { display: none; text-indent: -999em; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: url(https://www.tudecora.com/skin/frontend/onestic/tudecora/images/bg_x.png) center no-repeat transparent; z-index: 10; } .swatch-link.has-image .swatch-label { position: relative; } .swatch-link.has-image img { position: absolute; top: 0; left: 0; } .swatch-label { border: 1px solid #fff; margin: 0; white-space: nowrap; background: #F4F4F4; } .configurable-swatch-list { margin-left: -3px; zoom: 1; clear: both; -webkit-transform: translateZ(0px); } .configurable-swatch-list li { float: left; zoom: 1; margin: 0 0 0 3px; } .products-grid .configurable-swatch-list li { display: inline-block; float: none; margin: 0; vertical-align: top; } .configurable-swatch-list .not-available .x { display: block; } .configurable-swatch-list .not-available .swatch-link { border-color: #EDEDED; position: relative; } .configurable-swatch-list .not-available .swatch-link.has-image img { opacity: 0.4; filter: alpha(opacity=40); } .configurable-swatch-list .not-available .swatch-label { color: #aaa; background: #fff; } .configurable-swatch-list .wide-swatch .swatch-label { padding: 0 6px; } .configurable-swatch-list .not-available a:focus { outline: 0; } #narrow-by-list dd .configurable-swatch-list li { margin: 0 0 0 3px; width: 47%; } #narrow-by-list dd .swatch-link { border: none; line-height: 25px; margin-right: 2px; text-align: left; } #narrow-by-list dd .swatch-link.has-image { line-height: inherit; } #narrow-by-list dd .swatch-link:hover .swatch-label { border-color: #159939; } #narrow-by-list dd .swatch-label { background: #F4F4F4; border: 1px solid #CCCCCC; border-radius: 3px; display: block; float: left; line-height: 1.5em; margin: 0 5px 0 0; padding: 1px 5px; white-space: nowrap; } #narrow-by-list dd .swatch-label img { border: 1px solid #fff; border-radius: 3px; -webkit-box-sizing: content-box; box-sizing: content-box; } #narrow-by-list dd .has-image .swatch-label { padding: 0; } @media only screen and (max-width: 770px) { #narrow-by-list dd .configurable-swatch-list li:nth-child(odd) { clear: left; } } .currently .swatch-current { position: relative; } .currently .swatch-current .btn-remove { margin-top: -10px; position: absolute; right: 0; top: 50%; } .currently .swatch-current span { display: block; float: left; } .currently .swatch-link { display: inline-block; margin: 0 0 0 3px; } .currently .swatch-link:hover { border-color: #CCCCCC; cursor: default; } /* Other Swatch States */ .configurable-swatch-list .hover .swatch-link, .configurable-swatch-list .selected .swatch-link, .swatch-link:hover { border-color: #159939; } .configurable-swatch-box { background: none !important; } .configurable-swatch-box select.swatch-select { display: none; } .configurable-swatch-box .validation-advice { margin: 0 0 5px; background: #DF280A; padding: 2px 5px !important; font-weight: bold; color: #fff !important; float: left; display: block; border-radius: 3px; } /* CUSTOM */ .availability.out-of-stock span { color: #A0A0A0; } .product-view .product-options .swatch-attr { float: none; display: block; clear: both; border: 0; } .product-view .product-options .swatch-attr label, .product-view .product-options .swatch-attr .select-label { font-size: 12px; } .product-view .product-options .swatch-attr label { display: block; line-height: 1.3; } .product-view .product-options .swatch-attr .select-label { display: inline; font-weight: normal; color: #636363; padding-left: 5px; } .product-view .product-options dd .input-box { width: auto; height: auto; } .product-view .product-options .select-label { display: none; } .product-view .add-to-cart button.out-of-stock { background-position: -80px -362px; cursor: default; } /* ============================================ * * Customer * ============================================ */ .customer-account-login .scaffold-form label:first-child { width: 115px; } .customer-account-login .buttons-set { text-align: left; border-top: 0; } .customer-account-login .new-users { width: 44%; margin-right: 5%; } .customer-account-login .registered-users { margin-right: 5%; width: 45%; } .customer-account-create .scaffold-form label:first-child { width: 140px; } .customer-account-resetpassword .forgotpassword .customer-info .box-head { margin-top: 40px; } .customer-account-resetpassword p.required { margin-bottom: 0 !important; } .customer-account-resetpassword .box-account { width: initial; } .opc #opc-login p:not(.required) { font-style: italic; font-family: "robotoregular", Verdana, Arial, sans-serif; font-size: 13px; color: #A0A0A0; } .remember-me-box a.hide { display: none; } .remember-me-box .link-tip { font-size: 13px; padding-left: 10px; } .remember-me-popup { display: none; border: 1px solid #CCCCCC; padding: 10px; position: relative; } .remember-me-popup.show { display: block; } .remember-me-popup p { font-family: "robotoregular", Verdana, Arial, sans-serif; } .remember-me-popup .remember-me-popup-close { position: absolute; top: 0; right: 0; padding: 10px; font-size: 12px; } .remember-me-popup .remember-me-popup-close-button { display: none; } .customer-account-create .fieldset, .customer-account-create .buttons-set { margin-top: 30px; } @media only screen and (max-width: 479px) { .customer-account-create .fieldset, .customer-account-create .buttons-set { margin-left: 0; } } .customer-account-create .fieldset .hidden { display: none; } .customer-account-create #remember-me-popup { max-width: 500px; } .customer-account-create .fieldset { float: left; width: 45%; margin-bottom: 20px; } .customer-account-create .fieldset.right { float: right; } .customer-account-create .required { float: right; width: 100%; } .customer-account-create .buttons-set a:not(.button) { padding: 0; } .customer-account-create .checkPolitica { clear: both; } .customer-account-create .checkPolitica a { text-decoration: underline; color: #636363; font-style: italic; } .customer-account-create .checkPolitica a:hover { color: #636363; } /* ============================================ * * Account * ============================================ */ .my-account .messages, .forgotpassword .messages, .inicio-sesion .messages { margin-bottom: 10px; float: left; width: 100%; } .my-account h4, .forgotpassword h4, .inicio-sesion h4 { font-family: "robotoregular", Verdana, Arial, sans-serif; font-size: 20px; color: #636363; } .my-account h3, .forgotpassword h3, .inicio-sesion h3 { float: left; width: 100%; font-family: "robotomedium", Verdana, Arial, sans-serif; font-size: 18px; } .my-account .customer-info th, .forgotpassword .customer-info th, .inicio-sesion .customer-info th { font-family: "robotoregular", Verdana, Arial, sans-serif; font-size: 14px; } .my-account .customer-info th.sku, .forgotpassword .customer-info th.sku, .inicio-sesion .customer-info th.sku { width: 250px; } .my-account .customer-info td.total, .my-account .customer-info td.status, .my-account .customer-info .a-center, .forgotpassword .customer-info td.total, .forgotpassword .customer-info td.status, .forgotpassword .customer-info .a-center, .inicio-sesion .customer-info td.total, .inicio-sesion .customer-info td.status, .inicio-sesion .customer-info .a-center { width: 150px; } .my-account .customer-info .box-content, .forgotpassword .customer-info .box-content, .inicio-sesion .customer-info .box-content { float: left; width: 100%; min-height: 90px; } .my-account .customer-info .box-white, .forgotpassword .customer-info .box-white, .inicio-sesion .customer-info .box-white { float: left; width: 450px; } .my-account .customer-info .box-head a, .forgotpassword .customer-info .box-head a, .inicio-sesion .customer-info .box-head a { padding: 10px; } .my-account .customer-info address, .forgotpassword .customer-info address, .inicio-sesion .customer-info address { color: #636363; } .my-account .customer-info .change, .forgotpassword .customer-info .change, .inicio-sesion .customer-info .change { margin: 5px 0 10px 37px; float: left; } .my-account .customer-info .checkPolitica label, .forgotpassword .customer-info .checkPolitica label, .inicio-sesion .customer-info .checkPolitica label { font-family: "robotoregular", Verdana, Arial, sans-serif; } .my-account .customer-info .checkPolitica a, .forgotpassword .customer-info .checkPolitica a, .inicio-sesion .customer-info .checkPolitica a { text-decoration: underline; color: #636363; font-style: italic; } .my-account .customer-info .checkPolitica a:hover, .forgotpassword .customer-info .checkPolitica a:hover, .inicio-sesion .customer-info .checkPolitica a:hover { color: #636363; } .my-account .customer-info .customer-logout-box, .forgotpassword .customer-info .customer-logout-box, .inicio-sesion .customer-info .customer-logout-box { min-height: 300px; border: none; margin: 30px auto; width: 500px; margin-bottom: 10%; } .my-account .customer-info .customer-logout-box p, .forgotpassword .customer-info .customer-logout-box p, .inicio-sesion .customer-info .customer-logout-box p { float: left; width: 100%; } .my-account .customer-info .new-address, .forgotpassword .customer-info .new-address, .inicio-sesion .customer-info .new-address { width: 300px; margin: -10px 0px 0 0; } .my-account .hello, .forgotpassword .hello, .inicio-sesion .hello, .forgotpassword .hello, .inicio-sesion .hello { float: left; color: #636363; } .my-account .hello-text { clear: both; } .my-account .navigation { overflow: hidden; } .my-account .welcome-msg, .forgotpassword .welcome-msg, .inicio-sesion .welcome-msg { margin-top: 1%; } .my-account #hello-logout, .forgotpassword #hello-logout, .inicio-sesion #hello-logout { float: right; text-decoration: underline; } .my-account #hello-logout span, .forgotpassword #hello-logout span, .inicio-sesion #hello-logout span { font-size: 20px; float: right; margin-left: 5px; } .my-account .account-menu { margin-top: 20px; text-align: center; border-top: 1px solid #eee; border-bottom: 1px solid #eee; } .my-account .account-menu .item, .forgotpassword .account-menu .item, .inicio-sesion .account-menu .item { display: inline-block; margin: 15px; text-transform: uppercase; } .my-account .account-menu .item a, .forgotpassword .account-menu .item a, .inicio-sesion .account-menu .item a { font: 15px "robotomedium", Verdana, Arial, sans-serif; color: #636363; } .my-account .account-menu .item a:hover, .forgotpassword .account-menu .item a:hover, .inicio-sesion .account-menu .item a:hover { text-decoration: underline; } .my-account .form-list .control, .forgotpassword .form-list .control, .inicio-sesion .form-list .control { margin: 0; float: left; width: 100%; } .my-account p.required { margin-bottom: 35px; position: absolute; } .my-account .customer-info p.required { bottom: 60px; left: 31px; } .my-account .customer-info .account-create p.required { bottom: 80px; left: 31px; } .forgotpassword .customer-info p.required { right: 31px; } .inicio-sesion .customer-info p.required { bottom: 80px; } .customer-account-forgotpassword .fieldset, .customer-account-forgotpassword .buttons-set { max-width: 500px; } @media only screen and (max-width: 479px) { .customer-account-forgotpassword .fieldset, .customer-account-forgotpassword .buttons-set { margin-left: 0; } } .customer-account-forgotpassword .box-account { width: initial; } .customer-account-forgotpassword .fieldset .input-box input.input-text { width: 100%; } .customer-account-forgotpassword p.required { margin-bottom: 0 !important; } .wishlist-index-index button { width: auto !important; margin: 4px 0px 5px 5px !important; } .wishlist-index-index #wishlist-table.clean-table { font-size: 14px; font-family: "robotoregular", Verdana, Arial, sans-serif; } .sales-order-history .customer-box { float: left; } .sales-order-history .customer-box .custom-select-container select { width: 200px; } .sales-order-history .customer-box ol a span { background: none !important; margin-top: 2px !important; } .sales-order-history .limiter label { font-family: "robotoregular", Verdana, Arial, sans-serif; font-size: 14px; float: left; margin: 8px 8px 0 0px; } .sales-order-history .pager-no-toolbar { margin: 10px 0; } .sales-order-history .back-link { display: none; } .sales-order-history .buttons-set { float: left; width: 100%; } .sales-order-history .buttons-set .back-link-order { float: left; } .sales-order-history .pages .next-arrow.next, .sales-order-history .pages .next-arrow, .sales-order-history .pages .previous-arrow.prev { float: left; width: 100px; } .sales-order-history .pages .next-arrow.next a i.icon-arrow-forward, .sales-order-history .pages .next-arrow a i.icon-arrow-forward, .sales-order-history .pages .previous-arrow.prev a i.icon-arrow-forward { margin-top: 5px; float: right; } .sales-order-history .pages .next-arrow.next a i.icon-arrow, .sales-order-history .pages .next-arrow a i.icon-arrow, .sales-order-history .pages .previous-arrow.prev a i.icon-arrow { margin-top: 5px; float: left; } .sales-order-history .pages .previous-arrow.prev { float: left; width: 100px; } .sales-order-history .pages .previous-arrow.prev a i { margin-top: 5px; float: left; } .sales-order-history .pages .current { margin: 2px 0 0 0; } .sales-order-history .count-container { float: left; width: 30%; margin-bottom: 16px; } .sales-order-history .count-container .custom-select-container select, .sales-order-history .count-container .custom-select-container span { width: 74px; height: 38px; } .sales-order-history .count-container .custom-select-container span { -webkit-box-shadow: 0px 0px 22px -9px #c7c7c7; box-shadow: 0px 0px 22px -9px #c7c7c7; border: 1px solid #dddddd; background: url("https://www.tudecora.com/skin/frontend/onestic/tudecora/images/select-arrow.png") no-repeat scroll 89% 10px #ffffff; padding: 9px 20px 0 9px; border-radius: 3px; } .sales-order-history .pager { float: right; width: 30%; } .sales-order-history .buttons-set { border: 0; } .sales-order-history .customer-info .buttons-set { border-top: 1px solid #EDEDED; } /* ============================================ * * My Account Global Styles * ============================================ */ body.customer-account .my-account .title-buttons { position: relative; text-align: right; } body.customer-account .my-account .title-buttons h1 { text-align: left; } body.customer-account .my-account .title-buttons .button { position: absolute; right: 0; top: 0; } body.customer-account .my-account .title-buttons a, body.customer-account .my-account .title-buttons span.separator { position: relative; top: -42px; } body.customer-account .my-account .edit-right { margin-top: 30px; float: left; color: #159939; } body.customer-account .my-account .edit-right span { margin: 0px 3px; font-size: 22px; float: right; } body.customer-account .my-account .edit-right:hover { color: #636363; } body.customer-account .my-account .edit-right.margin { margin: 0; } body.customer-account .my-account .fieldset h2, body.customer-account .my-account .addresses-list h2, body.customer-account .my-account .order-details h2 { width: 100%; display: inline-block; } body.customer-account .my-account .fieldset { margin-top: 30px; margin-bottom: 30px; width: 45%; margin-right: 5%; float: left; } body.customer-account .data-table { margin-top: 5px; } body.customer-account .data-table td a { font-family: "robotobold", Verdana, Arial, sans-serif; text-transform: uppercase; font-style: normal; font-size: 13px; } body.customer-account .data-table span.nobr { white-space: normal; } body.customer-account .data-table span.nobr a { white-space: nowrap; } body.customer-account .data-table td.view a { display: block; } body.customer-account .data-table .separator { display: none; } body.customer-account .sidebar .block ol#compare-items li { margin: 10px 0; } body.customer-account .sidebar .block .block-content p.block-subtitle { margin-bottom: 15px; } body.customer-account .sidebar .block .block-content .actions { margin-top: 30px; } body.customer-account .sidebar ol#cart-sidebar-reorder li { margin-top: 10px; margin-bottom: 0; } body.customer-account .sidebar ol#cart-sidebar-reorder p.product-name { display: inline-block; margin-bottom: 0; } body.customer-account .sidebar .block-cart .summary { margin-bottom: 15px; } body.customer-account .sidebar .block-reorder ol#cart-sidebar-reorder li { margin-top: 10px; margin-bottom: 0; } body.customer-account .sidebar .block-reorder ol#cart-sidebar-reorder li input { margin-right: 10px; } body.customer-account .sidebar .block-reorder ol#cart-sidebar-reorder p.product-name { display: inline; margin-bottom: 0; } .form-list .customer-dob .dob-month, .form-list .customer-dob .dob-day { width: 40px; float: left; margin-right: 10px; } .form-list .customer-dob .dob-year { width: 80px; float: left; } /* ============================================ * * Dashboard * ============================================ */ .dashboard .box-title a, .dashboard .box-head a { font-size: 14px; } .dashboard .box-title .right, .dashboard .box-head .right { float: right; margin-top: -50px; } .dashboard .col1-set .col-1 .box-title, .dashboard .col1-set .col-2 .box-title, .dashboard .col2-set .col-1 .box-title, .dashboard .col2-set .col-2 .box-title { position: relative; padding-bottom: 10px; } .dashboard .col1-set .col-1 .box-title h2, .dashboard .col1-set .col-2 .box-title h2, .dashboard .col2-set .col-1 .box-title h2, .dashboard .col2-set .col-2 .box-title h2 { font-weight: 600; font-size: 14px; margin-bottom: 0; } .dashboard .col1-set .col-1 .box-title h3, .dashboard .col1-set .col-2 .box-title h3, .dashboard .col2-set .col-1 .box-title h3, .dashboard .col2-set .col-2 .box-title h3 { font-family: "robotomedium", Verdana, Arial, sans-serif; font-size: 18px; } .dashboard .col1-set .col-1 .box-title h4, .dashboard .col1-set .col-2 .box-title h4, .dashboard .col2-set .col-1 .box-title h4, .dashboard .col2-set .col-2 .box-title h4 { font-family: "robotomedium", Verdana, Arial, sans-serif; font-size: 14px; color: #cccccc; } .dashboard .col1-set .col-1 .box-title a, .dashboard .col1-set .col-2 .box-title a, .dashboard .col2-set .col-1 .box-title a, .dashboard .col2-set .col-2 .box-title a { line-height: 19.6px; } .dashboard .box-reviews li { padding: 10px 0; border-top: 1px solid #EDEDED; } .dashboard .box-reviews li:first-child { border-top: 0; } .dashboard .box-reviews li .number { margin-right: -20px; float: left; line-height: 1.4; font-size: 13px; } .dashboard .box-reviews li .details { margin-left: 20px; } .dashboard .box-reviews li .details .ratings { content: ''; display: table; clear: both; margin-bottom: 0; } .dashboard .box-reviews li .details .ratings strong { float: left; font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 13px; margin-right: 5px; } .dashboard .box-reviews li .details .ratings .rating-box { float: left; margin: 3px 0 0 0; } .box-account { float: left; width: 100%; padding: 30px; position: relative; margin-bottom: 10%; border: 1px solid #eee; } .dashboard .col2-set .col-1 .box-account, .dashboard .col2-set .col-2 .box-account { width: 320px; min-height: 210px; } .dashboard .col1-set .box-account { min-height: 252px; } /* ============================================ * * Address Book * ============================================ */ .my-account .addresses-list { font-family: "robotoregular", Verdana, Arial, sans-serif; } .my-account .addresses-list .col-1, .my-account .addresses-list .col-2 { padding-bottom: 0; } .my-account .addresses-list .item { margin: 0 0 30px 0; } .my-account .addresses-list .item p { margin-top: 10px; } /* ============================================ * * Order View * ============================================ */ .order-info { padding-bottom: 10px; border-bottom: 1px solid #EDEDED; width: 100%; margin-bottom: 30px; } .order-info dt, .order-info dd, .order-info ul, .order-info li { display: inline; } .order-info dt { margin-right: 20px; } .order-info li { margin: 0 0 0 20px; } .order-info li.current { font-weight: 600; } .order-info li:first-child { margin-left: 0; } .order-date { font-family: "robotobold", Verdana, Arial, sans-serif; text-transform: uppercase; } .order-info-box { margin-bottom: 40px; margin-top: 20px; } .order-info-box + .order-info-box { padding-bottom: 40px; border-bottom: 1px solid #EDEDED; } .order-info-box .col-1 { padding-right: 0; width: 48%; } .order-info-box .col-2 { width: 52%; } .order-info-box .col-1, .order-info-box .col-2 { overflow: hidden; padding-top: 0; padding-bottom: 0; } .order-info-box .box-title { width: 150px; padding-right: 10px; float: left; } .order-info-box .box-title h2 { font-size: 14px; font-family: "robotobold", Verdana, Arial, sans-serif; font-weight: bold; line-height: 1.5; } .order-info-box .box-title h2:after { content: ':'; } .order-info-box .box-content { float: left; font-family: "robotoregular", Verdana, Arial, sans-serif; } .order-info-box .box-content td, .order-info-box .box-content th { font-family: "robotoregular", Verdana, Arial, sans-serif; line-height: 1.3; } .order-info-box .box-content th { padding-top: 10px; } .order-info-box .box-content td { padding-left: 15px; } .order-info-box .box-content strong { font-family: "robotobold", Verdana, Arial, sans-serif; font-weight: normal; text-transform: uppercase; } #my-orders-table .option-label { margin-left: 10px; font-weight: 600; font-style: italic; } #my-orders-table .option-value { margin-left: 20px; } #my-orders-table tr.bundle:not(:last-child) td { border-bottom: none; border-top: none; } ol#cart-sidebar-reorder li { margin-top: 10px; margin-bottom: 0; } ol#cart-sidebar-reorder li input { margin-right: 10px; } ol#cart-sidebar-reorder p.product-name { display: inline; } .order-additional { margin: 40px 0; } .order-gift-message dd { margin-top: 10px; } /* ============================================ * * Newsletter Subscriptions * ============================================ */ body.newsletter-manage-index .my-account .fieldset { margin-bottom: 20px; } body.newsletter-manage-index .my-account .fieldset h2 { display: none; } body.newsletter-manage-index .my-account .form-list { padding-top: 10px; } body.newsletter-manage-index .my-account .box-account { width: 50%; } /* ============================================ * * address * ============================================ */ .customer-address-index .addresses-primary { width: 45%; margin-right: 5%; } .customer-address-index .addresses-additional { width: 45%; margin-left: 5%; } .customer-address-index .box-white { float: left; width: 100%; margin-top: 40px; } /* ============================================ * * view order * ============================================ */ .sales-order-view .title-buttons { float: left; width: 100%; } .sales-order-view .title-buttons h1 { margin: 0; } .sales-order-view .title-buttons a, .sales-order-view .title-buttons span.separator { top: -27px !important; } .sales-order-view .order-info-box .box-title { width: 100%; } .sales-order-view .order-info { border: 0; } .customer-account-index .box-recent { float: left; width: 100%; } .customer-account-index .box-recent .box-head .edit-right { position: absolute; top: 32px; right: 30px; } /*active hover menu*/ .customer-account-index .a1 a, .customer-account-edit .a2 a, .customer-address-index .a3 a, .sales-order-history .a4 a, .newsletter-manage-index .a5 a { color: #159939 !important; } /* ============================================ * * Contacts * ============================================ */ .contacts-index-index .buttons-set, .contacts-contacts-index .buttons-set { margin-left: 30px; max-width: 435px; } .contacts-index-index .buttons-set p.required, .contacts-contacts-index .buttons-set p.required { float: left; } @media only screen and (max-width: 599px) { .contacts-index-index .buttons-set, .contacts-contacts-index .buttons-set { max-width: 330px; margin-left: 0; } .contacts-index-index .buttons-set button, .contacts-contacts-index .buttons-set button { float: left; margin-left: 0px; } .contacts-index-index .buttons-set p.required, .contacts-contacts-index .buttons-set p.required { float: right; } } /* ============================================ * * PayPal * ============================================ */ @media only screen and (max-width: 870px) and (min-width: 771px) { .paypal-review-order .col2-set .col-1, .paypal-review-order .col2-set .col-2 { padding: 0px; } } .paypal-review-order .info-set { margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #EDEDED; } .paypal-review-order .buttons-set { margin-top: 0px; padding-top: 0px; border: 0; } .paypal-review-order .buttons-set button { margin-bottom: 10px; } @media only screen and (max-width: 770px) { .paypal-review-order .col-1 { padding-bottom: 0; } .paypal-review-order .field.inactive { display: none; } } .top-container .bml-ad { margin-top: 7px; margin-bottom: 7px; text-align: center; } .top-container .bml-ad span { display: inline-block; } .top-container .bml-ad span a { display: block; } .bml-ad { display: none; text-align: center; margin-bottom: 5px; } .bml-ad span { display: block; line-height: 0; } .bml-ad a { display: inline-block; max-width: 100%; } .bml-ad a:hover { opacity: 0.7; } .bml-ad img { height: auto !important; max-width: 100%; } .cart-totals-wrapper .bml-ad.large img { display: block; margin: 0; } @media only screen and (max-width: 770px) { .bml-ad.small { display: block; } } @media only screen and (min-width: 771px) { .bml-ad.large { display: block; } } div.paypal-logo { text-align: center; margin: 15px 0; max-width: 100%; } div.paypal-logo span { display: block; width: 100%; } div.paypal-logo span a { display: inline-block; max-width: 100%; } div.paypal-logo span a img { max-width: 100%; } div.paypal-logo span > img { display: none; } .checkout-types div.paypal-logo { text-align: right; } .bml-checkout-type { list-style-type: none; } .sidebar .paypal-logo { text-align: center; line-height: 0; } .sidebar .paypal-logo > a { display: inline-block; max-width: 100%; } .sidebar .paypal-logo > a:hover { opacity: 0.8; } .sidebar .paypal-logo > a img { display: block; } .sidebar .paypal-logo .label { margin-top: 4px; } .sidebar .paypal-logo .label a { font-size: 12px; line-height: 1.5; } /* ============================================ * * Review - Customer * ============================================ */ #customer-reviews { width: auto; float: none; } #customer-reviews .review-heading { border-top: 1px solid #CCCCCC; border-bottom: 1px solid #CCCCCC; padding: 10px 0 5px; } #customer-reviews .review-heading:after { content: ''; display: table; clear: both; } #customer-reviews .review-heading h2 { float: left; display: block; } #customer-reviews .review-heading .pager { clear: none; float: right; width: auto; } #customer-reviews .review-heading .pager .count-container .limiter { margin-bottom: 0; } #customer-reviews .review-heading .pager .count-container .limiter label { font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 10px; text-transform: uppercase; } #customer-reviews .review-heading .pager .amount { display: none; } #customer-reviews h2 { color: #3399CC; font-size: 12px; text-transform: uppercase; } #customer-reviews h2 span { color: #636363; } #customer-reviews h3 { font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 12px; font-weight: normal; text-transform: uppercase; } #customer-reviews h3 span { color: #3399CC; } #customer-reviews .fieldset { padding-top: 25px; width: 470px; } #customer-reviews .fieldset h4 { border-bottom: 1px solid #CCCCCC; font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 12px; font-weight: normal; padding-bottom: 5px; text-transform: uppercase; } #customer-reviews .fieldset h4 em { display: none; } #customer-reviews .fieldset .form-list { font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 12px; font-weight: normal; margin: 10px 0; text-transform: uppercase; width: 470px; } #customer-reviews .fieldset .form-list .inline-label:after { content: ''; display: table; clear: both; } #customer-reviews .fieldset .form-list label { font-size: 12px; font-weight: normal; } #customer-reviews .fieldset .form-list textarea { border: 1px solid #CCCCCC; border-radius: 0; min-width: 100%; -webkit-appearance: none; } #customer-reviews .fieldset .form-list input { border: 1px solid #CCCCCC; border-radius: 0; } #customer-reviews .fieldset .form-list input[type="text"] { width: 100%; } #customer-reviews .buttons-set { border: none; margin: 0; width: 470px; } #customer-reviews dl { font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 12px; font-weight: normal; margin-bottom: 10px; } #customer-reviews dl dt { margin: 10px 0; text-transform: uppercase; } #customer-reviews dl dd { font-family: "robotoregular", Verdana, Arial, sans-serif; font-size: 14px; margin: 10px 0; } #customer-reviews dl dd .ratings-table { font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 12px; width: 100%; } #customer-reviews dl dd .ratings-table tr { margin-right: 15px; } #customer-reviews dl dd .ratings-table .review-label { width: 300px; max-width: 70%; } #customer-reviews dl dd table { margin: 15px 0; } #customer-reviews dl dd .review-meta { color: #3399CC; font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 10px; font-weight: normal; text-transform: uppercase; } .review-summary-table { border-bottom: 1px solid #CCCCCC; margin: 0 0 10px; } .review-summary-table thead { background: transparent; } .review-summary-table thead th { background: transparent; border: none; padding: 15px 7px 10px 8px; } .review-summary-table tbody th { background: #FFFFFF; font-size: 12px; } .review-summary-table tbody td { border: none; text-align: center; padding: 0; } .review-summary-table tbody td label { width: 100%; display: block; padding: 11px 0; } .review-summary-table .rating-box .rating-number { display: none; } .review-summary-table .rating-box .rating-number:after { content: ""; display: inline-block; background-position: 0px -599px; width: 13px; height: 14px; margin-left: 5px; position: relative; top: 2px; } /* ============================================ * * Ratings - Global * ============================================ */ .ratings-table { font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 12px; text-transform: uppercase; } .ratings-table th { padding-right: 10px; } .ratings-table .rating-box { background-position: 0 -615px; background-repeat: repeat-x; height: 13px; overflow: hidden; text-indent: -9999px; width: 65px; } .ratings-table .rating-box .rating { background-position: 0 -600px; background-repeat: repeat-x; float: left; height: 13px; text-indent: -9999px; } @media only screen and (max-width: 770px) { body.review-product-list .product-view .product-shop .price-info { padding-left: 0; } body.review-product-list .product-view .product-shop .extra-info { padding: 0; min-width: 84%; } body.review-product-list .product-view .product-shop .extra-info .ratings-table { margin: 10px 0; width: 100%; } body.review-product-list .product-view .product-shop .extra-info .ratings-table tr { margin-right: 15px; } } @media only screen and (max-width: 535px) { body.review-product-list .product-view .product-shop .extra-info { min-width: 0; } body.review-product-list .product-view .product-shop .extra-info .ratings-table tr { float: none; margin-right: 0; } } @media only screen and (max-width: 520px) { #customer-reviews .fieldset { width: 100%; } #customer-reviews .fieldset .form-list { width: 100%; } #customer-reviews .fieldset .form-list .inline-label label, #customer-reviews .fieldset .form-list .inline-label .input-box { float: none; } #customer-reviews .buttons-set { width: 100%; } #customer-reviews .review-summary-table thead th { padding-left: 0px; padding-right: 0px; } #customer-reviews .review-summary-table tbody th { padding-left: 0px; padding-right: 0px; } #customer-reviews .review-summary-table tbody td { width: 20%; padding: 0px; } #customer-reviews .review-summary-table .rating-box { text-indent: 0px; text-align: center; background: none; height: 19.6px; width: 100%; } #customer-reviews .review-summary-table .rating-box .rating { display: none; } #customer-reviews .review-summary-table .rating-box .rating-number { display: inline-block; } } @media only screen and (max-width: 450px) { #customer-reviews dl dd .ratings-table tr { float: none; } } /* ============================================ * * Review View Page * ============================================ */ .review-product-view .product-review .product-details h2 { border-bottom: none; } .review-product-view .product-review .product-img-box { width: auto; max-width: 50%; } .review-product-view .product-review .product-img-box > a { width: 100%; } .review-product-view .product-review .product-img-box .product-image { width: 100%; } @media only screen and (max-width: 770px) { .review-product-view .product-review .product-img-box { max-width: 100%; } } /* ============================================ * * Slideshow * ============================================ */ .slideshow-container { position: relative; display: block; width: 100%; margin: 10px 0; border: 1px solid #EDEDED; } .slideshow-container .slideshow { width: 100%; padding: 0; position: relative; margin: 0; border: 10px solid #FFFFFF; } .slideshow-container .slideshow > li { position: absolute; top: 0; left: 0; width: 100%; padding: 0; display: block; margin: 0; } .slideshow-container .slideshow > li:first-child { position: static; z-index: 100; } .slideshow-container .slideshow > li img { max-width: 100%; width: 100%; } .slideshow-pager { text-align: center; width: 100%; z-index: 115; position: absolute; bottom: 0px; top: auto; overflow: hidden; -moz-user-select: none; -ms-user-select: none; -webkit-user-select: none; -o-user-select: none; user-select: none; } .slideshow-pager span { font-family: arial; width: 44px; height: 44px; display: inline-block; color: #DDDDDD; cursor: pointer; } .slideshow-pager span:before { content: ''; display: block; width: 16px; height: 16px; left: 50%; top: 50%; margin-left: -8px; margin-top: -8px; border-radius: 1px; background-color: #FFFFFF; position: relative; } .slideshow-pager span:hover:before { background-color: #3d9854; } .slideshow-pager span.cycle-pager-active:before { background-color: #0f6c28; } .slideshow-pager > * { cursor: pointer; } .slideshow-prev, .slideshow-next { position: absolute; top: 0; width: 15%; max-width: 80px; height: 100%; opacity: 0.6; z-index: 110; cursor: pointer; -moz-user-select: none; -ms-user-select: none; -webkit-user-select: none; -o-user-select: none; user-select: none; } .slideshow-prev:before, .slideshow-next:before { content: ''; width: 0; height: 0; font-size: 0; position: absolute; border-style: solid; display: block; top: 50%; margin-top: -15px; } .slideshow-prev:hover, .slideshow-next:hover { opacity: 1; } .slideshow-prev.disabled, .slideshow-next.disabled { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50); opacity: 0.5; cursor: default; } .slideshow-prev { left: 8px; } .slideshow-prev:before { border-width: 15px 15px 15px 0; border-color: transparent #FFFFFF transparent transparent; top: 50%; left: 10px; } .slideshow-prev:hover:before { border-color: transparent #3d9854 transparent transparent; } .slideshow-next { right: 8px; } .slideshow-next:before { border-width: 15px 0 15px 15px; border-color: transparent transparent transparent #FFFFFF; top: 50%; right: 10px; } .slideshow-next:hover:before { border-color: transparent transparent transparent #3d9854; } .cycle-caption { position: absolute; color: white; bottom: 15px; right: 15px; z-index: 110; } .cycle-overlay { font-family: tahoma, arial; position: absolute; bottom: 0; width: 100%; z-index: 120; background: black; color: white; padding: 15px; opacity: .5; } /* ============================================ * * Wishlist * ============================================ */ #wishlist-table th { text-align: center; } #wishlist-table.clean-table { font-family: "robotoregular", Verdana, Arial, sans-serif; font-size: 14px; text-transform: uppercase; width: 100%; } #wishlist-table.clean-table th { border-bottom: 1px solid #C0C0C0; } #wishlist-table.clean-table td { padding: 15px; vertical-align: top; } #wishlist-table.clean-table thead th { font-family: "robotoregular", Verdana, Arial, sans-serif; font-size: 14px; text-transform: uppercase; } #wishlist-table .wishlist-sku { font-size: 11px; font-family: "robotobold", Verdana, Arial, sans-serif; margin: 5px 0; } #wishlist-table textarea { border: 1px solid #C0C0C0; width: 100%; height: 45px; } #wishlist-table textarea:focus { border: 1px solid #159939; } #wishlist-table .item-manage { text-align: right; max-width: 450px; padding-top: 5px; } #wishlist-table .item-manage .button { font-size: 11px; padding: 3px 5px; } #wishlist-table .cart-cell { text-align: center; } #wishlist-table td.customer-wishlist-item-image { width: 113px; } #wishlist-table td.customer-wishlist-item-quantity { width: 3em; } #wishlist-table td.customer-wishlist-item-price { width: 120px; text-align: center; } #wishlist-table td.customer-wishlist-item-cart { width: 150px; } #wishlist-table td.customer-wishlist-item-cart .button { font-size: 12px; margin-bottom: 10px; padding: 3px 5px; width: 100%; } #wishlist-table td.customer-wishlist-item-cart .btn-cart { height: 50px; } #wishlist-table td.customer-wishlist-item-cart .button-secondary { background: none; } #wishlist-table td.customer-wishlist-item-cart .truncated { margin-bottom: 10px; } #wishlist-table td.customer-wishlist-item-cart > p { margin-bottom: 0; } #wishlist-table td.customer-wishlist-item-cart .remove-whishlist-item { text-align: center; } #wishlist-table td.customer-wishlist-item-cart .btn-remove { vertical-align: top; } #wishlist-table td.customer-wishlist-item-remove { width: 20px; } #wishlist-table td .button, #wishlist-table td button { white-space: normal; } #wishlist-table .price-box { font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 12px; } #wishlist-table .price-box .price { color: #636363; } #wishlist-table .giftregisty-add { margin-top: 5px; } #wishlist-table .giftregisty-add .change { display: none; } #wishlist-table .giftregisty-add li { cursor: pointer; color: #159939; margin-bottom: 3px; } #wishlist-table .truncated .details { background: none; color: #159939; } #wishlist-table td[data-rwd-label]:before { font-weight: 600; } /* ============================================ * * Wishlist Sidebar * ============================================ */ .block-wishlist .mini-products-list > li:not(:last-child) { padding-bottom: 5px; } .block-wishlist .product-details .product-name { padding-top: 0; margin-bottom: 5px; } .block-wishlist .price-box { float: left; margin: 0; } .block-wishlist .price-box, .block-wishlist .price-box .price, .block-wishlist .link-cart { font-size: 12px; } .block-wishlist .link-cart { float: left; text-transform: uppercase; margin-right: 7px; padding-right: 7px; border-right: 1px solid #EDEDED; } /* ============================================ * * Header - Mini cart & Top Search * ============================================ */ .header-minicart, .header-search { position: relative; display: block; width: 5%; float: right; text-align: center; border-right: 1px solid #eee; } .header-minicart .block-cart, .header-search .block-search { display: none; position: absolute; z-index: 200; top: 74px; right: 0; background-color: #ffffff; padding: 15px; -webkit-box-shadow: 3px 2px 10px -3px #c7c7c7; box-shadow: 3px 2px 10px -3px #c7c7c7; } .header-minicart .block-cart { width: 396px; } .header-search .block-search { width: 312px; } .header-minicart .icon-shopping-cart, .header-search .skip-search .icon-search-black { font-size: 25px; line-height: 70px; } .header-minicart.opened .icon-shopping-cart, .header-search.opened .skip-search .icon-search-black { color: #159939; } .header-minicart .cart-quantity { display: block; width: 18px; height: 18px; font-size: 12px; line-height: 18px; color: #fff; background-color: #159939; border-radius: 50%; position: absolute; top: 14px; right: 14px; } .header-minicart .no-count .cart-quantity { display: none; } .header-minicart .minicart-message { display: block; padding: 10px; } .header-minicart .empty { padding: 10px; text-align: center; } .header-minicart .minicart-wrapper { clear: both; position: relative; } .header-minicart .minicart-wrapper:before, .header-minicart .minicart-wrapper:after { content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; display: none; } .header-minicart .minicart-wrapper:before { background-color: white; opacity: 0.8; z-index: 2; } .header-minicart .minicart-wrapper:after { background-image: url("https://www.tudecora.com/skin/frontend/onestic/tudecora/images/opc-ajax-loader.gif"); background-repeat: no-repeat; background-position: center; z-index: 3; } .header-minicart .minicart-wrapper.loading { position: relative; } .header-minicart .minicart-wrapper.loading:before, .header-minicart .minicart-wrapper.loading:after { display: block; } .header-minicart .close { width: 40px; float: right; display: block; text-decoration: none; font-weight: normal; font-size: 27px; position: absolute; top: -8px; right: -3px; } .header-minicart .mini-products-list li { padding: 10px 0; position: relative; border-bottom: 1px solid #eee; min-height: 90px; } .header-minicart .mini-products-list li .product-details { position: relative; padding-right: 2%; } .header-minicart .product-details .product-name { padding-top: 0px; text-transform: uppercase; font-size: 13px; line-height: 1.1; font-family: "robotomedium", Georgia, Times, "Times New Roman", serif; } .header-minicart .product-details .product-name::first-letter { text-transform: uppercase; float: left; } .header-minicart .info-wrapper { width: 100%; font-size: 14px; } .header-minicart .info-wrapper .product-name { float: left; width: 42%; text-align: left; } .header-minicart .info-wrapper .product-name p { display: table-cell; vertical-align: middle; height: 70px; } .header-minicart .info-wrapper .qty-wrapper { line-height: 33px; width: 10%; float: left; margin-top: 18px; } .header-minicart .info-wrapper .price-wrapper { width: 25%; float: left; text-align: right; font-size: 14px; color: #159939; margin-top: 24px; } .header-minicart .info-wrapper .close-item { width: 10%; float: right; margin-top: 25px; color: #bbbbbb; } .header-minicart .info-wrapper .close-item .btn-remove { font-size: 20px; } .header-minicart .info-wrapper .close-item .icon-close-black { color: #bbbbbb; font-size: 20px; } .header-minicart .info-wrapper .quantity-button { opacity: 0; -webkit-transition-property: opacity; transition-property: opacity; -webkit-transition-duration: 100ms; transition-duration: 100ms; } .header-minicart .info-wrapper .quantity-button[disabled] { cursor: default; } .header-minicart .info-wrapper .quantity-button.visible { opacity: 1; } .header-minicart #minicart-error-message { text-align: center; color: red; display: none; } .header-minicart #minicart-success-message { text-align: center; color: green; display: none; } .header-minicart .jcarousel-control-prev, .header-minicart .jcarousel-control-next { display: none; } @media only screen and (min-width: 771px) { .checkout-types.minicart { float: none; text-align: center; } } @media only screen and (max-width: 770px) { .header-minicart .subtotal .label { color: #636363; } .header-minicart .minicart-wrapper:before { background-color: #EDEDED; } .header-minicart .quantity-button { float: none; } .header-minicart .header-minicart .block-cart { padding: 15px; } .header-minicart .header-minicart .block-subtitle { padding-top: 59px; } } @media only screen and (max-width: 740px) { .header-minicart .minicart-actions .cart-link { right: auto; left: 0; text-align: center; width: 100%; } .header-minicart .minicart-actions .checkout-types.minicart li .paypal-logo .paypal-or, .header-minicart .minicart-actions .checkout-types.minicart li .paypal-logo .paypal-button { width: 100%; display: block; margin-left: 0; } .header-minicart .minicart-actions .checkout-types.minicart li .paypal-logo .paypal-or { line-height: 1.6; } } @media only screen and (max-width: 599px) { .header-minicart .minicart-actions .checkout-button { width: 100%; } } /* ============================================ * * Search - Auto Suggest * ============================================ */ .search-autocomplete { left: 0 !important; overflow: visible !important; position: relative !important; top: 13px !important; width: 100% !important; z-index: 9999; } .search-autocomplete ul { border-radius: 2px; left: 0; padding-left: 0; position: absolute; top: 0; width: 100%; -webkit-box-shadow: 3px 2px 10px -3px #c7c7c7; box-shadow: 3px 2px 10px -3px #c7c7c7; background-color: #ffffff; border-top: 3px solid #159939; max-height: 500px; overflow: scroll; } .search-autocomplete ul li { cursor: pointer; font-size: 12px; padding: 4px 6px; text-align: left; } .search-autocomplete ul li:hover { color: #128331; } .search-autocomplete ul li.selected { background-color: #f1f1f1; color: #636363; } .search-autocomplete ul li .amount { float: right; font-weight: bold; margin-right: 10px; } .search-autocomplete ul li:last-child { border-bottom: none; } .search-autocomplete:before { content: ''; position: absolute; width: 0; height: 0; display: block; border-right: 7px solid transparent; border-left: 7px solid transparent; border-bottom: 7px solid #159939; border-top: none; left: 50%; top: -7px; } /* ============================================ * * Search - Advanced * ============================================ */ .advanced-search { background: #F4F4F4; border: 1px solid #EDEDED; padding: 30px; } .advanced-search select.multiselect option { border-bottom: 1px solid #EDEDED; padding: 2px 5px; } @media only screen and (max-width: 479px) { .advanced-search { padding: 15px; } } /* ============================================ * * Account - Reviews * ============================================ */ .product-review .product-img-box p.label { border-bottom: 1px solid #CCCCCC; font-size: 16px; font-family: "robotobold", Verdana, Arial, sans-serif; margin-top: 20px; padding-bottom: 10px; text-transform: uppercase; } .product-review .product-img-box .rating-box { margin: 15px 0; } .product-review .product-details h2 { border-bottom: 1px solid #CCCCCC; color: #3399CC; font-size: 16px; font-weight: 600; font-family: "robotobold", Verdana, Arial, sans-serif; padding-bottom: 10px; } .product-review .ratings-table { font-family: "robotobold", Verdana, Arial, sans-serif; } .product-review .ratings-table th { padding-right: 10px; } .product-review .ratings-table tr { float: left; font-size: 12px; margin-right: 10px; text-transform: uppercase; } .product-review .ratings-description dt { border-bottom: 1px solid #CCCCCC; font-size: 16px; font-weight: 400; font-family: "robotobold", Verdana, Arial, sans-serif; margin-top: 20px; padding: 10px 0; text-transform: uppercase; } .product-review .ratings-description dd { color: #737373; font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 13px; } @media only screen and (min-width: 771px) { .product-review .ratings-table tr { float: none; } } @media only screen and (min-width: 1126px) { .product-review .ratings-table tr { float: left; margin-right: 15px; } } @media only screen and (max-width: 320px) { .product-review .ratings-table tr { float: none; } } /* ============================================ * * CMS Pages * ============================================ */ .cms-page-view .main .std { padding: 15px; } .cms-page-view .page-title h1, .cms-page-view .page-title h3, .cms-page-view .page-head h1, .cms-page-view .page-head h3, .cms-no-route .page-title h1, .cms-no-route .page-title h3, .cms-no-route .page-head h1, .cms-no-route .page-head h3 { border: none; } .cms-page-view .main .page404-content, .cms-no-route .main .page404-content { width: 100%; height: 299px; background: #f1f1f1; padding: 30px; margin-bottom: 130px; } .cms-page-view .main .page404-content .page404-box, .cms-no-route .main .page404-content .page404-box { width: 598px; height: 600px; background: #ffffff; padding: 30px; margin: 0px auto; -webkit-box-shadow: 0px 0px 12px -2px #c7c7c7; box-shadow: 0px 0px 12px -2px #c7c7c7; } .cms-page-view .main .page404-content .page404-box h1, .cms-page-view .main .page404-content .page404-box h2, .cms-no-route .main .page404-content .page404-box h1, .cms-no-route .main .page404-content .page404-box h2 { font: 26px "robotomedium", Verdana, Arial, sans-serif; color: #636363; } .cms-page-view .main .page404-content .page404-box p, .cms-no-route .main .page404-content .page404-box p { font: 15px "robotobold", Georgia, Times, "Times New Roman", serif; color: #636363; } .cms-page-view .main .page404-content span, .cms-no-route .main .page404-content span { color: #159939; } .cms-page-view .main .page404-content span.code, .cms-no-route .main .page404-content span.code { color: #cccccc; font: 26px "robotobold", Verdana, Arial, sans-serif; float: left; width: 100%; margin-bottom: 5%; } .cms-page-view .main .page404-content span.code-title, .cms-no-route .main .page404-content span.code-title { float: left; width: 100%; font: 20px "robotomedium", Verdana, Arial, sans-serif; color: #636363; } .cms-page-view .main .page404-content li, .cms-no-route .main .page404-content li { color: #636363; font-family: "robotoregular", Verdana, Arial, sans-serif; font-size: 15px; } .cms-page-view .main .page404-content a.button-404, .cms-no-route .main .page404-content a.button-404 { font: 18px "robotobold", Georgia, Times, "Times New Roman", serif; color: #159939; } .cms-page-view .main .page404-content a.button-404:hover, .cms-no-route .main .page404-content a.button-404:hover { color: #44AA5E; } .cms-page-view .main .page404-content h3, .cms-no-route .main .page404-content h3 { font: 26px "robotomedium", Verdana, Arial, sans-serif; color: #159939; margin: 8% 0 3% 0; border-top: 3px solid #159939; width: 44px; } .cms-page-view .main .content h1, .cms-no-route .main .content h1 { font: 26px "robotobold", Georgia, Times, "Times New Roman", serif; color: #636363; width: 100%; } .cms-page-view .main .content p, .cms-page-view .main .content li, .cms-no-route .main .content p, .cms-no-route .main .content li { font: 15px "robotolight", Verdana, Arial, sans-serif; color: #636363; float: left; width: 100%; } .cms-page-view .main .content .post-title, .cms-no-route .main .content .post-title { font: 15px "robotoregular", Verdana, Arial, sans-serif; color: #636363; } .cms-page-view .main .content h3, .cms-no-route .main .content h3 { font: 18px "robotomedium", Verdana, Arial, sans-serif; color: #636363; float: left; width: 100%; } .cms-page-view .main .content h2, .cms-no-route .main .content h2 { font: 18px "robotomedium", Verdana, Arial, sans-serif; color: #636363; float: left; width: 100%; } .cms-page-view .main .content .title, .cms-no-route .main .content .title { display: inline-block; padding: 0; font: 18px "robotomedium", Verdana, Arial, sans-serif; color: #636363; } .cms-page-view .main .content a, .cms-no-route .main .content a { font-style: italic; color: #636363; text-decoration: underline; } .cms-page-view .main .content a:hover, .cms-no-route .main .content a:hover { color: #636363; } .cms-page-view .main .content .info, .cms-no-route .main .content .info { background: #f1f1f1; padding: 10px; float: left; width: 100%; } .cms-page-view .main .content .info td, .cms-no-route .main .content .info td { width: 200px; } .cms-page-view .main .content .info .left, .cms-no-route .main .content .info .left { width: 50%; float: left; } .cms-page-view .main .content .info .right, .cms-no-route .main .content .info .right { width: 50%; float: right; } .cms-page-view .main .content .info-third, .cms-no-route .main .content .info-third { width: 30%; } .cms-page-view .main .content .space, .cms-no-route .main .content .space { margin: 15px 0; height: 100%; float: left; width: 100%; } .cms-page-view .main .content .icon, .cms-no-route .main .content .icon { float: left; width: 30%; margin-right: 5%; } .cms-page-view .main .content span.icono, .cms-no-route .main .content span.icono { font-size: 45px; float: left; margin: 0 10px 0 0; } .cms-page-view .main .content .icon.last, .cms-no-route .main .content .icon.last { margin-right: 0; } .cms-page-view .main .content .green, .cms-no-route .main .content .green { color: #159939; } .cms-page-view .main .content .cms-list, .cms-no-route .main .content .cms-list { width: 100%; float: left; } .cms-page-view .main .content .cms-list li, .cms-no-route .main .content .cms-list li { list-style: none; float: left; width: 30%; margin-bottom: 30px; } .cms-page-view .main .static-menu, .cms-no-route .main .static-menu { float: left; width: 100%; margin-bottom: 10%; } .cms-page-view .main .static-menu .item1, .cms-page-view .main .static-menu .item2, .cms-page-view .main .static-menu .item3, .cms-page-view .main .static-menu .item4, .cms-no-route .main .static-menu .item1, .cms-no-route .main .static-menu .item2, .cms-no-route .main .static-menu .item3, .cms-no-route .main .static-menu .item4 { float: left; width: 25%; } .cms-page-view .main .static-menu .item1 a, .cms-page-view .main .static-menu .item2 a, .cms-page-view .main .static-menu .item3 a, .cms-page-view .main .static-menu .item4 a, .cms-no-route .main .static-menu .item1 a, .cms-no-route .main .static-menu .item2 a, .cms-no-route .main .static-menu .item3 a, .cms-no-route .main .static-menu .item4 a { font: 16px "robotomedium", Verdana, Arial, sans-serif; color: #b6b6b6; cursor: pointer; } .cms-page-view .main .static-menu .item1 a:hover, .cms-page-view .main .static-menu .item2 a:hover, .cms-page-view .main .static-menu .item3 a:hover, .cms-page-view .main .static-menu .item4 a:hover, .cms-no-route .main .static-menu .item1 a:hover, .cms-no-route .main .static-menu .item2 a:hover, .cms-no-route .main .static-menu .item3 a:hover, .cms-no-route .main .static-menu .item4 a:hover { color: #159939; } .cms-page-view .std img, .cms-no-route .std img { max-width: 100%; } .cms-page-view .std p, .cms-no-route .std p { color: #636363; font-family: "robotoregular", Verdana, Arial, sans-serif; font-size: 14px; line-height: 24px; text-align: justify; } .cms-page-view .col-left:after, .cms-no-route .col-left:after { content: ''; display: table; clear: both; } .cms-no-route .std { height: 1100px; } .cms-no-route .std img { width: 100%; } .cms-page-view .std .messages, .cms-home .std .messages, .cms-no-route .std .messages { margin-bottom: 10px; } .cms-page-view .std .messages ul, .cms-home .std .messages ul, .cms-no-route .std .messages ul { margin-bottom: 0; } .cms-page-view .std .messages li, .cms-home .std .messages li, .cms-no-route .std .messages li { list-style: none; margin-left: 0; font-style: normal; font-family: "robotoregular", Verdana, Arial, sans-serif; } #accordion .toggle-tabs { display: none; } #accordion > dl > dt { margin: 0; margin-bottom: 10px; color: #636363; font-family: "robotobold", Verdana, Arial, sans-serif; font-size: 14px; font-weight: bold; font-style: normal; line-height: 1.4; text-rendering: optimizeSpeed; -moz-user-select: none; -ms-user-select: none; -webkit-user-select: none; -o-user-select: none; user-select: none; font-weight: normal; margin-bottom: 0px; padding: 7px 10px; position: relative; background-color: #E0E0E0; display: block; } #accordion > dl > dt:after { content: ''; position: absolute; width: 0; height: 0; display: block; border-right: 4px solid transparent; border-left: 4px solid transparent; border-top: 4px solid #159939; border-bottom: none; left: 10px; top: 50%; margin-top: -3px; } #accordion > dl > dd { padding: 8px 0 8px 15px; margin: 0; } #accordion li { position: relative; overflow: hidden; } #accordion li .plusimage h2 { margin-right: 10px; } .page-sitemap .links { display: block; text-align: right; margin: 0 20px 0 0; } .page-sitemap .links a { position: relative; } .page-sitemap .sitemap { padding: 0 20px; margin: 15px 0; font-size: 12px; } .page-sitemap .sitemap li { margin: 3px 0; } .contacts-index-index .col-main .contact-form, .contacts-contacts-index .col-main .contact-form { width: 60%; float: left; padding: 20px; border: 1px solid #eee; border-radius: 3px; } .contacts-index-index .col-main .contact-form .wide textarea, .contacts-contacts-index .col-main .contact-form .wide textarea { height: 72px; } .contacts-index-index .col-main .info-contacto, .contacts-contacts-index .col-main .info-contacto { width: 38%; float: right; padding: 20px; border: 1px solid #eee; border-radius: 3px; } .contacts-index-index .col-main .info-contacto h2, .contacts-contacts-index .col-main .info-contacto h2 { font: 18px "robotomedium", Verdana, Arial, sans-serif; color: #cccccc; } .contacts-index-index .col-main .info-contacto p, .contacts-contacts-index .col-main .info-contacto p { font: 15px "robotoregular", Verdana, Arial, sans-serif; color: #636363; } .contacts-index-index .col-main .info-contacto span, .contacts-contacts-index .col-main .info-contacto span { font-family: "robotobold", Georgia, Times, "Times New Roman", serif; } .contacts-index-index .col-main .map, .contacts-contacts-index .col-main .map { width: 995px; height: 500px; margin-bottom: 50px; margin-top: 4%; float: left; } .contacts-index-index .col-main .buttons-set, .contacts-contacts-index .col-main .buttons-set { margin: 0; text-align: left; max-width: inherit; border-top: none; } .contacts-index-index .col-main .buttons-set a, .contacts-contacts-index .col-main .buttons-set a { padding: 0; line-height: 0; text-decoration: underline; } .contacts-index-index .col-main .buttons-set .checkPolitica a, .contacts-contacts-index .col-main .buttons-set .checkPolitica a { text-decoration: underline; color: #636363; font-style: italic; } .contacts-index-index .col-main .buttons-set .checkPolitica a:hover, .contacts-contacts-index .col-main .buttons-set .checkPolitica a:hover { color: #636363; } @media only screen and (max-width: 770px) { #contactForm { padding-left: 0; } } .servired-standard-visa table, .servired-standard-mastercard table { width: 995px; margin: 20px auto; display: block; height: 100%; } /* ============================================ * * Pricing Conditions * ============================================ */ .price-box .minimal-price-link .label { font-family: "robotomedium", Verdana, Arial, sans-serif; font-size: 14px; } .map-info { white-space: nowrap; } .catalog-product-view .map-info { white-space: normal; } .catalog-product-view .map-info > span { float: right; margin-bottom: 5px; } .catalog-product-view .map-info .price-box.map-info > a { float: right; width: 100%; } /* ============================================ * * Cookies * ============================================ */ .notice-cookie .notice-inner { padding-bottom: 0; } .notice-cookie .notice-inner:after { content: ''; display: table; clear: both; } .notice-cookie .notice-text { float: left; max-width: 90%; padding-top: 4px; text-align: left; } .notice-cookie .notice-text p { padding-bottom: 14.5px; line-height: 1.3; } .notice-cookie .actions { float: left; text-align: right; padding-bottom: 14.5px; } @media only screen and (max-width: 979px) { .notice-cookie .notice-text { max-width: 86%; } } @media only screen and (max-width: 770px) { .notice-cookie { padding: 0 20px; } .notice-cookie .notice-text { max-width: 82%; padding-top: 0; } } @media only screen and (max-width: 620px) { .notice-cookie { padding: 0 20px; } .notice-cookie .notice-inner { background-position: left 10px; } .notice-cookie .notice-inner:after { content: ''; display: table; clear: both; } .notice-cookie .notice-text { float: none; max-width: 100%; padding-top: 0; } .notice-cookie .actions { text-align: left; } } #cookie-law p { padding: 10px 30px !important; } #cookie-law span.close { right: 5px; position: absolute; top: 8px; cursor: pointer; } #cookie-law span.close:before { font-family: 'iconfont'; content: '\e606'; color: black; font-size: 22px; line-height: 26px; display: inline-block; } #cookie-law a { font-weight: 900; } /* ============================================ * * Tags * ============================================ */ #addTagForm button { margin-top: 5px; margin-bottom: 10px; } #addTagForm .form-add { margin-top: 10px; } .product-tags { background-color: #F4F4F4; border: 1px solid #CCCCCC; float: left; margin-bottom: 10px; padding: 5px 1% 10px; width: 98%; } .product-tags li { float: left; margin-right: 15px; } .product-tags li.last { margin-right: 0px; } .tags-list { float: left; width: 100%; margin-bottom: 10px; } .tags-list > li { float: left; margin-right: 10px; } .block-tags .actions > a { font-size: 12px; } .my-tag-edit .button.btn-remove { padding: 0; } .my-tag-edit .button.btn-remove:after { color: white; } @media only screen and (max-width: 770px) { .tags-list > li, .tags-list { float: none; } } /* ============================================ * * Captcha * ============================================ */ .captcha-note { clear: left; padding-top: 5px; } .captcha-image { float: left; display: inline; max-width: 100%; position: relative; width: 258px; margin-bottom: 10px; } .captcha-image .captcha-img { border: 1px solid #b6b6b6; vertical-align: bottom; width: 100%; } .registered-users .captcha-image { margin: 0; } .captcha-reload { cursor: pointer; position: absolute; top: 2px; right: 2px; } .captcha-reload.refreshing { animation: rotate 1.5s infinite linear; -webkit-animation: rotate 1.5s infinite linear; -moz-animation: rotate 1.5s infinite linear; } .customer-account-create .scaffold-form .captcha-input-container label:first-child { width: 100%; } .captcha-reload { position: absolute; right: 4px; top: 4px; } .captcha-img { border: 20px solid #bbb; } .captcha-input-container { margin-bottom: 10px; } .control.newsletter-box, .captcha-input-container, .captcha-img-container { float: none; clear: both; } .control.newsletter-box:after, .captcha-input-container:after, .captcha-img-container:after { content: ''; content: ''; display: table; clear: both; } /* ============================================ * * Checkout Billing Fix to place the Captcha properly * ============================================ */ #co-billing-form ul.form-list > .control { float: left; margin: 0 0 5px; width: 100%; } /* ============================================ * * Account - Orders, Invoices, Credit Memos. * ============================================ */ @media only screen and (max-width: 479px) { .sales-order-invoice .sub-title, .sales-order-creditmemo .sub-title, .sales-order-shipment .sub-title { float: left; font-size: 15px; text-align: center; width: 100%; } .sales-order-invoice .order-links, .sales-order-creditmemo .order-links, .sales-order-shipment .order-links { text-align: center; width: 100%; } } /* ============================================ * * Recurring Profiles * ============================================ */ #recurring_profile_list_view th { white-space: normal; } #recurring_profile_list_view th span { white-space: inherit; } @media only screen and (max-width: 479px) { #recurring_profile_list_view { font-size: 12px; } #recurring_profile_list_view a { font-size: inherit; } #recurring_profile_list_view th, #recurring_profile_list_view td { padding: 2px; } } .recurring-profiles-title { float: left; } .recurring-profiles-title h1 { margin-bottom: 7px; } body.customer-account .my-account .title-buttons.recurring-profiles-title-buttons { float: right; text-align: right; margin-bottom: 30px; } @media only screen and (max-width: 479px) { body.customer-account .my-account .title-buttons.recurring-profiles-title-buttons { text-align: center; float: none; } } body.customer-account .my-account .title-buttons.recurring-profiles-title-buttons .button { position: static; } .recurring-profiles-messages:after { content: ''; display: table; clear: both; } #recurring_start_date_trig { display: inline; } /* ============================================ * * Billing Agreements * ============================================ */ .billing-agreements .info-box { margin-bottom: 30px; } .billing-agreements .info-box:after { content: ''; display: table; clear: both; } .billing-agreements .info-box .form-list { max-width: 400px; width: 100%; } .billing-agreements .info-box .box-title { margin-top: 20px; margin-bottom: 7px; } .billing-agreements .info-box .button { float: right; margin-top: 7px; } @media only screen and (max-width: 479px) { .billing-agreements .info-box .button { width: 100%; float: none; } } .billing-agreements #payment_method { width: 100%; margin-top: 7px; margin-bottom: 7px; } .billing-agreement-view-header-wrapper .heading { max-width: 80%; } @media only screen and (max-width: 479px) { .billing-agreement-view-header-wrapper .heading { max-width: 100%; } } .billing-agreement-details td, .billing-agreement-details th { padding: 3.5px; } @media only screen and (max-width: 979px) { .billing-agreements .data-table .created-at, .billing-agreements .data-table .updated-at { display: none; } } /* ============================================ * * Popular Search Terms Cloud * ============================================ */ .catalogsearch-term-popular .tags-list { float: left; width: 100%; } .catalogsearch-term-popular .tags-list > li { float: left; height: 40px; margin-right: 25px; } /* ============================================ * * Widgets * ============================================ */ /* -------------------------------------------- * * Add to cart by SKU */ .sidebar .widget-addbysku .sku-table .input-text:not(.qty) { width: 100%; } @media only screen and (min-width: 771px) { .sidebar .widget-addbysku .sku-table .input-text:not(.qty) { max-width: 100px; } } .widget { clear: both; } .widget .pager { float: none; width: 100%; } @media only screen and (min-width: 1199px) { .col2-left-layout .col-main .widget, .col2-right-layout .col-main .widget, .col3-layout .col-main .widget { /* Config: Columns + flexible gutter */ /* Undo three-column config */ /* Set column config */ /* Config: Columns + flexible gutter */ /* Undo three-column config */ /* Set column config */ } .col2-left-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(odd), .col2-right-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(odd), .col3-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(odd) { clear: none; } .col2-left-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(3n+1), .col2-right-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(3n+1), .col3-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(3n+1) { clear: none; } .col2-left-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(even), .col2-left-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(3n), .col2-right-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(even), .col2-right-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(3n), .col3-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(even), .col3-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(3n) { margin-right: 0; } .col2-left-layout .col-main .widget .products-grid--max-4-col-widget > li, .col2-right-layout .col-main .widget .products-grid--max-4-col-widget > li, .col3-layout .col-main .widget .products-grid--max-4-col-widget > li { margin-right: 2.22222%; } .col2-left-layout .col-main .widget .products-grid--max-4-col-widget > li, .col2-right-layout .col-main .widget .products-grid--max-4-col-widget > li, .col3-layout .col-main .widget .products-grid--max-4-col-widget > li { width: 190px; margin-right: 2.22222%; } .col2-left-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(4n+1), .col2-right-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(4n+1), .col3-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(4n+1) { clear: left; } .col2-left-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(4n), .col2-right-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(4n), .col3-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(4n) { margin-right: 0; } .col2-left-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(odd), .col2-right-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(odd), .col3-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(odd) { clear: none; } .col2-left-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(3n+1), .col2-right-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(3n+1), .col3-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(3n+1) { clear: none; } .col2-left-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(even), .col2-left-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(3n), .col2-right-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(even), .col2-right-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(3n), .col3-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(even), .col3-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(3n) { margin-right: 0; } .col2-left-layout .col-main .widget .products-grid--max-5-col-widget > li, .col2-right-layout .col-main .widget .products-grid--max-5-col-widget > li, .col3-layout .col-main .widget .products-grid--max-5-col-widget > li { margin-right: 2.22222%; } .col2-left-layout .col-main .widget .products-grid--max-5-col-widget > li, .col2-right-layout .col-main .widget .products-grid--max-5-col-widget > li, .col3-layout .col-main .widget .products-grid--max-5-col-widget > li { width: 190px; margin-right: 2.22222%; } .col2-left-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(5n+1), .col2-right-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(5n+1), .col3-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(5n+1) { clear: left; } .col2-left-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(5n), .col2-right-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(5n), .col3-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(5n) { margin-right: 0; } } @media only screen and (min-width: 770px) { .col1-layout .col-main .widget { /* Config: Columns + flexible gutter */ /* Undo three-column config */ /* Set column config */ /* Config: Columns + flexible gutter */ /* Undo three-column config */ /* Set column config */ } .col1-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(odd) { clear: none; } .col1-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(3n+1) { clear: none; } .col1-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(even), .col1-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(3n) { margin-right: 0; } .col1-layout .col-main .widget .products-grid--max-4-col-widget > li { margin-right: 2.22222%; } .col1-layout .col-main .widget .products-grid--max-4-col-widget > li { width: 190px; margin-right: 2.22222%; } .col1-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(4n+1) { clear: left; } .col1-layout .col-main .widget .products-grid--max-4-col-widget > li:nth-child(4n) { margin-right: 0; } .col1-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(odd) { clear: none; } .col1-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(3n+1) { clear: none; } .col1-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(even), .col1-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(3n) { margin-right: 0; } .col1-layout .col-main .widget .products-grid--max-5-col-widget > li { margin-right: 2.22222%; } .col1-layout .col-main .widget .products-grid--max-5-col-widget > li { width: 190px; margin-right: 2.22222%; } .col1-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(5n+1) { clear: left; } .col1-layout .col-main .widget .products-grid--max-5-col-widget > li:nth-child(5n) { margin-right: 0; } } /* ============================================ * * Checkout - Multiple Addresses * ============================================ */ body[class*="checkout-multishipping-"] .checkout-progress { width: 100%; float: left; margin-bottom: 25px; } body[class*="checkout-multishipping-"] .checkout-progress > li { float: left; width: 20%; text-align: center; padding: 8px 1% 6px; background: #F4F4F4; text-transform: uppercase; border-bottom: 1px solid #CCCCCC; border-right: 1px solid #CCCCCC; margin-bottom: 10px; font-family: "robotobold", Verdana, Arial, sans-serif; } body[class*="checkout-multishipping-"] .checkout-progress > li.active { background-color: #DDDDDD; } body[class*="checkout-multishipping-"] .checkout-progress > li.last { border-right: 0px; } body[class*="checkout-multishipping-"] .page-title { float: left; width: 100%; margin-bottom: 15px; } body[class*="checkout-multishipping-"] .page-title h1 { border: 0 none; float: left; margin-top: 2px; margin-right: 2%; } body[class*="checkout-multishipping-"] .page-title .button { float: right; } body[class*="checkout-multishipping-"] .multiple-checkout > h2 { text-transform: none; font-size: 17px; margin-bottom: 15px; } body[class*="checkout-multishipping-"] .messages { float: left; width: 100%; } body[class*="checkout-multishipping-"] .col-2.col-wide { width: 66%; } body[class*="checkout-multishipping-"] .col-1.col-narrow { width: 30%; } body[class*="checkout-multishipping-"] .actions { margin-bottom: 10px; } body[class*="checkout-multishipping-"] .grand-total { text-align: right; font-size: 16px; font-weight: bold; } body[class*="checkout-multishipping-"] #checkout-review-submit { float: right; } body[class*="checkout-multishipping-"] #review-buttons-container { float: right; text-align: right; } .checkout-multishipping-addresses .btn-remove2 { text-indent: -5555px; display: block; width: 22px; height: 22px; } .checkout-multishipping-shipping .gift-messages { margin-top: 20px; } .checkout-multishipping-shipping .gift-messages-form { margin-top: 15px; } .checkout-multishipping-shipping .gift-messages-form h4 { margin-top: 15px; margin-bottom: 5px; } .checkout-multishipping-shipping .gift-messages-form .form-list { margin-top: 10px; margin-bottom: 25px; } .checkout-multishipping-shipping .gift-messages-form .item { margin-top: 15px; } .checkout-multishipping-shipping .col-1 .box-title h2, .checkout-multishipping-shipping .col-1 .box-title h3, .checkout-multishipping-shipping .col-1 .box-title h4, .checkout-multishipping-shipping .col-2 .box-title h2, .checkout-multishipping-shipping .col-2 .box-title h3, .checkout-multishipping-shipping .col-2 .box-title h4, .checkout-multishipping-billing .col-1 .box-title h2, .checkout-multishipping-billing .col-1 .box-title h3, .checkout-multishipping-billing .col-1 .box-title h4, .checkout-multishipping-billing .col-2 .box-title h2, .checkout-multishipping-billing .col-2 .box-title h3, .checkout-multishipping-billing .col-2 .box-title h4, .checkout-multishipping-overview .col-1 .box-title h2, .checkout-multishipping-overview .col-1 .box-title h3, .checkout-multishipping-overview .col-1 .box-title h4, .checkout-multishipping-overview .col-2 .box-title h2, .checkout-multishipping-overview .col-2 .box-title h3, .checkout-multishipping-overview .col-2 .box-title h4 { font-weight: normal; width: 100%; background: #F4F4F4; border-bottom: 1px solid #CCCCCC; padding: 10px; font-size: 14px; } .checkout-multishipping-shipping .col-1 > h4, .checkout-multishipping-shipping .col-2 > h4, .checkout-multishipping-billing .col-1 > h4, .checkout-multishipping-billing .col-2 > h4, .checkout-multishipping-overview .col-1 > h4, .checkout-multishipping-overview .col-2 > h4 { font-weight: normal; width: 100%; background: #F4F4F4; border-bottom: 1px solid #CCCCCC; padding: 10px; font-size: 14px; } .checkout-multishipping-shipping .col-1 .box-content, .checkout-multishipping-shipping .col-2 .box-content, .checkout-multishipping-billing .col-1 .box-content, .checkout-multishipping-billing .col-2 .box-content, .checkout-multishipping-overview .col-1 .box-content, .checkout-multishipping-overview .col-2 .box-content { margin-bottom: 25px; padding-left: 10px; margin-top: 10px; } .checkout-multishipping-billing .sp-methods dt { float: left; width: 100%; } #multiship-addresses-table > tbody > tr > td.a-center.last > a { background-image: none; } #review-order-form > div:nth-child(3) > div.divider { width: 100%; clear: both; } @media only screen and (max-width: 979px) { body[class*="checkout-multishipping-"] .checkout-progress span { word-spacing: 300px; } #review-order-form .col-1, #review-order-form .col-2 { float: none; width: auto; border: 0; padding-right: 0; padding-left: 0; } } @media only screen and (max-width: 770px) { body[class*="checkout-multishipping-"] .checkout-progress span { width: 12px; } body[class*="checkout-multishipping-"] .checkout-progress li { width: 100%; margin: 0; text-align: left; padding-left: 3%; border-right: 0px; } body[class*="checkout-multishipping-"] .checkout-progress span { word-spacing: 1px; width: 12px; } body[class*="checkout-multishipping-"] .box-title { float: left; width: 100%; } body[class*="checkout-multishipping-"] .page-title .button { float: left; margin-bottom: 10px; } body[class*="checkout-multishipping-"] .linearize-table tfoot td { text-align: right; } body[class*="checkout-multishipping-"] .linearize-table select { width: 100%; min-width: 200px; } body[class*="checkout-multishipping-"] .col-1.col-narrow, body[class*="checkout-multishipping-"] .col-2.col-wide { width: 100%; padding: 0; } } @media only screen and (max-width: 599px) { .checkout-multishipping-addresses .linearize-table tbody td[data-rwd-label] { text-align: left; padding-left: 10px; margin-top: 12px; } } @media only screen and (max-width: 479px) { body[class*="checkout-multishipping-"] .buttons-set .back-link { display: block; } } /* Wordpress Fishpig Blog */ .is-blog { -webkit-transition: all 0.25s ease; transition: all 0.25s ease; /* Category and Post title */ /* HEADER */ /* LEFT SIDEBAR */ /* POST LIST */ /* SINGLE POST */ /* BLOG PAGER */ } .is-blog .main-container { padding-bottom: 30px; } .is-blog .main-container .wrap-content { max-width: 995px; width: 100%; margin: 0 auto; display: block; position: relative; } .is-blog .col-main { width: 65%; } .is-blog .col-right { width: 30%; } .is-blog .col-main, .is-blog .col-right { padding: 0; } .is-blog .breadcrumbs { width: 100%; height: 35px; line-height: 35px; } .is-blog .breadcrumbs ul { padding: 0; } .is-blog .breadcrumbs ul:after { content: ''; display: table; clear: both; } .is-blog .page-title h1 { color: #666664; font: normal 24px/29px "robotomedium", Verdana, Arial, sans-serif; text-transform: lowercase; margin: 10px 0 20px 0; } .is-blog p { font: normal 15px/21px "robotoregular", Verdana, Arial, sans-serif; color: #858585; margin: 0 0 20px 0; } .is-blog p.post-author span, .is-blog p.details a { color: #1F983E; font-family: "robotomedium", Verdana, Arial, sans-serif; text-decoration: none; } .is-blog .blog-header { width: 100%; position: relative; } .is-blog .blog-header .blog-title { width: 995px; margin: 0 auto; position: relative; z-index: 1; } .is-blog .blog-header .blog-title h1 { color: #666664; font: normal 24px/29px "robotomedium", Verdana, Arial, sans-serif; padding: 10px 0; margin: 0; } .is-blog .blog-header #backBlog { position: absolute; top: 0; left: 0; z-index: 0; width: 100%; height: 310px; background: #F6F6F6; } .is-blog .wp-sidebar .block { margin: 0 0 38px 0; padding: 30px 15px 25px 15px; position: relative; -webkit-box-shadow: 0 5px 20px rgba(103, 102, 100, 0.2); box-shadow: 0 5px 20px rgba(103, 102, 100, 0.2); background: #FFFFFF; } .is-blog .wp-sidebar .block.block-recent-posts .block-content, .is-blog .wp-sidebar .block.block-blog-archives .block-content, .is-blog .wp-sidebar .block.block-blog-categories .block-content { overflow: hidden; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .is-blog .wp-sidebar .block.block-recent-posts .block-content.view-content, .is-blog .wp-sidebar .block.block-blog-archives .block-content.view-content, .is-blog .wp-sidebar .block.block-blog-categories .block-content.view-content { max-height: 1000px; } .is-blog .wp-sidebar .block .view-all { cursor: pointer; font: normal 15px/18px "robotomedium", Verdana, Arial, sans-serif; color: #858585; display: block; float: right; margin: 10px 10px 0 0; } .is-blog .wp-sidebar .block .view-all i { float: right; font-size: 30px; font-family: 'iconfont'; line-height: 20px; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .is-blog .wp-sidebar .block .view-all.clicked { color: #1F983E; } .is-blog .wp-sidebar .block .view-all.clicked i { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .is-blog .wp-sidebar .block .view-all:after { content: ''; display: table; clear: both; } .is-blog .wp-sidebar .subscribe-text { margin: 12px 0; font: normal 13px/18px "robotoregular", Verdana, Arial, sans-serif; color: #666664; } .is-blog .wp-sidebar .blog-search, .is-blog .wp-sidebar .form-subscribe .input-box { position: relative; margin: 12px 0; } .is-blog .wp-sidebar .blog-search input[type="text"], .is-blog .wp-sidebar .form-subscribe .input-box input[type="text"] { width: 60%; float: left; border-radius: 5px 0 0 5px; } .is-blog .wp-sidebar .blog-search button, .is-blog .wp-sidebar .form-subscribe .input-box button { width: 40%; float: right; position: relative; z-index: 1; } .is-blog .wp-sidebar .checkPolitica { padding: 0 0 0 10px; } .is-blog .wp-sidebar .checkPolitica label, .is-blog .wp-sidebar .checkPolitica label a { font: normal 12px/14px "robotoregular", Verdana, Arial, sans-serif; color: #636363; text-decoration: none; } .is-blog .wp-sidebar .block-title, .is-blog .wp-sidebar .block-title strong, .is-blog .wp-sidebar .block-title strong span { padding: 0; margin: 0 0 10px 0; font: normal 18px/22px "robotomedium", Verdana, Arial, sans-serif; border: none; text-transform: lowercase; } .is-blog .wp-sidebar .block-content { margin: 0; padding: 0; } .is-blog .wp-sidebar .block-content li { margin: 0; padding: 10px; border-bottom: 1px solid #DDDDDD; } .is-blog .wp-sidebar .block-content li a { font: normal 15px/18px "robotoregular", Verdana, Arial, sans-serif; color: #868686; text-decoration: none; display: block; } .is-blog .wp-sidebar .block-content li a .count { float: right; font-family: "robotobold", Georgia, Times, "Times New Roman", serif; color: #666664; } .is-blog .wp-sidebar .block-content li a:hover, .is-blog .wp-sidebar .block-content li a:hover .count { color: #1F983E; } .is-blog .wp-sidebar .block-content li a:after { content: ''; display: table; clear: both; } .is-blog .wp-sidebar .block-content ul.tags-list { margin: 20px 0; } .is-blog .wp-sidebar .block-content ul.tags-list li { border: none; padding: 0; } .is-blog .wp-sidebar .block-content ul.tags-list li a { font: normal 14px/18px "robotomedium", Verdana, Arial, sans-serif; color: #868686; } .is-blog .wp-sidebar .block-content ul.tags-list li a:hover { color: #1F983E; } .is-blog .post-list li.item { margin-bottom: 50px; } .is-blog .post-list li.item .post-list-item { border: none; padding: 0; -webkit-box-shadow: 0 0 0 transparent; box-shadow: 0 0 0 transparent; background: transparent; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .is-blog .post-list li.item .post-list-item h2 { margin: 0 0 45px 0; } .is-blog .post-list li.item .post-list-item h2 a { font: normal 18px/24px "robotoregular", Verdana, Arial, sans-serif; color: #868686; padding: 0 30px 0 10px; display: block; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; text-transform: lowercase; } .is-blog .post-list li.item .post-list-item h2 a i { float: right; font-size: 30px; line-height: 24px; color: #CCCCCC; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .is-blog .post-list li.item .post-list-item h2:after { content: ''; display: table; clear: both; } .is-blog .post-list li.item .post-list-item p { margin: 0 0 45px 0; padding: 0 30px 0 10px; } .is-blog .post-list li.item .post-list-item:hover { -webkit-box-shadow: 0 5px 20px rgba(103, 102, 100, 0.2); box-shadow: 0 5px 20px rgba(103, 102, 100, 0.2); background: #FFFFFF; } .is-blog .post-list li.item .post-list-item:hover h2 a, .is-blog .post-list li.item .post-list-item:hover h2 a i { color: #636363; } .is-blog .post-list li.item .post-list-item p.date { font: normal 14px/17px "robotobold", Georgia, Times, "Times New Roman", serif; color: #20983E; margin: 12px 0; padding: 0 10px; } .is-blog .post-list li.item .post-list-item .featured-image { float: none; width: 100%; border: 0; margin: 0; padding: 0; height: 280px; overflow: hidden; } .is-blog .post-list li.item .post-list-item .featured-image img { width: 100%; height: auto; } .is-blog .post-list li.item .post-list-item:after { content: ''; display: table; clear: both; } .is-blog.wordpress-post-view .blog-title { display: none; } .is-blog.wordpress-post-view .col-main img { -webkit-box-shadow: 4px 0 18px rgba(103, 102, 100, 0.25); box-shadow: 4px 0 18px rgba(103, 102, 100, 0.25); max-width: 100%; height: auto; } .is-blog.wordpress-post-view .col-main p.date { text-align: right; color: #20983E; font: normal 14px/20px "robotobold", Georgia, Times, "Times New Roman", serif; margin: 20px 0 10px 0; } .is-blog.wordpress-post-view .col-main .post-entry p { float: left; width: 100%; } .is-blog.wordpress-post-view .col-main .post-entry .alignright { float: right; } .is-blog.wordpress-post-view .col-main .post-entry .alignleft { float: left; } .is-blog.wordpress-post-view .col-main .post-entry .alignnone, .is-blog.wordpress-post-view .col-main .post-entry .aligncenter { margin: 0 auto; } .is-blog.wordpress-post-view .col-main, .is-blog.wordpress-post-view .col-right { padding-top: 20px; } .is-blog.wordpress-post-view .post-skips { display: none; } .is-blog.wordpress-post-view .sharing-links { text-align: right; margin: 30px 0; } .is-blog.wordpress-post-view .sharing-links span { color: #DDDDDD; font: normal 12px/14px "robotobold", Georgia, Times, "Times New Roman", serif; text-transform: uppercase; display: block; margin-bottom: 10px; } .is-blog.wordpress-post-view .sharing-links ul li { display: inline-block; margin-left: 12px; } .is-blog.wordpress-post-view .sharing-links ul li a { font-size: 25px; color: #CCCCCC; } .is-blog.wordpress-post-view .sharing-links ul li a:hover { color: #636363; } .is-blog.wordpress-post-view .sharing-links:after { content: ''; display: table; clear: both; } .is-blog.wordpress-post-view #advice-required-entry-recaptcha_response_field { margin: 10px 0 5px 0; color: #DF280A; } .is-blog.wordpress-post-view #comments { padding: 35px 25px; -webkit-box-shadow: 0 5px 20px rgba(103, 102, 100, 0.2); box-shadow: 0 5px 20px rgba(103, 102, 100, 0.2); background: #FFFFFF; } .is-blog.wordpress-post-view #comments .title { text-transform: lowercase; font: normal 18px/22px "robotomedium", Verdana, Arial, sans-serif; } .is-blog.wordpress-post-view #comments .comment-list { margin: 15px 0; } .is-blog.wordpress-post-view #comments form label { font-family: "robotoregular", Verdana, Arial, sans-serif; } .is-blog.wordpress-post-view #comments form legend { font: normal 20px/24px "robotobold", Georgia, Times, "Times New Roman", serif; color: #858585; margin: 0; padding: 0; } .is-blog.wordpress-post-view #comments form p { margin: 15px 0; font: normal 14px/17px "robotoregular", Verdana, Arial, sans-serif; color: #858585; } .is-blog.wordpress-post-view #comments form input[type="text"], .is-blog.wordpress-post-view #comments form textarea { -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 5px; -webkit-box-shadow: 3px 2px 10px -3px #c7c7c7; box-shadow: 3px 2px 10px -3px #c7c7c7; background: #f1f1f1; line-height: 1.8; font-family: "robotolight", Verdana, Arial, sans-serif; font-size: 13px; border: 0px; height: 42px; padding-left: 15px; width: 100%; max-width: 270px; } .is-blog.wordpress-post-view #comments form input[type="text"]:focus, .is-blog.wordpress-post-view #comments form textarea:focus { background: #E5E5E5; outline: 0 none; border-color: #E5E5E5 !important; } .is-blog.wordpress-post-view #comments form textarea { height: 80px; resize: none; max-width: 100%; } .is-blog.wordpress-post-view #comments .buttons-set { border: none; } .is-blog.wordpress-post-view #comments .gravatar { float: left; margin: 0 10px 10px 0; } .is-blog.wordpress-post-view #comments .comment-date span, .is-blog.wordpress-post-view #comments .reply a { color: #1F983E; } .is-blog.wordpress-post-view #comments .reply { clear: both; } .is-blog .limiter { display: none; } .is-blog .pager { float: none; text-align: center; position: relative; clear: both; display: none; } .is-blog .pager .pages, .is-blog .pager .pages ol { width: 100%; float: none; clear: both; } .is-blog .pager .pages { margin: 0; } .is-blog .pager .pages li { margin: 0; padding: 0 10px; float: none; display: inline-block; } .is-blog .pager .pages li, .is-blog .pager .pages li a { font: normal 16px/30px "robotomedium", Verdana, Arial, sans-serif; } .is-blog .pager .pages li, .is-blog .pager .pages li a:hover { color: #868686; } .is-blog .pager .pages li a { color: #CCCCCC; margin: 0; width: auto; } .is-blog .pager .pages .previous-arrow, .is-blog .pager .pages .next-arrow { position: absolute; top: 0; padding: 0; } .is-blog .pager .pages .previous-arrow i, .is-blog .pager .pages .next-arrow i { font-size: 25px; line-height: 30px; } .is-blog .pager .pages .previous-arrow { left: 0; text-align: left; } .is-blog .pager .pages .previous-arrow i { float: left; margin-right: 10px; } .is-blog .pager .pages .next-arrow { right: 0; text-align: right; } .is-blog .pager .pages .next-arrow i { float: right; margin-left: 10px; } .is-blog .pager:after { content: ''; display: table; clear: both; } .is-blog .footer .newsletter { display: none; } .is-blog .block-recent-posts .view-all { display: none; } .entry-text a { color: #11B400; } /* ============================================ * * Calendar styles (restore styles from /js/calendar) * ============================================ */ div.calendar table { border-collapse: separate; } div.calendar table td.button { display: table-cell; background: inherit; color: inherit; text-transform: none; } /* ============================================ * * Homepage * ============================================ */ /* -------------------------------------------- * * Primary Banner */ body.cms-home .slideshow-container { margin-top: 0; } .slideshow .banner-msg { position: absolute; text-align: center; text-transform: uppercase; width: 100%; top: 30%; -moz-user-select: none; -ms-user-select: none; -webkit-user-select: none; -o-user-select: none; user-select: none; } .slideshow .banner-msg h2 { color: #FFFFFF; font-size: 24px; text-shadow: 1px 1px 3px false #555555; } .slideshow .banner-msg h2 strong { font-weight: bold; display: block; font-size: 36px; } @media only screen and (max-width: 770px) { .slideshow .banner-msg h2 { font-size: 20px; } .slideshow .banner-msg h2 strong { font-size: 24px; } } @media only screen and (max-width: 479px) { .slideshow .banner-msg { top: 20%; } .slideshow .banner-msg h2 { font-size: 14px; } .slideshow .banner-msg h2 strong { font-size: 16px; } } /* -------------------------------------------- * * Promotion Banner Section */ .promos { margin: 0 0 10px 0; padding: 0; width: 100%; } .promos:after { content: ''; display: table; clear: both; } /* Specifying the body only in order to override the .std ul li styling */ body .promos > li { margin: 0 0 10px 0; list-style: none; text-align: center; position: relative; border: 1px solid #CCCCCC; -moz-user-select: none; -ms-user-select: none; -webkit-user-select: none; -o-user-select: none; user-select: none; } .promos > li:last-child { margin-bottom: 0; } .promos img { max-width: 100%; width: 100%; } .promos a:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80); opacity: 0.8; display: block; } .promos span { color: #FFFFFF; text-transform: uppercase; position: absolute; display: block; width: 100%; top: 10%; font-weight: 500; font-size: 20px; font-family: "robotobold", Verdana, Arial, sans-serif; text-shadow: 1px 1px 3px false #555555; } .promos strong { font-weight: 600; font-size: 26px; display: block; } .promos span { font-size: 16px; } .promos strong { font-size: 17px; } /* Config: Three columns + flexible gutter */ body .promos > li { float: left; width: 31.74603%; margin-right: 2.38095%; } .promos > li:nth-child(3n) { margin-right: 0; } @media only screen and (min-width: 880px) { .promos span { font-size: 18px; } .promos strong { font-size: 24px; } } /* -------------------------------------------- * * New Products Section */ /* Hiding the reviews content via CSS because we can't modify the template, */ /* since it may be used in other places where those elements are needed */ .cms-index-index .products-grid .ratings, .cms-index-index .products-grid .actions, .cms-index-noroute .products-grid .ratings, .cms-index-noroute .products-grid .actions { display: none; } .cms-index-index h2.subtitle { padding: 6px 0; text-align: center; font-weight: 600; border-bottom: 1px solid #CCCCCC; border-top: 1px solid #CCCCCC; } .cms-index-index .success-msg { margin-top: 10px; } .cms-index-noroute h2.subtitle { display: none; } /* * * * * * * */ /* CMS BLOCKS */ /* * * * * * * */ /* BX-SLIDER */ .bx-wrapper { position: relative; } .bx-wrapper .bx-controls-direction a { display: block; position: absolute; margin: 0; padding: 0; color: #cccccc; font-size: 30px; text-align: center; border: 1px solid #cccccc; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; top: 50%; transform: translate(0,-50%); -webkit-transform: translate(0,-50%); -moz-transform: translate(0,-50%); -o-transform: translate(0,-50%); opacity: 0.7; filter: alpha(opacity=70); -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .bx-wrapper .bx-controls-direction .bx-prev { left: 15px; } .bx-wrapper .bx-controls-direction .bx-next { right: 15px; } .bx-wrapper:hover .bx-controls-direction a { color: #636363; border-color: #636363; background: #fff; } .bx-wrapper .bx-controls-direction a.disabled { display: none; } .home-slide .bx-wrapper .bx-controls-direction a { font-size: 40px; } #block-related .bx-wrapper, #home-carousel-latest .bx-wrapper { margin: 0 35px 0 40px; } #block-related .bx-wrapper .bx-controls-direction .bx-prev, #home-carousel-latest .bx-wrapper .bx-controls-direction .bx-prev { left: -40px; } #block-related .bx-wrapper .bx-controls-direction .bx-next, #home-carousel-latest .bx-wrapper .bx-controls-direction .bx-next { right: -32px; } /* MAIN SLIDER */ .home-slide { width: 100%; margin: 0 auto; position: relative; } .home-slide #homeSlide .slide-item { width: 100%; height: 450px !important; } .home-slide #homeSlide .slide-item { width: 100%; height: 344px !important; } .home-slide .bx-viewport { overflow: visible !important; } .home-slide .bx-wrapper { height: 344px !important; } .home-slide .bx-wrapper .bx-viewport #homeSlide div li { list-style: none; margin-left: 0; height: 344px; background-size: cover; } .home-slide .bx-wrapper .bx-viewport #homeSlide div.active-slide li { list-style: none; margin-left: 0; } .home-slide .bx-wrapper .bx-pager.bx-default-pager a:hover, .home-slide .bx-wrapper .bx-pager.bx-default-pager a.active { background: #ffffff; } .home-slide .bx-wrapper .bx-pager.bx-default-pager a { text-indent: -9999px; display: block; width: 10px; height: 10px; margin: 0 5px; outline: 0; border-radius: 5px; border: 1px solid #ffffff; } .home-slide .bx-wrapper .bx-pager { text-align: center; font-size: .85em; font-family: Arial; font-weight: bold; color: #666; padding-top: 20px; } .home-slide .bx-wrapper .bx-pager, .home-slide .bx-wrapper .bx-controls-auto { position: absolute; bottom: 15px; width: 100%; } .home-slide .bx-pager-item { display: inline-block; } .home-slide .content { font-family: "robotoregular", Verdana, Arial, sans-serif; color: #ffffff; width: 995px; margin: 0 auto; display: block; height: 100%; padding: 270px 0 0 0px; } .home-slide .content p { margin-bottom: 10px; } .home-slide .content .bottom { position: absolute; bottom: 20px; width: 995px; padding: 44px 30px; } .home-slide .content .bottom .button { margin: 0 0 0 20px; } .home-slide .content .title { padding: 5px 20px; font-size: 42px; font-family: "robotoregular", Verdana, Arial, sans-serif; font-weight: 700; } .home-slide .content .small-text { font-size: 18px; padding: 10px; } .home-slide .content .small-text .special { color: #159939; font-family: "robotobold", Georgia, Times, "Times New Roman", serif; } .home-slide .mask-slider { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40); opacity: 0.4; width: 100%; height: 140px; background-color: black; opacity: 0.4; position: absolute; max-width: 995px; margin: 155px auto 0px auto; top: 0; left: 0; right: 0; } /* CMS HOME NOVEDADES and HOME DORMITORIOS*/ .home-latest .overline, .block-related .overline, .home-collections .overline { width: 50px; height: 5px; background-color: #159939; border: 0; margin-bottom: 10px; } .home-collections .products-grid > li .product-image { margin-bottom: 0; } .home-collections li:hover { border-bottom: 0 !important; } /* CMS HOME BENEFITS */ .home-benefits { background-color: #eee; } .home-benefits ul { display: flex; justify-content: center; margin-bottom: 0; } .home-benefits ul li { /*flex-grow: 1;*/ flex-basis: 250px; padding: 15px 0; margin: 0; font-size: 15px; text-align: center; line-height: 1.2; list-style: none; } .home-benefits ul li .highlight { display: block; color: #159939; } .home-benefits ul li .icon { display: block; margin-bottom: 5px; font-size: 27px; color: #636363; } .home-benefits ul li p { margin: 0; cursor: pointer; } .home-benefits ul li p:before { display: block; } .home-benefits ul li a { font-family: "robotomedium", Verdana, Arial, sans-serif; color: #636363; } .home-benefits ul li a:hover { color: #636363; } .home-benefits ul li a:hover span.highlight { color: #44AA5E; } .home-benefits #fancyboxHome1, .home-benefits #fancyboxHome2 { display: none; } #fancyboxHome1 .title, #fancyboxHome1 .info, #fancyboxHome2 .title, #fancyboxHome2 .info { padding: 5%; float: left; width: 100%; } #fancyboxHome1 .title p, #fancyboxHome1 .info p, #fancyboxHome2 .title p, #fancyboxHome2 .info p { font: 18px "robotomedium", Verdana, Arial, sans-serif; color: #666664; } #fancyboxHome1 .title h3, #fancyboxHome1 .info h3, #fancyboxHome2 .title h3, #fancyboxHome2 .info h3 { font: 24px "robotomedium", Verdana, Arial, sans-serif; color: #666664; float: left; padding: 0px 0% 0 2%; } #fancyboxHome1 .title h3 span, #fancyboxHome1 .info h3 span, #fancyboxHome2 .title h3 span, #fancyboxHome2 .info h3 span { color: #159939; } #fancyboxHome1 .title h4, #fancyboxHome1 .info h4, #fancyboxHome2 .title h4, #fancyboxHome2 .info h4 { font: 20px "robotoregular", Verdana, Arial, sans-serif; color: #636363; margin: 0; } #fancyboxHome1 .title .code, #fancyboxHome1 .info .code, #fancyboxHome2 .title .code, #fancyboxHome2 .info .code { font: 28px "robotobold", Georgia, Times, "Times New Roman", serif; color: #159939; } #fancyboxHome1 .title span.green, #fancyboxHome1 .info span.green, #fancyboxHome2 .title span.green, #fancyboxHome2 .info span.green { color: #159939; } #fancyboxHome1 .title a.button, #fancyboxHome1 .info a.button, #fancyboxHome2 .title a.button, #fancyboxHome2 .info a.button { float: right; margin-top: 7%; } #fancyboxHome1 .title, #fancyboxHome2 .title { border-bottom: 1px solid #bbbbbb; } #fancyboxHome1 .title p, #fancyboxHome2 .title p { margin-top: 15px; } #fancyboxHome1 .info p.code, #fancyboxHome2 .info p.code { margin-bottom: 20px; } #fancyboxHome1 .icon-delivery, #fancyboxHome1 .icon-client2, #fancyboxHome1 .telephone-image, #fancyboxHome2 .icon-delivery, #fancyboxHome2 .icon-client2, #fancyboxHome2 .telephone-image { font-size: 32px; float: left; color: #636363; } /* CMS HOME DESTACADOS */ .home-outstanding { height: 285px; width: 100%; clear: both; background-color: #dddddd; } .home-outstanding ul { height: 284px; } .home-outstanding ul .disabled { width: 2.3%; } .home-outstanding ul li { float: left; width: 23%; list-style: none; margin: 0px; height: 285px; } .home-outstanding ul li a { background-color: #BBBBBB; } .home-outstanding ul li a div { margin-top: 62px; height: 160px; } .home-outstanding ul li a div h4 { padding: 27px 10px; line-height: 20px; margin-top: 20px; text-align: left; font-family: "robotomedium", Verdana, Arial, sans-serif; font-size: 22px; color: #ffffff; text-transform: none; } .home-outstanding ul li:hover:not(.disabled) { background-color: #ffffff; } /* CMS HOME BANNERS */ .home-banners { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .home-banners .half { width: 50%; float: left; } .home-banners .banner { background-size: cover; float: left; text-align: center; position: relative; } .home-banners .banner .highlight { font-family: "robotobold", Verdana, Arial, sans-serif; } .home-banners .banner .overlay { background-color: black; position: absolute; top: 0; left: 0; opacity: 0.3; -webkit-transition: all 0.3s ease-in; -webkit-transition-delay: 0s; -webkit-transition: all 0.3s ease-in 0s; transition: all 0.3s ease-in 0s; } .home-banners .banner .content { padding: 8% 11%; height: 100%; color: #ffffff; font-family: "robotoregular", Verdana, Arial, sans-serif; z-index: 999; position: relative; line-height: 1.2; -webkit-transition: all 0.3s ease-in; -webkit-transition-delay: 0s; -webkit-transition: all 0.3s ease-in 0s; transition: all 0.3s ease-in 0s; } .home-banners .banner:hover .overlay { background-color: #ffffff; opacity: 0.8; } .home-banners .banner:hover .content { color: #636363; } .home-banners .banner1 { height: 505px; width: 492px; font-size: 36px; padding: 34% 15%; } .home-banners .banner1 .overlay { height: 505px; width: 492px; } .home-banners .banner1 .content { padding: 8% 11%; } .home-banners .banner2 { height: 285px; width: 283px; margin-left: 5px; font-size: 22px; } .home-banners .banner2 .overlay { height: 285px; width: 283px; } .home-banners .banner2 .content { padding: 47% 0%; } .home-banners .banner3 { height: 285px; width: 189px; margin-left: 10px; font-size: 24px; text-align: left; } .home-banners .banner3 .overlay { height: 285px; width: 189px; } .home-banners .banner3 .content { padding: 5% 5%; } .home-banners .banner4 { height: 210px; width: 482px; margin-left: 5px; margin-top: 10px; font-size: 30px; } .home-banners .banner4 .overlay { height: 210px; width: 482px; } .home-banners .banner4 .content { padding: 17% 10%; } /* CMS HOME BLOG */ .home-blog { float: left; width: 100%; height: 100%; padding: 40px 0 20px 0; background-color: #eee; } .home-blog h1, .home-blog h3, .home-blog a { color: #636363; font: 18px "robotoregular", Verdana, Arial, sans-serif; } .home-blog .overline { width: 20px; color: #159939; } .home-blog .title-blog { width: 90%; } .home-blog a span.icon-more-black { width: 7%; font-size: 30px; position: absolute; right: 8px; bottom: 19px; } .home-blog .block-blog .block-title { margin-bottom: 30px; text-align: center; font: 24px "robotomedium", Verdana, Arial, sans-serif; } .home-blog .block-recent-posts { float: left; position: relative; } .home-blog .block-content li.item { float: left; width: 49%; position: relative; list-style-type: none; margin: 0 1% 0 0; } .home-blog .block-content li.item .featured-image { width: 100%; height: 278px; background-size: cover; } .home-blog .block-content li.item .date { color: #cccccc; font: 14px "robotobold", Georgia, Times, "Times New Roman", serif; margin-bottom: 5px; } .home-blog .block-content li.item .post-title { float: left; background-color: #ffffff; padding: 3%; z-index: 999; position: relative; height: 110px; width: 100%; } .home-blog .block-content li.item:hover { -webkit-box-shadow: 0 6px 12px -2px #c7c7c7; box-shadow: 0 6px 12px -2px #c7c7c7; } .home-blog .block-content li.item:hover .date { color: #159939; } .home-blog .block-content li.item:hover a { color: #636363; } .home-blog .block-content li.item:last-child { margin: 0 0 0 1%; } .comprar-online { margin: 40px 30px 70px 30px; font: 18px "robotolight", Verdana, Arial, sans-serif; } .comprar-online .text { column-count: 2; column-gap: 60px; text-align: justify; } .comprar-online h3 { margin-bottom: 20px; text-transform: uppercase; } .comprar-online a { text-decoration: underline; } .comprar-online .green { display: inline-block; margin-bottom: 3px; font-weight: bold; color: #159939; } .icon-gp { float: left; margin-left: 20px; margin-top: 14px; } /* CMS HOME GRID BANNERS */ h3.home-title { margin: 30px 0 20px 0 ; padding: 0 20px; text-transform: uppercase; } .grid-banners ul { margin: 0 -15px; overflow: hidden; list-style: none; } .grid-banners ul li { float: left; width: calc(25% - 30px); margin: 0 15px 15px; } .grid-banners ul li a { display: block; position: relative; } .grid-banners ul li img { display: block; width: 100%; height: auto; } .grid-banners ul li:hover img { opacity: .5; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; } .grid-banners ul li h2, .grid-banners ul li span { display: block; margin: 0 40px 0 0; padding: 4px 15px; position: absolute; left: 0; bottom: 40px; background-color: rgba(0,0,0,.5); font-family: "roboto", Verdana, Arial, sans-serif; font-size: 18px; line-height: inherit; color: #FFF; } .home-grid, .home-latest, .block-related, .home-collections, .home-blog { margin: 40px 0; } .home-latest { background: #eee; padding: 1px 0 30px 0; } .home-latest .products-grid > li .item-inbox { background: #fff; } /* ============================================ * * Category Landing Pages * ============================================ */ .category-image { position: relative; } .categorylandingMainblock { border: 1px solid #E2E2E2; padding: 7px; } .catblocks { float: left; padding: 0 0 20px 0; width: 100%; } .catblocks li { position: relative; float: left !important; width: 23% !important; margin-right: 2.66667% !important; margin-bottom: 10px; border: 1px solid #CCCCCC; padding: 10px; } .catblocks li:hover { border-color: #159939; } @media only screen and (max-width: 770px) { .catblocks li { width: 49% !important; margin-right: 2% !important; } .catblocks li:nth-child(even) { margin-right: 0 !important; } } @media only screen and (max-width: 479px) { .catblocks li { width: 100% !important; margin-right: 0 !important; float: none; } } .catblocks li:last-child { margin-right: 0 !important; } .catblocks li img { width: 100%; max-width: 100%; } .catblocks li a span { color: #FFFFFF; position: absolute; background-color: #7B7C7B; font-family: raleway; font-size: 17px; font-weight: bold; text-transform: uppercase; text-align: center; bottom: 0px; left: 0px; width: 100%; padding: 5px 10px; margin-right: 10px; } .catblocklinks a { color: #FFFFFF; text-decoration: none; } .catlandingbottomPromoblock { float: left; width: 100%; border: 1px solid #E2E2E2; margin-bottom: 100px; } .catalog-category-view div.categoryland-caption { display: block; margin: 0; position: absolute; color: #000000; font-size: 30px; font-weight: 500; line-height: 36px; text-align: center; } div.categoryland-caption span.blue-big-text { color: #3399CC; font-size: 50px; font-weight: 800; padding: 0 0 0 8px; } .catalog-category-view div.categoryland-caption span.blue-big-text { padding: 0 !important; } .catalog-category-view div.categoryland-caption span.three-dots { background: url(https://www.tudecora.com/skin/frontend/onestic/tudecora/images/bg_threeDots.png) no-repeat center center; display: block; height: 20px; } .catalog-category-view div.categoryland-caption p.desc { font: italic 18px/28px Georgia, "Times New Roman", Times, serif; color: #656565; } .cms-home #homepage-main-slides div.slides_control div div.slideshow-caption a.link:hover, .cms-home #homepage-main-slides div.slides_control div div.slideshow-caption span.link:hover { color: #1189C5; } .cms-home #homepage-main-slides div.slides_control div div.slideshow-caption span.blue-big-text, .catalog-category-view div.categoryland-caption span.blue-big-text { color: #3399CC; font-size: 50px; font-weight: 800; padding: 0 0 0 8px; } .catalog-category-view div.categoryland-caption span.blue-big-text { padding: 0 !important; } .cms-home #homepage-main-slides div.slides_control div div.slideshow-caption span.three-dots, .catalog-category-view div.categoryland-caption span.three-dots { background: url(https://www.tudecora.com/skin/frontend/onestic/tudecora/images/bg_threeDots.png) no-repeat center center; display: block; height: 20px; } .cms-home #homepage-main-slides div.slides_control div div.slideshow-caption p.desc, .catalog-category-view div.categoryland-caption p.desc { font: italic 18px/28px Georgia, "Times New Roman", Times, serif; color: #656565; } .category-products { width: 100%; margin: auto; } .category-products .custom-select-container span.select-something { border: 1px solid #dddddd !important; } .category-products .title_category { margin-top: 20px; } .category-products .title_category h1 { font-size: 16px; font-family: "robotomedium", Verdana, Arial, sans-serif; } .category-products .sorter > .sort-by ul { float: left; width: initial; } .category-products .productsCount { text-align: left; font-style: italic; color: #bbbbbb; } .products-grid > li .product-image img { width: 100%; height: auto; } .products-grid > li .product-name a { font-size: 14px; font-family: "robotomedium", Verdana, Arial, sans-serif; text-transform: uppercase; clear: both; } .products-grid > li .price-box .price { color: #159939; font-size: 14px; font-weight: bold; text-transform: uppercase; } .products-grid > li .price-box .old-price .price { font-size: 14px; } .products-grid > li:nth-child(odd) { clear: inherit; } .description-seo { border-top: 1px solid #bbbbbb; padding: 4% 0; margin: 7% 0; } .no-search-result { height: 200px; } #sln-indicator { position: fixed; padding: 20px 50px; text-align: center; font-family: "robotoregular", Verdana, Arial, sans-serif; font-size: 14px; margin-left: -80px; left: 60%; top: 45%; height: 60px; z-index: 999; background: url(https://www.tudecora.com/skin/frontend/onestic/tudecora/images/opc-ajax-loader.gif) no-repeat scroll 0 0 transparent; } /**** 28310 Maquetación modulo pepper ****/ #checkout-review-submit .widget-container.no-seleccionable .widget-content > div:first-child strong { display: none; } /**** END 28310 Maquetación modulo pepper ****/ /**** 30400 Sequra Product ****/ .product-options-bottom .product_sequra { width: 100%; padding-top: 25px; clear: both; overflow: hidden; } .product-options-bottom .product_sequra .sequra-promotion-widget { margin-bottom: 13px; } .product-options-bottom .product_sequra .sequra-promotion-widget ~ .sequra-promotion-widget { margin-bottom: 0; } .cart-totals-wrapper .payment-info span.payment-info-sequra { float: left; font-size: unset; margin: 0 3px; } .payment-info-sequra svg { height: 20px; width: auto; } /**** END 30400 Sequra Product ****/ .sequra-educational-popup { white-space: nowrap; color: #009C5C; cursor: pointer; } .sequra-checkout-logo{ height: 1.5em; margin: 0 5px; } /** * "Seo Layered Navigation" extension for "Magento Commerce" by "EcommerceTeam (www.ecommerce-team.com)" * * @category Extension * @copyright Copyright (c) 2014 EcommerceTeam (http://www.ecommerce-team.com) * @author EcommerceTeam * @version 4.0.0 */ .block-layered-nav .resetfilter, .block-layered-nav .currently .actions a{ display:block; width:100px; height:22px; background:url('https://www.tudecora.com/skin/frontend/base/default/images/ecommerceteam/sln/button-small.png') 0 0 no-repeat; font-size:11px; text-align:center; text-decoration:none; line-height:200%; cursor:pointer; margin-top:5px; } .block-layered-nav .currently .actions a{ margin:0; } .block-layered-nav .currently .actions{ background:#E7F1F4; padding-left:12px; } .block-layered-nav dl.sln-nav dd ol > li > span,.block-layered-nav dl.sln-nav dd ol > li > a { line-height: 1.0; } .block-layered-nav dl.sln-nav .sln-type-checkbox li a, .block-layered-nav dl.sln-nav .sln-type-checkbox li span.disabled{ background:url('https://www.tudecora.com/skin/frontend/base/default/images/ecommerceteam/sln/checkbox.png') 0 0 no-repeat; padding:0 0 2px 20px; font-size: 12px; font-family: arial; } .block-layered-nav .sln-type-checkbox li span.disabled{ cursor:default; } .block-layered-nav dl.sln-nav .sln-type-checkbox li a.checked{ background-position:0 -16px; padding-left:20px; } .block-layered-nav dt{ overflow: hidden; cursor: pointer; } .block-layered-nav dt span{ float:left; } .block-layered-nav dt img.filter-details{ float:right; cursor:help; } #sln-filter-top .sln-type-image{ overflow:hidden; } #sln-filter-top .sln-type-image li{ display:inline; float:left; } .sln-type-image{ overflow:hidden; } .sln-notice-block { padding:2px 5px; background:#FEC; border:1px solid #FAA819; color:#1F5070; text-align:left; } .sln-type-input .fields{ overflow:hidden; padding:3px 0; } .sln-type-input .fields label{ display: block; } .sln-type-input .fields label span{ float:left; position:relative; top:2px; } .sln-type-input .fields label input{ float:left; margin:0 7px; width:40px; } .button-set button, .button-set button span, .button-set button span span{ border:0; background:none; padding:0; } .button-set button span span{ background:url("https://www.tudecora.com/skin/frontend/base/default/images/ecommerceteam/sln/button-small.png") no-repeat scroll 0 0 transparent; width:100px; height:22px; cursor: pointer; color:#1E7EC8; font-weight:100; font-size:11px; line-height:200%; } .block-layered-nav select{ width:165px; } .block-layered-nav .hidden { display:none; } .block-layered-nav .more { text-align: right; cursor: pointer; } /** * "Seo Layered Navigation" extension for "Magento Commerce" by "EcommerceTeam (www.ecommerce-team.com)" * * @category Extension * @copyright Copyright (c) 2014 EcommerceTeam (http://www.ecommerce-team.com) * @author EcommerceTeam * @version 4.0.0 */ /* Required styles (Don't edit these values) */ .tpgSliderRail { position: relative; } .tpgSliderThumb { /* Gecko browsers seem to need the thumb's font size to be set to 1em in order to correctly size the thumb using ems Originally this was achieved by always setting the font-size to 1em directly, but this caused IE to incorrectly covert ems to pixels when a text size other than 'normal' is chosen. As a temp fix, we now use 'inherit' as a value which currently isn't support by IE (hence the try-catch). NEEDS BETTER FIX */ font-size: inherit; position: absolute; z-index : 5; } .tpgSliderInnerRail { position: absolute; z-index: 2; overflow: hidden; } .tpgDynLabel { position: absolute; } .tpgRangeIndicator { position: absolute; z-index: 3; } /* Scale */ .tpgScaleValues li, .tpgScaleValues dd{ position: absolute; } .tpgScaleValues { position: absolute; } .tpgSliderScaleH span, .tpgSliderScaleV span { position: absolute; overflow: hidden; /* needed for IE6*/ } /* edit these at your own risk */ /* Rail */ .tpgHorizontalSlider, .tpgVerticalSlider { } .tpgHorizontalSlider .tpgSliderRail{ /*margin-left: 3px; margin-right: 3px; float:left;*/ } .tpgVerticalSlider .tpgSliderRail{ margin-top: 3px; margin-bottom: 3px; } .tpgSliderRail{ -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; } .tpgSliderInnerRail { background-color: #DDDDDD; border: 1px solid #BBBBBB; } /* Scale */ .tpgHasHScale { /*padding-bottom: 1em;*/ } .tpgHasHScale .tpgSliderRail { margin-bottom: 1em; } .tpgSliderScaleH span{ background-color: black; height: 5px; bottom: -5px; width: 1px; } .tpgSliderScaleV span{ background-color: black; width: 5px; right: -5px; height: 1px; } .tpgScaleValues { margin: 0px; padding: 0px; } .tpgScaleValues li, .tpgScaleValues dd{ list-style: none; background: none; margin: 0em; padding: 0em; } .tpgScaleValues li span, .tpgScaleValues dd span{ font-size: 0.7em; white-space: nowrap; font-weight: bold; } /* Adjustments for labels and such */ .tpgHorizontalSlider .tpgDynLabel { top: 10px; } .tpgHorizontalSlider { padding: 1px 0 1px 1px; margin-top:10px; } /* .tpgHasXLabel { padding-top: 3em; } .tpgHasYLabel { padding-left: 7em; } */ /* input and label */ .tpgHorizontalSlider .tpgSliderInput { float: left; display:none; } input.tpgSliderInput { width: 3em; border: 1px solid #BBBBBB; } .tpgHorizontalSlider label { float: left; } .tpgVerticalSlider label { display: block; } /* dynamic label */ .tpgDynLabel { color: #1F5070; white-space: nowrap; padding: 0 2px; } .tpgRangeIndicator { background-color: #3E3E3E; opacity: 0.5; filter:alpha(opacity=50); z-index: 3; overflow: hidden; } /* focus */ .focused { /* outline: .1em solid #fff500; /**/ } input.focused { /* border: 0.1em solid #fff500; margin-top: -0.1em; margin-left: -0.1em; /**/ } div.focused { border: 1px solid black; } .focused .tpgSliderInnerRail { background-color: #00CCCC; border: 1px solid #000; } /* clearfix */ .clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .clearfix { display: inline-block; } html[xmlns] .clearfix { display: block; } * html .clearfix { height: 1%; } /* hidden contextual info */ .tpgHidden { position: fixed; top: -100em; left: -100em; width: 1px; height: 1px; overflow: hidden; }