/*================================================================================
	Item Name: Materialize - Material Design Admin Template
	Version: 5.0
	Author: PIXINVENT
	Author URL: https://themeforest.net/user/pixinvent/portfolio
================================================================================

NOTE:
------
PLACE HERE YOUR OWN CSS CODES AND IF NEEDED, OVERRIDE THE STYLES FROM THE OTHER STYLESHEETS.
WE WILL RELEASE FUTURE UPDATES SO IN ORDER TO NOT OVERWRITE YOUR STYLES IT'S BETTER LIKE THIS.  */
@import url(https://fonts.googleapis.com/css?family=Exo:300,300i,400,400i,500,600);

html {
  font-family: Exo, sans-serif !important;
  font-weight: normal;
  line-height: 1;
  color: #6b6f82;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: Exo, sans-serif;
  font-weight: 400;
  line-height: 1;
  /*color: #333;*/
  color: #6b6f82;
}

p {
  font-family: Exo, sans-serif;
}

.navbar .notification-badge {
  font-family: Exo, sans-serif;
  position: relative;
  top: -20px;
  right: 5px;
  margin: 0 -0.8em;
  padding: 1px 3px;
  color: #fff;
  border-radius: 50%;
  background-color: #ff4081;
  box-shadow: 0 0 10px 0 #ff4081;
}

#breadcrumbs-wrapper.breadcrumbs-inline .breadcrumbs-title {
  padding-right: 20px;
  border-right: none;
}

.brand-sidebar .brand-logo {
  color: #6b6f82 !important; /* theme color*/
}

.login-bg {
  background-repeat: no-repeat;
  background-size: cover;
  background-color: #eaeaea !important; /* theme color*/
}

.btn,
.btn-large,
.btn-small {
  cursor: pointer;
  -webkit-transition: background-color 0.2s ease-out;
  transition: background-color 0.2s ease-out;
  text-align: center;
  text-decoration: none;
  letter-spacing: 0.3px;
  color: #fce300 !important;
  /*color: #ffffff !important;*/
  padding: 0 1rem;

  background-color: #000 !important; /* theme color*/
  /*background-color: #000000 !important; !* theme color*!*/
}

.btn-floating {
  /*background-color: #000000; !* theme color*!*/
  background-color: #000; /* theme color*/
  color: #fce300 !important;
}

.btn-floating i {
  color: #fce300 !important;
}

.btn-floating:hover {
  background-color: #818181 !important; /* theme color*/
}

.btn:hover,
.btn-large:hover,
.btn-small:hover {
  background-color: #818181 !important; /* theme color*/
}

.fixed-action-btn .fab-backdrop {
  background-color: #000000 !important; /* theme color */
}

.navbar-main {
  background-color: #000000 !important; /* theme color*/
}

.pagination li.active {
  color: #fce300 !important;
  background-color: #000 !important; /* theme color*/
  /*color: #fff;*/
  /*background-color: #000000 !important; !* theme color*!*/
}

.pagination li.active a {
  color: #fce300;
}

.sidenav-active-rounded .sidenav li > a.active {
  background: #000000; /* theme color*/
  /*background: -webkit-linear-gradient(45deg, #000000, #818181) !important; !* theme color*!*/
  /*background: linear-gradient(45deg, #000000, #818181) !important; !* theme color*!*/
  background: -webkit-linear-gradient(
    45deg,
    #000,
    #fce300
  ) !important; /* theme color*/
  background: linear-gradient(45deg, #000, #fce300) !important; /* theme color*/
  box-shadow: 3px 3px 20px 0 rgb(161, 161, 161); /* theme color*/
}

footer.page-footer {
  background-color: #000000 !important; /* theme color*/
}

.dropdown-content li > a,
.dropdown-content li > span {
  color: #000000; /* theme color*/
}
.datepicker-table td.is-selected {
  background-color: #000000; /* theme color*/
  color: white !important;
}
.datepicker-table td.is-today {
  color: #fd1919;
  font-weight: bold !important;
}

.datepicker-date-display {
  background-color: #000000; /* theme color*/
}
.datepicker-cancel,
.datepicker-clear,
.datepicker-today,
.datepicker-done {
  color: #000000; /* theme color*/
}
button,
input,
optgroup,
select,
textarea {
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}
.timepicker-close {
  color: #000000; /* theme color */
}

.timepicker-digital-display {
  background-color: #000000; /* theme color */
}
.timepicker-tick.active,
.timepicker-tick:hover {
  background-color: #818181; /* theme color */
  color: #fff;
}
.timepicker-canvas line {
  stroke: #818181; /* theme color */
}
.timepicker-canvas-bearing {
  fill: #818181; /* theme color */
}
.timepicker-canvas-bg {
  fill: #818181; /* theme color */
}

#cs_loader {
  margin: auto;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 9999;
  background-color: black; /* theme color*/
  position: fixed;
  opacity: 0.5;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  display: none;
}

.cs_disabled {
  background-color: #dfdfdf !important;
  box-shadow: none !important;
  color: #9f9f9f !important;
  cursor: default !important;
}

.card-alert {
  margin-top: 0px;
  padding-top: 5px;
  padding-bottom: 5px;
}

.card-alert button {
  padding-top: 10px;
}

.cs-bold {
  font-weight: bold;
}

.cs-text-info {
  font-size: 14px;
  font-weight: bold;
}

.cs-text-info-curr {
  font-size: 14px;
  font-weight: bold;
}

.cs-tab {
  height: 35px;
  /*width: 200px;*/
  /*padding: 5px;*/
  /*margin: 5px;*/
  text-align: center;
  padding: 0;
  margin-left: 0;
  margin-right: 0;
  padding-top: 5px;
}

.cs-tab-disabled {
  background-color: grey;
  border: solid 1px silver;
  color: darkgray;
}

.cs-tab-enabled {
  background-color: white;
  border: solid 1px silver;
  color: black; /* theme color*/
}

.cs-mat-image {
  padding-left: 60px;
  padding-right: 60px;
  padding-bottom: 65px;
  background-color: transparent !important;
  min-width: 0 !important;
  /*width: 200px !important;*/
  height: 175px !important;
}

.cs-mat-image-container {
  border: solid 1px silver;
  height: 250px;
  background-color: #757575;
}

.cs-mat-image-container-selected {
  border: solid 4px #0d47a1;
  background-color: #2196f3;
}

.token.operator {
  background: none !important;
}

.cs-panel-header {
  background-color: #000000 !important; /* theme color*/
  padding: 15px;
  font-size: 20px;
  font-weight: 300;
  color: #fce300; /* theme color*/
  margin-bottom: -15px !important;
}

.time-range {
  font-weight: 600 !important;
  font-size: 12px !important;
  margin-left: -10px !important;
  margin-right: -10px !important;
  margin-top: 13px !important;
  border-radius: 2px;
  background-color: #fff;
  line-height: 22px;
  float: right;
  box-sizing: border-box;
  min-width: 3rem;
  height: 22px;
  padding: 0 6px;
  text-align: center;
  cursor: pointer;
  color: #000000 !important; /* theme color */
}

.time-range .static {
}

.time-range-selected {
  color: #fff !important;
  background-color: #000000; /* theme color */
}

.input-disabled {
  background-color: #ebebe4;
  border: 1px solid #abadb3;
  padding: 2px 1px;
}

.card-panel .cs-header {
  margin-top: -15px;
  margin-bottom: 10px;
  margin-left: -10px;
}

.modal-content .card-title {
  font-size: 24px;
  font-weight: 300;
  margin-left: 10px;
  margin-bottom: 15px;
}

.cs-label-header {
  color: #9e9e9e;
  margin-left: -3px;
  font-size: 0.8rem;
}

.modal .easy-autocomplete {
  width: 100% !important;
}

.easy-autocomplete {
  width: auto !important;
}

.ticket-input {
  border-bottom: none !important;
  color: #6b6f82 !important;
  margin: 0 !important;
}

.modal-header {
  font-size: 20px;
  font-weight: 300;
  text-align: center;
  background-color: #000000 !important; /* theme color*/
  padding: 20px;
  color: #fce300;
  /*margin: -24px -24px 15px;*/
}

nav {
  color: #fce300;
}

.page-footer .footer-copyright {
  background-color: transparent;
  color: #fce300;
}

.num-aligned .currency {
  color: #6b6f82 !important;
  text-align: right !important;
}

.num-aligned tr {
  border: none !important;
  padding: 0 !important;
}

.num-aligned td {
  padding: 0 !important;
}

.btn-inverted {
  background-color: white !important;
  color: #000000 !important; /* theme color*/
}

.plain-table tr {
  /*border: none !important;*/
}

.plain-table td {
  padding: 5px;
}

[type="checkbox"]:checked + span:not(.lever):before {
  top: -4px;
  left: -5px;

  width: 12px;
  height: 22px;

  -webkit-transform: rotate(40deg);
  -ms-transform: rotate(40deg);
  transform: rotate(40deg);
  -webkit-transform-origin: 100% 100%;
  -ms-transform-origin: 100% 100%;
  transform-origin: 100% 100%;

  border-top: 2px solid transparent;
  border-right: 2px solid #000000; /* theme color*/
  border-bottom: 2px solid #000000; /* theme color*/
  border-left: 2px solid transparent;

  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.documentWindow {
  width: 80% !important;
  max-height: 80% !important;
  height: 100% !important;
}

.pagination li {
  width: 40px !important;
  margin: 1px !important;
  text-align: center;
}

.pagination li.active.number {
  box-shadow: 0 0 8px 0 #444 !important;
  border-radius: 4px !important;
}

.pagination li.number:hover {
  box-shadow: 0 0 8px 0 #444 !important;
  background-color: #000 !important;
  /*background-color: #000000 !important;*/
  border-radius: 4px !important;
}

.pagination li.number a:hover {
  color: #fce300 !important;
  /*color: white !important;*/
}

[type="radio"]:checked + span:after,
[type="radio"].with-gap:checked + span:after {
  background-color: #000000;
}

[type="radio"]:checked + span:after,
[type="radio"].with-gap:checked + span:before,
[type="radio"].with-gap:checked + span:after {
  border: 2px solid #fce300;
}

.collapsible-body .row.margin {
  margin-top: -15px !important;
}

.header div.header {
  margin-left: -20px;
}

.header nav {
  box-shadow: none !important;
  background-color: inherit !important;
  margin-left: -15px;
  margin-bottom: -30px !important;
  margin-top: 10px !important;
}

nav a {
  color: #6b6f82 !important;
  font-size: 24px !important;
  line-height: 1;
  font-weight: 300;
}

nav a.link {
  color: rgba(107, 111, 130, 0.55) !important;
}

.breadcrumb:before {
  color: black !important;
}

.collapsible-header.panel {
  background-color: #000000 !important; /* theme color*/
  font-size: 17px;
  font-weight: 300;
  color: #ffffff;
  /*
    margin-bottom: -15px !important;
    */
}

.switch label input[type="checkbox"]:checked + .lever {
  background-color: rgba(1, 48, 1, 0.25) !important;
}

.switch label input[type="checkbox"]:checked + .lever:after {
  background-color: #000 !important;
}

.switch label input[type="checkbox"] + .lever {
  background-color: rgba(170, 153, 0, 0.25) !important;
}

.switch label input[type="checkbox"] + .lever:after {
  background-color: #fce300 !important;
}

.error {
  color: red !important;
  top: -20px !important;
}

@media only screen and (max-width: 600px) {
  .tran-switch {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
  }

  .tran-lever {
    margin-top: -31px !important;
  }
}

.dd-label {
  top: -20px !important;
  font-size: 12px !important;
}

.graph-content {
  border: silver 1px solid;
  border-radius: 5px;
  -webkit-border-radius: 5px;
}

.hide-data {
  background: #e2e2e2 !important;
  /*color: transparent;*/
  position: relative;
  overflow: hidden;
}

.hide-data::before {
  content: "";
  position: absolute;
  left: 0%;
  top: 0;
  height: 100%;
  width: 50px;
  background: linear-gradient(to right, #e2e2e2 25%, #d5d5d5 50%, #e2e2e2 100%);
  animation-name: gradient-animation;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  filter: blur(5px);
}

@keyframes gradient-animation {
  from {
    left: 0%;
  }
  to {
    left: 100%;
  }
}