pokemon thinger.

<style>

body {background: #;
background-image:url(http://i1025.photobucket.com/albums/y311/ImahTL/repeat-background1_zpsd776ab15.gif);
background-repeat:repeat;

}

#container{
  position: absolute;
  height: 500px;
  width: 500px;
  margin: auto;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  border: 0px solid black;
}

#container2{
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
}

#tophalf{
position: absolute;
height: 200px;
width: 500px;
top: 38px;
left: 0px;
border: 0px solid red;
  background-image:url(http://i67.tinypic.com/2wq7v68.jpg);
  background-position: top 3px center;
  background-repeat: no-repeat;
  background-size: auto 210%;
  z-index: 1;

}

#bottomhalf{
  position: absolute;
  height: 200px;
  width: 500px;
  bottom: 40px;
  left: 0px;
  border: 0px solid blue;
  background-image:url(http://i67.tinypic.com/2wq7v68.jpg);
  background-position: bottom center;
  background-repeat: no-repeat;
  background-size: auto 210%;
  z-index: 1;
}

#middlehalf{
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  margin: auto;
  height: 100px;
  border: 0px solid green;
  background-image:url(http://i67.tinypic.com/2wq7v68.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: auto 420%;
}

#flashdiv{
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  margin: auto;
  height: 50px;
  width: 420px;
  background: white;
  opacity: 0;
  -webkit-filter:blur(10px);
  border: 1px solid red;
  z-index: 2;
  border-radius: 30px 30px 30px 30px;
  transition: all 1s;
  -webkit-transition: all 1s;
}

#pokebutton{
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 3px;
  margin: auto;
  height: 90px;
  width: 90px;
  background-image:url(http://i67.tinypic.com/2wq7v68.jpg);
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 360px 360px 360px 360px;
  background-size: auto 500%;
  border: 0px solid green;
  z-index: 2;
  overflow: hidden;
}

#pokefill{
  position: absolute;
  top: 0px;
  left: 0px;
  height: 110%;
  width: 110%;
  background: #FF1C1C;
  opacity: 0;
}

#pokeflash{
  position: absolute;
  height: 110%;
  width: 110%;
  background: #FF1C1C;
  -webkit-filter:blur(10px);
  opacity: 0;
}

#pokeblack{
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  height: 50px;
  width: 50px;
  margin: auto;
  border-radius: 360px 360px 360px 360px;
  background: #000000;
  z-index: 1;
}

#flashdiv2{
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  margin: auto;
  height: 400px;
  background: white;
  opacity: 0;
  -webkit-filter:blur(10px);
  border: 1px solid red;
  z-index: 2;
  border-radius: 360px 360px 360px 360px;
}

@-webkit-keyframes vibrationanim{
  0%{margin-left: 0px;}
  33.33%{margin-left: -2px;}
  66.66%{margin-left: 2px;}
  100%{margin-left: 0px;}
}

@keframes vibrationanim{
  0%{margin-left: 0px;}
  33.33%{margin-left: -2px;}
  66.66%{margin-left: 2px;}
  100%{margin-left: 0px;}
}

#starterbutton{
  position: absolute;
  top: 0px;
  left: 0px;
  right: 5px;
  bottom: 2px;
  margin: auto;
  height: 87px;
  width: 87px;
  border: 0px solid green;
  z-index: 5;
  box-shadow: 0px 0px 0px black;
  border-radius: 360px 360px 360px 360px;
  cursor:help;
}

#starterbutton:active{
  cursor:progress;
  -webkit-transition: all 0s 0s;
  transition: all 0s 0s;
  box-shadow: 0px 0px 5px 10px #FF1C1C;
  opacity: .5;
}

#pokecheck{opacity:0;}

#pokecheck:checked ~ #container2{
    -webkit-animation: vibrationanim .1s infinite linear;
  animation: vibrationanim .1s infinite linear;
}

#pokecheck:checked ~ #container2  #flashdiv{
  opacity: 1;
  height: 100px;
  -webkit-transition: height 2s 2s, opacity 2s ease-in;
  transition: height 2s 2s, opacity 2s ease-in;
}

#pokecheck:checked ~ #container2 #middlehalf{
  opacity: 0;
  -webkit-transition: all 2s 1s ease-in;
  transition: all 2s 1s ease-in;
}

#pokecheck:checked ~ #container2 #tophalf{
  top: 0px;
  opacity: 0;
  -webkit-transition: all 2s 2s ease-in, opacity 1s 3s;
  transition: all 2s 2s ease-in, opacity 1s 3s;
}

#pokecheck:checked ~ #container2 #bottomhalf{
  bottom: 0px;
  opacity: 0;
  -webkit-transition: all 2s 2s ease-in, opacity 1s 3s;
  transition: all 2s 2s ease-in, opacity 1s 3s;
}

#pokecheck:checked ~ #container2 #flashdiv2{
  opacity: 1;
  -webkit-transition: all .1s 3.4s;
  transition: all .1s 3.4s;
}

#pokecheck:checked ~ #container2{
  opacity: 0;
  -webkit-transition: all .8s 3.6s;
  transition: all .8s 3.6s;
}

#pokecheck:checked ~ #container2 #pokefill{
  opacity: .8;
  transition: all .5s;
  -webkit-transition: all .5s;
}

#pokecheck:checked ~ #container2 #pokebutton{
  opacity: 0;
  height: 160px;
  transition: all 2s 2s ease-in, opacity 2s 3s;
  -webkit-transition: all 2s 2s ease-in, opacity 2s 3s;
}

#pokecheck:checked ~ #container2 #pokeflash{
  opacity: 1;
  -webkit-transition: all .5s 2s;
  transition: all .5s 2s;
}

#buttonblocker{
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  z-index: 4;
}

#pokecheck:checked ~ #buttonblocker{
  z-index: 6;
}

#truecontent{
position: fixed;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
  background: transparent;
  z-index: 3;
  opacity: 0;
  -webkit-transition: all 0s;
  transition: 0s;
}

#pokecheck:checked ~ #truecontent{
  z-index: 7;
  opacity: 1;
  transition: all 1s 4.5s;
  transition: all 1s 4.5s;
}

#picture1{
background-color:;
background-image:url(http://i.picpar.com/S1Vb.png);
background-size:150%;
background-position: 30% 30%;
top:150px;
left:50px;
width: 150px;
height: 300px;
border: 5px #ffffff solid;
border-radius: 100px 0px 0px 100px;
overflow: auto;
position: absolute;
}


</style>


<body>

<div id="container">

<input type="checkbox" for="pokecheck" id="pokecheck" />
<label for="pokecheck">
  <div id="starterbutton">
  </div>  </label>

  <div id="container2">
    <div id="tophalf">
    </div>
    <div id="bottomhalf">
    </div>
    <div id="middlehalf">
    </div>
    <div id="pokebutton">
      <div id="pokefill">
      </div>
      <div id="pokeblack">
      </div>
      <div id="pokeflash">
      </div>
    </div>
    <div id="flashdiv">
    </div>
    <div id="flashdiv2">
    </div>
  </div>

  <div id="buttonblocker">
  </div>
  <div id="truecontent">
<div id="picture1">
</div>
  </div>

</div>



</body>