|
After Width: | Height: | Size: 52 KiB |
|
After Width: | Height: | Size: 16 KiB |
|
After Width: | Height: | Size: 31 KiB |
|
After Width: | Height: | Size: 16 KiB |
|
After Width: | Height: | Size: 52 KiB |
|
After Width: | Height: | Size: 16 KiB |
|
After Width: | Height: | Size: 40 KiB |
|
After Width: | Height: | Size: 16 KiB |
|
After Width: | Height: | Size: 102 KiB |
|
After Width: | Height: | Size: 24 KiB |
|
After Width: | Height: | Size: 36 KiB |
|
After Width: | Height: | Size: 13 KiB |
|
Before Width: | Height: | Size: 109 KiB |
|
Before Width: | Height: | Size: 61 KiB |
|
Before Width: | Height: | Size: 162 KiB |
|
Before Width: | Height: | Size: 83 KiB |
|
Before Width: | Height: | Size: 173 KiB |
|
Before Width: | Height: | Size: 91 KiB |
|
Before Width: | Height: | Size: 253 KiB |
|
Before Width: | Height: | Size: 117 KiB |
|
Before Width: | Height: | Size: 256 KiB |
|
Before Width: | Height: | Size: 183 KiB |
|
Before Width: | Height: | Size: 148 KiB |
|
Before Width: | Height: | Size: 78 KiB |
|
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 29 KiB |
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 25 KiB |
@ -1,33 +1,38 @@ |
|||||||
// Agency Theme JavaScript
|
|
||||||
|
|
||||||
(function($) { |
(function($) { |
||||||
"use strict"; // Start of use strict
|
"use strict"; // Start of use strict
|
||||||
|
|
||||||
// jQuery for page scrolling feature - requires jQuery Easing plugin
|
// Smooth scrolling using jQuery easing
|
||||||
$('a.page-scroll').bind('click', function(event) { |
$('a[href*="#"]:not([href="#"])').click(function() { |
||||||
var $anchor = $(this); |
if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) { |
||||||
$('html, body').stop().animate({ |
var target = $(this.hash); |
||||||
scrollTop: ($($anchor.attr('href')).offset().top - 50) |
target = target.length ? target : $('[name=' + this.hash.slice(1) + ']'); |
||||||
}, 1250, 'easeInOutExpo'); |
if (target.length) { |
||||||
event.preventDefault(); |
$('html, body').animate({ |
||||||
}); |
scrollTop: (target.offset().top - 54) |
||||||
|
}, 1000, "easeInOutExpo"); |
||||||
|
return false; |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
// Highlight the top nav as scrolling occurs
|
// Activate scrollspy to add active class to navbar items on scroll
|
||||||
$('body').scrollspy({ |
$('body').scrollspy({ |
||||||
target: '.navbar-fixed-top', |
target: '#mainNav', |
||||||
offset: 51 |
offset: 54 |
||||||
}); |
}); |
||||||
|
|
||||||
// Closes the Responsive Menu on Menu Item Click
|
// Closes responsive menu when a link is clicked
|
||||||
$('.navbar-collapse ul li a').click(function(){ |
$('.navbar-collapse>ul>li>a').click(function() { |
||||||
$('.navbar-toggle:visible').click(); |
$('.navbar-collapse').collapse('hide'); |
||||||
}); |
}); |
||||||
|
|
||||||
// Offset for Main Navigation
|
// Collapse the navbar when page is scrolled
|
||||||
$('#mainNav').affix({ |
$(window).scroll(function() { |
||||||
offset: { |
if ($("#mainNav").offset().top > 100) { |
||||||
top: 100 |
$("#mainNav").addClass("navbar-shrink"); |
||||||
} |
} else { |
||||||
}) |
$("#mainNav").removeClass("navbar-shrink"); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
})(jQuery); // End of use strict
|
})(jQuery); // End of use strict
|
||||||
|
|||||||
@ -1,6 +1,6 @@ |
|||||||
/*! |
/*! |
||||||
* Start Bootstrap - Agency v3.3.7+1 (http://startbootstrap.com/template-overviews/agency)
|
* Start Bootstrap - Agency v4.0.0-alpha (http://startbootstrap.com/template-overviews/agency)
|
||||||
* Copyright 2013-2016 Start Bootstrap |
* Copyright 2013-2017 Start Bootstrap |
||||||
* Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap/blob/gh-pages/LICENSE)
|
* Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-agency/blob/master/LICENSE)
|
||||||
*/ |
*/ |
||||||
!function(t){"use strict";t("a.page-scroll").bind("click",function(a){var o=t(this);t("html, body").stop().animate({scrollTop:t(o.attr("href")).offset().top-50},1250,"easeInOutExpo"),a.preventDefault()}),t("body").scrollspy({target:".navbar-fixed-top",offset:51}),t(".navbar-collapse ul li a").click(function(){t(".navbar-toggle:visible").click()}),t("#mainNav").affix({offset:{top:100}})}(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)+"]")).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,72 +1,68 @@ |
|||||||
// Contact Form Scripts
|
|
||||||
|
|
||||||
$(function() { |
$(function() { |
||||||
|
|
||||||
$("#contactForm input,#contactForm textarea").jqBootstrapValidation({ |
$("#contactForm input,#contactForm textarea").jqBootstrapValidation({ |
||||||
preventSubmit: true, |
preventSubmit: true, |
||||||
submitError: function($form, event, errors) { |
submitError: function($form, event, errors) { |
||||||
// additional error messages or events
|
// additional error messages or events
|
||||||
|
}, |
||||||
|
submitSuccess: function($form, event) { |
||||||
|
event.preventDefault(); // prevent default submit behaviour
|
||||||
|
// get values from FORM
|
||||||
|
var name = $("input#name").val(); |
||||||
|
var email = $("input#email").val(); |
||||||
|
var phone = $("input#phone").val(); |
||||||
|
var message = $("textarea#message").val(); |
||||||
|
var firstName = name; // For Success/Failure Message
|
||||||
|
// Check for white space in name for Success/Fail message
|
||||||
|
if (firstName.indexOf(' ') >= 0) { |
||||||
|
firstName = name.split(' ').slice(0, -1).join(' '); |
||||||
|
} |
||||||
|
$.ajax({ |
||||||
|
url: "././mail/contact_me.php", |
||||||
|
type: "POST", |
||||||
|
data: { |
||||||
|
name: name, |
||||||
|
phone: phone, |
||||||
|
email: email, |
||||||
|
message: message |
||||||
}, |
}, |
||||||
submitSuccess: function($form, event) { |
cache: false, |
||||||
event.preventDefault(); // prevent default submit behaviour
|
success: function() { |
||||||
// get values from FORM
|
// Success message
|
||||||
var name = $("input#name").val(); |
$('#success').html("<div class='alert alert-success'>"); |
||||||
var email = $("input#email").val(); |
$('#success > .alert-success').html("<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>×") |
||||||
var phone = $("input#phone").val(); |
.append("</button>"); |
||||||
var message = $("textarea#message").val(); |
$('#success > .alert-success') |
||||||
var firstName = name; // For Success/Failure Message
|
.append("<strong>Your message has been sent. </strong>"); |
||||||
// Check for white space in name for Success/Fail message
|
$('#success > .alert-success') |
||||||
if (firstName.indexOf(' ') >= 0) { |
.append('</div>'); |
||||||
firstName = name.split(' ').slice(0, -1).join(' '); |
//clear all fields
|
||||||
} |
$('#contactForm').trigger("reset"); |
||||||
$.ajax({ |
|
||||||
url: "././mail/contact_me.php", |
|
||||||
type: "POST", |
|
||||||
data: { |
|
||||||
name: name, |
|
||||||
phone: phone, |
|
||||||
email: email, |
|
||||||
message: message |
|
||||||
}, |
|
||||||
cache: false, |
|
||||||
success: function() { |
|
||||||
// Success message
|
|
||||||
$('#success').html("<div class='alert alert-success'>"); |
|
||||||
$('#success > .alert-success').html("<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>×") |
|
||||||
.append("</button>"); |
|
||||||
$('#success > .alert-success') |
|
||||||
.append("<strong>Your message has been sent. </strong>"); |
|
||||||
$('#success > .alert-success') |
|
||||||
.append('</div>'); |
|
||||||
|
|
||||||
//clear all fields
|
|
||||||
$('#contactForm').trigger("reset"); |
|
||||||
}, |
|
||||||
error: function() { |
|
||||||
// Fail message
|
|
||||||
$('#success').html("<div class='alert alert-danger'>"); |
|
||||||
$('#success > .alert-danger').html("<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>×") |
|
||||||
.append("</button>"); |
|
||||||
$('#success > .alert-danger').append($("<strong>").text("Sorry " + firstName + ", it seems that my mail server is not responding. Please try again later!")); |
|
||||||
$('#success > .alert-danger').append('</div>'); |
|
||||||
//clear all fields
|
|
||||||
$('#contactForm').trigger("reset"); |
|
||||||
}, |
|
||||||
}); |
|
||||||
}, |
}, |
||||||
filter: function() { |
error: function() { |
||||||
return $(this).is(":visible"); |
// Fail message
|
||||||
|
$('#success').html("<div class='alert alert-danger'>"); |
||||||
|
$('#success > .alert-danger').html("<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>×") |
||||||
|
.append("</button>"); |
||||||
|
$('#success > .alert-danger').append($("<strong>").text("Sorry " + firstName + ", it seems that my mail server is not responding. Please try again later!")); |
||||||
|
$('#success > .alert-danger').append('</div>'); |
||||||
|
//clear all fields
|
||||||
|
$('#contactForm').trigger("reset"); |
||||||
}, |
}, |
||||||
}); |
}); |
||||||
|
}, |
||||||
|
filter: function() { |
||||||
|
return $(this).is(":visible"); |
||||||
|
}, |
||||||
|
}); |
||||||
|
|
||||||
$("a[data-toggle=\"tab\"]").click(function(e) { |
$("a[data-toggle=\"tab\"]").click(function(e) { |
||||||
e.preventDefault(); |
e.preventDefault(); |
||||||
$(this).tab("show"); |
$(this).tab("show"); |
||||||
}); |
}); |
||||||
}); |
}); |
||||||
|
|
||||||
|
|
||||||
/*When clicking on Full hide fail/success boxes */ |
/*When clicking on Full hide fail/success boxes */ |
||||||
$('#name').focus(function() { |
$('#name').focus(function() { |
||||||
$('#success').html(''); |
$('#success').html(''); |
||||||
}); |
}); |
||||||
|
|||||||
@ -1,738 +0,0 @@ |
|||||||
@import "variables.less"; |
|
||||||
@import "mixins.less"; |
|
||||||
|
|
||||||
// Global Components |
|
||||||
|
|
||||||
body { |
|
||||||
overflow-x: hidden; |
|
||||||
.body-font; |
|
||||||
} |
|
||||||
|
|
||||||
.text-muted { |
|
||||||
color: @gray-light; |
|
||||||
} |
|
||||||
|
|
||||||
.text-primary { |
|
||||||
color: @theme-primary; |
|
||||||
} |
|
||||||
|
|
||||||
p { |
|
||||||
font-size: 14px; |
|
||||||
line-height: 1.75; |
|
||||||
} |
|
||||||
|
|
||||||
p.large { |
|
||||||
font-size: 16px; |
|
||||||
} |
|
||||||
|
|
||||||
a, |
|
||||||
a:hover, |
|
||||||
a:focus, |
|
||||||
a:active, |
|
||||||
a.active { |
|
||||||
outline: none; |
|
||||||
} |
|
||||||
|
|
||||||
a { |
|
||||||
color: @theme-primary; |
|
||||||
} |
|
||||||
|
|
||||||
a:hover, |
|
||||||
a:focus, |
|
||||||
a:active, |
|
||||||
a.active { |
|
||||||
color: darken(@theme-primary, 10%); |
|
||||||
} |
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, h6 { |
|
||||||
.heading-font; |
|
||||||
font-weight: 700; |
|
||||||
} |
|
||||||
|
|
||||||
.img-centered { |
|
||||||
margin: 0 auto; |
|
||||||
} |
|
||||||
|
|
||||||
.bg-light-gray { |
|
||||||
background-color: @gray-lighter; |
|
||||||
} |
|
||||||
|
|
||||||
.bg-darkest-gray { |
|
||||||
background-color: @gray-darker; |
|
||||||
} |
|
||||||
|
|
||||||
// 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 |
|
||||||
|
|
||||||
.navbar-custom { |
|
||||||
background-color: @gray-darker; |
|
||||||
border-color: transparent; |
|
||||||
.navbar-brand { |
|
||||||
color: @theme-primary; |
|
||||||
.script-font; |
|
||||||
&:hover, |
|
||||||
&:focus, |
|
||||||
&:active, |
|
||||||
&.active { |
|
||||||
color: darken(@theme-primary, 10%); |
|
||||||
} |
|
||||||
} |
|
||||||
.navbar-collapse { |
|
||||||
border-color: fade(white, 2%); |
|
||||||
} |
|
||||||
.navbar-toggle { |
|
||||||
background-color: @theme-primary; |
|
||||||
border-color: @theme-primary; |
|
||||||
.heading-font; |
|
||||||
color: white; |
|
||||||
font-size: 12px; |
|
||||||
&:hover, |
|
||||||
&:focus { |
|
||||||
background-color: @theme-primary; |
|
||||||
} |
|
||||||
} |
|
||||||
.nav { |
|
||||||
li { |
|
||||||
a { |
|
||||||
.heading-font; |
|
||||||
font-weight: 400; |
|
||||||
letter-spacing: 1px; |
|
||||||
color: white; |
|
||||||
&:hover, |
|
||||||
&:focus { |
|
||||||
color: @theme-primary; |
|
||||||
outline: none; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
.navbar-nav>.active>a { |
|
||||||
border-radius: 0; |
|
||||||
color: white; |
|
||||||
background-color: @theme-primary; |
|
||||||
} |
|
||||||
.navbar-nav>.active>a:hover, |
|
||||||
.navbar-nav>.active>a:focus { |
|
||||||
color: white; |
|
||||||
background-color: darken(@theme-primary, 10%); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
@media(min-width:768px) { |
|
||||||
.navbar-custom { |
|
||||||
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: 2em; |
|
||||||
-webkit-transition: all 0.3s; |
|
||||||
-moz-transition: all 0.3s; |
|
||||||
transition: all 0.3s; |
|
||||||
} |
|
||||||
.navbar-nav>.active>a { |
|
||||||
border-radius: 3px; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Navbar Change on Scroll |
|
||||||
|
|
||||||
@media(min-width:768px) { |
|
||||||
.navbar-custom.affix { |
|
||||||
background-color: @gray-darker; |
|
||||||
padding: 10px 0; |
|
||||||
.navbar-brand { |
|
||||||
font-size: 1.5em; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
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 { |
|
||||||
margin: 0 auto; |
|
||||||
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 { |
|
||||||
line-height: 40px; |
|
||||||
.heading-font; |
|
||||||
text-transform: none; |
|
||||||
} |
|
||||||
ul.quicklinks { |
|
||||||
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%; |
|
||||||
width: auto; |
|
||||||
} |
|
||||||
.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,69 +0,0 @@ |
|||||||
// Mixins |
|
||||||
|
|
||||||
// Bootstrap Button Variant |
|
||||||
|
|
||||||
.button-variant(@color; @background; @border) { |
|
||||||
color: @color; |
|
||||||
background-color: @background; |
|
||||||
border-color: @border; |
|
||||||
|
|
||||||
&:hover, |
|
||||||
&:focus, |
|
||||||
&:active, |
|
||||||
&.active, |
|
||||||
.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 |
|
||||||
@ -1,28 +1,44 @@ |
|||||||
{ |
{ |
||||||
"name": "agency", |
|
||||||
"title": "Agency", |
"title": "Agency", |
||||||
"version": "3.3.7+1", |
"name": "startbootstrap-agency", |
||||||
|
"version": "4.0.0-alpha", |
||||||
|
"description": "Agency is a one page HTML theme for Bootstrap.", |
||||||
|
"keywords": [ |
||||||
|
"css", |
||||||
|
"sass", |
||||||
|
"html", |
||||||
|
"responsive", |
||||||
|
"theme", |
||||||
|
"template" |
||||||
|
], |
||||||
"homepage": "http://startbootstrap.com/template-overviews/agency", |
"homepage": "http://startbootstrap.com/template-overviews/agency", |
||||||
|
"bugs": { |
||||||
|
"url": "https://github.com/BlackrockDigital/startbootstrap-agency/issues", |
||||||
|
"email": "feedback@startbootstrap.com" |
||||||
|
}, |
||||||
|
"license": "MIT", |
||||||
"author": "Start Bootstrap", |
"author": "Start Bootstrap", |
||||||
"license": { |
"contributors": [ |
||||||
"type": "MIT", |
"David Miller (http://davidmiller.io/)" |
||||||
"url": "https://github.com/BlackrockDigital/startbootstrap/blob/gh-pages/LICENSE" |
], |
||||||
|
"repository": { |
||||||
|
"type": "git", |
||||||
|
"url": "https://github.com/BlackrockDigital/startbootstrap-agency.git" |
||||||
|
}, |
||||||
|
"dependencies": { |
||||||
|
"bootstrap": "^4.0.0-beta", |
||||||
|
"font-awesome": "4.7.0", |
||||||
|
"jquery": "^3.2.1", |
||||||
|
"jquery.easing": "^1.4.1", |
||||||
|
"popper.js": "^1.11.1" |
||||||
}, |
}, |
||||||
"devDependencies": { |
"devDependencies": { |
||||||
"bootstrap": "^3.3.7", |
"browser-sync": "2.18.13", |
||||||
"browser-sync": "^2.13.0", |
|
||||||
"font-awesome": "^4.6.3", |
|
||||||
"gulp": "^3.9.1", |
"gulp": "^3.9.1", |
||||||
"gulp-clean-css": "^2.0.10", |
"gulp-clean-css": "3.7.0", |
||||||
"gulp-header": "^1.8.7", |
"gulp-header": "1.8.9", |
||||||
"gulp-less": "^3.1.0", |
|
||||||
"gulp-rename": "^1.2.2", |
"gulp-rename": "^1.2.2", |
||||||
"gulp-sass": "^2.3.2", |
"gulp-sass": "^3.1.0", |
||||||
"gulp-uglify": "^1.5.4", |
"gulp-uglify": "3.0.0" |
||||||
"jquery": "^1.11.3" |
|
||||||
}, |
|
||||||
"repository": { |
|
||||||
"type": "git", |
|
||||||
"url": "https://github.com/BlackrockDigital/startbootstrap-agency.git" |
|
||||||
} |
} |
||||||
} |
} |
||||||
|
|||||||
@ -0,0 +1,19 @@ |
|||||||
|
// Bootstrap overrides for this template |
||||||
|
.text-primary { |
||||||
|
color: $theme-primary !important; |
||||||
|
} |
||||||
|
|
||||||
|
.btn-primary { |
||||||
|
font-weight: 700; |
||||||
|
@include button-variant(white, $theme-primary, $theme-primary); |
||||||
|
@include heading-font; |
||||||
|
} |
||||||
|
|
||||||
|
.btn-xl { |
||||||
|
font-size: 18px; |
||||||
|
font-weight: 700; |
||||||
|
padding: 20px 40px; |
||||||
|
border-radius: 3px; |
||||||
|
@include button-variant(white, $theme-primary, $theme-primary); |
||||||
|
@include heading-font; |
||||||
|
} |
||||||
@ -0,0 +1,52 @@ |
|||||||
|
// Styling for the contact section |
||||||
|
section#contact { |
||||||
|
background-color: $gray-darker; |
||||||
|
background-image: url('../img/map-image.png'); |
||||||
|
background-repeat: no-repeat; |
||||||
|
background-position: center; |
||||||
|
.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 { |
||||||
|
font-weight: 700; |
||||||
|
color: $gray-lighter; |
||||||
|
@include heading-font; |
||||||
|
} |
||||||
|
:-moz-placeholder { |
||||||
|
font-weight: 700; |
||||||
|
color: $gray-lighter; |
||||||
|
/* Firefox 18- */ |
||||||
|
@include heading-font; |
||||||
|
} |
||||||
|
::-moz-placeholder { |
||||||
|
font-weight: 700; |
||||||
|
color: $gray-lighter; |
||||||
|
/* Firefox 19+ */ |
||||||
|
@include heading-font; |
||||||
|
} |
||||||
|
:-ms-input-placeholder { |
||||||
|
font-weight: 700; |
||||||
|
color: $gray-lighter; |
||||||
|
@include heading-font; |
||||||
|
} |
||||||
|
.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; |
||||||
|
text-transform: none; |
||||||
|
@include heading-font; |
||||||
|
} |
||||||
|
ul.quicklinks { |
||||||
|
font-size: 90%; |
||||||
|
line-height: 40px; |
||||||
|
margin-bottom: 0; |
||||||
|
text-transform: none; |
||||||
|
@include heading-font; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
ul.social-buttons { |
||||||
|
margin-bottom: 0; |
||||||
|
li { |
||||||
|
a { |
||||||
|
font-size: 20px; |
||||||
|
line-height: 40px; |
||||||
|
display: block; |
||||||
|
width: 40px; |
||||||
|
height: 40px; |
||||||
|
-webkit-transition: all 0.3s; |
||||||
|
-moz-transition: all 0.3s; |
||||||
|
transition: all 0.3s; |
||||||
|
color: white; |
||||||
|
border-radius: 100%; |
||||||
|
outline: none; |
||||||
|
background-color: $gray-darker; |
||||||
|
&:active, |
||||||
|
&:focus, |
||||||
|
&:hover { |
||||||
|
background-color: $theme-primary; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,74 @@ |
|||||||
|
// Global styling for this template |
||||||
|
body { |
||||||
|
overflow-x: hidden; |
||||||
|
@include body-font; |
||||||
|
} |
||||||
|
|
||||||
|
p { |
||||||
|
line-height: 1.75; |
||||||
|
} |
||||||
|
|
||||||
|
a { |
||||||
|
color: $theme-primary; |
||||||
|
&.active, |
||||||
|
&:active, |
||||||
|
&:focus, |
||||||
|
&:hover { |
||||||
|
color: darken($theme-primary, 10%); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
h1, |
||||||
|
h2, |
||||||
|
h3, |
||||||
|
h4, |
||||||
|
h5, |
||||||
|
h6 { |
||||||
|
font-weight: 700; |
||||||
|
@include heading-font; |
||||||
|
} |
||||||
|
|
||||||
|
section { |
||||||
|
padding: 100px 0; |
||||||
|
h2.section-heading { |
||||||
|
font-size: 40px; |
||||||
|
margin-top: 0; |
||||||
|
margin-bottom: 15px; |
||||||
|
} |
||||||
|
h3.section-subheading { |
||||||
|
font-size: 16px; |
||||||
|
font-weight: 400; |
||||||
|
font-style: italic; |
||||||
|
margin-bottom: 75px; |
||||||
|
text-transform: none; |
||||||
|
@include serif-font; |
||||||
|
} |
||||||
|
} |
||||||
|
@media(min-width:768px) { |
||||||
|
section { |
||||||
|
padding: 150px 0; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
// Highlight color customization |
||||||
|
::-moz-selection { |
||||||
|
background: $theme-primary; |
||||||
|
text-shadow: none; |
||||||
|
} |
||||||
|
|
||||||
|
::selection { |
||||||
|
background: $theme-primary; |
||||||
|
text-shadow: none; |
||||||
|
} |
||||||
|
|
||||||
|
img::selection { |
||||||
|
background: transparent; |
||||||
|
} |
||||||
|
|
||||||
|
img::-moz-selection { |
||||||
|
background: transparent; |
||||||
|
} |
||||||
|
|
||||||
|
body { |
||||||
|
-webkit-tap-highlight-color: $theme-primary; |
||||||
|
} |
||||||
@ -0,0 +1,50 @@ |
|||||||
|
// Styling for the masthead |
||||||
|
header.masthead { |
||||||
|
text-align: center; |
||||||
|
color: white; |
||||||
|
background-image: url('../img/header-bg.jpg'); |
||||||
|
background-repeat: no-repeat; |
||||||
|
background-attachment: scroll; |
||||||
|
background-position: center center; |
||||||
|
@include background-cover; |
||||||
|
.intro-text { |
||||||
|
padding-top: 150px; |
||||||
|
padding-bottom: 100px; |
||||||
|
.intro-lead-in { |
||||||
|
font-size: 22px; |
||||||
|
font-style: italic; |
||||||
|
line-height: 22px; |
||||||
|
margin-bottom: 25px; |
||||||
|
@include serif-font; |
||||||
|
} |
||||||
|
.intro-heading { |
||||||
|
font-size: 50px; |
||||||
|
font-weight: 700; |
||||||
|
line-height: 50px; |
||||||
|
margin-bottom: 25px; |
||||||
|
@include heading-font; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
@media(min-width:768px) { |
||||||
|
header.masthead { |
||||||
|
.intro-text { |
||||||
|
padding-top: 300px; |
||||||
|
padding-bottom: 200px; |
||||||
|
.intro-lead-in { |
||||||
|
font-size: 40px; |
||||||
|
font-style: italic; |
||||||
|
line-height: 40px; |
||||||
|
margin-bottom: 25px; |
||||||
|
@include serif-font; |
||||||
|
} |
||||||
|
.intro-heading { |
||||||
|
font-size: 75px; |
||||||
|
font-weight: 700; |
||||||
|
line-height: 75px; |
||||||
|
margin-bottom: 50px; |
||||||
|
@include heading-font; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,73 @@ |
|||||||
|
// Styling for the navbar |
||||||
|
#mainNav { |
||||||
|
background-color: $gray-darker; |
||||||
|
.navbar-toggler { |
||||||
|
font-size: 12px; |
||||||
|
right: 0; |
||||||
|
padding: 13px; |
||||||
|
text-transform: uppercase; |
||||||
|
color: white; |
||||||
|
border: 0; |
||||||
|
background-color: $theme-primary; |
||||||
|
@include heading-font; |
||||||
|
} |
||||||
|
.navbar-brand { |
||||||
|
color: $theme-primary; |
||||||
|
@include script-font; |
||||||
|
&.active, |
||||||
|
&:active, |
||||||
|
&:focus, |
||||||
|
&:hover { |
||||||
|
color: darken($theme-primary, 10%); |
||||||
|
} |
||||||
|
} |
||||||
|
.navbar-nav { |
||||||
|
.nav-item { |
||||||
|
.nav-link { |
||||||
|
font-size: 90%; |
||||||
|
font-weight: 400; |
||||||
|
padding: 0.75em 0; |
||||||
|
letter-spacing: 1px; |
||||||
|
color: white; |
||||||
|
@include heading-font; |
||||||
|
&.active, |
||||||
|
&:hover { |
||||||
|
color: $theme-primary; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
@media(min-width:992px) { |
||||||
|
#mainNav { |
||||||
|
padding-top: 25px; |
||||||
|
padding-bottom: 25px; |
||||||
|
-webkit-transition: padding-top 0.3s, padding-bottom 0.3s; |
||||||
|
-moz-transition: padding-top 0.3s, padding-bottom 0.3s; |
||||||
|
transition: padding-top 0.3s, padding-bottom 0.3s; |
||||||
|
border: none; |
||||||
|
background-color: transparent; |
||||||
|
.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 { |
||||||
|
padding-top: 0; |
||||||
|
padding-bottom: 0; |
||||||
|
background-color: $gray-darker; |
||||||
|
.navbar-brand { |
||||||
|
font-size: 1.25em; |
||||||
|
padding: 12px 0; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,151 @@ |
|||||||
|
// Styling for the portfolio section |
||||||
|
#portfolio { |
||||||
|
.portfolio-item { |
||||||
|
right: 0; |
||||||
|
margin: 0 0 15px; |
||||||
|
.portfolio-link { |
||||||
|
position: relative; |
||||||
|
display: block; |
||||||
|
max-width: 400px; |
||||||
|
margin: 0 auto; |
||||||
|
cursor: pointer; |
||||||
|
.portfolio-hover { |
||||||
|
position: absolute; |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
-webkit-transition: all ease 0.5s; |
||||||
|
-moz-transition: all ease 0.5s; |
||||||
|
transition: all ease 0.5s; |
||||||
|
opacity: 0; |
||||||
|
background: fade-out($theme-primary, .1); |
||||||
|
&:hover { |
||||||
|
opacity: 1; |
||||||
|
} |
||||||
|
.portfolio-hover-content { |
||||||
|
font-size: 20px; |
||||||
|
position: absolute; |
||||||
|
top: 50%; |
||||||
|
width: 100%; |
||||||
|
height: 20px; |
||||||
|
margin-top: -12px; |
||||||
|
text-align: center; |
||||||
|
color: white; |
||||||
|
i { |
||||||
|
margin-top: -12px; |
||||||
|
} |
||||||
|
h3, |
||||||
|
h4 { |
||||||
|
margin: 0; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.portfolio-caption { |
||||||
|
max-width: 400px; |
||||||
|
margin: 0 auto; |
||||||
|
padding: 25px; |
||||||
|
text-align: center; |
||||||
|
background-color: white; |
||||||
|
h4 { |
||||||
|
margin: 0; |
||||||
|
text-transform: none; |
||||||
|
} |
||||||
|
p { |
||||||
|
font-size: 16px; |
||||||
|
font-style: italic; |
||||||
|
margin: 0; |
||||||
|
@include serif-font; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
* { |
||||||
|
z-index: 2; |
||||||
|
} |
||||||
|
} |
||||||
|
@media(min-width:767px) { |
||||||
|
#portfolio { |
||||||
|
.portfolio-item { |
||||||
|
margin: 0 0 30px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.portfolio-modal { |
||||||
|
.modal-dialog { |
||||||
|
max-width: none; |
||||||
|
height: 100%; |
||||||
|
margin: 0; |
||||||
|
} |
||||||
|
.modal-content { |
||||||
|
min-height: 100%; |
||||||
|
padding: 100px 0; |
||||||
|
text-align: center; |
||||||
|
border: none; |
||||||
|
border-radius: 0; |
||||||
|
background-clip: border-box; |
||||||
|
-webkit-box-shadow: none; |
||||||
|
box-shadow: none; |
||||||
|
h2 { |
||||||
|
font-size: 3em; |
||||||
|
margin-bottom: 15px; |
||||||
|
} |
||||||
|
p { |
||||||
|
margin-bottom: 30px; |
||||||
|
} |
||||||
|
p.item-intro { |
||||||
|
font-size: 16px; |
||||||
|
font-style: italic; |
||||||
|
margin: 20px 0 30px; |
||||||
|
@include serif-font; |
||||||
|
} |
||||||
|
ul.list-inline { |
||||||
|
margin-top: 0; |
||||||
|
margin-bottom: 30px; |
||||||
|
} |
||||||
|
img { |
||||||
|
margin-bottom: 30px; |
||||||
|
} |
||||||
|
button { |
||||||
|
cursor: pointer; |
||||||
|
} |
||||||
|
} |
||||||
|
.close-modal { |
||||||
|
position: absolute; |
||||||
|
top: 25px; |
||||||
|
right: 25px; |
||||||
|
width: 75px; |
||||||
|
height: 75px; |
||||||
|
cursor: pointer; |
||||||
|
background-color: transparent; |
||||||
|
&:hover { |
||||||
|
opacity: 0.3; |
||||||
|
} |
||||||
|
.lr { |
||||||
|
/* Safari and Chrome */ |
||||||
|
z-index: 1051; |
||||||
|
width: 1px; |
||||||
|
height: 75px; |
||||||
|
margin-left: 35px; |
||||||
|
/* IE 9 */ |
||||||
|
-webkit-transform: rotate(45deg); |
||||||
|
-ms-transform: rotate(45deg); |
||||||
|
transform: rotate(45deg); |
||||||
|
background-color: $gray-darker; |
||||||
|
.rl { |
||||||
|
/* Safari and Chrome */ |
||||||
|
z-index: 1052; |
||||||
|
width: 1px; |
||||||
|
height: 75px; |
||||||
|
/* IE 9 */ |
||||||
|
-webkit-transform: rotate(90deg); |
||||||
|
-ms-transform: rotate(90deg); |
||||||
|
transform: rotate(90deg); |
||||||
|
background-color: $gray-darker; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.modal-backdrop { |
||||||
|
display: none; |
||||||
|
opacity: 0; |
||||||
|
} |
||||||
|
} |
||||||
@ -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 { |
||||||
|
margin-bottom: 50px; |
||||||
|
text-align: center; |
||||||
|
img { |
||||||
|
width: 225px; |
||||||
|
height: 225px; |
||||||
|
border: 7px solid white; |
||||||
|
} |
||||||
|
h4 { |
||||||
|
margin-top: 25px; |
||||||
|
margin-bottom: 0; |
||||||
|
text-transform: none; |
||||||
|
} |
||||||
|
p { |
||||||
|
margin-top: 0; |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,178 @@ |
|||||||
|
// Styling for the timeline section |
||||||
|
.timeline { |
||||||
|
position: relative; |
||||||
|
padding: 0; |
||||||
|
list-style: none; |
||||||
|
&:before { |
||||||
|
position: absolute; |
||||||
|
top: 0; |
||||||
|
bottom: 0; |
||||||
|
left: 40px; |
||||||
|
width: 2px; |
||||||
|
margin-left: -1.5px; |
||||||
|
content: ''; |
||||||
|
background-color: #f1f1f1; |
||||||
|
} |
||||||
|
> li { |
||||||
|
position: relative; |
||||||
|
min-height: 50px; |
||||||
|
margin-bottom: 50px; |
||||||
|
&:after, |
||||||
|
&:before { |
||||||
|
display: table; |
||||||
|
content: ' '; |
||||||
|
} |
||||||
|
&:after { |
||||||
|
clear: both; |
||||||
|
} |
||||||
|
.timeline-panel { |
||||||
|
position: relative; |
||||||
|
float: right; |
||||||
|
width: 100%; |
||||||
|
padding: 0 20px 0 100px; |
||||||
|
text-align: left; |
||||||
|
&:before { |
||||||
|
right: auto; |
||||||
|
left: -15px; |
||||||
|
border-right-width: 15px; |
||||||
|
border-left-width: 0; |
||||||
|
} |
||||||
|
&:after { |
||||||
|
right: auto; |
||||||
|
left: -14px; |
||||||
|
border-right-width: 14px; |
||||||
|
border-left-width: 0; |
||||||
|
} |
||||||
|
} |
||||||
|
.timeline-image { |
||||||
|
position: absolute; |
||||||
|
z-index: 100; |
||||||
|
left: 0; |
||||||
|
width: 80px; |
||||||
|
height: 80px; |
||||||
|
margin-left: 0; |
||||||
|
text-align: center; |
||||||
|
color: white; |
||||||
|
border: 7px solid #f1f1f1; |
||||||
|
border-radius: 100%; |
||||||
|
background-color: $theme-primary; |
||||||
|
h4 { |
||||||
|
font-size: 10px; |
||||||
|
line-height: 14px; |
||||||
|
margin-top: 12px; |
||||||
|
} |
||||||
|
} |
||||||
|
&.timeline-inverted > .timeline-panel { |
||||||
|
float: right; |
||||||
|
padding: 0 20px 0 100px; |
||||||
|
text-align: left; |
||||||
|
&:before { |
||||||
|
right: auto; |
||||||
|
left: -15px; |
||||||
|
border-right-width: 15px; |
||||||
|
border-left-width: 0; |
||||||
|
} |
||||||
|
&:after { |
||||||
|
right: auto; |
||||||
|
left: -14px; |
||||||
|
border-right-width: 14px; |
||||||
|
border-left-width: 0; |
||||||
|
} |
||||||
|
} |
||||||
|
&:last-child { |
||||||
|
margin-bottom: 0; |
||||||
|
} |
||||||
|
} |
||||||
|
.timeline-heading { |
||||||
|
h4 { |
||||||
|
margin-top: 0; |
||||||
|
color: inherit; |
||||||
|
&.subheading { |
||||||
|
text-transform: none; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.timeline-body { |
||||||
|
> ul, |
||||||
|
> p { |
||||||
|
margin-bottom: 0; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
@media(min-width:768px) { |
||||||
|
.timeline { |
||||||
|
&:before { |
||||||
|
left: 50%; |
||||||
|
} |
||||||
|
> li { |
||||||
|
min-height: 100px; |
||||||
|
margin-bottom: 100px; |
||||||
|
.timeline-panel { |
||||||
|
float: left; |
||||||
|
width: 41%; |
||||||
|
padding: 0 20px 20px 30px; |
||||||
|
text-align: right; |
||||||
|
} |
||||||
|
.timeline-image { |
||||||
|
left: 50%; |
||||||
|
width: 100px; |
||||||
|
height: 100px; |
||||||
|
margin-left: -50px; |
||||||
|
h4 { |
||||||
|
font-size: 13px; |
||||||
|
line-height: 18px; |
||||||
|
margin-top: 16px; |
||||||
|
} |
||||||
|
} |
||||||
|
&.timeline-inverted > .timeline-panel { |
||||||
|
float: right; |
||||||
|
padding: 0 30px 20px 20px; |
||||||
|
text-align: left; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
@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; |
||||||
|
line-height: 26px; |
||||||
|
margin-top: 30px; |
||||||
|
} |
||||||
|
} |
||||||
|
&.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,738 +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-muted { |
@import "team.scss"; |
||||||
color: $gray-light; |
@import "contact.scss"; |
||||||
} |
@import "footer.scss"; |
||||||
|
// Bootstrap Overrides |
||||||
.text-primary { |
@import "bootstrap-overrides.scss"; |
||||||
color: $theme-primary; |
|
||||||
} |
|
||||||
|
|
||||||
p { |
|
||||||
font-size: 14px; |
|
||||||
line-height: 1.75; |
|
||||||
} |
|
||||||
|
|
||||||
p.large { |
|
||||||
font-size: 16px; |
|
||||||
} |
|
||||||
|
|
||||||
a, |
|
||||||
a:hover, |
|
||||||
a:focus, |
|
||||||
a:active, |
|
||||||
a.active { |
|
||||||
outline: none; |
|
||||||
} |
|
||||||
|
|
||||||
a { |
|
||||||
color: $theme-primary; |
|
||||||
} |
|
||||||
|
|
||||||
a:hover, |
|
||||||
a:focus, |
|
||||||
a:active, |
|
||||||
a.active { |
|
||||||
color: darken($theme-primary, 10%); |
|
||||||
} |
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, h6 { |
|
||||||
@include heading-font; |
|
||||||
font-weight: 700; |
|
||||||
} |
|
||||||
|
|
||||||
.img-centered { |
|
||||||
margin: 0 auto; |
|
||||||
} |
|
||||||
|
|
||||||
.bg-light-gray { |
|
||||||
background-color: $gray-lighter; |
|
||||||
} |
|
||||||
|
|
||||||
.bg-darkest-gray { |
|
||||||
background-color: $gray-darker; |
|
||||||
} |
|
||||||
|
|
||||||
// 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 |
|
||||||
|
|
||||||
.navbar-custom { |
|
||||||
background-color: $gray-darker; |
|
||||||
border-color: transparent; |
|
||||||
.navbar-brand { |
|
||||||
color: $theme-primary; |
|
||||||
@include script-font; |
|
||||||
&:hover, |
|
||||||
&:focus, |
|
||||||
&:active, |
|
||||||
&.active { |
|
||||||
color: darken($theme-primary, 10%); |
|
||||||
} |
|
||||||
} |
|
||||||
.navbar-collapse { |
|
||||||
border-color: fade-out(white, .02); |
|
||||||
} |
|
||||||
.navbar-toggle { |
|
||||||
background-color: $theme-primary; |
|
||||||
border-color: $theme-primary; |
|
||||||
@include heading-font; |
|
||||||
color: white; |
|
||||||
font-size: 12px; |
|
||||||
&:hover, |
|
||||||
&:focus { |
|
||||||
background-color: $theme-primary; |
|
||||||
} |
|
||||||
} |
|
||||||
.nav { |
|
||||||
li { |
|
||||||
a { |
|
||||||
@include heading-font; |
|
||||||
font-weight: 400; |
|
||||||
letter-spacing: 1px; |
|
||||||
color: white; |
|
||||||
&:hover, |
|
||||||
&:focus { |
|
||||||
color: $theme-primary; |
|
||||||
outline: none; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
.navbar-nav>.active>a { |
|
||||||
border-radius: 0; |
|
||||||
color: white; |
|
||||||
background-color: $theme-primary; |
|
||||||
} |
|
||||||
.navbar-nav>.active>a:hover, |
|
||||||
.navbar-nav>.active>a:focus { |
|
||||||
color: white; |
|
||||||
background-color: darken($theme-primary, 10%); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
@media(min-width:768px) { |
|
||||||
.navbar-custom { |
|
||||||
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: 2em; |
|
||||||
-webkit-transition: all 0.3s; |
|
||||||
-moz-transition: all 0.3s; |
|
||||||
transition: all 0.3s; |
|
||||||
} |
|
||||||
.navbar-nav>.active>a { |
|
||||||
border-radius: 3px; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Navbar Change on Scroll |
|
||||||
|
|
||||||
@media(min-width:768px) { |
|
||||||
.navbar-custom.affix { |
|
||||||
background-color: $gray-darker; |
|
||||||
padding: 10px 0; |
|
||||||
.navbar-brand { |
|
||||||
font-size: 1.5em; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
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 { |
|
||||||
margin: 0 auto; |
|
||||||
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 { |
|
||||||
line-height: 40px; |
|
||||||
@include heading-font; |
|
||||||
text-transform: none; |
|
||||||
} |
|
||||||
ul.quicklinks { |
|
||||||
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%; |
|
||||||
width: auto; |
|
||||||
} |
|
||||||
.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; |
|
||||||
} |
|
||||||
|
|||||||
@ -0,0 +1,330 @@ |
|||||||
|
html { |
||||||
|
box-sizing: border-box; |
||||||
|
font-family: sans-serif; |
||||||
|
line-height: 1.15; |
||||||
|
-webkit-text-size-adjust: 100%; |
||||||
|
-ms-text-size-adjust: 100%; |
||||||
|
-ms-overflow-style: scrollbar; |
||||||
|
-webkit-tap-highlight-color: transparent; |
||||||
|
} |
||||||
|
|
||||||
|
*, |
||||||
|
*::before, |
||||||
|
*::after { |
||||||
|
box-sizing: inherit; |
||||||
|
} |
||||||
|
|
||||||
|
@-ms-viewport { |
||||||
|
width: device-width; |
||||||
|
} |
||||||
|
|
||||||
|
article, aside, dialog, figcaption, figure, footer, header, hgroup, main, nav, section { |
||||||
|
display: block; |
||||||
|
} |
||||||
|
|
||||||
|
body { |
||||||
|
margin: 0; |
||||||
|
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; |
||||||
|
font-size: 1rem; |
||||||
|
font-weight: normal; |
||||||
|
line-height: 1.5; |
||||||
|
color: #212529; |
||||||
|
background-color: #fff; |
||||||
|
} |
||||||
|
|
||||||
|
[tabindex="-1"]:focus { |
||||||
|
outline: none !important; |
||||||
|
} |
||||||
|
|
||||||
|
hr { |
||||||
|
box-sizing: content-box; |
||||||
|
height: 0; |
||||||
|
overflow: visible; |
||||||
|
} |
||||||
|
|
||||||
|
h1, h2, h3, h4, h5, h6 { |
||||||
|
margin-top: 0; |
||||||
|
margin-bottom: .5rem; |
||||||
|
} |
||||||
|
|
||||||
|
p { |
||||||
|
margin-top: 0; |
||||||
|
margin-bottom: 1rem; |
||||||
|
} |
||||||
|
|
||||||
|
abbr[title], |
||||||
|
abbr[data-original-title] { |
||||||
|
text-decoration: underline; |
||||||
|
-webkit-text-decoration: underline dotted; |
||||||
|
text-decoration: underline dotted; |
||||||
|
cursor: help; |
||||||
|
border-bottom: 0; |
||||||
|
} |
||||||
|
|
||||||
|
address { |
||||||
|
margin-bottom: 1rem; |
||||||
|
font-style: normal; |
||||||
|
line-height: inherit; |
||||||
|
} |
||||||
|
|
||||||
|
ol, |
||||||
|
ul, |
||||||
|
dl { |
||||||
|
margin-top: 0; |
||||||
|
margin-bottom: 1rem; |
||||||
|
} |
||||||
|
|
||||||
|
ol ol, |
||||||
|
ul ul, |
||||||
|
ol ul, |
||||||
|
ul ol { |
||||||
|
margin-bottom: 0; |
||||||
|
} |
||||||
|
|
||||||
|
dt { |
||||||
|
font-weight: bold; |
||||||
|
} |
||||||
|
|
||||||
|
dd { |
||||||
|
margin-bottom: .5rem; |
||||||
|
margin-left: 0; |
||||||
|
} |
||||||
|
|
||||||
|
blockquote { |
||||||
|
margin: 0 0 1rem; |
||||||
|
} |
||||||
|
|
||||||
|
dfn { |
||||||
|
font-style: italic; |
||||||
|
} |
||||||
|
|
||||||
|
b, |
||||||
|
strong { |
||||||
|
font-weight: bolder; |
||||||
|
} |
||||||
|
|
||||||
|
small { |
||||||
|
font-size: 80%; |
||||||
|
} |
||||||
|
|
||||||
|
sub, |
||||||
|
sup { |
||||||
|
position: relative; |
||||||
|
font-size: 75%; |
||||||
|
line-height: 0; |
||||||
|
vertical-align: baseline; |
||||||
|
} |
||||||
|
|
||||||
|
sub { |
||||||
|
bottom: -.25em; |
||||||
|
} |
||||||
|
|
||||||
|
sup { |
||||||
|
top: -.5em; |
||||||
|
} |
||||||
|
|
||||||
|
a { |
||||||
|
color: #007bff; |
||||||
|
text-decoration: none; |
||||||
|
background-color: transparent; |
||||||
|
-webkit-text-decoration-skip: objects; |
||||||
|
} |
||||||
|
|
||||||
|
a:hover { |
||||||
|
color: #0056b3; |
||||||
|
text-decoration: underline; |
||||||
|
} |
||||||
|
|
||||||
|
a:not([href]):not([tabindex]) { |
||||||
|
color: inherit; |
||||||
|
text-decoration: none; |
||||||
|
} |
||||||
|
|
||||||
|
a:not([href]):not([tabindex]):focus, a:not([href]):not([tabindex]):hover { |
||||||
|
color: inherit; |
||||||
|
text-decoration: none; |
||||||
|
} |
||||||
|
|
||||||
|
a:not([href]):not([tabindex]):focus { |
||||||
|
outline: 0; |
||||||
|
} |
||||||
|
|
||||||
|
pre, |
||||||
|
code, |
||||||
|
kbd, |
||||||
|
samp { |
||||||
|
font-family: monospace, monospace; |
||||||
|
font-size: 1em; |
||||||
|
} |
||||||
|
|
||||||
|
pre { |
||||||
|
margin-top: 0; |
||||||
|
margin-bottom: 1rem; |
||||||
|
overflow: auto; |
||||||
|
} |
||||||
|
|
||||||
|
figure { |
||||||
|
margin: 0 0 1rem; |
||||||
|
} |
||||||
|
|
||||||
|
img { |
||||||
|
vertical-align: middle; |
||||||
|
border-style: none; |
||||||
|
} |
||||||
|
|
||||||
|
svg:not(:root) { |
||||||
|
overflow: hidden; |
||||||
|
} |
||||||
|
|
||||||
|
a, |
||||||
|
area, |
||||||
|
button, |
||||||
|
[role="button"], |
||||||
|
input, |
||||||
|
label, |
||||||
|
select, |
||||||
|
summary, |
||||||
|
textarea { |
||||||
|
-ms-touch-action: manipulation; |
||||||
|
touch-action: manipulation; |
||||||
|
} |
||||||
|
|
||||||
|
table { |
||||||
|
border-collapse: collapse; |
||||||
|
} |
||||||
|
|
||||||
|
caption { |
||||||
|
padding-top: 0.75rem; |
||||||
|
padding-bottom: 0.75rem; |
||||||
|
color: #868e96; |
||||||
|
text-align: left; |
||||||
|
caption-side: bottom; |
||||||
|
} |
||||||
|
|
||||||
|
th { |
||||||
|
text-align: left; |
||||||
|
} |
||||||
|
|
||||||
|
label { |
||||||
|
display: inline-block; |
||||||
|
margin-bottom: .5rem; |
||||||
|
} |
||||||
|
|
||||||
|
button:focus { |
||||||
|
outline: 1px dotted; |
||||||
|
outline: 5px auto -webkit-focus-ring-color; |
||||||
|
} |
||||||
|
|
||||||
|
input, |
||||||
|
button, |
||||||
|
select, |
||||||
|
optgroup, |
||||||
|
textarea { |
||||||
|
margin: 0; |
||||||
|
font-family: inherit; |
||||||
|
font-size: inherit; |
||||||
|
line-height: inherit; |
||||||
|
} |
||||||
|
|
||||||
|
button, |
||||||
|
input { |
||||||
|
overflow: visible; |
||||||
|
} |
||||||
|
|
||||||
|
button, |
||||||
|
select { |
||||||
|
text-transform: none; |
||||||
|
} |
||||||
|
|
||||||
|
button, |
||||||
|
html [type="button"], |
||||||
|
[type="reset"], |
||||||
|
[type="submit"] { |
||||||
|
-webkit-appearance: button; |
||||||
|
} |
||||||
|
|
||||||
|
button::-moz-focus-inner, |
||||||
|
[type="button"]::-moz-focus-inner, |
||||||
|
[type="reset"]::-moz-focus-inner, |
||||||
|
[type="submit"]::-moz-focus-inner { |
||||||
|
padding: 0; |
||||||
|
border-style: none; |
||||||
|
} |
||||||
|
|
||||||
|
input[type="radio"], |
||||||
|
input[type="checkbox"] { |
||||||
|
box-sizing: border-box; |
||||||
|
padding: 0; |
||||||
|
} |
||||||
|
|
||||||
|
input[type="date"], |
||||||
|
input[type="time"], |
||||||
|
input[type="datetime-local"], |
||||||
|
input[type="month"] { |
||||||
|
-webkit-appearance: listbox; |
||||||
|
} |
||||||
|
|
||||||
|
textarea { |
||||||
|
overflow: auto; |
||||||
|
resize: vertical; |
||||||
|
} |
||||||
|
|
||||||
|
fieldset { |
||||||
|
min-width: 0; |
||||||
|
padding: 0; |
||||||
|
margin: 0; |
||||||
|
border: 0; |
||||||
|
} |
||||||
|
|
||||||
|
legend { |
||||||
|
display: block; |
||||||
|
width: 100%; |
||||||
|
max-width: 100%; |
||||||
|
padding: 0; |
||||||
|
margin-bottom: .5rem; |
||||||
|
font-size: 1.5rem; |
||||||
|
line-height: inherit; |
||||||
|
color: inherit; |
||||||
|
white-space: normal; |
||||||
|
} |
||||||
|
|
||||||
|
progress { |
||||||
|
vertical-align: baseline; |
||||||
|
} |
||||||
|
|
||||||
|
[type="number"]::-webkit-inner-spin-button, |
||||||
|
[type="number"]::-webkit-outer-spin-button { |
||||||
|
height: auto; |
||||||
|
} |
||||||
|
|
||||||
|
[type="search"] { |
||||||
|
outline-offset: -2px; |
||||||
|
-webkit-appearance: none; |
||||||
|
} |
||||||
|
|
||||||
|
[type="search"]::-webkit-search-cancel-button, |
||||||
|
[type="search"]::-webkit-search-decoration { |
||||||
|
-webkit-appearance: none; |
||||||
|
} |
||||||
|
|
||||||
|
::-webkit-file-upload-button { |
||||||
|
font: inherit; |
||||||
|
-webkit-appearance: button; |
||||||
|
} |
||||||
|
|
||||||
|
output { |
||||||
|
display: inline-block; |
||||||
|
} |
||||||
|
|
||||||
|
summary { |
||||||
|
display: list-item; |
||||||
|
} |
||||||
|
|
||||||
|
template { |
||||||
|
display: none; |
||||||
|
} |
||||||
|
|
||||||
|
[hidden] { |
||||||
|
display: none !important; |
||||||
|
} |
||||||
|
/*# sourceMappingURL=bootstrap-reboot.css.map */ |
||||||
@ -0,0 +1,2 @@ |
|||||||
|
html{box-sizing:border-box;font-family:sans-serif;line-height:1.15;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;-ms-overflow-style:scrollbar;-webkit-tap-highlight-color:transparent}*,::after,::before{box-sizing:inherit}@-ms-viewport{width:device-width}article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:1rem;font-weight:400;line-height:1.5;color:#212529;background-color:#fff}[tabindex="-1"]:focus{outline:0!important}hr{box-sizing:content-box;height:0;overflow:visible}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.5rem}p{margin-top:0;margin-bottom:1rem}abbr[data-original-title],abbr[title]{text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;cursor:help;border-bottom:0}address{margin-bottom:1rem;font-style:normal;line-height:inherit}dl,ol,ul{margin-top:0;margin-bottom:1rem}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-left:0}blockquote{margin:0 0 1rem}dfn{font-style:italic}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}a{color:#007bff;text-decoration:none;background-color:transparent;-webkit-text-decoration-skip:objects}a:hover{color:#0056b3;text-decoration:underline}a:not([href]):not([tabindex]){color:inherit;text-decoration:none}a:not([href]):not([tabindex]):focus,a:not([href]):not([tabindex]):hover{color:inherit;text-decoration:none}a:not([href]):not([tabindex]):focus{outline:0}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}pre{margin-top:0;margin-bottom:1rem;overflow:auto}figure{margin:0 0 1rem}img{vertical-align:middle;border-style:none}svg:not(:root){overflow:hidden}[role=button],a,area,button,input,label,select,summary,textarea{-ms-touch-action:manipulation;touch-action:manipulation}table{border-collapse:collapse}caption{padding-top:.75rem;padding-bottom:.75rem;color:#868e96;text-align:left;caption-side:bottom}th{text-align:left}label{display:inline-block;margin-bottom:.5rem}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{padding:0;border-style:none}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=date],input[type=datetime-local],input[type=month],input[type=time]{-webkit-appearance:listbox}textarea{overflow:auto;resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{display:block;width:100%;max-width:100%;padding:0;margin-bottom:.5rem;font-size:1.5rem;line-height:inherit;color:inherit;white-space:normal}progress{vertical-align:baseline}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{outline-offset:-2px;-webkit-appearance:none}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}output{display:inline-block}summary{display:list-item}template{display:none}[hidden]{display:none!important} |
||||||
|
/*# sourceMappingURL=bootstrap-reboot.min.css.map */ |
||||||
|
Before Width: | Height: | Size: 106 KiB |
|
Before Width: | Height: | Size: 382 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}})}); |
||||||