website/index.html

310 lines
11 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html class="no-js" lang="en">
<head>
<!--- basic page needs
================================================== -->
<meta charset="utf-8">
<title>Libre Solutions</title>
<meta name="description" content="">
<meta name="author" content="">
<!-- mobile specific metas
================================================== -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- CSS
================================================== -->
<link rel="stylesheet" href="css/base.css">
<link rel="stylesheet" href="css/vendor.css">
<link rel="stylesheet" href="css/main.css">
<!-- script
================================================== -->
<script src="js/modernizr.js"></script>
<!-- favicons
================================================== -->
<link rel="shortcut icon" href="libre-solutions-favicon-white.svg" type="image/x-icon">
<link rel="icon" href="libre-solutions-favicon-white.svg" type="image/x-icon">
</head>
<body id="top">
<!-- preloader
================================================== -->
<div id="preloader">
<div id="loader" class="dots-jump">
<div></div>
<div></div>
<div></div>
</div>
</div>
<!-- header
================================================== -->
<header class="s-header">
<div class="header-logo">
<a class="site-logo" href="index.html">
<img src="images/libre-solutions-high-resolution-logo-white-transparent.svg" alt="Homepage">
</a>
</div> <!-- end header-logo -->
<nav class="header-nav">
<a href="#0" class="header-nav__close" title="close"><span>Close</span></a>
<h3>Navigate to</h3>
<div class="header-nav__content">
<ul class="header-nav__list">
<li><a class="smoothscroll" href="#home" title="home">Home</a></li>
<li><a class="smoothscroll" href="#about" title="about">About</a></li>
<li><a class="smoothscroll" href="#services" title="services">Services</a></li>
<li><a class="smoothscroll" href="#contact" title="contact">Contact</a></li>
</ul>
</div> <!-- end header-nav__content -->
</nav> <!-- end header-nav -->
<a class="header-menu-toggle" href="#0">
<span class="header-menu-icon"></span>
</a>
</header> <!-- end s-header -->
<!-- home
================================================== -->
<section id="home" class="s-home page-hero target-section" data-parallax="scroll" data-image-src="images/hero-bg.jpg" data-natural-width=3000 data-natural-height=2000 data-position-y=center>
<div class="grid-overlay">
<div></div>
</div>
<div class="home-content">
<div class="row home-content__main">
<h1>
Libre Solutions
</h1>
<!-- <h3>
We build brands and beautiful experiences
</h3> -->
<div class="home-content__button">
<a href="#about" class="smoothscroll btn btn--primary btn--large">
More About Us
</a>
<a href="#contact" class="smoothscroll btn btn--large">
Let's Talk
</a>
</div>
</div> <!-- end home-content__main -->
<div class="home-content__scroll">
<a href="#about" class="scroll-link smoothscroll">
Scroll
</a>
</div>
</div> <!-- end home-content -->
</section> <!-- end s-home -->
<!-- about
================================================== -->
<section id="about" class="s-about target-section">
<div class="row section-header bit-narrow" data-aos="fade-up">
<div class="col-full">
<h3 class="subhead">Who We Are</h3>
<h1 class="display-1">
We are Libre Solutions, Deploy mail servers powered by Free / Open Source Software in your own network or data center. Choose from a variety of tools and user interfaces. Manage your users emails without constraints. No recurring or per-users costs.
</h1>
</div>
</div> <!-- end section-header -->
</section> <!-- end s-about -->
<!-- services
================================================== -->
<section id='services' class="s-services target-section darker">
<div class="row section-header bit-narrow" data-aos="fade-up">
<div class="col-full">
<h3 class="subhead">What we do</h3>
<h1 class="display-1">
We take pride in what we do. Our services are designed to help
your business stand out and turn your ideas into digital realities.
</h1>
</div>
</div> <!-- end section-header -->
<div class="row bit-narrow services block-1-2 block-tab-full">
<div class="col-block item-service" data-aos="fade-up">
<div class="item-service__icon">
<i class="icon-mail"></i>
</div>
<div class="item-service__text">
<h3 class="item-title">Next Cloud</h3>
<p>Nemo cupiditate ab quibusdam quaerat impedit magni. Earum suscipit ipsum laudantium.
Quo delectus est. Maiores voluptas ab sit natus veritatis ut. Debitis nulla cumque veritatis.
Sunt suscipit voluptas ipsa in tempora esse soluta sint.
</p>
</div>
</div>
<div class="col-block item-service" data-aos="fade-up">
<div class="item-service__icon">
<i class="fab fa-wordpress"></i>
</div>
<div class="item-service__text">
<h3 class="item-title">Woocommerce</h3>
<p>Nemo cupiditate ab quibusdam quaerat impedit magni. Earum suscipit ipsum laudantium.
Quo delectus est. Maiores voluptas ab sit natus veritatis ut. Debitis nulla cumque veritatis.
Sunt suscipit voluptas ipsa in tempora esse soluta sint.
</p>
</div>
</div>
</div> <!-- end services -->
</section> <!-- end s-services -->
<!-- works
================================================== -->
<!-- clients
================================================== -->
<!-- end s-clients -->
<!-- testimonies
================================================== -->
<!-- contact
================================================== -->
<section id="contact" class="s-contact target-section">
<div class="grid-overlay">
<div></div>
</div>
<div class="row section-header narrow" data-aos="fade-up">
<div class="col-full">
<h3 class="subhead">Keep In Touch</h3>
<h1 class="display-1">Feel free to contact us for any <br> project idea or collaboration</h1>
</div>
</div> <!-- end section-header -->
<div class="row contact-main" data-aos="fade-up">
<div class="col-full">
<p class="contact-email">
<a href="mailto:#0">contact@libre-solutions.com</a>
</p>
</div>
</div>
</section> <!-- end s-contact -->
<!-- footer
================================================== -->
<footer>
<div class="row">
<div class="col-full ss-copyright">
<span>© Copyright Libre Solutions 2024 </span>
</div>
</div>
<div class="ss-go-top">
<a class="smoothscroll" title="Back to Top" href="#top">Back to Top</a>
</div>
</footer>
<!-- photoswipe background
================================================== -->
<div aria-hidden="true" class="pswp" role="dialog" tabindex="-1">
<div class="pswp__bg"></div>
<div class="pswp__scroll-wrap">
<div class="pswp__container">
<div class="pswp__item"></div>
<div class="pswp__item"></div>
<div class="pswp__item"></div>
</div>
<div class="pswp__ui pswp__ui--hidden">
<div class="pswp__top-bar">
<div class="pswp__counter"></div><button class="pswp__button pswp__button--close" title="Close (Esc)"></button> <button class="pswp__button pswp__button--share" title=
"Share"></button> <button class="pswp__button pswp__button--fs" title="Toggle fullscreen"></button> <button class="pswp__button pswp__button--zoom" title=
"Zoom in/out"></button>
<div class="pswp__preloader">
<div class="pswp__preloader__icn">
<div class="pswp__preloader__cut">
<div class="pswp__preloader__donut"></div>
</div>
</div>
</div>
</div>
<div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap">
<div class="pswp__share-tooltip"></div>
</div><button class="pswp__button pswp__button--arrow--left" title="Previous (arrow left)"></button> <button class="pswp__button pswp__button--arrow--right" title=
"Next (arrow right)"></button>
<div class="pswp__caption">
<div class="pswp__caption__center"></div>
</div>
</div>
</div>
</div> <!-- end photoSwipe background -->
<!-- Java Script
================================================== -->
<script src="js/jquery-3.2.1.min.js"></script>
<script src="js/plugins.js"></script>
<script src="js/main.js"></script>
</body>