@import "~@less/variables.less";

.newFolderWrap {
    .folderModal {
        z-index: 120;
        position: fixed;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background: #000;
        opacity: .3;
        filter: alpha(opacity=60);
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=60);";
    }
    .nameWrap{
        z-index: 130;
        position: fixed;
        top: 10%;
        left: 50%;
        margin: auto;
        border-radius: 5px;
        background: #fff;
        width: 500px;
        height: 80%;
        margin-left: -250px;
        padding: 40px 0 65px 0;
        // margin-top: -115px;
        .mainWrap {
            padding: 50px 10px;
        }
        .title {
            position: absolute;
            width: 100%;
            top: 0;
            height: 40px;
            line-height: 40px;
            border-bottom: 1px solid #ccc;
            img{
                float: right;
            }
        }
        .leftName {
            width: 135px;
            text-align: right;
            padding-right: 16px;
            display: inline-block;
        }
        .titleCon {
            float: left;
            height: 40px;
            line-height: 40px;
            margin-left: 10px;
        }
        input {
            border: 1px solid #CCCCCC;
            padding: 5px 10px;
            width: 240px;
        }
    }
    .delFoot{
        position: absolute;
        width: 100%;
        bottom: 0;
        .halfBtn {
            width: 50%;
            display: inline-block;
            text-align: center;
            height: 65px;
        }
        .delBtn{
          display: inline-block;
          width: 100px; 
          height: 34px;
          line-height: 32px;
          border-radius: 5px;
          margin: 0 auto;
          cursor: pointer;
        }
        .delDel{
          color: #fff;
          background: #3B9ED0;
        }
        .delCancel{
          color:#000;
          background: #fff;
          border: 1px solid #1E1E1E;
          color: #1E1E1E;
        }
    }
    .delContent{
        height: 100%;
        overflow-y: auto;
    }
    .floderBox{
        line-height: 45px;
    }
    .floderItem{
        border-bottom: 1px solid #EAEDF1;
        padding: 0 40px 0 10px;
        position: relative;
        cursor: pointer;
        line-height: 45px;
    }
    .floderRD{
        width: 20px;
        height: 20px;
        position: relative;
        top: 5px;
        right: 4px;
        pointer-events: none;
    }
    .orderIcon{
        // width: 20px;
        position: absolute;
        top: 11px;
        right: 25px;
    }
    
    .templateItem{
        position: relative;
        line-height: 45px;
        padding: 0 40px 0 10px;;
    }
    .arrowDown{
        position: absolute;
        top: 13px;
        right: 25px;
        display: inline-block;
        width: 12px;
        height: 17px;
        background: url("../../common/images/folderDown.png") no-repeat center ;
        background-size: 12px 17px;
    }
    .arrowUp{
        position: absolute;
        top: 13px;
        right: 25px;
        display: inline-block;
        width: 12px;
        height: 17px;
        background: url("../../common/images/folderUp.png") no-repeat center ;
        background-size: 12px 17px;
    }
    .floderItem:hover,.templateItem:hover {
        border: 1px solid #3B9ED0;
        .arrowDown{
            position: absolute;
            top: 13px;
            right: 25px;
            display: inline-block;
            width: 12px;
            height: 17px;
            background: url("../../common/images/folderDownSelect.png") no-repeat center ;
            background-size: 12px 17px;
        }
        .arrowUp{
            position: absolute;
            top: 13px;
            right: 25px;
            display: inline-block;
            width: 12px;
            height: 17px;
            background: url("../../common/images/folderUpSelect.png") no-repeat center ;
            background-size: 12px 17px;
        }
    }
    // .floderItem:hover{
    //     border: 1px solid #3B9ED0;
    // }
    
}