/* 

1. Add your custom Css styles below
2. Place the this code in your template: 

 <link href="css/custom.css" rel="stylesheet">

*/

::-webkit-scrollbar {
  width: 6px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #fffdfd; 
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: var(--main-dark-color); 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: var(--main-dark-color); 
}


.dark #header .header-inner, .dark #header #header-wrap, #header.dark .header-inner, #header.dark #header-wrap {
    background-color: var(--main-dark-color) !important;
  }
  
  
  .header-extras > ul > li a, .header-extras > ul > li i {
  color: #ffffff !important;
  }
  .sticky-active > .header-inner > .container > .header-extras > ul > li a, .sticky-active > .header-inner > .container >  .header-extras > ul > li i {
  color: var(--main-dark-color) !important;
  }
  
  #header #mainMenu nav > ul > li.hover-active > a, #header #mainMenu nav > ul > li.hover-active > span, #header #mainMenu nav > ul > li.current > a, #header #mainMenu nav > ul > li.current > span, #header #mainMenu nav > ul > li:hover > a, #header #mainMenu nav > ul > li:hover > span, #header #mainMenu nav > ul > li:focus > a, #header #mainMenu nav > ul > li:focus > span {
  color: #ffffff;
  }
  
  #header .header-sticky > #mainMenu nav > ul > li.hover-active > a, #header .header-sticky > #mainMenu nav > ul > li.hover-active > span, #header .header-sticky > #mainMenu nav > ul > li.current > a, #header .header-sticky > #mainMenu nav > ul > li.current > span, #header .header-sticky > #mainMenu nav > ul > li:hover > a, #header .header-sticky > #mainMenu nav > ul > li:hover > span, #header .header-sticky > #mainMenu nav > ul > li:focus > a, #header .header-sticky > #mainMenu nav > ul > li:focus > span {
  color: #000;
  }
  
  .sticky-active > .header-inner > .container > #mainMenu nav > ul > li > a
  {
    color: #000000 !important;
  }

  #preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    z-index: 9999;
  }
  
  #spinner {
    display: block;
    position: relative;
    left: 46%;
    top: 46%;
    width: 50px;
    height: 50px;
  }
    
  #fiterPreloader {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(255, 255, 255, 0.8);
    z-index: 2;
    cursor: pointer;
  }  
  #contentPreloader {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(255, 255, 255, 0.8);
    z-index: 2;
    cursor: pointer;
  }
  .progress-number {
    display: none;
  }
  .progress-type {
    display: none;
  }

  #chartdiv {
    width: 100%;
    height: 300px;
  }