/* Journal - Advanced Opencart Theme Framework Version 2.9.8 Copyright (c) 2017 Digital Atelier https://www.journal-theme.com/ */ /****************************** REVOLUTION SLIDER *******************************/ #content .journal-slider { margin-bottom: 20px; } .tp-loader { -webkit-animation: none !important; } .tp-caption { overflow: hidden; display: block; transition: color 0.15s, background-color 0.15s, border-color 0.15s, box-shadow 0.15s !important; text-align: left; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .tp-caption a, .tp-caption a:hover { color: inherit; } .tp-caption img { float: left; } .tp-bannertimer, .tp-bannertimer.tp-bottom { background-image: none; background-color: #EA2E49; height: 3px; z-index: 98; } .tp-banner-container .tparrows { z-index: -1; } .tp-banner-container:hover .tparrows { z-index: 100; } .nav-on-hover .tp-bullets, .nav-on-hover .tparrows { opacity: 0; } .nav-on-hover:hover .tp-bullets, .nav-on-hover:hover .tparrows { opacity: 1; } .tp-leftarrow, .tp-leftarrow.default, .tp-rightarrow, .tp-rightarrow.default { background-image: none; background-color: transparent; width: auto; height: auto; padding: 0; display: block; border-radius: 50%; color: white; transition: color 0.2s; } .tp-leftarrow:before, .tp-leftarrow.default:before, .tp-rightarrow:before, .tp-rightarrow.default:before { transition: color 0.2s; content: "\e093"; font-size: 40px; color: inherit; } .tp-rightarrow:before, .tp-rightarrow.default:before { content: "\e094"; } .tp-bullets .tp-leftarrow.round, .tp-bullets .tp-rightarrow.round { background-image: none; } .tp-bullets .tp-leftarrow.round:before, .tp-bullets .tp-rightarrow.round:before { font-size: 20px; top: -3px; } .slidelink.tp-hidden-caption { display: block !important; visibility: visible !important; top: 0; } .tp-bullets.simplebullets.round .bullet { background-color: transparent; background-image: none; transition: all .2s; margin-bottom: 2px; margin-left: 8px; width: 13px; height: 13px; -webkit-perspective: 1000; } .tp-bullets.simplebullets.round .bullet.selected, .tp-bullets.simplebullets.round .bullet:hover { background-color: transparent; } .tp-bullets.simplebullets.round .bullet:hover:after { content: ""; } .full-thumbs .tp-bullets.tp-thumbs { width: 100% !important; } .full-thumbs .tp-bullets.tp-thumbs .tp-mask { width: 100% !important; } .tp-bullets.tp-thumbs { width: auto !important; height: auto !important; padding: 0; overflow: hidden; background-color: transparent; } .tp-bullets.tp-thumbs .bullet { opacity: 1; position: relative; } .tp-bullets.tp-thumbs .bullet.selected:before, .tp-bullets.tp-thumbs .bullet:hover:before { opacity: 0; } .tp-bullets.tp-thumbs .bullet { position: relative; } .tp-bullets.tp-thumbs .bullet:before { content: ""; width: 100%; height: 100%; background-color: black; position: absolute; transition: opacity .2s; opacity: .3; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; } /****************************** SWIPER *******************************/ .swiper { position: relative; width: 100%; } .swiper-wrapper { transition-timing-function: ease-in-out; } .swiper-wrapper img { max-width: 100%; height: auto; } .swiper-hidden { visibility: hidden; } .swiper-slide, .swiper-wrapper { height: auto; } .swiper-pagination { width: 100%; position: relative; font-size: 0; padding: 5px; bottom: auto; } .swiper-pagination-bullet { opacity: 1; width: 10px; height: 10px; margin: 2px 3px; background: #EA2E49; transition: all 0.1s ease-out; } .swiper-pagination-bullet:hover { background: #3F5765; -webkit-transform: scale(1.2); transform: scale(1.2); } .swiper-pagination-bullet.swiper-pagination-bullet-active { background: #3F5765; } .swiper-button-prev, .swiper-button-next { color: #ccc; width: 40px; height: 40px; background-image: none; margin-top: 0; -webkit-transform: translateY(-50%); transform: translateY(-50%); transition: all 0.1s ease-out; } .swiper-button-prev::before, .swiper-button-next::before { font-family: 'journal-icons'; content: "\e60f"; font-size: 30px; position: absolute; top: 50%; left: 0; margin-left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .swiper-button-prev:hover, .swiper-button-next:hover { color: #3F5765; } .side-column .swiper-button-prev, .side-column .swiper-button-next { width: 30px; } .swiper-button-next::before { content: "\e60e"; } .swiper-button-next { right: 0; z-index: 2; } .swiper-button-prev { left: 0; z-index: 1; } html[dir="rtl"] .swiper-button-next { right: auto; left: 0; } html[dir="rtl"] .swiper-button-prev { left: auto; right: 0; } html[dir="rtl"] .swiper-button-prev::before, html[dir="rtl"] .swiper-button-next::before { -webkit-transform: scale(-1) translate(50%, 50%); transform: scale(-1) translate(50%, 50%); } /****************************** JOURNAL SLIDER *******************************/ .journal-simple-slider .swiper-wrapper { transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955); /* easeInOutQuad */ } .journal-simple-slider .swiper-wrapper img { width: 100%; } .journal-simple-slider .swiper-pagination { position: absolute; padding: 0; width: 100%; bottom: 10px; } .journal-simple-slider .swiper-button-prev, .journal-simple-slider .swiper-button-next { width: 40px; height: 50px; } .journal-simple-slider.nav-on-hover .swiper-button-prev, .journal-simple-slider.nav-on-hover .swiper-button-next, .journal-simple-slider.nav-on-hover .swiper-pagination { visibility: hidden; opacity: 0; transition: opacity 0.1s ease-out; } .journal-simple-slider.nav-on-hover:hover .swiper-button-prev, .journal-simple-slider.nav-on-hover:hover .swiper-button-next, .journal-simple-slider.nav-on-hover:hover .swiper-pagination { visibility: visible; opacity: 1; } .side-column .journal-simple-slider.box { background-color: transparent; } /****************************** CAROUSEL *******************************/ #content .journal-carousel .box-product { margin-right: 0; } html[dir="rtl"] .journal-carousel.arrows-top .swiper-button-prev, html[dir="rtl"] .journal-carousel.arrows-top .swiper-button-next { left: 0; right: auto; -webkit-transform: translate(0, 0) scale(-1); transform: translate(0, 0) scale(-1); } html[dir="rtl"] .journal-carousel.arrows-top .swiper-button-prev { left: 20px; right: auto; } .journal-carousel:not(.has-bullets) { margin-bottom: 20px; } .journal-carousel.bullets-on { margin-bottom: 10px; } .journal-carousel.arrows-top .swiper-button-prev, .journal-carousel.arrows-top .swiper-button-next { top: -60px; right: -5px; -webkit-transform: translate(0, 0); transform: translate(0, 0); background-color: transparent; } .journal-carousel.arrows-top .swiper-button-prev::before, .journal-carousel.arrows-top .swiper-button-next::before { font-size: 22px; } .journal-carousel.arrows-top .swiper-button-prev { right: 15px; left: auto; } .journal-carousel .product-grid-item { margin-bottom: 0; } .journal-carousel .product-grid-item .product-wrapper { margin: 0; -webkit-transform: translateZ(0) scale(1); transform: translateZ(0) scale(1); -webkit-backface-visibility: hidden; backface-visibility: hidden; } .journal-carousel .tab-content { padding: 0; margin-top: 0; background-color: transparent; margin-bottom: 0; overflow: visible; border: 0; z-index: 98; } .journal-carousel .htabs { margin-bottom: 20px; padding-left: 0; padding-right: 0; } .journal-carousel .htabs a { background-color: transparent; box-shadow: none; border-right-style: solid; border-right-width: 1px; border-color: #333745; color: inherit; transition: background-color 0.2s, color .2s; float: left; padding: 0 15px; } .journal-carousel .htabs.single-tab a, .journal-carousel .htabs.single-tab a.selected, .journal-carousel .htabs.single-tab a:hover { border: none; cursor: default; background-color: transparent; color: inherit; } .journal-carousel .htabs.single-tab a { padding: 0; } /****************************** FULLSCREEN SLIDER *******************************/ .journal-fullscreen-slider { position: fixed; width: 100%; height: 100%; padding: 0; top: 0; z-index: -1; } .journal-fullscreen-slider .tp-loader { display: none; } .transparent-overlay { background-repeat: repeat; position: absolute; width: 100%; height: 100%; z-index: 99; } #supersized { top: -12px; } /****************************** CUSTOM SECTIONS *******************************/ .section-brand .quickview-button, .section-category .quickview-button, .carousel-brand .quickview-button, .carousel-category .quickview-button { display: none; } .section-brand .product-details, .section-category .product-details, .carousel-brand .product-details, .carousel-category .product-details { padding-bottom: 0; } #top-modules .journal2_custom_sections::before, #bottom-modules .journal2_custom_sections::before { content: ""; width: calc(100% + 20px); width: -webkit-calc(100% + 20px); height: 40px; position: absolute; left: -20px; right: 0; } .gutter-on.custom-sections .box-content { margin-bottom: -20px; } html[dir="rtl"] #top-modules .journal2_custom_sections:before, html[dir="rtl"] #bottom-modules .journal2_custom_sections:before { width: 100%; } .box-heading.box-sections { padding: 0; border-width: 0; } .no-heading .product-grid { padding-top: 0; } .box-sections ul { margin: 0; padding: 0; display: table; width: 100%; table-layout: fixed; } .box-sections ul li { list-style: none; border-width: 0; border-right-width: 1px; border-style: solid; border-color: white; display: table-cell; } .box-sections ul li a { display: block; text-align: center; padding: 0 5px; font-size: inherit; transition: all .2s; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .box-sections ul li:last-of-type { border-right-width: 0; } .single-section .box-heading ul li a { cursor: default; padding-left: 10px; text-align: left; background-color: initial !important; pointer-events: none; } .single-section .box-heading ul li a:hover { background-color: inherit; } .isotope-item { z-index: 2; } .isotope-hidden.isotope-item { pointer-events: none; z-index: 0; } .isotope, .isotope .isotope-item { transition-duration: 0.7s; } .isotope { transition-property: height, width; } .isotope .isotope-item { transition-property: -webkit-transform, opacity; transition-property: transform, opacity; } .isotope.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition { transition-duration: 0s; } .oc-filter .panel-heading { padding: 0; height: 40px; margin-bottom: 5px; background-color: transparent; } .oc-filter a.list-group-item { border-bottom: 1px solid #f4f4f4; margin-bottom: 0; display: block; font-size: 15px; color: inherit; } .oc-filter .list-group-item { padding: 10px 0; } .oc-filter .list-group-item label { display: block; } /****************************** BANNER *******************************/ .banner { position: relative; margin: 0 auto; margin-bottom: -2px; } .banner div { text-align: center; display: none; margin: 0 auto; } .oc-banner .item img { max-width: 100%; height: auto; } .ie:not(.edge) .static-banners .box-content { display: block; } /****************************** FILTER MODULE *******************************/ #content .box-filter { display: block; overflow: hidden; width: 100%; position: relative; margin-top: -15px; border-bottom: 1px solid #dbdbdb; padding-bottom: 20px; } #content #button-filter { margin: 15px 0; float: right; } #content .box-filter > li { max-width: 200px; float: left; margin-right: 10px; } #content .box-filter > li > span { font-size: 15px; font-weight: bold; padding: 8px 8px 12px 8px; display: block; border-bottom: 1px solid #dbdbdb; margin-bottom: 8px; } #column-right .box-filter > li, #column-left .box-filter > li { min-height: 40px; width: 100%; display: table; } #column-right .box-filter > li > span, #column-left .box-filter > li > span { font-size: 15px; font-weight: bold; padding: 8px 8px 8px 0; min-height: 40px; display: block; padding-left: 15px; line-height: 1.5; border-bottom: 1px solid #dbdbdb; } #column-right #button-filter, #column-left #button-filter { margin: 15px; } #column-right .box-content .box-filter li ul, #column-left .box-content .box-filter li ul { display: block; padding-left: 10px; padding-top: 5px; } .filter-collapse .box.is-collapsed .box-content { display: none !important; } .filter-collapse .sf-icon { top: 8px; } .filter-collapse .sf-reset { right: 28px; } .filter-collapse .box-heading { cursor: pointer; } .filter-collapse .box-heading::after { content: "\e61d"; font-size: 12px; position: absolute; right: 9px; -webkit-transform: rotate(0deg); transform: rotate(0deg); } .filter-collapse .is-collapsed .box-heading::after { -webkit-transform: rotate(-90deg); transform: rotate(-90deg); } .side-column .journal-sf .box ul li label { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .firefox .journal-sf ul label img { box-sizing: content-box !important; } .sf-reset.sf-both { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } @media only screen and (max-width: 760px) { .filter-columns-mobile .journal-sf ul { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .filter-columns-mobile .journal-sf ul li { width: 50%; -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; } .filter-columns-mobile .journal-sf ul li:nth-last-of-type(2) { border-bottom-width: 0; } } /****************************** WELCOME MODULE *******************************/ .welcome { margin-bottom: 15px; } .welcome h1 { border-bottom: 1px solid transparent; padding-bottom: 4px; } .welcome p { font-weight: normal; font-size: 13px; padding-top: 5px; } .side-column .welcome { padding: 10px; margin-bottom: 0; clear: both; } .side-column .welcome h1 { margin-bottom: 8px; } /****************************** STORE PICKER *******************************/ #content .store-picker, .side-column .store-picker { padding: 10px 10px 0 10px; } #content .store-picker p, .side-column .store-picker p { text-align: left !important; padding: 0 0 5px 0; } #content .oc-store .box-heading, .side-column .oc-store .box-heading { margin-bottom: 10px; } #content .store-module, .side-column .store-module { padding: 0 10px; } #content .store-module p, .side-column .store-module p { margin-bottom: 5px; } #content .store-module a, .side-column .store-module a { display: inline-block; margin-top: 5px; } /****************************** CMS BLOCKS *******************************/ .cms-blocks, .static-banners { display: table; width: 100%; } .cms-blocks .blocks, .static-banners .blocks { margin-right: -20px; } .cms-blocks .box-heading, .static-banners .box-heading { margin-bottom: 20px; } .static-banners.journal-carousel { display: block; } .static-banners.journal-carousel > div { margin-right: 0; } .static-banners.journal-carousel .static-banner { overflow: hidden; margin-bottom: 0; padding-right: 0; } .static-banners.journal-carousel .static-banner .banner-overlay { right: 0; } .static-banners.journal-carousel .swiper { margin-bottom: 20px; } .static-banners.journal-carousel .swiper .swiper-button-prev, .static-banners.journal-carousel .swiper .swiper-button-next { margin-top: 0; } .static-banners.journal-carousel .box-content div.swiper-container { padding: 0; margin: 0; } .static-banners.journal-carousel .swiper-pagination { position: absolute; bottom: 2px; } .cms-block { position: relative; padding-right: 20px; margin-bottom: 20px; } .cms-block ul, .cms-block ol { padding: 10px 0 0 25px; margin: 0; } .cms-block img { max-width: 100% !important; } .cms-block video { max-width: 100%; height: auto; } .gecko .side-column img, .ie .side-column img { max-width: 200px; } .block-content { display: table; width: 100%; height: 100%; } .static-banners .box-content { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } p img { max-width: 100% !important; } .block-icon { text-align: center; -webkit-backface-visibility: hidden; } .block-icon i { margin: 0 !important; border-radius: inherit; } .block-icon i img { margin: 0 !important; } .block-icon-left { float: left; margin-right: 10px; } .block-icon-top { margin: 0 auto 10px auto; } /****************************** STATIC BANNERS *******************************/ .static-banners > div { margin-right: -20px; } .static-banner { position: relative; padding-right: 20px; margin-bottom: 20px; } .static-banner img { width: 100%; height: auto; float: left; } .static-banner .banner-overlay { position: absolute; top: 0; left: 0; bottom: 0; right: 20px; display: block; visibility: hidden; opacity: 0; transition: all 0.1s; } .static-banner .banner-overlay i { margin-right: 0 !important; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%) scale(0); transform: translate(-50%, -50%) scale(0); } .static-banner:hover .banner-overlay { visibility: visible; opacity: 1; } .static-banner:hover .banner-overlay i { -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); transition: all 0.15s ease-out; } .static-banner .block-content { display: block; } #content .static-banners { margin-bottom: 0; } /****************************** TEXT ROTATOR *******************************/ .journal-rotator { margin-bottom: 20px; } .text-rotator.bullets-on.bullets-center .quovolve-nav { bottom: -5px; } .rotator-image { margin: 15px; display: block; max-width: 85%; height: auto; float: left; position: relative; } .rotator-image.image-center { margin: 15px auto 0 auto !important; } .rotator-text { padding: 12px; display: block; line-height: 1.3; position: relative; font-weight: inherit; font-size: inherit; } .rotator-text > div { float: left; } .has-cta .rotator-text { display: inline-block; } .cta-center .rotator-text { display: block; margin-bottom: 5px; } .rotator-author { display: block; position: relative; padding: 0 15px; } .bullets-on .rotator-author { padding-bottom: 8px; } .bullets-on .quote { padding-bottom: 20px; } .bullets-off .rotator-author { margin-bottom: 10px; } .quovolve-nav { position: absolute; width: 100%; left: 0; bottom: 0; margin: 0; padding: 0; } .quovolve-nav ol { margin: 0; text-align: right; padding: 0 10px 7px 20px; } .quovolve-nav ol li { list-style: none; display: inline-block; } .headline-mode .quote.has-cta.cta-center { overflow: visible; } .headline-mode .rotator-text span:empty { padding: 0; } .quote { text-align: left; overflow: hidden; padding-bottom: 2px; } .quote .cta { position: relative !important; white-space: nowrap; } .quote .cta i { float: left; font-size: 1.1em; } .quote .cta.button-center { margin-bottom: 10px; } .quote.no-text { overflow: visible; } @media only screen and (max-width: 760px) { .headline-mode .rotator-text.line-through::before { width: 125%; } } .headline-mode .rotator-text { padding: 0; line-height: 1.1; } .headline-mode .rotator-text span { position: relative; display: inline-block; padding: 12px; } .headline-mode .rotator-text.line-through::before { content: ""; width: 150%; height: 1px; background: currentColor; position: absolute; top: 54%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); z-index: 0; } .headline-mode .quovolve-nav ol { padding-bottom: 2px; } .headline-mode .quote .button-icon-right i { margin-right: 0 !important; margin-left: 7px; float: right; } .headline-mode.align-left .quote > div { -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; } .headline-mode.align-right .quote > div { -webkit-box-pack: end; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end; } .bullets-left .quovolve-nav ol { text-align: left; } .bullets-center .quovolve-nav ol { text-align: center; } .bullets-right .quote { padding-bottom: 30px; } .bullets-right .quovolve-nav ol { text-align: right; } .nav-numbers a { color: transparent !important; background-color: transparent; width: 12px; height: 12px; display: inline-block; margin: 4px; text-decoration: none; transition: all 0.2s; -webkit-perspective: 1000; } .nav-numbers a:hover:after { content: ""; } /****************************** PHOTO GALLERY *******************************/ .journal-gallery .box-heading { margin-bottom: 15px; } .journal-gallery .box-content { margin-right: -15px; overflow: hidden; width: auto; } .journal-gallery.arrows-top .box-content { overflow: visible; } .journal-gallery.arrows-top .swiper-button-prev, .journal-gallery.arrows-top .swiper-button-next { top: -55px; } .journal-carousel .box-content { margin-right: 0; } .journal-carousel .gallery-thumb { padding-right: 0; margin-bottom: 0; } .oc-module { display: table; width: 100%; } .oc-module.oc-html { display: block; } .gallery-thumb { padding-right: 15px; margin-bottom: 15px; overflow: hidden; } .gallery-thumb a { display: block; position: relative; overflow: hidden; } .gallery-thumb a:before { content: "\e015"; position: absolute; font-size: 30px; color: white; z-index: 99; transition: all .2s; visibility: hidden; opacity: 0; padding: 0 2px; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%) scale(0); transform: translate(-50%, -50%) scale(0); } .gallery-thumb img { width: 100%; float: right; height: auto; border-radius: inherit; } .gallery-thumb .item-hover { position: absolute; z-index: 9; opacity: 0; visibility: hidden; width: 100%; height: 100%; text-align: center; overflow: hidden; transition: all .2s; border-radius: inherit; cursor: pointer; } .gallery-thumb > a:hover .item-hover { transition: all .2s; visibility: visible; opacity: 1; } .gallery-thumb > a:hover:before { opacity: 1; visibility: visible; -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); } /****************************** LightGallery *******************************/ .lg-backdrop { z-index: 99999; background-color: rgba(0, 0, 0, 0.9); } .lg-outer { z-index: 999999; } .lg-outer .lg-thumb-outer { text-align: center; } .lg-outer .lg-image { max-height: calc(100% - 100px); margin-top: 6px; } .lg-toolbar, .lg-sub-html { min-height: 50px; background-color: transparent; } .lg-toolbar .lg-icon { color: white; font-size: 28px; width: 45px; text-align: inherit; padding: 12px 0; transition: color .1s linear; } #lg-intense-zoom { position: absolute; right: 45px; width: 50px; height: 50px; top: 0; cursor: pointer; color: white; transition: all 0.1s ease-out; } #lg-intense-zoom::before { content: "\e015"; font-size: 21px; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } #lg-counter { color: #E4E4E4; font-size: 18px; } .lg-sub-html { padding: 13px 70px; line-height: 1.25; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .lg-sub-html > span { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .lg-actions .lg-next, .lg-actions .lg-prev { color: #E4E4E4; } .lg-icon::before, .lg-icon::after { font-family: 'lg'; } .lg-thumb.group { display: inline-block; } .lg-outer .lg-thumb-outer { background: black; } .lg-outer .lg-thumb-item { margin-bottom: 0; border: 3px solid #5F6874; border-radius: 1px; } .lg-outer .lg-thumb-item.active, .lg-outer .lg-thumb-item:hover { border-color: white; } .lg-outer .lg-thumb { padding: 12px 0; margin-bottom: 0; } .lg-outer .lg-toogle-thumb { height: 40px; top: -40px; width: 45px; color: #E4E4E4; } .lg-outer .lg-toogle-thumb:after { margin-top: 1px; } /****************************** ADVANCED GRID *******************************/ .multi-modules-wrapper { overflow: hidden; } .multi-modules-column { height: 100%; } .multi-modules-row { overflow: hidden; position: relative; } .tp-caption.fullscreenvideo { height: 100% !important; } .tp-caption.fullscreenvideo video { width: auto; background: transparent; } .multi-modules-row .tp-banner-container { height: 100% !important; max-width: 100% !important; } .multi-modules-row .tp-banner .slot, .multi-modules-row .tp-banner .slot div { width: 100% !important; height: 100% !important; } @media only screen and (max-width: 760px) { .multi-modules-column .multi-modules-row { margin-bottom: 20px; } #content .multi-modules .journal-slider { margin-bottom: 0; } .multi-modules-column:only-of-type > .multi-modules-row:only-of-type, .multi-modules-column:last-of-type > .multi-modules-row:last-of-type { margin-bottom: 0; } } .tp-banner .slot, .tp-banner .slot div { width: 100% !important; height: 100% !important; } .multi-modules .static-banners .box-heading { margin-right: 0; } #top-modules .multi-modules .static-banners, #bottom-modules .multi-modules .static-banners { padding: 0 !important; } .multi-modules { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .multi-modules .static-banner, .multi-modules .journal-simple-slider, .multi-modules .static-banners > div { margin: 0 !important; padding: 0 !important; } .multi-modules .static-banner .banner-overlay, .multi-modules .journal-simple-slider .banner-overlay, .multi-modules .static-banners > div .banner-overlay { right: 0; } .multi-modules .static-banner .journal-carousel, .multi-modules .journal-simple-slider .journal-carousel, .multi-modules .static-banners > div .journal-carousel { margin-bottom: 0; } .multi-modules .static-banners.journal-carousel { margin-bottom: 0; } .container-dimensions { position: absolute; top: 10px; left: 10px; padding: 5px; background: brown; color: white; z-index: 97; display: none; } .container-dimensions::after { font-size: 10px; content: "(Visible to admins only)"; display: none; } .multi-modules-row:hover .container-dimensions { display: block; } /****************************** NEWSLETTER *******************************/ .journal-newsletter { margin-bottom: 20px; } .journal-newsletter .box-content { border-radius: inherit; display: table; width: 100%; } .journal-newsletter input + .button { margin-top: 10px; } .journal-newsletter.text-left .box-content { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .journal-newsletter.text-left .newsletter-text { display: table-cell; vertical-align: middle; height: 100%; float: left; width: 50%; padding-right: 20px; text-align: left; line-height: 1.2; } .journal-newsletter.text-left .newsletter-input-wrap { display: block; position: relative; float: left; width: 50%; overflow: hidden; } .journal-newsletter.text-left .newsletter-input-wrap input { width: 100%; height: 100%; box-shadow: none; } .journal-newsletter.text-left .newsletter-input-wrap .newsletter-button { position: absolute; top: 0; right: 0; } .journal-newsletter.text-left .newsletter-input-wrap input + .button { margin-top: 0; } .journal-newsletter.text-top .newsletter-text { display: block; width: 100%; margin-bottom: 10px; text-align: left; line-height: 18px; } .journal-newsletter.text-top .newsletter-input-wrap { display: block; position: relative; width: 100%; } .journal-newsletter.text-top .newsletter-input-wrap input { width: 100%; height: 100%; box-shadow: none; border: 0; } .journal-newsletter.text-top .newsletter-input-wrap .newsletter-button { position: absolute; top: 5px; right: 3px; } .journal-newsletter.text-top .newsletter-input-wrap input + .button { margin-top: 0; } .side-column .journal-newsletter .newsletter-text { float: none; width: 100% !important; margin-bottom: 10px; padding: 0; } .side-column .journal-newsletter .newsletter-input-wrap { float: none; width: 100% !important; height: auto !important; text-align: center; } .side-column .journal-newsletter .newsletter-input-wrap input { margin-bottom: 5px; } .side-column .journal-newsletter .newsletter-input-wrap .newsletter-button { position: relative; left: auto !important; right: auto !important; width: 100%; } .side-column .journal-newsletter .newsletter-input-wrap input + .button { margin-top: 0; } /****************************** SUPER FILTER *******************************/ .main-products { position: relative; height: 100%; } .product-list .sf-loader { right: 0; } .sf-loader { min-height: 2000px; position: absolute; background-color: rgba(255, 255, 255, 0.7); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)" !important; font-size: 14px; z-index: 99; left: 0; top: 20px; right: 20px; bottom: 20px; overflow: hidden; } .sf-loader span { padding: 5px 10px; display: block; -webkit-font-smoothing: auto; } .side-column .journal-sf .box-filter > li { min-height: 0; } .sf-reset { position: absolute; right: 10px; top: 8px; z-index: 99; transition: color .2s; } .sf-reset .sf-reset-icon:after { font-size: 15px; } .sf-reset-icon:after { content: "\e601"; font-size: 14px; position: relative; margin-left: 5px; float: right; } .sf-text { right: 7px; } .sf-text .sf-reset-icon { display: none; } .sf-icon { top: 10px; } .sf-icon:before { border-top-color: #428bca; display: block; } .sf-icon:after { display: block; background-color: #428bca; padding: 6px 9px; } .sf-icon .sf-reset-text { display: none; } .sf-icon .sf-reset-icon:after { font-size: 20px; position: relative; margin-left: 1px; top: -2px; } .sf-price .ui-slider-horizontal { height: auto; } .sf-price .ui-widget-content { border: none; background: white; } .sf-price .ui-widget-header { background: #EA2E49; border: none; } .sf-price .ui-slider-handle { width: 16px; height: 16px; top: 0; cursor: pointer; background: #428bca; border: 0; border-radius: 0; transition: background 0.2s; } .sf-price .value { position: absolute; font-size: 11px; color: white; background: #428bca; top: 23px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); min-width: 36px; text-align: center; display: block; padding: 2px 3px; font-family: Helvetica, Arial, sans-serif; } .sf-price .value:after { content: ""; position: absolute; border: 7px solid transparent; border-bottom: 7px solid #428bca; border-radius: 0; top: -12px; left: 50%; margin-left: -7px; } .sf-price .price-range-both.value { min-width: 72px; margin: 0 0 0 -36px; top: 19px; } .sf-price .price-range-both { display: none; } .sf-price.sf-input .box-content { margin-bottom: 20px; padding: 12px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .sf-price.sf-input .box-content span { position: relative; display: inline-block; width: 49%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .sf-price.sf-input .box-content span:after { content: ""; display: table; clear: both; } .sf-price.sf-input .box-content span:first-of-type { padding-right: 5px; } .sf-price.sf-input .box-content span:last-of-type { padding-left: 5px; } .sf-price.sf-input .box-content span label { font-size: 16px; cursor: default; padding-right: 5px; line-height: 30px; float: left; } .sf-price.sf-input .box-content span input { float: left; width: 84%; max-height: 30px; } .sf-price.sf-input .box-content span.currency-right label { float: right; padding-right: 0; } .sf-price.sf-input .box-content span.currency-right input { width: 82%; } .sf-price.sf-input .box-content .button { display: block; width: 100%; margin-top: 10px; } .journal-sf { position: relative; } .journal-sf img { height: auto; } .journal-sf .box-content { display: block; overflow: auto; } .journal-sf .sf-price .box-content { overflow: visible; } .journal-sf:before { border-top-color: #428bca; display: block; } .journal-sf:after { display: block; background-color: #428bca; padding: 6px 9px; border-radius: 3px; } .journal-sf ul { border-radius: inherit; overflow: hidden; } .journal-sf ul li { border-bottom: 1px solid #333745; } .journal-sf ul li:last-of-type { border-bottom: none; } .journal-sf ul label { width: 100%; display: block; transition: color 0.2s; font-weight: normal; margin: 0; padding: 0; } .journal-sf ul label img { transition: border-color 0.1s; } .journal-sf ul label input[type=checkbox] { position: relative; margin: 0 5px 0 0; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .journal-sf ul.hide-checkbox label input[type=checkbox] { display: none; } .journal-sf .sf-both ul label img { vertical-align: middle; margin: 0 5px 0 22px; float: left; display: block; max-width: 42px; } .journal-sf .sf-both ul label .sf-name { line-height: 100%; vertical-align: middle; height: 42px; max-width: 135px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .journal-sf .sf-both ul label input[type=checkbox] { position: absolute; left: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .journal-sf .sf-both ul.hide-checkbox label img { margin-left: 0; } .journal-sf .sf-both ul.hide-checkbox label input[type=checkbox] { display: none; } .journal-sf .sf-image .box-content { overflow: hidden; overflow-y: auto; max-height: 310px; } .journal-sf .sf-image .box-content ul { display: block; } .journal-sf .sf-image .box-content ul li { border-bottom: none !important; float: left; width: 25%; padding: 0; padding-left: 0 !important; padding-top: 0 !important; } .journal-sf .sf-image .box-content ul label { width: 100%; display: block; } .journal-sf .sf-image .box-content ul label img { display: block; margin: 0; width: 100%; height: auto; } .journal-sf .sf-image .box-content ul label input[type=checkbox] { display: none; } .journal-sf .sf-image .box-content ul.hide-checkbox label input[type=checkbox] { display: none; } /****************************** POPUP *******************************/ .mfp-removing .journal-popup { opacity: 0; transition: all 0.2s ease-in-out; -webkit-transform: scale(0.7); transform: scale(0.7); } .mfp-removing.mfp-bg { opacity: 0; transition: all 0.2s ease-in-out; } .hide-close-button button { display: none; } .mfp-close { opacity: 1; transition: all 0.2s; } .quickview .journal-popup-header .heading-title { text-align: center; } .journal-popup { position: relative; background: white; margin: 0 auto; } .journal-popup img { max-width: 100%; height: auto; } .journal-popup .journal-newsletter { margin-bottom: 0; padding: 0 20px; } .journal-popup .journal-newsletter .box-content { padding: 0 !important; background-color: transparent !important; } .journal-popup .mfp-close { color: white; top: -38px; right: -16px; } .journal-popup * { box-sizing: border-box; } .journal-popup .journal-popup-header-content { text-align: center; border: 0; border-radius: 0; white-space: normal; padding: 10px; line-height: 1.3; } .journal-popup .button-icon-right i { float: right; margin-right: 0 !important; margin-left: 5px; } .journal-popup .journal-popup-header { border-radius: 0; } .journal-popup-content { overflow: hidden; color: #333745; } .journal-popup-content.overflow-on { overflow: auto; } @media only screen and (max-width: 760px) { .journal-popup-content.overflow-on { overflow-y: scroll; max-height: 50vh; -webkit-overflow-scrolling: touch; } } .journal-popup-header, .journal-popup-footer, .journal-popup-newsletter { display: table; width: 100%; } .journal-popup-header-content, .journal-popup-footer-content, .journal-popup-newsletter-content { display: table-cell; vertical-align: middle; text-align: center; } .journal-popup-footer-content { text-align: left; padding-left: 10px; background-color: #f4f4f4; position: relative; } .journal-popup-footer-content .button { margin: 8px 0; } .journal-popup-footer-content.has-btn { text-align: center; } .journal-popup-footer-content.has-btn .button:first-of-type { margin-right: 8px; } .journal-popup-footer-content.has-btn .dont-show-label { position: absolute; left: 5px; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .ie:not(.edge) .journal-popup-footer-content.has-btn .dont-show-label { -webkit-transform: translateY(0); transform: translateY(0); } .dont-show-label label { font-weight: normal; display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .dont-show-label input[type='checkbox'] { margin-right: 5px; position: relative; } .journal-popup input.has-error, .journal-popup textarea.has-error, .post-comment input.has-error, .post-comment textarea.has-error { border: 1px solid red; } /****************************** POPUP FORM *******************************/ .journal-popup-contact .content, .journal-popup-contact fieldset { padding: 15px; } .journal-popup-contact .content b, .journal-popup-contact fieldset b { display: inline-block; margin: 9px 0 4px 0; } .journal-popup-contact .content b:first-of-type, .journal-popup-contact fieldset b:first-of-type { margin-top: 0; } .journal-popup-contact .content b:last-of-type, .journal-popup-contact fieldset b:last-of-type { display: block; } .journal-popup-contact .content b:last-of-type + br, .journal-popup-contact fieldset b:last-of-type + br { display: none; } .journal-popup-contact .content textarea + br, .journal-popup-contact fieldset textarea + br { display: none; } .journal-popup-contact .content input[name='captcha'], .journal-popup-contact fieldset input[name='captcha'] { margin: 0 10px 0 0; height: 35px; display: block; float: left; } .journal-popup-contact input + br, .journal-popup-contact input + br + br { display: none; } .journal-popup-contact input[type='text'], .journal-popup-contact input[type='email'] { max-width: 600px; } .oc2 .journal-popup-contact .form-horizontal .form-group label { width: 100%; float: none; padding-top: 0; font-weight: bold; margin-bottom: 2px; } .oc2 .journal-popup-contact .form-horizontal .form-group label:before { display: none; } .oc2 .journal-popup-contact .form-horizontal .form-group label + div { width: 100%; float: none; } .oc2 .journal-popup-contact .pull-right { float: none; } /***************************** BLOG *******************************/ .journal-carousel .posts.box-content { display: block; } .journal-carousel > div.posts { overflow: visible; } .journal-carousel .post-button { margin-top: auto; } @media only screen and (max-width: 760px) { .journal-carousel { clear: both; } .journal-carousel .htabs a { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } } .blog-grid-view .post-button, .journal-carousel .post-button, .post-module .post-button { margin-top: auto; } .posts { margin: 20px -20px 0 0; text-align: center; } .posts h2 { padding: 10px 0 5px 0; display: table; width: 100%; margin: 0 0 5px 0; font-size: 16px; table-layout: fixed; font-weight: normal; } .posts h2 a { display: table-cell; vertical-align: middle; transition: color 0.2s; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .post-item-details.post-content-aligncenter, .post-button { text-align: center; } .post-item-details.post-content-aligncenter .comment-date, .post-button .comment-date { margin: 0 auto; } .post-item-details.post-content-alignright { text-align: right; } .post-item-details.post-content-alignright .comment-date { width: 100%; } html[dir="rtl"] .post-item-details.post-content-aligncenter, html[dir="rtl"] .post-button { text-align: center !important; } html[dir="rtl"] .post-item-details.post-content-aligncenter .comment-date, html[dir="rtl"] .post-button .comment-date { margin: 0 auto; } .post-module.journal-carousel.gutter-on { padding-bottom: 0 !important; } .post-item-details { text-align: center; overflow: hidden; } .blog-grid-view .post-wrapper .post-text { -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; } .post-content-alignright .post-button { -webkit-align-self: flex-end; -ms-flex-item-align: end; align-self: flex-end; } .post-content-aligncenter .post-button { -webkit-align-self: center; -ms-flex-item-align: center; align-self: center; } html[dir="rtl"] .post-button { text-align: right; } .post-image:after { content: ""; display: table; width: 100%; clear: both; } .post-image img { width: 100%; height: auto; float: left; } .post-item:not(.swiper-slide) { margin-bottom: 20px; } .post-wrapper { margin-right: 20px; transition: all 0.2s; } .swiper-container .post-wrapper { margin-right: 0; } .post-text { padding: 10px 0 10px 0; font-size: 14px; line-height: 17px; overflow: hidden; } .post-text span { display: block; } .post-view-more.button { margin: 5px 0 15px 0; padding: 10px; line-height: 100% !important; } .post-button-left-icon:before { margin-right: 5px; } .post-button-left-icon:before:before { transition: all 0.2s; } .post-button-right-icon { display: none; } .post-button-right-icon:before { transition: all 0.2s; margin-left: 5px; } .blog-list-view .post-view-more { margin: 5px 0 5px 0; } .comment-date { padding: 7px 0 8px 0; border-top: 1px solid #E4E4E4; border-bottom: 1px solid #E4E4E4; display: inline-block; color: #999; font-size: 12px; } .comment-date span { display: inline-block; position: relative; text-align: left; } .comment-date span:before { margin-right: 4px; position: relative; display: inline-block; font-size: 13px; } .p-author { margin-right: 7px; } .p-author:before { content: "\e1b8"; } .p-date { margin-right: 7px; } .p-date:before { content: "\e6b3"; } .p-comment:before { content: "\e1ae"; } .p-category a + span { display: inline-block !important; } .p-category a:last-of-type + span { display: none !important; } .p-category:before { content: "\e6b2"; } .p-category > a { transition: all 0.2s; margin-left: 5px; } .p-category > a:first-of-type { margin-left: 0; } .p-category > a:last-of-type + span { display: none; } .posts.blog-list-view { text-align: left; margin: 20px 0 0 0; display: table; width: 100%; } .posts.blog-list-view > div { width: 100% !important; } .posts.blog-list-view .post-image { float: left; padding-right: 15px; overflow: hidden; width: 33.333333%; } .posts.blog-list-view h2 { padding: 0; margin-top: 0; } .posts.blog-list-view h2 a { height: auto !important; display: block; white-space: normal; } .posts.blog-list-view h2 a span { display: inline-block; border-bottom: 1px solid #E4E4E4; padding: 0 0 7px 0; } .posts.blog-list-view .post-item-details { float: left; width: 66.666666%; padding: 0; text-align: left !important; } .posts.blog-list-view .post-wrapper { margin-right: 0; padding: 10px; } .posts.blog-list-view .post-text { padding: 10px 10px 8px 0; } .posts.blog-list-view .comment-date { padding: 5px 0; border: 0; } /****************************** Post Page *******************************/ .blog-post .heading-title { margin-bottom: 0; } .blog-post .post-stats { margin-bottom: 15px; padding: 10px 0 10px 0; } .blog-post .post-stats .p-posted { margin-right: 2px; } .blog-post .post-stats > span { margin-right: 10px; display: inline-block; clear: both; } .blog-post .post-stats > span:before { display: inline-block; margin-right: 4px; position: relative; float: left; } .blog-post .post-stats > span.p-category:before { margin-right: 6px; } .blog-post .post-stats.comment-date { border-width: 0; display: block; } .blog-post .social { border-top: 1px solid #EEEEEE; margin-top: 15px; clear: both; padding: 12px 8px 0 0; margin-bottom: 0; background-position: 0 center; background-color: inherit !important; background-image: none; } .blog-post .social-loaded { display: inline-block; display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; display: inline-flex; } .blog-post .tags { margin: 15px 10px 15px 0; font-size: 13px; } .blog-post .tags a, .blog-post .tags b { display: initial; border-radius: 0; transition: all 0.2s; margin-right: 4px; } .blog-post .tags a { display: inline-block; } @media only screen and (max-width: 760px) { .post-stats.comment-date { padding-bottom: 1px; } } .post-details { overflow: hidden; font-size: 14px; } .post-details img { max-width: 100%; height: auto; } .post-details:after { content: ""; display: table; width: 100%; clear: both; } .post-details .tags { line-height: initial; } blockquote { padding: 0 0 0 15px; border-width: 0; border-left: 10px solid #EA2E49; margin: 20px; line-height: 20px; font-style: italic; } .comments { margin-bottom: 0; font-size: 14px; line-height: 1.3; } .comments > .comment { color: #333745; position: relative; margin-top: 20px; padding: 13px 13px 7px 13px; } .comments > .comment p { font-size: 14px; } .comments > .comment:first-of-type { margin-top: 0; } .comments > .comment:nth-child(even) { background-color: #f4f4f4; } .comments > .comment:nth-child(odd) { background-color: #f4f4f4; } .comments > .comment:after { content: ""; } .comments > h3 { padding: 15px 0; font-size: 17px; } .comments .avatar { display: block; float: left; margin-right: 15px; margin-bottom: 0; } .comments .user-name { font-size: 18px; font-weight: bold; } .comments .user-date { margin: 2px 0 4px 0; font-size: 11px; color: #5F6874; } .comments .user-date:before { margin-right: 3px; position: relative; } .comments .user-time:before { margin-right: 3px; position: relative; } .comments .user-site { font-size: 13px; } .comments .reply-btn { position: absolute; top: 12px; right: 13px; line-height: 100%; padding: 8px 10px; } .comments .comment { position: relative; } .comments .comment > p { padding-bottom: 5px; } .comments .comment + .success { margin-top: 20px; color: #333745; } .comments .reply + .success { margin-top: 15px; margin-left: 85px; width: auto; } .comments .main-comment + .success { margin-top: 15px; } .comments .reply { position: relative; padding: 13px 13px 7px 13px; margin-left: 85px; margin-top: 15px; } .comments .reply:nth-of-type(even) { background-color: #e9e9e9; } .comments .reply:nth-of-type(odd) { background-color: #e9e9e9; } .comments .reply:after { content: ""; } .post-comment { margin-bottom: 20px; } .post-comment h3 { padding: 15px 0; font-size: 17px; } .comment-submit.button, .reply-submit.button { display: inline-block; margin-top: 10px; line-height: 100%; padding: 10px; } .comment-form form > div input { display: block; max-width: 350px; margin-bottom: 10px; } .reply .main-comment .button { display: none; } .reply-form { margin-left: 85px; } .reply-form h3 { border-bottom-width: 0; padding: 15px 0; } .reply-form .comment-form { padding: 0; background-color: transparent; } .has-error .form-control { border: 1px solid #EA2E49 !important; } .button.disabled { opacity: .7; cursor: wait; } /****************************** Blog Modules *******************************/ .side-posts .box-post { overflow: hidden; position: relative; } .post-module.no-heading .posts { margin-top: 0; } .post-module { display: table; width: 100%; } .post-module.journal-carousel { display: block; } .side-blog .box-post { padding: 10px 0 0 0; } .side-blog .box-category.box-post { padding: 0; } .side-post + hr { margin-bottom: 10px; background-color: transparent; border-bottom-width: 1px; border-bottom-style: solid; border-color: #f4f4f4; } .side-post { margin-bottom: 10px; overflow: hidden; } .side-post:after { content: ""; display: block; clear: both; } .side-post:last-of-type { margin-bottom: 0; } .side-post:last-of-type + hr { display: none; } .side-post .comment-date { border-bottom: none; border-top: none; display: block; width: 100%; padding: 0; } .side-post .p-comment { margin-right: 0; } .side-post .p-date { margin-right: 10px; } .side-post-details { float: left; width: 75%; } .side-post-image { width: 20%; display: block; float: left; overflow: hidden; margin-right: 5%; } .side-post-image img { width: 100%; height: auto; float: left; } .side-post-image:after { content: ""; display: table; clear: both; } .side-post-title { display: block; margin-bottom: 6px; transition: all 0.2s; } .blog-comments img { max-width: 55px; height: auto; } .blog-comments .p-user:before { display: block; float: left; } .comment-author:after { content: ""; display: table; clear: both; } .side-blog-tags .box-tag { overflow: hidden; } .side-blog-tags .box-tag > div { margin-bottom: -7px; overflow: hidden; } .side-blog-tags .box-tag a { float: left; display: block; background-color: #3F5765; color: white; margin: 0 6px 6px 0; padding: 3px 7px 5px 7px; transition: all 0.2s; } .side-blog-tags .box-tag a:hover { background-color: #5C8BA6; } .box-search { position: relative; height: 33px; } .box-search a { display: table; width: 33px; height: 100%; position: absolute; top: 0; right: 2px; transition: color 0.2s; padding-left: 1px; border-left-width: 1px; border-style: solid; border-color: #E4E4E4; } .box-search a:before { content: '\e697'; font-size: 18px; text-align: center; display: table-cell; vertical-align: middle; color: #ccc; } .column.posts { margin: 0; } .column.posts h3 { margin-bottom: 7px; } .column.posts > div { margin-bottom: 0; } .footer-post { padding: 6px 0; border-bottom-width: 1px; border-style: solid; border-color: transparent; } .footer-post .comment-date { padding: 5px 0 0 0; color: #E4E4E4; } .footer-post:after { content: ""; display: table; clear: both; } .footer-post:first-of-type { padding-top: 0; } .footer-post:last-of-type { border-bottom: 0; } .footer-post-image { display: block; overflow: hidden; float: left; margin-right: 10px; } .footer-post-title, .footer-post .comment-date { display: block; text-align: left; border-width: 0; transition: all 0.2s; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .footer-post .comment-date { font-size: 11px; padding: 3px 0 0 0; } .footer-post .comment-date span:before { font-size: 12px; } .journal-blog-feed { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); right: 0; transition: all 0.2s; color: #222; font-size: 13px; font-weight: 400; } .journal-blog-feed:before { content: "\e6b4"; color: #FF8000; margin-right: 5px; position: relative; float: left; font-size: inherit; } /****************************** HEADER NOTICE *******************************/ .header-notice { line-height: 1.25; font-size: 14px; position: relative; min-height: 15px; z-index: 9000; display: table; width: 100%; } .header-notice > div { margin: 0 auto; position: relative; } .header-notice i { margin-right: 8px !important; } .header-notice i:before { float: left; } .header-notice a { transition: all 0.2s; } .header-notice.floated-icon > div { padding-bottom: 10px; } .header-notice.floated-icon i { float: left; } .header-notice.floated-icon .notice-text { display: block; } .header-notice.center-notice { text-align: center; } .header-notice.center-notice .notice-text { margin-right: 50px; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } .header-notice.center-notice .notice-text span { -webkit-box-flex: 0; -webkit-flex-grow: 0; -ms-flex-positive: 0; flex-grow: 0; } .header-notice.center-notice i:before { float: none; } .header-notice.right-notice { text-align: right; } .header-notice.right-notice .notice-text { width: calc(100% - 100px); width: -webkit-calc(100% - 100px); margin-right: 50px; } .header-notice.right-notice i:before { float: none; } .header-notice.fullwidth-notice > div { max-width: 100%; padding: 10px 0 10px 15px; } .header-notice .notice-text { width: calc(100% - 40px); width: -webkit-calc(100% - 40px); display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .header-notice .notice-text i { -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; } .header-notice .notice-text span { -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; } button.close-notice { cursor: pointer; padding: 0 12px; height: 100%; position: absolute; top: 0; right: 0; font-size: 16px; transition: all 0.1s; border-radius: 0 !important; font-weight: 400; color: #333745; } button.close-notice:hover { color: #EA2E49; } button.close-notice::before { top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); position: absolute; } html[dir="rtl"] button.close-notice { right: auto; left: 0; } html[dir="rtl"] .header-notice i { margin-right: 0 !important; margin-left: 8px; } html[dir="rtl"] .header-notice i:before { float: left; } html[dir="rtl"] .header-notice.floated-icon i { float: right; } button.close-notice.x-icon:before { content: "\e602"; font-size: 24px; } @media only screen and (max-width: 760px) { .header-notice i { float: left; } } #content .journal-accordion { margin-bottom: 20px; } .journal-accordion .journal-accordion-heading { transition: all 0.05s ease-out; cursor: pointer; background-color: #f4f4f4; color: #444; border-bottom-color: #E4E4E4; padding: 12px; } .journal-accordion .journal-accordion-heading::after { color: inherit; background: none; content: "\e620"; font-size: 11px; position: absolute; right: 5px; width: auto; height: auto; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); transition: all 0.05s ease-out; } .journal-accordion [data-accordion].open > .journal-accordion-heading::after { -webkit-transform: rotate(90deg); transform: rotate(90deg); margin-top: -3px; } .journal-accordion .journal-accordion-content { background: #EEEEEE; color: #333; } .journal-accordion .journal-accordion-content > * { border-bottom: 0; padding: 0; } .journal-accordion .journal-accordion-content > div { padding: 13px; line-height: 1.4; } /****************************** Firefox *******************************/ .firefox .dont-show-label input[type='checkbox'] { margin-left: 10px; } .firefox .journal-popup-footer-content .button { line-height: 39px; } .firefox .tp-caption { outline: 1px solid transparent; } .firefox .comment-date span:before { margin-top: -2px; } .safari .html5vid { top: 0 !important; height: 100% !important; width: 100% !important; } .safari .html5vid video { -o-object-fit: cover; object-fit: cover; } .ie:not(.edge) .safari5 .main-products { width: 100%; display: table; }