.slide{
	float:left;
	position: relative;
}
.slide *{
	color: #051c2c;
}
.slide.slide-black *{
	color: #fff;
}
.pull-left{
	float: left;
}
body {
  background: #000;
  perspective: 100%;
  font-family: "微软雅黑";
  font-size: 14px;
}
h1,h2,h3,h4,h5,h6{
	font-family: "微软雅黑";
}
html.fsvs #fsvs-pagination li.active>span{
	border-color: #ddd
}
html.fsvs #fsvs-pagination li>span>span{
	border-color: #ddd
}
html.fsvs #fsvs-pagination li>span{
	border-color: #ddd
}
.center {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  color: #fff;
  display: flex;
  align-items: center;
}
.center .text-center {
  text-align: center;
  width: 100%;
}

h1 {
  display: inline-block;
  padding-right: 5px;
  border-right: 10px solid #fff;
  animation: blink 1s infinite;
}
@media screen and (max-width: 370px) {
  h1 {
	font-size: 14px;
	border-right: 4px solid #fff;
  }
}

@keyframes blink {
  0% {
	border-right-color: transparent;
  }
  50% {
	border-right-color: transparent;
  }
  51% {
	border-right-color: #fff;
  }
  100% {
	border-right-color: #fff;
  }
}
	

.lt-cube-grid .lt-cube {
  width: 20px;
  height: 20px;
  -webkit-animation: lt-ScaleDelay 1.5s infinite ease-in-out;
		  animation: lt-ScaleDelay 1.5s infinite ease-in-out; 
  background-color: #24cbd3;
  opacity: .5;
  float: left;
  border-radius: 5px;
  margin: 1px;
}

.lt-cube-grid .lt-cube1 {
  width: 20px;
  height: 20px;
  -webkit-animation: lt-ScaleDelay 1.5s infinite ease-in-out;
		  animation: lt-ScaleDelay 1.5s infinite ease-in-out; 
  background-color: white;
  float: right; 
  opacity: .5;
  border-radius: 5px;
  margin: 1px;
}
.lt-cube-grid .lt-cube1.pull-left,
.lt-cube-grid .lt-cube.pull-left
{
	float: left;
}

.lt-cube-grid .lt-cube1.pull-right,
.lt-cube-grid .lt-cube.pull-right
{
	float: right;
}


.lt-cube-grid .c1 {
  -webkit-animation-delay: 0.2s;
		  animation-delay: 0.2s; }
.lt-cube-grid .c2 {
  -webkit-animation-delay: 0.3s;
		  animation-delay: 0.3s; }
.lt-cube-grid .c3 {
  -webkit-animation-delay: 0.4s;
		  animation-delay: 0.4s; }
.lt-cube-grid .c4 {
  -webkit-animation-delay: 0.5s;
		  animation-delay: 0.5s; }
.lt-cube-grid .c5 {
  -webkit-animation-delay: 0.6s;
		  animation-delay: 0.6s; }
.lt-cube-grid .c6 {
  -webkit-animation-delay: 0.7s;
		  animation-delay: 0.7s; }
.lt-cube-grid .c7 {
  -webkit-animation-delay: 0.8s;
		  animation-delay: 0.8s; }
.lt-cube-grid .c8 {
  -webkit-animation-delay: 0.9s;
		  animation-delay: 0.9s; }
.lt-cube-grid .c9 {
  -webkit-animation-delay: 0.10s;
		  animation-delay: 0.10s; }

@-webkit-keyframes lt-ScaleDelay {
  0%, 70%, 100% {
	-webkit-transform: scale3D(10, 20, 30);
			transform: scale3D(1, 1, 1);
  } 35% {
	-webkit-transform: scale3D(0, 0, 1);
			transform: scale3D(0, 0, 1); 
  }
}

@keyframes lt-ScaleDelay {
  0%, 70%, 100% {
	-webkit-transform: scale3D(1, 1, 1);
			transform: scale3D(1, 1, 1);
  } 35% {
	-webkit-transform: scale3D(0, 0, 1);
			transform: scale3D(0, 0, 1);
  } 
}


.first-block-btn-round.active{
	animation: animfbbtn .75s linear;
}
.first-block-btn-round.active.fb-btn-2{
	animation: animfbbtn .90s linear;
}
.first-block-btn-round.active.fb-btn-3{
	animation: animfbbtn 1.05s linear;
}
.first-block-btn-round.active.fb-btn-4{
	animation: animfbbtn 1.20s linear;
}
.first-block-btn-round.active.fb-btn-5{
	animation: animfbbtn 1.35s linear;
}



@keyframes animfbbtn {
  from {
	opacity: 0;
	top: 150px;
  }
  to {
	opacity: 1;
	top: 100px;
  }
}
.first-block{
	width:764px;
	margin:auto;
	position: relative;
	opacity: .5;				
}
.type-it *,.type-it2 *{
	color: #a3a6a9!important;font-weight: bold;font-size:2em!important;
}
.type-it2 *{
	color: #fff!important;
}
.type-it .ti-container:last-child *,.type-it2 .ti-container:last-child *{
	font-size:.75em!important;
}
.type-it .ti-container:first-child *,.type-it2 .ti-container:first-child *{
	font-size:1.25em!important;
}

.first-block-top,.first-block-bottom{
	height: 60%;
	position: relative;
	display: block;
}
.first-block-top{
	background: url(../img/first-block1-top.png) bottom center  no-repeat;
}
.first-block-bottom{
	background: url(../img/first-block1-bottom.png) top center no-repeat;
	height: 40%;
}
.first-block-top .wrap,.first-block-bottom .wrap{
	height: 100%;
}
.lt-cube-grid {
  width: 660px;
  bottom: 0;
  position:absolute;
  right: -423px;
  opacity: .15;
  /*display: none;*/
}
html.fsvs.demo #fsvs-body>.slide{
	padding: 0;
	text-align: left;
}

.wrap{
	width: 1240px;
	margin: auto;
	position: relative;
}
.header{
	position: fixed;
	z-index: 9999;
	width: 100%;
	padding-top: 20px;
	top: 0;
	left: 0;
}
.nav{
	margin-top: 15px;
}
.nav.nav-pills.pull-right .nav-item{
	float: right;
}
.home-nav.nav>li, .home-nav.nav>li>a{
	color: #fff;
}
.home-nav.nav-pills .nav-link.active{
	background: #126e7a;
}
.first-block-btn-warp{
	position: relative;
}
.first-block-btn-warp *{
	transform: 0.3s all;	
}
.first-block-btn-round{
	position: absolute;
	width: 100%;
	left: 0;
	top: 100px;
	border:;
}
.first-block-btn{
	margin: auto;
	width: 170px;
	height: 170px;
	border-radius: 170px;
	background: #14737f;
	line-height: 170px;
	text-align: center;
	cursor: default;
}
.first-block-btn img{
	width: 60%;
}
.first-block-text{
	text-align: center;
	margin-top: 20px;
	color: #16828b;
}
.type-it-wrap2,.type-it-wrap{
	margin: auto;text-align: center;position: absolute;bottom: 269px;width: 100%;left: 0;
}
.type-it-wrap2{
	bottom: auto;
	top: 30%;
}

.tb-top{
	position: relative;
	height: 30%;
	float: left;
	width: 100%;
	display: block;
	z-index: 1;
}
.tb-bottom{
	height: 70%;
	position: relative;
	float: left;
	width: 100%;
	display: block;
}
.sb-2-else{
	width: 12px;
	height: 12px;
	border-radius: 12px;
	background: #0654c3;
	position: absolute;
	top: 45px;
	left: 29px;
	animation: blink1 4.5s linear infinite;
}
.sb-2-else-2{
	animation: blink2 4.5s linear infinite;
	left: 45px;
}
.sb-2-else-3{
	animation: blink3 4.5s linear infinite;
	left: 61px;
}
@keyframes blink1 {
  0% {
	opacity: 1;
  }
  33% {
	opacity: 0;
  }
  66% {
	opacity: 0;
  }
  100% {
	opacity: 1;
  }
}
@keyframes blink2 {
  0% {
	opacity: 0;
  }
  33% {
	opacity: 1;
  }
  66% {
	opacity: 0;
  }
  100% {
	opacity: 0;
  }
}
@keyframes blink3 {
  0% {
	opacity: 0;
  }
  33% {
	opacity: 0;
  }
  66% {
	opacity: 1;
  }
  100% {
	opacity: 0;
  }
}
.sb-3-else{
	width: 64px;
	height: 64px;
	display: block;
	background: url(../img/fb2/icon2.png) center center no-repeat;
	position: absolute;
	top: 11px;
	left: 19px;
	animation: sb3-1 4.5s linear infinite;
}
.sb-3-else-2{
	top: 27px;
	left: 62px;
	animation: sb3-2 4.5s linear infinite;
}
.sb-3-else-3{
	top: 57px;
	left: 31px;
	animation: sb3-3 4.5s linear infinite;
}
@keyframes sb3-1 {
  	from {
  		transform:rotate(0deg);
  		-webkit-transform:rotate(0deg);
  		-moz-transform:rotate(0deg);
  	}
  	to {
		transform:rotate(-360deg);
		-webkit-transform:rotate(-360deg);
		-moz-transform:rotate(-360deg);
	}
}
@keyframes sb3-2 {
  	from {
  		transform:rotate(0deg);
  		-webkit-transform:rotate(0deg);
  		-moz-transform:rotate(0deg);
  	}
  	to {
		transform:rotate(360deg);
		-webkit-transform:rotate(360deg);
		-moz-transform:rotate(360deg);
	}
}
@keyframes sb3-3 {
  	from {
  		transform:rotate(180deg);
  		-webkit-transform:rotate(180deg);
  		-moz-transform:rotate(180deg);
  	}
  	to {
		transform:rotate(-180deg);
		-webkit-transform:rotate(-180deg);
		-moz-transform:rotate(-180deg);
	}
}
.sb-4-else{
	width: 100px;
	height: 70px;
	display: block;
	border-radius: 10px;
	border: 5px solid #fff;
	position: absolute;
	top: 11px;
	left: 20px;
}
.sb-4-else-1{
	top: 27px;
	left: 50px;
	position: absolute;
	width: 40px;
	animation: sb3-2 2.5s linear infinite;
}
.sb-4-else-2{
	top: 88px;
	left: 22px;
	position: absolute;
	width: 30px;
	height: 30px;
	border-radius: 10px;
	border: 5px solid #fff;
}
.sb-4-else-3{
	left: 57px;
}
.sb-4-else-4{
	left: 91px;
}
.sb-5-else{
	width: 32px;
	height: 40px;
	display: block;
	position: absolute;
	background: #fff;
	top: 25px;
	left: 20px;
}
.sb-5-else-2{
	top: 32px;
	left: 63px;
	width: 42px;
	height: 32px;
}
.sb-5-else-3{
	top: 76px;
	left: 20px;
	width: 39px;
	height: 26px;
}
.sb-5-else-4{
	top: 96px;
	left: 103px;
	width: 55px;
	height: 25px;
	background: #0654c3;
	animation: sb5 4.5s linear infinite;
}
@keyframes sb5 {
  	0% {
  		top: 96px;
		left: 103px;
		width: 75px;
		height: 35px;
		opacity: 0;
  	}
  	40% {
		width: 55px;
		height: 25px;
		top: 76px;
		left: 70px;
		opacity: 1;
	}
	79.9% {
		width: 55px;
		height: 25px;
		top: 76px;
		left: 70px;
		opacity: 1;
	}
	80%{
		top: 96px;
		left: 103px;
		width: 75px;
		height: 35px;
		opacity: 0;
	}
	100%{
		top: 96px;
		left: 103px;
		width: 75px;
		height: 35px;
		opacity: 0;
	}
}
.sb-6-else{
	width: 64px;
	height: 64px;
	display: block;
	position: absolute;
	top: 39px;
	left: 37px;
	animation: sb3-1 3s linear infinite;
}
.sb-6-else-2{
	animation: sb3-2 60s linear infinite;
	width: 120px;
	position: absolute;
	top: 11px;
	left: 9px;
}
.sb-7-else{
	width: 130px;
	height: 130px;
	display: block;
	position: absolute;
	top: 0px;
	left: 5px;
}
.sb-7-else-2{
	animation: sb7 5s linear infinite;
	width: 15px;
	position: absolute;
	top: 44px;
	left: 64px;
}
@keyframes sb7 {
  	0% {
  		top: 44px;
		left: 64px;
		width: 15px;
		opacity: 0;
  	}
  	20% {
		width: 30px;
		top: 30px;
		left: 56px;
		opacity: 1;
	}
	79.9% {
		width: 30px;
		top: 30px;
		left: 56px;
		opacity: 1;
	}
	80%{
		top: 44px;
		left: 64px;
		width: 15px;
		opacity: 0;
	}
	100%{
		top: 44px;
		left: 64px;
		width: 15px;
		opacity: 0;
	}
}
.fb2-content{
	position: relative;width: 140px;height: 140px;display: block;
}
.fb2-text{
	color: #818c94;
	width: 80%;
	position: absolute;
	left: 10%;
	top: 290px;
	text-align: center;
}
.slide .fb2-text *{
	color: #a5a8ac;
}
.fb2-text h4{
	margin-bottom: 10px;
}
.tb3-cloud{
	height: 120px;background:url(../img/fb2/cloud.png) top center repeat-x;width: 100%;display: block;
	float: left;
	/*animation: tb1 150s linear infinite;*/
	z-index: 1;
    margin-top: -7px;
}
.tb3-cloud-right{
	left: auto;
	z-index: 2;
	right: 0;
/*				animation: tb2 150s linear infinite;*/
}
.tb3-cloud-white{
	height: 120px;background: #fff;position: absolute;bottom: 0;left: 0;width: 100%;
}
@keyframes tb1 {
  	0% {
  		left: 0;
  		opacity: 1;
  	}
  	50%{
		opacity: 1;
	}
	100%{
		left: -200%;
		opacity: 1;
	}
}
@keyframes tb2 {
  	0% {
  		right: 0;
  	}
  
	100%{
		right: -200%;
	}
}
.black-bg{
	background: #051c2c url(../img/fb2/bg.png) repeat!important;
}
.tb-fun{
	width: 380px;height: 380px;position: relative;margin: 40px auto 0;
}
.tb-inner{
	background: url(../img/fb2/circle-outer.png) 0 0/380px auto no-repeat;width: 380px;height: 380px;position: absolute;
}
.tb-round{
	background: url(../img/fb2/circle-inner.png)0 0/320px auto no-repeat;width: 320px;height: 320px;margin: 30.5px;position: absolute;
	animation: sb3-2 60s linear infinite
}
.tb-text-1,.tb-text-2,.tb-text-3,.tb-text-4,.tb-text-5{
	position: absolute;
	width: 150px;
}
.tb-text-1{
	top: 30px;
	left: -117px;
}
.tb-text-2{
	top: 30px;
	right: -117px;
}
.tb-text-3{
	top: 262px;
	right: -117px;
}
.tb-text-4{
	top: 393px;
	right: 113px;
}
.tb-text-5{
	top: 262px;
	left: -117px;
}
.tb-text-1 h4,.tb-text-2 h4,.tb-text-3 h4,.tb-text-4 h4,.tb-text-5 h4{
	color: #051c2c!important;;
	font-weight: bold;
	margin-bottom: 5px ;
}
.tb-text-1 small,.tb-text-2 small,.tb-text-3 small,.tb-text-4 small,.tb-text-5 small{
	color: #7eaca6!important;
}

.header-black .home-nav.nav>li,.header-black .home-nav.nav>li>a{
	color: #051c2c;
}
.header-black .home-nav.nav-pills .nav-link.active{
	color: #fff;
}
.flb-bg{
	height: 100%;background: url(../img/flb-bg1.png) bottom center no-repeat;
}
.flb-content{
	position: absolute;
	top: 200px;
	left: 0;
	width: 100%;
}
.flb-content .wrap{
	z-index: 9;
}
.flb-content-block{
	width: 20%;position: absolute;
	height: 229px;
	left: 0;
	top: 0;
}
.flb-content-round{
	width: 150px;height:150px;margin: auto;border-radius: 9099px;color: #fff;padding-top: 50px;font-size: 115%;
}
.flb-content-round1{
	background: #347589;
}
.flb-content-round2{
	background: #33a59d;
}
.flb-content-round3{
	background: #7dc9ad;
}
.flb-content-round4{
	background: #df716f;				
}
.flb-content-round5{
	background: #f59171;				
}
.flb-content-block1{
	left: 0;
}
.flb-content-block2{
	left: 20%;
}
.flb-content-block3{
	left: 40%;
}
.flb-content-block4{
	left: 60%;
}
.flb-content-block5{
	left: 80%;
}
.flb-content-block1.active{
	animation: animflb .75s linear;
}
.flb-content-block2.active{
	animation: animflb .90s linear;
}
.flb-content-block3.active{
	animation: animflb 1.05s linear;
}
.flb-content-block4.active{
	animation: animflb 1.20s linear;
}
.flb-content-block5.active{
	animation: animflb 1.35s linear;
}
.flb-content-text{
	margin-top: 30px;
}
.flb-line-dot{
	background: #021929;width: 12px;height: 12px;margin: auto;border-radius: 99px;box-shadow: 0 0 0px 10px #fff;
}
.flb-line{
	width: 100%;position: absolute;bottom: 40px;height: 3px;background: #021929;
}
.flb-text-year{
	margin-top: 10px;font-size: 115%;
}
@keyframes animflb {
  from {
	opacity: 0;
	top: -100px;
  }
  to {
	opacity: 1;
	top: 0px;
  }
}
.fib-block{
	position: absolute;
	width: 130px;
	height: 100px;
	background: #f2f3f5;
	line-height: 100px;
}
.fib-block img{
	max-height: 70%;
	max-width: 80%;
}
.fib-block-w-2{
	width: 268.75px;
}
.fib-block-w-3{
	width: 407.5px;
}
.fib-block-h-2{
	height: 208.75px;
	line-height: 208.75px;
}
.fib-block-col-1{
	left: 0;
} 
.fib-block-col-2{
	left: 138.75px;
} 
.fib-block-col-3{
	left: 277.5px;
} 
.fib-block-col-4{
	left: 416.25px;
} 
.fib-block-col-5{
	left: 555px;
} 
.fib-block-col-6{
	left: 693.75px;
} 
.fib-block-col-7{
	left: 832.5px;
} 
.fib-block-col-8{
	left: 971.25px;
} 
.fib-block-col-9{
	left: 1110px;
} 
.fib-block-row-1{
	top: 0
}
.fib-block-row-2{
	top: 108.75px
}
.fib-block-row-3{
	top: 217.5px
}
.fib-block-row-4{
	top: 326.25px
}
.fib-block-row-5{
	top: 435px
}


.fib-left-block{
	width: 277.5px;
	left: -277.5px;
	position: absolute;
	top: 0;
}
.fib-right-block{
	width: 268.75px;
	right: -277.5px;
	position: absolute;
	top: 0;
}
.fib-block-o-6{
	opacity: .6;
}
.fib-block-o-3{
	opacity: .3;
}
.footer{
	position: absolute;bottom: 0px;width: 100%;left: 0%;height: 220px; color: #fff!important;
}
.slide .footer *{
	color: #fff;
}
.tb-div{
    position: relative;
    width: 200px;
    height: 200px;
    margin: 90px;
    background-size: 200px auto;
    background-repeat: no-repeat;
    transition: background .5s ease-in-out;
}
.tb-div.tb-div-1{
	background-image: url(../img/tbicon/edit_image.png);
}
.tb-div.tb-div-2{
	background-image: url(../img/tbicon/faq.png);
}
.tb-div.tb-div-3{
	background-image: url(../img/tbicon/sports_mode.png);
}
.tb-div.tb-div-4{
	background-image: url(../img/tbicon/idea.png);
}
.tb-div.tb-div-5{
	background-image: url(../img/tbicon/manager.png);
}
.tb-div .point {
    position: absolute;
    display: inline-block;
    width: 22px;
    height: 22px;
}
.tb-div-1 .point {
    top: -21.98%;
    left: -38%;
}
.tb-div-2 .point {
    top: -23.98%;
    left: 127%;
}
.tb-div-3 .point {
    top: 95.02%;
    left: 135%;
}
.tb-div-4 .point {
    top: 95.02%;
    left: -44%;
}
.tb-div-5 .point {
    top: 144.02%;
    left: 47.5%;
}
.tb-div .point > span {
    width: 22px;
    height: 22px;
    background: url(../img/blue-point.gif) 0 0/22px auto no-repeat;
    display: inline-block;
    position: absolute;
    top: -6px;
    left: -4px;
}
.tb-div .line1, .tb-div .line2 {
    width: 0;
    height: 2px;
    background: #e4e4e4;
    position: absolute;
    transform-origin: top left;
    -ms-transform-origin: top left;
    -webkit-transform-origin: top left;
}

.tb-div-1 .line1 {
    animation: kfLine1 .5s linear;
    top: -40px;
    left: -71px;
    transform: rotate(0deg);
    transform-origin: top right;
    animation-fill-mode: forwards;
}
.tb-div-1 .line2 {
    animation: kfLine1-2 .7s linear;
    top: -39px;
    left: -19px;
    transform: rotate(45deg);
    animation-fill-mode: forwards;
    
}
.tb-div-2 .line1 {
    animation: kfLine2 .5s linear;
    top: -44px;
    right: -58px;
    transform: rotate(0deg);
    transform-origin: top right;
    animation-fill-mode: forwards;
}
.tb-div-2 .line2 {
    animation: kfLine2-2 .7s linear;
    top: -44px;
    right: -8px;
    transform: rotate(-45deg);
    transform-origin: top right;
    animation-fill-mode: forwards;
    
}

.tb-div-3 .line1 {
    animation: kfLine3 .5s linear;
    top: 211px;
    right: -61px;
    transform: rotate(0deg);
    transform-origin: top right;
    animation-fill-mode: forwards;
}
.tb-div-3 .line2 {
    animation: kfLine3-2 .7s linear;
    top: 198px;
    right: -73px;
    transform: rotate(-45deg);
    transform-origin: top right;
    animation-fill-mode: forwards;
    
}
.tb-div-4 .line1 {
    animation: kfLine4 .5s linear;
    top: 211px;
    right: 212px;
    transform: rotate(0deg);
    transform-origin: top right;
    animation-fill-mode: forwards;
}
.tb-div-4 .line2 {
    animation: kfLine4-2 .7s linear;
    top: 211px;
    right: 263px;
    transform: rotate(45deg);
    transform-origin: top right;
    animation-fill-mode: forwards;
    
}
.tb-div-5 .line1 {
    animation: kfLine5 .5s linear;
    top: 260px;
    right: 97px;
    transform: rotate(0deg);
    transform-origin: top right;
    animation-fill-mode: forwards;
}
.tb-div-5 .line2 {
    display: none;
    top: -22px;
    left: -26px;
}
@keyframes kfLine1{
	100% {
	    width: 52px;
	}
}
@keyframes kfLine1-2{
	100% {
	    width: 25px;
	}
}
@keyframes kfLine2{
	100% {
	    width: 51px;
	}
}
@keyframes kfLine2-2{
	100% {
	    width: 20px;
	}
}
@keyframes kfLine3{
	100% {
	    width: 45px;
	}
}
@keyframes kfLine3-2{
	100% {
	    width: 20px;
	}
}
@keyframes kfLine4{
	100% {
	    width: 52px;
	}
}
@keyframes kfLine4-2{
	100% {
	    width: 20px;
	}
}
@keyframes kfLine5{
	100% {
	    height: 30px;
	    width: 2px;
	}
}


@keyframes fibblockall{
	0%{
		opacity: 0;
	}
	100%{
		opacity: 1;
	}
}
@keyframes fibblockall2{
	0%{
		opacity: 0;
	}
	50%{
		opacity: 0;
	}
	100%{
		opacity: 1;
	}
}
@keyframes fibblockall3{
	0%{
		opacity: 0;
	}
	50%{
		opacity: 0;
	}
	100%{
		opacity: 1;
	}
}
@keyframes fibblockall4{
	0%{
		opacity: 0;
	}
	50%{
		opacity: 0;
	}
	100%{
		opacity: 1;
	}
}
@keyframes fibblockall5{
	0%{
		opacity: 0;
	}
	50%{
		opacity: 0;
	}
	100%{
		opacity: 1;
	}
}
@keyframes fibblockall6{
	0%{
		opacity: 0;
	}
	50%{
		opacity: 0;
	}
	100%{
		opacity: 1;
	}
}
@keyframes fibblockall7{
	0%{
		opacity: 0;
	}
	50%{
		opacity: 0;
	}
	100%{
		opacity: 1;
	}
}
@keyframes fibblockall8{
	0%{
		opacity: 0;
	}
	50%{
		opacity: 0;
	}
	100%{
		opacity: 1;
	}
}
@keyframes fibblockall9{
	0%{
		opacity: 0;
	}
	50%{
		opacity: 0;
	}
	100%{
		opacity: 1;
	}
}
.fib-block-col-1.active{
	animation: fibblockall .5s;
}
.fib-block-col-2.active{
	animation: fibblockall2 .7s;
}
.fib-block-col-3.active{
	animation: fibblockall3 .9s;
}
.fib-block-col-4.active{
	animation: fibblockall4 1.1s;
}
.fib-block-col-5.active{
	animation: fibblockall5 1.3s;
}
.fib-block-col-6.active{
	animation: fibblockall4 1.1s;
}
.fib-block-col-7.active{
	animation: fibblockall3 .9s;
}
.fib-block-col-8.active{
	animation: fibblockall2 .7s;
}
.fib-block-col-9.active{
	animation: fibblockall .5s linear;
}

.fib-block-col-3.fib-block-row-1.active{
	animation: fibblock3_1x2_2 1.0s linear;
}
@keyframes fibblock3_1x2_2{
	0%{
		top: -77.67px;
		left: 77.5px;
		opacity: 0;
	    height: 364.095px;
	    line-height: 364.095px;
	    width: 468.75px;
	    box-shadow: 0 0 20px rgba(0,0,0,.25);
	}
	10%{
		top: -77.67px;
		left: 77.5px;
		opacity: .5;
	    height: 364.095px;
	    line-height: 364.095px;
	    width: 468.75px;
	    box-shadow: 0 0 20px rgba(0,0,0,.25);
	}
	100%{
		top: 0px;
		left: 277.5px;
		opacity: 1;
	 	height: 208.75px;
	    width: 268.75px;
	    line-height: 208.75px;
	}
}
.fib-block-col-7.fib-block-row-2.active{
	animation: fibblock7_2x2_2 1.15s;
}
@keyframes fibblock7_2x2_2{
	0%{
		top: 31.08px;
		left: 932.5px;
		opacity: 0;
		height: 364.095px;
	    width: 468.75px;
	    line-height: 364.095px;
	    box-shadow: 0 0 20px rgba(0,0,0,.25);
	}
	20%{
		top: 31.08px;
		left: 932.5px;
		opacity: 0.4;
		height: 364.095px;
	    width: 468.75px;
	    line-height: 364.095px;
	    box-shadow: 0 0 20px rgba(0,0,0,.25);
	}
	100%{
		top: 108.75px;
		left: 832.5px;
		height: 208.75px;
		line-height: 208.75px;
	    width: 268.75px;
		opacity: 1;
	}
}
.fib-block-col-4.fib-block-row-3.active{
	animation: fibblock4_3x1_3 1.35s;
}
@keyframes fibblock4_3x1_3{
	0%{
		top: 167.5px;
		left: 212.5px;
		height: 200px;
	    width: 815px;
		opacity: 0;
		line-height: 200px;
		box-shadow: 0 0 20px rgba(0,0,0,.25);
	}
	30%{
		top: 167.5px;
		left: 212.5px;
		height: 200px;
	    width: 815px;
		opacity: 0.3;
		line-height: 200px;
		box-shadow: 0 0 20px rgba(0,0,0,.25);
	}
	100%{
		top: 217.5px;
		left: 416.25px;
		height: 100px;
	    width: 407.5px;
		opacity: 1;
		line-height: 100px;
	}
}
.fib-block-col-2.fib-block-row-5.active{
	animation: fibblock2_5x1_2 1.55s;
}
@keyframes fibblock2_5x1_2{
	0%{
		top: 635px;
		left: -138.75px;
		height: 150px;
	    width: 403.125px;
		opacity: 0;
		line-height: 150px;
		box-shadow: 0 0 20px rgba(0,0,0,.5);
	}
	40%{
		top: 635px;
		left: -138.75px;
		height: 150px;
	    width: 403.125px;
		opacity: 0.6;
		line-height: 150px;
		box-shadow: 0 0 20px rgba(0,0,0,.5);
	}
	100%{
		top: 435px;
		left: 138.75px;
		height: 100px;
	    width: 268.75px;
		opacity: 1;
		line-height: 100px;
	}
}	
.fib-block-col-5.fib-block-row-4.active{
	animation: fibblock5_4x2_3 1.75s;
}
@keyframes fibblock5_4x2_3{
	0%{
		top: 726.25px;
		left: 555px;
		height: 417.5px;
	    width: 815px;
		opacity: 0;
		line-height: 417.5px;
		box-shadow: 0 0 20px rgba(0,0,0,.5);
	}
	30%{
		top: 626.25px;
		left: 555px;
		height: 417.5px;
	    width: 815px;
		opacity: 0.4;
		line-height: 417.5px;
		box-shadow: 0 0 20px rgba(0,0,0,.5);
	}
	100%{
		top: 326.25px;
		left: 555px;
		height: 208.75px;
	    width: 407.5px;
		opacity: 1;
		line-height: 208.75px;
	}
}	
#starCanvas{
    position: absolute;
    width: 1920px;
    height: 100%;
    left: 50%;
    margin-left: -960px;
}
.normal-canvas,.normal-canvas2,.normal-canvas3{
	position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}
.normal-canvas3{
	height: auto;
}
.last-bg{
	padding-bottom:220px;height: 100%;display: block;
	background: #212121;
	/*background: #29b6f6 url(img/earth.png) center bottom 220px no-repeat;*/
	position: relative;
	animation: lastbg 60s linear infinite;
}
@keyframes lastbg{
	0%{
		background: #212121;
	}
	33%{
		background: #2f253a;
	}
	66%{
		background: #000010;
	}
	100%{
		background: #212121;
	}
}	
.earth-round-wrap{
	position: absolute;
	width: 100%;
	height: 200px;
	left: 0;
	bottom: 200px;
	overflow: hidden;
}
.earth-round{
	width: 735px;
	height: 735px;
	margin: auto;
	animation: sb3-2 540s linear infinite;
	background: url(../img/earth2.png) center center no-repeat;
}
.shooting-stars {
  z-index: 10;
  width: 3px;
  height: 85px;
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
  position: absolute;
  bottom: 0;
  left: 15%;
  background: linear-gradient(to top, rgba(255, 255, 255, 0), white);
  animation: animShootingStar 10s linear infinite;
}
@keyframes animShootingStar {
  from {
    transform: translateY(0px) translateX(0px) rotate(45deg);
    opacity: .5;
    height: 5px;
  }
  to {
    transform: translateY(-2560px) translateX(2560px) rotate(45deg);
    opacity: .5;
    height: 600px;
  }
}


.header-wrap{
	width: 100%;
	max-width: 1240px;
}
