Untitled

<!DOCTYPE html>
<html lang="en">
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1..0">
        <title>document</title>
        <style>
            .d-flex{
                display: flex;
            }
            .meun div{
                margin-right: 20px;
                color: green;
            }
      .nav{
        display: flex;
        justify-content: space-between;
        color:green; 
      } 
         body{
        margin: 0.30px;
        background-image:  url('image/motto.jpg');
      }
      .hero-text{
        font-size: 55px;
        text-align: center;
      }
      .hero-box{
        width: 300px;
        margin: auto;
        margin-bottom: 10px;
    }
    .search-bar{
         height: 40px;
         width: 300px;
         border-radius: 5px;
         border: 1px #b8b4b4;
         padding: 10px;

    }
    .search-button{
        background: #19806f;
        border: none;
        border-radius: 5px;
    }
        </style>
    </head>
    <body>
        <nav class="d-flex nav">
            <h1 class="hero-text">
                WealthCars
            </h1>
            <div class="d-flex meun">
                <div><a href="http://goggle.com">Blog</a></div>
                <div><a href="http://goggle.com">Contact</a></div>
                   <div><a href="http://goggle.com">Shop</a></div>
                <div><a href="http://goggle.com">Quiz</a></div>
          </div>
          <div>
        </nav>
        <!--//search bar-->
        <div class="hero-box">
            <h3 class="hero-text">
                We Giving You The Best
            </h3>
            <div class="d-flex">
            <input type="text" class="search-bar"placeholder="search for type of cars"> 
            <button class="search-button">search cars</button>
        </div>
        <form>
            <table>
                <tr>
                    <td>USERNAME</td>
                    <td> <input type="text" placeholder="USERNAME" name="USERNAME" style="color:red; background-color: greenyellow;"></td>
                </tr>
                <tr>
                    <td>PASSWORD</td>
                  <td><input type="text" placeholder="PASSWORD" name="PASSWORD" style="color:red; background-color: greenyellow;"></td>
                </tr>
            </table>
            <button class="login-button"> LOGIN</button>
        </form>
    </body>
</html>
Editor is loading...