.geschichtstage2019 .banner {
height: 200px;
overflow: hidden;
margin-bottom: 20px;
}
.geschichtstage2019 .banner img {
height: 100%;
object-fit: cover;
}

.geschichtstage2019 .mediawrap {
min-height: 60px;
}

.geschichtstage2019 .mediawrap > a > img {
  width: 40px;
}

.geschichtstage2019  .view-display-id-reports2019_renderedentity .views-row {
  grid-template-areas:
"picture title  " 
"picture speaker";
  grid-template-rows: 40px 40px;
  grid-template-columns: 60px auto;
  margin-bottom: 60px;
}

.geschichtstage2019  .view-display-id-reports2019_renderedentity .views-row .speaker {
grid-area: speaker;
}

[class^='geschichtstage20'] .views-row {
  display: grid;
  grid-template-columns: 100%;
  grid-column-gap: 20px;
  margin-bottom: 40px;
  grid-template-rows: auto 150px auto;
  overflow: hidden;
  max-height: 300px;
  background-color: #f0f0f0;
  grid-template-areas:
    "speaker    " 
    "title    " 
    "picture    " 
    "speakerpodium" 
    "date     ";
  max-height: unset;
  grid-template-rows: auto;
  padding: 10px;
  position: relative;
}

@media screen and (min-width: 576px) {
  [class^='geschichtstage20'] .views-row {
    grid-template-columns: 30% auto;
    grid-template-rows: auto 1fr auto minmax(auto, 4fr) 1fr;
    grid-template-areas:
      "picture speaker     speaker    " 
      "picture title     title    " 
      "picture speakerpodium speakerpodium" 
      "picture body      body     " 
      "picture date      date     ";
    margin-top: unset;
    background-color: white;
    max-height: 250px;
    padding: 0;
    min-height: 250px;
  }
}

[class^='geschichtstage20'] #introduction {
  margin-bottom: 20px;
}

[class^='geschichtstage20'] #introduction img {
  width: 100%;
  margin-bottom: 20px;
  max-height: 260px;
}

[class^='geschichtstage20'] #introduction .bannerwrap {
  background-color: #cf0e2d;
  height: 235px;
  margin-bottom: 10px;
}

@media screen and (min-width: 420px) {
  [class^='geschichtstage20'] #introduction .bannerwrap {
    height: 320px;
  }
}

[class^='geschichtstage20'] #introduction .bannertext {
  font-size: 50px;
  line-height: 50px;
  padding-left: 20px;
  margin-bottom: 10px;
  font-family: Helvetica;
  font-weight: bold;
  padding: 10px 0 10px 20px;
  letter-spacing: -0.1px;
  -webkit-hyphens: auto;
  hyphens: auto;
  background-color: #cf0e2d;
  height: 340px;
  font-family: "Helvetica Neue";
}

[class^='geschichtstage20'] #introduction .bannersubtitle {
  font-family: "Helvetica Neue";
  display: block;
  font-size: 20px;
  line-height: 20px;
  font-weight: bold;
  padding-left: 20px;
  padding-top: 10px;
}

@media screen and (min-width: 768px) {
  [class^='geschichtstage20'] #introduction .bannersubtitle {
    font-size: 25px;
    line-height: 25px;
  }
}

@media screen and (min-width: 1200px) {
  [class^='geschichtstage20'] #introduction .bannersubtitle {
    font-size: 30px;
    line-height: 30px;
  }
}

@media screen and (min-width: 768px) {
  [class^='geschichtstage20'] #introduction .bannertext {
    font-size: 70px;
    line-height: 70px;
  }

}

@media screen and (min-width: 1200px) {
  [class^='geschichtstage20'] #introduction .bannertext {
    font-size: 80px;
    line-height: 80px;
  }

  [class^='geschichtstage20'] #introduction img.bannerimage {
    margin: 0 auto;
    max-width: unset !important;
  }
}


[class^='geschichtstage20'] #introduction .views-row {
  grid-template-columns: 30% auto;
  max-height: 140px;
  grid-template-areas: "picture speaker""picture title""picture body""picture date";
  margin-bottom: 40px;
}

@media screen and (min-width: 420px) {
  [class^='geschichtstage20'] #introduction .views-row {
    grid-template-columns: 22% auto;
  }
}

[class^='geschichtstage20'] #introduction .views-row.videoplaying {
  margin-top: 40px;
  margin-bottom: 60px;
  grid-template-rows: 40px auto auto 0 auto 0;
  grid-template-rows: minmax(auto, 50px) auto 0 auto 0;
  grid-template-rows: auto minmax(auto, 80px) auto auto 0;
  grid-template-columns: 100%;
  max-height: unset;
  grid-template-areas: "title""video""speaker""body""date";
  grid-template-areas: "speaker""title""video""body""date";
  background-color: #f0f0f0;
  background-color: #64c8c8;
  padding: 10px;
}

[class^='geschichtstage20'] #introduction .views-row.videoplaying.presentationmodeactive {
  background: #000000db;
  margin-top: 0;
  grid-template-rows: minmax(auto, 80px) minmax(auto, 80px) auto auto 0;
}

[class^='geschichtstage20'] #introduction .view-display-id-welcome img {
  height: 100%;
  margin-bottom: 0;
}

[class^='geschichtstage20'] #introduction .views-field-field-body-abstract {
  display: none;
}

[class^='geschichtstage20'] #introduction .views-field-field-image .field-content {
  min-height: unset;
}

[class^='geschichtstage20'] #reports .views-row {
  grid-template-areas: "iconreports title""iconreports speaker";
  grid-template-rows: minmax(auto, auto) minmax(auto, auto);
  grid-template-columns: 15% auto;
  min-height: unset;
  margin-bottom: 20px;
}

@media screen and (min-width: 568px) {
  [class^='geschichtstage20'] #reports .views-row {
    grid-template-areas: "iconreports title title""iconreports speaker speaker""iconreports speakerpodium speakerpodium""iconreports body body""iconreports date date";
    grid-template-columns: 8% auto;
    min-height: 80px;
  }
}

[class^='geschichtstage20'] #interviews .views-row {
  grid-template-areas: "title""interviewer""language""date""picture";
  grid-template-rows: auto auto auto auto auto;
  grid-row-gap: 10px;
}


@media screen and (min-width: 568px) {
  [class^='geschichtstage20'] #interviews .views-row {
    grid-template-areas: "picture title""picture interviewer""picture language""picture body""picture date";
    grid-template-rows: minmax(auto, 45px) minmax(auto, 30px) minmax(auto, 40px) auto minmax(auto, 30px)
  }
}

[class^='geschichtstage20'] #interviews .views-row .placedate {
  align-self: end;
  font-size: 16px;
  grid-area: date;
}

[class^='geschichtstage20'] #interviews .views-row.videoplaying .placedate {
  align-self: start;
}

[class^='geschichtstage20'] #interviews .views-row.presentationmodeactive .placedate {
  color: white;
}

[class^='geschichtstage20'] #interviews .views-field-field-interview-language {
  grid-area: language;
  font-size: 16px;
}

[class^='geschichtstage20'] #interviews .views-row.videoplaying {
  grid-template-areas: "title""interviewer""language""date""video";
  grid-template-rows: minmax(auto, 45px) minmax(auto, 30px) minmax(auto, 30px) minmax(auto, 60px) auto;
  align-items: start;
}

[class^='geschichtstage20'] #interviews .views-row.videoplaying.presentationmodeactive {
  grid-template-rows: 40px minmax(auto, 600px) 0;
  grid-template-areas:
  "title    " 
  "interviewer" 
  "video    " 
  "date     ";
  grid-template-rows: 40px 60px minmax(auto, 600px) 40px;
}

@media screen and (min-width: 568px) {
  [class^='geschichtstage20'] #interviews .views-field-title h2 {
    margin-bottom: 10px;
    margin-top: 10px;
  }
}

[class^='geschichtstage20'] .views-row.videoplaying .views-field {
  grid-column: 1/1;
  margin-bottom: 5px;
}
[class^='geschichtstage20'] .views-field-field-interviewer {
  grid-area: interviewer;
  grid-column-start: interviewer;
  grid-column-end: interviewer;
}

[class^='geschichtstage20'] .views-row.presentationmodeactive .views-field-field-interviewer,
[class^='geschichtstage20'] .views-row.presentationmodeactive .views-field-field-interviewee {
  color: white;
}

[class^='geschichtstage20'] .videoplaying .views-field-title {
  grid-column: 1/3;
  text-align: center;
  height: 60px;
}

@media screen and (min-width: 992px) {
  [class^='geschichtstage20'] .videoplaying .views-field-title {
    grid-column: 1/3;
    text-align: left;
  }  
}

[class^='geschichtstage20'] #interviews .views-row.videoplaying .placedate {
  align-self: start;
}
[class^='geschichtstage20'] #interviews .views-row .placedate {
  align-self: end;
  font-size: 16px;
  grid-area: date;
}

[class^='geschichtstage20'] .banner {
  height: 100px;
  margin-bottom: 20px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  position: relative;
}
[class^='geschichtstage20'] .banner img {
  height: 100%;
  object-fit: cover;
}
[class^='geschichtstage20'] .banner .bannercaption {
  position: absolute;
  font-size: 10px;
  color: white;
  padding-right: 2px;
  right: 0;
  line-height: 10px;
  text-align: right;
  max-width: 75%;
  bottom: 2px;
}

[class^='geschichtstage20'] #opening .banner img {
  object-position: top;
}

[class^='geschichtstage20'] .opening,
[class^='geschichtstage20'] .keynotes,
[class^='geschichtstage20'] .reports {
  margin-bottom: 20px;
  background-color: #f0f0f0;
  background-color: #8ed7d7;
  padding: 10px;
}


[class^='geschichtstage20'] .banneropening h2,
[class^='geschichtstage20'] .bannerkeynotes h2,
[class^='geschichtstage20'] .bannerreports h2 {
  margin: 0 0 20px 0;
}

[class^='geschichtstage20'] .views-row.videoplaying {
  background-color: #64c8c8;
}

[class^='geschichtstage20'] .views-row.videoplaying.presentationmodeactive {
  position: fixed;
  width: 100%;
  z-index: 100;
  background: #000000db;
  bottom: 0;
  left: 0;
  height: 100%;
  top: 0;
  padding: 60px 20px 0 20px;
  grid-template-columns: 100%;
  grid-template-rows: minmax(80px, 140px) minmax(auto, 500px) 0 0 0;
  grid-template-rows: minmax(auto, 60px) minmax(80px, 140px) minmax(auto, 500px) 0 0;
  grid-row-gap: 0;
  margin: 0;
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}

@media screen and (min-width: 1200px) {
  [class^='geschichtstage20'] .views-row.videoplaying.presentationmodeactive {
    padding: 60px 200px 0 200px;
  }
}

@media screen and (min-width: 420px) {
  [class^='geschichtstage20'] .views-row.videoplaying.presentationmodeactive .views-field-field-vimeo-iframe .field-content {
    align-items: center;
    display: grid;
    grid-template-columns: 50px auto 50px;
  }
}

[class^='geschichtstage20'] .views-field-field-vimeo-iframe {
  display: none;
  grid-column-start: 1;
  grid-column-end: 3;
  grid-area: video;
  grid-column-start: video;
  grid-column-end: video;
}
[class^='geschichtstage20'] .views-row.videoplaying.presentationmodeactive .views-field-field-vimeo-iframe {
  grid-row: unset;
  grid-area: video;
}

[class^='geschichtstage20'] #opening .views-field views-field-title {
  grid-area: unset;
}

[class^='geschichtstage20'] #opening .views-field-body {
  display: unset;
  grid-row: 5/6;
  grid-column: 1/3;
  grid-area: body;
  margin-top: 10px;
}

[class^='geschichtstage20'] #opening .showbodyabstractbutton {
  display: none;
}

[class^='geschichtstage20'] .presentationmodeactive .speaker {
  color: white;
  padding-top: 40px;
}

[class^='geschichtstage20'] #reports .views-row .views-field-title {
  font-size: 14px;
  line-height: 16px;

}

@media screen and (min-width: 768px) {
  [class^='geschichtstage20'] #reports .views-row .views-field-title {
    font-size: 18px;
    line-height: 22px;
  }
}

[class^='geschichtstage20'] #reports .speaker {
  font-size: 14px;
  line-height: 14px;
}

[class^='geschichtstage20'] #reports .iconreports {
  height: 100%;
  grid-area: iconreports;
}

[class^='geschichtstage20'] #reports .iconreports img {
  height: 100%;
  object-fit: contain;
  object-position: left top;
}

[class^='geschichtstage20'] .views-row .views-field-title .field-content a {
  color: black !important;
}

[class^='geschichtstage20'] .field-content a {
  font-weight: 700 !important;
}

[class^='geschichtstage20'] #report .views-row {
  grid-template-columns: auto 0;
  height: unset;
  grid-column-gap: 0;
  grid-template-areas: "body";
  grid-template-rows: auto;
  background: white;
  max-height: unset;
}

[class^='geschichtstage20'] .mediawrap {
  display: grid;
  grid-template-columns: 50px auto;
  grid-column-gap: 10px;
  margin-bottom: 20px;
  grid-template-rows: 60px;
}

[class^='geschichtstage20'] .mediawrap > a {
  height: 100%;
  height: 100%;
  font-weight: normal;
  font-size: 14px;
  line-height: 16px;
}

@media screen and (min-width: 768px) {
  [class^='geschichtstage20'] .mediawrap > a {
    font-weight: 500;
    font-size: 18px;
    line-height: 20px;
  }
}

[class^='geschichtstage20'] .mediawrap > a > img {
  height: 100%;
  object-fit: contain;
}

[class^='geschichtstage20'] #press h2 {
  margin-top: 40px;
  margin-bottom: 20px;
}

[class^='geschichtstage20'] #press h2 a {
  color: black;
  text-decoration: none;
}

[class^='geschichtstage20'] #voixderecherche .voixderecherche {
  display: grid;
  grid-template-columns: 30% auto;
  height: 250px;
  grid-column-gap: 20px;
  grid-template-areas: "picture title";
}

[class^='geschichtstage20'] #voixderecherche .voixderecherche figure {
  grid-area: picture;
}

[class^='geschichtstage20'] #voixderecherche .voixderecherche .previewtext {
  grid-area: title;
}


[class^='geschichtstage20'] #voixderecherche .voixderecherche .previewtext h2 {
  font-size: 20px;
  line-height: 22px;
}

figure.soundcloudpreviewwrap {
  position: relative;
}

[class^='geschichtstage20'] #voixderecherche .voixderecherche.audioplaying {
  grid-template-columns: auto;
  grid-template-areas: "title""audiofile""controlbuttons";
  grid-template-rows: auto auto minmax(55px, auto);
  grid-row-gap: 10px;
  height: auto;
}

[class^='geschichtstage20'] #voixderecherche .voixderecherche.audioplaying figure.soundcloudpreviewwrap {
  display: none;
}

[class^='geschichtstage20'] #voixderecherche .voixderecherche img {
  //border: 1px solid #afafaf;
  object-fit: cover;
  height: 100%;
}

[class^='geschichtstage20'] #voixderecherche .voixderecherche figure.soundcloudpreviewwrap:hover .playbutton {
  display: block;
}

.voixderecherchetext {
  margin-bottom: 20px;
}

.voixderecherchetext .credits {
  font-size: 16px;
  line-height: 18px;
  letter-spacing: 0;
}

.voixderecherche .buttonpresentation {
  display: none;
}