zhujian_OA/deskunit/css/ywbl.css

.Item{
    float:left;
    padding:0 10px;
    position:relative;
}
.news{
    width:50px;
    height:50px;
    position:absolute;
    right:0;
    animation: news 0.5s infinite;
}
.news span{
    color:#fff;
    position:absolute;
    right:5px;
}
.ywItem{
    height:150px;
    color:rgba(0,0,0,1);
    background-size:cover;
    background-repeat:no-repeat;
    text-indent:15px;
    font-size:16px;
    cursor:pointer;
    position:relative
}
.ywItem img{
    width:30px;
    height:30px;
    position:absolute;
    z-index:99;
    left: 35px;
    top:85px;
}
.number{
    width:calc(100% - 100px);
    height:90px;
    line-height:90px;
    font-size:30px;
    float: right;
    text-align: center;
}
.circle{
    min-width:80px;
    min-height:80px;
    max-width:80px;
    max-height:80px;
    float:left;
    position:absolute;
    left:10px;
    bottom:10px;
    display:block;
    /*border-radius:40px;*/
    border-radius:15px;
    /*background-color:rgba(74,156,247,0.6);*/
    opacity:0.5;
    /*background:url('../img/icon1.png') no-repeat center center  rgba(74,156,247,0.6);*/
    background-size:80%;
}
@keyframes news {
    0% {
        opacity: 0.5;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 0.5;
    }
}
.circle-rgb{
    /*border-radius:50%;*/
    width:80px;
    height:80px;
    color:#000;
    overflow:hidden;
    position:absolute;
    left:10px;
    bottom:10px;
}

.circle-rgb .deng1{
    width:40px;
    height:40px;
    position:absolute;
    left:0;
    top:0;
    background-image:url("../img/1white.png");
    background-size:35px;
    background-position: 7px 8px;
    background-repeat:no-repeat
}
.circle-rgb .deng2{
    width:40px;
    height:40px;
    position:absolute;
    left:50%;
    top:0; 
    background-image:url("../img/1white.png");
    background-size:35px;
    background-position: 1px 8px;
    background-repeat:no-repeat
}
.circle-rgb .deng3{
    width:40px;
    height:40px;
    position:absolute;
    left:0;
    top:50%;  
    background-image:url("../img/1white.png");
    background-size:35px;
    background-position: 7px 0;
    background-repeat:no-repeat
}
.circle-rgb .deng4{
    width:40px;
    height:40px;
    position:absolute;
    left:50%;
    top:50%;
    background-image:url("../img/1white.png");
    background-size:35px;
    background-position: 1px 0;
    background-repeat:no-repeat
}
.circle-rgb .shan{    
    animation: shan 0.5s infinite;
}
.circle-rgb .purple{
    width:40px;
    height:40px;
    color:#fff;
    line-height:45px;
    text-indent:5px;
    font-size:14px;
    text-align:center;
    background-image:url("../img/1purple.png");
    background-size:23px;
    background-position: 11px 10px;
    background-repeat:no-repeat;
}
.circle-rgb .red{
    width:40px;
    height:40px;
    color:#fff;
    line-height:45px;
    text-indent:-5px;
    font-size:14px;
    text-align:center;
    background-image:url("../img/1red.png");
    background-size:23px;
    background-position: 5px 10px;
    background-repeat:no-repeat;
}
.circle-rgb .orange{
    width:40px;
    height:40px;
    color:#fff;
    line-height:30px;
    text-indent:5px;
    font-size:14px;
    text-align:center;
    background-image:url("../img/1yellow.png");
    background-size:23px;
    background-position: 11px 1px;
    background-repeat:no-repeat;
}
.circle-rgb .green{
    width:40px;
    height:40px;
    color:#fff;
    line-height:30px;
    text-indent:-5px;
    font-size:14px;
    text-align:center;
    background-image:url("../img/1green.png");
    background-size:23px;
    background-position: 5px 1px;
    background-repeat:no-repeat;
}

@keyframes shan {
    0% {
        opacity: 0.5;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0.5;
    }
}

.total {
    width: 40%;
    height: 98px;
    line-height: 90px;
    font-weight: 600;
    font-size: 22px;
    text-indent: 0;
    text-align: center;
}
.btnLR {
    width: 50px;
    height: 150px;
}
.btnLR img{
    width:30px;
    height:150px;
    cursor:pointer
}