/*  
Theme Name: Medeq
Theme URI: 
Description: Custom Theme for Media Equalizer
Version: 1.0
Author: The Media Equalizer
Author URI: http://mediaequalizer.com/
Tags: valid CSS, valid XHTML, one sidebar
*/

@font-face {
	font-family: 'Web Symbols';
	src: url(graphics/WebSymbolsLiga-Regular.otf?) format("opentype");
	font-style: normal;
}

@font-face {
	font-family: 'Merriweather Sans';
	src: url(graphics/MerriweatherSans-Regular.otf?) format("opentype");
	font-style: normal;
}

@font-face {
	font-family: 'Merriweather Sans';
	src: url(graphics/MerriweatherSans-Bold.otf?) format("opentype");
	font-weight: bold;
}

@font-face {
	font-family: 'Franklin Gothic Medium Cond';
	src: url(graphics/fgmc2.ttf?) format("truetype");
	font-weight: bold;
}


html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, .post-content main ul, .post-content main ol, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	text-decoration: none;
}

body {background: #fff;  -webkit-overflow-scrolling: touch;}


h1 {
	font-family: 'Franklin Gothic Medium Cond';
}

h2 {
	font-family: "merriweather sans",sans-serif
}

strong, b {
	font-weight: bold;
}

em {
	font-style: italic;
}

.clear {
	clear: both;
	height: 0px;
}

.separator {
	border-top: dotted 1px #ddd;
	margin-top: 30px;
	padding-top: 30px;
}


	
#header {
	width: 100%;
	position: absolute;
	top: -35px;
	background: url(https://mediaequalizer.com/wp-content/themes/medeq/graphics/stripes.png) ;
}

.container {
	width: 85%;
	margin: 0px auto;
	max-width: 1100px;
	}

#logo {
}

#logo img {
	height: 100px;
	padding-top: 48px;
	position: relative;
	left: -40px;
}

#navbar {
	text-align: right;
	margin-top: -20px;
	padding-bottom: 20px;
	height: 30px;
}

#navbar a {
	font: normal 18pt 'Franklin Gothic Medium Cond', sans-serif;
	color: #ddd;
	text-decoration: none;
	margin-right: 20px;
	position: relative;
	right: 0px;
}


#gear, #userButton, .mobileMenu {
	display: none;
}

#gear div {
	display: block;
	width: 100%;
	height: 100%;
	
}

.social {
	margin-left: 30px;
	margin-right: 8px;
}

.social a{
	color: red;
	font-family: 'Web Symbols' !important;
	font-size: 30px !important;
}

.social .last {
	margin: 0px !important;
}




#topStories {
	margin-top: 145px;
	width: 100%;
	background: #1f1f1f;
	text-align: justify;
	padding-top: 20px;
	padding-bottom: 20px;
	border: none;
}

.topStory {
	display: inline-block;
	padding-right: 1.8%;
	width: 18%;
	vertical-align: top;
	text-align: right;
}

#topStory5 {
	padding-right: 0px;
	}

#topStory0, .mobileOnly {
	display: none;
}

.topStory img {
	width: 100%;
	height: auto;
	margin-bottom: 5px;
}

.topHeadline h1, .topHeadline h1 a {
	font: bold 13pt "merriweather sans", sans-serif;
	color: white;
	text-align: left;
	line-height: 1.2em;
	
}

#largeLeaderboard {
	text-align: center;
	margin: 30px auto 10px auto;
	padding: 20px 0px;
	border-bottom: 1px dotted #ddd;
	border-top: 1px dotted #ddd;
	width: 100%;
	}

.wrapper {
	float: left;
	width: 100%;
	margin-right: -320px;
	}
	
.mainBar {
	margin-right: 350px;
	border-right: dotted 1px #ddd;
	padding-right: 30px;
	}
	
.sidebar {
	float: left;
	width: 320px; 
	margin: 0px 0px 20px 0px;
	font: normal 1em 'merriweather sans';
	}


.middleWrapper {
	float: left;
	width: 100%;
	margin-right: -320px;
	}
	
.leftBar {
	margin-right: 350px;
	border-right: dotted 1px #ddd;
	padding-right: 30px;
	margin-top: 25px;
}
	
.rightBar {
	float: left;
	width: 320px; 
	margin: 25px 0px 20px 0px;
	font: normal 1.2em 'merriweather sans';
	}
	

.leftBar h1 {
	font: bold 27pt 'franklin gothic medium cond', sans-serif;
	line-height: 1em;
	letter-spacing: -1px;
}

.leftBar h3 {
	font: normal 16pt 'merriweather sans';
	margin-top: 10px;
}


.date {
	color: grey;
	margin-bottom: 10px;
	font-size: 95%;
}

.date:before {
	content: "/ ";
}

h3.byline {
	font-style: italic;
}



header img {
	border-top: dotted 1px #ddd;
	padding-top: 30px;
}

#popular {
	padding: 20px;
	border: dotted 1px #ddd;
	text-align: left;
	margin-top: 20px;
	margin-bottom: 20px;
}
    
a {
	color: #196FB5
}

#popular li {
	margin-bottom: 5px;
	margin-left: 20pt;
	font-size: 180%;
	list-style: square;
	line-height: 0.8em;
}
        
#popular a {
	color: black;
	font-size: 60% !important;;
}
    
#popular li:nth-child(1) {
	color: green
}
    
#popular li:nth-child(2) {
	color: #5CD5CD
}
    
#popular li:nth-child(3) {
	color: #FF9F40
}
    
#popular li:nth-child(4) {
	color: #B22FDE
}
    
#popular li:nth-child(5) {
	color: #412BFF
}

#popular .tptn_list_count, #popular li:nth-child(6),  #popular li:nth-child(7), #popular li:nth-child(8), #popular li:nth-child(9), #popular li:nth-child(10) {
	display: none;
}




.blogItem {
	width: 48%;
	float: left;
	padding: 0px 00px 0px 0px;
}

.even {
	padding-left: 0px;
	margin-right: 0px;
	float: right;
}

	
.topic, .post-categories, .post-categories a {
	list-style-type: none;
	font: bold 18pt 'merriweather sans';
	text-transform: uppercase;
}

.topic a, .redhed {
	color: #E12917;
}
	
#desktopLede {
	padding: 0px 0px 30px 0px;
	margin-bottom: 30px;
	border-bottom: dotted 1px #ddd;
}


#desktopLede h1, .leftBar h1 {
	font: bold 39pt 'franklin gothic medium cond', sans-serif;
	line-height: 1em;
	letter-spacing: -1px;
}

.blogItem h1 a{
	font-size: 26pt;
}

#article h1 {
	font-size: 46pt;
	margin-bottom: 10px
}

#article h2 {
	font-size: 20pt;
	margin: 20px 0px 20px 0px;
}

.byline {
	padding: 0px 0px 40px 0px;
}
#desktopLede h1 a, .posting h1 a, .blogItem h1 a {
	color: black;
}

#desktopLede h3 {
	font: normal 18pt 'merriweather sans';
	margin-top: 15px;
}

#desktopLede img, .blogItem img {
	width: 100%;
	height: auto;
	}

.emailSignup {
	border: solid 1px #2386c9;
	padding: 30px;
	background: #cfe5f4;
	text-align: center;
	margin: 0px 0px 30px 0px;
	font: normal 16pt 'Merriweather Sans';

	
}

#mce-EMAIL {
	width: 50%;
	background: white;
	border: none;
	padding: 5px;
	height: 35px;
	padding: 0px;
}

#mc-embedded-subscribe {
	margin-left: 4px;
	background: #2386c9;
	border: dotted 1px black;
	color: white;
	font-weight: bold;
	height: 35px;
	padding: 0px;
}

#mailIcon {
	font: normal 48pt "Web Symbols";
	float: left;
	margin: -10px 34px 0px 0px;
	color: #2386c9;
	cursor: default;
}
    


blockquote {
	margin-left: 10%;
	margin-right: 10%;
}

h4 {
	font: normal 20pt 'cambria' serif;
	line-height: 1.5em;
	border-bottom: dotted 1px #ccc;
	padding-bottom: 0px;
	margin-bottom: 20px;
}

.sidebar h4, .rightBar h4 {
	font: bold 20pt 'merriweather sans';
	color: #E12917;
	text-transform: uppercase;
	margin-top: 0px;
	border: none;
	
}

.sidebar ol{
	text-align: left;
	padding: 0px 0px 0px 32px;
}

.sidebar ol li {
	margin-bottom: 0.3em;
}

.posting {
	padding-bottom: 30px;
	margin-bottom: 30px;
	border-bottom: dotted 1px #ddd;
}

.leftBar .first {
	padding-top: 30px;
	margin-top: 30px;
	border-top: dotted 1px #ddd;
}

.posting img {
	width: 100%;
	height: auto;
}

.wp-caption.alignright {
	float: right;
}

.wp-caption-text {
	font: bold 70% sans-serif !important;
	}



.post-content p, div.mobileOnly.posting {
	font: normal 18pt cambria, times, serif;
	margin-top: 20px;
	line-height: 1.5em;
	}

#footer {
	text-align: center;
	font: normal 12pt merriweather sans;
	margin-bottom: 20px; 
}

	
.shareaholic-share-buttons-container {
	margin: -20px 0px 15px -15px !important;
}	

	
@media all and (max-width:1100px) {
	body {
		overflow-x: hidden;
	}
	
	.container {
		width: 98%;
	}
	
	#logo img {
		margin-left: 40px;
	}
	
	#topStory5 {display: none;}
	
	.topStory {
		padding-right: 1%;
		width: 23%;
		vertical-align: top;
		text-align: justify;
		padding-right: 1.4%;
	}
	#navbar a {
		font-size: 19px;
	}
	.social .last {	
	}
	#topStories {
		margin-top: 140px;
	}
	
	.topHeadline h1{
		font-size: 18px;
	}
	
	.sidebar {
		font-size: 1em;
	}
}

@media	only screen and (max-width:800px)  {
	.container {
		width: 96%;
	}

	.mobileOnly {
		display: block;
	}

	#topStory0-mobile {display: none;}
	
	.sidebar, .mainBar, .wrapper, .leftBar, .rightBar, .middleWrapper, .blogItem, .sidebar .emailSignup {
		float: none;
		width: 100%;
	}

	.topStory {
		padding-right: 1.9%;
	}
	#topStory4 {
		padding-right: 0px;
	}
	
	#desktopLede, .blogItem, .emailSignup, .squareAd, .popular {
		border-bottom: dotted 1px #ddd;
		padding-bottom: 25px;
		margin-bottom: 20px;
	}
	
	#largeLeaderboard {
		border: none;
	}
	
	.leftBar .first {
		border-top: none;
		margin-top: -20px;
	}
	
	.sidebar {
		text-align: center;
		border: none;
		width: 100%;
		padding-left: 0px;
		margin-left: 0px;
	}

		
	.sidebar ol {
		padding-right: 32px;
	}
	.mainBar {
		margin-right: 0px;
	}
	
	#tallWide {
		text-align: center;
	}

}


@media all and (max-width:700px)  {

	body {
		 overflow-x:hidden;
	 }

	.mobileOnly {display: block !important;}

	 .topStory {
		margin-bottom: 30px;
		border-width: 2px;
	}

	.textwidget {
		border-top: 2px dotted #ddd;
		border-bottom: 2px dotted #ddd;
		padding: 20px 0px;
	}
	 
	#topStory5 {
		display: block;
	}
	
	#header {
		background: #1f1f1f;
		padding-bottom: 25px;
		height: 70px;
		margin-top: 20px;
		margin-bottom: 20px;
		z-index: 99;
		position: fixed;
		top: -30px;
	}

	.container {
		width: 100%;
		overflow-x:hidden;
	}

	#navbar, #largeLeaderboard, #desktopLede, .desktopOnly, .shareaholic-canvas {
		display: none;
	}
	
	.sidebar, #mainBar {
		float: none;
	}
	
	
	
	#logo img {
		left: 0px;
		height: 50px;
		padding-top: 30px;
		margin-left: 10px;
	}
	
	#gear, #userButton {
		display: block;
		width: 50px;
		height: 50px;
		float: right;
		margin: 25px 0px 0px 20px;
		cursor: pointer;
		font: normal 40px "Web Symbols";
		color: white;
	}
	.mobileMenu {
		width: 100%; 
		position: fixed; 
		right: 0px; 
		top: 85px; 
		background: #333;
		padding: 10px 0px 30px 0px;
	}
	.mobileMenu a {
		display: block;
		color: white;
		font: 16pt "merriweather sans", sans-serif;
		padding: 5px 0px;
	}

	.mobileMenu.smaller a{
		padding-left: 10px;
	}

	.mobileMenu .social {
		margin:0px;
	}

	.mobileMenu .social a{
		display: inline;
		font-size: 11pt;
		margin-right: 15px;
	}

	
	#topStories {
		margin-top: 65px;
		background: white !important;
		padding-right: 0px;
		font-family: "merriweather sans", sans-serif;
	}

	.topStory, .blogItem {
		display: block;
		width: 100%;
		clear: left;
		}

	.topStory {
		border-bottom: dotted 2px #ccc;
	}
	
	.topStory img {
		width: 40%;
		margin-right: 20px;
		margin-left: 20px;
		float: left;
		margin-bottom: 40px;
	}


	
	.topHeadline h1 a, .blogItem h1 a {
		color: black;
		font: bold 24pt "franklin gothic medium cond", "arial narrow", sans-serif;		
		font-size: 24pt;
		margin-top: 0px;
		margin-right: 10px;
	}
	
	#topStory0-mobile .topHeadline h1 a, .posting h1 a {
		font-size: 33pt;
		line-height: 1.1em;
	}

	
	#topStory0-mobile img {
		width: 100%;
		margin: 0px 0px 10px 0px;
	}

	.topHeadline{
		margin: 0px 20px;
		text-align: left;
	}

	.topHeadline h1 {
	}

	#topStory0-mobile a {color: black;}



	
	.sidebar {
		margin-left: -20px;
	}
	
	.sidebar .popular {
		margin-left: 20px;
	}
	
	.even {
		right: 0px;
		padding: 0px;
		margin-top: 20px;
		border: none;
	}
	
	.leftBar .first {
		border-top: dotted 1px #ddd;
		margin-top: 0px;
	}	
	
	.first .topic {
		display: none;
	}
	
	.blogItem div, .blogItem h1, .blogItem h3, .topic {
		margin: 0px 20px;
	}

	

	.posting .blogItem h1 {
		font-size: 20pt;
	}

	.topic, .blogItem h3 {
		font-size: 12pt;
	}
	
	.blogItem h3, .posting h1, .posting p, .posting h3, #article h2 {
		margin: 10px 20px 20px 20px;
	}

	.shareaholic-share-buttons-container {
		margin-left: 6px !important;
	}

	.blogItem img {
		margin-right: 20px;
	}

	header img {
		border-top: 2px dotted #ddd;
	}

	.byline {
		padding-bottom: 5px;
	}
	
	.date {
		display: block;
	}

	.date:before {
		content: "";
	}
		
	
	.posting p {
		font-size: 14pt;
	}

	.pageTitle {
		font-size: 39pt !important;
	}
	
	#article {
		padding-top: 5px;
	}

	.post-message p{
		font-size: 14pt !important;
	}
    

	#RecentComments {
		height: 900px !important;
		width: 100%;
		background: #333;
		color: white;
		font: bold 15pt arial, sans-serif;
		padding: 10px 10px 0px 10px;
	}
    
	p.dsq-widget-meta {
		visibility: hidden;
	}


	a.dsq-widget-user, span.dsq-widget-comment, p.dsq-widget-meta a {
		font-size: 14px;
		color: white;
		font-family: arial;
		float: left;
	}

	a.dsq-widget-user {
		margin-right: 5px;
	}

	p.dsq-widget-meta a {
		visibility: visible;
	}

	span.dsq-widget-comment{
	}

	span.dsq-widget-comment p:before {
		content: "\201C";
	}

	span.dsq-widget-comment p:after {
		content: "\201D"; 
	}
    
		
}
	
@media only screen and (max-width:500px)  {
	body {
	}

	.topStory h1 {
		margin-bottom: 20px;
	}

	#topStory0-mobile .topHeadline h1 a, .posting h1 a, .posting h1 {
		font-size: 24pt;
		letter-spacing: -1px;
	}

	#topStory0-mobile {
		padding-bottom: 20px;
	}

	#article h2 {
		font-size: 15pt;
	}	
	.topHeadline h1 a {
		font-size: 16pt;
	}
	.topStory img {
		margin-bottom: 40px;
	}


	.pageTitle {
		font-size: 25pt !important;
	}

	#header {
		height: 54px;
		margin-top: 8px;
	}

	.mobileMenu {
		top: 57px;
	}

	#RecentComments {
		height: 300px !important;
		overflow-y: scroll;
}
	
	#logo img {
		height: 40px;
	}
	
	#gear, #userButton {
		font-size: 25px;
		margin-top: 35px;
		margin-left: 10px;
	}
	
	#article {
		padding-top: 0px;
	}
	
	#topStories {
		margin-top: 37px;
	}

	iframe {
		width: 100%;
	}

	.post-content p {
		font-size: 15pt;
	}

}

@media print {
	#topStories, .rightBar, .shareaholic-canvas, #disqus_thread { display: none;}
	#article {padding-top: 160px;}
	.leftBar {margin-right: 0px; border: none; padding-right: 0px;}
	.posting p {font-size: 11pt;}
}