body>header hgroup h1 {
	line-height:3rem;
	height:3rem;
	font-size:1.5rem;
	text-align:center;
}
.result-list {
	display:none;
}
.result-list.filled {
	display:block;
}
.flex-group {
	display:-webkit-flex;
	display:flex;
}
.control-group .flex-label,
.control-group .flex-input,
.control-group .flex-button {
	border:1px solid #999;
	border-radius:0;
	background-color: transparent;
	box-shadow: none;
	height:3rem;
	line-height:3rem;
}

.control-group :not(:first-child) {
	border-left-width: 0;
}
.control-group :first-child {
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
}
.control-group :last-child {
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;
}
.control-group .flex-label,
.control-group .flex-button {
	padding:0 0.5rem;
	font-size:1.5rem;
	background-color:#ddd;
	text-align:center;
}

.control-group .flex-input {
	padding:0 0.5rem;
	font-size:2rem;
	background-color:white;
}
.control-group .flex-button {
	width:100%;
}

.control-group .small {
	font-size:.7rem;
	height:2rem;
	line-height:2rem;
}
.control-group .flex-one {
	-webkit-flex: 1 0 auto;
	flex: 1 0 auto;
	width:auto;
}
.control-group .flex-two {
	-webkit-flex: 2 0 auto;
	flex: 2 0 auto;
	width:auto;
}
.control-group .flex-none {
	width:auto;
}

.die-row+.die-row {
	margin-top: 0.5em;
}
.control-group {
	position:relative;
	z-index:2;
}
.control-group.control-group-sub {
	margin-top:0;
	z-index:1;
	-webkit-transform:translateY(-8px);
	transform:translateY(-8px);
	-webkit-transition:all 0.3s;
	transition:all 0.3s;
}
.die-row:hover .control-group-sub {
	-webkit-transform:translateY(-3px);
	transform:translateY(-3px);
}





.result-list ul {
	list-style-type:none;
	padding-left:0;
	margin-top:0;
	margin-bottom: 0;
}

.final-result {
	font-size:3rem;
	line-height:1em;
}
.list-result {
	font-size:2rem;
	line-height:1em;
}


.dice-nav {
	background-color:#59a9e6;
	margin-bottom:10px;
}
.dice-nav .flex-button {
	font-size:0.8rem;
	padding:0.2rem 0.5rem;
	flex:1 1 auto;
	text-align:center;
	color:white;
	cursor:pointer;
	transition:all 0.3s;
}
.dice-nav .flex-button:hover {
	background-color:rgba(255,255,255,0.5);
}
.dice-sections>:not(:first-child) {
	display:none;
}
.dice-sections {
	max-height:70vh;
	overflow:auto;
}

.dice-maker {
	height:100%;
}
.dice-maker .makers {
	height:calc(100% - 60px);
	overflow:auto;
}

.dice-history li {
	margin:0.2em 0.5em;
	clear:both;
}
.dice-history li+li {
	border-top:1px dashed #999;
}
.history-notation {
	font-size:0.9rem;
	line-height:1em;
}
.history-total {
	line-height:1em;
	font-size:0.7rem;
}

@media (max-width:600px) {
	.dice-sections {
		height:40vh;
		overflow:auto;
	}
}