All about Music Home Page

<!DOCTYPE HTML>
<html>
  <head>
	<title>My Web Page</title>
    <script type="text/javascript" src="#"></script>
    <link href='https://fonts.googleapis.com/css?family=Righteous' rel='stylesheet' type='text/css'>
    <link href='https://fonts.googleapis.com/css?family=Abril+Fatface' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="http://s3.amazonaws.com/codecademy-content/courses/ltp/css/bootstrap.css">
    <link rel="stylesheet" href="style.css" type="text/css">
  </head>

<style>
.nav a {
  color: #5a5a5a;
  font-size: 15px;
  font-weight: bold;
  padding: 14px 10px;
  text-transform: uppercase;
  font-family: 'Righteous', cursive;
}

.jumbotron {
  background-image:url('http://goo.gl/yjDI8H');
  height: 700px;
}

.jumbotron h1 {
  color: black;
  font-size: 48px;
  font-family: 'Righteous', cursive;
  font-weight: bold;
  text-align: center;
}

.jumbotron p {
  font-size: 20px;
  color: black;
  text-align: center;
}

.learn-more {
  background-color: #f7f7f7;
}

.learn-more h3 {
  font-family: 'Righteous', cursive;
  font-size: 18px;
  font-weight: bold;
}

.learn-more a {
  color: #00b0ff;
}
.nav li {
 display:inline;
}

.jumbotron .container {
    position:relative;
    top:100px;
}


</style>



 <body>
<!--header-->
   <div class="nav">
     <div class="container">
      <ul class="pull-left">
        <li><a href="#">Home</a></li>
        <li><a href="#">Profile</a></li>
      </ul>
      <ul class="pull-right">
	<li><a href="#">Top Billboards</a></li>
        <li><a href="#">Song Collections</a></li>
        <li><a href="#">Downloads</a></li>
       </ul>
     </div>
   </div>


<!--header ends here-->

<!--main body text starts here-->
    <div class="jumbotron">
      <div class="container">
    <h1>
    All about Music
    </h1>
    <p>Stream your favorite songs in different genre.</p>
      </div>
    </div>
    <div class="learn-more">
      <div class="container">
        <div class="row">
	  <div clas="col-md-4">
            <h3>Stream Music</h3>
               <p>Listen music everywhere you are around the world.</p>
            <p><a href="#">Stream music here</a></p>
	  </div>
	  <div>
            <h3>Guitar Tabs</h3>
               <p>Learn the basic guitar tabs of the song for free.</p>
               <p><a href="#">Learn guitar tabs here</a></p>
	  </div>
	  <div>
            <h3>Play Guitar</h3>
               <p>Learn to play guitar online for free, no charges apllied.</p>
              <p><a href="#">Learn how to play guitar here</a></p>
	  </div>
        </div>
      </div>
    </div>
<br>
<p>Search Here</p>

<form action="https://goo.gl/a3HK6g">
	<input type="text" required placeholder="Enter text here">
	<button type="submit"> Search</button>
	</form>
	<p>Select song type</p>
	<form>
	<label><input type ="radio" name="old-modern">Old</label>
	<label><input type="radio" name="old-modern" checked >Modern</label>
	</form>

	<p>Select song genre</p>
	<form>
	<label><input type="checkbox" name="genre">Classical</label>
	<label><input type="checkbox" name"genre">Pop</label>
	<label><input type="checkbox" name="genre" checked >Rock</label>
	<label><input type="checkbox" name="genre">Others</label>
	</form>
 </body>
</html>