html

<!DOCTYPE html>
<html>
    <head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="style.css">

    <style>
        body {
            background-image: url('pictures/wallpaper/wallpaper4.jpeg');
            background-repeat: no-repeat;
            background-attachment: fixed;
            background-size: cover;
        }
</style>
    <title> CyberCademy.al </title>

    </head>

    <body>

        <div id="mySidenav" class="sidenav">
            <a href="javascript:void(0)" class="closebtn" onclick="closeNav()">&times;</a>
            <a href="#about">About Us</a>
            <a href="#services">Services</a>
            <a href="#login">Sign In/Sign up</a>
            <a href="#contact">Contact</a>

            <button class="dropdown-btn">Dropdown
                <i class="fa fa-caret-down"></i>
            </button>

            <div class="dropdown-container">
                <a href="#">Link 1</a>
                <a href="#">Link 2</a>
                <a href="#">Link 3</a>
            </div>
            <a href="#contact">Search</a>
        </div>
    <span style="font-size:30px;cursor:pointer;position: relative;x" onclick="openNav()">&#9776; open</span>

    <script src="scripts.js"> </script>

    </body>

</html>