.lg {
	padding:5px 10px;
	float:left;
	margin: 3px;
	text-transform:uppercase;
	margin:auto;
	color: #fff;
}
.legend {
	float:left;
	width:100%;
	margin:auto;
}
.lg-prepare {
	background: #9fb0e2;
}
.lg-start {
	background: #74d681;
}
.lg-paused {
	background: #d8b367;
}
.lg-incomplete {
	background: #d67476;
}
.lg-pending {
	background: #fff;
	color:#333 !important;
}

.prepare {
	background: #9fb0e2;
	color: #fff !important;
	border-bottom: 1px solid #8496cb;
}

.prepare td {
	box-shadow: 2px 1px 3px #9ba7ca !important;
	-webkit-box-shadow: 2px 1px 3px #9ba7ca !important
}
.start {
	background: #74d681;
	color: #fff !important;
	border-bottom: 1px solid #73bf7d;
}

.start td {
	box-shadow: 2px 1px 3px #5fd26e !important;
	-webkit-box-shadow: 2px 1px 3px #5fd26e !important
}
.incomplete {
	background: #d67476;
	color: #fff !important;
	border-bottom: 1px solid #d67476;
}

.incomplete td {
	box-shadow: 2px 1px 3px #c16a6c !important;
	-webkit-box-shadow: 2px 1px 3px #c16a6c !important
}
.pause {
	background: #ebc575;
	color: #fff !important;
	border-bottom: 1px solid #ebc575;
}

.pause td {
	box-shadow: 2px 1px 3px #d8b367  !important;
	-webkit-box-shadow: 2px 1px 3px #d8b367  !important
}
.modal-head {
	border-bottom: 1px solid #eee;
    padding-bottom: 10px;
}
.sugg li{
	list-style:none;
	padding: 3px;
	cursor:pointer;
}
.sugg {
	margin-bottom:5px;
}
.live-table .btn {
	box-shadow:none;
}
.live-table {
	background: #fff;
	width:100%;
}
.live-table th, td{
	padding: 3px;
}
.live-table th {
	background: #242424;
color: #d3d3d3;
border: 2px solid #1d1d1e;
padding: 5px;
position:relative;
}

.live-table tbody td {
	border: 0px solid #e1e1e1;
padding: 5px;
box-shadow: 2px 1px 3px #ececec;
-webkit-box-shadow: 2px 1px 3px #ececec;
}
.live-table tbody:before {
	content:'';
	display:block;
}
.live-table thead {
	box-shadow: 0px 3px 3px #bcbcbc;
}
.no-wrap {
	white-space:nowrap
}
.form-group .form-control{
	margin-bottom: -10px;
	margin-right: 5px;
}
.selector {
	margin-bottom: 20px;
	width:100%;
}
.pagination {
	width:100%;
	display:block;
	padding:10px;
	text-align:center;
}
.pagination .btn {
	box-shadow:none !important;
}
.error {
	font-family: 'Ubuntu Mono', monospace;
	padding: 10px;
	color:#bf5f5f;
	width:100%;
}
.error:before {
	content:"\ef34";
	font-family: 'icomoon' !important;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	
	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	position:relative;
	top:2px;
	right: 2px;
	width:10px;
	height:10px;
	background:#bf5f5f;
	color: #fff;
	line-height:10px;
	text-align:center;
	border-radius:50%;
	-webkit-border-radius:50%;
}
.success {
	font-family: 'Ubuntu Mono', monospace;
	padding: 10px;
	color:#5aa15a;
	width:100%;
}
.success:before {
	content:"\ef35";
	font-family: 'icomoon' !important;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	
	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	position:relative;
	top:2px;
	right: 2px;
	width:10px;
	height:10px;
	background:#5aa15a;
	color: #fff;
	line-height:10px;
	text-align:center;
	border-radius:50%;
	-webkit-border-radius:50%;
}
.loader {
	display:block;
	width:100%;
	margin:5px 0px;
	font-size: 25px;
}
.loader:before {
	content:"\eb1b";
	animation: loader 1s linear infinite;
	-webkit-animation: loader 2s linear infinite;
	font-family: 'icomoon' !important;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	
	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
@keyframes loader{
	25% {
		content:"\eb1f";
	}
	50% {
		content: "\eb20";
	}
	75% {
		content: "\eb12";
	}
	
}

 /* Customize the label (the container) */
.checkbox {
  display: block;
  position: relative;
  padding-left: 22px;
  margin-bottom: 12px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.checkbox input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 18px;
  width: 18px;
  background-color: #d2d2d2;
  border-radius:2px;
  -webkit-border-radius:2px;
}

/* On mouse-over, add a grey background color */
.checkbox:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.checkbox input:checked ~ .checkmark {
  background-color: #716ACA;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.checkbox input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.checkbox .checkmark:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
} 
/*end checkbox */
.btn {
	margin-right:5px;
}
* {
	outline:none !important;
}
.screen {
	min-height:100vh;
	height:auto;
	background: #000;
	overflow:hidden;
	top:0;
	position:relative;
}
.screen:before {
	content:"";
	height:100%;
	width:100%;
	background:url(../img/head.jpeg) no-repeat center center;
	opacity:0.1;
	background-size:cover;
	-webkit-background-size:cover;
	position:absolute;
}
.screen .credit, .screen .credit a {
	color: #ddd !important;
}
.login-logo {
	margin-top:100px;
	width:150px;
}
.my-login {
	width:100%;
	max-width:350px;
	margin:auto;
	margin-top: 50px;
	padding: 25px;
	overflow:hidden;
	-webkit-box-shadow: 0px 1px 15px 1px rgba(69,65,78,0.08);
	box-shadow: 0px 1px 15px 1px rgba(69,65,78,0.08);
	background-color: #fff;
	border-radius: 4px;
	position:relative;
	z-index: 999;
}
.credit {
	text-align:center;
	padding: 25px 5px;
}
.font-2 {
	font-family: 'Ubuntu Mono', monospace;
}
body {
	color: #81838c;
	background: #f2f3f8;
}
a {
	color: #555;
}
a:hover, a:active, a:focus {
	color: #5867dd;
	text-decoration:none;
}
.my-login h2 {
	font-size:24px;
	text-transform:uppercase;
	margin:0px;
	padding:10px 10px 10px 0px;
	
}
.my-label, thead {
	font-family: 'Ubuntu Mono', monospace;
}
.my-label:before {
	content: "\edb2";
	font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  position:relative;
  top:2px;
  right: 2px;
}
.left-side {
	position:fixed;
	z-index: 100;
	overflow:hidden;
	left:0;
	width:100%;
	max-width:300px;
	padding:20px;
	bottom:0;
	background: #2c3144;
	color: #e7e7e7;
	height:100%;
}
.left-side:hover {
	overflow:auto;
}
.main-logo img{
	width:100%;
	max-width: 200px;
}
.dp {
	width:60px;
	height:60px;
	float:left;
	margin-right: 10px;
	background:#505393;
	border-radius: 50%;
    border: 4px solid #e7e7e7;
	position:relative;
}
.profile {
	width:100%;
	padding: 20px;
	background: #505393;
	margin: 20px 10px 0px -20px;
    position: absolute;
	box-shadow: 0px 0px 3px #1e1e1e;
}
.left-side a {
	color: #e7e7e7;
}
.profile-divide {
	position: relative;
	width: 100%;
	clear: both;
	margin-top: 140px;
}
.label {
	font-size:12px;
	position:relative;
	display:block;
	width:100%;
	margin-bottom: 15px;
	text-align:right;
}
.nav-menu ul {
	padding: 0px;
	margin: 0px -20px 10px -20px;
}
.nav-menu li a {
	width:100%;
	display:block;
}
.nav-menu li{
	list-style:none;
	width:100%;
	padding: 10px 15px;
	margin:3px 0px;
	text-transform:uppercase;
	transition:all ease .3s;
}
.nav-menu li:hover {
	background: #262a3c;
	padding-left:25px;
}

.name {
	font-size:14px;
}
.main-logo {
	width:150px;
}
.right-side {
	margin-left: 300px;
	overflow:hidden;
}
.heading {
	width:100%;
	background: #2c3144;
	padding: 100px 50px;
	color: #e7e7e7;
	position:relative;
	text-transform:uppercase;
}
.heading:before {
	content:"";
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:url(../img/head.jpeg) no-repeat bottom center;
	background-size:cover;
	-webkit-background-size:cover;
	opacity: 0.1;
	position:absolute;
}
.admin-menu {
	border-radius: 2px;
	background: #f7f7f7;
	overflow:hidden;
	padding: 20px;
	margin: -50px 20px 20px 20px;
	position:relative;
}
.pan {
	-webkit-box-shadow: 0px 1px 15px 1px rgba(69,65,78,0.08);
	box-shadow: 0px 1px 15px 1px rgba(69,65,78,0.08);
	background-color: #fff;
	border-radius: 4px;
	padding: 20px;
	border:1px solid #f2f2f2;
	margin: 2px;
	margin-bottom: 10px;
}
.headline {
	text-transform:uppercase;
	font-size:16px;
	display:block;
	width:100%;
}
.admin-menu h1 {
	font-size:24px;
	margin: -20px -20px 25px -20px;
	text-transform:uppercase;
	border-bottom: 1px dashed #f2f2f2;
	padding:10px;
	border-bottom: 1px solid #e7e7e7;
}

.settings-page a {
	display:block;
	width:100%;
	text-transform:capitalize;
}
.settings-page a:hover, .settings-page a:focus {
	color: #111;
}
.inside {
	margin-top:20px;
}
.inputfile {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.inputfile + label {
    max-width: 80%;
    /* 20px */
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
    display: inline-block;
    overflow: hidden;
	
    /* 10px 20px */
}

.no-js .inputfile + label {
    display: none;
}

.inputfile:focus + label,
.inputfile.has-focus + label {
}

.inputfile + label * {
    /* pointer-events: none; */
    /* in case of FastClick lib use */
}

.inputfile + label svg {
    width: 1em;
    height: 1em;
    vertical-align: middle;
    fill: currentColor;
    margin-top: -0.25em;
    /* 4px */
    margin-right: 0.25em;
    /* 4px */
}
.table .btn {
	box-shadow:none;
}
.logo-thumb {
	float: left;
	clear:left;
height: 60px;
width: 200px;
margin: 5px;
background: #ddd;
padding: 10px;
border-radius: 2px;
-webkit-border-radius: 2px;
}
