@font-face { font-family: Relevant; src: url('Relevant-Normal.otf'); } 
@font-face { font-family: Relevant; font-weight: bold; src: url('Relevant-Bold.otf'); } 
html, body {
	font-family: Relevant;
	height: 100%;
	width: 100%;
	margin: 0;
	padding: 0;
	background-color: white;
	  	position: relative;
}


.linkbadge{
	color: black; 
	position: absolute; 
	top: 7%;
	font-size: 150%;
	font-weight: bold;
	cursor: pointer;
}

.linkbadge.left{
	left:7%; 
}

.linkbadge.right{
	right:7%; 
}

.flapper {
	z-index: 10;
    border-color: white !important;
	font-family: Relevant;
    margin: 20px auto;
    padding: 20px;
    text-align: center;
}
.digit div {
	background: white;
	font-color: black;
	border-color: white!;
}        

.flapper.custom .digit{
    background-color: white;
    border-color: white;
} 

.flapper.custom .digit div {
    background: white;
    color: black;
    border-color: white;
}

.center-content {
	position: relative;
	top: 50%;
	cursor: pointer;
	transform: translateY(-50%); 
}


.hidden{
	position: absolute;
	overflow: scroll;
	opacity: 0;
	width: 100%;
	height: 100%;
	background: white;
}

.hidden-text{
	position: absolute;
	font-size: 300%;
	color: black;
	left: 50%;
  	top: 50%;
	cursor: pointer;
	transform: translate(-50%,-50%);
}


@media screen and (max-width: 1300px) {
	.hidden-text{
		font-size: 270%;
	}
}

@media screen and (max-width: 800px) {
	.hidden-text{
		font-size: 200%;
	}
}