/* declaring CSS variables */
:root {
  --base-color: #bada55;
  --spacing: 0px;
  --blur: 0px;
}
/*  applying the variables to img */
img {
  padding: var(--spacing);
  background: var(--base-color);
  filter: blur(var(--blur));
}

.hl {
  color: var(--base-color);
}
/*
      misc styles, nothing to do with CSS variables
    */

body {
  text-align: center;
  background: #4291c9;
  color: white;
  font: 80 30px helvetica ;
}

.controls {
  margin-bottom: 20px;
}

input {
  width: 100px;
}
img {
  border-radius: 2%;
  height:60vh;
}