Uncaught TypeError: Cannot read property 'style' of null

Здраствуйте, у меня появилась проблема - Uncaught TypeError: Cannot read property 'style' of null

function showSignin () {
    var container = document.querySelector('.container');
    var form = document.createElement('div');
    form.className = 'signin';
    form.innerHTML = '<div id="gray"></div><div class="window"><img class="close" src="../img/cancel-cross.svg" onclick="closeSignin()"><div class="form"><h2 style="color: #E8BB49;">Авторизация</h2><form method="post" action="includes/authorization.php"><br /><input type="text" name="username" required placeholder="Имя пользователя" class="input__authorization"><br /><br /><input type="password" name="password" required placeholder="Пароль" class="input__authorization"><br /><br /><button type="submit" name="button" style="background: #E8BB49; border: 1px solid #E8BB49; border-radius: 4px; color: #403C3C; width: 300px; height: 40px; font-size: 24px;">Войти</button></form></div></div>';
    var gray = document.getElementById('gray');
    gray.style.backgroundColor = 'rgba(1, 1, 1, 0.75)';
    gray.style.position = 'fixed';
    gray.style.left = 0;
    gray.style.right = 0;
    gray.style.top = 0;
    gray.style.bottom = 0;
    gray.style.zIndex = -1;
    gray.style.display = 'none';
    container.insertBefore(form, container.children[0]);
    gray.style.display = 'block';
}