File: /home/demo/public_html/roofleak/assets/scss/titlebar/_titlebar.scss
.titlebar-scroll-link {
font-size: 30px;
position: absolute;
bottom: 1.25em;
left: auto;
.text-center & {
margin-left: -15px;
}
}
.titlebar-col {
position: static;
}
.titlebar-inner {
padding-top: 200px;
padding-bottom: 200px;
position: relative;
z-index: 2;
color: #000;
h1,
p,
.breadcrumb {
position: relative;
z-index: 1;
}
h1,
p,
a {
color: inherit;
}
h1 {
margin: 0 0 0.5em;
font-size: 60px;
font-weight: 600;
}
p {
font-size: 20px;
font-weight: 500;
&:last-child {
margin-bottom: 0;
}
}
p,
.titlebar-scroll-link {
opacity: 0.6;
}
}
.titlebar {
position: relative;
background-color: inherit;
background-size: cover;
.breadcrumb {
margin-top: 1.5em;
ol {
background: none;
border-radius: 0;
}
&.bordered {
padding-top: em(20);
padding-bottom: em(20);
border-top: 1px solid #F3F3F3;
border-bottom: 1px solid #F3F3F3;
}
}
> .breadcrumb {
margin-top: 0;
}
.titlebar-scroll-link {
&:hover {
opacity: 1;
}
}
.main-header-overlay {
position: relative;
top: auto;
left: auto;
}
// Adding a preloader when there's parallax bg. to prevent showingn jumping issue while applying parallax bg
&[data-parallax=true] {
&:before {
content: '';
display: inline-block;
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background-color: #999;
transition: opacity 0.3s, visibility 0.3s;
}
.liquid-parallax-container {
opacity: 0;
}
&.liquid-parallax-bg {
&:before {
opacity: 0;
visibility: hidden;
}
.liquid-parallax-container {
animation: fadeIn 0.3s 0.1s cubic-bezier(0.39, 0.575, 0.565, 1) both alternate;
}
}
&.bg-none {
background-image: none !important;
}
}
}
.titlebar-default {
.titlebar-inner {
padding-top: 50px;
padding-bottom: 50px;
h1 {
font-size: 48px;
}
}
}
// Titlebar Sizes
.titlebar-sm {
.titlebar-inner {
padding-top: 75px;
padding-bottom: 75px;
}
}
.titlebar-md {
.titlebar-inner {
padding-top: 100px;
padding-bottom: 100px;
}
}
@import 'schemes';