@font-face {
	font-family: "Inconsolata";
	src: url('/assets/fonts/Inconsolata.ttf') format('truetype');
}
@font-face {
	font-family: "Noto Serif KR";
	src: url('/assets/fonts/NotoSerifKR.ttf') format('truetype');
}

.speech-bubble {
	display:none;

	opacity: 0;
	position: absolute;
	top: -2rem;
	left: 100vw;
	z-index: 10;

	padding: 0.125rem 0.5rem;
	font-size: 0.875rem;
	line-height: 1.25rem;
	
	background-color: #6B7280;
	border-radius: 0.25rem;
}

.speech-bubble:after {
	content: '';
	bottom: 0;

	position: absolute;

	width: 0;
	left:50%;
	height: 0;
	border: 5px solid transparent;
	border-top-color: #6B7280;
	border-bottom: 0;
	margin-left: -5px;
	margin-bottom: -5px;
}

#status-grid div:first-child {
	grid-row-start: 2;
}

/*
 * Use two 2 hr to create a dashed border with better dash len
 * The bottom hr needs a margin 2px
 */
.hr-divider-dashed {
	height: 1px;
	background-image: linear-gradient(90deg, #fff, #fff 75%, transparent 75%, transparent 100%);
	background-size: 10px 1px;
	border: none;
}


/*
.shiny:before {
	content:'';
  	top:0;
	transform:translateX(100%);
	width:100%;
	height:100%;
	position: absolute;
	z-index:1;
	animation: slide 1s infinite;
	 
  	background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 50%, rgba(128,186,232,0) 99%, rgba(125,185,232,0) 100%);
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(50%,rgba(255,255,255,0.8)), color-stop(99%,rgba(128,186,232,0)), color-stop(100%,rgba(125,185,232,0)));
	background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.8) 50%,rgba(128,186,232,0) 99%,rgba(125,185,232,0) 100%);
	background: -o-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.8) 50%,rgba(128,186,232,0) 99%,rgba(125,185,232,0) 100%);
	background: -ms-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.8) 50%,rgba(128,186,232,0) 99%,rgba(125,185,232,0) 100%);
	background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,0.8) 50%,rgba(128,186,232,0) 99%,rgba(125,185,232,0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#007db9e8',GradientType=1 );
}
@keyframes slide {
	0% {transform:translateX(-100%);}
	100% {transform:translateX(100%);}
}
*/