


.boxedcontainer		{	max-width: 100%; margin:auto; padding:0px 0px;}

/*********************************************
	-	SETTINGS FOR BANNER CONTAINERS	-
**********************************************/

.tp-banner-container{
	width:100%;
	position:relative;
	padding:0;

}

.tp-banner{
	width:100%;
	position:relative;
}

.tp-banner-fullscreen-container {
		width:100%;
		position:relative;
		padding:0;
}














.bar {
	height:20px;
	background:#cccccc;
	color:#f4f4f4;
	text-align:center;
	width:100%;
}
.level {
	height:20px;
	background:#aae0aa;
    width:100%;
}
.eighty.start {
	width: 0px;
	background: #aae0aa;
	-webkit-animation: eighty 2s ease-out forwards;
	   -moz-animation: eighty 2s ease-out forwards;
	    -ms-animation: eighty 2s ease-out forwards;
	     -o-animation: eighty 2s ease-out forwards;
	        animation: eighty 2s ease-out forwards;
}
@-moz-keyframes eighty {
    0% {
        width: 0px;
    }

    100% {
        width: 100%;
    }
}
@-webkit-keyframes eighty {
	0% {
	    width: 0px;
	}

	100% {
	    width: 100%;
	}
}




.bar2 {
	height:20px;
	background:#cccccc;
	color:#f4f4f4;
	text-align:center;
	width:100%;
}
.level2 {
	height:20px;
	background:#aae0aa;
    width:80%;
}
.eighty2.start {
	width: 0px;
	background: #aae0aa;
	-webkit-animation: eighty2 2s ease-out forwards;
	   -moz-animation: eighty2 2s ease-out forwards;
	    -ms-animation: eighty2 2s ease-out forwards;
	     -o-animation: eighty2 2s ease-out forwards;
	        animation: eighty2 2s ease-out forwards;
}
@-moz-keyframes eighty2 {
    0% {
        width: 0px;
    }

    100% {
        width: 80%;
    }
}
@-webkit-keyframes eighty2 {
	0% {
	    width: 0px;
	}

	100% {
	    width: 80%;
	}
}

/*
.easeout.start {
	-webkit-animation: easeout 0.3s ease-out forwards;
	   -moz-animation: easeout 0.3s ease-out forwards;
	    -ms-animation: easeout 0.3s ease-out forwards;
	     -o-animation: easeout 0.3s ease-out forwards;
	        animation: easeout 0.3s ease-out forwards;
}
@-moz-keyframes easeout {
    70% {
        width: 0px;
		left:-100px;
		opacity: 0;
    }
    100% {
        width: 15%;
		opacity: 1;
    }
}
@-webkit-keyframes easeout {
  70% {
        width: 0px;
		left:-100px;
		opacity: 0;
    }
    100% {
        width: 15%;
		opacity: 1;
    }
}
*/




.easeout.start {
	-webkit-animation: easeout 1s linear;
	   -moz-animation: easeout 1s linear;
	    -ms-animation: easeout 1s linear;
	     -o-animation: easeout 1s linear;
	        animation: easeout 1s linear;
}
@-moz-keyframes easeout {
 0%{ 
 transform: translateX(-200%); 
 opacity: 0;		
 }
 70% { 
 transform: translateX(20%); 
 opacity: 1;
 }
 90% { 
 transform: translateX(-20%); 
 opacity: 1;
 }
  100% { 
 transform: translateX(0%); 
 opacity: 1;
 }
}
@-webkit-keyframes easeout {
 0%{ 
 transform: translateX(-200%); 
 opacity: 0;		
 }
 70% { 
 transform: translateX(20%); 
 opacity: 1;
 }
 90% { 
 transform: translateX(-20%); 
 opacity: 1;
 }
  100% { 
 transform: translateX(0%); 
 opacity: 1;
 }
}





.easein.start {
	-webkit-animation: easein 0.3s linear;
	   -moz-animation: easein 0.3s linear;
	    -ms-animation: easein 0.3s linear;
	     -o-animation: easein 0.3s linear;
	        animation: easein 0.3s linear;
}
@-moz-keyframes easein {
 0%{ 
 transform: translateX(200%); 
 opacity: 0;		
 }
 70% { 
 transform: translateX(-20%); 
 opacity: 1;
 }
 90% { 
 transform: translateX(20%); 
 opacity: 1;
 }
  100% { 
 transform: translateX(0%); 
 opacity: 1;
 }
}
@-webkit-keyframes easein {
 0%{ 
 transform: translateX(200%); 
 opacity: 0;		
 }
 70% { 
 transform: translateX(-20%); 
 opacity: 1;
 }
 90% { 
 transform: translateX(20%); 
 opacity: 1;
 }
  100% { 
 transform: translateX(0%); 
 opacity: 1;
 }

}






.bouncein.start {
	-webkit-animation: bouncein 0.5s ease-out forwards;
	   -moz-animation: bouncein 0.5s ease-out forwards;
	    -ms-animation: bouncein 0.5s ease-out forwards;
	     -o-animation: bouncein 0.5s ease-out forwards;
	        animation: bouncein 0.5s ease-out forwards;
}
@-moz-keyframes bouncein {
0% {
    transform: scale(0.1);
    opacity: 0;
  }
  30% {
    transform: scale(1.3);
    opacity: 1;
  }
   50% {
    transform: scale(0.8);
    opacity: 1;
  }
    70% {
    transform: scale(1.3);
    opacity: 1;
  }
   80% {
    transform: scale(0.8);
    opacity: 1;
  }
  100% {
    transform: scale(1);
  }
}
@-webkit-keyframes bouncein {
0% {
    transform: scale(0.1);
    opacity: 0;
  }
  30% {
    transform: scale(1.3);
    opacity: 1;
  }
   50% {
    transform: scale(0.8);
    opacity: 1;
  }
    70% {
    transform: scale(1.3);
    opacity: 1;
  }
   80% {
    transform: scale(0.8);
    opacity: 1;
  }
  100% {
    transform: scale(1);
  }
}







.bouncein2.start {
	-webkit-animation: bouncein2 1s ease-out forwards;
	   -moz-animation: bouncein2 1s ease-out forwards;
	    -ms-animation: bouncein2 1s ease-out forwards;
	     -o-animation: bouncein2 1s ease-out forwards;
	        animation: bouncein2 1s ease-out forwards;
}
@-moz-keyframes bouncein2 {
0% {
    transform: scale(0.1);
    opacity: 0;
  }
  60% {
    transform: scale(1.5);
    opacity: 1;
  }
  100% {
    transform: scale(1);
  }
}
@-webkit-keyframes bouncein2 {
0% {
    transform: scale(0.1);
    opacity: 0;
  }
  60% {
    transform: scale(1.5);
    opacity: 1;
  }
  100% {
    transform: scale(1);
  }
}





.bouncein1.start {
	-webkit-animation: bouncein1 0.1s ease-out forwards;
	   -moz-animation: bouncein1 0.1s ease-out forwards;
	    -ms-animation: bouncein1 0.1s ease-out forwards;
	     -o-animation: bouncein1 0.1s ease-out forwards;
	        animation: bouncein1 0.1s ease-out forwards;
}
@-moz-keyframes bouncein1 {
0%, 100% {-webkit-transform: translateX(0);} 
            10%, 30%, 50%, 70%, 90% {-webkit-transform: translateX(-40px);} 
            20%, 40%, 60%, 80% {-webkit-transform: translateX(40px);} 
}
@-webkit-keyframes bouncein1 {
0%, 100% {-webkit-transform: translateX(0);} 
            10%, 30%, 50%, 70%, 90% {-webkit-transform: translateX(-40px);} 
            20%, 40%, 60%, 80% {-webkit-transform: translateX(40px);} 
}





.updown.start {
	-webkit-animation: updown 0.4s ease-out;
	   -moz-animation: updown 0.4s ease-out;
	    -ms-animation: updown 0.4s ease-out;
	     -o-animation: updown 0.4s ease-out;
	        animation: updown 0.4s ease-out;
}
@-moz-keyframes updown {
 0%   { 
 transform: translateY(200%); 		
 }
 100% { 
 transform: translateY(0%); 
 }
}
@-webkit-keyframes updown {
 0%   { 
 transform: translateY(200%); 		
 }
 100% { 
 transform: translateY(0%); 
 }
}

