index.css

*{font-family:"Muli", sans-serif;color:grey}input{padding:5px;font-size:larger;border:3px solid gray;-webkit-transition:.5s;transition:.5s;border-radius:5px;width:130px}input:hover,input:focus{border:3px solid #49cc68}small{display:block}.card{padding:5px;text-align:center;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.card img{width:40px;display:block;margin:auto;border:2px solid white;border-radius:50%}.card h3{margin:5px;display:inline-block}.card:hover{border-radius:5px;background-color:#49cc68}.card:hover h3{color:white}.container{display:-ms-grid;display:grid;grid-template-areas:"header" "intro" "results" "footer"}.header,.footer,.intro{text-align:center}.header{padding:5px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-bottom:20px;display:-ms-grid;display:grid;-ms-grid-columns:20% auto 20%;grid-template-columns:20% auto 20%;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;gap:5px;-ms-grid-row:1;-ms-grid-column:1;grid-area:header}@media screen and (max-width: 750px){.header{-ms-grid-columns:1fr;grid-template-columns:1fr;grid-template-areas:"logo" "links" "login"}.header .links{-ms-grid-row:2;-ms-grid-column:1;grid-area:links}.header .links a{display:block;text-decoration:none}.header .logo{-ms-grid-row:1;-ms-grid-column:1;grid-area:logo;width:40%;margin:auto}.header .login{-ms-grid-row:3;-ms-grid-column:1;grid-area:login}.header .login button{width:40%;margin:auto}}.logo{width:100%;height:auto}.links a{text-decoration:none;padding:5px}a{text-decoration:none;padding:5px}a:hover{color:#464545;text-decoration:underline}.footer{margin-top:20px;-ms-grid-row:4;-ms-grid-column:1;grid-area:footer;display:-ms-grid;display:grid;gap:5px;-ms-grid-columns:(1fr)[6];grid-template-columns:repeat(6, 1fr);text-align:left}.footer p{color:#464545;margin-left:2%}.footer a{display:block}.footer .footer-logo{text-align:center;margin-top:6%}.footer .footer-logo img{width:40%}.footer .apps img{-webkit-filter:grayscale(100%);filter:grayscale(100%);width:15%;margin:5px;-webkit-transition:.5s;transition:.5s;cursor:pointer}.footer .apps img:hover{-webkit-transform:scale(1.3);transform:scale(1.3)}.intro{-ms-grid-row:2;-ms-grid-column:1;grid-area:intro}.intro h1{color:black}button{cursor:pointer;padding:15px 32px;text-align:center;background-color:#49cc68;color:white;font-size:16px;border:none;border-radius:20px;font-weight:bold;border:2px solid #49cc68;-webkit-transition:.5s;transition:.5s}button:disabled{cursor:not-allowed;background-color:gainsboro;border:2px solid gainsboro}button:disabled:hover{background-color:gainsboro;border:2px solid gainsboro;color:white}button:hover{background-color:white;color:#49cc68}select{width:auto;padding:5px;margin:5px;padding:15px 32px;font-size:16px;border:2px solid #49cc68}.results{-ms-grid-row:3;-ms-grid-column:1;grid-area:results;justify-items:left;display:-ms-grid;display:grid;gap:5px;margin:20px;-ms-grid-columns:(minmax(100px, 1fr))[auto-fit];grid-template-columns:repeat(auto-fit, minmax(100px, 1fr))}.top{display:none;position:fixed;bottom:20px;right:30px;z-index:99;background-color:#49cc68;opacity:0.5;border-radius:50%;cursor:pointer;padding:15px;border:none;text-align:center}.top:hover{opacity:1;background-color:#49cc68}