Help with CSS

<!DOCTYPE>
<html>

<body>

    <div class = 'dropdown'>

    <button class = 'dropbtn'>Dropdown</button>

        <div class = 'dropdown-content'>

        <a href = '#'>Link 1 </a>

        <a href = '#'>Link 2 </a>

        <a href = '#'>Link 3</a>

        </div>

    </div>

    </body>

    <style>

        .dropbtn {

            padding: 16px 16px;
            font-family: sans-serif;
            cursor: pointer;
            background-color: white;
            color: black;
            border: 2px solid black;
            font-size: 15px;
            border-radius: 10px;
        }

        .dropdown-content {

            min-width: 160px;
            position: absolute;
            display: none;
            z-index: 1;
            box-shadow: 0px 16px 8px 0px rgba(0,0,0,2);
            background-color: #F5F1DE;

        }

        .dropdown-content a {

        padding: 12px;
        display: block;
        text-decoration: none;
        color: black;

        }

        .dropbtn:hover {color: black;}

        .dropbtn:hover {background-color: white;}

        .dropdown:hover .dropdown-content {display: block;}


    </style>

</html>