﻿@charset "UTF-8";
/* CSS Document */
body {
    background: #eeeeee !important;
}
.kt-aside-menu {
    background-color: #000;
}

.kt-login.kt-login--v6 .kt-login__content .kt-login__section .kt-login__title {
    margin-bottom: 8rem;
}

.kt-login.kt-login--v6 .kt-login__aside .kt-login__wrapper .kt-login__container .kt-login__form .form-control {
    padding: 1rem;
    font-size: 1.4rem;
}

@media (min-width: 220px) and (max-width: 420px) {

    .kt-login.kt-login--v6 .kt-login__aside .kt-login__wrapper .kt-login__container {
        width: 220px;
    }
}

@media (min-width: 768px) {

    .mobileEdit .col-md-12 {
        max-width: 50%;
    }

    .mobileEdit .kt-widget26 {
        width: 75%;
    }
}

@media (min-width: 240px) {

    .mobileEdit .col-sm-12 {
        max-width: 50%;
    }

    .mobileEdit .kt-widget26 {
        width: 75%;
    }
}





.kt-dialog--loader i {
  position: relative;
  display: inline-block;
  margin: 0 4px;
  width: 5px;
  height: 15px;
  border-radius: 2px;
  border: solid #690;
  border-width: 0 1px 1px 0;
  background: #9b2;
  animation: tilt infinite 5s cubic-bezier(0.955, -0.010, 1.000, 1.000);
  transform-origin: 100% 100%;
}

.kt-dialog--loader i::before {
  content: '';
  position: absolute;
  z-index: -1;
  bottom: 0;
  display: block;
  width: 5px;
  height: 5px;
  background: transparent;
  box-shadow: 0 2px rgba(0,0,0,.3);
  animation: stretch infinite 5s cubic-bezier(0.955, -0.010, 1.000, 1.000);
  opacity: 0;
  transform-origin: 0% 0%;
}

.kt-dialog--loader i:nth-child(2),
.kt-dialog--loader i:nth-child(2)::before {
  animation-delay: .3s;
}

.kt-dialog--loader i:nth-child(3),
.kt-dialog--loader i:nth-child(3)::before {
  animation-delay: .6s;
}

.kt-dialog--loader i:nth-child(4),
.kt-dialog--loader i:nth-child(4)::before {
  animation-delay: .9s;
}

.kt-dialog--loader i:nth-child(5),
.kt-dialog--loader i:nth-child(5)::before {
  animation-delay: 1.2s;
}

.kt-dialog--loader i:last-of-type {
  animation-name: tilt-last;
}

.kt-dialog--loader i:last-of-type::before {
  animation-name: stretch-last;
}

@keyframes tilt {
  10% { transform: rotate(70deg) }
  60% { transform: rotate(70deg) }
  70% { transform: rotate( 0deg) }
}

@keyframes tilt-last {
  10% { transform: rotate(90deg) }
  60% { transform: rotate(90deg) }
  70% { transform: rotate( 0deg) }
}

@keyframes stretch {
  10% { transform: rotate(-70deg); width: 10px; opacity: 1; left: 0px; bottom: -1px; }
  60% { transform: rotate(-70deg); width: 10px; opacity: 1; }
  70% { width: 5px; transform: rotate(0deg); opacity: 0; }
}

@keyframes stretch-last {
  10% { transform: rotate(-90deg); width: 10px; height: 2px; opacity: .5; left: 3px; bottom: -1px; }
  60% { transform: rotate(-90deg); width: 10px; height: 2px; opacity: .5; }
  70% { transform: rotate(0deg); width: 5px; height: 5px;opacity: 0;}
}

.kt-dialog--loader {
  position: relative;
  display: block;
  margin: auto;
  padding: 0;
  width: 100px;
  height: 15px;
  text-align: center;
}

/* Loading Animation start */
@-webkit-keyframes outerRotate1 {
  0% {
    transform: translate(-50%, -50%) rotate(0);
  }
  100% {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
@-moz-keyframes outerRotate1 {
  0% {
    transform: translate(-50%, -50%) rotate(0);
  }
  100% {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
@-o-keyframes outerRotate1 {
  0% {
    transform: translate(-50%, -50%) rotate(0);
  }
  100% {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
@keyframes outerRotate1 {
  0% {
    transform: translate(-50%, -50%) rotate(0);
  }
  100% {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
@-webkit-keyframes outerRotate2 {
  0% {
    transform: translate(-50%, -50%) rotate(0);
  }
  100% {
    transform: translate(-50%, -50%) rotate(-360deg);
  }
}
@-moz-keyframes outerRotate2 {
  0% {
    transform: translate(-50%, -50%) rotate(0);
  }
  100% {
    transform: translate(-50%, -50%) rotate(-360deg);
  }
}
@-o-keyframes outerRotate2 {
  0% {
    transform: translate(-50%, -50%) rotate(0);
  }
  100% {
    transform: translate(-50%, -50%) rotate(-360deg);
  }
}
@keyframes outerRotate2 {
  0% {
    transform: translate(-50%, -50%) rotate(0);
  }
  100% {
    transform: translate(-50%, -50%) rotate(-360deg);
  }
}
@-webkit-keyframes textColour {
  0% {
    color: #fff;
  }
  100% {
    color: #3BB2D0;
  }
}
@-moz-keyframes textColour {
  0% {
    color: #fff;
  }
  100% {
    color: #3BB2D0;
  }
}
@-o-keyframes textColour {
  0% {
    color: #fff;
  }
  100% {
    color: #3BB2D0;
  }
}
@keyframes textColour {
  0% {
    color: #fff;
  }
  100% {
    color: #3BB2D0;
  }
}



.e-loadholder {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-51%, -50%);
  -moz-transform: translate(-51%, -50%);
  -ms-transform: translate(-51%, -50%);
  -o-transform: translate(-51%, -50%);
  transform: translate(-51%, -50%);
  width: 240px;
  height: 240px;
  border: 5px solid #1B5F70;
  border-radius: 120px;
  box-sizing: border-box;
}
.e-loadholder:after {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-51%, -50%);
  -moz-transform: translate(-51%, -50%);
  -ms-transform: translate(-51%, -50%);
  -o-transform: translate(-51%, -50%);
  transform: translate(-51%, -50%);
  content: " ";
  display: block;
  background: #fff;
  transform-origin: center;
  z-index: 0;
}
.e-loadholder:after {
  width: 100px;
  height: 200%;
  -webkit-animation: outerRotate2 30s infinite linear;
  -moz-animation: outerRotate2 30s infinite linear;
  -o-animation: outerRotate2 30s infinite linear;
  animation: outerRotate2 30s infinite linear;
}
.e-loadholder .m-loader {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-51%, -50%);
  -moz-transform: translate(-51%, -50%);
  -ms-transform: translate(-51%, -50%);
  -o-transform: translate(-51%, -50%);
  transform: translate(-51%, -50%);
  width: 200px;
  height: 200px;
  color: #888;
  text-align: center;
  border: 5px solid #2a93ae;
  border-radius: 100px;
  box-sizing: border-box;
  z-index: 20;
  text-transform: uppercase;
}
.e-loadholder .m-loader:after {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-51%, -50%);
  -moz-transform: translate(-51%, -50%);
  -ms-transform: translate(-51%, -50%);
  -o-transform: translate(-51%, -50%);
  transform: translate(-51%, -50%);
  content: " ";
  display: block;
  background: #fff;
  transform-origin: center;
  z-index: -1;
}
.e-loadholder .m-loader:after {
  width: 100px;
  height: 106%;
  -webkit-animation: outerRotate1 15s infinite linear;
  -moz-animation: outerRotate1 15s infinite linear;
  -o-animation: outerRotate1 15s infinite linear;
  animation: outerRotate1 15s infinite linear;
}
.e-loadholder .m-loader .e-text {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 130px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-51%, -50%);
  -moz-transform: translate(-51%, -50%);
  -ms-transform: translate(-51%, -50%);
  -o-transform: translate(-51%, -50%);
  transform: translate(-51%, -50%);
  -webkit-animation: textColour 1s alternate linear infinite;
  -moz-animation: textColour 1s alternate linear infinite;
  -o-animation: textColour 1s alternate linear infinite;
  animation: textColour 1s alternate linear infinite;
  display: block;
  width: 140px;
  height: 140px;
  text-align: center;
  border: 5px solid #3bb2d0;
  border-radius: 70px;
  box-sizing: border-box;
  z-index: 20;
}
.e-loadholder .m-loader .e-text:before, .e-loadholder .m-loader .e-text:after {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-51%, -50%);
  -moz-transform: translate(-51%, -50%);
  -ms-transform: translate(-51%, -50%);
  -o-transform: translate(-51%, -50%);
  transform: translate(-51%, -50%);
  content: " ";
  display: block;
  background: #fff;
  transform-origin: center;
  z-index: -1;
}
.e-loadholder .m-loader .e-text:before {
  width: 110%;
  height: 40px;
  -webkit-animation: outerRotate2 3.5s infinite linear;
  -moz-animation: outerRotate2 3.5s infinite linear;
  -o-animation: outerRotate2 3.5s infinite linear;
  animation: outerRotate2 3.5s infinite linear;
}
.e-loadholder .m-loader .e-text:after {
  width: 40px;
  height: 110%;
  -webkit-animation: outerRotate1 8s infinite linear;
  -moz-animation: outerRotate1 8s infinite linear;
  -o-animation: outerRotate1 8s infinite linear;
  animation: outerRotate1 8s infinite linear;
}

#particleCanvas-White {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-51%, -50%);
  -moz-transform: translate(-51%, -50%);
  -ms-transform: translate(-51%, -50%);
  -o-transform: translate(-51%, -50%);
  transform: translate(-51%, -50%);
  width: 100%;
  height: 50%;
  opacity: 0.1;
}

#particleCanvas-Blue {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-51%, -50%);
  -moz-transform: translate(-51%, -50%);
  -ms-transform: translate(-51%, -50%);
  -o-transform: translate(-51%, -50%);
  transform: translate(-51%, -50%);
  width: 300px;
  height: 300px;
}

.loading-wrap {
    height: 100%;
    width: 100%;
    background: #ffffff94;
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 1111;
}
/* Loading Animation end */
.kt-aside .kt-aside-menu {
    margin: 0px 0 !important;
}
.icon1 {
    background: #c00500;
}
.icon2 {
    background: #439f48;
}
.icon3 {
    background: #feba00;
}
.icon4 {
    background: #00b1bf;
}
.icon5 {
    background: #ff7812;
}
.icon6 {
    background: #b40fa7;
}

.border-1{
	border-left: 5px solid #c00500;
}

.border-2{
	border-left: 5px solid #439f48;
}

.border-3{
	border-left: 5px solid #feba00;
}

.border-4{
	border-left: 5px solid #00b1bf;
}

.border-5{
	border-left: 5px solid #ff7812;
}
.border-6{
	border-left: 5px solid #b40fa7;
}
.kt-widget26 .kt-widget26__content .kt-widget26__number {
    font-weight: 600;
    font-size: 2.2rem !important	;
}
.kt-aside-menu {
    background-image: linear-gradient(#426d8d, #07a8ba) !important;
}
.kt-aside-menu .kt-menu__nav > .kt-menu__item.kt-menu__item--active > .kt-menu__heading .kt-menu__link-text, .kt-aside-menu .kt-menu__nav > .kt-menu__item.kt-menu__item--active > .kt-menu__link .kt-menu__link-text {
    color: #2c839d  !important	;
    font-size: 15px;
    font-weight: 500;
}

.kt-aside-menu .kt-menu__nav > .kt-menu__item.kt-menu__item--active > .kt-menu__heading, .kt-aside-menu .kt-menu__nav > .kt-menu__item.kt-menu__item--active > .kt-menu__link {
    background-color: #eef0fc !important;
}
.kt-aside-menu .kt-menu__nav > .kt-menu__item > .kt-menu__heading .kt-menu__link-text, .kt-aside-menu .kt-menu__nav > .kt-menu__item > .kt-menu__link .kt-menu__link-text {
    color: #ffffff !important;
    font-size: 14px;
    font-weight: 600;
}
.kt-portlet .kt-portlet__body {

    padding: 8px 20px 8px 20px !important;
   
}
.myicon {
    font-size: 13px;
    border-radius: 50px;
    width: 35px;
    height: 35px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin-left: 9px;
    margin-top: 14px;
    margin-bottom: 15px;
}
.myicon2{
    font-size: 14px;
    border-radius: 50px;
    width: 30px;
    height: 31px;
    color: #2589a3;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin-left: -9px;
    margin-top: 14px;
    margin-right: 7px;
    margin-bottom: 15px;
    background: white;
}
.number {
    font-size: 15px;
    font-weight: 600;
    margin-left: 20px;
    position: absolute;
    margin-top: 10px;
}
.numbertxt {
    font-size: 10px;
    margin-left: 22px;
    color: #9e9e9e;
    position: absolute;
    margin-top: 35px;
}
.card header {
height: 50px;
    background: #2589a3;
    border-radius: 8px 8px 0 0;
    display: flex;
    align-items: center;
    padding: 20px;
    color: #fff;
    font-size: 17px;
    font-weight: 600;
}
.card {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border-radius: 10px;
	margin-bottom: 10px;
}
.card .main {
  padding: 20px;
  background: #fff;
  border-radius: 0 0 8px 8px;
}
.kt-header-menu .kt-menu__nav > .kt-menu__item.kt-menu__item--here > .kt-menu__link {
    background-color: #2689a3 !important;
}
.kt-header .kt-header-menu .kt-menu__nav > .kt-menu__item.kt-menu__item--here > .kt-menu__link .kt-menu__link-text, .kt-header .kt-header-menu .kt-menu__nav > .kt-menu__item.kt-menu__item--active > .kt-menu__link .kt-menu__link-text, .kt-header .kt-header-menu .kt-menu__nav > .kt-menu__item:hover > .kt-menu__link .kt-menu__link-text {
    color: #ffffff;
}
.kt-header{
	background: #1a1a27;
}
.kt-aside-menu .kt-menu__nav > .kt-menu__item > .kt-menu__heading .kt-menu__link-icon, .kt-aside-menu .kt-menu__nav > .kt-menu__item > .kt-menu__link .kt-menu__link-icon {
    color: #e2e2e2 !important;
}
.kt-badge.kt-badge--unified-success {
    color: #1e92a9 !important;
    background: rgb(212, 252, 255) !important;
}
.kt-aside-menu .kt-menu__nav > .kt-menu__item.kt-menu__item--active i {

    color: #2886a0 !important;
}
.chartdiv {
  width: 100%;
  height: 260px;
}
.chartdiv1 {
    width: 100%;
    height: 500px;
}
.kt-aside-menu .kt-menu__nav > .kt-menu__item .kt-menu__submenu .kt-menu__item > .kt-menu__heading .kt-menu__link-text, .kt-aside-menu .kt-menu__nav > .kt-menu__item .kt-menu__submenu .kt-menu__item > .kt-menu__link .kt-menu__link-text {
    color: #ffffff !important;
    font-weight: 500 !important;
}
.table thead th {
    color: white !important;
    text-align: center;
    vertical-align: bottom;
    border: 0px solid #337c98;
    font-size: 17px;
    background: #337c98;
}
.main{
	padding:5px !important;
}
.menu-items ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    height: 60vh;
    overflow-y: scroll;
}

.menu-items ul li {
    height: 10vh;
    font-size: 14px;
    color: #000;
    background: #eeeeee;
    margin: 5px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
}
.menu-items ul li:hover{
    color: #000;
    background: #fea502;

}
.menu-items ul li active{
    color: #000;
    background: #fea502;

}
@media only screen and (min-width: 769px) and (max-width: 3000px) {
}
@media only screen and (min-width: 320px) and (max-width: 768px) {
  .menu-items ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    height: 60vh;
    overflow-y: scroll;
}
    .number {
        font-size: 15px;
        font-weight: 600;
        margin-left: 53px;
        position: absolute;
        z-index: 1 !important;
        margin-top: -52px !important;
    }
    .fixed-done{
        position:fixed;
            bottom:0px;
    }
.numbertxt {
    font-size: 10px;
    margin-left: 54px;
    color: #9e9e9e;
    position: absolute;
    margin-top: -33px !important;
    z-index: 11 !important;
}

}
