@charset "UTF-8";

@import "base/reset";
@import "base/mixins";
// @import "base/ui-dialog";

@import "plugin/nprogress";

@import "page/share.scss";
@import "page/download.scss";

.fade-transition {
    transition: opacity .3s ease;
}
.fade-enter, .fade-leave {
    opacity: 0;
}

.fade-enter-active, .fade-leave-active {
  	transition: opacity .4s ease;
}
.fade-enter, .fade-leave-to {
  	opacity: 0
}

.common-transit{
    transition: transform 300ms;
}
.common-enter, .common-leave-active {
    opacity: 0;
    transform: translate3d(0, 300px, 0);
}
.common-leave-active {
    position: absolute;
}

html,body{
    background-color: #ffffff;
    font-family: Microsoft Yahei,sans-serif;
    height: 100%;
    a{
        text-decoration: none;
    }
}
#app{
-webkit-overflow-scrolling: touch;
height: 100%;
}

.hidden{
    display: none;
}

.o-wrap{
    position: relative;
    height: 100%;
}

.o-wrapout{
    width: 100%;
    height: 100%;
}

.hide_nav .o-container {
  padding-bottom: 0;
}

.hide_nav .o-nav {
  display: none;
}

.o-container{
    position: relative;
    background-color: #efefef;
    height: 100%;
    max-width: 750px;
    margin: 0 auto;
    &:after{
        position: fixed;
        z-index: 11;
        content: "";
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: #000;
        opacity: 0;
        display: none;
        transition: opacity .2s ease;
    }
        
    &.o-rendering{
        &:after{
            opacity: 0.75;
            display: block;
            transition: opacity .2s ease;
        }
    }
    &.o-trans-fading{
        -webkit-transition: -webkit-transform .5s ease;
        transition: transform .5s ease;
        position: fixed;
        -webkit-transform: translate3d(100%, 0px, 0px);
        transform: translate3d(100%, 0px, 0px);
    }
}