html {
    height: 100%;
    width: 100%;
    padding: 0;
    margin: 0;
  }

  /* Header/Blog Title */
  .head {
    height: 25vh;
    width: 100%;
  }
  .bg {
    height: 100%;
    width: 100%;
    background-image: url('/Images/Youtube.jpeg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }

  /* Style the top navigation bar */
  .topnav {
    overflow:auto;
    background-color: #333;
  }
  .topnav a.active {
    background-color: #4CAF50;
    color: white;
  }
  .topnav .icon {
    display: none;
  }
  .topnav .home {
    float:left;
  }
  /* Style the topnav links */
  .topnav a {
    float:right;
    display: block;
    color: #f2f2f2;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 17px;
  }

  /* Change color on hover */
  .topnav a:hover {
    background-color: #ddd;
    color: black;
  }

  /* Body */
  body {
    position: relative;
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
  }

  /* Footer */
    .footer {
      padding:10px;
      text-align: center;
      background: transparent;
      margin-top:10px;
      left:0;
      bottom:0;
      width: 100%;
    }

  /* Responsive layout - Large screen */
  @media screen and (min-width: 1200px) {
    .head {
      height: 35vh;
    }
    .bg {
      max-height: 35vh;
    }
  }

  /* Responsive layout - when the screen is less than 600px wide, make the navigation links stack on top of each other instead of next to each other */
  @media screen and (max-width: 550px) {
    .topnav a:not(:first-child) {display: none;}
    .topnav a.icon {
      float: right;
      display: grid;
    }
  }

  @media screen and (max-width: 550px) {
    .topnav.responsive {position: relative;}
    .topnav.responsive .icon {
      position: absolute;
      right: 0;
      top: 0;
    }
    .topnav.responsive a {
      float: none;
      display: grid;
      text-align: center;
    }
    .footer {
      padding:10px;
      text-align: center;
      background: transparent;
      margin-top:10px;
      left:0;
      bottom:0;
      width: 100%;
    }
  }