﻿* {
    margin: 0;
    padding: 0;
}

a {
    text-decoration: none;
}

ul,
li {
    list-style: none;
}

body {
    color: #373737;
    font-size: 14px;
    font-family: Microsoft YaHei, Arial;
    background-color: #181818;
}
.img-list {
    img {
        width: 30%;
        max-width: 80px;
        display: inline-block;
    }
}

@media screen and (max-width: 480px) {
    .main {
        width: 100%;
        background-color: #000;
        margin: 0 auto;
        position: relative;
    }

    .main .h1-header {
        width: 100%;
        height: 95px;
        background: url("../image/header-bg.jpg") center no-repeat;
    }

    .main .header {
        width: 100%;
        height: 95px;
        display: block;
        font-size: 0;
        line-height: 0;
    }

    .main .nav {
        width: 100%;
        overflow-x: auto;
    }

    .main .nav ul {
        width: 120%;
        height: 2rem;
        margin: 12px auto;
        display: flex;
        flex-wrap: nowrap;
        justify-content: space-between;
    }

    .main .nav ul li {
        width: 16.5%;
        height: 2rem;
        display: inline-block;
        overflow: hidden;
    }

    .main .nav ul li a {
        width: 100%;
        height: 100%;
        display: block;
        background-color: #0a0c0a;
        color: #71bee3;
        text-align: center;
        line-height: 2rem;
    }
    .main .nav ul li a span {
        display: none;
    }

    /* .main .nav ul li a.select {
        border-top: 1px solid;
        border-image: linear-gradient(to left, #0a0a0a, #07a1e1, #0a0a0a) 1;
        background: linear-gradient(to left, #0a0a0a, #095463, #0a0a0a);
    } */

    .main .nav ul li a:hover {
        border-top: 1px solid;
        border-image: linear-gradient(to left, #0a0a0a, #07a1e1, #0a0a0a) 1;
        background: linear-gradient(to left, #0a0a0a, #095463, #0a0a0a);
    }

    .main .nav .baccarat {
        background: url("../image/百家乐--默认.png") no-repeat;
        background-size: 110% 110%;
    }

    .main .nav .baccarat:hover {
        background: url("../image/百家乐--选中.png") no-repeat;
        background-size: 110% 110%;
    }

    .main .nav .dragontiger {
        background: url("../image/龙虎--默认.png") no-repeat;
        background-size: 110% 110%;
    }

    .main .nav .dragontiger:hover {
        background: url("../image/龙虎--选中.png") no-repeat;
        background-size: 110% 110%;
    }

    .main .nav .roulette {
        background: url("../image/轮盘--默认.png") no-repeat;
        background-size: 110% 110%;
    }

    .main .nav .roulette:hover {
        background: url("../image/轮盘--选中.png") no-repeat;
        background-size: 110% 110%;
    }

    .main .nav .sicbo {
        background: url("../image/骰宝--默认.png") no-repeat;
        background-size: 110% 110%;
    }

    .main .nav .sicbo:hover {
        background: url("../image/骰宝--选中.png") no-repeat;
        background-size: 110% 110%;
    }

    .main .nav .cowcow {
        background: url("../image/牛牛--默认.png") no-repeat;
        background-size: 110% 110%;
    }

    .main .nav .cowcow:hover {
        background: url("../image/牛牛--选中.png") no-repeat;
        background-size: 110% 110%;
    }

    .main .nav .win3cards {
        background: url("../image/炸金花--默认.png") no-repeat;
        background-size: 110% 110%;
    }

    .main .nav .win3cards:hover {
        background: url("../image/炸金花--选中.png") no-repeat;
        background-size: 110% 110%;
    }

    .main .nav .colorDisc {
        background: url("../image/色碟--默认.png") no-repeat;
        background-size: 110% 110%;
    }

    .main .nav .colorDisc:hover {
        background: url("../image/色碟--选中.png") no-repeat;
        background-size: 110% 110%;
    }

    .main .main-container {
        background-color: #fff;
    }

    .main .main-container .game-name {
        width: 100%;
        height: 74px;
        display: block;
        text-indent: -9999px;
    }

    .main .main-container .img-baccarat {
        background: url("../image/百家乐--title.png") no-repeat;
    }

    .main .main-container .img-dragontiger {
        background: url("../image/龙虎--title.png") no-repeat;
    }

    .main .main-container .img-roulette {
        background: url("../image/轮盘--title.png") no-repeat;
    }

    .main .main-container .img-sicbo {
        background: url("../image/骰宝--title.png") no-repeat;
    }

    .main .main-container .img-cowcow {
        background: url("../image/牛牛--title.png") no-repeat;
    }

    .main .main-container .img-win3cards {
        background: url("../image/炸金花--title.png") no-repeat;
    }

    .main .main-container .img-colorDisc {
        background: url("../image/色碟--title.png") no-repeat;
    }

    .main .main-container .content {
        width: 100%;
        font-family: Microsoft YaHei;
        margin: 0 auto;
        padding-top: 20px;
        padding-bottom: 25px;
    }

    .main .main-container .content .rule-name {
        margin-bottom: 10px;
        background: url("../image/arrow.png") top left no-repeat;
        padding: 0px 10px 0 25px;
    }

    .main .main-container .content .rule-name span {
        display: inline-block;
    }

    .main .main-container .content .rule-name .icon-pointer {
        width: 19px;
        height: 25px;
        margin-right: 5px;
        display: inline-block;
        background: url("../image/img-game-rule.png") no-repeat;
        background-position: -5px -171px;
    }

    .main .main-container .content .rule-name .name {
        font-size: 18px;
        font-weight: bold;
        line-height: 25px;
        color: #000;
        margin-right: 5px;
    }

    .main .main-container .content .rule-name .e-name {
        font-size: 14px;
        font-weight: normal;
        line-height: 30px;
        color: #d79200;
    }

    .main .main-container .content .txt {
        padding: 14px 20px;
        background-color: #e9e9e9;
    }

    .main .main-container .content .txt li {
        line-height: 25px;
        display: flex;
        align-items: flex-start;
        margin-bottom: 2px;
    }

    .main .main-container .content .txt li .unicode {
        font-size: 18px;
        margin-right: 6px;
        margin-top: 2px;
        line-height: 1;
    }

    .main .main-container .content .txt li .left-tip {
        min-width: 90px;
    }

    .main .main-container .content .txt li p {
        width: 94%;
        margin: 0 auto;
    }

    .main .main-container .content .table {
        width: 100%;
        color: #000;
        font-size: 12px;
        font-weight: normal;
        text-align: center;
        border-right: 1px solid #666;
        border-top: 1px solid #666;
        border-collapse: collapse;
    }

    .main .main-container .content .table .title {
        color: #fff;
        background-color: #666;
    }

    .main .main-container .content .table tr {
        height: 30px;
    }

    .main .main-container .content .table td {
        line-height: 25px;
        border-left: 1px solid #666;
        border-bottom: 1px solid #666;
    }

    .main .main-container .content .table .line1,
    .main .main-container .content .table .line2 {
        width: 30%;
    }

    .main .main-container .content .table .line1,
    .main .main-container .content .table .line2,
    .main .main-container .content .table .line3,
    .main .main-container .content .table .line4 {
        padding: 5px 0.4rem;
        min-width: 20%;
    }

    .width-limit {
        width: 20% !important;
    }
    .text-style {
        width: 96%;
        margin: 0 auto;
    }

    .main .main-container .content .table .width140 {
        width: 20%;
    }

    .main .main-container .content .table .width300 {
        width: 40%;
    }

    .main .main-container .content .fixwidth {
        width: 100%;
    }

    .main .main-container .content .text-left {
        text-align: left;
    }

    .main .main-container .content .text-center {
        text-align: center;
    }

    .main .main-container .content .margin-bottom30 {
        margin-bottom: 30px;
    }

    .main .footer {
        padding: 10px 0;
        color: #767676;
        text-align: center;
    }

    .main .go-top {
        width: 33px;
        height: 34px;
        background: url("../image/img-game-rule.png") no-repeat;
        background-position: -5px -124px;
        right: 10px;
        position: absolute;
    }

    .odd {
        background-color: #ccc;
    }

    .even {
        background-color: #fff;
    }

    .clear-float {
        clear: both;
    }
}

@media screen and (width > 480px) {
    .main {
        width: 1000px;
        background-color: #000;
        margin: 0 auto;
        position: relative;
    }

    .main .h1-header {
        width: 100%;
        height: 95px;
        background: url("../image/header-bg.jpg") no-repeat;
    }

    .main .header {
        width: 1000px;
        height: 95px;
        display: block;
        font-size: 0;
        line-height: 0;
    }

    .main .nav ul {
        height: 49px;
        margin: 12px auto;
        display: inline-block;
        left: 50%;
        margin-left: -500px;
        position: relative;
    }

    .main .nav ul li {
        height: 49px;
        margin: 0 3px;
        display: inline-block;
        *float: left;
    }

    .main .nav ul li a {
        width: 134.5px;
        height: 49px;
        display: inline-block;
    }

    .main .nav .baccarat {
        background: url("../image/百家乐--默认.png") no-repeat;
    }

    .main .nav .baccarat:hover {
        background: url("../image/百家乐--选中.png") no-repeat;
    }

    .main .nav .dragontiger {
        background: url("../image/龙虎--默认.png") no-repeat;
    }

    .main .nav .dragontiger:hover {
        background: url("../image/龙虎--选中.png") no-repeat;
    }

    .main .nav .roulette {
        background: url("../image/轮盘--默认.png") no-repeat;
    }

    .main .nav .roulette:hover {
        background: url("../image/轮盘--选中.png") no-repeat;
    }

    .main .nav .sicbo {
        background: url("../image/骰宝--默认.png") no-repeat;
    }

    .main .nav .sicbo:hover {
        background: url("../image/骰宝--选中.png") no-repeat;
    }

    .main .nav .cowcow {
        background: url("../image/牛牛--默认.png") no-repeat;
    }

    .main .nav .cowcow:hover {
        background: url("../image/牛牛--选中.png") no-repeat;
    }

    .main .nav .win3cards {
        background: url("../image/炸金花--默认.png") no-repeat;
        background-size: 110% 110%;
    }

    .main .nav .win3cards:hover {
        background: url("../image/炸金花--选中.png") no-repeat;
        background-size: 110% 110%;
    }

    .main .nav .colorDisc {
        background: url("../image/色碟--默认.png") no-repeat;
        background-size: 110% 110%;
    }

    .main .nav .colorDisc:hover {
        background: url("../image/色碟--选中.png") no-repeat;
        background-size: 110% 110%;
    }

    .main .main-container {
        background-color: #fff;
    }

    .main .main-container .game-name {
        width: 1000px;
        height: 74px;
        display: block;
        text-indent: -9999px;
    }

    .main .main-container .img-baccarat {
        background: url("../image/百家乐--title.png") no-repeat;
    }

    .main .main-container .img-dragontiger {
        background: url("../image/龙虎--title.png") no-repeat;
    }

    .main .main-container .img-roulette {
        background: url("../image/轮盘--title.png") no-repeat;
    }

    .main .main-container .img-sicbo {
        background: url("../image/骰宝--title.png") no-repeat;
    }

    .main .main-container .img-cowcow {
        background: url("../image/牛牛--title.png") no-repeat;
    }

    .main .main-container .img-win3cards {
        background: url("../image/炸金花--title.png") no-repeat;
    }

    .main .main-container .img-colorDisc {
        background: url("../image/色碟--title.png") no-repeat;
    }

    .main .main-container .content {
        width: 900px;
        font-family: Microsoft YaHei;
        margin: 0 auto;
        padding-top: 20px;
        padding-bottom: 25px;
    }

    .main .main-container .content .rule-name {
        height: 25px;
        margin-bottom: 10px;
        padding-left: 25px;
        background: url("../image/arrow.png") no-repeat;
    }

    .main .main-container .content .rule-name span {
        float: left;
    }

    .main .main-container .content .rule-name .icon-pointer {
        width: 19px;
        height: 25px;
        margin-right: 5px;
        display: inline-block;
        background: url("../image/arrow.png") no-repeat;
    }

    .main .main-container .content .rule-name .name {
        font-size: 18px;
        font-weight: bold;
        line-height: 25px;
        color: #000;
        margin-right: 5px;
    }

    .main .main-container .content .rule-name .e-name {
        font-size: 14px;
        font-weight: normal;
        line-height: 30px;
        color: #d79200;
    }

    .main .main-container .content .txt {
        padding: 14px 20px;
        background-color: #e9e9e9;
    }

    .main .main-container .content .txt li {
        line-height: 25px;
        display: flex;
        align-items: flex-start;
        margin-bottom: 2px;
    }

    .main .main-container .content .txt li .unicode {
        font-size: 20px;
        line-height: 20px;
        margin-right: 5px;
        float: left;
    }

    .main .main-container .content .txt li .left-tip {
        min-width: 90px;
    }

    .main .main-container .content .txt li p {
        width: 100%;
    }

    .main .main-container .content .table {
        width: 695px;
        color: #000;
        font-size: 12px;
        font-weight: normal;
        text-align: center;
        border-right: 1px solid #666;
        border-top: 1px solid #666;
        border-collapse: collapse;
    }

    .main .main-container .content .table .title {
        color: #fff;
        background-color: #666;
    }

    .main .main-container .content .table tr {
        height: 30px;
    }

    .main .main-container .content .table td {
        line-height: 25px;
        border-left: 1px solid #666;
        border-bottom: 1px solid #666;
    }

    .main .main-container .content .table .line1,
    .main .main-container .content .table .line2 {
        width: 113px;
    }

    .main .main-container .content .table .line1,
    .main .main-container .content .table .line2,
    .main .main-container .content .table .line3,
    .main .main-container .content .table .line4 {
        padding: 5px 10px;
    }

    .main .main-container .content .table .width140 {
        width: 140px;
    }

    .main .main-container .content .table .width300 {
        width: 300px;
    }

    .main .main-container .content .fixwidth {
        width: 100%;
    }

    .main .main-container .content .text-left {
        text-align: left;
    }

    .main .main-container .content .text-center {
        text-align: center;
    }

    .main .main-container .content .margin-bottom30 {
        margin-bottom: 30px;
    }

    .main .footer {
        padding: 10px 0;
        color: #767676;
        text-align: center;
    }

    .main .go-top {
        width: 33px;
        height: 34px;
        background: url("../image/top_arrow.png") no-repeat;
        right: 10px;
        position: absolute;
    }

    .odd {
        background-color: #ccc;
    }

    .even {
        background-color: #fff;
    }

    .clear-float {
        clear: both;
    }
}
