section.tools {
  display: none;
  right: 1rem;
}
@media only screen and (min-width: 1024px) {
  section.tools {
    display: block;
  }
}
section.tools .tools__shortcuts,
section.tools .tools__bottom {
  position: absolute;
  top: 50vh;
  right: 0;
  width: 1.7rem;
  border-radius: 6px;
  background-color: #5A9130;
}
section.tools .tools__shortcuts ul,
section.tools .tools__bottom ul {
  padding-bottom: 0;
}
section.tools .tools__bottom {
  top: 88vh;
  border-radius: 6px;
}
section.tools .tools__bottom ul {
  display: flex;
  align-items: center;
  justify-content: center;
}
section.tools ul {
  padding: 0;
  margin: 0;
  list-style: none;
}
section.tools ul li {
  display: flex;
  justify-content: center;
}
section.tools ul li a {
  cursor: pointer;
  display: flex;
  padding: 3px;
  pointer-events: auto;
  color: white;
}
/*
 * Icon burger
 */
.burger,
.burger-container {
  user-select: none;
  /* supported by Chrome and Opera */
  -webkit-user-select: none;
  /* Safari */
  -khtml-user-select: none;
  /* Konqueror HTML */
  -moz-user-select: none;
  /* Firefox */
  -ms-user-select: none;
  /* Internet Explorer/Edge */
}
.burger {
  width: 17px;
  margin: auto;
  padding-top: 13px;
  padding-bottom: 8px;
  cursor: pointer;
}
.burger-container {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.burger-border {
  border-top: 2.5px solid white;
  width: 100%;
  transition: all 0.3s;
}
.burger-container .thickness {
  height: 8px;
  width: 100%;
}
.burger-container:hover .burger-border.bottom {
  transform: translateY(-2px);
}
.burger-container:hover .burger-border.top {
  transform: translateY(2px);
}
