body
{
	background: url('img/bg_all.png');
}

a
{
	color: #5ca3ef;
}
a img
{
	border: 0;
}

hr
{
	color: #cdcdcd;
	background-color: #cdcdcd;
	border: 0px none;
	height: 1px;
	clear: both;
}

/****************************************************
 * Header
 */
#header
{
	color: #fff;
	background-color: #3B475F;
	border-bottom: 2px solid #323E57;
	overflow: hidden;
}

.site-logo
{
	display: inline-block;
	vertical-align: middle;
	padding: 9px 25px;
}

/****************************************************
 * Personal
 */
table#personal
{
	height: 60px;
	/*height: 100%;*/
	min-width: 200px;
	vertical-align: middle;
	float: right;
	background-color: #303645;
	/*padding: 5px;*/
	box-sizing: inherit;
	-moz-box-sizing: inherit;
	box-shadow: 2px 0 5px 2px rgba(255,255,255,.2);
}
table#personal td
{
	padding: 0 10px;
	text-align: left;
}
table#personal tr:first-child td:first-child
{
	border-bottom: 1px solid #5ca3ef;
}
table#personal tr:first-child  td:last-child
{
	border-left: 1px solid #5ca3ef;
}
table#personal a
{
	text-decoration: none;
}

/****************************************************
 * Body
 */
#body
{
	background-color: #fff;
	box-shadow: 0 0 5px 2px rgba(0,0,0,.2);
	-webkit-box-shadow: 0 0 5px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 0 5px 2px rgba(0,0,0,.2);

	overflow-x: auto;
}

/****************************************************
 * Sidebar
 */
#sidebar
{
	color: #fff;
	background-color: #3B475F;
	
}
#sidebar:hover
{
	overflow-y: auto;
}

/****************************************************
 * Left menu
 */
.left-menu a
{
	display: block;
	color: #fff;
	padding: 10px;
	border-left: 3px solid transparent;
	text-decoration: none;
}
.left-menu a:hover,
.left-menu a.__active
{
	background-color: #303645;
	border-left-color: #5ca3ef;
}
.left-menu a span
{
	display: inline-block;
	vertical-align: middle;
	width: 18px;
	height: 18px;
	margin: 0 10px;
	background: url('img/ico_menu.png') no-repeat;
}
.left-menu a span.menu_workspace
{
	background-position: 0 0 !important;
}
.left-menu a span.menu_history
{
	background-position: -18px 0 !important;
}
.left-menu a span.menu_statistic
{
	background-position: -36px 0 !important;
}
.left-menu a span.menu_faq
{
	background-position: -54px 0 !important;
}
.left-menu a span.menu_customization
{
	background-position: -72px 0 !important;
}
.left-menu a span.menu_license
{
	background-position: -90px 0 !important;
}
.left-menu a span.menu_help
{
	background-position: -108px 0 !important;
}
.left-menu a span.menu_users
{
	background-position: -126px 0 !important;
}
.left-menu a span.menu_downloads
{
	background-position: -144px 0 !important;
}

/****************************************************
 * Label view print
 */
#label-view-print
{
	margin: 40px 0;
}
#label-view-print a.print-button
{
	display: block;
	margin: 10px;
	padding: 10px;
	color: #fff;
	text-decoration: none;
	text-align: center;
	border: 1px solid #fff;
}
#label-view-print a.print-button:hover
{
	background-color: #303645;
	border-color: #5ca3ef;
}

/****************************************************
 * Headers H1-H4
 */
header 
{
    text-align: center;
}
header > h1,
header > h2,
header > h3,
header > h4,
header > button
{
	display: inline-block;
	vertical-align: middle;
	padding: 0 10px;
}


/****************************************************
 * Scroll-fixed page heading
 */
#scroll_fixed-heading
{
    top: 0;
    background-color: #fff;
    /*overflow: hidden;*/
    z-index: 10;
}

/****************************************************
 * Battery icon
 */
.battery-ico 
{
	position: relative;
	display: inline-block;
	font-size: 3px;
	width: 4.5em;
	height: 10em;
	margin: 4em 1.5em 1.5em;
	border: 1em solid white;
	border-width: .5em 1em;
	box-shadow: 0 0 0 1.0em #959595;

	background-color: #959595;
	background-image: linear-gradient(180deg,
		white .5em,
		white .5em,
		transparent .5em,
		transparent 2em,
		white 2em,
		white 3em,
		transparent 3em,
		transparent 4.5em,
		white 4.5em,
		white 5.5em,
		transparent 5.5em,
		transparent 7em,
		white 7em,
		white 8em,
		transparent 8em,
		transparent 9.5em,
		white 9.5em
	);
	background-size: 100%;
}
.battery-ico:before 
{
	display: block;
	position: absolute;
	top: -4.0em;
	left: 0em;
	background-color: #959595;
	width: 4.5em;
	height: 1.5em;
	content : "";
	border-radius: 1em 1em 0 0;
}
.battery-ico:after 
{
	position: absolute;
	top: 0em;
	left: 0em;
	display: block;
	background-color: white;
	width: 4.5em;
	height: 0;
	content : "";
}
.battery-ico.level-75:after
{
	height: 2em;
}
.battery-ico.level-50:after
{
	height: 4.5em;
}
.battery-ico.level-25:after
{
	height: 7em;
}
.battery-ico.level-25
{
	background-color: red;
}
.battery-ico.level-0:after
{
	height: 9.5em;
}

/****************************************************
 * License counter
 */
.license-counter_client-info.table
{
	color: #959595;
}
.license-counter_client-info.table span:nth-child(2n+1)
{
	font-size: 1.3em;
	font-weight: normal;
}
.license-counter_client-info.table span:nth-child(2n)
{
	width: 200px;
}

.license-counter_header
{
    text-align: left;
    padding: 15px 0;
}
.license-counter_header > h4
{
    display: inline-block;
    color: #959595;
}

/****************************************************
 * Tabs
 */
ul.nav-tabs
{
	padding: 0;
	margin: 0;
	list-style-type: none;
	display: inline-block;
	vertical-align: middle;
}
ul.nav-tabs li
{
	float: left;
}
ul.nav-tabs li a
{
	display: inline-block;
	vertical-align: middle;
	min-width: 100px;
	text-align: center;
	text-decoration: none;
	border: 2px solid transparent;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
}
ul.nav-tabs li a:hover
{
	border-color: #5ca3e7;
}
ul.nav-tabs li a._in
{
	background-color: #F1F4F7;
	font-weight: bold;
}

.tab-content > *
{
	display: none;
}
.tab-content ._in
{
	display:block;
	animation: panel-fadeEffect .5s;
	-webkit-animation: panel-fadeEffect .5s;
}
@-webkit-keyframes panel-fadeEffect {
	from {opacity: 0;}
	to {opacity: 1;}
}
@keyframes panel-fadeEffect {
	from {opacity: 0;}
	to {opacity: 1;}
}

/****************************************************
 * Messages
 */

.message
{
	margin: 10px auto;
	padding: 10px;
	border: 1px solid transparent;
}
.message:empty
{
	display: none;
}

.message.__error
{
	background-color: #FBE3E4;
	border-color: #FBC2C4;
	color: #D12F19;
}
.message.__success
{
	background-color: #E6EFC2;
	border-color: #C6D880;
	color: #529214;
}
.message.__warning
{
	background-color: #fdeaa8;
	border-color: #9F6000;
	color: #9F6000;
}

/****************************************************
 * Loader
 */

.loader 
{
	border: 8px solid #f3f3f3;
	border-radius: 50%;
	border-top: 8px solid #3498db;
	width: 30px;
	height: 30px;
	-webkit-animation: spin 2s linear infinite;
	animation: spin 2s linear infinite;
	margin: auto;
}

@-webkit-keyframes spin 
{
	0% { -webkit-transform: rotate(0deg); }
	100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin 
{
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

/****************************************************
 * Grades
 */

.grades label
{
	padding: 0 10px;
	
}

.grades div
{
	display: inline-block;
	width: 120px;
}

 /****************************************************
 * Snackbar
 */
#snackbar {
    visibility: hidden; /* Hidden by default. Visible on click */
    min-width: 250px; /* Set a default minimum width */
    margin-left: -125px; /* Divide value of min-width by 2 */
    background-color: #333; /* Black background color */
    color: #fff; /* White text color */
    text-align: center; /* Centered text */
    border-radius: 2px; /* Rounded borders */
    padding: 16px; /* Padding */
    position: fixed; /* Sit on top of the screen */
    z-index: 1; /* Add a z-index if needed */
    left: 50%; /* Center the snackbar */
    bottom: 30px; /* 30px from the bottom */
}

/* Show the snackbar when clicking on a button (class added with JavaScript) */
#snackbar.show {
    visibility: visible; /* Show the snackbar */

/* Add animation: Take 0.5 seconds to fade in and out the snackbar.
However, delay the fade out process for 2.5 seconds */
    -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
    animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

/* Animations to fade the snackbar in and out */
@-webkit-keyframes fadein {
    from {bottom: 0; opacity: 0;}
    to {bottom: 30px; opacity: 1;}
}

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

@-webkit-keyframes fadeout {
    from {bottom: 30px; opacity: 1;}
    to {bottom: 0; opacity: 0;}
}

@keyframes fadeout {
    from {bottom: 30px; opacity: 1;}
    to {bottom: 0; opacity: 0;}
}

.abutton
{
	display: inline-block;
	border: 1px solid #5ca3ef;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	min-width: 30px;
	text-decoration: none;
	text-align: center;
}
.abutton:hover
{
	color: #fff;
	background-color: #5ca3ef;
}