/* Resetting default styles */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* -------------------------- TOPBAR   ---------------------------------------- */
.logo {
  display: none;
  position: absolute;
  top: 0;
  padding: 5px;
  color: white;
  background-color: whitesmoke;
  border-radius: 15px;
  z-index: 999;
}

.topnav {
  display: flex;  
  justify-content: center;
  width: auto;
  padding: 0px 0px 0px 0px;
  white-space: nowrap;
  z-index: 9999;
}


/* Basic styles for the menu */
.topnav ul {
  list-style: none;
}

.topnav ul li {
  display: inline-block;
  position: relative;
  border-right: solid white 1px;
  border-radius: 12px 12px 1px 1px;
  box-shadow: 1px 1px 11px 1px;
  background-color: white;
  text-align: left;
}

.topnav ul li:hover a {
  color: white;
  color: black;
}

.topnav ul li a,
.topnav2 ul li a {
  display: block;
  padding: 7px 7px 7px;
  /* t,r,b, l  */
  color: black;
  text-decoration: none;

  font-size: 15px;
  
}

/*
.t33opnav.active {
  color: white; 
  background-color: black;
}

.act33ive a{
  color: white;  
}
*/

#thumb {
  width: 40px;
  border-radius: 50px;
}

#me {
  color: white;
  color: black;
  font-style: italic;
  font-size: large;
  background-color: aliceblue;
  background-color: aqua;
  width: auto;
  padding: 4px 4px 4px 4px;
  border-radius: 5px 0px 5px 0px;
}

/***********************  SUBNAVIGATION UNDER TOPBAR ******************************* */
.topnav ul li ul {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background: #333;
}

.topnav ul li:hover>ul {
  display: block;
  background: #555;
}

.topnav ul li ul li {
  display: block;
  white-space: nowrap;
}

/* Submenu styles */
.topnav ul li ul li ul {
  top: 0;
  left: 100%;
  background: #555;

}

.topnav ul li:hover>a {
  background: #555;
  color: white;
}

.topnav ul li ul li:hover>a {
  background: #333;
  z-index: 9999;
}


.null {
  z-index: 1;
}

.blink {
  animation: blinker 2.5s linear infinite;
  font-family: sans-serif;
}

@keyframes blinker {
  50% {
    opacity: 0.5;
  }
}

@keyframes wiggle {

  0%,
  100% {
    transform: rotate(0deg);
  }

  25% {
    transform: rotate(-1deg);
  }

  50% {
    transform: rotate(1deg);
  }

  75% {
    transform: rotate(-1deg);
  }
}


/***********************  SUBNAVIGATION UNDER TOPBAR ******************************* */
/* -------------------------- TOPBAR   ---------------------------------------- */