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

DOTARubickArcanaPage
{
	width: 100%;
	height: 100%;
}

#ModelContainer
{
	width: 100%;
	height: 100%;
}

#ModelBackground,#ModelBackground_FG
{
	transform: scaleX(1);
	width: 100%;
	height: 100%;
	pre-transform-scale2d: 1;
	vertical-align: middle;
	horizontal-align: center;
	saturation: 1;
	contrast: 1.03;
	transition-property: opacity, wash-color, saturation, contrast;
	transition-duration: 0.5s;
	transition-timing-function: ease-in;
	background-size: 100% 100%;
	background-position: 50% 50%;
	background-repeat: no-repeat;
}

#ModelBackground.Initialize,#ModelBackground_FG.Initialize
{
	saturation: 1;
	contrast: 1;
	transition-duration: 0s;
}

#DebutInformation
{
	margin-top: 80px;
	margin-left: 0px;
	margin-right: 800px;
	background-color: none;
	width: 775px;
	height: 879px;
	opacity: 0.0;
	transform: none;
	transition-property: opacity, transform;
	transition-duration: 1.0s;
}

#DebutInformation.Initialize,#InformationBody.Initialize
{
	opacity: 1;
}

#InformationBackground
{
	width: 100%;
	height: 100%;
}

#InformationBody
{
	padding: 32px;
	padding-top: 57px;
	padding-bottom: 24px;
	horizontal-align: center;
	width: 620px;
	height: 760px;
}

#InformationBodyBackground
{
	width: 100%;
	height: 100%;
	background-image: url("s2r://panorama/images/leaf_pages/debut_arcana_rubick/debut_bg_psd.vtex");
	background-repeat: no-repeat;
	opacity: 0;
	transition-property: wash-color;
	transition-duration: .8s;
	transition-timing-function: ease-in-out;
}

#InformationBodyBackground.Initialize
{
	opacity: .8;
	transition-duration: 0s;
}

#InnerPanel
{
	height: 872px;
	vertical-align: bottom;
	background-color: transparent;
	border: 0px solid transparent;
	opacity-mask: url("s2r://panorama/images/masks/softedge_vertical_vscroll_wide_psd.vtex")1;
	padding-right: 24px;
}

#ItemName
{
	font-family: defaultFont;
	font-size: 46px;
	letter-spacing: 3px;
	text-overflow: shrink;
	height: 54px;
	text-align: center;
	vertical-align: bottom;
	horizontal-align: center;
	color: #dfef4a;
	text-shadow: 0px 1px 12px 3.0 #474c15;
	opacity: 0;
}

#ItemName,#InnerPanel,#ItemLore
{
	opacity: 0;
	transition-property: opacity;
	transition-duration: .5s;
	transition-timing-function: ease-in-out;
}

#ItemName.Initialize,#InnerPanel.Initialize,#ItemLore.Initialize
{
	opacity: 1;
	transition-duration: 0s;
}

.VideoPanel
{
	margin-bottom: 16px;
	border-radius: 16px;
	border: 1px solid #123B46;
}

.HeaderPanel
{
	width: 100%;
}

.CloseButton
{
	opacity: 0.8;
	margin-top: 150px;
	margin-right: 40px;
}

#TitleFX
{
	width: 100%;
	height: 100px;
	opacity-mask: url("s2r://panorama/images/masks/softedge_vertical_softer_png.vtex")1;
}

#TitleContainer
{
	width: 100%;
	horizontal-align: center;
	transform: translateY(-16px);
	transition-property: hue-rotation, wash-color, saturation;
	transition-duration: .8s;
	transition-timing-function: ease-in-out;
}

#ItemSubtitle
{
	horizontal-align: center;
	margin-top: -24px;
}

.HeaderPanel Label
{
	color: #51aB74;
}

#Portrait
{
	background-image: url("s2r://panorama/images/leaf_pages/debut_arcana_rubick/customportrait_psd.vtex");
	width: 96px;
	height: 118px;
}

#HeroIcon
{
	background-image: url("s2r://panorama/images/heroes/npc_dota_hero_rubick_alt_png.vtex");
	width: 96px;
	height: 54px;
	vertical-align: top;
	margin-top: 16px;
}

#AbilityIcons
{
	width: 135px;
	flow-children: right-wrap;
}

#AbilityIcons > Panel
{
	background-size: 100%;
	width: 48px;
	height: 48px;
	vertical-align: top;
}

#AbilityIcon
{
	background-image: url("s2r://panorama/images/spellicons/rubick/arcana/rubick_fade_bolt_arcana_png.vtex");
}

#AbilityIcon2
{
	background-image: url("s2r://panorama/images/spellicons/rubick/arcana/rubick_spell_steal_arcana_png.vtex");
}

#AbilityIcon3
{
	background-image: url("s2r://panorama/images/spellicons/rubick/arcana/rubick_telekinesis_arcana_png.vtex");
}

#AbilityIcon4
{
	background-image: url("s2r://panorama/images/spellicons/rubick/arcana/rubick_telekinesis_land_arcana_png.vtex");
}

.CustomSquare
{
	border-color: #255D61;
}

#MinimapIcon
{
	background-image: url("s2r://panorama/images/heroes/icons/npc_dota_hero_rubick_alt_png.vtex");
	width: 32px;
	height: 32px;
	vertical-align: bottom;
	margin-bottom: 10px;
	border: 0px solid transparent;
}

#QualityContainer
{
	opacity: 0;
	transition-property: opacity;
	transition-duration: .8s;
	transition-timing-function: ease-in-out;
}

#QualityContainer.Initialize
{
	opacity: 1;
}

.HeaderLabel
{
	color: #7B8C8D;
}

VerticalScrollBar .ScrollThumb
{
	background-color: #245A5E;
}

VerticalScrollBar:hover .ScrollThumb,VerticalScrollBar:active .ScrollThumb
{
	background-color: #31BDAC;
}

#MainContainer
{
	width: 100%;
	height: 100%;
	wash-color: #000;
	transition-property: wash-color;
	transition-duration: 0.4s;
	transition-timing-function: ease-in;
}

#MainContainer.Initialize
{
	wash-color: #fff;
}

.DemoSpacer
{
	height: 8px;
}

DemoModeButton,DOTAPurchaseButton
{
	width: fill-parent-flow(1.0 );
	horizontal-align: right;
}

#Buttons
{
	flow-children: right;
	margin-right: 130px;
	margin-bottom: 20px;
	opacity: 0;
	width: 500px;
	transition-property: opacity;
	transition-duration: .8s;
	transition-timing-function: ease-in-out;
}

#Buttons.Initialize
{
	opacity: 1;
}

#FooterPanel
{
	margin-bottom: 72px;
	height: fit-children;
}

.Promo
{
	visibility: visible;
	width: 390px;
	margin-bottom: 60px;
	margin-right: 150px;
}

.BulletList
{
	margin-bottom: 6px;
}

.FormLore
{
	font-size: 18px;
	color: white;
	text-shadow: 0px 1px 3px 3.0 #000;
}

#ViewProgressButton
{
	horizontal-align: center;
	vertical-align: bottom;
	margin-bottom: 200px;
	margin-left: 700px;
	opacity: 0.0;
	transition-property: opacity;
	transition-duration: 0.2s;
	background-image: url("s2r://panorama/images/front_page/arcana_button_texture_png.vtex");
	background-repeat: no-repeat;
	background-color: gradient( linear, 0% 0%, 0% 100%, from( #064142 ), to( #00d795 ) );
	box-shadow: inset -1px 1px 0px #00d79560;
	height: 48px;
	padding: 5px 0px 5px 0px;
	text-align: center;
	width: 300px;
	margin-right: 20px;
}

TextButton
{
	box-shadow: 0 0 24px #00d795;
}

#ViewProgressButton.Initialize
{
	opacity: 1.0;
}

.ShowingProgress #ViewProgressButton.Initialize
{
	opacity: 0.0;
}

#ViewFeaturesButton
{
	horizontal-align: center;
	vertical-align: bottom;
	margin-bottom: 200px;
	margin-left: 700px;
	opacity: 0.0;
	transition-property: opacity;
	transition-duration: 0.2s;
	background-image: url("s2r://panorama/images/front_page/arcana_button_texture_png.vtex");
	background-repeat: no-repeat;
	background-color: gradient( linear, 0% 0%, 0% 100%, from( #064142 ), to( #00d795 ) );
	box-shadow: inset -1px 1px 0px #00d79560;
	height: 48px;
	padding: 5px 0px 5px 0px;
	text-align: center;
	width: 300px;
	margin-right: 20px;
}

.ShowingProgress #ViewFeaturesButton.Initialize
{
	opacity: 1.0;
}

.ShowingProgress #DebutInformation
{
	opacity: 0.0;
	transform: translateX( 30px );
	transition-delay: 0.0s;
}

#ArcanaProgress
{
	horizontal-align: center;
	vertical-align: middle;
	margin-bottom: 200px;
	margin-left: 700px;
	opacity: 0.0;
	transform: translateX( -30px );
	transition-property: opacity, transform;
	transition-delay: 0.5s;
	transition-duration: 1.0s;
}

.ShowingProgress #ArcanaProgress
{
	opacity: 1.0;
	transform: none;
	transition-delay: 0.0s;
}