style.css

/***************************/
/***************************/
/**  Write YOUR CSS below **/
/***************************/
/***************************/

/* This select targets the page's 'body' element */
body {
	/* 
		- Set the 'background-color' property to '#f1f1f1'
			Which will make the background color be light gray.
    */


} 
/*
	'}' is a closing tag. Your 'body' CSS must be written before it.
*/


/* This selector targets h4 elements 
	which have a class attribute of 'label'.  */
h4.label {
	/* 
		- Set the 'font-family' property to 'verdana'
			which will display the text using the verdana font.
		- Set the 'color' property '#ffffff'
			which will display the text in a white font.
		- Set the 'text-transform' property to 'uppercase',
			which will display the letters as all-uppercase.
		- Set the 'font-size' property to '.8em',
			which will shrink the font size to 80% of the default size.
		- Set the 'font-weight' property to 'normal',
			which will ensure the font does not display as bold.
    */

}
/*
	'}' is a closing tag. Your 'h4.label' CSS must be written before it.
*/


/* This selector targets elements with a class of 'item',
	which also have a parent with a class of 'main-content'. */
.main-content .item {
	/* 
		- Set the 'margin-bottom' property to '28px'
			which will add 28px of space to the bottom of these elements
	*/
}
/*
	'}' is a closing tag. Your '.main-content .item' CSS must be written before it.
*/

/****************************/
/****************************/
/* Do NOT edit the below CSS */
/****************************/
/****************************/

body {
	margin:	0;
}
header {
	background-color: black;
	padding: 13px 20px;
	color: #08090a;
}

header h1 {
	background-image: url('images/logo.png');
	background-repeat: no-repeat;
	width: 144px;
	height: 24px;
	text-indent: 100%;
	overflow: hidden;
	margin:0;
	display: inline-block;
}
header nav {
	float: right;
}
header nav ul {
	margin:	0;
}
header nav li a {
	border-left: 1px solid #393a3b;
	height: 50px;
	box-sizing: border-box;
	padding: 13px 20px 14px 38px;
	color: #eceeef;
	text-decoration: none;
	background-repeat: no-repeat;
	background-position: 16px 48%;;
}
.inline li {
	display: inline-block;
}
.explore-articles a {
	background-image: url('images/explore-articles.gif');
}
.book-reviews a {
	background-image: url('images/book-reviews.gif');
}
.topics a {
	background-image: url('images/topics.gif');
}
.connect a {
	background-image: url('images/connect.gif');
}
.subscribe a {
	background-image: url('images/subscribe.gif');
}
.search a {
	background-image: url('images/search.gif');
}

div.wrapper {
}

div.primary.section {
	margin-top:30px;
	overflow: hidden;
	border-right: 1px solid #d8dadb;
}
.content-wrapper {
	max-width: 900px;
	padding: 0 0 15px 31px;
    overflow: hidden;
}
div.secondary.section {
	max-width: 319px;
	float:right;
	padding: 29px;
	box-sizing: border-box;
}
.above-content {
	overflow: hidden;
}
.cover-image {
	float: right;
}
.tagline {
	color: #747779;
	font-size: 1.2em;
}
.tagline a {
	color: #993333;
	font-size: 1.3em;
	text-decoration: none;
}
.inline {
	display: inline-block;
	vertical-align: middle;
}
.quick-links ul.inline {
	display: inline-block;
	padding: 0;
	line-height: 0;
}
.icon {
	text-indent: 100%;
	overflow: hidden;
	height: 28px;
	width: 28px;
	display: block;
}
.fb.icon {
	background-image: url('images/fb.png');
}
.twitter.icon {
	background-image: url('images/twitter.png');
}
.email.icon {
	background-image: url('images/email.png');
}
.patreon.icon {
	background-image: url('images/patreon.png');
}
.trending-topics {
	border-left: 1px solid #d8dadb;
	padding:10px;
}
.item {
	position: relative;
}
.main-content .item {
	float: left;
	width: 434px;
	border: 1px solid #ececec;
}
.main-content .item.odd {
	margin-right: 28px;
}
h4.label {
	padding: 2px 5px;
}
.main-content .item h4.label {
	position: absolute;
	top: 0;
	background-color: #cc9933;
	margin: 20px 0 0 20px;
}
.main-content .item .article {
	background-color: #ffffff;
	overflow: auto;
	padding: 25px 21px 32px;
}
.main-content .item .article p, .main-content .item .article h3 {
	margin: 0;
}

.secondary.section h4.label {
	background-color: #993333;
	margin: 0;
	display: inline-block;
	margin-bottom: 15px;
}