@media only screen and (max-width: 700px) {

#skip-to-content-link {
  position: fixed;
  top: 0;
  left: 0;
  display: inline-block;
  padding: 0.375rem 0.75rem;
  line-height: 1;
  font-size: 1.25rem;
  background-color: var(--content-background-color);
  color: var(--text-color);
  transform: translateY(-3rem);
  transition: transform 0.1s ease-in;
  z-index: 99999999999;
}

#skip-to-content-link:focus,
#skip-to-content-link:focus-within {
  transform: translateY(0);
}


.topnav {
  overflow: hidden;
  background-color: var(--c-bg);
  position: relative;
  border-bottom: var(--b-bord);
  margin-bottom: 1em;
}

.topnav #myLinks {
  display: none;
}

.topnav a {
  color: var(--bc);
  background-color: var(--text);
  padding: 10px 10px;
  text-decoration: none;
  font-size: 17px;
  display: block;
}

.topnav a.icon {
  background: (--c-bg);
  display: block;
  position: absolute;
  right: 0;
  top: 0;
}

.topnav a:hover {
  background-color: var(--bc);
  color: var(--link);
}

.active {
  background-color: var(--b-bg);
  color: var(--link);
}

.active::before {
  content: var(--m-img);
  padding-right: 1em;
  margin: 0;
}

.icon {
  height: 25px;
}
nav { display: none; }

body {
    background-size: cover;
    background-color: var(--b-bg);
    background-image: var(--b-bg-img);
    color: var(--text);
    width: auto;
    height: 90vh;
    margin: auto;
    font-family: Verdana, sans-serif;
}

section {
  display: block;
}
}