body,nav ul{margin:0;padding:0;display:flex}.container,body,nav ul{display:flex}#form-container,nav{box-shadow:0 2px 4px rgba(0,0,0,.1);background-color:#20232a}button,nav ul li a{font-weight:700}#form-container,#output{width:100%;max-width:500px}#output,.container,a.downloadButton,body,input[type=text]{box-sizing:border-box}#output,pre{word-wrap:break-word}footer,footer a,h1,nav ul li a,pre{color:#61dafb}a.downloadButton,footer a,nav ul li a{text-decoration:none}#form-container,#loading,footer,h1,section{text-align:center}#about,#form-container,input[type=text],nav,pre{background-color:#20232a}#about,.container,section{padding:20px}#about,#loading,#output,footer{margin-top:20px}body{font-family:Arial,sans-serif;background-color:#282c34;color:#fff;flex-direction:column;min-height:100vh}nav{width:100%;padding:10px 0}nav ul{list-style:none;justify-content:center}nav ul li{margin:0 15px}nav ul li a:hover{color:#21a1f1}.container{flex:1;justify-content:center;align-items:center;flex-direction:column}h1{font-size:2em;margin:20px 0}#form-container{padding:20px;border-radius:8px}input[type=text]{width:calc(100% - 20px);padding:10px;border:1px solid #61dafb;border-radius:4px;color:#61dafb;margin-bottom:10px}a.downloadButton,button{color:#20232a;padding:10px;width:calc(100% - 20px)}button{border:none;background-color:#61dafb;border-radius:4px;cursor:pointer;font-size:1em;margin-bottom:10px}a.downloadButton:hover,button:hover{background-color:#21a1f1}a.downloadButton{background-color:#61dafb;border-radius:4px;display:none;margin-top:10px}#loading{display:none;font-size:1.2em}#output{display:none}pre{padding:15px;border-radius:8px;border:1px solid #61dafb;overflow-x:auto;white-space:pre-wrap}footer{font-size:14px}footer a:hover{text-decoration:underline}#about{border-radius:8px}@media (min-width:600px){#form-container{display:flex;flex-direction:column;align-items:center}a.downloadButton,button,input[type=text]{width:calc(100% - 20px);margin-right:10px}button{width:auto}#loading{font-size:1em}}
