.no-wrap {white-space: nowrap;}
#filter-td,#load-td {height: 1em;}
.blur {
        color: transparent;
        text-shadow: 0 0 4px #000;
}
.list-toggle0 { 
	background-color: lightgrey; 
	width: 100%; 
	margin:  0.5em;
	margin-top: 0;
	margin-bottom: 1em;
	padding:  0.5em;
	border-radius: 6px;
}
.list-toggle0 .info { 
	display: none; 
	text-decoration: none; 
} 
div:hover.list-toggle0 { 
	background-image: linear-gradient(transparent,rgba(0,0,0,.05) 40%,rgba(0,0,0,.1));
}
div:hover.list-toggle0>.info { display: inline; font-weight: bolder; } 
.list-toggle1 { 
	background-color: lightgrey; 
	width: 100%; 
	margin:  0.5em;
	margin-top: 0;
	margin-bottom: 1em;
	padding:  0.5em;
	border-radius: 4px;
}
.list-toggle1 .info { 
	display: none; 
	text-decoration: none; 
}
div:hover.list-toggle1 { 
	background-image: linear-gradient(transparent,rgba(0,0,0,.05) 40%,rgba(0,0,0,.1)); 
}
div:hover.list-toggle1>.info { display: inline; font-weight: bolder; }
.tag { cursor: pointer; margin: 3px; padding: 3px; font-weight: lighter; background-color: grey; color: white; border-radius: 4px; font-size: 0.5em; text-transform:uppercase;  }
#filter-td { padding-left: 10px; padding-right: 10px; padding-bottom: 0.5em; ;width: 100% }
#filter-td input { width: 100%; position: relative; top: 0.5em; }
#filterresultcount { position:  relative; float: right; top: -1.25em; left: -1em; color: grey; }
div.config>div { float: right; }
#load-td { 
	padding-left: 10px; 
	padding-right: 10px; 
	display: inline; 
	vertical-align: center; 
    position: relative;
    overflow: hidden;
    margin: 10px;
    height: 2.5em;
}
#load-td input { margin-left: 10px;
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    padding: 0;
    font-size: 20px;
    cursor: pointer;
    opacity: 0;
    filter: alpha(opacity=0);
    width: 8em;
}
.config button { margin: 0.25em; }
#spinner { 
	position: fixed; 
	z-index: 1000; 
	width: 100%; /* Full width (cover the whole page) */
  	height: 100%; /* Full height (cover the whole page) */
  	top: 0;
  	left: 0;
  	right: 0;
  	bottom: 0;
  	background-color: rgba(0,0,0,0.5); /* Black background with opacity */
  	z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  	cursor: pointer; /* Add a pointer on hover */
  	margin: 0px;
}
#spinner>center>strong {color: white; text-shadow: 2px 0 0 #000, 0 -2px 0 #000, 0 2px 0 #000, -2px 0 0 #000;}
#spinner>center>span {color: white; text-shadow: 2px 0 0 #000, 0 -2px 0 #000, 0 2px 0 #000, -2px 0 0 #000;}
#spinner>div {margin-top: 200px;}
#infoline {margin: 10px; color: lightgrey;}
button.pure-button-active { background: rgb(66, 184, 221); }
#button-about {background: rgb(245,245,245); color: grey;}
#button-random {background: rgb(245,245,245); color: grey;}
#button-reset { margin-left: 15px; }
#button-reset-cold { margin-right: 15px; }
#hints { color: light-grey; margin-left: 10px; }
#popup {
    position: absolute;
    x: 0;
    y: 0;
    z-index: 2;
    width: 70%;
    background-color: rgb(96, 214, 251, 0.95);
    height: 24em;
    left: 15%;
    top: 15%;
    border-radius: 5px;
    padding:  1em;

}
#popup .logo {
	background-color: #c32e3b;
	color: white;
	text-transform:uppercase;
	font-weight: lighter;
	font-family: Arial, Helvetica, sans-serif;
	padding: 4px;
	padding-left: 18px;
	padding-right: 18px;
}
#button-sort { 
	margin-top: 1.4em; 
	margin-bottom: -1em; 
	font-size: 0.5em; 
	height: 2.5em;
	width: 5em;
	background: rgb(245,245,245); 
	color: grey;
}
canvas.emscripten {
	width: 832px;
	height: 588px;
}
#button-ffwd {
	line-height: inherit !important;
}
div:hover.list-toggle0 > .disk { display: none }
div:hover.list-toggle1 > .disk { display: none }
.info.disk:hover { font-weight: normal !important; cursor: pointer !important; } 
