.end::after {
	width: 100%;
	content: " hello ";
	display: block;
	border: 1px solid red;
	height: 101px;
}


.content > form {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}

.content
.content.bg {
	width: calc(100% - 10px);
	background: rgb(220, 220, 220);
	display: flex;
	flex-direction: row;
}

.row > *,
.content > * {
	display: block;
}

.row > div {
	flex: 1 1 auto;
	margin-right: 10px;
}

.row > div:last-child {
	margin-right: 0;
}

.row > div:last-child button,
.row > div:last-child .button {
	margin-right: 0;
}

.row,
.content > .row {
	padding-bottom: 10px;
	padding-right: 10px;
	margin: 0;
	display: flex;
	flex-direction: row;
	width: 100%;
	align-items: center;
}

.row  .row:last-child{
	padding-bottom: 0;
}

.row  .row{
	padding-right: 0;
}

/************* Flexing Tiles in Container **************/
.container { /* DEV */
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}

.container .tile { /* DEV */
	display: block;
	flex-grow: 1;
	width: 200px;
	margin-left: 10px;
	margin-bottom: 10px;
	background: white;
}

.container .tile.double {
	width: 410px;
}

.container::after {
	content: '';
	flex-grow: 1000000000;

}

/************* COLUMN SYSTEM **************/
.layout {
	display: flex;
	padding: 10px 0 5px 0;
	flex-wrap: wrap;
	gap: 10px;
	width: 100%;
	min-height: 100%;
}

body > .layout {
	flex-direction: column;
	width:calc(100% - 10px);
}


body > .layout:beforeX{
	border-radius: 50%;
	border:10px solid #fbfbfb;
	content:'';
	width:20px;
	height:20px;
}



body > .layout > div.fullColumn{
	flex:0 0 auto;
	padding-right: 0;
}

body > .layout > div {
	flex:0 0 auto;
}

.layout.top div{
	align-self: flex-start;
}

.layout .oneHalf,
.layout .oneThird,
.layout .oneQuarter,
.layout .oneFifth,
.layout .twoFifth,
.layout .threeFifth,
.layout .fourFifth,
.layout .fullColumn,
.layout .minWidthFlex
{
	vertical-align: top;
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.layout > div {
	flex: 0 1 auto;
}

.layout .oneHalf {
	width: calc(50% - 5px);
	flex-basis: calc(50% - 5px);
}

.layout .oneThird {
	width: calc(33.333% - 7px);
	flex-basis: calc(33.333% - 7px);
}

.layout .oneFifth {
	width: calc(20% - 10px);
	flex-basis: calc(20% - 10px);
}


.layout .oneQuarter {
	flex-basis: calc(25% - 35px);
	width: calc(25% - 35px);
}

.layout .twoFifth {
	width: calc(40% - 10px);
	flex-basis: calc(40% - 10px);
}

.layout .threeFifth {
	width: calc(60% - 10px);
	flex-basis: calc(60% - 10px);
}

.layout .fourFifth {
	width: calc(80% - 10px);
	flex-basis: calc(80% - 10px);
}

.layout .fullColumn {
	width: calc(100%);
	flex-basis: calc(100%);
	padding-right: 10px;
}