
@define RADIAL_BACKDROP_COLOR_GRADIENT: 		gradient( radial, 50% 50%, 0% 0%, 100% 100%, 	from( #000000f5 ),	color-stop(0.209, #000000f5),	color-stop(0.210, #13131300),	to( #00000000 ) );

@define RADIAL_SEGMENT_CANSELECT: 				gradient( radial, 50% 50%, 0% 0%, 100% 100%,	from( #13131300 ),  color-stop(0.22, #13131300), 	color-stop(0.22, #000000e6),    color-stop(0.46, #000000e6),	color-stop(0.46, #AAAAAA00),	color-stop(0.5, #AAAAAA00),		color-stop(0.5, #00000000),	to( #00000000 ) );
  
               
                                          		                                            	                                                 	                                                                                          	                             	                             	                     
@define RADIAL_SEGMENT_CANSELECT_HOVERED: 		gradient( radial, 50% 50%, 0% 0%, 100% 100%,	from( #13131300 ),  color-stop(0.21, #FFFFFF00), color-stop(0.21, #FFFFFF), color-stop(0.22, #FFFFFF), 	color-stop(0.22, #000000f5,    color-stop(0.48, #000000f5), color-stop(0.48, #00000000),  color-stop(0.455, #DDDDDD00),	color-stop(0.457, #DDDDDD00),	color-stop(0.457, #00000000),	to( #00000000 ) );
@define RADIAL_SEGMENT_CANNOT_SELECT: 			gradient( radial, 50% 50%, 0% 0%, 100% 100%,	from( #13131300 ),  color-stop(0.22, #13131300),	color-stop(0.22, #232323),    color-stop(0.46, #232323),	color-stop(0.46, #00000000),    color-stop(0.5, #00000000),		color-stop(0.5, #00000000),	to( #00000000 ) );

@define RADIAL_SEGMENT_CANNOT_SELECT_HOVERED: 	gradient( radial, 50% 50%, 0% 0%, 100% 100%,	from( #13131300 ),  color-stop(0.22, #13131300), 	color-stop(0.22, #121212),    color-stop(0.455, #121212),	color-stop(0.455, #FF0000FF),	color-stop(0.457, #FF0000FF),	color-stop(0.457, #FF000000),	to( #00000000 ) );


@define ANALOGUE_CURSOR_GRADIENT: 				gradient( radial, 50% 50%, 0% 0%, 100% 100%,	from( #13131300 ),  color-stop(0.21, #13131300), 	color-stop(0.21, #AAAAAAFF),	color-stop(0.219, #AAAAAAFF), 	color-stop(0.219, #FFFFFF00), 	to( #00000000 ) );


.Radial
{
	width: 100%;
	height: 100%;
	vertical-align: center;
	horizontal-align: center;
	                                        
}


.IsFading .RadialFadeIn,
.RadialFadeIn.IsFading
{
	transition-duration: 0.125s;
	transition-delay: 0.08s;                                                                   
	opacity: 0;
	transform: scale3d( 1.05,  1.05, 1 );
}

.RadialFadeIn
{
	transform: scale3d( 1, 1, 1 );
	opacity: 1;
	transition-property: opacity, transform;
	transition-duration: 0.1s;
	transition-delay: 0.0s;
	transition-timing-function: ease-out;
}



CSGORadialRadio .RadialSegment
{

}

                                       
.RadialBackdrop
{
	
	width: 800px;
	height: 800px;

	vertical-align: center;
	horizontal-align: center;
	
}


.RadialBackdropCircle
{
	width: 100%;
	height: 100%;
    background-color: RADIAL_BACKDROP_COLOR_GRADIENT;
}


                                                    
.RadialRadioBackdropCircleWheel1
{

}


                                             
.RadialRadioBackdropCircleWheel2
{

}

                                      
.RadialRadioBackdropCircleWheel3
{

}



.RadialSegment-data
{
	horizontal-align:left;
	vertical-align:top;
	width: 400px; 
	height: 200px;
	transform: translateX(-200px) translateY(-100px);
	flow-children: down;
}

.RadialSegment-container
{
    width: fit-children;
    height: fit-children;
                      
	horizontal-align: center;
	vertical-align: center;
	overflow: noclip;
	flow-children: down;

}

.RadialSegment-text
{
	horizontal-align: center;
	                                                         
	width: 50%;
	                
	font-family: Stratum2, 'Arial Unicode MS';
	color: #FFFFFF;
	
	font-size: 14px;
    font-weight: bold;
	text-align: center;
	text-shadow:1px 1px 1px #000000;
	               
	text-overflow: shrink;
	y:62px;
}

CCSGOQuickUtilityItemRadial .RadialSegment-text,
CCSGOQuickGrenadesRadial .RadialSegment-text,
CSGOQuickInventory .RadialSegment-text
{
	visibility: collapse;
}

.RadialSegment-text-large
{
	width: 100%;
	font-size: 22px;
}

.RadialSegment--hover .RadialSegment-text
{
	color: #FFFFFF;
}

.RadialSegment--hover.RadialSegment--canSelect .RadialSegment-text
{
	color: #FFFFFF;
}

.RadialSegment.RadialSegment--canSelect .RadialSegment-text
{
	color: #FFFFFF;
}


                                                        
.RadialSegment-item-count
{
    width: fit-children;
    height: 28px;

	font-family: Stratum2, 'Arial Unicode MS';
	font-weight: medium;
    visibility:collapse;
	horizontal-align: center;
	vertical-align: center;
    y:36px;
    x:30px;
    font-size: 14px;
    color:#ffffff;
}

.item--has-multiple .RadialSegment-item-count
{
    visibility:visible;
}

CCSGOQuickBuyRadial .RadialSegment-item-count
{
	font-weight: bold;
	font-size: 18px;
	y:44px;
    x:0px;
}

                                                                                                  
.RadialSegmentSelectedCenter-image
{
	horizontal-align: center;
	vertical-align: center;
	                       
	                                       
	wash-color-fast: #ffffff;

}

.RadialSegmentSelectedCenter-text
{
	horizontal-align: center;
	vertical-align: center;
	width: 150px;
	font-family: Stratum2Bold, 'Arial Unicode MS';
	color: #ffffff;
	font-size: 26px;
	text-align: center;
	margin-bottom: 100px;
	text-overflow: shrink;
	text-transform: uppercase;
}

.Radial-heading-container 
{
	horizontal-align:center; 
	vertical-align: center; 
	width:fit-children; 
	flow-children:right;
	margin-top: 120px;
}

.RadialHeading-text
{
	horizontal-align: center;
	vertical-align: center;
	width:fit-children;
	font-family: Stratum2 Monodigit, Stratum2Bold, 'Arial Unicode MS';
	color: #FFFFFF;
	font-size: 24px;
    font-weight: normal;
	text-align: center;
	text-transform: uppercase;
}

.RadialHeading-image
{
	horizontal-align:right; 
	margin-left:12px;
	margin-top: 4px;
}

.RadialSegment
{
	width: 100%;
	height: 100%;
	horizontal-align: center;
	vertical-align: center;
	
	background-color:RADIAL_SEGMENT_CANNOT_SELECT ;
	
	opacity: 0.9;
	transform: scale3d( 1, 1, 1 );
	                                               
	                                                            
	                                
	                                       
}

CCSGOQuickBuyRadial .RadialSegment
{
	wash-color-fast: #ffffff;
}
.RadialSegment.RadialSegment--hover
{
    background-color: RADIAL_SEGMENT_CANNOT_SELECT_HOVERED;
                                    
}

.RadialSegment.RadialSegment--canSelect
{
	opacity: 1;
	background-color: RADIAL_SEGMENT_CANSELECT;
	                                
}

.RadialSegment.RadialSegment--canSelect.RadialSegment--hover
{
    background-color: RADIAL_SEGMENT_CANSELECT_HOVERED;
                                        
}

                                                                                                          
.RadialSegment.RadialSegment--hover.Chosen
{
	wash-color-fast: #FF0000;       
}

                                                                             
.RadialSegment.RadialSegment--canSelect.RadialSegment--hover.Chosen
{
	wash-color-fast: #FFFFFF;       
}

.IsFading .RadialSegment.RadialSegment--canSelect.RadialSegment--hover
{
	                                                                                                                                             
}

.RadialSegment-image
{
    width: 400px;
	height: 200px;
	                       
	transform: scale3d( .95, .95, 1 );

	horizontal-align: center;
	vertical-align: center;

	img-shadow: 0px 0px 0px 0.1 #000000;

	wash-color-fast: #666666e6;
	
	transition-property: transform, img-shadow;
	transition-duration: 0.1s;
	transition-timing-function: ease-out;

}

.RadialSegment--hover .RadialSegment-image
{
	                             
	img-shadow: 0px 0px 50px 0.1 #FF0000;
	
}

.RadialSegment--canSelect .RadialSegment-image
{
	wash-color-fast: #F0F0F0;
	img-shadow: 0px 0px 20px 0.1 #000000;
}

.RadialSegment--canSelect.RadialSegment--hover .RadialSegment-image
{
	wash-color-fast: #FFFFFF;
	img-shadow: 1px 1px 40px 0.1 #BEBEBE;
	transform: scale3d( 1.05, 1.05, 1 );
}

.RadialSegment.AnalogueCursor
{
	                                                                                            
	               
	                

	background-color: ANALOGUE_CURSOR_GRADIENT;
}

.RadialSegment.AnalogueCursor
{
	visibility: collapse;
}


.UsingAnalogueStick .RadialSegment.AnalogueCursor
{
	visibility: visible;
}

                                    
  
                     
 
	                               
	                          
	                                    
	                               
 

                           
 
	  
	 
                     
	 
	    
	 
		             
	 
 
  

.RadialSegmentSelectedFlashAnim 
{
	
	animation-name: SelectedFlashAnim;
	animation-duration: 0.14s;
	animation-timing-function: ease-out;
	animation-iteration-count: 1.2;
}

                       
                                     
 

   

@keyframes 'SelectedFlashAnim'
{
	0%
	{
        opacity: 1.5;
	}
	50%
	{
		opacity: 1.0;
	}
	100%
	{
        opacity: 1.5;
                                      
	}
}


.RadialRadioSettingsNavPanel
{
  	                    
	width: 72.5%;
}

.RadialRadioSettingsNavPanel .content-navbar__tabs--small
{
	height:50px;
	padding-left:20px;
}

.RadialRadioSettingsSearch
{
	flow-children: none;
	height: 50px;
	border: 0px;
	border-bottom: 2px solid rgba(255, 255, 255, 1);
	color: baseText;
}

.RadialRadioSettingsSearch TextEntry
{
	border: 0px;
	font-size: 16px;
	margin-left: 30px; 
}

.RadialRadioSettingsSearch TextEntry:focus
{
	box-shadow
	: none;
}


.RadialRadioSettingsSearch #PlaceholderText
{
	color: baseText;
	font-size: 16px;
}

.RadialRadioSettingsPanel
{
	flow-children: none;
	width: 100%;
	height: 320px;
	text-align: left;
	padding-right: 20px;
}

.RadialRadioSettingsSegment
{
	background-color: #00000033;
	horizontal-align: center;
	vertical-align: center;
	height: 48px;
	width: 188px;
	margin-left: 12px;
	font-family: Stratum2Bold, 'Arial Unicode MS';
	color: #DDDDDDFF;
	font-size: 24px;
	font-weight: bold;
	text-align: center;
	text-shadow:1px 1px 1px #000000;
	border-radius: 2px;
}

.RadialRadioSettingsSegment Label
{
  	                    
	text-overflow: shrink;                   
}

.RadialRadioSettingsSegment:hover
{
	background-color: #44444433;
}

.RadialRadioSettingsSegment--selected
{
	background-color: #00000066;
}

.RadialRadioSettingsSegmentText
{
	margin-left: 40px;
	font-size: 14px;
	                    
	letter-spacing: 1px;

}

.RadialRadioSettingsScrollableOptionsPanel
{
	flow-children: down;
	width: 100%;
	height: 555px;
	overflow: squish scroll;
	background-color: #00000020;
	border-radius: 2px;
}

#chatwheel-settings-list VerticalScrollBar
{
	margin-right: 4px;
}

.RadialRadioSettingsSingleOptionPanel
{
	width: 90%;
	height: 40px;
}

.RadialRadioSettingsSingleOptionPanel--highlight
{
	animation-name: chatwheel-option-highlight;
	animation-duration: 1.0s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
}

@keyframes chatwheel-option-highlight
{
	0%
	{
		background-color: #44447744;
	}
	50%
	{
		background-color: #55558855;
	}
	100%
	{
		background-color: #44447744;
	}
}

.RadialRadioSettingsSingleOptionPanel--highlight:hover
{
	hue-rotation: 40deg;
}

.RadialRadioSettingsOptionLabel
{
	margin-left: 36px;
	color: #BBBBBBFF;
	font-size: 16px;
}

.RadialRadioSettingsOptionLabel:hover
{
	color: #ffffff;
	font-size: 16px;
}

.RadialRadioSettingsHeadingPanel
{
	width: 90%;
	height: 50px;
}

.RadialRadioSettingsHeadingLabel
{
	margin-left: 10px;
	color: #FFFFFFFF;
	font-weight: bold;
}

