/* CSS Document */

.legend h1 {
	font-size: 20px;
	text-align:center;
	padding: 20px;
	font-weight:bold;
	margin: 0px;
}
.lg-pending {
	display:inline-block;
	width:20px;
	height:20px;
	border-radius: 2px;
	-webkit-border-radius:2px;
	background:#d8af63;
		position:relative;
	top:2px;
}
.lg-paused {
	display:inline-block;
	width:20px;
	height:20px;
	border-radius: 2px;
	-webkit-border-radius:2px;
	background:#5c6ebb;
		position:relative;
	top:2px;
}

.pending {
	background: #d8af63;
	color: #fff !important;
	border-bottom: 1px solid #bd8a2c;
}

.pending td {
	box-shadow: 2px 1px 3px #bd9c60 !important;
	-webkit-box-shadow: 2px 1px 3px #bd9c60 !important;
}
.paused {
	background: #6379d8;
	color: #fff !important;
	border-bottom: 1px solid #4d4db8;
}

.paused td {
	box-shadow: 2px 1px 3px #5c6ebb !important;
	-webkit-box-shadow: 2px 1px 3px #5c6ebb !important;
}
.done {
	background: #4fc34f;
	color: #fff !important;
	border-bottom: 1px solid #30a530;
}
.done td {
	box-shadow: 2px 1px 3px #44ad44 !important;
	-webkit-box-shadow: 2px 1px 3px #44ad44 !important;
}
.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 th:before {
	position:absolute;
	content:"";
	border:10px solid transparent;
	border-top-color: #242424;
	top:100%;
	left:30%;
}
.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:'';
	height:10px;
	display:block;
}
.live-table thead {
	box-shadow: 0px 3px 3px #bcbcbc;
}
.legend h1 {
	font-size: 20px;
	text-align:center;
	padding: 20px;
	font-weight:bold;
	margin: 0px;
}
.lg-pending {
	display:inline-block;
	width:20px;
	height:20px;
	border-radius: 2px;
	-webkit-border-radius:2px;
	background:#d8af63;
		position:relative;
	top:2px;
}
.lg-done {
	display:inline-block;
	width:20px;
	height:20px;
	border-radius: 2px;
	-webkit-border-radius:2px;
	background:#4fc34f;
		position:relative;
	top:2px;
}
.table th {
	font-weight:normal;
}
.credit {
	font-size: 12px;
	font-style:italic;
}
.headline {
	text-transform:uppercase;
}
.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 */
}

.logo-thumb {
display:block;
height: 60px;
width: 200px;
margin: 15px 0px 5px 0px;
background: #ddd;
padding: 10px;
border-radius: 2px;
-webkit-border-radius: 2px;
}
*{
	outline:none !important;
}
.font-2 {
	font-family: 'Ubuntu Mono', monospace;
}
.f-700 {
	font-weight:700;
}
.f-900 {
	font-weight:900;
}
.my-login {
	width:100%;
	max-width: 400px;
	padding:20px;
	margin:auto;
	border-radius:2px;
	background: #142932;
}
.my-login h2 {
	font-size:20px;
	text-transform:uppercase;
}
a {
	color:#333;
	text-decoration: none;
}
a:hover, a:active, a:focus {
	color: #111;
	text-decoration:none;
}
body {
	color: #555;
	background: #fff;
}
.screen {
	background: #0F2027;
	color: #f2f2f2;
	height:100%;
	min-height: 100vh;
	width:100%;
}
.screen a {
	color: #fff;
}
.error {
	padding: 6px 15px;
	background: #df6b6b;
	margin: 5px 0px;
	color: #f2f2f2;
	border-radius: 2px;
	position:relative;
}
.error:before {
	content:"\e5cd";
	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;
	margin-right: 2px;
	position:relative;
	top:2px;
}
.success {
	padding: 6px 15px;
	background: #6dc087;
	margin: 5px 0px;
	color: #f2f2f2;
	border-radius: 2px;
	position:relative;
}
.success:before {
	content:"\ee93";
	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;
	margin-right: 2px;
	position:relative;
	top:2px;
}
.login-logo {
	max-width:200px;
	width:100%;
	margin: 50px 0px;
}
.my-label {
	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;
	margin-right: 2px;
	position:relative;
	top:2px;
}
.credit {
	text-align:center;
	padding: 50px 0px;
}
.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";
	}
	
}
.left-side {
	position:fixed;
	z-index: 100;
	overflow:hidden;
	left:0;
	width:100%;
	max-width:300px;
	padding:20px;
	bottom:0;
	background: #142932;
	color: #e7e7e7;
	height:100%;
}
.left-side:hover {
	overflow:auto;
}
.main-logo img{
	width:100%;
	max-width: 150px;
}
.dp {
	width:60px;
	height:60px;
	float:left;
	margin-right: 10px;
	background:#0F2027;
	border-radius: 50%;
    border: 4px solid #e7e7e7;
	position:relative;
}
.profile {
	width:100%;
	padding: 15px;
	background: #0F2027;
	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:18px;
	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: #0f2027;
	padding-left:25px;
}
.right-side {
	margin-left: 300px;
	overflow:hidden;
}
.homepage {
	width:100%;
	background: #0F2027;
background: -moz-linear-gradient(-45deg, #0F2027 0%, #0F2027 50%, #3d4191 50%, #0F2027 100%);
background: -webkit-linear-gradient(-45deg, #0F2027 0%,#0F2027 50%,#3d4191 50%,#0F2027 100%);
background: linear-gradient(135deg, #0F2027 0%,#0F2027 50%,#3d4191 50%,#0F2027 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0F2027', endColorstr='#0F2027',GradientType=1 );
	padding: 120px 50px;
	color: #e7e7e7;
	position:relative;
	text-align:center;
}
.home-face {
	width:100%;
	max-width:100px;
}
.homepage h1 {
	font-size:80px;
}
.homepage:before {
	content:"";
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:url(../img/bg.jpg) no-repeat fixed center center;
	background-size:cover;
	-webkit-background-size:cover;
	opacity: 0.1;
	position:absolute;
}
.home-hr {
	border: 2px solid #e7e7e7;
	border-radius: 3px;
}
.padding {
	padding: 80px 30px;
}
.feature {
	display:block;
	padding: 25px 10px;
	background:#0F2027;
	color: #e7e7e7;
	border-radius: 2px;
	margin-bottom:5px;
	text-transform:uppercase;
	font-weight:bold;
}
.timeline {
	position:relative;
}
.feature .icon {
	float: right;
    background: #444778;
    display: inline-block;
    width: 60px;
    height: 68px;
    position: relative;
    top: 0px;
    margin: -25px -10px;
	text-align:center;
	line-height:68px;
	border-radius: 2px;
}
.heading-hr {
	border:2px solid #555;
	border-radius:3px;
}
.me {
	display:inline-block;
	width:180px;
	height:180px;
	text-align:center;
	background: #e7e7e7;
	color: #555;
	line-height:180px;
	border-radius:50%;
}
.stat-area {
	background: #f2f2f2;
background: -moz-linear-gradient(left, #f2f2f2 0%, #f2f2f2 50%, #eaeaea 50%, #f2f2f2 100%);
background: -webkit-linear-gradient(left, #f2f2f2 0%,#f2f2f2 50%,#eaeaea 50%,#f2f2f2 100%);
background: linear-gradient(to right, #f2f2f2 0%,#f2f2f2 50%,#eaeaea 50%,#f2f2f2 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#f2f2f2',GradientType=1 );
	position:relative;
}
.stat {
	margin-bottom: 20px;
	text-align:center;
	text-transform:uppercase;
}
.text-custom {
	color: #0F2027;
}
.stat .icon {
	font-size:80px;
	width:100px;
	height:100px;
	background: #0F2027;
	border-radius:50%;
	text-align:center;
	line-height:100px;
	margin: 10px 0px;
	display:inline-block;
	color: #e7e7e7;
	position:relative;
	z-index:2;
}
.stat .icon:before {
	height: 100%;
    background: #0F2027;
    border-radius: 3px;
}
.counter {
	font-weight:bold;
	font-size: 30px;
}
.stat-tag {
	font-weight:bold;
}
.skill h3 {
	text-transform:uppercase;
	font-weight:bold;
	font-size: 20px;
	margin-top:15px;
}
.heading {
	width:100%;
	background: #142932;
	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 {
	background: #fff;
	padding: 20px;
	border-radius:2px;
	border:1px solid #f2f2f2;
	margin: 2px;
}
.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;
}
.ico {
	position:relative;
	width:25px;
	height:25px;
	background: #0F2027;
	border-radius:2px;
	color: #fff;
	line-height:25px;
	text-align:center;
	padding: 5px;
	margin-right: 15px;
}
.ico:after {
	position:absolute;
	content:"";
	border:10px solid transparent;
	border-left-color:#0F2027;
	top: 3px;
    left: 100%;
}
.settings-page a {
	display:block;
	width:100%;
	text-transform:capitalize;
}
.inside {
	margin-top:20px;
}
@media print {
  body  {
    visibility: hidden;
  }
  .printable, .printable * {
    visibility: visible;
  }
  .printable {
    position: fixed;
    left: 0;
    top: 0;
	right:0;
	width:100%;
	min-height:100%;
  }
}