@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 ------------------------------------------------------------------ */
* {
    box-sizing:         border-box;
}

html {
	width: 				100%;
	height:				100%;
	overflow-y: 		scroll;
}

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

a {
	color: 				#d2232a;
}

a:focus, a:hover, a:active {
	outline:			none;
}

*:focus {
    outline: 			0;
}

::-webkit-input-placeholder, ::-moz-input-placeholder, ::-ms-input-placeholder {
   color: 				#333;
}
strong {
	font-weight: 		bold;
}

em {
	font-style: 		italic;
}

/* -------------------------------------------------------------------------- */
/* -- SHARED ELEMENTS ------------------------------------------------------- */
main {
    margin:				60px 0px 0px 0px;
}

.container {
	width: 				1046px;
	margin: 			0px auto;
}

.body {
	margin-top: 		10px;
	margin-bottom: 		30px;
	background-color:	#fff;
	padding: 			10px;
}

/* -------------------------------------------------------------------------- */
/* -- HEADERS --------------------------------------------------------------- */
h1 {
	margin: 			0px 0px 10px 0px;
	padding: 			0px;
	font-family: 		'Roboto Condensed', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-weight: 		bold;
	font-size:			38px;
	line-height: 		54px;
	color: 				#333;
}

h2 {
	margin: 			0px;
	box-shadow: 		0 2px 5px 0 rgba(0, 0, 0, 0.25);
	padding: 			5px 5px;
	background-color: 	#000;
	color: 				#fff;
	font-family: 		'Roboto Condensed', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-size:			24px;
	font-weight: 		bold;
	line-height: 		24px;
	letter-spacing:		1px;
	color: 				#fff;
}

h3 {
	margin: 			15px 0px 15px 0px;
	padding: 			0px;
	font-family: 		'Roboto Condensed', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-weight: 		bold;
	font-size:			24px;
	line-height: 		32px;
	color: 				#1E1E1E;
	text-align: 		left;
}

/* -------------------------------------------------------------------------- */
/* -- HEADER ---------------------------------------------------------------- */
header {
	position: 		fixed;
	top: 			0;
	left: 			0;
	z-index: 		200001;
	width: 			100%;
	background: 	rgb(42,42,42);
	background: 	linear-gradient(to bottom, rgba(42,42,42,1) 0%,rgba(4,4,4,1) 100%); /* W3C */
}

.header {
    display:          flex;
    flex-wrap:        nowrap;
    justify-content:  space-between;
    align-items:      center;
    height: 		  40px;
}

.header-logo {
    display:          flex;
    flex-wrap:        nowrap;
    align-items:      center;
}


.header-logo img {
	flex:           0 0 151px;
    margin-top:     3px;
	margin-left: 	20px;
}

.header-logo .header-back-arrow {
    flex:               0 0 30px;
	display: 			block;
	margin: 			0px;
	width: 				30px;
	line-height: 		30px;
	font-size: 			30px;
	text-align: 		left;
	color: 				#fff;
	text-decoration: 	none;
}


/* -------------------------------------------------------------------------- */
/* -- 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'; }
.icon-tiktok:before { content: '\f281'; }

/* -------------------------------------------------------------------------- */
/* -- SOCIAL MEDIA ICONS HEADER --------------------------------------------- */
.social-media {
	flex:                   0 0 160px;
	margin-right: 			5px;
}

a.social-media-icon {
	display: 				inline-block;
	margin-right: 			5px;
	width: 					26px;
	height: 				30px;
	color: 					#999;
	text-decoration: 		none;
	font-size: 				21px;
}

a.social-media-icon:last-child {
	margin-right: 			0px;
}

a.social-media-icon:hover {
	color: 					#fff;
}

a.social-media-icon.icon-twitter {
	margin-right: 			0px;
}

a.social-media-icon.icon-facebook {
	margin-right: 			0px;
}

/* -------------------------------------------------------------------------- */
/* -- SEARCH FORM ----------------------------------------------------------- */
.search {
	flex:                       0 0 520px;
	margin-top: 				1px;
	margin-left: 				40px;
	padding: 					0px;
}

.search form {
	margin: 					0px;
	padding: 					0px;
}

.search form input {
	display: 					inline-block;
	width: 						480px;
	border: 					0px;
	border-top-left-radius: 	3px;
	border-bottom-left-radius: 	3px;
	padding: 					6px 10px;
	color: 						#000;
	font-size: 					14px;
}

.search form button {
	display: 					inline-block;
	margin: 					0px;
	height: 					28px;
	border: 					0px;
	border-top-right-radius: 	3px;
	border-bottom-right-radius: 3px;
	padding: 					5px 5px 7px 5px;
	font-size: 					16px;
	cursor: 					pointer;
	vertical-align: 			bottom;
}

.search form button span.icon-search {
	vertical-align: 			top;
	line-height: 				16px;
}

/* -------------------------------------------------------------------------- */
/* -- SEARCH AUTOCOMPLETE --------------------------------------------------- */
.algolia-autocomplete {
	width: 				480px;
}

.aa-input-container {
	position: 			relative;
}

.aa-input-search {
	box-sizing: 		border-box;
	width: 				100%;
	-webkit-appearance: none;
	-moz-appearance: 	none;
	appearance: 		none;
}

.aa-input-search::-webkit-search-decoration, .aa-input-search::-webkit-search-cancel-button, .aa-input-search::-webkit-search-results-button, .aa-input-search::-webkit-search-results-decoration {
	display: 			none;
}

.aa-dropdown-menu {
	box-sizing: 		border-box;
	border: 			1px solid #EEE;
	background-color: 	#fff;
}

.aa-suggestion {
	border-bottom:		1px solid #EEE;
	padding: 			5px;
	font-size: 			0.8rem;
}

.aa-suggestion a {
	display: 			block;
	text-decoration: 	none;
	color: 				#000;
}

.algolia-autocomplete .aa-dropdown-menu .aa-suggestion em {
	font-weight: 		bold;
	font-style: 		normal;
}

/* -------------------------------------------------------------------------- */
/* -- SITE PAGE HEADER LINKS ------------------------------------------------ */
.site-pages {
	flex:                   0 0 200px;
	margin-left: 			30px;
	line-height: 			30px;
	font-size: 				14px;
	color: 					#fff;
}

.site-pages a {
	color: 					#fff;
}

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

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

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

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

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

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

.menu-active {
	left: 				0;
}

/* -------------------------------------------------------------------------- */
/* -- ADVERTISING ----------------------------------------------------------- */
#vladtv_leaderboard_atf {
    height:                 initial !important;
    min-height:             90px !important;
}

.ad-content {
	margin-top: 			20px;
	text-align: 			center;
	line-height: 			0px;
}

.ad-300 {
	min-height: 			250px;
	text-align: 			center;
	line-height: 			0px;
}

/* -------------------------------------------------------------------------- */
/* -- ARROWS ---------------------------------------------------------------- */
#arrow-overlay-u {
	display:				none;
	position: 				fixed;
	bottom: 				50px;
	right: 					50%;
	z-index: 				100001;
	margin-right: 			-521px;
	width: 					35px;
	height: 				35px;
	background-color:  		#d2232a;
	opacity: 				0.75;
	padding: 				5px 0px 10px 0px;
	color: 					#fff;
	text-align: 			center;
	cursor: 				pointer;
	font-size: 				20px;
}

#arrow-overlay-u:hover {
	opacity: 				1.0;
}

/* -------------------------------------------------------------------------- */
/* -- PAGE NAVIGATION ------------------------------------------------------- */
.nav-pages {
	margin-top: 			10px;
}

.nav-pages ul {
	list-style-type: 		none;
	margin-left: 			0px;
}

.nav-pages ul li {
	display: 				block;
	margin-top: 			10px;
	font-size: 				16px;
	text-transform: 		uppercase;
	border-bottom: 			1px solid #eaeaea;
	padding-bottom: 		10px;
}
.nav-pages ul li a {
	text-decoration: 		none;
}


/* -------------------------------------------------------------------------- */
/* -- COLUMNS --------------------------------------------------------------- */
.flex-column {
    display:            flex;
    flex-wrap:          none;
    justify-content:    space-between;
    align-items:        flex-start;
}

.column-main {
	flex:               0 0 706px;
}

.column-side {
	flex:               0 0 300px;
}

.column-full {
	display: 			flex;
	flex-wrap: 			wrap;
	justify-content:	space-between;
	margin-top: 		20px;
}

.column-shadow {
	box-shadow: 		0 2px 5px 0 rgba(0, 0, 0, 0.26);
	border: 			1px solid #999;
	border-radius: 		2px;
	background-color: 	#fff;
}

/* -------------------------------------------------------------------------- */
/* -- FEATURED IMAGE -------------------------------------------------------- */
.featured {
	position: 			relative;
	width: 				706px;
	height: 			395px;
}

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

.featured img {
	width: 				706px;
	height: 			395px;
}

.featured-exclusive {
	position: 			absolute;
	top: 				5px;
	left: 				5px;
	width: 				160px;
	background-color: 	#d2232a;
	padding: 			4px 0px;
	color: 				#fff;
	font-family: 		'Roboto Condensed', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-weight: 		bold;
	font-size: 			28px;
	line-height: 		28px;
	letter-spacing:		1px;
	text-align: 		center;
}

.featured-title {
	position: 			absolute;
	left: 				0;
	bottom: 			0;
	z-index: 			101;
	width: 				100%;
	height: 			150px;
	background:			linear-gradient(0deg, rgba(0,0,0,0.85) 45%, rgba(0,0,0,0.0));
}

.featured-title h2 {
	position: 			absolute;
	display: 			block;
	left: 				10px;
	bottom: 			30px;
	background: 		none;
	font-weight: 		normal;
	font-size:			30px;
	line-height: 		38px;
	text-shadow: 		1px 1px 1px #000;
	box-shadow: 		none;
}

.featured:hover .featured-title h2 {
	text-decoration: 	underline;
}

.featured-date {
	position: 			absolute;
	display: 			block;
	bottom: 			5px;
	right: 				15px;
	font-size: 			14px;
	color: 				#fff;
}

.featured-meta {
	position: 			absolute;
	display: 			block;
	bottom: 			5px;
	left: 				15px;
	font-size: 			14px;
	color: 				#fff;
}

.featured a.featured-comment {
	display: 			inline !important;
}


/* -------------------------------------------------------------------------- */
/* -- TOP STORIES LAYOUT ---------------------------------------------------- */
.entry-top-stories {
	position: 			relative;
	margin-top: 		5px;
	height: 			66px;
	padding: 			5px 5px;
	font-size: 			13px;
	line-height: 		18px;
	word-break: 		break-word;
	box-shadow: 		0 2px 5px 0 rgba(0, 0, 0, 0.25);
	border: 			1px solid #999;
	border-radius: 		2px;
	background-color: 	#fff;
	transition: 		box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.entry-top-stories:hover {
	box-shadow:		 	0 8px 17px 0 rgba(0, 0, 0, 0.2);
}

.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: 				#646464;
	text-decoration: 	none;
}

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

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

.trending-weekly {
    display:            flex;
    justify-content:    space-between;
    flex-wrap:          wrap;
}

.entry-trending-weekly {
    width:              350px;
    font-size: 			15px;
}

/* -------------------------------------------------------------------------- */
/* -- HOMEPAGE TRENDING LAYOUT ---------------------------------------------- */
.top-stories-home #trending-content {
	min-height: 		287px;
}

/* -------------------------------------------------------------------------- */
/* -- ARTICLE PAGE TRENDING LAYOUT ------------------------------------------ */
.article-trending {
	margin: 			10px 0px 0px 0px;
}

/* -------------------------------------------------------------------------- */
/* -- HEADER TIP ------------------------------------------------------------ */
.entry-graphic-tip {
	margin-top: 		5px;
	padding: 			7px 5px 6px 5px;
	box-shadow: 		0 2px 5px 0 rgba(0, 0, 0, 0.25);
	border: 			1px solid #999;
	border-radius: 		2px;
	background-color: 	#fff;
	text-align: 		center;
}

.entry-graphic-tip img {
	display: 			block;
	margin: 			0px auto;
}

/* -------------------------------------------------------------------------- */
/* -- INSTAGRAM GRID LAYOUT ------------------------------------------------- */
.entry-inst {
	position:          relative;
    margin:            1px;
	flex:              0 0 340px;
}

.entry-inst img {
	display: 			block;
	width: 				340px;
	height: 			340px;
}

/* -------------------------------------------------------------------------- */
/* -- 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 GRID LAYOUT --------------------------------------------------- */
.entry {
	position: 			relative;
	flex: 				0 0 320px;
	margin-bottom: 		29px;
	box-shadow: 		0 2px 5px 0 rgba(0, 0, 0, 0.25);
	border: 			1px solid #999;
	border-radius: 		2px;
	background-color: 	#fff;
	transition: 		box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.entry-blank {
	flex: 				0 0 320px;
	margin-bottom: 		29px;
	visibility: 		hidden;
}

.entry:hover {
	box-shadow:		 	0 8px 17px 0 rgba(0, 0, 0, 0.2);
}

.entry img {
	display: 			block;
	width: 				320px;
	height: 			179px;
}

.entry-ad {
	width: 				320px;
	height: 			261px;
	padding: 			0px 10px;
	text-align: 		center;
	line-height: 		0px;
}

.entry-ad img {
	width: 				300px;
	min-height: 		250px;
}

.entry p.entry-title {
    display: 			-webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
	height: 			58px;
	font-size: 			14px;
	line-height: 		24px;
	overflow: 			hidden;
}

.entry p.entry-title a {
	display: 			block;
    padding: 			5px 3px;
	color: 				#000;
	text-decoration: 	none;
}

.entry:hover p.entry-title a {
	text-decoration: 	underline;
}

.entry p.entry-meta {
	padding: 			5px;
	color: 				#969696;
	font-size: 			12px;
	line-height: 		12px;
}

.entry p.entry-meta a {
	color: 				#969696;
	text-decoration: 	none;
}

.entry p.entry-date {
	position: 			absolute;
	right: 				5px;
	bottom: 			5px;
	color: 				#969696;
	font-size: 			12px;
	line-height: 		12px;
}

.entry-recent {
	color: 				#d2232a;
}

/* -------------------------------------------------------------- */
/* -- 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: 				3px;
}

/* -------------------------------------------------------------------------- */
/* -- ARTICLE COLUMN LAYOUT ------------------------------------------------- */
.entry-column {
	width: 				298px;
	margin-top: 		10px;
}

.entry-column img {
	width: 				298px;
	height: 			167px;
}

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


/* --------------------------------------------------------- */
/* -- NOTIFICATION ----------------------------------------- */
#notification {
    position: 			fixed;
	left: 				0px;
	top: 				-30px;
	z-index: 			100001;
	width: 				100%;
	background: 		rgba(210, 35, 42, 0.9);
	color: 				#fff;
	transition: 		top 0.25s ease-out;

}

#notification a {
    display: 			block;
	padding: 			5px 0px;
	line-height: 		20px;
	text-align: 		center;
	color: 				#fff;
	cursor: 			pointer;
	text-decoration: 	none;
}

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

/* -------------------------------------------------------------------------- */
/* -- 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
}

.banner {
    display:            block;
    width:              100%;
    max-width:          100%;
    height:             auto;
}

/* -------------------------------------------------------------------------- */
/* -- LOADING ANIMATION ----------------------------------------------------- */
.loader {

}

.loader img {
	display:			block;
	margin:				21px auto;
}

/* -------------------------------------------------------------------------- */
/* -- INFORMATIONAL PAGE LAYOUT --------------------------------------------- */
#page-info {
	margin-top: 		5px;
	background-color: 	#bfbfbf;
	padding: 			5px;
	font-size: 			12px;
}

#page-info p {
	margin: 			10px 0px;
}

#page {
	padding-bottom: 	30px;
}

#page ul {
	margin-left: 		30px;
}

#page ul li {
	margin-top: 		10px;
}

#page p {
	margin-top: 		15px;

}

/* -------------------------------------------------------------------------- */
/* -- DETAIL PAGE ----------------------------------------------------------- */
.article-writer {
    display:            flex;
    justify-content:    space-between;
	margin-top: 		5px;
	margin-bottom: 		20px;
	height: 			50px;
	line-height: 		25px;
	font-size: 			14px;
	color: 				#636363;
}

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

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

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

.article-byline {
	margin: 			0px;
	font-weight: 		normal;
	font-size: 			20px;
	line-height: 		25px;
	color: 				#636363;
}

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

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

.article-content {
    margin-top: 		20px;
    display:            flex;
    align-items:        flex-start;
}

.article-social-media {
	flex:               0 0 30px;
    align-self:         flex-start;
    position:           sticky;
    top:                55px;
    margin-top:         20px;
}

.article-body {
    flex:               0 0 646px;
    display: 			block;
    margin-top:         20px;
	margin-left: 		20px;
	text-align:			justify;
	font-size: 			16px;
	line-height: 		20px;
}

.article-body p {
	margin-bottom:		20px;
	text-align: 		justify;
}

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

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

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

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

#image-main img {
    display:            block;
	margin: 			0px auto;
}

#image-main h2 {
	margin:				5px 0px;
	font-size: 			18px;
	font-weight: 		bold;
}

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;
}

.article-inline-image {
    display:            block;
    margin:             0px auto;
    max-width:          100%;
    height:             auto;
}

/* -------------------------------------------------------------------------- */
/* -- DETAIL VIDEO EMBED ---------------------------------------------------- */
#video-container, .article-inline-video {
    position: 			relative;
	margin: 			0px auto;
	padding-bottom: 	56.25%; /* 16/9 ratio */
    height: 			0;
	background-color: 	#000;
    overflow: 			hidden;
}

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

/* -- OVERRIDE THE PROPORTIONS FOR SINGLE EMBEDS ---------------------------- */
#video-container.video-format-3 {
	width: 				706px;
	height: 			420px;
	padding-bottom: 	0px;
}

#video-container.video-format-6 {
	margin: 			0px auto;
	width: 				600px;
	height: 			600px;
	padding-bottom: 	0px;
}

#video-container.video-format-9 {
	width: 				706px;
	height: 			250px;
	padding-bottom: 	0px;
}

#video-container.video-format-10 {
	width: 				706px;
	height: 			350px;
	padding-bottom: 	0px;
}

#video-container.video-format-15 {
	margin: 			0px auto;
	width: 				706px;
	height: 			152px;
	padding-bottom: 	0px;
}

#video-container.video-format-19 {
	margin: 			0px auto;
	width: 				366px;
	height: 			592px;
	padding-bottom: 	0px;
}

#video-container.video-format-28 {
	margin: 			0px auto;
	width: 				366px;
	height: 			592px;
	padding-bottom: 	0px;
}


/* -------------------------------------------------------------------------- */
/* -- OVERLAY VIDEO --------------------------------------------------------- */
#overlay-video-content {
    display:            flex;
    justify-content:    center;
    align-items:        center;
    width: 				100%;
	height: 			100%;
}

#overlay-video-content #video-container {
    position: 			relative;
	margin: 			0px auto;
    width:              1024px;
    height: 			576px;
	background-color: 	#000;
    padding:            0;
    overflow: 			hidden;
}

/* -------------------------------------------------------------------------- */
/* -- OVERRIDE THE PROPORTIONS FOR SINGLE EMBEDS ---------------------------- */
#content-embed {
	margin: 			10px 0px;
	width: 				706px;
	text-align:			center;
}

#content-embed div {
	margin: 			0px auto;
}

.instagram-media {
	margin: 			0px auto !important;
}

/* -------------------------------------------------------------------------- */
/* -- ARTICLE SOCIAL MEDIA -------------------------------------------------- */
.sharing-buttons {
	margin: 			0;
	list-style-type: 	none;
	padding: 			0;
}

.sharing-buttons li {
	display: 				block;
	margin-bottom: 			10px;
	width: 					30px;
	height: 				30px;
	border-radius: 			15px;
	box-shadow: 			0 1px 2px 0 rgba(0, 0, 0, 0.25);
	transition: 			box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.sharing-buttons li:hover {
	box-shadow: 			0 2px 5px 0 rgba(0, 0, 0, 0.25);
}

.sharing-buttons li a {
	display:				inline-block;
    width: 					30px;
    height: 				30px;
    color: 					#fff;
	font-size: 				15px;
	line-height: 			30px;
	text-decoration: 		none;
	text-align: 			center;
}

.sm-facebook {
	background-color: 		#3b5998;
}

.sm-twitter {
	background-color: 		#4099FF;
}

.sm-reddit {
	background-color: 		#FF4500;
}

.sm-pinterest {
	background-color: 		#CB2027;
	padding-left: 			1px;
}

.sm-google {
	background-color: 		#DE5A49;
    padding-top: 		    1px;
	padding-left: 			2px;
}

.sm-email {
	background-color: 		#F76700;
	padding-left: 			1px;
	padding-bottom: 		2px;
}


/* -------------------------------------------------------------------------- */
/* -- 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:			18px;
	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;
}

/* --------------------------------------------------------- */
/* -- DETAIL GALLERY OVERLAY ------------------------------- */
#gallery-overlay {
	display: 				none;
	position:				fixed;
    top:					0;
    left:					0;
	z-index: 				300001;
    width:					100%;
    height:					100%;
    background-color: 		rgba(255, 255, 255, 0.75);
    text-align:				center;
}

.gallery-overlay-box {
	position: 				relative;
	margin: 				0px auto;
	width: 					700px;
	height: 				550px;
	box-shadow: 			0px 0px 10px #999;
	border-radius: 			10px;
	background-color: 		#fff;
	padding: 				0px 20px;
}

#gallery-overlay img {
	margin: 				0px auto;
	box-shadow: 			0px 0px 10px #CCC;
	border-radius: 			10px;
	background-color: 		#fff;
	padding: 				40px;
}

#gallery-close {
	position: 				absolute;
	top: 					10px;
	right: 					10px;
	z-index: 				300002;
	width: 					30px;
	line-height: 			30px;
	font-size: 				20px;
	font-weight: 			bold;
	text-align: 			center;
	text-decoration: 		none;
	border: 				1px solid #999;
	border-radius: 			15px;
	color: 					#999;
}

#gallery-close:hover {
	background-color:		#999;
	color: 					#fff;
}

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

.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: 				40px;
	height: 			40px;
	display: 			block;
	background-color: 	rgba(0, 0, 0, 0.45);
	padding: 			0px;
	font-size: 			18px;
	line-height: 		40px;
	text-align: 		center;
	text-decoration: 	none;
	color: 				#fff;
}

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


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

#overlay-image {
    display:            flex;
    justify-content:    center;
    align-items:        center;
    width: 				100%;
	height: 			100%;
}

#overlay-image img {
	margin: 			0px auto;
	width:			    auto;
	height:			    75vh;
}

#overlay-image-close {
	display: 			block;
	position: 			fixed;
	right: 				55px;
	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;
}



/* -------------------------------------------------------------------------- */
/* -- 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 {
    display:            flex;
    flex-wrap:          nowrap;
    justify-content:    flex-start;
    align-items:        center;
    position:           absolute;
    left:               calc(50% - 400px);
    top:                1800px;
	width:              800px;
    border:             1px solid #CCC;
    background-color:   #000;
    color:              #FFF;
    font-size:          1.2rem;
    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:          400px;
    height:             auto;
}

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

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

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

.mailing-form input {
    display:            block;
    width:              100%;
    font-size:          1.4rem;
    line-height:        2.0rem;
    padding:            0px 10px;

}

.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:                100px;
}


/* -------------------------------------------------------------------------- */
/* -- USER HEADER ----------------------------------------------------------- */
.writer {
	margin-bottom: 		15px;
	height: 			70px;
	border-bottom:		1px solid #999;
	padding-bottom: 	15px;
}

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

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

.writer-name h1 {
	margin-bottom: 		0px;
	line-height: 		50px;
}

.writer-name h3 {
	margin: 			0px;
	font-size: 			18px;
	line-height: 		20px;
}

.writer-social {
	font-size: 			18px;
	line-height: 		20px;
	color: 				#4099FF;
}


/* -------------------------------------------------------------------------- */
/* -- FORM LAYOUT ----------------------------------------------------------- */
.form {
	margin: 			20px auto;
	width: 				80%;
}

.form p {
	padding: 			5px;
}

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

.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;
}

.form-legal {
	margin: 			0px;
	background-color: 	#EEE;
	padding: 			5px;
	font-style: 		italic;
}

.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;
}

/* -------------------------------------------------------------------------- */
/* -- MRCHANDISE POST ------------------------------------------------------- */
.products {
	display: 			flex;
	flex-wrap: 			wrap;
	justify-content: 	space-between;
}

.product {
	flex: 				0 0 50%;
	margin: 			20px 0px;
	text-align: 		center;
}

.product img {
	display: 			block;
	width: 				100%;
	max-width: 			90%;
	height: 			auto;
}

.product a {
	text-decoration: 	none;
}

.product h3 {
	margin: 			10px 0px;
	font-size:			1.4rem;
	text-align: 		center;
}

.product p {
	color: 				#666;
	text-align: 		center !important;
}

/* -------------------------------------------------------------------------- */
/* -- QUANTCAST GDPR CONSENT ------------------------------------------------ */
.qc-cmp-button {
	background-color: 	#d2232a !important;
	border-color: 		#d2232a !important;
}
.qc-cmp-button:hover {
	background-color: 	transparent !important;
		border-color: 	#d2232a !important;
}
.qc-cmp-alt-action, .qc-cmp-link {
	color: 				#d2232a !important;
}
.qc-cmp-button {
	color: #333333 		!important;
}
.qc-cmp-button.qc-cmp-secondary-button {
	color: 				#999999 !important;
}
.qc-cmp-button.qc-cmp-button.qc-cmp-secondary-button:hover {
	color:				#ffffff !important;
}
.qc-cmp-button.qc-cmp-secondary-button {
	border-color: 		#333333 !important;
	background-color: 	transparent !important;
}
.qc-cmp-button.qc-cmp-secondary-button:hover {
	background-color: 	#333333 !important;
}
.qc-cmp-ui, .qc-cmp-ui .qc-cmp-main-messaging, .qc-cmp-ui .qc-cmp-messaging, .qc-cmp-ui .qc-cmp-beta-messaging,
.qc-cmp-ui .qc-cmp-title, .qc-cmp-ui .qc-cmp-sub-title, .qc-cmp-ui .qc-cmp-purpose-info,
.qc-cmp-ui .qc-cmp-table, .qc-cmp-ui .qc-cmp-table-header, .qc-cmp-ui .qc-cmp-vendor-list,
.qc-cmp-ui .qc-cmp-vendor-list-title {
	color: 				#000000 !important;
}
.qc-cmp-ui a, .qc-cmp-ui .qc-cmp-alt-action {
	color: 				#d2232a !important;
}
.qc-cmp-ui {
	background-color: 	#ffffff !important;
}
.qc-cmp-publisher-purposes-table .qc-cmp-table-header {
	background-color: 	#fafafa !important;
}
.qc-cmp-publisher-purposes-table .qc-cmp-table-row {
	background-color: 	#ffffff !important;
}
.qc-cmp-small-toggle.qc-cmp-toggle-on, .qc-cmp-toggle.qc-cmp-toggle-on {
	background-color: 	#999999 !important;
	border-color: 		#999999 !important;
}