@font-face { font-family:'Signika'; src:url('font/Signika-Light.ttf') format('truetype'); font-weight:300; font-style:normal; }
@font-face { font-family:'Signika'; src:url('font/Signika-Regular.ttf') format('truetype'); font-weight:400; font-style:normal; }
@font-face { font-family:'Signika'; src:url('font/Signika-Bold.ttf') format('truetype'); font-weight:700; font-style:normal; }

html,body { margin:0; padding:0; touch-action:pan-y; }
body { background-color:#fff; font-family:Signika; font-size:16px; color:#0c0600; overflow-y:scroll; }
a { color:#55ae3b; text-decoration:none; }
audio { display:block; width:400px; height:54px; }

.noselect { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none;  -moz-user-select: none; -ms-user-select: none; user-select: none; user-drag:none; -webkit-user-drag: none; cursor:default; }

.loader { height:90px; width:90px; border-radius:45px!important; }
.btn { position:absolute; width:40px; height:40px; background-size:100%; background-repeat:no-repeat; opacity:0.4; cursor:pointer; }
.btn:hover { opacity:0.8; }

#header { z-index:2000; position:fixed; top:0px; left:0px; width:100%; height:480px; }
	#header_content { display:flex; flex-direction:column; justify-content:center; align-items:center; background-image:url("img/campguru_header.jpg"); background-size:100%; background-repeat:no-repeat; background-position:center -50px; box-shadow:0px 0px 12px rgba(0,0,0,0.75); border-bottom:1px solid #000; }
		#header_moondate { position:absolute; top:0px; left:0px; font-size:28px; opacity:0.6; text-shadow:0px 0px 8px rgba(255,255,255,0.6); cursor:help; padding:10px; }
			#moondate_moon {}
				#moondate_moon img { position: relative; top: 5px; width:28px; height:28px; }
			#moondate_world { position:absolute; top:40px; left:45px; width: max-content; opacity:0; font-size:18px; }
		
		#header_gui { position:absolute; top:4px; right:14px; }
			.gui_item { position:relative; margin:10px 0; opacity:0.5; cursor:pointer; }
			.gui_item:hover { opacity:0.8; }
				.gui_back { box-sizing:border-box; position:absolute; top:0px; left:0px; width:40px; height:40px; opacity:0; background-color:#fff; border:1px solid #0c0600; border-radius:20px; font-size:20px; }
				.gui_btn { box-sizing:border-box; position:relative; top:0px; left:0px; width:40px; height:40px; background-color:#fff; border:1px solid #0c0600; border-radius:20px; background-repeat:no-repeat; background-position:center center; font-size:22px; }
				#gui_search .gui_btn { background-image:url("/img/icon_search.svg"); }
				#gui_login .gui_btn { background-image:url("/img/icon_login.svg"); display:none; }
				#gui_lang .gui_btn { background-image:url("/img/icon_lang_de.svg"); }
				#gui_search .gui_back { width:250px; position:absolute; left:-210px; opacity:0.75; padding:8px 0 0 18px; }
				#gui_search .gui_back:hover { box-shadow:0px 0px 8px rgb(0, 0, 0, 0.5); }
					#search_label { margin-bottom: -30px; }
					#search_input { height:32px; width:168px; border:none; opacity:0; padding:1px 10px; }
					#search_input:hover { opacity:1; }
				#gui_login .gui_back { }
				#gui_lang .gui_back { background-image:url("/img/icon_lang_en.svg"); background-position:2px center; }
		
		#header_logobox { position:relative; width:480px; height:480px; flex-shrink:0; mix-blend-mode:hard-light; }
			#logo_sw { position:absolute; top:0px; left:0px; width:100%; height:100%; background-image:url("img/campguru_logo.png"); background-size:100%; background-position:center center; background-repeat:no-repeat; mix-blend-mode:hard-light; }
			#logo_c { position:absolute; top:0px; left:0px; width:100%; height:100%; background-image:url("img/campguru_logo_c.png"); background-size:100%; background-position:center center; background-repeat:no-repeat; mix-blend-mode:color!important; opacity:0.8; }
		#mantra { position:absolute; right:20px; top:0px; transform:translate(0px, 360px); text-align:right; font-size:20px; color:#fff; text-shadow:0 0 12px #000; mix-blend-mode:soft-light; opacity:0.777; pointer-events:none; white-space:nowrap; }
		
	#navi_sub { z-index:-1; }
	.navi_group { display:flex; justify-content:center; color:#fff; font-size:29px; position:relative; pointer-events:none; }
		.navi_item { box-sizing:border-box; flex-shrink:0; background-color:#25201a; width:160px; height:46px; border-radius:0 0 14px 14px; box-shadow:0px 0px 8px rgba(0,0,0,0.3); margin:0 8px; opacity:0.9; color:#fff; text-align:center; padding-top:2px; cursor:pointer; pointer-events:all; }
		.navi_item:hover { background-color:#514b46; text-shadow:0px 0px 3px rgba(0,0,0,1); opacity:0.9!important; }
		#navi_sub .navi_item { margin-top:-46px; box-shadow:0px 0px 12px rgba(255,255,255,0.6); padding-top:10px; opacity:0.5; }
		.navi_selected { opacity:0.9!important; }
			
#content { z-index:1; display:flex; flex-direction:column; justify-content:center; align-items:center; width:100%; margin-top:500px; }
	#content_titlebox { position:relative; top:2px; text-align:center; height:160px; width:100%; pointer-events:none; overflow:hidden; }
		.titlebox_item { margin-bottom:-130px; }
		.titlebox_hidden { opacity:0; transform:scale(0.8); filter:blur(10px); }
			.titlebox_title { font-size:88px; }
			.titlebox_subtitle { font-size:24px; margin-top:-8px; }
	
	#navi_prime { z-index:1; top:10px; }
		.navi_item_prime { border-radius:14px 14px 0 0!important; }
		.navi_prime_selected { position:relative; top:-10px; padding-top:7px; }
		
	#content_dynamic { z-index:2; width:100%; }
		.post { position:relative; display:flex; flex-direction:column; align-items:center; overflow:hidden; color:#fff; text-shadow:0 0 8px #000; box-shadow:0px 0px 12px rgba(0,0,0,0.75); filter:brightness(0.4); }
		.post_highlight { border:3px solid #d00; }
		.post_highlight_soon { border:3px solid #00e; }
		.post:last-child { border-radius:0 0 20px 20px; }
			.post_background { position:absolute; width:100%; height:100%; background-image:url(/img/flower_.jpg); }
			.post_background_blurred { background-size:cover; filter:blur(7px); transform:scale(1.1); }
				.post_background img { position:absolute; left:0px; z-index:-1; width:100%; min-height:100%; }
			.post_content { position:relative; width:100%; max-width:1400px; padding:100px 200px; box-sizing: border-box; text-size-adjust:200%; }
				.post_title { font-size:60px; line-height:58px; border-bottom:0px solid rgba(255, 255, 255, 0.4); }
				.post_sub { font-size:20px; font-weight:300; margin-top:3px; margin-bottom:3px; padding-left:3px; opacity:0.5; }
				.post_release { font-size:14px; margin-bottom:40px; padding-left:5px; opacity:0.4; }
				.post_intro { font-size:16px; font-weight:bold; margin-bottom:20px; }
				.post_media {  line-height:0px; }
					.post_media img { height:190px; margin:0 20px 20px 0; border-radius:7px; box-shadow:0 0 7px #000; cursor:pointer; }
					.post_media video { width:100%; margin:0 20px 20px 0; border-radius:7px; box-shadow:0 0 7px #000; }
				.post_text { position: relative; font-size:16px; margin-bottom:20px; overflow:hidden; }
				.post_footer { font-size:12px; }
				.post_more { font-size:24px; font-weight:500; text-align:center; }
					.post_more a { text-decoration:underline; text-decoration-style:dashed; color:#fff; }
					.post_more a:hover { text-decoration-style:solid; }
			.post_fullscreen { z-index:1; top:14px; right:14px; background-image:url("img/icon_fullscreen.svg"); opacity:0.7; mix-blend-mode:overlay; }
			.post_fullscreen:hover { opacity:0.9; }
			.post_map { transform:scale(2); top:34px; right:34px; background-image:url("img/icon_map.svg"); }
			.campcast_cover { width:400px; border-radius:20px; margin:-50px 0 20px 0; -webkit-tap-highlight-color: transparent; }
		
		.aspect_result { position:relative; padding:80px 200px 50px 200px; overflow:hidden; color:#fff; background-image:url("/img/flower.jpg"); box-shadow:0px 0px 12px rgba(0,0,0,0.75); }
		
		.page { box-sizing:border-box; width:100%; min-height:200px; padding:30px; background-image:url("img/flower_.jpg"); box-shadow:0px 0px 12px rgba(0,0,0,0.75); border-radius:0 0 20px 20px; }
		
	#content_ img { width:100%; box-shadow:0px 0px 12px rgba(0,0,0,0.75); filter:brightness(0.4); }
	
	#footer_spacer { width:100%; height:100px; }
	
#footer { position:fixed; bottom:0px; display:flex; justify-content:center; align-items:center; background-color:rgba(0,0,0,0.8); height:120px; width:100%; display:flex; justify-content:center; }
	#footer_ytube { background-image:url("img/icon_ytube.png"); background-size:100%; width:40px; height:40px; margin:20px 12px 5px 12px; cursor:pointer; }
	#footer_insta { background-image:url("img/icon_insta.png"); background-size:100%; width:40px; height:40px; margin:20px 12px 5px 12px; cursor:pointer; }

#lightbox { z-index:2001; position:fixed; top:0px; left:0px; width:100%; height:100%; background-color:rgba(0,0,0,0.5); opacity:0; display:none; padding: 20px; box-sizing: border-box;  }
	#lightbox_content { position:relative; box-sizing:border-box; overflow:auto; display:flex; align-items:center; justify-content:center; flex-direction:column; width:100%; height:100%; }
		#lightbox img { max-width: 100%; max-height:100%; border-radius:10px; }
	#lightbox_close { background-image:url("img/icon_close.svg"); }
	
.aspect { text-decoration:underline; text-decoration-style:dotted; text-decoration-color:rgba(255,255,255,0.9); color:#fff; }
.aspect:hover { text-decoration-style:solid; text-decoration-color:rgba(255,255,255,1); text-shadow:0px 0px 3px rgba(255,255,255,0.8); }


@media only screen and (max-width: 1200px) {
	.post_content { padding:100px 100px; }
	#moondate_moon span { font-size: 24px; }
}