/*!
Theme Name: sy
Theme URI: https://www.spoeleoben.at/
Author: new_dev
Author URI: https://www.spoeleoben.at/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
*/

/*@import url("https://fonts.googleapis.com/css?family=Raleway:300,500,600");*/
/* Extract from normalize.css by Nicolas Gallagher and Jonathan Neal git.io/normalize */
html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}
html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}
article,aside,details,figcaption,figure,footer,header,main,menu,nav,section{display:block}summary{display:list-item}
audio,canvas,progress,video{display:inline-block}progress{vertical-align:baseline}
audio:not([controls]){display:none;height:0}[hidden],template{display:none}
a{background-color:transparent}a:active,a:hover{outline-width:0}
abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}
b,strong{font-weight:bolder}dfn{font-style:italic}mark{background:#ff0;color:#000}
small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sub{bottom:-0.25em}sup{top:-0.5em}figure{margin:1em 40px}img{border-style:none}
code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}hr{box-sizing:content-box;height:0;overflow:visible}
button,input,select,textarea,optgroup{font:inherit;margin:0}optgroup{font-weight:bold}
button,input{overflow:visible}button,select{text-transform:none}
button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}
button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}
button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}
fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}
legend{color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}
[type=checkbox],[type=radio]{padding:0}
[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}
[type=search]{-webkit-appearance:textfield;outline-offset:-2px}
[type=search]::-webkit-search-decoration{-webkit-appearance:none}
::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}
/* End extract */

html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}
body, html {
    height: 100%;
    line-height: 1.3;
	margin:0em;
	padding:0;
	font-size: 17px;
	font-size: calc(13px + 0.390625vw);
	font-family: "Carlito", sans-serif;
	font-weight:400;
	font-style: normal;
	color:#333;
}
h1,h2,h3,h4,h5,h6 {
	font-family: "Carlito", sans-serif;
	font-weight:700;
	font-style: normal;
	line-height:1.1;
}
h1 {
  font-family: "Merriweather", serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
}
a {
	color:#e30b17;
    padding: 0px 0;
    background: transparent;
	text-decoration:none;
	bborder-bottom:1px solid transparent;
	transition-duration: 0.32s;
}
.a {color:#333;}
a:hover {
	bborder-bottom:1px solid #e30b17;
	background: #e30b17;
	color:#fff;}

.post-content a, .post-single a {
	color:#e30b17;
	border: 1px solid #e30b17;
	border-radius: 3px;
	display: inline-block;
	margin: 0px;
	padding: 0 5px;
	text-decoration:none;
	transition-duration: 0.32s;
	background: transparent;
}

.post-content a:hover, .post-single a:hover {
  outline: 3px dotted #e30b17;
  outline-offset: 4px;
  background: #e30b17;
  color:#fff;
}

top-line {display:block;bborder:3px solid blue;padding-bottom:4rem;}

grid-container {
    display:grid;
    grid-template-rows:auto 1fr auto;
    grid-template-columns:100%;

    /* fallback height */
    min-height:100vh;

    /* new small viewport height for modern browsers */
    min-height:100svh;
}
grid-container > header {
    padding:2rem;
    background:#f5d55f;
}
grid-container > article {
    padding:2rem;
    background:#fff;
}
grid-container > my-footer {
    padding:inherit;
    background:inherit;
}


#main-menu {position:fixed;top:0;width:100%;margin:0;padding:0em;border:0px solid red;overflow:hidden;background:#f3f4f4;z-index:10;}
#main-menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
#main-menu > ul > li {
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    bbackground: #e3a09b;
    float: left;
    padding: 0.31em 0.90em;
    position: relative;
    transition-duration: 0.32s;
    mmargin: 8px 0 5px 0;
    bborder-bottom: 5px solid transparent;
    border: 0px solid green;
    mmin-width: 6em;
}
#main-menu > ul > li:hover {bbackground:red;}
#main-menu > ul > li:first-child:hover,
#main-menu > ul > li a:first-child:hover {background:#fff;color:#e30b17;}
#main-menu > ul > li:nth-last-child(1) {float:right;}
#main-menu > ul > li:nth-last-child(2) {float:right;}
#main-menu > ul > li a {
    text-decoration: none;
	text-align:center;
	font-weight:bold;
}

.ffix {position:fixed!important;}
.frel {position:relative!important;}
#mmain-menu .logo {
	background: #fff;
	width:188px!important;height:65px!important;ffloat:left;mmargin-top:4px;
}
#main-menu > ul > li img {transition-duration: 0.32s;margin-top:8px;}
#main-menu.bigimg > ul > li img {height:60px;width:auto;max-height:48px;}
#main-menu.smallimg > ul > li img {height:60px;width:auto;max-height:40px;}
.logo:hover {
	bbackground: green;);
}
@media (max-width:640px) {
	#main-menu > ul > li {
		display:none;
	}
	#main-menu > ul > li:nth-child(1), #main-menu > ul > li:nth-last-child(2){
		display:flex;
	}
}

/* The main-menu (background) */
modal-menu {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 20; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
  -webkit-animation-name: fadeIn; /* Fade in the background */
  -webkit-animation-duration: 0.4s;
  animation-name: fadeIn;
  animation-duration: 0.4s
}
modal-menu.not-active {
	display: none; /* Hidden by default */
}
modal-menu.is-active {
	display:block;
}

/* main-menu Content */
modal-menu .content {
	position: absolute;
	top: 0%;
	left: 50%;
	transform: translate(-50%, 0%);
	background: #fff;
	padding:2em; 
	border:0px solid green;
	width: 100%;
	max-width:1200px;
	mmargin:0 auto;
	-webkit-animation-name: slideIn;
	-webkit-animation-duration: 0.4s;
	animation-name: slideIn;
	animation-duration: 0.4s
}
modal-menu .inner {position:relative;width:100%;padding:0rem;max-width:1400px;margin:0 auto;}
modal-menu .searchbar {margin:1.5rem 0; background:#fff;}
.searchbar input, .searchbar button {
    font-weight: 500;
    font-size: .75rem;
    letter-spacing: .051rem;
    wwidth: 15rem;
    padding: 0 .375rem;
    border:1px solid #999;
    background: transparent;
    ooutline: none;
    font-size: 1rem;
    border-radius: 1px;
    height: 2.8571rem;

  padding: 12px;
  margin: 10px 0;
  box-sizing: border-box;
}
.searchbar input {width:20rem;}
.searchbar button {
	background:#e30b17;color:#fff;border:1px solid #e30b17;
}
.searchbar input:focus {background:inherit;border:1px solid #999;}

/* Add Animation */
@-webkit-keyframes slideIn {
  from {top: -300px; opacity: 0} 
  to {top: 0; opacity: 1}
}

@keyframes slideIn {
  from {top: -300px; opacity: 0}
  to {top: 0; opacity: 1}
}

@-webkit-keyframes fadeIn {
  from {opacity: 0} 
  to {opacity: 1}
}

@keyframes fadeIn {
  from {opacity: 0} 
  to {opacity: 1}
}

/* The Close Button */
.close a {
	position:absolute;
	top:0.2rem;
	right:1rem;
	ccolor: green;
	font-size: 3rem;
	font-weight: bold;
	text-decoration: none;
}

.close a:hover,
.close a:focus {
  color: #000;
  cursor: pointer;
}
.is-menu h3 {text-transform: uppercase;margin:0 0 0.3rem 0;}
.is-menu h3 a{color:#e30b17;}
.is-menu h3 a:hover{background:#e30b17;color:#fff;}
.is-menu ul {margin:0 0 0.3rem 0;padding:0;list-style:none;list-style-image:none;}
.is-menu li {padding:0.54rem 0;}

my-dummy {display:block;background:red;height:50px;width:100%;}

.hide {display:none;}


.hero-image {
  box-sizing:border-box;
  background-image: linear-gradient(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.5)), url("../img/header.webp");
  height: 50%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

.hero-text {
  text-align: center;
  position: absolute;
  top: 70%;
  left: 50%;
  transform: translate(-50%, -30%);
  color: white;
  width:100%;
}
.hero-text h1{font-size:2.5rem;margin:0;}
.hero-text h3{ffont-size:2.5rem;margin:0.5em 0;}
.hero-text button {
  border: none;
  outline: 0;
  display: inline-block;
  padding: 10px 25px;
  color: black;
  background-color: #ddd;
  text-align: center;
  cursor: pointer;
}

.hero-text button:hover {
  background-color: #555;
  color: white;
}
.header-image {mmargin-top:4rem;}
.header-image img {
	width:100%;
	height:auto;
}
main-wrapper {
	position:relative;
	overflow:hidden;
	width:100%;
	max-width:1200px;
	margin: 0rem auto 3rem auto;
	padding:1rem 1rem 1rem 1rem;
	bborder:2px solid red;
	display:block;
}
main-wrapper {
    word-wrap: normal;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;
    -webkit-hyphens: auto;
    -webkit-hyphenate-limit-before: 3;
    -webkit-hyphenate-limit-after: 3;
    -webkit-hyphenate-limit-chars: 6 3 3;
    -webkit-hyphenate-limit-lines: 2;
    -webkit-hyphenate-limit-last: always;
    -webkit-hyphenate-limit-zone: 8%;
    -moz-hyphens: auto;
    -moz-hyphenate-limit-chars: 6 3 3;
    -moz-hyphenate-limit-lines: 2;
    -moz-hyphenate-limit-last: always;
    -moz-hyphenate-limit-zone: 8%;
    -ms-hyphens: auto;
    -ms-hyphenate-limit-chars: 6 3 3;
    -ms-hyphenate-limit-lines: 2;
    -ms-hyphenate-limit-last: always;
    -ms-hyphenate-limit-zone: 8%;
    hyphens: auto;
    hyphenate-limit-chars: 6 3 3;
    hyphenate-limit-lines: 2;
    hyphenate-limit-last: always;
    hyphenate-limit-zone: 8%;
}

.padding-3 {padding:3rem;}
.padding-top3 {padding-top:3rem;}
.padding-1 {padding:1rem;}
.padding {padding: 0rem 1rem 1rem;}
.mtop {margin-top:2rem;}
.footer-bg {background:#ececec;}
.site-info {margin:2rem 1rem;text-align:center;}
.info {position:fixed;top:4rem;left:3rem;background:#fff;border:1px solid red;padding:1rem;}
img.alignleft {float:left;margin:0 1rem 1.5rem 0;height:auto;}
img {max-width:100%;height:auto;display:block;}
.img img {width:100%;height:auto;}
h3.post-title {margin-top:0;}
.post-single .post-excerpt {
	ffont-family: "Merriweather", serif;
	font-optical-sizing: auto;
	font-weight: 400;
    ffont-style: italic;
    font-size: 1.2rem;
    margin: 1rem 0 1.5rem 0;
	lletter-spacing:0.051rem;
}
.highlight {
    ccolor: #fff;
    border-radius: 11px;
    font-style: normal;
    display: inline-block;
    background: yellow;
    padding: .1em .25em 0;
}
ul.meta-box_date, ul.meta-box_info {
    padding: .6em 1em 0.6em 0em;
    list-style: none;
    width: max-content;
    max-width: 100%;
    border-radius: 11px;
    font-size: .9em;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    gap: .5em 2em;
}
ul.meta-box_info {
	padding: .6em 1em;
	background: #f6f6f6;
}
li.meta-box--item {
    line-height: 1.4;
    ppadding-left: 1.5em;
    background-size: auto 1em;
    background-repeat: no-repeat;
    background-position: 0 2px;
    margin-bottom: 0;
}
li.meta-box--item i{color:red;}
.wp-caption {display:table;margin-bottom:1.5rem;}
.wp-caption-text {
    margin: 0.4rem 0 1rem 0;
    font-size: 0.9rem;
    color: #333;
	text-align:center;
}
.page-numbers {padding:0.5rem;background:#ddd;}
a.page-numbers {background:#e30b17;color:#fff;}
a.page-numbers:hover {background:#eee;}
blockquote {
    position: relative;
    ffont-family: 'Noto Serif', serif;
    font-family: 'Merriweather', serif;
    font-style: italic;
    font-size: 1.1em;
    background: #fff;
    border: 1px solid #e3001b;
    border-width: 0 0 0 18px;
    padding: 1.8em;
    margin: 2.5em 2em 2.5em 2em;
    mmargin: 0;
    text-align: left;
    line-height: 1.44;
    width: 90%;
    -webkit-box-shadow: -1px 1px 12px 6px rgba(0, 0, 0, 0.31);
    box-shadow: -1px 1px 12px 6px rgba(0, 0, 0, 0.31);
    overflow: hidden;
}

media-row_60-40 {
	display:grid;
	gap: 1.5rem;
	grid-template-columns: calc(60% - 1.5rem) 40%;
	bbackground-color: #e30b17;
}
archiv-row_60-40 {
	display:grid;
	gap: 1.5rem;
	grid-template-columns: calc(60% - 1.5rem) 40%;
	bbackground-color: #e30b17;
}


media-row1 {
	display:grid;
	grid-template-columns: 100%;
	background-color: #fff;
	width:100%;
	align-items:center;
}
media-row1 section {
	text-align: left;
}
media-row2 {
	position:relative;
	overflow:hidden;
	width:100%;
	display: grid;
	gap: 1.0rem;
	grid-template-columns: 1fr 1fr;

}
media-row2 section {
	text-align: center;
	padding: 0;
	font-size: 1rem;
	border:0px solid red;
	bbackground-color: #fed;
}


media-row2a {
	position:relative;
	overflow:hidden;
	width:100%;
	display: grid;
	gap: 1.0rem;
	grid-template-columns: 1fr 1fr;

}
media-row2a section {
  text-align: center;
  ppadding: 0 0 2em 0;
  font-size: 1rem;
  border:0px solid red;
}



section {display:block;}

media-row4 {
	position:relative;
	overflow:hidden;
	width:100%;
	display: grid;
	gap: 1.0rem;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	bbackground-color: #2196F3;
	ppadding: 0 1em 1em;
	mmax-width:1400px;
	mmargin:2em auto;
	hheight:300px;
}
media-row4 section {
  text-align: center;
  padding: 0;
  font-size: 1rem;
  border:0px solid red;
}

media-row6 {
	position:relative;
	overflow:hidden;
	width:100%;
	display: grid;
	gap: 1.0em;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
}
media-row6 section {
  text-align: center;
  padding: 0;
  font-size: 1rem;
  border:0px solid red;
}

.media-item {background:#f8f8f8;  padding: 0 0 2em 0;position:relative;}
.media-item__image img {
	display:block;
	width: 100%;
    height: auto;
}
.media-item__summary {
  
  padding: 0.6rem;
  ddisplay:block;
}
.media-item__summary .category, .media-item .vcard {
	text-transform: uppercase;
    font-weight: 700;
    font-size: .75rem;
    letter-spacing: .1rem;
    color: #d71920;
}
.media-item .meta {
    position:absolute;
	bottom:1em;
	text-align:center;
	width:100%;
	bborder:1px solid red;
	margin-top:1em;
}
.media-item .vcard {
    color: #999;
}

.media-item__summary .desc {
    font-family: Georgia, Times, serif;
    font-size: .875rem;
    line-height: 1.4;
}

.media-item__summary .meta {
    color: #6e7381;
}

media-row_30-70 {
	display:grid;
	gap: 1.0rem;
	grid-template-columns: 30% 68%;
	bbackground-color: #e30b17;
	width:100%;
}
.archive media-row_30-70 {
	margin:0 0 0em 0;
	border-bottom:1px solid #999;
	padding:1rem 0;
}
.archive media-row_30-70:hover {
	background:#fff8f0;
}
.archive media-row_30-70:first-child {
	padding-top:0;
}
.archive media-row_30-70:last-child {
	border-bottom:0px solid #999;
}
media-row3 {
	position:relative;
	overflow:hidden;
	width:100%;
	display: grid;
	gap: 1.0rem;
	grid-template-columns: 1fr 1fr 1fr;
}
media-row3 section {
	text-align:center;
}
section-img-left {
	display:grid;
	grid-template-columns: 40% 60%;
	background-color: #e30b17;
	width:100%;
	malign-items:center;
	mmargin-top:3em;
}
section-fullimg-left {
	display:grid;
	grid-template-columns: 40% 60%;
	background-color: #e30b17;
	width:100%;
	align-items:center;
	margin-top:3em;
}
section-fullimg-right {
	display:grid;
	grid-template-columns: 60% 40%;
	background-color: #e30b17;
	width:100%;
	align-items:center;
	grid-template-areas: " a b ";
	margin-top:3em;
}
#a { grid-area: a; }
#b { grid-area: b; }

section-fulltext {
	display:grid;
	grid-template-columns: 100%;
	background-color: #fff;
	width:100%;
	align-items:center;
}
section-fulltext h1, section-fulltext h3 { color:#e30b17;}
section-fulltext .inner {width:100%;padding:2em;text-align:center;max-width:1400px;margin:0 auto;}

.scroll-div {
 overflow-y: auto; height:600px;
  background-color: #ecd;
  padding:1em;
}

my-footer {display:block;}



/* ***************************************** */
/* Horizontal Scroll */
.horiz-scroll {
  bbackground-color: #adc;
  overflow: scroll;
  white-space: nowrap;
  width:100%;
  margin-top:2rem;
  padding:0;
  ppadding-right:2em;
  border:1px solid blue;
}

.horiz-scroll section {
  display: inline-block;
  color: white;
  text-align: center;
  align-items:top;
  ppadding: 1em;
  text-decoration: none;
  width:22%;
  margin:0 0 0 0rem;
  hheight:220px;
  background:red;
}

div.horizscroll item:hover {
  background-color: #777;
}
.horiz-scroll .inner {position:relative;width:100%;overflow:hidden;white-space:wrap;hheight:280px;}



/* Track */
::-webkit-scrollbar-track:horizontal {
  bbackground: #ddd; 
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  bbackground: blue; 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  bbackground: #999; 
}

::-webkit-scrollbar {
  bheight: 30px;
}

 
/* Handle */
::-webkit-scrollbar-thumb:horizontal {
    bbackground: #e30b17; 
    bbackground: #c9000d;
}
::-webkit-scrollbar-thumb:horizontal:hover {
    bbackground: rgba(0,255,0,0.8); 
}






.item1 {
	padding:3em;
	background-color: #e30b17;
	mmargin-left:3em;
	color:#fff;
}
.item1 a.btn {color:#fff;background:#9B0F06;padding:0.12em 0.5em;border-radius:0.5em;text-decoration:none;}
.item1 a.btn:hover {color:#fff;background:#5E0006;}
.item2 {
	padding:0em;
	bbackground-color: #e30b17;
}

.w3-top,.w3-bottom{background:#aaa;position:fixed;width:100%;z-index:1}.w3-top{top:0}.w3-bottom{bottom:0}
.w3-bar a {
    padding: 8px 16px;
    float: left;
    width: auto;
    border: none;
    display: block;
    outline: 0;
	border:none;display:inline-block;padding:8px 16px;vertical-align:middle;overflow:hidden;text-decoration:none;color:inherit;background-color:inherit;text-align:center;cursor:pointer;white-space:nowrap;
}
.w3-bar a:hover {background:red;}
.w3-right {
    float: right !important;
}
.open-sidebar {}



.item2 img {
	display:block;
	width: 100%;
    height: auto;
}
.open {float:right!important;z-index:100;}
.hide-small {display:block;}
.hide-large {display:none!important;}

@media (max-width:1024px) {

	media-row3 {
		grid-template-columns: 1fr 1fr;
	}
	media-row6 {
		grid-template-columns: 1fr 1fr 1fr;
	}
	section-fullimg-left, section-fullimg-right  {
		grid-template-columns: 1fr;
	}
	section-fullimg-right {grid-template-areas: "b" "a";}
}



@media (max-width:800px) {
	body, html {
		font-size: calc(16px + 0.390625vw);
	}
	media-row4, media-row6 {
		grid-template-columns: 1fr 1fr;
	}
	media-row_30-70 {
		grid-template-columns: 36% 62%;
	}
	archiv-row_60-40 {
		grid-template-columns: 1fr;
	}
	archiv-row_60-40 .sidebar {display:none;}
}

@media (max-width:768px) {
	media-row2a {
		grid-template-columns: 1fr;
	}
	
}
@media (max-width:640px) {
	media-row3, media-row4, media-row_60-40 {
		grid-template-columns: 1fr;
		width:100%;
	}
}

@media (max-width:600px) {
	.searchbar input {width:85%;}
	media-row2, media-row2a, media-row3,
	media-row6, media-row_30-70 {
		grid-template-columns: 1fr;
	}
	.test {background:green;}
}