/*diashow_xl*/
#window_xl {
position:relative;
width:400px;
height:690px;
overflow:hidden;
box-shadow:0 0 15px 0 rgba(0,0,0,1);
margin:50px auto;
}

#all_xl {
-webkit-animation:slide10 40s ease-in-out infinite;
-moz-animation:slide10 40s ease-in-out infinite;
-ms-animation:slide10 40s ease-in-out infinite;
-o-animation:slide10 40s ease-in-out infinite;
animation:slide12 40s ease-in-out infinite;
width:4800px;
height:690px;
background:#444;
}

#window_xl:hover #all_xl {
-webkit-animation-play-state:paused;
-moz-animation-play-state:paused;
-ms-animation-play-state:paused;
-o-animation-play-state:paused;
animation-play-state:paused;
}

#window_xl:hover:after {
content:"▌▌";
text-shadow:-1px -2px 3px #fff,1px 2px 3px #000;
position:absolute;
right:5px;
top:5px;
opacity:.6;
color:#bbb;
}

#all_xl span {
display:block;
float:left;
width:400px;
height:690px;
}

#all_xl span.ls img {
display:block;
width:400px;
height:690px;
}

#all_xl span.pt img {
display:block;
height:690px;
margin:0 auto;
}

100% {
margin-left:-4800px;
}

20%,66%,86%,52%,27% {
margin-left:-1200px;
}

33%,53%,32%,10%,17% {
margin-left:-600px;
}

12%,7% {
margin-left:0;
}

40%,92%,47% {
margin-left:-2100px;
}

60%,67% {
margin-left:-3200px;
}

72%,30%,37% {
margin-left:-1600px;
}

80%,87% {
margin-left:-4200px;
}

50%,57% {
margin-left:-2000px;
}

70%,77% {
margin-left:-2800px;
}

90%,97% {
margin-left:-3600px;
}
@keyframes slide3 {
  0% {
    margin-left: 0;
  }

  20% {
    margin-left: 0;
  }

  33% {
    margin-left: -600px;
  }

  53% {
    margin-left: -600px;
  }

  66% {
    margin-left: -1200px;
  }

  86% {
    margin-left: -1200px;
  }

  100% {
    margin-left: -1800px;
  }
}

@keyframes slide5 {
  0% {
    margin-left: 0;
  }

  12% {
    margin-left: 0;
  }

  20% {
    margin-left: -600px;
  }

  32% {
    margin-left: -600px;
  }

  40% {
    margin-left: -1200px;
  }

  52% {
    margin-left: -1200px;
  }

  60% {
    margin-left: -1800px;
  }

  72% {
    margin-left: -1800px;
  }

  80% {
    margin-left: -2400px;
  }

  92% {
    margin-left: -2400px;
  }

  100% {
    margin-left: -3000px;
  }
}

@keyframes slide10 {
  0% {
    margin-left: 0;
  }

  7% {
    margin-left: 0;
  }

  10% {
    margin-left: -600px;
  }

  17% {
    margin-left: -600px;
  }

  20% {
    margin-left: -1200px;
  }

  27% {
    margin-left: -1200px;
  }

  30% {
    margin-left: -1800px;
  }

  37% {
    margin-left: -1800px;
  }

  40% {
    margin-left: -2400px;
  }

  47% {
    margin-left: -2400px;
  }

  50% {
    margin-left: -3000px;
  }

  57% {
    margin-left: -3000px;
  }

  60% {
    margin-left: -3600px;
  }

  67% {
    margin-left: -3600px;
  }

  70% {
    margin-left: -4200px;
  }

  77% {
    margin-left: -4200px;
  }

  80% {
    margin-left: -4800px;
  }

  87% {
    margin-left: -4800px;
  }

  90% {
    margin-left: -5400px;
  }

  97% {
    margin-left: -5400px;
  }

  100% {
    margin-left: -6000px;
  }
}
@keyframes slide12 {
  0% {
    margin-left: 0;
  }

  11% {
    margin-left: 0;
  }

  14% {
    margin-left: -400px;
  }

  17% {
    margin-left: -400px;
  }

  20% {
    margin-left: -800px;
  }

  23% {
    margin-left: -800px;
  }

  29% {
    margin-left: -1200px;
  }

  32% {
    margin-left: -1200px;
  }

  38% {
    margin-left: -1600px;
  }

  41% {
    margin-left: -1600px;
  }

  44% {
    margin-left: -2000px;
  }

  50% {
    margin-left: -2000px;
  }

  53% {
    margin-left: -2400px;
  }

  50% {
    margin-left: -2400px;
  }

  53% {
    margin-left: -2800px;
  }

  60% {
    margin-left: -2800px;
  }

  63% {
    margin-left: -3200px;
  }

  70% {
    margin-left: -3200px;
  }

  73% {
    margin-left: -3600px;
  }

  80% {
    margin-left: -3600px;
  }

  83% {
    margin-left: -4000px;
  }
  90% {
    margin-left: -4000px;
  }
  93% {
    margin-left: -4400px;
  }
  100% {
    margin-left: -4400px;
  }
  100% {
    margin-left: -4800px;
  }
}
@media only screen and (max-width:34em) {
  h1 {
    font-size: 30pt;
    font-family: sans-serif;
    text-shadow: 10px 11px 12px red;
  }

  #window {
    position: relative;
    width: 300px;
    height: 255px;
    margin: 50px auto;
    overflow: hidden;
    box-shadow: 0 0 15px 0 rgba(0, 0, 0, 1);
  }

  #window:hover:after {
    content: "▌▌";
    text-shadow: -1px -2px 3px #fff, 1px 2px 3px #000;
    position: absolute;
    right: 5px;
    top: 5px;
    opacity: 0.60000002384185791015625;
    color: #bbb;
  }
}

@keyframes slide3 {
  0% {
    margin-left: 0;
  }

  20% {
    margin-left: 0;
  }

  33% {
    margin-left: -300px;
  }

  53% {
    margin-left: -300px;
  }

  66% {
    margin-left: -600px;
  }

  86% {
    margin-left: -600px;
  }

  100% {
    margin-left: -1200px;
  }
}

@keyframes slide5 {
  0% {
    margin-left: 0;
  }

  12% {
    margin-left: 0;
  }

  20% {
    margin-left: -300px;
  }

  32% {
    margin-left: -300px;
  }

  40% {
    margin-left: -600px;
  }

  52% {
    margin-left: -600px;
  }

  60% {
    margin-left: -1200px;
  }

  72% {
    margin-left: -1200px;
  }

  80% {
    margin-left: -1200px;
  }

  92% {
    margin-left: -1200px;
  }

  100% {
    margin-left: -1500px;
  }
}

@keyframes slide10 {
  0% {
    margin-left: 0;
  }

  7% {
    margin-left: 0;
  }

  10% {
    margin-left: -300px;
  }

  17% {
    margin-left: -300px;
  }

  20% {
    margin-left: -600px;
  }

  27% {
    margin-left: -600px;
  }

  30% {
    margin-left: -900px;
  }

  37% {
    margin-left: -900px;
  }

  40% {
    margin-left: -1200px;
  }

  47% {
    margin-left: -1200px;
  }

  50% {
    margin-left: -1500px;
  }

  57% {
    margin-left: -1500px;
  }

  60% {
    margin-left: -1600px;
  }

  67% {
    margin-left: -1600px;
  }

  70% {
    margin-left: -2100px;
  }

  77% {
    margin-left: -2100px;
  }

  80% {
    margin-left: -2400px;
  }

  87% {
    margin-left: -2400px;
  }

  90% {
    margin-left: -2700px;
  }

  97% {
    margin-left: -2700px;
  }

  100% {
    margin-left: -3000px;
  }
}