@import url(https://fonts.googleapis.com/css?family=Roboto);
.word{padding:.5rem;display:inline-block;font-size:1.5rem;border-radius:5px}.word.current{background:#f1f1f1}.word.error{background:#ff9999;color:#ff1a1a}.wrong{color:#ff1a1a}.correct{color:#10d410}input{font-size:1.5rem;border:none;padding:.5rem;flex-grow:1}@media (max-width: 489px){input{width:100%}}.words{position:relative}.words-wrapper{padding:1rem;background:white;max-width:800px}.words-container{background:white;display:inline-block;border-radius:5px;height:6rem;overflow:hidden}.toolbar{padding:1rem;background:#eee;display:flex;flex-wrap:wrap}.toolbar .toolbar-actions{display:flex}@media (max-width: 489px){.toolbar .toolbar-actions{margin-top:.5rem;width:100%;justify-content:flex-end}}

.time{background:#000000;color:white;margin:0 .5rem;display:flex;align-items:center}.p-1{padding:.5rem}

.result-box{background:#e2e2e2}.box{text-align:center;background-color:white;margin-right:.5rem;margin-left:.5rem;min-width:119px;margin-top:.5rem;margin-bottom:.5rem;color:#1d1d1d}.box.wpm{background:#f7f7f7}@media (max-width: 489px){.box:nth-child(1){width:100%}.box:not(:first-child){flex:1}}@media (min-width: 489px){.box{flex:1}}

*,*:before,*:after{box-sizing:inherit}body{box-sizing:border-box;font-family:'Roboto', sans-serif;background:#d8d8d8}.typing{margin-top:150px}@media (max-width: 489px){.typing{margin-top:50px}}