<!DOCTYPE html>
<html lang="en">
    <head>

<!-- for favicon -->
<link rel="apple-touch-icon" sizes="180x180" href="favicon/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="favicon/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="theme-color" content="#ffffff">




<!--  -->

        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <!-- Stylesheets -->
        <link rel="stylesheet" href="css/loginSignup.css">
        <title>Chatters:Login</title>
    </head>
    <body>

        <div class="mainVideo">

            <div class="overlay"></div>
            <video src="res/videos/mainVideo.mp4" type="video/mp4" loop autoplay
                muted>
            </video>
        </div> 
        <div class="form-box">
            <form class="form" method="post">
                <span class="title">Login</span>
                <span class="subtitle">Welcome back boss!</span>
                <div class="form-container">

                    <input required name="email" type="email" class="input"
                        placeholder="Email">
                    <input required name="password" type="password" class="input"
                        placeholder="Password">
                </div>
                <button>Login</button>
            </form>
            <div class="form-section">
                <p>Don't have an account? <a href="./signup">Signup</a> </p>
            </div>
        </div>

    </body>
</html>