/**
 * Formatted - text re-formatting
 * --
 * Styles used to re-add generic browser formatting HTML elements within a
 * content area so that paragraphs, lists, and tables, etc, all look correctly
 * if they are direct children of the container with this class. Formatted also
 * trims the top margin and bottom margin from the first child and last child.
 */


.mh-formatted {
    @include type(standard);
    @include clearfix;

    > h1 a,
    > h2 a,
    > h3 a,
    > p > a,
    > li > a,
    > a {
        color: $color-font-link;

        &:hover, &:focus {
            text-decoration: underline;
        }
    }

    > h1, > .h1,
    > h2, > .h2,
    > h3, > .h3 {
        margin: 25px 0 15px;
    }

    > h1, > .h1 {
        @include type(h1);
    }

    > h2, > .h2 {
        @include type(h2);
    }

    > h3, > .h3 {
        @include type(h3);
    }

    > p {
        margin: 0 0 15px;
    }

    > img,
    > iframe, {
        clear: both;
        display: block;
        margin: 25px auto;
        max-width: 100%;

        &.align-left {
            clear: left;
            float: left;
            margin-top: 0;
            margin-right: 25px;
        }

        &.align-right {
            clear: right;
            float: right;
            margin-top: 0;
            margin-left: 25px;
        }
    }

    > img {
        height: auto;
    }

    > ul {
        list-style-type: disc;
        margin: 0 0 15px;
        padding: 0 0 0 18px;

        > li ul,
        > li ol {
            margin: 0 0 15px;
            padding: 8px 0 0 18px;
        }

        > li ul {
            list-style-type: circle;
        }

        > li ol {
            list-style: lower-alpha;
        }
    }

    > ol {
        list-style-type: decimal;
        margin: 0 0 15px;
        padding: 0 0 0 19px;

        > li ol,
        > li ul {
            margin: 0 0 15px;
            padding: 8px 0 0 19px;
        }

        > li ol {
            list-style: lower-alpha;
        }

        > li ul {
            list-style-type: circle;
        }
    }

    > *:first-child {
        margin-top: 0 !important;
    }

    > *:last-child,
    > ul > li:last-child ul,
    > ol > li:last-child ol {
        margin-bottom: 0 !important;
    }
}