#69aa33 gruen
#ea5a4f rot
.navbar-inner{
padding-right: 5px;
}
.tc-header .nav-collapse{
float: none;
}
.navbar .nav {
width: 100%;
text-align: center;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.nav-collapse .nav > li{
float: none;
display: inline-block;
}
.nav-collapse .nav > li li{
text-align: left;
}
@media (max-width: 979px){
.nav-collapse .nav > li{
display: list-item;
}
}
.nav { z-index:99; margin:0; padding:0; list-style:none; line-height:0; background-color: #69aa33;}
.entry-title { display:none; }
Remove the Grey Bar:
|
1
2
3
4
5
|
/* START OF Change Grey Bar between Navbar and Slider */
header.tc-header {
border-bottom: 0;
}
/* END OF Change Grey Bar between Navbar and Slider */
|
Credit: @fabioeliseo
Change the Grey Bar:
|
1
2
3
4
5
6
|
/* START OF Change Grey Bar between Navbar and Slider */
/* 2px=thickness, solid=style (dotted – dashed – solid – double – groove – ridge – inset – outset), green=color */
header.tc-header {
border-bottom: 2px solid green;
}
/* END OF Change Grey Bar between Navbar and Slider */
|
Step 1 – Main body/containers
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
/* START OF Adjust Sitewide Background & Text Color/Size */
/* Change the (pink) body background */
body {
background: none repeat scroll 0 0 pink; /* Change pink */
color: #5A5A5A; /* Default Text Color */
padding-bottom: 0px;
}
/* Change the central wrapper background */
#main-wrapper {
margin-top: 0px ;
margin-bottom: 0px ;
background-color: pink ; /* Change pink */
border: 2px solid red ; /* Delete if no border needed */
}
.container[role=”main”] {
background-color: pink ; /* Change pink */
}
/* END OF Adjust Sitewide Background & Text Color/Size */
|
Step 2 – Header/Navbar
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
|
/* START OF Adjust Sitewide Background & Text Color/Size */
/* Change the Header background */
header.tc-header, .navbar-wrapper,
.sticky-enabled header.tc-header {
background-color: pink; /* Change pink */
}
/* Adjust the Header */
header.tc-header {
/* Adjust the (red) top border style/color */
border-top: 10px solid red;
/* Adjust the (green) bottom border style/color */
border-bottom: 10px solid green;
}
/* Change the Navbar background */
.navbar-inner {
background-color: pink; /* Change pink */
background-image: linear-gradient(to bottom, pink, pink); /* Change pink */
background-repeat: repeat-x;
border: 1px solid pink; /* Change pink */
border-radius: 4px;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.067);
}
/* END OF Adjust Sitewide Background & Text Color/Size */
|
Step 3 – Slider
|
1
2
3
4
5
6
|
/* START OF Adjust Sitewide Background & Text Color/Size */
/* Optional – Remove Grey Bar above Slider */
.tc-header {
border-bottom: none;
}
/* END OF Adjust Sitewide Background & Text Color/Size */
|
Step 4 – Featured Pages
|
1
2
3
4
5
6
|
/* START OF Adjust Sitewide Background & Text Color/Size */
/* Fix the White Rectangles (including FPU extension) */
.round-div, [class*=span] .widget-front .round-div {
border-color: pink; /* Change pink */
}
/* END OF Adjust Sitewide Background & Text Color/Size */
|
Step 5 – Pages/Posts
|
1
2
3
|
/* START OF Adjust Sitewide Background & Text Color/Size */
/* No code needed */
/* END OF Adjust Sitewide Background & Text Color/Size */
|
Step 6 – Press Customizr Footer
|
1
2
3
4
5
6
7
8
9
10
|
/* START OF Adjust Sitewide Background & Text Color/Size */
/* Change the Footer background */
footer#footer .colophon {
background-color: pink; /* Change pink */
}
/* Optional – Remove Grey Bar above Footer */
footer#footer {
border-top: none;
}
/* END OF Adjust Sitewide Background & Text Color/Size */
|
Step 7 – Widgets Footer
|
1
2
3
4
5
|
/* START OF Adjust Sitewide Background & Text Color/Size */
footer#footer, .footer-widgets {
background: none repeat scroll 0 0 pink; /* Change pink */
}
/* END OF Adjust Sitewide Background & Text Color/Size */
|
Step 8 – Adjust sitewide fonts size/color
|
1
2
3
4
5
6
7
8
9
10
11
|
/* START OF Adjust Sitewide Background & Text Color/Size */
body {
/* Adjust sitewide (#5A5A5A) text color */
color: #5A5A5A;
/* Adjust sitewide (1.2em) text size */
font-size: 1.2em;
/* Adjust sitewide (Open Sans) font family */
font-family: Open Sans;
/* Adjust sitewide text alignment */
text-align: left; /* left|right|center|justify */
}/* END OF Adjust Sitewide Background & Text Color/Size */
|
Remove Grey Bar and Whitespace from Footer
Last Reviewed: 22-Apr-15 (3.3.20) 3.1.* 3.2.* 3.3.*
Where to copy/paste this code?
The simplest way is to use the Custom CSS section of the customizer option screen. If you have many customizations to make in CSS and PHP, then we strongly recommend you create a child theme. Everything you need to know about creating a child theme with Customizr here.
|
1
2
3
4
5
6
7
8
9
10
11
|
/* START OF Remove Grey Bar and Whitespace from Footer */
/* Remove grey bar */
footer#footer {
border-top: none;
}
/* Reduce whitespace */
#main-wrapper {
margin-bottom: 0px;
}
/* END OF Remove Grey Bar and Whitespace from Footer */
|