/* CSS Document
Use for:    hbq.99.com
Version:    1.0
Date:        2015-06-16 09:49:52
Author:     Bingyu Yuan
Update:      
*/

/************************************
* animate
*************************************/
/* animate slideInLeft*/
@keyframes slideInLeft {
	0% {-webkit-transform: translateX(-100%);transform: translateX(-100%);-o-transform: translateX(-100%);-moz-transform: translateX(-100%);visibility: visible;}
	100% { -webkit-transform: translateX(0);transform: translateX(0);-o-transform: translateX(0);-moz-transform: translateX(0);}
}
@-webkit-keyframes slideInLeft {
	0% {-webkit-transform: translateX(-100%);transform: translateX(-100%);-o-transform: translateX(-100%);-moz-transform: translateX(-100%);visibility: visible;}
	100% { -webkit-transform: translateX(0);transform: translateX(0);-o-transform: translateX(0);-moz-transform: translateX(0);}
}
@-o-keyframes slideInLeft {
	0% {-webkit-transform: translateX(-100%);transform: translateX(-100%);-o-transform: translateX(-100%);-moz-transform: translateX(-100%);visibility: visible;}
	100% { -webkit-transform: translateX(0);transform: translateX(0);-o-transform: translateX(0);-moz-transform: translateX(0);}
}
@-moz-keyframes slideInLeft {
	0% {-webkit-transform: translateX(-100%);transform: translateX(-100%);-o-transform: translateX(-100%);-moz-transform: translateX(-100%);visibility: visible;}
	100% { -webkit-transform: translateX(0);transform: translateX(0);-o-transform: translateX(0);-moz-transform: translateX(0);}
}
/* animate slideInRight*/
@keyframes slideInRight {
	0% {-webkit-transform: translateX(100%);transform: translateX(100%);-o-transform: translateX(100%);-moz-transform: translateX(100%);visibility: visible;}
	100% { -webkit-transform: translateX(0);transform: translateX(0);-o-transform: translateX(0);-moz-transform: translateX(0);}
}
@-webkit-keyframes slideInRight {
	0% {-webkit-transform: translateX(100%);transform: translateX(100%);-o-transform: translateX(100%);-moz-transform: translateX(100%);visibility: visible;}
	100% { -webkit-transform: translateX(0);transform: translateX(0);-o-transform: translateX(0);-moz-transform: translateX(0);}
}
@-o-keyframes slideInRight {
	0% {-webkit-transform: translateX(100%);transform: translateX(100%);-o-transform: translateX(100%);-moz-transform: translateX(100%);visibility: visible;}
	100% { -webkit-transform: translateX(0);transform: translateX(0);-o-transform: translateX(0);-moz-transform: translateX(0);}
}
@-moz-keyframes slideInRight {
	0% {-webkit-transform: translateX(100%);transform: translateX(100%);-o-transform: translateX(100%);-moz-transform: translateX(100%);visibility: visible;}
	100% { -webkit-transform: translateX(0);transform: translateX(0);-o-transform: translateX(0);-moz-transform: translateX(0);}
}


/*bn-icon*/
@-o-keyframes bn-icon{
	from{transform:scale(0);-webkit-transform:scale(0);-o-transform:scale(0);-moz-transform:scale(0);}
	to{transform:scale(1);-webkit0transform:scale(1);-o-transform:scale(1);-moz-transform:scale(1);}
}
@-webkit-keyframes bn-icon{
	from{transform:scale(0);-webkit-transform:scale(0);-o-transform:scale(0);-moz-transform:scale(0);}
	to{transform:scale(1);-webkit0transform:scale(1);-o-transform:scale(1);-moz-transform:scale(1);}
}
@-webkit-keyframes bn-icon{
	from{transform:scale(0);-webkit-transform:scale(0);-o-transform:scale(0);-moz-transform:scale(0);}
	to{transform:scale(1);-webkit0transform:scale(1);-o-transform:scale(1);-moz-transform:scale(1);}
}
@keyframes bn-icon{
	from{transform:scale(0);-webkit-transform:scale(0);-o-transform:scale(0);-moz-transform:scale(0);}
	to{transform:scale(1);-webkit0transform:scale(1);-o-transform:scale(1);-moz-transform:scale(1);}
}
/*fadeIn*/
@-webkit-keyframes fadeIn {
	0% {opacity: 0;}
	100% {opacity: 1;}
}

@keyframes fadeIn {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@-moz-keyframes fadeIn {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@-o-keyframes fadeIn {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
.fadeIn {-webkit-animation-name: fadeIn; animation-name: fadeIn;-o-animation-name: fadeIn;-moz-animation-name: fadeIn;}

/*fadeOut*/
@-webkit-keyframes fadeOut {
	0% {opacity: 1;}
	100% {opacity: 0;}
}

@keyframes fadeOut {
	0% {opacity: 1;}
	100% {opacity: 0;}
}

@-o-keyframes fadeOut {
	0% {opacity: 1;}
	100% {opacity: 0;}
}

@-moz-keyframes fadeOut {
	0% {opacity: 1;}
	100% {opacity: 0;}
}

.fadeOut {-webkit-animation-name: fadeOut; animation-name: fadeOut;-o-animation-name: fadeOut;-moz-animation-name: fadeOut;}