#banner{
		-webkit-font-smoothing: antialiased;
    	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;
		background: -webkit-linear-gradient(#dddcdb, #ffffff,#ffffff, #dddcdb); /* For Safari 5.1 to 6.0 */
		background: -o-linear-gradient(#dddcdb, #ffffff,#ffffff,#dddcdb); /* For Opera 11.1 to 12.0 */
		background: -moz-linear-gradient(#dddcdb, #ffffff,#ffffff,#dddcdb); /* For Firefox 3.6 to 15 */
		background: linear-gradient(#dddcdb, #ffffff,#ffffff, #dddcdb); /* Standard syntax (must be last) */
		font-family: 'Signika Negative', sans-serif;
    }
    
    #banner img, #banner div{
     	position: absolute;
        opacity: 0;
    }
    
    #banner div {
        text-align: center;
        /*top:170px;*/ 
        /*width: 280px;*/ 
        /*margin-left:10px;*/  
    }

	   #banner #backgroundColor{
		  top:-670px;
		  left:-670px;
		  width: 550px;
          height: 550px;
		  -ms-transform: scale(3,3); /* IE 9 */
    	  -webkit-transform: scale(3,3); /* Safari */
    	  transform: scale(3,3);	
		  background: url(assets/greencover.svg) left center; 
		  opacity: 1;
	   }

	  	#banner #backgroundColorTwo{
		  top:-670px;
		  left:-670px;
		  width: 550px;
          height: 550px;
		  -ms-transform: scale(3,3); /* IE 9 */
    	  -webkit-transform: scale(3,3); /* Safari */
    	  transform: scale(3,3);
		  background: url(assets/redcover.svg) left center; 
		  opacity: 1;
	   }
	
	   #banner #backgroundColorThree{
		  top:-670px;
		  left:-670px;
		  width: 550px;
          height: 550px;
		  -ms-transform: scale(3,3); /* IE 9 */
    	  -webkit-transform: scale(3,3); /* Safari */
    	  transform: scale(3,3);
		  background: url(assets/greencovertwo.svg) left center; 
		  opacity: 1;
	   }

  #banner #text1{
	   	top:5px;
	   	left: 108px;
	    color: #fff;
        font-size: 26px;
	    z-index: 4;
	    background: #1e786c;
        padding:3px 5px 3px 5px;
	    text-align: right;
   }
	
   #banner #text2{
	   	top:46px;
	   	left: 108px;
	    color: #fff;
        font-size: 26px;
	    z-index: 4;
	    background: #1e786c;
        padding:3px 5px 3px 5px;
	    text-align: right;
   }
	
      #banner #text2Next{
	   	top:146px;
	   	left: 191px;
	    color: #fff;
        font-size: 26px;
	    z-index: 4;
	    width: 98px;
	    background: #1e786c;
        padding:2px 11px 5px 0px;
	    text-align: right;
   }

	#banner #characterOne{
		height:143px;
		width:99px;
		top:5px;
		background: url(assets/chicken.svg) left center; 
		z-index: 1;
		opacity: 1;
		left:325px;
		-ms-transform: scale(1,1); /* IE 9 */
    	-webkit-transform: scale(1,1); /* Safari */
    	transform: scale(1,1);	
	}

	#banner #characterTwo{
		left:405px;
		height:98px;
		width:140px;
		top:5px;
		-ms-transform: scale(0.5,0.5); /* IE 9 */
    	-webkit-transform: scale(0.5,0.5); /* Safari */
    	transform: scale(0.5,0.5);	
		background: url(assets/teddy.svg) left center; 
		z-index: 5;
		opacity: 1;
	}

	#banner #characterThree{
		top:0px;
		left:-20px;
		height:109px;
		width:224px;
		-ms-transform: scale(1.1,1.1); /* IE 9 */
    	-webkit-transform: scale(1.1,1.1); /* Safari */
    	transform: scale(1.1,1.1);	
		-webkit-backface-visibility: hidden;
		background: url(assets/arm.svg) left center; 
		z-index: 5;
	}
	
	#banner #characterFour{
		top:-80px;
		left:37px;
		height:250px;
		width:300px;
		-ms-transform: scale(0.1,0.1); /* IE 9 */
    	-webkit-transform: scale(0.1,0.1); /* Safari */
    	transform: scale(0.1,0.1);	
		-webkit-backface-visibility: hidden;
		background: url(assets/coin.svg) left center; 
		z-index: 5;
	}
	
	#banner #characterFive{
		top:-87px;
		left:37px;
		height:250px;
		width:300px;
		-ms-transform: scale(0.1,0.1); /* IE 9 */
    	-webkit-transform: scale(0.1,0.1); /* Safari */
    	transform: scale(0.1,0.1);	
		-webkit-backface-visibility: hidden;
		background: url(assets/coin.svg) left center; 
		z-index: 5;
	}

	#banner #characterSix{
		top:-92px;
		left:34px;
		height:250px;
		width:300px;
		-ms-transform: scale(0.1,0.1); /* IE 9 */
    	-webkit-transform: scale(0.1,0.1); /* Safari */
    	transform: scale(0.1,0.1);	
		-webkit-backface-visibility: hidden;
		background: url(assets/coin.svg) left center; 
		z-index: 5;
	}
	
	#banner #characterSeven{
		top:0px;
		left:-30px;
		height:95px;
		width:82px;
		background: url(assets/triangle1.svg) left center; 
		z-index: 10;
		opacity: 1;
	}
	
	#banner #characterEight{
		left:59px;
		top:-5px;
		height:24px;
		width:55px;
		background: url(assets/triangle2.svg) left center; 
		z-index: 9;
		opacity: 1;
		-ms-transform: scale(0.6,0.6); /* IE 9 */
    	-webkit-transform: scale(0.6,0.6); /* Safari */
    	transform: scale(0.6,0.6);	
	}
	
   #banner #text3{
	   	top:5px;
	   	left: 218px;
	    color: #fff;
        font-size: 26px;
	    z-index: 4;
	    background: #1e786c;
        padding:3px 5px 3px 5px;
	    text-align: right;
   }
	
   #banner #text4{
	   	top:46px;
	   	left: 218px;
	    color: #fff;
        font-size: 26px;
	    z-index: 4;
	    background: #1e786c;
        padding:3px 5px 3px 5px;
	    text-align: right;
   }

   #banner #text5{
	   	top:144px;
	   	left: 215px;
	    color: #fff;
        font-size: 25px;
	    z-index: 4;
	    width: 75px;
	    background: #1e786c;
        padding:2px 11px 2px 0px;
	    text-align: right;
   }
	
   #banner #text6{
	   	top:18px;
	    width: 100%;
	    color: #095050;
        font-size: 22px;
	    z-index: 4;
	    text-align: center;
	     opacity: 1;
	   	-ms-transform: scale(0,0); /* IE 9 */
    	-webkit-transform: scale(0,0); /* Safari */
    	transform: scale(0,0);
   }
	
   #banner #text7{
	   	top:43px;
	    width: 100%;
	    color: #095050;
        font-size: 22px;
	    z-index: 4;
	    text-align: center;
	    opacity: 1;
	   	-ms-transform: scale(0,0); /* IE 9 */
    	-webkit-transform: scale(0,0); /* Safari */
    	transform: scale(0,0); 
   }
	
   #banner #text8{
	   	top:55px;
	    width: 100%;
	    color: #095050;
        font-size: 22px;
	    z-index: 4;
	    text-align: center;
	    opacity: 1;
	   	-ms-transform: scale(0,0); /* IE 9 */
    	-webkit-transform: scale(0,0); /* Safari */
    	transform: scale(0,0);
   }
	
	 #banner #text9{
	   	top: 5px;
	    width: 100%;
	    color: #fff;
		left:105px;
        font-size: 12px;
	    z-index: 11114;
	    text-align: left;
	    opacity: 0;
   	}


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

	#banner #logoSmall {
		right:0px;
		height:43px;
		width:167px;
		top:0px;
		background: url(assets/CommunityLife_Life_LOGOsmall_german.svg) left center; 
		z-index: 20;
		-ms-transform: scale(1,1); /* IE 9 */
    	-webkit-transform: scale(1,1); /* Safari */
    	transform: scale(1,1);
		opacity: 1;
	}
	

    #banner #cta{
		position: absolute;
        font-size: 18px;
        text-align: center;
        background: #c53839;
        color: white;
        padding:6px 7px 8px 10px;
        bottom: 5px;
		font-weight: bold;
        right:-20px;
		z-index: 250;
		opacity: 1;
		-ms-transform: scale(0.7,0.7); /* IE 9 */
    	-webkit-transform: scale(0.7,0.7); /* Safari */
    	transform: scale(0.7,0.7);
    }
	
    #banner:hover #cta{
        background: #095050 ; 
        color: white;
    }

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