/* please wait overlay class */
.overlay_pleasewait {
	display: block;
	height: 100%;
	width: 0;
	position: fixed;
	z-index: 2;
	top: 0;
	left: 0;
	background-color: rgb(217,217,214);
	overflow-x: hidden;
	opacity: 0.8;   /* transparency */
	transition: 0s;
}


/* Not used in this project, but could be activated as another layer on top of the main pleasewait.
.overlay_pleasewait-content {
	position: relative;
	top: 25%;
	width: 100%;
	text-align: center;
	margin-top: 30px;
	opacity: 0.8;
	font-size: 40px;
} */

.overlay_pleasewait a {
	padding: 8px;
	text-decoration: none;
	font-size: 36px;
	color: #818181;
	display: block;
	transition: 0.3s;
}

.overlay_pleasewait a:hover, .overlay a:focus {
	color: #f1f1f1;
}

.overlay_pleasewait .closebtn {
	position: absolute;
	top: 20px;
	right: 45px;
	font-size: 60px;
}



/* classes used for the loading animation */
@keyframes spinner {
	0% {
		transform: translate3d(-50%, -50%, 0) rotate(0deg);
	}
	100% {
		transform: translate3d(-50%, -50%, 0) rotate(360deg);
	}
}
.spin::before {
	animation: 1.5s linear infinite spinner;
	animation-play-state: inherit;
	border: solid 3px #cfd0d1;
	border-bottom-color: #1c87c9;
	border-radius: 50%;
	content: "";
	height: 30px;
	width: 30px;
	position: absolute;
	top: 120%;
	left: 50%;
	transform: translate3d(-50%, -50%, 0);
	will-change: transform;
}

.loading {
	position: absolute;
	left: 10;
	right: 10;
	top: 50%;
	width: 50%;
	align-content: center;
	text-align: center;
	color: black;
	margin: auto;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	font-size: 22px;
	font-family: sans-serif;
}
.large {
	font-size: 28px;
	font-family: sans-serif;
	margin-left: 20px;
}
.small {
	font-size: 22px;
	font-family: sans-serif;
	margin-left: 20px;
}
.exit {
	background:lightblue;
	float: right;
	height: 10px;
	width: 10px;
}