/*body{*/
/*  !* Created with https://www.css-gradient.com *!*/
/*  background: #161616;*/
/*}*/
h1{
  color:#fff;
}
.lead{
  color:#aaa;
}

/*.wrapper{margin:10vh}*/

  .card{
    border: none;
    transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1);
    overflow:hidden;
    border-radius:20px;

    width:450px;
    height:250px;

    box-shadow: 0 0 12px 0 rgba(0,0,0,0.2);

    /*@media (max-width: 768px) {*/
    /*  min-height:350px;*/
    /*}*/

    /*@media (max-width: 420px) {*/
    /*  min-height:300px;*/
    /*}*/

    &.card-has-bg{
      transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1);
      background-size:120%;
      background-repeat:no-repeat;
      background-position: center center;
      &: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 {
        transform: scale(0.98);
        box-shadow: 0 0 5px -2px rgba(0,0,0,0.3);
        background-size:130%;
        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: var(--blue-root-color);
          background: linear-gradient(0deg, rgba(4, 73, 123,0.3785889355742297) 0%, rgba(4, 73, 123) 100%);
        }
      }
    }
    .card-footer{
      background: none;
      border-top: none;
      .media{
        img{
          border:solid 3px rgba(255,255,255,0.3);
        }
      }
    }
    .card-title{font-weight:800}
    .card-meta{color:rgba(0,0,0,0.3);
      text-transform:uppercase;
      font-weight:500;
      letter-spacing:2px;}
    .card-body{
      transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1);


    }
    &:hover {
      .card-body{
        margin-top:5px;
        transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1);
      }
      .card-icon{
        margin-top:5px;
        transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1);
      }
      cursor: pointer;
      transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1);
    }
    .card-img-overlay {
      transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1);
      background: var(--red-root-color);
      background: linear-gradient(0deg, rgba(172, 20, 30,0.3785889355742297) 0%, rgba(172, 20, 30) 100%);
    }
  }
@media (max-width: 767px){

}

/******************************************************/
.container-card {
  display: flex;
  justify-content: center;
  margin-top: 40px;
  margin-bottom: 40px;

}
.card-box{
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  margin: 0 auto;
}
.card-css {
  width: 150px;
  height: 50px;
  max-height: 50px;
  /*transform-style: preserve-3d;*/
      /*perspective: 500px;*/
  border: none;
  cursor: pointer;
  background-color: inherit;
  padding: 20px 20px;
}
.card-label{
  color: var(--card-title-color);
}