body {
  margin: 0;
  padding: 0;
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  font-style: normal;
  background: linear-gradient(to right, #afeeee 0%, #fff 100%);
}

.logo {
  height: 80px;
  width: 80px;
  object-fit: cover;
  border-radius: 100%;
  overflow: hidden;
}
#site-header {
  padding: 20px;
}

.social-icons {
  list-style: none;
  padding-left: 0;
  text-align: right;
  margin-bottom: 0;
}
.social-icons li {
  display: inline-block;
}
.social-icons li a {
  font-size: 40px;
  padding-left: 10px;
  padding-right: 10px;
  color: #515151;
}

.section-title {
  font-family: sans-serif;
  color: skyblue;
  text-decoration: underline;
  font-size: 40px;
}
.social-icons li a:hover {
  color: black;
  transition: 0.3s ease-in;
}

#masthead {
  width: 100%;
  border: 2px solid #c0c0c0;
  border-radius: 15px;
  overflow: hidden;
}

#masthead .featured-article {
  padding: 25px;
  position: relative;
  height: 600px;
}

#masthead img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#masthead .featured-article-title {
  background-color: rgba(16, 16, 16, 0.5);
  text-align: center;
  color: #fff;
  position: absolute;
  bottom: 25px;
  right: 25px;
  left: 25px;
}
.featured-article-title {
  /* font-weight: bold; */
  margin-bottom: 0;
  align-content: center;
  height: 60px;
}
.nav {
  list-style-type: none;
  display: flex;
  justify-content: space-around;
  align-items: center;
  font-size: 1.3rem;
  padding: 0px;
}
.icon {
  font-size: 1.8rem;
  margin-right: 10px;
}
.highlight {
  font-weight: 300;
  color: #fff;
}
.articles {
  border: 2px solid #c0c0c0;
  border-radius: 15px;
  overflow: hidden;
}
.articles nav {
  display: flex;
  justify-content: space-evenly;
  padding: 25px 20px;
  border-bottom: 2px solid #c0c0c0;
}
.articles nav a {
  display: flex;
  justify-content: space-evenly;

  /* margin: 20px; */
  text-decoration: none;
  color: #515151;
  font-weight: 600;
}
.articles nav a:hover {
  color: #666;
  transition: 0.2s ease-in;
}
.articles nav a:last-child {
  margin-right: 0px;
}
.articles nav a.is-active {
  color: #f00;
}
.subheading {
  font-weight: bold;
  text-transform: uppercase;
  margin-top: 50px;
}

.posts .post img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  overflow: hidden;
}

.articles .posts {
  /* background-color: rgb(248, 249, 250); */
  padding: 20px;
}
.articles .post {
  overflow: hidden;
}
.dotted-list {
  margin-bottom: 20px;
}
.sidebar {
  /* background-color: white; */
  border: 2px solid #c0c0c0;
  border-radius: 15px;
  overflow: hidden;
}
#content {
  margin: 100px 0;
  overflow: hidden;
}

.sidebar form {
  padding: 17px 20px;
  border-bottom: 2px solid #c0c0c0;
  position: relative;
}

.lower-block {
  /* background-color: rgb(248, 249, 250); */
  overflow: hidden;
  padding: 20px;
}
.latest-themes {
  list-style: none;
  padding-left: 0;
}
.theme-one {
  margin-bottom: 20px;
}

.sidebar form input,
.sidebar form button {
  border: 0;
  padding: 0;
}
.sidebar form input.search {
  width: 100%;
  background-color: #d6d6d6;
  padding: 8px 20px;
  border-radius: 30px;
  outline: 0;
}
.sidebar form button {
  position: absolute;
  right: 33px;
  bottom: 22px;
  background: none;
  font-size: 20px;
}
.footer {
  border: 2px solid #c0c0c0;
  border-radius: 15px;
  padding: 25px;
  max-width: 100%;
  margin: 0;
  overflow: hidden;
  margin-bottom: 10px !important;
}

.number {
  float: left;
  margin-top: 15px;
}

@media screen and (max-width: 800px) {
  #masthead .featured-article {
    height: 200px;
  }
}
@media screen and (max-width: 800px) {
  #masthead .featured-article-title {
    height: 30px;
  }
}
@media screen and (max-width: 800px) {
  .icon {
    height: 20px;
    font-size: 13px;
  }
}
@media screen and (max-width: 800px) {
  .nav {
    height: 20px;
    font-size: 8px;
  }
}
#success-message {
  margin-top: 20px;
  padding: 15px;
  color: #20a83f;
  background-color: #d4edda;
  border: 1px solid #c3e6cb;
  border-radius: 5px;
  text-align: center;
}
