.user-info__content, .line-item { display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

.line-item__field { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; overflow: hidden; }

.user-info__avatar { background-repeat: no-repeat; background-size: 100%; }

img { max-width: 100%; height: auto; }

body { background: #f5f5f5; max-width: 750px; margin: 0 auto; }

.user-info { position: relative; }
.user-info__content { position: absolute; top: -40px; left: 0; right: 0; bottom: 0; text-align: center; }
.user-info__avatar { width: 80px; height: 80px; border-radius: 50%; opacity: hidden; box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.5); }
.user-info__txt { margin: 15px 0 0; font-size: 16px; color: #fff; }

.content { position: relative; z-index: 1; margin: -60px 15px 0; background: #fff; border-radius: 10px; overflow: hidden; box-shadow: 0 8px 10px rgba(0, 0, 0, 0.06); }

.line-item { position: relative; height: 55px; padding: 0 20px; font-size: 16px; color: #333; }
.line-item + .line-item:before { position: absolute; top: 0; left: 20px; right: 0; height: 1px; background: #e5e5e5; content: ""; }
.line-item:active { background: #f5f5f5; }
.line-item__icon { width: 40px; }
.line-item__icon .custom-icon { font-size: 24px; }

.actions { position: relative; z-index: 1; margin: 15px; border-radius: 5px; overflow: hidden; }

.weui-form-preview__label, .weui-form-preview__value { font-size: 14px; }