.simpleNav {
display: flex;
justify-content: left;
font-size: 18px;
letter-spacing: 2px;
background: #FFF;
}

.simpleNav a {
padding: 7px 30px 2px 30px;
margin: 0 5px 0 0;
border-radius: 5px 5px 0 0 ;
border: 1px solid transparent;

}

.Header a:hover {
}

.simpleNav a.selected {
border: 0px solid #c771ff;
background: #ebd0ff;
color: #000;
}



nav .Header Ul {
list-style-type: none;
margin: 0;
padding: 0;
width: 100%;
background-color: #CCC;
}



nav.Header Ul li {
padding: 0 10px;
display: flow;
}


nav.Header Ul li a {
display: block;
color: #00F;
padding: 5px 25px;
border: 0px dotted #CCC;
/* border:1px  dashed #2282e3;  */
}

nav.Header Ul li a:hover {
background: #2727fb;
background: linear-gradient(160deg, #2727fb, #1c71e8);
color: #FFF;
}

nav.Header Ul li ul {
list-style-type: none;
margin: 0;
padding: 0;
display: none;
position: absolute;
width: max-content;
border: 1px solid #00F;
background-color: #FFF;
background: linear-gradient(135deg, #eadfff, #e6fffd);
}

nav.Header Ul li ul li {
clear: both;
width: 100%;
padding: 0;
margin: 0;
}

nav.Header Ul li ul a {
width: 98px;
}


nav.Header Ul li:hover > ul {
display: block;
}

nav.Header Ul li ul li:hover > ul {
display: block;
left: 100%;
top: 0;
}

/* 导航菜单结束 */

/*   容器2    simple */
.simpleContainer {
display: grid;
min-width: 950px;
grid-template-columns: auto 300px;
gap: 30px;
}

.simpleContainer > .left, .simpleContainer > .right {
background: #FFF;
box-shadow: 0px 0px 15px 0px #d3c9f7;
border-radius: 0;
}

.simpleContainer > .left {
padding: 30px;
}

.simpleContainer > .right {
padding: 30px 15px;
}

#dropzone {
border: 2px solid #ebd0ff;
border-radius:0 0 10px 10px;
text-align: center;
padding: 60px 0;
}

#simple_center_icon img{
width:85px;
height:75px;
}





/*******************************************/
/* 定义upload_container容器的样式 */
#itemCollection {
    padding: 3%;
}

/* 定义每个文件对应的小图和进度条的容器样式 */
#itemCollection .item {
display: grid;
grid-template-columns: 180px auto 80px;
border: 1px solid #EEE;
padding: 15px 20px;
margin: 0 0 10px 0;
border-radius: 5px;
}

#itemCollection .item:hover {
background: #f5f5f5;
}
/* 定义图片样式 */
#itemCollection .item .left {
  width:170px;
}


/*  音视频 */
#itemCollection .item .left img{
max-width: 150px;
max-height: 120px;
min-width: 100px;
min-height:80px;
}
#itemCollection .item .left img.docIcon{
width:100px;
height:100px;
}
#itemCollection .item .left video {
max-width: 200px;
max-height: 120px;
min-width: 150px;
min-height: 100px;
}

#itemCollection .item .middle {
text-align: left;
}
/* 定义进度条样式 */
#itemCollection .item .middle progress {
width: 100%;
opacity:0;
}


#itemCollection .item .middle .title {
font-size: 15px;
min-width: 50px;
border: 1px solid transparent;
padding-right: 35px;
background: URL('/img/editor_button.png') no-repeat right 50%;
display:inline;
overflow: hidden;
text-overflow: ellipsis;
}

#itemCollection .item .middle .title:hover {
border-color: #AAA;
}

#itemCollection .item .middle .Editing {
background: #fff;
overflow: visible;
text-Overflow: clip;
z-index: 1000;
}



#itemCollection .item .middle .size {
padding:10px 0;
color: #888;
}

/* 定义删除按钮样式 */
#itemCollection .item .operate {
display: flex;
justify-content: space-between;
align-items: center; 

}

#itemCollection .item .operate .delete-button {
background-color: #ff6699;
color: white;
border: none;
border-radius: 5px;
padding: 2px 10px;
cursor: pointer;
text-align: center;
}

#itemCollection .item .operate .sort_area {
display: flex;
flex-direction: column;
gap: 30px 0; 
}

#itemCollection .item .operate .sort_area .sort-button {
color: #888;
text-align: center;
line-height: 20px;
cursor: pointer;
border-radius: 100%;
padding: 0;
width: 25px;
height: 25px;
font-size: 12px;
border: 1px solid #EEE;
background-color: #F5F5F5;
}



#itemCollection .item .operate .sort_area .sort-button:hover {
border-color: #F88;
background-color: #Fdd;
color: #F00;
}