article{
    width:100%;
}
section.filter .hamburger-icon{
    top:-10px;
}
section.site-title{
    z-index: 2;
}
.v-slider-for .ut-videoarchiv{
    line-height: 1.5em;
    font-size: 1.4rem;
    margin-top: 0.5em;
    font-family: var(--os-b);
}
.v-slider-for .titel-video{
    line-height: 1.5em;
    font-size: 1.4rem;
    margin:0.75em 0 1.25rem;
}
.v-slider-for .titel-video .title{
    font-family: var(--os-b);
}
.v-slider-for .titel-video .ut p{
    line-height: 1.4em;
    font-size: 1.4rem;
    font-family: var(--os-l);
}
h2.node.page-title {
  max-width: var(--slider-width);
  text-align: center;
  font-size: 3rem;
  font-family: var(--os-l);
  font-weight: normal;
  position: sticky;
  top: 100px;
  z-index: 1;
  background-color: var(--hellgrau);
  margin: 0;
  padding: 15px 5px;
  width: 70vw;
}
h2.node.page-title p{
  margin: 0; 
  font-size: 3rem; 
}
.vorschau{
    width:100%;
    max-width:210px;
    cursor: pointer;
    position: relative;
}
.view-videoarchiv-mitglieder .vorschau{
    max-width: 195px;
}
.v-slider-nav > .vorschau:hover > .edit{
    display: block;
}
.vorschau .preview-image{
    border:1px solid transparent;    
}
.vorschau.active .preview-image{
    border-color:var(--blau);
}
.preview-image{
    width:100%;
    max-width: 210px;
    height: 120px;
}
.vorschau .standard{
    text-align: center;
    background-color: var(--grau);
    width:100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.vorschau .mitglied{
    background-color: var(--grau);
    width:100%;
    height: 100%;
    display: flex;
    justify-content: left;    
}
.vorschau .standard img{
    height: 100px;
    width: auto;
    object-fit: contain;
}
.vorschau .mitglied img{
    height: 120px;
    width: auto;
    object-fit: contain;
}
.vorschau .right{
    padding-top:20px;
}
.vorschau .right .name{
    font-family: var(--os-b);
    margin: 0 5px;
    font-size: 1.4rem;
}
.vorschau .right .disziplin,
.vorschau .right .date{
    hyphens: auto;
    margin: 0 5px;
    font-size: 1.4rem;
}
.vorschau .titel-video .title,
.vorschau .titel-video .ut p,
.vorschau .titel-video .utv p,
.aktuell .vorschau .titel-video .utv{
    line-height: 1.25em;
    font-size: 1.4rem;
    font-family: var(--os-b);
    margin: 0.5em 0 0;
}
.v-slider-nav{
    gap:20px;
    margin: 60px auto;
}
.v-slider-nav .duration{
    font-size: 0.8em;
    color: var(--text-grau);
    margin-top: 0.5em;
}
.v-slider-nav .duration .full-version{
    margin-right: 0.25em;
}
.v-slider-nav img{
    border:none;
}
.v-slider-nav .duration .icon{
    border: 1px solid var(--text-grau);
    border-radius: 30%;
    padding: 0 3px 0 5px;
    margin-right: 0.5em;
    font-size: 0.75em;
}
.video-archiv .ut-videoarchiv p{
    line-height: 1.5em;
    font-size: 1.4rem;
    margin: 0.5em 0 0;
    font-family: var(--os-b);
}
.v-slider-wrapper{
    position: relative;
    max-width:var(--full-width);
    margin: 0 auto;
}
video{
    max-width:var(--slider-width);
    height: auto;
    display: block;
    margin: 0 auto;
}
.slide video{
    height: 0px;
}
.v-slider-for{
    max-width: var(--slider-width);
    margin: 0 auto;
}
.v-slider-for .slide{
    opacity: 0;
    visibility: hidden;
    height: 0px;
    transition: opacity 1s linear;
}
.aktuell .v-slider-for .slide,
.aktuell video{
    max-width: var(--video-aktuell);
    width: 100%;
    height: 0px;
}
.v-slider-for .slide.active-slide,
.v-slider-for .slide.active-slide video{
    opacity: 1;
    height: auto;
    visibility: visible;
    transition: opacity 1s ease;
}
.site-title{
    position: sticky;
    top:80px;
}
.view-videoarchiv .top-filter{
    gap:20px;
    margin: 0 auto 100px;
}
.view-videoarchiv .jahr{
    width:210px;
}
.view-videoarchiv .jahr .image{
    width:100%;
    height: 140px;
    text-align: center;
    background-color: var(--grau);
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.view-videoarchiv .jahr .image img{
    height: 100px;
    width: auto;
    object-fit: contain;
}
.view-videoarchiv .jahr .title{
    text-align: center;
    font-family: var(--os-b);
    margin-top: 0.5em;
}

@media (max-width:1079px){
    .v-slider-for .slide,
    video{
        max-width: 720px;
    }
}
@media (max-width:768px){

}
@media (max-width:719px){
    .v-slider-for .slide,
    video{
        max-width: 340px;
    }
}