html, body {
	color: #FFFFFF;

	background: #6393c1;
	background: -moz-linear-gradient(top,  #6393c1 0%, #cfe7fa 100%);
	background: -webkit-linear-gradient(top,  #6393c1 0%,#cfe7fa 100%);
	background: linear-gradient(to bottom,  #6393c1 0%,#cfe7fa 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6393c1', endColorstr='#cfe7fa',GradientType=0 );

	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

@font-face {
    font-family: 'NewLogo';
    font-style: normal;
    font-weight: 400;
    src: local('NewLogo'), local('NewLogo-Regular'),
        url(fonts/Logo.woff) format('woff'),
        url(fonts/Logo.ttf) format('truetype');
}

@font-face {
    font-family: 'NewMenu';
    font-style: normal;
    font-weight: 400;
    src: local('NewMenu'), local('NewMenu-Regular'),
        url(fonts/NewMenu.woff) format('woff'),
        url(fonts/NewMenu.ttf) format('truetype');
}

@font-face {
    font-family: 'BrushScript';
    font-style: normal;
    font-weight: 400;
    src: local('BrushScript'), local('BrushScript-Regular'),
        url(fonts/BrushScript.woff) format('woff'),
        url(fonts/BrushScript.ttf) format('truetype');
}

@font-face {
    font-family: 'NewButton';
    font-style: normal;
    font-weight: 400;
    src: local('NewButton'), local('NewButton-Regular'),
        url(fonts/capture-it.woff) format('woff'),
        url(fonts/capture-it.ttf) format('truetype');
}

@font-face {
    font-family: 'Halter';
    font-style: normal;
    font-weight: 400;
    src: local('Halter'), local('Halter-Regular'),
        url(fonts/Halter.woff) format('woff'),
        url(fonts/Halter.ttf) format('truetype');
}

button {
	color: white;
	font-size: 10pt;
	border: 1px solid #FFFFFF;
	border-radius: 4px;
	background: blue;
	cursor: pointer;
	padding: 10px 20px 10px 20px;
	box-shadow: 10px 10px 20px rgba(0,0,0,0.5);
}

button:disabled {
	color: #CCCCCC !important;
	font-size: 10pt;
	border: 1px solid #FFFFFF;
	border-radius: 4px;
	background: #606060 !important;
	cursor: not-allowed;
	padding: 10px 20px 10px 20px;
	box-shadow: 10px 10px 20px rgba(0,0,0,0.5);
}

.input_form {
	width: 80px;
	padding: 0;
	border: 1px solid #FFFFFF;
	border-radius: 6px 6px 6px 6px;
	background: white;
}

.input_form input {
	width: 100%;
	border: none;
	height: 100%;
	font-size: 100%;
	font-weight: bolder;
}

.input_form input:focus {
	border: none;
	outline: none;
}

/* ===================================================================================================================== Common */
a {}
:link { color: #00F0FF; }
:visited { color: #FFCCCC; }

input {
	background: #00b7ea;
	background: -moz-radial-gradient(center, ellipse cover,  #00b7ea 0%, #009ec3 100%);
	background: -webkit-radial-gradient(center, ellipse cover,  #00b7ea 0%,#009ec3 100%);
	background: radial-gradient(ellipse at center,  #00b7ea 0%,#009ec3 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00b7ea', endColorstr='#009ec3',GradientType=1 );

	color: white;
	border: 1px solid #66CCFF;
	border-radius: 4px;
	padding: 0;
	margin: 1px 0 1px 0;

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;

	outline: none;
}

input:disabled {
	background: #444444 !important;
	color: #C0C0C0 !important;
}

input::-webkit-input-placeholder {color: #99FF66; font-size: 10pt;}
input::-moz-placeholder          {color: #99FF66; font-size: 10pt;}
input:-moz-placeholder           {color: #99FF66; font-size: 10pt;}
input:-ms-input-placeholder      {color: #99FF66; font-size: 10pt;}

input:focus::-webkit-input-placeholder {color: #FFCCFF; font-size: 8pt;}
input:focus::-moz-placeholder          {color: #FFCCFF; font-size: 8pt;}
input:focus:-moz-placeholder           {color: #FFCCFF; font-size: 8pt;}
input:focus:-ms-input-placeholder      {color: #FFCCFF; font-size: 8pt;}

input::selection {
	background-color: #FFCC00;
	color: black;
}
input[type="time"]::-ms-clear { display: none; }
input[type="time"]::-webkit-clear-button { display: none; }

input::-ms-reveal {
  display: none;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type=number] {
  -moz-appearance: textfield;
}

textarea {
	background-color: #336666;
	color: white;
	border: 1px solid white;
	border-radius: 4px;
	padding: 0;
	margin: 1px 0 1px 0;

	outline: none;
	
	resize: none;
}

select {
	background-color: #336666;
	color: white;
	border: 1px solid white;
	border-radius: 4px;
	padding: 0;
	margin: 1px 0 1px 0;

	outline: none;
	
	resize: none;
}

.loadbar {
	height:20px;
	width:200px;
	margin:200px auto 0;
	background-color:rgba(0,0,0,.1);
	-webkit-border-radius:25px;
	-moz-border-radius:25px;
	-ms-border-radius:25px;
	-webkit-box-shadow:0 1px 0 rgba(255,255,255,.03),inset 0 1px 0 rgba(0,0,0,.1);
	-moz-box-shadow:0 1px 0 rgba(255,255,255,.03),inset 0 1px 0 rgba(0,0,0,.1);
	-ms-box-shadow:0 1px 0 rgba(255,255,255,.03),inset 0 1px 0 rgba(0,0,0,.1);
	box-shadow:0 1px 0 rgba(255,255,255,.03),inset 0 1px 0 rgba(0,0,0,.1);
}

/* 
This is the actual bar with stripes
*/	
.loadbar span {
	display:inline-block;
	height:100%;
	width:100%;
	border:1px solid #ff9a1a;
	border-bottom-color:#ff6201;
	background-color:#d3d3d3;
	-webkit-border-radius:20px;
	-moz-border-radius:20px;
	-ms-border-radius:20px;
	border-radius:20px;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-ms-box-sizing:border-box;
	box-sizing:border-box;
	background-image: -webkit-linear-gradient(-45deg, rgba(255, 154, 26, 1) 25%, transparent 25%, transparent 50%, rgba(255, 154, 26, 1) 50%, rgba(255, 154, 26, 1) 75%, transparent 75%, transparent);
	background-image: -moz-linear-gradient(-45deg, rgba(255, 154, 26, 1) 25%, transparent 25%, transparent 50%, rgba(255, 154, 26, 1) 50%, rgba(255, 154, 26, 1) 75%, transparent 75%, transparent);
	background-image: -ms-linear-gradient(-45deg, rgba(255, 154, 26, 1) 25%, transparent 25%, transparent 50%, rgba(255, 154, 26, 1) 50%, rgba(255, 154, 26, 1) 75%, transparent 75%, transparent);
	background-image: linear-gradient( -45deg, rgba(255, 154, 26, 1) 25%, transparent 25%, transparent 50%, rgba(255, 154, 26, 1) 50%, rgba(255, 154, 26, 1) 75%, transparent 75%, transparent);
	-webkit-background-size:50px 50px;
	-moz-background-size:50px 50px;
	-ms-background-size:50px 50px;
	background-size:50px 50px;
	-webkit-animation:move 2s linear infinite;
	-moz-animation:move 2s linear infinite;
	-ms-animation:move 2s linear infinite;
	animation:move 2s linear infinite;
	-webkit-border-radius:20px;
	-moz-border-radius:20px;
	-ms-border-radius:20px;
	border-radius:20px;
	overflow: hidden;
	-webkit-box-shadow:inset 0 10px 0 rgba(255,255,255,.2);
	-moz-box-shadow:inset 0 10px 0 rgba(255,255,255,.2);
	-ms-box-shadow:inset 0 10px 0 rgba(255,255,255,.2);
	box-shadow:inset 0 10px 0 rgba(255,255,255,.2);
}

@-webkit-keyframes move{ 0% { background-position: 0 0; } 100% { background-position: 50px 50px; } }
@-moz-keyframes move{ 0% { background-position: 0 0; } 100% { background-position: 50px 50px; } }
@-ms-keyframes move{ 0% { background-position: 0 0; } 100% { background-position: 50px 50px; } }
@keyframes move{ 0% { background-position: 0 0; } 100% { background-position: 50px 50px; }}

.global_container {
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
	overflow: hidden;
	box-sizing: border-box;
}

.main_container {
	position: fixed;
	top: 110px;
	left: 240px;
	width: calc(100% - 245px);
	height: calc(100% - 115px);
	overflow: auto;

	background-repeat: no-repeat;
	background-position: left top;
	background-attachment: local,fixed;
}

.main_subcontainer {
	margin-left: 250px;
}

.globalSpinner {
	position: absolute;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	background: url(/images/spinner_64x64.gif) no-repeat;
	left: calc(50% - 32px);
	top: calc(50% - 32px);
	width: 64px;
	height: 64px;
}

.globalInput {
	width: 80px;
	padding: 3px;
	border: 1px solid #FFFFFF;
	border-radius: 6px 6px 6px 6px;
	background: white;
	margin: 0 5px 0 5px;
}

.globalInput input {
	width: calc(100% - 5px);
	border: none;
	height: calc(100% - 5px);
	font-size: 100%;
	font-weight: bolder;
}

.globalInput input:focus {
	border: none;
	outline: none;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    background-color: #FFFFFF !important;
    color: #555 !important;
    -webkit-box-shadow: 0 0 0 1000px white inset !important;
    -webkit-text-fill-color: #555555 !important;
}

.input_ipbar_octet {
	width:36px;
	text-align:right;
}

.input_macbar_octet {
	width:24px;
	text-align:right;
	text-transform:uppercase;
}

.defaultMacInput {
	display: inline-block;
	border: none;
	margin: 0 10px 0 10px;
}

.defaultMacInput input {
	color: #33FFCC;
	background: transparent;
	border: none;
}

.defaultMacInput input:focus {
	border: 1px solid green;
}

/*======================================================================================= Tables */
.defaultTable {
}

.defaultTableHeaderSort {
	background: #66CC99;
	color: yellow;
	text-align: center;
	font-weight: bolder;
	vertical-align: middle;
}

.defaultTable thead {
	cursor: pointer;
	background: #339933;
	text-align: center;
	font-weight: bolder;
	vertical-align: middle;
}

.defaultTable tfoot {
	background: #339933;
	text-align: center;
	font-weight: bolder;
	vertical-align: middle;
}

.defaultTableSort {
	background: #66CC99;
	color: yellow;
}

.defaultTable tr:nth-child(odd) {
	background: #006633 !important;
}

.defaultTable tr:nth-child(odd):hover td {
	background: #006699 !important;
}

.defaultTable tr:nth-child(even) {
	background: #339933 !important;
}

.defaultTable tr:nth-child(even):hover td {
	background: #006699 !important;
}

.defaultTable tr td {
	padding: 0 5px 0 5px;
	vertical-align: top;
}

.defaultTable tr td select {
	cursor: pointer;
	background: transparent;
	border: none;
	color: #FFFFFF;
	-webkit-appearance: none; 
	-moz-appearance: none;
	appearance: none;
}

.defaultTable tr td select:hover {
	background: blue;
}

.defaultTable tr td select:-ms-expand {
	display: none;
}


.defaultTableEx {
	background-color: #0663A5;
	border-spacing: 0;
	border:1px solid white;
	box-shadow:10px 10px 10px rgba(0,0,0,0.5);
}

.defaultTableEx thead {
	cursor: pointer;
	background: #3399FF;
	text-align: center;
	font-weight: bolder;
	vertical-align: middle;
}

.defaultTableEx tr:nth-child(odd) {
}

.defaultTableEx tr:nth-child(even) {
	background: #3F7FFF;
}

.defaultTableEx tr td {
	padding: 0 5px 0 5px;
	vertical-align: top;
}

.defaultTableSimple {
}

.defaultTableSimple thead {
	cursor: pointer;
	background: #3399FF;
	text-align: center;
	font-weight: bolder;
	vertical-align: middle;
}

.defaultTableSimple tr td {
	padding: 0 5px 0 5px;
	vertical-align: top;
}

/*======================================================================================= Tables End*/

/*======================================================================================= PageBar */
.page_unselected {
	text-decoration : none;
	color: #00F0FF;
}

.page_selected {
	text-decoration : none;
	color: #FF9000;
}

.pagebar_container {
	white-space: nowrap;
}

.pagebar_helper_container {
	overflow: hidden;
	text-overflow: ellipsis;

	background: #0099FF;
	color: white;
	border: 1px solid white;
	border-radius: 4px;
	margin: 0 0 0 10px;

	outline: none;
}

.pagebar_perpage_container {
	overflow: hidden;
	text-overflow: ellipsis;

	background: #0099FF;
	color: white;
	border: 1px solid white;
	border-radius: 4px;
	margin: 0 0 0 10px;

	outline: none;
}

.pagebar_btn_prev {
	width: 16px;
	cursor: pointer;
	text-decoration: none;
	color: #00F0FF;
}

.pagebar_btn_prev::after {
	content: "◄";
}

.pagebar_btn_next {
	width: 16px;
	cursor: pointer;
	text-decoration: none;
	color: #00F0FF;
}

.pagebar_btn_next::after {
	content: "►";
}
/*======================================================================================= PageBar End */

/*======================================================================================= Dialog*/
.defaultDialog {
	background-color: #2E0384;
	border: 1px solid #3399FF;
	border-radius: 0 0 4px 4px;
	box-shadow: 10px 10px 10px rgba(0,0,0,0.5);
	padding: 0 0 2px 0;
	overflow: hidden;
	
	animation-duration: 0.3s;
	animation-name: fadeIn;
}
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

.defaultDialogInner {
	padding: 5px;
	overflow:auto;
}

.defaultDialogInner button {
	color: #FFFFFF;
	background: #0066FF;
	border: 1px solid white;
	border-radius: 4px;
	box-shadow: 5px 5px 5px rgba(0,0,0,0.5);
	margin: 5px;
}

.defaultDialogCaptionContainer {
	color: #FFFFFF;
	background-color: #3399FF;
	height:20px;
	line-height:20px;
	width: 100%;
	white-space: nowrap;
	padding:0;
	margin:0;
}

.defaultDialogCaption {
	float: left;
	font-family: tahoma;
	font-size: 18px;
	padding: 0 5px 0 5px;
	width: calc(100% - 58px);
	min-width: calc(100% - 58px);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.defaultDialogCloseButton{
	float: left;
	width: 48px;
	max-width: 48px;
	background : url("/images/close_button.png") no-repeat center center;
	cursor: pointer;
	padding:0;
	margin:0;
	overflow: hidden;
}

.defaultDialogFooter {
	height: 48px;
	line-height: 48px;
}

.defaultDialogButton {
	cursor: pointer;
	background-color: transparent;
	border: 1px solid white;
	border-radius: 4px;
	text-align: center;
	padding: 0px 10px;
	width: auto;
	height: 25px;
	line-height: 25px;
	font-size: 14px;
	overflow: hidden;
	-webkit-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	-khtml-user-select: none;
	user-select: none;
}

.defaultDialogButton:focus {
	cursor: pointer;
	background-color: transparent;
	border: 1px solid yellow;
	border-radius: 4px;
	text-align: center;
	padding: 0px 10px;
	width: auto;
	height: 25px;
	line-height: 25px;
	font-size: 14px;
	overflow: hidden;
	-webkit-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	-khtml-user-select: none;
	user-select: none;
	outline: none;
}

.defaultDialogButtonSelected {
	cursor: pointer;
	background-color: #3366FF;
	border: 1px solid white;
	border-radius: 4px;
	text-align: center;
	padding: 0px 10px;
	width: auto;
	height: 25px;
	line-height: 25px;
	font-size: 14px;
	overflow: hidden;
	-webkit-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	-khtml-user-select: none;
	user-select: none;
}

.defaultDialogButtonSelected:focus {
	cursor: pointer;
	background-color: #3366FF;
	border: 1px solid white;
	border-radius: 4px;
	text-align: center;
	padding: 0px 10px;
	width: auto;
	height: 25px;
	line-height: 25px;
	font-size: 14px;
	overflow: hidden;
	-webkit-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	-khtml-user-select: none;
	user-select: none;
	outline: none;
}

.dialogTable {
	width: 100%;
	border: none;
}

.dialogTable tr td {
	vertical-align: top;
}

.dialogTable tr td button {
	color: #FFFFFF;
	background: #0066FF;
	border: 1px solid white;
	border-radius: 4px;
	box-shadow: 5px 5px 5px rgba(0,0,0,0.5);
	margin: 5px;
}

.dialogInput {
	width: calc(100% - 5px);
	border: 1px solid #99CCFF;
}

.dialogText {
	width: calc(100% - 5px)
}

.dialogSelect {
	width: 100%;
}
/*======================================================================================= Dialog End*/

/* ===================================================================================================================== Header */
.header_container {
	width: 100%;
	height: 100px;
	max-height: 100px;
	padding: 0;
	margin: 0;
	overflow: hidden;

	background: transparent;
	border: none;
}

.header_logo {
	display: inline-block;
	width: 100%;
	height: 100px;
	line-height: 100px;

	padding: 0;
	margin: 0;
	overflow: hidden;
	vertical-align: middle;
}

.header_logo_link {
	width: calc(100% - 5px);
	font-family: 'NewLogo', arial;
	font-size: 54pt;
	letter-spacing: 6px;
	color: #3399FF;
	text-align: right;
	text-shadow: -1px -1px 0 #33FFFF, 1px -1px 0 #33FFFF, -1px 1px 0 #663300, 1px 1px 0 #33FFFF;

	animation-name: zoomInDown;
	animation-duration: 1s;
}

.header_new_year::after {
	content: "";
	position: fixed;

	top: 5px;
	left: calc(100% - 260px);
	width: 100px;
	height: 90px;

	background-image: url(/images/christmas.gif);
	background-position: left center;
	background-repeat: no-repeat;
	background-size: auto 90px;
}

@keyframes zoomInDown {
	from { opacity: 0; transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
	60% { opacity: 1; transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); }
}

.header_logo_christmas {
	background-image: url(/images/christmas.gif);
	background-position: right center;
	background-repeat: no-repeat;
	background-size: auto 90px;
}

#header_abon_info {
	position: fixed;
	top: 5px;
	left: 160px;
	z-index: 2;

	font-size: 16pt;
	white-space: nowrap;

	text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
	
	animation-duration: 1s;
	animation-name: fadeIn;
}

#header_abon_ip {
	position: fixed;
	top: 5px;
	left: 30px;
	z-index: 3;

	text-align: right;
	font-size: 16pt;
	white-space: nowrap;
	
	padding: 0;
	margin: 0;

	text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;

	animation-duration: 1s;
	animation-name: fadeIn;
}

.header_favor_url {
	cursor: pointer;
	position: fixed;
	top: 3px;
	left: 5px;
	width: 20px;
	height: 20px;
	line-height: 20px;
	z-index: 3;

	text-align: center;
	overflow: hidden;
	
	padding: 0;
	margin: 0;
}

.header_favor_url img {
	width: 16px;
	height: 16px;
	vertical-align: middle;
}

#favor_url_data_container {
	min-width: 500px;
	height: 64px;
	line-height: 32px;
	font-size: 14pt;
	background: transparent;
	color: yellow;
	border: none;
	overflow: hidden;
}
/* ===================================================================================================================== Header END */

/* ===================================================================================================================== Header USER BLOCK */
.header_user_closed {
	background: #ff1111;
	background: -moz-linear-gradient(top,  #ff1111 0%, #fe9090 55%, #febbbb 100%) !important;
	background: -webkit-linear-gradient(top,  #ff1111 0%,#fe9090 55%,#febbbb 100%) !important;
	background: linear-gradient(to bottom,  #ff1111 0%,#fe9090 55%,#febbbb 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff1111', endColorstr='#febbbb',GradientType=0 ) !important;
}

.header_user_blocked {
	background: #ff3f3f;
	background: -moz-linear-gradient(top,  #ff3f3f 0%, #fe9090 55%, #febbbb 100%) !important;
	background: -webkit-linear-gradient(top,  #ff3f3f 0%,#fe9090 55%,#febbbb 100%) !important;
	background: linear-gradient(to bottom,  #ff3f3f 0%,#fe9090 55%,#febbbb 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff3f3f', endColorstr='#febbbb',GradientType=0 ) !important;
}

.header_abon_status_blocked {
	padding: 0 0 0 20px;
	font-size: 12pt;
	
	color: #FFFFFF;
	animation: light_red_blink 2s linear infinite;
}

.header_abon_status_user_blocked {
	padding: 0 0 0 20px;
	font-size: 12pt;
	
	color: #FFFFFF;
	animation: yellow_blink 2s linear infinite;
}

.header_abon_status_admin_blocked {
	padding: 0 0 0 20px;
	font-size: 12pt;
	
	color: #FFFFFF;
	animation: red_blink 2s linear infinite;
}

.header_abon_status_closed {
	padding: 0 0 0 20px;
	font-size: 16pt;

	color: #FFFFFF;
	animation: red_blink 2s linear infinite;
}

@keyframes red_blink { 0% { color: red; } 50% { color: #FFFFFF; } 100% { color: red; } }
@keyframes light_red_blink { 0% { color: #FFCCCC; } 50% { color: #FFFFFF; } 100% { color: #FFCCCC; } }
@keyframes yellow_blink { 0% { color: yellow; } 50% { color: #FFFFFF; } 100% { color: yellow; } }

/* ===================================================================================================================== Header USER BLOCK END */


/* ===================================================================================================================== Menu */
.menu_container {
	position: fixed;
	top: 20px;
	left: 0;
	width: 220px;
	padding: 10px 5px 10px 0;
	overflow-x: hidden;
	overflow-y: scroll;
	scrollbar-width: none;
    -ms-overflow-style: none;

    animation-duration: 1s;
	animation-name: fadeIn;
}

.menu_container::-webkit-scrollbar {
	display: none;
}

.menu_item_btn {
	margin: 0 0 5px 0;
	padding: 0;
	height: 38px;
	overflow: hidden;
}

.menu_item {
	cursor: pointer;
	color: #003399;

	background: #d0e4f7;
	background: -moz-linear-gradient(left,  #d0e4f7 0%, #73b1e7 24%, #0a77d5 50%, #539fe1 79%, #87bcea 100%);
	background: -webkit-linear-gradient(left,  #d0e4f7 0%,#73b1e7 24%,#0a77d5 50%,#539fe1 79%,#87bcea 100%);
	background: linear-gradient(to right,  #d0e4f7 0%,#73b1e7 24%,#0a77d5 50%,#539fe1 79%,#87bcea 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d0e4f7', endColorstr='#87bcea',GradientType=1 );

	text-shadow: 0 0 5px #FFF, 0 0 10px #FFF, 0 0 15px #FFF, 0 0 20px #99FFFF, 0 0 30px #99FFFF, 0 0 40px #99FFFF, 0 0 55px #99FFFF, 0 0 75px #99FFFF;

    -webkit-transform: perspective(300px) rotateX(-30deg);
    -o-transform: perspective(300px) rotateX(-30deg);
    -moz-transform: perspective(300px) rotateX(-30deg);
    -webkit-transform-origin: 0% 50%;
    -moz-transform-origin: 0% 50%;
    -o-transform-origin: 0% 50%;
    transform-origin: 0% 50%;

	width: calc(100% - 35px);
	height: 32px;
	line-height: 32px;
	border: 1px solid #FFFFFF;
	border-radius: 0 0 8px 0;
	box-shadow: 5px 5px 10px rgba(0,0,0,0.5);
	vertical-align: middle;
	padding: 0 0 0 5px;
	margin: 0 0 0 5px;
	overflow: hidden;

	white-space: nowrap;
	text-overflow: ellipsis;

	font-family: 'NewMenu', arial;
	font-size: 26px;

	transition: all 0.5s ease-in;
	transition-property: text-shadow, color;
}

.menu_item:hover {
	color: white !important;
	background: #009999 !important;
	text-shadow: none;
	transition: all 0.5s ease-out;
	transition-property: text-shadow, color;
}

.menu_item_sel {
	cursor: not-allowed !important;

	color: #339933 !important;

	background: rgb(57,130,53);
	background: -moz-linear-gradient(left,  rgba(57,130,53,1) 0%, rgba(138,182,107,1) 56%, rgba(201,222,150,1) 100%);
	background: -webkit-linear-gradient(left,  rgba(57,130,53,1) 0%,rgba(138,182,107,1) 56%,rgba(201,222,150,1) 100%);
	background: linear-gradient(to right,  rgba(57,130,53,1) 0%,rgba(138,182,107,1) 56%,rgba(201,222,150,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#398235', endColorstr='#c9de96',GradientType=1 );
}

.menu_item_sel:hover {
	color: white !important;
}

@keyframes menu_squash { 0% { transform: skew(-20deg) scaleY(0); } 100% { transform: skew(-20deg) scaleY(1); } }
@keyframes menu_squash_select { 0% { background: #0099FF; color: white; transform: skew(-20deg) scaleY(1); } 50% { background: #009999; color: yellow; transform: skew(-20deg) scaleY(0); } 100% { background: #009999; color: yellow; transform: skew(-20deg) scaleY(1); } }

/* ===================================================================================================================== Menu END */

/* ===================================================================================================================== SubMenu */
.submenu_container {
	width: calc(100% - 45px);
	height: auto;
	max-height: 0px;
	margin: 0px 0px 10px 30px;
	padding: 0;
	display: none;
	overflow: hidden;
}

.submenu_item_btn {
	margin: 0 0 5px 0;
	padding: 0;
	height: 30px;
	overflow: hidden;
}

.submenu_item {
	cursor: pointer;
	color: white;

	background: #004b7f !important;
	background: -moz-linear-gradient(top, #004b7f 0%, #107dea 100%) !important;
	background: -webkit-linear-gradient(top, #004b7f 0%,#107dea 100%) !important;
	background: linear-gradient(to bottom, #004b7f 0%,#107dea 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#004b7f', endColorstr='#107dea',GradientType=0 ) !important;

    -webkit-transform: perspective(300px) rotateX(-30deg);
    -o-transform: perspective(300px) rotateX(-30deg);
    -moz-transform: perspective(300px) rotateX(-30deg);
    -webkit-transform-origin: 0% 50%;
    -moz-transform-origin: 0% 50%;
    -o-transform-origin: 0% 50%;
    transform-origin: 0% 50%;

	width: calc(100% - 30px);
	height: 22px;
	line-height: 22px;
	border: 1px solid #FFFFFF;
	border-radius: 0 0 8px 0;
	box-shadow: 5px 5px 10px rgba(0,0,0,0.5);
	vertical-align: middle;
	padding: 0 0 0 5px;
	margin: 0 0 0 10px;
	overflow: hidden;

	white-space: nowrap;
	text-overflow: ellipsis;

	font-family: 'NewZelek', arial;
	font-size: 15px;

	animation-name: menu_squash !important;
	animation-delay: 0s !important;
	animation-duration: 0.5s !important;
	animation-timing-function: ease-in-out !important;
}

.submenu_item:hover {
	color: yellow !important;
	background: #009999 !important;
/*
	animation-name: menu_squash_select !important;
	animation-delay: 0s !important;
	animation-duration: 0.2s !important;
	animation-timing-function: ease-in-out !important;*/
	animation: none !important;
}

.submenu_item_sel {
	cursor: not-allowed !important;

	background: #66CCFF !important;
	background: -moz-linear-gradient(top, #66CCFF 0%, #107dea 100%) !important;
	background: -webkit-linear-gradient(top, #66CCFF 0%,#107dea 100%) !important;
	background: linear-gradient(to bottom, #66CCFF 0%,#107dea 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#66CCFF', endColorstr='#107dea',GradientType=0 ) !important;
	
	animation: none !important;
}

.submenu_item_sel:hover {
	background: #66CCFF !important;
	background: -moz-linear-gradient(top, #66CCFF 0%, #107dea 100%) !important;
	background: -webkit-linear-gradient(top, #66CCFF 0%,#107dea 100%) !important;
	background: linear-gradient(to bottom, #66CCFF 0%,#107dea 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#66CCFF', endColorstr='#107dea',GradientType=0 ) !important;

	color: white !important;
	animation: none !important;
}

/*======================================================================================= Infobar */
.infoBarContainer {
	position: absolute;
	min-width: 300px;
	max-width: 90%;
	height: 90px;
	left: 10px;
	top: calc(100% - 120px);
	padding: 8px;
	background: black;
	border: 1px solid white;
	border-radius: 8px;
	box-shadow: 5px 5px 5px rgba(0,0,0,0.5);
	opacity: 0.8;
	overflow: hidden;
	display: none;
}

.infoBarContainerAnim {
	-webkit-animation: infoBarFadeout 0.5s ease 2s;
	-moz-animation: infoBarFadeout 0.5s ease 2s;
	-ms-animation: infoBarFadeout 0.5s ease 2s;
	-o-animation: infoBarFadeout 0.5s ease 2s;
	animation: infoBarFadeout 0.5s ease 2s;
}

@keyframes infoBarFadeout {
    from { opacity: 0.8; }
    to   { opacity: 0; }
}
/*======================================================================================= Infobar END */

/*======================================================================================= MsgBox */
.globalMsgBox {
	position: fixed;
	min-width: 100px;
	min-height: 100px;
	max-width: calc(100% - 20px);
	max-height: calc(100% - 20px);
	border: 1px solid #FFFFFF;
	border-radius: 0 0 4px 4px;
	box-sizing:padding-box;
	box-shadow:10px 10px 10px rgba(0,0,0,0.5);
	margin: 0;
	padding: 0;
	background-color: #2E0384;
	outline: none;
	
	animation-duration: 0.7s;
	animation-name: msgbox_fadeIn;
}
@keyframes msgbox_fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes msgbox_bg_fadeIn { from { opacity: 0; } to { opacity: 0.3; } }

.globalMsgBox[data-type="info"] {
	background: #094c99;
	background: -moz-linear-gradient(top,  #094c99 0%, #168ae2 100%);
	background: -webkit-linear-gradient(top,  #094c99 0%,#168ae2 100%);
	background: linear-gradient(to bottom,  #094c99 0%,#168ae2 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#094c99', endColorstr='#168ae2',GradientType=0 );
}

.globalMsgBox[data-type="question"] {
	background: #094c99;
	background: -moz-linear-gradient(top,  #094c99 0%, #168ae2 100%);
	background: -webkit-linear-gradient(top,  #094c99 0%,#168ae2 100%);
	background: linear-gradient(to bottom,  #094c99 0%,#168ae2 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#094c99', endColorstr='#168ae2',GradientType=0 );
}

.globalMsgBox[data-type="error"] {
	background: #ff3236;
	background: -moz-linear-gradient(top, #ff3236 0%, #ff9b9b 100%);
	background: -webkit-linear-gradient(top, #ff3236 0%,#ff9b9b 100%);
	background: linear-gradient(to bottom, #ff3236 0%,#ff9b9b 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff3236', endColorstr='#ff9b9b',GradientType=0 );
}

.globalMsgBox[data-type="warning"] {
	background: #3f4c6b;
	background: -moz-linear-gradient(top,  #3f4c6b 0%, #606c88 100%);
	background: -webkit-linear-gradient(top,  #3f4c6b 0%,#606c88 100%);
	background: linear-gradient(to bottom,  #3f4c6b 0%,#606c88 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3f4c6b', endColorstr='#606c88',GradientType=0 );
}

.globalMsgBoxCaption {
	float: left;
	background: white;
	color: black;
	font-weight: bolder;
	font-family: tahoma;
	font-size: 18px;
	padding: 0 5px 0 5px;
	width: calc(100% - 10px);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.globalMsgBoxIcon {
	float: left;
	width: 48px;
	height: 48px;
	margin: 5px;
}

.globalMsgBoxIcon[data-type="info"] {
	background: url(/images/msg_info_48x48.png) no-repeat center center;
}

.globalMsgBoxIcon[data-type="question"] {
	background: url(/images/msg_question_48x48.png) no-repeat center center;
}

.globalMsgBoxIcon[data-type="stop"] {
	background: url(/images/msg_stop_48x48.png) no-repeat center center;
}

.globalMsgBoxIcon[data-type="hand"] {
	background: url(/images/msg_hand_48x48.png) no-repeat center center;
}

.globalMsgBoxIcon[data-type="error"] {
	background: url(/images/msg_error_48x48.png) no-repeat center center;
}

.globalMsgBoxIcon[data-type="warning"] {
	background: url(/images/msg_warning_48x48.png) no-repeat center center;
}

.globalMsgBoxText {
	color: #FFFFFF !important;
	min-height: 60px !important;
	padding: 10px !important;
	font-size: 14pt !important;
	text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}

.globalMsgBoxFooter {
	width: 100%;
	height: 50px;
	line-height: 50px;
	text-align: center;
	padding: 0;
	margin:0;
}

.globalMsgBoxFooter button {
	font-family: Arial !important;
	cursor: pointer !important;
	min-width: 64px !important;
	height: 32px !important;
	color: #FFFFFF !important;
	background: #0066FF !important;
	border: 1px solid white !important;
	border-radius: 4px !important;
	box-shadow: none !important;
	margin: 5px !important;
	padding: 0  !important;
}

.globalMsgBoxFooter button:hover {
	background: #0099FF !important;
}

.globalMsgBoxFooter button:disabled {
	font-family: Arial !important;
	cursor: not-allowed !important;
	min-width: 64px !important;
	height: 32px !important;
	color: #CCCCCC !important;
	background: #606060 !important;
	border: 1px solid white !important;
	border-radius: 4px !important;
	box-shadow: none !important;
	margin: 5px !important;
	padding: 0  !important;
}
/*======================================================================================= MsgBox END */

/* ===================================================== Block Panel */
.msg_block_text {
	display: block;
	color: #FFCCCC;
	font-size: 22pt;
	font-weight: bolder;
	padding: 5px;
	margin: 0;
	text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
	text-align: center;
}

.msg_block_text_user {
	display: block;
	color: #33CCFF;
	font-size: 22pt;
	font-weight: bolder;
	padding: 5px;
	margin: 0;
	text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
	text-align: center;
}

.msg_block_text_user_contacts {
	display: block;
	color: yellow;
	font-size: 18pt;
	font-weight: bolder;
	padding: 5px;
	margin: 0;
	text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
	text-align: center;
}

.msg_block_abon_name {
	display: none;
	font-size: 22pt;
	font-weight: bolder;
	text-align: center;
}

.msg_block_abon_balance_text {
	display: block;
	text-align: center;
	font-size: 16pt;
}

.msg_block_abon_balance_value {
	text-align: center;
	font-size: 16pt;
	color: #33FF00;
	padding: 0 10px 0 10px;
}

.msg_block_abon_debt_text {
	display: block;
	text-align: center;
	font-size: 16pt;
}

.msg_block_abon_debt_value {
	text-align: center;
	font-size: 16pt;
	color: #33FF00;
	padding: 0 10px 0 10px;
}

.msg_block_abon_deb_exp_date {
	text-align: center;
	font-size: 16pt;
	color: #33FF00;
	padding: 0 10px 0 10px;
}

.msg_block_abon_credit_text {
	display: block;
	text-align: center;
	font-size: 16pt;
}

.msg_block_abon_credit_value {
	text-align: center;
	font-size: 16pt;
	color: #33FF00;
	padding: 0 10px 0 10px;
}

.msg_block_deb_info {
	display: block;
	color: yellow;
	font-size: 16pt;
	font-style: italic;
	padding: 5px;
	margin: 0;
	text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}

.msg_block_abon_deb_info_exp_date {
	text-align: center;
	font-size: 16pt;
	color: #33FF00;
}

@keyframes jackInTheBox { from { opacity: 0; transform: scale(0.1) rotate(30deg); transform-origin: center bottom; } 50% { transform: rotate(-10deg); } 70% { transform: rotate(3deg); } to { opacity: 1; transform: scale(1); } }

@keyframes hinge { 0% { transform-origin: top left; animation-timing-function: ease-in-out; } 20%, 60% { transform: rotate3d(0, 0, 1, 80deg); transform-origin: top left; animation-timing-function: ease-in-out; }
40%, 80% { transform: rotate3d(0, 0, 1, 60deg); transform-origin: top left; animation-timing-function: ease-in-out; opacity: 1; } to { transform: translate3d(0, 700px, 0); opacity: 0;}
}