@keyframes fade-out {
    0% {
        opacity: 0;
        -moz-opacity: 0;
    }
    100% {
        opacity: 1;
        -moz-opacity: 1;
    }
}

@keyframes fade-in{
    0% {
        opacity: 1;
        -moz-opacity: 1;
    }
    100% {
        opacity: 0;
        -moz-opacity: 0;
    }
}

@font-face {
    font-family: 'kai';
    src: url('https://cdn.jsdelivr.net/gh/youthred/chinese-colors@master/resources/font/simkai.ttf') format('truetype');
}

body::-webkit-scrollbar {
    display: none;
}

.container {
    width: 100%;
    font-family: KaiTi, kai, sans-serif;
    /*font-weight: bold;*/
    /*font-size: larger;*/
    background-image: url("https://cdn.jsdelivr.net/gh/youthred/chinese-colors@master/resources/pic/texture.png");
    background-repeat: repeat;
    transition: all .5s ease-in;
    -webkit-transition: all .5s ease-in; /*如果作用在body上，则在移动端是不生效的，搞不懂啊*/
    -moz-transition: all .5s ease-in;
    -ms-transition: all .5s ease-in;
    -o-transition: all .5s ease-in;
}

.color-grid-pinyin {
    font-family: "Microsoft Yahei", sans-serif;
    /*font-style: italic;*/
    /*font-weight: bold;*/
}

.font-bg {
    background-image: url("https://cdn.jsdelivr.net/gh/youthred/chinese-colors@master/resources/pic/texture.png");
    background-color: currentColor;
}

.font-bg-fontcolor {
    filter: grayscale(1) contrast(999) invert(1);
    word-wrap: break-word;
}

.inline-block {
    display: inline-block;
}

.block {
    display: block;
}

.fixed-right-top {
    position: fixed !important;
    right: 16px;
    top: 16px
}

.word-bigscreen {
    writing-mode: vertical-rl;
    color: white;
}

.mdui-grid-tile {
    transition: all .2s;
}

.mdui-grid-tile:hover {
    transform: scale(0.9);
    /*z-index: 999;*/
}

/*#wordBigscreenColorname:hover,#wordBigscreenJieqi:hover {*/
/*    animation: fade-out 2s;*/
/*}*/

.anime-fade-out {
    animation: fade-out 5s;
    -webkit-animation: fade-out 5s;
    -moz-animation: fade-out 5s;
    -o-animation: fade-out 5s;
}

.anime-fade-in {
    animation: fade-in 5s;
    -webkit-animation: fade-in 5s;
    -moz-animation: fade-in 5s;
    -o-animation: fade-in 5s;
}