@import url("https://fonts.googleapis.com/css2?family=Lato:wght@700&family=Open+Sans&display=swap");
/*Width for all icons*/
/* Base colors*/
/*  Media query variables */
/** Media query **/
/* (max-width: 480px) */
/* (max-width:1024px) */
/* (max-width: 1400px) */
/* (max-width: 1024) */
/* (min-width: 1024) */
/* (max-width: 595px) */
/* (max-width: 767px) */
/* (min-width: 596px), (max-width: 767px) */
/* (min-width: 1024px), (max-width: 1270px) */
/*  (max-width:480px) */
/* (min-width: 1270px), (max-width:1336px) */
/* (min-width: 1024px), (max-width: 1150px) */
/*  (min-width:481px), (max-width: 595px) */
/* (min-width: 768px), (max-width: 991px) */
/* (min-width:992px), (max-width: 1024px) */
/* (min-width:992px), (max-width: 1336px) */
/* (min-width:992px), (max-width: 1200px) */
/* (min-width:1151px), (max-width: 1600px) */
/* (max-width: 1600px) */
/*  (min-width:768px), (max-width: 991px) */
/*  (min-width:596px), (max-width: 767px) */
/*  (min-width:481px), (max-width: 595px) */
/* (min-width:1399px) */
/* (max-width:1600px) */
/* (max-width:1150px) */
/* (min-width:1150px) */
/* (max-width:1270px) */
/* (min-width:1271px) */
/*  (max-width:1356px) */
/*  Media query mixins
   (min-width:1336px) */
/* (max-width:1336px) */
/*  (min-width:992px) */
/* (max-width:991px) */
/* (max-width:767px) */
/* (min-width:768px) */
/* (max-width:595px) */
/* (min-width:596px) */
/*  (max-width:320px) */
/*  (max-width:480px) */
.resource-cards {
  padding: 75px 0; }
  @media (min-width: 1024px) and (max-width: 1150px) and (orientation: landscape) {
    .resource-cards {
      padding: 60px 0; } }
  @media (min-width: 992px) and (max-width: 1024px) {
    .resource-cards {
      padding: 60px 0; } }
  @media (max-width: 991px) {
    .resource-cards {
      padding: 50px 0; } }
  .resource-cards .intro {
    max-width: 100%;
    width: 100%;
    text-align: center;
    margin-bottom: 50px;
    position: relative; }
    @media (max-width: 991px) {
      .resource-cards .intro {
        margin-bottom: 30px; } }
    .resource-cards .intro h2 {
      color: #333333; }
  .resource-cards .grid-wrap {
    width: 100%;
    margin: 0 auto;
    display: grid;
    grid-template-columns: auto auto;
    position: relative;
    margin-bottom: 50px;
    -webkit-column-gap: 25px;
       -moz-column-gap: 25px;
            column-gap: 25px;
    row-gap: 20px; }
    @media (min-width: 1024px) and (max-width: 1150px) and (orientation: landscape) {
      .resource-cards .grid-wrap {
        margin-bottom: 30px; } }
    @media (min-width: 992px) and (max-width: 1024px) {
      .resource-cards .grid-wrap {
        margin-bottom: 30px; } }
    @media (min-width: 768px) and (max-width: 991px) {
      .resource-cards .grid-wrap {
        margin-bottom: 30px; } }
    @media (max-width: 767px) {
      .resource-cards .grid-wrap {
        grid-template-columns: 100%;
        row-gap: 15px; } }
    @media (min-width: 596px) and (max-width: 767px) {
      .resource-cards .grid-wrap {
        margin-bottom: 15px; } }
    @media (min-width: 481px) and (max-width: 595px) {
      .resource-cards .grid-wrap {
        margin-bottom: 15px;
        width: 100%;
        margin-left: 0; } }
    @media (max-width: 480px) {
      .resource-cards .grid-wrap {
        margin-bottom: 10px;
        width: 100%;
        margin-left: 0; } }
  .resource-cards .card-wrap {
    position: relative;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    padding: 25px;
    background-color: #ffffff; }
    @media (min-width: 992px) and (max-width: 1024px) {
      .resource-cards .card-wrap {
        padding: 20px; } }
    @media (max-width: 991px) {
      .resource-cards .card-wrap {
        padding: 20px 50px 20px 30px; } }
    .resource-cards .card-wrap:hover {
      background-color: #af272f; }
    .resource-cards .card-wrap:hover {
      background-color: #af272f; }
      .resource-cards .card-wrap:hover .content span {
        color: #ffffff; }
      .resource-cards .card-wrap:hover .content h4 {
        color: #ffffff; }
    .resource-cards .card-wrap a.link {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      font-size: 0; }
    .resource-cards .card-wrap a.edit-link {
      position: absolute;
      bottom: -20px;
      left: 0; }
    .resource-cards .card-wrap.bg-grey {
      background-color: #ebebeb; }
      .resource-cards .card-wrap.bg-grey:hover {
        background-color: #af272f; }
        .resource-cards .card-wrap.bg-grey:hover span {
          color: #ffffff; }
        .resource-cards .card-wrap.bg-grey:hover h4 {
          color: #ffffff; }
      .resource-cards .card-wrap.bg-grey:last-child {
        margin-bottom: 0; }
    .resource-cards .card-wrap span {
      font-size: 14px;
      color: #292929;
      margin-bottom: 10px;
      -webkit-transition: all 0.3s ease-in-out;
      transition: all 0.3s ease-in-out; }
    .resource-cards .card-wrap h4 {
      color: #ffffff;
      margin-bottom: 20px;
      color: #af272f;
      -webkit-transition: all 0.3s ease-in-out;
      transition: all 0.3s ease-in-out; }
      @media (min-width: 1210px) {
        .resource-cards .card-wrap h4 {
          font-size: 22px; } }
      @media (max-width: 991px) {
        .resource-cards .card-wrap h4 {
          margin-bottom: 0; } }
    .resource-cards .card-wrap.big {
      position: relative;
      grid-row-start: 1;
      grid-row-end: 3;
      background-color: #1f3763;
      border: 1px solid #1f3763; }
      .resource-cards .card-wrap.big:hover {
        background-color: #af272f;
        border: 1px solid #af272f; }
      @media (max-width: 991px) {
        .resource-cards .card-wrap.big {
          width: 100%; } }
      .resource-cards .card-wrap.big .content {
        width: 100%;
        height: 100%;
        -webkit-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out; }
        @media (max-width: 991px) {
          .resource-cards .card-wrap.big .content {
            float: unset;
            margin: 0 auto; } }
      .resource-cards .card-wrap.big .img-wrap {
        max-width: 208px;
        height: 230px;
        float: left;
        margin-right: 20px;
        margin-bottom: 10px; }
        .resource-cards .card-wrap.big .img-wrap img {
          height: 100%;
          width: 100%; }
        @media (max-width: 991px) {
          .resource-cards .card-wrap.big .img-wrap {
            display: none; } }
      .resource-cards .card-wrap.big .text-wrap span {
        font-size: 15px;
        letter-spacing: 0;
        color: #ffffff;
        font-weight: 400;
        margin-bottom: 10px; }
      .resource-cards .card-wrap.big .text-wrap h4 {
        color: #ffffff;
        margin-bottom: 20px; }
      .resource-cards .card-wrap.big .text-wrap p {
        font-size: 17px;
        line-height: 1.2;
        color: #ffffff; }