#banner{
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		-webkit-font-smoothing: antialiased !important;
		
    	text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
        width: 728px;
        height: 90px;
        position: relative;
        cursor: pointer;
        overflow: hidden;
		left: -8px;
		top:-8px;
		-webkit-backface-visibility: hidden;
  		-moz-backface-visibility:    hidden;
  		-ms-backface-visibility:     hidden;
		font-family: 'Oswald', sans-serif;
		background: -webkit-radial-gradient(circle,#51baf7, #001a55); /* For Safari 5.1 to 6.0 */
		background: -o-radial-gradient(circle,#51baf7, #001a55); /* For Opera 11.1 to 12.0 */
		background: -moz-radial-gradient(circle,#51baf7, #001a55); /* For Firefox 3.6 to 15 */
		background: radial-gradient(circle,#51baf7, #001a55); /* Standard syntax (must be last) */
    }
    
    #banner img, #banner div{
     	position: absolute;
        opacity: 0;
		font-family: Oswald;
		font-weight: normal;
    }
    
    #banner div {
        text-align: center;
		text-shadow: 0.5px 0.5px 3px #000;
    }
	
	#banner #designGuide{
		  top:0px;
		  left:0px;
		  width:100%;
          height:100%;	
		  opacity: 0;
		  z-index: 1;
	}	

	#banner #background{
		  top:0px;
		  left:0px;
		  width:100%;
          height:100%;	
		  background: url(assets/numbers.svg) left center; 
		  z-index: 1;
		  opacity: 0.2;
	   }	

	#banner #cat {
		right:360px;
		height:141px;
		width:128px;
		top:-22px;
		background: url(assets/cat.png) left center; 
		z-index: 3;
		-ms-transform: scale(1.1,1.1); /* IE 9 */
    	-webkit-transform: scale(0.3,0.3); /* Safari */
    	transform: scale(0.6,0.6);
		opacity: 0;
	}
	
	#banner #catText {
		  top:10px;
		  left:50px;
		  text-align: center;
		  width:100%;
		  color:#fff;
	      font-size: 44px;
		  z-index: 4;
		  opacity: 0;
	}
	
	#banner #video {
		right:275px;
		height:98px;
		width:84px;
		top:4px;
		background: url(assets/cassette.svg) left center; 
		z-index: 120;
		-ms-transform: scale(0.9,0.9); /* IE 9 */
    	-webkit-transform: scale(0.9,0.9); /* Safari */
    	transform: scale(0.9,0.9);
		opacity: 0;
	}
	
	#banner #videoText {
		  top:10px;
		  left:155px;
		  text-align: center;
		  width:100%;
		  color:#fff;
	      font-size: 44px;
		  opacity: 0;
		  z-index: 1120;
	}
	
	#banner #arrow {
		position: absolute;
		width:95px;
        height: 85px;
        top:-6px;  
        left:436px;
		-ms-transform: scale(0.8,0.8); /* IE 9 */
    	-webkit-transform: scale(0.8,0.8); /* Safari */
    	transform: scale(0.8,0.8);
		background: url(assets/arrow_sprite.png) left center; 
		background-position: 0px;
		-webkit-animation: playArrow 1s steps(20) infinite;
		animation: playArrow 1s steps(20) infinite;
        z-index: 5;
		opacity:0;
    }
	
	@-webkit-keyframes playArrow {
		from { background-position: 0px; }
		to { background-position: -1900px; }
	}

	@-moz-keyframes playArrow {
		from { background-position: 0px; }
		to { background-position: -1900px; }
	}

	@keyframes playArrow {
		from { background-position: 0px; }
		to { background-position: -1900px; }
	}


	#banner #stockMarket {
		right:90px;
		height:109px;
		width:112px;
		top:10px;
		background: url(assets/stock.svg) left center; 
		z-index: 120;
		-ms-transform: scale(0.9,0.9); /* IE 9 */
    	-webkit-transform: scale(0.9,0.9); /* Safari */
    	transform: scale(0.9,0.9);
		opacity: 0;
	}

	#banner #stockMarketText {
		  top:20px;
		  right: -305px;
		  text-align: center;
		  width:100%;
		  color:#fff;
	      font-size: 25px;
		  line-height: 25px;
		  z-index: 121;
		  opacity: 0;
	}
	
	#banner #electricty {
		position: absolute;
		width:300px;
        height: 120px;
        top:-30px;  
        left:140px;
		-ms-transform: scale(0.9,0.9); /* IE 9 */
    	-webkit-transform: scale(0.9,0.9); /* Safari */
    	transform: scale(0.7,0.7);
		background: url(assets/spriteanimation_lightv2.png) left center; 
		background-position: 0px;
		-webkit-animation: play 0.4s steps(6) infinite; /* Chrome, Safari, Opera */ 
		animation: play 0.4s steps(6) infinite;
        z-index: 2;
		opacity:0;
    }
	
	@-webkit-keyframes play {
		from { background-position: 0px; }
		to { background-position: -1800px; }
	}

	@-moz-keyframes play {
		from { background-position: 0px; }
		to { background-position: -1800px; }
	}

	@keyframes play {
		from { background-position: 0px; }
		to { background-position: -1800px; }
	}

	#banner #sparkle {
		position: absolute;
		width:95px;
        height: 85px;
        top:26px;  
        left:286px;
		-ms-transform: scale(0.8,0.8); /* IE 9 */
    	-webkit-transform: scale(0.8,0.8); /* Safari */
    	transform: scale(0.8,0.8);
		background: url(assets/arrow_sprite1.png) left center; 
		background-position: 0px;
		-webkit-animation: playArrow 1s steps(20) infinite;
		animation: playArrow 1s steps(20) infinite;
        z-index: 5;
		opacity:0;
    }

	#banner #sparkleone {
		position: absolute;
		width:146px;
        height: 90px;
        top:0px;  
        left:0px;
		background: url(assets/panel.svg) left center; 
        z-index: 12;
		opacity:0;

    }


	
	#banner #felixLogo {
		position: absolute;
		width:127px;
        height: 90px;
        top:0px;  
        left:0px;
		background-image: url(assets/felixLogo.svg); 
		-ms-transform: scale(0.8,0.8); /* IE 9 */
    	-webkit-transform: scale(0.8,0.8); /* Safari */
    	transform: scale(0.8,0.8);
        z-index: 100;
		opacity:0;
    }

	#banner #lastPageText {
		  top:25px;
		  text-align: center;
		  width:100%;
		  color:#fff;
		  line-height: 22px;
	      font-size: 16px;
		  z-index: 200;
		  opacity: 0;
	}

 	#banner #strokeOutline{
		z-index: 99;
		position: absolute;
		opacity: 1;
		width: 726px;
		height: 88px;
		border:solid 1px black;
	}

    #banner #cta{
		width: 180px;
		right:15px;
		text-align: center;
	  	margin: auto;
	    font-size: 18px;
	    color: #fff;
		padding:6px 0px;
		background: url("assets/shimmer.png") left center, -webkit-linear-gradient(#ff0d1b, #d60814,#9a0710, #9a0710 ); /* For Safari 5.1 to 6.0 */
		background: url("assets/shimmer.png") left center, -o-linear-gradient(#ff0d1b, #d60814,#9a0710,#9a0710 ); /* For Opera 11.1 to 12.0 */
		background: url("assets/shimmer.png") left center, -moz-linear-gradient(#ff0d1b, #d60814,#9a0710,#9a0710 ); /* For Firefox 3.6 to 15 */
		background: url("assets/shimmer.png") repeat,  linear-gradient(#ff0d1b, #d60814,#9a0710, #9a0710);
		box-shadow: 1px 1px 3px #000;
		
		animation-timing-function: ease-in-out;
		
		-webkit-animation: playShimmer 0.8s steps(54) 32;
		animation: playShimmer 0.8s steps(54) 32;
		
		
		-webkit-animation-delay:4s; /* Chrome, Safari, Opera */
        animation-delay: 4;
		
		-webkit-border-radius:14px;
        border-radius:14px;
		cursor: pointer;
		opacity: 0;
		z-index: 22300;
		bottom:25px;
		z-index: 912229;
    }
	
	@-webkit-keyframes playShimmer {
		from { background-position: 0px; }
		to { background-position: -416px; }
	}

	@-moz-keyframes playShimmer {
		from { background-position: 0px; }
		to { background-position: -416px; }
	}

	@keyframes playShimmer {
		from { background-position: -416px; }
		to { background-position: 0px; }
	}


    #banner:hover #cta{
        background: url("assets/shimmer.png") left center, -webkit-linear-gradient(#9a0710, #9a0710,#d60814, #ff0d1b); /* For Safari 5.1 to 6.0 */
		background: url("assets/shimmer.png") left center, -o-linear-gradient(#9a0710, #9a0710,#d60814, #ff0d1b); /* For Opera 11.1 to 12.0 */
		background: url("assets/shimmer.png") left center, -moz-linear-gradient(#9a0710, #9a0710,#d60814, #ff0d1b); /* For Firefox 3.6 to 15 */
		background: url("assets/shimmer.png") left center, linear-gradient(#9a0710, #9a0710,#d60814, #ff0d1b); /* Standard syntax (must be last) */
        color: white;
    }

     #banner #bgexit {
         opacity: 1;
         cursor: pointer;
         z-index: 2101;
         width: 100%;
         height: 100%;
     }