.my-networks {
    h3 {
        margin-bottom: 1rem;    
    }

    img {
        border: 0;
    }

    & > .content-wrapper {
        display: flex;
        flex-wrap: wrap;
        gap: 1rem;
    
        margin-top: 0.5rem;
        margin-bottom: 1rem;

        .widgets {
            display: flex;
            flex-wrap: wrap;
            gap: 0.5rem;
            flex-direction: column;
        }

        .cliques {
            display: flex;
            flex-direction: column;
            gap: 0.25rem;
        }
    }
}

.widgets {
    .my-safonts {
        outline: 5px dotted black;
        outline-offset: -2px;

        background-color: var(--global_color-foreground);
        background-image: url(/assets/tiles/white/polkadots12.webp);
        padding-left: 1.5rem;

        margin-top: 0.25rem;

        .content-wrapper {
            background-color: var(--global_color-background);
            padding: 0.5rem;
            border-left: 5px dotted var(--global_color-foreground);

            & > * {
                margin: 0;
                line-height: 1;
            }
        }

        .title {
            font-weight: bold;
            text-transform: uppercase;
            font-style: italic;
            letter-spacing: 0.2em;
            font-size: 2.25rem;
            display: block;
        }

        .link {
            color: var(--global_color-foreground);
            font-style: italic;
            font-weight: bold;
            letter-spacing: 0.1rem;

            &:hover {
                color: var(--global_color-text-main);
            }
        }

        .links a {
            font-weight: bold;
            font-style: italic;
        }

        .flexbox {
            display: flex;
            justify-content: space-between;
        }
    }

    .my-selfinsertwebring {
        width: 300px;
        height: 164px;
    }
}