#page{ height: 600px; }
#wrapper{ width: 842px; position: absolute; display: inline-block; margin-left: 50%; transform: translate(-50%, 0); }

/* dark mode */
html.dark .sumRess,
html.dark #time{ background: #413d3d; color: #fff; }

#mainSetup{ margin-bottom: 25px; }
#speedtext{ font-weight: bold; font-size: 16px; }
#setup{ position: relative; width: 800px; margin-top: 25px; }
#setup > div:after{ content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }

#setup > div:nth-child(2), #setup > div:nth-child(3){ font-weight: bold; text-align: center; }
#setup > div:nth-child(3) > div:first-child{ width: 75px; margin-right: 25px; }
#setup > div:nth-child(3) > div:NOT(:nth-child(3)){ line-height: 72px; height: 50px; }

#setup > div:NOT(#mainSetup) > div{ display: inline-block; width: 100px; float: left; }
#setup > div > div:NOT(:first-child){ text-align: center; }

#typeSelector{ position: absolute; top: 5px; left: 600px; width: 82px; height: 34px; display: inline-block; border: 1px solid #ccc; text-align: center; padding: 0 !important; border-radius: 4px; }
#typeSelector label{ height: 32px; line-height: 32px; width: 40px; display: inline-block; float: left; margin: 0 !important; vertical-align: unset !important; cursor: pointer; -webkit-transition: all 1s; -o-transition: all 1s; transition: all 1s; }
#typeSelector input:checked + label{ font-weight: bold; background: #2a3f23; color: #fff; cursor: default; }
#typeSelector input.first:checked + label{ border-radius: 4px 0 0 4px; }
#typeSelector input.last:checked + label{ border-radius: 0 4px 4px 0; }

#time, .sumRess{ background: #e2e2e2; padding: 10px 15px; padding-right: 0; border-radius: 4px; }
.sumRess{ border-top: 1px solid #ccc; }
.sumRess > div:first-child{ width: 85px !important; text-align: right; font-weight: bold; }
#time{ width: 800px; margin-top: 25px; }
#time > div > span{ font-weight: bold; padding: 0 20px; }