kore-jsonrtc/html/style.css

.container {
	height: 100vh;
	display: grid;
	grid-template-rows: 1fr 1fr 1fr;
	grid-template-columns: 1fr 1fr 1fr;
	grid-template-areas:
	"header1 header2 header3"
	"mid1 mid2 mid3"
	"footer1 footer2 footer3";
	font-family: sans-serif;
}

#deviceheader {
	grid-area: header2;
	text-align: center;
	line-height: 200px;
	font-size: 10vh;
	font-family: sans-serif;
}

#time {
	grid-area: mid2;
}

#rtc-headline {
	text-align: left;
	font-size: 4vh;
}

#rtc {
	text-align: center;
	font-size: 5vh;
}

#local-headline {
        text-align: left;
        font-size: 4vh;
}

#local {
	text-align: center;
	font-size: 5vh;
}
#alarm {
	grid-area: mid3;
	text-align: center;
	font-size: 4vh;
	visibility: hidden;
}

#alarm-time {
	font-size: 5vh;
}

#alarm-button {
	text-align: left;
}

#nvram {
	grid-area: footer3;
	visibility:hidden;
}

#nvram-text {
	width:30vw;
	height:15vh;
}

#buttons {
	grid-area: footer2;
}

@media screen and (max-width: 600px) {
	.container {
        height: 100vh;
        display: grid;
        grid-template-rows: 1fr 1fr 1fr 1fr 1fr;
        grid-template-columns: 1fr;
        grid-template-areas:
        "header2"
        "mid2"
	"mid3"
        "footer2"
	"footer3";
        font-family: sans-serif;
}