@define shortduration: 0.25s;
@define mediumduration: 0.4s;
@define longduration: 1.7s;
@define tabheight: 120px;
@define fieldwidth: 512px;
@define propertiesheight: 580px;
@define bindingbuttonwidth: 420px;
@define negbindingbuttonwidth: -420px;


ControllerBindingsGordon
{
	opacity: 0.0;
	background-color: gradient( radial, 50% 0%, 0px 0px, 50% 100%, from( #102f4b ), to( #080f20 ) );

	transition-property: opacity;
	transition-duration: 0.3s;
	transition-timing-function: bigpicture-ease-in-out;
	width: 100%;
	height: 100%;
}

ControllerBindingsGordon:descendantfocus
{
	opacity: 1.0;

}

ControllerBindingsGordon.FullScreenFadeOut:descendantfocus
{
	opacity: 0.2;
}


ControllerBindingsGordon.Destructing
{
	opacity: 0.0;
}

ControllerBindingsGordon.BehindMessageBox:descendantfocus,
ControllerBindingsGordon.BehindAnotherMsgBox:descendantfocus
{
	transition-property: blur, saturation, opacity, wash-color, transform !immediate;
	transition-duration: 0.3s;
	transition-timing-function: ease-out;

	saturation: 0.6;
	blur: gaussian( 1.5 );
	wash-color: #00000066;
}

ControllerBindingsGordon.BehindMessageBox.BehindTextInputHandler:descendantfocus,
ControllerBindingsGordon.BehindAnotherMsgBox.BehindTextInputHandler:descendantfocus
{
	blur: none;
	saturation: 1.0;
	wash-color: #00000000;
}

ControllerBindingsGordon.ScreenSaverMode
{
	opacity: 0.0;
	transition-property: opacity;
	transition-duration: 1.5s, 0.3s !immediate;
	transition-timing-function: linear;
}

.Preview #PreviewHeader
{
	transition-property: opacity;
	transition-duration: 0.25s, 0.4s !immediate;
	transition-timing-function: bigpicture-ease-in-out;
    opacity: 1.0;

}

#PreviewHeader
{
	color: #75c7fdff;
	font-size: 24px;
	font-family: platformfont;
    margin-left: 24px;
    margin-top: 6px;
    opacity: 0.0;
    width: 100%;
}

#PreviewApp
{
    margin-top: 28px;
}

#PreviewContributorContainer
{
    margin-top: 4px;
    width: 100%;
    horizontal-align: center;
    flow-children: down;
}

#PreviewTitle
{
	font-size: 40px;
    width: 100%;
    text-align: center;
}

#PreviewAuthor
{
	font-size: 20px;
    width: 100%;
    text-align: center;
    margin-top: 0px;
}

#PreviewDescription
{
	margin-top: 80px;
	font-size: 21px;
	height: 120px;
	font-family: platformfont;
	font-weight: thin;
	color: #75c7fdff;
    padding-left: 8px;
    padding-right: 32px;
}

#PreviewWaterMark
{
    visibility: collapse;
}

#PreviewWaterMark.Preview
{
    visibility: visible;
    opacity: 1%;
	//transform-origin: 50% 50% initial;
	//transform: rotatez( -15deg );
	font-family: platformfont;
    font-size: 200px;
    z-index: 1000;
    color: #75c7fd85;
	blur: gaussian( 0.25 );
    horizontal-align: center;
    vertical-align: top;
    padding-top: 220px;
}

#BindingPreviewContainer.Preview
{
	width: 100%;
	height: 100%;
    transform: scalex( 0.95 ) scaley( 0.95 );
    transform-origin: 50% 100% parent-relative;
    horizontal-align: right;
    vertical-align: bottom;
    wash-color: #359cd899;
	transition-property: transform;
	transition-duration: 0.25s, 0.4s !immediate;
	transition-timing-function: bigpicture-ease-in-out;
    saturation: 0.35;
}

#BindingPreviewContainer.PreviewFadeout 
{
    opacity: 0.0;
}

#BindingPreviewContainer
{
	width: 100%;
	height: 100%;
}

.Preview #BindingsTitle,
.Preview #ControllerTitle,
.Preview.MultipleControllers #ControllerTitle,
.Preview #BindingsCreator
{
    visibility: collapse;
}

ControllerConfigBrowser.Preview 
{
    transform: scalex( 1.0 ) scaley( 1.0 );
    visibility: visible;
    width: 100%;
    height: 100%;
}

#VDFDump
{
	width: 20px;
	height: 20px;
}

.BottomPanelVisible #VDFDump
{
	opacity: 0.0;
}

#BindingsContainer
{
	margin-top: 5px;
	height: 100%;
	width: 1767px;
	horizontal-align: center;
	flow-children: down;
}

#TopHalfContainer
{
	height: 625px;
    padding-left: 8px;
	padding-right: 8px;
}

#TopHalfContainer .Background
{
	background-repeat: no-repeat;
	horizontal-align: center;
	width: 1800px;
	height: 100%;
}

#SwitchContainer
{
	height: 625px;
    padding-top: 100px;
    width: 1880px;
}

SelectMousePosition
{
    opacity: 1.0;
}

.SelectMousePositionBody .MsgBoxBodyRegion
{
    background-color: gradient( radial, 0% -0%, 120px -40px, 120% 150%, from( #285c7388 ), to( #12203d88 ) ); 
}

.FullScreenButton
 {
	min-height: 1920px;
	height: 1080px;
    opacity: 0.4;
	color: detailsdatalabel;
	font-size: deffontsize;
	font-family: platformfont;
	background-color: simplebuttonsolid_vertical;

	transition-property: background-color, color;
	transition-duration: 0.4s;
	transition-timing-function: ease-out;
}

.HasMultipleActionSets #Left,
.HasMultipleActionSets #Right
{
	margin-top: 44px;
}

.HasMultipleActionSets #GameActionSets,
.HasMultipleActionSets #GameActionSetLayers
{
	visibility: visible;
}

.HasMultipleActionSets.ShowBackgroundHelper #GameActionSets,
.HasMultipleActionSets.ShowBackgroundHelper #GameActionSetLayers
{
	visibility: collapse;
}

.HasMultipleActionSets.BottomPanelVisible #GameActionSets,
.HasMultipleActionSets.BottomPanelVisible #GameActionSetLayers
{
	visibility: collapse;
}

#GameActionSets,
#GameActionSetLayers
{
	visibility: collapse;
	flow-children: right;
	horizontal-align: middle;
    overflow: scroll;
}

#SetLayerContainer
{
	flow-children: down;
	horizontal-align: middle;
}

#ActivatorCoontainer
{
	visibility: visible;
	flow-children: down;
	horizontal-align: left;
}

#Activators
{
	visibility: visible;
	flow-children: right;
	horizontal-align: left;
    overflow: scroll;
}

.GameActionButton, 
.ActivatorButton
{
	height: 50px;
}

.ActionSetButton, 
.ActionLayerButton 
{
	height: 38px;
    min-height: 38px;
    width: 300px;
    padding: 0px 10px 0px 10px;
    margin: 6px 6px;
}

.GameActionButton Label,
.ActivatorButton Label
{
	horizontal-align: middle;
	text-transform: uppercase;
}

.ActionSetButton Label, 
.ActionLayerButton Label
{
	horizontal-align: middle;
    vertical-align: middle;
    font-size: 21px;
	text-transform: uppercase;
}

.GameActionButton:focus, 
.ActionSetButton:focus, 
.ActionLayerButton:focus,
.ActivatorButton:focus
{
	padding-top: 5px;
	background-color: simplebuttonsolid_vertical;
}

.GameActionButton:hover Label,
.ActionSetButton:hover Label,
.ActionLayerButton:hover Label,
.ActivatorButton:hover Label
{
	color: #f2f2f2ff;
}

.GameActionButton:focus Label,
.ActionSetButton:focus Label,
.ActionLayerButton:focus Label,
.ActivatorButton:focus Label
{
	color: #f2f2f2ff;
	transform: none;
}

.GameActionButton:selected,
.ActionSetButton:selected,
.ActionLayerButton:selected,
.ActivatorButton:selected
{
	background-color: gradient( linear, 0% 0%, 0% 100%, from( #0e86abff ), to( #1a5e80ff ) );
}

.GameActionButton:selected Label,
.ActionSetButton:selected Label,
.ActionLayerButton:selected Label,
.ActivatorButton:selected Label
{
	color: white;
}

#BindingsTitleContainer
{
	horizontal-align: center;
	flow-children: right;
	vertical-align: top;
	width: fit-children;
	height: 5.0%;
}

#BindingsTitle,
#ControllerTitle
{
	font-size: 50px;
	font-family: platformfont;
	color: #01caef;
	//margin-top: 20px;
	visibility: visible;
}

#ControllerTitle
{
	margin-left: 20px;
	color: #FFFFFF;
	visibility: collapse;
}

.MultipleControllers #ControllerTitle
{
	visibility: visible;
}

#BindingsCreator
{
	font-size: 20px;
	font-family: platformfont;
	color: #01caef;
	//margin-top: 20px;
	text-align: center;
	
	horizontal-align: center;
	vertical-align: top;
	width: 40%;
	height: 2.5%;
	
	visibility: visible;
}

.HideBindingsCreator #BindingsCreator 
{
	visibility: collapse;
}

.HideBindingsTitle #BindingsTitle 
{
	visibility: collapse;
}

.HelperImage
{
	horizontal-align: center;
	vertical-align: center;
}

#HelperImageBG
{
	margin-top: 80px;
	horizontal-align: right;
	background-color: #102f4b;
	
	width: 50%;
	height: 90%;
	
	visibility: collapse;
}

#HelperDescription
{
	z-index: 1;
	margin-top: 80px;
	horizontal-align: left;
	background-color: #13354c; 
	
	width: 1800px;
	height: 90%;
	
	transition-property: width;
	transition-timing-function: ease-in;
	transition-duration: 0.1s;
	
	visibility: collapse;
}

.EditAlwaysOnButton #HelperAlwaysOn
{
    visibility: visible;
}

.EditAlwaysOnButton #BackgroundController,
.EditAlwaysOnButton.controller_ps4  #BackgroundController,
.EditAlwaysOnButton.controller_ps3  #BackgroundController,
.EditAlwaysOnButton.controller_xboxone  #BackgroundController,
.EditAlwaysOnButton.controller_xbox360  #BackgroundController,
.EditAlwaysOnButton.controller_generic  #BackgroundController,
.EditAlwaysOnButton.controller_apple  #BackgroundController,
.EditAlwaysOnButton.controller_mobile_touch #BackgroundController 
{
	background-image: url( "" );
    wash-color: #ffffffff;
}

#HelperAlwaysOnHeader
{
    margin-bottom: 160px;
    font-size: 64px;
}

#HelperAlwaysOnText
{
    margin-top: 100px;
}

#HelperAlwaysOn
{
    visibility: collapse;
	z-index: 1;
	margin-bottom: 80px;
	horizontal-align: left;
    vertical-align: bottom;
	
	transition-property: width;
	transition-timing-function: ease-in;
	transition-duration: 0.1s;

	font-size: 24px;
	font-family: platformfont;
    text-wrap:normal;
	color: #01caef;
}


.ShowBackgroundHelper #HelperDescription
{
	visibility: visible;
}

.ShowBackgroundHelper #HelperImageBG
{
	visibility: visible;
}

.HasHelperImage #HelperDescription
{
	width: 900px;
}

#HelperDescriptionHeader
{
	font-size: 60px;
	font-family: platformfont;
	color: #01caef;
	margin-top: 40px;
	text-align: center;
	
	horizontal-align: center;
	vertical-align: top;
	width: 100%;
	height: 15%;
	
	visibility: visible;
}

#HelperDescriptionText
{
	font-size: 30px;
	font-family: platformfont;
	color: #01caef;
	margin-top: 140px;
	text-align: left;
	
	horizontal-align: center;
	vertical-align: top;
	width: 85%;
	height: 90%;
	
	visibility: visible;
}

.ShowBackgroundHelper #BackgroundController
{
	background-image: url( "" );
}

#BackgroundController
{
	background-position: 535px 79px;
	background-image: url("file://{images}/library/controller/cropped_controller_config_controller.png");
}

.controller_ps4 #BackgroundController
{
	background-position: 500px 95px;
    background-size: 725px 421px;
	background-image: url("file://{images}/library/controller/controller_config_controller_ps4.png");
    wash-color: #102f4b72;
}

.controller_ps3 #BackgroundController
{
	background-position: 500px 54px;
    background-size: 725px 421px;
	background-image: url("file://{images}/library/controller/controller_config_controller_ps3.png");
    wash-color: #102f4b72;
}


.controller_xboxone #BackgroundController
{
	background-position: 500px 95px;
    background-size: 725px 421px;
	background-image: url("file://{images}/library/controller/controller_config_controller_xboxone.png");
    wash-color: #102f4b72;
}

.controller_xbox360 #BackgroundController
{
	background-position: 434px 60px;
    background-size: 850px 494px;
	background-image: url("file://{images}/library/controller/controller_config_controller_x360.png");
    wash-color: #102f4b72;
}

.controller_generic #BackgroundController
{
	background-position: 434px 60px;
    background-size: 850px 494px;
	background-image: url("file://{images}/library/controller/controller_config_controller_generic.png");
    wash-color: #102f4b72;
}

.controller_apple #BackgroundController
{
	background-position: 434px 60px;
    background-size: 850px 494px;
	background-image: url("file://{images}/library/controller/controller_config_controller_apple.png");
    wash-color: #102f4b72;
}

.controller_android #BackgroundController
{
	background-position: 434px 60px;
    background-size: 850px 494px;
	background-image: url("file://{images}/library/controller/controller_config_controller_android.png");
    wash-color: #102f4b72;
}

.controller_switch_pro #BackgroundController
{
	background-position: 434px 60px;
    background-size: 850px 494px;
	background-image: url("file://{images}/library/controller/controller_config_controller_switch_pro.png");
    wash-color: #102f4b72;
}

.controller_mobile_touch #BackgroundController
{
    background-position: 517px 10px;
    background-size: 707px 428px;
    background-image: url("file://{images}/library/controller/controller_config_controller_touch.png");
    wash-color: #102f4b32;
}


.BackgroundLines
{
	background-position: -96px -80px;
	transition-property: pre-transform-scale2d, transform, opacity;
	transition-duration: 0.2s;
	transition-timing-function: bigpicture-ease-in-out;
}

.controller_ps4 #BackgroundBaseLinesLeft,
.controller_ps3 #BackgroundBaseLinesLeft,
.controller_xboxone #BackgroundBaseLinesLeft,
.controller_xbox360 #BackgroundBaseLinesLeft,
.controller_generic #BackgroundBaseLinesLeft,
.controller_switch_pro #BackgroundBaseLinesLeft,
.controller_android #BackgroundBaseLinesLeft,
.controller_apple #BackgroundBaseLinesLeft
{
    background-image: url("file://{images}/library/controller/cropped_controller_config_lines_ps4.png");
    background-position: 190px -74px;
}

.controller_mobile_touch #BackgroundBaseLinesLeft
{
    background-image: url("file://{images}/library/controller/cropped_controller_config_lines_ps4.png");
    background-position: 140px -84px;
}

.controller_ps4 #BackgroundBaseLinesRight,
.controller_ps3 #BackgroundBaseLinesRight,
.controller_xboxone #BackgroundBaseLinesRight,
.controller_xbox360 #BackgroundBaseLinesRight,
.controller_generic #BackgroundBaseLinesRight,
.controller_switch_pro #BackgroundBaseLinesRight,
.controller_android #BackgroundBaseLinesRight,
.controller_apple #BackgroundBaseLinesRight,
.controller_mobile_touch #BackgroundBaseLinesRight 
{
    background-image: url("file://{images}/library/controller/cropped_controller_config_lines_ps4.png");
    background-position: 190px -70px;
    transform: scalex( -1 );
}

.controller_mobile_touch #BackgroundBaseLinesRight 
{
    background-image: url("file://{images}/library/controller/cropped_controller_config_lines_ps4.png");
    background-position: 140px -84px;
    transform: scalex( -1 );
}

#BackgroundBaseLinesLeft 
{
    background-image: url("file://{images}/library/controller/cropped_controller_config_lines_steam.png");
    background-position: 210px -78px;
}


#BackgroundBaseLinesRight
{
	background-image: url("file://{images}/library/controller/cropped_controller_config_lines_steam.png");
    background-position: 230px -82px;
    transform: scalex( -1 );
}

#BackgroundLines.LeftTriggerSelected
{
	background-image: url("file://{images}/library/controller/cropped_controller_config_lines_1.png");
}

.controller_ps4 #BackgroundLines.LeftTriggerSelected,
.controller_ps3 #BackgroundLines.LeftTriggerSelected,
.controller_xboxone #BackgroundLines.LeftTriggerSelected,
.controller_xbox360 #BackgroundLines.LeftTriggerSelected,
.controller_generic #BackgroundLines.LeftTriggerSelected,
.controller_switch_pro #BackgroundLines.LeftTriggerSelected,
.controller_android #BackgroundLines.LeftTriggerSelected,
.controller_apple #BackgroundLines.LeftTriggerSelected
{
    background-position: -125px -73px;
}

.controller_mobile_touch #BackgroundLines.LeftTriggerSelected
{
    background-position: -166px -75px;
}

#BackgroundLines.LeftBumperSelected
{
	background-image: url("file://{images}/library/controller/cropped_controller_config_lines_2.png");
}

.controller_ps4 #BackgroundLines.LeftBumperSelected,
.controller_ps3 #BackgroundLines.LeftBumperSelected,
.controller_xboxone #BackgroundLines.LeftBumperSelected,
.controller_xbox360 #BackgroundLines.LeftBumperSelected,
.controller_generic #BackgroundLines.LeftBumperSelected,
.controller_switch_pro #BackgroundLines.LeftBumperSelected,
.controller_android #BackgroundLines.LeftBumperSelected,
.controller_apple #BackgroundLines.LeftBumperSelected
{
    background-position: -125px -73px;
}

.controller_mobile_touch #BackgroundLines.LeftBumperSelected 
{
    background-position: -230px -72px;
}

.controller_ps4 #BackgroundLines.LeftGripSelected, 
.controller_ps3 #BackgroundLines.LeftGripSelected,
.controller_xboxone #BackgroundLines.LeftGripSelected,
.controller_xbox360 #BackgroundLines.LeftGripSelected,
.controller_generic #BackgroundLines.LeftGripSelected,
.controller_switch_pro #BackgroundLines.LeftGripSelected,
.controller_android #BackgroundLines.LeftGripSelected,
.controller_apple #BackgroundLines.LeftGripSelected,
.controller_mobile_touch #BackgroundLines.LeftGripSelected 
{
    visibility: collapse;
}

.controller_ps4 #BackgroundLines.RightGripSelected,
.controller_ps3 #BackgroundLines.RightGripSelected,
.controller_xboxone #BackgroundLines.RightGripSelected,
.controller_xbox360 #BackgroundLines.RightGripSelected,
.controller_generic #BackgroundLines.RightGripSelected,
.controller_switch_pro #BackgroundLines.RightGripSelected,
.controller_android #BackgroundLines.RightGripSelected,
.controller_apple #BackgroundLines.RightGripSelected,
.controller_mobile_touch #BackgroundLines.RightGripSelected
{
    visibility: collapse;
}

.controller_apple #BackgroundLines.StartButtonSelected,
.controller_apple #BackgroundLines.BackButtonSelected
{
    visibility: collapse;
}


.controller_android #BackgroundLines.StartButtonSelected
{
    visibility: collapse;
}

#BackgroundLines.LeftGripSelected
{
	background-image: url("file://{images}/library/controller/cropped_controller_config_lines_3.png");
}

.controller_steamcontroller_headcrab #BackgroundLines.LeftGripSelected 
{
    background-position: 0px 20px;
    z-index: -10;
}

#BackgroundLines.LeftUpperGripSelected
{
	background-image: url("file://{images}/library/controller/cropped_controller_config_lines_3.png");
}

#BackgroundLines.RightTriggerSelected
{
	background-image: url("file://{images}/library/controller/cropped_controller_config_lines_5.png");
}

.controller_ps4 #BackgroundLines.RightTriggerSelected,
.controller_ps3 #BackgroundLines.RightTriggerSelected,
.controller_xboxone #BackgroundLines.RightTriggerSelected,
.controller_xbox360 #BackgroundLines.RightTriggerSelected,
.controller_generic #BackgroundLines.RightTriggerSelected,
.controller_switch_pro #BackgroundLines.RightTriggerSelected,
.controller_android #BackgroundLines.RightTriggerSelected,
.controller_apple #BackgroundLines.RightTriggerSelected
{
    background-position: -62px -70px;
}

.controller_mobile_touch #BackgroundLines.RightTriggerSelected
{
    background-position: -24px -75px;
}

#BackgroundLines.RightBumperSelected

{
	background-image: url("file://{images}/library/controller/cropped_controller_config_lines_6.png");
}

.controller_ps4 #BackgroundLines.RightBumperSelected,
.controller_ps3 #BackgroundLines.RightBumperSelected,
.controller_xboxone #BackgroundLines.RightBumperSelected,
.controller_xbox360 #BackgroundLines.RightBumperSelected,
.controller_generic #BackgroundLines.RightBumperSelected,
.controller_switch_pro #BackgroundLines.RightBumperSelected,
.controller_android #BackgroundLines.RightBumperSelected,
.controller_apple #BackgroundLines.RightBumperSelected
{
    background-position: -62px -70px;
}

.controller_mobile_touch #BackgroundLines.RightBumperSelected 
{
    background-position: 38px -72px;
}

#BackgroundLines.RightGripSelected
{
	background-image: url("file://{images}/library/controller/cropped_controller_config_lines_7.png");
}

.controller_steamcontroller_headcrab #BackgroundLines.RightGripSelected
{
    background-position: -100px 20px;
    z-index: -10;
}

#BackgroundLines.RightUpperGripSelected
{
	background-image: url("file://{images}/library/controller/cropped_controller_config_lines_7.png");
}

.controller_ps3 #BackgroundLines.GyroSelected
{
    visibility: collapse;
}

#BackgroundLines.GyroSelected
{
	background-image: url("file://{images}/library/controller/cropped_controller_config_lines_14.png");
}

.controller_mobile_touch #BackgroundLines.GyroSelected
{
    background-size: 75%;
    background-position: 210px 110px;
}

#BackgroundLines.SlotOneSelected
{
	background-image: url("file://{images}/library/controller/cropped_controller_config_lines_8.png");
}

.controller_ps4 #BackgroundLines.DPadSelected,
.controller_ps3 #BackgroundLines.DPadSelected,
.controller_xboxone #BackgroundLines.LeftJoystickSelected,
.controller_xbox360 #BackgroundLines.LeftJoystickSelected,
.controller_generic #BackgroundLines.LeftJoystickSelected,
.controller_switch_pro #BackgroundLines.LeftJoystickSelected,
.controller_android #BackgroundLines.DpadSelected,
.controller_apple #BackgroundLines.DPadSelected
{
	background-image: url("file://{images}/library/controller/cropped_controller_config_lines_8.png");
    background-position: -120px -73px;
}

.controller_mobile_touch #BackgroundLines.DPadSelected
{
    background-image: url("file://{images}/library/controller/cropped_controller_config_lines_8.png");
    background-position: -148px -104px;
}

#BackgroundLines.SlotTwoSelected
{
	background-image: url("file://{images}/library/controller/cropped_controller_config_lines_9.png");
}

#BackgroundLines.LeftJoystickSelected
{
	background-image: url("file://{images}/library/controller/cropped_controller_config_lines_9.png");
}

.controller_ps4 #BackgroundLines.LeftJoystickSelected,
.controller_ps3 #BackgroundLines.LeftJoystickSelected,
.controller_xboxone #BackgroundLines.DPadSelected,
.controller_xbox360 #BackgroundLines.DPadSelected,
.controller_generic #BackgroundLines.DPadSelected,
.controller_switch_pro #BackgroundLines.DPadSelected,
.controller_android #BackgroundLines.LeftJoystickSelected,
.controller_apple #BackgroundLines.LeftJoystickSelected
{
	background-image: url("file://{images}/library/controller/cropped_controller_config_lines_9.png");
    background-position: -120px -73px;
}

.controller_mobile_touch #BackgroundLines.LeftJoystickSelected 
{
	background-image: url("file://{images}/library/controller/cropped_controller_config_lines_9.png");
    background-position: -157px -43px;
}

#BackgroundLines.SlotThreeSelected
{
	background-image: url("file://{images}/library/controller/cropped_controller_config_lines_10.png");
}

.controller_ps4 #BackgroundLines.SlotThreeSelected,
.controller_ps3 #BackgroundLines.SlotThreeSelected,
.controller_xboxone #BackgroundLines.SlotThreeSelected,
.controller_xbox360 #BackgroundLines.SlotThreeSelected,
.controller_generic #BackgroundLines.SlotThreeSelected,
.controller_switch_pro #BackgroundLines.SlotThreeSelected,
.controller_android #BackgroundLines.SlotThreeSelected,
.controller_apple #BackgroundLines.SlotThreeSelected
{
    background-position: -62px -73px;
}

.controller_mobile_touch #BackgroundLines.SlotThreeSelected 
{
    background-position: -17px -43px;
}

#BackgroundLines.SlotABXYSelected
{
	background-image: url("file://{images}/library/controller/cropped_controller_config_lines_10.png");
}

.controller_ps4 #BackgroundLines.SlotABXYSelected,
.controller_ps3 #BackgroundLines.SlotABXYSelected,
.controller_xboxone #BackgroundLines.SlotABXYSelected,
.controller_xbox360 #BackgroundLines.SlotABXYSelected,
.controller_generic #BackgroundLines.SlotABXYSelected,
.controller_switch_pro #BackgroundLines.SlotABXYSelected,
.controller_android #BackgroundLines.SlotABXYSelected,
.controller_apple #BackgroundLines.SlotABXYSelected
{
	background-image: url("file://{images}/library/controller/cropped_controller_config_lines_11.png");
    background-position: -62px -73px;
}

.controller_mobile_touch #BackgroundLines.SlotABXYSelected 
{
	background-image: url("file://{images}/library/controller/cropped_controller_config_lines_11.png");
    background-position: -42px -102px;
}

#BackgroundLines.SlotFourSelected
{
	background-image: url("file://{images}/library/controller/cropped_controller_config_lines_11.png");
}

.controller_ps4 #BackgroundLines.SlotFourSelected,
.controller_ps3 #BackgroundLines.SlotFourSelected,
.controller_xboxone #BackgroundLines.SlotFourSelected,
.controller_xbox360 #BackgroundLines.SlotFourSelected,
.controller_generic #BackgroundLines.SlotFourSelected,
.controller_switch_pro #BackgroundLines.SlotFourSelected,
.controller_android #BackgroundLines.SlotFourSelected,
.controller_apple #BackgroundLines.SlotFourSelected,
.controller_mobile_touch #BackgroundLines.SlotFourSelected 
{
    background-position: -62px -73px;
}

#BackgroundLines.BackButtonSelected,
#BackgroundLines.CaptureButtonSelected
{
	background-image: url("file://{images}/library/controller/cropped_controller_config_lines_12.png");
}

.controller_ps4 #BackgroundLines.BackButtonSelected
{
    background-position: -175px -130px;
}

.controller_mobile_touch #BackgroundLines.BackButtonSelected 
{
    background-position: -118px -180px;
}

.controller_xboxone #BackgroundLines.BackButtonSelected
{
    background-position: 200px 20px;
    background-size: 75%;
}

.controller_ps3 #BackgroundLines.BackButtonSelected,
.controller_xbox360 #BackgroundLines.BackButtonSelected,
.controller_switch_pro #BackgroundLines.BackButtonSelected,
.controller_android #BackgroundLines.BackButtonSelected,
.controller_generic #BackgroundLines.BackButtonSelected
{
    background-position: 180px 15px;
    background-size: 75%;
}

.controller_switch_pro #BackgroundLines.BackButtonSelected
{
    background-position: 157px -40px;
    background-size: 75%;
}

.controller_steamcontroller_headcrab #BackgroundLines.BackButtonSelected
{
    background-position: -100px -205px;
    background-size: 110% 160%;
}

.controller_switch_pro #BackgroundLines.CaptureButtonSelected
{
    background-position: -15px -50px;
    background-size: 100%;
}

#BackgroundLines.StartButtonSelected
{
	background-image: url("file://{images}/library/controller/cropped_controller_config_lines_13.png");
}

.controller_ps4 #BackgroundLines.StartButtonSelected
{
    background-position: -7px -130px;
}

.controller_mobile_touch #BackgroundLines.StartButtonSelected 
{
    background-position: -66px -180px;
}

.controller_xboxone #BackgroundLines.StartButtonSelected
{
    background-position: 225px 20px;
    background-size: 75%;
}

.controller_steamcontroller_headcrab #BackgroundLines.StartButtonSelected
{
    background-position: -100px -205px;
    background-size: 110% 160%;
}

.controller_ps3 #BackgroundLines.StartButtonSelected,
.controller_xbox360 #BackgroundLines.StartButtonSelected,
.controller_switch_pro #BackgroundLines.StartButtonSelected,
.controller_generic #BackgroundLines.StartButtonSelected
{
    background-position: 245px 15px;
    background-size: 75%;
}

.controller_switch_pro #BackgroundLines.StartButtonSelected
{
    background-position: 265px -40px;
    background-size: 75%;
}



.HasMultipleActionSets #BackgroundController
{
	margin-top: 0px;	
}

.HasMultipleActionSets .BackgroundLines
{
	margin-top: 0px;	
}

#ModeContainer
{
	horizontal-align: center;
	width: 1737px;
	height: fit-children;
	flow-children: right;
	vertical-align: bottom;
	margin-bottom: 120px;
}

#PS4TrackpadContainer
{
	horizontal-align: center;
	vertical-align: top;
	margin-bottom: 0px;
	width: 256px;
	height: 128px;
	flow-children: down;
    visibility: collapse;
}

.controller_mobile_touch #PS4TrackpadContainer
{
    margin-top: 144px;
}

.controller_ps4 #PS4TrackpadContainer,
.controller_mobile_touch #PS4TrackpadContainer {
    visibility: visible;
}

#GyroModeContainer
{
	horizontal-align: center;
	vertical-align: bottom;
	margin-bottom: 0px;
	width: 256px;
	height: 128px;
	flow-children: down;
}

.controller_mobile_touch #GyroModeContainer {
    height: 94px;
}


.HasMultipleActionSets #GyroModeContainer
{
	margin-bottom: 85px;
    margin-right: 20px;
}

.BottomPanelVisible #GyroModeContainer, .BottomPanelVisible #PS4TrackpadContainer
{
	visibility: collapse;
}

.BottomPanelVisible #Gyro
{
    visibility: collapse;
}

.ModeWrapper
{
	border-radius: 16px;
	border-width: 2px;
	border-style: solid;
	border-color: #0f99bc44;
	background-color: gradient( radial, 50% 90%, 0px 0px, 1000% 100%, from( #102f4b ), to( #080f20aa ) );
	width: 417px;
	height: fit-children;
	vertical-align: bottom;
}

.ModeWrapper.TouchBumper
{
    height: 90px;
}

.ModeWrapper.Small
{
	background-color: #00000000;
	height: 128px;
	border: 0px;
	align: center center;
   	pre-transform-scale2d: 0.85;

	border-radius: 16px;
	border-width: 2px;
	border-style: solid;
	border-color: #0f99bc44;
}

.Small
{
	width: 100%;
	background-color: #00000000;
	height: 128px;
	border: 0px;
	align: center center;
   	pre-transform-scale2d: 0.85;
}

#PS4TrackpadHalfContainer
{
   flow-children: right;
   align: center;
}

.CenterTrackpad
{
	height: 96px;
}

.CenterPadSplit .CenterTrackpad 
{
    visibility: collapse;
}

.CenterTrackpadHalf
{
	height: 96px;
    width: 120px;
    visibility: collapse;
}

.CenterPadSplit .CenterTrackpadHalf 
{
    visibility: visible;
}


.SwapCenterPadMode
{
	width: 100%;
	height: 32px;
	border: 0px;
	align: center center;
   	pre-transform-scale2d: 0.85;
	wash-color: #00d4ffff;
    background-size: 48px 24px;
    background-repeat: no-repeat;
    background-position: 90% 50%;

	border-radius: 8px;
	border-width: 2px;
	border-style: solid;
	border-color: #0f99bc44;
}

.SwapCenterPadMode Label
{
	font-size: 16px;
	font-family: platformfont;
	color: #00ccff;
    align: left center;
    margin-left: 16px;
}

#SwapCenterPadModeToUnified
{
    visibility: collapse;
    background-image: url("file://{images}/library/controller/centerpad_unified.png");
}

.CenterPadSplit #SwapCenterPadModeToUnified
{
    visibility: visible;
}

#SwapCenterPadModeToSplit 
{
    visibility: visible;
    background-image: url("file://{images}/library/controller/centerpad_split.png");
}

.CenterPadSplit #SwapCenterPadModeToSplit
{
    visibility: collapse;
}

.SwapCenterPadMode:focus
{
	background-color: gradient( radial, 50% 90%, 0px 0px, 1000% 100%, from( #102f4b ), to( #080f20aa ) );
	border-color: white;
	
	animation-name: main-button-glow-movement;
	animation-duration: 1.7s;
	animation-delay: 0.0s;
	animation-timing-function: bigpicture-ease-in-out;
	animation-iteration-count: infinite;
	animation-direction: normal;
}

.Small:focus
{
	background-color: gradient( radial, 50% 90%, 0px 0px, 1000% 100%, from( #102f4b ), to( #080f20aa ) );
}

.ModeWrapper:focus
{
	background-color: gradient( radial, 50% 90%, 0px 0px, 1000% 100%, from( #102f4b ), to( #080f20aa ) );
	border-color: white;
	
	animation-name: main-button-glow-movement;
	animation-duration: 1.7s;
	animation-delay: 0.0s;
	animation-timing-function: bigpicture-ease-in-out;
	animation-iteration-count: infinite;
	animation-direction: normal;
}

.ModeWrapper.GapRight
{
	margin-right: 24px;
}

.ModeWrapper.SteamController,
.ModeWrapper.LJoyCenter
{
	visibility: visible;
}

.controller_ps4 .ModeWrapper.SteamController,
.controller_ps3 .ModeWrapper.SteamController,
.controller_xboxone .ModeWrapper.SteamController,
.controller_xbox360 .ModeWrapper.SteamController,
.controller_generic .ModeWrapper.SteamController,
.controller_switch_pro .ModeWrapper.SteamController,
.controller_android .ModeWrapper.SteamController,
.controller_apple .ModeWrapper.SteamController,
.controller_mobile_touch .ModeWrapper.SteamController,
.controller_xboxone .ModeWrapper.LJoyCenter,
.controller_xbox360 .ModeWrapper.LJoyCenter,
.controller_generic .ModeWrapper.LJoyCenter,
.controller_switch_pro .ModeWrapper.LJoyCenter,
.controller_ps4 .ModeWrapper.LJoyLeft,
.controller_ps3 .ModeWrapper.LJoyLeft,
.controller_android .ModeWrapper.LJoyLeft,
.controller_apple .ModeWrapper.LJoyLeft,
.controller_mobile_touch .ModeWrapper.LJoyLeft,
{
	visibility: collapse;
}


.controller_ps4 .ModeWrapper.TraditionalController,
.controller_ps4 .ModeWrapper.LJoyCenter,
.controller_ps3 .ModeWrapper.TraditionalController,
.controller_ps3 .ModeWrapper.LJoyCenter,
.controller_xboxone .ModeWrapper.TraditionalController,
.controller_xbox360 .ModeWrapper.TraditionalController,
.controller_generic .ModeWrapper.TraditionalController,
.controller_switch_pro .ModeWrapper.TraditionalController,
.controller_android .ModeWrapper.TraditionalController,
.controller_apple .ModeWrapper.TraditionalController,
.controller_xboxone .ModeWrapper.LJoyLeft,
.controller_xbox360 .ModeWrapper.LJoyLeft,
.controller_generic .ModeWrapper.LJoyLeft,
.controller_switch_pro .ModeWrapper.LJoyLeft,
.controller_android .ModeWrapper.LJoyCenter,
.controller_apple .ModeWrapper.LJoyCenter,
.controller_mobile_touch .ModeWrapper.TraditionalController,
.controller_mobile_touch .ModeWrapper.LJoyCenter,
{
	visibility: visible;
}

.ModeWrapper.TraditionalController,
.ModeWrapper.LJoyLeft
{
	visibility: collapse;
}



.ModeWrapper.Trigger
{
	width: bindingbuttonwidth;
	height: 96px;
	margin-bottom: 9px;
	background-color: none;
	border:0px;
}


.ModeWrapper.Trigger Label
{
	margin-top: 5px;
	margin-left: 20px;
	margin-right: 0px;
	width: 100%;
}

.ModeWrapper.Trigger.Right Label
{
	margin-top: 5px;
	margin-right: 20px;
	width: 100%;
	text-align: right;
}

ControllerBindingButton.BindingButton:focus, Button.Trigger:focus
{
	background-color: gradient( radial, 50% 90%, 0px 0px, 1000% 100%, from( #102f4b ), to( #080f20aa ) );
	border-color: white;
	border-radius: 8px;
	animation-name: main-button-glow-movement;
	animation-duration: 1.7s;
	animation-delay: 0.0s;
	animation-timing-function: bigpicture-ease-in-out;
	animation-iteration-count: infinite;
	animation-direction: normal;
}

ControllerBindingButton#LeftGripUpperButton.BindingButton,
ControllerBindingButton#RightGripUpperButton.BindingButton
{
    margin-top: 120px;
}

.ControllerMode
{   
	width: 100%;
	height: fit-children;
	min-height: 228px;
}

.ControllerMode.Trigger
{
	background-color: none;
}

Label.ModeTitle
{
	margin-left: 7px;
	margin-bottom: 10px;
	font-size: 30px;
	font-family: platformfont;
	font-weight: light;
	text-overflow: ellipsis;
	color: #00ccff;
	horizontal-align: left;
	visibility: collapse;
}

.TouchBumper Label.ModeTitle
{
    horizontal-align: left;
	margin-left: 12px;
	margin-right: 0px;
    font-size: 16px;
    margin-bottom: 4px;
    visibility: visible;
}

.TouchBumper.Right Label.ModeTitle
{
	margin-left: 0px;
	margin-right: 12px;
    horizontal-align: right;
}

.Small Label.ModeTitle
{
    horizontal-align: center;
	margin-left: 0px;
	margin-right: 0px;
    font-size: 22px;
    visibility: visible;
}

.NeedsTitle Label.ModeTitle
{
	visibility: visible;
}

#BindingSlotContainer
{
	flow-children: down;
	height: fit-children;
	vertical-align: top;
	margin-left: 5px;
	margin-top: 12px;
}

.Small ControllerBindingButton
{
    horizontal-align: left;
}

.Small #BindingSlotContainer
{
	width: 100%;
}

.HideMiddleClick .RequiresMiddleButton
{
	visibility: collapse;
}

#SourceModeBackground
{
	background-repeat: no-repeat no-repeat;
	width: 100%;
	height: 100%;
	opacity: 0.5;
	background-size: 75px 75px;
	background-position: 98% 5%;
}

#Gyro #SourceModeBackground
{
	background-image: url("file://{images}/library/controller/api/gyro.png");
	//background-color: #00000000;
	background-size: 60px 60px;
	background-position: 50% 50%;
}

#SourceModeLines
{
	background-repeat: no-repeat no-repeat;
	width: 100%;
	height: 100%;
	opacity: 0.8;
}

.BindingSlotStrip
{
	flow-children: down;
	height: fit-children;
	width: fit-children;
	margin-top: 23px;
}

.Right.BindingSlotStrip
{
	horizontal-align: right;
}

.BindingButton.Steam
{
    visibility: visible;
}

.controller_ps4 .BindingButton.Steam,
.controller_ps3 .BindingButton.Steam,
.controller_xboxone .BindingButton.Steam,
.controller_xbox360 .BindingButton.Steam,
.controller_generic .BindingButton.Steam,
.controller_switch_pro .BindingButton.Steam,
.controller_android .BindingButton.Steam,
.controller_apple .BindingButton.Steam,
.controller_apple #StartButton,
.controller_apple #BackButton,
.controller_mobile_touch .BindingButton.Steam,
{
    visibility: collapse;
}

.BindingButton.SteamV2,
.ModeWrapper.SteamV2
{
    visibility: collapse;
}

.controller_steamcontroller_headcrab .BindingButton.SteamV2,
.controller_steamcontroller_headcrab .ModeWrapper.SteamV2
{
    visibility: visible;
}


#StartButton.BindingButton ,
#BackButton.BindingButton ,
#LeftBumperButton.BindingButton ,
#RightBumperButton.BindingButton 
{
    visibility: collapse;
}

.cap_start_button #StartButton.BindingButton,
.cap_back_button #BackButton.BindingButton,
.cap_shoulder_buttons #LeftBumperButton.BindingButton,
.cap_shoulder_buttons #RightBumperButton.BindingButton
{
    visibility: visible;
}

.controller_steamcontroller_headcrab #LeftBumperButton.BindingButton,
.controller_steamcontroller_headcrab #RightBumperButton.BindingButton
{
    visibility: collapse;
}

.BindingButton.AlwaysOn
{
	width: bindingbuttonwidth;
	height: 56px;
	margin-top: 24px;
    background-image: url("file://{images}/library/controller/input_controller_glyph_always_on.png");
	background-repeat: no-repeat;
	background-size: 40px 40px;
	background-position: 10px 50%;
    background-color: none;
   
}

.controller_steamcontroller_headcrab .BindingButton.AlwaysOn,
.controller_switch_pro .BindingButton.AlwaysOn
{
	height: 48px;
	margin-top: 6px;
}

.controller_xboxone .BindingButton.AlwaysOn,
.controller_xbox360 .BindingButton.AlwaysOn,
.controller_ps4 .BindingButton.AlwaysOn,
.controller_generic .BindingButton.AlwaysOn,
.controller_android .BindingButton.AlwaysOn,
.controller_apple .BindingButton.AlwaysOn,
.controller_mobile_touch .BindingButton.AlwaysOn 
{
	margin-top: 24px;
}

#AlwaysOn.BindingButton Label
{
	margin-left: 72px;
}

.BindingButton.Playstation,
.BindingButton.Xbox
{
    visibility: collapse;
}

.controller_ps4 .BindingButton.Playstation,
.controller_ps3 .BindingButton.Playstation,
.controller_xboxone .BindingButton.Xbox,
.controller_xbox360 .BindingButton.Xbox,
.controller_generic .BindingButton.Xbox,
.controller_switch_pro .BindingButton.Xbox,
.controller_android .BindingButton.Xbox,
.controller_apple .BindingButton.Playstation,
.controller_mobile_touch .BindingButton.Playstation
{
    visibility: visible;
}

ControllerBindingButton.BindingButton
{
	width: bindingbuttonwidth;
	height: 100px;
	margin-bottom: 9px;
	background-color: none;
}

.controller_steamcontroller_headcrab ControllerBindingButton.BindingButton
{
	height: 72px;
	margin-bottom: 7px;
}


ControllerBindingButton.BindingButtonPropertiesMode
{
  padding-left: 8px;
	margin-bottom: 9px;
	border-width: 2px;
	border-style: solid;
	border-radius: 2px;
	border-color: none;
	text-align: right;

	background-color: simplebuttonsolid;
	width: 100%;
	height: 50px;
	background-repeat: no-repeat;
}

 .FieldWrapper ControllerBindingButton.BindingButtonPropertiesModeSmall
{
	height: 34px;
	margin-bottom: 2px;
}

 .FieldWrapper ControllerBindingButton.BindingButtonPropertiesModeSmall Label
{
    font-size: 22px;
}

 .FieldLabelSmall
{
	font-size: 20px;
	font-family: platformfont;
	color: #01caef;
	margin-bottom: 3px;
}

ControllerBindingButton.BindingButton Label
{
	margin-left: 20px;
	vertical-align: center;
	width: 100%;
	text-overflow: clip;
}

ControllerBindingButton.BindingButton.Right Label
{
	margin-left: 0px;
	margin-right: 20px;
	width: 100%;
	text-align: right;
}

ControllerBindingButton.BindingButton.Right
{
	background-position: 324px;
}

.Gradient0
{
	background-color: gradient( linear, 0% 0%, 0% 100%, from( #091731 ), to( #0b1b34 ) );
}

.Gradient1
{
	background-color: gradient( linear, 0% 0%, 0% 100%, from( #0b1c35 ), to( #0e253d ) );
}

.Gradient2
{
	background-color: gradient( linear, 0% 0%, 0% 100%, from( #0e263e ), to( #112e46 ) );
}

.Gradient3
{
	background-color: gradient( linear, 0% 0%, 0% 100%, from( #112f47 ), to( #13354c ) );
}

#CaptureButton.BindingButton
{
    visibility: collapse;
}

.controller_switch_pro #CaptureButton.BindingButton,
.controller_switch_pair #CaptureButton.BindingButton
{
    visibility: visible;
    background-size: 40px 40px;
    background-image: url("file://{images}/library/controller/input_controller_glyph_capture.png");
    background-repeat: no-repeat;
    background-position: 5px 50%;
    visibility: visible;
}

.controller_switch_pro #CaptureButton.BindingButton Label,
.controller_switch_pair #CaptureButton.BindingButton Label
{
	margin-left: 64px;
    visibility: visible;
}

#MacroContainer
{
    visibility: collapse;
}

.controller_mobile_touch #MacroContainer
{
    visibility: visible;
}

#MacroContainer
{
    flow-children: right;
}

#MacroContainerLeft
{
    flow-children: down;
}

#MacroContainerRight
{
    flow-children: down;
}

ControllerBindingButton.BindingButton.MacroButton
{
    width: 200px;
    height: 40px;
    margin: 3px;
}

ControllerBindingButton.BindingButton Label.MacroID
{
    background-image: url("file://{images}/library/controller/controller_macro.png");
    background-repeat: no-repeat;
    text-align: center;
    width: 38px;
    height: 30px;
    margin-left: 2px;
    margin-left: 2px;
}

#BackButton.BindingButton
{
	background-image: url("file://{images}/library/controller/input_controller_glyph_left_back.png");
	background-repeat: no-repeat;
	background-size: 80px 80px;
	background-position: 5px 50%;
}

.controller_switch_pro #BackButton.BindingButton,
.controller_switch_pair #BackButton.BindingButton
{
    background-size: 40px 40px;
	background-image: url("file://{images}/library/controller/input_controller_glyph_minus.png");
}

.controller_switch_pro #BackButton.BindingButton Label,
.controller_switch_pair #BackButton.BindingButton Label
{
	margin-left: 64px;
}

#BackButton.BindingButton Label
{
	margin-left: 96px;
}

#StartButton.BindingButton
{
	background-image: url("file://{images}/library/controller/input_controller_glyph_left_start.png");
	background-repeat: no-repeat;
	background-size: 80px 80px;
	background-position: 97% 50%;
}

.controller_switch_pro #StartButton.BindingButton,
.controller_switch_pair #StartButton.BindingButton
{
    background-size: 40px 40px;
	background-image: url("file://{images}/library/controller/input_controller_glyph_plus.png");
}

.controller_switch_pro #StartButton.BindingButton Label,
.controller_switch_pair #StartButton.BindingButton Label
{
	margin-right: 64px;
}

#StartButton.BindingButton Label
{
	margin-right: 105px;
}

.BindingSlotStrip
{
	transition-property: transform, opacity;
	transition-duration: 0.2s;
	transition-timing-function: bigpicture-ease-in-out;
}

.BottomPanelVisible .Right.BindingSlotStrip
{
	transform: translatex( bindingbuttonwidth );
	opacity: 0.0;
}

.BottomPanelVisible .BindingSlotStrip
{
	transform: translatex( negbindingbuttonwidth );
	opacity: 0.0;
}

.BottomPanelVisible .BackgroundLines
{
	opacity: 0.0;
}

#TopHalfContainer #BackgroundController
{
	transition-property: opacity, transform, pre-transform-scale2d;
	transition-duration: 0.2s;
	transition-timing-function: bigpicture-ease-in-out;
}

.BottomPanelVisible #TopHalfContainer #BackgroundController
{
	transform: translatey( -115px );
	pre-transform-scale2d: 0.75;
}

.BottomPanelVisible.controller_mobile_touch #TopHalfContainer #BackgroundController {
    pre-transform-scale2d: 0;
}

ControllerPropertiesMode, ControllerPropertiesActivator
{
	transition-property: transform;
	transition-duration: 0.2s;
	transition-timing-function: bigpicture-ease-in-out;

	transform: translatey( propertiesheight );
}

.BottomPanelVisible ControllerPropertiesMode, ControllerPropertiesActivator
{
	transform: translatey( 0px );
}

.controller_xboxone #GyroModeContainer,
.controller_xbox360 #GyroModeContainer,
.controller_generic #GyroModeContainer,
.controller_apple #GyroModeContainer,
.controller_ps3 #GyroModeContainer
{
    visibility: collapse;
}

.controller_ps4 #GyroModeContainer,
.controller_mobile_touch #GyroModeContainer 
{
    visibility: visible;
}

/* Contrainer is a typo but fixing typo breaks layout :( */
.BottomPanelVisible #ModeContainer, #GyroModeContrainer
{
	transition-duration: 0.1s;
	opacity: 0.0;
}


.ControllerMode ControllerBindingButton
{
	horizontal-align: left;
	margin-left: 6px;
	margin-bottom: 8px;
    height: 44px;
	background-image: url("file://{images}/library/controller/input_controller_glyph_left_start.png");
	background-repeat: no-repeat;
	background-size: 48px 48px;
	visibility: visible;
}

.TouchBumper.Right ControllerBindingButton
{
    horizontal-align: right;
	margin-right: 6px;
}

.ControllerMode ControllerBindingButton Label
{
	margin-left: 55px;
	vertical-align: center;
}

.ControllerMode ControllerBindingButton.Unassigned
{
	visibility: collapse;
}

ControllerSourceModeTrigger ControllerBindingButton
{
	height: 50%;
	width: 100%;
}

ControllerSourceModeTrigger.ControllerMode ControllerBindingButton
{
	background-image: none;
	background-size: 0px 0px;
}

ControllerSourceModeTrigger #BindingSlotContainer,
.ControllerMode .TouchBumper.ControllerBindingButton 
{
	flow-children: down;
	width: 100%;
	height: 100%;
	vertical-align: top;
	margin-top: 0px;
}

.TouchBumper.Right #BindingSlotContainer
{
    horizontal-align: right;
}

.FieldWrapper.SteamV2,
.FieldWrapper.DropDown.SteamV2,
{
    visibility: collapse;
}

.FieldLabel.SteamV2
{
    visibility: collapse;
}

.controller_steamcontroller_headcrab .FieldLabel.SteamV2 {
    visibility: visible;
}


#EnableAnalog_joystick_move,
#MaxAnalog_joystick_move,
#MinAnalog_joystick_move
{
    visibility: collapse;
}

.controller_steamcontroller_headcrab #EnableAnalog_joystick_move,
.controller_steamcontroller_headcrab #MaxAnalog_joystick_move,
.controller_steamcontroller_headcrab #MinAnalog_joystick_move
{
    visibility: visible;
}

.controller_steamcontroller_headcrab .FieldWrapper.SteamV2 {
    visibility: visible;
}

.ABXYLabels,
.controller_ps3 .ABXYLabelsPS4,
.controller_ps4 .ABXYLabelsPS4,
.controller_switch_pro .ABXYLabelsNintendo,
.controller_switch_pair .ABXYLabelsNintendo,
.controller_switch_single .ABXYLabelsNintendo

{ 
    visibility: visible;
}

.ABXYLabelsPS4,
.ABXYLabelsNintendo,
.controller_ps3 .ABXYLabels,
.controller_ps4 .ABXYLabels,
.controller_switch_pro .ABXYLabels,
.controller_switch_pair .ABXYLabels,
.controller_switch_single .ABXYLabels

{
    visibility: collapse;
}


ControllerSourceModeABXY.ControllerMode ControllerBindingButton
{
	height: 48px;
	margin-bottom: 4px;
}


.controller_ps4 #ModeContainer #ABXYButtonA,
.controller_ps3 #ModeContainer #ABXYButtonA
{
    background-image: url("file://{images}/library/controller/api/ps4_button_x.png");
}

.controller_switch_pro #ModeContainer #ABXYButtonA,
.controller_switchjoyconpair #ModeContainer #ABXYButtonA,
.controller_switchjoyconsingle #ModeContainer #ABXYButtonA
{
    background-image: url("file://{images}/library/controller/api/switch_button_b.png");
}

#ModeContainer #ABXYButtonA
{
	background-image: url("file://{images}/library/controller/api/button_a.png");
}
#ModeContainer #ABXYButtonA Label
{
	color: #42ff00;
	margin-left: 65px;
}

.controller_ps3 #ModeContainer #ABXYButtonA Label,
.controller_ps4 #ModeContainer #ABXYButtonA Label
{
	color: #a2b9efee;
}

.controller_switch_pro #ModeContainer #ABXYButtonB,
.controller_switchjoyconpair #ModeContainer #ABXYButtonB,
.controller_switchjoyconsingle #ModeContainer #ABXYButtonB
{
    background-image: url("file://{images}/library/controller/api/switch_button_a.png");
}

.controller_ps4 #ModeContainer #ABXYButtonB,
.controller_ps3 #ModeContainer #ABXYButtonB
{
    background-image: url("file://{images}/library/controller/api/ps4_button_circle.png");
}

#ModeContainer #ABXYButtonB
{
	background-image: url("file://{images}/library/controller/api/button_b.png");
}
#ModeContainer #ABXYButtonB Label
{
	color: #ff0000;
	margin-left: 65px;
}

.controller_ps3 #ModeContainer #ABXYButtonB Label,
.controller_ps4 #ModeContainer #ABXYButtonB Label
{
	color: #f87382ee;
}


.controller_ps4 #ModeContainer #ABXYButtonX,
.controller_ps3 #ModeContainer #ABXYButtonX
{
    background-image: url("file://{images}/library/controller/api/ps4_button_square.png");
}

.controller_switch_pro #ModeContainer #ABXYButtonX,
.controller_switchjoyconpair #ModeContainer #ABXYButtonX,
.controller_switchjoyconsingle #ModeContainer #ABXYButtonX
{
    background-image: url("file://{images}/library/controller/api/switch_button_y.png");
}

#ModeContainer #ABXYButtonX
{
	background-image: url("file://{images}/library/controller/api/button_x.png");
}
#ModeContainer #ABXYButtonX Label
{
	color: #01c4f5;
	margin-left: 65px;
}

.controller_ps3 #ModeContainer #ABXYButtonX Label,
.controller_ps4 #ModeContainer #ABXYButtonX Label
{
	color: #eba1e6ee;
}

.controller_ps4 #ModeContainer #ABXYButtonY,
.controller_ps3 #ModeContainer #ABXYButtonY
{
    background-image: url("file://{images}/library/controller/api/ps4_button_triangle.png");
}

.controller_switch_pro #ModeContainer #ABXYButtonY,
.controller_switchjoyconpair #ModeContainer #ABXYButtonY,
.controller_switchjoyconsingle #ModeContainer #ABXYButtonY
{
    background-image: url("file://{images}/library/controller/api/switch_button_x.png");
}

#ModeContainer #ABXYButtonY
{
	background-image: url("file://{images}/library/controller/api/button_y.png");
}
#ModeContainer #ABXYButtonY Label
{
	color: #ffde00;
	margin-left: 65px;
}

.controller_ps3 #ModeContainer #ABXYButtonY Label,
.controller_ps4 #ModeContainer #ABXYButtonY Label
{
	color: #30ffffee;
}

ControllerSourceModeDpad.ControllerMode ControllerBindingButton
{
	background-size: 36px 36px;
	margin-bottom: 6px;
}

#ModeContainer #EdgeBindingJoystick
{
	background-image: url("file://{images}/library/controller/api/pad_r_outer_ring.png");
}


#ModeContainer #JoystickClick
{
	background-image: url("file://{images}/library/controller/api/stick_click.png");
}


ControllerSourceModeJoystickCamera.ControllerMode ControllerBindingButton
{
    height: 48px;
	margin-bottom: 6px;
}

ControllerSourceModeJoystickMove.ControllerMode ControllerBindingButton
{
    height: 48px;
	margin-bottom: 6px;
}

ControllerSourceModeJoystickMouse.ControllerMode ControllerBindingButton
{
    height: 48px;
	margin-bottom: 6px;
}

.Small.ControllerMode ControllerBindingButton
{
    height: 24px;
	margin-bottom: 6px;
}

.Small ControllerSourceModeAbsoluteMouse.ControllerMode ControllerBindingButton
{
    height: 24px;
}

.Small ControllerSourceModeMouseJoystick.ControllerMode ControllerBindingButton
{
    height: 24px;
}

.CenterTrackpad .ControllerMode ControllerBindingButton, .CenterTrackpadHalf .ControllerMode ControllerBindingButton
{
    visibility: collapse;
}

#GyroModeContainer #GyroLeanLeft
{
	background-image: url("file://{images}/library/controller/api/gyro_lean_left.png");
}

#GyroModeContainer #GyroLeanRight
{
	background-image: url("file://{images}/library/controller/api/gyro_lean_right.png");
}

#ModeContainer #ScrollWheelClockwise
{
	background-image: url("file://{images}/library/controller/api/scroll_wheel_clock.png");
}

#ModeContainer #ScrollWheelCounterClockwise
{
	background-image: url("file://{images}/library/controller/api/scroll_wheel_counter_clock.png");
}

#ModeContainer #ScrollWheelClick
{
	background-image: url("file://{images}/library/controller/api/scroll_wheel_click.png");
}

#ModeContainer #MouseLeftClick
{
	background-image: url("file://{images}/library/controller/api/mouse_left.png");
}

#ModeContainer #MouseRightClick
{
	background-image: url("file://{images}/library/controller/api/mouse_right.png");
}

#ModeContainer #MouseWheelUp
{
	background-image: url("file://{images}/library/controller/api/mouse_wheel_up.png");
}

#ModeContainer #MouseWheelDown
{
	background-image: url("file://{images}/library/controller/api/mouse_wheel_down.png");
}

#ModeContainer #MouseWheelClick
{
	background-image: url("file://{images}/library/controller/api/mouse_wheel_click.png");
}


#ModeContainer #MouseRegionClick
{
	background-image: url("file://{images}/library/controller/api/click_once.png");
}

#ModeContainer #DPadLeft
{
	background-image: url("file://{images}/library/controller/api/virtual_dpad_w.png");
}
#ModeContainer #DPadRight
{
	background-image: url("file://{images}/library/controller/api/virtual_dpad_e.png");
}
#ModeContainer #DPadUp
{
	background-image: url("file://{images}/library/controller/api/virtual_dpad_n.png");
}
#ModeContainer #DPadDown
{
	background-image: url("file://{images}/library/controller/api/virtual_dpad_s.png");
}
#ModeContainer #DpadClick
{
	background-image: url("file://{images}/library/controller/api/pad_l_click.png");
}

ControllerSourceModeAbsoluteMouse.ControllerMode ControllerBindingButton
{
	height: 48px;
	margin-bottom: 8px;
}

#ModeContainer #ButtonClick
{
	background-image: url("file://{images}/library/controller/api/click_once.png");
}

#ModeContainer #ButtonTouch
{
	background-image: url("file://{images}/library/controller/api/touch.png");
}


#ModeContainer #AbsMouseClick
{
	background-image: url("file://{images}/library/controller/api/click_once.png");
}

#ModeContainer #DoubleTap
{
	background-image: url("file://{images}/library/controller/api/click_twice.png");
}


ControllerSourceModeAbsoluteMouse ControllerBindingButton
{
	horizontal-align: right;
	margin-bottom: 6px;
}

ControllerSourceModeRelativeMouse #RelMouseClick
{
	horizontal-align: right;
	margin-right: 12px;
	transform: translatey( 175px );
}

ControllerSourceModeScrollWheel ControllerBindingButton
{
	horizontal-align: right;
	margin-bottom: 6px;
}

ControllerSourceModeTrigger
{
	width: bindingbuttonwidth;
	height: 96px;
	background-repeat: no-repeat;
}

Slider:focus
{
	border-width: 3px;
	border-style: solid;
	border-radius: 3px;
	border-color: white;

	background-color: simplebuttonsolid;
}

ControllerBindingButton.Glyph
{
	width: 72px;
	height: 72px;
	background-repeat: no-repeat;
}

ControllerBindingButton.Glyph.KeyboardShape, ControllerBindingButton.Glyph.UnboundShape, ControllerBindingButton.Glyph.MouseShape, ControllerBindingButton.Glyph.ControllerActionShape
{
	background-image: url("file://{images}/library/controller/glyph_input_wrapper_keyboard_offset.png");
}

ControllerBindingButton.Glyph.KeyboardShape #BindingShape, ControllerBindingButton.Glyph.UnboundShape #BindingShape, ControllerBindingButton.Glyph.MouseShape #BindingShape, ControllerBindingButton.Glyph.ControllerActionShape #BindingShape
{
	width: 100%;
	height: 100%;

	background-image: url("file://{images}/library/controller/glyph_input_wrapper_keyboard.png");
	background-position: 3px 3px;
	background-repeat: no-repeat;
}

ControllerBindingButton.Glyph.GameActionShape
{
	width: 72px;
	height: 72px;
	background-repeat: no-repeat;
}
ControllerBindingButton.Glyph.GameActionShape
{
	background-image: url("file://{images}/library/controller/glyph_input_wrapper_keyboard_offset.png");
}
ControllerBindingButton.Glyph.GameActionShape #BindingShape
{
	width: 100%;
	height: 100%;
}
ControllerBindingButton.Glyph.GameActionShape Label
{
	font-weight: bold;
	text-align: center;
}

ControllerBindingButton.Glyph.GamepadShape
{
	background-image: url("file://{images}/library/controller/glyph_input_wrapper_gamepad_offset.png");
}

ControllerBindingButton.Glyph.GamepadShape #BindingShape
{
	width: 100%;
	height: 100%;

	background-image: url("file://{images}/library/controller/glyph_input_wrapper_gamepad.png");
	background-position: 3px 3px;
	background-repeat: no-repeat;
}

ControllerBindingButton Label
{
	font-size: 24px;
	font-family: platformfont;
	font-weight: light;
	text-overflow: ellipsis;
	color: #00ccff;
}

#Gyro ControllerBindingButton Label
{
	font-size: 22px;
	font-family: platformfont;
	font-weight: light;
	text-overflow: ellipsis;
	color: #00ccff;
}

ControllerBindingButton.Glyph Label
{
	background-repeat: no-repeat;
	background-size: contain;
	background-position: -1px 0px;
}

ControllerBindingButton.Glyph.ShortName Label
{
	margin-left: -1px;
	margin-top: -1px;
	font-size: 20px;
	horizontal-align: center;
	vertical-align: center;
}

ControllerBindingButton.Glyph.ReturnBindingGlyph #BindingLabel
{
	width: 100%;
	height: 100%;
	background-image: url("file://{images}/library/controller/glyph_input_kb_return.png");
}

ControllerBindingButton.Glyph.BackspaceBindingGlyph #BindingLabel
{
	width: 100%;
	height: 100%;
	background-image: url("file://{images}/library/controller/glyph_input_kb_backspace.png");
}

ControllerBindingButton.Glyph.TabBindingGlyph #BindingLabel
{
	width: 100%;
	height: 100%;
	background-image: url("file://{images}/library/controller/glyph_input_kb_tab.png");
}

ControllerBindingButton.Glyph.SpaceBindingGlyph #BindingLabel
{
	width: 100%;
	height: 100%;
	background-image: url("file://{images}/library/controller/glyph_input_kb_space.png");
}

ControllerBindingButton.Glyph.RightArrowBindingGlyph #BindingLabel
{
	width: 100%;
	height: 100%;
	background-image: url("file://{images}/library/controller/glyph_input_kb_right.png");
}

ControllerBindingButton.Glyph.LeftArrowBindingGlyph #BindingLabel
{
	width: 100%;
	height: 100%;
	background-image: url("file://{images}/library/controller/glyph_input_kb_left.png");
}

ControllerBindingButton.Glyph.UpArrowBindingGlyph #BindingLabel
{
	width: 100%;
	height: 100%;
	background-image: url("file://{images}/library/controller/glyph_input_kb_up.png");
}

ControllerBindingButton.Glyph.DownArrowBindingGlyph #BindingLabel
{
	width: 100%;
	height: 100%;
	background-image: url("file://{images}/library/controller/glyph_input_kb_down.png");
}

ControllerBindingButton.Glyph.PrintBindingGlyph #BindingLabel
{
	width: 100%;
	height: 100%;
	background-image: url("file://{images}/library/controller/glyph_input_kb_print.png");
}

ControllerBindingButton.Glyph.ScrollLockBindingGlyph #BindingLabel
{
	width: 100%;
	height: 100%;
	background-image: url("file://{images}/library/controller/glyph_input_kb_scroll_lock.png");
}

ControllerBindingButton.Glyph.HomeBindingGlyph #BindingLabel
{
	width: 100%;
	height: 100%;
	background-image: url("file://{images}/library/controller/glyph_input_kb_home.png");
}

ControllerBindingButton.Glyph.MultiBindingGlyph #BindingLabel
{
	width: 100%;
	height: 100%;
	background-image: url("file://{images}/library/controller/glyph_input_multi.png");
}


Slider:Selected
{
	//temporary until we decide how to visually handle focus
	background-color: gradient( linear, -0% 0%, 0% 100%, from( #f0f0f0 ), to( #c2c2c2 ) );
	box-shadow: box_shadow_on_color -2.5px -2.5px 8px 5px;
	border: 2px solid #fdfefef0;
	border-radius: 2px;
    border-style: none;
}


#ModeProperties, #ChooseBinding, #ActivatorProperties
{
	width: 100%;
	height: propertiesheight;
	vertical-align: bottom;
	background-color: #13283c;
	opacity: 0.0;
}

#ModeProperties:descendantfocus, #ChooseBinding:descendantfocus, #ActivatorProperties:descendantfocus
{
	opacity: 1.0;
}

#TabBackground
{
	width: 100%;
	height: tabheight;
	padding-top: 10px;
	background-color: gradient( linear, 0% 0%, 100% 0%, from( #0e354dff ), color-stop( 0.50, #0d1f35ff ), to( #0e354dff ) );
}

#PropertiesBackground
{
	flow-children: down;
}

.ColumnContainer
{
	width: 1676px;
	margin-top: 10px;
	horizontal-align: center;
	flow-children: right;
}

.HasActivators .ColumnContainer
{
	margin-top: 64px;
}


.Column
{
	flow-children: down;
	width: fieldwidth;
  height: 500px;
}

#MiddleColumn
{
	margin-left: 70px;
	margin-right: 70px;
}

.ColumnMouse
{
	flow-children: down;
	width: fieldwidth;
  height: 500px;
}


.FieldWrapper
{
	width: fieldwidth;
	height: fit-children;
	flow-children: down;
	margin-bottom: 15px;
}

.FieldLabel
{
    font-size: 28px;
	font-family: platformfont;
	color: #01caef;
	margin-bottom: 5px;
}

.Polish .FieldLabel
{
    font-size: 24px;
	font-family: platformfont;
	color: #01caef;
	margin-bottom: 5px;
}

.FieldLabelDark
{
	font-size: 28px;
	font-family: platformfont;
	color: #007c92;
	margin-bottom: 5px;
}

.FieldWrapper.TabHeader
{
	margin-top: 10px;
	margin-bottom: 30px;
}

.FieldWrapper DropDown
{
	width: 100%;
    height: 46px;
	padding-left: 8px;
	border-width: 1px;
	border-style: solid;
	border-radius: 1px;
}

.FieldWrapper Slider
{
	width: 100%;
	height: 20px;
	margin-top: 4px;
	margin-bottom: 0px;
}

.LayerDefault
{
    wash-color: #11000088;
}

.NoneMode
{
	visibility: collapse;
}

.ModeNoneVisible .NoneMode
{
	visibility: visible;
}

.AdvancedPropertiesVisible #TabBackground
{
	visibility: collapse;
}

.AdvancedPropertiesVisible .Column
{
	margin-top: 10px;
}

.FieldWrapper Button, .FieldWrapper ControllerBindingButton
{
	padding-left: 8px;
	border-width: 5px;
	border-style: solid;
	border-radius: 2px;
	border-color: none;

	background-color: simplebuttonsolid;

	transition-property: background-color, box-shadow;
	pre-transform-scale2d: 1.0;
	box-shadow: box_shadow_off_color -4.5px -4.5px 16px 9px;
	transition-duration: 0.23s;

	width: 100%;
	height: 46px;
}

.Column ControllerBindingButton:focus Label
{
	color: black;
}

.Column ControllerBindingButton:focus #BindingShape
{
	background-color: white;
}

#BindingShape
{
    border-radius: 10px;
}

.FieldWrapper Button:focus, .FieldWrapper ControllerBindingButton:focus
{
	background-color: gradient(linear, 0% 0%, 100% 0%, from(#f2f2f2), to(#bdbdbd) );
	border-color: white;

	animation-name: main-button-glow-movement;
	animation-duration: 1.7s;
	animation-delay: 0.0s;
	animation-timing-function: bigpicture-ease-in-out;
	animation-iteration-count: infinite;
	animation-direction: normal;
	z-index: 100;
}

#ModeDropDownDropDownMenu
{
	max-height: 350px;
}

.FieldWrapper Button:hover, .FieldWrapper ControllerBindingButton:hover, .FieldWrapper DropDown:hover
{
	box-shadow: box_shadow_on_color -4.5px -4.5px 16px 9px;
	z-index: 100;
}

.FieldWrapper Button:disabled:hover, .FieldWrapper ControllerBindingButton:disabled:hover
{
	box-shadow: box_shadow_off_color -4.5px -4.5px 16px 9px;
}

.FieldWrapper Button Label, .FieldWrapper ControllerBindingButton Label
{
	color: white;
	font-size: 24px;
	font-family: platformfont;
	border-width: 0px;
	vertical-align: center;
}

.FieldWrapper Button:focus Label, .FieldWrapper ControllerBindingButton:focus Label
{
	color: black;
}

.PropertyColumn
{
	height: 100%;
	padding-top: 10px;
	width: fit-children;
	flow-children: down;
}

#RightPropertyColumn.PropertyColumn
{
	horizontal-align: right;
}

.PropertiesContainer
{
	width: 100%;
	opacity: 0.0;
}

.PropertiesContainer.PropertyChildVisible
{
	opacity: 1.0;
}

#CenterPanelColumn
{
	width: fit-children;
	height: fit-children;

	horizontal-align: center;
}

.GraphLabelSide {
	transform-origin: 0% 0% parent-relative;
	transform: rotatez( 90deg ) translatex( 100% ) translatey( -8% );
	font-size: 20px;
	font-family: platformfont;
	color: #01caef;
    margin-left: 10px;
	margin-bottom: 16px;
    horizontal-align: center;
    vertical-align: bottom;
}

.GraphLabelBottom
{
	font-size: 20px;
	font-family: platformfont;
	color: #01caef;
    margin-left: 32px;
	margin-bottom: 56px;
    horizontal-align: center;
    vertical-align: bottom;
}

.CenterGraph
{
    flow-children: right;
	width: 500px;
	height: 408px;
	background-repeat: no-repeat;
    z-index: 40;
    margin-left: 48px;
  	margin-bottom: 70px;
    border: 2px solid #102f4b;
    border-radius: 8px;
    background-color: gradient( linear, 0% 0%, 100% 0%, color-stop( 0, #0e86ab00 ), 
    color-stop( .1, #0e86ab00 ), color-stop( .1, #102f4b ), color-stop( .1025, #102f4b ), color-stop( .1025, #0e86ab00 ),
    color-stop( .2, #0e86ab00 ), color-stop( .2, #102f4b ), color-stop( .2025, #102f4b ), color-stop( .2025, #0e86ab00 ),
    color-stop( .3, #0e86ab00 ), color-stop( .3, #102f4b ), color-stop( .3025, #102f4b ), color-stop( .3025, #0e86ab00 ),
    color-stop( .4, #0e86ab00 ), color-stop( .4, #102f4b ), color-stop( .4025, #102f4b ), color-stop( .4025, #0e86ab00 ),
    color-stop( .5, #0e86ab00 ), color-stop( .5, #102f4b ), color-stop( .5025, #102f4b ), color-stop( .5025, #0e86ab00 ),
    color-stop( .6, #0e86ab00 ), color-stop( .6, #102f4b ), color-stop( .6025, #102f4b ), color-stop( .6025, #0e86ab00 ),
    color-stop( .7, #0e86ab00 ), color-stop( .7, #102f4b ), color-stop( .7025, #102f4b ), color-stop( .7025, #0e86ab00 ),
    color-stop( .8, #0e86ab00 ), color-stop( .8, #102f4b ), color-stop( .8025, #102f4b ), color-stop( .8025, #0e86ab00 ),
    color-stop( .9, #0e86ab00 ), color-stop( .9, #102f4b ), color-stop( .9025, #102f4b ), color-stop( .9025, #0e86ab00 ) ),
    gradient( linear, 0% 0%, 0% 100%, color-stop( 0, #0e86ab00 ), 
    color-stop( .1, #0e86ab00 ), color-stop( .1, #102f4b ), color-stop( .1025, #102f4b ), color-stop( .1025, #0e86ab00 ),
    color-stop( .2, #0e86ab00 ), color-stop( .2, #102f4b ), color-stop( .2025, #102f4b ), color-stop( .2025, #0e86ab00 ),
    color-stop( .3, #0e86ab00 ), color-stop( .3, #102f4b ), color-stop( .3025, #102f4b ), color-stop( .3025, #0e86ab00 ),
    color-stop( .4, #0e86ab00 ), color-stop( .4, #102f4b ), color-stop( .4025, #102f4b ), color-stop( .4025, #0e86ab00 ),
    color-stop( .5, #0e86ab00 ), color-stop( .5, #102f4b ), color-stop( .5025, #102f4b ), color-stop( .5025, #0e86ab00 ),
    color-stop( .6, #0e86ab00 ), color-stop( .6, #102f4b ), color-stop( .6025, #102f4b ), color-stop( .6025, #0e86ab00 ),
    color-stop( .7, #0e86ab00 ), color-stop( .7, #102f4b ), color-stop( .7025, #102f4b ), color-stop( .7025, #0e86ab00 ),
    color-stop( .8, #0e86ab00 ), color-stop( .8, #102f4b ), color-stop( .8025, #102f4b ), color-stop( .8025, #0e86ab00 ),
    color-stop( .9, #0e86ab00 ), color-stop( .9, #102f4b ), color-stop( .9025, #102f4b ), color-stop( .9025, #0e86ab00 ) );
}

.GraphBar
{
	height: 400px;
    width: 24px;
    border-radius: 8px;
    border: 1px solid #102f4b;
	horizontal-align: left;
    vertical-align: bottom;
    margin-left: 0px;
 
    z-index: 40;
   	opacity: 1.0;
    background-color: #00ccffff;
	visibility: visible;
	background-position: center center;
}

.CenterImageRingOuter
{
	width: 400px;
	height: 400px;
    border-radius: 100%;
    border: 4px solid #00ccffaa inset;
	horizontal-align: center;
    vertical-align: center;
  	margin-bottom: 47px;
    margin-left: 12px;
    z-index: 5;
   	opacity: 1.0;
    background-color: gradient( radial, 50% 50%, 0px 0px, 100% 100%, from ( #040910 ), color-stop( 0.86, blue ) );

}

.CenterImageRingInner
{
    height: 400px;
    width: 400px;
	background-repeat: no-repeat;
    border-radius: 100%;
    border: 2px solid blue inset;
	horizontal-align: center;
    vertical-align: center;
  	margin-bottom: 47px;
    margin-left: 12px;
    z-index: 10;
   	opacity: 1.0;
    background-color: black;
} 

.CenterImageRingInnerCrossVertical
{
    height: 400px;
    width: 400px;
	background-repeat: no-repeat;
    border-radius: 75%;
    border: 2px #11111111;
	horizontal-align: center;
    vertical-align: center;
  	margin-bottom: 47px;
    margin-left: 12px;
    z-index: 11;
   	opacity: 0.60;
    background-color: black;
} 

.CenterImageRingInnerCrossHorizontal
{
    height: 400px;
    width: 400px;
	background-repeat: no-repeat;
    border-radius: 75%;
    border: 2px #11111111;
	horizontal-align: center;
    vertical-align: center;
  	margin-bottom: 47px;
    margin-left: 12px;
    z-index: 11;
   	opacity: 0.60;
    background-color: black;
} 

.CenterImageRingAntiBuffer
{
    height: 400px;
    width: 400px;
	background-repeat: no-repeat;
    border-radius: 100%;
    border: 4px solid blue inset;
	horizontal-align: center;
    vertical-align: center;
  	margin-bottom: 47px;
    margin-left: 12px;
    z-index: 15;
   	opacity: 0.60;
    background-color: black;
} 

.CenterImageRingAnti
{
    height: 400px;
    width: 400px;
	background-repeat: no-repeat;
    border-radius: 100%;
    border: 4px solid blue inset;
	horizontal-align: center;
    vertical-align: center;
  	margin-bottom: 47px;
    margin-left: 12px;
    z-index: 12;
   	opacity: 0.30;
    background-color: yellow;
} 

@keyframes 'visualization_ring_anim'
{
	0%
	{
		opacity: 0.40;
	}

	50%
	{
		opacity: 0.50;
	}

	100%
	{
		opacity: 0.40;
	}
}

.CenterImageRingEdge
{
    height: 400px;
    width: 400px;
	background-repeat: no-repeat;
    border-radius: 100%;
    border: 4px solid blue inset;
	horizontal-align: center;
    vertical-align: center;
  	margin-bottom: 47px;
    margin-left: 12px;
    z-index: 18;
   	opacity: 0.40;
    background-color: white;

	animation-name: visualization_ring_anim;
	animation-duration: 3.0s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
} 



.CenterImage
{
	width: 500px;
	height: 500px;
	background-repeat: no-repeat;
}

.CenterImageDpadPanel.CenterImage
{
	background-image: url("file://{images}/library/controller/controller_config_inspector_dpad_bg.png");
}

#CenterImageJoystick.CenterImage
{
	height: 406px;
    width: 406px;
	background-repeat: no-repeat;
    border-radius: 100%;
    border: 6px solid #00ccff inset;
	horizontal-align: center;
    vertical-align: center;
  	margin-bottom: 47px;
    margin-left: 12px;
    z-index: 0;
   	opacity: 1.0;
    background-color: #00afdf;
}

.CenterImageABXYPanel.CenterImage
{
	background-image: url("file://{images}/library/controller/controller_config_inspector_bpad_bg.png");
}

.controller_ps3 .CenterImageABXYPanel.CenterImage,
.controller_ps4 .CenterImageABXYPanel.CenterImage
{
	background-image: url("file://{images}/library/controller/controller_config_inspector_bpad_bg_ps4.png");
}

#CenterImageMouse.CenterImage
{
	background-image: url("file://{images}/library/controller/controller_config_inspector_trackpad_zone_modifier.png");
}

#CenterImageRelMouse.CenterImage
{
	background-image: url("file://{images}/library/controller/controller_config_inspector_trackpad_zone_modifier.png");
}

#CenterImageScrollWheel.CenterImage
{
	background-image: url("file://{images}/library/controller/controller_config_inspector_trackpad_zone_modifier.png");
}

#CenterImageMouseRotation
{
	height: 8px;
    width: 396px;
    border-radius: 2px;
    border: 1px solid #102f4b;
	horizontal-align: center;
    vertical-align: center;
  	margin-bottom: 47px;
    margin-left: 12px;
    z-index: 10;
   	opacity: 1.0;
    background-color: white;
	visibility: collapse;
	background-position: center center;
}


DropDownMenu.DropDownMenuVisible
{
	width: fieldwidth;
    max-height: 250px;
}

#FrictionMouseJoystickDropDownMenu
{
    width: fieldwidth;
    max-height: 200px;
}

#AdaptiveThresholdDropDownMenu
{
    width: fieldwidth;
    max-height: 160px;
}

#ScrollWheelFrictionDropDownMenu
{
    width: fieldwidth;
    max-height: 170px;
}

#MouseTriggerClampDropDownMenu
{
    width: fieldwidth;
    max-height: 170px;
}

#FrictionDropDownMenu {
    width: fieldwidth;
    max-height: 170px;
}

.FlowDown
{
	flow-children: down;
	width: fit-children;
	height: fit-children;
}

.FlowRight
{
	flow-children: right;
	width: fit-children;
	height: fit-children;
}

#DpadUpButton, #YButton
{
	margin-left: 220px;
	margin-top: 86px;
}

#DpadLeftButton, #XButton
{
	margin-left: 115px;
	margin-top: 33px;
}

#DpadRightButton, #BButton
{
	margin-left: 138px;
	margin-top: 33px;
}

#DpadDownButton, #AButton
{
	margin-left: 220px;
	margin-top: 33px;
}

#RightColumnWrapper
{
	width: fieldwidth;
	height: 450px;
}

.AdvancedPropertiesWrapper
{
	visibility: collapse;
	vertical-align: bottom;
	margin-bottom: -10px;
}

.AdvancedPropertiesButtonVisible #ShowAdvancedProperties
{
	visibility: visible;
}

.AdvancedPropertiesVisible #ShowAdvancedProperties
{
	visibility: collapse;
}

.AdvancedPropertiesButtonVisible #HideAdvancedProperties
{
	visibility: collapse;
}

.AdvancedPropertiesVisible #HideAdvancedProperties
{
	// There is already a back button in the footer, so keep this collapsed for now
	//visibility: visible;
}

#KeyboardWrapper
{
	flow-children: down;
	height: 100%;
	visibility: visible;
}

#BindingDescriptionWrapper
{
	flow-children: right;
	margin-bottom: 20px;
    margin-left: 210px;
}

#SelectBindingHeader
{
	padding-top: 5px;
	color: white;
	font-size: 24px;
	font-family: platformfont;
	vertical-align: center;
	margin-right: 12px;
}

#SelectBindingIconHeader
{
	padding-top: 5px;
	color: white;
	font-size: 24px;
	font-family: platformfont;
	vertical-align: center;
    horizontal-align: right;
	margin-right: 4px;
    padding-left: 16px;
    visibility: collapse;
    width: 80px;
}

#SelectBindingIconHeaderGA
{
	padding-top: 0px;
	color: white;
	font-size: 24px;
	font-family: platformfont;
	text-align: center;
	margin-right: 12px;
    padding-right: 0px;
    padding-left: 350px;
    visibility: collapse;
	flow-children: right;
    width: 730px;
    height: 64px;
    horizontal-align: right;
}

.ShowIcon #SelectBindingIconHeader, .ShowIcon #SelectBindingIconHeaderGA
{
    visibility: visible;
}

.ShowIcon #GameActionsHeader 
{
    width: 880px;
}

#BindingDescriptionTextEntry
{
	margin: 5px;
	width: 400px;
	font-size: 28px;
	font-family: platformfont;
	opacity: 0.0;
}

.ShowCustomDescription #BindingDescriptionTextEntry
{
	opacity: 1.0;
}

#BindingDescriptionDropDown
{
	margin-top: 5px;
	margin-right: 40px;
	width: 450px;
	visibility: collapse;
}

.ShowBindingDescriptionDropDown #BindingDescriptionDropDown
{
	visibility: collapse;
}

#BindingDescriptionDropDownDropDownMenu
{
	width: 450px;
}

ChooseBinding
{
	padding-left: 30px;
	padding-top: 20px;
	height: 520px; 
	flow-children: down;
	opacity-mask: url( "file://{images}/library/keyboardfade.png" ) 0.0;

	transition-property: opacity, opacity-mask;
	transition-duration: shortduration;
	transition-timing-function: bigpicture-ease-in-out;
}

ChooseBinding #GameActions
{
	visibility: collapse;
	width: 100%;
	height: 100%;
	flow-children: down;
}

ChooseBinding #RowOfBindings
{
	width: 100%;
	height: 100%;
	flow-children: right;
}

ChooseBinding.InGameActionsView #GameActions
{
	visibility: visible;
}

ChooseBinding.InGameActionsView #VirtualMouse,
ChooseBinding.InGameActionsView #VirtualGamepad,
ChooseBinding.InGameActionsView #KeyboardWrapper
{
	visibility: collapse;
}

ChooseBinding #GameActionsHeader
{
	vertical-align: top;
	font-size: 32px;
    horizontal-align: center;
}

ChooseBinding #GameActionsScrollContainer
{
	margin-top: 25px;
	height: 370px;
	overflow: clip scroll;
	horizontal-align: center;
	padding-left: 10px;
	padding-right: 10px;
}

ChooseBinding #GameActionsContainer
{
	margin-top: 0px;
	flow-children: right-wrap;
	horizontal-align: center;
}

ChooseBinding .GameActionSelectButton
{
	vertical-align: top;
	horizontal-align: left;
	height: 70px;
	width: 300px;
	padding-top: 0px;
}

ChooseBinding .GameActionSelectButton Label
{
	font-size: 22px;
}

ChooseBinding .GameActionSelectButton:focus
{
	padding-top: 0px;
	background-color: simplebuttonsolid_vertical;
}

ChooseBinding .GameActionSelectButton:hover Label
{
	color: #f2f2f2ff;
}

ChooseBinding .GameActionSelectButton:focus Label
{
	color: #f2f2f2ff;
	transform: none;
}

ChooseBinding .GameActionSelectButton:selected
{
	background-color: gradient( linear, 0% 0%, 0% 100%, from( #0e86abff ), to( #1a5e80ff ) );
}

ChooseBinding .GameActionSelectButton:selected Label
{
	color: white;
}

ChooseBinding .GameActionSelectButton.OriginalBinding
{
	background-color: gradient( linear, 0% 0%, 0% 100%, from( #0e86abff ), to( #1a5e80ff ) );
}

ChooseBinding .GameActionSelectButton.OriginalBinding Label
{
	color: white;
}

ChooseBinding .ControllerActionSetButton
{
    margin-left: 60px;
}

ChooseBinding .ControllerActionButton
{
    margin-left: 116px;
}

ChooseBinding #actionset_options 
{
    visibility: collapse;
}

.LegacyBinding #actionset_options,
.HasActionLayers #actionset_options 
{
    visibility: visible;
}

.SelectPresetDropDownContainer
{
	margin: 16px 16px;
}

.NativeActionSets #CursorOnPresetDropDownPanel,
.NativeActionSets #CursorOffPresetDropDownPanel,
.NativeActionSets .HorizontalSpace,
.NativeActionSets .SelectPresetDropDownContainer
{
    visibiity: collapse;
}


.LegacyBinding #show_keyboard,
.HasActionLayers #show_keyboard
{
    margin-left: 0px;
}

ChooseBinding .IconPreview
{
    margin-left: 12px;
    height: 64px;
    width: 64px;
    visibility: collapse;
}

ChooseBinding .IconPreviewGA
{
    margin-left: 12px;
    height: 64px;
    width: 64px;
    visibility: collapse;
    horizontal-align: right;
}

#BindingIcon
{
    width: 100%;
    height: 100%;
}

.ShowIcon #IconPreview, .ShowIcon #IconPreviewGA
{
    visibility: visible;
}

.BehindTextInputHandler #ChooseBinding
{
	opacity-mask: url( "file://{images}/library/keyboardfade.png" ) 0.9;
	opacity: 0.35;
}

ChooseBinding #VirtualMouse
{
	flow-children: down;
	height: 100%;
	background-image: url( "file://{images}/library/mouse.png" );
	background-position: left 20px top 2px;
	background-repeat: no-repeat;
    margin-top: -120px;
	visibility: visible;
}

ChooseBinding #VirtualMouse 
{
	flow-children: none;
}

ChooseBinding Button
{
	border-style: solid;
	border-width: 2px;
	border-color: #017895ff;
	background-color: #080f20ff;

	width: 58px;
	height: 58px;

	padding: 0px;
	margin: 1px;

	transition-property: background-color;
	transition-duration: shortduration;
	transition-timing-function: ease-in;
}

ChooseBinding #VirtualMouse Button
{
	background-color: #00000000;
	border-color: #00000000;
	margin: 0px;
	border-width: 0px;
}

ChooseBinding #VirtualMouse Button.OriginalBinding
{
	background-color: #307c01ff;
	margin: 0px;
	border-width: 0px;
}

ChooseBinding #VirtualMouse Button:focus, ChooseBinding #VirtualMouse Button.OriginalBinding:focus
{
	background-color: gradient(linear, -15% 0%, 100% 0%, from(#fdfdfdee), to(#adafafe0));
}

ChooseBinding Button:hover
{
	transition-duration: 0.23s !immediate;
	box-shadow: #eeeeee60 -3px -3px 6px 6px;
}

ChooseBinding Button.GamepadButton
{
	box-shadow: none;
}

.BehindTextInputHandler ChooseBinding Button:hover
{
	box-shadow: none;
}


ChooseBinding Button:hover
{
	transition-duration: 0.23s !immediate;
	box-shadow: #eeeeee60 -3px -3px 6px 6px;
}

ChooseBinding Button.GamepadButton
{
	box-shadow: none;

}

.BehindTextInputHandler ChooseBinding Button:hover
{
	box-shadow: none;
}

.ChooseBindingIconImage
{
    margin: 6px;
	wash-color: #00d4ffff;
}


ChooseBinding Button Label, ChooseBinding Label
{
	margin: 0px;
	padding: 0px;
	font-size: 25px;
	font-weight: normal;
	color: #00d4ffff;
	vertical-align: center;
	horizontal-align: center;
	transform: translatex( 0px );

	transition-property: color;
	transition-duration: shortduration;
	transition-timing-function: ease-in;
}

ChooseBinding Button:focus,
ChooseBinding Button.OriginalBinding:focus
{
	animation-name: main-button-glow-movement-small;
	animation-duration: longduration;
	animation-delay: shortduration;
	animation-timing-function: bigpicture-ease-in-out;
	animation-iteration-count: infinite;
	animation-direction: normal;

	background-color: gradient( linear, -15% 0%, 100% 0%, from( #fdfdfdee ), to( #adafafe0 ) ); 

	border-color: #fefefeff;
	border-width: 2px;
}

ChooseBinding Button:focus Label
{
    wash-color: #353535ff;
}

ChooseBinding Button:focus Image
{
    wash-color: #353535ff;
}


ChooseBinding Button.OriginalBinding
{
	background-color: #307c01ff;
	box-shadow: #6893b570 -1.5px -1.5px 4px 3px;
}

ChooseBinding Button.OriginalBinding Label
{
	color: #54dd01ff;
}

ChooseBinding Button.OriginalBinding Image
{
	wash-color: #54dd01ff;
}

ChooseBinding Button.OriginalBinding:focus Label
{
	color: #353535ff;
}

ChooseBinding #VKBRow1,
ChooseBinding #VKBRow2,
ChooseBinding #VKBRow3,
ChooseBinding #VKBRow4,
ChooseBinding #VKBRow5,
ChooseBinding #VKBRow6
{
	flow-children: right;
	margin-bottom: 1px;
}

ChooseBinding #VKBRow1
{
	margin-bottom: 8px;
}

ChooseBinding #VKBCol1,
ChooseBinding #VKBCol2,
ChooseBinding #VKBCol3
{
	flow-children: right;
}

ChooseBinding #VKBCol1
{
	margin-right: 15px;
}

ChooseBinding #VKBCol2
{
	margin-right: 15px;
}

ChooseBinding #VKBCol3
{
}

ChooseBinding #kb_key_backspace
{
	width: 118px;
}

ChooseBinding #kb_key_tab,
ChooseBinding #kb_key_backslash
{
	width: 88px;
}

ChooseBinding #kb_key_mute
{
    width: 72px;
}

ChooseBinding #kb_key_capslock,
ChooseBinding #kb_key_enter
{
	width: 118px;
}

ChooseBinding #kb_key_lshift,
ChooseBinding #kb_key_rshift
{
	width: 148px;
}

ChooseBinding #kb_key_rcontrol,
ChooseBinding #kb_key_ralt
{
	width: 133px;
}

ChooseBinding #kb_key_lcontrol,
ChooseBinding #kb_key_lalt,
ChooseBinding #kb_key_lwin
{
	width: 88px;
}



ChooseBinding #kb_key_space
{
	width: 358px;
}

ChooseBinding #kb_key_pad_0
{
	width: 118px;
}

ChooseBinding Button#kb_key_right Label
{
	transform-origin: 0% 0% parent-relative;
	transform: rotatez( 90deg ) translatex( 100% );
}

ChooseBinding Button#kb_key_down Label
{
	transform-origin: 0% 0% parent-relative;
	transform: rotatez( 180deg ) translatex( 100% ) translatey( 100% );
}

ChooseBinding Button#kb_key_left Label
{
	transform-origin: 0% 0% parent-relative;
	transform: rotatez( -90deg ) translatey( 100% ); 
}

ChooseBinding
{
	height: fit-children;
	width: fit-children;
}

ChooseBinding #VirtualKeyboard Button.Empty
{
	opacity: 0.0;
}

ChooseBinding #VirtualKeyboard
{
	height: 100%;
	flow-children: down;

	pre-transform-scale2d: 0.85;
	margin-top: -35px;
	margin-left: -100px;
}

ChooseBinding #VirtualGamepad
{
	width: 512px;
	height: 420px;

	background-image: url( "file://{images}/library/controller/binding_virtual_gamepad_bg.png" ); 
	//background-position: absolute center;
	background-repeat: no-repeat;

    margin-top: -90px;
	margin-left: -120px;
	visibility: visible;
}

.HideGamepad #VirtualGamepad
{
    visibility: collapse;
}


.HideGamepad #VirtualMouse
{
    margin-left: 185px;
}

ChooseBinding #GamepadBoundLayer, ChooseBinding #GamepadFocusLayer,
ChooseBinding #GamepadBoundLayerLT, ChooseBinding #GamepadBoundLayerRT, ChooseBinding #GamepadBoundLayerLB, ChooseBinding #GamepadBoundLayerRB,
ChooseBinding #GamepadBoundLayerLS, ChooseBinding #GamepadBoundLayerRS, ChooseBinding #GamepadBoundLayerBK, ChooseBinding #GamepadBoundLayerST,
ChooseBinding #GamepadBoundLayerA, ChooseBinding #GamepadBoundLayerB, ChooseBinding #GamepadBoundLayerX, ChooseBinding #GamepadBoundLayerY,
ChooseBinding #GamepadBoundLayerDPUP, ChooseBinding #GamepadBoundLayerDPDN, ChooseBinding #GamepadBoundLayerDPLT, ChooseBinding #GamepadBoundLayerDPRT
{
	width: 100%;
	height: 100%;

	background-position: center center;
	background-repeat: no-repeat;
}

ChooseBinding.LeftTriggerBound #GamepadBoundLayer
{
	background-position: 104px 22px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_lt.png" ); 
}

ChooseBinding.RightTriggerBound #GamepadBoundLayer
{
	background-position: 346px 22px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_rt.png" ); 
}

ChooseBinding.LeftShoulderBound #GamepadBoundLayer
{
	background-position: 99px 29px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_lb.png" ); 
}

ChooseBinding.RightShoulderBound #GamepadBoundLayer
{
	background-position: 322px 29px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_rb.png" ); 
}

ChooseBinding.LeftJoystickBound #GamepadBoundLayer
{
	background-position: 111px 91px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_ls.png" ); 
}

ChooseBinding.RightJoystickBound #GamepadBoundLayer
{
	background-position: 285px 162px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_rs.png" ); 
}

ChooseBinding.LStickLeftBound #GamepadBoundLayer
{
	background-position: 96px 91px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_ls_left.png" ); 
}

ChooseBinding.LStickRightBound #GamepadBoundLayer
{
	background-position: 126px 91px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_ls_right.png" ); 
}

ChooseBinding.LStickUpBound #GamepadBoundLayer
{
	background-position: 111px 76px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_ls_up.png" ); 
}

ChooseBinding.LStickDownBound #GamepadBoundLayer
{
	background-position: 111px 106px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_ls_down.png" ); 
}

ChooseBinding.RStickLeftBound #GamepadBoundLayer
{
	background-position: 270px 162px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_rs_left.png" ); 
}

ChooseBinding.RStickRightBound #GamepadBoundLayer
{
	background-position: 300px 162px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_rs_right.png" ); 
}

ChooseBinding.RStickUpBound #GamepadBoundLayer
{
	background-position: 285px 147px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_rs_up.png" ); 
}

ChooseBinding.RStickDownBound #GamepadBoundLayer
{
	background-position: 285px 177px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_rs_down.png" ); 
}

ChooseBinding.SelectButtonBound #GamepadBoundLayer
{
	background-position: 187px 106px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_back.png" ); 
}

ChooseBinding.StartButtonBound #GamepadBoundLayer
{
	background-position: 260px 106px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_start.png" ); 
}

ChooseBinding.AButtonBound #GamepadBoundLayer
{
	background-position: 339px 127px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_a.png" ); 
}

ChooseBinding.BButtonBound #GamepadBoundLayer
{
	background-position: 365px 103px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_b.png" ); 
}

ChooseBinding.XButtonBound #GamepadBoundLayer
{
	background-position: 315px 102px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_x.png" ); 
}

ChooseBinding.YButtonBound #GamepadBoundLayer
{
	background-position: 340px 78px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_y.png" ); 
}

ChooseBinding.DpadUpBound #GamepadBoundLayer
{
	background-position: 185px 250px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_dp_up.png" ); 
}

ChooseBinding.DpadDownBound #GamepadBoundLayer
{
	background-position: 185px 278px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_dp_dn.png" ); 
}

ChooseBinding.DpadLeftBound #GamepadBoundLayer
{
	background-position: 170px 265px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_dp_lt.png" ); 
}

ChooseBinding.DpadRightBound #GamepadBoundLayer
{
	background-position: 198px 265px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_dp_rt.png" ); 
}

ChooseBinding.LeftTriggerMultiBound #GamepadBoundLayerLT
{
	background-position: 104px 22px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_multi_lt.png" ); 
}

ChooseBinding.RightTriggerMultiBound #GamepadBoundLayerRT
{
	background-position: 346px 22px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_multi_rt.png" ); 
}

ChooseBinding.LeftShoulderMultiBound #GamepadBoundLayerLB
{
	background-position: 99px 29px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_multi_lb.png" ); 
}

ChooseBinding.RightShoulderMultiBound #GamepadBoundLayerRB
{
	background-position: 322px 29px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_multi_rb.png" ); 
}

ChooseBinding.LeftJoystickMultiBound #GamepadBoundLayerLS
{
	background-position: 111px 91px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_multi_ls.png" ); 
}

ChooseBinding.RightJoystickMultiBound #GamepadBoundLayerRS
{
	background-position: 285px 162px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_multi_rs.png" ); 
}

ChooseBinding.LStickLeftMultiBound #GamepadBoundLayerLSLeft
{
	background-position: 106px 91px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_ls.png" ); 
}

ChooseBinding.LStickRightMultiBound #GamepadBoundLayerLSRight
{
	background-position: 116px 91px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_ls.png" ); 
}

ChooseBinding.LStickUpMultiBound #GamepadBoundLayerLSUp
{
	background-position: 111px 96px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_ls.png" ); 
}

ChooseBinding.LStickDownMultiBound #GamepadBoundLayerLSDown
{
	background-position: 111px 86px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_ls.png" ); 
}

ChooseBinding.RStickLeftMultiBound #GamepadBoundLayerRSLeft
{
	background-position: 280px 162px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_rs.png" ); 
}

ChooseBinding.RStickRightMultiBound #GamepadBoundLayerRSRight
{
	background-position: 290px 162px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_rs.png" ); 
}

ChooseBinding.RStickUpMultiBound #GamepadBoundLayerRSUp
{
	background-position: 285px 167px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_rs.png" ); 
}

ChooseBinding.RStickDownMultiBound #GamepadBoundLayerRSDown
{
	background-position: 285px 157px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_active_rs.png" ); 
}

ChooseBinding.SelectButtonMultiBound #GamepadBoundLayerBK
{
	background-position: 187px 106px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_multi_back.png" ); 
}

ChooseBinding.StartButtonMultiBound #GamepadBoundLayerST
{
	background-position: 260px 106px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_multi_start.png" ); 
}

ChooseBinding.AButtonMultiBound #GamepadBoundLayerA
{
	background-position: 340px 127px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_multi_a.png" ); 
}

ChooseBinding.BButtonMultiBound #GamepadBoundLayerB
{
	background-position: 365px 103px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_multi_b.png" ); 
}

ChooseBinding.XButtonMultiBound #GamepadBoundLayerX
{
	background-position: 316px 102px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_multi_x.png" ); 
}

ChooseBinding.YButtonMultiBound #GamepadBoundLayerY
{
	background-position: 340px 78px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_multi_y.png" ); 
}

ChooseBinding.DpadUpMultiBound #GamepadBoundLayerDPUP
{
	background-position: 185px 250px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_multi_dp_up.png" ); 
}

ChooseBinding.DpadDownMultiBound #GamepadBoundLayerDPDN
{
	background-position: 185px 278px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_multi_dp_dn.png" ); 
}

ChooseBinding.DpadLeftMultiBound #GamepadBoundLayerDPLT
{
	background-position: 170px 265px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_multi_dp_lt.png" ); 
}

ChooseBinding.DpadRightMultiBound #GamepadBoundLayerDPRT
{
	background-position: 198px 265px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_multi_dp_rt.png" ); 
}


ChooseBinding.LeftTriggerFocus #GamepadFocusLayer
{
	background-position: 104px 22px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_lt.png" ); 
}

ChooseBinding.RightTriggerFocus #GamepadFocusLayer
{
	background-position: 346px 22px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_rt.png" ); 
}

ChooseBinding.LeftShoulderFocus #GamepadFocusLayer
{
	background-position: 99px 29px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_lb.png" ); 
}

ChooseBinding.RightShoulderFocus #GamepadFocusLayer
{
	background-position: 322px 29px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_rb.png" ); 
}

ChooseBinding.LeftJoystickFocus #GamepadFocusLayer
{
	background-position: 111px 91px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_ls.png" ); 
}

ChooseBinding.RightJoystickFocus #GamepadFocusLayer
{
	background-position: 285px 162px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_rs.png" ); 
}


ChooseBinding.LStickLeftFocus #GamepadFocusLayer
{
	background-position: 96px 91px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_ls_left.png" ); 
}

ChooseBinding.LStickRightFocus #GamepadFocusLayer
{
	background-position: 126px 91px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_ls_right.png" ); 
}

ChooseBinding.LStickUpFocus #GamepadFocusLayer
{
	background-position: 111px 76px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_ls_up.png" ); 
}

ChooseBinding.LStickDownFocus #GamepadFocusLayer
{
	background-position: 111px 106px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_ls_down.png" ); 
}

ChooseBinding.RStickLeftFocus #GamepadFocusLayer
{
	background-position: 270px 162px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_rs_left.png" ); 
}

ChooseBinding.RStickRightFocus #GamepadFocusLayer
{
	background-position: 300px 162px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_rs_right.png" ); 
}

ChooseBinding.RStickUpFocus #GamepadFocusLayer
{
	background-position: 285px 147px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_rs_up.png" ); 
}

ChooseBinding.RStickDownFocus #GamepadFocusLayer
{
	background-position: 285px 177px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_rs_down.png" ); 
}

ChooseBinding.SelectButtonFocus #GamepadFocusLayer
{
	background-position: 187px 106px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_back.png" ); 
}

ChooseBinding.StartButtonFocus #GamepadFocusLayer
{
	background-position: 260px 106px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_start.png" ); 
}

ChooseBinding.AButtonFocus #GamepadFocusLayer
{
	background-position: 340px 127px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_a.png" ); 
}

ChooseBinding.BButtonFocus #GamepadFocusLayer
{
	background-position: 365px 103px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_b.png" ); 
}

ChooseBinding.XButtonFocus #GamepadFocusLayer
{
	background-position: 315px 102px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_x.png" ); 
}

ChooseBinding.YButtonFocus #GamepadFocusLayer
{
	background-position: 340px 78px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_y.png" ); 
}

ChooseBinding.DpadUpFocus #GamepadFocusLayer
{
	background-position: 185px 250px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_dp_up.png" ); 
}

ChooseBinding.DpadDownFocus #GamepadFocusLayer
{
	background-position: 185px 278px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_dp_dn.png" ); 
}

ChooseBinding.DpadLeftFocus #GamepadFocusLayer
{
	background-position: 170px 265px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_dp_lt.png" ); 
}

ChooseBinding.DpadRightFocus #GamepadFocusLayer
{
	background-position: 198px 265px;
	background-image: url( "file://{images}/library/controller/cropped_binding_gamepad_selection_dp_rt.png" ); 
}

ChooseBinding #VirtualMouse
{
	height: 100%;
	width: 240px;

	pre-transform-scale2d: 0.85;
	margin-left: -30px;
	margin-top: -40px;
}

ChooseBinding #mouse_left_button
{
	width: 44px;
	height: 44px;
	position: 48px 94px 0px;
}

ChooseBinding #mouse_right_button
{
	width: 44px;
	height: 44px;
	position: 141px 94px 0px;
}

ChooseBinding #mouse_middle_button
{
	width: 31px;
	height: 46px;
	position: 100px 94px 0px;
}

ChooseBinding #mouse_scroll_up
{
	width: 31px;
	height: 45px;
	position: 100px 50px 0px;
	margin-left: 1px;
}

ChooseBinding #mouse_scroll_down
{
	width: 31px;
	height: 32px;
	position: 100px 139px 0px;
}

ChooseBinding #mouse_scroll_down Label
{
	margin-left: 2px;
	transform-origin: 0% 0% parent-relative;
	transform: rotatez( 180deg ) translatex( 100% ) translatey( 100% );
}

ChooseBinding #mouse_back_button
{
	width: 33px;
	height: 44px;
	position: 37px 191px 0px;
}

ChooseBinding #mouse_forward_button
{
	width: 33px;
	height: 44px;
	position: 160px 191px 0px;
}

#GamepadRowWrapper
{
	flow-children: down;
	width: 100%;
	height: 100%;
}

.ShowIcon #VirtualGamepad
{
   margin-left: -95px;
}

#VirtualGamepad #GamepadTopRow
{
	margin-left: 95px;
	margin-top: 100px;
	width: 325px;
	height: 40px;
	//background-color: #00ff0080;
	flow-children: right;
}

#VirtualGamepad #GamepadMiddleRow
{
	margin-top: 23px;
	margin-left: 105px;

	width: 310px;
	height: 84px;
	//background-color: #ff000080;
	flow-children: right;
}

#VirtualGamepad #GamepadLeftStickDirections, #GamepadRightStickDirections
{
    width: 0;
    height: 0;
	flow-children: none;
}

#VirtualGamepad #GamepadBottomRow
{
	margin-left: 158px;
	width: 195px;
	height: 65px;
	//background-color: #0000ff80;
}

#VirtualGamepad Button, #VirtualGamepad Button.OriginalBinding
{
	background-color: none;
	animation-name: none;
	border-width: 0px;
	margin: 0px;
	box-shadow: none;
}

#VirtualGamepad Button:focus
{
	//debug
	//background-color: #ff000080;
}

#VirtualGamepad #LeftTriggerShoulderWrapper
{
	flow-children: down;
}

#VirtualGamepad #RightTriggerShoulderWRapper
{
	flow-children: down;
	horizontal-align: right;
}

#VirtualGamepad #left_trigger, #VirtualGamepad #right_trigger
{
	width: 100px;
	height: 19px;
	//background-color: #ff000080;
}

#VirtualGamepad #left_shoulder, #VirtualGamepad #right_shoulder
{
	width: 100px;
	height: 21px;
	//background-color: #0000ff80;
}

#VirtualGamepad #left_joystick
{
	margin-top: 8px;
	width: 72px;
	height: 70px;
	//background-color: #ffff0080;
}

#VirtualGamepad #button_select
{
	width: 24px;
	height: 24px;
	margin-top: 30px;
	margin-left: 32px;
	//background-color: #ffff0080;
}

#VirtualGamepad #button_start
{
	width: 24px;
	height: 24px;
	margin-top: 30px;
	margin-left: 46px;
	//background-color: #ffff0080;
}

#VirtualGamepad #ABXYWrapper
{
	horizontal-align: right;
	height: 100%;
	width: 88px;
	//background-color: #00ff0080;
	flow-children: down;
}

#VirtualGamepad #button_y
{
	horizontal-align: center;
	height: 28px;
	width: 30px;
	//background-color: #ffff0080;
}

#VirtualGamepad #ABXYMiddleWrapper
{
	width: 100%;
	height: 27px;
	//background-color: #ff000080;
}

#VirtualGamepad #button_x
{
	margin-left: 2px;
	height: 100%;
	width: 30px;
	//background-color: #ffff0080;
}

#VirtualGamepad #button_b
{
	horizontal-align: right;
	margin-right: 2px;
	height: 100%;
	width: 30px;
	//background-color: #ffff0080;
}

#VirtualGamepad #button_a
{
	horizontal-align: center;
	height: 28px;
	width: 30px;
	//background-color: #ffff0080;
}

#VirtualGamepad #DpadWrapper
{
	margin-left: 9px;
	width: 57px;
	height: 57px;
	flow-children: down;
	//background-color: #00ff0080;
}

#VirtualGamepad #dpad_up
{
	horizontal-align: center;
	width: 30px;
	height: 20px;
	//background-color: #ffff0080;
}

#VirtualGamepad #DpadMiddleWrapper
{
	width: 100%;
	height: 20px;
	flow-children: right;
	//background-color: #ff000080;
}

#VirtualGamepad #dpad_left, #VirtualGamepad #dpad_right
{
	height: 100%;
	width: 50%;
	//background-color: #ffff0080;
}

#VirtualGamepad #dpad_down
{
	horizontal-align: center;
	width: 30px;
	height: 20px;
	//background-color: #ffff0080;
}

#VirtualGamepad #right_joystick
{
	horizontal-align: right;
	width: 72px;
	height: 100%;
	//background-color: #ffff0080;
}

ControllerConfigBrowser#ConfigBrowser
{
	visibility: collapse;
}

ControllerConfigBrowser#ConfigBrowser:descendantfocus
{
	width: 100%;
	height: 100%;
	background-color: gradient( radial, 50% 0%, 0px 0px, 50% 100%, from( #102f4b ), to( #080f20 ) );
	visibility: visible;
}

#ConfigBrowserContainer
{
	width: 100%;
	height: 980px;
	vertical-align: bottom;
}

#ConfigsMenu
{
	margin-top: 60px;
	height: fit-children;
}

ControllerConfigBrowser #ConfigBrowserHeader
{
	text-align: left;
	margin-left: 55px;
}

.NoConfigMessage,
ControllerConfigBrowser #CategoryExplanation
{
	margin-top: 0px;
	margin-bottom: 30px;
	font-size: 30px;
	font-family: platformfont;
	color: #75c7fdff;
	horizontal-align: center;
	visibility: visible;
}

#ConfigsRightContainer
{
	padding-top: 90px;
	padding-left: 135px;
	position: 390px 0px 0px;
	padding-right: 40px;

	width: 1500px;
	height: 1120px;
	
	transform: translateX( 0px );
	transition-delay: 0s;
	transition-duration: supershortduration;
	transition-timing-function: bigpicture-ease-in-out;
	transition-property: transform, width;
	
	flow-children: down;
}

.ContentHover #ConfigsRightContainer,
#ConfigsRightContainer:descendantfocus
{
	transform: translateX( -200px );
}

.MenuHover #ConfigsRightContainer
{
	transform: translateX( 0px );
}

#ConfigsColumn,
#CommunityConfigsColumn
{
	flow-children: down;
	width: 100%;
	height: fit-children;
	overflow: clip scroll;
	margin-bottom: 100px;
	visibility: collapse;
}

#ConfigsColumn,
#FriendsConfigsColumn
{
	flow-children: down;
	width: 100%;
	height: fit-children;
	overflow: clip scroll;
	margin-bottom: 100px;
	visibility: collapse;
}

ControllerConfigBrowser.SelectPersonalBindings #ConfigsColumn,
ControllerConfigBrowser.SelectTemplateBindings #ConfigsColumn,
ControllerConfigBrowser.SelectRecommendedBindings #ConfigsColumn,
ControllerConfigBrowser.SelectEntireLibraryBindings #ConfigsColumn
{
	visibility: visible;
}

ControllerConfigBrowser.SelectCommunityBindings #CommunityConfigsColumn
{
	visibility: visible;
}
ControllerConfigBrowser.SelectFriendsBindings #FriendsConfigsColumn
{
	visibility: visible;
}
.NoConfigMessage
{
	text-align: center;
	visibility: collapse;
}
.SelectTemplateBindings.NoTemplateBindings #NoTemplateConfigs
{
	visibility: visible;
}
.SelectPersonalBindings.NoPersonalBindings #NoPersonalConfigs
{
	visibility: visible;
}
.SelectCommunityBindings.NoCommunityBindings #NoCommunityConfigs
{
	visibility: visible;
}
.SelectFriendsBindings.NoFriendsBindings #NoFriendsConfigs
{
	visibility: visible;
}
.SelectRecommendedBindings.NoRecommendedBindings #NoRecommendedConfigs
{
	visibility: visible;
}
.SelectEntireLibraryBindings.NoEntireLibraryBindings #NoEntireLibraryConfigs
{
	visibility: visible;
}

.SelectTemplateBindings.NoTemplateBindings #CategoryExplanation
{
	visibility: collapse;
}
.SelectPersonalBindings.NoPersonalBindings #CategoryExplanation
{
	visibility: collapse;
}
.SelectCommunityBindings.NoCommunityBindings #CategoryExplanation
{
	visibility: collapse;
}
.SelectFriendsBindings.NoFriendsBindings #CategoryExplanation
{
	visibility: collapse;
}
.SelectRecommendedBindings.NoRecommendedBindings #CategoryExplanation
{
	visibility: collapse;
}
.SelectEntireLibraryBindings.NoEntireLibraryBindings #CategoryExplanation
{
	visibility: collapse;
}

ControllerConfigButton
{
	width: 98%;
	height: 200px;	
	margin-bottom: 20px;
		
	border-width: 2px;
	border-style: solid;
	border-color: #0f99bc44;
	background-color: gradient( radial, 50% 90%, 0px 0px, 1000% 100%, from( #102f4b ), to( #080f20aa ) );
	
	visibility: collapse;
}

ControllerConfigButton.ReadOnly
{
    color: #75c7fd88;
	background-color: gradient( radial, 50% 90%, 0px 0px, 1000% 100%, from( #13354c ), to( #102030 ) );
}

ControllerConfigButton:focus
{
	background-color: gradient( radial, 50% 90%, 0px 0px, 1000% 100%, from( #102f4b ), to( #080f20aa ) );
	border-color: white;
	
	animation-name: main-button-glow-movement;
	animation-duration: 1.7s;
	animation-delay: 0.0s;
	animation-timing-function: bigpicture-ease-in-out;
	animation-iteration-count: infinite;
	animation-direction: normal;
}

ControllerConfigButton.ReadOnly:focus
{
	background-color: gradient( radial, 50% 90%, 0px 0px, 1000% 100%, from( #203040 ), to( #405060 ) );
}

ControllerConfigButton #RecommendedConfig
{
	font-size: 25px;
	font-family: platformfont;
	
	align: right top;
	color: white;
	width: 200px;	
	margin-top: 10px;
	margin-right: 15px;
	visibility: collapse;
	font-weight: bold;
	text-align: right;
	z-index: 2;
}

ControllerConfigButton.Recommended #RecommendedConfig
{
	visibility: visible;
}

ControllerConfigButton #TimeStamp
{
	font-size: 15px;
	font-family: platformfont;
	
	align: right top;
	color: white;
	width: 200px;	
	margin-top: 10px;
	margin-right: 15px;
	visibility: collapse;
	font-weight: bold;
	text-align: right;
	z-index: 2;
    visibility: collapse;
}

ControllerConfigButton.ShowTimestamp #TimeStamp
{
	visibility: visible;
}

ControllerConfigButton #ConfigContentWrapper
{
	flow-children: down;
	padding: 10px 20px;
	height: 100%;
	width: 100%;
}

ControllerConfigButton #Title
{
	font-size: 32px;
	font-family: platformfont;
	font-weight: bold;
	color: #75c7fdff;
}

ControllerConfigButton.ReadOnly #Title
{
    color: #75c7fd55;
}

ControllerConfigButton.ReadOnly #Author
{
    color: #75c7fd55;
}

ControllerConfigButton.ReadOnly #Description
{
    color: #75c7fd55;
}


ControllerConfigButton #Author
{
	font-size: 24px;
	font-family: platformfont;
	font-weight: thin;
	color: #75c7fdff;
}






ControllerConfigButton #Description
{
	margin-top: 8px;
	font-size: 21px;
	height: 120px;
	font-family: platformfont;
	font-weight: thin;
	color: #75c7fdff;
}

ControllerConfigButton #ControllerType
{
	font-size: 16px;
	font-family: platformfont;
	align: right bottom;
	color: white;
	width: 400px;	
	margin-bottom: 10px;
	margin-right: 15px;
	visibility: collapse;
	font-weight: bold;
	text-align: right;
	z-index: 2;
}

ControllerConfigButton.ShowAllControllerTypes #ControllerType
{
    visibility: visible;
}

ControllerConfigButton #Votes
{
	font-size: 25px;
	font-family: platformfont;
	align: right top;
	color: white;
	width: 400px;	
	margin-top: 10px;
	margin-right: 15px;
	visibility: collapse;
	font-weight: bold;
	text-align: right;
	z-index: 2;
}

ControllerConfigBrowser.SelectCommunityBindings #Votes
{
	visibility: visible;
}

ControllerConfigBrowser.SelectFriendsBindings #Votes
{
	visibility: visible;
}

ControllerConfigBrowser.SelectCommunityBindings.OfflineMode #CommunityBinding,
ControllerConfigBrowser.OfflineMode #CommunityCategory,
ControllerConfigBrowser.OfflineMode.ShowSaveButtons #TemplateCategory,
ControllerConfigBrowser.OfflineMode.ShowSaveButtons #EntireLibraryCategory
{
	visibility: collapse;
}

ControllerConfigBrowser.SelectFriendsBindings.OfflineMode #FriendsBinding,
ControllerConfigBrowser.OfflineMode #FriendsCategory,
ControllerConfigBrowser.OfflineMode.ShowSaveButtons #TemplateCategory,
ControllerConfigBrowser.OfflineMode.ShowSaveButtons #EntireLibraryCategory
{
	visibility: collapse;
}

ControllerConfigButton.SaveButton #Votes
{
	visibility: collapse;
}

ControllerConfigBrowser.SelectPersonalBindings .PersonalBinding
{
	visibility: visible;
}

ControllerConfigButton.ShowAllControllerTypes.SelectPersonalBindings .PersonalBinding
{
    visibility: visible;
}

ControllerConfigBrowser.SelectCommunityBindings .CommunityBinding
{
	visibility: visible;
}

ControllerConfigBrowser.SelectFriendsBindings .FriendsBinding
{
	visibility: visible;
}

ControllerConfigBrowser.SelectTemplateBindings .ConfigMatchesCotrollerType.TemplateBinding
{
    visibility: visible;
}

ControllerConfigBrowser.SelectTemplateBindings .SaveButton.TemplateBinding
{
    visibility: visible;
}

ControllerConfigBrowser.SelectTemplateBindings.HideSaveButtons .SaveButton.TemplateBinding
{
	visibility: collapse;
}


ControllerConfigBrowser.SelectTemplateBindings .ShowAllControllerTypes.TemplateBinding
{
    visibility: visible;
}

ControllerConfigButton.ConfigMatchesCotrollerType.SelectTemplateBindings .TemplateBinding
{
    visibility: visible;
}

ControllerConfigButton.ShowAllControllerTypes.SelectTemplateBindings .TemplateBinding
{
    visibility: visible;
}

ControllerConfigButton.ShowAllControllerTypes.SelectRecommendedBindings .RecommendedBinding
{
    visibility: visible;
}

ControllerConfigBrowser.SelectRecommendedBindings .ShowAllRecommendedControllerTypes.RecommendedBinding,
ControllerConfigBrowser.SelectRecommendedBindings .ShowAllControllerTypes.RecommendedBinding,
ControllerConfigBrowser.SelectRecommendedBindings .MatchingControllerType.RecommendedBinding 
{
	visibility: visible;
}

ControllerConfigBrowser.SelectEntireLibraryBindings .EntireLibrary
{
	visibility: visible;
}

ControllerConfigBrowser.ShowSaveButtons #RecommendedCategory
{
	visibility: collapse;
}

ControllerConfigBrowser.HideSaveButtons .SaveButton
{
	visibility: collapse;
}

ControllerConfigBrowser.RequiresMoreTimeForPublic .SaveButton.CommunityBinding
{
	visibility: collapse;
}

ControllerConfigBrowser.RequiresMoreTimeForPublic .SaveButton.FriendsBinding
{
	visibility: collapse;
}

ControllerConfigButton #ConfigButtonSaveIcon
{
	horizontal-align: right;
	align: right top;
	width: 200px;
    height: 200px;	
    visibility: collapse;
    opacity: 0.6;
}

ControllerConfigButton.SaveButton #ConfigButtonSaveIcon
{
    visibility: visible;
}

ControllerConfigButton #VoteUpIcon
{
	align: left bottom;
	margin-left: 15px;
	margin-bottom: 15px;
	width: 40px;
    height: 40px;	
    visibility: collapse;
    opacity: 1.0;
	color: white;

}

ControllerConfigButton.VoteUpIcon #VoteUpIcon
{
    visibility: visible;
}

#RequiresMoreTimeToPublishLabel
{
	margin-top: 30px;
	margin-bottom: 70px;
	font-size: 30px;
	font-family: platformfont;
	color: red;
	horizontal-align: center;
	visibility: collapse;
}

ControllerConfigBrowser.SelectCommunityBindings.RequiresMoreTimeForPublic #RequiresMoreTimeToPublishLabel
{
	visibility: visible;
}

ControllerConfigBrowser.SelectFriendsBindings.RequiresMoreTimeForPublic #RequiresMoreTimeToPublishLabel
{
	visibility: visible;
}

.InGameActionsMode .HideInGameActions
{
	visibility: collapse;
}

.ShowInGameActions
{
	visibility: collapse;
}
.InGameActionsMode .ShowInGameActions
{
	visibility: visible;
}

.FakeABXYButtonPanel
{
	width: 72px;
	height: 72px;
	background-repeat: no-repeat;
	background-image: url("file://{images}/library/controller/glyph_input_wrapper_gamepad_offset.png");
}

.FakeABXYShape
{
	width: 100%;
	height: 100%;

	background-image: url("file://{images}/library/controller/glyph_input_wrapper_gamepad.png");
    background-size: 66px;
	background-position: 3px 3px;
	background-repeat: no-repeat;
	border-radius: 10px;
}

#FakeABXYButtonA
{
    background-image: url("file://{images}/library/controller/api/button_a.png");
}

.controller_switch_pro #FakeABXYButtonA,
.controller_switch_single #FakeABXYButtonA,
.controller_switch_pair #FakeABXYButtonA,
{
    background-image: url("file://{images}/library/controller/api/switch_button_b.png");
}

.controller_ps3 #FakeABXYButtonA,
.controller_ps4 #FakeABXYButtonA
{
    background-image: url("file://{images}/library/controller/api/ps4_button_x.png");
}

#FakeABXYButtonB
{
    background-image: url("file://{images}/library/controller/api/button_b.png");
}

.controller_switch_pro #FakeABXYButtonB,
.controller_switch_single #FakeABXYButtonB,
.controller_switch_pair #FakeABXYButtonB,
{
    background-image: url("file://{images}/library/controller/api/switch_button_a.png");
}

.controller_ps3 #FakeABXYButtonB,
.controller_ps4 #FakeABXYButtonB
{
    background-image: url("file://{images}/library/controller/api/ps4_button_circle.png");
}

#FakeABXYButtonX
{
    background-image: url("file://{images}/library/controller/api/button_x.png");
}

.controller_switch_pro #FakeABXYButtonX,
.controller_switch_single #FakeABXYButtonX,
.controller_switch_pair #FakeABXYButtonX,
{
    background-image: url("file://{images}/library/controller/api/switch_button_y.png");
}

.controller_ps3 #FakeABXYButtonX,
.controller_ps4 #FakeABXYButtonX
{
    background-image: url("file://{images}/library/controller/api/ps4_button_square.png");
}

#FakeABXYButtonY
{
    background-image: url("file://{images}/library/controller/api/button_y.png");
}

.controller_switch_pro #FakeABXYButtonY,
.controller_switch_single #FakeABXYButtonY,
.controller_switch_pair #FakeABXYButtonY,
{
    background-image: url("file://{images}/library/controller/api/switch_button_x.png");
}

.controller_ps3 #FakeABXYButtonY,
.controller_ps4 #FakeABXYButtonY
{
    background-image: url("file://{images}/library/controller/api/ps4_button_triangle.png");
}

.FakeABXYButtonPanel Label
{
	font-size: 30px;
	font-family: platformfont;
	font-weight: light;
	text-overflow: ellipsis;
	color: #00ccff;
	margin-left: -1px;
	margin-top: -1px;
	font-size: 20px;
	horizontal-align: center;
	vertical-align: center;
}


.FakeDpadButtonPanel
{
	width: 72px;
	height: 72px;
	background-repeat: no-repeat;
}

.FakeDpadShape
{
	width: 100%;
	height: 100%;

	background-image: url("file://{images}/library/controller/glyph_input_wrapper_keyboard.png");
	background-position: 3px 3px;
	background-repeat: no-repeat;
}

.FakeDpadButton
{
	width: 100%;
	height: 100%;
	margin-top: 3px;
	margin-left: 3px;
}

#DpadUpButton .FakeDpadButton
{
	background-image: url("file://{images}/library/controller/glyph_input_kb_up.png");
}
#DpadDownButton .FakeDpadButton
{
	background-image: url("file://{images}/library/controller/glyph_input_kb_down.png");
}
#DpadLeftButton .FakeDpadButton
{
	background-image: url("file://{images}/library/controller/glyph_input_kb_left.png");
}
#DpadRightButton .FakeDpadButton
{
	background-image: url("file://{images}/library/controller/glyph_input_kb_right.png");
}


// .GameActions
// .Not_GameActions
// OR BOTH

// .Advanced
// OR BOTH

// .DpadMode
// .ABXYMode
// .JoystickMoveMode
// .JoystickCameraMode
// .MouseMode
// .TouchMenuMode
// .RelMouseMode
// .ScrollWheelMode
// .TriggerMode

// .SourceGyro
// .Not_SourceGyro

.ABXYMode,
.JoystickMoveMode,
.JoystickCameraMode,
.MouseMode,
.TouchMenuMode,
.RelMouseMode,
.ScrollWheelMode,
.TriggerMode,
{
	visibility: collapse;
}

#LoadingBlockout
{
	width: 100%;
	height: 100%;
	visibility: collapse;
	background-color: #00000047;
}

#BindingsContainer,
#ModeContainer
{
	visibility: visible;
}

.BindingLoading #LoadingBlockout,
{
	visibility: visible;
}

.BindingLoading #BindingsContainer,
.BindingLoading #ModeContainer
{
	visibility: collapse;
}

#ThrobberContainer
{
	horizontal-align: center;
	vertical-align: center;
}
