@media (orientation: landscape) {

    #header {
        height: 8vh;
    }

    #titleBar {
        font-size: 5vh;
        margin-left: 7vw;
    }

    #logo img {
        height: 6vh;
    }

    #footer {
        top: 8vh;
        bottom: 0px;
        width: 7vw;
        /*background-color: #1a1d1e;*/
        background: linear-gradient(to left, #05141b,#071522, #06121e, #05121a, #06151d);
        position: absolute;
        display: grid;
        grid-auto-flow: row;
        justify-content: start;
        grid-template-rows: repeat(auto-fill, 8vh);
        text-align: center;
    }

    #loginsiegel img {
        max-width: 50vw;
        max-height: 50vh;
    }

    #loginfields input {
      max-width: 50vh;
      box-sizing: border-box;
      padding-left: 1vh;
      padding-right: 1vh;
      font-size: 1.7vh;
    }

    .content {
        top: 8vh;
        left: 7vw;
        bottom: 0;
    }

    .fbutton {
        font-size: 1.5vh;
    }

    .fbutton i {
      font-size: 3vh;
      padding-bottom: 1vh;
    }

    .coverImage {
        border-radius: 2vh;
    }
    
    .gridx2 {
        display: grid;
        grid-auto-flow: row;
        grid-template-columns: repeat(auto-fill, 30vh);
        margin-top: 3vh;
        margin-left: 10vw;
        margin-right: 7vw;
        justify-content: space-between;
        grid-column-gap: 2vh;
    }

    .gridx2title {
        grid-column: 1 / -1;
    }

    .gridx2title img {
        max-height: 10vh;
    }

    .receiptIframe {
        max-width: 28em;
        margin-left: auto;
        margin-right: auto;
        display: block;
    }

    .contentInputElement input {
        max-width: 95vh;
    }

    .contentInputElement span {
        font-size: 2vh;
    }

    .contentElement {
        max-width: 100vh;
    }

    .contentKursHeader {
        font-size: 4vh;
    }

    .contentKursText {
        max-width: 100vh;
        font-size: 2vh;
    }
    
    .contentKursDataInfo1{
        font-size: 2.5vh;
    }

    .contentKursDataInfo2{
        font-size: 2vh;
    }

    .contentKursDataDate{
        font-size: 1.5vh;
    }

    .contentKursDataTime{
        font-size: 2.5vh;
    }

    .contentKursDataInstructor{
        font-size: 2vh;
    }

    .contentKursDataInstructor2{
        font-size: 2vh;
    }

    .contentKursDataAvailable{
        font-size: 2vh;
    }
    
    .contentKursDataLocation{
        font-size: 2vh;
    }
    
    .contentKursDataLessonNum{
        font-size: 2vh;
    }
    
    .contentKursDataIntDetail{
        font-size: 2vh;
    }
    
    .contentKursDataAdditionalText {
        font-size: 2vh;
    }
    
    .contentKursDataPreis {
        font-size: 2vh;
    }

    .contentKursData {
        max-width: 100vh;
        grid-template-columns: 4fr 3fr 2fr 1fr;
        margin-bottom: 2vh;
    }

    .contentKursAdditional {
        max-width: 100vh;
    }

    .contentKursAdditionalIcon {
        font-size: 6vh;
    }

    .contentKursAdditionalTitle {
        font-size: 2.5vh;
    }

    .contentKursAdditionalRight {
        font-size: 2.5vh;
    }

    .contentKursAdditionalLessons {
        font-size: 2vh;
        line-height: 1.5;
    }

    .contentForwardBack {
        margin-bottom: 3vh;
    }

    .contentForwardBack div {
        font-size: 4.5vh;
    }
    
    .cardSwiper-slide {
        font-size: 4.5vh;
    }

    .campusSlider {
        width: 86vw;
        margin-left: 5vh;
        margin-right: 5vh;
    }

    .campusSlider div {
        margin-right: 3vh;
        margin-bottom: 3vh;
    }

    .campusSlider img {
      min-width: 30vh;
      max-width: 35vh;
      border-radius: 3vh;
      max-height: 21vh;
      min-height: 18vh;
    }

    .campusSlider span {
        max-width: 30vh;
        font-size: 1.7vh;
        white-space: nowrap;
    }
    .campusSlider .videolength {
        border-radius: 3vh;
    }
}