@import url('https://fonts.googleapis.com/css2?family=Langar&display=swap');

table.propagation, table.hottest {
    width: 100%;
    margin-top: 1em;
}
table.propagation tr th, table.hottest tr th {
    text-transform: uppercase;
    font-size: 0.7em;
    text-align: center;
}
table.propagation tr td, table.hottest tr td {
    border: 1px solid #ccc;
    text-align: center;
    font-weight: 500;
}
table.propagation tr td.propagation-label-G {
    color: #468847;
}
table.propagation tr td.propagation-label-F {
    color: #f89406;
}
table.propagation tr td.propagation-label-P {
    color: #b94a48;
}
span.propagation-copy {
    display: block;
    color: #777;
    font-style: italic;
    font-size: 0.8em;
    text-align: center;
}
div.home-copy p {
    font-size: 0.6em;
    color: #777;
}
div.home-copy p a {
    text-transform: uppercase;
}
div.home-banner {
    color: #fff;
    text-shadow: 1px 3px 0 #444444, 1px 13px 5px #333333;    
}
div.home-banner a {
    text-shadow: none;
}


.heading {
	font-size: 48px;
	text-align: center;
	font-family: 'Langar';
	.word {
		color: #fff;
		margin: 0 10px;
		display: inline-block;
		text-shadow: 0 1px black, 0 3px white;
		&>span {
			opacity:0;
			display: inline-block;
			&.active {
				opacity: 1;
				animation-name: zoomInUp;
				animation-duration: 1s;
				animation-fill-mode: both;
			}
		}
	}
}
@keyframes zoomInUp {
	from {
		opacity: 0;
		transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
		animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
	}
	60% {
		opacity: 1;
		transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
		animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
	}
}