%PDF- %PDF-
Direktori : /var/www/projetos/fungraca.org.br/wp-content/plugins/qi-addons-for-elementor/assets/css/ |
Current File : /var/www/projetos/fungraca.org.br/wp-content/plugins/qi-addons-for-elementor/assets/css/main.css |
/* ========================================================================== Include variables and mixins ========================================================================== */ /* ========================================================================== */ /* ========================================================================== Blog styles ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Global mixins ========================================================================== */ .qodef-addons-blog-list { position: relative; display: inline-block; width: 100%; vertical-align: top; } .qodef-addons-blog-list .qodef-blog-item { position: relative; display: inline-block; width: 100%; vertical-align: top; } .qodef-addons-blog-list .qodef-blog-item .qodef-e-inner, .qodef-addons-blog-list .qodef-blog-item .qodef-e-media, .qodef-addons-blog-list .qodef-blog-item .qodef-e-content { position: relative; display: inline-block; width: 100%; vertical-align: top; } .qodef-addons-blog-list .qodef-blog-item .qodef-e-media-image { position: relative; display: inline-block; vertical-align: top; max-width: 100%; overflow: hidden; z-index: 1; } .qodef-addons-blog-list .qodef-blog-item .qodef-e-media { display: block; } .qodef-addons-blog-list .qodef-blog-item .qodef-e-media iframe { display: block; height: 100%; } .qodef-addons-blog-list .qodef-blog-item .qodef-e-title { margin: 0 0 0.5em; } .qodef-addons-blog-list .qodef-blog-item .qodef-e-excerpt { margin: 0; } .qodef-addons-blog-list .qodef-blog-item .qodef-e-info { position: relative; display: flex; flex-wrap: wrap; align-items: center; width: 100%; } .qodef-addons-blog-list .qodef-blog-item .qodef-e-info .qodef-e-info-item { position: relative; display: inline-flex; align-items: center; flex-wrap: wrap; margin-right: 24px; color: #111111; } .qodef-addons-blog-list .qodef-blog-item .qodef-e-info .qodef-e-info-item a { display: inline-flex; align-items: center; color: inherit; font-family: inherit; font-size: inherit; font-weight: inherit; font-style: inherit; line-height: inherit; letter-spacing: inherit; text-transform: inherit; } .qodef-addons-blog-list .qodef-blog-item .qodef-e-info .qodef-e-info-item a:hover { color: #3c3c3c; } .qodef-addons-blog-list .qodef-blog-item .qodef-e-info .qodef-e-info-item:last-child { margin-right: 0; } .qodef-addons-blog-list .qodef-blog-item .qodef-e-info .qodef-e-info-item-icon { margin-right: 8px; width: 14px; height: auto; fill: currentColor; flex-shrink: 0; } .qodef-addons-blog-list .qodef-blog-item .qodef-e-info.qodef-info--top { margin-bottom: 0.25em; } .qodef-addons-blog-list .qodef-blog-item .qodef-e-info.qodef-info--top .qodef-e-info-item { font-size: 0.9em; line-height: 1.13333em; } .qodef-addons-blog-list .qodef-blog-item .qodef-e-info.qodef-info--bottom { display: inline-flex; } .qodef-addons-blog-list .qodef-blog-item .qodef-e-post-link { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .qodef-addons-blog-list .qodef-blog-item.sticky .qodef-e-title a { position: relative; text-decoration: underline; } .qodef-addons-blog-list .qodef-blog-item.sticky .qodef-e-title a:after { content: '*'; position: absolute; top: 0; right: -0.5em; font-size: 1.5em; } .qodef-addons-blog-list.qodef-alignment--centered { text-align: center; } .qodef-addons-blog-list.qodef-alignment--centered .qodef-blog-item .qodef-e-info { justify-content: center; } .qodef-addons-blog-list.qodef-info-no-icons .qodef-e-info .qodef-e-info-item:not(:last-child):after { content: '/'; position: relative; left: 12px; } .qodef-addons-blog-list.qodef-title--hover-underline .qodef-e-title-link { width: 100%; background-repeat: no-repeat; background-image: linear-gradient(transparent calc(100% - 2px), currentColor 2px); transition: 0.9s cubic-bezier(0.32, 0.32, 0.15, 1.17); background-size: 0 100%; } .qodef-addons-blog-list.qodef-title--hover-underline .qodef-e-title-link:hover { background-size: 100% 100%; } .qodef-addons-blog-list .qodef-e-media-image a:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: transparent; transition: background-color .35s ease-out; } .qodef-addons-blog-list.qodef-image--hover-zoom .qodef-e-media-image a { display: block; width: 100%; transform: scale(1.005) translateZ(0); transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); will-change: transform; } .qodef-addons-blog-list.qodef-image--hover-zoom .qodef-e:hover .qodef-e-media-image a { transform: scale(1.03); } .qodef-addons-blog-list.qodef-image--hover-zoom-out .qodef-e-media-image a { display: block; width: 100%; transform: scale(1.03) translateZ(0); transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); will-change: transform; } .qodef-addons-blog-list.qodef-image--hover-zoom-out .qodef-e:hover .qodef-e-media-image a { transform: scale(1); } .qodef-addons-blog-list.qodef-image--hover-move .qodef-e-media-image a { display: block; width: 100%; transform: scale(1.2); transition: transform 0.5s cubic-bezier(0.33, 0.02, 0, 0.93); will-change: transform; } .qodef-addons-blog-list.qodef-image--hover-move .qodef-e:hover .qodef-e-media-image a { transform: scale(1.2) translateX(12px); } .qodef-addons-blog-list.qodef-image--hover-from-top a { transform-origin: top; } .qodef-addons-blog-list.qodef-image--hover-from-bottom a { transform-origin: bottom; } .qodef-addons-blog-list.qodef-image--hover-from-left a { transform-origin: left; } .qodef-addons-blog-list.qodef-image--hover-from-right a { transform-origin: right; } /* ========================================================================== Blog styles ========================================================================== */ @media only screen and (max-width: 1024px) { .qodef-addons-blog-list .qodef-blog-item.format-link .qodef-e-link { padding: 11% 15%; } .qodef-addons-blog-list .qodef-blog-item.format-quote .qodef-e-quote { padding: 10.7% 15% 11.3%; } } @media only screen and (max-width: 680px) { .qodef-addons-blog-list .qodef-blog-item .qodef-e-info.qodef-info--bottom { display: inline-block; } .qodef-addons-blog-list .qodef-blog-item.format-link .qodef-e-link { padding: 11% 10%; } .qodef-addons-blog-list .qodef-blog-item.format-link .qodef-e-link-icon { left: calc(50% - 75px); width: 150px; } .qodef-addons-blog-list .qodef-blog-item.format-quote .qodef-e-quote { padding: 11% 10%; } .qodef-addons-blog-list .qodef-blog-item.format-quote .qodef-e-quote-icon { left: calc(50% - 70px); width: 140px; } } /* ========================================================================== Blog styles ========================================================================== */ .qodef-addons-blog-list.qodef-item-layout--boxed .qodef-e-media-holder { position: relative; } .qodef-addons-blog-list.qodef-item-layout--boxed .qodef-e-info-date { position: absolute; top: 0; right: 0; padding: 12px 18px; color: #fff; background-color: #111; z-index: 5; } .qodef-addons-blog-list.qodef-item-layout--boxed .qodef-e-info-date a { color: inherit; } .qodef-addons-blog-list.qodef-item-layout--boxed .qodef-e-inner { box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.08); background-color: #fff; } .qodef-addons-blog-list.qodef-item-layout--boxed .qodef-e-text { margin-bottom: 1em; } .qodef-addons-blog-list.qodef-item-layout--boxed .qodef-e-content { padding: 45px 40px; } /* ========================================================================== Blog styles ========================================================================== */ .qodef-addons-blog-list.qodef-item-layout--date-boxed .qodef-e-media-holder { position: relative; } .qodef-addons-blog-list.qodef-item-layout--date-boxed .qodef-e-info-date { position: absolute; top: 0; right: 0; padding: 12px 18px; color: #fff; background-color: #111; z-index: 10; } .qodef-addons-blog-list.qodef-item-layout--date-boxed .qodef-e-info-date a { color: inherit; } .qodef-addons-blog-list.qodef-item-layout--date-boxed .qodef-e-media { margin-bottom: 1.5em; } .qodef-addons-blog-list.qodef-item-layout--date-boxed .qodef-e-text { margin-bottom: 1em; } /* ========================================================================== Blog styles ========================================================================== */ .qodef-addons-blog-list.qodef-item-layout--info-on-image .qodef-e-media-holder { position: relative; } .qodef-addons-blog-list.qodef-item-layout--info-on-image .qodef-e-info-date { position: absolute; top: 0; right: 0; padding: 12px 18px; background-color: #fff; z-index: 5; } .qodef-addons-blog-list.qodef-item-layout--info-on-image .qodef-e-info-date a { color: inherit; } .qodef-addons-blog-list.qodef-item-layout--info-on-image .qodef-e-content { position: absolute; bottom: 0; left: 0; padding: 40px; z-index: 5; } .qodef-addons-blog-list.qodef-item-layout--info-on-image .qodef-info--top .qodef-e-info-item { color: #fff; } .qodef-addons-blog-list.qodef-item-layout--info-on-image .qodef-info--top .qodef-e-info-item a:hover { color: inherit; } .qodef-addons-blog-list.qodef-item-layout--info-on-image .qodef-e-title { color: #fff; margin: 0; } .qodef-addons-blog-list.qodef-item-layout--info-on-image .qodef-e-title a { color: inherit; } /* ========================================================================== Blog styles ========================================================================== */ .qodef-addons-blog-list.qodef-item-layout--minimal { overflow: hidden; } .qodef-addons-blog-list.qodef-item-layout--minimal .qodef-grid-inner { margin-top: -2em !important; } .qodef-addons-blog-list.qodef-item-layout--minimal .qodef-e-inner { padding-top: 2em; border-top: 1px solid #ebebeb; } .qodef-addons-blog-list.qodef-item-layout--minimal .qodef-e-info.qodef-info--bottom { margin-top: 1em; } /* ========================================================================== Blog styles ========================================================================== */ .qodef-addons-blog-list.qodef-item-layout--side-image .qodef-e-inner { display: flex; align-items: center; } .qodef-reverse-columns.qodef-addons-blog-list.qodef-item-layout--side-image .qodef-e-inner { flex-direction: row-reverse; } @media only screen and (max-width: 768px) { .qodef-addons-blog-list.qodef-item-layout--side-image .qodef-e-inner { flex-direction: column; align-items: flex-start; } .qodef-reverse-columns.qodef-addons-blog-list.qodef-item-layout--side-image .qodef-e-inner { flex-direction: column; } } .qodef-addons-blog-list.qodef-item-layout--side-image .qodef-e-media { width: 50%; } @media only screen and (max-width: 768px) { .qodef-addons-blog-list.qodef-item-layout--side-image .qodef-e-media { width: 100%; } } .qodef-addons-blog-list.qodef-item-layout--side-image .qodef-e-content { flex: 1; padding: 20px 27px; } @media only screen and (max-width: 768px) { .qodef-addons-blog-list.qodef-item-layout--side-image .qodef-e-content { padding: 20px 0; } } .qodef-addons-blog-list.qodef-item-layout--side-image .qodef-e-excerpt { margin: 0 0 1em; } /* ========================================================================== Blog styles ========================================================================== */ .qodef-addons-blog-list.qodef-item-layout--standard .qodef-e-media { margin-bottom: 1.5em; } .qodef-addons-blog-list.qodef-item-layout--standard .qodef-e-text { margin-bottom: 1em; } .qodef-addons-blog-list.qodef-item-layout--standard .qodef-e-info.qodef-info--bottom { display: flex; align-items: center; justify-content: space-between; } .qodef-addons-blog-list.qodef-item-layout--standard .qodef-e-info-author img { border-radius: 50%; overflow: hidden; margin-right: 12px; } /* ========================================================================== Blog styles ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Global mixins ========================================================================== */ .qodef-addons-blog-slider { position: relative; display: inline-block; width: 100%; vertical-align: top; } .qodef-addons-blog-slider .qodef-blog-item { position: relative; display: inline-block; width: 100%; vertical-align: top; } .qodef-addons-blog-slider .qodef-blog-item .qodef-e-inner, .qodef-addons-blog-slider .qodef-blog-item .qodef-e-media, .qodef-addons-blog-slider .qodef-blog-item .qodef-e-content { position: relative; display: inline-block; width: 100%; vertical-align: top; } .qodef-addons-blog-slider .qodef-blog-item.has-post-thumbnail .qodef-e-content { padding-top: 27px; } .qodef-addons-blog-slider .qodef-blog-item .qodef-e-media-image { position: relative; display: inline-block; vertical-align: top; max-width: 100%; width: 100%; } .qodef-addons-blog-slider .qodef-blog-item .qodef-e-media-image a, .qodef-addons-blog-slider .qodef-blog-item .qodef-e-media-image img { display: block; width: 100%; } .qodef-addons-blog-slider .qodef-blog-item .qodef-e-media { display: block; } .qodef-addons-blog-slider .qodef-blog-item .qodef-e-title { margin: 0 0 0.5em; } .qodef-addons-blog-slider .qodef-blog-item .qodef-e-excerpt { margin: 0; } .qodef-addons-blog-slider .qodef-blog-item .qodef-e-read-more { margin-top: 14px; } .qodef-addons-blog-slider .qodef-blog-item .qodef-e-info { position: relative; display: flex; flex-wrap: wrap; align-items: center; width: 100%; } .qodef-addons-blog-slider .qodef-blog-item .qodef-e-info .qodef-e-info-item { position: relative; display: inline-flex; align-items: center; flex-wrap: wrap; margin-right: 24px; color: #111111; } .qodef-addons-blog-slider .qodef-blog-item .qodef-e-info .qodef-e-info-item a { display: inline-flex; align-items: center; color: inherit; font-family: inherit; font-size: inherit; font-weight: inherit; font-style: inherit; line-height: inherit; letter-spacing: inherit; text-transform: inherit; } .qodef-addons-blog-slider .qodef-blog-item .qodef-e-info .qodef-e-info-item a:hover { color: #3c3c3c; } .qodef-addons-blog-slider .qodef-blog-item .qodef-e-info .qodef-e-info-item:last-child { margin-right: 0; } .qodef-addons-blog-slider .qodef-blog-item .qodef-e-info .qodef-e-info-item-icon { margin-right: 8px; width: 14px; height: auto; fill: currentColor; flex-shrink: 0; } .qodef-addons-blog-slider .qodef-blog-item .qodef-e-info.qodef-info--top { margin-bottom: 0.25em; } .qodef-addons-blog-slider .qodef-blog-item .qodef-e-info.qodef-info--top .qodef-e-info-item { font-size: 0.9em; line-height: 1.13333em; } .qodef-addons-blog-slider .qodef-blog-item .qodef-e-info.qodef-info--bottom { display: inline-flex; } .qodef-addons-blog-slider .qodef-blog-item .qodef-e-post-link { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .qodef-addons-blog-slider .qodef-blog-item.sticky .qodef-e-title a { position: relative; text-decoration: underline; } .qodef-addons-blog-slider .qodef-blog-item.sticky .qodef-e-title a:after { content: '*'; position: absolute; top: 0; right: -0.5em; font-size: 1.5em; } .qodef-addons-blog-slider article .qodef-e-media-image { overflow: hidden; } .qodef-addons-blog-slider.qodef-content-has-background-color .qodef-e-content { padding-left: 28px; padding-right: 28px; } .qodef-addons-blog-slider.qodef-alignment--centered { text-align: center; } .qodef-addons-blog-slider.qodef-alignment--centered .qodef-blog-item .qodef-e-info { justify-content: center; } .qodef-addons-blog-slider.qodef-info-no-icons .qodef-e-info .qodef-e-info-item:not(:last-child):after { content: '/'; position: relative; left: 12px; } .qodef-addons-blog-slider.qodef-title--hover-underline .qodef-e-title-link { width: 100%; background-repeat: no-repeat; background-image: linear-gradient(transparent calc(100% - 2px), currentColor 2px); transition: 0.9s cubic-bezier(0.32, 0.32, 0.15, 1.17); background-size: 0 100%; } .qodef-addons-blog-slider.qodef-title--hover-underline .qodef-e-title-link:hover { background-size: 100% 100%; } .qodef-addons-blog-slider.qodef-title--hover-underline a.qodef-e-title-link { display: inline !important; } .qodef-addons-blog-slider .qodef-e-media-image a:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: transparent; transition: background-color .35s ease-out; } .qodef-addons-blog-slider.qodef-image--hover-zoom .qodef-e-media-image a { display: block; width: calc(100% + 2px); transform: scale(1.005) translateZ(0); transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); will-change: transform; } .qodef-addons-blog-slider.qodef-image--hover-zoom .qodef-e:hover .qodef-e-media-image a { transform: scale(1.03); } .qodef-addons-blog-slider.qodef-image--hover-zoom-out .qodef-e-media-image a { display: block; width: calc(100% + 2px); transform: scale(1.03) translateZ(0); transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); will-change: transform; } .qodef-addons-blog-slider.qodef-image--hover-zoom-out .qodef-e:hover .qodef-e-media-image a { transform: scale(1); } .qodef-addons-blog-slider.qodef-image--hover-move .qodef-e-media-image a { display: block; width: calc(100% + 2px); transform: scale(1.2); transition: transform 0.5s cubic-bezier(0.33, 0.02, 0, 0.93); will-change: transform; } .qodef-addons-blog-slider.qodef-image--hover-move .qodef-e:hover .qodef-e-media-image a { transform: scale(1.2) translateX(12px); } .qodef-addons-blog-slider.qodef-image--hover-from-top a { transform-origin: top; } .qodef-addons-blog-slider.qodef-image--hover-from-bottom a { transform-origin: bottom; } .qodef-addons-blog-slider.qodef-image--hover-from-left a { transform-origin: left; } .qodef-addons-blog-slider.qodef-image--hover-from-right a { transform-origin: right; } /* ========================================================================== Blog styles ========================================================================== */ .qodef-addons-blog-slider.qodef-item-layout--boxed .qodef-e-media-holder { position: relative; } .qodef-addons-blog-slider.qodef-item-layout--boxed .qodef-e-info-date { position: absolute; top: 0; right: 0; padding: 12px 18px; color: #fff; background-color: #111; } .qodef-addons-blog-slider.qodef-item-layout--boxed .qodef-e-info-date a { color: inherit; } .qodef-addons-blog-slider.qodef-item-layout--boxed .qodef-e-inner { box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.08); background-color: #fff; } .qodef-addons-blog-slider.qodef-item-layout--boxed .qodef-e-text { margin-bottom: 1em; } .qodef-addons-blog-slider.qodef-item-layout--boxed .qodef-e-content { padding: 45px 40px; } /* ========================================================================== Blog styles ========================================================================== */ .qodef-addons-blog-slider.qodef-item-layout--date-boxed .qodef-e-media-holder { position: relative; } .qodef-addons-blog-slider.qodef-item-layout--date-boxed .qodef-e-info-date { position: absolute; top: 0; right: 0; padding: 12px 18px; color: #fff; background-color: #111; } .qodef-addons-blog-slider.qodef-item-layout--date-boxed .qodef-e-info-date a { color: inherit; } .qodef-addons-blog-slider.qodef-item-layout--date-boxed .qodef-e-media { margin-bottom: 1.5em; } .qodef-addons-blog-slider.qodef-item-layout--date-boxed .qodef-e-text { margin-bottom: 1em; } /* ========================================================================== Blog styles ========================================================================== */ .qodef-addons-blog-slider.qodef-item-layout--info-on-image .qodef-e-media-holder { position: relative; } .qodef-addons-blog-slider.qodef-item-layout--info-on-image .qodef-e-content { position: absolute; bottom: 0; left: 0; padding: 40px; } .qodef-addons-blog-slider.qodef-item-layout--info-on-image .qodef-info--top .qodef-e-info-item { color: #fff; } .qodef-addons-blog-slider.qodef-item-layout--info-on-image .qodef-info--top .qodef-e-info-item a:hover { color: inherit; } .qodef-addons-blog-slider.qodef-item-layout--info-on-image .qodef-e-title { color: #fff; margin: 0; } .qodef-addons-blog-slider.qodef-item-layout--info-on-image .qodef-e-title a { color: inherit; } /* ========================================================================== Blog styles ========================================================================== */ .qodef-addons-blog-slider.qodef-item-layout--side-image .qodef-e-inner { display: flex; align-items: center; } @media only screen and (max-width: 480px) { .qodef-addons-blog-slider.qodef-item-layout--side-image .qodef-e-inner { flex-direction: column; align-items: flex-start; } } .qodef-addons-blog-slider.qodef-item-layout--side-image .qodef-e-media { width: 50%; } @media only screen and (max-width: 480px) { .qodef-addons-blog-slider.qodef-item-layout--side-image .qodef-e-media { width: 100%; } } .qodef-addons-blog-slider.qodef-item-layout--side-image .qodef-e-content { flex: 1; padding: 20px 27px; } @media only screen and (max-width: 480px) { .qodef-addons-blog-slider.qodef-item-layout--side-image .qodef-e-content { padding: 20px 0; } } /* ========================================================================== Blog styles ========================================================================== */ .qodef-addons-blog-slider.qodef-item-layout--standard .qodef-e-media { margin-bottom: 1.5em; } .qodef-addons-blog-slider.qodef-item-layout--standard .qodef-e-text { margin-bottom: 1em; } .qodef-addons-blog-slider.qodef-item-layout--standard .qodef-e-info.qodef-info--bottom { display: flex; align-items: center; justify-content: space-between; } .qodef-addons-blog-slider.qodef-item-layout--standard .qodef-e-info-author img { width: 48px; border-radius: 50%; overflow: hidden; margin-right: 12px; } /* ========================================================================== Pagination global styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ .qodef-shortcode .qodef-addons-m-pagination { position: relative; display: inline-block; width: 100%; vertical-align: top; margin: 0; } .qodef-shortcode .qodef-addons-m-pagination.qodef--standard .nav-links { display: flex; align-items: center; justify-content: center; } .qodef-shortcode .qodef-addons-m-pagination.qodef--standard .page-numbers { display: inline-flex; align-items: center; justify-content: center; margin: 0 5px; transition: all 0.2s ease-out; } .qodef-shortcode .qodef-addons-m-pagination.qodef--standard .page-numbers.next svg, .qodef-shortcode .qodef-addons-m-pagination.qodef--standard .page-numbers.prev svg { width: 1em; fill: currentColor; stroke: currentColor; max-height: 100%; } /* ========================================================================== Contact Form 7 shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ .qodef-qi-contact-form-7 { /* reset The Q input styles - start */ /* reset The Q input styles - end */ } .qodef-qi-contact-form-7 form div { position: relative; margin: 0; } .qodef-qi-contact-form-7.qodef-button--full-width input[type=submit] { width: 100%; } .qodef-qi-contact-form-7 .wpcf7-form-control-wrap { width: 100%; display: block; } .qodef-qi-contact-form-7 textarea { resize: none; } .qodef-qi-contact-form-7 .wpcf7-list-item.first { margin-left: 0; } .qodef-qi-contact-form-7 .qodef-cf7-flex { display: flex; } @media only screen and (max-width: 1024px) { .qodef-qi-contact-form-7 .qodef-cf7-flex.qodef-cf7-wrap--1024 { flex-wrap: wrap; } } @media only screen and (max-width: 768px) { .qodef-qi-contact-form-7 .qodef-cf7-flex.qodef-cf7-wrap--768 { flex-wrap: wrap; } } @media only screen and (max-width: 680px) { .qodef-qi-contact-form-7 .qodef-cf7-flex.qodef-cf7-wrap--680 { flex-wrap: wrap; } } .qodef-qi-contact-form-7 .qodef-grid-inner { row-gap: 0 !important; } .qodef-qi-contact-form-7 .qodef-grid-item { margin: 0 !important; } .qodef-qi-contact-form-7 .wpcf7-radio, .qodef-qi-contact-form-7 .wpcf7-checkbox { line-height: 1; display: block; } .qodef-qi-contact-form-7 .wpcf7-radio label, .qodef-qi-contact-form-7 .wpcf7-checkbox label { display: flex; align-items: center; justify-content: center; } .qodef-qi-contact-form-7 .wpcf7-spinner { position: absolute; right: 0; margin: 10px 0 0; } .qodef-qi-contact-form-7 label { margin-bottom: 0; } .qodef-qi-contact-form-7 input[type=date], .qodef-qi-contact-form-7 input[type=email], .qodef-qi-contact-form-7 input[type=number], .qodef-qi-contact-form-7 input[type=password], .qodef-qi-contact-form-7 input[type=search], .qodef-qi-contact-form-7 input[type=tel], .qodef-qi-contact-form-7 input[type=text], .qodef-qi-contact-form-7 input[type=url], .qodef-qi-contact-form-7 textarea, .qodef-qi-contact-form-7 select { margin: 0; } .qodef-qi-contact-form-7 input[type=checkbox], .qodef-qi-contact-form-7 input[type=radio] { margin: 0; width: 1em; height: 1em; vertical-align: middle; } .qodef-qi-contact-form-7 button[type=submit]:focus, .qodef-qi-contact-form-7 button[type=submit]:hover, .qodef-qi-contact-form-7 input[type=submit]:focus, .qodef-qi-contact-form-7 input[type=submit]:hover { color: unset; background-color: unset; } .qodef-qi-contact-form-7 input[type=submit] { transition: all .3s ease-out; } .qodef-qi-contact-form-7 textarea { vertical-align: middle; } .qodef-qi-contact-form-7 .qodef-qi-multiform-newsletter .wpcf7-form-control-wrap { z-index: 5; } .qodef-qi-contact-form-7 .qodef-qi-multiform-newsletter .qodef-qi-multiform-next > .wpcf7-submit { z-index: 10; } /* ========================================================================== WooCommerce global styles ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ .qodef-addons-woo-shortcode .qodef-e-product-mark { position: absolute; top: 0; left: 0; min-width: 68px; color: #111111; background-color: #fff; padding: 1.8em 1.2em; z-index: 5; } .qodef-addons-woo-shortcode .qodef-e-product-title { margin: 0; z-index: 2; position: relative; } .qodef-addons-woo-shortcode .qodef-e-ratings { position: relative; display: inline-block; width: 100%; vertical-align: top; line-height: 1; } .qodef-addons-woo-shortcode .qodef-e-ratings .qodef-m-inner { position: relative; display: inline-block; vertical-align: top; } .qodef-addons-woo-shortcode .qodef-e-ratings .qodef-m-star { color: #111111; } .qodef-addons-woo-shortcode .qodef-e-ratings .qodef-m-star svg { display: inline-block; margin-right: 4px; width: 16px; height: auto; fill: none; stroke: currentColor; } .qodef-addons-woo-shortcode .qodef-e-ratings .qodef-m-star svg:last-child { margin-right: 0; } .qodef-addons-woo-shortcode .qodef-e-ratings .qodef-m-star.qodef--active { position: absolute; top: 0; left: 0; overflow: hidden; white-space: nowrap; } .qodef-addons-woo-shortcode .qodef-e-ratings .qodef-m-star.qodef--active svg { fill: currentColor; stroke: none; } .qodef-addons-woo-shortcode .qodef-e-ratings .qodef-m-star svg { width: 1em; margin-right: 8px; } .qodef-addons-woo-shortcode .price { position: relative; display: flex; align-items: center; margin: 0; } .qodef-addons-woo-shortcode .price del { margin-right: 0.8em; } .qodef-addons-woo-shortcode .price ins { text-decoration: none; } .qodef-addons-woo-shortcode .button, .qodef-addons-woo-shortcode .added_to_cart { color: #111111; z-index: 3; } .qodef-addons-woo-shortcode .button.added, .qodef-addons-woo-shortcode .added_to_cart.added { display: none !important; } .qodef-addons-woo-shortcode .button.qodef-qi-button.qodef-layout--textual, .qodef-addons-woo-shortcode .added_to_cart.qodef-qi-button.qodef-layout--textual { background: transparent; } .qodef-addons-woo-shortcode .qodef-qi-woo-product-mark { position: absolute; top: 0; right: 0; color: #fff; background-color: #111111; padding: 10px 15px; z-index: 5; } .qodef-addons-woo-shortcode .qodef-qi-woo-product-mark.qodef-woo-onsale { color: #111111; background-color: #ebebeb; } /* ========================================================================== WooCommerce Add to Cart shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ .qodef-qi-woo-shortcode-add-to-cart { position: relative; display: inline-block; width: 100%; vertical-align: top; } .qodef-qi-woo-shortcode-add-to-cart .button.added { display: none; } /* ========================================================================== Product Category List Info on Image styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ /* ========================================================================== Global mixins ========================================================================== */ .qodef-qi-woo-product-category-list .woocommerce-loop-category__title { margin: 0; } .qodef-qi-woo-product-category-list .count { display: none; } .qodef-qi-woo-product-category-list .qodef-e-img-holder { overflow: hidden; } .qodef-qi-woo-product-category-list .qodef-e-img-holder:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: transparent; transition: background-color .35s ease-out; } .qodef-qi-woo-product-category-list.qodef-image--hover-zoom img { transform: scale(1.005) translateZ(0); transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); will-change: transform; } .qodef-qi-woo-product-category-list.qodef-image--hover-zoom .qodef-e:hover img { transform: scale(1.03); } .qodef-qi-woo-product-category-list.qodef-image--hover-zoom-out img { transform: scale(1.03) translateZ(0); transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); will-change: transform; } .qodef-qi-woo-product-category-list.qodef-image--hover-zoom-out .qodef-e:hover img { transform: scale(1); } .qodef-qi-woo-product-category-list.qodef-image--hover-move img { transform: scale(1.2); transition: transform 0.5s cubic-bezier(0.33, 0.02, 0, 0.93); will-change: transform; } .qodef-qi-woo-product-category-list.qodef-image--hover-move .qodef-e:hover img { transform: scale(1.2) translateX(12px); } .qodef-qi-woo-product-category-list.qodef-image--hover-from-top img { transform-origin: top; } .qodef-qi-woo-product-category-list.qodef-image--hover-from-bottom img { transform-origin: bottom; } .qodef-qi-woo-product-category-list.qodef-image--hover-from-left img { transform-origin: left; } .qodef-qi-woo-product-category-list.qodef-image--hover-from-right img { transform-origin: right; } /* ========================================================================== Product Category List Info on Image styles ========================================================================== */ .qodef-qi-woo-product-category-list.qodef-item-layout--info-on-image .product-category a { position: relative; display: inline-block; width: 100%; vertical-align: top; } .qodef-qi-woo-product-category-list.qodef-item-layout--info-on-image .product-category .woocommerce-loop-category__title { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: auto; color: #fff; text-align: center; } .qodef-position--bottom-left .qodef-qi-woo-product-category-list.qodef-item-layout--info-on-image .product-category .woocommerce-loop-category__title { top: auto; bottom: 0; left: 0; transform: none; text-align: left; } /* ========================================================================== Product Category List Info on Image styles ========================================================================== */ .qodef-qi-woo-product-category-list.qodef-item-layout--info-on-image-boxed .product-category a { position: relative; display: inline-block; width: 100%; vertical-align: top; } .qodef-qi-woo-product-category-list.qodef-item-layout--info-on-image-boxed .product-category .woocommerce-loop-category__title { position: absolute; bottom: 40px; left: 50%; background-color: #ffffff; width: auto; text-align: center; padding: 10px 40px; transform: translateX(-50%); } /* ========================================================================== Product Category List Info on Image styles ========================================================================== */ .qodef-qi-woo-product-category-list.qodef-item-layout--info-side .qodef-e-holder-inner { position: relative; display: flex; align-items: center; justify-content: flex-end; background-color: #f6f6f6; } .qodef-qi-woo-product-category-list.qodef-item-layout--info-side .qodef-e-content { position: absolute; max-height: 100%; width: 100%; left: 0; flex: 1; overflow: hidden; } .qodef-qi-woo-product-category-list.qodef-item-layout--info-side .qodef-e-image { width: 60%; } /* ========================================================================== WooCommerce product list shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ /* ========================================================================== Global mixins ========================================================================== */ .qodef-qi-woo-shortcode-product-list { position: relative; display: inline-block; width: 100%; vertical-align: top; } .qodef-qi-woo-shortcode-product-list .qodef-e-product-inner { position: relative; display: inline-block; vertical-align: top; width: 100%; } .qodef-qi--touch .qodef-qi-woo-shortcode-product-list .qodef-e-product-inner { cursor: pointer; } .qodef-qi-woo-shortcode-product-list .qodef-e-product-inner:hover .qodef-e-product-image-inner { opacity: 1; } .qodef-qi-woo-shortcode-product-list .qodef-e-product-inner:hover .qodef-e-product-title { color: #3c3c3c; } .qodef-qi-woo-shortcode-product-list .qodef-e-product-image { position: relative; display: inline-block; vertical-align: top; z-index: 1; } .qodef-qi-woo-shortcode-product-list .qodef-e-product-image .qodef-e-product-image-holder { overflow: hidden; } .qodef-qi-woo-shortcode-product-list .qodef-e-product-image img { display: block; width: 100%; } .qodef-qi-woo-shortcode-product-list .qodef-e-product-image-inner { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 10px; text-align: center; opacity: 0; transition: opacity .35s ease-out; } .qodef-qi-woo-shortcode-product-list .qodef-e-product-content { position: relative; display: inline-block; width: 100%; vertical-align: top; } .qodef-qi-woo-shortcode-product-list .qodef-e-product-heading { position: relative; display: flex; justify-content: space-between; align-items: baseline; } .qodef-qi-woo-shortcode-product-list .woocommerce-Price-currencySymbol { position: relative; top: -0.3em; font-size: .6em; } .qodef-qi-woo-shortcode-product-list .price { flex-shrink: 0; } .qodef-qi-woo-shortcode-product-list .qodef-e-product-title { transition: color 0.2s ease-out; } .qodef-qi-woo-shortcode-product-list .qodef-e-product-categories a { position: relative; display: inline-block !important; vertical-align: top; color: inherit; font-family: inherit; font-size: inherit; font-weight: inherit; font-style: inherit; line-height: inherit; letter-spacing: inherit; text-transform: inherit; z-index: 3; } .qodef-qi-woo-shortcode-product-list .qodef-e-product-categories a:focus, .qodef-qi-woo-shortcode-product-list .qodef-e-product-categories a:hover { color: #3c3c3c; } .qodef-qi-woo-shortcode-product-list .woocommerce-LoopProduct-link { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .qodef-qi-woo-shortcode-product-list .qodef-e-product-image-holder:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: transparent; transition: background-color .35s ease-out; } .qodef-qi-woo-shortcode-product-list .qodef-e-product-image { overflow: hidden; width: 100%; } .qodef-qi-woo-shortcode-product-list.qodef-image--hover-zoom img { transform: scale(1.005) translateZ(0); transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); will-change: transform; } .qodef-qi-woo-shortcode-product-list.qodef-image--hover-zoom .qodef-e:hover img { transform: scale(1.03); } .qodef-qi-woo-shortcode-product-list.qodef-image--hover-zoom-out img { transform: scale(1.03) translateZ(0); transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); will-change: transform; } .qodef-qi-woo-shortcode-product-list.qodef-image--hover-zoom-out .qodef-e:hover img { transform: scale(1); } .qodef-qi-woo-shortcode-product-list.qodef-image--hover-move img { transform: scale(1.2); transition: transform 0.5s cubic-bezier(0.33, 0.02, 0, 0.93); will-change: transform; } .qodef-qi-woo-shortcode-product-list.qodef-image--hover-move .qodef-e:hover img { transform: scale(1.2) translateX(12px); } .qodef-qi-woo-shortcode-product-list.qodef-image--hover-from-top img { transform-origin: top; } .qodef-qi-woo-shortcode-product-list.qodef-image--hover-from-bottom img { transform-origin: bottom; } .qodef-qi-woo-shortcode-product-list.qodef-image--hover-from-left img { transform-origin: left; } .qodef-qi-woo-shortcode-product-list.qodef-image--hover-from-right img { transform-origin: right; } /* ========================================================================== Product List Info on Image styles ========================================================================== */ .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below .qodef-e-product-content { text-align: center; padding: 22px 0 25px; } .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below .price { justify-content: center; } /* ========================================================================== Product List Info on Image styles ========================================================================== */ .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below-hover-inset .qodef-e-product-image-inner { background-color: #fff; position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: opacity 0.25s ease-out, all 0.3s cubic-bezier(0.46, 0.03, 0.52, 0.96); -webkit-clip-path: inset(0px 0px 0px 0px); clip-path: inset(0px 0px 0px 0px); pointer-events: none; } .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below-hover-inset .qodef-e-product-image-inner a { pointer-events: all; } .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below-hover-inset .qodef-e-product-inner:hover .qodef-e-product-image-inner { opacity: 1; -webkit-clip-path: inset(13px 13px 13px 13px); clip-path: inset(13px 13px 13px 13px); transition-delay: 0s, .15s; } .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below-hover-inset .qodef-e-product-content { padding: 22px 0 25px; } /* ========================================================================== Product List Info on Image styles ========================================================================== */ .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below-swap .qodef-e-product-content { text-align: center; padding: 22px 0 25px; } .qodef-info-below-alignment--left .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below-swap .qodef-e-product-content { text-align: left; } .qodef-info-below-alignment--right .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below-swap .qodef-e-product-content { text-align: right; } .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below-swap .qodef-e-product-image-holder a { position: relative; display: block; z-index: 2; } .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below-swap .price { justify-content: center; } .qodef-info-below-alignment--left .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below-swap .price { justify-content: flex-start; } .qodef-info-below-alignment--right .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below-swap .price { justify-content: flex-end; } .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below-swap .qodef-e-swap-holder { position: relative; display: flex; justify-content: center; align-items: center; overflow: hidden; z-index: 3; margin: 0 auto; opacity: 0; transition: .15s ease-out; width: var(--qodef-max-width); height: var(--qodef-max-height); } .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below-swap .qodef-e-swap-holder.qodef--initialized { opacity: 1; } .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below-swap .qodef-e-swap-holder .qodef-woo-product-price { transform: translateX(0); transition: transform .4s .1s ease; width: var(--qodef-max-width); position: absolute; } .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below-swap .qodef-e-swap-holder .qodef-e-to-swap { position: absolute; width: 100%; transform: translateX(100%); transition: transform .5s 0s ease; overflow: hidden; } .qodef-info-below-alignment--left .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below-swap .qodef-e-swap-holder { margin: 0; } .qodef-info-below-alignment--right .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below-swap .qodef-e-swap-holder { margin: 0 0 0 auto; } .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below-swap .qodef-e-product-inner:hover .qodef-woo-product-price { transform: translateX(-100%); transition-delay: 0s; } .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below-swap .qodef-e-product-inner:hover .qodef-e-swap-holder .qodef-e-to-swap { transform: translateX(0%); transition-delay: .1s; } /* ========================================================================== Product List Info on Image styles ========================================================================== */ .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below-with-hover .qodef-e-product-content { padding: 22px 0 25px; } .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below-with-hover .qodef-e-product-image-inner { opacity: 0; transform: translateY(10px); transition: opacity 0.25s, transform 0.4s cubic-bezier(0.26, -0.14, 0, 1.01); } .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-below-with-hover .qodef-e-product-inner:hover .qodef-e-product-image-inner { opacity: 1; transform: translateY(0); } /* ========================================================================== Product List Info on Image styles ========================================================================== */ .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-on-image .qodef-e-product-image-inner { flex-direction: column; justify-content: center; align-items: center; text-align: center; padding: 25px 35px; background-color: #f6f6f6; } .qodef-position--bottom-left .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-on-image .qodef-e-product-image-inner { align-items: flex-start; justify-content: flex-end; text-align: left; } .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-on-image .qodef-e-ratings { text-align: center; } .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-on-image .qodef-e-product-inner .qodef-e-product-mark { left: auto; right: 0; } .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-on-image .qodef-woo-product-price > span { width: 100%; } .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-on-image .qodef-image-content-inner { opacity: 0; transform: translateY(20px); transition: opacity 0.25s, transform 0.4s cubic-bezier(0.26, -0.14, 0, 1.01); } .qodef-qi-woo-shortcode-product-list.qodef-item-layout--info-on-image .qodef-e-product-inner:hover .qodef-image-content-inner { opacity: 1; transform: translateY(0); } /* ========================================================================== WooCommerce product slider shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ /* ========================================================================== Global mixins ========================================================================== */ .qodef-qi-woo-shortcode-product-slider { position: relative; display: inline-block; width: 100%; vertical-align: top; } .qodef-qi-woo-shortcode-product-slider .qodef-e-product-inner { position: relative; display: inline-block; vertical-align: top; width: 100%; } .qodef-qi--touch .qodef-qi-woo-shortcode-product-slider .qodef-e-product-inner { cursor: pointer; } .qodef-qi-woo-shortcode-product-slider .qodef-e-product-inner:hover .qodef-e-product-image-inner { opacity: 1; } .qodef-qi-woo-shortcode-product-slider .qodef-e-product-inner:hover .qodef-e-product-title { color: #3c3c3c; } .qodef-qi-woo-shortcode-product-slider .qodef-e-product-image { position: relative; display: inline-block; vertical-align: top; z-index: 1; } .qodef-qi-woo-shortcode-product-slider .qodef-e-product-image .qodef-e-product-image-holder { overflow: hidden; } .qodef-qi-woo-shortcode-product-slider .qodef-e-product-image img { display: block; width: 100%; } .qodef-image-full-height.qodef-qi-woo-shortcode-product-slider .qodef-e-product-image img { height: 100vh; object-fit: cover; } .qodef-qi-woo-shortcode-product-slider .qodef-e-product-image-inner { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 10px; text-align: center; opacity: 0; transition: opacity .35s ease-out; } .qodef-qi-woo-shortcode-product-slider .qodef-e-product-content { position: relative; display: inline-block; width: 100%; vertical-align: top; } .qodef-qi-woo-shortcode-product-slider .qodef-e-product-heading { position: relative; display: flex; justify-content: space-between; align-items: baseline; } .qodef-qi-woo-shortcode-product-slider .woocommerce-Price-currencySymbol { position: relative; top: -0.3em; font-size: .6em; } .qodef-qi-woo-shortcode-product-slider .price { flex-shrink: 0; } .qodef-qi-woo-shortcode-product-slider .qodef-e-product-title { transition: color 0.2s ease-out; } .qodef-qi-woo-shortcode-product-slider .qodef-e-product-categories a { position: relative; display: inline-block !important; vertical-align: top; color: inherit; font-family: inherit; font-size: inherit; font-weight: inherit; font-style: inherit; line-height: inherit; letter-spacing: inherit; text-transform: inherit; z-index: 3; } .qodef-qi-woo-shortcode-product-slider .qodef-e-product-categories a:focus, .qodef-qi-woo-shortcode-product-slider .qodef-e-product-categories a:hover { color: #3c3c3c; } .qodef-qi-woo-shortcode-product-slider .woocommerce-LoopProduct-link { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .qodef-qi-woo-shortcode-product-slider .qodef-e-product-image-holder:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: transparent; transition: background-color .35s ease-out; } .qodef-qi-woo-shortcode-product-slider .qodef-e-product-image { overflow: hidden; width: 100%; } .qodef-qi-woo-shortcode-product-slider.qodef-image--hover-zoom img { transform: scale(1.005) translateZ(0); transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); will-change: transform; } .qodef-qi-woo-shortcode-product-slider.qodef-image--hover-zoom .qodef-e:hover img { transform: scale(1.03); } .qodef-qi-woo-shortcode-product-slider.qodef-image--hover-zoom-out img { transform: scale(1.03) translateZ(0); transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); will-change: transform; } .qodef-qi-woo-shortcode-product-slider.qodef-image--hover-zoom-out .qodef-e:hover img { transform: scale(1); } .qodef-qi-woo-shortcode-product-slider.qodef-image--hover-move img { transform: scale(1.2); transition: transform 0.5s cubic-bezier(0.33, 0.02, 0, 0.93); will-change: transform; } .qodef-qi-woo-shortcode-product-slider.qodef-image--hover-move .qodef-e:hover img { transform: scale(1.2) translateX(12px); } .qodef-qi-woo-shortcode-product-slider.qodef-image--hover-from-top img { transform-origin: top; } .qodef-qi-woo-shortcode-product-slider.qodef-image--hover-from-bottom img { transform-origin: bottom; } .qodef-qi-woo-shortcode-product-slider.qodef-image--hover-from-left img { transform-origin: left; } .qodef-qi-woo-shortcode-product-slider.qodef-image--hover-from-right img { transform-origin: right; } .qodef-qi-woo-shortcode-product-slider.qodef-zoom-centered-item { padding: 50px 0; } .qodef-qi-woo-shortcode-product-slider.qodef-zoom-centered-item .qodef-e-product-image { transform: scale(1); transition: transform .35s ease-out; } .qodef-qi-woo-shortcode-product-slider.qodef-zoom-centered-item .swiper-slide-active .qodef-e-product-image { transform: scale(1.5); } .qodef-qi-woo-shortcode-product-slider.qodef-zoom-centered-item.qodef-item-layout--info-below-swap .qodef-e-product-content { opacity: 0; transition: opacity .35s ease-out; } .qodef-qi-woo-shortcode-product-slider.qodef-zoom-centered-item.qodef-item-layout--info-below-swap .swiper-slide-active .qodef-e-product-content { opacity: 1; } /* ========================================================================== Product List Info on Image styles ========================================================================== */ .qodef-qi-woo-shortcode-product-slider.qodef-item-layout--info-below-swap .qodef-e-product-inner { text-align: center; padding: 25px 15px; background-color: #f6f6f6; transition: background-color .35s ease-out; } .qodef-qi-woo-shortcode-product-slider.qodef-item-layout--info-below-swap .price { justify-content: center; } .qodef-qi-woo-shortcode-product-slider.qodef-item-layout--info-below-swap .qodef-e-swap-holder { position: relative; display: flex; justify-content: center; align-items: center; overflow: hidden; z-index: 3; margin: 0 auto; opacity: 0; transition: .15s ease-out; width: var(--qodef-max-width); height: var(--qodef-max-height); } .qodef-qi-woo-shortcode-product-slider.qodef-item-layout--info-below-swap .qodef-e-swap-holder.qodef--initialized { opacity: 1; } .qodef-qi-woo-shortcode-product-slider.qodef-item-layout--info-below-swap .qodef-e-swap-holder .qodef-woo-product-price { transform: translateX(0); transition: transform .4s .1s ease; width: var(--qodef-max-width); position: absolute; } .qodef-qi-woo-shortcode-product-slider.qodef-item-layout--info-below-swap .qodef-e-swap-holder .qodef-e-to-swap { position: absolute; width: 100%; transform: translateX(100%); transition: transform .5s 0s ease; overflow: hidden; } .qodef-qi-woo-shortcode-product-slider.qodef-item-layout--info-below-swap .qodef-e-product-inner:hover .qodef-woo-product-price { transform: translateX(-100%); transition-delay: 0s; } .qodef-qi-woo-shortcode-product-slider.qodef-item-layout--info-below-swap .qodef-e-product-inner:hover .qodef-e-swap-holder .qodef-e-to-swap { transform: translateX(0%); transition-delay: .1s; } /* ========================================================================== Product List Info on Image styles ========================================================================== */ .qodef-qi-woo-shortcode-product-slider.qodef-item-layout--info-below-with-hover .qodef-e-product-content { padding: 22px 0 25px; } .qodef-qi-woo-shortcode-product-slider.qodef-item-layout--info-below-with-hover .qodef-e-product-image-inner { opacity: 0; transform: translateY(10px); transition: opacity 0.25s, transform 0.4s cubic-bezier(0.26, -0.14, 0, 1.01); } .qodef-qi-woo-shortcode-product-slider.qodef-item-layout--info-below-with-hover .qodef-e-product-inner:hover .qodef-e-product-image-inner { opacity: 1; transform: translateY(0); } /* ========================================================================== Product List Info on Image styles ========================================================================== */ .qodef-qi-woo-shortcode-product-slider.qodef-item-layout--info-on-image .qodef-e-product-image-inner { flex-direction: column; justify-content: space-between; align-items: flex-start; padding: 15px; transition: opacity .25s ease-out; } .qodef-qi-woo-shortcode-product-slider.qodef-item-layout--info-on-image .qodef-e-product-top { text-align: left; width: 100%; transform: translateY(10px); transition: transform .25s ease-out; } .qodef-qi-woo-shortcode-product-slider.qodef-item-layout--info-on-image .qodef-e-product-bottom { width: 100%; } .qodef-qi-woo-shortcode-product-slider.qodef-item-layout--info-on-image .qodef-e-product-inner .qodef-e-product-mark { left: auto; right: 0; } .qodef-qi-woo-shortcode-product-slider.qodef-item-layout--info-on-image .qodef-e-product-inner:hover .qodef-e-product-top, .qodef-qi-woo-shortcode-product-slider.qodef-item-layout--info-on-image .qodef-e-product-inner:hover .qodef-e-product-bottom { transform: translateY(0px); } /* ========================================================================== Product List Info on Image styles ========================================================================== */ .qodef-qi-woo-shortcode-product-slider.qodef-item-layout--info-on-image-centered .qodef-e-product-image-inner { flex-direction: column; justify-content: center; align-items: center; text-align: center; padding: 25px 35px; background-color: #f6f6f6; } .qodef-qi-woo-shortcode-product-slider.qodef-item-layout--info-on-image-centered .qodef-e-ratings { text-align: center; } .qodef-qi-woo-shortcode-product-slider.qodef-item-layout--info-on-image-centered .qodef-woo-product-price > span { width: 100%; } .qodef-qi-woo-shortcode-product-slider.qodef-item-layout--info-on-image-centered .qodef-e-product-inner .qodef-e-product-mark { left: auto; right: 0; } .qodef-qi-woo-shortcode-product-slider.qodef-item-layout--info-on-image-centered .qodef-image-content-inner { opacity: 0; transform: translateY(20px); transition: opacity 0.25s, transform 0.4s cubic-bezier(0.26, -0.14, 0, 1.01); } .qodef-qi-woo-shortcode-product-slider.qodef-item-layout--info-on-image-centered .qodef-e-product-inner:hover .qodef-image-content-inner { opacity: 1; transform: translateY(0); } /* ========================================================================== WPForms shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ .qodef-qi-wp-forms { /* reset The Q input styles - start */ /* reset The Q input styles - end */ } .qodef-qi-wp-forms textarea { resize: none; } .qodef-qi-wp-forms input, .qodef-qi-wp-forms select { height: auto !important; } .qodef-qi-wp-forms.qodef-button--full-width button[type=submit] { width: 100%; } .qodef-qi-wp-forms.qodef-wpf-flex form { display: flex; align-items: center; } .qodef-qi-wp-forms.qodef-wpf-flex form > .wpforms-field-container { flex-grow: 1; flex-basis: 100%; } .qodef-qi-wp-forms.qodef-wpf-flex form > .wpforms-submit-container { flex-grow: 0; } .qodef-qi-wp-forms.qodef-wpf-flex.qodef-wpf-absolute-btn form > .wpforms-submit-container { position: absolute; right: 0; } @media only screen and (max-width: 1024px) { .qodef-qi-wp-forms.qodef-wpf-flex.qodef-wpf-wrap--1024 form { flex-wrap: wrap; } } @media only screen and (max-width: 768px) { .qodef-qi-wp-forms.qodef-wpf-flex.qodef-wpf-wrap--768 form { flex-wrap: wrap; } } @media only screen and (max-width: 680px) { .qodef-qi-wp-forms.qodef-wpf-flex.qodef-wpf-wrap--680 form { flex-wrap: wrap; } } .qodef-qi-wp-forms .qodef-gutenberg-column { margin: 0 !important; } .qodef-qi-wp-forms .wpforms-submit-container { padding: 0 !important; } .qodef-qi-wp-forms div.wpforms-container-full .wpforms-form .wpforms-list-inline ul li { margin-right: 0 !important; } .qodef-qi-wp-forms div.wpforms-container-full .wpforms-form ul li { margin-bottom: 0 !important; } .qodef-qi-wp-forms label { margin-bottom: 0; } .qodef-qi-wp-forms input[type=date], .qodef-qi-wp-forms input[type=email], .qodef-qi-wp-forms input[type=number], .qodef-qi-wp-forms input[type=password], .qodef-qi-wp-forms input[type=search], .qodef-qi-wp-forms input[type=tel], .qodef-qi-wp-forms input[type=text], .qodef-qi-wp-forms input[type=url], .qodef-qi-wp-forms textarea { margin: 0; } .qodef-qi-wp-forms input[type=range] { padding: 0 !important; margin: 0 !important; } .qodef-qi-wp-forms input[type=checkbox], .qodef-qi-wp-forms input[type=radio] { margin: 0; width: 1em !important; height: 1em !important; vertical-align: middle !important; } .qodef-qi-wp-forms button[type=submit]:focus, .qodef-qi-wp-forms button[type=submit]:hover, .qodef-qi-wp-forms input[type=submit]:focus, .qodef-qi-wp-forms input[type=submit]:hover { color: unset; background-color: unset; } .qodef-qi-wp-forms input[type=submit], .qodef-qi-wp-forms button[type=submit] { display: inline-flex; } .qodef-qi-wp-forms input[type=submit] span, .qodef-qi-wp-forms button[type=submit] span { display: inline; } /* ========================================================================== Accordion shortcode styles ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ .qodef-qi-accordion { position: relative; display: inline-block; width: 100%; vertical-align: top; visibility: hidden; overflow-anchor: none; } .qodef-qi-accordion .qodef-e-content-inner { position: relative; display: inline-block; width: 100%; vertical-align: top; } .qodef-qi-accordion.qodef--init { visibility: visible; } .qodef-qi-accordion .qodef-e-icon > svg { width: 1em; fill: currentColor; stroke: currentColor; vertical-align: top; } .qodef-qi-accordion .qodef-e-title-holder { position: relative; display: flex; align-items: center; justify-content: space-between; padding: 26px 10px 26px 26px; transition: all .2s ease-out; cursor: pointer; gap: 10px; margin: 0; } .qodef-qi-accordion .qodef-e-title-holder:not(:first-child) { margin: 12px 0 0; } .qodef-qi-accordion .qodef-e-title-holder .qodef-e-mark { position: relative; flex-shrink: 0; width: 20px; height: 18px; line-height: 1; text-align: center; } .qodef-qi-accordion .qodef-e-title-holder .qodef-e-mark span { position: absolute; display: flex; align-items: center; justify-content: center; top: 0; right: 0; height: 100%; } .qodef-qi-accordion .qodef-e-title-holder .qodef-e-mark span:before { display: block; line-height: inherit; } .qodef-qi-accordion .qodef-e-title-holder .qodef-e-mark span.qodef-icon--minus, .qodef-qi-accordion .qodef-e-title-holder .qodef-e-mark span.qodef-icon--plus { transition: opacity .2s ease-out, color .2s ease-out; } .qodef-qi-accordion .qodef-e-title-holder .qodef-e-mark span.qodef-icon--minus { opacity: 0; } .qodef-qi-accordion .qodef-e-title-holder .qodef-e-mark span.qodef-icon--plus { opacity: 1; } .qodef-qi-accordion .qodef-e-title-holder.ui-state-active .qodef-e-mark span.qodef-icon--minus { opacity: 1; } .qodef-qi-accordion .qodef-e-title-holder.ui-state-active .qodef-e-mark span.qodef-icon--plus { opacity: 0; } .qodef-qi-accordion .qodef-e-title-holder.ui-state-active.ui-state-hover .qodef-e-mark span.qodef-icon--plus { opacity: 0; } .qodef-qi-accordion .qodef-e-content { padding: 0 26px 16px; margin: 0; transition: background-color .2s ease-out; box-sizing: content-box; } .qodef-qi-accordion .qodef-e-content p { margin: 0; } .qodef-qi-accordion.qodef-style--standard .qodef-e-content { padding: 16px 26px; } .qodef-qi-accordion.qodef-style--standard .qodef-e-title-holder.ui-state-active { background-color: #f6f6f6; } .qodef-qi-accordion.qodef-style--boxed { border: 1px solid #ebebeb; } .qodef-qi-accordion.qodef-style--boxed .qodef-e-title-holder:not(:first-child) { margin: 0; border-top: 1px solid #ebebeb; } .qodef-qi-accordion.qodef-style--border-top { border-bottom: 1px solid #ebebeb; } .qodef-qi-accordion.qodef-style--border-top .qodef-e-title-holder { margin: 0; border-top: 1px solid #ebebeb; } .qodef-qi-accordion.qodef-style--border-between .qodef-e-title-holder { margin: 0; border-bottom: 1px solid #ebebeb; } .qodef-qi-accordion.qodef-style--border-between .qodef-e-content { padding: 16px 26px; border-bottom: 1px solid #ebebeb; } /* ========================================================================== Section Title shortcode styles ========================================================================== */ /* ========================================================================== Global mixins ========================================================================== */ .qodef-qi-animated-text .qodef-m-title { overflow: hidden; } .qodef-qi-animated-text .qodef-e-word { display: inline-block; } .qodef-qi-animated-text .qodef-e-character { display: inline-flex; } .qodef-qi-animated-text .qodef-e-word-holder { white-space: nowrap; } .qodef-qi-animated-text.qodef--animated-by-letter.qodef--alignment-left .qodef-m-title { justify-content: flex-start; } .qodef-qi-animated-text.qodef--animated-by-letter.qodef--alignment-right .qodef-m-title { justify-content: flex-end; } .qodef-qi-animated-text.qodef--animated-by-letter.qodef--alignment-center .qodef-m-title { justify-content: center; } .qodef-qi-animated-text.qodef--appear-from-bottom .qodef-e-word, .qodef-qi-animated-text.qodef--appear-from-bottom .qodef-e-character { opacity: 0; transform: translateY(50px); transition: opacity 0.25s, transform 0.45s cubic-bezier(0.26, -0.14, 0, 1.01); } .qodef-qi-animated-text.qodef--appear-from-top .qodef-e-word, .qodef-qi-animated-text.qodef--appear-from-top .qodef-e-character { opacity: 0; transform: translateY(-50px); transition: opacity 0.25s, transform 0.45s cubic-bezier(0.26, -0.14, 0, 1.01); } .qodef-qi-animated-text.qodef--appear-from-left .qodef-e-word, .qodef-qi-animated-text.qodef--appear-from-left .qodef-e-character { opacity: 0; transform: translateX(-50px); transition: opacity 0.25s, transform 0.45s cubic-bezier(0.26, -0.14, 0, 1.01); } .qodef-qi-animated-text.qodef--appear-from-right .qodef-e-word, .qodef-qi-animated-text.qodef--appear-from-right .qodef-e-character { opacity: 0; transform: translateX(50px); transition: opacity 0.25s, transform 0.45s cubic-bezier(0.26, -0.14, 0, 1.01); } .qodef-qi-animated-text.qodef--appear-fade .qodef-e-word, .qodef-qi-animated-text.qodef--appear-fade .qodef-e-character { opacity: 0; transition: opacity 1s ease-out; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(2) { transition-delay: 0.28s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(3) { transition-delay: 0.42s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(4) { transition-delay: 0.56s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(5) { transition-delay: 0.7s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(6) { transition-delay: 0.84s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(7) { transition-delay: 0.98s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(8) { transition-delay: 1.12s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(9) { transition-delay: 1.26s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(10) { transition-delay: 1.4s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(11) { transition-delay: 1.54s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(12) { transition-delay: 1.68s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(13) { transition-delay: 1.82s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(14) { transition-delay: 1.96s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(15) { transition-delay: 2.1s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(16) { transition-delay: 2.24s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(17) { transition-delay: 2.38s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(18) { transition-delay: 2.52s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(19) { transition-delay: 2.66s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(20) { transition-delay: 2.8s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(21) { transition-delay: 2.94s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(22) { transition-delay: 3.08s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(23) { transition-delay: 3.22s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(24) { transition-delay: 3.36s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(25) { transition-delay: 3.5s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(26) { transition-delay: 3.64s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(27) { transition-delay: 3.78s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(28) { transition-delay: 3.92s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(29) { transition-delay: 4.06s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(30) { transition-delay: 4.2s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(31) { transition-delay: 4.34s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(32) { transition-delay: 4.48s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(33) { transition-delay: 4.62s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(34) { transition-delay: 4.76s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(35) { transition-delay: 4.9s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(36) { transition-delay: 5.04s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(37) { transition-delay: 5.18s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(38) { transition-delay: 5.32s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(39) { transition-delay: 5.46s; } .qodef-qi-animated-text.qodef--animated-by-word:not(.qodef--appear-from-left) .qodef-e-word:nth-child(40) { transition-delay: 5.6s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(2) { transition-delay: 0.28s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(3) { transition-delay: 0.42s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(4) { transition-delay: 0.56s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(5) { transition-delay: 0.7s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(6) { transition-delay: 0.84s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(7) { transition-delay: 0.98s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(8) { transition-delay: 1.12s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(9) { transition-delay: 1.26s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(10) { transition-delay: 1.4s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(11) { transition-delay: 1.54s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(12) { transition-delay: 1.68s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(13) { transition-delay: 1.82s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(14) { transition-delay: 1.96s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(15) { transition-delay: 2.1s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(16) { transition-delay: 2.24s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(17) { transition-delay: 2.38s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(18) { transition-delay: 2.52s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(19) { transition-delay: 2.66s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(20) { transition-delay: 2.8s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(21) { transition-delay: 2.94s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(22) { transition-delay: 3.08s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(23) { transition-delay: 3.22s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(24) { transition-delay: 3.36s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(25) { transition-delay: 3.5s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(26) { transition-delay: 3.64s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(27) { transition-delay: 3.78s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(28) { transition-delay: 3.92s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(29) { transition-delay: 4.06s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(30) { transition-delay: 4.2s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(31) { transition-delay: 4.34s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(32) { transition-delay: 4.48s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(33) { transition-delay: 4.62s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(34) { transition-delay: 4.76s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(35) { transition-delay: 4.9s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(36) { transition-delay: 5.04s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(37) { transition-delay: 5.18s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(38) { transition-delay: 5.32s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(39) { transition-delay: 5.46s; } .qodef-qi-animated-text.qodef--animated-by-word.qodef--appear-from-left .qodef-e-word:nth-last-child(40) { transition-delay: 5.6s; } .qodef-qi-animated-text.qodef--appear-from-bottom.qodef-qi--appeared .qodef-e-word, .qodef-qi-animated-text.qodef--appear-from-bottom.qodef-qi--appeared .qodef-e-character, .qodef-qi-animated-text.qodef--appear-from-top.qodef-qi--appeared .qodef-e-word, .qodef-qi-animated-text.qodef--appear-from-top.qodef-qi--appeared .qodef-e-character, .qodef-qi-animated-text.qodef--appear-from-left.qodef-qi--appeared .qodef-e-word, .qodef-qi-animated-text.qodef--appear-from-left.qodef-qi--appeared .qodef-e-character, .qodef-qi-animated-text.qodef--appear-from-right.qodef-qi--appeared .qodef-e-word, .qodef-qi-animated-text.qodef--appear-from-right.qodef-qi--appeared .qodef-e-character, .qodef-qi-animated-text.qodef--appear-fade.qodef-qi--appeared .qodef-e-word, .qodef-qi-animated-text.qodef--appear-fade.qodef-qi--appeared .qodef-e-character { opacity: 1; transform: translateX(0) translateZ(0); } .qodef-qi-animated-text:not(.qodef--animated-by-word):not(.qodef--animated-by-letter).qodef--appear-from-bottom .qodef-m-title { opacity: 0; transform: translateY(50px); transition: opacity 0.4s, transform 0.7s cubic-bezier(0.26, -0.14, 0, 1.01); } .qodef-qi-animated-text:not(.qodef--animated-by-word):not(.qodef--animated-by-letter).qodef--appear-from-top .qodef-m-title { opacity: 0; transform: translateY(-50px); transition: opacity 0.4s, transform 0.7s cubic-bezier(0.26, -0.14, 0, 1.01); } .qodef-qi-animated-text:not(.qodef--animated-by-word):not(.qodef--animated-by-letter).qodef--appear-from-left .qodef-m-title { opacity: 0; transform: translateX(-50px); transition: opacity 0.4s, transform 0.7s cubic-bezier(0.26, -0.14, 0, 1.01); } .qodef-qi-animated-text:not(.qodef--animated-by-word):not(.qodef--animated-by-letter).qodef--appear-from-right .qodef-m-title { opacity: 0; transform: translateX(50px); transition: opacity 0.4s, transform 0.7s cubic-bezier(0.26, -0.14, 0, 1.01); } .qodef-qi-animated-text:not(.qodef--animated-by-word):not(.qodef--animated-by-letter).qodef--appear-fade .qodef-m-title { opacity: 0; transition: opacity 0.7s ease-out; } .qodef-qi-animated-text:not(.qodef--animated-by-word):not(.qodef--animated-by-letter).qodef--appear-from-bottom.qodef-qi--appeared .qodef-m-title, .qodef-qi-animated-text:not(.qodef--animated-by-word):not(.qodef--animated-by-letter).qodef--appear-from-top.qodef-qi--appeared .qodef-m-title, .qodef-qi-animated-text:not(.qodef--animated-by-word):not(.qodef--animated-by-letter).qodef--appear-from-left.qodef-qi--appeared .qodef-m-title, .qodef-qi-animated-text:not(.qodef--animated-by-word):not(.qodef--animated-by-letter).qodef--appear-from-right.qodef-qi--appeared .qodef-m-title, .qodef-qi-animated-text:not(.qodef--animated-by-word):not(.qodef--animated-by-letter).qodef--appear-fade.qodef-qi--appeared .qodef-m-title { opacity: 1; transform: translateX(0) translateZ(0); } /* ========================================================================== Banner shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Global mixins ========================================================================== */ .qodef-qi-banner { position: relative; display: inline-block; width: 100%; vertical-align: top; width: auto; overflow: hidden; transition: box-shadow .35s ease-out; z-index: 1; } .qodef-qi-banner .qodef-m-banner-link { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; z-index: 1; } .qodef-qi-banner .qodef-m-content { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: column; } .qodef-qi-banner .qodef-m-title { margin: .25em 0 0; } .qodef-qi-banner .qodef-m-title-inner { display: inline-block; } .qodef-qi-banner .qodef-m-subtitle { margin: 0; } .qodef-qi-banner .qodef-m-content-inner > .qodef-m-text { margin: .7em 0 0; } .qodef-qi-banner .qodef-m-button { margin: .5em 0 0; } .qodef-qi-banner .qodef-m-button .qodef-qi-button { z-index: 2; } .qodef-qi-banner .qodef-m-image { position: relative; display: inline-block; width: 100%; vertical-align: top; width: auto; overflow: hidden; } .qodef-qi-banner .qodef-m-image img { display: inline-block; } .qodef-qi-banner .qodef-m-image:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: transparent; transition: background-color .35s ease-out; } .qodef-qi-banner.qodef-vertical--top .qodef-m-content { justify-content: flex-start; } .qodef-qi-banner.qodef-vertical--middle .qodef-m-content { justify-content: center; } .qodef-qi-banner.qodef-vertical--bottom .qodef-m-content { justify-content: flex-end; } .qodef-qi-banner.qodef-horizontal--left .qodef-m-content { align-items: flex-start; text-align: left; } .qodef-qi-banner.qodef-horizontal--center .qodef-m-content { align-items: center; text-align: center; } .qodef-qi-banner.qodef-horizontal--right .qodef-m-content { align-items: flex-end; text-align: right; } .qodef-qi-banner.qodef-image--hover-zoom img { transform: scale(1.005) translateZ(0); transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); will-change: transform; } .qodef-qi-banner.qodef-image--hover-zoom:hover img { transform: scale(1.03); } .qodef-qi-banner.qodef-image--hover-zoom-out img { transform: scale(1.03) translateZ(0); transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); will-change: transform; } .qodef-qi-banner.qodef-image--hover-zoom-out:hover img { transform: scale(1); } .qodef-qi-banner.qodef-image--hover-move img { transform: scale(1.2); transition: transform 0.5s cubic-bezier(0.33, 0.02, 0, 0.93); will-change: transform; } .qodef-qi-banner.qodef-image--hover-move:hover img { transform: scale(1.2) translateX(12px); } .qodef-qi-banner.qodef-image--hover-from-top img { transform-origin: top; } .qodef-qi-banner.qodef-image--hover-from-bottom img { transform-origin: bottom; } .qodef-qi-banner.qodef-image--hover-from-left img { transform-origin: left; } .qodef-qi-banner.qodef-image--hover-from-right img { transform-origin: right; } .qodef-qi-banner.qodef-layout--in-box .qodef-m-content { padding: 45px; } .qodef-qi-banner.qodef-layout--in-box .qodef-m-content-inner { background-color: #fff; padding: 25px; max-width: 100%; width: 100%; } .qodef-qi-banner.qodef-layout--standard .qodef-m-content { padding: 30px; } /* ========================================================================== Before/After shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ .qodef-before-after-image-holder { visibility: hidden; -webkit-user-select: none; -ms-user-select: none; user-select: none; } .qodef-before-after-image-holder img { position: absolute; -webkit-user-select: none; -ms-user-select: none; user-select: none; } .qodef-before-after-image-holder.active { cursor: grab; } .qodef-qi-before-after { -webkit-user-select: none; overflow: hidden; } .qodef-qi-before-after .twentytwenty-handle { position: absolute; left: 50%; top: 50%; display: flex; align-items: center; justify-content: center; text-align: center; font-size: 100px; height: 1em; width: 1em; margin-left: -0.5em; margin-top: -0.5em; color: #fff; background-color: currentColor; border-radius: 50%; cursor: grab; z-index: 40; } @media only screen and (max-width: 1024px) { .qodef-qi-before-after .twentytwenty-handle { font-size: 50px; } } .qodef-qi-before-after .twentytwenty-handle .qodef-handle-text { font-size: 1rem; color: #111; font-weight: 700; text-transform: uppercase; -webkit-user-select: none; -ms-user-select: none; user-select: none; } .qodef-qi-before-after .twentytwenty-handle:before, .qodef-qi-before-after .twentytwenty-handle:after { content: " "; display: block; background: currentColor; position: absolute; z-index: 30; } .qodef-qi-before-after .twentytwenty-horizontal .twentytwenty-handle:before, .qodef-qi-before-after .twentytwenty-horizontal .twentytwenty-handle:after { width: 2px; height: 100vh; left: 50%; transform: translateX(-50%); } .qodef-qi-before-after .twentytwenty-vertical .twentytwenty-handle:before, .qodef-qi-before-after .twentytwenty-vertical .twentytwenty-handle:after { width: 100vw; height: 2px; top: 50%; transform: translateY(-50%); } .qodef-qi-before-after .twentytwenty-before-label, .qodef-qi-before-after .twentytwenty-after-label { display: none; } .qodef-qi-before-after .twentytwenty-container { position: relative; overflow: hidden; z-index: 0; } .qodef-qi-before-after .twentytwenty-container img { position: absolute; top: 0; max-width: 100%; width: 100%; } .qodef-qi-before-after .twentytwenty-before { z-index: 20; } .qodef-qi-before-after .twentytwenty-after { z-index: 10; } .qodef-qi-before-after .twentytwenty-vertical .twentytwenty-handle:before { left: 50%; margin-left: 0.48em; } .qodef-qi-before-after .twentytwenty-vertical .twentytwenty-handle:after { right: 50%; margin-right: 0.48em; } .qodef-qi-before-after .twentytwenty-vertical .twentytwenty-down-arrow, .qodef-qi-before-after .twentytwenty-vertical .twentytwenty-up-arrow { display: none; } .qodef-qi-before-after .twentytwenty-horizontal .twentytwenty-handle:before { bottom: 50%; margin-bottom: 0.48em; } .qodef-qi-before-after .twentytwenty-horizontal .twentytwenty-handle:after { top: 50%; margin-top: 0.48em; } .qodef-qi-before-after .twentytwenty-horizontal .twentytwenty-left-arrow, .qodef-qi-before-after .twentytwenty-horizontal .twentytwenty-right-arrow { display: none; } /* ========================================================================== Blockquote shortcode styles ========================================================================== */ .qodef-qi-blockquote .qodef-m-text { margin: 0; } .qodef-qi-blockquote .qodef-m-icon { font-size: 30px; line-height: 1; transition: all .3s ease-in-out; } .qodef-qi-blockquote .qodef-m-icon i { color: inherit; } .qodef-qi-blockquote .qodef-m-icon svg { width: 30px; height: auto; fill: currentColor; stroke: currentColor; } /* ========================================================================== Button shortcode styles ========================================================================== */ .qodef-qi-blockquote.qodef-layout--inline .qodef-m-icon { float: left; line-height: 1em; width: 1em; height: 1em; display: inline-flex; align-items: center; justify-content: center; margin: 0 0.5em 0 0; } /* ========================================================================== Business Hours shortcode styles ========================================================================== */ /* ========================================================================== Global mixins ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ .qodef-qi-business-hours { position: relative; border: 1px solid #e1e1e1; padding: 35px; } .qodef-qi-business-hours.qodef-line-type--between .qodef-e-line { border-bottom: 1px solid rgba(30, 30, 30, 0.2); } .qodef-qi-business-hours.qodef-line-type--below .qodef-e-item { border-bottom: 1px solid rgba(30, 30, 30, 0.2); } .qodef-qi-business-hours.qodef-line-type--below .qodef-e-item:last-child { border-bottom: none; } .qodef-qi-business-hours.qodef-line-type--none .qodef-e-day { margin-right: 10px; } .qodef-qi-business-hours.qodef-line-type--none .qodef-e-line { display: none; } .qodef-qi-business-hours .qodef-e-item { margin-bottom: 1em; display: flex; align-items: baseline; } .qodef-qi-business-hours .qodef-e-item:last-child { margin-bottom: 0; } .qodef-qi-business-hours .qodef-e-title-holder { display: flex; align-items: baseline; } .qodef-qi-business-hours .qodef-m-title { margin: 0 0 1em; } .qodef-qi-business-hours .qodef-m-subtitle { margin: 0 0 .5em; } .qodef-qi-business-hours .qodef-m-text { margin: .5em 0 0; } .qodef-qi-business-hours .qodef-e-icon { line-height: 1; padding-right: 12px; } .qodef-qi-business-hours .qodef-e-day { margin: 0; } .qodef-qi-business-hours .qodef-e-hours { margin: 0; } .qodef-qi-business-hours .qodef-e-line { flex-grow: 1; margin: 0 8px; } .qodef-qi-business-hours.qodef-text-underline .qodef-m-text a { position: relative; color: currentColor; } .qodef-qi-business-hours.qodef-text-underline .qodef-m-text a:after { content: ''; position: absolute; bottom: 3px; left: 0; width: 100%; height: 1px; background-color: currentColor; backface-visibility: hidden; } .qodef-qi-business-hours.qodef-text-underline .qodef-m-text a:hover { text-decoration: none; } .qodef-qi-business-hours.qodef-text-underline .qodef-m-text a:hover:after { animation: qodef-animate-underline-from-left 0.6s cubic-bezier(0.45, 0.29, 0, 0.82) forwards; } /* ========================================================================== Business Hours shortcode styles ========================================================================== */ @media only screen and (max-width: 768px) { .qodef-resposive--768.qodef-qi-business-hours .qodef-e-item { flex-direction: column; } } @media only screen and (max-width: 680px) { .qodef-resposive--680.qodef-qi-business-hours .qodef-e-item { flex-direction: column; } } @media only screen and (max-width: 480px) { .qodef-resposive--480.qodef-qi-business-hours .qodef-e-item { flex-direction: column; } } /* ========================================================================== Button shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ /* ========================================================================== Button mixins - start ========================================================================== */ /* ========================================================================== Button mixins - end ========================================================================== */ /* ========================================================================== Animation mixins - start ========================================================================== */ /* ========================================================================== Animation mixins - end ========================================================================== */ .qodef-qi-button { position: relative; display: inline-block; vertical-align: middle; width: auto; margin: 0; font-family: inherit; font-size: 16px; line-height: 2em; font-weight: 500; text-decoration: none; text-transform: none; border-radius: 4px; outline: none; transition: color 0.25s ease-in-out, background-color 0.25s ease-in-out, border-color 0.25s ease-in-out; display: inline-flex; align-items: center; justify-content: center; font-size: 1rem; padding: 13px 46px; overflow: hidden; } .qodef-qi-button.qodef-size--small { padding: 9px 33px; } .qodef-qi-button.qodef-size--large { padding: 15px 52px; } .qodef-qi-button.qodef-size--full { width: 100%; text-align: center; } .qodef-qi-button.qodef-layout--filled { color: #111111; background-color: #f4f4f4; border: 0; font-size: 1rem; border-style: solid; } .qodef-qi-button.qodef-layout--filled:hover { color: #fff; background-color: #111111; } .qodef-qi-button.qodef-layout--outlined { color: #111111; background-color: transparent; border: 2px solid #111111; } .qodef-qi-button.qodef-layout--outlined:hover { color: #111111; background-color: #f4f4f4; border-color: #f4f4f4; } .qodef-qi-button.qodef-layout--textual { padding: 0 !important; background-color: transparent; border: 0; border-radius: 0; overflow: visible; } .qodef-qi-button.qodef-layout--textual .qodef-m-text { display: inline-block; vertical-align: middle; } .qodef-qi-button.qodef-layout--textual:hover { color: #111111; } .qodef-qi-button.qodef-icon--left { display: inline-flex; align-items: center; justify-content: center; flex-direction: row-reverse; } .qodef-qi-button.qodef-text-underline .qodef-m-text { position: relative; } .qodef-qi-button.qodef-text-underline .qodef-m-text:after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background-color: currentColor; transition: background-color 0.25s ease-in-out, width 0.36s cubic-bezier(0.51, 0.5, 0.07, 0.99); backface-visibility: hidden; } .qodef-qi-button.qodef-text-underline:not(.qodef-button-underline-draw):hover .qodef-m-text:after { width: 0; } .qodef-qi-button.qodef-text-underline.qodef-underline--center .qodef-m-text:after { left: 50%; transform: translateX(-50%); } .qodef-qi-button.qodef-text-underline.qodef-underline--right .qodef-m-text:after { left: auto; right: 0; } .qodef-qi-button.qodef-button-underline-draw .qodef-m-text { overflow: hidden; } .qodef-qi-button.qodef-button-underline-draw.qodef-underline--left:hover .qodef-m-text:after, .qodef-qi-button.qodef-button-underline-draw.qodef-underline--right:hover .qodef-m-text:after { animation: qodef-animate-underline-from-left 0.7s cubic-bezier(0.45, 0.29, 0, 0.82) forwards; } .qodef-qi-button.qodef-button-underline-draw.qodef-underline--right:hover .qodef-m-text:after { animation: qodef-animate-underline-from-right 0.7s cubic-bezier(0.45, 0.29, 0, 0.82) forwards; } .qodef-qi-button .qodef-m-icon { color: currentColor; line-height: 0; } .qodef-qi-button .qodef-m-icon.qodef--icon-color-set { transition: color .25s ease-in-out, background-color .25s ease-in-out; } .qodef-qi-button .qodef-m-icon svg { width: 1em; fill: currentColor; stroke: currentColor; vertical-align: middle; } .qodef-qi-button.qodef-icon--right:not(.qodef-type--icon-boxed) .qodef-m-icon { margin-left: 10px; } .qodef-qi-button.qodef-icon--left:not(.qodef-type--icon-boxed) .qodef-m-icon { margin-right: 10px; } .qodef-qi-button.qodef-hover--icon-move-horizontal .qodef-m-icon-inner, .qodef-qi-button.qodef-hover--icon-move-vertical .qodef-m-icon-inner, .qodef-qi-button.qodef-hover--icon-move-diagonal .qodef-m-icon-inner { position: relative; overflow: hidden; display: inherit; padding: 1px; } .qodef-qi-button.qodef-hover--icon-move-horizontal .qodef-m-icon-inner i, .qodef-qi-button.qodef-hover--icon-move-horizontal .qodef-m-icon-inner svg, .qodef-qi-button.qodef-hover--icon-move-vertical .qodef-m-icon-inner i, .qodef-qi-button.qodef-hover--icon-move-vertical .qodef-m-icon-inner svg, .qodef-qi-button.qodef-hover--icon-move-diagonal .qodef-m-icon-inner i, .qodef-qi-button.qodef-hover--icon-move-diagonal .qodef-m-icon-inner svg { transition: transform 0.38s cubic-bezier(0.37, 0.08, 0.02, 0.93), opacity 0.18s ease-in-out; will-change: transform; } .qodef-qi-button.qodef-hover--icon-move-horizontal .qodef-m-icon-inner i:nth-child(1), .qodef-qi-button.qodef-hover--icon-move-horizontal .qodef-m-icon-inner svg:nth-child(1), .qodef-qi-button.qodef-hover--icon-move-vertical .qodef-m-icon-inner i:nth-child(1), .qodef-qi-button.qodef-hover--icon-move-vertical .qodef-m-icon-inner svg:nth-child(1), .qodef-qi-button.qodef-hover--icon-move-diagonal .qodef-m-icon-inner i:nth-child(1), .qodef-qi-button.qodef-hover--icon-move-diagonal .qodef-m-icon-inner svg:nth-child(1) { transform: translateX(0) translateY(0); transition-delay: .1s; opacity: 1; } .qodef-qi-button.qodef-hover--icon-move-horizontal .qodef-m-icon-inner i:nth-child(2), .qodef-qi-button.qodef-hover--icon-move-horizontal .qodef-m-icon-inner svg:nth-child(2), .qodef-qi-button.qodef-hover--icon-move-vertical .qodef-m-icon-inner i:nth-child(2), .qodef-qi-button.qodef-hover--icon-move-vertical .qodef-m-icon-inner svg:nth-child(2), .qodef-qi-button.qodef-hover--icon-move-diagonal .qodef-m-icon-inner i:nth-child(2), .qodef-qi-button.qodef-hover--icon-move-diagonal .qodef-m-icon-inner svg:nth-child(2) { position: absolute; opacity: 0; left: 1px; top: 1px; transition-delay: 0s; } .qodef-qi-button.qodef-hover--icon-move-horizontal:hover .qodef-m-icon-inner i:nth-child(1), .qodef-qi-button.qodef-hover--icon-move-horizontal:hover .qodef-m-icon-inner svg:nth-child(1), .qodef-qi-button.qodef-hover--icon-move-vertical:hover .qodef-m-icon-inner i:nth-child(1), .qodef-qi-button.qodef-hover--icon-move-vertical:hover .qodef-m-icon-inner svg:nth-child(1), .qodef-qi-button.qodef-hover--icon-move-diagonal:hover .qodef-m-icon-inner i:nth-child(1), .qodef-qi-button.qodef-hover--icon-move-diagonal:hover .qodef-m-icon-inner svg:nth-child(1) { opacity: 0; } .qodef-qi-button.qodef-hover--icon-move-horizontal:hover .qodef-m-icon-inner i:nth-child(2), .qodef-qi-button.qodef-hover--icon-move-horizontal:hover .qodef-m-icon-inner svg:nth-child(2), .qodef-qi-button.qodef-hover--icon-move-vertical:hover .qodef-m-icon-inner i:nth-child(2), .qodef-qi-button.qodef-hover--icon-move-vertical:hover .qodef-m-icon-inner svg:nth-child(2), .qodef-qi-button.qodef-hover--icon-move-diagonal:hover .qodef-m-icon-inner i:nth-child(2), .qodef-qi-button.qodef-hover--icon-move-diagonal:hover .qodef-m-icon-inner svg:nth-child(2) { transform: translateX(0%) translateY(0) translatez(0); transition-delay: .25s; opacity: 1; } .qodef-qi-button.qodef-hover--icon-move-horizontal .qodef-m-icon-inner i:nth-child(2), .qodef-qi-button.qodef-hover--icon-move-horizontal .qodef-m-icon-inner svg:nth-child(2) { transform: translateX(-150%) translateY(0); } .qodef-qi-button.qodef-hover--icon-move-horizontal:hover .qodef-m-icon-inner i:nth-child(1), .qodef-qi-button.qodef-hover--icon-move-horizontal:hover .qodef-m-icon-inner svg:nth-child(1) { transform: translateX(200%) translateY(0); } .qodef-qi-button.qodef-hover--icon-move-vertical .qodef-m-icon-inner i, .qodef-qi-button.qodef-hover--icon-move-vertical .qodef-m-icon-inner svg { will-change: transform; } .qodef-qi-button.qodef-hover--icon-move-vertical .qodef-m-icon-inner i:nth-child(2), .qodef-qi-button.qodef-hover--icon-move-vertical .qodef-m-icon-inner svg:nth-child(2) { transform: translateX(0) translateY(150%) translateZ(0); } .qodef-qi-button.qodef-hover--icon-move-vertical:hover .qodef-m-icon-inner i:nth-child(1), .qodef-qi-button.qodef-hover--icon-move-vertical:hover .qodef-m-icon-inner svg:nth-child(1) { transform: translateX(0) translateY(-150%) translateZ(0); } .qodef-qi-button.qodef-hover--icon-move-diagonal .qodef-m-icon-inner i, .qodef-qi-button.qodef-hover--icon-move-diagonal .qodef-m-icon-inner svg { will-change: transform; } .qodef-qi-button.qodef-hover--icon-move-diagonal .qodef-m-icon-inner i:nth-child(2), .qodef-qi-button.qodef-hover--icon-move-diagonal .qodef-m-icon-inner svg:nth-child(2) { transform: translateX(-100%) translateY(100%) translateZ(0); } .qodef-qi-button.qodef-hover--icon-move-diagonal:hover .qodef-m-icon-inner i:nth-child(1), .qodef-qi-button.qodef-hover--icon-move-diagonal:hover .qodef-m-icon-inner svg:nth-child(1) { transform: translateX(100%) translateY(-100%) translateZ(0); } .qodef-qi-button.qodef-hover--icon-move-horizontal-short .qodef-m-icon-inner i, .qodef-qi-button.qodef-hover--icon-move-horizontal-short .qodef-m-icon-inner svg { transition: transform 0.3s cubic-bezier(0.37, 0.08, 0.02, 0.93), opacity 0.2s ease-in-out; transform: translateX(0); will-change: transform; } .qodef-qi-button.qodef-hover--icon-move-horizontal-short:hover .qodef-m-icon-inner i, .qodef-qi-button.qodef-hover--icon-move-horizontal-short:hover .qodef-m-icon-inner svg { transform: translateX(4px); } .qodef-qi-button.qodef-hover--reveal:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: transform 0.5s cubic-bezier(0.54, 0.3, 0.02, 1.01); } .qodef-qi-button.qodef-hover--reveal .qodef-m-text, .qodef-qi-button.qodef-hover--reveal .qodef-m-icon { z-index: 1; } .qodef-qi-button.qodef-hover--reveal:hover:after { transform: scaleX(1) scaleY(1); } .qodef-qi-button.qodef-hover--reveal.qodef-layout--outlined:hover { background-color: initial; } .qodef-qi-button.qodef--reveal-horizontal:after { transform-origin: left; transform: scaleX(0); } .qodef-qi-button.qodef--reveal-vertical:after { transform-origin: bottom; transform: scaleY(0); } .qodef-qi-button.qodef-icon-background-hover--reveal .qodef-m-icon:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: transform 0.5s cubic-bezier(0.54, 0.3, 0.02, 1.01); } .qodef-qi-button.qodef-icon-background-hover--reveal .qodef-m-icon .qodef-m-icon-inner { z-index: 1; } .qodef-qi-button.qodef-icon-background-hover--reveal:hover .qodef-m-icon:after { transform: scaleX(1) scaleY(1); } .qodef-qi-button.qodef-icon-background-hover--reveal-horizontal .qodef-m-icon:after { transform-origin: left; transform: scaleX(0); } .qodef-qi-button.qodef-icon-background-hover--reveal-vertical .qodef-m-icon:after { transform-origin: bottom; transform: scaleY(0); } /* ========================================================================== Button shortcode styles ========================================================================== */ .qodef-qi-button.qodef-type--icon-boxed { padding: 0 !important; align-items: stretch; } .qodef-qi-button.qodef-type--icon-boxed .qodef-m-text { align-self: center; padding: 11px 28px; } .qodef-qi-button.qodef-type--icon-boxed.qodef-size--small .qodef-m-text { padding: 7px 15px; } .qodef-qi-button.qodef-type--icon-boxed.qodef-size--large .qodef-m-text { padding: 13px 40px; } .qodef-qi-button.qodef-type--icon-boxed .qodef-m-icon { position: relative; display: flex; align-items: center; justify-content: center; text-align: center; padding: 11px 0; } .qodef-qi-button.qodef-type--icon-boxed .qodef-m-icon i { line-height: inherit; } .qodef-qi-button.qodef-type--icon-boxed .qodef-m-icon svg { width: 1em; fill: currentColor; stroke: currentColor; } .qodef-qi-button.qodef-type--icon-boxed .qodef-m-border { width: 2px; background-color: #111; transition: background-color .25s ease-in-out; } /* ========================================================================== Button shortcode styles ========================================================================== */ .qodef-qi-button.qodef-type--inner-border .qodef-m-inner-border { position: absolute; top: 0; left: 0; width: 100%; height: 100%; color: #111; font-size: 4px; transition: color .25s ease-in-out; } .qodef-qi-button.qodef-type--inner-border .qodef-m-border-top, .qodef-qi-button.qodef-type--inner-border .qodef-m-border-right, .qodef-qi-button.qodef-type--inner-border .qodef-m-border-bottom, .qodef-qi-button.qodef-type--inner-border .qodef-m-border-left { position: absolute; background-color: currentColor; transition: background-color .25s ease-in-out; } .qodef-qi-button.qodef-type--inner-border .qodef-m-border-top { top: 1em; left: 1em; height: 2px; width: calc(100% - 2em); } .qodef-qi-button.qodef-type--inner-border .qodef-m-border-right { top: 1em; right: 1em; width: 2px; height: calc(100% - 2em); } .qodef-qi-button.qodef-type--inner-border .qodef-m-border-bottom { bottom: 1em; right: 1em; height: 2px; width: calc(100% - 2em); } .qodef-qi-button.qodef-type--inner-border .qodef-m-border-left { bottom: 1em; left: 1em; width: 2px; height: calc(100% - 2em); } .qodef-inner-border-hover--draw .qodef-m-inner-border-copy .qodef-m-border-top, .qodef-inner-border-hover--draw .qodef-m-inner-border-copy .qodef-m-border-right, .qodef-inner-border-hover--draw .qodef-m-inner-border-copy .qodef-m-border-bottom, .qodef-inner-border-hover--draw .qodef-m-inner-border-copy .qodef-m-border-left { transition: transform .36s ease-out; } .qodef-inner-border-hover--draw.q-draw-center .qodef-m-inner-border-copy .qodef-m-border-top, .qodef-inner-border-hover--draw.q-draw-center .qodef-m-inner-border-copy .qodef-m-border-bottom, .qodef-inner-border-hover--draw.q-draw-one-point .qodef-m-inner-border-copy .qodef-m-border-top, .qodef-inner-border-hover--draw.q-draw-one-point .qodef-m-inner-border-copy .qodef-m-border-bottom, .qodef-inner-border-hover--draw.q-draw-two-points .qodef-m-inner-border-copy .qodef-m-border-top, .qodef-inner-border-hover--draw.q-draw-two-points .qodef-m-inner-border-copy .qodef-m-border-bottom { transform: scaleX(0); } .qodef-inner-border-hover--draw.q-draw-center .qodef-m-inner-border-copy .qodef-m-border-left, .qodef-inner-border-hover--draw.q-draw-center .qodef-m-inner-border-copy .qodef-m-border-right, .qodef-inner-border-hover--draw.q-draw-one-point .qodef-m-inner-border-copy .qodef-m-border-left, .qodef-inner-border-hover--draw.q-draw-one-point .qodef-m-inner-border-copy .qodef-m-border-right, .qodef-inner-border-hover--draw.q-draw-two-points .qodef-m-inner-border-copy .qodef-m-border-left, .qodef-inner-border-hover--draw.q-draw-two-points .qodef-m-inner-border-copy .qodef-m-border-right { transform: scaleY(0); } .qodef-inner-border-hover--draw.q-draw-center:hover .qodef-m-inner-border-copy .qodef-m-border-top, .qodef-inner-border-hover--draw.q-draw-center:hover .qodef-m-inner-border-copy .qodef-m-border-right, .qodef-inner-border-hover--draw.q-draw-center:hover .qodef-m-inner-border-copy .qodef-m-border-bottom, .qodef-inner-border-hover--draw.q-draw-center:hover .qodef-m-inner-border-copy .qodef-m-border-left, .qodef-inner-border-hover--draw.q-draw-one-point:hover .qodef-m-inner-border-copy .qodef-m-border-top, .qodef-inner-border-hover--draw.q-draw-one-point:hover .qodef-m-inner-border-copy .qodef-m-border-right, .qodef-inner-border-hover--draw.q-draw-one-point:hover .qodef-m-inner-border-copy .qodef-m-border-bottom, .qodef-inner-border-hover--draw.q-draw-one-point:hover .qodef-m-inner-border-copy .qodef-m-border-left, .qodef-inner-border-hover--draw.q-draw-two-points:hover .qodef-m-inner-border-copy .qodef-m-border-top, .qodef-inner-border-hover--draw.q-draw-two-points:hover .qodef-m-inner-border-copy .qodef-m-border-right, .qodef-inner-border-hover--draw.q-draw-two-points:hover .qodef-m-inner-border-copy .qodef-m-border-bottom, .qodef-inner-border-hover--draw.q-draw-two-points:hover .qodef-m-inner-border-copy .qodef-m-border-left { transform: scaleX(1) scaleY(1); } .qodef-inner-border-hover--draw.q-draw-one-point .qodef-m-inner-border-copy .qodef-m-border-top, .qodef-inner-border-hover--draw.q-draw-one-point .qodef-m-inner-border-copy .qodef-m-border-right, .qodef-inner-border-hover--draw.q-draw-one-point .qodef-m-inner-border-copy .qodef-m-border-bottom, .qodef-inner-border-hover--draw.q-draw-one-point .qodef-m-inner-border-copy .qodef-m-border-left { transition-duration: .28s; } .qodef-inner-border-hover--draw.q-draw-one-point .qodef-m-inner-border-copy .qodef-m-border-top, .qodef-inner-border-hover--draw.q-draw-one-point .qodef-m-inner-border-copy .qodef-m-border-bottom { transform-origin: left; } .qodef-inner-border-hover--draw.q-draw-one-point .qodef-m-inner-border-copy .qodef-m-border-left, .qodef-inner-border-hover--draw.q-draw-one-point .qodef-m-inner-border-copy .qodef-m-border-right { transform-origin: top; } .qodef-inner-border-hover--draw.q-draw-one-point .qodef-m-inner-border-copy .qodef-m-border-top, .qodef-inner-border-hover--draw.q-draw-one-point .qodef-m-inner-border-copy .qodef-m-border-left { transition-delay: .28s; } .qodef-inner-border-hover--draw.q-draw-one-point .qodef-m-inner-border-copy .qodef-m-border-bottom, .qodef-inner-border-hover--draw.q-draw-one-point .qodef-m-inner-border-copy .qodef-m-border-right { transition-delay: .0s; } .qodef-inner-border-hover--draw.q-draw-one-point:hover .qodef-m-inner-border-copy .qodef-m-border-top, .qodef-inner-border-hover--draw.q-draw-one-point:hover .qodef-m-inner-border-copy .qodef-m-border-left { transition-delay: .0s; } .qodef-inner-border-hover--draw.q-draw-one-point:hover .qodef-m-inner-border-copy .qodef-m-border-bottom, .qodef-inner-border-hover--draw.q-draw-one-point:hover .qodef-m-inner-border-copy .qodef-m-border-right { transition-delay: .28s; } .qodef-inner-border-hover--draw.q-draw-two-points .qodef-m-border-top { transform-origin: left; } .qodef-inner-border-hover--draw.q-draw-two-points .qodef-m-border-bottom { transform-origin: right; } .qodef-inner-border-hover--draw.q-draw-two-points .qodef-m-border-left { transform-origin: top; } .qodef-inner-border-hover--draw.q-draw-two-points .qodef-m-border-right { transform-origin: bottom; } .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center .qodef-m-inner-border .qodef-m-border-top, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center .qodef-m-inner-border .qodef-m-border-right, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center .qodef-m-inner-border .qodef-m-border-bottom, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center .qodef-m-inner-border .qodef-m-border-left, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point .qodef-m-inner-border .qodef-m-border-top, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point .qodef-m-inner-border .qodef-m-border-right, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point .qodef-m-inner-border .qodef-m-border-bottom, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point .qodef-m-inner-border .qodef-m-border-left, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points .qodef-m-inner-border .qodef-m-border-top, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points .qodef-m-inner-border .qodef-m-border-right, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points .qodef-m-inner-border .qodef-m-border-bottom, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points .qodef-m-inner-border .qodef-m-border-left { transition: background-color .25s ease-in-out, transform .36s ease-out; transform: scaleX(1) scaleY(1); } .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center:hover .qodef-m-inner-border .qodef-m-border-top, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center:hover .qodef-m-inner-border .qodef-m-border-bottom, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point:hover .qodef-m-inner-border .qodef-m-border-top, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point:hover .qodef-m-inner-border .qodef-m-border-bottom, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points:hover .qodef-m-inner-border .qodef-m-border-top, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points:hover .qodef-m-inner-border .qodef-m-border-bottom { transform: scaleX(0); } .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center:hover .qodef-m-inner-border .qodef-m-border-left, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center:hover .qodef-m-inner-border .qodef-m-border-right, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point:hover .qodef-m-inner-border .qodef-m-border-left, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point:hover .qodef-m-inner-border .qodef-m-border-right, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points:hover .qodef-m-inner-border .qodef-m-border-left, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points:hover .qodef-m-inner-border .qodef-m-border-right { transform: scaleY(0); } .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center.q-remove-one-point .qodef-m-inner-border .qodef-m-border-top, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center.q-remove-one-point .qodef-m-inner-border .qodef-m-border-right, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center.q-remove-one-point .qodef-m-inner-border .qodef-m-border-bottom, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center.q-remove-one-point .qodef-m-inner-border .qodef-m-border-left, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point.q-remove-one-point .qodef-m-inner-border .qodef-m-border-top, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point.q-remove-one-point .qodef-m-inner-border .qodef-m-border-right, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point.q-remove-one-point .qodef-m-inner-border .qodef-m-border-bottom, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point.q-remove-one-point .qodef-m-inner-border .qodef-m-border-left, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points.q-remove-one-point .qodef-m-inner-border .qodef-m-border-top, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points.q-remove-one-point .qodef-m-inner-border .qodef-m-border-right, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points.q-remove-one-point .qodef-m-inner-border .qodef-m-border-bottom, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points.q-remove-one-point .qodef-m-inner-border .qodef-m-border-left { transition: background-color .25s ease-in-out, transform .28s ease-out; } .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center.q-remove-one-point .qodef-m-inner-border .qodef-m-border-top, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center.q-remove-one-point .qodef-m-inner-border .qodef-m-border-bottom, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point.q-remove-one-point .qodef-m-inner-border .qodef-m-border-top, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point.q-remove-one-point .qodef-m-inner-border .qodef-m-border-bottom, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points.q-remove-one-point .qodef-m-inner-border .qodef-m-border-top, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points.q-remove-one-point .qodef-m-inner-border .qodef-m-border-bottom { transform-origin: left; } .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center.q-remove-one-point .qodef-m-inner-border .qodef-m-border-left, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center.q-remove-one-point .qodef-m-inner-border .qodef-m-border-right, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point.q-remove-one-point .qodef-m-inner-border .qodef-m-border-left, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point.q-remove-one-point .qodef-m-inner-border .qodef-m-border-right, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points.q-remove-one-point .qodef-m-inner-border .qodef-m-border-left, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points.q-remove-one-point .qodef-m-inner-border .qodef-m-border-right { transform-origin: top; } .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center.q-remove-one-point .qodef-m-inner-border .qodef-m-border-top, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center.q-remove-one-point .qodef-m-inner-border .qodef-m-border-left, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point.q-remove-one-point .qodef-m-inner-border .qodef-m-border-top, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point.q-remove-one-point .qodef-m-inner-border .qodef-m-border-left, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points.q-remove-one-point .qodef-m-inner-border .qodef-m-border-top, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points.q-remove-one-point .qodef-m-inner-border .qodef-m-border-left { transition-delay: 0s, 0s; } .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center.q-remove-one-point .qodef-m-inner-border .qodef-m-border-bottom, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center.q-remove-one-point .qodef-m-inner-border .qodef-m-border-right, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point.q-remove-one-point .qodef-m-inner-border .qodef-m-border-bottom, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point.q-remove-one-point .qodef-m-inner-border .qodef-m-border-right, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points.q-remove-one-point .qodef-m-inner-border .qodef-m-border-bottom, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points.q-remove-one-point .qodef-m-inner-border .qodef-m-border-right { transition-delay: 0s, .28s; } .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center.q-remove-one-point:hover .qodef-m-inner-border .qodef-m-border-top, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center.q-remove-one-point:hover .qodef-m-inner-border .qodef-m-border-left, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point.q-remove-one-point:hover .qodef-m-inner-border .qodef-m-border-top, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point.q-remove-one-point:hover .qodef-m-inner-border .qodef-m-border-left, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points.q-remove-one-point:hover .qodef-m-inner-border .qodef-m-border-top, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points.q-remove-one-point:hover .qodef-m-inner-border .qodef-m-border-left { transition-delay: 0s,.28s; } .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center.q-remove-one-point:hover .qodef-m-inner-border .qodef-m-border-bottom, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center.q-remove-one-point:hover .qodef-m-inner-border .qodef-m-border-right, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point.q-remove-one-point:hover .qodef-m-inner-border .qodef-m-border-bottom, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point.q-remove-one-point:hover .qodef-m-inner-border .qodef-m-border-right, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points.q-remove-one-point:hover .qodef-m-inner-border .qodef-m-border-bottom, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points.q-remove-one-point:hover .qodef-m-inner-border .qodef-m-border-right { transition-delay: 0s, 0s; } .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center.q-remove-two-points .qodef-m-border-top, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point.q-remove-two-points .qodef-m-border-top, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points.q-remove-two-points .qodef-m-border-top { transform-origin: left; } .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center.q-remove-two-points .qodef-m-border-bottom, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point.q-remove-two-points .qodef-m-border-bottom, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points.q-remove-two-points .qodef-m-border-bottom { transform-origin: right; } .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center.q-remove-two-points .qodef-m-border-left, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point.q-remove-two-points .qodef-m-border-left, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points.q-remove-two-points .qodef-m-border-left { transform-origin: top; } .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-center.q-remove-two-points .qodef-m-border-right, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-one-point.q-remove-two-points .qodef-m-border-right, .qodef-type--inner-border.qodef-inner-border-hover--remove.q-remove-two-points.q-remove-two-points .qodef-m-border-right { transform-origin: bottom; } .qodef-type--inner-border.qodef-inner-border-hover--move-outer-edge { overflow: visible; } .qodef-type--inner-border.qodef-inner-border-hover--move-outer-edge .qodef-m-inner-border { top: 1em; left: 1em; width: calc(100% - 2em); height: calc(100% - 2em); border: 1px solid currentColor; transition: all 0.3s cubic-bezier(0.46, 0.03, 0.52, 0.96); } .qodef-type--inner-border.qodef-inner-border-hover--move-outer-edge:hover .qodef-m-inner-border { top: -1em; left: -1em; width: calc(100% + 2em); height: calc(100% + 2em); } /* ========================================================================== Call to Action shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ /* ========================================================================== Call to Action shortcode styles ========================================================================== */ .qodef-qi-call-to-action.qodef-layout--standard { position: relative; } .qodef-qi-call-to-action.qodef-layout--standard .qodef-m-inner { display: flex; align-items: center; justify-content: space-between; background: #333; padding: 6.4% 6% 6.9% 5.5%; } .qodef-qi-call-to-action.qodef-layout--standard .qodef-m-content .qodef-m-title { color: #fff; margin: 0; transition: color 0.2s ease-out; } .qodef-qi-call-to-action.qodef-layout--standard .qodef-m-content .qodef-m-text { color: #fff; margin: 0.8em 0 0; transition: color 0.2s ease-out; } .qodef-qi-call-to-action.qodef-layout--standard .qodef-m-button { flex: 0 0 auto; } .qodef-qi-call-to-action.qodef-layout--standard.qodef-link-overlay .qodef-m-link { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .qodef-qi-call-to-action.qodef-layout--standard.qodef-link-overlay .qodef-m-button { z-index: 1; } /* ========================================================================== Call to Action shortcode responsive styles ========================================================================== */ @media only screen and (max-width: 1024px) { .qodef-qi-call-to-action.qodef-layout--standard.qodef-button-below--1024 .qodef-m-inner { display: block; } } @media only screen and (max-width: 768px) { .qodef-qi-call-to-action.qodef-layout--standard.qodef-button-below--768 .qodef-m-inner { display: block; } } @media only screen and (max-width: 680px) { .qodef-qi-call-to-action.qodef-layout--standard.qodef-button-below--680 .qodef-m-inner { display: block; } } /* ========================================================================== Cards Gallery shortcode style - begin ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ .qodef-qi-cards-gallery { position: relative; display: inline-block; } .qodef-qi-cards-gallery .qodef-e-inner { position: relative; } .qodef-qi-cards-gallery .qodef-m-fake-card { position: relative; display: inline-block; opacity: 0; visibility: hidden; pointer-events: none; } .qodef-qi-cards-gallery .qodef-m-card { position: absolute; transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94); width: 100%; } .qodef-qi-cards-gallery.qodef-orientation--both .qodef-m-card { will-change: transform; } .qodef-qi-cards-gallery.qodef-orientation--both .qodef-m-card:nth-child(2n) { transform-origin: right; } .qodef-qi-cards-gallery.qodef-orientation--both .qodef-m-card:nth-child(2n+1) { transform-origin: left; } .qodef-qi-cards-gallery.qodef-orientation--both .qodef-m-card.qodef-out { transition: transform .5s ease-in-out, left .3s ease-in-out, right .3s ease-in-out; } .qodef-qi-cards-gallery.qodef-orientation--both .qodef-m-card:not(:last-of-type) { cursor: pointer; } .qodef-qi-cards-gallery.qodef-orientation--both .qodef-m-card:nth-child(2n):not(:last-of-type):not(.active):hover { margin-right: -10px !important; } .qodef-qi-cards-gallery.qodef-orientation--both .qodef-m-card:nth-child(2n+1):not(:last-of-type):not(.active):hover { margin-left: -10px !important; } .qodef-qi-cards-gallery.qodef-orientation--left .qodef-m-card { transform-origin: left; will-change: transform; } .qodef-qi-cards-gallery.qodef-orientation--left .qodef-m-card.qodef-out { transition: transform 0.5s ease-in-out, left 0.3s ease-in-out; } .qodef-qi-cards-gallery.qodef-orientation--left .qodef-m-card:not(:last-of-type) { cursor: pointer; } .qodef-qi-cards-gallery.qodef-orientation--left .qodef-m-card:not(:last-of-type):not(.active):hover { margin-left: -10px !important; } .qodef-qi-cards-gallery.qodef-orientation--right .qodef-m-card { transform-origin: right; will-change: transform; } .qodef-qi-cards-gallery.qodef-orientation--right .qodef-m-card.qodef-out { transition: transform 0.5s ease-in-out, right 0.3s ease-in-out; } .qodef-qi-cards-gallery.qodef-orientation--right .qodef-m-card:not(:last-of-type) { cursor: pointer; } .qodef-qi-cards-gallery.qodef-orientation--right .qodef-m-card:not(:last-of-type):not(.active):hover { margin-right: -10px !important; } /* ========================================================================== Cards Gallery shortcode responsive style - begin ========================================================================== */ @media only screen and (max-width: 768px) { .qodef-qi-cards-gallery .qodef-m-fake-card { transform: scale(0.8); } .qodef-qi-cards-gallery.qodef-orientation--left .qodef-m-card { transform: scale(0.8); } .qodef-qi-cards-gallery.qodef-orientation--left .qodef-m-card.qodef-out { transform: translateX(-100%); } .qodef-qi-cards-gallery.qodef-orientation--left .qodef-m-card:nth-last-child(6) { transform: scale(0.3) translateX(84%); } .qodef-qi-cards-gallery.qodef-orientation--left .qodef-m-card:nth-last-child(5) { transform: scale(0.4) translateX(60%); } .qodef-qi-cards-gallery.qodef-orientation--left .qodef-m-card:nth-last-child(4) { transform: scale(0.5) translateX(39%); } .qodef-qi-cards-gallery.qodef-orientation--left .qodef-m-card:nth-last-child(3) { transform: scale(0.6) translateX(25%); } .qodef-qi-cards-gallery.qodef-orientation--left .qodef-m-card:nth-last-child(2) { transform: scale(0.7) translateX(11.2%); } .qodef-qi-cards-gallery.qodef-orientation--right .qodef-m-card { transform: scale(0.8); } .qodef-qi-cards-gallery.qodef-orientation--right .qodef-m-card.qodef-out { transform: translateX(100%); } .qodef-qi-cards-gallery.qodef-orientation--right .qodef-m-card:nth-last-child(6) { transform: scale(0.3) translateX(-84%); } .qodef-qi-cards-gallery.qodef-orientation--right .qodef-m-card:nth-last-child(5) { transform: scale(0.4) translateX(-60%); } .qodef-qi-cards-gallery.qodef-orientation--right .qodef-m-card:nth-last-child(4) { transform: scale(0.5) translateX(-39%); } .qodef-qi-cards-gallery.qodef-orientation--right .qodef-m-card:nth-last-child(3) { transform: scale(0.6) translateX(-25%); } .qodef-qi-cards-gallery.qodef-orientation--right .qodef-m-card:nth-last-child(2) { transform: scale(0.7) translateX(-11.2%); } } /* ========================================================================== Cards Gallery shortcode responsive style - end ========================================================================== */ /* ========================================================================== Cards Gallery shortcode style - begin ========================================================================== */ /* ========================================================================== Cards Gallery shortcode style - begin ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ .qodef-qi-cards-slider { position: relative; } .qodef-qi-cards-slider .qodef-e-inner { position: relative; } .qodef-qi-cards-slider .qodef-m-fake-card { position: relative; display: inline-block; opacity: 0; visibility: hidden; pointer-events: none; } .qodef-qi-cards-slider .qodef-m-card { position: absolute; width: 100%; } .qodef-qi-cards-slider .qodef-m-card:not(.qodef-out):not(.qodef-in) { transition: all 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94); } .qodef-qi-cards-slider:not(.qodef-backwards) .qodef-m-card:nth-last-child(2):not(.qodef-out):not(.qodef-in) { transition-delay: 0.1s; } .qodef-qi-cards-slider:not(.qodef-backwards) .qodef-m-card:nth-last-child(3):not(.qodef-out):not(.qodef-in) { transition-delay: 0.15s; } .qodef-qi-cards-slider:not(.qodef-backwards) .qodef-m-card:nth-last-child(4):not(.qodef-out):not(.qodef-in) { transition-delay: 0.2s; } .qodef-qi-cards-slider:not(.qodef-backwards) .qodef-m-card:nth-last-child(5):not(.qodef-out):not(.qodef-in) { transition-delay: 0.25s; } .qodef-qi-cards-slider:not(.qodef-backwards) .qodef-m-card:nth-last-child(6):not(.qodef-out):not(.qodef-in) { transition-delay: 0.3s; } .qodef-qi-cards-slider:not(.qodef-backwards) .qodef-m-card:nth-last-child(7):not(.qodef-out):not(.qodef-in) { transition-delay: 0.35s; } .qodef-qi-cards-slider:not(.qodef-backwards) .qodef-m-card:nth-last-child(8):not(.qodef-out):not(.qodef-in) { transition-delay: 0.4s; } .qodef-qi-cards-slider:not(.qodef-backwards) .qodef-m-card:nth-last-child(9):not(.qodef-out):not(.qodef-in) { transition-delay: 0.45s; } .qodef-qi-cards-slider:not(.qodef-backwards) .qodef-m-card:nth-last-child(10):not(.qodef-out):not(.qodef-in) { transition-delay: 0.5s; } .qodef-qi-cards-slider:not(.qodef-backwards) .qodef-m-card:nth-last-child(11):not(.qodef-out):not(.qodef-in) { transition-delay: 0.55s; } .qodef-qi-cards-slider:not(.qodef-backwards) .qodef-m-card:nth-last-child(12):not(.qodef-out):not(.qodef-in) { transition-delay: 0.6s; } .qodef-qi-cards-slider:not(.qodef-backwards) .qodef-m-card:nth-last-child(13):not(.qodef-out):not(.qodef-in) { transition-delay: 0.65s; } .qodef-qi-cards-slider:not(.qodef-backwards) .qodef-m-card:nth-last-child(14):not(.qodef-out):not(.qodef-in) { transition-delay: 0.7s; } .qodef-qi-cards-slider:not(.qodef-backwards) .qodef-m-card:nth-last-child(15):not(.qodef-out):not(.qodef-in) { transition-delay: 0.75s; } .qodef-qi-cards-slider:not(.qodef-backwards) .qodef-m-card:nth-last-child(16):not(.qodef-out):not(.qodef-in) { transition-delay: 0.8s; } .qodef-qi-cards-slider:not(.qodef-backwards) .qodef-m-card:nth-last-child(17):not(.qodef-out):not(.qodef-in) { transition-delay: 0.85s; } .qodef-qi-cards-slider:not(.qodef-backwards) .qodef-m-card:nth-last-child(18):not(.qodef-out):not(.qodef-in) { transition-delay: 0.9s; } .qodef-qi-cards-slider:not(.qodef-backwards) .qodef-m-card:nth-last-child(19):not(.qodef-out):not(.qodef-in) { transition-delay: 0.95s; } .qodef-qi-cards-slider:not(.qodef-backwards) .qodef-m-card:nth-last-child(20):not(.qodef-out):not(.qodef-in) { transition-delay: 1s; } .qodef-qi-cards-slider.qodef-backwards .qodef-m-card:nth-child(1):not(.qodef-out):not(.qodef-in) { transition-delay: 0.05s; } .qodef-qi-cards-slider.qodef-backwards .qodef-m-card:nth-child(2):not(.qodef-out):not(.qodef-in) { transition-delay: 0.1s; } .qodef-qi-cards-slider.qodef-backwards .qodef-m-card:nth-child(3):not(.qodef-out):not(.qodef-in) { transition-delay: 0.15s; } .qodef-qi-cards-slider.qodef-backwards .qodef-m-card:nth-child(4):not(.qodef-out):not(.qodef-in) { transition-delay: 0.2s; } .qodef-qi-cards-slider.qodef-backwards .qodef-m-card:nth-child(5):not(.qodef-out):not(.qodef-in) { transition-delay: 0.25s; } .qodef-qi-cards-slider.qodef-backwards .qodef-m-card:nth-child(6):not(.qodef-out):not(.qodef-in) { transition-delay: 0.3s; } .qodef-qi-cards-slider.qodef-backwards .qodef-m-card:nth-child(7):not(.qodef-out):not(.qodef-in) { transition-delay: 0.35s; } .qodef-qi-cards-slider.qodef-backwards .qodef-m-card:nth-child(8):not(.qodef-out):not(.qodef-in) { transition-delay: 0.4s; } .qodef-qi-cards-slider.qodef-backwards .qodef-m-card:nth-child(9):not(.qodef-out):not(.qodef-in) { transition-delay: 0.45s; } .qodef-qi-cards-slider.qodef-backwards .qodef-m-card:nth-child(10):not(.qodef-out):not(.qodef-in) { transition-delay: 0.5s; } .qodef-qi-cards-slider.qodef-backwards .qodef-m-card:nth-child(11):not(.qodef-out):not(.qodef-in) { transition-delay: 0.55s; } .qodef-qi-cards-slider.qodef-backwards .qodef-m-card:nth-child(12):not(.qodef-out):not(.qodef-in) { transition-delay: 0.6s; } .qodef-qi-cards-slider.qodef-backwards .qodef-m-card:nth-child(13):not(.qodef-out):not(.qodef-in) { transition-delay: 0.65s; } .qodef-qi-cards-slider.qodef-backwards .qodef-m-card:nth-child(14):not(.qodef-out):not(.qodef-in) { transition-delay: 0.7s; } .qodef-qi-cards-slider.qodef-backwards .qodef-m-card:nth-child(15):not(.qodef-out):not(.qodef-in) { transition-delay: 0.75s; } .qodef-qi-cards-slider.qodef-backwards .qodef-m-card:nth-child(16):not(.qodef-out):not(.qodef-in) { transition-delay: 0.8s; } .qodef-qi-cards-slider.qodef-backwards .qodef-m-card:nth-child(17):not(.qodef-out):not(.qodef-in) { transition-delay: 0.85s; } .qodef-qi-cards-slider.qodef-backwards .qodef-m-card:nth-child(18):not(.qodef-out):not(.qodef-in) { transition-delay: 0.9s; } .qodef-qi-cards-slider.qodef-backwards .qodef-m-card:nth-child(19):not(.qodef-out):not(.qodef-in) { transition-delay: 0.95s; } .qodef-qi-cards-slider.qodef-backwards .qodef-m-card:nth-child(20):not(.qodef-out):not(.qodef-in) { transition-delay: 1s; } .qodef-qi-cards-slider.qodef-orientation--left .qodef-m-card { transform-origin: left; will-change: transform; } .qodef-qi-cards-slider.qodef-orientation--right .qodef-m-card { transform-origin: right; will-change: transform; } .qodef-qi-cards-slider .qodef-m-navigation { display: flex; justify-content: flex-start; width: 100%; margin-top: 30px; } .qodef-qi-cards-slider .qodef-m-navigation .qodef-nav { width: auto; height: auto; color: #111111; font-size: 26px; text-align: center; transition: color 0.2s ease-out, background-color 0.2s ease-out; cursor: pointer; } .qodef-qi-cards-slider .qodef-m-navigation .qodef-nav svg { display: block; width: 1em; height: auto; transition: background-color 0.2s ease-out, color 0.2s ease-out; stroke: currentColor; fill: currentColor; } .qodef-qi-cards-slider .qodef-m-navigation .qodef-nav.qodef--prev { margin-right: 15px; } .qodef-qi-cards-slider.qodef-navigation--hover-move .qodef--prev i, .qodef-qi-cards-slider.qodef-navigation--hover-move .qodef--prev svg, .qodef-qi-cards-slider.qodef-navigation--hover-move .qodef--next i, .qodef-qi-cards-slider.qodef-navigation--hover-move .qodef--next svg { transform: translateX(0); will-change: transform; transition: transform 0.12s ease-out, background-color 0.2s ease-out, color 0.2s ease-out; } .qodef-qi-cards-slider.qodef-navigation--hover-move .qodef--prev:hover i, .qodef-qi-cards-slider.qodef-navigation--hover-move .qodef--prev:hover svg, .qodef-qi-cards-slider.qodef-navigation--hover-move .qodef--next:hover i, .qodef-qi-cards-slider.qodef-navigation--hover-move .qodef--next:hover svg { transition: transform 0.22s cubic-bezier(0.37, 0.08, 0.02, 0.93) 0.05s, background-color 0.2s ease-out, color 0.2s ease-out; } .qodef-qi-cards-slider.qodef-navigation--hover-move .qodef--prev:hover i, .qodef-qi-cards-slider.qodef-navigation--hover-move .qodef--prev:hover svg { transform: translateX(-4px); } .qodef-qi-cards-slider.qodef-navigation--hover-move .qodef--next:hover i, .qodef-qi-cards-slider.qodef-navigation--hover-move .qodef--next:hover svg { transform: translateX(4px); } /* ========================================================================== Cards Slider shortcode responsive style - begin ========================================================================== */ /* ========================================================================== Cards Gallery shortcode style - begin ========================================================================== */ /* ========================================================================== Charts shortcode styles ========================================================================== */ .qodef-qi-charts { position: relative; visibility: hidden; } .qodef-qi-charts.qodef--init { visibility: visible; } .qodef-qi-charts .qodef-m-inner { position: relative; } .qodef-qi-charts .qodef-m-canvas-holder { display: flex; } .qodef-qi-charts .qodef-m-canvas { position: relative; width: 260px; } .qodef-qi-charts .qodef-m-title { margin: 2em 0 0; } .qodef-qi-charts .qodef-m-text { margin: 0.2em 0 0 0; } .qodef-qi-charts.qodef-chart-alignment--flex-start .qodef-m-canvas-holder { justify-content: flex-start; } .qodef-qi-charts.qodef-chart-alignment--center .qodef-m-canvas-holder { justify-content: center; } .qodef-qi-charts.qodef-chart-alignment--flex-end .qodef-m-canvas-holder { justify-content: flex-end; } /* ========================================================================== Clients list shortcode styles ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ /* ========================================================================== Global mixins ========================================================================== */ .qodef-qi-clients-list .qodef-e-inner { position: relative; display: inline-block; vertical-align: top; width: 100%; } .qodef-qi-clients-list .qodef-e-inner a { display: inline-block; } .qodef-qi-clients-list .qodef-e-inner > a { display: block; } .qodef-qi-clients-list .qodef-grid-item { text-align: center; } .qodef-qi-clients-list .qodef-e-images-holder { position: relative; display: inline-block; vertical-align: top; line-height: 0; margin: 0 0 1em; } .qodef-qi-clients-list .qodef-e-main-image { display: inline-block; width: auto; } .qodef-qi-clients-list .qodef-e-hover-image { position: absolute; top: 0; left: 0; width: auto; height: 100%; opacity: 0; } .qodef-qi-clients-list .qodef-e-hover-image img { max-height: 100%; object-fit: contain; } .qodef-qi-clients-list .qodef-e-title { margin: 0 0 .65em; } .qodef-qi-clients-list .qodef-e-text { margin: 0; } .qodef-qi-clients-list .qodef-e-icon { position: absolute; top: 10px; right: 10px; } .qodef-qi-clients-list .qodef-e-icon a { color: inherit; } .qodef-qi-clients-list .qodef-e-icon svg { width: 1em; height: auto; stroke: currentColor; fill: currentColor; } .qodef-qi-clients-list.qodef--boxed .qodef-e-inner { padding: 20px; background-color: #f6f6f6; } .qodef-qi-clients-list.qodef-border--all { border-width: 1px; border-style: solid; border-color: #ebebeb; overflow: hidden; } .qodef-qi-clients-list.qodef-border--all .qodef-grid-inner { gap: 0 !important; border-width: 0; border-style: inherit; border-color: inherit; margin-right: -1px; margin-bottom: -1px; } .qodef-qi-clients-list.qodef-border--all .qodef-grid-item { border-width: 1px; border-style: inherit; border-top-style: hidden; border-left-style: hidden; border-color: inherit; } .qodef-qi-clients-list.qodef-border--inner { margin: 0 !important; overflow: hidden; } .qodef-qi-clients-list.qodef-border--inner .qodef-grid-inner { margin: -1px -1px 0 !important; padding-right: 1px; gap: 0; } .qodef-qi-clients-list.qodef-border--inner .qodef-grid-item { margin: 0 !important; padding: 0 !important; border-top: 1px solid #ebebeb; border-left: 1px solid #ebebeb; } .qodef-qi-clients-list.qodef--hover-change-image .qodef-e-main-image, .qodef-qi-clients-list.qodef--hover-change-image .qodef-e-hover-image { will-change: opacity; transition: opacity .25s ease-in-out; } .qodef-qi-clients-list.qodef--hover-change-image .qodef-e-hover-image { opacity: 0; } .qodef-qi-clients-list.qodef--hover-change-image .qodef-e-inner:hover .qodef-e-hover-image { opacity: 1; } .qodef-qi-clients-list.qodef--hover-change-image .qodef-e-inner:hover .qodef-e-main-image { opacity: 0; } .qodef-qi-clients-list.qodef--hover-opacity .qodef-e-main-image { opacity: 1; transition: opacity 0.2s ease-out; will-change: opacity; } .qodef-qi-clients-list.qodef--hover-opacity .qodef-e-hover-image { display: none; } .qodef-qi-clients-list.qodef--hover-opacity .qodef-e-inner:hover .qodef-e-main-image { opacity: .8; } .qodef-qi-clients-list.qodef--hover-scale .qodef-e-main-image { transform: scale(1) translateZ(0); transition: transform 0.25s cubic-bezier(0.22, 0.61, 0.36, 1); } .qodef-qi-clients-list.qodef--hover-scale .qodef-e-inner:hover .qodef-e-main-image { transform: scale(1.05) translateZ(0); } .qodef-qi-clients-list.qodef--hover-roll-horizontal .qodef-e-images-holder, .qodef-qi-clients-list.qodef--hover-roll-vertical .qodef-e-images-holder { overflow: hidden; } .qodef-qi-clients-list.qodef--hover-roll-horizontal .qodef-e-main-image, .qodef-qi-clients-list.qodef--hover-roll-horizontal .qodef-e-hover-image, .qodef-qi-clients-list.qodef--hover-roll-vertical .qodef-e-main-image, .qodef-qi-clients-list.qodef--hover-roll-vertical .qodef-e-hover-image { transition: transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1); } .qodef-qi-clients-list.qodef--hover-roll-horizontal .qodef-e-hover-image, .qodef-qi-clients-list.qodef--hover-roll-vertical .qodef-e-hover-image { opacity: 1; } .qodef-qi-clients-list.qodef--hover-roll-horizontal .qodef-e-main-image { transform: translateX(0%); } .qodef-qi-clients-list.qodef--hover-roll-horizontal .qodef-e-hover-image { transform: translateX(-130%); } .qodef-qi-clients-list.qodef--hover-roll-horizontal .qodef-e-inner:hover .qodef-e-hover-image { transform: translateX(0%); } .qodef-qi-clients-list.qodef--hover-roll-horizontal .qodef-e-inner:hover .qodef-e-main-image { transform: translateX(130%); } .qodef-qi-clients-list.qodef--hover-roll-vertical .qodef-e-main-image { transform: translateY(0%); } .qodef-qi-clients-list.qodef--hover-roll-vertical .qodef-e-hover-image { transform: translateY(130%); } .qodef-qi-clients-list.qodef--hover-roll-vertical .qodef-e-inner:hover .qodef-e-hover-image { transform: translateY(0%); } .qodef-qi-clients-list.qodef--hover-roll-vertical .qodef-e-inner:hover .qodef-e-main-image { transform: translateY(-130%); } .qodef-qi-clients-list.qodef-title--hover-underline .qodef-e-title a { display: inline; position: relative; width: 100%; background-repeat: no-repeat; background-image: linear-gradient(transparent calc(100% - 0.1em), currentColor 0.1em); transition: 0.5s cubic-bezier(0.32, 0.32, 0.15, 1.17); background-size: 0 100%; } .qodef-qi-clients-list.qodef-title--hover-underline .qodef-e-inner:hover .qodef-e-title a { background-size: 100% 100%; } /* ========================================================================== Clients slider shortcode styles ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ /* ========================================================================== Global mixins ========================================================================== */ .qodef-qi-clients-slider .qodef-e-inner { position: relative; display: inline-block; vertical-align: top; width: 100%; line-height: 0; } .qodef-qi-clients-slider .qodef-e-inner a { display: inline-block; } .qodef-qi-clients-slider .qodef-e-images-holder { position: relative; display: inline-block; vertical-align: top; line-height: 0; margin: 0 0 1em; } .qodef-qi-clients-slider .qodef-e-title { margin: 0 0 .65em; } .qodef-qi-clients-slider .qodef-e-text { line-height: 1rem; } .qodef-qi-clients-slider .qodef-e-main-image { display: inline-block; width: auto; } .qodef-qi-clients-slider .qodef-e-hover-image { position: absolute; top: 0; left: 0; width: auto; height: 100%; } .qodef-qi-clients-slider .qodef-e-hover-image img { max-height: 100%; object-fit: contain; } .qodef-qi-clients-slider .qodef-e-icon { position: absolute; top: 10px; right: 10px; } .qodef-qi-clients-slider .qodef-e-icon a { color: inherit; } .qodef-qi-clients-slider .qodef-e-icon svg { width: 1em; height: auto; stroke: currentColor; fill: currentColor; } .qodef-qi-clients-slider.qodef--boxed .qodef-e-inner { padding: 20px; background-color: #f6f6f6; } .qodef-qi-clients-slider.qodef--hover-change-image .qodef-e-main-image, .qodef-qi-clients-slider.qodef--hover-change-image .qodef-e-hover-image { will-change: opacity; transition: opacity .25s ease-in-out; } .qodef-qi-clients-slider.qodef--hover-change-image .qodef-e-hover-image { opacity: 0; } .qodef-qi-clients-slider.qodef--hover-change-image .qodef-e-inner:hover .qodef-e-hover-image { opacity: 1; } .qodef-qi-clients-slider.qodef--hover-change-image .qodef-e-inner:hover .qodef-e-main-image { opacity: 0; } .qodef-qi-clients-slider.qodef--hover-opacity .qodef-e-main-image { opacity: 1; transition: opacity 0.2s ease-out; will-change: opacity; } .qodef-qi-clients-slider.qodef--hover-opacity .qodef-e-hover-image { display: none; } .qodef-qi-clients-slider.qodef--hover-opacity .qodef-e-inner:hover .qodef-e-main-image { opacity: .8; } .qodef-qi-clients-slider.qodef--hover-scale .qodef-e-main-image { transform: scale(1) translateZ(0); transition: transform 0.25s cubic-bezier(0.22, 0.61, 0.36, 1); } .qodef-qi-clients-slider.qodef--hover-scale .qodef-e-inner:hover .qodef-e-main-image { transform: scale(1.05) translateZ(0); } .qodef-qi-clients-slider.qodef--hover-roll-horizontal .qodef-e-images-holder, .qodef-qi-clients-slider.qodef--hover-roll-vertical .qodef-e-images-holder { overflow: hidden; } .qodef-qi-clients-slider.qodef--hover-roll-horizontal .qodef-e-main-image, .qodef-qi-clients-slider.qodef--hover-roll-horizontal .qodef-e-hover-image, .qodef-qi-clients-slider.qodef--hover-roll-vertical .qodef-e-main-image, .qodef-qi-clients-slider.qodef--hover-roll-vertical .qodef-e-hover-image { transition: transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1); } .qodef-qi-clients-slider.qodef--hover-roll-horizontal .qodef-e-hover-image, .qodef-qi-clients-slider.qodef--hover-roll-vertical .qodef-e-hover-image { opacity: 1; } .qodef-qi-clients-slider.qodef--hover-roll-horizontal .qodef-e-main-image { transform: translateX(0%); } .qodef-qi-clients-slider.qodef--hover-roll-horizontal .qodef-e-hover-image { transform: translateX(-130%); } .qodef-qi-clients-slider.qodef--hover-roll-horizontal .qodef-e-inner:hover .qodef-e-hover-image { transform: translateX(0%); } .qodef-qi-clients-slider.qodef--hover-roll-horizontal .qodef-e-inner:hover .qodef-e-main-image { transform: translateX(130%); } .qodef-qi-clients-slider.qodef--hover-roll-vertical .qodef-e-main-image { transform: translateY(0%); } .qodef-qi-clients-slider.qodef--hover-roll-vertical .qodef-e-hover-image { transform: translateY(130%); } .qodef-qi-clients-slider.qodef--hover-roll-vertical .qodef-e-inner:hover .qodef-e-hover-image { transform: translateY(0%); } .qodef-qi-clients-slider.qodef--hover-roll-vertical .qodef-e-inner:hover .qodef-e-main-image { transform: translateY(-130%); } .qodef-qi-clients-slider.qodef-title--hover-underline.qodef-qi-swiper-container .qodef-e .qodef-e-title a { display: inline; } .qodef-qi-clients-slider.qodef-title--hover-underline .qodef-e-title a { display: inline; position: relative; width: 100%; background-repeat: no-repeat; background-image: linear-gradient(transparent calc(100% - 0.1em), currentColor 0.1em); transition: 0.5s cubic-bezier(0.32, 0.32, 0.15, 1.17); background-size: 0 100%; } .qodef-qi-clients-slider.qodef-title--hover-underline.qodef-title--hover-long .qodef-e-title a { transition-duration: .9s; } .qodef-qi-clients-slider.qodef-title--hover-underline .qodef-e-inner:hover .qodef-e-title a { background-size: 100% 100%; } /* ========================================================================== Countdown shortcode styles ========================================================================== */ .qodef-qi-countdown .qodef-m-date { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; } .qodef-qi-countdown .qodef-digit-wrapper { position: relative; display: flex; flex-direction: column; justify-content: center; text-align: center; width: 150px; } .qodef-qi-countdown .qodef-digit { font-size: 70px; line-height: 1; } .qodef-qi-countdown .qodef-label { font-size: 20px; } /* ========================================================================== Counter shortcode styles ========================================================================== */ /* ========================================================================== Counter shortcode styles ========================================================================== */ .qodef-qi-counter.qodef-layout--simple.qodef-digit-stroke-effect .qodef-m-digit { color: transparent !important; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: #333333; text-shadow: none; } .qodef-qi-counter.qodef-layout--simple .qodef-m-digit-wrapper { position: relative; display: inline-flex; align-items: center; justify-content: center; } .qodef-qi-counter.qodef-layout--simple .qodef-m-digit { display: inline-block; font-size: 70px; line-height: 1; } .qodef-qi-counter.qodef-layout--simple .qodef-m-icon { position: absolute; top: 0; right: 0; transform: translate(100%, -50%); font-size: 20px; } .qodef-qi-counter.qodef-layout--simple .qodef-m-title { margin: .9em 0 0; } .qodef-qi-counter.qodef-layout--simple .qodef-m-text { margin: .45em 0 0; } /* ========================================================================== Device Carousel shortcode styles ========================================================================== */ .qodef-qi-device-carousel { position: relative; } .qodef-qi-device-carousel > .qodef-qi-swiper-container { padding: 30px 0; } .qodef-qi-device-carousel > .qodef-qi-swiper-container > .swiper-wrapper { align-items: center; } .qodef-qi-device-carousel .qodef-device-carousel-device { position: relative; margin: 0 auto; } .qodef-qi-device-carousel .qodef-device-carousel-device .qodef-device-carousel-device-image { position: relative; pointer-events: none; box-shadow: 0 0 20px rgba(0, 0, 0, 0.07); border-radius: 30px; z-index: 10; } .qodef-qi-device-carousel .qodef-device-carousel-device .qodef-device-carousel-device-image img { width: 100%; } .qodef-qi-device-carousel .qodef-device-carousel-device .qodef-m-items { position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: -1; } .qodef-qi-device-carousel .qodef-device-carousel-device .qodef-qi-swiper-container { overflow: hidden; height: 100%; padding: 0 !important; } .qodef-qi-device-carousel .qodef-device-carousel-device .qodef-m-item { height: 100%; } .qodef-qi-device-carousel .qodef-device-carousel-device .qodef-m-item img { height: 100%; object-fit: cover; } /* ========================================================================== Device Slider shortcode style - begin ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ .qodef-qi-device-slider { position: relative; margin: auto; } .qodef-qi-device-slider .qodef-device-slider-image { position: relative; pointer-events: none; z-index: 10; } .qodef-qi-device-slider .qodef-device-slider-image img { width: 100%; } .qodef-frame-shadow--enabled.qodef-qi-device-slider .qodef-device-slider-image img { filter: drop-shadow(0px 6px 16.8px rgba(0, 0, 0, 0.07)); } .qodef-qi-device-slider .qodef-m-items { position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 5; } .qodef-qi-device-slider .qodef-qi-swiper-container { overflow: hidden; height: 100%; } .qodef-qi-device-slider .qodef-m-item { height: 100%; } .qodef-qi-device-slider .qodef-m-item a { height: 100%; } .qodef-qi-device-slider .qodef-m-item img { height: 100%; object-fit: cover; } /* ========================================================================== Device Slider shortcode responsive style - begin ========================================================================== */ @media only screen and (max-width: 1024px) { .qodef-device-slider-holder { margin-bottom: 96px; } .qodef-device-slider-holder .swiper-pagination-bullets { bottom: -96px !important; } } @media only screen and (max-width: 768px) { .qodef-device-slider-holder { margin-bottom: 86px; } .qodef-device-slider-holder .swiper-pagination-bullets { bottom: -86px !important; } } @media only screen and (max-width: 680px) { .qodef-device-slider-holder { margin-bottom: 76px; } .qodef-device-slider-holder .swiper-pagination-bullets { bottom: -76px !important; } } @media only screen and (max-width: 480px) { .qodef-device-slider-holder { margin-bottom: 46px; } .qodef-device-slider-holder .swiper-pagination-bullets { bottom: -46px !important; } } /* ========================================================================== Device Slider shortcode responsive style - end ========================================================================== */ /* ========================================================================== Device Slider shortcode style - end ========================================================================== */ /* ========================================================================== Dropcaps shortcode styles ========================================================================== */ .qodef-qi-dropcaps { position: relative; } .qodef-qi-dropcaps.qodef-letter-stroke-effect .qodef-m-letter { color: transparent !important; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: #333333; text-shadow: none; } .qodef-qi-dropcaps.qodef-letter-clip-effect .qodef-m-letter { -webkit-background-clip: text; -webkit-text-fill-color: transparent; } body.e--ua-safari .qodef-qi-dropcaps.qodef-letter-clip-effect .qodef-m-letter { display: block; } .qodef-qi-dropcaps .qodef-m-letter { float: left; font-size: 60px; line-height: 1em; width: 1em; height: 1em; display: inline-flex; align-items: center; justify-content: center; } .qodef-qi-dropcaps .qodef-m-text { margin: 0; } /* ========================================================================== Dual Image with Content shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ .qodef-qi-dual-image-with-content { position: relative; display: flex; } .qodef-qi-dual-image-with-content.qodef--content-right { flex-direction: row-reverse; } .qodef-qi-dual-image-with-content .qodef-dual-content { display: flex; width: 50%; flex-direction: column; align-items: flex-start; justify-content: space-between; padding: 100px; background-color: #f6f6f6; } .qodef-qi-dual-image-with-content .qodef-m-inner-content > .qodef-m-title { margin: 0 0 .5em; } .qodef-qi-dual-image-with-content .qodef-m-inner-content > .qodef-m-text { margin: 0 0 .5em; } .qodef-qi-dual-image-with-content .qodef-m-inner-bottom { width: 100%; } .qodef-qi-dual-image-with-content .qodef-m-content-shortcode { position: relative; } .qodef-qi-dual-image-with-content .qodef-image-holder { --holder_height: auto; position: relative; flex: 1; height: var(--holder_height); } .qodef-qi-dual-image-with-content .qodef-m-main-image { width: 100%; height: 100%; } .qodef-qi-dual-image-with-content .qodef-m-main-image img { height: 100%; object-fit: cover; } .qodef-qi-dual-image-with-content .qodef-m-second-image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; } .qodef-qi-dual-image-with-content.qodef-decoration--underline .qodef-e-decorated { text-decoration: underline; } .qodef-qi-dual-image-with-content.qodef-decoration--italic .qodef-e-decorated { font-style: italic; } .qodef-qi-dual-image-with-content.qodef-decoration--bold .qodef-e-decorated { font-weight: 700; } .qodef-qi-dual-image-with-content.qodef-link--underline-draw .qodef-e-link { color: currentColor; width: 100%; background-repeat: no-repeat; background-image: linear-gradient(transparent calc(100% - .07em), currentColor 0.07em); background-size: 100% 87%; } .qodef-qi-dual-image-with-content.qodef-link--underline-draw .qodef-e-link:hover { animation: qodef-animate-underline-multiline 1.1s cubic-bezier(0.32, 0.32, 0.15, 1.17) forwards; } .qodef-qi-dual-image-with-content.qodef-qi--has-appear.qodef--content-left .qodef-dual-content + .qodef-image-holder .qodef-m-main-image img { transform: scale(1) translateX(14px); } .qodef-qi-dual-image-with-content.qodef-qi--has-appear.qodef--content-right .qodef-dual-content + .qodef-image-holder .qodef-m-main-image img { transform: scale(1) translateX(-14px); } .qodef-qi-dual-image-with-content.qodef-qi--has-appear.qodef--content-left .qodef-dual-content + .qodef-image-holder, .qodef-qi-dual-image-with-content.qodef-qi--has-appear.qodef--content-right .qodef-dual-content + .qodef-image-holder { overflow: hidden; } .qodef-qi-dual-image-with-content.qodef-qi--has-appear.qodef--content-left .qodef-dual-content + .qodef-image-holder .qodef-m-main-image, .qodef-qi-dual-image-with-content.qodef-qi--has-appear.qodef--content-right .qodef-dual-content + .qodef-image-holder .qodef-m-main-image { display: flex; justify-content: center; } .qodef-qi-dual-image-with-content.qodef-qi--has-appear.qodef--content-left .qodef-dual-content + .qodef-image-holder .qodef-m-main-image img, .qodef-qi-dual-image-with-content.qodef-qi--has-appear.qodef--content-right .qodef-dual-content + .qodef-image-holder .qodef-m-main-image img { display: inline-block; max-width: unset; transition: transform 1.3s cubic-bezier(0.37, 0.08, 0.02, 0.93) 0ms; } .qodef-qi-dual-image-with-content.qodef-qi--has-appear.qodef--content-left.qodef-qi--appeared .qodef-dual-content + .qodef-image-holder .qodef-m-main-image img, .qodef-qi-dual-image-with-content.qodef-qi--has-appear.qodef--content-right.qodef-qi--appeared .qodef-dual-content + .qodef-image-holder .qodef-m-main-image img { transform: scale(1) translateX(0%); } /* ========================================================================== Dual Image with Content shortcode styles ========================================================================== */ @media only screen and (max-width: 1440px) { .qodef-qi-dual-image-with-content .qodef-image-holder { height: var(--holder_height_1440); } } @media only screen and (max-width: 1366px) { .qodef-qi-dual-image-with-content .qodef-image-holder { height: var(--holder_height_1366); } } @media only screen and (max-width: 1280px) { .qodef-qi-dual-image-with-content .qodef-image-holder { height: var(--holder_height_1280); } } @media only screen and (max-width: 1024px) { .qodef-qi-dual-image-with-content .qodef-image-holder { height: var(--holder_height_1024); } } @media only screen and (max-width: 768px) { .qodef-qi-dual-image-with-content .qodef-image-holder { height: var(--holder_height_768); } } @media only screen and (max-width: 680px) { .qodef-qi-dual-image-with-content .qodef-image-holder { height: var(--holder_height_680); } } @media only screen and (max-width: 1024px) { .qodef-qi-dual-image-with-content { flex-direction: column; } .qodef-qi-dual-image-with-content.qodef--content-right { flex-direction: column; } .qodef-qi-dual-image-with-content .qodef-dual-content { width: 100%; } .qodef-qi-dual-image-with-content .qodef-m-second-image { position: relative; padding: 7% 0%; } .qodef-qi-dual-image-with-content .qodef-m-main-image { position: absolute; } .qodef-qi-dual-image-with-content .qodef-image-holder { flex-basis: auto; } .qodef-qi-dual-image-with-content.qodef-qi--has-appear.qodef--content-left .qodef-dual-content + .qodef-image-holder .qodef-m-main-image, .qodef-qi-dual-image-with-content.qodef-qi--has-appear.qodef--content-right .qodef-dual-content + .qodef-image-holder .qodef-m-main-image { flex-flow: column; align-items: center; } .qodef-qi-dual-image-with-content.qodef-qi--has-appear.qodef--content-left .qodef-dual-content + .qodef-image-holder .qodef-m-main-image img, .qodef-qi-dual-image-with-content.qodef-qi--has-appear.qodef--content-right .qodef-dual-content + .qodef-image-holder .qodef-m-main-image img { max-width: 160%; } } /* ========================================================================== FAQ shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ .qodef-qi-faq { position: relative; display: inline-block; width: 100%; vertical-align: top; } .qodef-qi-faq.qodef-behavior--accordion { opacity: 0; overflow-anchor: none; } .qodef-qi-faq.qodef-behavior--accordion.qodef--init { opacity: 1; } .qodef-qi-faq.qodef-behavior--accordion .qodef-e-title-holder { cursor: pointer; } .qodef-qi-faq .qodef-e-content-inner { position: relative; display: inline-block; width: 100%; vertical-align: top; } .qodef-qi-faq .qodef-e-icon > svg { width: 1em; fill: currentColor; stroke: currentColor; } .qodef-qi-faq .qodef-e-title-holder { position: relative; display: flex; align-items: center; justify-content: space-between; padding: 26px 10px 26px 26px; transition: all .2s ease-out; margin: 0; } .qodef-qi-faq .qodef-e-title-holder:not(:first-child) { margin: 12px 0 0; } .qodef-qi-faq .qodef-e-title-holder .qodef-e-title { display: inline-flex; } .qodef-qi-faq .qodef-e-title-holder .qodef-e-mark { position: relative; flex-shrink: 0; width: 20px; height: 18px; line-height: 1; text-align: center; } .qodef-qi-faq .qodef-e-title-holder .qodef-e-mark span { position: absolute; display: flex; align-items: center; justify-content: center; top: 0; right: 0; height: 100%; transition: opacity .2s ease-out, color .2s ease-out; } .qodef-qi-faq .qodef-e-title-holder .qodef-e-mark span:before { display: block; line-height: inherit; } .qodef-qi-faq .qodef-e-title-holder .qodef-e-mark span.qodef-icon--minus { opacity: 0; } .qodef-qi-faq .qodef-e-title-holder .qodef-e-mark span.qodef-icon--plus { opacity: 1; } .qodef-qi-faq .qodef-e-title-holder.ui-state-active .qodef-e-mark span.qodef-icon--minus { opacity: 1; } .qodef-qi-faq .qodef-e-title-holder.ui-state-active .qodef-e-mark span.qodef-icon--plus { opacity: 0; } .qodef-qi-faq .qodef-e-title-holder.ui-state-active.ui-state-hover .qodef-e-mark span.qodef-icon--plus { opacity: 0; } .qodef-qi-faq .qodef-e-title-holder .qodef-e-number { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; margin-right: 8px; } .qodef-qi-faq .qodef-e-content { padding: 0 26px 16px; margin: 0; transition: background-color .2s ease-out; } .qodef-qi-faq .qodef-e-content p { margin: 0; } .qodef-qi-faq.qodef-style--standard .qodef-e-content { padding: 16px 26px; } .qodef-qi-faq.qodef-style--standard .qodef-e-title-holder { background-color: #f6f6f6; border-bottom: 1px solid #ebebeb; } .qodef-qi-faq.qodef-style--standard .qodef-e-title-holder.ui-state-active { background-color: #f6f6f6; } .qodef-qi-faq.qodef-style--standard .qodef-e-title-holder:not(:first-child) { margin: 0; } .qodef-qi-faq.qodef-style--standard .qodef-e-title-holder.ui-accordion-header-collapsed:nth-last-child(2) { border-color: transparent !important; } .qodef-qi-faq.qodef-style--standard .qodef-e-content { border-bottom: 1px solid #ebebeb; } .qodef-qi-faq.qodef-style--boxed { border: 1px solid #ebebeb; } .qodef-qi-faq.qodef-style--boxed .qodef-e-title-holder:not(:first-child) { margin: 0; border-top: 1px solid #ebebeb; } .qodef-qi-faq.qodef-style--border-between .qodef-e-title-holder { margin: 0; border-top: 1px solid #ebebeb; } .qodef-qi-faq.qodef-style--border-between .qodef-e-title-holder:first-child { border-top: none; } /* ========================================================================== FAQ shortcode styles ========================================================================== */ /* ========================================================================== Graphs shortcode styles ========================================================================== */ .qodef-qi-graphs { position: relative; visibility: hidden; } .qodef-qi-graphs.qodef--init { visibility: visible; } .qodef-qi-graphs .qodef-m-inner { position: relative; } .qodef-qi-graphs .qodef-m-canvas-holder { display: flex; } .qodef-qi-graphs .qodef-m-canvas { position: relative; width: 100%; } .qodef-qi-graphs.qodef-chart-alignment--flex-start .qodef-m-canvas-holder { justify-content: flex-start; } .qodef-qi-graphs.qodef-chart-alignment--center .qodef-m-canvas-holder { justify-content: center; } .qodef-qi-graphs.qodef-chart-alignment--flex-end .qodef-m-canvas-holder { justify-content: flex-end; } /* ========================================================================== Highlight shortcode styles ========================================================================== */ .qodef-qi-highlight { margin: 0 !important; } .qodef-qi-highlight .qodef-highlight-text { padding: 0px; color: #fff; background-repeat: no-repeat; } .qodef-qi-highlight.qodef-qi--has-appear .qodef-highlight-text { background-size: 0 100%; background-position-x: left; } .qodef-qi-highlight.qodef-qi--has-appear.qodef-qi--appeared.qodef-highlight-style--color .qodef-highlight-text { animation: qodef-animate-highlight 1.1s cubic-bezier(0.32, 0.32, 0.15, 1.17) forwards; } .qodef-qi-highlight.qodef-qi--has-appear.qodef-qi--appeared.qodef-highlight-style--color .qodef-highlight-text:nth-of-type(2n+2) { animation-delay: .2s; } /* ========================================================================== How To shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ .qodef-qi-how-to { position: relative; display: inline-block; width: 100%; vertical-align: top; } .qodef-qi-how-to .qodef-m-title { margin: .35em 0 0; } .qodef-qi-how-to .qodef-m-text { margin: 1.2em 0 0; } .qodef-qi-how-to .qodef-m-title-holder { margin-bottom: 2.5em; } .qodef-qi-how-to .qodef-e-step { margin-bottom: 30px; } .qodef-qi-how-to .qodef-e-step-title { margin: 0 0 0.8em; } .qodef-qi-how-to .qodef-e-step-text { margin: 0 0 1em; } .qodef-qi-how-to .qodef-e-step-image { display: inline-block; vertical-align: top; } /* ========================================================================== Icon With Text shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ /* ========================================================================== Global mixins ========================================================================== */ .qodef-qi-icon-with-text .qodef-m-title { margin: 0; } .qodef-qi-icon-with-text .qodef-m-title a { display: block; color: inherit; } .qodef-qi-icon-with-text .qodef-m-content > .qodef-m-text { margin: .5em 0 0; } .qodef-qi-icon-with-text .qodef-m-button { margin: 1.5em 0 0; } .qodef-qi-icon-with-text .qodef-m-icon-holder { font-size: 1.4em; line-height: 1; transition: color .25s ease-in-out, background-color .25s ease-in-out, border-color .25s ease-in-out; } .qodef-qi-icon-with-text .qodef-m-icon-holder i { vertical-align: top; color: inherit; } .qodef-qi-icon-with-text .qodef-m-icon-holder svg { width: 1em; height: auto; vertical-align: top; fill: currentColor; stroke: currentColor; overflow: visible; } .qodef-qi-icon-with-text.qodef-icon-boxed .qodef-m-icon-holder { display: inline-flex; align-items: center; justify-content: center; width: 3em; height: 3em; background-color: #c4c4c4; border: 1px solid transparent; } .qodef-qi-icon-with-text .qodef-m-content { position: relative; display: inline-block; width: 100%; vertical-align: top; } .qodef-qi-icon-with-text .qodef-m-separator .qodef-m-line { width: 60px; } .qodef-qi-icon-with-text.qodef--custom-icon .qodef-m-icon-wrapper { position: relative; display: inline-block; vertical-align: top; } .qodef-qi-icon-with-text.qodef--custom-icon .qodef-m-icon-wrapper a, .qodef-qi-icon-with-text.qodef--custom-icon .qodef-m-icon-wrapper img { display: block; } .qodef-qi-icon-with-text.qodef--appear-from-bottom { opacity: 0; transform: translateY(50px); transition: opacity .25s, transform .35s ease-out; } .qodef-qi-icon-with-text.qodef--appear-from-bottom.qodef-qi--appeared { opacity: 1; transform: translateY(0); } .qodef-qi-icon-with-text.qodef--appear-from-top { opacity: 0; transform: translateY(-50px); transition: opacity .25s, transform .35s ease-out; } .qodef-qi-icon-with-text.qodef--appear-from-top.qodef-qi--appeared { opacity: 1; transform: translateY(0); } .qodef-qi-icon-with-text.qodef--appear-from-left { opacity: 0; transform: translateX(-50px); transition: opacity .25s, transform .35s ease-out; } .qodef-qi-icon-with-text.qodef--appear-from-left.qodef-qi--appeared { opacity: 1; transform: translateX(0); } .qodef-qi-icon-with-text.qodef--appear-from-right { opacity: 0; transform: translateX(50px); transition: opacity .25s, transform .35s ease-out; } .qodef-qi-icon-with-text.qodef--appear-from-right.qodef-qi--appeared { opacity: 1; transform: translateX(0); } .qodef-qi-icon-with-text.qodef--appear-fade { opacity: 0; transition: opacity .7s ease-out; } .qodef-qi-icon-with-text.qodef--appear-fade.qodef-qi--appeared { opacity: 1; } .qodef-qi-icon-with-text.qodef-icon--hover-move-horizontal .qodef-m-icon-holder i, .qodef-qi-icon-with-text.qodef-icon--hover-move-horizontal .qodef-m-icon-holder svg { transform: translateX(0); transition: transform 0.28s cubic-bezier(0.22, 0.61, 0.36, 1); } .qodef-qi-icon-with-text.qodef-icon--hover-move-horizontal:hover .qodef-m-icon-holder i, .qodef-qi-icon-with-text.qodef-icon--hover-move-horizontal:hover .qodef-m-icon-holder svg { transform: translateX(4px); } .qodef-qi-icon-with-text.qodef-icon--hover-move-vertical .qodef-m-icon-holder i, .qodef-qi-icon-with-text.qodef-icon--hover-move-vertical .qodef-m-icon-holder svg { transform: translateY(0); transition: transform 0.32s cubic-bezier(0.22, 0.61, 0.36, 1); } .qodef-qi-icon-with-text.qodef-icon--hover-move-vertical:hover .qodef-m-icon-holder i, .qodef-qi-icon-with-text.qodef-icon--hover-move-vertical:hover .qodef-m-icon-holder svg { transform: translateY(-7px); } .qodef-qi-icon-with-text.qodef-icon--hover-scale .qodef-m-icon-holder i, .qodef-qi-icon-with-text.qodef-icon--hover-scale .qodef-m-icon-holder svg { transform: scale(1) translateZ(0); transition: transform 0.3s cubic-bezier(0.22, 0.61, 0.36, 1); will-change: transform; } .qodef-qi-icon-with-text.qodef-icon--hover-scale:hover .qodef-m-icon-holder i, .qodef-qi-icon-with-text.qodef-icon--hover-scale:hover .qodef-m-icon-holder svg { transform: scale(1.17) translateZ(0); } /* ========================================================================== Icon With Text shortcode styles ========================================================================== */ .qodef-qi-icon-with-text.qodef-layout--before-content { display: flex; align-items: flex-start; } .qodef-qi-icon-with-text.qodef-layout--before-content .qodef-m-icon-wrapper { flex-shrink: 0; margin-right: .7em; } @media only screen and (max-width: 768px) { .qodef-qi-icon-with-text.qodef-layout--before-content.qodef-column-responsive--768 { flex-direction: column; } } @media only screen and (max-width: 680px) { .qodef-qi-icon-with-text.qodef-layout--before-content.qodef-column-responsive--680 { flex-direction: column; } } @media only screen and (max-width: 480px) { .qodef-qi-icon-with-text.qodef-layout--before-content.qodef-column-responsive--480 { flex-direction: column; } } /* ========================================================================== Icon With Text shortcode styles ========================================================================== */ .qodef-qi-icon-with-text.qodef-layout--before-title .qodef-m-title { line-height: 1; } .qodef-qi-icon-with-text.qodef-layout--before-title .qodef-m-title a { transition: color 0.2s ease-out; } .qodef-qi-icon-with-text.qodef-layout--before-title .qodef-m-title-inner { display: flex; align-items: center; } .qodef-qi-icon-with-text.qodef-layout--before-title .qodef-m-icon-wrapper { flex-shrink: 0; margin-right: .15em; transition: color 0.2s ease-out; } /* ========================================================================== Icon With Text shortcode styles ========================================================================== */ .qodef-qi-icon-with-text.qodef-layout--top.qodef-alignment--center { text-align: center; } .qodef-qi-icon-with-text.qodef-layout--top.qodef-alignment--left { text-align: left; } .qodef-qi-icon-with-text.qodef-layout--top.qodef-alignment--right { text-align: right; } .qodef-qi-icon-with-text.qodef-layout--top .qodef-m-title { margin-top: 1.3em; } .qodef-qi-icon-with-text.qodef-layout--top .qodef-m-separator + .qodef-m-title { margin: 0; } /* ========================================================================== Image Gallery Masonry shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Global mixins ========================================================================== */ .qodef-qi-image-gallery-masonry.qodef-qi-grid > .qodef-grid-inner { gap: 24px; } .qodef-qi-image-gallery-masonry.qodef-qi-grid.qodef-layout--qi-masonry.qodef-items--fixed .qodef-image-wrapper img { object-fit: cover; } .qodef-qi-image-gallery-masonry .qodef-e-inner { position: relative; overflow: hidden; } .qodef-qi-image-gallery-masonry .qodef-e-inner:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: transparent; transition: background-color .35s ease-out; pointer-events: none; } .qodef-qi-image-gallery-masonry.qodef-image--hover-zoom .qodef-e-inner img { display: block; width: calc(100% + 2px); transform: scale(1.005) translateZ(0); transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); will-change: transform; } .qodef-qi-image-gallery-masonry.qodef-image--hover-zoom .qodef-e:hover .qodef-e-inner img { transform: scale(1.03); } .qodef-qi-image-gallery-masonry.qodef-image--hover-zoom-out .qodef-e-inner img { display: block; width: calc(100% + 2px); transform: scale(1.03) translateZ(0); transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); will-change: transform; } .qodef-qi-image-gallery-masonry.qodef-image--hover-zoom-out .qodef-e:hover .qodef-e-inner img { transform: scale(1); } .qodef-qi-image-gallery-masonry.qodef-image--hover-move .qodef-e-inner img { display: block; width: calc(100% + 2px); transform: scale(1.2); transition: transform 0.5s cubic-bezier(0.33, 0.02, 0, 0.93); will-change: transform; } .qodef-qi-image-gallery-masonry.qodef-image--hover-move .qodef-e:hover .qodef-e-inner img { transform: scale(1.2) translateX(12px); } .qodef-qi-image-gallery-masonry.qodef-image--hover-from-top .qodef-e-inner img { transform-origin: top; } .qodef-qi-image-gallery-masonry.qodef-image--hover-from-bottom .qodef-e-inner img { transform-origin: bottom; } .qodef-qi-image-gallery-masonry.qodef-image--hover-from-left .qodef-e-inner img { transform-origin: left; } .qodef-qi-image-gallery-masonry.qodef-image--hover-from-right .qodef-e-inner img { transform-origin: right; } /* ========================================================================== Image Gallery Pinterest shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Global mixins ========================================================================== */ .qodef-qi-image-gallery-pinterest .qodef-e-inner { position: relative; overflow: hidden; } .qodef-qi-image-gallery-pinterest .qodef-e-inner:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: transparent; transition: background-color .35s ease-out; pointer-events: none; } .qodef-qi-image-gallery-pinterest.qodef-image--hover-zoom .qodef-e-inner img { display: block; width: calc(100% + 2px); transform: scale(1.005) translateZ(0); transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); will-change: transform; } .qodef-qi-image-gallery-pinterest.qodef-image--hover-zoom .qodef-e:hover .qodef-e-inner img { transform: scale(1.03); } .qodef-qi-image-gallery-pinterest.qodef-image--hover-zoom-out .qodef-e-inner img { display: block; width: calc(100% + 2px); transform: scale(1.03) translateZ(0); transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); will-change: transform; } .qodef-qi-image-gallery-pinterest.qodef-image--hover-zoom-out .qodef-e:hover .qodef-e-inner img { transform: scale(1); } .qodef-qi-image-gallery-pinterest.qodef-image--hover-move .qodef-e-inner img { display: block; width: calc(100% + 2px); transform: scale(1.2); transition: transform 0.5s cubic-bezier(0.33, 0.02, 0, 0.93); will-change: transform; } .qodef-qi-image-gallery-pinterest.qodef-image--hover-move .qodef-e:hover .qodef-e-inner img { transform: scale(1.2) translateX(12px); } .qodef-qi-image-gallery-pinterest.qodef-image--hover-from-top .qodef-e-inner img { transform-origin: top; } .qodef-qi-image-gallery-pinterest.qodef-image--hover-from-bottom .qodef-e-inner img { transform-origin: bottom; } .qodef-qi-image-gallery-pinterest.qodef-image--hover-from-left .qodef-e-inner img { transform-origin: left; } .qodef-qi-image-gallery-pinterest.qodef-image--hover-from-right .qodef-e-inner img { transform-origin: right; } /* ========================================================================== Image Gallery shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Global mixins ========================================================================== */ .qodef-qi-image-gallery .qodef-e-inner { position: relative; overflow: hidden; } .qodef-qi-image-gallery .qodef-e-inner:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: transparent; transition: background-color .35s ease-out; pointer-events: none; } .qodef-qi-image-gallery.qodef-image--hover-zoom .qodef-e-inner img { display: block; width: calc(100% + 2px); transform: scale(1.01) translateZ(0); transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); will-change: transform; } .qodef-qi-image-gallery.qodef-image--hover-zoom .qodef-e:hover .qodef-e-inner img { transform: scale(1.03); } .qodef-qi-image-gallery.qodef-image--hover-zoom-out .qodef-e-inner img { display: block; width: calc(100% + 2px); transform: scale(1.03) translateZ(0); transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); will-change: transform; } .qodef-qi-image-gallery.qodef-image--hover-zoom-out .qodef-e:hover .qodef-e-inner img { transform: scale(1); } .qodef-qi-image-gallery.qodef-image--hover-move .qodef-e-inner img { display: block; width: calc(100% + 2px); transform: scale(1.2); transition: transform 0.5s cubic-bezier(0.33, 0.02, 0, 0.93); will-change: transform; } .qodef-qi-image-gallery.qodef-image--hover-move .qodef-e:hover .qodef-e-inner img { transform: scale(1.2) translateX(12px); } .qodef-qi-image-gallery.qodef-image--hover-from-top .qodef-e-inner img { transform-origin: top; } .qodef-qi-image-gallery.qodef-image--hover-from-bottom .qodef-e-inner img { transform-origin: bottom; } .qodef-qi-image-gallery.qodef-image--hover-from-left .qodef-e-inner img { transform-origin: left; } .qodef-qi-image-gallery.qodef-image--hover-from-right .qodef-e-inner img { transform-origin: right; } /* ========================================================================== Image slider shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Global mixins ========================================================================== */ .qodef-qi-image-slider .qodef-e { overflow: hidden; backface-visibility: hidden; } .qodef-qi-image-slider .qodef-e-inner { position: relative; overflow: hidden; } .qodef-qi-image-slider .qodef-e-inner:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: transparent; transition: background-color .35s ease-out; pointer-events: none; } .qodef-qi-image-slider .qodef-e-inner-holder { position: relative; overflow: hidden; } .qodef-qi-image-slider .qodef-e-alt-text-holder { display: flex; visibility: hidden; opacity: 0; transition: all 0.3s ease-in; } .qodef-col-num--1.qodef-navigation-alignment--flex-start.qodef-qi-image-slider .qodef-e-alt-text-holder { justify-content: flex-end; } .qodef-col-num--1.qodef-navigation-alignment--flex-end.qodef-qi-image-slider .qodef-e-alt-text-holder { justify-content: flex-start; } .qodef-qi-image-slider .swiper-slide-active .qodef-e-alt-text-holder { visibility: visible; opacity: 1; } .qodef-qi-image-slider .qodef-e-alt-text { margin-top: 10px; } .qodef-qi-image-slider.qodef-image--hover-zoom .qodef-e-inner-holder { display: block; width: calc(100% - 1px); transform: scale(1.02) translateZ(0); transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); will-change: transform; } .qodef-qi-image-slider.qodef-image--hover-zoom .qodef-e:hover .qodef-e-inner-holder { transform: scale(1.05); } .qodef-qi-image-slider.qodef-image--hover-zoom-out .qodef-e-inner-holder { display: block; width: calc(100% + 2px); transform: scale(1.03) translateZ(0); transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); will-change: transform; } .qodef-qi-image-slider.qodef-image--hover-zoom-out .qodef-e:hover .qodef-e-inner-holder { transform: scale(1); } .qodef-qi-image-slider.qodef-image--hover-move .qodef-e-inner-holder { display: block; width: calc(100% + 2px); transform: scale(1.2); transition: transform 0.5s cubic-bezier(0.33, 0.02, 0, 0.93); will-change: transform; } .qodef-qi-image-slider.qodef-image--hover-move .qodef-e:hover .qodef-e-inner-holder { transform: scale(1.2) translateX(12px); } .qodef-qi-image-slider.qodef-image--hover-from-top .qodef-e-inner-holder { transform-origin: top; } .qodef-qi-image-slider.qodef-image--hover-from-bottom .qodef-e-inner-holder { transform-origin: bottom; } .qodef-qi-image-slider.qodef-image--hover-from-left .qodef-e-inner-holder { transform-origin: left; } .qodef-qi-image-slider.qodef-image--hover-from-right .qodef-e-inner-holder { transform-origin: right; } .qodef-qi-image-slider.qodef--centered-zoom .swiper-slide { transform: scale(0.85); transition: all .3s ease; } .qodef-qi-image-slider.qodef--centered-zoom .swiper-slide.swiper-slide-active, .qodef-qi-image-slider.qodef--centered-zoom .swiper-slide.swiper-slide-duplicate-active { transform: scale(1); } /* ========================================================================== Info button shortcode styles ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ /* ========================================================================== Button mixins - start ========================================================================== */ /* ========================================================================== Button mixins - end ========================================================================== */ /* ========================================================================== Animation mixins - start ========================================================================== */ /* ========================================================================== Animation mixins - end ========================================================================== */ .qodef-qi-info-button { position: relative; display: inline-block; vertical-align: middle; width: auto; margin: 0; font-family: inherit; font-size: 16px; line-height: 2em; font-weight: 500; text-decoration: none; text-transform: none; border-radius: 4px; outline: none; transition: color 0.25s ease-in-out, background-color 0.25s ease-in-out, border-color 0.25s ease-in-out; padding: 11px 28px; display: inline-flex; flex-direction: column; align-items: flex-start; justify-content: center; line-height: 1.2em; overflow: hidden; } .qodef-qi-info-button .qodef-m-text-holder { display: flex; align-items: center; } .qodef-qi-info-button .qodef-m-subtext { font-size: .75em; } .qodef-qi-info-button .qodef-m-subtext.qodef--subtext-color-set { transition: color .25s ease-in-out; } .qodef-qi-info-button.qodef-size--small { padding: 6px 24px; } .qodef-qi-info-button.qodef-size--large { padding: 11px 36px; } .qodef-qi-info-button.qodef-size--full { width: 100%; text-align: center; } .qodef-qi-info-button.qodef-layout--filled { color: #111111; background-color: #f4f4f4; border: 0; font-size: 1rem; border-style: solid; } .qodef-qi-info-button.qodef-layout--filled:hover { color: #fff; background-color: #111111; } .qodef-qi-info-button.qodef-layout--outlined { color: #111111; background-color: transparent; border: 2px solid #111111; } .qodef-qi-info-button.qodef-layout--outlined:hover { color: #111111; background-color: #f4f4f4; border-color: #f4f4f4; } .qodef-qi-info-button.qodef-icon--left .qodef-m-text-holder { flex-direction: row-reverse; } .qodef-qi-info-button .qodef-m-icon { color: currentColor; } .qodef-qi-info-button .qodef-m-icon.qodef--icon-color-set { transition: color .25s ease-in-out, background-color .25s ease-in-out; } .qodef-qi-info-button .qodef-m-icon svg { width: 1em; fill: currentColor; stroke: currentColor; } .qodef-qi-info-button.qodef-icon--right:not(.qodef-type--icon-boxed) .qodef-m-icon i, .qodef-qi-info-button.qodef-icon--right:not(.qodef-type--icon-boxed) .qodef-m-icon svg { margin-left: 10px; } .qodef-qi-info-button.qodef-icon--left:not(.qodef-type--icon-boxed) .qodef-m-icon i, .qodef-qi-info-button.qodef-icon--left:not(.qodef-type--icon-boxed) .qodef-m-icon svg { margin-right: 10px; } .qodef-qi-info-button.qodef-hover--icon-move-horizontal .qodef-m-icon-inner, .qodef-qi-info-button.qodef-hover--icon-move-vertical .qodef-m-icon-inner, .qodef-qi-info-button.qodef-hover--icon-move-diagonal .qodef-m-icon-inner { position: relative; overflow: hidden; display: inherit; padding: 1px; } .qodef-qi-info-button.qodef-hover--icon-move-horizontal .qodef-m-icon-inner i, .qodef-qi-info-button.qodef-hover--icon-move-horizontal .qodef-m-icon-inner svg, .qodef-qi-info-button.qodef-hover--icon-move-vertical .qodef-m-icon-inner i, .qodef-qi-info-button.qodef-hover--icon-move-vertical .qodef-m-icon-inner svg, .qodef-qi-info-button.qodef-hover--icon-move-diagonal .qodef-m-icon-inner i, .qodef-qi-info-button.qodef-hover--icon-move-diagonal .qodef-m-icon-inner svg { transition: transform 0.38s cubic-bezier(0.37, 0.08, 0.02, 0.93), opacity 0.18s ease-in-out; will-change: transform; } .qodef-qi-info-button.qodef-hover--icon-move-horizontal .qodef-m-icon-inner i:nth-child(1), .qodef-qi-info-button.qodef-hover--icon-move-horizontal .qodef-m-icon-inner svg:nth-child(1), .qodef-qi-info-button.qodef-hover--icon-move-vertical .qodef-m-icon-inner i:nth-child(1), .qodef-qi-info-button.qodef-hover--icon-move-vertical .qodef-m-icon-inner svg:nth-child(1), .qodef-qi-info-button.qodef-hover--icon-move-diagonal .qodef-m-icon-inner i:nth-child(1), .qodef-qi-info-button.qodef-hover--icon-move-diagonal .qodef-m-icon-inner svg:nth-child(1) { transform: translateX(0) translateY(0); transition-delay: .1s; opacity: 1; } .qodef-qi-info-button.qodef-hover--icon-move-horizontal .qodef-m-icon-inner i:nth-child(2), .qodef-qi-info-button.qodef-hover--icon-move-horizontal .qodef-m-icon-inner svg:nth-child(2), .qodef-qi-info-button.qodef-hover--icon-move-vertical .qodef-m-icon-inner i:nth-child(2), .qodef-qi-info-button.qodef-hover--icon-move-vertical .qodef-m-icon-inner svg:nth-child(2), .qodef-qi-info-button.qodef-hover--icon-move-diagonal .qodef-m-icon-inner i:nth-child(2), .qodef-qi-info-button.qodef-hover--icon-move-diagonal .qodef-m-icon-inner svg:nth-child(2) { position: absolute; opacity: 0; left: 1px; top: 1px; transition-delay: 0s; } .qodef-qi-info-button.qodef-hover--icon-move-horizontal:hover .qodef-m-icon-inner i:nth-child(1), .qodef-qi-info-button.qodef-hover--icon-move-horizontal:hover .qodef-m-icon-inner svg:nth-child(1), .qodef-qi-info-button.qodef-hover--icon-move-vertical:hover .qodef-m-icon-inner i:nth-child(1), .qodef-qi-info-button.qodef-hover--icon-move-vertical:hover .qodef-m-icon-inner svg:nth-child(1), .qodef-qi-info-button.qodef-hover--icon-move-diagonal:hover .qodef-m-icon-inner i:nth-child(1), .qodef-qi-info-button.qodef-hover--icon-move-diagonal:hover .qodef-m-icon-inner svg:nth-child(1) { opacity: 0; } .qodef-qi-info-button.qodef-hover--icon-move-horizontal:hover .qodef-m-icon-inner i:nth-child(2), .qodef-qi-info-button.qodef-hover--icon-move-horizontal:hover .qodef-m-icon-inner svg:nth-child(2), .qodef-qi-info-button.qodef-hover--icon-move-vertical:hover .qodef-m-icon-inner i:nth-child(2), .qodef-qi-info-button.qodef-hover--icon-move-vertical:hover .qodef-m-icon-inner svg:nth-child(2), .qodef-qi-info-button.qodef-hover--icon-move-diagonal:hover .qodef-m-icon-inner i:nth-child(2), .qodef-qi-info-button.qodef-hover--icon-move-diagonal:hover .qodef-m-icon-inner svg:nth-child(2) { transform: translateX(0%) translateY(0) translatez(0); transition-delay: .25s; opacity: 1; } .qodef-qi-info-button.qodef-hover--icon-move-horizontal .qodef-m-icon-inner i:nth-child(2), .qodef-qi-info-button.qodef-hover--icon-move-horizontal .qodef-m-icon-inner svg:nth-child(2) { transform: translateX(-150%) translateY(0); } .qodef-qi-info-button.qodef-hover--icon-move-horizontal:hover .qodef-m-icon-inner i:nth-child(1), .qodef-qi-info-button.qodef-hover--icon-move-horizontal:hover .qodef-m-icon-inner svg:nth-child(1) { transform: translateX(200%) translateY(0); } .qodef-qi-info-button.qodef-hover--icon-move-vertical .qodef-m-icon-inner i, .qodef-qi-info-button.qodef-hover--icon-move-vertical .qodef-m-icon-inner svg { will-change: transform; } .qodef-qi-info-button.qodef-hover--icon-move-vertical .qodef-m-icon-inner i:nth-child(2), .qodef-qi-info-button.qodef-hover--icon-move-vertical .qodef-m-icon-inner svg:nth-child(2) { transform: translateX(0) translateY(150%) translateZ(0); } .qodef-qi-info-button.qodef-hover--icon-move-vertical:hover .qodef-m-icon-inner i:nth-child(1), .qodef-qi-info-button.qodef-hover--icon-move-vertical:hover .qodef-m-icon-inner svg:nth-child(1) { transform: translateX(0) translateY(-150%) translateZ(0); } .qodef-qi-info-button.qodef-hover--icon-move-diagonal .qodef-m-icon-inner i, .qodef-qi-info-button.qodef-hover--icon-move-diagonal .qodef-m-icon-inner svg { will-change: transform; } .qodef-qi-info-button.qodef-hover--icon-move-diagonal .qodef-m-icon-inner i:nth-child(2), .qodef-qi-info-button.qodef-hover--icon-move-diagonal .qodef-m-icon-inner svg:nth-child(2) { transform: translateX(-100%) translateY(100%) translateZ(0); } .qodef-qi-info-button.qodef-hover--icon-move-diagonal:hover .qodef-m-icon-inner i:nth-child(1), .qodef-qi-info-button.qodef-hover--icon-move-diagonal:hover .qodef-m-icon-inner svg:nth-child(1) { transform: translateX(100%) translateY(-100%) translateZ(0); } .qodef-qi-info-button.qodef-hover--icon-move-horizontal-short .qodef-m-icon-inner i, .qodef-qi-info-button.qodef-hover--icon-move-horizontal-short .qodef-m-icon-inner svg { transition: transform 0.3s cubic-bezier(0.37, 0.08, 0.02, 0.93), opacity 0.2s ease-in-out; transform: translateX(0); will-change: transform; } .qodef-qi-info-button.qodef-hover--icon-move-horizontal-short:hover .qodef-m-icon-inner i, .qodef-qi-info-button.qodef-hover--icon-move-horizontal-short:hover .qodef-m-icon-inner svg { transform: translateX(4px); } /* ========================================================================== Button shortcode styles ========================================================================== */ .qodef-qi-info-button.qodef-type--icon-boxed { padding: 0 !important; flex-direction: row; align-items: stretch; } .qodef-qi-info-button.qodef-type--icon-boxed .qodef-m-text-holder { flex-direction: column; padding: 11px 28px; } .qodef-qi-info-button.qodef-type--icon-boxed.qodef-icon--left { flex-direction: row-reverse; } .qodef-qi-info-button.qodef-type--icon-boxed.qodef-icon--left .qodef-m-icon-holder { flex-direction: row-reverse; } .qodef-qi-info-button.qodef-type--icon-boxed .qodef-m-text-holder { align-items: flex-start; justify-content: center; } .qodef-qi-info-button.qodef-type--icon-boxed .qodef-m-icon { position: relative; display: flex; align-items: center; justify-content: center; text-align: center; padding: 11px 0; flex: 1; } .qodef-qi-info-button.qodef-type--icon-boxed .qodef-m-icon i { line-height: inherit; } .qodef-qi-info-button.qodef-type--icon-boxed .qodef-m-border { height: 100%; width: 2px; background-color: #111; transition: background-color .25s ease-in-out; } /* ========================================================================== Info Cards shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ .qodef-qi-info-cards { position: relative; display: flex; flex-direction: column; background-color: #F9F9F9; padding: 30px; transition: background-color .4s ease-out; } .qodef-qi-info-cards .qodef-m-link { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .qodef-qi-info-cards a:not(.qodef-m-link) { position: relative; z-index: 1; } .qodef-qi-info-cards .qodef-m-title { margin: 0 0 .5em; } .qodef-qi-info-cards .qodef-m-title a { display: block; color: inherit; } .qodef-qi-info-cards .qodef-m-subtitle { margin: 0 0 .5em; } .qodef-qi-info-cards .qodef-m-content { position: relative; } .qodef-qi-info-cards .qodef-m-content .qodef-m-text { margin: 0 0 .5em; } .qodef-qi-info-cards .qodef-m-icon-wrapper { margin: 0 0 .5em; } .qodef-qi-info-cards .qodef-m-icon-holder { font-size: 55px; line-height: 1; transition: all .3s ease-in-out; } .qodef-qi-info-cards .qodef-m-icon-holder i { vertical-align: top; color: inherit; } .qodef-qi-info-cards .qodef-m-icon-holder svg { width: 30px; height: auto; vertical-align: top; fill: currentColor; stroke: currentColor; } .qodef-qi-info-cards.qodef--custom-icon .qodef-m-icon-wrapper { position: relative; } .qodef-qi-info-cards.qodef--custom-icon .qodef-m-icon-wrapper a, .qodef-qi-info-cards.qodef--custom-icon .qodef-m-icon-wrapper img { display: inline-block; } /* ========================================================================== Interactive Banner shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ .qodef-qi-interactive-banner { position: relative; display: inline-block; width: 100%; vertical-align: top; width: auto; overflow: hidden; } .qodef-qi-interactive-banner .qodef-m-banner-link { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; } .qodef-qi-interactive-banner .qodef-m-content { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: column; } .qodef-qi-interactive-banner .qodef-m-title { margin: 0; } .qodef-qi-interactive-banner .qodef-m-title-inner { display: inline-block; } .qodef-qi-interactive-banner .qodef-m-subtitle { margin: 0 0 .4em; } .qodef-qi-interactive-banner .qodef-m-content-inner > .qodef-m-text { margin: .7em 0 0; } .qodef-qi-interactive-banner .qodef-m-text-holder { margin: .7em 0 0; } .qodef-qi-interactive-banner .qodef-m-button { padding: .5em 0 0; z-index: 1; position: relative; display: inline-block; } .qodef-qi-interactive-banner .qodef-m-image { position: relative; display: inline-block; width: 100%; vertical-align: top; width: auto; overflow: hidden; } .qodef-qi-interactive-banner .qodef-m-image img { display: inline-block; transition: all .35s ease-out; } .qodef-qi-interactive-banner.qodef-layout--from-bottom.qodef--visible .qodef-m-content { opacity: 1; } .qodef-qi-interactive-banner.qodef-layout--from-bottom .qodef-m-content { align-items: flex-start; justify-content: flex-end; padding: 60px; opacity: 0; transition: opacity .2s; } .qodef-qi-interactive-banner.qodef-layout--from-bottom .qodef-m-content-inner { position: relative; overflow: hidden; } .qodef-qi-interactive-banner.qodef-layout--from-bottom .qodef-m-movement { transform: translateZ(0); transition: transform 0.4s cubic-bezier(0.22, 0.61, 0.36, 1); } .qodef-qi-interactive-banner.qodef-layout--from-bottom .qodef-m-text-holder { opacity: 0; transition: opacity .25s ease-out; } .qodef-qi-interactive-banner.qodef-layout--from-bottom .qodef-m-text-holder .qodef-m-text { margin: 0; } .qodef-qi-interactive-banner.qodef-layout--from-bottom:hover .qodef-m-movement { transform: translateY(0) translateZ(0) !important; } .qodef-qi-interactive-banner.qodef-layout--from-bottom:hover .qodef-m-text-holder { opacity: 1; transition-delay: .15s; } .qodef-qi-interactive-banner.qodef-layout--image-switch { width: 100%; background-color: #f6f6f6; } .qodef-qi-interactive-banner.qodef-layout--image-switch .qodef-m-content { position: relative; flex-direction: row; align-items: center; justify-content: left; text-align: left; padding: 60px; } @media only screen and (max-width: 680px) { .qodef-qi-interactive-banner.qodef-layout--image-switch .qodef-m-content { flex-direction: column; } } .qodef-qi-interactive-banner.qodef-layout--image-switch .qodef-m-content-inner { flex: 1; margin-right: 2em; } @media only screen and (max-width: 680px) { .qodef-qi-interactive-banner.qodef-layout--image-switch .qodef-m-content-inner { margin-right: 0; } } .qodef-qi-interactive-banner.qodef-layout--image-switch .qodef-m-image-holder { position: relative; width: 35%; } @media only screen and (max-width: 680px) { .qodef-qi-interactive-banner.qodef-layout--image-switch .qodef-m-image-holder { width: 100%; margin-top: 2em; } } .qodef-qi-interactive-banner.qodef-layout--image-switch .qodef-m-image-holder .qodef-m-image { transition: .2s ease-in-out; } .qodef-qi-interactive-banner.qodef-layout--image-switch .qodef-m-image-holder .qodef-m-image:first-child { opacity: 1; } .qodef-qi-interactive-banner.qodef-layout--image-switch .qodef-m-image-holder .qodef-m-image:last-child { position: absolute; top: 0; left: 0; opacity: 0; } .qodef-qi-interactive-banner.qodef-layout--image-switch:hover .qodef-m-image-holder .qodef-m-image:first-child { opacity: 0; } .qodef-qi-interactive-banner.qodef-layout--image-switch:hover .qodef-m-image-holder .qodef-m-image:last-child { opacity: 1; } .qodef-qi-interactive-banner.qodef-layout--revealing.qodef--visible .qodef-m-content { opacity: 1; } .qodef-qi-interactive-banner.qodef-layout--revealing .qodef-m-content { align-items: flex-start; justify-content: flex-start; padding: 60px; opacity: 0; transition: opacity .2s; } .qodef-qi-interactive-banner.qodef-layout--revealing .qodef-m-content-inner > .qodef-m-text { opacity: 0; transform: translateY(-10px); transition: opacity 0.25s, transform 0.25s cubic-bezier(0.22, 0.61, 0.36, 1); } .qodef-qi-interactive-banner.qodef-layout--revealing .qodef-m-button { transition: transform 0.4s cubic-bezier(0.22, 0.61, 0.36, 1); transition-delay: .05s; } .qodef-qi-interactive-banner.qodef-layout--revealing:hover .qodef-m-button { transform: translateY(0) translateZ(0) !important; transition-delay: 0s; } .qodef-qi-interactive-banner.qodef-layout--revealing:hover .qodef-m-content-inner > .qodef-m-text { opacity: 1; transform: translateY(0px); transition-duration: .25s, .35s; transition-delay: .1s, .1s; } .qodef-qi-interactive-banner.qodef-layout--standard .qodef-m-content { align-items: center; justify-content: center; text-align: center; padding: 30px; } .qodef-qi-interactive-banner.qodef-layout--standard .qodef-m-subtitle, .qodef-qi-interactive-banner.qodef-layout--standard .qodef-m-button { opacity: 0; transition: opacity .23s ease-out,transform .28s ease-out; } .qodef-qi-interactive-banner.qodef-layout--standard .qodef-m-subtitle { transform: translateY(-10px); } .qodef-qi-interactive-banner.qodef-layout--standard .qodef-m-button { transform: translateY(10px); } .qodef-qi-interactive-banner.qodef-layout--standard:hover .qodef-m-subtitle, .qodef-qi-interactive-banner.qodef-layout--standard:hover .qodef-m-button { opacity: 1; transform: translateY(0px); } /* ========================================================================== Interactive Link Showcase shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ .qodef-qi-interactive-link-showcase { position: relative; display: inline-block; width: 100%; vertical-align: top; display: flex; align-items: center; visibility: hidden; } .qodef-qi-interactive-link-showcase.qodef--full-height { height: 100vh; } .admin-bar .qodef-qi-interactive-link-showcase.qodef--full-height { height: calc(100vh - 32px); } .qodef-qi-interactive-link-showcase .qodef-e-image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transition: opacity .0s .45s; } .qodef-qi-interactive-link-showcase .qodef-e-image.qodef-background { background-size: cover; background-position: center; background-repeat: no-repeat; } .qodef-qi-interactive-link-showcase .qodef-e-image.qodef-background img { display: none; } .qodef-qi-interactive-link-showcase .qodef-e-image.qodef--active { opacity: 1; z-index: 5; transition: opacity 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); } .qodef-qi-interactive-link-showcase .qodef-m-items { display: flex; flex-direction: column; align-items: center; z-index: 10; } .qodef-qi-interactive-link-showcase .qodef-m-item { position: relative; display: inline-block; vertical-align: top; width: auto; color: #111111; margin: .6em 0; } .qodef-qi-interactive-link-showcase .qodef-e-title { position: relative; display: inline-block; vertical-align: top; font-family: inherit; font-weight: 500; letter-spacing: -0.02em; font-size: 39px; line-height: 1.19048em; transition: color 0.2s ease-out; z-index: 2; } @media only screen and (max-width: 680px) { .qodef-qi-interactive-link-showcase .qodef-e-title { font-size: 36px; } } .qodef-qi-interactive-link-showcase .qodef-e-inner-title { position: relative; display: inline-block; vertical-align: top; } .qodef-qi-interactive-link-showcase .qodef-e-inner-title:after { content: ''; position: absolute; left: 0; width: 0; height: 2px; background-color: currentColor; transition: width .3s ease; } .qodef-qi-interactive-link-showcase .qodef-e-inner-title:hover:after { width: 100%; } .qodef-hover--underline.qodef-qi-interactive-link-showcase .qodef-e-inner-title:after { bottom: 0; } .qodef-hover--line-through.qodef-qi-interactive-link-showcase .qodef-e-inner-title:after { top: 50%; transform: translateY(-50%); } .qodef-qi-interactive-link-showcase .qodef--active.qodef-m-item .qodef-e-inner-title:after { width: 100%; } .qodef-qi-interactive-link-showcase .qodef-e-text { display: block; } .qodef-qi-interactive-link-showcase.qodef--init { visibility: visible; } /* ========================================================================== Interactive Link Showcase shortcode responsive styles ========================================================================== */ /* ========================================================================== Interactive Link Showcase List styles ========================================================================== */ .qodef-qi-interactive-link-showcase.qodef-layout--background .qodef-m-images { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .qodef-qi-interactive-link-showcase.qodef-layout--background .qodef-m-items { width: 40%; justify-content: center; align-items: flex-start; } /* ========================================================================== Interactive Link Showcase List styles ========================================================================== */ .qodef-qi-interactive-link-showcase.qodef-layout--split { align-items: stretch; } .qodef-qi-interactive-link-showcase.qodef-layout--split .qodef-m-images { position: relative; flex: 1; } @media only screen and (max-width: 680px) { .qodef-split-hide-under--680 .qodef-qi-interactive-link-showcase.qodef-layout--split .qodef-m-images { display: none; } } @media only screen and (max-width: 480px) { .qodef-split-hide-under--480 .qodef-qi-interactive-link-showcase.qodef-layout--split .qodef-m-images { display: none; } } .qodef-qi-interactive-link-showcase.qodef-layout--split .qodef-m-items { width: 40%; justify-content: center; align-items: flex-start; padding: 150px 10%; } @media only screen and (max-width: 680px) { .qodef-split-hide-under--680 .qodef-qi-interactive-link-showcase.qodef-layout--split .qodef-m-items { width: 100%; } } @media only screen and (max-width: 480px) { .qodef-split-hide-under--480 .qodef-qi-interactive-link-showcase.qodef-layout--split .qodef-m-items { width: 100%; } } .qodef-qi-interactive-link-showcase.qodef-layout--split .qodef-e-image:not(.qodef-background) { display: flex; align-items: center; justify-content: center; } .qodef-qi-interactive-link-showcase.qodef-layout--split .qodef-e-image:not(.qodef-background) img { max-height: 100%; object-fit: contain; } /* ========================================================================== Interactive Link Showcase List styles ========================================================================== */ .qodef-qi-interactive-link-showcase.qodef-layout--standard { justify-content: center; text-align: center; } .qodef-qi-interactive-link-showcase.qodef-layout--standard .qodef-m-images { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; } @media only screen and (max-width: 768px) { .qodef-standard-hide-under--768 .qodef-qi-interactive-link-showcase.qodef-layout--standard .qodef-m-images { display: none; } } @media only screen and (max-width: 680px) { .qodef-standard-hide-under--680 .qodef-qi-interactive-link-showcase.qodef-layout--standard .qodef-m-images { display: none; } } @media only screen and (max-width: 480px) { .qodef-standard-hide-under--480 .qodef-qi-interactive-link-showcase.qodef-layout--standard .qodef-m-images { display: none; } } .qodef-qi-interactive-link-showcase.qodef-layout--standard .qodef-m-items { width: 40%; justify-content: center; } @media only screen and (max-width: 680px) { .qodef-split-hide-under--680 .qodef-qi-interactive-link-showcase.qodef-layout--standard .qodef-m-items { width: 100%; } } @media only screen and (max-width: 480px) { .qodef-split-hide-under--480 .qodef-qi-interactive-link-showcase.qodef-layout--standard .qodef-m-items { width: 100%; } } .qodef-standard-images-on-top--yes .qodef-qi-interactive-link-showcase.qodef-layout--standard .qodef-m-items { z-index: unset; } .qodef-qi-interactive-link-showcase.qodef-layout--standard .qodef-e-image { display: flex; align-items: center; justify-content: center; transition: opacity .35s ease-out; } .qodef-qi-interactive-link-showcase.qodef-layout--standard .qodef-e-image.qodef-position--left { left: 0; width: 30%; } .qodef-qi-interactive-link-showcase.qodef-layout--standard .qodef-e-image.qodef-position--right { left: auto; right: 0; width: 30%; } .qodef-qi-interactive-link-showcase.qodef-layout--standard .qodef-e-image img { position: relative; } /* ========================================================================== Interactive Link Showcase List styles ========================================================================== */ .qodef-qi-interactive-link-showcase.qodef-layout--inline { align-items: flex-start; justify-content: flex-start; text-align: left; } .qodef-qi-interactive-link-showcase.qodef-layout--inline .qodef-m-images { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; } @media only screen and (max-width: 680px) { .qodef-standard-hide-under--680 .qodef-qi-interactive-link-showcase.qodef-layout--inline .qodef-m-images { display: none; } } @media only screen and (max-width: 480px) { .qodef-standard-hide-under--480 .qodef-qi-interactive-link-showcase.qodef-layout--inline .qodef-m-images { display: none; } } .qodef-qi-interactive-link-showcase.qodef-layout--inline .qodef-m-items { flex-direction: row; flex-wrap: wrap; align-items: baseline; margin: 0 -20px; } @media only screen and (max-width: 680px) { .qodef-split-hide-under--680 .qodef-qi-interactive-link-showcase.qodef-layout--inline .qodef-m-items { width: 100%; } } @media only screen and (max-width: 480px) { .qodef-split-hide-under--480 .qodef-qi-interactive-link-showcase.qodef-layout--inline .qodef-m-items { width: 100%; } } .qodef-qi-interactive-link-showcase.qodef-layout--inline .qodef-m-item { position: relative; flex: 1; flex-grow: 0; margin: 0 !important; } .qodef-qi-interactive-link-showcase.qodef-layout--inline .qodef-e-title { white-space: nowrap; padding: 0 20px; } .qodef-qi-interactive-link-showcase.qodef-layout--inline .qodef-e-title:before { position: absolute; right: 0; transform: translateX(50%); } .qodef-qi-interactive-link-showcase.qodef-layout--inline .qodef-e-text { padding: 0 20px; } .qodef-qi-interactive-link-showcase.qodef-layout--inline .qodef-e-image { display: flex; align-items: center; justify-content: center; transition: opacity .35s ease-out; } .qodef-qi-interactive-link-showcase.qodef-layout--inline .qodef-e-image.qodef-position--left { left: 0; width: 30%; justify-content: flex-start; } .qodef-qi-interactive-link-showcase.qodef-layout--inline .qodef-e-image.qodef-position--right { left: auto; right: 0; width: 30%; justify-content: flex-end; } .qodef-qi-interactive-link-showcase.qodef-layout--inline .qodef-e-image img { position: relative; } /* ========================================================================== Item Showcase shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ .qodef-qi-item-showcase { position: relative; display: flex; align-items: center; justify-content: space-between; width: 100%; } .qodef-qi-item-showcase .qodef-m-image { position: relative; flex-shrink: 0; max-width: 60%; padding: 0 60px; } .qodef-qi-item-showcase .qodef-m-image img { display: block; } .qodef-qi-item-showcase .qodef-m-items { position: relative; display: flex; flex-direction: column; width: 100%; } .qodef-qi-item-showcase .qodef-m-items.qodef--left { text-align: right; } .qodef-qi-item-showcase .qodef-m-items.qodef--right { text-align: left; } .qodef-qi-item-showcase .qodef-m-item { position: relative; display: inline-block; width: 100%; vertical-align: top; margin-bottom: 60px; } @media screen and (min-width: 1025px) { .qodef-qi-item-showcase .qodef-m-item:last-child { margin-bottom: 0 !important; } } .qodef-qi-item-showcase .qodef-e-icon-holder { line-height: 1em; transition: color 0.2s ease-out; } .qodef-qi-item-showcase .qodef-e-icon-holder a { display: inline-block; } .qodef-qi-item-showcase .qodef-e-icon-holder > svg { width: 1em; fill: currentColor; stroke: currentColor; } .qodef-qi-item-showcase .qodef-e-title { margin: 0 0 1em; } .qodef-qi-item-showcase .qodef-e-title-link { font-family: inherit; font-size: inherit; font-weight: inherit; font-style: inherit; line-height: inherit; letter-spacing: inherit; text-transform: inherit; color: inherit; } .qodef-qi-item-showcase .qodef-e-title-link:hover { color: var(--qode-main-color); } .qodef-qi-item-showcase .qodef-e-text { margin: 0; } .qodef-qi-item-showcase.qodef-qi--has-appear { visibility: hidden; } .qodef-qi-item-showcase.qodef-qi--has-appear .qodef-m-image { transform: translateY(70px); transition: opacity 0.55s cubic-bezier(0.23, 1, 0.32, 1), transform 0.55s cubic-bezier(0.23, 1, 0.32, 1); opacity: 0; } .qodef-qi-item-showcase.qodef-qi--has-appear .qodef-m-item { transform: translateY(70px); transition: opacity 0.55s cubic-bezier(0.23, 1, 0.32, 1), transform 0.55s cubic-bezier(0.23, 1, 0.32, 1); opacity: 0; } .qodef-qi-item-showcase.qodef-qi--has-appear .qodef-m-item:nth-child(1) { transition-delay: 200ms; } .qodef-qi-item-showcase.qodef-qi--has-appear .qodef-m-item:nth-child(2) { transition-delay: 400ms; } .qodef-qi-item-showcase.qodef-qi--has-appear .qodef-m-item:nth-child(3) { transition-delay: 600ms; } .qodef-qi-item-showcase.qodef-qi--has-appear .qodef-m-item:nth-child(4) { transition-delay: 800ms; } .qodef-qi-item-showcase.qodef-qi--has-appear .qodef-m-item:nth-child(5) { transition-delay: 1000ms; } .qodef-qi-item-showcase.qodef-qi--has-appear .qodef-m-item:nth-child(6) { transition-delay: 1200ms; } .qodef-qi-item-showcase.qodef-qi--has-appear.qodef-qi--appeared { visibility: visible; } .qodef-qi-item-showcase.qodef-qi--has-appear.qodef-qi--appeared .qodef-m-image { opacity: 1; transform: translateY(0); } .qodef-qi-item-showcase.qodef-qi--has-appear.qodef-qi--appeared .qodef-m-item { opacity: 1; transform: translateY(0); } /* ========================================================================== Item Showcase shortcode responsive styles ========================================================================== */ @media only screen and (max-width: 1024px) { .qodef-qi-item-showcase { align-items: flex-start; flex-wrap: wrap; } .qodef-qi-item-showcase .qodef-m-image { position: absolute; top: 0; left: 0; width: 40%; max-width: 100%; padding-left: 0 !important; } .qodef-qi-item-showcase .qodef-m-items { left: 40%; width: calc(100% - 40%); } .qodef-qi-item-showcase .qodef-m-items .qodef-m-item { transition-delay: 0ms; } .qodef-qi-item-showcase .qodef-m-items.qodef--left { text-align: left; } } @media only screen and (max-width: 768px) { .qodef-qi-item-showcase .qodef-m-image { display: none; } .qodef-qi-item-showcase .qodef-m-items { left: 0; width: 100%; } } /* ========================================================================== Item Showcase List styles ========================================================================== */ .qodef-qi-item-showcase.qodef-layout--side-icon .qodef-m-item { display: flex; align-items: flex-start; } .qodef-qi-item-showcase.qodef-layout--side-icon .qodef--left .qodef-m-item { flex-direction: row-reverse; } @media only screen and (max-width: 1024px) { .qodef-qi-item-showcase.qodef-layout--side-icon .qodef--left .qodef-m-item { flex-direction: row; } } .qodef-qi-item-showcase.qodef-layout--side-icon .qodef--left .qodef-e-side-holder { margin-left: .5em; } @media only screen and (max-width: 1024px) { .qodef-qi-item-showcase.qodef-layout--side-icon .qodef--left .qodef-e-side-holder { margin-left: 0; margin-right: .5em; } } .qodef-qi-item-showcase.qodef-layout--side-icon .qodef--right .qodef-e-side-holder { margin-right: .5em; } .qodef-qi-item-showcase.qodef-layout--side-icon .qodef-e-icon-holder { font-size: 3em; flex-shrink: 0; } .qodef-qi-item-showcase.qodef-layout--side-icon .qodef-e-content-holder { flex: 1; } /* ========================================================================== Item Showcase List styles ========================================================================== */ .qodef-qi-item-showcase.qodef-layout--standard .qodef-e-number, .qodef-qi-item-showcase.qodef-layout--standard .qodef-e-icon-holder { margin-bottom: .4em; } /* ========================================================================== Section Title shortcode styles ========================================================================== */ .qodef-qi-message-box { background: #d5eaf4; padding: 40px 40px; display: flex; transition: opacity .19s ease, visibility .19s ease; } .qodef-qi-message-box.qodef-hidden { opacity: 0; visibility: hidden; } .qodef-qi-message-box.qodef-icon--middle { align-items: center; } .qodef-qi-message-box.qodef-icon--top { align-items: flex-start; } .qodef-qi-message-box.qodef-icon--bottom { align-items: flex-end; } .qodef-qi-message-box .qodef-m-close-icon { position: absolute; right: 17px; top: 17px; line-height: 1; cursor: pointer; transition: color .25s ease-in-out; } .qodef-qi-message-box .qodef-m-close-icon i { color: inherit; } .qodef-qi-message-box .qodef-m-close-icon svg { width: 30px; height: auto; fill: currentColor; stroke: currentColor; } .qodef-qi-message-box .qodef-m-icon { line-height: 1; margin-right: 20px; } .qodef-qi-message-box .qodef-m-title { margin: 0; } .qodef-qi-message-box .qodef-m-text { margin: 0; } .q-message-box-holder { transition: height 0.23s cubic-bezier(0.05, 0.47, 0.58, 1); } /* ========================================================================== Parallax Images style - begin ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ .qodef-qi-parallax-images { position: relative; display: inline-block; width: 100%; vertical-align: top; } .qodef-qi-parallax-images .qodef-m-images { position: relative; display: inline-block; vertical-align: middle; } .qodef-browser--ms-explorer .qodef-qi-parallax-images .qodef-m-images { width: 100%; } .e--ua-firefox .qodef-qi-parallax-images .qodef-m-images img { backface-visibility: hidden; } .qodef-qi-parallax-images .qodef-e-parallax-image { position: absolute; display: block; transition: all 0.7s cubic-bezier(0.23, 1, 0.32, 1); } .qodef-qi-parallax-images .qodef-e-parallax-image.qodef-position--top-left { top: 0; left: 0; } .qodef-qi-parallax-images .qodef-e-parallax-image.qodef-position--top-right { top: 0; right: 0; } .qodef-qi-parallax-images .qodef-e-parallax-image.qodef-position--bottom-left { bottom: 0; left: 0; } .qodef-qi-parallax-images .qodef-e-parallax-image.qodef-position--bottom-right { bottom: 0; right: 0; } /* ========================================================================== parallax Images style - end ========================================================================== */ /* ========================================================================== Preview Slider shortcode styles ========================================================================== */ .qodef-qi-preview-slider { position: relative; opacity: 0; transition: opacity .35s ease-out; } .qodef-qi-preview-slider.qodef--visible { opacity: 1; } .qodef-qi-preview-slider .qodef-preview-slider-device-holder { position: absolute; top: 0; left: 50%; transform: translateX(-50%); z-index: 10; } .qodef-qi-preview-slider .qodef-preview-slider-device { position: absolute; margin: auto; width: 214px; bottom: -50px; right: 50px; } .qodef-qi-preview-slider .qodef-preview-slider-device .qodef-preview-slider-device-image { position: relative; pointer-events: none; z-index: 10; } .qodef-qi-preview-slider .qodef-preview-slider-device .qodef-preview-slider-device-image img { width: 100%; filter: drop-shadow(0px 6px 16.8px rgba(0, 0, 0, 0.07)); } .qodef-qi-preview-slider .qodef-preview-slider-device .qodef-m-items { position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 5; } .qodef-qi-preview-slider .qodef-preview-slider-device .qodef-qi-swiper-container { overflow: hidden; height: 100%; padding: 0 !important; } .qodef-qi-preview-slider .qodef-preview-slider-device .qodef-m-item { height: 100%; } .qodef-qi-preview-slider .qodef-preview-slider-device .qodef-m-item img { height: 100%; object-fit: cover; } /* ========================================================================== Pricing List shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ .qodef-qi-pricing-list { position: relative; display: inline-block; width: 100%; vertical-align: top; } .qodef-qi-pricing-list .qodef-m-item:not(:last-child) { margin-bottom: 35px; } .qodef-qi-pricing-list .qodef-m-item.qodef-has-discount .qodef-e-heading-price { text-decoration: line-through; margin-right: .25em; } .qodef-qi-pricing-list .qodef-e-heading { display: flex; align-items: baseline; } .qodef-qi-pricing-list .qodef-e-heading .qodef-e-image { max-width: 20%; } .qodef-qi-pricing-list .qodef-e-heading .qodef-e-image img { margin-left: 10px; } .qodef-qi-pricing-list .qodef-e-heading-title { margin: 0; } .qodef-qi-pricing-list .qodef-e-heading-line { flex-grow: 1; margin: 0 8px; border-bottom: 1px solid #ebebeb; } .qodef-qi-pricing-list .qodef-e-heading-price, .qodef-qi-pricing-list .qodef-e-heading-discount-price { margin: 0; color: #111111; } .qodef-qi-pricing-list .qodef-e-description { margin: .5em 0 0; color: #9c9c9c; } .qodef-qi-pricing-list .qodef-m-button { margin-top: 30px; } .qodef-qi-pricing-list.qodef-pricing-line--pattern .qodef-e-heading-line { height: 5px; background-repeat: repeat; border: none; } .qodef-qi-pricing-list.qodef-pricing-line--dashed .qodef-e-heading-line { border-bottom-style: dashed; } .qodef-qi-pricing-list.qodef-pricing-line--dotted .qodef-e-heading-line { border-bottom-style: dotted; } .qodef-qi-pricing-list.qodef-with-separator .qodef-m-item:not(:last-child) { border-bottom: 1px solid #ebebeb; } /* ========================================================================== Pricing List shortcode styles ========================================================================== */ .qodef-qi-pricing-list.qodef-layout--image-before .qodef-m-item { display: flex; align-items: center; } .qodef-qi-pricing-list.qodef-layout--image-before .qodef-m-item .qodef-e-image { max-width: 25%; flex-shrink: 0; margin-right: 24px; } .qodef-qi-pricing-list.qodef-layout--image-before .qodef-m-item .qodef-e-item-holder { flex: 1; } /* ========================================================================== Pricing Table shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ .qodef-qi-pricing-table { position: relative; display: inline-block; width: 100%; vertical-align: top; overflow: hidden; } .qodef-qi-pricing-table.qodef-status--featured { transform: translateY(-18px); } .qodef-qi-pricing-table .qodef-m-inner { position: relative; padding: 45px; } .qodef-qi-pricing-table .qodef-m-title { margin: 0; } .qodef-qi-pricing-table .qodef-m-price { display: flex; align-items: baseline; } .qodef-qi-pricing-table .qodef-m-price .qodef-m-price-wrapper { display: inline-flex; margin: 0; line-height: 1; justify-content: center; align-items: baseline; } .qodef-qi-pricing-table .qodef-m-price .qodef-m-price-currency { align-self: flex-start; } .qodef-qi-pricing-table.qodef-period--side .qodef-m-price-period { margin-left: 5px; } .qodef-qi-pricing-table.qodef-period--bottom .qodef-m-price { flex-direction: column; } .qodef-qi-pricing-table.qodef-period--bottom .qodef-m-price-period { margin: 0; } .qodef-qi-pricing-table .qodef-m-content { padding: 25px 0 0; margin: 0; } .qodef-qi-pricing-table .qodef-m-content li { margin-bottom: 8px; } .qodef-qi-pricing-table .qodef-m-content li:last-child { margin-bottom: 0; } .qodef-qi-pricing-table .qodef-m-content li.qodef--excluded { text-decoration: line-through; color: rgba(17, 17, 17, 0.6); } .qodef-qi-pricing-table .qodef-m-button .qodef-qi-button { margin: 25px 0 0; } .qodef-qi-pricing-table .qodef-m-label { position: absolute; right: 15px; color: #fff; background-color: #111; } .qodef-qi-pricing-table.qodef-label-type--badge .qodef-m-label { top: 15px; border-radius: 50px; padding: 10px; } .qodef-qi-pricing-table.qodef-label-type--ribbon .qodef-m-label { top: -1px; border-radius: 50px 0 0 50px; transform: rotate(-90deg) translate(0, -100%); transform-origin: right top; padding: 5px 15px; } .qodef-qi-pricing-table.qodef-list-style-icon .qodef-m-content { list-style-type: none; } .qodef-qi-pricing-table.qodef-list-style-icon .qodef-m-content svg { width: 1em; fill: currentColor; stroke: currentColor; } .qodef-qi-pricing-table.qodef-list-style-icon .qodef-e-icon { display: inline-block; } .qodef-qi-pricing-table.qodef-list-style-icon.qodef-list-style--outside .qodef-m-content { margin: 0 calc(-1em - 5px); } .qodef-qi-pricing-table.qodef-list-style-icon.qodef-list-style--outside li { position: relative; display: flex; } .qodef-qi-pricing-table.qodef-list-style-icon.qodef-list-style--outside .qodef-e-icon { position: absolute; left: 0; } .qodef-qi-pricing-table.qodef-list-style-icon.qodef-list-style--outside .qodef-e-text { flex: 1; padding: 0 5px; margin: 0 1em; } .qodef-qi-pricing-table.qodef-list-style--outside .qodef-m-content { list-style-position: outside; } .qodef-qi-pricing-table.qodef-list-style--inside .qodef-m-content { list-style-position: inside; } .qodef-qi-pricing-table.qodef-list-type--none .qodef-m-content { list-style-type: none; } .qodef-qi-pricing-table .qodef-qi-separator .qodef-m-line { width: 30px; } /* ========================================================================== Pricing Table shortcode styles ========================================================================== */ .qodef-qi-pricing-table.qodef-layout--cascading .qodef-m-inner { padding: 50px; } .qodef-qi-pricing-table.qodef-layout--cascading .qodef-m-title { background-color: #f6f6f6; padding: 30px 50px; } /* ========================================================================== Pricing Table shortcode styles ========================================================================== */ .qodef-qi-pricing-table.qodef-layout--minimal { border-width: 0 0 0 1px; } .qodef-qi-pricing-table.qodef-layout--minimal .qodef-m-inner { padding: 0 0 0 15px; } .qodef-qi-pricing-table.qodef-layout--minimal .qodef-m-price-wrapper { margin: 0 0 .5em; } /* ========================================================================== Pricing Table shortcode styles ========================================================================== */ .qodef-qi-pricing-table.qodef-layout--simple .qodef-m-inner { padding: 0 50px 40px; } .qodef-qi-pricing-table.qodef-layout--simple .qodef-m-title-wrapper { background-color: #f6f6f6; padding: 40px 20px; } /* ========================================================================== Pricing Table shortcode styles ========================================================================== */ .qodef-qi-pricing-table.qodef-layout--standard .qodef-m-title { margin: 0 0 1em; } /* ========================================================================== Pricing Table shortcode styles ========================================================================== */ .qodef-qi-pricing-table.qodef-layout--vertical-image { display: flex; } .qodef-qi-pricing-table.qodef-layout--vertical-image .qodef-m-inner { flex: 1; } .qodef-qi-pricing-table.qodef-layout--vertical-image .qodef-m-vertical-image-holder { width: 90px; max-width: 60%; } .qodef-qi-pricing-table.qodef-layout--vertical-image .qodef-m-vertical-image-holder .qodef-m-image { height: 100%; } .qodef-qi-pricing-table.qodef-layout--vertical-image .qodef-m-vertical-image-holder img { height: 100%; object-fit: cover; } .qodef-qi-pricing-table.qodef-layout--vertical-image .qodef-m-title { margin-bottom: 1em; } /* ========================================================================== Pricing Table shortcode styles ========================================================================== */ .qodef-qi-pricing-table.qodef-layout--with-icon .qodef-m-inner { padding: 0; } .qodef-qi-pricing-table.qodef-layout--with-icon .qodef-m-top { padding: 50px; } .qodef-qi-pricing-table.qodef-layout--with-icon .qodef-m-content { padding: 0; } .qodef-qi-pricing-table.qodef-layout--with-icon .qodef-m-content .qodef-e-item { padding: 27px 50px; margin: 0; border-top: 1px solid #ebebeb; } .qodef-qi-pricing-table.qodef-layout--with-icon .qodef-m-title-icon { line-height: 1em; } .qodef-qi-pricing-table.qodef-layout--with-icon .qodef-m-title-icon svg { width: 1em; vertical-align: top; fill: currentColor; stroke: currentColor; } .qodef-qi-pricing-table.qodef-layout--with-icon .qodef-m-title { margin: .7em 0 1em; } .qodef-qi-pricing-table.qodef-layout--with-icon .qodef-m-button .qodef-qi-button { width: 100%; text-align: center; margin-top: 0; } /* ========================================================================== Process shortcode styles ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ .qodef-qi-process.qodef-qi-grid > .qodef-grid-inner > .qodef-grid-item:last-child .qodef-e-line { display: none; } .qodef-qi-process .qodef-e-icon-holder { position: relative; z-index: 5; } .qodef-qi-process .qodef-e-icon { position: relative; display: flex; align-items: center; justify-content: center; width: 3em; height: 3em; font-size: 60px; background: #f6f6f6; border-radius: 50%; margin: 0 auto; z-index: 3; } .qodef-qi-process .qodef-e-number { position: absolute; top: 0; right: 0; background: #333; width: 2.8em; height: 2.8em; font-size: 20px; color: #fff; border-radius: 50%; line-height: 1; display: flex; align-items: center; justify-content: center; } .qodef-qi-process .qodef-e-line { position: absolute; z-index: 2; } .qodef-qi-process .qodef-e-title { margin: 2em 0 0; } .qodef-qi-process .qodef-e-text { margin: .3em 0 0; } /* ========================================================================== Horizontal Process shortcode styles ========================================================================== */ .qodef-qi-process.qodef-item-layout--horizontal .qodef-e-number { width: 2.8em; height: 2.8em; font-size: 20px; } .qodef-qi-process.qodef-item-layout--horizontal .qodef-e-line { top: 50%; left: 50%; width: 100%; height: auto; } .qodef-qi-process.qodef-item-layout--horizontal .qodef-e-line-inner { width: 100%; height: 100%; border-bottom: #acacac; position: absolute; top: 0; left: 0; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e .qodef-e-line-inner { transition: transform 1s; transform-origin: left; transform: scaleX(0); } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e .qodef-e-icon { transition: transform .35s, opacity .2s; transform: scale(0.8); opacity: 0; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e .qodef-e-title, .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e .qodef-e-text { transition: transform .35s, opacity .2s; transform: translateY(10px); opacity: 0; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(1) { transition-delay: 0s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(1) .qodef-e-line-inner { transition-delay: 0.25s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(1) .qodef-e-icon { transition-delay: 0s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(1) .qodef-e-title, .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(1) .qodef-e-text { transition-delay: 0.1s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(2) { transition-delay: 0.35s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(2) .qodef-e-line-inner { transition-delay: 0.6s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(2) .qodef-e-icon { transition-delay: 0.35s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(2) .qodef-e-title, .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(2) .qodef-e-text { transition-delay: 0.45s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(3) { transition-delay: 0.7s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(3) .qodef-e-line-inner { transition-delay: 0.95s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(3) .qodef-e-icon { transition-delay: 0.7s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(3) .qodef-e-title, .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(3) .qodef-e-text { transition-delay: 0.8s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(4) { transition-delay: 1.05s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(4) .qodef-e-line-inner { transition-delay: 1.3s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(4) .qodef-e-icon { transition-delay: 1.05s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(4) .qodef-e-title, .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(4) .qodef-e-text { transition-delay: 1.15s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(5) { transition-delay: 1.4s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(5) .qodef-e-line-inner { transition-delay: 1.65s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(5) .qodef-e-icon { transition-delay: 1.4s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(5) .qodef-e-title, .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(5) .qodef-e-text { transition-delay: 1.5s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(6) { transition-delay: 1.75s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(6) .qodef-e-line-inner { transition-delay: 2s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(6) .qodef-e-icon { transition-delay: 1.75s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(6) .qodef-e-title, .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(6) .qodef-e-text { transition-delay: 1.85s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(7) { transition-delay: 2.1s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(7) .qodef-e-line-inner { transition-delay: 2.35s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(7) .qodef-e-icon { transition-delay: 2.1s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(7) .qodef-e-title, .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(7) .qodef-e-text { transition-delay: 2.2s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(8) { transition-delay: 2.45s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(8) .qodef-e-line-inner { transition-delay: 2.7s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(8) .qodef-e-icon { transition-delay: 2.45s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(8) .qodef-e-title, .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(8) .qodef-e-text { transition-delay: 2.55s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(9) { transition-delay: 2.8s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(9) .qodef-e-line-inner { transition-delay: 3.05s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(9) .qodef-e-icon { transition-delay: 2.8s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(9) .qodef-e-title, .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(9) .qodef-e-text { transition-delay: 2.9s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(10) { transition-delay: 3.15s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(10) .qodef-e-line-inner { transition-delay: 3.4s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(10) .qodef-e-icon { transition-delay: 3.15s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(10) .qodef-e-title, .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(10) .qodef-e-text { transition-delay: 3.25s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(11) { transition-delay: 3.5s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(11) .qodef-e-line-inner { transition-delay: 3.75s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(11) .qodef-e-icon { transition-delay: 3.5s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(11) .qodef-e-title, .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(11) .qodef-e-text { transition-delay: 3.6s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(12) { transition-delay: 3.85s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(12) .qodef-e-line-inner { transition-delay: 4.1s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(12) .qodef-e-icon { transition-delay: 3.85s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(12) .qodef-e-title, .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(12) .qodef-e-text { transition-delay: 3.95s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(13) { transition-delay: 4.2s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(13) .qodef-e-line-inner { transition-delay: 4.45s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(13) .qodef-e-icon { transition-delay: 4.2s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(13) .qodef-e-title, .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(13) .qodef-e-text { transition-delay: 4.3s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(14) { transition-delay: 4.55s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(14) .qodef-e-line-inner { transition-delay: 4.8s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(14) .qodef-e-icon { transition-delay: 4.55s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(14) .qodef-e-title, .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(14) .qodef-e-text { transition-delay: 4.65s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(15) { transition-delay: 4.9s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(15) .qodef-e-line-inner { transition-delay: 5.15s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(15) .qodef-e-icon { transition-delay: 4.9s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(15) .qodef-e-title, .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(15) .qodef-e-text { transition-delay: 5s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(16) { transition-delay: 5.25s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(16) .qodef-e-line-inner { transition-delay: 5.5s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(16) .qodef-e-icon { transition-delay: 5.25s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(16) .qodef-e-title, .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(16) .qodef-e-text { transition-delay: 5.35s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(17) { transition-delay: 5.6s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(17) .qodef-e-line-inner { transition-delay: 5.85s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(17) .qodef-e-icon { transition-delay: 5.6s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(17) .qodef-e-title, .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(17) .qodef-e-text { transition-delay: 5.7s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(18) { transition-delay: 5.95s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(18) .qodef-e-line-inner { transition-delay: 6.2s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(18) .qodef-e-icon { transition-delay: 5.95s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(18) .qodef-e-title, .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(18) .qodef-e-text { transition-delay: 6.05s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(19) { transition-delay: 6.3s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(19) .qodef-e-line-inner { transition-delay: 6.55s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(19) .qodef-e-icon { transition-delay: 6.3s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(19) .qodef-e-title, .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(19) .qodef-e-text { transition-delay: 6.4s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(20) { transition-delay: 6.65s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(20) .qodef-e-line-inner { transition-delay: 6.9s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(20) .qodef-e-icon { transition-delay: 6.65s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(20) .qodef-e-title, .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear .qodef-e:nth-child(20) .qodef-e-text { transition-delay: 6.75s; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear.qodef-qi--appeared .qodef-e .qodef-e-line-inner { transform: scaleX(1); } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear.qodef-qi--appeared .qodef-e .qodef-e-icon { transform: scale(1); opacity: 1; } .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear.qodef-qi--appeared .qodef-e .qodef-e-title, .qodef-qi-process.qodef-item-layout--horizontal.qodef-qi--has-appear.qodef-qi--appeared .qodef-e .qodef-e-text { transform: translateY(0); opacity: 1; } /* ========================================================================== Vertical Process shortcode styles ========================================================================== */ .qodef-qi-process.qodef-item-layout--vertical .qodef-grid-inner { grid-row-gap: 0; } .qodef-qi-process.qodef-item-layout--vertical .qodef-e-content { display: flex; align-items: stretch; } .qodef-qi-process.qodef-item-layout--vertical .qodef-e-text-wrapper { margin-left: 30px; } .qodef-qi-process.qodef-item-layout--vertical .qodef-process-item:not(:last-child) .qodef-e-icon-holder { padding-bottom: 50px; } .qodef-qi-process.qodef-item-layout--vertical .qodef-e-icon { font-size: 40px; } .qodef-qi-process.qodef-item-layout--vertical .qodef-e-line { top: 0; left: 50%; height: 100%; transform: translateX(-50%); } .qodef-qi-process.qodef-item-layout--vertical .qodef-e-line-inner { width: 100%; height: 100%; position: absolute; top: 0; left: 0; border-left: 1px solid #acacac; } .qodef-qi-process.qodef-item-layout--vertical .qodef-e-title { margin: 0; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e .qodef-e-line-inner { transition: transform .8s; transform-origin: top; transform: scaleY(0); } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e .qodef-e-icon { transition: opacity .35s; opacity: 0; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e .qodef-e-title, .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e .qodef-e-text { transition: transform .35s, opacity .25s; transform: translateY(-10px); opacity: 0; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(1) { transition-delay: 0s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(1) .qodef-e-line-inner { transition-delay: 0s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(1) .qodef-e-icon { transition-delay: 0s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(1) .qodef-e-title, .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(1) .qodef-e-text { transition-delay: 0.15s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(2) { transition-delay: 0.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(2) .qodef-e-line-inner { transition-delay: 0.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(2) .qodef-e-icon { transition-delay: 0.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(2) .qodef-e-title, .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(2) .qodef-e-text { transition-delay: 0.65s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(3) { transition-delay: 1s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(3) .qodef-e-line-inner { transition-delay: 1s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(3) .qodef-e-icon { transition-delay: 1s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(3) .qodef-e-title, .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(3) .qodef-e-text { transition-delay: 1.15s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(4) { transition-delay: 1.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(4) .qodef-e-line-inner { transition-delay: 1.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(4) .qodef-e-icon { transition-delay: 1.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(4) .qodef-e-title, .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(4) .qodef-e-text { transition-delay: 1.65s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(5) { transition-delay: 2s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(5) .qodef-e-line-inner { transition-delay: 2s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(5) .qodef-e-icon { transition-delay: 2s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(5) .qodef-e-title, .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(5) .qodef-e-text { transition-delay: 2.15s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(6) { transition-delay: 2.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(6) .qodef-e-line-inner { transition-delay: 2.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(6) .qodef-e-icon { transition-delay: 2.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(6) .qodef-e-title, .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(6) .qodef-e-text { transition-delay: 2.65s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(7) { transition-delay: 3s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(7) .qodef-e-line-inner { transition-delay: 3s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(7) .qodef-e-icon { transition-delay: 3s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(7) .qodef-e-title, .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(7) .qodef-e-text { transition-delay: 3.15s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(8) { transition-delay: 3.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(8) .qodef-e-line-inner { transition-delay: 3.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(8) .qodef-e-icon { transition-delay: 3.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(8) .qodef-e-title, .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(8) .qodef-e-text { transition-delay: 3.65s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(9) { transition-delay: 4s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(9) .qodef-e-line-inner { transition-delay: 4s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(9) .qodef-e-icon { transition-delay: 4s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(9) .qodef-e-title, .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(9) .qodef-e-text { transition-delay: 4.15s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(10) { transition-delay: 4.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(10) .qodef-e-line-inner { transition-delay: 4.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(10) .qodef-e-icon { transition-delay: 4.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(10) .qodef-e-title, .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(10) .qodef-e-text { transition-delay: 4.65s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(11) { transition-delay: 5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(11) .qodef-e-line-inner { transition-delay: 5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(11) .qodef-e-icon { transition-delay: 5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(11) .qodef-e-title, .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(11) .qodef-e-text { transition-delay: 5.15s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(12) { transition-delay: 5.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(12) .qodef-e-line-inner { transition-delay: 5.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(12) .qodef-e-icon { transition-delay: 5.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(12) .qodef-e-title, .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(12) .qodef-e-text { transition-delay: 5.65s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(13) { transition-delay: 6s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(13) .qodef-e-line-inner { transition-delay: 6s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(13) .qodef-e-icon { transition-delay: 6s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(13) .qodef-e-title, .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(13) .qodef-e-text { transition-delay: 6.15s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(14) { transition-delay: 6.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(14) .qodef-e-line-inner { transition-delay: 6.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(14) .qodef-e-icon { transition-delay: 6.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(14) .qodef-e-title, .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(14) .qodef-e-text { transition-delay: 6.65s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(15) { transition-delay: 7s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(15) .qodef-e-line-inner { transition-delay: 7s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(15) .qodef-e-icon { transition-delay: 7s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(15) .qodef-e-title, .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(15) .qodef-e-text { transition-delay: 7.15s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(16) { transition-delay: 7.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(16) .qodef-e-line-inner { transition-delay: 7.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(16) .qodef-e-icon { transition-delay: 7.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(16) .qodef-e-title, .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(16) .qodef-e-text { transition-delay: 7.65s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(17) { transition-delay: 8s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(17) .qodef-e-line-inner { transition-delay: 8s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(17) .qodef-e-icon { transition-delay: 8s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(17) .qodef-e-title, .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(17) .qodef-e-text { transition-delay: 8.15s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(18) { transition-delay: 8.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(18) .qodef-e-line-inner { transition-delay: 8.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(18) .qodef-e-icon { transition-delay: 8.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(18) .qodef-e-title, .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(18) .qodef-e-text { transition-delay: 8.65s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(19) { transition-delay: 9s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(19) .qodef-e-line-inner { transition-delay: 9s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(19) .qodef-e-icon { transition-delay: 9s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(19) .qodef-e-title, .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(19) .qodef-e-text { transition-delay: 9.15s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(20) { transition-delay: 9.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(20) .qodef-e-line-inner { transition-delay: 9.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(20) .qodef-e-icon { transition-delay: 9.5s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(20) .qodef-e-title, .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear .qodef-e:nth-child(20) .qodef-e-text { transition-delay: 9.65s; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear.qodef-qi--appeared .qodef-e .qodef-e-line-inner { transform: scaleY(1); } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear.qodef-qi--appeared .qodef-e .qodef-e-icon { opacity: 1; } .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear.qodef-qi--appeared .qodef-e .qodef-e-title, .qodef-qi-process.qodef-item-layout--vertical.qodef-qi--has-appear.qodef-qi--appeared .qodef-e .qodef-e-text { transform: translateX(0); opacity: 1; } /* ========================================================================== Progress Bar - Circle shortcode styles ========================================================================== */ .qodef-qi-progress-bar-circle { position: relative; visibility: hidden; } .qodef-qi-progress-bar-circle.qodef--init { visibility: visible; } .qodef-qi-progress-bar-circle .qodef-m-inner { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; } .qodef-qi-progress-bar-circle .qodef-m-canvas { position: relative; width: 100%; } .qodef-qi-progress-bar-circle .qodef-m-title { margin: 2em 0 0; } .qodef-qi-progress-bar-circle .qodef-m-text { margin: 0.5em 0 0 0; } .qodef-qi-progress-bar-circle .qodef-m-value { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 0; margin: 0; font-size: 62px; } .qodef-qi-progress-bar-circle .qodef-m-percentage { font-size: 60%; top: -0.3em; } /* ========================================================================== Progress Bar - Horizontal shortcode styles ========================================================================== */ .qodef-qi-progress-bar-horizontal { position: relative; visibility: hidden; } .qodef-qi-progress-bar-horizontal.qodef--init { visibility: visible; } .qodef-qi-progress-bar-horizontal.qodef--pattern .qodef-m-canvas svg path:first-child { opacity: 0; } .qodef-qi-progress-bar-horizontal .qodef-m-inner { position: relative; display: flex; flex-direction: column; } .qodef-qi-progress-bar-horizontal .qodef-m-canvas { position: relative; width: 100%; } .qodef-qi-progress-bar-horizontal .qodef-m-content { display: flex; align-items: center; } .qodef-qi-progress-bar-horizontal .qodef-m-title { margin: 0 0 .5em; } .qodef-qi-progress-bar-horizontal .qodef-m-value { padding: 0; margin: 0 0 .5em; font-size: 16px; position: absolute; } .qodef-qi-progress-bar-horizontal.qodef-percentage--floating-on .qodef-m-value { margin: 0; transform: translateY(100%); z-index: 1; } .qodef-qi-progress-bar-horizontal.qodef-percentage--floating-above .qodef-m-value-inner { opacity: 0; transition: opacity .2s .5s; } .qodef-qi-progress-bar-horizontal.qodef-percentage--floating-above.qodef--init .qodef-m-value-inner { opacity: 1; } .qodef-qi-progress-bar-horizontal.qodef-percentage--fixed-on .qodef-m-content { position: absolute; transform: translateY(-50%); top: 50%; left: 0; z-index: 1; } .qodef-qi-progress-bar-horizontal.qodef-percentage--fixed-on .qodef-m-title { margin: 0 0 0 .5em; } .qodef-qi-progress-bar-horizontal.qodef-percentage--fixed-on .qodef-m-value { margin: 0 0 0 .5em; position: relative; } .qodef-qi-progress-bar-horizontal.qodef-percentage--fixed-above .qodef-m-value { right: 0; } /* ========================================================================== Progress Bar - Vertical shortcode styles ========================================================================== */ .qodef-qi-progress-bar-vertical { position: relative; visibility: hidden; } .qodef-qi-progress-bar-vertical.qodef--init { visibility: visible; } .qodef-qi-progress-bar-vertical.qodef--pattern .qodef-m-canvas svg path:first-child { opacity: 0; } .qodef-qi-progress-bar-vertical .qodef-m-inner { position: relative; display: flex; flex-direction: column; max-width: 100%; } .qodef-qi-progress-bar-vertical .qodef-m-canvas { position: relative; } .qodef-qi-progress-bar-vertical .qodef-m-canvas svg { max-width: 100%; } .qodef-qi-progress-bar-vertical .qodef-m-title { margin: 1em 0 0; } .qodef-qi-progress-bar-vertical .qodef-m-value { padding: 0; margin: 0; font-size: 16px; } .qodef-qi-progress-bar-vertical.qodef-percentage--fixed-right .qodef-m-title { margin: 0 0 0 1em; } .qodef-qi-progress-bar-vertical.qodef-percentage--fixed-right .qodef-m-value { margin: 0 0 0 1em; } .qodef-qi-progress-bar-vertical.qodef-percentage--fixed-right .qodef-m-inner { flex-direction: row; align-items: flex-end; } .qodef-qi-progress-bar-vertical.qodef-percentage--floating-top .qodef-m-value { position: absolute; margin: 0 0 .5em; right: 0; } .qodef-qi-progress-bar-vertical.qodef-percentage--floating-top .qodef-m-title { position: absolute; margin: 0 0 .5em; left: 0; } .qodef-qi-progress-bar-vertical.qodef-percentage--fixed-on .qodef-m-content { display: flex; align-items: center; position: absolute; bottom: 0; left: 0; } .qodef-qi-progress-bar-vertical.qodef-percentage--fixed-on .qodef-m-title { margin: 0 0 0 .5em; } .qodef-qi-progress-bar-vertical.qodef-percentage--fixed-on .qodef-m-value { margin: 0 0 0 .5em; } /* ========================================================================== Section Title shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Global mixins ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ .qodef-qi-section-title { position: relative; } .qodef-qi-section-title .qodef-m-title { margin: 0; } .qodef-qi-section-title .qodef-m-subtitle { display: inline-flex; align-items: baseline; margin: 0; } .qodef-subtitle-icon--right.qodef-qi-section-title .qodef-m-subtitle { flex-direction: row; } .qodef-subtitle-icon--left.qodef-qi-section-title .qodef-m-subtitle { flex-direction: row-reverse; } .qodef-qi-section-title .qodef-m-icon-holder { display: inline-block; line-height: 1em; } .qodef-qi-section-title .qodef-m-icon-holder svg { width: 1em; height: auto; fill: currentColor; stroke: currentColor; } .qodef-qi-section-title > .qodef-m-text { margin: 0.5em 0 0; } .qodef-qi-section-title .qodef-m-button { margin-top: .65em; } .qodef-qi-section-title.qodef-decoration--underline .qodef-e-decorated { text-decoration: underline; } .qodef-qi-section-title.qodef-decoration--italic .qodef-e-decorated { font-style: italic; } .qodef-qi-section-title.qodef-decoration--bold .qodef-e-decorated { font-weight: 700; } .qodef-qi-section-title.qodef-link--underline-draw .qodef-e-link { width: 100%; background-repeat: no-repeat; background-image: linear-gradient(transparent calc(100% - .07em), currentColor 0.07em); background-size: 100% 87%; } .qodef-qi-section-title.qodef-link--underline-draw .qodef-e-link:hover { color: currentColor; text-decoration: none; animation: qodef-animate-underline-multiline 1.1s cubic-bezier(0.32, 0.32, 0.15, 1.17) forwards; } .qodef-qi-section-title.qodef-link--underline-draw .qodef-e-link:focus { color: currentColor; } .qodef-qi-section-title.qodef-text-link--underline > .qodef-m-text a { width: 100%; background-repeat: no-repeat; background-image: linear-gradient(transparent calc(100% - 1px), currentColor 1px); transition: 0.9s cubic-bezier(0.32, 0.32, 0.15, 1.17); background-size: 0 100%; } .qodef-qi-section-title.qodef-text-link--underline > .qodef-m-text a:hover { text-decoration: none; background-size: 100% 100%; } .qodef-qi-section-title.qodef-text-link--underline-thick > .qodef-m-text a { width: 100%; background-repeat: no-repeat; background-image: linear-gradient(transparent calc(100% - 2px), currentColor 2px); transition: 0.9s cubic-bezier(0.32, 0.32, 0.15, 1.17); background-size: 0 100%; } .qodef-qi-section-title.qodef-text-link--underline-thick > .qodef-m-text a:hover { text-decoration: none; background-size: 100% 100%; } @keyframes qodef-qi-animate-underline-multiline-thick { 0% { background-size: 100% 93%; background-position-x: right; } 38% { background-size: 0% 93%; background-position-x: right; } 39% { background-size: 0% 93%; background-position-x: left; } 100% { background-size: 100% 93%; background-position-x: left; } } .qodef-qi-section-title.qodef-text-link--underline-initial > .qodef-m-text a { background-repeat: no-repeat; background-image: linear-gradient(transparent calc(100% - .07em), currentColor 0.07em); background-size: 100% 93%; } .qodef-qi-section-title.qodef-text-link--underline-initial > .qodef-m-text a:hover { text-decoration: none; animation: qodef-qi-animate-underline-multiline-thick 1.1s cubic-bezier(0.32, 0.32, 0.15, 1.17) forwards; } /* ========================================================================== Section Title shortcode responsive styles ========================================================================== */ @media only screen and (max-width: 1024px) { .qodef-qi-section-title.qodef-title-break--disabled .qodef-m-title br { display: none; } } /* ========================================================================== Separator shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ .qodef-qi-separator { position: relative; height: auto; font-size: 0; line-height: 1; } .qodef-qi-separator .qodef-m-line { position: relative; display: inline-block; width: 100%; vertical-align: top; font-size: 1px; color: #111; border-bottom: 1em solid currentColor; margin: 10px 0; } .qodef-qi-separator.qodef-position--center { text-align: center; } .qodef-qi-separator.qodef-position--left { text-align: left; } .qodef-qi-separator.qodef-position--right { text-align: right; } /* ========================================================================== Separator shortcode styles ========================================================================== */ .qodef-qi-separator.qodef-separator--border-image .qodef-m-line { font-size: 12px; height: 1em; border-bottom: none; margin: 10px 0; background-size: contain; background-repeat: round; } /* ========================================================================== Separator shortcode styles ========================================================================== */ .qodef-qi-separator.qodef-separator--with-icon { display: flex; } .qodef-qi-separator.qodef-separator--with-icon .qodef-m-line { display: flex; align-items: center; border-width: 0; } .qodef-qi-separator.qodef-separator--with-icon .qodef-m-separator-icon { flex-shrink: 0; font-size: 1rem; margin: 0 1em; } .qodef-qi-separator.qodef-separator--with-icon .qodef-m-separator-icon svg { width: 1em; fill: currentColor; stroke: currentColor; } .qodef-qi-separator.qodef-separator--with-icon .qodef-m-inner-line { width: 50%; border-color: currentColor; border-style: inherit; border-width: 1em; } .qodef-qi-separator.qodef-separator--with-icon.qodef-position--center { justify-content: center; } .qodef-qi-separator.qodef-separator--with-icon.qodef-position--left { justify-content: flex-start; } .qodef-qi-separator.qodef-separator--with-icon.qodef-position--right { justify-content: flex-end; } /* ========================================================================== Slider Switch shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ .qodef-qi-slider-switch { position: relative; opacity: 0; transition: opacity .35s ease-out; } .qodef-qi-slider-switch.qodef--visible { opacity: 1; } .qodef-qi-slider-switch .qodef-m-main-text { margin-bottom: 30px; } .qodef-qi-slider-switch .qodef-m-main-text .qodef-e-title { margin: 0 0 0.7em; } .qodef-qi-slider-switch .qodef-m-main-text .qodef-e-text { margin: 0; } .qodef-qi-slider-switch .qodef-m-main { position: relative; } .qodef-qi-slider-switch .qodef-m-main-slider { position: absolute; top: 50px; left: 50px; right: 50px; bottom: 50px; border-radius: 10%; } .qodef-qi-slider-switch .qodef-m-main-slider .qodef-qi-swiper-container { height: 100%; z-index: unset; } .qodef-qi-slider-switch .qodef-m-main-slider .swiper-slide a { height: 100%; } .qodef-qi-slider-switch .qodef-slider-main-image { position: relative; z-index: 5; pointer-events: none; } .qodef-qi-slider-switch .qodef-slider-main-image img { width: 100%; } .qodef-qi-slider-switch .qodef-slider-switch-device-holder { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); z-index: 10; } .qodef-qi-slider-switch .qodef-slider-switch-device { position: absolute; margin: auto; width: 214px; bottom: -50px; right: 50px; overflow: hidden; } .qodef-qi-slider-switch .qodef-slider-switch-device .qodef-slider-switch-device-image { position: relative; pointer-events: none; z-index: 10; } .qodef-qi-slider-switch .qodef-slider-switch-device .qodef-slider-switch-device-image img { width: 100%; filter: drop-shadow(0px 6px 16.8px rgba(0, 0, 0, 0.07)); } .qodef-qi-slider-switch .qodef-slider-switch-device .qodef-m-items { position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 5; } .qodef-qi-slider-switch .qodef-slider-switch-device .qodef-qi-swiper-container { overflow: hidden; height: 100%; padding: 0 !important; } .qodef-qi-slider-switch .qodef-slider-switch-device .qodef-m-item { height: 100%; } .qodef-qi-slider-switch .qodef-slider-switch-device .qodef-m-item a { height: 100%; } .qodef-qi-slider-switch .qodef-slider-switch-device .qodef-m-item img { height: 100%; width: 100%; object-fit: cover; } .qodef-qi-slider-switch .qodef-m-main-text a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; } .qodef-qi-slider-switch .qodef-m-main-text .swiper-slide .qodef-e-title, .qodef-qi-slider-switch .qodef-m-main-text .swiper-slide .qodef-e-text { opacity: 0; transform: translateX(40px); transition: .3s ease-in-out; } .qodef-qi-slider-switch .qodef-m-main-text .swiper-slide.swiper-slide-active .qodef-e-title, .qodef-qi-slider-switch .qodef-m-main-text .swiper-slide.swiper-slide-active .qodef-e-text { opacity: 1; transform: translateX(0px); } .qodef-qi-slider-switch .qodef-m-main-text .swiper-slide.swiper-slide-active .qodef-e-title { transition: opacity 0.35s 0.2s, transform 0.65s cubic-bezier(0.26, 0, 0, 1.01) 0.2s; } .qodef-qi-slider-switch .qodef-m-main-text .swiper-slide.swiper-slide-active .qodef-e-text { transition: opacity 0.35s 0.35s, transform 0.65s cubic-bezier(0.26, 0, 0, 1.01) 0.35s; } /* ========================================================================== Section Title shortcode styles ========================================================================== */ /* ========================================================================== Global mixins ========================================================================== */ .qodef-qi-table-of-contents { position: relative; } .qodef-qi-table-of-contents .qodef-m-title { margin: 0; } .qodef-qi-table-of-contents .qodef-m-subtitle { margin: 0; } .qodef-qi-table-of-contents .qodef-m-text { margin: 0.5em 0 0; } .qodef-qi-table-of-contents .qodef-m-table-content { margin-top: 1.5em; } .qodef-qi-table-of-contents .qodef-m-table-content a { position: relative; color: inherit; font-family: inherit; font-size: inherit; font-weight: inherit; font-style: inherit; line-height: inherit; letter-spacing: inherit; text-transform: inherit; } .qodef-list-underline.qodef-qi-table-of-contents .qodef-m-table-content a { width: 100%; background-repeat: no-repeat; background-image: linear-gradient(transparent calc(100% - 1px), currentColor 1px); transition: 0.55s cubic-bezier(0.32, 0.32, 0.15, 1.17); background-size: 0 100%; } .qodef-list-underline.qodef-qi-table-of-contents .qodef-m-table-content a:hover { background-size: 100% 100%; } .qodef-qi-table-of-contents.qodef-list-position--inside ol, .qodef-qi-table-of-contents.qodef-list-position--inside ul { list-style-position: inside; } .qodef-qi-table-of-contents.qodef-list-position--inside .qodef-m-table-content > ol, .qodef-qi-table-of-contents.qodef-list-position--inside .qodef-m-table-content > ul { margin-left: 0 !important; } .qodef-qi-table-of-contents.qodef-list-position--outside ol, .qodef-qi-table-of-contents.qodef-list-position--outside ul { list-style-position: outside; } /* ========================================================================== Horizontal Tabs shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ .qodef-qi-tabs-horizontal.qodef-layout--simple { position: relative; visibility: hidden; } .qodef-qi-tabs-horizontal.qodef-layout--simple.qodef--init { visibility: visible; } .qodef-qi-tabs-horizontal.qodef-layout--simple .qodef-tabs-horizontal-navigation { position: relative; display: flex; align-items: center; margin: 0; padding: 0; list-style: none; } @media only screen and (max-width: 680px) { .qodef-qi-tabs-horizontal.qodef-layout--simple .qodef-tabs-horizontal-navigation { flex-direction: column; align-items: flex-start; } .qodef-qi-tabs-horizontal.qodef-layout--simple .qodef-tabs-horizontal-navigation li, .qodef-qi-tabs-horizontal.qodef-layout--simple .qodef-tabs-horizontal-navigation .qodef-tab-title { width: 100%; } } .qodef-qi-tabs-horizontal.qodef-layout--simple .qodef-tabs-horizontal-navigation li { position: relative; margin: 0; padding: 0; } .qodef-qi-tabs-horizontal.qodef-layout--simple .qodef-tabs-horizontal-navigation li .qodef-tab-title { margin: 0; } .qodef-qi-tabs-horizontal.qodef-layout--simple .qodef-tabs-horizontal-navigation li a { position: relative; color: #cacaca; display: block; padding: 0; transition: color .25s ease-out; } .qodef-qi-tabs-horizontal.qodef-layout--simple .qodef-tabs-horizontal-navigation li a:after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; z-index: 1; opacity: 0; transition: opacity .25s ease-out; } .qodef-qi-tabs-horizontal.qodef-layout--simple .qodef-tabs-horizontal-navigation li a:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; background-color: transparent; transition: opacity .25s ease-out; } .qodef-qi-tabs-horizontal.qodef-layout--simple .qodef-tabs-horizontal-navigation li a .q-text { z-index: 1; position: relative; } .qodef-qi-tabs-horizontal.qodef-layout--simple .qodef-tabs-horizontal-navigation li:not(:last-child) { margin-right: 4em; } .qodef-qi-tabs-horizontal.qodef-layout--simple .qodef-tabs-horizontal-navigation li.ui-state-active a, .qodef-qi-tabs-horizontal.qodef-layout--simple .qodef-tabs-horizontal-navigation li.ui-state-hover a { color: #1e1e1e; } .qodef-qi-tabs-horizontal.qodef-layout--simple .qodef-tabs-horizontal-navigation li.ui-state-active a:after, .qodef-qi-tabs-horizontal.qodef-layout--simple .qodef-tabs-horizontal-navigation li.ui-state-active a:before, .qodef-qi-tabs-horizontal.qodef-layout--simple .qodef-tabs-horizontal-navigation li.ui-state-hover a:after, .qodef-qi-tabs-horizontal.qodef-layout--simple .qodef-tabs-horizontal-navigation li.ui-state-hover a:before { opacity: 1; } .qodef-qi-tabs-horizontal.qodef-layout--simple .qodef-tabs-horizontal-content { position: relative; padding: 26px 0 0; } .qodef-qi-tabs-horizontal.qodef-layout--simple.qodef-title-hover--underline-draw .qodef-tabs-horizontal-navigation li a:after { opacity: 1; transform: scaleX(0); transition: transform 0.36s cubic-bezier(0.51, 0.5, 0.07, 0.99); } .qodef-qi-tabs-horizontal.qodef-layout--simple.qodef-title-hover--underline-draw .qodef-tabs-horizontal-navigation li.ui-state-active a:after, .qodef-qi-tabs-horizontal.qodef-layout--simple.qodef-title-hover--underline-draw .qodef-tabs-horizontal-navigation li.ui-state-hover a:after { transform: scaleX(1); } .qodef-qi-tabs-horizontal.qodef-layout--simple.qodef-title-hover--underline-draw.qodef-title-underline-from-left .qodef-tabs-horizontal-navigation li a:after { transform-origin: left; } .qodef-qi-tabs-horizontal.qodef-layout--simple.qodef-title-hover--underline-draw.qodef-title-underline-from-right .qodef-tabs-horizontal-navigation li a:after { left: unset; right: 0; transform: scaleX(1); width: 0; transition: width 0.36s cubic-bezier(0.51, 0.5, 0.07, 0.99); } .qodef-qi-tabs-horizontal.qodef-layout--simple.qodef-title-hover--underline-draw.qodef-title-underline-from-right .qodef-tabs-horizontal-navigation li.ui-state-active a:after, .qodef-qi-tabs-horizontal.qodef-layout--simple.qodef-title-hover--underline-draw.qodef-title-underline-from-right .qodef-tabs-horizontal-navigation li.ui-state-hover a:after { width: 100%; } /* ========================================================================== Vertical Tabs shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ .qodef-qi-tabs-vertical.qodef-layout--simple { position: relative; visibility: hidden; display: flex; align-items: stretch; height: 100%; } .qodef-qi-tabs-vertical.qodef-layout--simple.qodef--init { visibility: visible; } .qodef-qi-tabs-vertical.qodef-layout--simple .qodef-tabs-vertical-navigation { position: relative; align-items: center; margin: 0; padding: 0; list-style: none; flex-shrink: 0; display: block; } .qodef-qi-tabs-vertical.qodef-layout--simple .qodef-tabs-vertical-navigation li { position: relative; margin: 0; padding: 0; width: 100%; } .qodef-qi-tabs-vertical.qodef-layout--simple .qodef-tabs-vertical-navigation li .qodef-tab-title { margin: 0; } .qodef-qi-tabs-vertical.qodef-layout--simple .qodef-tabs-vertical-navigation li a { position: relative; color: #cacaca; display: block; padding: 0; transition: color .25s ease-out; } .qodef-qi-tabs-vertical.qodef-layout--simple .qodef-tabs-vertical-navigation li a:after { height: 100%; content: ''; position: absolute; top: 0; right: 0; width: 100%; z-index: 1; opacity: 0; transition: opacity .25s ease-out; } .qodef-qi-tabs-vertical.qodef-layout--simple .qodef-tabs-vertical-navigation li a:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; background-color: transparent; transition: opacity .25s ease-out; } .qodef-qi-tabs-vertical.qodef-layout--simple .qodef-tabs-vertical-navigation li.ui-state-active a, .qodef-qi-tabs-vertical.qodef-layout--simple .qodef-tabs-vertical-navigation li.ui-state-hover a { color: #1e1e1e; } .qodef-qi-tabs-vertical.qodef-layout--simple .qodef-tabs-vertical-navigation li.ui-state-active a:after, .qodef-qi-tabs-vertical.qodef-layout--simple .qodef-tabs-vertical-navigation li.ui-state-active a:before, .qodef-qi-tabs-vertical.qodef-layout--simple .qodef-tabs-vertical-navigation li.ui-state-hover a:after, .qodef-qi-tabs-vertical.qodef-layout--simple .qodef-tabs-vertical-navigation li.ui-state-hover a:before { opacity: 1; } .qodef-qi-tabs-vertical.qodef-layout--simple .qodef-tabs-vertical-navigation li .q-text { z-index: 1; position: relative; } .qodef-qi-tabs-vertical.qodef-layout--simple .qodef-tabs-vertical-content { position: relative; padding: 0 0 0 26px; } .qodef-qi-tabs-vertical.qodef-layout--simple.qodef-title-hover--sideline-draw .qodef-tabs-vertical-navigation li a:after { opacity: 1; transform: scaleY(0); transition: transform 0.36s cubic-bezier(0.51, 0.5, 0.07, 0.99); } .qodef-qi-tabs-vertical.qodef-layout--simple.qodef-title-hover--sideline-draw .qodef-tabs-vertical-navigation li.ui-state-active a:after, .qodef-qi-tabs-vertical.qodef-layout--simple.qodef-title-hover--sideline-draw .qodef-tabs-vertical-navigation li.ui-state-hover a:after { transform: scaleY(1); } .qodef-qi-tabs-vertical.qodef-layout--simple.qodef-title-hover--sideline-draw.qodef-title-sideline-from-top .qodef-tabs-vertical-navigation li a:after { transform-origin: top; } @media only screen and (max-width: 1024px) { .qodef-qi-tabs-vertical.qodef-layout--simple.qodef-responsive--1024 { flex-direction: column; align-items: flex-start; } .qodef-qi-tabs-vertical.qodef-layout--simple.qodef-responsive--1024 .qodef-tabs-vertical-navigation { width: 100%; } .qodef-qi-tabs-vertical.qodef-layout--simple.qodef-responsive--1024 .qodef-tabs-vertical-content { padding: 26px 0 0; } } @media only screen and (max-width: 768px) { .qodef-qi-tabs-vertical.qodef-layout--simple.qodef-responsive--768 { flex-direction: column; align-items: flex-start; } .qodef-qi-tabs-vertical.qodef-layout--simple.qodef-responsive--768 .qodef-tabs-vertical-navigation { width: 100%; } .qodef-qi-tabs-vertical.qodef-layout--simple.qodef-responsive--768 .qodef-tabs-vertical-content { padding: 26px 0 0; } } @media only screen and (max-width: 680px) { .qodef-qi-tabs-vertical.qodef-layout--simple.qodef-responsive--680 { flex-direction: column; align-items: flex-start; } .qodef-qi-tabs-vertical.qodef-layout--simple.qodef-responsive--680 .qodef-tabs-vertical-navigation { width: 100%; } .qodef-qi-tabs-vertical.qodef-layout--simple.qodef-responsive--680 .qodef-tabs-vertical-content { padding: 26px 0 0; } } @media only screen and (max-width: 480px) { .qodef-qi-tabs-vertical.qodef-layout--simple.qodef-responsive--480 { flex-direction: column; align-items: flex-start; } .qodef-qi-tabs-vertical.qodef-layout--simple.qodef-responsive--480 .qodef-tabs-vertical-navigation { width: 100%; } .qodef-qi-tabs-vertical.qodef-layout--simple.qodef-responsive--480 .qodef-tabs-vertical-content { padding: 26px 0 0; } } /* ========================================================================== Team lists shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ /* ========================================================================== Global mixins ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ .qodef-qi-team-member .qodef-m-title { margin: 0; } .qodef-qi-team-member .qodef-m-role { margin: 0 0 .8em; } .qodef-qi-team-member .qodef-m-text { margin: 0 0 .8em; } .qodef-qi-team-member .qodef-m-social-icons { font-size: 0; margin: 0; } .qodef-qi-team-member .qodef-m-social-icons > * { font-size: 1rem; margin-right: 0.7em; } .qodef-qi-team-member .qodef-m-social-icons > *:last-child { margin: 0; } .qodef-qi-team-member .qodef-e-social-icon { transition: color 0.2s ease-out; } .qodef-qi-team-member .qodef-e-social-icon i { font-size: inherit; } .qodef-qi-team-member .qodef-e-social-icon svg { width: 1em; fill: currentColor; stroke: currentColor; vertical-align: middle; } .qodef-qi-team-member.qodef-image--hover-zoom img, .qodef-qi-team-member.qodef-image--hover-scale img { transform: scale(1.005) translateZ(0); transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); will-change: transform; } .qodef-qi-team-member.qodef-image--hover-zoom:hover img, .qodef-qi-team-member.qodef-image--hover-scale:hover img { transform: scale(1.03); } .qodef-qi-team-member.qodef-image--hover-zoom .qodef-m-media-image { overflow: hidden; } .qodef-qi-team-member.qodef-item-layout--info-below .qodef-m-content { margin: 0.9em 0 0; } .qodef-qi-team-member.qodef-item-layout--info-below-left .qodef-m-inner { position: relative; overflow: hidden; } .qodef-qi-team-member.qodef-item-layout--info-below-left .qodef-m-inner:hover .qodef-m-title, .qodef-qi-team-member.qodef-item-layout--info-below-left .qodef-m-inner:hover .qodef-m-role, .qodef-qi-team-member.qodef-item-layout--info-below-left .qodef-m-inner:hover .qodef-m-social-icons { transform: translateX(0); opacity: 1; } .qodef-qi-team-member.qodef-item-layout--info-below-left .qodef-m-inner:hover .qodef-m-role { transition-delay: .15s; } .qodef-qi-team-member.qodef-item-layout--info-below-left .qodef-m-inner:hover .qodef-m-social-icons { transition-delay: .3s; } .qodef-qi-team-member.qodef-item-layout--info-below-left .qodef-m-content { margin: 0.9em 0 0; } .qodef-qi-team-member.qodef-item-layout--info-below-left .qodef-m-content .qodef-m-title, .qodef-qi-team-member.qodef-item-layout--info-below-left .qodef-m-content .qodef-m-role, .qodef-qi-team-member.qodef-item-layout--info-below-left .qodef-m-content .qodef-m-social-icons { opacity: 0; transform: translateX(30px); transition: transform 0.45s cubic-bezier(0.16, 0.32, 0.26, 0.92), opacity 0.45s ease-out; transition-delay: 0s, 0s; } .qodef-qi-team-member.qodef-item-layout--info-from-bottom .qodef-m-inner { position: relative; overflow: hidden; } .qodef-qi-team-member.qodef-item-layout--info-from-bottom .qodef-m-inner:hover .qodef-m-content { transform: translateY(0); } .qodef-qi-team-member.qodef-item-layout--info-from-bottom .qodef-m-content { position: absolute; width: 100%; bottom: 0; left: 0; background-color: #fff; display: flex; justify-content: center; align-items: center; flex-direction: column; opacity: 1; transform: translateY(100%); transition: transform 0.4s cubic-bezier(0.22, 0.61, 0.36, 1); padding: 30px; z-index: 1; } .qodef-qi-team-member.qodef-item-layout--info-on-hover .qodef-m-inner { position: relative; display: inline-block; vertical-align: top; } .qodef-qi-team-member.qodef-item-layout--info-on-hover .qodef-m-inner:hover .qodef-m-content { opacity: 1; } .qodef-qi-team-member.qodef-item-layout--info-on-hover .qodef-m-inner .qodef-m-image, .qodef-qi-team-member.qodef-item-layout--info-on-hover .qodef-m-inner .qodef-m-media-image { display: inline-block; vertical-align: top; } .qodef-qi-team-member.qodef-item-layout--info-on-hover .qodef-m-content { position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: #111; display: flex; justify-content: center; align-items: center; flex-direction: column; opacity: 0; transition: opacity .3s ease-in-out; padding: 20px 30px; } .qodef-qi-team-member.qodef-item-layout--info-on-hover .qodef-m-content > * { width: 100%; } .qodef-qi-team-member.qodef-item-layout--info-on-hover .qodef-m-title { color: #fff; } .qodef-qi-team-member.qodef-item-layout--info-on-hover .qodef-m-role { color: #c4c4c4; } .qodef-qi-team-member.qodef-item-layout--info-on-hover-inset .qodef-m-inner { position: relative; display: inline-block; vertical-align: top; } .qodef-qi-team-member.qodef-item-layout--info-on-hover-inset .qodef-m-inner:hover .qodef-m-content { opacity: 1; -webkit-clip-path: inset(10px 10px 10px 10px); clip-path: inset(10px 10px 10px 10px); transition-delay: 0s, .15s; } .qodef-qi-team-member.qodef-item-layout--info-on-hover-inset .qodef-m-inner .qodef-m-image, .qodef-qi-team-member.qodef-item-layout--info-on-hover-inset .qodef-m-inner .qodef-m-media-image { display: inline-block; vertical-align: top; } .qodef-qi-team-member.qodef-item-layout--info-on-hover-inset .qodef-m-content { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #fff; display: flex; justify-content: center; align-items: center; flex-direction: column; opacity: 0; transition: opacity 0.25s ease-out, all 0.3s cubic-bezier(0.46, 0.03, 0.52, 0.96); -webkit-clip-path: inset(0px 0px 0px 0px); clip-path: inset(0px 0px 0px 0px); padding: 5%; } .qodef-qi-team-member.qodef-item-layout--info-on-hover-inset .qodef-m-content > * { width: 100%; } /* ========================================================================== Testimonials list shortcode styles ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ .qodef-qi-testimonials-list .qodef-e-title { margin: 0 0 0.7em; } .qodef-qi-testimonials-list .qodef-e-text { margin: 0; } .qodef-qi-testimonials-list .qodef-e-media-image { display: inline-block; vertical-align: top; line-height: 0; } .qodef-qi-testimonials-list .qodef-e-quote { font-size: 1em; line-height: 0; margin: auto; } .qodef-qi-testimonials-list .qodef-e-quote svg { width: 1em; fill: currentColor; stroke: currentColor; } .qodef-qi-testimonials-list .qodef-e-author { display: flex; margin: 0; } .qodef-qi-testimonials-list .qodef-e-author-name { margin: 0; } /* ========================================================================== Testimonials list shortcode styles ========================================================================== */ .qodef-qi-testimonials-list.qodef-item-layout--boxed .qodef-e-media-image { margin-bottom: 1.8em; border-radius: 50%; overflow: hidden; } .qodef-qi-testimonials-list.qodef-item-layout--boxed .qodef-e-inner { position: relative; text-align: center; padding: 55px 40px; background-color: #f6f6f6; overflow: hidden; } .qodef-qi-testimonials-list.qodef-item-layout--boxed .qodef-e-top, .qodef-qi-testimonials-list.qodef-item-layout--boxed .qodef-e-content { position: relative; } .qodef-qi-testimonials-list.qodef-item-layout--boxed .qodef-e-quote { position: absolute; top: -.1em; left: 50%; font-size: 14em; color: rgba(0, 0, 0, 0.2); transform: translateX(-50%); } .qodef-qi-testimonials-list.qodef-item-layout--boxed .qodef-e-text { margin: 0 0 1em; } .qodef-qi-testimonials-list.qodef-item-layout--boxed .qodef-e-author { flex-direction: column; } .qodef-qi-testimonials-list.qodef-item-layout--boxed .qodef-e-author-job { margin: .2em 0 0; } /* ========================================================================== Testimonials list shortcode styles ========================================================================== */ .qodef-qi-testimonials-list.qodef-item-layout--info-below .qodef-e-inner { text-align: center; } .qodef-qi-testimonials-list.qodef-item-layout--info-below .qodef-e-quote { font-size: 2em; margin-bottom: 1.2em; } .qodef-qi-testimonials-list.qodef-item-layout--info-below .qodef-e-text { margin: 0 0 1.3em; } .qodef-qi-testimonials-list.qodef-item-layout--info-below .qodef-e-media-image { width: 50px; margin-bottom: 0.5em; border-radius: 50%; overflow: hidden; } .qodef-qi-testimonials-list.qodef-item-layout--info-below .qodef-e-author { flex-direction: column; } .qodef-qi-testimonials-list.qodef-item-layout--info-below .qodef-e-author-job { margin: .2em 0 0; } /* ========================================================================== Testimonials list shortcode styles ========================================================================== */ .qodef-qi-testimonials-list.qodef-item-layout--side-quote .qodef-e-inner { display: flex; } @media only screen and (max-width: 480px) { .qodef-qi-testimonials-list.qodef-item-layout--side-quote .qodef-e-inner { flex-direction: column; } } .qodef-qi-testimonials-list.qodef-item-layout--side-quote .qodef-e-quote { font-size: 100px; width: 1em; margin: 0 35px 0 0; } .qodef-qi-testimonials-list.qodef-item-layout--side-quote .qodef-e-quote i, .qodef-qi-testimonials-list.qodef-item-layout--side-quote .qodef-e-quote svg { vertical-align: top; } @media only screen and (max-width: 480px) { .qodef-qi-testimonials-list.qodef-item-layout--side-quote .qodef-e-quote { margin: 0 0 35px; } } .qodef-qi-testimonials-list.qodef-item-layout--side-quote .qodef-e-content { flex: 1; text-align: left; } .qodef-qi-testimonials-list.qodef-item-layout--side-quote .qodef-e-bottom-info { display: flex; align-items: center; } .qodef-qi-testimonials-list.qodef-item-layout--side-quote .qodef-e-media-image { width: 50px; margin: 0 10px 0 0; } .qodef-qi-testimonials-list.qodef-item-layout--side-quote .qodef-e-author { flex-direction: row; align-items: baseline; } .qodef-qi-testimonials-list.qodef-item-layout--side-quote .qodef-e-author-job:before { content: ''; display: inline-block; vertical-align: middle; height: 1px; width: 1em; background-color: currentColor; margin: 0 .65em; } /* ========================================================================== Testimonials list shortcode styles ========================================================================== */ .qodef-qi-testimonials-list.qodef-item-layout--side-with-image .qodef-e-inner { display: flex; align-items: flex-start; } @media only screen and (max-width: 680px) { .qodef-qi-testimonials-list.qodef-item-layout--side-with-image .qodef-e-inner { flex-direction: column; align-items: flex-start; } } .qodef-qi-testimonials-list.qodef-item-layout--side-with-image .qodef-e-side { position: relative; flex-shrink: 0; width: 110px; max-width: 30%; margin-right: 6%; } .qodef-qi-testimonials-list.qodef-item-layout--side-with-image .qodef-e-side .qodef-e-media-image { border-radius: 25%; overflow: hidden; } @media only screen and (max-width: 680px) { .qodef-qi-testimonials-list.qodef-item-layout--side-with-image .qodef-e-side { max-width: 100%; } } .qodef-qi-testimonials-list.qodef-item-layout--side-with-image .qodef-e-quote { position: absolute; bottom: -0.5em; right: -0.5em; width: 2em; height: 2em; display: flex; align-items: center; justify-content: center; color: #fff; background-color: #111; border-radius: 50%; } .qodef-qi-testimonials-list.qodef-item-layout--side-with-image .qodef-e-content { flex: 1; text-align: left; } .qodef-qi-testimonials-list.qodef-item-layout--side-with-image .qodef-e-text { margin: 0 0 1em; } .qodef-qi-testimonials-list.qodef-item-layout--side-with-image .qodef-e-author { flex-direction: column; } .qodef-qi-testimonials-list.qodef-item-layout--side-with-image .qodef-e-author-job { margin: .2em 0 0; } /* ========================================================================== Testimonials list shortcode styles ========================================================================== */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ .qodef-qi-testimonials-slider .qodef-e-inner { overflow: hidden; } .qodef-qi-testimonials-slider .qodef-e-title { margin: 0 0 0.7em; } .qodef-qi-testimonials-slider .qodef-e-text { margin: 0; } .qodef-qi-testimonials-slider .qodef-e-media-image { display: inline-block; vertical-align: top; line-height: 0; } .qodef-qi-testimonials-slider .qodef-e-quote { font-size: 1em; line-height: 0; margin: auto; } .qodef-qi-testimonials-slider .qodef-e-quote svg { width: 1em; fill: currentColor; stroke: currentColor; } .qodef-qi-testimonials-slider .qodef-e-author { display: flex; margin: 0; } .qodef-qi-testimonials-slider .qodef-e-author-name { margin: 0; } .qodef-qi-testimonials-slider.qodef--swiper-fade .swiper-slide { opacity: 0; transition: opacity .2s ease-out; } .qodef-qi-testimonials-slider.qodef--swiper-fade .swiper-slide.swiper-slide-active, .qodef-qi-testimonials-slider.qodef--swiper-fade .swiper-slide.swiper-slide-duplicate-active { opacity: 1; } /* ========================================================================== Testimonials list shortcode styles ========================================================================== */ .qodef-qi-testimonials-slider.qodef-item-layout--boxed .qodef-e-media-image { margin-bottom: 1em; border-radius: 50%; overflow: hidden; } .qodef-qi-testimonials-slider.qodef-item-layout--boxed .qodef-e-inner { text-align: center; padding: 55px 40px; background-color: #f6f6f6; } .qodef-qi-testimonials-slider.qodef-item-layout--boxed .qodef-e-top { position: relative; display: inline-block; } .qodef-qi-testimonials-slider.qodef-item-layout--boxed .qodef-e-quote { position: absolute; top: 0; right: 0; font-size: 2em; } .qodef-qi-testimonials-slider.qodef-item-layout--boxed .qodef-e-text { margin: 0 0 1.3em; } .qodef-qi-testimonials-slider.qodef-item-layout--boxed .qodef-e-author { flex-direction: column; } .qodef-qi-testimonials-slider.qodef-item-layout--boxed .qodef-e-author-job { margin: .2em 0 0; } /* ========================================================================== Testimonials list shortcode styles ========================================================================== */ .qodef-qi-testimonials-slider.qodef-item-layout--info-below .qodef-e-media-image { margin-bottom: 1em; } .qodef-qi-testimonials-slider.qodef-item-layout--info-below .qodef-e-inner { text-align: center; } .qodef-qi-testimonials-slider.qodef-item-layout--info-below .qodef-e-quote { font-size: 2em; margin-bottom: 1.2em; } .qodef-qi-testimonials-slider.qodef-item-layout--info-below .qodef-e-text { margin: 0 0 1.3em; } .qodef-qi-testimonials-slider.qodef-item-layout--info-below .qodef-e-author { flex-direction: column; } .qodef-qi-testimonials-slider.qodef-item-layout--info-below .qodef-e-author-job { margin: .2em 0 0; } /* ========================================================================== Testimonials list shortcode styles ========================================================================== */ .qodef-qi-testimonials-slider.qodef-item-layout--side-quote .qodef-e-inner { display: flex; } @media only screen and (max-width: 480px) { .qodef-qi-testimonials-slider.qodef-item-layout--side-quote .qodef-e-inner { flex-direction: column; } } .qodef-qi-testimonials-slider.qodef-item-layout--side-quote .qodef-e-quote { font-size: 100px; width: 1em; margin: 0 35px 0 0; } .qodef-qi-testimonials-slider.qodef-item-layout--side-quote .qodef-e-quote i, .qodef-qi-testimonials-slider.qodef-item-layout--side-quote .qodef-e-quote svg { vertical-align: top; } @media only screen and (max-width: 480px) { .qodef-qi-testimonials-slider.qodef-item-layout--side-quote .qodef-e-quote { margin: 0 0 35px; } } .qodef-qi-testimonials-slider.qodef-item-layout--side-quote .qodef-e-content { flex: 1; text-align: left; } .qodef-qi-testimonials-slider.qodef-item-layout--side-quote .qodef-e-bottom-info { display: flex; align-items: center; } .qodef-qi-testimonials-slider.qodef-item-layout--side-quote .qodef-e-media-image { width: 50px; margin: 0 10px 0 0; } .qodef-qi-testimonials-slider.qodef-item-layout--side-quote .qodef-e-author { flex-direction: row; align-items: baseline; } .qodef-qi-testimonials-slider.qodef-item-layout--side-quote .qodef-e-author-job:before { content: ''; display: inline-block; vertical-align: middle; height: 1px; width: 1em; background-color: currentColor; margin: 0 .65em; } /* ========================================================================== Testimonials list shortcode styles ========================================================================== */ .qodef-qi-testimonials-slider.qodef-item-layout--side-with-image .qodef-e-inner { display: flex; align-items: center; } @media only screen and (max-width: 1024px) { .qodef-qi-testimonials-slider.qodef-item-layout--side-with-image .qodef-e-inner { align-items: baseline; } } @media only screen and (max-width: 680px) { .qodef-qi-testimonials-slider.qodef-item-layout--side-with-image .qodef-e-inner { flex-direction: column; align-items: flex-start; } } .qodef-qi-testimonials-slider.qodef-item-layout--side-with-image .qodef-e-side { position: relative; flex-shrink: 0; width: 290px; max-width: 30%; margin-right: 6%; } .qodef-qi-testimonials-slider.qodef-item-layout--side-with-image .qodef-e-side .qodef-e-media-image { border-radius: 10%; overflow: auto; } @media only screen and (max-width: 680px) { .qodef-qi-testimonials-slider.qodef-item-layout--side-with-image .qodef-e-side { max-width: 100%; } } .qodef-qi-testimonials-slider.qodef-item-layout--side-with-image .qodef-e-quote { position: absolute; top: -1em; right: -1em; width: 2em; height: 2em; display: flex; align-items: center; justify-content: center; color: #fff; background-color: #111; border-radius: 50%; } .qodef-qi-testimonials-slider.qodef-item-layout--side-with-image .qodef-e-content { flex: 1; text-align: left; } .qodef-qi-testimonials-slider.qodef-item-layout--side-with-image .qodef-e-text { margin: 0 0 1.3em; } .qodef-qi-testimonials-slider.qodef-item-layout--side-with-image .qodef-e-author { flex-direction: column; } .qodef-qi-testimonials-slider.qodef-item-layout--side-with-image .qodef-e-author-job { margin: .2em 0 0; } /* ========================================================================== Testimonials list shortcode styles ========================================================================== */ .qodef-qi-testimonials-slider.qodef-item-layout--standard .qodef-e-inner { text-align: left; } .qodef-qi-testimonials-slider.qodef-item-layout--standard .qodef-e-quote { font-size: 2em; margin-bottom: 1.2em; } .qodef-qi-testimonials-slider.qodef-item-layout--standard .qodef-e-text { margin: 0 0 1.3em; } .qodef-qi-testimonials-slider.qodef-item-layout--standard .qodef-e-bottom-info { display: flex; align-items: center; } .qodef-qi-testimonials-slider.qodef-item-layout--standard .qodef-e-media-image { width: 50px; border-radius: 50%; margin-right: 1em; overflow: hidden; } .qodef-qi-testimonials-slider.qodef-item-layout--standard .qodef-e-author { flex-direction: column; } .qodef-qi-testimonials-slider.qodef-item-layout--standard .qodef-e-author-job { margin: 0; } /* ========================================================================== Text Marquee shortcode styles ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ .qodef-qi-text-marquee { position: relative; display: inline-block; width: 100%; vertical-align: top; overflow: hidden; } .qodef-qi-text-marquee .qodef-m-content { display: flex; white-space: nowrap; font-size: 0; overflow: hidden; } .qodef-qi-text-marquee .qodef-m-text { display: flex; align-items: baseline; } .qodef-qi-text-marquee .qodef-m-text.qodef-text--original { animation: qode-move-horizontal-normal-text-marquee 20s linear infinite; } .qodef-qi-text-marquee .qodef-m-text.qodef-text--copy { position: absolute; top: 0; left: 0; will-change: transform; backface-visibility: hidden; transform: translateX(100%) translateZ(0); animation: qode-move-horizontal-normal-text-marquee-copy 20s linear infinite; } .qodef-qi-text-marquee .qodef-m-text-item { font-size: 100px; line-height: 1.1em; padding-right: 0.5em; padding-left: 0.5em; } .qodef-qi-text-marquee .qodef-e-icon-holder { display: flex; font-size: 30px; align-self: center; align-items: center; } .qodef-qi-text-marquee .qodef-e-icon-holder svg { fill: currentColor; stroke: currentColor; width: 1em; height: auto; } .qodef-qi-text-marquee.qodef-text-stroke-effect .qodef-m-text-item { color: transparent !important; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: #333333; text-shadow: none; } @keyframes qode-move-horizontal-normal-text-marquee { 0% { transform: translateX(0%) translateZ(0); } 100% { transform: translateX(-100%) translateZ(0); } } @keyframes qode-move-horizontal-normal-text-marquee-copy { 0% { transform: translateX(100%) translateZ(0); } 100% { transform: translateX(0%) translateZ(0); } } @keyframes qode-move-vertical-normal-text-marquee { 0% { transform: translateY(0%) translateZ(0); } 100% { transform: translateY(-100%) translateZ(0); } } @keyframes qode-move-vertical-normal-text-marquee-copy { 0% { transform: translateY(100%) translateZ(0); } 100% { transform: translateY(0%) translateZ(0); } } @keyframes qode-move-horizontal-reverse-text-marquee { 0% { transform: translateX(0%) translateZ(0); } 100% { transform: translateX(100%) translateZ(0); } } @keyframes qode-move-horizontal-reverse-text-marquee-copy { 0% { transform: translateX(-100%) translateZ(0); } 100% { transform: translateX(0%) translateZ(0); } } @keyframes qode-move-vertical-reverse-text-marquee { 0% { transform: translateY(0%) translateZ(0); } 100% { transform: translateY(100%) translateZ(0); } } @keyframes qode-move-vertical-reverse-text-marquee-copy { 0% { transform: translateY(-100%) translateZ(0); } 100% { transform: translateY(0%) translateZ(0); } } /* ========================================================================== Timeline shortcode styles ========================================================================= */ /* ========================================================================== Typography variables ========================================================================== */ /* ========================================================================== Box variables ========================================================================== */ /* ========================================================================== Devices screen size variables ========================================================================== */ /* ========================================================================== Typography mixins ========================================================================== */ /* ========================================================================== Typography mixins - end ========================================================================== */ /* ========================================================================== Layout mixins - begin ========================================================================== */ /* ========================================================================== Layout mixins - end ========================================================================== */ /* ========================================================================== Input fields mixins - begin ========================================================================== */ /* ========================================================================== Input fields mixins - end ========================================================================== */ /* ========================================================================== Grid size mixins - begin ========================================================================== */ /* ========================================================================== Grid size mixins - end ========================================================================== */ /* ========================================================================== Helper mixins - begin ========================================================================== */ /* ========================================================================== Helper mixins - end ========================================================================== */ /* ========================================================================== Clear fix mixin - begin ========================================================================== */ /* ========================================================================== Clear fix mixin - end ========================================================================== */ .qodef-qi-timeline { position: relative; } .qodef-qi-timeline .qodef-e-item, .qodef-qi-timeline .qodef-e-item-inner { position: relative; } .qodef-qi-timeline .qodef-e-image { display: inline-block; vertical-align: top; overflow: hidden; } .qodef-qi-timeline .qodef-e-date { margin: 0 0 .5em; } .qodef-qi-timeline .qodef-e-title { margin: 0 0 .85em; } .qodef-qi-timeline .qodef-e-text { margin: 0; } .qodef-qi-timeline .qodef-e-point-holder { position: absolute; color: #fff; font-size: 1em; width: 1em; height: 1em; transform: translate(-50%, -50%); } .qodef-qi-timeline .qodef-e-point-holder .qodef-e-point { background-color: #111; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; border-radius: 50%; overflow: hidden; } .qodef-qi-timeline .qodef-e-point-holder .qodef-e-icon-holder { font-size: .7em; line-height: 1em; max-height: 100%; } .qodef-qi-timeline .qodef-e-point-holder svg { width: .7em; stroke: currentColor; fill: currentColor; } .qodef-qi-timeline .qodef-e-line { display: block; background-color: #ebebeb; } .qodef-qi-timeline.qodef-timeline--vertical .qodef-e-line-holder { position: absolute; top: 0; left: 50%; transform: translateX(-50%); height: 100%; width: 1px; } .qodef-qi-timeline.qodef-timeline--vertical .qodef-e-line { height: 100%; } .qodef-qi-timeline.qodef-timeline--vertical .qodef-e-point-holder { top: 50%; left: 50%; } .qodef-qi-timeline.qodef-timeline--vertical.qodef-line--inside .qodef-e-line-holder { top: 50%; } .qodef-qi-timeline.qodef-timeline--vertical.qodef-line--inside .qodef-e-item:last-child .qodef-e-line-holder { display: none; } .qodef-qi-timeline.qodef-timeline--horizontal { overflow: hidden; } .qodef-qi-timeline.qodef-timeline--horizontal .qodef-grid-inner { display: flex; transition: all .4s ease; } .qodef-qi-timeline.qodef-timeline--horizontal .qodef-e-item { flex: 1; } .qodef-qi-timeline.qodef-timeline--horizontal .qodef-e-line-holder { position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 100%; height: 1px; } .qodef-qi-timeline.qodef-timeline--horizontal .qodef-e-line { height: 100%; } .qodef-qi-timeline.qodef-timeline--horizontal .qodef-e-point-holder { top: 50%; left: 50%; } .qodef-qi-timeline.qodef-point--diamond.qodef-timeline--horizontal .qodef-e-point-holder:before, .qodef-qi-timeline.qodef-point--diamond.qodef-timeline--horizontal .qodef-e-point-holder:after { content: ''; position: absolute; left: 50%; height: 100px; width: 1px; background-color: #ebebeb; transform: translateX(-50%); z-index: -1; } .qodef-qi-timeline.qodef-point--diamond.qodef-timeline--horizontal .qodef-e-point-holder:before { top: 100%; } .qodef-qi-timeline.qodef-point--diamond.qodef-timeline--horizontal .qodef-e-point-holder:after { bottom: 100%; } .qodef-qi-timeline.qodef-point--diamond.qodef-timeline--vertical .qodef-e-point-holder:before, .qodef-qi-timeline.qodef-point--diamond.qodef-timeline--vertical .qodef-e-point-holder:after { content: ''; position: absolute; top: 50%; width: 100px; height: 1px; background-color: #ebebeb; transform: translateY(-50%); z-index: -1; } .qodef-qi-timeline.qodef-point--diamond.qodef-timeline--vertical .qodef-e-point-holder:before { right: 100%; } .qodef-qi-timeline.qodef-point--diamond.qodef-timeline--vertical .qodef-e-point-holder:after { left: 100%; } .qodef-qi-timeline.qodef-point--diamond .qodef-e-point { border-radius: 0; transform: rotate(45deg); } .qodef-qi-timeline.qodef-point--diamond .qodef-e-icon-holder { transform: rotate(-45deg); } .qodef-qi-timeline .qodef-nav-prev, .qodef-qi-timeline .qodef-nav-next { position: absolute; top: 50%; transform: translateY(-50%); display: flex; align-items: center; justify-content: center; width: auto !important; height: auto !important; margin: 0 !important; color: #111; font-size: 26px; z-index: 10; cursor: pointer; } .qodef-qi-timeline .qodef-nav-prev > svg, .qodef-qi-timeline .qodef-nav-next > svg { display: block; width: 1em; height: auto; transition: .2s ease-out; stroke: currentColor; fill: currentColor; } .qodef-qi-timeline .qodef-nav-prev { left: 0; } .qodef-qi-timeline .qodef-nav-next { right: 0; } .qodef-qi-timeline.qodef-qi--has-appear { opacity: 0; transition: opacity 0.55s cubic-bezier(0.23, 1, 0.32, 1); } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--vertical-separated .qodef-e-item .qodef-e-image { opacity: 0; transition: opacity 0.55s cubic-bezier(0.23, 1, 0.32, 1), transform 0.55s cubic-bezier(0.23, 1, 0.32, 1); transform: translateY(-60px); } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--vertical-separated .qodef-e-item .qodef-e-content-holder { opacity: 0; transition: opacity 0.55s cubic-bezier(0.23, 1, 0.32, 1), transform 0.55s cubic-bezier(0.23, 1, 0.32, 1); transform: translateY(60px); } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--vertical-side .qodef-e-item .qodef-e-image { opacity: 0; transition: opacity 0.55s cubic-bezier(0.23, 1, 0.32, 1), transform 0.55s cubic-bezier(0.23, 1, 0.32, 1); transform: translateY(40px); } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--vertical-side .qodef-e-item .qodef-e-content-holder { opacity: 0; transition: opacity 0.55s cubic-bezier(0.23, 1, 0.32, 1), transform 0.55s cubic-bezier(0.23, 1, 0.32, 1); transform: translateY(40px); } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item .qodef-e-image { opacity: 0; transition: opacity 0.55s cubic-bezier(0.23, 1, 0.32, 1), transform 0.55s cubic-bezier(0.23, 1, 0.32, 1); transform: translateY(-60px); } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item .qodef-e-content-holder { opacity: 0; transition: opacity 0.55s cubic-bezier(0.23, 1, 0.32, 1), transform 0.55s cubic-bezier(0.23, 1, 0.32, 1); transform: translateY(60px); } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item .qodef-e-image { opacity: 0; transition: opacity 0.55s cubic-bezier(0.23, 1, 0.32, 1), transform 0.55s cubic-bezier(0.23, 1, 0.32, 1); transform: translateY(60px); } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item .qodef-e-content-holder { opacity: 0; transition: opacity 0.55s cubic-bezier(0.23, 1, 0.32, 1), transform 0.55s cubic-bezier(0.23, 1, 0.32, 1); transform: translateY(-60px); } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item.qodef-reverse .qodef-e-image { transform: translateY(-60px); } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item.qodef-reverse .qodef-e-content-holder { transform: translateY(60px); } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item .qodef-e-point { transform: scale(0); opacity: 0; transition: opacity 0.55s cubic-bezier(0.23, 1, 0.32, 1), transform 0.55s cubic-bezier(0.23, 1, 0.32, 1); } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(1) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(1) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(1) .qodef-e-image { transition-delay: 300ms, 300ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(1) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(1) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(1) .qodef-e-point { transition-delay: 400ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(1) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(1) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(1) .qodef-e-content-holder { transition-delay: 400ms, 400ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(2) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(2) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(2) .qodef-e-image { transition-delay: 600ms, 600ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(2) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(2) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(2) .qodef-e-point { transition-delay: 700ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(2) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(2) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(2) .qodef-e-content-holder { transition-delay: 800ms, 800ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(3) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(3) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(3) .qodef-e-image { transition-delay: 900ms, 900ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(3) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(3) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(3) .qodef-e-point { transition-delay: 1000ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(3) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(3) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(3) .qodef-e-content-holder { transition-delay: 1200ms, 1200ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(4) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(4) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(4) .qodef-e-image { transition-delay: 1200ms, 1200ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(4) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(4) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(4) .qodef-e-point { transition-delay: 1300ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(4) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(4) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(4) .qodef-e-content-holder { transition-delay: 1600ms, 1600ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(5) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(5) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(5) .qodef-e-image { transition-delay: 1500ms, 1500ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(5) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(5) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(5) .qodef-e-point { transition-delay: 1600ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(5) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(5) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(5) .qodef-e-content-holder { transition-delay: 2000ms, 2000ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(6) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(6) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(6) .qodef-e-image { transition-delay: 1800ms, 1800ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(6) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(6) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(6) .qodef-e-point { transition-delay: 1900ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(6) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(6) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(6) .qodef-e-content-holder { transition-delay: 2400ms, 2400ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(7) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(7) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(7) .qodef-e-image { transition-delay: 2100ms, 2100ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(7) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(7) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(7) .qodef-e-point { transition-delay: 2200ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(7) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(7) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(7) .qodef-e-content-holder { transition-delay: 2800ms, 2800ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(8) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(8) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(8) .qodef-e-image { transition-delay: 2400ms, 2400ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(8) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(8) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(8) .qodef-e-point { transition-delay: 2500ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(8) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(8) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(8) .qodef-e-content-holder { transition-delay: 3200ms, 3200ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(9) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(9) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(9) .qodef-e-image { transition-delay: 2700ms, 2700ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(9) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(9) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(9) .qodef-e-point { transition-delay: 2800ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(9) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(9) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(9) .qodef-e-content-holder { transition-delay: 3600ms, 3600ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(10) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(10) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(10) .qodef-e-image { transition-delay: 3000ms, 3000ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(10) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(10) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(10) .qodef-e-point { transition-delay: 3100ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(10) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(10) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(10) .qodef-e-content-holder { transition-delay: 4000ms, 4000ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(11) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(11) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(11) .qodef-e-image { transition-delay: 3300ms, 3300ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(11) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(11) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(11) .qodef-e-point { transition-delay: 3400ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(11) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(11) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(11) .qodef-e-content-holder { transition-delay: 4400ms, 4400ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(12) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(12) .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(12) .qodef-e-image { transition-delay: 3600ms, 3600ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(12) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(12) .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(12) .qodef-e-point { transition-delay: 3700ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard .qodef-e-item:nth-child(12) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating .qodef-e-item:nth-child(12) .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical .qodef-e-item:nth-child(12) .qodef-e-content-holder { transition-delay: 4800ms, 4800ms; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard.qodef-qi--appeared, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating.qodef-qi--appeared, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical.qodef-qi--appeared { opacity: 1; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard.qodef-qi--appeared .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard.qodef-qi--appeared .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating.qodef-qi--appeared .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating.qodef-qi--appeared .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical.qodef-qi--appeared .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical.qodef-qi--appeared .qodef-e-content-holder { opacity: 1; transform: translateY(0px) translateX(0px); } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard.qodef-qi--appeared .qodef-e-item.qodef-reverse .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard.qodef-qi--appeared .qodef-e-item.qodef-reverse .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating.qodef-qi--appeared .qodef-e-item.qodef-reverse .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating.qodef-qi--appeared .qodef-e-item.qodef-reverse .qodef-e-content-holder, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical.qodef-qi--appeared .qodef-e-item.qodef-reverse .qodef-e-image, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical.qodef-qi--appeared .qodef-e-item.qodef-reverse .qodef-e-content-holder { transform: translateY(0px) translateX(0px); } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard.qodef-qi--appeared .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating.qodef-qi--appeared .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical.qodef-qi--appeared .qodef-e-point { transform: scale(1); opacity: 1; } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard.qodef-point--diamond .qodef-e-item .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating.qodef-point--diamond .qodef-e-item .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical.qodef-point--diamond .qodef-e-item .qodef-e-point { transform: rotate(45deg) scale(0); } .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-standard.qodef-point--diamond.qodef-qi--appeared .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline-layout--horizontal-alternating.qodef-point--diamond.qodef-qi--appeared .qodef-e-point, .qodef-qi-timeline.qodef-qi--has-appear.qodef-timeline--vertical.qodef-point--diamond.qodef-qi--appeared .qodef-e-point { transform: rotate(45deg) scale(1); } /* ========================================================================== Timeline shortcode styles ========================================================================== */ @media only screen and (max-width: 480px) { .qodef-qi-timeline.qodef-timeline--vertical .qodef-e-point-holder, .qodef-qi-timeline.qodef-timeline--vertical .qodef-e-line-holder { display: none; } } .qodef-qi-timeline.qodef-timeline-layout--horizontal-alternating .qodef-e-item.qodef-reverse .qodef-e-item-inner { flex-direction: column; } .qodef-qi-timeline.qodef-timeline-layout--horizontal-alternating .qodef-e-item.qodef-reverse .qodef-e-top-holder { align-items: flex-end; padding: 0 0 10%; } .qodef-qi-timeline.qodef-timeline-layout--horizontal-alternating .qodef-e-item.qodef-reverse .qodef-e-content-holder { justify-content: flex-start; padding: 10% 0 0; } .qodef-qi-timeline.qodef-timeline-layout--horizontal-alternating .qodef-e-item-inner { display: flex; flex-direction: column-reverse; align-items: center; justify-content: center; text-align: center; } .qodef-qi-timeline.qodef-timeline-layout--horizontal-alternating .qodef-e-top-holder { display: flex; align-items: flex-start; padding: 10% 0 0; } .qodef-qi-timeline.qodef-timeline-layout--horizontal-alternating .qodef-e-content-holder { display: flex; flex-direction: column; justify-content: flex-end; padding: 0 0 10%; } .qodef-qi-timeline.qodef-timeline-layout--horizontal-standard .qodef-e-item-inner { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; } .qodef-qi-timeline.qodef-timeline-layout--horizontal-standard .qodef-e-top-holder { display: flex; align-items: flex-end; padding: 0 0 10%; } .qodef-qi-timeline.qodef-timeline-layout--horizontal-standard .qodef-e-content-holder { display: flex; flex-direction: column; justify-content: flex-start; padding: 10% 0 0; } .qodef-qi-timeline.qodef-timeline-layout--vertical-separated .qodef-e-item { text-align: center; } .qodef-qi-timeline.qodef-timeline-layout--vertical-separated .qodef-e-item:not(:last-child) { padding-bottom: 100px; } .qodef-qi-timeline.qodef-timeline-layout--vertical-separated .qodef-e-item.qodef-reverse .qodef-e-item-inner { flex-direction: row-reverse; text-align: right; } @media only screen and (max-width: 480px) { .qodef-qi-timeline.qodef-timeline-layout--vertical-separated .qodef-e-item.qodef-reverse .qodef-e-item-inner { flex-direction: column; text-align: center; } } .qodef-qi-timeline.qodef-timeline-layout--vertical-separated .qodef-e-item.qodef-reverse .qodef-e-side-holder { text-align: left; padding: 0 0 0 10%; } @media only screen and (max-width: 480px) { .qodef-qi-timeline.qodef-timeline-layout--vertical-separated .qodef-e-item.qodef-reverse .qodef-e-side-holder { padding: 0; } } .qodef-qi-timeline.qodef-timeline-layout--vertical-separated .qodef-e-item.qodef-reverse .qodef-e-content-holder { padding: 0 10% 0 0; } @media only screen and (max-width: 480px) { .qodef-qi-timeline.qodef-timeline-layout--vertical-separated .qodef-e-item.qodef-reverse .qodef-e-content-holder { padding: 0; } } .qodef-qi-timeline.qodef-timeline-layout--vertical-separated .qodef-e-item-inner { display: inline-flex; align-items: center; justify-content: center; text-align: left; width: 100%; } @media only screen and (max-width: 480px) { .qodef-qi-timeline.qodef-timeline-layout--vertical-separated .qodef-e-item-inner { flex-direction: column; text-align: center; } } .qodef-qi-timeline.qodef-timeline-layout--vertical-separated .qodef-e-side-holder { width: 50%; flex-shrink: 0; text-align: right; padding: 0 10% 0 0; } @media only screen and (max-width: 480px) { .qodef-qi-timeline.qodef-timeline-layout--vertical-separated .qodef-e-side-holder { width: 100%; padding: 0; margin-bottom: 5%; } } .qodef-qi-timeline.qodef-timeline-layout--vertical-separated .qodef-e-content-holder { width: 50%; padding: 0 0 0 10%; } @media only screen and (max-width: 480px) { .qodef-qi-timeline.qodef-timeline-layout--vertical-separated .qodef-e-content-holder { width: 100%; padding: 0; margin-top: 5%; } } .qodef-qi-timeline.qodef-timeline-layout--vertical-side .qodef-e-item.qodef-reverse .qodef-e-item-content { margin-left: 0; flex-direction: row; padding: 0 3em 0 0; } @media only screen and (max-width: 1024px) { .qodef-qi-timeline.qodef-timeline-layout--vertical-side .qodef-e-item.qodef-reverse .qodef-e-item-content { flex-direction: column; text-align: center; } } @media only screen and (max-width: 480px) { .qodef-qi-timeline.qodef-timeline-layout--vertical-side .qodef-e-item.qodef-reverse .qodef-e-item-content { padding: 0; } } .qodef-qi-timeline.qodef-timeline-layout--vertical-side .qodef-e-item.qodef-reverse .qodef-e-side-holder { margin: 0 10% 0 0; } @media only screen and (max-width: 1024px) { .qodef-qi-timeline.qodef-timeline-layout--vertical-side .qodef-e-item.qodef-reverse .qodef-e-side-holder { margin: 0 0 10%; } } .qodef-qi-timeline.qodef-timeline-layout--vertical-side .qodef-e-item-content { display: flex; align-items: center; justify-content: flex-end; margin-left: auto; flex-direction: row-reverse; width: 50%; padding: 0 0 0 3em; } @media only screen and (max-width: 1024px) { .qodef-qi-timeline.qodef-timeline-layout--vertical-side .qodef-e-item-content { flex-direction: column; text-align: center; } } @media only screen and (max-width: 480px) { .qodef-qi-timeline.qodef-timeline-layout--vertical-side .qodef-e-item-content { width: 100%; padding: 0; } } .qodef-qi-timeline.qodef-timeline-layout--vertical-side .qodef-e-side-holder { width: 250px; flex-shrink: 0; margin: 0 0 0 10%; } @media only screen and (max-width: 1024px) { .qodef-qi-timeline.qodef-timeline-layout--vertical-side .qodef-e-side-holder { margin: 0 0 10%; } } .qodef-qi-timeline.qodef-timeline-layout--vertical-side .qodef-e-image { border-radius: 50%; } /* ========================================================================== Typeout Text shortcode styles ========================================================================== */ .qodef-qi-typeout-text .qodef-m-text { margin: 0; }