profile-boot-duration = 2s

.profile
	horizontal

	position relative
	left calc(content-padding * -1)
	top calc(content-padding-top * -1)
	min-width calc(100% + content-padding * 2)
	padding calc(content-padding * 2)

	color white
	text-shadow 0px 0px 2px rgb(0, 0, 0, 0.5)

	// default-transition
	// animation appear transition-speed

	overflow hidden

.profile-field
	text-align center

	a
		color white

< 600px
	.profile
		vertical
		align-items center

	.intro-container
		align-items center
		margin-top calc(content-padding * 1.5)
		padding-left content-padding

// animation appear
// 	0%
// 		transform rotateX(90deg)
// 		filter opacity(0) saturate(0) blur(10px)
// 	100%
// 		transform rotateX(0)
// 		filter opacity(1) saturate(1) blur(0)

.profile-cover
	position absolute
	left 0
	top 0
	width 100%
	height 100%
	z-index -1
	object-fit cover
	// background-size cover
	overflow hidden
	
	// default-transition
	// animation cover-animation profile-boot-duration
	// animation-fill-mode forwards
	filter brightness(30%) blur(0)

// animation cover-animation
// 	0%
// 		filter brightness(500%) blur(5px)
// 	100%
// 		filter brightness(35%) blur(0)

.profile-image
	object-fit cover
	width 100%
	height auto

.image-container
	flex 1
	max-width 280px
	max-height 280px
	border-radius 3px
	overflow hidden

.intro-container
	vertical
	align-items flex-start
	padding content-padding
	padding-top 0
	padding-left calc(content-padding * 2)
	max-width 900px

#nick
	margin-bottom 1rem

.no-data
	width 100%
	text-align left

// Categories

// .profile-category
// 	margin-bottom content-padding