/* encore-gbt.css
20220728 changes for 4-column design with long-worded text
*/

/* Equal padding experiments */

/* Notes
In order to move from padding to row/column gap:
- On the grid itself:
```
    column-gap:
    row-gap:
```
- on the div inside the grid: `aspect-ratio: 1`
- Remove the existing padding
- Add width: 100%; to the images inside the grid

*/

/* End Equal padding experiments */



div[class*='gbt-table-'] a:link {
  color: var(--encore-pink);
}

div[class*='gbt-table-'] a:visited {
  color: var(--encore-pink);
}

div[class*='gbt-table-'] a:hover {
  color: var(--encore-darkgrey);
}

/* defaults text to 16px instead of 18px. Will be overridden by heading styles or media queries. */
.gbt-tablemod-16pxtext {
  font-size: 16px;
}

/*the following 2 rules improve the appearance of H3s and lists inside the cramped confines of GBTs */
div[class*='gbt-table-'] h3 {
  font-size: 1.375rem;
  margin-top: 5px;
  margin-bottom: 10px;
}

div[class*='gbt-table-'] ul, div[class*='gbt-table-'] ol {
    margin-bottom: 10px;
}

/*GBT Selectors begin*/

.gbt-table-2columns-1_1 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.gbt-table-2columns-1_2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
}

.gbt-table-2columns-2_1 {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
}

.gbt-table-2columns-2_2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 2fr));
}

.gbt-table-2columns-3_1 {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 1fr);
}

.gbt-table-2columns-3_2 {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
}

.gbt-table-2columns-4_1 {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 1fr);
}

.gbt-table-2columns-4_2 {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 2fr);
}

.gbt-table-2columns-5_1 {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 1fr);
}

.gbt-table-2columns-5_2 {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 2fr);
}

.gbt-table-2columns-8_1 {
  display: grid;
  grid-template-columns: minmax(0, 8fr) minmax(0, 1fr);
}

.gbt-table-2columns-8_2 {
  display: grid;
  grid-template-columns: minmax(0, 8fr) minmax(0, 2fr);
}

.gbt-table-2columns-1_3 {
  /*special 2-column design that works well for topic summary tables */
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 3fr);
}

.gbt-table-4columns-2_3_3_3 {
  /*special 4-column design that works well for 3-product comparison tables */
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 3fr);
}

/*experimental designs to make better column spacing */
.gbt-table-2columns-1_3 {
}


/*3-column designs begin */
.gbt-table-3columns-1_1_1 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
}

.gbt-table-3columns-1_1_2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr);
}

.gbt-table-3columns-1_2_1 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr);
}

.gbt-table-3columns-1_2_2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) minmax(0, 2fr);
}

.gbt-table-3columns-2_1_1 {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr);
}

.gbt-table-3columns-2_1_2 {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 2fr);
}

.gbt-table-3columns-2_2_1 {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 2fr) minmax(0, 1fr);
}

.gbt-table-3columns-2_2_2 {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 2fr) minmax(0, 2fr);
}

/*start of 3-wide 3 col */
.gbt-table-3columns-3_1_1 {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 1fr) minmax(0, 1fr);
}

.gbt-table-3columns-3_1_2 {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 1fr) minmax(0, 2fr);
}

.gbt-table-3columns-3_2_1 {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr) minmax(0, 1fr);
}

.gbt-table-3columns-3_2_2 {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr) minmax(0, 2fr);
}


/*start of 4-wide 3 col */

.gbt-table-3columns-4_1_1 {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 1fr) minmax(0, 1fr);
}

.gbt-table-3columns-4_1_2 {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 1fr) minmax(0, 2fr);
}

.gbt-table-3columns-4_2_1 {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 2fr) minmax(0, 1fr);
}

.gbt-table-3columns-4_2_2 {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 2fr) minmax(0, 2fr);
}

/*start of 5-wide 3 col */

.gbt-table-3columns-5_1_1 {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 1fr) minmax(0, 1fr);
}

.gbt-table-3columns-5_1_2 {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 1fr) minmax(0, 2fr);
}

.gbt-table-3columns-5_2_1 {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 2fr) minmax(0, 1fr);
}

.gbt-table-3columns-5_2_2 {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 2fr) minmax(0, 2fr);
}


/*start of 8-wide 3 col */

.gbt-table-3columns-8_1_1 {
  display: grid;
  grid-template-columns: minmax(0, 8fr) minmax(0, 1fr) minmax(0, 1fr);
}

.gbt-table-3columns-8_1_2 {
  display: grid;
  grid-template-columns: minmax(0, 8fr) minmax(0, 1fr) minmax(0, 2fr);
}

.gbt-table-3columns-8_2_1 {
  display: grid;
  grid-template-columns: minmax(0, 8fr) minmax(0, 2fr) minmax(0, 1fr);
}

.gbt-table-3columns-8_2_2 {
  display: grid;
  grid-template-columns: minmax(0, 8fr) minmax(0, 2fr) minmax(0, 2fr);
}

.gbt-table-3columns-3_4_4 {
  /*special 3-column design that works well for 2-product comparison tables */
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 4fr) minmax(0, 4fr);
}

.gbt-table-3columns-2_3_3 {
  /*special 3-column design that works well for 2-product comparison tables */
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 3fr) minmax(0, 3fr);
}

.gbt-table-4columns-2_3_3_3 {
  /*special 4-column design that works well for 2-product comparison tables */
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 3fr) minmax(0, 3fr) minmax(0, 3fr);
}


/*start of 1-wide 4 columns */

.gbt-table-4columns-1_1_1_1 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
}

.gbt-table-4columns-1_1_1_2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr);
}

.gbt-table-4columns-1_1_2_1 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr);
}

.gbt-table-4columns-1_1_2_2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr) minmax(0, 2fr);
}

.gbt-table-4columns-1_2_1_1 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr);
}

.gbt-table-4columns-1_2_1_2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr) minmax(0, 2fr);
}

.gbt-table-4columns-1_2_2_1 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) minmax(0, 2fr) minmax(0, 1fr);
}

.gbt-table-4columns-1_2_2_2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) minmax(0, 2fr) minmax(0, 2fr);
}


/*start of 2-wide 4 columns */

.gbt-table-4columns-2_1_1_1 {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
}

.gbt-table-4columns-2_1_1_2 {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr);
}

.gbt-table-4columns-2_1_2_1 {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr);
}

.gbt-table-4columns-2_1_2_2 {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 2fr) minmax(0, 2fr);
}

.gbt-table-4columns-2_2_1_1 {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr);
}

.gbt-table-4columns-2_2_1_2 {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 2fr) minmax(0, 1fr) minmax(0, 2fr);
}

.gbt-table-4columns-2_2_2_1 {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 2fr) minmax(0, 2fr) minmax(0, 1fr);
}

.gbt-table-4columns-2_2_2_2 {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 2fr) minmax(0, 2fr) minmax(0, 2fr);
}


/* start of 3-wide 4 columns*/

.gbt-table-4columns-3_1_1_1 {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
}

.gbt-table-4columns-3_1_1_2 {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr);
}

.gbt-table-4columns-3_1_2_1 {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr);
}

.gbt-table-4columns-3_1_2_2 {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 1fr) minmax(0, 2fr) minmax(0, 2fr);
}

.gbt-table-4columns-3_2_1_1 {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr);
}

.gbt-table-4columns-3_2_1_2 {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr) minmax(0, 1fr) minmax(0, 2fr);
}

.gbt-table-4columns-3_2_2_1 {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr) minmax(0, 2fr) minmax(0, 1fr);
}

.gbt-table-4columns-3_2_2_2 {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr) minmax(0, 2fr) minmax(0, 2fr);
}


/* start of 4-wide 4 columns*/

.gbt-table-4columns-4_1_1_1 {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
}

.gbt-table-4columns-4_1_1_2 {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr);
}

.gbt-table-4columns-4_1_2_1 {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr);
}

.gbt-table-4columns-4_1_2_2 {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 1fr) minmax(0, 2fr) minmax(0, 2fr);
}

.gbt-table-4columns-4_2_1_1 {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr);
}

.gbt-table-4columns-4_2_1_2 {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 2fr) minmax(0, 1fr) minmax(0, 2fr);
}

.gbt-table-4columns-4_2_2_1 {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 2fr) minmax(0, 2fr) minmax(0, 1fr);
}

.gbt-table-4columns-4_2_2_2 {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 2fr) minmax(0, 2fr) minmax(0, 2fr);
}


/* start of 5-wide 4 columns*/

.gbt-table-4columns-5_1_1_1 {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
}

.gbt-table-4columns-5_1_1_2 {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr);
}

.gbt-table-4columns-5_1_2_1 {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr);
}

.gbt-table-4columns-5_1_2_2 {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 1fr) minmax(0, 2fr) minmax(0, 2fr);
}

.gbt-table-4columns-5_2_1_1 {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr);
}

.gbt-table-4columns-5_2_1_2 {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 2fr) minmax(0, 1fr) minmax(0, 2fr);
}

.gbt-table-4columns-5_2_2_1 {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 2fr) minmax(0, 2fr) minmax(0, 1fr);
}

.gbt-table-4columns-5_2_2_2 {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 2fr) minmax(0, 2fr) minmax(0, 2fr);
}


/* start of 8-wide 4 columns*/

.gbt-table-4columns-8_1_1_1 {
  display: grid;
  grid-template-columns: minmax(0, 8fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
}

.gbt-table-4columns-8_1_1_2 {
  display: grid;
  grid-template-columns: minmax(0, 8fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr);
}

gbt-table-4columns-8_1_2_1 {
  display: grid;
  grid-template-columns: minmax(0, 8fr) minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr);
}

.gbt-table-4columns-8_1_2_2 {
  display: grid;
  grid-template-columns: minmax(0, 8fr) minmax(0, 1fr) minmax(0, 2fr) minmax(0, 2fr);
}

.gbt-table-4columns-8_2_1_1 {
  display: grid;
  grid-template-columns: minmax(0, 8fr) minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr);
}

.gbt-table-4columns-8_2_1_2 {
  display: grid;
  grid-template-columns: minmax(0, 8fr) minmax(0, 2fr) minmax(0, 1fr) minmax(0, 2fr);
}

.gbt-table-4columns-8_2_2_1 {
  display: grid;
  grid-template-columns: minmax(0, 8fr) minmax(0, 2fr) minmax(0, 2fr) minmax(0, 1fr);
}

.gbt-table-4columns-8_2_2_2 {
  display: grid;
  grid-template-columns: minmax(0, 8fr) minmax(0, 2fr) minmax(0, 2fr) minmax(0, 2fr);
}

/*end of 4-column selectors*/


.gbt-table-5columns-1_1_1_1_1 {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.gbt-table-6columns-1_1_1_1_1_1 {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.gbt-table-7columns-1_1_1_1_1_1_1 {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.gbt-table-8columns-1_1_1_1_1_1_1_1 {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
}


.gbt-icon-table-1column {
  display: grid;
  grid-template-columns: 52px minmax(0, 8fr);
  grid-column-gap: 20px;
  grid-row-gap: 30px;
  padding-bottom: 30px;
}

.gbt-icon-table-2column {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 8fr) 30px minmax(0, 1fr) minmax(0, 8fr);
  grid-column-gap: 20px;
  grid-row-gap: 30px;
  padding-bottom: 30px;
}

/* Place items in the correct columns, skipping the spacer at column 3 */
/* Icons in left grid */
.gbt-icon-table-2column > *:nth-child(4n+1) {
  grid-column: 1;
}
/* Text in left grid */
.gbt-icon-table-2column > *:nth-child(4n+2) {
  grid-column: 2;
}
/* Icons in right grid (skip 3) */
.gbt-icon-table-2column > *:nth-child(4n+3) {
  grid-column: 4;
}
/* Text in right grid */
.gbt-icon-table-2column > *:nth-child(4n) {
  grid-column: 5;
}

.gbt-tablemod-defaultpadding div {
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 20px;
  padding-right: 20px;
}

div[class*='gbt-tablemod-equalpadding'] div {
  padding-top: var(--equalpadding-amount);
  padding-bottom: var(--equalpadding-amount);
  padding-left: var(--equalpadding-amount);
  padding-right: var(--equalpadding-amount);
}

.gbt-tablemod-equalpadding-20 div {
  --equalpadding-amount: 20px;
}

.gbt-tablemod-narrowpadding div {
  padding-top: 3px;
  padding-bottom: 3px;
  padding-left: 10px;
  padding-right: 10px;
}

.gbt-tablemod-leftjustify {
  position: relative;
}

.gbt-tablemod-leftjustify.gbt-tablemod-defaultpadding {
  left: -20px;
}
.gbt-tablemod-leftjustify.gbt-tablemod-narrowpadding {
  left: -10px;
}
.gbt-tablemod-leftjustify.gbt-tablemod-equalpadding-20 {
  left: -20px;
}

.gbt-tablemod-horizontal-centre {
  margin-right: auto;
  margin-left: auto;
}

.gbt-tablemod-maxwidth500 {
  max-width: 500px;
}

.gbt-tablemod-maxwidth565 {
  max-width: 565px;
}

.gbt-tablemod-maxwidth610 {
  max-width: 610px;
}

.gbt-tablemod-maxwidth750 {
  max-width: 750px;
}

.gbt-tablemod-maxwidth800 {
  max-width: 800px;
}

  /* These rules commented out by Mike on 20220322 because they duplicate the functionality of visual editor buttons
  .gbt-tablemod-leftalign div
  {
    text-align: left;
  }

  .gbt-tablemod-centeralign div
  {
    text-align: center;
  }

  .gbt-tablemod-rightalign div
  {
    text-align: right;
  }

  div .gbt-cellmod-leftalign
  the "div" is here to beat the specificity of the tablemod selectors above
  {
    text-align: left;
  }

  div .gbt-cellmod-centeralign
  {
    text-align: center;
  }

  div .gbt-cellmod-rightalign
  {
    text-align: right;
  }
  */


div .gbt-cellmod-verticallycentered {
  display: grid;
  align-content: center;
}

.gbt-cellmod-span2columns {
  grid-column: auto / span 2;
}

.gbt-cellmod-span3columns {
  grid-column: auto / span 3;
}

.gbt-cellmod-span4columns {
  grid-column: auto / span 4;
}

.gbt-cellmod-span5columns {
  grid-column: auto / span 5;
}

.gbt-cellmod-span6columns {
  grid-column: auto / span 6;
}

.gbt-cellmod-span7columns {
  grid-column: auto / span 7;
}

.gbt-cellmod-span8columns {
  grid-column: auto / span 8;
}


.gbt-cellmod-span2rows {
  grid-row: auto / span 2;
}

.gbt-cellmod-span3rows {
  grid-row: auto / span 3;
}

.gbt-cellmod-span4rows {
  grid-row: auto / span 4;
}

.gbt-cellmod-span5rows {
  grid-row: auto / span 5;
}

.gbt-cellmod-span6rows {
  grid-row: auto / span 6;
}

.gbt-cellmod-span7rows {
  grid-row: auto / span 7;
}

.gbt-cellmod-span8rows {
  grid-row: auto / span 8;
}

.gbt-tablemod-shadebycolumns {
  border-style: solid;
  border-width: 2px;
  border-color: #d5d5d6;
  background-color: #d5d5d6;
  grid-gap: 2px 2px;
}

.gbt-tablemod-shadebycolumns .gbt-cell-oddcolumn {
  background-color: #f3f3f4;
}

.gbt-tablemod-shadebycolumns .gbt-cell-evencolumn {
  background-color: var(--encore-whitesmoke);
}

.gbt-tablemod-shadebyrows {
  border-style: solid;
  border-width: 2px;
  border-color: #d5d5d6;
  background-color: #d5d5d6;
  grid-gap: 2px 2px;
}

.gbt-tablemod-shadebyrows .gbt-cellmod-oddrow {
  background-color: #f3f3f4;
}

.gbt-tablemod-shadebyrows .gbt-cellmod-evenrow {
  background-color: var(--encore-whitesmoke);
}

.gbt-cell-evencolumn.gbt-cellmod-purpleshaded, .gbt-cell-oddcolumn.gbt-cellmod-purpleshaded, .gbt-cellmod-evenrow.gbt-cellmod-purpleshaded, .gbt-cellmod-oddrow.gbt-cellmod-purpleshaded {
  /*Josh, Mike added some stuff here for specificity, but it seems like a kluge. Really I want any cell with gbt-cellmod-purpleshaded to get a purple background.*/
  background-color: var(--encore-purple);
  color: white;
}

.gbt-cellmod-purpleshaded h1,
.gbt-cellmod-purpleshaded h2,
.gbt-cellmod-purpleshaded h3,
.gbt-cellmod-purpleshaded h4,
.gbt-cellmod-purpleshaded h5,
.gbt-cellmod-purpleshaded h6 {
  color: white;
}


@media all and (max-width: 1000px) {
  .gbt-tablemod-defaultpadding div {
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 10px;
    padding-right: 10px;
  }
  .gbt-tablemod-narrowpadding div {
    padding-left: 0%;
    padding-right: 0%;
    padding-top: 0px;
    padding-bottom: 0px;
  }

  /* rules for text and heading size in many-column tables */
  .proper-width-article .gbt-table-5columns-1_1_1_1_1,
  .proper-width-article .gbt-table-6columns-1_1_1_1_1_1,
  .proper-width-article .gbt-table-7columns-1_1_1_1_1_1_1,
  .proper-width-article .gbt-table-8columns-1_1_1_1_1_1_1_1 {
    word-break: break-all;
    font-size: .75rem;
  }

  .proper-width-article .gbt-table-5columns-1_1_1_1_1 div[class*='gbt-table-'] div h1,
  .proper-width-article .gbt-table-6columns-1_1_1_1_1_1 div[class*='gbt-table-'] div h1,
  .proper-width-article .gbt-table-7columns-1_1_1_1_1_1_1 div[class*='gbt-table-'] div h1,
  .proper-width-article .gbt-table-8columns-1_1_1_1_1_1_1_1 div[class*='gbt-table-'] div h1 {
    font-size: 1rem;
  }

  .proper-width-article .gbt-table-5columns-1_1_1_1_1 div[class*='gbt-table-'] div h2,
  .proper-width-article .gbt-table-6columns-1_1_1_1_1_1 div[class*='gbt-table-'] div h2,
  .proper-width-article .gbt-table-7columns-1_1_1_1_1_1_1 div[class*='gbt-table-'] div h2,
  .proper-width-article .gbt-table-8columns-1_1_1_1_1_1_1_1 div[class*='gbt-table-'] div h2 {
    font-size: .95rem;
  }

  .proper-width-article .gbt-table-5columns-1_1_1_1_1 div[class*='gbt-table-'] div h3,
  .proper-width-article .gbt-table-6columns-1_1_1_1_1_1 div[class*='gbt-table-'] div h3,
  .proper-width-article .gbt-table-7columns-1_1_1_1_1_1_1 div[class*='gbt-table-'] div h3,
  .proper-width-article .gbt-table-8columns-1_1_1_1_1_1_1_1 div[class*='gbt-table-'] div h3 {
    font-size: .9rem;
  }

  .proper-width-article .gbt-table-5columns-1_1_1_1_1 div[class*='gbt-table-'] div h4,
  .proper-width-article .gbt-table-6columns-1_1_1_1_1_1 div[class*='gbt-table-'] div h4,
  .proper-width-article .gbt-table-7columns-1_1_1_1_1_1_1 div[class*='gbt-table-'] div h4,
  .proper-width-article .gbt-table-8columns-1_1_1_1_1_1_1_1 div[class*='gbt-table-'] div h4 {
    font-size: .85rem;
  }

  .proper-width-article .gbt-table-5columns-1_1_1_1_1 div[class*='gbt-table-'] div h5,
  .proper-width-article .gbt-table-6columns-1_1_1_1_1_1 div[class*='gbt-table-'] div h5,
  .proper-width-article .gbt-table-7columns-1_1_1_1_1_1_1 div[class*='gbt-table-'] div h5,
  .proper-width-article .gbt-table-8columns-1_1_1_1_1_1_1_1 div[class*='gbt-table-'] div h5 {
    font-size: .8rem;
  }

  .proper-width-article .gbt-table-5columns-1_1_1_1_1 div[class*='gbt-table-'] div h6,
  .proper-width-article .gbt-table-6columns-1_1_1_1_1_1 div[class*='gbt-table-'] div h6,
  .proper-width-article .gbt-table-7columns-1_1_1_1_1_1_1 div[class*='gbt-table-'] div h6,
  .proper-width-article .gbt-table-8columns-1_1_1_1_1_1_1_1 div[class*='gbt-table-'] div h6 {
    font-size: .75rem;
  }
}


@media all and (max-width: 600px) {
  /* rules for text and heading size in 4-or-less-column tables */

  div[class*='gbt-table-'] div {
    font-size:1rem;
  }

  div[class*='gbt-table-'] div h2{
    font-size:.95rem;
  }

  div[class*='gbt-table-'] div h3{
    font-size:.9rem;
  }

  div[class*='gbt-table-'] div h4{
    font-size:.85rem;
  }

  div[class*='gbt-table-'] div h5{
    font-size:.8rem;
  }

  div[class*='gbt-table-'] div h6{
    font-size:.75rem;
  }

  .gbt-tablemod-leftjustify {
    position: unset;
  }

  /* rules for many-column tables */
  .gbt-table-5columns-1_1_1_1_1,
  .gbt-table-6columns-1_1_1_1_1_1,
  .gbt-table-7columns-1_1_1_1_1_1_1,
  .gbt-table-8columns-1_1_1_1_1_1_1_1 {
    word-break: break-all;
    font-size: .65rem;
  }

  .gbt-table-5columns-1_1_1_1_1 div[class*='gbt-table-'] div h1,
  .gbt-table-6columns-1_1_1_1_1_1 div[class*='gbt-table-'] div h1,
  .gbt-table-7columns-1_1_1_1_1_1_1 div[class*='gbt-table-'] div h1,
  .gbt-table-8columns-1_1_1_1_1_1_1_1 div[class*='gbt-table-'] div h1 {
    font-size: .9rem;
  }

  .gbt-table-5columns-1_1_1_1_1 div[class*='gbt-table-'] div h2,
  .gbt-table-6columns-1_1_1_1_1_1 div[class*='gbt-table-'] div h2,
  .gbt-table-7columns-1_1_1_1_1_1_1 div[class*='gbt-table-'] div h2,
  .gbt-table-8columns-1_1_1_1_1_1_1_1 div[class*='gbt-table-'] div h2 {
    font-size: .85rem;
  }

  .gbt-table-5columns-1_1_1_1_1 div[class*='gbt-table-'] div h3,
  .gbt-table-6columns-1_1_1_1_1_1 div[class*='gbt-table-'] div h3,
  .gbt-table-7columns-1_1_1_1_1_1_1 div[class*='gbt-table-'] div h3,
  .gbt-table-8columns-1_1_1_1_1_1_1_1 div[class*='gbt-table-'] div h3 {
    font-size: .8rem;
  }

  .gbt-table-5columns-1_1_1_1_1 div[class*='gbt-table-'] div h4,
  .gbt-table-6columns-1_1_1_1_1_1 div[class*='gbt-table-'] div h4,
  .gbt-table-7columns-1_1_1_1_1_1_1 div[class*='gbt-table-'] div h4,
  .gbt-table-8columns-1_1_1_1_1_1_1_1 div[class*='gbt-table-'] div h4 {
    font-size: .75rem;
  }

  .gbt-table-5columns-1_1_1_1_1 div[class*='gbt-table-'] div h4,
  .gbt-table-6columns-1_1_1_1_1_1 div[class*='gbt-table-'] div h4,
  .gbt-table-7columns-1_1_1_1_1_1_1 div[class*='gbt-table-'] div h4,
  .gbt-table-8columns-1_1_1_1_1_1_1_1 div[class*='gbt-table-'] div h4 {
    font-size: .75rem;
  }

  .gbt-table-5columns-1_1_1_1_1 div[class*='gbt-table-'] div h5,
  .gbt-table-6columns-1_1_1_1_1_1 div[class*='gbt-table-'] div h5,
  .gbt-table-7columns-1_1_1_1_1_1_1 div[class*='gbt-table-'] div h5,
  .gbt-table-8columns-1_1_1_1_1_1_1_1 div[class*='gbt-table-'] div h5 {
    font-size: .7rem;
  }

  .gbt-table-5columns-1_1_1_1_1 div[class*='gbt-table-'] div h6,
  .gbt-table-6columns-1_1_1_1_1_1 div[class*='gbt-table-'] div h6,
  .gbt-table-7columns-1_1_1_1_1_1_1 div[class*='gbt-table-'] div h6,
  .gbt-table-8columns-1_1_1_1_1_1_1_1 div[class*='gbt-table-'] div h6 {
    font-size: .65rem;
  }

  .gbt-icon-table-2column {
    grid-template-columns: 52px minmax(0, 8fr);
  }

  .gbt-icon-table-2column > *:nth-child(n) {
    grid-column: auto;
  }

  .gbt-tablemod-defaultpadding div {
    padding-left: 0%;
    padding-right: 0%;
    padding-top: 0px;
    padding-bottom: 0px;
  }

  .gbt-tablemod-equalpadding-20 div {
    --equalpadding-amount: 15px;
  }

  .gbt-table-2columns-3_1,
  .gbt-table-2columns-4_1,
  .gbt-table-2columns-5_1,
  .gbt-table-2columns-5_2 {
    /*these classes all go to 2_1*/
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  }

  .gbt-table-2columns-3_2 {
    /*these classes all go to 1_1*/
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .gbt-table-2columns-8_1,
  .gbt-table-2columns-8_2 {
    grid-template-columns: minmax(0, 5fr) minmax(0, 1fr);
  }

  .gbt-table-3columns-1_1_2,
  .gbt-table-3columns-1_2_1,
  .gbt-table-3columns-1_2_2,
  .gbt-table-3columns-2_1_1,
  .gbt-table-3columns-2_1_2,
  .gbt-table-3columns-2_2_1,
  .gbt-table-3columns-2_2_2,
  .gbt-table-3columns-3_1_2,
  .gbt-table-3columns-3_2_1,
  .gbt-table-3columns-3_2_2,
  .gbt-table-3columns-3_4_4,
  .gbt-table-3columns-2_3_3 {
    /*these classes all go to 1_1_1*/
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
  }

  .gbt-table-3columns-3_1_1,
  .gbt-table-3columns-4_1_1,
  .gbt-table-3columns-4_1_2,
  .gbt-table-3columns-4_2_1,
  .gbt-table-3columns-4_2_2,
  .gbt-table-3columns-5_1_1,
  .gbt-table-3columns-5_1_2,
  .gbt-table-3columns-5_2_1,
  .gbt-table-3columns-5_2_2 {
    /*these classes all go to 2_1_1*/
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr);
  }

  .gbt-table-3columns-8_1_1,
  .gbt-table-3columns-8_1_2,
  .gbt-table-3columns-8_2_1,
  .gbt-table-3columns-8_2_2 {
    /*these classes all go to 5_1_1*/
    grid-template-columns: minmax(0, 5fr) minmax(0, 1fr) minmax(0, 1fr);
  }

  .gbt-table-4columns-1_1_1_2,
  .gbt-table-4columns-1_1_2_1,
  .gbt-table-4columns-1_1_2_2,
  .gbt-table-4columns-1_2_1_1,
  .gbt-table-4columns-1_2_1_2,
  .gbt-table-4columns-1_2_2_1,
  .gbt-table-4columns-1_2_2_2,
  .gbt-table-4columns-2_1_1_1,
  .gbt-table-4columns-2_1_1_2,
  .gbt-table-4columns-2_1_2_1,
  .gbt-table-4columns-2_1_2_2,
  .gbt-table-4columns-2_2_1_1,
  .gbt-table-4columns-2_2_1_2,
  .gbt-table-4columns-2_2_2_1,
  .gbt-table-4columns-3_2_2_2 {
    /*these classes go to 1_1_1_1*/
    grid-template-columns: repeat(4, 1fr);
  }

  .gbt-table-4columns-3_1_1_1,
  .gbt-table-4columns-3_1_1_2,
  .gbt-table-4columns-3_1_2_1,
  .gbt-table-4columns-3_1_2_2,
  .gbt-table-4columns-3_2_1_1,
  .gbt-table-4columns-3_2_1_2,
  .gbt-table-4columns-3_2_2_1,
  .gbt-table-4columns-4_1_1_1,
  .gbt-table-4columns-4_1_1_2,
  .gbt-table-4columns-4_1_2_1,
  .gbt-table-4columns-4_1_2_2,
  .gbt-table-4columns-4_2_1_1,
  .gbt-table-4columns-4_2_1_2,
  .gbt-table-4columns-4_2_2_1,
  .gbt-table-4columns-5_1_1_1,
  .gbt-table-4columns-5_1_1_2,
  .gbt-table-4columns-5_1_2_1,
  .gbt-table-4columns-5_1_2_2,
  .gbt-table-4columns-5_2_1_1,
  .gbt-table-4columns-5_2_1_2,
  .gbt-table-4columns-5_2_2_1,
  .gbt-table-4columns-5_2_2_2 {
    /*these classes to to 2_1_1_1*/
    grid-template-columns: minmax(0, 2fr) repeat(3, 1fr);
  }

  .gbt-table-4columns-8_1_1_1,
  .gbt-table-4columns-8_1_1_2,
  .gbt-table-4columns-8_1_2_1,
  .gbt-table-4columns-8_1_2_2,
  .gbt-table-4columns-8_2_1_1,
  .gbt-table-4columns-8_2_1_2,
  .gbt-table-4columns-8_2_2_1,
  .gbt-table-4columns-8_2_2_2 {
    /*these classes to to 5_1_1_1*/
    grid-template-columns: minmax(0, 5fr) repeat(3, 1fr);
  }


  /* Rules to allow users to specify different columns for mobile */
  div[class*='gbt-table-mobile'] {
    display: grid;
  }
  .gbt-table-mobile-2columns-1_1 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .gbt-table-mobile-3columns-1_1_1 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .gbt-table-mobile-4columns-1_1_1_1 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  /* rules for "textbox-like" classes, which should behave differently on mobile*/

  div[class*='gbt-table-'].gbt-tablemod-stacking {
    grid-template-columns: 1fr;
  }

  div[class*='gbt-table-'].gbt-tablemod-stacking div {
    font-size: 1rem;
  }

  div[class*='gbt-table-'].gbt-tablemod-stacking div h1 {
    font-size: 36px;
  }

  div[class*='gbt-table-'].gbt-tablemod-stacking div h2 {
    font-size: 36px;
  }

  div[class*='gbt-table-'].gbt-tablemod-stacking div h3 {
    font-size: 28px;
  }

  div[class*='gbt-table-'].gbt-tablemod-stacking div h4 {
    font-size: 24px;
  }

  div[class*='gbt-table-'].gbt-tablemod-stacking div h5 {
    font-size: 20px;
  }

  div[class*='gbt-table-'].gbt-tablemod-stacking div h6 {
    font-size: 16px;
  }

  .gbt-tablemod-defaultpadding.gbt-tablemod-stacking div {
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 20px;
    padding-right: 20px;
  }

  .gbt-tablemod-stacking div[class*='gbt-cellmod-span'] {
    grid-column: unset;
    grid-row: unset;
  }
}