

.lead{
    color:#aaa;
}

.card{
  border: none;
  transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1);
  min-height:250px;
  box-shadow: 0 0 12px 0 rgba(0,0,0,0.2);

    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(10px) saturate(180%);
    -webkit-backdrop-filter: blur(10px) saturate(180%);
    border-radius: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.2);
  @media (max-width: 768px) {
      min-height:250px;
  }

  @media (max-width: 420px) {
      min-height:200px;
  }

  &.card-has-bg{
      transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1);
      background: url("../images/survey.png") bottom center no-repeat;
      background-size: max(25%);
      background-repeat:no-repeat;
      background-position: top left;
      &:before {
          content: '';
          position: absolute;
          top: 0;
          right: 0;
          bottom: 0;
          left: 0;
          background: inherit;
          -webkit-filter: grayscale(1);
          -moz-filter: grayscale(100%);
          -ms-filter: grayscale(100%);
          -o-filter: grayscale(100%);
          filter: grayscale(100%);}

      &:hover {
          padding-bottom: 10px;
          transform: scale(0.93);
          background: url("../images/survey.png") bottom right no-repeat;
          background-size: max(50%);
          transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1);


          .card-img-overlay {
              transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1);
              background: rgba(255, 186, 33, 0.1);
              background: linear-gradient(-40deg, rgba(255,186,33,0.3) 0%, rgba(49, 85, 161, 0.6) 100%);
              backdrop-filter: blur(100px)!important;
              -webkit-backdrop-filter: blur(100px)!important; /* fot Safari */
          }
      }
  }
  .card-footer{
      background: none;
      border-top: none;

  }
  .card-title{font-weight:400}

  .card-body{
      transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1);


  }
  &:hover {
      .card-meta{
          color: rgb(25, 135, 84);
          text-transform:uppercase;
          font-weight:900!important;
          letter-spacing:2px;
      }
      .card{
          backdrop-filter: blur(1000px)!important;
      }
      .card-body{
          margin-top:15px;
          transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1);
      }
      .card-footer{
          padding-bottom: 10px;
      }
      cursor: pointer;
      transition: all 600ms cubic-bezier(0.19, 1, 0.22, 1);
  }
  .card-img-overlay {
      transition: all 600ms cubic-bezier(0.19, 1, 0.22, 1);
      background: linear-gradient(135deg, rgba(176, 197, 255, 0.05), rgba(59, 81, 166, 0.2));
      background: rgba(19, 66, 135, 0.2);
      backdrop-filter: blur(20px) saturate(180%);
      -webkit-backdrop-filter: blur(20px) saturate(180%);
      border-radius: 1rem;
      border: 1px solid rgba(255, 255, 255, 0.25);
  }
}

.card-meta{
    text-transform:uppercase;

}

.btn-group > .btn.dropdown-toggle:first-child{
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    border-bottom-left-radius: 1rem !important;
}

.btn-group > .btn:last-child{
    border-bottom-right-radius: 1rem !important;


}