/*SORT STYLES*/
div.sort {
  display: inline-block;
  position: absolute;
  top: calc(50% - (0.5rem + 0.1rem));
  right: .2rem;
  outline: none;
  /*Hidden radio button*/
  /*Down arrow*/
  /*Up arrow*/ }
  div.sort > input[type=radio] {
    position: absolute; }
  div.sort > div {
    width: 0;
    width: 0;
    border-left: 0.4rem solid transparent;
    border-right: 0.4rem solid transparent;
    border-top: 0.5rem solid #555555; }
  div.sort > div:first-child {
    border-top: none;
    border-bottom: 0.5rem solid #555555;
    margin-bottom: 0.1rem; }
  div.sort:hover {
    cursor: pointer; }
  div.sort:active {
    /*Down arrow*/
    /*Up arrow*/ }
    div.sort:active > div {
      border-top-color: #888888; }
    div.sort:active > div:first-child {
      border-bottom-color: #888888; }
  div.sort.up, div.sort.down {
    top: calc(50% - (0.5rem / 2)); }
  div.sort.up > div {
    display: none; }
  div.sort.up > div:first-child {
    display: block;
    animation: sortExpand 200ms forwards; }
  div.sort.down > div {
    display: block;
    animation: sortCollapse 200ms forwards; }
  div.sort.down > div:first-child {
    display: none; }

@keyframes sortExpand {
  100% {
    transform: rotate(180deg); } }

@keyframes sortCollapse {
  100% {
    transform: rotate(-180deg); } }