:root {
	--bg-col: rgba(0, 139, 139, 0.1); /*darkcyan*/
	--bg-col-hover: rgba(0, 139, 139, 0.2);

	--rowHeight: 60px;

	--color-1: darkslategrey;
	--color-2: darkcyan;
	--color-3: crimson;

	--color-2-8: rgba(0, 139, 139, 0.8);
}

body {
	position: relative;
	height: 100vh;
	width: 100vw;

	padding: 0;
	margin: 0;

	font-family: 'Ubuntu', monospace;
}

/*.bg-d p{*/
	/*color: var(--color-2);*/
/*}*/
/*.bg-l p{*/
	/*color: var(--color-1);*/
/*}*/

a{
	color: var(--color-3);

	text-decoration: none;
	text-shadow: 1px 1px rgba(0,0,0,0.5);
}
a:hover{
	text-decoration: underline;
	text-shadow: 2px 2px rgba(0,0,0,0.3);
}
a::after{
	content: '...';
}

button{
	position: relative;
	padding: 8px 16px;
	border: none;
	border-radius: 4px;
	outline: none;

	box-shadow: 1px 1px 2px rgba(0,0,0,0.5);
	font-family: 'Ubuntu', monospace;
	font-size: 17px;
	font-weight: bold;
	text-align: center;
	cursor: pointer;
}
button:hover{
	box-shadow: 2px 2px 2px rgba(0,0,0,0.5);
	outline: none;
}
button:active{
	top: 1px;
	left: 1px;
	box-shadow: 1px 1px 2px rgba(0,0,0,0.5);
}

.bg-d button{
	background-color: var(--color-2);
	color: var(--color-1);
} /*dark colors*/
.bg-d button:hover{
	background-color: var(--color-2-8);
} /*dark colors*/

ul{
	list-style: none;
}
.bg-d li::before {
	content: "•";
	display: inline-block;
	width: 1em;

	color: var(--color-2);

	margin-left: -1em;

	font-weight: bold;
}

h2{
	display: inline;
}

.fill{
	height: 100%;
	width: 100%;
}
.centred-wrapper {
	display: grid;
}
.centred-content {
	margin: auto;
}
.border-l{
	border-radius: 10px;
	padding: 10px;
	border: 2px var(--color-2) solid;
}
.border-bottom-l{
	margin-right: 50px;
	margin-left: 50px;
	padding-bottom: 10px;
	border-bottom: 2px var(--color-2) solid;
}
.bg-d{
	background-color: var(--color-1);
	color: var(--color-2);
}
.bg-l{
	background-color: var(--color-2);
	color: var(--color-1);
}

.info-panel{
	position: absolute;
	top: 0;
	height: 100%;
	width: 100%;

	background-color: var(--color-3);
}
.info-panel-moved{
	top: -100%;
	transition: 1s;
}

#main-content{
	box-sizing: border-box;
	padding: 10px;
}
