Align contents at the center with css

I am trying to create a google search look-alike, and while trying to arrange the contents at the center, I get them superimposed on each other. Is there a way to get them in an arranged format dropwise?

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>Search</title>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="style.css">
        <style> 
            .center {
 
               height: 100vh;
               position: relative;
    
            } 

           .center > div {
                margin: 0;
                position: absolute;
                top: 50%;
                left: 50%;
                margin-right: -50%;
                transform: translate(-50%, -50%) 
                }
         <style>

    </head>
    <body>
        <div class="container">
            <div class="links">
                <a href="googleImageSearch.html">Google Image Search</a>
                <a href="gooleAdvancedSearch.html">Google Advanced Search</a>
            </div>
            <br>
            <div class="center">
                <div class="logo">
                    <img src="https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png" alt="Google" width="272" height="92">
                </div>
                <br>
                <div>
                    <form action="https://google.com/search">
                        <input type="text" name="q">
                        <div class="buttons">
                            <input type="submit" value="Google Search">
                            <input type="button" value="I'm Feeling Lucky">
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </body>
</html>

Solution

I suggest you :

.center{
   margin:0 auto;
 }

this should center your div in the center of page, if you want more space between the div and the top of the page Now that i see you have nested div with different style, so put the margin:0 auto; inside container class to center all your elements, and delete the position relative. or in the "center" class remove all and replace it with my code