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

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

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

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

#ModelBackgroundAlt
{
	opacity: 0.001;
}

#DebutInformation
{
	width: 780px;
	height: 850px;
	opacity: 0;
	margin-left: 0px;
	margin-right: 880px;
	opacity: 0;
	transition-property: wash-color, opacity, pre-transform-scale2d;
	transition-duration: 3s;
	transition-delay: 2s;
	transition-timing-function: ease-in;
}

#DebutInformation.Initialize,#InformationBody.Initialize
{
	opacity: 1;
	transition-duration: 0s;
}

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

#InformationBody
{
	padding: 40px 24px;
	horizontal-align: center;
	width: 620px;
	height: 820px;
}

#WRImages
{
	flow-children: right;
}

#HandOfMidas
{
	width: 88px;
	height: 64px;
	background-image: url("s2r://panorama/images/leaf_pages/debut_arcana_ogre_magi/om_arcana_hand_of_midas_png.vtex");
}

#HeroPortrait
{
	width: 95px;
	height: 120px;
	background-image: url("s2r://panorama/images/leaf_pages/debut_arcana_windranger/wr_portrait_psd.vtex");
	background-position: 0% 0%;
	background-size: 100%;
	vertical-align: top;
	img-shadow: 0px 0px 10px 10.0 #000000;
}

#HeroIcons
{
	width: 120px;
	height: 120px;
	background-image: url("s2r://panorama/images/leaf_pages/debut_arcana_windranger/hero_icon_psd.vtex");
	background-position: 0% 0%;
	background-size: 100%;
	vertical-align: top;
	background-repeat: no-repeat;
	img-shadow: 0px 0px 10px 10.0 #000000;
}

#HeroAbilities
{
	width: 120px;
	height: 120px;
	background-image: url("s2r://panorama/images/leaf_pages/debut_arcana_windranger/ability_icons_psd.vtex");
	background-position: 0% 0%;
	background-repeat: no-repeat;
	background-size: 100%;
	vertical-align: top;
	img-shadow: 0px 0px 10px 10.0 #000000;
}

.InlineImage
{
	margin-bottom: 20px;
	box-shadow: 0px 0px 15px #000000&33;
	max-height: 200px;
	margin-right: 10px;
}

#InformationBodyBackground
{
	width: 100%;
	height: 100%;
	background-image: url("s2r://panorama/images/leaf_pages/debut_arcana_windranger/windranger_arcana_debut_bg_psd.vtex");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	img-shadow: 0px 0px 100px #000000;
	transition-property: wash-color;
	transition-duration: 0.0s;
	transition-timing-function: ease-in-out;
}

.StyleChangerButton
{
	width: 400px;
	height: 300px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	horizontal-align: right;
	vertical-align: middle;
	margin-left: 1400px;
	margin-top: 600px;
	margin-right: 70px;
	img-shadow: 0px 4px 18px #000000;
	transform: translateX( 40px );
	opacity: 0.0;
	transition-property: wash-color, opacity;
	transition-duration: 3.0s;
	transition-timing-function: ease-in;
}

.StyleChangerButton.Initialize
{
	opacity: 1.0;
	transition-duration: 0.3s;
}

.StyleChangerButton:hover
{
	brightness: 1.5;
}

.StyleChangerButton:active
{
	brightness: 0.5;
}

.StyleChangerButton Label
{
	text-align: center;
	width: 100%;
	color: #fff;
	letter-spacing: 2px;
	text-transform: uppercase;
	vertical-align: middle;
	line-height: 24px;
	font-size: 18px;
}

#SecondStyle
{
	background-image: url("s2r://panorama/images/leaf_pages/debut_arcana_windranger/windranger_altstyle_side_png.vtex");
}

#DefaultStyle
{
	background-image: url("s2r://panorama/images/leaf_pages/debut_arcana_windranger/windranger_side_png.vtex");
}

#ItemName
{
	background-image: url("s2r://panorama/images/leaf_pages/debut_arcana_windranger/windranger_arcana_debut_logo_psd.vtex");
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	vertical-align: bottom;
	horizontal-align: center;
	color: #fff;
	opacity: 0;
	width: 130%;
	height: 200px;
	margin-bottom: -40px;
}

.Language_schinese #ItemName,.Language_tchinese ##ItemName
{
	background-image: url("s2r://panorama/images/leaf_pages/debut_arcana_windranger/windranger_arcana_debut_logo_cn_psd.vtex");
	height: 180px;
	background-size: 106%;
}

#InnerPanel,#ItemLore
{
	opacity: 0;
	margin-top: 12px;
	transition-property: opacity;
	transition-duration: .0s;
	transition-timing-function: ease-in-out;
}

#ItemLore
{
	color: #fff;
	font-weight: light;
	font-size: 17px;
	margin: 12px 12px 12px 0px;
	text-align: justify;
	text-shadow: 0px 0px 5px 3.0 #000000;
}

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

#TitleContainer
{
	width: 100%;
	horizontal-align: center;
	transition-property: hue-rotation, wash-color, saturation;
	transition-duration: .1s;
	transition-timing-function: ease-in-out;
	flow-children: down;
	overflow: noclip;
}

#HeroSubtitle
{
	margin-top: 12px;
	margin-bottom: 12px;
	flow-children: right;
	horizontal-align: center;
}

#AttackType
{
	color: #ccc;
	margin-right: 12px;
	text-transform: uppercase;
	letter-spacing: 2px;
}

.RolesContainer
{
	width: 400px;
	height: 54px;
	flow-children: right;
}

.RoleLabel
{
	margin-right: 8px;
	text-transform: uppercase;
	letter-spacing: 2px;
	color: #fff;
	text-shadow: 0px 1px 3px 2 black;
}

.CloseButton
{
	margin-right: 90px;
	margin-top: 40px;
	width: 28px;
	height: 28px;
	border-radius: 50px;
	background-size: 50%;
	background-color: #00000080;
	wash-color: #fff;
}

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

#AbilityIcons > DOTAAbilityImage
{
	width: 72px;
	height: 72px;
	margin-right: 16px;
}

#Talent
{
	width: 72px;
	height: 72px;
	wash-color: #fff;
	img-shadow: 0px 2px 4px 1 black;
	margin-left: 0px;
	tooltip-position: bottom;
	tooltip-body-position: 100%;
	transition-property: wash-color;
	transition-duration: .15s;
	transition-timing-function: ease-in-out;
	border: 1px solid transparent;
	border-radius: 0px;
	background-size: 90%;
	background-size: 54px 54px;
	background-position: center center;
}

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;
}

#DebutInformation.Initialize #Intro
{
	color: #fff;
	font-size: 20px;
	text-transform: uppercase;
	horizontal-align: center;
	text-shadow: 0px 2px 4px 2 black;
	font-weight: semi-bold;
	margin-left: 0;
	margin-bottom: 10px;
	font-weight: normal;
	letter-spacing: 3px;
}

.PreviewMode
{
	background-color: gradient( linear, 0% 100%, 0% 0%, from( #af5417 ), to( #af5417 ) );
	opacity: 0.9;
	border-top: 1px solid #faa46a;
	box-shadow: #27110250 6px 0px 12px ;
	height: 49px;
}

.PreviewMode.SmallDemoButton .DemoButton
{
	height: 49px;
	padding: 4px 24px 4px 24px;
}

.PurchaseButton
{
	width: 160px;
	height: 49px;
}

.Promo
{
	visibility: collapse;
	horizontal-align: center;
	margin: 12px 0;
}

.Promo Label
{
	color: #fff5d2;
	text-shadow: 0px 0px 4px 2 #eaca5240;
}

#HeroButtons
{
	margin-bottom: 50px;
	flow-children: down;
	horizontal-align: center;
	vertical-align: bottom;
}

#DemoButtons
{
	flow-children: right;
}

#ToNextHero
{
	width: 100%;
}

#ToNextHero Label
{
	width: 100%;
	text-align: center;
	text-transform: uppercase;
	color: #fff;
	letter-spacing: 2px;
	margin-top: 24px;
}

#ToNextHero Label:hover
{
	brightness: 2.0;
}

#DemoHeroButton
{
	width: 280px;
	height: 48px;
	vertical-align: middle;
}

#ToLoadout
{
	height: 48px;
	font-size: 16px;
}

#ToLoadout Label
{
	font-size: 18px;
	vertical-align: middle;
}

.ButtonBevel
{
	padding: 4px 24px;
}

#DebugButtons
{
	margin-bottom: 400px;
	flow-children: down;
	horizontal-align: left;
	vertical-align: bottom;
	margin-right: 20px;
	visibility: collapse;
}

#DebugButtons TextButton
{
	width: 220px;
}

.MainBranch #DebugButtons
{
	visibility: visible;
}

.Bullet
{
	vertical-align: top;
	margin-top: 9px;
	background-color: #94d9d8;
	margin-left: 0;
	margin-right: 8px;
}

.BulletList
{
	max-width: 460px;
	margin-left: 0px;
}

.BulletList Label
{
	font-size: 18px;
	margin-bottom: 8px;
}

.bullettitle
{
	font-weight: bold;
	margin-bottom: 10px;
}

.BulletDesc
{
	flow-children: down;
}

.BulletDesc .Bullet
{
	margin-top: 5px;
}

.BulletBold
{
	font-weight: bold;
}

#HeroButtons
{
	padding-top: 0px;
	margin-bottom: 20px;
	margin-right: 30px;
}

#ScrollPanel
{
	width: 480px;
	height: 470px;
	opacity: .8;
	overflow: clip scroll;
	horizontal-align: center;
	opacity-mask: url("s2r://panorama/images/masks/softedge_vertical_vscroll_wide_psd.vtex");
	vertical-align: top;
	padding-bottom: 20px;
	margin-bottom: 10px;
}

.BottomBullet
{
	margin-bottom: 10px;
}

HorizontalScrollBar
{
	visibility: collapse;
}

#ESVideo1
{
	max-width: 97%;
	height: 220px;
	margin-bottom: 20px;
}

#DefaultStyle
{
	opacity: 0.0;
}

.DashboardPage.ShowingAlternateStyle #DefaultStyle
{
	opacity: 1.0;
}

.DashboardPage.ShowingAlternateStyle #SecondStyle
{
	opacity: 0.0;
}

.DashboardPage.ShowingAlternateStyle #ModelBackgroundAlt
{
	opacity: 1;
	transition-duration: .9s;
	transition-delay: 0.0s;
}

.SwapStyle:active
{
	sound: "ui_generic_button_click";
}

.SwapStyle.Initialize
{
	transition-delay: 0s;
	transition-duration: 0.1s, 0.1s;
	opacity: 1.0;
}

.ShowingAlternateStyle #DemoHeroButtonOriginal
{
	visibility: collapse;
}

.ShowingAlternateStyle #DemoHeroButtonAlternate
{
	visibility: visible;
}