/*
 *  Copyright 2019 Adobe
 *
 *  Licensed under the Apache License, Version 2.0 (the "License");
 *  you may not use this file except in compliance with the License.
 *  You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 *  Unless required by applicable law or agreed to in writing, software
 *  distributed under the License is distributed on an "AS IS" BASIS,
 *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 *  See the License for the specific language governing permissions and
 *  limitations under the License.
 */
.cmp-accordion__header {
  margin: 0;
}
.cmp-accordion__button {
  display: block;
  width: 100%;
  text-align: left;
}
.cmp-accordion__panel--hidden {
  display: none;
}
.cmp-accordion__panel--expanded {
  display: block;
}


/*
 *  Copyright 2018 Adobe
 *
 *  Licensed under the Apache License, Version 2.0 (the "License");
 *  you may not use this file except in compliance with the License.
 *  You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 *  Unless required by applicable law or agreed to in writing, software
 *  distributed under the License is distributed on an "AS IS" BASIS,
 *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 *  See the License for the specific language governing permissions and
 *  limitations under the License.
 */
.cmp-tabs__tablist {
  display: flex;
  flex-wrap: wrap;
  padding-left: 0;
  list-style: none;
}
.cmp-tabs__tab {
  box-sizing: border-box;
  border-bottom: 1px solid transparent;
  padding: .5rem 1rem;
  cursor: pointer;
}
.cmp-tabs__tab--active {
  border-color: inherit;
}
.cmp-tabs__tabpanel {
  display: none;
}
.cmp-tabs__tabpanel--active {
  display: block;
}


/*
 *  Copyright 2018 Adobe
 *
 *  Licensed under the Apache License, Version 2.0 (the "License");
 *  you may not use this file except in compliance with the License.
 *  You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 *  Unless required by applicable law or agreed to in writing, software
 *  distributed under the License is distributed on an "AS IS" BASIS,
 *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 *  See the License for the specific language governing permissions and
 *  limitations under the License.
 */
.cmp-carousel__content {
  position: relative;
}
.cmp-carousel__item {
  display: none;
}
.cmp-carousel__item--active {
  display: block;
}
.cmp-carousel__action {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.cmp-carousel__indicators {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0;
  padding: 0;
  list-style: none;
}
.cmp-carousel__indicator {
  position: relative;
  flex: 0 1 auto;
  width: 10px;
  height: 10px;
  margin: 0 7px;
  border-radius: 50%;
  font-size: 0;
  text-indent: -3000px;
  background-color: rgba(0, 0, 0, 0.5);
}
.cmp-carousel__indicator--active {
  background-color: rgba(0, 0, 0, 0.8);
}


/*
 *  Copyright 2021 Adobe
 *
 *  Licensed under the Apache License, Version 2.0 (the "License");
 *  you may not use this file except in compliance with the License.
 *  You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 *  Unless required by applicable law or agreed to in writing, software
 *  distributed under the License is distributed on an "AS IS" BASIS,
 *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 *  See the License for the specific language governing permissions and
 *  limitations under the License.
 */
/** @define image */
.cmp-image__image {
  width: 100%;
  height: auto;
}


/*
 *  Copyright 2017 Adobe
 *
 *  Licensed under the Apache License, Version 2.0 (the "License");
 *  you may not use this file except in compliance with the License.
 *  You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 *  Unless required by applicable law or agreed to in writing, software
 *  distributed under the License is distributed on an "AS IS" BASIS,
 *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 *  See the License for the specific language governing permissions and
 *  limitations under the License.
 */
/** @define breadcrumb */
.cmp-breadcrumb {
  display: inline-block;
  list-style: none;
  padding: 0;
}
.cmp-breadcrumb__item {
  display: inline-block;
  vertical-align: top;
}


/*
 *  Copyright 2022 Adobe
 *
 *  Licensed under the Apache License, Version 2.0 (the "License");
 *  you may not use this file except in compliance with the License.
 *  You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 *  Unless required by applicable law or agreed to in writing, software
 *  distributed under the License is distributed on an "AS IS" BASIS,
 *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 *  See the License for the specific language governing permissions and
 *  limitations under the License.
 */
.cmp-search {
  position: relative;
}
.cmp-search__field {
  position: relative;
  height: 2rem;
}
.cmp-search__input {
  padding-left: 2rem;
  padding-right: 2rem;
  height: 100%;
  width: 100%;
}
.cmp-search__icon {
  display: block;
  position: absolute;
  left: .5rem;
  top: .5rem;
  background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTE1MnB4IiBoZWlnaHQ9IjExNTJweCIgdmlld0JveD0iMCAwIDExNTIgMTE1MiIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMTE1MiAxMTUyIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGQ9Ik02NzIsMEM0MDYuOTAzLDAsMTkyLDIxNC45MDMsMTkyLDQ4MGMwLDk1LjcsMjguMDExLDE4NC44NTUsNzYuMjc1LDI1OS43MjVDMTgxLjY0Niw4MjYuMzU0LDQ4LjA3NSw5NTkuOTI1LDM2LDk3Mg0KCWMtMTgsMTgtMzYsMzYtMzYsNzJzMTgsNTQsMzYsNzJzMzYuMDEyLDM2LDcyLDM2czU0LTE4LDcyLTM2YzEyLjA3NS0xMi4wNzUsMTQ1LjY0Ni0xNDUuNjQ2LDIzMi4yNzUtMjMyLjI3NQ0KCUM0ODcuMTQ0LDkzMS45ODgsNTc2LjMsOTYwLDY3Miw5NjBjMjY1LjA5NywwLDQ4MC0yMTQuOTAzLDQ4MC00ODBDMTE1MiwyMTQuOTAzLDkzNy4wOTcsMCw2NzIsMHogTTY3Miw4MTYNCgljLTE4NS41NjgsMC0zMzYtMTUwLjQzMy0zMzYtMzM2YzAtMTg1LjU2OCwxNTAuNDMyLTMzNiwzMzYtMzM2YzE4NS41NjcsMCwzMzYsMTUwLjQzMiwzMzYsMzM2QzEwMDgsNjY1LjU2Nyw4NTcuNTY3LDgxNiw2NzIsODE2eiINCgkvPg0KPC9zdmc+DQo=");
  background-size: contain;
  width: 1rem;
  height: 1rem;
  pointer-events: none;
}
.cmp-search__loading-indicator {
  display: none;
  position: absolute;
  top: .5rem;
  left: .5rem;
  border: 3px solid #ccc;
  border-top-color: #333;
  border-radius: 50%;
  width: 1rem;
  height: 1rem;
  animation: cmp-search__loading-indicator-spin 2s linear infinite;
}
@keyframes cmp-search__loading-indicator-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.cmp-search__clear {
  display: none;
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
}
.cmp-search__clear-icon {
  position: absolute;
  top: .5rem;
  right: .5rem;
  background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxOS4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTE1MnB4IiBoZWlnaHQ9IjExNTJweCIgdmlld0JveD0iMCAwIDExNTIgMTE1MiIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMTE1MiAxMTUyIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGlkPSJYTUxJRF85XyIgZD0iTTgyLjYsOTM3LjJsMzYyLTM2Mkw4NCwyMTQuOGMtMTQuMS0xNC4xLTE0LjEtMzYuOSwwLTUxbDgxLjItODEuMmMxNC4xLTE0LjEsMzYuOS0xNC4xLDUxLDBsMzYwLjUsMzYwLjUNCglMOTM3LjIsODIuNmMxNC4xLTE0LjEsMzYuOS0xNC4xLDUxLDBsODEuMiw4MS4yYzE0LjEsMTQuMSwxNC4xLDM2LjksMCw1MUw3MDguOSw1NzUuM2wzNjAuNSwzNjAuNWMxNC4xLDE0LjEsMTQuMSwzNi45LDAsNTENCglsLTgxLjIsODEuMmMtMTQuMSwxNC4xLTM2LjksMTQuMS01MSwwTDU3Ni43LDcwNy41bC0zNjIsMzYyYy0xNC4xLDE0LjEtMzYuOSwxNC4xLTUxLDBsLTgxLjItODEuMg0KCUM2OC41LDk3NC4yLDY4LjUsOTUxLjMsODIuNiw5MzcuMnoiLz4NCjwvc3ZnPg0K");
  background-size: contain;
  width: 1rem;
  height: 1rem;
}
.cmp-search__results {
  display: none;
  overflow-y: auto;
  min-width: 100%;
  max-height: 10rem;
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 999999;
  border: 1px solid #ccc;
  background: #fff;
}
.cmp-search__item {
  display: block;
}
.cmp-search__item--is-focused {
  background-color: #ccc;
}
.cmp_search__info {
  height: 20px;
  font-size: .875rem;
  font-style: italic;
}


/*
 *  Copyright 2025 Adobe
 *
 *  Licensed under the Apache License, Version 2.0 (the "License");
 *  you may not use this file except in compliance with the License.
 *  You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 *  Unless required by applicable law or agreed to in writing, software
 *  distributed under the License is distributed on an "AS IS" BASIS,
 *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 *  See the License for the specific language governing permissions and
 *  limitations under the License.
 */
.cmp-form-text .cmp-form-text__validation-message {
  visibility: hidden;
}
.cmp-form-text :invalid + .cmp-form-text__validation-message {
  visibility: visible;
}


/*
 *  Copyright 2020 Adobe
 *
 *  Licensed under the Apache License, Version 2.0 (the "License");
 *  you may not use this file except in compliance with the License.
 *  You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 *  Unless required by applicable law or agreed to in writing, software
 *  distributed under the License is distributed on an "AS IS" BASIS,
 *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 *  See the License for the specific language governing permissions and
 *  limitations under the License.
 */
.cmp-pdfviewer__content {
  height: 500px;
}
.pdfviewer:not(.cq-Editable-dom) .cmp-pdfviewer__full-window-borderless {
  height: 100vh;
  position: fixed;
  width: 100vw;
  top: 0;
  left: 0;
  z-index: 9999;
}
.pdfviewer.cq-Editable-dom .cmp-pdfviewer__full-window-borderless {
  height: 500px;
}


/*
 *  Copyright 2022 Adobe
 *
 *  Licensed under the Apache License, Version 2.0 (the "License");
 *  you may not use this file except in compliance with the License.
 *  You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 *  Unless required by applicable law or agreed to in writing, software
 *  distributed under the License is distributed on an "AS IS" BASIS,
 *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 *  See the License for the specific language governing permissions and
 *  limitations under the License.
 */
.cmp-embed__youtube {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
}
.cmp-embed__youtube-iframe {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
}


/*
 *  Copyright 2018 Adobe Systems Incorporated
 *
 *  Licensed under the Apache License, Version 2.0 (the "License");
 *  you may not use this file except in compliance with the License.
 *  You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 *  Unless required by applicable law or agreed to in writing, software
 *  distributed under the License is distributed on an "AS IS" BASIS,
 *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 *  See the License for the specific language governing permissions and
 *  limitations under the License.
 */
/*
 * ADOBE CONFIDENTIAL
 *
 * Copyright 2015 Adobe Systems Incorporated
 * All Rights Reserved.
 *
 * NOTICE:  All information contained herein is, and remains
 * the property of Adobe Systems Incorporated and its suppliers,
 * if any.  The intellectual and technical concepts contained
 * herein are proprietary to Adobe Systems Incorporated and its
 * suppliers and may be covered by U.S. and Foreign Patents,
 * patents in process, and are protected by trade secret or copyright law.
 * Dissemination of this information or reproduction of this material
 * is strictly forbidden unless prior written permission is obtained
 * from Adobe Systems Incorporated.
 */
/* grid component */
.aem-Grid {
  display: block;
  width: 100%;
}
.aem-Grid::before,
.aem-Grid::after {
  display: table;
  content: " ";
}
.aem-Grid::after {
  clear: both;
}
/* placeholder for new components */
.aem-Grid-newComponent {
  clear: both;
  margin: 0;
}
/* column of a grid */
.aem-GridColumn {
  box-sizing: border-box;
  clear: both;
}
/* force showing hidden */
.aem-GridShowHidden > .aem-Grid > .aem-GridColumn {
  display: block !important;
}
/* Generates all the rules for the grid columns up to the given amount of column */
/* Generates all the rules for the grid column offset up to the given amount of column */
/* Generates all the rules for the grid and columns for the given break point and total of columns */
/* Generates all the rules for the grids and columns */
/* API function to be called to generate a grid config */
/* maximum amount of grid cells to be provided */
/* default breakpoint */
.aem-Grid.aem-Grid--1 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--1 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--1 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 100%;
}
.aem-Grid.aem-Grid--2 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 50%;
}
.aem-Grid.aem-Grid--2 > .aem-GridColumn.aem-GridColumn--default--2 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--2 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--2 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 50%;
}
.aem-Grid.aem-Grid--2 > .aem-GridColumn.aem-GridColumn--offset--default--2 {
  margin-left: 100%;
}
.aem-Grid.aem-Grid--3 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 33.33333333%;
}
.aem-Grid.aem-Grid--3 > .aem-GridColumn.aem-GridColumn--default--2 {
  float: left;
  clear: none;
  width: 66.66666667%;
}
.aem-Grid.aem-Grid--3 > .aem-GridColumn.aem-GridColumn--default--3 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--3 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--3 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 33.33333333%;
}
.aem-Grid.aem-Grid--3 > .aem-GridColumn.aem-GridColumn--offset--default--2 {
  margin-left: 66.66666667%;
}
.aem-Grid.aem-Grid--3 > .aem-GridColumn.aem-GridColumn--offset--default--3 {
  margin-left: 100%;
}
.aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 25%;
}
.aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--default--2 {
  float: left;
  clear: none;
  width: 50%;
}
.aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--default--3 {
  float: left;
  clear: none;
  width: 75%;
}
.aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--default--4 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 25%;
}
.aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--offset--default--2 {
  margin-left: 50%;
}
.aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--offset--default--3 {
  margin-left: 75%;
}
.aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--offset--default--4 {
  margin-left: 100%;
}
.aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 20%;
}
.aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--default--2 {
  float: left;
  clear: none;
  width: 40%;
}
.aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--default--3 {
  float: left;
  clear: none;
  width: 60%;
}
.aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--default--4 {
  float: left;
  clear: none;
  width: 80%;
}
.aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--default--5 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 20%;
}
.aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--offset--default--2 {
  margin-left: 40%;
}
.aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--offset--default--3 {
  margin-left: 60%;
}
.aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--offset--default--4 {
  margin-left: 80%;
}
.aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--offset--default--5 {
  margin-left: 100%;
}
.aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 16.66666667%;
}
.aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--default--2 {
  float: left;
  clear: none;
  width: 33.33333333%;
}
.aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--default--3 {
  float: left;
  clear: none;
  width: 50%;
}
.aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--default--4 {
  float: left;
  clear: none;
  width: 66.66666667%;
}
.aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--default--5 {
  float: left;
  clear: none;
  width: 83.33333333%;
}
.aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--default--6 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 16.66666667%;
}
.aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--offset--default--2 {
  margin-left: 33.33333333%;
}
.aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--offset--default--3 {
  margin-left: 50%;
}
.aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--offset--default--4 {
  margin-left: 66.66666667%;
}
.aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--offset--default--5 {
  margin-left: 83.33333333%;
}
.aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--offset--default--6 {
  margin-left: 100%;
}
.aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 14.28571429%;
}
.aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--default--2 {
  float: left;
  clear: none;
  width: 28.57142857%;
}
.aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--default--3 {
  float: left;
  clear: none;
  width: 42.85714286%;
}
.aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--default--4 {
  float: left;
  clear: none;
  width: 57.14285714%;
}
.aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--default--5 {
  float: left;
  clear: none;
  width: 71.42857143%;
}
.aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--default--6 {
  float: left;
  clear: none;
  width: 85.71428571%;
}
.aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--default--7 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 14.28571429%;
}
.aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--default--2 {
  margin-left: 28.57142857%;
}
.aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--default--3 {
  margin-left: 42.85714286%;
}
.aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--default--4 {
  margin-left: 57.14285714%;
}
.aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--default--5 {
  margin-left: 71.42857143%;
}
.aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--default--6 {
  margin-left: 85.71428571%;
}
.aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--default--7 {
  margin-left: 100%;
}
.aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 12.5%;
}
.aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--default--2 {
  float: left;
  clear: none;
  width: 25%;
}
.aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--default--3 {
  float: left;
  clear: none;
  width: 37.5%;
}
.aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--default--4 {
  float: left;
  clear: none;
  width: 50%;
}
.aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--default--5 {
  float: left;
  clear: none;
  width: 62.5%;
}
.aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--default--6 {
  float: left;
  clear: none;
  width: 75%;
}
.aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--default--7 {
  float: left;
  clear: none;
  width: 87.5%;
}
.aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--default--8 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 12.5%;
}
.aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--default--2 {
  margin-left: 25%;
}
.aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--default--3 {
  margin-left: 37.5%;
}
.aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--default--4 {
  margin-left: 50%;
}
.aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--default--5 {
  margin-left: 62.5%;
}
.aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--default--6 {
  margin-left: 75%;
}
.aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--default--7 {
  margin-left: 87.5%;
}
.aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--default--8 {
  margin-left: 100%;
}
.aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 11.11111111%;
}
.aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--default--2 {
  float: left;
  clear: none;
  width: 22.22222222%;
}
.aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--default--3 {
  float: left;
  clear: none;
  width: 33.33333333%;
}
.aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--default--4 {
  float: left;
  clear: none;
  width: 44.44444444%;
}
.aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--default--5 {
  float: left;
  clear: none;
  width: 55.55555556%;
}
.aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--default--6 {
  float: left;
  clear: none;
  width: 66.66666667%;
}
.aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--default--7 {
  float: left;
  clear: none;
  width: 77.77777778%;
}
.aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--default--8 {
  float: left;
  clear: none;
  width: 88.88888889%;
}
.aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--default--9 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 11.11111111%;
}
.aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--default--2 {
  margin-left: 22.22222222%;
}
.aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--default--3 {
  margin-left: 33.33333333%;
}
.aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--default--4 {
  margin-left: 44.44444444%;
}
.aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--default--5 {
  margin-left: 55.55555556%;
}
.aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--default--6 {
  margin-left: 66.66666667%;
}
.aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--default--7 {
  margin-left: 77.77777778%;
}
.aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--default--8 {
  margin-left: 88.88888889%;
}
.aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--default--9 {
  margin-left: 100%;
}
.aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 10%;
}
.aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--default--2 {
  float: left;
  clear: none;
  width: 20%;
}
.aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--default--3 {
  float: left;
  clear: none;
  width: 30%;
}
.aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--default--4 {
  float: left;
  clear: none;
  width: 40%;
}
.aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--default--5 {
  float: left;
  clear: none;
  width: 50%;
}
.aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--default--6 {
  float: left;
  clear: none;
  width: 60%;
}
.aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--default--7 {
  float: left;
  clear: none;
  width: 70%;
}
.aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--default--8 {
  float: left;
  clear: none;
  width: 80%;
}
.aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--default--9 {
  float: left;
  clear: none;
  width: 90%;
}
.aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--default--10 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 10%;
}
.aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--default--2 {
  margin-left: 20%;
}
.aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--default--3 {
  margin-left: 30%;
}
.aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--default--4 {
  margin-left: 40%;
}
.aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--default--5 {
  margin-left: 50%;
}
.aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--default--6 {
  margin-left: 60%;
}
.aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--default--7 {
  margin-left: 70%;
}
.aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--default--8 {
  margin-left: 80%;
}
.aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--default--9 {
  margin-left: 90%;
}
.aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--default--10 {
  margin-left: 100%;
}
.aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 9.09090909%;
}
.aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--default--2 {
  float: left;
  clear: none;
  width: 18.18181818%;
}
.aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--default--3 {
  float: left;
  clear: none;
  width: 27.27272727%;
}
.aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--default--4 {
  float: left;
  clear: none;
  width: 36.36363636%;
}
.aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--default--5 {
  float: left;
  clear: none;
  width: 45.45454545%;
}
.aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--default--6 {
  float: left;
  clear: none;
  width: 54.54545455%;
}
.aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--default--7 {
  float: left;
  clear: none;
  width: 63.63636364%;
}
.aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--default--8 {
  float: left;
  clear: none;
  width: 72.72727273%;
}
.aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--default--9 {
  float: left;
  clear: none;
  width: 81.81818182%;
}
.aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--default--10 {
  float: left;
  clear: none;
  width: 90.90909091%;
}
.aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--default--11 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 9.09090909%;
}
.aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--default--2 {
  margin-left: 18.18181818%;
}
.aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--default--3 {
  margin-left: 27.27272727%;
}
.aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--default--4 {
  margin-left: 36.36363636%;
}
.aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--default--5 {
  margin-left: 45.45454545%;
}
.aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--default--6 {
  margin-left: 54.54545455%;
}
.aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--default--7 {
  margin-left: 63.63636364%;
}
.aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--default--8 {
  margin-left: 72.72727273%;
}
.aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--default--9 {
  margin-left: 81.81818182%;
}
.aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--default--10 {
  margin-left: 90.90909091%;
}
.aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--default--11 {
  margin-left: 100%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 8.33333333%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--default--2 {
  float: left;
  clear: none;
  width: 16.66666667%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--default--3 {
  float: left;
  clear: none;
  width: 25%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--default--4 {
  float: left;
  clear: none;
  width: 33.33333333%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--default--5 {
  float: left;
  clear: none;
  width: 41.66666667%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--default--6 {
  float: left;
  clear: none;
  width: 50%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--default--7 {
  float: left;
  clear: none;
  width: 58.33333333%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--default--8 {
  float: left;
  clear: none;
  width: 66.66666667%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--default--9 {
  float: left;
  clear: none;
  width: 75%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--default--10 {
  float: left;
  clear: none;
  width: 83.33333333%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--default--11 {
  float: left;
  clear: none;
  width: 91.66666667%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--default--12 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 8.33333333%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--default--2 {
  margin-left: 16.66666667%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--default--3 {
  margin-left: 25%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--default--4 {
  margin-left: 33.33333333%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--default--5 {
  margin-left: 41.66666667%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--default--6 {
  margin-left: 50%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--default--7 {
  margin-left: 58.33333333%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--default--8 {
  margin-left: 66.66666667%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--default--9 {
  margin-left: 75%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--default--10 {
  margin-left: 83.33333333%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--default--11 {
  margin-left: 91.66666667%;
}
.aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--default--12 {
  margin-left: 100%;
}
.aem-Grid.aem-Grid--default--1 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--default--1 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--default--1 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 100%;
}
.aem-Grid.aem-Grid--default--2 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 50%;
}
.aem-Grid.aem-Grid--default--2 > .aem-GridColumn.aem-GridColumn--default--2 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--default--2 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--default--2 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 50%;
}
.aem-Grid.aem-Grid--default--2 > .aem-GridColumn.aem-GridColumn--offset--default--2 {
  margin-left: 100%;
}
.aem-Grid.aem-Grid--default--3 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 33.33333333%;
}
.aem-Grid.aem-Grid--default--3 > .aem-GridColumn.aem-GridColumn--default--2 {
  float: left;
  clear: none;
  width: 66.66666667%;
}
.aem-Grid.aem-Grid--default--3 > .aem-GridColumn.aem-GridColumn--default--3 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--default--3 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--default--3 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 33.33333333%;
}
.aem-Grid.aem-Grid--default--3 > .aem-GridColumn.aem-GridColumn--offset--default--2 {
  margin-left: 66.66666667%;
}
.aem-Grid.aem-Grid--default--3 > .aem-GridColumn.aem-GridColumn--offset--default--3 {
  margin-left: 100%;
}
.aem-Grid.aem-Grid--default--4 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 25%;
}
.aem-Grid.aem-Grid--default--4 > .aem-GridColumn.aem-GridColumn--default--2 {
  float: left;
  clear: none;
  width: 50%;
}
.aem-Grid.aem-Grid--default--4 > .aem-GridColumn.aem-GridColumn--default--3 {
  float: left;
  clear: none;
  width: 75%;
}
.aem-Grid.aem-Grid--default--4 > .aem-GridColumn.aem-GridColumn--default--4 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--default--4 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--default--4 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 25%;
}
.aem-Grid.aem-Grid--default--4 > .aem-GridColumn.aem-GridColumn--offset--default--2 {
  margin-left: 50%;
}
.aem-Grid.aem-Grid--default--4 > .aem-GridColumn.aem-GridColumn--offset--default--3 {
  margin-left: 75%;
}
.aem-Grid.aem-Grid--default--4 > .aem-GridColumn.aem-GridColumn--offset--default--4 {
  margin-left: 100%;
}
.aem-Grid.aem-Grid--default--5 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 20%;
}
.aem-Grid.aem-Grid--default--5 > .aem-GridColumn.aem-GridColumn--default--2 {
  float: left;
  clear: none;
  width: 40%;
}
.aem-Grid.aem-Grid--default--5 > .aem-GridColumn.aem-GridColumn--default--3 {
  float: left;
  clear: none;
  width: 60%;
}
.aem-Grid.aem-Grid--default--5 > .aem-GridColumn.aem-GridColumn--default--4 {
  float: left;
  clear: none;
  width: 80%;
}
.aem-Grid.aem-Grid--default--5 > .aem-GridColumn.aem-GridColumn--default--5 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--default--5 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--default--5 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 20%;
}
.aem-Grid.aem-Grid--default--5 > .aem-GridColumn.aem-GridColumn--offset--default--2 {
  margin-left: 40%;
}
.aem-Grid.aem-Grid--default--5 > .aem-GridColumn.aem-GridColumn--offset--default--3 {
  margin-left: 60%;
}
.aem-Grid.aem-Grid--default--5 > .aem-GridColumn.aem-GridColumn--offset--default--4 {
  margin-left: 80%;
}
.aem-Grid.aem-Grid--default--5 > .aem-GridColumn.aem-GridColumn--offset--default--5 {
  margin-left: 100%;
}
.aem-Grid.aem-Grid--default--6 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 16.66666667%;
}
.aem-Grid.aem-Grid--default--6 > .aem-GridColumn.aem-GridColumn--default--2 {
  float: left;
  clear: none;
  width: 33.33333333%;
}
.aem-Grid.aem-Grid--default--6 > .aem-GridColumn.aem-GridColumn--default--3 {
  float: left;
  clear: none;
  width: 50%;
}
.aem-Grid.aem-Grid--default--6 > .aem-GridColumn.aem-GridColumn--default--4 {
  float: left;
  clear: none;
  width: 66.66666667%;
}
.aem-Grid.aem-Grid--default--6 > .aem-GridColumn.aem-GridColumn--default--5 {
  float: left;
  clear: none;
  width: 83.33333333%;
}
.aem-Grid.aem-Grid--default--6 > .aem-GridColumn.aem-GridColumn--default--6 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--default--6 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--default--6 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 16.66666667%;
}
.aem-Grid.aem-Grid--default--6 > .aem-GridColumn.aem-GridColumn--offset--default--2 {
  margin-left: 33.33333333%;
}
.aem-Grid.aem-Grid--default--6 > .aem-GridColumn.aem-GridColumn--offset--default--3 {
  margin-left: 50%;
}
.aem-Grid.aem-Grid--default--6 > .aem-GridColumn.aem-GridColumn--offset--default--4 {
  margin-left: 66.66666667%;
}
.aem-Grid.aem-Grid--default--6 > .aem-GridColumn.aem-GridColumn--offset--default--5 {
  margin-left: 83.33333333%;
}
.aem-Grid.aem-Grid--default--6 > .aem-GridColumn.aem-GridColumn--offset--default--6 {
  margin-left: 100%;
}
.aem-Grid.aem-Grid--default--7 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 14.28571429%;
}
.aem-Grid.aem-Grid--default--7 > .aem-GridColumn.aem-GridColumn--default--2 {
  float: left;
  clear: none;
  width: 28.57142857%;
}
.aem-Grid.aem-Grid--default--7 > .aem-GridColumn.aem-GridColumn--default--3 {
  float: left;
  clear: none;
  width: 42.85714286%;
}
.aem-Grid.aem-Grid--default--7 > .aem-GridColumn.aem-GridColumn--default--4 {
  float: left;
  clear: none;
  width: 57.14285714%;
}
.aem-Grid.aem-Grid--default--7 > .aem-GridColumn.aem-GridColumn--default--5 {
  float: left;
  clear: none;
  width: 71.42857143%;
}
.aem-Grid.aem-Grid--default--7 > .aem-GridColumn.aem-GridColumn--default--6 {
  float: left;
  clear: none;
  width: 85.71428571%;
}
.aem-Grid.aem-Grid--default--7 > .aem-GridColumn.aem-GridColumn--default--7 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--default--7 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--default--7 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 14.28571429%;
}
.aem-Grid.aem-Grid--default--7 > .aem-GridColumn.aem-GridColumn--offset--default--2 {
  margin-left: 28.57142857%;
}
.aem-Grid.aem-Grid--default--7 > .aem-GridColumn.aem-GridColumn--offset--default--3 {
  margin-left: 42.85714286%;
}
.aem-Grid.aem-Grid--default--7 > .aem-GridColumn.aem-GridColumn--offset--default--4 {
  margin-left: 57.14285714%;
}
.aem-Grid.aem-Grid--default--7 > .aem-GridColumn.aem-GridColumn--offset--default--5 {
  margin-left: 71.42857143%;
}
.aem-Grid.aem-Grid--default--7 > .aem-GridColumn.aem-GridColumn--offset--default--6 {
  margin-left: 85.71428571%;
}
.aem-Grid.aem-Grid--default--7 > .aem-GridColumn.aem-GridColumn--offset--default--7 {
  margin-left: 100%;
}
.aem-Grid.aem-Grid--default--8 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 12.5%;
}
.aem-Grid.aem-Grid--default--8 > .aem-GridColumn.aem-GridColumn--default--2 {
  float: left;
  clear: none;
  width: 25%;
}
.aem-Grid.aem-Grid--default--8 > .aem-GridColumn.aem-GridColumn--default--3 {
  float: left;
  clear: none;
  width: 37.5%;
}
.aem-Grid.aem-Grid--default--8 > .aem-GridColumn.aem-GridColumn--default--4 {
  float: left;
  clear: none;
  width: 50%;
}
.aem-Grid.aem-Grid--default--8 > .aem-GridColumn.aem-GridColumn--default--5 {
  float: left;
  clear: none;
  width: 62.5%;
}
.aem-Grid.aem-Grid--default--8 > .aem-GridColumn.aem-GridColumn--default--6 {
  float: left;
  clear: none;
  width: 75%;
}
.aem-Grid.aem-Grid--default--8 > .aem-GridColumn.aem-GridColumn--default--7 {
  float: left;
  clear: none;
  width: 87.5%;
}
.aem-Grid.aem-Grid--default--8 > .aem-GridColumn.aem-GridColumn--default--8 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--default--8 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--default--8 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 12.5%;
}
.aem-Grid.aem-Grid--default--8 > .aem-GridColumn.aem-GridColumn--offset--default--2 {
  margin-left: 25%;
}
.aem-Grid.aem-Grid--default--8 > .aem-GridColumn.aem-GridColumn--offset--default--3 {
  margin-left: 37.5%;
}
.aem-Grid.aem-Grid--default--8 > .aem-GridColumn.aem-GridColumn--offset--default--4 {
  margin-left: 50%;
}
.aem-Grid.aem-Grid--default--8 > .aem-GridColumn.aem-GridColumn--offset--default--5 {
  margin-left: 62.5%;
}
.aem-Grid.aem-Grid--default--8 > .aem-GridColumn.aem-GridColumn--offset--default--6 {
  margin-left: 75%;
}
.aem-Grid.aem-Grid--default--8 > .aem-GridColumn.aem-GridColumn--offset--default--7 {
  margin-left: 87.5%;
}
.aem-Grid.aem-Grid--default--8 > .aem-GridColumn.aem-GridColumn--offset--default--8 {
  margin-left: 100%;
}
.aem-Grid.aem-Grid--default--9 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 11.11111111%;
}
.aem-Grid.aem-Grid--default--9 > .aem-GridColumn.aem-GridColumn--default--2 {
  float: left;
  clear: none;
  width: 22.22222222%;
}
.aem-Grid.aem-Grid--default--9 > .aem-GridColumn.aem-GridColumn--default--3 {
  float: left;
  clear: none;
  width: 33.33333333%;
}
.aem-Grid.aem-Grid--default--9 > .aem-GridColumn.aem-GridColumn--default--4 {
  float: left;
  clear: none;
  width: 44.44444444%;
}
.aem-Grid.aem-Grid--default--9 > .aem-GridColumn.aem-GridColumn--default--5 {
  float: left;
  clear: none;
  width: 55.55555556%;
}
.aem-Grid.aem-Grid--default--9 > .aem-GridColumn.aem-GridColumn--default--6 {
  float: left;
  clear: none;
  width: 66.66666667%;
}
.aem-Grid.aem-Grid--default--9 > .aem-GridColumn.aem-GridColumn--default--7 {
  float: left;
  clear: none;
  width: 77.77777778%;
}
.aem-Grid.aem-Grid--default--9 > .aem-GridColumn.aem-GridColumn--default--8 {
  float: left;
  clear: none;
  width: 88.88888889%;
}
.aem-Grid.aem-Grid--default--9 > .aem-GridColumn.aem-GridColumn--default--9 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--default--9 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--default--9 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 11.11111111%;
}
.aem-Grid.aem-Grid--default--9 > .aem-GridColumn.aem-GridColumn--offset--default--2 {
  margin-left: 22.22222222%;
}
.aem-Grid.aem-Grid--default--9 > .aem-GridColumn.aem-GridColumn--offset--default--3 {
  margin-left: 33.33333333%;
}
.aem-Grid.aem-Grid--default--9 > .aem-GridColumn.aem-GridColumn--offset--default--4 {
  margin-left: 44.44444444%;
}
.aem-Grid.aem-Grid--default--9 > .aem-GridColumn.aem-GridColumn--offset--default--5 {
  margin-left: 55.55555556%;
}
.aem-Grid.aem-Grid--default--9 > .aem-GridColumn.aem-GridColumn--offset--default--6 {
  margin-left: 66.66666667%;
}
.aem-Grid.aem-Grid--default--9 > .aem-GridColumn.aem-GridColumn--offset--default--7 {
  margin-left: 77.77777778%;
}
.aem-Grid.aem-Grid--default--9 > .aem-GridColumn.aem-GridColumn--offset--default--8 {
  margin-left: 88.88888889%;
}
.aem-Grid.aem-Grid--default--9 > .aem-GridColumn.aem-GridColumn--offset--default--9 {
  margin-left: 100%;
}
.aem-Grid.aem-Grid--default--10 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 10%;
}
.aem-Grid.aem-Grid--default--10 > .aem-GridColumn.aem-GridColumn--default--2 {
  float: left;
  clear: none;
  width: 20%;
}
.aem-Grid.aem-Grid--default--10 > .aem-GridColumn.aem-GridColumn--default--3 {
  float: left;
  clear: none;
  width: 30%;
}
.aem-Grid.aem-Grid--default--10 > .aem-GridColumn.aem-GridColumn--default--4 {
  float: left;
  clear: none;
  width: 40%;
}
.aem-Grid.aem-Grid--default--10 > .aem-GridColumn.aem-GridColumn--default--5 {
  float: left;
  clear: none;
  width: 50%;
}
.aem-Grid.aem-Grid--default--10 > .aem-GridColumn.aem-GridColumn--default--6 {
  float: left;
  clear: none;
  width: 60%;
}
.aem-Grid.aem-Grid--default--10 > .aem-GridColumn.aem-GridColumn--default--7 {
  float: left;
  clear: none;
  width: 70%;
}
.aem-Grid.aem-Grid--default--10 > .aem-GridColumn.aem-GridColumn--default--8 {
  float: left;
  clear: none;
  width: 80%;
}
.aem-Grid.aem-Grid--default--10 > .aem-GridColumn.aem-GridColumn--default--9 {
  float: left;
  clear: none;
  width: 90%;
}
.aem-Grid.aem-Grid--default--10 > .aem-GridColumn.aem-GridColumn--default--10 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--default--10 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--default--10 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 10%;
}
.aem-Grid.aem-Grid--default--10 > .aem-GridColumn.aem-GridColumn--offset--default--2 {
  margin-left: 20%;
}
.aem-Grid.aem-Grid--default--10 > .aem-GridColumn.aem-GridColumn--offset--default--3 {
  margin-left: 30%;
}
.aem-Grid.aem-Grid--default--10 > .aem-GridColumn.aem-GridColumn--offset--default--4 {
  margin-left: 40%;
}
.aem-Grid.aem-Grid--default--10 > .aem-GridColumn.aem-GridColumn--offset--default--5 {
  margin-left: 50%;
}
.aem-Grid.aem-Grid--default--10 > .aem-GridColumn.aem-GridColumn--offset--default--6 {
  margin-left: 60%;
}
.aem-Grid.aem-Grid--default--10 > .aem-GridColumn.aem-GridColumn--offset--default--7 {
  margin-left: 70%;
}
.aem-Grid.aem-Grid--default--10 > .aem-GridColumn.aem-GridColumn--offset--default--8 {
  margin-left: 80%;
}
.aem-Grid.aem-Grid--default--10 > .aem-GridColumn.aem-GridColumn--offset--default--9 {
  margin-left: 90%;
}
.aem-Grid.aem-Grid--default--10 > .aem-GridColumn.aem-GridColumn--offset--default--10 {
  margin-left: 100%;
}
.aem-Grid.aem-Grid--default--11 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 9.09090909%;
}
.aem-Grid.aem-Grid--default--11 > .aem-GridColumn.aem-GridColumn--default--2 {
  float: left;
  clear: none;
  width: 18.18181818%;
}
.aem-Grid.aem-Grid--default--11 > .aem-GridColumn.aem-GridColumn--default--3 {
  float: left;
  clear: none;
  width: 27.27272727%;
}
.aem-Grid.aem-Grid--default--11 > .aem-GridColumn.aem-GridColumn--default--4 {
  float: left;
  clear: none;
  width: 36.36363636%;
}
.aem-Grid.aem-Grid--default--11 > .aem-GridColumn.aem-GridColumn--default--5 {
  float: left;
  clear: none;
  width: 45.45454545%;
}
.aem-Grid.aem-Grid--default--11 > .aem-GridColumn.aem-GridColumn--default--6 {
  float: left;
  clear: none;
  width: 54.54545455%;
}
.aem-Grid.aem-Grid--default--11 > .aem-GridColumn.aem-GridColumn--default--7 {
  float: left;
  clear: none;
  width: 63.63636364%;
}
.aem-Grid.aem-Grid--default--11 > .aem-GridColumn.aem-GridColumn--default--8 {
  float: left;
  clear: none;
  width: 72.72727273%;
}
.aem-Grid.aem-Grid--default--11 > .aem-GridColumn.aem-GridColumn--default--9 {
  float: left;
  clear: none;
  width: 81.81818182%;
}
.aem-Grid.aem-Grid--default--11 > .aem-GridColumn.aem-GridColumn--default--10 {
  float: left;
  clear: none;
  width: 90.90909091%;
}
.aem-Grid.aem-Grid--default--11 > .aem-GridColumn.aem-GridColumn--default--11 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--default--11 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--default--11 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 9.09090909%;
}
.aem-Grid.aem-Grid--default--11 > .aem-GridColumn.aem-GridColumn--offset--default--2 {
  margin-left: 18.18181818%;
}
.aem-Grid.aem-Grid--default--11 > .aem-GridColumn.aem-GridColumn--offset--default--3 {
  margin-left: 27.27272727%;
}
.aem-Grid.aem-Grid--default--11 > .aem-GridColumn.aem-GridColumn--offset--default--4 {
  margin-left: 36.36363636%;
}
.aem-Grid.aem-Grid--default--11 > .aem-GridColumn.aem-GridColumn--offset--default--5 {
  margin-left: 45.45454545%;
}
.aem-Grid.aem-Grid--default--11 > .aem-GridColumn.aem-GridColumn--offset--default--6 {
  margin-left: 54.54545455%;
}
.aem-Grid.aem-Grid--default--11 > .aem-GridColumn.aem-GridColumn--offset--default--7 {
  margin-left: 63.63636364%;
}
.aem-Grid.aem-Grid--default--11 > .aem-GridColumn.aem-GridColumn--offset--default--8 {
  margin-left: 72.72727273%;
}
.aem-Grid.aem-Grid--default--11 > .aem-GridColumn.aem-GridColumn--offset--default--9 {
  margin-left: 81.81818182%;
}
.aem-Grid.aem-Grid--default--11 > .aem-GridColumn.aem-GridColumn--offset--default--10 {
  margin-left: 90.90909091%;
}
.aem-Grid.aem-Grid--default--11 > .aem-GridColumn.aem-GridColumn--offset--default--11 {
  margin-left: 100%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--default--1 {
  float: left;
  clear: none;
  width: 8.33333333%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--default--2 {
  float: left;
  clear: none;
  width: 16.66666667%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--default--3 {
  float: left;
  clear: none;
  width: 25%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--default--4 {
  float: left;
  clear: none;
  width: 33.33333333%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--default--5 {
  float: left;
  clear: none;
  width: 41.66666667%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--default--6 {
  float: left;
  clear: none;
  width: 50%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--default--7 {
  float: left;
  clear: none;
  width: 58.33333333%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--default--8 {
  float: left;
  clear: none;
  width: 66.66666667%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--default--9 {
  float: left;
  clear: none;
  width: 75%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--default--10 {
  float: left;
  clear: none;
  width: 83.33333333%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--default--11 {
  float: left;
  clear: none;
  width: 91.66666667%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--default--12 {
  float: left;
  clear: none;
  width: 100%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--offset--default--0 {
  margin-left: 0%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--offset--default--1 {
  margin-left: 8.33333333%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--offset--default--2 {
  margin-left: 16.66666667%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--offset--default--3 {
  margin-left: 25%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--offset--default--4 {
  margin-left: 33.33333333%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--offset--default--5 {
  margin-left: 41.66666667%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--offset--default--6 {
  margin-left: 50%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--offset--default--7 {
  margin-left: 58.33333333%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--offset--default--8 {
  margin-left: 66.66666667%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--offset--default--9 {
  margin-left: 75%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--offset--default--10 {
  margin-left: 83.33333333%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--offset--default--11 {
  margin-left: 91.66666667%;
}
.aem-Grid.aem-Grid--default--12 > .aem-GridColumn.aem-GridColumn--offset--default--12 {
  margin-left: 100%;
}
.aem-Grid > .aem-GridColumn.aem-GridColumn--default--newline {
  /* newline behavior */
  display: block;
  clear: both !important;
}
.aem-Grid > .aem-GridColumn.aem-GridColumn--default--none {
  /* none behavior */
  display: block;
  clear: none !important;
  float: left;
}
.aem-Grid > .aem-GridColumn.aem-GridColumn--default--hide {
  /* hide behavior */
  display: none;
}
/* phone breakpoint */
@media (max-width: 768px) {
  .aem-Grid.aem-Grid--1 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--1 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--1 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--2 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--2 > .aem-GridColumn.aem-GridColumn--phone--2 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--2 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--2 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--2 > .aem-GridColumn.aem-GridColumn--offset--phone--2 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--3 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 33.33333333%;
  }
  .aem-Grid.aem-Grid--3 > .aem-GridColumn.aem-GridColumn--phone--2 {
    float: left;
    clear: none;
    width: 66.66666667%;
  }
  .aem-Grid.aem-Grid--3 > .aem-GridColumn.aem-GridColumn--phone--3 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--3 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--3 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 33.33333333%;
  }
  .aem-Grid.aem-Grid--3 > .aem-GridColumn.aem-GridColumn--offset--phone--2 {
    margin-left: 66.66666667%;
  }
  .aem-Grid.aem-Grid--3 > .aem-GridColumn.aem-GridColumn--offset--phone--3 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 25%;
  }
  .aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--phone--2 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--phone--3 {
    float: left;
    clear: none;
    width: 75%;
  }
  .aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--phone--4 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 25%;
  }
  .aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--offset--phone--2 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--offset--phone--3 {
    margin-left: 75%;
  }
  .aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--offset--phone--4 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 20%;
  }
  .aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--phone--2 {
    float: left;
    clear: none;
    width: 40%;
  }
  .aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--phone--3 {
    float: left;
    clear: none;
    width: 60%;
  }
  .aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--phone--4 {
    float: left;
    clear: none;
    width: 80%;
  }
  .aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--phone--5 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 20%;
  }
  .aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--offset--phone--2 {
    margin-left: 40%;
  }
  .aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--offset--phone--3 {
    margin-left: 60%;
  }
  .aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--offset--phone--4 {
    margin-left: 80%;
  }
  .aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--offset--phone--5 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 16.66666667%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--phone--2 {
    float: left;
    clear: none;
    width: 33.33333333%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--phone--3 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--phone--4 {
    float: left;
    clear: none;
    width: 66.66666667%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--phone--5 {
    float: left;
    clear: none;
    width: 83.33333333%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--phone--6 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 16.66666667%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--offset--phone--2 {
    margin-left: 33.33333333%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--offset--phone--3 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--offset--phone--4 {
    margin-left: 66.66666667%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--offset--phone--5 {
    margin-left: 83.33333333%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--offset--phone--6 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 14.28571429%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--phone--2 {
    float: left;
    clear: none;
    width: 28.57142857%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--phone--3 {
    float: left;
    clear: none;
    width: 42.85714286%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--phone--4 {
    float: left;
    clear: none;
    width: 57.14285714%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--phone--5 {
    float: left;
    clear: none;
    width: 71.42857143%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--phone--6 {
    float: left;
    clear: none;
    width: 85.71428571%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--phone--7 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 14.28571429%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--phone--2 {
    margin-left: 28.57142857%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--phone--3 {
    margin-left: 42.85714286%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--phone--4 {
    margin-left: 57.14285714%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--phone--5 {
    margin-left: 71.42857143%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--phone--6 {
    margin-left: 85.71428571%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--phone--7 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 12.5%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--phone--2 {
    float: left;
    clear: none;
    width: 25%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--phone--3 {
    float: left;
    clear: none;
    width: 37.5%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--phone--4 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--phone--5 {
    float: left;
    clear: none;
    width: 62.5%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--phone--6 {
    float: left;
    clear: none;
    width: 75%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--phone--7 {
    float: left;
    clear: none;
    width: 87.5%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--phone--8 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 12.5%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--phone--2 {
    margin-left: 25%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--phone--3 {
    margin-left: 37.5%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--phone--4 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--phone--5 {
    margin-left: 62.5%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--phone--6 {
    margin-left: 75%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--phone--7 {
    margin-left: 87.5%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--phone--8 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 11.11111111%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--phone--2 {
    float: left;
    clear: none;
    width: 22.22222222%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--phone--3 {
    float: left;
    clear: none;
    width: 33.33333333%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--phone--4 {
    float: left;
    clear: none;
    width: 44.44444444%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--phone--5 {
    float: left;
    clear: none;
    width: 55.55555556%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--phone--6 {
    float: left;
    clear: none;
    width: 66.66666667%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--phone--7 {
    float: left;
    clear: none;
    width: 77.77777778%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--phone--8 {
    float: left;
    clear: none;
    width: 88.88888889%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--phone--9 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 11.11111111%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--phone--2 {
    margin-left: 22.22222222%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--phone--3 {
    margin-left: 33.33333333%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--phone--4 {
    margin-left: 44.44444444%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--phone--5 {
    margin-left: 55.55555556%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--phone--6 {
    margin-left: 66.66666667%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--phone--7 {
    margin-left: 77.77777778%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--phone--8 {
    margin-left: 88.88888889%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--phone--9 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 10%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--phone--2 {
    float: left;
    clear: none;
    width: 20%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--phone--3 {
    float: left;
    clear: none;
    width: 30%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--phone--4 {
    float: left;
    clear: none;
    width: 40%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--phone--5 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--phone--6 {
    float: left;
    clear: none;
    width: 60%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--phone--7 {
    float: left;
    clear: none;
    width: 70%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--phone--8 {
    float: left;
    clear: none;
    width: 80%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--phone--9 {
    float: left;
    clear: none;
    width: 90%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--phone--10 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 10%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--phone--2 {
    margin-left: 20%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--phone--3 {
    margin-left: 30%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--phone--4 {
    margin-left: 40%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--phone--5 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--phone--6 {
    margin-left: 60%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--phone--7 {
    margin-left: 70%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--phone--8 {
    margin-left: 80%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--phone--9 {
    margin-left: 90%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--phone--10 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 9.09090909%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--phone--2 {
    float: left;
    clear: none;
    width: 18.18181818%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--phone--3 {
    float: left;
    clear: none;
    width: 27.27272727%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--phone--4 {
    float: left;
    clear: none;
    width: 36.36363636%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--phone--5 {
    float: left;
    clear: none;
    width: 45.45454545%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--phone--6 {
    float: left;
    clear: none;
    width: 54.54545455%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--phone--7 {
    float: left;
    clear: none;
    width: 63.63636364%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--phone--8 {
    float: left;
    clear: none;
    width: 72.72727273%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--phone--9 {
    float: left;
    clear: none;
    width: 81.81818182%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--phone--10 {
    float: left;
    clear: none;
    width: 90.90909091%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--phone--11 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 9.09090909%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--phone--2 {
    margin-left: 18.18181818%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--phone--3 {
    margin-left: 27.27272727%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--phone--4 {
    margin-left: 36.36363636%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--phone--5 {
    margin-left: 45.45454545%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--phone--6 {
    margin-left: 54.54545455%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--phone--7 {
    margin-left: 63.63636364%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--phone--8 {
    margin-left: 72.72727273%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--phone--9 {
    margin-left: 81.81818182%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--phone--10 {
    margin-left: 90.90909091%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--phone--11 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 8.33333333%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--phone--2 {
    float: left;
    clear: none;
    width: 16.66666667%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--phone--3 {
    float: left;
    clear: none;
    width: 25%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--phone--4 {
    float: left;
    clear: none;
    width: 33.33333333%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--phone--5 {
    float: left;
    clear: none;
    width: 41.66666667%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--phone--6 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--phone--7 {
    float: left;
    clear: none;
    width: 58.33333333%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--phone--8 {
    float: left;
    clear: none;
    width: 66.66666667%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--phone--9 {
    float: left;
    clear: none;
    width: 75%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--phone--10 {
    float: left;
    clear: none;
    width: 83.33333333%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--phone--11 {
    float: left;
    clear: none;
    width: 91.66666667%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--phone--12 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 8.33333333%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--phone--2 {
    margin-left: 16.66666667%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--phone--3 {
    margin-left: 25%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--phone--4 {
    margin-left: 33.33333333%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--phone--5 {
    margin-left: 41.66666667%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--phone--6 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--phone--7 {
    margin-left: 58.33333333%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--phone--8 {
    margin-left: 66.66666667%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--phone--9 {
    margin-left: 75%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--phone--10 {
    margin-left: 83.33333333%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--phone--11 {
    margin-left: 91.66666667%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--phone--12 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--phone--1 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--phone--1 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--phone--1 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--phone--2 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--phone--2 > .aem-GridColumn.aem-GridColumn--phone--2 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--phone--2 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--phone--2 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--phone--2 > .aem-GridColumn.aem-GridColumn--offset--phone--2 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--phone--3 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 33.33333333%;
  }
  .aem-Grid.aem-Grid--phone--3 > .aem-GridColumn.aem-GridColumn--phone--2 {
    float: left;
    clear: none;
    width: 66.66666667%;
  }
  .aem-Grid.aem-Grid--phone--3 > .aem-GridColumn.aem-GridColumn--phone--3 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--phone--3 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--phone--3 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 33.33333333%;
  }
  .aem-Grid.aem-Grid--phone--3 > .aem-GridColumn.aem-GridColumn--offset--phone--2 {
    margin-left: 66.66666667%;
  }
  .aem-Grid.aem-Grid--phone--3 > .aem-GridColumn.aem-GridColumn--offset--phone--3 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--phone--4 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 25%;
  }
  .aem-Grid.aem-Grid--phone--4 > .aem-GridColumn.aem-GridColumn--phone--2 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--phone--4 > .aem-GridColumn.aem-GridColumn--phone--3 {
    float: left;
    clear: none;
    width: 75%;
  }
  .aem-Grid.aem-Grid--phone--4 > .aem-GridColumn.aem-GridColumn--phone--4 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--phone--4 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--phone--4 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 25%;
  }
  .aem-Grid.aem-Grid--phone--4 > .aem-GridColumn.aem-GridColumn--offset--phone--2 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--phone--4 > .aem-GridColumn.aem-GridColumn--offset--phone--3 {
    margin-left: 75%;
  }
  .aem-Grid.aem-Grid--phone--4 > .aem-GridColumn.aem-GridColumn--offset--phone--4 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--phone--5 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 20%;
  }
  .aem-Grid.aem-Grid--phone--5 > .aem-GridColumn.aem-GridColumn--phone--2 {
    float: left;
    clear: none;
    width: 40%;
  }
  .aem-Grid.aem-Grid--phone--5 > .aem-GridColumn.aem-GridColumn--phone--3 {
    float: left;
    clear: none;
    width: 60%;
  }
  .aem-Grid.aem-Grid--phone--5 > .aem-GridColumn.aem-GridColumn--phone--4 {
    float: left;
    clear: none;
    width: 80%;
  }
  .aem-Grid.aem-Grid--phone--5 > .aem-GridColumn.aem-GridColumn--phone--5 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--phone--5 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--phone--5 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 20%;
  }
  .aem-Grid.aem-Grid--phone--5 > .aem-GridColumn.aem-GridColumn--offset--phone--2 {
    margin-left: 40%;
  }
  .aem-Grid.aem-Grid--phone--5 > .aem-GridColumn.aem-GridColumn--offset--phone--3 {
    margin-left: 60%;
  }
  .aem-Grid.aem-Grid--phone--5 > .aem-GridColumn.aem-GridColumn--offset--phone--4 {
    margin-left: 80%;
  }
  .aem-Grid.aem-Grid--phone--5 > .aem-GridColumn.aem-GridColumn--offset--phone--5 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--phone--6 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 16.66666667%;
  }
  .aem-Grid.aem-Grid--phone--6 > .aem-GridColumn.aem-GridColumn--phone--2 {
    float: left;
    clear: none;
    width: 33.33333333%;
  }
  .aem-Grid.aem-Grid--phone--6 > .aem-GridColumn.aem-GridColumn--phone--3 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--phone--6 > .aem-GridColumn.aem-GridColumn--phone--4 {
    float: left;
    clear: none;
    width: 66.66666667%;
  }
  .aem-Grid.aem-Grid--phone--6 > .aem-GridColumn.aem-GridColumn--phone--5 {
    float: left;
    clear: none;
    width: 83.33333333%;
  }
  .aem-Grid.aem-Grid--phone--6 > .aem-GridColumn.aem-GridColumn--phone--6 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--phone--6 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--phone--6 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 16.66666667%;
  }
  .aem-Grid.aem-Grid--phone--6 > .aem-GridColumn.aem-GridColumn--offset--phone--2 {
    margin-left: 33.33333333%;
  }
  .aem-Grid.aem-Grid--phone--6 > .aem-GridColumn.aem-GridColumn--offset--phone--3 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--phone--6 > .aem-GridColumn.aem-GridColumn--offset--phone--4 {
    margin-left: 66.66666667%;
  }
  .aem-Grid.aem-Grid--phone--6 > .aem-GridColumn.aem-GridColumn--offset--phone--5 {
    margin-left: 83.33333333%;
  }
  .aem-Grid.aem-Grid--phone--6 > .aem-GridColumn.aem-GridColumn--offset--phone--6 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--phone--7 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 14.28571429%;
  }
  .aem-Grid.aem-Grid--phone--7 > .aem-GridColumn.aem-GridColumn--phone--2 {
    float: left;
    clear: none;
    width: 28.57142857%;
  }
  .aem-Grid.aem-Grid--phone--7 > .aem-GridColumn.aem-GridColumn--phone--3 {
    float: left;
    clear: none;
    width: 42.85714286%;
  }
  .aem-Grid.aem-Grid--phone--7 > .aem-GridColumn.aem-GridColumn--phone--4 {
    float: left;
    clear: none;
    width: 57.14285714%;
  }
  .aem-Grid.aem-Grid--phone--7 > .aem-GridColumn.aem-GridColumn--phone--5 {
    float: left;
    clear: none;
    width: 71.42857143%;
  }
  .aem-Grid.aem-Grid--phone--7 > .aem-GridColumn.aem-GridColumn--phone--6 {
    float: left;
    clear: none;
    width: 85.71428571%;
  }
  .aem-Grid.aem-Grid--phone--7 > .aem-GridColumn.aem-GridColumn--phone--7 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--phone--7 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--phone--7 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 14.28571429%;
  }
  .aem-Grid.aem-Grid--phone--7 > .aem-GridColumn.aem-GridColumn--offset--phone--2 {
    margin-left: 28.57142857%;
  }
  .aem-Grid.aem-Grid--phone--7 > .aem-GridColumn.aem-GridColumn--offset--phone--3 {
    margin-left: 42.85714286%;
  }
  .aem-Grid.aem-Grid--phone--7 > .aem-GridColumn.aem-GridColumn--offset--phone--4 {
    margin-left: 57.14285714%;
  }
  .aem-Grid.aem-Grid--phone--7 > .aem-GridColumn.aem-GridColumn--offset--phone--5 {
    margin-left: 71.42857143%;
  }
  .aem-Grid.aem-Grid--phone--7 > .aem-GridColumn.aem-GridColumn--offset--phone--6 {
    margin-left: 85.71428571%;
  }
  .aem-Grid.aem-Grid--phone--7 > .aem-GridColumn.aem-GridColumn--offset--phone--7 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--phone--8 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 12.5%;
  }
  .aem-Grid.aem-Grid--phone--8 > .aem-GridColumn.aem-GridColumn--phone--2 {
    float: left;
    clear: none;
    width: 25%;
  }
  .aem-Grid.aem-Grid--phone--8 > .aem-GridColumn.aem-GridColumn--phone--3 {
    float: left;
    clear: none;
    width: 37.5%;
  }
  .aem-Grid.aem-Grid--phone--8 > .aem-GridColumn.aem-GridColumn--phone--4 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--phone--8 > .aem-GridColumn.aem-GridColumn--phone--5 {
    float: left;
    clear: none;
    width: 62.5%;
  }
  .aem-Grid.aem-Grid--phone--8 > .aem-GridColumn.aem-GridColumn--phone--6 {
    float: left;
    clear: none;
    width: 75%;
  }
  .aem-Grid.aem-Grid--phone--8 > .aem-GridColumn.aem-GridColumn--phone--7 {
    float: left;
    clear: none;
    width: 87.5%;
  }
  .aem-Grid.aem-Grid--phone--8 > .aem-GridColumn.aem-GridColumn--phone--8 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--phone--8 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--phone--8 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 12.5%;
  }
  .aem-Grid.aem-Grid--phone--8 > .aem-GridColumn.aem-GridColumn--offset--phone--2 {
    margin-left: 25%;
  }
  .aem-Grid.aem-Grid--phone--8 > .aem-GridColumn.aem-GridColumn--offset--phone--3 {
    margin-left: 37.5%;
  }
  .aem-Grid.aem-Grid--phone--8 > .aem-GridColumn.aem-GridColumn--offset--phone--4 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--phone--8 > .aem-GridColumn.aem-GridColumn--offset--phone--5 {
    margin-left: 62.5%;
  }
  .aem-Grid.aem-Grid--phone--8 > .aem-GridColumn.aem-GridColumn--offset--phone--6 {
    margin-left: 75%;
  }
  .aem-Grid.aem-Grid--phone--8 > .aem-GridColumn.aem-GridColumn--offset--phone--7 {
    margin-left: 87.5%;
  }
  .aem-Grid.aem-Grid--phone--8 > .aem-GridColumn.aem-GridColumn--offset--phone--8 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--phone--9 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 11.11111111%;
  }
  .aem-Grid.aem-Grid--phone--9 > .aem-GridColumn.aem-GridColumn--phone--2 {
    float: left;
    clear: none;
    width: 22.22222222%;
  }
  .aem-Grid.aem-Grid--phone--9 > .aem-GridColumn.aem-GridColumn--phone--3 {
    float: left;
    clear: none;
    width: 33.33333333%;
  }
  .aem-Grid.aem-Grid--phone--9 > .aem-GridColumn.aem-GridColumn--phone--4 {
    float: left;
    clear: none;
    width: 44.44444444%;
  }
  .aem-Grid.aem-Grid--phone--9 > .aem-GridColumn.aem-GridColumn--phone--5 {
    float: left;
    clear: none;
    width: 55.55555556%;
  }
  .aem-Grid.aem-Grid--phone--9 > .aem-GridColumn.aem-GridColumn--phone--6 {
    float: left;
    clear: none;
    width: 66.66666667%;
  }
  .aem-Grid.aem-Grid--phone--9 > .aem-GridColumn.aem-GridColumn--phone--7 {
    float: left;
    clear: none;
    width: 77.77777778%;
  }
  .aem-Grid.aem-Grid--phone--9 > .aem-GridColumn.aem-GridColumn--phone--8 {
    float: left;
    clear: none;
    width: 88.88888889%;
  }
  .aem-Grid.aem-Grid--phone--9 > .aem-GridColumn.aem-GridColumn--phone--9 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--phone--9 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--phone--9 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 11.11111111%;
  }
  .aem-Grid.aem-Grid--phone--9 > .aem-GridColumn.aem-GridColumn--offset--phone--2 {
    margin-left: 22.22222222%;
  }
  .aem-Grid.aem-Grid--phone--9 > .aem-GridColumn.aem-GridColumn--offset--phone--3 {
    margin-left: 33.33333333%;
  }
  .aem-Grid.aem-Grid--phone--9 > .aem-GridColumn.aem-GridColumn--offset--phone--4 {
    margin-left: 44.44444444%;
  }
  .aem-Grid.aem-Grid--phone--9 > .aem-GridColumn.aem-GridColumn--offset--phone--5 {
    margin-left: 55.55555556%;
  }
  .aem-Grid.aem-Grid--phone--9 > .aem-GridColumn.aem-GridColumn--offset--phone--6 {
    margin-left: 66.66666667%;
  }
  .aem-Grid.aem-Grid--phone--9 > .aem-GridColumn.aem-GridColumn--offset--phone--7 {
    margin-left: 77.77777778%;
  }
  .aem-Grid.aem-Grid--phone--9 > .aem-GridColumn.aem-GridColumn--offset--phone--8 {
    margin-left: 88.88888889%;
  }
  .aem-Grid.aem-Grid--phone--9 > .aem-GridColumn.aem-GridColumn--offset--phone--9 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--phone--10 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 10%;
  }
  .aem-Grid.aem-Grid--phone--10 > .aem-GridColumn.aem-GridColumn--phone--2 {
    float: left;
    clear: none;
    width: 20%;
  }
  .aem-Grid.aem-Grid--phone--10 > .aem-GridColumn.aem-GridColumn--phone--3 {
    float: left;
    clear: none;
    width: 30%;
  }
  .aem-Grid.aem-Grid--phone--10 > .aem-GridColumn.aem-GridColumn--phone--4 {
    float: left;
    clear: none;
    width: 40%;
  }
  .aem-Grid.aem-Grid--phone--10 > .aem-GridColumn.aem-GridColumn--phone--5 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--phone--10 > .aem-GridColumn.aem-GridColumn--phone--6 {
    float: left;
    clear: none;
    width: 60%;
  }
  .aem-Grid.aem-Grid--phone--10 > .aem-GridColumn.aem-GridColumn--phone--7 {
    float: left;
    clear: none;
    width: 70%;
  }
  .aem-Grid.aem-Grid--phone--10 > .aem-GridColumn.aem-GridColumn--phone--8 {
    float: left;
    clear: none;
    width: 80%;
  }
  .aem-Grid.aem-Grid--phone--10 > .aem-GridColumn.aem-GridColumn--phone--9 {
    float: left;
    clear: none;
    width: 90%;
  }
  .aem-Grid.aem-Grid--phone--10 > .aem-GridColumn.aem-GridColumn--phone--10 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--phone--10 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--phone--10 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 10%;
  }
  .aem-Grid.aem-Grid--phone--10 > .aem-GridColumn.aem-GridColumn--offset--phone--2 {
    margin-left: 20%;
  }
  .aem-Grid.aem-Grid--phone--10 > .aem-GridColumn.aem-GridColumn--offset--phone--3 {
    margin-left: 30%;
  }
  .aem-Grid.aem-Grid--phone--10 > .aem-GridColumn.aem-GridColumn--offset--phone--4 {
    margin-left: 40%;
  }
  .aem-Grid.aem-Grid--phone--10 > .aem-GridColumn.aem-GridColumn--offset--phone--5 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--phone--10 > .aem-GridColumn.aem-GridColumn--offset--phone--6 {
    margin-left: 60%;
  }
  .aem-Grid.aem-Grid--phone--10 > .aem-GridColumn.aem-GridColumn--offset--phone--7 {
    margin-left: 70%;
  }
  .aem-Grid.aem-Grid--phone--10 > .aem-GridColumn.aem-GridColumn--offset--phone--8 {
    margin-left: 80%;
  }
  .aem-Grid.aem-Grid--phone--10 > .aem-GridColumn.aem-GridColumn--offset--phone--9 {
    margin-left: 90%;
  }
  .aem-Grid.aem-Grid--phone--10 > .aem-GridColumn.aem-GridColumn--offset--phone--10 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--phone--11 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 9.09090909%;
  }
  .aem-Grid.aem-Grid--phone--11 > .aem-GridColumn.aem-GridColumn--phone--2 {
    float: left;
    clear: none;
    width: 18.18181818%;
  }
  .aem-Grid.aem-Grid--phone--11 > .aem-GridColumn.aem-GridColumn--phone--3 {
    float: left;
    clear: none;
    width: 27.27272727%;
  }
  .aem-Grid.aem-Grid--phone--11 > .aem-GridColumn.aem-GridColumn--phone--4 {
    float: left;
    clear: none;
    width: 36.36363636%;
  }
  .aem-Grid.aem-Grid--phone--11 > .aem-GridColumn.aem-GridColumn--phone--5 {
    float: left;
    clear: none;
    width: 45.45454545%;
  }
  .aem-Grid.aem-Grid--phone--11 > .aem-GridColumn.aem-GridColumn--phone--6 {
    float: left;
    clear: none;
    width: 54.54545455%;
  }
  .aem-Grid.aem-Grid--phone--11 > .aem-GridColumn.aem-GridColumn--phone--7 {
    float: left;
    clear: none;
    width: 63.63636364%;
  }
  .aem-Grid.aem-Grid--phone--11 > .aem-GridColumn.aem-GridColumn--phone--8 {
    float: left;
    clear: none;
    width: 72.72727273%;
  }
  .aem-Grid.aem-Grid--phone--11 > .aem-GridColumn.aem-GridColumn--phone--9 {
    float: left;
    clear: none;
    width: 81.81818182%;
  }
  .aem-Grid.aem-Grid--phone--11 > .aem-GridColumn.aem-GridColumn--phone--10 {
    float: left;
    clear: none;
    width: 90.90909091%;
  }
  .aem-Grid.aem-Grid--phone--11 > .aem-GridColumn.aem-GridColumn--phone--11 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--phone--11 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--phone--11 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 9.09090909%;
  }
  .aem-Grid.aem-Grid--phone--11 > .aem-GridColumn.aem-GridColumn--offset--phone--2 {
    margin-left: 18.18181818%;
  }
  .aem-Grid.aem-Grid--phone--11 > .aem-GridColumn.aem-GridColumn--offset--phone--3 {
    margin-left: 27.27272727%;
  }
  .aem-Grid.aem-Grid--phone--11 > .aem-GridColumn.aem-GridColumn--offset--phone--4 {
    margin-left: 36.36363636%;
  }
  .aem-Grid.aem-Grid--phone--11 > .aem-GridColumn.aem-GridColumn--offset--phone--5 {
    margin-left: 45.45454545%;
  }
  .aem-Grid.aem-Grid--phone--11 > .aem-GridColumn.aem-GridColumn--offset--phone--6 {
    margin-left: 54.54545455%;
  }
  .aem-Grid.aem-Grid--phone--11 > .aem-GridColumn.aem-GridColumn--offset--phone--7 {
    margin-left: 63.63636364%;
  }
  .aem-Grid.aem-Grid--phone--11 > .aem-GridColumn.aem-GridColumn--offset--phone--8 {
    margin-left: 72.72727273%;
  }
  .aem-Grid.aem-Grid--phone--11 > .aem-GridColumn.aem-GridColumn--offset--phone--9 {
    margin-left: 81.81818182%;
  }
  .aem-Grid.aem-Grid--phone--11 > .aem-GridColumn.aem-GridColumn--offset--phone--10 {
    margin-left: 90.90909091%;
  }
  .aem-Grid.aem-Grid--phone--11 > .aem-GridColumn.aem-GridColumn--offset--phone--11 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--phone--1 {
    float: left;
    clear: none;
    width: 8.33333333%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--phone--2 {
    float: left;
    clear: none;
    width: 16.66666667%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--phone--3 {
    float: left;
    clear: none;
    width: 25%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--phone--4 {
    float: left;
    clear: none;
    width: 33.33333333%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--phone--5 {
    float: left;
    clear: none;
    width: 41.66666667%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--phone--6 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--phone--7 {
    float: left;
    clear: none;
    width: 58.33333333%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--phone--8 {
    float: left;
    clear: none;
    width: 66.66666667%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--phone--9 {
    float: left;
    clear: none;
    width: 75%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--phone--10 {
    float: left;
    clear: none;
    width: 83.33333333%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--phone--11 {
    float: left;
    clear: none;
    width: 91.66666667%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--phone--12 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--offset--phone--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--offset--phone--1 {
    margin-left: 8.33333333%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--offset--phone--2 {
    margin-left: 16.66666667%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--offset--phone--3 {
    margin-left: 25%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--offset--phone--4 {
    margin-left: 33.33333333%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--offset--phone--5 {
    margin-left: 41.66666667%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--offset--phone--6 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--offset--phone--7 {
    margin-left: 58.33333333%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--offset--phone--8 {
    margin-left: 66.66666667%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--offset--phone--9 {
    margin-left: 75%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--offset--phone--10 {
    margin-left: 83.33333333%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--offset--phone--11 {
    margin-left: 91.66666667%;
  }
  .aem-Grid.aem-Grid--phone--12 > .aem-GridColumn.aem-GridColumn--offset--phone--12 {
    margin-left: 100%;
  }
  .aem-Grid > .aem-GridColumn.aem-GridColumn--phone--newline {
    /* newline behavior */
    display: block;
    clear: both !important;
  }
  .aem-Grid > .aem-GridColumn.aem-GridColumn--phone--none {
    /* none behavior */
    display: block;
    clear: none !important;
    float: left;
  }
  .aem-Grid > .aem-GridColumn.aem-GridColumn--phone--hide {
    /* hide behavior */
    display: none;
  }
}
/* tablet breakpoint */
@media (min-width: 769px) and (max-width: 1200px) {
  .aem-Grid.aem-Grid--1 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--1 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--1 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--2 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--2 > .aem-GridColumn.aem-GridColumn--tablet--2 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--2 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--2 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--2 > .aem-GridColumn.aem-GridColumn--offset--tablet--2 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--3 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 33.33333333%;
  }
  .aem-Grid.aem-Grid--3 > .aem-GridColumn.aem-GridColumn--tablet--2 {
    float: left;
    clear: none;
    width: 66.66666667%;
  }
  .aem-Grid.aem-Grid--3 > .aem-GridColumn.aem-GridColumn--tablet--3 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--3 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--3 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 33.33333333%;
  }
  .aem-Grid.aem-Grid--3 > .aem-GridColumn.aem-GridColumn--offset--tablet--2 {
    margin-left: 66.66666667%;
  }
  .aem-Grid.aem-Grid--3 > .aem-GridColumn.aem-GridColumn--offset--tablet--3 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 25%;
  }
  .aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--tablet--2 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--tablet--3 {
    float: left;
    clear: none;
    width: 75%;
  }
  .aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--tablet--4 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 25%;
  }
  .aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--offset--tablet--2 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--offset--tablet--3 {
    margin-left: 75%;
  }
  .aem-Grid.aem-Grid--4 > .aem-GridColumn.aem-GridColumn--offset--tablet--4 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 20%;
  }
  .aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--tablet--2 {
    float: left;
    clear: none;
    width: 40%;
  }
  .aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--tablet--3 {
    float: left;
    clear: none;
    width: 60%;
  }
  .aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--tablet--4 {
    float: left;
    clear: none;
    width: 80%;
  }
  .aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--tablet--5 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 20%;
  }
  .aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--offset--tablet--2 {
    margin-left: 40%;
  }
  .aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--offset--tablet--3 {
    margin-left: 60%;
  }
  .aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--offset--tablet--4 {
    margin-left: 80%;
  }
  .aem-Grid.aem-Grid--5 > .aem-GridColumn.aem-GridColumn--offset--tablet--5 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 16.66666667%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--tablet--2 {
    float: left;
    clear: none;
    width: 33.33333333%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--tablet--3 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--tablet--4 {
    float: left;
    clear: none;
    width: 66.66666667%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--tablet--5 {
    float: left;
    clear: none;
    width: 83.33333333%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--tablet--6 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 16.66666667%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--offset--tablet--2 {
    margin-left: 33.33333333%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--offset--tablet--3 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--offset--tablet--4 {
    margin-left: 66.66666667%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--offset--tablet--5 {
    margin-left: 83.33333333%;
  }
  .aem-Grid.aem-Grid--6 > .aem-GridColumn.aem-GridColumn--offset--tablet--6 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 14.28571429%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--tablet--2 {
    float: left;
    clear: none;
    width: 28.57142857%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--tablet--3 {
    float: left;
    clear: none;
    width: 42.85714286%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--tablet--4 {
    float: left;
    clear: none;
    width: 57.14285714%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--tablet--5 {
    float: left;
    clear: none;
    width: 71.42857143%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--tablet--6 {
    float: left;
    clear: none;
    width: 85.71428571%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--tablet--7 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 14.28571429%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--tablet--2 {
    margin-left: 28.57142857%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--tablet--3 {
    margin-left: 42.85714286%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--tablet--4 {
    margin-left: 57.14285714%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--tablet--5 {
    margin-left: 71.42857143%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--tablet--6 {
    margin-left: 85.71428571%;
  }
  .aem-Grid.aem-Grid--7 > .aem-GridColumn.aem-GridColumn--offset--tablet--7 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 12.5%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--tablet--2 {
    float: left;
    clear: none;
    width: 25%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--tablet--3 {
    float: left;
    clear: none;
    width: 37.5%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--tablet--4 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--tablet--5 {
    float: left;
    clear: none;
    width: 62.5%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--tablet--6 {
    float: left;
    clear: none;
    width: 75%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--tablet--7 {
    float: left;
    clear: none;
    width: 87.5%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--tablet--8 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 12.5%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--tablet--2 {
    margin-left: 25%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--tablet--3 {
    margin-left: 37.5%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--tablet--4 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--tablet--5 {
    margin-left: 62.5%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--tablet--6 {
    margin-left: 75%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--tablet--7 {
    margin-left: 87.5%;
  }
  .aem-Grid.aem-Grid--8 > .aem-GridColumn.aem-GridColumn--offset--tablet--8 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 11.11111111%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--tablet--2 {
    float: left;
    clear: none;
    width: 22.22222222%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--tablet--3 {
    float: left;
    clear: none;
    width: 33.33333333%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--tablet--4 {
    float: left;
    clear: none;
    width: 44.44444444%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--tablet--5 {
    float: left;
    clear: none;
    width: 55.55555556%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--tablet--6 {
    float: left;
    clear: none;
    width: 66.66666667%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--tablet--7 {
    float: left;
    clear: none;
    width: 77.77777778%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--tablet--8 {
    float: left;
    clear: none;
    width: 88.88888889%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--tablet--9 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 11.11111111%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--tablet--2 {
    margin-left: 22.22222222%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--tablet--3 {
    margin-left: 33.33333333%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--tablet--4 {
    margin-left: 44.44444444%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--tablet--5 {
    margin-left: 55.55555556%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--tablet--6 {
    margin-left: 66.66666667%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--tablet--7 {
    margin-left: 77.77777778%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--tablet--8 {
    margin-left: 88.88888889%;
  }
  .aem-Grid.aem-Grid--9 > .aem-GridColumn.aem-GridColumn--offset--tablet--9 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 10%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--tablet--2 {
    float: left;
    clear: none;
    width: 20%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--tablet--3 {
    float: left;
    clear: none;
    width: 30%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--tablet--4 {
    float: left;
    clear: none;
    width: 40%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--tablet--5 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--tablet--6 {
    float: left;
    clear: none;
    width: 60%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--tablet--7 {
    float: left;
    clear: none;
    width: 70%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--tablet--8 {
    float: left;
    clear: none;
    width: 80%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--tablet--9 {
    float: left;
    clear: none;
    width: 90%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--tablet--10 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 10%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--tablet--2 {
    margin-left: 20%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--tablet--3 {
    margin-left: 30%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--tablet--4 {
    margin-left: 40%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--tablet--5 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--tablet--6 {
    margin-left: 60%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--tablet--7 {
    margin-left: 70%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--tablet--8 {
    margin-left: 80%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--tablet--9 {
    margin-left: 90%;
  }
  .aem-Grid.aem-Grid--10 > .aem-GridColumn.aem-GridColumn--offset--tablet--10 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 9.09090909%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--tablet--2 {
    float: left;
    clear: none;
    width: 18.18181818%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--tablet--3 {
    float: left;
    clear: none;
    width: 27.27272727%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--tablet--4 {
    float: left;
    clear: none;
    width: 36.36363636%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--tablet--5 {
    float: left;
    clear: none;
    width: 45.45454545%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--tablet--6 {
    float: left;
    clear: none;
    width: 54.54545455%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--tablet--7 {
    float: left;
    clear: none;
    width: 63.63636364%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--tablet--8 {
    float: left;
    clear: none;
    width: 72.72727273%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--tablet--9 {
    float: left;
    clear: none;
    width: 81.81818182%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--tablet--10 {
    float: left;
    clear: none;
    width: 90.90909091%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--tablet--11 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 9.09090909%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--2 {
    margin-left: 18.18181818%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--3 {
    margin-left: 27.27272727%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--4 {
    margin-left: 36.36363636%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--5 {
    margin-left: 45.45454545%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--6 {
    margin-left: 54.54545455%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--7 {
    margin-left: 63.63636364%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--8 {
    margin-left: 72.72727273%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--9 {
    margin-left: 81.81818182%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--10 {
    margin-left: 90.90909091%;
  }
  .aem-Grid.aem-Grid--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--11 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 8.33333333%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--tablet--2 {
    float: left;
    clear: none;
    width: 16.66666667%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--tablet--3 {
    float: left;
    clear: none;
    width: 25%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--tablet--4 {
    float: left;
    clear: none;
    width: 33.33333333%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--tablet--5 {
    float: left;
    clear: none;
    width: 41.66666667%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--tablet--6 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--tablet--7 {
    float: left;
    clear: none;
    width: 58.33333333%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--tablet--8 {
    float: left;
    clear: none;
    width: 66.66666667%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--tablet--9 {
    float: left;
    clear: none;
    width: 75%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--tablet--10 {
    float: left;
    clear: none;
    width: 83.33333333%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--tablet--11 {
    float: left;
    clear: none;
    width: 91.66666667%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--tablet--12 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 8.33333333%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--2 {
    margin-left: 16.66666667%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--3 {
    margin-left: 25%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--4 {
    margin-left: 33.33333333%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--5 {
    margin-left: 41.66666667%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--6 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--7 {
    margin-left: 58.33333333%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--8 {
    margin-left: 66.66666667%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--9 {
    margin-left: 75%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--10 {
    margin-left: 83.33333333%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--11 {
    margin-left: 91.66666667%;
  }
  .aem-Grid.aem-Grid--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--12 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--tablet--1 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--tablet--1 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--tablet--1 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--tablet--2 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--tablet--2 > .aem-GridColumn.aem-GridColumn--tablet--2 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--tablet--2 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--tablet--2 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--tablet--2 > .aem-GridColumn.aem-GridColumn--offset--tablet--2 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--tablet--3 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 33.33333333%;
  }
  .aem-Grid.aem-Grid--tablet--3 > .aem-GridColumn.aem-GridColumn--tablet--2 {
    float: left;
    clear: none;
    width: 66.66666667%;
  }
  .aem-Grid.aem-Grid--tablet--3 > .aem-GridColumn.aem-GridColumn--tablet--3 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--tablet--3 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--tablet--3 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 33.33333333%;
  }
  .aem-Grid.aem-Grid--tablet--3 > .aem-GridColumn.aem-GridColumn--offset--tablet--2 {
    margin-left: 66.66666667%;
  }
  .aem-Grid.aem-Grid--tablet--3 > .aem-GridColumn.aem-GridColumn--offset--tablet--3 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--tablet--4 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 25%;
  }
  .aem-Grid.aem-Grid--tablet--4 > .aem-GridColumn.aem-GridColumn--tablet--2 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--tablet--4 > .aem-GridColumn.aem-GridColumn--tablet--3 {
    float: left;
    clear: none;
    width: 75%;
  }
  .aem-Grid.aem-Grid--tablet--4 > .aem-GridColumn.aem-GridColumn--tablet--4 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--tablet--4 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--tablet--4 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 25%;
  }
  .aem-Grid.aem-Grid--tablet--4 > .aem-GridColumn.aem-GridColumn--offset--tablet--2 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--tablet--4 > .aem-GridColumn.aem-GridColumn--offset--tablet--3 {
    margin-left: 75%;
  }
  .aem-Grid.aem-Grid--tablet--4 > .aem-GridColumn.aem-GridColumn--offset--tablet--4 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--tablet--5 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 20%;
  }
  .aem-Grid.aem-Grid--tablet--5 > .aem-GridColumn.aem-GridColumn--tablet--2 {
    float: left;
    clear: none;
    width: 40%;
  }
  .aem-Grid.aem-Grid--tablet--5 > .aem-GridColumn.aem-GridColumn--tablet--3 {
    float: left;
    clear: none;
    width: 60%;
  }
  .aem-Grid.aem-Grid--tablet--5 > .aem-GridColumn.aem-GridColumn--tablet--4 {
    float: left;
    clear: none;
    width: 80%;
  }
  .aem-Grid.aem-Grid--tablet--5 > .aem-GridColumn.aem-GridColumn--tablet--5 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--tablet--5 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--tablet--5 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 20%;
  }
  .aem-Grid.aem-Grid--tablet--5 > .aem-GridColumn.aem-GridColumn--offset--tablet--2 {
    margin-left: 40%;
  }
  .aem-Grid.aem-Grid--tablet--5 > .aem-GridColumn.aem-GridColumn--offset--tablet--3 {
    margin-left: 60%;
  }
  .aem-Grid.aem-Grid--tablet--5 > .aem-GridColumn.aem-GridColumn--offset--tablet--4 {
    margin-left: 80%;
  }
  .aem-Grid.aem-Grid--tablet--5 > .aem-GridColumn.aem-GridColumn--offset--tablet--5 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--tablet--6 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 16.66666667%;
  }
  .aem-Grid.aem-Grid--tablet--6 > .aem-GridColumn.aem-GridColumn--tablet--2 {
    float: left;
    clear: none;
    width: 33.33333333%;
  }
  .aem-Grid.aem-Grid--tablet--6 > .aem-GridColumn.aem-GridColumn--tablet--3 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--tablet--6 > .aem-GridColumn.aem-GridColumn--tablet--4 {
    float: left;
    clear: none;
    width: 66.66666667%;
  }
  .aem-Grid.aem-Grid--tablet--6 > .aem-GridColumn.aem-GridColumn--tablet--5 {
    float: left;
    clear: none;
    width: 83.33333333%;
  }
  .aem-Grid.aem-Grid--tablet--6 > .aem-GridColumn.aem-GridColumn--tablet--6 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--tablet--6 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--tablet--6 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 16.66666667%;
  }
  .aem-Grid.aem-Grid--tablet--6 > .aem-GridColumn.aem-GridColumn--offset--tablet--2 {
    margin-left: 33.33333333%;
  }
  .aem-Grid.aem-Grid--tablet--6 > .aem-GridColumn.aem-GridColumn--offset--tablet--3 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--tablet--6 > .aem-GridColumn.aem-GridColumn--offset--tablet--4 {
    margin-left: 66.66666667%;
  }
  .aem-Grid.aem-Grid--tablet--6 > .aem-GridColumn.aem-GridColumn--offset--tablet--5 {
    margin-left: 83.33333333%;
  }
  .aem-Grid.aem-Grid--tablet--6 > .aem-GridColumn.aem-GridColumn--offset--tablet--6 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--tablet--7 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 14.28571429%;
  }
  .aem-Grid.aem-Grid--tablet--7 > .aem-GridColumn.aem-GridColumn--tablet--2 {
    float: left;
    clear: none;
    width: 28.57142857%;
  }
  .aem-Grid.aem-Grid--tablet--7 > .aem-GridColumn.aem-GridColumn--tablet--3 {
    float: left;
    clear: none;
    width: 42.85714286%;
  }
  .aem-Grid.aem-Grid--tablet--7 > .aem-GridColumn.aem-GridColumn--tablet--4 {
    float: left;
    clear: none;
    width: 57.14285714%;
  }
  .aem-Grid.aem-Grid--tablet--7 > .aem-GridColumn.aem-GridColumn--tablet--5 {
    float: left;
    clear: none;
    width: 71.42857143%;
  }
  .aem-Grid.aem-Grid--tablet--7 > .aem-GridColumn.aem-GridColumn--tablet--6 {
    float: left;
    clear: none;
    width: 85.71428571%;
  }
  .aem-Grid.aem-Grid--tablet--7 > .aem-GridColumn.aem-GridColumn--tablet--7 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--tablet--7 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--tablet--7 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 14.28571429%;
  }
  .aem-Grid.aem-Grid--tablet--7 > .aem-GridColumn.aem-GridColumn--offset--tablet--2 {
    margin-left: 28.57142857%;
  }
  .aem-Grid.aem-Grid--tablet--7 > .aem-GridColumn.aem-GridColumn--offset--tablet--3 {
    margin-left: 42.85714286%;
  }
  .aem-Grid.aem-Grid--tablet--7 > .aem-GridColumn.aem-GridColumn--offset--tablet--4 {
    margin-left: 57.14285714%;
  }
  .aem-Grid.aem-Grid--tablet--7 > .aem-GridColumn.aem-GridColumn--offset--tablet--5 {
    margin-left: 71.42857143%;
  }
  .aem-Grid.aem-Grid--tablet--7 > .aem-GridColumn.aem-GridColumn--offset--tablet--6 {
    margin-left: 85.71428571%;
  }
  .aem-Grid.aem-Grid--tablet--7 > .aem-GridColumn.aem-GridColumn--offset--tablet--7 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--tablet--8 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 12.5%;
  }
  .aem-Grid.aem-Grid--tablet--8 > .aem-GridColumn.aem-GridColumn--tablet--2 {
    float: left;
    clear: none;
    width: 25%;
  }
  .aem-Grid.aem-Grid--tablet--8 > .aem-GridColumn.aem-GridColumn--tablet--3 {
    float: left;
    clear: none;
    width: 37.5%;
  }
  .aem-Grid.aem-Grid--tablet--8 > .aem-GridColumn.aem-GridColumn--tablet--4 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--tablet--8 > .aem-GridColumn.aem-GridColumn--tablet--5 {
    float: left;
    clear: none;
    width: 62.5%;
  }
  .aem-Grid.aem-Grid--tablet--8 > .aem-GridColumn.aem-GridColumn--tablet--6 {
    float: left;
    clear: none;
    width: 75%;
  }
  .aem-Grid.aem-Grid--tablet--8 > .aem-GridColumn.aem-GridColumn--tablet--7 {
    float: left;
    clear: none;
    width: 87.5%;
  }
  .aem-Grid.aem-Grid--tablet--8 > .aem-GridColumn.aem-GridColumn--tablet--8 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--tablet--8 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--tablet--8 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 12.5%;
  }
  .aem-Grid.aem-Grid--tablet--8 > .aem-GridColumn.aem-GridColumn--offset--tablet--2 {
    margin-left: 25%;
  }
  .aem-Grid.aem-Grid--tablet--8 > .aem-GridColumn.aem-GridColumn--offset--tablet--3 {
    margin-left: 37.5%;
  }
  .aem-Grid.aem-Grid--tablet--8 > .aem-GridColumn.aem-GridColumn--offset--tablet--4 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--tablet--8 > .aem-GridColumn.aem-GridColumn--offset--tablet--5 {
    margin-left: 62.5%;
  }
  .aem-Grid.aem-Grid--tablet--8 > .aem-GridColumn.aem-GridColumn--offset--tablet--6 {
    margin-left: 75%;
  }
  .aem-Grid.aem-Grid--tablet--8 > .aem-GridColumn.aem-GridColumn--offset--tablet--7 {
    margin-left: 87.5%;
  }
  .aem-Grid.aem-Grid--tablet--8 > .aem-GridColumn.aem-GridColumn--offset--tablet--8 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--tablet--9 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 11.11111111%;
  }
  .aem-Grid.aem-Grid--tablet--9 > .aem-GridColumn.aem-GridColumn--tablet--2 {
    float: left;
    clear: none;
    width: 22.22222222%;
  }
  .aem-Grid.aem-Grid--tablet--9 > .aem-GridColumn.aem-GridColumn--tablet--3 {
    float: left;
    clear: none;
    width: 33.33333333%;
  }
  .aem-Grid.aem-Grid--tablet--9 > .aem-GridColumn.aem-GridColumn--tablet--4 {
    float: left;
    clear: none;
    width: 44.44444444%;
  }
  .aem-Grid.aem-Grid--tablet--9 > .aem-GridColumn.aem-GridColumn--tablet--5 {
    float: left;
    clear: none;
    width: 55.55555556%;
  }
  .aem-Grid.aem-Grid--tablet--9 > .aem-GridColumn.aem-GridColumn--tablet--6 {
    float: left;
    clear: none;
    width: 66.66666667%;
  }
  .aem-Grid.aem-Grid--tablet--9 > .aem-GridColumn.aem-GridColumn--tablet--7 {
    float: left;
    clear: none;
    width: 77.77777778%;
  }
  .aem-Grid.aem-Grid--tablet--9 > .aem-GridColumn.aem-GridColumn--tablet--8 {
    float: left;
    clear: none;
    width: 88.88888889%;
  }
  .aem-Grid.aem-Grid--tablet--9 > .aem-GridColumn.aem-GridColumn--tablet--9 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--tablet--9 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--tablet--9 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 11.11111111%;
  }
  .aem-Grid.aem-Grid--tablet--9 > .aem-GridColumn.aem-GridColumn--offset--tablet--2 {
    margin-left: 22.22222222%;
  }
  .aem-Grid.aem-Grid--tablet--9 > .aem-GridColumn.aem-GridColumn--offset--tablet--3 {
    margin-left: 33.33333333%;
  }
  .aem-Grid.aem-Grid--tablet--9 > .aem-GridColumn.aem-GridColumn--offset--tablet--4 {
    margin-left: 44.44444444%;
  }
  .aem-Grid.aem-Grid--tablet--9 > .aem-GridColumn.aem-GridColumn--offset--tablet--5 {
    margin-left: 55.55555556%;
  }
  .aem-Grid.aem-Grid--tablet--9 > .aem-GridColumn.aem-GridColumn--offset--tablet--6 {
    margin-left: 66.66666667%;
  }
  .aem-Grid.aem-Grid--tablet--9 > .aem-GridColumn.aem-GridColumn--offset--tablet--7 {
    margin-left: 77.77777778%;
  }
  .aem-Grid.aem-Grid--tablet--9 > .aem-GridColumn.aem-GridColumn--offset--tablet--8 {
    margin-left: 88.88888889%;
  }
  .aem-Grid.aem-Grid--tablet--9 > .aem-GridColumn.aem-GridColumn--offset--tablet--9 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--tablet--10 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 10%;
  }
  .aem-Grid.aem-Grid--tablet--10 > .aem-GridColumn.aem-GridColumn--tablet--2 {
    float: left;
    clear: none;
    width: 20%;
  }
  .aem-Grid.aem-Grid--tablet--10 > .aem-GridColumn.aem-GridColumn--tablet--3 {
    float: left;
    clear: none;
    width: 30%;
  }
  .aem-Grid.aem-Grid--tablet--10 > .aem-GridColumn.aem-GridColumn--tablet--4 {
    float: left;
    clear: none;
    width: 40%;
  }
  .aem-Grid.aem-Grid--tablet--10 > .aem-GridColumn.aem-GridColumn--tablet--5 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--tablet--10 > .aem-GridColumn.aem-GridColumn--tablet--6 {
    float: left;
    clear: none;
    width: 60%;
  }
  .aem-Grid.aem-Grid--tablet--10 > .aem-GridColumn.aem-GridColumn--tablet--7 {
    float: left;
    clear: none;
    width: 70%;
  }
  .aem-Grid.aem-Grid--tablet--10 > .aem-GridColumn.aem-GridColumn--tablet--8 {
    float: left;
    clear: none;
    width: 80%;
  }
  .aem-Grid.aem-Grid--tablet--10 > .aem-GridColumn.aem-GridColumn--tablet--9 {
    float: left;
    clear: none;
    width: 90%;
  }
  .aem-Grid.aem-Grid--tablet--10 > .aem-GridColumn.aem-GridColumn--tablet--10 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--tablet--10 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--tablet--10 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 10%;
  }
  .aem-Grid.aem-Grid--tablet--10 > .aem-GridColumn.aem-GridColumn--offset--tablet--2 {
    margin-left: 20%;
  }
  .aem-Grid.aem-Grid--tablet--10 > .aem-GridColumn.aem-GridColumn--offset--tablet--3 {
    margin-left: 30%;
  }
  .aem-Grid.aem-Grid--tablet--10 > .aem-GridColumn.aem-GridColumn--offset--tablet--4 {
    margin-left: 40%;
  }
  .aem-Grid.aem-Grid--tablet--10 > .aem-GridColumn.aem-GridColumn--offset--tablet--5 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--tablet--10 > .aem-GridColumn.aem-GridColumn--offset--tablet--6 {
    margin-left: 60%;
  }
  .aem-Grid.aem-Grid--tablet--10 > .aem-GridColumn.aem-GridColumn--offset--tablet--7 {
    margin-left: 70%;
  }
  .aem-Grid.aem-Grid--tablet--10 > .aem-GridColumn.aem-GridColumn--offset--tablet--8 {
    margin-left: 80%;
  }
  .aem-Grid.aem-Grid--tablet--10 > .aem-GridColumn.aem-GridColumn--offset--tablet--9 {
    margin-left: 90%;
  }
  .aem-Grid.aem-Grid--tablet--10 > .aem-GridColumn.aem-GridColumn--offset--tablet--10 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--tablet--11 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 9.09090909%;
  }
  .aem-Grid.aem-Grid--tablet--11 > .aem-GridColumn.aem-GridColumn--tablet--2 {
    float: left;
    clear: none;
    width: 18.18181818%;
  }
  .aem-Grid.aem-Grid--tablet--11 > .aem-GridColumn.aem-GridColumn--tablet--3 {
    float: left;
    clear: none;
    width: 27.27272727%;
  }
  .aem-Grid.aem-Grid--tablet--11 > .aem-GridColumn.aem-GridColumn--tablet--4 {
    float: left;
    clear: none;
    width: 36.36363636%;
  }
  .aem-Grid.aem-Grid--tablet--11 > .aem-GridColumn.aem-GridColumn--tablet--5 {
    float: left;
    clear: none;
    width: 45.45454545%;
  }
  .aem-Grid.aem-Grid--tablet--11 > .aem-GridColumn.aem-GridColumn--tablet--6 {
    float: left;
    clear: none;
    width: 54.54545455%;
  }
  .aem-Grid.aem-Grid--tablet--11 > .aem-GridColumn.aem-GridColumn--tablet--7 {
    float: left;
    clear: none;
    width: 63.63636364%;
  }
  .aem-Grid.aem-Grid--tablet--11 > .aem-GridColumn.aem-GridColumn--tablet--8 {
    float: left;
    clear: none;
    width: 72.72727273%;
  }
  .aem-Grid.aem-Grid--tablet--11 > .aem-GridColumn.aem-GridColumn--tablet--9 {
    float: left;
    clear: none;
    width: 81.81818182%;
  }
  .aem-Grid.aem-Grid--tablet--11 > .aem-GridColumn.aem-GridColumn--tablet--10 {
    float: left;
    clear: none;
    width: 90.90909091%;
  }
  .aem-Grid.aem-Grid--tablet--11 > .aem-GridColumn.aem-GridColumn--tablet--11 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--tablet--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--tablet--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 9.09090909%;
  }
  .aem-Grid.aem-Grid--tablet--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--2 {
    margin-left: 18.18181818%;
  }
  .aem-Grid.aem-Grid--tablet--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--3 {
    margin-left: 27.27272727%;
  }
  .aem-Grid.aem-Grid--tablet--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--4 {
    margin-left: 36.36363636%;
  }
  .aem-Grid.aem-Grid--tablet--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--5 {
    margin-left: 45.45454545%;
  }
  .aem-Grid.aem-Grid--tablet--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--6 {
    margin-left: 54.54545455%;
  }
  .aem-Grid.aem-Grid--tablet--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--7 {
    margin-left: 63.63636364%;
  }
  .aem-Grid.aem-Grid--tablet--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--8 {
    margin-left: 72.72727273%;
  }
  .aem-Grid.aem-Grid--tablet--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--9 {
    margin-left: 81.81818182%;
  }
  .aem-Grid.aem-Grid--tablet--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--10 {
    margin-left: 90.90909091%;
  }
  .aem-Grid.aem-Grid--tablet--11 > .aem-GridColumn.aem-GridColumn--offset--tablet--11 {
    margin-left: 100%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--tablet--1 {
    float: left;
    clear: none;
    width: 8.33333333%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--tablet--2 {
    float: left;
    clear: none;
    width: 16.66666667%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--tablet--3 {
    float: left;
    clear: none;
    width: 25%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--tablet--4 {
    float: left;
    clear: none;
    width: 33.33333333%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--tablet--5 {
    float: left;
    clear: none;
    width: 41.66666667%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--tablet--6 {
    float: left;
    clear: none;
    width: 50%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--tablet--7 {
    float: left;
    clear: none;
    width: 58.33333333%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--tablet--8 {
    float: left;
    clear: none;
    width: 66.66666667%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--tablet--9 {
    float: left;
    clear: none;
    width: 75%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--tablet--10 {
    float: left;
    clear: none;
    width: 83.33333333%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--tablet--11 {
    float: left;
    clear: none;
    width: 91.66666667%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--tablet--12 {
    float: left;
    clear: none;
    width: 100%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--0 {
    margin-left: 0%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--1 {
    margin-left: 8.33333333%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--2 {
    margin-left: 16.66666667%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--3 {
    margin-left: 25%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--4 {
    margin-left: 33.33333333%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--5 {
    margin-left: 41.66666667%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--6 {
    margin-left: 50%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--7 {
    margin-left: 58.33333333%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--8 {
    margin-left: 66.66666667%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--9 {
    margin-left: 75%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--10 {
    margin-left: 83.33333333%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--11 {
    margin-left: 91.66666667%;
  }
  .aem-Grid.aem-Grid--tablet--12 > .aem-GridColumn.aem-GridColumn--offset--tablet--12 {
    margin-left: 100%;
  }
  .aem-Grid > .aem-GridColumn.aem-GridColumn--tablet--newline {
    /* newline behavior */
    display: block;
    clear: both !important;
  }
  .aem-Grid > .aem-GridColumn.aem-GridColumn--tablet--none {
    /* none behavior */
    display: block;
    clear: none !important;
    float: left;
  }
  .aem-Grid > .aem-GridColumn.aem-GridColumn--tablet--hide {
    /* hide behavior */
    display: none;
  }
}
/* force showing hidden components in unhide mode */
.aem-GridShowHidden > .cmp-container > .aem-Grid > .aem-GridColumn {
  display: block !important;
}

/* https://www.joshwcomeau.com/css/custom-css-reset/ */

  /* 1. Use a more-intuitive box-sizing model */

  *, *::before, *::after {
    box-sizing: border-box;
  }

  /* 2. Remove default margin */

  * {
    margin: 0;
  }

  /* 3. Enable keyword animations */

  @media (prefers-reduced-motion: no-preference) {
    html {
      /* SonarQube does not support this yet *
      /* interpolate-size: allow-keywords; */
    }
  }

  body {
    /* 4. Add accessible line-height */
    line-height: 1.5;

    /* 5. Improve text rendering */
    -webkit-font-smoothing: antialiased;
  }

  /* 6. Improve media defaults */

  img, picture, video, canvas, svg {
    display: block;
    max-width: 100%;
  }

  /* 7. Inherit fonts for form controls */

  input, button, textarea, select {
    font: inherit;
  }

  /* 8. Avoid text overflows */

  p, h1, h2, h3, h4, h5, h6 {
    overflow-wrap: break-word;
  }

  /* 9. Improve line wrapping */

  p {
    text-wrap: pretty;
  }

  /*
    10. Create a root stacking context
  */

  #root, #__next {
    isolation: isolate;
  }

  @font-face {
  font-family: "Decima Mono Pro";
  src: url("clientlib-base/resources/fonts/Decima Mono Pro/Decima Mono Pro Regular.eot"); /* IE9 Compat Modes */
  src: url("clientlib-base/resources/fonts/Decima Mono Pro/Decima Mono Pro Regular.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
       url("clientlib-base/resources/fonts/Decima Mono Pro/Decima Mono Pro Regular.woff") format("woff"), /* Modern Browsers */
       url("clientlib-base/resources/fonts/Decima Mono Pro/Decima Mono Pro Regular.ttf")  format("truetype"); /* Safari, Android, iOS */

  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

  @font-face {
  font-family: "Akkurat Mono";
  src: url("clientlib-base/resources/fonts/Akkurat Mono/Akkurat Mono.eot"); /* IE9 Compat Modes */
  src: url("clientlib-base/resources/fonts/Akkurat Mono/Akkurat Mono.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
       url("clientlib-base/resources/fonts/Akkurat Mono/Akkurat Mono.woff") format("woff"), /* Modern Browsers */
       url("clientlib-base/resources/fonts/Akkurat Mono/Akkurat Mono.ttf")  format("truetype"); /* Safari, Android, iOS */

  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

  @font-face {
  font-family: Toyota;
  src: url("clientlib-base/resources/fonts/Toyota/ToyotaType-Book.otf") format("opentype");
  font-weight: 100;
  font-style: normal;
}

  @font-face {
  font-family: Toyota;
  src: url("clientlib-base/resources/fonts/Toyota/ToyotaType-Regular.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}

  @font-face {
  font-family: Toyota;
  src: url("clientlib-base/resources/fonts/Toyota/ToyotaType-Semibold.otf") format("opentype");
  font-weight: 600;
  font-style: normal;
}

  @font-face {
  font-family: Toyota;
  src: url("clientlib-base/resources/fonts/Toyota/ToyotaType-Bold.otf") format("opentype");
  font-weight: 800;
  font-style: normal;
}

  /* ICONS (gr-icon-*) */

  /* To edit, drop all SVGs from /raw_icons/ to https://glyphter.com */

  @font-face {
  font-family: "GR Icons";
  src: url("clientlib-base/resources/fonts/GR-Icons/gr-icons.eot");
  src: url("clientlib-base/resources/fonts/GR-Icons/gr-icons.eot?#iefix") format("embedded-opentype"),
       url("clientlib-base/resources/fonts/GR-Icons/gr-icons.woff") format("woff"),
       url("clientlib-base/resources/fonts/GR-Icons/gr-icons.ttf") format("truetype"),
       url("clientlib-base/resources/fonts/GR-Icons/gr-icons.svg#gr-icons") format("svg");
  font-weight: normal;
  font-style: normal;
}

  :root {
  --font-heading: 'Decima Mono Pro', monospace;
  --font-body: 'Akkurat Mono', sans-serif;
  --font-brand: 'Toyota', sans-serif;
  --color-ebony-clay: #1E2B33;
  --color-red: #E60010;
  --color-gray-light: #F5F5F5;
  --color-gray: #999;
  --color-gray-dark: #616161;
  --color-almost-black: #141414;
  --color-battleship-gray: #74827E;
  --color-slate-blue: #293E50;
  --color-pine-green: #3E5450;
  --color-lexus-green: #ADAC19;
  --color-driver-background: #242424;
  --color-driver-blue: #505357;
  --color-race-series: #171717;

  /* section spacing */

  /* almost everything scales from 360-1568px */
  --section-spacing-x: clamp(1rem, 0.106rem + 3.974vw, 4rem); /* 16-64px */
  --section-spacing-y: clamp(3rem, 2.031rem + 4.305vw, 6.25rem); /* 48-100px */

  /* fluid sizes */
  --min-viewport-width: 320px;
  --max-viewport-width: 1920px;
  --min-font-size: 16px;

  /* nav */
  --nav-height-small: 64px;
  --nav-height-large: 90px;

  /* clip */
  --clip-small: polygon(0% 0%, 100% 0%, 100% calc(100% - 0.75rem), calc(100% - 0.75rem) 100%, 0% 100%); /* 12px */
  --clip-medium: polygon(0% 0%, 100% 0%, 100% calc(100% - 1.125rem), calc(100% - 1.125rem) 100%, 0% 100%); /* 18px */
  --clip-large: polygon(0% 0%, 100% 0%, 100% calc(100% - 1.5rem), calc(100% - 1.5rem) 100%, 0% 100%); /* 24px */
  --clip-xlarge: polygon(0% 0%, 100% 0%, 100% calc(100% - 3rem), calc(100% - 3rem) 100%, 0% 100%); /* 24px */

  /* button */
  --button-offset: calc(40px * -0.5);

  /* videoPlayer */
  --videoPlayer-item-height: clamp(7.313rem, 6.688rem + 3.125vw, 9.75rem); /* 117-156px */
  --videoPlayer-item-gap: 0.5rem;
  --videoPlayer-fade-height: 105px;
  --videoPlayer-max-items-before-scroll: 3;
  --videoPlayerItem-background-color: hsl(0deg 0% 11% / 100%);
  --videoPlayerItem-details-padding: clamp(0.875rem, 0.795rem + 0.401vw, 1.188rem); /* 14-19px */
}

  body {
  color: white;
  background-color: var(--color-almost-black);
  font-family: var(--font-body);
  overflow-x: hidden;
  overscroll-behavior-y: none;
  min-width: 320px;

  /* when the nav, menu, or video modal is open, prevent body scroll */
  &:is(.-navIsOpen, .-menuIsOpen, .-videoModalIsOpen) {
    overflow: hidden;
  }

  /* video modal has its own tint */
  &:is(.-navIsOpen, .-menuIsOpen) {
    .gr-tint {
      display: block;
    }
  }
}

  h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
}

  a {
  color: var(--color-red);

  &:hover {
    color: white;
  }
}

  p, li {
  /* scale: 16-25 @ 360-1568 */
  font-size: clamp(1rem, 0.832rem + 0.745vw, 1.563rem);
  line-height: 1.5;
}

  hr {
  display: block;
  width: 100%;
  border-color: rgb(255 255 255 / 15%);
  margin-block: 2rem;
}

  ul, ol, dl {
  list-style: none;
  padding: 0;
  margin: 0;
}

  .gr-page {
  color: white;
  background-color: black;
}

  /* this element is actually in the drivers Page */

  .gr-accordionWrapper {
  padding-bottom: 4rem;
}

  section {
  padding-bottom: 4rem;
  padding-top: 1px;

  &.-isDriversPage {
    background-color: var(--color-almost-black);

    .gr-accordionFilters {
      background-color: var(--color-almost-black);
    }
  }

  &.gr-grid.-driverItems {
    background-color: var(--color-driver-background);

    .gr-accordionFilters {
      background-color: var(--color-driver-background);
    }
  }
}

  .gr-section.gr-accordion {
  padding-block: 0;
  gap: 0;

  .gr-accordion__divider {
    display: none;

    hr {
      border-color: hsl(0deg 0% 100% / 95%);
    }
  }

  &:not(.-isHidden) + & {
    .gr-accordion__divider {
      display: block;
    }
  }

  .gr-accordion__toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;

    &:hover {
      cursor: pointer;
    }

    h2.gr-heading {
      display: flex;
      align-items: center;
      justify-content: space-between;
      width: 100%;
    }
    
    button {
      flex-shrink: 0;
      width: clamp(2.188rem, 1.787rem + 2.003vw, 3.75rem);
      height: clamp(2.188rem, 1.787rem + 2.003vw, 3.75rem);
      border: none;
      border-radius: 100%;
      cursor: pointer;
      display: flex;
      justify-content: center;
      align-items: center;
      margin-left: 1rem;
      font-size: 1rem;

      .gr-icon {
        transform: rotate(135deg);
        transition: transform 150ms linear;
        pointer-events: none;
      }

      &:hover {
        background-color: var(--color-red);
        color: white;
      }

      .gr-accordion.-isOpen & {
        background-color: var(--color-red);
        color: white;

        .gr-icon {
          transform: rotate(315deg);
        }
      }
    }

    /* this is the Container that houses the Heading and the button */
    .gr-container:has(&) {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;

      @media screen and (width >= 768px) {
        align-items: center;
      }
    }
  }

  .gr-accordion__contents {
    display: grid;
    gap: 2.5rem 0.625rem;
    overflow: hidden;
    max-height: 0;
    margin-block: 2rem;
    margin-top: 0;
    margin-bottom: 0;
    transition: max-height 0.5s ease-out, margin-top 0.35s ease-out, margin-bottom 0.35s ease-out;

    @media screen and (width >= 768px) {
      grid: auto / repeat(3, minmax(0, 1fr));
    }

    @media screen and (width >= 1280px) {
      grid: auto / repeat(5, minmax(0, 1fr));
    }

    .gr-accordion.-isOpen & {
      max-height: 1000rem;
      margin-top: 2rem;
      margin-bottom: 2rem;
      transition: max-height 0.5s ease-in, margin-top 0.002s ease-in 0.035s, margin-bottom 0.35s ease-in;
    }
  }
}

  .gr-accordionFilters {
  margin-block: calc(var(--section-spacing-y) / 2);

  .gr-container {
    display: flex;
    flex-direction: column-reverse;
    justify-content: space-between;
    align-items: stretch;
    gap: 1rem;

    @media screen and (width >= 768px) {
      flex-direction: row;
    }
  }
}

  .gr-accordionFilters__toggles {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: stretch;
  gap: 1rem;
}

  .gr-articleBody {
  background-color: var(--color-almost-black);
  color: white;
}

  /* fix for unexpected aem containers */

  .aem-GridColumn {
  &.text, &.image {
    margin-bottom: clamp(2.5rem, 1.779rem + 3.606vw, 5.313rem);
  }
}

  /* everything below scales from 320-1568px */

  .gr-articleBodyRichText {
  /* allow maximum viewport space at smallest devices and no more */
  max-width: 100%;

  @media screen and (width >= 480px) {
    max-width: 1000px;
  }

  margin: 0 auto;
  color: white;

  & > :first-child {
    margin-top: 0;
  }

  & > :last-child {
    margin-bottom: 0;
  }

  & h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    font-size: clamp(1.875rem, 1.554rem + 1.603vw, 3.125rem);
    line-height: 1.0;
    font-weight: 400;
    margin-block: clamp(2.5rem, 1.779rem + 3.606vw, 5.313rem); /* 40-85px */

    &:has(+ p, + ol, + ul, + hr) {
      margin-block: 2rem;
      line-height: 1.5;
      margin-top: clamp(2.5rem, 1.779rem + 3.606vw, 5.313rem);
    }
  }

  p {
    font-size: clamp(1rem, 0.968rem + 0.16vw, 1.125rem); /* 16-18px */
    line-height: 2;

    /* if it has a sibling paragraph, reduce bottom margin from first one */
    &:has(+ p, + ol, + ul, + hr) {
      margin-bottom: 2rem;
    }

    & + p {
      margin-top: 0;
    }
  }

  /* style only OLs and UL that are direct descendents of the rich-text styling class */
  > ol {
    padding-inline-start: 2.1rem;
  }

  > ul {
    padding-inline-start: 1.2rem;
  }
  
  > ol, > ul {
    list-style: revert;
    margin-block: 1em;

    li {
      font-size: clamp(1rem, 0.968rem + 0.16vw, 1.125rem); /* 16-18px */
      margin-top: 1rem;

      @media screen and (width >= 768px) {
        margin-top: 1.5rem;
      }
    }

    ol, ul {
      list-style: revert;
      margin-block: .5em;
      padding-inline-start: 40px;

      li {
        margin-top: 1rem;

        @media screen and (width >= 768px) {
          margin-top: 1.5rem;
        }
      }
    }
  }

  /* share tools should not get this styling when in rich text */
  .gr-articleShareTools {
    ul {
      list-style: none;
    }
  }

  blockquote {
    border-left: clamp(0.188rem, 0.107rem + 0.401vw, 0.5rem) solid var(--color-red);
    padding-left: clamp(1rem, 0.487rem + 2.564vw, 3rem); /* 16-48 */
    font-size: clamp(1.25rem, 1.122rem + 0.641vw, 1.75rem); /* 20-28px */
    line-height: 1.75;
    margin-block: clamp(2.5rem, 1.538rem + 4.808vw, 6.25rem); /* 40-100px */

    /* if it has a sibling blockquote, replace bottom margin from first one with padding to allow red border to "flow down" */
    &:has(+ blockquote) {
      margin-bottom: 0;
      padding-bottom: clamp(1.875rem, 1.587rem + 1.442vw, 3rem); /* 30-48px */
    }

    /* the 2nd blockquote should have no top margin */
    & + blockquote {
      margin-top: 0;
      font-size: clamp(1.25rem, 0.929rem + 1.603vw, 2.5rem); /* 20-40px */
      line-height: 1.125;
    }
  }

  hr {
    margin-block: clamp(2.5rem, 1.538rem + 4.808vw, 6.25rem); /* 40-100px */
    background-color: hsl(225deg 0% 30% / 100%);
    height: 1px;
    border: none;
  }
}

  table {
  width: 100%;
  border: none;
  border-collapse: separate;
  border-spacing: 5px;

  /* allow table scrolling on smallest devices to ensure prevent viewport being breached */
  *:has(> &) {
    display: block;
    overflow-x: scroll;

    @media screen and (width >= 480px) {
      overflow: hidden;
    }
  }

  caption {
    font-family: var(--font-heading);

    /* display title in slightly smaller text and wrap title as needed on smallest devices
      If title is too long on smaller devices, it can force wider viewport */
    font-size: clamp(1.5rem, 1.3rem + 1.603vw, 3.125rem); /* 24px - 50px */
    display: block; 

    @media screen and (width >= 393px) {
      /* stop wrapping */
      display: table-caption;
    }

    @media screen and (width >= 480px) {
      /* default font-sizing */
      font-size: clamp(1.875rem, 1.554rem + 1.603vw, 3.125rem); /* 30px - 50px */
    }

    line-height: 1.125;
    text-align: left;
    margin-bottom: 1.875rem; /* 30px */
  }

  tr {
    &:hover td {
      cursor: pointer;
      background-color: var(--color-red);
    }

    &:first-child {
      /* 2nd column */
      th:nth-child(2) {
        @media screen and (width >= 480px) {
          width: 25%;
        }
      }
    }
  }

  th, td {
    padding-block: clamp(0.5rem, 0.292rem + 1.042vw, 1.313rem); /* 8-21px */
    padding-inline: clamp(0.5rem, -0.173rem + 3.365vw, 3.125rem); /* 8-50px */
    border: none;
    background-color: hsl(0deg 0% 11.37%);
    border-radius: 2px;
    position: relative;
    z-index: 100;
  }

  th {
    text-align: left;
    vertical-align: bottom;
    background-color: transparent;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.125;
  }

  td {
    white-space: nowrap;
    font-size: clamp(0.875rem, 0.542rem + 1.042vw, 1.125rem); /* 14-18px */
    line-height: 1.0;

    &:first-of-type {
      font-size: clamp(1rem, 0.542rem + 1.042vw, 1.563rem); /* 16-25px */
      letter-spacing: 6px;
      transition: letter-spacing 0.8s ease-out;

      @media screen and (width >= 1440px) {
        letter-spacing: 7.2px;
      }
    }
  }

  /* optionally highlight the first (second) row */
  tr:nth-child(2) td {
    background-color: var(--color-red);
  }
}

  .gr-articleBodyMedia {
  max-width: 1440px;
  margin: 0 auto;

  img {
    margin-block: clamp(2.5rem, 1.779rem + 3.606vw, 5.313rem); /* 40-85px */
    width: 100vw;
  }
}

  section.gr-articleFilters {
  padding-bottom: 0;
}

  .gr-articleFilters__layout {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1rem;

  @media screen and (width >= 768px) {
    flex-direction: row;
    justify-content: center;
    gap: 2rem;
  }
}

  .gr-articleFooter {
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
}

  /* everything below scales from 320-1568px */

  section.gr-articleHeader {
  background-color: var(--color-almost-black);
  padding-top: calc(var(--section-spacing-y) / 2);
  padding-bottom: 0;

  .gr-container {
    display: flex;
    flex-direction: column;
    gap: 20px;
  }

  .gr-articleHeader__actions {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }

  .gr-articleHeader__viewAll {
    color: white;
    text-decoration: none;
    font-size: clamp(0.875rem, 0.843rem + 0.16vw, 1rem); /* 14-16px */
    line-height: 1.0;
    white-space: nowrap;

    &:hover {
      color: var(--color-red);
    }
  }

  .gr-articleHeader__type {
    font-family: var(--font-heading);
    font-size: clamp(1.5rem, 1.244rem + 1.282vw, 2.5rem); /* 24-40px */
    line-height: 1;
  }

  .gr-articleHeader__title {
    font-family: var(--font-heading);
    font-size: clamp(2.5rem, 2.179rem + 1.603vw, 3.75rem); /* 40-60px */
    font-weight: 400;
    line-height: 1.2;
  }

  .gr-articleHeader__summary {
    font-family: var(--font-body);
    font-size: clamp(1.125rem, 1.013rem + 0.561vw, 1.563rem); /* 18-25px */
    line-height: 1.75;
    max-width: 1000px;
  }

  hr {
    margin: 0;
    background-color: hsl(225deg 0% 30% / 100%);
    height: 1px;
    border: none;
  }

  .gr-articleHeader__meta {
    font-family: var(--font-body);
    font-size: clamp(0.875rem, 0.843rem + 0.16vw, 1rem); /* 14-16px */
    margin-top: 0;

    @media screen and (width >= 1024px) {
      margin-top: 0.625rem;
    }

    line-height: 1.0;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
  }
}

  .gr-articleLoader {
  .gr-container {
    display: flex;
    justify-content: center;
  }

  .gr-button {
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
  }
}

  .gr-articleShareTools {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0.5rem;

  span {
    font-size: clamp(0.875rem, 0.843rem + 0.16vw, 1rem); /* 14-16px */
    line-height: 1.0;
  }

  ul {
    display: flex;
    flex-direction: row;
    gap: 0.5rem;

    a {
      opacity: 0.95;
      width: 32px;
      height: 32px;
      border-radius: 50%;
      border: 3px solid white;
      background-color: transparent;
      display: inline-flex;
      align-items: center;
      justify-content: center;

      &:hover {
        cursor: pointer;
        background-color: var(--color-red);
        border-color: var(--color-red);
      }
    }
  }

  .gr-articleFooter & {
    justify-content: flex-end;
  }
}

  .gr-button {
  --size: 2.375rem; /* 38px, button height, icon sides */
  --gap: 0.1875rem; /* 3px */
  --offset: calc(var(--size) + var(--gap));
  --radius: 2px;
  --transition: all 150ms ease-out;

  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: start;
  border: none;
  border-radius: var(--radius);
  background-color: var(--color-red);
  color: white;
  font-family: var(--font-body);
  font-size: 0.8125rem; /* 13px */
  line-height: 1.0;
  text-decoration: none;
  height: var(--size);
  cursor: pointer;
  padding: 0.875rem 1.125rem; /* 14px 18px */
  min-width: 12.5rem; /* 200px */

  &::before {
    content: '';
    display: block;
    position: absolute;
    z-index: 0;
    top: 0;
    left: 0;
    height: 100%;
    width: 0;
    background-color: white;
    border-radius: var(--radius);
    transition: var(--transition);
  }

  &:hover {
    color: var(--color-red);

    &::before {
      width: 100%;
    }

    .gr-button__arrow {
      background-color: white;

      i {
        transform: rotate(45deg);
      }
    }
  }

  &.-isHidden {
    display: none;
  }

  &.-isFullwidth {
    display: flex;
    width: calc(100% - var(--offset));

    .gr-button__label {
      width: 100%;
    }
  }

  &.-isCentered {
    min-width: 0;

    .gr-button__label {
      text-align: center;
    }
  }

  &.-isGhost {
    min-width: 0;
    background: transparent;

    &::before {
      display: none;
    }

    .gr-button__label {
      font-size: clamp(1.125rem, 1.093rem + 0.16vw, 1.25rem); /* 18-20px */
    }

    .gr-button__arrow {
      background: transparent;
      width: auto;
      clip-path: none;
      left: 100%;

      i {
        transform: rotate(135deg);
      }
    }
  }

  &.-isOutline {
    min-width: auto;
    height: auto;
    background: transparent;
    border: 1px solid white;
    border-radius: 4px;
    padding-block: clamp(0.5rem, 0.308rem + 0.962vw, 1.25rem);
    padding-inline: clamp(0.75rem, 0.558rem + 0.962vw, 1.5rem);
    font-size: clamp(0.875rem, 0.811rem + 0.321vw, 1.125rem); /* 14-18px */
    font-family: var(--font-body);
    line-height: 1;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;

    &::before,
    .gr-button__arrow {
      display: none;
    }

    &:hover {
      color: var(--color-red);
    }
  }
}

  .gr-button__label {
  display: inline-block;
  position: relative;
  z-index: 100;
  top: 1px; /* offset font baseline */
  text-align: left;
  white-space: nowrap;
  transition: var(--transition);
}

  .gr-button__arrow {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  left: calc(100% + var(--gap));
  height: 100%;
  width: var(--size); /* must be a square */
  background-color: var(--color-red);
  border-radius: var(--radius);
  transition: var(--transition);
  clip-path: var(--clip-small);

  i {
    font-size: 0.625rem; /* 10px */
    transition: var(--transition);
  }
}

  .gr-card {
  flex: 0 0 auto;
  min-width: 0;
  max-width: 100%;
  color: white;
  background-color: white;
  border: 1px solid transparent;
  border-radius: 5px;
  overflow: hidden;
  position: relative;
  font-family: var(--font-body);
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;

  &.-isMap {
    clip-path: var(--clip-xlarge);
    height: 27.75rem; /* 444px */
    flex-basis: clamp(16rem, 0.384rem + 78.082vw, 19.563rem); /* 256px to 313px @ 320px to 393px */

    @media screen and (width >= 393px) {
      flex-basis: clamp(19.563rem, 12.805rem + 27.513vw, 29.313rem); /* 313px to 469px @ 393px to 960px */
    }

    @media screen and (width >= 1280px) {
      flex: 0 0 calc(33.33% - 11px);
    }
  }

  &.-isVehicle {
    clip-path: var(--clip-medium);
    width: 95%;
    height: clamp(22rem, 21.555rem + 1.811vw, 23.33rem);

    @media screen and (width >= 640px) {
      width: 48%; /* 279px */
    }

    @media screen and (width >= 1280px) {
      width: calc(25% - 12px); /* todo: fix with flex basis */
      height: 350px;

      .gr-card__background {
        img {
          pointer-events: none;
        }
      }
    }
  }
}

  .gr-card__background {
  position: absolute;
  width: 100%;
  height: 100%;
  background: black;

  img {
    height: 100%;
    -o-object-position: center;
       object-position: center;
  }

  .gr-card.-isMap & {
    clip-path: var(--clip-xlarge);

    img {
      aspect-ratio: 3 / 4;
      -o-object-fit: cover;
         object-fit: cover;
      -o-object-position: center;
         object-position: center;
      transition: aspect-ratio 1s ease-in-out;

      @media screen and (width >= 480px) {
        aspect-ratio: 5 / 4;
      }
    }
  }

  .gr-card.-isVehicle & {
    clip-path: var(--clip-medium);
    aspect-ratio: 3 / 4;
    transition: aspect-ratio 1s ease-in-out;

    @media screen and (width >= 480px) {
      aspect-ratio: 5 / 4;
    }

    img {
      -o-object-fit: contain;
         object-fit: contain;
    }
  }
}

  .gr-card__upper,
.gr-card__lower {
  position: absolute;
  left: clamp(1.25rem, 0.952rem + 1.325vw, 2.25rem); /* 20px to 36px */
}

  .gr-card__upper {
  top: clamp(1.25rem, 1.157rem + 0.414vw, 1.563rem); /* 20px to 25px */
  .gr-card__title {
    line-height: 2.1875rem; /* 35px */
  }
}

  .gr-card__lower {
  bottom: clamp(1.25rem, 1.157rem + 0.414vw, 1.563rem); /* 20px to 25px */

  .gr-card.-isVehicle & {
    bottom: 0.75rem; /* 12px */
    left: 0;
    right: 3.25rem; /* 52px */
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
  }
}

  .gr-card__title {
  font-size: clamp(1.25rem, 1.064rem + 0.828vw, 1.875rem); /* 20px to 30px */
  font-weight: 400;
  font-family: var(--font-body);
  letter-spacing: -0.05em;

  .gr-card.-isVehicle & {
    font-size: clamp(1.5rem, 1.25rem + 1.27vw, 1.875rem); /* 24px to 30px only to tablet size */
  }
}

  .gr-card__secondaryTitle {
  display: block;
  margin-bottom: 0.25rem;

  &.-isDev {
    color: red;

    &.-isCurrent {
      color: green;
    }
  }
}

  .gr-card__bodyText {
  font-size: clamp(0.875rem, 0.838rem + 0.166vw, 1rem); /* 14px to 16px */
  line-height: 2;
}

  .gr-carousel {
  /* breakout of the container to allow the Cards to bleed to the sides */

  /* note: turns out this isn't ideal, just set gr-carousel to the Section tag and override = simpler */

  /* note2: nope, that would also affect the title's padding, think again! */
  @media screen and (width < 1280px) {
    .gr-container:has(&) {
      width: calc(100% + (var(--section-spacing-x) * 2));
      left: calc(var(--section-spacing-x) * -1);
    }

    /* carousels are fullbleed but there still needs to be padding on the left of the first item/right of the last item */
    .gr-carousel__viewport {
      padding-inline: var(--section-spacing-x);
    }
  }
}

  .gr-carousel__viewport {
  overflow: hidden;

  & > div {
    display: flex;
    justify-content: flex-start;
    gap: 1rem;

    /* this may help prevent the cards from getting cut off on the sides on large screens */
    margin-inline: 4px;
  }

  &.-isCentered > div {
    @media screen and (width >= 1280px) {
      justify-content: center;
    }
  }
}

  .gr-carousel__controls {
  padding-top: 2rem;

  &.-isMap {
    padding-top: 1.875rem;
    transition: padding-top 0.35s ease-out;

    @media screen and (width >= 393px) {
      padding-top: 3.125rem;
    }
  }

  &.-isHidden {
    display: none;
  }
}

  .gr-container {
  width: 100%;
  min-width: 18rem; /* 288px */
  max-width: 90rem; /* 1440px */
  margin: 0 auto;
  position: relative;
}

  .gr-contentBlock {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(2rem, 1.404rem + 2.649vw, 4rem); /* 32-64px */

  &.-isSwapped {
    flex-direction: column-reverse;
  }

  &.-isSwappedOnSmall {
    @media screen and (width < 768px) {
      flex-direction: column-reverse;
    }
  }

  &.-isSwappedOnMedium {
    @media screen and (width >= 768px) and (width < 1280px) {
      flex-direction: column-reverse;
    }
  }

  &.-isSplitOnMedium {
    @media screen and (width >= 768px) and (width < 1280px) {
      flex-direction: row;

      &.-isSwapped {
        flex-direction: row-reverse;
      }

      .gr-contentBlock__textContent,
      .gr-contentBlock__mediaContent { width: 50%; }
    }
  }

  @media screen and (width >= 1280px) {
    flex-direction: row;

    &.-isSwapped {
      flex-direction: row-reverse;
    }

    &.-splitRatio-30-70 {
      .gr-contentBlock__textContent { width: 30%; }
      .gr-contentBlock__mediaContent { width: 70%; }
    }

    &.-splitRatio-40-60 {
      .gr-contentBlock__textContent { width: 40%; }
      .gr-contentBlock__mediaContent { width: 60%; }
    }

    &.-splitRatio-50-50 {
      .gr-contentBlock__textContent { width: 50%; }
      .gr-contentBlock__mediaContent { width: 50%; }
    }

    &.-splitRatio-60-40 {
      .gr-contentBlock__textContent { width: 60%; }
      .gr-contentBlock__mediaContent { width: 40%; }
    }
  }

  &.-isArticle {
    .gr-contentBlock__textContent {
      /* allow maximum viewport space at smallest devices and no more */
      max-width: 100%;

      @media screen and (width >= 480px) {
        max-width: 1000px;
      }

      margin: 0 auto;
      color: white;

      p.gr-articleBodyRichText {
        font-size: clamp(1rem, 0.968rem + 0.16vw, 1.125rem); /* 16-18px */
        line-height: 2;
        margin-block: clamp(2.5rem, 1.779rem + 3.606vw, 5.313rem); /* 40-85px */
        margin-inline: 0;

        /* if it has a sibling paragraph, reduce bottom margin from first one, */
        &:has(+ p) {
          margin-bottom: .5rem;
        }
        
        + p {
          margin-top: .5rem;
        }
      }

      div.gr-articleBodyRichText {
        & > :first-child {
          margin-top: 0;
        }

        & > :last-child {
          margin-bottom: 0;
        }

        & h2 {
          margin-block: clamp(2.5rem, 1.779rem + 3.606vw, 5.313rem);

          &:has(+ p, + ol, + ul, + hr) {
            margin-block: 2rem;
            line-height: 1.5;
            margin-top: clamp(2.5rem, 1.779rem + 3.606vw, 5.313rem);
          }
        }

        h3 {
          font-size: 2.5rem;
        }

        h4 {
          font-size: 2.25rem;
        }

        h5 {
          font-size: 2rem;
        }
        
        h6 {
          font-size: 1.75rem;
        }

        & h3, h4, h5, h6 {
          font-weight: 400;
          margin-block: clamp(2.5rem, 1.779rem + 3.606vw, 5.313rem); /* 40-85px */
          &:has(+ p, + ol, + ul, + hr) {
            margin-block: 2rem;
            line-height: 1.5;
            margin-top: clamp(2.5rem, 1.779rem + 3.606vw, 5.313rem);
          }
        }

        p {
          font-size: clamp(1rem, 0.968rem + 0.16vw, 1.125rem); /* 16-18px */
          line-height: 2;
        }

        /* style only OLs and UL that are direct descendents of the rich-text styling class */
        > ol {
          padding-inline-start: 2.1rem;

          &:has(+ p, + ol, + ul) {
              margin-bottom: 2rem;
          }
        }

        > ul {
          padding-inline-start: 1.2rem;

          &:has(+ p, + ol, + ul) {
              margin-bottom: 2rem;
          }
        }
        
        > ol, > ul {
          list-style: revert;
          margin-block: 1em;

          li {
            margin-top: 1rem;

            @media screen and (width >= 768px) {
              margin-top: 1.5rem;
            }
          }

          ol, ul {
            list-style: revert;
            margin-block: .5em;
            padding-inline-start: 40px;

            li {
              margin-top: 1rem;

              @media screen and (width >= 768px) {
                margin-top: 1.5rem;
              }
            }
          }
        }

        blockquote {
          border-left: clamp(0.188rem, 0.107rem + 0.401vw, 0.5rem) solid var(--color-red);
          padding-left: clamp(1rem, 0.487rem + 2.564vw, 3rem); /* 16-48 */
          font-size: clamp(1.25rem, 1.122rem + 0.641vw, 1.75rem); /* 20-28px */
          line-height: 1.75;
          margin-block: clamp(2.5rem, 1.538rem + 4.808vw, 6.25rem); /* 40-100px */

          /* if it has a sibling blockquote, replace bottom margin from first one with padding to allow red border to "flow down" */
          &:has(+ blockquote) {
            margin-bottom: 0;
            padding-bottom: clamp(1.875rem, 1.587rem + 1.442vw, 3rem); /* 30-48px */
          }

          /* the 2nd blockquote should have no top margin */
          & + blockquote {
            margin-top: 0;
          }
        }

        hr {
          margin-block: clamp(2.5rem, 1.538rem + 4.808vw, 6.25rem); /* 40-100px */
          background-color: hsl(225deg 0% 30% / 100%);
          height: 1px;
          border: none;
        }
      }
    }
  }
  
  &.-isTextOnly {
    .gr-contentBlock__mediaContent {
      display: none;
    }

    .gr-contentBlock__textContent {
      width: 100%;
    }
  }
}

  .gr-contentBlock__textContent {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
  z-index: 200;
  font-family: var(--font-body);
  opacity: 0.95;
  width: 100%;

  @media screen and (width >= 768px) {
    gap: 2rem;
  }

  h5.gr-heading {
    line-height: 1.15;
  }

  &.-hasTinyText {
    p {
      font-size: clamp(1rem, 0.925rem + 0.331vw, 1.25rem); /* 16-20px */
    }
  }
}

  .gr-contentBlock__mediaContent {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  z-index: 100;
  width: 100%;

  img {
    border-radius: 4px;
  }

  video {
    border-radius: 16px;
    width: 100%;
    margin: 0 auto;

    .-hasSquareVideo & {
      @media screen and (width <= 1280px) {
        max-width: 37.5rem;
      }
    }
  }

  &.-hasSlashForMediaAtEnd {
    img {
      clip-path: var(--clip-large);
    }
  }

  &.-hasMediaAtEnd {
    @media screen and (width >= 1280px) {
      align-items: end;
    }
  }
}

  .gr-contentBlockWrapper {
  width: calc(100% + (var(--section-spacing-x) * 2));
  position: relative;
  left: calc(var(--section-spacing-x) * -1);

  .gr-contentBlockWrapper__vignette {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    background-color: rgb(0 0 0 / 15%);
  }

  .gr-container {
    padding: 3rem;

    @media screen and (width >= 1280px) {
      padding: 6rem 3rem;
    }
  }
}

  .gr-dropdown {
  position: relative;

  @media screen and (width >= 768px) {
    width: 100%;
    max-width: 410px;
  }

  button {
    background: transparent;
    color: white;
    width: 100%;
  }

}

  button.gr-dropdown__title {
  display: flex;
  justify-content: space-between;
  border: 1px solid white;
  border-radius: 4px;
  padding-block: clamp(0.5rem, 0.308rem + 0.962vw, 1.25rem); /* 8-20px */
  padding-inline: clamp(0.75rem, 0.558rem + 0.962vw, 1.5rem); /* 12-24px */
  font-size: clamp(0.875rem, 0.811rem + 0.321vw, 1.125rem); /* 14-18px */
  font-family: var(--font-body);
  line-height: 1;
  list-style: none; /* removes the marker */
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  position: relative;
  z-index: 200;
  white-space: nowrap;
  min-width: 360px;

  &:focus-visible {
    outline: 1px solid white;
    outline-offset: 2px;
  }

  span {
    height: 18px;
    line-height: 1.25;
  }

  .gr-icon {
    transition: 100ms transform ease-in-out;
    transform: rotate(135deg) scale(0.65);

    .-isOpen & {
      transform: rotate(-45deg) scale(0.65);
    }

    @media screen and (width >= 768px) {
      transform: rotate(135deg) scale(0.8);

      .-isOpen & {
        transform: rotate(-45deg) scale(0.8);
      }
    }
  }
}

  .gr-dropdown__items {
  display: none;
  flex-direction: column;
  width: calc(100% + 2px);
  min-width: 360px;
  position: absolute;
  z-index: 300;
  background-color: hsl(0deg 0% 0% / 80%);
  left: -1px;
  top: calc(100% + 12px);
  border: 1px solid white;
  border-radius: 4px;
  padding: clamp(0.5rem, 0.42rem + 0.401vw, 0.813rem); /* 8-13px */
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  max-height: 240px; /* todo: calculate to show only X items */
  overflow-y: auto;
  overscroll-behavior: auto;
  scrollbar-width: thin;
  scrollbar-color: white transparent;

  .-isOpen & {
    display: flex;
  }

    li {
      button {
        border: none;
        display: flex;
        width: 100%;
        color: white;
        font-size: clamp(0.875rem, 0.811rem + 0.321vw, 1.125rem);
        line-height: 1;
        padding: clamp(0.5rem, 0.42rem + 0.401vw, 0.813rem);
        cursor: pointer;
        text-align: left;

        > span {
          margin: 5px 0 0;
          display: inline-block;
        }

        &:hover,
        &:focus-visible,
        &.-isSelected {
          background-color: var(--color-red);
          outline: none;
        }
      }
  }
}

  .gr-footer {
  display: grid;
  grid: auto / auto;
  gap: 3.125rem; /* 50px */

  @media screen and (width >= 480px) {
    grid-template-columns: repeat(2, 1fr);

    .gr-footer__legal {
      grid-column: span 2;
    }
  }

  @media screen and (width >= 960px) {
    grid-template-columns: repeat(4, 1fr);

    .gr-footer__legal {
      grid-column: span 4;
    }
  }

  @media screen and (width >= 1440px) {
    grid-template-columns: repeat(15, 1fr);

    .gr-footer__internal,
    .gr-footer__external,
    .gr-footer__global,
    .gr-footer__social {
      grid-column: span 3;
    }

    .gr-footer__legal {
      grid-column: span 3;
    }
  }

  .gr-heading {
    color: rgb(255 255 255 / 95%);
    font-size: 1.125rem; /* 18px */
    font-family: var(--font-body);
    line-height: 1.25;
    font-weight: 400;
    margin-bottom: 1rem;
    white-space: nowrap;
  }

  ul {
    list-style: none;
    padding: 0;
    margin: 0;

    li {
      margin-bottom: 0.8125rem; /* 13px */;
    }
  }

  a {
    color: inherit;
    text-decoration: none;

    &:hover {
      text-decoration: underline;
    }
  }

  p, li {
    color: rgb(255 255 255 / 95%);
    font-size: 1rem;
  }

  .gr-footer__social {
    ul {
      display: flex;
      flex-direction: row;
      gap: 0.5rem;

      a {
        opacity: 0.95;
        width: 32px;
        height: 32px;
        border-radius: 50%;
        border: 1px solid white;
        background-color: transparent;
        display: inline-flex;
        align-items: center;
        justify-content: center;

        &:hover {
          cursor: pointer;
          background-color: var(--color-red);
          border-color: var(--color-red);
        }
      }
    }
  }

  .gr-footer__legal {
    font-family: var(--font-brand);

    p {
      font-size: 0.75rem;
      line-height: 1.5;
      margin-bottom: 1rem;
    }
  }
}

  .gr-footer__privacyChoices {
  margin-bottom: 1rem;
  display: flex;
  justify-content: start;
  align-items: center;
  gap: 1rem;

  a {
    font-family: var(--font-body);
    font-size: 1rem;
  }

  img {
    height: 1rem;
  }
}

  .gr-grid__contents {
  display: grid;
  grid: auto / 1fr;

  .gr-grid.-articleItems & {
    gap: clamp(3.125rem, 2.163rem + 4.808vw, 6.875rem) clamp(0.875rem, 0.619rem + 1.282vw, 1.875rem); /* 14-30px */ /* 50-110px */

    @media screen and (width >= 768px) {
      grid: auto / repeat(3, minmax(0, 1fr));
    }

    @media screen and (width >= 1440px) {
      grid: auto / repeat(4, minmax(0, 1fr));
    }
  }

  .gr-grid.-driverItems & {
    gap: 2.5rem 0.625rem;

    @media screen and (width >= 768px) {
      grid: auto / repeat(3, minmax(0, 1fr));
    }

    @media screen and (width >= 1280px) {
      grid: auto / repeat(5, minmax(0, 1fr));
    }
  }

  .gr-grid.-seriesItems & {
    gap: 0.625rem;

    @media screen and (width >= 960px) {
      grid: auto / repeat(4, minmax(0, 1fr));
    }

    @media screen and (width >= 1440px) {
      grid: auto / repeat(5, minmax(0, 1fr));
    }
  }
}

  .no-results {
  text-align: center;
  font-size: 16px;
}

  .gr-gridArticleItem {
  --transition: all 150ms ease-in-out;
  --notch-size: 80px;
  --notch: polygon(0% 0%, 100% 0%, 100% calc(100% - var(--notch-size)), calc(100% - var(--notch-size)) 100%, 0% 100%);
  --notch-fill: calc(var(--notch-size) - 10px);
  --vignette: rgb(0 0 0 / 50%), rgb(0 0 0 / 25%), transparent;

  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  gap: 2rem;
  position: relative;
  cursor: pointer;

  &.-isHidden {
    display: none;
  }
}

  .gr-gridArticleItem__image {
  display: block;
  margin-bottom: clamp(1.25rem, 1.058rem + 0.962vw, 2rem); /* 20-32px */

  img {
    display: block;
    overflow: hidden;
    border-radius: 5px;
    width: 100%;
    aspect-ratio: 0.93 / 1;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: center;
       object-position: center;
    transition: var(--transition);
    clip-path: var(--clip-medium);
  }
}

  .gr-gridArticleItem__title {
    color: white;
    position: relative;
    z-index: 1;
    font-size: clamp(1.563rem, 1.482rem + 0.401vw, 1.875rem); /* 25-30px */
    font-weight: 400;
    line-height: 1.125;
    letter-spacing: -0.1em;
    overflow-wrap: normal;

    a {
      color: inherit;
      text-decoration: none;
    }
}

  .gr-gridArticleItem__eyebrows {
  margin-bottom: clamp(0.375rem, 0.087rem + 1.442vw, 1.5rem); /* 6-24px */
}

  .gr-gridArticleItem__secondaryTitle {
  font-size: clamp(0.875rem, 0.811rem + 0.321vw, 1.125rem); /* 14-18px */
}

  .gr-button {
  &.gr-gridArticleItem__cta {
    display: none;

    @media screen and (width >= 768px) {
      display: flex;
    }

    .gr-button__label {
      text-align: center;
    }
  }

  &.gr-gridArticleItem__ctaAlt {
    display: flex;

    @media screen and (width >= 768px) {
      display: none;
    }

    .gr-button__label {
      text-align: left;
    }
  }
}

  .gr-gridArticleItem__overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  background: transparent;
  text-decoration: none;
}

  .gr-gridArticleItem > *:not(.gr-gridArticleItem__overlay) {
  position: relative;
  z-index: 3;
}

  .gr-gridDriverItem {
  --transition: all 150ms ease-in-out;
  --notch-size: 80px;
  --notch: polygon(0% 0%, 100% 0%, 100% calc(100% - var(--notch-size)), calc(100% - var(--notch-size)) 100%, 0% 100%);
  --notch-fill: calc(var(--notch-size) - 10px);

  position: relative;
  border-radius: 5px;
  overflow: hidden;
  text-decoration: none;
  cursor: pointer;

  &:hover {
    .gr-gridDriverItem__media {
      img {
        transform: scale(1.15);
      }
    }

    .gr-gridDriverItem__tab {
      background-color: var(--color-red);
    }

    .gr-icon {
      transform: rotate(45deg);
    }
  }

  &.-isSwappable:hover {
    .gr-gridDriverItem__media {
      img {
        opacity: 0;
      }

      video {
        opacity: 1;
      }
    }
  }
}

  .gr-gridDriverItem__wrapper {
  position: relative;
  margin-bottom: 1.25rem;
}

  .gr-gridDriverItem__media {
  position: relative;
  clip-path: var(--notch);

  img {
    width: 100%;
    aspect-ratio: 330 / 391;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: center;
       object-position: center;
    position: relative;
    z-index: 200;
    opacity: 1;
    transition:
      opacity 300ms linear,
      transform 150ms linear;
  }

  video {
    position: absolute;
    z-index: 100;
    inset: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: center;
       object-position: center;
    opacity: 0;
    transition: all 300ms linear;
  }
}

  .gr-gridDriverItem__name {
  color: white;
  font-family: var(--font-body);
  font-size: clamp(1.125rem, 1.029rem + 0.481vw, 1.5rem); /* 18-24px */
  font-weight: 400;
  line-height: 1;
}

  .gr-gridDriverItem__tab {
  position: absolute;
  z-index: 0;
  right: 0;
  bottom: 0;
  width: var(--notch-fill);
  height: var(--notch-fill);
  color: white;
  background-color: var(--color-driver-blue);
  border-radius: 0 0 5px;
  clip-path: polygon(100% 0, 0% 100%, 100% 100%);
  transition: var(--transition);

  .gr-icon {
    position: absolute;
    bottom: 0.75rem;
    right: 0.75rem;
    transition: var(--transition);
  }
}

  .gr-gridSeriesItem {
  --transition: all 150ms ease-in-out;
  --notch-size: 80px;
  --notch: polygon(0% 0%, 100% 0%, 100% calc(100% - var(--notch-size)), calc(100% - var(--notch-size)) 100%, 0% 100%);
  --notch-fill: calc(var(--notch-size) - 10px);
  --vignette: rgb(0 0 0 / 50%), rgb(0 0 0 / 25%), transparent;

  height: 200px;
  position: relative;
  border-radius: 5px;
  overflow: hidden;

  .gr-gridSeriesItem__image {
    display: block;
    overflow: hidden;
    position: absolute;
    z-index: 100;
    width: 100%;
    height: 100%;
    inset: 0;
    padding-top: 2.4rem;
    padding-left: 2.4rem;
    text-decoration: none;
    clip-path: var(--notch);

    /* vignette */
    &::before {
      @media screen and (width >= 960px) {
        content: '';
        position: absolute;
        z-index: 50;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-image: url('clientlib-base/resources/images/background/blue-mask.svg');
        background-blend-mode: multiply;
      }
    }

     &:active {
      img {
        transform: scale(1.05);
      }
    }

    img {
      position: absolute;
      z-index: 0;
      width: 100%;
      height: 100%;
      inset: 0;
      -o-object-fit: cover;
         object-fit: cover;
      -o-object-position: center;
         object-position: center;
      transition: var(--transition);
      aspect-ratio: 3 / 2;
      min-width: 360px;
      
      @media screen and (width >= 1024px) {
        min-width: 226px;
      }

      @media screen and (width >= 1920px) {
        min-width: 330px;
      }
    }

    h3 {
      color: white;
      position: relative;
      z-index: 100;
      font-size: 3.125rem; /* 50px */
      font-weight: 400;
      line-height: 1.125;
      letter-spacing: -0.1em;
      overflow-wrap: normal;
    }
  }

  &:hover,
  &:active {
    .gr-gridSeriesItem__tab {
      background-color: var(--color-red);
    }

    .gr-icon:not(.gr-icon-download) {
      transform: rotate(45deg);
    }
  }

  &.-isCta {
    .gr-gridSeriesItem__image {
      h3 {
        font-size: 2.5rem; /* 40px */
      }

      &::before {
        background: -34.214px 0 / 177.706% 100% no-repeat;
      }
    }

    .gr-gridSeriesItem__tab  {
      .gr-icon {
        font-size: 1.25em; /* 20px */
      }
    }
  }
}

  .gr-gridSeriesItem__tab {
  position: absolute;
  z-index: 0;
  right: 0;
  bottom: 0;
  width: var(--notch-fill);
  height: var(--notch-fill);
  color: white;
  background-color: var(--color-driver-blue);
  border-radius: 0 0 5px;
  clip-path: polygon(100% 0, 0% 100%, 100% 100%);
  transition: var(--transition);

  .gr-icon {
    position: absolute;
    bottom: 0.75rem;
    right: 0.75rem;
    transition: var(--transition);
  }
}

  @media screen and (width >= 960px) {
  .gr-gridSeriesItem {
    --notch-size: 70px;

    height: clamp(16.75rem, 1.375rem + 25.625vw, 24.438rem); /* 268-390px */

    .gr-gridSeriesItem__image {
      padding-top: clamp(1.5rem, 0rem + 2.5vw, 2.25rem); /* 24-36px */
      padding-left: clamp(1.5rem, 0rem + 2.5vw, 2.25rem); /* 24-36px */

      img {
        background-blend-mode: multiply;
        filter: grayscale(100%);
        opacity: 0.5;
      }

      h3 {
        font-size: clamp(2.563rem, 0.938rem + 2.708vw, 3.375rem); /* 41-54px */
      }
    }

    .gr-gridSeriesItem__tab {
      .gr-icon {
        font-size: 0.75em;

        &.gr-icon-download {
          font-size: 1em;
        }
      }
    }

    &.-isCta {
      h3 {
        font-size: clamp(2.188rem, 0.938rem + 2.083vw, 2.813rem); /* 35-45px */
      }

      img {
        filter: none;
        opacity: 1;
      }
    }

    &:hover, &:active {
      .gr-gridSeriesItem__image {
        img {
          filter: grayscale(0%);
          transform: scale(1.05);
          opacity: 1;
        }
      }
    }
  }
}

  @media screen and (width >= 1440px) {
  .gr-gridSeriesItem {
    --notch-size: 100px;

    .gr-gridSeriesItem__tab .gr-icon {
      font-size: 1.25em;
      bottom: 1rem;
      right: 1rem;

      &.gr-icon-download {
        font-size: 1.5em;
      }
    }
  }
}

  :is(h1, h2, h3, h4, h5, h6).gr-heading {
  position: relative;
  line-height: 1;
  font-weight: 400;

  /* With or without slash, each level's font size scales from 360px - 1568px screen width */
  &:is(h1) { font-size: clamp(2.813rem,  1.416rem + 6.209vw,   7.5rem); }   /* scale: 45-120 */
  &:is(h2) { font-size: clamp(1.875rem,  0.944rem + 4.139vw,   5rem); }     /* scale: 30-80 */
  &:is(h3) { font-size: clamp(1.75rem,   0.875rem + 3.891vw,   4.688rem); } /* scale: 28-75 */
  &:is(h4) { font-size: clamp(1.5rem,    0.923rem + 2.566vw,   3.438rem); } /* scale: 24-55 */
  &:is(h5) { font-size: clamp(1.25rem,   0.784rem + 2.07vw,    2.813rem); } /* scale: 20-45 */
  &:is(h6) { font-size: clamp(1.125rem,  0.808rem + 1.407vw,   2.188rem); } /* scale: 18-35 */

  &:not(.-noSlash) {
    /* slash width and height scales, but range depends on level */
    &::before {
      content: '';
      background-color: var(--color-red);
      transform: skewX(-12deg);
      position: absolute;
      left: 0.125em;
    }

    /* for bold (red) sections, make the slash black */
    .gr-section.-isBold & {
      &::before {
        background-color: black;
      }
    }

    &:is(h1, .gr-heading--lvl1) {
      padding-left: 0.35em;

      &::before {
        top: 0.125em;
        height: 0.8em;
        width: clamp(0.25rem, 0.138rem + 0.497vw, 0.625rem); /* scale: 4-10px */
      }
    }

    &:is(h2, .gr-heading--lvl2) {
      padding-left: 0.4em;

      &::before {
        top: -0.125em;
        height: 1.2em;
        width: clamp(0.25rem, 0.157rem + 0.414vw, 0.563rem); /* scale: 4-9px */
      }
    }

    &:is(h3, .gr-heading--lvl3) {
      padding-left: 0.4em;

      &::before {
        top: -0.1em;
        height: 1.125em;
        width: clamp(0.25rem, 0.175rem + 0.331vw, 0.5rem); /* scale: 4-8px */
      }
    }

    &:is(h4, .gr-heading--lvl4) {
      padding-left: 0.45em;

      &::before {
        top: 0;
        height: 1.1em;
        width: clamp(0.25rem, 0.194rem + 0.248vw, 0.438rem); /* scale: 4-7px */
      }
    }

    &:is(h5, .gr-heading--lvl5) {
      padding-left: 0.5em;

      &::before {
        top: -0.1em;
        height: 1.2em;
        width: clamp(0.25rem, 0.213rem + 0.166vw, 0.375rem); /* scale: 4-6px */
      }
    }

    &:is(h6, .gr-heading--lvl6) {
      padding-left: 0.55em;

      &::before {
        top: -0.2em;
        height: 1.4em;
        width: clamp(0.25rem, 0.231rem + 0.083vw, 0.313rem); /* scale: 4-5px */
      }
    }

    &.-isStacked {
      padding-left: 0.85em;
      font-size: 1.875rem; /* 30px */
      line-height: 1.16;

      &::before {
        top: -0.1em;
        height: 2.4em;
        width: 8px;
        left: 0;
      }
    }
  }
}

  .gr-highlights {
  /* break out of the container when the slider is visible */
  @media screen and (width < 768px) {
    .gr-container:has(&) {
      width: calc(100% + (var(--section-spacing-x) * 2));
      position: relative;
      left: calc(var(--section-spacing-x) * -1);
    }
  }

  @media screen and (width >= 768px) {
    .gr-highlightsViewer {
      display: block;
    }

    .gr-highlightsPicker {
      display: flex;
    }

    .gr-highlightsSlider,
    .gr-highlightsSlider__cta {
      display: none;
    }
  }
}

  .gr-highlightsViewer {
  display: none;
  height: 509px;
  border-radius: 5px;
  color: black;
  background: transparent;
  margin-bottom: 0.625rem;
  position: relative;
  overflow: hidden;

  &::before {
    content: '';
    position: absolute;
    z-index: 150;
    width: 100%;
    height: 100%;
    inset: 0;
    background: linear-gradient(to right, rgb(0 0 0 / 50%), rgb(0 0 0 / 25%), transparent);

    @media screen and (width >= 768px) {
      background: linear-gradient(270deg, rgb(217 217 217 / 0%) 0%, #36424F 100%);
      opacity: 0.85;
      background-blend-mode: multiply;
    }
  }

  .gr-button {
    &.-isHidden {
      display: none;
    }
  }
}

  .gr-highlightsViewer__backgroundImg {
  position: absolute;
  z-index: 100;
  width: 100%;
  height: 100%;
  inset: 0;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: top center;
     object-position: top center;
}

  .gr-highlightsViewer__details {
  color: white;
  position: absolute;
  z-index: 200;
  top: 3rem; /* 48px */
  left: 3.75rem; /* 60px */
  width: 60%;

  @media screen and (width >= 1280px) {
    width: 40%;
  }
}

  .gr-highlightsViewer__eyebrows {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin-bottom: 1rem;
  text-transform: uppercase;
}

  .gr-highlightsViewer__secondaryTitle,
.gr-highlightsViewer__tertiaryTitle {
  font-size: clamp(1rem, 0.89rem + 0.49vw, 1.125rem); /* 16-18px */
}

  .gr-heading.gr-highlightsViewer__title {
  font-size: clamp(2.5rem, 2.224rem + 1.225vw, 2.813rem); /* 40-45px */
  line-height: 1.15;
  overflow: hidden;
  margin-bottom: 2rem; /* 32px */
}

  .gr-highlightsViewer__bodyText {
  font-size: clamp(1.125rem, 1.015rem + 0.49vw, 1.25rem); /* 18-20px */
  line-height: 1.45;
  width: 100%;
  margin-bottom: 2rem; /* 32px */
}

  .gr-highlightsPicker {
  --item-height-mobile: 125px;

  @media screen and (width >= 1280px) {
    --item-height: 160px;
  }

  display: none;
  flex-direction: row;
  align-items: stretch;
  gap: 0.625rem;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;

  & > div {
    display: grid;
    grid: 1fr 1fr / 1fr 1fr;
    gap: 0.625rem;

    @media screen and (width >= 1280px) {
      grid: 1fr / repeat(4, 1fr);
    }
  }
}

  .gr-highlightsPicker__cta {
  flex: 0 0 var(--item-height-mobile);
  min-height: var(--item-height-mobile);
  color: white;
  background-color: var(--color-red);
  padding: 2rem 3rem 2rem 1.5rem;
  font-size: 1.25rem;
  line-height: 1.25;
  text-decoration: none;
  border-radius: 2px;
  overflow: hidden;
  display: flex;
  align-items: end;
  position: relative;

  @media screen and (width >= 1280px) {
    flex: 0 0 var(--item-height);
    min-height: var(--item-height);
    display: block;
    padding: 1rem 3rem 1rem 1rem;
  }

  &:hover {
    .gr-icon-arrow {
      transform: rotate(45deg);
    }
  }

  .gr-icon-arrow {
    position: absolute;
    top: 12px;
    right: 12px;
    font-size: 1.25rem; /* 20px */
    transition: transform 150ms ease-in-out;
  }
}

  .gr-highlightsPickerItem {
  color: black;
  background-color: white;
  border-radius: 5px;
  cursor: pointer;
  height: var(--item-height-mobile);
  overflow: hidden;
  display: flex;
  clip-path: var(--clip-large);
  padding: 0;
  border: 0;

  &:focus-visible {
    box-shadow: 0 0 0 2px white;
  }

  @media screen and (width >= 1280px) {
    height: var(--item-height);
  }

  &.selected {
    color: white;
    background-color: var(--color-red);
  }
}

  .gr-highlightsPickerItem__thumbnail {
  flex-shrink: 0;
  width: 40%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: top center;
     object-position: top center;
}

  .gr-highlightsPickerItem__details {
  display: flex;
  place-items: start center;
  position: relative;
  padding-block: 0.75rem 1.875rem;
  padding-inline: 1.25rem 0.75rem;

  .gr-icon-arrow {
    position: absolute;
    top: 12px;
    right: 12px;
    font-size: 0.625rem; /* 10px */
    transition: transform 150ms ease-in-out;

    .gr-highlightsPickerItem.selected & {
      transform: rotate(180deg);
    }
  }
}

  .gr-highlightsSliderItem__eyebrows {
  text-transform: uppercase;
}

  /* fussy */

  .gr-highlightsPickerItem__title {
  color: black;
  font-size: clamp(1rem, 0.9167rem + 0.1736vw, 1.125rem);
  line-height: 1.25;
  overflow: hidden;

  @media screen and (width >= 768px) {
    padding-block-start: 0.5rem;
  }

  @media screen and (width >= 800px) {
    padding-block-start: 1.25rem;
  }

  .gr-highlightsPickerItem.selected & {
    color: white;
  }
}

  .gr-highlightsSlider {
  display: flex;
  gap: 0.625rem;
  overflow-x: scroll;
  scrollbar-width: thin;
  scrollbar-color: rgb(0 0 0 / 25%) transparent;
  scroll-snap-type: x mandatory;
  padding-inline: var(--section-spacing-x);
}

  .gr-highlightsSlider__cta {
  padding: 1.25rem 0;
  display: flex;
  justify-content: center;

  .gr-button {
    left: var(--button-offset);
  }
}

  .gr-highlightsSliderItem {
  scroll-snap-align: center;
  color: black;
  background-color: white;
  border-radius: 5px;
  cursor: pointer;
  width: 80%;
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  clip-path: var(--clip-large);
  text-decoration: none;

  &:hover {
    color: black;
  }
}

  .gr-highlightsSliderItem__thumbnail {
  flex: 1 0 256px;
  -o-object-fit: cover;
     object-fit: cover;
}

  .gr-highlightsSliderItem__details {
  flex: 0 1 131px;
  padding: 1rem 1.25rem;
  position: relative;
  padding-right: 2.6875rem;

  @media screen and (width >= 1280px) {
    padding: 1rem;
    padding-inline: 1rem;
    padding-block: 1rem;
    padding-block-start: 2rem;
  }

  .gr-icon-arrow {
    position: absolute;
    top: 16px;
    right: 16px;
    font-size: 0.9375rem; /* 15px */
  }
}

  .gr-highlightsSliderItem__eyebrows {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin-bottom: 0.75rem;
}

  .gr-highlightsSliderItem__title {
  font-size: clamp(1rem, 0.9678rem + 0.131vw, 1.125rem); /* 16-18px */
  line-height: 1.35;
  overflow: hidden;
}

  .gr-highlightsSliderItem__secondaryTitle,
.gr-highlightsSliderItem__tertiaryTitle {
  font-size: clamp(0.75rem, 0.529rem + 0.98vw, 1rem); /* 12-16px */
}

  .gr-hotSpot {
  align-items: center;

  > .gr-container {
    padding: calc(var(--section-spacing-y) / 2);
    padding-inline: var(--section-spacing-x);

    @media screen and (width >= 1440px) {
      /* per TRG-4111 this title must be 1440x80 */
      padding: calc(var(--section-spacing-y) / 3);
    }
  }

  p {
    text-align: left;
  }
}

  .gr-hotSpot__viewport {
  display: grid;
  grid-template-rows: 55vw 675px;
  overflow: hidden;
  position: relative;

  @media screen and (width >= 768px) {
    grid-template-rows: auto;
  }

  div > picture {
    @media screen and (width >= 1024px) {
      height: 714px;
    }

    @media screen and (width >= 1920px) {
      height: 951px;
    }
  }

  /* eyebrow title */
  > div > div.gr-container {
    display: flex;
    font-size: 30px;
    line-height: 35px;
    height: 0;
    top: 1rem;
    padding-inline: var(--section-spacing-x);

    @media screen and (width >= 768px) {
      top: 45px;
      position: absolute;
    }

    @media screen and (width >= 1440px) {
      position: relative;
      padding-left: 2rem;
    }

    @media screen and (width >= 1920px) {
      top: 74px;
    }

    h3 {
      color: rgb(255 255 255 / 95%);
      font-family: var(--font-body);
      font-size: 16px;
      font-weight: 400;
      line-height: 35px; /* 218.75% */

      @media screen and (width >= 768px) {
        font-size: 20px;
        line-height: 25px; /* 125% */
      }

      @media screen and (width >= 1440px) {
        font-size: 30px;
        line-height: 35px; /* 116.667% */
      }
    }
  }

  img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }

  .gr-hotSpot__buttons {
    position: absolute;
    width: 100%;
    height: calc(100% - 675px);
    top: 0;
    left: 50%;
    transform: translate(-50%);

    @media screen and (width >= 768px) {
      height: 570px;
    }

    @media screen and (width >= 1024px) {
      height: 580px;
    }

    @media screen and (width >= 1280px) {
      height: 714px;
    }

    @media screen and ( width >= 1920px ){
      height: 950px;
    }

     *:has(> &) {
      display: grid;
      grid-column: 1;
      grid-row: 1 / -1;
    }

    button {
      position: absolute;
      top: 0;
      left: 50%;
      transform: translate(-50%);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      width: 28px;
      height: 28px;
      font-family: var(--font-heading);
      font-size: 14px;
      line-height: 35px; /* 250% */
      border: 1px solid hsl(0deg 0% 100% / 95%);
      color: #fff;
      cursor: pointer;

      span {
        position: relative;
        top: 0;
      }

      @media screen and (width >= 768px) {
        border-width: 2px;
        width: 43px;
        height: 43px;
        font-size: 20px;

        span {
          top: 1px;
        }
      }

      @media screen and (width >= 1024px) {
        font-size: 20px;
        font-weight: 400;
        line-height: 25px; /* 125% */
      }

      @media screen and (width >= 1920px) {
        border-width: 3px;
        width: 60px;
        height: 60px;
        font-size: 30px;

        span {
          top: 1px;
        }
      }

      &.-isBlack {
        background-color: #000;

        &.-isSelected, &:hover, &:active {
          background-color: hsl(356deg 100% 45% / 100%);
        }
      }

      &.-isTransparentRed {
        background-color: rgb(0 0 0 / 30%);

        &.-isSelected, &:hover {
          background-color: hsl(356deg 100% 45% / 100%);
        }
      }

      &.-isTransparentWhite {
        background-color: rgb(0 0 0 / 30%);

        &.-isSelected, &:hover {
          background-color: #fff;
          color: hsl(356deg 100% 45% / 100%);
        }
      }

      &.-isWhite {
        background-color: #fff;
        border-color: hsl(356deg 100% 45% / 100%);
        color: #000;

        &.-isSelected, &:hover {
          background-color: hsl(356deg 100% 45% / 100%);
          color: #fff;
        }
      }
    }
  }

  article {
    grid-column: 1;
    grid-row: 1 / -1;
    grid-template-rows: subgrid;
    display: grid;
    align-items: center;
    pointer-events: none;
    padding: 16px;

    @media screen and (width >= 768px) {
      grid-template-columns: 1fr auto;
    }

    @media screen and (width >= 1024px) {
      margin: auto;
      width: calc(100vw - 100px);
    }

    @media screen and (width >= 1920px) {
      /* padding: 0; */
      padding-inline: calc(var(--section-spacing-y) / 3);
      max-width: calc(100vw - 226px);
    }

    h3 {
      color: rgb(255 255 255 / 95%);
      font-family: var(--font-body);
      font-size: 16px;
      font-weight: 400;
      line-height: 35px; /* 218.75% */
      align-self: start;

      @media screen and (width >= 768px) {
        font-size: 20px;
        line-height: 25px; /* 125% */
      }

      @media screen and (width >= 768px) {
        margin-top: 40px;
      }

      @media screen and (width >= 1920px) {
        font-size: 30px;
        line-height: 35px; /* 116.667% */
        margin-top: 74px;
      }
    }
  }
}

  .gr-hotSpotSlider__viewport{
  display: flex;
  flex-direction: row;
  overflow: hidden;
  max-width: 100dvw;
  gap: 16px;

  @media screen and (width >= 768px) {
    width: 100%;
  }

  @media screen and (width >= 1920px) {
    max-width: 439px;
  }

  &.-isScrollable {
    margin-bottom: 2rem;
  } 

  & > div {
    display: flex;
    gap: 1rem;
    width: 100%;
  }
}

  .gr-hotSpotSlider__controls {
  padding-block-start: 1rem;
  position: absolute;
  bottom: 1rem;
  right: 1rem;
}

  .gr-hotSpot__contents {
  background: hsl(0deg 0% 8% / 50%);
  width: calc(100dvw - 32px);
  display: flex;
  flex-direction: column;
  justify-self: center;
  position: relative;
  pointer-events: all;
  border-radius: 15px;
  padding: 13px;
  padding-bottom: 19px;
  margin-bottom: 19px;
  height: 675px;

  @media screen and (width >= 393px) {
    justify-self: center;
    width: 361px;
    margin-bottom: 0;
  }

  @media screen and (width >= 768px) {
    width: 321px;
  }


  @media screen and (width >= 1024px) {
    height: 617px;
  }

  @media screen and ( width >= 1920px ){
    width: 439px;
    height: 772px;
  }


  .gr-hotSpotSliderItem__icon {
    border-radius: 50%;
    border: 1px solid hsl(0deg 0% 100% / 95%);
    color: hsl(0deg 0% 100% / 95%);
    transition: .2s linear;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    font-family: var(--font-heading);
    font-size: 14px;
    margin: 16px 0;
    
    span {
      position: relative;
      top: 1px;
    }

    @media screen and (width >= 768px) {
      border-width: 2px;
      width: 43px;
      height: 43px;
      font-size: 20px;
      margin: 20px 0;

      span {
        top: 0;
      }
    }


    @media screen and (width >= 1920px) {
      border-width: 3px;
      width: 60px;
      height: 60px;
      font-size: 30px;
      margin: 26px 0;
    
      span {
        top: 2px;
      }
    }

    &.-isBlack {
      background-color: hsl(356deg 100% 45% / 100%);
    }

    &.-isTransparentRed {
      border-color: hsl(0deg 0% 100% / 95%);
      background-color: hsl(356deg 100% 45% / 100%);
    }

    &.-isTransparentWhite {
      background-color: hsl(0deg 0% 100% / 95%);
      color: hsl(356deg 100% 45% / 100%);
    }

    &.-isWhite {
      background-color: hsl(356deg 100% 45% / 100%);
      color: hsl(0deg 0% 100% / 95%);
    }
  }
}

  .gr-hotSpotSliderItem {
  flex: 0 0 100%;
  min-width: 0;
}

  .gr-hotSpotSliderItem__image {
  display: flex;
  overflow: hidden;
  align-items: center;
  -o-object-fit: cover;
     object-fit: cover;
  clip-path: polygon(0 0, 90% 0, 100% 17%, 100% 100%, 0 100%);
  border-radius: 5px;
}

  .gr-hotSpotSliderItem__copy {
  margin-inline: 1rem;
  overflow-y: hidden;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;

  @media screen and (width >= 768px) {
    margin-inline: 0;
  }

  @media screen and (width >= 1440px) {
    margin-inline: 0;
  }

  @media screen and (width >= 1920px) {
    margin-inline: 1.625rem;
  }

  h4 {
    color: rgb(255 255 255 / 95%);
    font-family: var(--font-heading);
    font-size: 22px;
    font-weight: 400;
    line-height: 26px; /* 118.182% */
    align-self: flex-start;

    @media screen and (width >= 768px) {
      font-size: 20px;
      line-height: 25px; /* 125% */
    }

    @media screen and (width >= 1920px) {
      font-size: 30px;
      line-height: 35px; /* 116.667% */
    }
  }

  p {
    color: rgb(255 255 255 / 95%);
    line-height: 26px; /* 162.5% */
    margin-block: 0.75rem;
    font-size: 1rem;

    @media screen and (width >= 768px) {
      font-size: 14px;
      line-height: 21px; /* 150% */
      margin-block: 1.25rem;
    }

    @media screen and (width >= 1920px) {
      font-size: 18px;
      line-height: 25px; /* 138.889% */
      margin-block: 1.5625rem;
    }
  }
}

  .gr-hotSpotSlider__controls .gr-pagination {
  justify-self: flex-end;
}

  .gr-icon {
  width: 1em;
  height: 1em;

  &::before {
    display: inline-block;
    font-family: 'GR Icons', sans-serif;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  &.gr-icon-arrow::before { content:'\0041';}
  &.gr-icon-burger::before { content:'\0042';}
  &.gr-icon-close::before { content:'\0043';}
  &.gr-icon-download::before { content:'\0044';}
  &.gr-icon-expand::before { content:'\0045';}
  &.gr-icon-play::before { content:'\0046';}
  &.gr-icon-stop::before { content:'\0047';}
}

  .gr-icon-button {
  --transition: all 300ms ease-out;

  display: inline-block;
  border: none;
  border-radius: 100px;
  cursor: pointer;
  transition: var(--transition);

  picture {
    display: flex;
    justify-content: center;
    align-items: center;
    transition: var(--transition);
  }

  &.arrow {
    color: white;
    background-color: transparent;
    border: 1px solid rgb(255 255 255 / 50%);
    width: clamp(2.5rem, 2.202rem + 1.325vw, 3.5rem); /* 40-56px */
    height: clamp(2.5rem, 2.202rem + 1.325vw, 3.5rem); /* 40-56px */

    picture {
      i {
        font-size: clamp(0.875rem, 0.763rem + 0.497vw, 1.25rem); /* 14px to 20px */
      }
    }

    &.next {
      picture {
        transform: rotate(45deg);
      }
    }

    &.prev {
      picture {
        transform: rotate(225deg);
      }
    }

    &:disabled {
      opacity: 0.5;
      cursor: not-allowed;

      picture {
        filter: grayscale(1);
      }
    }

    &:not(:disabled):hover {
      background-color: white;

      picture {
        filter: invert(1);
      }
    }
  }

  &.media {
    color: white;
    background-color: var(--color-gray-dark);
    opacity: 0.5;
    width: 5.8125rem; /* 93px */
    height: 5.8125rem; /* 93px */

    &:hover {
      background-color: var(--color-red);
      opacity: 1;
    }

    picture {
      i {
        font-size: 2rem; /* 32px */
      }
    }

    &.play {
      picture {
        position: relative;
        left: 2px;
      }
    }
  }
}

  .gr-menu {
  display: none;
  width: 100%;
  height: calc(100% - var(--nav-height-small));
  position: fixed;
  overflow: hidden auto;
  z-index: 2500;
  top: calc(var(--nav-height-small));
  left: 0;
  right: 0;
  padding: 2.25rem 1rem;
  border-top: 1px solid white;
  background-color: var(--color-almost-black);
  overscroll-behavior: none;

  body.-navIsOpen & {
    display: block;
  }

  & > ul {
    display: flex;
    flex-flow: column nowrap;
    justify-content: center;
    gap: 2rem;
    list-style: none;
    padding: 0;
    margin: 0;
  }

  @media screen and (width >= 768px) {
    display: block;
    position: relative;
    width: auto;
    height: 100%;
    top: initial;
    border-top: none;
    padding: 0;
    overflow: hidden;

    & > ul {
      flex-direction: row;
      height: 100%;
    }
  }
}

  .gr-menu__item {
  height: 100%;

  & > a:focus-visible {
    outline: 1px solid white;
    outline-offset: 1px;
  }

  & > a {
    height: 100%;
    display: flex;
    align-items: center;
    gap: 0.75rem; /* 12px */
    color: white;
    font-family: var(--font-heading);
    font-size: 1.5rem; /* 24px */
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
    margin: 2px;

    & > i {
      display: inline-block;
      font-size: 0.5em; /* 8px */
      transform: rotate(135deg); /* make arrow point down */
    }
  }

  &.-isOpen {
    & > a {
      border-bottom-color: white;

      & > i {
        transform: rotate(315deg); /* make arrow point up */
      }
    }
  }

  @media screen and (width >= 768px) {
    & > a {
      font-size: clamp(0.875rem, 0.765rem + 0.368vw, 1.125rem); /* 14-18px @ 480-1568px */
      position: relative;
      top: 3px;
      border-bottom: 6px solid transparent;
      transition: border-bottom-color 300ms ease-in-out;

      &:hover {
        border-bottom-color: white;
      }
    }
  }
}

  .gr-nav {
  height: var(--nav-height-small);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 5rem;
  transition: height 300ms ease-in-out;
  position: relative;
  z-index: 200;

  @media screen and (width >= 768px) {
    justify-content: flex-start;
    height: var(--nav-height-large);
  }
}

  /* make sure this nav's section is always on top of all others except for the VideoModal */

  .gr-section:has(.gr-nav) {
  background-color: var(--color-almost-black);
  z-index: 3000;
  position: sticky;
  top: 0;
}

  a.gr-nav__logo {
  flex-shrink: 0;

  img {
    width: clamp(6.25rem, 5.449rem + 3.56vw, 8.938rem); /* 100-143px */
  }
}

  /* button for the nav toggle on small screens (the burger/close icon) */

  .gr-nav__toggle {
  border: none;
  background: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  width: 1.5rem;
  color: white;
  font-size: 1.5rem;
  touch-action: none;

  /* on large screens, it's always hidden */
  @media screen and (width >= 768px) {
    display: none;
  }

  i.gr-icon-close { display: none; }
  i.gr-icon-burger { display: initial; }

  body.-navIsOpen & {
    i.gr-icon-close { display: initial; }
    i.gr-icon-burger { display: none; }
  }
}

  .gr-pagination {
  --transition: all 300ms ease-out;

  position: relative;
  z-index: 200;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  touch-action: none;

  & > button {
    display: inline-block;
    border-radius: 100px;
    cursor: pointer;
    transition: var(--transition);
    color: white;
    background-color: transparent;
    border: 1px solid rgb(255 255 255 / 50%);
    width: clamp(2.5rem, 2.202rem + 1.325vw, 3.5rem); /* 40-56px */
    height: clamp(2.5rem, 2.202rem + 1.325vw, 3.5rem); /* 40-56px */

    picture {
      display: flex;
      justify-content: center;
      align-items: center;
      transition: var(--transition);

      .gr-pagination__prev & {
        transform: rotate(225deg);
      }

      .gr-pagination__next & {
        transform: rotate(45deg);
      }

      i {
        font-size: clamp(0.875rem, 0.763rem + 0.497vw, 1.25rem); /* 14px to 20px */
      }
    }

    &:disabled {
      opacity: 0.5;
      cursor: not-allowed;

      picture {
        filter: grayscale(1);
      }
    }

    &:not(:disabled):hover {
      background-color: white;

      picture {
        filter: invert(1);
      }
    }
  }
}

  .gr-pagination__fraction {
  font-size: 1rem;
  font-family: var(--font-base);
  display: flex;
  gap: 0.25rem;
}

  .gr-scoreboard {
  background-size: cover;
  background-position: bottom center;
  padding-block: clamp(2.375rem, 2.002rem + 1.656vw, 3.625rem); /* 38-58px */
  padding-inline: clamp(0.5rem, -0.729rem + 5.464vw, 4.625rem); /* 8-74px */
  border-radius: 5px;
  position: relative;

  &::before {
    background-color: rgb(0 0 0 / 24%);
    content: '';
    display: block;
    position: absolute;
    inset: 0;
    transition: background-color 0.5s ease-in-out;
  }

  @media screen and (width >= 960px) {
    &::before {
      background-color: rgb(0 0 0 / 0%);
    }
  }

  .gr-scoreboard__wrapper {
    display: flex;
    flex-direction: column;
    gap: 4rem; /* 40px */
    overflow: hidden;

    @media screen and (width >= 960px) {
      flex-direction: row;
    }

    article {
      flex: 1 1 50%;

      @media screen and (width >= 960px) {
        max-width: 50%;
        margin: 0 auto;
      }
    }

    .gr-heading {
      font-size: 1.438rem; /* 23px */
      margin-bottom: 1.5rem;
      padding-top: 0.5em;
      padding-left: 1em;
      margin-top: 5px;
      
      &::before {
        height: 1.8em;
        width: 0.18em;
        left: 0.45em;
        transform: skewX(-16deg);
        top: 0;
      }

      @media screen and (width >= 960px) {
        font-size: clamp(1.688rem, 0.207rem + 2.467vw, 2.625rem); /* 27-42px @ 960-1568px */
        margin-bottom: 2rem;
        padding-top: 0.25em;
        padding-left: 0.75em;
        

        &::before {
          height: 1.45em;
          width: 0.35rem;
          left: 0.3em;
          top: -0.08em;
          transform: skewX(-16deg);
        }
      }
    }

    .gr-scoreboard__table {
      display: flex;
      flex-direction: column;
      gap: 0.25rem;

      &.manufacturers {
        .gr-scoreboard__tableHeader {
          span:nth-child(2) {
            @media screen and (width >= 1440px) {
              padding-left: 2.5rem;
              padding-right: 2.5rem;
            }
          }
        }
      }

      & > div {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: stretch;
        gap: 0.25rem;

        span:nth-child(1), span:nth-child(3) {
          width: 52px;

          /* do not get narrower */
          flex-shrink: 0;

          @media screen and (width >= 1024px) {
            font-size: 15px;
          }

          @media screen and (width >= 1440px) {
            width: 89px;
            font-size: 18px;
          }
        }

        span:nth-child(2) {
          /* ok to get taller */
          flex-grow: 1;
          align-items: flex-end;
        }

        &.gr-scoreboard__tableHeader {
          span {
            font-size: clamp(0.625rem, 0.55rem + 0.331vw, 0.875rem); /* 10-14px */
          }

          span:nth-child(2) {
            text-align: center;

            @media screen and (width >= 768px) {
              padding-left: 1.5rem;
              padding-right: 1.5rem;
              text-align: left;
            }

            @media screen and (width >= 1440px) {
              padding-left: 3rem;
              padding-right: 3rem;
            }
          }
        }
      }

      & > div:not(.gr-scoreboard__tableHeader) {
        &:hover {
          span {
            opacity: 1;
          }
        }

        span {
          padding: clamp(0.5rem, 0.351rem + 0.662vw, 1rem); /* 8-16px */
          border-radius: 2px;
          display: flex;
          align-items: center;
          justify-content: center;
          opacity: 0.8;

          @media screen and (width >= 1440px) {
            padding-left: 3rem;
            padding-right: 3rem;
          }
        }

        span:has(img) {
          padding: 0.5rem;
        }

        span:nth-child(1) {
          background-color: black;
          font-family: var(--font-heading);
          font-size: clamp(0.75rem, 0.638rem + 0.497vw, 1.125rem); /* 12-18px */
        }

        span:nth-child(2) {
          justify-content: flex-start;
          align-items: flex-end;
          background-color: rgb(29 29 29);
          font-size: clamp(0.875rem, 0.67rem + 0.911vw, 1.563rem); /* 14-25px */
          font-weight: 400;
          letter-spacing: 0.25em; /* 1-2px */
          line-height: 1;
          padding-left: 1.5rem;
          padding-right: 1.5rem;

          @media screen and (width >= 768px) {
            text-align: left;
          }

          @media screen and (width >= 1440px) {
            padding-left: 2.5rem;
            padding-right: 2.5rem;
          }

          p {
            font-size: clamp(0.875rem, 0.67rem + 0.911vw, 1.563rem); /* 14-25px */
            line-height: normal;
            margin-block: 2px -2px;
          }
        }

        span:nth-child(3) {
          background-color: black;
          font-size: clamp(0.75rem, 0.638rem + 0.497vw, 1.125rem); /* 12-18px */

          .drivers & {
            background-color: var(--color-red);
          }
        }

        .manufacturers &.-isHighlighted span {
          opacity: 1;

          &:nth-child(1),
          &:nth-child(3) {
            background-color: var(--color-red);
          }
        }

        &:last-child {
          span:last-child {
            clip-path: var(--clip-medium);
          }
        }
      }
    }
  }
}

  .gr-section {
  display: flex;
  align-items: stretch;
  flex-direction: column;
  padding: var(--section-spacing-y) var(--section-spacing-x);
  gap: calc(var(--section-spacing-y) / 2);
  position: relative;

  &.gr-articleFilters, &.-articleItems, &.gr-articleLoader {
    background-color: var(--color-almost-black);
  }

  &.-isHidden {
    display: none;
  }

  /* 50% vertical padding, same horizontal */
  &.-isShort {
    padding: calc(var(--section-spacing-y) / 2) var(--section-spacing-x);
  }

  /* 25% vertical padding, same horizontal */
  &.-isAlmostCollapsed {
    padding: calc(var(--section-spacing-y) / 4) var(--section-spacing-x);
  }

  /* no vertical padding at all, same horizontal */
  &.-isCollapsed {
    padding-block: 0;
  }

  /* 25% padding on ALL sides */
  &.-isAlmostFullbleed {
    padding: calc(var(--section-spacing-y) / 4);
  }

  /* no padding at all! */
  &.-isFullbleed {
    padding: calc(var(--section-spacing-y) / 2) 0;
  }

  &.-isBorderedTop {
    border-top: 1px solid rgb(255 255 255 / 25%);
  }

  &.-isBorderedBottom {
    border-bottom: 1px solid rgb(255 255 255 / 25%);
  }

  &.-isAlt {
    background-color: var(--color-almost-black);
  }

  &.-isFeatured {
    background-color: var(--color-ebony-clay);
  }

  &.-isBold {
    background-color: var(--color-red);
  }

  &.-isClean {
    background-color: white;
  }

  &.-isAnglePatterned {
    &::before {
      content: '';
      display: block;
      position: absolute;
      inset: 0;
      z-index: 0;
      background-color: rgb(255 255 255 / 45%);
      background-image: url('clientlib-base/resources/images/patterns/angles.png');
      background-repeat: repeat;
      background-position: center;
      background-size: calc(4096px / 2) calc(3245px / 2); /* half of the actual size of image for sharpness */
      opacity: 0.25;
    }
  }

  &.-isSporty {
    background-color: var(--color-battleship-gray);
  }

  &.-isLexus {
    background-color: var(--color-lexus-green);
  }

  &.-isBlueSlate {
    background-color: var(--color-slate-blue);
  }

  &.-isGreenPine {
    background-color: var(--color-pine-green);
  }

  &.-seriesItems {
    background-color: var(--color-race-series);
  }
}

  .gr-sectionNav {
  .gr-section:has(&) {
    position: sticky;
    top: var(--nav-height-small);
    z-index: 2000;

    @media screen and (width >= 768px) {
      top: var(--nav-height-large);
    }
  }

  ul {
    display: flex;
    list-style: none;
    padding: 1.75rem 0;
    justify-content: space-around;
    gap: clamp(2.938rem, 1.708rem + 5.464vw, 7.063rem);/* 47-113px */

    @media screen and (width >= 480px) {
      justify-content: start;
    }
  }
}

  .gr-sectionNav__item {
  font-family: var(--font-heading);
  font-size: clamp(1.125rem, 0.901rem + 0.993vw, 1.875rem);
  line-height: normal;
  text-align: center;

  a {
    display: inline-block;
    color: black;
    text-decoration: none;
    border-top: 2px solid transparent;
    border-bottom: 2px solid transparent;

    &:nth-child(1) {
      display: inline-block;

      @media screen and (width >= 480px) {
        display: none;
      }
    }

    &:nth-child(2) {
      display: none;

      @media screen and (width >= 480px) {
        display: inline-block;
      }
    }
  }

  &:hover {
    a {
      border-bottom-color: black;
    }
  }

  &:active,
  &.-isSelected {
    a {
      color: var(--color-red);
      border-bottom-color: var(--color-red);
    }
  }
}

  .gr-singleCTA {
  & > .gr-container {
    max-width: 1000px;
    margin: 0 auto;
    color: white;
    display: flex;
    flex-direction: column;
    gap: 2rem;
    justify-content: center;
    align-items: center;
  }
}

  .gr-singleCTA__text {
  text-align: center;
}

  .gr-slide {
  flex: 0 0 100%;
  min-width: 0;
  height: 100%;
  padding-top: clamp(2rem, 0.109rem + 9.455vw, 9.375rem); /* 32-150px */
  padding-inline: clamp(1rem, 0.231rem + 3.846vw, 4rem); /* 16-64px */
  position: relative;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;

  @media screen and (width >= 1440px) {
    .gr-slideshow.-isShort & {
      padding-top: 7rem;
    }
  }

  &.-hasVignette::before {
    content: '';
    display: block;
    position: absolute;
    z-index: 100;
    inset: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, rgb(0 0 0 / 50%), rgb(0 0 0 / 35%), rgb(0 0 0 / 15%), transparent);
  }

  img {
    position: absolute;
    z-index: 0;
    inset: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: bottom center;
       object-position: bottom center;

    @media screen and (width >= 960px) {
      -o-object-position: center center;
         object-position: center center;
    }
  }

  video {
    position: absolute;
    z-index: 0;
    inset: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: center center;
       object-position: center center;
  }
}

  .gr-slide__contents {
  position: relative;
  z-index: 200;
  width: 90%;
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: start;
  gap: 2.75rem;

  @media screen and (width >= 960px) {
    width: 80%;
  }

  @media screen and (width >= 1440px) {
    width: 70%;
  }

  p {
    font-family: var(--font-heading);
    font-size: clamp(1.75rem, 1.247rem + 2.235vw, 3.438rem); /* 28px to 55px */
    line-height: 1.2;

    .gr-slideshow.-isShort & {
      @media screen and (width >= 1440px) {
        font-size: clamp(1.75rem, 1.478rem + 1.362vw, 2.813rem); /* 28-45px */
      }
    }
  }
}

  .gr-slideshow {
  position: relative;

  .gr-section:has(&.-isHero) {
    padding: 0;
  }

  .gr-section:has(&.-isGallery) {
    padding-inline: 0;
  }

  /* optional title, need to mess with its margin/padding because the section parent is fullbleed */
  & > .gr-container {
    margin-bottom: calc(var(--section-spacing-y) / 2);
    margin-inline: 0;
    padding-inline: var(--section-spacing-x);

    @media screen and (width >= 1568px) {
      padding-inline: 0;
      margin-inline: auto;
    }
  }
}

  .gr-slideshow__viewport {
  position: relative;
  z-index: 100;
  height: clamp(33.25rem, 26.954rem + 27.98vw, 54.375rem); /* 532px to 870px */
  overflow: hidden;

  .gr-slideshow.-isShort & {
    height: clamp(17.813rem, 13.886rem + 19.631vw, 33.125rem); /* 285-532px */
  }

  & > div {
    height: 100%;
    display: flex;
  }
}

  .gr-slideshow__controls {
  position: relative;

  .gr-slideshow.-isGallery & {
    display: flex;
    flex-direction: column-reverse;
    margin-bottom: 2rem;

    @media screen and (width >= 480px) {
      flex-direction: row;
      gap: 2rem;

      /* this makes it like it's wrapped in a Section (left side only) */
      padding-left: var(--section-spacing-x);
      margin-bottom: 0;
    }
  }

  .gr-slideshow.-isHero & {
    display: flex;
    flex-direction: column-reverse;
    justify-content: end;
    gap: 13px;
    top: -40px;
    z-index: 200;

    @media screen and (width >= 960px) {
      padding: 0;
      flex-direction: row;
      position: absolute;
      top: auto;
      bottom: 80px;
      right: 0;
      gap: 24px;
    }

    /* fadeout for Slide */
    &::before {
      content: '';
      display: block;
      position: absolute;
      z-index: 0;
      left: 0;
      right: 0;
      top: -20px;
      height: 60px;
      background: linear-gradient(to bottom, transparent, black);

      @media screen and (width >= 960px) {
        display: none;
      }
    }
  }
}

  .gr-socialStories {
  padding: 0;
  overflow: hidden;
  
  h2 {
    margin-left: 2rem;
  }

  p {
    text-align: center;
  }

  .gr-carousel {
      /* breakout the container to allow the Cards to bleed to the sides */

      /* note: turns out this isn't ideal, just set gr-carousel to the Section tag and override = simpler */
      @media screen and (width < 1025px) {
        .gr-container:has(&) {
          width: calc(100% + (var(--section-spacing-x) * 2));
          left: calc(var(--section-spacing-x) * -1);
        }
      }
    }

    .gr-carousel__viewport {
      overflow: hidden;
      padding-inline: var(--section-spacing-x);

      @media screen and (width >= 768px) {
        &:not(.-isScrollable) > div {
          /* only if there are less than 3 cards */
          justify-content: center;
        }
      }

      @media screen and (width >= 1367px) {
        padding-inline: 0;
    }
  }

  .gr-slide {
    padding: 0;
    min-width: 0;

    &:first-child {
      padding-left: 0;
    }

    iframe.instagram-media {
      min-width: 100% !important;
    }

    flex: 0 0 90%; /* Slide covers x% of the viewport */

    @media screen and (width >= 768px) {
      flex: 0 0 339px;
    }

    @media screen and (width >= 1367px) {
      flex: 0 0 32.5%;
    }
  }
}

  .gr-sponsorGrid__layout {
  width: calc(100% + (var(--section-spacing-x) * 2));
  position: relative;
  left: calc(var(--section-spacing-x) * -1);
  display: flex;
  flex-direction: column;
  gap: clamp(5.625rem, 5.0485rem + 2.4595vw, 8rem);
  padding-block: clamp(4rem, 2.662rem + 5.447vw, 8.125rem);
  padding-inline: clamp(1rem, -0.6990rem + 7.2492vw, 8rem);
}

  .gr-sponsorGrid__group {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  @media screen and (width >= 768px) {
    flex-flow: row wrap;
    justify-content: space-evenly;
  }

  a {
    position: relative;
    overflow: hidden;
    display: inline-flex;
    align-items: center;

    &:focus, &:hover {
      img:first-of-type {
        opacity: 0;
      }

      img:last-of-type {
        opacity: 1;
      }
    }
  }

  img {
    width: auto;
    max-width: 100%;
    max-height: 100%;

    &:last-of-type {
      position: absolute;
      top: auto;
      opacity: 0;
    }
  }

  &.-isPrimary {
    gap: 2.25rem;

    a {
      max-height: 2.8125rem;

      @media screen and (width >= 768px) {
        max-height: 4.8125rem;
      }
    }

    img {
      max-height: 5rem;

      @media screen and (width >= 768px) {
        max-height: 4.0625rem;
      }

      @media screen and (width >= 1024px) {
        max-height: 6.375rem;
      }
    }
  }

  &.-isSecondary {
    gap: 1.75rem;
    
    a {
      max-height: 2.5rem;

      @media screen and (width >= 768px) {
        max-height: 5.125rem;
      }
    }

    img{
      max-height: 8.375rem;

      @media screen and (width >= 768px) {
        max-height: 9.375rem;
      }
    }

  }

  &.-isTertiary {
    gap: 1.875rem;

    a {
      max-height: 2.3125rem;

      @media screen and (width >= 768px) {
        max-height: 3.4375rem;
      }
    }

    img{
      max-height: 84px;

      @media screen and (width >= 768px) {
          max-height: 3.4375rem;
      }

      @media screen and (width >= 1024px) {
          max-height: 7.5625rem;
      }
    }

  }
}

  .gr-stretchLinks {
  --animation-duration: 300ms;
  --animation-timing-function: ease-out;
  --transition: all var(--animation-duration) var(--animation-timing-function);

  width: 100%;

  /* note: there are 2 gr-headings here, one normal and one stacked */
  .gr-heading {
    margin-bottom: 1rem;

    &.-isStacked {
      display: none;
      margin-bottom: 0;
      margin-right: 4rem;
    }
  }

  .gr-stretchLinks__innerGrid {
    display: grid;
    grid: auto / 1fr 1fr;
    gap: 6px 3px;

    @media screen and (width >= 480px) {
      grid: auto / repeat(4, 1fr);
      gap: 4px;
    }

    a {
      height: clamp(4.813rem, 3.863rem + 4.222vw, 8rem); /* 77-128px */
      border-radius: 2px;
      overflow: hidden;
      position: relative;
      padding-inline: clamp(1rem, 0.646rem + 1.573vw, 2.188rem); /* 16-35px */
      display: flex;
      align-items: center;
      font-family: var(--font-heading);
      font-size: clamp(1rem, 0.739rem + 1.159vw, 1.875rem); /* 16-30px */
      line-height: 1.0;
      text-decoration: none;
      color: white;

      &::before {
        content: '';
        display: block;
        position: absolute;
        inset: 0;
        background: rgb(0 0 0 / 25%);
        z-index: 200;
      }

      span {
        position: relative;
        z-index: 300;
      }

      img {
        position: absolute;
        z-index: 100;
        max-width: initial;
        width: 100%;
        height: 100%;
        inset: 0;
        -o-object-fit: cover;
           object-fit: cover;
        transition: transform var(--animation-duration) var(--animation-timing-function);
      }
    }
  }

  @media screen and (width >= 960px) {
    .gr-heading {
      display: none;

      &.-isStacked {
        display: initial;
      }
    }

    .gr-stretchLinks__outerGrid {
      display: grid;
      grid: auto / min-content auto;
      align-items: center;
    }

    .gr-stretchLinks__innerGrid {
      display: flex;
      flex-direction: row;

      a {
        transition: width var(--animation-duration) var(--animation-timing-function);
        width: 25%;

        &:hover {
          width: 40%;

          img {
            transform: scale(1.05);
          }
        }
      }
    }
  }
}

  .gr-subMenu {
  background-color: var(--color-almost-black);
  display: none;
  top: calc(var(--nav-height-small));

  .gr-menu__item.-isOpen & {
    display: block;
  }

  & > .gr-container {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    margin-top: 2rem;
  }

  @media screen and (width >= 768px) {
    position: fixed;
    top: calc(var(--nav-height-large));
    left: 0;
    width: 100%;
    padding: calc(var(--section-spacing-y) / 2) var(--section-spacing-x);
    border-top: 1px solid rgb(255 255 255 / 25%);

    & > .gr-container {
      flex-direction: row;
      gap: clamp(2rem, 0.9835rem + 4.3371vw, 6.188rem); /* 2-6+rem @ 768-1920px */
      margin-top: 0;

      .gr-subMenu__item {
        flex: 1;
        max-width: 31.1875rem;
      }
    }
  }
}

  .gr-subMenu__item {
  :is(h6).gr-heading {
    font-size: 1.125rem;
    line-height: 35px; /* 194.444% */
    white-space: nowrap;
    
    &:is(h6) {
      &::before {
        height: 1.8em;
        width: 4px;
        top: -0.01rem;
        left: 0.01rem;
        transform: skewX(-15deg);
      }
    }
  }

  ul {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-top: 1rem;
  }

  li {
    &:hover {
      a {
        img {
          transform: scale(1.05);
        }

        i {
          transform: rotate(45deg);
        }
      }
    }
  }

  a {
    display: flex;
    align-items: center;
    padding-left: 1.25rem; /* 20px */
    width: 100%;
    height: 7rem; /* 112px */
    background-color: white;
    border: 0.5px solid white;
    border-radius: 5px;
    overflow: hidden;
    color: white;
    text-decoration: none;
    position: relative;

    &::before {
      content: '';
      display: block;
      position: absolute;
      inset: 0;
      background: rgb(0 0 0 / 25%);
      z-index: 100;
    }

    span {
      width: 50%;
      position: absolute;
      z-index: 200;
      font-size: clamp(2.188rem, 1.587rem + 1.25vw, 2.813rem); /* 35-45px @ 768-1568px */
      line-height: 1;
      font-family: var(--font-heading);
    }

    i {
      position: absolute;
      z-index: 200;
      bottom: 1rem;
      right: 1rem;
      font-size: 1rem;
      transform: rotate(0deg); /* make arrow point up-right */
      transition: transform 150ms ease-in-out;
    }

    img {
      position: absolute;
      z-index: 0;
      inset: 0;
      width: 100%;
      height: 100%;
      -o-object-fit: cover;
         object-fit: cover;
      -o-object-position: center;
         object-position: center;
      transition: transform 150ms ease-in-out;
    }
  }
}

  /* Main Container - wraps all the styles to prevent style leakage
   ========================================================================== */

  .gr-submission-form {
  font-family: var(--font-body);
  position: relative;

  /* Success Message Overlay
    ========================================================================== */
  .success-message {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: none;
    padding: 45px 0;
    justify-content: center;
    text-transform: uppercase;
    line-height: 36px;
    font-size: 16px;
    color: rgb(255 255 255 / 95%);
    align-items: center;
    z-index: 1000;

    @media screen and (width >= 568px) {
      font-size: 24px;
      padding: 100px 0;
    }

    @media screen and (width >= 1440px) {
      padding: 140px 0;
    }
  }

  .success-message.show {
    display: flex;
  }

  .success-message h2 {
    color: rgb(255 255 255 / 95%);
    font-family: var(--font-body);
    font-size: clamp(18px, 4vw, 48px);
    font-weight: 500;
    text-transform: uppercase;
    text-align: center;
    letter-spacing: 1px;
    margin: 0;
    padding: 1.5rem;
    background: rgb(20 20 20 / 95%);
    border-radius: 8px;
    border: 2px solid var(--color-red);
    box-shadow: 0 10px 30px rgb(0 0 0 / 50%);
    max-width: 95%;
    cursor: pointer;
    transition: transform 0.3s ease;

    @media screen and (width >= 568px) {
      font-size: clamp(24px, 5vw, 48px);
      letter-spacing: 2px;
      padding: 2.5rem;
      border-radius: 10px;
      max-width: 90%;
    }

    @media screen and (width >= 1440px) {
      padding: 3rem;
    }
  }

  .success-message h2:hover {
    transform: scale(1.05);
  }

  /* Form Layout
    ========================================================================== */
  form {
    display: flex;
    flex-direction: column;
    font-family: var(--font-body);
  }

  .row {
    display: flex;
    flex-direction: column;
    gap: 0;

      @media screen and (width >= 568px) {
        flex-direction: row;
        gap: 36px;
    }

    @media screen and (width >= 1440px) {
        gap: 78px;
    }
  }

  .field {
    margin-bottom: 24px;
    flex: 1;
    display: flex;
    flex-direction: column;
    position: relative;

    @media screen and (width >= 568px) {
      margin-bottom: 50px;
    }

    @media screen and (width >= 1440px) {
      margin-bottom: 3.125rem;
    }
  }

  .field-large {
    display: flex;
    flex-direction: column;
    margin-bottom: 2rem;

    @media screen and (width >= 568px) {
      margin-bottom: 2.5rem;
    }

    @media screen and (width >= 1440px) {
      margin-bottom: 3.125rem;
    }
  }

  .radio-field {
    margin-bottom: 50px;
  }

  .form-footer {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 3rem;

    @media screen and (width >= 568px) {
      justify-content: flex-end;
      margin-top: 4rem;
    }

    @media screen and (width >= 1440px) {
      margin-top: 5.625rem;
    }
  }

  .button-container {
    width: 100%;

    @media screen and (width >= 568px) {
      width: 50%;
    }

    @media screen and (width >= 1440px) {
      width: 40%;
    }
  }

  .button-row {
    display: flex;
    flex-direction: row;
    gap: 0.75rem;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;

    @media screen and (width >= 568px) {
      align-items: center;
      gap: 0;
    }
  }

  /* Typography
    ========================================================================== */
  label {
    color: rgb(255 255 255 / 95%);
    text-transform: uppercase;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin-bottom: 10px;
    font-family: var(--font-body);
    transition: color 0.3s ease;

    @media screen and (width >= 568px) {
      font-size: 15px;
    }
  }

  label.error {
    color: var(--color-red);
  }

  .dropdown-label {
    margin-bottom: 8px;

    @media screen and (width >= 568px) {
      margin-bottom: 9px;
    }

    @media screen and (width >= 1440px) { 
      margin-bottom: 10px;
    }
  }

  .legend-title {
    font-weight: 400;
    text-transform: uppercase; 
    font-size: 14px; 
    line-height: 20px;
    margin-bottom: 37.2px;
    color: rgb(255 255 255 / 95%);
    font-family: var(--font-body);
    transition: color 0.3s ease;

    @media screen and (width >= 568px) {
      font-size: 15px;
      margin-bottom: 35.5px;
    }
  }

  .legend-title.error {
    color: var(--color-red);
  }

  .disclaimer,
  .disclaimer p {
    font-family: var(--font-body); 
    color: rgb(255 255 255 / 95%);
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
    text-transform: uppercase;
    margin-top: 24px;

    @media screen and (width >= 568px) {
      font-size: 13px;
      margin-top: 38px;
    } 
  }

  .disclaimer-required {
    font-size: 13px;
    color: rgb(255 255 255 / 95%);
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
    text-transform: uppercase;
    font-family: var(--font-body);

    @media screen and (width >= 568px) {
      font-size: 13px;
    }

  }

  .disclaimer-link {
    color: rgb(255 255 255 / 95%);
  }

  /* Error Messages
    ========================================================================== */
  .error-message {
    color: var(--color-red);
    font-size: 12px;
    font-weight: 400;
    margin-top: 10px;
    font-family: var(--font-body);
    text-transform: uppercase;
    display: none;
    line-height: 20px;

    @media screen and (width >= 568px) {
      font-size: 13px;
    }
  }

  .error-message.show {
    display: block;
  }

  /* Form Elements
    ========================================================================== */
  input {
    background: #2c2c2c;
    border-radius: 5px;
    border: 2px solid transparent;
    color: #979595;
    font-family: var(--font-body);
    padding: 14px 4px;
    text-transform: uppercase;
    font-size: 16px;
    transition: border-color 0.3s ease;

    @media screen and (width >= 568px) {
      font-size: 18px;
    }
  }

  fieldset {
    border: none;
    padding: 0; 
  }

  /* Button Styles
    ========================================================================== */
  .submission-button {
    min-width: 123px;

    @media screen and (width >= 568px) {
      min-width: 117px;
    }
  }

  /* Links
    ========================================================================== */
  a {
    color: #06c;
    text-decoration: underline;
  }

  /* Radio Buttons
    ========================================================================== */
  .radio-group {
    display: flex;
    flex-direction: column;
    row-gap: 28px;
  }

  .radio-container {
    display: flex;
    cursor: pointer;
    gap: 13px;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
    margin-bottom: 0;
    text-transform: none; 
    justify-content: flex-start;
    align-items: flex-start;
    position: relative;
    font-family: var(--font-body); 

    @media screen and (width >= 568px) {
      align-items: center;
      font-size: 20px;
    } 
  }

  .radio-container input[type="radio"] {
    opacity: 0;
    position: absolute;
    width: 0;
    height: 0;
  }

  .custom-radio {
    width: 17px;
    height: 17px;
    border: 1px solid #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 3px;
    flex-shrink: 0;
    transition: all 0.2s;

    @media screen and (width >= 568px) {
      margin-top: 0;
    }
  }

  .custom-radio::after {
    content: "";
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background-color: var(--color-red);
    opacity: 0;
    transition: opacity 0.2s;
  }

  .radio-container input[type="radio"]:checked ~ .custom-radio::after {
    opacity: 1;
  }

  .radio-container:hover .custom-radio {
    border-color: #fff;
  }

  /* Select Dropdowns (Native)
    ========================================================================== */
  select {
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    background: #2c2c2c;
    border: none;
    border-radius: 5px;
    color: #979595;
    font-family: var(--font-body);
    font-size: 18px;
    padding: 0.6rem 2rem 0.6rem 0.6rem; 
    margin-top: 0.6rem;
    cursor: pointer;
    position: relative;
  }

  select:hover {
    border-color: #fff;
    color: #fff;
  }

  select:focus {
    outline: 2px solid var(--color-red);
  }

  option {
    background: #2c2c2c;
    color: #fff;
  }

  option:checked,
  option:focus,
  option:hover {
    background-color: var(--color-red) !important;
    color: white;
  }

  /* Custom Dropdowns
    ========================================================================== */
  .custom-dropdown {
    position: relative;
    margin-bottom: 50px;
  }

  .dropdown {
    position: relative;
    width: 100%;
    background: #2c2c2c;
    border-radius: 4px;
    color: #979595;
    text-transform: uppercase;
    font-size: 16px;
    font-family: var(--font-body);
    cursor: pointer;

    @media screen and (width >= 568px) {
      border-radius: 4.5px;
      font-size: 17px;
    }

    @media screen and (width >= 1440px) {
      border-radius: 5px;
      font-size: 18px;
    }
  }

  .dropdown-selected {
    padding: 14px 10px;
    height: 55px;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  /* Dropdown Arrow Icon */
  .dropdown::after {
    content: '\0041';
    font-family: 'GR Icons', sans-serif;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 12px;
    color: rgb(255 255 255 / 95%);
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%) rotate(135deg);
    transition: transform 0.2s ease, color 0.2s ease;
    pointer-events: none;
  }

  .dropdown.open::after {
    transform: translateY(-50%) rotate(-45deg);
  }

  /* Dropdown Options List */
  .dropdown-options {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #2c2c2c;
    border-radius: 4px;
    margin-top: 3px;
    list-style: none;
    padding: 0;
    display: none;
    z-index: 10;
    max-height: 300px;
    overflow-y: auto;
    text-transform: uppercase;
    font-family: var(--font-body);

    @media screen and (width >= 568px) {
      border-radius: 4.5px;
      margin-top: 3.5px;
      max-height: 375px;
    }

    @media screen and (width >= 1440px) {
      border-radius: 5px;
      margin-top: 4px;
      max-height: 450px;
    }
  }

  .dropdown.open .dropdown-options {
    display: block;
  }

  .dropdown-options li {
    padding: 12px 6px;
    font-size: 16px;
    color: #979595;
    font-family: var(--font-body);
    transition: background 0.2s ease;

    @media screen and (width >= 568px) {
      padding: 13px 7px;
      font-size: 18px;
    }

    @media screen and (width >= 1440px) {
      padding: 15px 9px;
    }
  }

  .dropdown-options li:hover {
    background: var(--color-red);
    color: #fff;
  }

  .dropdown-options li.selected {
    background: var(--color-red);
    color: #fff;
  }
}

  .gr-thumbnails {
  z-index: 200;
  padding-inline: var(--section-spacing-x);

  /* for galleries, don't center the thumbnails */
  &.-isFixed {
    margin: 0;
    overflow: hidden;
    width: 100%;

    @media screen and (width >= 480px) {
      padding-left: 0;
    }

    & > div {
      display: flex;
      gap: 5px;

      @media screen and (width >= 480px) {
        justify-content: start;
      }

      @media screen and (width >= 960px) {
        gap: 0;
      }
    }
  }

  &.-isFloating {
    margin: 0 auto;
    width: 100%;
    overflow: hidden;

    @media screen and (width >= 960px) {
      width: 395px; /* enough to show 2+ thumbnails */
      padding-inline: 0;
    }

    &.-isTwoExactly {
      width: auto;
    }

    & > div {
      display: flex;
      gap: 5px;

      @media screen and (width >= 480px) {
        justify-content: center;
      }

      @media screen and (width >= 960px) {
        justify-content: start;
        gap: 0;
      }
    }
  }
}

  .gr-thumbnailItem {
  min-width: 0;
  flex: 0 0 clamp(4.688rem, 3.142rem + 6.871vw, 9.875rem); /* 75px to 158px */
  height: clamp(3.875rem, 2.664rem + 5.381vw, 7.938rem); /* 62px to 127px */
  position: relative;
  overflow: visible;
  margin-block: 1.25rem;

  @media screen and (width >= 960px) {
    margin-left: 5px;
  }

  a {
    display: block;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    background-color: transparent;
    border: 1px solid transparent;
    border-radius: 5px;
    cursor: pointer;
    clip-path: var(--clip-small);

    @media screen and (width >= 960px) {
      clip-path: var(--clip-medium);
    }
  }

  img {
    position: absolute;
    z-index: 0;
    inset: 0;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    -o-object-fit: cover;
       object-fit: cover;
    clip-path: var(--clip-small);

    @media screen and (width >= 960px) {
      clip-path: var(--clip-medium);
    }
  }

  &:focus,
  &:hover,
  &.-isSelected {
    .gr-thumbnails.-isBordered & a {
      background-color: white;
    }

    .-isHero & a {
      background-color: rgb(255 255 255 / 95%);
      border-width: 0.5px;
      border-radius: 2px;

      @media screen and (width >= 1024px) {
        border-width: 1px;
        border-radius: 5px;
      }
    }

    .gr-thumbnails.-isUnderlined & {
      &::after {
        content: '';
        position: absolute;
        width: calc(100% - 4px);
        height: 5px;
        background-color: var(--color-red);
        left: 2px;
        bottom: -8px;
      }
    }
  }
}

  .gr-tint {
  /* see styles/base.css */
  display: none;
  position: fixed;
  inset: 0;
  z-index: 2000;
  background-color: rgb(0 0 0 / 80%);
}

  .gr-videoModal {
  position: fixed;
  inset: 0;
  z-index: 4000;
  overflow: auto;
  display: none;
  align-items: center;
  justify-content: center;
  background-color: rgb(0 0 0 / 80%);

  &.-isOpen {
    display: flex;
  }
}

  .gr-videoModal__content {
  width: 100%;
  max-width: 1000px;
  aspect-ratio: 16 / 9;
  margin: clamp(1rem, 0.6667rem + 1.6667vw, 2rem);

  & > * {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
       object-fit: contain;
  }
}

  .gr-videoModal__close {
  position: absolute;
  top: 2rem;
  right: 2rem;
  font-size: 1rem;
  color: white;
  background-color: transparent;
  border: none;
  cursor: pointer;

  @media screen and (width >= 768px) {
    font-size: 2rem;
  }

  &:hover {
    color: var(--color-red);
  }
}

  .gr-videoPlayer__header {
  display: flex;
  flex-direction: column;
  gap: 1rem;

  .gr-heading {
    flex-shrink: 0;
  }

  @media screen and (width >= 768px) {
    flex-direction: row;
    gap: 4rem;
  }
}

  .gr-videoPlayer__filters {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 1rem;

  @media screen and (width >= 768px) {
    flex-direction: row;
    justify-content: center;
    align-items: center;
  }

  @media screen and (width >= 1024px) {
    justify-content: flex-end;
  }

  .gr-dropdown.-isOpen {
    isolation: isolate;
    z-index: 301;
  }
}

  .gr-videoPlayer__contents {
  display: flex;
  flex-direction: column;
  gap: 1rem;

  @media screen and (width >= 1024px) {
    flex-direction: row;
    gap: 1.5rem;
  }
}

  .gr-videoPlayer__viewer {
  background-color: hsl(0deg 0% 11% / 100%);
  aspect-ratio: 16 / 9;
  overflow: hidden;

  & > * {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
       object-fit: contain;
  }

  /* go full width on small screens */
  @media screen and (width < 1024px) {
    .gr-container:has(> &) {
      width: calc(100% + (var(--section-spacing-x) * 2));
      left: calc(var(--section-spacing-x) * -1);
    }
  }

  @media screen and (width >= 1024px) {
    border-radius: 0.5rem;

    .gr-container:has(> &) {
      /* 614-1008px = 60% of 1024px to 70% of 1440px @ 1024-1568px */
      flex-basis: clamp(38.375rem, -7.978rem + 72.426vw, 63rem);
    }
  }
}

  .gr-videoPlayer__bigPlayButton {
  /* this makes it the same size as the viewer, without being in it */
  position: absolute;
  inset: 0;
  aspect-ratio: 16 / 9;
  background-color: transparent;
  display: flex;
  justify-content: center;
  align-items: center;

  .gr-videoPlayer.-hasPlayed & {
    display: none;
  }

  button {
    width: 5rem;
    height: 5rem;
    z-index: 1;
    border-radius: 5rem;
    border: none;
    background-color: var(--color-red);
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: transform 150ms ease-in;

    &:hover {
      transform: scale(1.125);
    }

    i {
      display: inline-block;
      color: white;
      font-size: 2.5rem;
      position: relative;
      left: 0.25rem;
    }
  }
}

  .gr-videoPlayer.-isYoutube .gr-videoPlayer__bigPlayButton {
  display: none !important;
}

  .gr-videoPlayer__counter {
  font-size: clamp(0.75rem, 0.702rem + 0.24vw, 0.938rem);
  padding-bottom: clamp(0.25rem, 0.122rem + 0.641vw, 0.75rem);
  text-align: right;
}

  .gr-videoPlayer__playlist {
  display: flex;
  flex-direction: column;
  gap: var(--videoPlayer-item-gap);
  overflow: hidden auto;
  overscroll-behavior: auto;
  border-radius: 0.5rem;
  scrollbar-width: none;

  /* add extra padding at the bottom to prevent fadeout from covering the last item */
  padding-bottom: var(--videoPlayer-fade-height);

  --total-item-height: calc(var(--videoPlayer-item-height) * var(--videoPlayer-max-items-before-scroll));
  --total-gap: calc(var(--videoPlayer-item-gap) * (var(--videoPlayer-max-items-before-scroll) - 1));

  max-height: calc(var(--total-item-height) + var(--total-gap)); /* each item is 117px tall + 1rem gap in between */

  @media screen and (width >= 1024px) {
    scrollbar-width: thin;
    scrollbar-color: white transparent;

    .gr-container:has(> &) {
      flex-basis: 40%;
    }
  }

  &::after {
    content: '';
    display: block;
    position: absolute;
    z-index: 300;
    width: 100%;
    height: var(--videoPlayer-fade-height);
    bottom: 0;
    left: 0;
    background: linear-gradient(0deg, #000 0%, rgb(0 0 0 / 0%) 100%);
    pointer-events: none;
  }

  &.-isSlateBlue {
    &::after {
      background: linear-gradient(0deg, #293E50 0%, rgb(0 0 0 / 0%) 100%);
    }
  }

  &.-isPineGreen {
    &::after {
      background: linear-gradient(0deg, #3E5450 0%, rgb(0 0 0 / 0%) 100%);
    }
  }
}

  .gr-videoPlayerItem {
  background-color: var(--videoPlayerItem-background-color);
  flex-shrink: 0;
  display: flex;
  flex-direction: row;
  height: var(--videoPlayer-item-height);
  position: relative;
  border-radius: 0.5rem;
  overflow: hidden;
  cursor: pointer;

  &.-isSelected::before {
    content: '';
    display: block;
    position: absolute;
    z-index: 300;
    width: 5px;
    height: 100%;
    left: 0;
    top: 0;
    background-color: red;
  }

  &.-isHidden {
    display: none;
  }
}

  .gr-videoPlayerItem__media {
  flex-basis: 50%;
  position: relative;

  img {
    position: absolute;
    z-index: 200;
    width: 100%;
    height: 100%;
    inset: 0;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: center;
       object-position: center;
    opacity: 1;
    transition:
      opacity 150ms linear,
      transform 150ms linear;
  }

  video {
    position: absolute;
    z-index: 100;
    inset: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: center;
       object-position: center;
    opacity: 0;
    transition: all 150ms linear;
  }

  .gr-videoPlayerItem.-hasPreview:not(.-isSelected):hover & {
    img {
      opacity: 0;
    }

    video {
      opacity: 1;
    }
  }
}

  .gr-videoPlayerItem__details {
  flex-basis: 50%;
  padding: var(--videoPlayerItem-details-padding);
}

  .gr-videoPlayerItem__title {
  font-family: var(--font-body);
  font-size: clamp(0.875rem, 0.859rem + 0.08vw, 0.938rem); /* 14-15px */
  line-height: 1.25;
  max-height: calc(clamp(0.875rem, 0.859rem + 0.08vw, 0.938rem) * 3 * 1.25);
  overflow: hidden;
}

  .gr-videoPlayerItem__tags {
  font-size: 10px;
  color: red;
}

  .gr-videoPlayerItem__duration {
  font-family: var(--font-body);
  font-size: clamp(0.75rem, 0.702rem + 0.24vw, 0.938rem); /* 12-15px */
  text-transform: uppercase;
  position: absolute;
  bottom: var(--videoPlayerItem-details-padding);
  background-color: var(--videoPlayerItem-background-color);
}

  /* AEM-specific overrides */

  body.page.basicpage {
  /* AEM wraps the Nav in a <div|header>.experiencefragment, which should be sticky */
  .experiencefragment:has(.gr-nav) {
    position: sticky;
    top: 0;
    z-index: 3000;
  }

  /* AEM has its own wrapper for the SectionNav, which should be sticky */
  .sectionnav:has(.gr-sectionNav) {
    position: sticky;
    top: var(--nav-height-small);
    z-index: 2000;

    @media screen and (width >= 768px) {
      top: var(--nav-height-large);
    }
  }
}
.cmp-link__screen-reader-only {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
    opacity: 0;
}