.h-0 {
    height: 0;
}

.layer {
	position: absolute;
	mix-blend-mode: lighten;

	max-width: 100%;
    max-height: 100%;

	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	padding: 0;
	margin: auto;

	height: auto;
	width: auto;
}

.btn-prev {
	grid-area: 1 / 1 / 1 / 3;
	background-image: url("/static/project/img/left-arrow.e588a62a4150.svg");
	background-repeat: no-repeat;
	background-position: center center;
    height: 2rem;
}

.btn-next {
	grid-area: 1 / 3 / 1 / 5;
	background-image: url("/static/project/img/right-arrow.0e46542662dd.svg");
	background-repeat: no-repeat;
	background-position: center center;
    height: 2rem;
}

.btn-create {
	grid-area: 2 / 1 / 2 / 1;
	background-image: url("/static/project/img/add.1ea3770d671a.svg");
	background-repeat: no-repeat;
	background-position: center center;
    height: 2rem;
}

.btn-update {
	grid-area: 2 / 2 / 2 / 2;
	background-image: url("/static/project/img/update.4680e09d9e67.svg");
	background-repeat: no-repeat;
	background-position: center center;
    height: 2rem;
}

.btn-remove {
	grid-area: 2 / 3 / 2 / 3;
	background-image: url("/static/project/img/remove.5430bdf78691.svg");
	background-repeat: no-repeat;
	background-position: center center;
    height: 2rem;
}

.btn-list {
	grid-area: 2 / 4 / 2 / 4;
	background-image: url("/static/project/img/list.c9196f72ccbc.svg");
	background-repeat: no-repeat;
	background-position: center center;
    height: 2rem;
}

.btn-rename {
	background-image: url("/static/project/img/rename.1fa6a130e828.svg");
	background-repeat: no-repeat;
	background-position: center center;
    height: 2rem;
}

.shortcuts {
	position: absolute;
	bottom: 0;
	right: 0;
}

#btn-enter-fullscreen {
	position: absolute;
	bottom: 0;
	right: 0;
	width: 2rem;
}

.btn-fullscreen {
	background-image: url("/static/project/img/fullscreen.fc865f54d6be.svg");
	background-repeat: no-repeat;
	background-position: center center;
    height: 2rem;
	width: 2rem !important;
}