body
{
  background-color: rgb(177, 221, 177);
  background-image: url(/visuals/Stoneishwall.jpg);
}

.banner
{
   background-image: url("/visuals/164db71ff94f93035892f2ddda12fd88.jpg");
  height: 130px;
  margin-bottom: 40px;
  background-size: cover;
}

.galery
{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  margin: 20px 20px 20px 20px;
}

.bookcover
{
  height: 300px;
  margin: 20px 20px 20px 20px;
}

.bookcover:hover
{
  opacity: 60%;
}








.books{
  margin-left: 45%;
}

.books mark { 
font-family: 'Sour Gummy';
font-size:4em;
font-weight:bold;
background: none;
color:black;
animation: princess 2s infinite;
animation-timing-function: cubic-bezier(0.25, 0.85, 0.4, 1);
}

.books mark:nth-child(1) { animation-delay:0s; display:inline-block;}
.books mark:nth-child(2) { animation-delay:0.2s; display:inline-block;}
.books mark:nth-child(3) { animation-delay:0.4s; display:inline-block; }
.books mark:nth-child(4) { animation-delay:0.6s; display:inline-block;}
.books mark:nth-child(5) { animation-delay:0.8s; display:inline-block;}
.books mark:nth-child(6) { animation-delay:1s; display:inline-block;}
.books mark:nth-child(7) { animation-delay:1.2s; display:inline-block;}
.books mark:nth-child(8) { animation-delay:1.4s; display:inline-block;}
.books mark:nth-child(9) { animation-delay:1.6s; display:inline-block;}
.books mark:nth-child(10) { animation-delay:1.8s; display:inline-block;}

@-webkit-keyframes princess {
from { transform:scale(0.90); color:black; }
50% { transform:scale(1); color:rgb(69, 155, 47); }
to { transform:scale(0.90); color:black; }
}

@keyframes princess {
from { transform:scale(0.90); color:black; }
50% { transform:scale(1); color:rgb(69, 155, 47); }
to { transform:scale(0.90); color:black; }
}


.pop {
font-family: 'Sour Gummy';
font-size:4em;
font-weight:bold;
text-align:center; /* looks weird often if not aligned in center */
-webkit-animation: pop 1s ease-in-out infinite alternate;
-moz-animation: pop 1s ease-in-out infinite alternate;
animation: pop 1s ease-in-out infinite alternate;
}

@keyframes pop {
from { transform:scale(0.95) }
50% { transform:scale(1) }
to { transform:scale(0.95) }
}

@-webkit-keyframes pop {
from { -webkit-transform:scale(0.95) }
50% { -webkit-transform:scale(1) }
to { -webkit-transform:scale(0.95) }
}