

/* --------------- NAV RULES ---------------*/

.nav {
  margin: 0 auto;
}

/* --------------- INTRO RULES ---------------*/

.intro {
  border: 0.2rem solid black;
}

.website-description {
  background: grey;
  height: 40rem;
  border-bottom: 0.2rem solid black;
}

/* --------------- BLOG RULES ---------------*/

.featured-blog {
  border: 0.2rem solid black;
}

.blog-reference {
  text-align: center;
  font-size: 4rem;
}

.logo {
  height: 8rem;
  background: black;
  position: relative;
  top: 4rem;
  overflow: visible;
}

/* --------------- HEADER RULES ---------------*/

header {
  max-width: auto;
  height: 8rem;
  border-bottom: 0.2rem solid black;
}

.logo {
  height: 8rem;
  background: black;
}

/* --------------- FOOTER RULES ---------------*/

footer {
  max-width: auto;
  height: 8rem;
  border-top: 0.2rem solid black;
}

/* --------------- FOOTER RULES ---------------*/

@media (min-width: 400px) {
  .featured-blog, 
  .intro {
    margin-bottom: 4rem;
    margin-top: 8rem;
  }

  .logo {
  position: relative;
  top: 4rem;
  overflow: visible;
  }

}


/* --------------- NAV RULES ---------------*/

.nav {
  margin: 0 auto;
}

.logo {
  height: 8rem;
  background: black;
  position: relative;
  top: 4rem;
  overflow: visible;
}

/* --------------- INTRO RULES ---------------*/

.intro {
  border: 0.2rem solid black;
}

.website-description {
  background: grey;
  height: 40rem;
  border-bottom: 0.2rem solid black;
}


/* --------------- BLOG RULES ---------------*/

.featured-blog {
  border: 0.2rem solid black;
}

.blog-reference {
  text-align: center;
  font-size: 4rem;
}

.blog-summary p {
  display: none;
}

/* --------------- HEADER RULES ---------------*/

header {
  max-width: auto;
  height: 8rem;
  border-bottom: 0.2rem solid black;
}

.logo {
  height: 8rem;
  background: black;
}

/* --------------- FOOTER RULES ---------------*/

footer {
  max-width: auto;
  height: 8rem;
  border-top: 0.2rem solid black;
}

/* --------------- FOOTER RULES ---------------*/

@media screen and (min-width: 550px) {
  .featured-blog, 
  .intro {
    margin-bottom: 4rem;
  }

  .intro {
    margin-top: 8rem;
  }

  .logo {
  position: relative;
  top: 4rem;
  overflow: visible;
  }

  .blog-summary p {
  display: block;
}

}
Add screen param to media query
Add screen param to media query
