.brains__block {
  margin-top: -30px;
  padding: 30px 60px 50px;
  box-shadow: 0 0 10px 0 rgba(17, 17, 17, 0.3);
  background-color: #fafafa;
  text-align: center;
  .container {
    .brains__heading-block {
      h1 {
        font-family: "Roboto";
        font-size: 32px;
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        line-height: normal;
        letter-spacing: normal;
        text-align: center;
        color: #111111;
        margin: 0 0 5px 0;
      }
      h2 {
        font-family: "Roboto";
        font-size: 18px;
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        line-height: normal;
        letter-spacing: normal;
        text-align: center;
        color: #111111;
        margin: 0;
      }
      .search__contributors {
        position: relative;
        display: inline-block;
        width: 360px;
        margin-top: 30px;
        padding: 10px;
        border: 2px solid #ccc;
        input {
          font-family: "Roboto";
          border: none;
          background-color: transparent;
          min-width: 310px;
          &:hover,
          &:focus,
          &:active {
            outline: none;
          }
          &::placeholder {
            font-family: "Roboto";
            font-size: 14px;
            font-weight: 500;
            font-stretch: normal;
            font-style: normal;
            line-height: normal;
            letter-spacing: 0.23px;
            color: #a1a1a1;
          }
        }
        button {
          border: none;
          background-color: transparent;
          color: #cccccc;
          width: 20px;
          padding: 0;
          &:hover,
          &:focus,
          &:active {
            outline: none;
          }
        }
      }
    }
  }
}

.authors__grid {
  padding: 30px 0 0 0;
  &.second {
    padding: 40px 0;
  }
  &.search_results {
    .container {
      .headgeeks__block {
        .headgeek__item {
          &.search__result-item {
            flex-basis: calc(25% - 22.5px);
            margin-right: 30px !important;
            &:nth-child(4n + 4) {
              margin-right: 0 !important;
            }
          }
        }
      }
    }
    h3 {
      display: inline-block;
    }
    button {
      position: relative;
      top: 10px;
      float: right;
      background-color: transparent;
      border: none;
      font-family: "Roboto";
      font-size: 14px;
      font-weight: 500;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: 0.23px;
      color: #111111;
    }
    .empty__results {
      padding: 30px 0 100px 0;
      h5 {
        font-family: "Roboto";
        font-size: 18 px;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: normal;
        letter-spacing: 0.23px;
        color: #111111;
        margin: 0;
      }
    }
  }
  .container {
    .headgeeks__title {
      h3 {
        font-family: "Roboto";
        font-size: 24px;
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        line-height: normal;
        letter-spacing: normal;
        color: #111111;
        margin: 0;
      }
      img {
        width: 100%;
      }
    }
    .headgeeks__block {
      display: flex;
      flex-wrap: wrap;
      width: 100%;
      padding-top: 20px;
      .headgeek__item {
        flex-basis: calc(25% - 22.5px);
        margin-right: 30px;
        &:nth-child(4n + 4) {
          margin-right: 0 !important;
        }
        img {
          &.useravatar {
            width: 100%;
            height: auto !important;
            border-radius: 0 !important;
            text-align: center;
            float: none;
          }
        }
        h4 {
          font-family: "Roboto";
          font-size: 16px;
          font-weight: 500;
          font-stretch: normal;
          font-style: normal;
          line-height: normal;
          letter-spacing: normal;
          text-align: center;
          color: #006482;
          margin: 12px 0 20px 0;
        }
      }
    }
  }
}

@media screen and (min-width: 991px) {
  .brains__block {
    .container {
      max-width: 750px;
      width: 750px !important;
    }
  }
  .authors__grid {
    .container {
      max-width: 750px;
      width: 750px !important;
    }
  }
}
@media screen and (max-width: 991px) {
  .brains__block {
    .container {
      max-width: 750px;
      width: 100% !important;
    }
  }
  .authors__grid {
    .container {
      max-width: 750px;
      width: 100% !important;
    }
  }
}

@media screen and (min-width: 768px) {
  .authors__grid {
    .container {
      .headgeeks__block {
        .headgeek__item {
          img {
            &.useravatar {
              object-fit: cover;
              height: 175.5px !important;
            }
          }
        }
      }
    }
  }
}

@media screen and (max-width: 768px) {
  .brains__block {
    padding: 30px 0 50px 0;
    .container {
      .brains__heading-block {
        h1 {
          font-size: 24px;
        }
        h2 {
          font-size: 16px;
        }
        .search__contributors {
          width: 100%;
          max-width: 360px;
          input {
            width: 75%;
            min-width: auto !important;
          }
          button {
            width: 20%;
            text-align: right;
          }
        }
      }
    }
  }
  .authors__grid {
    .container {
      .headgeeks__title {
        h3 {
          font-size: 18px;
        }
      }
      .headgeeks__block {
        .headgeek__item {
          flex-basis: calc(50% - 5px);
          margin-right: 10px;
          &:nth-child(2n + 2) {
            margin-right: 0 !important;
          }
          h4 {
            font-size: 14px;
          }
        }
      }
    }
  }
}