/*
Theme Name: Videoclub 2026
Theme URI: http://videoclub.org.uk
Author: TidyThemes
Author URI: http://videoclub.org.uk
Version: 2
License: GNU General Public License
License URI: http://videoclub.org.uk
*/

@font-face {
    font-family: 'tt_commonsbold_italic';
    src: url('fonts/tt_commons_bold_italic-webfont.woff2') format('woff2'),
         url('fonts/tt_commons_bold_italic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'tt_commonsmedium';
    src: url('fonts/tt_commons_medium-webfont.woff2') format('woff2'),
         url('fonts/tt_commons_medium-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'tt_commonsbold';
    src: url('fonts/tt_commons_bold-webfont.woff2') format('woff2'),
         url('fonts/tt_commons_bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'tt_commonsmedium_italic';
    src: url('fonts/tt_commons_medium_italic-webfont.woff2') format('woff2'),
         url('fonts/tt_commons_medium_italic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,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{font-size:100%;font:inherit;padding:0;border:0;margin:0;vertical-align:baseline}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}.clear{clear:both}
.sticky{}.bypostauthor{}.wp-caption{}.wp-caption-text{}.gallery-caption{}.alignright{}.alignleft{}.aligncenter{}

html {
	box-sizing: border-box;
}

*,
*:before,
*:after {
	/* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
	box-sizing: inherit;
}


body {
	background-color: #171717;
	color: #eee;
	line-height: 1.3;
	font-size: 18px;
	font-family: 'tt_commonsmedium', arial, sans-serif;
}
img {
	height: auto;
	max-width: 100% !important;
	display: block;
}
figure {
	max-width: 100% !important;
}
strong {
	font-weight: bold;
}
em {
	font-style: italic;
}
h1 {
	font-family: 'tt_commonsbold', arial, sans-serif;
	font-weight: normal;
	font-size: 30px;
	line-height: 33px;
	margin-bottom: 0.3em;
}
h2 {
	font-family: 'tt_commonsbold', arial, sans-serif;
	font-weight: normal;
	font-size: 30px;
	line-height: 33px;
	margin-bottom: 0.3em;
}
a:link, a:visited {
	transition: 0.5s;
	color: #fff;
	text-decoration: none;
}
a:hover {
	color: #FF002E;
}
a img {
	transition: 0.5s;
}
a:hover img {
	opacity: 0.5;
}

#site-title {
	max-width: 245px;
	position: fixed;
	z-index: 100;
	padding: 15px;
	top: 0;
}

#site-title #logo-static {
	display: none;	
}

#site-title a {
	transition: none;
}
#site-title a:hover img {
	opacity: 1;
}
#site-title.site-title-vc20 {
	max-width: 150px;
	position: fixed;
	z-index: 100;
	padding: 10px;
	top: 0;
}

@media screen and (max-width: 959px) {
	#hamburger {
		display: block;
		float: right;
		z-index: 101;
		position: relative;
		height: 22px;
		width: 22px;
		margin: 24px 65px 0 0;
	}
	#hamburger div {
		background: #fff;
		display: block;
		height: 3px;
		width: 22px;
		margin-bottom: 4px;
		transition:0.5s;
	}
	#hamburger div:nth-child(2) {
		width: 16px;
	}
	#hamburger.active div {
		background: #fff !important;	
	}
	#hamburger div:first-child {
		margin-top: 3px;
	}
	#hamburger div:last-child {
		margin-bottom: 0;	
	}
	#hamburger.active div:first-child {
		margin-top: 10px;
		transform: rotate(315deg);
	}
	#hamburger.active div:nth-child(2) {
		opacity: 0;	
	}
	#hamburger.active div:last-child {
		transform: rotate(225deg);
		margin-top: -14px;
	}
	#menu {
		display: none;
		position: absolute;
		background: #171717;
		width: 100%;
		height: 100vh;
		padding: 15px;
		z-index: 30;
	}
	#menu ul {
		margin-top: 50px;
		padding-top: 100px;
	}
	#menu li {
		border-bottom: 1px solid gray;
		font-size: 35px;
		padding: 5px 0;
	}
	#menu li a  {
		display: block;
	}
	#menu-item-1203, #menu-item-1204, #menu-item-1205 {
		border-bottom: none !important;
		display: inline-block;
		margin: 20px 30px 0 -10px;
	}
	.vc-entrytitle {
		padding-top: 60px !important;
	}
}
.bx-wrapper {
	width: 100%;
	border-bottom: 1px solid #fff;
}
.bx-controls a {
	transition: none;
}
.slider a {

}
.slide-details {
	display: block;
}
.slide-details span {
	display: block;
	font-family: 'tt_commonsbold', arial, sans-serif;
}
.slide-details span.date {
	color: #FF002E;
	font-size: 18px;
}
.slide-details span.title {
	font-size: 30px;
	line-height: 33px;
}
.vcblock {
	clear:both;
}
#vctagline {
	background: #FF002E;
	padding-bottom:65px;
	border-bottom: 1px solid #fff;
}
#vctagline a {
	color: #000;
}
a i {
	margin-left: 0.3em;
}
#vcstrands {
	display: flex;
	flex-wrap: wrap;
}
#vcstrands a {
	width: 50%;
	position: relative;
	border-bottom: 1px solid #fff;
}
#vcstrands a:nth-child(1), #vcstrands a:nth-child(3), #vcstrands a:nth-child(5) {
	border-right: 1px solid #fff;
}
#vcstrands a:nth-child(5), #vcstrands a:nth-child(6) {
	border-bottom: none;
}
#vcstrands a img {
	width: 100%;
	height: 100%;
}
#vcstrands a span.vcstrandtitle {
	position: absolute;
	z-index: 1;
	top: 50%;
	display: block;
	text-align: center;
	width: 100%;
	font-family: 'tt_commonsbold', arial, sans-serif;
}
#vcstrands a span.vcstrandstrap {
	display: none;
}
#vcwhatshap {
	clear: both;
	border-top: 1px solid #fff;
}
#vcwhatshap h2, #vcchannel h2 {
	padding: 20px 15px 15px 15px;
}
.vccontentgrid {
	display: flex;
	flex-wrap: wrap;
}
.vccontentgrid div {
	width: 100%;
	border-top: 1px solid #fff;
}
.vccontentgrid a {
}
.vccontentgrid a img {
	width: 100%;
	border-bottom: 1px solid #fff;
}
.vccontentgrid a span.vcgridtitle {
	padding: 15px;
	display: block;
}
.vccontentgrid a span.vcgridtitle span {
	display: block;
}
.vccontentgrid a span.vcgridtitle span.date {
	color: #FF002E;
}
#mailing {
	background: #FF002E;
	padding-bottom: 30px;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
	clear: both;
}
#mailing img {
	width: 240px;
}
#mailing a {
}
.vcfollow a {
	margin-right: 20px;
	display: inline-block;
}
.vcdesktop {
	display: none;
}
#wrapper {
	margin: 70px 0 0 0;
}
#header {
	position: fixed;
	width: 100%;
	border-bottom: 1px solid #fff;
	z-index: 50;
	background: rgba(23, 23, 23, 1);
	height: 70px;
	top: 0;
}

#header a {
}
#header .sub-menu {
	display: none;
}
.more-link {
	display: block;
	border-top: 1px solid #fff;
	padding: 15px 15px 25px 15px;
}
.more-link a {
	color: #FF002E;
}
.more-link a:hover {
	color: #fff;
}
#footer {
	border-top: 1px solid #fff;
}
#copyright {
	font-size: 12px;
	text-align: center;
	color: rgb(188, 188, 188);
	margin: 50px 0 0 0;
}
#copyright a {
	color: #FF002E;
}
#copyright a:hover {
	color: #fff;
}
#mc_embed_signup_scroll {
	display: flex;
}
#mce-EMAIL, #mc-embedded-subscribe {
	font-family: 'tt_commonsmedium', arial, sans-serif;
	padding: 0 10px !important;
	border: none;
	margin: 5px 0;
	font-size: 18px;
	line-height: 1;
	height: 35px;
	vertical-align: middle;
}
#mce-EMAIL {
	border-radius: 3px 0 0 3px;
}
#mc-embedded-subscribe {
	background: #000;
	color: #fff;
	border-radius: 0 3px 3px 0;
}
#vc-mailing-cols > div {
	margin: 20px 0 0 0;
}
#vc-mailing-cols div:nth-child(1) {
	margin-top: 0;
}
#vc-follow a i {
	margin-left: 0;
}
.vc-entrytitle {
	border-bottom: 1px solid #fff;
}
.vc-entrytitle h1 {
	margin: 0;
}
.archive .vc-entrytitle {
	border-bottom: none;
}
.archive.single-post .vc-entrytitle {
	border-bottom: 1px solid #fff;
}
.entry-content {
}

.entry-content iframe {
	max-width: 100% !important;
}
.entry-content p, .entry-content li  {
	margin: 1em 0;
	font-size: 20px;
}
.entry-content a {text-decoration: underline;}

.entry-content li {
	list-style-type: disc;
	margin: 0.5em;
}
.entry-content ul {
	padding-left: 20px; 
	margin-bottom: 1em;
}
.entry-content h2 {
	font-size: 30px;
	font-weight: normal;
}
.entry-content h3 {
	font-size: 25px;
	font-weight: normal;
}
.entry-content h4 {
	font-size: 20px;
	font-weight: normal;
}

.wp-caption-text {
	font-size: 16px;
	color: #aaa;
	margin: 0.5em 0 2em 0;
}

.vc-padding {
	padding: 15px;
	display: block;
}

.titleinfo-date {
	color: #FF002E;
}

#vc-shares div {
	border-bottom: 1px solid #fff;
}

#vc-shares a i {
	margin-right: 0.5em;
}
.vc-tags a {
	color: #FF002E;
	padding: 5px 0;
	display: block;
}
.vc-tags a:hover {
	color: #fff;
}
.vc-tags p {
	margin-bottom: 0.5em;
}

#vc-navbelow {
	clear: both;
	border-top: 1px solid #fff;
}

.vc-grid-infos span {
	display: block;
	margin: 0 0 0.5em;
}
.vc-grid-infos span.date {
	color: #FF002E;
}
.vc-grid-infos span.event-info {
	color: #FF002E;
}
.vc-grid-infos span.vc-title {
	font-size: 25px;
	line-height: 1.1;
	font-family: 'tt_commonsbold', arial, sans-serif;
}

#vc-subnav {
	margin: 1em 0 0 0;
}
#vc-subnav li.selected a {
	color: #FF002E;
}


#vc-navbelow {
	display: flex;
	flex-wrap: wrap;
}
#vc-navbelow > div {
	width: 50%;
}
#vc-navbelow .nav-next {
	text-align: right;
}


.ChannelGallery {padding-bottom:30px}
.ChannelGallery p {display: none;}
.ChannelGallery figure a, .ChannelGallery figure img {width: 100%;}
.ChannelGallery figure a:hover {border: none;}
.ChannelGallery figcaption {padding: 5px 20px}
@media screen and (min-width: 700px) {
	.ChannelGallery {display: flex;flex-wrap:wrap;}
	.ChannelGallery figure {flex-basis: 33.33%;flex-grow: 0;flex-shrink: 0;}
}


.gallery {
	display: flex;
	flex-wrap: wrap;
}
.gallery figure {
	width: 100%;
}

ul#sub-menu li a {
	padding: 15px 0;
	display: block;	
}
ul#sub-menu li {
	border-bottom: 1px solid #fff;
}

@media screen and (min-width: 960px) {
	#menu {
		display: inherit;
		padding-right: 65px;
	}
	#hamburger {
		display: none;
	}
	.vccontentgrid div {
		width: 33.33%;
	}
	.vccontentgrid a:hover {
		color: #fff;
	}
	.bx-wrapper img {
		width: 66.66%;
		float: left;
		border-right: 1px solid #fff;
	}
	.bx-wrapper .slide-details {
		width: 33.33%;
		float: right;
	}
	.bx-wrapper .bx-pager {
		left: 66.66% /*calc(66.66% + 15px)*/;
	}
	.bx-wrapper a:hover {
		color: #fff;
	}
	#vctagline {
		background: transparent;
	}
	#vctagline a:hover {
		color: #fff;
	}
	#vcstrands {
	}
	#vcstrands a {
		width: 33.33%;
		background: transparent url(./img/bg-static.gif) repeat center center;
		background-size: 200px;
	}
	#vcstrands a:nth-child(1), #vcstrands a:nth-child(2), #vcstrands a:nth-child(4), #vcstrands a:nth-child(5) {
		border-right: 1px solid #fff;
	}
	#vcstrands a:nth-child(3) {
		border-right: none;
	}
	#vcstrands a:nth-child(4) {
		border-bottom: none;
	}
	#vcstrands a:hover img {
		opacity: 0;
	}
	#vcstrands a:hover {
		color: #fff;
	}
	.vcdesktop {
		display: inherit;
	}
	.vcmobile {
		display: none;
	}
	#vctagline a {
		color: #FF002E;
	}
	#site-title {
		position: fixed;
		background: #171717;
		left: 0;
		right: 0;
		width: 100px;
		height: 100vh;
		padding: 5px;
		border-right: 1px solid #fff;
	}
	.admin-bar #site-title {
		top: 32px;
	}
	.admin-bar #pojo-a11y-toolbar {
		margin-top: 32px;
	}
	#site-title a {
		display: block;
		position: relative;
		transform: rotate(-90deg) translate(-140px, -105px);
		width: 300px;
	}
	#site-title:hover #logo-static {
		display: block;
		position: absolute;
		top: 0;
		left: 0;
	}
	#site-title.site-title-vc20 {
		padding: 20px 24px;
	}
	#site-title.site-title-vc20 a {
		transform: inherit;
		width: 150px;	
	}
	#wrapper {
		width: calc(100% - 100px);
		float: right;
		margin: 60px 0 0 0;
	}
	#vcstrands a span.vcstrandtitle {
		font-size: 30px;
		margin-top: -15px;
		transition: 0.5s;
	}
	#vcstrands a span.vcstrandstrap {
		display: block;
		transition: 0.5s;
		opacity: 0;
		position: absolute;
		color: #fff;
		z-index: 1;
		top: calc(50% + 10px);
		text-align: center;
		width: 100%;
		padding: 0 15px;
	}
	#vcstrands a:hover .vcstrandtitle {
		margin-top: -35px;
	}
	#vcstrands a:hover .vcstrandstrap {
		opacity: 1;
	}
	#header {
		text-align: right;
		background: rgba(23, 23, 23, 0.9);
		height: 60px;
	}
	.admin-bar #header {
		top: 32px;
	}
	
	#header li {
		display: inline-block;
		font-size: 20px;
	}
	#header li a {
		display: inline-block;
		padding: 15px 10px;
	}
	#header li a:hover {
		color: #FF002E
	}
	#vcwhatshap h2, #vcchannel h2, #footer h2 {
		text-align: center;
	}
	.vccontentgrid div:nth-child(3n+1),.vccontentgrid div:nth-child(3n+2) {
		border-right: 1px solid #fff;
	}
	.more-link {
		text-align: center;
	}
	#vc-mailing-cols {
		display: flex;
	}
	#vc-mailing-cols > div {
		width: 33.33%;
	}
	#vc-follow {
		text-align: center;
	}
	.entry-content {
		width: 66.66%;
		float: left;
		border-right: 1px solid #fff;
	}
	#sidebar {
		float: right;
		width: 33.33%;
	}
	.channel .entry-content {
		width: 100%;
		float: none;
	}
	.channel #sidebar { 
		float: none;
		width: 100%;
		border-top: 1px solid #fff
	}
	.channel #vc-shares {
		display: flex;
		flex-wrap: wrap
	}
	.channel #vc-shares div {
		width: 50%;
	}
	.channel #vc-shares div:first-child {
		border-right: 1px solid #fff;
	}
	#vc-subnav li {
		display: inline-block;
		margin-right: 1em;
	}
	.gallery.gallery-columns-2 figure {
		width: 50%;
	}
	.gallery.gallery-columns-3 figure {
		width: 33.33%;
	}
	.gallery.gallery-columns-4 figure {
		width: 25%;
	}
	.vc-entrytitle {
		padding-left: 100px !important;
	}
}

@media screen and (min-width: 1200px) {
	h1, h2,
	.slide-details span.title,
	#vcstrands a span.vcstrandtitle {
		font-size: 40px;
		line-height: 40px;
	}
	.vc-padding {
		padding: 25px;
	}
	#site-title {
		width: 125px;	
	}
	#site-title.site-title-vc20 a {
		width: 200px;	
	}
	#wrapper {
		width: calc(100% - 125px);
	}
	#site-title a {
		transform: rotate(-90deg) translate(-210px, -170px);
		width: 460px;
	}
	#vcstrands a span.vcstrandstrap {
		padding: 0 50px;
	}
	#footer h2 {
		font-size: 30px;
	}
	.vc-entrytitle {
		padding-left: 130px !important;
	}
	
}


body.category-days-of-wonder-archive #content {
	background: black url('./img/2149368379.jpeg') repeat-y center top;
	background-size: 100% auto;
	background-attachment: fixed;
}
body.category-days-of-wonder-archive .entry-title {
	text-align: center !important;
}
body.category-days-of-wonder-archive .entry-title img {
	max-width: 300px !important;
	margin: 20px auto 30px auto;
}

.fa-brands {
	display: inline-block;
	vertical-align: text-bottom;
	width: 25px;
	height: 25px;
}
.fa-instagram {
	background: transparent url('./img/icon-instagram.svg') no-repeat center center;
	background-size: contain;
}
.fa-facebook {
	background: transparent url('./img/icon-facebook.svg') no-repeat center center;
	background-size: contain;
}
.fa-twitter {
	background: transparent url('./img/icon-x.svg') no-repeat center center;
	background-size: contain;
}


.calendarpage .post a {
	display: flex;
	align-items: flex-start;
	padding: 20px;
	border-bottom: 1px solid #fff;
}
.calendarpage .post:last-child a {
	border-bottom: none;
}
.calendarpage .post a img {
	width: 30%;
	margin-right: 20px;
	height: auto;
	object-fit: contain;
}

.calendarpage .post a span span {
	display: block;
	font-size: 28px;
	color: #fff;
	transition: 0.5s;
}
.calendarpage .post a span span.cal-date {
	color: #ff002e;
}
.calendarpage .post a:hover span span {
	color: #8d8d8d;
}
.calendarpage .post a:hover span span.cal-date {
	color: #a8001e;
}