﻿body {
    font: 12px/22px 'Microsoft YaHei',YouYuan,Verdana, Geneva, sans-serif;
    line-height: 1.5;
    width: auto;
    height: auto;
    padding: 0;
    margin: 0 auto !important;
    overflow-x: hidden;
    overflow-y: auto;
    min-width: 320px;
    max-width: 1920px;
}

.con {
    position: relative;
    width: auto;
    height: auto;
    max-width: 1200px;
    padding: 0;
    margin: 0 auto;
    background-color: transparent;
    padding-bottom: 50px;
}

    .con .dhbox {
        padding: 10px 0 10px 0;
    }

        .con .dhbox a {
            color: #000;
            font-size: 1rem;
        }

            .con .dhbox a:hover {
                text-decoration: none;
                color: orangered;
            }

        .con .dhbox .dhclass {
            color: #818181;
            font-size: 1rem;
        }

    .con .demo1tt {
        padding: 50px 0 20px 0;
        font-weight: 600;
        font-size: 1.6rem;
    }

    .con .demo1tt2 {
        padding: 0 0 20px 0;
        font-weight: 600;
        font-size: 1.6rem;
    }

    .con .demo1 {
        position: relative;
        margin-left: -10px;
        margin-right: -10px;
        padding: 0;
    }

        .con .demo1 li {
            padding: 10px;
        }

        .con .demo1 .box {
            padding: 0 0 10px 0;
            border-radius: 5px 5px 0 0;
        }

            .con .demo1 .box a {
                color: #333;
                font-size: 1rem;
                text-decoration: none;
            }

            .con .demo1 .box img {
                border-radius: 5px 5px 0 0;
            }

            .con .demo1 .box a h5 {
                color: #333;
                font-size: 1rem;
                padding: 0 10px 0 10px;
            }

            .con .demo1 .box a:hover .title {
                color: orangered;
            }

            .con .demo1 .box .title {
                position: relative;
                display: block !important;
                color: #333;
                font-size: 1rem;
                text-align: left;
                text-shadow: none;
                padding-bottom: 0;
                text-overflow: -o-ellipsis-lastline;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 1;
                line-clamp: 1;
                -webkit-box-orient: vertical;
                height: auto;
            }

            .con .demo1 .box .imgbox {
                position: relative;
                width: 100%;
                height: auto;
            }

                .con .demo1 .box .imgbox .count {
                    display: -ms-flexbox;
                    display: flex;
                    -ms-flex-align: center;
                    align-items: center;
                    position: absolute;
                    bottom: 0;
                    width: 100%;
                    padding: 6px 8px;
                    -ms-flex-pack: justify;
                    justify-content: space-between;
                    color: #fff;
                    line-height: 16px;
                    border-bottom-right-radius: 5px;
                    border-bottom-left-radius: 5px;
                    -webkit-text-stroke: 1px #666;
                    font-weight: 900;
                }

            .con .demo1 .box .desc {
                color: #6d6d6d;
                font-size: 0.9rem;
                padding: 0 10px 0 10px;
                text-overflow: -o-ellipsis-lastline;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                line-clamp: 2;
                -webkit-box-orient: vertical;
            }

    .con .demo2 {
        position: relative;
        margin-left: -10px;
        margin-right: -10px;
        padding: 0;
    }

        .con .demo2 li {
            padding: 8px;
        }

            .con .demo2 li a {
                color: #333;
                font-size: 1rem;
                text-decoration: none;
            }

            .con .demo2 li img {
                border-radius: 5px;
            }

            .con .demo2 li a:hover img {
                box-shadow: 0px 0px 20px 3px rgba(80, 80, 80, 0.6);
                -webkit-transform: translateY(-5px);
                -moz-transform: translateY(-5px);
                -ms-transform: translateY(-5px);
                -o-transform: translateY(-5px);
                transform: translateY(-5px);
                transition: 0.1s;
                transition-duration: 0.1s;
            }

            .con .demo2 li a:hover .title {
                color: orangered;
            }

            .con .demo2 li .title {
                position: relative;
                display: block !important;
                color: #333;
                font-size: 1rem;
                text-align: left;
                text-shadow: none;
                padding-bottom: 0;
                text-overflow: -o-ellipsis-lastline;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 1;
                line-clamp: 1;
                -webkit-box-orient: vertical;
                height: auto;
            }

            .con .demo2 li .imgbox {
                position: relative;
                width: 100%;
                height: auto;
            }

                .con .demo2 li .imgbox .count {
                    display: -ms-flexbox;
                    display: flex;
                    -ms-flex-align: center;
                    align-items: center;
                    position: absolute;
                    bottom: 0;
                    width: 100%;
                    padding: 6px 8px;
                    -ms-flex-pack: justify;
                    justify-content: space-between;
                    color: #fff;
                    line-height: 16px;
                    border-bottom-right-radius: 5px;
                    border-bottom-left-radius: 5px;
                    -webkit-text-stroke: 1px #666;
                    font-weight: 900;
                }

            .con .demo2 li .desc {
                position: relative;
                font-size: 0.9rem;
                text-align: left;
                color: #6d6d6d;
                text-overflow: -o-ellipsis-lastline;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                line-clamp: 2;
                -webkit-box-orient: vertical;
            }

            .con .demo2 li .desc2 {
                position: relative;
                font-size: 0.9rem;
                text-align: left;
                color: #6d6d6d;
                text-overflow: -o-ellipsis-lastline;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 1;
                line-clamp: 1;
                -webkit-box-orient: vertical;
            }


    .con .demo3 .LeftBox {
        position: relative;
        width: 80%;
        float: left;
        padding-right: 60px;
    }

    .con .demo3 .RightBox {
        position: relative;
        width: 20%;
        float: right;
        padding-left: 20px;
    }

    .con .demo4 {
        padding: 0;
        margin-left: -5px;
        margin-right: -5px;
    }

        .con .demo4 .liTop {
            padding: 0 0 50px 0;
            border-bottom: 1px solid #ccc;
        }

        .con .demo4 .liCenter {
            padding: 50px 0 50px 0;
            border-bottom: 1px solid #ccc;
        }

        .con .demo4 .liBottom {
            padding: 50px 0 0 0;
        }

        .con .demo4 img {
            border-radius: 5px;
        }

        .con .demo4 .item-img {
            float: left;
            width: 45%;
        }

            .con .demo4 .item-img .imgbox {
                position: relative;
                width: 100%;
                height: auto;
            }

                .con .demo4 .item-img .imgbox .count {
                    display: -ms-flexbox;
                    display: flex;
                    -ms-flex-align: center;
                    align-items: center;
                    position: absolute;
                    bottom: 0;
                    width: 100%;
                    padding: 6px 8px;
                    -ms-flex-pack: justify;
                    justify-content: space-between;
                    color: #fff;
                    line-height: 16px;
                    border-bottom-right-radius: 5px;
                    border-bottom-left-radius: 5px;
                    -webkit-text-stroke: 1px #666;
                    font-weight: 900;
                }

        .con .demo4 .item-main {
            width: 55%;
            float: right;
            padding: 0 10px 0 20px;
        }

            .con .demo4 .item-main .am-gallery-title {
                display: block!important;
                font-size: 1rem;
                text-align: left;
                color: #333;
                margin-top: 0;
                text-overflow: -o-ellipsis-lastline;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 1;
                line-clamp: 1;
                -webkit-box-orient: vertical;
            }

            .con .demo4 .item-main a {
                text-decoration:none;
            }

                .con .demo4 .item-main a:hover .am-gallery-title {
                    color: orangered;
                    text-decoration: none;
                }

            .con .demo4 .item-main .am-gallery-desc {
                margin-top: 5px;
                font-size: 0.8rem;
                text-align: left;
                color: #6d6d6d;
                line-height: 1.6;
                letter-spacing: 1px;
                text-overflow: -o-ellipsis-lastline;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 4;
                line-clamp: 4;
                -webkit-box-orient: vertical;
            }

    .con .demo6 .bigbox .lbox {
        position: relative;
        margin-left: -10px;
        margin-right: -10px;
        padding: 0;
    }

        .con .demo6 .bigbox .lbox li {
            padding: 0;
        }

            .con .demo6 .bigbox .lbox li a {
                color: #333;
                font-size: 1rem;
                text-decoration: none;
            }

            .con .demo6 .bigbox .lbox li img {
                border-radius: 5px;
            }

            .con .demo6 .bigbox .lbox li a:hover img {
                box-shadow: 0px 0px 20px 3px rgba(80, 80, 80, 0.6);
                -webkit-transform: translateY(-5px);
                -moz-transform: translateY(-5px);
                -ms-transform: translateY(-5px);
                -o-transform: translateY(-5px);
                transform: translateY(-5px);
                transition: 0.1s;
                transition-duration: 0.1s;
            }

            .con .demo6 .bigbox .lbox li a:hover .title {
                color: orangered;
            }

            .con .demo6 .bigbox .lbox li .title {
                position: relative;
                display: block !important;
                color: #333;
                font-size: 1rem;
                text-align: left;
                text-shadow: none;
                padding-bottom: 0;
                text-overflow: -o-ellipsis-lastline;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 1;
                line-clamp: 1;
                -webkit-box-orient: vertical;
                height: auto;
            }

            .con .demo6 .bigbox .lbox li .imgbox {
                position: relative;
                width: 100%;
                height: auto;
            }

                .con .demo6 .bigbox .lbox li .imgbox .count {
                    display: -ms-flexbox;
                    display: flex;
                    -ms-flex-align: center;
                    align-items: center;
                    position: absolute;
                    bottom: 0;
                    width: 100%;
                    padding: 6px 8px;
                    -ms-flex-pack: justify;
                    justify-content: space-between;
                    color: #fff;
                    line-height: 16px;
                    border-bottom-right-radius: 5px;
                    border-bottom-left-radius: 5px;
                    -webkit-text-stroke: 1px #666;
                    font-weight: 900;
                }

            .con .demo6 .bigbox .lbox li .desc {
                position: relative;
                font-size: 0.9rem;
                text-align: left;
                color: #6d6d6d;
                text-overflow: -o-ellipsis-lastline;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 3;
                line-clamp: 3;
                -webkit-box-orient: vertical;
            }

    .con .demo6 .bigbox {
        position: relative;
        width: 40%;
        float: left;
    }

    .con .demo6 .smallbox {
        position: relative;
        width: 60%;
        float: right;
        padding-left: 40px;
    }

        .con .demo6 .smallbox .rbox {
            position: relative;
            margin: -10px;
            padding: 0;
        }

            .con .demo6 .smallbox .rbox li {
                padding: 8px;
            }

                .con .demo6 .smallbox .rbox li a {
                    color: #333;
                    font-size: 1rem;
                    text-decoration: none;
                }

                .con .demo6 .smallbox .rbox li img {
                    border-radius: 5px;
                }

                .con .demo6 .smallbox .rbox li a:hover img {
                    box-shadow: 0px 0px 20px 3px rgba(80, 80, 80, 0.6);
                    -webkit-transform: translateY(-5px);
                    -moz-transform: translateY(-5px);
                    -ms-transform: translateY(-5px);
                    -o-transform: translateY(-5px);
                    transform: translateY(-5px);
                    transition: 0.1s;
                    transition-duration: 0.1s;
                }

                .con .demo6 .smallbox .rbox li a:hover .title {
                    color: orangered;
                }

                .con .demo6 .smallbox .rbox li .title {
                    position: relative;
                    display: block !important;
                    color: #333;
                    font-size: 1rem;
                    text-align: left;
                    text-shadow: none;
                    padding-bottom: 0;
                    text-overflow: -o-ellipsis-lastline;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    display: -webkit-box;
                    -webkit-line-clamp: 1;
                    line-clamp: 1;
                    -webkit-box-orient: vertical;
                    height: auto;
                }

                .con .demo6 .smallbox .rbox li .imgbox {
                    position: relative;
                    width: 100%;
                    height: auto;
                }

                    .con .demo6 .smallbox .rbox li .imgbox .count {
                        display: -ms-flexbox;
                        display: flex;
                        -ms-flex-align: center;
                        align-items: center;
                        position: absolute;
                        bottom: 0;
                        width: 100%;
                        padding: 6px 8px;
                        -ms-flex-pack: justify;
                        justify-content: space-between;
                        color: #fff;
                        line-height: 16px;
                        border-bottom-right-radius: 5px;
                        border-bottom-left-radius: 5px;
                        -webkit-text-stroke: 1px #666;
                        font-weight: 900;
                    }

                .con .demo6 .smallbox .rbox li .desc {
                    position: relative;
                    font-size: 0.9rem;
                    text-align: left;
                    color: #6d6d6d;
                    text-overflow: -o-ellipsis-lastline;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    display: -webkit-box;
                    -webkit-line-clamp: 1;
                    line-clamp: 1;
                    -webkit-box-orient: vertical;
                }

    .con .demo7 {
        padding-top: 50px;
    }

        .con .demo7 .LeftBox {
            position: relative;
            width: 60%;
            float: left;
            padding-right: 40px;
        }

        .con .demo7 .RightBox {
            position: relative;
            width: 40%;
            float: right;
            padding-left: 40px;
            border-left: 1px solid #ccc;
        }

    .con .demo8 {
        position: relative;
        margin-left: -10px;
        margin-right: -10px;
        padding: 0;
    }

        .con .demo8 .box {
            height: 340px;
            padding: 0;
            border-radius: 5px 5px 0 0;
        }

            .con .demo8 .box a {
                color: #333;
                font-size: 1rem;
                text-decoration: none;
            }

            .con .demo8 .box img {
                border-radius: 5px 5px 0 0;
            }

            .con .demo8 .box a h5 {
                color: #333;
                font-size: 1rem;
                padding: 0 10px 0 10px;
            }

            .con .demo8 .box a:hover .title {
                color: orangered;
            }

            .con .demo8 .box .title {
                position: relative;
                display: block !important;
                color: #333;
                font-size: 1rem;
                text-align: left;
                text-shadow: none;
                padding-bottom: 0;
                text-overflow: -o-ellipsis-lastline;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 1;
                line-clamp: 1;
                -webkit-box-orient: vertical;
                height: auto;
            }

            .con .demo8 .box .imgbox {
                position: relative;
                width: 100%;
                height: auto;
            }

                .con .demo8 .box .imgbox .count {
                    display: -ms-flexbox;
                    display: flex;
                    -ms-flex-align: center;
                    align-items: center;
                    position: absolute;
                    bottom: 0;
                    width: 100%;
                    padding: 6px 8px;
                    -ms-flex-pack: justify;
                    justify-content: space-between;
                    color: #fff;
                    line-height: 16px;
                    border-bottom-right-radius: 5px;
                    border-bottom-left-radius: 5px;
                    -webkit-text-stroke: 1px #666;
                    font-weight: 900;
                }

            .con .demo8 .box .desc {
                color: #6d6d6d;
                font-size: 0.9rem;
                padding: 0 10px 0 10px;
                text-overflow: -o-ellipsis-lastline;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 7;
                line-clamp: 7;
                -webkit-box-orient: vertical;
            }

    .con .demo10 {
        padding: 0;
        margin-left: -5px;
        margin-right: -5px;
    }

        .con .demo10 .borderbox {
            padding: 20px 10px 20px 10px;
            border: 1px solid #ccc;
            border-radius: 5px;
        }

            .con .demo10 .borderbox img {
                border-radius: 5px;
            }

            .con .demo10 .borderbox .item-img {
                float: left;
                width: 45%;
            }

                .con .demo10 .borderbox .item-img .imgbox {
                    position: relative;
                    width: 100%;
                    height: auto;
                }

                    .con .demo10 .borderbox .item-img .imgbox .count {
                        display: -ms-flexbox;
                        display: flex;
                        -ms-flex-align: center;
                        align-items: center;
                        position: absolute;
                        bottom: 0;
                        width: 100%;
                        padding: 6px 8px;
                        -ms-flex-pack: justify;
                        justify-content: space-between;
                        color: #fff;
                        line-height: 16px;
                        border-bottom-right-radius: 5px;
                        border-bottom-left-radius: 5px;
                        -webkit-text-stroke: 1px #666;
                        font-weight: 900;
                    }

            .con .demo10 .borderbox .item-main {
                width: 55%;
                float: right;
                padding: 0 10px 0 20px;
            }

                .con .demo10 .borderbox .item-main .am-gallery-title {
                    display: block!important;
                    font-size: 1rem;
                    text-align: left;
                    color: #333;
                    margin-top: 0;
                    text-overflow: -o-ellipsis-lastline;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    display: -webkit-box;
                    -webkit-line-clamp: 1;
                    line-clamp: 1;
                    -webkit-box-orient: vertical;
                    padding-right: 5px;
                }

                .con .demo10 .borderbox .item-main a {
                    text-decoration: none;
                }

                    .con .demo10 .borderbox .item-main a:hover .am-gallery-title {
                        color: orangered;
                        text-decoration: none;
                    }

                .con .demo10 .borderbox .item-main .am-gallery-desc {
                    margin-top: 5px;
                    font-size: 0.8rem;
                    text-align: left;
                    color: #6d6d6d;
                    line-height: 1.6;
                    letter-spacing: 1px;
                    text-overflow: -o-ellipsis-lastline;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    display: -webkit-box;
                    -webkit-line-clamp: 3;
                    line-clamp: 3;
                    -webkit-box-orient: vertical;
                }

    .con .demo11 .LeftBox {
        position: relative;
        width: 68%;
        float: left;
        padding-right: 60px;
    }

    .con .demo11 .RightBox {
        position: relative;
        width: 32%;
        float: right;
        padding-left: 20px;
    }

    .con .demo15 .LeftBox {
        position: relative;
        width: 40%;
        float: left;
        padding-right: 10px;
    }

    .con .demo15 .RightBox {
        position: relative;
        width: 60%;
        float: right;
        padding-left: 20px;
    }

    .con .demo16 .bigbox {
        padding: 0;
        margin-left: -5px;
        margin-right: -5px;
        padding-bottom: 40px;
    }

    .con .demo16 .borderbox {
        padding: 0;
        border: 1px solid #ccc;
        border-radius: 5px 0 0 5px;
    }

        .con .demo16 .borderbox img {
            border-radius: 5px 0 0 5px;
        }

        .con .demo16 .borderbox .item-img {
            float: left;
            width: 45%;
        }

            .con .demo16 .borderbox .item-img .imgbox {
                position: relative;
                width: 100%;
                height: auto;
            }

                .con .demo16 .borderbox .item-img .imgbox .count {
                    display: -ms-flexbox;
                    display: flex;
                    -ms-flex-align: center;
                    align-items: center;
                    position: absolute;
                    bottom: 0;
                    width: 100%;
                    padding: 6px 8px;
                    -ms-flex-pack: justify;
                    justify-content: space-between;
                    color: #fff;
                    line-height: 16px;
                    border-bottom-right-radius: 5px;
                    border-bottom-left-radius: 5px;
                    -webkit-text-stroke: 1px #666;
                    font-weight: 900;
                }

        .con .demo16 .borderbox .item-main {
            width: 55%;
            float: right;
            padding: 0 10px 0 20px;
        }

            .con .demo16 .borderbox .item-main .am-gallery-title {
                display:block!important;
                padding-top:6px;
                font-size: 1rem;
                text-align: left;
                color: #333;
                margin-top: 0;
                text-overflow: -o-ellipsis-lastline;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 1;
                line-clamp: 1;
                -webkit-box-orient: vertical;
            }

            .con .demo16 .borderbox .item-main a {
                text-decoration: none;
            }

                .con .demo16 .borderbox .item-main a:hover .am-gallery-title {
                    color: orangered;
                    text-decoration: none;
                }

            .con .demo16 .borderbox .item-main .am-gallery-desc {
                margin-top: 5px;
                font-size: 0.8rem;
                text-align: left;
                color: #6d6d6d;
                line-height: 1.6;
                letter-spacing: 1px;
                text-overflow: -o-ellipsis-lastline;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 4;
                line-clamp: 4;
                -webkit-box-orient: vertical;
            }

    .con .demo17 {
        padding: 0;
        margin-left: -5px;
        margin-right: -5px;
        /*padding-bottom: 40px;*/
    }

        .con .demo17 li {
            padding-bottom: 10px;
        }

        .con .demo17 .borderbox {
            padding: 0;
            border: 1px solid #ccc;
            border-radius: 5px 0 0 5px;
        }

            .con .demo17 .borderbox img {
                border-radius: 5px 0 0 5px;
            }

            .con .demo17 .borderbox .item-img {
                float: left;
                width: 45%;
            }

                .con .demo17 .borderbox .item-img .imgbox {
                    position: relative;
                    width: 100%;
                    height: auto;
                }

                    .con .demo17 .borderbox .item-img .imgbox .count {
                        display: -ms-flexbox;
                        display: flex;
                        -ms-flex-align: center;
                        align-items: center;
                        position: absolute;
                        bottom: 0;
                        width: 100%;
                        padding: 6px 8px;
                        -ms-flex-pack: justify;
                        justify-content: space-between;
                        color: #fff;
                        line-height: 16px;
                        border-bottom-right-radius: 5px;
                        border-bottom-left-radius: 5px;
                        -webkit-text-stroke: 1px #666;
                        font-weight: 900;
                    }

            .con .demo17 .borderbox .item-main {
                width: 55%;
                float: right;
                padding: 0 10px 0 20px;
            }

                .con .demo17 .borderbox .item-main .am-gallery-title {
                    display:block!important;
                    font-size: 1rem;
                    text-align: left;
                    color: #333;
                    margin-top: 0;
                    text-overflow: -o-ellipsis-lastline;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    display: -webkit-box;
                    -webkit-line-clamp: 1;
                    line-clamp: 1;
                    -webkit-box-orient: vertical;
                    padding-top:6px;
                }

                .con .demo17 .borderbox .item-main a {
                    text-decoration: none;
                }

                    .con .demo17 .borderbox .item-main a:hover .am-gallery-title {
                        color: orangered;
                        text-decoration: none;
                    }

                .con .demo17 .borderbox .item-main .am-gallery-desc {
                    margin-top: 5px;
                    font-size: 0.8rem;
                    text-align: left;
                    color: #6d6d6d;
                    line-height: 1.6;
                    letter-spacing: 1px;
                    text-overflow: -o-ellipsis-lastline;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    display: -webkit-box;
                    -webkit-line-clamp: 4;
                    line-clamp: 4;
                    -webkit-box-orient: vertical;
                }

    .con .demo19 {
        position: relative;
        margin-left: -10px;
        margin-right: -10px;
        padding: 0;
    }

        .con .demo19 .box {
            padding: 0 0 30px 0;
            border-radius: 5px 5px 0 0;
        }

            .con .demo19 .box a {
                color: #333;
                font-size: 1rem;
                text-decoration: none;
            }

            .con .demo19 .box img {
                border-radius: 5px 5px 0 0;
            }

            .con .demo19 .box a h5 {
                color: #333;
                font-size: 1rem;
                padding: 0 10px 0 10px;
            }

            .con .demo19 .box a:hover .title {
                color: orangered;
            }

            .con .demo19 .box .title {
                position: relative;
                display: block !important;
                color: #333;
                font-size: 1rem;
                text-align: left;
                text-shadow: none;
                padding-bottom: 0;
                text-overflow: -o-ellipsis-lastline;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 1;
                line-clamp: 1;
                -webkit-box-orient: vertical;
                height: auto;
            }

            .con .demo19 .box .imgbox {
                position: relative;
                width: 100%;
                height: auto;
            }

                .con .demo19 .box .imgbox .count {
                    display: -ms-flexbox;
                    display: flex;
                    -ms-flex-align: center;
                    align-items: center;
                    position: absolute;
                    bottom: 0;
                    width: 100%;
                    padding: 6px 8px;
                    -ms-flex-pack: justify;
                    justify-content: space-between;
                    color: #fff;
                    line-height: 16px;
                    border-bottom-right-radius: 5px;
                    border-bottom-left-radius: 5px;
                    -webkit-text-stroke: 1px #666;
                    font-weight: 900;
                }

            .con .demo19 .box .desc {
                color: #6d6d6d;
                font-size: 0.9rem;
                padding: 0 10px 0 10px;
                text-overflow: -o-ellipsis-lastline;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 4;
                line-clamp: 4;
                -webkit-box-orient: vertical;
            }

    .con .demo20 {
        position: relative;
        margin-left: -10px;
        margin-right: -10px;
        padding: 0;
    }

        .con .demo20 .box {
            height:350px;
            padding: 0;
            border-radius: 5px 5px 0 0;
        }

            .con .demo20 .box a {
                color: #333;
                font-size: 1rem;
                text-decoration: none;
            }

            .con .demo20 .box img {
                border-radius: 5px 5px 0 0;
            }

            .con .demo20 .box a h5 {
                color: #333;
                font-size: 1rem;
                padding: 0 10px 0 10px;
            }

            .con .demo20 .box a:hover .title {
                color: orangered;
            }

            .con .demo20 .box .title {
                position: relative;
                display: block !important;
                color: #333;
                font-size: 1rem;
                text-align: left;
                text-shadow: none;
                padding-bottom: 0;
                text-overflow: -o-ellipsis-lastline;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 1;
                line-clamp: 1;
                -webkit-box-orient: vertical;
                height: auto;
            }

            .con .demo20 .box .imgbox {
                position: relative;
                width: 100%;
                height: auto;
            }

                .con .demo20 .box .imgbox .count {
                    display: -ms-flexbox;
                    display: flex;
                    -ms-flex-align: center;
                    align-items: center;
                    position: absolute;
                    bottom: 0;
                    width: 100%;
                    padding: 6px 8px;
                    -ms-flex-pack: justify;
                    justify-content: space-between;
                    color: #fff;
                    line-height: 16px;
                    border-bottom-right-radius: 5px;
                    border-bottom-left-radius: 5px;
                    -webkit-text-stroke: 1px #666;
                    font-weight: 900;
                }

            .con .demo20 .box .desc {
                color: #6d6d6d;
                font-size: 0.9rem;
                padding: 0 10px 0 10px;
                text-overflow: -o-ellipsis-lastline;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 8;
                line-clamp: 8;
                -webkit-box-orient: vertical;
            }

    .con .demo21 {
        padding: 0;
        margin-left: -5px;
        margin-right: -5px;
    }

        .con .demo21 li {
            margin-bottom: 10px;
        }

        .con .demo21 .borderbox {
            padding: 15px 10px 15px 10px;
            border: 1px solid #ccc;
            border-radius: 5px;
        }

            .con .demo21 .borderbox img {
                border-radius: 5px;
            }

            .con .demo21 .borderbox .item-img {
                float: left;
                width: 35%;
            }

                .con .demo21 .borderbox .item-img .imgbox {
                    position: relative;
                    width: 100%;
                    height: auto;
                }

                    .con .demo21 .borderbox .item-img .imgbox .count {
                        display: -ms-flexbox;
                        display: flex;
                        -ms-flex-align: center;
                        align-items: center;
                        position: absolute;
                        bottom: 0;
                        width: 100%;
                        padding: 6px 8px;
                        -ms-flex-pack: justify;
                        justify-content: space-between;
                        color: #fff;
                        line-height: 16px;
                        border-bottom-right-radius: 5px;
                        border-bottom-left-radius: 5px;
                        -webkit-text-stroke: 1px #666;
                        font-weight: 900;
                    }

            .con .demo21 .borderbox .item-main {
                width: 65%;
                float: right;
                padding: 0 10px 0 20px;
            }

                .con .demo21 .borderbox .item-main .am-gallery-title {
                    display:block!important;
                    font-size: 1rem;
                    text-align: left;
                    color: #333;
                    margin-top: 0;
                    text-overflow: -o-ellipsis-lastline;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    display: -webkit-box;
                    -webkit-line-clamp: 1;
                    line-clamp: 1;
                    -webkit-box-orient: vertical;
                }

                .con .demo21 .borderbox .item-main a {
                    text-decoration: none;
                }

                    .con .demo21 .borderbox .item-main a:hover .am-gallery-title {
                        color: orangered;
                        text-decoration: none;
                    }

                .con .demo21 .borderbox .item-main .am-gallery-desc {
                    margin-top: 5px;
                    font-size: 0.8rem;
                    text-align: left;
                    color: #6d6d6d;
                    line-height: 1.6;
                    letter-spacing: 1px;
                    text-overflow: -o-ellipsis-lastline;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    display: -webkit-box;
                    -webkit-line-clamp: 4;
                    line-clamp: 4;
                    -webkit-box-orient: vertical;
                }

    .con .demo22 .LeftBox {
        position: relative;
        width: 40%;
        float: left;
        padding-right: 10px;
    }

    .con .demo22 .RightBox {
        position: relative;
        width: 60%;
        float: right;
        padding-left: 40px;
    }

    .con .demo24 {
        padding-top: 60px;
    }

        .con .demo24 .LeftBox {
            position: relative;
            width: 20%;
            float: left;
            padding-right: 40px;
        }

        .con .demo24 .CenterBox {
            position: relative;
            width: 42%;
            float: left;
            padding-right: 40px;
            padding-left: 40px;
            border-left: 1px solid #ccc;
        }

        .con .demo24 .RightBox {
            position: relative;
            width: 38%;
            float: right;
            padding-left: 40px;
            border-left: 1px solid #ccc;
        }

    .con .demo26 .LeftBox {
        position: relative;
        width: 40%;
        float: left;
        padding-right: 10px;
    }

    .con .demo26 .RightBox {
        position: relative;
        width: 60%;
        float: right;
        padding-left: 60px;
    }

    .con .demo27 {
        padding: 0;
        margin-left: -5px;
        margin-right: -5px;
    }

        .con .demo27 li {
            margin-bottom: 5px;
        }

        .con .demo27 .borderbox {
            padding: 8px;
            border: 1px solid #ccc;
            border-radius: 5px;
        }

            .con .demo27 .borderbox img {
                border-radius: 5px;
            }

            .con .demo27 .borderbox .item-img {
                float: left;
                width: 32%;
            }

                .con .demo27 .borderbox .item-img .imgbox {
                    position: relative;
                    width: 100%;
                    height: auto;
                }

                    .con .demo27 .borderbox .item-img .imgbox .count {
                        display: -ms-flexbox;
                        display: flex;
                        -ms-flex-align: center;
                        align-items: center;
                        position: absolute;
                        bottom: 0;
                        width: 100%;
                        padding: 6px 8px;
                        -ms-flex-pack: justify;
                        justify-content: space-between;
                        color: #fff;
                        line-height: 16px;
                        border-bottom-right-radius: 5px;
                        border-bottom-left-radius: 5px;
                        -webkit-text-stroke: 1px #666;
                        font-weight: 900;
                    }

            .con .demo27 .borderbox .item-main {
                width: 68%;
                float: right;
                padding: 0 10px 0 20px;
            }

                .con .demo27 .borderbox .item-main .am-gallery-title {
                    display:block!important;
                    font-size: 1rem;
                    text-align: left;
                    color: #333;
                    margin-top: 0;
                    text-overflow: -o-ellipsis-lastline;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    display: -webkit-box;
                    -webkit-line-clamp: 1;
                    line-clamp: 1;
                    -webkit-box-orient: vertical;
                }

                .con .demo27 .borderbox .item-main a {
                    text-decoration: none;
                }

                    .con .demo27 .borderbox .item-main a:hover .am-gallery-title {
                        color: orangered;
                        text-decoration: none;
                    }

                .con .demo27 .borderbox .item-main .am-gallery-desc {
                    margin-top: 5px;
                    font-size: 0.8rem;
                    text-align: left;
                    color: #6d6d6d;
                    line-height: 1.6;
                    letter-spacing: 1px;
                    text-overflow: -o-ellipsis-lastline;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    display: -webkit-box;
                    -webkit-line-clamp: 3;
                    line-clamp: 3;
                    -webkit-box-orient: vertical;
                }


@media only screen and (max-width: 640px) {
    .con .dhbox {
        padding: 10px 0 10px 10px;
    }

    .con .demo1tt {
        padding: 30px 0 10px 10px;
    }

    .con .demo1tt2 {
        padding: 20px 0 10px 10px;
    }

    .con .demo1 {
        margin-left: 0;
        margin-right: 0;
        padding: 0 5px;
    }

    .con .demo2 {
        margin-left: 0;
        margin-right: 0;
        padding: 0 5px;
    }

        .con .demo2 .liLast {
            display: none;
        }

    .con .demo3 .LeftBox {
        width: 100%;
        float: none;
        padding-right: 0;
    }

    .con .demo3 .RightBox {
        width: 100%;
        float: none;
        padding-left: 0;
    }

    .con .demo4 {
        padding: 0 10px;
        margin-left: 0;
        margin-right: 0;
    }

        .con .demo4 .liTop {
            padding: 20px 0;
        }

        .con .demo4 .item-main {
            padding: 0 0 0 10px;
        }

            .con .demo4 .item-main .am-gallery-desc {
                margin-top: 2px;
                -webkit-line-clamp: 3;
                line-clamp: 3;
            }

        .con .demo4 .liCenter {
            padding: 20px 0;
        }

        .con .demo4 .liBottom {
            padding: 20px 0;
            border-bottom: 1px solid #ccc;
        }

    .con .demo6 .bigbox {
        width: 100%;
        float: none;
        padding:0 10px;
    }

        .con .demo6 .bigbox .lbox {
            margin-left: 0;
            margin-right: 0;
            padding: 0 0 20px 0;
        }

    .con .demo6 .smallbox {
        width: 100%;
        float: none;
        padding: 0 10px;
    }

    .con .demo7 .LeftBox {
        width: 100%;
        float: none;
        padding-right: 0;
    }

        .con .demo7 .LeftBox .demo8 .box {
            height: 240px;
        }

    .con .demo7 .RightBox {
        width: 100%;
        float: none;
        padding-left: 0;
        border-left: 0;
    }

    .con .demo8 {
        margin-left: 5px;
        margin-right: 5px;
    }

    .con .demo8 .liLast {
        display: none;
    }

        .con .demo8 .box {
            height: 280px;
        }

            .con .demo8 .box .desc {
                -webkit-line-clamp: 6;
                line-clamp: 6;
            }

    .con .demo10 {
        padding: 0 5px;
        margin-left: 0;
        margin-right: 0;
    }

        .con .demo10 .borderbox {
            padding: 10px;
        }

            .con .demo10 .borderbox .item-main {
                padding: 0 0 0 10px;
            }

                .con .demo10 .borderbox .item-main .am-gallery-desc {
                    margin-top: 2px;
                }

    .con .demo11 {
        padding: 0 5px;
    }

        .con .demo11 .LeftBox {
            width: 100%;
            float: none;
            padding: 0;
        }

            .con .demo11 .LeftBox .demo2 {
                padding: 0;
            }

        .con .demo11 .RightBox {
            width: 100%;
            float: none;
            padding-left: 0;
        }

            .con .demo11 .RightBox .demo2 {
                padding: 0;
            }

    .con .demo15 .LeftBox {
        width: 100%;
        float: none;
        padding-right: 0;
    }

    .con .demo15 .RightBox {
        width: 100%;
        float: none;
        padding-left: 0;
    }

    .con .demo16 {
        padding: 0 5px;
    }

    .con .demo16 .bigbox {
        padding: 0;
        margin-left: 0;
        margin-right: 0;
        padding-bottom: 0;
    }

    .con .demo16 .demo2 {
        padding: 0;
    }

    .con .demo16 .borderbox .item-main {
        padding: 0 10px;
    }

        .con .demo16 .borderbox .item-main .am-gallery-desc {
            margin-top: 2px;
            -webkit-line-clamp: 3;
            line-clamp: 3;
        }

    .con .demo17 {
        padding: 0 5px;
        margin-left: 0;
        margin-right: 0;
    }

        .con .demo17 li {
            padding-bottom: 10px;
        }

        .con .demo17 .borderbox .item-main {
            padding: 0 10px;
        }

    .con .demo17 .borderbox .item-main .am-gallery-desc {
        margin-top: 2px;
        -webkit-line-clamp: 3;
        line-clamp: 3;
    }

    .con .demo19 {
        margin-left: 0;
        margin-right: 0;
        padding: 0;
    }

        .con .demo19 .box {
            height: 200px;
            padding: 0;
        }

    .con .demo20 {
        margin-left: 0;
        margin-right: 0;
        padding: 0 5px;
    }

    .con .demo20 .liLast {
        display: none;
    }

        .con .demo20 .box {
            height: 250px;
            padding: 0;
        }

            .con .demo20 .box .desc {
                -webkit-line-clamp: 4;
                line-clamp: 4;
            }

    .con .demo21 {
        padding: 0 5px;
        margin-left: 0;
        margin-right: 0;
    }

        .con .demo21 li {
            margin-bottom: 0;
        }

        .con .demo21 .borderbox {
            padding: 10px;
        }

        .con .demo21 .borderbox .item-img {
            width: 45%;
        }

        .con .demo21 .borderbox .item-main {
            width: 55%;
            padding: 0 0 0 10px;
        }

            .con .demo21 .borderbox .item-main .am-gallery-desc {
                margin-top: 2px;
                -webkit-line-clamp: 2;
                line-clamp: 2;
            }

    .con .demo22 .LeftBox {
        width: 100%;
        float: none;
        padding-right: 0;
    }

    .con .demo22 .RightBox {
        width: 100%;
        float: none;
        padding-left: 0;
    }

    .con .demo24 {
        padding-top: 20px;
    }

        .con .demo24 .LeftBox {
            width: 100%;
            float: none;
            padding-right: 0;
        }

        .con .demo24 .RightBox {
            width: 100%;
            float: none;
            padding-left: 0;
            border-left: 0;
        }

        .con .demo24 .CenterBox {
            width: 100%;
            float: none;
            padding-right: 0;
            padding-left: 0;
            border-left: 0;
        }

    .con .demo26 {
        padding: 0 5px;
    }

        .con .demo26 .LeftBox {
            width: 100%;
            float: none;
            padding-right: 0;
        }

        .con .demo26 .RightBox {
            width: 100%;
            float: none;
            padding-left: 0;
        }

    .con .demo27 {
        padding: 0;
        margin-left: 0;
        margin-right: 0;
    }

        .con .demo27 li {
            margin-bottom: 5px;
        }

        .con .demo27 .borderbox .item-img {
            width: 45%;
        }

        .con .demo27 .borderbox .item-main {
            width: 55%;
            padding: 0 0px 0 10px;
        }

            .con .demo27 .borderbox .item-main .am-gallery-desc {
                margin-top: 2px;
                -webkit-line-clamp: 2;
                line-clamp: 2;
            }
}
