:root {
    --cc-text : black;
    --cc-bg : white;
    --cc-accent : blue;
}

html {
    color : var(--cc-text);
    background-color: var(--cc-bg);
    font-family: helv;
    line-height: 0.97;
    margin-left: 15vw;
    font-size: 1.8vh;
}

a {
    color: var(--cc-accent);
    text-decoration: none;
    font-family: helv_light;
}

a:hover {
    opacity: 0.5;
}

footer {
    position: fixed;
    bottom: 0;
    mix-blend-mode: difference;
}

header {
    position: fixed;
    color: var(--cc-bg);
    mix-blend-mode: difference;
}

footer a, header a {
    color: yellow;
}

.gallery {
}

.comp {
    /*margin-top: 2em;*/
    width: 250px;
    margin-right: 2em;
}

#samples_list, #images_list {
    display: flex;
    flex-wrap: wrap;
}

#samples, #images {
    /*
    border-left: solid px pink;
    border-right:  solid 1px pink;*/
}

.s_image {
    margin-top: 1em;
    margin-bottom: 1em;
}

.i_image {
    margin-top: 1em;
    margin-bottom: 1em;
}

.image {
    max-width: 50%;
}

.s_type {
    font-style: italic;
}