<html>
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">

		<meta name="description" content=" An easy first pageid" />
		<meta name="keywords" content="html inline css, hover, responsive" />
		<meta name="author" content="BITS" />
    
     <title>Hello World</title>
    
<!-- We can link to a favicon here -->
<!-- We would link to an external stylesheet here, we'll use simple inline styles for this tutorial -->
    <style>
            body {background-color:                    #558C89;
      font-family:Arial, sans-serif;}
      h1 { color:#D9853B;}
      p {color:black;
          padding-left:0.5em;}
      li {color:navy;}
      a {color:black; text-decoration:none;}
      a:hover {background-color: #D9853B;
                color:red;}
      .container {height:90%;}
      .clearfix {margin:0 auto;}
      .main {}
      .navigation {background-color:#74AFAD;}

    </style>
<!-- We might link to, or embed javascript we want to run on page load here -->

	</head>
  <body>
		<div class="container">
			<header class="clearfix">
	
				<h1>Tutorial #1 Basic HTML & CSS</h1>

			</header>

      <div class="main">
        <div class="navigation">
          
    <section class="layout">
      
    <ul class="nav">
      <li><a href="#">home</a></li>
      <li><a href="#">about us</a></li>
      <li><a href="#">services</a></li>
      <li><a href="#">blog</a></li>
      <li><a href="#">contact us</a></li>
    </ul>
    </section><!-- /layout -->
          
    </div><!-- /navigation -->
        
        <p>Great copy makes a website worth     visiting.</p>
      </div><!-- /main -->
    </div><!--/container -->
      </body
    </html>

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.