@import url("https://fonts.googleapis.com/css2?family=Happy+Monkey&family=Russo+One&family=Ubuntu:ital,wght@0,400;0,700;1,300&display=swap"); * { -webkit-box-sizing: border-box; box-sizing: border-box; } html { font-size: 16px; } body { background-color: #1C2537; margin: 0; padding: 0; } header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100vw; margin: 2.5rem 0 2.5rem 0; } h1 { text-align: center; padding: 0; margin: 0; width: auto; color: whitesmoke; font-size: 3.0rem; font-family: 'Russo One', sans-serif; } h2 { text-align: center; padding: 0; margin: 0; color: #ff28e2; font-size: 2rem; font-family: 'Ubuntu', sans-serif; } h3 { padding: 0 0 0.2rem 0; margin: 0; color: whitesmoke; font-size: 1rem; font-family: 'Ubuntu', sans-serif; text-align: center; } main { width: 95vw; display: -webkit-box; display: -ms-flexbox; display: flex; margin: auto; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .containerBox { margin-bottom: 1.8rem; padding: 0.8rem 0.5rem; border-radius: 0.5rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; background-color: #323a4b; border: #2f343b solid 0.12rem; -webkit-box-shadow: black 0 0.3rem 0.4rem; box-shadow: black 0 0.3rem 0.4rem; } .field-con { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; margin-top: 0.6rem; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .lookupType { background: #131a26; color: whitesmoke; width: 100%; font-weight: normal; padding: 0.5rem 0.4rem; border-radius: 0.4rem 0.4rem 0 0; font-family: 'Ubuntu', sans-serif; text-align: center; border-bottom: 2px #323a4b solid; } .lookupResult { background: #131a26; color: whitesmoke; width: 100%; font-weight: normal; padding: 0.5rem 0.1rem; border-radius: 0 0 0.4rem 0.4rem; font-family: 'Ubuntu', sans-serif; text-align: center; } footer { position: absolute; bottom: 10px; right: 10px; text-align: center; color: #838383; font-size: 0.8rem; font-family: 'Happy Monkey', cursive; font-weight: 300; } @media only screen and (min-width: 800px) { main { width: 60vw; } } @media only screen and (min-width: 1000px) { header { margin: 2rem 0 4rem 0; } main { width: 80vw; display: -ms-grid; display: grid; -ms-grid-columns: 65% auto; grid-template-columns: 65% auto; grid-gap: 1rem; } #network { -ms-grid-column: 1; grid-column: 1; } #display { -ms-grid-column: 2; grid-column: 2; } .lookupType { width: 100%; padding: 0.5rem 0.4rem; } .lookupResult { width: 100%; padding: 0.5rem 0.1rem; } .lookupTypeExt { width: 100%; } } @media only screen and (min-width: 1650px) { main { width: 800px; } .lookupTypeExt { width: 100%; } } /*# sourceMappingURL=styles.css.map */