body, body * {
	vertical-align: baseline;
	border: 0;
	outline: 0;
	padding: 0;
	margin: 0;
}

body {
  max-height: 480px;
	max-width: 320px;
	overflow: hidden;
}

button {
	cursor: pointer;
	-moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
}

* {box-sizing: border-box;}

#content {
  background: url('images/background.jpg') no-repeat;
  border: 1px solid #000;
  height: 480px;
  overflow: hidden;
  position: absolute;
  width: 320px;
}

#content img {
  position: absolute;
  /*transition: top 1s;*/
}

#moose {
	left: -242px;
	top: 60px;
}

#bag {
  left: -65px;
  top: 86px;
}

#hat {
  left: 46px;
  top: 227px;
}

#bottle {
	left: 45px;
	top: 185px;
}

#candy-bar {
	left: 200px;
	top: 282px;
}

#glove {
	left: 13px;
	top: 291px;
}

#watch {
	left: 243px;
	top: 275px;
	width: 70px;
	height: auto;
}

#bag.staying,
#hat.staying {
	left: 320px!important;
}

#shoe {
  bottom: 0;
  left: 0;
	/*display: none;*/
}

.sliding-out {
	left: 320px!important;
}

#logo-box {
  background-color: #f47a1f;
  height: 52px;
  /*position: absolute;*/
  width: 100%;
}

#logo {
  left: 99px;
  top: 15px;
}

#logo.staying {
	left: 100px!important;
	/*transition: left 1s;*/
}

#gradient {
  background-color: #000;
  height: 339px;
  opacity: 0.3;
  transition: opacity 1s linear;
  width: 320px;
}

#gradient.final-frame {
  opacity: 0.3!important;
  /*position: absolute;*/
}

#tilt-left-right {
	left: 110px;
	top: 233px;
	transition: opacity 1s linear;
}

#headline {
  left: 10px;
  top: 99px;
  transition: transform 1s linear;
}

#headline-2 {
  display: none;
  left: 320px;
  top: 99px;
  /*transition: left 1s;*/
}

#lab {
  /*display: none;*/
  left: 320px;
  top: 79px;
}

#cta {
  /*background-color: #f47a1f;*/
  bottom:162px;
  /*display: none;*/
  /*height: 40px;*/
  left: 320px;
  /*padding: 10px 15px;*/
  position: absolute;
  text-align: center;
  width: 210px;
}

#cta a {
	background-color: #f47a1f;
	display: block;
	height: 100%;
	padding: 10px 15px;
  text-decoration: none;
	width: 100%;
}

#cta span {
  color: #fff;
  font-family: Oswald, Arial, sans-serif;
  font-size: 16px;
  /*font-weight: bold;*/
}

#bottom-bar {
  background-color: #f47a1f;
  bottom: 83px;
  height: 6px;
  position: absolute;
  width: 100%;
}

#product-name.staying {
	left: 0!important;
}

#artic-logo {
  bottom: 0;
  left: 257px;
}

#artic-logo.staying {
	left: 257px!important;
}

/*#close-btn {
  background: url('images/close.png') no-repeat;
  height: 22px;
  position: absolute;
  right: 5%;
  top: 25px;
  width: 64px;
  z-index: 200;
}*/

/* Animations */

@keyframes enterFrame {
  from {
    left: 320px;
  } to {
    left: 10px;
  }
}

@keyframes enterLab {
  from {
    left: 320px;
  } to {
    left: 93px;
  }
}

@keyframes enterCta {
  from {
    left: 320px;
  } to {
    left: 56px;
  }
}

@keyframes mooseSlideRight {
	from {
		left: -242px;
	} to {
		left: 320px;
	}
}
