Improved styles

pages/anime/anime.pixy

@@ -4,6 +4,8 @@ component Anime(anime *arn.Anime)
 			.anime-image-container
 				img.anime-cover-image(src=anime.Image, alt=anime.Title.Romaji)
 		
+		.space
+
 		.anime-info
 			h2.anime-title(title=anime.Type)= anime.Title.Romaji
 
@@ -55,7 +57,7 @@ component Anime(anime *arn.Anime)
 		.light-button-group
 			each studio in anime.Studios
 				a.light-button(href="https://anilist.co/studio/" + toString(studio.ID), target="_blank")
-					i.fa.fa-building.fa-fw
+					Icon("building")
 					span= studio.Name
 
 	//- //-if crunchy

pages/anime/anime.scarlet

@@ -1,3 +1,6 @@
+.anime-section-name
+	font-weight bold
+
 .anime-header
 	horizontal
 
@@ -11,7 +14,7 @@
 	height auto
 	border-radius 3px
 	
-	transition all transition-speed ease
+	default-transition
 	object-fit cover
 
 	saturate-up
@@ -20,7 +23,10 @@
 .anime-info
 	vertical
 	flex 1
-	margin-left content-padding
+
+.space
+	width content-padding
+	height content-padding
 
 .anime-title
 	text-align left
@@ -47,4 +53,13 @@
 
 .relation-image
 	width 100px
-	height 141px
+	height 141px
+	border-radius 3px
+	object-fit cover
+	default-transition
+	scale-up
+	shadow-up
+
+< 800px
+	.anime-header
+		vertical

pages/anime/anime.styl

@@ -60,7 +60,7 @@
 	border-radius 3px
 	box-shadow 4px 4px 8px rgba(0, 0, 0, 0.12)
 	filter saturate(100%)
-	transition all transition-speed ease
+	default-transition
 	object-fit cover
 	:hover
 		filter saturate(130%)