383 lines
13 KiB
HTML
383 lines
13 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-TW">
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<meta
|
||
name="viewport"
|
||
content="width=device-width, initial-scale=1, shrink-to-fit=no"
|
||
/>
|
||
<script src="js/destruct.js"></script>
|
||
<title>Atlas</title>
|
||
<meta name="description" content="Fuck Your Day" />
|
||
<link rel="icon" href="img/favicon.png" sizes="32x32" type="image/png" />
|
||
<!-- custom.css -->
|
||
<link rel="stylesheet" href="css/custom.css" />
|
||
<!-- bootstrap.min.css -->
|
||
<link rel="stylesheet" href="css/bootstrap.min.css" />
|
||
<!-- font-awesome -->
|
||
<link rel="stylesheet" href="font-awesome-4.7.0/css/font-awesome.min.css" />
|
||
|
||
<!-- AOS -->
|
||
<link rel="stylesheet" href="css/aos.css" />
|
||
</head>
|
||
|
||
<body>
|
||
<!-- banner -->
|
||
<div
|
||
class="jumbotron jumbotron-fluid"
|
||
id="banner"
|
||
style="background-image: url(img/banner-bk.jpg)"
|
||
>
|
||
<div class="container text-center text-md-left">
|
||
<header>
|
||
<div class="row justify-content-between">
|
||
<div class="col-2">
|
||
<img src="img/logo.png" alt="logo" />
|
||
</div>
|
||
<div class="col-6 align-self-center text-right">
|
||
<a href="#" class="text-white lead">Get Early Access</a>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
<h1
|
||
data-aos="fade"
|
||
data-aos-easing="linear"
|
||
data-aos-duration="1000"
|
||
data-aos-once="true"
|
||
class="display-3 text-white font-weight-bold my-5"
|
||
>
|
||
A New Way<br />
|
||
To Start Business
|
||
</h1>
|
||
<p
|
||
data-aos="fade"
|
||
data-aos-easing="linear"
|
||
data-aos-duration="1000"
|
||
data-aos-once="true"
|
||
class="lead text-white my-4"
|
||
>
|
||
Atlas is a cutting-edge digital security provider, safeguarding your
|
||
online presence with state-of-the-art solutions.
|
||
</p>
|
||
<a
|
||
href="#"
|
||
data-aos="fade"
|
||
data-aos-easing="linear"
|
||
data-aos-duration="1000"
|
||
data-aos-once="true"
|
||
class="btn my-4 font-weight-bold atlas-cta cta-green"
|
||
>Get Started</a
|
||
>
|
||
</div>
|
||
</div>
|
||
<!-- three-blcok -->
|
||
<div class="container my-5 py-2">
|
||
<h2 class="text-center font-weight-bold my-5">
|
||
Smartest protection for your site
|
||
</h2>
|
||
<div class="row">
|
||
<div
|
||
data-aos="fade-up"
|
||
data-aos-delay="0"
|
||
data-aos-duration="1000"
|
||
data-aos-once="true"
|
||
class="col-md-4 text-center"
|
||
>
|
||
<img src="img/smart-protect-1.jpg" alt="Anti-spam" class="mx-auto" />
|
||
<h4>Anti-spam</h4>
|
||
<p>
|
||
Say goodbye to unwanted emails and intrusive messages. Atlas’s
|
||
robust anti-spam system filters out junk, keeping your inbox clean.
|
||
</p>
|
||
</div>
|
||
<div
|
||
data-aos="fade-up"
|
||
data-aos-delay="200"
|
||
data-aos-duration="1000"
|
||
data-aos-once="true"
|
||
class="col-md-4 text-center"
|
||
>
|
||
<img
|
||
src="img/smart-protect-2.jpg"
|
||
alt="Phishing Detect"
|
||
class="mx-auto"
|
||
/>
|
||
<h4>Phishing Detect</h4>
|
||
<p>
|
||
Atlas detects phishing attempts before they trick you. Stay one step
|
||
ahead of cybercriminals.
|
||
</p>
|
||
</div>
|
||
<div
|
||
data-aos="fade-up"
|
||
data-aos-delay="400"
|
||
data-aos-duration="1000"
|
||
data-aos-once="true"
|
||
class="col-md-4 text-center"
|
||
>
|
||
<img src="img/smart-protect-3.jpg" alt="Smart Scan" class="mx-auto" />
|
||
<h4>Smart Scan</h4>
|
||
<p>
|
||
Run a quick Smart Scan with Atlas to assess your digital
|
||
vulnerabilities instantly.
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- feature (skew background) -->
|
||
<div class="jumbotron jumbotron-fluid feature" id="feature-first">
|
||
<div class="container my-5">
|
||
<div class="row justify-content-between text-center text-md-left">
|
||
<div
|
||
data-aos="fade-right"
|
||
data-aos-duration="1000"
|
||
data-aos-once="true"
|
||
class="col-md-6"
|
||
>
|
||
<h2 class="font-weight-bold">Take a look inside</h2>
|
||
<p class="my-4">
|
||
Curious about what Atlas offers? Our services span a wide
|
||
spectrum: robust firewalls, secure VPNs, encrypted communication
|
||
channels, vulnerability assessments, and more. Visit our website
|
||
to explore the full range and find tailored solutions for your
|
||
specific needs.
|
||
</p>
|
||
<a href="#" class="btn my-4 font-weight-bold atlas-cta cta-blue"
|
||
>Learn More</a
|
||
>
|
||
</div>
|
||
<div
|
||
data-aos="fade-left"
|
||
data-aos-duration="1000"
|
||
data-aos-once="true"
|
||
class="col-md-6 align-self-center"
|
||
>
|
||
<img
|
||
src="img/feature-1.png"
|
||
alt="Take a look inside"
|
||
class="mx-auto d-block"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- feature (green background) -->
|
||
<div class="jumbotron jumbotron-fluid feature" id="feature-last">
|
||
<div class="container">
|
||
<div class="row justify-content-between text-center text-md-left">
|
||
<div
|
||
data-aos="fade-left"
|
||
data-aos-duration="1000"
|
||
data-aos-once="true"
|
||
class="col-md-6 flex-md-last"
|
||
>
|
||
<h2 class="font-weight-bold">Safe and reliable</h2>
|
||
<p class="my-4">
|
||
When it comes to safeguarding your digital world, compromise is
|
||
not an option. Atlas stands as a beacon of reliability, ensuring
|
||
that your data remains confidential, your transactions are secure,
|
||
and your online experiences are worry-free. With us, safety isn’t
|
||
just a promise—it’s our commitment to you.
|
||
</p>
|
||
<a href="#" class="btn my-4 font-weight-bold atlas-cta cta-blue"
|
||
>Learn More</a
|
||
>
|
||
</div>
|
||
<div
|
||
data-aos="fade-right"
|
||
data-aos-duration="1000"
|
||
data-aos-once="true"
|
||
class="col-md-6 align-self-center flex-md-first"
|
||
>
|
||
<img
|
||
src="img/feature-2.png"
|
||
alt="Safe and reliable"
|
||
class="mx-auto d-block"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- price table -->
|
||
<div class="container my-5 py-2" id="price-table">
|
||
<h2 class="text-center font-weight-bold d-block mb-3">
|
||
Check our pricing
|
||
</h2>
|
||
<div class="row">
|
||
<div
|
||
data-aos="fade-right"
|
||
data-aos-delay="200"
|
||
data-aos-duration="1000"
|
||
data-aos-once="true"
|
||
class="col-md-4 text-center py-4 mt-5"
|
||
>
|
||
<h4 class="my-4">STARTUP</h4>
|
||
<p class="font-weight-bold">
|
||
$ <span class="display-2 font-weight-bold">0</span> / MO.
|
||
</p>
|
||
<ul class="list-unstyled">
|
||
<li>Up to 5 Documents</li>
|
||
<li>Up to 3 Reviews</li>
|
||
<li>5 team Members</li>
|
||
<li>Limited Support</li>
|
||
</ul>
|
||
<a href="#" class="btn my-4 font-weight-bold atlas-cta cta-ghost"
|
||
>Get Free</a
|
||
>
|
||
</div>
|
||
<div
|
||
data-aos="fade-up"
|
||
data-aos-duration="1000"
|
||
data-aos-once="true"
|
||
class="col-md-4 text-center py-4 mt-5 rounded"
|
||
id="price-table__premium"
|
||
>
|
||
<h4 class="my-4">PREMIUM</h4>
|
||
<p class="font-weight-bold">
|
||
$ <span class="display-2 font-weight-bold">10</span> / MO.
|
||
</p>
|
||
<ul class="list-unstyled">
|
||
<li>Up to 15 Documents</li>
|
||
<li>Up to 10 Reviews</li>
|
||
<li>25 team Members</li>
|
||
<li>Limited Support</li>
|
||
</ul>
|
||
<a href="#" class="btn my-4 font-weight-bold atlas-cta cta-green"
|
||
>Get Free</a
|
||
>
|
||
</div>
|
||
<div
|
||
data-aos="fade-left"
|
||
data-aos-delay="200"
|
||
data-aos-duration="1000"
|
||
data-aos-once="true"
|
||
class="col-md-4 text-center py-4 mt-5"
|
||
>
|
||
<h4 class="my-4">PROFESSIONAL</h4>
|
||
<p class="font-weight-bold">
|
||
$ <span class="display-2 font-weight-bold">30</span> / MO.
|
||
</p>
|
||
<ul class="list-unstyled">
|
||
<li>Unlimited Documents</li>
|
||
<li>Unlimited Reviews</li>
|
||
<li>Unlimited Members</li>
|
||
<li>Unlimited Support</li>
|
||
</ul>
|
||
<a href="#" class="btn my-4 font-weight-bold atlas-cta cta-ghost"
|
||
>Get Free</a
|
||
>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- client -->
|
||
<div class="jumbotron jumbotron-fluid">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-sm-4 col-md-2 py-2 align-self-center">
|
||
<img src="img/client-1.png" class="mx-auto d-block" />
|
||
</div>
|
||
<div class="col-sm-4 col-md-2 py-2 align-self-center">
|
||
<img src="img/client-2.png" class="mx-auto d-block" />
|
||
</div>
|
||
<div class="col-sm-4 col-md-2 py-2 align-self-center">
|
||
<img src="img/client-3.png" class="mx-auto d-block" />
|
||
</div>
|
||
<div class="col-sm-4 col-md-2 py-2 align-self-center">
|
||
<img src="img/client-4.png" class="mx-auto d-block" />
|
||
</div>
|
||
<div class="col-sm-4 col-md-2 py-2 align-self-center">
|
||
<img src="img/client-5.png" class="mx-auto d-block" />
|
||
</div>
|
||
<div class="col-sm-4 col-md-2 py-2 align-self-center">
|
||
<img src="img/client-6.png" class="mx-auto d-block" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- contact -->
|
||
<div
|
||
class="jumbotron jumbotron-fluid"
|
||
id="contact"
|
||
style="background-image: url(img/contact-bk.jpg)"
|
||
>
|
||
<div class="container my-5">
|
||
<div class="row justify-content-between">
|
||
<div class="col-md-6 text-white">
|
||
<h2 class="font-weight-bold">Contact Us</h2>
|
||
<p class="my-4">
|
||
To learn more use google or something, we really don't care <br />
|
||
Please don't contact us!
|
||
</p>
|
||
<ul class="list-unstyled">
|
||
<li>Email : support@fuckyou.day</li>
|
||
<li>Phone : +82-2-531-9000</li>
|
||
<li>Address : 4826 White Avenue, Corpus Christi, Texas</li>
|
||
</ul>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<form>
|
||
<div class="row">
|
||
<div class="form-group col-md-6">
|
||
<label for="name">Your Name</label>
|
||
<input type="name" class="form-control" id="name" />
|
||
</div>
|
||
<div class="form-group col-md-6">
|
||
<label for="Email">Your Email</label>
|
||
<input type="email" class="form-control" id="Email" />
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="message">Message</label>
|
||
<textarea class="form-control" id="message" rows="3"></textarea>
|
||
</div>
|
||
<button
|
||
type="submit"
|
||
class="btn font-weight-bold atlas-cta atlas-cta-wide cta-green my-3"
|
||
>
|
||
Submit
|
||
</button>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- copyright -->
|
||
<div class="jumbotron jumbotron-fluid" id="copyright">
|
||
<div class="container">
|
||
<div class="row justify-content-between">
|
||
<div
|
||
class="col-md-6 text-white align-self-center text-center text-md-left my-2"
|
||
>
|
||
Copyright © 2018 Chen, Yi-Ya.
|
||
</div>
|
||
<div
|
||
class="col-md-6 align-self-center text-center text-md-right my-2"
|
||
id="social-media"
|
||
>
|
||
<a href="#" class="d-inline-block text-center ml-2">
|
||
<i class="fa fa-facebook" aria-hidden="true"></i>
|
||
</a>
|
||
<a href="#" class="d-inline-block text-center ml-2">
|
||
<i class="fa fa-twitter" aria-hidden="true"></i>
|
||
</a>
|
||
<a href="#" class="d-inline-block text-center ml-2">
|
||
<i class="fa fa-medium" aria-hidden="true"></i>
|
||
</a>
|
||
<a href="#" class="d-inline-block text-center ml-2">
|
||
<i class="fa fa-linkedin" aria-hidden="true"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- AOS -->
|
||
<script src="js/aos.js"></script>
|
||
<script>
|
||
AOS.init({});
|
||
</script>
|
||
</body>
|
||
</html>
|