html {
    position: relative;
    min-height: 100%;
  }
  
  body {
    margin-bottom: 80px;
    margin-top: 60px;
  }
  
  .footer {
      position:fixed;
       bottom: 0;
       width: 100%;
       height: 60px;
       background-color: #f5f5f5;
  
      border-top: 1px solid transparent;
      box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2);
  }
  
  .navbar{
      border-top: 1px solid transparent;
      box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2);
  }
  
  .group-container{
      padding:0;
      height:100%;
  }
  
  .selectors, .block{
      height:100%;
      width:100%;
  }
  
  .selectors button{
      border: 0;
      border-radius: 0;
      background-color: #f8f9fa !important;
      width:25%;
      margin-left: 0;
  }
  
  .selectors button:active{
      border:0;
  }
  
  .selectors button:focus{
      border:0;
      outline: 0;
      box-shadow: 0 0 0 0px;
  }
  
  .active, .selector-holder{
      display: flex;
      flex-direction: column;
  }
  
  .inactive{
      display: none;
  }
  
  .selector-holder span{
      font-size: 0.8rem;
  }
  
  /* Colors of the buttons*/
  .button-active, .selectors button:hover, .selectors button:active, .selectors button:focus{
      color: #ff0000;
  }
  
  .button-inactive{
      color: #000;
  }