Add different backgrounds for other 2 colorful sections

This commit is contained in:
JC Brand 2014-05-06 22:30:37 +02:00
parent 3d2137a677
commit c38c5e4ae3
3 changed files with 43 additions and 7 deletions

View File

@ -128,13 +128,16 @@ a:focus {
}
}
.intro {
.features-section, .outro, .intro {
display: table;
width: 100%;
height: auto;
padding: 100px 0;
text-align: center;
color: #fff;
}
.intro {
background: url(images/header.jpg) no-repeat bottom center scroll;
background-color: #000;
-webkit-background-size: cover;
@ -143,6 +146,22 @@ a:focus {
-o-background-size: cover;
}
.features-section {
background: url('images/bgtr.svg') top right no-repeat,
url('images/bgbl.svg') bottom left no-repeat,
url('images/bgbl.svg') bottom left no-repeat,
url('images/overlay.png'),
linear-gradient(45deg, #b39c68, #a56365, #412e4c);
}
.outro {
height: 100%;
background: url('images/bgtr.svg') top right no-repeat,
url('images/bgbl.svg') bottom left no-repeat,
url('images/overlay.png'),
linear-gradient(45deg, #384955, #655361, #85505f);
}
.intro-body {
display: table-cell;
vertical-align: middle;

View File

@ -103,7 +103,7 @@
</div>
</section>
<section class="intro content-section" id="features">
<section class="features-section content-section" id="features">
<div class="container">
<div class="row">
<div class="col-lg-4">
@ -188,7 +188,7 @@
</div>
</section>
<section class="intro content-section" id="contact">
<section class="outro content-section" id="contact">
<div class="intro-body">
<div class="container">
<div class="row">

View File

@ -133,22 +133,39 @@ a:focus {
}
// Full Page Image Intro Section
.intro {
.features-section, .outro, .intro {
display: table;
width: 100%;
height: auto;
padding: 100px 0;
text-align: center;
color: @light;
color: #fff;
}
.intro {
background: url(images/header.jpg) no-repeat bottom center scroll;
background-color: @dark;
background-color: #000;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;
}
.features-section {
background: url('images/bgtr.svg') top right no-repeat,
url('images/bgbl.svg') bottom left no-repeat,
url('images/bgbl.svg') bottom left no-repeat,
url('images/overlay.png'),
linear-gradient(45deg, #b39c68, #a56365, #412e4c);
}
.outro {
background: url('images/bgtr.svg') top right no-repeat,
url('images/bgbl.svg') bottom left no-repeat,
url('images/overlay.png'),
linear-gradient(45deg, #384955, #655361, #85505f);
}
.intro-body {
display: table-cell;
vertical-align: middle;