@font-face {
    font-family: 'apple-font';
    src: url("../fonts/PingFang Medium.ttf");
}
@font-face {
    font-family: 'Hiragino';
    src: url("../fonts/Hiragino Sans GB.ttf");
}
@font-face {
    font-family: Yahei;
    src: url("../fonts/msyh.ttf");
}
body{
    padding: 0;
    margin: 0;
    font-family: Tahoma,Arial,'Hiragino Sans GB', 'Microsoft Yahei','\5b8b\4f53',sans-serif;
    font-size:100%;
    width: 100%;
    height: 100%;
}
*{
    box-sizing: border-box;
}

h2 {
    font-size: 2.25rem; /*36px*/
}
h3{
    font-size: 1.875rem; /*30px*/
}
h4{
    font-size: 1.5rem; /*24px*/
}

p{
    /*font-size: .875rem; !*14px*!*/
}

a {
    text-decoration: none;
}

a:hover, a:focus {
    text-decoration: none;
    outline: none;
}
ul{
    list-style: none;
}



.bg-danger{
    color: #000000;
}
.bg-danger:hover{
    color: #ffffff;
}

.my-button{
    width: 110px;
    height: 40px;
    color: #ffffff;
    font-size: 16px;
    background-color: #d93b3d;
    box-shadow: 0 0 8px 0
    rgba(72, 0, 0, 0.3);
    border-radius: 30px;
    padding-top: .35rem;
    padding-bottom: .35rem;
}
.my-button:hover{
    color: #ffffff;
    background-color: #fa4347;
}
.my-button:visited{
    background-color: #a12b2d;
}
.my-button:focus{
    background-color: #a12b2d;
}

.btn:focus{
    box-shadow: 0px 0px 20px 0px
    rgba(72, 0, 0, 0.3);
}

/*==========================================mobile style============================================*/
@media (max-width: 768px) {
    body{
        font-family: apple-font,android-font,sans-serif;
    }
    .my-button{
        width: 100px;
        height: 36px;
        color: #ffffff;
        font-size: 14px;
        background-color: #d93b3d;
        box-shadow: 0px 0px 8px 0px
        rgba(72, 0, 0, 0.3);
        border-radius: 30px;
    }
    .my-button:hover{
        color: #ffffff;
        background-color: #a12b2d;
    }
    .my-button:focus{
        background-color: #a12b2d;
    }
    .my-button:visited{
        background-color: #a12b2d;
    }
}