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

<head>
    <meta charset="<?php bloginfo('charset'); ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link
        href="https://fonts.googleapis.com/css2?family=Caveat:wght@400..700&family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Protest+Revolution&family=Quintessential&display=swap"
        rel="stylesheet" />
    <link
        href="https://fonts.googleapis.com/css2?family=Caveat:wght@400..700&family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Playfair+Display:ital,wght@0,400..900;1,400..900&family=Protest+Revolution&family=Quintessential&family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&display=swap"
        rel="stylesheet" />
    <?php wp_head(); ?>
</head>

<body <?php body_class(); ?>>
    <div class="site-container">
        <header class="site-header">

            <?php the_custom_logo(); ?>

            <input type="checkbox" id="nav-toggle" class="nav-toggle" aria-hidden="true">

            <label for="nav-toggle" class="nav-toggle-label">
                <span class="screen-reader-text">Toggle navigation</span>
                <span></span>
                <span></span>
                <span></span>
            </label>

            <?php
            wp_nav_menu(
                array(
                    'theme_location' => 'header',
                    'container' => 'nav',
                    'container_class' => 'site-nav',
                    'menu_class' => 'menu',
                    'before' => '',
                )
            );
            ?>

        </header>