@define touchkeyclickedactivetime: 0.13;

@define touchmenufadeinouttime: 0.066s;

#TouchMenu
{
	width: 390px;
	height: 430px;
	background-color: #222222bb;
	border-radius: 10px;
	
	opacity: 0.0;
	
	transition-property: opacity;
	transition-duration: touchmenufadeinouttime;
	transition-timing-function: linear;
}

#TouchMenu.Bumper
{
    width: 800px;
    height: 180px;
}

#TouchMenu.Radial
{
    border-bottom-left-radius: 50%;
    border-bottom-right-radius: 50%;
 	background-color: #22222277;   
}

#TouchMenu.NoDescription
{
    border-top-left-radius: 50%;
    border-top-right-radius: 50%;
    height: 390px;
}


#TouchMenuHoverKeyDescription
{
	margin-top: 5px;
	horizontal-align: center;

	color: tclegendlabel;
	font-size: 38px;
	font-family: platformfont;
}

#TouchMenuPad
{
	margin-top: 60px;
	horizontal-align: center;

	width: 350px;
	height: 350px;
	
	background-color: #202020ff;
	
	border-radius: 8px;
}

#TouchMenuPad.Radial
{
    border-radius: 50%;
	background-color: #20202088;
}

#TouchMenuPad.Bumper
{
    width: 770px;
    height: 110px;
	background-color: #20202088;
}

#TouchMenuPad.NoDescription
{
    margin-top: 20px;
}

.TouchKeyDisabled
{
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	width: 75px;
	height: 75px;
    background-color:  #40404090;
    border-radius: 8px;
    border: 3px solid #202020ff;
}

.TouchKeyDisabled.Radial
{
    visibility: collapse;
}

.TouchKey
{
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	width: 75px;
	height: 75px;
	background-color: #404040ff;
    border-radius: 8px;
    border: 3px solid #202020ff;
    pre-transform-scale2d: 1.0;
    transition-duration: 0.15s;
    transition-property: pre-transform-scale2d;
	transition-timing-function: bigpicture-ease-in-out;
}

.TouchKey Label
{
	margin-top: 5px;
	horizontal-align: center;
    vertical-align: center;
	color: tclegendlabel;
	font-size: 32px;
	font-family: platformfont;
}

#TouchLabel.SmallLabel
{
	margin-top: 8px;
	margin-left: 8px;
	horizontal-align: left;
    vertical-align: top;
	color: tclegendlabel;
	font-size: 16px;
	font-family: platformfont;
}

#TouchLabel.SmallLabel.Radial
{
	margin-top: 27%;
	margin-left: 27%;
    pre-transform-scale2d: 1.3;
}


.TouchKey.Radial
{
    border-radius: 50%;
    pre-transform-scale2d: 0.5;
}

#TouchMenuIcon
{
	horizontal-align: center;
    vertical-align: center;
    width: 256px;
    height: 256px;
}

.TouchKeyHover
{
	background-color: daisy_petal_selection_color;
    border-radius: 6px; 
    border: 4px solid #ffffff88;
}

.TouchKeyHover.Radial
{
    pre-transform-scale2d: 0.65;
    transition-duration: 0.15s;
    transition-timing-function: bigpicture-ease-in-out;
    transition-property: pre-transform-scale2d z-index;
    z-index: 50;
    border: 5px solid #ffffff88;
    border-radius: 50%;
}


.TouchKeyClicked
{
    border: 8px solid #eeeeeeaa;
}

.TouchKeyClicked #TouchLabel
{
	font-size: 28px;
}

.TouchKeyClicked #TouchLabel.SmallLabel
{
	font-size: 14px;
}

#Pointer
{
	visibility: collapse;
	vertical-align: center;
	horizontal-align: center;
}

#Pointer.Radial
{
	visibility: visible;
    z-index: 60;
    pre-transform-scale2d: 0.3;
    opacity:  0.35;
}

.Radial #TouchMenuPointer
{
	visibility: collapse;
}

#RadialMenuPointer 
{
    visibility: collapse;
}
.Radial #RadialMenuPointer 
{
	visibility: visible;
}

.ShowPanoramaPointers #Pointer.TouchMenuPadActive
{
	visibility: visible;
}