/* Prettified by Source 2 Viewer 11.1.0.0 - https://valveresourceformat.github.io */

.CosmicHeroesHoard2025Background
{
	width: 100%;
	height: 100%;
	background-color: gradient( linear, 0% 0%, 0% 100%, from( #0e0e27 ), to( #322463 ) );
}

.BackgroundImageContainer
{
	horizontal-align: center;
	width: 100%;
	height: 100%;
	max-width: 2560px;
}

.AspectRatio21x9 .BackgroundImageContainer
{
	opacity-brush: gradient( linear, 0% 0%, 100% 0%, from( #ffffff00 ), color-stop( 0.15, white ), color-stop( 0.85, white ), to( #ffffff00 ) );
}

.BackgroundImage
{
	width: 100%;
	height: 100%;
	background-image: url("s2r://panorama/images/backgrounds/cosmic_heroes_hoard_2025_background_psd.vtex");
	background-size: cover;
	background-position: center;
	transition-property: blur, opacity, brightness, opacity-brush;
	transition-duration: 0.5s;
	opacity-brush: gradient( radial, 50% 0%, 0% 0%, 100% 100%, from( #ffffff ), to( #ffffff00 ) );
	blur: gaussian( 6px );
	brightness: 0.2;
}

.OnHomePage .BackgroundImage
{
	opacity: 0.8;
	brightness: 0.7;
	blur: gaussian( 0px );
	opacity-brush: gradient( radial, 50% 0%, 0% 0%, 100% 100%, from( #ffffff ), to( #ffffff ) );
}

.ForegroundImage
{
	width: 100%;
	height: 100%;
	background-image: url("s2r://panorama/images/backgrounds/cosmic_heroes_hoard_2025_foreground_psd.vtex");
	background-size: cover;
	background-position: center;
	transition-property: blur, opacity, brightness, opacity-brush;
	transition-duration: 0.5s;
	opacity-brush: gradient( radial, 50% 0%, 0% 0%, 100% 100%, from( #ffffff ), to( #ffffff00 ) );
	blur: gaussian( 6px );
	brightness: 0.2;
}

.OnHomePage .ForegroundImage
{
	opacity: 0.8;
	brightness: 0.7;
	blur: gaussian( 0px );
	opacity-brush: gradient( radial, 50% 0%, 0% 0%, 100% 100%, from( #ffffff ), to( #ffffff ) );
}

.BackgroundImageGlow
{
	horizontal-align: center;
	vertical-align: bottom;
	-s2-mix-blend-mode: screen;
	width: 1000px;
	hue-rotation: 20deg;
	brightness: 2;
	transition-property: opacity;
	transition-duration: 0.6s;
	transition-delay: 0.3s;
	opacity: 0;
}

.OnHomePage .BackgroundImageGlow
{
	opacity: 1;
	transition-duration: 0.2s;
	transition-delay: 0s;
}

.SmokeFX
{
	width: 80%;
	height: 100%;
	horizontal-align: center;
	vertical-align: center;
	wash-color: rgb(175, 153, 255);
	margin-top: -100px;
	-s2-mix-blend-mode: screen;
	visibility: collapse;
}

.OnHomePage .SmokeFX
{
	visibility: visible;
}

.GalaxyFX
{
	width: 100%;
	height: 100%;
	blur: gaussian(1px);
	brightness: 2;
	wash-color: rgba(123, 0, 255, 0.658);
	opacity: 0;
}

.OnHomePage .GalaxyFX
{
	opacity: 1;
	transition-timing-function: ease-in;
	transition-duration: 0.15s;
	transition-delay: 0s;
}

.HeroesSceneModels
{
	width: 100%;
	height: 100%;
	background-size: cover;
	opacity-brush: gradient( linear, 0% 0%, 0% 100%, from( #ffffff ), color-stop( 0.4, #ffffff ), color-stop( 0.7, #f4e2ff ), to( #402576 ) );
	transition-property: transform, opacity;
	transition-duration: 0.35s;
	transition-timing-function: cubic-bezier(0, 0.9, 0, 0.9);
	transition-delay: 0.2s;
	opacity: 0;
	transform: scale3d( 0.97, 0.97, 1 ) translateY( 1% );
}

.OnHomePage .HeroesSceneModels
{
	opacity: 1;
	transition-timing-function: ease-in;
	transition-duration: 0.15s;
	transition-delay: 0s;
}

.HeroesSceneModels #PremiumReward_Luna
{
	horizontal-align: center;
	vertical-align: center;
	width: 920px;
	height: 920px;
	transform: translateX( 390px ) translateY( -10px );
}

.AspectRatio21x9 .HeroesSceneModels #PremiumReward_Luna
{
	transform: translateX( 430px ) translateY( -10px );
}

.HeroesSceneModels #PremiumReward_Sven
{
	horizontal-align: center;
	vertical-align: center;
	width: 880px;
	height: 880px;
	transform: translateX( -390px ) translateY( 30px );
}

.AspectRatio21x9 .HeroesSceneModels #PremiumReward_Sven
{
	transform: translateX( -420px ) translateY( 30px );
}

.HeroesSceneModels #PremiumReward_EarthShaker
{
	horizontal-align: center;
	vertical-align: center;
	width: 1080px;
	height: 1080px;
	transform: translateX( 20px ) translateY( -20px );
}

.AspectRatio16x10 .HeroesSceneModels
{
	transform: scale3d( 0.88, 0.88, 1 ) translateY( 2% );
}

.HeroesSceneModels .HeroShadowLeft,.HeroesSceneModels .HeroShadowRight,.HeroesSceneModels .HeroShadowMiddle
{
	width: 700px;
	height: 100px;
	background-color: gradient( radial, 50% 50%, 0% 0%, 50% 50%, from( #000000 ), color-stop(0.7, #000000a0 ), to( #00000000 ) );
	blur: gaussian( 8px );
	vertical-align: bottom;
	horizontal-align: center;
	margin-bottom: 140px;
}

.HeroesSceneModels .HeroShadowLeft
{
	margin-right: 700px;
}

.HeroesSceneModels .HeroShadowRight
{
	margin-left: 700px;
}

.TreasureModel
{
	width: 640px;
	height: width-percentage(100%);
	horizontal-align: center;
	vertical-align: bottom;
	margin-left: 60px;
	margin-bottom: -20px;
	brightness: 0.5;
}

.BGVignette
{
	width: 100%;
	height: 500px;
	vertical-align: bottom;
	background-color: gradient( linear, 0% 0%, 0% 92%, from( rgba(0, 0, 0, 0) ), to( rgb(13, 13, 23) ) );
}

#FxScene
{
	horizontal-align: center;
	vertical-align: bottom;
	width: 645px;
	height: width-percentage( 80% );
	margin-bottom: -8px;
	margin-left: -8px;
	transform: translateY(24px);
	transition-property: opacity, transform;
	transition-duration: 0.5s;
	transition-delay: 0.3s;
	transition-timing-function: cubic-bezier(0, 0.9, 0, 0.9);
	opacity: 0;
}

#FxScene.LogoTrigger
{
	opacity: 0;
	transform: none;
	transition-duration: 0.2s;
	transition-delay: 0.0s;
	transition-timing-function: ease-out;
}

.OnHomePage #FxScene.LogoTrigger
{
	opacity: 1;
}

.OnHomePage #FxScene
{
	opacity: 1;
	transform: none;
	transition-duration: 0.1s;
	transition-delay: 0.0s;
	transition-timing-function: ease-out;
}

.TitleContainer
{
	horizontal-align: center;
	vertical-align: bottom;
	flow-children: down;
	padding: 60px 0px;
	margin-bottom: 72px;
	transform: translateY(24px);
	transition-property: opacity, transform;
	transition-duration: 0.5s;
	transition-delay: 0.3s;
	transition-timing-function: cubic-bezier(0, 0.9, 0, 0.9);
	opacity: 0;
}

.OnHomePage .TitleContainer
{
	opacity: 1;
	transform: none;
	transition-duration: 0.1s;
	transition-delay: 0.0s;
	transition-timing-function: ease-out;
}

.TitleContainer Label
{
	horizontal-align: center;
	text-align: center;
}

.TitleContainer .CCLabel
{
	color: gradient( linear, 0% 30%, 0% 100%, from( #fff0d8 ), to( #bf9e71 ) );
	text-shadow: 0px 2px 8px black;
}

.TitleContainer .CCTitle
{
	font-family: titleFont;
	letter-spacing: 1px;
	color: white;
	text-shadow: 0px 0px 48px rgba(209, 124, 255, 0.2);
	font-weight: normal;
	max-width: 900px;
	max-height: 75px;
	text-overflow: shrink;
}

.TitleContainer .CCAvailable
{
	font-family: titleFont;
	color: #d5d5ff;
	text-shadow: 0px 2px 12px 3.0 #000a;
	margin-top: -4px;
}

.TitleContainer .StarsFX
{
	width: 100%;
	height: 100%;
	horizontal-align: center;
	vertical-align: center;
	ignore-parent-flow: true;
	overflow: noclip;
	opacity-mask: url("s2r://panorama/images/masks/softedge_box_png.vtex");
}

.ButtonContainer
{
	width: 100%;
	margin-top: 20px;
	flow-children: right;
	horizontal-align: center;
}

.ButtonContainer .Dash
{
	width: fill-parent-flow( 1 );
	height: 1px;
	background-color: gradient(linear, 0% 0%, 100% 0%, from(#ffe5b500), to(#ffe5b5));
	vertical-align: center;
	opacity: 0.1;
}

.ButtonContainer .Dash.Right
{
	transform: scaleX( -1 );
}

.ButtonContainer .Emblem
{
	width: 44px;
	vertical-align: center;
	margin-bottom: 22px;
}

.ButtonContainer .Emblem.Right
{
	transform: scaleX( -1 );
}

.ButtonContainer #BuyNowButton
{
	horizontal-align: center;
	margin: 0px 16px;
}