@import url("normalize.css");
@import url("icons.css");
@import url("/css/jquery-ui-1.11.2.css");

/* Layout
   ========================================================================== */

*, *:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

html { height: 100%; font: 16px/1.5 Helvetica, Arial, sans-serif; font-weight: 400; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
/* 100% = 16px */

body { position: relative; min-height: 100%; background-color: #eee; color: #222; overflow-y: scroll; z-index: 0; }

img { max-width: 100%; }

progress { display: none; width: 100%; margin: 5px auto; }

#siteBox { display: block; width: 100%; min-height: 100%; background-color: #eee; z-index: 0; }
#contentBox { display: block; width: 100%; max-width: 1280px; margin: 10px auto; }
	main { position: relative; display: block; max-width: 972px; padding: 10px; background: #fff; border-width: 1px; border-style: solid; border-color: #e5e6e9 #dfe0e4 #d0d1d5; }
	@media (min-width: 768px) { main { margin-right: 168px; } }
	@media (min-width: 1024px) { main { margin-right: 308px; } }
	aside { display: none; float: right; }
	@media (min-width: 768px) { aside { position: relative; display: block; width: 160px; } }
	@media (min-width: 1024px) { aside { width: 300px; } }
		#asideContentBox { position: absolute; top: 0; right: 0; left: 0; display: block; }
	.full { display; block; width: 100%; margin: 0 auto 10px; padding: 10px; background: #fff; border-width: 1px; border-style: solid; border-color: #e5e6e9 #dfe0e4 #d0d1d5; }
	.adminBox { display; block; width: 100%; height: 49px; margin: 0 auto 10px; padding: 10px; overflow: hidden; background: #fff; border-width: 1px; border-style: solid; border-color: #e5e6e9 #dfe0e4 #d0d1d5; }
		.adminBoxHeaderButtons { display: block; margin: 0 0 10px; }
			.adminBoxHeaderButtonsLong { display: none; }
			@media (min-width: 480px) { .adminBoxHeaderButtonsLong { display: inline; } }

[data-help],
[data-tooltip] { cursor: help; }

.avatar { display: inline-block; padding: 1px; vertical-align: middle; }

.articleRateButton { height: 32px; padding: 0; font-size: 0; }
	.articleRateButton img { display: inline-block; padding: 4px 0 4px 6px; max-height: 100%; vertical-align: top; !important }
	.articleRateButton span { display: inline-block; color: #ddd; font-size: 16px !important; line-height: 32px !important; vertical-align: top !important; }
	.articleRateButton span:last-of-type { padding-right: 6px; }
	.articleRateButton img:hover + span,
	.articleRateButton span:hover { color: #fff; }
		.articleRateButton .articleRateButtonSelected { color: #fff; }

.articleSubscribeButton,
.memberSubscribeButton { padding: 3px 3px 3px 5px; font-size: 12px !important; line-height: 1em !important; font-weight: bold; }
	.articleSubscribeButton img,
	.memberSubscribeButton img { display: inline-block; height: 16px; margin: -2px 4px -2px 0; vertical-align: -2px; }
	.articleSubscribeButton .articleSubscribers,
	.memberSubscribeButton .memberSubscribers { display: inline-block; margin: -1px 0 -1px 5px; padding: 0 2px; border-radius: 2px; font-size: 11px; line-height: 13px; background: #fff; color: #666; font-weight: normal; vertical-align: 1px;}

.memberUnfriendButton { position: relative; }
	.memberUnfriendButtonX { position: absolute; top: 4px; left: 8px; font-size: 16px; color: #f00; z-index: 1; }

.paging { margin: 12px 0; text-align: center; font-size: 14px; line-height: 1em; }
	.paging .page, 
	.paging .current { display: inline-block; padding: 4px 8px; border: #cccccc 1px solid; background: #eeeeee; font: bold 1rem/1rem; color: #3d3d3d; text-decoration: none; }
	.paging .current { border: none; background: none; color: #000; }
		.paging .page:hover { background: #e1e1e1; }

.plusMinusBox { display: inline-block; color: #999; cursor: pointer; font-family: "Courier"; font-weight: normal; letter-spacing: -0.2em; }

.tabSelectorBox { display: block; margin: 0 0 10px; padding: 5px 6px; background: #eee; color: #444; font-size: 80%; line-height: 1em; text-align: center; }
@media (min-width: 600px) { .tabBox { text-align: left; } }
	.tabSelectorBoxTitle { display: block; margin: 0 0 5px 0; text-align: center; font-weight: bold; }
	@media (min-width: 600px) { .tabSelectorBoxTitle { display: inline-block; margin: 0 5px 0 0; text-align: left; } }
	.tabSelectorBoxGroup { display: inline-block; margin: 2px 0; padding-right: 20px; white-space: nowrap; }
		.tabSelectorBox input[type="radio"] { display: none; }
		.tabSelectorBox label { display: inline-block; margin: 0 2px; padding: 3px 6px; border-radius: 3px; white-space: nowrap; text-align: center; cursor: pointer; }
		.tabSelectorBox label.tabSelected { background: #666; color: #eee; }
			.tabSelectorBox label .tabLong { display: none; }
			@media (min-width: 480px) { .tabSelectorBox label .tabLong { display: inline; } }

.trustScore { display: inline-block; position: relative; padding: 2px 2px 1px; border: #666 1px solid; border-radius: 2px; vertical-align: middle; background: #eee; cursor: help; font-size: 0.75em; line-height: 1.1em; font-weight: normal; white-space: nowrap; }
	.trustGood { border-color: #9adf8f; background: #d4ffcd; color: #327827; }
	.trustMid  { border-color: #e5db55; background: #fefccb; color: #897f00; }
	.trustBad  { border-color: #df8f90; background: #ffd2d3; color: #892123; }
	.trustScore .trustBreakdown { display: none; position: absolute; top: 25px; left: -1px; padding: 2px; border: #666 1px solid; background: #eee; color: #333; font-size: 12px; line-height: 13px; z-index: 2; }
		.trustScore .trustBreakdown div { white-space: nowrap; }

/* Login Box, Document Box, Message Box, Help Box & Cover Page
   ========================================================================== */

#coverpage { position: fixed; top: 0; right: 0; bottom: 0; left: 0; display: none; background: #000; opacity: 0.7; z-index: 999; }
#loginBox { position: fixed; top: 0; left: 50%; display: none; width: 300px; margin: 16px 0 0 -150px; padding: 16px; border-radius: 5px; background: #eee; z-index: 1000; }
	#loginBox a:not(.button) { color: #666; text-decoration: underline; }
	#loginBox input[type="text"],
	#loginBox input[type="password"] { display: block; width: 80%; margin: 0 auto; color: #222; }
	#loginBoxClose { position: absolute; top: 5px; right: 5px; display: block; cursor: pointer; }
#messageBox { display: none; position: fixed; z-index: 1001; top: 15px; left: 50%; padding: 7px 10px; background: #f1f1f1; border: rgb(29, 49, 55) 1px solid; }
	#mBoxClose { position: absolute; top: -12px; right: -12px; padding: 4px; font-size: 14px; line-height: 1em;}
#documentBox { display: none; position: fixed; z-index: 1000; top: 5%; left: 50%; width: 96%; padding: 10px; background: #333; }
@media (min-width: 659px) { #documentBox { width: 659px; margin-left: -368px; } }
	#dBoxTitle { min-height: 38px; padding: 5px 60px 5px 5px; font-size: 1.3em; line-height: 28px; font-weight: bold; background: #454545; color: #fff; }
		#dBoxTitleMenu { font-size: 15px; line-height: 1em; font-weight: normal; }
	#dBoxClose { position: absolute; top: 15px; right: 15px; }
	#dBoxDoc { max-height: 400px; background: #ffffff; overflow: auto; padding: 0 5px; }
	#dBoxAside { display: none; position: absolute; top: 40px; right: -346px; width: 336px; max-height: 350px; background: #ffffff; overflow-y: auto; padding: 0 5px; border: #1d3137 10px solid; border-left: 0; border-radius: 4px; }
#helpBox { display: none; position: absolute; z-index: 10000; top: 0; left: 0; padding: 5px; background: #f6f6f6; border: rgb(29, 49, 55) 1px solid; box-shadow: 0px 0px 2px #888; font: 0.8em/0.8em; }
#signupBox { position: fixed; top: 0; left: 50%; display: none; width: 442px; margin: 16px 0 0 -221px; padding: 16px; border-radius: 5px; background: #f1f1f1; color: #000; z-index: 1000; }
	#signupBox input[type="text"],
	#signupBox input[type="password"],
	#signupBox input[type="email"] { display: block; width: 80%; margin: 0 auto; color: #000; }
	#signupBox .signupRow { display: block; margin: 15px 0; line-height: 1.1em; }
	#signupBoxClose { position: absolute; top: 5px; right: 5px; display: block; cursor: pointer; }

/* Header
   ========================================================================== */

header { display: block; width: 100%; height: 44px; padding: 4px; background: #454545; color: #fff; z-index: 1; font-size: 24px; line-height: 36px; }
@media (min-width: 1024px) { header { height: 100px; background: #fff; } }
	.headerContainer { position: relative; display: block; width: 100%; max-width: 1280px; height: 36px; margin: 0 auto; padding-left: 40px; }
	@media (min-width: 1024px) { .headerContainer { height: 100%; padding-left: 205px; } }
		#headerLogo { display: inline-block; height: 100%; margin-top: -2px; vertical-align: middle; }
		@media (min-width: 1024px) { #headerLogo { position: absolute; top: 0; left: 0; height: 132px; margin-top: 0; z-index: 2; } }
			#headerLogo img { height: 100%; }
		#headerLogoText { display: none; height: 100%; margin-top: -2px; margin-right: 10px; vertical-align: middle; }
		@media (min-width: 768px) { #headerLogoText { margin-right: 5px; } }
		#headerCategory { display: none; }
		@media (min-width: 768px) { #headerCategory { display: inline-block; vertical-align: middle; color: #fff; font-size: 25px; line-height: 1em; } }
			@media (min-width: 768px) { #headerCategory a { color: #fff; text-decoration: none; } }
			@media (min-width: 768px) { #headerCategory a:hover{ color: #fff; text-decoration: none; } }
		@media (min-width: 1024px) { #headerCategory { vertical-align: -15px; color: #454545; font-size: 40px; } }
			@media (min-width: 1024px) { #headerCategory a { color: #454545; } }
			@media (min-width: 1024px) { #headerCategory a:hover{ color: #454545; } }
		@media (min-width: 480px) { #headerLogoText { display: inline-block; } }
		@media (min-width: 1024px) { #headerLogoText { margin-top: 30px; } }
			#headerLogoText img { max-height: 57px; height: 100%; }
		#headerNavButton { position: absolute; top: 0; left: 0; display: block; width: 36px; height: 36px; padding: 4px 0 8px; text-align: center; line-height: 24px; }
		@media (min-width: 1024px) { #headerNavButton { display: none; } }
		#headerMemberButton { position: absolute; top: 0; right: 0; display: block; width: 36px; height: 36px; padding: 4px 0 8px; text-align: center; line-height: 24px; }
		@media (min-width: 1024px) { #headerMemberButton { display: none; } }
		#headerSearchLoadButton { position: absolute; top: 0; right: 36px; display: block; width: 36px; height: 36px; padding: 4px 0 8px; text-align: center; font-size: 20px; line-height: 24px; }
		@media (min-width: 1024px) { #headerSearchLoadButton { display: none; } }
		#headerSearch { display: none; position: absolute; top: 0; right: 36px; width: 0; padding: 0 2px 0 10px; background: #454545; z-index: 1000; }
		@media (min-width: 1024px) { #headerSearch { display: none; } }
			#headerSearchText { width: 100%; height: 29px; padding-right: 26px; color: #000; z-index: 1; }
			#headerSearchButton { position: absolute; top: 0; right: 3px; display: block; margin: 0; padding: 5px 4px 3px; border: 0; background: 0; color: #444; font-size: 18px; line-height: 27px; z-index: 2; }

nav { position: absolute; top: 0; left: 0; display: none; width: 50%; max-width: 200px; min-height: 100%; padding: 10px; background: #454545; color: #fff; z-index: -1; }
@media (min-width: 1024px) { nav { position: static; display: block; width: 100%; max-width: none; padding: 0; border-top: #000 1px solid; border-bottom: #000 1px solid; z-index: 1; } }
	#navContainer { position: relative; max-width: 1280px; margin: 0 auto; }
	@media (min-width: 1024px) { #navContainer { height: 35px; padding-left: 205px; } }
		nav a, nav .clickable { display: block; padding: 5px; color: #fff; text-decoration: none; }
		nav a:hover, nav .clickable:hover { color: #fff; text-decoration: none; }
		@media (min-width: 1024px) { nav a, nav .clickable { display: inline-block; margin-right: 15px; padding: 0; color: #e1e1e1; font-size: 18px; line-height: 35px; } }
		.nav1280 { display: block; }
		@media (min-width: 1024px) { .nav1280 { display: none; } }
		@media (min-width: 1280px) { .nav1280 { display: inline-block; } }
		#navMoreButton { display: none; }
		@media (min-width: 1024px) { #navMoreButton { display: inline-block; font-size: 18px; line-height: 35px; } }
		#navMoreNav { display: block; background: #454545; padding: 0 5px; }
		@media (min-width: 1024px) { #navMoreNav { position: absolute; top: 35px; left: 690px; display: none; padding: 5px 10px; border: #000 1px solid; border-top: 0; z-index: 2; } }
		@media (min-width: 1280px) { #navMoreNav { left: 890px; } }
			#navMoreNav a { display: block; margin: 0; padding: 0; line-height: 30px; }
			#navMoreNav .nav1280 { display: none; }
			@media (min-width: 1024px) { #navMoreNav .nav1280 { display: block; } }
			@media (min-width: 1280px) { #navMoreNav .nav1280 { display: none; } }
		#navSearch { display: none; }
		@media (min-width: 1024px) { #navSearch { position: absolute; top: 0; right: 0px; display: block; width: 175px; height: 35px; padding: 3px 3px; } }
		@media (min-width: 1280px) { #navSearch { width: 220px; } }
			#navSearchText { width: 100%; height: 29px; padding-right: 26px; color: #222; z-index: 1; }
			@media (min-width: 1024px) { #navSearchText { } }
			#navSearchButton { display: inline-block; margin: 0; padding: 5px 4px 3px; border: 0; background: 0; color: #444; font-size: 18px; line-height: 27px; z-index: 2; }
			@media (min-width: 1024px) { #navSearchButton { position: absolute; top: 3px; right: 3px; display: block; paddding: 8px 4px 0; line-height: 21px; } }

#memberNav { position: absolute; top: 0; right: 0; display: none; width: 50%; max-width: 200px; min-height: 100%; padding: 10px; background: #000; color: #fff; z-index: -1; }
@media (min-width: 1024px) { #memberNav { position: static; display: block; width: 100%; max-width: none; padding: 0; border-bottom: #000 1px solid; font-size: 14px; line-height: 30px; z-index: 1; } }
	#memberNavContainer { position: relative; max-width: 1280px; margin: 0 auto; }
	@media (min-width: 1024px) { #memberNavContainer { height: 30px; } }
		#memberNav a, #memberNav .clickable { position: relative; display: block; padding: 0 5px; line-height: 30px; color: #fff; text-decoration: none; vertical-align: top; }
		#memberNav a:hover, #memberNav .clickable:hover { background: #303030; color: #fff; text-decoration: none; }
		@media (min-width: 1024px) { #memberNav a, #memberNav .clickable { display: inline-block; padding: 0 5px; color: #fff; } }
		.memberNavIcon { display: inline-block !important; width: 35px; font-size: 16px; text-align: center; }
		.memberNavItemCount { position: absolute; top: 1px; right: 0; display: block; padding: 2px; border-radius: 3px; background: #d70000; font-size: 13px; line-height: 13px; font-weight: bold; z-index: 1; }
		.memberNavHeading { display: block; padding: 5px; background: #303030; text-align: center; }
		@media (min-width: 1024px) { .memberNavHeading { display: none; background: none; text-align: left; } }
		#memberNavLeft { position: relative; display: block; text-align: center; }
		@media (min-width: 1024px) { #memberNavLeft { float: left; text-align: left; } }
		#memberNavRight { position: relative; }
		@media (min-width: 1024px) { #memberNavRight { float: right; } }
			#memberNavAdminButton { position: relative; cursor: auto; }
			@media (min-width: 1024px) { #memberNavAdminButton { display: inline-block !important; cursor: pointer; } }
			#memberNavAdminNav { display: block; padding: 0; }
			@media (min-width: 1024px) { #memberNavAdminNav { position: absolute; top: 30px; right: 388px; display: none; padding: 5px 10px; background: #000; z-index: 2 } }
				#memberNavAdminNav a { display: block; margin: 0; padding: 0 5px; line-height: 30px; }
				#memberNavAdminNav hr { margin: 0; }
			#memberNavAccountButton { position: relative; cursor: auto; background: #303030; text-align: center; }
			@media (min-width: 1024px) { #memberNavAccountButton { display: inline-block !important; cursor: pointer; background: none; text-align: left; } }
			#memberNavAccountNav { display: block; }
			@media (min-width: 1024px) { #memberNavAccountNav { position: absolute; top: 30px; right: 0px; display: none; padding: 5px 10px; background: #000; z-index: 2; } }
				#memberNavAccountNav a { display: block; margin: 0; padding: 0 5px; line-height: 30px; }
				#memberNavAccountNav hr { margin: 0; }

#headerUserNav { position: absolute; top: 60px; right: 2.125rem; display: none; background: #364F61; color: #fff; z-index: 1; }
@media (min-width: 40rem) { #headerUserNav { right: -0.3125rem; } }
	#headerUserNav a { display: block; margin: 5px; color: #fff; text-decoration: none; white-space: nowrap; }
	#headerUserNav a:hover { color: #FAEBA9; text-decoration: none; }

.nav2 { display: block; width: 100%; margin: -0.75rem 0 0.75rem; padding: 0.75rem 0.3125rem; background: #eee; }
.nav2Container { position: relative; display: block; margin: 0 auto; max-width: 82rem; }
	.nav2Container h1 { display: block; margin: 0; padding: 0; vertical-align: bottom; font-size: 1.5rem; line-height: 1.5rem; text-align: center; font-variant: small-caps; }
	@media (min-width: 40rem) { .nav2Container h1 { display: inline-block;font-size: 2.0rem; line-height: 2.0rem; } }
	@media (min-width: 50rem) { .nav2Container h1 { font-size: 2.5rem; line-height: 2.5rem; } }
	.nav2ContainerSubCats { display: inline-block; margin-left: 1rem; }
		.nav2ContainerSubCats a { display: inline-block; margin: 0 0.5rem; }

/* Footer
   ========================================================================== */

footer { display: block; width: 100%; padding: 4px; background: #454545; font-size: 0.75rem; }
	.footerContainer { position: relative; display: block; width: 100%; max-width: 1280px; margin: 0 auto; }
	@media (min-width: 1024px) { .footerContainer { } }
		.footerBox { margin-bottom: 4px; padding-bottom: 4px; border-bottom: #777 1px solid; }
		.footerBox:last-of-type { margin-bottom: 0; padding-bottom: 0; border-bottom: 0; }
			.footerBox b { display: block; min-width: 7rem; color: #ffffff; font-size: 1.1rem; white-space: nowrap}
			.footerBox a { display: inline-block; padding: 2px; margin-right: 0.5rem; color: #fff; }
#footer2 { display: block; width: 100%; padding: 4px; background: #000; color: #fff; text-align: center; font-size: 0.75rem; line-height: 1rem; }
	#footer2 a { color: #fff; text-decoration: underline; display: inline-block; margin: 0 0.25rem; }

/* Account Settings
   ========================================================================== */

.accountSettingsListSelectorBox { display: block; margin: 0 0 10px; padding: 5px 6px; background: #eee; color: #444; font-size: 80%; line-height: 1em; text-align: center; }
@media (min-width: 600px) { .accountSettingsListSelectorBox { text-align: left; } }
	.accountSettingsListSelectorTitle { display: block; margin: 0 0 5px 0; text-align: center; font-weight: bold; }
	@media (min-width: 600px) { .accountSettingsListSelectorTitle { display: inline-block; margin: 0 5px 0 0; text-align: left; } }
	.accountSettingsListSelectorBox input[type="radio"] { display: none; }
	.accountSettingsListSelectorBox label { display: inline-block; margin: 0 2px; padding: 3px 6px; border-radius: 3px; white-space: nowrap; text-align: center; cursor: pointer; }
	.accountSettingsListSelectorBox label.accountSettingsListSelectorSelected { background: #666; color: #eee; }
		.accountSettingsListSelectorBox label .accountSettingsListSelectorLong { display: none; }
		@media (min-width: 1024px) { .accountSettingsListSelectorBox label .accountSettingsListSelectorLong { display: inline; } }

.accountSettingsList { display: none; max-width: 800px; margin: 0 auto; }
	.accountSettingList { display: block; padding: 2px; border-bottom: #ccc 1px solid; font-size: 0; }
		.accountSettingListTitle { display: inline-block; width: 25%; font-size: 1rem; font-weight: bold; vertical-align: top; }
		@media (min-width: 480px) { .accountSettingListTitle { width: 33%; } }
		@media (min-width: 600px) { .accountSettingListTitle { width: 50%; } }
		.accountSettingListValue { display: inline-block; width: 75%; font-size: 1rem; text-align: right; }
		@media (min-width: 480px) { .accountSettingListValue { width: 67%; } }
		@media (min-width: 600px) { .accountSettingListValue { width: 50%; } }
			.accountSettingListValue button { display: inline-block; margin-left: 20px; vertical-align: baseline; }
		.accountSettingListEditBox { display: none; width: 100%; margin-top: 2px; padding: 15px; background: #eee; font-size: 1rem; }
			.accountSettingListEditBoxEntry { display: block; margin: 5px 0; font-size: 0; }
				.accountSettingListEditBoxEntryTitle { display: block; font-size: 1rem; font-weight: bold; vertical-align: top; }
				@media (min-width: 768px) { .accountSettingListEditBoxEntryTitle { display: inline-block; width: 25%; padding-right: 10px; text-align: right; } }
				.accountSettingListEditBoxEntryInput { display: block; font-size: 1rem; }
				@media (min-width: 768px) { .accountSettingListEditBoxEntryInput { display: inline-block; width: 75%; } }
					.accountSettingListEditBoxEntryInput input { max-width: 100%; vertical-align: middle; }
					.accountSettingListEditBoxEntryInput input[type="text"],
					.accountSettingListEditBoxEntryInput input[type="password"],
					.accountSettingListEditBoxEntryInput input[type="email"] { width: 75%; min-width: 260px; } 
					.accountSettingListEditBoxEntryInput input[type="radio"] { cursor: pointer; } 
					.accountSettingListEditBoxEntryInput label { padding-left: 5px; vertical-align: middle; cursor: pointer; } 
					.accountSettingListEditBoxEntryInput textarea { width: 100%; height: 200px; resize: vertical; } 
					.accountSettingListEditBoxEntryInput small { display: block; width: 75%; min-width: 260px; max-width: 100%; margin: 5px 0; } 
				.accountSettingListEditBoxEntryFull { display: block; font-size: 1rem; text-align: center; }
					.accountSettingListEditBoxEntryFull input { max-width: 100%; vertical-align: middle; }
					.accountSettingListEditBoxEntryFull input[type="radio"] { cursor: pointer; } 
					.accountSettingListEditBoxEntryFull label { padding-left: 5px; vertical-align: middle; cursor: pointer; } 
			.accountSettingListEditBoxButtons { display: block; margin: 5px 0; text-align: center; }

/* Account Signatures
   ========================================================================== */

.accountSignaturesList { display: none; max-width: 800px; margin: 0 auto; }
	.accountSignatureList { display: block; padding: 2px; border-bottom: #ccc 1px solid; font-size: 0; }
		.accountSignatureListDisplayBox { display: block; width: 100%; margin-top: 2px; padding: 15px; font-size: 1rem; }
			.accountSignatureListDisplayBoxTitle { display: block; font-weight: bold; }
			.accountSignatureListDisplayBoxButtons { display: block; margin: 10px 0 0; text-align: center; }
		.accountSignatureListEditBox { display: none; width: 100%; margin-top: 2px; padding: 15px; font-size: 1rem; }
			.accountSignatureListEditBoxTitle { display: block; width: 100%; }
			.accountSignatureListEditBoxSignature { display: block; width: 100%; min-height: 78px; resize:vertical; }
			.accountSignatureListEditBoxButtons { display: block; margin: 10px 0 0; text-align: center; }



/* Article
   ========================================================================== */

article { display: block; }

.articleHeadline { position: relative; display: block; width: 100%; margin: 0 auto 16px; }
	.articleHeadlineText { padding: 8px; }
		.articleHeadlineTextContainer { margin: 0 auto; text-align: center; }
		.articleHeadlineText h1 { margin-bottom: 16px; font-weight: normal; font-size: 32px; line-height: 35px; text-align: center; }
		@media (min-width: 1024px) { .articleHeadlineText h1 { font-size: 38px; line-height: 41px; }} 
		.articleHeadlineText .byline { display: inline-block; font-size: 16px; line-height: 1.3em; min-widdth: 184px; vertical-align: middle; }
		@media (min-width: 768px) { .articleHeadlineText .byline { min-width: 0; } }
			.articleHeadlineText .byline .bylineAvatar { float: left; height: 64px; margin-right: 8px; }
			.articleHeadlineText .byline .bylineLink { color: #444; border-bottom: #444 1px dotted; text-decoration: none; line-height: 16px; vertical-align: 4px; }
			.articleHeadlineText .byline .bylineLink:hover { color: #666; border-bottom: #666 1px dotted;}
			.articleHeadlineText .byline .publishDate { display: inline-block; font-size: 12px; line-height: 1em; }
			.articleHeadlineText .byline .bylineSocial { display: inline-block; margin: 0 4px 0 0; width: 20px; height: 20px; background: #bbb; font-size: 12px; line-height: 20px; color: #fff; text-decoration: none; text-align: center; }
			@media (min-width: 768px) { .articleHeadlineText .byline .bylineSocial { display: none; } }
				.articleHeadlineText .byline .bylineSocial span { vertical-align: -1px; }

			.articleHeadlineText .signature { display: block; clear: both; margin: 10px 0; font-size: 14px; line-height: 1.3em; color: #666; hyphens: auto; }
			@media (min-width: 600px) { .articleHeadlineText .signature { hyphens: manual; } }

			.articleHeadlineShares { display: block; margin-top: 16px; font-size: 24px; line-height: 36px; color: #666; font-size: 0; }
			@media (min-width: 600px) { .articleHeadlineShares { display: inline-block; margin-top: 0; margin-left: 16px; vertical-align: middle; } }
				.articleHeadlineShare { position: relative; display: inline-block; width: 48px; height: 48px; margin: 1px 5px 1px 1px; background: #bbb; text-align: center; color: #fff; font-size: 30px; line-height: 48px; text-decoration: none; }
				@media (min-width: 768px) { .articleHeadlineShare { margin-right: 10px; } }
					.articleHeadlineShare span { vertical-align: -3px; }
					.articleHeadlineShareFacebook { background: #5770a6; }
					.articleHeadlineShareGooglePlus { background: #dd4b39; }
					.articleHeadlineShareLinkedIn { background: #02669a; }
					.articleHeadlineSharePinterest { background: #cb0004; }
					.articleHeadlineShareTwitter { background: #55acee; }
						.articleHeadlineShareTwitter .articleHeadlineShareCount { display: none !important; }
					.articleHeadlineShareCount { position: absolute; top: 0; right: 0; display: block; padding: 0 2px; background: rgb(255, 255, 255); background: rgba(255, 255, 255, 0.6); color: #666; font-size: 16px; line-height: 19px; cursor: pointer; }
					.articleHeadlineShare a { display: inline-block; padding: 0 9px; color: #fff; text-decoration: none; line-height: 48px; }
					.articleHeadlineShare a:hover { color: #fff; text-decoration: none; }
				.articleHeadlineShareText { display: inline-block; margin: 1px 8px 1px 1px; font-size: 14px; line-height: 16px; text-align: center; vertical-align: top; }
				@media (min-width: 600px) { .articleHeadlineShareText { margin-left: 8px; margin-right: 8px; padding-left: 16px; border-left: #666 1px solid; } }
				@media (min-width: 768px) { .articleHeadlineShareText { margin-left: 8px; margin-right: 8px; padding-left: 16px; border-left: 0; } }
				.articleHeadlineSharesCount { display: block; color: #08b100; font-size: 32px; line-height: 32px; }
				.articleHeadlineShareLong { display: none; }
				@media (min-width: 480px) { .articleHeadlineShareLong { display: inline-block; } }
				.articleHeadlineShareMore { cursor: pointer; }
				@media (min-width: 480px) { .articleHeadlineShareMore { display: none; } }

.articleTrail { position: relative; display: block; margin: 0 auto; margin-bottom: 1rem; padding: 0 8px; font-size: 12px; color: #666; } 
	.articleTrail a { color: #666; }

.articleBody { position: relative; display: block; margin: 0 auto; padding: 0 8px; } 

	.articleText { }
	@media (min-width: 960px) { .articleText { font-size: 17px; } }
		.articleText h2,
		.articleText h3 { color: #000000; }
		.articleText ul,
		.articleText ol { overflow: hidden; }
		.articleText h1,
		.articleText h2,
		.articleText h3,
		.articleText h4,
		.articleText h5,
		.articleText ol,
		.articleText > div,
		.articleText p,
		.articleText blockquote,
		.articleText ul { margin-left: auto; margin-right: auto; max-width: 728px; }

		.articleText .headerImage { display: none !important; }

		.articleText .articleAmazon { position: relative; max-width: 728px; margin: 0 auto 12px auto; padding: 4px; clear: both; }
			.articleText .articleAmazon .amazonImage { float: left; width: 16%; max-width: 100px; margin: 0 8px 12px 0 !important; }
			@media (min-width: 480px) { .articleText .articleAmazon .amazonImage { margin: 0 16px 12px 0 !important; } }
			.articleText .articleAmazon .amazonBigImage { float: left; width: 25%; max-width: 150px; margin: 0 16px 12px !important; }
			.articleText .articleAmazon .amazonTitle { font-size: 16px; line-height: 12px; text-decoration: none; }
			@media (min-width: 480px) { .articleText .articleAmazon .amazonTitle { font-size: 18px; line-height: 1em; } }
			.articleText .articleAmazon .amazonText { margin: 16px 0 0; font-size: 0.9em; line-height: 1.2em; color: #444; }
			.articleText .articleAmazon .amazonPricing { display: block; clear: both; }
			@media (min-width: 480px) { .articleText .articleAmazon .amazonPricing { display: inline; clear: none; } }
				.articleText .articleAmazon .amazonPricing .amazonRetailPrice { padding: 0 4px 0 0; color: #999; text-decoration: line-through; }
				.articleText .articleAmazon .amazonPricing .amazonBuyNow { float: right; margin-left: 12px; padding: 4px 8px; border-radius: 5px; font-size: 16px; white-space: nowrap; font-weight: bold; background: #fe9900; text-decoration: none; color: #fff; }
				@media (min-width: 480px) { .articleText .articleAmazon .amazonPricing .amazonBuyNow { float: none; } }
				.articleText .articleAmazon .amazonPricing .amazonPriceDate { }

		.articleText .articleBiblio,
		.articleText .showBiblio { color: #666; font-size: 0.9em; vertical-align: super; }

		.articleText img,
		.articleText .articleImage { position: relative; display: block; max-width: 100%; margin: 0 auto; padding: 8px 0; }
			.articleText .articleImage.articleImageLeft { float: left; margin-right: 24px; }
			@media (min-width: 1140px) { .articleText .articleImage.articleImageLeft { margin-left: -4%; } }
			@media (min-width: 1160px) { .articleText .articleImage.articleImageLeft { margin-left: -5%; } }
			@media (min-width: 1180px) { .articleText .articleImage.articleImageLeft { margin-left: -6%; } }
			@media (min-width: 1200px) { .articleText .articleImage.articleImageLeft { margin-left: -7%; } }
			@media (min-width: 1220px) { .articleText .articleImage.articleImageLeft { margin-left: -8%; } }
			@media (min-width: 1240px) { .articleText .articleImage.articleImageLeft { margin-left: -9%; } }
			@media (min-width: 1280px) { .articleText .articleImage.articleImageLeft { margin-left: -10%; } }
			.articleText .articleImage.articleImageRight { float: right; margin-left: 24px; }
			@media (min-width: 1140px) { .articleText .articleImage.articleImageRight { margin-right: -4%; } }
			@media (min-width: 1160px) { .articleText .articleImage.articleImageRight { margin-right: -5%; } }
			@media (min-width: 1180px) { .articleText .articleImage.articleImageRight { margin-right: -6%; } }
			@media (min-width: 1200px) { .articleText .articleImage.articleImageRight { margin-right: -7%; } }
			@media (min-width: 1220px) { .articleText .articleImage.articleImageRight { margin-right: -8%; } }
			@media (min-width: 1240px) { .articleText .articleImage.articleImageRight { margin-right: -9%; } }
			@media (min-width: 1280px) { .articleText .articleImage.articleImageRight { margin-right: -10%; } }
			.articleText .articleImage a { display: block; max-width: 100%; }
			.articleText .articleImage img { margin: 0; padding: 0; }
			.articleText .articleImage .imageCredit { display: block; padding: 2px 0; font-size: 10px; color: #666; word-wrap: break-word; }
				.articleText .articleImage .imageCredit a { color: #666; }
			.articleText .articleImage .imageCaption { display: block; padding: 2px 0; font-size: 0.875rem; color: #666; }
				.articleText .articleImage .imageCaption p { margin: 0.75em auto; }
				.articleText .articleImage .imageCaption p:first-of-type { margin-top: 0; }
				.articleText .articleImage .imageCaption p:last-of-type { margin-bottom: 0; }
			.articleText .articleImage .articleImagePin { position: absolute; right: 0; top: 0; z-index: 1; opacity: 0.5; transition: opacity 0.3s ease-in-out;  }
			.articleText .articleImage:hover .articleImagePin { opacity: 1; }
				.articleText .articleImage .articleImagePin a { display: block; height: 32px; font-size: 16px; line-height: 32px; color: #fff; text-decoration: none; }
				.articleText .articleImage .articleImagePin a:hover { color: #eee; }
				.articleText .articleImage .articleImagePin span[class*='icon-'] { display: inline-block; width: 32px; max-width: 100% !important; height: 32px; margin: 0 !important; padding: 0 !important; font-size: 24px; line-height: 32px; text-align: center; vertical-align: -1px; }
				.articleText .articleImage .articleImagePin span { display: inline-block; max-width: 0; padding-right: 0; vertical-align: top; overflow: hidden; transition: all 0.5s ease-out 0s; }
				.articleText .articleImage .articleImagePin:hover span { max-width: 100px; padding-right: 10px; }

		.articleText .articleMap,
		.articleText .mapBox { position: relative; display: block; width: 100%; height: 0; padding-top: 56.25%; clear: both; }
		.articleText .articleMapMarkers,
		.articleText .mapMarkerBox { display: block; border: #999999 0px solid; background: #fff; }
			.articleText .articleMapMarker,
			.articleText .mapMarkerBox .markerBox { display: block; padding: 8px 10px; border-bottom: #ccc 1px solid; }
			.articleText .articleMapMarkerImage,
			.articleText .mapMarkerBox .markerBox img { display: block; float: left; margin-right: 10px; cursor: pointer; }
				.articleText .articleMapMarkerName,
				.articleText .mapMarkerBox .markerBox .name { display: block; font-weight: bold; }
				.articleText .articleMapMarkerAddress,
				.articleText .mapMarkerBox .markerBox .address { display: block; font-size: 12px; line-height: 19px; color: #666; }

		.articleText .articleRating { margin: 15px 5px; text-align: center; clear: both; }
			.articleText .articleRating img { display: inline-block; margin: 0 !important; padding: 0 2px; vertical-align: text-bottom; }
			.articleText .articleRating span { display: none; }
			.articleText .articleRating .ratingNumber { display: inline; font-family: Arial; font-size: 3em; letter-spacing: -4px; }
				.articleText .articleRating .ratingNumber small { padding-left: 5px; color: #616161; font-size: 0.5em; letter-spacing: 2px; }
				.articleText .articleRating .ratingNumber .ratingFraction { display: inline; margin-left: 1px; font-size: 0.75em; }

		.articleText .articleSlideshow { position: relative; display: block; margin: 15px auto; clear: both; overflow-x: hidden; clear: both; }
			.articleText .articleSlideshowButtons { display: block; margin: 10px 0 20px; padding: 5px; background: #454545; font-size: 1.1em; }
			.articleText .articleSlideshowButtons:first-of-type { display: none; }
				.articleText .articleSlideshowButtons a { color: #fff; text-decoration: none; } 
				.articleText .articleSlideshowButtons img { display: inline-block; margin: 0 !important; padding: 0 !important; }
				.articleText .articleSlideshowButtonsPrevious { float: left; cursor: pointer; }
				.articleText .articleSlideshowButtonsNext { float: right; cursor: pointer; }
			.articleText .articleSlideshowSlide { position: relative; display: block; }
			.articleText .articleSlideshowSlide ~ .articleSlideshowSlide { display: none; }
				.articleText .articleSlideshowSlide .imageCaption,
				.articleText .articleSlideshowSlide .videoCaption,
				.articleText .articleSlideshowSlide .mapCaption { max-width: 728px; color: #222; margin: 12px auto 0; font: 16px/1.5 Helvetica, Arial, sans-serif; }
				@media (min-width: 960px) { .articleText .articleSlideshowSlide .imageCaption, .articleText .articleSlideshowSlide .videoCaption, .articleText .articleSlideshowSlide .mapCaption { font-size: 17px; } }
					.articleText .articleSlideshowSlide .imageCaption a,
					.articleText .articleSlideshowSlide .videoCaption a,
					.articleText .articleSlideshowSlide .mapCaption a { display: inline; }

		.articleText .articleVideo { position: relative; display: block; width: 100%; max-width: 100%; height: 0; margin: 0 0 10px 0; padding-top: 56.25%; clear: both; }
			.articleText .articleVideo iframe,
			.articleText .articleVideo object,	
			.articleText .articleVideo embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
			.articleText .articleVideo .videoCaption { display: block; padding: 2px 0; font-size: 0.875rem; color: #666; }
				.articleText .articleVideo .videoCaption p { max-width: 100%; margin: 0.75em auto; }
				.articleText .articleVideo .videoCaption p:first-of-type { margin-top: 0; }
				.articleText .articleVideo .videoCaption p:last-of-type { margin-bottom: 0; }

	.articleNextArticle { display: block; margin: 0.25em 0; padding: 0.25em 0 0; border-top: #e8e8e8 1px solid; text-align: right; font-size: 1.1em; }

	.articleFooter { display: block; background: #e8e8e8; padding: 10px; text-align: center; }

		.articleFooterFollows { display: block; margin: 12px auto 0; padding-top: 12px; border-top: #ccc 1px solid; font-size: 0; text-align: left; }
		@media (min-width: 480px) { .articleFooterFollows { text-align: center; } }
			.articleFooterFollow { display: inline-block; min-width: 170px; margin-bottom: 12px; padding: 0 10px; font-size: 1rem; text-align: left; }
				.articleFooterFollow .avatar { float: left; margin-right: 10px; width: 50px; height: 50px; background-size: cover; background-repeat: no-repeat; background-position: 50% 50%; }
				.articleFooterFollow .title { font-weight: bold; font-size: 1.1em; text-decoration: none; }

		.articleFooterShares { display: block; margin: 12px auto; font-size: 1rem; line-height: 2rem; color: #666; }
			.articleFooterShare { position: relative; display: inline-block; width: 90px; margin: 0 5px 5px 1px; vertical-align: middle; }
			@media (min-width: 480px) { .articleFooterShare { width: auto; } }
			@media (min-width: 768px) { .articleFooterShare { margin-right: 16px; } }
				.articleFooterShare a,
				.articleFooterShare div { display: block; height: 32px; color: #fff; text-decoration: none; cursor: pointer;}
				.articleFooterShare a:hover,
				.articleFooterShare div:hover { color: #eee; text-decoration: none; }
					.articleFooterShare > a > [class*='icon-'],
					.articleFooterShare > div > [class*='icon-'] { display: inline-block; padding: 0 6px !important; font-size: 20px; line-height: 32px; vertical-align: -1px; }
					.articleFooterShare > a > span,
					.articleFooterShare > div > span { display: inline-block; padding-right: 10px; vertical-align: top; }
				.articleFooterShare > .fb-like { background: linear-gradient(#4c69ba, #3b55a0) repeat scroll 0 0 rgba(0, 0, 0, 0) !important; }
					.articleFooterShare > .fb-like > span { transform: scale(1.5); -ms-transform: scale(1.5); -webkit-transform: scale(1.5); -o-transform: scale(1.5); -moz-transform: scale(1.5); vertical-align: text-bottom !important; }
			.articleFooterShareLong { display: none; }
			@media (min-width: 600px) { .articleFooterShareLong { display: inline-block; } }
			.articleFooterShareMore { cursor: pointer; }
			@media (min-width: 600px) { .articleFooterShareMore { display: none; } }

	.articleBibliography { display: block; margin: 8px 0 0; vertical-align: top; }
		.articleBibliography ol { font-size: 0.9em; }
			.articleBibliography ol li { padding-bottom: 0.3em; }
			.articleBibliography ol li:last-of-type { padding-bottom: 0; }
				.articleBibliography ol li a { text-decoration: none; }

	.articleComments { display: block; margin: 0 0 16px; vertical-align: top; }
		.articleComment { position: relative; display: block; margin: 10px 0; padding: 10px; background: #eee; }
			.articleComment textarea { display: block; width: 100%; height: 100px; padding: 5px; }
			.articleCommentAuthor { display: block; height: 50px; margin: 0 0 10px 0; font-size: 0; overflow: hidden; }
				.articleCommentAuthorImage { display: inline-block; width: 50px; height: 50px; margin: 0 10px 0 0; font-size: 1rem; vertical-align: top; }
				.articleCommentAuthorName { display: inline-block; font-size: 1rem; vertical-align: top; }
			.articleCommentButtons { display: block; margin-top: 10px; text-align: right; }
			.articleCommentDate { display: block; text-align: right; font-size: 12px; line-height: 1em; color: #666; }
			@media (min-width: 480px) { .articleCommentDate { position: absolute; top: 10px; right: 10px; } }
			.articleCommentEdit { display: none; }
				.articleCommentEdit textarea { display: block; width: 100%; height: 100px; padding: 5px; }
				.articleCommentEditButtons { display: block; margin-top: 5px; text-align: right; }
			.articleCommentReply { display: none; margin-top: 10px; padding-top: 10px; border-top: #aaa 1px solid; }
				.articleCommentReplyButtons { display: block; margin-top: 5px; text-align: right; }
			.articleCommentText { display: block; }

	.articleAside { position: relative; display: block; margin-bottom: 10px; padding: 10px; background: #fff; border-width: 1px; border-style: solid; border-color: #e5e6e9 #dfe0e4 #d0d1d5; }
		.articleAside .byline { display: block; font-size: 16px; line-height: 1.3em; text-align: center; }
			.articleAside .byline .bylineAvatar { display: block; width: 96px; height: 96px; margin: 0 auto 5px; }
			.articleAside .byline .bylineLink { color: #444; border-bottom: #444 1px dotted; text-decoration: none; line-height: 16px; }
			.articleAside .byline .bylineLink:hover { color: #666; border-bottom: #666 1px dotted;}
			.articleAside .byline .publishDate { display: inline-block; font-size: 12px; line-height: 1em; }
			.articleAside .byline .bylineSocial { display: inline-block; margin: 0 4px 0 0; width: 20px; height: 20px; background: #bbb; font-size: 12px; line-height: 20px; color: #fff; text-decoration: none; text-align: center; cursor: pointer; }
				.articleAside .byline .bylineSocial span { vertical-align: -1px; }

		.articleAside .signature { display: block; margin: 10px 0; font-size: 14px; line-height: 1.3em; color: #666; hyphens: auto; }
		@media (min-width: 1024px) { .articleAside .signature { hyphens: manual; } }

	#articleAdLeader,
	#articleAdMiddle1, 
	#articleAdMiddle2, 
	#articleAdMiddle3, 
	#articleAdMiddle4, 
	#articleAdMiddle5,
	.articleAdMiddle { display: block; max-width: 300px; margin: 1em -8px; text-align: center; clear: both; overflow-x: hidden; }
	@media (min-width: 336px) { #articleAdLeader, #articleAdMiddle1, #articleAdMiddle2, #articleAdMiddle3, #articleAdMiddle4, #articleAdMiddle5, .articleAdMiddle { max-width: 100%; margin-left: auto; margin-right: auto; }
	@media (min-width: 1299px) { #articleAdLeader, #articleAdMiddle1, #articleAdMiddle2, #articleAdMiddle3, #articleAdMiddle4, #articleAdMiddle5, .articleAdMiddle { max-width: 970px; margin-left: -18px; margin-right: -18px; } }

/* Article Edit
   ========================================================================== */

.htmlModule { display: block; margin: 5px 0; }
	.htmlModule .htmlModuleTitleBar { display: block; padding: 5px 5px 5px 10px; background: #ddd; font-size: 16px; line-height: 25px; font-weight: bold; }
		.htmlModule .htmlModuleTitleBar .formTitle { display: none; width: 350px; }
		.htmlModule .htmlModuleTitleBar .moduleButtons { float: right; }
		.htmlModule .htmlModule .htmlModuleTitleBar { background: #bcbd8c; }
	.htmlModule .htmlModule .imageCaption,
	.htmlModule .htmlModule .videoCaption,
	.htmlModule .htmlModule .mapCaption { color: #222; font: 1rem/1.5333rem Georgia,serif; }
	
.moduleTitle { cursor: text; }
.moduleHelp { padding: 5px; background: #fffdda; }
.moduleChooseImages { }
	.moduleChooseImage { float: left; margin: 2px; height: 110px; border: #fff 5px solid; border-radius: 5px; }
		.moduleChooseImage img { display: inline-block; height: 100px; cursor: pointer; }

#moduleEditBox { }
	#moduleEditBox input,
	#moduleEditBox textarea { display: block; width: 100%; margin: 5px 0; }
	#moduleEditBox .formHeading { font-size: 1.6em; line-height: 1.3em; }
	#moduleEditBox .formSubheading { font-size: 1.4em; line-height: 1.3em; }
	#moduleEditBox .formText { min-height: 100px; }
	#moduleEditBox .formImageCredit { font-size: 10px; line-height: 1.2em; color: #666; }
	#moduleEditBox .formCodeLanguage { margin: 0 0 5px 1px; }
	.moduleEditBoxButtons { display: block; margin: 10px auto; text-align: center; }

.moduleEditBoxSelectorBox { display: block; margin: 0 0 10px; padding: 5px 6px; background: #eee; color: #444; font-size: 80%; line-height: 1em; text-align: center; }
@media (min-width: 600px) { .moduleEditBoxSelectorBox { text-align: left; } }
	.moduleEditBoxSelectorTitle { display: block; margin: 0 0 5px 0; text-align: center; font-weight: bold; }
	@media (min-width: 600px) { .moduleEditBoxSelectorTitle { display: inline-block; margin: 0 5px 0 0; text-align: left; } }
	.moduleEditBoxSelectorGroup { display: inline-block; margin: 2px 0; padding-right: 20px; white-space: nowrap; }
		.moduleEditBoxSelectorBox input[type="radio"] { display: none; }
		.moduleEditBoxSelectorBox label { display: inline-block; margin: 0 2px; padding: 3px 6px; border-radius: 3px; white-space: nowrap; text-align: center; cursor: pointer; }
		.moduleEditBoxSelectorBox label.moduleEditBoxSelectorSelected,
		.moduleEditBoxSelectorBox label.tabSelected { background: #666; color: #eee; }
			.moduleEditBoxSelectorBox label .moduleEditBoxSelectorLong { display: none; }
			@media (min-width: 480px) { .moduleEditBoxSelectorBox label .moduleEditBoxSelectorLong { display: inline; } }

.asideImagesList { width: 100%; overflow-y: scroll; }
	.asideImagesList .imageInsertButton { display: none; }
#dBoxAsideImagesList .imageInsertButton { display: block; } 
#dBoxAsideImagesList .imageFeatureButton,
#dBoxAsideImagesList .imageEditButton,
#dBoxAsideImagesList .imageDeleteButton { display: none; }

.moduleTypeList { margin: 0 0 3px 0; padding: 0 5px 4px 0; border-bottom: #ddd 1px solid; }
	.moduleTypeList button,
	.moduleTypeList span {vertical-align: middle; }

#asideImagesUpload form .imageTitle,
#dBoxAsideImagesUpload form .imageTitle { display: block; width: 310px; }
#asideImagesUpload form .imageCredit,
#dBoxAsideImagesUpload form .imageCredit  { display: block; width: 310px; }
#asideImagesUpload progress,
#dBoxAsideImagesUpload progress { display: none; width: 310px; margin: 5px 0; }
.asideImageList { margin: 0 0 5px 0; padding: 0 0 6px 0; border-bottom: #ddd 1px solid; }
	.asideImageList .asideImage { float: left; max-width: 200px; border: #fff 3px solid; }
	.asideImageList .asideImageFeatured { border: #B1110C 3px solid; }
	.asideImageList .asideImageButtons { float: left; margin-right: 5px; }
		.asideImageList .asideImageButtons button { display: block; min-width: 100px; margin-bottom: 2px; text-align: left; }
		.asideImageList .asideImageButtons .imageInfo { display: block; box-sizing: border-box; min-width: 100px; margin-bottom: 2px; padding: 2px; background: #eee; text-align: left; font-family: arial, sans-serif; font-size: 0.9em; cursor: help; }

.editImage,
.editMedia,
.editVideo,
.editAmazon { box-sizing: border-box; width: 100%; padding: 9px 0; }
	.editImage progress,
	.editMedia progress { display: none; width: 610px; margin: 5px 0; }
	.editImage form .imageTitle, 
	.editMedia form .imageTitle,
	.editVideo .videoURL,
	.editAmazon .amazonURL  { display: block; width: 604px; }
	.editImage form .imageCredit,
	.editMedia form .imageCredit  { display: block; width: 604px; }

.editReference { display: none; width: 610px; padding: 9px; }
	.editReference input,
	.refEditBox input { width: 600px; }

.editError { display: none; width: 600px; margin: 0 auto 10px; padding: 10px; border: #d40000 2px solid; border-radius: 5px; background: #FFF4F4; }

#writeAside { overflow-y: scroll; }
#asideReferences,
#asideMedias { }
	.asideAddModuleType { display: block; margin: 2px 0; padding: 5px; background: #eee; font-size: 1.3em; line-height: 27px; }
		.asideAddModuleType button { float: left; margin-right: 5px; }
	.asideReference { margin-bottom: 8px; border-bottom: #aaa 1px solid; }
	.asideReference:last-of-type { margin-bottom: 0; border-bottom: 0; }
	#asideMedias progress { display: none; width: 295px; margin: 5px 0; }
	#asideMediasUpload .editError { width: 280px; }
		#asideMediasUpload form .imageTitle { width: 290px; }
		#asideMediasUpload form .imageCredit { width: 290px; }
	.asideMedia { display: block; margin: 3px 0 3px; padding: 0 5px 3px; border-bottom: #666 1px solid; }
		.asideMedia img { display: block; float: left; max-width: 190px; margin: 0 10px 0 0; }
		.asideMedia button { display: block; width: 87px; margin: 0 0 5px; text-align: left; }
			.asideMedia button img { display: inline; float: none; margin: 0; }

/* Contest
   ========================================================================== */

.contestHeadline { position: relative; display: block; width: 100%; margin: -0.75rem auto 2rem; padding: 0.5rem; background: #eeeeee; }
	.contestHeadlineContainer { max-width: 74.75rem; margin: 0 auto; }
		.contestHeadlineContainer h1 { margin-bottom: 1rem; font-weight: normal; font-size: 2rem; line-height: 2.2rem; text-align: center; }
		@media (min-width: 62.3125rem) { .contestHeadlineContainer h1 { font-size: 2.4rem; line-height: 2.6rem; }} 

.contestInput { display: block; max-width: 38.5rem; margin: 0.75rem auto 0; padding: 0.75rem 0 0 0; border-top: #ddd 1px solid; }
	.contestInput .contestInputName { font-weight: bold; }
.contestButtons { display: block; text-align: center; margin: 0.75rem 0 0 0; padding: 0.75rem 0 0 0; border-top: #ddd 1px solid; }

/* Earnings
   ========================================================================== */

.earningsSummary { float: left; width: 100%; margin: 0 0 10px; } 
@media (min-width: 600px) { .earningsSummary { width: 50%; margin: 0; padding: 0 10px; } }
	.earningsSummaryTitle { display: block; margin: 0; padding: 0; vertical-align: top; }
	.earningsSummaryPeriod { display: block; block; margin-bottom: 10px; padding: 0 10px; vertical-align: top; font-size: 0.8em; white-space: nowrap; }
	@media (min-width: 480px) { .earningsSummaryPeriod { display: inline-block; } }
	@media (min-width: 600px) { .earningsSummaryPeriod { display: block; margin-bottom: 10px; } }
	@media (min-width: 1024px) { .earningsSummaryPeriod { display: inline-block; } }
		.earningsSummaryPeriod small { padding-left: 10px; }

/* Forum
   ========================================================================== */

.forumTrail { display: block; margin: 0 0 10px; padding: 0 0; font-size: 12px; color: #666; } 
	.forumTrail a { color: #666; }

.forumTitle { position: relative; display: block; padding-left: 22px; }
	.forumtopicSubscribe { position: absolute; top: 2px; left: 0; font-size: 16px; font-weight: normal; }

/* Member
   ========================================================================== */

.memberHeader { position: relative; display: block; margin: 0 0 15px 0; }
	.memberCover { position: relative; display: block; width: 100%; padding-top: 35%; }
		.memberCoverImage { position: absolute; top: -10px; right: -10px; bottom: 0; left: -10px; background-size: cover; background-repeat: no-repeat; background-position: 50% 50%; content: " "; z-index: 1; }
		.memberAvatar { position: absolute; bottom: -48px; display: block; float: left; width: 33%; max-width: 256px; vertical-align: top; z-index: 3; }
		@media (min-width: 480px) { .memberAvatar { bottom: -29px; } }
		@media (min-width: 600px) { .memberAvatar { bottom: -66px; } }
		@media (min-width: 768px) { .memberAvatar { bottom: -71px; } }
		@media (min-width: 1024px) { .memberAvatar { bottom: -77px; } }
			.memberAvatarFrame { position: relative; width: 100%; padding-top: 100%; border: #888 1px solid; border-radius: 5px; }
				.memberAvatarImageContainer { position: absolute; top: 0; right: 0; bottom: 0; left: 0; border: #fff 4px solid; border-radius: 3px; background-color: #ddd; text-align: center; font-size: 0; }
				@media (min-width: 480px) { .memberAvatarImageContainer { border: #fff 6px solid; border-radius: 4px; } }
				@media (min-width: 600px) { .memberAvatarImageContainer { border: #fff 8px solid; border-radius: 5px; } }
					.memberAvatarImageAligner { display: inline-block; height: 100%; vertical-align: middle; }
					.memberAvatarImage { display: inline-block; vertical-align: middle; border-radius: 5px; }
		.memberCoverContactButtons { position: absolute; bottom: 5px; right: -5px; z-index: 2; }
			.memberCoverContactButton { display: inline-block; }
		.memberStats { position: absolute; top: -10px; right: -10px; left: -10px; background: rgb(255, 255, 255); background: rgba(255, 255, 255, 0.9); text-align: center; z-index: 2; font-size: 0; }
		@media (min-width: 1024px) { .memberStats { top: auto; sright: auto; bottom: 0; left: 33%; text-align: left; } }
		@media (min-width: 1124px) { .memberStats { left: 256px; } }
			.memberStat { display: inline-block; padding: 2px 10px; font-size: 0.9rem; line-height: 1.1em; text-align: center; }
			.memberStatAll { display: none; }
			@media (min-width: 480px) { .memberStatAll { display: inline-block; } }			
				.memberStat b { display: block; font-size: 0.8em; color: #777; text-transform:uppercase; font-wefight: normal; }
	.memberText { display: block; }
		.memberName { display: block; margin: 0 0 0; margin-left: 33%; padding-left: 15px; }
		@media (min-width: 600px) { .memberName { font-size: 1.5rem; } }
		@media (min-width: 768px) { .memberName { font-size: 1.75rem; } }
		@media (min-width: 1024px) { .memberName { font-size: 2rem; } }
		@media (min-width: 1124px) { .memberName { margin-left: 256px; } }
			.memberAchievementScore { display: block; vertical-align: middle; font-size: 1rem; font-weight: normal; cursor: help; }
			@media (min-width: 480px) { .memberAchievementScore { display: inline-block; white-space: nowrap; padding-left: 5px; } }
			.memberFriendship { display: inline-block; vertical-align: middle; font-size: 1rem; font-weight: normal; cursor: help; }
			@media (min-width: 480px) { .memberFriendship { white-space: nowrap; padding-left: 5px; } }
		.memberSite { display: block; margin-left: 33%; padding-left: 15px; font-size: 0.8em; line-height: 1em; margin-bottom: 8px; }
		@media (min-width: 1124px) { .memberSite { margin-left: 256px; } }
			.memberSite a { color: #666; }
			.memberSite a:hover { color: #666; }
		.memberSocial { display: block; margin: 0 0 15px; clear: both; text-align: center; }
		@media (min-width: 600px) { .memberSocial { margin-left: 33%; padding-left: 15px; clear: none; text-align: left; } }
		@media (min-width: 1124px) { .memberSocial { margin-left: 256px; } }
			.memberSocialFacebook { display: inline-block; margin: 0 10px 0 0; vertical-align: top; }
			.memberSocialGoogle { display: inline-block; margin: 4px 10px 0 0; vertical-align: top; }
			.memberSocialInfoBarrel { display: inline-block; margin: 4px 10px 0 0; vertical-align: top; }
			.memberSocialTwitter { display: inline-block; margin: 4px 10px 0 0; vertical-align: top; }
			.memberSocialLinkedIn { display: inline-block; margin: 4px 10px 0 0; vertical-align: top; font-size: 0.8em; }
		.memberBio { display: block; }
			@media (min-width: 600px) { .memberBio { font-size: 1.0625rem; } }
			@media (min-width: 1024px) { .memberBio { font-size: 1.125rem; } }

/* Notifications
   ========================================================================== */
.notifications { display: block; }
.notification { display: block; margin-bottom: 10px; padding-bottom: 10px; border-bottom: #aaa 1px solid; }
main .notification { margin-bottom: 10px; padding-bottom: 10px; border-bottom: #aaa 1px solid; }
main .notification:last-of-type { margin-bottom: 0; padding-bottom: 0; border-bottom: 0; }
#contentBox > .notifications > .notification,
#contentBox > .notification { position: relative; display: block; max-width: 972px; padding: 10px; background: #fff; border-width: 1px; border-style: solid; border-color: #e5e6e9 #dfe0e4 #d0d1d5; }
	.notificationHeading { display: block; height: 45px; margin-bottom: 5px; padding-bottom: 5px; border-bottom: #ddd 1px solid; font-size: 0; line-height: 0 }
		.notificationHeadingImage { display: inline-block; width: 40px; height: 40px; margin-right: 10px; background-size: cover; background-repeat: no-repeat; background-position: 50% 50%; vertical-align: top; }
		.notificationHeadingText { display: inline-block; height: 40px; vertical-align: top; font-size: 0; line-height: 0; }
			.notificationHeadingDate { display: inline-block; font-size: 13px; line-height: 1.7em; color: #888; vertical-align: top; }
			.notificationHeadingTitle { display: inline-block; font-size: 18px; line-height: 1em; vertical-align: top; }
				.notificationHeadingTitle a { color: #222; text-decoration: none; }
				.notificationHeadingTitleTo { color: #666 }
	.notificationText { display: block; }
		.notificationAvatar { float: left; display: block; width: 100px; height: 100px; margin-right: 10px; background-size: cover; background-repeat: no-repeat; background-position: 50% 50%; background-color: #ddd; }
		.notificationButtons { display: block; width: 150px; white-space: nowrap; }
		.notificationTitle + .notificationButtons,
		.notificationTitle + br + .notificationButtons { margin-top: 0.5em; }
		.notificationImageContainer { display: block; float: left; width: 33%; margin: 0 10px 0 0; }
			.notificationImage { position: relative; display: block; width: 100%; height: 0; overflow: hidden; }
			.notificationImageContainer .notificationImage { padding-top: 75%; }
				.notificationImage .imageBox { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-size: cover; background-repeat: no-repeat; background-position: 50% 50%; z-index: 1; }
				.notificationImage .trustScore { position: absolute; right: 4px; bottom: 4px; font-size: 1.1em; z-index: 2; }
					.notificationImage .trustScore .trustBreakdown { top: auto; right: 10px; bottom: 0px; left: auto; }
		.notificationSummary { }
		.notificationTitle + .notificationSummary,
		.notificationTitle + br + .notificationSummary { margin-top: 0.5em; }
		.notificationTitle { padding-bottom: 10px; font-size: 18px; line-height: 1em; color: #222; text-decoration: none; }
		@media (min-width: 480px) { .notificationTitle { font-size: 22px; font-weight: bold;} }
		@media (min-width: 800px) { .notificationTitle { font-size: 24px; } }

/* Payments
   ========================================================================== */

.paymentsSummary { float: left; width: 100%; margin: 0 0 10px; } 
	.paymentsSummaryEntry { display: block; margin: 0 0 10px; padding: 0 10px; vertical-align: top; }
	@media (min-width: 480px) { .paymentsSummaryEntry { display: inline-block; margin-bottom: 0; } }
		.paymentsSummaryEntry small { padding-left: 10px; }
		
/* PM Thread
   ========================================================================== */

.privateMessagesThread { display: block; }
	.privateMessageThread { display: block; margin: 0 0 10px; padding: 0 0 10px; border-bottom: #ddd 1px solid; }
		.privateMessageThreadHeader { display: block; background: #eee; margin-bottom: 10px; padding: 5px; }
			.privateMessageThreadAvatar { height: 32px; vertical-align: top; }
			.privateMessageThreadMember { text-decoration: none; }
			.privateMessageThreadDate { float: right; margin-left: 10px; }
		.privateMessageThreadBody { display: block; }
	.privateMessagesThreadReply { display: block; }
		.privateMessagesThreadReply input[type='text'] { width: 100%; }
		.privateMessagesThreadReply textarea { width: 100%; height: 150px; }
		@media (min-width: 600px) { .privateMessagesThreadReply textarea { height: 200px; } }

/* References
   ========================================================================== */
.referencesList { display: block; }
	.referenceList { display: block; padding: 8px 0; font-size: 0; }
		.referenceButtons { display: block; clear: both; font-size: 1rem; vertical-align: top; }
		.referenceNumber { display: inline-block; margin-right: 10px; font-size: 1rem; vertical-align: top; }
		.referenceText { display: inline-block; font-size: 1rem; vertical-align: top; }



/* Signup
   ========================================================================== */

.signupLabel { display: block; vertical-align: top; }
@media (min-width: 60rem) { .signupLabel { display: inline-block; width: 140px; margin-right: 10px; text-align: right; } }
.signupNotes { display: block; color: #666; }
@media (min-width: 60rem) { .signupNotes { margin-left: 155px; width: 300px; } }
.signupInput { display: block; width: 270px; }
@media (min-width: 60rem) { .signupInput { display: inline-block; width: 300px; } }
.signupTextarea { display: block; width: 270px; height: 100px; }
@media (min-width: 60rem) { .signupTextarea { display: inline-block; width: 300px; } }

/* List Containers
   ========================================================================== */

.achievementsList { display: block; margin: 10px 0; }
	.achievementList { display: block; margin-bottom: 5px; padding-bottom: 5px; border-bottom: 1px solid; font-size: 0; }
		.achievementText { display: inline-block; padding: 5px; font-size: 1rem; vertical-align: top; }
		.achievementThumbnail { position: relative; display: inline-block; width: 60px; padding: 5px; cursor: help; font-size: 1rem; vertical-align: top; }
			.achievementThumbnailLevel { position: absolute; bottom: 7px; right: 0; left: 0; text-align: center; font-size: 14px; line-height: 1.2em; font-weight: bold; }
				.achievementThumbnailLevel span { display: inline-block; min-width: 20px; border-radius: 10px; background: #fff; color: #666; }
			.achievementThumbnailText { position: absolute; top: 0; right: 65px; border: #888 2px solid; background: #fff; padding: 5px; display: none; font-size: 12px; z-index: 10; }
			.achievementThumbnailText { position: absolute; top: 0; right: 65px; border: #888 2px solid; background: #fff; padding: 5px; display: none; font-size: 12px; z-index: 10; }

.activityListSelectorBox { display: block; margin: 0 0 10px; padding: 5px 6px; background: #eee; color: #444; font-size: 80%; line-height: 1em; text-align: center; }
@media (min-width: 600px) { .activityListSelectorBox { text-align: left; } }
	.activityListSelectorTitle { display: block; margin: 0 0 5px 0; text-align: center; font-weight: bold; }
	@media (min-width: 600px) { .activityListSelectorTitle { display: inline-block; margin: 0 5px 0 0; text-align: left; } }
	.activityListSelectorGroup { display: inline-block; margin: 2px 0; padding-right: 20px; white-space: nowrap; }
		.activityListSelectorBox input[type="radio"] { display: none; }
		.activityListSelectorBox label { display: inline-block; margin: 0 2px; padding: 3px 6px; border-radius: 3px; white-space: nowrap; text-align: center; cursor: pointer; }
		.activityListSelectorBox label.activityListSelectorSelected { background: #666; color: #eee; }
			.activityListSelectorBox label .activityListSelectorLong { display: none; }
			@media (min-width: 480px) { .activityListSelectorBox label .activityListSelectorLong { display: inline; } }

.adminMonthliesList { display: block; margin: 25px 0 15px; }
	.adminMonthliesListHeading { font-weight: bold; }
	.adminMonthliesListHeading:hover { background: initial !important; }
		.adminMonthliesListHeading span[class^='icon-arrow-'] { color: #888; }
	.adminMonthlyList { display: block; padding: 2px; border-bottom: #ccc 1px solid; font-size: 0; }
	.adminMonthlyList:hover { background: #eee; }
		.adminMonthlyListCategory { display: inline-block; width: 16%; font-size: 1rem; vertical-align: top;}
		.adminMonthlyListFull { display: block; width: 100%; font-size: 1rem; }
		.adminMonthlyListMetric { display: inline-block; width: 14%; min-width: 75px; padding: 0 5px; font-size: 1rem; text-align: center; }
		.adminMonthlyListExtendedStats { display: none; margin-left: 20px; }

.articlesListSelectorBox { display: block; margin: 0 0 10px; padding: 5px 6px; background: #eee; color: #444; font-size: 80%; line-height: 1em; text-align: center; }
@media (min-width: 600px) { .articlesListSelectorBox { text-align: left; } }
	.articlesListSelectorTitle { display: block; margin: 0 0 5px 0; text-align: center; font-weight: bold; }
	@media (min-width: 1024px) { .articlesListSelectorTitle { display: inline-block; margin: 0 5px 0 0; text-align: left; } }
	.articlesListSelectorBox input[type="radio"] { display: none; }
	.articlesListSelectorBox label { display: inline-block; margin: 0 2px; padding: 3px 6px; border-radius: 3px; white-space: nowrap; text-align: center; cursor: pointer; }
	.articlesListSelectorBox label.articlesListSelectorSelected { background: #666; color: #eee; }
		.articlesListSelectorBox label .articlesListSelectorLong { display: none; }
		@media (min-width: 480px) { .articlesListSelectorBox label .articlesListSelectorLong { display: inline; } }
.articlesList { }
	.articleList { position: relative; display: block; width: 100%; margin: 0 auto 16px; padding: 0 0 16px; border-bottom: #ddd 1px solid; }
		.articleListAside { display: none; float: left; width: 150px; font-size: 80%; line-height: 1.2em; color: #444; }
		@media (min-width: 600px) { .articleListAside { display: block; } }
			.articleListByline { display: block; margin: 0 0 4px; }
			.articleListCategory { display: block; margin: 0 0 4px; padding: 3px; background: #00b5da; color: #fff; font-weight: bold; }
			.articleListDate { display: block; margin: 0 0 4px; }
			.articleListSocials { display: block; margin: 8px 0 5px; text-align: center; font-size: 0; }
				.articleListSocial { display: inline-block; width: 30px; height: 30px; margin: 0 3px; background: #bbb; overflow: hidden; font-size: 18px; line-height: 30px; text-align: center; color: #fff; text-decoration: none; }
				.articleListSocial:hover { color: #fff; } 
					.articleListSocialGooglePlus { padding-top: 3px; }
					.articleListSocialGooglePlus:hover { background: #dd4b39; }
					.articleListSocialGooglePlusActive { background: #dd4b39; }
					.articleListSocialFacebook { padding-top: 2px; }
					.articleListSocialFacebook:hover { background: #5770a6;	}
					.articleListSocialFacebookActive { background: #5770a6;	}
					.articleListSocialPinterest { padding-top: 2px; }
					.articleListSocialPinterest:hover { background: #cb0004; }
					.articleListSocialPinterestActive { background: #cb0004; }
					.articleListSocialTwitter { padding-top: 2px; }
					.articleListSocialTwitter:hover { background: #55acee; }
					.articleListSocialTwitterActive { background: #55acee; }
					.articleListSocialTotal { display: block; margin: 0 8px; color: #666; font-size: 16px; line-height: 1em; text-align: right; }
		.articleListText { display: block; }
		@media (min-width: 600px) { .articleListText { margin-left: 150px; padding-left: 10px; } }
			.articleListImageContainer { display: block; float: left; width: 33%; margin: 0 10px 0 0; }
			.articleListFeatureImageContainer { display: block; width: 100%; margin: 0 0 10px 0; }
				.articleListImage { position: relative; display: block; width: 100%; height: 0; overflow: hidden; }
				.articleListImageContainer .articleListImage { padding-top: 75%; }
				.articleListFeatureImageContainer .articleListImage { padding-top: 41.67%; }
					.articleListImage .imageBox { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-size: cover; background-repeat: no-repeat; background-position: 50% 50%; z-index: 1; }
					.articleListImage .trustScore { position: absolute; right: 4px; bottom: 4px; font-size: 1.1em; z-index: 2; }
						.articleListImage .trustScore .trustBreakdown { top: auto; right: 10px; bottom: 0px; left: auto; }
			.articleListTitle { font-size: 18px; line-height: 1em; color: #222; text-decoration: none; }
			@media (min-width: 480px) { .articleListTitle { font-size: 22px; font-weight: bold;} }
			@media (min-width: 800px) { .articleListTitle { font-size: 24px; } }
			.articleListFeatureTitle { font-size: 20px; line-height: 1em; color: #222; text-decoration: none; }
			@media (min-width: 480px) { .articleListFeatureTitle { font-size: 24px; font-weight: bold; } }
			@media (min-width: 800px) { .articleListFeatureTitle { font-size: 26px; } }
			@media (min-width: 1024px) { .articleListFeatureTitle { font-size: 28px; } }
			@media (min-width: 1280px) { .articleListFeatureTitle { font-size: 32px;  } }
			.articleListBlogTitle { display: block; margin-bottom: 5px; padding-bottom: 5px; border-bottom: #eee 1px solid; font-size: 22px; line-height: 1em; color: #222; text-decoration: none; text-align: center; }
			@media (min-width: 480px) { .articleListBlogTitle { font-size: 24px; font-weight: bold; } }
			@media (min-width: 800px) { .articleListBlogTitle { font-size: 26px; } }
			@media (min-width: 1024px) { .articleListBlogTitle { font-size: 28px; } }
			@media (min-width: 1280px) { .articleListBlogTitle { font-size: 32px;  } }}
			.articleListSummary { display: none; }
			@media (min-width: 480px) { .articleListSummary { display: block; } }
			.articleListButtons { margin-top: 10px; text-align: center; }
			@media (min-width: 480px) { .articleListButtons { margin-top: 0; text-align: right; } }

.articlesRelatedList { font-size: 0; margin: 10px 0; }
	.articlesRelatedList h2 { margin-bottom: 0.5rem; font-size: 1.2rem; }
	.articleRelatedList { position: relative; display: inline-block; width: 33%; min-width: 298px; margin: 0 auto 16px; padding: 0 8px 16px; font-size: 1rem; vertical-align: top; }
		.articleRelatedListImageContainer { display: block; width: 100%; margin: 0 0 10px 0; }
			.articleRelatedListImage { position: relative; display: block; width: 100%; height: 0; padding-top: 56.25%; overflow: hidden; }
				.articleRelatedListImage .imageBox { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-size: cover; background-repeat: no-repeat; background-position: 50% 50%; z-index: 1; }
				.articleRelatedListImage .trustScore { position: absolute; right: 4px; bottom: 4px; font-size: 1.1em; z-index: 2; }
					.articleRelatedListImage .trustScore .trustBreakdown { top: auto; right: 10px; bottom: 0px; left: auto; }
			.articleRelatedListTitle { font-size: 18px; line-height: 1em; color: #222; text-decoration: none; }

.backlinksList { display: block; margin: 25px 0 15px; }
	.backlinksListHeading { font-weight: bold; }
	.backlinksListHeading:hover { background: initial !important; }
		.backlinksListHeading span[class^='icon-arrow-'] { color: #888; }
	.backlinksListTitle { margin: 5px 0 15px 5px; font-size: 1.25em; }
	.backlinksListTools { display: block; padding: 5px 20px; border-width: 1px; border-style: solid; border-color: #888 transparent; background: #ddd; font-size: 0.9em; }
		.backlinksListTools label { display: inline-block; min-width: 38px; white-space: nowrap; }
		@media (min-width: 480px) { .backlinksListTools label { min-width: 0; } }
	.backlinksListToolsBottom { }
	@media (min-width: 600px) { .backlinksListToolsBottom { text-align: right; } }
		.backlinksListToolsDates { display: block; }
		@media (min-width: 1024px) { .backlinksListToolsDates { display: inline-block; margin-right: 50px; } }
		.backlinksListToolsLegend { display: block; }
		@media (min-width: 1024px) { .backlinksListToolsLegend { display: inline-block; } }
		.backlinksListToolsPages { display: block; margin-bottom: 5px; white-space: nowrap; }
		.backlinksListToolsDisavowed,
		.backlinksListToolsNoFollow,
		.backlinksListToolsPage,
		.backlinksListToolsToGet { display: inline-block; width: 45%; white-space: nowrap; text-align: center;}
		@media (min-width: 600px) { .backlinksListToolsDisavowed, .backlinksListToolsNoFollow { width: 200px; } }
		@media (min-width: 600px) { .backlinksListToolsPage, .backlinksListToolsToGet { width: 100px; } }
			.backlinksListToolsPage input { width: 40px; text-align: center; }
			.backlinksListToolsToGet select { text-align: center; }
	.backlinkList { display: block; padding: 2px; border-bottom: #ccc 1px solid; font-size: 0; }
	.backlinkList:hover { background: #eee; }
		.backlinkListCategory { display: inline-block; width: 50%; font-size: 1rem; vertical-align: top;}
		@media (min-width: 480px) { .backlinkListCategory { width: 67%; } }
		@media (min-width: 800px) { .backlinkListCategory { width: 33%; } }
		.backlinkListFull { display: block; width: 100%; font-size: 1rem; }
		.backlinkListMetric { display: inline-block; width: 50%; min-width: 75px; padding: 0 5px; font-size: 1rem; text-align: center; }
		@media (min-width: 480px) { .backlinkListMetric { width: 33%; } }
		@media (min-width: 800px) { .backlinkListMetric { width: 11.16%; padding: 0 10px; vertical-align: top; } }
		.backlinkListExtendedStats { display: none; margin-left: 20px; }

#asideCategoriesList { display: block; margin-bottom: 10px; overflow-x: hidden; }
#mainCategoriesList { display: block; height: 30px; margin-bottom: 10px; overflow: hidden; background: #ddd; }
@media (min-width: 768px) { #mainCategoriesList { display: none; } }
	#mainCategoriesList h3 { display: block; margin: 0; padding: 0 3px; background: #555; color: #fff; text-align: center; cursor: pointer; }
	#mainCategoriesList h3::after { fsloat: right; margin-left: 5px; content: "\25BC"; }
	#mainCategoriesList .categoryList { padding: 0 5px; }
.categoriesList { }
	.categoriesList h3 { margin-bottom: 0; font-size: 16px; line-height: 30px; }
	@media (min-width: 768px) { .categoriesList h3 { font-size: 16px; line-height: 25px; } }
		.categoriesList h3 .narrow { display: inline; }
		@media (min-width: 768px) { .categoriesList h3 .narrow { display: none; } }
		.categoriesList h3 .wide { display: none; }
		@media (min-width: 1024px) { .categoriesList h3 .wide { display: inline; } }
	.categoryList { display: block; font-size: 16px; line-height: 16px; }
	@media (min-width: 768px) { .categoryList { font-size: 14px; line-height: 14px; } }
		.categoryList a { display: block; margin: 4px 0; padding: 4px; color: #666; text-decoration: none; }
		.categoryList a:hover { background: #666; color: #fff; text-decoration: none; }
		.categoryList a.categoryListHighlighted { color: #222; }
		.categoryList a.categoryListHighlighted:hover { background: #666; color: #fff; }
		.categoryList a.categoryListSelected { background: #00b5da; color: #fff; }
		.categoryList .categoriesList { margin-left: 20px; }

.commentsList { display: block; }
	.commentList { position: relative; display: block; margin: 0 0 8px; padding: 0 0 8px; border-bottom: #ddd 1px solid; }
		.commentListMain { }
		@media (min-width: 600px) { .commentListMain { min-height: 178px; margin-left: 210px; } }
			.commentListDate { display: block; text-align: right; color: #444; font-size: 0.8em; }
				.commentListDate a { color: #444; text-decoration: underline; }
				.commentListDate a:hover { color: #444; text-decoration: none; }
			.commentListComment { display: block; }
			.commentListEdit { display: none; }
				.commentListEdit textarea { width: 100%; height: 150px; }
				@media (min-width: 600px) { .commentListEdit textarea { height: 200px; } }
		.commentListAside { display: block; margin-top: 10px; padding: 5px; background: #eee; color: #444; font-size: 0.8em; }
		@media (min-width: 600px) { .commentListAside { position: absolute; top: 0; left: 0; width: 200px; margin-top: 0; padding: 7px 5px 7px; text-align: center; } }
			.commentListAvatar { display: none; }
			@media (min-width: 600px) { .commentListAvatar { display: block; } }
			.commentListByline { }
			.commentListByline:before { content: "Posted by "; }
			@media (min-width: 600px) { .commentListByline:before { content: ""; } }
		.commentListButtons,
		.commentListActivityButtons { display: block; margin: 5px 0; text-align: right; }
		@media (max-width: 479px) { .commentListActivityButtons { text-align: center; } }
		.commentListReply { display: block; }
		@media (min-width: 600px) { .commentListReply { margin-left: 210px; } }
			.commentListReply textarea { width: 100%; height: 150px; }
			@media (min-width: 600px) { .commentListReply textarea { height: 200px; } }
		.commentListActivityHeader { margin: 0 0 5px; padding: 3px 5px; background: #eee; color: #444; }
			.commentListActivityHeader a { color: #444; }
			.commentListActivityHeader a:hover { color: #444; }
			.commentListActivityHeaderText { display: inline; margin-right: 10px; }
				.commentListActivityHeader a { font-weight: bold; }
			.commentListActivityHeaderDate { display: inline; white-space: nowrap; font-style: italic; }

.contentsListSelectorBox { display: block; margin: 0 0 10px; padding: 5px 6px; background: #eee; color: #444; font-size: 80%; line-height: 1em; text-align: center; }
@media (min-width: 600px) { .contentsListSelectorBox { text-align: left; } }
	.contentsListSelectorTitle { display: block; margin: 0 0 5px 0; text-align: center; font-weight: bold; }
	@media (min-width: 600px) { .contentsListSelectorTitle { display: inline-block; margin: 0 5px 0 0; text-align: left; } }
	.contentsListSelectorBox input[type="radio"] { display: none; }
	.contentsListSelectorBox label { display: inline-block; margin: 0 2px; padding: 3px 6px; border-radius: 3px; white-space: nowrap; text-align: center; cursor: pointer; }
	.contentsListSelectorBox label.contentsListSelectorSelected { background: #666; color: #eee; }
		.contentsListSelectorBox label .contentsListSelectorLong { display: none; }
		@media (min-width: 480px) { .contentsListSelectorBox label .contentsListSelectorLong { display: inline; } }
.contentsList { }
	.contentsListHeading { font-weight: bold; }
	.contentsListHeading:hover { background: initial !important; }
		.contentsListHeading span[class^='icon-arrow-'] { color: #888; }
	.contentsListTools { display: block; padding: 5px 20px; border-width: 1px; border-style: solid; border-color: #888 transparent; background: #ddd; font-size: 0.9em; }
	@media (min-width: 600px) { .contentsListTools { text-align: right; } }
		.contentsListTools label { display: inline-block; min-width: 38px; white-space: nowrap; }
		@media (min-width: 480px) { .contentsListTools label { min-width: 0; } }
		.contentsListToolsPages { display: block; margin-bottom: 5px; white-space: nowrap; }
		.contentsListToolsPage,
		.contentsListToolsToGet { display: inline-block; width: 45%; white-space: nowrap; text-align: center;}
		@media (min-width: 600px) { .contentsListToolsPage, .contentsListToolsToGet { width: 100px; } }
			.contentsListToolsPage input { width: 40px; text-align: center; }
			.contentsListToolsToGet select { text-align: center; }
	.contentList { display: block; padding: 2px; border-bottom: #ccc 1px solid; font-size: 0; }
	.contentList:hover { background: #eee; }
		.contentListButtons { float: none; display: inline-block; margin-right: 10px; vertical-align: top; font-size: 1rem; } 
		.contentListCategory { display: inline-block; max-width: 75%; font-size: 1rem; vertical-align: top;}
		@media (min-width: 800px) { .contentListCategory { width: 23%; font-size: 0.9rem; overflow: hidden; } }
		@media (min-width: 1366px) { .contentListCategory { width: 27%; font-size: 1rem; } }
		.contentListMetric { display: inline-block; width: 20%; padding: 0 5px; font-size: 0.9rem; text-align: center; overflow: hidden; vertical-align: top; }
		.contentListMetric:hover { overflow: visible; }
		@media (min-width: 1024px) { .contentListMetric { padding: 0 10px; } }
		@media (min-width: 1366px) { .contentListMetric { font-size: 1rem; } }
			.contentListMetric span[class^='icon-'] { color: #666; }
		.contentListScore { text-align: left; } 
		@media (min-width: 800px) { .contentListScore { text-align: center; } }
			.contentListScore span { font-size: 1rem; line-height: 1em; }
		@media (min-width: 800px) { .contentListScore, .contentListViews, .contentListReads, .contentListWords, .contentListCharity { width: 55px; } }
		@media (min-width: 800px) { .contentListRating, .contentListComments, .contentListLinks { width: 45px; } }
		@media (min-width: 1024px) { .contentListScore, .contentListRating, .contentListComments, .contentListViews, .contentListReads, .contentListLinks, .contentListWords, .contentListCharity { width: 60px; } }
		@media (min-width: 1366px) { .contentListScore, .contentListRating, .contentListComments, .contentListViews, .contentListReads, .contentListLinks, .contentListWords, .contentListCharity { width: 75px; } }
			.contentListCharity span[class^='icon-close'] { color: #888; }
			.contentListCharity span[class^='icon-checkmark'] { color: #327827; }
		@media (min-width: 800px) { .contentListDate, .contentListEditedDate { width: 108px; } }
		@media (min-width: 800px) { .contentListEditedDate { display: none; } }
		@media (min-width: 1024px) { .contentListEditedDate { display: inline-block; } }
		@media (min-width: 1366px) { .contentListDate, .contentListEditedDate { width: 120px; } }
		.contentListDenial,
		.contentListFlags { display: block; text-align: left; width: 100%; }
		@media (min-width: 800px) { .contentListDenial, .contentListFlags { display: inline-block; width: 50%; } }
		@media (min-width: 1024px) { .contentListDenial, .contentListFlags { width: 55%; } }
			.contentListFlags li { margin-left: 10px; }

.denialReasonsList { display: block; margin: 10px 0; font-size: 0rem; }
	.denialReasonList { display: inline-block; min-width: 200px; margin: 2px; padding: 0 4px; font-size: 1rem; text-align: center; }
		.denialReasonList input[type='checkbox'] { display: none; }
		.denialReasonList label { cursor: pointer; }
		.denialReasonList span[class*='icon-'] { color: #666; }

.earningsList { display: block; margin: 25px 0 15px; }
	.earningsListHeading { font-weight: bold; }
	.earningsListHeading:hover { background: initial !important; }
		.earningsListHeading span[class*='icon-arrow-'] { color: #888; }
	.earningsListTitle { margin: 5px 0 15px 5px; font-size: 1.25em; }
	.earningsListTools { display: block; padding: 5px 20px; border-width: 1px; border-style: solid; border-color: #888 transparent; background: #ddd; font-size: 0.9em; }
		.earningsListTools label { display: inline-block; min-width: 38px; white-space: nowrap; }
		@media (min-width: 480px) { .earningsListTools label { min-width: 0; } }
	.earningsListToolsBottom { }
	@media (min-width: 600px) { .earningsListToolsBottom { text-align: right; } }
		.earningsListToolsPages { display: block; margin-bottom: 5px; white-space: nowrap; }
		.earningsListToolsPage,
		.earningsListToolsToGet { display: inline-block; width: 45%; white-space: nowrap; text-align: center;}
		@media (min-width: 600px) { .earningsListToolsPage, .earningsListToolsToGet { width: 100px; } }
			.earningsListToolsPage input { width: 40px; text-align: center; }
			.earningsListToolsToGet select { text-align: center; }
	.earningList { display: block; padding: 2px; border-bottom: #ccc 1px solid; font-size: 0; }
	.earningList:hover { background: #eee; }
		.earningListCategory { display: block; font-size: 1rem; vertical-align: top;}
		@media (min-width: 480px) { .earningListCategory { display: inline-block; width: 50%; overflow: hidden; } }
		@media (min-width: 600px) { .earningListCategory { width: 33%; } }
		@media (min-width: 1024px) { .earningListCategory { width: 50%; } }
		.earningListMetric { display: inline-block; width: 50%; min-width: 75px; padding: 0 5px; font-size: 1rem; text-align: center; }
		@media (min-width: 480px) { .earningListMetric { width: 25%; vertical-align: top; } }
		@media (min-width: 600px) { .earningListMetric { width: 16.5%; padding: 0 10px; } }
		@media (min-width: 1024px) { .earningListMetric { width: 12.5%;} }
		.earningListPageview { text-align: left; }
		@media (min-width: 480px) { .earningListPageview { text-align: center; } }
			.earningListPageview span[class*='icon-'] { color: #666; }
		.earningListTotal { text-align: right; }
		@media (min-width: 480px) { .earningListTotal { text-align: center; } }

.flagsList { display: block; }
.flagsListExpired { display: none; }
	.flagList { display: block; width: 100%; max-width: 600px; margin: 0 0 8px 0; padding: 5px; border: #ddd 1px solid; }
	@media (min-width: 1280px) { .flagList { float: left; width: 600px; margin-right: 8px; } }
		.flagListDate { font-size: 0.8em; color: #666; }
		.flagListButtons { display: block; margin: 10px 0 0 0; text-align: right; }
	.flagListFull { float: none; width: 100%; max-width: none; margin: 0 0 8px 0; } }
	.flagListWarning { border: #e5db55 1px solid; background: #fefccb; }
	.flagListAlert { border: #df8f90 1px solid; background: #ffd2d3; }

.forumpostsList { display: block; }
	.forumpostsListNavigation { margin: 8px 0 8px; padding: 0 0 8px; border-bottom: #ddd 1px solid; }
		.forumpostsListNavigation .paging { float: right; margin: 0 0 0 10px; }
	.forumpostList { position: relative; display: block; margin: 0 0 8px; padding: 0 0 8px; border-bottom: #ddd 1px solid; }
		.forumpostListMain { }
		@media (min-width: 600px) { .forumpostListMain { min-height: 178px; margin-left: 210px; } }
			.forumpostListDate { display: block; text-align: right; color: #444; font-size: 0.8em; }
				.forumpostListDate a { color: #444; text-decoration: underline; }
				.forumpostListDate a:hover { color: #444; text-decoration: none; }
			.forumpostListPost { display: block; }
			.forumpostListEdit { display: none; }
				.forumpostListEdit textarea { width: 100%; height: 150px; }
				@media (min-width: 600px) { .forumpostListEdit textarea { height: 200px; } }
				@media (min-width: 1280px) { .forumpostListEdit textarea { height: 300px; } }
		.forumpostListAside { display: block; margin-top: 10px; padding: 5px; background: #eee; color: #444; font-size: 0.8em; }
		@media (min-width: 600px) { .forumpostListAside { position: absolute; top: 0; left: 0; width: 200px; margin-top: 0; padding: 7px 5px 7px; text-align: center; } }
			.forumpostListAuthorPostCount { display: none; }
			@media (min-width: 600px) { .forumpostListAuthorPostCount { display: block; } }
			.forumpostListAvatar { display: none; }
			@media (min-width: 600px) { .forumpostListAvatar { display: block; } }
			.forumpostListByline { }
			.forumpostListByline:before { content: "Posted by "; }
			@media (min-width: 600px) { .forumpostListByline:before { content: ""; } }
			.forumpostListMemberSince { display: none; }
			@media (min-width: 600px) { .forumpostListMemberSince { display: block; } }
		.forumpostListButtons,
		.forumpostListActivityButtons { display: block; margin: 5px 0; text-align: right; }
		@media (max-width: 479px) { .forumpostListActivityButtons { text-align: center; } }
		.forumpostListActivityHeader { margin: 0 0 5px; padding: 3px 5px; background: #eee; color: #444; }
			.forumpostListActivityHeader a { color: #444; }
			.forumpostListActivityHeader a:hover { color: #444; }
			.forumpostListActivityHeaderText { display: inline-block; margin-right: 15px; }
				.forumpostListActivityHeader a { font-weight: bold; }
			.forumpostListActivityHeaderDate { display: inline-block; white-space: nowrap; }
		.forumpostsListReply { display: block; }
		@media (min-width: 600px) { .forumpostsListReply { margin-left: 210px; } }
			.forumpostsListReply textarea { width: 100%; height: 150px; }
			@media (min-width: 600px) { .forumpostsListReply textarea { height: 200px; } }
			@media (min-width: 1280px) { .forumpostsListReply textarea { height: 300px; } }

.forumtopicsList { display: block; }
	.forumtopicsListNavigation { margin: 8px 0 8px; padding: 0 0 8px; border-bottom: #ddd 1px solid; }
		.forumtopicsListNavigation .paging { float: right; margin: 0 0 0 10px; }
	.forumtopicList { position: relative; display: block; margin: 0 0 8px; padding: 0 0 8px; border-bottom: #ddd 1px solid; }
		.forumtopicListMain { position: relative; padding-left: 22px; }
		@media (min-width: 600px) { .forumtopicListMain { min-height: 72px; margin-right: 210px; } }
			.forumtopicListSubscribe { position: absolute; top: 0; left: 0; }
			.forumtopicListTopic { display: block; margin-bottom: 5px; font-weight: bold; }
				.forumtopicListTopic a { text-decoration: none; }
			.forumtopicListByline { display: none; }
			@media (min-width: 600px) { .forumtopicListByline { display: block; float: left; color: #444; font-size: 0.8em; line-height: 1em; } }
			.forumtopicListPostCount { display: none; }
			@media (min-width: 600px) { .forumtopicListPostCount { display: block; float: right; color: #444; font-size: 0.8em; line-height: 1em; } }
			.forumtopicListPages { float: none; margin: 8px 0 0; font-size: 0.8em; line-height: 1em; text-align: right; }
			@media (min-width: 600px) { .forumtopicfListPages { float: right; margin: 0; } }
				.forumtopicListPages a { text-decoration: none; }
		.forumtopicListAside { display: block; margin-top: 10px; padding: 5px; background: #eee; color: #444; text-align: center; font-size: 0.8em; }
		@media (min-width: 600px) { .forumtopicListAside { position: absolute; top: 0; right: 0; width: 200px; margin-top: 0; padding: 7px 5px 7px; } }
			.forumtopicListLastPostDate { display: inline; }
			@media (min-width: 600px) { .forumtopicListLastPostDate { display: block; } }
				.forumtopicListLastPostDate:before { content: "- "; }
				@media (min-width: 600px) { .forumtopicListLastPostDate:before { content: ""; } }

.paymentsList { display: block; margin: 25px 0 15px; }
	.paymentsListHeading { font-weight: bold; }
	.paymentsListHeading:hover { background: initial !important; }
		.paymentsListHeading .paymentListCategory { font-weight: bold; }
	.paymentsListTitle { margin: 5px 0 15px 5px; font-size: 1.25em; }
	.paymentsListTools { display: block; padding: 5px 20px; border-width: 1px; border-style: solid; border-color: #888 transparent; background: #ddd; font-size: 0.9em; }
		.paymentsListTools label { display: inline-block; min-width: 38px; white-space: nowrap; }
		@media (min-width: 480px) { .paymentsListTools label { min-width: 0; } }
	.paymentsListToolsBottom { }
	@media (min-width: 600px) { .paymentsListToolsBottom { text-align: right; } }
		.paymentsListToolsPages { display: block; margin-bottom: 5px; white-space: nowrap; }
		.paymentsListToolsPage,
		.paymentsListToolsToGet { display: inline-block; width: 45%; white-space: nowrap; text-align: center;}
		@media (min-width: 600px) { .paymentsListToolsPage, .paymentsListToolsToGet { width: 100px; } }
			.paymentsListToolsPage input { width: 40px; text-align: center; }
			.paymentsListToolsToGet select { text-align: center; }
	.paymentList { display: block; padding: 2px; border-bottom: #ccc 1px solid; font-size: 0; }
	.paymentList:hover { background: #eee; }
		.paymentListCategory { display: block; font-weight: bold; font-size: 1rem; vertical-align: top;}
		@media (min-width: 480px) { .paymentListCategory { display: inline-block; width: 25%; font-weight: normal; overflow: hidden; } }
		@media (min-width: 600px) { .paymentListCategory { display: inline-block; width: 17.5%; overflow: hidden; } }
		@media (min-width: 800px) { .paymentListCategory { width: 13%; } }
		@media (min-width: 1024px) { .paymentListCategory { width: 11%; } }
		.paymentListMetric { display: inline-block; width: 33%; font-size: 1rem; text-align: center; }
		@media (min-width: 480px) { .paymentListMetric { width: 25%; padding: 0 10px; vertical-align: top; } }
		@media (min-width: 600px) { .paymentListMetric { width: 17%; padding: 0 10px; vertical-align: top; } }
		@media (min-width: 800px) { .paymentListMetric { width: 13%; } }
		@media (min-width: 1024px) { .paymentListMetric { width: 10%;} }
			.paymentListDescription { display: inline-block; width: 31.5%; text-align: left; }
			@media (min-width: 600px) { .paymentListDescription { } }
			@media (min-width: 800px) { .paymentListDescription { width: 48%;} }
			@media (min-width: 1024px) { .paymentListDescription { width: 59%;} }
				.paymentListDebitAbbr, .paymentListCreditAbbr { display: inline; padding-right: 5px; color: #555; }
		.paymentListFull { display: block; font-size: 1rem; }
		.paymentListDescriptionFull { color: #555; }

.privateMessagesListSelectorBox { display: block; margin: 0 0 10px; padding: 5px 6px; background: #eee; color: #444; font-size: 80%; line-height: 1em; text-align: center; }
@media (min-width: 600px) { .privateMessagesListSelectorBox { text-align: left; } }
	.privateMessagesListSelectorTitle { display: block; margin: 0 0 5px 0; text-align: center; font-weight: bold; }
	@media (min-width: 600px) { .privateMessagesListSelectorTitle { display: inline-block; margin: 0 5px 0 0; text-align: left; } }
	.privateMessagesListSelectorGroup { display: inline-block; margin: 2px 0; padding-right: 20px; white-space: nowrap; }
		.privateMessagesListSelectorBox input[type="radio"] { display: none; }
		.privateMessagesListSelectorBox label { display: inline-block; margin: 0 2px; padding: 3px 6px; border-radius: 3px; white-space: nowrap; text-align: center; cursor: pointer; }
		.privateMessagesListSelectorBox label.privateMessagesListSelectorSelected { background: #666; color: #eee; }
.privateMessagesList { display: block; width: 100%; }
@media (min-width: 600px) { .privateMessagesList { display: table; width: 100%; border-collapse: collapse; border-spacing: 10px 50px; } }
	.privateMessageList { position : relative; display: block; margin: 0 0 8px; padding: 0 0 8px; border-bottom: #ddd 1px solid; cursor: pointer; }
	@media (min-width: 600px) { .privateMessageList { display: table-row; border-bottom: #ddd 1px solid; cursor: pointer; line-height: 32px; } }
		.privateMessageListFrom { display: block; font-size: 0.8em; font-color: #666; }
		@media (min-width: 600px) { .privateMessageListFrom { display: table-cell; width: 120px; } }
			.privateMessageListFrom span { }
			@media (min-width: 600px) { .privateMessageListFrom span { display: inline-block; margin-right: 10px; } }
		.privateMessageListSubject { display: block; }
		@media (min-width: 600px) { .privateMessageListSubject { display: table-cell; line-height: 1.5em; } }
		.privateMessageListDate { position: absolute; top: 0; right: 0; display: block; float: right; width: 90px; text-align: right; font-size: 0.8em; font-color: #666; }
		@media (min-width: 600px) { .privateMessageListDate { position: static; display: table-cell; float: none; line-height: 1.5em; } }
	.privateMessageUnread { font-weight: bold; }

.referralsList { display: block; margin: 25px 0 15px; }
	.referralsListHeading { font-weight: bold; }
	.referralsListHeading:hover { background: initial !important; }
		.referralsListHeading span[class^='icon-arrow-'] { color: #888; }
	.referralsListTitle { margin: 5px 0 15px 5px; font-size: 1.25em; }
	.referralsListTools { display: block; padding: 5px 20px; border-width: 1px; border-style: solid; border-color: #888 transparent; background: #ddd; font-size: 0.9em; }
		.referralsListTools label { display: inline-block; min-width: 38px; white-space: nowrap; }
		@media (min-width: 480px) { .referralsListTools label { min-width: 0; } }
	.referralsListToolsBottom { }
	@media (min-width: 600px) { .referralsListToolsBottom { text-align: right; } }
		.referralsListToolsPages { display: block; margin-bottom: 5px; white-space: nowrap; }
		.referralsListToolsPage,
		.referralsListToolsToGet { display: inline-block; width: 45%; white-space: nowrap; text-align: center;}
		@media (min-width: 600px) { .referralsListToolsPage, .referralsListToolsToGet { width: 100px; } }
			.referralsListToolsPage input { width: 40px; text-align: center; }
			.referralsListToolsToGet select { text-align: center; }
	.referralList { display: block; padding: 2px; border-bottom: #ccc 1px solid; font-size: 0; }
	.referralList:hover { background: #eee; }
		.referralListCategory { display: inline-block; width: 50%; font-size: 1rem; vertical-align: top;}
		@media (min-width: 480px) { .referralListCategory { width: 33%; } }
		@media (min-width: 600px) { .referralListCategory { width: 25%; } }
		.referralListFull { display: block; width: 100%; font-size: 1rem; }
		.referralListMetric { display: inline-block; width: 50%; padding: 0 5px; font-size: 1rem; text-align: center; }
		@media (min-width: 480px) { .referralListMetric { width: 33%; } }
		@media (min-width: 600px) { .referralListMetric { width: 25%; padding: 0 10px; vertical-align: top; } }

.tagsList { display: block; margin: 10px 0; }
	.tagList { display: inline-block; padding: 0 4px; border-radius: 3px; white-space: nowrap; color: #555}
	.tagList:hover { background: #bbb; }
		.tagList a { color: #555; text-decoration: none; }
		.tagList a:hover { color: #555; text-decoration: none; }

/* Show/Hide Spans
   ========================================================================== */

.showUntil480 { display: inline-block; }
@media (min-width: 480px) { .showUntil480 { display: none; } }
.showUntil600 { display: inline-block; }
@media (min-width: 600px) { .showUntil600 { display: none; } }
.showUntil768 { display: inline-block; }
@media (min-width: 768px) { .showUntil768 { display: none; } }
.showUntil800 { display: inline-block; }
@media (min-width: 800px) { .showUntil800 { display: none; } }
.showUntil1024 { display: inline-block; }
@media (min-width: 1024px) { .showUntil1024 { display: none; } }

.showFrom480 { display: none; }
@media (min-width: 480px) { .showFrom480 { display: inline-block; } }
.showFrom600 { display: none; }
@media (min-width: 600px) { .showFrom600 { display: inline-block; } }
.showFrom768 { display: none; }
@media (min-width: 768px) { .showFrom768 { display: inline-block; } }
.showFrom800 { display: none; }
@media (min-width: 800px) { .showFrom800 { display: inline-block; } }
.showFrom1024 { display: none; }
@media (min-width: 1024px) { .showFrom1024 { display: inline-block; } }

/* Typography
   ========================================================================== */

h1, 
h2, 
h3, 
h4, 
h5 { margin: 0; font-weight: 600; }

h1 { font-size: 1.3rem; line-height: 1.3em; }

@media (min-width: 40rem) {
	h1 { font-size: 1.5rem; }
}

h3 { margin-bottom: .5rem; font-size: 1.2rem; }

p { margin: 0.75rem 0; }

small { font-size: 80%; line-height: 1.2em; }

blockquote { margin: 0.75rem; }

blockquote p { color: #999; font-style: italic; }

cite { color: #bbb; }

.title { font-weight: bold; }

.heading { display: block; width: 100%; margin: 0 0 0.5rem; padding: 0.25rem 0.5rem; background: #364F61; color: #fff; }

.alertText { color: #8f2121; }
.warningText { color: #878314; }
.successText { color: #258815; }


/* Links
   ========================================================================== */

a,
.link { color: #015BB8; text-decoration: underline; cursor: pointer; }

a:hover,
.link:hover { color: #6699FF; text-decoration: none; }

.clickable { cursor: pointer; }

/* Message Boxes
   ========================================================================== */

.successBox,
.warningBox,
.errorBox { display: none; margin: 10px; padding: 10px; text-align: left; color: #222; }
.successBox { border: #9adf8f 1px solid; background: #d4ffcd; }
.warningBox { border: #e5db55 1px solid; background: #fefccb; }
.errorBox { border: #df8f90 1px solid; background: #ffd2d3; }
	.successBox li,
	.warningBox li,
	.errorBox li { margin: 0; }
	.successBox b { color: #258815; }
	.warningBox b { color: #878314; }
	.errorBox b { color: #8f2121; }


/* Buttons
   ========================================================================== */

/* hand cursor on clickable elements */
input[type=button], 
input[type=submit], 
input[type=reset], 
button,
.button {cursor: pointer;}

/* make buttons play nice in IE */
button,
.button {width: auto; overflow: visible;}

/* Firefox has some extra internal padding that needs to go */
input[type=button]::-moz-focus-inner, 
input[type=submit]::-moz-focus-inner, 
input[type=reset]::-moz-focus-inner { border: 0; padding: 1px 0 0; }
button::-moz-focus-inner { border: 0; padding: 0; }

/* Input buttons need to align top so they align next to buttons */
input[type=button], 
input[type=submit], 
input[type=reset],
button,
.button { vertical-align: top; }

input[type=submit],
input[type=button],
input[type=reset],
button,
.button { display: inline-block; padding: 4px 6px; border: #b4b4b4 1px solid; border-radius: 3px; background: #f3f3f3; color: #555; font-size: 15px; line-height: 17px; text-decoration: none; }
	input[type=submit]:hover, 
	input[type=button]:hover, 
	input[type=reset]:hover, 
	button:hover,
	.button:hover { background: #e3e3e3; color: #666; text-decoration: none; }
	input[type=submit] span[class*="icon-"], 
	input[type=button] span[class*="icon-"], 
	input[type=reset] span[class*="icon-"], 
	button span[class*="icon-"],
	.button span[class*="icon-"] { vertical-align:top; }

.buttonAlert { background: #bd0000; color: #fff; border-color: #820404; }
.buttonAlert:hover { background: #e13636; color: #fff; }

.buttonHighlight { background: #00b5da; color: #fff; border-color: #047482; }
.buttonHighlight:hover { background: #36c3e1; color: #fff; }

.buttonSuccess { background: #12bd00; color: #fff; border-color: #048204; }
.buttonSuccess:hover { background: #36e142; color: #fff; }

.buttonUnclickable { background: #e3e3e3; color: #a3a3a3; cursor: not-allowed; }
.buttonUnclickable:hover { background: #e3e3e3; color: #a3a3a3; cursor: not-allowed; }

.buttonFacebook { position: relative; display: inline-block; padding: 8px 12px 8px 32px; border: #3d5b99 1px solid; background: #4965a0; line-height: 20px; color: #fff !important; text-decoration: none; }
.buttonFacebook:hover { background: #4965a0; }
	.buttonFacebookIcon { position: absolute; top: 0; left: 0; width: 32px; height: 38px; padding: 5px 0; text-align: center; font-size: 24px; line-height: 24px; z-index: 1; }
.buttonEmail { position: relative; display: inline-block; padding: 8px 12px 8px 32px; border: #a0a0a0 1px solid; background: #f0f0f0; line-height: 20px; color: #000 !important; }
	.buttonEmailIcon { position: absolute; top: 0; left: 0; width: 32px; height: 38px; padding: 5px 0; text-align: center; font-size: 24px; line-height: 24px; z-index: 1; }

/* Ads
   ========================================================================== */

/* jQuery UI
   ========================================================================== */
div.ui-datepicker{ font-size: 14px; }
@media (min-width: 1024px) { div.ui-datepicker{ font-size: 11px; } }


/* Clearfix by Nicolas Gallagher
   ========================================================================== */

.clearfix:before,
.clearfix:after {
  content: " ";
  display: table;
}

.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }