@charset "UTF-8";

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

@import "plugin/nprogress";

@import "page/match.scss";

@import "page/hero.scss";

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

html,body{
    width: 100%;
    height: 100%;
    background-color: #efefef;
    font-family: Microsoft Yahei,sans-serif;
    a{
        text-decoration: none;
    }
}
#app{
min-height: px2rem(1334);
transform: translate3d(0, 0, 0);
-webkit-overflow-scrolling: touch;
}

.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{
    min-height: 100%;
    position: relative;
    background-color: #efefef;
    &: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);
    }
}
