body {
  background-color: rgb(50,10,40);
  margin: 0;
}

.menu{
  margin-top:5%;
  margin-left:5%;
  margin-right:5%;

}

.container {
  width: 100%;
  height:80vmin;
  background: url('../assets/interface/background_alpha.png');
  background-repeat: no-repeat;
  background-size: contain;
  background-position:center;

  z-index: 2;
  display: grid;
  grid-template-columns: 100%;
  grid-template-rows: 2fr 1fr;
  grid-gap: 1px;
  max-width: 87vmin;
  margin-left: auto;
  margin-right: auto;
}

.top-half-container{
  display:grid;
  grid-template-columns: 70% 30%;
}

.logo{
  background:url('../assets/interface/thelogo.png') center center;
  background-size:80%;
  background-position: 80% 70%;
  background-repeat: no-repeat;
}

.social-media-container{
  display:grid;
  grid-template-rows: 39% 28% 33%;
}

.twitter-button{
  background:url('../assets/interface/twitterbutton0001.png') center center;
  background-size:53%;
  background-position: 12% 99%;
}

.twitter-button:hover{
  background:url('../assets/interface/twitterbutton0002.png') center center;
  background-size:55%;
  background-position: 12% 99%;
  cursor:pointer;
}

.instagram-button{
  background:url('../assets/interface/instagrambutton0001.png') center center;
  background-size:58%;
  background-position: 7% 59%;
}

.instagram-button:hover{
  background:url('../assets/interface/instagrambutton0002.png') center center;
  background-size:60%;
  background-position: 7% 59%;
  cursor:pointer;
}

.youtube-button{
  background:url('../assets/interface/youtubebutton0001.png') center center;
  background-size:59%;
  background-position: 3% 28%;
}

.youtube-button:hover{
  background:url('../assets/interface/youtubebutton0002.png') center center;
  background-size:61%;
  background-position: 3% 28%;
  cursor:pointer;
}

.enter-button{
  background:url('../assets/interface/EnterButton0001.png') center center;
  background-size:59%;
  background-position: 63% 20%;
}

.enter-button:hover{
  background:url('../assets/interface/EnterButton0002.png') center center;
  background-size:61%;
  background-position: 63% 20%;
  cursor:pointer;
}

.bottom-half-container{
  display:grid;
}



.instagram-button,.instagram-button:hover,
.twitter-button,.twitter-button:hover,
.youtube-button,.youtube-button:hover,
.enter-button,.enter-button:hover{
  transition-duration: 0.15s;
  background-repeat: no-repeat;
  transition-timing-function:cubic-bezier(.02,.45,.14,1.32);
  transition-property: background-size;
}