.boxDiv{
 background: $gray-100;
 &.news-topics{
    h5.head {
     @include media-breakpoint-down(md) { 
      font-size: 18px;
      padding: 15px 18px;
     }
    }
 }
 h5.head {
  line-height: 1;
  padding: 10px 18px;
  margin: 0;
  font-size: 16px;
 }
 ul {
  padding: 15px 0 20px 0;
 }
 ul.links {
  a{
      margin: 0 15px 10px 18px;
      position: relative;
      color: $body-color;
      display: block;
      padding-left: 25px;
      font-size: 14px;
      &:hover{
        color: $primary;
        &:before {
          color: $primary;
        }
      }
      &:before{
          position: absolute;
          content: "\e92f";
          left: 0;
          top: 0;
          font-family: 'icomoon' !important;
          top: 3px;
          font-size: 11px;
      }
   }
 }
  @include media-breakpoint-up(lg) {

     &.popular-news{
      li {
        padding-bottom: 12px;
        margin-bottom: 12px;
        border-bottom: 1px solid $gray-200;
        margin: 0 18px;
        margin-bottom: 12px;
        &:last-child {
          border-bottom: none;
          margin-bottom: 0;
        }
        h5 {
          font-size: 15px;
          a{
            color: $gray-700;
          }
          p {
            font-size: 13px;
          }
        }
      }
     }
  }

  &.popular-news{
    @include media-breakpoint-down(md) {
     background: none;
     h5.head{
      background: none !important;
      padding: 0;
      color: $green !important;
      font-size: 18px;
     }
      li {
        box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.04);
        padding: 15px;
        margin-bottom: 12px;
        h5 {
          font-size: 15px;
          a{
            color: $dark;
          }
        }
      }
    }
  }
}