/* C1tizen's CSS work */

:root {
    --color1: #1A7EA3;
    --color2: #12CAB7;
    --white: #FFFFFF;
    --beige: #FEFAF0;
    --black: #000000;
    --discord: #2F2F2F;
}

body{
    background-color: black;
}

#customMyGallery {
    text-align: center;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
}

.customCover {
    width: 20%;
    padding: 10px;
    display: flex;
    min-width: 230px;
    max-width: 260px;
    border-radius: 10px;
    transition: 0.2s;
}

.customGal{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    border-radius: 20px;
    width: 100%;
    padding: 0;
    background-color: var(--discord);
    color: var(--beige);
    filter: saturate(100%) brightness(100%);
    transition: 0.2s;
}

.customGal .customAlb {
    width: 100%;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    transition: 0.2s;
}

.customGal .customImage {
    width: 100%;
    height: 200px;
    background-size: cover;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    background-position: center, center; /* Vycenteruje obrazok v nahladovke kazdej galerie */
}

.customGal .customLink {
    color: var(--beige) !important;
    text-decoration: none;
    font-size: 18px;
    font-weight: bold;
    font-family: 'Nunito Sans', sans-serif;
    text-align: center;
    margin-top: 5px;
}

.customGal .customInfo{
    width: 100%;
    margin-top: 5px;
    margin-bottom: 15px;
    display: flex;
    justify-content: space-evenly;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 12px;
}

.customGal .customShare {
    cursor: pointer;
}

/* All hover effects */
.customGal:hover {
    box-shadow: 5px 5px 20px var(--discord);
    transform: scale(1.025);
}

.customGal:hover > .customAlb {
    filter: saturate(120%) brightness(110%);
}