.avatarImage {
position: relative;
width: 118px;
height: 118px;
overflow: hidden;
cursor: pointer;
border: 3px solid #fff;
margin:-6.3rem auto .5rem auto;
}

.avatarImage .item,
.avatarImage .item img,
.avatarImage .item .mask {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
font-size: 18px;
line-height:22px;
}

.avatarImage .item img {
height: auto;
}

.avatarImage .item .mask {
background-color: rgba(0, 0, 0, 0.6);
color: #fff;
opacity: 0;
visibility: hidden;
transition: all .5s ease-out;
}

.avatarImage .item:hover .mask {
opacity: 1;
visibility: visible;
}

/*侧边栏*/
.nav-pills .nav-link{
padding: 0.5rem 0.75rem;
font-weight: 500;
color: #333;
}

#home-member .nav-item{
    width:calc(100%);
}
#home-member .nav-link.active  {
background-color: var(--main-theme-color);
color: #fff;
}
.nav-pills-dark hr{
margin: 1rem 0;
}


.sider-nav-bg{
    background-color:#f4f7fa;
    width:300px;
}

.tab-section{
    width:calc(100% - 300px);
}


@media (max-width:1199.98px){
    .sider-nav-bg{
    width:250px!important;
}
.tab-section{
    width:calc(100% - 250px);
}
}


@media (max-width:991.98px){
    .sider-nav-bg{
    width:100%!important;
}
}







[dir='rtl'] .border-end-rtl{
border-left: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important;
border-right:none !important
}






/****    edit-css    *****/
.overlay-content{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.6);
    z-index: 99;
}

.overlay-content .edit-content{
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    width: 80%;
    height: 80%;
    overflow-y: scroll;
}