/* @group twitter-feed
================================================================================= */

#twitter-feed {
	width: 100%;
}

#sidebar #twitter-feed {
	padding-top: 0;
	border-top: 0;
}

#twitter-feed ul {
	position: relative;
	float: left;
	width: 100%;
}

#twitter-feed ul li {
	position: relative;
	float: left;
	margin: 0 0 2em 0;
	padding: 0 1em;
	margin: 0;
	padding: 0 1em 1em;
	max-width: 100%;
}

#sidebar #twitter-feed ul li {
	display: none;
	width: 100%;
}

#sidebar #twitter-feed ul li:nth-of-type(1),
#sidebar #twitter-feed ul li:nth-of-type(2),
#sidebar #twitter-feed ul li:nth-of-type(3) {
	display: block;
}

#twitter-feed ul li .user,
#twitter-feed ul li .interact {
	display: none;
}

#twitter-feed ul li .tweet {
	position: relative;
	margin: 0;
	padding: 1em;
	word-wrap: break-word;
	color: #fff;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

#twitter-feed .tweet:after {
	position: absolute;
	display: block;
	bottom: -0.75em;
	left: 1em;
	width: 0;
	height: 0;
	border-width: 0 0.75em 0.75em 0;
	border-style: solid;
	border-color: transparent #111;
	content: "";
}
/*
#twitter-feed ul li:nth-of-type(1) .tweet,
#twitter-feed ul li:nth-of-type(7) .tweet,
#twitter-feed ul li:nth-of-type(12) .tweet {
	background: #007297;
}

#twitter-feed ul li:nth-of-type(1) .tweet:after,
#twitter-feed ul li:nth-of-type(7) .tweet:after,
#twitter-feed ul li:nth-of-type(12) .tweet:after {
	border-color: transparent #007297;
}

#twitter-feed ul li:nth-of-type(2) .tweet,
#twitter-feed ul li:nth-of-type(8) .tweet,
#twitter-feed ul li:nth-of-type(9) .tweet {
	background: #cb2b99;
}

#twitter-feed ul li:nth-of-type(2) .tweet:after,
#twitter-feed ul li:nth-of-type(8) .tweet:after,
#twitter-feed ul li:nth-of-type(9) .tweet:after {
	border-color: transparent #cb2b99;
}

#twitter-feed ul li:nth-of-type(3) .tweet,
#twitter-feed ul li:nth-of-type(5) .tweet,
#twitter-feed ul li:nth-of-type(10) .tweet {
	background: #75757a;
}

#twitter-feed ul li:nth-of-type(3) .tweet:after,
#twitter-feed ul li:nth-of-type(5) .tweet:after,
#twitter-feed ul li:nth-of-type(10) .tweet:after {
	border-color: transparent #75757a;
}

#twitter-feed ul li:nth-of-type(4) .tweet,
#twitter-feed ul li:nth-of-type(6) .tweet,
#twitter-feed ul li:nth-of-type(11) .tweet {
	background: #5c6615;
}

#twitter-feed ul li:nth-of-type(4) .tweet:after,
#twitter-feed ul li:nth-of-type(6) .tweet:after,
#twitter-feed ul li:nth-of-type(11) .tweet:after {
	border-color: transparent #5c6615;
}
*/
#twitter-feed ul li .tweet a {
	color: #fff;
	text-decoration: underline;
}

#twitter-feed ul li .tweet a:hover,
#twitter-feed ul li .tweet a:focus {
	text-decoration: underline;
	color: #fff;
}

#twitter-feed ul li img {
	position: relative;
	display: block;
	width: 100%;
	height: auto;
	margin-bottom: -5px;
	-webkit-border-radius: 5px 5px 0 0;
	-moz-border-radius: 5px 5px 0 0;
	border-radius: 5px 5px 0 0;
	z-index: 10;
}

#twitter-feed ul li img[aria-label*="Emoji"] {
	display: inline-block;
	width: 16px;
	height: 16px;
	margin: 0 5px 0 0;
}

#twitter-feed .timePosted {
	text-align: left;
	color: #b7b6b6;
	margin: 1em 0 0 2.5em;
	padding: 0;
	font-size: 0.8em;
}

#twitter-feed .timePosted a {
	text-decoration: none;
	color: #b7b6b6;
	-moz-transition: color 0.2s ease-out;
	-webkit-transition: color 0.2s ease-out;
	transition: color 0.2s ease-out;
}

#twitter-feed .timePosted a:hover,
#twitter-feed .timePosted a:focus {
	text-decoration: underline;
	color: #5c6615;
}

/* @end */

/* =========== BOLD additions =========== */

#twitter-feed ul {
	margin: 0;
	padding: 1em 0;
	float: none;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
}

#twitter-feed li { list-style: none; }

#twitter-feed ul li {
	float: none;
	width: 25%;
	display: flex;
	flex-direction: column;
}

#twitter-feed ul li img {
	z-index: 0;
}

#twitter-feed ul li > p.tweet {
	order: 2;
	margin: 0;
}

#twitter-feed ul li:nth-of-type(1) .tweet,
#twitter-feed ul li:nth-of-type(3) .tweet,
#twitter-feed ul li:nth-of-type(6) .tweet,
#twitter-feed ul li:nth-of-type(8) .tweet,
#twitter-feed ul li:nth-of-type(9) .tweet,
#twitter-feed ul li:nth-of-type(11) .tweet {
	background: #4b7c8e;
}

#twitter-feed ul li:nth-of-type(1) .tweet:after,
#twitter-feed ul li:nth-of-type(3) .tweet:after,
#twitter-feed ul li:nth-of-type(6) .tweet:after,
#twitter-feed ul li:nth-of-type(8) .tweet:after,
#twitter-feed ul li:nth-of-type(9) .tweet:after,
#twitter-feed ul li:nth-of-type(11) .tweet:after {
	border-color: transparent #4b7c8e;
}

#twitter-feed ul li:nth-of-type(2) .tweet,
#twitter-feed ul li:nth-of-type(4) .tweet,
#twitter-feed ul li:nth-of-type(5) .tweet,
#twitter-feed ul li:nth-of-type(7) .tweet,
#twitter-feed ul li:nth-of-type(10) .tweet,
#twitter-feed ul li:nth-of-type(12) .tweet {
	background: #0e3a55;
}

#twitter-feed ul li:nth-of-type(2) .tweet:after,
#twitter-feed ul li:nth-of-type(4) .tweet:after,
#twitter-feed ul li:nth-of-type(5) .tweet:after,
#twitter-feed ul li:nth-of-type(7) .tweet:after,
#twitter-feed ul li:nth-of-type(10) .tweet:after,
#twitter-feed ul li:nth-of-type(12) .tweet:after {
	border-color: transparent #0e3a55;
}

#twitter-feed ul li > p.timePosted { order: 3; }

#twitter-feed ul li > div.media { order: 1; height: 25%; } /* Height is for fixing strange gap in IE */

#twitter-feed .timePosted a { color: #404040; }
#twitter-feed .timePosted a:hover { color: #000000; border-bottom: none; }


@media (max-width: 1023px) {
	#twitter-feed ul li { width: 33%; }
}

@media (max-width: 767px) {
	#twitter-feed ul li { width: 50%; }
}

@media (max-width: 599px) {
	/* #twitter-feed ul { justify-content: center; } */
	#twitter-feed ul li { width: 100%; max-width: 20em;}
	#twitter-feed ul li > p.timePosted { text-align: center; margin-left: 0; }
}