@charset "utf-8";

/* -------------------------------------------------------------------------- */
/* -- INCLUDE THE ICON FONT ------------------------------------------------- */
@font-face {
    font-family: 'IconFont';
    src: url('/includes/font/icon/icon.eot');
    src: url('/includes/font/icon/icon.eot?#iefix') 	format('embedded-opentype'),
         url('/includes/font/icon/icon.woff') 			format('woff'),
         url('/includes/font/icon/icon.ttf') 			format('truetype'),
         url('/includes/font/icon/icon.svg#icon')	 	format('svg');
    font-weight:	normal;
    font-style: 	normal;
}

/* -------------------------------------------------------------------------- */
/* -- ELEMENT RESET --------------------------------------------------------- */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 			0;
  padding: 			0;
  border:			0;
  font-size: 		100%;
  font: 			inherit;
  vertical-align: 	baseline;
}

/* -------------------------------------------------------------------------- */
/* -- BODY ------------------------------------------------------------------ */
* {
	-webkit-tap-highlight-color:rgba(0, 0, 0, 0);
	-webkit-font-smoothing:		antialiased;
}

html, body {
	margin: 			0px;
	width: 				100%;
	height: 			100%;
	padding: 			0px;
}

body {
	background-color: 	#fff;
	font-family: 		"Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 			16px;
}

a {color: #d2232a;}
a, a:focus, a:hover, a:active {outline:none;}

iframe {
	border:				0;
	margin:				0px auto;
	outline:			0;
	padding:			0;
	vertical-align:		baseline;
}

strong {
	font-weight: 		bold;
}

em {
	font-style: 		italic;
}

h1 {
	margin: 			0px;
	padding: 			10px;
	font-family: 		'Roboto Condensed', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-size:			1.5rem;
	font-weight: 		bold;
	line-height: 		2.0rem;
	text-align: 		left;
	letter-spacing: 	1px;
}

h1.header-channel {
    padding-bottom:     0px;
}

h2 {
	margin-bottom: 		5px;
	font-family: 		'Roboto Condensed', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-size:			1.5rem;
	font-weight: 		bold;
	text-align: 		left;
	padding: 			0px 10px;
}

/* -------------------------------------------------------------------------- */
/* -- FONT ICONS ------------------------------------------------------------ */
[class^="icon-"]:before, [class*=" icon-"]:before {
  	font-family: 		"IconFont";
  	font-style: 		normal;
  	font-weight: 		normal;
  	speak: 				none;
  	display: 			inline-block;
  	text-decoration: 	inherit;
  	width: 				1em;
  	margin-right: 		.2em;
  	text-align: 		center;
  	font-variant: 		normal;
  	text-transform: 	none;
  	line-height: 		1em;
  	margin-left: 		.2em;
}

.icon-mail:before { content: '\e800'; }
.icon-left-big:before { content: '\e801'; }
.icon-left-open:before { content: '\e802'; }
.icon-right-open:before { content: '\e803'; }
.icon-play-circled2:before { content: '\e804'; }
.icon-search:before { content: '\e805'; }
.icon-home:before { content: '\e806'; }
.icon-export:before { content: '\e807'; }
.icon-up-big:before { content: '\e808'; }
.icon-zoom-in:before { content: '\e809'; }
.icon-twitter:before { content: '\f099'; }
.icon-facebook:before { content: '\f09a'; }
.icon-menu:before { content: '\f0c9'; }
.icon-youtube:before { content: '\f16a'; }
.icon-instagram:before { content: '\f16d'; }
.icon-pinterest:before { content: '\f231'; }
.icon-reddit:before { content: '\f281'; }


/* -------------------------------------------------------------------------- */
/* -- HEADER/SECTIONS ------------------------------------------------------- */
.header {
	display: 		flex;
    justify-content: space-between;
    align-items:    center;
	position: 		fixed;
	top: 			0;
	left: 			0;
	z-index: 		200001;
	width: 			100%;
	height: 		48px;
	background: 	#fff;
	box-shadow: 	2px 0px 5px rgba(0,0,0,0.3);
}

.header-icon {
	flex: 				0 0 48px;
	width: 				35px;
	line-height: 		48px;
	font-size: 			20px;
	text-align: 		center;
	color: 				#fff;
}

.header-icon a {
	color: 				#000;
	text-decoration: 	none;
}

.header-logo {
	flex-grow: 			1;
}

.header-logo img {
	display: 			block;
	margin: 			12px auto;
	width:				auto;
	height: 			24px;
}

.body {
	position: 			relative;
	margin-top: 		48px;
}

.content {
	position: 			relative;
	z-index: 			1;
	margin: 			0px;
	height: 			100%;
	padding: 			5px 0px;
}

/* -------------------------------------------------------------------------- */
/* -- MENU OVERLAY ---------------------------------------------------------- */
.menu {
	position: 			fixed;
	top: 				0;
	left: 				-100vw;
	z-index: 			20000;
	width: 				100vw;
	height: 			100vh;
	background-color: 	#fff;
	transition:		 	left 0.3s ease-in-out;
    overflow-y:         auto;
}

.menu ul {
	margin-top: 		46px;
    padding-bottom:     100px;
}

.menu ul li {
	border-bottom: 		1px solid #EEE;
	padding: 			10px 20px;
}

.menu ul h2 {
	margin: 			0px;
	padding: 			0px;
}

.menu ul li a {
	display: 			block;
	color: 				#000;
	text-decoration: 	none;
}

.menu ul li a i {
	margin-right: 		20px;
}

/* -------------------------------------------------------------------------- */
/* -- SEARCH HEADER --------------------------------------------------------- */
.search {
	position: 			fixed;
	top: 				0;
	left: 				100vw;
	z-index: 			20000;
	width: 				100vw;
	height: 			100vh;
	background-color: 	#fff;
	transition:		 	left 0.3s ease-in-out;
}

.search form {
	display: 			block;
	margin: 			66px 10px 20px 10px;
}

.search form input {
	box-sizing: 		border-box;
	width: 				100%;
	background: 		#fff;
	border: 			1px solid #CCC;
	border-radius:		2px;
	box-shadow: 		2px 0px 5px rgba(0,0,0,0.3);
	padding: 			10px 10px 10px 30px;
	color: 				#000;
	font-size: 			1rem;
	line-height: 		1rem;
}

/* -------------------------------------------------------------------------- */
/* -- TOP SEARCHES ---------------------------------------------------------- */
.top-searches {
	list-style-type: 	none;
	margin: 			0px 10px;
}

.top-searches li {
	padding: 			10px 10px;
}

.top-searches li a {
	display: 			block;
	color: 				#000;
	text-decoration: 	none;
}

.page-active {
	left: 				0;
}

/* -------------------------------------------------------------------------- */
/* -- SEARCH AUTOCOMPLETE --------------------------------------------------- */
.aa-input-container {
	position: 			relative;
}

.aa-input-icon {
	position: 			absolute;
	top: 				50%;
	left: 				10px;
	width: 				16px;
	height: 			16px;
	transform: 			translateY(-50%);
	fill: 				#CCC;
}

.autocomplete-suggestions {
    text-align: left; cursor: default; border: 1px solid #ccc; border-top: 0; background: #fff; box-shadow: -1px 1px 3px rgba(0,0,0,.1);
    position: absolute; display: none; z-index: 99999; max-height: 254px; overflow: hidden; overflow-y: auto; box-sizing: border-box;
}
.autocomplete-suggestion { position: relative; border-bottom: 1px solid #ccc; padding: 0 5px; line-height: 25px; overflow: hidden; text-overflow: ellipsis; font-size: 0.8rem; color: #000; }
.autocomplete-suggestion b { font-weight:bold; color: #000; }
.autocomplete-suggestion.selected { background: #f0f0f0; }



/* -------------------------------------------------------------------------- */
/* -- ADVERTISING ----------------------------------------------------------- */
.ad-wrapper-top {
	padding-top: 		10px;
    min-height:         50px;
	text-align:			center;
}

.ad-wrapper-square {
	padding-top: 		10px;
    min-height:         250px;
	text-align:			center;
}

.ad-wrapper-inline {
    margin-top:        20px;
    min-height:        250px;
    text-align:		   center;
}

/* -------------------------------------------------------------------------- */
/* -- HOMEPAGE / CHANNEL PAGE ----------------------------------------------- */
#arrow-overlay-u {
	display: 			none;
	position: 			fixed;
	right: 				0px;
	bottom: 			125px;
	z-index: 			10095;
	width: 				35px;
	height: 			35px;
	background-color:  	#d2232a;
	color: 				#fff;
	opacity: 			0.75;
	font-size: 			24px;
	line-height: 		35px;
	text-align: 		center;
}


/* -------------------------------------------------------------------------- */
/* -- INSTAGRAM GRID LAYOUT ------------------------------------------------- */
.entry-inst-page {
    display:            flex;
    flex-wrap:          wrap;
    justify-content:    space-around;
}

.entry-inst {
    box-sizing:         border-box;
    flex:               0 0 33.33%;
}

.entry-inst img {
	display: 			block;
	width: 				100%;
	height: 			auto;
}


/* -------------------------------------------------------------------------- */
/* -- TIKTOK GRID LAYOUT ---------------------------------------------------- */
.entry-tiktok {
	position:          relative;
    margin:            1px;
	flex:              0 0 320px;
}

.entry-tiktok img {
	display: 			block;
	width: 				320px;
	height: 			179px;
    border-radius:      10px;
}

.entry-tiktok p {
    margin:             10px 0px 30px 0px;
    padding:            0px 5px;
    line-height:        20px;
    text-overflow:      ellipsis;
    height:             40px;
    overflow:           hidden;

}

.entry-tiktok p a {
	color:             #000;
    text-decoration:   none;
    font-family:       "Roboto", "Arial", sans-serif;
    font-weight:       500;
    font-size:         16px;
}


/* -------------------------------------------------------------------------- */
/* -- ARTICLE CHANNEL LAYOUT ------------------------------------------------ */
.entry {
	position: 			relative;
	margin: 			20px 20px 0px 20px;
	min-height: 		157px;
}

.entry img {
	display: 			block;
	width: 				100%;
	height: 			auto;
}

.entry p.entry-title {
	box-sizing: 		border-box;
	position: 			absolute;
	left: 				0;
	bottom: 			0;
	z-index: 			101;
	width: 				100%;
	height: 			auto;
	padding: 			25px 3px 5px 3px;
	background: 		rgba(0,0,0.0.5); /* Old browsers */
	background: 		linear-gradient(0deg, rgba(0,0,0,0.85) 45%, rgba(0,0,0,0.0) 100%); /* W3C */
	font-size:			14px;
	line-height: 		20px;
    display: 			-webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.entry p.entry-title a {
	color: 				#fff;
	text-decoration: 	none;
}

.entry p.entry-comments {
	position: 			absolute;
	top: 				1px;
	right: 				-3px;
	z-index: 			201;
	width: 				42px;
	height: 			34px;
	background: 		url('/images/site/comment-small.png') top left no-repeat;
	text-align: 		center;
	font-weight: 		bold;
	font-size:			14px;
	line-height: 		26px;
	color: 				#000;
}

/* -------------------------------------------------------------------------- */
/* -- ENTRY OVERLAY --------------------------------------------------------- */
.entry-overlay {
    position: 			absolute;
    top: 				3px;
    left: 				3px;
    z-index: 			101;
    background-color: 	#d2232a;
    padding: 			2px 5px 2px 5px;
    color: 				#fff;
    font-family: 		'Roboto Condensed', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-weight: 		bold;
    font-size: 			20px;
    line-height: 		20px;
    letter-spacing: 	1px;
    text-align: 		center;
}

.entry-overlay-new {
	left: 				auto;
	right: 				5px;
}

/* -------------------------------------------------------------------------- */
/* -- INFINITE SCROLL LOADING ----------------------------------------------- */
.loader img {
	display:			block;
	margin:				21px auto;
}

/* -------------------------------------------------------------------------- */
/* -- TRENDING WEEKLY LAYOUT ------------------------------------------------ */
.article-trending-weekly {
    margin: 			30px 10px 30px 10px;
}

.article-trending-weekly h2 {
    padding:            0px;
}

.entry-top-stories {
	position: 			relative;
	margin-top: 		5px;
	height: 			66px;
	padding: 			5px 5px;
	font-size: 			13px;
	line-height: 		18px;
	word-break: 		break-word;
}

.entry-top-stories img {
	float: 				left;
	margin-right: 		5px;
	width: 				101px;
	height: 			56px;
}

.entry-top-stories span {
	color: 				#d2232a;
	font-weight: 		bold;
}

.entry-top-stories-title {
	display: 			block;
	display: 			-webkit-box;
	height: 			54px;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: 			hidden;
	text-overflow: 		ellipsis;
}

.entry-top-stories a {
	display: 			block;
	color: 				#000;
	text-decoration: 	none;
}

.entry-top-stories a:hover {
	text-decoration: 	underline;
}

/* -------------------------------------------------------------------------- */
/* -- ARTICLE PAGE ---------------------------------------------------------- */
article {
	margin: 			0px;
}

article h1 {
	line-height: 		1.5rem;
}

.article-writer {
    display:            flex;
    justify-content:    space-between;
	margin: 			5px 10px 20px 10px;
	height: 			30px;
	line-height: 		15px;
	font-size: 			12px;
	color: 				#636363;
}

.article-writer img {
	float: 				left;
	margin-right: 		10px;
	width: 				30px;
	height: 			30px;
	border-radius: 		50%;
}

.article-byline {
	font-size: 			15px;
}

.article-writer a, .article-meta a {
	text-decoration: 	none;
	color: 				#969696;
}

.article-writer a.article-writer-social {
	margin-left: 		5px;
	color: 				#4099FF;
}

.article-writer-name {
    flex:               0 0 50%;
    text-align: 		left;
}

.article-meta {
	flex:               0 0 50%;
	height: 			50px;
	text-align: 		right;
}

.article-body {
	margin: 			0px 20px 0px 20px;
	line-height: 		22px;
	text-align: 		justify;
}

.article-body p {
	margin-top:			20px;
}

.article-body hr {
	margin: 			20px 0px 0px 0px;
	height: 			1px;
	border: 			0;
    background: 		#333;
}

.article-body ul {
	margin-left:        20px;
    margin-top:         10px;
}

.article-body ul li {
	margin-top: 		10px;
}

.article-comments {
	margin: 			30px 20px 30px 20px;
    background-color:   #EAEAEA;
    border-radius:      5px;
    padding:            10px;
    text-align:         center;
}

.article-body p.source {
	font-size: 			.75em;
}

#image-main {
    position:           relative;
	margin:				0px;
}

#image-main img {
    display:            block;
	margin: 			0px auto;
	max-width: 			100%;
}

p.image-source {
    position:           absolute;
    left:               0;
    bottom:             0;
    margin:             0;
    background:         rgba(0, 0, 0, 0.5);
    padding:			5px 10px;
    text-align:         left;
    line-height:        12px;
    font-size:          12px;
    font-style:         italic;
    color:              #FFF;
}

p.image-source-embed {
    display:            inline-block;
    margin:             0;
    background:         rgba(0, 0, 0, 0.5);
    padding:			5px 10px;
    text-align:         left;
    line-height:        12px;
    font-size:          12px;
    font-style:         italic;
    color:              #FFF;
}

#video-container {
    position: 			relative;
	margin: 			0px;
	padding-bottom: 	56.25%; /* 16/9 ratio */
    height: 			0;
    overflow: 			hidden;
}

#video-container iframe {
    position: 			absolute;
    top: 				0;
    left: 				0;
    width: 				100%;
    height: 			100%;
}

/* -------------------------------------------------------------------------- */
/* -- OVERRIDE THE PROPORTIONS FOR SINGLE EMBEDS ---------------------------- */
#video-container.video-format-6 {
	margin: 			20px auto 10px auto;
	width: 				320px;
	height: 			320px;
	padding-bottom: 	0px;
}

#video-container.video-format-9 {
	margin: 			20px 0px 10px 0px;
	width: 				100%;
	height: 			250px;
	padding-bottom: 	0px;
}

#video-container.video-format-10 {
	margin: 			20px 0px 10px 0px;
	width: 				100%;
	height: 			350px;
	padding-bottom: 	0px;
}

#video-container.video-format-28 {
	margin: 			20px 0px 10px 0px;
	width: 				100%;
	height: 			350px;
	padding-bottom: 	0px;
}


#image-detail-main {
	display: 			block;
	width: 				100%;
	max-width: 			320px;
}

#description p {
	margin: 			10px;
	text-align: 		justify;
	font-size: 			14px;
	line-height: 		18px;
}

#description p.source {
	margin-top: 		20px;
	font-size: 			11px;
	text-align: 		left;
}

/* -------------------------------------------------------------------------- */
/* -- OVERLAY IMAGE --------------------------------------------------------- */
#overlay-image {
	position: 			fixed;
	left: 				0px;
	top: 				40px;
	z-index: 			30001;
	width: 				100%;
	height: 			100%;
	background-color: 	#000;
	overflow: 			auto;
}

#overlay-image img {
	margin: 			0px auto;
	max-width:			100%;
	max-height:			100%;
}


#overlay-image-close {
	display: 			block;
	position: 			fixed;
	left: 				5px;
	top: 				55px;
	z-index: 			100000;
	background-color: 	#d2232a;
	padding: 			5px;
	color: 				#fff;
	cursor:				pointer;
	text-align: 		center;
	text-decoration: 	none;
	box-shadow: 		0px 0px 2px #000;
}

.overlay-image-hide {
	display: 			none;
}

/* -------------------------------------------------------------------------- */
/* -- OVERLAY VIDEO --------------------------------------------------------- */
#overlay-video {
	position: 			fixed;
	left: 				0px;
	top: 				40px;
	z-index: 			30001;
	width: 				100%;
	height: 			100%;
	background-color: 	#000;
}

#overlay-video-content {
	width: 				100%;
}

#overlay-video-close {
	display: 			block;
	margin:				10px auto 0px auto;
	width: 				150px;
	background-color: 	#d2232a;
	padding: 			5px;
	color: 				#fff;
	cursor:				pointer;
	text-align: 		center;
	text-decoration: 	none;
	text-shadow: 		none;
}

/* -------------------------------------------------------------------------- */
/* -- NOTIFICATION ---------------------------------------------------------- */
#notification {
	position: 			fixed;
	left: 				0px;
	top: 				-50px;
	z-index: 			100001;
	width: 				100%;
	background: 		rgba(210, 35, 42, 0.9);
	font-size: 			18px;
	line-height: 		30px;
	text-align: 		center;
	color: 				#fff;
	transition: 		top 0.25s ease-out;
}

#notification a {
	display: 			block;
	color: 				#fff;
	text-decoration: 	none;
}

#notification.notification-show {
	top: 				48px;
}

/* -------------------------------------------------------------------------- */
/* -- GALLERY --------------------------------------------------------------- */
.gallery {
	position: 			relative;
	margin: 			0px auto;
	width: 				100%;
	height: 			0;
	padding-bottom: 	56.25%;
	overflow: 			hidden;
}

.gallery ul {
	list-style-type: 	none;
	position: 			absolute;
	top: 				0;
	left: 				0;
	margin:			 	0;
	width: 				100%;
	height: 			100%;
	padding: 			0;
	-webkit-transition: -webkit-transform 250ms ease-in-out;
    -moz-transition: 	-moz-transform 250ms ease-in-out;
    -o-transition: 		-o-transform 250ms ease-in-out;
    transition: 		transform 250ms ease-in-out;
	transform: 			translate3d(0%,0%,0%);
}

.gallery ul li {
	position: 			relative;
	display: 			block;
	float: 				left;
	margin: 			0;
	width: 				100%;
	height: 			100%;
	padding: 			0;
	transform: 			translateZ(0);
}

.gallery ul li a {
	text-decoration: 	none;
	color: 				#fff;
}

.gallery ul li > a img {
	display: 			block;
	margin: 			auto auto;
	border: 			none;
	max-height:			100%;
	max-width: 			100%;
}

.gallery-title {
	position: 			absolute;
	box-sizing: 		border-box;
	left: 				0;
	bottom: 			0;
	z-index: 			101;
	width: 				100%;
	height: 			auto;
	padding: 			25px 10px 5px 10px;
	background:			linear-gradient(0deg, rgba(0,0,0,0.85) 45%, rgba(0,0,0,0.0));
	font-size:			16px;
	line-height: 		20px;
}

.gallery-comments {
	position: 			absolute;
	top: 				0px;
	right: 				0px;
	z-index: 			201;
	width: 				59px;
	height: 			44px;
	background: 		url('/images/site/comment.png') top left no-repeat;
	text-align: 		center;
	font-weight: 		bold;
	font-size:			16px;
	line-height: 		38px;
	color: 				#000;
}

.gallery-video-overlay {
	position: 			absolute;
	left: 				50%;
	top: 				50%;
	z-index: 			101;
	margin-top: 		-40px;
	margin-left: 		-40px;
	width: 				80px;
	height: 			80px;
	font-size:			60px;
	line-height: 		80px;
	text-shadow: 		1px 1px #000;
	text-align: 		center;
	color: 				#fff;
}


/* -------------------------------------------------------------------------- */
/* -- GALLERY NAV/OVERLAY --------------------------------------------------- */
.gallery-arrow {
	display: 			block;
	position: 			absolute;
	top: 				50%;
	z-index: 			10001;
	margin-top: 		-10px;
	width: 				30px;
	height: 			20px;
	background: 		rgba(0,0,0,0.5);
	padding: 			10px 0px;
	font-size: 			20px;
	line-height: 		20px;
	color: 				#FFF;
	cursor: 			pointer;
	text-decoration: 	none;
	text-shadow: 		1px 1px 3px #000;
}

.gallery-arrow-prev {
	display: 					none;
	left: 						0px;
	border-top-right-radius: 	2px;
	border-bottom-right-radius: 2px;
}

.gallery-arrow-next {
	right: 						0px;
	border-top-left-radius: 	2px;
	border-bottom-left-radius: 	2px;
}

#gallery-zoom {
	position: 			absolute;
	top: 				0px;
	left: 				0px;
	z-index: 			510;
	width: 				30px;
	height: 			26px;
	display: 			block;
	background-color: 	rgba(0, 0, 0, 0.45);
	padding: 			0px;
	font-size: 			18px;
	line-height: 		26px;
	text-align: 		center;
	text-decoration: 	none;
	color: 				#fff;
}

#gallery-counter {
	position: 			absolute;
	top: 				0px;
	right: 				0px;
	z-index: 			510;
	width: 				60px;
	display: 			block;
	background-color: 	rgba(0, 0, 0, 0.45);
	padding: 			4px 0px;
	color: 				#fff;
	text-align: 		center;
}

/* -------------------------------------------------------------------------- */
/* -- PAGE LAYOUT ----------------------------------------------------------- */
.page-body {
	margin: 			0px 20px 0px 20px;
	line-height: 		22px;
	text-align: 		justify;
}

.page-body h1 {
	margin-left: 		0px;
	padding-left: 		0px;
}

.page-body p {
	margin-bottom:		20px;
}

/* -------------------------------------------------------------------------- */
/* -- BUTTONS --------------------------------------------------------------- */
.button {
	display: 			block;
	margin: 			auto 0 auto auto;
	box-shadow: 		1px 1px 5px 0px rgba(0,0,0,0.3);
	border: 			0px;
	border-radius: 		3px;
	background-color: 	#d2232a;
	padding: 			5px 10px;
	font-size: 			16px;
	color: 				#FFFFFF;
	text-decoration: 	none;
	line-height: 		20px;
	cursor: 			pointer;
    text-transform:     uppercase;
}

.button:hover {
	background-color:   #FFF;
    color:              #d2232a
}

/* -------------------------------------------------------------------------- */
/* -- USER HEADER ----------------------------------------------------------- */
.writer {
	margin: 			10px auto;
	max-width: 			320px;
	height: 			48px;
	border-bottom:		1px solid #999;
	padding-bottom: 	10px;
}

.writer-image {
	float: 				left;
	margin-left: 		10px;
	width: 				48px;
	height: 			48px;
	border-radius: 		50%;
}

.writer-name {
	float: 				left;
	margin-left: 		10px;
}

.writer-name h1 {
	margin: 			0px;
	padding: 			0px;
	line-height: 		28px;
	font-size: 			20px;
}

.writer-name h3 {
	font-size: 			14px;
	line-height: 		20px;
}

.writer-social {
	float: 				right;
	font-size: 			32px;
	line-height: 		48px;
	color: 				#4099FF;
}

/* -------------------------------------------------------------------------- */
/* -- FORM LAYOUT ----------------------------------------------------------- */
.form {
	margin: 			20px auto 60px auto;
}

.form p {
	margin-top:			0px;
	margin-bottom: 		5px;
	padding: 			5px;
}

.form p.form-notes {
	margin: 			0px;
	border: 			0px;
	border-radius: 		0px;
	padding: 			2px 5px;
	font-style: 		italics;
}

.form label {
	display: 			block;
	text-align: 		left;
	font-family: 		'Roboto Condensed', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-weight: 		bold;
	font-size: 			16px;
	line-height: 		20px;
	color: 				#888;
	text-transform: 	uppercase;
}

.form input, .form textarea {
	box-sizing: 		border-box;
	width: 				100%;
	border: 			1px solid #888;
	padding: 			5px;
	font-size: 			14px;
}

.form input[type=submit], .form input[type=button] {
	width: 				auto;
	border: 			none;
	border-radius: 		5px;
	background-color: 	#d2232a;
	color: 				#fff;
	cursor: 			pointer;
}

.form input[type=button].confirm {
	background-color: 	#23d227;
}

.error {
	margin: 			10px 0px 0px 0px;
	background-color: 	#d2232a;
	padding: 			5px;
	font-weight: 		bold;
	color: 				#fff;
}

.success {
	margin: 			10px 0px 0px 0px;
	background-color: 	#23d227;
	padding: 			5px;
	font-weight: 		bold;
	color: 				#fff;
}

/* -------------------------------------------------------------------------- */
/* -- MAILING LIST SIGNUP --------------------------------------------------- */
.overlay-mailing-list {
    display:        none;
    position:       fixed;
    left: 			0px;
    top: 			40px;
    z-index: 		30001;
    width:          100%;
    height:         100%;
    background: 	rgba(255,255,255,0.8);
}

.overlay-mailing-list-block {
    position:           absolute;
    left:               calc(50% - 160px);
    top:                1800px;
	width:              320px;
    border:             1px solid #CCC;
    background-color:   #000;
    color:              #FFF;
    font-size:          1.0rem;
    box-shadow:		 	0 8px 17px 0 rgba(0, 0, 0, 0.2);
    transition:         all 300ms ease-in-out;
}

.overlay-mailing-list-block img {
    display:            block;
    max-width:          320px;
    height:             auto;
}

.overlay-mailing-list-content {
    padding:            0px 20px;
}

.overlay-mailing-list-content h3 {
    margin-top:         10px;
    padding:            0;
    font-size:          1.2rem;
}

.overlay-mailing-list-content p {
    margin-top:         10px;
    font-size:          0.8rem;
}

.mailing-form input {
    box-sizing:         border-box;
    display:            block;

    width:              100%;
    font-size:          1.4rem;
    line-height:        2.0rem;
}

.mailing-form button {
    display:            block;
    margin-top:         10px;
    width:              100%;
    border: 			none;
	border-radius: 		5px;
	background-color: 	#d2232a;
    padding:            5px 10px;
	color: 				#fff;
    font-size:          1.4rem;
    line-height:        2.0rem;
    text-align:         center;
    cursor:             pointer;
}

.overlay-mailing-list-show {
    display:            block;
}

.overlay-mailing-list-content-show {
    top:                20px;
}

/* -------------------------------------------------------------------------- */
/* -- MEDIA QUERY SMALL PHONE ----------------------------------------------- */
@media screen and (max-width: 320px) {

	.entry p.entry-title {
		font-size: 			14px;
	}

	.article-writer-image {
		display: 		none;
	}

}

/* -------------------------------------------------------------------------- */
/* -- MEDIA QUERY LANDSCAPE ------------------------------------------------- */
@media screen and (min-width: 415px) and (orientation: landscape) {

	.adUnits {
		margin: 			0px auto;
		padding: 			30px 0px 0px 0px;
	}

	.entry {
		float: 				left;
		margin: 			30px 2% 0px 2%;
		width: 				46%;
		height: 			auto;
	}

}