Furvilla User Profile: Colorblock

.col-xs-7,
.col-xs-9,
.col-xs-5,
.user-data .user-desc,
.user-data .village-shield,
.widget-header,
.widget,
.notifications,
.widget-header h3,
.notifications tr:last-child td,
.notifications-widget .btn,
.col-xs-7 p,
.user-data,
.content h2,
.villagers-list,
.content h3,
h4,
.widget-content,
.user-comments {
    padding: 0;
    margin: 0;
    border: 0;
}
.notifications-widget:hover,
.col-xs-7,
.col-xs-5,
.user-data .user-desc,
.content h2,
.right-column .widget,
.gallery {
    padding: 20px;
}
.margin-10px,
.widget + .text-center,
li.disabled {
    display: none;
}
#logo {
    top: 2px;
    left: 3px;
    height: 41px;
    width: 74px;
}
#logo a {
    height: 41px;
    width: 75px;
    background-size: contain;
}
#logo +:nth-child(2) {
    top: 0;
    border-radius: 0;
    background: #2e2e2e;
}
#logo +:nth-child(2) > ul {
    margin-left: 100px;
}
.search-form .input {
    position: absolute;
    top: -128px;
    right: 6px;
    background: rgba(255, 255, 255, 0.3);
    border-radius: 0;
}
.user-panel.clearfix {
    top: 44px;
    background: #636363;
}
.content:after {
    width: 100%;
    height: 100%;
    z-index: -1;
    position: fixed;
    top: 0;
    /*change the next two lines to change the background*/
    background: url('http://i.imgur.com/t7gnais.jpg') no-repeat fixed center;
    background-size: cover;
}
.content {
    padding: 0 0 200px;
    top: 200px;
    margin-bottom: 0;
    /*this is the color under your shorter column (usually the right sidebar)*/
    background: #121212;
    /*this is the color of "you have" and your furcash on hand in the User Panel*/
    color: #454545;
}
.content .left-column {
    width: 775px;
    /*this is the color of your comments section*/
    background: #2b2b2b;
}
.content .right-column {
    float: right;
    width: 215px;
}
.content h1 {
    position: absolute;
    top: -375px;
    width: 100%;
    height: 375px;
    font: 50pt 'century gothic', Arial;
    color: #fff;
    text-transform: uppercase;
    text-align: center;
    padding-top: 200px;
    text-shadow: 0 0 10px #000;
}
.user-data .village-shield {
    position: absolute;
    top: -325px;
    left: 50%;
}
.village-shield img {
    left: -50%;
    position: relative;
}
.widget-header h3,
.content h2,
.content h3 {
    background: none;
    text-transform: uppercase;
    font-family: 'Century Gothic', arial;
    text-shadow: none;
    /*color of most headers except notifications, user panel, and trophies*/
    color: #a3a3a3;
    font-weight: normal;
}
.widget-content {
    background: transparent;
}
.table tr:nth-child(odd) td,
.table tr:nth-child(even) td,
.table tr:hover td,
.widget .forum-posts li:nth-child(odd),
.widget .forum-posts li:nth-child(even) {
    background: transparent !important;
    border: none;
}
/*notifications background and color*/
.notifications-widget {
    background: #a1a1a1;
    color: #585858;
    font-size: 14px;
    padding: 0 20px;
    position: absolute;
    top: -375px;
    transition: 2.5s;
    width: 148px;
    overflow: hidden;
    height: 30px;
    z-index: 2;
    opacity: .7;
}
.notifications-widget:hover {
    width: 100%;
    opacity: 1;
    height: auto;
}
.table tbody tr td {
    padding: 8px 0;
}
.notifications-widget b {
    font-weight: normal;
}
.notifications-widget .btn {
    background: none;
    border-radius: 0;
    opacity: 1;
    text-shadow: none;
}
.col-xs-9 {
    padding: 0 !important;
    width: 100%;
}
/*user info background and color*/
.col-xs-7 {
    background: #a6a6a6;
    color: #303030;
    height: 193px;
    width: 452px;
}
/*user links (matches line 178)*/
.user-links .fa, .user-links .far {
    color: #303030;
}
/*trophies background and color*/
.col-xs-5 {
    margin: 0 !important;
    background: #b7b7b7;
    height: 193px;
    overflow: hidden;
    width: 323px;
}
.trophies .row {
    overflow: auto;
    margin: 0;
    height: 134px;
    width: 333px;
    padding-right: 50px;
}
.col-xs-6 {
    width: 85px;
    padding: 0;
}
.user-links br {
    display: none;
}
/*must be changed according to rows of villagers!*/
.user-data,
.right-column .widget:first-child {
    margin-top: 204px;
}
/*background below should match line 212*/
h2.villagers-header {
    background: #d1d1d1;
    position: absolute;
    width: 100%;
    top: 0;
}
/*villagers list background*/
.villagers-list {
    background-color: #d1d1d1;
    position: absolute;
    top: 66px;
    width: 100%;
}
.villagers-list .villager-avatar {
    /* same thing as lines 75-76 */
    background: url("http://i.imgur.com/t7gnais.jpg") no-repeat fixed center;
    background-size: cover;
    border-radius: 20px;
    position: relative;
    z-index: 1;
    transition: 0.3s;
}
.villagers-list .villager-avatar:hover {
    opacity: .2;
}
.villagers-list li {
    height: 138px;
}
/*color of villager name and job*/
.villager-name,
.villager-info {
    position: relative;
    bottom: 60%;
    width: 100px;
    margin: 0 auto;
    color: #2b2b2b;
}
/*color of villager name and job*/
.villager-name a {
    color: #2b2b2b !important;
}
.counter {
    border-color: #a3a3a3;
}
/*profile description background*/
.user-data .user-desc {
    background: #5e5e5e;
}
/*profile description text color*/
.user-desc .profanity-filter {
    color: #d1d1d1;
    padding-top: 20px;
}
/*user panel widget background*/
.right-column .widget:first-child {
    background: #c6c6c6;
}
.widget-content p {
    font-size: 13px;
}
.right-column .villager-avatar,
.right-column .villager-avatar + div a img {
    height: 80px;
    width: 80px;
}
/*active villager widget background*/
.widget:nth-child(2) {
    background: #818181;
}
/*more villagers, recent activity, or buffs widget background*/
.widget:nth-child(3) {
    background: #414141;
}
/*recent activity or buffs widget background*/
.widget:nth-child(4) {
    background: #121212;
}
div.top {
    top: 0px;
}
/*footer background*/
div.top,
div.bottom {
    background: #080808;
}
.logo-small,
.social,
.pets {
    line-height: 0 !important;
    padding-top: 20px;
}
.pets {
    margin-left: -67px !important;
    position: relative !important;
    width: 0;
    z-index: 2;
}
.pets img {
    height: 89px;
    width: 133px;
}
div.bottom {
    position: relative;
    padding-top: 46px;
    margin: 0;
    padding-bottom: 30px;
}
/*textarea background and text color*/
.content .textarea {
    background: rgba(255, 255, 255, .3);
    border: none;
    border-radius: 0;
    margin: 0 20px;
    width: 735px;
    color: #fff;
}
/*post button background (matches textarea)*/
.textarea + .btn {
    margin: 20px;
    background: rgba(255, 255, 255, .3);
    border-radius: 0;
    text-shadow: none;
}
.user-comments {
    padding: 0 20px;
}
.comment:first-child {
    padding-top: 0;
}
.comment:last-child {
    padding-bottom: 0;
}
.comment,
.widget .forum-posts li {
    padding: 10px 0;
}
.user-comments .user-avatar-wrapper {
    width: 100px;
}
/*comment background*/
.user-comments .user-comment {
    width: 615px;
    float: right;
    margin: 0;
    border: 0;
    padding: 20px 20px 50px 20px;
    background: rgba(0, 0, 0, .4);
    border-radius: 0;
}
.user-comments .user-comment .footer {
    left: 20px;
    width: 575px;
}
/*comment triangle background (the thing that makes it look like a speech bubble)
this should match line 349 if you use an opaque value
if semi-transparent, look up how to add in alpha compositing (sorry!)*/
.user-comments .user-comment:before,
.user-comments .user-comment:after {
    border-right-color: rgba(0, 0, 0, .225);
}
#comments .profanity-filter {
    margin-bottom: 20px;
}
/*comment footer background*/
.user-comments .user-comment .footer {
    left: 20px;
    width: 575px;
    margin-bottom: 20px;
    border-top: 0;
    background: #000;
    padding: 6px;
    opacity: .4;
}
.content .pagination {
    display: block;
    padding: 20px 20px 0 20px;
    margin: 0;
    height: 53px;
}
/*pagination background and color (numbers used to navigate multiple pages of comments)*/
.content .pagination li a,
.content .pagination li span {
    background: rgba(0, 0, 0, 0.4);
    border: 0;
    color: #b8b8b8;
}
/*pagination background and color (numbers used to navigate multiple pages of comments)*/
.content .pagination .active span,
.content .pagination .active span:hover,
.content .pagination .active span:focus,
.content .pagination li a:hover,
.content .pagination li a:focus,
.content .pagination li span:hover,
.content .pagination li span:focus {
    background: rgba(0, 0, 0, .64);
}
.right-column .btn-link {
    padding: 0;
}
.report {
    margin: 20px !important;
}
.bottom ul,
.copyright,
.pets,
.social,
.logo-small {
    opacity: .3;
}
.widget .forum-posts li:first-child {
    padding-top: 20px;
}
.recent-posts .forum-posts,
.recent-posts .btn {
    opacity: .5;
}
/*navigation link colors (same as line 442)*/
.user-panel a,
#logo +:nth-child(2) > ul > li > a,
.notifications-widget .btn,
.right-column .btn-link {
    color: #f2f2f2 !important;
}
/*navigation link colors on mouseover (same as line 449)*/
.user-panel a:hover,
.user-panel a:focus,
#logo +:nth-child(2) a:hover,
#logo +:nth-child(2) a:focus,
.notifications-widget .btn:hover,
.right-column .btn-link:hover,
.notifications-widget .btn:focus,
.right-column .btn-link:focus {
    color: #878787 !important;
    text-decoration: none !important;
}
/*link color*/
.content a,
.user-panel .links a,
.report a {
    color: #f2f2f2;
}
/*link color on mouseover*/
.content a:hover,
.content a:focus,
.user-panel .links a:hover,
.user-panel .links a:focus {
    color: #878787;
    text-decoration: none;
}
/*comment color*/
#comments .profanity-filter {
    color: #b1b1b1;
}
/*color of "HI," text in user panel*/
.user-info h4 {
    color: #575757;
}
/*color of user panel, notifications, and trophies header*/
h4,
.widget:first-child h3 {
    background: none;
    text-transform: uppercase;
    font-family: 'Century Gothic';
    color: #454545;
}
/*color of dropdown links*/
.dropdown-menu .multi-column-dropdown li a {
    color: #777 !important;
    text-shadow: none;
    font-family: Calibri;
}
/*link background on mouseover*/
.multi-column-dropdown li a:hover {
    background: rgba(0, 0, 0, 0.05);
}
/*dropdown menu background*/
.open > .dropdown-menu {
    background: rgba(255, 255, 255, 0.88);
}
/*gallery item background and color*/
.gallery .panel {
    background: #3e3e3e;
    border: 0;
    border-radius: 0;
    color: #adadad;
    box-shadow: none;
    height: 200px;
}
.gallery .row {
    margin: 0;
}
.gallery .col-xs-3 {
    padding: 0;
    margin-right: 20px;
    width: 168px;
}
.gallery .col-xs-3:last-child {
    margin: 0;
}
/*background of gallery*/
.gallery,
h2.gallery-header {
    background-color: #4c4c4c;
}
/*color of the view more button for gallery*/
.gallery-header .btn {
    color: #f2f2f2 !important;
}
/*color of the view more button for gallery on mouseover*/
.gallery-header .btn:hover,
.gallery-header .btn:focus {
    color: #878787 !important;
    text-decoration: none !important;
}
.gallery .counter {
    border: none;
    position: absolute;
    margin-top: 10px;
}