#show {
    z-index: 12;	
    height: 300px;
    width: 300px;
    position:absolute;
    bottom:20%;
    right:0%;
    padding-left:2px;
    background: url("show.png") no-repeat bottom;
    background-size: contain;
    background-repeat: no-repeat;
    background-size: cover;
    color:lightyellow;
    opacity: 0;
    animation: tickerShow 60s;
    filter: brightness(1);
    #border: 2px outset rgba(0,255,133,.77);
}
#abutton{
    height:70px; 
    width:100px; 
    margin: -20px -50px; 
    position:relative;
    top:50%; 
    left:50%;
}


@keyframes tickerShow {
    0%  {
        transform: translate3d(0px,0,0) rotate(-3deg);
        filter: hue-rotate(-2deg);
        opacity: 0;
    }
    10% {
        transform: translate3d(-50px,0px,0) rotate(3deg);
        filter: hue-rotate(2deg);
        opacity: 1;
    }
    30% {
        transform: translate3d(0px,0px,0) rotate(0deg);
        filter: hue-rotate(-2deg) brightness(1);
        opacity: 1;
    }
    96% {
        filter: hue-rotate(-2deg) brightness(1);
        opacity: 1;
    }		
    100% {
        opacity: 0;
    }		
}

@keyframes showSlide1 {
    0%  {
        opacity: 0;
        display: none;
        visibility: hidden;
    }
    28%  {
        opacity: 0;
        display: none;
        visibility: hidden;
    }
    30% {
        opacity: 1;		
        display: block;
        visibility: visible;
        transform: scale(1);        
    }
    40% {
        opacity: 1;		
        display: block;
        visibility: visible;
        transform: scale(1.2);        
    }
    42% {
        opacity: 0;
        display: none;
        visibility: hidden;
    }		
    100% {
        opacity: 0;
        display: none;
        visibility: hidden;
    }		
}
@keyframes showSlide2 {
    0%  {
        opacity: 0;
        display: none;
        visibility: hidden;
    }
    38%  {
        opacity: 0;
        display: none;
        visibility: hidden;
    }
    40% {
        opacity: 1;		
        display: block;
        visibility: visible;
        transform: scale(1);
    }
    60% {
        opacity: 1;		
        display: block;
        visibility: visible;
        transform: scale(1.2);
    }
    62% {
        opacity: 0;
        display: none;
        visibility: hidden;
    }		
    100% {
        opacity: 0;
        display: none;
        visibility: hidden;
    }		
}
@keyframes showSlide3 {
    0%  {
        opacity: 0;
        display: none;
        visibility: hidden;
    }
    58%  {
        opacity: 0;
        display: none;
        visibility: hidden;
    }		
    60% {
        opacity: 1;		
        display: block;
        visibility: visible;
        transform: scale(1);        
    }
    78% {
        opacity: 1;		
        display: block;
        visibility: visible;
        transform: scale(1.2);        
    }
    79% {
        opacity: 0;
        display: none;
        visibility: hidden;
    }		
    100% {
        opacity: 0;
        display: none;
        visibility: hidden;
    }		
}
@keyframes showSlide4 {
    0%  {
        opacity: 0;
        display: none;
        visibility: hidden;
    }
    78%  {
        opacity: 0;
        display: none;
        visibility: hidden;
    }		
    80% {
        opacity: 1;		
        display: block;
        visibility: visible;
        transform: scale(1);        
    }
    88% {
        opacity: 1;		
        display: block;
        visibility: visible;
        transform: scale(1.2);        
    }
    89% {
        opacity: 0;
        display: none;
        visibility: hidden;
    }		
    100% {
        opacity: 0;
        display: none;
        visibility: hidden;
    }		
}
@keyframes showSlide5 {
    0%  {
        opacity: 0;
        display: none;
        visibility: hidden;
    }
    88%  {
        opacity: 0;
        display: none;
        visibility: hidden;
    }		
    90% {
        opacity: 1;		
        display: block;
        visibility: visible;
        transform: scale(1);        
    }
    98% {
        opacity: 1;		
        display: block;
        visibility: visible;
        transform: scale(1.2);        
    }
    99% {
        opacity: 0;
        display: none;
        visibility: hidden;
    }		
    100% {
        opacity: 0;
        display: none;
        visibility: hidden;
    }		
}

#ss1 {
    animation: showSlide1 60s forwards;
}
#ss2 {
    animation: showSlide2 60s forwards;		  
}
#ss3 {
    animation: showSlide3 60s forwards;		  
}
#ss4 {
    animation: showSlide4 60s forwards;
}
#ss5 {
    animation: showSlide5 60s forwards;
}
  
.show {
  background-color: #f1f1fa;
  color: #224;
  font-family: 'Arial', Arial;
  font-size: 1.4rem;
  #font-weight: 400;
  font-weight: 800;
  text-wrap: wrap;
}

.padd {
  padding-top: 15%;
  padding-bottom: 25%;
  padding-left: 0;
  padding-right: 0;
}

.wood {
  font-family: "Arial", Arial;
  #font-size: calc( 4vw );
  font-size: 48px;
  font-weight: 850;
  line-height: 1.4;
  margin: 0;
  max-width: 100%;
  padding: 0;
  text-transform: uppercase;  
  text-align: center;
  vertical-align: middle;
  text-wrap: wrap;
}
.slides {
  position: absolute;
  align-items: center;
  vertical-align: middle;  
  padding-left: 0%;
  padding-right: 0%;
}
a.sld:hover {
  #background-color: rgba(250, 112, 159, 0.2); 
  background-color: rgba(255, 135, 70, 0.2);
  text-decoration: none;
}

.overlap span {
  /* set up transparency and overlap */
  #color: rgba(55,110,25,.75);
  color: orange;
  letter-spacing: -0.235em;
  line-height: 0.7;
  position: relative;
  word-spacing: 0.75em;
  align-items: center;
  vertical-align: middle;  
  font-size: 1.5em;
}

.overlap span::before {
  content: attr(data-content);
  #color: rgba(125,20,0,.75);
  color: yellow;  
  font-weight: 750;
  line-height: 1;
  opacity: 0.35;
  position: absolute;
  top: 0.1em;
  left: -0.05em;
}

/* Play with the second solid fill color and opacity */
.overlap span:nth-child(odd)::before {
  color: rgba(190,0,0,.75);
}

.overlap span:nth-child(5n+1)::before {
  color: rgba(35,50,00,.15);
}

.overlap span:nth-child(7n+0)::before {
  color: rgba(0,80,95,.25);
}

.overlap span::after {
  content: attr(data-content);
  color: transparent;
  font-weight: 900;
  line-height: 1;
  position: absolute;
  top: 0.1em;
  left: 0;
  -webkit-text-stroke: 0.02em white;
  text-stroke: 0.01em white;
}

/* mix up the letter outlines a bit */
.overlap span:nth-child(odd)::after {
  -webkit-text-stroke: 0.08em #ffdce9;
  text-stroke: 0.02em olive;
  left: -0.0125em;
  top: 0.12em;
  opacity: 0.7;
}
.overlap span:nth-child(5n+1)::after {
  -webkit-text-stroke: 0.08em rgba(170,80,195,.9);
  text-stroke: 0.05em rgba(70,80,195,.9);
  left: 0.05em;
  opacity: 0.7;
}

.overlap span:nth-child(4n+3)::after {
  -webkit-text-stroke: 0.05em rgba(150,200,5,.96);
  text-stroke: 0.05em rgba(150,200,5,.96);;
  top: 0.130em;
  left: 0.015em;
  opacity: 0.7;
}

.overlap span:nth-child(7n+0)::after {
  -webkit-text-stroke: 0.035em white;
  text-stroke: 0.015em white;
  left: -0.025em;
  top: 0.072em;
  opacity: 0.7;
}

.content-container {
  max-width: 80vw;
  margin: 2rem auto;
}