﻿.flow-sign-popup-box .content .item-content {
    width: 100%;
}

.flow-sign-popup-box .content .alert {
    letter-spacing: 2px;
    line-height: 24px;
}

.flow-sign-popup-box .stage {
    height: 20px;
    border-radius: 8px;
    font-size: 12px !important;
    line-height: 12px;
    background-color: #21BAD8;
    color: #fff;
    padding: 4px;
    margin: 10px 12px 0 12px;
}

.flow-sign-popup-box .stage1 {
    float: left;
}

.flow-sign-popup-box .stage2, .flow-sign-popup-box .stage3 {
    float: right;
}

.flow-sign-popup-box .title .tool-button {
    float: right;
    width: 40px;
    height: 40px;
    cursor: pointer;
    margin-right: 12px;
    background-color: #B3B3B3;
    border-radius: 100%;
}

.flow-sign-popup-box .title .tool-button img {
    height: 26px;
    width: 26px;
    margin: 7px;
}

.flow-sign-popup-box .title .tool-button:hover {
    box-shadow: 0px 0px 15px rgba(0, 0, 255, 1);
    background-color: #919191;
}

.flow-sign-popup-box .title .title-tool {
    width: calc(100% - 15px);
    height: 40px;
    margin-left: 15px;
    border-bottom: 1px solid #E3E2E2;
}

.flow-sign-popup-box .title .title-tool .checkbox-tool-content {
    float: left;
    font-size: 14px;
    height: 37px;
    line-height: 37px;
}

.flow-sign-popup-box .content .item-content .item {
    width: 100%;
    background-color: #F0EDED;
    padding: 5px;
    margin: 5px;
}

.flow-sign-popup-box .content .item-content .item:hover {
    background-color: #DFDCDC;
}

.flow-sign-popup-box .content .item-content .item[done="Y"] {
    background-color: #B7B4B4;
}

.flow-sign-popup-box .content .item-content .item .draggable-buttom {
    float: right;
    margin: 5px;
}

.flow-sign-popup-box .content .item-content .item .draggable-buttom label {
    margin-top: 3px;
}

.flow-sign-popup-box .content .item-content .item .draggable-buttom label, .flow-sign-popup-box .content .item-content .item .draggable-buttom img {
    float: right;
    color: #747373;
    border-radius: 100%;
    margin-bottom: 0px!important;
}

.flow-sign-popup-box .content .item-content .item .draggable-buttom label:hover, .flow-sign-popup-box .content .item-content .item .draggable-buttom img:hover {
    color: #356AFC;
    box-shadow: 0px 0px 15px rgba(0, 0, 255, 1);
}

.flow-sign-popup-box .content .item-content .item .draggable-buttom .delete {
    position: relative;
    right: 0px;
    color: #FC3538;
}

.flow-sign-popup-box .content .item-content .item .draggable-buttom img {
    height: 20px;
    width: 20px;
}

.flow-sign-popup-box .content .item-content [draggable="true"] {
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

.flow-sign-popup-box .content .item-content .dragging {
    opacity: .25;
}

.flow-sign-popup-box .content .item-content .ghost-element {
    border: 2px dotted #444 !important;
}

.flow-sign-popup-box .content .item-content .done-container {
    display: none;
    position: absolute;
    right: 0px;

}

.flow-sign-popup-box .content .item-content .done-container .done {
    font-size: 22px;
    color: #00FF00;
    text-shadow:
       1px 1px 0 #00A516,
     -1px -1px 0 #00A516,
      1px -1px 0 #00A516,
      -1px 1px 0 #00A516,
       1px 1px 0 #00A516;
}

.flow-sign-popup-box .content .item-content .serial-number-container .flow-icon-owner {
    float: none !important;
}
