<!--
VERSION 4 | No Index, Full
HANDY WEBSITES
> Font Awesome (for icons): https://fontawesome.com/v5.15/icons/reddit?style=brands
> W3 Schools Bootstrap: https://www.w3schools.com/bootstrap/
> W3 Schools HTML: https://www.w3schools.com/html/default.asp
> Bootstrap Docs: https://getbootstrap.com/docs/5.1/getting-started/introduction/
THINGS TO NOTE
> image used: https://images.unsplash.com/photo-1527352675495-d54e8f102689?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2070&q=80
> image link: https://unsplash.com/photos/R0mWlPiK1hw
THANKS FOR USING! <3
-->
<!-- container -->
<div class="container-fluid" style="max-width:950px;
background-image: url('https://images.unsplash.com/photo-1527352675495-d54e8f102689?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2070&q=80');
background-size: cover;
background-position: bottom;
background-attachment: fixed;
background-repeat: no-repeat;">
<div class="p-5" style="background-color:rgba(0,0,0,0.5);">
<!-- header -->
<div class="p-3 mb-2" style="font-size:25px; font-variant: small-caps; font-weight: 200; border-top: 1px #ffffff solid; border-left: 1px #ffffff solid;">
<span style="color:rgba(255,255,255,1); letter-spacing: 4px;">Title of Folder</span>
</div>
<!-- content -->
<div class="p-2" style="font-size:13px; font-weight: 200; background-color:rgba(0, 0, 0, 0.1)">
<div class="px-3 text-justify" style="color:rgba(255,255,255,1);">
<p>These boxes do not scroll. You will have to add <em>br</em> tags or <em>shift+enter</em> if you want this to look symmetrical. Lorem ipsum dolor sit amet consectetur adipisicing elit. Distinctio iusto, harum quis tenetur unde quasi? Optio.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab, libero nulla. Tempore vitae architecto ea culpa soluta aut asperiores laborum unde officia distinctio alias dolorem dolor molestiae velit, sit veniam.</p>
</div>
<hr style="background-color:rgba(255, 255, 255, 0.5);">
<div class="px-4 py-2 text-center" style="font-weight: 200; letter-spacing: 5px; color:rgba(255,255,255,1); background-color:rgba(0,0,0,0.2);">
<a href="LINK">l i n k</a>
</div>
</div>
<!-- tags -->
<div class="px-4 text-white text-center" style="font-size:10px; font-weight:200;">
adjective | adjective | adjective
</div>
</div>
<!-- credit -->
<div class="pull-right">
<a href="https://unsplash.com/photos/R0mWlPiK1hw"><i class="far fa-image-polaroid"></i></a>
<a href="https://toyhou.se/acodingperson"><i class="fal fa-blanket"></i></a>
</div>
<!-- /credit-->
</div>
<!-- end of first -->