#quickNavPanel {
  display: none;
}

#quickNavButton {
  display: none;
  position: fixed;
  height: 22pt;
  width: 22pt;
  margin-top: 25pt;
  margin-left: 15pt;
  z-index: 3;
  cursor: pointer;
}

#quickNavButton img {
  width: inherit;
  height: inherit;
}

@media (max-width: 580px) {

  #quickNavButton {
    display: block;
  }

  #quickNavPanel {
    /* Display & Position */
    display: none;
    position: fixed;
    /* Size Styles */
    height: 0pt;
    width: 100%;
    margin-top: 6.3em;
    /* Text Styles */
    line-height: 3em;
    text-align: center;
    /* General Styles */
    overflow-x: hidden;
    overflow-y: scroll;
    background-color: var(--dudzikArt-Color-One);
    transition: 0.5s;
  }

  #quickNavPanel ul {
    padding-left: 0pt;
    list-style-type: none;
  }

  #quickNavPanel ul li {
    width: 100%;
    border-top: 1pt black solid;
    background-color: var(--dudzikArt-Color-Three);
  }

  #quickNavPanel ul li a:link {
    display: block;
    color: white;
    text-decoration: none;
  }

  #quickNavPanel ul li a:visited {color: white;}

  #quickNavPanel ul li a:hover {color: gray;}

  #quickNavPanel ul li a:active {color: white;}

}