section.m22_ascending_numbers { padding: 100px 0; }
section.m22_ascending_numbers .m22_zahlen_container {
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 32px;
flex-wrap: wrap;
} section.m22_ascending_numbers .m22_zahl_container {
flex: 0 0 max-content;
display: block;
width: max-content;
font-size: 0;
text-align: center;
}
section.m22_ascending_numbers .m22_zahl_container_prafix,
section.m22_ascending_numbers .m22_zahl_container_zahl,
section.m22_ascending_numbers .m22_zahl_container_suffix {
display: inline-block;
vertical-align: baseline;
} section.m22_ascending_numbers .m22_zahl_container_prafix span,
section.m22_ascending_numbers .m22_zahl_container_zahl span,
section.m22_ascending_numbers .m22_zahl_container_suffix span {
font-family: 'Sora', sans-serif;
font-size: 65px;
line-height: 1;
font-weight: 600;
color: var(--strobl-blue);
} section.m22_ascending_numbers .m22_zahl_container:last-child .m22_zahl_container_suffix {
margin-left: 12px;
vertical-align: 40px;
}
section.m22_ascending_numbers .m22_zahl_container:last-child .m22_zahl_container_suffix span {
display: inline-block;
width: 30px;
height: 29px;
font-size: 0;
background: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2032%2030.4928%22%3E%3Cpath%20d=%22M31.66%2012.6872L24.6478%2019.5226L26.3038%2029.1769C26.3758%2029.599%2026.2025%2030.0257%2025.8557%2030.2778C25.6599%2030.4208%2025.4268%2030.4928%2025.1938%2030.4928C25.0148%2030.4928%2024.8347%2030.4501%2024.6703%2030.3634L16%2025.8053L7.33078%2030.3622C6.95254%2030.5626%206.49212%2030.53%206.14539%2030.2767C5.79867%2030.0245%205.62531%2029.5979%205.69735%2029.1757L7.3533%2019.5215L0.340023%2012.6872C0.0338253%2012.3878%20-0.0776216%2011.9397%200.0552141%2011.5333C0.18805%2011.127%200.540402%2010.8286%200.964801%2010.7667L10.6562%209.35957L14.9902%200.576653C15.3696%20-0.192218%2016.6304%20-0.192218%2017.0098%200.576653L21.3438%209.35957L31.0352%2010.7667C31.4596%2010.8286%2031.8119%2011.1258%2031.9448%2011.5333C32.0776%2011.9409%2031.9662%2012.3866%2031.66%2012.6872Z%22%20fill=%22%23CF1872%22/%3E%3C/svg%3E") center / contain no-repeat;
} section.m22_ascending_numbers .m22_zahl_container_prafix span,
section.m22_ascending_numbers .m22_zahl_container_suffix span {
color: var(--strobl-magenta);
} section.m22_ascending_numbers .m22_zahl_container_text {
flex-basis: 100%;
margin-top: 14px;
}
section.m22_ascending_numbers .m22_zahl_container_text p {
margin: 0;
font-size: 17px;
line-height: 1.4;
font-weight: 500;
color: var(--strobl-blue);
} section.m22_ascending_numbers.bg_blau .m22_zahl_container_zahl span,
section.m22_ascending_numbers.bg_blau .m22_zahl_container_text p { color: #fff; }
@media all and (max-width: 991px) {
section.m22_ascending_numbers { padding: 75px 0; }
section.m22_ascending_numbers .m22_zahlen_container { gap: 36px 16px; justify-content: space-around; }
section.m22_ascending_numbers .m22_zahl_container { flex: 0 0 42%; width: auto; }
}
@media all and (max-width: 575px) {
section.m22_ascending_numbers { padding: 50px 0; }
} @media all and (max-width: 475px) {
section.m22_ascending_numbers .m22_zahl_container_prafix span,
section.m22_ascending_numbers .m22_zahl_container_zahl span,
section.m22_ascending_numbers .m22_zahl_container_suffix span { font-size: 44px; }
section.m22_ascending_numbers .m22_zahl_container:last-child .m22_zahl_container_suffix {
vertical-align: 32px;
}
}
@media all and (max-width: 375px) {
section.m22_ascending_numbers .m22_zahl_container {
width: 100%;
flex: auto;
}
section.m22_ascending_numbers .m22_zahl_container_text {
margin-top: 5px;
}
} .m22_ascending_numbers { background: #fff; } .m22_ascending_numbers .m22_zahlen_container { display: flex; }
.m22_ascending_numbers .m22_zahl_container { display: flex; flex-wrap: wrap; align-items: baseline; }
.m22_ascending_numbers .m22_zahl_container_zahl,
.m22_ascending_numbers .m22_zahl_container_suffix { display: inline-block; }
.m22_ascending_numbers .m22_zahl_container_zahl span,
.m22_ascending_numbers .m22_zahl_container_suffix span {
font-family: 'Sora', sans-serif;
font-weight: 600;
font-size: 65px;
line-height: 85px;
color: var(--strobl-blue);
}
.m22_ascending_numbers .m22_zahl_container_suffix span { color: var(--strobl-magenta); }
.m22_ascending_numbers .m22_zahl_container_text { flex-basis: 100%; }
.m22_ascending_numbers .m22_zahl_container_text p {
font-size: 17px;
line-height: 25px;
color: var(--strobl-blue);
margin: 6px 0 0;
}