body {
  margin: 0;
  padding: 0;
  width: inherit;
}

nav {
  display: flex;
  justify-content: space-between;
  margin: 0;
  height: 75px;
  border-bottom: black 3px solid;
  min-width: 1000px;
}

nav div a {
  display: flex;
  align-items: center;
  text-decoration: none;
  color: black;
}

.nav-container {
  background: linear-gradient(90deg, white 0%, rgba(0,212,255,1) 35%, rgb(17, 17, 182) 100%); 
  height: 75px;
  border-bottom: black 3px solid;

}
.title-div {
  margin: 0 0 0 15px;
  display: flex;
}

.logout-btn {
cursor: pointer;
/* border: black 1px solid; */
border-radius: 5px;
border: rgb(94, 94, 94) 1px solid;
background-color: rgb(255, 200, 50);
width: 70px;
height: 35px;
margin: 18px 15px 0 0;
font-size: 19px;
font-family: 'Staatliches', cursive;
}

.site-title {
  font-size: 51px;
  font-family: 'Tourney', cursive;
  font-weight: 600;
}

.page-title {
  font-size: 20px;
  margin: 16px 0 0 20px;
  font-family: 'Tourney', cursive;
  opacity: .6;

}
.right-nav-container {
  display: flex;
}

.drop-menu {
  margin: 18px 40px 0 0;
  cursor: pointer;
}
.drop-btn {
  transition: width .5s;
  width: 75px;
  height: 35px;
  border: rgb(94, 94, 94) 1px solid;
  background-color: #78d6ff;
  border-radius: 5px;
  font-family: 'Hammersmith One', sans-serif;  
  font-size: 18px;
  cursor: pointer;
}

.drop-content {
  display: none;
  position: absolute;
  background-color: #78d6ff;
  min-width: 180px;
  z-index: 1;
  border: 1px black solid;
  margin-top: 5px;
  font-size: 17px;
  font-family: 'Hammersmith One', sans-serif;
}

.profile-btn {
  margin: 18px 40px 0 0;
  width: 75px;
  height: 35px;
  border: rgb(94, 94, 94) 1px solid;
  background-color: #78d6ff;
  border-radius: 5px;
  font-family: 'Hammersmith One', sans-serif;  
  font-size: 18px;
  cursor: pointer;
}

.site-title:hover {
  color: red;
}

.drop-menu:hover .drop-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  border: 1px black solid;
}

.drop-content a:hover {
  background-color: rgb(255, 251, 0);
}

.drop-menu:hover .drop-content {
  display: flex;
  flex-direction: column;
}

.drop-menu:hover .drop-btn {
  background-color: #fff956;
  transition: .5s;
  width: 180px;
}

.profile-btn:hover {
  background-color: #fff956;

}

.logout-btn:hover {
  background-color: red;
  color: white;

}
#controller {
  width: 60px;
}