.genie-viewSort {
  border: 2px solid #bbb;
  padding: 1rem;
  
  gap: .5rem;
  h2 {
    margin: 0 0 -4px -4px;
    display: flex;
    align-items: center;
    gap: .5rem;
    color: #357;
    text-align: left;
    font-size: 1rem;
    line-height: 1;
    &:before {
      content: url('assets/img//sort-hexagon.png');
    }
  }
  ul {
    list-style: none;
    margin: 0;
    padding: 0;
    gap: .25rem;
    li {
      background: url('assets/img/Treeview-grey-line.png') no-repeat 0 -2981px;
      padding: 4px 0 4px 25px;
      font-size: .7rem;
      text-align: left;
      &:hover {
        color: #901;
        cursor: pointer;
      }
      &.active {
        color: #901;
        font-weight: bold;
        cursor: auto;
      }
    }
    li:last-child {
      background-position: 0 -5971px;
    }
    img {
      margin: auto;
    }
  }
  .roomac-sort-genie-wrapper {
    display: flex;
    flex-direction: column;
  }
  .roomac-sort-btu {
    margin-left: 1rem;
  }
  .roomac-sort-genie {
    margin: auto auto 2rem;
  }
} @media (min-width:800px) { .genie-viewSort {
  display: grid;
}}