:root {
--f-spinner-width: 36px;
--f-spinner-height: 36px;
--f-spinner-color-1: rgba(0, 0, 0, 0.1);
--f-spinner-color-2: rgba(17, 24, 28, 0.8);
--f-spinner-stroke: 2.75;
--f-carousel-dots-width: 24px;
--f-carousel-dots-height: 30px;
--f-carousel-dot-width: 8px;
--f-carousel-dot-height: 8px;
--f-carousel-dot-radius: 50%;
--f-carousel-dot-color: var(--f-carousel-theme-color, currentColor);
--f-carousel-dot-opacity: 0.2;
--f-carousel-dot-hover-opacity: 0.4;
--f-button-width: 40px;
--f-button-height: 40px;
--f-button-border: 0;
--f-button-border-radius: 0;
--f-button-color: #374151;
--f-button-bg: #f8f8f8;
--f-button-hover-bg: #e0e0e0;
--f-button-active-bg: #d0d0d0;
--f-button-shadow: none;
--f-button-transition: all 0.15s ease;
--f-button-transform: none;
--f-button-svg-width: 20px;
--f-button-svg-height: 20px;
--f-button-svg-stroke-width: 1.5;
--f-button-svg-fill: none;
--f-button-svg-filter: none;
--f-button-svg-disabled-opacity: 0.65;
}
.f-spinner {
margin: auto;
padding: 0;
width: var(--f-spinner-width);
height: var(--f-spinner-height);
}
.f-spinner svg {
width: 100%;
height: 100%;
vertical-align: top;
animation: f-spinner-rotate 2s linear infinite;
}
.f-spinner svg * {
stroke-width: var(--f-spinner-stroke);
fill: none;
}
.f-spinner svg :first-child {
stroke: var(--f-spinner-color-1);
}
.f-spinner svg :last-child {
stroke: var(--f-spinner-color-2);
animation: f-spinner-dash 2s ease-in-out infinite;
}
@keyframes f-spinner-rotate {
100% {
transform: rotate(360deg);
}
}
@keyframes f-spinner-dash {
0% {
stroke-dasharray: 1, 150;
stroke-dashoffset: 0;
}
50% {
stroke-dasharray: 90, 150;
stroke-dashoffset: -35;
}
100% {
stroke-dasharray: 90, 150;
stroke-dashoffset: -124;
}
}
.f-throwOutUp {
animation: var(--f-throw-out-duration, 0.175s) ease-out both f-throwOutUp;
}
.f-throwOutDown {
animation: var(--f-throw-out-duration, 0.175s) ease-out both f-throwOutDown;
}
@keyframes f-throwOutUp {
to {
transform: translate3d(
0,
calc(var(--f-throw-out-distance, 150px) * -1),
0
);
opacity: 0;
}
}
@keyframes f-throwOutDown {
to {
transform: translate3d(0, var(--f-throw-out-distance, 150px), 0);
opacity: 0;
}
}
.f-zoomInUp {
animation: var(--f-transition-duration, 0.2s) ease 0.1s both f-zoomInUp;
}
.f-zoomOutDown {
animation: var(--f-transition-duration, 0.2s) ease both f-zoomOutDown;
}
@keyframes f-zoomInUp {
from {
transform: scale(0.975) translate3d(0, 16px, 0);
opacity: 0;
}
to {
transform: scale(1) translate3d(0, 0, 0);
opacity: 1;
}
}
@keyframes f-zoomOutDown {
to {
transform: scale(0.975) translate3d(0, 16px, 0);
opacity: 0;
}
}
.f-fadeIn {
animation: var(--f-transition-duration, 0.2s)
var(--f-transition-easing, ease) var(--f-transition-delay, 0s) both
f-fadeIn;
z-index: 2;
}
.f-fadeOut {
animation: var(--f-transition-duration, 0.2s)
var(--f-transition-easing, ease) var(--f-transition-delay, 0s) both
f-fadeOut;
z-index: 1;
}
@keyframes f-fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes f-fadeOut {
100% {
opacity: 0;
}
}
.f-fadeFastIn {
animation: var(--f-transition-duration, 0.2s) ease-out both f-fadeFastIn;
z-index: 2;
}
.f-fadeFastOut {
animation: var(--f-transition-duration, 0.1s) ease-out both f-fadeFastOut;
z-index: 2;
}
@keyframes f-fadeFastIn {
0% {
opacity: 0.75;
}
100% {
opacity: 1;
}
}
@keyframes f-fadeFastOut {
100% {
opacity: 0;
}
}
.f-fadeSlowIn {
animation: var(--f-transition-duration, 0.5s) ease both f-fadeSlowIn;
z-index: 2;
}
.f-fadeSlowOut {
animation: var(--f-transition-duration, 0.5s) ease both f-fadeSlowOut;
z-index: 1;
}
@keyframes f-fadeSlowIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes f-fadeSlowOut {
100% {
opacity: 0;
}
}
.f-crossfadeIn {
animation: var(--f-transition-duration, 0.2s) ease-out both f-crossfadeIn;
z-index: 2;
}
.f-crossfadeOut {
animation: calc(var(--f-transition-duration, 0.2s) * 0.5) linear 0.1s both
f-crossfadeOut;
z-index: 1;
}
@keyframes f-crossfadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes f-crossfadeOut {
100% {
opacity: 0;
}
}
.f-slideIn.from-next {
animation: var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1)
f-slideInNext;
}
.f-slideIn.from-prev {
animation: var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1)
f-slideInPrev;
}
.f-slideOut.to-next {
animation: var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1)
f-slideOutNext;
}
.f-slideOut.to-prev {
animation: var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1)
f-slideOutPrev;
}
@keyframes f-slideInPrev {
0% {
transform: translateX(100%);
}
100% {
transform: translate3d(0, 0, 0);
}
}
@keyframes f-slideInNext {
0% {
transform: translateX(-100%);
}
100% {
transform: translate3d(0, 0, 0);
}
}
@keyframes f-slideOutNext {
100% {
transform: translateX(-100%);
}
}
@keyframes f-slideOutPrev {
100% {
transform: translateX(100%);
}
}
.f-classicIn.from-next {
animation: var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1)
f-classicInNext;
z-index: 2;
}
.f-classicIn.from-prev {
animation: var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1)
f-classicInPrev;
z-index: 2;
}
.f-classicOut.to-next {
animation: var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1)
f-classicOutNext;
z-index: 1;
}
.f-classicOut.to-prev {
animation: var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1)
f-classicOutPrev;
z-index: 1;
}
@keyframes f-classicInNext {
0% {
transform: translateX(-75px);
opacity: 0;
}
100% {
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
@keyframes f-classicInPrev {
0% {
transform: translateX(75px);
opacity: 0;
}
100% {
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
@keyframes f-classicOutNext {
100% {
transform: translateX(-75px);
opacity: 0;
}
}
@keyframes f-classicOutPrev {
100% {
transform: translateX(75px);
opacity: 0;
}
}
.f-carousel {
--f-carousel-theme-color: #706f6c;
--f-carousel-spacing: 0px;
--f-carousel-slide-width: 100%;
--f-carousel-slide-height: auto;
--f-carousel-slide-padding: 0;
--f-button-width: 42px;
--f-button-height: 42px;
--f-button-color: var(--f-carousel-theme-color, currentColor);
--f-button-hover-color: var(--f-carousel-theme-color, currentColor);
--f-button-bg: transparent;
--f-button-hover-bg: var(--f-button-bg);
--f-button-active-bg: var(--f-button-bg);
--f-button-svg-width: 24px;
--f-button-svg-height: 24px;
--f-button-next-pos: 10px;
--f-button-prev-pos: 10px;
--f-spinner-color-1: rgba(0, 0, 0, 0.1);
--f-spinner-color-2: rgba(17, 24, 28, 0.8);
--f-spinner-stroke: 2.75;
position: relative;
box-sizing: border-box;
}
.f-carousel *,
.f-carousel :after,
.f-carousel :before {
box-sizing: inherit;
}
.f-carousel.is-ltr {
direction: ltr;
}
.f-carousel.is-rtl {
direction: rtl;
}
.f-carousel__viewport {
overflow: hidden;
transform: translate3d(0, 0, 0);
backface-visibility: hidden;
width: 100%;
height: 100%;
}
.f-carousel__viewport.is-draggable {
cursor: move;
cursor: grab;
}
.f-carousel__viewport.is-dragging {
cursor: move;
cursor: grabbing;
}
.f-carousel__track {
display: flex;
margin: 0 auto;
padding: 0;
height: 100%;
-webkit-tap-highlight-color: transparent;
}
.f-carousel__slide {
position: relative;
flex: 0 0 auto;
width: var(--f-carousel-slide-width);
max-width: 100%;
height: var(--f-carousel-slide-height);
margin: 0 var(--f-carousel-spacing) 0 0;
padding: var(--f-carousel-slide-padding);
outline: 0;
transform-origin: center center;
}
.f-carousel__slide img.is-preloading {
visibility: hidden;
}
.f-carousel__slide > .f-spinner {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.f-carousel.is-vertical {
--f-carousel-slide-height: 100%;
}
.f-carousel.is-vertical .f-carousel__track {
flex-wrap: wrap;
}
.f-button,
.f-carousel__dots {
justify-content: center;
padding: 0;
}
.f-carousel.is-vertical .f-carousel__slide {
margin: 0 0 var(--f-carousel-spacing);
}
.f-carousel.has-dots {
margin-bottom: var(--f-carousel-dots-height);
}
.f-carousel__dots {
position: absolute;
bottom: calc(var(--f-carousel-dots-height) * -1);
left: 0;
right: 0;
display: flex;
align-items: center;
flex-wrap: wrap;
margin: 0 auto !important;
list-style: none !important;
user-select: none;
}
.f-carousel__dots li {
margin: 0;
padding: 0;
border: 0;
display: flex;
align-items: center;
justify-content: center;
opacity: var(--f-carousel-dot-opacity);
transition: opacity 0.15s ease-in-out;
}
.f-carousel__dots li + li {
margin: 0;
}
.f-carousel__dots li:hover {
opacity: var(--f-carousel-dot-hover-opacity);
}
.f-carousel__dots li.is-current {
opacity: 1;
}
.f-carousel__dots li button {
appearance: none;
display: flex;
align-items: center;
justify-content: center;
margin: 0;
padding: 0;
width: var(--f-carousel-dots-width);
height: var(--f-carousel-dots-height);
border: 0;
background: rgba(0, 0, 0, 0);
cursor: pointer;
transition: all 0.2s linear;
}
.f-carousel__dot {
display: block;
margin: 0;
padding: 0;
border: 0;
width: var(--f-carousel-dot-width);
height: var(--f-carousel-dot-height);
border-radius: var(--f-carousel-dot-radius);
background-color: var(--f-carousel-dot-color);
line-height: 0;
font-size: 0;
cursor: pointer;
pointer-events: none;
}
.f-carousel__dots.is-dynamic
li:not(.is-prev, .is-next, .is-current, .is-after-next, .is-before-prev)
button {
transform: scale(0);
width: 0;
}
.f-carousel__dots.is-dynamic li.is-next button,
.f-carousel__dots.is-dynamic li.is-prev button {
transform: scale(0.66);
}
.f-carousel__dots.is-dynamic li.is-current button {
transform: scale(1);
}
.f-carousel__dots.is-dynamic li.is-after-next button,
.f-carousel__dots.is-dynamic li.is-before-prev button {
transform: scale(0.33);
}
.f-carousel__dots.is-dynamic li.is-current:first-child {
margin-left: calc(var(--f-carousel-dots-width) * 2);
}
.f-carousel__dots.is-dynamic li.is-prev:first-child {
margin-left: var(--f-carousel-dots-width);
}
.f-carousel__dots.is-dynamic li.is-next:last-child {
margin-right: var(--f-carousel-dots-width);
}
.f-carousel__dots.is-dynamic li.is-current:last-child {
margin-right: calc(var(--f-carousel-dots-width) * 2);
}
.f-carousel.is-rtl .f-carousel__dots.is-dynamic .is-current:first-child,
.f-carousel.is-rtl .f-carousel__dots.is-dynamic .is-current:last-child,
.f-carousel.is-rtl .f-carousel__dots.is-dynamic .is-prev:first-child {
margin-left: 0;
margin-right: var(--f-carousel-dots-width);
}
.f-carousel.is-rtl .f-carousel__dots.is-dynamic .is-next:last-child {
margin-right: 0;
margin-left: var(--f-carousel-dots-width);
}
.f-button {
display: flex;
align-items: center;
box-sizing: content-box;
position: relative;
margin: 0;
width: var(--f-button-width);
height: var(--f-button-height);
border: var(--f-button-border);
border-radius: var(--f-button-border-radius);
color: var(--f-button-color);
background: var(--f-button-bg);
box-shadow: var(--f-button-shadow);
pointer-events: all;
cursor: pointer;
transition: var(--f-button-transition);
}
.f-button svg,
.f-carousel__nav .f-button:disabled,
.fancybox__nav .f-button:disabled {
pointer-events: none;
}
@media (hover: hover) {
.f-button:hover:not([disabled]) {
color: var(--f-button-hover-color);
background-color: var(--f-button-hover-bg);
}
}
.f-button:active:not([disabled]) {
background-color: var(--f-button-active-bg);
}
.f-button:focus:not(:focus-visible) {
outline: 0;
}
.f-button:focus-visible {
outline: 0;
box-shadow: inset 0 0 0 var(--f-button-outline, 2px)
var(--f-button-outline-color, var(--f-button-color));
}
.f-button svg {
width: var(--f-button-svg-width);
height: var(--f-button-svg-height);
fill: var(--f-button-svg-fill);
stroke: currentColor;
stroke-width: var(--f-button-svg-stroke-width);
stroke-linecap: round;
stroke-linejoin: round;
transition: opacity 0.15s ease;
transform: var(--f-button-transform);
filter: var(--f-button-svg-filter);
}
.modula-slider .modula-items .f-carousel__dots li,
.modula-slider .modula-items .f-carousel__dots li button {
transition: all 0.3s ease;
}
.f-button[disabled] {
cursor: default;
}
.f-button[disabled] svg {
opacity: var(--f-button-svg-disabled-opacity);
}
.f-carousel__nav .f-button.is-next,
.f-carousel__nav .f-button.is-prev,
.fancybox__nav .f-button.is-next,
.fancybox__nav .f-button.is-prev {
position: absolute;
z-index: 1;
}
.is-horizontal .f-carousel__nav .f-button.is-next,
.is-horizontal .f-carousel__nav .f-button.is-prev,
.is-horizontal .fancybox__nav .f-button.is-next,
.is-horizontal .fancybox__nav .f-button.is-prev {
top: 50%;
transform: translateY(-50%);
}
.is-horizontal .f-carousel__nav .f-button.is-prev,
.is-horizontal .fancybox__nav .f-button.is-prev {
left: var(--f-button-prev-pos);
}
.is-horizontal .f-carousel__nav .f-button.is-next,
.is-horizontal .fancybox__nav .f-button.is-next {
right: var(--f-button-next-pos);
}
.is-horizontal.is-rtl .f-carousel__nav .f-button.is-prev,
.is-horizontal.is-rtl .fancybox__nav .f-button.is-prev {
left: auto;
right: var(--f-button-next-pos);
}
.is-horizontal.is-rtl .f-carousel__nav .f-button.is-next,
.is-horizontal.is-rtl .fancybox__nav .f-button.is-next {
right: auto;
left: var(--f-button-prev-pos);
}
.is-vertical .f-carousel__nav .f-button.is-next,
.is-vertical .f-carousel__nav .f-button.is-prev,
.is-vertical .fancybox__nav .f-button.is-next,
.is-vertical .fancybox__nav .f-button.is-prev {
top: auto;
left: 50%;
transform: translateX(-50%);
}
.is-vertical .f-carousel__nav .f-button.is-prev,
.is-vertical .fancybox__nav .f-button.is-prev {
top: var(--f-button-next-pos);
}
.is-vertical .f-carousel__nav .f-button.is-next,
.is-vertical .fancybox__nav .f-button.is-next {
bottom: var(--f-button-next-pos);
}
.is-vertical .f-carousel__nav .f-button.is-next svg,
.is-vertical .f-carousel__nav .f-button.is-prev svg,
.is-vertical .fancybox__nav .f-button.is-next svg,
.is-vertical .fancybox__nav .f-button.is-prev svg {
transform: rotate(90deg);
}
a.modula-item-link {
display: block;
position: absolute;
top: 0;
bottom: 0;
width: 100%;
z-index: 999;
}
.modula-slider .modula-item {
position: relative;
overflow: hidden;
}
.modula-slider .figc {
position: absolute;
top: 50%;
transform: translateY(-50%);
background: 0 0;
width: 100%;
max-height: 100%;
text-align: center;
display: flex;
height: 100%;
}
.modula-slider .figc .figc-inner {
display: flex;
align-items: flex-end;
height: 100%;
width: 100%;
flex-flow: wrap;
}
.modula-slider .figc .figc-inner h2.jtg-title,
.modula-slider .figc .figc-inner p.description {
width: 100%;
}
.modula-slider .figc .jtg-social {
width: 100%;
text-align: right;
padding-right: 35px;
}
.modula-slider .figc div {
max-height: 100%;
}
.modula-slider .figc svg {
width: 20px;
height: 16px;
}
.modula-slider .figc h2:before {
display: none;
}
.modula-slider-nav-item {
position: relative;
flex-shrink: 0;
cursor: pointer;
}
.modula-slider-nav {
margin: 0 auto;
}
.modula-slider-nav-image,
.modula-slider-nav-image img {
max-width: 100%;
}
.modula-slider-nav-item .modula-slider-nav-image,
.modula-slider-nav-item .modula-slider-nav-image img {
opacity: 0.5;
border-radius: 2px;
}
.modula-slider-nav-item.is-nav-selected .modula-slider-nav-image,
.modula-slider-nav-item.is-nav-selected .modula-slider-nav-image img {
opacity: 1;
}
.modula-slider .modula-slider-slide-counter {
position: absolute;
left: 5px;
top: 5px;
line-height: 26px;
font-size: 24px;
padding: 5px 10px;
background-color: #3a3939c2;
color: #fff;
border-radius: 5px;
z-index: 99;
}
.modula-slider .modula-items .f-carousel__dots li.is-current,
.modula-slider .modula-items .f-carousel__dots li.is-current .f-carousel__dot {
width: 38px;
}
.modula-slider
.modula-items
.f-carousel__dots
li:not(.is-current)
.f-carousel__dot {
width: 8px;
}
.modula-slider .modula-items .f-carousel__dot {
width: 100%;
position: relative;
overflow: hidden;
border-radius: 1rem;
background: rgba(0, 0, 0, 0.77);
}
.modula-slider .modula-items.has-dots .f-progress {
height: 100%;
}
.modula-carousel-nav .f-carousel__track {
align-items: center;
}
.modula-slider .modula-item.f-carousel__slide {
text-align: center;
}
.modula-slider .modula-carousel-nav-wrapp {
display: flex;
justify-content: center;
}
.modula-slider .modula-items .f-carousel__track .modula-item .video-sizer {
margin: 0 auto;
position: relative;
padding-bottom: 56.25%;
}
.modula-slider .modula-item .video-sizer iframe,
.modula-slider .modula-item .video-sizer video {
min-width: 100%;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.modula-slider .modula-items.f-carousel {
--f-button-width: 38px;
--f-button-height: 38px;
--f-button-svg-width: 16px;
--f-button-svg-height: 16px;
--f-button-svg-stroke-width: 2.5;
--f-button-color: rgb(71 85 105);
--f-button-border-radius: 50%;
--f-button-shadow: 0 6px 12px -2px rgb(50 50 93 / 25%),
0 3px 7px -3px rgb(0 0 0 / 30%);
--f-button-bg: #fff;
--f-button-hover-bg: #f9f9f9;
--f-button-active-bg: #f0f0f0;
--f-button-next-pos: -22px;
--f-button-prev-pos: -22px;
}
.modula-slider .modula-items .modula-item.f-carousel__slide img.pic {
display: block;
margin: 0 auto;
}
.modula-slider .modula-items .modula-slider-image-wrapper {
width: 100%;
display: inline-block;
position: relative;
}
.modula-slider .modula-items .modula-slider-image-wrapper .slider-image-info {
width: 100%;
}
.modula-slider
.modula-items
.modula-slider-image-wrapper
.slider-image-info.top_inside {
position: absolute;
left: 0;
top: 0;
}
.modula-slider
.modula-items
.modula-slider-image-wrapper
.slider-image-info.bot_inside {
position: absolute;
left: 0;
bottom: 0;
}
.slider-image-info.bot_inside,
.slider-image-info.top_inside {
background-color: #38363640;
}
.modula-item-album-title {
margin-top: var(--theme-content-spacing, 32px);
}