main{
  font-family: verdana;
}

header{
  font-style: normal;
  font-variant: normal;
  font-size: 10px;
  text-align: right;
  letter-spacing: 3px;
  line-height: 2;
  margin-bottom: 60px;
  color: rgb(250, 250, 51);
}


li a{
	list-style: none;
	font-size: 10pt;
	line-height: 24pt;
  color: yellow;
  text-decoration: none;
}


li a:hover{
  color: white;
}

ul.menu{
  list-style-type: none;
}




.container1 {
  position: absolute;
  width: 100%;
  max-width: 350px;
  top: 150px;
  display: flex;
  align-items: right;
}

.image {
  display: block;
  width: 100%;
  height: auto;
}

.container2 {
  position: absolute;
  width: 100%;
  max-width: 350px;
  right: 300px;
  display: flex;
  align-items: right;
}

.image {
  display: block;
  width: 100%;
  height: auto;
}

.container3 {
  position: absolute;
  width: 100%;
  max-width: 350px;
  top: 650px;
  right: 200px;
  display: flex;
  align-items: right;
}

.image {
  display: block;
  width: 100%;
  height: auto;
}

.container4 {
  position: absolute;
  width: 100%;
  max-width: 350px;
  top: 650px;
  right: 200px;
  display: flex;
  align-items: right;
}

.image {
  display: block;
  width: 100%;
  height: auto;
}

.container5 {
  position: absolute;
  width: 100%;
  max-width: 350px;
  top: 650px;
  right: 200px;
  display: flex;
  align-items: right;
}

.image {
  display: block;
  width: 100%;
  height: auto;
}

.container6 {
  position: absolute;
  width: 100%;
  max-width: 350px;
  top: 650px;
  display: flex;
  align-items: right;
}

.image {
  display: block;
  width: 100%;
  height: auto;
}

.container66 {
  position: absolute;
  width: 100%;
  max-width: 350px;
  top: 650px;
  right: 200px;
  display: flex;
  align-items: right;
}

.image {
  display: block;
  width: 100%;
  height: auto;
}

.container7 {
  position: absolute;
  width: 100%;
  max-width: 350px;
  top: 650px;
  right: 300px;
  display: flex;
  align-items: right;
}

.image {
  display: block;
  width: 100%;
  height: auto;
}

.container8 {
  position: absolute;
  width: 100%;
  max-width: 350px;
  top: 650px;
  right: 300px;
  display: flex;
  align-items: right;
}

.image {
  display: block;
  width: 100%;
  height: auto;
}





.container1 {
  top: 250px;
  opacity: 0;
  position: absolute;
  animation-name: container1;
  animation-duration: 7s;
  animation-delay: 1s;
  animation-fill-mode: backwards;
  animation-iteration-count: infinite;
}

@keyframes container1 {
  0%   {opacity: 0}
  50%  {opacity: 1}
  100% {opacity: 0}
}

.container2 {
  top: 150px;
  opacity: 0;
  position: absolute;
  animation-name: container2;
  animation-duration: 8s;
  animation-delay: 2s;
  animation-iteration-count: infinite;
}

@keyframes container2 {
  0%   {opacity: 0}
  50%  {opacity: 1}
  100% {opacity: 0}
}

.container3 {
  top: 350px;
  left: 350px;
  opacity: 0;
  position: absolute;
  animation-name: container3;
  animation-duration: 9s;
  animation-delay: 3s;
  animation-iteration-count: infinite;
}

@keyframes container3 {
  0%   {opacity: 0}
  50%  {opacity: 1}
  100% {opacity: 0}
}

.container4 {
  top: 550px;
  right: 320px;
  opacity: 0;
  position: absolute;
  animation-name: container4;
  animation-duration: 8s;
  animation-delay: 4s;
  animation-iteration-count: infinite;
}

@keyframes container4 {
  0%   {opacity: 0}
  50%  {opacity: 1}
  100% {opacity: 0}
}

.container5 {
  top: 680px;
  left: 230px;
  opacity: 0;
  position: absolute;
  animation-name: container5;
  animation-duration: 10s;
  animation-delay: 4s;
  animation-iteration-count: infinite;
}

@keyframes container5 {
  0%   {opacity: 0}
  50%  {opacity: 1}
  100% {opacity: 0}
}

.container6 {
  top: 980px;
  opacity: 0;
  position: absolute;
  animation-name: container6;
  animation-duration: 7s;
  animation-delay: 5s;
  animation-iteration-count: infinite;
}

@keyframes container6 {
  0%   {opacity: 0}
  50%  {opacity: 1}
  100% {opacity: 0}
}

.container66 {
  top: 900px;
  left: 450px;
  opacity: 0;
  position: absolute;
  animation-name: container66;
  animation-duration: 8s;
  animation-delay: 5.5s;
  animation-iteration-count: infinite;
}

@keyframes container66 {
  0%   {opacity: 0}
  50%  {opacity: 1}
  100% {opacity: 0}
}

.container7 {
  top: 1200px;
  opacity: 0;
  position: absolute;
  animation-name: container7;
  animation-duration: 8s;
  animation-delay: 6s;
  animation-iteration-count: infinite;
}

@keyframes container7 {
  0%   {opacity: 0}
  50%  {opacity: 1}
  100% {opacity: 0}
}

.container8 {
  top: 1400px;
  left: 250px;
  opacity: 0;
  position: absolute;
  animation-name: container8;
  animation-duration: 8s;
  animation-delay: 7s;
  animation-iteration-count: infinite;
}

@keyframes container8 {
  0%   {opacity: 0}
  50%  {opacity: 1}
  100% {opacity: 0}
}





.mydivbook{
  font-size: 15px;
  letter-spacing: 1.5px;
}
