html
{
	min-height:100%;
}
body
{
	height:100%;
	background: linear-gradient(rgb(70, 3, 130), #000000);
    font-family: Kanit, Verdana;
    padding: 0px;
    height: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    font-size: 15px;
}
/**********************************************************************************************************************/
.select_enabled
{
	-webkit-user-select:text;-moz-user-select:text;user-select:text;
}
.select_disabled
{
	-webkit-user-select:none;-moz-user-select:none;user-select:none;
}
/**********************************************************************************************************************/
.menu_locale{
	/* display:none; */
	position: fixed;
	transition:height 1s ease-out;
	top: 42px;
	left: 6px;
	width:200px;
	height:368px;
	overflow-x: hidden;
	overflow-y: auto;
		border-radius: 6px 6px  6px 6px;
	border: 1px solid rgb(108, 193, 230);
}
.menu_locale_top
{
	border-radius: 6px 0px  0px 0px;
	border: 1px solid rgb(108, 193, 230);
	border-top: 0px;
	border-right:0px;
	border-left:0px;
}
.menu_locale_bot
{
	border-radius: 0px 0px  0px 6px;
	border: 1px solid rgb(108, 193, 230);
	border-top: 0px;
	border-right:0px;
	border-left:0px;
	border-bottom: 0px;
}
.menu_locale_mid
{
	border-radius: 0px 0px  0px 0px;
	border: 1px solid rgb(108, 193, 230);
	border-top: 0px;
	border-right:0px;
	border-left:0px;
}

/**********************************************************************************************************************/
/*scrollbar-color: #888 #f1f1f1;*/

	/* width */
	::-webkit-scrollbar {
	  width: 10px;
	   border-radius: 0px 6px  6px 0px;
	border: 0px solid #CA63E6;
	}

	/* Track */
	::-webkit-scrollbar-track {
	  background: #000000;
	 border-radius: 0px 6px  6px 0px;
	border: 0px solid #CA63E6;
	}

	/* Handle */
	::-webkit-scrollbar-thumb {
	  background:#000000;
border-radius: 0px 6px  6px 0px;
	border: 1px solid rgb(108, 193, 230);
	}

	/* Handle on hover */
	::-webkit-scrollbar-thumb:hover {
	  background:#000000;
	 border-radius: 0px 6px  6px 0px;
	border: 1px solid rgb(108, 193, 230);
	}

/**********************************************************************************************************************/
.menu_main{
	display:none;
	position: fixed;
	transition:height 1s ease-out;
	bottom: 42px;
	width:200px;

}
.menu_main_visible{
	opacity: 1;
}
.menu_main_hidden{
	opacity: 0;
}
.menu_item
{
	cursor:pointer;
	padding: 6px;
	width:auto;
	background: linear-gradient(#151E2D, #000000);
}
.menu_item:hover
{
	background: linear-gradient(#151E2D, #232D36);
}
.menu_top{
	border-radius: 6px 6px  0px 0px;
	border: 1px solid rgb(108, 193, 230);
	border-bottom: 0px;
}
.menu_mid{
	border-radius: 0px 0px  0px 0px;
	border: 1px solid rgb(108, 193, 230);
	border-bottom: 0px;
}
.menu_bot{
	border-radius: 0px 0px  6px 6px;
	border: 1px solid rgb(108, 193, 230);
}
/**********************************************************************************************************************/
.text_green_fade
{
    background: linear-gradient(to bottom, rgba(28, 173, 60, 0) 0%, rgb(255, 255, 255) 50%, rgb(0, 255, 0) 90%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.text_red_fade
{
    background: linear-gradient(to bottom, rgba(28, 173, 60, 0) 0%, rgb(255, 255, 255) 50%, rgb(255, 0, 0) 90%) !important;

    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}
.text_blue_fade
{
    background: linear-gradient(to bottom, rgb(255, 255, 255) 20%, rgb(108, 193, 230) 100%) !important;

    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}
/**********************************************************************************************************************/
.menu_btn{
	margin-left:12px;
	margin-top:6px;
	display:inline-block;
}
.btn_menu:hover{
	background-color:#232D36;
}

.btn_menu{
position: fixed;
bottom: -1px;
background-color:#151E2D;
padding-left:6px;
padding-right:6px;

border-radius: 6px 6px 0 0;
border: 1px solid  rgb(108, 193, 230);
text-align:center;
cursor:pointer;
}
/**********************************************************************************************************************/
.counter{
position: fixed;
bottom: -1px;
right: 6px;

padding-left:12px;
padding-right:12px;

border-radius: 6px 6px 0 0;
border: 1px solid  rgb(108, 193, 230);
text-align:center;
    background-color:#151E2D;
}
/**********************************************************************************************************************/
.language_select{

position: fixed;
top: -1px;
left: 6px;
background-color:#151E2D;
/*width:115px;*/

border-radius: 0px 0px 6px 6px;
border: 1px solid  rgb(108, 193, 230);
text-align:center;
cursor:pointer;
padding-left:12px;
padding-right:12px;
}

/**********************************************************************************************************************/

@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.fade-in {
    opacity: 0;
    animation: fadein 2s forwards;
    animation-delay: 1s;
}

/**********************************************************************************************************************/

.flickering-cables {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background:
        linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, #000 100%),
        url("/resources/img/background.png");
    background-position: center;
    background-attachment: fixed;
    background-size: cover;
    z-index: -4;
    pointer-events: none;
    will-change: opacity;
}


.div-with-bg {
    position: relative;
    z-index: 0;
}

.div-with-bg::before {
    content: "";
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    /*background-image: url("/resources/img/backgrounds/matrix_greyscale_3-h.gif");*/
    background-repeat: repeat;
    background-position: top left;
    opacity: 0.25;
    z-index: -2;
    pointer-events: none;
}

.div-with-bg::after {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    background: linear-gradient(
        to right,
        black 0%,
        transparent 25%,
        transparent 75%,
        black 100%
    );
}

#cursor_particles_canvas {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2147483647;
    pointer-events: none !important;
    touch-action: none !important;
    user-select: none;
}
/**********************************************************************************************************************/
.news-header {
    position: relative;
    overflow: hidden;
}

/* the moving white gloss */
.news-header::after {
    content: "";
    position: absolute;
    top: 0; left: -150%;
    width: 50%;   /* width of the white band */
    height: 100%;
    background: rgba(108, 193, 230, 0.05);
    transform: skewX(-50deg);
    animation: news-sweep 2s ease-in-out infinite;
    pointer-events: none;
    z-index: 1;
}

/* move it from left to right */
@keyframes news-sweep {
    0%   { left: -150%; }
    50%  { left: 150%; }
    100% { left: -150%; }
}

/* ensure your text sits above the sweep */
.news-header > span {
    position: relative;
    z-index: 2;
}
/**********************************************************************************************************************/
@property --angle { syntax: '<angle>'; inherits: false; initial-value: 0deg; }

.conic-border {
    --c1: rgb(138, 6, 254);
    --c2: #CA63E6;
    --bg: #360267;

    background:
        linear-gradient(var(--bg), var(--bg)) padding-box,   /* inner fill */
        conic-gradient(
            from var(--angle),
            var(--c1) 100deg,
            var(--c2) 350deg,
            var(--c1) 360deg
        ) border-box !important;

    border: 1px solid transparent !important;  /* true border thickness */
    border-radius: 3px !important;
    background-clip: padding-box, border-box !important;

    animation: spin-angle 5s linear infinite !important;
}

@keyframes spin-angle {
    to { --angle: 360deg; }
}
/**********************************************************************************************************************/

.button {
    background-color: transparent !important;
    border: 1px solid #8A06FE;
    border-radius: 4px;
}
/**********************************************************************************************************************/