.gallery{
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 64px;

}

.gallery_set{
    display: flex;
    flex-direction: column;
    justify-items: center;
    align-items: center;
    gap: 16px;
}

.slider{
    display: flex;
    align-items: center;
    justify-content: center;
}

h2{
    max-width: 600px;
    width:80vw;
}

.slider > figure > video{
    max-width: 600px;
    width:80vw;
    border-radius: 16px;
}

.slider > figure > img{
    max-width: 600px;
    width:80vw;
    border-radius: 16px;
}

.slider > figure > img:hover{
    cursor: pointer;
}

.hidden_media{
    display: none;
}

.media{
    display: block;
    z-index: 1;
}

.previous_media{
    display: block;
    position: absolute;

    transform: translatex(-40%) scale(.8);
    opacity: .4;
}
.previous_media:hover{
    cursor: pointer;
}

.next_media{
    display: block;
    position: absolute;

    transform: translatex(40%) scale(.8);
    opacity: .4;
}
.next_media:hover{
    cursor: pointer;
}

.hidden_image_viewer{
    display: none;
    position: absolute;
}
.visible_image_viewer{
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #2b2b2bb2;
    z-index: 2;
}

#image_viewer > a{
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    /*align-self: flex-end;*/
    width: 36px;
    height: 36px;
    z-index: 2;
    margin: 16px;
    padding: 4px;
    border-radius: 32px;
    border-color: var(--main-blue);
    border-width: 4px;
    border-style: solid;
}

#image_viewer > a:hover{
    background-color: var(--main-blue);
}

#image_viewer > img{
    z-index: 2;
    max-width: 80%;

}
#image_viewer > a > img{
    width: 100%;
}