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

#TreasureExtraInfo.RootPanel
{
	width: 100%;
	height: 100%;
	margin-left: 0px;
	margin-top: 0px;
}

.BonusLevels
{
	flow-children: down;
	width: 560px;
	margin-top: 20px;
	margin-left: 100px;
	ui-scale: 82.5%;
}

.AspectRatio4x3 .BonusLevels
{
	margin-left: 14px;
}

#PanelBg
{
	background-color: gradient( linear, 0% 100%, 0% 0%, from( secondaryUltraDarkColor&EE ), to( ultraDarkColor ) ) );
	border: 1px solid #27344C80;
	flow-children: down;
	width: 100%;
}

#PanelHeader
{
	flow-children: right;
	background-color: gradient( linear, 0% 0%, 100% 0%, from( secondaryDarkColor ), to( #392868 ) );
	width: 100%;
	padding: 16px 10px;
}

#TreasureLine
{
	flow-children: right;
}

#BattlePassLogo
{
	width: 55px;
	height: 60px;
	background-image: url("s2r://panorama/images/compendium/spring2016/bp_logo_just_shield_ti6_psd.vtex");
	background-size: 100%;
	horizontal-align: center;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	margin-right: 4px;
	hue-rotation: 170deg;
}

#AchievementProgress
{
	flow-children: down;
	horizontal-align: center;
	width: 100%;
	padding: 14px 8px 24px 8px;
}

#AchievementTiers
{
	flow-children: right;
	width: 100%;
	margin-bottom: 14px;
	margin-left: 13px;
	horizontal-align: center;
}

.AchievementAmount
{
	flow-children: right;
	width: fill-parent-flow( 1.0 );
	margin-right: 20px;
}

.achievement-reward
{
	text-align: center;
	vertical-align: center;
	font-size: 21px;
	font-weight: semi-bold;
	width: 100%;
	color: #fff;
	text-transform: uppercase;
	letter-spacing: 2px;
	margin-top: -6px;
}

.achievement-level
{
	font-size: 14px;
	font-weight: semi-bold;
	text-align: center;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-align: center;
	width: 100%;
	color: #9862E9;
	margin-top: 8px;
}

.PTS
{
	background-image: url("s2r://panorama/images/compendium/international2019/totalpoints_psd.vtex");
	background-size: cover;
	width: 28px;
	height: 28px;
	margin-top: 4px;
	horizontal-align: center;
}

.sub-text
{
	font-size: 18px;
	font-weight: normal;
	text-align: center;
	horizontal-align: center;
	width: 100%;
	line-height: 24px;
	padding: 6px 36px;
	padding-bottom: 24px;
}

.levels
{
	color: #D8BAFF;
}

.header-text
{
	horizontal-align: center;
	width: 100%;
	text-align: center;
	text-transform: uppercase;
	margin-top: 7px;
	font-weight: bold;
	font-size: 22px;
	letter-spacing: 2px;
	color: #fff;
	text-shadow: 0px 0px 6px defaultColor;
}

#PointsEarned
{
	flow-children: right;
	horizontal-align: center;
}

.points-remaining,.points-earned
{
	color: #9862E9;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 1px;
}

.FooterText
{
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 2px;
	text-align: center;
	padding: 0px 54px;
	line-height: 21px;
	margin-top: 11px;
	color: #999;
}

.xp-square
{
	width: 100%;
	height: 100%;
	margin: 0px;
	horizontal-align: center;
	flow-children: down;
	padding-top: 24px;
}

#TreasureNumbers
{
	flow-children: right;
	width: 100%;
	margin-top: 12px;
}

.treasure-number
{
	width: fill-parent-flow( 1.0 );
	font-size: 14px;
	text-align: center;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-align: center;
	color: #B685F7;
}

.left
{
	text-align: left;
	padding-left: 16px;
}

.right
{
	text-align: right;
	padding-right: 10px;
}

.center
{
	padding-right: 0px;
}

.CacheCounter
{
	horizontal-align: center;
	flow-children: down;
}

.progress-achievement-lg
{
	width: 108px;
	height: 108px;
	background-color: gradient( linear, 0% 0%, 0% 100%, from( ultraDarkColor ), to( defaultColor&80 ));
}

.progress-tick-lg
{
	width: 106px;
	height: 106px;
	horizontal-align: center;
	vertical-align: center;
	background-color: gradient( linear, 0% 0%, 0% 150%, from( secondaryUltraDarkColor ), to( darkColor ));
}

.progress-achievement-sm
{
	width: 6px;
	background-color: gradient( linear, 0% 0%, 0% 100%, from( ultraDarkColor ), to( defaultColor&80 ));
}

.progress-tick-sm
{
	width: 4px;
	height: 106px;
	horizontal-align: center;
	vertical-align: center;
	background-color: gradient( linear, 0% 0%, 0% 150%, from( secondaryUltraDarkColor ), to( darkColor ));
}

.ProgressTick .Ticked
{
	background-color: gradient( linear, 0% 0%, 0% 100%, from( defaultColor&66 ), to( accentColor&66 ) );
}

#ProgressTick_0,#ProgressTick_6,#ProgressTick_12
{
	width: 108px;
	height: 108px;
	margin-right: 2px;
	margin-left: 2px;
}

#ProgressTick_1,#ProgressTick_2,#ProgressTick_3,#ProgressTick_4,#ProgressTick_5,#ProgressTick_7,#ProgressTick_8,#ProgressTick_9,#ProgressTick_10,#ProgressTick_11
{
	width: 6px;
	height: 108px;
	margin-right: 2px;
	margin-left: 2px;
}

.progress-achievement-lg.Ticked
{
	background-color: gradient( linear, 0% 0%, 0% 100%, from( ultraDarkColor ), to( accentColor ));
}

.Ticked > .progress-tick-lg
{
	background-color: gradient( linear, 0% 0%, 0% 150%, from( secondaryUltraDarkColor ), to( defaultColor ));
}

.progress-achievement-sm.Ticked
{
	background-color: gradient( linear, 0% 0%, 0% 100%, from( ultraDarkColor ), to( accentColor ));
}

.Ticked > .progress-tick-sm
{
	background-color: gradient( linear, 0% 0%, 0% 100%, from( ultraDarkColor ), to( darkColor&80 ));
}

.TreasureIcon
{
	width: 14px;
	height: 14px;
	background-image: url("s2r://panorama/images/icon_treasure_button_png.vtex");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	vertical-align: middle;
	horizontal-align: center;
}

#Countdown
{
	horizontal-align: center;
	margin-top: 20px;
	margin-left: 0px;
	width: 600px;
	vertical-align: top;
	flow-children: down;
	background-color: gradient (linear, 0% 0%, 100% 0%, from (transparent), color-stop(0.5, #9862E940), to (transparent) );
	padding: 8px 12px;
	visibility: visible;
	opacity: 0.0;
	transition-property: opacity;
	transition-duration: 0.8s;
	transition-timing-function: ease-in-out;
	transition-delay: 0.5s;
}

.FullPreviewMode #Countdown
{
	transition-delay: 0.0s;
	opacity: 1.0;
}

.AspectRatio16x10 #Countdown
{
	width: 500px;
}

.AspectRatio4x3 #Countdown
{
	width: 400px;
}

.time-left
{
	font-weight: semi-bold;
	text-align: center;
	width: 100%;
	font-size: 42px;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-shadow: 0px 2px 2px black;
	color: gradient (linear, 0% 100%, 0% 0%, from (#D8BAFF), to ( #fff) );
}

.remaining
{
	text-align: center;
	width: 100%;
	color: #86ADC6;
	font-weight: semi-bold;
	font-size: 18px;
	text-transform: uppercase;
	letter-spacing: 2px;
	text-shadow: 0px 2px 2px black;
	brightness: 1.4;
	margin-top: -12px;
}

#Countdown.CountdownActive .finished
{
	visibility: collapse;
}

#Countdown.CountdownAfterEnd .time-left,#Countdown.CountdownAfterEnd .remaining
{
	visibility: collapse;
}

.finished
{
	font-weight: semi-bold;
	font-size: 24px;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-shadow: 0px 2px 2px black;
	color: gradient (linear, 0% 100%, 0% 0%, from (#D8BAFF), to ( #fff) );
	margin-bottom: -4px;
}

#Countdown.CountdownActive .finished
{
	visibility: collapse;
}