html{
    font-family:sans-serif;
    -ms-text-size-adjust:100%;
    -webkit-text-size-adjust:100%
}
body{
    margin:0;
    background-color: whitesmoke;
}
ol,li,ul,h1,h2,h3,h4,h5{
    margin: 0px;
    padding: 0px;
    list-style: none;
}
a{
    color: #3878fe;
}
a:hover{
    color: #3878fe;
}
a:visited {
    color:#3878fe;
}
a:active  {
    color:#3878fe;
}
.containers{
    max-width: 1150px;
    margin: 0px auto;
}
.pull-right{
    float: right;
}

.headerstrip {
    background-color: #6C84E5;
    background: url("//dmypbau5frl9g.cloudfront.net/elements_header_background.png"),
    linear-gradient(to right,rgba(71, 114, 217, 1),rgba(0, 220, 175, 1));
    background-size: 300px 300px, auto;
}
.headerstrip .headerstrip-canvas {
    width: 1000px;
    height: 50px;
    margin: auto auto;
}
.headerstrip .headerstrip-content {
    position: absolute;
    background-size: contain;
    background-repeat: no-repeat;
    background-size: 1000px 50px;
    width: 100%;
    max-width: 1150px;
    height: 50px;
}

.is-hidden-tablet-and-above .headerstrip-content {
    background-position: -500px 0;
}

.headerstrip .headerstrip-text {
    position: absolute;
    color: white;
    text-decoration: none;
    line-height: 50px;
    font-weight: 100;
}

.headerstrip .is-hidden-phone .headerstrip-text {
    padding: 0 0 0 10px;
    font-size: 16px;
    letter-spacing: 0.6px;
}

.headerstrip .is-hidden-tablet-and-above .headerstrip-text {
    padding: 0 0 0 10px;
    text-decoration: underline;
    font-size: 16px;
    letter-spacing: 0.6px;
}

.headerstrip .headerstrip-text strong {
    font-weight: 500;
}

.headerstrip .headerstrip-cta {
    position: absolute;
    top: 0;
    text-decoration: none;
    color: white;
    background: rgba(0,0,0,0.5);
    top: 10px;
    right: 40px;
    background-color: #4772d9;
    padding: 8px 0px;
    color: white;
    font-size: 10px;
    border-radius: 2px;
    box-shadow: 0 2px 0 #1f47a5;
    cursor: pointer;
    text-decoration: none;
    font-weight: 600;
    display: block;
    width: 125px;
    text-align: center;
    margin: 0 auto;
    letter-spacing: 0.8px;
}

.headerstrip .banner__dismiss {
    position: absolute;
    opacity: 0.5;
    color: #4772d9;
    top: 15px;
    right: 5px;
    text-decoration: none;
}

/*header begin*/
.navigation-header{
    width: 100%;
    height: auto;
    line-height: 60px;
    background-color: #FFFFFF;
    display: flex;
    z-index: 980;
    justify-content: center;
    flex-direction: row;
    flex-wrap: wrap;
}
.navigation-header-phone{
    width: 100%;
    height: 60px;
    display: none;
    flex-direction: row;
    justify-content: space-between;
    padding: 0 10px;
    box-sizing: border-box;
}
.navigation-header-phone .logo{
    width: auto;
    padding: 10px 0;
    height: 60px;
    box-sizing: border-box;
    margin-right: 15px;
}
.navigation-header-phone .logo img{
    height: 100%;
    float: left;
}
.navigation-header-phone i{
    width: 60px;
    height: 60px;
    font-size: 20px;
    float: right;
    text-align: right;
}
.navigation-headers{
    width: 100%;
    max-width: 1150px;
    display: block;
}
.navigation-header-content{
    width: 100%;
    height: 70px;
    display: flex;
    flex-direction: row;
}
.navigation-header-content .logo{
    width: auto;
    padding: 15px 0;
    height: 70px;
    box-sizing: border-box;
    margin-right: 20px;
}
.navigation-header-content .logo img{
    height: 100%;
    float: left;
}
.navigation-header-content .content{
    flex: 1;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
}
.navigation-header-content .content .menu-items{
    display: flex;
    height: 70px;
    margin: 0;
}
.navigation-header-content .content .menu-items li{
    display: flex;
    flex-direction: row;
    font-size: 15px;
    font-weight: 400;
    color: #333333;
    height: 70px;
    margin-right: 20px;
    cursor: pointer;
    align-items: center;
}
.navigation-header-content .content .menu-items li i{
    width: auto;
    height: 70px;
    line-height: 70px;
    margin-right: 5px;
    float: left;
    font-size: 20px;
}
.navigation-header-content .content .menu-items li a{
    width: auto;
    height: 70px;
    line-height: 70px;
    color: #333333;
}
.navigation-header-content .content .menu-items li a:hover{
    text-decoration: none;
    color: #3878fe;
}
.navigation-header-right{
    display: flex;
    width: auto;
    color: #333333;
}
.navigation-header-right li{
    float: right;
    width: auto;
    color: #333333;
    height: 70px;
    line-height: 70px;
    padding-right: 15px;
    font-size: 14px;
}
.navigation-header-right li.drop-down{
    width: 70px;
}
.navigation-header-right li ul.drop-down-content{
    width: 120px;
    float: right;
    right: 0px;
    z-index: 998;
    display: none;
    background-color: #FFFFFF;
    height: auto;
    text-align: center;
    border-right: thin solid #E6E6E6;
    border-left: thin solid #E6E6E6;
    border-bottom: thin solid #E6E6E6;
    border-radius: 0px 0px 3px 3px;
    margin-top: 10px;
    position: relative;
}
.navigation-header-right li ul.drop-down-content li{
    width: 100%;
    float: left;
    padding: 0px;
}
.drop-down:hover .drop-down-content{
    display: block;
}
.navigation-header-right li ul li{
    width: 100%;
    float: right;
    text-align: center;
    border-bottom: dashed thin #E6E6E6;
}
.navigation-header-right li ul li:last-child{
    border-bottom: none;
}
.navigation-header-right li ul li a{
    width: 100%;
    float: right;
    text-align: center;
    padding-left: 0px;
    color: #333333;
}
.navigation-header-right li ul.drop-down-content li:hover{
    text-align: center;
}
.navigation-header-right a{
    height: 55px;
    color: #333333;
}
.navigation-header-right a i{
    width: auto;
    height: 55px;
    margin-right: 5px;
}
.navigation-header-right a:hover{
    font-weight: 500;
    color: #3878fe;
    text-decoration: none;
}
.navigation-header-right img{
    width: 40px;
    height: 40px;
    margin-top: 10px;
    border-radius: 3px;
    float: right;
}
@media (max-width: 767px) {
    .navigation-headers{
        display: none;
    }
    .navigation-header-phone{
        display: flex;
    }
    .navigation-header-content{
        height: auto;
    }
    .navigation-header-content .menu-items{
        display: flex;
        height: auto!important;
        flex-direction: row;
        flex-wrap: wrap;
    }
    .navigation-header-content .logo{
        display: none;
    }
    .navigation-header-content .content{
        /*display: none;*/
        padding: 0 10px;
    }
}
/*header end*/

/*product start*/
.navigation-products-container{
    background-color: #FFFFFF;
    width: 100%;
    height: auto;
    top: 60px;
    left: 0;
    position: absolute;
    padding: 20px 0;
    display: none;
    z-index: 999;
    box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.1);
}
.navigation-products{
    width: 100%;
    max-width: 1150px;
    margin: 0 auto;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
}
.navigation-products ul{
    width: 100%;
    display: flex;
    flex-direction: row;
    margin: 0;
    padding: 0;
    flex-wrap: wrap;
    justify-content: space-between;
}
.navigation-products ul li{
    width: 24%;
    list-style: none;
    margin-bottom: 15px;
    box-sizing: border-box;
    cursor: pointer;
}
.navigation-products ul li .avatar{
    width: 40px;
    height: 40px;
    float: left;
    margin-right: 10px;
    border-radius: 50%;
}
.navigation-products ul li .right{
    width: calc(100% - 50px);
    height: auto;
    float: left;
}
.navigation-products ul li .right h5{
    color: #000000;
    font-weight: 400;
    font-size: 15px;
    margin: 0px;
    height: 20px;
    line-height: 20px;
    overflow: hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
    display: flex;
}
.navigation-products ul li .right h5 font{
    width: auto;
    text-align: center;
    height: 20px;
    line-height: 20px;
    background-color: #1BD167;
    color: #FFFFFF;
    border-radius: 1px;
    margin-left: 5px;
    padding: 0 5px;
    font-size: 12px;
}
.navigation-products ul li .right h5 font.red{
    background-color: red;
    background-image: linear-gradient(to right, #ff5f5f , #ff0000);
}
.navigation-products ul li .right h5 font.yellow{
    background-color: #fb9757;
    background-image: linear-gradient(to right, #fb9757 , #ef654b);
    border-radius: 7px 0;
}
.navigation-products ul li .right h5 font.blue{
    background: #BCE8FF;
    background-image: linear-gradient(to right, #308AFF, #0068EE);
    border-radius: 5px 0;
}
.navigation-products ul li .right h5 font.green{
    background: #CEFFD9;
    background-image: linear-gradient(to right, #2EBD70, #29A864);
    border-radius: 5px 0;
}
.navigation-products ul li .right h5 font.golden{
    color: #665231;
    background: linear-gradient(90deg, #FFDDA3 4.17%, #F2C57A 100%);
}
.navigation-products ul li .right p{
    margin: 0px;
    height: 40px;
    line-height: 20px;
    font-size: 13px;
    color: #999999;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.navigation-products-close{
    width: 100%;
    height: 40px;
    line-height: 20px;
    text-align: center;
    font-size: 40px;
    display: none;
}
.navigation-products-close i{
    font-size: 40px;
}
@media (max-width: 767px) {
    .navigation-products ul{
        padding: 10px;
    }
    .navigation-products ul li{
        width: 100%;
        margin-bottom: 10px;
    }
    .navigation-products-close{
        display: block;
    }
}
/*product end*/

/*content begin*/
.main-content{
    background-color: whitesmoke;
    width: 100%;
    height: auto;
    float: left;
    padding: 30px 0px 50px 0px;
}
.main-content .content{
    width: 100%;
    max-width: 1150px;
    min-height: 300px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}
.content-menu{
    background-color: #FFFFFF;
    min-height: 700px;
}
.content-menu header{
    width: 100%;
    height: 65px;
    line-height: 65px;
    padding: 0px 30px;
    box-sizing: border-box;
    border-bottom:1px solid #e1e8ed;
    float: left;
}
.content-menu header .left{
    width: 30%;
    height: 65px;
    line-height: 65px;
    font-size: 18px;
    float: left;
}
.content-menu header .left i{
    margin-right: 5px;
    height: 65px;
    line-height: 65px;
    float: left;
    font-size: 20px;
}
.content-menu header .right{
    width: 70%;
    height: 65px;
    line-height: 65px;
    float: left;
    padding-top: 15px;
    box-sizing: border-box;
    overflow: hidden;
}
.content-menu header .right a{
    width: auto;
    height: 50px;
    line-height: 50px;
    float: right;
    font-size: 15px;
    margin: 0px;
    padding: 0px;
    margin-left: 30px;
}
.content-menu header .right .active{
    border-bottom: 3px solid #3878fe;
}
.content-menu content{
    width: 100%;
    height: auto;
}
.content-menu content ul{
    padding: 0px 20px 0px 20px;
}
.content-menu content li{
    width: 100%;
    height: auto;
    padding: 20px 0px;
    border-bottom: 1px dashed #E6E6E6;
    float: left;
}
.content-menu content ul li img{
    width: 50px;
    height: 50px;
    margin-right: 5px;
    border-radius: 2px;
}
.content-menu content ul li span{
    float: left;
    margin-top: -50px;
    width: 100%;
    padding: 0px 0px 0px 65px;
    overflow: hidden;
}
.content-menu content li span h3{
    width: 100%;
    float: left;
    line-height: 25px;
    height: 25px;
    font-size: 15px;
    color: #333333;
    font-weight: 400;
    margin: 0px 0px 5px 0px;
    overflow: hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
}
.content-menu content li span h3:hover{
    color: #3878fe;
}
.content-menu content li span font{
    color: #999999;
    font-weight: 200;
    margin: 0px;
    height: 20px;
    line-height: 20px;
    font-size: 14px;
}
.content-menu content li span font em{
    background-color: #E6E6E6;
    font-size: 8px;
    border-radius: 2px;
    color: #999;
    font-style: normal;
    height: 20px;
    line-height: 20px;
    float: left;
    padding: 0px 8px 0px 8px;
    margin-right: 5px;
}
.content-menu footer{
    width: 100%;
    text-align: center;
    height: 100px;
    float: left;
    font-weight: 200;
    padding-bottom: 20px;
}
.content-publish .heder-menu{
    width: auto;
    height: 60px;
    line-height: 60px;
    float: right;
    padding-top: 10px;
    box-sizing: border-box;
    overflow: hidden;
}
.content-publish .heder-menu a{
    width: auto;
    height: 50px;
    line-height: 50px;
    float: right;
    font-size: 15px;
    margin: 0px;
    padding: 0px;
    margin-left: 30px;
}
.content-publish .heder-menu .active{
    border-bottom: 3px solid #3878fe;
}

@media (max-width: 767px) {
    .main-content-left{
        width: 94%;
        margin-left: 3%;
        margin-right: 3%;
        float: left;
        height: auto;
        margin-bottom: 20px;
    }
    .index-content-right{
        width: 94%;
        margin-left: 3%;
        margin-right: 3%;
        float: left;
        height: auto
    }
}
@media screen and (min-width: 768px) {
    .main-content-left{
        width: 73%;
        float: left;
        height: auto;
        border-radius: 3px;
    }
    .index-content-right{
        width: 25%;
        float: left;
        height: auto;
        margin-left: 2%;
    }
}
.main-content-left header{
    width: 100%;
    height: 65px;
    line-height: 65px;
    padding: 0 20px;
    border-bottom: 1px solid #E6EEF4;
    float: left;
}
.main-content-left header a{
    font-weight: 400;
    font-size: 16px;
    color: #333333;
    float: left;
    margin-right: 40px;
    text-decoration: none;
    letter-spacing: 1px;
}
.main-content-left header a:hover{
    color: #3878fe;
}

.index-content-right ul{
    width: 100%;
    margin-bottom: 20px;
    border-radius: 3px;
    height: auto;
    float: left;
    background-color: #FFFFFF;
    padding: 10px 25px 20px 25px;
    box-sizing: border-box;
}
.index-content-right ul header{
    width: 100%;
    height: 50px;
    line-height: 50px;
    margin-bottom: 10px;
    border-bottom: 1px solid #F3F3F3;
}
.index-content-right ul header h2{
    width: auto;
    font-weight: 400;
    float: left;
    font-size: 16px;
    height: 50px;
    line-height: 50px;
    margin: 0px;
    padding: 0px;
    border-bottom: 3px solid #3878fe;
}
.index-content-right ul.gonggao span{
    color: #999999;
    font-weight: 400;
    font-size: 14px;
    line-height: 22px;
}
.index-content-right ul.notice{
    width: 100%;
}
.index-content-right ul.notice li{
    width: 100%;
    float: left;
    height: 30px;
    line-height: 30px;
    font-size: 14px;
    color: #7F7F7F;
}
.index-content-right ul.notice li a{
    color: #3878fe;
}
.index-content-right ul.download{
    width: 100%;
}
.index-content-right ul.download li{
    width: 100%;
    color: #FFFFFF;
    float: left;
    height: 40px;
    line-height: 40px;
    text-align: center;
    margin-top: 10px;
    border-radius: 3px;
    color: #FFFFFF;
    background-color: #3878fe;
}
.index-content-right ul.download li a{
    width: 100%;
    float: left;
    height: 40px;
    line-height: 40px;
    color: #FFFFFF;
    border-radius: 3px;
    font-size: 14px;
}
.index-content-right ul.download li a:hover{
    background-color: #303030;
    text-decoration: none;
}
.index-content-right ul.advertisement li{
    width: 100%;
    float: left;
    text-align: center;
    color: #666666;
    height: auto;
}
.index-content-right ul.advertisement li img{
    width: 100%;
    height: auto;
    float: left;
    margin-bottom: 5px;
}
@media screen and (max-width: 768px) {
.index-content-right ul.advertisement li{
    width: 100%;
    float: left;
    border-right: thin solid #E6E6E6;
    text-align: center;
    color: #666666;
    height: auto;
}
}
.index-content-right ul.advertisement li span{
    width: 100%;
    height: auto;
    float: left;
    height: 40px;
    line-height: 40px;
}
.index-content-right ul.guanggao li{
    width: 100%;
    height: auto;
    float: left;
    margin-bottom: 5px;
}
.index-content-right ul.guanggao li img{
    width: 100%;
    height: auto;
    float: left;
}
.index-content-right ul.hot-article li{
    width: 100%;
    height: 60px;
    float: left;
    margin-bottom: 10px;
    overflow: hidden;
}
.index-content-right ul.hot-article li img{
    width: 80px;
    height: 60px;
    float: left;
    margin: 0px;
}
.index-content-right ul.hot-article li a .article-right{
    width: calc(100% - 90px);
    height: 60px;
    float: left;
    margin-left: 10px;
    padding: 3px 0px;
    box-sizing: border-box;
}
.index-content-right ul.hot-article li a span{
    width: 100%;
    height: 36px;
    line-height: 18px;
    float: left;
    font-size: 13px;
    color: #555c68;
    margin: 0px 0px 5px 0px;
    padding: 0px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    font-weight: 400;
}
.index-content-right ul.hot-article li a font{
    width: 100%;
    height: 14px;
    line-height: 14px;
    float: left;
    font-size: 13px;
    color: #999999;
}

/*footer start*/
.index-footer{
    padding-top: 30px;
    width: 100%;
    height: auto;
    background-color: #202020;
    height: auto;
    float: left;
}
.index-footer-content{
    width: 100%;
    max-width: 1150px;
    margin-left: auto;
    margin-right: auto;
}
@media (max-width: 767px) {
.index-footer-content ul{
    width: 90%;
    padding-left: 5%;
    padding-right: 5%;
    float: left;
    margin-bottom: 20px;
}
}
@media screen and (min-width: 768px) {
.index-footer-content ul{
    width: 33.33%;
    float: left;
}
}
.index-footer-content ul header{
    width: 100%;
    height: 40px;
    line-height: 40px;
    margin-bottom: 20px;
    border-bottom: thin solid #303030;
}
.index-footer-content ul header h5{
    width: 80px;
    font-weight: 400;
    color: #FFFFFF;
    float: left;
    font-size: 18px;
    padding-right: 15px;
    height: 40px;
    line-height: 40px;
    margin: 0px;
    padding: 0px;
    border-bottom: 2px solid #3878fe;
}
.index-footer-content ul.left img{
    width: 100px;
    height: 28px;
    float: left;
    margin-bottom: 15px;
    margin-right: 10px;
}
/*@media screen and (min-width: 768px) {
.index-footer-content ul.left{
    padding-right: 2%;
}
}
.index-footer-content ul.left li{
    width: 100%;
    float: left;
    padding-bottom: 10px;
    margin-bottom: 15px;
    color: #868687;
    border-bottom: thin dashed #959595;
}
.index-footer-content ul.left li:last-child{
    border-bottom: none;
}
.index-footer-content ul.left li a{
    width: 100%;
    height: 20px;
    float: left;
    font-size: 15px;
    line-height: 20px;
    color: #C8C9C9;
    margin-bottom: 10px;
    overflow: hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
}
.index-footer-content ul.left li a:hover{
    text-decoration: none;
    color: #C8C9C9;
}*/
@media screen and (min-width: 768px) {
.index-footer-content ul.center{
    padding-left: 1%;
    padding-right: 1%;
}
}
.index-footer-content ul.center li{
    float: left;
    width: auto;
    box-sizing: border-box;
    border: thin solid #C8C9C9;
    color: #C8C9C9;
    padding: 6px 15px;
    margin-right: 15px;
    margin-bottom: 15px;
    font-size: 14px;
}
.index-footer-content ul.center li:hover{
    background-color: #C8C9C9;
    color: #202020;
}
.index-footer-content ul.center li a{
    color: #C8C9C9;
    text-decoration: none;
    width: 100%;
    height: 25px;
    line-height: 25px;
}
.index-footer-content ul.center li:hover a{
    color: #202020;
}
@media screen and (min-width: 768px) {
.index-footer-content ul.right{
    padding-left: 2%;
}
}
.index-footer-content ul.right li{
    color: #FFFFFF;
    margin-right: 20px;
    float: left;
    font-weight: 300;
    height: 30px;
    line-height: 30px;
    font-size: 15px;
}
.index-footer-content ul.right li a{
    color: #C8C9C9;
}
@media (max-width: 767px) {
.index-footer-footer{
    background-color: #111111;
    border-top: medium #303030 solid;
    width: 100%;
    padding: 15px;
    height: 80px;
    color: #666666;
    float: left;
    text-align: center;
    line-height: 25px;
    margin-top: 30px;
}
}
@media screen and (min-width: 768px) {
.index-footer-footer{
    background-color: #191919;
    border-top: medium #303030 solid;
    width: 100%;
    height: 80px;
    color: #666666;
    font-weight: 300;
    font-size: 16px;
    float: left;
    text-align: center;
    line-height: 80px;
    margin-top: 30px;
}
}
.index-footer-footer a{
    color: #666666;
}
/*foonter end*/

/*advertisement begin*/
.courses-body-header{
    width: 100%;
    float: left;
    height: 50px;
    line-height: 50px;
    border-bottom: thin solid #F2F3F3;
    font-size: 17px;
    margin: 10px 0px;
    font-weight: 400;
    color: #333333;
}
.courses-body-header h2{
    width: auto;
    float: left;
    height: 50px;
    line-height: 50px;
    font-size: 17px;
    margin: 0px 30px 0px 0px;
    padding: 0px;
}
.courses-body-header h2.active{
    border-bottom: 3px solid #3878fe;
}
.content-tip-advertisement{
    background-color: #FFFFFF;
    width: 100%;
    box-sizing: border-box;
    padding: 10px;
    float: left;
    margin-bottom: 10px;
}
.content-tip-advertisement img{
    width: 100%;
    height: auto;
    float: left;
    margin-bottom: 10px;
}
.main-content-notice span{
    color: #808080;
    font-size: 14px;
    font-weight: 300;
}
.content-tip-notice{
    font-weight: 300;
}
/*advertisement end*/

/*concern begin*/
.content-tip-concern{
    background-color: #FFFFFF;
    width: 100%;
    box-sizing: border-box;
    padding: 10px 5px 20px 5px;
    float: left;
    margin-bottom: 10px;
}
.content-tip-concern li{
    width: 50%;
    box-sizing: border-box;
    text-align: center;
    color: #999999;
    height: auto;
    float: left;
    font-size: 12px;
}
.content-tip-concern li:first-child{
    padding-right: 5px;
    border-right: thin solid #e1e8ed;
}
.content-tip-concern li:last-child{
    padding-left: 5px;
}
.content-tip-concern img{
    width: 100%;
    height: auto;
    margin-bottom: 10px;
}
/*concern end*/

/*article begin*/
.content-tip-article{
    background-color: #FFFFFF;
    border-radius: 3px;
    width: 100%;
    box-sizing: border-box;
    float: left;
    margin-bottom: 10px;
    padding: 10px 15px 20px 15px;
}
.content-tip-article li{
    width: 100%;
    height: auto;
    float: left;
    padding: 5px 0px 5px 0px;
    overflow: hidden;
    line-height: 30px;
    color: #0080FF;
    font-size: 12px;
}
.content-tip-article li img{
    width: 33px;
    height: 33px;
    margin-right: 5px;
    border-radius: 2px;
}
.content-tip-article li span{
    float: left;
    margin-top: -33px;
    width: 100%;
    padding-left: 40px;
}
.content-tip-article li span h5{
    width: 100%;
    height: 20px;
    line-height: 20px;
    font-weight: 300;
    color: #337ab7;
    float: left;
    overflow: hidden;
    font-size: 13px;
    margin: 0px;
    padding: 0px;
}
.content-tip-article li span small{
    height: 13px;
    line-height: 13px;
    font-size: 12px;
    float: left;
    color: #999999;
    font-weight: 200;
}
/*article end*/
.content-tip-lable{
    border-radius: 3px;
    width: 100%;
    box-sizing: border-box;
    float: left;
    margin-bottom: 10px;
    padding: 10px 0px 20px 0px;
}
.content-tip-lable a{
    width: auto;
    height: 30px;
    line-height: 30px;
    border-radius: 2px;
    background-color: #E6E6E6;
    color: #666666;
    font-size: 13px;
    font-weight: 300;
    padding: 0px 15px;
    float: left;
    margin: 0px 10px 10px 0px;
    color: #666666;
}
.content-tip-lable a:hover{
    text-decoration: none;
    color: #FFFFFF;
    background-color: #666666;
}
/*content end*/

/*content-article start*/
.content-article{
    width: 100%;
    float: left;
    height: auto;
    background-color: #FFFFFF;
    border-radius: 3px;
    padding: 25px 30px 25px 30px;
    box-sizing: border-box;
    font-size: 14px;
}
.content-article content{
    width: 100%;
    height: auto;
    color: #666666;
    font-weight: 400;
    line-height: 25px;
}
.content-article content h5{
    margin-bottom: 10px;
    float: left;
    width: 100%;
}
.content-article content h4{
    border-left: 3px solid #3878fe;
    border-bottom: none;
    padding: 0px 0px 0px 15px;
    margin: 20px 0px;
    font-weight: 400;
    font-size: 18px;
    float: left;
    width: 100%;
}
.content-article content h3{
    border-left: 3px solid #3878fe;
    border-bottom: none;
    padding: 0px 0px 0px 15px;
    margin: 20px 0px;
    font-weight: 400;
    font-size: 20px;
    float: left;
    width: 100%;
}
.content-article content h2{
    border-left: 3px solid #3878fe;
    border-bottom: none;
    padding: 0px 0px 0px 15px;
    margin: 20px 0px;
    font-weight: 400;
    font-size: 25px;
    float: left;
    width: 100%;
}
.content-article content table{
    width: 100%;
    margin: 10px 0px 10px 0px;
    height: auto;
    border: thin solid #E6E6E6;
    font-size: 14px;
}
.content-article content th{
    border: thin solid #E6E6E6;
    text-align: center;
    height: 35px;
    font-size: 15px;
}
.content-article content td{
    border: thin solid #E6E6E6;
    text-align: center;
    padding-left: 5px;
    padding-right: 5px;
    height: 35px;
}
.content-article content img{
    max-width: 100%;
    margin: 10px 0px;
}
.content-article content ul{
    width: 100%;
    float: left;
    list-style: none;
    padding: 15px 20px;
}
.content-article content li{
    width: 100%;
    float: left;
    list-style-type: disc;
    border: none;
}
.content-article content li ul{
    width: 100%;
    float: left;
    list-style: none;
    padding: 10px 0px  10px 20px;
}
.content-article content li ul li{
    width: 100%;
    float: left;
    list-style-type: circle;
    border: none;
}
.content-article content strong{
    color: #3878fe;
    font-size: 14px;
}
.content-article content pre{
    width: 100%;
    float: left;
}
.content-article content pre code{
    padding: 20px;
}
/*.content-article content code{
    color: #3878fe;
    font-size: 14px;
}*/
.content-article content blockquote{
    width: 100%;
    float: left;
    font-size: 15px;
}
@media (max-width: 767px) {
.content-article h1{
    width: 100%;
    height: all;
    line-height: 25px;
    float: left;
    font-size: 20px;
    margin: 10px 0px 0px 0px;
    font-weight: 400;
    color: #333333;
}
}
@media screen and (min-width: 768px) {
.content-article h1{
    width: 100%;
    height: all;
    line-height: 50px;
    float: left;
    font-size: 23px;
    margin: 10px 0px 0px 0px;
    font-weight: 400;
    color: #333333;
}
}
.article-describe{
    border-left: 3px #c4cfd7 solid;
    padding: 10px 15px;
    color: #999999;
    background-color: #eff3f4;
    width: 100%;
    font-size: 15px;
    margin-bottom: 15px;
    line-height: 30px;
    font-weight: 300;
    float: left;
}
.article-editor{
    width: 100%;
    float: left;
    height: auto;
    color: #999999;
    height: 40px;
    line-height: 40px;
    font-weight: 300;
    font-size: 14px;
    margin: 10px 0px;
}
.article-editor a{
    color: #3878fe;
    font-weight: 400;
    margin-right: 10px;
}
.article-editor a:hover{
    color: #3878fe;
    text-decoration: none;
}
.article-editor font{
    margin: 0px 10px;
}
.article-tags{
    width: 100%;
    float: left;
}
.article-tags li{
    width: auto;
    float: left;
}
.article-tags li a {
    display: block;
    height: 30px;
    line-height: 30px;
    font-size: 14px;
    background-color: #f1f5f6;
    padding: 0 15px;
    color: #878e9a;
    margin-right: 10px;
    text-decoration: none;
}
.article-tags li a:hover{
    text-decoration: none;
}
.content-article footer{
    width: 100%;
    height: auto;
    padding: 15px;
    margin-top: 10px;
    background-color: #F7F7F7;
    box-sizing: border-box;
    border-radius: 3px;
    float: left;
    color: #807F7F;
    font-weight: 400;
}
.content-article footer ul{
    width: 100%;
    float: left;
    height: auto;
    margin: 0px;
}
.content-article footer ul li{
    width: 100%;
    float: left;
    height: 25px;
    line-height: 25px;
    overflow: hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
}
.content-article footer ul li a{
    color: #3878fe;
    height: 25px;
    line-height: 25px;
}
/*content-article end*/

/*comment start*/
.main-content-article-comment{
    width: 100%;
    float: left;
    background-color: #FFFFFF;
    height: auto;
    border-radius: 3px;
    padding: 0px 30px 20px 30px;
    margin-top: 20px;
}
.main-content-article-comment header{
    width: 100%;
    float: left;
    height: 45px;
    line-height: 45px;
    margin-top: 10px;
    border-bottom: thin solid #E6E6E6;
}
.main-content-article-comment header em{
    width: auto;
    float: left;
    height: 45px;
    line-height: 45px;
    border-bottom: thin solid #FF6666;
    font-style: normal;
    padding-right: 10px;
}
.main-content-article-comment .lists li{
    width: 100%;
    float: left;
    height: auto;
    font-weight: 300;
    border-bottom: thin dashed #E6E6E6;
    padding: 10px 0px 10px 0px;
}
.main-content-article-comment .lists li:last-child{
    border-bottom: none;
}
.main-content-article-comment .lists li a{
    color: #3878fe;
}
.main-content-article-comment .lists li a:hover{
    text-decoration: none;
}
.main-content-article-comment .lists li .comment-info{
    width: 100%;
    float: left;
    height: 50px;
}
.main-content-article-comment .lists li .comment-info .name{
    color: #3878fe;
    float: left;
    height: 25px;
    line-height: 25px;
}
.main-content-article-comment .lists li .comment-info span{
    float: left;
    height: 25px;
    line-height: 25px;
    color: #999999;
    padding: 0px 0px 0px 15px;
}
.main-content-article-comment .lists li .comment-info img{
    width: 50px;
    height: 50px;
    float: left;
    /*border-radius: 3px;*/
    border-radius: 50%;
    margin-right: 15px;
}
.main-content-article-comment .lists li .comment-cont{
    width: 100%;
    padding-left: 65px;
    color: #666666;
    margin: -20px 0px 0px 0px;
    float: left;
    height: auto;
}
.main-content-article-comment .lists li .comment-functions{
    width: 100%;
    color: #666666;
    float: left;
    height: auto;
    padding-left: 65px;
}
.main-content-article-comment .lists li .comment-functions span{
    width: auto;
    color: #999999;
    float: left;
    height: auto;
    margin-right: 15px;
    height: 25px;
    line-height: 25px;
}
.main-content-article-comment .lists li .comment-functions span i{
    width: auto;
    color: #CCCCCC;
    float: left;
    height: auto;
    margin-right: 5px;
}
.main-content-article-comment .lists li .comment-functions span.active{
    color: #3878fe;
}
.main-content-article-comment .lists li .comment-functions span.active i{
    color: #3878fe;
}
.comment-replay{
    width: 100%;
    float: left;
    background-color: #F3F3F3;
    padding: 10px 20px;
    box-sizing: border-box;
    margin: 10px 0px;
    display: none;
}
.comment-replay-more{
    width: 100%;
    float: left;
    height: 50px;
    line-height: 50px;
    color: #333333;
    font-weight: 400;
}
.comment-msg{
    width: 100%;
    float: left;
    height: 30px;
    line-height: 30px;
    margin-top: 10px;
    color: #333333;
    display: none;
}
.main-content-article-comment .lists li .comment-content{
    width: 100%;
    height: 38px;
    float: left;
    margin: 10px 0px;
    display: none;
}
.main-content-article-comment .lists li .comment-content input{
    width: calc(100% - 100px);
    height: 38px;
    line-height: 38px;
    float: left;
    border-radius: 0px;
    border: #3878fe thin solid;
    outline: none;
    padding-left: 15px;
    box-sizing: border-box;
    color: #666666;
}
.main-content-article-comment .lists li .comment-content input::placeholder{
    color: #999999!important;;
}
.main-content-article-comment .lists li .comment-content-publist{
    width: 100px;
    height: 38px;
    float: left;
    background-color: #3878fe;
    color: #FFFFFF;
    text-align: center;
    line-height: 38px;
    border: #3878fe thin solid;
}

.main-content-article-comment .recommends li{
    width: 100%;
    float: left;
    height: auto;
    font-weight: 400;
    border-bottom: thin dashed #E6E6E6;
    padding: 20px 0px;
}
.main-content-article-comment .recommends li:last-child{
    border-bottom: none;
}
.main-content-article-comment .recommends li a{
    color: #3878fe;
}
.main-content-article-comment .recommends li a:hover{
    text-decoration: none;
}
.main-content-article-comment .recommends li .comment-info{
    width: calc(100% - 165px);
    float: left;
    height: auto;
}
.main-content-article-comment .recommends li .comment-info .name{
    color: #3878fe;
    float: left;
    height: 25px;
    line-height: 25px;
}
.main-content-article-comment .recommends li .comment-info h3{
    float: left;
    width: 100%;
    height: 35px;
    line-height: 35px;
    color: #333333;
    margin: 0px;
    padding: 0px;
    font-size: 16px;
    font-weight: 400;
    overflow: hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
}
.main-content-article-comment .recommends li .comment-info span{
    float: left;
    width: 100%;
    height: 20px;
    line-height: 20px;
    color: #999999;
    font-weight: 300;
}
.main-content-article-comment .recommends li .recommends-img{
    width: 150px;
    height: 100px;
    float: left;
    border-radius: 3px;
    margin-right: 15px;
}
.main-content-article-comment .recommends li .comment-cont{
    width: 100%;
    color: #999999;
    margin: 0px;
    float: left;
    height: auto;
    font-weight: 300;
    height: 40px;
    line-height: 20px;
    margin-bottom: 5px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.main-content-article-comment textarea{
    width: 100%;
    margin-top: 10px;
    height: 80px;
    padding: 10px;
    border: thin solid #E6E6E6;
    border-radius: 5px;
    font-weight: 300;
    color: #666666;
    margin-bottom: 10px;
    outline: none;
}
.main-content-article-comment button{
    font-weight: 300;
}
.main-content-article-comment .pages{
    width: 100%;
    float: left;
    height: 50px;
    margin-bottom: 15px;
    margin-top: 10px;
    font-weight: 300;
    text-align: center;
    color: #3878fe;
}
.main-content-article-comment-empty{
    margin: 15px 0px;
    float: left;
    color: #999999;
}
.main-content-article-edit-comment{
    width: 100%;
    float: left;
    background-color: #FFFFFF;
    height: auto;
    border-radius: 3px;
    padding: 0px 30px 20px 30px;
    margin-top: 20px;
}
.main-content-article-edit-comment header{
    width: 100%;
    height: 45px;
    line-height: 45px;
    margin-top: 10px;
    border-bottom: thin solid #E6E6E6;
    margin-bottom: 10px;
}
.main-content-article-edit-comment header em{
    width: auto;
    float: left;
    height: 45px;
    line-height: 45px;
    border-bottom: thin solid #FF6666;
    font-style: normal;
    padding-right: 10px;
}
.main-content-article-edit-comment textarea{
    width: 100%;
    float: left;
    padding: 10px;
    border: thin solid #E6E6E6;
    border-radius: 5px;
    height: 100px;
    font-weight: 300;
    color: #666666;
    margin-bottom: 10px;
    outline: none;
}
.main-content-article-edit-comment button{
    font-weight: 300;
}
.main-content-article-edit-comment span{
    margin: 10px 0px;
    font-weight: 400;
    float: left;
    color: #999999;
}
.main-content-article-edit-comment span a{
    color: #3878fe;
    margin-left: 5px;
    margin-right: 5px;
}
.main-content-comment-submit{
    width: 100%;
    margin: 20px 0px;
}
.main-content-comment-submit textarea{
    width: 100%;
    float: left;
    border: thin solid #F4F6F6;
    outline: none;
    padding: 15px;
    margin: 20px 0px;
    background-color: #F5F6F6;
    font-weight: 300;
}
.main-content-comment-submit button{
    width: auto;
    float: left;
    background-color: #3878fe;
    color: #FFFFFF;
    padding: 10px 25px;
    border: none;
    outline: none;
}
.main-content-comment-submit-disable{
    width: auto;
    float: left;
    background-color: #E9EAEA;
    color: #999999;
    padding: 10px 25px;
    border: none;
    outline: none;
}
/*comment end*/

/*content-index-start*/
@media (max-width: 767px) {
    .content-index{
        width: 94%;
        margin: 0px 3% 20px 3%;
        float: left;
        height: auto;
        background-color: #FFFFFF;
    }
    .content-index content li img{
        width: 100px;
        float: left;
        z-index: 9;
        height: 70px;
        position: relative;
    }
    .content-index-img{
        width: 100px;
        float: left;
        z-index: 9;
        height: 70px;
        position: relative;
    }
    .content-index-content-span{
        width: 100%;
        height: 70px;
        padding-left: 110px; 
        z-index: 8;
        float: left;
        margin-top: -70px;
        position: relative;
    }
    .content-index-content-span h3{
        width: 100%;
        height: 25px;
        line-height: 25px;
        float: left;
        font-size: 14px;
        padding: 0px;
        overflow: hidden;
        text-overflow:ellipsis;
        white-space: nowrap;
        margin: 0px 0px 5px 0px;
    }
    .content-index-content-li-descript{
        width: 100%;
        height: 20px;
        line-height: 20px;
        font-size: 14px;
        color: #878e9a;
        font-weight: 300;
        margin-bottom: 3px;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
        overflow: hidden;
    }
    .content-index-content-li-footer{
        width: 100%;
        height: 20px;
        line-height: 20px;
        font-size: 12px;
        color: #999999;
        font-weight: 200;
        bottom: 0px;
        float: left;
        overflow: hidden;
        text-overflow:ellipsis;
        white-space: nowrap;
    }
}
@media screen and (min-width: 768px) {
    .content-index{
        width: 73%;
        float: left;
        height: auto;
        background-color: #FFFFFF;
        border-radius: 3px;
    }
    .content-index content li img{
        width: 180px;
        height: auto;
        float: left;
        z-index: 9;
        height: 110px;
        position: relative;
    }
    .content-index-img{
        width: 180px;
        height: auto;
        float: left;
        z-index: 9;
        height: 110px;
        position: relative;
    }
    .content-index-content-span{
        width: 100%;
        height: auto;
        padding-left: 190px; 
        z-index: 8;
        float: left;
        margin-top: -110px;
        position: relative;
        min-height: 110px;
    }
    .content-index-content-span h3{
        width: 100%;
        height: 35px;
        margin: 0px;
        line-height: 35px;
        font-size: 16px;
        font-weight: 400;
        letter-spacing: 1px;
        padding: 0px;
        color: #333333;
        overflow: hidden;
        text-overflow:ellipsis;
        white-space: nowrap;
    }
    .content-index-content-li-descript{
        width: 100%;
        height: 40px;
        line-height: 20px;
        margin-bottom: 20px;
        font-size: 14px;
        color: #878e9a;
        font-weight: 300;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
    }
    .content-index-content-li-footer{
        width: 100%;
        height: 20px;
        line-height: 20px;
        font-size: 12px;
        color: #999999;
        font-weight: 400;
        /*position: absolute;*/
        bottom: 0px;
        float: left;
    }
}
.content-index header{
    width: 100%;
    height: 65px;
    line-height: 65px;
    padding: 0px 30px;
    box-sizing: border-box;
    border-bottom:1px solid #e1e8ed;
    float: left;
}
.content-index header .left{
    width: 30%;
    height: 65px;
    line-height: 65px;
    font-size: 18px;
    float: left;
}
.content-index header .left i{
    margin-right: 5px;
    height: 65px;
    line-height: 65px;
    float: left;
    font-size: 20px;
}
.content-index header .right{
    width: 70%;
    height: 65px;
    line-height: 65px;
    float: left;
    padding-top: 15px;
    box-sizing: border-box;
    overflow: hidden;
}
.content-index header .right a{
    width: auto;
    height: 50px;
    line-height: 50px;
    float: right;
    font-size: 15px;
    margin: 0px;
    padding: 0px;
    margin-left: 30px;
    color: #333333;
}
.content-index header .right a:hover{
    text-decoration: none;
}
.content-index header .right .active{
    border-bottom: 3px solid #3878fe;
}
.content-index content{
    width: 100%;
    height: auto;
}
.content-index content ul{
    padding: 0px 20px;
}
.content-index content li{
    width: 100%;
    height: auto;
    padding: 18px 0px;
    border-bottom: 1px solid #F8F8F8;
    float: left;
    overflow: hidden;
}
.content-index-content-span h3 a{
    transition: color 1s;
    -webkit-transition: color 1s;
    color: #333333;
}
.content-index-content-span h3 a:hover{
    text-decoration: none;
    color: #3878fe;
}
.content-index-content-li-footer a{
    font-size: 13px;
    height: 20px;
    line-height: 20px;
    float: left;
    margin-right: 10px;
}
.content-index-content-li-footer i{
    margin-right: 5px;
    font-size: 14px;
    float: left;
    height: 20px;
    line-height: 20px;
    color: #a7b1c2;
}
.content-index-content-li-footer font{
    font-size: 13px;
    float: left;
    color: #a7b1c2;
}
.content-index-content-li-footer a font:hover{
    text-decoration: none;
    color: #3878fe;
}
.content-index-content-li-footer time{
    margin: 0px 5px;
    color: #a7b1c2;
    font-size: 13px;
}
.content-index-content-li-footer a:last-child{
    float: right;
    margin-right: 0px;
}
.content-index-content-li-footer a:hover{
    text-decoration: none;
    color: #3878fe;
}
.content-index-content-li-footer span{
    float: right;
    margin-right: 0px;
}
.content-index-content-li-footer span:hover{
    text-decoration: none;
    color: #3878fe;
}
.content-index footer{
    width: 100%;
    height: auto;
    line-height: auto;
    text-align: center;
    float: left;
    margin-top: -5px;
    padding: 10px;
}
/*content-index-end*/

/*topics start start*/
.content-topics{
    background-color: #FFFFFF;
}
.content-topics header{
    width: 100%;
    height: 65px;
    line-height: 65px;
    padding: 0px 30px;
    box-sizing: border-box;
    border-bottom:1px solid #e1e8ed;
    float: left;
}
.content-topics header .left{
    width: 30%;
    height: 65px;
    line-height: 65px;
    font-size: 18px;
    float: left;
}
.content-topics header .left i{
    margin-right: 5px;
    font-size: 20px;
    height: 65px;
    line-height: 65px;
    float: left;
}
.content-topics header .right{
    width: 70%;
    height: 65px;
    line-height: 65px;
    float: left;
    padding-top: 15px;
    box-sizing: border-box;
    overflow: hidden;
}
.content-topics header .right a{
    width: auto;
    height: 50px;
    line-height: 50px;
    float: right;
    font-size: 15px;
    margin: 0px;
    padding: 0px;
    margin-left: 30px;
}
.content-topics header .right .active{
    border-bottom: 3px solid #3878fe;
}
.content-topics content{
    width: 100%;
    height: auto;
    float: left;
}
.content-topics content ul{
    padding: 10px 30px;
}
@media (max-width: 767px) {
    .content-topics content li{
        width: 100%;
        height: auto;
        padding: 15px 0px;
        border-bottom:1px dashed #F5F5F5;
        float: left;
        overflow: hidden;
    }
}
@media screen and (min-width: 768px) {
    .content-topics content li{
        width: 50%;
        height: auto;
        padding: 15px 0px;
        border-bottom: 1px dashed #F5F5F5;
        float: left;
        overflow: hidden;
        box-sizing: border-box;
    }
    .content-topics content li:nth-child(odd) {
        padding-right: 10px;
    }
    .content-topics content li:nth-child(even) {
        padding-left: 10px;
    }
}
.content-topics content li img{
    width: 50px;
    height: 50px;
    float: left;
    z-index: 9;
    position: relative;
    border-radius: 2px;
}
.content-topics content li span{
    width: 100%;
    height: auto;
    padding-left: 60px; 
    z-index: 8;
    float: left;
    margin-top: -50px;
    position: relative;
    min-height: 50px;
}
.content-topics content li span h3{
    width: 100%;
    height: 30px;
    line-height: 30px;
    float: left;
    font-size: 14px;
    margin: 0px;
    padding: 0px;
    color: #333333;
}
.content-topics content li span h3 a{
    color: #333333;
    font-size: 15px;
    font-weight: 400;
}
.content-topics content li span h3 em{
    height: 24px;
    line-height: 24px;
    margin: 3px 0px;
    padding: 0px 10px;
    float: right;
    font-weight: 300;
    font-style: normal;
    font-size: 12px;
    background-color: #3878fe;
    color: #FFFFFF;
    width: auto;
}
.content-topics content li span p{
    width: 100%;
    height: 40px;
    line-height: 20px;
    float: left;
    font-size: 14px;
    margin: 5px 0px 0px;
    padding: 0px;
    font-weight: 300;
    color: #999999;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}
.content-topics footer{
    float: left;
    width: 100%;
    text-align: center;
    height: 90px;
    font-size: 200;
}
.content-topics footer ul{
    margin-top: 20px;
    margin-left: auto;
    margin-right: auto;
}
/*topics start end*/
.content-notifications{
    background-color: #FFFFFF;
}
.content-notifications header{
    width: 100%;
    height: 65px;
    line-height: 65px;
    padding: 0px 30px;
    box-sizing: border-box;
    border-bottom:1px solid #e1e8ed;
    float: left;
}
.content-notifications header .left{
    width: 30%;
    height: 65px;
    line-height: 65px;
    font-size: 18px;
    float: left;
}
.content-notifications header .left i{
    margin-right: 5px;
    font-size: 20px;
    height: 65px;
    line-height: 65px;
    float: left;
}
.content-notifications header .right{
    width: 70%;
    height: 65px;
    line-height: 65px;
    float: left;
    padding-top: 15px;
    box-sizing: border-box;
    overflow: hidden;
}
.content-notifications header .right a{
    width: auto;
    height: 50px;
    line-height: 50px;
    float: right;
    font-size: 15px;
    margin: 0px;
    padding: 0px;
    margin-left: 30px;
}
.content-notifications header .right .active{
    border-bottom: 3px solid #3878fe;
}
.content-notifications content{
    width: 100%;
    height: auto;
    background-color: #FFFFFF;
    float: left;
}
.content-notifications content ul{
    padding: 0px 20px 0px 20px;
}
.content-notifications content li{
    width: 100%;
    height: auto;
    padding: 15px 0px 15px 0px;
    border-bottom:1px dashed #F5F5F5;
    float: left;
    overflow: hidden;
}
.content-notifications content li:last-child{
    border-bottom: none;
}
.content-notifications content li h3{
    width: 100%;
    height: 20px;
    line-height: 20px;
    float: left;
    font-size: 14px;
    margin: 0px;
    padding: 0px;
    font-weight: 200;
    color: #666666;
    overflow: hidden;
}
.content-notifications content li h3 a{
    color: #225599;
}
.content-notifications content li h3 em{
    float: right;
    font-weight: 200;
    margin-right: 10px;
    font-style: normal;
    font-size: 13px;
}
.content-notifications content li h5{
    width: 100%;
    height: auto;
    float: left;
    font-size: 13px;
    margin: 0px;
    padding: 0px;
    font-weight: 200;
    color: #999999;
    line-height: 20px;
}
.content-notifications footer{
    width: 100%;
    height: 80px;
    background-color: #FFFFFF;
    margin-top: -5px;
    padding: 20px;
    box-sizing: border-box; 
    float: left;
}
.content-notifications footer span{
    width: 100%;
    height: 35px;
    background-color: #F1F1F1;
    color: #666666;
    border-radius: 2px;
    text-align: center;
    line-height: 35px;
    float: left;
}
.content-notifications footer font{
    width: 100%;
    height: 35px;
    background-color: #F3F6F6;
    color: #999;
    font-weight: 200;
    border-radius: 2px;
    text-align: center;
    line-height: 35px;
    float: left;
}
/*消息 end*/

/*publish start*/
.content-publish{
    background-color: #FFFFFF;
}
.content-publish header{
    width: 100%;
    height: 60px;
    line-height: 60px;
    padding: 0 20px;
    border-bottom: 1px solid #e1e8ed;
    float: left;
}
.content-publish header h2{
    height: 60px;
    line-height: 60px;
    float: left;
    font-weight: bold;
    font-size: 15px;
    margin: 0px;
}
.content-publish header h2 i{
    font-weight: normal;
    font-size: 20px;
    margin-right: 5px;
    float: left;
    height: 60px;
    line-height: 60px;
}
.content-publish content{
    width: 100%;
    padding: 20px;
    height: auto;
    float: left;
}
.content-publish label{
    height: 30px;
    line-height: 30px;
    font-weight: 400;
    font-size: 15px;
    margin-top: 15px;
}
.content-publish-input{
    outline: none;
    float: left;
    color: #555555;
    width: 100%;
    outline: none;
    height: 40px;
    line-height: 42px;
    padding-left: 15px;
    border: thin solid #e5e9ec;
    box-sizing: border-box;
    background-color: #e8ecf3;
    font-size: 14px;
    font-weight: 400;
}
.content-publish-select{
    font-weight: 400;
    outline: none;
    float: left;
    color: #555555;
    width: 100%;
    outline: none;
    height: 40px;
    line-height: 42px;
    padding-left: 15px;
    border: thin solid #e5e9ec;
    box-sizing: border-box;
    background-color: #FFFFFF;
    font-size: 14px;
    font-weight: 300;
}
.content-publish-select-cotain{
    font-weight: 400;
    outline: none;
    float: left;
    color: #555555;
    width: 200px;
    outline: none;
    height: 40px;
    line-height: 40px;
    padding-left: 15px;
    border: 1px solid #e5e9ec;
    box-sizing: border-box;
    background-color: #FFFFFF;
    font-size: 14px;
}
.content-publish-select-one{
    font-weight: 400;
    outline: none;
    float: left;
    color: #555555;
    width: 170px;
    outline: none;
    height: 38px;
    line-height: 38px;
    border: none;
    box-sizing: border-box;
    background-color: #FFFFFF;
    font-size: 14px;
}
.content-publish-button{
    height: 45px;
    line-height: 45px;
    float: left;
    padding: 0px 50px;
    margin: 30px 0px;
    background-color: #3878fe;
    color: #FFFFFF;
    border: none;
    border-radius: 1px;
    font-size: 15px;
    letter-spacing: 1px;
}
/*publish end*/

/*tags start*/
.content-tag-detial header{
    height: auto;
    float: left;
    width: 100%;
    padding: 20px;
    margin-bottom: 20px;
    background-color: #FFFFFF;
}
.content-tag-detial header small{
    margin-left: 10px;
}
.content-tag-detial header .left{
    width: 100px;
    height: 100px;
    margin-right: 15px;
    float: left;
}
.content-tag-detial header .left img{
    width: 100px;
    height: 100px;
    float: left;
}
.content-tag-detial header .right{
    width: calc(100% - 115px);
    float: left;
}
.content-tag-detial header .title{
    width: 100%;
    float: left;
    height: 40px;
    line-height: 40px;
    margin-bottom: 5px;
}
.content-tag-detial header .title h1{
    width: 100%;
    font-size: 18px;
    height: 40px;
    line-height: 40px;
    font-weight: 400;
    margin: 0px;
    float: left;
    overflow: hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
}
.content-tag-detial header .title em{
    font-size: 13px;
    height: 32px;
    line-height: 32px;
    padding: 0px 15px;
    margin: -36px 0px;
    font-weight: 300;
    float: right;
    background-color: #3878fe;
    color: #FFFFFF;
    width: auto;
    font-style: normal;
}
.content-tag-detial header .title em.active{
    font-size: 13px;
    height: 32px;
    line-height: 28px;
    padding: 0px 15px;
    margin: -36px 0px;
    font-weight: 400;
    float: right;
    background-color: #FFFFFF;
    border: 2px solid #3878fe;
    color: #3878fe;
    width: auto;
    font-style: normal;
}
.content-tag-detial header p{
    font-size: 14px;
    color: #666666;
    line-height: 20px;
    font-weight: 300;
    margin: 0px;
}
.content-tag-detial content{
    width: 100%;
    padding: 20px;
    background-color: #FFFFFF;
    float: left;
}
/*.content-tag-detial content h5{
    margin: 0px 0px 5px 0px;
    padding: 0px;
    height: 25px;
    line-height: 25px;
    font-size: 15px;
    overflow: hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
    color: #3878fe;
}
.content-tag-detial content small{
    margin-left: 10px;
}
.content-tag-detial content h6{
    font-size: 14px;
    color: #999999;
    height: 40px;
    line-height: 20px;
    font-weight: 300;
    margin: 0px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}
*/
.content-tag-detial content li{
    width: 100%;
    border-bottom: thin dashed #CCCCCC;
    float: left;
    padding-bottom: 20px;
    margin-bottom: 20px;
}
.content-tag-detial-content-img{
    width: 70px;
    height: 70px;
    margin-right: 15px;
    float: left;
}
.content-tag-detial-content-img img{
    width: 70px;
    height: 70px;
    border-radius: 1px;
}
.content-tag-detial-content-des{
    width: calc(100% - 115px);
    height: auto;
    float: left;
    float: left;
}
.content-tag-detial footer{
    float: left;
    width: 100%;
    text-align: center;
    height: 70px;
    font-size: 200;
    background-color: #FFFFFF;
}
.content-tag-detial footer ul{
    margin-top: 0px;
    margin-left: auto;
    margin-right: auto;
}
/*tag detial end*/

/*个人中心*/
.author-header{
    width: 100%;
    height: 180px;
    padding-top: 20px;
    padding-bottom: 20px;
    float: left;
    background-image: url(/img/banner_reporter.png);
    background-size: 100% 100%;
}
.author-header-content{
    max-width: 1150px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}
.author-portrait{
    width: 100px;
    height: 100px;
    float: left;
    border-radius: 3px;
}
.author-header-information{
    width: 100%;
    float: left;
    padding-left: 130px;
    margin-top: -100px;
}
.author-content{
    max-width: 1150px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    margin-bottom: 20px;
}

/*search start*/
.search-main-content{
    max-width: 1150px;
    margin: 0px auto 30px auto;
    height: auto;
    display: block;
}
@media (max-width: 767px) {
    .search-header{
        width: 100%;
        padding-left: 5%;
        padding-right: 5%;
        float: left;
        margin-top: 30px;
    }
    .search-content{
        width: 100%;
        padding-left: 5%;
        padding-right: 5%;
        float: left;
        margin-top: 30px;
        margin-bottom: 30px;
    }
}
@media screen and (min-width: 768px) {
    .search-header{
        width: 100%;
        padding-left: 20%;
        padding-right: 20%;
        float: left;
        margin-top: 30px;
    }
    .search-content{
        width: 100%;
        padding-left: 20%;
        padding-right: 20%;
        float: left;
        margin-top: 30px;
        margin-bottom: 30px;
    }
}
.search-header form{
    width: 100%;
    height: 45px;
    line-height: 45px;
    float: left;
    background-color: #FFFFFF;
    border-radius: 3px;
    padding: 0px 10px;
}
.search-header form input{
    width: 90%;
    float: left;
    height: 45px;
    line-height: 45px;
    font-weight: 300;
    outline: none;
    border: none;
    padding: 15px;
    box-sizing: border-box;
    background-color: #FFFFFF;
    border-radius: 3px 0px 0px 3px;
}
.search-header form button{
    width: 10%;
    outline: none;
    padding: 0px;
    border: none;
    float: left;
    height: 45px;
    box-sizing: border-box;
    background-color: #FFFFFF;
}
.search-header form i{
    width: 100%;
    float: left;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 22px;
}
.search-content header{
    width: 100%;
    float: left;
    height: 20px;
    line-height: 22px;
    padding-left: 30px;
    background-size: 20px 20px;
    margin-bottom: 10px;
    background-position: left;
    color: #666666;
    background-image: url(../../images/search_hot.png);
    background-repeat: no-repeat;
}
.search-content ul{
    width: 100%;
    float: left;
}
.search-content ul li{
    width: auto;
    float: left;
    font-size: 14px;
    padding-right: 25px;
    line-height: 40px;
    font-weight: 400;
    color: #333333;
}
.search-content ul li a{
    color: #3878fe;
}
.search-footer{
    width: 100%;
    padding-left: 20%;
    padding-right: 20%;
    float: left;
    margin-top: 10px;
    min-height: 60px;
}
.search-footer ul{
    width: 100%;
    float: left;
}
.search-footer ul li{
    width: auto;
    float: left;
    font-size: 14px;
    padding-right: 35px;
    line-height: 30px;
    font-weight: 300;
    color: #333333;
}
.search-result-header{
    width: auto;
    float: left;
    font-size: 16px;
    padding-right: 35px;
    line-height: 40px;
    font-weight: 300;
    color: #333333;
}
.search-result{
    width: 100%;
    height: auto;
    padding-bottom: 30px;
    max-width: 1150px;
    margin: 0px auto 0px auto;
}
@media (max-width: 767px) {
    .search-result{
        padding-right: 30px;
    }
}
.search-result-content{
    max-width: 1150px;
    margin: 0px auto 0px auto;
}
.search-result content li.questions{
    width: 100%;
    height: auto;
    padding: 15px 0px 15px 0px;
    border-bottom:1px solid #F5F5F5;
    float: left;
}
.search-result content li.questions img{
    width: 40px;
    height: 40px;
    margin-right: 5px;
    border-radius: 2px;
}
.search-result content li.questions span{
    float: left;
    margin-top: -40px;
    width: 100%;
    padding: 0px 50px 0px 50px;
}
.search-result content li.questions span h4{
    width: 100%;
    float: left;
    line-height: 20px;
    font-size: 14px;
    color: #333333;
    font-weight: 400;
    margin: -3px 0px 5px 0px;
}
.search-result content li.questions span h4:hover{
    color: #518cea;
}
.search-result content li.questions span h5{
    color: #999999;
    font-weight: 200;
    margin: 0px;
    height: 20px;
    line-height: 20px;
    font-size: 8px;
}
.search-result content li.questions span h5 em{
    background-color: #E6E6E6;
    font-size: 8px;
    border-radius: 2px;
    color: #999;
    font-style: normal;
    height: 20px;
    line-height: 20px;
    float: left;
    padding: 0px 8px 0px 8px;
    margin-right: 5px;
}
.search-result content li:last-child{
    border: none;
}
/*search end*/

/*users start*/
.users-container{
    width: 100%;
    max-width: 1150px;
    margin: 0px auto;
}
.users-row{
    width: 100%;
    float: left;
    margin: 20px 0px;
    overflow: hidden;
}
.users-left{
    width: 25%;
    float: left;
    margin-right: 30px;
    background-color: #FFFFFF;
    height: 1565px;
    border-radius: 5px;
}
.users-left header{
    width: 100%;
    float: left;
    height: auto;
    border-bottom: thin solid #EFEFEE;
    text-align: center;
    margin-bottom: 20px;
}
.users-left header img{
    width: 90px;
    height: 90px;
    margin: 30px auto 0px auto;
    border-radius: 50%;
}
.users-left header h5{
    width: 100%;
    height: 20px;
    line-height: 20px;
    margin: 10px 0px;
    font-size: 15px;
    text-align: center;
    float: left;
}
.users-left header ul{
    width: 100%;
    height: 30px;
    line-height: 30px;
    float: left;
    margin-bottom: 15px;
}
.users-left header ul li{
    display: initial;
    font-size: 13px;
    font-weight: 400;
    margin-right: 10px;
    color: #999999;
}
.users-left header span{
    width: 100%;
    height: 30px;
    line-height: 30px;
    font-size: 12px;
    text-align: center;
    float: left;
}
.users-left content{
    width: 100%;
    float: left;
    height: auto;
    padding: 0px 30px;
    box-sizing: border-box;
}
.users-left content li{
    width: 100%;
    line-height: 50px;
    padding: 0px;
    color: #333333;
    float: left;
    height: auto;
    border-bottom: thin dashed #E6E6E6;
}
.users-left content li a{
    color: #333333;
    text-decoration: none;
}
.users-left content li i{
    margin-right: 5px;
}
.users-right{
    width: calc(75% - 30px);
    box-sizing: border-box;
    padding: 0px 30px 50px 30px;
    background-color: #FFFFFF;
    float: left;
    min-height: 1565px;
    font-weight: 400;
    box-sizing: border-box;
    border-radius: 5px;
}
.users-right header{
    width: 100%;
    height: 60px;
    line-height: 60px;
    margin-bottom: 30px;
    text-align: left;
    float: left;
    border-bottom: thin solid #EEEEEE;
}
.users-right header i{
    margin-right: 5px;
    float: left;
    font-size: 20px;
}
.users-right content{
    width: 100%;
    height: 100%;
}
.users-right content li{
    width: 100%;
    height: auto;
    float: left;
    padding: 15px 0px;
    border-bottom: thin dashed #E6E6E6;
}
.users-right content li h5{
    height: 35px;
    line-height: 35px;
    margin: 0px;
    width: 100%;
    float: left;
    font-weight: 400;
}
.users-right content li h5 a{
    color: #333333;
}
.users-right content li h5 a:hover{
    color: #3878fe;
    text-decoration: none;
}
.users-right content li h6{
    height: 25px;
    line-height: 25px;
    color: #808080;
    margin: 0px;
    width: 100%;
    font-weight: 300;
    float: left;
}
.users-right content li h6 a{
    color: #666666;
    padding: 0px 10px;
    border-radius: 2px;
    font-size: 12px;
    background-color: #E6E6E5;
    font-style: normal;
    margin: 3px 10px 2px 0px;
    height: 20px;
    line-height: 20px;
    float: left;
}
.users-right content li h6 a:hover{
    text-decoration: none;
}
.users-right content li h6 em{
    color: #999999;
    margin-right: 5px;
    font-style: normal;
    margin-left: 5px;
    font-size: 12px;
}
.portrait-update img{
    width: 100px;
    height: 100px;
    margin-bottom: 10px;
    float: left;
    border-radius: 3px;
}
.users-right-lists{
    width: 100%;
    float: left;
    height: 40px;
    margin-bottom: 20px;
}
.users-right-lists label{
    width: 80px;
    float: left;
    height: 40px;
    line-height: 40px;
    text-align: right;
    padding-right: 20px;
    font-weight: 400;
    color: #333333;
    box-sizing: border-box;
}
.users-right-lists-conetnt{
    width: calc(100% - 80px);
    float: left;
}
.users-right-lists-conetnt img{
    width: 40px;
    height: 40px;
    border-radius: 50%;
    float: left;
    margin-right: 10px;
}
.users-right-lists-conetnt p{
    width: auto;
    height: 40px;
    line-height: 40px;
    outline: none;
    float: left;
    color: #666666;
    font-size: 12px;
    font-weight: 300;
}
.users-right-lists-conetnt input{
    width: 50%;
    height: 40px;
    line-height: 40px;
    padding: 0px 15px;
    border: 1px solid #E6E6E6;
    outline: none;
    float: left;
    color: #666666;
    font-size: 14px;
    font-weight: 300;
    border-radius: 1px;
}
.users-right-lists-conetnt select{
    width: 30%;
    height: 40px;
    line-height: 40px;
    padding: 0px 15px;
    border: 1px solid #E6E6E6;
    outline: none;
    float: left;
    color: #666666;
    font-weight: 300;
}
.users-right-lists-conetnt textarea{
    width: 100%;
    height: 120px;
    line-height: 40px;
    padding: 0px 15px;
    border: 1px solid #E6E6E6;
    outline: none;
    float: left;
    color: #666666;
    font-weight: 300;
}
.users-right-lists-conetnt button{
    width: auto;
    height: 45px;
    line-height: 45px;
    padding: 0px 30px;
    background-color: #3878fe;
    border: none;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 300;
    border-radius: 2px;
    outline: none;
}
/*users end*/

/*users-index-start*/
.users-index{
    background-color: #FFFFFF;
}
.users-index-header{
    width: 100%;
    float: left;
    height: 60px;
    line-height: 60px;
    padding-left: 20px;
    border-bottom: thin solid #E6E6E6;
    margin-bottom: 8px;
    font-size: 16px;
}
.users-index-header i{
    width: auto;
    float: left;
    height: 60px;
    line-height: 60px;
    margin-right: 5px;
    font-size: 20px;
}
.users-index-content{
    width: 100%;
    background-color: #FFFFFF;
    float: left;
    margin-bottom: 20px;
    border-radius: 3px;
}
.users-index-content ul{
    width: 100%;
    padding: 0px 20px;
    float: left;
}
.users-index-content ul.article{
    line-height: 50px;
    float: left;
}
.users-index-content li{
    width: 100%;
    float: left;
    height: auto;
    line-height: 60px;
    min-height: 60px;
    font-weight: 300;
    font-size: 14px;
    border-bottom: thin dashed #E8ECEC;
}
.users-index-content li:last-child{
    border-bottom: none;
}
.users-index-content li a{
    color: #333333;
    font-size: 14px;
    font-weight: 400;
}
.users-index-content li a:hover{
    color: #000000;
    text-decoration: none;
}
.users-index-content li font{
    width: 100%;
    float: left;
    color: #666666;
    font-size: 14px;
    margin: 5px 0px;
}
.users-index-content li.empty{
    width: 100%;
    height: 60px;
    line-height: 60px;
    float: left;
}
.users-index-comments{
    width: 100%;
    background-color: #FFFFFF;
    float: left;
    margin-bottom: 20px;
    border-radius: 3px;
}
.users-index-comments ul{
    width: 100%;
    padding: 0px 20px;
    float: left;
}
.users-index-comments li{
    width: 100%;
    float: left;
    height: auto;
    line-height: 60px;
    padding: 10px 0px;
    font-weight: 300;
    font-size: 14px;
    color: #999999;
    border-bottom: thin dashed #E8ECEC;
}
.users-index-comments li h3{
    width: 100%;
    float: left;
    line-height: 30px;
    height: 30px;
    font-weight: 300;
    font-size: 14px;
    margin: 0px;
}
.users-index-comments li:last-child{
    border-bottom: none;
}
.users-index-comments li a{
    color: #333333;
    font-size: 14px;
    font-weight: 400;
}
.users-index-comments li a:hover{
    color: #000000;
    text-decoration: none;
}
.users-index-comments li font{
    width: 100%;
    height: auto;
    line-height: 20px;
    font-weight: 300;
    float: left;
    font-size: 13px;
}
.users-index-comments li.empty{
    width: 100%;
    height: 60px;
    line-height: 60px;
    float: left;
}
.users-index-info{
    width: 100%;
    float: left;
    background-color: #FFFFFF;
    margin-bottom: 20px;
    padding: 20px;
    font-weight: 300;
}
@media (max-width: 767px) {
    .users-index-avatar{
        width: 100%;
        float: left;
        margin-right: 2%;
        text-align: center;
    }
    .users-index-avatar img{
        width: 100px;
        height: 100px;
        border-radius: 50%;
    }
    .users-index-personinfo{
        width: 100%;
        float: left;
    }
    .users-index-personinfo li{
        width: auto;
        height: 15px;
        line-height: 15px;
        margin-right: 10px;
        padding-right: 10px;
        color: #999999;
        display:inline;
        border-right: thin solid #CCCCCC;
    }
    .users-index-follow{
        width: 100%;
        float: left;
        text-align: center;
        margin-top: 10px;
    }
    .users-index-follow li{
        width: auto;
        display:inline;
        margin-left: 10px;
        line-height: 26px;
        color: #3878fe;
        height: 30px;
        padding: 6px 10px;
        border-radius: 2px;
        margin-bottom: 5px;
        border: 2px solid #3878fe;
    }
    .users-index-follow a{
        width: auto;
        display:inline;
        margin-left: 10px;
        line-height: 26px;
        color: #3878fe;
        height: 30px;
        padding: 6px 10px;
        border-radius: 2px;
        margin-bottom: 5px;
        border: 2px solid #3878fe;
    }
    .users-index-follow a:hover{
        text-decoration: none;
        color: #3878fe;
    }
    .users-index-follow li.active{
        background-color: #3878fe;
        color: #FFFFFF;
    }
    .users-index-personinfo h3{
        width: 100%;
        height: auto;
        text-align: center;
        line-height: 35px;
        font-size: 19px;
        margin: 10px 0px;
        float: left;
    }
    .users-index-personinfo h3 small{
        float: left;
        width: 100%;
        font-weight: 300;
        font-size: 15px;
    }
}
@media screen and (min-width: 768px) {
    .users-index-avatar{
        width: 80px;
        height: 80px;
        float: left;
        margin-right: 15px;
    }
    .users-index-avatar img{
        width: 100%;
        height: auto;
        border-radius: 50%;
        float: left;
    }
    .users-index-personinfo{
        width: calc(100% - 95px);
        float: left;
        height: auto;
        z-index: 1;
    }
    .users-index-personinfo li{
        width: auto;
        height: 15px;
        line-height: 15px;
        margin-right: 10px;
        padding-right: 10px;
        color: #999999;
        float: left;
        border-right: thin solid #CCCCCC;
    }
    .users-index-follow{
        width: auto;
        height: 40px;
        float: left;
        z-index: 2;
        padding-left: 95px;
        margin-top: 10px;
    }
    .users-index-follow a{
        width: auto;
        float: left;
        line-height: 26px;
        color: #3878fe;
        height: 30px;
        padding: 0px 15px;
        border-radius: 2px;
        margin-bottom: 5px;
        border: 2px solid #3878fe;
        font-weight: 400;
    }
    .users-index-follow a:hover{
        text-decoration: none;
        color: #3878fe;
    }
    .users-index-follow li{
        width: auto;
        float: left;
        margin-right: 10px;
        line-height: 26px;
        color: #3878fe;
        height: 30px;
        padding: 0px 15px;
        border-radius: 2px;
        margin-bottom: 5px;
        border: 2px solid #3878fe;
        font-weight: 400;
    }
    .users-index-follow li.active{
        background-color: #3878fe;
        color: #FFFFFF;
    }
    .users-index-personinfo h3{
        width: 100%;
        height: 35px;
        line-height: 35px;
        font-size: 19px;
        margin: 0px;
        float: left;
    }
    .users-index-personinfo h3 small{
        margin-left: 15px;
        font-weight: 300;
        font-size: 15px;
    }
}
.users-index-personinfo ul{
    width: 100%;
    float: left;
    padding: 5px 0px;
    text-align: center;
}
.users-index-personinfo li strong{
    color: #333333;
    font-weight: 500;
}
.users-index-personinfo li:last-child{
    border-right: none;
}
.users-index-personinfo footer{
    width: 100%;
    float: left;
    height: auto;
    line-height: 25px;
    font-weight: 400;
    color: #999999;
}
.users-index-personinfo li i{
    margin-right: 3px;
}
.users-index-personinfo h3 small i{
    color: #f8d537;
    margin-right: 8px;
}
.users-index-personinfo textarea{
    width: 100%;
    float: left;
    border: thin dashed #E6E6E6;
    outline: none;
    padding: 10px;
    box-sizing: border-box;
    border-radius: 3px;
    display: none;
    margin: 10px 0px;
}
/*specials start*/
.specials{
    background-image: url(../../images/bg.jpg);
    background-size: 100% auto;
    margin: 0px auto;
    padding: 30px 0px;
    font-size: 14px;
    color: #666666;
    font-weight: 300;
}
.specials-main{
    max-width: 1150px;
    margin: 0px auto;
    padding: 30px 0px;
}
.specials table{
    width: 100%;
    height: auto;
    float: left;
    border: thin solid #CCCCCC;
}
.specials table th{
    height: 35px;
    text-align: center;
    min-width: 100px;
    border: thin solid #CCCCCC;
}
.specials table td{
    padding: 5px 10px;
    line-height: 25px;
    height: auto;
    min-width: 100px;
    border: thin solid #CCCCCC;
}
.specials h5{
    margin-bottom: 10px;
    font-size: 14px;
    color: #333333;
}
.specials h4{
    border-bottom: thin solid #E6E6E6;
    padding: 5px 0px 8px 0px;
    margin-bottom: 10px;
    font-size: 18px;
    color: #333333;
}
.specials h3{
    border-bottom: thin solid #E6E6E6;
    padding: 5px 0px 8px 0px;
    margin-bottom: 10px;
    font-size: 20px;
    color: #333333;
}
.specials h2{
    border-bottom: thin solid #E6E6E6;
    padding: 5px 0px 8px 0px;
    margin-bottom: 10px;
    font-size: 22px;
    color: #333333;
}
/*specials end*/

.product-card{
    width: 100%;
    max-width: 390px;
    height: 84px;
    background-color: #E6E6E6;
    border-radius: 8px;
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    margin: 15px auto;
    padding: 12px;
    background-color: #F6F6F6;
    cursor: pointer;
}
.product-card .logo{
    width: 60px;
    height: 60px;
    margin: 0!important;
    border-radius: 5px;
    background-size: 60px 60px;
}
.product-card-info{
    flex: 1;
    padding: 5px 0 5px 12px;
}
.product-card-info .title{
    height: 30px;
    line-height: 30px;
    font-size: 16px;
    color: #000000;
}
.product-card-info .describe{
    height: 20px;
    font-size: 14px;
    color: #999999;
    overflow: hidden;
}
.product-card i{
    height: 60px;
    line-height: 60px;
    font-size: 20px;
    color: #999999;
}

.input-search-notice{
    position: absolute;
    z-index: 999;
    background-color: #FFFFFF;
    width: 200px;
    top: 34px;
    border: 1px solid #E7EBF3;
    border-top: none;
    height: auto;
    display: none;
}
.input-search-notice li{
    width: 100%;
    float: left;
    height: 35px;
    line-height: 35px;
    float: left;
    padding: 0px 15px;
}
.input-search-notice li:hover{
    background-color: #E6E6E6;
}