/* your styles go here */
#body1{
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 75vh;
    background: #333;
}

.glide__slide img{
    width: 100%;
}

.glide__slide{
    filter: blur(0.5px);
    opacity: .7;
    transition: .3s linear;
}

.glide__slide--active{
    opacity: 1;
    filter: none;
    transform: scale(1.03);
}

.glide__slides{
    overflow: visible;
}

#fb7{
    font-family:Arial,sans-serif;
    font-size:14px;
    -webkit-text-size-adjust:none;
    position:relative;
    overflow:hidden;
    margin:0 auto;
    display:block;
    width:100%;
    height:300px;
    opacity:0;
    margin-bottom:30px;
}


/* =  Shadow for flipbook
--------------------------*/

#fb7 .fb7-shadow {
    height:100%;
    position:absolute;
    top:0px;
    box-shadow: 0px 0px 10px 1px #999;
    border-top-left-radius: 25px;
    border-bottom-left-radius: 25px;
    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;
}

#fb7 .fb7-shadow-double {
    width:100%;
    left:0%;
}

#fb7 .fb7-shadow-right {
    width:50%;
    left:50%;
    border-top-left-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
}

#fb7 .fb7-shadow-left {
    width:50%;
    left:0%;
    border-top-right-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
}


/* =  Gradient ( for right page )
--------------------------*/

#fb7 .turn-page.even .fb7-cont-page-book {

    background: -moz-linear-gradient(left,  rgba(0,0,0,0.27) 0%, rgba(255,255,255,0) 7%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0.27)), color-stop(7%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left,  rgba(0,0,0,0.27) 0%,rgba(255,255,255,0) 7%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left,  rgba(0,0,0,0.27) 0%,rgba(255,255,255,0) 7%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left,  rgba(0,0,0,0.27) 0%,rgba(255,255,255,0) 7%); /* IE10+ */
    background: linear-gradient(to right,  rgba(0,0,0,0.27) 0%,rgba(255,255,255,0) 7%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45000000', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 */


}

/* =  Gradient ( for left page )
--------------------------*/

#fb7 .turn-page.odd .fb7-cont-page-book {

    background: -moz-linear-gradient(right,  rgba(0,0,0,0.27) 0%, rgba(255,255,255,0) 7%); /* FF3.6+ */
    background: -webkit-gradient(linear, right top, right top, color-stop(0%,rgba(0,0,0,0.27)), color-stop(7%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(right,  rgba(0,0,0,0.27) 0%,rgba(255,255,255,0) 7%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(right,  rgba(0,0,0,0.27) 0%,rgba(255,255,255,0) 7%); /* Opera 11.10+ */
    background: -ms-linear-gradient(right,  rgba(0,0,0,0.27) 0%,rgba(255,255,255,0) 7%); /* IE10+ */
    background: linear-gradient(to left,  rgba(0,0,0,0.27) 0%,rgba(255,255,255,0) 7%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45000000', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 */



}


/* corner left page /*/

#fb7 .turn-page.odd{

    border-top-left-radius: 25px;
    border-bottom-left-radius: 25px;

    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;

}

/* corner right page /*/

#fb7 .turn-page.even{

    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;

    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;

}


#fb7.fullScreen,#fb7-ajax[data-template="true"] #fb7{
    margin-bottom:0;
}


#fb7 #fb7-container-book {
    position: absolute;
    z-index: 5;
    display: none;
    width: 1280px; height: 920px;
}


#fb7 fieldset{


}


#fb7 #fb7-deeplinking{
    display:none;
}


#fb7 .fb7-bcg-book{
    background: none no-repeat center center;
    background-size:cover;
    -moz-background-size:cover;
    -webkit-background-size:cover;
    width:100%;
    height:100%;
}

#test{
    margin:0 auto;
    width:100%;
}

#fb7 #page.mobile {
    width: 640px; height: 358px;
    margin: -210px 0 0 -275px;
}

#fb7 #page .padding { /*padding: 0 34px;*/ }






#fb7 .fb7-overlay {
    position: absolute; left: -10000px; top: 0; z-index: 20;

    /*background: url(../img/bg-overlay.png);/*/
    background:rgba(0,0,0,0);

    width: 100%; height: 100%;
    display:none;
}

#fb7 .fb7-overlay.active { left: 0; display:block; }


/* = Back button
-------------------------------------------------------------- */
#fb7 #fb7-button-back{

    text-decoration: none;

    font-family:Nunito,​sans-serif;

    color:#393939;
    position:absolute;
    left:-5px;
    top:45px;
    box-shadow:0 0 2px 2px #BEBEBE;

    background: -webkit-linear-gradient(#FFFFFF,#EAEAEA); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#FFFFFF,#EAEAEA); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#FFFFFF,#EAEAEA); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#FFFFFF,#EAEAEA); /* Standard syntax */

    border-radius: 5px 5px 5px 5px;
    border:1px solid #B9B9B9;
    padding:5px;
    padding-left:15px;
    padding-right:10px;
    font-size:12px;
    font-weight:bold;
    margin-top:-45px;
}


/* = About
-------------------------------------------------------------- */

#fb7 #fb7-about {
    position: absolute; z-index: 5;
    width: 45%; display: none;

    /*padding-top: 6%;/*/
}

#fb7 #fb7-about h1,
#fb7 #fb7-about h2,
#fb7 #fb7-about h3,
#fb7 #fb7-about h4,
#fb7 #fb7-about h5,
#fb7 #fb7-about h6 {
    margin: 0 0 2% 0;
    padding:0px;
    font-size: 1.375em;
    color: #64c8d3;
    -webkit-font-smoothing: antialiased;
    text-transform:none;
    font-weight:300;
}


#fb7 #fb7-about h1{
    /*background: url(../img/icons.png) no-repeat;/*/
    padding: 0 0 0px 0px;
}

#fb7 #fb7-about ul,#fb7-about ol {
    list-style:disc;
    margin: 0;
    padding-left:10px;
    padding-top:0%;
    padding-bottom:2%;
}

#fb7 #fb7-about li {
    color: #cfeaee;
    margin-bottom:4px;
}


#fb7 #fb7-about p {
    /*font-size: 0.688em;/*/
    color: #cfeaee;
    margin-bottom:8%;
    margin-top:0%;


}

#fb7 #fb7-about a {
    color:#ffffff;
    text-decoration:underline;
}

#fb7 #fb7-about a:hover {
    /*color:#ffffff;/*/
    text-decoration:none;
}



/* = Book
-------------------------------------------------------------- */

#fb7 #fb7-book {
    position: relative; z-index: 10;
    width: 100%; height:100%;
}

#fb7 #fb7-book .turn-page {
    background-color:#FFF;
    background-size: 100% 100%;
}

#fb7 .fb7-double {
    background-size: 200% 100% !important;
}

#fb7 .fb7-double.fb7-first {
    background-position: 0% 0%;
}

#fb7 .fb7-double.fb7-second {
    background-position: -100% 0%;
}








/* = Nav Arrows
---------------------------------------- */

#fb7 .fb7-nav-arrow {
    position: absolute; top: 50%; z-index: 15;
    /*background: url(../img/icons.png);/*/
    width: 158px; height: 100px;
    margin-top: -50px;
    cursor:pointer;
}

#fb7 .fb7-nav-arrow.next		{ right: 0px; background-position: -174px -205px; }
#fb7 .fb7-nav-arrow.next:hover	{ background-position: -174px -315px; }

#fb7 .fb7-nav-arrow.prev			{  background-position: 0px -205px ; display: none; }
#fb7 .fb7-nav-arrow.prev:hover	{ background-position: 0px -315px; }

#fb7 .fb7-nav-arrow.next{
    transform-origin:0 center;
    -ms-transform-origin:0 center;
    -webkit-transform-origin:0 center;
}

#fb7 .fb7-nav-arrow.prev{
    transform-origin:right center;
    -ms-transform-origin:right center;
    -webkit-transform-origin:right center;
}





/* = Cover
---------------------------------------- */



#fb7 #fb7-cover ul {
    position:absolute;
    top:50%;
    -webkit-transform: translate(0,-50%);
    -ms-transform: translate(0,-50%);
    -moz-transform: translate(0,-50%);
    -o-transform: translate(0,-50%);
    transform: translate(0,-50%);
    clear: both;
    width: 100%;
    list-style: none;
    padding: 20px 0;
    border-top: 1px solid #e2e2e2;
    border-bottom: 1px solid #e2e2e2;
}

#fb7 #fb7-cover ul:after { clear: both; content: ''; display: block; }

#fb7 #fb7-cover li {
    float: left;
    width: 28.3%;
    margin: 0 2.5%;
    list-style:none;
}



#fb7 #fb7-cover li:last-child {
    margin-right: 0;
}

#fb7 #fb7-cover li img {
    float: left;
    width: 100%;
}

#fb7 #fb7-cover li a:hover img {
    /*opacity: .8;/*/
}



/* = End
---------------------------------------- */

#fb7 #end { text-align: center; }

#fb7 #end p { padding-top: 60%; }



/* = Meta data
---------------------------------------- */

#fb7 #fb7-book .fb7-meta {
    position: absolute;
    bottom: 2%;
    left:48%;
    width:45px;
    height:45px;
    text-align: center;

    border-radius: 50%;
}






.fb7-cont-page-book{
    position:absolute;
}

#fb7 .fb7-page-book {

    position:absolute;
    -webkit-hyphens:none;
    -moz-hyphens:none;
    -ms-hyphens:none;
    hyphens:none;
    overflow:hidden;
}











#fb7 .fb7-nav-arrow,#fb7 .fb7-menu li {
    background:url(../img/icons.png) no-repeat;
}

/*页边角*/
#fb7 .fb7-shadow {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}







