


/*#logo{
position:relative;
animation-name:mymove;
animation-duration:10s;
-webkit-animation-name:mymove;
-webkit-animation-duration:2s;
}
#logo {
	-webkit-animation-name:logo;
	animation-name: logo;
}*/
/*从底部滑上来也可以*/
/*@keyframes logo
{
from {top:-100%;}
to {top:0px;}
}

@-webkit-keyframes logo
{
from {top:-100%;}
to {top:0px;}
}*/


/*#tel{
position:relative;
animation-name:mymove;
animation-duration:10s;
-webkit-animation-name:mymove;
-webkit-animation-duration:2s;
}
#tel {
	-webkit-animation-name:tel;
	animation-name: tel;
}*/
/*从底部滑上来也可以*/
/*@keyframes tel
{
from {right:-100%;}
to {right:0px;}
}

@-webkit-keyframes tel
{
from {right:-100%;}
to {right:0px;}
}*/



/*来自动画*/
.animated {
	-webkit-animation-duration: 2s;
	animation-duration: 2s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both
}
.animated.infinite {
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite
}
.animated.hinge {
	-webkit-animation-duration: 2s;
	animation-duration: 2s
}
.animated.flip {
	-webkit-backface-visibility: visible;
	-ms-backface-visibility: visible;
	backface-visibility: visible;
	-webkit-animation-name: flip;
	animation-name: flip
}

/*从左向右*/
@-webkit-keyframes fadeInLeft {
0% {
opacity:0;
-webkit-transform:translateX(-20px);
transform:translateX(-20px)
}
100% {
opacity:1;
-webkit-transform:translateX(0);
transform:translateX(0)
}
}
@keyframes fadeInLeft {
0% {
opacity:0;
-webkit-transform:translateX(-20px);
-ms-transform:translateX(-20px);
transform:translateX(-20px)
}
100% {
opacity:1;
-webkit-transform:translateX(0);
-ms-transform:translateX(0);
transform:translateX(0)
}
}
.fadeInLeft {
	-webkit-animation-name: fadeInLeft;
	animation-name: fadeInLeft
}
@-webkit-keyframes fadeInLeftBig {
0% {
opacity:0;
-webkit-transform:translateX(-2000px);
transform:translateX(-2000px)
}
100% {
opacity:1;
-webkit-transform:translateX(0);
transform:translateX(0)
}
}
@keyframes fadeInLeftBig {
0% {
opacity:0;
-webkit-transform:translateX(-2000px);
-ms-transform:translateX(-2000px);
transform:translateX(-2000px)
}
100% {
opacity:1;
-webkit-transform:translateX(0);
-ms-transform:translateX(0);
transform:translateX(0)
}
}
.fadeInLeftBig {
	-webkit-animation-name: fadeInLeftBig;
	animation-name: fadeInLeftBig
}

/*从右向左*/
@-webkit-keyframes fadeInRightBig {
0% {
opacity:0;
-webkit-transform:translateX(2000px);
transform:translateX(2000px)
}
100% {
opacity:1;
-webkit-transform:translateX(0);
transform:translateX(0)
}
}
@keyframes fadeInRightBig {
0% {
opacity:0;
-webkit-transform:translateX(2000px);
-ms-transform:translateX(2000px);
transform:translateX(2000px)
}
100% {
opacity:1;
-webkit-transform:translateX(0);
-ms-transform:translateX(0);
transform:translateX(0)
}
}
.fadeInRightBig {
	-webkit-animation-name: fadeInRightBig;
	animation-name: fadeInRightBig
}

/*从上向下*/
@-webkit-keyframes fadeInDownBig {
0% {
opacity:0;
-webkit-transform:translateY(-100px);
transform:translateY(-100px)
}
100% {
opacity:1;
-webkit-transform:translateY(0);
transform:translateY(0)
}
}
@keyframes fadeInDownBig {
0% {
opacity:0;
-webkit-transform:translateY(-100px);
-ms-transform:translateY(-100px);
transform:translateY(-100px)
}
100% {
opacity:1;
-webkit-transform:translateY(0);
-ms-transform:translateY(0);
transform:translateY(0)
}
}
.fadeInDownBig {
	-webkit-animation-name: fadeInDownBig;
	animation-name: fadeInDownBig
}


/*从下往上*/

@-o-keyframes fadeInUpBig{
0% {
opacity:0;
-webkit-transform:translateY(100px);
-o-animation:translateY(100px);
transform:translateY(100px)
}
100% {
opacity:1;
-webkit-transform:translateY(0);
-o-animation:translateY(0);
transform:translateY(0)
}	
}

@-moz-keyframes fadeInUpBig{
0% {
opacity:0;
-webkit-transform:translateY(100px);
-moz-animation: translateY(100px);
transform:translateY(100px)
}
100% {
opacity:1;
-webkit-transform:translateY(0);
-moz-animation: translateY(0);
transform:translateY(0)
}

}



@-webkit-keyframes fadeInUpBig {
0% {
opacity:0;
-webkit-transform:translateY(100px);
transform:translateY(100px)
}/* Safari and Chrome */
100% {
opacity:1;
-webkit-transform:translateY(0);
transform:translateY(0)
}
}
@keyframes fadeInUpBig {
0% {
opacity:0;
-webkit-transform:translateY(100px);
-ms-transform:translateY(100px);
-o-animation:translateY(100px);
-moz-animation: translateY(100px);
transform:translateY(100px);
}
100% {
opacity:1;
-webkit-transform:translateY(0);
-ms-transform:translateY(0);
-o-animation:translateY(0);
-moz-animation: translateY(0);
transform:translateY(0)
}
}
.fadeInUpBig {
	-webkit-animation-name: fadeInUpBig;
	-ms-transform:fadeInUpBig;
    -o-animation:fadeInUpBig;
    -moz-animation: fadeInUpBig;
	animation-name: fadeInUpBig
}



