I never mind sharing. I hope these help some of you who are struggling.
Remove the sections in red.
Best Wishes,
Edmun.
The Value after the # sign indicates a color. Safe Font types: Helvetica, Tahoma, Georgia, Impact, Trebuchet MS, Arial, Verdana, Calibri
(Use %, so that it doesn't obscure your mobile view. You can play with Repeat: Repeat. and Color Values)
/* background of page */
body{
background-color: #ffffff !important;
background-image:url(INSERTYOURIMAGEURLHERE) !Important;
background-repeat: no repeat !important;
background-size: 100% 100% !Important;
background-position: center center !important;
}
(Font Styles for your Bold, Italic, Strike-thru, and visited links.)
em {
font-family: Trebuchet MS;
font-size: 10px;
color:#585857;
}
strong {
font-family: Trebuchet MS;
font-size: 11px;
color: #585857;
}
a:link,a:active,a:visited {
font-family: Trebuchet MS;
color: #585857;
text-decoration: none; -webkit-transition-duration: 1.00s;
}
-webkit-font-smoothing: antialiased;
}
(This can be added to any subsection with text: to optimize for all browsers.)
text-rendering: optimizeLegibility;
(Navigation bar is at the top of the page. pro tip: to invis it add the code- display: none; - underneath "color")
/*Nav Bar*/
.mainTab{
Font-family: Trebuchet MS !important;
font-size: 11px;
color: #585857!important;
}
(This is the subtab pull down menu for your navigation bar)
.mainTab-item-SubTabHover{
background-color: transparent;
font-family: Trebuchet MS;
font-size: 11px;
color: #585857;
}
(This area deals with the header. To remove it entirely you can either add- display:none; - or change the values to 0%, 0px)
/* Header Picture */
.banner-header{
width: 100% !Important;
height: 450px !Important;
border-size: 0px !Important;
background-image:url(INSERTYOURIMAGEURLHERE) !Important;
background-repeat: no-repeat !important;
background-position: center !Important;
background-size: 100% 100% !important;
}
(This will make everything on the page monochromatic - black and white. Courtesy of Lorenzo Iodanza.)
.site-body a {color: #cccccc; font-size:17px;} img {-webkit-filter: grayscale(100%); filter: grayscale(100%); filter: gray;
}
(There is an almost undiscernable shadow-box around your header picture. This removes it. USE WITH CAUTION- It also removes your comments. Make sense of that...)
/*removes the gradient from your header*/
.media-frame {
position: absolute;
padding: 0px;
left: 0;
bottom: 0;
width: 0%;
padding-top: 0px;
z-index: 0;
}
(There is a faint, 1px line around your header box, and a rounding. this removes it.)
/*removes the invisible-visible box from around your header*/
.banner-header {
border-radius: 0px 0px 0 0;
}
.banner-frame {
border-radius: 0px;
border-color: white;
border-width: 0px;
background-color: transparent !important;
}
(This will make your center column transparent.)
/*center column*/
.sheet {
border-radius: 0px;
border-color:transparent ;
border-width: 0px;
background-color: transparent!important;
}
(This will change your center column, under the header 5% is left, 35%+ is right)
.span12.push4.tablet16.mobile16.column.column-wide{
width: 600px !important;
max-width: 100% !important;
left: 20% !important;
position: relative !Important;
}
(These are courtesy of the other page- they customize the "add" text boxes on your profile)
.section-member-customizableHtml:nth-child(1){
background-color: transparent!important;
text-shadow: 0px 0px 0px black; !important;
font-family: Trebuchet MS !important;
color: #585857; !important;
background-image:url() !Important;
border-size: 0px !Important;
box-shadow: 0 0 0px 0px white;
border-color: #575757 !Important;
background-repeat:no-repeat !important;
background-size: 100% 100% !Important;
background-position: center center !important;
}
.section-member-customizableHtml:nth-child(2){
background-color: transparent!important;
text-shadow: 0px 0px 0px black; !important;
font-family: Trebuchet MS !important;
color: #585857; !important;
background-image:url() !Important;
border-size: 0px !Important;
box-shadow: 0 0 0px 0px white;
border-color: #585857 !Important;
background-repeat: no !important;
background-size: 100% 100% !Important;
background-position: center center !important;
}
(add this portion to the code below under background-position before the } - to add a scroll bar to either or both sections.the max height can be adjusted)
overflow: auto !Important;
min-height: 200px !important;
max-height: 200px !Important;
(This is the section below the "edit/add" text boxes. This is how you change the font, color, and transparency.)
.aboutMember{
background-color: transparent!important;
text-shadow: 0px 0px 0px black; !important;
font-family: Trebuchet MS !important;
color: #585857; !important;
background-image:url(INSERTYOURIMAGEHERE) !Important;
background-repeat:yes !important;
background-size: 100% 100% !Important;
background-position: center center !important;
}
/* Hides Social Buttons */
.banner-socialActions{
display:none !Important;
}
/* hides recent activity */
.section-member-activity{
display: none !important;
}
/* hides your discussions */
.section-member-discussionEntries{
display:none !important;
}
/* hides blog section on profile */
.section-member-blogEntries{
display:none !important;
}
/* hides site name */
.header-siteName{
display:none !important;
}
/* hides photos on profile */
.grid-frame.sheet.section-member-photoEntries{
display:none !Important;
}
(This is the comment area-section of your profile. Scroll bar courtesy of Spence.)
/*Comments Section*/
.comments-list{
overflow: auto !Important;
max-height: 500px !Important;
Font-family: !important;
color: #ff0000!important;
text-shadow: 0px opx 0px #000; !important;
}
(This deals with the word COMMENTS above the actual section. Changing text type, and color and alignment)
.module-name {
font-family: Trebuchet MS;
font-size: 10px;
font-weight: normal;
color: #585857;
text-align: left;
}
(This takes care of The word comment under the Comment wall section. )
.section-member-commentWall{
font-family: Trebuchet MS;
font-size: 10px;
color:#585857;
}
(This is a kit that will color your scroll bar(s) on the page.)
::-webkit-scrollbar-track{
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.1);
background-color: #000000;
border-radius: 10px;
}
::-webkit-scrollbar{
width: 10px;
background-color: ##a30905;
}
::-webkit-scrollbar-thumb{
border-radius: 10px;
background-color: #000000;
background-image: -webkit-gradient(linear, 40% 0%, 75% 84%, from(#AB2E2E),to(#2E3AAB), color
}
Some of these codes are courtesy Marly, Knight, Mouse, and Spence. I just left them in to keep my codes together and add to them.