.container-base
{
    margin-left: auto;
    margin-right: auto;

    &.flex
    {
        display: flex;
        flex-direction: column;

        &.horizontal
        {
            flex-direction: row;
        }
    }
}

@media (min-width: 1200px) {
	.container-base {
		width: var(--page-max-width);
	}
}
@media (max-width: 1360px) {
	.container-base {
		width: 960px;
	}
}
@media (max-width:991px) {
	.container-base {
		width: 720px;

        &.flex.horizontal:not(.v-768)
        {
            flex-direction: column;
        }
	}
}
@media (max-width: 767px) {
    .container-base
    {
        width: 90%;
        padding: 0;

        &.full-width
        {
            width: 100%;
        }

        &.flex
        {
            flex-direction: column;
        }
    }
}