:root {
    --m_red: #FF3D47;
    --m_white: #FEFEFE;
    --m_black: #26201D;
    --m_black_text: #3C3C3C;
    --m_yellow:  #FFCE00;
    --m_yellow_text: #d6ad00;
    --headline_font: "Euclid Square";
    --paper_texture_black: url('../images/Black_paper_HR.jpg');
    --hypothesis-highlight-focused-color: #FFCE00 !important;
}

/* Fontok */

@font-face {
  font-family: "Euclid Square"; 
  font-style: normal; 
  font-weight: 700;
  font-display: block;
  src: local('EuclidSquare-Bold'), url("../fonts/EuclidSquare-Bold-WebXL.woff2") format("woff2");
}

@font-face {
  font-family: "Euclid Square"; 
  font-style: "normal"; 
  font-weight: 500;
  font-display: block;
  src: local('EuclidSquare-Medium'), url("../fonts/EuclidSquare-Medium-WebXL.woff2") format("woff2");
}

@font-face {
  font-family: 'Crimson Pro';
  font-style: normal;
  font-weight: 200 900;
  font-display: block;
  src: local('CrimsonPro'), url('../fonts/CrimsonPro-VariableFont_wght.woff2') format('woff2');
}

@font-face {
  font-family: 'Crimson Pro';
  font-style: italic;
  font-weight: 200 900;
  font-display: block;
  src: local('CrimsonPro-Italic'), url('../fonts/CrimsonPro-Italic-VariableFont_wght.woff2') format('woff2');
}

@font-face {
  font-family: 'Rubik';
  font-style: italic;
  font-weight: 300 900;
  font-display: block;
  src: local('Rubik'), url('../fonts/Rubik-Italic-VariableFont_wght.woff2') format('woff2');
}

@font-face {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 300 900;
  font-display: block;
  src: local('Rubik'), url('../fonts/Rubik-VariableFont_wght.woff2') format('woff2');
}

@font-face {
  font-family: 'Space Mono';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: local('SpaceMono-Regular'), url('../fonts/SpaceMono-Regular.woff2') format('woff2');
}
@font-face {
  font-family: 'Space Mono';
  font-style: normal;
  font-weight: 700;
  font-display: block;
  src: local('SpaceMono-Bold'), url('../fonts/SpaceMono-Bold.woff2') format('woff2');
}
/*
@font-face {
  font-family: 'Space Mono';
  font-style: italic;
  font-weight: 400;
  font-display: block;
  src: local('SpaceMono-Italic'), url('../fonts/SpaceMono-Italic.woff2') format('woff2');
}
@font-face {
  font-family: 'Space Mono';
  font-style: italic;
  font-weight: 700;
  font-display: block;
  src: local('SpaceMono-BoldItalic'), url('../fonts/SpaceMono-BoldItalic.woff2') format('woff2');
}
*/

.pure-g p, h1, h2, h3, h4, h5, h6, h7, div, span, em, b {
  text-rendering: optimizeLegibility !important;
  scroll-margin-top: 20px;
}

p, .e-content li, .p-summary {
  text-align: justify;
  hyphens: auto;
  hyphens: auto;
  -webkit-hyphens: auto;
  -webkit-hyphenate-limit-before: 3;
  -webkit-hyphenate-limit-after: 3;
  hyphenate-limit-chars: 6 3 3;
}

.no-hyphen, code, p > a {
  hyphens: none;
}

blockquote {
  border-left: 4px solid var(--m_red) !important;
  position: relative;
  display: block;
}

blockquote p { 
  font-size: 1em;
}

code {
  font-family: "Space Mono", monospace;
  padding: 0px 3px;
  background: rgb(249, 242, 244);
  color: var(--m_red);
  position: relative;
  top: -1.5px;
}

pre {
   border-radius: 0;
   border:0;
}

pre code {
  color: var(--m_black_text);
  padding: 0;
}

.notices {
  font-family: "Space Mono", monospace;
  font-weight: 500;
  font-size: 0.7em;
  padding-right: 30px;
}
.notices p {
  margin-block-end: 0;
  padding: 20px 0;
}

.notices.yellow {
  border-left: 10px solid var(--m_yellow);
  color: var(--m_yellow_text);
}

mark {
  background: var(--m_yellow);
  color: var(--m_black_text);
}

table {
  font-family: "Space Mono", monospace;
  font-weight: 500;
  font-size: 0.7em;
  border:0;
}

td {
  vertical-align: top;
}

@media screen and (max-width: 600px) {
  table thead {
    display: none;
  }
  table tr {
    display: block;
    border-bottom: 2px solid var(--m_black);
    margin-bottom: 1.5rem;
    padding-bottom: 1.5rem;
  }
  table td {
    display: block;
    padding: 4px 0;
    border: 0;
    font-size: 1.1em;
  }
  table td:before {
    content: attr(data-label);
    font-family: "Space Mono", monospace;
    font-weight: bold;
    font-size: 0.7em;
    letter-spacing: 10%;
    text-transform: uppercase;
    color: var(--m_red);
    display: block;
  }
}



/* Fejléc */
#header {
   
    background-color: #f93949;
    background-color: var(--m_red);
    background-color: linear-gradient(90deg,rgba(254, 254, 254, 1) 48%, rgba(255, 61, 71, 1) 50%);
    background-image: url('../images/header.png');
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: left bottom;
  //  border-bottom: 3px solid #E8303A;
    padding:0;
    height: 60px;
    box-shadow:none;
    position: relative;
    top: 0;
    z-index: 999;
    transition: none;
}

body.mobile-nav-open {
    overflow: hidden;
    position: fixed;
    width: 100%;
}

.fa-navicon:before, .fa-reorder:before, .fa-bars:before {
  color: var(--m_white);
  content:'';
  background: url('../images/mobile_menu.svg');
  background-repeat: no-repeat;
  background-position: center right;
  display: block;
  height: 30px;
  width: 45px;
}
#logo, .mobile-logo {
    margin: 30px;
}

#header #logo {
  max-height: 50px;
}

#header #logo a {
  height: 50px; 
  display: block;
  width: 160.4px;
  background-color: var(--m_red);
  -webkit-mask: url('../images/Logo_A.svg') no-repeat center;
  mask: url('../images/Logo_A.svg') no-repeat center;
  transition: background-color 0.1s ease-in-out;
}


.mobile-logo a {
  position: relative;
  z-index: 999;
  background-color: var(--m_white);
  height: 50px; 
  display: block;
  width: 160.4px;
  -webkit-mask: url('../images/Logo_A.svg') no-repeat center;
  mask: url('../images/Logo_A.svg') no-repeat center;
  transition: background-color 0.1s ease-in-out;
}

#header #logo a:hover {
  background-color: var(--m_black);
  cursor: pointer;
}

#logo a img, .mobile-logo a img {
    height: 50px; 
}

#logo a img:hover {
    filter: grayscale(1) brightness(0);
    cursor: pointer;
}

#header #navbar ul.navigation {
    margin-top: 12px;
    margin-right: 10px;
}

#header #navbar ul.navigation li {
  padding: 0.3rem 0.8rem;
}

#header #navbar ul.navigation li a, .nav-dropdown > summary {
    font-family: var(--headline_font);
    font-weight: 600;
    letter-spacing: 0.05rem;
    text-transform: uppercase;
    color: var(--m_white);
    padding:0;
    display: inline;
    position: relative;
    
}
#header #navbar ul.navigation li a:before, .nav-dropdown > summary:before {
  bottom: -5px;
}


#header #navbar ul.navigation li a:hover:before, .nav-dropdown > summary:hover:before, .nav-dropdown[open] > summary:before  {
  transform: scaleX(1);
  visibility: visible;
}

#header #navbar ul.navigation li a:before, #header #navbar ul.navigation li a:after, .nav-dropdown > summary:before, .nav-dropdown > summary:after {
    content: "";
    position: absolute;
    width: 100%;
    
    left: 0;
    visibility: hidden;
    -webkit-transform: scaleX(0);
    -moz-transform: scaleX(0);
    -ms-transform: scaleX(0);
    -o-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    transition: all 0.2s ease;
    background-color: var(--m_white);
    height: 2.5px;
}


#header #navbar ul.navigation li.active a:after, .nav-dropdown > summary:after {
    visibility: hidden;
}


@media only all and (max-width: 59.938em) {
  #header #navbar .panel-activation {
    display: block;
    position: absolute;
    right: 10px;
    top: 28px;
    z-index: 99999;
  }
}


.nav-dropdown > summary {
  list-style: none; cursor: pointer;
  font-family: 'Euclid Square', sans-serif;
}
.nav-dropdown > summary::-webkit-details-marker { display: none; }

.nav-dropdown { 
  position: relative; 
}
#header #navbar ul.navigation li .nav-dropdown-menu > ul {
  position: absolute; 
  top: 200%; 
  left: 0;
  margin: 0; 
  padding: 0; 
  list-style: none;
  min-width: 0rem; 
  background: var(--m_red);
  
  border-left: 0;
  border-right: 0;
  z-index: 50;
  display: block;
}

#header #navbar ul.navigation .nav-dropdown-menu > ul a {
  margin: 0;
}

#header #navbar ul.navigation li ul {
  border: 0;
  display: block;
  box-shadow: 4px 4px 0 var(--m_black);
}

#header #navbar ul.navigation li .nav-dropdown li > a { 
  display: block; 
  padding: .35rem 1rem; 
  color: var(--m_white); 
}

#header #navbar ul.navigation li ul li > a {
  transition: all 0.1s ease;
  cursor: pointer;
}

#header #navbar ul.navigation li ul li:hover > a {
  color: var(--m_black);
  background-color: var(--m_red);
}
#header #navbar ul.navigation li .nav-dropdown li {
  padding: 0;
}
#header #navbar ul.navigation li .nav-dropdown li a {
  padding: 0.3rem 1.1rem;
}

.nav-dropdown a:hover, .nav-dropdown a.active { 
  color: var(--m_red); 
}

.nav-dropdown-menu {
  position: relative;
  top: 19px;
  left:-1.1rem;
  display: block;
}


@media screen and (max-width:600px) {
  .nav-dropdown[open] > summary:before {
    transform: scaleX(1);
    width: 144vw;
    left: -50vw;
  }
  .nav-dropdown a:hover, .nav-dropdown a.active {
    color: var(--m_white);
  }
    .nav-dropdown-menu {
      left:0;
      top: 0;
    }
}

#header #navbar ul.navigation li .nav-dropdown li:last-child a {
  padding-bottom:0.6rem;
}

#header #navbar ul.navigation li .nav-dropdown .nav-dropdown-menu > ul {
  transition: all 0.1s ease;
  position: absolute;
  opacity: 0;
  
}

#header #navbar ul.navigation li .nav-dropdown[open] .nav-dropdown-menu > ul {
  top: 0px;
  opacity: 1;
}


.blog-content-item .list-item .list-blog-header img {
    display: none;
}


body {   
    font-size: 1.25rem;
    line-height: 1.39;
    background-color: var(--m_red);
    font-synthesis: none;
}

.single-post #body {
    padding:0;
    padding: 60px 60px;
   
    margin: 0 auto;
    
    padding-bottom: 200px;
    max-width: 1100px;
    color: var(--m_black_text);
    background-color: var(--m_white);
    min-height: 10vw;
}
@media screen and (max-width: 1560px) {
  .single-post #body {
    padding-left: calc(580px - 30vw);
  }
}


.collection-page #body {
  max-width: 100%;
  margin: 0 auto;
  padding: 60px min(20px, 24%);
  padding-bottom: 200px;
}

.collection-page #breadcrumbs {
  display: none;
}

.collection-page .blog-header {
  padding-top: 0;
  
}

.collection-page .blog-header h1 {
display: none;
}

#body:before {
    display: block;
    content:'';
    height: 500px;
    width:50px;
    position: absolute;
    left: 0;
    top:120px;
    background-image: var(--paper_texture_black);
    background-size: 100%;
    background-size: cover;
    background-color: var(--m_black);
}

@media screen and (max-width: 1000px) {
  .single-post #body {
    padding: 61px 42px;
    padding-bottom: 200px;
  }
  #body:before {
    width:8px;
  }
  
}

#sb-site {
    padding-top: 0;
}

.e-content {
    max-width: 555px;
    padding-top: 2em;
    align-items: center;
    position: relative;
}


#navbar a {
    color: var(--m_white);
}

#navbar a:hover {
   // color: #E8303A !important;
}



/* Tipográfia */
html, body, button, input, select, textarea, .pure-g, .pure-g [class*="pure-u"] {
    font-family: 'Crimson Pro', serif;
    color: var(--m_black_text);
}

hr {
    border-bottom-width: 2px;
    border-bottom-color: var(--m_red);
}

p {
    margin-block-start: 0em;
    margin-block-end: 1em;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Crimson Pro', serif;
    letter-spacing: 0;
    color: var(--m_black_text);
}

h1 {
  font-family: "Rubik", sans-serif;
  text-align: left;
}

#error h1 {
  text-transform: uppercase;
  font-weight: 700;
}

#error h4, #error p {
  text-align: center;
}

h2 {
    font-family: 'Rubik', sans-serif;
    letter-spacing: 1px;
    font-size: 19px;
    font-weight: bold;
    text-transform: uppercase;
    margin-block-start: 2em;
    margin-block-end: 0.5em;
}

h3 {
  font-size: 0.85em;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 6%;
  margin-bottom: 0.5em;
}

h4.p-name {
    font-size:82px;
    margin-top: -11px;
    margin-top: -0.15em;
    text-transform: uppercase;
    font-family: 'Rubik', sans-serif;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 1;
}

.single-post h4.p-name {
  margin-left: -0.07em;
  min-height: 2em;
}

#breadcrumbs {
  font-family: 'Space Mono', monospace;
  text-transform: uppercase;
  font-size: 0.8rem;
  line-height: 0.8;
  vertical-align: -2px;
  height: 2.3rem;
  letter-spacing: 1.5px;
  font-weight: bold;
}

#breadcrumbs span {
  padding: 0;
}

#breadcrumbs .fa {
  color: var(--m_black);
  line-height: 0;
}

.fa-angle-right:before {
  content: ">";
  font-family: "Euclid Square";
  font-weight: 700;
  font-size: 0.85em;
  vertical-align: 1px;
}



#breadcrumbs > span:last-child {
  display: none;
}

@media screen and (max-width: 1000px) {
 .blog-content-item h4.p-name {
    font-size: 15vw;
    hyphens: auto;
    
   }
}

h4.p-name a {
    background-image: var(--paper_texture_black);
    -webkit-background-clip: text;
    background-clip: text;
    background-size: 50%;
    background-origin: center;
    background-repeat: repeat;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    cursor: default;
    transition: color 0.1s ease-in-out;
}



.blog-content-list .list-item:hover h4.p-name a {
    background-color: var(--m_red);
    cursor: pointer;
    color: var(--m_red);
    background-image: none;
}

.bigtext {
    
}

.bigtext path {
  fill: transparent;
}

.svgtext textPath {
    font-family: "Rubik";
    font-size: 140px;
    text-transform: uppercase;
    fill: var(--m_red);
    line-height: 0.8;
    user-select: none;
    font-weight: 900;
    position: fixed;
    z-index: 99;
}

.bigtext {
  offset-path: path('M225.5.5c124.3 0 225 100.7 225 225s-100.7 225-225 225S.5 349.8.5 225.5 101.2.5 225.5.5');
}

.svgtext {
    position: absolute;
    z-index: 9;
    top: -950px;
    user-select: none;
    -webkit-user-select:none;
    pointer-events: none;
    letter-spacing: 10%;
    width:500px;
    mix-blend-mode: multiply;
    mix-blend-mode: plus-darker;
}

.list-item .list-blog-date {
    float: left;
    position: absolute;
    text-align: center;
    left: -150px;
    top: 7px;
}

.list-item .list-blog-date span, .list-item .list-blog-date em {
    font-family: 'Euclid Square', sans-serif;
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    background-image: var(--paper_texture_black);
    -webkit-background-clip: text;
    background-clip: text;
    background-size: 534px 288px;
    background-origin: center;
    background-repeat: repeat;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    letter-spacing: 2px;
    line-height: 0.9;
    font-size:41px;
}

.list-item .list-blog-date em {
    border: 0;
}

.single-post .tags {
  max-width: 60%;
  display: block;
}
.tags a {
  padding: 0;
  display: inline-block;
  border: 0;
}
.tags a span {
    font-family: 'Space Mono', sans-serif;    
    font-weight: 700;
    display: inline-block;
    letter-spacing: 1.5px;
    margin-right: -1.5px;

}
.tags a:after {
   content:'————————';
   font-family: 'Space Mono', sans-serif;
   letter-spacing: -3px;
   font-weight: 700;
   display: inline-block;
   padding: 0 20px;
}

.tags a:hover:after {
   color: var(--m_red);
}

.tags a:last-child:after {
   content:'';
   display: inline-block;
   padding: 0 20px;
}

a {
    color: var(--m_red);
}

a.blendin {
  color: var(--m_black_text);
}

.blog-content-list .list-item:hover .list-blog-header h4 a {
    color: var(--m_red);
    background-image: none;
    -webkit-text-fill-color: unset;
    text-fill-color: unset;
}

a:hover {
    color: var(--m_black_text);
}

.single-post .e-content ol, .single-post .e-content ul { counter-reset: item;
    list-style: outside;
    padding: 0;
}

.single-post .e-content ol li, .single-post .e-content ul li { display: block;
    position: relative;
    list-style-position: outside;
    margin-bottom: 0.5em;
 }

.single-post .e-content ol li:before {
    content: counter(item) "  ";
    counter-increment: item;
    font-family: "Space Mono", monospace;
    font-size:0.79em;
    top:0.24em;
    position: absolute;
    text-indent: -1.75em;
    left: 0;
    display: block;
    font-weight: bold;
    color: var(--m_red);
}


.single-post .e-content ul li:before {
    content:  "→";
    font-family: "Space Mono", monospace;
    font-size:1.5em;
    top:-0.25em;
    counter-increment: item;
    position: absolute;
    text-indent: -1.5em;
    left: 0.44em;
    display: block;
    font-weight: 100;
    color: var(--m_red);
}

.single-post .e-content ol ol, .single-post .e-content ul ul {
  padding-left: 1.5em;
  padding-top: 0.5em;
}

.single-post .e-content ol ol li:before, .single-post .e-content ul ul li:before {
  color: var(--m_black_text);
}

figure.image-caption {
    margin: 0;
    text-align: right;
    font-family: "Space Mono", monospace;
    font-size: 0.6em;
    opacity: 1;
    font-weight: 700;
    letter-spacing: 0.05em;
}
figure.image-caption figcaption {
    display: inline-block;
    padding-left: 10px;
    background: var(--m_white);
    color: var(--m_red);
    position: relative;
    z-index: 99;
    opacity: 1;
}
figure.image-caption:after {
    content:'';
    width: 100%;
    height: 1.5px;
    background-color: var(--m_black_text);
    position: relative;
    top: -0.74em;
    opacity: 1;
    left: 0;
    display: block;
}

@media screen and (min-width: 1500px) {
   
   figure.image-caption {
      position: absolute;
      right: -600px;
      margin-top: 24px;
      width: 500px;
   }

}
@media screen and (max-width: 1000px) {
   
   figure.image-caption {
       
       
       margin-left:-38px;
       width: 98vw;
   }

}

.blog-date-full {
  margin-top: 120px;
  display: block;

}
.blog-date-full .dt-published-full {
  display: block;
}
.blog-date-full .dt-published-full span {

  display: block;
  color: var(--m_red);
  font-size: 0.8rem;
  text-align: right;
  font-family: "Space Mono", monospace;
  text-transform: uppercase;
  font-weight: bold;
  letter-spacing: 0.15em;
}

/* Blog lista */
.blog-item-list h2 a {
    color: var(--m_black_text);
}

.blog-item-list h2 a:hover {
    color: var(--m_red);
}
.prev-next {
  display: none;
}

/* Footer */
#footer {
    background-image: var(--paper_texture_black);
    background-size: 100%;
    background-size: cover;
    background-color: var(--m_black);
 //   border-top: 3px solid #E8303A;
    color: var(--m_white);
}


#footer_logo {
    float: right;
    position: absolute;
    background-size: 100%;
    right: 0;
    display: block;
    background-color: var(--m_white);
    -webkit-mask-image: url('../images/Pecset_A.svg');
    mask-image: url('../images/Pecset_A.svg');
    bottom: 0;
    margin: 30px;
    height: 40px;
    width: 40px;
    transition: background-color 0.1s ease-in-out;
}
#footer_logo:hover {
  background-color: var(--m_red);
}
#footer .footer-links {
  display: inline-grid;
  float: left;
  align-items: center;
  height: 100%;
}
#footer a.privacy-policy-link {
  font-family: "Euclid Square", monospace;
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: 15%;
  font-size: 0.5em;
  color: var(--m_white);
  
}

/* Főoldal */

.blog-content-list .list-item .list-blog-header img {
  border-radius: 0;
  display: block;
  width: 100%;
 // height: 275px;
}

.blog-content-list #listing {
  display: grid;
  grid-template-columns: repeat(1, 90vw);
  gap: 50px;
  justify-content: center;
}


#load-more-btn:after {
  transform: rotate(90deg);
}


@media screen and (min-width: 800px) {
  .blog-content-list #listing {
    grid-template-columns: repeat(2, 38vw);
  }
  #load-more-btn:after {
    transform: rotate(0deg);
  }

}

@media screen and (min-width: 1250px) {
  .blog-content-list #listing {
    grid-template-columns: repeat(3, calc(28vw - 20px));
  }
}

@media screen and (min-width: 2150px) {
  .blog-content-list #listing {
    grid-template-columns: repeat(4, calc(21vw - 10px));
  }
}

.blog-content-list #listing h4.p-name {
  font-size: 39px;
  order: 3;
  padding-left: 57px;
  margin-top: 40px;
  margin-top: 8%;
  line-height: 1.1;
  

  
}

.blog-content-list #listing .list-item .list-blog-header h4 {
  margin-bottom: 0;
}
.single-post .list-item .list-blog-header {
  min-height: 10em;
}

@media screen and (max-width: 1000px) {
  .blog-content-list #listing {
    margin: 10px auto;
  }
}


.blog-content-list #listing .tags {
  order: 4;
  padding-left: 60px;
}

.blog-content-list #listing .tags a {
  color: var(--m_black_text);
  border-bottom: 2px solid var(--m_black_text);
  margin-right: 10px;
  border-radius: 0;
  margin-bottom: 0;
}

.blog-content-list #listing .tags a:after {
  display: none;
}

.blog-content-list #listing .list-blog-header {
  display: flex;
  flex-direction: column;
  container-type: inline-size;
}
.blog-content-list #listing .list-item{
  
}
.blog-content-list #listing .list-item .list-blog-date {
  position: absolute;
  float: left;
  display: block;
  left: 0px;
  order: 5;
  top: 335px;
  top: calc(60px + 58cqw);
  top: calc(8% + 63cqw);
}

.blog-content-list #listing .p-summary {
  padding-left: 60px;
  padding-top: 15px;
  font-size: 16px;
  line-height: 1.2;
}

.blog-content-list #listing .p-summary img, .blog-content-list #listing .p-summary figure {
  display: none;
}

.blog-content-list #listing .list-item {
  border-bottom: 0;
  margin-bottom: 0;
}



.blog-content-list #listing .list-item .list-blog-date * {
  color: var(--m_red);
  background: none;
  -webkit-text-fill-color: var(--m_red);
  text-fill-color: var(--m_red);
  font-size: 30px;
}

.header-image {
  position: relative;
  order: 1;
  display: block;
  
}


.header-image:before {
  content: '';
  display: block;
  width: calc(100% - 60px);
  height: 8px;
  right: 0;
  float: right;
  position: absolute;
  background-color: var(--m_black);
  transition: all 0.15s;
  top:-15px;
}

.list-item:hover .header-image:before {
  background-color: var(--m_red);
}

.bak_header-image:after {
  content: '';
  display: block;
  z-index: 99;
  position: absolute;
  bottom: -20px;
  right: 0;
  float: right;
  width: 475px;
  height: 275px;
  // background-color: blue;
  background-position:bottom right;
  background-image: url('../images/image_overlay.svg');
  background-repeat: no-repeat;
  mix-blend-mode: multiply;
  mix-blend-mode: plus-darker;
}

.list-item .header-overlay {
  position: absolute;
  
  background-color: #FF3D47;
  right: 0;
 // width: 415px;
  width: calc(100% - 60px);
//  height: 318px;
 // height: calc(100% + 21.8px);
  height: calc(105% + 7px);
  bottom:-5%;
  z-index: 99;
  
  clip-path: polygon(0 40%, 100% 75%, 100% 100%, 0 100%);
  transition: clip-path 0.35s ease;
  mix-blend-mode: plus-darker;
}

.list-item:hover .header-overlay {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}

@supports not (mix-blend-mode: plus-darker) {
  .list-item .header-overlay {
    mix-blend-mode: multiply;
  }
}

#sidebar {
  position: absolute;
}

.toc-sidebar {
  font-family: "Space Mono", monospace;
  position: fixed;
  left: 100px;
  width: 170px;
  top:00px;
  height: 100%;
  font-size:14px;
  font-weight: bold;
  display: grid;
  gap:10px;
  align-items: center;
  grid-template-columns: repeat(1, 170px);
}
.toc-sidebar .toc-title {
  text-transform: uppercase;
  letter-spacing: 10%;
  display: none;
}
.toc-sidebar ul { padding: 0; }
.toc-sidebar li {
  list-style: none;
  margin-bottom: 1em;
  text-align: right;
} 
.toc-sidebar a {
  color: var(--m_black_text);
}
.toc-sidebar a.active {
  color: var(--m_red);
}

@media screen and (max-width: 1000px) {
  #sidebar {
    position: static;
    order: 1;
  }
  .toc-sidebar {
    position: static;
  }
  #item {
    order: 2;
  }
  
  .blog-content-item {
    display: grid;
  }
  
  .blog-content-item > div {
    width: 100%;
  }
  
}



.form-wrapper {
  max-width: 450px;
  margin: 0 auto;
}

.button {
  background: var(--m_red);
  color: var(--m_white);
  border: 0.5px solid rgba(0,0,0,0.3);
  box-shadow: 5px 5px 0 var(--m_black), inset 0px 0px 0 var(--m_black);
  border-radius: 0;
  font-family: "Euclid Square", sans-serif;
  font-weight: 700;
  transition: all 0.2s ease-in-out;
}
.button:hover {
  background: var(--m_red);
  translate: 2px 2px;
  box-shadow: 3px 3px 0 var(--m_black), inset 0px 0px 0 var(--m_black);
}
.button:active {
  background: var(--m_red);
  translate: 5px 5px;
  box-shadow: 0px 0px 0 var(--m_black), inset 2px 2px 0 var(--m_black);
}

label {
  font-family: "Space Mono", monospace;
  font-weight: bold;
  text-align: center;
  font-size: 1rem;
  text-transform: uppercase;
  letter-spacing: 10%;
}

textarea, input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="url"], input[type="color"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="time"], input[type="week"], select[multiple=multiple] {
  background-color: white;
  border: 3px solid var(--m_black);
  border-radius: 0;
  box-shadow: inset 0 0px 0px rgba(0, 0, 0, 0.06);
  font-family: "Space Mono", monospace;
}

textarea:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="text"]:focus, input[type="url"]:focus, input[type="color"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, select[multiple=multiple]:focus {
  border-color: var(--m_red);
  box-shadow: inset 0 0px 0px rgba(0, 0, 0, 0.06), 0 0 0px rgba(0, 0, 0, 0.7);
}

/*  Responsive  */


@media screen and (max-width: 1000px) {
  .header-image:before {
    width: calc(100% - 60px);
  }
  .list-item .header-overlay {
    width: calc(100% - 60px);    
  }
}





@media screen and (max-width: 1000px) {
 #header {
    
     background-color: #f93949;
     background-color: var(--m_red);
     transition: none;
     background-image: url('../images/header_mobile.png'), linear-gradient(90deg,rgba(254, 254, 254, 1) 48%, rgba(255, 61, 71, 1) 50%);
     background-size: auto 100%;
     background-repeat: no-repeat;
     background-position: center bottom;
   //  border-bottom: 3px solid #E8303A;
     padding:0;
     height: 60px;
     box-shadow:none;
     position: relative;
     top: 0;
     z-index: 1000;
 }
  #logo {
    margin-top: 30px;
  }
  
  .svgtext textPath {
    font-size: 100px;
  }
  .svgtext {
    top:-860px;
    left: -120px;
  }
}


/* Mobile Menu */



#header #navbar ul.navigation {
    margin-top: 12px;
    margin-right: 10px;
}

.overlay-menu {
    display: grid;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    top: 0px;
    position: absolute;
    grid-template-columns: repeat(1, 100%);

}



.overlay-menu ul {
  display: grid;
  transition: gap .3s ease-in-out;
  list-style: none;
  padding: 0;
  gap:0;
  grid-template-columns: repeat(1, 100%);
}

.overlay.open .overlay-menu > ul {
  gap: 30px;
  transition: gap .3 ease-in-out;
}

.overlay.open .overlay-menu > ul ul {
  gap: 10px;
  margin-top: 30px;
  
  transition: gap .3 ease-in-out;
}

.overlay.open .overlay-menu > ul ul:after {
 content: "";
 width: 100vw;
 height: 18px;
 margin: 0 auto; 
 border-bottom: 2.5px solid var(--m_white);

}


.overlay-menu li a {
    font-family: var(--headline_font);
    color: var(--m_white);
    font-weight: 600;
    letter-spacing: 0.05rem;
    text-transform: uppercase;
}

.mobile-container {
  position: absolute;
  isolation: auto;
  top: 0;
  height: 100%;
  overflow: hidden;
  left: 0;
  margin: 0 auto;
  z-index: 999;
}

.mobile-menu {
  display: none;
  top: 0;
  right: 0;
  z-index: 3;
}

.header-fixed .mobile-menu {
  position: fixed;
}

@media (max-width: 840px) {
  .mobile-menu {
    display: block;
  }
}

.mobile-menu .button_container {
  position: absolute;
  top: 1.3rem;
  right: 1rem;
  height: 24px;
  width: 28px;
  cursor: pointer;
  z-index: 100;
  transition: opacity .25s ease;
}

.mobile-menu .button_container:hover {
  opacity: .7;
}

.mobile-menu .button_container.active {
  position: fixed;
}

.mobile-menu .button_container.active .top {
  transform: translateY(8px) translateX(0) rotate(45deg);
  background: var(--m_white);
}

.mobile-menu .button_container.active .middle {
  opacity: 0;
  background: var(--m_white);
}

.mobile-menu .button_container.active .bottom {
  transform: translateY(-8px) translateX(0) rotate(-45deg);
  background: var(--m_white);
}

.mobile-menu .button_container span:nth-of-type(2) {
  top: 8px;
}

.mobile-menu .button_container span:nth-of-type(3) {
  top: 16px;
}

.overlay {
  position: fixed;
  background: var(--m_red);
  top: 0;
  left: 0;
  width: 100%;
  height: 0%;
  opacity: 0;
  z-index: 998;
  visibility: hidden;
  transition: opacity .2s ease-in-out;
}

.overlay.open {
  opacity: 1;
  visibility: visible;
  height: 100%;
  transition: opacity .2s ease-in-out;
}

.overlay nav {
  margin: 0 auto;
  text-align: center;
}

/* Cookie Consent */

#cc-main .cm {
  background: var(--m_white);
  border-radius: 0;
  box-shadow: 0;
  display: flex;
  flex-direction: column;
  max-width: 600px;
  opacity: 0;
  overflow: hidden;
  position: fixed;
  transform: translateY(1.6em);
  visibility: hidden;
  z-index: 1;
  box-shadow: 0 .625em 4.875em rgba(0,0,2,.75);
}

#cc-main {
  background: transparent;
  color: var(--m_red);
  font-family: "Space Mono";
  font-size: 16px;
  font-weight: 400;
  line-height: 1.15;
  position: relative;
  position: fixed;
 
}

#cc-main .cm__desc {
  color: var(--m_black_text);
}

#cc-main .cm__btn {
  border-radius: 0;
  padding: 0.5em 1.5em;
}

#cc-main .cm__btns, .cm__btn-group {
  flex-direction: row;
}

#cc-main .cm__btn-group {
  display: flex;
}

#cc-main .cm__btn+.cm__btn, #cc-main .cm__btn-group+.cm__btn-group {
  margin-top:0;
}

#cc-main button, .pm__footer button {
  margin-right: 20px;
  font-family: 'Euclid Square', sans-serif;
  font-weight: 400 !important;
  letter-spacing: 0.5px;
  border-radius: 0 !important;
}

#cc-main .pm__section, #cc-main .pm__section--toggle, #cc-main .pm--box {
 border-radius: 0; 
}

#cc-main .toggle__icon-circle {
  border-radius: 50%;
}
#cc-main .toggle__icon {
  border-radius: 25px;
}
#cc-main .toggle__icon-off, #cc-main .toggle__icon-on {
  left: 0;
}
#cc-main .pm__close-btn  {
  margin: 0;
  background: var(--m_black);
  border: 0;
}
#cc-main .pm__close-btn svg {
  stroke: var(--m_white);
}

@media screen and (max-width: 1000px) {
    #cc-main button {
      margin-right: 0;
    }
}

#cc-main .pm__body, #cc-main .pm__footer, #cc-main .pm__header {
  padding: 1.5em;
}

#cc-main .pm--box {
  height: auto;
}

#cc-main .section__toggle:checked~.toggle__icon {
  background: var(--m_red);
  box-shadow: 0 0 0 1px var(--m_red);
} 

#cc-main .toggle__icon {
  background: var(--m_black);
  box-shadow: 0 0 0 1px var(--m_black);
}


#cc-main .cm__btn--secondary:hover, #cc-main .pm__btn--secondary:hover, #cc-main .cm__btn:hover, #cc-main .pm__btn:hover, #cc-main .pm__close-btn:hover {
  background: var(--m_red) !important;
  color: var(--m_white) !important;
}

#cc-main .cm__btn-group:last-child button:last-child, #cc-main .pm--box .pm__btn-group:last-child button:last-child{
  margin-right: 0;
}

#cc-main .pm__section--toggle .pm__section-title, #cc-main .pm__section--toggle, #cc-main ::-webkit-scrollbar-thumb, #cc-main .pm__section--toggle .pm__section-title:hover {
  border: 0;
  background: var(--m_yellow);
}

#cc-main .pm__section--toggle .pm__section-desc {
  padding: 0 3.5em 1.5em;
}

#cc-main .pm__section--expandable .pm__section-arrow {
  background: none;
}

#cc-main .pm__section--expandable .pm__section-arrow svg{
stroke: var(--m_black);
transform: scale(0.8);
}

#cc-main .pm__section--toggle.is-expanded .pm__section-arrow svg {
  transform: scale(-0.8);
  stroke: var(--m_black);
}

#cc-main .cm__btn, #cc-main .pm__btn {
  background: var(--m_black) !important;
  border: 0;
}
#cc-main .cm__btn--secondary, #cc-main .pm__btn--secondary {
  background: var(--m_yellow) !important; 
  background: var(--m_black) !important;
  color: var(--m_white) !important;
}

#cc-main .pm__btn--secondary[data-role*="save"] {
  background: var(--m_red) !important;
}

/*
.hypothesis-highlights-always-on .hypothesis-highlight {
  background-color: rgba(0,0,0,0) !important;

}
*/

.hypothesis-highlights-always-on .hypothesis-highlight {
  background-color: #FFCE00 !important;

}

.hypothesis-highlights-always-on .hypothesis-highlight.user-highlights {
  background-color: #FFCE00 !important;
}

.hypothesis-highlights-always-on .hypothesis-shape-highlight.hypothesis-highlight-focused, .hypothesis-highlights-always-on .hypothesis-highlight.hypothesis-highlight-focused.hypothesis-highlight-focused {
  background-color: #FFCE00 !important;
  --highlight-color:  #FFCE00 !important;
  color: var(--m_black);
}



#load-more-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 2rem 0;
  width: 100%;
  height: 105%;
  min-height: 240px;
  margin-top: calc(-5% + 9px);
  border: ;
  border-left: 8px solid var(--m_black);
  border-top: 8px solid var(--m_black);
  border-right:none;
  padding: 0;
}

#load-more-btn {
  border: none;
  padding: 0;
  background: none;
  transition: all 0.3s ease-in-out;
  font-family: 'Euclid Square';
  font-size: 4.4em;
  color: var(--m_red);
  width: 100%;
  height: 100%;
  border: 0px solid var(--m_red);
  border-top: none;
  border-bottom: none;
  border-right-color: transparent;
  box-sizing: border-box;
}
#load-more-btn::after {
    content: '→';
    display: block;
    vertical-align: middle;
    font-family: 'Euclid Square';
    font-size: 1em;
    top: -0.11em;
    position: relative;
    color: var(--m_red);
    right: 0;
    transition: all 0.3s ease-in-out;
    text-shadow: 0px 0px 0 var(--m_red);
    text-shadow:-11px 0 0 var(--m_white), 0 0px 0 var(--m_red);
    
}

@media screen and (max-width: 800px) {
  #load-more-btn:hover:after {
    text-shadow:11px 0 0 var(--m_white), 22px 0px 0 var(--m_red);
    top: -22px;
  } 
  
  .blog-content-list #listing h4.p-name {
    hyphens: auto;
    -webkit-hyphens: auto;
    -webkit-hyphenate-limit-before: 4;
    -webkit-hyphenate-limit-after: 4;
    -webkit-hyphenate-limit-lines: 3;
    hyphenate-limit-chars: 8 4 4;
    hyphenate-limit-lines: 3;
  }
}

@media screen and (min-width: 800px) {
  #load-more-btn:hover {
    border: 80px solid var(--m_red);
    border-top: none;
    border-bottom: none;
    border-right-color: transparent;
    box-sizing: border-box;
  }
  #load-more-btn:hover:after {
    text-shadow:11px 0 0 var(--m_white), 22px 0px 0 var(--m_red);
    right: 11px;
  }

}


.facet-filter { 
  display:flex; 
  flex-wrap:wrap; 
  justify-content: center;
  gap:.5rem;
   margin: 0 auto 3rem auto;
}
.facet-filter .facet, .facet-filter .facet-description{
  font-family:'Space Mono',monospace; 
  font-size:.85rem;
  padding:.25rem 0rem; 
  margin: 0 1rem;
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: 1.5px;
  margin-right: -1.5px;
  border-bottom: 2px solid var(--m_black_text);
  color:var(--m_black); 
  
}

.facet-filter .facet-description {
  border: 0;
}
.facet-filter .facet:hover { color:var(--m_red); border-color:var(--m_red); }
.facet-filter .facet.active {  
  color:var(--m_red); 
  border-color:var(--m_red);
}

.home .facet-filter {
  display: none;
}
.nav-dropdown.mufajok {
  display: none;
}

#breadcrumbs > span:first-child {
  display: none;
}


