/* Language differences */

.eh-logos {
  position: relative;
  &:before,
  &:after {
    position: absolute;
    top: 100%;
    left: 0;
    content: "";
    display: inline-block;
    width: 220px;
    height: 90px;
    margin-left: 15px;
  }
  &:before {
    background: url('../images/ev-honlapja-wh-2024.svg') no-repeat, url('../images/ev-honlapja-wh-2023.svg') no-repeat;
    background-position: 0 center, 108px center;
    background-size: auto 74px, auto 74px;
  }
  &:after {
    background: url('../images/ev-honlapja-wh-2022.svg') no-repeat, url('../images/ev-honlapja-wh-2021.svg') no-repeat;
    background-position: 0 center, 108px center;
    background-size: auto 74px, auto 74px;
    left: 220px;
  }
}

.i18n-hu {
  .pane-mathsplain-header {
    .site-logo {
      #logo {
        width: 190px;
        height: 30px;
        background: url('../images/mateking-logo-25.svg?v1') no-repeat 0 0;
        //background: inline-image('../images/mateking-logo.svg') no-repeat 0 0;
        background-size: 100% auto;
      }
    }
  }
  #mathsplain-header-video,
  .pane-mathsplain-front-pane {
    background: url('../images/mateking-cover-2025.jpg?v1') 50% 0 no-repeat fixed;
    background-size: cover;
    #mathsplain-header-video-left-text {
      @extend .eh-logos;
      &:before,
      &:after {
        margin-left: 0;
        margin-top: 40px;
      }
    }
  }
  .node {
    &.node-video {
      &.view-mode-full {
        .field-name-field-swiffy-entity {
          .help-layer.swiffy {
            .right {
              a {
                background: inline-image('../images/stepbystep-hu.svg') no-repeat center right;
              }
            }
          }
        }
      }
    }
  }

  &.landing-page {
    .pane-page-content {
      .section-1 {
        background: url('../images/mateking-cover-2025.jpg?v1') 50% 0 no-repeat fixed;
        background-size: cover;
      }
      .panel-pane {
        &.pane-mathsplain-front-pane {
          #mathsplain-front {
            .head-wrap {
              height: 600px;
              #mathsplain-header-video-left-text {
                margin-bottom: 80px;
                &:before,
                &:after {
                  content: "";
                  display: inline-block;
                }
              }
            }
          }
        }
      }
    }
    &.parents,
    &.egyetem-megoldas,
    &.gimis-megoldas,
    &.szulo-megoldas {
      .pane-page-content {
        .head {
          .pane-content {
            @extend .eh-logos;
          }
        }
      }
    }
    &.egyetem-megoldas,
    &.gimis-megoldas,
    &.szulo-megoldas {
      .pane-page-content {
        .head {
          padding-top: 155px;
          padding-bottom: 160px;
          .pane-content {
            padding-bottom: 20px;
          }
        }
      }
    }
  }
}

.i18n-en,
.i18n-de-AT {
  .pane-mathsplain-header {
    .view-left-menu {
      .view-header {
        display: none;
      }
    }
  }
}

.i18n-en {
  .pane-mathsplain-header {
    .site-logo {
      #logo {
        width: 180px;
        height: 36px;
        background: inline-image('../images/mathxplain-logo.svg') no-repeat 0 -1px;
        background-size: 100% auto;
      }
    }
  }
  #mathsplain-header-video,
  .pane-mathsplain-front-pane {
    background: url('../images/mathxplain-cover1901.jpg') 50% 0 no-repeat fixed;
    background-size: cover;
  }
  #mathsplain-front {
    #radial-links {
      .radial-item {
        a[href*="linear-algebra"] {
          width: 150px;
        }
      }
    }
  }
  .view-testimonials {
    .view-footer {
      display: none;
    }
  }
  .node {
    &.node-video {
      &.view-mode-full {
        .no-access-wrapper {
          .no-access-field-description {
            max-width: 710px;
          }
        }
      }
    }
  }
  &.landing-page {
    .pane-page-content {
      .section-1 {
        background: url('../images/mathxplain-cover1901.jpg') no-repeat center 0;
        background-size: cover;
      }
      .section-2 {
        .image {
          background: url('../images/landing-2_en.jpg') no-repeat;
          background-size: auto 100%;
        }
      }
      .section-3 {
        .image {
          background: url('../images/landing-3_en.jpg') no-repeat right 0;
          background-size: auto 100%;
        }
      }
      .section-5 {
        .image {
          background: url('../images/landing-5_en.jpg') no-repeat;
          background-size: auto 100%;
        }
      }
      .section-8 {
        background: url("../images/landing-8_en.jpg") no-repeat 0 center;
        background-size: cover;
      }
      .section-10 {
        background: url("../images/landing-10_en.jpg") no-repeat 0 center;
        background-size: cover;
      }
      .section-11 {
        background: url("../images/landing-11_en.jpg") no-repeat center center;
        background-size: cover;
      }
      .section-12 {
        .image {
          background: url("../images/landing-12_en.jpg") no-repeat;
          background-size: auto 100%;
        }
      }
    }
  }
  &.section-altalanos-szerzodesi-feltetelek-es-adatvedelmi-iranyelvek,
  &.page-node-25,
  &.page-node-15 {
    .node {
      .field-name-body {
        #gdpr-table {
          img {
            max-width: 500px;
          }
        }
      }
    }
  }
}

.i18n-de-AT {
  .pane-mathsplain-header {
    .site-logo {
      #logo {
        width: 180px;
        height: 36px;
        background: inline-image('../images/matheking-logo.svg') no-repeat -8px -12px;
        background-size: 125% auto;
      }
    }
  }
  #mathsplain-header-video,
  .pane-mathsplain-front-pane {
    background: url('../images/matheking-cover1912.jpg') 50% 0 no-repeat fixed;
    background-size: cover;
  }
  #mathsplain-front {
    #radial-links {
      .radial-item {
        &:nth-child(2) {
          a {
            left: -35vw;
          }
        }
        &:nth-child(5) {
          a {
            left: 19vw;
          }
        }
        &:nth-child(7) {
          a {
            top: 15vw;
            left: 27vw;
          }
          &:after {
            top: 95px;
            -webkit-transform: rotate(-70deg);
            transform: rotate(-70deg);
          }
        }
      }
      #more-subjects-link {
        a {
          width: 160px;
        }
      }
    }
    &.splash-on {
      #radial-links {
        .radial-item {
          &:nth-child(7) {
            &:after {
              height: 17vw;
            }
          }
        }
      }
    }
  }
  .view-testimonials {
    .view-footer {
      display: none;
    }
  }
  &.page-user-register {
    .pane-page-content {
      > .pane-content {
        width: 55%;
      }
    }
  }
  &.landing-page {
    .pane-page-content {
      .section-1 {
        background: url('../images/matheking-cover1912.jpg') no-repeat center 0;
        background-size: cover;
      }
      .section-2 {
        .image {
          background: url('../images/landing-2-v1_de.jpg') no-repeat;
          background-size: auto 100%;
        }
      }
      .section-3 {
        .image {
          background: url('../images/landing-3-v1_de.jpg') no-repeat right 0;
          background-size: auto 100%;
        }
      }
      .section-5 {
        .image {
          background: url('../images/landing-5-v1_de.jpg') no-repeat;
          background-size: auto 100%;
        }
      }
      .section-6 {
        background: url("../images/landing-6-v1_de.jpg") no-repeat 0 center;
        background-size: cover;
      }
      .section-8 {
        background: url("../images/landing-8-v1_de.jpg") no-repeat 0 center;
        background-size: cover;
      }
      .section-10 {
        background: url("../images/landing-10-v1_de.jpg") no-repeat 0 center;
        background-size: cover;
      }
      .section-11 {
        background: url("../images/landing-11-v1_de.jpg") no-repeat center center;
        background-size: cover;
      }
      .section-12 {
        .image {
          background: url("../images/landing-12-v1_de.jpg") no-repeat;
          background-size: auto 100%;
        }
      }
    }
  }
}

@media all and (max-width: 1007px) {
  .eh-logos {
    &:before {
      background-size: auto 64px, auto 64px;
      background-position: 0 center, 85px center;
      width: 162px;
    }
    &:after {
      width: 162px;
      left: 172px;
      background-size: auto 64px, auto 64px;
      background-position: 0 center, 85px center;
    }
  }
  .i18n-hu {
    .pane-mathsplain-header {
      .site-logo {
        #logo {
          width: 140px;
          height: 30px;
          background: url('../images/mateking-logo-mobil-25.svg') no-repeat 0 center;
          background-size: 100% auto;
        }
      }
    }
  }

  .i18n-en {
    #mathsplain-front {
      #radial-links {
        .radial-item {
          &:nth-child(4) {
            a {
              bottom: 115%;
            }
          }
        }
      }
    }
    .pane-mathsplain-header {
      .site-logo {
        #logo {
          width: 158px;
          height: 30px;
          background-position: 0 0;
          position: relative;
          top: 2px;
        }
      }
    }
  }

  .i18n-de-AT {
    .pane-subject-list {
      .view-subject-list {
        .view-content {
          ul {
            li {
              .views-field-name {
                font-size: 12px;
              }
            }
          }
        }
      }
    }
    #mathsplain-front {
      #mathsplain-header-video-left-text {
        .text,
        .slideshow {
          font-size: 22px;
        }
        .slideshow {
          height: 4em;
        }
      }
      #radial-links {
        .radial-item {
          &:nth-child(4) {
            a {
              bottom: 115%;
            }
          }
          &:nth-child(5) {
            a {
              left: 23vw;
            }
          }
        }
      }
      &.splash-on {
        #radial-links {
          .radial-item {
            &:nth-child(2) {
              &:after {
                height: 18vw;
              }
            }
          }
        }
      }
    }
    .pane-mathsplain-header {
      .site-logo {
        #logo {
          width: 158px;
          height: 30px;
          position: relative;
          top: 2px;
        }
      }
    }
    #sliding-popup {
      button {
        font-size: 12px;
      }
      &.sliding-popup-top {
        .popup-content {
          #popup-text {
            p {
              font-size: 14px;
            }
          }
        }
      }
    }
  }
}

@media screen and (max-width: 1007px) and (max-height: 767px) {
  .i18n-en {
    #mathsplain-front {
      #radial-links {
        .radial-item {
          &:nth-child(4) {
            a {
              bottom: 80%;
            }
          }
        }
      }
      &.splash-on {
        #radial-links {
          .radial-item {
            &:nth-child(4) {
              &:after {
                height: 30%;
              }
            }
          }
        }
      }
    }
  }
  .i18n-de-AT {
    #mathsplain-front {
      &.splash-on {
        #radial-links {
          .radial-item {
            &:nth-child(4) {
              &:after {
                height: 30%;
              }
            }
          }
        }
      }
    }
  }
}

@media all and (max-width: 767px) {
  .eh-logos {
    &:before {
      width: 152px;
      left: 0;
      right: 50%;
      margin-right: 5px;
      background-position: left center, right center;
    }
    &:after {
      width: 154px;
      left: 165px;
      right: auto;
      background-position: left center, right center;
    }
  }
  .i18n-hu {
    &.landing-page {
      .pane-page-content {
        .panel-pane {
          &.pane-mathsplain-front-pane {
            #mathsplain-front {
              .head-wrap {
                #mathsplain-header-video-left-text {
                  margin-bottom: 0;
                  &:before,
                  &:after {
                    display: none;
                  }
                }
              }
            }
          }
        }
      }
      &.parents {
        .pane-page-content {
          .head {
            padding-bottom: 110px;
          }
        }
      }
    }
  }
  .i18n-en {

  }
  .i18n-de-AT {
    .pane-mathsplain-header {
      .pane-system-main-menu {
        .multilevelpushmenu_wrapper {
          .menu {
            .menu__item {
              a {
                &[href*="inhaltsverzeichnis"] {
                  font-size : 0;
                  &:after {
                    content: "Inhalts-verzeichnis";
                    font-size: 22px;
                    line-height: 1em;
                  }
                }
              }
            }
          }
        }
      }
    }
  }
}
