html,
body {
  height: 100%;
}
body {
  margin: 0px;
  padding: 0px;
  font-family: Helvetica, Arial, sans-serif;
  font-size: 12px;
  color: #000;
  background: #7cdde5 url(/img/bg.png) 0px 0px repeat;
}
a {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}
a:hover,
a:active {
  outline: none;
}
ul,
li {
  margin: 0px;
  padding: 0px;
  list-style: none;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0px;
  font-size: 12px;
  font-weight: normal;
}
p {
  margin: 0px;
  line-height: 1.4;
}
.clear {
  clear: both;
  height: 0px;
  overflow: hidden;
}
.wrapper {
  margin: 0px auto;
  width: 700px;
  padding: 0px 100px 100px;
}
#container {
  position: relative;
  margin-bottom: 8px;
  padding-top: 220px;
}
#container .asset {
  position: absolute;
  background-position: left top;
  background-repeat: no-repeat;
}
#container .asset .frame-animation {
  position: absolute;
  background-position: 0px 0px;
  background-repeat: no-repeat;
}
#container .asset .frame-animation.fire {
  left: 135px;
  top: 40px;
  width: 67px;
  height: 74px;
  background-image: url(/img/assets/animations/fire.png);
}
#container .asset .frame-animation.butterfly {
  right: 0px;
  top: 75px;
  width: 42px;
  height: 48px;
  background-image: url(/img/assets/animations/butterfly.png);
}
#container .asset .frame-animation.wheel {
  left: 115px;
  top: 315px;
  width: 48px;
  height: 47px;
  background-image: url(/img/assets/animations/wheel.png);
}
#container .asset.top-left {
  left: 10px;
  top: 225px;
  width: 519px;
  height: 207px;
  background-image: url(/img/assets/top_left.png);
}
#container .asset.top-left.complete {
  left: -60px;
  top: 36px;
}
#container .asset.right-top {
  right: 10px;
  top: 225px;
  width: 115px;
  height: 278px;
  background-image: url(/img/assets/right_top.png);
}
#container .asset.right-top.complete {
  right: -60px;
  top: 163px;
}
#container .asset.left {
  left: 10px;
  top: 239px;
  width: 162px;
  height: 357px;
  background-image: url(/img/assets/left.png);
}
#container .asset.left.complete {
  left: -143px;
}
#container .asset.right {
  right: 10px;
  top: 402px;
  width: 132px;
  height: 212px;
  background-image: url(/img/assets/right.png);
}
#container .asset.right.complete {
  right: -102px;
}
#container h1.logo {
  position: absolute;
  right: 16px;
  top: 225px;
}
#container h1.logo.complete {
  top: 56px;
}
#container h1.logo,
#container h1.logo a.text {
  width: 271px;
  height: 159px;
}
#container h1.logo a.text {
  display: block;
  text-indent: -1000000px;
  background: url(/img/Little-Frog-logo.png) left top no-repeat;
}
#container #video {
  position: relative;
  margin-bottom: 20px;
  background-color: #000;
}
#container #video,
#container #video .overlay {
  width: 700px;
  height: 394px;
}
#container #video .overlay {
  position: absolute;
  left: 0px;
  top: 0px;
  background: url(/img/video-ph-notext2.jpg) left top no-repeat;
}
#container #menu {
  width: 720px;
}
#container #menu ul li {
  float: left;
  margin-right: 20px;
  margin-bottom: 17px;
}
#container #menu ul li,
#container #menu ul li a {
  width: 100px;
  height: 102px;
}
#container #menu ul li a {
  position: relative;
  display: block;
  text-indent: -1000000px;
  background-position: 0px 0px;
  background-repeat: no-repeat;
}
#container #menu ul li a:hover,
#container #menu ul li a.active {
  top: -2px;
}
#container #menu ul li a .new {
  position: absolute;
  right: -17px;
  top: -6px;
  display: block;
  text-indent: -1000000px;
  width: 44px;
  height: 51px;
  background: url(/img/new-badge.png) left top no-repeat;
  z-index: 10;
}
#container #menu ul li.train-song a {
  background-image: url(/img/menu/train-song.png);
}
#container #menu ul li.fishing-man a {
  background-image: url(/img/menu/fishing-man.png);
}
#container #menu ul li.little-frog a {
  background-image: url(/img/menu/little-frog.png);
}
#container #menu ul li.chicken a {
  background-image: url(/img/menu/chicken.png);
}
#container #menu ul li.meerkat a {
  background-image: url(/img/menu/meerkat.png);
}
#container #menu ul li.big-hair a {
  background-image: url(/img/menu/big-hair.png);
}
#container #menu ul li.bark a {
  background-image: url(/img/menu/bark.png);
}
#container #menu ul li.chips a {
  background-image: url(/img/menu/chips.png);
}
#container #menu ul li.coconut a {
  background-image: url(/img/menu/coconut.png);
}
#container #menu ul li.dont-bother-me a {
  background-image: url(/img/menu/dont-bother-me.png);
}
#container #menu ul li.baby-turtle a {
  background-image: url(/img/menu/baby-turtle.png);
}
#container #menu ul li.shakin-dance a {
  background-image: url(/img/menu/shakin-dance-idle.png);
}
#container #menu ul li.shakin-dance a:hover,
#container #menu ul li.shakin-dance a.active {
  background-image: url(/img/menu/shakin-dance.png);
}
#container #menu ul li.veggie-garden a {
  background-image: url(/img/menu/veggie-garden.png);
}
#container #menu ul li.space-rocket a {
  background-image: url(/img/menu/space-rocket.png);
}
#container #menu ul li.live-show a {
  background-image: url(/img/menu/live-show.png);
}
#footer ul {
  margin: 0px auto;
  width: 252px;
  height: 53px;
  padding-left: 35px;
}
#footer ul li {
  float: left;
  margin-right: 35px;
}
#footer ul li a {
  position: relative;
  display: block;
  width: 49px;
  height: 47px;
  text-indent: -1000000px;
  background-image: url(/img/footer-links.png);
  background-repeat: no-repeat;
}
#footer ul li a:hover {
  top: -2px;
}
#footer ul li.social a {
  background-position: 0px 0px;
}
#footer ul li.shop a {
  background-position: -70px 0px;
}
#footer ul li.contact a {
  background-position: -140px 0px;
}
