body { font-family: Helvetica, sans-serif; font-weight: 300; font-size: 13px; transition: background-color 100ms; background-color: #f8fdff; } div { display: inline-block; } h2 { margin: 10px 0; } h3 { font-weight: 300; margin-top: 20px; } #dataset_name { text-transform: capitalize; } .desktop body { user-select: none; } .top { display: block; margin-top: 10px; margin-bottom: 10px; } .tools { position: fixed; top: 50%; left: 50%; transform: translate3d(-50%, -50%, 0); width: 600px; display: flex; flex-direction: column; justify-content: space-between; } .corner { position: absolute; bottom: 0; margin: 10px; padding: 10px; background: white; display: flex; } .corner.left { left: 0; } .corner.right { right: 0; } body { transition: 0.1s; } .loading { opacity: 0; } .row { display: flex; flex-direction: row; align-items: flex-end; } .block { display: flex; flex-direction: column; align-items: center; margin-right: 10px; } .block > span { display: block; margin-top: 10px; } .radio { display: flex; flex-direction: row; align-items: center; margin-top: 20px; margin-bottom: 20px; } .radio > span { margin-left: 10px; } .buttons { margin: 0 0 10px 0; } label { display: flex; flex-direction: row; margin-bottom: 10px; } label > span { display: block; min-width: 80px; } #recording_msg { display: none; } .recording #recording_msg { display: inline; } #cases { margin-top: 10px; height: 60px; }