html, body {
  background-color: var(--grey-100);
  color: white;
  font-family: 'Aileron Light';

}

.font-bold {
  font-family: 'Aileron Bold';
}
.font-regular {
  font-family: 'Aileron Regular';
}
.font-thin {
  font-family: 'Aileron Thin';
}
.font-light {
  font-family: 'Aileron Light';
}
.font-italic {
  font-family: 'Aileron Italic';
}

.bg-sonic-blue {
  background-color: var(--blue-100);
}
.text-bg-sonic-blue {
  color: white;
  background-color: var(--blue-100);
}
.text-sonic-blue {
  color: var(--blue-100);
}

.text-left { text-align: left; }
.text-right { text-align: right; }
.text-center { text-align: center; }

.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
      -webkit-user-select: none; /* Safari */
       -khtml-user-select: none; /* Konqueror HTML */
         -moz-user-select: none; /* Old versions of Firefox */
          -ms-user-select: none; /* Internet Explorer/Edge */
              user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

.center {
  position: absolute;
  left: 50%;
  top: 50%;
  -moz-transform: translate(-50%, -50%); /* Firefox */
  -ms-transform: translate(-50%, -50%);  /* IE 9 */
  -webkit-transform: translate(-50%, -50%); /* Safari and Chrome*/
  -o-transform: translate(-50%, -50%); /* Opera */
  transform: translate(-50%, -50%);

  /* optional size in px or %: */
  //width: 100px;
  //height: 100px;
}


#weather-info {

}
.text-big {
  font-size: 36px;
  line-height: 36px;
}


a {
  text-decoration: none;
  font-weight: bold;
  color: var(--yellow-100);
}
a:hover, a:focus, a:active {

  color: var(--orange-100);
}