.jet-slider { position: relative; .hidden-html { display: none; } .slider-pro { visibility: hidden; &.slider-loaded { visibility: visible; } } .jet-slider-loader { display: none; } &__image-exact { .sp-image { object-fit: cover; } } &__image-contain { .sp-image { object-fit: contain; } } &:before { } &__item { overflow: hidden; } &__content { display: flex; flex-flow: column nowrap; justify-content: center; align-items: center; } &__content-item { position: relative; display: flex; flex-flow: row nowrap; justify-content: center; min-width: 100%; } &__content-inner { display: flex; flex-flow: column nowrap; justify-content: center; align-items: center; position: relative; width: 100%; } &__icon { display: flex; justify-content: center; width: 100%; .jet-slider-icon-inner { display: flex; flex-flow: column nowrap; justify-content: center; align-items: center; svg { width: 1em; height: 1em; } } } &__title { width: 100%; } &__subtitle { width: 100%; } &__desc { width: 100%; } &__button-wrapper { width: 100%; } &__button { margin: 0 5px; } .sp-slides-container { background-size: cover; } .sp-image-container { position: relative; &:after { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; background-color: rgba(0,0,0, 0.3); content: ''; } } .sp-full-screen-button { color: white; svg { width: 1em; height: 1em; } } .sp-arrow { width: 40px; height: 40px; border-radius: 50%; display: flex; justify-content: center; align-items: center; &.sp-next-arrow { transform: scale(-1, 1); } svg { width: 1em; height: 1em; } i { width: 100%; height: 100%; display: flex; flex-flow: column nowrap; justify-content: center; align-items: center; line-height: 0em; } &:before, &:after { display: none; } } .sp-full-screen-button { display: flex; flex-flow: column nowrap; justify-content: center; align-items: center; transform: rotate(0deg); transform-origin: 50%; top: 10px; right: 10px; &:before { display: none; } } .sp-buttons { width: 100%; padding: 0; margin: 0 auto; .sp-button { width: 15px; height: 15px; border-radius: 50%; } } .sp-thumbnails { .sp-thumbnail-container { position: relative; cursor: pointer; &:before { display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; right: 0; bottom: 0; content: ''; } &.sp-selected-thumbnail { } .sp-thumbnail { } } } .sp-grab { cursor: auto; } }