/* Malli: @include icon($facebook)*/
.card {
  display: block;
  background-color: #ffffff;
  text-decoration: none;
  border-top: 0rem solid #585858;
  border-bottom: 0rem solid #585858;
  border-left: 0rem solid #585858;
  border-right: 0rem solid #585858;
  border-radius: 0rem;
  box-shadow: none;
  position: relative;
  transition: all 0.2s; }
  .card:hover, .card:active, .card:focus {
    text-decoration: none;
    box-shadow: none; }
    .card:hover .card-image-wrapper .card-image-container, .card:active .card-image-wrapper .card-image-container, .card:focus .card-image-wrapper .card-image-container {
      transform: scale(1.08); }
  .card:hover .card-content-wrapper .card-title, .card:active .card-content-wrapper .card-title, .card:focus .card-content-wrapper .card-title {
    color: #f3352e; }
  .card .card-image-wrapper {
    height: calc(15rem + 0rem);
    width: calc(100% + (0rem + 0rem));
    position: relative;
    top: calc(0rem * -1);
    left: calc(0rem * -1);
    background-color: #f2f2f2;
    overflow: hidden;
    border-top-left-radius: 0rem;
    border-top-right-radius: 0rem; }
  @media screen and (max-width: 31.1875em) {
    .card .card-image-wrapper {
      height: calc(15rem * 0.8); } }
  .card .card-image-wrapper .card-image-container {
    transition: transform 1.3s;
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    border-top-left-radius: 0rem;
    border-top-right-radius: 0rem; }
  .card .card-image-wrapper .card-tag {
    position: absolute;
    top: initial;
    bottom: 0.9375rem;
    left: 0;
    right: initial;
    background-color: #f77c78;
    padding: 0.8125rem 0.9375rem 0.8125rem 0.8125rem;
    border-top-left-radius: 0rem;
    border-top-right-radius: 1.25rem;
    border-bottom-left-radius: 0rem;
    border-bottom-right-radius: 1.25rem;
    color: #ffffff;
    font-family: 'Assistant', Arial, Helvetica, sans-serif;
    font-size: 0.9375rem;
    line-height: 1;
    font-weight: 700;
    font-style: normal;
    letter-spacing: 0rem;
    text-transform: initial; }
  .card .card-content-wrapper {
    padding: 1.875rem 1.875rem 1.875rem 1.875rem;
    overflow: hidden; }
  @media screen and (max-width: 31.1875em) {
    .card .card-content-wrapper {
      padding: calc(1.875rem * 0.75) calc(1.875rem * 0.75) calc(1.875rem * 0.75) calc(1.875rem * 0.75); } }
  .card .card-content-wrapper .card-meta {
    margin-bottom: 0.625rem;
    text-align: left; }
  .card .card-content-wrapper .card-title {
    margin-top: 0;
    margin-bottom: 1.25rem;
    text-align: center;
    color: #222222;
    transition: all 0.2s; }
    .card .card-content-wrapper .card-title:last-child {
      margin-bottom: 0; }
  .card .card-content-wrapper .card-ingress {
    margin-top: 0;
    margin-bottom: 0;
    max-height: calc(2em * 1.5);
    text-align: center;
    color: #222222;
    font-family: 'Assistant', Arial, Helvetica, sans-serif;
    font-size: 1rem;
    line-height: 1.5;
    font-weight: 400;
    font-style: normal;
    letter-spacing: 0rem;
    text-transform: initial; }
    .card .card-content-wrapper .card-ingress :first-child {
      margin-top: 0; }
    .card .card-content-wrapper .card-ingress :last-child {
      margin-bottom: 0; }
    .card .card-content-wrapper .card-ingress.editor-content {
      text-align: initial; }
      .card .card-content-wrapper .card-ingress.editor-content p, .card .card-content-wrapper .card-ingress.editor-content h2, .card .card-content-wrapper .card-ingress.editor-content .h2, .card .card-content-wrapper .card-ingress.editor-content .h2-alt, .card .card-content-wrapper .card-ingress.editor-content h3, .card .card-content-wrapper .card-ingress.editor-content .h3, .card .card-content-wrapper .card-ingress.editor-content .h3-alt, .card .card-content-wrapper .card-ingress.editor-content h4, .card .card-content-wrapper .card-ingress.editor-content .h4, .card .card-content-wrapper .card-ingress.editor-content h5, .card .card-content-wrapper .card-ingress.editor-content .h5, .card .card-content-wrapper .card-ingress.editor-content h6, .card .card-content-wrapper .card-ingress.editor-content .h6, .card .card-content-wrapper .card-ingress.editor-content a, .card .card-content-wrapper .card-ingress.editor-content blockquote, .card .card-content-wrapper .card-ingress.editor-content .content-ingress, .card .card-content-wrapper .card-ingress.editor-content .ingress, .card .card-content-wrapper .card-ingress.editor-content li {
        color: #222222; }
        .card .card-content-wrapper .card-ingress.editor-content p:hover, .card .card-content-wrapper .card-ingress.editor-content h2:hover, .card .card-content-wrapper .card-ingress.editor-content .h2:hover, .card .card-content-wrapper .card-ingress.editor-content .h2-alt:hover, .card .card-content-wrapper .card-ingress.editor-content h3:hover, .card .card-content-wrapper .card-ingress.editor-content .h3:hover, .card .card-content-wrapper .card-ingress.editor-content .h3-alt:hover, .card .card-content-wrapper .card-ingress.editor-content h4:hover, .card .card-content-wrapper .card-ingress.editor-content .h4:hover, .card .card-content-wrapper .card-ingress.editor-content h5:hover, .card .card-content-wrapper .card-ingress.editor-content .h5:hover, .card .card-content-wrapper .card-ingress.editor-content h6:hover, .card .card-content-wrapper .card-ingress.editor-content .h6:hover, .card .card-content-wrapper .card-ingress.editor-content a:hover, .card .card-content-wrapper .card-ingress.editor-content blockquote:hover, .card .card-content-wrapper .card-ingress.editor-content .content-ingress:hover, .card .card-content-wrapper .card-ingress.editor-content .ingress:hover, .card .card-content-wrapper .card-ingress.editor-content li:hover, .card .card-content-wrapper .card-ingress.editor-content p:active, .card .card-content-wrapper .card-ingress.editor-content h2:active, .card .card-content-wrapper .card-ingress.editor-content .h2:active, .card .card-content-wrapper .card-ingress.editor-content .h2-alt:active, .card .card-content-wrapper .card-ingress.editor-content h3:active, .card .card-content-wrapper .card-ingress.editor-content .h3:active, .card .card-content-wrapper .card-ingress.editor-content .h3-alt:active, .card .card-content-wrapper .card-ingress.editor-content h4:active, .card .card-content-wrapper .card-ingress.editor-content .h4:active, .card .card-content-wrapper .card-ingress.editor-content h5:active, .card .card-content-wrapper .card-ingress.editor-content .h5:active, .card .card-content-wrapper .card-ingress.editor-content h6:active, .card .card-content-wrapper .card-ingress.editor-content .h6:active, .card .card-content-wrapper .card-ingress.editor-content a:active, .card .card-content-wrapper .card-ingress.editor-content blockquote:active, .card .card-content-wrapper .card-ingress.editor-content .content-ingress:active, .card .card-content-wrapper .card-ingress.editor-content .ingress:active, .card .card-content-wrapper .card-ingress.editor-content li:active, .card .card-content-wrapper .card-ingress.editor-content p:focus, .card .card-content-wrapper .card-ingress.editor-content h2:focus, .card .card-content-wrapper .card-ingress.editor-content .h2:focus, .card .card-content-wrapper .card-ingress.editor-content .h2-alt:focus, .card .card-content-wrapper .card-ingress.editor-content h3:focus, .card .card-content-wrapper .card-ingress.editor-content .h3:focus, .card .card-content-wrapper .card-ingress.editor-content .h3-alt:focus, .card .card-content-wrapper .card-ingress.editor-content h4:focus, .card .card-content-wrapper .card-ingress.editor-content .h4:focus, .card .card-content-wrapper .card-ingress.editor-content h5:focus, .card .card-content-wrapper .card-ingress.editor-content .h5:focus, .card .card-content-wrapper .card-ingress.editor-content h6:focus, .card .card-content-wrapper .card-ingress.editor-content .h6:focus, .card .card-content-wrapper .card-ingress.editor-content a:focus, .card .card-content-wrapper .card-ingress.editor-content blockquote:focus, .card .card-content-wrapper .card-ingress.editor-content .content-ingress:focus, .card .card-content-wrapper .card-ingress.editor-content .ingress:focus, .card .card-content-wrapper .card-ingress.editor-content li:focus {
          color: #222222; }
      .card .card-content-wrapper .card-ingress.editor-content a {
        text-decoration: underline; }
        .card .card-content-wrapper .card-ingress.editor-content a:hover, .card .card-content-wrapper .card-ingress.editor-content a:active, .card .card-content-wrapper .card-ingress.editor-content a:focus {
          text-decoration: underline; }
      .card .card-content-wrapper .card-ingress.editor-content li:before {
        color: #222222;
        border-color: #222222; }
    .card .card-content-wrapper .card-ingress.editor-content blockquote:before {
      background-color: #222222; }
  .card .card-link-wrapper {
    text-align: center;
    background-color: transparent;
    padding: 0rem 1.875rem 1.875rem 1.875rem;
    transition: all 0.2s;
    border-bottom-left-radius: 0rem;
    border-bottom-right-radius: 0rem; }
  @media screen and (max-width: 31.1875em) {
    .card .card-link-wrapper {
      padding: calc(0rem * 0.75) calc(1.875rem * 0.75) calc(1.875rem * 0.75) calc(1.875rem * 0.75); } }
  .card .card-link-wrapper:before {
    content: '';
    display: block;
    height: 0rem;
    background-color: #f3352e;
    width: calc(100% - (1.875rem + 1.875rem));
    margin: 0 auto;
    position: absolute;
    left: 1.875rem;
    top: 0; }
  .card .card-link-wrapper .card-link-button {
    width: inherit;
    margin: 0;
    position: relative;
    text-align: center !important; }
    .card .card-link-wrapper .card-link-button:before {
      position: absolute;
      top: 0.8125rem;
      right: 1.25rem;
      font-size: 0.875rem;
      transition: all 0.2s; }
  .card .card-link-wrapper .card-link-text {
    font-family: 'Assistant', Arial, Helvetica, sans-serif;
    font-size: 1.0625rem;
    line-height: 1.5;
    color: #f3352e;
    font-weight: 400;
    font-style: normal;
    letter-spacing: -0.0425rem;
    text-transform: initial;
    transition: all 0.2s;
    position: relative; }
    .card .card-link-wrapper .card-link-text:before {
      position: absolute;
      top: 0.8125rem;
      right: 1.25rem;
      font-size: 0.875rem;
      transition: all 0.2s; }
    @media screen and (max-width: 63.9375em) {
      .card .card-link-wrapper .card-link-text {
        font-size: calc(1.0625rem * 0.95);
        letter-spacing: calc(-0.0425rem * 0.95); } }
  @media screen and (max-width: 31.1875em) {
    .card .card-link-wrapper .card-link-text {
      font-size: calc(1.0625rem * 0.9);
      letter-spacing: calc(-0.0425rem * 0.9); } }
  .card .card-link-wrapper:hover, .card .card-link-wrapper:active, .card .card-link-wrapper:focus {
    background-color: transparent; }
    .card .card-link-wrapper:hover .card-link-button:before, .card .card-link-wrapper:active .card-link-button:before, .card .card-link-wrapper:focus .card-link-button:before, .card .card-link-wrapper:hover .card-link-text:before, .card .card-link-wrapper:active .card-link-text:before, .card .card-link-wrapper:focus .card-link-text:before {
      margin-right: -0.3125rem; }
    .card .card-link-wrapper:hover .card-link-text, .card .card-link-wrapper:active .card-link-text, .card .card-link-wrapper:focus .card-link-text {
      color: #222222; }

@media screen and (min-width: 64em) {
  .card-list-columns-4 .card-image-wrapper {
    height: calc(12.5rem + 0rem); }
  .card-list-columns-4 .card-content-wrapper {
    padding: 1.5625rem 1.5625rem 1.875rem 1.5625rem; } }

.cards-carousel-wrapper {
  margin-bottom: -0.9375rem;
  width: calc(100% + 1.875rem);
  position: relative;
  left: -0.9375rem;
  margin-top: -0.9375rem; }
  .cards-carousel-wrapper .card {
    margin: 0.9375rem; }
  .cards-carousel-wrapper.dots-on {
    margin-bottom: 2.5rem; }
  @media screen and (max-width: 87.5em) {
    .cards-carousel-wrapper {
      margin-bottom: 2.5rem; } }
@media screen and (max-width: 31.1875em) {
  .cards-carousel-wrapper {
    margin-bottom: calc(2.5rem * 0.7); } }
