.site-content {
  /* border: 1px solid red; */
}
.site-content #content-wrapper {
  width: auto;
  border: 1px solid red;
}
@media (min-width: 768px) {
  .site-content #content-wrapper {
    display: flex;
    justify-content: space-between;
  }
}
@media (min-width: 1200px) {
  .site-content #content-wrapper {
    width: 1200px;
    margin: 0 auto;
  }
}

  .site-content #content-wrapper .sidebar {
    /* border: 1px solid cyan; */
    width: auto;
  }
  @media (min-width: 768px) {
    .site-content #content-wrapper .sidebar {
      width: 20%;
    }
  }
  @media (min-width: 1200px) {
    .site-content #content-wrapper .sidebar {
      width: 300px;
    }
  }
  .site-content #content-wrapper .main-content {
    border: 1px solid red;
    width: auto;
  }
  @media (min-width: 768px) {
    .site-content #content-wrapper .main-content {
      width: 80%;
    }
  }
  @media (min-width: 1200px) {
    .site-content #content-wrapper .main-content {
      border: 1px solid red;
      width: 900px;
    }
  }