body {
    background-color: rgb(94, 188, 202);
    background-image: url("https://filmclub.neocities.org/bilder/index-gross.jpg");
    background-repeat: repeat;
    background-size:50cm;
}

header {
    height: 200px;
}

main {
    background-color: #393a41;
    justify-content: center;
    align-items: center;
    margin: auto;
    padding: 20px;
    height: 510px;
    width: 350px;
    border-radius: 8px;
    color: #ffffff;
    font-family: Arial, Helvetica, sans-serif;
}

p {

}

h1 {
    font-size: large;
}

h2 {
    font-weight: bold;
    font-size: medium;
}

h3 {
    font-size:x-small;
    font-weight: lighter;
}



.Top{
    justify-content: center;
    align-items: center;
    margin: auto;
    text-align: center;
}

.Top img{
    height: 60px;
    border-radius: 5px;
}

.signup {
    justify-content: left;
    align-items: left;
    margin: auto;
    text-align: left;
    width: auto;
}

input {
    background-color: #393a41;
    border-radius: 10px;
    border-color: #80818d;
    border-width: 3px;
    box-shadow: none;
    width: 350px;
    height: 25px;
    color: #8b8b91;
    border: 2px solid #5865f2; /* Here */
}

th input{
    width: 29px;
}

select {
    background-color: #393a41;
    border-radius: 3px;
    border-color: #80818d;
    border-width: 3px;
    box-shadow: none;
    width: 112px;
    height: 30px;
    color: #8b8b91;
    padding: 3px;
}

select:focus {
    border-color: #5865f2;
}

a{
    color: #5865f2;
}

.createaccount h3{
    width: 20;

    
}

.createaccount input{
    background-color:#5865f2 ;
    height: 35px;
    color: #ffffff;
    
}

.createaccount input:hover{
    animation: shake 0.5s;
    animation-iteration-count: 1;
    animation-iteration-count: 4;
}

@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-1px, 0px) rotate(1deg); }
  30% { transform: translate(1px, 1px) rotate(2deg); }
  40% { transform: translate(1px, -2px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-2deg); }
  60% { transform: translate(-2px, -2px) rotate(1deg); }
  70% { transform: translate(-2px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -2px) rotate(2deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(-2px, -2px) rotate(-2deg); }
}

.createaccount p{
    font-size: smaller;
    color:#8b8b91;
}