Hi -
Sorry for bombarding the forum with all these questions - I have a website I need to put up tonight...
I am using the full screen video template.
I added the App Intro, which I intended to use as a background image section, they are in conflict and I can't figure out why.
code below
* it looks like I may be able to produce the parallax effect I was looking for with this ;-)
<!-- Template styles -->
<style rel="stylesheet">
/* TEMPLATE STYLES */
/* Necessary for full page carousel*/
html,
body,
.view {
height: 100%;
}
/* Navigation*/
.navbar {
background-color: transparent;
}
.scrolling-navbar {
-webkit-transition: background .5s ease-in-out, padding .5s ease-in-out;
-moz-transition: background .5s ease-in-out, padding .5s ease-in-out;
transition: background .5s ease-in-out, padding .5s ease-in-out;
}
.top-nav-collapse {
background-color: #455A64;
}
footer.page-footer {
background-color: #455A64;
margin-top: 0;
}
@media only screen and (max-width: 768px) {
.navbar {
background-color: #455A64;
}
}
/* Carousel*/
.carousel,
.carousel-item,
.active {
height: 100%;
}
.carousel-inner {
height: 100%;
}
.flex-center {
color: #fff;
}
.carousel-caption {
height: 100%;
padding-top: 7rem;
}
/*Intro*/
.view {
background: url("img/fit_office.png")no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
@media (max-width: 768px) {
.full-bg-img,
.view {
height: auto;
position: relative;
}
}
.description {
padding-top: 25%;
padding-bottom: 3rem;
color: #fff
}
@media (max-width: 992px) {
.description {
padding-top: 7rem;
text-align: center;
}
#app-mockup {
max-height: 400px;
}
}
</style>
<!--What's in My FitKit-->
<div class="view hm-black-strong">
<div class="full-bg-img flex-center">
<div class="container">
<div class="row" id="fitkit">
<!--First column-->
<div class="col-lg-6">
<div class="description">
<h2 class="h2-responsive wow fadeInLeft">Make purchases with our app </h2>
<hr class="hr-dark">
<p class="wow fadeInLeft" data-wow-delay="0.4s">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Rem repellendus quasi fuga nesciunt dolorum nulla magnam veniam sapiente, fugiat! Commodi sequi non animi ea dolor molestiae, quisquam iste, maiores. Nulla.</p>
<br>
Learn more
Download <i class="fa fa-android left right" aria-hidden="true"></i>
<i class="fa fa-apple left" aria-hidden="true"></i>
<i class="fa fa-windows" aria-hidden="true"></i>
</div>
</div>
<!--/.First column-->
<!--Second column-->
<div class="col-lg-4 col-lg-offset-1 flex-center">
<!--Form-->
<!--/.Form-->
</div>
<!--/Second column-->
</div>
</div>
</div>
</div>
<!--/.what's In My FitKit-->
