neurosecure/index.html

113 lines
4.3 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>NeuroSecure</title>
<link rel="stylesheet" href="css/index.css">
</head>
<body>
<div class="nav-wrapper">
<nav>
<div class="logo">
<h4>
<img width="24" height="24" src="css/res/brain.svg">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" class="bi bi-plus" viewBox="0 0 16 16">
<path d="M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z"/>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" class="bi bi-lock-fill" viewBox="0 0 16 16">
<path d="M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2z"/>
</svg>
<span>NeuroSecure.</span>
</h4>
</div>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Timeline</a></li>
<li><a href="#">Contact Us</a></li>
</ul>
</nav>
</div>
<section class="hero">
<div id="hero">
<h1>
Neuro<br />Secure
</h1>
<h3>
A product to revolutionize the field of cybersecurity.
</h3>
</div>
</section>
<section class="about">
<h1>
The future of authentication.
</h1>
<h4>
A cloud based authentication platform that will allow users to login with their minds. Lorem ipsum dolor sit, amet consectetur adipisicing elit. Similique ex, nihil ullam dolores nisi, porro tenetur tempore facilis delectus optio, alias nemo ipsum error laudantium quia soluta! Atque, soluta consequatur?
</h4>
<button><a href="">Watch a demo</a></button>
</section>
<section class="timeline">
<div class="container">
<ul>
<li>
<div class="content">
<h3 class="date">20th may, 2010</h3>
<h1>Heading 1</h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit.
Consectetur tempora ab laudantium voluptatibus aut eos placeat
laborum, quibusdam exercitationem labore.</p>
</div>
</li>
<li>
<div class="content">
<h3 class="date">20th may, 2010</h3>
<h1>Heading 2</h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit.
Consectetur tempora ab laudantium voluptatibus aut eos placeat laborum,
quibusdam exercitationem labore.</p>
</div>
</li>
<li>
<div class="content">
<h3 class="date">20th may, 2010</h3>
<h1>Heading 3</h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit.
Consectetur tempora ab laudantium voluptatibus aut eos placeat laborum,
quibusdam exercitationem labore.</p>
</div>
</li>
<li>
<div class="content">
<h3 class="date">20th may, 2010</h3>
<h1>Heading 4</h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit.
Consectetur tempora ab laudantium voluptatibus aut eos placeat laborum,
quibusdam exercitationem labore.</p>
</div>
</li>
</ul>
</div>
</section>
</body>
<script type="x-shader/x-vertex" id="vertexshader">
attribute float scale;
void main() {
vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );
gl_PointSize = scale * ( 300.0 / - mvPosition.z );
gl_Position = projectionMatrix * mvPosition;
}
</script>
<script type="x-shader/x-fragment" id="fragmentshader">
uniform vec3 color;
void main() {
if ( length( gl_PointCoord - vec2( 0.5, 0.5 ) ) > 0.475 ) discard;
gl_FragColor = vec4( color, 1.0 );
}
</script>
<script src="/js/app.js" type="module"></script>
<script src="/js/particles.js" type="module"></script>
</html>