app/assets/stylesheets/static_pages.scss
// Place all the styles related to the static_pages controller here.
// They will automatically be included in application.css.
// You can use Sass (SCSS) here: http://sass-lang.com/
@import 'compass';
@import 'mixins';
#intro{
background-image: image-url('intro.jpeg');
background-attachment: fixed;
position: relative;
height: 100%;
@include background-size(cover);
.page_centered {
color: white;
@include center-text(-50%, -50%);
bottom: 10em;
}
h1 {
font-family: Orbitron;
font-weight: bold;
font-size: 5em;
}
h2 {
margin-top: -1.5em;
font-size: 2em;
}
p {
font-size: 1.2em;
margin-bottom: 0.5em;
}
.logo {
height: 50%;
}
}
.button.shadowed {
box-shadow: 0px -3px 3px rgba(0,0,0,0.35) inset;
border-radius: 3px;
margin-bottom: 0px;
padding: 0.85em 4em;
}
#we_are {
padding-top: 100px;
margin-bottom: 100px;
text-align: center;
.fa {
font-size: 6em;
padding-bottom: 14px;
}
}
#apply {
text-align: center;
background: #34495E;
color: white;
padding-top: 32.5px;
padding-bottom: 50px;
}
#cohort {
padding-top: 40px;
padding-bottom: 40px;
background: #D7D7D7 none repeat scroll 0% 0%;
p {
text-align: center;
font-size: 2em;
}
.pic{
margin-bottom: 20px;
padding-left: 10px;
padding-right: 10px;
}
h2 {
text-align: center;
}
.item-wrap {
position: relative;
img {
margin-bottom: 0;
}
}
.overlay{
opacity: 0;
background: image-url('overlay-bg.png');
color: white;
width: 100%;
height: 100%;
top: 0;
position: absolute;
@include transition-property(opacity);
@include transition-duration(0.9s);
&:hover {
opacity: 1;
}
.centered-text{
@include center-text(-50%, -50%);
}
}
}
#feedback {
padding-top: 60px;
h2 {
text-align: center;
}
}
.beneficiary-image {
img{
width: 200px;
border-radius: 50%;
}
}
.beneficiary-message {
margin-top: 50px;
}
footer {
color: #333;
background-color: #0f0f0f;
padding-top: 48px;
padding-bottom: 18px;
text-align: center;
.fa {
font-size: 2em;
padding-left: 0.3em;
}
}
// course outline/ what we do
#what_we_do {
text-align: center;
padding-top: 2em;
// padding-bottom: 2em;
h2 {
margin-top: 0.4em;
margin-bottom: 0;
font-size: 1.5em;
font-weight: bold;
}
h3 {
font-size: 1.3em;
font-style: italic;
}
p {
text-align: justify;
}
hr {
margin-right: 20%;
margin-left: 20%;
}
#note {
text-align: center;
background-color: #2C3840;
padding-top: 34px;
height: 100px;
color: white;
}
}