@keyframes slide {
  0% {
    background-position: 0px 0px
  }
  100% {
    background-position: -200px 0px
  }
}

body {
    background-image: url("billigbakgrunn.jpg");
    background-repeat: repeat;
    background-size: 200px 40px;
    animation: slide linear 2s infinite;
}

.container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}


h1 {
    background-color: yellow;
    color: red;
    font-style: italic;
    text-align: center; 
    box-shadow: 10px 5px 5px black;
}

input {
    font-size: 24px;
    height: 80px;
  width: 100%; 
	border: 2px solid black;
  box-shadow: 2px 1px 1px black;
  padding: 2% 0;
	margin: 20px auto;
	background-color: yellow;
  border-radius: 5px;
}

button {
  width: max(300px, 30vw);
  height: 8rem;
  background-image: linear-gradient(90deg, #FFC0FF 0%, #AA0000 25%, #FFCF00 49%, #FC4F4F 80%, #FFC0FF 100%);
  border-radius:5px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-transform:uppercase;
  font-size:3rem;
  font-weight:bold;
  animation:slidebg 2s linear infinite;
  box-shadow: 5px 2px 2px black;
}
button:hover {
  transform: scale(1.05);
  transition: 0.2s linear;
}

@keyframes slidebg {
  to {
    background-position: max(300px, 30vw);
  }
}

* {
   box-sizing: border-box;
}


