This repository has been archived on 2023-04-23. You can view files and clone it, but cannot push or open issues or pull requests.
blueanimates-net/_layouts/home.html

57 lines
1.4 KiB
HTML

{% include master/head.html %}
{% include master/header.html %}
<banner>
<img src="/assets/images/Teaser_1.png">
</banner>
<div class="content">
<section id="hero-fullscreen">
<div class="grid-40auto vertical-center">
<img style="height: 50%;object-fit: contain;" src="/assets/images/blue.png">
<div>
<h1>Welcome!</h1>
<p>I am a 3D artist who primarily works with Minecraft-style creations and renders! You can find out more about me on my FAQ page.</p>
<a href="/contact/"><button style="font-weight: bold">Contact Me</button></a>
</div>
</div>
</section>
</div>
{% include master/footer.html %}
<style>
#Home {background: var(--blue-light);}
</style>
<style>
body {
background: var(--blue);
color: white;
}
banner img {
background-image: url('/assets/images/Exploration (0;00;00;00).png');
position: fixed;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
opacity: 0.1;
filter: saturate(0);
z-index: -1;
animation: 2s bigBanner ease-in-out;
}
#footer {
position: fixed;
bottom: 0px;
width: 100%;
max-width: var(--max-width);
background: var(--blue);
padding: 0px 100%;
left: 50%;
transform: translate(-50%);
}
.content {
position: fixed;
top: 50%;
transform: translate(-50%, -50%);
}
</style>