@charset "utf-8";

/*!
 * Animate.css -http://daneden.me/animate
 * Version - 3.4.0
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2015 Daniel Eden
 */
.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.animated.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}
/*bounceOutUp*/
@-webkit-keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
    transform: translate3d(0, 20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

@keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
    transform: translate3d(0, 20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

.bounceOutUp {
  -webkit-animation-name: bounceOutUp;
  animation-name: bounceOutUp;
}

/*slideInUp*/
@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    visibility: visible;
  }
}

@keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    visibility: visible;
  }
}

.slideInUp {
  -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}

/*slideInDown*/
@-webkit-keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    visibility: visible;
  }
}

@keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    visibility: visible;
  }
}

.slideInDown {
  -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}

/*slideOutUp*/
@-webkit-keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

@keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

.slideOutUp {
  -webkit-animation-name: slideOutUp;
  animation-name: slideOutUp;
}

/*slideOutDown*/
@-webkit-keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

@keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

.slideOutDown {
  -webkit-animation-name: slideOutDown;
  animation-name: slideOutDown;
}

html, body {
    -webkit-user-select: none;
    height: 100%;
    width: 100%;
}
/*animations*/
/*3d旋转到侧面*/


@-webkit-keyframes slideOutUp2{
	0%{

		-webkit-transform:translate3d(0,0,0);
		
	}
	100%{ 

	-webkit-transform:translate3d(0,-50%,-400px) ;
	opacity:0.4;
	
	}
}
@-webkit-keyframes slideOutDown2{
	0%{

		-webkit-transform:translate3d(0,0,0);
		
	}
	100%{ 

	-webkit-transform:translate3d(0,50%,-400px);
	opacity:0.2;
	
	}
}
/*下滑，下一页向上，上一页向上一小段*/
.slideOutUp2{
	animation:slideOutUp2  linear;
	-webkit-animation:slideOutUp2 linear;
	
}
.slideOutDown2{
	animation:slideOutDown2  linear;
	-webkit-animation:slideOutDown2 linear;
	
}

@-webkit-keyframes slideInUp2 {
  from {
	
    -webkit-transform: translate3d(0, 100%, 400px);
	visibility:visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    visibility: visible;

  }
}



.slideInUp2 {
  -webkit-animation-name: slideInUp2;
  animation-name: slideInUp2;
  animation-timing-function:linear;
}
@-webkit-keyframes slideInDown2 {
  from {
    -webkit-transform: translate3d(0, -100%, 400px);
	visibility:visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    visibility: visible;
  }
}

.slideInDown2 {
  -webkit-animation-name: slideInDown2;
  animation-name: slideInDown2;
}
/* Common Stage */
html,body{
	height:100%;margin:0;padding:0;
	-webkit-user-drag:none;
	touch-action:none;
	zoom:1;
	}

.cm-stage-container{
	position:absolute;
	width:100%;
	height:100%;
	overflow:hidden;
	
	-webkit-perspective:1200px;
	perspective:1200px;
}
.cm-scene
{
	display:block;
    visibility:hidden;
	position:absolute;
	width:100%;
	height:100%;
	z-index:100; /*基准z-index*/
	background:#FFF;
	overflow:hidden;
	-webkit-transform-style:preserve-3d;
	transform-style:preserve-3d;
	backface-visibility:hidden;
	
}
.cm-scene.active
{
	display:block;
    visibility:visible;
}
.cm-widget{
	z-index:101;
	
}
.scene-loading{
	z-index:999;
}
.scene-widget{display:none;}

.cm-animate-pause{
	-webkit-animation-play-state:paused !important;
	animation-play-state:paused !important;
}
.bounceOutUp {
  -webkit-animation-name: bounceOutUp;
  animation-name: bounceOutUp;
}

.cm-dragging{
	transition:none;
	-webkit-transition:none;
	
}
.isActive.cm-dragging{
	z-index:99;
}

.cm-drag-end{
	transition: all 3s ease-out;
	-webkit-transition:all 3s ease-out;
}
.cm-drag-scene-out{
-webkit-transition: all 3s ease-in;
}
.cm-drag-next-scene-in{
	transition: all 3s ease-out;
	-webkit-transform: translate3d(0,0,0) !important;
}
.cm-drag-scene-out.up{

	-webkit-transform: translate3d(0,-70%,0) !important;
}
.cm-drag-scene-out.down{

	-webkit-transform: translate3d(0,70%,0) !important;
}
.cm-drag-scene-out.left{

	-webkit-transform: translate3d(-70%,0,0) !important;
}
.cm-drag-scene-out.right{

	-webkit-transform: translate3d(70%,0,0) !important;
}

/*fadeOutLeft*/
@-webkit-keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

.fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
  animation-name: fadeOutLeft;
}

@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

.fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
}
.cm-relative-scene
{
	display:block;
	position:relative;
	width:100%;
	height:100%;
	z-index:100; /*基准z-index*/
	background:#FFF;
	-webkit-transform-style:preserve-3d;
	transform-style:preserve-3d;
	backface-visibility:hidden;
	
}
.cm-loading-text {
    margin-top: 5px;

    color:black;
    
    height: 20px;

    overflow:hidden;
}
.cm-loading-text p{
    margin: 0;
    padding: 0;
    height: 20px;
    font-size: 14px;
    line-height: 20px;
}

@keyframes textHeightChange {
    from {
        margin-top: 0;
    }
    to {
        margin-top: -120px;
    }
}
@-webkit-keyframes textHeightChange {
    from {
        margin-top: 0;
    }
    to {
        margin-top:-120px;
    }
}
.textchange {
    animation: textHeightChange 18s steps(6) infinite;
    -webkit-animation: textHeightChange 18s steps(6) infinite;
}