/**
 * Vertical Alignment
 */
.is-content-top {
    align-items: flex-start;
}
.is-content-bottom {
    align-items: flex-end;
}

/**
 * Horizontal Alignment
 */
.is-container.is-content-left {
    margin-left: auto;
    @media all and (min-width: 960px) {
        margin-left: 0;
    }
}
.is-container.is-content-right {
    margin-right: auto;
    @media all and (min-width: 960px) {
        margin-right: 0;
    }
}

/**
 * Box position
 */
.is-box-5 .is-content-left,
.is-box-4 .is-content-left,
.is-box-3 .is-content-left,
.is-box-2 .is-content-left,
.is-box-1 .is-content-left {
    margin-left: auto
}

.is-box-5 .is-content-right,
.is-box-4 .is-content-right,
.is-box-3 .is-content-right,
.is-box-2 .is-content-right,
.is-box-1 .is-content-right {
    margin-right: auto;
}

/* Edge Vertical Spacing */
@media all and (min-width: 720px) {
    .edge-y--5 {
        &.is-content-top .is-container {
            margin-top: -200px;
        }

        &.is-content-bottom .is-container {
            margin-bottom: -200px;
        }
    }
    .edge-y--4 {
        &.is-content-top .is-container {
            margin-top: -160px;
        }

        &.is-content-bottom .is-container {
            margin-bottom: -160px;
        }
    }
    .edge-y--3 {
        &.is-content-top .is-container {
            margin-top: -120px;
        }

        &.is-content-bottom .is-container {
            margin-bottom: -120px;
        }
    }
    .edge-y--2 {
        &.is-content-top .is-container {
            margin-top: -80px;
        }

        &.is-content-bottom .is-container {
            margin-bottom: -80px;
        }
    }
    .edge-y--1 {
        &.is-content-top .is-container {
            margin-top: -40px;
        }

        &.is-content-bottom .is-container {
            margin-bottom: -40px;
        }
    }
    .edge-y-0 {
        &.is-content-top .is-container {
            margin-top: 0;
        }

        &.is-content-bottom .is-container {
            margin-bottom: 0;
        }
    }
    .edge-y-1 {
        &.is-content-top .is-container {
            margin-top: 40px;
        }

        &.is-content-bottom .is-container {
            margin-bottom: 40px;
        }
    }
    .edge-y-2 {
        &.is-content-top .is-container {
            margin-top: 80px;
        }

        &.is-content-bottom .is-container {
            margin-bottom: 80px;
        }
    }
    .edge-y-3 {
        &.is-content-top .is-container {
            margin-top: 120px;
        }

        &.is-content-bottom .is-container {
            margin-bottom: 120px;
        }
    }
    .edge-y-4 {
        &.is-content-top .is-container {
            margin-top: 160px;
        }

        &.is-content-bottom .is-container {
            margin-bottom: 160px;
        }
    }
    .edge-y-5 {
        &.is-content-top .is-container {
            margin-top: 200px;
        }

        &.is-content-bottom .is-container {
            margin-bottom: 200px;
        }
    }
}

/* Edge Horizontal Spacing */
.is-content-left {
    @media all and (min-width: 720px) {
        &.edge-x-0 {
            margin-left: 0
        }
        &.edge-x-1 {
            margin-left: 40px
        }
        &.edge-x-2 {
            margin-left: 80px
        }
        &.edge-x-3 {
            margin-left: 120px
        }
        &.edge-x-4 {
            margin-left: 160px
        }
        &.edge-x-5 {
            margin-left: 200px
        }
    }
}
.is-content-right {
    @media all and (min-width: 720px) {
        &.edge-x-0 {
            margin-right: 0
        }
        &.edge-x-1 {
            margin-right: 40px
        }
        &.edge-x-2 {
            margin-right: 80px
        }
        &.edge-x-3 {
            margin-right: 120px
        }
        &.edge-x-4 {
            margin-right: 160px
        }
        &.edge-x-5 {
            margin-right: 200px
        }
    }
}