header{
  position: fixed;
  z-index: 10;
  top: 0;
  left: 0;
  width: 100%;
  padding-left: 50px;
  padding-right: 50px;
  display: flex;
  justify-content: space-between;
  height: 80px;
  background-color: rgba(10, 10, 10, 0.75);
  box-sizing: border-box;
  backdrop-filter: blur(2px);
}

header::before{
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  width: 100%;
  height: 4px;
  display: block;
  background: linear-gradient(115deg, #4fcf70, #fad648, #a767e5, #12bcfe, #44ce7b);
}

header>a.logo{
  display: flex;
  align-items: center;
  text-decoration: none;
}

header>a.logo>span.img{
  margin-right: 10px;
  display: inline-block;
  width: 35px;
  height: 35px;
  background-image: url(/images/logo.png);
  background-repeat: no-repeat;
  background-size: contain;
}

header>a.logo>span.name{
  color: white;
  font-family: "montserrat-extrabold";
  font-size: 22px;
}

header>span.hamburger{
  display: none;
  width: 30px;
  height: 30px;
  background-image: url(/images/icons/hamburger.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  align-self: center;
  cursor: pointer;
}

header>span.hamburger:hover{
  opacity: 0.75;
}

header>div.hamburger_content{
  display: none;
  flex-direction: column;
  position: fixed;
  left: 0;
  top: -4px;
  width: 100vw;
  height: 100vh;
  box-sizing: border-box;
  padding: 50px;
  background-color: rgba(10, 10, 10, 0.9);
  border-top: 4px #5383ff solid;
  align-items: flex-start;
  z-index: 100;
}

header>div.hamburger_content>a{
  color: white;
  text-decoration: none;
  font-family: 'montserrat-regular';
  font-size: 22px;
  margin-bottom: 20px;
}

header>div.hamburger_content>a.sign_up,
header>div.hamburger_content>a[href="account.php"]{
  position: relative;
  padding-left: 10px;
  padding-right: 10px;
  margin-top: 10px;
  margin-bottom: 30px;
}

header>div.hamburger_content>a.sign_up::before,
header>div.hamburger_content>a[href="account.php"]::before{
  position: absolute;
  content: "";
  width: 100%;
  height: 50px;
  background-color: #5383ff;
  box-sizing: border-box;
  /* border: 2px #5383ff solid; */
  border-radius: 5px;
  z-index: -1;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

header>div.hamburger_content>span.go_back{
  height: 20px;
  width: 50px;
  display: inline-block;
  position: absolute;
  right: 50px;
  top: 50px;
  background-image: url(/images/icons/hamburger_arrow.png);
  background-position: right center;
  background-repeat: no-repeat;
  background-size: contain;
  cursor: pointer;
}

header>div.hamburger_content:not(.shown){
  display: none !important;
}

header>div.actions{
  display: flex;
  align-items: center;
  height: 76px;
  margin-top: 4px;
  gap: 10px;
}

header>div.actions>a{
  color: white;
  text-decoration: none;
  font-family: 'montserrat-regular';
  font-size: 16px;
  line-height: 76px;
}

/* header>div.actions:hover>*:not(:hover){
  opacity: 0.5;
} */

/***         MEDIA QUERIES 0-750         ***/
@media screen and (min-width: 0px) and (max-width: 750px) {

  header{
    padding-left: 25px;
    padding-right: 25px;
  }

  header>div.hamburger_content{
    display: flex;
  }

  header>span.hamburger{
    display: inline-block;
  }

  header>div.actions{
    display: none;
  }

}