#ex1 {
    p {
        line-height: 1.4;
    }

    a {
        outline-color: transparent;
    }

    a:link {
        color: #6900ff;
    }

    a:visited {
        color: #a5c300;
    }

    a:focus {
        text-decoration: none;
        background: #bae498;
    }

    a:hover {
        text-decoration: none;
        background: #cdfeaa;
    }

    a:active {
        background: #6900ff;
        color: #cdfeaa;
    }
}

#ex2 {
    a[href^="http"]::after {
        content: "";
        display: inline-block;
        width: 0.8em;
        height: 0.8em;
        margin-left: 0.25em;

        background-size: 100%;
        background-image: url("../images/icons8-external-link-52.png");
    }
}

#ex3 {
    margin: 0;
    .container {
        display: flex;
        gap: 0.625%;
    }

    a {
        flex: 1;
        text-decoration: none;
        outline-color: transparent;
        text-align: center;
        line-height: 3;
        color: black;
    }

    a:link,
    a:visited,
    a:focus {
        background: palegoldenrod;
        color: black;
    }

    a:hover {
        background: orange;
    }

    a:active {
        background: darkred;
        color: white;
    }
}