494 lines
28 KiB
Plaintext
494 lines
28 KiB
Plaintext
doctype html
|
|
html(lang='en')
|
|
|
|
head
|
|
|
|
meta(charset='utf-8')
|
|
meta(name='viewport', content='width=device-width, initial-scale=1, shrink-to-fit=no')
|
|
meta(name='description', content='')
|
|
meta(name='author', content='')
|
|
|
|
title Freelancer - Start Bootstrap Theme
|
|
|
|
// Font Awesome icons (free version)
|
|
script(src='https://use.fontawesome.com/releases/v5.12.1/js/all.js', crossorigin='anonymous')
|
|
|
|
// Google fonts
|
|
link(href='https://fonts.googleapis.com/css?family=Montserrat:400,700', rel='stylesheet', type='text/css')
|
|
link(href='https://fonts.googleapis.com/css?family=Kaushan+Script', rel='stylesheet', type='text/css')
|
|
link(href='https://fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic,700italic', rel='stylesheet', type='text/css')
|
|
link(href='https://fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700', rel='stylesheet', type='text/css')
|
|
|
|
// Core theme CSS (includes Bootstrap)
|
|
link(href='css/styles.css', rel='stylesheet')
|
|
|
|
body#page-top
|
|
|
|
// Navigation
|
|
nav#mainNav.navbar.navbar-expand-lg.navbar-dark.fixed-top
|
|
.container
|
|
a.navbar-brand.js-scroll-trigger(href='#page-top') Start Bootstrap
|
|
button.navbar-toggler.navbar-toggler-right(type='button', data-toggle='collapse', data-target='#navbarResponsive', aria-controls='navbarResponsive', aria-expanded='false', aria-label='Toggle navigation')
|
|
| Menu
|
|
i.fas.fa-bars
|
|
#navbarResponsive.collapse.navbar-collapse
|
|
ul.navbar-nav.text-uppercase.ml-auto
|
|
li.nav-item
|
|
a.nav-link.js-scroll-trigger(href='#services') Services
|
|
li.nav-item
|
|
a.nav-link.js-scroll-trigger(href='#portfolio') Portfolio
|
|
li.nav-item
|
|
a.nav-link.js-scroll-trigger(href='#about') About
|
|
li.nav-item
|
|
a.nav-link.js-scroll-trigger(href='#team') Team
|
|
li.nav-item
|
|
a.nav-link.js-scroll-trigger(href='#contact') Contact
|
|
// Masthead
|
|
|
|
header.masthead
|
|
.container
|
|
.intro-text
|
|
.intro-lead-in Welcome To Our Studio!
|
|
.intro-heading.text-uppercase It's Nice To Meet You
|
|
a.btn.btn-primary.btn-xl.text-uppercase.js-scroll-trigger(href='#services') Tell Me More
|
|
|
|
// Services
|
|
section#services.page-section
|
|
.container
|
|
.row
|
|
.col-lg-12.text-center
|
|
h2.section-heading.text-uppercase Services
|
|
h3.section-subheading.text-muted Lorem ipsum dolor sit amet consectetur.
|
|
.row.text-center
|
|
.col-md-4
|
|
span.fa-stack.fa-4x
|
|
i.fas.fa-circle.fa-stack-2x.text-primary
|
|
i.fas.fa-shopping-cart.fa-stack-1x.fa-inverse
|
|
h4.service-heading E-Commerce
|
|
p.text-muted
|
|
| Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima maxime quam architecto quo inventore harum ex magni, dicta impedit.
|
|
.col-md-4
|
|
span.fa-stack.fa-4x
|
|
i.fas.fa-circle.fa-stack-2x.text-primary
|
|
i.fas.fa-laptop.fa-stack-1x.fa-inverse
|
|
h4.service-heading Responsive Design
|
|
p.text-muted
|
|
| Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima maxime quam architecto quo inventore harum ex magni, dicta impedit.
|
|
.col-md-4
|
|
span.fa-stack.fa-4x
|
|
i.fas.fa-circle.fa-stack-2x.text-primary
|
|
i.fas.fa-lock.fa-stack-1x.fa-inverse
|
|
h4.service-heading Web Security
|
|
p.text-muted
|
|
| Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima maxime quam architecto quo inventore harum ex magni, dicta impedit.
|
|
|
|
// Portfolio Grid
|
|
section#portfolio.bg-light.page-section
|
|
.container
|
|
.row
|
|
.col-lg-12.text-center
|
|
h2.section-heading.text-uppercase Portfolio
|
|
h3.section-subheading.text-muted Lorem ipsum dolor sit amet consectetur.
|
|
.row
|
|
.col-md-4.col-sm-6.portfolio-item
|
|
a.portfolio-link(data-toggle='modal', href='#portfolioModal1')
|
|
.portfolio-hover
|
|
.portfolio-hover-content
|
|
i.fas.fa-plus.fa-3x
|
|
img.img-fluid(src='assets/img/portfolio/01-thumbnail.jpg', alt='')
|
|
.portfolio-caption
|
|
h4 Threads
|
|
p.text-muted Illustration
|
|
.col-md-4.col-sm-6.portfolio-item
|
|
a.portfolio-link(data-toggle='modal', href='#portfolioModal2')
|
|
.portfolio-hover
|
|
.portfolio-hover-content
|
|
i.fas.fa-plus.fa-3x
|
|
img.img-fluid(src='assets/img/portfolio/02-thumbnail.jpg', alt='')
|
|
.portfolio-caption
|
|
h4 Explore
|
|
p.text-muted Graphic Design
|
|
.col-md-4.col-sm-6.portfolio-item
|
|
a.portfolio-link(data-toggle='modal', href='#portfolioModal3')
|
|
.portfolio-hover
|
|
.portfolio-hover-content
|
|
i.fas.fa-plus.fa-3x
|
|
img.img-fluid(src='assets/img/portfolio/03-thumbnail.jpg', alt='')
|
|
.portfolio-caption
|
|
h4 Finish
|
|
p.text-muted Identity
|
|
.col-md-4.col-sm-6.portfolio-item
|
|
a.portfolio-link(data-toggle='modal', href='#portfolioModal4')
|
|
.portfolio-hover
|
|
.portfolio-hover-content
|
|
i.fas.fa-plus.fa-3x
|
|
img.img-fluid(src='assets/img/portfolio/04-thumbnail.jpg', alt='')
|
|
.portfolio-caption
|
|
h4 Lines
|
|
p.text-muted Branding
|
|
.col-md-4.col-sm-6.portfolio-item
|
|
a.portfolio-link(data-toggle='modal', href='#portfolioModal5')
|
|
.portfolio-hover
|
|
.portfolio-hover-content
|
|
i.fas.fa-plus.fa-3x
|
|
img.img-fluid(src='assets/img/portfolio/05-thumbnail.jpg', alt='')
|
|
.portfolio-caption
|
|
h4 Southwest
|
|
p.text-muted Website Design
|
|
.col-md-4.col-sm-6.portfolio-item
|
|
a.portfolio-link(data-toggle='modal', href='#portfolioModal6')
|
|
.portfolio-hover
|
|
.portfolio-hover-content
|
|
i.fas.fa-plus.fa-3x
|
|
img.img-fluid(src='assets/img/portfolio/06-thumbnail.jpg', alt='')
|
|
.portfolio-caption
|
|
h4 Window
|
|
p.text-muted Photography
|
|
|
|
// About
|
|
section#about.page-section
|
|
.container
|
|
.row
|
|
.col-lg-12.text-center
|
|
h2.section-heading.text-uppercase About
|
|
h3.section-subheading.text-muted Lorem ipsum dolor sit amet consectetur.
|
|
.row
|
|
.col-lg-12
|
|
ul.timeline
|
|
li
|
|
.timeline-image
|
|
img.rounded-circle.img-fluid(src='assets/img/about/1.jpg', alt='')
|
|
.timeline-panel
|
|
.timeline-heading
|
|
h4 2009-2011
|
|
h4.subheading Our Humble Beginnings
|
|
.timeline-body
|
|
p.text-muted
|
|
| Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt ut voluptatum eius sapiente, totam reiciendis temporibus qui quibusdam, recusandae sit vero unde, sed, incidunt et ea quo dolore laudantium consectetur!
|
|
li.timeline-inverted
|
|
.timeline-image
|
|
img.rounded-circle.img-fluid(src='assets/img/about/2.jpg', alt='')
|
|
.timeline-panel
|
|
.timeline-heading
|
|
h4 March 2011
|
|
h4.subheading An Agency is Born
|
|
.timeline-body
|
|
p.text-muted
|
|
| Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt ut voluptatum eius sapiente, totam reiciendis temporibus qui quibusdam, recusandae sit vero unde, sed, incidunt et ea quo dolore laudantium consectetur!
|
|
li
|
|
.timeline-image
|
|
img.rounded-circle.img-fluid(src='assets/img/about/3.jpg', alt='')
|
|
.timeline-panel
|
|
.timeline-heading
|
|
h4 December 2012
|
|
h4.subheading Transition to Full Service
|
|
.timeline-body
|
|
p.text-muted
|
|
| Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt ut voluptatum eius sapiente, totam reiciendis temporibus qui quibusdam, recusandae sit vero unde, sed, incidunt et ea quo dolore laudantium consectetur!
|
|
li.timeline-inverted
|
|
.timeline-image
|
|
img.rounded-circle.img-fluid(src='assets/img/about/4.jpg', alt='')
|
|
.timeline-panel
|
|
.timeline-heading
|
|
h4 July 2014
|
|
h4.subheading Phase Two Expansion
|
|
.timeline-body
|
|
p.text-muted
|
|
| Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt ut voluptatum eius sapiente, totam reiciendis temporibus qui quibusdam, recusandae sit vero unde, sed, incidunt et ea quo dolore laudantium consectetur!
|
|
li.timeline-inverted
|
|
.timeline-image
|
|
h4
|
|
| Be Part
|
|
br
|
|
| Of Our
|
|
br
|
|
| Story!
|
|
|
|
// Team
|
|
section#team.bg-light.page-section
|
|
.container
|
|
.row
|
|
.col-lg-12.text-center
|
|
h2.section-heading.text-uppercase Our Amazing Team
|
|
h3.section-subheading.text-muted Lorem ipsum dolor sit amet consectetur.
|
|
.row
|
|
.col-sm-4
|
|
.team-member
|
|
img.mx-auto.rounded-circle(src='assets/img/team/1.jpg', alt='')
|
|
h4 Kay Garland
|
|
p.text-muted Lead Designer
|
|
ul.list-inline.social-buttons
|
|
li.list-inline-item
|
|
a(href='#')
|
|
i.fab.fa-twitter
|
|
li.list-inline-item
|
|
a(href='#')
|
|
i.fab.fa-facebook-f
|
|
li.list-inline-item
|
|
a(href='#')
|
|
i.fab.fa-linkedin-in
|
|
.col-sm-4
|
|
.team-member
|
|
img.mx-auto.rounded-circle(src='assets/img/team/2.jpg', alt='')
|
|
h4 Larry Parker
|
|
p.text-muted Lead Marketer
|
|
ul.list-inline.social-buttons
|
|
li.list-inline-item
|
|
a(href='#')
|
|
i.fab.fa-twitter
|
|
li.list-inline-item
|
|
a(href='#')
|
|
i.fab.fa-facebook-f
|
|
li.list-inline-item
|
|
a(href='#')
|
|
i.fab.fa-linkedin-in
|
|
.col-sm-4
|
|
.team-member
|
|
img.mx-auto.rounded-circle(src='assets/img/team/3.jpg', alt='')
|
|
h4 Diana Pertersen
|
|
p.text-muted Lead Developer
|
|
ul.list-inline.social-buttons
|
|
li.list-inline-item
|
|
a(href='#')
|
|
i.fab.fa-twitter
|
|
li.list-inline-item
|
|
a(href='#')
|
|
i.fab.fa-facebook-f
|
|
li.list-inline-item
|
|
a(href='#')
|
|
i.fab.fa-linkedin-in
|
|
.row
|
|
.col-lg-8.mx-auto.text-center
|
|
p.large.text-muted
|
|
| Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aut eaque, laboriosam veritatis, quos non quis ad perspiciatis, totam corporis ea, alias ut unde.
|
|
|
|
// Clients
|
|
section.py-5
|
|
.container
|
|
.row
|
|
.col-md-3.col-sm-6
|
|
a(href='#')
|
|
img.img-fluid.d-block.mx-auto(src='assets/img/logos/envato.jpg', alt='')
|
|
.col-md-3.col-sm-6
|
|
a(href='#')
|
|
img.img-fluid.d-block.mx-auto(src='assets/img/logos/designmodo.jpg', alt='')
|
|
.col-md-3.col-sm-6
|
|
a(href='#')
|
|
img.img-fluid.d-block.mx-auto(src='assets/img/logos/themeforest.jpg', alt='')
|
|
.col-md-3.col-sm-6
|
|
a(href='#')
|
|
img.img-fluid.d-block.mx-auto(src='assets/img/logos/creative-market.jpg', alt='')
|
|
|
|
// Contact
|
|
section#contact.page-section
|
|
.container
|
|
.row
|
|
.col-lg-12.text-center
|
|
h2.section-heading.text-uppercase Contact Us
|
|
h3.section-subheading.text-muted Lorem ipsum dolor sit amet consectetur.
|
|
.row
|
|
.col-lg-12
|
|
form#contactForm(name='sentMessage', novalidate='novalidate')
|
|
.row
|
|
.col-md-6
|
|
.form-group
|
|
input#name.form-control(type='text', placeholder='Your Name *', required='required', data-validation-required-message='Please enter your name.')
|
|
p.help-block.text-danger
|
|
.form-group
|
|
input#email.form-control(type='email', placeholder='Your Email *', required='required', data-validation-required-message='Please enter your email address.')
|
|
p.help-block.text-danger
|
|
.form-group
|
|
input#phone.form-control(type='tel', placeholder='Your Phone *', required='required', data-validation-required-message='Please enter your phone number.')
|
|
p.help-block.text-danger
|
|
.col-md-6
|
|
.form-group
|
|
textarea#message.form-control(placeholder='Your Message *', required='required', data-validation-required-message='Please enter a message.')
|
|
p.help-block.text-danger
|
|
.clearfix
|
|
.col-lg-12.text-center
|
|
#success
|
|
button#sendMessageButton.btn.btn-primary.btn-xl.text-uppercase(type='submit') Send Message
|
|
|
|
// Footer
|
|
footer.footer
|
|
.container
|
|
.row.align-items-center
|
|
.col-md-4
|
|
span.copyright Copyright © Your Website 2019
|
|
.col-md-4
|
|
ul.list-inline.social-buttons
|
|
li.list-inline-item
|
|
a(href='#')
|
|
i.fab.fa-twitter
|
|
li.list-inline-item
|
|
a(href='#')
|
|
i.fab.fa-facebook-f
|
|
li.list-inline-item
|
|
a(href='#')
|
|
i.fab.fa-linkedin-in
|
|
.col-md-4
|
|
ul.list-inline.quicklinks
|
|
li.list-inline-item
|
|
a(href='#') Privacy Policy
|
|
li.list-inline-item
|
|
a(href='#') Terms of Use
|
|
|
|
// Portfolio Modals
|
|
// Modal 1
|
|
#portfolioModal1.portfolio-modal.modal.fade(tabindex='-1', role='dialog', aria-hidden='true')
|
|
.modal-dialog
|
|
.modal-content
|
|
.close-modal(data-dismiss='modal')
|
|
.lr
|
|
.rl
|
|
.container
|
|
.row
|
|
.col-lg-8.mx-auto
|
|
.modal-body
|
|
// Project Details Go Here
|
|
h2.text-uppercase Project Name
|
|
p.item-intro.text-muted Lorem ipsum dolor sit amet consectetur.
|
|
img.img-fluid.d-block.mx-auto(src='assets/img/portfolio/01-full.jpg', alt='')
|
|
p
|
|
| Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!
|
|
ul.list-inline
|
|
li Date: January 2017
|
|
li Client: Threads
|
|
li Category: Illustration
|
|
button.btn.btn-primary(data-dismiss='modal', type='button')
|
|
i.fas.fa-times
|
|
| Close Project
|
|
// Modal 2
|
|
#portfolioModal2.portfolio-modal.modal.fade(tabindex='-1', role='dialog', aria-hidden='true')
|
|
.modal-dialog
|
|
.modal-content
|
|
.close-modal(data-dismiss='modal')
|
|
.lr
|
|
.rl
|
|
.container
|
|
.row
|
|
.col-lg-8.mx-auto
|
|
.modal-body
|
|
// Project Details Go Here
|
|
h2.text-uppercase Project Name
|
|
p.item-intro.text-muted Lorem ipsum dolor sit amet consectetur.
|
|
img.img-fluid.d-block.mx-auto(src='assets/img/portfolio/02-full.jpg', alt='')
|
|
p
|
|
| Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!
|
|
ul.list-inline
|
|
li Date: January 2017
|
|
li Client: Explore
|
|
li Category: Graphic Design
|
|
button.btn.btn-primary(data-dismiss='modal', type='button')
|
|
i.fas.fa-times
|
|
| Close Project
|
|
// Modal 3
|
|
#portfolioModal3.portfolio-modal.modal.fade(tabindex='-1', role='dialog', aria-hidden='true')
|
|
.modal-dialog
|
|
.modal-content
|
|
.close-modal(data-dismiss='modal')
|
|
.lr
|
|
.rl
|
|
.container
|
|
.row
|
|
.col-lg-8.mx-auto
|
|
.modal-body
|
|
// Project Details Go Here
|
|
h2.text-uppercase Project Name
|
|
p.item-intro.text-muted Lorem ipsum dolor sit amet consectetur.
|
|
img.img-fluid.d-block.mx-auto(src='assets/img/portfolio/03-full.jpg', alt='')
|
|
p
|
|
| Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!
|
|
ul.list-inline
|
|
li Date: January 2017
|
|
li Client: Finish
|
|
li Category: Identity
|
|
button.btn.btn-primary(data-dismiss='modal', type='button')
|
|
i.fas.fa-times
|
|
| Close Project
|
|
// Modal 4
|
|
#portfolioModal4.portfolio-modal.modal.fade(tabindex='-1', role='dialog', aria-hidden='true')
|
|
.modal-dialog
|
|
.modal-content
|
|
.close-modal(data-dismiss='modal')
|
|
.lr
|
|
.rl
|
|
.container
|
|
.row
|
|
.col-lg-8.mx-auto
|
|
.modal-body
|
|
// Project Details Go Here
|
|
h2.text-uppercase Project Name
|
|
p.item-intro.text-muted Lorem ipsum dolor sit amet consectetur.
|
|
img.img-fluid.d-block.mx-auto(src='assets/img/portfolio/04-full.jpg', alt='')
|
|
p
|
|
| Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!
|
|
ul.list-inline
|
|
li Date: January 2017
|
|
li Client: Lines
|
|
li Category: Branding
|
|
button.btn.btn-primary(data-dismiss='modal', type='button')
|
|
i.fas.fa-times
|
|
| Close Project
|
|
// Modal 5
|
|
#portfolioModal5.portfolio-modal.modal.fade(tabindex='-1', role='dialog', aria-hidden='true')
|
|
.modal-dialog
|
|
.modal-content
|
|
.close-modal(data-dismiss='modal')
|
|
.lr
|
|
.rl
|
|
.container
|
|
.row
|
|
.col-lg-8.mx-auto
|
|
.modal-body
|
|
// Project Details Go Here
|
|
h2.text-uppercase Project Name
|
|
p.item-intro.text-muted Lorem ipsum dolor sit amet consectetur.
|
|
img.img-fluid.d-block.mx-auto(src='assets/img/portfolio/05-full.jpg', alt='')
|
|
p
|
|
| Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!
|
|
ul.list-inline
|
|
li Date: January 2017
|
|
li Client: Southwest
|
|
li Category: Website Design
|
|
button.btn.btn-primary(data-dismiss='modal', type='button')
|
|
i.fas.fa-times
|
|
| Close Project
|
|
// Modal 6
|
|
#portfolioModal6.portfolio-modal.modal.fade(tabindex='-1', role='dialog', aria-hidden='true')
|
|
.modal-dialog
|
|
.modal-content
|
|
.close-modal(data-dismiss='modal')
|
|
.lr
|
|
.rl
|
|
.container
|
|
.row
|
|
.col-lg-8.mx-auto
|
|
.modal-body
|
|
// Project Details Go Here
|
|
h2.text-uppercase Project Name
|
|
p.item-intro.text-muted Lorem ipsum dolor sit amet consectetur.
|
|
img.img-fluid.d-block.mx-auto(src='assets/img/portfolio/06-full.jpg', alt='')
|
|
p
|
|
| Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!
|
|
ul.list-inline
|
|
li Date: January 2017
|
|
li Client: Window
|
|
li Category: Photography
|
|
button.btn.btn-primary(data-dismiss='modal', type='button')
|
|
i.fas.fa-times
|
|
| Close Project
|
|
|
|
// Bootstrap core JS
|
|
script(src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js')
|
|
script(src='https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js')
|
|
|
|
// Third party plugin JS
|
|
script(src='https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.min.js')
|
|
|
|
// Contact form JS
|
|
script(src='assets/mail/jqBootstrapValidation.js')
|
|
script(src='assets/mail/contact_me.js')
|
|
|
|
// Core theme JS
|
|
script(src='js/scripts.js') |