* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  user-select: none;
}

body {
  overflow-x: hidden;
  font-family: courier-prime,monospace;
  font-weight: 700;
  font-style: normal;
}

::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-track {
  background: white;
}

::-webkit-scrollbar-thumb {
  background-color: #398AB9;
}

::-webkit-scrollbar-thumb:hover {
  background-color: #1d1d1d;
}

::-webkit-scrollbar-button {
  display: none;
}

#nav {
  background-color: #FFFFFF;
  text-align: center;
  position: sticky;
  top: 0;
  height: 8vmax;
  z-index: 10;
}

.nav_burger {
  position: absolute;
  top: 2vmax;
  left: 5vmax;
  z-index: 10;
}

.nav_burger:hover {
  cursor: pointer;
}

._nav_burger-div {
  width: 3vmax;
  height: 0.5vmax;
  background-color: #1d1d1d;
  margin: 0.5vmax 0 0.5vmax 0;
  transition: all 0.5s;
}

._nav_burger-div:hover {
  width: 3.5vmax;
  margin: 0.5vmax 0 0.5vmax 0.5vmax;
}

.no-burger-hover:hover {
  margin: 0.5vmax 0 0.5vmax 0;
  width: 3vmax;
}

.nav_logo {
  display: inline-block;
  font-size: 3vmax;
  color: #1d1d1d;
  text-decoration: none;
  margin: 1.75vmax 0 0 0;
  transition: 0.5s;
}

.nav_logo:hover {
  letter-spacing: 1px;
}

.nav_menu {
  background-color: #398AB9;
  width: 30vw;
  height: 100vh;
  position: absolute;
  top: 0;
  left: 0;
  display: none;
}

._nav_ul {
  position: absolute;
  top: 50vh;
  left: 50%;
  transform: translate(-50%, -50%);
  transition: all 0.5s;
  list-style: none;
}

._nav_li {
  color: white;
  font-size: 2vmax;
  width: 30vw;
  margin: 1vmax 0 1vmax 0;
  display: block;
}

._nav_a {
  letter-spacing: 1px;
  display: inline-block;
  font-size: 2vmax;
  margin: 0.5vmax 1vw s0.5vmax 1vw;
  cursor: pointer;
  transition: all 0.5s;
  color: white;
  text-decoration: none;
}

._nav_a:hover {
  letter-spacing: 2px;
}

.nav_cart {
  display: none;
}

/* Main */

#main {
  margin: 5vh 0 0 5vw;
  width: 90vw;
}

.main_description {
  width: 100vw;
}

._main_desciption {
  font-size: 2vmax;
  text-align: center;
}

.main_buttons-display {
  margin: 10vh 0 0 0;
  text-align: center;
}

._main_button-display {
  width: 18vw;
  height: 15vh;
  display: inline-block;
}

._main_button {
  font-size: 1vmax;
}

/* Buttons */

#button_0 {
  color: #FFFFFF; /* Text Color */
  background-color: #398AB9; /* Background Color */
  width: 5vmax; /* Button Width */
  transition: 0.5s; /* Hover Transition Time */
  border: .2vmax solid #398AB9; /* Border Width & Color */
  padding: 1vmax 3vmax; /* Padding */
  text-decoration: none; /* Text Decoration */
  border-radius: 101vmax; /* Border Roundness */
}

#button_0:hover {
  color: #398AB9; /* Text Color */
  background-color: #FFFFFF; /* Background Color */
  border: .2vmax solid #398AB9; /* Border Width & Color */
}

#button_1 {
  color: #398AB9; /* Text Color */
  background-color: #FFFFFF; /* Background Color */
  width: 5vmax; /* Button Width */
  transition: 0.5s; /* Hover Transition Time */
  border: .2vmax solid #398AB9; /* Border Width & Color */
  padding: 1vmax 3vmax; /* Padding */
  text-decoration: none; /* Text Decoration */
  border-radius: 101vmax; /* Border Roundness */
}

#button_1:hover {
  color: #FFFFFF; /* Text Color */
  background-color: #398AB9; /* Background Color */
}

#button_2 {
  color: #398AB9; /* Text Color */
  background-color: #FFFFFF; /* Background Color */
  width: 5vmax; /* Button Width */
  transition: 0.5s; /* Hover Transition Time */
  border: .2vmax solid #398AB9; /* Border Width & Color */
  padding: 1vmax 3vmax; /* Padding */
  text-decoration: none; /* Text Decoration */
  border-radius: 0.5vmax; /* Border Roundness */
}

#button_2:hover {
  padding: 1vmax 4vmax; /* Padding */
}

#button_3 {
  color: #FFFFFF; /* Text Color */
  background-color: #398AB9; /* Background Color */
  width: 5vmax; /* Button Width */
  transition: 0.5s; /* Hover Transition Time */
  border: .2vmax solid #398AB9; /* Border Width & Color */
  padding: 1vmax 3vmax; /* Padding */
  text-decoration: none; /* Text Decoration */
  border-radius: 0.5vmax; /* Border Roundness */
}

#button_3:hover {
  border-radius: 1vmax; /* Border Roundness */
}

#button_4 {
  color: #398AB9; /* Text Color */
  background-color: #FFFFFF; /* Background Color */
  width: 5vmax; /* Button Width */
  transition: 0.5s; /* Hover Transition Time */
  border: .2vmax solid #398AB9; /* Border Width & Color */
  padding: 1vmax 3vmax; /* Padding */
  text-decoration: none; /* Text Decoration */
  box-shadow: 0.3vmax 0.3vmax 0.3vmax 0.1vmax #9f9f9f; /* Button Shadow */
  border-radius: 0.5vmax; /* Border Roundness */
}

#button_4:hover {
  box-shadow: 0px 0px 0.3vmax 0.1vmax #9f9f9f; /* Button Shadow */
}

#button_5 {
  color: #398AB9; /* Text Color */
  background-color: #FFFFFF; /* Background Color */
  width: 12vmax; /* Button Width */
  transition: 0.5s; /* Hover Transition Time */
  border: .2vmax solid #398AB9; /* Border Width & Color */
  padding: 1vmax 3vmax; /* Padding */
  text-decoration: none; /* Text Decoration */
  border-radius: 0.2vmax; /* Border Roundness */
  display: inline-block; /* Set Display Mode */
  -ms-transform: skewX(-20deg); /* Set Skew */
  -webkit-transform: skewX(-20deg); /* Set Skew */
  transform: skewX(-20deg); /* Set Skew */
}

#button_5:hover {
  -ms-transform: skewX(-25deg); /* Set Skew */
  -webkit-transform: skewX(-25deg); /* Set Skew */
  transform: skewX(-25deg); /* Set Skew */
}

#button_6 {
  color: #FFFFFF; /* Text Color */
  background-color: #398AB9; /* Background Color */
  width: 5vmax; /* Button Width */
  transition: 0.5s; /* Hover Transition Time */
  border: .2vmax solid #398AB9; /* Border Width & Color */
  padding: 1vmax 3vmax; /* Padding */
  text-decoration: none; /* Text Decoration */
  border-radius: 0.5vmax; /* Border Roundness */
  box-shadow: 0px 0.6vmax 0px 0px #3c3c3c; /* Button Shadow */
}

#button_6:hover {
  box-shadow: 0px 0.3vmax 0px 0px #3c3c3c; /* Button Shadow */
}

#button_7 {
  color: #FFFFFF; /* Text Color */
  background-color: #398AB9; /* Background Color */
  width: 5vmax; /* Button Width */
  transition: 0.5s; /* Hover Transition Time */
  border: .2vmax solid #398AB9; /* Border Width & Color */
  padding: 1vmax 3vmax; /* Padding */
  text-decoration: none; /* Text Decoration */
  border-radius: 101vmax; /* Border Roundness */
}

#button_7:hover {
  padding: 1.25vmax 4vmax; /* Padding */
}

#button_8 {
  color: #398AB9; /* Text Color */
  background-color: #FFFFFF; /* Background Color */
  width: 5vmax; /* Button Width */
  transition: 0.5s; /* Hover Transition Time */
  padding: 1vmax 3vmax; /* Padding */
  text-decoration: none; /* Text Decoration */
  box-shadow: 0px 0px 10px 2px #9f9f9f; /* Button Shadow */
  border-radius: 0.5vmax; /* Border Roundness */
}

#button_8:hover {
  box-shadow: 0px 0px 0px 0px #9f9f9f; /* Button Shadow */
}

#button_9 {
  color: #398AB9; /* Text Color */
  background-color: #FFFFFF; /* Background Color */
  width: 5vmax; /* Button Width */
  transition: 0.5s; /* Hover Transition Time */
  padding: 1vmax 3vmax; /* Padding */
  text-decoration: none; /* Text Decoration */
}

#button_9:hover {
  text-decoration: line-through; /* Text Decoration */
  text-decoration-thickness: 0.3vmax; /* Text Decoration Line Thickness */
}

#button_10 {
  color: #FFFFFF; /* Text Color */
  background: linear-gradient(0.25turn, #398AB9, #FFFFFF); /* Background Gradient */
  width: 5vmax; /* Button Width */
  transition: 0.5s; /* Hover Transition Time */
  padding: 1vmax 3vmax; /* Padding */
  text-decoration: none; /* Text Decoration */
  border-radius: 101vmax; /* Border Roundness */
}

#button_10:hover {
  background: linear-gradient(0.5turn, #398AB9, #FFFFFF); /* Background Gradient */
}

#button_11 {
  color: #398AB9; /* Text Color */
  background-color: #FFFFFF; /* Background Color */
  width: 5vmax; /* Button Width */
  transition: 0.5s; /* Hover Transition Time */
  border: .2vmax solid #398AB9; /* Border Width & Color */
  padding: 1vmax 3vmax; /* Padding */
  text-decoration: none; /* Text Decoration */
  border-radius: 0.5vmax; /* Border Roundness */
  box-shadow: 0px 0.3vmax 0px 0px #398AB9,  0.3vmax 0.8vmax 0px 0px #3f3f3f; /* Button Shadows */
}

#button_11:hover {
  box-shadow: 0px 0.3vmax 0px 0px #398AB9,  0px 0px 0px 0px #3f3f3f; /* Button Shadows */
}

#button_12 {
  color: #398AB9; /* Text Color */
  background-color: #FFFFFF; /* Background Color */
  width: 5vmax; /* Button Width */
  transition: 0.5s; /* Hover Transition Time */
  border: .2vmax solid #398AB9; /* Border Width & Color */
  padding: 1vmax 3vmax; /* Padding */
  text-decoration: none; /* Text Decoration */
  border-radius: 0.5vmax; /* Border Roundness */
  box-shadow: 0px 0.6vmax 0px 0px #398AB9; /* Button Shadow */
}

#button_12:hover {
  box-shadow: 0px 0.8vmax 0px 0px #398AB9; /* Button Shadow */
}

#button_13 {
  color: #FFFFFF; /* Text Color */
  background-color: #398AB9; /* Background Color */
  width: 5vmax; /* Button Width */
  transition: 0.5s; /* Hover Transition Time */
  border: .2vmax solid #398AB9; /* Border Width & Color */
  padding: 1vmax 3vmax; /* Padding */
  text-decoration: none; /* Text Decoration */
  border-radius: 101%; /* Border Roundness */
}

#button_13:hover {
  color: #398AB9; /* Text Color */
  background-color: #FFFFFF; /* Background Color */
  border: .2vmax solid #398AB9; /* Border Width & Color */
}

#button_14 {
  color: #398AB9; /* Text Color */
  background-color: #FFFFFF; /* Background Color */
  width: 5vmax; /* Button Width */
  transition: 0.5s; /* Hover Transition Time */
  border: .2vmax solid #398AB9; /* Border Width & Color */
  padding: 1vmax 3vmax; /* Padding */
  text-decoration: none; /* Text Decoration */
  border-radius: 0.5vmax; /* Border Roundness */
}

#button_14:hover {
  border: .4vmax solid #398AB9; /* Border Width & Color */
}

/* Button Focus */

.main_button-focus-wrapper {
  text-align: center;
  width: 70vw;
  background-color: #FFFFFF;
  position: absolute;
  top: 15vmax;
  left: 50vw;
  transform: translate(-50%, 0%);
  display: none;
  z-index: 5;
  border: 0.3vmax solid #1d1d1d;
}

._main_focus-button-css {
  font-size: 1.5vmax;
  text-align: left;
  margin: 4vmax 4vmax 2vmax;
  user-select: all;
  word-wrap: normal;
  overflow-x: auto;
  white-space: pre-wrap;
  white-space: -moz-pre-wrap;
  white-space: -pre-wrap;
  white-space: -o-pre-wrap;
  word-wrap: break-word;
}

._main_focus-button-close {
  letter-spacing: 1px;
  display: inline-block;
  font-size: 2vmax;
  margin: 0.5vmax 1vw 0.5vmax 1vw;
  cursor: pointer;
  transition: all 0.5s;
  color: #1d1d1d;
  text-decoration: none;
}

/* About */

._main_about-text {
  font-size: 2vmax;
  margin: 1vmax 0;
}

/* Contact */

._main_contact-text {
  font-size: 2vmax;
  margin: 1vmax 0;
}

._main_contact-text-email {
  color: #398AB9;
}