Support Forums

I am trying to make BP Docs page look more like bbPress forum page and also use the space better inside Group page area (see attached image here: http://imgur.com/dNVsZdr)

I have made most of the necessary CSS changes. Trouble is when I make changes to CSS it also affects other pages in Social Learner theme. Do you have any recommendations for making the CSS specific to BP Docs pages?

I have included the code below:

/* make BP Docs look like forum */
#buddypress div#item-body {
    padding-left: 0;
    padding-right: 0;
  }

#buddypress div#subnav.item-list-tabs ul {
      margin: 0px 70px;
}

.site #buddypress div.docs-info-header {
    border-bottom: 0;
    margin-bottom: 0;
    padding: 15px 50px 5px;
}

#buddypress table.doctable thead tr {
    background: #1CA7DA none repeat scroll 0% 0%;
}

.title-cell > a {
    color: #FFF;
}

.site #buddypress table.doctable tr th {
    color: #FFF;  /* THIS IS OVERWRITTEN BY INLINE CSS CODE (LINE 815) INSIDE SOCIAL LEARNER */
}

.site #buddypress table.doctable tr th a {
    color: #FFF;
}

div#bp-docs-pagination {
    margin-left: 30px;
}

p.currently-viewing {
    margin-top: 0;       /* THIS IS OVERWRITTEN BY SCREEN.CSS - A BP DOCS PLUGIN FILE */
    margin-bottom: 15px;
}