:root {
  --clr-blue: #1022BB;
  --clr-green: #10BB22;
}

body {
  font-size: 2.5vh;
}


a {
  margin:  0 0 0 0;
  padding:  0 0 0 0;
}

a {
  color: var(--clr-blue);
  text-decoration: underline;
  text-decoration-thickness: .07em;
  text-underline-offset: 0.2em;
}

a:hover {
  color: var(--clr-green);
  text-decoration-thickness: .14em;
}

a:visited {

}


ul {
  padding: 0 0 0 0;
  margin:  0 0 0 0;
  list-style: none;
  display: flex;
  flex-direction: column;
}
ul li::before {
  content: '';
  display: inline-block;
  vertical-align: middle;
  margin: -0.3vmin 0.5vmin 0 0;
  width: 0.6vmin;
  height: 0.6vmin;
  border-radius: 50%;
  background-color: currentColor;
}

.large_li li {
  margin-bottom: 2vh;
  font-size: 3vh;
}

.button {
  box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, 0.2);
  border-radius: 3px;
  font-size: 2.5vh;
  padding: 1vh 1vw 1vh 1vw;
  text-align: center;

  /*
    Prevent text selection
    https://stackoverflow.com/questions/826782/how-to-disable-text-selection-highlighting
  */
  -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 */
}

.button:hover {
  cursor: pointer;
  box-shadow: 0px 0px 6px 3px rgba(0, 0, 0, 0.3);
}

.button:active {
  box-shadow: inset 0px 0px 4px 2px rgba(0, 0, 0, 0.2);
}

.f-row {
  display: flex;
  flex-direction: row;
  margin: 0px;
}

.f-col {
  display: flex;
  flex-direction: column;
  margin: 0px;
}

.f-j-center {
  justify-content: center;
}

.f-j-space-between {
  justify-content: space-between;
}
