Feed {
  display: flex
  max-width: 100%

  div.main {
    flex: 3
    padding: 24px 40px;
    overflow-y: auto
    div.info {
      font-size: 110%
      margin: 20px 0
    }

    h1 {
      margin-bottom: 20px
    }

    div.loading {
      height: 50%
      display: flex
      align-items: center
      justify-content: center

      ::before {
        content: ' '
        height: 100px
        width: 100px
        background-image: svg(waitingIcon)
        background-repeat: no-repeat
        background-position: center
        background-size: contain
        animation: playIconSpin 1s infinite linear
      }

      ::after {
        font-size: 200%
        content: 'Loading...'
      }
    }
  }

  div.side {
    flex: 1
    min-width: 280px;
    padding: 20px;
    background: linear-gradient(100deg, #3f3840, #5b5c7f);
    border-left: 1px solid #5a5757;
    overflow-y: auto;

    h2 {
      span.sub {
        font-weight: normal
        font-size: 90%
      }
    }
  }
}
