﻿body {
    background: #f9f7f6;
    font-family: "Microsoft YaHei", "微软雅黑", STXihei, "华文细黑", serif;
    margin: 0;
    padding: 0;
}

#mainbody {
    width: 1200px;
    margin: 0 auto;
}

.rooms {
    width: 100%;
}

.blueprint {
    position: relative;
    width: 968px;
    height: 698px;
    border: 1px solid #000000;
    float: left;
    background-color: #ffffff;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 800px;
}

#floor1 {
    background-image: url('../images/rooms/1-1.png');
}

#floor3 {
    background-image: url('../images/rooms/1-3.png');
}

#floor7 {
    background-image: url('../images/rooms/t-7.png');
}

#floor8 {
    background-image: url('../images/rooms/t-8.png');
}

.roominfo {
    position: relative;
    width: 210px;
    height: 698px;
    float: right;
}

#r159 {
    width: 125px;
    height: 79px;
    top: 178px;
    left: 85px;
}

#r124 {
    width: 114px;
    height: 68px;
    top: 486px;
    left: 290px;
}

#r120 {
    width: 79px;
    height: 68px;
    top: 486px;
    left: 405px;
}

#r116 {
    width: 79px;
    height: 68px;
    top: 486px;
    left: 485px;
}

#r117 {
    width: 79px;
    height: 57px;
    top: 589px;
    left: 485px;
}

#r121 {
    width: 79px;
    height: 57px;
    top: 589px;
    left: 404px;
}

#r125 {
    width: 79px;
    height: 57px;
    top: 589px;
    left: 325px;
}

#r129 {
    width: 79px;
    height: 57px;
    top: 589px;
    left: 245px;
}

#r133 {
    width: 79px;
    height: 57px;
    top: 589px;
    left: 165px;
}

#r137 {
    width: 79px;
    height: 79px;
    top: 589px;
    left: 85px;
}

.blueprint div {
    position: absolute;
    cursor: pointer;
    background-color: #ffff001a;
    text-align: center;
}

.roomid {
    color: #1818b1;
    font-weight: bold;
    margin: 5px 0;
}

.plenty {
    color: #1a832f;
    margin: 5px 0;
}

.crowd {
    color: #d12d2d;
    margin: 5px 0;
}

.roominfo p span {
    margin: 0 10px;
    display: inline-block;
}

select {
    font-size: 16px;
}

#btnUpload {
    margin: 10px 0;
    font-size: 16px;
    width: 100%;
}

#fileUpload {
    font-size: 14px;
}

#lblMessage {
    font-size: 12px;
}

.uploaded {
    color: #1a832f;
}

.reloaded {
    color: #ff0000;
}

#showRoom {
    display: none;
}

.rd {
    display: none;
}

#r356 {
    width: 78px;
    height: 112px;
    top: 32px;
    left: 350px;
}

#r350 {
    width: 56px;
    height: 112px;
    top: 32px;
    left: 429px;
}

#r346 {
    width: 79px;
    height: 112px;
    top: 32px;
    left: 486px;
}

#r342 {
    width: 79px;
    height: 112px;
    top: 32px;
    left: 566px;
}

#r340 {
    width: 125px;
    height: 112px;
    top: 66px;
    left: 758px;
}

#rB722 {
    width: 46px;
    height: 98px;
    top: 72px;
    left: 203px;
}

#rB721 {
    width: 46px;
    height: 103px;
    top: 65px;
    left: 249px;
}

#rB720 {
    width: 46px;
    height: 109px;
    top: 61px;
    left: 297px;
}

#rB719 {
    width: 46px;
    height: 112px;
    top: 60px;
    left: 346px;
}

#rB718 {
    width: 44px;
    height: 114px;
    top: 63px;
    left: 394px;
}

#rB717 {
    width: 53px;
    height: 112px;
    top: 69px;
    left: 439px;
}

#rB716 {
    width: 43px;
    height: 111px;
    top: 79px;
    left: 491px;
}

#rB705 {
    width: 103px;
    height: 42px;
    top: 466px;
    left: 701px;
    transform: rotate(25deg);
}

    #rB705 p {
        margin: 0;
    }

#rB704 {
    width: 96px;
    height: 42px;
    top: 506px;
    left: 680px;
    transform: rotate(33deg);
}

    #rB704 p {
        margin: 0;
    }

#rB703 {
    width: 96px;
    height: 42px;
    top: 537px;
    left: 647px;
    transform: rotate(40deg);
}

    #rB703 p {
        margin: 0;
    }

.extended {
    color: #FF0000;
}

#rB822 {
    width: 46px;
    height: 106px;
    top: 52px;
    left: 210px;
}

#rB821 {
    width: 50px;
    height: 108px;
    top: 48px;
    left: 257px;
}

#rB820 {
    width: 54px;
    height: 114px;
    top: 44px;
    left: 307px;
}

#rB819 {
    width: 51px;
    height: 119px;
    top: 41px;
    left: 362px;
}

#rB818 {
    width: 51px;
    height: 123px;
    top: 43px;
    left: 412px;
    transform: rotate(5deg);
}

#rB817 {
    width: 47px;
    height: 121px;
    top: 50px;
    left: 463px;
    transform: rotate(7deg);
}

#rB816 {
    width: 47px;
    height: 120px;
    top: 59px;
    left: 510px;
    transform: rotate(9deg);
}

#rB815 {
    width: 47px;
    height: 114px;
    top: 74px;
    left: 557px;
    transform: rotate(9deg);
}