.modal-container {
    /*max-width: 600px !important;*/
    margin: 0 !important;
}

.img-container {
    width: 100%;
    border: 5px solid rgba(164, 164, 164, 0.35);
    border-radius: 5px;
}

    .img-container img {
        width: 100%;
    }

.cropper-canvas {
    height: 300px !important;
}

.avatar-wrapper {
    height: 300px;
    width: 100%;
    margin-top: 15px;
    box-shadow: inset 0 0 5px rgba(0,0,0,.25);
    background-color: #fcfcfc;
    overflow: hidden;
}
    .avatar-wrapper img {
        display: block;
        height: auto;
        max-width: 100%;
    }
.avatar-preview {
    border: 2px solid rgba(164, 164, 164, 0.35);
    border-radius: 5px;
    overflow: hidden;
    width: 160px;
    height: 160px;
}
.preview-md {
    margin-top:5px;
    width: 160px;
    height: 160px;
    border-radius: 100px !important;
}