.btn {
  background-color: $brand-default;
  border-color: $brand-accent;
  color: $brand-accent-darken;
  font-size: 16px;
  height: 35px;
  width: 100%;
  a{
    color: $brand-tertiary;
    
    &:hover{
      color: $brand-accent-darken;
      text-decoration: none;
    }
  }
  /*element state*/
  &:focus {
    background-color: $brand-accent-darken;
    border-color: $brand-accent-darken;
    color: $brand-tertiary;
    outline: none;
  }
  &:hover{
    background-color: $brand-accent-darken;
    color: $brand-tertiary;
    border-color: $brand-accent-darken; 
    text-decoration: none;
  }
  &:active:focus{
    outline: none;
  };

  /*custom sub classes*/
  &.secondary{
    font-size: 14px;
    height: 34px;
    background-color: $brand-tertiary;
    border: none;
    color: $brand-accent;
    &:hover{
      background-color: $brand-accent;
      color: white;
    }
    &:active{
      background-color: $brand-accent;
      color: white;
    }
  }
  &.small{
    height: 30px;
    font-size: 14px;
  }

&.execute {
  background-color:$brand-secondary;
  border-color: $brand-secondary;
  color: $brand-default;
  &:hover {
    background-color:$brand-default;
    color: $brand-secondary;
    border-color: $brand-secondary;
  }
}

 &.begin {
  background-color:$brand-secondary;
  border-color: $brand-secondary;
  color: $brand-default;
  &:hover {
    background-color:$brand-default;
    color: $brand-secondary;
    border-color: $brand-secondary;
  }
}


  /*specific classes*/
  &.secondary.submit-server-name,&.secondary.cancel-server-name{
    border: 1px solid $brand-accent;
  }

  &.delete-auth {
    border-color: $brand-secondary;
    color: $brand-secondary;
    &:hover {
      background-color:$brand-secondary;
      color: $brand-default;
      border-color: $brand-secondary;
    }
  }
}

.add_server_button {
  float:right;
  &:hover{
    font-size: 20px;
  }
}

.action-buttons{
  button{
    margin-bottom: 5px;
  }
}
