Current Path : /var/test/www/foundation/wp-content/themes/kallyas/css/ |
Current File : /var/test/www/foundation/wp-content/themes/kallyas/css/template.css |
/* ============================================================================= // TABLE OF CONTENTS // BASE ---- HTML DEFAULTS ---- UTILITIES ---- MISC // =========================================================================== */ body { font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 13px; line-height: 1.7; color: #535353; background-color: #f5f5f5; } h1, h2, h3, h4, h5, h6 { font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: bold; } p { margin: 0 0 20px; } iframe { border: 0; } a { color: #000; } a:hover { color: #cd2122; text-decoration: none; } a:focus { outline: none; text-decoration: none; color: initial; text-shadow: none; } blockquote { margin: 25px 40px; } legend { padding-bottom: 10px; } /* Eventually this should be removed */ img { max-width: 100%; height: auto; } /* Iframes/Embeds */ iframe, object, embed { max-width: 100%; } /* Text Custom Default */ .text-custom { color: #cd2122; } /* Dark colored styles */ body.kl-skin--dark { color: #c6c6c6; background-color: #1A1A1A; } .kl-skin--dark a { color: #fff; } .kl-skin--dark code { background-color: #040404; } .kl-skin--dark pre { color: #E0E0E0; background-color: #171717; border: 1px solid #2D2D2D; } .kl-skin--dark hr { border-top: 1px solid #3E3E3E; } .kl-skin--dark blockquote { border-left: 5px solid #444; } .kl-skin--dark .blockquote-reverse, .kl-skin--dark blockquote.pull-right { border-right: 5px solid #444; } /* Form Control */ .kl-skin--dark .form-control:not(.form-control--light), .element-scheme--dark .form-control { color: #D0D0D0; background-color: #111; border: 1px solid #2D2D2D; box-shadow: inset 1px 2px 0 rgba(0, 0, 0, 0.85); } .kl-skin--dark .form-control:not(.form-control--light):focus, .element-scheme--dark .form-control:focus { border-color: rgba(132, 132, 132, 0.26); box-shadow: inherit; } .kl-skin--dark legend { color: #B3B3B3; border-bottom-color: #3B3B3B; } /* Use fixclear class on parent to clear nested columns */ .fixclear:after, .fixclear:before, .clear:after, .clear:before, .site-footer .menu:after, .site-footer .menu:before { display: table; content: " "; } .fixclear:after, .clear:after, .site-footer .menu:after { clear: both; } .kl-input-text-dark { box-shadow: rgba(255, 255, 255, 0.1) 0 1px 0, rgba(0, 0, 0, 0.8) 0 1px 7px 0px inset; background: #202020; background-color: rgba(0, 0, 0, 0.3); } ul[class*="list-style"] { margin-left: 0; padding-left: 0; list-style: none; } ul[class*="list-style"] li:before { margin-right: 10px; display: inline-block; font-family: "Glyphicons Halflings"; font-style: normal; font-weight: 400; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } ul.list-style1 li:before { content: "\e072"; font-size: 8px; opacity: .7; } ul.list-style2 li:before { content: "\e013"; opacity: 0.6; } ul.list-style3 li:before { content: "\e029"; opacity: 0.6; } ul.list-style4 li:before { content: "\e080"; opacity: 0.6; } ul.list-style5 li:before { content: "\e081"; opacity: 0.6; } ul.list-style6 li:before { content: "\e158"; opacity: 0.6; } ul.colored-list li:before { opacity: 1; } /* Equalizer classes used for first or last elements in a row to align to fixed-width containers of the page, from inside of a full-width section */ @media (min-width: 768px) { .zn_col_eq_first { padding-left: calc((100vw - 750px) / 2); } .zn_col_eq_last { padding-right: calc((100vw - 750px) / 2); } } @media (min-width: 992px) { .zn_col_eq_first { padding-left: calc((100vw - 970px) / 2); } .zn_col_eq_last { padding-right: calc((100vw - 970px) / 2); } } @media (min-width: 1200px) { .zn_col_eq_first { padding-left: calc((100vw - 1170px) / 2); } .zn_col_eq_last { padding-right: calc((100vw - 1170px) / 2); } } body.boxed .zn_col_eq_first { padding-left: 0; } body.boxed .zn_col_eq_last { padding-right: 0; } /* Five Columns (12/5=2.4) */ .col-sm-1-5, .col-xs-1-5, .col-md-1-5, .col-lg-1-5, .col-sm-24, .col-xs-24, .col-md-24, .col-lg-24 { position: relative; min-height: 1px; padding-left: 15px; padding-right: 15px; } .col-xs-1-5 { width: 20%; float: left; } @media (min-width: 768px) { .col-sm-1-5, .col-sm-24 { width: 20%; float: left; } } @media (min-width: 992px) { .col-md-1-5, .col-md-24 { width: 20%; float: left; } } @media (min-width: 1200px) { .col-lg-1-5, .col-lg-24 { width: 20%; float: left; } } /* Gutter Sizes - Large */ .row.gutter-lg { margin-right: -40px; margin-left: -40px; } .row.gutter-lg > [class*="col-"] { padding-right: 40px; padding-left: 40px; } /* Gutter Sizes - Medium */ .row.gutter-md { margin-right: -25px; margin-left: -25px; } .row.gutter-md > [class*="col-"] { padding-right: 25px; padding-left: 25px; } /* Gutter Sizes - Small */ .row.gutter-sm { margin-right: -10px; margin-left: -10px; } .row.gutter-sm > [class*="col-"] { padding-right: 10px; padding-left: 10px; } /* Gutter Sizes - Extra small */ .row.gutter-xs { margin-right: -5px; margin-left: -5px; } .row.gutter-xs > [class*="col-"] { padding-right: 5px; padding-left: 5px; } /* Gutter Sizes - zero gutter */ .row.gutter-0 { margin-right: 0; margin-left: 0; } .row.gutter-0 > [class*="col-"] { padding-right: 0; padding-left: 0; } /* Snippet for vertically centering childs (this class should be appended to the absolute parent) */ .flex-vcenter { 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-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; } /* TOOLTIP FADE */ .fade { opacity: 0; -webkit-transition: opacity 0.15s linear; transition: opacity 0.15s linear; } .fade.in { opacity: 1; } /* Bordered Tooltip Text */ .stronger[data-rel="tooltip"] { font-weight: 600; border-bottom: 1px dotted rgba(255, 255, 255, 0.5); padding-bottom: 2px; cursor: help; } /* Utilitites */ /* css transitions - reducing transitions lines */ .u-trans-all-2s, #sidebar ul.menu li a, div.widget ul.menu li a, [id*='sidebar-widget-'] ul.menu li a { -webkit-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } .zn_ovhidden { overflow: hidden; } .zn_ovauto { overflow: auto; overflow-x: hidden; } .round-corners { border-radius: 3px; } /* Circled Icon */ .circled-icon { display: inline-block; border-radius: 50%; width: 46px; height: 46px; line-height: 46px; box-sizing: content-box; text-align: center; position: relative; vertical-align: middle; border-width: 2px; border-style: solid; border-color: currentColor; } .circled-icon:before { vertical-align: middle; display: block; line-height: 46px; } .circled-icon.ci-xsmall { width: 22px; height: 22px; line-height: 22px; } .circled-icon.ci-xsmall:before { line-height: 23px; } .circled-icon.ci-small { width: 36px; height: 36px; line-height: 36px; } .circled-icon.ci-small:before { line-height: 36px; } .circled-icon.ci-medium { width: 56px; height: 56px; line-height: 56px; } .circled-icon.ci-medium:before { line-height: 56px; } .circled-icon.ci-large { width: 76px; height: 76px; line-height: 76px; } .circled-icon.ci-large:before { line-height: 76px; } .circled-icon.ci-faded { border-color: rgba(255, 255, 255, 0.5); } .circled-icon--light { color: #fff; } /* Button triggering modal video for background-video elements */ .bg-video-mobile-modal { display: block; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); top: 0; z-index: 99; color: #fff; border: 2px solid currentColor; border-top: 0; padding: 0 10px; border-radius: 0 0 5px 5px; height: 40px; line-height: 40px; background: rgba(0, 0, 0, 0.15); font-size: 10px; font-weight: 700; font-family: Helvetica,Arial,sans-serif; vertical-align: middle; } .bg-video-mobile-modal:after { content: attr(data-text); display: inline-block; margin-left: 10px; } .bg-video-mobile-modal:hover, .bg-video-mobile-modal:focus { color: #fff; } /* Font weight helpers */ .fw-thin { font-weight: 300 !important; } .fw-normal { font-weight: 400 !important; } .fw-semibold { font-weight: 600 !important; } .fw-bold { font-weight: 700 !important; } .fw-extrabold { font-weight: 800 !important; } /* Font sizes helpers */ .fs-smaller { font-size: 70% !important; } .fs-small { font-size: 90% !important; } .fs-big { font-size: 110% !important; } .fs-bigger { font-size: 140% !important; } .fs-large { font-size: 200% !important; } /* Letter spacing */ .lt-spacing-1 { letter-spacing: 1px !important; } .lt-spacing-2 { letter-spacing: 2px !important; } .lt-spacing-3 { letter-spacing: 3px !important; } .lt-spacing-5 { letter-spacing: 5px !important; } .lt-spacing-10 { letter-spacing: 10px !important; } /* Letter spacing - Negative */ .lt-spacing-neg-1 { letter-spacing: -1px !important; } .lt-spacing-neg-2 { letter-spacing: -2px !important; } .lt-spacing-neg-3 { letter-spacing: -3px !important; } .lt-spacing-neg-5 { letter-spacing: -5px !important; } .lt-spacing-neg-10 { letter-spacing: -10px !important; } /* Opacity helpers */ .opacity0, .hov-opacity0:hover { opacity: 0 !important; } .opacity1, .hov-opacity1:hover { opacity: .1 !important; } .opacity2, .hov-opacity2:hover { opacity: .2 !important; } .opacity3, .hov-opacity3:hover { opacity: .3 !important; } .opacity4, .hov-opacity4:hover { opacity: .4 !important; } .opacity5, .hov-opacity5:hover { opacity: .5 !important; } .opacity6, .hov-opacity6:hover { opacity: .6 !important; } .opacity7, .hov-opacity7:hover { opacity: .7 !important; } .opacity8, .hov-opacity8:hover { opacity: .8 !important; } .opacity9, .hov-opacity9:hover { opacity: .9 !important; } .opacity10, .hov-opacity10:hover { opacity: 1 !important; } .kl-icon-white { color: #fff; } /* to uppercase */ .uppercase { text-transform: uppercase; } /* Flip an icon, either vertical or horizontal */ .flipX-icon:before { -webkit-transform: scaleX(-1); transform: scaleX(-1); display: inline-block; } .flipY-icon:before { -webkit-transform: scaleY(-1); transform: scaleY(-1); display: inline-block; } /* Vertical alignment utilities */ .u-v-mid { vertical-align: middle; } .u-v-top { vertical-align: top; } .u-v-bottom { vertical-align: bottom; } /* Float Clears */ .u-clear-right { clear: right; } .u-clear-left { clear: left; } .u-clear-none { clear: none; } /* XXS Utilities, used for small screens -480px */ .visible-xxs { display: none !important; } .hidden-xxs { display: block !important; } @media (max-width: 480px) { .visible-xxs { display: block !important; } .hidden-xxs { display: none !important; } } /* Z-indexes */ .u-zindex-1, .u-zindex-2, .u-zindex-3, .u-zindex-5, .u-zindex-10 { position: relative; } .u-zindex-1 { z-index: 1; } .u-zindex-2 { z-index: 2; } .u-zindex-3 { z-index: 3; } .u-zindex-5 { z-index: 5; } .u-zindex-10 { z-index: 10; } /* Object Fit */ .cover-fit-img { -o-object-fit: cover; object-fit: cover; overflow: hidden; } .cover-fit-img-fallback { background-size: contain; background-position: center center; background-repeat: no-repeat; } .cover-fit-img-fallback > img { opacity: 0 !important; } /* Contain Object Fit */ .contain-fit-img { -o-object-fit: contain; object-fit: contain; overflow: hidden; } .contain-fit-img-fallback { background-size: contain; background-position: center center; background-repeat: no-repeat; } .contain-fit-img-fallback > img { opacity: 0 !important; } /* used in several sliders */ .zn-shadow-lifted { box-shadow: 0 40px 20px -25px rgba(0, 0, 0, 0.25); } /* Hacks */ .animateme { will-change: transform; } /* Small hack for icon font */ [data-zniconfam]:before, [data-zniconfam] { font-style: normal; font-weight: 400; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /* Reset line height */ .reset-line-height { line-height: 1; } /* Mandatory WordPress classes */ .aligncenter { display: block; margin: 0 auto; } .alignright { float: right; margin: 0 0 10px 20px; } .alignleft { float: left; margin: 0 20px 10px 0; } .floatleft { float: left; } .floatright { float: right; } .align-center, .textcenter { text-align: center; } .align-right, .textright { text-align: right; } .textleft { text-align: left; } /* Margins Bottom */ .u-mb-0 { margin-bottom: 0 !important; } .u-mb-10 { margin-bottom: 10px !important; } .u-mb-20 { margin-bottom: 20px !important; } .u-mb-30 { margin-bottom: 30px !important; } .u-mb-50 { margin-bottom: 50px !important; } /* Margins Top */ .u-mt-0 { margin-top: 0 !important; } .u-mt-10 { margin-top: 10px !important; } .u-mt-20 { margin-top: 20px !important; } .u-mt-30 { margin-top: 30px !important; } .u-mt-50 { margin-top: 50px !important; } .znBoxShadow-1, .znBoxShadow--hov-1:hover { box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); } .znBoxShadow-2, .znBoxShadow--hov-2:hover { box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23); } .znBoxShadow-3, .znBoxShadow--hov-3:hover { box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); } .znBoxShadow-4, .znBoxShadow--hov-4:hover { box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22); } .znBoxShadow-5, .znBoxShadow--hov-5:hover { box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22); } .znBoxShadow-6, .znBoxShadow--hov-6:hover { box-shadow: 0 40px 120px -20px rgba(0, 0, 0, 0.6); } .znBoxShadow--hover { -webkit-transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); } /* MISC Styles */ /* Iframes In site-content */ .site-content iframe { max-width: 100%; } .site-content .fb-like iframe { max-width: none; } .fb-like iframe { max-width: inherit; } /* Facebook Comments */ .fb-comments, .fb-comments span, .fb-comments iframe { width: 100% !important; max-width: inherit; } /* Just in case.. */ body[class*="span"] { float: none; margin-left: 0; } .parallax-mirror, .parallax-mirror .parallax-slider { will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .th-spacer { height: 30px; } /* ============================================================================= // TABLE OF CONTENTS // GENERAL ---- PAGE WRAPPER ---- PAGE PRELOADER (Option dependent) ---- BOXED VERSION STYLES ---- SITE CONTENT ---- PAGE TITLES ---- TITLES, MTITLES, CIRCLETITLE ---- HOVER BORDER ---- FORMS & FANCY FORM STYLES ---- PAGINATION ---- SEARCH FORM ---- BUTTONS ---- SOCIAL ICONS ---- SIDEBAR ---- FAKE LOADING ---- KL-VIDEO BACKGROUND ---- MAGNIFIC POPUP ---- TO TOP ---- TO NEXT BUTTON ---- COUNTER ---- IMAGE GALLERY ---- Element Appear - Fade In ---- PlayVideo button ---- Animated Circle Play button ---- Background source for elements ---- FlexBox grid toolkit // =========================================================================== */ /* PAGE WRAPPER */ #page_wrapper { position: relative; overflow: hidden; min-height: 100vh; z-index: 0; } /* PAGE PRELOADER */ #page-loading { background-color: #fff; position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 999999; 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-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } /*-- Pulsating Circle --*/ .preloader-pulsating-circle { width: 42px; height: 42px; border: 2px solid currentColor; border-radius: 30px; opacity: 0; -webkit-animation: preloader-pulsating-circle 1s ease-out; animation: preloader-pulsating-circle 1s ease-out; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } @-webkit-keyframes preloader-pulsating-circle { 0% { -webkit-transform: scale(0.1); transform: scale(0.1); opacity: 0.0; } 50% { opacity: 1; } 100% { -webkit-transform: scale(1.2); transform: scale(1.2); opacity: 0; } } @keyframes preloader-pulsating-circle { 0% { -webkit-transform: scale(0.1); transform: scale(0.1); opacity: 0.0; } 50% { opacity: 1; } 100% { -webkit-transform: scale(1.2); transform: scale(1.2); opacity: 0; } } /*-- Circle Spinner --*/ .preloader-material-svg { -webkit-animation: preloader-material-svg 1.4s linear infinite; animation: preloader-material-svg 1.4s linear infinite; } @-webkit-keyframes preloader-material-svg { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(270deg); transform: rotate(270deg); } } @keyframes preloader-material-svg { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(270deg); transform: rotate(270deg); } } .preloader-material-circle { stroke-dasharray: 187; stroke-dashoffset: 0; -webkit-transform-origin: center; transform-origin: center; -webkit-animation: preloader-material-dash-anim 1.4s ease-in-out infinite, preloader-material-colors-anim 5.6s ease-in-out infinite; animation: preloader-material-dash-anim 1.4s ease-in-out infinite, preloader-material-colors-anim 5.6s ease-in-out infinite; color: #cd2122; } @-webkit-keyframes preloader-material-colors-anim { 0% { stroke: #000; } 25% { stroke: currentColor; } 50% { stroke: #000; } 75% { stroke: currentColor; } 100% { stroke: #000; } } @keyframes preloader-material-colors-anim { 0% { stroke: #000; } 25% { stroke: currentColor; } 50% { stroke: #000; } 75% { stroke: currentColor; } 100% { stroke: #000; } } @-webkit-keyframes preloader-material-dash-anim { 0% { stroke-dashoffset: 187; } 50% { stroke-dashoffset: 46.75; -webkit-transform: rotate(135deg); transform: rotate(135deg); } 100% { stroke-dashoffset: 187; -webkit-transform: rotate(450deg); transform: rotate(450deg); } } @keyframes preloader-material-dash-anim { 0% { stroke-dashoffset: 187; } 50% { stroke-dashoffset: 46.75; -webkit-transform: rotate(135deg); transform: rotate(135deg); } 100% { stroke-dashoffset: 187; -webkit-transform: rotate(450deg); transform: rotate(450deg); } } /*-- Perspective Animation --*/ .kl-pageLoading--yes_persp { -webkit-perspective: 120; perspective: 120; } .preloader-perspective-anim { width: 40px; height: 40px; box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.15); margin-top: -20px; margin-left: -20px; -webkit-animation: preloader-perspective-anim 1.2s infinite ease-in-out; animation: preloader-perspective-anim 1.2s infinite ease-in-out; border-radius: 3px; } @-webkit-keyframes preloader-perspective-anim { 0% { -webkit-transform: rotateX(0deg) rotateY(0deg); transform: rotateX(0deg) rotateY(0deg); } 50% { -webkit-transform: rotateX(-180.1deg) rotateY(0deg); transform: rotateX(-180.1deg) rotateY(0deg); } 100% { -webkit-transform: rotateX(-180deg) rotateY(-179.9deg); transform: rotateX(-180deg) rotateY(-179.9deg); } } @keyframes preloader-perspective-anim { 0% { -webkit-transform: rotateX(0deg) rotateY(0deg); transform: rotateX(0deg) rotateY(0deg); } 50% { -webkit-transform: rotateX(-180.1deg) rotateY(0deg); transform: rotateX(-180.1deg) rotateY(0deg); } 100% { -webkit-transform: rotateX(-180deg) rotateY(-179.9deg); transform: rotateX(-180deg) rotateY(-179.9deg); } } /*-- Image Perspective Animation --*/ .kl-pageLoading--yes_img_persp { -webkit-perspective: 250; perspective: 250; } .preloader-perspective-img { -webkit-animation: preloader-perspective-img 2s infinite ease-in-out; animation: preloader-perspective-img 2s infinite ease-in-out; } @-webkit-keyframes preloader-perspective-img { 0% { -webkit-transform: rotateY(0deg); transform: rotateY(0deg); } 50% { -webkit-transform: rotateY(180deg); transform: rotateY(180deg); } 100% { -webkit-transform: rotateY(360deg); transform: rotateY(360deg); } } @keyframes preloader-perspective-img { 0% { -webkit-transform: rotateY(0deg); transform: rotateY(0deg); } 50% { -webkit-transform: rotateY(180deg); transform: rotateY(180deg); } 100% { -webkit-transform: rotateY(360deg); transform: rotateY(360deg); } } /*-- Image Breath Animation --*/ .preloader-breath-img { -webkit-animation-name: preloader-breath-img; animation-name: preloader-breath-img; -webkit-animation-duration: 1800ms; animation-duration: 1800ms; -webkit-animation-delay: 200ms; animation-delay: 200ms; -webkit-animation-timing-function: cubic-bezier(0.73, 0.005, 0.42, 1.005); animation-timing-function: cubic-bezier(0.73, 0.005, 0.42, 1.005); -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-direction: alternate; animation-direction: alternate; } @-webkit-keyframes preloader-breath-img { from { opacity: .2; } to { opacity: 1; } } @keyframes preloader-breath-img { from { opacity: .2; } to { opacity: 1; } } /* BOXED VERSION */ body.boxed #page_wrapper { width: 1000px; border-left: 3px solid #fff; border-right: 3px solid #fff; margin: 0 auto; background: #f5f5f5; box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); } body.boxed .site-header { width: 100%; } @media screen and (max-width: 991px) { body.boxed #page_wrapper { width: 100%; border: 0; } } @media screen and (min-width: 992px) { /* Boxed on 960px width layout */ body.boxed.res960 #page_wrapper { width: 1000px; } /* Header Sticky and Boxed Layout (both) */ body.boxed .site-header.header--sticky, body.boxed.res960 .site-header.header--sticky { width: 994px; } } @media screen and (min-width: 1200px) { /* Boxed layout */ body.boxed #page_wrapper { width: 1200px; } /* Header Sticky and Boxed Layout */ body.boxed .site-header.header--sticky { width: 1194px; } } /* SITE CONTENT */ .site-content { position: relative; margin-top: 60px; } .site-header.site-header--absolute + .site-content { padding-top: 200px; margin-top: 0; } @media screen and (max-width: 767px) { .site-header.site-header--absolute + .site-content { padding-top: 80px; } } /* Content Page */ #th-content-page { padding-bottom: 60px; } /* PAGE TITLES */ .page-title, .subtitle { line-height: 1.4; margin-bottom: 25px; padding-bottom: 25px; } .page-title { font-size: 26px; margin-top: 0; border-bottom-width: 1px; border-bottom-style: solid; } .subtitle { font-size: 36px; font-weight: 300; } .kl-skin--light .page-title, .kl-skin--light .subtitle { border-bottom-color: #cbcbcb; } .kl-skin--light .page-title { color: #050505; } .kl-skin--light .subtitle { color: #595959; } .kl-skin--dark .page-title, .kl-skin--dark .subtitle { border-bottom-color: rgba(255, 255, 255, 0.1); } .kl-skin--dark .page-title { color: #DEDEDE; } .kl-skin--dark .subtitle { color: #989898; } /* MODS TITLES */ .m_title { margin-top: 0; color: #cd2122; } .m_title_ext { font-size: 18px; line-height: 1.4; } /* HOVER BORDER */ .hoverBorder h6, .hoverBorder:hover img { -webkit-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } .hoverBorder { position: relative; display: inline-block; margin-bottom: 25px; } .hoverBorder h6 { position: relative; z-index: 1; } .hoverBorder img { max-width: 100%; box-sizing: border-box; border-radius: 2px; width: 100%; position: relative; } .hoverBorder:hover img { border-radius: 2px; opacity: 0.8; } .hoverBorder:after { content: ''; position: absolute; left: 0; top: 0; bottom: 0; right: 0; border-radius: 3px; box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.15) inset; -webkit-transition: box-shadow 0.2s ease-out, background-color 0.2s ease-out; transition: box-shadow 0.2s ease-out, background-color 0.2s ease-out; } .hoverBorder:hover:after { box-shadow: 0 0 0 5px #cd2122 inset; } .plus.hoverBorder:before { content: "\002b"; opacity: 0; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); border-radius: 3px; -webkit-transition: opacity 0.2s ease-out; transition: opacity 0.2s ease-out; font-family: "Glyphicons Halflings"; font-style: normal; font-weight: 400; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; z-index: 1; color: #fff; font-size: 22px; } .plus.hoverBorder:hover:after { background-color: rgba(35, 35, 35, 0.5); } .plus.hoverBorder:hover:before { opacity: 1; } /* FORMS */ .form-control:focus { border-color: rgba(0, 0, 0, 0.26); box-shadow: inherit; } .cf--dark .form-control:focus { border-color: rgba(255, 255, 255, 0.26); } textarea.form-control { width: 100%; max-width: 100%; } .kl-radio-group-wrapper.is-inline > .kl-material-form-label { display: block; margin-bottom: 10px; } .kl-radio-field-group { margin-bottom: 15px; vertical-align: middle; } .kl-radio-group-wrapper.is-inline .kl-radio-field-group { display: inline-block; margin-right: 20px; margin-bottom: 0; } .kl-radio-field-group input { margin-right: 8px; vertical-align: middle; } .kl-radio-field-group label { margin: 2px 0 0; vertical-align: middle; } /* FANCYFORMS */ .kl-fancy-form { position: relative; } .kl-fancy-form-label { color: #969696; font-size: 10px; text-transform: uppercase; position: absolute; top: 6px; left: 16px; cursor: text; -webkit-transition: all .25s ease; transition: all .25s ease; } .kl-fancy-form-input:focus + .kl-fancy-form-label, .kl-fancy-form-textarea:focus + .kl-fancy-form-label { color: #c0c0c0; } .kl-fancy-form .form-control { padding: 26px 16px 6px 16px; height: auto; } .kl-fancy-form.zn_cf_radio .kl-fancy-form-label { position: static; margin-bottom: 15px; } /* Selectbox fix for Chrome/Safari on OSX */ @media screen and (-webkit-min-device-pixel-ratio: 0) { .kl-fancy-form-select { height: 52px; -webkit-appearance: none; -moz-appearance: none; appearance: none; box-shadow: inset 1px 2px 0 rgba(0, 0, 0, 0.06); background-image: url(../images/select-arrow.svg); background-repeat: no-repeat; background-size: 6px 12px; background-position: calc(100% - 10px) center; background-position-y: center; background-position-x: calc(100% - 10px); } } .kl-fancy-form-input::-webkit-input-placeholder { color: #bababa; } .kl-fancy-form-input::-moz-placeholder { color: #bababa; } .kl-fancy-form-input:-ms-input-placeholder { color: #bababa; } .kl-fancy-form-input::placeholder { color: #bababa; } .kl-fancy-form-input:focus::-webkit-input-placeholder { color: #D7D7D7; } .kl-fancy-form-input:focus::-moz-placeholder { color: #D7D7D7; } .kl-fancy-form-input:focus:-ms-input-placeholder { color: #D7D7D7; } .kl-fancy-form-input:focus::placeholder { color: #D7D7D7; } /* For dark placeholders */ .cf--dark .kl-fancy-form-input::-webkit-input-placeholder { color: #ababab; } .cf--dark .kl-fancy-form-input::-moz-placeholder { color: #ababab; } .cf--dark .kl-fancy-form-input:-ms-input-placeholder { color: #ababab; } .cf--dark .kl-fancy-form-input::placeholder { color: #ababab; } .cf--dark .kl-fancy-form-input:focus::-webkit-input-placeholder { color: #cecece; } .cf--dark .kl-fancy-form-input:focus::-moz-placeholder { color: #cecece; } .cf--dark .kl-fancy-form-input:focus:-ms-input-placeholder { color: #cecece; } .cf--dark .kl-fancy-form-input:focus::placeholder { color: #cecece; } /* Material Forms */ .kl-material-form { position: relative; margin-bottom: 5px; } .kl-material-form-label { position: absolute; top: 10px; left: 15px; cursor: text; font-weight: normal; -webkit-transition: all .25s ease; transition: all .25s ease; } .kl-material-form-input.input-has-content + .kl-material-form-label, .kl-material-form-input:focus + .kl-material-form-label, .kl-material-form-textarea.input-has-content + .kl-material-form-label, .kl-material-form-textarea:focus + .kl-material-form-label, .kl-material-form.zn_cf_select label { top: -10px; font-size: 10px; font-weight: bold; } .kl-material-form .form-control { padding: 15px 10px 5px; height: auto; background-color: transparent; box-shadow: none; border-width: 0 0 1px; border-style: solid; border-color: currentColor; border-radius: 0; } .kl-material-form .form-control:focus { border-bottom-width: 2px; margin-top: -1px; } .kl-material-form.zn_cf_radio .kl-material-form-label { position: static; margin-bottom: 15px; } /* Selectbox fix for Chrome/Safari on OSX */ @media screen and (-webkit-min-device-pixel-ratio: 0) { .kl-material-form-select { height: 52px; -webkit-appearance: none; -moz-appearance: none; appearance: none; box-shadow: inset 1px 2px 0 rgba(0, 0, 0, 0.06); background-image: url(../images/select-arrow.svg); background-repeat: no-repeat; background-size: 6px 12px; background-position: calc(100% - 10px) center; background-position-y: center; background-position-x: calc(100% - 10px); } } .kl-material-form.zn_cf_radio input[type="radio"] + label { pointer-events: all; } .kl-material-form.zn_cf_radio input[type="radio"] { display: none; } .kl-material-form.zn_cf_radio input[type="radio"] + label { position: relative; padding-left: 25px; cursor: pointer; } .kl-material-form.zn_cf_radio input[type="radio"] + label:before, .kl-material-form.zn_cf_radio input[type="radio"] + label:after { -webkit-transition: 0.2s ease all; transition: 0.2s ease all; content: ''; position: absolute; } .kl-material-form.zn_cf_radio input[type="radio"] + label:before { content: ''; left: 0; top: 4px; width: 14px; height: 14px; border: 1px solid #b9b9ba; border-radius: 50%; } .kl-material-form.zn_cf_radio input[type="radio"] + label:after { font-size: 9px; color: #fff; background: #232323; -webkit-transform: scale(0); transform: scale(0); width: 6px; height: 6px; left: 4px; top: 8px; border-radius: 50%; } .kl-material-form.zn_cf_radio input[type="radio"]:checked + label:before { border: 1px solid #232323; } .kl-material-form.zn_cf_radio input[type="radio"]:checked + label:after { -webkit-transform: scale(1); transform: scale(1); } .kl-material-form.zn_cf_checkbox input[type="checkbox"] { position: absolute; opacity: 0; display: none; } .kl-material-form.zn_cf_checkbox input[type="checkbox"] + label { padding-left: 25px; position: relative; } .kl-material-form.zn_cf_checkbox input[type="checkbox"] + label:before { content: ""; display: inline-block; vertical-align: text-top; width: 16px; height: 16px; line-height: 17px; background: white; position: absolute; border: 1px solid #b9b9ba; left: 0; top: 4px; border-radius: 3px; text-align: center; color: #ececec; padding-left: 1px; } .kl-material-form.zn_cf_checkbox input[type="checkbox"] + label:hover:before { border-color: #aaa; } .kl-material-form.zn_cf_checkbox input[type="checkbox"]:checked + label:before { content: ""; background: #232323; border-color: #232323; } .kl-material-form.zn_cf_checkbox input[type="checkbox"] + label:after { position: absolute; left: 0; top: 4px; width: 16px; height: 16px; background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgaWQ9IkxheWVyXzEiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDUxMiA1MTI7IiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiB4bWw6c3BhY2U9InByZXNlcnZlIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiNGRkY7fQo8L3N0eWxlPjxnPjxwb2x5Z29uIGNsYXNzPSJzdDAiIHBvaW50cz0iNDM0LjgsNDkgMTc0LjIsMzA5LjcgNzYuOCwyMTIuMyAwLDI4OS4yIDE3NC4xLDQ2My4zIDE5Ni42LDQ0MC45IDE5Ni42LDQ0MC45IDUxMS43LDEyNS44IDQzNC44LDQ5Ii8+PC9nPjwvc3ZnPg==); background-position: center; background-repeat: no-repeat; background-size: 10px 10px; -webkit-transition: .2s ease-out; transition: .2s ease-out; -webkit-transform: scale(0.1); transform: scale(0.1); content: ''; opacity: 0; } .kl-material-form.zn_cf_checkbox input[type="checkbox"]:checked + label:after { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } /* Material Forms Dark */ .kl-material-form.zn_cf_radio input[type="radio"] + label:after { background: #DCDCDC; } .kl-material-form.zn_cf_radio input[type="radio"]:checked + label:before { border: 1px solid #DCDCDC; } .cf--dark .kl-material-form.zn_cf_checkbox input[type="checkbox"] + label:before { background: transparent; } .cf--dark .kl-material-form.zn_cf_checkbox input[type="checkbox"]:checked + label:before { border-color: #DCDCDC; } /* PAGINATION */ .kl-pagination { margin: 10px 0 20px; text-align: center; display: block; text-transform: uppercase; font-size: 10px; line-height: 1.6; color: #888; list-style-type: none; padding: 10px 0; } .pagination-item { display: inline-block; margin: 0 5px; } .pagination-item-link, .pagination-item-link:focus, .pagination-item-link:hover, .pagination-item-span, .pagination-item-span:focus, .pagination-item-span:hover { border: 0; background: none; text-shadow: none; } /* Normal state */ .pagination-item-link, .pagination-item-span { font-size: 12px; text-transform: uppercase; font-weight: 600; padding: 0; display: inline-block; margin: 0; width: 40px; height: 40px; line-height: 40px; text-align: center; vertical-align: middle; float: none; color: rgba(0, 0, 0, 0.85); border-radius: 3px; } /* Move left and right arrows */ .pagination-item-prev { margin-right: 50px; } .pagination-item-next { margin-left: 50px; } /* hide first or last if no pages */ .pagination-item-span-prev, .pagination-item-span-next { display: none; } /* Add left & right glyphs */ .pagination-item-prev .zn_icon, .pagination-item-next .zn_icon { line-height: 40px; } /* Hover state */ .pagination-item-link:hover, .pagination-item-prev-link:hover:before, .pagination-item-next-link:hover:before { color: rgba(0, 0, 0, 0.5); } /* Active */ .pagination-item-active-link, .pagination-item-active-link:focus, .pagination-item-active-link:hover, .pagination-item-active-span, .pagination-item-active-span:focus, .pagination-item-active-span:hover { color: rgba(0, 0, 0, 0.5); background: none; border: 2px solid rgba(0, 0, 0, 0.18); height: 40px; line-height: 38px; width: 40px; cursor: default; } /* Dark version */ .pagination--dark .kl-pagination { color: #C1C1C1; } .pagination--dark .pagination-item-link, .pagination--dark .pagination-item-span { color: rgba(255, 255, 255, 0.85); } .pagination--dark .pagination-item-link:hover, .pagination--dark .pagination-item-prev-link:hover:before, .pagination--dark .pagination-item-next-link:hover:before { color: rgba(255, 255, 255, 0.5); } .pagination--dark .pagination-item-active-link, .pagination--dark .pagination-item-active-link:focus, .pagination--dark .pagination-item-active-link:hover, .pagination--dark .pagination-item-active-span, .pagination--dark .pagination-item-active-span:focus, .pagination--dark .pagination-item-active-span:hover { color: rgba(255, 255, 255, 0.5); border: 2px solid rgba(255, 255, 255, 0.18); } /* SEARCH FORM */ .gensearch__form { position: relative; } .gensearch__input { height: 42px; width: 100%; padding: 0 20px; outline: none; border: 1px solid #ddd; } .gensearch__submit { position: absolute; right: 0; border: 0; color: #BBB; background-color: transparent; outline: none; height: 100%; padding: 0 20px; font-size: 12px; -webkit-transition: color .2s ease-in-out; transition: color .2s ease-in-out; } .screen-reader-text ~ .gensearch__submit { height: 42px; top: auto; bottom: 0; } .gensearch__submit:hover { color: #131313; } .gensearch__submit:after { content: ''; width: 1px; height: 24px; background-color: #ddd; display: block; left: 0; position: absolute; top: 50%; margin-top: -12px; } .kl-gensearch--dark .gensearch__submit, .kl-sidebar--dark .gensearch__submit { color: #999; } .kl-gensearch--dark .gensearch__submit:hover, .kl-sidebar--dark .gensearch__submit:hover { color: #eee; } .kl-gensearch--dark .gensearch__submit:after, .kl-sidebar--dark .gensearch__submit:after { background-color: rgba(255, 255, 255, 0.1); } .kl-gensearch--dark .gensearch__input, .kl-sidebar--dark .gensearch__input { border: 1px solid #252525; background-color: #111; } /* BUTTONS */ @media (max-width: 991px) { .btn { white-space: normal; } } /* Btn Lined (ghost) */ .btn-lined { border-width: 2px; background: none; color: #fff; text-shadow: none; padding: 7px 20px; line-height: 1.6; box-shadow: none; font-size: 14px; font-weight: 700; border-style: solid; border-radius: 3px; border-color: #fff; -webkit-transition: all .1s ease-in-out; transition: all .1s ease-in-out; } .btn-lined:hover, .btn-lined:focus { border-color: rgba(255, 255, 255, 0.7); color: #fff; } /* Btn Lined - Skewed style */ .btn-lined.btn-skewed { border: 0; background: none; position: relative; } .btn-lined.btn-skewed:before { content: ''; border: 2px solid #fff; border-radius: 4px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; -webkit-transform: skewX(-8deg); transform: skewX(-8deg); } .btn-lined.btn-skewed:hover:before { border-color: rgba(255, 255, 255, 0.7); } /* Btn Lined Dark (ghost) */ .btn-lined.lined-dark { color: #242424; border-color: #242424; } .btn-lined.lined-dark:hover, .btn-lined.lined-dark:focus { color: #343434; } /* Btn Lined DARK - Skewed style */ .btn-lined.lined-dark.btn-skewed { border: 0; background: none; position: relative; } .btn-lined.lined-dark.btn-skewed:before { content: ''; border: 2px solid #242424; border-radius: 4px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; -webkit-transform: skewX(-8deg); transform: skewX(-8deg); } .btn-lined.lined-dark.btn-skewed:hover:before { border-color: rgba(0, 0, 0, 0.7); } /* Btn Lined Dark (ghost) */ .btn-lined.lined-gray { color: #8E8E8E; border-color: #8E8E8E; } .btn-lined.lined-gray:hover, .btn-lined.lined-gray:focus { color: #454545; } /* Btn Lined Gray - Skewed style */ .btn-lined.lined-gray.btn-skewed { border: 0; background: none; position: relative; } .btn-lined.lined-gray.btn-skewed:before { content: ''; border: 2px solid #8E8E8E; border-radius: 4px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; -webkit-transform: skewX(-8deg); transform: skewX(-8deg); } .btn-lined.lined-gray.btn-skewed:hover:before { border-color: rgba(0, 0, 0, 0.4); } /* Button Lined Full Light */ .btn-lined.lined-full-light { color: #242424; border-color: #fff; background: rgba(255, 255, 255, 0.8); } .btn-lined.lined-full-light:hover, .btn-lined.lined-full-light:focus { color: #343434; background-color: #fff; } /* Button Lined Full Dark */ .btn-lined.lined-full-dark { color: #e0e0e0; border-color: #000; background: rgba(0, 0, 0, 0.8); } .btn-lined.lined-full-dark:hover, .btn-lined.lined-full-dark:focus { color: #f9f9f9; background-color: #000; } /* Bordered Button */ .btn.btn-bordered { border-width: 3px; border-color: #cd2122; border-style: double; background-clip: padding-box; } .btn.btn--rounded { border-radius: 3px !important; } .btn.btn--round { border-radius: 50px !important; } .btn.btn--square { border-radius: 0 !important; } /* Filled buttons */ .btn.btn-fullwhite, .btn.btn-fullblack, .btn.btn-fullcolor { border-width: 0; } .btn.btn-fullwhite, .btn.btn-fullblack, .btn.btn-fullcolor, .btn.btn-default, .btn.btn-primary, .btn.btn-success, .btn.btn-info, .btn.btn-warning, .btn.btn-danger, .btn.btn-link { text-shadow: none; padding: 10px 20px; line-height: 1.6; box-shadow: none; font-size: 13px; font-weight: 700; border-style: solid; border-radius: 3px; -webkit-transition: background-color .15s ease-out; transition: background-color .15s ease-out; } /* Btn FullColor */ .btn.btn-fullcolor, .btn.btn-fullcolor:focus { background-color: #cd2122; color: #fff; } .btn.btn-fullcolor:hover { color: #fff; } /* Btn Fullwhite */ .btn.btn-fullwhite { background-color: #fff; color: #242424 !important; } .btn.btn-fullwhite:hover { color: #353535 !important; background-color: rgba(255, 255, 255, 0.85); } /* Btn Fullblack */ .btn.btn-fullblack { background-color: #090909; color: #f9f9f9 !important; } .btn.btn-fullblack:hover { color: #eee !important; background-color: rgba(0, 0, 0, 0.85); } /* Filled buttons - Skewed style */ .btn.btn-fullwhite.btn-skewed, .btn.btn-fullblack.btn-skewed, .btn.btn-fullcolor.btn-skewed, .btn.btn-fullwhite.btn-skewed:hover, .btn.btn-fullblack.btn-skewed:hover, .btn.btn-fullcolor.btn-skewed:hover { border: 0; background: none; position: relative; z-index: 0; } .btn.btn-fullwhite.btn-skewed:before, .btn.btn-fullblack.btn-skewed:before, .btn.btn-fullcolor.btn-skewed:before { content: ''; border-radius: 4px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; -webkit-transform: skewX(-8deg); transform: skewX(-8deg); -webkit-transition: background-color .2s ease-in-out; transition: background-color .2s ease-in-out; z-index: -1; } /* Btn FullColor */ .btn.btn-fullcolor.btn-skewed:before { background-color: #cd2122; } /* Btn Fullwhite */ .btn.btn-fullwhite.btn-skewed:before { background-color: #fff; } .btn.btn-fullwhite.btn-skewed:hover:before { background-color: rgba(255, 255, 255, 0.85); } /* Btn Fullblack */ .btn.btn-fullblack.btn-skewed:before { background-color: #090909; } .btn.btn-fullblack.btn-skewed:hover:before { background-color: rgba(0, 0, 0, 0.85); } .btn.btn-text { padding: 0; } .btn.btn-underline > span { border-bottom: 1px solid currentColor; } .btn.btn-underline.btn-underline--thin > span { border-bottom-width: 1px; } .btn.btn-underline.btn-underline--thick > span { border-bottom-width: 2px; } .btn.btn-underline:active { outline: 0; box-shadow: none; } /* Btn sizing presets */ .btn-group-lg > .btn, .btn.btn-lg { padding: 20px 30px; font-size: 18px; line-height: 1.3333333; } .btn-group-lg > .btn.btn-lined, .btn.btn-lg.btn-lined { padding: 18px 30px; } .btn-group-md > .btn, .btn.btn-md { padding: 16px 25px; font-size: 14px; line-height: 1.3333333; } .btn-group-md > .btn.btn-lined, .btn.btn-md.btn-lined { padding: 14px 25px; } .btn-group-sm > .btn, .btn.btn-sm { padding: 5px 10px 4px; font-size: 12px; line-height: 1.6; font-weight: 400; } .btn-group-sm > .btn.btn-lined, .btn.btn-sm.btn-lined { padding: 3px 10px; } .btn-group-xs > .btn, .btn.btn-xs { padding: 1px 5px; font-size: 12px; line-height: 1.6; font-weight: 400; } .btn-group-xs > .btn.btn-lined, .btn.btn-xs.btn-lined { padding: 1px 5px; } /* Width presets */ @media screen and (min-width: 1200px) { .btn.btn-fullwidth { width: 100%; } .btn.btn-halfwidth { width: 50%; white-space: normal; } .btn.btn-third { width: 33.33%; white-space: normal; } .btn.btn-forth { width: 25%; white-space: normal; } } /* SOCIAL ICONS */ .social-icons { margin-left: 10px; margin-bottom: 0; z-index: 1; } .social-icons-li { display: inline-block; margin: 5px; margin-left: 10px; margin-right: 0; vertical-align: top; } .social-icons-item { display: inline-block; color: #fff; width: 30px; height: 30px; position: relative; border-radius: 3px; text-align: center; -webkit-transition: all 0.2s ease-out; transition: all 0.2s ease-out; font-size: 14px; font-weight: normal; opacity: 1; } .social-icons-item:before { line-height: 30px; } .social-icons-item:hover { box-shadow: 0 0 6px rgba(0, 0, 0, 0.4); } .social-icons.sc--normal .social-icons-item { background-color: #111; } .social-icons.sc--normal .social-icons-item:hover { background-color: #cd2122; color: #fff; } /* Colored social icons */ .social-icons.sc--colored .social-icons-item:hover { background-color: #121212; color: #fff; } /* Colored social icons */ .social-icons.sc--colored_hov .social-icons-item:not(:hover) { background-color: #121212; color: #fff; } .social-icons.sc--colored_hov .social-icons-item:hover { color: #fff; } /* Social icons - clean style */ .social-icons.sc--clean .social-icons-li { margin-left: 0; margin-right: 0; } .social-icons.sc--clean .social-icons-item { background: none; box-shadow: none; font-size: 14px; } .social-icons.sc--clean .social-icons-item:hover { background: none; box-shadow: none; } /* PAGE SIDEBARS */ .zn_sidebar { padding: 20px 15px; border-radius: 3px; margin-bottom: 20px; background: white; box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.15); } .zn_sidebar select { max-width: 100%; } .kl-sidebar--dark { background: #121212; box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.45); } .zn-sidebar-widget { margin-bottom: 35px; } /* WIDGET TITLE */ .widgettitle { color: #050505; line-height: 1.4; margin: 10px 0 15px; padding-bottom: 20px; position: relative; font-size: 14px; text-transform: uppercase; } .element-scheme--dark .widgettitle { color: #FAFAFA; } .widgettitle:after { content: ''; position: absolute; left: 0; bottom: 2px; width: 50px; height: 0; border-bottom: 1px solid #cd2122; } .widgettitle:before { content: ''; position: absolute; left: 0; bottom: 2px; width: 100%; height: 0; border-bottom: 1px solid #ececec; } .element-scheme--dark .widgettitle:before { border-bottom-color: #2D2D2D; } /* WIDGET LISTS */ div.widget ul.menu, div.widget ul.pagenav, div.widget.widget_meta > ul, div.widget.widget_pages > ul { margin: 0; padding: 0; list-style: none; } div.widget ul.menu li, div.widget ul.pagenav li, div.widget.widget_meta > ul li, div.widget.widget_pages > ul li { margin-bottom: 0; } div.widget ul.menu li a, div.widget ul.pagenav li a, div.widget.widget_meta > ul a, div.widget.widget_pages > ul a { color: #747474; display: block; padding: 5px 0; position: relative; border-radius: 2px; } .element-scheme--dark div.widget ul.menu li a, .element-scheme--dark div.widget ul.pagenav li a, .element-scheme--dark .widget_meta > ul a, .element-scheme--dark .widget_pages > ul a { color: #ababab; } div.widget ul.menu li a::before, div.widget ul.pagenav li a::before, div.widget.widget_meta > ul a::before, div.widget.widget_pages > ul a::before { content: ''; display: inline-block; margin-right: 12px; width: 8px; height: 2px; background: #E1E1E1; vertical-align: middle; -webkit-transition: all .15s ease-out; transition: all .15s ease-out; } .element-scheme--dark div.widget ul.menu li a::before, .element-scheme--dark div.widget ul.pagenav li a::before, .element-scheme--dark .widget_meta > ul a::before, .element-scheme--dark .widget_pages > ul a::before { background: #454545; } div.widget ul.menu li.active > a, div.widget ul.pagenav li.active a, div.widget ul.menu li.current-cat > a, div.widget ul.pagenav li.current-cat > a, div.widget ul.menu li > a:hover, div.widget ul.pagenav li a:hover, div.widget.widget_meta > ul a:hover, div.widget.widget_pages > ul a:hover { color: #000000; } .element-scheme--dark .widget ul.menu li > a:hover, .element-scheme--dark .widget ul.pagenav li a:hover, .element-scheme--dark div.widget.widget_meta > ul a:hover, .element-scheme--dark div.widget.widget_pages > ul a:hover { color: #eee; } div.widget ul.menu li a:hover::before, div.widget ul.pagenav li a:hover::before, div.widget.widget_meta > ul a:hover::before, div.widget.widget_pages > ul a:hover::before { width: 12px; margin-right: 8px; } /* FAKE LOADING */ .fake-loading { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: #fff; z-index: 1; pointer-events: none; -webkit-animation: fake-loading .4s ease-in 2s 1 normal forwards; animation: fake-loading .4s ease-in 2s 1 normal forwards; } .no-csspointerevents .fake-loading { display: none; } .fake-loading.fl--nobg { background: none; } .fake-loading.loading-1s { -webkit-animation-delay: 1s; animation-delay: 1s; } .fake-loading.loading-2s { -webkit-animation-delay: 2s; animation-delay: 2s; } .fake-loading.loading-4s { -webkit-animation-delay: 4s; animation-delay: 4s; } .fake-loading.loading-8s { -webkit-animation-delay: 8s; animation-delay: 8s; } .fake-loading.loading-10s { -webkit-animation-delay: 10s; animation-delay: 10s; } .fake-loading:after { content: ''; border: 2px solid rgba(205, 33, 34, 0.16); border-top-color: #cd2122; border-right-color: #cd2122; border-radius: 50%; width: 40px; height: 40px; position: absolute; left: 50%; top: 50%; margin: -15px 0 0 -15px; -webkit-animation: fake-loading-circle .5s infinite linear; animation: fake-loading-circle .5s infinite linear; } @-webkit-keyframes fake-loading { 0% { visibility: visible; opacity: 1; } 100% { visibility: hidden; opacity: 0; } } @keyframes fake-loading { 0% { visibility: visible; opacity: 1; } 100% { visibility: hidden; opacity: 0; } } @-webkit-keyframes fake-loading-circle { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes fake-loading-circle { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } /* KALLYAS VIDEO BACKGROUND */ .kl-video { position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 0; } .kl-video-holder:before { content: ''; border: 2px solid rgba(205, 33, 34, 0.16); border-top-color: #cd2122; border-right-color: #cd2122; border-radius: 50%; width: 40px; height: 40px; position: absolute; left: 50%; top: 50%; margin: -15px 0 0 -15px; -webkit-animation: fake-loading-circle .5s infinite linear; animation: fake-loading-circle .5s infinite linear; z-index: 0; } .kl-video-holder:empty:before, .kl-video-holder.video-is-loaded:before { display: none; } .kl-video video, .kl-video iframe { display: block; max-width: none; } .kl-video .fallback_image { background-repeat: no-repeat; background-position: center; background-size: cover; left: 0; top: 0; bottom: 0; right: 0; } .kl-video.kl-video--valign video:not(.cover-fit-img), .kl-video.kl-video--valign iframe { top: 50% !important; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .kl-video.kl-video--halign video:not(.cover-fit-img), .kl-video.kl-video--halign iframe { left: 50% !important; -webkit-transform: translateX(-50%) scale(1.002); transform: translateX(-50%) scale(1.002); } .kl-video.kl-video--halign.kl-video--valign video:not(.cover-fit-img), .kl-video.kl-video--halign.kl-video--valign iframe { top: 50% !important; left: 50% !important; -webkit-transform: translateY(-50%) translateX(-50%) scale(1.002); transform: translateY(-50%) translateX(-50%) scale(1.002); } .video-transition-in > div, .video-transition-in > iframe, .video-transition-in > ul { opacity: 0; } .video-transition-in.video-is-loaded > div, .video-transition-in.video-is-loaded > iframe, .video-transition-in.video-is-loaded > ul { -webkit-animation: revealVideo 1s; animation: revealVideo 1s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; } @-webkit-keyframes revealVideo { 0%, 50% { opacity: 0; } 100% { opacity: 1; } } @keyframes revealVideo { 0%, 50% { opacity: 0; } 100% { opacity: 1; } } /* Video Grid Overlay */ .video-grid-overlay:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; opacity: .7; pointer-events: none; } .video-grid-overlay.video-grid-overlay-1:after { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QzBEN0UzRDc2QzJGMTFFNEE0QTJBNzhFQTEzOTI4MDkiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QzBEN0UzRDg2QzJGMTFFNEE0QTJBNzhFQTEzOTI4MDkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpDMEQ3RTNENTZDMkYxMUU0QTRBMkE3OEVBMTM5MjgwOSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpDMEQ3RTNENjZDMkYxMUU0QTRBMkE3OEVBMTM5MjgwOSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PgNRI5EAAAAtSURBVHjaYjQxd2QAAjsgvgbEb5iAhC8Q/wRxQDIsQHwcxgGpZELigFUCBBgAOUAJC8f8sekAAAAASUVORK5CYII="); } .video-grid-overlay.video-grid-overlay-2:after { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OTQyRTEyQTJBNDZFMTFFMzkxMEI4RUE5OTVCNkU0MjEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OTQyRTEyQTNBNDZFMTFFMzkxMEI4RUE5OTVCNkU0MjEiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo5NDJFMTJBMEE0NkUxMUUzOTEwQjhFQTk5NUI2RTQyMSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo5NDJFMTJBMUE0NkUxMUUzOTEwQjhFQTk5NUI2RTQyMSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PtzhwGQAAAAYSURBVHjaYmBgYDD4//8/AyOIAAGAAAMAO4IGLB7fdfUAAAAASUVORK5CYII="); } .no-csspointerevents .video-grid-overlay:after { display: none; } .no-video-overlay .video-grid-overlay:after { display: none !important; } /* Video with subtle top gradient */ .video-subtle-gradient:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 270px; z-index: 2; background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.3) 0%, transparent 100%); background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 0%, transparent 100%); } /* Video Controls */ .kl-video--controls { display: none; } @media (min-width: 992px) { .kl-video--controls { display: block; list-style: none; margin: 0; padding: 0; position: absolute; top: 30px; right: 50px; z-index: 3; width: 50px; opacity: .1; -webkit-transition: opacity .2s ease-in; transition: opacity .2s ease-in; } .kl-video--controls[data-position="top-left"] { right: auto; left: 50px; } .kl-video--controls[data-position="top-center"] { right: auto; left: 50%; margin-left: -25px; } .kl-video--controls[data-position="bottom-right"] { top: auto; right: 20px; bottom: 5px; } .kl-video--controls[data-position="bottom-left"] { top: auto; right: auto; left: 50px; bottom: 5px; } .kl-video--controls[data-position="bottom-center"] { top: auto; right: auto; left: 50%; bottom: 5px; margin-left: -25px; } div[class*="maskcontainer--"] .kl-video--controls[data-position="bottom-right"], div[class*="maskcontainer--"] .kl-video--controls[data-position="bottom-left"], div[class*="maskcontainer--"] .kl-video--controls[data-position="bottom-center"] { bottom: 40px; } .kl-video--controls[data-position="middle-right"] { top: 50%; margin-top: -25px; } .kl-video--controls[data-position="middle-left"] { left: 50px; right: auto; top: 50%; margin-top: -25px; } .kl-video--controls[data-position="middle-center"] { left: 50%; right: auto; top: 50%; margin-top: -25px; margin-left: -25px; } .kl-video-container:hover .kl-video--controls, #page-header:hover .kl-video--controls { opacity: 1; } .kl-video-container .kl-video--controls a { width: 50px; height: 50px; display: block; cursor: pointer; color: #fff; text-align: center; line-height: 50px; text-decoration: none; -webkit-transition: all 0.2s ease-out; transition: all 0.2s ease-out; opacity: .5; } .kl-video--controls .btn-audio { opacity: 0; visibility: hidden; -webkit-transform: translateY(-30px); transform: translateY(-30px); } .kl-video--controls:hover .btn-audio { opacity: .7; visibility: visible; -webkit-transform: translateY(-10px); transform: translateY(-10px); } .kl-video--controls .btn-toggleplay { -webkit-transform: translateY(0); transform: translateY(0); } .kl-video--controls .btn-toggleplay .paused:before { content: "\e073"; } .kl-video--controls:hover .btn-toggleplay { -webkit-transform: translateY(-10px); transform: translateY(-10px); } .kl-video--controls a:hover { opacity: 1; } .kl-video--controls .btn-audio .kl-icon { width: 28px; height: 28px; line-height: 28px; } .kl-video--controls .btn-audio .kl-icon:before { line-height: 29px; } .kl-video--controls .btn-audio .mute:before { content: "\e036"; } } /* MAGNIFIC POPUP CSS */ .mfp-bg { top: 0; left: 0; width: 100%; height: 100%; z-index: 1042; overflow: hidden; position: fixed; background: #0b0b0b; opacity: 0.8; filter: alpha(opacity=80); } .mfp-wrap { top: 0; left: 0; width: 100%; height: 100%; z-index: 1043; position: fixed; outline: none !important; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .admin-bar .mfp-wrap { top: 32px; } .mfp-container { text-align: center; position: absolute; width: 100%; height: 100%; left: 0; top: 0; padding: 0 8px; } .mfp-container:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; } .mfp-align-top .mfp-container:before { display: none; } .mfp-content { position: relative; display: inline-block; vertical-align: middle; margin: 0 auto; text-align: left; z-index: 1045; } .mfp-inline-holder .mfp-content, .mfp-ajax-holder .mfp-content { width: 100%; cursor: auto; } .mfp-ajax-cur { cursor: progress; } .mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close { cursor: -webkit-zoom-out; cursor: zoom-out; } .mfp-zoom { cursor: pointer; cursor: -webkit-zoom-in; cursor: zoom-in; } .mfp-auto-cursor .mfp-content { cursor: auto; } .mfp-close, .mfp-arrow, .mfp-preloader, .mfp-counter { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .mfp-loading.mfp-figure { display: none; } .mfp-hide { display: none !important; } .mfp-preloader:after { content: ''; border: 2px solid rgba(255, 255, 255, 0.16); border-top-color: #BFBFBF; border-right-color: #BFBFBF; border-radius: 50%; width: 40px; height: 40px; position: absolute; left: 50%; top: 50%; margin: -15px 0 0 -15px; -webkit-animation: loading-circle .5s infinite linear; animation: loading-circle .5s infinite linear; } @-webkit-keyframes loading-circle { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes loading-circle { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } .mfp-preloader a { color: #CCC; } .mfp-preloader a:hover { color: #FFF; } .mfp-s-ready .mfp-preloader { display: none; } .mfp-s-error .mfp-content { display: none; } button.mfp-close, button.mfp-arrow { overflow: visible; cursor: pointer; background: transparent; border: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; display: block; outline: none; padding: 0; z-index: 1046; box-shadow: none; } button::-moz-focus-inner { padding: 0; border: 0; } .mfp-close { width: 44px; height: 44px; line-height: 44px; position: absolute; right: 0; top: 0; text-decoration: none; text-align: center; opacity: 0.65; padding: 0 0 18px 10px; color: #FFF; font-style: normal; font-size: 28px; font-family: Arial, Baskerville, monospace; } .mfp-close:hover, .mfp-close:focus { opacity: 1; } .mfp-close:active { top: 1px; } .mfp-close-btn-in .mfp-close { color: #FFF; } .mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close { color: #FFF; right: -6px; text-align: right; padding-right: 6px; width: 100%; } .mfp-counter { position: absolute; top: 0; right: 0; color: #CCC; font-size: 12px; line-height: 18px; white-space: nowrap; } .mfp-arrow { position: absolute; opacity: 0.65; margin: 0; top: 50%; margin-top: -55px; padding: 0; width: 90px; height: 110px; -webkit-tap-highlight-color: transparent; } .mfp-arrow:active { margin-top: -54px; } .mfp-arrow:hover, .mfp-arrow:focus { opacity: 1; } .mfp-arrow:before, .mfp-arrow:after, .mfp-arrow .mfp-b, .mfp-arrow .mfp-a { content: ''; display: block; width: 0; height: 0; position: absolute; left: 0; top: 0; margin-top: 35px; margin-left: 35px; border: medium inset transparent; } .mfp-arrow:after, .mfp-arrow .mfp-a { border-top-width: 13px; border-bottom-width: 13px; top: 8px; } .mfp-arrow:before, .mfp-arrow .mfp-b { border-top-width: 21px; border-bottom-width: 21px; opacity: 0.7; } .mfp-arrow-left { left: 0; } .mfp-arrow-left:after, .mfp-arrow-left .mfp-a { border-right: 17px solid #FFF; margin-left: 31px; } .mfp-arrow-left:before, .mfp-arrow-left .mfp-b { margin-left: 25px; border-right: 27px solid #3F3F3F; } .mfp-arrow-right { right: 0; } .mfp-arrow-right:after, .mfp-arrow-right .mfp-a { border-left: 17px solid #FFF; margin-left: 39px; } .mfp-arrow-right:before, .mfp-arrow-right .mfp-b { border-left: 27px solid #3F3F3F; } .mfp-iframe-holder { padding-top: 40px; padding-bottom: 40px; } .mfp-iframe-holder .mfp-content { line-height: 0; width: 100%; max-width: 900px; } .mfp-iframe-holder .mfp-close { top: -40px; } .mfp-iframe-scaler { width: 100%; height: 0; overflow: hidden; padding-top: 56.25%; } .mfp-iframe-scaler iframe { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #000; } /* Main image in popup */ img.mfp-img { width: auto; max-width: 100%; height: auto; display: block; line-height: 0; padding: 40px 0 40px; margin: 0 auto; } /* The shadow behind the image */ .mfp-figure { line-height: 0; } .mfp-figure:after { content: ''; position: absolute; left: 0; top: 40px; bottom: 40px; display: block; right: 0; width: auto; height: auto; z-index: -1; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #444; } .mfp-figure small { color: #BDBDBD; display: block; font-size: 12px; line-height: 14px; } .mfp-figure figure { margin: 0; } .mfp-bottom-bar { margin-top: -36px; position: absolute; top: 100%; left: 0; width: 100%; cursor: auto; } .mfp-title { text-align: left; line-height: 18px; color: #F3F3F3; word-wrap: break-word; padding-right: 36px; } .mfp-image-holder .mfp-content { max-width: 100%; } .mfp-gallery .mfp-image-holder .mfp-figure { cursor: pointer; } /* Fade Effect for opening */ .mfp-fade.mfp-bg { background: #333; opacity: 0; -webkit-transition: all 0.15s ease-out; transition: all 0.15s ease-out; } .mfp-fade.mfp-bg.mfp-ready { opacity: 0.94; } .mfp-fade.mfp-bg.mfp-removing { opacity: 0; } .mfp-fade.mfp-wrap .mfp-content { opacity: 0; -webkit-transition: all 0.15s ease-out; transition: all 0.15s ease-out; } .mfp-fade.mfp-wrap.mfp-ready .mfp-content { opacity: 1; } .mfp-fade.mfp-wrap.mfp-removing .mfp-content { opacity: 0; } /* Zoom effect */ .mfp-zoom-in .mfp-with-anim { opacity: 0; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; -webkit-transform: scale(0.8); transform: scale(0.8); } .mfp-zoom-in.mfp-bg { opacity: 0; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .mfp-zoom-in.mfp-ready .mfp-with-anim { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } .mfp-zoom-in.mfp-ready.mfp-bg { opacity: 0.8; } .mfp-zoom-in.mfp-removing .mfp-with-anim { -webkit-transform: scale(0.8); transform: scale(0.8); opacity: 0; } .mfp-zoom-in.mfp-removing.mfp-bg { opacity: 0; } @media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) { /** * Remove all paddings around the image on small screen */ .mfp-img-mobile .mfp-image-holder { padding-left: 0; padding-right: 0; } .mfp-img-mobile img.mfp-img { padding: 0; } .mfp-img-mobile .mfp-figure:after { top: 0; bottom: 0; } .mfp-img-mobile .mfp-figure small { display: inline; margin-left: 5px; } .mfp-img-mobile .mfp-bottom-bar { background: rgba(0, 0, 0, 0.6); bottom: 0; margin: 0; top: auto; padding: 3px 5px; position: fixed; } .mfp-img-mobile .mfp-bottom-bar:empty { padding: 0; } .mfp-img-mobile .mfp-counter { right: 5px; top: 3px; } .mfp-img-mobile .mfp-close { top: 0; right: 0; width: 35px; height: 35px; line-height: 35px; background: rgba(0, 0, 0, 0.6); position: fixed; text-align: center; padding: 0; } } @media all and (max-width: 900px) { .mfp-arrow { -webkit-transform: scale(0.75); transform: scale(0.75); } .mfp-arrow-left { -webkit-transform-origin: 0; transform-origin: 0; } .mfp-arrow-right { -webkit-transform-origin: 100%; transform-origin: 100%; } .mfp-container { padding-left: 6px; padding-right: 6px; } } /* SCROLL TO TOP BUTTON */ #totop { height: 9px; opacity: 0; position: fixed; right: -60px; width: 49px; z-index: 999; display: block; top: 85%; background-repeat: no-repeat; background-position: center 15px; background-color: #404040; font-size: 9px; font-weight: 900; color: #fff; text-align: center; line-height: 1; border-radius: 2px; padding: 28px 0 21px 0; } #totop:before { position: absolute; content: "\e080"; top: 10px; left: 50%; margin-left: -6px; font-size: 11px; display: inline-block; font-family: "Glyphicons Halflings"; font-style: normal; font-weight: 400; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); } .on--totop#totop { right: 10px; opacity: 0.7; } #totop:hover { opacity: 1; } /* TO-NEXT BUTTON */ .tonext-btn { position: absolute; bottom: 40px; left: 50%; margin-left: -12px; color: #FFF; display: block; z-index: 101; text-decoration: none; } .tonext-btn.has-nav { bottom: 70px; } .mouse-anim-icon { width: 24px; height: 40px; border-radius: 12px; background-color: rgba(255, 255, 255, 0.1); -webkit-transition: background-color .2s ease-out; transition: background-color .2s ease-out; position: relative; display: block; } .mouse-anim-icon:after { position: absolute; content: ''; width: 2px; height: 9px; background-color: rgba(0, 0, 0, 0.25); left: 50%; margin-left: -1px; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-name: animScroll; animation-name: animScroll; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-direction: alternate; animation-direction: alternate; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } .mouse-anim-icon:hover { background-color: rgba(255, 255, 255, 0.4); } .mouse-anim-icon:hover:after { top: 24px; } @-webkit-keyframes animScroll { from { top: 8px; } to { top: 24px; } } @keyframes animScroll { from { top: 8px; } to { top: 24px; } } /* COUNTER */ .kl-counter { margin: 0 0 50px; } .kl-counter-list { display: inline-block; margin: 0; padding: 0; list-style: none; } .kl-counter-li { display: inline-block; margin: 0 10px 20px; font-size: 28px; font-weight: 700; padding: 15px 0; width: 70px; text-align: center; background: rgba(0, 0, 0, 0.2); border-radius: 2px; } .kl-counter-unit { display: block; font-size: 13px; margin-top: 17px; line-height: 1; } .kl-counter-launch { padding: 0; background: rgba(0, 0, 0, 0.2); border-radius: 2px; display: inline-block; text-align: center; vertical-align: top; width: 80px; height: 80px; margin: 0 20px 18px 22px; } /* IMAGE GALLERY WP (Custom) */ .zn_image_gallery .gallery_caption { position: absolute; bottom: 0; left: 0; color: #fff; width: 100%; padding: 10px 15px; -webkit-transition: bottom .25s ease, opacity .25s ease, visibility .25s ease; transition: bottom .25s ease, opacity .25s ease, visibility .25s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; background: -webkit-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.4) 100%); background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.4) 100%); } .zn_image_gallery .gallery_caption:empty { display: none; } .zn_image_gallery .hoverBorder { overflow: hidden; } .zn_image_gallery .hoverBorder:hover .gallery_caption { opacity: 0; visibility: hidden; bottom: -100%; } /* Element Appear - Fade In */ .el--appear.el--appear-fadein { opacity: 0; -webkit-transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); } .el--appear.el--appear-fadein.el--appeared { opacity: 1; } /* Element Appear - Slide from left */ .el--appear.el--appear-sfl { opacity: 0; -webkit-transform: translateX(-150px); transform: translateX(-150px); -webkit-transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); } .el--appear.el--appear-sfl.el--appeared { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } /* Element Appear - Slide from right */ .el--appear.el--appear-sfr { opacity: 0; -webkit-transform: translateX(150px); transform: translateX(150px); -webkit-transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); } .el--appear.el--appear-sfr.el--appeared { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } /* Element Appear - Slide from Top */ .el--appear.el--appear-sft { opacity: 0; -webkit-transform: translateY(-150px); transform: translateY(-150px); -webkit-transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); } .el--appear.el--appear-sft.el--appeared { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } /* Element Appear - Slide from Bottom */ .el--appear.el--appear-sfb { opacity: 0; -webkit-transform: translateY(150px); transform: translateY(150px); -webkit-transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); } .el--appear.el--appear-sfb.el--appeared { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } /* Element Appear - Scale IN */ .el--appear.el--appear-scale { opacity: 0; -webkit-transform: scale(0.3); transform: scale(0.3); -webkit-transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); } .el--appear.el--appear-scale.el--appeared { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } /* VideoBox Play button */ .playVideo { display: block; width: 80px; height: 80px; border: 2px solid #fff; border-radius: 50%; cursor: pointer; margin: 0 auto; -webkit-transform: scale(0.95) translate3d(0, 0, 0); transform: scale(0.95) translate3d(0, 0, 0); -webkit-transition: -webkit-transform .25s ease-in-out; transition: -webkit-transform .25s ease-in-out; transition: transform .25s ease-in-out; transition: transform .25s ease-in-out, -webkit-transform .25s ease-in-out; -webkit-backface-visibility: hidden; backface-visibility: hidden; vertical-align: middle; text-align: center; color: #fff; line-height: 76px; font-size: 18px; } .playVideo:before { content: "\e072"; font-family: "Glyphicons Halflings"; } .playVideo:hover, .playVideo:focus { -webkit-transform: scale(1); transform: scale(1); color: #fff; } /* Sizes */ .playVideo.playvideo-size--xs { width: 30px; height: 30px; line-height: 26px; font-size: 10px; } .playVideo.playvideo-size--sm { width: 52px; height: 52px; line-height: 50px; font-size: 14px; } .playVideo.playvideo-size--md { width: 80px; height: 80px; line-height: 76px; font-size: 18px; } .playVideo.playvideo-size--lg { width: 100px; height: 100px; line-height: 96px; font-size: 20px; } .playVideo.playvideo-size--xl { width: 120px; height: 120px; line-height: 120px; font-size: 26px; } /* Circle Play video */ .circleanim-svg { width: 108px; height: 108px; display: inline-block; } .circleanim-svg__circle-front, .circleanim-svg__circle-back { fill: none; stroke: #fff; } .circleanim-svg__circle-front { stroke-dasharray: 60 1000; stroke-width: 5px; stroke-opacity: .5; stroke-dashoffset: 0; -webkit-transition: stroke-width 1s, stroke-dashoffset 1s, stroke-dasharray 1s, stroke-opacity 1s; transition: stroke-width 1s, stroke-dashoffset 1s, stroke-dasharray 1s, stroke-opacity 1s; } .circleanim-svg:hover .circleanim-svg__circle-front { stroke-dasharray: 340; stroke-width: 2px; stroke-opacity: 1; } /* Sizes */ .circleanim-svg.circleanim-svg-size--xs { width: 30px; height: 30px; } .circleanim-svg.circleanim-svg-size--sm { width: 52px; height: 52px; } .circleanim-svg.circleanim-svg-size--md { width: 80px; height: 80px; } .circleanim-svg.circleanim-svg-size--xl { width: 140px; height: 140px; } /* Background source for elements */ .kl-bg-source:not(:empty), .kl-bg-source__overlay, .kl-bg-source__bgimage { position: absolute; top: 0; left: 0; bottom: 0; right: 0; } .kl-bg-source__bgimage { background-position: center; background-repeat: no-repeat; background-size: cover; background-attachment: fixed; } .kl-bg-source__overlay { pointer-events: none; } .kl-overlay-fadeto .kl-bg-source__overlay, .kl-overlay-fadeout .kl-bg-source__overlay { -webkit-transition: opacity .2s ease-out; transition: opacity .2s ease-out; } .kl-overlay-fadeout:hover .kl-bg-source__overlay { opacity: 0; } .no-csspointerevents .fake-loading { display: none; } .kl-bg-source__iframe-wrapper, .kl-bg-source__iframe iframe { position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; overflow: hidden; } .kl-bg-source__iframe-poster { display: none; } .kl-bg-source__iframe { position: relative; display: block; height: 0; padding: 0; overflow: hidden; padding-bottom: 56.25%; } .kl-bg-source__iframe iframe { border: 0; } @media (min-width: 768px) { .kl-bg-source__iframe.iframe-valign { top: 50% !important; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .kl-bg-source__iframe.iframe-halign { left: 50% !important; -webkit-transform: translateX(-50%) scale(1.002); transform: translateX(-50%) scale(1.002); } .kl-bg-source__iframe.iframe-halign.iframe-valign { top: 50% !important; left: 50% !important; -webkit-transform: translateY(-50%) translateX(-50%) scale(1.002); transform: translateY(-50%) translateX(-50%) scale(1.002); } } @media (max-width: 767px) { .kl-bg-source__iframe { height: auto; padding: 0; overflow: hidden; -o-object-fit: cover; object-fit: cover; width: 100%; height: 100%; } .kl-bg-source__iframe > iframe:not(:only-child) { display: none; } .kl-bg-source__iframe-poster { display: block; background-position: center; background-repeat: no-repeat; background-size: cover; position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; overflow: hidden; z-index: 1; } } .kl-bg-source__overlay-gloss { pointer-events: none; position: absolute; top: 0; left: -43%; background-color: #FFF; width: 100%; -webkit-transform: skewX(-55deg); transform: skewX(-55deg); height: 100%; -webkit-transform-origin: 100% 0; transform-origin: 100% 0; opacity: .08; } .znParallax-background { overflow: hidden; position: relative; } .znParallax-background .kl-bg-source__parallaxWrapper { position: absolute; left: 0; top: 0; right: 0; bottom: 0; width: 100%; } .znParallax-background .kl-bg-source__bgimage, .znParallax-background .kl-bg-source__video, .znParallax-background .kl-bg-source__iframe-wrapper { height: auto; } .znParallax-background .kl-bg-source__bgimage, .znParallax-background .kl-bg-source__video, .znParallax-background .kl-bg-source__iframe-wrapper { position: relative; left: 50%; -webkit-transform: translate3d(-50%, -50%, 0); transform: translate3d(-50%, -50%, 0); max-width: none; } .znParallax-background .zn-parallaxHack--top .kl-bg-source__bgimage, .znParallax-background .zn-parallaxHack--top .kl-bg-source__video, .znParallax-background .zn-parallaxHack--top .kl-bg-source__iframe-wrapper { -webkit-transform: translate3d(-50%, 0%, 0); transform: translate3d(-50%, 0%, 0); } .znParallax-background .zn-parallaxHack--bottom .kl-bg-source__bgimage, .znParallax-background .zn-parallaxHack--bottom .kl-bg-source__video, .znParallax-background .zn-parallaxHack--bottom .kl-bg-source__iframe-wrapper { -webkit-transform: translate3d(-50%, -75%, 0); transform: translate3d(-50%, -75%, 0); } @media (max-width: 992px) { .znParallax-background .kl-bg-source__bgimage, .znParallax-background .kl-bg-source__iframe-wrapper, .znParallax-background .kl-bg-source__video, .znParallax-background .kl-bg-source__parallaxWrapper { -webkit-transform: none !important; transform: none !important; left: auto; } .znParallax-background .kl-bg-source__bgimage { -o-object-fit: cover; object-fit: cover; overflow: hidden; position: absolute; height: 100%; width: 100%; } } .znParallax-background .kl-bg-source__bgimage.wh, .znParallax-background .kl-bg-source__video.wh, .znParallax-background .kl-bg-source__iframe-wrapper.wh { height: 115% !important; } .znParallax-background .kl-bg-source__bgimage.ww, .znParallax-background .kl-bg-source__video.ww, .znParallax-background .kl-bg-source__iframe-wrapper.ww { width: 115% !important; } .znParallax-background.has-parallax-fallback .kl-bg-source__bgimage { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; -webkit-transform: none !important; transform: none !important; left: auto; } .znParallax-object { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .static-content__source.znParallax-object .kl-bg-source__video .kl-video, .static-content__source.znParallax-object .kl-bg-source__bgimage { height: calc(100% + 10%); top: -10%; } .znParallax-background .kl-video > div { overflow: visible !important; } /* Make sure section has transparent background */ .zn_pb_editor_enabled .zn_parallax:before { content: 'PAGE BUILDER MODE - PARALLAX EFFECT DISABLED'; position: absolute; right: 0; top: 0; background-color: #fff; border-bottom: 1px solid #2DB89C; border-left: 1px solid #2DB89C; color: #2DB89C; font-size: 12px; font-weight: 600; border-radius: 0 0 0 4px; padding: 10px 15px; opacity: .5; box-shadow: 0 2px 7px rgba(0, 0, 0, 0.55); z-index: 1; } .zn_pb_editor_enabled .zn_parallax:hover:before { opacity: .7; } .prt-hover-fadeout, .prt-hover-fadein { -webkit-transition: opacity .2s ease-out; transition: opacity .2s ease-out; } .prt-hover-fadein { opacity: 0; } /* Fallback for touch events */ @media (max-width: 991px) { .touchevents .prt-hover-fadein { opacity: 1; } } .prt-hover-slideout, .prt-hover-slidein { -webkit-transition: all .2s ease-out; transition: all .2s ease-out; } .prt-hover-slideout { overflow: hidden; max-height: 200px; } .prt-hover-slidein { overflow: hidden; max-height: 0; opacity: 0; } /* Fallback for touch events */ @media (max-width: 991px) { .touchevents .prt-hover-slidein { opacity: 1; max-height: none; } } .zn_pb_editor_enabled .prt-hover-fadein, .zn_pb_editor_enabled .prt-hover-fadeout, .zn_pb_editor_enabled .prt-hover-slideout, .zn_pb_editor_enabled .prt-hover-slidein { opacity: 1; } .zn_pb_editor_enabled .prt-hover-slideout, .zn_pb_editor_enabled .prt-hover-slidein { max-height: 200px; } /* FlexBox grid toolkit */ .fxb, .fxb-row { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .fxb-row-col { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } /* Flexbox Column */ .fxb-col { -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; } /* Flex Wrapping */ .fxb { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } /* Vertical Axis */ .fxb-start-y { -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; -ms-grid-row-align: flex-start; align-items: flex-start; } .fxb-center-y { -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; -ms-grid-row-align: center; align-items: center; } .fxb-end-y { -webkit-box-align: end; -webkit-align-items: flex-end; -ms-flex-align: end; -ms-grid-row-align: flex-end; align-items: flex-end; } /* Horizontal Axis */ .fxb-start-x { -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; } .fxb-center-x { -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } .fxb-end-x { -webkit-box-pack: end; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end; } /* Flex Scaling settings */ .fxb-basis-auto { -webkit-flex-basis: auto; -ms-flex-preferred-size: auto; flex-basis: auto; } .fxb-basis-20 { -webkit-flex-basis: 20%; -ms-flex-preferred-size: 20%; flex-basis: 20%; } .fxb-basis-50 { -webkit-flex-basis: 50%; -ms-flex-preferred-size: 50%; flex-basis: 50%; } .fxb-basis-0 { -webkit-flex-basis: 0; -ms-flex-preferred-size: 0; flex-basis: 0; } /* Flex Grow */ .fxb-grow-0 { -webkit-box-flex: 0; -webkit-flex-grow: 0; -ms-flex-positive: 0; flex-grow: 0; } .fxb-shrink-0 { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } /* MQ's */ @media (min-width: 768px) and (max-width: 991px) { .fxb-row-col-md { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .fxb-md-half { -webkit-flex-basis: 50%; -ms-flex-preferred-size: 50%; flex-basis: 50%; } .fxb-md-full { -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; } .fxb-md-wrap { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } } @media (max-width: 767px) { .fxb-row-col-sm { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .fxb-sm-half { -webkit-flex-basis: 50%; -ms-flex-preferred-size: 50%; flex-basis: 50%; } .fxb-sm-full { -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; } .fxb-sm-wrap { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } } /* Fallback - no flexbox */ .no-flexbox .fxb-row { display: table; width: 100%; } .no-flexbox [class*="fxb-col-"] { display: table-cell; vertical-align: middle; } .no-flexbox .fxb-end-x { text-align: right; } .no-flexbox .fxb-center-x { text-align: center; } .no-flexbox .sh-component { display: inline-block; vertical-align: middle; text-align: start; } .no-flexbox .site-header-main-right-ext { display: table-row; } @media (min-width: 768px) { .no-flexbox .site-header-top-left, .no-flexbox .site-header-top-right, .no-flexbox .site-header-main-left, .no-flexbox .site-header-main-right, .no-flexbox .site-header-main-center, .no-flexbox .site-header-bottom-left, .no-flexbox .site-header-bottom-center, .no-flexbox .site-header-bottom-right, .no-flexbox .header--oldstyles > .fxb-row > .fxb-col { display: table-cell; vertical-align: middle; } } /* BOTTOM MASKS */ .kl-mask { z-index: 1; position: absolute; width: 100%; left: 0; pointer-events: none; } .kl-topmask { top: 0; } .kl-bottommask { bottom: 0; } .fake-loading ~ .kl-mask { z-index: 2; } .kl-mask--light .bmask-bgfill { fill: #F5F5F5; } .kl-mask--dark .bmask-bgfill { fill: #1A1A1A; -webkit-filter: none; filter: none; } /* Shadow up mask Simple */ .maskcontainer--shadow_simple { border-bottom: 0 !important; } .kl-mask--shadow_simple { height: 6px; background: url(../images/shadow-up.png) no-repeat center bottom; z-index: 2; border-bottom: 0; box-sizing: content-box; background: -webkit-radial-gradient(50% 100% ellipse, rgba(0, 0, 0, 0.3) 0, transparent 70%); background: radial-gradient(ellipse at 50% 100%, rgba(0, 0, 0, 0.3) 0, transparent 70%); } .kl-topmask.kl-mask--shadow_simple { -webkit-transform: scaleY(-1); transform: scaleY(-1); } /* Shadow Down mask Simple */ .maskcontainer--shadow_simple_down { border-bottom: 0 !important; } .kl-mask--shadow_simple_down { bottom: -10px; height: 10px; background: url(../images/shadow-down.png) no-repeat center top; opacity: .6; background: -webkit-radial-gradient(50% 0% ellipse, rgba(0, 0, 0, 0.3) 0, transparent 70%); background: radial-gradient(ellipse at 50% 0%, rgba(0, 0, 0, 0.3) 0, transparent 70%); } .kl-topmask.kl-mask--shadow_simple_down { -webkit-transform: scaleY(-1); transform: scaleY(-1); } /* Shadow up mask - width border and arrow */ .maskcontainer--shadow { border-bottom: 0 !important; } .kl-mask--shadow { height: 6px; background: url(../images/shadow-up.png) no-repeat center bottom; z-index: 2; border-bottom: 6px solid #FFFFFF; box-sizing: content-box; background: -webkit-radial-gradient(50% 100% ellipse, rgba(0, 0, 0, 0.3) 0, transparent 70%); background: radial-gradient(ellipse at 50% 100%, rgba(0, 0, 0, 0.3) 0, transparent 70%); } .kl-mask--shadow:after { content: ''; position: absolute; bottom: -18px; left: 50%; border: 6px solid transparent; border-top-color: #fff; margin-left: -6px; } .kl-topmask.kl-mask--shadow { -webkit-transform: scaleY(-1); transform: scaleY(-1); } /* Shadow up & down mask */ .maskcontainer--shadow_ud { border-bottom: 0 !important; } .kl-mask--shadow_ud { height: 12px; background: url(../images/shadow-up.png) no-repeat center bottom; z-index: 2; border-bottom: 6px solid #FFFFFF; background: -webkit-radial-gradient(50% 100% ellipse, rgba(0, 0, 0, 0.3) 0, transparent 70%); background: radial-gradient(ellipse at 50% 100%, rgba(0, 0, 0, 0.3) 0, transparent 70%); } .kl-mask--shadow_ud:after { content: ''; position: absolute; bottom: -17px; left: 50%; border: 6px solid transparent; border-top-color: #fff; margin-left: -6px; } .kl-mask--shadow_ud:before { content: ''; position: absolute; bottom: -16px; left: 0; width: 100%; height: 10px; background: url(../images/shadow-down.png) no-repeat center top; opacity: .6; background: -webkit-radial-gradient(50% 0% ellipse, rgba(0, 0, 0, 0.3) 0, transparent 70%); background: radial-gradient(ellipse at 50% 0%, rgba(0, 0, 0, 0.3) 0, transparent 70%); } .kl-mask--dark.kl-mask--shadow_ud, .kl-mask--dark.kl-mask--shadow { border-bottom-color: #1F1F1F; } .kl-mask--dark.kl-mask--shadow_ud:after, .kl-mask--dark.kl-mask--shadow:after { border-top-color: #1F1F1F; } /* Mask 1 */ .maskcontainer--mask1 { border-bottom: 0 !important; padding-bottom: 30px; } .kl-mask--mask1 { height: 27px; z-index: 99; background: url(../images/bottom_mask.png) no-repeat center top; } /* Mask 2 */ .maskcontainer--mask2 { border-bottom: 0 !important; padding-bottom: 40px; } .kl-mask--mask2 { z-index: 99; height: 33px; background: url(../images/bottom_mask2.png) no-repeat center top; } /* Mask 3 */ .maskcontainer--mask3 { border-bottom: 0 !important; padding-bottom: 35px; } .kl-mask--mask3 { height: 57px; } .kl-mask--mask3 .svgmask { position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); margin-bottom: -15px; } .kl-mask--mask3 .glyphicon { position: absolute; bottom: 5px; left: 50%; display: block; width: 30px; text-align: center; font-size: 22px; opacity: 0.2; height: 15px; top: auto; -webkit-transform: translateX(-50%); transform: translateX(-50%); margin-left: 1px; } .kl-mask--dark.kl-mask--mask3 .glyphicon { opacity: .5; } .kl-topmask.kl-mask--mask3 { -webkit-transform: scaleY(-1); transform: scaleY(-1); } /* Mask 4 */ .maskcontainer--mask4 { border-bottom: 0 !important; padding-bottom: 40px; } .kl-mask--mask4 { height: 27px; } .kl-mask--mask4 .svgmask { position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .kl-topmask.kl-mask--mask4 { -webkit-transform: scaleY(-1); transform: scaleY(-1); } /* Mask 3 and 4, left or right aligned */ @media (min-width: 1200px) { .kl-mask--mask3 .svgmask-right, .kl-mask--mask3 .svgmask-right + .glyphicon, .kl-mask--mask4 .svgmask-right { -webkit-transform: translateX(calc(-50% + 510px)); transform: translateX(calc(-50% + 510px)); } .kl-mask--mask3 .svgmask-left, .kl-mask--mask3 .svgmask-left + .glyphicon, .kl-mask--mask4 .svgmask-left { -webkit-transform: translateX(calc(-50% - 510px)); transform: translateX(calc(-50% - 510px)); } /* 960px layout */ .res960 .kl-mask--mask3 .svgmask-right, .res960 .kl-mask--mask3 .svgmask-right + .glyphicon, .res960 .kl-mask--mask4 .svgmask-right { -webkit-transform: translateX(calc(-50% + 410px)); transform: translateX(calc(-50% + 410px)); } .res960 .kl-mask--mask3 .svgmask-left, .res960 .kl-mask--mask3 .svgmask-left + .glyphicon, .res960 .kl-mask--mask4 .svgmask-left { -webkit-transform: translateX(calc(-50% - 410px)); transform: translateX(calc(-50% - 410px)); } } @media (min-width: 992px) and (max-width: 1199px) { .kl-mask--mask3 .svgmask-right, .kl-mask--mask3 .svgmask-right + .glyphicon, .kl-mask--mask4 .svgmask-right { -webkit-transform: translateX(calc(-50% + 410px)); transform: translateX(calc(-50% + 410px)); } .kl-mask--mask3 .svgmask-left, .kl-mask--mask3 .svgmask-left + .glyphicon, .kl-mask--mask4 .svgmask-left { -webkit-transform: translateX(calc(-50% - 410px)); transform: translateX(calc(-50% - 410px)); } } @media (min-width: 768px) and (max-width: 991px) { .kl-mask--mask3 .svgmask-right, .kl-mask--mask3 .svgmask-right + .glyphicon, .kl-mask--mask4 .svgmask-right { -webkit-transform: translateX(calc(-50% + 300px)); transform: translateX(calc(-50% + 300px)); } .kl-mask--mask3 .svgmask-left, .kl-mask--mask3 .svgmask-left + .glyphicon, .kl-mask--mask4 .svgmask-left { -webkit-transform: translateX(calc(-50% - 300px)); transform: translateX(calc(-50% - 300px)); } } @media (max-width: 767px) { .kl-mask--mask3 .svgmask-right, .kl-mask--mask3 .svgmask-right + .glyphicon, .kl-mask--mask4 .svgmask-right, .kl-mask--mask3 .svgmask-left, .kl-mask--mask3 .svgmask-left + .glyphicon, .kl-mask--mask4 .svgmask-left { -webkit-transform: translateX(-50%); transform: translateX(-50%); } } /* Mask 5 */ .maskcontainer--mask5 { border-bottom: 0 !important; padding-bottom: 75px; } .kl-mask--mask5 { height: 64px; } .kl-mask--mask5 .svgmask { position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .kl-mask--mask5 .bmask-customfill { -webkit-transform: translateY(-1px); transform: translateY(-1px); } .kl-topmask.kl-mask--mask5 { -webkit-transform: scaleY(-1); transform: scaleY(-1); } /* Hack for safari only to hide shadow */ .is-safari .svgmask .bmask-bgfill, .is-safari .kl-mask--mask3 .bmask-bgfill, .is-safari .kl-mask--mask4 .bmask-bgfill { -webkit-filter: none; filter: none; } /* Mask 6 */ .maskcontainer--mask6 { border-bottom: 0 !important; padding-bottom: 70px; } .kl-mask--mask6 { height: 57px; } .kl-mask--mask6 .svgmask { position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .kl-topmask.kl-mask--mask6 { -webkit-transform: scaleY(-1); transform: scaleY(-1); } .kl-mask--mask7 { height: 0; overflow: hidden; padding-bottom: 2.8%; bottom: -1px; } .kl-topmask.kl-mask--mask7 { -webkit-transform: scaleY(-1); transform: scaleY(-1); top: -1px; } .kl-mask--mask7 .skewmask-block { position: absolute; width: 100%; height: 100%; background: white; top: 0; left: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .kl-mask--mask7.mask7l .skewmask-block { -webkit-transform-origin: 100% 0; transform-origin: 100% 0; -webkit-transform: skewY(-1.6deg); transform: skewY(-1.6deg); } .kl-mask--mask7.mask7r .skewmask-block { -webkit-transform-origin: 0 0; transform-origin: 0 0; -webkit-transform: skewY(1.6deg); transform: skewY(1.6deg); } .kl-mask--mask7.mask7big { padding-bottom: 7%; } .kl-mask--mask7.mask7big.mask7l .skewmask-block { -webkit-transform: skewY(-4deg); transform: skewY(-4deg); } .kl-mask--mask7.mask7big.mask7r .skewmask-block { -webkit-transform: skewY(4deg); transform: skewY(4deg); } .kl-mask--mask8 { height: 57px; } .kl-mask--mask8 .svgmask { position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .kl-topmask.kl-mask--mask8 { -webkit-transform: scaleY(-1); transform: scaleY(-1); } .kl-mask--mask8.mask8b { height: 126px; } .zn_section { position: relative; } /* Slick Slider */ ul.znSlickSlider { list-style: none; margin: 0; padding: 0; } .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; left: 0; top: 0; display: block; } .slick-track:before, .slick-track:after { content: ""; display: table; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { display: none; float: left; height: 100%; min-height: 1px; } .slick-slide:active, .slick-slide:focus { outline: none; } [dir="rtl"] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } .slick--showOnMouseover .znSlickNav { opacity: 0; -webkit-transition: opacity .15s ease-out; transition: opacity .15s ease-out; } .slick--showOnMouseover:hover .znSlickNav { opacity: 1; } .znSlickNav-arr, .znSlickNav-arr svg { width: 18px; height: 18px; cursor: pointer; } .znSlickNav-arr polyline { -webkit-transition: all .15s ease-out; transition: all .15s ease-out; stroke: #141414; } .znSlickNav-arr:hover polyline { stroke-width: 35; } .znSlickNav-arr:active polyline { stroke-width: 50; } .znSlickNav-arr.znSlickNav-prev { text-align: left; } .znSlickNav-arr.znSlickNav-next { text-align: right; } .slick-dots, .slick-dots ul { margin: 0; padding: 0; list-style: none; } .slick-dots li { display: inline-block; margin: 0; } .slick-dots li button { padding: 5px; background-color: black; opacity: .5; width: 6px; height: 6px; display: block; border-radius: 50%; text-indent: 200%; overflow: hidden; box-sizing: content-box; border: none; background-clip: content-box; -webkit-transition: opacity .2s; transition: opacity .2s; } .slick-dots li button:active, .slick-dots li button:focus { outline: none; } .slick-dots li.slick-active button { opacity: .8; } .znSlickNav--light .slick-dots li button, .element-scheme--dark .slick-dots li button { background-color: white; } .znSlickNav--light polyline { stroke: #ececec; } .u-slick-show1stOnly:not(.slick-slide) ~ .u-slick-show1stOnly { display: none; } .kw-gridSymbol { width: 16px; height: 16px; display: inline-block; position: relative; margin: 0 10px; } .kw-gridSymbol:before { content: ''; border-radius: 2px; width: 4px; height: 4px; background-color: rgba(0, 0, 0, 0.5); display: block; box-shadow: 6px 0 0 rgba(0, 0, 0, 0.5), 12px 0 0 rgba(0, 0, 0, 0.5), 0 6px 0 rgba(0, 0, 0, 0.5), 6px 6px 0 rgba(0, 0, 0, 0.5), 12px 6px 0 rgba(0, 0, 0, 0.5), 0 12px 0 rgba(0, 0, 0, 0.5), 6px 12px 0 rgba(0, 0, 0, 0.5), 12px 12px 0 rgba(0, 0, 0, 0.5); } /* lazy */ img[data-echo] { display: block; height: 0; padding-bottom: 55%; width: 100%; background: url(../images/ring-alt.svg) no-repeat center transparent; opacity: 0.3; } img.is-loaded { opacity: 1; -webkit-transition: opacity .2s; transition: opacity .2s; } .tp-caption img { max-width: none; } /* ============================================================================= // SITE HEADER ---- HEADER STYLES ---- HEADER STYLE 1 ---- HEADER STYLE 2 ---- HEADER STYLE 3 ---- HEADER STYLE 5 ---- HEADER STYLE 6 ---- HEADER STYLE 7 ---- HEADER STYLE 8 ---- HEADER STYLE 9 ---- MAIN NAVIGATION ---- TOP NAV ---- HEADER NAV. ---- CALL TO ACTION ---- HEADER SEARCH ---- SUPPORT PANEL ---- LOGIN / REGISTER POPUPS ---- LANGUAGES ---- CART ---- INFOCARD ---- SOCIAL ICONS ---- STICKY LOGO ---- STICKY HEADER ---- CHASER // =========================================================================== */ .site-header-top-wrapper { position: relative; } /* Header component-item */ .sh-component { margin-left: 10px; margin-right: 10px; } /* Reset first and last component-item in header */ .site-header .site-header-top-left .sh-component:first-child, .site-header .site-header-main-left .sh-component:first-child, .site-header .site-header-bottom-left .sh-component:first-child { margin-left: 0 !important; } .site-header .site-header-top-right .sh-component:last-child, .site-header .site-header-main-right .sh-component:last-child, .site-header .site-header-bottom-right .sh-component:last-child { margin-right: 0 !important; } /* SITE LOGO */ .site-logo { width: 100%; margin: 0; display: table; } .site-logo-anch { padding: 0; display: table-cell; position: relative; vertical-align: middle; text-align: center; } .site-logo-img { max-width: 100% !important; } /* Logo size preset */ .logosize--contain .site-logo-img { width: auto; height: 100%; padding: 10px 0; } /* MAIN NAVIGATION */ .main-nav ul { list-style: none; padding: 0; margin: 0; } .main-nav > ul:after, .main-nav > ul:before { display: table; content: " "; } .main-nav > ul:after { clear: both; } .main-nav ul li { margin-bottom: 0; } .main-nav ul .menu-item a { display: block; font-weight: 400; } .main-nav .menu-item > a[href="#"] { cursor: default; } /* FIRST LEVEL */ .main-nav > ul > .menu-item, .main-nav > ul > .logo-menu-wrapper { float: left; margin-top: 0; margin-left: 5px; } .main-nav > ul > .menu-item:not(.menu-item-mega-parent) { position: relative; } .main-nav > ul > .menu-item:first-child { margin-left: 0; } .main-nav > ul > .menu-item > a { position: relative; padding: 6px 12px; font-size: 14px; line-height: 1; color: #fff; z-index: 1; font-weight: 600; -webkit-transition: padding .2s ease-in-out, -webkit-transform .2s ease-in-out; transition: padding .2s ease-in-out, -webkit-transform .2s ease-in-out; transition: padding .2s ease-in-out, transform .2s ease-in-out; transition: padding .2s ease-in-out, transform .2s ease-in-out, -webkit-transform .2s ease-in-out; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .mainnav--pointer-dash.main-nav > ul > .menu-item.menu-item-has-children > a:after { content: ''; opacity: 1; position: absolute; height: 1px; width: 7px; bottom: 3px; bottom: calc(50% - 12px); left: 17px; background-color: rgba(255, 255, 255, 0.4); -webkit-transition: opacity .2s ease-in-out; transition: opacity .2s ease-in-out; } .mainnav--pointer-arr.main-nav > ul > .menu-item.menu-item-has-children > a { padding-right: 30px; } .mainnav--pointer-arr.main-nav > ul > .menu-item.menu-item-has-children > a:after { content: "\e259"; position: absolute; font-size: 10px; top: 50%; right: 10px; -webkit-transform: translateY(-50%); transform: translateY(-50%); font-family: "Glyphicons Halflings"; font-style: normal; font-weight: 400; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .main-nav.mainnav--active-bg > ul > .menu-item > a:before { content: ''; opacity: 0; position: absolute; border-radius: 2px; height: 14px; width: 100%; top: 50%; left: 0; background-color: #cd2122; -webkit-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: height .2s ease-in-out; transition: height .2s ease-in-out; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: -1; } .main-nav.mainnav--active-uline > ul > .menu-item.active > a > span { border-bottom: 2px solid currentColor; padding-bottom: 3px; } .main-nav > ul > .menu-item.active > a, .main-nav > ul > .menu-item > a:hover, .main-nav > ul > .menu-item:hover > a { text-decoration: none; color: #fff; } .main-nav.mainnav--active-bg > ul > .menu-item.active > a:before, .main-nav.mainnav--active-bg > ul > .menu-item > a:hover:before, .main-nav.mainnav--active-bg > ul > .menu-item:hover > a:before { height: calc(14px + 16px); opacity: 1; } .mainnav--pointer-dash.main-nav > ul > .menu-item.active.menu-item-has-children > a:after, .mainnav--pointer-dash.main-nav > ul > .menu-item.menu-item-has-children > a:hover:after, .mainnav--pointer-dash.main-nav > ul > .menu-item.menu-item-has-children:hover > a:after { opacity: 0.7; } /* Smaller menu items on tablets */ @media screen and (min-width: 992px) and (max-width: 1199px) { .main-nav > ul > .menu-item { margin-left: 3px; } .main-nav > ul > .menu-item:first-child { margin-left: 0; } .main-nav > ul > .menu-item > a { font-size: 12px; padding: 6px; } } /* FIRST SUB-LEVEL */ .main-nav ul ul.sub-menu .menu-item { position: relative; } .main-nav ul ul.sub-menu ul { top: 100%; margin-top: 0; } .main-nav ul ul.sub-menu .menu-item a:not(:only-child):after { position: absolute; top: 50%; margin-top: -1px; right: 10px; content: ''; opacity: .6; background-color: rgba(0, 0, 0, 0.3); width: 10px; height: 2px; } .main-nav ul ul.sub-menu .menu-item a { min-width: 230px; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: rgba(0, 0, 0, 0.03); padding: 10px 20px; } .main-nav ul ul.sub-menu .menu-item a[href="#custom-separator"], .main-nav ul ul.sub-menu .menu-item.menuitem-separator > a { text-indent: -2999px; padding: 0; background-color: rgba(0, 0, 0, 0.05) !important; background-clip: padding-box; height: 5px; } .main-nav > ul > .menuitem-v-separator > a { text-indent: -2999px; padding: 0; background-color: rgba(0, 0, 0, 0.05) !important; background-clip: padding-box; height: 2em; width: 2px; } .main-nav > ul > .left-vertical-separator:before { content: ''; } .main-nav ul ul.sub-menu .menu-item.active > a, .main-nav ul ul.sub-menu .menu-item a:hover { color: #323232; background: rgba(0, 0, 0, 0.04); } /* REST OF SUB-LEVELS */ .main-nav ul ul.sub-menu, .main-nav .zn_mega_container { position: absolute; border-radius: 2px; border: 1px solid rgba(255, 255, 255, 0.8); box-shadow: 0 0 4px rgba(0, 0, 0, 0.4); background: #f5f5f5; padding: 6px 0; background: whitesmoke; } .main-nav > ul > .menu-item > ul.sub-menu:before { content: ''; display: block; position: absolute; top: -12px; left: 0; width: 100%; height: 12px; } /* hack for hovering properly even if there's a distance between the menu item and submenu */ .main-nav > ul > .menu-item > ul.sub-menu:after { content: ''; display: block; position: absolute; top: -11px; left: 14px; border: 6px solid transparent; border-bottom-width: 5px; border-bottom-color: #f5f5f5; } .main-nav ul ul.sub-menu .menu-item:hover > ul { left: 100%; top: -3px; opacity: 1; } /* MEGAMENU OVERRIDES */ .main-nav .zn_mega_container { border: 1px solid rgba(255, 255, 255, 0.8); box-shadow: 0 0 4px rgba(0, 0, 0, 0.4); background: #f5f5f5; padding: 6px 0; background: rgba(245, 245, 245, 0.95); position: absolute; padding: 20px 0; margin-top: 10px; } .main-nav .zn_mega_container:before { content: ''; display: block; position: absolute; top: -12px; left: 0; width: 100%; height: 12px; } /* fix for top hover */ .main-nav .zn_mega_container .menu-item a { padding: 10px 0; } .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):hover, .main-nav .zn_mega_container .menu-item.active > a:not(.zn_mega_title) { color: #323232; } .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):before { content: ''; display: block; position: absolute; width: 0; height: 2px; background-color: #cd2122; bottom: 0; -webkit-transition: width 0.15s cubic-bezier(0.68, 0, 0.265, 1); transition: width 0.15s cubic-bezier(0.68, 0, 0.265, 1); } .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):hover:before, .main-nav .zn_mega_container .menu-item.active > a:not(.zn_mega_title):before { width: 100%; } .main-nav .zn_mega_container .zn_mega_title_hide { display: none; } .main-nav .zn_mega_container .menu-item a.zn_mega_title, .main-nav div.zn_mega_container ul .menu-item:last-child > a.zn_mega_title { font-size: 14px; padding-left: 0; padding-right: 0; border-bottom-width: 1px; border-bottom-style: solid; padding: 12px 0px; margin-bottom: 15px; font-weight: 600; text-transform: uppercase; border-bottom-color: rgba(0, 0, 0, 0.1); color: #333; } .main-nav .zn_mega_container .zn_mega_row_start { margin-top: 20px; } .main-nav .zn_mega_container a.zn_mega_title[href="#custom-invisible"], .main-nav .zn_mega_container .menu-item:last-child a.zn_mega_title[href="#custom-invisible"], .main-nav .zn_mega_container .menuitem-transparent > a { color: transparent !important; } .main-nav .zn_mega_container .menuitem-invisible > a { visibility: hidden; } /* Shared Submenu + Mega menu styles */ .main-nav ul ul.sub-menu .menu-item a, .main-nav .zn_mega_container .menu-item a { font-size: 12px; color: #757575; position: relative; } /* Dark dropdown menu */ .nav-mm--dark.main-nav ul ul.sub-menu .menu-item a:not(:only-child):after { background-color: rgba(255, 255, 255, 0.1); } .nav-mm--dark.main-nav ul ul.sub-menu .menu-item a { border-bottom-color: rgba(255, 255, 255, 0.05); color: #8A8A8A; } .nav-mm--dark.main-nav ul ul.sub-menu .menu-item a[href="#custom-separator"], .nav-mm--dark.main-nav ul ul.sub-menu .menu-item.menuitem-separator > a { background-color: rgba(255, 255, 255, 0.05) !important; } .nav-mm--dark.main-nav ul ul.sub-menu .menu-item.active > a, .nav-mm--dark.main-nav ul ul.sub-menu .menu-item a:hover { color: #CDCDCD; background: rgba(255, 255, 255, 0.04); } .nav-mm--dark.main-nav ul ul.sub-menu, .nav-mm--dark.main-nav .zn_mega_container { border-color: rgba(0, 0, 0, 0.8); box-shadow: 0 0 4px rgba(0, 0, 0, 0.4); background: #0a0a0a; } .nav-mm--dark.main-nav > ul > .menu-item > ul.sub-menu:after { border-bottom-color: #0a0a0a; } .nav-mm--dark.main-nav .zn_mega_container { border-color: rgba(0, 0, 0, 0.8); box-shadow: 0 0 4px rgba(0, 0, 0, 0.4); background: rgba(5, 5, 5, 0.95); } .nav-mm--dark.main-nav .zn_mega_container .menu-item a { color: #8A8A8A; } .nav-mm--dark.main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):hover, .nav-mm--dark.main-nav .zn_mega_container .menu-item.active > a:not(.zn_mega_title) { color: #CDCDCD; } .nav-mm--dark.main-nav .zn_mega_container .menu-item a.zn_mega_title, .nav-mm--dark.main-nav div.zn_mega_container ul .menu-item:last-child > a.zn_mega_title { border-bottom-color: rgba(255, 255, 255, 0.1); color: #CCCCCC; } /* ANIMATIONS */ .main-nav ul ul.sub-menu, .main-nav .zn_mega_container { left: -9999px; opacity: 0; visibility: hidden; -webkit-transition: opacity .4s ease, top .45s ease; transition: opacity .4s ease, top .45s ease; } .main-nav .zn_mega_container { margin-left: 15px; margin-right: 15px; width: calc(100% - 30px); } .main-nav ul ul.sub-menu { top: 120%; } .main-nav > ul > .menu-item > ul.sub-menu { -webkit-transform: translateY(10px); transform: translateY(10px); } .main-nav .zn_mega_container { margin-top: 30px; -webkit-transition: opacity .4s ease, top .45s ease, margin-top .4s ease; transition: opacity .4s ease, top .45s ease, margin-top .4s ease; } .main-nav ul .menu-item:hover > ul, .main-nav ul .menu-item:hover > .zn_mega_container { left: 0; opacity: 1; visibility: visible; z-index: 100; } .main-nav ul .menu-item:hover > ul { top: 100%; } .main-nav ul .menu-item:hover > .zn_mega_container { margin-top: 10px; } /* Fix submenu exiting the page */ .main-nav ul > .menu-item:hover > ul.zn_menu_on_left { right: 0; left: auto; } .main-nav > ul > .menu-item > ul.zn_menu_on_left.sub-menu:after { left: auto; right: 14px; } .main-nav ul > .menu-item:hover > ul ul.zn_menu_on_left { right: 100%; left: auto; } .main-nav ul ul .menu-item a { -webkit-transition: padding-left .35s ease, border-right .35s ease; transition: padding-left .35s ease, border-right .35s ease; } /* MENU BADGES */ .main-nav ul .zn-mega-new-item { position: absolute; line-height: 1; padding: 5px; text-transform: initial; font-size: 10px; top: 50%; right: 3px; background-color: #cd2122; color: #fff; border-radius: 2px; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .main-nav ul ul .zn-mega-new-item { left: auto; right: 10px; } .main-nav ul ul.sub-menu .menu-item a:not(:only-child) .zn-mega-new-item { right: 23px; } .main-nav .zn_mega_container ul .zn-mega-new-item { right: 3px; } /* Responsive Menu */ .zn-res-menuwrapper, .zn-res-menu-nav { display: block; } .zn-res-menuwrapper { margin-top: 10px; margin-bottom: 10px; } .zn-res-menu-nav .zn-mega-new-item { display: none; } .zn-res-menu-nav, .zn-res-menu-nav ul, .zn-res-menu-nav li { padding: 0; margin: 0; list-style: none; } .zn-res-menu-nav * { -webkit-backface-visibility: hidden; backface-visibility: hidden; border-color: rgba(0, 0, 0, 0.15); } .zn_res_menu_visible { overflow-x: hidden; } .zn_res_menu_visible .zn-res-menu-nav, .zn_res_menu_visible .zn-res-menu-nav li ul.sub-menu, .zn_res_menu_visible .zn-res-menu-nav li div.zn_mega_container { display: block; } .zn-res-menu-nav, .zn-res-menu-nav li ul.sub-menu, .zn-res-menu-nav li div.zn_mega_container { right: 0; top: 0; position: absolute; width: 100%; height: 100%; background: white; overflow: hidden; z-index: 10000; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-overflow-scrolling: touch; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); -webkit-transition: -webkit-transform 500ms ease; transition: -webkit-transform 500ms ease; transition: transform 500ms ease; transition: transform 500ms ease, -webkit-transform 500ms ease; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; display: none; max-width: 100%; } @media (min-width: 767px) { .zn-res-menu-nav, .zn-res-menu-nav li ul.sub-menu, .zn-res-menu-nav li div.zn_mega_container { max-width: 400px; } .zn-res-menu-nav.zn-menu-visible, .zn-res-menu-nav li ul.sub-menu.zn-menu-visible, .zn-res-menu-nav li div.zn_mega_container.zn-menu-visible { box-shadow: 0 0 40px rgba(0, 0, 0, 0.3); } } .zn-res-menu-nav.zn-menu-visible, .zn-res-menu-nav ul.zn-menu-visible.sub-menu, .zn-res-menu-nav li div.zn-menu-visible { -webkit-transform: translate3d(0%, 0, 0); transform: translate3d(0%, 0, 0); } .zn-res-menu-nav .zn_mega_container { padding-left: 0; padding-right: 0; } .zn-res-menu-nav .zn_mega_title { margin-right: 0; text-align: left; font-weight: 600; text-transform: uppercase; color: rgba(0, 0, 0, 0.75); } .zn-res-menu-nav .zn_mega_container .zn_mega_title_hide { display: none; } .zn-res-menu-nav li, .zn-res-menu-nav .zn_res_menu_go_back { position: initial; border-bottom: 1px solid rgba(0, 0, 0, 0.15); } .zn-res-menu-nav li.menu-item-has-children > a.zn_mega_title { border-bottom: 1px solid rgba(0, 0, 0, 0.15); } .zn-res-menu-nav .zn_mega_container { width: 100%; } .zn-res-menu-nav .zn_mega_container li { width: 100%; float: none; } .zn-res-menu-nav li a { padding: 12px 28px 11px; display: block; font-weight: 400; color: rgba(0, 0, 0, 0.45); } .zn-res-menu-nav li .zn_res_submenu_trigger + a { margin-right: 49px; } .zn-res-menu-nav a[href="#custom-separator"] .zn-res-menu-nav .menuitem-separator > a { display: none; } .zn-res-menu-nav li.active > a, .zn-res-menu-nav li a:hover { color: rgba(0, 0, 0, 0.85); } .zn-res-menu-nav li.active > a { background-color: rgba(0, 0, 0, 0.05); } /* RESPONSIVE SUBMENUS */ .zn-res-menu-nav a { cursor: pointer; } .zn-res-menu-nav .zn_res_has_submenu > span, .zn-res-menu-nav .zn_res_menu_go_back > span { position: absolute; right: 0; width: 49px; height: 45px; border-left: 1px solid rgba(0, 0, 0, 0.15); line-height: 45px; vertical-align: middle; text-align: center; cursor: pointer; color: rgba(0, 0, 0, 0.45); top: auto; } .zn-res-menu-nav .zn_res_menu_go_back > a { text-align: center; padding-right: 0; padding-left: 49px; font-size: 14px; } .zn-res-menu-nav .zn_res_menu_go_back > span { left: 0; right: auto; border-left: none; border-right: 1px solid rgba(0, 0, 0, 0.15); } .znResMenu-dark.zn-res-menu-nav * { border-color: rgba(255, 255, 255, 0.15); } .znResMenu-dark.zn-res-menu-nav, .znResMenu-dark.zn-res-menu-nav li ul.sub-menu, .znResMenu-dark.zn-res-menu-nav li div.zn_mega_container { background: #1b1b1b; } .znResMenu-dark.zn-res-menu-nav .zn_mega_title { color: rgba(255, 255, 255, 0.75); } .znResMenu-dark.zn-res-menu-nav li, .znResMenu-dark.zn-res-menu-nav .zn_res_menu_go_back { border-bottom: 1px solid rgba(255, 255, 255, 0.15); } .znResMenu-dark.zn-res-menu-nav li.menu-item-has-children > a.zn_mega_title { border-bottom: 1px solid rgba(255, 255, 255, 0.15); } .znResMenu-dark.zn-res-menu-nav li a { color: rgba(255, 255, 255, 0.45); } .znResMenu-dark.zn-res-menu-nav li.active > a, .znResMenu-dark.zn-res-menu-nav li a:hover { color: rgba(255, 255, 255, 0.85); } .znResMenu-dark.zn-res-menu-nav li.active > a { background-color: rgba(255, 255, 255, 0.05); } .znResMenu-dark.zn-res-menu-nav .zn_res_has_submenu > span, .znResMenu-dark.zn-res-menu-nav .zn_res_menu_go_back > span { border-left: 1px solid rgba(255, 255, 255, 0.15); color: rgba(255, 255, 255, 0.45); } .znResMenu-dark.zn-res-menu-nav .zn_res_menu_go_back > span { border-right: 1px solid rgba(255, 255, 255, 0.15); } .main-nav .zn_mega_container.zn-megaMenuSmartArea { padding-top: 0; padding-bottom: 0; border: 0px; } .main-nav .zn_mega_container.zn-megaMenuSmartArea .container { width: 100%; } .main-nav .zn_mega_container.zn-megaMenuSmartArea .zn-megaMenuSmartArea-content:not(:only-child) { margin-bottom: 30px; } .main-nav .zn_mega_container.zn-megaMenuSmartArea .zn_mega_row_start { margin-bottom: 20px; } .main-nav .zn_mega_container.zn-megaMenuSmartArea .zn_mega_row_start:after, .main-nav .zn_mega_container.zn-megaMenuSmartArea .zn_mega_row_start:before { display: table; content: " "; } .main-nav .zn_mega_container.zn-megaMenuSmartArea .zn_mega_row_start:after { clear: both; } .zn-menuBurger { vertical-align: middle; position: relative; display: inline-block; width: 25px; height: 22px; margin-right: 10px; -webkit-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .2s ease-out; transition: .2s ease-out; cursor: pointer; opacity: .8; } .zn-menuBurger:hover, .zn-menuBurger.is-active { opacity: 1; } .zn-menuBurger span { display: block; position: absolute; width: 100%; background: rgba(255, 255, 255, 0.85); border-radius: 2px; opacity: 1; left: 0; -webkit-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; transition: .25s ease-in-out; } .zn-menuBurger[class*="--1--"] span { height: 1px; } .zn-menuBurger[class*="--2--"] span { height: 2px; } .zn-menuBurger[class*="--3--"] span { height: 3px; } .zn-menuBurger[class*="--4--"] span { height: 4px; } .zn-menuBurger[class*="--s"] { width: 20px; } .zn-menuBurger[class*="--s"] span:nth-child(1) { top: 0px; } .zn-menuBurger[class*="--s"] span:nth-child(2) { top: 6px; } .zn-menuBurger[class*="--s"] span:nth-child(3) { top: 12px; } .zn-menuBurger[class*="--m"] { width: 27px; } .zn-menuBurger[class*="--m"] span:nth-child(1) { top: 0px; } .zn-menuBurger[class*="--m"] span:nth-child(2) { top: 9px; } .zn-menuBurger[class*="--m"] span:nth-child(3) { top: 18px; } .zn-menuBurger--anim1.is-active span:nth-child(1) { -webkit-transform: rotate(135deg); transform: rotate(135deg); } .zn-menuBurger--anim1.is-active span:nth-child(2) { opacity: 0; left: -60px; } .zn-menuBurger--anim1.is-active span:nth-child(3) { -webkit-transform: rotate(-135deg); transform: rotate(-135deg); } .zn-menuBurger--anim1.is-active[class*="--s"] span:nth-child(1), .zn-menuBurger--anim1.is-active[class*="--s"] span:nth-child(3) { top: 6px; } .zn-menuBurger--anim1.is-active[class*="--m"] span:nth-child(1), .zn-menuBurger--anim1.is-active[class*="--m"] span:nth-child(3) { top: 8px; } .zn-menuBurger--anim2 span { -webkit-transform-origin: left center; transform-origin: left center; } .zn-menuBurger--anim2.is-active span:nth-child(1) { -webkit-transform: rotate(45deg) translateX(0) translateY(-1px); transform: rotate(45deg) translateX(0) translateY(-1px); } .zn-menuBurger--anim2.is-active span:nth-child(2) { width: 0%; opacity: 0; } .zn-menuBurger--anim2.is-active span:nth-child(3) { -webkit-transform: rotate(-45deg) translateX(0) translateY(1px); transform: rotate(-45deg) translateX(0) translateY(1px); } .zn-menuBurger--anim3.is-active span:nth-child(1) { -webkit-animation: upDown .25s ease-in-out; animation: upDown .25s ease-in-out; } .zn-menuBurger--anim3.is-active span:nth-child(2) { -webkit-animation: justRotate .25s ease-in-out; animation: justRotate .25s ease-in-out; } .zn-menuBurger--anim3.is-active span:nth-child(3) { -webkit-animation: downUp .25s ease-in-out; animation: downUp .25s ease-in-out; } @-webkit-keyframes upDown { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 50% { -webkit-transform: translateY(-6px); transform: translateY(-6px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes upDown { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 50% { -webkit-transform: translateY(-6px); transform: translateY(-6px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @-webkit-keyframes justRotate { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 100% { -webkit-transform: rotate(180deg); transform: rotate(180deg); } } @keyframes justRotate { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 100% { -webkit-transform: rotate(180deg); transform: rotate(180deg); } } @-webkit-keyframes downUp { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 50% { -webkit-transform: translateY(6px); transform: translateY(6px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes downUp { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 50% { -webkit-transform: translateY(6px); transform: translateY(6px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } /* TOP NAVIGATION */ .topnav { padding: 0; list-style: none; position: relative; } ul.topnav { margin-bottom: 0; } .topnav-li, .topnav .menu-item { float: left; position: relative; margin-left: 10px; margin-right: 10px; } .topnav-li:first-child { margin-left: 0; } .topnav-li:last-child { margin-right: 0; } .topnav-item, .topnav .menu-item > a { font-size: 11px; font-weight: 700; color: #fff; line-height: 24px; display: block; padding: 0; opacity: .8; } .topnav-li:hover > .topnav-item, .topnav-item:hover, .topnav .menu-item > a:hover { opacity: 1; } /* TopNav Drop Panel */ .topnav-drop-panel { position: absolute; left: auto; width: auto; min-width: 120px; height: 0; opacity: 0; visibility: hidden; margin-left: -11px; right: 0; z-index: 101; } .topnav-drop-panel-inner { margin: 4px; list-style: none; background: #f5f5f5; padding: 10px 5px; margin-top: 5px; position: relative; box-shadow: 0 0 5px rgba(0, 0, 0, 0.4); border-radius: 2px; } .topnav-drop-panel-inner:after { content: ""; top: -8px; position: absolute; right: 10px; border: 5px solid transparent; border-bottom-width: 4px; border-bottom-color: #f5f5f5; } .topnav-drop:hover .topnav-drop-panel { opacity: 1; height: auto; visibility: visible; } /* topnav dark */ .nav-th--dark .topnav-drop-panel-inner { background: #0A0A0A; } .nav-th--dark .topnav-drop-panel-inner:after { border-bottom-color: #0A0A0A; } @media (max-width: 767px) { .topnav-li { margin-left: 10px; } .topnav.navRight .topnav-li:last-child { margin-right: 0; } } /* Header top text */ .kl-header-toptext { font-size: 12px; line-height: 24px; position: relative; } /* TOP-HEAD NAVIGATION */ .zn_header_top_nav-wrapper { margin-left: 10px; } /* All but Small and Extra Small */ @media screen and (min-width: 1200px) { .zn_header_top_nav { margin-bottom: 0; } .topnav.zn_header_top_nav li { position: relative; } .topnav.zn_header_top_nav li a { font-weight: 400; } /* 2nd lvl+ */ .topnav.zn_header_top_nav li ul { display: block; list-style: none; margin-top: 10px; position: absolute; left: -2999px; z-index: 11; top: 100%; min-width: 150px; opacity: 0; visibility: hidden; padding: 8px 0 0; box-shadow: 0 5px 5px rgba(0, 0, 0, 0.15); border-radius: 2px; -webkit-transition: opacity .25s ease-out, visibility .25s ease-out, margin-top .25s ease-out; transition: opacity .25s ease-out, visibility .25s ease-out, margin-top .25s ease-out; } .topnav.zn_header_top_nav li:hover > ul { opacity: 1; visibility: visible; left: 0; margin-top: 0; } .topnav.zn_header_top_nav li:hover > ul ul { left: 99%; top: 4px; padding-top: 0px; } .topnav.zn_header_top_nav ul li { float: none; margin: 0; } .topnav.zn_header_top_nav ul li a { font-weight: 400; padding: 10px; font-size: 12px; padding: 6px 0 6px 10px; display: block; border-top: 1px solid rgba(0, 0, 0, 0.1); -webkit-transition: all .1s ease-out; transition: all .1s ease-out; } .sh--light .topnav.zn_header_top_nav ul .menu-item > a, .sh--dark .topnav.zn_header_top_nav ul .menu-item > a, .sh--gray .topnav.zn_header_top_nav ul .menu-item > a { color: #6F6B6B; background: #f5f5f5; } .sh--light .topnav.zn_header_top_nav ul .menu-item > a:hover, .sh--dark .topnav.zn_header_top_nav ul .menu-item > a:hover, .sh--gray .topnav.zn_header_top_nav ul .menu-item > a:hover, .sh--light .topnav.zn_header_top_nav ul .menu-item.active > a, .sh--dark .topnav.zn_header_top_nav ul .menu-item.active > a, .sh--gray .topnav.zn_header_top_nav ul .menu-item.active > a { color: #444; background: #fff; } .topnav.zn_header_top_nav ul li:first-child > a { border-radius: 2px 2px 0 0; border-top-width: 0; } .topnav.zn_header_top_nav ul li:last-child > a { border-radius: 0 0 2px 2px; } } /* Only Extra small */ @media screen and (max-width: 1199px) { .zn_header_top_nav-wrapper { position: relative; } /* Trigger */ .headernav-trigger { display: block; width: 18px; height: 14px; position: relative; cursor: pointer; } .headernav-trigger:before { content: ''; display: block; border-radius: 2px; height: 2px; width: 100%; background-color: #fff; box-shadow: 0 6px 0 #fff, 0 12px 0 #fff; opacity: .7; } /* List submenus */ .topnav.zn_header_top_nav { display: none; float: none; margin: 0; list-style: none; margin-top: 0px; min-width: 240px; background-color: #fff; padding: 0; border-radius: 2px; position: absolute; top: 25px; z-index: 11; } .topnav.zn_header_top_nav { right: -10px; } .topnav.zn_header_top_nav ul, .topnav.zn_header_top_nav li { display: block; width: 100%; float: none; margin: 0; padding: 0; } .topnav.zn_header_top_nav li a { width: 100%; font-weight: 400; font-size: 11px; padding: 6px 10px; display: block; border-top: 1px solid #eee; } .topnav.zn_header_top_nav ul a { padding-left: 20px; } .topnav.zn_header_top_nav ul ul a { padding-left: 30px; } .sh--light .topnav.zn_header_top_nav .menu-item > a, .sh--dark .topnav.zn_header_top_nav .menu-item > a, .sh--gray .topnav.zn_header_top_nav .menu-item > a { color: #6F6B6B; background: #FFF; } .sh--light .topnav.zn_header_top_nav .menu-item > a:hover, .sh--dark .topnav.zn_header_top_nav .menu-item > a:hover, .sh--gray .topnav.zn_header_top_nav .menu-item > a:hover, .sh--light .topnav.zn_header_top_nav .menu-item.active > a, .sh--dark .topnav.zn_header_top_nav .menu-item.active > a, .sh--gray .topnav.zn_header_top_nav .menu-item.active > a { color: #444; background: #f5f5f5; } .zn_header_top_nav-wrapper.is-opened .zn_header_top_nav { display: block; } .zn_header_top_nav-wrapper.is-opened .headernav-trigger { opacity: 1; } } /* CALL TO ACTION IN HEADER */ .kl-cta-ribbon, .kl-cta-lined { position: relative; font-size: 11px; font-weight: 700; color: #fff; text-align: center; padding: 10px 10px 5px; border-radius: 2px; margin-left: 20px; z-index: 1; } .kl-cta-ribbon .trisvg { position: absolute; top: 100%; left: 0; width: 100%; height: 5px; } .kl-cta-ribbon .trisvg path { fill: #cd2122; } .kl-cta-ribbon:hover .trisvg path, .kl-cta-ribbon:focus .trisvg path { fill: #fff; } .kl-cta-ribbon { display: block; background: #cd2122; } .kl-cta-ribbon:hover, .kl-cta-ribbon:focus { background: #fff; color: #000; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3); } .kl-cta-ribbon strong { font-size: 17px; font-weight: 900; display: block; } @media (max-width: 767px) { .kl-cta-ribbon { margin-top: 3px; } } .kl-cta-lined { background-color: transparent; box-shadow: none; padding: 8px 20px 9px; } /* Custom CTA Button */ .kl-cta-custom span { display: inline-block; vertical-align: middle; } .kl-cta-custom.cta-icon--before [data-zniconfam] { margin-right: 8px; } .kl-cta-custom.cta-icon--after [data-zniconfam] { margin-left: 8px; } /* SEARCH PANEL */ .header-search.headsearch--def { position: relative; z-index: 100; } .headsearch--def .header-search-container { display: none; position: absolute; right: -10px; padding: 30px; background: #f4f4f4; width: 240px; border-bottom: 1px solid #fff; z-index: 1; box-shadow: 0 3px 7px rgba(0, 0, 0, 0.2); } .headsearch--def .header-search-container.panel-opened { display: block; } .headsearch--def .header-search-button { line-height: 1; display: inline-block; background: rgba(0, 0, 0, 0.5); position: relative; z-index: 1; height: 30px; width: 30px; text-align: center; line-height: 30px; font-size: 12px; margin: 0; border-radius: 2px; } .headsearch--def .header-search-button:hover { background: rgba(0, 0, 0, 0.7); } .headsearch--def .header-search-button.active { background: #f4f4f4; border-radius: 2px 2px 0 0; } .headsearch--def .header-search-button.active .glyphicon { color: #000; } /* Search form */ .headsearch--def .gensearch__form { border-bottom: 1px solid #CCCCCC; margin: 0; position: relative; } .headsearch--def .gensearch__form:hover { border-bottom: 1px solid #b5b5b5; } .headsearch--def .gensearch__input { background: none; border: none; font-size: 12px; font-style: italic; color: #999; padding: 5px 0; margin: 0; display: inline-block; box-shadow: none; outline: none; font-style: italic; height: auto; width: calc(100% - 30px); } .headsearch--def .gensearch__input:focus { font-style: normal; color: #565656; } .headsearch--def .gensearch__submit { width: 20px; background-color: transparent; border: none; padding: 0; display: inline-block; height: 14px; line-height: 14px; vertical-align: text-top; position: absolute; right: 5px; top: 50%; margin-top: -8px; outline: none; color: rgba(108, 108, 108, 0.4); } .headsearch--def .gensearch__submit:after { display: none; } .headsearch--def .screen-reader-text { display: none; } /* Search box - Input Layout */ .header-search.headsearch--inp { width: 220px; } .headsearch--inp .header-search-container { padding: 0; position: static; display: block; box-shadow: none; border: 0; background: none; vertical-align: middle; } .headsearch--inp .header-search-button { display: none; } .headsearch--inp .gensearch__form { border: 0; margin: 0; position: relative; padding: 0; } .headsearch--inp .gensearch__input { position: relative; border: none; font-size: 12px; font-style: italic; margin: 0; display: inline-block; box-shadow: none; outline: none; width: 100%; padding: 2px 30px 2px 15px; border-radius: 3px; height: 34px; -webkit-transition: all .15s ease-out; transition: all .15s ease-out; } .headsearch--inp .gensearch__submit { width: 20px; background-color: transparent; border: none; padding: 0; display: inline-block; height: 14px; line-height: 14px; vertical-align: text-top; position: absolute; right: 10px; top: 50%; margin-top: -8px; outline: none; z-index: 1; } .headsearch--inp .gensearch__submit:after { display: none; } .headsearch--inp .header-search-field-bg { position: absolute; width: 100%; height: 100%; top: 0; left: 0; border-radius: 3px; -webkit-transition: all 0.15s cubic-bezier(0.68, 0, 0.265, 1); transition: all 0.15s cubic-bezier(0.68, 0, 0.265, 1); } .headsearch--inp .gensearch__input:focus { font-style: normal; } .headsearch--inp .gensearch__input:focus ~ .kl-field-bg { width: 120%; left: -10%; height: 120%; top: -10%; } /* Search box - Input Layout - light theme */ .sh--light .headsearch--inp .gensearch__input { color: #fff; background-color: rgba(255, 255, 255, 0.1); } .sh--light .headsearch--inp .gensearch__input:hover { background-color: rgba(255, 255, 255, 0.15); } .sh--light .headsearch--inp .gensearch__input:focus { color: #E3E3E3; } .sh--light .headsearch--inp .gensearch__input:focus { background-color: rgba(255, 255, 255, 0.2); box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.2); } .sh--light .headsearch--inp .gensearch__submit { color: rgba(255, 255, 255, 0.4); } /* Search box - Input Layout - dark theme */ .sh--dark .headsearch--inp .gensearch__input, .sh--gray .headsearch--inp .gensearch__input { color: #000; background-color: rgba(0, 0, 0, 0.1); } .sh--dark .headsearch--inp .gensearch__input:hover, .sh--gray .headsearch--inp .gensearch__input:hover { background-color: rgba(0, 0, 0, 0.15); } .sh--dark .headsearch--inp .gensearch__input:focus, .sh--gray .headsearch--inp .gensearch__input:focus { color: #141414; } .sh--dark .headsearch--inp .gensearch__input:focus, .sh--gray .headsearch--inp .gensearch__input:focus { background-color: rgba(0, 0, 0, 0.2); box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.2); } .sh--dark .headsearch--inp .gensearch__submit, .sh--gray .headsearch--inp .gensearch__submit { color: rgba(0, 0, 0, 0.4); } @media (max-width: 767px) { .header-search.headsearch--inp { width: auto; } } /* SearchBox - Bordered style */ .headsearch--bord.header-search { width: 300px; } .headsearch--bord .header-search-button { display: none; } .headsearch--bord .gensearch__form { position: relative; padding: 0; } .headsearch--bord .gensearch__input { background: none; border: none; font-size: 12px; font-style: italic; margin: 0; display: inline-block; box-shadow: none; outline: none; border-bottom: 2px solid #efefef; color: #efefef; height: 35px; padding-left: 40px; width: 100%; } .headsearch--bord .gensearch__input:focus { border-bottom-width: 3px; } .headsearch--bord .gensearch__submit { width: 20px; background-color: transparent; border: none; padding: 0; display: inline-block; height: 14px; line-height: 14px; position: absolute; left: 3px; top: 50%; margin-top: -8px; outline: none; z-index: 1; color: #efefef; } .headsearch--bord .gensearch__submit:after { display: none; } /* Dark Themed */ .sh--dark .headsearch--bord .gensearch__input { border-bottom-color: #141414; color: #141414; } .sh--dark .headsearch--bord .gensearch__submit { color: #141414; } /* Gray Themed */ .sh--gray .headsearch--bord .gensearch__input { border-bottom-color: #898989; color: #898989; } .sh--gray .headsearch--bord .gensearch__submit { color: #898989; } @media (min-width: 992px) { /* SearchBox - Minimal */ .header-search.headsearch--min { position: relative; z-index: 100; } .header-search.headsearch--min:before, .header-search.headsearch--min:after { content: " "; display: table; } .header-search.headsearch--min:after { clear: both; } .headsearch--min .header-search-container { display: none; border-width: 1px; border-style: solid; border-radius: 30px; margin-top: -2px; } .headsearch--min .header-search-container.panel-opened { display: block; width: 200px; } .headsearch--min .header-search-button { display: inline-block; z-index: 1; height: 30px; width: 30px; text-align: center; line-height: 30px; font-size: 12px; margin: 0; } .headsearch--min .header-search-button.active { position: absolute; right: 3px; top: 0; opacity: .5; } .headsearch--min .gensearch__form { margin: 0 30px 0 15px; } .headsearch--min .gensearch__input { background: none; border: none; font-size: 12px; font-style: italic; padding: 5px 0; margin: 0; display: inline-block; box-shadow: none; outline: none; height: 32px; } .headsearch--min .gensearch__input:focus { font-style: normal; } .headsearch--min .gensearch__submit { display: none; } /* Light */ .sh--light .headsearch--min .header-search-button .glyphicon { color: #CCCCCC; } .sh--light .headsearch--min .header-search-button.active .glyphicon { color: #fff; } .sh--light .headsearch--min .header-search-container { border-color: rgba(255, 255, 255, 0.3); } .sh--light .headsearch--min .header-search-container.panel-opened:hover { border-color: rgba(255, 255, 255, 0.4); } .sh--light .headsearch--min .gensearch__input { color: #666666; } .sh--light .headsearch--min .gensearch__input:focus { color: #BBBBBB; } /* Dark */ .sh--dark .headsearch--min .header-search-button .glyphicon { color: #333; } .sh--dark .headsearch--min .header-search-button.active .glyphicon { color: #000; } .sh--dark .headsearch--min .header-search-container { border-color: rgba(0, 0, 0, 0.2); } .sh--dark .headsearch--min .header-search-container.panel-opened:hover { border-color: rgba(0, 0, 0, 0.3); } .sh--dark .headsearch--min .gensearch__input { color: #999; } .sh--dark .headsearch--min .gensearch__input:focus { color: #444; } } @media (max-width: 991px) { /* Reset all styles and switch back to Compact mode */ .header-search { position: static !important; z-index: 100; width: auto !important; } .header-search .header-search-container { display: none; position: absolute; right: 0; padding: 30px; background: #f4f4f4; width: 100%; border-bottom: 1px solid #fff; z-index: 1; box-shadow: 0 3px 7px rgba(0, 0, 0, 0.2); } .header-search .header-search-container.panel-opened { display: block; } .header-search .header-search-button { line-height: 1; display: inline-block; background: rgba(0, 0, 0, 0.5); position: relative; z-index: 1; height: 30px; width: 30px; text-align: center; line-height: 30px; font-size: 12px; margin: 0; border-radius: 2px; } .header-search .header-search-button:hover { background: rgba(0, 0, 0, 0.7); } .header-search .header-search-button.active { background: #f4f4f4; border-radius: 2px 2px 0 0; } .header-search .header-search-button.active .glyphicon { color: #000; } /* Search form */ .header-search .gensearch__form { border-bottom: 1px solid #CCCCCC; margin: 0; position: relative; } .header-search .gensearch__form:hover { border-bottom: 1px solid #b5b5b5; } .header-search .gensearch__input { background: none !important; border: none; font-size: 12px; font-style: italic; color: #444 !important; padding: 5px 0; margin: 0; display: inline-block; box-shadow: none; outline: none; font-style: italic; width: calc(100% - 30px); } .header-search .gensearch__input:focus { font-style: normal; color: #565656; } .header-search .gensearch__submit { width: 20px; background-color: transparent; border: none; padding: 0; display: inline-block; height: 14px; line-height: 14px; vertical-align: text-top; position: absolute; right: 5px; left: auto; top: 50%; margin-top: -8px; outline: none; color: rgba(108, 108, 108, 0.4); } .header-search .screen-reader-text { display: none; } } /* SUPPORT PANEL */ .support-panel { background: #eee; height: auto; max-height: 0; -webkit-transition: max-height .2s ease-out; transition: max-height .2s ease-out; position: relative; overflow: hidden; z-index: 1; box-shadow: 0 0 15px rgba(0, 0, 0, 0.4) inset; } .support-panel.is-opened { margin-top: 0; max-height: 1000px; -webkit-transition: max-height .4s ease-out; transition: max-height .4s ease-out; } .support-panel-container { padding: 15px 0; } .widget.support-panel-widget { margin-bottom: 0; margin-left: 15px; margin-right: 15px; } /* Support panel button */ .open-sliding-panel .glyphicon-remove-circle, .open-sliding-panel.active .glyphicon-info-sign, .open-sliding-panel.is-toggled .glyphicon-info-sign { display: none !important; } .open-sliding-panel.active .glyphicon-remove-circle, .open-sliding-panel.is-toggled .glyphicon-remove-circle { display: inline-block !important; } .support-panel.is-opened:before { height: 20px; content: ''; display: none; } /* Close Button */ .support-panel-close { position: absolute; top: 30px; right: 30px; font-size: 28px; background: rgba(0, 0, 0, 0.07); display: block; width: 50px; height: 50px; line-height: 50px; text-align: center; border-radius: 50%; cursor: pointer; z-index: 2; -webkit-transition: all .15s ease-in-out; transition: all .15s ease-in-out; -webkit-transform: scale(0.1); transform: scale(0.1); } .is-opened .support-panel-close { -webkit-transform: scale(1); transform: scale(1); } .support-panel-close:hover { background: rgba(0, 0, 0, 0.15); box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.15); } .kl-skin--dark .support-panel-close { background: rgba(255, 255, 255, 0.07); } .kl-skin--dark .support-panel-close:hover { background: rgba(255, 255, 255, 0.15); box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.15); } @media (max-width: 1199px) { .support-panel.is-opened:before { display: block; } .support-panel-close { top: 5px; right: 5px; border-radius: 0; width: 40px; height: 40px; line-height: 40px; } } @media (max-width: 991px) { .support-panel-close { top: 0; border-radius: 0; } } /* PANEL STYLES */ .how_to_shop > .row { font-size: 14px; margin-bottom: 20px; } .how_to_shop > p { font-size: 13px; margin-top: 15px; } .how_to_shop .number { display: inline-block; width: 28px; height: 28px; line-height: 28px; font-size: 16px; color: #fff; background: #cd2122; text-align: center; margin-right: 10px; font-weight: 900; border-radius: 50%; margin-bottom: 5px; } @media (max-width: 991px) { .how_to_shop > .row { margin-bottom: 10px; font-size: 12px; } } /* LOGIN / REGISTER POPUPS */ .kl-fw-input { width: 100%; } .auth-popup-panel { padding: 50px; } .auth-popup-title { font-size: 16px; font-weight: 400; color: #4a4a4a; margin-bottom: 20px; line-height: 1.9; text-shadow: none; } .auth-popup-createacc { margin-right: 8px; background: none !important; } .auth-popup-createacc + .auth-popup-sep { margin-right: 8px; border-left: 1px solid #ccc; } .auth-popup-links { margin-top: 20px; color: #4A4A4A; font-size: 10px; font-weight: 600; } .auth-popup-link { font-size: 11px; font-weight: 400; color: #898989; } .auth-popup-link:hover { color: #585858; } .auth-popup-remember { margin: 0 0 20px; display: block; font-weight: 300; text-transform: uppercase; font-size: 11px; text-shadow: none; } .auth-popup-remember-chb { margin: 0; } .mfp-bg.mfp-fade.mfp-bg-lighter { background: #000; } .mfp-bg.mfp-fade.mfp-bg-lighter.mfp-ready { opacity: .75; } .auth-popup .mfp-close { color: #828282; } .auth-popup { width: 420px; margin: 0 auto; border: 1px solid #fff; background: #ededed; box-shadow: 0 0 20px #000; border-radius: 2px; position: relative; } .register-popup { width: 420px; } @media (max-width: 480px) { .auth-popup { width: 100%; } } /* Other form states */ .zn_form_login .zn_blocked { background-color: #ababab !important; -webkit-transition: all .2s ease-out; transition: all .2s ease-out; opacity: .5; pointer-events: none; outline: none; } .zn-notification, .zn_form_login-result .woocommerce-error, .zn_form_login-result .woocommerce-message { margin-bottom: 10px; padding: 10px; border-radius: 3px; font-size: 13px; } .zn-notification--error, .zn_form_login-result .woocommerce-error { border: 1px solid rgba(101, 34, 34, 0.3); background-color: #FFF2F2; color: #861919; } .zn-notification--success, .zn_form_login-result .woocommerce-message { border: 1px solid rgba(32, 83, 109, 0.3); background-color: #F2FAFF; color: #195A86; } .zn-notification a { text-decoration: underline; } /* Invalid empty field in registration form */ .form-group.fg-input-invalid label:before { content: "\e101"; display: inline-block; position: relative; top: 1px; display: inline-block; font-family: "Glyphicons Halflings"; font-style: normal; font-weight: 400; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 12px; margin-right: 10px; color: #f00; opacity: .8; } /* Login & register popup / dark version */ .kl-skin--dark .auth-popup { border-color: #000; background: #0B0A0A; } .kl-skin--dark .auth-popup-title { color: #B5B5B5; } .kl-skin--dark .auth-popup-links { color: #B5B5B5; } .kl-skin--dark .auth-popup-link { color: #767676; } .kl-skin--dark .auth-popup-link:hover { color: #A7A7A7; } .kl-skin--dark .auth-popup-createacc + .auth-popup-sep { border-left-color: #333333; } /* LANGUAGES IN HEADER */ .topnav.topnav--lang .topnav-drop-panel { margin-right: -10px; } .topnav.topnav--lang .topnav-drop-panel-inner { padding-left: 0; padding-right: 0; } .topnav.topnav--lang .topnav-drop-panel-inner:after { display: none; } .toplang-anchor { font-size: 10px; color: #444; padding: 0 5px 0 10px; display: block; text-transform: uppercase; margin-top: 1px; padding-right: 10px !important; } .toplang--def .toplang-flag, .toplang--alt .toplang-flag { margin-right: 5px; } .toplang-anchor:hover, .toplang-item.active .toplang-anchor { color: #000; background: rgba(0, 0, 0, 0.1); } .toplang-anchor .glyphicon { float: right; opacity: .3; margin-top: 5px; } .topnav.topnav--lang > li > .topnav-item > .glyphicon { margin-right: 5px; } /* Alternative */ .toplang--alt .toplang-flag-code { text-transform: uppercase; display: inline-block; margin-right: 5px; vertical-align: middle; } .toplang--alt .toplang-anchor { font-weight: bold; } /* Flags */ .toplang--flags { margin-left: 5px; margin-right: 5px; } .toplang--flags .topnav-li { margin-left: 5px; margin-right: 5px; } .toplang--text .topnav-li { margin-left: 5px; } .toplang--text .site-header-text { opacity: .8; } .toplang--text .topnav-li:not(:last-child) { margin-right: 5px; } .toplang--text .topnav-li:not(.toplang-headText):not(:last-child) .topnav-item:after { content: '/'; padding-left: 7px; opacity: .4; } /* topnav dark */ .nav-th--dark .toplang-anchor { color: #DDDDDD; } .nav-th--dark .toplang-item.active .toplang-anchor, .nav-th--dark .toplang-anchor:hover { background: rgba(255, 255, 255, 0.1); } /* CART DETAILS PANEL */ .topnav-drop-panel.topnav--cart-panel { margin-left: 0; padding-top: 10px; min-width: 320px; } /*Glyphicon cart*/ .kl-cart-button { padding-left: 10px; } .kl-cart-button .glyphicon.kl-cart-icon { position: relative; top: 2px; margin-right: 7px; } .kl-cart-button .glyphicon.kl-cart-icon:after { content: attr(data-count); font-size: 9px; background-color: #cd2122; color: #fff; width: 16px; height: 16px; display: block; text-align: center; line-height: 16px; border-radius: 50%; position: absolute; top: -8px; left: -12px; font-weight: 600; padding-right: 0; font-family: sans-serif; } /* Cart icon (only icon) */ .kl-cart-button.kl-cart--icononly .kl-cart-icon { font-size: 16px; } .kl-cart-button.kl-cart--icononly .kl-cart-icon:after { left: -13px; } /* INFOCARD */ .logo-container.hasInfoCard:before, .logo-container .logo-infocard { display: none; } @media (min-width: 768px) { .logo-container.hasInfoCard { position: relative; display: block; } .logo-container.hasInfoCard.hasHoverMe:before { display: block; content: url(../images/hoverme.png); width: 98px; height: 35px; right: 100%; margin-right: 20px; top: 40px; position: absolute; } .boxed .logo-container.hasInfoCard:before { display: none; } .logo-container .logo-infocard { display: block; position: absolute; top: 100%; margin-top: 20px; width: 440px; padding: 30px 20px 25px; background: #cd2122; border-radius: 2px; font-size: 12px; display: block; visibility: hidden; opacity: 0; box-shadow: 0 2px 3px rgba(0, 0, 0, 0.4); z-index: 1; -webkit-transition: all 0.15s ease-out; transition: all 0.15s ease-out; -webkit-transition-delay: .3s; transition-delay: .3s; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .logo-container:hover .site-logo + .logo-infocard { visibility: visible; opacity: 1; margin-top: 10px; -webkit-transition-delay: 0s; transition-delay: 0s; z-index: 2; } .logo-infocard, .logo-infocard a { color: #FFF; font-weight: normal; line-height: 1.6; } .logo-infocard a:hover { color: rgba(255, 255, 255, 0.7); } .infocard-wrapper { margin-top: 15px; } .logo-infocard p:last-child { margin-bottom: 0; } .logo-infocard .social-icons { margin-left: 0; padding-left: 0; } .logo-infocard .social-icons .social-icons-li { margin: 0 10px; } .logo-infocard .social-icons .social-icons-li:first-child { margin-left: 0; } .logo-infocard .social-icons-li.title { margin-right: 10px; font-size: 15px; } .logo-infocard .social-icons-item { background-color: transparent; box-shadow: none; } .logo-infocard .social-icons-item:hover { opacity: .7; } .logo-infocard .contact-details { background: url(../images/say_hi.png) no-repeat right top; } } /* SOCIAL ICONS in header */ .site-header .topnav.social-icons .social-icons-li { margin: 0; margin-left: 10px; } .site-header .topnav.social-icons.sc--clean .social-icons-li { margin-left: 0; } .site-header .topnav.social-icons .social-icons-li:first-child { margin-left: 0; } .site-header .topnav.social-icons .social-icons-item { font-size: 14px; font-weight: normal; opacity: 1; } .scheader-icon-nocolor { background-color: #121212; } /* MENU CHASER STYLES */ .chaser { display: none; } @media screen and (min-width: 992px) { .chaser { display: block; background: rgba(0, 0, 0, 0.85); padding: 0; position: fixed; right: 0; top: 0; width: 100%; z-index: 99998; opacity: 0; visibility: hidden; -webkit-transform: translate3d(0px, -30px, 0); transform: translate3d(0px, -30px, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden; will-change: transform; } .chaser.visible { opacity: 1; visibility: visible; -webkit-transform: translate3d(0px, 0px, 0); transform: translate3d(0px, 0px, 0); } body.admin-bar > .chaser { margin-top: 32px; } .chaser-main-menu, .chaser-main-menu ul { float: none; display: block; list-style: none; margin: 0; padding: 0; position: relative; } .chaser-main-menu li:not(.menu-item-mega-parent) { position: relative; } .chaser-main-menu li.logo-menu-wrapper { display: none; } .chaser-main-menu > li { float: left; border-left: 1px solid rgba(255, 255, 255, 0.1); } .chaser-main-menu > li:last-child { border-right: 1px solid rgba(255, 255, 255, 0.1); } .chaser-main-menu .sub-menu, .chaser-main-menu .zn_mega_container { left: -2999px; position: absolute; -webkit-transform: translateY(20px); transform: translateY(20px); opacity: 0; -webkit-transition: opacity .15s ease-in-out, -webkit-transform .15s ease-in-out; transition: opacity .15s ease-in-out, -webkit-transform .15s ease-in-out; transition: opacity .15s ease-in-out, transform .15s ease-in-out; transition: opacity .15s ease-in-out, transform .15s ease-in-out, -webkit-transform .15s ease-in-out; } .chaser-main-menu .zn_mega_container { left: -2999px !important; } .chaser-main-menu .zn_mega_row_start:after, .chaser-main-menu .zn_mega_row_start:before { display: table; content: " "; } .chaser-main-menu .zn_mega_row_start:after { clear: both; } .chaser-main-menu li ul { background: rgba(0, 0, 0, 0.9); min-width: 200px; padding: 5px; } .chaser-main-menu .zn_mega_container > ul { padding-top: 0; padding-bottom: 20px; } .chaser-main-menu .zn_mega_container > ul:first-child { padding-top: 20px; } .chaser-main-menu .zn_mega_container > ul:last-child { padding-bottom: 30px; } .chaser-main-menu .zn_mega_container ul ul { background: none; padding: 10px 0 0; } .chaser-main-menu .zn_mega_container .zn_mega_title { border-bottom: 1px solid #454545; background: none; } .chaser-main-menu .zn_mega_container .zn_mega_title_hide { display: none; } .chaser-main-menu li a { display: block; color: #ddd; font-size: 12px; line-height: 1.4; padding: 7px 15px; -webkit-transition: all 0.15s ease-in-out; transition: all 0.15s ease-in-out; position: relative; } .chaser-main-menu li:hover > a:not(:only-child) + .sub-menu, .chaser-main-menu li:hover > a:not(:only-child) + .zn_mega_container { left: 0; opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } .chaser-main-menu li:hover > a:not(:only-child) + .zn_mega_container { left: -15px !important; } .chaser-main-menu li > a:not(:only-child) { padding-right: 25px; } .chaser-main-menu li > a:not(:only-child):after { content: ''; position: absolute; top: 50%; right: 9px; margin-top: -1px; height: 2px; width: 6px; background: #ccc; opacity: .5; } .chaser-main-menu li li:hover > a:not(:only-child) + .sub-menu { left: 100%; top: -4px; } .chaser-main-menu li:hover > a, .chaser-main-menu li a:hover { color: #fff; background: #000; } .chaser-main-menu li.active > a { background: #cd2122; } .chaser-main-menu .zn-mega-new-item { display: none; } .chaser-main-menu .sub-menu li a[href="#custom-separator"], .chaser-main-menu .sub-menu li.menuitem-separator > a { text-indent: -2999px; padding: 0; background-color: rgba(0, 0, 0, 0.3) !important; background-clip: padding-box; height: 5px; } .chaser .zn-megaMenuSmartArea-content { display: none !important; } .chaser .zn-megaMenuSmartArea-content + ul { padding-top: 20px; } } /* STICKY HEADER*/ @media (min-width: 768px) { .site-header.header--sticky { width: 100%; z-index: 9; will-change: transform; -webkit-transform: translate3d(0%, 0%, 0); transform: translate3d(0%, 0%, 0); -webkit-transition: background-color .2s ease-out; transition: background-color .2s ease-out; } .site-header.site-header--absolute.header--sticky { position: fixed; } .site-header.header--sticky .site-logo-anch { -webkit-transition: height .1s ease-out; transition: height .1s ease-out; } /* Sticky Header - when is sticked */ .header--is-sticked.site-header.header--sticky { position: fixed; } /* Sticked state */ .site-header.header--sticky .site-header-top, .site-header.header--sticky .site-header-main, .site-header.header--sticky .site-header-bottom { opacity: 1; -webkit-transition: height .2s ease-out, opacity .2s ease-out; transition: height .2s ease-out, opacity .2s ease-out; } /* Sticked state. Apply only if header has sticky-resize class. */ .header--is-sticked.site-header.sticky-resize, .header--is-sticked.site-header.sticky-resize .logosize--contain .site-logo-anch { height: auto !important; } .header--is-sticked.site-header.sticky-resize .logosize--yes .site-logo { min-height: 0 !important; } .header--is-sticked.site-header.sticky-resize .logosize--contain .site-logo-img, .header--is-sticked.site-header.sticky-resize .site-logo-img-sticky { max-height: 100% !important; display: block; width: auto; } .header--is-sticked.site-header.sticky-resize .logosize--contain .site-logo-img, .header--is-sticked.site-header.sticky-resize .logosize--yes .logo-img-sticky + .site-logo-img { max-height: 60px !important; } .header--is-sticked.site-header.sticky-resize .sticky-top-area .site-header-top, .header--is-sticked.site-header.sticky-resize .sticky-main-area .site-header-main, .header--is-sticked.site-header.sticky-resize .sticky-bottom-area .site-header-bottom { opacity: 0; height: 0 !important; overflow: hidden; padding-top: 0; padding-bottom: 0; } .header--is-sticked.site-header.sticky-resize .site-header-wrapper:not(.sticky-main-area) .site-header-main { height: 60px; } .header--is-sticked.site-header.sticky-resize .site-header-wrapper:not(.sticky-bottom-area) .site-header-bottom { height: 55px; } .header--is-sticked.site-header .site-header-separator, .header--is-sticked.site-header .logo-container.hasInfoCard:before { display: none; } .header--is-sticked.site-header.sticky-resize.kl-center-menu .main-nav > ul > li > a { line-height: 60px !important; } } /* STICKY LOGO - with animations */ .site-logo-img-sticky { display: none; } /* by default, hide it */ .header--sticky .site-logo-img-sticky { display: block; position: absolute; top: 50%; left: 50%; opacity: 0; -webkit-transform: translateX(-50%) translateY(0%); transform: translateX(-50%) translateY(0%); -webkit-transition: opacity .15s ease-in-out, -webkit-transform .15s ease-in-out; transition: opacity .15s ease-in-out, -webkit-transform .15s ease-in-out; transition: opacity .15s ease-in-out, transform .15s ease-in-out; transition: opacity .15s ease-in-out, transform .15s ease-in-out, -webkit-transform .15s ease-in-out; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .header--sticky .site-logo-img-sticky + .site-logo-img { opacity: 1; -webkit-transition: opacity .15s ease-in-out; transition: opacity .15s ease-in-out; } @media (min-width: 768px) { .header--is-sticked .site-logo-img-sticky + .site-logo-img { opacity: 0; } .header--is-sticked .site-logo-img-sticky { opacity: 1; -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } } /* Centered Logo Inside Menu */ .site-header.kl-center-menu .logo-container.hasInfoCard:before { display: none; } .site-header.kl-center-menu .main-nav > ul > li { margin-left: 3px; margin-right: 3px; } .site-header.kl-center-menu .main-nav > ul > li > a { padding-top: 0; padding-bottom: 0; } .site-header.kl-center-menu .main-nav .logo-menu-wrapper { margin-left: 0; margin-right: 0; -webkit-transform: scale(0); transform: scale(0); width: auto; max-width: 0; opacity: 0; } .site-header.kl-center-menu .main-nav .logo-menu-wrapper.is-loaded { max-width: 1000px; margin-left: 20px; margin-right: 20px; -webkit-transform: scale(1); transform: scale(1); opacity: 1; -webkit-transition: all .15s ease-out; transition: all .15s ease-out; } .site-header.kl-center-menu .main-nav .site-logo-anch { display: table-cell; } .site-header.kl-center-menu .zn-original-logo { margin-left: auto; margin-right: auto; } .site-header.kl-center-menu .zn-original-logo, .zn-res-menu-nav li.logo-menu-wrapper { display: none; } @media (max-width: 767px) { .site-header.kl-center-menu .zn-original-logo { width: auto; margin-left: 0; } } /* Infocard when positioned in center cells */ .site-header-top-center .logo-container .logo-infocard, .site-header-main-center .logo-container .logo-infocard, .site-header-bottom-center .logo-container .logo-infocard { left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); z-index: 2; } /* GENERAL SITE HEADER */ .site-header { position: absolute; width: 100%; background: rgba(0, 0, 0, 0.5); z-index: 3; } @media (max-width: 767px) { .site-header { position: relative; height: auto; } .site-header .xs-icon { font-size: 14px; color: #fff; line-height: 24px; opacity: 1; } } .siteheader-container { position: relative; margin-left: auto; margin-right: auto; } /* Absolute Site Header */ .site-header.site-header--absolute { position: absolute; } .site-header.site-header--absolute { position: absolute; } /* Relative Site Header */ .site-header.site-header--relative { position: relative; } @media (min-width: 768px) { .site-header.header--fixed, .site-header.site-header--absolute.header--fixed, .site-header.site-header--relative.header--fixed { position: fixed; left: 0; } } @media (max-width: 767px) { #site-header-FixedRelativeFix { display: none; } } .site-header-separator { height: 1px; opacity: .2; margin-top: 3px; margin-bottom: 3px; width: 100%; } /* TopBar in Header Full-width */ .siteheader-container.topbar-full { width: 100%; padding-left: 0; padding-right: 0; } .topbar-full .site-header-top .site-header-top-left { padding-left: 20px; } .topbar-full .site-header-top .site-header-top-right { padding-right: 20px; } @media (max-width: 767px) { .topbar-full .site-header-top .site-header-top-left, .topbar-full .site-header-top .site-header-top-right { padding-top: 5px; padding-bottom: 5px; } } /* HEADER STYLES COLORS (Gray) */ .sh--gray .topnav-no-sc .topnav-item, .sh--gray .topnav .menu-item > a, .sh--gray .topnav.sc--clean .topnav-item, .sh--gray .topnav-li .glyphicon { color: #878787; } .sh--gray .topnav-no-sc .topnav-item:hover, .sh--gray .topnav .menu-item > a:hover, .sh--gray .topnav.sc--clean .topnav-item:hover, .sh--gray .topnav-item:hover .glyphicon { color: #676767; } .sh--gray .main-nav > ul > li > a { color: #8C8C8C; } .sh--gray .main-nav > ul > li.menu-item-has-children > a:after { background-color: rgba(120, 120, 120, 0.4); } .sh--gray:not(.style9) .kl-cta-lined { color: #8C8C8C; border-color: #8c8c8c; } .sh--gray:not(.style9) .kl-cta-lined:hover { color: #777; border-color: #777; } .sh--gray .site-header-text, .sh--gray .site-header-text a, .sh--gray .kl-header-toptext, .sh--gray .kl-header-toptext a { color: #878787; } .sh--gray .headernav-trigger:before { background-color: #878787; box-shadow: 0 6px 0 #878787, 0 12px 0 #878787; } .sh--gray .site-header-separator { background: #878787; } .sh--gray .zn-menuBurger span { background: rgba(0, 0, 0, 0.5); } .sh--gray .kl-cart-button .svg-cart.kl-cart-icon .svg-cart-icon { fill: #fff; } @media (max-width: 767px) { .sheader-sh--gray { background-color: #8C8C8C; } } /* Site header text colors (Light) */ .sh--light .topnav-no-sc .topnav-item, .sh--light .topnav .menu-item > a, .sh--light .topnav.sc--clean .topnav-item, .sh--light .topnav-li .glyphicon { color: #fff; } .sh--light .topnav-no-sc .topnav-item:hover, .sh--light .topnav .menu-item > a:hover, .sh--light .topnav.sc--clean .topnav-item:hover, .sh--light .topnav-item:hover .glyphicon { color: #fff; opacity: .9; } .sh--light .main-nav > ul > li > a { color: #f5f5f5; } .sh--light:not(.style9) .kl-cta-lined { color: rgba(255, 255, 255, 0.8); border-color: rgba(255, 255, 255, 0.8); } .sh--light:not(.style9) .kl-cta-lined:hover { color: #fff; border-color: #fff; } .sh--light .site-header-text, .sh--light .site-header-text a, .sh--light .kl-header-toptext, .sh--light .kl-header-toptext a { color: #fff; } .sh--light .headernav-trigger:before { background-color: #fff; box-shadow: 0 6px 0 #fff, 0 12px 0 #fff; } .sh--light .site-header-separator { background: #fff; } .sh--light .zn-menuBurger span { background: rgba(255, 255, 255, 0.85); } .sh--light .kl-cart-button .svg-cart.kl-cart-icon .svg-cart-icon { fill: #fff; } .sh--light .kl-cta-custom.btn-lined.lined-dark { color: #fff; border-color: #fff; } @media (max-width: 767px) { .sheader-sh--light { background-color: #333; } } /* Site header text colors (Dark) */ .sh--dark .topnav-no-sc .topnav-item, .sh--dark .topnav .menu-item > a, .sh--dark .topnav.sc--clean .topnav-item, .sh--dark .topnav-li .glyphicon { color: #333; } .sh--dark .topnav-no-sc .topnav-item:hover, .sh--dark .topnav .menu-item > a:hover, .sh--dark .topnav.sc--clean .topnav-item:hover, .sh--dark .topnav-item:hover .glyphicon { color: #111; } .sh--dark .main-nav > ul > li > a { color: #252525; } .sh--dark .main-nav > ul > li.menu-item-has-children > a:after { background-color: rgba(0, 0, 0, 0.4); } .sh--dark .main-nav > ul > li.active > a, .sh--dark .main-nav > ul > li > a:hover, .sh--dark .main-nav > ul > li:hover > a { color: #fff; } .sh--dark:not(.style9) .kl-cta-lined { color: #252525; border-color: #252525; } .sh--dark:not(.style9) .kl-cta-lined:hover { color: #111; border-color: #111; } .sh--dark .site-header-text, .sh--dark .site-header-text a, .sh--dark .kl-header-toptext, .sh--dark .kl-header-toptext a { color: #333; } .sh--dark .headernav-trigger:before { background-color: #333; box-shadow: 0 6px 0 #333, 0 12px 0 #333; } .sh--dark .site-header-separator { background: #333; } .sh--dark .zn-menuBurger span { background: rgba(0, 0, 0, 0.75); } .sh--dark .kl-cart-button .svg-cart.kl-cart-icon .svg-cart-icon { fill: #333; } @media (max-width: 767px) { .sheader-sh--dark { background-color: #fff; } } /* Switch drop panels if placed on left side */ .site-header .site-header-col-left .topnav-drop .topnav-drop-panel { left: 0; right: auto; } .site-header .site-header-col-left .topnav-drop-panel-inner:after { left: 10px; right: auto; } .site-header .site-header-col-left .headsearch--def .header-search-container { left: -10px; right: auto; } .site-header .site-header-col-left .topnav.zn_header_top_nav { right: auto; left: -5px; } @media (max-width: 992px) { /* .site-header .site-header-col-left .header-search .header-search-container {left: -10px; right:auto;}*/ } /* HEADER #1-#6 */ .siteheader-classic .logo-container { width: 100%; } .siteheader-classic .kl-cta-ribbon { margin-bottom: -5px; -webkit-align-self: flex-end; -ms-flex-item-align: end; align-self: flex-end; } .siteheader-classic .site-header-top-left .sh-component:first-child { margin-left: 10px; } /* Header Height */ .site-header.siteheader-classic { height: 105px; } .site-header.siteheader-classic .logosize--contain .site-logo-anch { height: 105px; } .site-header.siteheader-classic .logosize--contain .site-logo-img, .site-header.siteheader-classic .logosize--contain .site-logo-img-sticky { max-height: 105px; } .site-header.siteheader-classic .logosize--yes .site-logo { min-height: 105px; } .site-header.siteheader-classic .site-header-top { height: 54px; } .site-header.siteheader-classic .site-header-main { height: 46px; } .site-header.siteheader-classic .header-no-top .site-header-main { height: 100px; } /* HEADER 1 */ .site-header.style1 { border-bottom: 2px solid #000; border-bottom: 2px solid rgba(0, 0, 0, 0.7); border-top: 3px solid #cd2122; } .site-header.style1:after { content: ""; position: absolute; left: 50%; bottom: -10px; margin-left: -2px; border: 5px solid transparent; border-top-width: 5px; border-top-color: #000; border-top-color: rgba(0, 0, 0, 0.7); } /* HEADER 2 */ .site-header.style2 .site-logo-anch { background: rgba(0, 0, 0, 0.3); padding-left: 25px; padding-right: 25px; border-bottom: 2px solid #000; border-bottom: 2px solid rgba(0, 0, 0, 0.7); border-top-width: 3px; border-top-style: solid; } @media (max-width: 767px) { .site-header.style2 .site-logo-anch { padding-left: 10px; padding-right: 10px; } } .site-header.style2 .site-logo-anch:after { content: ""; position: absolute; left: 50%; bottom: -11px; margin-left: -3px; border: 5px solid transparent; border-top-width: 5px; border-top-color: #000; border-top-color: rgba(0, 0, 0, 0.7); } /* HEADER 3 */ @media (min-width: 768px) { .site-header.style3.headerstyle--default { background: none; } .header--is-sticked.site-header.style3.headerstyle--default { background: rgba(0, 0, 0, 0.5); } } .site-header.style3 .site-logo-anch { background: rgba(0, 0, 0, 0.3); padding-left: 25px; padding-right: 25px; border-bottom: 2px solid #000; border-bottom: 2px solid rgba(0, 0, 0, 0.7); border-top: 3px solid #cd2122; } .site-header.style3 .site-logo-anch:after { content: ""; position: absolute; left: 50%; bottom: -11px; margin-left: -3px; border: 5px solid transparent; border-top-width: 5px; border-top-color: #000; border-top-color: rgba(0, 0, 0, 0.7); } .site-header.style3 .main-nav { margin-bottom: 0; } /* HEADER 5 */ @media (min-width: 768px) { .site-header.style5.headerstyle--default.header--no-stick { background: none; } .header--not-sticked.site-header.style5.headerstyle--default.header--sticky { background: none; } } .site-header.style5 .topnav-no-sc .topnav-li { border-left: 1px solid rgba(255, 255, 255, 0.1); padding-left: 20px; } .site-header.style5 .topnav-no-sc:last-of-type .topnav-li:first-child { border-left: 0; margin-left: 0; padding-left: 0; } .site-header.style5 .topnav-no-sc .topnav-item, .site-header.style5 .topnav .menu-item a { line-height: 18px; } .site-header.style5 .site-logo-anch { padding-left: 0; padding-right: 0; } .site-header.style5 .siteheader-container > .site-header-separator { height: 2px; } /* General Header MQ */ @media (max-width: 767px) { .site-header.style5 .topnav-no-sc .topnav-li { border: 0; padding-left: 0; } .site-header.style5 .siteheader-container > .site-header-separator { display: none; } } /* HEADER 6 */ .site-header.style6 { border-top: 3px solid #cd2122; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1); } .site-header.style6.headerstyle--default { background: rgba(255, 255, 255, 0.95); } .site-header.style6 .kl-cta-lined { color: #747474; border-color: #747474; } /* Classic Headers MQ */ @media (max-width: 767px) { /* Tweaks for styles 1, 4, 5, 6 */ .site-header.siteheader-classic-normal .zn_header_top_nav-wrapper { -webkit-box-ordinal-group: 0; -webkit-order: -1; -ms-flex-order: -1; order: -1; margin-right: auto !important; margin-left: 0; } .site-header.siteheader-classic-normal .topnav.zn_header_top_nav { right: auto; left: -5px; } } /* HEADER 7 */ @media (min-width: 768px) { .site-header.style7.headerstyle--default { background: none; } } /* Height */ .site-header.style7 { height: 122px; } .site-header.style7 .logosize--contain .site-logo-anch { height: 69px; } .site-header.style7 .logosize--contain .site-logo-img, .site-header.style7 .logosize--contain .site-logo-img-sticky { max-height: 69px; } .site-header.style7 .logosize--yes .site-logo { min-height: 69px; } .site-header.style7 .site-header-top { height: 46px; } .site-header.style7 .site-header-main { height: 69px; } .site-header.style7 .header-no-top .site-header-main { height: 122px; } /* General tweaks */ .site-header.style7 .zn-res-menuwrapper, .site-header.style7 .main-nav { margin-left: 20px; margin-right: auto; } .site-header.style7 .logosize--contain .site-logo-img { padding-top: 0; padding-bottom: 0; } .site-header.style7 .kl-cta-ribbon { margin-bottom: -5px; -webkit-align-self: flex-end; -ms-flex-item-align: end; align-self: flex-end; } /* Style 7's gradient bg */ .site-header.style7 .kl-header-bg { position: absolute; top: 0; left: 0; width: 100%; height: 170%; opacity: .6; pointer-events: none; background: -webkit-linear-gradient(top, black 0%, transparent 100%); background: linear-gradient(to bottom, black 0%, transparent 100%); } .site-header.style7.headerstyle--image_color .kl-header-bg { display: none; } /* Dark tweaks */ .site-header.style7.sheader-sh--dark .kl-header-bg { opacity: .7; background: -webkit-linear-gradient(top, #fff 0%, rgba(255, 255, 255, 0) 100%); background: linear-gradient(to bottom, #fff 0%, rgba(255, 255, 255, 0) 100%); } /* MQ's */ @media (max-width: 767px) { .site-header.style7 .site-header-top { padding-top: 5px; padding-bottom: 5px; } .site-header.style7 .site-header-main { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .site-header.style7 .site-logo-col { -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; } .site-header.style7 .site-header-main-center { -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; } .site-header.style7 .zn-res-menuwrapper, .site-header.style7 .main-nav { margin-left: 0; } } /* HEADER 8 */ .site-header.style8 { background: none; } .site-header.style8 .site-header-bottom-wrapper { border-bottom: 3px solid #cd2122; } /* header height */ .site-header.style8 { height: 125px; } .site-header.style8 .logosize--contain .site-logo-anch { height: 80px; } .site-header.style8 .logosize--contain .site-logo-img, .site-header.style8 .logosize--contain .site-logo-img-sticky { max-height: 80px; } .site-header.style8 .logosize--yes .site-logo { min-height: 80px; } .site-header.style8 .site-header-main { height: 80px; } .site-header.style8 .site-header-bottom { height: 42px; } .site-header.style8 .site-header-main-right-ext { width: 100%; } /* General tweaks */ .site-header.style8.headerstyle--default .site-header-main-wrapper { background: rgba(0, 0, 0, 0.7); } .site-header.style8.headerstyle--default .site-header-bottom-wrapper { background: rgba(0, 0, 0, 0.6); } /* CTA tweaks */ .site-header.style8 .site-header-bottom-wrapper .kl-cta-lined { margin-bottom: -8px; margin-top: -3px; font-size: 90%; padding: 14px 10px; color: #fff; border: 0; background: #000; } .site-header.style8 .site-header-bottom-wrapper .kl-cta-lined:hover { color: #343434; background-color: #fff; } /* Main menu tweaks */ /*.site-header.style8 .main-nav {margin-top:10px;}*/ .site-header.style8 .main-nav > ul > li.active > a:before, .site-header.style8 .main-nav > ul > li > a:hover:before, .site-header.style8 .main-nav > ul > li:hover > a:before { height: calc(100% + 23px); margin-bottom: -23px; margin-top: 3px; } /* Dark tweaks */ .site-header.style8 .site-header-bottom.sh--dark .kl-cta-lined:hover { color: #f9f9f9; background-color: #000; } @media (max-width: 767px) { .site-header.style8 .site-header-main { padding-top: 5px; padding-bottom: 5px; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .site-header.style8 .site-header-main-right-top { margin-top: 10px; margin-bottom: 10px; } .site-header.style8 .site-header-main-right-ext { margin-bottom: 10px; } } /* HEADER 9 */ .site-header.style9 { border-bottom: 3px solid #ababab; } .site-header.style9.headerstyle--default { background: rgba(255, 255, 255, 0.9); } /* Header 9 height */ @media (min-width: 768px) { .site-header.style9 { height: 160px; } .site-header.style9 .logosize--contain .site-logo-anch { height: 64px; } .site-header.style9 .logosize--contain .site-logo-img, .site-header.style9 .logosize--contain .site-logo-img-sticky { max-height: 64px; } .site-header.style9 .logosize--yes .site-logo { min-height: 64px; } .site-header.style9 .site-header-top { height: 36px; } .site-header.style9 .site-header-bottom { height: 46px; } .site-header.style9 .site-header-main { height: 64px; } .site-header.style9 .header-no-top .site-header-main { height: 103px; } .site-header.style9 .header-no-top.header-no-bottom .site-header-main { height: 160px; } } /* General tweaks */ .site-header.style9 .logosize--contain .site-logo-img { padding-top: 0; padding-bottom: 0; } .site-header.style9 .site-header-main { padding-top: 5px; padding-bottom: 5px; } .site-header.style9 .main-menu-wrapper { margin-left: auto; margin-right: auto; } .site-header.style9 .ctabutton { margin-right: 0; } .site-header.style9 .zn-res-menuwrapper { margin-left: 0; margin-right: auto; } .site-header.style9 .kl-cta-ribbon { margin-top: -5px; } .site-header.style9 .kl-cta-lined { margin-top: -3px; font-size: 90%; padding: 17px; color: #fff; border: 0; background: #000; } .site-header.style9 .kl-cta-lined:hover { color: #f9f9f9; background-color: #000; } .site-header.style9 .kl-header-toptext { margin-left: 20px; } /* Safe-padding for slideshows, in absolute header mode */ .site-header.style9.site-header--absolute ~ .zn_pb_wrapper > .zn_pb_el_container:first-child > .kl-slideshow .kl-slideshow-safepadding, .site-header.style9.site-header--absolute ~ .zn_pb_wrapper > .kl-slideshow:first-child .kl-slideshow-safepadding { padding-top: 160px; } /* No flexbox */ .no-flexbox .site-header.style9 .site-header-main { table-layout: fixed; } .no-flexbox .site-header.style9 .kl-cta-ribbon { float: right; } /* HEADER 10 */ .site-header.style10.headerstyle--default { background: #fff; } @media (min-width: 992px) { .site-header.style10 .sh-component { margin-left: 25px; margin-right: 25px; } } /* Header 10 height */ @media (min-width: 768px) { .site-header.style10 { height: 170px; } .site-header.style10 .logosize--contain .site-logo-anch { height: 70px; } .site-header.style10 .logosize--contain .site-logo-img, .site-header.style10 .logosize--contain .site-logo-img-sticky { max-height: 70px; } .site-header.style10 .logosize--yes .site-logo { min-height: 70px; } .site-header.style10 .site-header-top { height: 50px; } .site-header.style10 .site-header-bottom { height: 50px; } .site-header.style10 .site-header-main { height: 70px; } .site-header.style10 .header-no-top .site-header-main { height: 130px; } .site-header.style10 .header-no-top.header-no-bottom .site-header-main { height: 170px; } } /* Component tweaking */ .site-header.style10 .headsearch--bord.header-search { width: 100%; } .site-header.style10 .main-nav ul ul.sub-menu li a, .site-header.style10 .main-nav .zn_mega_container li a { font-size: 12px; } @media (max-width: 767px) { /*Component tweaks*/ .site-header.style10 .header-search { margin-left: 0; margin-right: auto; } .site-header.style10 .header-search .header-search-container { left: -10px; right: auto; } } /* HEADER 11 */ @media (min-width: 768px) { /* Header 11 height */ .site-header.style11 { height: 120px; } .site-header.style11 .logosize--contain .site-logo-anch { height: 70px; } .site-header.style11 .logosize--contain .site-logo-img, .site-header.style11 .logosize--contain .site-logo-img-sticky { max-height: 70px; } .site-header.style11 .logosize--yes .site-logo { min-height: 70px; } .site-header.style11 .site-header-top { height: 50px; } .site-header.style11 .site-header-main { height: 70px; } .site-header.style11.kl-center-menu .main-nav > ul > li > a { line-height: 70px; } .site-header.style11 .header-no-top .site-header-main { height: 120px; } } /* HEADER 12 */ .site-header.style12.headerstyle--default { background: #fff; box-shadow: 0 0 5px rgba(0, 0, 0, 0.25); } @media (min-width: 768px) { /* Header 12 height */ .site-header.style12 .logosize--contain .site-logo-anch { height: 100px; } .site-header.style12 .logosize--contain .site-logo-img, .site-header.style12 .logosize--contain .site-logo-img-sticky { max-height: 100px; } .site-header.style12 .logosize--yes .site-logo { min-height: 100px; } .site-header.style12 .site-header-top { height: 50px; } .site-header.style12 .site-header-main { height: 100px; } .site-header-main-right .sh-component { margin-left: 20px; margin-right: 20px; } .site-header.style12.kl-center-menu .main-nav > ul > li > a { line-height: 100px; } .site-header.style12 .header-no-top .site-header-main { height: 100px; } } /* HEADER 13 */ .site-header.style13.headerstyle--default .site-header-top { background-color: #FFF; } @media (min-width: 768px) { .site-header.style13.headerstyle--default { background-color: transparent; } /* Header 13 height */ .site-header.style13 { height: 120px; } .site-header.style13 .logosize--contain .site-logo-anch { height: 70px; } .site-header.style13 .logosize--contain .site-logo-img, .site-header.style13 .logosize--contain .site-logo-img-sticky { max-height: 70px; } .site-header.style13 .logosize--yes .site-logo { min-height: 70px; } .site-header.style13 .site-header-top { height: 50px; } .site-header.style13 .site-header-main { height: 70px; } .site-header.style13.kl-center-menu .main-nav > ul > li > a { line-height: 70px; } .site-header.style13 .header-no-top .site-header-main { height: 120px; } } /* HEADER 14 */ @media (min-width: 768px) { .site-header.style14.headerstyle--default { background: #343434; } .site-header.style14 .site-header-top-wrapper { background: #1b1b1b; } .site-header.style14 .logo-container { padding-left: 3999px; margin-left: -3999px; padding-right: 60px; background: #FFF; } } /* Height */ .site-header.style14 { height: 120px; } .site-header.style14 .logo-container, .site-header.style14 .logo-container .site-logo { height: 100%; } .site-header.style14 .logo-container .site-logo-img, .site-header.style14 .logo-container .site-logo-img-sticky { max-height: 70px; } .site-header.style14 .site-header-top { height: 50px; } .site-header.style14 .site-header-main { height: 70px; } .site-header.style14 .header-no-top .site-header-main { height: 120px; } /* General tweaks */ .site-header.style14 .zn-res-menuwrapper, .site-header.style14 .main-nav { margin-left: 20px; margin-right: auto; } .site-header.style14 .zn_header_top_nav > li { margin-left: 0; } .site-header.style14 .zn_header_top_nav > li:not(:first-child) > a:before { content: '|'; padding-right: 10px; } @media (min-width: 992px) { .site-header.style14 .site-header-top .sh-component { margin-left: 30px; margin-right: 30px; } } /* MQ's */ @media (max-width: 767px) { .site-header.style14 .site-header-top { padding-top: 5px; padding-bottom: 5px; } .site-header.style14 .site-header-main { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; padding-bottom: 5px; } .site-header.style14 .site-logo-col { -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; } .site-header.style14 .site-header-main-center { -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; } .site-header.style14 .main-menu-wrapper, .site-header.style14 .zn-res-menuwrapper, .site-header.style14 .main-nav { margin-left: 0; } } /* HEADER 15 */ .site-header.style15.headerstyle--default { background: rgba(255, 255, 255, 0.9); box-shadow: 0 0 5px rgba(0, 0, 0, 0.25); } .site-header.style15 .logo-container.hasInfoCard.hasHoverMe:before { display: none; } @media (min-width: 768px) { /* Header 15 height */ .site-header.style15 .logosize--contain .site-logo-anch { height: 100px; } .site-header.style15 .logosize--contain .site-logo-img, .site-header.style15 .logosize--contain .site-logo-img-sticky { max-height: 100px; } .site-header.style15 .logosize--yes .site-logo { min-height: 100px; } .site-header.style15 .site-header-top { height: 50px; } .site-header.style15 .site-header-main { height: 100px; } .site-header.style15 .header-no-top .site-header-main { height: 100px; } } @media (max-width: 768px) { .site-header-main { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .site-header-main-center { -webkit-box-ordinal-group: 1; -webkit-order: 0; -ms-flex-order: 0; order: 0; } .site-header-main-left { -webkit-box-ordinal-group: 2; -webkit-order: 1; -ms-flex-order: 1; order: 1; } .site-header-main-right { -webkit-box-ordinal-group: 3; -webkit-order: 2; -ms-flex-order: 2; order: 2; } } /* General Header MQ */ @media (max-width: 767px) { /* Header Styles */ .site-header { position: relative !important; } /* Classic Styles */ .site-header .sh-component { margin-left: 13px; margin-right: 13px; } .site-header, .site-header .site-header-top, .site-header .site-header-main, .site-header .site-header-bottom { height: auto !important; position: relative; } .site-header .logo-container { width: 100%; text-align: center; } .site-header .site-logo { width: 100%; height: auto; min-height: 0 !important; max-height: 100px; padding-top: 20px; padding-bottom: 20px; } .site-header .site-logo-anch { background: none !important; border: none !important; padding: 0 !important; } .site-header .site-logo-anch:after { display: none; } } @media (max-width: 480px) { .site-header .sh-component { margin: 10px; } } /* ============================================================================= // SUBHEADER ---- KL SLIDESHOW ---- PAGE SUBHEADER ---- BREADCRUMBS ---- BOTTOM MASKS ---- SPARKLES // =========================================================================== */ /* KALLYAS SLIDESHOW CONTAINERS */ .kl-slideshow-inner { position: relative; z-index: 1; /*z-index: 100;*/ } .kl-slideshow .bgback { background-size: cover; bottom: 0; left: 0; position: absolute; right: 0; top: 0; z-index: 0; } .kl-slideshow { margin-bottom: 0; } .kl-slideshow ul { list-style: none; margin: 0; padding: 0; } .site-content .kl-slideshow { background: none transparent; clear: both; display: block; } /* For elements that are positioned right under the header, a safe padding is added */ .kl-slideshow .kl-slideshow-safepadding { padding-top: 35px; padding-bottom: 35px; } @media screen and (min-width: 480px) { .zn_pb_wrapper > .zn_pb_el_container:first-child > .kl-slideshow .kl-slideshow-safepadding, .zn_pb_wrapper > .kl-slideshow:first-child .kl-slideshow-safepadding { padding-top: 150px; padding-bottom: 45px; } /* Safepadding after the relative header */ .site-header--relative ~ .zn_pb_wrapper > .zn_pb_el_container:first-child > .kl-slideshow .kl-slideshow-safepadding, .site-header--relative ~ .zn_pb_wrapper > .kl-slideshow:first-child .kl-slideshow-safepadding { padding-top: 50px; } } /* PAGE SUBHEADER */ .page-subheader { min-height: 300px; background-color: #066fd9; } .page-subheader[class*="maskcontainer--"] { min-height: 330px; } .page-subheader .container { padding: 0 15px; z-index: 1; position: relative; } .page-subheader > .shadowUP:after { content: ''; position: absolute; bottom: -18px; left: 50%; border: 6px solid transparent; border-top-color: #fff; margin-left: -6px; } .page-subheader .bgback { position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 0; background-size: cover; background-position: center; } .ph-content-wrap { padding-bottom: 50px; padding-top: 170px; } /* Subheader coming after the relative header */ .page-subheader.psubhead-stheader--relative { min-height: 100px; } .page-subheader.psubhead-stheader--relative .ph-content-wrap { padding-top: 50px; } /* Page subheader styles */ .page-subheader.gradient, .kl-slideshow.gradient { background: -webkit-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.5) 100%); background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.5) 100%); } .page-subheader, .kl-slideshow { position: relative; top: 0; z-index: 0; width: 100%; } /* subheader titles */ .subheader-titles, .sh-titles--right .subheader-titles { text-align: right; margin-top: -7px; } .sh-titles--center .subheader-titles { text-align: center; } .sh-titles--left .subheader-titles { text-align: left; } .subheader-maintitle { line-height: 1.3; margin: 0 0 5px; } .subheader-subtitle { display: inline-block; margin: 0; font-weight: 400; font-size: 16px; } .subheader-maintitle, .subheader-subtitle, .sh-tcolor-- .subheader-maintitle, .sh-tcolor-- .subheader-subtitle, .sh-tcolor--light .subheader-maintitle, .sh-tcolor--light .subheader-subtitle { color: #fff; } .sh-tcolor--dark .subheader-maintitle, .sh-tcolor--dark .subheader-subtitle { color: rgba(0, 0, 0, 0.85); } @media (max-width: 991px) { .subheader-subtitle { font-size: 14px; } } @media (max-width: 767px) { .subheader-titles { text-align: start; margin-top: 0; margin-bottom: 20px; } .subheader-maintitle { font-size: 22px; } } .subheader-currentdate { font: 10px Arial, Helvetica, sans-serif; float: left; padding: 3px 10px; line-height: 1; clear: left; border-radius: 2px; } .subheader-currentdate, .sh-tcolor-- .subheader-currentdate, .sh-tcolor--light .subheader-currentdate { color: #383838; background: rgba(255, 255, 255, 0.5); } .sh-tcolor--dark .subheader-currentdate { color: rgba(255, 255, 255, 0.6); background: rgba(0, 0, 0, 0.5); } /* BREADCRUMBS */ .breadcrumbs { margin: 0 0 10px; list-style: none; float: left; padding: 0; } .breadcrumbs li { float: left; position: relative; text-transform: uppercase; } /* Default / Black breadcrumbs */ .breadcrumbs.bread-style--black li { color: #eee; line-height: 1.5; font-size: 13px; font-weight: 600; padding: 7px 5px 6px; background: rgba(0, 0, 0, 0.8); margin-bottom: 2px; } .breadcrumbs.bread-style--black li:first-child { padding-left: 15px; } .breadcrumbs.bread-style--black li:last-child { padding-right: 15px; } .breadcrumbs.bread-style--black li a { color: #fff; } .breadcrumbs.bread-style--black li:before { border: 4px solid transparent; content: ''; height: 0; width: 0; pointer-events: none; display: inline-block; border-left-color: white; margin: 0 5px 0 5px; } .breadcrumbs.bread-style--black li:first-child:before { display: none; } @media (max-width: 767px) { .breadcrumbs.bread-style--black { padding: 3px 6px 2px; margin-bottom: 20px; } .breadcrumbs.bread-style--black li { font-weight: 400; font-size: 12px; } } /* Minimal Breadcrumbs */ .breadcrumbs.bread-style--minimal li { font-size: 11px; } .breadcrumbs.bread-style--minimal li:before { content: '/'; display: inline-block; margin: 0 7px; } .breadcrumbs.bread-style--minimal li:first-child:before { display: none; } /* Minimal Breadcrumbs - Light */ .sh-tcolor-- .breadcrumbs.bread-style--minimal li, .sh-tcolor--light .breadcrumbs.bread-style--minimal li { color: rgba(255, 255, 255, 0.5); } .sh-tcolor-- .breadcrumbs.bread-style--minimal li a, .sh-tcolor--light .breadcrumbs.bread-style--minimal li a { color: rgba(255, 255, 255, 0.85); } .sh-tcolor-- .breadcrumbs.bread-style--minimal li a:hover, .sh-tcolor--light .breadcrumbs.bread-style--minimal li a:hover { color: #fff; } /* Minimal Breadcrumbs - Dark */ .sh-tcolor--dark .breadcrumbs.bread-style--minimal li { color: rgba(0, 0, 0, 0.5); } .sh-tcolor--dark .breadcrumbs.bread-style--minimal li a { color: rgba(0, 0, 0, 0.8); } .sh-tcolor--dark .breadcrumbs.bread-style--minimal li a:hover { color: #000; } /* Static content with mask, do things a bit differently */ .static-content__slideshow[class*="maskcontainer--"] { padding-bottom: 0; } .static-content__slideshow[class*="maskcontainer--"] .kl-slideshow-inner { padding-bottom: 60px; } /* Same goes for portfolio slider */ .portfolio-slider__sideshow[class*="maskcontainer--"] { padding-bottom: 0; } /* Same goes for fancy slider */ /*.fancyslider__slideshow[class*="maskcontainer--"] .kl-slideshow-inner {padding-bottom: 60px}*/ /* Same goes for revolution slider */ .kl-revolution-slider[class*="maskcontainer--"] { padding-bottom: 0; } /* SPARKLES IN SUBHEADER */ #sparkles, .th-sparkles { display: none; } .th-sparkles-visible .th-sparkles { display: block; } .th-sparkles > span { display: block; width: 15px; height: 15px; position: absolute; background: -webkit-radial-gradient(center ellipse, #fff 0%, rgba(255, 255, 255, 0) 60%); background: radial-gradient(ellipse at center, #fff 0%, rgba(255, 255, 255, 0) 60%); } .shiny-spark1 { width: 20px; height: 20px; opacity: .4; } .shiny-spark2 { width: 10px; height: 10px; opacity: .7; } .shiny-spark3 { width: 30px; height: 30px; opacity: .1; } .shiny-spark4 { width: 3px; height: 3px; opacity: .9; } .shiny-spark5 { width: 15px; height: 15px; opacity: .3; } .shiny-spark6 { width: 25px; height: 25px; opacity: .5; } /* ============================================================================= // WIDGETS ---- SOCIAL SHARING ---- FLICKR FEED ---- TWITTER FEED ---- NEWSLETTER ---- RECENT COMMENTS ---- RECENT ENTRIES ---- WP CALENDAR // =========================================================================== */ .widget { margin-bottom: 30px; } /* SOCIAL SHARING */ .social-share { margin: 25px 0 0; padding: 0; list-style: none; text-align: center; } .social-share-item { display: inline-block; margin-left: 10px; width: 90px; max-height: 20px; vertical-align: top; } .social-share-item.sc-gplus { width: 70px; } .social-share-item.sc-pinterest > a { width: 40px !important; margin-left: -40px !important; vertical-align: top !important; } @media (max-width: 991px) { .social-share-item { margin-left: 0; } } @media (max-width: 480px) { .social-share-item { margin-bottom: 10px; } } /* TWITTER FEED */ .widget_tp_widget_recent_tweets .twitter-feed > iframe { max-height: 20px; } .widget_tp_widget_recent_tweets .twitter-feed-wrapper { background: url(../images/twitter-bird.png) no-repeat 15px center #444; color: #fff; padding: 15px 15px 15px 60px; position: relative; border-radius: 3px; margin-bottom: 15px; } .widget_tp_widget_recent_tweets .twitter-feed a { color: #fff; } .widget_tp_widget_recent_tweets .twitter-feed a:hover { opacity: .8; } .widget_tp_widget_recent_tweets .twitter-feed-wrapper:after { content: ''; position: absolute; bottom: -10px; left: 15px; border: 5px solid transparent; border-top-color: #444; } .widget_tp_widget_recent_tweets .twitter-feed-tweets { font-size: 12px; color: #fff; font-style: italic; overflow: hidden; } .widget_tp_widget_recent_tweets .twitter-feed-tweet { position: relative; padding-right: 45px; } .widget_tp_widget_recent_tweets .twitter-feed-tweet-time { display: inline-block; color: #9d9d9d; padding-left: 10px; border-left: 1px solid #707070; font-size: 11px; position: absolute; right: 0; top: 0; bottom: 0; width: 45px; vertical-align: middle; line-height: 1.3; } /* Twitter in Sidebar */ .zn_sidebar .twitter-feed-wrapper { background-position: 15px 15px; padding: 60px 15px 15px 15px; } .zn_sidebar .twitter-feed-tweet { padding-right: 0; } .zn_sidebar .twitter-feed-tweet-time { position: static; display: block; width: auto; margin-bottom: 15px; } /* FLICKR FEED */ .flickrfeed.loading:after { content: 'Loading..'; } .flickrfeed-list { margin: 0 0 0 -20px; padding: 0; list-style: none; position: relative; } .flickrfeed-item { float: left; margin: 0 0 20px 20px; } .flickrfeed-link { display: block; width: 75px; position: relative; margin-bottom: 0; } .flickrfeed-list[data-size=small] .flickrfeed-link { width: 60px; } @media (max-width: 991px) { .flickrfeed-link { width: 65px; } .flickrfeed-list[data-size="small"] .flickrfeed-link { width: 50px; } } /* RECENT COMMENTS */ #recentcomments { list-style: none outside none; margin: 0; padding: 0; } #recentcomments li { padding-left: 10px; position: relative; margin-bottom: 0; } #recentcomments li:before { content: '\201C'; width: 3px; height: 0; position: absolute; top: 0; left: 0; color: #ddd; } /* RECENT POSTS */ .widget_zn_recent_entries .zn_recent_posts.style1 .blog_type { width: 40px; height: 40px; background: #666; line-height: 40px; text-align: center; float: left; margin: 0 10px 10px 0; } .widget_zn_recent_entries .zn_recent_posts.style1 .zn_rc_info { float: left; padding-top: 2px; width: 122px; } .widget_zn_recent_entries .zn_recent_posts.style1 .zn_rc_info a { display: block; } .widget_zn_recent_entries .zn_recent_posts.style1 .zn_rc_info span { font-size: 90%; } .widget_zn_recent_entries .post_thumb_container { float: left; margin-right: 10px; } .widget_zn_recent_entries .post_thumb_container img { width: auto; } /* ARCHIVE */ #wp-calendar { width: 100%; } #wp-calendar caption { color: #fff; font-size: 12px; margin-bottom: 15px; margin-top: 10px; text-align: center; } #wp-calendar thead { font-size: 10px; } #wp-calendar thead th { padding-bottom: 10px; text-align: center; } #wp-calendar tbody { color: #888; } #wp-calendar tbody td { background: #262626; border: 1px solid #323232; padding: 8px; text-align: center; } #wp-calendar tbody td:hover { background: #313131; } #wp-calendar tbody .pad { background: none; } #wp-calendar tfoot #next { font-size: 10px; text-align: right; text-transform: uppercase; } #wp-calendar tfoot #prev { font-size: 10px; padding-top: 10px; text-transform: uppercase; } /* Newsletter widget (used in Coming soon & Event countdown) */ .kl-newsletter { margin-bottom: 0; } .kl-newsletter-field, .kl-newsletter-submit { vertical-align: top; margin-bottom: 10px; } .kl-newsletter-field { color: #4d4d4d; background: #EFEFEF; border: 1px solid #a3a3a3; box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.1) inset; display: inline-block; height: 40px; width: calc(90% - 130px); float: left; } .kl-newsletter-submit { margin-left: 10px; width: 120px; float: left; } .kl-newsletter-submit.is-submitting { opacity: .4; pointer-events: none; } .kl-newsletter-submit:hover { background: #000; } .kl-newsletter-result { display: inline-block; margin-bottom: 10px; } .kl-newsletter-result:empty { display: inline; } .has-error .kl-newsletter-field { color: #f00; border-color: currentColor; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 10px currentColor; } /* Newsletter in footer */ @media screen and (min-width: 992px) and (max-width: 1199px) { .site-footer .kl-newsletter-field { width: calc(90% - 130px); } .site-footer .kl-newsletter-submit { width: 120px; } } @media screen and (min-width: 768px) and (max-width: 991px) { .site-footer .kl-newsletter-field { width: calc(100% - 80px); } .site-footer .kl-newsletter-submit { width: 70px; font-size: 11px; } } @media screen and (max-width: 767px) { .site-footer .kl-newsletter-field, .site-footer .kl-newsletter-submit { width: 100%; float: none; display: block; margin-left: 0; margin-bottom: 15px; } } /* Newsletter in sidebar */ .zn_sidebar .kl-newsletter-field, .zn_sidebar .kl-newsletter-submit { width: 100%; margin-left: 0; } /* Latest Posts Widget */ .latest_posts-wgt { position: relative; } .latest_posts-wgt-elm-title { margin-bottom: 20px; } .latest_posts-wgt-thumb { margin-right: 20px; margin-top: 5px; margin-bottom: 0; } .latest_posts-wgt-posts { margin: 0; padding: 0; list-style: none; } .latest_posts-wgt-post { margin-bottom: 15px; padding-bottom: 15px; border-bottom: 1px solid #E3E3E3; overflow: hidden; } .latest_posts-wgt-post:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: 0; } .latest_posts-wgt-title { font-size: 13px; margin: 0 0 5px; font-weight: 600; vertical-align: middle; line-height: 20px; margin: 0 0 5px; padding: 0; vertical-align: middle; } .latest_posts-wgt-coments { color: #bababa; } .latest_posts-wgt-thumb ~ .latest_posts-wgt-text, .latest_posts-wgt-thumb ~ .latest_posts-wgt-coments { margin-left: 74px; } .latest_posts-wgt-thumb + .latest_posts-wgt-title { overflow: hidden; } .widget_recent_entries .latest_posts-wgt-thumb img { max-width: 54px; } .element-scheme--dark .latest_posts-wgt-post { border-bottom-color: #252525; } .zn_sbs { zoom: 1; } .zn_sbs:before, .zn_sbs:after { content: "\0020"; display: block; height: 0; overflow: hidden; } .zn_sbs:after { clear: both; } .zn_sbs .menu > li { float: left; width: 50%; zoom: 1; } .zn_sbs .menu > li:before, .zn_sbs .menu > li:after { content: "\0020"; display: block; height: 0; overflow: hidden; } .zn_sbs .menu > li:after { clear: both; } @media (max-width: 767px) { .zn_sbs .menu > li { float: none; } } /* ============================================================================= // SITE FOOTER ---- FOOTER ---- FOOTER NAV ---- NEWSLETTER IN FOOTER // =========================================================================== */ /* FOOTER */ .site-footer { background: #2f2f2f; padding: 60px 0 20px; color: #d5d5d5; border-top: 4px solid #fff; position: relative; } .site-footer a { color: #fff; } .site-footer a:hover { color: #d5d5d5; } .site-footer .widgettitle { font-size: 14px; color: #fff; text-shadow: none; margin: 0 0 10px; padding-bottom: 0; text-transform: none; } .site-footer .widgettitle:after, .site-footer .widgettitle:before { display: none; } .element-scheme--dark .widgettitle { color: #FAFAFA; } /* WIDGET LISTS */ .site-footer div.widget ul.menu li a, .site-footer div.widget ul.pagenav li a, .site-footer div.widget.widget_meta > ul a, .site-footer div.widget.widget_pages > ul a { color: #fff; display: block; line-height: 1.6; padding: 0 10px 0 0; margin-bottom: 4px; } .site-footer .element-scheme--dark div.widget ul.menu li a, .site-footer .element-scheme--dark div.widget ul.pagenav li a, .site-footer .element-scheme--dark .widget_meta > ul a, .site-footer .element-scheme--dark .widget_pages > ul a { color: #232323; } .site-footer div.widget ul.menu li a::before, .site-footer div.widget ul.pagenav li a::before, .site-footer div.widget.widget_meta > ul a::before, .site-footer div.widget.widget_pages > ul a::before { display: none; } .site-footer div.widget ul.menu li.active > a, .site-footer div.widget ul.pagenav li.active a, .site-footer div.widget ul.menu li.current-cat > a, .site-footer div.widget ul.pagenav li.current-cat > a, .site-footer div.widget ul.menu li > a:hover, .site-footer div.widget ul.pagenav li a:hover, .site-footer div.widget.widget_meta > ul a:hover, .site-footer div.widget.widget_pages > ul a:hover { color: #d5d5d5; } .site-footer .element-scheme--dark .widget ul.menu li > a:hover, .site-footer .element-scheme--dark .widget ul.pagenav li a:hover, .site-footer .element-scheme--dark .widget_meta > ul a:hover, .site-footer .element-scheme--dark .widget_pages > ul a:hover { color: #000; } .site-footer div.widget ul.menu li a:hover::before, .site-footer div.widget ul.pagenav li a:hover::before, .site-footer div.widget.widget_meta > ul a:hover::before, .site-footer div.widget.widget_pages > ul a:hover::before { display: none; } .site-footer .latest_posts-wgt-post { border-bottom: 1px solid rgba(255, 255, 255, 0.05); } /* Footer Menu */ .site-footer .menu { margin: 0; padding: 0; list-style: none; overflow: hidden; } .site-footer .menu a { padding-right: 10px; } .site-footer .menu .sub-menu { list-style: none; margin: 0; padding: 0; padding-left: 15px; } /* Footer MapLink */ .map-link > span { margin-top: 2px; } /* Footer Bottom Side */ .site-footer-bottom { padding-top: 30px; border-top: 5px solid #484848; color: #8b8c8d; } .footer-copyright-img { float: left; margin-right: 20px; } /* Footer Social Icons */ .scfooter-icon-nocolor { background-color: #121212; } .site-footer .social-icons { margin-left: 0; padding-left: 0; margin-bottom: 30px; } .site-footer .social-icons-li.title { line-height: 30px; } .site-footer .social-icons-li { margin: 0 0 0 10px; } .site-footer .social-icons-li:first-child { margin-left: 0; } @media (min-width: 768px) { .site-footer .social-icons { float: right; } } /* Footer Contact Details */ .site-footer .contact-details { min-height: 64px; background-image: url(../images/say_hi_smaller.png); background-repeat: no-repeat; background-position: right top; } @media (min-width: 1200px) { .site-footer .contact-details { background-image: url(../images/say_hi.png); } } /* FOOTER NAV */ .zn_footer_nav-wrapper { float: right; } .footer_nav { margin: 0; padding: 0; list-style: none; position: relative; } .footer_nav > li { float: left; margin-left: 25px; position: relative; } .footer_nav li a { font-size: 11px; font-weight: 700; color: #fff; line-height: 24px; display: block; padding: 0; border-radius: 2px; opacity: .8; } .footer_nav li ul { margin: 0; padding: 0; list-style: none; } .footer_nav li ul a { font-size: 11px; font-weight: 400; line-height: 1.6; display: block; padding: 0; border-radius: 2px; opacity: .8; } .footer_nav li ul a:before { content: '-'; display: inline-block; margin-right: 10px; opacity: .2; } @media (max-width: 767px) { .zn_footer_nav-wrapper { float: none; margin-left: 0; padding-left: 0; margin-bottom: 30px; } .footer_nav { float: left; } .footer_nav li:first-child { margin-left: 0; } } /* ============================================================================= // PAGES ---- BLOG ---- BLOG COMMENTS ---- BLOG RESPOND ---- PORTFOLIO ITEM ---- PORTFOLIO OVERLAY ---- PORTFOLIO CAROUSEL ---- SORTABLE PORTFOLIO // =========================================================================== */ /* BLOG */ .kl-blog-item-dateicon, .kl-blog-post-category-icon, .kl-blog-post-date-icon, .kl-blog-item-category-icon, .kl-blog-item-tags-icon { margin: 0 5px 0 0; padding: 0; } .kl-blog-item-body, .kl-blog-post-body { line-height: 1.8; } .kl-blog-post-body { margin-bottom: 50px; } .kl-blog-taxonomy-description { margin-bottom: 50px; } /* tags */ .kl-blog-post-tags { margin: 0 0 20px; } .kl-blog--layout-def_classic .kl-blog-tag, .tagcloud a { padding: 4px 10px; background-color: #EAEAEA; margin-right: 5px; color: #9B9B9B; display: inline-block; margin-bottom: 5px; } .kl-blog--style-dark.kl-blog--layout-def_classic .kl-blog-tag, .kl-skin--dark .tagcloud a { background-color: #000000; color: #6D6D6D; } .kl-blog--layout-def_classic .kl-blog-tag:before, .tagcloud a:before { font-family: "Glyphicons Halflings"; content: "\e041"; margin-right: 5px; vertical-align: middle; color: #D2D2D2; } .kl-blog--style-dark.kl-blog--layout-def_classic .kl-blog-tag:before, .kl-skin--dark .tagcloud a:before { color: #646464; } /* Blog Listing */ .kl-blog-list-wrapper { margin-bottom: 35px; } .kl-blog-item-title { margin: 0 0 10px; } .kl-blog-item-container { margin-bottom: 35px; padding: 30px 30px 15px 30px; position: relative; border-radius: 3px; background: #FFF; box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.15); } .kl-blog--style-dark .kl-blog-item-container { background: #121212; box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.8); } .kl-blog-item-container:after { position: absolute; bottom: 0; left: 50%; margin-left: -3px; width: 0; height: 0; border-style: solid; border-color: transparent; border-width: 5px; content: ""; } .kl-blog--style-dark .kl-blog-item-container:after { border-bottom-color: #292929 !important; } .kl-blog-item-details { font-size: 11px; color: #9a9a9a; margin-bottom: 15px; text-transform: uppercase; padding: 10px 0 10px; position: relative; -webkit-transition: opacity 150ms ease-in; transition: opacity 150ms ease-in; } .kl-blog--style-dark .kl-blog-item-details { color: #9a9a9a; } .kl-blog-item-bottom { margin-top: 20px; border-bottom: 1px solid rgba(0, 0, 0, 0.1); margin-bottom: 15px; padding-bottom: 15px; } .kl-blog--style-dark .kl-blog-item-bottom { border-bottom: 1px solid rgba(255, 255, 255, 0.04); } .kl-blog-item-more { font-size: 14px; font-weight: bold; } .kl-blog-item-links { float: left; list-style: none !important; font-size: 10px; color: #AAA; text-transform: uppercase; margin-top: 0; padding-left: 0; margin-bottom: 0; margin-left: 0; } .kl-blog--style-dark .kl-blog-item-links { color: #AAA; } .kl-blog-item-comments { float: right; } .kl-blog-item-comments-link { font-size: 10px; text-transform: uppercase; } .kl-blog-item-category { float: left; margin-left: 0; padding-left: 0; } .kl-blog-item-date { padding-left: 0; } .kl-blog-item-tags { padding-left: 0; font-size: 10px; color: #AAA; text-transform: uppercase; } .kl-blog--default .kl-blog-item-tags { float: left; } .kl-blog-item-more { float: right; } /* Blog post quote */ .kl-quote-post { padding-top: 0; } .kl-quote-post-blockquote { margin: 0; border: 0; font-size: 16px; line-height: 1.6; padding: 50px 0 0; position: relative; } .kl-quote-post-blockquote:before { content: '\201C'; font-size: 90px; line-height: 1; position: absolute; left: 0; top: 0; opacity: .1; color: #000; } .kl-quote-post-title { font-size: 18px; } /* Dark */ .element-scheme--dark .kl-quote-post-blockquote { border: 0; } .element-scheme--dark .kl-quote-post-blockquote:before { color: #fff; } /* Blog post - link */ .kl-blog--normal-post.format-link .kl-blog-item-details { margin-bottom: 0; } .kl-link-post { font-size: 24px; line-height: 1.4; } .kl-link-post-icon { opacity: 0.6; font-size: 20px; vertical-align: middle; top: 0; margin-right: 5px; } .kl-link-post-url { text-decoration: underline; } .zn_post_media_container { margin-bottom: 30px; } .kl-blog--default .zn_post_media_container { margin: -30px -30px 30px -30px; } .kl-blog--columns .zn_post_media_container { margin-bottom: 0; } .znPostGallery { margin-bottom: 50px; position: relative; } .znPostGallery ul { list-style: none; margin: 0; padding: 0; } .znPostGallery-navigationPagination { position: absolute; left: 50%; bottom: 30px; padding: 0 35px; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .znPostGallery .znSlickNav-arr { width: 22px; height: 22px; line-height: 22px; text-align: center; position: absolute; top: 0; left: 0; } .znPostGallery .znSlickNav-next { left: auto; right: 0; } .znPostGallery.slick--showOnMouseover .znPostGallery-pagination { opacity: 0; -webkit-transition: opacity .15s ease-out; transition: opacity .15s ease-out; } .znPostGallery.slick--showOnMouseover:hover .znPostGallery-pagination { opacity: 1; } .znPostGallery .znPostGallery-pagination polyline { stroke: #fff; } .znPostGallery .znPostGallery-pagination { height: 18px; line-height: 18px; display: inline-block; } .znPostGallery .znPostGallery-pagination button { background-color: rgba(255, 255, 255, 0.5); } .znPostGallery .znPostGallery-pagination li.slick-active button { background-color: white; } .kl-blog--default .znPostGallery { margin: -30px -30px 50px -30px; } /* Needed for responsive WP media */ .wp-video { width: auto !important; } audio, canvas, video { max-width: 100%; } .mejs-container, .mejs-embed, .mejs-embed body { background: transparent !important; } /* Featured Post */ .kl-blog--featured-post { position: relative; padding: 0; } .kl-blog--featured-post:after { content: none; } .kl-blog--featured-post .kl-blog-full-image { position: relative; border-bottom: none; min-height: 220px; } .kl-blog--featured-post .kl-blog-full-image-img { width: 100%; } .kl-blog--featured-post .kl-blog-sticky-noimg { min-height: 400px; background-color: #333; } .kl-blog-featured-content { position: absolute; bottom: 0; left: 0; right: 0; padding: 30px; z-index: 1; } .kl-blog-featured-content:before { content: ''; position: absolute; top: -50%; left: 0; width: 100%; height: 150%; background: -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.6)); background: linear-gradient(transparent, rgba(0, 0, 0, 0.6)); opacity: 0; visibility: hidden; -webkit-animation: animFadeIn .4s ease-in .7s 1 normal forwards running; animation: animFadeIn .4s ease-in .7s 1 normal forwards running; } @-webkit-keyframes animFadeIn { from { opacity: 0; visibility: hidden; } to { opacity: 1; visibility: visible; } } @keyframes animFadeIn { from { opacity: 0; visibility: hidden; } to { opacity: 1; visibility: visible; } } .kl-blog-featured-inner { position: relative; } .kl-blog-featured-content .kl-blog-item-header { border-bottom: 1px solid rgba(255, 255, 255, 0.1); margin-bottom: 15px; padding-bottom: 15px; } .kl-blog-featured-content .kl-blog-item-title { font-size: 20px; text-transform: uppercase; font-weight: normal; line-height: 1.6; margin: 0 0 15px; } .kl-blog-featured-content .kl-blog-item-details { color: rgba(255, 255, 255, 0.7); padding: 0; margin: 0; } .kl-blog-featured-content .kl-blog-item-details:before { content: none; } .kl-blog-featured-content .kl-blog-item-links { color: rgba(255, 255, 255, 0.7); } .kl-blog--featured-post .kl-blog-featured-content a, .kl-blog--featured-post .kl-blog-featured-content a:hover { color: #fff; } .kl-blog-featured-content a:hover { opacity: .75; } @media (max-width: 480px) { .kl-blog--featured-post .kl-blog-sticky-noimg { min-height: 200px; } .kl-blog-featured-content { padding: 10px 15px; } .kl-blog-featured-content .kl-blog-item-title { font-size: 16px; line-height: 1.6; margin: 0 0 10px; } .kl-blog-featured-content .kl-blog-item-header { margin-bottom: 10px; padding-bottom: 10px; } } /* Generic Blog - Modern Style (Classic face-lifted) */ .kl-blog--layout-def_modern .kl-blog-item-container { box-shadow: none; -webkit-transition: box-shadow .15s ease-out; transition: box-shadow .15s ease-out; padding: 60px 60px 45px; margin-bottom: 50px; } .kl-blog--layout-def_modern .kl-blog-item-container:hover { box-shadow: 0 20px 40px rgba(0, 0, 0, 0.09); } .kl-blog--layout-def_modern .kl-blog-item-actions { float: right; list-style: none; position: relative; padding: 20px 0 0; z-index: 1; } .kl-blog--layout-def_modern .kl-blog-item-actions li { display: inline-block; margin: 0 5px; } .kl-blog--layout-def_modern .kl-blog-item-actions li:last-child { margin-right: 0; } .kl-blog--layout-def_modern .kl-blog-item-comments-link { display: block; } .kl-blog--layout-def_modern .kl-blog-item-comments-link span { vertical-align: middle; } .kl-blog--layout-def_modern .kl-blog-item-comments-icon { vertical-align: middle; width: 18px; height: 18px; } .kl-blog--layout-def_modern .kl-blog-item-comments-link path { -webkit-transition: stroke-width .2s; transition: stroke-width .2s; } .kl-blog--layout-def_modern .kl-blog-item-comments-link:hover { color: #000; } .kl-blog--layout-def_modern .kl-blog-item-comments-link:hover path { stroke-width: 3px; } .kl-blog--layout-def_modern .kl-blog-item-details { padding-top: 0; } .kl-blog--layout-def_modern .kl-blog-item-author-avatar { float: left; margin-right: 20px; } .kl-blog--layout-def_modern .kl-blog-item-author-avatar .avatar.photo { border-radius: 50%; } .kl-blog--layout-def_modern .kl-blog-item-author { font-size: 14px; line-height: 1.6; margin-top: 6px; text-transform: none; } .kl-blog--layout-def_modern .kl-blog-item-meta { font-size: 10px; line-height: 1.4; text-transform: uppercase; } .kl-blog--layout-def_modern .kl-blog-item-title { font-size: 26px; font-weight: 700; line-height: 1.3; margin-bottom: 0.5em; } .kl-blog--layout-def_modern .kl-blog-item-content { font-size: 15px; line-height: 1.6; } .kl-blog--layout-def_modern .kl-blog-item-more { margin: 0 0 10px 30px; } .kl-blog--layout-def_modern .kl-blog-item-more-btn .svg-more-bg, .kl-blog--layout-def_modern .kl-blog-item-more-btn .svg-more-l1, .kl-blog--layout-def_modern .kl-blog-item-more-btn .svg-more-l2, .kl-blog--layout-def_modern .kl-blog-item-more-btn .svg-more-l3 { -webkit-transition: all .15s ease-out; transition: all .15s ease-out; } .kl-blog--layout-def_modern .kl-blog-item-more-btn:hover .svg-more-bg { stroke-width: 4px; stroke: rgba(0, 0, 0, 0.2); } .kl-blog--layout-def_modern .kl-blog-item-more-btn:hover .svg-more-l1 { width: 8px; } .kl-blog--layout-def_modern .kl-blog-item-more-btn:hover .svg-more-l2 { width: 22px; } .kl-blog--layout-def_modern .kl-blog-item-more-btn:hover .svg-more-l3 { width: 11px; } .kl-blog--layout-def_modern .kl-blog-fixedimg .kl-blog-item-more { margin: 20px 0 0; float: none; } .kl-blog--layout-def_modern .kl-blog-item-head-wrapper { position: relative; margin: -60px -60px 20px; } .kl-blog--layout-def_modern .kl-blog-item-head-wrapper .kl-blog-item-details { margin-bottom: 0; padding-bottom: 0; } .kl-blog--layout-def_modern .kl-blog-item-head-wrapper .kl-blog-item-header { position: absolute; left: 0; bottom: 0; padding: 0 60px 30px; right: 0; z-index: 1; } .kl-blog--layout-def_modern .kl-blog-item-head-wrapper .kl-blog-item-header a { color: #fff; } .kl-blog--layout-def_modern .kl-blog-item-head-wrapper .kl-blog-item-header, .kl-blog--layout-def_modern .kl-blog-item-head-wrapper .kl-blog-item-header a:hover, .kl-blog--layout-def_modern .kl-blog-item-head-wrapper .kl-blog-item-details, .kl-blog--layout-def_modern .kl-blog-item-head-wrapper .kl-blog-item-comments-link:hover { color: rgba(255, 255, 255, 0.7); } .kl-blog--layout-def_modern .kl-blog-item-head-wrapper .kl-blog-item-comments-link path { stroke: #fff; } /* Full Image */ .kl-blog--layout-def_modern .kl-blog-full-image { position: relative; margin-bottom: 40px; } .kl-blog--layout-def_modern .kl-blog-full-image:after { content: ''; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 1; background: #000; opacity: 0.4; -webkit-transition: all .15s ease-out; transition: all .15s ease-out; pointer-events: none; } .kl-blog--layout-def_modern .kl-blog-full-image:hover:after { opacity: 0.1; } .kl-blog--layout-def_modern .kl-blog-full-image-link { border-bottom: 0; position: relative; margin-bottom: 0; } .kl-blog--layout-def_modern .kl-blog-full-image-link.hoverBorder:hover img { opacity: 1; } .kl-blog--layout-def_modern .kl-blog-full-image-link.hoverBorder:after { display: none; } /* Fixed width image */ .kl-blog--layout-def_modern .kl-blog-post-image-link { border-bottom: 0; position: relative; margin-bottom: 0; } .kl-blog--layout-def_modern .kl-blog-post-image-link.hoverBorder:after { display: none; } .kl-blog--layout-def_modern .kl-blog-item-bottom { margin-top: 20px; border-bottom: 0; margin-bottom: 0; padding-bottom: 0; } .kl-blog--layout-def_modern .kl-blog-item-tags:before { font-family: "Glyphicons Halflings"; content: "\e041"; margin-right: 5px; vertical-align: middle; opacity: .4; } .kl-blog--layout-def_modern .kl-blog-tag { display: inline-block; margin-right: 5px; color: rgba(0, 0, 0, 0.5); } .kl-blog--layout-def_modern .kl-blog-tag:hover { color: #000; } .kl-blog--layout-def_modern .kl-blog-tag:after { content: ','; } .kl-blog--layout-def_modern .kl-blog-tag:last-child:after { content: ''; } .kl-blog--layout-def_modern .kl-quote-post-blockquote { font-size: 26px; line-height: 1.4; font-style: italic; font-family: Georgia; font-weight: 400; } .kl-blog--default.kl-blog--layout-def_modern .zn_post_media_container, .kl-blog--default.kl-blog--layout-def_modern .znPostGallery { margin: -60px -60px 30px -60px; } /* Featured post */ .kl-blog--layout-def_modern .kl-blog--featured-post { padding: 0; } .kl-blog--layout-def_modern .kl-blog-featured-content:before { display: none; } .kl-blog--layout-def_modern .kl-blog-featured-content { padding: 60px 60px 45px; } .kl-blog--layout-def_modern .kl-blog-featured-content .kl-blog-item-title { margin-bottom: 20px; text-transform: none; } .kl-blog--layout-def_modern .kl-blog-featured-content .kl-blog-item-header { border-bottom: 0; padding-bottom: 0; margin-bottom: 0; } .kl-blog--layout-def_modern .kl-blog-featured-content .kl-blog-item-header a { color: #fff; } .kl-blog--layout-def_modern .kl-blog-featured-content .kl-blog-item-header, .kl-blog--layout-def_modern .kl-blog-featured-content .kl-blog-item-header a:hover, .kl-blog--layout-def_modern .kl-blog-featured-content .kl-blog-item-details, .kl-blog--layout-def_modern .kl-blog-featured-content .kl-blog-item-comments-link:hover { color: rgba(255, 255, 255, 0.7); } .kl-blog--layout-def_modern .kl-blog-featured-content .kl-blog-item-comments-link path { stroke: #fff; } /* DARK | Generic Blog - Modern Style (Classic face-lifted) */ .kl-blog--style-dark.kl-blog--layout-def_modern .kl-blog-item-container:hover { box-shadow: 0 20px 40px rgba(0, 0, 0, 0.8); } .kl-blog--style-dark.kl-blog--layout-def_modern .kl-blog-item-comments-link:hover { color: #FFF; } .kl-blog--style-dark.kl-blog--layout-def_modern .kl-blog-item-comments-link path { stroke: #FFF; } .kl-blog--style-dark.kl-blog--layout-def_modern .kl-blog-item-more-btn path, .kl-blog--style-dark.kl-blog--layout-def_modern .kl-blog-item-more-btn rect { fill: rgba(255, 255, 255, 0.5); } .kl-blog--style-dark.kl-blog--layout-def_modern .kl-blog-item-more-btn .svg-more-bg { stroke: rgba(255, 255, 255, 0.5); fill: none; } .kl-blog--style-dark.kl-blog--layout-def_modern .kl-blog-item-head-wrapper .kl-blog-item-header a { color: #000; } .kl-blog--style-dark.kl-blog--layout-def_modern .kl-blog-item-head-wrapper .kl-blog-item-header, .kl-blog--style-dark.kl-blog--layout-def_modern .kl-blog-item-head-wrapper .kl-blog-item-header a:hover, .kl-blog--style-dark.kl-blog--layout-def_modern .kl-blog-item-head-wrapper .kl-blog-item-details, .kl-blog--style-dark.kl-blog--layout-def_modern .kl-blog-item-head-wrapper .kl-blog-item-comments-link:hover { color: rgba(0, 0, 0, 0.7); } .kl-blog--style-dark.kl-blog--layout-def_modern .kl-blog-item-head-wrapper .kl-blog-item-comments-link path { stroke: #000; } /* Full Image */ .kl-blog--style-dark.kl-blog--layout-def_modern .kl-blog-full-image:after { background: #000; } .kl-blog--style-dark.kl-blog--layout-def_modern .kl-blog-tag { color: rgba(255, 255, 255, 0.5); } .kl-blog--style-dark.kl-blog--layout-def_modern .kl-blog-tag:hover { color: #FFF; } /* Featured post */ .kl-blog--style-dark.kl-blog--layout-def_modern .kl-blog-featured-content .kl-blog-item-header a { color: #fff; } .kl-blog--style-dark.kl-blog--layout-def_modern .kl-blog-featured-content .kl-blog-item-header, .kl-blog--style-dark.kl-blog--layout-def_modern .kl-blog-featured-content .kl-blog-item-header a:hover, .kl-blog--style-dark.kl-blog--layout-def_modern .kl-blog-featured-content .kl-blog-item-details, .kl-blog--style-dark.kl-blog--layout-def_modern .kl-blog-featured-content .kl-blog-item-comments-link:hover { color: rgba(255, 255, 255, 0.7); } .kl-blog--style-dark.kl-blog--layout-def_modern .kl-blog-featured-content .kl-blog-item-comments-link path { stroke: #fff; } /* Multi-columns Blog */ .kl-blog-column { padding-left: 15px; padding-right: 15px; } .kl-blog-item-container.zn_columns { padding: 0 0 20px; } .kl-blog-item-container.zn_columns .kl-blog-item-header, .kl-blog-item-container.zn_columns .kl-blog-item-body, .kl-blog-item-container.zn_columns .kl-blog-item-links, .kl-blog-item-container.zn_columns .kl-blog-item-tags { padding: 0 25px; } .kl-blog-item-container.zn_columns .kl-blog-item-content { padding: 0 0 15px; margin: 0 0 15px; border-bottom: 1px solid #F5F5F5; } .kl-blog-item-container.zn_columns .kl-blog-post-image, .kl-blog-item-container.zn_columns .kl-blog-full-image { float: none !important; margin: 0; } .kl-blog-item-container.zn_columns .kl-blog-full-image-link, .kl-blog-item-container.zn_columns .kl-blog-post-image-link { border-bottom: 0; } .kl-blog-item-container.zn_columns .kl-blog-full-image-link.hoverBorder, .kl-blog-item-container.zn_columns .kl-blog-post-image-link.hoverBorder { position: relative; display: inline-block; margin-bottom: 0; float: none !important; } .kl-blog-item-container.zn_columns .kl-blog-full-image-link.hoverBorder:after, .kl-blog-item-container.zn_columns .kl-blog-post-image-link.hoverBorder:after { display: none; } .kl-blog--style-dark .kl-blog-item-container.zn_columns .kl-blog-item-content { border-bottom: 1px solid #000; } .kl-blog-item-container.zn_columns .kl-blog-item-overlay-more { font-size: 14px; font-weight: bold; text-transform: uppercase; } .kl-blog-item-container.zn_columns .kl-blog-item-title { line-height: 1.6; font-size: 16px; padding: 25px 0 0; } .kl-blog-item-container.zn_columns.zn_columns4 .kl-blog-item-overlay-more, .kl-blog-item-container.zn_columns.zn_columns3 .kl-blog-item-overlay-more { font-size: 13px; } /* Item Thumbnail */ .kl-blog-item-thumbnail { position: relative; } .kl-blog-item-thumbnail-img { display: block; width: 100%; height: auto; } .kl-blog-item-thumbnail-link { display: block; } /* Overlay link */ .kl-blog-item-overlay { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-color: rgba(0, 0, 0, 0.5); opacity: 0; -webkit-transition: opacity .25s ease-in-out, visibility .25s ease-in-out; transition: opacity .25s ease-in-out, visibility .25s ease-in-out; } .kl-blog-item-container.zn_columns:hover .kl-blog-item-overlay { opacity: 1; visibility: visible; } .kl-blog-item-overlay-inner { position: absolute; top: 50%; left: 0; right: 0; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .kl-blog-item-overlay-inner .kl-blog-item-overlay-more { margin: 0 auto; width: 48px; height: 48px; border-radius: 30px; display: block; border: 2px solid currentColor; position: relative; text-align: center; overflow: hidden; color: #fff; line-height: 46px; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .kl-blog-item-overlay-inner .kl-blog-item-overlay-more:hover { width: 120px; background: #cd2122; border-color: #cd2122; } .kl-blog-item-overlay-inner .kl-blog-item-overlay-more:before { content: "+"; position: absolute; left: 50%; margin-left: -6px; font-size: 20px; font-weight: bold; opacity: 1; -webkit-transition: opacity .25s ease-in-out; transition: opacity .25s ease-in-out; } .kl-blog-item-overlay-inner .kl-blog-item-overlay-more:hover:before { opacity: 0; } .kl-blog-item-overlay-inner .kl-blog-item-overlay-more:after { content: attr(data-readmore); color: #fff; opacity: 0; font-size: 11px; -webkit-transition: opacity .25s ease-in-out; transition: opacity .25s ease-in-out; } .kl-blog-item-overlay-inner .kl-blog-item-overlay-more:hover:after { opacity: 1; } /* Blog Page */ .kl-blog-page-image { display: block; width: 100%; text-align: center; overflow: hidden; margin-bottom: 35px; } /* Link formnat post */ .kl-blog-item-container.zn_columns.format-link { padding-top: 20px; } .kl-blog-item-container.zn_columns.format-link .kl-blog-item-details { margin-bottom: 0; } /* Link formnat post */ .kl-blog-item-container.zn_columns.format-quote { padding-top: 20px; } .kl-blog-item-container.zn_columns.format-quote .kl-blog-item-details { margin-bottom: 0; } /* Blog Post */ .kl-blog-post-title { padding-bottom: 0; border-bottom: 0 !important; } .kl-blog-post-details { font-size: 11px; color: #9a9a9a; margin-bottom: 15px; text-transform: uppercase; padding: 10px 0 10px; position: relative; -webkit-transition: opacity 150ms ease-in; transition: opacity 150ms ease-in; } .kl-blog--style-dark .kl-blog-post-details { color: #9a9a9a; } .kl-blog-post-details:before { content: ''; position: absolute; left: 0; top: -1px; width: 60px; height: 1px; background-color: #ddd; } .kl-blog--style-dark .kl-blog-post-details:before { background-color: #3B3B3B; } .kl-blog-post-details-sep { display: inline-block; margin: 0 5px; } .kl-blog-post-img.pull-left { margin-right: 20px; margin-bottom: 15px; } .kl-blog-post-img.pull-right { margin-left: 20px; margin-bottom: 15px; } .kl-blog-post-img.full-width { margin-bottom: 25px; } .kl-blog-post-socsharing { margin-bottom: 20px; margin-top: 10px; padding: 0; list-style: none; } .kl-blog-post-socsharing li { float: left; margin-right: 20px; width: 70px; } .blog-item-share { display: inline-block; } .blog-item-share:before { content: attr(data-share-title); font-size: 12px; font-weight: 600; display: block; line-height: 1; margin-bottom: 10px; color: #8A8A8A; } .blog-item-share-link { display: inline-block; width: 30px; height: 30px; margin-top: -5px; border-radius: 3px; color: rgba(0, 0, 0, 0.25); background-color: transparent; border-color: #E2E2E2; border-top: 0; border-bottom: 0; border-right: 0; border: 0; font-size: 16px; text-align: center; margin-right: 5px; line-height: 30px; } .portfolio-cat--dark .blog-item-share-link, .portfolio-item--dark .blog-item-share-link { color: rgba(255, 255, 255, 0.5); } .blog-item-share-link:hover { color: #fff; } .blog-item-share .blog-item-share-twitter { font-size: 13px; } .blog-item-share-twitter:hover { background: #55ACEE; } .blog-item-share-facebook:hover { background: #3B5998; } .blog-item-share-gplus:hover { background: #CC3732; } .blog-item-share-pinterest:hover { background: #CC2127; } .blog-item-share-mail:hover { background: #565656; } .kl-blog-post-tags { padding-left: 0; font-size: 10px; color: #AAA; text-transform: uppercase; } .kl-blog-cols-2 { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; -webkit-column-gap: 30px; -moz-column-gap: 30px; column-gap: 30px; } .kl-blog-cols-2 blockquote { margin-left: 0; margin-right: 0; } .kl-blog-cols-2 .kl-blog-post-img.full-width { -webkit-column-span: all; -moz-column-span: all; column-span: all; display: block; float: none !important; } .kl-blog-cols-2 div { -webkit-column-span: all; -moz-column-span: all; column-span: all; } /* Post image */ .kl-blog-full-image { margin-bottom: 20px; text-align: center; } .kl-blog-post-image { float: left; margin-right: 30px; margin-bottom: 10px; } .kl-blog-full-image-link, .kl-blog-post-image-link { border-bottom: 5px solid #cd2122; } @media (max-width: 991px) { .kl-blog-cols-2 { -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; } } @media (max-width: 767px) { .kl-blog-post-image, .kl-blog-post-img.pull-left { margin-right: 0; width: 100%; } } /* Post Author */ .kl-blog-post-author { color: #535353; margin-bottom: 50px; overflow: hidden; border-top: 1px solid #E9E9E9; border-bottom: 1px solid #E9E9E9; padding: 30px 0; } .kl-blog--style-dark .kl-blog-post-author { color: #C5C5C5; border-top: 1px solid rgba(233, 233, 233, 0.1); border-bottom: 1px solid rgba(233, 233, 233, 0.1); } .kl-blog-post-author-avatar { float: left; width: 100px; margin-right: 20px; } .kl-blog-post-author-avatar img { display: block; max-width: 100%; height: auto; border-radius: 50%; } .kl-blog-post-author-title { text-transform: uppercase; } /* Related Articles */ .kl-blog-related-title { font-size: 14px; text-align: center; text-transform: uppercase; margin: 0 0 20px; } .kl-blog-related-post-link { display: block; position: relative; } .kl-blog-related-post-link:after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 0; background-color: #cd2122; -webkit-transition: height .25s ease-in-out; transition: height .25s ease-in-out; } .kl-blog-related-post:hover .kl-blog-related-post-link:after { height: 8px; } .kl-blog-related-post-title { text-transform: uppercase; } /* Modern Layout for single blog item */ .kl-single-layout--modern .kl-blog-list-wrapper { margin-bottom: 0; } .kl-single-layout--modern .kl-blog-post { padding: 60px; background: #fff; } @media (max-width: 767px) { .kl-single-layout--modern .kl-blog-post { padding-left: 20px; padding-right: 20px; } } .kl-single-layout--modern .kl-blog-post-img.full-width { margin: 0; border-bottom: 0; position: relative; float: none !important; } .kl-single-layout--modern .kl-blog-post-img.full-width img { opacity: 1; border-radius: 0; } .kl-single-layout--modern .kl-blog-post-img.full-width:after { content: ''; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 1; background: #000; opacity: 0.4; -webkit-transition: all .15s ease-out; transition: all .15s ease-out; pointer-events: none; box-shadow: none; border-radius: 0; } .kl-single-layout--modern .kl-blog-post-img.full-width:hover:after { opacity: 0.1; } /* Fixed width image */ .kl-single-layout--modern .kl-blog-post--default-view { border-bottom: 0; position: relative; margin-bottom: 0; } .kl-single-layout--modern .kl-blog-post--default-view.hoverBorder:after { display: none; } .kl-single-layout--modern .kl-blog-post-details { margin-bottom: 40px; padding-bottom: 0; } .kl-single-layout--modern .kl-blog-post-details:before { display: none; } .kl-single-layout--modern .kl-blog-single-head-wrapper .kl-blog-post-details { margin-bottom: 0; } .kl-single-layout--modern .kl-blog-single-head-wrapper { position: relative; margin: -60px -60px 40px; min-height: 100px; } .kl-single-layout--modern .kl-blog-single-head-wrapper .kl-blog-post-header { position: absolute; left: 0; bottom: 0; padding: 0 60px 40px; right: 0; z-index: 1; } .kl-single-layout--modern .kl-blog-single-head-wrapper .kl-blog-post-header a { color: #fff; } .kl-single-layout--modern .kl-blog-single-head-wrapper .kl-blog-post-header, .kl-single-layout--modern .kl-blog-single-head-wrapper .kl-blog-post-header a:hover, .kl-single-layout--modern .kl-blog-single-head-wrapper .kl-blog-post-details { color: rgba(255, 255, 255, 0.7); } .kl-single-layout--modern .kl-blog-post-author-avatar { float: left; margin-right: 20px; width: auto; } .kl-single-layout--modern .kl-blog-post-author-avatar .avatar.photo { border-radius: 50%; } .kl-single-layout--modern .kl-blog-post-author-link { font-size: 14px; line-height: 1.6; padding-top: 4px; text-transform: none; } .kl-single-layout--modern .kl-blog-post-meta { font-size: 10px; line-height: 1.4; text-transform: uppercase; } .kl-single-layout--modern .kl-blog-post-body { font-size: 16px; } .kl-single-layout--modern .blog-sg-footer { margin-bottom: 40px; } .kl-single-layout--modern .kl-blog-related-title { font-size: 16px; text-transform: none; font-weight: 700; text-align: start; } .kl-single-layout--modern .kl-blog-related-post-title { text-transform: none; } .kl-single-layout--modern .kl-blog-post-tags { margin: 0; float: right; text-align: right; } .kl-single-layout--modern .kl-blog-post-tags-text { display: block; } .kl-commlayout-modern { padding: 20px 60px 40px; background: #fff; margin-top: 1px; margin-bottom: 50px; } .kl-single-layout--modern .zn_post_media_container { margin: 0; } .kl-single-layout--modern.format-video .kl-blog-post { padding-top: 30px; } .kl-single-layout--modern.format-gallery .znPostGallery { margin-bottom: 0; } /* DARK | Modern Layout for single blog item */ .kl-single-layout--modern .kl-blog--style-dark .kl-blog-post { background: #000; } .kl-single-layout--modern .kl-blog--style-dark .kl-blog-post-img.full-width:after { background: #fff; } .kl-single-layout--modern .kl-blog--style-dark .kl-blog-single-head-wrapper .kl-blog-post-header a { color: #000; } .kl-single-layout--modern .kl-blog--style-dark .kl-blog-single-head-wrapper .kl-blog-post-header, .kl-single-layout--modern .kl-blog--style-dark .kl-blog-single-head-wrapper .kl-blog-post-header a:hover, .kl-single-layout--modern .kl-blog--style-dark .kl-blog-single-head-wrapper .kl-blog-post-details { color: rgba(0, 0, 0, 0.7); } .kl-skin--dark .kl-commlayout-modern { background: #000; } /* WP BLOG STYLES */ .wp-caption p.wp-caption-text { font-size: 11px; line-height: 17px; margin: 0; padding: 0 4px 5px; } .wp-smiley { margin: 0 !important; max-height: 1em; } blockquote.left { float: left; margin-left: 0; margin-right: 20px; text-align: right; width: 33%; } blockquote.right { float: right; margin-left: 20px; margin-right: 0; text-align: left; width: 33%; } /* BLOG COMMENTS */ .kl-comments { margin-top: 20px; } .kl-comments label { display: block; margin-bottom: 5px; } .kl-comments .form-control { width: 100%; } .kl-comments-list { margin-left: 0; list-style-type: none; padding-left: 0; } /* Comment */ .kl-comment__wrapper { position: relative; margin: 0; padding: 10px; background-color: white; border: 1px solid #DDD; border-radius: 4px; } .kl-comment { margin-bottom: 15px; } .kl-comment > .children { margin-bottom: 0; margin-top: 15px; } .kl-comment__author .avatar { display: block; width: 64px; height: 64px; float: left; margin-right: 15px; overflow: hidden; padding: 2px; border: 1px solid #ddd; line-height: 0; border-radius: 2px; } .kl-comment__author { font-size: 13px; font-weight: bold; } .kl-comment__meta { font-size: 11px; font-style: normal; margin-bottom: 5px; color: #999; } .kl-comment__meta-link { color: #999; } .kl-comment__meta .comment-edit-link { float: right; margin-right: 52px; position: relative; top: -20px; } .kl-comment__text { padding-left: 80px; margin: 4px 0 10px; } .kl-comment .reply { position: absolute; right: 0; top: 0; } .kl-comment .comment-reply-link { position: absolute; top: -1px; right: -1px; padding: 3px 7px; font-size: 10px; font-weight: bold; background-color: whiteSmoke; border: 1px solid #DDD; color: #9DA0A4; border-radius: 0 4px 0 4px; text-transform: uppercase; } .kl-comment .comment-reply-link:hover { color: #222; } .kl-comment .reply .comment-reply-link { font-size: 11px; padding: 3px 6px; border-radius: 3px; } .kl-comment .reply .comment-reply-link:hover { text-decoration: none; } .kl-comment .comment-body { margin-bottom: 15px; position: relative; padding-bottom: 15px; border-bottom-width: 1px; border-bottom-style: solid; } /* Children */ .kl-comments-list .children { margin-bottom: 0; margin-left: 0; padding-left: 50px; border-left: 1px solid #fff; } .kl-comments-list .children li { margin-bottom: 0; list-style: none; } /* Comments title */ .kl-comments-title { font-size: 22px; line-height: 28px; margin-bottom: 20px; } .kl-comments-title span { font-style: italic; } /* separator */ .kl-comments-sep { *zoom: 1; } .kl-comments-sep:before, .kl-comments-sep:after { display: table; content: ""; line-height: 0; } .kl-commlayout-modern { padding: 20px 60px 40px; background: #fff; margin-top: 1px; margin-bottom: 50px; } .kl-commlayout-modern .kl-comment__wrapper { padding: 0; background-color: transparent; border: 0; border-radius: 0; } .kl-commlayout-modern .kl-comment__author .avatar { border-radius: 50%; padding: 0; border: 0; width: 46px; height: 46px; } .kl-commlayout-modern .kl-comment__author { font-weight: normal; } .kl-commlayout-modern .kl-comment__author .fn { font-style: normal; } .kl-commlayout-modern .kl-comment__meta { font-size: 10px; line-height: 1.5; } .kl-commlayout-modern .kl-comment .comment-reply-link { background-color: transparent; border: 0; color: #333; padding: 0; } .kl-commlayout-modern .kl-comment .comment-reply-link:hover { color: #000; } .kl-commlayout-modern .kl-comment__text { border-bottom: 1px solid #EAEAEA; } .kl-commlayout-modern .kl-comments-sep:after { clear: both; } /*Dark*/ .kl-skin--dark .kl-commlayout-modern { background: #000; } .kl-skin--dark .kl-commlayout-modern .kl-comment .comment-reply-link { color: #ccc; } .kl-skin--dark .kl-commlayout-modern .kl-comment .comment-reply-link:hover { color: #FFF; } .kl-skin--dark .kl-commlayout-modern .kl-comment__text { border-bottom: 1px solid #151515; } .kl-skin--dark .kl-commlayout-modern .btn.btn-lined { color: #fff; border-color: #fff; } /* BLOG RESPOND */ .comment-respond { padding: 15px 0; position: relative; margin-top: 15px; } .kl-comment .comment-respond { padding: 15px 20px; position: relative; background-color: #F8F8F8; border: 1px solid #ccc; border-radius: 4px; margin-top: 15px; } .kl-comment .comment-respond:after { content: ''; position: absolute; left: 35px; top: -16px; border: 8px solid transparent; border-bottom-color: #F8F8F8; } .kl-comment .comment-respond:before { content: ''; position: absolute; left: 34px; top: -18px; border: 9px solid transparent; border-bottom-color: #ccc; } .comment-respond .row { margin-bottom: 10px; } .comment-respond .zn_com_title { margin-top: 0; } .comment-respond #cancel-comment-reply-link { position: absolute; top: -1px; right: -1px; padding: 10px 15px; font-size: 10px; font-weight: bold; background-color: #fff; border: 1px solid #ccc; border-radius: 0 4px 0 4px; text-transform: uppercase; font-family: inherit; } .comment-respond #cancel-comment-reply-link { color: #9DA0A4; } .comment-respond #cancel-comment-reply-link:hover { color: #222; } .comment-respond p { margin-bottom: 5px; padding-left: 0 !important; } .comment-respond .comment-notes .required { position: static; } .comment-respond input[type="text"] { margin-bottom: 0; } .comment-respond .form-allowed-tags code { margin-top: 10px; } /* PORTFOLIO ITEM */ .hg-portfolio-item { position: relative; } .portfolio-item-title { text-transform: uppercase; color: #4D4D4D; font-size: 32px; line-height: 1.3; font-weight: 400; } .portfolio-item-desc { margin-bottom: 30px; } .portfolio-item-desc-inner-compacted { max-height: 150px; overflow: hidden; position: relative; } .portfolio-item-desc-inner-compacted:after { content: ''; position: absolute; left: 0; bottom: 0; display: block; width: 100%; height: 100px; background: -webkit-linear-gradient(top, rgba(245, 245, 245, 0) 0%, #f5f5f5 100%); background: linear-gradient(to bottom, rgba(245, 245, 245, 0) 0%, #f5f5f5 100%); } .kl-skin--dark .portfolio-item-desc-inner-compacted:after { background: -webkit-linear-gradient(top, transparent 0%, #1A1A1A 100%); background: linear-gradient(to bottom, transparent 0%, #1A1A1A 100%); } .portfolio-item-more-toggle { text-transform: uppercase; font-weight: 900; font-size: 11px; } .portfolio-item-more-toggle .glyphicon { font-size: 11px; margin-right: 4px; } .portfolio-item-more-toggle:after { content: attr(data-more-text); } /* when opened */ .portfolio-item-desc.is-opened .portfolio-item-desc-inner { max-height: none; overflow: hidden; } .portfolio-item-desc.is-opened .portfolio-item-desc-inner:after { display: none; } .portfolio-item-desc.is-opened .portfolio-item-more-toggle:after { content: attr(data-less-text); } .portfolio-item-desc.is-opened .portfolio-item-more-toggle .glyphicon:before { content: "\e260"; } /* no-toggle */ .portfolio-item-desc.no-toggle .portfolio-item-desc-inner { max-height: none; overflow: hidden; } .portfolio-item-desc.no-toggle .portfolio-item-more-toggle { display: none; } .portfolio-item-desc.no-toggle .portfolio-item-desc-inner:after { display: none; } /* when in affix */ .portfolio-item-content.affixcontent .portfolio-item-desc.is-opened:not(.no-toggle) .portfolio-item-desc-inner { max-height: 35vh; overflow: auto; } /* details */ .portfolio-item-details { margin: 0 0 40px; list-style: none; padding: 0; } .portfolio-item-details li { margin-bottom: 15px; } .portfolio-item-details-label { min-width: 100px; font-weight: 300; color: #ababab; float: left; } .portfolio-item-details-item { float: left; overflow: hidden; } /* Extra Images */ .portfolio-item-extraimages { margin-top: 20px; } .portfolio-item-extraimg { margin-top: 15px; margin-bottom: 15px; } /* Other details */ .portfolio-item-otherdetails { margin-bottom: 30px; } .portfolio-item-livelink { display: inline-block; margin-right: 10px; float: right; margin-top: 5px; } .portfolio-item-share { display: inline-block; } .portfolio-item-share:before { content: attr(data-share-title); font-size: 12px; font-weight: 600; display: block; line-height: 1; margin-bottom: 10px; color: #8A8A8A; } .portfolio-item-share-link { display: inline-block; width: 30px; height: 30px; margin-top: -5px; border-radius: 3px; color: rgba(0, 0, 0, 0.25); background-color: transparent; border-color: #E2E2E2; border-top: 0; border-bottom: 0; border-right: 0; border: 0; font-size: 16px; text-align: center; margin-right: 5px; line-height: 30px; } .portfolio-cat--dark .portfolio-item-share-link, .portfolio-item--dark .portfolio-item-share-link { color: rgba(255, 255, 255, 0.5); } .portfolio-item-share-link:hover { color: #fff; } .portfolio-item-share .portfolio-item-share-twitter { font-size: 13px; } .portfolio-item-share-twitter:hover { background: #55ACEE; } .portfolio-item-share-facebook:hover { background: #3B5998; } .portfolio-item-share-gplus:hover { background: #CC3732; } .portfolio-item-share-pinterest:hover { background: #CC2127; } .portfolio-item-share-mail:hover { background: #565656; } /* Right part */ .hg-portfolio-item .portfolio-item-right { margin-bottom: 20px; } .portfolio-item { margin-bottom: 50px; } /* Affixed Portfolio content */ .stickit { position: absolute; padding-right: 15px; } .portfolio-item-content.affixcontent { -webkit-transition: top .2s ease-out; transition: top .2s ease-out; -webkit-backface-visibility: hidden; backface-visibility: hidden; } /* Related Portfolio */ .zn_portfolio_related_title { font-size: 24px; line-height: 1.3; text-transform: uppercase; margin-bottom: 30px; } /* MQ's */ @media (min-width: 992px) and (max-width: 1199px) { .page-title.portfolio-item-title { font-size: 24px; line-height: 1.3; } } @media (max-width: 991px) { .page-title.portfolio-item-title { font-size: 24px; line-height: 1.3; } .portfolio-item-details-label { float: none; display: block; margin-bottom: 5px; } .portfolio-item-details-item { float: none; display: block; } .portfolio-item-livelink { float: none; margin-top: 20px; } .portfolio-item-details { margin: 0 0 20px; } } /* Portfolio Overlay */ .portfolio-item-overlay-imgintro { position: relative; z-index: 0; } .portfolio-item-overlay-imgintro > a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10; } .portfolio-item-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; visibility: hidden; background-color: rgba(31, 34, 37, 0.25); -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .portfolio-item-overlay-imgintro:hover .portfolio-item-overlay { opacity: 1; visibility: visible; box-shadow: inset 0 -8px 0 0 #cd2122; } .kl-ptfcarousel .portfolio-item-overlay-imgintro:hover .portfolio-item-overlay { box-shadow: none; } .portfolio-item-overlay-inner { position: relative; text-align: center; top: 50%; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: -webkit-transform .3s ease-in-out; transition: -webkit-transform .3s ease-in-out; transition: transform .3s ease-in-out; transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out; } .portfolio-item-overlay-icon { color: #fff; width: 60px; height: 60px; line-height: 58px; border: 2px solid #fff; display: inline-block; border-radius: 50%; -webkit-transform: scale(0.9); transform: scale(0.9); -webkit-transition: -webkit-transform .3s ease-in-out; transition: -webkit-transform .3s ease-in-out; transition: transform .3s ease-in-out; transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out; } .portfolio-item-overlay-imgintro:hover .portfolio-item-overlay-icon { -webkit-transform: scale(1); transform: scale(1); } /* PORTFOLIO CATEGORY */ .kl-ptf-catlist-title { text-transform: uppercase; font-size: 16px; line-height: 1.6; } .kl-ptf-catlist-desc { line-height: 1.8; } .kl-ptf-catlist-img { width: 100%; } /* PORTFOLIO CAROUSEL */ .kl-ptfcarousel-item:before, .kl-ptfcarousel-item:after { content: " "; display: table; } .kl-ptfcarousel-item:after { clear: both; } .kl-ptfcarousel-item { padding-bottom: 25px; margin-bottom: 25px; border-bottom: 1px solid #EBEBEB; } .portfolio-crsl--dark .kl-ptfcarousel-item { border-bottom-color: rgba(255, 255, 255, 0.1); } .kl-ptfcarousel-item:last-child { padding-bottom: 0; margin-bottom: 50px; border: 0; } .kl-ptfcarousel-item-desc { margin-bottom: 30px; } .kl-ptfcarousel-item-details { margin-bottom: 20px; } .kl-ptfcarousel-item-links { margin-bottom: 20px; } .kl-ptfcarousel-item-links .btn:first-child { margin-right: 10px; } .kl-ptfcarousel-item-links { margin-top: 20px; } .kl-ptfcarousel-img { width: 100%; } /* Portfolio carousels - Classic frame */ .kl-ptfcarousel-item-title { font-size: 32px; line-height: 1.4; margin-bottom: 20px; font-weight: 300; margin-bottom: 30px; } .kl-ptfcarousel-cols--2 .kl-ptfcarousel-item-title { font-size: 28px; font-weight: 400; margin-bottom: 20px; } .kl-ptfcarousel-cols--3 .kl-ptfcarousel-item-title { font-size: 24px; font-weight: 400; margin-bottom: 20px; } .kl-ptfcarousel-frame--classic { position: relative; border: 4px solid #fff; box-shadow: 0 0 0 2px #ddd, 0 0 6px rgba(0, 0, 0, 0.2); border-radius: 2px; } .kl-ptfcarousel-frame--classic:after { content: ''; position: absolute; left: -34px; top: 50%; margin-top: -15px; border: 15px solid transparent; border-right: 15px solid #ddd; z-index: 1; } .kl-ptfcarousel-frame--classic:before { content: ''; position: absolute; left: -30px; top: 50%; margin-top: -13px; border: 13px solid transparent; border-right: 13px solid #fff; z-index: 2; } .portfolio-crsl--dark .kl-ptfcarousel-frame--classic { border-color: #111; box-shadow: 0 0 0 2px #000, 0 0 6px #000; } .portfolio-crsl--dark .kl-ptfcarousel-frame--classic:after { border-right-color: #000; } .portfolio-crsl--dark .kl-ptfcarousel-frame--classic:before { border-right-color: #111; } /* Portfolio carousels - Modern frame */ .kl-ptfcarousel-frame--modern { position: relative; padding-top: 30px; padding-bottom: 0; border-radius: 4px 4px 2px 2px; background-color: #dcdee7; border: 1px solid rgba(255, 255, 255, 0.6); box-shadow: 0 16px 10px -11px rgba(0, 0, 0, 0.12); } .kl-ptfcarousel-frame--modern:before { content: ""; position: absolute; top: 12px; margin-top: 0; left: 25px; display: block; background: #ababab; border-radius: 30px; width: 7px; height: 7px; box-shadow: -12px 0 0 #ababab,12px 0 0 #ababab; } .portfolio-crsl--dark .kl-ptfcarousel-frame--modern { border-color: rgba(0, 0, 0, 0.8); } /* Portfolio carousels - Minimal frame */ .kl-ptfcarousel-frame--minimal { position: relative; } /* Portfolio carousels list */ .kl-ptfcarousel-carousel-list { margin: 0; padding: 0; list-style: none; overflow: hidden; } .kl-ptfcarousel-carousel-item { float: left; } .kl-ptfcarousel-carousel .znSlickNav-arr { position: absolute; left: 15px; top: 50%; z-index: 11; background: rgba(0, 0, 0, 0.2); margin: 0; margin-top: -25px; width: 50px; height: 50px; text-align: center; border-radius: 2px; opacity: 0; } .kl-ptfcarousel-carousel .znSlickNav-arr svg { display: block; margin: 0 auto; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); position: relative; } .kl-ptfcarousel-carousel .znSlickNav-arr polyline { stroke: #fff; } .kl-ptfcarousel-carousel .znSlickNav-arr.znSlickNav-next { left: auto; right: 15px; } .kl-ptfcarousel-carousel:hover .znSlickNav-arr { opacity: 1; } /* Portfolio Sortable */ .kl-ptfsortable-img { width: 100%; } /* Sort-by toolbar */ .kl-ptfsortable-sorting { float: right; margin: 0; font-size: 10px; text-transform: uppercase; padding: 8px 10px; color: #888; border-radius: 2px; margin-top: 10px; } .kl-ptfsortable-sorting-title { line-height: 1; } .kl-ptfsortable-sorting-lists { display: inline-block; margin: 0 25px 0 0; padding: 0; list-style: none; } .kl-ptfsortable-sorting-dir { margin-right: 0 !important; } .kl-ptfsortable-sorting-li { display: inline-block; margin-left: 10px; line-height: 1; margin-bottom: 0; } .kl-ptfsortable-sorting-link { color: #B7B7B7; line-height: 1; } .kl-ptfsortable-sorting-link.selected { color: #131313; } .portfolio-sort--dark .kl-ptfsortable-sorting { color: #ADADAD; } .portfolio-sort--dark .kl-ptfsortable-sorting-link { color: #969595; } .portfolio-sort--dark .kl-ptfsortable-sorting-link.selected { color: #FFFFFF; } .kl-ptfsortable-toolbar-right .kl-ptfsortable-sorting { float: left; } .kl-ptfsortable-toolbar-center .kl-ptfsortable-sorting { float: none; text-align: center; margin-bottom: 30px; } /* Sort Nav */ .kl-ptfsortable-nav { margin: 5px 0 40px; padding: 0; list-style: none; float: left; } .kl-ptfsortable-nav-item { float: left; margin-bottom: 10px; } .kl-ptfsortable-nav-link { background: #fff; color: #888; padding: 15px; line-height: 1; font-size: 10px; text-transform: uppercase; display: inline-block; margin-right: 0; -webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } .portfolio-sort--dark .kl-ptfsortable-nav-link { background: #000; color: #9E9E9E; } .kl-ptfsortable-nav-link:hover, .kl-ptfsortable-nav-item.current .kl-ptfsortable-nav-link { background: #cd2122; color: #fff; } .portfolio-sort--dark .kl-ptfsortable-nav-link:hover, .portfolio-sort--dark .kl-ptfsortable-nav-item.current .kl-ptfsortable-nav-link { color: #fff; } .kl-ptfsortable .portfolio-item-overlay-imgintro:hover .portfolio-item-overlay { box-shadow: none; } .kl-ptfsortable-toolbar-right .kl-ptfsortable-nav { float: right; } .kl-ptfsortable-toolbar-center .kl-ptfsortable-nav { float: none; margin-left: auto; margin-right: auto; display: table; } /* Item listing */ .kl-ptfsortable-items { padding: 0; list-style: none; overflow: hidden; margin-left: -10px; margin-right: -10px; } .kl-ptfsortable-item { width: 100%; float: left; padding: 0 10px; margin-bottom: 20px; } .kl-ptfsortable-items[data-columns="2"] .kl-ptfsortable-item { width: 50%; } .kl-ptfsortable-items[data-columns="3"] .kl-ptfsortable-item { width: 33.3333%; } .kl-ptfsortable-items[data-columns="4"] .kl-ptfsortable-item { width: 25%; } .kl-ptfsortable-items[data-columns="5"] .kl-ptfsortable-item { width: 20%; } .kl-ptfsortable-items[data-columns="6"] .kl-ptfsortable-item { width: 16.6666%; } @media (max-width: 992px) { .kl-ptfsortable-item { width: 33.333% !important; } } @media (max-width: 768px) { .kl-ptfsortable-item { width: 50% !important; } } @media (max-width: 480px) { .kl-ptfsortable-item { width: 100% !important; } } .kl-ptfsortable-item-inner { box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.15); background: #fff; -webkit-transition: all .3s ease; transition: all .3s ease; opacity: 0.9; } .kl-ptfsortable-item-inner:hover { box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.35); opacity: 1; } .kl-ptfsortable-item-title { display: block; line-height: 1.6; border-bottom: 1px dotted rgba(0, 0, 0, 0.17); font-size: 14px; text-transform: uppercase; margin: 0; padding: 15px; } .kl-ptfsortable-item-desc { font-size: 12px; color: #777; padding: 0 15px 15px; margin: 15px 0 0; display: block; } .kl-ptfsortable-item-desc p { margin-bottom: 10px; } .kl-ptfsortable-item.isotope-item { z-index: 2; } .kl-ptfsortable-item.isotope-hidden { z-index: 1; } .kl-ptfsortable-item-inner iframe { display: block; } .portfolio-sort--dark .kl-ptfsortable-item-inner { box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.85); background: #000; } .portfolio-sort--dark .kl-ptfsortable-item-inner:hover { box-shadow: 0 10px 10px -10px #000; } .portfolio-sort--dark .kl-ptfsortable-item-title { border-bottom: 1px dotted rgba(255, 255, 255, 0.17); } .portfolio-sort--dark .kl-ptfsortable-item-desc { color: #C3C3C3; } /* Load More Button */ .kl-ptfsortable-loadmore { display: block; max-width: 380px; text-align: center; margin: 30px auto; padding: 13px 0; text-transform: uppercase; font-weight: 600; -webkit-transition: opacity .15s ease-out; transition: opacity .15s ease-out; } .kl-ptfsortable-loadmore--loading { opacity: .5; pointer-events: none; } .kl-ptfsortable-loadmore.zn_loadmore_disabled.btn { opacity: .3; pointer-events: none; color: #777; border-color: #777; } /* ============================================================================= // OTHER PLUGINS (Built-in styles) ---- CF7 ---- POST-LOVE // =========================================================================== */ /* CF7 */ .wpcf7-form-group { margin-bottom: 20px; } .wpcf7-form-control:not(.wpcf7-checkbox):not(.wpcf7-radio) { font-size: 13px; padding: 14px; height: auto; outline: none; box-shadow: inset 1px 2px 0 rgba(0, 0, 0, 0.06); border: 1px solid #D9D9D9; width: 100%; } .wpcf7-form-label { text-transform: uppercase; font-size: 11px; color: #969696; font-weight: normal; } .wpcf7-submit { box-shadow: none; font-size: 13px; font-weight: 700; border-style: solid; border-radius: 3px; -webkit-transition: background-color .15s ease-out; transition: background-color .15s ease-out; } div.wpcf7-response-output { margin: 0 !important; padding: 10px 20px !important; } /* PostLove */ .plhg-love-action { display: block; } /*# sourceMappingURL=css-source-maps/template.css.map */