  
* {
    box-sizing: border-box;
    font-family: Arial, Helvetica, sans-serif;
  }
  
  body {
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
  }
  
  /* Style the top navigation bar */
  .topnav {
    overflow: hidden;
    background-color: #2ABC71;
    border-bottom:2px solid #0ec767;
  }
  
  /* Style the topnav links */
  .topnav a {
    float: left;
    display: block;
    color: #f2f2f2;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
  }
  
  /* Change color on hover */
  .topnav a:hover {
    /* background-color: #ddd; */
    color: black;
  }
  
  /* Style the content */
  .content {
    background-color: #ddd;
    padding: 10px;
    height: 200px; /* Should be removed. Only for demonstration */
  }
  .list ul{
      /* border: 1px solid red; */
      text-decoration: none;
      list-style-type: none;
  }
  .list ul li{
      /* border: 1px solid red; */
      display: block;
      font-size: 15px;
      padding: 10px 0px;
      text-decoration: none;
      list-style-type: none;
  }
  .list ul li a{
      /* border: 1px solid red;
      display: block;
      font-size: 12px;
      padding: 10px 0px; */
      text-decoration: none;
      color: #000;
  }
  .new_btn{
    float: right;padding: 2px 15px;background-color: #f5d20f;border-radius: 20px;font-size: 14px;
  }
  
  
  .edit_btn{
    float: right;background-color: #fff;padding: 3px 5px;border-radius: 10px;font-size: 13px;
  }
  .innerbox_main{
    float: left;
  }
  .innerbox{
    background-color: #000;width: 300px;height: 80px;border-radius: 10px;
  }
  .version{
    float: right;font-size: 11px;color: #2ABC71;
  }
  .box{
    width: 100%;height: 100px;background-color: #2ABC71;border-radius: 20px;padding: 12px;
  }
  /* toggle button */
  h1 {
              color: #2ABC71;
          }
                
          .toggle_main{
            float: right;font-size: 11px;color: #2ABC71;position: relative;bottom: -20px;
          }
          /* toggle in label designing */
          .toggle {
              position : relative ;
              display : inline-block;
              width : 80px;
              height : 22px;
              background-color: #eee;
              border-radius: 30px;
              /* border: 2px solid yellow#2ABC71; */
          }
                 
          /* After slide changes */
          .toggle:after {
              content: '';
              position: absolute;
              width: 40px;
              height: 20px;
              border-radius: 50px;
              background-color: #2ABC71;
              top: -0.4px;
              left: -1px;
              transition:  all 0.5s;
              border: 0px solid red;
          }
                 
          /* Toggle text */
          p {
              font-family: Arial, Helvetica, sans-serif;
              font-weight: bold;
              /* margin-top: -0.1px; */
              padding-top: -4px;
              font-size: 11px;
              position: relative;
              top: -5px;
              /* color: #fff; */
              padding: 0px 4px;
  
          }
                 
          /* Checkbox checked effect */
          .checkbox:checked + .toggle::after {
              left : 39px;
          }
                 
          /* Checkbox checked toggle label bg color */
          .checkbox:checked + .toggle {
              /* background-color: #2ABC71; */
              background-color: #eee;
          }
                 
          /* Checkbox vanished */
          .checkbox {
              display : none;
          }
  
          /* icons */
          .fa{
            color: #2ABC71;
            font-size: 17px;
          }
          .fa-chevron-left{
            color: #000 !important;
          }