/*!
 * Creative Web Designers (I) Pvt. Ltd.
 * Copyright 2018 
 */
@font-face {
  font-family: opensans;
  src: url("../fonts/opensans.ttf"); }
 
@font-face {
  font-family:raleway;
  src: url("../fonts/raleway-regular.ttf");
}
a {
  text-decoration: none; color:#222D32; }

img {
  max-width: 100%; }

.clear {
  clear: both; }

body {
  background: #e4e5e6;
  position: relative;
  font-family: opensans;
  height:100%;
  font-size:14px;
   }

body.dark { background:#222d32; }

.login-logo { text-align:center; padding:0 10px 20px; }	

/* ---- Login Screen ---- */
.parent {
  min-height: 100vh;
  align-items: center;
  display: flex; }

.white-bg { background:#FFF;padding: 20px; box-shadow:1px 1px 10px 1px rgba(0,0,0,0.1); }

.login-box {
  justify-content: center;
  margin: auto;
  flex-wrap: wrap;
  width: 350px; }
  .login-box h1 {
    font-size: 24px;
    margin: 0; }
    .login-box h1 span {
      color: #8c8c8c;
      display: block;
      font-size: 13px;
      margin: 10px 0 15px;
      font-weight: normal; }
  .login-box .input-group {
    margin: 15px 0;
    width: 100%; }
    .login-box .input-group input {
      width: 85%;
      padding: 5px;
      border: 1px solid #ced4da; }
  .login-box .input-group-text {
    border-radius: 0; }
  .login-box p {
    font-size: 12px;
    margin-top: 10px; }
  .login-box a {
    color: #20a8d8; }
  .login-box .alert { font-size:13px; }

.true-btn {
  background: #222D32;
  color: #fff;
  border-radius: 0;
  border: 0;
  padding: 7px 20px;
  margin-top: 5px;
  border-radius:20px;
  cursor:pointer; }

.left-bar {
  width: 200px;
  float: left;
  background: #222d32;
  height: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
  top: 60px;
  overflow: auto; }
.signout 
{
	font-weight: 100;
    background: #1A2226;
    color: #fff;
    border: 0;
	display:inline-block;
    font-size: 14px;
    padding: 7px 10px!important;
	
}
.signout:hover{ color:#fff;}
.top-bar {
  padding: 10px;
  background-color: #f3f3f3;
  background-image: -moz-linear-gradient(top, #f3f3f3, #e2e2e2);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f3f3f3), to(#e2e2e2));
  background-image: -webkit-linear-gradient(top, #f3f3f3, #e2e2e2);
  background-image: -o-linear-gradient(top, #f3f3f3, #e2e2e2);
  background-image: linear-gradient(to bottom, #f3f3f3, #e2e2e2);
  height: 60px; }
  
  .top-bar button.fullscreen {
    margin-right: 20px; }
	
  .top-bar .welcome-msg { font-size:14px; margin-top:7px; float:left; margin-right:20px }

.user-actions {
  float: right; margin-top:4px; }
  .user-actions button, .user-actions form {
    float: left; }
  .user-actions form {
    margin: 0 10px; }
  .user-actions form input[type=text] {
    padding: 5px;
    height: 31px;
     }
  .user-actions form button[type=submit] {
    background: #20a8d8;
    border: 0;
    color: #FFF;
    padding: 3px 10px; }

.right-panel {
  margin-left: 200px; background:#f7f7f7; min-height:100vh; padding-bottom:50px; }

.toggle-btn {
  display: none; }

.breads {
  background: #1a2226;
  color: #fff;
  padding: 10px 20px;
  font-size: 12px; }

.page-title {
    padding: 20px 20px;
    background: #fff;
    margin: 20px;
    box-shadow: 1px 1px 10px 1px rgba(0,0,0,0.1);
	}
  .page-title h1 {
    font-weight: normal;
    font-size: 26px;
	color:#4c4f53;
	 font-family:raleway;
 }

.main-content {
  padding: 20px;
  background: #FFF;
  margin: 0px 20px 20px;
  box-shadow: 1px 1px 10px 1px rgba(0,0,0,0.1);
  font-size:13px;
  }
.main-content .panel .btn { width:100%; margin:10px 0; min-height:300px; color:#FFF; }
.main-content .panel .btn-success { min-height:unset; }
.main-content .panel .btn-success span { margin:10px !important; }
.main-content .panel .btn span { display:block; font-size:18px; margin-bottom:20px; font-weight:bold; border-bottom:1px solid rgba(255,255,255,0.1); padding-bottom:10px; }
.main-content .panel .btn a { color:#FFF; font-size:14px; }

.main-content .panel .btn span i
{
	background:#FFF;
	color:#000;
	width:80px;
	height:80px;
	border-radius:40px;
	margin:20px auto;
	line-height:80px;
}

.panel-box h3
{
    margin-bottom: 5px;
    font-size: 18px;
    background: rgb(244, 244, 244);
    padding: 10px;
}
.boxes1 {
    min-height: 200px;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(238, 238, 238);
    border-image: initial;
    padding: 20px;
}
.boxes2 {
    margin-bottom: 15px;
    border: 1px solid #eee;
    padding: 10px;
    min-height: 120px;
}
.boxes2 p { padding:10px; margin:0 }
.panel-box a { color:#0690d2; }

.main-content h3
{
    background: #f4f4f4;
    padding: 10px;
    margin-bottom: 5px;
    font-size: 16px;
	margin:20px 0;
}

.main-content .form-control
{
	border-radius:0;
	font-size:13px;
	padding:10px;
	border:1px solid #dee5ec;
}	

.page-item.active .page-link { background:#2B6B9F;border-color:#2B6B9F }
.page-link { color:#2B6B9F }



body .copyright {
  position: absolute;
  top: 100%;
  bottom: 0;
  right: 20px;
  color: #ccc;
  font-size: 12px;
  padding: 20px 0 20px 20px; }

h2 {
    letter-spacing: -1px;
    font-size: 22px;
    line-height: normal;
}
label { width:100%; }
textarea { width:100%; }


.main-content table { width:100%; }
.main-content table th {
    background: #222D32;
    color: #fff;
    font-weight: 100;
    font-size: 13px;
	padding:5px;
}
.main-content .table{ width:100%;}
.main-content .table-bordered td, .table-bordered th{
    line-height: 1.42857;
    padding: 5px;
    vertical-align: top;
	border-collapse:collapse;}

table td.prod img {
    height: 80px;
    text-align: center;
    max-width: 80%;
}

.main-content table .edit {
    background: #669933;
    border: 0;
    color: #fff;
    padding: 5px 25px;
}
.main-content table .del
{
    background: #D20606;
    border: 0;
    color: #fff;
    padding: 5px 25px;
}

.form-group { margin:20px 0; overflow:auto; }
.main-content .col-sm,.main-content .col-sm-1,.main-content .col-sm-10,.main-content .col-sm-11,
.main-content .col-sm-12,.main-content .col-sm-2,.main-content .col-sm-3,.main-content .col-sm-4,
.main-content .col-sm-5,.main-content .col-sm-6, .main-content .col-sm-7,.main-content .col-sm-8,
.main-content .col-sm-9,.main-content .col-sm-auto
{
	float:left;
}
 

/*==========*/
  

.completionList{ background:#fff; list-style:none;  
color: windowtext;
border: buttonshadow;
border-width: 1px;
border-style: solid;
cursor: 'default';
overflow: auto;
height: 250px;
text-align: left;
list-style-type: none;
padding-left:8px!important;}
.completionList li:hover{ background:#ddd; cursor:pointer;}
.completionList li.active{background:#ddd;}
.completionList li{ border-bottom:1px solid #ccc; padding:3px 0px !important;}
.main-content input{  width:100%;}
.main-content table tbody tr td a { border:0; border-radius:0; padding:2px 8px; line-height:inherit; color:#888;}
.main-content table tbody tr td a .fa{ font-size:12px; color:#fff; }
tr:nth-child(even) {background-color: #f2f2f2;}
.btn-primary{ background:#1A2226; font-size:13px; border:0; border-radius:0;}
.btn{border-radius:0;}

@media (max-width: 767px) {
  .toggle-btn {
    display: block;
    color: #FFF;
    float: right;
    margin: 5px 20px ;
    z-index: 905;
    position: relative;
	cursor:pointer; }

  .top-bar {
    height: auto; }

  .left-bar {
    position: relative;
    width: 100%;
    top: auto;
    float: none; }

  .right-panel {
    margin-left: 0; }
  .top-bar p.welcome-msg { display:none; }
  .add-product{ width:100% !important;}	
  .left-bar { overflow:inherit; }
 }
