body {
  background-image: url(BackgroundPu.jpg);
  background-size: 150vh 100vh;
  background-position-x:center;
  background-position-y:0vh;
  animation-name: Scroll;
  animation-duration: 90s;
  animation-iteration-count:infinite;
  animation-timing-function:linear(0,1);
}

@keyframes Scroll{
  0%  {background-position-y:0vh;}
  100%  {background-position-y:-300vh;}
}

h1{
  font-family: 'Cavalhatriz', sans-serif;
  text-shadow: 2px 2px 4px rgbrgb(0, 0, 0);
  font-size: 70px;
  text-align: center;
  color: #dd78ce;
  text-shadow: 2px 2px 4px rgb(0, 0, 0);
}

.grid{
  border: 3px double #dd78ce;
  display: grid;
  grid-template-columns: repeat(10, 1fr);
  grid-template-rows: repeat(30, 1fr);
  background-color: rgba(76, 14, 70, 0.6);
  margin: auto;
  height: 1300px;
  width: 800px;
  border-radius: 20px;
}
.Logo{
  grid-row: span 7;
  grid-column: span 10;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;}
.Nav{
  border: 1px solid #dd78ce;
  border-top-left-radius: 10px;
  color: #dd78ce;
  grid-row: span 14;
  grid-column: span 2;
  display: flex;
  flex-direction: column;
}

.Nav div{
font-size: 20px;
border: 1px solid #dd78ce;
border-radius: 10px;
height: 30px;
line-height: 30px;
}

.Pres{
  grid-row: span 8;
  grid-column: span 7;
  color: #dd78ce;
  border: 1px solid #dd78ce;
}

.Stamps{
  grid-row: span 8;
  grid-column: span 1;
  color: #dd78ce;
  display: flex;
  flex-direction: column;
  flex-grow: 0;
  flex-shrink: 0;
  border-top-right-radius: 10px;
  border: 1px solid #dd78ce ;
}

.Reccomendations{
  grid-row: span 6;
  grid-column: span 8;
  color: #dd78ce;
  border: 1px solid #dd78ce ;
}

.Stamps img{
  image-rendering: pixelated;
    flex-shrink: 0;
    min-width: 0%;
    min-height: 0%;
    max-width: 100%;
  }
.grid div{
  text-align: center;
  margin: 6px;
}

.Chat {
  grid-row: span 9;
  grid-column: span 7;
  border: 1px solid #dd78ce;
  color: #dd78ce;
  border-bottom-left-radius: 20px;
}

.Button
{
  grid-row: span 9;
  grid-column: span 3;
  border: 1px solid #dd78ce;
  color: #dd78ce;
  border-bottom-right-radius: 20px;
}

.Button div{
  background-color: #121212 ;
  font-family: 'Courier New', Courier, monospace;
  padding: 20px;
  border: 1px solid #3F3F46;
  box-shadow: 3px 3px 5px rgba(0,0,0,0.1);
  width: auto;
  word-wrap: break-word;}
img{
  object-fit: cover;
}

a{
  color: inherit;
  text-shadow: 0.5px 0.5px 1px rgb(100, 100, 100);
}

*{
  text-shadow: 0.5px 0.5px 1px rgb(0, 0, 0);
}


@keyframes Scroll{
  0%  {background-position-y:0vh;}
  100%  {background-position-y:-300vh;}
}

@font-face {
    font-family: 'Amaranth'; /*a name to be used later*/
    src: url('Amaranth-Regular.ttf'); /*URL to font*/
}

@font-face {
    font-family: 'Cavalhatriz'; /*a name to be used later*/
    src: url('Cavalhatriz.ttf'); /*URL to font*/
}
