@import '../variables.scss';

.RGSidebar.top1 {
  // position: absolute;
  // top: 0;
  // left: 0;
  
  width: 100%;
  height: 65px;
  background-color: $elevation-zero-base;

  .RGLogo {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    height: 24px;
  }
  @media only screen and (max-width: 1000px) {
    .RGLogo {
    transform: translate(-50%, -50%);
      left: 20px;
      transform: translate(0%, -50%);
    }
  }
  .RGFilter {
    position: absolute;
    right: 20px;
    top: 2px;
    width: 360px;
  }
}

.RGSidebar.top2 {
  width: 100%;
  height: 65px;
  background-color: $surface;

  h2 {

  }

  .container {
    position: relative;
    height: 100%;
    
    display: inline-block;;
    padding-left: 20px;
    
    h2 {
      position: absolute;
      top: 14px;
      margin: 0;
    }
    &.parent.hasChild {
      width: 400px;
      background-color: $elevation-minus80-panel;
    }
    &.parent.noChild {
      width: 100%;
    }
    .child {
    }
  }
}