JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>

<div class="container-fluid">
            <div class="row bg" style="background: green;">
                <div class="col-12">
                    <nav class="navbar navbar-light navbar-expand-lg">
                        <a class="navbar-brand" href="?pagina=inicio">
                            <img src="img/logo2.png" width="200" height="40"
                                 class="d-inline-block align-top">
                        </a>
                        <button class="navbar-toggler" type="button" data-toggle="collapse"
                                data-target="#nav1" aria-controls="nav1" aria-expanded="false" aria-label="Navegação Toggle">
                            <span class="navbar-toggler-icon"></span>
                        </button>
                        <div class="collapse navbar-collapse" id="nav1">
                            <ul class="navbar-nav">
                                <li class="nav-item">
                                    <a href="?pagina=inicio" class="nav-link">Início</a>
                                </li>
                                <li class="nav-item">
                                    <a href="?pagina=quem_somos" class="nav-link">Saiba mais!</a>
                                </li>
                                <li class="nav-item">
                                    <a href="?pagina=placar" class="nav-link">Placar</a>
                                </li>
                                <li class="nav-item">
                                    <a href="?pagina=contato"...