.fn{margin-left:0 auto;margin-right:0 auto;}
.fn1 p,.fn2 p{font-size:0;}
.fn3{position:absolute;top:50%;-webkit-transform:translateX(-50%) translateY(-50%);-webkit-transform:translateX(-50%) translateY(-50%);-moz-transform:translateX(-50%) translateY(-50%);-ms-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%);left:50%;margin-top:5px;z-index:123}
.fn4{position:absolute;bottom:100px;left:12%;margin-left:38px;z-index:3}
.fn6{position:absolute;bottom:-81px;left:50%;margin-left:-286px;z-index:2}
canvas{display:block;position:absolute;top:0;left:0}#canvas3{z-index:5}#canvas2{z-index:10}#canvas1{z-index:100}@-webkit-keyframes thunder-bg{0%{background-color:rgba(0,191,255,0.1)}9%{background-color:rgba(0,191,255,0.2)}10%{background-color:rgba(0,191,255,0.3)}10.5%{background-color:rgba(0,191,255,0.2)}80%{background-color:rgba(0,191,255,0.3)}82%{background-color:rgba(0,191,255,0.2)}83%{background-color:rgba(0,191,255,0.1)}83.5%{background-color:rgba(0,191,255,0.2)}100%{background-color:rgba(0,191,255,0.1)}}
.fa-codepen{-webkit-animation:fade 3s infinite alternate;-moz-animation:fade 3s infinite alternate;-o-animation:fade 3s infinite alternate;animation:fade 3s infinite alternate}a img{border:0;}div span{font-size:4em;font-family:"Quicksand",sans-serif;font-weight:500;color:#ddd;transition:.25s}
.green {
  position: absolute;
   text-shadow: 2px 2px 1px rgba(0,0,0,.4),
    0 0 20px #69F0AE,
    0 0 40px rgba(0, 230, 118, .75),
    0 0 50px rgba(0, 230, 118, .75),
    0 0 100px rgba(0, 230, 118, .75);
}
.green:before{
  content:'';
  position: absolute;
  background: rgba(105, 240, 174, .25);
  z-index: -1;
  opacity: .7;
  filter: blur(30px);
  width: 100%;
  height: 100%;
}
.buttons{margin-bottom:auto;margin-top:20px}button{margin:0 5px;padding:10px;letter-spacing:1px;background:0;border:2px solid #444;height:2.25em;border-radius:2.25em;color:#444;font-size:1.25em;font-weight:bold;text-transform:uppercase;transition:.5s;outline:0}button:nth-child(1):hover{color:#00e676;text-shadow:0 0 7px #00e676;border-color:#00e676;box-shadow:0 0 15px #00e676,inset 0 0 15px #00e676}button:nth-child(2):hover{color:#ff005b;text-shadow:0 0 7px #ff005b;border-color:#ff005b;box-shadow:0 0 15px #ff005b,inset 0 0 15px #ff005b}button:nth-child(3):hover{color:#2196f3;text-shadow:0 0 7px #2196f3;border-color:#2196f3;box-shadow:0 0 15px #2196f3,inset 0 0 15px #2196f3}@-moz-keyframes fade{40%{opacity:.8}42%{opacity:.1}43%{opacity:.8}45%{opacity:.1}46%{opacity:.8}}@-webkit-keyframes fade{40%{opacity:.8}42%{opacity:.1}43%{opacity:.8}45%{opacity:.1}46%{opacity:.8}}@-o-keyframes fade{40%{opacity:.8}42%{opacity:.1}43%{opacity:.8}45%{opacity:.1}46%{opacity:.8}}@keyframes fade{40%{opacity:.8}42%{opacity:.1}43%{opacity:.8}45%{opacity:.1}46%{opacity:.8}}@-webkit-keyframes rotation{from{-webkit-transform:rotate(0deg)}to{-webkit-transform:rotate(360deg)}}.Rotation{-webkit-transform:rotate(360deg);animation:rotation 8s linear infinite;-moz-animation:rotation 8s linear infinite;-webkit-animation:rotation 8s linear infinite;-o-animation:rotation 8s linear infinite}.Rotation:hover{-webkit-animation-play-state:paused;animation-play-state:paused}@keyframes mylogo{from{top:5px}to{top:-5px}}@-moz-keyframes mylogo{from{top:5px}to{top:-5px}}@-webkit-keyframes mylogo{from{top:5px}to{top:-5px}}@-o-keyframes mylogo{from{top:5px}to{top:-5px}}.imagelogo{float:left;position:relative;width:604px;height:160px;margin-left:12px;padding:0;cursor:pointer;animation:mylogo 2s linear 0s infinite alternate;-moz-animation:mylogo 2s linear 0s infinite alternate;-webkit-animation:mylogo 2s linear 0s infinite alternate;-o-animation:mylogo 2s linear 0s infinite alternate}