Header
Site Title Color
Entire Site
/* Desktop */
a.Header-branding {
color: #ff0000 !important;
}
/* Mobile */
a.Mobile-bar-branding {
color: #ff0000 !important;
}
One Page
/* Desktop */
body#collection-5893546059cc6801da2be63f a.Header-branding {
color: #ff0000 !important;
}
/* Mobile */
body#collection-5893546059cc6801da2be63f a.Mobile-bar-branding {
color: #ff0000 !important;
}
Site Title (Top) – Navigation (Bottom)
Entire Site
.Header-inner {
flex-direction: column;
}
One Page
body#collection-5893546059cc6801da2be63f .Header-inner {
flex-direction: column;
}
Site Title (Right) – Navigation (Left)
Entire Site
/* Desktop */
.Header-inner {
flex-direction: row-reverse;
}
/* Mobile */
.Mobile-bar.Mobile-bar--top {
flex-direction: row-reverse;
}
One Page
/* Desktop */
body#collection-5893546059cc6801da2be63f .Header-inner {
flex-direction: row-reverse;
}
/* Mobile */
body#collection-5893546059cc6801da2be63f .Mobile-bar.Mobile-bar--top {
flex-direction: row-reverse;
}
Remove Site Title
Entire Site
/* Desktop */
.Header-branding {
display: none;
}
/* Mobile */
a.Mobile-bar-branding {
display: none;
}
One Page
/* Desktop */
body#collection-5893546059cc6801da2be63f .Header-branding {
display: none;
}
/* Mobile */
body#collection-5893546059cc6801da2be63f a.Mobile-bar-branding {
display: none;
}
Remove Tagline
Entire Site
.Header-tagline {
display: none;
}
One Page
body#collection-5893546059cc6801da2be63f .Header-tagline {
display: none;
}
Show Tagline on Mobile
a.Mobile-bar-branding:after {
content: "Tagline";
display: block;
margin-top: 10px;
font-size: 15px;
color: #ff0000;
}
Tagline Color
.Header-tagline {
color: #ff0000 !important;
}
Navigation vertically stack
.Header-nav-inner {
display: flex;
flex-direction: column;
}
.Header-inner {
padding-right: 5px;
}
Hide Item in Navigation
First Item
.Header-nav--primary .Header-nav-item:nth-child(1) {
display: none;
}
Second Item
.Header-nav--primary .Header-nav-item:nth-child(2) {
display: none;
}
Do similar!
Replace Hamburger Icon with word “Menu”
Entire Site
button.Mobile-bar-menu {
visibility: hidden;
}
button.Mobile-bar-menu:after {
visibility: visible;
content: "Menu";
color: #ff0000;
font-size: 20px;
}
One Page
body#collection-5893546059cc6801da2be63f button.Mobile-bar-menu {
visibility: hidden;
}
body#collection-5893546059cc6801da2be63f button.Mobile-bar-menu:after {
visibility: visible;
content: "Menu";
color: #ff0000;
font-size: 20px;
}
Navigation Overlay Background Color
Entire Site
.Mobile-overlay-menu {
background: #ff0000;
}
.Mobile-overlay {
background: #ff0000 !important;
}
button.Mobile-overlay-close {
background: #ff0000 !important;
}
One Page
body#collection-5893546059cc6801da2be63f .Mobile-overlay-menu {
background: #ff0000;
}
body#collection-5893546059cc6801da2be63f .Mobile-overlay {
background: #ff0000 !important;
}
body#collection-5893546059cc6801da2be63f button.Mobile-overlay-close {
background: #ff0000 !important;
}
Navigation Overlay Width
.Mobile-overlay {
width: 60%;
}
Header Background Color
Entire Site
/* Mobile */
.Mobile-bar.Mobile-bar--top {
background: #000;
}
/* Desktop */
.Header.Header--bottom {
background: #000;
}
One Page
/* Mobile */
body#collection-5893546059cc6801da2be63f .Mobile-bar.Mobile-bar--top {
background: #000;
}
/* Desktop */
body#collection-5893546059cc6801da2be63f .Header.Header--bottom {
background: #000;
}
Fixed Header
Entire Site
/* Desktop */
.Header.Header--bottom {
position: fixed !important;
top: 0;
left: 0;
right: 0;
z-index: 999;
}
/* Mobile */
.Mobile-bar.Mobile-bar--top {
position: fixed;
left: 0;
right: 0;
top: 0;
z-index: 999;
}
One Page
/* Desktop */
body#collection-5893546059cc6801da2be63f .Header.Header--bottom {
position: fixed !important;
top: 0;
left: 0;
right: 0;
z-index: 999;
}
/* Mobile */
body#collection-5893546059cc6801da2be63f .Mobile-bar.Mobile-bar--top {
position: fixed;
left: 0;
right: 0;
top: 0;
z-index: 999;
}
Remove Header
Entire Site
/* Mobile */
.Mobile-bar.Mobile-bar--top {
display: none;
}
/* Desktop */
.Header.Header--bottom {
display: none !important;
}
One Page
/* Mobile */
body#collection-5893546059cc6801da2be63f .Mobile-bar.Mobile-bar--top {
display: none;
}
/* Desktop */
body#collection-5893546059cc6801da2be63f .Header.Header--bottom {
display: none !important;
}
Footer
Footer Background Color
Entire Site
footer.Footer {
background: #f1f2f3;
}
One Page
body#collection-5893546059cc6801da2be63f footer.Footer {
background: #f1f2f3;
}
Footer Background Image
Entire Site
footer.Footer {
background-image: url(https://beaverhero.com/wp-content/uploads/2019/07/brine-demo-squarespace-com-1689x1080-500w.jpg);
background-size: cover;
background-position: center top;
background-repeat: no-repeat;
}
One Page
body#collection-5893546059cc6801da2be63f footer.Footer {
background-image: url(https://beaverhero.com/wp-content/uploads/2019/07/brine-demo-squarespace-com-1689x1080-500w.jpg);
background-size: cover;
background-position: center top;
background-repeat: no-repeat;
}
Remove Footer
Entire Site
footer.Footer {
display: none !important;
}
One Page
body#collection-5893546059cc6801da2be63f footer.Footer {
display: none !important;
}
Blog Page – Blog Posts
Remove Post Featured Image
.BlogList-item-image {
display: none !important;
}
Remove Post Date
.Blog-meta-item--date {
display: none !important;
}
Remove Post Date in Post Pagination
time.BlogItem-pagination-link-meta-item.BlogItem-pagination-link-meta-item--date {
display: none;
}
Align Center Post Title/Post Date (Blog Page)
.view-list .BlogList-item * {
text-align: center;
}
.Blog-meta.BlogList-item-meta {
justify-content: center;
}
Other
Page Background Color
Entire Site
.Main {
background: #000;
}
One Page
body#collection-58e6a3aeebbd1a572ac159b9 .Main {
background: #000;
}
Page Background Image
Entire Site
.Main {
background-image: url(https://beaverhero.com/wp-content/uploads/2019/06/liberte.png);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
}
One Page
body#collection-58e6a3aeebbd1a572ac159b9 .Main {
background-image: url(https://beaverhero.com/wp-content/uploads/2019/06/liberte.png);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
}
Remove White spacing between Content & Header
Entire Site
.Main-content {
padding-top: 0;
}
One Page
body#collection-58e6a3aeebbd1a572ac159b9 .Main-content {
padding-top: 0;
}