.fusion-body .fusion-pagination-tb { --awb-font-size: var(--body_typography-font-size); --awb-height: 36px; --awb-preview-wrapper-width: 500px; --awb-preview-width: 20px; --awb-preview-height: 90px; --awb-border-color: var(--sep_color); --awb-border-size: 1px; --awb-bg-color: transparent; --awb-box-shadow: none; --awb-text-color: var(--link_color); --awb-text-hover-color: var(--link_hover_color); --awb-preview-text-color: var(--link_color); --awb-preview-font-size: var(--body_typography-font-size); --awb-z-index: 100; --awb-margin-bottom: 0; --awb-margin-left: 0; --awb-margin-right: 0; --awb-margin-top: 0; position: relative; font-size: var(--awb-font-size); margin-top: var(--awb-margin-top); margin-bottom: var(--awb-margin-bottom); margin-right: var(--awb-margin-right); margin-left: var(--awb-margin-left); } .fusion-body .fusion-pagination-tb:not(.layout-sticky) { display: flex; justify-content: space-between; line-height: normal; min-height: var(--awb-height); } .fusion-body .fusion-pagination-tb:not(.layout-sticky) a { margin: 0; } .fusion-body .fusion-pagination-tb:not(.layout-sticky) a[rel=prev] { padding-left: 1em; } .fusion-body .fusion-pagination-tb:not(.layout-sticky) a[rel=prev]:before { left: 0; } .fusion-body .fusion-pagination-tb:not(.layout-sticky) a[rel=next] { padding-right: 1em; } .fusion-body .fusion-pagination-tb:not(.layout-sticky) a[rel=next]:after { right: 0; } .fusion-body .fusion-pagination-tb:not(.layout-sticky).clearfix:before, .fusion-body .fusion-pagination-tb:not(.layout-sticky).clearfix:after { display: none; } .fusion-body .fusion-pagination-tb:not(.layout-sticky).align-left { justify-content: flex-start; } .fusion-body .fusion-pagination-tb:not(.layout-sticky).align-left a[rel=prev] { margin-right: 1em; } .fusion-body .fusion-pagination-tb:not(.layout-sticky).align-right { justify-content: flex-end; } .fusion-body .fusion-pagination-tb:not(.layout-sticky).align-right a[rel=next] { margin-left: 1em; } .fusion-body .fusion-pagination-tb:not(.layout-sticky).layout-preview .fusion-pagination-preview-wrapper { background-color: #fff; position: absolute; z-index: 1000; visibility: hidden; opacity: 0; top: 100%; transition: opacity 0.1s ease-in 0.1s, visibility 0.1s ease-in 0.1s; animation: fadeOutLeft 0.1s ease-in 0.1s both; display: flex; align-items: center; flex-direction: row; pointer-events: none; } .fusion-body .fusion-pagination-tb:not(.layout-sticky).layout-preview .fusion-pagination-preview-wrapper .fusion-item-title { padding: 0.5em 0.75em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .fusion-body .fusion-pagination-tb:not(.layout-sticky).layout-preview .fusion-pagination-preview-wrapper .fusion-item-media img, .fusion-body .fusion-pagination-tb:not(.layout-sticky).layout-preview .fusion-pagination-preview-wrapper .fusion-item-media svg { max-width: 90px; } .fusion-body .fusion-pagination-tb:not(.layout-sticky).layout-preview .fusion-pagination-preview-wrapper .fusion-item-media svg { min-width: 90px; min-height: 90px; background: #eaecef; display: block; } .fusion-body .fusion-pagination-tb:not(.layout-sticky).layout-preview.has-box-shadow .fusion-pagination-preview-wrapper { box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); } .fusion-body .fusion-pagination-tb:not(.layout-sticky).layout-preview .fusion-tb-previous:hover .fusion-pagination-preview-wrapper, .fusion-body .fusion-pagination-tb:not(.layout-sticky).layout-preview .fusion-tb-next:hover .fusion-pagination-preview-wrapper { visibility: visible; opacity: 1; transition: opacity 0.3s ease-out, visibility 0.3s ease-out; animation: fadeInLeft 0.3s ease-out both; } .fusion-body .fusion-pagination-tb:not(.layout-sticky).layout-preview .fusion-tb-next .fusion-pagination-preview-wrapper { flex-direction: row-reverse; right: 0; animation: fadeOutRight 0.1s ease-out 0.1s both; } .fusion-body .fusion-pagination-tb:not(.layout-sticky).layout-preview .fusion-tb-next .fusion-pagination-preview-wrapper a { flex-direction: row-reverse; } .fusion-body .fusion-pagination-tb:not(.layout-sticky).layout-preview .fusion-tb-next .fusion-pagination-preview-wrapper a .fusion-item-title { flex: 1; text-align: left; } .fusion-body .fusion-pagination-tb:not(.layout-sticky).layout-preview .fusion-tb-next:hover .fusion-pagination-preview-wrapper { animation: fadeInRight 0.3s ease-out both; } .fusion-body .fusion-pagination-tb:not(.layout-sticky).layout-preview.align-left .fusion-tb-next .fusion-pagination-preview-wrapper { right: auto; } .fusion-body .fusion-pagination-tb:not(.layout-sticky).layout-preview.align-right .fusion-tb-previous .fusion-pagination-preview-wrapper { right: auto; } .fusion-body .fusion-pagination-tb:not(.layout-sticky).layout-preview.align-right .fusion-pagination-preview-wrapper { right: 0 !important; } .fusion-body .fusion-pagination-tb:not(.layout-sticky).position-top .fusion-pagination-preview-wrapper { top: auto; bottom: 100%; } .fusion-body .fusion-pagination-tb.layout-sticky { z-index: var(--awb-z-index); } .fusion-body .fusion-pagination-tb.layout-sticky.has-box-shadow .fusion-control-navigation:before { content: ""; box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); position: absolute; left: 0; right: 0; top: 0; bottom: 0; pointer-events: none; } .fusion-body .fusion-pagination-tb.layout-sticky .fusion-control-navigation { width: auto; max-width: 50vw; height: var(--awb-preview-height); min-width: var(--awb-preview-wrapper-width); position: fixed; right: 0; top: 50%; display: flex; align-items: center; justify-content: space-between; background: #fff; } .fusion-body .fusion-pagination-tb.layout-sticky .fusion-control-navigation .fusion-item-title { text-align: center; flex: 1; display: flex; align-items: center; width: min-content; position: relative; } .fusion-body .fusion-pagination-tb.layout-sticky .fusion-control-navigation .fusion-item-title p { margin: 0; display: -webkit-box; -webkit-line-clamp: 2; overflow: hidden; } .fusion-body .fusion-pagination-tb.layout-sticky .fusion-control-navigation .fusion-item-title i { position: absolute; left: 1em; margin: 0; top: 50%; transform: translateY(-50%); } .fusion-body .fusion-pagination-tb.layout-sticky .fusion-control-navigation.prev { border-left: 0; left: 0; right: auto; transform: translate(calc(max(-1 * var(--awb-preview-wrapper-width), -50vw) + var(--awb-preview-width)), -50%); /* stylelint-disable-line */ transition: transform 0.3s ease-in; } .fusion-body .fusion-pagination-tb.layout-sticky .fusion-control-navigation.prev:hover { transform: translate(0, -50%) !important; transition: transform 0.3s ease-out; } .fusion-body .fusion-pagination-tb.layout-sticky .fusion-control-navigation.prev .fusion-item-title { padding-right: 1em; padding-left: 2em; } .fusion-body .fusion-pagination-tb.layout-sticky .fusion-control-navigation.next { border-right: 0; right: 0; transform: translate(calc(min(var(--awb-preview-wrapper-width), 50vw) - var(--awb-preview-width)), -50%); /* stylelint-disable-line */ transition: transform 0.3s ease-in; } .fusion-body .fusion-pagination-tb.layout-sticky .fusion-control-navigation.next:before { transform: rotateY(180deg); } .fusion-body .fusion-pagination-tb.layout-sticky .fusion-control-navigation.next:hover { transform: translate(0, -50%) !important; transition: transform 0.3s ease-out; } .fusion-body .fusion-pagination-tb.layout-sticky .fusion-control-navigation.next .fusion-item-title { justify-content: flex-end; padding-left: 1em; padding-right: 2em; } .fusion-body .fusion-pagination-tb.layout-sticky .fusion-control-navigation.next .fusion-item-media img { margin-right: auto; margin-left: 0; } .fusion-body .fusion-pagination-tb.layout-sticky .fusion-control-navigation.next i { left: auto; right: 1em; } .fusion-body .fusion-pagination-tb.layout-sticky .fusion-control-navigation .fusion-item-media { height: inherit; display: flex; } .fusion-body .fusion-pagination-tb.layout-sticky .fusion-control-navigation .fusion-item-media img, .fusion-body .fusion-pagination-tb.layout-sticky .fusion-control-navigation .fusion-item-media svg { display: block; max-width: fit-content; height: inherit; width: auto; margin-left: auto; } .fusion-body .fusion-pagination-tb.layout-sticky .fusion-control-navigation .fusion-item-media svg { max-width: 150px; height: inherit; background: #eaecef; } .fusion-body .fusion-pagination-tb.layout-sticky .fusion-control-navigation a { display: flex; flex: 1; justify-content: space-between; height: inherit; } .fusion-body .fusion-pagination-tb .fusion-item-title { transition-property: color; transition-duration: 0.2s; transition-timing-function: linear; } .fusion-body .fusion-pagination-tb .fusion-tb-previous, .fusion-body .fusion-pagination-tb .fusion-tb-next { display: flex; align-items: center; } .fusion-body .fusion-pagination-tb.single-navigation:not(.layout-sticky) { border-color: var(--awb-border-color); border-width: var(--awb-border-size); } .fusion-body .fusion-pagination-tb.single-navigation.position-top.layout-preview .fusion-pagination-preview-wrapper { margin-bottom: calc(var(--awb-border-size) + 1px); } .fusion-body .fusion-pagination-tb.single-navigation.position-bottom.layout-preview .fusion-pagination-preview-wrapper { margin-top: calc(var(--awb-border-size) + 1px); } .fusion-body .fusion-pagination-tb.layout-sticky:not(.layoout-text) .fusion-control-navigation { background: var(--awb-bg-color); } .fusion-body .fusion-pagination-tb.layout-sticky:not(.layoout-text) .fusion-control-navigation.has-box-shadow .fusion-control-navigation:before { box-shadow: var(--awb-box-shadow) !important; } .fusion-body .fusion-pagination-tb:not(.layout-sticky):not(.layoout-text).layout-preview .fusion-pagination-preview-wrapper { background: var(--awb-bg-color); } .fusion-body .fusion-pagination-tb:not(.layout-sticky):not(.layoout-text).layout-preview.has-box-shadow .fusion-pagination-preview-wrapper { box-shadow: var(--awb-box-shadow) !important; } .fusion-body .fusion-fullwidth .fusion-builder-row.fusion-row .fusion-pagination-tb.single-navigation:not(.layout-sticky) a { color: var(--awb-text-color) !important; } .fusion-body .fusion-fullwidth .fusion-builder-row.fusion-row .fusion-pagination-tb.single-navigation:not(.layout-sticky) a:before, .fusion-body .fusion-fullwidth .fusion-builder-row.fusion-row .fusion-pagination-tb.single-navigation:not(.layout-sticky) a:after { color: var(--awb-text-color) !important; } .fusion-body .fusion-fullwidth .fusion-builder-row.fusion-row .fusion-pagination-tb.single-navigation:not(.layout-sticky) a:hover, .fusion-body .fusion-fullwidth .fusion-builder-row.fusion-row .fusion-pagination-tb.single-navigation:not(.layout-sticky) a.hover { color: var(--awb-text-hover-color) !important; } .fusion-body .fusion-fullwidth .fusion-builder-row.fusion-row .fusion-pagination-tb.single-navigation:not(.layout-sticky) a:hover:before, .fusion-body .fusion-fullwidth .fusion-builder-row.fusion-row .fusion-pagination-tb.single-navigation:not(.layout-sticky) a.hover:before, .fusion-body .fusion-fullwidth .fusion-builder-row.fusion-row .fusion-pagination-tb.single-navigation:not(.layout-sticky) a:hover:after, .fusion-body .fusion-fullwidth .fusion-builder-row.fusion-row .fusion-pagination-tb.single-navigation:not(.layout-sticky) a.hover:after { color: var(--awb-text-hover-color) !important; } .fusion-body .fusion-fullwidth .fusion-builder-row.fusion-row .fusion-pagination-tb.layout-sticky .fusion-control-navigation a { color: var(--awb-preview-text-color); font-size: var(--awb-preview-font-size); } .fusion-body .fusion-fullwidth .fusion-builder-row.fusion-row .fusion-pagination-tb:not(.layout-sticky).layout-preview .fusion-pagination-preview-wrapper .fusion-item-title { color: var(--awb-preview-text-color); font-size: var(--awb-preview-font-size); } .fusion-body.rtl .fusion-pagination-tb.text:not(.layout-sticky) .fusion-tb-previous a, .fusion-body.rtl .fusion-pagination-tb.layout-preview:not(.layout-sticky) .fusion-tb-previous a, .fusion-body.rtl .fusion-pagination-tb.text:not(.align-left) .fusion-tb-previous a, .fusion-body.rtl .fusion-pagination-tb.layout-preview:not(.align-left) .fusion-tb-previous a { padding-right: 1em; padding-left: 0; } .fusion-body.rtl .fusion-pagination-tb.text:not(.layout-sticky) .fusion-tb-previous a:before, .fusion-body.rtl .fusion-pagination-tb.layout-preview:not(.layout-sticky) .fusion-tb-previous a:before, .fusion-body.rtl .fusion-pagination-tb.text:not(.align-left) .fusion-tb-previous a:before, .fusion-body.rtl .fusion-pagination-tb.layout-preview:not(.align-left) .fusion-tb-previous a:before { left: auto; right: 0; } .fusion-body.rtl .fusion-pagination-tb.text:not(.layout-sticky) .fusion-tb-previous .fusion-pagination-preview-wrapper, .fusion-body.rtl .fusion-pagination-tb.layout-preview:not(.layout-sticky) .fusion-tb-previous .fusion-pagination-preview-wrapper, .fusion-body.rtl .fusion-pagination-tb.text:not(.align-left) .fusion-tb-previous .fusion-pagination-preview-wrapper, .fusion-body.rtl .fusion-pagination-tb.layout-preview:not(.align-left) .fusion-tb-previous .fusion-pagination-preview-wrapper { animation: fadeOutRight 0.1s ease-in 0.1s both; } .fusion-body.rtl .fusion-pagination-tb.text:not(.layout-sticky) .fusion-tb-previous .fusion-pagination-preview-wrapper a, .fusion-body.rtl .fusion-pagination-tb.layout-preview:not(.layout-sticky) .fusion-tb-previous .fusion-pagination-preview-wrapper a, .fusion-body.rtl .fusion-pagination-tb.text:not(.align-left) .fusion-tb-previous .fusion-pagination-preview-wrapper a, .fusion-body.rtl .fusion-pagination-tb.layout-preview:not(.align-left) .fusion-tb-previous .fusion-pagination-preview-wrapper a { padding-left: 1em; padding-right: 0; flex-direction: inherit; } .fusion-body.rtl .fusion-pagination-tb.text:not(.layout-sticky) .fusion-tb-previous:hover .fusion-pagination-preview-wrapper, .fusion-body.rtl .fusion-pagination-tb.layout-preview:not(.layout-sticky) .fusion-tb-previous:hover .fusion-pagination-preview-wrapper, .fusion-body.rtl .fusion-pagination-tb.text:not(.align-left) .fusion-tb-previous:hover .fusion-pagination-preview-wrapper, .fusion-body.rtl .fusion-pagination-tb.layout-preview:not(.align-left) .fusion-tb-previous:hover .fusion-pagination-preview-wrapper { animation: fadeInRight 0.1s ease-out 0.1s both; } .fusion-body.rtl .fusion-pagination-tb.text:not(.layout-sticky) .fusion-tb-next .fusion-pagination-preview-wrapper, .fusion-body.rtl .fusion-pagination-tb.layout-preview:not(.layout-sticky) .fusion-tb-next .fusion-pagination-preview-wrapper, .fusion-body.rtl .fusion-pagination-tb.text:not(.align-left) .fusion-tb-next .fusion-pagination-preview-wrapper, .fusion-body.rtl .fusion-pagination-tb.layout-preview:not(.align-left) .fusion-tb-next .fusion-pagination-preview-wrapper { right: auto; left: 0; animation: fadeOutLeft 0.1s ease-in 0.1s both; } .fusion-body.rtl .fusion-pagination-tb.text:not(.layout-sticky) .fusion-tb-next .fusion-pagination-preview-wrapper a, .fusion-body.rtl .fusion-pagination-tb.layout-preview:not(.layout-sticky) .fusion-tb-next .fusion-pagination-preview-wrapper a, .fusion-body.rtl .fusion-pagination-tb.text:not(.align-left) .fusion-tb-next .fusion-pagination-preview-wrapper a, .fusion-body.rtl .fusion-pagination-tb.layout-preview:not(.align-left) .fusion-tb-next .fusion-pagination-preview-wrapper a { flex-direction: row-reverse; padding-left: 0; padding-right: 1em; } .fusion-body.rtl .fusion-pagination-tb.text:not(.layout-sticky) .fusion-tb-next a, .fusion-body.rtl .fusion-pagination-tb.layout-preview:not(.layout-sticky) .fusion-tb-next a, .fusion-body.rtl .fusion-pagination-tb.text:not(.align-left) .fusion-tb-next a, .fusion-body.rtl .fusion-pagination-tb.layout-preview:not(.align-left) .fusion-tb-next a { padding-left: 1em; padding-right: 0; } .fusion-body.rtl .fusion-pagination-tb.text:not(.layout-sticky) .fusion-tb-next a:after, .fusion-body.rtl .fusion-pagination-tb.layout-preview:not(.layout-sticky) .fusion-tb-next a:after, .fusion-body.rtl .fusion-pagination-tb.text:not(.align-left) .fusion-tb-next a:after, .fusion-body.rtl .fusion-pagination-tb.layout-preview:not(.align-left) .fusion-tb-next a:after { left: 0; } .fusion-body.rtl .fusion-pagination-tb.text:not(.layout-sticky) .fusion-tb-next:hover .fusion-pagination-preview-wrapper, .fusion-body.rtl .fusion-pagination-tb.layout-preview:not(.layout-sticky) .fusion-tb-next:hover .fusion-pagination-preview-wrapper, .fusion-body.rtl .fusion-pagination-tb.text:not(.align-left) .fusion-tb-next:hover .fusion-pagination-preview-wrapper, .fusion-body.rtl .fusion-pagination-tb.layout-preview:not(.align-left) .fusion-tb-next:hover .fusion-pagination-preview-wrapper { animation: fadeInLeft 0.1s ease-out 0.1s both; } .fusion-body.rtl .fusion-pagination-tb.text.align-left .fusion-tb-previous a, .fusion-body.rtl .fusion-pagination-tb.layout-preview.align-left .fusion-tb-previous a { margin-right: 0; margin-left: 1em; } .fusion-body.rtl .fusion-pagination-tb.text.align-left .fusion-tb-previous .fusion-pagination-preview-wrapper, .fusion-body.rtl .fusion-pagination-tb.layout-preview.align-left .fusion-tb-previous .fusion-pagination-preview-wrapper { right: 0; } .fusion-body.rtl .fusion-pagination-tb.text.align-left .fusion-tb-next .fusion-pagination-preview-wrapper, .fusion-body.rtl .fusion-pagination-tb.layout-preview.align-left .fusion-tb-next .fusion-pagination-preview-wrapper { right: 0; } .fusion-body.rtl .fusion-pagination-tb.text.align-right .fusion-tb-next a, .fusion-body.rtl .fusion-pagination-tb.layout-preview.align-right .fusion-tb-next a { margin-left: 0; margin-right: 1em; } .fusion-body.rtl .fusion-pagination-tb.text.align-right .fusion-tb-next .fusion-pagination-preview-wrapper, .fusion-body.rtl .fusion-pagination-tb.layout-preview.align-right .fusion-tb-next .fusion-pagination-preview-wrapper { left: 0; right: auto !important; } .fusion-body.rtl .fusion-pagination-tb.text.align-right .fusion-tb-previous .fusion-pagination-preview-wrapper, .fusion-body.rtl .fusion-pagination-tb.layout-preview.align-right .fusion-tb-previous .fusion-pagination-preview-wrapper { left: 0; right: auto !important; } .fusion-body.rtl .fusion-pagination-tb.layout-sticky .fusion-control-navigation.next { left: 0; right: auto; transform: translate(calc(max(-1 * var(--awb-preview-wrapper-width), -50vw) + var(--awb-preview-width)), -50%) !important; /* stylelint-disable-line */ transition: transform 0.3s ease-in; } .fusion-body.rtl .fusion-pagination-tb.layout-sticky .fusion-control-navigation.next .fusion-item-media img { margin-left: auto; margin-right: 0; } .fusion-body.rtl .fusion-pagination-tb.layout-sticky .fusion-control-navigation.next:hover { transform: translate(0, -50%) !important; transition: transform 0.3s ease-in; } .fusion-body.rtl .fusion-pagination-tb.layout-sticky .fusion-control-navigation.prev { right: 0; left: auto; transform: translate(calc(min(var(--awb-preview-wrapper-width), 50vw) - var(--awb-preview-width)), -50%) !important; /* stylelint-disable-line */ transition: transform 0.3s ease-in; } .fusion-body.rtl .fusion-pagination-tb.layout-sticky .fusion-control-navigation.prev .fusion-item-media img { margin-right: auto; margin-left: 0; } .fusion-body.rtl .fusion-pagination-tb.layout-sticky .fusion-control-navigation.prev:hover { transform: translate(0, -50%) !important; transition: transform 0.3s ease-in; } .fusion-body.fusion-builder-live:not(.fusion-builder-preview-mode) .fusion-pagination-tb.layout-sticky:not(.show-live) { display: none; }