.custom-gallery-slider {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 16px;
}

.main-slider {
    width: 80%;
    margin-bottom: 20px;
}

.main-slide img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 8px !important;
    box-shadow: 0 0 8px 0px black !important;
}

.thumbnail-slider {
    display: flex;
    justify-content: center;
    flex-direction: column;
    gap: 16px;
}

.thumbnail-slide {
    margin: 0 5px;
}

.thumbnail-slide img {
    cursor: pointer;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    max-width: 80px !important;
    border: 1px solid !important;
    border-radius: 8px !important;
    transition: 0.3s all;
}
.thumbnail-slide img.active {
    box-shadow: 0 0 6px 0px black;
}
.thumbnail-slide img:hover{
    transform: scale(1.05);
}
.fade-in {
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

.fade-in.show {
    opacity: 1;
}
@media(max-width:570px){
    .custom-gallery-slider {
    flex-direction: column;
}
.main-slider {
    width: 100%;
    }
.thumbnail-slider {
    flex-direction: row;
}
}
/* ------------fullscreen-slider------------------ */
.fullscreen-slider {
    position: relative;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.slider-backgrounds {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/*.slider-backgrounds::before {
    content: "";
    background: url(https://template.devwizard.com.pl/wp-content/uploads/2024/10/sample-logo.webp);
    width: 24%;
    aspect-ratio: 6 / 1;
    position: absolute;
    top: 18px;
    right: 18px;
    z-index: 10;
    background-size: cover;
    opacity: 0.3;
    filter: brightness(100) drop-shadow(1px 2px 2px black);
}*/

.slider-background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transition: opacity 1s ease;
    align-content: center;
    padding: 86px;
    padding-left: 12px;
}
.slider-background::after {
    content: ""; /* Wymaga zawartości, nawet jeśli jest pusta */
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6); /* Ciemny kolor z przezroczystością (0.5 to stopień przyciemnienia) */
    z-index: 1; /* Ustawia warstwę pseudo-elementu nad tłem */
}
.slider-background.active {
    opacity: 1; /* Ustawiamy pełną widoczność dla aktywnego tła */
}

.content-container {
    max-width: 500px;
    width: 40%;
    z-index: 2;
    position: relative;
    padding: 18px 18px 18px 36px;
    margin-top: 100px;
    /* background: rgba(0, 0, 0, 0.6); */
    /* box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37); */
    /* backdrop-filter: blur(4px); */
    /* border-radius: 50%; */
    /* padding-left: 0; */
    /* aspect-ratio: 1 / 1; */
}

.content {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    /* border: 2px solid var(--e-global-color-accent); */
    padding: 18px;
    align-items: flex-start;
    /* border-radius: 50%; */
    height: 100%;
    width: 100%;
    /* border-left: none; */
}

.slider-logo {
    width: 50%;
    max-width: 300px;
    aspect-ratio: 4 / 2;
    background-position: center;
    background-size: cover;
    filter: brightness(0) invert(1);
}

.slider-description {
    color: #f5f5f5;
    font-family: "Raleway", Sans-serif;
    max-width: 700px;
    font-size: clamp(12px, 2vw, 18px) !important;
    font-weight: 400;
/*    padding: 5px 10px;*/
    margin: 0 0 30px 0;
    text-align: left;
    text-shadow: 2px 2px 6px black;
}

.slider-button {
    /* padding: 12px 25px; */
    color: white;
    text-decoration: none !important;
    transition: background 0.3s ease;
    /* background-color: var(--e-global-color-accent); */
    /* border-radius: 36px; */
    /* min-width: 180px; */
    /* text-align: center; */
    margin-left: auto;
    margin-right: 30px;
    /* border: 1px solid; */
    /* text-shadow: 0 0 8px black; */
    /* background: radial-gradient(ellipse farthest-corner at right bottom, #c1a625 0%, #FDB931 8%, #bb9a54 30%, #c7a353 40%, transparent 80%), radial-gradient(ellipse farthest-corner at left top, #FEDB37 0%, #ebae34 8%, #ffd271 25%, #c9a34f 62.5%, #614d21 100%); */
    }

.slider-button:hover {
    color: white;
}

span.button-arrow {
    position: absolute;
    padding-left: 6px;
    transition: padding-left 0.3s;
    font-size: 26px;
    line-height: 1;
}

a:hover span.button-arrow {
    padding-left: 12px;
}

.slider-title {
    color: #f5f5f5 !important;
    font-family: var( --e-global-typography-primary-font-family ), Sans-serif;
    font-size: clamp(18px, 3vw, 38px) !important;
    font-weight: var( --e-global-typography-primary-font-weight );
/*    padding: 5px 10px;*/
    margin: 0 0 5px 0;
    text-shadow: 2px 2px 6px black;
}

.slider-navigation {
    position: absolute;
    bottom: 100px;
    width: 100%;
    text-align: center;
    z-index: 2;
    display: flex;
    justify-content: space-between;
}

.slider-arrow {
    display: flex; /* Poprawiono literówkę */
    align-items: center;
    justify-content: center;
    color: white;
    border-color: white;
    font-size: 15px;
    width: 60px;
    height: 60px;
    border-style: none;
}

.slider-arrow svg {
    fill: rgba(255, 255, 255, 0.8);
    transition-duration: 0.1s;
    width: 15px;
}

.slider-next.slider-arrow {
    transform: rotate(180deg);
}

@media (max-width: 767px) {
    .content {
    padding: 18px;
}
.slider-navigation {
    top: 90%;
}
}
/* ------------menu-header-menu------------------ */
.vertical-menu{
    list-style: none;
    padding: 0;
}
.vertical-menu li{
    padding-top: 6px;
}
.vertical-menu a{
    font-family: "Raleway", Sans-serif;
    font-size: 12px;
    font-weight: 600;
    color: black;
    transition: 0.2s color;
}