html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, 
address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, 
var,b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,
time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 100;
  src: local('Roboto Thin'), local('Roboto-Thin'), url(../fonts/Roboto-Thin.woff) format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: local('Roboto Light'), local('Roboto-Light'), url(../fonts/Roboto-Light.woff) format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto Regular'), local('Roboto-Regular'), url(../fonts/Roboto-Regular.woff) format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: local('Roboto Medium'), local('Roboto-Medium'), url(../fonts/Roboto-Medium.woff) format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: local('Roboto Bold'), local('Roboto-Bold'), url(../fonts/Roboto-Bold.woff) format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  src: local('Roboto Black'), local('Roboto-Black'), url(../fonts/Roboto-Black.woff) format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 100;
  src: local('Roboto Thin Italic'), local('Roboto-ThinItalic'), url(../fonts/Roboto-ThinItalic.woff) format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 300;
  src: local('Roboto Light Italic'), local('Roboto-LightItalic'), url(../fonts/Roboto-LightItalic.woff) format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 400;
  src: local('Roboto Italic'), local('Roboto-Italic'), url(../fonts/Roboto-Italic.woff) format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 500;
  src: local('Roboto Medium Italic'), local('Roboto-MediumItalic'), url(../fonts/Roboto-MediumItalic.woff) format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 700;
  src: local('Roboto Bold Italic'), local('Roboto-BoldItalic'), url(../fonts/Roboto-BoldItalic.woff) format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 900;
  src: local('Roboto Black Italic'), local('Roboto-BlackItalic'), url(../fonts/Roboto-BlackItalic.woff) format('woff');
}
/* General */
html, body {
	font-family: 'Roboto', sans-serif;
	position:relative;
	width: 100%;
	height: 100%;	
	overflow:hidden;
}

.background {
	position: absolute;
	width: 100%;
	height: 100%;	
	background: #353742;	
}

.background.pattern { background: url(../img/pattern_bg.png); }

.system_message {
	color: white;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	padding-top: 300px;	
	text-align: center;
	background: rgba(0, 0, 0, 0.75);
}
/* END: General */

/* Logo */
.logo {
	width: 187px;
	height: 74px;
	background: url(../img/logo.png);
	position: absolute;
	top: 32px;
	left: 31px;
}
/* END: Logo */

/* Group of buttons */
.btnGroup {
	background: #cacaca;
	font-size: 26px;
	letter-spacing: 0.5px;
}

.btnGroup div {
	color: #3B3B3B;
	background: #e1e1e1;
	height: 34px;
	padding: 11px 27px 9px 27px;
	float: left;
	margin-right: 1px;
}

.btnGroup div.last { margin-right: 0px; }
.btnGroup div.active { background: #00B5E8; color: white; }
.btnGroup div.focused { background: #245D74; color: white; border: solid 3px #1582A5; padding: 7px 24px; }
.btnGroup div.pressed { background: #1582A5; color: white; }
/* END: Group of buttons */

/* Position mainmenu button */
.mainmenu {
	position: absolute;
	top: 40px;
	left: 238px;
}
/* END: Position mainmenu button */

/* Bottom panel */
.bottom {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
}

.bottom_bg {
	padding: 14px 14px;
	background: rgba(0, 0, 0, 0.5);
}

.bottom .btn {
	height: 36px;
	float: right;
}
.bottom .btn.hid { display: none; }
.bottom .btn.l {
	height: 48px;
	float: left;
}
.bottom .frame_l, .bottom .frame_r {
	width: 3px;
	height: 100%;
	float: left;
}
.bottom .btn.focused .frame_l, .bottom .btn.focused .frame_r { background: url(../img/frame_lr.png); }
.bottom .btn.focused.gray .frame_l, .bottom .btn.focused.gray .frame_r { background: none; }
.bottom .cont {
	padding-top: 3px;
	float: left;
	height: 100%;
}
.bottom .btn.focused .cont { background: url(../img/frame36.png) repeat-x; }
.bottom .btn.focused.l .cont { background: url(../img/frame48.png) repeat-x; }
.bottom .btn.focused.gray .cont { background: none; }
.bottom .text {
	padding: 5px 8px 0 8px;
	letter-spacing: 0.5px;
	font-size: 18px;
	color: white;
	float: left;
}

.bottom .btn.gray .text {color: #5c5c5c;}
.bottom .icon + .text { padding-left: 2px; }
.bottom .btn .icon {
	float: left;
	width: 30px;
	height: 30px;
	background: url(../img/btm_icons_sml.png) no-repeat;
}

.bottom .btn .icon.iEnter 	{ background-position: 6px 6px; }
.bottom .btn .icon.iBack 		{ background-position: 6px -36px; }
.bottom .btn .icon.iMoveA 	{ background-position: 6px -80px; }
.bottom .btn .icon.iMaveUD 	{ background-position: 6px -125px; }
.bottom .btn .icon.iA 		{ background-position: 6px -167px; }
.bottom .btn .icon.iB 		{ background-position: 6px -204px; }
.bottom .btn .icon.iC 		{ background-position: 6px -240px; }
.bottom .btn .icon.iD 		{ background-position: 6px -275px; }
.bottom .btn .icon.iInfo 		{ background-position: 6px -322px; }


.bottom .btn.l .icon.iQMenu {	
 	height: 42px;
 	width: 95px;
 	background: url(../img/btm_icons.png) no-repeat;
 	background-position: 0px -210px; 	
}
.bottom .btn.l.gray .icon.iQMenu { background-position: -95px -210px; }

.bottom .btn.l .icon.iPSize { 
 	height: 42px;
 	width: 82px;
 	background: url(../img/btm_icons.png) no-repeat;
	background-position: 0px -252px;
}
.bottom .btn.l.gray .icon.iPSize { background-position: -82px -252px; }


/* END: Bottom panel */

/* message box */
.msgBox {
	display: block;
}
.msgBox .MBOpacity {
	position: fixed;
	background: black;
	top: 0px;
	left: 0px;
	z-index: 1000;
	width: 100%;
	height: 100%;
	opacity: 0.5;
}
.msgBox .MBInner {
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -100px;
	z-index: 1001;
	margin-left: -243px;
	padding: 7px;
	width: 486px;
	background: #ececec;
}
.msgBox .MBInner .MBInnerTitle {
	width: 456px;
	padding: 14px 16px 0 14px;
	background-color: #292f36;
	border-bottom: 1px solid #171a1e;
	height: 45px;
	font-size: 28px;
	color: white;
}
.msgBox .MBInner .MBInnerText {
	font-size: 18px;
	color: white;
	padding: 15px;
	background: #343C44;
	border-top: 1px solid #3f464e;
}
.msgBox .MBInner .MBInnerButtons {
	margin-top: 12px;
	margin-bottom: 5px;
	text-align: center;
}
.msgBox .MBInner .MBInnerButtons .MBInnerButtonsBtn {
	background: #454545;
	border: solid 3px #454545;
	color: white;
	display: inline-block;
	margin: 0 5px;
	cursor: pointer;
	width: 144px;
	height: 36px;
	padding-top: 12px;
	font-size:24px;
	text-align: center;
	
}
.msgBox .MBInner .MBInnerButtons .MBInnerButtonsBtn.hover {
	background: #005D75;
	border: solid 3px #0083A7;
}
/* END: message box */
.preloader {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;

	z-index: 1000;
	display: none;

	background: url(../img/loading.gif) no-repeat;
	background-position: center;
	background-color: black;
	opacity: 0.5;
}