/* 20260525212439 - v2 */
.gui,
.gui-block-linklist li a {
  color: #666666;
}

.gui-page-title,
.gui a.gui-bold,
.gui-block-subtitle,
.gui-table thead tr th,
.gui ul.gui-products li .gui-products-title a,
.gui-form label,
.gui-block-title.gui-dark strong,
.gui-block-title.gui-dark strong a,
.gui-content-subtitle {
  color: #000000;
}

.gui-block-inner strong {
  color: #848484;
}

.gui a {
  color: #2d689c;
}

.gui-input.gui-focus,
.gui-text.gui-focus,
.gui-select.gui-focus {
  border-color: #2d689c;
  box-shadow: 0 0 2px #2d689c;
}

.gui-select.gui-focus .gui-handle {
  border-color: #2d689c;
}

.gui-block,
.gui-block-title,
.gui-buttons.gui-border,
.gui-block-inner,
.gui-image {
  border-color: #8d8d8d;
}

.gui-block-title {
  color: #333333;
  background-color: #ffffff;
}

.gui-content-title {
  color: #333333;
}

.gui-form .gui-field .gui-description span {
  color: #666666;
}

.gui-block-inner {
  background-color: #f4f4f4;
}

.gui-block-option {
  border-color: #ededed;
  background-color: #f9f9f9;
}

.gui-block-option-block {
  border-color: #ededed;
}

.gui-block-title strong {
  color: #333333;
}

.gui-line,
.gui-cart-sum .gui-line {
  background-color: #cbcbcb;
}

.gui ul.gui-products li {
  border-color: #dcdcdc;
}

.gui-block-subcontent,
.gui-content-subtitle {
  border-color: #dcdcdc;
}

.gui-faq,
.gui-login,
.gui-password,
.gui-register,
.gui-review,
.gui-sitemap,
.gui-block-linklist li,
.gui-table {
  border-color: #dcdcdc;
}

.gui-block-content .gui-table {
  border-color: #ededed;
}

.gui-table thead tr th {
  border-color: #cbcbcb;
  background-color: #f9f9f9;
}

.gui-table tbody tr td {
  border-color: #ededed;
}

.gui a.gui-button-large,
.gui a.gui-button-small {
  border-color: #8d8d8d;
  color: #000000;
  background-color: #ffffff;
}

.gui a.gui-button-large.gui-button-action,
.gui a.gui-button-small.gui-button-action {
  border-color: #8d8d8d;
  color: #000000;
  background-color: #ffffff;
}

.gui a.gui-button-large:active,
.gui a.gui-button-small:active {
  background-color: #cccccc;
  border-color: #707070;
}

.gui a.gui-button-large.gui-button-action:active,
.gui a.gui-button-small.gui-button-action:active {
  background-color: #cccccc;
  border-color: #707070;
}

.gui-input,
.gui-text,
.gui-select,
.gui-number {
  border-color: #8d8d8d;
  background-color: #ffffff;
}

.gui-select .gui-handle,
.gui-number .gui-handle {
  border-color: #8d8d8d;
}

.gui-number .gui-handle a {
  background-color: #ffffff;
}

.gui-input input,
.gui-number input,
.gui-text textarea,
.gui-select .gui-value {
  color: #000000;
}

.gui-progressbar {
  background-color: #00bb00;
}

/* custom */
/* Temprorary override to show products in search */
#collection .products-wrap .products, #collection .filter-wrap {
    visibility: visible !important;
}

/* fix styling for checkbox in cookie consent modal for checkboxes */
#gdpr_cookie_plugin_body input[type=checkbox] { -webkit-appearance: auto !important; }

/* header-service-help */
.header-service-help {line-height: var(--lineHeight-s);}

/* filter corrections */

#dmws-filter .filter ul li {margin-bottom: 1;}
#dmws-filter .filter ul li label {font-size:15,5px; padding-left: 25px;}
#dmws-filter .filter ul li label .checkbox {width: 16px; height: 16px;}
#dmws-filter .filter ul li label i {left: 0;}


#dmws_perfect-filter-results > div.dmws_perfect-filter-content > a {margin-left: 5px;}
.product .wrap > label { max-width: calc(100% - 40px); }
@media only screen and (max-width: 760px) {
	#collection ul.list-inline.owl-carousel { margin-top: 2px; }
}

/* content-paragraph text */
#dmws_perfect-filter-results .dmws_perfect-filter-content p {
    color: var(--black);
    line-height: var(--lineHeight-l);
    margin-top: var(--space-s);
  	margin-bottom: var(--space-m);
}

h2.dmws_perfect-filter-title {display: none;}

/* Category Related Subjects Block */

#dmws_perfect-filter-results .dmws_perfect-filter-content .footer-content-top {margin-top: var(--space-m);}
.dmws_perfect-filter-content .footer-content-top .content .container {padding-left:0;}
.show-content-block{ display:block !important; }
.show-content-block h2 { 
  margin-bottom: 10px; 
  font-size: 2rem;
  line-height: 2.6rem;
  color: var(--accent);
}
.bottom-desc{
  width:100%;
  display: flex;
  margin-bottom:30px;
}
.bottom-desc span.title{ line-height: 3rem; font-size:var(--h3size); color:var(--black); font-weight: var(--fontBold); margin-bottom: 10px; }
.bottom-desc .content{
  color: #363c3f;
  font-weight: 400;
  line-height: 20px;
  padding: 0px;
  /*vertical-align: middle;*/
  font-size: 13px;
  display: inline-flex;
  flex-direction: column;
  padding: 0px 15px;
}
.bottom-desc .content p { font-size: var(--h5size); line-height: 2.2rem; color:var(--black); }
.bottom-desc .content:first-child {
  padding-left: 0px !important;
}
.bottom-desc .content:nth-child(2) {
  padding-right: 0px !important;
}
.bottom-desc .content .background-div{
  border-radius: 15px;
	display: flex;
  flex-direction: row;
}

.bottom-desc .content .inhoud{
  padding:15px 0px; 
  display: flex;
  flex-direction: column;
}
.bottom-desc .content .inhoud .meer-info{
  font-weight: var(--fontBold);
  color: var(--accent);
  padding: 0px;
  font-size:var(--h4size);
  line-height: 2.5rem;
}
.bottom-desc .content .inhoud .meer-info:hover {
  text-decoration: underline;
}
.bottom-desc .content .afbeelding{
  height: 100%;
  width: 100%;
  min-height: 195px;
  height: 195px;
 	border-radius: var(--borderRadius);
  background-size:cover !important;
  display: inherit;
}

/* Custom Footer 2 kolommen */

@media (min-width: 768px) {
    .bottom-desc .col-md-6 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 49%
    }
}
@media (max-width: 768px) {
  .bottom-desc .content{
  	padding: 0px;
	}
}

#template-overview #sidebar {
    border: 1px solid #d0d0d1;
    padding: 15px;
}

/* DMWS FILTER STOCK SELECTOR ACTIVE */
#dmws_perfect-filter-filterbar .dmws_perfect-filter-filter-wrap .dmws_perfect-filter-switch input:checked+.dmws_perfect-filter-switch-slider {
    background-color: var(--dmws-plus-positives-color);
}

/* DMWS COOKIE POPUP */

.cookie_86bwgmy8b_link {text-decoration: underline;}
.dmws-popup-text p {line-height: var(--lineHeight-m);}

/* END DMWS COOKIE POPUP */

/* DMWS FAQ */
.collection-faq {
/*   margin: 40px 0; */
}
.collection-faq .collection-faq-items{
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 2rem;
 counter-reset: li-counter
}
.collection-faq .collection-faq-items details{
  width: calc(50% - 5px);
  cursor: pointer;
  border: 1px solid #dededede;
  border-radius: var(--borderRadius);
  align-self: stretch;
}
.collection-faq .collection-faq-items details summary:before {
  font-weight: 700;
  content: counter(li-counter) '.';
  counter-increment: li-counter;
  color: var(--accent);
}
.collection-faq .collection-faq-items details summary {
  display: flex;
  flex-wrap: nowrap;
  position: relative;
  align-items: flex-start;
  margin: 0;
  padding: 20px;
  cursor: pointer;
  outline: none;
  gap: 10px;
}
.collection-faq .collection-faq-items details > summary {
  list-style: none;
}
.collection-faq .collection-faq-items details > summary::-webkit-details-marker {
  display: none;
}
.collection-faq .collection-faq-items details summary h4 {
	margin: 0!important;
}
.collection-faq .collection-faq-items details summary i {
    margin-left: auto;
    min-width: 12px !important;
    height: 8px !important;
}
.collection-faq .collection-faq-items details summary i:before {
	color: var(--bodyText)
}
.collection-faq .collection-faq-items details > div {
	padding: 0 20px 10px;
}
@media only screen and (max-width: 999.98px) {
  .collection-faq .collection-faq-items details{
    width: 100%;
  }
  .collection-faq .collection-faq-items details summary {
    padding: 15px;
  }
  .collection-faq .collection-faq-items details > div {
		padding: 0 15px 10px;
	}
}
/* END DMWS FAQ */

/* Category Tags */
.tags h3 { margin-bottom: 25px; }
.tags ul { list-style: none; margin: 0; padding: 0; }
.tags ul li { margin-bottom: 5px; margin-right: 10px; }
.tags ul li a { border-radius: 10px; border: 1px solid #ececec; color: #13101e; display: block; padding: 10px 30px; background-color:#F1F1F1; }
#home-block-tags h2 { margin-bottom: 20px; }
/* end */

/* Category Related Subjects Block */
.mt-5, .my-5 {
    margin: 3rem 0px !important;
}
.justify-content-center {
    -ms-flex-pack: center!important;
    justify-content: center!important;
}
.flex-wrap {
    -ms-flex-wrap: wrap!important;
    flex-wrap: wrap!important;
}
.d-flex {
    display: -ms-flexbox!important;
    display: flex!important;
}
.show-content-block{ display:block !important; }
.show-content-block h2 { 
  margin-bottom: 10px; 
  font-size: 2rem;
  line-height 2.6rem;
  color: #2d689c;
}
.bottom-desc{
  width:100%;
  display:inline-block;
  margin-bottom:30px;
}
.bottom-desc span.title{ line-height: 1rem; font-size: 1.8rem; margin-top:10px; color:#404040; font-weight: 700; margin-bottom: 10px; }
.bottom-desc .content{
  color: #363c3f;
  font-weight: 400;
  line-height: 20px;
  padding: 0px;
  vertical-align: middle;
  font-size: 13px;
  display: inherit;
  padding: 0px 15px;
}
.bottom-desc .content p { font-size: 1.4rem; line-height: 2.2rem; color:#404040; }
.bottom-desc .content:first-child {
  padding-left: 0px !important;
}
.bottom-desc .content .background-div{
  border-radius: 15px;
	display: flex;
  flex-direction: row;
}

.bottom-desc .content .inhoud{
  padding:15px 0px; 
  display: flex;
  flex-direction: column;
}
.bottom-desc .content .inhoud .meer-info{
  font-weight: 700;
  color: #2d689c;
  padding: 0px;
  font-size:1.6rem;
  line-height: 2.5rem;
}
.bottom-desc .content .inhoud .meer-info .icon-arrow { display: none; }
.bottom-desc .content .inhoud .meer-info:hover {
  text-decoration: underline;
}
.bottom-desc .content .afbeelding{
  height: 100%;
  width: 100%;
  min-height: 195px;
 	border-radius: 15px;
  background-size:cover !important;
  display: inherit;
}

@media (max-width: 768px) {
  .bottom-desc .content{
  	padding: 0px;
	}
}
/* end */

/* show mollie integration */
#gui-checkout-payment-methods .gui-field .gui-input { border: 1px solid; padding: 5px 10px; }
#gui-checkout-payment-methods .gui-checkout-payment-provider .gui-payment-methods .gui-payment-method.gui-is-selected .gui-payment-method-form { display: inline-block !important; margin-left: 0; margin-top: 0; padding-top: 0; width: 100%; }
/* end */

.product-description p { 
  float:left !important; 
  width:100% !important; 
  margin-top:20px ; 
  font-size:14px !important; 
  color:#000 !important; 
  font-weight:400 !important; 
}

/* 404 background image */
/* #dmws-a_w8fu2f-404-module {align-items:baseline;top:5vh;min-height: 30vh;background-position-y: 660px;}

@media (max-width: 768px) {
  #dmws-a_w8fu2f-404-module {min-height: 45vh;background-position-y: 1020px;}
} */
/* #dmws-a_w8fu2f-404-module .dmws-a_w8fu2f-404-module--text {top:-65px;} */
/* #dmws-a_w8fu2f-404-module {
    max-width: 1200px !important;
    top: 20px;
    margin-left: auto !important;
    margin-right: auto !important;
}

.dmws-a_w8fu2f-404-module--text {
  top:100px;
} */

// Textpagina categorie overzicht //

.textpage-categories a img{ border:1px solid #e1e1e1; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
.textpage-categories a.category-view-btn{ background:#2e679a; height:35px; line-height:37px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; color:#fff; font-weight:100; border-bottom:2px solid #245480; font-size:14px; display: inline-block; padding: 0px 30px; }


// Aanrader //

.aanrader {
  display: block;
  background: #efefef;
  padding: 5px;
}

// TechData Apple Campagne //

      @font-face {
        font-family: 'TD_SF_Pro_Display';
        font-style: normal;
        font-weight: 400;
        font-display: swap;
        src: url("https://apple.com/wss/fonts/SF-Pro-Display/v3/sf-pro-display_medium.woff2") format("woff2"), url("https://apple.com/wss/fonts/SF-Pro-Display/v3/sf-pro-display_medium.woff") format("woff"), url("https://apple.com/wss/fonts/SF-Pro-Display/v3/sf-pro-display_medium.ttf") format("truetype");
      }
      @font-face {
        font-family: 'TD_SF_Pro_Display';
        font-style: normal;
        font-weight: 600;
        font-display: swap;
        src: url("https://apple.com/wss/fonts/SF-Pro-Display/v3/sf-pro-display_semibold.woff2") format("woff2"), url("https://apple.com/wss/fonts/SF-Pro-Display/v3/sf-pro-display_semibold.woff") format("woff"), url("https://apple.com/wss/fonts/SF-Pro-Display/v3/sf-pro-display_semibold.ttf") format("truetype");
      }
      body {
        margin: 0;
      }
      .td * {
        box-sizing: border-box;
        color: inherit;
        -webkit-overflow-scrolling: touch;
      }
      .td *::before,
      .td *::after {
        box-sizing: inherit;
      }
      .td {
        margin: 0;
        color: #000;
        font-family: 'TD_SF_Pro_Display', 'SF Pro Icons', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        font-weight: 400;
      }
      .td main {
        width: 100%;
        max-width: 1280px;
        margin: 0 auto;
        overflow: hidden;
      }
      .td footer {
        width: 100%;
      }
      .td img {
        display: block;
        width: 100%;
        height: auto;
      }
      .td button {
        cursor: pointer;
      }
      .td .td-h1,
      .td .td-h2,
      .td .td-h3,
      .td .td-h4 {
        margin: 0;
        font-weight: 600;
        letter-spacing: -.015em;
      }
      .td .td-h1 {
        font-size: 30px;
        line-height: 38px;
      }
      .td .td-h2 {
        font-size: 27px;
        line-height: 37px;
      }
      .td .td-h3 {
        font-size: 23px;
        line-height: 32px;
      }
      .td .td-h4 {
        font-size: 18px;
        line-height: 26px;
      }
      .td .td-body {
        font-size: 14px;
        line-height: 22px;
      }
      @media (min-width: 768px) {
        .td .td-h1 {
          font-size: 48px;
          line-height: 60px;
        }
        .td .td-h2 {
          font-size: 35px;
          line-height: 45px;
        }
        .td .td-h3 {
          font-size: 27px;
          line-height: 37px;
        }
        .td .td-h4 {
          font-size: 20px;
          line-height: 28px;
        }
        .td .td-body {
          font-size: 16px;
          line-height: 24px;
        }
      }
      @media (min-width: 1024px) {
        .td .td-h1 {
          font-size: 80px;
          line-height: 90px;
        }
        .td .td-h2 {
          font-size: 55px;
          line-height: 65px;
        }
        .td .td-h3 {
          font-size: 45px;
          line-height: 55px;
        }
        .td .td-h4 {
          font-size: 35px;
          line-height: 45px;
        }
        .td .td-body {
          font-size: 20px;
          line-height: 28px;
        }
      }
      .td-sr-only {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        overflow: hidden;
        clip: rect(1px, 1px, 1px, 1px);
        border: 0;
        clip-path: inset(0px 0px 99.9% 99.9%);
      }
      .overlay {
        position: fixed;
        z-index: 2;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        transition: opacity 0.8s ease-out;
        opacity: 0;
        background-color: #000;
        pointer-events: none;
      }
      .overlay--visible {
        transition: opacity 0.8s ease-out;
        opacity: 0.5;
        pointer-events: all;
      }
      @font-face {
        font-family: 'TD_SF_Pro_Display';
        font-style: normal;
        font-weight: 400;
        font-display: swap;
        src: url("https://apple.com/wss/fonts/SF-Pro-Display/v3/sf-pro-display_medium.woff2") format("woff2"), url("https://apple.com/wss/fonts/SF-Pro-Display/v3/sf-pro-display_medium.woff") format("woff"), url("https://apple.com/wss/fonts/SF-Pro-Display/v3/sf-pro-display_medium.ttf") format("truetype");
      }
      @font-face {
        font-family: 'TD_SF_Pro_Display';
        font-style: normal;
        font-weight: 600;
        font-display: swap;
        src: url("https://apple.com/wss/fonts/SF-Pro-Display/v3/sf-pro-display_semibold.woff2") format("woff2"), url("https://apple.com/wss/fonts/SF-Pro-Display/v3/sf-pro-display_semibold.woff") format("woff"), url("https://apple.com/wss/fonts/SF-Pro-Display/v3/sf-pro-display_semibold.ttf") format("truetype");
      }
      body {
        margin: 0;
      }
      .td * {
        box-sizing: border-box;
        color: inherit;
        -webkit-overflow-scrolling: touch;
      }
      .td *::before,
      .td *::after {
        box-sizing: inherit;
      }
      .td {
        margin: 0;
        color: #000;
        font-family: 'TD_SF_Pro_Display', 'SF Pro Icons', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        font-weight: 400;
      }
      .td main {
        width: 100%;
        max-width: 1280px;
        margin: 0 auto;
        overflow: hidden;
      }
      .td footer {
        width: 100%;
      }
      .td img {
        display: block;
        width: 100%;
        height: auto;
      }
      .td button {
        cursor: pointer;
      }
      .td .td-h1,
      .td .td-h2,
      .td .td-h3,
      .td .td-h4 {
        margin: 0;
        font-weight: 600;
        letter-spacing: -.015em;
      }
      .td .td-h1 {
        font-size: 30px;
        line-height: 38px;
      }
      .td .td-h2 {
        font-size: 27px;
        line-height: 37px;
      }
      .td .td-h3 {
        font-size: 23px;
        line-height: 32px;
      }
      .td .td-h4 {
        font-size: 18px;
        line-height: 26px;
      }
      .td .td-body {
        font-size: 14px;
        line-height: 22px;
      }
      @media (min-width: 768px) {
        .td .td-h1 {
          font-size: 48px;
          line-height: 60px;
        }
        .td .td-h2 {
          font-size: 35px;
          line-height: 45px;
        }
        .td .td-h3 {
          font-size: 27px;
          line-height: 37px;
        }
        .td .td-h4 {
          font-size: 20px;
          line-height: 28px;
        }
        .td .td-body {
          font-size: 16px;
          line-height: 24px;
        }
      }
      @media (min-width: 1024px) {
        .td .td-h1 {
          font-size: 80px;
          line-height: 90px;
        }
        .td .td-h2 {
          font-size: 55px;
          line-height: 65px;
        }
        .td .td-h3 {
          font-size: 45px;
          line-height: 55px;
        }
        .td .td-h4 {
          font-size: 35px;
          line-height: 45px;
        }
        .td .td-body {
          font-size: 20px;
          line-height: 28px;
        }
      }
      .td-sr-only {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        overflow: hidden;
        clip: rect(1px, 1px, 1px, 1px);
        border: 0;
        clip-path: inset(0px 0px 99.9% 99.9%);
      }
      .hero {
        position: relative;
        width: 100%;
        height: 320px;
        margin: 0 auto;
        overflow: hidden;
        background-color: #f3f3f3;
      }
      @media (min-width: 768px) {
        .hero {
          height: 45vh;
        }
      }
      @media (min-width: 1024px) {
        .hero {
          height: 55vh;
        }
      }
      @media (min-width: 1280px) {
        .hero {
          height: 66vh;
        }
      }
      .hero .image {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
      }
      .hero .td-h1 {
        position: absolute;
        z-index: 1;
        top: 15%;
        width: 100%;
        color: #fff;
        text-align: center;
      }
      .image,
      .image>img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
      }
      .footnotes {
        display: inline-block;
        width: 100%;
        padding: 24px 16px;
        background-color: #f5f5f7;
      }
      @media (min-width: 768px) {
        .footnotes {
          padding: 24px;
        }
      }
      @media (min-width: 1024px) {
        .footnotes {
          padding: 24px 0;
        }
      }
      .footnotes__notes {
        width: 100%;
        max-width: 975px;
        margin: 0 auto;
        padding: 0;
        list-style: none;
      }
      .footnotes__note {
        color: #929292;
        font-size: 12px;
        line-height: 16px;
      }
      .footnotes__note+.footnotes__note {
        padding-top: 12px;
      }
      @media (min-width: 768px) {
        .footnotes__note+.footnotes__note {
          padding-top: 14px;
        }
      }
      .fixed-ratio {
        display: block;
        position: relative;
        height: 0;
        overflow: hidden;
      }
      .fixed-ratio__content {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        max-width: inherit;
      }
      .full-width-image {
        margin: 0 auto;
        max-width: 1280px;
      }
      .quote-section {
        margin: 40px 20px;
      }
      @media (min-width: 768px) {
        .quote-section {
          margin: 80px 40px;
        }
      }
      @media (min-width: 1024px) {
        .quote-section {
          margin: 120px 60px;
        }
      }
      @media (min-width: 1280px) {
        .quote-section {
          margin: 160px 80px;
        }
      }
      .quote-section__title {
        color: #e3715e;
      }
      .quote-section__body {
        margin: 0;
      }
      .quote-section__body br {
        content: ' ';
        margin-top: 1em;
        display: block;
      }
      .tile {
        position: relative;
        z-index: 1;
        max-width: 400px;
        height: 400px;
        margin: 0 auto;
        border: 5px solid transparent;
      }
      @media (min-width: 768px) {
        .tile {
          max-width: none;
          height: 450px;
          margin: 0;
        }
      }
      @media (min-width: 1024px) {
        .tile {
          height: 500px;
        }
      }
      @media (min-width: 1280px) {
        .tile {
          height: 550px;
        }
      }
      .tile.tile--raised {
        z-index: 3;
      }
      .tile.tile--full,
      .tile.tile--full-alt {
        width: 100%;
      }
      .tile.tile--twothird {
        width: 100%;
      }
      @media (min-width: 768px) {
        .tile.tile--twothird {
          width: 50%;
        }
      }
      @media (min-width: 1024px) {
        .tile.tile--twothird {
          width: 66.66%;
        }
      }
      .tile.tile--half {
        width: 100%;
      }
      @media (min-width: 768px) {
        .tile.tile--half {
          width: 50%;
        }
      }
      .tile.tile--onethird {
        width: 100%;
      }
      @media (min-width: 768px) {
        .tile.tile--onethird {
          width: 50%;
        }
        .tile.tile--onethird:last-child:nth-child(even) {
          width: 100%;
        }
        .tile.tile--onethird:last-child:nth-child(odd) {
          width: 50%;
        }
      }
      @media (min-width: 1024px) {
        .tile.tile--onethird {
          width: 33.33%;
        }
        .tile.tile--onethird:last-child:nth-child(even) {
          width: 33.33%;
        }
        .tile.tile--onethird:last-child:nth-child(odd) {
          width: 33.33%;
        }
      }
      .tile__content {
        height: 100%;
      }
      .tile--flip .tile__content {
        transform-style: preserve-3d;
        perspective: 1600px;
      }
      .tile__panel {
        display: flex;
        position: absolute;
        flex-direction: column;
        align-items: center;
        width: 100%;
        height: 100%;
        padding: 40px 30px;
        overflow: hidden;
        transform-style: preserve-3d;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        transition: transform 0.8s ease-in-out;
        border-radius: 25px;
        background-color: #f5f5f7;
        text-align: center;
        cursor: auto;
      }
      @media (min-width: 768px) {
        .tile__panel {
          padding: 60px;
        }
      }
      .tile__panel.tile__panel--front {
        transform: rotateY(0deg);
      }
      .tile__panel.tile__panel--rear {
        justify-content: flex-start;
        padding: 60px 30px 30px;
        transform: rotateY(-180deg);
      }
      .tile--flipped .tile__panel--front {
        transform: rotateY(180deg);
      }
      .tile--full .tile__panel--front,
      .tile--twothird .tile__panel--front {
        flex-direction: column;
        justify-content: space-between;
      }
      @media (min-width: 768px) {
        .tile--full .tile__panel--front,
        .tile--twothird .tile__panel--front {
          flex-direction: row;
        }
      }
      .tile--half .tile__panel--front {
        justify-content: space-between;
      }
      @media (min-width: 768px) {
        .tile--half .tile__panel--front {
          padding: 60px 40px;
        }
      }
      .tile--onethird .tile__panel--front {
        justify-content: space-between;
      }
      @media (min-width: 768px) {
        .tile--onethird .tile__panel--front {
          padding: 60px 40px;
        }
      }
      .tile--onethird.tile--content-alignment-top .tile__panel--front,
      .tile--twothird.tile--content-alignment-top .tile__panel--front,
      .tile--half.tile--content-alignment-top .tile__panel--front {
        flex-direction: column-reverse;
      }
      .tile--full.tile--content-alignment-left .tile__panel--front {
        flex-direction: row-reverse;
      }
      .tile__panel--rear {
        transform: rotateY(-180deg);
      }
      .tile--flipped .tile__panel--rear {
        transform: rotateY(0deg);
      }
      .tile--full-alt .tile_image {
        position: absolute;
        z-index: -1;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
      }
      .tile--full .tile_image,
      .tile--twothird .tile_image {
        flex: 0 1 100%;
        max-height: 50%;
      }
      @media (min-width: 768px) {
        .tile--full .tile_image,
        .tile--twothird .tile_image {
          flex: 0 1 47%;
          max-width: 47%;
          max-height: none;
        }
      }
      .tile--half .tile_image {
        flex: 0 1 100%;
        max-height: 50%;
      }
      .tile--onethird .tile_image {
        flex: 0 1 100%;
        max-height: 50%;
      }
      .tile_image .image>img {
        object-fit: contain;
      }
      .tile--full-alt .tile_image .image>img {
        object-fit: cover;
      }
      .tile--full-alt .tile__text {
        color: #fff;
      }
      .tile--full .tile__text,
      .tile--twothird .tile__text {
        flex: 0 1 35%;
      }
      @media (min-width: 768px) {
        .tile--full .tile__text,
        .tile--twothird .tile__text {
          flex: 0 1 47%;
        }
      }
      .tile--half .tile__text {
        flex: 0 1 35%;
      }
      @media (min-width: 768px) {
        .tile--half .tile__text {
          flex: 0 1 30%;
        }
      }
      .tile--onethird .tile__text {
        flex: 0 1 35%;
      }
      @media (min-width: 768px) {
        .tile--onethird .tile__text {
          flex: 0 1 30%;
        }
      }
      .tile__title,
      .tile__subtitle,
      .tile__body {
        width: 100%;
      }
      .tile--full .tile__panel--front .tile__title,
      .tile--twothird .tile__panel--front .tile__title,
      .tile--half .tile__panel--front .tile__title,
      .tile--onethird .tile__panel--front .tile__title {
        color: #929292;
      }
      .tile__panel--front .tile__title {
        margin: 0 0 8px;
      }
      .tile__panel--rear .tile__title {
        margin: 0 0 4px;
        color: #929292;
      }
      .tile--onethird .tile__panel--front .tile__body,
      .tile--twothird .tile__panel--front .tile__body,
      .tile--half .tile__panel--front .tile__body {
        margin: 0;
      }
      .tile__link {
        margin-top: 16px;
        color: #0066cc;
        text-decoration: none;
      }
      .tile__link:hover,
      .tile__link:focus {
        text-decoration: underline;
      }
      .tile__button {
        border: none;
        outline: none;
        background-color: transparent;
        cursor: pointer;
      }
      .tile__button--front {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
      }
      .tile--flipped .tile__button--front {
        display: none;
      }
      .tile__button--front .tile__button-icon {
        position: absolute;
        right: 28px;
        bottom: 28px;
        width: 24px;
        height: 24px;
      }
      .tile__button--rear .tile__button-icon {
        position: absolute;
        top: 28px;
        left: 28px;
        width: 24px;
        height: 24px;
      }
      .tiles-grid {
        margin: 0 -5px 40px;
        padding: 0 10px;
      }
      .tiles-grid__content {
        display: flex;
        flex-direction: column;
        width: 100%;
        margin: 0 auto;
      }
      @media (min-width: 768px) {
        .tiles-grid__content {
          flex-direction: row;
          flex-wrap: wrap;
          max-width: 718px;
        }
      }
      @media (min-width: 1024px) {
        .tiles-grid__content {
          max-width: 924px;
        }
      }
      @media (min-width: 1280px) {
        .tiles-grid__content {
          max-width: 1130px;
        }
      }
