/**
Theme Name: Mik Geisterheld
Theme URI: https://www.sharkthemes.com/downloads/mik-geisterheld/
Author: Shark Themes
Author URI: https://sharkthemes.com/
Version: 1.0.1
Requires PHP: 5.6
Tested up to: 5.5.3
Requires at least: 5.0
Template: mik
Text Domain: mik-geisterheld
Description: Mik Geisterheld is a dark designed and very light weight and easy to use personal theme for personal data, portfolio, stories and blogs. It is a child theme of Mik. Theme Demo: https://demo.sharkthemes.com/mik-geisterheld/
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Tags: translation-ready, custom-header, custom-background, theme-options, custom-menu, threaded-comments, featured-images, footer-widgets, right-sidebar, full-width-template, two-columns, three-columns, grid-layout, custom-logo, blog, portfolio, photography

Mik Geisterheld WordPress Theme, Copyright 2020 Shark Themes
Mik Geisterheld is distributed under the terms of the GNU GPL

Mik Geisterheld WordPress Theme is child theme of Mik WordPress Theme, Copyright 2020 Shark Themes
Mik WordPress Theme is distributed under the terms of the GNU GPL

0b0ba3



*/
html {

	
	background-color: transparent;
}
body {
	 background-image: url("images/bg-03.png"); /* The image used */
 color: #c0bbbb;
  background-attachment: fixed;
  background-position: top right;
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: 50%;
	
	background-color: #1d1d1d;
}

/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/
a {
	color: #fff;
	text-decoration: none;
}

a:hover,
a:focus,
a:active {
	color: #0000FE;
}

a:focus {
	outline: thin dotted;
}

a:hover,
a:active {
	outline: 0;
}



pre
{
	
background-color: #1d1d1d;
}
.sfind
{
border-bottom: 2px dotted;
}


.menu-toggle
{
	z-index: 100;
position: absolute;
top: 0;
right: 0; 

}

.backtotop {
    background-color: transparent;
    z-index: 300;
    width: 40px;
    height: 40px;
    line-height: 36px;
    font-size: 18px;
    text-align: center;
    position: fixed;
    bottom: -100px;
    right: 25px;
    cursor: pointer;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    color: #fff;
}
.backtotop:hover {
	background-color: #0000FE;
}
.backtotop svg {
    display: inline-block;
    vertical-align: middle;
    fill: #fff;
}


#masthead
{
position: fixed; 
top:0;
left: 0;
z-index: 900;	
background-color:rgba(29, 29, 29, 0.6);
 -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;

}

#group1{
background-color:rgba(29, 29, 29, 0.6);

}

a.thumblink
{
color: #c0bbbb;
}

a.thumblink:hover
{
color: #fff;
}

.seplay
{
padding: 0 7px 0 28px;
  background: url('images/play-button-3.png');
  background-size: 20px 14px ;
  background-position: 0 5px;
  background-repeat: no-repeat;

}

.sthumbnail
{

}

.ftext
{
float: left !important;
Display: inline-block;
}

div.yplay
{
	opacity: 0.5;
 position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  width: 20%;
  height: 27%;
  background: url('images/play-button-1.png');
  background-size: cover;
  content: '';	
}


div.y_title
{
color: #c0bbbb;
font-size: 11px;
line-height: 14px;
border: 1px solid #4a4a4e;
padding: 1px 2px 2px 4px;
 position: absolute;
 width: 100%;
  top: 0; left: 0;
 background-color:rgba(29, 29, 29, 0.6);
 
}


div.rthumbnail{ /* style for thumbsnail DIVs that appear initially on the page */
position: relative;
width: 30%;
	display: inline-block;
	margin: 0 3% 3% 0;
	padding: 0;
}
form, form.wpcf7-form{
 min-width: 60%;
}




img.thumbimg
{
border: 1px solid #4a4a4e;
max-width: 100%;
}

div.backtotop {
background-color:rgba(29, 29, 29, 0.6);
	}

.site-branding img.custom-logo {
	

padding-top: 12px;
max-width: 600px;

	}

#content
{
margin-top:  4.8%;


}

#primary
{
	min-width: 70%;
max-width: 1000px;
display: flex;

}

body.page-id-36  #primary
{
min-width: 45%;
max-width: 100%;
display: inline-block;

}



#colophon
{color: #c0bbbb;
	padding: 0;
width: 100%;
position: fixed;
bottom: 0;
left:0;	
background-color:transparent;
}
.site-info
{
	padding: 10px 5px 10px 5px;
background-color:rgba(29, 29, 29, 0.7);

}



#main
{
	

}
#primary .content-area
{
color: #c0bbbb;	

}
.entry-content
{
	
padding: 0 10px 30px 0;
background-color:rgba(29, 29, 29, 0.8);	

}

.site-info, .site-info p, .site-info a
{color: #c0bbbb;


}

.entry-content p
{color: #c0bbbb;
padding-right: 30px;	


}
h2, h3, h4
{color: #c0bbbb;
	


}
.widget
{background-color: #1d1d1d;
width: 200px;
margin: 104px 0 0 90px;
opacity: 0.6;
}
h1.page-title
{
max-width: 50%;
color: #4a4a4e;

}
.widget-title
{color: 0000fe;
}


.container-lazyload
{
width: 25%;
min-width: 150px;
padding: 0 15px 25px 0;
float: left;
}
#main, .site-main{
	
max-width: 100%;	
}

li.listing-item{

clear: left;
font-size: 19px;
}
li.listing-item a{
text-decoration: none;


}


div.entry-header{
	display: none;
}

time, img .avatar, .url, .read-time
{
height: 0;	
display: none;
}

div.listing-item  .title{
	

}

#featured-posts article .entry-container {
	text-align: left;
}

li.current-menu-item  a{
	color: #0000FE;
	background: background-color:rgba(29, 29, 29, 0.8);
}

.main-navigation ul.menu li.current-menu-item > a {
    color: #0000FE;
	background: background-color:rgba(29, 29, 29, 0.8);
}

.main-navigation a:hover, 
.main-navigation a:focus,
span.posted-on a:hover, 
span.posted-on a:focus, 
span.byline .author a:hover,
span.byline .author a:focus,
.cat-links a:hover,
.cat-links a:focus,
#reply-title, 
.comments-title,
.single-post .cat-links a:hover,
.single-post .cat-links a:focus,
.single-post .entry-meta span a:hover,
.single-post .entry-meta span a:focus,
.single-post span.byline .author a:hover,
.single-post span.byline .author a:focus {
	color: #0000fe;
}
.main-navigation ul.sub-menu li a {
	border: none;
}
blockquote.wp-block-quote p,
.post-navigation a, 
.posts-navigation a,
.custom-header-content a.btn,
.blog-loader-btn .read-more a,
#introduction .post-wrapper .entry-container a.btn {
	color:  #1d1d1d;
}

#search svg.icon-search {
	fill: #1d1d1d;
}

.blog-loader svg,
.social-menu ul li a svg,
#featured-posts article .entry-container .entry-meta .posted-on a svg,
.single-template-wrapper article .posted-on svg, 
.blog-posts-wrapper article .post-wrapper .entry-header svg,
.main-navigation svg.icon-search,
.navigation.pagination svg,
.main-navigation svg {
	fill: #fff;
}

a,


.cat-links,
.cat-links a,
span.byline,
span.byline .author a,
span.posted-on a, 
article .entry-title a,
.reply a,
#colophon,
.widget li,

.single-post .cat-links, 
.single-post .cat-links a,
.site-description,
.main-navigation a,
#secondary .widget-title, 
#secondary .widgettitle,
#secondary .widget ul li a,
.widget_recent_entries span.post-date,
#respond label,
.comment-content p,
.comment-meta .url, 
.comment-meta .fn,
span.read-time,
.entry-content,
.blog-loader-btn .read-more a:hover,
.blog-loader-btn .read-more a:focus,
#introduction .post-wrapper .entry-container a.btn:hover,
#introduction .post-wrapper .entry-container a.btn:focus,
#filter-posts ul li:not(:first-child):before,
.single-post .entry-meta span, 
.single-post .entry-meta span a,
.single-post span.byline .author a,
.section-header .section-title, 
.add-separator .section-title,
.blog-posts-wrapper article .post-wrapper .entry-container .entry-content p {
	color: #fff;
}

.blog-loader-btn .read-more a,
#introduction .post-wrapper .entry-container a.btn {
	background-color: #fff;
	border-color: #fff;
}



.main-navigation a {
	font-weight: 500;
}

.custom-header-content-wrapper .overlay {
	opacity: 0.4;
}

.site-info a:hover, 
.site-info a:focus,
.single-post .entry-meta span.tags-links a,
#respond input[type="submit"] {
	border-color: #fff;
}

.backtotop,
.reply a,
.pagination .page-numbers.current,
.widget_search form.search-form button.search-submit,
.widget_search form.search-form button.search-submit:hover {
	background-color: #0000FE;
}

.pagination .page-numbers.current {
	border-color: #0000FE;
}

.blog-posts-wrapper article.no-post-thumbnail .post-wrapper .entry-container {
	border-color: rgba( 255,255,255,0.1 );
}

 @media screen and (min-width: 1024px) {
 	#masthead.site-header.sticky-header.nav-shrink {
 		background-color: #1d1d1d;
 	}
 	.main-navigation ul.sub-menu {
 		background-color: #0000fe;
 	}
 	#search.search-open {
 		border-color: #ccc;
 	}
 	#masthead.left-absolute.sticky-header.nav-shrink .main-navigation ul.nav-menu > li > a,
	#masthead.left-absolute.sticky-header.nav-shrink .site-description,
	#masthead.left-absolute.sticky-header.nav-shrink .site-title a {
		color: #fff;
	}
	#masthead.left-absolute.sticky-header.nav-shrink.left-absolute .main-navigation ul.nav-menu > li > a > svg {
		fill: #fff;
	}
 }
 @media screen and (max-width: 1023px) {
	 
.no-sidebar .wrapper.page-section {
	width: 100%;
    margin-left: 4%;
    margin-right: 0;
} 

div.entry-content
{

padding: 0 10px 0 0;
margin: 0;

}
h1.page-title
{font-size: 30px;
}
	
.site-branding img.custom-logo {
position: absolute;
z-index: 79;
		top: 0;
		left: 30px;
		

 width: 40%;
	}
	
.site-branding,
	.site-branding.pull-left {
		
	}
	.site-details {
	    text-align: center;
	}	
 	.main-navigation {
		position: absolute;
		z-index: 87;
		top: 0;
		left: 0;
		width: 100%;
 		background-color: transparent;
 	}
 	.main-navigation a:hover, 
 	.main-navigation a:focus, 
 	.main-navigation ul.menu li.current-menu-item > a {
 		color: color: #0000FE;
 	}

 	.main-navigation a {
 		color: #a4a4a4;
 	}
	
	.main-navigation li {
 		color: #a4a4a4;
		background-color: #1d1d1d;
 	}
	
	
	
	
	
}








/* ############ icomoon icon fonts CSS ############ */

@font-face {
	font-family: 'icomoon';
	src:url('icomoon/icomoon.eot?-qkv88o');
	src:url('icomoon/icomoon.eot?#iefix-qkv88o') format('embedded-opentype'),
		url('icomoon/icomoon.ttf?-qkv88o') format('truetype'),
		url('icomoon/icomoon.woff?-qkv88o') format('woff'),
		url('icomoon/icomoon.svg?-qkv88o#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
	font-family: 'icomoon';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.icon-spinner:before {
	content: "\e600";
}
.icon-cancel-circle:before {
	content: "\e604";
}
.icon-cross:before {
	content: "\e601";
}
.icon-arrow-left:before {
	content: "\e602";
}
.icon-arrow-right:before {
	content: "\e603";
}

/* ############ Start of responsive gallery CSS ############ */




div.rthumbnail div.rcaption{
	display: none;
}

div.responsivegallery{ /* style for responsive gallery UI */
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	position: fixed;
	display: none;
	z-index: 1000;
}

div.responsivegallery:before{ /* gallery overlay */
	content: '';
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	cursor: zoom-out;
	top: 0;
	left: 0;
	background: black;
	opacity: 0.8;
	z-index: -1;
}

div.responsivegallery div.galleryinner{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	margin: auto;
	text-align: center;
  vertical-align: middle;
	white-space: nowrap;
}

div.responsivegallery div.galleryinner:before{ /* technique to vertical align elements */
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

div.responsivegallery div.figurearea{
	position: relative;
	max-width: 100%;
	vertical-align: middle;
	display: inline-block;
	z-index: 1000;
}

div.responsivegallery div.figurearea.isvideo{
	width: 90%;
}

/* video container CSS */

.jkvideocontainer *{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
}


.jkvideowrapper{
	position: relative;
	padding-bottom: 56.25%; /* 16:9 ratio. See https://css-tricks.com/NetMag/FluidWidthVideo/Article-FluidWidthVideo.php */
	height: 0;
}


.jkvideowrapper iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 10;
}

/* figure CSS */

div.responsivegallery figure{
	margin: 0;
	padding: 0;
	display: block;
	box-shadow: 0 0 15px rgba(0,0,0,.6);
	opacity: 0;
	-webkit-transition: opacity 0.5s;
	-moz-transition: opacity 0.5s;
	transition: opacity 0.5s;
}

div.responsivegallery figure img{
	max-width: 100%;
	width: 100%;
	height: auto;
	border: 0;
	line-height: 0;
	display: block;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  user-select: none; 
}

/* Caption CSS */

div.responsivegallery div.figurearea .thecaption{
	text-align: left;
	position: absolute;
	bottom: 0;
	font-size: 1.1em;
	padding: 5px;
	width: 100%;
	white-space: normal;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

div.responsivegallery div.figurearea.isvideo .thecaption{
	position: relative;	
}

div.responsivegallery div.figurearea .thecaption:before{ /* caption overlay */
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	display: block;
	background: white;
	top: 0;
	left: 0;
	opacity: 0.8;
}

div.responsivegallery div.figurearea .thecaption div.captioninner{
	position: relative;
	padding: 3px;
	color: black;
	overflow: hidden;
}

div.responsivegallery div.figurearea .thecaption div.captioninner span.counter{
	float: right;
	font-size: 0.9em;
	font-weight: bold;
	display: block;
	height: 100%;
	line-height: 100%;
	background: #2D2D2D;
	color: white;
	border-radius: 50%;
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	box-shadow: 0 0 3px gray;
}

div.responsivegallery div.close{
	position: absolute;
	right: 10px;
	top: 10px;
	padding: 5px;
	width: 55px;
	height: 55px;
	border-radius: 55px;
	background: black;
	color: white;
	font-size: 35px;
	z-index: 1000;
	box-shadow: 0 0 5px rgba(0,0,0,.6);
	cursor: pointer;
	-webkit-transition: background 0.3s;
	-moz-transition: background 0.3s;
	transition: background 0.3s;
}

div.responsivegallery div.close:hover{
	background: darkred;
}

div.responsivegallery div.close span{
	line-height: 55px;
}

div.responsivegallery div.leftnav,
div.responsivegallery div.rightnav{
	position: absolute;
	left: 5px;
	top: 50%;
	width: 50px;
	height: 50px;
	color: black;
	background: white;
	border-radius: 50px;
	text-align: center;
	line-height: 55px;
	margin-top: -25px;
	cursor: pointer;
	z-index: 1000;
	font-size: 50px;
}

div.responsivegallery div.rightnav{
	right: 5px;
	left:auto;
}


div.responsivegallery div.loadingdiv,
div.responsivegallery div.errordiv{
	width: 100px;
	height: 100px;
	border-radius: 10px;
	position: absolute;
	display: none;
	top: 50%;
	left: 50%;
	margin-top: -50px;
	margin-left: -50px;
	opacity: 0.6;
	text-align: center;
	z-index: 1000;
	background: black;
}

div.responsivegallery div.loadingdiv span,
div.responsivegallery div.errordiv span{
	vertical-align: middle;
	color: red;
	font-size: 3em;
	line-height: 90px;
}

div.responsivegallery div.loadingdiv span{ /* rotating loading DIV */
	-webkit-animation: rotate 2s linear infinite;
	animation: rotate 2s linear infinite;
	font-size: 3.5em;
	color: white;
	display: inline-block;
}

@-webkit-keyframes rotate{
	0%{
		-webkit-transform: rotate(0deg);
	}
	100%{
		-webkit-transform: rotate(360deg);
	}
}

@keyframes rotate{
	0%{
			transform: rotate(0deg);
	}
	100%{
		transform: rotate(360deg);
	}
}


div.responsivegallery div.leftnav:hover,
div.responsivegallery div.rightnav:hover{
	background: white;
	color: black;
}


@media screen and (max-width: 480px){ /* CSS when screen width is 480px or less */


.site-branding
{padding-left: 0;
}

h1.page-title
{display: none;

}

div.rthumbnail{ /* style for thumbsnail DIVs that appear initially on the page */

width: 46%;

}
	div.responsivegallery div.leftnav,
	div.responsivegallery div.rightnav{
		width: 40px;
		height: 40px;
		color: black;
		border-radius: 40px;
		text-align: center;
		line-height: 45px;
		margin-top: -20px;
		font-size: 40px;
	}
}


p.p-short{
	
	max-width: 500px;
	
}




.post-edit-link, .edit-link {
	
	color: #fff;
}


.nf-form-content, .field-wrap{
padding: 0;
margin: 0;
width: 100%;	
}

.nf-field-container{
padding: 0;
margin: 0;
width: 100%;	
}


.nf-field-label{
 color: #c0bbbb;
}