.profile { display: flex; flex-direction: column; flex-wrap: wrap; font-family: 'Open Sans',sans-serif; margin-bottom: .6rem; border-radius: .6rem; padding: .6rem; background: var(--gradient) !important; -webkit-box-shadow: var(--shadow); -moz-box-shadow: var(--shadow); box-shadow: var(--shadow); } .profile *[class*="profile-info-"] { flex: 1; } .profile-info { display: flex; flex-wrap: wrap; flex-direction: column; } .profile-info-nickname { font-size: 1.3rem; } .profile-info-tags { margin: unset; } .profile-info-stats strong { margin-right: 5px; } .profile-info-stats { margin-top: .6rem; } .profile-avatar { max-width: 4rem; min-width: 3rem; width: 100%; height: auto; margin-right: 5px; border-radius: 2px; } .section-widget { display: flex; flex-direction: column; border-radius: .6rem; margin-bottom: 1.3rem; background-color: var(--background-card) !important; box-shadow: var(--shadow); border: 2px solid var(--border) !important; } .section-widget hr { margin-bottom: .6rem; } .section-widget-padded { padding: .6rem; } .section-title { font-size: 1.3rem; font-weight: 700; margin: 0; } .section-widget-button-like { border-radius: .6rem; padding: 6px 10px; margin-top: 6px; cursor: pointer; float: right; align-self: end; font-family: 'Open Sans',sans-serif; font-weight: 700; } .section-title-details { font-size: 1.3rem; font-weight: 700; border-radius: .6rem; padding: 6px 10px 6px 10px; background: var(--gradient) !important; } .section-title-details[open] svg { transform: rotate(180deg); animation: fadeOut 200ms cubic-bezier(0,0.55,0.45,1); } .section-title-details:not([open]) svg { transform: initial; animation: fadeIn 200ms cubic-bezier(0,0.55,0.45,1); } .section-title-summary { display: flex; justify-content: space-between; } .section-form { display: flex; flex-direction: column; max-width: 100%; width: 100%; padding: .6rem; } .section-form-legend { margin-top: unset; margin-bottom: 10px; font-weight: bold; font-size: 1.62rem; } div[class^="mb-"] { display: flex; flex-direction: column; flex-basis: border-box; margin-bottom: var(--smaller); } div[class^="mb-"]:last-of-type { margin-bottom: unset; } div[class^="mb-"] textarea { height: 7rem; max-height: 100%; } .alert,.alert-danger { display: inline-block; font-style: italic; font-size: 1rem; border: solid 2px #ff6347; background-color: #FF634733; border-radius: .6rem; padding: 2px 6px; margin-top: 6px; margin-bottom: 6px; }