index.html

<html>
    <head>
        <title>Study Welfare Tutorials</title>
        <style>

            body {
              margin: 0;
              font-family: Arial, Helvetica, sans-serif;
            }
            
            .logo {
              display: inline-block;
              vertical-align: top;
              
              margin-right: 20px;
              margin-top: 0px; 
              margin-left: 1137px;
                 /* if you want it vertically middle of the navbar. */
            }
            
            .topnav {
              overflow: hidden;
              background-color: rgb(127, 188, 241);
            }
            
            .topnav a {
              float: left;
              color: #0f0f0f;
              text-align: center;
              padding: 20px 16px;
              text-decoration: none;
              font-size: 17px;
            }
            
            .topnav a:hover {
              background-color: #0585cf;
              color: rgb(221, 222, 223);
            }
            
            .topnav a.active {
              background-color: #0585cf;
              color: black;
            }

        </style>
        
    </head>
    <body style="background-color:aliceblue">
         <div class="topnav">
            <img class="logo" src="logo1.jpg" style="width: 60px;">
            <a class="active" href="#home">Home</a>
            <a href="#news">News</a>
            <a href="https://accounts.google.com/b/0/AddMailService" target="_blank">Contact</a>
            <a href="#about">About</a>
          </div>
        
    </body>
</html>