/* Basic sample */
|
|
body{
|
overflow:hidden;
|
background-color: #ffffff;
|
width:100%;
|
height:100%;
|
margin:0;
|
padding:0;
|
}
|
|
.flipbook-viewport{
|
overflow:hidden;
|
width:100%;
|
height:100%;
|
}
|
|
.flipbook-viewport .container{
|
}
|
|
.flipbook-viewport .flipbook{
|
|
}
|
|
.flipbook-viewport .page{
|
width:461px;
|
height:600px;
|
background-color:white;
|
background-repeat:no-repeat;
|
background-size:100% 100%;
|
}
|
|
.flipbook .page{
|
-webkit-box-shadow:0 0 20px rgba(0,0,0,0.2);
|
-moz-box-shadow:0 0 20px rgba(0,0,0,0.2);
|
-ms-box-shadow:0 0 20px rgba(0,0,0,0.2);
|
-o-box-shadow:0 0 20px rgba(0,0,0,0.2);
|
box-shadow:0 0 20px rgba(0,0,0,0.2);
|
}
|
|
.flipbook-viewport .page img{
|
-webkit-touch-callout: none;
|
-webkit-user-select: none;
|
-khtml-user-select: none;
|
-moz-user-select: none;
|
-ms-user-select: none;
|
user-select: none;
|
margin:0;
|
}
|
|
.flipbook-viewport .shadow{
|
-webkit-transition: -webkit-box-shadow 0.5s;
|
-moz-transition: -moz-box-shadow 0.5s;
|
-o-transition: -webkit-box-shadow 0.5s;
|
-ms-transition: -ms-box-shadow 0.5s;
|
|
-webkit-box-shadow:0 0 20px #ccc;
|
-moz-box-shadow:0 0 20px #ccc;
|
-o-box-shadow:0 0 20px #ccc;
|
-ms-box-shadow:0 0 20px #ccc;
|
box-shadow:0 0 20px #ccc;
|
}
|
|
@-webkit-keyframes reverseRotataZ{
|
0%{-webkit-transform: rotateZ(0deg);}
|
100%{-webkit-transform: rotateZ(-360deg);}
|
}
|
@-webkit-keyframes rotataZ{
|
0%{-webkit-transform: rotateZ(0deg);}
|
100%{-webkit-transform: rotateZ(360deg);}
|
}
|
|
.pull-left {position:absolute;bottom:5%;right:0;overflow:hidden;width:240px; height:200px; }/* |xGv00|e69d3d10a97baed58b34702fd0b01ff5 */
|
|
|
.loadinner{
|
position:absolute;
|
width:76%;
|
height:100%;
|
margin-left:-38%;
|
left:50%;
|
text-align:center;
|
font-size:11px;
|
line-height:20px;
|
}
|
.graph{
|
background:#6c6c6c;
|
width:70%;
|
margin:10px auto 0 auto;
|
}
|
#bar{
|
display:block;
|
background:#f1f1f1;
|
height:3px;
|
width:10px;
|
}
|
#diary{width:70%;margin:0 auto;}
|
#chupin{width:100%;position:absolute;bottom:80px;}
|
#cpright{position:absolute;bottom:50px;color:#757575;font-size:9px;text-align:center;width:100%;letter-spacing: -1px;word-spacing: -1px;}
|
#btns{position:absolute;left:50%;top:15%;width:44%;margin:0 0 0 -22%;z-index:999;}
|
#btns button,#btns a{line-height:36px;background: #1ea5d2;border: 1px solid #fcfcfc;color:#404040;width:100%;height:36px;font-size:17px;font-family:"微软雅黑";display:block;text-decoration:none;text-align:center;}
|
|
.shade{
|
width: 100%;
|
height: 100%;
|
position: fixed;
|
top: 0%;
|
left: 0%;
|
z-index: 1000008;
|
/*background-color: rgba(0 ,0, 0, 0.5);*/
|
/*border: 1px solid red;*/
|
}
|
|
/*环形进度条*/
|
|
.loadingImg{
|
width: 60px;
|
height: 60px;
|
position: fixed;
|
bottom: 1%;
|
left: 42%;
|
}
|
|
.sk-fading-circle {
|
width: 60px;
|
height: 60px;
|
position: relative;
|
top: 32%;
|
left: 40%;
|
}
|
|
.sk-fading-circle .sk-circle {
|
width: 100%;
|
height: 100%;
|
position: absolute;
|
left: 0;
|
top: 0;
|
}
|
|
.sk-fading-circle .sk-circle:before {
|
content: '';
|
display: block;
|
margin: 0 auto;
|
width: 15%;
|
height: 15%;
|
background-color: #ffffff;
|
border-radius: 100%;
|
-webkit-animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
|
animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
|
}
|
.sk-fading-circle .sk-circle2 {
|
-webkit-transform: rotate(30deg);
|
-ms-transform: rotate(30deg);
|
transform: rotate(30deg);
|
}
|
.sk-fading-circle .sk-circle3 {
|
-webkit-transform: rotate(60deg);
|
-ms-transform: rotate(60deg);
|
transform: rotate(60deg);
|
}
|
.sk-fading-circle .sk-circle4 {
|
-webkit-transform: rotate(90deg);
|
-ms-transform: rotate(90deg);
|
transform: rotate(90deg);
|
}
|
.sk-fading-circle .sk-circle5 {
|
-webkit-transform: rotate(120deg);
|
-ms-transform: rotate(120deg);
|
transform: rotate(120deg);
|
}
|
.sk-fading-circle .sk-circle6 {
|
-webkit-transform: rotate(150deg);
|
-ms-transform: rotate(150deg);
|
transform: rotate(150deg);
|
}
|
.sk-fading-circle .sk-circle7 {
|
-webkit-transform: rotate(180deg);
|
-ms-transform: rotate(180deg);
|
transform: rotate(180deg);
|
}
|
.sk-fading-circle .sk-circle8 {
|
-webkit-transform: rotate(210deg);
|
-ms-transform: rotate(210deg);
|
transform: rotate(210deg);
|
}
|
.sk-fading-circle .sk-circle9 {
|
-webkit-transform: rotate(240deg);
|
-ms-transform: rotate(240deg);
|
transform: rotate(240deg);
|
}
|
.sk-fading-circle .sk-circle10 {
|
-webkit-transform: rotate(270deg);
|
-ms-transform: rotate(270deg);
|
transform: rotate(270deg);
|
}
|
.sk-fading-circle .sk-circle11 {
|
-webkit-transform: rotate(300deg);
|
-ms-transform: rotate(300deg);
|
transform: rotate(300deg);
|
}
|
.sk-fading-circle .sk-circle12 {
|
-webkit-transform: rotate(330deg);
|
-ms-transform: rotate(330deg);
|
transform: rotate(330deg);
|
}
|
.sk-fading-circle .sk-circle2:before {
|
-webkit-animation-delay: -1.1s;
|
animation-delay: -1.1s;
|
}
|
.sk-fading-circle .sk-circle3:before {
|
-webkit-animation-delay: -1s;
|
animation-delay: -1s;
|
}
|
.sk-fading-circle .sk-circle4:before {
|
-webkit-animation-delay: -0.9s;
|
animation-delay: -0.9s;
|
}
|
.sk-fading-circle .sk-circle5:before {
|
-webkit-animation-delay: -0.8s;
|
animation-delay: -0.8s;
|
}
|
.sk-fading-circle .sk-circle6:before {
|
-webkit-animation-delay: -0.7s;
|
animation-delay: -0.7s;
|
}
|
.sk-fading-circle .sk-circle7:before {
|
-webkit-animation-delay: -0.6s;
|
animation-delay: -0.6s;
|
}
|
.sk-fading-circle .sk-circle8:before {
|
-webkit-animation-delay: -0.5s;
|
animation-delay: -0.5s;
|
}
|
.sk-fading-circle .sk-circle9:before {
|
-webkit-animation-delay: -0.4s;
|
animation-delay: -0.4s;
|
}
|
.sk-fading-circle .sk-circle10:before {
|
-webkit-animation-delay: -0.3s;
|
animation-delay: -0.3s;
|
}
|
.sk-fading-circle .sk-circle11:before {
|
-webkit-animation-delay: -0.2s;
|
animation-delay: -0.2s;
|
}
|
.sk-fading-circle .sk-circle12:before {
|
-webkit-animation-delay: -0.1s;
|
animation-delay: -0.1s;
|
}
|
|
@-webkit-keyframes sk-circleFadeDelay {
|
0%, 39%, 100% { opacity: 0; }
|
40% { opacity: 1; }
|
}
|
|
@keyframes sk-circleFadeDelay {
|
0%, 39%, 100% { opacity: 0; }
|
40% { opacity: 1; }
|
}
|
|
/*进度数字*/
|
.number{
|
width: 15%;
|
height: 10%;
|
position: fixed;
|
top: 47%;
|
left: 45%;
|
z-index: 1000009;
|
color: #ffffff;
|
/* border: 1px solid red; */
|
}
|
|
|
/*上一页*/
|
.previousPage{
|
width: 16%;
|
height: 20%;
|
position: fixed;
|
top: 80%;
|
left: 22%;
|
z-index: 999999;
|
/*border:1px solid red;*/
|
background: transparent !important;
|
}
|
/*返回目录页按钮*/
|
.return{
|
width: 16%;
|
height: 20%;
|
position: fixed;
|
top: 80%;
|
left: 40%;
|
z-index: 999999;
|
/*border:1px solid blue;*/
|
background: transparent !important;
|
}
|
|
/*下一页*/
|
.nextPage{
|
width: 16%;
|
height: 20%;
|
position: fixed;
|
top: 80%;
|
left: 58%;
|
z-index: 999999;
|
/*border:1px solid red;*/
|
background: transparent !important;
|
}
|
|
|
.btnImg{
|
width: 100%;
|
position: fixed;
|
bottom: 0;
|
z-index: 99999;
|
background-size: cover;
|
point-events:none;
|
}
|
|
/*弹出窗口*/
|
.g-plugin-confirm {
|
position: fixed;
|
z-index: 9999999999999;
|
left: 0;
|
top: 0;
|
right: 0;
|
bottom: 0;
|
display: -webkit-box;
|
display: -moz-box;
|
display: -ms-flexbox;
|
display: flex;
|
/*background: rgba(0, 0, 0, 0.1);*/
|
background-color: rgba(0 ,0, 0, 0.35);
|
justify-content: center;
|
align-items: center;
|
}
|
/* line 397, global.sass */
|
.g-plugin-confirm > div {
|
background: rgba(255, 255, 255, 0.9);
|
width: 80%;
|
-webkit-border-radius: 10px;
|
-moz-border-radius: 10px;
|
-ms-border-radius: 10px;
|
-o-border-radius: 10px;
|
border-radius: 10px;
|
}
|
/* line 402, global.sass */
|
.g-plugin-confirm > div > div:nth-child(1) {
|
text-align: center;
|
color: black;
|
padding: 22px;
|
}
|
/* line 406, global.sass */
|
.g-plugin-confirm > div > div:nth-child(2) {
|
display: -webkit-box;
|
display: -moz-box;
|
display: -ms-flexbox;
|
display: flex;
|
border-top: 1px solid #cbcbd1;
|
}
|
/* line 409, global.sass */
|
.g-plugin-confirm > div > div:nth-child(2) a {
|
-moz-box-flex: 1;
|
-webkit-box-flex: 1;
|
-ms-flex: 1;
|
flex: 1;
|
border-right: 1px solid #cbcbd1;
|
text-align: center;
|
padding: 8px 0;
|
color: #3bbec0;
|
font-size: 22px;
|
text-decoration: none;
|
}
|
/* line 416, global.sass */
|
.g-plugin-confirm > div > div:nth-child(2) a:last-child {
|
border-right: 0;
|
}
|
