@charset "utf-8";

/* -------- Layout -------- */

.page {
	margin: 0 auto;
}

.twosidebars {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: stretch;
}

.twosidebars .main {
	background-color: #ffffff;
	padding: 25px;
	flex: 100% 1 1;
	order: 1;
}

.twosidebars .sidebar {
	-background-color: #f0f0f0;
	background-color: #ffffff;
	padding: 25px;
	flex: 100% 0 0;
}

.twosidebars .sidebar-left {
	order: 3;
}

.twosidebars .sidebar-right {
	order: 2;
}

/* -------- Responsive Medium -------- */

@media screen and (min-width: 900px) {

	.page {
		max-width: 800px;
	}
	
	.twosidebars {
	}
	
	.twosidebars .main {
		border-left: 4px solid #dfeefb;
		border-right: 4px solid #dfeefb;
	}
	
	.twosidebars .sidebar {
		flex: 50% 0 0;
	}
	
	.twosidebars .sidebar-left {
		padding-left: 12.5px;
	}
	
	.twosidebars .sidebar-right {
		padding-right: 12.5px;
	}
	
}

/* -------- Responsive Large -------- */

@media screen and (min-width: 1300px) {
	
	.page {
		margin: 25px auto;
		max-width: 1200px;
	}
	
	.twosidebars {
		flex-flow: row nowrap;
	}
	
	.twosidebars .main {
		flex: auto 1 1;
		order: 2;
	}
	
	.twosidebars .sidebar {
		flex: 275px 0 0;
		flex: 300px 0 0;
		padding: 25px;
	}
	
	.twosidebars .sidebar-left {
		order: 1;
	}
	
	.twosidebars .sidebar-right {
		order: 3;
	}
	
	.media-list .medium {
		display: inline-block;
		float: left;
		width: calc(50% - 20px);
	}
	
	.media-list .medium:nth-child(2n) {
		margin-left: 20px;
	}
	
	.media-list .medium:nth-child(2n+1) {
		clear: left;
		float: left;
	}
	
}