/* Bootstrap is too aggressive with heading sizes. */
/* Default HTML
h1 { font-size: 2.0rem; }
h2 { font-size: 1.5rem; }
h3 { font-size: 1.3rem; }
h4 { font-size: 1.0rem; }
h5 { font-size: 0.8rem; }
h6 { font-size: 0.7rem; }
*/
/* Our sizing, don't use < h3! */
h1 { font-size: 1.5rem;	}
h2 { font-size: 1.2rem; }
h3 { font-size: 1.0rem; }
/* Warn the devs if they use too-smol heading */
h4 { color: red; }
h5 { color: red; }
h6 { color: red; }


/* Blech. Who picked this??? */
.eegreen {
	color: rgb(69, 110, 88);
}

/* The newer benchmarks create a sub-navbar. The header replaces PNG files */
.ee-header h1 {
	font-size: 2rem;
}

.navbar-brand span b {
	color: rgb(69, 110, 88);
}

/* bootstrap used to provide this for objects that load hidden */
.hide {
	display: none;
}

/* Make table headers in sortable tables change cursor */
table.sortable th {
	cursor: pointer;
}

body {
	/* Such a lovely shade of grey... */
	background: white; /*#f8f9fa;*/
	/* Unfortunately, only default on MacOS */	
	/* font-family: Avenir; */
	font-family: Avenir, Lato, Helvetica, sans-serif;
}

/* For small pages, give some room so that it doesn't look cramped. */
.main {
	min-height: 50rem;
}

/* We sometimes make text act like links through JS, so cue the user. */
.pointer {
	cursor: pointer;
}

/* For our loading... throbber. */
.popup {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: white;
    border: 1px solid gray;
    border-radius: 5px;
    padding: 30px;
    box-shadow: 0 0 10px rgba(0,0,0,0.25);
    z-index: 1000;
}

/* This is how VueJS hides apps' in-progress rendering. */
[v-cloak] > * {
	display: none;
}

/* Submit forms should highlight their rows */
.hover:hover {
	background: #eee;
}

/* This is a bootstrap column which renders ellipsis on overflow */
.ellipsis-col {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}