ui/homescreen.razor.scss
HomeScreen
{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	pointer-events: none;
	font-family: Poppins;
	z-index: 3;
	background-color: #07080a;

	&.visible
	{
		opacity: 1;
		pointer-events: all;
	}

	.home-screen
	{
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		overflow: visible;
	}

	.profile-avatar
	{
		position: absolute;
		left: 53px;
		top: 35px;
		width: 72px;
		height: 72px;
		border-radius: 100%;
		outline: 5px solid rgba( 255, 255, 255, 1 );
		background-size: contain;
		background-position: center;
		background-repeat: no-repeat;
		background-color: rgba( 255, 255, 255, 0.94 );
		z-index: 6;
	}

	&.suppress-home-carousel-transitions
	{
		.carousel-item,
		.carousel-card-face,
		.view-more-card,
		.carousel-selection-ring,
		.missing-icon-disc,
		.missing-icon
		{
			transition: none;
		}
	}

	.all-software-screen
	{
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		z-index: 8;
		background-color: #f2f4f7;
	}

	.all-software-rule
	{
		position: absolute;
		left: 54px;
		right: 54px;
		height: 1px;
		background-color: rgba( 35, 39, 46, 0.22 );
		z-index: 3;
	}

	.all-software-rule.top
	{
		top: 78px;
	}

	.all-software-rule.bottom
	{
		bottom: 96px;
	}

	.all-software-scroll
	{
		position: absolute;
		left: 0;
		top: 78px;
		width: 100%;
		bottom: 96px;
		z-index: 2;
		flex-direction: column;
		align-items: center;
		overflow-y: scroll;
		overflow-x: hidden;
	}

	.all-software-grid
	{
		position: relative;
		width: 1660px;
		z-index: 2;
		padding: 0;
		overflow: visible;
		flex-shrink: 0;
	}

	.all-add-row
	{
		position: absolute;
		width: 1660px;
		height: 86px;
		flex-shrink: 0;
		flex-grow: 0;
		align-items: center;
		justify-content: center;
	}

	.all-add-button
	{
		position: relative;
		width: 640px;
		height: 86px;
		border-radius: 8px;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		z-index: 3;
		overflow: visible;
	}

	.all-add-button-ring
	{
		position: absolute;
		left: -2px;
		top: -2px;
		width: 644px;
		height: 90px;
		border-radius: 12px;
		overflow: visible;
		z-index: 2;
		pointer-events: none;
	}

	.all-add-button-fill
	{
		position: absolute;
		left: 0;
		top: 0;
		width: 640px;
		height: 86px;
		border-radius: 8px;
		border: 1px solid #000000;
		background-color: #f2f4f7;
		z-index: 1;
	}

	.all-add-button.selected .all-add-button-fill
	{
		left: 2px;
		top: 2px;
		width: 636px;
		height: 82px;
		border-radius: 8px;
		border: 0;
		background-color: #ffffff;
	}

	.all-add-button-label
	{
		position: relative;
		width: 640px;
		height: 86px;
		align-items: center;
		justify-content: center;
		font-size: 30px;
		font-weight: 400;
		line-height: 38px;
		color: #39404b;
		text-align: center;
		z-index: 3;
	}

	.all-scrollbar
	{
		position: absolute;
		right: 12px;
		top: 78px;
		width: 20px;
		height: 906px;
		border-radius: 3px;
		z-index: 2;
		cursor: pointer;
	}

	.all-scrollbar-thumb
	{
		position: absolute;
		left: 7px;
		width: 6px;
		border-radius: 3px;
		background-color: rgba( 135, 141, 150, 0.92 );
		pointer-events: none;
	}

}