/*.
	Theme Name: Automotive Online New
	Description: New theme for Automotive Online 
	Version: 2.0
	Author: Damian Tomaszewski
*/

/* CSS reset */

* { box-sizing: border-box; margin: 0; padding: 0;}


/* General classes */

@font-face
{
	font-family: 'LyonText';
	src: url(fonts/LyonText-Regular.woff2) format('woff2'),
			url(fonts/LyonText-Regular.woff) format('woff'),
			url(fonts/LyonText-Regular.ttf) format('truetype'),
			url(fonts/LyonText-Regular.otf) format('opentype');
	font-style: normal;
	font-weight: 400;
}
@font-face
{
	font-family: 'LyonText';
	src: url(fonts/LyonText-RegularItalic.woff2) format('woff2'),
			url(fonts/LyonText-RegularItalic.woff) format('woff'),
			url(fonts/LyonText-RegularItalic.ttf) format('truetype'),
			url(fonts/LyonText-RegularItalic.otf) format('opentype');
	font-style: italic;
	font-weight: 400;
}
@font-face
{
	font-family: 'LyonText';
	src: url(fonts/LyonText-BoldItalic.woff2) format('woff2'),
			url(fonts/LyonText-BoldItalic.woff) format('woff'),
			url(fonts/LyonText-BoldItalic.ttf) format('truetype'),
			url(fonts/LyonText-BoldItalic.otf) format('opentype');
	font-style: italic;
	font-weight: 700;
}
@font-face
{
	font-family: 'LyonText';
	src: url(fonts/LyonText-Bold.woff2) format('woff2'),
			url(fonts/LyonText-Bold.woff) format('woff'),
			url(fonts/LyonText-Bold.ttf) format('truetype'),
			url(fonts/LyonText-Bold.otf) format('opentype');
	font-style: normal;
	font-weight: 700;
}
@font-face
{
	font-family: 'Ciutadella';
	src: url(fonts/CiutadellaSlab-Rg.woff2) format('woff2'),
			url(fonts/CiutadellaSlab-Rg.woff) format('woff'),
			url(fonts/CiutadellaSlab-Rg.ttf) format('truetype'),
			url(fonts/CiutadellaSlab-Rg.otf) format('opentype');
	font-style: normal;
	font-weight: 400;
}
@font-face
{
	font-family: 'Ciutadella';
	src: url(fonts/CiutadellaSlab-Md.woff2) format('woff2'),
			url(fonts/CiutadellaSlab-Md.woff) format('woff'),
			url(fonts/CiutadellaSlab-Md.ttf) format('truetype'),
			url(fonts/CiutadellaSlab-Md.otf) format('opentype');
	font-style: normal;
	font-weight: 500;
}
@font-face
{
	font-family: 'Ciutadella';
	src: url(fonts/CiutadellaSlab-SmBd.woff2) format('woff2'),
			url(fonts/CiutadellaSlab-SmBd.woff) format('woff'),
			url(fonts/CiutadellaSlab-SmBd.ttf) format('truetype'),
			url(fonts/CiutadellaSlab-SmBd.otf) format('opentype');
	font-style: normal;
	font-weight: 600;
}
@font-face
{
	font-family: 'Ciutadella';
	src: url(fonts/CiutadellaSlab-Bd.woff2) format('woff2'),
			url(fonts/CiutadellaSlab-Bd.woff) format('woff'),
			url(fonts/CiutadellaSlab-Bd.ttf) format('truetype'),
			url(fonts/CiutadellaSlab-Bd.otf) format('opentype');
	font-style: normal;
	font-weight: 700;
}
@font-face
{
	font-family: 'CachetPro';
	src: url(fonts/CachetPro-Book.woff2) format('woff2'),
			url(fonts/CachetPro-Book.woff) format('woff'),
			url(fonts/CachetPro-Bold.ttf) format('truetype'),
			url(fonts/CachetPro-Book.otf) format('opentype');
	font-style: normal;
	font-weight: 400;
}
@font-face
{
	font-family: 'CachetPro';
	src: url(fonts/CachetPro-Medium.woff2) format('woff2'),
			url(fonts/CachetPro-Medium.woff) format('woff'),
			url(fonts/CachetPro-Medium.ttf) format('truetype'),
			url(fonts/CachetPro-Medium.otf) format('opentype');
	font-style: normal;
	font-weight: 500;
}
@font-face
{
	font-family: 'CachetPro';
	src: url(fonts/CachetPro-Bold.eot);
	src: url(fonts/CachetPro-Bold.eot?#iefix) format('embedded-opentype'),
			url(fonts/CachetPro-Bold.woff) format('woff'),
			url(fonts/CachetPro-Bold.ttf) format('truetype'),
			url(fonts/CachetPro-Bold.svg#2a2f829e72bf994bf9dd7ebc30f4f7c8) format('svg');
	font-style: normal;
	font-weight: 700;
}
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
:root
{
	--main-bkg: #FFFFFF;
	--menu-links: #333333;
	--light-bkg: #F3F3F3;
	--text-color: #000000;
	--text-dark-color: #2A2A2A;
	--accent: #C2191A;
	--accent-dark: #780F10;
	--accent-light: #C2191A;
	--accent-premium: #19A113;
	--branding-primary: #C2191A;
	--branding-secondary: #AE9962;
	--light: #E9E9E9;
	--footer-bkg: #333333;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	background: #FFF;
	color: black;
	font-family: 'Avenir', sans-serif;
	font-size: 1rem;
}
/*@media (prefers-color-scheme: dark)
{
	:root
	{
		--main-bkg: #121212;
		--menu-links: #EFEFEF;
		--light-bkg: #111111;
		--text-color: #EFEFEF;
		--text-dark-color: #111111;
	}
	.body-text a:not([class])
	{
		font-weight: 500;
	}
}*/

body.dark
{
	--main-bkg: #121212;
	--menu-links: #e9e9e9;
	--light-bkg: #111111;
	--text-color: #e9e9e9;
	--text-dark-color: #111111;
}

img { max-width: 100%; }
html { background-color: var(--main-bkg); }
body
{
	background-color: var(--main-bkg);
	color: var(--text-color);
	font-size: 0.875rem;
	font-weight: 500;
	letter-spacing: 0.04em;
	line-height: 1.4;
}
body.dark figcaption
{
	color: #EEEEEE;
}
a
{
	color: inherit;
	text-decoration: none;
}
p
{
	letter-spacing: 0.04em;
}
h1, h2, h3, h4, h5, h6 { color: var(--menu-links); font-family: "Ciutadella", serif;}
h1 { font-size: 1.7rem; line-height: 1.25em; }
h2 { font-size: 1.2rem; line-height: 1.3em; }
h3 { font-size: 1.125rem; line-height: 1.4em; }
h4 { font-size: 1rem; }
h5 { font-size: .9rem; }
h6 { font-size: .9rem; }
@media(min-width: 768px)
{
	h1 { font-size: 1.2rem; line-height: 1.25em; }
	h2 { font-size: .9rem; line-height: 1.3em; }
	h3 { font-size: 1.125rem; line-height: 1.4em; }
	h4 { font-size: 1rem; }
	h5 { font-size: .9375rem; }
	h6 { font-size: .9rem; }
}
@media(min-width: 1024px)
{
	h1 { font-size: 2rem; line-height: 1.25em; }
	h2 { font-size: 1rem; line-height: 1.3em; }
	h3 { font-size: .975rem; line-height: 1.4em; }
	h4 { font-size: .925rem; }
	h5 { font-size: .9375rem; }
	h6 { font-size: .9rem; }
}
@media(min-width: 1282px)
{
	h1 { font-size: 2rem; line-height: 1.25em; }
	h2 { font-size: 1.25rem; line-height: 1.3em; }
	h3 { font-size: 1rem; line-height: 1.4em; }
	h4 { font-size: .9875rem; }
	h5 { font-size: .9375rem; }
	h6 { font-size: .9rem; }
}
@supports (contain-intrinsic-size: auto)
{
	img:is([sizes="auto" i], [sizes^="auto," i])
	{
        contain-intrinsic-size: 3000px 1500px;
    }
}
input { accent-color: var(--accent-dark); }
dd,dt{ color: var(--text-color); }
.highlight h2 { font-size: 1.125rem; }
@media(min-width: 768px)
{
	.highlight h2 { font-size: 1.75rem; }
}
.body-text h2
{
	color: var(--branding-primary);
	font-family: 'LyonText', serif;
	font-size: inherit;
	margin-top: 1.5rem;
}
body.dark .body-text h2
{
	color: #E03132;
}
.body-text a:not([class])
{
	border-bottom: 1px solid rgba(0,0,0,0.1);
	color: var(--branding-primary);
}
body.post-template-ptl-partnercontent .body-text a:not([class]),
body.post-template-ptl-partnercontent.dark .body-text a:not([class])
{
	color: #999;
}
body.post-template-ptl-partnercontent.dark .body-text a:not([class])
{
	text-decoration: underline;
}
body.dark .body-text a:not([class])
{
	color: #E03132;
}
.body-text .sidenote a:not([class])
{
	color: var(--text-color);
}
.body-text a:not([class]):hover
{
	border-bottom-color: var(--branding-primary);
}
.body-text p,
.body-text ul,
.body-text table
{
	color: var(--text-color);
	margin-bottom: 1.5rem;
}
.body-text ul
{
	margin-left: 1.5rem;
}
.pmgsub-gift-prompt,
#meta-bottom.meta .author-info,
#meta-bottom.meta .author-info a
{
	color: var(--text-color);
	display: inline;
}
.pmgsub-gift-prompt
{
	display: block;
}

div.advertisement { text-align: center; }
.advertisement.billboard { margin-top: .5rem; }
@media(max-width: 767px)
{
	.advertisement.billboard { display: none; }
}
.content-wrapper h1,
.content-wrapper h2,
.content-wrapper h3,
.content-wrapper h4,
.content-wrapper h5,
.content-wrapper h6
{
	margin-bottom: 1.5rem;
}
.meta h2
{
	-webkit-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;
	word-wrap: break-word;
}

.pillar
{
	margin: 0 auto;
	max-width: 1282px;
	padding-inline: 16px;
	position: relative;
}

@media(min-width: 768px)
{
	.pillar
	{
		max-width: 750px;
		padding-inline: 0;
	}
}

@media(min-width: 1024px)
{
	.pillar
	{
		max-width: 1000px;
		padding-inline: 0;
	}
}

@media (min-width: 1282px)
{
	.pillar
	{
		max-width: 1250px;
		padding-inline: 0;
	}
}

/* Header */

#site-header
{
	margin-bottom: 2rem;
}
#topbar
{
	background-color: #000;
	display: none;
	width: 100%;
}

@media(min-width: 768px)
{
	#topbar
	{
		display: inline-block;
	}
}

.menu
{
	display: flex;
	flex-direction: column;
	list-style-type: none;
}
@media(min-width: 768px)
{
	.menu
	{
		flex-direction: row;
		justify-content: flex-end;
	}
}
.menu li { display: flex; }
.menu a,
#topbar .menu a
{
	color: var(--light);
	padding: .25rem 1rem;
	text-decoration: none;
}
#main-menu .menu a
{
	font-family: 'Avenir', sans-serif;
	margin-top: .05rem;
	padding-block: .5rem;
}
#navbar .menu a
{
	color: var(--menu-links);
}
#navbar
{
	padding-block: 1rem;
}
#navbar > .pillar
{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
}
#navbar form,
#navbar nav
{
	align-content: center;
}
#nav-meta
{
	display: none;
}
#mode-switch-name
{
	border-bottom: 1px solid #ddd;
	border-top: 1px solid #ddd;
	color: var(--text-color);
	font-size: .6rem;
	padding-block: .7rem;
	text-transform: uppercase;
	white-space: nowrap;
}
.current-user
{
	text-overflow: ellipsis;
	text-transform: capitalize;
	white-space: nowrap;
}
@media(min-width: 768px)
{
	#nav-meta
	{
		display: inherit;
	}	
}
#searchform
{
	display: none;
}
.search-results #searchform
{
	display: inline-block;
}
@media(min-width: 768px)
{
	#searchform
	{
		display: inline-block;
	}
}
.search-form
{
	display: flex;
}
#searchform > div
{
	display: flex;
	flex-direction: row;
}
#searchform button,
.search-form button,
input#searchsubmit
{
	background-color: var(--accent-dark);
	border: 0;
	color: #fff;
	cursor: pointer;
	padding: .5rem .8rem;
}
body.dark #searchform button
{
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}
#searchform input,
.search-form input
{
	background-color: var(--main-bkg);
	color: var(--text-color);
	padding: .5rem 1rem;
}
@media(max-width: 767px)
{
	.page-search #searchform input,
	.page-search .search-form input
	{
		border: 1px solid var(--text-color);
	}
	.page-search .search-form { margin: auto; }
	.page-search .page-title
	{
		margin-bottom: 1rem;
		text-align: center;
	}
}
.search #searchform input[type="submit"],
.search .search-form input[type="submit"]
{
	background-color: var(--accent-dark);
	outline: 1px solid var(--accent-dark);
	color: #ffffff;
}
.search #searchform input[type="text"],
.search .search-form input[type="text"]
{
	border: 1px solid #ddd;
	border-right: 0;
	outline: 0;
}
#searchform input:focus-within,
.search-form input:focus-within
{
	border: 1px solid var(--accent-dark);
	outline: 0;
}
#link-account,
#link-logout,
#link-subscribe,
#link-login
{
	align-items: center;
	display: flex;
	flex-direction: column;
}
#link-account i,
#link-logout i,
#link-subscribe i,
#link-login i
{
	font-size: 1.2rem;
}
#logo-link-dark,
#navigation-subpage a#logo-link-nav-dark
{
	display: none;
}
#logo-link-nav
{
	display: flex;
	margin: auto;
	padding-block: 1rem;
}
/*@media(prefers-color-scheme: dark)
{
	#logo-link { display: none; }
	#logo-link-dark { display: inline-block; }
	#navigation-subpage a#logo-link-nav { display: none; }
	#navigation-subpage a#logo-link-nav-dark { display: flex; justify-content: center; margin: auto; padding-block: 1rem; }
}*/
body.dark
{
	#logo-link { display: none; }
	#logo-link-dark { display: inline-block; }
	#navigation-subpage a#logo-link-nav { display: none; }
	#navigation-subpage a#logo-link-nav-dark { display: flex; justify-content: center; margin: auto; padding-block: 1rem; }
}
#logo-link,
#logo-link-nav
{
	width: max-content;
}
/*@media(prefers-color-scheme: dark)
{
	#logo-link,
	#logo-link-nav
	{
		background: #EFEFEF;
		border-radius: 3px;
		padding: .25rem;
	}
}*/
body.dark
{
	#logo-link,
	#logo-link-nav
	{
		background: #EFEFEF;
		border-radius: 3px;
		padding: .25rem;
	}
}
#main-trigger-mobile,
#search-mobile
{
	align-content: center;
	cursor: pointer;
	color: var(--text-color);
	font-size: 1.3rem;
}
@media(min-width: 768px)
{
	#main-trigger-mobile,
	#search-mobile
	{
		display: none;
	}
}
#main-menu
{
	display: none;
}
@media(min-width: 768px)
{
	#main-menu
	{
		display: inherit;
		font-weight: 900;

	}
}
#main-menu .menu
{
	justify-content: flex-start;
}
#main-menu .pillar
{
	display: flex;
	flex-direction: row;
}
#main-menu .pillar nav
{
	flex: 1 1 100%;
}
#main-trigger
{
	align-content: center;
	cursor: pointer;
	color: var(--text-color);
	border-bottom: 1px solid #ddd;
	border-top: 1px solid #ddd;
	padding-inline: .5rem;
}
#menu-main-menu
{
	border-bottom: 1px solid #ddd;
	border-top: 1px solid #ddd;
}
#menu-main-menu a
{
	color: var(--menu-links);
	transition: .3s ease-out;
}
#menu-main-menu a:hover
{
	background-color: var(--accent-dark);
	color: var(--light);
}

/* FRONT PAGE */

#content { max-width: 100%; }

img.thumbnail,
div.thumbnail-wrapper
{
	display: flex;
	height: auto;
	object-fit: cover;
	width: 100%;
}

#home-loop-1
{
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
section.articles-home
{
	flex: 1 1 100%;
}
aside#sidebar
{
	flex: 0 0 100%;
}
aside#sidebar .widget_includer { text-align: center; }
.articles-home article
{
	position: relative;
	margin-bottom: 1rem;
}
.article-homepage .meta
{
	margin-top: .5rem;
}
.articles-home .thumbnail-wrapper,
.category-section .thumbnail-wrapper
{
	background-size: cover;
	background-position: center;	
}
@media(max-width: 767px)
{
	.articles-home .thumbnail-wrapper
	{
		aspect-ratio: 3 / 2;
		background-size: cover;
		background-position: center;
		height: auto;
		width: 100%;
	}
	.articles-home article.highlight .thumbnail-wrapper,
	.articles-home article.highlight-small-3 .thumbnail-wrapper,
	.articles-home article.highlight-small-6 .thumbnail-wrapper
	{
		aspect-ratio: 4 / 3;
	}
}
@media(min-width: 768px)
{
	.articles-home article
	{
		aspect-ratio: 1 / 1;
		margin-bottom: 0;
	}
	.articles-home article.highlight
	{
		aspect-ratio: unset;
		height: auto;
		width: 100%;
	}
	.articles-home article.highlight-small-1,
	.articles-home article.highlight-small-2
	{
		height: 162px;
		width: 168px;
		height: auto;
		width: 100%;
	}
	.articles-home .thumbnail-wrapper
	{
		aspect-ratio: 3 / 2;
		display: flex;
		height: auto;
		width: 100%;
	}
	.articles-home .highlight .thumbnail-wrapper
	{
		aspect-ratio: 1 / 1;
		height: auto;
		width: 100%;
	}
	.articles-home .highlight-small-1 .thumbnail-wrapper,
	.articles-home .highlight-small-2 .thumbnail-wrapper
	{
		aspect-ratio: 1 / 1;
		height: auto;
		width: 100%;
	}
	.articles-home .aspect-ratio-1-1 .thumbnail-wrapper
	{
		aspect-ratio: 1 / 1;
	}
	.articles-home .aspect-ratio-2-1 .thumbnail-wrapper
	{
		aspect-ratio: 2 / 1;
	}
	.articles-home .aspect-ratio-4-3 .thumbnail-wrapper
	{
		aspect-ratio: 4 / 3;
	}
	.articles-home .aspect-ratio-16-9 .thumbnail-wrapper
	{
		aspect-ratio: 16 / 9;
	}
}

 .articles-home .highlight-small-1 .thumbnail-wrapper, .articles-home .highlight-small-2 .thumbnail-wrapper {
    aspect-ratio: 1 / 1;
    height: auto;
    width: 100%;
  }
@media(min-width: 1024px)
{
	.left-side-wrapper
	{
		align-items: flex-start;
		display: flex;
	}
	.articles-home article.highlight
	{
		aspect-ratio: 1 / 1;
		height: auto;
		width: 100%;
	}
	.articles-home article.highlight-small-1,
	.articles-home article.highlight-small-2
	{
		height: auto;
		width: 100%;
	}
	.articles-home .thumbnail-wrapper
	{
		aspect-ratio: 3 / 2;
		display: flex;
		height: auto;
		width: 100%;
	}
	.articles-home .highlight .thumbnail-wrapper
	{
		aspect-ratio: 1 / 1;
	}
	.articles-home .highlight-small-1 .thumbnail-wrapper,
	.articles-home .highlight-small-2 .thumbnail-wrapper
	{
		aspect-ratio: 1 / 1;
	}
	.articles-home .aspect-ratio-1-1 .thumbnail-wrapper
	{
		aspect-ratio: 1 / 1;
	}
	.articles-home .aspect-ratio-2-1 .thumbnail-wrapper
	{
		aspect-ratio: 2 / 1;
	}
	.articles-home .aspect-ratio-4-3 .thumbnail-wrapper
	{
		aspect-ratio: 4 / 3;
	}
	.articles-home .aspect-ratio-16-9 .thumbnail-wrapper
	{
		aspect-ratio: 16 / 9;
	}
}

@media(min-width: 1282px)
{
	.articles-home article.highlight
	{
		aspect-ratio: unset;
		height: 560px;
		width: 600px;
		/*height: auto;
		width: 100%;*/
	}
	.articles-home article.highlight-small-1,
	.articles-home article.highlight-small-2
	{
		height: 272px;
		width: 100%;
	}
	.articles-home .highlight-small-1 .thumbnail-wrapper,
	.articles-home .highlight-small-2 .thumbnail-wrapper
	{
		aspect-ratio: 1 / 1;
		height: 272px;
		width: 100%;
	}
	.articles-home .thumbnail-wrapper,
	.articles-home .aspect-ratio-3-2 .thumbnail-wrapper
	{
		aspect-ratio: 3 / 2;
		display: flex;
		height: 167px;
		width: 280px;
		width: 100%;
	}
	.articles-home .aspect-ratio-1-1 .thumbnail-wrapper
	{
		aspect-ratio: 1 / 1;
		height: 100%;
	}
	.articles-home .aspect-ratio-2-1 .thumbnail-wrapper
	{
		aspect-ratio: 2 / 1;
		height: 140px;
	}
	.articles-home .aspect-ratio-4-3 .thumbnail-wrapper
	{
		aspect-ratio: 4 / 3;
		height: 210px;
	}
	.articles-home .aspect-ratio-16-9 .thumbnail-wrapper
	{
		aspect-ratio: 16 / 9;
		height: 157px;
	}
	.articles-home .highlight .thumbnail-wrapper
	{
		aspect-ratio: unset;
		height: 560px;
		width: 600px;
		width: 100%;
	}
}
article.highlight .meta
{
	background: linear-gradient(to top, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.5) 50%, rgba(0,0,0,0.4) 75%, rgba(0,0,0,0) 100%);
	bottom: 0;
	color: white;
	left: 0;
	padding: .5rem 1rem;
	position: absolute;
}

article.highlight .meta h2
{
	color: #ffffff;
}
@media(min-width: 768px)
{
	aside#sidebar
	{
		flex: 0 0 336px;
	}
	.articles-home
	{
		display: grid;
		grid-template-columns: 1fr 1fr 300px;
		grid-template-rows: auto auto auto auto;
		grid-gap: 1rem;
		grid-template-areas: 'a a d'
							 'a a d'
							 'b c d'
							 'f g d'
							 'h e j';
	}
	article.highlight { grid-area: a; }
	article.highlight-small-1 { grid-area: b; }
	article.highlight-small-2 { grid-area: c; }
	article.highlight-small-3 { grid-area: e; }
	article.highlight-small-4 { grid-area: f; }
	article.highlight-small-5 { grid-area: g; }
	article.highlight-small-6 { grid-area: h; }
	div.left-side-block
	{
		display: flex;
		flex-direction: column;
		gap: 1rem;
		grid-area: d;
	}
	div.left-side-block > article,
	div.left-side-block > div.rectangle
	{
		height: 283px;
	}
	article.aspect-ratio-1-1 .meta
	{
		background: linear-gradient(to top, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.5) 50%, rgba(0,0,0,0.4) 75%, rgba(0,0,0,0) 100%);
		bottom: 0;
		color: white;
		left: 0;
		padding: .5rem 1rem;
		position: absolute;
	}
	article.aspect-ratio-1-1 .meta h2
	{
		color: #FFFFFF;
	}
}
div.left-side-block .advertisement
{
	align-content: center;
}
@media(min-width: 1024px)
{
	#home-loop-1
	{
		flex-direction: row;
	}
	.articles-home
	{
		grid-template-columns: 300px 300px;
		grid-template-areas: 	'b a'
							 						'd c'
							 						'd e'
							 						'f g'
							 						'h x';
	}
	.highlight h2 { font-size: 1rem; }
}
@media(min-width: 1282px)
{
	.articles-home
	{
		grid-template-columns: 300px 1fr 1fr;
		grid-template-areas: 'a a b'
							 'a a c'
							 'd e f'
							 'd g h';
	}
	.highlight h2 { font-size: 1.75rem; }

}

.category-section
{
	margin-block: 1rem;
	position: relative;
	overflow: hidden;
}
.category-section img.thumbnail,
.category-section div.thumbnail-wrapper
{
	aspect-ratio: 4 / 3;
}

.category-section-container
{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	transition: transform 0.3s ease-in-out;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	overscroll-behavior-x: none;
	touch-action: pan-x pan-y;
	scrollbar-width: none;
}
.category-section-container::-webkit-scrollbar
{
	display: none; /* For Chrome, Safari */
}

.category-section-container > article
{
	flex: 0 0 95%;
	margin-right: .5rem;
}
.category-section-container .thumbnail-wrapper
{
	display: flex;
}
@media(min-width: 768px)
{
	.category-section-container
	{
		gap: 1rem;
	}
	.category-section-container > article
	{
		flex:  0 0 calc(50% - .5rem);
	}
}
@media(min-width: 1024px)
{
	.category-section-container
	{
		gap: .75rem;
	}
	.category-section-container > article
	{
		flex:  0 0 calc(33% - .5rem);
	}	
}
@media(min-width: 1282px)
{
	.category-section-container
	{
		gap: .66666667rem;
	}
	.category-section-container > article
	{
		flex:  0 0 calc(25% - .5rem);
	}
}

header.archive-link .category-title
{
	color: var(--text-color);
	font-size: 1.5rem;
	margin-bottom: .75rem;
	margin-right: .25rem;
}

#home-loop-2
{
	background-color: #111;
	color: #fff;
	margin-block: 2rem;
	margin-bottom: 1rem;
	padding: 3rem 1rem;
	padding-bottom: .5rem;
	position: relative;
	z-index: 998;
}
#home-loop-2 .pillar:first-child
{
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
#home-loop-2 .pillar:first-child > section
{
	flex: 0 0 100%;
}
@media(min-width: 768px)
{
	#home-loop-2 .pillar:first-child 
	{
		flex-direction: row;
	}
	#home-loop-2 .pillar:first-child > section
	{
		flex: 0 0 calc(50% - .5rem);
	}
}

/* Category section slider controls */
.control-left,
.control-right
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}
.control-left
{
	left: .125rem;
}
.control-right
{
	right: .125rem;
}
.control-left button,
.control-right button
{
	background: var(--accent-dark);
	border-radius: 50%;
	border: 0;
	box-shadow: 0 0 15px rgba(0, 0, 0, 0.2), 0 0 25px rgba(0, 0, 0, 0.1);
	color: white;
	padding: 1rem 1rem;
	cursor: pointer;
	transition: .3s ease-out;
 }
 .control-left button:hover,
.control-right button:hover
{
	background: var(--branding-primary);
}
.controls-read-more
{
	display: none;
}
.controls-read-more.active
{
	animation: read-more-link 0.4s ease-in-out forwards;
	display: block;
	opacity: 0;
}

@media(max-width: 767px)
{
	button.controls-next,
	button.controls-prev
	{
		display: none !important;
	}
	button.controls-next.active
	{
		display: block !important;
	}
}

@keyframes read-more-link
{
	from
	{
		opacity: 0;
		top: 50%;
	}
	to
	{
		opacity: 1;
		top: 30%;
	}
}
@keyframes read-more-button
{
	from
	{
		height: 50px;
		padding-top: 1rem;
		width: 50px;
	}
	to
	{
		height: 70px;
		padding-top: 2rem;
		width: 70px;
	}
}

.controls-next.active
{
	animation: read-more-button 0.4s ease-in-out forwards;
}
.controls-next,
.controls-prev {
    color: white;
    font-size: 1rem;
    font-weight: 600;
    padding: 12px 24px;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.3s ease-in-out;
}
.controls-prev 
{
	display: none;
}

.controls-next:hover {
    background-color: #005bb5; /* Darker blue on hover */
}
button.controls-next
{
	position: relative;
}
.controls-next a
{
	color: inherit;
	left: 50%;
	position: absolute;
	text-decoration: none;
	top: 50%;
	transform: translate(-50%,-50%);
}


/* Widget: sold cars */

.widget_cars-sold
{
	background: var(--light-bkg);
	border-color: #CCC;
	font-size: 0.75rem;
	padding: .5rem 1.5rem;
	text-align: center;
	text-transform: uppercase;
}

.widget_cars-sold h3
{
	color: var(--branding-primary);
	font-family: 'Avenir';
	font-size: 1rem;
	font-weight: 900;
}

.widget_cars-sold p
{
	color: var(--text-color);
	margin: .25rem 0;
}

.widget_cars-sold span
{
	background: linear-gradient(to bottom, #3F3F3F 49%, #303030 51%);
	border: 1px solid #000;
	color: #FFF;
	display: inline-block;
	line-height: 2rem;
	margin: 0 0.25rem;
	width: 2rem;
}

/* sidebars */
aside > div
{
	margin-bottom: 1rem;
}
/* most recent */
.widget-link
{
	color: var(--text-color);
	transition: .3s ease;
}
.widget-link:hover
{
	color: var(--accent-dark);
}

.recent
{
	border-left: 1px dashed #999;
	margin-left: .5rem;
	padding-left: 2rem;
}
.recent img.thumbnail
{
	align-self: center;
	grid-area: n-img;
	height: 60px;
	object-fit: cover;
	width: 60px;
}
.recent a
{
	display: flex;
	display: grid;
	grid-template-areas: 'datetime datetime n-img'
						 'ntitle ntitle n-img'
						 'ntitle ntitle n-img';
	grid-template-columns: 1fr 1fr auto;
	grid-gap: .25rem;
}
.recent h6
{
	grid-area: ntitle;
}
.recent div.time-wrapper
{
	grid-area: datetime;
}
header.archive-link
{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	margin-bottom: 1rem;
}
header.archive-link span
{
	color: var(--text-color);
	font-size: 1.2rem;
	text-transform: uppercase;
	font-weight: bold;
}
/*header.archive-link a
{
	color: var(--text-color);
	font-size: 1.2rem;
	text-transform: uppercase;
}
header.archive-link a::after
{
	content: '\f054';
	font-family: 'FontAwesome';
	font-size: 1rem;
	margin-left: .5rem;
}*/
a.widget-link.recent-widget-link
{
	color: var(--text-color);
	display: inherit;
	font-size: 1.2rem;
	margin-top: 1rem;
	position: relative;
	text-align: right;
	text-transform: uppercase;
}
a.widget-link.recent-widget-link:hover
{
	color: var(--accent-dark);
}
a.widget-link.recent-widget-link::after
{
	content: '\f054';
	font-family: 'FontAwesome';
	font-size: 1rem;
	margin-left: .5rem;
}
a.widget-link.recent-widget-link::before
{
	background-color: var(--main-bkg);
	content: '';
	height: 100%;
	position: absolute;
	right: calc(100% + 2rem);
	top: 0;
	width: 1px;
}
.recent article
{
	border-bottom: 1px solid #ddd;
	padding-block: .5rem;
}
.recent article:first-of-type
{
	padding-top: 0;
}
.time-wrapper
{
	color: var(--text-color);
	font-size: .7rem;
	position: relative;
}
.time-wrapper::before
{
	background-color: var(--menu-links);
	border: 3px solid var(--menu-links);
	content: '';
	height: 1px;
	position: absolute;
	right: calc(100% + 2rem - 3px);
	top: 25%;
	transform: translateY(-50%);
	width: 1px;
}

/* Newsletter widget */
.mnl-signup
{
	align-items: center;
	border-radius: 3px;
	box-sizing: border-box;
	display: flex;
	padding: .5rem;
	padding-inline: 0;
	width: 100%;
}

/* Email input field */
.mnl-field-email
{
	display: flex;
	flex-grow: 1;
	flex-direction: column;
}

.mnl-input-email
{
	background-color: var(--main-bkg);
	border: 1px solid #ddd;
	border-right: 0;
	border-radius: 3px 0 0 3px;
	color: var(--text-color);
	font-size: .875rem;
	outline: none;
	padding: 1rem;
	padding-inline: 1rem;
	width: 100%;
}

/* Hide label and use placeholder instead */
.mnl-label {
  display: none;
}

/* Submit button */
/*.mnl-field-submit {
  margin-left: 8px;
}*/

.mnl-btn-submit
{
	align-items: center;
	background: var(--accent-dark);
	border: 1px solid #ddd;
	border-left: var(--accent-dark);
	border-radius: 0 3px 3px 0;
	color: #fff;
	cursor: pointer;
	display: flex;
	font-size: .875rem;
  	padding: 1rem .75rem;
  	transition: background 0.3s ease;
	white-space: nowrap;
}

.mnl-btn-submit:hover {
  background: var(--branding-primary);
}

/* Responsive adjustments for very small screens */
@media (max-width: 360px) {
  #mnl-form-eba03cef {
    flex-direction: column;
  }

  .mnl-field-submit {
    margin-left: 0;
    margin-top: 8px;
    width: 100%;
  }

  .mnl-btn-submit {
    width: 100%;
    justify-content: center;
  }
}

/* Footer */
#site-footer
{
	background: var(--footer-bkg);
	color: #FFF;
	margin-top: 2rem;
	padding: 3rem 0;
}

#site-footer .inner-pillar
{
	display: flex;
	flex-direction: column;
	max-width: 860px;
}

#site-footer address
{
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	font-size: 0.75rem;
	font-style: normal;
	justify-content: center;
	margin-block: 2rem;
	text-align: center;
}

#site-footer address span
{
	border-left: 1px solid #2A2A2A;
	padding-inline: 1.25rem;
}

#site-footer address span:first-child
{
	border-left-style: none;
}

#site-footer h4
{
	font-size: 1.125rem;
	line-height: 1em;
	margin-bottom: 1rem;
}

#menu-footer
{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 1rem;
	justify-content: space-around;
	margin-bottom: 3rem;
}

#footer-meta
{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-around;
}

#footer-meta .mnl-signup,
#footer-meta #social-media
{
	flex-basis: 50%;
}

#footer-meta #other-media
{
	flex-basis: 100%;
	margin-top: 3rem;
}
#other-media h4
{
	padding-inline: 1rem;
}
.footer-meta-wrapper
{
	align-items: center;
	display: flex;
	flex-direction: column;
	gap: 1rem;
	justify-content: space-between;
	width: 85%;
}
@media(min-width: 768px)
{
	.footer-meta-wrapper
	{
		flex-direction: row;
	}
}
#menu-social
{
	display: flex;
	font-size: 2rem;
	justify-content: flex-end;
	line-height: 3rem;
}

#menu-social a
{
	padding-inline: 1rem;
}

#menu-mobility
{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

#menu-mobility li
{
	flex-basis: 100%;
}

#menu-mobility a::before
{
	content: '\203A';
	margin-right: 0.625rem;
}

@media (min-width: 640px)
{
	#menu-mobility li
	{
		flex-basis: 50%;
	}
}

@media (min-width: 768px)
{
	#menu-mobility li
	{
		flex-basis: 33.33333%;
	}
}

#gdpr-consent
{
	font-family: "Avenir", sans-serif;
}

#gdpr-consent a
{
	color: var(--light);
	text-decoration: underline;
}

#gdpr-consent button
{
	border-radius: 0;
}

#gdpr-consent button:hover
{
	background-color: var(--branding-primary);
	color: #FFF;
}

/* Comments */

.comments h4
{
	font-size: 1.125rem;
	font-weight: normal;
	margin-block: 1rem;
}

.comment-form .comment-wrapper
{
	background: #EDEDED;
	border: 1px solid #CBCBCB;
	color: #767676;
	font-size: 0.75rem;
	line-height: 1.75;
	margin: 1rem 0;
}
body.dark .comment-form .comment-wrapper
{
	background: var(--main-bkg);
	color: var(--text-color);
}
textarea[name=comment]
{
	background: var(--main-bkg);
	border-color: #333;
	border-style: none none solid;
	border-width: 1px;
	color: var(--text-color);
	display: block;
	min-height: 3.125rem;
	padding: 8px;
	resize: vertical;
	width: 100%;
}

textarea[name=comment]:focus
{
	background-color: var(--main-bkg);
	outline: none;
}

#comment-chars-remaining
{
	margin-left: 0.5rem;
}

.comments-list
{
	border-top: 1px solid #DDD;
	margin-top: 1rem;
}

#comments
{
	font-size: 1.125rem;
	line-height: 1.6;
	list-style-type: none;
}

.comment
{
	background: var(--main-bkg);
	border: 1px solid #CCC;
	color: var(--text-color);
	margin-bottom: 1rem;
	padding: 1rem;
}

.comment-meta span
{
	color: #3C452D;
	font-weight: 700;
	margin-right: 0.75rem;
}
body.dark .comment-meta span
{
	color: var(--text-color);
}
.comment-meta time
{
	color: #999;
	font-size: 0.625rem;
	
}
.comment-controls button
{
	background-color: var(--branding-primary);
	border: 0;
	cursor: pointer;
	color: #fff;
	padding: .5rem 1rem;
	transition: .3s ease-out;
}
.comment-controls button:hover
{
	background-color: var(--accent-light);
}

/* Single page */


.wp-caption
{
	display: inline-block;
	max-width: 100%;
}
.wp-caption.alignleft
{
	float: left;
	padding-right: 1rem;
}
.wp-caption.alignright
{
	float: right;
	padding-left: 1rem;
}
.wp-caption img
{
	display: block;
	height: auto;
	width: 100%;
}
.wp-caption-text
{
	color: var(--text-color);
	max-width: 100%;
 	text-align: left;
	word-wrap: break-word;
}
figcaption.wp-caption-text::before
{
	color: var(--accent-dark);
	content: '\F0D8';
	font-family: FontAwesome;
	margin-right: 0.5rem;
}
img.size-medium + .wp-caption-text { max-width: 300px; }
img.size-thumbnail + .wp-caption-text { max-width: 120px; }
img.size-large + .wp-caption-text,
img.size-full + .wp-caption-text { max-width: 720px; }


@media(min-width: 768px)
{
	.single-post #primary
	{
		display: flex;
		flex-direction: row;
		gap: 1rem;
	}
	.single-post #primary aside#sidebar
	{
		flex: 0 0 336px;
	}
	.single-post #primary article#main
	{
		flex: 1 1 auto;
	}
}


.single #content
{
	margin-top: 2rem;
}

.post-content
{
	font-family: 'LyonText', serif;
}
.post-content figure
{
	margin-bottom: 1rem;
}
.single-post #zapfline
{
	color: var(--branding-secondary);
	font-family: 'CachetPro', sans-serif;
	font-size: 1.375rem;
	font-weight: 500;
	margin-top: 1.5rem;
}

.single-post .intro-tag
{
	color: var(--branding-primary);
	font-weight: bold;
}
body.dark.single-post .intro-tag
{
	color: #E03132;
}
body.post-template-ptl-partnercontent.dark.single-post .intro-tag
{
	color: #999;
}

h1.post-title
{
	font-family: 'Ciutadella', serif;
	font-size: 1.5rem;
	font-weight: 600;
	line-height: 1.2;
	margin-block: 1rem;
}
@media(min-width: 768px)
{
	h1.post-title
	{
		font-size: 2.5rem;
	}
}
figure.hero-image img
{
	aspect-ratio: 16 / 9;
	object-fit: cover;
	width: 100%;
}
figure.hero-image.amo-full-img img
{
	aspect-ratio: unset;
}
figure.hero-image
{
	aspect-ratio: 16 / 9;
	margin-bottom: .75rem;
	position: relative;
}
figure.hero-image figcaption
{
	font-size: .9rem;
	font-style: italic;
}
figure.hero-image figcaption::before
{
	color: var(--accent-dark);
	content: '\F0D8';
	font-family: FontAwesome;
	margin-right: 0.5rem;
}
figure.hero-image.hero-image-left img,
figure.hero-image.hero-image-right img
{
	aspect-ratio: unset;
}
figure.hero-image.hero-image-left,
figure.hero-image.hero-image-right
{
	aspect-ratio: unset;
}
figure.hero-image .amo-post-label
{
	left: 0;
	top: 0;
	padding: .25rem .5rem;
	position: absolute;
}
@media(min-width: 768px)
{
	.hero-image.hero-image-left
	{
		float: left;
		margin-right: 1rem;
		width: 40%;
	}

	.hero-image.hero-image-right,
	.pillar-interview figure.hero-image
	{
		float: right;
		margin-left: 1rem;
		width: 40%;
	}
}

.premium-content h1.post-title span::after,
.partner-content h1.post-title span::after
{
	content: ' ';
}

.premium-content h1.post-title::after,
.partner-content h1.post-title::after
{
	display: inline-block;
	font-family: 'Avenir';
	font-size: 0.625rem;
	height: 1.5rem;
	line-height: 1.6rem;
	padding-inline: 0.25rem;
	position: relative;
	top: -0.5rem;
}

/* .premium-content h1.post-title::after
{
	background: transparent;
	border: 1px solid var(--accent-premium);
	color: var(--accent-premium);
	content: 'PREMIUM';
} */

.partner-content h1.post-title::after
{
	background: var(--accent-partner);
	color: #FFF;
	content: 'BRANDSTORY';
}

.single-post #main
{
	margin: 0 auto 2rem;
	max-width: 100%;
	width: 100%;
}

.single-post #main .tags
{
	border-top: 1px solid var(--light);
	color: var(--text-color);
	font-family: "CachetPro", sans-serif;
	font-size: 1rem;
	letter-spacing: 0;
	margin-top: 2rem;
	padding-block: 1.5rem;
}

.single-post #main .tags-list
{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 0.5rem;
	list-style-type: none;
	margin-top: 1rem;
}
.single-post #main .tags-list li
{
	transition: .3s ease-out;
}

.single-post #main .tags a
{
	background: var(--light);
	color: #000;
	padding: 0.25rem 0.75rem;
	transition: .3s ease-out;
}

.single-post #main .tags a:hover
{
	background-color: var(--accent-dark);
	color: #FFF;
}

.single-post .meta
{
	display: flex;
	flex-direction: row;
	font-family: "CachetPro", sans-serif;
	font-size: 0.875rem;
	font-weight: normal;
	gap: 0 1rem;
	margin-bottom: 1rem;
}

.single-post #meta-top
{
	display: grid;
	grid-template-columns: 1fr auto;
	grid-template-areas:
		"author-name sharing read-voice read-time"
		"times sharing read-voice read-time";
}

.single-post #meta-bottom
{
	border-color: var(--light);
	border-style: solid none;
	border-width: 1px 0;
	display: grid;
	grid-template-columns: 60px 1fr auto;
	grid-template-areas:
		"author-img author-name"
		"author-img author-bio"
		"author-img sharing";
	padding-block: 2rem;
}

.single-post .excerpt,
.single-post .excerpt p
{
	font-family: 'LyonText', serif;
	font-size: 1.125rem;
	font-weight: 500;
	line-height: 1.3;
	margin-bottom: 1rem;
}
.single-post .author-portrait
{
	border: 1px solid var(--branding-primary);
	border-radius: 50%;
	grid-area: author-img;
	height: 3.75rem;
	padding: 2px;
	width: 3.75rem;
}

.single-post .author-name
{
	align-self: end;
	color: var(--text-color);
	display: inherit;
	grid-area: author-name;
}
.single-post .author-ln
{
	align-self: center;
	color: var(--text-color);
	grid-area: author-ln;
}
.single-post .author-ln i
{
	border-radius: 3px;
	color: #0A66C2;
	margin-right: .25rem;
	padding: .25rem .4rem;
}

.single-post .author-bio
{
	color: var(--text-color);
	font-family: LyonText;
	font-size: .9rem;
	letter-spacing: 0;
}

.single-post .times
{
	color: #999;
	grid-area: times;
}
.single-post .times .times-desktop
{
	display: none;
}
@media(min-width: 768px)
{
	.single-post .times .times-desktop{ display: inline-block; }
	.single-post .times .times-mobile{ display: none; }
}

.single-post .share
{
	font-size: 0;
	grid-area: sharing;
}
.single-post .share span
{
	color: var(--text-color);
	font-size: 1.2rem;
}

.single-post #meta-top .share
{
	align-self: center;
}

.single-post #meta-bottom .share
{
	margin-top: 1rem;
}

.single-post #meta-bottom .share a
{
	margin-right: 0.5rem;
}
.share .fa { font-size: 1.5rem; padding: 0.25rem; }
.share .fa-twitter { color: #1DA1F2; }
.share .fa-linkedin { color: #0077B5; }
.share .fa-facebook { color: #3B5998; }
.share .fa-whatsapp { color: #25D366; }
.share .fa-envelope { color: var(--text-color); }
.share .fa-instagram { color: transparent; }
.single-post .read-time
{
	background-color: var(--accent-dark);
	color: #fff;
	grid-area: read-time;
	height: min-content;
	justify-self: end;
	padding: .25rem .5rem;
}
.single-post .read-voice
{
	background-color: transparent;
	color: #FFF;
	grid-area: read-voice;
	height: min-content;
	width: min-content;
}
.single-post .read-voice button
{
	background-color: var(--accent-dark);
	border: none;
	color: #FFF;
	cursor: pointer;
	font-size: .875rem;
	outline: none;
	padding: .32rem .5rem;
	transition: .3s ease-out;
}
.single-post .read-voice button:hover
{
	background-color: var(--branding-primary);
}
.single-post #single-read-more
{
	background: var(--light-bkg);
	border-color: var(--light);
	border-style: solid none;
	color: var(--menu-links);
	border-width: 1px 0;
	margin-bottom: 2rem;
	padding-block: 2rem;
}
.single-post #single-read-more img,
.single-post #single-most-recent img
{
	aspect-ratio: 4 / 3;
} 

.single-post #single-most-recent .section-heading span,
.single-post #single-read-more .section-heading a
{
	color: var(--branding-primary);
}

.single-post #single-most-recent time
{
	display: none;
}

.post-template-ptl-partnercontent .body-text
{
	--branding-primary: #999;
}

.post-template-ptl-partnercontent #meta-bottom
{
	display: block;
}

.post-template-ptl-interview .body-text h2
{
	font-style: italic;
}

.post-template-ptl-kennisbank .kennisbank-content header
{
	padding-top: 4rem;
}

.post-template-ptl-kennisbank .kennisbank-content header h1
{
	font-family: "Avenir", sans-serif;
	font-size: 2.375rem;
	font-weight: 500;
	margin-bottom: 1rem;
}

.post-template-ptl-kennisbank .body-text
{
	margin-bottom: 2rem;
}

@media (min-width: 768px)
{
	.single-post .times
	{
		display: block;
	}
	
	.single-post #meta-bottom
	{
		grid-template-areas:
			"author-img author-name sharing"
			"author-img author-bio sharing";
	}
	
	.single-post #meta-bottom .share
	{
		margin-top: 0;
	}
	
	.single-post #meta-bottom .share a
	{
		margin-left: 0.5rem;
		margin-right: 0;
	}
}

.post-content h2
{
	font-size: 1.125rem;
	font-weight: 700;
}
.post-content p
{
	font-size: 1.125rem;
	font-weight: 400;
}

#single-newsletter
{
	margin-block: 2rem;
}
.post-content #single-newsletter
{
	margin-top: 0;
}
@media(min-width: 768px)
{
	.single #sidebar
	{
		background-color: var(--main-bkg);
		color: var(--text-color);
		max-height: calc(100vh - 40px);
		margin-bottom: 2rem;
		overflow-y: auto;
		position: -webkit-sticky;
		position: sticky;
		scrollbar-width: none;
		top: 20px;
	}
}
a[title="Twitter"] i.fa { color: var(--text-color); }
/* navigation page */

#navigation-subpage
{
	background-color: var(--main-bkg);
	box-shadow: 0 0 2px rgba(0,0,0,.4);
	display: none;
	height: 100%;
	left: -25%;
	overflow-y: scroll;
	padding: 2rem 0;
	position: absolute;
	scrollbar-width: none;
	top: 0;
	width: 100%;
	z-index: 1000;
}
#navigation-subpage::-webkit-scrollbar
{
  display: none; 
}
#navigation-subpage li
{
	color: var(--text-color);
}
#navigation-subpage li:hover
{
	color: #FFF;
}
@media(min-width: 768px)
{
	#navigation-subpage
	{
		width: 25%;
	}
}
#navigation-subpage h3
{
	margin-top: .75rem;
	padding-left: 1rem;
}
#navigation-subpage a
{
	display: flex;
}
#navigation-subpage.active
{
	animation: slide-right-mob .4s ease-out forwards;
	display: inline-block;
}
#navigation-subpage.deactivated
{
	display:inline-block;
	animation: slide-left-mob .4s ease-out forwards;
}
@media(min-width: 768px)
{
	#navigation-subpage.active
	{
		animation-name: slide-right;
	}
	#navigation-subpage.deactivated
	{
		animation-name: slide-left;
	}
}
@keyframes slide-right {
    from {
        left: -25%;
        opacity: 0;
    }
    to {
        left: 0;
        opacity: 1;
    }
}
@keyframes slide-left {
    from {
    	display: inline-block;
        left: 0;
        opacity: 1;
    }
    to {
    	display: none;
        left: -25%;
        opacity: 0;
    }
}
@keyframes slide-right-mob {
    from {
        left: -100%;
        opacity: 0;
    }
    to {
        left: 0;
        opacity: 1;
    }
}
@keyframes slide-left-mob {
    from {
        left: 0;
        opacity: 1;
    }
    to {
        left: -100%;
        opacity: 0;
    }
}
#overlay
{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	display: none;
	z-index: 999;
}
body.no-scroll
{
	overflow: hidden;
}
.nav-el,
.nav-account-buttons
{
	list-style-type: none;
}
li.nav-el,
.nav-account-buttons li
{
	border-bottom: 1px solid #9999;
	transition: .3s ease-out;
}
li.nav-el:hover,
.nav-account-buttons li:hover
{
	background-color: var(--accent-dark);
	color: #fff;
}
li.nav-el:last-child,
.nav-account-buttons li:last-child
{
	border-bottom: 0;
}
.nav-el a,
.nav-el label,
.nav-account-buttons a
{
	display: inline-block;
	padding: 1rem 2rem;
}
.nav-el input[type="radio"]
{
	margin-right: .5rem;
}
#nav-close
{
	cursor: pointer;
	color: var(--text-color);
	font-size: 1.2rem;
	padding: .5rem;
	position: absolute;
	right: 0;
	top: 1.5rem;
}
@media(min-width: 768px)
{
	#nav-header-mob,
	#nav-list-mob
	{
		display: none;
	}
}

#link-account-nav span { text-transform: capitalize; }

#nav-mode-section
{
	border-bottom: 1px solid #ddd;
	border-top: 1px solid #ddd;
}
@media(min-width: 768px)
{
	#nav-mode-section
	{
		display: none;
	}
}
#nav-mode-section label
{
	cursor: pointer;
	width: 100%;
}
#nav-mainmenu-section
{
	border-bottom: 1px solid #ddd;
}

/* Socials */

#menu-social
{
	background-color: var(--main-bkg);
	border-radius: 3px 0 0 3px;
	box-shadow: 0px 0px 2px rgba(0,0,0,.3);
	display: flex;
	flex-direction: column;
	position: fixed;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	z-index: 999;
}
#menu-social a
{
	border-radius: 3px 0 0 3px;
	font-size: 1.2rem;
	padding: .1rem .5rem;
	text-align: center;
	width: 100%;
}
#menu-social li
{
	justify-content: center;
}
@media(min-width: 768px)
{
	#menu-social a
	{
		font-size: 1.5rem;
		padding: .25rem 1rem;
	}
}
#menu-social a.soc-fb
{
	background-color: transparent;
	color: #1877F2;
	transition: .3s ease-out;
}
#menu-social a.soc-tw
{
	background-color: transparent;
	color: #000;
	transition: .3s ease-out;
}
#menu-social a.soc-ln
{
	background-color: transparent;
	color: #0072b1;
	transition: .3s ease-out;
}
#menu-social a.soc-yt
{
	background-color: transparent;
	color: #b2071d;
	transition: .3s ease-out;
}
#menu-social a.soc-rss
{
	background-color: transparent;
	color: #FFA500;
	transition: .3s ease-out;
}
#menu-social a.soc-ig
{
	background: linear-gradient(45deg, #feda75 0%, #fa7e1e 25%, #d62976 50%, #962fbf 75%, #4f5bd5 100%);
	background-clip: text;
	color: transparent;
	-webkit-background-clip: text;
	transition: .3s ease-out;
}
#menu-social a.soc-fb:hover
{
	background-color: #1877F2;
	color: #FFF;
}
#menu-social a.soc-tw:hover
{
	background-color: #000;
	color: #FFF;
}
#menu-social a.soc-ln:hover
{
	background-color: #0072b1;
	color: #FFF;
}
#menu-social a.soc-yt:hover
{
	background-color: #b2071d;
	color: #FFF;
}
#menu-social a.soc-rss:hover
{
	background-color: #FFA500;
	color: #FFF;
}
#menu-social a.soc-ig:hover
{
	background-color: unset;
	background: linear-gradient(45deg, #feda75 0%, #fa7e1e 25%, #d62976 50%, #962fbf 75%, #4f5bd5 100%);
	color: #FFF;
}

/* videos */

#video-list-wrapper
{
	padding-inline: 2rem;
}
#video-list
{
	background: #111;
	width: 100%;
}

#video-list-items
{
	display: grid;
	gap: 1.25rem;
	grid-template-columns: repeat(1, 1fr);
	max-width: 100%;
}

@media (min-width: 768px) {

    #video-list-items {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) {
    #video-list-items {
        grid-template-columns: repeat(3, 1fr);
    }
}


.video-list-item-wrapper
{
	border-radius: 3px;
	overflow: hidden;
	position: relative;
	text-decoration: none;
	transition: transform 0.3s ease-in-out;
}

.video-list-item
{
	background: #222;
	border-radius: 3px;
	overflow: hidden;
	padding: 10px;
	position: relative;
	text-align: center;
	transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}

.video-list-item img.video-thumbnail
{
	border-radius: 3px;
	display: block;
	transition: transform 0.3s ease-in-out;
	width: 100%;
}

.video-title
{
	color: #fff;
	font-size: 1rem;
	font-weight: bold;
	margin-top: 10px;
	transition: color 0.3s ease-in-out;
}

.video-date
{
	color: #bbb;
	font-size: .875rem;
}

/*.video-list-item-wrapper:hover .video-list-item
{
	box-shadow: 0 5px 15px rgba(255, 0, 0, 0.4);
	transform: scale(1.05);
}*/

.video-list-item::after
{
	border-radius: 5px;
	content: "\f16a";
	color: #FF0000;
	font-family: 'FontAwesome';
	font-size: 2.5rem;
	line-height: 2.5rem;
	height: min-content;
	left: 50%;
	opacity: 0;
	position: absolute;
	top: 35%;
	transform: translate(-50%, -50%) scale(0);
	transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
}

.video-list-item-wrapper:hover .video-list-item::after
{
	opacity: 1;
	transform: translate(-50%, -50%) scale(1);
}

#automotive-video .btn-more
{
	color: white;
	background: var(--accent-dark);
	border-radius: 2px;
	display: block;
	font-weight: bold;
	margin: 20px auto;
	padding: 10px 15px;
	text-align: center;
	text-transform: uppercase;
	transition: background 0.3s ease-in-out;
}

#automotive-video .btn-more:hover
{
	background: var(--branding-primary);
}

#automotive-video h2.section-heading,
.jobmotive h2.section-heading,
#automotive-podcasts h2.section-heading
{
	color: #DDD;
	font-size: 2rem;
	margin-bottom: 1rem;
	padding-left: 2rem;
}
/* Podcast */

#podcast-list-wrapper
{
	max-height: 360px;
	overflow-y: auto;
	overscroll-behavior-y: none;
	padding-inline: 2rem;
	scroll-snap-type: y mandatory;
	scrollbar-width: none;
	touch-action: pan-x pan-y;
}
}
#podcast-list
{
	background: #111;
	width: 100%;
}

#podcast-list-items
{
	display: grid;
	gap: 1.25rem;
	grid-template-columns: repeat(1, 1fr);
	max-width: 100%;
}
#podcast-list-items iframe { max-width: 100%; }
/* @media (min-width: 768px) {

    #podcast-list-items {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) {
    #podcast-list-items {
        grid-template-columns: repeat(3, 1fr);
    }
} */

/* Read more, Most recent sections */
ul.loop-read-more,
ul.loop-most-recent
{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	list-style-type: none;
	gap: 1rem;
}
ul.loop-read-more li,
ul.loop-most-recent li
{
	flex: 0 0 100%;
}
@media(min-width: 768px)
{
	ul.loop-read-more li,
	ul.loop-most-recent li
	{
		flex: 0 0 calc(33% - .666667rem);
	}
}
@media(min-width: 1024px)
{
	ul.loop-read-more li,
	ul.loop-most-recent li
	{
		flex: 0 0 calc(25% - .75rem);
	}
}
#single-read-more h2,
#single-most-recent h2
{
	color: var(--text-color);
	font-size: 1.8rem;
	margin-bottom: 1rem;
	margin-top: .5rem;
}
#single-read-more .post-title,
#single-most-recent .post-title
{
	color: var(--text-color);
	display: inline-block;
	font-family: "LyonText", serif;
	margin-top: .5rem;
}

/* Author archive */
.author-profile-container
{
	background: var(--main-bkg);
	border-radius: 4px;
	box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
	color: var(--text-color);
	font-family: 'Ciutadella', serif;
	margin: 3rem auto;
}
.author-header
{
	align-items: center;
	border-radius: 4px;
	/* background: #f9f9f9; */
	background: var(--main-bkg);
	display: flex;
	flex-direction: column;
	text-align: center;
}
.avatar-container img
{
	border-radius: 50%;
	border: 4px solid #555;
}
.details
{
	margin-top: 15px;
}
.position
{
	color: #555;
	font-weight: bold;
	font-size: 1.25rem;
}
.author-bio
{
	font-size: 18px;
	margin-top: 25px;
	line-height: 1.8;
}
.author-publications
{
	margin-top: 60px;
}
.author section.author-header,
.author section.author-header h2,
.author section.author-header h1,
.author section.author-header a
{
	/*color: #333;*/
	color: var(--text-color);
}
.publication-list
{
	display: flex;
	flex-direction: column;
	gap: 25px;
}
.publication-item
{
	border-bottom: 2px solid #ddd;
	padding: 20px;
	transition: background 0.3s, transform 0.2s;
}
.publication-item:hover
{
	background: #f5f5f5;
}
.publication-item:hover div
{
	color: #666;
}
.publication-item h3
{
	font-size: 1.375rem;
	font-weight: bold;
	margin: 0;
}
.publication-item a
{
	color: var(--branding-primary);
	text-decoration: none;
	transition: color 0.3s;
}
.publication-item a:hover
{
	color: var(--accent);
}
.publication-item .date
{
	color: #666;
	font-size: 1rem;
}
.author .categories
{
	margin-top: .5rem;
}
.author .categories a
{
	background: var(--main-bkg);
	border-radius: 3px;
	color: var(--text-color);
	font-weight: 600;
	margin-right: 6px;
	padding: 6px 12px;
	text-decoration: none;
}

/* Archive, Categories & Tags */
.archive-container
{
	color: var(--text-color);
	display: flex;
	flex-direction: column;
	font-family: 'Poppins', sans-serif;
	gap: 40px;
	margin: 0 auto 3.125rem auto;
}
.archive-header
{
	background: var(--main-bkg);
	border-radius: 4px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
	text-align: center;
}
.archive-title h1
{
	color: var(--text-color);
	font-size: 1.5rem;
	font-weight: bold;
	text-transform: uppercase;
}
.archive-leaderboard
{
	margin: 1rem 0;
	text-align: center;
}
.archive-grid-wrapper
{
	display: flex;
	flex-direction: column;
	gap: .5rem;
}
.archive-grid
{
	display: grid;
	gap: 1.875rem;
	grid-template-columns: 1fr;
	justify-content: center;
}
@media (min-width: 768px){ .archive-grid{ grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px){ .archive-grid{ grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1282px){ .archive-grid { grid-template-columns: repeat(4, 1fr); } }
.archive-item
{
	background: var(--main-bkg);
	border-radius: 4px;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
	position: relative;
	overflow: hidden;
	transition: transform 0.3s;
}
.archive-item:hover
{
	transform: translateY(-5px);
}
.archive-item .archive-brandstory
{
	background-color: #777;
	border-radius: 4px 0 4px 0;
	font-size: .7rem;
	font-weight: 700;
	left: 0;
	position: absolute;
	padding: .2rem;
	top: 0;
}
.archive-link
{
	color: inherit;
	display: block;
	text-decoration: none;
}
.archive-thumbnail img
{
	aspect-ratio: 16 / 9;
	border-bottom: 2px solid var(--branding-primary);
	display: block;
	height: auto;
	object-fit: cover;
	width: 100%;
}
@media(min-width: 768px)
{
	.archive-thumbnail img
	{
		aspect-ratio: 4 / 3;
	}
}
.archive-content
{
	padding: 20px;
}
.archive-content h2
{
	color: var(--text-color);
	font-size: 1.375rem;
	font-weight: bold;
	margin-bottom: 1.125rem;
}
.archive-excerpt
{
	color: var(--text-color);
	font-size: 1rem;
}
.archive-date
{
	color: var(--text-color);
	display: block;
	font-size: .875rem;
	margin-top: 1.125rem;
}

/* Pager */
.pager
{
	padding-block: 2rem;
	text-align: center;
}
.pager ol
{
	color: #999;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	list-style-type: none;
	margin-top: 1rem;
}
.pager ol a
{
	font-family: 'Avenir', sans-serif;
	font-weight: 700;
	padding: 1rem;
}

.pager .current
{
	color: #000;
}

/* Pager */ 

.pager-desktop
{
	display: none;
	font-family: "LyonText", serif;
	font-size: 1.125rem;
	gap: 0.5rem;
	justify-content: center;
	margin: auto;
	margin-block: 1rem;
}

.pager-mobile
{
	display: flex;
	gap: 0.5rem;
	justify-content: center;
	margin: auto;
	margin-block: 1rem;
}

@media(min-width: 768px)
{
	.pager-mobile{	display: none;	}
	.pager-desktop{	display: flex;	}
}

.page-numbers
{
	color: var(--menu-links);
	display: block;
	height: 2.1875rem;
	padding-top: 0.2rem;
	text-align: center;
	width: 2.1875rem;
}
.page-numbers > i
{
	font-size: 50%;
}
span.inactive
{
	color: #ddd;
}
.current
{
	background-color: var(--accent-light);
	border-radius: 4px;
	color: white;
}

/* Jobs */ 
.jobs-links
{
	list-style: none;
	margin: 0;
	padding: 0;
	padding-inline: 2rem;
	text-align: left;
}

.jobs-links li
{
	margin-bottom: 20px;
	position: relative;
	transition: .3s ease-out;
}
.jobs-links li::before
{
	background-color: var(--menu-links);
	content: "";
	display: block;
	height: 1px;
	left: 37%;
	position: absolute;
	top: calc(100% + 2px);
	transform: translateX(-10%);
	transition: .3s ease-out;
	width: 25%;
}

.jobs-links a
{
	color: #ffffff;
	display: inline-block;
	font-size: 1.125rem;
	font-weight: 500;
	position: relative;
	text-decoration: none;
 	transition: color 0.3s ease-in-out;
 	width: 100%;
}

.jobs-links a::after
{
	background: var(--accent-light);
	content: "";
	display: block;
	height: 2px;
	transition: width 0.3s ease-in-out;
	width: 0;
}

.jobs-links a:hover
{
	color: var(--accent-light);
}

.jobs-links li:hover::before
{
	background-color: var(--accent-light);
	left: 0;
	width: 100%;
	transform: translateX(0);
}

/* Search */

body.search-results #content .pillar
{
	max-width: 860px;
}

#search-form-wrapper
{
	background: #1E1E1E;
	color: #FFF;
	padding-block: 2rem;
}

#search-form-wrapper p
{
	margin-top: 1rem;
}

#search-result-count
{
	background: var(--light);
	font-weight: bold;
	margin-bottom: 1rem;
	padding-block: 2rem;
}

.loop.loop-search article
{
	flex-direction: column;
	gap: 0.625rem;
	padding-inline: 0;
}

.loop.loop-search .post-title
{
	font-family: 'Avenir', sans-serif;
	font-size: 1.625rem;
	font-weight: 400;
}
/* Page */

.page .body-text address
{
	color: var(--text-color);
}

@media(min-width: 768px)
{
	.page #primary
	{
		display: flex;
		flex-direction: row;
		gap: 1rem;
	}
	.page #primary article#main
	{
		flex: 1 1 auto;
	}
	.page #primary aside#sidebar
	{
		flex: 0 0 360px;
	}
}


/* Page: Login */

.page-login
{
	background: var(--main-bkg);
}

.page-login .body-text
{
	font-size: 0.875rem;
}

.page-login h2
{
	color: var(--text-color);
	font-size: 2rem;
	font-weight: normal;
	margin-block: 1rem;
}

.page-login .body-text .btn
{
	background: #19A113;
	color: #FFF;
	font-family: 'Avenir', sans-serif;
	font-size: 1.25rem;
	font-weight: 900;
	text-transform: uppercase;
}

.page-login .right ul
{
	list-style-type: none;
	padding-left: 1.5rem;
}

.page-login .right li
{
	break-inside: avoid;
	color: var(--text-color);
	display: block;
	margin-bottom: 1rem;
	position: relative;
}

.page-login .right li::before
{
	color: #538AA5;
	content: '\F00C';
	font-family: FontAwesome;
	left: -1.5rem;
	position: absolute;
}

#loginform
{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

#loginform p.login-username,
#loginform p.login-password
{
	display: flex;
	flex-basis: 100%;
	flex-direction: row;
}

#loginform label
{
	flex: 0 1 40%;
	line-height: 2.5rem;
}

#loginform label + input
{
	flex: 1 1 auto;
}

#loginform p.login-remember
{
	flex: 1 1 auto;
	text-align: right;
}

#loginform p.login-submit
{
	flex: 0 0 auto;
	margin-left: 2rem;
}

#loginform input[type=submit]
{
	background: #538AA5;
	border: none;
	color: #FFF;
	font-family: 'Avenir', sans-serif;
	font-size: 1rem;
	font-weight: 900;
	line-height: 2.5rem;
	padding: 0 1rem;
	text-transform: uppercase;
	transition: all 0.3s ease;
}

#loginform input[type=submit]:hover
{
	background: #000;
}

#loginform p.login-forgot-pw
{
	flex: 1 1 100%;
}

#loginform a.forgot-pw:not(:hover)
{
	color: var(--branding-primary);
}

@media(min-width: 512px)
{
	.page-login .right ul
	{
		columns: 2;
	}
}

@media(min-width: 1024px)
{
	.page-login .body-text
	{
		display: grid;
		gap: 4rem;
		grid-template-columns: 1fr 1fr;
	}
}
.page-login .btn
{
	display: inline-block;
	margin-top: 1rem;
	padding: .5rem 1rem;
}
/* Bottom menu */
#bottom-menu
{
	background-color: rgba(255,255,255,.7);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	bottom: 0;
	border-top: 1px solid var(--accent-dark);
	box-shadow: 0 -4px 10px rgba(0, 0, 0, 0.1);
	left: 0;
	position: fixed;
	width: 100%;
	z-index: 999;
}
@media(min-width: 768px)
{
	#bottom-menu { display: none; }
}
ul.bottom-menu-items
{
	display: flex;
	flex-direction: row;
	list-style-type: none;
	justify-content: space-between;
}
li.bottom-menu-item
{
	align-self: center;
	flex: 0 0 25%;
	justify-self: center;
	white-space: nowrap;
}
li.bottom-menu-item a,
li.bottom-menu-item div
{
	align-items: center;
	color: #666;
	cursor: pointer;
	display: flex;
	flex-direction: column;
	font-size: 1.5rem;
	padding: .75rem 1rem;
	text-decoration: none;
}
li.bottom-menu-item span
{
	font-size: .7rem;
}
/* Dark mode */
li#theme-switch
{
	display: flex;
  align-items: center;
  gap: 1rem;
  justify-content: flex-start;
  padding: 1rem 2rem;
}
.theme-switch
{
	display: inline-block;
	height: 25px;
	position: relative;
	width: 50px;
}

.theme-switch input
{
	display: none;
}
.slider
{
	cursor: pointer;
	background-color: #ccc;
	border-radius: 25px;
	height: 100%;
	position: absolute;
  transition: 0.4s;
  width: 100%;
}
.slider:before
{
	background-color: white;
	border-radius: 50%;
	bottom: 3px;
	content: "";
	height: 20px;
	left: 5px;
	position: absolute;
	transition: 0.4s;
	width: 20px;
}
input:checked + .slider
{
	background-color: #111;
}
input:checked + .slider:before
{
	transform: translateX(24px);
}
/* Sidenote */
/*.body-text .sidenote
{
	background-color: #ddd;
	color: #000;
	padding: 0.5rem 1rem;
	position: relative;
	margin-block: 1.5rem;
}
.body-text .sidenote::before
{
	border: 4px solid var(--branding-primary);
	border-radius: 3px;
	content: '';
	height: 6px;
	left: -9px;
	position: absolute;
	top: -9px;
	width: 6px;
}

.body-text .sidenote a
{
	border-bottom: none;
	color: #FFF !important;
}

.body-text .sidenote a::after
{
	content: '\203A';
	margin-left: 0.5rem;
} */
.sidenote,
.body-text section.highlighted
{
  margin: 2rem 0;
  padding: 1rem 1.5rem;
  background-color: var(--main-bkg);
  color: var(--text-color);
  font-size: 0.95rem;
  line-height: 1.6;
  border-left: 4px solid var(--accent-dark);
  border-right: 4px solid var(--accent-dark);
  border-top: 1px solid #2a2a2a;
  border-bottom: 1px solid #2a2a2a;
  box-shadow: none;
  text-shadow: none;
  letter-spacing: 0.01em;
  transition: border 0.3s ease;
}
.body-text section.highlighted
{
	font-size: 1.125rem;
}

.sidenote:hover,
.body-text section.highlighted:hover {
  border-left-color: #e53935; 
  border-right-color: #e53935; 
}

/* SEARCH */

.meest
{
	background-color: var(--col-light-gray);
	display: flex;
	flex-direction: column;
	gap: 1rem;
	padding: 3rem 2rem;
	margin-block: 2rem;
}
.meest p
{
	font-family: "Merriweather";
	font-size: 1.375rem;
	font-weight: 700;
}
.meest a
{
	border: none;
	background-color: var(--col-accent-light);
	border-radius: 4px;
	font-family: "Work Sans", sans-serif;
	font-size: 1.375rem;
	font-weight: 500;
	line-height: 1.6;
	text-decoration: none;
	color: white;
	transition-duration: .4s;
	padding: .75rem 1.75rem;
}
.meest a:hover
{
	background-color: var(--col-accent-dark);
	cursor: pointer;
}

/* .searchform div
{
	display: flex;
	flex-direction: row;
	justify-content: center;
}

@media(min-width: 960px)
{
	#searchform
	{
		margin-inline: auto;
		width: 740px;
	}
}

.searchform input[type=text]
{
	border: none;
	flex: 1 1 100%;
	font-size: 1.25rem;
	line-height: 1.5;
	padding: 0.5rem 1.25rem;
	width: 100%;
}

.searchform input[type=submit]
{
	background-color: var(--col-accent-light);
	border: 1px solid var(--col-accent-light);
	border-radius: 0 3px 3px 0;
	color: white;
	flex: 0 0 auto;
	font-weight: 400;
	font-size: 1.25rem;
	line-height: 1.5;
	padding: 0.5rem 1.25rem;
	transition-duration: .5s;
}

.searchform button:hover
{
	background-color: var(--col-accent-dark);
} */

.page-search #site-header .searchform#searchform
{
	display: none;
}
.search .searchform#searchform
{
	width: 720px;
	max-width: 100%;
}
.search .searchform#searchform #searchico,
.search .searchform#searchform #searchico input
{
	width: 100%;
}

.search-artikel
{
	text-transform: capitalize;
}

.is-search-checkbox-query-clicked
{
	display: flex;
	flex-direction: column;
}
.is-search-checkbox-query-clicked span
{
	color: var(--accent-dark);
	transition-duration: .4s;

}

.is-search-checkbox-query-clicked span:hover
{
	cursor: pointer;
	color: var(--accent-light);
}

.search-checkbox-query-element
{
	display: none;
}
.search-checkbox-query-element-ja
{
	display: inline-block;
}


.search-form
{
	margin-right: 3rem;
	max-width: 300px;
}

.check
{
	color: var(--text-color);
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	line-height: 2;
	padding-left: 2.5rem;
	position: relative;
}

.check:hover
{
	cursor: pointer;
}

.posts-counter
{
	color: #aeaeae;
}

.search-filters input[type="checkbox"]
{
	left: -9999em;
	position: absolute;
}

.check span:nth-child(2)
{
	max-width: 60%;
	word-wrap: normal;
}

.search input[type="checkbox"] + span::before
{
	border: 1px solid var(--text-color);
	border-radius: 4px;
	content: '';
	display: inline-block;
	font-family: FontAwesome;
	height: 1.1rem;
	left: 0;
	line-height: 1.1rem;
	position: absolute;
	top: 4px;
	width: 1.1rem;
}

.search input[type="checkbox"]:checked + span::before
{
	content: '\f00c';
	text-align: center;
}

.search-results-counter
{
	color: var(--text-color);
	margin-bottom: 2rem;
}

#search-main
{
	display: flex;
	flex-direction: column;
	gap: 1rem;
	grid-template-columns: auto 1fr;
}

#search-main #search-title h1
{
	font-size: 1.5625rem;
	margin-bottom: .5rem;
}

#search-main .checkbox-search
{
	display: flex;
	flex-direction: row;
}

#search-main .thumbnail,
#page-dossiers-posts .thumbnail
{
	width: 100%;
	height: auto;
}

#search-main .article-search
{
	margin-bottom: 1.75rem;
}

#search-main .article-search a:hover,
#page-dossiers-posts .article-search a:hover
{
	text-decoration: none;
}

#search-main .article-search a:hover h3,
#page-dossiers-posts .article-search a:hover h3
{
	text-decoration: underline;
}

#search-main .checkbox-search h3
{
	color: var(--text-color);
	font-family: "Merriweather", sans-serif;
	font-size: 1.0625rem;
	font-weight: 600;
	font-variant-ligatures: none;
	margin-bottom: 0.5rem;
	margin-top: 2rem;
}

#search-author-name
{
	color: var(--col-accent-light);
	font-weight: 700;
}
.search div.search-date
{
	color: var(--text-color);
	display: flex;
	flex-direction: column;
	gap: .5rem;
	max-width: 100%;
}
.search div.search-date input
{
	border: 1px solid var(--text-color);
	border-radius: 4px;
	outline: 0;
}
select#sort
{
	background-color: var(--main-bkg);
	border: 1px solid var(--text-color);
	border-radius: 4px;
	color: var(--text-color);
	margin-top: .75rem;
	padding: .5rem;
  	width: 100%;
}
.search .search-sort label
{
	color: var(--text-color);
}
article .pubdate
{
	color: var(--text-color);
}
article .excerpt
{
	color: var(--text-color);
}

@media(max-width: 767px)
{
	#search-main .checkbox-search { display: none; }
}

@media(min-width: 768px)
{
	#search-main #search-title h1 { font-size: 2.1875rem; }
	#search-main { display: grid; justify-items: start;}
	#search-main #search-title { grid-area:	1 / 1 / span 1 / span 3; justify-self: center; }
	#search-main .checkbox-search { grid-area: 2 / 1 / span 2 / span 1; }
	#search-main .search-results { grid-area: 2 / 2 ; margin-bottom: 4rem;}
	#search-main div:last-child { grid-area: 3 / 1 / span 1/ span 3; justify-self: center; }

	#search-main .thumbnail-wrapper,
	#page-dossiers-posts .thumbnail-wrapper
	{
		display: flex;
		align-self: center;
	}

	#search-main .thumbnail,
	#page-dossiers-posts .thumbnail
	{
		aspect-ratio: 2;
		width: 100%;
		max-width: 200px;
		object-fit: cover;
		align-self: baseline;
	}
	#search-main .meta,
	#page-dossiers-posts .meta{ max-width: 30vw; }

	#search-main .article-search a,
	#page-dossiers-posts .article-search a
	{
		display: flex;
		flex-direction: row;
		gap: 1rem;
	}
	#page-dossiers-posts > p
	{
		width: 70% !important;
	}
}

@media(min-width: 1240px)
{
	#search-main .thumbnail,
	#page-dossiers-posts .thumbnail { max-width: 300px; }
}

@media(min-width: 1740px)
{
	#search-main { grid-template-columns: repeat(9, 1fr); }
	#search-main #search-title { grid-area:	1 / 1 / span 1 / span 9; justify-self: center; }
	#search-main .checkbox-search { grid-area: 2 / 1 / span 2 / span 2; }
	#search-main .search-results { grid-area: 2 / 3 / span 2 / span 7; margin-bottom: 4rem;}
	#search-main div:last-child { grid-area: 3 / 1 / span 1/ span 9; justify-self: center; }
	#search-main .thumbnail,
	#page-dossiers-posts .thumbnail { max-width: 400px; }
	#search-main .meta,
	#page-dossiers-posts .meta { max-width: 32vw; }
}
.search-form
{
	display: flex;
	flex-direction: column;
	gap: .5rem;
}

/* search results */
body.search-results #content .pillar
{
	max-width: 860px;
}

#search-form-wrapper
{
	background: #1E1E1E;
	color: #FFF;
	padding-block: 2rem;
}

#search-form-wrapper p
{
	margin-top: 1rem;
}

#search-result-count
{
	background: var(--light);
	font-weight: bold;
	margin-bottom: 1rem;
	padding-block: 2rem;
}

.search article
{
	display: flex;
	flex-direction: column;
	gap: 0.625rem;
	margin-bottom: 1.5rem;
	padding-inline: 0;
}
.search article a h2
{
	color: var(--text-color);
	transition: .3s ease-out;
}
.search article a:hover h2
{
	color: var(--branding-primary);
}

.search .post-title
{
	font-family: 'Avenir', sans-serif;
	font-size: 1.625rem;
	font-weight: 400;
}
.search-articles-container
{
	display: flex;
	flex-direction: column;
}
.label-1,
.label-2,
.label-3,
.label-4,
.label-5,
.label-6,
.label-7,
.label-8
{
	position: relative;
}
.label-1::after,
.label-2::after,
.label-3::after,
.label-4::after,
.label-5::after,
.label-6::after,
.label-7::after,
.label-8::after
{
  font-family: 'CachetPro', sans-serif;
  font-size: .8rem;
  font-weight: 700;
  text-transform: uppercase;
  top: 0;
  left: 0;
  padding: .5rem;
  position: absolute;
}
.article-longread.label-1::after,
.article-longread.label-2::after,
.article-longread.label-3::after,
.article-longread.label-5::after,
.article-longread.label-6::after,
.article-longread.label-7::after,
.article-longread.label-8::after
{
	left: 1.4rem;
}
.article-longread
{
	position: relative;
}
.article-longread::before
{
  content: '\f022';
  font-family: 'FontAwesome';
  font-size: .8rem;
  font-weight: 700;
  text-transform: uppercase;
  top: 0;
  left: 0;
  padding: .5rem;
  position: absolute;
  z-index: 1;
}
.reading { color: white; background-color: var(--branding-primary); }

/* video page */
.youtube-video-page
{
	background-color: var(--main-bkg);
	color: var(--text-color);
	font-family: inherit;
	max-width: 1200px;
	margin: 0 auto;
	padding: 40px 20px;
}

.youtube-header
{
	margin-bottom: 40px;
	text-align: center;
}

.youtube-header h1
{
	color: var(--text-dark-color);
	font-size: 2.5em;
}

.video-grid
{
	display: grid;
	gap: 30px;
	grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
}

.video-list-item-wrapper
{
	color: inherit;
	display: flex;
	height: 100%;
	text-decoration: none;
}

.video-list-item
{
	background-color: var(--light-bkg);
	border: 1px solid var(--light);
	border-radius: 3px;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.video-thumbnail
{
	aspect-ratio: 16 / 9;
	display: block;
	object-fit: cover;
	width: 100%;
}

.video-title
{
	color: var(--text-color);
	font-size: 1.1em;
	font-weight: bold;
	padding: 15px 15px 5px;
}

.video-date
{
	color: var(--menu-links);
	font-size: 0.9em;
	padding: 0 15px 15px;
}

/* Spotify */
.podcasts-more
{
	background-color: #8a2f26;
	color: #fff;
	display: inline-block;
	margin: 1rem 0 0 .625rem;
	padding: .5rem 1rem;
}
.audio-player-container
{
	background-color: #8a2f26;
	border-radius: 3px;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
	margin: 10px auto;
	max-width: 600px;
	padding: 4px 10px;
	text-align: center;
}

/* Title style */
.audio-player-title
{
	align-items: center;
	color: white;
	display: flex;
	font-family: 'Arial', sans-serif;
	font-size: .875rem;
	font-weight: 600;
	justify-content: space-between;
	margin-bottom: 10px;
	text-align: left;
	text-transform: capitalize;
}
.audio-player-title i { font-size: 2rem; }

.spotify-icon
{
	height: auto;
	width: 25px;
}

.spotify-link
{
	display: inline-block;
}

.audio-player
{
	border-radius: 8px;
}

.audio-player audio
{
	appearance: none;
	/* background-color: #000; */
	border-radius: 8px;
	cursor: pointer;
	height: 50px;
	outline: none;
	width: 100%;
	-webkit-appearance: none;
}
.audio-player audio::-webkit-media-controls-panel
{
	background-color: #8a2f26 !important;
	border-radius: 8px;
}

.audio-player audio::-webkit-media-controls-play-button
{
	background-color: #fff !important;
	border-radius: 50%;
}

.audio-player audio::-moz-range-thumb
{
	background-color: #8a2f26;
	border-radius: 8px;
}

.audio-player audio::-moz-range-track
{
	background-color: #fff;
}

.pmgsub-nag::before {
  background: linear-gradient(to top, var(--main-bkg) 1rem, transparent) !important;
}

.progress-bar {
  width: 100%;
  height: 5px;
  background: #ddd;
  margin-top: 5px;
  position: relative;
}
.progress-fill {
  width: 0%;
  height: 100%;
  background: #4caf50;
  transition: width 0.1s linear;
}

.progress-container {
  position: relative;
  height: 20px;
  background: #ddd;
  border-radius: 10px;
  cursor: pointer;
  margin-top: 10px;
}

.progress-fill {
  height: 100%;
  background: #4caf50;
  width: 0%;
  border-radius: 10px;
  transition: width 0.1s linear;
}

.progress-time {
  margin-top: 5px;
  font-size: 14px;
  color: #555;
}
audio::-webkit-media-controls-time-remaining-display,
audio::-webkit-media-controls-current-time-display
{
  color: white;
}
/* SWITCH */
.switch-container
{
	align-items: center;
	border-bottom: 1px solid #ddd;
	border-top: 1px solid #ddd;
	display: flex;
	padding-inline: .5rem;
}
.login-button
{
	order: 3;
}
.switch-container-desktop
{
	align-items: center;
	display: flex;
	order: 4;
}
.switch
{
	display: inline-block;
	height: 24px;
	position: relative;
	width: 62px;
}
.switch input
{
	height: 0;
	width: 0;
	opacity: 0;
}
.slider
{
	background-color: #ccc;
	border-radius: 24px;
	bottom: 0;
	cursor: pointer;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	transition: 0.4s;
}
.slider:before
{
	background-color: white;
	bottom: 3px;
	border-radius: 50%;
	content: "";
	height: 18px;
	left: 3px;
	position: absolute;
	transition: 0.4s;
	width: 18px;
}
input:checked + .slider
{
    background-color: #000;
}
input:checked + .slider:before
{
	transform: translateX(36px);
}
.slider.round
{
	border-radius: 24px;
}
.slider.round:before
{
	border-radius: 50%;
}
.slider::after
{
	content: "UIT";
	color: #333;
	font-size: 12px;
	font-weight: bold;
	position: absolute;
	right: 10px;
	top: 50%;
	transition: 0.4s;
	transform: translateY(-50%);
}
input:checked + .slider::after
{
	content: "AAN";
	color: #e9e9e9;
	font-size: .6rem;
	left: 10px;
	right: auto;
}
h6 .amo-brandstory
{
	background-color: #777;
	font-size: .7rem;
	margin-left: .25rem;
	padding: .2rem;
}

@media(max-width: 767px)
{
	.articles-home
	{
		display: flex;
		gap: 1rem;
		flex-wrap: wrap;
	}
	.articles-home .highlight,
	.articles-home .highlight-small-3,
	.articles-home .highlight-small-6
	{
		flex: 0 0 100%;
	}
	.articles-home .highlight-small-1,
	.articles-home .highlight-small-2,
	.articles-home .highlight-small-4,
	.articles-home .highlight-small-5
	{
		aspect-ratio: 1 / 1;
		align-self: flex-start;
		flex: 0 0 calc(50% - .5rem);
	}
	.articles-home .highlight-small-1 img,
	.articles-home .highlight-small-2 img,
	.articles-home .highlight-small-4 img,
	.articles-home .highlight-small-5 img
	{
		aspect-ratio: 1 / 1;
	}
	.articles-home .highlight-small-1 h2,
	.articles-home .highlight-small-2 h2,
	.articles-home .highlight-small-4 h2,
	.articles-home .highlight-small-5 h2
	{
		font-size: 1.125rem;
	}
}
/* Google chrome images */
@media(min-width: 768px)
{
	article.highlight-small-3,
	article.highlight-small-4,
	article.highlight-small-5,
	article.highlight-small-6
	{
		max-width: 283px;
		max-height: 283px;
	}
}
@media (min-width: 1024px) and (max-width: 1282px)
{
  article.highlight-small-3,
  article.highlight-small-4,
  article.highlight-small-5,
  article.highlight-small-6
  {
    max-width: 300px;
    max-height: 300px;
  }
}
@media(max-width: 767px)
{
	article.highlight-small-8 { margin-top: 1rem; }
	.left-side-block { margin: auto; }
}
/* SHOP */

.woocommerce-page p
{
	color: var(--text-color);
}

.woocommerce-page #primary
{
	display: flex;
	flex-direction: column;
}
.woocommerce-page .btn-add-to-cart
{
	border: none;
	cursor: pointer;
	outline: none;
	padding: .5rem .5rem;
}
.woocommerce-page .add-to-cart label
{
	color: var(--text-color);
}
.woocommerce-page .archive-heading 
{
	margin-bottom: 2rem;
}
.woocommerce-page .archive-heading a.btn-to-cart
{
	font-size: 1.5rem;
	float: right;
}
.single-product .tax-rate
{
	color: var(--text-color);
}
@media(min-width: 768px)
{
	.woocommerce-page #primary
	{
		display: flex;
		flex-direction: row;
	}			
}
.page-winkelwagen #coupon_code
{
	padding: .35rem;
	width: 130px !important;
}
.page-winkelwagen #coupon_code + .button
{
	padding: .5rem;
}
.woocommerce-error,
.woocommerce-info,
.woocommerce-message
{
	background-color: #F7F6F7;
	border-top: 3px solid #A46497;
	color: #515151;
	font-size: 1rem;
	line-height: 2;
	margin: 0 0 2em;
	overflow: hidden;
	padding: 1em 2em 1em 3.5em;
	position: relative;
	word-wrap: break-word;
}

.woocommerce-error::before,
.woocommerce-info::before,
.woocommerce-message::before
{
	display: inline-block;
	font-family: FontAwesome;
	left: 1.5em;
	position: absolute;
	top: 1em;
}

.woocommerce-error .button,
.woocommerce-info .button,
.woocommerce-message .button
{
	background-color: #DFDCDE;
	border: none;
	border-radius: 3px;
	color; #515151;
	cursor: pointer;
	float: right;
	font-weight: 700;
	line-height: 1;
	margin: 0;
	padding: 0.618em 1em;
	text-decoration: none;
}

.woocommerce-message { border-top-color: #8FAE1B; }
.woocommerce-message::before { color: #8FAE1B; content: '\F058'; }

.single-product #main
{
	margin: 0 auto 2rem;
	max-width: 730px;
	width: 100%;
}

.single-product .shop-title
{
	font-family: 'Avenir', sans-serif;
	font-size: 2.375rem;
	font-weight: 500;
	padding-block: 1rem;
}

.single-product .product-image
{
	height: auto;
	width: 100%;
}

.single-product .shop-description,
.single-product .add-to-cart
{
	font-family: 'Avenir', sans-serif;
	font-size: 1.125rem;
	line-height: 2;
}

.single-product .shop-description h2
{
	font-family: 'Avenir', sans-serif;
	font-size: 1.875rem;
	font-weight: 500;
}

.single-product .shop-description p
{
	margin-bottom: 1.5625rem;
}

.single-product .pricing .amount
{
	font-size: 1.375rem;
}

.post-type-archive-product .products,
.tax-product_cat .products
{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	font-family: 'Avenir', sans-serif;
	gap: 2rem;
}

.post-type-archive-product .products li,
.tax-product_cat .products li
{
	align-items: flex-start;
	display: flex;
	flex: 0 0 100%;
	flex-direction: row;
	gap: 1rem;
}
@media(min-width: 768px)
{
	.post-type-archive-product .products li,
	.tax-product_cat .products li
	{
		flex: 0 0 calc(50% - 1rem);
	}
}

.post-type-archive-product .products li img,
.tax-product_cat .products li img
{
	box-shadow: 0 0 10px rgba(0,0,0,0.37);
	height: auto;
	max-width: 98px;
}

.post-type-archive-product .products li h2.product-title,
.tax-product_cat .products li h2.product-title
{
	font-size: 1.125rem;
	font-weight: 400;
}

.post-type-archive-product .products li .category-name,
.tax-product_cat .products li .category-name
{
	font-size: 0.75rem;
	font-weight: 900;
	text-transform: uppercase;
}

.post-type-archive-product .products li p,
.tax-product_cat .products li p
{
	margin-bottom: 1em;
}

.post-type-archive-product .products li p a,
.tax-product_cat .products li p a
{
	border-bottom: 1px solid rgba(0,0,0,0.1);
	color: var(--accent);
}

.post-type-archive-product .products li .pricing .amount,
.tax-product_cat .products li .pricing .amount
{
	font-size: 0.8125rem;
}

.add-to-cart .btn-add-to-cart
{
	background-color: var(--accent-premium, #19A113);
	color: #fff;
	font-weight: bold;
	text-transform: uppercase;
}

.add-to-cart fieldset
{
	border-color: var(--light);
	border-style: solid none none;
	border-width: 1px 0 0;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	padding: 1rem 0;
	width: 100%;
}

.add-to-cart .pricing .amount
{
	color: var(--accent, #C2191A);
	display: block;
	font-family: 'Avenir', sans-serif;
	font-weight: 900;
}

.add-to-cart .quantity
{
	margin-left: 1rem;
	padding-inline: 0.5rem;
	text-align: center;
	width: 4rem;
}

.add-to-cart .tax-rate
{
	display: block;
	font-size: 0.6875rem;
	text-transform: uppercase;
}

.woocommerce .quantity .qty
{
	min-height: none;
	padding: 0;
}

.woocommerce .cart #coupon_code
{
	min-height: none;
}

.woocommerce .checkout #order_comments
{
	height: 8rem;
}

/* blockquote */
.body-text blockquote
{
	color: var(--text-color);
	font-family: 'Ciutadella', sans-serif;
	font-size: 2rem;
	font-weight: 500;
	font-style: italic;
	line-height: 1.3125;
	margin: 2rem 0;
	position: relative;
	text-align: center;
	white-space: break-spaces;
}
.body-text blockquote p
{
	color: var(--text-color);
	display: inline-block;
	font-size: 2rem;
	font-weight: 500;
	margin-bottom: 0;
}
.body-text .amo-bq
{
	font-size: 2.5rem;
}

/*.read-voice { display: none; }
	body.speech-available .read-voice { display: block; } */

/* Advertise plugin customization */
#adv-section-4 .adv-partner-block-meta-wrapper h2,
#adv-section-4 .adv-partner-block-meta-wrapper p
{
	color: var(--text-color);
}
#adv-section-3, #adv-section-5, #adv-section-6, #adv-section-4 .adv-partner-block-meta-wrapper
{
	background-color: var(--main-bkg);
}
.adv-4-col-el p, #adv-section-3 p, #adv-section-5 p, #adv-section-6 p
{
	color: var(--text-color);
}
.page-template-ptl-advertise-php #site-header { display: none; }