
:root {
    /* see variables.scss for more variables*/

    --highlight: #deda86; /* muss in theme/hugo-scroll/assets/css/variables.css geändert werden */

    --section-light-text-color: #3a4145!important;
    --section-light-bg-color: #f2efe8!important;
    --section-dark-bg-color: var(--section-light-text-color)!important;
    
}

 /*Keep large images within the bounds of the post-width*/
.post-content img {
  display: block;
  /*width: 60%;*/
  /*margin: 0 auto;*/
  /*align: left;*/
  /*margin: 0 0;*/
}

/* cover */

/* original */

/* #blog-logo { */
/*   display: block; */
/*   max-height: 100px; */
/*   width: auto; */
/*   margin: 0 auto; */
/*   line-height: 0; */
/* } */

/*.main-menu { */
/*  /1* max-width: 60%; *1/ */
/*  margin: auto; */
/*  max-width: 90%; */
/*  /1*margin: auto;*/ */
/*  /1* background: rgba(1,0,0,0.2); *1/ */
/*  /1*margin-top: 1rem;*/ */
/*  margin-top: clamp(0.2rem, 3vw, 1rem); */
/*} */

/*nur für Programme*/
/* #programme.main-menu { */
.main-menu {
  margin: auto;
  max-width: 95%;
  /*margin: auto;*/
  /* background: rgba(1,0,0,0.2); */
  /*margin-top: 1rem;*/
  margin-top: clamp(0.2rem, 3vw, 1rem);
}


/* #programme.vertical { */
.vertical {
  /*display: inline-block;*/
  /*align-self: flex-end;*/
  margin-top: clamp(0.2rem, 1vw, 2rem);
  /*background: rgba(1,0,0,0.2);*/
}

a.btn {
  box-shadow: var(--cover-title-text-shadow);
   /*font-size: 25px; */
  /*background: rgba(1,0,0,0.2);*/

  font-size: clamp(13px, 2.4vh ,16px);
  /* padding: 10px 20px 10px 20px; */
  /*padding: clamp(8px, 1.2vh, 10px) clamp(16px, 2.6vh, 20px);*/
  padding: clamp(2px, 1.0vh, 10px) clamp(5px, 2.2vh, 20px);
}


#blog-logo {
  display: block;
  padding-top: 41vh;
  padding-top: 41svh;
  padding-bottom: 0.5rem;
  /* max-height: 200px; */
  margin: auto;
  /* line-height: 0; */
  /* text-shadow: var(--cover-title-text-shadow); */
  /* background: black; */
}

@media only screen and (min-width: 1800px) {
  #blog-logo {
  padding-top: 42vh;
  padding-top: 42svh;
  }
}

/* menü schmaler bei nicht ganz großen bildschirmen */
@media only screen and (max-width: 1500px) {
  /*.main-menu { */
  /*  max-width: clamp(200px, 40vh, 60%); */
  /*   /1*background: rgba(90,10,9,0.3); *1/ */
  /*} */
  /* #programme.main-menu { */
  .main-menu {
    /*background: rgba(90,10,9,0.3); */
    max-width: 100%;
    /*max-width: clamp(200px, 40vh, 60%);*/
  }
}

/* kleinere knöpfe bei kleinen bildschirmen */
/* logo etwas weiter runter */
@media only screen and (max-width: 700px) {
  #blog-logo {
   padding-top: 43vh;
   padding-top: 43svh;
  }
  a.btn {
    font-size: 14px;
    padding: 8px 16px 8px 16px;
  }
}

/* @media only screen and (min-aspect-ratio 9 / 169) { */
/* breiter als hoch */
@media only screen and (aspect-ratio > 480/319) {
  #blog-logo {
    max-height: 200px;
    max-width: clamp(200px, 33vw, 1000px);
    /* background: rgba(90,10,90,0.3); */
  }
}

/* höher als breit */
@media only screen and (aspect-ratio < 480/319) {
  #blog-logo {
    /* max-width: 90vw; */
    max-height: clamp(100px, 20svh, 200px);
    /* background: rgba(10,50,50,0.3); */
  }
}

@media only screen and (width > 500px) {
  #blog-logo {
    /* background: rgba(10,10,90,0.3); */
    max-width: 100%;
  }
}

@media only screen and (width <= 500px) {
  #blog-logo {
    /* background: rgba(10,70,90,0.3); */
    max-width: 90%;
  }
}

#site-head, #site-head.withCenteredImage {
  position: relative;
  display: table;
  width: 100%;
  height: 100%;
  margin-bottom: 0rem;
  text-align: center;
  color: var(--cover-text-color);
  /*background-size: cover;*/
  background-size: cover;
  /*background: var(--section-light-bg-color) no-repeat center center;*/
  /*background: rgba(1,0,0,0.2);*/
}

a.social-menu {
  font-size: 18px;
}


/* columns: */

.row {
  display: flex;
  /* color: var(--section-dark-text-color); */
  /* background-color: lightblue; */
}

.column {
  float: left;
  width: 50%;
}

/* Clear floats after the columns */
.row::after {
  content: "";
  display: table;
  clear: both;
}

/* kleinere Schrift: */
body {
  /* hide scrollbar */
 /* overflow: hidden; */
  /* height: 100%; */
  /* max-height: 100%; */
  /* font-family: "Roboto Slab", serif; */
  font-size: 1.8rem;
  /* line-height: 1.6em; */
  /* color: var(--section-light-text-color); */
}

 /* Hide scrollbar for Chrome, Safari and Opera */

body::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
body {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
} 

summary:hover {
  color: var(--highlight);
}

details[open] {
  max-height: 10000px;
  /* background-color: rgba(0,0,0,0.2); */
  padding-bottom: 1em;
}

details summary {
  cursor: pointer;
  transition: all 0.4s ease-in-out;
}

/* mehr platz nach blockquote */
blockquote::after {

  content: '';
  display: block;
  /* background: red; */
  width: 0.6rem;
  height: 0.6rem;

}
