themes/docsy/assets/scss/_custom_downloads.scss

.td-downloads {
  #download-the-last-version {
    border-bottom: none;
  }


  .flex-center {
    display: flex;
    align-items: center;

  }

  .card-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding-top: 1em;

    .item {
      width: 48%;
      margin: 0 1% 24px 0;

      &:hover {
        box-shadow: 0 0 8px #cccccc5e;
      }
      img:hover{
        cursor: auto!important;
      }
    }

    .btn {
      background-color: #eee;
      background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fcfcfc), to(#eee));
      background-image: linear-gradient(to bottom, #fcfcfc 0, #eee 100%);
      background-repeat: no-repeat;
      border: 1px solid #d5d5d5;
      border-radius: 4px;
      font-size: 16px;
      height: 30px;
      font-weight: 600;

      &:hover {
        text-decoration: none;
        background-color: #ddd;
        background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #eee), to(#ddd));
        background-image: linear-gradient(to bottom, #eee 0, #ddd 100%);
        border-color: #ccc;
      }
    }

    .btn-sm {
      padding: 0 0.5rem;
    }

    .btn-group {
      margin-left: 6px;
    }

    .btn-group.show .dropdown-toggle {
      box-shadow: none;
    }

    .btn:not(:disabled):not(.disabled):active:focus, .btn.active:not(:disabled):not(.disabled):focus {
      box-shadow: none;
    }

    .btn:focus, .btn.focus {
      outline: 0;
      box-shadow: none;
    }

    .card-body {
      padding-bottom: 50px;
      position: relative;
    }

    .doc-box {
      padding: 0 1.25rem;
      //padding: 0 0.8rem;
      //padding: 0;
      display: flex;
      width: 100%;
      align-items: center;
      justify-content: space-between;
      bottom: 20px;
      left: 0;
      position: absolute;
    }

    .dropdown-menu {
      min-width: 6rem;
      //width: 100%;
    }

    .dropdown-header {
      color: #222;
      font-size: 16px;
      padding: 0.5rem 1.5rem 0;

      > span {
        font-size: 12px;
        color: #ccc;
      }
    }

  }

  .title-box {
    display: flex;
    //justify-content: center;
    align-items: center;
    padding-bottom: 10px;

    .card-title {
      margin: 0;
      font-size: 18px;
      color: #000;
      padding: 0 0 0 14px;
    }

    .icon {
      width: 40px;
      height: 40px;
      line-height: 40px;
      text-align: center;
      background-color: #eff0f3;
      color: #0091ff;
      border-radius: 50%;
      font-weight: 600;
      font-size: 26px;
    }
  }


}

.dropdown-item.active, .dropdown-item:active {
  background: none;
  color: inherit;
}

@media (max-width: 996px) {
  .td-docs {
    //.card-wrapper {
    //  .item {
    //    width: 48%;
    //  }
    //}
  }
}

@media (max-width: 768px) {
  .td-downloads {
    .card-wrapper {
      .item {
        width: 100%;
      }

      .dropdown-header {
        padding: 0.5rem 0.5rem 0;
      }

      .dropdown-item {
        padding: 0.5rem 0.5rem 0;
      }
    }
  }
}