.by_24time {border: 1px solid #e5e5e5;}
.hours24-data-tb {
    width: 100%;
    overflow: hidden;
    border-radius: 6px;
    margin-top: 9px;
    position: relative;
}
.hours24-list {
    zoom: 1;
    width: 1704px;
    overflow: hidden;
    list-style: none;
    height: 240px;
}
.hours24-list-item {
    height: 100%;
    text-align: center;
    position: relative;
    overflow: hidden;
    display: block;}
.hours24-list li {
    height: 240px;
    width: 67px;
    padding-right: 1px;
    float: left;
    position: relative;
    list-style: none;
}
.hours24-list-item em {
    font-size: 14px;
    color: #666;
    margin-top: 0;
    height: 20px;
    line-height: 20px;
    margin-top: 11px;
    display: block;
    text-align: center;
}
.hours24-list-item i {
    margin: 0 auto;
    width: 32px;
    height: 32px;
    margin-top: 13px;
    margin-bottom: 91px;
    display: block;
    text-align: center;
    color: #fff;
    font-size: 14px;
}
.hours24-list-item i img{
    width: 32px;
}
.hours24-list-item b {
    font-size: 12px;
    color: #222;
    display: block;
    text-align: center;
    height: 18px;
    font-weight: 400;
    font-style: normal;
}
.hours24-list-item span {
    height: 13px;
    line-height: 13px;
    width: 54px;
    bottom: 17px;
    border-radius: 0;
    border-color: transparent;
    padding: 0 6px;
    color: #26ab45;
    background-color: #d4f6dc;
    border: 1px solid rgba(255, 255, 255, .5);
    position: absolute;
    display: block;
    text-align: center;
}
.hours24-list-item .rain {
    background: -webkit-gradient(linear,left top,left bottom,from(#f2f9ff),to(rgba(242,249,255,0)));
    background: -webkit-linear-gradient(top,#f2f9ff,rgba(242,249,255,0));
    background: linear-gradient(to bottom,#f2f9ff,rgba(242,249,255,0));
}

.hours24-chart {
    height: 90px;
    top: 60px;
    position: absolute;
    width: 1627px;
    height: 95px;
}

.left-swipe-btn, .right-swipe-btn {
    width: 26px;
    height: 50px;
    position: absolute;
    top: 50%;
    margin-top: -25px;
    z-index: 2;
}
.left-swipe-btn {
    left: 0;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADQAAABkCAQAAABj/9uXAAACnUlEQVR42u3aTUhUURQHcClp16qSalELCyIoCIoIWtjHnHNnzEEqhwIp/GhhzKJxoQ4xdRBE3LgSWwxBZAjtay8u3bhxI7gSV7pwhoeg+PGCydeENTP3470/KnPv9g0/5r37ce45t6Gh3uoN3jjHg5Sht6qHn6mWxI3YxY5TkUAkBzt/4F5+HG8OGfwX+gPm6EX8ektj5NB+H1LJxHkEVOqxzsRlCFTqPW2XMJCQqKfJ0xCIRGXVPTkBgEr9tcX/soKEB2JXIVAJewCCSKi94yQGEtWpvVC5QSTcq0m5QiT8Sms9dIdIOKUxs8KASLgVBJGomyCI3lMTBhJOVx1/4UEkikEQfeQLGEj4TcWBHi5EkrgNglR/hXUibIhE3QFBlPnv5hEBJPFbIIi6UZA8OgOC6GEI0JfvXsErfvpWfUA4Qz9++nu+7/teocaTTU7Q7Iy/37xijWfvWkNK5ucCZnfn83SNp19aQsnhxYWA2d6anKr5i+yB5VWPSY0sLwXM5sZoXuc3bWeNoa6x1ZXyt8lOaL6Fa4ZQenx9LWDW19Lj2t/0vhGUnfCKAbO60jVmEpkbQKP5zY2AWV5KjTiseNUenZza3gqYxYXksOHk7tOE8tO7OwEzP6fM44d3mlD528zOWAUqg7pQwRHKoV5dDjQYtF+d6/DWHgzOE7YPtAQZTFjHRbUdtE0YLqoVNr6vEWwTdlu51cZnFZzYbeV/h1t7WuGWdXBiGEC6hFuGJ4pzGChzlIL8w3Rs6T5mR0vUYRl0/IclNEApGlTSCZVGAyUGUalOVPIWlI4GJdhBJQNQEQRU1kEVqjClN0gxkQeeQMqjiIIvqISNKcojrhkgLk5EfxUk8sstv6/r8JWQr+uULyDR80gvINXboW+/ADCmm55h4EaSAAAAAElFTkSuQmCC);
    background-repeat: no-repeat;
    background-size: contain;
    overflow: hidden;
}
.right-swipe-btn {
    right: 0;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADQAAABkCAQAAABj/9uXAAAClUlEQVR42u3av2tTURQH8JCGbJ3Uog46qCCCgqCI4BB/9JybaB+ivqBQlJo4KBmsg20o0UehlC6dSh2CIFYK7rqXjl26dCl0Kp3aoQlpoaU/nouvYk3eu7/eFwvJ+wM+Sd659557zkn4CcyTaENtKFbITXefzl0WGX4sCvSG+nmAK5aB7Dm+x0X+QN7hxxKRSWUv0VOu/AtYhHInhUODrQkrUO5sd28UYQz1nBEFOcQAcjrFI3lEE/KS4qYoqzEakNNJL1QRDejBBX6vwyhCfFsPUYLcDnqoz0hDblr0mjCSkJvmohkjBWVS/NyUkYC8JOfNGQmI79tgIiFxxQ4TAVEXDQEgN80lW0woJNgeEwLxKfoIgLwkv7LJtIRy1+wyLaBMSryDQOK6baYp5HZQPwTKXrXPNIWoAIHuHouDaQLRHRQkHQifvm3UG7Uv37Ug6pL/jo2a7/v+/v6PnzrQDXloo+7//szOKEPimTz0eXpvN6Dm54QK5CVJKaeenNrZDqjFBWdYGuo5rhpLo9WtzYBaXsqPSEJ0UT1syxONg3e1utI3JgWJWzorpDS+vhZQ62ulcZlfpJld942trgRUo16eiIZe6q77/MjyUkBtbY5Wo6DX+luMM7y4EFA725NfQyF+a7KbCW9+LqD2dqvTYdCA6dY5O3PwrmphUOVIQKC/7lAwTMUUDKDwBi1Y0BYE2lRBxwTo4IMd5bDkBJZuGSWQ2RPxJMRGKfFRSfJh1xaTFOV/vVrCLsuw6z+woAEr0QCLTrAyGrAwCCx1woq3wHI0sMAObBnAmiDAtg6wUQVsvQGbidD2KLDhC2xhA5vyf8YMqACBYIMT0FEQ6HDLX3vi+ZjHdZoPINETLsYygNQeEovl+QV6MOTDwW13kwAAAABJRU5ErkJggg==);
    background-repeat: no-repeat;
    background-size: contain;
    overflow: hidden
}


.wea-aqi-1 {
    padding: 0 6px;
    height: 16px;
    color: #19b863;
    background-color: rgba(10, 193, 96, .05);
    border-radius: 3px;
    border: 1px solid rgba(10, 193, 96, .2)
}

.wea-aqi-2 {
    padding: 0 6px;
    height: 16px;
    color: #f7b307;
    background-color: rgba(241, 172, 0, .05);
    border-radius: 3px;
    border: solid 1px rgba(241, 172, 0, .2)
}

.wea-aqi-3 {
    padding: 0 6px;
    height: 16px;
    color: #ff8a1b;
    background-color: rgba(233, 118, 0, .05);
    border-radius: 3px;
    border: solid 1px rgba(233, 118, 0, .2)
}

.wea-aqi-4 {
    padding: 0 6px;
    height: 16px;
    color: #f85c58;
    background-color: rgba(255, 100, 91, .05);
    border-radius: 3px;
    border: solid 1px rgba(255, 100, 91, .2)
}

.wea-aqi-5 {
    padding: 0 6px;
    height: 16px;
    color: #d62670;
    background-color: rgba(217, 51, 120, .05);
    border-radius: 3px;
    border: solid 1px rgba(217, 51, 120, .2)
}

.wea-aqi-6 {
    padding: 0 6px;
    height: 16px;
    color: #a70069;
    background-color: rgba(157, 16, 104, .05);
    border-radius: 3px;
    border: solid 1px rgba(157, 16, 104, .2)
}