body{
    background-color: rgb(0, 0, 0);
}


#backgroundimage{
    position: fixed;
    width: 100%;
    height: 100%;
      background-image: url(rattata.png);
    background-size: 200px;
    opacity: 0.3;
    z-index: -100;
}

@font-face {
  font-family: Ravie; /* set name */
  src: url(Ravie.ttf); /* url of the font */
}

@font-face {
  font-family: Cooper; /* set name */
  src: url(Cooper-Black.ttf); /* url of the font */
}


h1{
    color: rgb(255, 133, 245);
    font-family: Ravie;
    font-size: 70px;
    margin: auto;
    animation: pop 1s ease-in-out infinite alternate;

}


p{
    color: rgb(255, 133, 245);
    font-size: x-large;
}

.buttonbox{
    width: 100%;
    display:flex;
    justify-content: space-around;
    
}


.lastbuttonbox{
    width: 60%;
    display:flex;
    justify-content: space-around;
    
}


button {
    margin: 30px;
    transition: transform 0.1s ease;
}

button:hover {
    transform: scale(1.1);
}

@keyframes pop {
from {
transform:scale(0.95)
}

50% {
transform:scale(1)
}

to {
transform:scale(0.95)
}
}

.banner{
    width: 100%;
   margin: auto;
   text-align: center;
}

#so{
    width: 300px;
    position:fixed;
    top: 500px;
    left: 1150px;
    z-index: -100;
}

#buybutton{
    float: right;
    margin-right: 300px;
    margin-top: -150px;
    background-color: rgb(207, 156, 255);
    width: 10%;
    font-size: large;
    border-radius: 10px;
}


#TV{
    width: 30%;
    height: 300px;
      position:fixed;
    top: 100px;
    left: 70px;
    z-index: -10;
}