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

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

#ModelBackground
{
	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.0s;
	transition-timing-function: ease-in;
	background-size: 100% 100%;
	background-position: 50% 50%;
	background-repeat: no-repeat;
}

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

#DebutInformation
{
	background-color: none;
	width: 620px;
	height: 820px;
	opacity: 0;
	margin-left: 0px;
	margin-right: 700px;
	transition-property: opacity;
	transition-duration: 1.5s;
	transition-timing-function: ease-in;
}

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

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

#InformationBody
{
	padding: 32px;
	padding-top: 0px;
	padding-bottom: 64px;
	horizontal-align: center;
	width: 620px;
	height: 820px;
}

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

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

#ItemName
{
	font-size: 96px;
	letter-spacing: 3px;
	text-overflow: shrink;
	text-align: center;
	vertical-align: bottom;
	horizontal-align: center;
	color: #ff5c5c;
	text-shadow: 1px 1px 12px 3.0 #940000;
	opacity: 0;
	margin-top: 0px;
}

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

#ItemLore
{
	margin-left: 10px;
	margin-right: 10px;
}

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

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

#HeroSubtitle
{
	margin-top: -28px;
	margin-bottom: 12px;
	margin-left: 10px;
	flow-children: right;
}

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

#AbilityIcons
{
	margin-left: 10px;
	flow-children: right;
}

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

#Talent
{
	width: 72px;
	height: 72px;
	wash-color: #DD9548;
	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;
}

#Intro
{
	color: #5A7C52;
	font-size: 32px;
	margin-bottom: 96px;
	margin-top: 32px;
	text-transform: uppercase;
}

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

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

#ToLoadout
{
	width: 120px;
}