﻿/* ------------------------ TILES  --------------*/
.tiles-darkgray a {
  color: #fff;
}
.tiles-darkgray {
  background-color: #555555;
  padding: 70px 0;
}
.tiles-darkgray .tiles .tile .tile_text .leader-text {
  font-weight: 400;
  margin: 0;
  color: #fff;
  margin-bottom: 0;
}
.tiles-darkgray .tiles .tile .tile_text .description {
  font-size: 1em;
  margin: 0 0 10px 0;
  color: #fff;
}

.tiles {
  margin-bottom: 30px;
}
.tiles.lightgray {
  background-color: rgb(247, 247, 247);
  width: auto;
  padding: var(--bs-gutter-x) calc(var(--bs-gutter-x) / 2);
  margin: 0 calc(-1 * var(--bs-gutter-x));
  margin-bottom: var(--bs-gutter-x);
}
.tiles.lightgray.top {
  margin-top: calc(-1 * var(--bs-gutter-x));
}

body.sfPageEditor .tiles.lightgray.top {
  margin-top: 0;
}

.tiles a {
  text-decoration: none;
}
.tiles .tile:hover .leader-text {
  text-decoration: underline;
}
.tiles .tile .leader-text {
  font-family: aeonik;
  font-weight: 400;
  color: inherit;
  margin-bottom: 0;
}
.tiles .tile .description {
  font-family: "Libre Franklin";
  font-weight: 400;
  color: rgba(90, 90, 90, 100);
  margin: 0px;
}
.tiles .tile .tile_text {
  position: relative;
  padding: 1em 1em;
  padding-bottom: 0;
  overflow: hidden;
  color: rgba(61, 61, 61, 100);
}
.tiles .tile .tile_text::before {
  content: " ";
  position: absolute;
  background: #fcba04;
  width: 5px;
  left: 0;
  top: 1.4em;
}

/*.tiles.layout1 .tile                    {display:flex}
*/
.tiles.layout1 .tile .tile_img {
  flex: 1 1 50%;
}
.tiles.layout1 .tile .tile_text {
  flex: 1 1 50%;
}
.tiles.layout1 .tile .leader-text {
  font-size: 2em;
}
.tiles.layout1 .tile .description {
  font-size: 1.15em;
  color: inherit;
}
.tiles.layout1 .tile .tile_text::before {
  height: 4em;
  left: 1.5em;
  top: 1.75em;
}
.tiles.layout1 .tile .tile_text {
  min-height: 5em;
  padding: 1em 3em;
  color: #fff;
  background: rgba(67, 188, 205, 100) url("../images/iaa-swoop-green.svg") no-repeat right bottom;
}
.tiles.layout1.gray .tile .tile_text {
  color: rgba(61, 61, 61, 100);
  background: rgba(231, 231, 231, 100) url("../images/iaa-swoop-white.svg") no-repeat right bottom;
}
.tiles.layout1.turqoise .tile .tile_text {
  color: #fff;
  background: rgba(67, 188, 205, 100) url("../images/iaa-swoop-green.svg") no-repeat right bottom;
}

.tiles.layout2 .tile .leader-text {
  font-size: 1.5em;
}
.tiles.layout2 .tile .description {
  font-size: 1em;
  color: inherit;
}
.tiles.layout2 .tile .tile_text::before {
  height: 3em;
  left: 1em;
  top: 1.5em;
}
.tiles.layout2 .tile .tile_text {
  min-height: 5.5em;
  padding: 1em 2em;
  color: #fff;
  background: rgba(67, 188, 205, 100) url("../images/iaa-swoop-green.svg") no-repeat right bottom;
  background-size: 125px auto;
}

.tiles.layout3 .tile .leader-text {
  font-size: 1.5em;
}
.tiles.layout3 .tile .description {
  font-size: 1em;
}
.tiles.layout3 .tile .tile_text::before {
  height: 3em;
}
.tiles.layout3 .tile .tile_text {
  min-height: 4em;
}

.tiles.layout4 {
  font-size: 0.9em;
}
.tiles.layout4 .tile .leader-text {
  font-size: 1.25em;
}
.tiles.layout4 .tile .description {
  font-size: 0.85em;
}
.tiles.layout4 .tile .tile_text::before {
  height: 2.25em;
}
.tiles.layout4 .tile .tile_text {
  min-height: 2.25em;
}

.tile {
  font-family: aeonik;
  display: flex;
  flex-direction: column;
  position: relative;
}
.tile img {
  width: 100%;
  height: 100%;
  z-index: 1;
  display: block;
}

/*.tile_190               {font-size:14px;}
.tile_190 h4            {font-size:1.2em;}
.tile_260 h4            {font-size:1.35em;}
.tile_300 h4            {font-size:1.5em;}
.tile_360 h4            {font-size:1.8em;}*/

@media only screen and (max-width: 1023px) {
  /*    .tile_190               {font-size:13px;}
    .tile_190 p             {max-height: 4.8em;}
    .tile_260 p             {max-height: 4.8em;}
*/
}

@media only screen and (max-width: 767px) {
  .tiles {
    margin-bottom: 0;
  }
  .tiles.layout3 .tile {
    flex-direction: row;
    padding: calc(0.5 * var(--bs-gutter-x)) 0;
  }
  .tiles.layout3 .tile .tile_img {
    flex: 0 0 30%;
  }
  .tiles.layout3 .tile .tile_text {
    flex: 0 0 70%;
    padding: 0 0 0 2em;
  }
  .tiles.layout3 .tile .tile_text::before {
    top: 0;
    left: 1em;
  }

  .tiles.lightgray.layout3 {
    background-color: unset;
    margin: 0 calc(-0.5 * var(--bs-gutter-x));
    gap: var(--bs-gutter-x);
  }
  .tiles.lightgray.layout3 .tile {
    background-color: rgb(247, 247, 247);
    margin: 0 calc(-0.5 * var(--bs-gutter-x));
    padding: var(--bs-gutter-x);
  }

  .tiles.layout4 {
    row-gap: var(--bs-gutter-x);
    padding-bottom: 0;
  }
  .tiles.lightgray.layout4 {
    background-color: unset;
  }
  .tiles.layout2 {
    row-gap: var(--bs-gutter-x);
  }
  /*    .tile h1                    {color: #053589; font-size:15px; margin-bottom: 13px;}
    .tile a                     {position:relative; color: #000; display: block;}
    .tiletext                   {color: #083d7e; position:relative; padding: 17px; top:100%; 
                                 overflow-y: scroll; bottom:0; background-color:#e8f2fb;}

    .tileslider-xs              {overflow: hidden; position: relative; z-index: 1;}
    .tileslider-xs .tile_effect {margin-bottom: 10px;}

    .tileslider-xs img          {width:40%; position: relative; height:auto; float:left;}
    .tileslider-xs .tiletext    {width:60%; position: absolute; height:100%; left:40%; top:0; }


    .tile_190                   {font-size:16px;}
    .tile_190 p                 {max-height: none;}
    .tile_260 p                 {max-height: none;}

    .tileslider-xs .tile        {clear:both; height:100%; display:block}
*/
}
