

* {
  box-sizing: border-box;
}

/* ----------------------------- FIRST SET OF COLUMNS ------------------------------ */



/* CREATE TWO EQUAL COLUMNS THAT FLOATS NEXT TO EACH OTHER */
.column_plain {
	float: left;
	width: 35%;
	/* padding: 10px; */
	/* height: 300px; */ /* Should be removed. Only for demonstration */
	/* border-top: thin dotted gray; */
	/* border-right: thin dotted gray; BORDERS FOR POSITION TESTING ONLY */
	/* border-left: thin dotted gray; */
	margin-top: 8px;
	padding-top: 18px;
	padding-left: 60px;
	padding-right: 20px;
}
#row {
	background-image: linear-gradient(#e75234, #fff);
	/* background-color: #e75234; */
	border: medium dashed maroon;
	border-radius: 20px;
}

/* CLEAR FLOATS AFTER THE COLUMNS */
.row:after {
	content: "";
	display: table;
	clear: both;
}

/* RESPONSIVE LAYOUT - MAKES THE TWO COLUMNS STACK ON TOP OF EACH OTHER INSTEAD OF NEXT TO EACH OTHER */
@media screen and (max-width: 600px) {
.column_plain {
	width: 100%;
	}
}





/* ----------------------------- SECOND SET OF COLUMNS ------------------------------ */




/* CREATE TWO EQUAL COLUMNS THAT FLOATS NEXT TO EACH OTHER */
.column {
	float: left;
	width: 50%;
	padding: 10px;
	/* height: 300px; */ /* Should be removed. Only for demonstration */
	border-top: thin dotted gray;
	border-right: thin dotted gray;
	border-left: thin dotted gray;
	margin-top: 8px;
	padding-top: 18px;
}

/* CLEAR FLOATS AFTER THE COLUMNS */
.row:after {
	content: "";
	display: table;
	clear: both;
}

/* RESPONSIVE LAYOUT - MAKES THE TWO COLUMNS STACK ON TOP OF EACH OTHER INSTEAD OF NEXT TO EACH OTHER */
@media screen and (max-width: 600px) {
.column {
	width: 100%;
	}
}
