
.BindingRow
{
    background-color: none;
    flow-children: right;
    width: 100%;
    height: 48px;
    tooltip-position: bottom;
}


#BasicHotkeysContainer .BindingRow
{
	margin: 6px 0px 6px 0px;
}

.ExtraTopSpace
{	
	margin-top: 16px;
}

.ItemBindButton
{
    flow-children: none;
}

#BindingLabelContainer
{
	height:100%;
	horizontal-align: center;
	vertical-align: middle;
	flow-children: right;
}

#BindingLabelContainer.ActiveBindButton
{
	width: 100%;
	border: 1px solid #c9c9c9;
	border-radius: 2px;
	animation-name: BackgroundPulse;
	animation-duration: 1.35s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}
    
.HeroAbilityBindAbilityButton #BindingLabelContainer, .ItemBindButton #BindingLabelContainer
{
	flow-children: none;
	horizontal-align: left;
}

#mod
{
	visibility: collapse;
	margin-right: -2px;
	text-overflow: shrink;
}

#dash
{
	visibility: collapse;
	margin-right: 1px;
}

.ClearKeybinding
{
    width: 24px;
    height: 24px;
	margin: 5px;
    vertical-align: middle;
    horizontal-align: right;
	background-image: url("file://{images}/icons/ui/cancel.svg");
	background-size: 85% 100%;
	background-repeat: no-repeat;
    visibility: collapse;
}

.ClearKeybinding:hover
{
	wash-color:#999999;
}

CSGOSettingsKeyBinder:selected .ClearKeybinding
{
    visibility: visible;
}

.ClearKeybinding, .ItemBindButton .ClearKeybinding
{
    vertical-align: top;
}

CSGOSettingsKeyBinder:selected .ActiveBindButton #mod, CSGOSettingsKeyBinder:selected .ActiveBindButton #dash
{
	visibility: collapse;
}

.Modifier #dash, .Modifier #dash, .Modifier #mod, .Modifier #mod
{
	visibility: visible;
}

.Modifier #mod, .ItemBindButton .Modifier #mod
{
	visibility: visible;
	margin-top: 14px;
	font-size: 14px;
	opacity: 0.55;
}

.Modifier #dash, .ItemBindButton .Modifier #dash
{
	visibility: collapse;
}

.BindingRow:hover .BindingRowButton
{
	color: white;
}

.BindingRowLabel
{
    font-size: 18px;
	horizontal-align: left;
	vertical-align: middle;

    transition-property: color;
	transition-duration: 0.16s;
	transition-timing-function: ease-in-out;
}

.BindingRowLabel:hover
{
	color: white;
	margin-right: 0px;

      
	                           
	                           
	                                        
	  
}

.BindingRow.CannotEdit:hover #LabelFXContainer,
.CannotEdit #LabelFXContainer,
.BindingRow.CannotEdit:hover .BindingRowLabel
{
	                              
}

.CannotEdit:hover Label
{
	color: #7d8688;
}

.CannotEdit:hover #LabelFXContainer Label
{
	color: #8d9698;
}

.BindingRowLabel, .ItemBindButton .BindingRowLabel
{
    width: fill-parent-flow( 0.8 );
    margin-right: 0px;
}

.BindingRowButton
{
    color: #8d9698;
    horizontal-align: right;
    text-align: center;
    font-size: 18px;
	text-overflow: shrink;
}

.BindingRowButton:hover
{
	color: white;
}

CSGOSettingsKeyBinder:disabled .BindingRowButton
{
}

.ItemBindButton
{
    background-color: #2B2F30;
    color: #7d8688;
	transition-property: transform, background-color, border, color;
	transition-duration: 0.16s;
	transition-timing-function: ease-in-out;
}

.ItemBindButton:hover
{
    background-color: #424c49;
	border-color: #5b6a62;
	color: white;
}

.ItemBindButton:disabled
{
	opacity: 0.2;
}

.ItemBindButton
{
    width: 96px;
    height: 79px;
    width: 84px;
    height: 69px;	
    margin: 14px;
	margin-top: 12px;
	margin-bottom: 12px;
                   
    font-size: 12px;
	border: 2px solid #414a45;
}

.ItemBindButton .BindingRowLabel
{
    background-color: transparent;
}

.ItemBindButton .BindingRowButton
{
	              
    background-color: transparent;
    vertical-align: top;
    horizontal-align: left;
    text-align: left;
	padding-left: 4px;
	font-size: 15px;
	
	transition-property: color;
	transition-duration: 0.16s;
	transition-timing-function: ease-in-out;
}

CSGOSettingsKeyBinder:selected .ActiveBindButton
{
                                

	animation-name: BackgroundPulse;
	animation-duration: 3s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}

.BindingRow:selected #LabelFXContainer
{
	                            
	                                          
}

CSGOSettingsKeyBinder:selected .ActiveBindFX
{
    opacity: 1;
	transition-duration: 0.1s;
}

#LabelFXContainer
{
	width: fill-parent-flow( 0.3 );
	height: 32px;
	horizontal-align: right;
	vertical-align: middle;
	
	transition-property: background-color;
	transition-duration: 0.16s;
	transition-timing-function: ease-in-out;
}

.BindingRow:hover #LabelFXContainer
{
	                            
}

.ActiveBindFX
{
	width: 100%;
	height: 100%;
	opacity: 0;
	
	transition-property: opacity;
	transition-duration: 0.36s;
	transition-timing-function: ease-in-out;
}


@keyframes 'BackgroundPulse'
{
	0%
	{
		background-color: #00000010;
	}

	50%
	{
		background-color: #00000080;
	}
				
	
	100%
	{
		background-color: #00000010;
	}
}

.ControlGroupRow .BindingRowLabel
{
	width: 50%;
}
.ControlGroupRow #LabelFXContainer
{
	width: 47%;
}
