index.html

---
page_title: Fishoak - Bay Area Fishing
layout: main
---
<style>
    .title {
        margin-top: 0px;
        color: white;
        font-family: 'Roboto Condensed', sans-serif;
        font-size: 32px;
        position: relative;
    }
    .fishoak {
        font-family: 'Lobster', cursive;
    }
    .title .crop {
        width: 100%;
        max-height: 100vh;
        overflow: hidden;
    }
    .title img {
        width: 100%;
        height: 100vh;
        object-fit: cover;
        -webkit-filter: grayscale; 
        -webkit-filter: brightness(80%); 
    }
    .title h1 {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 100%;
        text-align: center;
        margin: 0px;
        
        -webkit-filter: drop-shadow(2px 2px #333);
        filter: drop-shadow(2px 2px #333);
    }
    .title .enter {
        position: absolute;
        top: 90%;
        left: 50%;
        transform: translate(-50%, -50%);
        text-align: center;
    }
    .title .enter > a {
        margin: 0px;
        padding-left: 20px;
        padding-right: 20px;
        padding-top: 10px;
        padding-bottom: 10px;
        border-radius: 10px;
        background-color: red;
        transition-duration: 0.4s;
    }
    .title .enter > a:hover {
        /* background-color: white;
        color: #555555; */
        background-color: #e87c74;
    }
</style>

<div class="title">
    <div class="crop">
        <img src="/assets/images/shark.webp"/>
    </div>
    <h1><span class="fishoak">Fishoak</span> - Fishing/Hiking Adventures</h1>
    <div class="enter">    
        <a href="/dir" class="invis">SEE SPOTS</a>
        <a href="/reports" class="invis">SEE REPORTS</a>
    </div>
</div>