/* Photo Slideshow */

body::before {
        content: url("toy-1.jpg");
        position: absolute;
        top: -9999rem;
        left: -9999rem;
        opacity: 0;
}

.slideshow {
  position: absolute;
  width: 100%;
  height: 500px;
  overflow: hidden;
}
.slide {
  position: absolute;
  width: 100%;
  height: 100%;
  background: no-repeat 50% 50%;
  background-size: cover;
  -webkit-animation-name: zoom;
          animation-name: zoom;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-duration: 88s;
          animation-duration: 88s;
  opacity: 1;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
}
.slide:nth-child(1) {
  background-image: url("toy-1.jpg");
  -webkit-animation-name: zoom-1;
          animation-name: zoom-1;
  z-index: 90;
}
.slide:nth-child(2) {
  background-image: url("toy-2.jpg");
  -webkit-animation-name: zoom-2;
          animation-name: zoom-2;
  z-index: 80;
}
.slide:nth-child(3) {
  background-image: url("toy-3.jpg");
  -webkit-animation-name: zoom-3;
          animation-name: zoom-3;
  z-index: 70;
}
.slide:nth-child(4) {
  background-image: url("toy-4.jpg");
  -webkit-animation-name: zoom-4;
          animation-name: zoom-4;
  z-index: 60;
}
.slide:nth-child(5) {
  background-image: url("toy-5.jpg");
  -webkit-animation-name: zoom-5;
          animation-name: zoom-5;
  z-index: 50;
}
.slide:nth-child(6) {
  background-image: url("toy-6.jpg");
  -webkit-animation-name: zoom-6;
          animation-name: zoom-6;
  z-index: 40;
}
.slide:nth-child(7) {
  background-image: url("toy-7.jpg");
  -webkit-animation-name: zoom-7;
          animation-name: zoom-7;
  z-index: 30;
}
.slide:nth-child(8) {
  background-image: url("toy-8.jpg");
  -webkit-animation-name: zoom-8;
          animation-name: zoom-8;
  z-index: 20;
}
.slide:nth-child(9) {
  background-image: url("toy-9.jpg");
  -webkit-animation-name: zoom-9;
          animation-name: zoom-9;
  z-index: 10;
}

/* Overlapping pictures, their visibility timed by percentage */

@-webkit-keyframes zoom-1 {
       0% {opacity: 1; -webkit-transform: scale(1); transform: scale(1);}
    0.56% {opacity: 1;}
   10.56% {opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2);}
   11.67% {opacity: 0;}
   99.44% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
     100% {opacity: 1;}
}

@keyframes zoom-1 {
       0% {opacity: 1; -webkit-transform: scale(1); transform: scale(1);}
    0.56% {opacity: 1;}
   10.56% {opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2);}
   11.67% {opacity: 0;}
   99.44% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
     100% {opacity: 1;}
}
@-webkit-keyframes zoom-2 {
   10.56% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
   11.67% {opacity: 1;}
   21.67% {opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2);}
   22.78% {opacity: 0;}
     100% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@keyframes zoom-2 {
   10.56% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
   11.67% {opacity: 1;}
   21.67% {opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2);}
   22.78% {opacity: 0;}
     100% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@-webkit-keyframes zoom-3 {
   21.67% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
   22.78% {opacity: 1;}
   32.78% {opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2);}
   33.89% {opacity: 0;}
     100% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@keyframes zoom-3 {
   21.67% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
   22.78% {opacity: 1;}
   32.78% {opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2);}
   33.89% {opacity: 0;}
     100% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@-webkit-keyframes zoom-4 {
   32.78% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
   33.89% {opacity: 1;}
   43.89% {opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2);}
   45.00% {opacity: 0;}
     100% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@keyframes zoom-4 {
   32.78% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
   33.89% {opacity: 1;}
   43.89% {opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2);}
   45.00% {opacity: 0;}
     100% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@-webkit-keyframes zoom-5 {
   43.89% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
   45.00% {opacity: 1;}
   55.00% {opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2);}
   56.11% {opacity: 0;}
     100% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@keyframes zoom-5 {
   43.89% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
   45.00% {opacity: 1;}
   55.00% {opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2);}
   56.11% {opacity: 0;}
     100% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@-webkit-keyframes zoom-6 {
   55.00% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
   56.11% {opacity: 1;}
   66.11% {opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2);}
   67.22% {opacity: 0;}
     100% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@keyframes zoom-6 {
   55.00% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
   56.11% {opacity: 1;}
   66.11% {opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2);}
   67.22% {opacity: 0;}
     100% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@-webkit-keyframes zoom-7 {
   66.11% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
   67.22% {opacity: 1;}
   77.22% {opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2);}
   78.33% {opacity: 0;}
     100% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@keyframes zoom-7 {
   66.11% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
   67.22% {opacity: 1;}
   77.22% {opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2);}
   78.33% {opacity: 0;}
     100% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@-webkit-keyframes zoom-8 {
   77.22% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
   78.33% {opacity: 1;}
   88.33% {opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2);}
   89.44% {opacity: 0;}
     100% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@keyframes zoom-8 {
   77.22% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
   78.33% {opacity: 1;}
   88.33% {opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2);}
   89.44% {opacity: 0;}
     100% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@-webkit-keyframes zoom-9 {
   88.33% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
   89.44% {opacity: 1;}
   99.44% {opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2);}
     100% {opacity: 0; -webkit-transform: scale(1.2); transform: scale(1.2);}
}
@keyframes zoom-9 {
   88.33% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
   89.44% {opacity: 1;}
   99.44% {opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2);}
     100% {opacity: 0; -webkit-transform: scale(1.2); transform: scale(1.2);}
}


/* Text Slideshow */

.slidetext {
position: absolute;
width: 100%;
height: 500px;
overflow: hidden;
padding: 0;
margin: 0;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
align-items: center;
justify-content: center;
}
.textinfo {
position: absolute;
text-align: center;
font-family: Helvetica, sans-serif;
font-size: 12vmin;
font-weight: bold;
color: rgb(255, 255, 255, 0.7);
background-color: transparent;
-webkit-animation-name: showtext;
        animation-name: showtext;
-webkit-animation-timing-function: linear;
        animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
        animation-iteration-count: infinite;
-webkit-animation-duration: 88s;
        animation-duration: 88s;
opacity: 0;
-webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
        transform: scale(1.1);
}
.textinfo:nth-child(1) {
-webkit-animation-name: showtext-1;
        animation-name: showtext-1;
z-index: 95;
}
.textinfo:nth-child(2) {
-webkit-animation-name: showtext-2;
        animation-name: showtext-2;
z-index: 85;
}
.textinfo:nth-child(3) {
-webkit-animation-name: showtext-3;
        animation-name: showtext-3;
z-index: 75;
}
.textinfo:nth-child(4) {
-webkit-animation-name: showtext-4;
        animation-name: showtext-4;
z-index: 65;
}
.textinfo:nth-child(5) {
-webkit-animation-name: showtext-5;
        animation-name: showtext-5;
z-index: 55;
}
.textinfo:nth-child(6) {
-webkit-animation-name: showtext-6;
        animation-name: showtext-6;
z-index: 45;
}
.textinfo:nth-child(7) {
-webkit-animation-name: showtext-7;
        animation-name: showtext-7;
z-index: 35;
}
.textinfo:nth-child(8) {
-webkit-animation-name: showtext-8;
        animation-name: showtext-8;
z-index: 25;
}
.textinfo:nth-child(9) {
-webkit-animation-name: showtext-9;
        animation-name: showtext-9;
z-index: 15;
}

/* Sliding-in text */

@-webkit-keyframes showtext-1 {
  1% {opacity: 0; -webkit-transform: scale(1.1); transform: scale(1.1);}
  5% {opacity: 1;}
 10% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}

@keyframes showtext-1 {
  1% {opacity: 0; -webkit-transform: scale(1.1); transform: scale(1.1);}
  5% {opacity: 1;}
 10% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@-webkit-keyframes showtext-2 {
 12% {opacity: 0; -webkit-transform: scale(1.1); transform: scale(1.1);}
 16% {opacity: 1;}
 21% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@keyframes showtext-2 {
 12% {opacity: 0; -webkit-transform: scale(1.1); transform: scale(1.1);}
 16% {opacity: 1;}
 21% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@-webkit-keyframes showtext-3 {
 23% {opacity: 0; -webkit-transform: scale(1.1); transform: scale(1.1);}
 27% {opacity: 1;}
 32% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@keyframes showtext-3 {
 23% {opacity: 0; -webkit-transform: scale(1.1); transform: scale(1.1);}
 27% {opacity: 1;}
 32% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@-webkit-keyframes showtext-4 {
 34% {opacity: 0; -webkit-transform: scale(1.1); transform: scale(1.1);}
 38% {opacity: 1;}
 43% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@keyframes showtext-4 {
 34% {opacity: 0; -webkit-transform: scale(1.1); transform: scale(1.1);}
 38% {opacity: 1;}
 43% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@-webkit-keyframes showtext-5 {
 45% {opacity: 0; -webkit-transform: scale(1.1); transform: scale(1.1);}
 49% {opacity: 1;}
 55% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@keyframes showtext-5 {
 45% {opacity: 0; -webkit-transform: scale(1.1); transform: scale(1.1);}
 49% {opacity: 1;}
 55% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@-webkit-keyframes showtext-6 {
 57% {opacity: 0; -webkit-transform: scale(1.1); transform: scale(1.1);}
 61% {opacity: 1;}
 66% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@keyframes showtext-6 {
 57% {opacity: 0; -webkit-transform: scale(1.1); transform: scale(1.1);}
 61% {opacity: 1;}
 66% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@-webkit-keyframes showtext-7 {
 68% {opacity: 0; -webkit-transform: scale(1.1); transform: scale(1.1);}
 72% {opacity: 1;}
 77% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@keyframes showtext-7 {
 68% {opacity: 0; -webkit-transform: scale(1.1); transform: scale(1.1);}
 72% {opacity: 1;}
 77% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@-webkit-keyframes showtext-8 {
 79% {opacity: 0; -webkit-transform: scale(1.1); transform: scale(1.1);}
 83% {opacity: 1;}
 88% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@keyframes showtext-8 {
 79% {opacity: 0; -webkit-transform: scale(1.1); transform: scale(1.1);}
 83% {opacity: 1;}
 88% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@-webkit-keyframes showtext-9 {
 90% {opacity: 0; -webkit-transform: scale(1.1); transform: scale(1.1);}
 94% {opacity: 1;}
 99% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
@keyframes showtext-9 {
 90% {opacity: 0; -webkit-transform: scale(1.1); transform: scale(1.1);}
 94% {opacity: 1;}
 99% {opacity: 0; -webkit-transform: scale(1); transform: scale(1);}
}
.shadowline {
 border: 1px solid rgb(210, 210, 210);
}

