.flag-se {
    width: 24px;
    height: 16px;
    background-color: #006AA7;
    position: relative;
    display: inline-block;
}

.flag-se::before,
.flag-se::after {
    content: "";
    position: absolute;
    background-color: #FECC00;
}

/* Vertical bar */
.flag-se::before {
    width: 20%;
    height: 100%;
    left: 30%;
}

/* Horizontal bar */
.flag-se::after {
    width: 100%;
    height: 20%;
    top: 40%;
}

.flag-gb {
    width: 24px;
    height: 16px;
    display: inline-block;
    background:
        /* Red cross */
        linear-gradient(to right, transparent 42%, #C8102E 42%, #C8102E 58%, transparent 58%),
        linear-gradient(to bottom, transparent 42%, #C8102E 42%, #C8102E 58%, transparent 58%),

        /* White cross */
        linear-gradient(to right, transparent 35%, white 35%, white 65%, transparent 65%),
        linear-gradient(to bottom, transparent 35%, white 35%, white 65%, transparent 65%),

        /* Red diagonals */
        linear-gradient(30deg, transparent 46%, #C8102E 46%, #C8102E 54%, transparent 54%),
        linear-gradient(-30deg, transparent 46%, #C8102E 46%, #C8102E 54%, transparent 54%),

        /* White diagonals */
        linear-gradient(30deg, transparent 40%, white 40%, white 60%, transparent 60%),
        linear-gradient(-30deg, transparent 40%, white 40%, white 60%, transparent 60%),

        /* Blue base */
        #012169;
}


.flag-us {
    width: 24px;
    height: 16px;
    position: relative;
    display: inline-block;
    background: repeating-linear-gradient(
        to bottom,
        #B22234 0px,
        #B22234 2px,
        white 2px,
        white 4px
    );
}

/* Blue canton */
.flag-us::before {
    content: "";
    position: absolute;
    width: 40%;
    height: 50%;
    background-color: #3C3B6E;
    top: 0;
    left: 0;
}

.flag-se, .flag-gb, .flag-us {
    margin-right: 6px;
    vertical-align: middle;
    border-radius: 2px;
}