body {
  margin: 0;
}

/*canvas*/

#welcome{
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  font-size:300%;

  transform: translate(-50%, -50%);
}
#canvas1{
  width:100%;
  position:absolute;
  height:100%;
}

/*https://www.w3schools.com/css/css_navbar_horizontal.asp*/
ul.topnav {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: rgb(237, 75, 105);
  position: -webkit-sticky;
  /* Safari */
  position: sticky;
  top: 0;
}

ul.topnav li {
  float: left;
}


ul.topnav li a,
ul.topnav #darkMode {
  display: block;
  color: white;
  text-align: center;
  padding: 14px 25px;
  text-decoration: none;
  font: Andale Mono;
  font-size: 150%;
}

ul.topnav li a:hover:not(.active),
ul.topnav #darkMode:hover:not(.active) {
  background-color: rgb(212, 41, 73);
  cursor: pointer;
}

ul.topnav li a.active,
ul.topnav #darkMode.active {
  background-color: rgb(236, 114, 136);
}

ul.topnav li.right {
  float: right;
}

@media screen and (max-width: 900px) {
  ul.sidenav {
    width: 100%;
    height: auto;
    position: relative;
  }

  ul.sidenav li a {
    float: left;
    padding: 15px;
  }

  div.content {
    margin-left: 0;
  }
}

@media screen and (max-width: 400px) {
  ul.sidenav li a {
    text-align: center;
    float: none;
  }
}



/*https://www.w3schools.com/css/css_navbar_horizontal.asp*/
.main-body {
  margin: 20px;
}


h1 {
  color: rgb(237, 75, 105)
}

a{
  text-decoration: none;
  color: rgb(120, 79, 255);
}

/*dark-mode*/

.dark-mode {
  background-color: black;
  color: white;
}


.dark-mode a {
  color: rgb(167, 140, 255);
}


#darkButton {
  float: right;
}

.dark-mode ul.topnav {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: rgb(112, 30, 45);
  color: white;
}


.dark-mode ul.topnav li a.active,
.dark-mode ul.topnav #darkMode.active {
  background-color: rgb(201, 89, 110);
}



/*style for resume*/
#resume-img {
  width: 100%;
  height: 100%;
}

/*art gallary*/
.art {
  border: 1px solid #ddd;
  border-radius: 4px;
  padding: 5px;
  height: 500px;
}

/*table*/

table, th, td {
  border:1px solid black;
}

.dark-mode table, .dark-mode th,.dark-mode td {
  border:1px solid white;
}

table, th, td {
  border:1px solid black;
}