webionite.com/index.html

179 lines
8.9 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title> Ceda EI </title>
<link rel="stylesheet" type="text/css" href="index.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fork-awesome@1.1.7/css/fork-awesome.min.css" integrity="sha256-gsmEoJAws/Kd3CjuOQzLie5Q3yshhvmo7YNtBG7aaEY=" crossorigin="anonymous">
<link href="https://fonts.googleapis.com/css?family=Comfortaa:300,700|Roboto&display=swap" rel="stylesheet">
<meta name="Description" content="Homepage of Ceda EI." />
<meta property="og:description" content="Homepage of Ceda EI." />
<meta property="og:image" content="https://webionite.com/images/webionite.jpg" />
</head>
<body>
<div class="top-body">
<div class="left-pane">
<div class="page" id="home">
<img alt="Webionite Logo" src="images/webionite.svg" class="title-image"/>
<h1>Webionite</h1>
<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin nec augue risus. Praesent at lectus ante. Maecenas volutpat purus et eros vehicula, vitae scelerisque turpis iaculis. Pellentesque iaculis lectus at erat fermentum ultricies. Curabitur est ante, accumsan in tortor vitae, molestie elementum ante. Duis tristique tellus eu molestie porta. Mauris euismod id sem ut ultrices. </p>
</div>
<div class="page full-width" id="projects">
<h2>Projects</h2>
<div class="projects">
<div class="project">
<h3>Lorem Ipsum Dolorum</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin nec augue risus. Praesent at lectus ante. Maecenas volutpat purus et eros vehicula, vitae scelerisque turpis iaculis.</p>
<div class="spacer"></div>
<div class="link"><a href="#"><i class="fa fa-link"></i> Go to project</a></div>
</div>
<div class="project">
<h3>Lorem</h3>
<p>Lorem ipsum dolor sit amet, </p>
<div class="spacer"></div>
<div class="link"><a href="#"><i class="fa fa-link"></i> Go to project</a></div>
</div>
<div class="project">
<h3>Lorem</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin nec augue risus. Praesent at lectus ante. Maecenas volutpat purus et eros vehicula, vitae scelerisque turpis iaculis.</p>
<div class="spacer"></div>
<div class="link"><a href="#"><i class="fa fa-link"></i> Go to project</a></div>
</div>
<div class="project">
<h3>Lorem</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin nec augue risus. Praesent at lectus ante. Maecenas volutpat purus et eros vehicula, vitae scelerisque turpis iaculis.</p>
<div class="spacer"></div>
<div class="link"><a href="#"><i class="fa fa-link"></i> Go to project</a></div>
</div>
<div class="project">
<h3>Lorem</h3>
<p>Lorem ipsum dolor sit amet, </p>
<div class="spacer"></div>
<div class="link"><a href="#"><i class="fa fa-link"></i> Go to project</a></div>
</div>
<div class="project">
<h3>Lorem</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin nec augue risus. Praesent at lectus ante. Maecenas volutpat purus et eros vehicula, vitae scelerisque turpis iaculis.</p>
<div class="spacer"></div>
<div class="link"><a href="#"><i class="fa fa-link"></i> Go to project</a></div>
</div>
<div class="project">
<h3>Lorem</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin nec augue risus. Praesent at lectus ante. Maecenas volutpat purus et eros vehicula, vitae scelerisque turpis iaculis.</p>
<div class="spacer"></div>
<div class="link"><a href="#"><i class="fa fa-link"></i> Go to project</a></div>
</div>
<div class="project">
<h3>Lorem</h3>
<p>Lorem ipsum dolor sit amet, </p>
<div class="spacer"></div>
<div class="link"><a href="#"><i class="fa fa-link"></i> Go to project</a></div>
</div>
<div class="project">
<h3>Lorem</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin nec augue risus. Praesent at lectus ante. Maecenas volutpat purus et eros vehicula, vitae scelerisque turpis iaculis.</p>
<div class="spacer"></div>
<div class="link"><a href="#"><i class="fa fa-link"></i> Go to project</a></div>
</div>
</div>
</div>
<div class="page full-width" id="hosted">
<h2>Hosted Services</h2>
<div class="projects">
<div class="project">
<h3>Lorem</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin nec augue risus. Praesent at lectus ante. Maecenas volutpat purus et eros vehicula, vitae scelerisque turpis iaculis.</p>
<div class="spacer"></div>
<div class="link"><a href="#"><i class="fa fa-link"></i> Go to project</a></div>
</div>
<div class="project">
<h3>Lorem</h3>
<p>Lorem ipsum dolor sit amet, </p>
<div class="spacer"></div>
<div class="link"><a href="#"><i class="fa fa-link"></i> Go to project</a></div>
</div>
<div class="project">
<h3>Lorem</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin nec augue risus. Praesent at lectus ante. Maecenas volutpat purus et eros vehicula, vitae scelerisque turpis iaculis.</p>
<div class="spacer"></div>
<div class="link"><a href="#"><i class="fa fa-link"></i> Go to project</a></div>
</div>
<div class="project">
<h3>Lorem</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin nec augue risus. Praesent at lectus ante. Maecenas volutpat purus et eros vehicula, vitae scelerisque turpis iaculis.</p>
<div class="spacer"></div>
<div class="link"><a href="#"><i class="fa fa-link"></i> Go to project</a></div>
</div>
<div class="project">
<h3>Lorem</h3>
<p>Lorem ipsum dolor sit amet, </p>
<div class="spacer"></div>
<div class="link"><a href="#"><i class="fa fa-link"></i> Go to project</a></div>
</div>
<div class="project">
<h3>Lorem</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin nec augue risus. Praesent at lectus ante. Maecenas volutpat purus et eros vehicula, vitae scelerisque turpis iaculis.</p>
<div class="spacer"></div>
<div class="link"><a href="#"><i class="fa fa-link"></i> Go to project</a></div>
</div>
<div class="project">
<h3>Lorem</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin nec augue risus. Praesent at lectus ante. Maecenas volutpat purus et eros vehicula, vitae scelerisque turpis iaculis.</p>
<div class="spacer"></div>
<div class="link"><a href="#"><i class="fa fa-link"></i> Go to project</a></div>
</div>
<div class="project">
<h3>Lorem</h3>
<p>Lorem ipsum dolor sit amet, </p>
<div class="spacer"></div>
<div class="link"><a href="#"><i class="fa fa-link"></i> Go to project</a></div>
</div>
<div class="project">
<h3>Lorem</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin nec augue risus. Praesent at lectus ante. Maecenas volutpat purus et eros vehicula, vitae scelerisque turpis iaculis.</p>
<div class="spacer"></div>
<div class="link"><a href="#"><i class="fa fa-link"></i> Go to project</a></div>
</div>
</div>
</div>
<div class="page" id="contact">
<h2>Contact</h2>
<img alt="Ceda EI" src="images/ceda.jpg" class="image-about"/>
<h3>@ceda_ei</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin nec augue risus. Praesent at lectus ante. Maecenas volutpat purus et eros vehicula, vitae scelerisque turpis iaculis.</p>
<div class="icons large">
<a class="icon" href="https://matrix.to/#/@ceda_ei:matrix.org"><i class="fa fa-matrix-org"></i></a>
<a class="icon" href="https://t.me/ceda_ei"><i class="fa fa-paper-plane"></i></a>
<a class="icon" href="mailto:ceda_ei@webionite.com"><i class="fa fa-envelope"></i></a>
</div>
</div>
</div>
<div class="right-pane">
<div class="selectors">
<a href="#home" class="selector">
<i class="fa fa-angle-left"></i>
<span>Home</span>
</a>
<a href="#projects" class="selector">
<i class="fa fa-angle-left"></i>
<span>Projects</span>
</a>
<a href="#hosted" class="selector">
<i class="fa fa-angle-left"></i>
<span>Hosted Services</span>
</a>
<a href="#contact" class="selector">
<i class="fa fa-angle-left"></i>
<span>Contact</span>
</a>
</div>
<p>Part of <a href="https://libreho.st/"> libreho.st</a> network</p>
<div class="icons">
<a class="icon" href="https://gitlab.com/ceda_ei/"><i class="fa fa-gitlab"></i></a>
<a class="icon" href="https://git.webionite.com/ceda_ei/"><i class="fa fa-gitea"></i></a>
</div>
</div>
</div>
</body>
</html>