@import url('https://fonts.googleapis.com/css2?family=Inter:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Fira+Code&display=swap');

:root {
  --color-background: #1E2021;
  --color-text: #e3eaee;
  --color-primary: #aec5cd;
  --color-secondary: #594068;
  --color-accent: #6f9bb1;
  /* --color-mute: #846d57; */
}

html body {
  margin: 0;
  padding: 0;
  height: 100vh;
  width: 100vw;
}

.container {
  display: flex;
  flex-direction: column;

  height: 100%;
  margin:auto;

  background-color: var(--color-background);

  font-family: 'Inter', sans-serif;
  font-size: 3rem;
}

#greet {
  margin: auto auto 1rem auto;
  color: var(--color-primary);
}

#search, #search:active #search:focus{
  text-align: center;
  margin: 0 auto auto auto;
  height: 5vw;
  width: 80vw;
  
  background-color: var(--color-background);
  color: var(--color-primary);
  font-family: 'Inter', sans-serif;
  font-size: 3rem;

  border: none;
  outline: 0;
}

code {
  /* font-family: 'Courier New', Courier, monospace; */
  font-family: 'Fira Code', monospace;
  background-color: rgba(0, 0, 0, .25);
  padding: 0 .75rem;
  border-radius: .5rem;
  color: var(--color-accent);
}