/* ------------------------ 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:.9em;}
.tiles.layout4 .tile .leader-text               {font-size:1.25em;}
.tiles.layout4 .tile .description           {font-size:.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(.5 * var(--bs-gutter-x)) 0;}
    .tiles.layout3 .tile .tile_img  {flex: 0 0 40%}
    .tiles.layout3 .tile .tile_text {flex: 0 0 60%; padding:0 0 0 2em}
    .tiles.layout3 .tile .tile_text::before {top:0; left:1em}

    .tiles.lightgray.layout3            {background-color: unset; margin:0 calc(-.5 * var(--bs-gutter-x)); gap: var(--bs-gutter-x);}
    .tiles.lightgray.layout3 .tile      {background-color:rgb(247,247,247); margin: 0 calc(-.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}
*/ }