Browse Source
rename lib to vendor, remove deprecated LESS version, revise package.json, load jQuery easing through npm, restructure SCSS directory into modules, expanded code commenting and documentation theme-widemaster
David Miller
9 years ago
77 changed files with 1448 additions and 9353 deletions
File diff suppressed because one or more lines are too long
@ -1,6 +1,6 @@ |
|||||||
/*! |
/*! |
||||||
* Start Bootstrap - Agency v4.0.0-alpha (http://startbootstrap.com/template-overviews/agency)
|
* Start Bootstrap - Agency v4.0.0-alpha (http://startbootstrap.com/template-overviews/agency)
|
||||||
* Copyright 2013-2017 Start Bootstrap |
* Copyright 2013-2017 Start Bootstrap |
||||||
* Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap/blob/gh-pages/LICENSE)
|
* Licensed under () |
||||||
*/ |
*/ |
||||||
!function(a){"use strict";a(document).on("click","a.page-scroll",function(o){var n=a(this);a("html, body").stop().animate({scrollTop:a(n.attr("href")).offset().top-54},1250,"easeInOutExpo"),o.preventDefault()}),a("body").scrollspy({target:"#mainNav",offset:54}),a(".navbar-collapse>ul>li>a").click(function(){a(".navbar-collapse").collapse("hide")}),a(window).scroll(function(){a("#mainNav").offset().top>100?a("#mainNav").addClass("navbar-shrink"):a("#mainNav").removeClass("navbar-shrink")})}(jQuery); |
!function(a){"use strict";a('a[href*="#"]:not([href="#"])').click(function(){if(location.pathname.replace(/^\//,"")==this.pathname.replace(/^\//,"")&&location.hostname==this.hostname){var n=a(this.hash);if(n=n.length?n:a("[name="+this.hash.slice(1)+"]"),n.length)return a("html, body").animate({scrollTop:n.offset().top-54},1e3,"easeInOutExpo"),!1}}),a("body").scrollspy({target:"#mainNav",offset:54}),a(".navbar-collapse>ul>li>a").click(function(){a(".navbar-collapse").collapse("hide")}),a(window).scroll(function(){a("#mainNav").offset().top>100?a("#mainNav").addClass("navbar-shrink"):a("#mainNav").removeClass("navbar-shrink")})}(jQuery); |
||||||
@ -1,700 +0,0 @@ |
|||||||
@import "variables.less"; |
|
||||||
@import "mixins.less"; |
|
||||||
|
|
||||||
// Global Components |
|
||||||
|
|
||||||
body { |
|
||||||
overflow-x: hidden; |
|
||||||
.body-font; |
|
||||||
} |
|
||||||
|
|
||||||
.text-primary { |
|
||||||
color: @theme-primary !important; |
|
||||||
} |
|
||||||
|
|
||||||
p { |
|
||||||
line-height: 1.75; |
|
||||||
} |
|
||||||
|
|
||||||
a { |
|
||||||
color: @theme-primary; |
|
||||||
&:hover, |
|
||||||
&:focus, |
|
||||||
&:active, |
|
||||||
&.active { |
|
||||||
color: darken(@theme-primary, 10%); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, h6 { |
|
||||||
.heading-font; |
|
||||||
font-weight: 700; |
|
||||||
} |
|
||||||
|
|
||||||
// Restyled Primary Buttons |
|
||||||
|
|
||||||
.btn-primary { |
|
||||||
.button-variant(white; @theme-primary; @theme-primary); |
|
||||||
.heading-font; |
|
||||||
font-weight: 700; |
|
||||||
} |
|
||||||
|
|
||||||
.btn-xl { |
|
||||||
.button-variant(white; @theme-primary; @theme-primary); |
|
||||||
.heading-font; |
|
||||||
font-weight: 700; |
|
||||||
border-radius: 3px; |
|
||||||
font-size: 18px; |
|
||||||
padding: 20px 40px; |
|
||||||
} |
|
||||||
|
|
||||||
// Custom Navigation Bar |
|
||||||
|
|
||||||
#mainNav { |
|
||||||
background-color: @gray-darker; |
|
||||||
.navbar-toggler { |
|
||||||
border: 0; |
|
||||||
color: white; |
|
||||||
background-color: @theme-primary; |
|
||||||
font-size: 12px; |
|
||||||
text-transform: uppercase; |
|
||||||
.heading-font; |
|
||||||
padding: 13px; |
|
||||||
right: 0; |
|
||||||
} |
|
||||||
.container { |
|
||||||
padding: 0; |
|
||||||
.navbar-brand { |
|
||||||
color: @theme-primary; |
|
||||||
.script-font; |
|
||||||
&:hover, |
|
||||||
&:focus, |
|
||||||
&:active, |
|
||||||
&.active { |
|
||||||
color: darken(@theme-primary, 10%); |
|
||||||
} |
|
||||||
} |
|
||||||
.navbar-nav { |
|
||||||
.nav-item { |
|
||||||
.nav-link { |
|
||||||
font-size: 90%; |
|
||||||
padding: 0.75em 0; |
|
||||||
.heading-font; |
|
||||||
font-weight: 400; |
|
||||||
letter-spacing: 1px; |
|
||||||
color: white; |
|
||||||
&:hover, |
|
||||||
&.active { |
|
||||||
color: @theme-primary; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
@media(min-width:992px) { |
|
||||||
#mainNav { |
|
||||||
background-color: transparent; |
|
||||||
padding: 25px 0; |
|
||||||
-webkit-transition: padding 0.3s; |
|
||||||
-moz-transition: padding 0.3s; |
|
||||||
transition: padding 0.3s; |
|
||||||
border: none; |
|
||||||
.navbar-brand { |
|
||||||
font-size: 1.75em; |
|
||||||
-webkit-transition: all 0.3s; |
|
||||||
-moz-transition: all 0.3s; |
|
||||||
transition: all 0.3s; |
|
||||||
} |
|
||||||
.navbar-nav { |
|
||||||
.nav-item { |
|
||||||
.nav-link { |
|
||||||
padding: 1.1em 1em !important; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
&.navbar-shrink { |
|
||||||
background-color: @gray-darker; |
|
||||||
padding: 0; |
|
||||||
.navbar-brand { |
|
||||||
padding: 12px 0; |
|
||||||
font-size: 1.25em; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
header { |
|
||||||
background-image: url('../img/header-bg.jpg'); |
|
||||||
background-repeat: no-repeat; |
|
||||||
background-attachment: scroll; |
|
||||||
background-position: center center; |
|
||||||
.background-cover; |
|
||||||
text-align: center; |
|
||||||
color: white; |
|
||||||
.intro-text { |
|
||||||
padding-top: 100px; |
|
||||||
padding-bottom: 50px; |
|
||||||
.intro-lead-in { |
|
||||||
.serif-font; |
|
||||||
font-style: italic; |
|
||||||
font-size: 22px; |
|
||||||
line-height: 22px; |
|
||||||
margin-bottom: 25px; |
|
||||||
} |
|
||||||
.intro-heading { |
|
||||||
.heading-font; |
|
||||||
font-weight: 700; |
|
||||||
font-size: 50px; |
|
||||||
line-height: 50px; |
|
||||||
margin-bottom: 25px; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
@media(min-width:768px) { |
|
||||||
header { |
|
||||||
.intro-text { |
|
||||||
padding-top: 300px; |
|
||||||
padding-bottom: 200px; |
|
||||||
.intro-lead-in { |
|
||||||
.serif-font; |
|
||||||
font-style: italic; |
|
||||||
font-size: 40px; |
|
||||||
line-height: 40px; |
|
||||||
margin-bottom: 25px; |
|
||||||
} |
|
||||||
.intro-heading { |
|
||||||
.heading-font; |
|
||||||
font-weight: 700; |
|
||||||
font-size: 75px; |
|
||||||
line-height: 75px; |
|
||||||
margin-bottom: 50px; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Global Section Styles |
|
||||||
|
|
||||||
section { |
|
||||||
padding: 100px 0; |
|
||||||
h2.section-heading { |
|
||||||
font-size: 40px; |
|
||||||
margin-top: 0; |
|
||||||
margin-bottom: 15px; |
|
||||||
} |
|
||||||
h3.section-subheading { |
|
||||||
font-size: 16px; |
|
||||||
.serif-font; |
|
||||||
text-transform: none; |
|
||||||
font-style: italic; |
|
||||||
font-weight: 400; |
|
||||||
margin-bottom: 75px; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
@media(min-width:768px) { |
|
||||||
section { |
|
||||||
padding: 150px 0; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Services Section |
|
||||||
|
|
||||||
.service-heading { |
|
||||||
margin: 15px 0; |
|
||||||
text-transform: none; |
|
||||||
} |
|
||||||
|
|
||||||
// Portfolio Section |
|
||||||
|
|
||||||
#portfolio { |
|
||||||
.portfolio-item { |
|
||||||
margin: 0 0 15px; |
|
||||||
right: 0; |
|
||||||
.portfolio-link { |
|
||||||
display: block; |
|
||||||
position: relative; |
|
||||||
max-width: 400px; |
|
||||||
margin: 0 auto; |
|
||||||
.portfolio-hover { |
|
||||||
background: fade(@theme-primary, 90%); |
|
||||||
position: absolute; |
|
||||||
width: 100%; |
|
||||||
height: 100%; |
|
||||||
opacity: 0; |
|
||||||
transition: all ease 0.5s; |
|
||||||
-webkit-transition: all ease 0.5s; |
|
||||||
-moz-transition: all ease 0.5s; |
|
||||||
&:hover { |
|
||||||
opacity: 1; |
|
||||||
} |
|
||||||
.portfolio-hover-content { |
|
||||||
position: absolute; |
|
||||||
width: 100%; |
|
||||||
height: 20px; |
|
||||||
font-size: 20px; |
|
||||||
text-align: center; |
|
||||||
top: 50%; |
|
||||||
margin-top: -12px; |
|
||||||
color: white; |
|
||||||
i { |
|
||||||
margin-top: -12px; |
|
||||||
} |
|
||||||
h3, |
|
||||||
h4 { |
|
||||||
margin: 0; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
.portfolio-caption { |
|
||||||
max-width: 400px; |
|
||||||
margin: 0 auto; |
|
||||||
background-color: white; |
|
||||||
text-align: center; |
|
||||||
padding: 25px; |
|
||||||
h4 { |
|
||||||
text-transform: none; |
|
||||||
margin: 0; |
|
||||||
} |
|
||||||
p { |
|
||||||
.serif-font; |
|
||||||
font-style: italic; |
|
||||||
font-size: 16px; |
|
||||||
margin: 0; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
* { |
|
||||||
z-index: 2; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
@media(min-width:767px) { |
|
||||||
#portfolio { |
|
||||||
.portfolio-item { |
|
||||||
margin: 0 0 30px; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Timeline |
|
||||||
|
|
||||||
.timeline { |
|
||||||
list-style: none; |
|
||||||
padding: 0; |
|
||||||
position: relative; |
|
||||||
&:before { |
|
||||||
top: 0; |
|
||||||
bottom: 0; |
|
||||||
position: absolute; |
|
||||||
content: ""; |
|
||||||
width: 2px; |
|
||||||
background-color: #f1f1f1; |
|
||||||
left: 40px; |
|
||||||
margin-left: -1.5px; |
|
||||||
} |
|
||||||
> li { |
|
||||||
margin-bottom: 50px; |
|
||||||
position: relative; |
|
||||||
min-height: 50px; |
|
||||||
&:before, |
|
||||||
&:after { |
|
||||||
content: " "; |
|
||||||
display: table; |
|
||||||
} |
|
||||||
&:after { |
|
||||||
clear: both; |
|
||||||
} |
|
||||||
.timeline-panel { |
|
||||||
width: 100%; |
|
||||||
float: right; |
|
||||||
padding: 0 20px 0 100px; |
|
||||||
position: relative; |
|
||||||
text-align: left; |
|
||||||
&:before { |
|
||||||
border-left-width: 0; |
|
||||||
border-right-width: 15px; |
|
||||||
left: -15px; |
|
||||||
right: auto; |
|
||||||
} |
|
||||||
&:after { |
|
||||||
border-left-width: 0; |
|
||||||
border-right-width: 14px; |
|
||||||
left: -14px; |
|
||||||
right: auto; |
|
||||||
} |
|
||||||
} |
|
||||||
.timeline-image { |
|
||||||
left: 0; |
|
||||||
margin-left: 0; |
|
||||||
width: 80px; |
|
||||||
height: 80px; |
|
||||||
position: absolute; |
|
||||||
z-index: 100; |
|
||||||
background-color: @theme-primary; |
|
||||||
color: white; |
|
||||||
border-radius: 100%; |
|
||||||
border: 7px solid #f1f1f1; |
|
||||||
text-align: center; |
|
||||||
h4 { |
|
||||||
font-size: 10px; |
|
||||||
margin-top: 12px; |
|
||||||
line-height: 14px; |
|
||||||
} |
|
||||||
} |
|
||||||
&.timeline-inverted > .timeline-panel { |
|
||||||
float: right; |
|
||||||
text-align: left; |
|
||||||
padding: 0 20px 0 100px; |
|
||||||
&:before { |
|
||||||
border-left-width: 0; |
|
||||||
border-right-width: 15px; |
|
||||||
left: -15px; |
|
||||||
right: auto; |
|
||||||
} |
|
||||||
&:after { |
|
||||||
border-left-width: 0; |
|
||||||
border-right-width: 14px; |
|
||||||
left: -14px; |
|
||||||
right: auto; |
|
||||||
} |
|
||||||
} |
|
||||||
&:last-child { |
|
||||||
margin-bottom: 0; |
|
||||||
} |
|
||||||
} |
|
||||||
.timeline-heading { |
|
||||||
h4 { |
|
||||||
margin-top: 0; |
|
||||||
color: inherit; |
|
||||||
&.subheading { |
|
||||||
text-transform: none; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
.timeline-body { |
|
||||||
> p, |
|
||||||
> ul { |
|
||||||
margin-bottom: 0; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
@media(min-width:768px) { |
|
||||||
.timeline { |
|
||||||
&:before { |
|
||||||
left: 50%; |
|
||||||
} |
|
||||||
> li { |
|
||||||
margin-bottom: 100px; |
|
||||||
min-height: 100px; |
|
||||||
.timeline-panel { |
|
||||||
width: 41%; |
|
||||||
float: left; |
|
||||||
padding: 0 20px 20px 30px; |
|
||||||
text-align: right; |
|
||||||
} |
|
||||||
.timeline-image { |
|
||||||
width: 100px; |
|
||||||
height: 100px; |
|
||||||
left: 50%; |
|
||||||
margin-left: -50px; |
|
||||||
h4 { |
|
||||||
font-size: 13px; |
|
||||||
margin-top: 16px; |
|
||||||
line-height: 18px; |
|
||||||
} |
|
||||||
} |
|
||||||
&.timeline-inverted > .timeline-panel { |
|
||||||
float: right; |
|
||||||
text-align: left; |
|
||||||
padding: 0 30px 20px 20px; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
@media(min-width:992px) { |
|
||||||
.timeline { |
|
||||||
> li { |
|
||||||
min-height: 150px; |
|
||||||
.timeline-panel { |
|
||||||
padding: 0 20px 20px; |
|
||||||
} |
|
||||||
.timeline-image { |
|
||||||
width: 150px; |
|
||||||
height: 150px; |
|
||||||
margin-left: -75px; |
|
||||||
h4 { |
|
||||||
font-size: 18px; |
|
||||||
margin-top: 30px; |
|
||||||
line-height: 26px; |
|
||||||
} |
|
||||||
} |
|
||||||
&.timeline-inverted > .timeline-panel { |
|
||||||
padding: 0 20px 20px; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
@media(min-width:1200px) { |
|
||||||
.timeline { |
|
||||||
> li { |
|
||||||
min-height: 170px; |
|
||||||
.timeline-panel { |
|
||||||
padding: 0 20px 20px 100px; |
|
||||||
} |
|
||||||
.timeline-image { |
|
||||||
width: 170px; |
|
||||||
height: 170px; |
|
||||||
margin-left: -85px; |
|
||||||
h4 { |
|
||||||
margin-top: 40px; |
|
||||||
} |
|
||||||
} |
|
||||||
&.timeline-inverted > .timeline-panel { |
|
||||||
padding: 0 100px 20px 20px; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Team Section |
|
||||||
|
|
||||||
.team-member { |
|
||||||
text-align: center; |
|
||||||
margin-bottom: 50px; |
|
||||||
img { |
|
||||||
height: 225px; |
|
||||||
width: 225px; |
|
||||||
border: 7px solid white; |
|
||||||
} |
|
||||||
h4 { |
|
||||||
margin-top: 25px; |
|
||||||
margin-bottom: 0; |
|
||||||
text-transform: none; |
|
||||||
} |
|
||||||
p { |
|
||||||
margin-top: 0; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Clients Aside |
|
||||||
|
|
||||||
aside.clients { |
|
||||||
img { |
|
||||||
margin: 50px auto; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Contact Section |
|
||||||
|
|
||||||
section#contact { |
|
||||||
background-color: @gray-darker; |
|
||||||
background-image: url('../img/map-image.png'); |
|
||||||
background-position: center; |
|
||||||
background-repeat: no-repeat; |
|
||||||
.section-heading { |
|
||||||
color: white; |
|
||||||
} |
|
||||||
.form-group { |
|
||||||
margin-bottom: 25px; |
|
||||||
input, |
|
||||||
textarea { |
|
||||||
padding: 20px; |
|
||||||
} |
|
||||||
input.form-control { |
|
||||||
height: auto; |
|
||||||
} |
|
||||||
textarea.form-control { |
|
||||||
height: 236px; |
|
||||||
} |
|
||||||
} |
|
||||||
.form-control:focus { |
|
||||||
border-color: @theme-primary; |
|
||||||
box-shadow: none; |
|
||||||
} |
|
||||||
::-webkit-input-placeholder { |
|
||||||
.heading-font; |
|
||||||
font-weight: 700; |
|
||||||
color: @gray-lighter; |
|
||||||
} |
|
||||||
:-moz-placeholder { /* Firefox 18- */ |
|
||||||
.heading-font; |
|
||||||
font-weight: 700; |
|
||||||
color: @gray-lighter; |
|
||||||
} |
|
||||||
::-moz-placeholder { /* Firefox 19+ */ |
|
||||||
.heading-font; |
|
||||||
font-weight: 700; |
|
||||||
color: @gray-lighter; |
|
||||||
} |
|
||||||
:-ms-input-placeholder { |
|
||||||
.heading-font; |
|
||||||
font-weight: 700; |
|
||||||
color: @gray-lighter; |
|
||||||
} |
|
||||||
.text-danger { |
|
||||||
color: @theme-danger; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Footer |
|
||||||
|
|
||||||
footer { |
|
||||||
padding: 25px 0; |
|
||||||
text-align: center; |
|
||||||
span.copyright { |
|
||||||
font-size: 90%; |
|
||||||
line-height: 40px; |
|
||||||
.heading-font; |
|
||||||
text-transform: none; |
|
||||||
} |
|
||||||
ul.quicklinks { |
|
||||||
font-size: 90%; |
|
||||||
margin-bottom: 0; |
|
||||||
line-height: 40px; |
|
||||||
.heading-font; |
|
||||||
text-transform: none; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Social Buttons |
|
||||||
|
|
||||||
ul.social-buttons { |
|
||||||
margin-bottom: 0; |
|
||||||
li { |
|
||||||
a { |
|
||||||
display: block; |
|
||||||
background-color: @gray-darker; |
|
||||||
height: 40px; |
|
||||||
width: 40px; |
|
||||||
border-radius: 100%; |
|
||||||
font-size: 20px; |
|
||||||
line-height: 40px; |
|
||||||
color: white; |
|
||||||
outline: none; |
|
||||||
-webkit-transition: all 0.3s; |
|
||||||
-moz-transition: all 0.3s; |
|
||||||
transition: all 0.3s; |
|
||||||
&:hover, |
|
||||||
&:focus, |
|
||||||
&:active { |
|
||||||
background-color: @theme-primary; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
.btn:focus, |
|
||||||
.btn:active, |
|
||||||
.btn.active, |
|
||||||
.btn:active:focus { |
|
||||||
outline: none; |
|
||||||
} |
|
||||||
|
|
||||||
.portfolio-modal { |
|
||||||
.modal-dialog{ |
|
||||||
margin: 0; |
|
||||||
height: 100%; |
|
||||||
max-width: none; |
|
||||||
} |
|
||||||
.modal-content { |
|
||||||
border-radius: 0; |
|
||||||
background-clip: border-box; |
|
||||||
-webkit-box-shadow: none; |
|
||||||
box-shadow: none; |
|
||||||
border: none; |
|
||||||
min-height: 100%; |
|
||||||
padding: 100px 0; |
|
||||||
text-align: center; |
|
||||||
h2 { |
|
||||||
margin-bottom: 15px; |
|
||||||
font-size: 3em; |
|
||||||
} |
|
||||||
p { |
|
||||||
margin-bottom: 30px; |
|
||||||
} |
|
||||||
p.item-intro { |
|
||||||
margin: 20px 0 30px; |
|
||||||
.serif-font; |
|
||||||
font-style: italic; |
|
||||||
font-size: 16px; |
|
||||||
} |
|
||||||
ul.list-inline { |
|
||||||
margin-bottom: 30px; |
|
||||||
margin-top: 0; |
|
||||||
} |
|
||||||
img { |
|
||||||
margin-bottom: 30px; |
|
||||||
} |
|
||||||
} |
|
||||||
.close-modal { |
|
||||||
position: absolute; |
|
||||||
width:75px; |
|
||||||
height:75px; |
|
||||||
background-color:transparent; |
|
||||||
top: 25px; |
|
||||||
right: 25px; |
|
||||||
cursor: pointer; |
|
||||||
&:hover { |
|
||||||
opacity: 0.3; |
|
||||||
} |
|
||||||
.lr { |
|
||||||
height:75px; |
|
||||||
width:1px; |
|
||||||
margin-left:35px; |
|
||||||
background-color:@gray-darker; |
|
||||||
transform: rotate(45deg); |
|
||||||
-ms-transform: rotate(45deg); |
|
||||||
/* IE 9 */ |
|
||||||
-webkit-transform: rotate(45deg); |
|
||||||
/* Safari and Chrome */ |
|
||||||
z-index:1051; |
|
||||||
.rl { |
|
||||||
height:75px; |
|
||||||
width:1px; |
|
||||||
background-color:@gray-darker; |
|
||||||
transform: rotate(90deg); |
|
||||||
-ms-transform: rotate(90deg); |
|
||||||
/* IE 9 */ |
|
||||||
-webkit-transform: rotate(90deg); |
|
||||||
/* Safari and Chrome */ |
|
||||||
z-index:1052; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
.modal-backdrop { |
|
||||||
opacity: 0; |
|
||||||
display: none; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Highlight Color Customization |
|
||||||
|
|
||||||
::-moz-selection { |
|
||||||
text-shadow: none; |
|
||||||
background: @theme-primary; |
|
||||||
} |
|
||||||
|
|
||||||
::selection { |
|
||||||
text-shadow: none; |
|
||||||
background: @theme-primary; |
|
||||||
} |
|
||||||
|
|
||||||
img::selection { |
|
||||||
background: transparent; |
|
||||||
} |
|
||||||
|
|
||||||
img::-moz-selection { |
|
||||||
background: transparent; |
|
||||||
} |
|
||||||
|
|
||||||
body { |
|
||||||
webkit-tap-highlight-color: @theme-primary; |
|
||||||
} |
|
||||||
@ -1,70 +0,0 @@ |
|||||||
// Mixins |
|
||||||
|
|
||||||
// Bootstrap Button Variant |
|
||||||
|
|
||||||
.button-variant(@color; @background; @border) { |
|
||||||
color: @color; |
|
||||||
background-color: @background; |
|
||||||
border-color: @border; |
|
||||||
|
|
||||||
&:hover, |
|
||||||
&:focus, |
|
||||||
&:active, |
|
||||||
&.active, |
|
||||||
&:active:focus, |
|
||||||
.open .dropdown-toggle& { |
|
||||||
color: @color; |
|
||||||
background-color: darken(@background, 10%); |
|
||||||
border-color: darken(@border, 12%); |
|
||||||
} |
|
||||||
&:active, |
|
||||||
&.active, |
|
||||||
.open .dropdown-toggle& { |
|
||||||
background-image: none; |
|
||||||
} |
|
||||||
&.disabled, |
|
||||||
&[disabled], |
|
||||||
fieldset[disabled] & { |
|
||||||
&, |
|
||||||
&:hover, |
|
||||||
&:focus, |
|
||||||
&:active, |
|
||||||
&.active { |
|
||||||
background-color: @background; |
|
||||||
border-color: @border; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
.badge { |
|
||||||
color: @background; |
|
||||||
background-color: @color; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Background Cover Mixin |
|
||||||
|
|
||||||
.background-cover() { |
|
||||||
-webkit-background-size: cover; |
|
||||||
-moz-background-size: cover; |
|
||||||
background-size: cover; |
|
||||||
-o-background-size: cover; |
|
||||||
} |
|
||||||
|
|
||||||
// Font Mixins |
|
||||||
|
|
||||||
.serif-font() { |
|
||||||
font-family: "Droid Serif", "Helvetica Neue", Helvetica, Arial, sans-serif; |
|
||||||
} |
|
||||||
|
|
||||||
.script-font() { |
|
||||||
font-family: "Kaushan Script", "Helvetica Neue", Helvetica, Arial, cursive; |
|
||||||
} |
|
||||||
|
|
||||||
.body-font() { |
|
||||||
font-family: "Roboto Slab", "Helvetica Neue", Helvetica, Arial, sans-serif; |
|
||||||
} |
|
||||||
|
|
||||||
.heading-font() { |
|
||||||
font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif; |
|
||||||
text-transform: uppercase; |
|
||||||
} |
|
||||||
@ -1,13 +0,0 @@ |
|||||||
// Variables |
|
||||||
|
|
||||||
// Gray and Brand Colors for use across theme |
|
||||||
|
|
||||||
@theme-primary: #fed136; |
|
||||||
@theme-danger: #e74c3c; |
|
||||||
|
|
||||||
@gray-base: #000; |
|
||||||
@gray-darker: lighten(@gray-base, 13.5%); // #222 |
|
||||||
@gray-dark: lighten(@gray-base, 20%); // #333 |
|
||||||
@gray: lighten(@gray-base, 33.5%); // #555 |
|
||||||
@gray-light: lighten(@gray-base, 46.7%); // #777 |
|
||||||
@gray-lighter: lighten(@gray-base, 93.5%); // #eee |
|
||||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1,29 +1,44 @@ |
|||||||
{ |
{ |
||||||
"name": "startbootstrap-agency", |
"title": "Agency", |
||||||
"title": "Agency", |
"name": "startbootstrap-agency", |
||||||
"version": "4.0.0-alpha", |
"version": "4.0.0-alpha", |
||||||
"homepage": "http://startbootstrap.com/template-overviews/agency", |
"description": "Agency is a one page HTML theme for Bootstrap.", |
||||||
"author": "Start Bootstrap", |
"keywords": [ |
||||||
"license": { |
"css", |
||||||
"type": "MIT", |
"sass", |
||||||
"url": "https://github.com/BlackrockDigital/startbootstrap/blob/gh-pages/LICENSE" |
"html", |
||||||
}, |
"responsive", |
||||||
"devDependencies": { |
"theme", |
||||||
"bootstrap": "^4.0.0-alpha.6", |
"template" |
||||||
"browser-sync": "^2.13.0", |
], |
||||||
"font-awesome": "^4.6.3", |
"homepage": "http://startbootstrap.com/template-overviews/agency", |
||||||
"gulp": "^3.9.1", |
"bugs": { |
||||||
"gulp-clean-css": "^2.0.10", |
"url": "https://github.com/BlackrockDigital/startbootstrap-agency/issues", |
||||||
"gulp-header": "^1.8.7", |
"email": "feedback@startbootstrap.com" |
||||||
"gulp-less": "^3.1.0", |
}, |
||||||
"gulp-rename": "^1.2.2", |
"license": "MIT", |
||||||
"gulp-sass": "^2.3.2", |
"author": "Start Bootstrap", |
||||||
"gulp-uglify": "^1.5.4", |
"contributors": [ |
||||||
"jquery": "^3.1.1", |
"David Miller (http://davidmiller.io/)" |
||||||
"tether": "^1.4.0" |
], |
||||||
}, |
"repository": { |
||||||
"repository": { |
"type": "git", |
||||||
"type": "git", |
"url": "https://github.com/BlackrockDigital/startbootstrap-agency.git" |
||||||
"url": "https://github.com/BlackrockDigital/startbootstrap-agency.git" |
}, |
||||||
} |
"dependencies": { |
||||||
|
"bootstrap": "^4.0.0-alpha.6", |
||||||
|
"font-awesome": "^4.6.3", |
||||||
|
"jquery": "^3.2.1", |
||||||
|
"jquery.easing": "^1.4.1", |
||||||
|
"tether": "^1.4.0" |
||||||
|
}, |
||||||
|
"devDependencies": { |
||||||
|
"browser-sync": "^2.18.8", |
||||||
|
"gulp": "^3.9.1", |
||||||
|
"gulp-clean-css": "^3.0.4", |
||||||
|
"gulp-header": "^1.8.7", |
||||||
|
"gulp-rename": "^1.2.2", |
||||||
|
"gulp-sass": "^3.1.0", |
||||||
|
"gulp-uglify": "^2.1.2" |
||||||
|
} |
||||||
} |
} |
||||||
|
|||||||
@ -0,0 +1,19 @@ |
|||||||
|
// Bootstrap overrides for this template |
||||||
|
.text-primary { |
||||||
|
color: $theme-primary !important; |
||||||
|
} |
||||||
|
|
||||||
|
.btn-primary { |
||||||
|
@include button-variant(white, $theme-primary, $theme-primary); |
||||||
|
@include heading-font; |
||||||
|
font-weight: 700; |
||||||
|
} |
||||||
|
|
||||||
|
.btn-xl { |
||||||
|
@include button-variant(white, $theme-primary, $theme-primary); |
||||||
|
@include heading-font; |
||||||
|
font-weight: 700; |
||||||
|
border-radius: 3px; |
||||||
|
font-size: 18px; |
||||||
|
padding: 20px 40px; |
||||||
|
} |
||||||
@ -0,0 +1,52 @@ |
|||||||
|
// Styling for the contact section |
||||||
|
section#contact { |
||||||
|
background-color: $gray-darker; |
||||||
|
background-image: url('../img/map-image.png'); |
||||||
|
background-position: center; |
||||||
|
background-repeat: no-repeat; |
||||||
|
.section-heading { |
||||||
|
color: white; |
||||||
|
} |
||||||
|
.form-group { |
||||||
|
margin-bottom: 25px; |
||||||
|
input, |
||||||
|
textarea { |
||||||
|
padding: 20px; |
||||||
|
} |
||||||
|
input.form-control { |
||||||
|
height: auto; |
||||||
|
} |
||||||
|
textarea.form-control { |
||||||
|
height: 236px; |
||||||
|
} |
||||||
|
} |
||||||
|
.form-control:focus { |
||||||
|
border-color: $theme-primary; |
||||||
|
box-shadow: none; |
||||||
|
} |
||||||
|
::-webkit-input-placeholder { |
||||||
|
@include heading-font; |
||||||
|
font-weight: 700; |
||||||
|
color: $gray-lighter; |
||||||
|
} |
||||||
|
:-moz-placeholder { |
||||||
|
/* Firefox 18- */ |
||||||
|
@include heading-font; |
||||||
|
font-weight: 700; |
||||||
|
color: $gray-lighter; |
||||||
|
} |
||||||
|
::-moz-placeholder { |
||||||
|
/* Firefox 19+ */ |
||||||
|
@include heading-font; |
||||||
|
font-weight: 700; |
||||||
|
color: $gray-lighter; |
||||||
|
} |
||||||
|
:-ms-input-placeholder { |
||||||
|
@include heading-font; |
||||||
|
font-weight: 700; |
||||||
|
color: $gray-lighter; |
||||||
|
} |
||||||
|
.text-danger { |
||||||
|
color: $theme-danger; |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,43 @@ |
|||||||
|
// Styling for the footer |
||||||
|
footer { |
||||||
|
padding: 25px 0; |
||||||
|
text-align: center; |
||||||
|
span.copyright { |
||||||
|
font-size: 90%; |
||||||
|
line-height: 40px; |
||||||
|
@include heading-font; |
||||||
|
text-transform: none; |
||||||
|
} |
||||||
|
ul.quicklinks { |
||||||
|
font-size: 90%; |
||||||
|
margin-bottom: 0; |
||||||
|
line-height: 40px; |
||||||
|
@include heading-font; |
||||||
|
text-transform: none; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
ul.social-buttons { |
||||||
|
margin-bottom: 0; |
||||||
|
li { |
||||||
|
a { |
||||||
|
display: block; |
||||||
|
background-color: $gray-darker; |
||||||
|
height: 40px; |
||||||
|
width: 40px; |
||||||
|
border-radius: 100%; |
||||||
|
font-size: 20px; |
||||||
|
line-height: 40px; |
||||||
|
color: white; |
||||||
|
outline: none; |
||||||
|
-webkit-transition: all 0.3s; |
||||||
|
-moz-transition: all 0.3s; |
||||||
|
transition: all 0.3s; |
||||||
|
&:hover, |
||||||
|
&:focus, |
||||||
|
&:active { |
||||||
|
background-color: $theme-primary; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,75 @@ |
|||||||
|
// Global styling for this template |
||||||
|
body { |
||||||
|
overflow-x: hidden; |
||||||
|
@include body-font; |
||||||
|
} |
||||||
|
|
||||||
|
p { |
||||||
|
line-height: 1.75; |
||||||
|
} |
||||||
|
|
||||||
|
a { |
||||||
|
color: $theme-primary; |
||||||
|
&:hover, |
||||||
|
&:focus, |
||||||
|
&:active, |
||||||
|
&.active { |
||||||
|
color: darken($theme-primary, 10%); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
h1, |
||||||
|
h2, |
||||||
|
h3, |
||||||
|
h4, |
||||||
|
h5, |
||||||
|
h6 { |
||||||
|
@include heading-font; |
||||||
|
font-weight: 700; |
||||||
|
} |
||||||
|
|
||||||
|
section { |
||||||
|
padding: 100px 0; |
||||||
|
h2.section-heading { |
||||||
|
font-size: 40px; |
||||||
|
margin-top: 0; |
||||||
|
margin-bottom: 15px; |
||||||
|
} |
||||||
|
h3.section-subheading { |
||||||
|
font-size: 16px; |
||||||
|
@include serif-font; |
||||||
|
text-transform: none; |
||||||
|
font-style: italic; |
||||||
|
font-weight: 400; |
||||||
|
margin-bottom: 75px; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
@media(min-width:768px) { |
||||||
|
section { |
||||||
|
padding: 150px 0; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
// Highlight color customization |
||||||
|
::-moz-selection { |
||||||
|
text-shadow: none; |
||||||
|
background: $theme-primary; |
||||||
|
} |
||||||
|
|
||||||
|
::selection { |
||||||
|
text-shadow: none; |
||||||
|
background: $theme-primary; |
||||||
|
} |
||||||
|
|
||||||
|
img::selection { |
||||||
|
background: transparent; |
||||||
|
} |
||||||
|
|
||||||
|
img::-moz-selection { |
||||||
|
background: transparent; |
||||||
|
} |
||||||
|
|
||||||
|
body { |
||||||
|
-webkit-tap-highlight-color: $theme-primary; |
||||||
|
} |
||||||
@ -0,0 +1,51 @@ |
|||||||
|
// Styling for the masthead |
||||||
|
header.masthead { |
||||||
|
background-image: url('../img/header-bg.jpg'); |
||||||
|
background-repeat: no-repeat; |
||||||
|
background-attachment: scroll; |
||||||
|
background-position: center center; |
||||||
|
@include background-cover; |
||||||
|
text-align: center; |
||||||
|
color: white; |
||||||
|
.intro-text { |
||||||
|
padding-top: 100px; |
||||||
|
padding-bottom: 50px; |
||||||
|
.intro-lead-in { |
||||||
|
@include serif-font; |
||||||
|
font-style: italic; |
||||||
|
font-size: 22px; |
||||||
|
line-height: 22px; |
||||||
|
margin-bottom: 25px; |
||||||
|
} |
||||||
|
.intro-heading { |
||||||
|
@include heading-font; |
||||||
|
font-weight: 700; |
||||||
|
font-size: 50px; |
||||||
|
line-height: 50px; |
||||||
|
margin-bottom: 25px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
@media(min-width:768px) { |
||||||
|
header.masthead { |
||||||
|
.intro-text { |
||||||
|
padding-top: 300px; |
||||||
|
padding-bottom: 200px; |
||||||
|
.intro-lead-in { |
||||||
|
@include serif-font; |
||||||
|
font-style: italic; |
||||||
|
font-size: 40px; |
||||||
|
line-height: 40px; |
||||||
|
margin-bottom: 25px; |
||||||
|
} |
||||||
|
.intro-heading { |
||||||
|
@include heading-font; |
||||||
|
font-weight: 700; |
||||||
|
font-size: 75px; |
||||||
|
line-height: 75px; |
||||||
|
margin-bottom: 50px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,75 @@ |
|||||||
|
// Styling for the navbar |
||||||
|
#mainNav { |
||||||
|
background-color: $gray-darker; |
||||||
|
.navbar-toggler { |
||||||
|
border: 0; |
||||||
|
color: white; |
||||||
|
background-color: $theme-primary; |
||||||
|
font-size: 12px; |
||||||
|
text-transform: uppercase; |
||||||
|
@include heading-font; |
||||||
|
padding: 13px; |
||||||
|
right: 0; |
||||||
|
} |
||||||
|
.container { |
||||||
|
padding: 0; |
||||||
|
.navbar-brand { |
||||||
|
color: $theme-primary; |
||||||
|
@include script-font; |
||||||
|
&:hover, |
||||||
|
&:focus, |
||||||
|
&:active, |
||||||
|
&.active { |
||||||
|
color: darken($theme-primary, 10%); |
||||||
|
} |
||||||
|
} |
||||||
|
.navbar-nav { |
||||||
|
.nav-item { |
||||||
|
.nav-link { |
||||||
|
font-size: 90%; |
||||||
|
padding: 0.75em 0; |
||||||
|
@include heading-font; |
||||||
|
font-weight: 400; |
||||||
|
letter-spacing: 1px; |
||||||
|
color: white; |
||||||
|
&:hover, |
||||||
|
&.active { |
||||||
|
color: $theme-primary; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
@media(min-width:992px) { |
||||||
|
#mainNav { |
||||||
|
background-color: transparent; |
||||||
|
padding: 25px 0; |
||||||
|
-webkit-transition: padding 0.3s; |
||||||
|
-moz-transition: padding 0.3s; |
||||||
|
transition: padding 0.3s; |
||||||
|
border: none; |
||||||
|
.navbar-brand { |
||||||
|
font-size: 1.75em; |
||||||
|
-webkit-transition: all 0.3s; |
||||||
|
-moz-transition: all 0.3s; |
||||||
|
transition: all 0.3s; |
||||||
|
} |
||||||
|
.navbar-nav { |
||||||
|
.nav-item { |
||||||
|
.nav-link { |
||||||
|
padding: 1.1em 1em !important; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
&.navbar-shrink { |
||||||
|
background-color: $gray-darker; |
||||||
|
padding: 0; |
||||||
|
.navbar-brand { |
||||||
|
padding: 12px 0; |
||||||
|
font-size: 1.25em; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,152 @@ |
|||||||
|
// Styling for the portfolio section |
||||||
|
#portfolio { |
||||||
|
.portfolio-item { |
||||||
|
margin: 0 0 15px; |
||||||
|
right: 0; |
||||||
|
.portfolio-link { |
||||||
|
cursor: pointer; |
||||||
|
display: block; |
||||||
|
position: relative; |
||||||
|
max-width: 400px; |
||||||
|
margin: 0 auto; |
||||||
|
.portfolio-hover { |
||||||
|
background: fade-out($theme-primary, .1); |
||||||
|
position: absolute; |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
opacity: 0; |
||||||
|
transition: all ease 0.5s; |
||||||
|
-webkit-transition: all ease 0.5s; |
||||||
|
-moz-transition: all ease 0.5s; |
||||||
|
&:hover { |
||||||
|
opacity: 1; |
||||||
|
} |
||||||
|
.portfolio-hover-content { |
||||||
|
position: absolute; |
||||||
|
width: 100%; |
||||||
|
height: 20px; |
||||||
|
font-size: 20px; |
||||||
|
text-align: center; |
||||||
|
top: 50%; |
||||||
|
margin-top: -12px; |
||||||
|
color: white; |
||||||
|
i { |
||||||
|
margin-top: -12px; |
||||||
|
} |
||||||
|
h3, |
||||||
|
h4 { |
||||||
|
margin: 0; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.portfolio-caption { |
||||||
|
max-width: 400px; |
||||||
|
margin: 0 auto; |
||||||
|
background-color: white; |
||||||
|
text-align: center; |
||||||
|
padding: 25px; |
||||||
|
h4 { |
||||||
|
text-transform: none; |
||||||
|
margin: 0; |
||||||
|
} |
||||||
|
p { |
||||||
|
@include serif-font; |
||||||
|
font-style: italic; |
||||||
|
font-size: 16px; |
||||||
|
margin: 0; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
* { |
||||||
|
z-index: 2; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
@media(min-width:767px) { |
||||||
|
#portfolio { |
||||||
|
.portfolio-item { |
||||||
|
margin: 0 0 30px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.portfolio-modal { |
||||||
|
.modal-dialog { |
||||||
|
margin: 0; |
||||||
|
height: 100%; |
||||||
|
max-width: none; |
||||||
|
} |
||||||
|
.modal-content { |
||||||
|
border-radius: 0; |
||||||
|
background-clip: border-box; |
||||||
|
-webkit-box-shadow: none; |
||||||
|
box-shadow: none; |
||||||
|
border: none; |
||||||
|
min-height: 100%; |
||||||
|
padding: 100px 0; |
||||||
|
text-align: center; |
||||||
|
h2 { |
||||||
|
margin-bottom: 15px; |
||||||
|
font-size: 3em; |
||||||
|
} |
||||||
|
p { |
||||||
|
margin-bottom: 30px; |
||||||
|
} |
||||||
|
p.item-intro { |
||||||
|
margin: 20px 0 30px; |
||||||
|
@include serif-font; |
||||||
|
font-style: italic; |
||||||
|
font-size: 16px; |
||||||
|
} |
||||||
|
ul.list-inline { |
||||||
|
margin-bottom: 30px; |
||||||
|
margin-top: 0; |
||||||
|
} |
||||||
|
img { |
||||||
|
margin-bottom: 30px; |
||||||
|
} |
||||||
|
button { |
||||||
|
cursor: pointer; |
||||||
|
} |
||||||
|
} |
||||||
|
.close-modal { |
||||||
|
position: absolute; |
||||||
|
width: 75px; |
||||||
|
height: 75px; |
||||||
|
background-color: transparent; |
||||||
|
top: 25px; |
||||||
|
right: 25px; |
||||||
|
cursor: pointer; |
||||||
|
&:hover { |
||||||
|
opacity: 0.3; |
||||||
|
} |
||||||
|
.lr { |
||||||
|
height: 75px; |
||||||
|
width: 1px; |
||||||
|
margin-left: 35px; |
||||||
|
background-color: $gray-darker; |
||||||
|
transform: rotate(45deg); |
||||||
|
-ms-transform: rotate(45deg); |
||||||
|
/* IE 9 */ |
||||||
|
-webkit-transform: rotate(45deg); |
||||||
|
/* Safari and Chrome */ |
||||||
|
z-index: 1051; |
||||||
|
.rl { |
||||||
|
height: 75px; |
||||||
|
width: 1px; |
||||||
|
background-color: $gray-darker; |
||||||
|
transform: rotate(90deg); |
||||||
|
-ms-transform: rotate(90deg); |
||||||
|
/* IE 9 */ |
||||||
|
-webkit-transform: rotate(90deg); |
||||||
|
/* Safari and Chrome */ |
||||||
|
z-index: 1052; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.modal-backdrop { |
||||||
|
opacity: 0; |
||||||
|
display: none; |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,5 @@ |
|||||||
|
// Styling for the services section |
||||||
|
.service-heading { |
||||||
|
margin: 15px 0; |
||||||
|
text-transform: none; |
||||||
|
} |
||||||
@ -0,0 +1,18 @@ |
|||||||
|
// Styling for the team section |
||||||
|
.team-member { |
||||||
|
text-align: center; |
||||||
|
margin-bottom: 50px; |
||||||
|
img { |
||||||
|
height: 225px; |
||||||
|
width: 225px; |
||||||
|
border: 7px solid white; |
||||||
|
} |
||||||
|
h4 { |
||||||
|
margin-top: 25px; |
||||||
|
margin-bottom: 0; |
||||||
|
text-transform: none; |
||||||
|
} |
||||||
|
p { |
||||||
|
margin-top: 0; |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,181 @@ |
|||||||
|
// Styling for the timeline section |
||||||
|
.timeline { |
||||||
|
list-style: none; |
||||||
|
padding: 0; |
||||||
|
position: relative; |
||||||
|
&:before { |
||||||
|
top: 0; |
||||||
|
bottom: 0; |
||||||
|
position: absolute; |
||||||
|
content: ""; |
||||||
|
width: 2px; |
||||||
|
background-color: #f1f1f1; |
||||||
|
left: 40px; |
||||||
|
margin-left: -1.5px; |
||||||
|
} |
||||||
|
> li { |
||||||
|
margin-bottom: 50px; |
||||||
|
position: relative; |
||||||
|
min-height: 50px; |
||||||
|
&:before, |
||||||
|
&:after { |
||||||
|
content: " "; |
||||||
|
display: table; |
||||||
|
} |
||||||
|
&:after { |
||||||
|
clear: both; |
||||||
|
} |
||||||
|
.timeline-panel { |
||||||
|
width: 100%; |
||||||
|
float: right; |
||||||
|
padding: 0 20px 0 100px; |
||||||
|
position: relative; |
||||||
|
text-align: left; |
||||||
|
&:before { |
||||||
|
border-left-width: 0; |
||||||
|
border-right-width: 15px; |
||||||
|
left: -15px; |
||||||
|
right: auto; |
||||||
|
} |
||||||
|
&:after { |
||||||
|
border-left-width: 0; |
||||||
|
border-right-width: 14px; |
||||||
|
left: -14px; |
||||||
|
right: auto; |
||||||
|
} |
||||||
|
} |
||||||
|
.timeline-image { |
||||||
|
left: 0; |
||||||
|
margin-left: 0; |
||||||
|
width: 80px; |
||||||
|
height: 80px; |
||||||
|
position: absolute; |
||||||
|
z-index: 100; |
||||||
|
background-color: $theme-primary; |
||||||
|
color: white; |
||||||
|
border-radius: 100%; |
||||||
|
border: 7px solid #f1f1f1; |
||||||
|
text-align: center; |
||||||
|
h4 { |
||||||
|
font-size: 10px; |
||||||
|
margin-top: 12px; |
||||||
|
line-height: 14px; |
||||||
|
} |
||||||
|
} |
||||||
|
&.timeline-inverted > .timeline-panel { |
||||||
|
float: right; |
||||||
|
text-align: left; |
||||||
|
padding: 0 20px 0 100px; |
||||||
|
&:before { |
||||||
|
border-left-width: 0; |
||||||
|
border-right-width: 15px; |
||||||
|
left: -15px; |
||||||
|
right: auto; |
||||||
|
} |
||||||
|
&:after { |
||||||
|
border-left-width: 0; |
||||||
|
border-right-width: 14px; |
||||||
|
left: -14px; |
||||||
|
right: auto; |
||||||
|
} |
||||||
|
} |
||||||
|
&:last-child { |
||||||
|
margin-bottom: 0; |
||||||
|
} |
||||||
|
} |
||||||
|
.timeline-heading { |
||||||
|
h4 { |
||||||
|
margin-top: 0; |
||||||
|
color: inherit; |
||||||
|
&.subheading { |
||||||
|
text-transform: none; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.timeline-body { |
||||||
|
> p, |
||||||
|
> ul { |
||||||
|
margin-bottom: 0; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
@media(min-width:768px) { |
||||||
|
.timeline { |
||||||
|
&:before { |
||||||
|
left: 50%; |
||||||
|
} |
||||||
|
> li { |
||||||
|
margin-bottom: 100px; |
||||||
|
min-height: 100px; |
||||||
|
.timeline-panel { |
||||||
|
width: 41%; |
||||||
|
float: left; |
||||||
|
padding: 0 20px 20px 30px; |
||||||
|
text-align: right; |
||||||
|
} |
||||||
|
.timeline-image { |
||||||
|
width: 100px; |
||||||
|
height: 100px; |
||||||
|
left: 50%; |
||||||
|
margin-left: -50px; |
||||||
|
h4 { |
||||||
|
font-size: 13px; |
||||||
|
margin-top: 16px; |
||||||
|
line-height: 18px; |
||||||
|
} |
||||||
|
} |
||||||
|
&.timeline-inverted > .timeline-panel { |
||||||
|
float: right; |
||||||
|
text-align: left; |
||||||
|
padding: 0 30px 20px 20px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
@media(min-width:992px) { |
||||||
|
.timeline { |
||||||
|
> li { |
||||||
|
min-height: 150px; |
||||||
|
.timeline-panel { |
||||||
|
padding: 0 20px 20px; |
||||||
|
} |
||||||
|
.timeline-image { |
||||||
|
width: 150px; |
||||||
|
height: 150px; |
||||||
|
margin-left: -75px; |
||||||
|
h4 { |
||||||
|
font-size: 18px; |
||||||
|
margin-top: 30px; |
||||||
|
line-height: 26px; |
||||||
|
} |
||||||
|
} |
||||||
|
&.timeline-inverted > .timeline-panel { |
||||||
|
padding: 0 20px 20px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
@media(min-width:1200px) { |
||||||
|
.timeline { |
||||||
|
> li { |
||||||
|
min-height: 170px; |
||||||
|
.timeline-panel { |
||||||
|
padding: 0 20px 20px 100px; |
||||||
|
} |
||||||
|
.timeline-image { |
||||||
|
width: 170px; |
||||||
|
height: 170px; |
||||||
|
margin-left: -85px; |
||||||
|
h4 { |
||||||
|
margin-top: 40px; |
||||||
|
} |
||||||
|
} |
||||||
|
&.timeline-inverted > .timeline-panel { |
||||||
|
padding: 0 100px 20px 20px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
@ -1,700 +1,16 @@ |
|||||||
|
// Core variables and mixins |
||||||
@import "variables.scss"; |
@import "variables.scss"; |
||||||
@import "mixins.scss"; |
@import "mixins.scss"; |
||||||
|
// Global CSS |
||||||
// Global Components |
@import "global.scss"; |
||||||
|
// Components |
||||||
body { |
@import "navbar.scss"; |
||||||
overflow-x: hidden; |
@import "masthead.scss"; |
||||||
@include body-font; |
@import "services.scss"; |
||||||
} |
@import "portfolio.scss"; |
||||||
|
@import "timeline.scss"; |
||||||
.text-primary { |
@import "team.scss"; |
||||||
color: $theme-primary !important; |
@import "contact.scss"; |
||||||
} |
@import "footer.scss"; |
||||||
|
// Bootstrap Overrides |
||||||
p { |
@import "bootstrap-overrides.scss"; |
||||||
line-height: 1.75; |
|
||||||
} |
|
||||||
|
|
||||||
a { |
|
||||||
color: $theme-primary; |
|
||||||
&:hover, |
|
||||||
&:focus, |
|
||||||
&:active, |
|
||||||
&.active { |
|
||||||
color: darken($theme-primary, 10%); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, h6 { |
|
||||||
@include heading-font; |
|
||||||
font-weight: 700; |
|
||||||
} |
|
||||||
|
|
||||||
// Restyled Primary Buttons |
|
||||||
|
|
||||||
.btn-primary { |
|
||||||
@include button-variant(white, $theme-primary, $theme-primary); |
|
||||||
@include heading-font; |
|
||||||
font-weight: 700; |
|
||||||
} |
|
||||||
|
|
||||||
.btn-xl { |
|
||||||
@include button-variant(white, $theme-primary, $theme-primary); |
|
||||||
@include heading-font; |
|
||||||
font-weight: 700; |
|
||||||
border-radius: 3px; |
|
||||||
font-size: 18px; |
|
||||||
padding: 20px 40px; |
|
||||||
} |
|
||||||
|
|
||||||
// Custom Navigation Bar |
|
||||||
|
|
||||||
#mainNav { |
|
||||||
background-color: $gray-darker; |
|
||||||
.navbar-toggler { |
|
||||||
border: 0; |
|
||||||
color: white; |
|
||||||
background-color: $theme-primary; |
|
||||||
font-size: 12px; |
|
||||||
text-transform: uppercase; |
|
||||||
@include heading-font; |
|
||||||
padding: 13px; |
|
||||||
right: 0; |
|
||||||
} |
|
||||||
.container { |
|
||||||
padding: 0; |
|
||||||
.navbar-brand { |
|
||||||
color: $theme-primary; |
|
||||||
@include script-font; |
|
||||||
&:hover, |
|
||||||
&:focus, |
|
||||||
&:active, |
|
||||||
&.active { |
|
||||||
color: darken($theme-primary, 10%); |
|
||||||
} |
|
||||||
} |
|
||||||
.navbar-nav { |
|
||||||
.nav-item { |
|
||||||
.nav-link { |
|
||||||
font-size: 90%; |
|
||||||
padding: 0.75em 0; |
|
||||||
@include heading-font; |
|
||||||
font-weight: 400; |
|
||||||
letter-spacing: 1px; |
|
||||||
color: white; |
|
||||||
&:hover, |
|
||||||
&.active { |
|
||||||
color: $theme-primary; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
@media(min-width:992px) { |
|
||||||
#mainNav { |
|
||||||
background-color: transparent; |
|
||||||
padding: 25px 0; |
|
||||||
-webkit-transition: padding 0.3s; |
|
||||||
-moz-transition: padding 0.3s; |
|
||||||
transition: padding 0.3s; |
|
||||||
border: none; |
|
||||||
.navbar-brand { |
|
||||||
font-size: 1.75em; |
|
||||||
-webkit-transition: all 0.3s; |
|
||||||
-moz-transition: all 0.3s; |
|
||||||
transition: all 0.3s; |
|
||||||
} |
|
||||||
.navbar-nav { |
|
||||||
.nav-item { |
|
||||||
.nav-link { |
|
||||||
padding: 1.1em 1em !important; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
&.navbar-shrink { |
|
||||||
background-color: $gray-darker; |
|
||||||
padding: 0; |
|
||||||
.navbar-brand { |
|
||||||
padding: 12px 0; |
|
||||||
font-size: 1.25em; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
header { |
|
||||||
background-image: url('../img/header-bg.jpg'); |
|
||||||
background-repeat: no-repeat; |
|
||||||
background-attachment: scroll; |
|
||||||
background-position: center center; |
|
||||||
@include background-cover; |
|
||||||
text-align: center; |
|
||||||
color: white; |
|
||||||
.intro-text { |
|
||||||
padding-top: 100px; |
|
||||||
padding-bottom: 50px; |
|
||||||
.intro-lead-in { |
|
||||||
@include serif-font; |
|
||||||
font-style: italic; |
|
||||||
font-size: 22px; |
|
||||||
line-height: 22px; |
|
||||||
margin-bottom: 25px; |
|
||||||
} |
|
||||||
.intro-heading { |
|
||||||
@include heading-font; |
|
||||||
font-weight: 700; |
|
||||||
font-size: 50px; |
|
||||||
line-height: 50px; |
|
||||||
margin-bottom: 25px; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
@media(min-width:768px) { |
|
||||||
header { |
|
||||||
.intro-text { |
|
||||||
padding-top: 300px; |
|
||||||
padding-bottom: 200px; |
|
||||||
.intro-lead-in { |
|
||||||
@include serif-font; |
|
||||||
font-style: italic; |
|
||||||
font-size: 40px; |
|
||||||
line-height: 40px; |
|
||||||
margin-bottom: 25px; |
|
||||||
} |
|
||||||
.intro-heading { |
|
||||||
@include heading-font; |
|
||||||
font-weight: 700; |
|
||||||
font-size: 75px; |
|
||||||
line-height: 75px; |
|
||||||
margin-bottom: 50px; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Global Section Styles |
|
||||||
|
|
||||||
section { |
|
||||||
padding: 100px 0; |
|
||||||
h2.section-heading { |
|
||||||
font-size: 40px; |
|
||||||
margin-top: 0; |
|
||||||
margin-bottom: 15px; |
|
||||||
} |
|
||||||
h3.section-subheading { |
|
||||||
font-size: 16px; |
|
||||||
@include serif-font; |
|
||||||
text-transform: none; |
|
||||||
font-style: italic; |
|
||||||
font-weight: 400; |
|
||||||
margin-bottom: 75px; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
@media(min-width:768px) { |
|
||||||
section { |
|
||||||
padding: 150px 0; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Services Section |
|
||||||
|
|
||||||
.service-heading { |
|
||||||
margin: 15px 0; |
|
||||||
text-transform: none; |
|
||||||
} |
|
||||||
|
|
||||||
// Portfolio Section |
|
||||||
|
|
||||||
#portfolio { |
|
||||||
.portfolio-item { |
|
||||||
margin: 0 0 15px; |
|
||||||
right: 0; |
|
||||||
.portfolio-link { |
|
||||||
display: block; |
|
||||||
position: relative; |
|
||||||
max-width: 400px; |
|
||||||
margin: 0 auto; |
|
||||||
.portfolio-hover { |
|
||||||
background: fade-out($theme-primary, .9); |
|
||||||
position: absolute; |
|
||||||
width: 100%; |
|
||||||
height: 100%; |
|
||||||
opacity: 0; |
|
||||||
transition: all ease 0.5s; |
|
||||||
-webkit-transition: all ease 0.5s; |
|
||||||
-moz-transition: all ease 0.5s; |
|
||||||
&:hover { |
|
||||||
opacity: 1; |
|
||||||
} |
|
||||||
.portfolio-hover-content { |
|
||||||
position: absolute; |
|
||||||
width: 100%; |
|
||||||
height: 20px; |
|
||||||
font-size: 20px; |
|
||||||
text-align: center; |
|
||||||
top: 50%; |
|
||||||
margin-top: -12px; |
|
||||||
color: white; |
|
||||||
i { |
|
||||||
margin-top: -12px; |
|
||||||
} |
|
||||||
h3, |
|
||||||
h4 { |
|
||||||
margin: 0; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
.portfolio-caption { |
|
||||||
max-width: 400px; |
|
||||||
margin: 0 auto; |
|
||||||
background-color: white; |
|
||||||
text-align: center; |
|
||||||
padding: 25px; |
|
||||||
h4 { |
|
||||||
text-transform: none; |
|
||||||
margin: 0; |
|
||||||
} |
|
||||||
p { |
|
||||||
@include serif-font; |
|
||||||
font-style: italic; |
|
||||||
font-size: 16px; |
|
||||||
margin: 0; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
* { |
|
||||||
z-index: 2; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
@media(min-width:767px) { |
|
||||||
#portfolio { |
|
||||||
.portfolio-item { |
|
||||||
margin: 0 0 30px; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Timeline |
|
||||||
|
|
||||||
.timeline { |
|
||||||
list-style: none; |
|
||||||
padding: 0; |
|
||||||
position: relative; |
|
||||||
&:before { |
|
||||||
top: 0; |
|
||||||
bottom: 0; |
|
||||||
position: absolute; |
|
||||||
content: ""; |
|
||||||
width: 2px; |
|
||||||
background-color: #f1f1f1; |
|
||||||
left: 40px; |
|
||||||
margin-left: -1.5px; |
|
||||||
} |
|
||||||
> li { |
|
||||||
margin-bottom: 50px; |
|
||||||
position: relative; |
|
||||||
min-height: 50px; |
|
||||||
&:before, |
|
||||||
&:after { |
|
||||||
content: " "; |
|
||||||
display: table; |
|
||||||
} |
|
||||||
&:after { |
|
||||||
clear: both; |
|
||||||
} |
|
||||||
.timeline-panel { |
|
||||||
width: 100%; |
|
||||||
float: right; |
|
||||||
padding: 0 20px 0 100px; |
|
||||||
position: relative; |
|
||||||
text-align: left; |
|
||||||
&:before { |
|
||||||
border-left-width: 0; |
|
||||||
border-right-width: 15px; |
|
||||||
left: -15px; |
|
||||||
right: auto; |
|
||||||
} |
|
||||||
&:after { |
|
||||||
border-left-width: 0; |
|
||||||
border-right-width: 14px; |
|
||||||
left: -14px; |
|
||||||
right: auto; |
|
||||||
} |
|
||||||
} |
|
||||||
.timeline-image { |
|
||||||
left: 0; |
|
||||||
margin-left: 0; |
|
||||||
width: 80px; |
|
||||||
height: 80px; |
|
||||||
position: absolute; |
|
||||||
z-index: 100; |
|
||||||
background-color: $theme-primary; |
|
||||||
color: white; |
|
||||||
border-radius: 100%; |
|
||||||
border: 7px solid #f1f1f1; |
|
||||||
text-align: center; |
|
||||||
h4 { |
|
||||||
font-size: 10px; |
|
||||||
margin-top: 12px; |
|
||||||
line-height: 14px; |
|
||||||
} |
|
||||||
} |
|
||||||
&.timeline-inverted > .timeline-panel { |
|
||||||
float: right; |
|
||||||
text-align: left; |
|
||||||
padding: 0 20px 0 100px; |
|
||||||
&:before { |
|
||||||
border-left-width: 0; |
|
||||||
border-right-width: 15px; |
|
||||||
left: -15px; |
|
||||||
right: auto; |
|
||||||
} |
|
||||||
&:after { |
|
||||||
border-left-width: 0; |
|
||||||
border-right-width: 14px; |
|
||||||
left: -14px; |
|
||||||
right: auto; |
|
||||||
} |
|
||||||
} |
|
||||||
&:last-child { |
|
||||||
margin-bottom: 0; |
|
||||||
} |
|
||||||
} |
|
||||||
.timeline-heading { |
|
||||||
h4 { |
|
||||||
margin-top: 0; |
|
||||||
color: inherit; |
|
||||||
&.subheading { |
|
||||||
text-transform: none; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
.timeline-body { |
|
||||||
> p, |
|
||||||
> ul { |
|
||||||
margin-bottom: 0; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
@media(min-width:768px) { |
|
||||||
.timeline { |
|
||||||
&:before { |
|
||||||
left: 50%; |
|
||||||
} |
|
||||||
> li { |
|
||||||
margin-bottom: 100px; |
|
||||||
min-height: 100px; |
|
||||||
.timeline-panel { |
|
||||||
width: 41%; |
|
||||||
float: left; |
|
||||||
padding: 0 20px 20px 30px; |
|
||||||
text-align: right; |
|
||||||
} |
|
||||||
.timeline-image { |
|
||||||
width: 100px; |
|
||||||
height: 100px; |
|
||||||
left: 50%; |
|
||||||
margin-left: -50px; |
|
||||||
h4 { |
|
||||||
font-size: 13px; |
|
||||||
margin-top: 16px; |
|
||||||
line-height: 18px; |
|
||||||
} |
|
||||||
} |
|
||||||
&.timeline-inverted > .timeline-panel { |
|
||||||
float: right; |
|
||||||
text-align: left; |
|
||||||
padding: 0 30px 20px 20px; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
@media(min-width:992px) { |
|
||||||
.timeline { |
|
||||||
> li { |
|
||||||
min-height: 150px; |
|
||||||
.timeline-panel { |
|
||||||
padding: 0 20px 20px; |
|
||||||
} |
|
||||||
.timeline-image { |
|
||||||
width: 150px; |
|
||||||
height: 150px; |
|
||||||
margin-left: -75px; |
|
||||||
h4 { |
|
||||||
font-size: 18px; |
|
||||||
margin-top: 30px; |
|
||||||
line-height: 26px; |
|
||||||
} |
|
||||||
} |
|
||||||
&.timeline-inverted > .timeline-panel { |
|
||||||
padding: 0 20px 20px; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
@media(min-width:1200px) { |
|
||||||
.timeline { |
|
||||||
> li { |
|
||||||
min-height: 170px; |
|
||||||
.timeline-panel { |
|
||||||
padding: 0 20px 20px 100px; |
|
||||||
} |
|
||||||
.timeline-image { |
|
||||||
width: 170px; |
|
||||||
height: 170px; |
|
||||||
margin-left: -85px; |
|
||||||
h4 { |
|
||||||
margin-top: 40px; |
|
||||||
} |
|
||||||
} |
|
||||||
&.timeline-inverted > .timeline-panel { |
|
||||||
padding: 0 100px 20px 20px; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Team Section |
|
||||||
|
|
||||||
.team-member { |
|
||||||
text-align: center; |
|
||||||
margin-bottom: 50px; |
|
||||||
img { |
|
||||||
height: 225px; |
|
||||||
width: 225px; |
|
||||||
border: 7px solid white; |
|
||||||
} |
|
||||||
h4 { |
|
||||||
margin-top: 25px; |
|
||||||
margin-bottom: 0; |
|
||||||
text-transform: none; |
|
||||||
} |
|
||||||
p { |
|
||||||
margin-top: 0; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Clients Aside |
|
||||||
|
|
||||||
aside.clients { |
|
||||||
img { |
|
||||||
margin: 50px auto; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Contact Section |
|
||||||
|
|
||||||
section#contact { |
|
||||||
background-color: $gray-darker; |
|
||||||
background-image: url('../img/map-image.png'); |
|
||||||
background-position: center; |
|
||||||
background-repeat: no-repeat; |
|
||||||
.section-heading { |
|
||||||
color: white; |
|
||||||
} |
|
||||||
.form-group { |
|
||||||
margin-bottom: 25px; |
|
||||||
input, |
|
||||||
textarea { |
|
||||||
padding: 20px; |
|
||||||
} |
|
||||||
input.form-control { |
|
||||||
height: auto; |
|
||||||
} |
|
||||||
textarea.form-control { |
|
||||||
height: 236px; |
|
||||||
} |
|
||||||
} |
|
||||||
.form-control:focus { |
|
||||||
border-color: $theme-primary; |
|
||||||
box-shadow: none; |
|
||||||
} |
|
||||||
::-webkit-input-placeholder { |
|
||||||
@include heading-font; |
|
||||||
font-weight: 700; |
|
||||||
color: $gray-lighter; |
|
||||||
} |
|
||||||
:-moz-placeholder { /* Firefox 18- */ |
|
||||||
@include heading-font; |
|
||||||
font-weight: 700; |
|
||||||
color: $gray-lighter; |
|
||||||
} |
|
||||||
::-moz-placeholder { /* Firefox 19+ */ |
|
||||||
@include heading-font; |
|
||||||
font-weight: 700; |
|
||||||
color: $gray-lighter; |
|
||||||
} |
|
||||||
:-ms-input-placeholder { |
|
||||||
@include heading-font; |
|
||||||
font-weight: 700; |
|
||||||
color: $gray-lighter; |
|
||||||
} |
|
||||||
.text-danger { |
|
||||||
color: $theme-danger; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Footer |
|
||||||
|
|
||||||
footer { |
|
||||||
padding: 25px 0; |
|
||||||
text-align: center; |
|
||||||
span.copyright { |
|
||||||
font-size: 90%; |
|
||||||
line-height: 40px; |
|
||||||
@include heading-font; |
|
||||||
text-transform: none; |
|
||||||
} |
|
||||||
ul.quicklinks { |
|
||||||
font-size: 90%; |
|
||||||
margin-bottom: 0; |
|
||||||
line-height: 40px; |
|
||||||
@include heading-font; |
|
||||||
text-transform: none; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Social Buttons |
|
||||||
|
|
||||||
ul.social-buttons { |
|
||||||
margin-bottom: 0; |
|
||||||
li { |
|
||||||
a { |
|
||||||
display: block; |
|
||||||
background-color: $gray-darker; |
|
||||||
height: 40px; |
|
||||||
width: 40px; |
|
||||||
border-radius: 100%; |
|
||||||
font-size: 20px; |
|
||||||
line-height: 40px; |
|
||||||
color: white; |
|
||||||
outline: none; |
|
||||||
-webkit-transition: all 0.3s; |
|
||||||
-moz-transition: all 0.3s; |
|
||||||
transition: all 0.3s; |
|
||||||
&:hover, |
|
||||||
&:focus, |
|
||||||
&:active { |
|
||||||
background-color: $theme-primary; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
.btn:focus, |
|
||||||
.btn:active, |
|
||||||
.btn.active, |
|
||||||
.btn:active:focus { |
|
||||||
outline: none; |
|
||||||
} |
|
||||||
|
|
||||||
.portfolio-modal { |
|
||||||
.modal-dialog{ |
|
||||||
margin: 0; |
|
||||||
height: 100%; |
|
||||||
max-width: none; |
|
||||||
} |
|
||||||
.modal-content { |
|
||||||
border-radius: 0; |
|
||||||
background-clip: border-box; |
|
||||||
-webkit-box-shadow: none; |
|
||||||
box-shadow: none; |
|
||||||
border: none; |
|
||||||
min-height: 100%; |
|
||||||
padding: 100px 0; |
|
||||||
text-align: center; |
|
||||||
h2 { |
|
||||||
margin-bottom: 15px; |
|
||||||
font-size: 3em; |
|
||||||
} |
|
||||||
p { |
|
||||||
margin-bottom: 30px; |
|
||||||
} |
|
||||||
p.item-intro { |
|
||||||
margin: 20px 0 30px; |
|
||||||
@include serif-font; |
|
||||||
font-style: italic; |
|
||||||
font-size: 16px; |
|
||||||
} |
|
||||||
ul.list-inline { |
|
||||||
margin-bottom: 30px; |
|
||||||
margin-top: 0; |
|
||||||
} |
|
||||||
img { |
|
||||||
margin-bottom: 30px; |
|
||||||
} |
|
||||||
} |
|
||||||
.close-modal { |
|
||||||
position: absolute; |
|
||||||
width:75px; |
|
||||||
height:75px; |
|
||||||
background-color:transparent; |
|
||||||
top: 25px; |
|
||||||
right: 25px; |
|
||||||
cursor: pointer; |
|
||||||
&:hover { |
|
||||||
opacity: 0.3; |
|
||||||
} |
|
||||||
.lr { |
|
||||||
height:75px; |
|
||||||
width:1px; |
|
||||||
margin-left:35px; |
|
||||||
background-color:$gray-darker; |
|
||||||
transform: rotate(45deg); |
|
||||||
-ms-transform: rotate(45deg); |
|
||||||
/* IE 9 */ |
|
||||||
-webkit-transform: rotate(45deg); |
|
||||||
/* Safari and Chrome */ |
|
||||||
z-index:1051; |
|
||||||
.rl { |
|
||||||
height:75px; |
|
||||||
width:1px; |
|
||||||
background-color:$gray-darker; |
|
||||||
transform: rotate(90deg); |
|
||||||
-ms-transform: rotate(90deg); |
|
||||||
/* IE 9 */ |
|
||||||
-webkit-transform: rotate(90deg); |
|
||||||
/* Safari and Chrome */ |
|
||||||
z-index:1052; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
.modal-backdrop { |
|
||||||
opacity: 0; |
|
||||||
display: none; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Highlight Color Customization |
|
||||||
|
|
||||||
::-moz-selection { |
|
||||||
text-shadow: none; |
|
||||||
background: $theme-primary; |
|
||||||
} |
|
||||||
|
|
||||||
::selection { |
|
||||||
text-shadow: none; |
|
||||||
background: $theme-primary; |
|
||||||
} |
|
||||||
|
|
||||||
img::selection { |
|
||||||
background: transparent; |
|
||||||
} |
|
||||||
|
|
||||||
img::-moz-selection { |
|
||||||
background: transparent; |
|
||||||
} |
|
||||||
|
|
||||||
body { |
|
||||||
webkit-tap-highlight-color: $theme-primary; |
|
||||||
} |
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 434 KiB After Width: | Height: | Size: 434 KiB |
@ -0,0 +1,59 @@ |
|||||||
|
/* |
||||||
|
* Easing Compatibility v1 - http://gsgd.co.uk/sandbox/jquery/easing
|
||||||
|
* |
||||||
|
* Adds compatibility for applications that use the pre 1.2 easing names |
||||||
|
* |
||||||
|
* Copyright (c) 2007 George Smith |
||||||
|
* Licensed under the MIT License: |
||||||
|
* http://www.opensource.org/licenses/mit-license.php
|
||||||
|
*/ |
||||||
|
|
||||||
|
(function($){ |
||||||
|
$.extend( $.easing, |
||||||
|
{ |
||||||
|
easeIn: function (x, t, b, c, d) { |
||||||
|
return $.easing.easeInQuad(x, t, b, c, d); |
||||||
|
}, |
||||||
|
easeOut: function (x, t, b, c, d) { |
||||||
|
return $.easing.easeOutQuad(x, t, b, c, d); |
||||||
|
}, |
||||||
|
easeInOut: function (x, t, b, c, d) { |
||||||
|
return $.easing.easeInOutQuad(x, t, b, c, d); |
||||||
|
}, |
||||||
|
expoin: function(x, t, b, c, d) { |
||||||
|
return $.easing.easeInExpo(x, t, b, c, d); |
||||||
|
}, |
||||||
|
expoout: function(x, t, b, c, d) { |
||||||
|
return $.easing.easeOutExpo(x, t, b, c, d); |
||||||
|
}, |
||||||
|
expoinout: function(x, t, b, c, d) { |
||||||
|
return $.easing.easeInOutExpo(x, t, b, c, d); |
||||||
|
}, |
||||||
|
bouncein: function(x, t, b, c, d) { |
||||||
|
return $.easing.easeInBounce(x, t, b, c, d); |
||||||
|
}, |
||||||
|
bounceout: function(x, t, b, c, d) { |
||||||
|
return $.easing.easeOutBounce(x, t, b, c, d); |
||||||
|
}, |
||||||
|
bounceinout: function(x, t, b, c, d) { |
||||||
|
return $.easing.easeInOutBounce(x, t, b, c, d); |
||||||
|
}, |
||||||
|
elasin: function(x, t, b, c, d) { |
||||||
|
return $.easing.easeInElastic(x, t, b, c, d); |
||||||
|
}, |
||||||
|
elasout: function(x, t, b, c, d) { |
||||||
|
return $.easing.easeOutElastic(x, t, b, c, d); |
||||||
|
}, |
||||||
|
elasinout: function(x, t, b, c, d) { |
||||||
|
return $.easing.easeInOutElastic(x, t, b, c, d); |
||||||
|
}, |
||||||
|
backin: function(x, t, b, c, d) { |
||||||
|
return $.easing.easeInBack(x, t, b, c, d); |
||||||
|
}, |
||||||
|
backout: function(x, t, b, c, d) { |
||||||
|
return $.easing.easeOutBack(x, t, b, c, d); |
||||||
|
}, |
||||||
|
backinout: function(x, t, b, c, d) { |
||||||
|
return $.easing.easeInOutBack(x, t, b, c, d); |
||||||
|
} |
||||||
|
});})(jQuery); |
||||||
@ -0,0 +1,166 @@ |
|||||||
|
/* |
||||||
|
* jQuery Easing v1.4.1 - http://gsgd.co.uk/sandbox/jquery/easing/
|
||||||
|
* Open source under the BSD License. |
||||||
|
* Copyright © 2008 George McGinley Smith |
||||||
|
* All rights reserved. |
||||||
|
* https://raw.github.com/gdsmith/jquery-easing/master/LICENSE
|
||||||
|
*/ |
||||||
|
|
||||||
|
(function (factory) { |
||||||
|
if (typeof define === "function" && define.amd) { |
||||||
|
define(['jquery'], function ($) { |
||||||
|
return factory($); |
||||||
|
}); |
||||||
|
} else if (typeof module === "object" && typeof module.exports === "object") { |
||||||
|
exports = factory(require('jquery')); |
||||||
|
} else { |
||||||
|
factory(jQuery); |
||||||
|
} |
||||||
|
})(function($){ |
||||||
|
|
||||||
|
// Preserve the original jQuery "swing" easing as "jswing"
|
||||||
|
$.easing.jswing = $.easing.swing; |
||||||
|
|
||||||
|
var pow = Math.pow, |
||||||
|
sqrt = Math.sqrt, |
||||||
|
sin = Math.sin, |
||||||
|
cos = Math.cos, |
||||||
|
PI = Math.PI, |
||||||
|
c1 = 1.70158, |
||||||
|
c2 = c1 * 1.525, |
||||||
|
c3 = c1 + 1, |
||||||
|
c4 = ( 2 * PI ) / 3, |
||||||
|
c5 = ( 2 * PI ) / 4.5; |
||||||
|
|
||||||
|
// x is the fraction of animation progress, in the range 0..1
|
||||||
|
function bounceOut(x) { |
||||||
|
var n1 = 7.5625, |
||||||
|
d1 = 2.75; |
||||||
|
if ( x < 1/d1 ) { |
||||||
|
return n1*x*x; |
||||||
|
} else if ( x < 2/d1 ) { |
||||||
|
return n1*(x-=(1.5/d1))*x + 0.75; |
||||||
|
} else if ( x < 2.5/d1 ) { |
||||||
|
return n1*(x-=(2.25/d1))*x + 0.9375; |
||||||
|
} else { |
||||||
|
return n1*(x-=(2.625/d1))*x + 0.984375; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
$.extend( $.easing, |
||||||
|
{ |
||||||
|
def: 'easeOutQuad', |
||||||
|
swing: function (x) { |
||||||
|
return $.easing[$.easing.def](x); |
||||||
|
}, |
||||||
|
easeInQuad: function (x) { |
||||||
|
return x * x; |
||||||
|
}, |
||||||
|
easeOutQuad: function (x) { |
||||||
|
return 1 - ( 1 - x ) * ( 1 - x ); |
||||||
|
}, |
||||||
|
easeInOutQuad: function (x) { |
||||||
|
return x < 0.5 ? |
||||||
|
2 * x * x : |
||||||
|
1 - pow( -2 * x + 2, 2 ) / 2; |
||||||
|
}, |
||||||
|
easeInCubic: function (x) { |
||||||
|
return x * x * x; |
||||||
|
}, |
||||||
|
easeOutCubic: function (x) { |
||||||
|
return 1 - pow( 1 - x, 3 ); |
||||||
|
}, |
||||||
|
easeInOutCubic: function (x) { |
||||||
|
return x < 0.5 ? |
||||||
|
4 * x * x * x : |
||||||
|
1 - pow( -2 * x + 2, 3 ) / 2; |
||||||
|
}, |
||||||
|
easeInQuart: function (x) { |
||||||
|
return x * x * x * x; |
||||||
|
}, |
||||||
|
easeOutQuart: function (x) { |
||||||
|
return 1 - pow( 1 - x, 4 ); |
||||||
|
}, |
||||||
|
easeInOutQuart: function (x) { |
||||||
|
return x < 0.5 ? |
||||||
|
8 * x * x * x * x : |
||||||
|
1 - pow( -2 * x + 2, 4 ) / 2; |
||||||
|
}, |
||||||
|
easeInQuint: function (x) { |
||||||
|
return x * x * x * x * x; |
||||||
|
}, |
||||||
|
easeOutQuint: function (x) { |
||||||
|
return 1 - pow( 1 - x, 5 ); |
||||||
|
}, |
||||||
|
easeInOutQuint: function (x) { |
||||||
|
return x < 0.5 ? |
||||||
|
16 * x * x * x * x * x : |
||||||
|
1 - pow( -2 * x + 2, 5 ) / 2; |
||||||
|
}, |
||||||
|
easeInSine: function (x) { |
||||||
|
return 1 - cos( x * PI/2 ); |
||||||
|
}, |
||||||
|
easeOutSine: function (x) { |
||||||
|
return sin( x * PI/2 ); |
||||||
|
}, |
||||||
|
easeInOutSine: function (x) { |
||||||
|
return -( cos( PI * x ) - 1 ) / 2; |
||||||
|
}, |
||||||
|
easeInExpo: function (x) { |
||||||
|
return x === 0 ? 0 : pow( 2, 10 * x - 10 ); |
||||||
|
}, |
||||||
|
easeOutExpo: function (x) { |
||||||
|
return x === 1 ? 1 : 1 - pow( 2, -10 * x ); |
||||||
|
}, |
||||||
|
easeInOutExpo: function (x) { |
||||||
|
return x === 0 ? 0 : x === 1 ? 1 : x < 0.5 ? |
||||||
|
pow( 2, 20 * x - 10 ) / 2 : |
||||||
|
( 2 - pow( 2, -20 * x + 10 ) ) / 2; |
||||||
|
}, |
||||||
|
easeInCirc: function (x) { |
||||||
|
return 1 - sqrt( 1 - pow( x, 2 ) ); |
||||||
|
}, |
||||||
|
easeOutCirc: function (x) { |
||||||
|
return sqrt( 1 - pow( x - 1, 2 ) ); |
||||||
|
}, |
||||||
|
easeInOutCirc: function (x) { |
||||||
|
return x < 0.5 ? |
||||||
|
( 1 - sqrt( 1 - pow( 2 * x, 2 ) ) ) / 2 : |
||||||
|
( sqrt( 1 - pow( -2 * x + 2, 2 ) ) + 1 ) / 2; |
||||||
|
}, |
||||||
|
easeInElastic: function (x) { |
||||||
|
return x === 0 ? 0 : x === 1 ? 1 : |
||||||
|
-pow( 2, 10 * x - 10 ) * sin( ( x * 10 - 10.75 ) * c4 ); |
||||||
|
}, |
||||||
|
easeOutElastic: function (x) { |
||||||
|
return x === 0 ? 0 : x === 1 ? 1 : |
||||||
|
pow( 2, -10 * x ) * sin( ( x * 10 - 0.75 ) * c4 ) + 1; |
||||||
|
}, |
||||||
|
easeInOutElastic: function (x) { |
||||||
|
return x === 0 ? 0 : x === 1 ? 1 : x < 0.5 ? |
||||||
|
-( pow( 2, 20 * x - 10 ) * sin( ( 20 * x - 11.125 ) * c5 )) / 2 : |
||||||
|
pow( 2, -20 * x + 10 ) * sin( ( 20 * x - 11.125 ) * c5 ) / 2 + 1; |
||||||
|
}, |
||||||
|
easeInBack: function (x) { |
||||||
|
return c3 * x * x * x - c1 * x * x; |
||||||
|
}, |
||||||
|
easeOutBack: function (x) { |
||||||
|
return 1 + c3 * pow( x - 1, 3 ) + c1 * pow( x - 1, 2 ); |
||||||
|
}, |
||||||
|
easeInOutBack: function (x) { |
||||||
|
return x < 0.5 ? |
||||||
|
( pow( 2 * x, 2 ) * ( ( c2 + 1 ) * 2 * x - c2 ) ) / 2 : |
||||||
|
( pow( 2 * x - 2, 2 ) *( ( c2 + 1 ) * ( x * 2 - 2 ) + c2 ) + 2 ) / 2; |
||||||
|
}, |
||||||
|
easeInBounce: function (x) { |
||||||
|
return 1 - bounceOut( 1 - x ); |
||||||
|
}, |
||||||
|
easeOutBounce: bounceOut, |
||||||
|
easeInOutBounce: function (x) { |
||||||
|
return x < 0.5 ? |
||||||
|
( 1 - bounceOut( 1 - 2 * x ) ) / 2 : |
||||||
|
( 1 + bounceOut( 2 * x - 1 ) ) / 2; |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
}); |
||||||
@ -0,0 +1 @@ |
|||||||
|
(function(factory){if(typeof define==="function"&&define.amd){define(["jquery"],function($){return factory($)})}else if(typeof module==="object"&&typeof module.exports==="object"){exports=factory(require("jquery"))}else{factory(jQuery)}})(function($){$.easing.jswing=$.easing.swing;var pow=Math.pow,sqrt=Math.sqrt,sin=Math.sin,cos=Math.cos,PI=Math.PI,c1=1.70158,c2=c1*1.525,c3=c1+1,c4=2*PI/3,c5=2*PI/4.5;function bounceOut(x){var n1=7.5625,d1=2.75;if(x<1/d1){return n1*x*x}else if(x<2/d1){return n1*(x-=1.5/d1)*x+.75}else if(x<2.5/d1){return n1*(x-=2.25/d1)*x+.9375}else{return n1*(x-=2.625/d1)*x+.984375}}$.extend($.easing,{def:"easeOutQuad",swing:function(x){return $.easing[$.easing.def](x)},easeInQuad:function(x){return x*x},easeOutQuad:function(x){return 1-(1-x)*(1-x)},easeInOutQuad:function(x){return x<.5?2*x*x:1-pow(-2*x+2,2)/2},easeInCubic:function(x){return x*x*x},easeOutCubic:function(x){return 1-pow(1-x,3)},easeInOutCubic:function(x){return x<.5?4*x*x*x:1-pow(-2*x+2,3)/2},easeInQuart:function(x){return x*x*x*x},easeOutQuart:function(x){return 1-pow(1-x,4)},easeInOutQuart:function(x){return x<.5?8*x*x*x*x:1-pow(-2*x+2,4)/2},easeInQuint:function(x){return x*x*x*x*x},easeOutQuint:function(x){return 1-pow(1-x,5)},easeInOutQuint:function(x){return x<.5?16*x*x*x*x*x:1-pow(-2*x+2,5)/2},easeInSine:function(x){return 1-cos(x*PI/2)},easeOutSine:function(x){return sin(x*PI/2)},easeInOutSine:function(x){return-(cos(PI*x)-1)/2},easeInExpo:function(x){return x===0?0:pow(2,10*x-10)},easeOutExpo:function(x){return x===1?1:1-pow(2,-10*x)},easeInOutExpo:function(x){return x===0?0:x===1?1:x<.5?pow(2,20*x-10)/2:(2-pow(2,-20*x+10))/2},easeInCirc:function(x){return 1-sqrt(1-pow(x,2))},easeOutCirc:function(x){return sqrt(1-pow(x-1,2))},easeInOutCirc:function(x){return x<.5?(1-sqrt(1-pow(2*x,2)))/2:(sqrt(1-pow(-2*x+2,2))+1)/2},easeInElastic:function(x){return x===0?0:x===1?1:-pow(2,10*x-10)*sin((x*10-10.75)*c4)},easeOutElastic:function(x){return x===0?0:x===1?1:pow(2,-10*x)*sin((x*10-.75)*c4)+1},easeInOutElastic:function(x){return x===0?0:x===1?1:x<.5?-(pow(2,20*x-10)*sin((20*x-11.125)*c5))/2:pow(2,-20*x+10)*sin((20*x-11.125)*c5)/2+1},easeInBack:function(x){return c3*x*x*x-c1*x*x},easeOutBack:function(x){return 1+c3*pow(x-1,3)+c1*pow(x-1,2)},easeInOutBack:function(x){return x<.5?pow(2*x,2)*((c2+1)*2*x-c2)/2:(pow(2*x-2,2)*((c2+1)*(x*2-2)+c2)+2)/2},easeInBounce:function(x){return 1-bounceOut(1-x)},easeOutBounce:bounceOut,easeInOutBounce:function(x){return x<.5?(1-bounceOut(1-2*x))/2:(1+bounceOut(2*x-1))/2}})}); |
||||||
File diff suppressed because one or more lines are too long
Loading…
Reference in new issue