.edit-avatar {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
}
.edit-avatar .edit-avatar-content{
    background: #000;
    display: flex;
    /* align-items: center; */
    justify-content: center;
    flex-direction: column;
    /* padding: 0; */
    /* margin-left: -3px; */
    /* display: none; */
}
.edit-avatar .edit-avatar-content .crop-avatar{
    flex: 1;
    display: flex;
    align-items: center;
}
.edit-avatar .edit-avatar-content .crop-avatar canvas{
    width: 100% !important;
    height: auto !important;
}

.controls-sider {
    max-width: 300px;
    margin: auto;
    width: 100%;
    max-height: 50px;
}


.controls-sider .MuiSlider-root{
    color: rgb(254, 44, 85);
    height: 8px;
}
.controls-sider .MuiSlider-root .MuiSlider-rail{
    color: #fff;
}
.controls-sider .MuiSlider-root .MuiSlider-track{}
.controls-sider .MuiSlider-root .MuiSlider-thumb{
    width: 20px;
    height: 20px;
}