@import url("https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap");:root{--header-height: 3rem;--nav-width: 68px;--first-color: rgb(35, 120, 217);--first-color-light: #AFA5D9;--white-color: #F7F6FB;--body-font: 'Nunito', sans-serif;--normal-font-size: 1rem;--z-fixed: 100}*,::before,::after{box-sizing: border-box}body{position: relative;margin: var(--header-height) 0 0 0;padding: 0 1rem;font-family: var(--body-font);font-size: var(--normal-font-size);transition: .5s}a{text-decoration: none}.header{width: 100%;height: var(--header-height);position: fixed;top: 0;left: 0;display: flex;align-items: center;justify-content: space-between;padding: 0 1rem;background-color: var(--white-color);z-index: var(--z-fixed);transition: .5s}.header_toggle{color: var(--first-color);font-size: 1.5rem;cursor: pointer}.header_img{width: 35px;height: 35px;display: flex;justify-content: center;border-radius: 50%;overflow: hidden}.header_img img{width: 40px}.l-navbar{position: fixed;top: 0;left: -30%;width: var(--nav-width);height: 100vh;background-color: var(--first-color);padding: .5rem 1rem 0 0;transition: .5s;z-index: var(--z-fixed)}.nav{height: 100%;display: flex;flex-direction: column;justify-content: space-between;overflow: hidden}.nav_logo, .nav_link{display: grid;grid-template-columns: max-content max-content;align-items: center;column-gap: 1rem;padding: .5rem 0 .5rem 1.5rem}.nav_logo{margin-bottom: 2rem}.nav_logo-icon{font-size: 1.25rem;color: var(--white-color)}.nav_logo-name{color: var(--white-color);font-weight: 700}.nav_link{position: relative;color: var(--first-color-light);margin-bottom: 1.5rem;transition: .3s}.nav_link:hover{color: var(--white-color)}.nav_icon{font-size: 1.25rem}.show{left: 0}.body-pd{padding-left: calc(var(--nav-width) + 1rem)}.active{color: var(--white-color)}.active::before{content: '';position: absolute;left: 0;width: 2px;height: 32px;background-color: var(--white-color)}.height-100{height:100vh}@media screen and (min-width: 768px){body{margin: calc(var(--header-height) + 1rem) 0 0 0;padding-left: calc(var(--nav-width) + 2rem)}.header{height: calc(var(--header-height) + 1rem);padding: 0 2rem 0 calc(var(--nav-width) + 2rem)}.header_img{width: 40px;height: 40px}.header_img img{width: 45px}.l-navbar{left: 0;padding: 1rem 1rem 0 0}.show{width: calc(var(--nav-width) + 156px)}.body-pd{padding-left: calc(var(--nav-width) + 188px)}}
a:link {
    text-decoration: none;
}

a:visited {
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}

a:active {
    text-decoration: none;
}
.switch {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 20px;
  }
  
  .switch input { 
    opacity: 0;
    width: 0;
    height: 0;
  }
  
  .slider 
  {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
  }
  
  .slider:before 
  {
    position: absolute;
    content: "";
    height: 13px;
    width: 13px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
  }
  
  input:checked + .slider 
  {
    background-color: #2196F3;
  }
  
  input:focus + .slider 
  {
    box-shadow: 0 0 1px #2196F3;
  }
  
  input:checked + .slider:before 
  {
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }
  
  /* Rounded sliders */
  .slider.round 
  {
    border-radius: 34px;
  }
  
  .slider.round:before 
  {
    border-radius: 50%;
  }

  #status_deact
  {
    display: none;
  }

      /* Upload Demo */
      .uploader {
        display: block;
        clear: both;
        margin: 0 auto;
        width: 100%;
        max-width: 600px;
      }
  
      .uploader label {
        float: left;
        clear: both;
        width: 100%;
        padding: 2rem 1.5rem;
        text-align: center;
        background: #fff;
        border-radius: 7px;
        border: 3px solid #eee;
        transition: all .2s ease;
        user-select: none;
      }
  
      .uploader label:hover {
        border-color: #454cad; /* $theme */
      }
  
      .uploader label.hover {
        border: 3px solid #454cad; /* $theme */
        box-shadow: inset 0 0 0 6px #eee;
      }
  
      .uploader label.hover #start i.fa {
        transform: scale(0.8);
        opacity: 0.3;
      }
  
      .uploader #start {
        float: left;
        clear: both;
        width: 100%;
      }
  
      .uploader #start.hidden {
        display: none;
      }
  
      .uploader #start i.fa {
        font-size: 50px;
        margin-bottom: 1rem;
        transition: all .2s ease-in-out;
      }
  
      .uploader #response {
        float: left;
        clear: both;
        width: 100%;
      }
  
      .uploader #response.hidden {
        display: none;
      }
  
      .uploader #response #messages {
        margin-bottom: .5rem;
      }
  
      .uploader #file-image {
        display: inline;
        margin: 0 auto .5rem auto;
        width: auto;
        height: auto;
        max-width: 180px;
      }
  
      .uploader #file-image.hidden {
        display: none;
      }
  
      .uploader #notimage {
        display: block;
        float: left;
        clear: both;
        width: 100%;
      }
  
      .uploader #notimage.hidden {
        display: none;
      }
  
      .uploader progress,
      .uploader .progress {
        display: inline;
        clear: both;
        margin: 0 auto;
        width: 100%;
        max-width: 180px;
        height: 8px;
        border: 0;
        border-radius: 4px;
        background-color: #eee;
        overflow: hidden;
      }
  
      .uploader .progress[value]::-webkit-progress-bar {
        border-radius: 4px;
        background-color: #eee;
      }
  
      .uploader .progress[value]::-webkit-progress-value,
      .uploader .progress[value]::-moz-progress-bar {
        background: linear-gradient(to right, darken(#454cad, 8%) 0%, #454cad 50%);
        border-radius: 4px;
      }
  
      .uploader input[type="file"] {
        display: none;
      }
  
      .uploader div {
        margin: 0 0 .5rem 0;
        color: #5f6982; /* $dark-text */
      }
  
      .uploader .btn {
        display: inline-block;
        margin: .5rem .5rem 1rem .5rem;
        clear: both;
        font-family: inherit;
        font-weight: 700;
        font-size: 14px;
        text-decoration: none;
        text-transform: initial;
        border: none;
        border-radius: .2rem;
        outline: none;
        padding: 0 1rem;
        height: 36px;
        line-height: 36px;
        color: #fff;
        transition: all 0.2s ease-in-out;
        box-sizing: border-box;
        background: #454cad; /* $theme */
        border-color: #454cad; /* $theme */
        cursor: pointer;
      }