.image-uploading-container, .image-uploading-gallery {
    height: calc(100% - 100px);
    /*display: grid;*/
    /*gap: 20px;*/

    /*align-items: flex-start*/
    
        ;
}
.image-uploading-gallery{
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(auto-fit, 320px);
    justify-content: space-evenly;
    /*align-items: flex-start*/
    padding: 15px;
    /*background-color: #DCDEDD;*/
}


.image-uploading-container .items{
    padding: 8px;
}

.image-uploading-container .items .front-image-background{
    background-color: #EFEFEF;
}


.image-label{
    transition: 250ms background-color;
}
.image-label:hover{
    background-color: #eeeeee !important;
}

.image-delete-button{
    top: -5%;
    left: -5%;
    width: 25px;
    height: 25px;

}


.signin-container {
    /* position: relative; */
    width: 550px;
    height: 65%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: column;

}


.tower-pic {
    object-fit: fill;
    width: 100%;
    height: 100%;

}

.signin-right {
    width: 30%;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;

}

.signin-left {
    width: 70%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}

.top {
    width: 100%;
    height: auto;
    font-size: calc(1em + 1.5vw);

}

.bottom {
    width: 100%;
    height: 82%;

}

button a:hover{
    color: white !important;
}

#left-button{
    left: 8%;
}
#right-button{
    left: 92%;
}

.font-color{
    color: var(--site-primary);
}

#left-button,
#right-button{
    transition: 250ms color;
    cursor: pointer;
}

#left-button:hover,
#right-button:hover{
    color: var(--secondary-second-der)
}

.front-image-container{
    transition: 350ms all;
}