body{
  color:#555;
  font-size:0.9em;
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
   color: #555;
}

.space{
  height:80px;
}

.card{
  transition: all .3s ease;
}

.card-header {
  background-color: #fff;
   border-bottom: 1px solid rgba(0, 0, 0, .1)
}

.router-box{
  background-color:#f8f8f8;
  border:1px solid #f4f4f4;
  border-radius:3px;
  padding:20px;
  margin-top:10px;
  font-size:0.9em;
  line-height:2em;
}


#graph-container{
  height:70vh;
}

@media (max-width:500px) {
  #graph-container{
    height:50vh;
  }
}

.title{
  font-weight: 700;
  margin-bottom:5px;
}

#device-info p{
  margin-bottom:5px;
}

.img-icon{
  width:30px;
  height:30px;
}

table.dataTable thead tr {
   background-color: #f4f4f4;
   color: #555555;
}

.table thead th {
	border-top: none;
	font-weight: 500
}

.table td,
.table th,
.table thead th {
	border-bottom: 1px solid rgba(234, 243, 253, .9)
}

.table-striped tbody tr:nth-of-type(odd) {
	background-color: #f0f6ff
}

.table.table-bordered,
.table.table-bordered td,
.table.table-bordered th::after,
.table.table-bordered thead th {
	border: 1px solid rgba(234, 243, 253, .9)
}

.table.v-align-middle tr td {
	vertical-align: middle
}

.table.table-borderless td,
.table.table-borderless th,
.table.table-borderless thead th {
	border: none!important
}

table.dataTable {
	border-collapse: collapse!important
}

.dataTables_info,
.dataTables_paginate {
	margin: 25px 0 15px!important
}

.pagination .page-item.disabled .page-link,
.pagination .page-link {
	color: #6c757d;
	background-color: transparent;
	border-color: transparent
}

.pagination .page-item.active .page-link {
	z-index: 1;
	color: #fff;
	background-color: #399AF2 !important;
	border-color: #399AF2;
	border-radius: 100%;
	box-shadow: none;
	outline: 0;
	width: 30px;
	height: 30px;
	text-align: center;
	padding: 8px 0 0
}

.pagination a:link,
.pagination a:visited {
	color: #353a40;
	line-height: 1
}

.pagination a:hover {
	color: #399AF2
}

.pagination a:active,
.pagination a:focus {
	box-shadow: none;
	outline: 0
}

.table-bordered.dataTable,
.table-bordered.dataTable td,
.table-bordered.dataTable th {
	border: 1px solid rgba(234, 243, 253, .9)
}

.nav-item{
  margin-left: 10px;
  margin-right: 10px;
}

.nav-item .nav-link{
  text-transform:uppercase;
}

.container-front{
   position:relative;
   z-index:100;
}

.banner_background {
   position: absolute;
   top: 0;
   left: 50%;
   z-index: 1;
   width: 100%;
   height: 100%;
   width: 100%;
   user-select: none;
   transform: translateX(-50%);
   background: #006fcf;
}

.banner_background>svg {
   position: absolute;
   bottom: -1px;
   left: -1px;
   right: -1px;
   float: left
}
.svg-banner-shape {
   fill: #f4f4f4;
}

.front-toolbar a.btn-dark{color:#fff;}
.front-toolbar a.nav-link{color:#fff !important; text-transform: uppercase;}
.front-toolbar .navbar{
  box-shadow: none !important;
}
.front-text{
   text-align: center;
   padding:100px 0px 50px 0px;
}
.front-text h1{
   font-size: 52px;
   font-weight: 700;
   line-height: 64px;
   color:#fff;
}
.front-text h2{
   color:#eee;
}

.features {
   background-color: #fff;
   border-radius: 5px;
   text-align: center;
   padding:20px;
}

.features:hover{
   margin-top: 0.5em;
   transition: all .4s ease;
   -webkit-transition: all .4s ease;
}

.features img{
   padding:30px;
}

.features .price{
   color:#006fcf;
   font-weight: 700;
}


.login-form .form-control{
   padding:0.8em;
}




table.panel{
  width:100%;
}

table.panel tr td{
   vertical-align: middle;
}

.btn-register, .btn-login{
   margin:0px 10px;
   min-width: 160px;
   font-weight: 700 !important;
}

.btn-register:hover, .btn-login:hover{
   margin-top: 0.1em;
   transition: all .4s ease;
   -webkit-transition: all .4s ease;
}
.btn-register{
   background-color:#fff;
   color:#006fcf !important;
}
.btn-login{
   border:1px solid #fff !important;
   color:#fff !important;
}

.navbar-dark .navbar-toggler {
  border-color: #ddd;
}

.login-alternative{
   margin-top:20px;
   font-size:0.9em;
   text-align: center;
}

@media (max-width: 768px) {
   .btn-register, .btn-login {
      width:100%;
      margin-bottom: 10px;
   }
}

.label-success i{
   color:#4cbb17;
   font-size:1.5em;
}
.label-danger i{
   color:#ff0000;
   font-size:1.5em;
}

a.btn-success{
   color:#fff !important;
}

.tgl-btn{
    font-size:0.8em !important;
}

.waves-input-wrapper{
  display:block !important;
}

.td-label{
  font-weight:700;
}

.btn-icon{
  padding:2.5px 10px 2px 7px !important;
  font-size:0.75em !important;
}
.btn-icon2{
  padding:1.5px 7px 1px 7px !important;
  font-size:0.75em !important;
  margin-left:5px !important;
  margin-right:5px !important;
}

.location-select{
  padding-top:0px !important;
  padding-bottom:0px !important;
}

.location-select .md-form{
  margin-top: 10px !important;
  margin-bottom: 0px !important;
}

.location-select .form-control{
  margin: 0px !important;
  padding: 0px !important;
}

.md-form input:not([type]),
.md-form input[type="text"]:not(.browser-default),
.md-form input[type="password"]:not(.browser-default),
.md-form input[type="email"]:not(.browser-default),
.md-form input[type="url"]:not(.browser-default),
.md-form input[type="time"]:not(.browser-default),
.md-form input[type="date"]:not(.browser-default),
.md-form input[type="datetime"]:not(.browser-default),
.md-form input[type="datetime-local"]:not(.browser-default),
.md-form input[type="tel"]:not(.browser-default),
.md-form input[type="number"]:not(.browser-default),
.md-form input[type="search"]:not(.browser-default),
.md-form input[type="search-md"],
.md-form textarea.md-textarea{
  border:1px solid #bbb !important;
  border-radius: 3px !important;
}

.select-dropdown{
  text-indent: 10px;
}
.md-form label{
  background-color:#fff !important;
  margin-left:10px;
  padding-left:5px;
  padding-right:5px;
  z-index: 10;
}

.green2{
  background-color:#a2cd45;
}

.sign-in-form {
	max-width: 450px;
	margin: 10% auto;
	padding: 30px
}

.logo-form{
  border-bottom: 1px solid #eee;
  padding-bottom:15px;
  text-align:center;
}
.logo-form img{
width:70%;
}

.login-text{
   font-size:1.8em;
   text-align: center;
   margin-top:20px;
   margin-bottom:20px;
}

#grapharea{
  border:1px solid #eee;
  padding:0px;
  margin:0px;
  width:100%;
  height:80vh;
  position:relative;
}
.node{
	position:absolute;
	width:110px;
	background:#666;
	color : #fff;
	padding:2px 10px;
	cursor:pointer;
  font-size:0.7em;
}

.node-icon{
  position:absolute;
  right:-5px;
  top:-5px;
  border-radius:50%;
  width:30px;
  height:30px;
  border:1px solid #bbb;
}

ol.ga{
  line-height:2em;
  padding-left:20px;
}

.alert-success{
  background-color:#00C851;
  color:#fff;
}
.alert-success a{
  color:#fff;
}



.dropzone,
.dropzone * {
   box-sizing: border-box
}

.dropzone.dz-clickable {
   cursor: pointer
}

.dropzone.dz-clickable * {
   cursor: default
}

.dz-message{
  margin:0px !important;
}

.dropzone.dz-clickable .dz-message,
.dropzone.dz-clickable .dz-message * {
   cursor: pointer
}

.dropzone.dz-started .dz-message {
   display: none;
}

.dropzone.dz-drag-hover {
   border-style: solid
}

.dropzone.dz-drag-hover .dz-message {
   opacity: .5
}

.dropzone .dz-preview.dz-file-preview .dz-details,
.dropzone .dz-preview:hover .dz-details {
   opacity: 1
}

.dropzone .dz-message {
   text-align: center;
   margin: 1em 0
}

.dropzone .dz-preview {
   position: relative;
   display: inline-block;
   vertical-align: top;
   margin: 16px;
   min-height: 80px;
}

.dropzone .dz-preview:hover {
   z-index: 1000
}

.dropzone .dz-preview.dz-file-preview .dz-image {
   border-radius: 20px;
   background: #f0f6ff;
   background: linear-gradient(to bottom, #f0f6ff, #b6cade)
}

.dropzone .dz-preview.dz-image-preview {
   background: #fff
}

.dropzone .dz-preview.dz-image-preview .dz-details {
   transition: opacity .2s linear
}

.dropzone .dz-preview .dz-remove {
   font-size: 14px;
   text-align: center;
   display: block;
   cursor: pointer;
   border: none
}

.dropzone .dz-preview .dz-remove:hover {
   text-decoration: underline
}

.dropzone .dz-preview .dz-details {
   z-index: 20;
   position: absolute;
   top: 0;
   left: 0;
   opacity: 0;
   font-size: 13px;
   min-width: 100%;
   max-width: 100%;
   padding: 2em 1em;
   text-align: center;
   color: rgba(0, 0, 0, .9);
   line-height: 150%
}

.dropzone .dz-preview .dz-details .dz-size {
   margin-bottom: 1em;
   font-size: 16px
}

.dropzone .dz-preview .dz-details .dz-filename {
   white-space: nowrap
}

.dropzone .dz-preview .dz-details .dz-filename:hover span {
   border: 1px solid rgba(200, 200, 200, .8);
   background-color: rgba(255, 255, 255, .8)
}

.dropzone .dz-preview .dz-details .dz-filename:not(:hover) {
   overflow: hidden;
   text-overflow: ellipsis
}

.dropzone .dz-preview .dz-details .dz-filename:not(:hover) span {
   border: 1px solid transparent
}

.dropzone .dz-preview .dz-details .dz-filename span,
.dropzone .dz-preview .dz-details .dz-size span {
   background-color: rgba(255, 255, 255, .4);
   padding: 0 .4em;
   border-radius: 3px
}

.dropzone .dz-preview:hover .dz-image img {
   -webkit-transform: scale(1.05, 1.05);
   transform: scale(1.05, 1.05);
   -webkit-filter: blur(8px);
   filter: blur(8px)
}

.dropzone .dz-preview .dz-image {
   border-radius: 3px;
   overflow: hidden;
   width: 110px;
   height: 110px;
   position: relative;
   display: block;
   z-index: 10
}

.dropzone .dz-preview .dz-image img {
   display: block
}

.dropzone .dz-preview.dz-success .dz-success-mark {
   -webkit-animation: passing-through 3s cubic-bezier(.77, 0, .175, 1);
   animation: passing-through 3s cubic-bezier(.77, 0, .175, 1)
}

.dropzone .dz-preview.dz-error .dz-error-mark {
   opacity: 1;
   -webkit-animation: slide-in 3s cubic-bezier(.77, 0, .175, 1);
   animation: slide-in 3s cubic-bezier(.77, 0, .175, 1)
}

.dropzone .dz-preview .dz-error-mark,
.dropzone .dz-preview .dz-success-mark {
   pointer-events: none;
   opacity: 0;
   z-index: 500;
   position: absolute;
   display: block;
   top: 50%;
   left: 50%;
   margin-left: -27px;
   margin-top: -27px
}

.dropzone .dz-preview .dz-error-mark svg,
.dropzone .dz-preview .dz-success-mark svg {
   display: block;
   width: 54px;
   height: 54px
}

.dropzone .dz-preview.dz-processing .dz-progress {
   opacity: 1;
   transition: all .2s linear
}

.dropzone .dz-preview.dz-complete .dz-progress {
   opacity: 0;
   transition: opacity .4s ease-in
}

.dropzone .dz-preview:not(.dz-processing) .dz-progress {
   -webkit-animation: pulse 6s ease infinite;
   animation: pulse 6s ease infinite
}

.dropzone .dz-preview .dz-progress {
   opacity: 1;
   z-index: 1000;
   pointer-events: none;
   position: absolute;
   height: 16px;
   left: 50%;
   top: 50%;
   margin-top: -8px;
   width: 80px;
   margin-left: -40px;
   background: rgba(0, 111, 207, .9);
   -webkit-transform: scale(1);
   border-radius: 8px;
   overflow: hidden
}

.dropzone .dz-preview .dz-progress .dz-upload {
   background: #333;
   background: linear-gradient(to bottom, #006fcf, #000);
   position: absolute;
   top: 0;
   left: 0;
   bottom: 0;
   width: 0;
   transition: width .3s ease-in-out
}

.dropzone .dz-preview.dz-error .dz-error-message {
   display: block
}

.dropzone .dz-preview.dz-error:hover .dz-error-message {
   opacity: 1;
   pointer-events: auto
}

.dropzone .dz-preview .dz-error-message {
   pointer-events: none;
   z-index: 1000;
   position: absolute;
   display: block;
   display: none;
   opacity: 0;
   transition: opacity .3s ease;
   border-radius: 8px;
   font-size: 13px;
   top: 130px;
   left: -10px;
   width: 140px;
   background: #ff5c75;
   padding: .5em 1.2em;
   color: #fff
}

.dropzone .dz-preview .dz-error-message:after {
   content: '';
   position: absolute;
   top: -6px;
   left: 64px;
   width: 0;
   height: 0;
   border-left: 6px solid transparent;
   border-right: 6px solid transparent;
   border-bottom: 6px solid #ff5c75
}

.card[data-widget=dropzone] .card-body .dz-message i.gradient-1,
.card[data-widget=dropzone] .card-body .dz-message i.gradient-2,
.card[data-widget=dropzone] .card-body .dz-message i.gradient-3 {
   font-size: 30px;
   display: block;
   text-align: center
}
.card[data-widget=dropzone]{
   box-shadow:none;
   margin: 0px;
   padding:0px 0px;
}
.card[data-widget=dropzone] .card-body{
   margin: 0px;
   padding:0px;
}

.card[data-widget=dropzone] .card-body .dropzone {
   margin: 0px;
   background: #f0f6ff;
   border: 1px solid #006fcf;
   border-radius: 3px;
}

.card[data-widget=dropzone] .card-body .dropzone:hover {
   cursor: pointer
}

.card[data-widget=dropzone] .card-body .dropzone:hover .btn {
   margin-top: 0
}

.card[data-widget=dropzone] .card-body .dz-message {
   background: #f0f6ff;
   padding: 8px  10px;
   transition: all .3s ease;
   border-radius: 5px
}

.card[data-widget=dropzone] .card-body .dz-message i.gradient-1:before {
   background: #5c84e8;
   background: linear-gradient(135deg, #5c84e8 1%, #006fcf 65%);
   background-clip: text;
   text-fill-color: transparent;
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent
}

.card[data-widget=dropzone] .card-body .dz-message i.gradient-2:before {
   background: #640aef;
   background: linear-gradient(135deg, #640aef 0, #f64a91 82%);
   background-clip: text;
   text-fill-color: transparent;
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent
}

.card[data-widget=dropzone] .card-body .dz-message i.gradient-3:before {
   background: #2ec7b1;
   background: linear-gradient(135deg, #2ec7b1 1%, #42a4f4 65%);
   background-clip: text;
   text-fill-color: transparent;
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent
}

.dropzone-upload-icon{
  padding:30px 0px;
  border:1px solid #ddd;
  background-color: #f4f4f4;
}
.dropzone-upload-icon i{
  color:#006fcf;
}


a.action-link{
  color:#006fcf !important;
  font-weight:bold;
  white-space: nowrap !important;
  font-size:0.9em;
}

.select-user{
  padding:5px;
  width:140px;
  border-radius:3px;
  border-color:#aaa;
}

.img-circular {
   margin: 0px auto;
   background-size: cover;
   display: block;
   border-radius: 3%;
   -webkit-border-radius: 3%;
   -moz-border-radius: 3%;
}

.btn-sm2{
   padding:4px 15px !important;
 }
 
 .dt-body-right{
   text-align:right !important;
 }
 .dt-body-center{
   text-align:center !important;
 }

 
.md-form input:not([type]),
.md-form input[type="text"]:not(.browser-default),
.md-form input[type="password"]:not(.browser-default),
.md-form input[type="email"]:not(.browser-default),
.md-form input[type="url"]:not(.browser-default),
.md-form input[type="time"]:not(.browser-default),
.md-form input[type="date"]:not(.browser-default),
.md-form input[type="datetime"]:not(.browser-default),
.md-form input[type="datetime-local"]:not(.browser-default),
.md-form input[type="tel"]:not(.browser-default),
.md-form input[type="number"]:not(.browser-default),
.md-form input[type="search"]:not(.browser-default),
.md-form input[type="search-md"],
.md-form textarea.md-textarea{
  border:1px solid #bbb !important;
  border-radius: 3px !important;
}

.select-dropdown{
  text-indent: 10px;
}
.md-form label{
  background-color:#fff !important;
  margin-left:10px;
  padding-left:5px;
  padding-right:5px;
  z-index: 10;
}

.select-wrapper>label.mdb-main-label.active{
  top:5px !important;
  background-color:#fff !important;
  width:auto;
  z-index:100;
}

.multiple-select-dropdown .dropdown-content li:hover, .dropdown-content li.active{
background-color: #fff !important;
}

.nowrap{
   white-space: nowrap;
}

.datatable-date{
   white-space: nowrap;
   font-size:0.8em;
}

#sortable { list-style-type: none; margin: 0; padding: 0; }
#sortable li { margin: 0 3px 3px 3px; padding: 0.4em; padding-left:1.5em; font-size: 0.8em; }
#sortable li span { position: absolute; margin-left: -1.3em; }


.item-file{
   width:20%;
   display: table-cell;
 }
 .item-file-wrapper{
   padding:10px;
   height:100%;
 }
 .item-image{
   position:relative;
   border:1px solid #eee;
 }
 
 @media (max-width: 576px) {
   .item-file{
     width:50%;
   }
 }
 @media (min-width: 577px) and (max-width: 768px) {
   .item-file{
     width:30%;
   }
 }
 @media (min-width: 769px) and (max-width: 992px) {
   .item-file{
     width:25%;
   }
 }
 
 .square {
   width: 100%;
   padding-bottom: 100%;
   position: relative;
 }
 
 .dz-message{
    padding:20px;
 }