challenge.html

<!DOCTYPE html>
<html>
  <head>
    <title>cleartrip</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <style>
      *{
        box-sizing: border-box;
      }
      body{
        font-family: Arial, Helvetica, sans-serif;
      }
      header{
        background-color: blanchedalmond;
      }
      section{
        display: -webkit-flex;
        display: flex;
      }
      nav{
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        background: #ccc;
        
      }
      article {
        -webkit-flex: 3;
        -ms-flex: 3;
        flex: 3;
        background-color: #f1f1f1;
        padding: 10px;
      }
      footer {
        background-color: #777;
        padding: 10px;
        text-align: center;
        color: white;
      }
      @media (max-width: 600px) {
        section {
        -webkit-flex-direction: column;
        flex-direction: column;
      }

    </style>
  </head>
  <body>

  </body>

</html>