body {
	background-color:#88afd4;
}

.header {
	background-color:#3c72a5;
}

.footer {
	background-color:#3c72a5;
}

.subfooter {
	background-color: #2b5276;
}

.subfooter a {
	color: #ffffff;
}

.actioninfo {
	padding: 1rem;
}

.actionbtn {
	/* background-color:#28a745; */
	color:#ffffff;
	text-align:center;
	padding: 1rem;
	height: 100%;
	transition: 200ms linear;
}

.actionbtn:hover {
	/* background-color:#ffffff; */
	/* color:#28a745; */
	box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.5);
	transition: 200ms linear;
}

.actionbtn-info {
	background-color: #3c72a5;
}

.actionbtn-success {
	background-color: #28a745;
}

.actionbtn-warning {
	background-color: #ffa040;
}

.actionbtn-danger {
	background-color: #d85050;
}

.actionbtn-secondary {
	background-color: #a0a0a0;
}

.editicon {
	position: absolute;
	right: 2rem;
	top: 1.6rem;
	font-size: 2rem;
	color: #c0c0c0;
	margin: 0;
	padding: 0;
	display: inline;
}

.numblock {
	position: fixed;
	z-index:3000;
	top:0;
	left:0;
	width: 100%;
	height:100%;
	color:#ffffff;
	background-color:#3c72a5;
	animation-name: numblock;
	animation-duration: 1s;
	animation-delay:3.5s;
	animation-fill-mode: forwards;
}
 
@keyframes numblock {
	0% { opacity: 1; }
	99% { opacity: 0; width:100%; height:100%; }
	100% { opacity: 0; width:0; height:0; }
}

.num3 {
	font-family: "Arial Black", sans-serif;
	animation-name: num3;
	animation-duration: 0.9s;
	animation-delay: 0s;
	animation-fill-mode: forwards;
	font-size: 400px;
	line-height: 400px;
	font-weight: bold;
	text-align: center;
	width: 100%;
}

@keyframes num3 {
	0% { font-size:400px; color:#3c72a5; }
	5% { color:#ffffff; }
	20% { font-size:410px; }
	95% { color:#ffffff; }
	98% { width:100%; height:100%; font-size:300px; color:#3c72a5; }
	100% { width:0; height:0; font-size:0; }
}

.num2 {
	font-family: "Arial Black", sans-serif;
	animation-name: num2;
	animation-duration: 0.9s;
	animation-delay:1s;
	animation-fill-mode: forwards;
	font-size:0;
	line-height:400px;
	font-weight:bold;
	text-align:center;
	width:0;
	height:0;
}

@keyframes num2 {
	0% { width:0; height:0; color:#3c72a5; }
	1% { font-size:400px; width:100%; height:100%; }
	5% { color:#ffffff; }
	20% { font-size:410px; }
	95% { color:#ffffff; }
	98% { width:100%; height:100%; font-size:300px; }
	100% { width:0; height:0; font-size:0; color:#3c72a5; }
}

.num1 {
	font-family: "Arial Black", sans-serif;
	animation-name: num1;
	animation-duration: 0.9s;
	animation-delay:2s;
	animation-fill-mode: forwards;
	font-size:0px;
	line-height:400px;
	font-weight:bold;
	text-align:center;
	width:100%;
}

@keyframes num1 {
	0% { font-size:0px; color:#3c72a5; }
	1% { font-size:400px; width:100%; height:100%; }
	5% { color:#ffffff; }
	20% { font-size:410px; }
	95% { color:#ffffff; }
	98% { width:100%; height:100%; font-size:300px; }
	100% { width:0; height:0; font-size:0; color:#3c72a5; }
}

.num0 {
	font-family: "Arial Black", sans-serif;
	animation-name: num0;
	animation-duration: 1s;
	animation-delay: 3s;
	animation-fill-mode: forwards;
	font-size: 0px;
	line-height: 300px;
	font-weight: bold;
	text-align: center;
	width: 100%;
}

@keyframes num0 {
	0% { font-size: 0px; }
	1% { font-size: 200px; width: 100%; height: 100%; }
	10% { font-size: 210px; }
	20% { font-size: 200px; }
	30% { font-size: 220px; }
	40% { font-size: 200px; }
	50% { font-size: 230px; }
	98% { width: 100%; height: 100%; font-size: 100px; }
	100% { width: 0; height: 0; font-size: 0; }
}