.header .mobile-sidebar_button-open-bounce {
  display: flex;
  position: relative;
  margin-left: 20px;
  width: 60px;
  height: 60px;
  z-index: 3;
  align-items: center;
  justify-content: center;
}
.header .mobile-sidebar_button-open-bounce .mobile-sidebar_button-open {
  display: flex;
  width: 60px;
  height: 60px;
  border-radius: 50px;
  transition-duration: .2s;
  transition-timing-function: ease-out;
  cursor: pointer;
  align-items: center;
  justify-content: center;
}
.header .mobile-sidebar_button-open-bounce:hover .mobile-sidebar_button-open:hover {
  background-color: var(--interact-hover);
}
.header .mobile-sidebar_button-open-bounce:active .mobile-sidebar_button-open:active {
  background-color: var(--interact-active);
  transform: scale(.8);
}
.header .mobile-sidebar_button-open-bounce .mobile-sidebar_button-open .menu {
  display: flex;
  width: 20px;
  height: 20px;
  align-items: center;
  justify-content: center;
}
.header .mobile-sidebar_button-open-bounce .mobile-sidebar_button-open .menu img {
  width: 20px;
  height: 20px;
}






.desktop-sidebar {
  margin-top: 10px;
}



.desktop-sidebar-area {
  width: 570px;
  display: flex;
  overflow-x: scroll;
}
.desktop-sidebar-area a:first-child {
  margin-left: 10px;
}
.desktop-sidebar-area a h2 {
  width: max-content;
  border-radius: 30px;
  padding: 10px 30px 10px 30px;
  margin-left: -10px;
  margin-right: -10px;
  transition-duration: .2s;
}
.desktop-sidebar-area a h2:hover {
  background-color: var(--interact-hover);
}
.desktop-sidebar-area a h2:active {
  background-color: var(--interact-active);
}






.mobile-sidebar {
  height: 100%;
  width: 250px;
  position: fixed;
  z-index: 4;
  top: 0;
  left: -255px;
  background-color: var(--header);
  overflow: auto;
  padding-top: 60px;
  transition-duration: .3s;
  transition-timing-function: ease;
}
.mobile-sidebar .mobile-sidebar-area .mobile-sidebar_button-close-bounce {
  display: flex;
  position: relative;
  width: 70px;
  height: 70px;
  margin-top: -46px;
  margin-left: 20px;
  z-index: 3;
  align-items: center;
  justify-content: center;
}
.mobile-sidebar .mobile-sidebar-area .mobile-sidebar_button-close-bounce .mobile-sidebar_button-close {
  display: flex;
  width: 60px;
  height: 60px;
  border-radius: 50px;
  cursor: pointer;
  transition-duration: .2s;
  transition-timing-function: ease-out;
  align-items: center;
  justify-content: center;
}
.mobile-sidebar .mobile-sidebar-area .mobile-sidebar_button-close-bounce .mobile-sidebar_button-close:hover {
  background-color: var(--interact-hover);
}
.mobile-sidebar .mobile-sidebar-area .mobile-sidebar_button-close-bounce .mobile-sidebar_button-close:active {
  background-color: var(--interact-active);
  transform: scale(.8);
}
.mobile-sidebar .mobile-sidebar-area .mobile-sidebar_button-close-bounce .mobile-sidebar_button-close .close {
  display: flex;
  width: 20px;
  height: 20px;
  align-items: center;
  justify-content: center;
}
.mobile-sidebar .mobile-sidebar-area .mobile-sidebar_button-close-bounce .mobile-sidebar_button-close .close img {
  width: 20px;
  height: 20px;
}
.mobile-sidebar .mobile-sidebar-area a {
  display: block;
  width: 238px;
  border-radius: 0px 50px 50px 0px;
  padding: 20px 20px 20px 40px;
  font-size: 20px;
  text-decoration: none;
  transition-duration: .2s;
}
.mobile-sidebar .mobile-sidebar-area a:hover {
  background-color: var(--interact-hover);
}
.mobile-sidebar .mobile-sidebar-area a:active {
  background-color: var(--interact-active);
}






@media only screen and (max-width: 799px) {
  .desktop-sidebar-area {
    display: none;
  }
}






@media only screen and (min-width: 800px) {
  .header .mobile-sidebar_button-open-bounce .mobile-sidebar_button-open {
    display: none;
  }
  




  
  .mobile-sidebar {
    display: none;
  }
}






@media only screen and (min-width: 1000px) {
  .desktop-sidebar {
    width: 75%;
  }



  .desktop-sidebar-area {
    margin-left: 10px;
    width: 100%;
  }
  
  
  
  .desktop-sidebar-area a {
    margin-left: 20px;
  }
}






@media only screen and (min-width: 1336px) {
  .desktop-sidebar-area {
    width: 940px;
  }
}