/* #region BREAKOUT BASE ##################################### */
.TEG-breakout {
position: relative;
left: 50%;
width: 100vw;
max-width: 220rem;
background: #efefef;
padding-inline: var(--tdk-base-padding) !important;
transform: translateX(-50%);
}
.TEG-breakout>* {
margin: 0 auto !important;
}
@media (min-width: 1200px) {
/* &>h2 {
margin-bottom: 2rem;
@media (min-width: 576px) {
padding-inline: var(--tdk-base-padding);
}
} */
/* &>.inner {
padding-left: var(--tdk-base-padding);
padding-right: var(--tdk-base-padding);
} */
/* &>.tabbed-content {
@media (min-width: 576px) {
padding-inline: var(--tdk-base-padding);
}
}
& .tabbed-content section {
background: #fff;
margin-top: 1px !important;
} */
.TEG-breakout>* {
/*max-width: 1150px;
 max-width: 1140px;*/
max-width: 1110px;
}
}
/* #endregion */
/* #region MARGINS ############################################### */
/* .breakout-margin {
margin-top: clamp(4rem, 12vmin, 15rem) !important;
padding-top: clamp(2rem, 8vmin, 8rem) !important;
margin-bottom: clamp(4rem, 12vmin, 15rem) !important;
}
.breakout-margin-negative {
margin-top: clamp(-12rem, -12vmin, -15rem) !important;
padding-top: clamp(2rem, 8vmin, 8rem) !important;
margin-bottom: clamp(-4rem, -12vmin, -15rem) !important;
}
.breakout-margin-none {
margin-top: 0 !important;
margin-bottom: 0 !important;
} */
/* #endregion */
/* #region BACKGROUND ############################################ */
.breakout-blue-light {
background: #e6edf780 !important;
background: color-mix(in srgb, #0046ad 5%, white) !important;
}
.breakout-blue-light .teaser-standard {
background: #e6edf7 !important;
}
.breakout-green-light {
background: #a8dde380 !important;
background: color-mix(in srgb, #45ac92 40%, white) !important;
background: #45ac9280 !important;
background: color-mix(in srgb, #45ac92 20%, white) !important;
}
.breakout-black {
color: #ccc;
background: black;
}
.breakout-black * {
color: inherit !important;
}
.breakout-grey-dark {
background: #cfcfcf;
}
.breakout-grey-light {
background-color: #f7f7f7;
}
.breakout-grey-light .image-richtext-container,
.breakout-grey-light .image-richtext-container:not(:hover) [data-ui-modal-trigger=image]:after {
background: #fff;
}
.breakout-white {
background-color: #fff;
}
/* #endregion */