main{
  max-width: 450px;
  min-height: 200px;
  margin: 0 auto;
  text-align: center;
  padding-bottom: 60px;
}
.GodMessage {
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  margin-top: 20px;
  text-shadow: 0px 0px 10px #afafaf;
  }
#showp {
  font-size: 20px;
  color: white;
  display: inline-block;
  margin-bottom: 5px;
  font-family: 'Arial', cursive;
  text-shadow: 1px 1px 10px black, 2px 2px 10px black, -1px -1px 10px black, -2px -2px 10px black;
  }
.go {
  border-radius: 10px;
  padding: 5px;
  background-color:#F669F9;
  border: 1px solid #4267d9;
  position: fixed;
  right:2px;
  bottom:0px;
  height:50px;
  width:23%;
  display: inline-block;
}
.footer {
   position: fixed;
   left: 0;
   bottom: 0;
   width: 100%;
   background-color: transparent;
   text-align: center;
}
input[type="submit"] {
  width: 30%;
  height: 60px;
  cursor: pointer;
  animation: nudge 2s linear infinite alternate;
  background: #D432E1;
  border: 3px solid #F76D2D;
  border-radius: 10px;
  color: #fff;
  font-size: 22px;
}
input[type="text"] {
  float:left;
  width:100%;
  max-width:70%;
  height:60px;
  background-color: #1b488b;
  animation: nudge 2s linear infinite alternate;
  border-radius: 10px;
  border: 3px solid #F76D2D;
  padding: 15px;
  color: #fff;
 font-size: 18px;


}
@keyframes nudge {
  0%, 100% {
    transform: scale(1);
  }
  
  50% {
    transform: scale(.8);
  }
  
  80% {
    transform: scale(1);
  }
}
.footerbtn {
  position: fixed;
  right: 0;
  left: 0;
  bottom: 5;
  margin-right: auto;
  margin-left: auto;
  height:55px; 
  border-radius: 15px;
  background:#34af23;
  color: #ffffff;
  font-size: 20px;
  text-align: center;
  text-decoration: none;
  width:80%;
  animation: footer infinite linear 1s;
  -webkit-transform: translate3d(30%,0,0);
  transform: translate3d(30%,0,0);
}
@-webkit-keyframes footer {
  from {
    -webkit-transform: rotateZ(0)
      }
    25% {
        -webkit-transform: rotateZ(1.5deg)
        }
    50% {
        -webkit-transform: rotateZ(0deg)
        }
    75% {
        -webkit-transform: rotateZ(-1.5deg)
        }
    to {
        -webkit-transform: rotateZ(0)
}}
.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.animated.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}
.shake{-webkit-animation-name:shake;animation-name:shake}@-webkit-keyframes headShake{0%{-webkit-transform:translateX(0);transform:translateX(0)}6.5%{-webkit-transform:translateX(-6px) rotateY(-9deg);transform:translateX(-6px) rotateY(-9deg)}18.5%{-webkit-transform:translateX(5px) rotateY(7deg);transform:translateX(5px) rotateY(7deg)}31.5%{-webkit-transform:translateX(-3px) rotateY(-5deg);transform:translateX(-3px) rotateY(-5deg)}43.5%{-webkit-transform:translateX(2px) rotateY(3deg);transform:translateX(2px) rotateY(3deg)}50%{-webkit-transform:translateX(0);transform:translateX(0)}}
@-webkit-keyframes shake{0%,to{-webkit-transform:translateZ(0);transform:translateZ(0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}@keyframes shake{0%,to{-webkit-transform:translateZ(0);transform:translateZ(0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}
.pulse{-webkit-animation-name:pulse;animation-name:pulse}
@-webkit-keyframes pulse{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}@keyframes pulse{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}
.jello {  -webkit-animation: jello 3s infinite;  transform-origin: center; -webkit-animation-delay:0s}
@-webkit-keyframes jello {  from, 11.1%, to {    transform: none;  }
  22.2% {    transform: skewX(-12.5deg) skewY(-12.5deg);  }
  33.3% {    transform: skewX(6.25deg) skewY(6.25deg);  }
  44.4% {    transform: skewX(-3.125deg) skewY(-3.125deg);  }
  55.5% {    transform: skewX(1.5625deg) skewY(1.5625deg);  }
  66.6% {    transform: skewX(-0.78125deg) skewY(-0.78125deg);  }
  77.7% {    transform: skewX(0.390625deg) skewY(0.390625deg);  }
  88.8% {    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);  }}
.bounceIn{-webkit-animation-name:bounceIn;animation-name:bounceIn}
@-webkit-keyframes bounceIn{0%,20%,40%,60%,80%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}20%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}40%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}80%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}to{opacity:1;-webkit-transform:scaleX(1);transform:scaleX(1)}}@keyframes bounceIn{0%,20%,40%,60%,80%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}20%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}40%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}80%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}to{opacity:1;-webkit-transform:scaleX(1);transform:scaleX(1)}}
.tada{-webkit-animation-name:tada;animation-name:tada}
@-webkit-keyframes tada{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate(-3deg);transform:scale3d(.9,.9,.9) rotate(-3deg)}30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate(3deg);transform:scale3d(1.1,1.1,1.1) rotate(3deg)}40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate(-3deg);transform:scale3d(1.1,1.1,1.1) rotate(-3deg)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}@keyframes tada{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate(-3deg);transform:scale3d(.9,.9,.9) rotate(-3deg)}30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate(3deg);transform:scale3d(1.1,1.1,1.1) rotate(3deg)}40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate(-3deg);transform:scale3d(1.1,1.1,1.1) rotate(-3deg)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}
    .m1{position:fixed;left:1%; width:auto;height:100%;top:1%;color:#000;}
    .m2{position:fixed;right:1%; width:auto;height:100%;top:1%;color:#000;}
a{text-decoration:none;color:inherit}
/* Custom Animation classes */ 
* { box-sizing:border-box; }

figure {
  animation:wobble 5s ease-in-out infinite;
  transform-origin:center center;
  transform-style:preserve-3d;
}

@keyframes wobble {
  0%,100%{ transform:rotate3d(1,1,0,40deg); }
  25%{ transform:rotate3d(-1,1,0,40deg); }
  50%{ transform:rotate3d(-1,-1,0,40deg); }
  75%{ transform:rotate3d(1,-1,0,40deg); }
}

hero {
  display:block;
  width:90%;
  text-transform:uppercase;
  line-height:1.5;
  font:900 35px 'SF Espresso Shack', sans-serif;
  position:absolute;
  color:white;
  animation:glow 10s ease-in-out infinite;
}

@keyframes glow {
  0%,100%{ text-shadow:0 0 30px black; }
  25%{ text-shadow:0 0 30px orange; }
  50%{ text-shadow:0 0 30px forestgreen; }
  75%{ text-shadow:0 0 30px cyan; }
}

hero:nth-child(2){ transform:translateZ(5px); }
hero:nth-child(3){ transform:translateZ(10px);}
hero:nth-child(4){ transform:translateZ(15px); }
hero:nth-child(5){ transform:translateZ(20px); }
hero:nth-child(6){ transform:translateZ(25px); }
hero:nth-child(7){ transform:translateZ(30p.rock{animation:infinite 1s rock}
@keyframes rock {  0% {    transform: rotate(-1deg);  }
  50% {    transform: rotate(2deg);  }
  100% {    transform: rotate(-1deg);  }}x); }
hero:nth-child(8){ transform:translateZ(35px); }
hero:nth-child(9){ transform:translateZ(40px); }
hero:nth-child(10){ transform:translateZ(45px); }

.test{
  padding: 0!important;
  width: 100%!important;
  text-align: center;
} 

.test .name{
  margin: auto!important;
  padding: 0!important;
  text-align: center;
  font-size: 13px;
  text-transform: uppercase;
  font-weight: bold;
}

.test .name span{ 
  min-width: 10px;
  display:inline-block;
  font-size: 3.5em;
  user-select:none; 
}
.name span { display:inline-block; animation:shake-rotate 5s ease-in-out infinite; }
 @keyframes float {
  0%,100%{ transform:none; }
  33%{ transform:translateY(-1px) rotate(-2deg); }
  66%{ transform:translateY(1px) rotate(2deg); }
}
span:nth-child(8n) { color:hsl(50, 75%, 55%); text-shadow:1px 1px hsl(50, 75%, 45%), 2px 2px hsl(50, 45%, 45%), 3px 3px hsl(50, 45%, 45%), 4px 4px hsl(50, 75%, 45%); }
span:nth-child(8n-1) { color:hsl(135, 35%, 55%); text-shadow:1px 1px hsl(135, 35%, 45%), 2px 2px hsl(135, 35%, 45%), 3px 3px hsl(135, 35%, 45%), 4px 4px hsl(135, 35%, 45%); }
span:nth-child(8n-2) { color:hsl(155, 35%, 60%); text-shadow:1px 1px hsl(155, 25%, 50%), 2px 2px hsl(155, 25%, 50%), 3px 3px hsl(155, 25%, 50%), 4px 4px hsl(140, 25%, 50%); }
span:nth-child(8n-3) { color:hsl(30, 65%, 60%); text-shadow:1px 1px hsl(30, 45%, 50%), 2px 2px hsl(30, 45%, 50%), 3px 3px hsl(30, 45%, 50%), 4px 4px hsl(30, 45%, 50%); }
span:nth-child(8n-4) { color:hsl(323, 100%, 50%, 1); text-shadow:1px 1px hsl(323, 75%, 50%, 1), 2px 2px hsl(323, 75%, 35%, 1), 3px 3px hsl(323, 75%, 35%, 1), 4px 4px hsl(323, 75%, 35%, 1); }
span:nth-child(8n-5) { color:hsl(245, 40%, 50%, 1); text-shadow:1px 1px hsl(245, 40%, 35%, 1), 2px 2px hsl(245, 40%, 35%, 1), 3px 3px hsl(245, 40%, 35%, 1), 4px 4px hsl(245, 40%, 35%, 1); }
span:nth-child(8n-6) { color:hsl(0, 82%, 33%, 1); text-shadow:1px 1px hsl(0, 82%, 13%, 1), 2px 2px hsl(0, 82%, 13%, 1), 3px 3px hsl(0, 82%, 13%, 1), 4px 4px hsl(0, 82%, 13%, 1); }
span:nth-child(8n-7) { color:hsl(355, 91%, 63%); text-shadow:1px 1px hsl(355, 91%, 43%), 2px 2px hsl(355, 91%, 43%), 3px 3px hsl(355, 91%, 43%), 4px 4px hsl(355, 91%, 43%); }

.name span:nth-child(2) { animation-delay: .1s; }
.name span:nth-child(3) { animation-delay: .2s; }
.name span:nth-child(4) { animation-delay: .3s; }
.name span:nth-child(5) { animation-delay: .4s; }
.name span:nth-child(6) { animation-delay: .5s; }
.name span:nth-child(7) { animation-delay: .6s; }
.name span:nth-child(8) { animation-delay: .7s; }
.name span:nth-child(9) { animation-delay: .8s; }
.name span:nth-child(10) { animation-delay: .9s; }
.name span:nth-child(11) { animation-delay: 1s; }
.name span:nth-child(12) { animation-delay: 1.1s; }
.name span:nth-child(13) { animation-delay: 1.2s; }
.name span:nth-child(14) { animation-delay: 1.3s; }
.name span:nth-child(15) { animation-delay: 1.4s; }
.name span:nth-child(16) { animation-delay: 1.5s; }
.name span:nth-child(17) { animation-delay: 1.6s; }
.name span:nth-child(18) { animation-delay: 1.7s; }
.name span:nth-child(19) { animation-delay: 1.8s; }
.name span:nth-child(20) { animation-delay: 1.9s; }
.name span:nth-child(21) { animation-delay: 2s; }

.test{
  margin-top: 0!important;
  margin-bottom: 0!important;
}
@-webkit-keyframes shake-rotate {
  0%, 10%, 20%, 30%, 40%, 50%, 60%, 70%, 80%, 90%, 100% {
    -webkit-transform: rotate(10deg);
    transform: rotate(10deg);
  }
  5%,
  15%,
  25%,
  35%,
  45%,
  55%,
  65%,
  75%,
  85%,
  95% {
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
}

@keyframes shake-rotate {
  0%, 10%, 20%, 30%, 40%, 50%, 60%, 70%, 80%, 90%, 100% {
    -webkit-transform: rotate(10deg);
    transform: rotate(10deg);
  }
  5%,
  15%,
  25%,
  35%,
  45%,
  55%,
  65%,
  75%,
  85%,
  95% {
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
}
.username {
  color: black;  /* Fallback: assume this color ON TOP of image */
  background: url(sname.gif);
  font-family:SF Espresso Shack;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: swing 4s infinite;
  text-transform: uppercase;
  margin-bottom: 5px;
  font-size: 30px;
  padding: 0 10px;
}
.username1 {
  color: black;  /* Fallback: assume this color ON TOP of image */
  background: url(sname.gif);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: swing 4s infinite;
  text-transform: uppercase;
  margin-bottom: 5px;
  font-size: 35x;
  font-family:SF Espresso Shack;
  padding: 0 10px;
}
a{text-decoration:none;color:inherit}
.shareBtn {
  position: fixed;
  right: calc(50% - 145px);
  bottom: 5px;
  width: 300px;
  height: 60px;
  background-color: #007f00;
  border-radius: 100px;
  color: white;
  line-height: 60px;
  text-align: center;
  letter-spacing: 1px;
  overflow: hidden;
  animation: footer infinite linear 1s;
  transition: all .3s cubic-bezier(.67,.13,.1,.81), transform .15s cubic-bezier(.67,.13,.1,.81);
}
.shareShow {
  position: fixed;
  right: calc(50% - 45px);
  bottom: 5px;
  width: 100px;
  height: 60px;
  background-color: brown;
  border-radius: 100px;
  color: white;
  line-height: 60px;
  text-align: center;
  letter-spacing: 1px;
  overflow: hidden;
  transition: all .3s cubic-bezier(.67,.13,.1,.81), transform .15s cubic-bezier(.67,.13,.1,.81);
}
.platforms {
  position: fixed;
  right: calc(50% - 145px);
  height: 100px;
  width: 300px;
  bottom: 65px;
  border-radius: 5px;
  visibility: hidden;
  transform: scale(.9);
  overflow: hidden;
}
.platforms:target {
  visibility: visible;
  transform: scale(1);
  opacity: 1;
}
.platforms a {
  position: absolute;
  width: 90px;
  height: 90px;
  border-radius: 5px;
  color: #3F8EFC;
  text-transform: uppercase;
}
.platforms a:nth-child(1) {
  background-color: #1A5276;
  left: 60px;
}
.platforms a:nth-child(2) {
  background-color: #1A5276;
  left: 155px;
}
.platforms:target a {
  top: 5px;
}
.platforms a:hover {
  background: #E5F4FF;
  box-shadow: 0 0 0 1px #A5CFFF;
}
.platforms a:before {
  content: attr(data-os);
  position: absolute;
  color:white;
  bottom: 5px;
  left: 0px;
  width: 100%;
  font-size: 12px;
  text-align: center;
}
.fireworks-container {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: -999;
}
#loading {
  -webkit-animation: rotation-star 0.1s infinite linear;
  animation: rotation-star 0.1s infinite linear;
  }
  @-webkit-keyframes rotation-star {
  from {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  }
  to {
  -webkit-transform: rotate(359deg);
  transform: rotate(359deg);
  }
  }
  @-keyframes rotation-star{
  from {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  }
  to {
  -webkit-transform: rotate(359deg);
  transform: rotate(359deg);
}
}
.leftcurtain{
      width: 50%;
      height: 100%;
      top: 0px;
      left: 0px;
      position: absolute;
      z-index: 2;
    }
     .rightcurtain{
      width: 50%;
      height: 100%;
      right: 0px;
      top: 0px;
      position: absolute;
      z-index: 3;
    }
    .rightcurtain img, .leftcurtain img{
      width: 100%;
      height: 100%;
    }

    .logo{
      margin: 0px auto;
      margin-top: 150px;
    }
    .rope{
      position: absolute;
      top: 5px;
      left: 35%;
      z-index: 4;
    } 
.centered {
    position: absolute;
    top: 100%;
    left: 100%;
    transform: translate(-50%, -50%);
}
a.rope
{
    text-decoration:none;
}