
#sequence {
  position: relative;
  min-height: 240px;
  max-width: 900px;
  min-width: 900px;
  margin: 0 auto;
  overflow: hidden;
  /*background: url(../images/bg-sky.png) repeat-x #65b7f1;*/
  color: white;
  font-family: 'Play', sans-serif; }
  #sequence > .sequence-canvas {
    height: 100%;
    width: 100%; }
    #sequence > .sequence-canvas > li {
      position: absolute;
      width: 100%;
      height: 100%;
      z-index: 1; }
    #sequence > .sequence-canvas li > * {
      position: absolute;
      -webkit-transition-timing-function: ease-in-out;
      -moz-transition-timing-function: ease-in-out;
      -ms-transition-timing-function: ease-in-out;
      -o-transition-timing-function: ease-in-out;
      transition-timing-function: ease-in-out; }
  #sequence .sequence-next,
  #sequence .sequence-prev {
    
    color: white;
    cursor: pointer;
    display: none;
    font-size: 80px;
    font-weight: bold;
    position: absolute;
    opacity: 0.4;
    top: 280px;
    height: 41px;
    width: 39px;
    z-index: 300;
    -webkit-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    -ms-transition-duration: 0.4s;
    -o-transition-duration: 0.4s;
    transition-duration: 0.4s; }
  #sequence .sequence-prev {
    left: 40px;top: 50%; }
  #sequence .sequence-next {
    right: 40px;top: 50%; }
  #sequence .sequence-next:hover,
  #sequence .sequence-prev:hover {
    opacity: 1;
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
    -webkit-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    -ms-transition-duration: 0.4s;
    -o-transition-duration: 0.4s;
    transition-duration: 0.4s; }
  #sequence h2 {
    font-size: 1.5em;
    line-height: 1.2em; }
  #sequence .info {
    
    font-size: 12px;
    right: 150%;
    line-height: 1.2em;
    top: 270px;
    width: 25%;
    z-index: 10;
    vertical-align: middle;
    -webkit-transition-duration: 4s;
    -moz-transition-duration: 4s;
    -ms-transition-duration: 4s;
    -o-transition-duration: 4s;
    transition-duration: 4s;
    -webkit-transition-property: right;
    -moz-transition-property: right;
    -ms-transition-property: right;
    -o-transition-property: right;
    transition-property: right;
	top: 0%;
  color: white;
  text-shadow:
   -1px -1px 0 #000,  
    1px -1px 0 #000,
    -1px 1px 0 #000,
     1px 1px 0 #000;}
  #sequence .animate-in .info {
    right: 15%;
    -webkit-transition-duration: 4s;
    -moz-transition-duration: 4s;
    -ms-transition-duration: 4s;
    -o-transition-duration: 4s;
    transition-duration: 4s; }
  #sequence .animate-out .info {
    right: -150%;
    -webkit-transition-duration: 4s;
    -moz-transition-duration: 4s;
    -ms-transition-duration: 4s;
    -o-transition-duration: 4s;
    transition-duration: 4s; }
	
	
	
  #sequence .balloon {left:-50%;top: 0%;max-width: 40%;z-index: 6;-webkit-transition-property: left top;
    -moz-transition-property: left top;-ms-transition-property: left top;-o-transition-property: left top;
    transition-property: left top; }
  #sequence .animate-in .balloon {left: 20%;top: 0px;-webkit-transition-duration: 4s;
    -moz-transition-duration: 4s;-ms-transition-duration: 4s;-o-transition-duration: 4s;
    transition-duration: 4s;z-index: 4; }
  #sequence .animate-out .balloon { left: -50%;top:0px;z-index: 2;-webkit-transition-duration: 4s;
    -moz-transition-duration: 4s;-ms-transition-duration: 4s;-o-transition-duration: 4s;
    transition-duration: 4s; }  
	
	
#sequence .Engeneer1 {top: 100%;max-width: 40%;z-index: 6;-webkit-transition-property: left top;
    -moz-transition-property: left top;-ms-transition-property: left top;-o-transition-property: left top;
    transition-property: left top;right:0; }
#sequence .animate-in .Engeneer1 {top: 0px;-webkit-transition-duration: 4s;
    -moz-transition-duration: 4s;-ms-transition-duration: 4s;-o-transition-duration: 4s;
    transition-duration: 4s;z-index: 4; }
#sequence .animate-out .Engeneer1 {top: -900px;z-index: 2;-webkit-transition-duration: 4s;
    -moz-transition-duration: 4s;-ms-transition-duration: 4s;-o-transition-duration: 4s;
    transition-duration: 4s;right: -100%;top: 0px;}


#sequence .Engeneer2 {top: 100%;max-width: 40%;z-index: 6;-webkit-transition-property: left top;
    -moz-transition-property: left top;-ms-transition-property: left top;-o-transition-property: left top;
    transition-property: left top;right:0; }
#sequence .animate-in .Engeneer2 {top: 0px;-webkit-transition-duration: 4s;
    -moz-transition-duration: 4s;-ms-transition-duration: 4s;-o-transition-duration: 4s;
    transition-duration: 4s;z-index: 4; }
#sequence .animate-out .Engeneer2 {top: -900px;z-index: 2;-webkit-transition-duration: 4s;
    -moz-transition-duration: 4s;-ms-transition-duration: 4s;-o-transition-duration: 4s;
    transition-duration: 4s;right: 0;top:100%; }
	
	
	
  #sequence .aeroplane {left: -50%; max-width: 40%;top: 800px;z-index: 6;
webkit-transition-property: left top -webkit-transform;
-moz-transition-property: left top -moz-transform;
    -o-transition-property: left top -o-transform;
	-ms-transition-property: left top -ms-transform;
    transition-property: left top transform; }
  #sequence .animate-in .aeroplane {left: 10%;top: 50px;-webkit-transition-duration: 4s;
    -moz-transition-duration: 4s;-ms-transition-duration: 4s;
	/*
    -o-transition-duration: 4s;transition-duration: 4s;-webkit-transform: rotate(20deg);
    -moz-transform: rotate(20deg);-ms-transform: rotate(20deg);-o-transform: rotate(20deg);transform: rotate(20deg);
	*/
    z-index: 4; }
  #sequence .animate-out .aeroplane {left: 70%;top: -900px;-webkit-transition-duration: 4s;
    -moz-transition-duration: 4s; -ms-transition-duration: 4s;-o-transition-duration: 4s;
    transition-duration: 4s;-webkit-transform: rotate(40deg);-moz-transform: rotate(40deg);
    -ms-transform: rotate(40deg);-o-transform: rotate(40deg);transform: rotate(40deg);z-index: 2; }
	
  #sequence .sky {
    height: auto;
    width: 100%;
    left: -6%;
    opacity: 0;
    top: 0;
    vertical-align: middle;
    z-index: 1;
    -webkit-transition-property: left top;
    -moz-transition-property: left top;
    -ms-transition-property: left top;
    -o-transition-property: left top;
    transition-property: left top; }
  #sequence .animate-in .sky {
    left: 0%;
    opacity: 1;
    top: 0;
    z-index: 1;
    -webkit-transition-duration: 4s;
    -moz-transition-duration: 4s;
    -ms-transition-duration: 4s;
    -o-transition-duration: 4s;
    transition-duration: 4s; }
  #sequence .animate-out .sky {
    left: 6%;
    opacity: 0;
    top: 0;
    z-index: 1;
    -webkit-transition-duration: 4s;
    -moz-transition-duration: 4s;
    -ms-transition-duration: 4s;
    -o-transition-duration: 4s;
    transition-duration: 4s; }
	
	
  #sequence .kite {left:-150%;top: 0%;max-width: 900px;z-index: 6;-webkit-transition-property: left top;
    -moz-transition-property: left top;-ms-transition-property: left top;-o-transition-property: left top;
    transition-property: left top;width:900px; }
  #sequence .animate-in .kite {left:0%;top: 0px;-webkit-transition-duration: 4s;
    -moz-transition-duration: 4s;-ms-transition-duration: 4s;-o-transition-duration: 4s;
    transition-duration: 4s;z-index: 4; }
  #sequence .animate-out .kite { left: -100%;top:0px;z-index: 2;-webkit-transition-duration: 4s;
    -moz-transition-duration: 4s;-ms-transition-duration: 4s;-o-transition-duration: 4s;
    transition-duration: 4s; }  
