/* --- Block Slider -------------------------------------------------------- */ /* --- Block Default Slider Styles -------------------------------------------------------- */ /* Slider Nav Dots */ .swiper-pagination { z-index: 1; width: auto !important; box-sizing: border-box; } .swiper-pagination-bullet { transition: all 0.5s ease; } .swiper-pagination-clickable .swiper-pagination-bullet { cursor: pointer; } .swiper-pagination-bullet { background-color: var(--wp--preset--color--color-dark); width: 14px; height: 14px; border-radius: 100%; opacity: 0.4; position: relative; opacity: 0.2; } .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 8px; } .swiper-pagination-bullet-active { background-color: var(--wp--preset--color--color-dark); opacity: 1; } .vertical-left-top>.swiper-pagination-bullets .swiper-pagination-bullet, .vertical-left-center>.swiper-pagination-bullets .swiper-pagination-bullet, .vertical-left-bottom>.swiper-pagination-bullets .swiper-pagination-bullet, .vertical-right-top>.swiper-pagination-bullets .swiper-pagination-bullet, .vertical-right-center>.swiper-pagination-bullets .swiper-pagination-bullet, .vertical-right-bottom>.swiper-pagination-bullets .swiper-pagination-bullet { margin: 10px 0; } .vertical-left-top .swiper-pagination.swiper-pagination-bullets, .vertical-left-center .swiper-pagination.swiper-pagination-bullets, .vertical-left-bottom .swiper-pagination.swiper-pagination-bullets, .vertical-right-top .swiper-pagination.swiper-pagination-bullets, .vertical-right-center .swiper-pagination.swiper-pagination-bullets, .vertical-right-bottom .swiper-pagination.swiper-pagination-bullets { padding: 8px 14px; width: auto; } .vertical-left-top .swiper-pagination, .vertical-left-center .swiper-pagination, .vertical-left-bottom .swiper-pagination, .vertical-right-top .swiper-pagination, .vertical-right-center .swiper-pagination, .vertical-right-bottom .swiper-pagination { display: flex; flex-direction: column; } .vertical-left-top .swiper-pagination, .vertical-left-bottom .swiper-pagination { left: 28px; } .vertical-left-top .swiper-pagination, .vertical-right-top .swiper-pagination { align-items: flex-start; top: 28px; } .vertical-right-top .swiper-pagination, .vertical-right-bottom .swiper-pagination { left: auto; right: 28px; } .vertical-left-bottom .swiper-pagination, .vertical-right-bottom .swiper-pagination { align-items: flex-end; bottom: 28px; } .vertical-left-center .swiper-pagination { left: 28px; } .vertical-right-center .swiper-pagination { right: 28px; left: auto; } .vertical-left-center .swiper-pagination, .vertical-right-center .swiper-pagination { align-items: center; bottom: auto; top: 50%; transform: translateY(-50%); } .block-editor-block-list__block.wp-block-bold-photography-blocks-pro-slider.wp-block-bold-photography-blocks-pro-slider { display: block; } .block-editor-block-list__block.wp-block-bold-photography-blocks-pro-slider.wp-block-bold-photography-blocks-pro-slider .horizontal-outside-slider-bottom-left, .block-editor-block-list__block.wp-block-bold-photography-blocks-pro-slider.wp-block-bold-photography-blocks-pro-slider .horizontal-outside-slider-bottom-center, .block-editor-block-list__block.wp-block-bold-photography-blocks-pro-slider.wp-block-bold-photography-blocks-pro-slider .horizontal-outside-slider-bottom-right, .horizontal-outside-slider-bottom-left, .horizontal-outside-slider-bottom-center, .horizontal-outside-slider-bottom-right { padding-bottom: 59px; } .block-editor-block-list__block.wp-block-bold-photography-blocks-pro-slider.wp-block-bold-photography-blocks-pro-slider .horizontal-outside-slider-bottom-left+.swiper-pagination, .block-editor-block-list__block.wp-block-bold-photography-blocks-pro-slider.wp-block-bold-photography-blocks-pro-slider .horizontal-outside-slider-bottom-center+.swiper-pagination, .block-editor-block-list__block.wp-block-bold-photography-blocks-pro-slider.wp-block-bold-photography-blocks-pro-slider .horizontal-outside-slider-bottom-right+.swiper-pagination, .horizontal-outside-slider-bottom-left .swiper-pagination, .horizontal-outside-slider-bottom-center .swiper-pagination, .horizontal-outside-slider-bottom-right .swiper-pagination { position: absolute; margin-top: 14px; width: auto; bottom: 0; } .horizontal-inside-slider-bottom-left .swiper-pagination, .block-editor-block-list__block.wp-block-bold-photography-blocks-pro-slider.wp-block-bold-photography-blocks-pro-slider .horizontal-outside-slider-bottom-left+.swiper-pagination, .horizontal-outside-slider-bottom-left .swiper-pagination { text-align: left; left: 14px; } .horizontal-inside-slider-bottom-center .swiper-pagination, .block-editor-block-list__block.wp-block-bold-photography-blocks-pro-slider.wp-block-bold-photography-blocks-pro-slider .horizontal-outside-slider-bottom-center+.swiper-pagination, .horizontal-outside-slider-bottom-center .swiper-pagination { left: 50%; transform: translateX(-50%); } .horizontal-inside-slider-bottom-right .swiper-pagination, .block-editor-block-list__block.wp-block-bold-photography-blocks-pro-slider.wp-block-bold-photography-blocks-pro-slider .horizontal-outside-slider-bottom-right+.swiper-pagination, .horizontal-outside-slider-bottom-right .swiper-pagination { text-align: right; right: 14px; left: auto; } /* Active Nav Dots Animation */ .swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: var(--wp--preset--color--primary); } /* Active Nav Dots Animation For Featured Slider */ .wp-block-featured-slider-with-video :not(.horizontal-outside-slider-bottom-right):not(.horizontal-outside-slider-bottom-left):not(.horizontal-outside-slider-bottom-center) .swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: var(--wp--preset--color--color-light); } .wp-block-featured-slider-with-video :not(.horizontal-outside-slider-bottom-right):not(.horizontal-outside-slider-bottom-left):not(.horizontal-outside-slider-bottom-center) .swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active:before { border-top-color: var(--wp--preset--color--color-light); border-right-color: var(--wp--preset--color--color-light); border-bottom-color: var(--wp--preset--color--color-light); } .wp-block-featured-slider-with-video :not(.horizontal-outside-slider-bottom-right):not(.horizontal-outside-slider-bottom-left):not(.horizontal-outside-slider-bottom-center) .swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active:after { border-top-color: var(--wp--preset--color--color-light); } /* Slider Arrows */ .bold-photography-blocks-pro-slider .swiper-button-prev, .bold-photography-blocks-pro-slider .swiper-button-next, .fse-slider-wrapper .swiper-button { background-color: var(--wp--preset--color--color-light); color: var(--wp--preset--color--color-dark); } .wp-block-featured-slider .bold-photography-blocks-pro-slider .swiper-button-prev, .wp-block-featured-slider .bold-photography-blocks-pro-slider .swiper-button-next, .wp-block-featured-slider .fse-slider-wrapper .swiper-button { background-color: transparent; color: var(--wp--preset--color--color-light); } .wp-block-featured-slider .bold-photography-blocks-pro-slider .swiper-button-prev, .wp-block-featured-slider .bold-photography-blocks-pro-slider .swiper-button-next, .wp-block-featured-slider .fse-slider-wrapper .swiper-button { &:hover { background-color: var(--wp--preset--color--primary); } } /* Updated Nav Dots */ .wp-block-featured-slider { .swiper-pagination { counter-reset: slides-num; display: block; position: absolute; top: 50%; left: auto; right: 14px !important; font-weight: 700; -moz-transform: translate(0%, -50%); -ms-transform: translate(0%, -50%); -webkit-transform: translate(0%, -50%); -o-transform: translate(0%, -50%); transform: translate(0%, -50%); z-index: 1; padding: 0 !important; .swiper-pagination-bullet { border-radius: 0; width: inherit; height: inherit; opacity: 1; color: #fff; counter-increment: slides-num; display: block; font-weight: 700; font-family: open sans, sans-serif; font-size: 13px; font-size: .8125rem; outline: 0; text-shadow: none; margin: 0; background: transparent; &:before { content: '0'counter(slides-num); display: block; line-height: 1; padding: 10px; } &:after { content: ""; display: block; width: 2px; margin: 0 auto; height: 0; box-shadow: inset 0 0 0 1px; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -o-transition: all .3s ease; -ms-transition: all .3s ease; transition: all .3s ease; color: #999; } } .swiper-pagination-bullet-active { background-color: transparent; &:before { content: '0' counter(slides-num); display: block; color: var(--wp--preset--color--primary); } &:after { height: 21px; } } } } /* --- Block Featured Slider -------------------------------------------------------- */ .wp-block-featured-slider .wp-block-cover { min-height: 360px; } main .wp-block-featured-slider>*+* { margin-block-start: 0; } .wp-block-featured-slider { position: relative; } .wp-block-featured-slider .wp-block-media-text .wp-block-media-text__media, .wp-block-custom-header-media .wp-block-media-text .wp-block-media-text__media { display: none; } .wp-block-featured-slider .wp-block-bold-photography-blocks-pro-popup-video { text-align: center; } .wp-block-featured-slider .content { display: inline-block; } .wp-block-featured-slider .content>.video-play svg { fill: var(--wp--preset--color--color-light); color: var(--wp--preset--color--color-light); background-color: var(--wp--preset--color--color-dark); border-radius: 50%; border-color: transparent; } .wp-block-featured-slider .content>.video-play:hover svg, .wp-block-featured-slider .content>.video-play:focus svg { background-color: var(--wp--preset--color--color-light); } .wp-block-embed-video { display: none; } .wp-block-featured-slider .wp-block-embed-video .wp-block-embed { max-width: 360px; margin-top: 28px; min-height: auto; min-width: auto; } .wp-block-featured-slider .wp-block-embed-video .wp-block-embed iframe { border-radius: 10px; } .wp-block-featured-slider .wp-block-media-text__content>h6, .wp-block-custom-header-media .wp-block-media-text__content>h6, .wp-block-custom-header-media .wp-block-media-text__content>h6 { margin-bottom: 14px; } /* Content Effect */ .wp-block-featured-slider .wp-block-media-text__content>* { opacity: 0; position: relative; transition: 1s; transition-delay: .5s; transform: translateX(50px); z-index: 2; } .wp-block-featured-slider .wp-block-media-text__content h6 { transition-delay: .4s; } .wp-block-featured-slider .wp-block-media-text__content h2 { transition-delay: .5s; font-size: var(--wp--custom--typography--font-size--huge-post-title); text-transform: capitalize; text-shadow: 1.4px 2.6px 10px rgba(0, 0, 0, 0.2); line-height: 1.2; } .wp-block-featured-slider .wp-block-media-text__content p { transition-delay: .6s; } .wp-block-featured-slider .wp-block-media-text__content .wp-block-buttons { transition-delay: .7s; } .wp-block-featured-slider .wp-block-media-text__content .wp-block-embed-video { transition-delay: .8s; } .wp-block-featured-slider .wp-block-media-text__content.block-editor-block-list__layout>*, .wp-block-featured-slider .swiper-slide-active .wp-block-media-text__content>* { opacity: 1; transform: translateY(0); } /* Modified Arrow */ .wp-block-featured-slider { .fse-slider-wrapper { .navigation-wrap { display: flex; .swiper-button { transform: none; top: inherit; bottom: 35px; z-index: 1; &:hover { background-color: transparent; color: var(--wp--preset--color--primary); } } .swiper-button-next { right: 21px !important; } .swiper-button-prev { right: 70px; left: auto !important; } } } } /* Scroll Inside Slider */ .wp-block-scroll-down { font-size: var(--wp--preset--font-size--small); text-transform: uppercase; position: absolute; right: clamp(8px, 3.5vw, 63px); bottom: clamp(28px, 3.5vw, 63px); z-index: 2; width: auto; } .wp-block-scroll-down a:after { content: ""; display: inline-block; width: 0.5rem; height: 0.5rem; border: 0.125rem solid; border-bottom: 0; border-left: 0; border-radius: 1px; transform: rotate(135deg); margin-left: 10px; margin-bottom: 8px; transition: 0.3s; vertical-align: middle; } .wp-block-scroll-down a { text-decoration: none; padding: 7px 14px; border-radius: 3px; color: var(--wp--preset--color--color-light); position: relative; margin-block-start: 0 !important; } .wp-block-scroll-down a:hover, .wp-block-scroll-down a:focus { background-color: var(--wp--preset--color--text-link); color: var(--wp--preset--color--color-dark); } /* For Editor */ .wp-block-custom-header-media .wp-block-cover__inner-container.block-editor-block-list__layout, .wp-block-custom-header-media .wp-block-cover__inner-container.block-editor-block-list__layout { position: static; } // Slider of 100vh and transparent header .header-transparent .block-editor-block-list__block.wp-block-main-header { width: auto !important; left: 0; right: 0; } .wp-position-static { position: static !important; } .header-transparent { padding-left: var(--wp--custom--spacing--outer); padding-right: var(--wp--custom--spacing--outer); position: absolute; width: 100% !important; z-index: 2; left: 0; } .wp-block-100-vh.wp-block-section { .swiper-wrapper { height: 100vh; .wp-block-cover { height: 100%; } } } .wp-block-100-vh.wp-block-custom-header-media { height: 100vh; } .admin-bar { .wp-block-section.wp-block-100-vh { .swiper-wrapper { height: calc(100vh - 46px); } } .wp-block-100-vh.wp-block-custom-header-media { height: calc(100vh - 46px); } } @media screen and (min-width: 783px) { .admin-bar { .wp-block-section.wp-block-100-vh { .swiper-wrapper { height: calc(100vh - 32px); } } .wp-block-100-vh.wp-block-custom-header-media { height: calc(100vh - 32px); } } }