body {
    height: 100vh;
    xbackground-color: #F3F3FB;
    xbackground-image: linear-gradient(120deg, #fdfbfb 0%, #ebedee 100%);
    xbackground: linear-gradient(345deg, #0575e6, #021b79); /* dawn */
    xbackground: linear-gradient(345deg, #f5af19, #f12711); /* morning */
    background: linear-gradient(to top, #48c6ef 0%, #6f86d6 92%); /* mid-day */
    xbackground: linear-gradient(to top, #6f86d6 0%, #48c6ef 92%); /* afternoon */
    xbackground: linear-gradient(45deg, #0575e6, #021b79); /* evening */
    xbackground: linear-gradient(355deg, #5f0e27, #171f61); /* night */
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
  }
  
  .z-depth-1, 
  nav, 
  .card-panel, 
  .card, 
  .toast, 
  .btn, 
  .btn-large, 
  .btn-small, 
  .btn-floating, 
  .dropdown-content, 
  .collapsible, 
  .sidenav {
      -webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,0), 0 3px 1px -2px rgba(0,0,0,0), 0 1px 5px 0 rgba(0,0,0,0);
      box-shadow: 0 2px 2px 0 rgba(0,0,0,0), 0 3px 1px -2px rgba(0,0,0,0), 0 1px 5px 0 rgba(0,0,0,0);
  }
  
  nav{
    Xbackground-color: #6f85d6 !important;
    background-color: #000000 !important;
  }

  .nav-wrapper a{
    xcolor: rgb(0, 0, 0) !important;
  }  
  
  .card {
    backdrop-filter: blur(8px);
    background-color: rgba(255, 255, 255, 0.8) !important;
  }

  .card-action {
    background-color: rgba(255, 255, 255, 0) !important;
  }
  
  .sidenav{
    background-color: rgba(255, 255, 255, 0) !important;
  }

  .xsidenav a:hover{
    background-color: rgba(255, 255, 255, 0.1) !important;
  }
  
  .sidenav a{
    border-radius: 0px 10px 10px 0px;
    padding: 10px;
    color: rgba(255, 255, 255, 0.9) !important;
  }

  @media only screen and (max-height : 600px) {
    .sidenav a {
      color: transparent !important;
    }
  }
  
  .sidenav i{
    color: rgba(255, 255, 255, 0.9) !important;
  }

  .sidenav-overlay {
    backdrop-filter: blur(35px) !important;
  }

  .xmodal-overlay {
    backdrop-filter: blur(20px) !important;
    opacity: 1 !important;
    background: rgba(0, 0, 0, 0.5);
    transition: visibility 0s 2s, opacity 2s linear !important;
  }

  .modal {
    backdrop-filter: blur(8px);
    background-color: rgba(255, 255, 255, 0.8);
  }

  .modal-footer {
    background-color: rgba(255, 255, 255, 0) !important;
  }

  .tabs {
    background-color: rgba(255, 255, 255, 0.4) !important;    
  }

  .datepicker-date-display {
    border-radius: 8px;
  }

  .timepicker-digital-display {
    border-radius: 8px;
  }