dennis/Website-Templates
1
0
Fork 0
mirror of https://github.com/dawidolko/Website-Templates.git synced 2025-10-27 07:53:11 +01:00
Code Issues Packages Projects Releases Wiki Activity
Website-Templates/reveal/index.html
Dawid Olko 0d2d73a034 Website templates
2023-07-26 19:33:39 +02:00

605 lines
25 KiB
HTML
Raw Permalink Blame History

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Reveal Bootstrap Template</title>
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<meta content="" name="keywords">
<meta content="" name="description">
<!-- Favicons -->
<link href="img/favicon.png" rel="icon">
<link href="img/apple-touch-icon.png" rel="apple-touch-icon">
<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i|Raleway:300,400,500,700,800|Montserrat:300,400,700" rel="stylesheet">
<!-- Bootstrap CSS File -->
<link href="lib/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Libraries CSS Files -->
<link href="lib/font-awesome/css/font-awesome.min.css" rel="stylesheet">
<link href="lib/animate/animate.min.css" rel="stylesheet">
<link href="lib/ionicons/css/ionicons.min.css" rel="stylesheet">
<link href="lib/owlcarousel/assets/owl.carousel.min.css" rel="stylesheet">
<link href="lib/magnific-popup/magnific-popup.css" rel="stylesheet">
<link href="lib/ionicons/css/ionicons.min.css" rel="stylesheet">
<!-- Main Stylesheet File -->
<link href="css/style.css" rel="stylesheet">
<!-- =======================================================
Theme Name: Reveal
Theme URL: https://bootstrapmade.com/reveal-bootstrap-corporate-template/
Author: BootstrapMade.com
License: https://bootstrapmade.com/license/
======================================================= -->
</head>
<body id="body">
<!--==========================
Top Bar
============================-->
<section id="topbar" class="d-none d-lg-block">
<div class="container clearfix">
<div class="contact-info float-left">
<i class="fa fa-envelope-o"></i> <a href="mailto:contact@example.com">contact@example.com</a>
<i class="fa fa-phone"></i> +1 5589 55488 55
</div>
<div class="social-links float-right">
<a href="#" class="twitter"><i class="fa fa-twitter"></i></a>
<a href="#" class="facebook"><i class="fa fa-facebook"></i></a>
<a href="#" class="instagram"><i class="fa fa-instagram"></i></a>
<a href="#" class="google-plus"><i class="fa fa-google-plus"></i></a>
<a href="#" class="linkedin"><i class="fa fa-linkedin"></i></a>
</div>
</div>
</section>
<!--==========================
Header
============================-->
<header id="header">
<div class="container">
<div id="logo" class="pull-left">
<h1><a href="#body" class="scrollto">Reve<span>al</span></a></h1>
<!-- Uncomment below if you prefer to use an image logo -->
<!-- <a href="#body"><img src="img/logo.png" alt="" title="" /></a>-->
</div>
<nav id="nav-menu-container">
<ul class="nav-menu">
<li class="menu-active"><a href="#body">Home</a></li>
<li><a href="#about">About Us</a></li>
<li><a href="#services">Services</a></li>
<li><a href="#portfolio">Portfolio</a></li>
<li><a href="#team">Team</a></li>
<li class="menu-has-children"><a href="">Drop Down</a>
<ul>
<li><a href="#">Drop Down 1</a></li>
<li><a href="#">Drop Down 3</a></li>
<li><a href="#">Drop Down 4</a></li>
<li><a href="#">Drop Down 5</a></li>
</ul>
</li>
<li><a href="#contact">Contact</a></li>
</ul>
</nav><!-- #nav-menu-container -->
</div>
</header><!-- #header -->
<!--==========================
Intro Section
============================-->
<section id="intro">
<div class="intro-content">
<h2>Making <span>your ideas</span><br>happen!</h2>
<div>
<a href="#about" class="btn-get-started scrollto">Get Started</a>
<a href="#portfolio" class="btn-projects scrollto">Our Projects</a>
</div>
</div>
<div id="intro-carousel" class="owl-carousel" >
<div class="item" style="background-image: url('img/intro-carousel/1.jpg');"></div>
<div class="item" style="background-image: url('img/intro-carousel/2.jpg');"></div>
<div class="item" style="background-image: url('img/intro-carousel/3.jpg');"></div>
<div class="item" style="background-image: url('img/intro-carousel/4.jpg');"></div>
<div class="item" style="background-image: url('img/intro-carousel/5.jpg');"></div>
</div>
</section><!-- #intro -->
<main id="main">
<!--==========================
About Section
============================-->
<section id="about" class="wow fadeInUp">
<div class="container">
<div class="row">
<div class="col-lg-6 about-img">
<img src="img/about-img.jpg" alt="">
</div>
<div class="col-lg-6 content">
<h2>Lorem ipsum dolor sit amet, consectetur adipiscing</h2>
<h3>Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</h3>
<ul>
<li><i class="ion-android-checkmark-circle"></i> Ullamco laboris nisi ut aliquip ex ea commodo consequat.</li>
<li><i class="ion-android-checkmark-circle"></i> Duis aute irure dolor in reprehenderit in voluptate velit.</li>
<li><i class="ion-android-checkmark-circle"></i> Ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate trideta storacalaperda mastiro dolore eu fugiat nulla pariatur.</li>
</ul>
</div>
</div>
</div>
</section><!-- #about -->
<!--==========================
Services Section
============================-->
<section id="services">
<div class="container">
<div class="section-header">
<h2>Services</h2>
<p>Sed tamen tempor magna labore dolore dolor sint tempor duis magna elit veniam aliqua esse amet veniam enim export quid quid veniam aliqua eram noster malis nulla duis fugiat culpa esse aute nulla ipsum velit export irure minim illum fore</p>
</div>
<div class="row">
<div class="col-lg-6">
<div class="box wow fadeInLeft">
<div class="icon"><i class="fa fa-bar-chart"></i></div>
<h4 class="title"><a href="">Lorem Ipsum</a></h4>
<p class="description">Voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident etiro rabeta lingo.</p>
</div>
</div>
<div class="col-lg-6">
<div class="box wow fadeInRight">
<div class="icon"><i class="fa fa-picture-o"></i></div>
<h4 class="title"><a href="">Dolor Sitema</a></h4>
<p class="description">Minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat tarad limino ata nodera clas.</p>
</div>
</div>
<div class="col-lg-6">
<div class="box wow fadeInLeft" data-wow-delay="0.2s">
<div class="icon"><i class="fa fa-shopping-bag"></i></div>
<h4 class="title"><a href="">Sed ut perspiciatis</a></h4>
<p class="description">Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur trinige zareta lobur trade.</p>
</div>
</div>
<div class="col-lg-6">
<div class="box wow fadeInRight" data-wow-delay="0.2s">
<div class="icon"><i class="fa fa-map"></i></div>
<h4 class="title"><a href="">Magni Dolores</a></h4>
<p class="description">Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum rideta zanox satirente madera</p>
</div>
</div>
</div>
</div>
</section><!-- #services -->
<!--==========================
Clients Section
============================-->
<section id="clients" class="wow fadeInUp">
<div class="container">
<div class="section-header">
<h2>Clients</h2>
<p>Sed tamen tempor magna labore dolore dolor sint tempor duis magna elit veniam aliqua esse amet veniam enim export quid quid veniam aliqua eram noster malis nulla duis fugiat culpa esse aute nulla ipsum velit export irure minim illum fore</p>
</div>
<div class="owl-carousel clients-carousel">
<img src="img/clients/client-1.png" alt="">
<img src="img/clients/client-2.png" alt="">
<img src="img/clients/client-3.png" alt="">
<img src="img/clients/client-4.png" alt="">
<img src="img/clients/client-5.png" alt="">
<img src="img/clients/client-6.png" alt="">
<img src="img/clients/client-7.png" alt="">
<img src="img/clients/client-8.png" alt="">
</div>
</div>
</section><!-- #clients -->
<!--==========================
Our Portfolio Section
============================-->
<section id="portfolio" class="wow fadeInUp">
<div class="container">
<div class="section-header">
<h2>Our Portfolio</h2>
<p>Sed tamen tempor magna labore dolore dolor sint tempor duis magna elit veniam aliqua esse amet veniam enim export quid quid veniam aliqua eram noster malis nulla duis fugiat culpa esse aute nulla ipsum velit export irure minim illum fore</p>
</div>
</div>
<div class="container-fluid">
<div class="row no-gutters">
<div class="col-lg-3 col-md-4">
<div class="portfolio-item wow fadeInUp">
<a href="img/portfolio/1.jpg" class="portfolio-popup">
<img src="img/portfolio/1.jpg" alt="">
<div class="portfolio-overlay">
<div class="portfolio-info"><h2 class="wow fadeInUp">Portfolio Item 1</h2></div>
</div>
</a>
</div>
</div>
<div class="col-lg-3 col-md-4">
<div class="portfolio-item wow fadeInUp">
<a href="img/portfolio/2.jpg" class="portfolio-popup">
<img src="img/portfolio/2.jpg" alt="">
<div class="portfolio-overlay">
<div class="portfolio-info"><h2 class="wow fadeInUp">Portfolio Item 2</h2></div>
</div>
</a>
</div>
</div>
<div class="col-lg-3 col-md-4">
<div class="portfolio-item wow fadeInUp">
<a href="img/portfolio/3.jpg" class="portfolio-popup">
<img src="img/portfolio/3.jpg" alt="">
<div class="portfolio-overlay">
<div class="portfolio-info"><h2 class="wow fadeInUp">Portfolio Item 3</h2></div>
</div>
</a>
</div>
</div>
<div class="col-lg-3 col-md-4">
<div class="portfolio-item wow fadeInUp">
<a href="img/portfolio/4.jpg" class="portfolio-popup">
<img src="img/portfolio/4.jpg" alt="">
<div class="portfolio-overlay">
<div class="portfolio-info"><h2 class="wow fadeInUp">Portfolio Item 4</h2></div>
</div>
</a>
</div>
</div>
<div class="col-lg-3 col-md-4">
<div class="portfolio-item wow fadeInUp">
<a href="img/portfolio/5.jpg" class="portfolio-popup">
<img src="img/portfolio/5.jpg" alt="">
<div class="portfolio-overlay">
<div class="portfolio-info"><h2 class="wow fadeInUp">Portfolio Item 5</h2></div>
</div>
</a>
</div>
</div>
<div class="col-lg-3 col-md-4">
<div class="portfolio-item wow fadeInUp">
<a href="img/portfolio/6.jpg" class="portfolio-popup">
<img src="img/portfolio/6.jpg" alt="">
<div class="portfolio-overlay">
<div class="portfolio-info"><h2 class="wow fadeInUp">Portfolio Item 6</h2></div>
</div>
</a>
</div>
</div>
<div class="col-lg-3 col-md-4">
<div class="portfolio-item wow fadeInUp">
<a href="img/portfolio/7.jpg" class="portfolio-popup">
<img src="img/portfolio/7.jpg" alt="">
<div class="portfolio-overlay">
<div class="portfolio-info"><h2 class="wow fadeInUp">Portfolio Item 7</h2></div>
</div>
</a>
</div>
</div>
<div class="col-lg-3 col-md-4">
<div class="portfolio-item wow fadeInUp">
<a href="img/portfolio/8.jpg" class="portfolio-popup">
<img src="img/portfolio/8.jpg" alt="">
<div class="portfolio-overlay">
<div class="portfolio-info"><h2 class="wow fadeInUp">Portfolio Item 8</h2></div>
</div>
</a>
</div>
</div>
</div>
</div>
</section><!-- #portfolio -->
<!--==========================
Testimonials Section
============================-->
<section id="testimonials" class="wow fadeInUp">
<div class="container">
<div class="section-header">
<h2>Testimonials</h2>
<p>Sed tamen tempor magna labore dolore dolor sint tempor duis magna elit veniam aliqua esse amet veniam enim export quid quid veniam aliqua eram noster malis nulla duis fugiat culpa esse aute nulla ipsum velit export irure minim illum fore</p>
</div>
<div class="owl-carousel testimonials-carousel">
<div class="testimonial-item">
<p>
<img src="img/quote-sign-left.png" class="quote-sign-left" alt="">
Proin iaculis purus consequat sem cure digni ssim donec porttitora entum suscipit rhoncus. Accusantium quam, ultricies eget id, aliquam eget nibh et. Maecen aliquam, risus at semper.
<img src="img/quote-sign-right.png" class="quote-sign-right" alt="">
</p>
<img src="img/testimonial-1.jpg" class="testimonial-img" alt="">
<h3>Saul Goodman</h3>
<h4>Ceo &amp; Founder</h4>
</div>
<div class="testimonial-item">
<p>
<img src="img/quote-sign-left.png" class="quote-sign-left" alt="">
Export tempor illum tamen malis malis eram quae irure esse labore quem cillum quid cillum eram malis quorum velit fore eram velit sunt aliqua noster fugiat irure amet legam anim culpa.
<img src="img/quote-sign-right.png" class="quote-sign-right" alt="">
</p>
<img src="img/testimonial-2.jpg" class="testimonial-img" alt="">
<h3>Sara Wilsson</h3>
<h4>Designer</h4>
</div>
<div class="testimonial-item">
<p>
<img src="img/quote-sign-left.png" class="quote-sign-left" alt="">
Enim nisi quem export duis labore cillum quae magna enim sint quorum nulla quem veniam duis minim tempor labore quem eram duis noster aute amet eram fore quis sint minim.
<img src="img/quote-sign-right.png" class="quote-sign-right" alt="">
</p>
<img src="img/testimonial-3.jpg" class="testimonial-img" alt="">
<h3>Jena Karlis</h3>
<h4>Store Owner</h4>
</div>
<div class="testimonial-item">
<p>
<img src="img/quote-sign-left.png" class="quote-sign-left" alt="">
Fugiat enim eram quae cillum dolore dolor amet nulla culpa multos export minim fugiat minim velit minim dolor enim duis veniam ipsum anim magna sunt elit fore quem dolore labore illum veniam.
<img src="img/quote-sign-right.png" class="quote-sign-right" alt="">
</p>
<img src="img/testimonial-4.jpg" class="testimonial-img" alt="">
<h3>Matt Brandon</h3>
<h4>Freelancer</h4>
</div>
<div class="testimonial-item">
<p>
<img src="img/quote-sign-left.png" class="quote-sign-left" alt="">
Quis quorum aliqua sint quem legam fore sunt eram irure aliqua veniam tempor noster veniam enim culpa labore duis sunt culpa nulla illum cillum fugiat legam esse veniam culpa fore nisi cillum quid.
<img src="img/quote-sign-right.png" class="quote-sign-right" alt="">
</p>
<img src="img/testimonial-5.jpg" class="testimonial-img" alt="">
<h3>John Larson</h3>
<h4>Entrepreneur</h4>
</div>
</div>
</div>
</section><!-- #testimonials -->
<!--==========================
Call To Action Section
============================-->
<section id="call-to-action" class="wow fadeInUp">
<div class="container">
<div class="row">
<div class="col-lg-9 text-center text-lg-left">
<h3 class="cta-title">Call To Action</h3>
<p class="cta-text"> Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>
<div class="col-lg-3 cta-btn-container text-center">
<a class="cta-btn align-middle" href="#">Call To Action</a>
</div>
</div>
</div>
</section><!-- #call-to-action -->
<!--==========================
Our Team Section
============================-->
<section id="team" class="wow fadeInUp">
<div class="container">
<div class="section-header">
<h2>Our Team</h2>
</div>
<div class="row">
<div class="col-lg-3 col-md-6">
<div class="member">
<div class="pic"><img src="img/team-1.jpg" alt=""></div>
<div class="details">
<h4>Walter White</h4>
<span>Chief Executive Officer</span>
<div class="social">
<a href=""><i class="fa fa-twitter"></i></a>
<a href=""><i class="fa fa-facebook"></i></a>
<a href=""><i class="fa fa-google-plus"></i></a>
<a href=""><i class="fa fa-linkedin"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="member">
<div class="pic"><img src="img/team-2.jpg" alt=""></div>
<div class="details">
<h4>Sarah Jhinson</h4>
<span>Product Manager</span>
<div class="social">
<a href=""><i class="fa fa-twitter"></i></a>
<a href=""><i class="fa fa-facebook"></i></a>
<a href=""><i class="fa fa-google-plus"></i></a>
<a href=""><i class="fa fa-linkedin"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="member">
<div class="pic"><img src="img/team-3.jpg" alt=""></div>
<div class="details">
<h4>William Anderson</h4>
<span>CTO</span>
<div class="social">
<a href=""><i class="fa fa-twitter"></i></a>
<a href=""><i class="fa fa-facebook"></i></a>
<a href=""><i class="fa fa-google-plus"></i></a>
<a href=""><i class="fa fa-linkedin"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="member">
<div class="pic"><img src="img/team-4.jpg" alt=""></div>
<div class="details">
<h4>Amanda Jepson</h4>
<span>Accountant</span>
<div class="social">
<a href=""><i class="fa fa-twitter"></i></a>
<a href=""><i class="fa fa-facebook"></i></a>
<a href=""><i class="fa fa-google-plus"></i></a>
<a href=""><i class="fa fa-linkedin"></i></a>
</div>
</div>
</div>
</div>
</div>
</div>
</section><!-- #team -->
<!--==========================
Contact Section
============================-->
<section id="contact" class="wow fadeInUp">
<div class="container">
<div class="section-header">
<h2>Contact Us</h2>
<p>Sed tamen tempor magna labore dolore dolor sint tempor duis magna elit veniam aliqua esse amet veniam enim export quid quid veniam aliqua eram noster malis nulla duis fugiat culpa esse aute nulla ipsum velit export irure minim illum fore</p>
</div>
<div class="row contact-info">
<div class="col-md-4">
<div class="contact-address">
<i class="ion-ios-location-outline"></i>
<h3>Address</h3>
<address>A108 Adam Street, NY 535022, USA</address>
</div>
</div>
<div class="col-md-4">
<div class="contact-phone">
<i class="ion-ios-telephone-outline"></i>
<h3>Phone Number</h3>
<p><a href="tel:+155895548855">+1 5589 55488 55</a></p>
</div>
</div>
<div class="col-md-4">
<div class="contact-email">
<i class="ion-ios-email-outline"></i>
<h3>Email</h3>
<p><a href="mailto:info@example.com">info@example.com</a></p>
</div>
</div>
</div>
</div>
<div id="google-map" data-latitude="40.713732" data-longitude="-74.0092704"></div>
<div class="container">
<div class="form">
<div id="sendmessage">Your message has been sent. Thank you!</div>
<div id="errormessage"></div>
<form action="" method="post" role="form" class="contactForm">
<div class="form-row">
<div class="form-group col-md-6">
<input type="text" name="name" class="form-control" id="name" placeholder="Your Name" data-rule="minlen:4" data-msg="Please enter at least 4 chars" />
<div class="validation"></div>
</div>
<div class="form-group col-md-6">
<input type="email" class="form-control" name="email" id="email" placeholder="Your Email" data-rule="email" data-msg="Please enter a valid email" />
<div class="validation"></div>
</div>
</div>
<div class="form-group">
<input type="text" class="form-control" name="subject" id="subject" placeholder="Subject" data-rule="minlen:4" data-msg="Please enter at least 8 chars of subject" />
<div class="validation"></div>
</div>
<div class="form-group">
<textarea class="form-control" name="message" rows="5" data-rule="required" data-msg="Please write something for us" placeholder="Message"></textarea>
<div class="validation"></div>
</div>
<div class="text-center"><button type="submit">Send Message</button></div>
</form>
</div>
</div>
</section><!-- #contact -->
</main>
<!--==========================
Footer
============================-->
<footer id="footer">
<div class="container">
<div class="copyright">
&copy; Copyright <strong>Reveal</strong>. All Rights Reserved
</div>
<div class="credits">
<!--
All the links in the footer should remain intact.
You can delete the links only if you purchased the pro version.
Licensing information: https://bootstrapmade.com/license/
Purchase the pro version with working PHP/AJAX contact form: https://bootstrapmade.com/buy/?theme=Reveal
-->
<a href="https://bootstrapmade.com/">Free Bootstrap Templates</a> by BootstrapMade
</div>
</div>
</footer><!-- #footer -->
<a href="#" class="back-to-top"><i class="fa fa-chevron-up"></i></a>
<!-- JavaScript Libraries -->
<script src="lib/jquery/jquery.min.js"></script>
<script src="lib/jquery/jquery-migrate.min.js"></script>
<script src="lib/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="lib/easing/easing.min.js"></script>
<script src="lib/superfish/hoverIntent.js"></script>
<script src="lib/superfish/superfish.min.js"></script>
<script src="lib/wow/wow.min.js"></script>
<script src="lib/owlcarousel/owl.carousel.min.js"></script>
<script src="lib/magnific-popup/magnific-popup.min.js"></script>
<script src="lib/sticky/sticky.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyD8HeI8o-c1NppZA-92oYlXakhDPYR7XMY"></script>
<!-- Contact Form JavaScript File -->
<script src="contactform/contactform.js"></script>
<!-- Template Main Javascript File -->
<script src="js/main.js"></script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink