.profile { display: flex; align-items: center; width: 265px; } .profile.minimal { width: 176px; } .profile.minimal .profile-avatar { width: 64px; height: 64px; } .profile-avatar { width: 128px; height: 128px; margin-right: 16px; } .profile-name { font-weight: bold; } .profile-title { margin-bottom: 8px; } .profile-points { font-size: 11px; } .profile-points span { color: gray; } .profile-points-small { display: none; } .profile-xp { height: 10px; min-width: 96px; max-width: 96px; background: var(--background); border: var(--border); } .profile-xp-100 { background: var(--background-xp); border: var(--border-xp); } .profile-xp div { height: 10px; background: var(--background-xp); border: var(--border-xp); margin: -1px; } .profile-xp-100 div { background: var(--background-xp-100); } .profile.guest { flex-direction: column; width: 100%; padding-top: 12px; text-align: center; } .profile.guest em { display: block; font-weight: bold; font-style: normal; margin-bottom: 8px; } @media (max-width:1199px) { table.thread .profile { flex-direction: column; width: 96px; text-align: center; } table.thread .profile-avatar { order: 1; margin-right: 0; margin-top: 4px; width: 96px; height: 96px; } table.thread .profile-title, table.thread .profile-points, table.thread .profile-xp { display: none; } table.thread .profile-points-small { display: inline; } } @media (max-width:849px) { table.thread .profile { width: 96px; } table.thread .profile-avatar { width: 64px; height: 64px; } } hr.signature { opacity: 0.2; } .trophies { display: flex; flex-wrap: wrap; justify-content: space-between; } .trophy { display: flex; align-items: center; width: 260px; margin: 5px; padding: 5px; border: 1px solid #c5c5c5; border-left: 5px solid var(--links); border-radius: 2px; } .trophy.disabled { filter: grayscale(100%); opacity: .5; border-left: 1px solid #c5c5c5; } .trophy.form-disabled { border-left: 1px solid #c5c5c5; flex-grow: 1; } .trophy img { height: 48px; margin-right: 8px; } .trophy div > * { display: block; } .trophy em { font-style: normal; font-weight: bold; margin-bottom: 3px; } .trophy span { font-size: 80%; } .dl-button { display: inline-flex; flex-direction: row; align-items: stretch; border-radius: 5px; overflow: hidden; margin: 3px 5px; vertical-align: middle; } .dl-button a { display: flex; align-items: center; padding: 5px 15px; font-size: 110%; background: var(--link); color: var(--link-text); } .dl-button a:hover, .dl-button a:focus, .dl-button a:active { background: var(--link-active); text-decoration: none; } .dl-button span { display: flex; align-items: center; padding: 5px 8px; background: var(--meta); color: var(--meta-text); font-size: 90%; } .gallery { display: flex; flex-wrap: wrap; justify-content: center; margin: auto; } .gallery * { margin: 3px; border: 1px solid var(--border); } .gallery-js { display: flex; overflow-x: auto; overflow-y: hidden; margin: auto; padding: 15px; height: 180px; } .gallery-js img, .gallery-js video { height: 100%; border: 1px solid var(--border); cursor: pointer; } .gallery-js img:not(:first-child), .gallery-js video:not(:first-child) { margin-left: 15px; } .gallery-js img.selected, .gallery-js video.selected { box-shadow: 0 0 7.5px var(--selected); } @media screen and (max-width:1199px) { .gallery-js { height: 150px; } } @media screen and (max-width:499px) { .gallery-js { height: 130px; } } .gallery-spot { justify-content: center; margin: 10px auto; } .gallery-spot * { cursor: pointer; } .tag { display: inline-block; background: var(--background); color: var(--color); padding: 4px 12px; margin: 4px 0; border-radius: 8px; border-radius: calc(4.5em); user-select: none; cursor: default; } .locked { text-align: center; font-style: italic; }