/*
	Theme Name: sundaysoutdoors.com 2.1
	Version: 2.1
*/





/* ! _IMPORTS */

@font-face {font-family: 'HKGrotesk-Regular';src: url('_assets/fonts/HKGrotesk-Regular.eot');src: url('_assets/fonts/HKGrotesk-Regular.eot?#iefix') format('embedded-opentype'),url('_assets/fonts/HKGrotesk-Regular.woff2') format('woff2'),url('_assets/fonts/HKGrotesk-Regular.woff') format('woff'),url('_assets/fonts/HKGrotesk-Regular.ttf') format('truetype');}

@font-face {font-family: 'HKGrotesk-Bold';src: url('_assets/fonts/HKGrotesk-Bold.eot');src: url('_assets/fonts/HKGrotesk-Bold.eot?#iefix') format('embedded-opentype'),url('_assets/fonts/HKGrotesk-Bold.woff2') format('woff2'),url('_assets/fonts/HKGrotesk-Bold.woff') format('woff'),url('_assets/fonts/HKGrotesk-Bold.ttf') format('truetype');}

@font-face {font-family: 'NTFGrand-Regular';src: url('_assets/fonts/3896D4_0_0.eot');src: url('_assets/fonts/3896D4_0_0.eot?#iefix') format('embedded-opentype'),url('_assets/fonts/3896D4_0_0.woff2') format('woff2'),url('_assets/fonts/3896D4_0_0.woff') format('woff'),url('_assets/fonts/3896D4_0_0.ttf') format('truetype');}
 





/* ! _RESET (v2.5) */

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

main { display: block }

a, a:hover,
.button,
.button__menu {
	-moz-transition: all 0.3s linear;
	-o-transition: all 0.3s linear;
	-ms-transition: all 0.3s linear;
	-webkit-transition: all 0.3s linear;
	transition: all .3s linear }

div, header, footer, section, article { overflow: hidden }

img, embed, object, video, .wp-caption {
	max-width: 100% !important;
	height: auto }

audio { width: 100% }

iframe { max-width: 100% }

button, input, select, textarea { margin: 0 }

* { overflow: visible }





/* ! ADJUSTMENTS ➜ hacks */

img {
	display: block;
	border: 1px solid # }

a img { border: none }

.clearfix:after {
  content: "";
  display: table;
  clear: both }

.nobr { white-space: nowrap }

.kill-in-large { display: none }
.kill-in-small { display: inline }


@media
(max-width: 1000px) {
	.kill-in-large { display: inline }
	.kill-in-small { display: none !important }
}/**/





/* ! ADJUSTMENTS ➜ javascript */

#site-header {}





/* ! ADJUSTMENTS ➜ text sizes */

body { font-size: 0 }

.data,
article nav,
#site_footer,
.teaser {
	font-size: 12px;
	line-height: 1em }

.teaser { line-height: 1.2em }

#c--related .teaser h2,
#c--related .teaser h3,
.group article header,
.home .abenteuer .desc {
	font-size: 16px;
	line-height: 1.3em }

article,
#season .intro .desc,
.what_is_so {
	font-size: 18px;
	line-height: 1.6em }

.teaser h2,
#site_header nav,
.page-hintergrund main {
	font-size: 24px;
	line-height: 1.1em }

article h2,
#c--related h1,
nav.countries {
	font-size: 36px;
	line-height: 1.2em }

article header h1,
.txt h1,
.home h1 {
	font-size: 40px;
	line-height: 1.1em }

big,
.archive h1,
.home .intro h1 { font-size: 55px;
	line-height: 1em }


@media
(max-width: 1300px) {
	.group article header { font-size: 12px }
	
	.group article header h1 { font-size: 24px }
}/**/


@media
(max-width: 600px) {
	article,
	.page-hintergrund main,
	#season .intro .desc { font-size: 16px }

	#site_header nav {
		font-size: 20px;
		line-height: 1.5em }
	
	nav.countries { font-size: 24px }
	
	big,
	.archive h1,
	.home .intro h1 { font-size: 40px }
}/**/





/* ! ADJUSTMENTS ➜ text styling */

body {
	font-family: Apercu, 'HKGrotesk-Regular', sans-serif;
	-webkit-font-smoothing: subpixel-antialiased;
	-webkit-text-size-adjust: 100% }

strong,
article nav,
#site_footer p:first-of-type,
.teaser h2 { font-family: 'HKGrotesk-Bold', sans-serif }

#site_header nav,
big,
article header h1,
article h2,
#c--related h1,
.archive h1,
.txt h1,
nav.countries,
.home h1 { font-family: 'NTFGrand-Regular', sans-serif }

em { font-style: italic }

strong { font-weight: bold }

.txt h1 + * { margin-top: 1.5em }
.txt * + h2 { padding-top: 1em }
.txt h2 + * { margin-top: 1.5em }
.txt p + *,
.txt ul + *,
.txt ol + * { margin-top: 1em }
.txt li + li { margin-top: .25em }

.txt ul,
.txt ol { padding-left: 1em }

.txt ul li { list-style: disc }
.txt ol li { list-style: decimal }





/* ! ADJUSTMENTS ➜ flex */

.flex {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between }

.flex--4 .flex--item { flex-basis: 23% }

.flex--4 .flex--item { margin-bottom: 20px }


@media
(max-width: 1000px) {
	.flex--4 .flex--item { flex-basis: 46% }
}/**/


@media
(max-width: 500px) {
	.flex--4 .flex--item { flex-basis: 100% }
}/**/





/* ! ELEMENT ➜ a (links) */

a,
a:active,
a:visited,
a:hover {
	display: inline-block;
	text-decoration: underline;
	color: inherit }

a:hover {  }

h1 a:hover { color: inherit }





/* ! ELEMENT ➜ buttons */

.button,
.button:before {  }





/* ! BLOCK ➜ body */

body {
	overflow-x: hidden;
	overflow-y: scroll;
	color: #262728;
	background-image: url('_assets/bg/topo.png');
	background-size: 400px 397px }





/* ! BLOCK ➜ c--main */

#c--main { padding: 0 60px }


@media
(max-width: 600px) {
	#c--main { padding: 0 20px }
}/**/





/* ! BLOCK ➜ main */

main { margin-top: 150px }

.home main { margin-top: 200px }


@media
(max-width: 600px) {
	main,
	.home main { margin-top: 0 }
}/**/





/* ! BLOCK ➜ site_header */

#site_header {
	position: fixed;
	z-index: 1;
	width: calc(100vw - 120px);
	margin: 50px 0 }

#site_header > * { width: 33.333% }

#site_header nav a {
	padding-right: 20px;
	text-decoration: none }

#site_header > *,
#site_header ul,
#site_header li {
	display: inline-block;
	vertical-align: middle }

#site_header .nav_action #button--open_toc {
	stroke: black;
	stroke-width: 16;
	width: 24px;
	height: 24px }

#site_header .nav_action #button--back {
	-moz-transform: scale(-1, 1);
	-webkit-transform: scale(-1, 1);
	-o-transform: scale(-1, 1);
	-ms-transform: scale(-1, 1);
	transform: scale(-1, 1) }

#site_header .logo { text-align: center }

#site_header .logo img {
	height: 50px;
	width: auto }

#site_header .social { text-align: right }

#site_header .social svg {
	height: 15px;
	width: auto;
	margin-right: 10px }

.strava svg:hover { fill: #fc6721 }
.instagram svg:hover { fill: #be4477 }
.facebook svg:hover { fill: #4469b0 }

#site_header .social .strava svg { height: 11px }


/* Header doch nicht statisch

#site_header {
	position: relative;
	width: 100% !important;
	margin: 50px 0 }

main { margin-top: 0 } */


@media
(max-width: 600px) {
	#site_header {
		position: relative;
		width: 100% !important;
		margin: 50px 0 }
	
	#site_header .social .strava { display: none }
}/**/





/* ! BLOCK ➜ toc */

#toc { display: none }





/* ! BLOCK ➜ data */

.data span,
.toc--article a {
	display: inline-block;
	margin-right: 20px;
	line-height: 20px;
	background-repeat: no-repeat;
	background-position: left center;
	background-size: auto 20px;
	padding-left: 23px;
	padding-top: 2px }

.data span { margin-top: 2px }

.data span.ort {
	clear: right;
	background-image: url('_assets/icons/iconmonstr-globe-5.svg');
	background-size: auto 18px;
	padding-left: 25px }

.data span.distanz {
	background-image: url('_assets/icons/iconmonstr-ruler-24.svg');
	background-size: auto 14px;
	padding-left: 22px }

.data span.hoehe {
	background-image: url('_assets/icons/iconmonstr-triangle-2.svg');
	background-size: auto 16px;
	padding-left: 22px }





/* ! BLOCK ➜ toc--article */

.toc--article a { text-decoration: none }

.toc--article a { margin-top: 14px }

.toc--article .fotos {
	background-image: url('_assets/icons/iconmonstr-picture-17.svg');
	padding-left: 27px }

.toc--article .video {
	background-image: url('_assets/icons/iconmonstr-youtube-6.svg');
	background-size: auto 18px;
	padding-left: 27px }

.toc--article .beschreibung {
	background-image: url('_assets/icons/iconmonstr-text-3.svg');
	background-size: auto 18px;
	padding-left: 23px }

.toc--article .karten {
	background-image: url('_assets/icons/iconmonstr-map-5.svg');
	padding-left: 27px }

.toc--article .ausruestung {
	background-image: url('_assets/icons/iconmonstr-clothing-14.svg');
	padding-left: 27px }





/* ! BLOCK ➜ toc--article mobile */

.toc--article.mobile { display: none }


@media
(max-width: 800px) {
	.toc--article.mobile {
		display: block;
		position: fixed;
		bottom: 0;
		width: 100vw;
		padding: 3px 0 16px;
		text-align: center;
		background: white;
		border-top: 3px solid black }
}/**/





/* ! BLOCK ➜ site_footer */

#site_footer {
	margin-top: 100px;
	margin-bottom: 30px;
	text-align: center;
	opacity: .5 }


@media
(max-width: 800px) {
	#site_footer {
		margin-top: 100px;
		margin-bottom: 70px }
}/**/





/* ! BLOCK ➜ datenschutzhinweis */

#datenschutzhinweis {
	z-index: 9998;
	position: fixed;
	display: none;
	bottom: 10px;
	right: 10px;
	max-width: 500px;
	color: #2F3233;
	background: #d8d8d8;
	background: rgba(255, 255, 255, 0.85);
	border: 5px solid #2F3233;
	font-size: 12px;
	line-height: 1.6em;
	text-align: left }

#datenschutzhinweis p { padding: 13px 20px 10px 20px }

.show_datenschutzhinweis #datenschutzhinweis { display: block }

#datenschutzhinweis .toggle_datenschutzhinweis {
	display: inline-block;
	border: 0px solid #636363;
	border-radius: 5px;
	background: #2B2B2B;
	color: #e2e2e2;
	padding: 1px 6px 1px 6px;
	margin-left: 5px;
	cursor: pointer }


@media
(max-width: 600px) {
	#datenschutzhinweis {
		bottom: 5px;
		right: 5px;
		max-width: calc(100% - 20px) }
}/**/





/* ! BLOCK ➜ What is SO? */

.what_is_so {
	text-align: center;
	border-top: 1px solid #979797;
	border-bottom: 1px solid #979797;
	padding: 40px 0;
	margin: 50px 0 }

.what_is_so p {
	max-width: 1200px;
	margin: auto }

.what_is_so big {
	display: inline-block;
	padding: 30px 0;
	color: #929496 }





/* ! PAGE ➜ SINGLE */

.single #site_header,
.single #c--main { width: calc(100vw - 120px - 240px) }

.single #c--main,
.single #c--related {
	display: inline-block;
	vertical-align: top }

#c--related {
	position: fixed;
	width: 200px;
	padding: 0 20px;
	height: 100vh;
	background: #E9E9E9;
	overflow: scroll }

.single article header {
	display: flex;
	flex-direction: column;
	justify-content: center;
	position: fixed;
	top: 100px;
	height: calc(100vh - 160px - 60px);
	left: 60px;
	width: calc(25vw - 60px) }

.single article main {
	position: absolute;
	margin-top: 0;
	top: 160px;
	right: 300px;
	width: calc(75vw - 60px - 300px) }

.single #video div {
	position: relative;
	width: 100%;
	height: 0;
	padding-bottom: 56.25% }

.single #video div iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100% }

.single article header > * > * { margin-bottom: 20px }

.single article section + section { margin-top: 200px }

.single .i + .i { margin-top: 80px }

.single .i { border-radius: 0px }

.single .i,
.single article .txt {
	text-align: center;
	margin-left: auto;
	margin-right: auto }

.single article .txt { text-align: left }

.single article .txt h1,
.single article .txt h2 { text-align: center }

.single .cover,
.single .hoch,
.single article .txt { max-width: 700px }

#c--related a {
	opacity: 1;
	text-decoration: none }

#c--related a:hover { opacity: 1 }

#c--related .cover {
	border-radius: 3px;
	margin: 10px 0 }

#c--related h1 { margin-top: 60px }

#c--related .teaser { margin-top: 50px }

#c--related .teaser:last-of-type { margin-bottom: 60px }


@media
(max-width: 1200px) {
	.single article { margin-top: 160px }
	
	.single article header {
		display: block;
		position: relative;
		top: 0;
		left: 0;
		width: 100%;
		height: auto;
		text-align: center }
	
	.single article header .intro { text-align: left }
	
	.single article header { margin-bottom: 30px }
	
	.single article main {
		position: relative;
		top: 0;
		right: 0;
		width: 100% }
}/**/


@media
(max-width: 800px) {
	.single #c--related { display: none }
	
	.single #site_header,
	.single #c--main { width: calc(100vw - 120px) }
}/**/


@media
(max-width: 600px) {
	.single #c--main { width: calc(100% - 40px) }
	
	.single article { margin-top: 0 }
	
	.single article section + section { margin-top: 100px }

	.single .i + .i { margin-top: 25px }
}/**/




/* ! PAGE ➜ ABENTEUER */

.post-type-archive-abenteuer section { padding: 50px 0 }

nav.countries { text-align: center }

nav.countries li { display: inline-block }

nav.countries li a { padding: 1em .3em }

.teaser a { text-decoration: none }

.post-type-archive-abenteuer .teaser .cover {
	float: left;
	width: 40%;
	border-radius: 3px; }

.post-type-archive-abenteuer .teaser .desc {
	float: right;
	width: 55% }

.post-type-archive-abenteuer .teaser .data { margin: 10px 0 }

.post-type-archive-abenteuer .flex {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	justify-content: flex-start }

.post-type-archive-abenteuer .teaser {
	flex-basis: 30%;
	margin: 30px 0 }

.post-type-archive-abenteuer .teaser:nth-child(3n-1),
.post-type-archive-abenteuer .teaser:nth-child(3n+3) { margin-left: 5% }


@media
(max-width: 1400px) {
	.post-type-archive-abenteuer .teaser { flex-basis: 44% }
	
	.post-type-archive-abenteuer .teaser:nth-child(3n-1),
	.post-type-archive-abenteuer .teaser:nth-child(3n+3) { margin-left: 0 }
	.post-type-archive-abenteuer .teaser:nth-child(even) { margin-left: 6% }
}/**/


@media
(max-width: 900px) {
	.post-type-archive-abenteuer .teaser { flex-basis: 100% }
	
	.post-type-archive-abenteuer .teaser { margin-left: 0% !important }
}/**/


@media
(max-width: 600px) {
	.post-type-archive-abenteuer section { padding: 30px 0 }
	
	.archive h1 {
		margin-bottom: 20px;
		text-align: center }
}/**/




/* ! PAGE ➜ HOME */

.intro.flex { align-items: center }

#season .intro .desc { flex-basis: 35% }
#season .intro .cover { flex-basis: 60% }

#season .intro h1 { margin: 30px 0 }
.home .abenteuer h1 { margin: 20px 0 }

.home .abenteuer a { text-decoration: none }

.home #season .intro { margin-bottom: 70px }

.home #world .intro h1 { margin-bottom: 50px }

.home #world .data { margin-bottom: 20px }


@media
(max-width: 1100px) {
	#season .intro .desc,
	#season .intro .cover { flex-basis: 100% }
	
	#season .intro .desc { margin-bottom: 70px }
}/**/


@media
(min-width: 1000px) {
	.home #site_header .logo img { height: 100px }
}/**/





/* ! PAGE ➜ /hintergrund */

.page-hintergrund main #intro,
.page-impressum article,
.page-datenschutz article {
	line-height: 1.6em;
	max-width: 700px;
	margin: 100px auto }


@media
(max-width: 600px) {
	.page-hintergrund main #intro,
	.page-impressum article,
	.page-datenschutz article { margin: 50px auto }
}/**/




/* ! PAGE ➜ /impressum */

.page-impressum {}





/* ! PAGE ➜ /datenschutz */

.page-datenschutz article {

}





/* ! PAGE ➜ /404 */

.error404 {  }




