body,html{
	width: 100%;
	padding:0;
	margin:0;
	overflow-x:hidden;
}
body{
    display: flex;
    flex-direction: column;
    min-height: 100vh;  
}
body.logged-in {
    background-color: #f3f4f6!important;
}
.spacer{
    flex:1;
}
.navbar{
	border-bottom: 5px solid #d9d9d9;
}

.navbar ul.nav{
	font-size: 14px;
}
.footer{
	border-top: 5px solid #d9d9d9;
	
}
.footer-inside{
	max-width: 1320px;	
}

.inline-labels {
    position: fixed;
    z-index: 9999;
    background-color: #000000c4;
    color: lightgray;
    padding: 10px;
    display: flex;
    flex-wrap: wrap;
    width: 360px;
    top: 15px;
    left: 15px;
    font-size: 14px;
    justify-content: start;
}
.inline-labels button {
    color: black;
    line-height: 9px;
	margin-right:10px;
}
.inline-labels button:hover {
    color: #F0F0F0;
	background-color:black;
}
.inline-labels .coords strong {
    color: white;
}
.cropmarker{
	position: absolute;
    z-index: 599;
    overflow: hidden;
    background-color: #6495ed7d;
    border: 2px solid cornflowerblue;
}
.cropmarker:hover{
	background-color: #6494edbd;
}
.cropmarker:not(:hover):before {
    content: attr(data-idx);
    position: absolute;
    display: block;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
	color: white;
	font-size: 3rem;
	font-weight:bold;
}
.cropmarker:hover:before {
    content: "REMOVE";
    position: absolute;
    display: block;
    left: 50%;
    top: 50%;
	font-size: 2rem;
    transform: translate(-50%,-50%);
	color: white;
}

#snapshotCarousel:not(.fullscreen) .card-body .screenshot{
	height:auto!important;
}
span.material-symbols-outlined {
    font-size: 14px;
    position: relative;
    top: 3px;
    cursor: default;
}

button.dt-button {
    background: cornflowerblue;
    padding: 5px;
    border: 1px solid purple;
    border-radius: 5px;
    min-width: 100px;
}

