/*
 * Styles for TYPO3 core fluid_styled_content "Textmedia" markup
 * (.ce-textpic / .ce-gallery / .ce-row / .ce-column), which ships without
 * any bundled CSS of its own.
 */

.ce-textpic {
    overflow: hidden;
}

.ce-textpic .ce-gallery {
    margin-bottom: 10px;
}

.ce-textpic.ce-below .ce-gallery {
    margin-top: 10px;
    margin-bottom: 0;
}

.ce-textpic.ce-intext.ce-left .ce-gallery {
    float: left;
    margin: 0 15px 10px 0;
}

.ce-textpic.ce-intext.ce-right .ce-gallery {
    float: right;
    margin: 0 0 10px 15px;
}

.ce-textpic.ce-center .ce-gallery {
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
}

.ce-gallery figure {
    margin: 0;
}

.ce-textpic .ce-row {
    display: flex;
    flex-wrap: wrap;
}

.ce-textpic .ce-column {
    margin: 0 10px 10px 0;
}

.ce-textpic .ce-column:last-child {
    margin-right: 0;
}

.ce-gallery[data-ce-columns="1"] .ce-column {
    flex: 0 0 100%;
}

.ce-gallery[data-ce-columns="2"] .ce-column {
    flex: 0 0 46%;
}

.ce-gallery[data-ce-columns="3"] .ce-column {
    flex: 0 0 30%;
}

.ce-gallery[data-ce-columns="4"] .ce-column {
    flex: 0 0 22%;
}

.ce-textpic .image-embed-item {
    max-width: 100%;
    height: auto;
}