/*******
** SECTION SPECIALITIES **
********/

/*

55 = Linearis algebra
61 = Matek 1 BGE
15 = Analizis 1
54 = Analizis 2
99 = Valoszinusegszamitas
87 = Statisztika 1
94 = Statisztika 2
74 = Matek 1 Corvinus
159 = Matek 2 Corvinus
194 = Matek 2 BGE
215 = Matematika GY
235 = Kozepiskolai matek
254 = OE analizis 1
357 = Analizis 3
302 = Kalkulus fizikai alapszak
317 = Bevezeto matematika kemia alapszak
355 = Szamitastudomany alapjai
356 = Matematika biologia alapszak
348 = Gazdasagi Matematika 1
566 = Gazdasagi Matematika 2
272 = SZTE GTK Matematika 1
287 = SZTE GTK Matematika 2
332 = Matematikai alapok
405 = GTK matek 1
407 = GTK matek 2
450 = Algebra es szamelmelet
456 = Diszkret matematika
474 = Kalkulus
475 = Valszam es stat alapok
482 = Bevezeto matematika
516 = Bevezetes a szamitaselmeletbe 1
560 = A3c
631 = Matematika GTI
645 = Bevezetes a szamitaselmeletbe 2
646 = Szamitastudomany
741 = Alkalmazott matematika 1

// english topics
135 = Linear algebra
121 = Calculus 1
141 = Probability theory
154 = Calculus 2
172 = Calculus 3
173 = Precalculus

// austrian topics
206 = Mathematik Mittelschule
530 = Technische Mathematik 1
549 = Wahrscheinlichkeitstheorie
561 = Technische Mathematik 2
562 = Lineare Algebra
758 = Wirtschafts- Mathematik 1
564 = Wirtschafts- Mathematik 2
565 = Mathematik Zentralmatura



terms on http://dev.mathsplain.com/
27, 24, 25, 1, 2, 3

*/

@each $subject in 55, 61, 15, 54, 74, 99, 87, 94, 135, 121, 141, 154, 159, 194, 172, 173, 206, 215, 235, 254, 357, 302, 317, 356, 348, 272, 287, 332, 355, 405, 407, 450, 456, 474, 475, 482, 516, 560, 530, 549, 561, 562, 563, 564, 565, 566, 631, 645, 646, 741, 758 {
  $color: $topic-green;
  $dark-color: $topic-darkgreen;
  $color-name: 'green';
  $icon: summa;
  $bodybg: 'BRIDGEBIG1600';
  $titlebg-size: 90%;
  $title-padding: 50px;
  $title-fontsize: 26px;
  $icon-bg-pos: 21px;
  $subj-menu-icon-height: 25px;
  $left-menu-icon-height: 41px;

  /* topic colors */
  @if $subject == 61 or $subject == 173 or $subject == 194 or $subject == 206 or $subject == 235 or $subject == 317 or $subject == 355 or $subject == 356 or $subject == 272 or $subject == 287 or $subject == 332 or $subject == 565 {
    $color: $topic-green;
    $dark-color: $topic-darkgreen;
    $color-name: 'green';
  }
  @else if $subject == 15 or $subject == 54 or $subject == 121 or $subject == 154 or $subject == 172 or $subject == 215 or $subject == 254 or $subject == 302 or $subject == 348 or $subject == 357 or $subject == 474 or $subject == 530 or $subject == 561 or $subject == 566 or $subject == 631 {
    $color: $topic-cyan;
    $dark-color: $topic-darkcyan;
    $color-name: 'cyan';
  }
  @else if $subject == 55 or $subject == 99 or $subject == 135 or $subject == 159 or $subject == 74 or $subject == 475 or $subject == 560 or $subject == 549 or $subject == 562 or $subject == 645 or $subject == 646 {
    $color: $topic-yellow;
    $dark-color: $topic-darkyellow;
    $color-name: 'yellow';
  }
  @else if $subject == 87 or $subject == 94 or $subject == 141 or $subject == 405 or $subject == 407 or $subject == 450 or $subject == 456 or $subject == 516 or $subject == 563 or $subject == 564 or $subject == 741 or $subject == 758 {
    $color: $topic-orange;
    $dark-color: $topic-darkorange;
    $color-name: 'orange';
  }

  /* topic icons */
  @if $subject == 55 or $subject == 135 or $subject == 215 or $subject == 317 or $subject == 562 or $subject == 645 or $subject == 646 {
    $icon: 'vectors';
    $icon-bg-pos: 17px;
    $title-padding: 60px;
  }
  @else if $subject == 61 or $subject == 15 or $subject == 121 or $subject == 74 or $subject == 254 or $subject == 302 or $subject == 348 or $subject == 272 or $subject == 405 or $subject == 474 or $subject == 530 or $subject == 563 or $subject == 631 or $subject == 758 {
    $icon: 'integral1';
    $title-padding: 30px;
  }
  @else if $subject == 54 or $subject == 154 or $subject == 159 or $subject == 194 or $subject == 287 or $subject == 407 or $subject == 561 or $subject == 564 or $subject == 566 {
    $icon: 'integral2';
    $title-padding: 40px;
  }
  @else if $subject == 172 or $subject == 357 or $subject == 560 {
    $icon: 'integral3';
    $title-padding: 55px;
  }
  @else if $subject == 99 or $subject == 141 or $subject == 475 or $subject == 549 {
    $icon: 'gauss';
    $titlebg-size: 70%;
    $title-padding: 70px;
    $icon-bg-pos: 23px;
    $subj-menu-icon-height: 18px;
    $left-menu-icon-height: 32px;
  }
  @else if $subject == 87 or $subject == 565 {
    $icon: 'diagram';
    $title-padding: 45px;
    $icon-bg-pos: 16px;
    $subj-menu-icon-height: 27px;
  }
  @else if $subject == 94 {
    $icon: 'gauss-diagram';
    $title-padding: 70px;
    $icon-bg-pos: 20px;
    $subj-menu-icon-height: 22px;
  }
  @else if $subject == 173 {
    $icon: 'triangle';
    $titlebg-size: 80%;
    $title-padding: 60px;
    $subj-menu-icon-height: 21px;
    $left-menu-icon-height: 35px;
  }
  @if $subject == 450 {
    $icon: 'algebra';
  }
  @if $subject == 456 or $subject == 741 {
    $icon: 'diszkretmatek';
  }
  @if $subject == 516 {
    $icon: 'diszkretmatek';
    $title-padding: 40px;
    $title-fontsize: 24px;
  }
  @else if $subject == 235 or $subject == 206 or $subject == 355 or $subject == 356 {
    $icon: 'summa';
  }

  /* topic backgrounds */
  @if $subject == 317 or $subject == 356 or $subject == 272 or $subject == 287 or $subject == 482 or $subject == 565 {
    $bodybg: '1600Precalculus_linalg';
  }
	@else if $subject == 15 or $subject == 121 or $subject == 348 or $subject == 530 or $subject == 566 or $subject == 631 {
		$bodybg: 'ANALIZIS1-CALCULUS1-1600';
	}
  @else if $subject == 54 or $subject == 154 or $subject == 561 {
    $bodybg: 'ANALIZIS2-CALCULUS2-1600v3';
  }
  @else if $subject == 159 or $subject == 560 {
    $bodybg: '1600Linearalgebra_Valszam';
  }
  @else if $subject == 55 or $subject == 135 or $subject == 475 or $subject == 562 or $subject == 645 or $subject == 646 {
    $bodybg: 'LINEARISALGEBRA-1600';
  }
  @else if $subject == 99 or $subject == 74 or $subject == 549 {
    $bodybg: 'VALSZAM-PROBABILITY-1600';
  }
  @else if $subject == 94 or $subject == 141 or $subject == 450 or $subject == 456 or $subject == 516 or $subject == 563 or $subject == 564 or $subject == 741 or $subject == 758 {
    $bodybg: '1600Probability_stat2-v1';
  }
  @else if $subject == 87 or $subject == 405 or $subject == 407 {
    $bodybg: 'STATISZTIKA-1600';
  }
  @else if $subject == 172 or $subject == 215 or $subject == 254 or $subject == 302 or $subject == 357 or $subject == 474 {
    $bodybg: 'ANALIZIS3-CALCULUS3-1600';
  }
  @else if $subject == 61 or $subject == 194 or $subject == 235 or $subject == 206 or $subject == 173 {
		$bodybg: 'BRIDGEBIG1600';
	}
  /*@else if $subject == 27 or $subject == 24 or $subject == 25 or $subject == 1 or $subject == 2 or $subject == 3 {
    $bodybg: '1600Precalculus_linalg';
  }*/

  .subject-icon-#{$subject} {
    background: inline-image('../images/icon-#{$icon}.svg') no-repeat;
  }
  .info-icon-#{$subject} {
    background: inline-image('../images/icon-info-#{$color-name}.svg') no-repeat;
  }

  body.page-taxonomy-term-#{$subject},
  body.parent-page-taxonomy-term-#{$subject} {
    .pane-page-content {
      a {
        color: #{$color};
      }
    }
    #panel-page-mathsplain-video {
      .pane-videos,
      .pane-clone-of-videos {
        .view-videos,
        .view-clone-of-videos {
          .view-header {
            .isotope-options {
              .isotope-filters {
                li {
                  a {
                    color: #{$color};
                  }
                  &.current {
                    border-top: 3px solid #{$color};
                  }
                  &.video {
                    a {
                      &:before {
                        background: inline-image('../images/icon-video-#{$color-name}.svg') no-repeat center center;
                        background-size: auto 30px;
                      }
                    }
                  }
                  &.pdf {
                    a {
                      &:before {
                        background: inline-image('../images/icon-pdf-#{$color-name}.svg') no-repeat center center;
                        background-size: auto 30px;
                      }
                    }
                  }
                  &.quiz {
                    a {
                      &:before {
                        background: inline-image('../images/icon-quiz-#{$color-name}.svg') no-repeat center center;
                        background-size: auto 30px;
                      }
                    }
                  }
                }
              }
            }
          }
        }
      }
      .pane-menu-block-1 {
        .pane-title {
          @extend .subject-icon-#{$subject};
          background-size: auto #{$left-menu-icon-height};
          background-position: left center;
          padding: 0 0 0 #{$title-padding};
          &:before {
            @extend .subject-icon-#{$subject};
            background-color: #{$color};
            background-position: center center;
            background-size: auto #{$subj-menu-icon-height};
          }
        }
        .menu-name-menu-category-menu {
          ul {
            &.menu {
              li {
                a {
                  &:after {
                    color: #{$color};
                  }
                }
              }
            }
          }
        }
      }
      .slider-header {
        a {
          &:after {
            color: #{$color} !important;
          }
        }
      }
      .ctools-collapsible-container {
        .view-extra-materials-for-learn-page {
          .isotope-element {
            background: #{$color};
          }
        }
      }
      .help-layer {
        #mini-panel-subject_term_panel {
          .left {
            background: #{$color};
            &:before {
              background: #{$color};
            }
          }
          .right {
            .bottom {
              a {
                @extend .info-icon-#{$subject};
                color: #{$color};
                background-position: left center;
                background-size: 62px auto;
              }
            }
          }
        }
      }
      .pane-taxonomy-term-field-product {
        .commerce-add-to-cart {
          .form-submit {
            background: #{$color};
          }
        }
      }
      .pane-taxonomy-term-field-table-of-contents {
        .field-name-field-table-of-contents {
          .button {
            a {
              background: #{$color};
            }
          }
        }
      }
    }
    .node {
      &.node-video {
        &.view-mode-full {
          .no-access-wrapper {
            .no-access-link {
              .left {
                background: #{$color};
                .title {
                  @extend .subject-icon-#{$subject};
                  background-position: left center;
                  background-size: auto #{$subj-menu-icon-height};
                }
              }
              a {
                background: #{$color};
              }
              .commerce-add-to-cart {
                .form-submit {
                  background: #{$color};
                }
              }
            }
          }
          .help-layer,
          .closing-help-layer {
            background: #{$color};
            .radial-button {
              &:before {
                background: #{$dark-color};
              }
            }
            .info-layer {
              .back,
              .step {
                &:before {
                  background: url('../images/video-step-#{$color-name}.svg') no-repeat left center;
                  background-size: 25px auto;
                }
              }
              .back {
                &:after {
                  background: url('../images/video-key-left-#{$color-name}.svg') no-repeat center center;
                  background-size: 100%;
                }
              }
              .step {
                &:after {
                  background: url('../images/video-key-right-#{$color-name}.svg') no-repeat center center;
                  background-size: 100%;
                }
              }
              .play {
                background: url('../images/video-play-#{$color-name}.svg') no-repeat center center;
                background-size: auto 25px;
              }
            }
            .left {
              color: #{$color};
              .text {
                color: #{$color};
              }
            }
            &.canvas {
              a {
                &.video,
                &.step-by-step {
                  &:hover {
                    background-color: #{$dark-color};
                  }
                }
              }
            }
          }
          .closing-help-layer {
            .left {
              .all {
                .arrow {
                  &:hover {
                    background-color: #{$dark-color};
                  }
                }
              }
            }
            .right {
              .next {
                .arrow {
                  &:hover {
                    background-color: #{$dark-color};
                  }
                }
              }
            }
          }
        }
      }
    }
    #comments {
      .comments-header {
        .title.button {
          a {
            background: #{$color};
          }
        }
      }
    }
    .ckeditor-accordion-container {
      & > dl {
        & > dt {
          background: #{$color};
          & > a {
            color: #fff;
          }
          &:hover,
          &.active {
            background: #{$dark-color};
          }
        }
      }
    }
    &.node-type-video {
      .pane-page-content {
        .pane-node {
          &:after {
            background: url('../images/icon-rotate-#{$color-name}.svg') no-repeat center top;
            background-size: auto 90%;
          }
        }
      }
    }
  }
  .page-checkout {
    fieldset {
      &.cart_contents {
        table {
          &.tid-#{$subject} {
            tr {
              background: #{$color};
              td {
                &.views-field-line-item-title {
                  @extend .subject-icon-#{$subject};
                  background-position: center 25%;
                  background-size: auto #{$subj-menu-icon-height};
                }
              }
            }
          }
        }
      }
    }
  }
  .pane-subject-list {
    .view-subject-list {
      .view-content {
        ul {
          li {
            &.subject-term-#{$subject} {
              .field-content {
                background: #{$color};
                a {
                  @extend .subject-icon-#{$subject};
                  background-position: center #{$icon-bg-pos};
                  background-size: auto #{$subj-menu-icon-height};
                  .bottom {
                    background: #{$color};
                  }
                }
                &:hover {
                  background: #{$dark-color};
                  a {
                    .bottom {
                      background: #{$dark-color};
                    }
                  }
                }
              }
            }
          }
        }
      }
    }
  }
  .isotope-element {
    &.subject-term-#{$subject} {
      background-color: #{$color};
      .isotope-link {
        a {
          @extend .subject-icon-#{$subject};
          background-size: auto 30px;
          background-position: center 70px;
          &:hover {
            background-color: #{$dark-color};
          }
        }
      }
    }
  }
  .view-search {
    .isotope-element {
      .video-box {
        &.parent-taxonomy-#{$subject} {
          .video-box-header {
            .video-box-header-number {
              border-bottom: 1px solid #{$color};
              .subject-icon {
                @extend .subject-icon-#{$subject};
                background-color: #{$color};
                background-position: center center;
                background-size: auto #{$subj-menu-icon-height};
              }
            }
            .video-box-header-icons {
              div {
                &:after {
                  color: #{$color};
                }
              }
            }
          }
        }
      }
    }
  }

  @media screen and (max-width: 1007px) {
    body.page-taxonomy-term-#{$subject},
    body.parent-page-taxonomy-term-#{$subject} {
      #panel-page-mathsplain-video {
        .help-layer {
          .pane-taxonomy-term-product-commerce-price {
            .field-name-commerce-price {
              color: #{$color};
            }
          }
        }
      }
    }
  }

  @media screen and (min-width: 768px ) {
    body.page-taxonomy-term-#{$subject},
    body.parent-page-taxonomy-term-#{$subject} {
      background: url('../images/#{$bodybg}.jpg') no-repeat center top;
      background-attachment: fixed;
      &.touch-device {
        &:before {
          background: url('../images/#{$bodybg}.jpg') no-repeat center top;
          background-size: cover;
        }
      }
      #panel-page-mathsplain-video {
        .pane-menu-block-1 {
          .pane-title {
            font-size: #{$title-fontsize};
          }
        }
      }
    }
  }
} /* end @each */

@each $class1 in vectors, integral1, integral2, integral3, gauss, diagram, gauss-diagram, triangle, building, notfind, summa, algebra, diszkretmatek {
  $ico: vectors;
  @if $class1 == vectors {
    $ico: 'vectors';
  }
  @else if $class1 == integral1 {
    $ico: 'integral1';
  }
  @else if $class1 == integral2 {
    $ico: 'integral2';
  }
  @else if $class1 == integral3 {
    $ico: 'integral3';
  }
  @else if $class1 == gauss {
    $ico: 'gauss';
  }
  @else if $class1 == diagram {
    $ico: 'diagram';
  }
  @else if $class1 == gauss-diagram {
    $ico: 'gauss-diagram';
  }
  @else if $class1 == triangle {
    $ico: 'triangle';
  }
  @else if $class1 == building {
    $ico: 'building';
  }
  @else if $class1 == notfind {
    $ico: 'notfind';
  }
  @else if $class1 == summa {
    $ico: 'summa';
  }
  @else if $class1 == algebra {
    $ico: 'algebra';
  }
  @else if $class1 == diszkretmatek {
    $ico: 'diszkretmatek';
  }
  .subject-icon-mobile-icon {
    div.#{$class1} {
      a {
        &:before {
          background: $topic-green url("../images/icon-#{$ico}.svg") no-repeat center center;
          background-size: auto 35%;
        }
      }
    }
  }
  div.subject-icons {
    .#{$class1} {
      a {
        background: url("../images/icon-#{$ico}.svg") no-repeat center 70px;
        background-size: auto 30px;
      }
    }
    &.ui-accordion {
      @extend .subject-icon-mobile-icon;
    }
  }
  body.page-404-page,
  body.page-403-page {
    .pane-page-content {
      .panel-pane {
        &.subjects {
          .subject-icons {
            @extend .subject-icon-mobile-icon;
          }
        }
      }
    }
  }

} /* end @each */

@each $class in 'green', 'cyan', 'yellow', 'orange', 'gray', 'purple', 'brown' {
  $col: #000;
  $dcol: #000;
  @if $class == 'green' {
    $col: $topic-green;
    $dcol: $topic-darkgreen;
  }
  @else if $class == 'cyan' {
    $col: $topic-cyan;
    $dcol: $topic-darkcyan;
  }
  @else if $class == 'yellow' {
    $col: $topic-yellow;
    $dcol: $topic-darkyellow;
  }
  @else if $class == 'orange' {
    $col: $topic-orange;
    $dcol: $topic-darkorange;
  }
  @else if $class == 'gray' {
    $col: $light-gray;
    $dcol: $gray;
  }
  @else if $class == 'purple' {
    $col: $topic-purple;
    $dcol: $topic-darkpurple;
  }
  @else if $class == 'brown' {
    $col: $topic-brown;
    $dcol: $topic-darkbrown;
  }

  .#{$class} {
    background: #{$col};
    color: #fff;
    a {
      color: inherit;
    }
  }
  .subject-icon-mobile-color {
    div.#{$class} {
      a {
        &:before {
          background-color: #{$col};
        }
        &:hover {
          &:before {
            background-color: #{$dcol};
          }
        }
      }
    }
  }
  div.subject-icons {
    .#{$class} {
      background: #{$col};
      &:hover {
        background: #{$dcol};
      }
    }
    &.ui-accordion {
      @extend .subject-icon-mobile-color;
    }
  }
  .ckeditor-accordion-container {
    & > dl {
      & > dt.#{$class} {
        background: #{$col};
        &:hover,
        &.active {
          background: #{$dcol};
        }
      }
    }
  }
  .image-rolo {
    .#{$class} {
      background: rgba(red($col),green($col),blue($col),0.8);
    }
  }
  body.page-404-page,
  body.page-403-page {
    .pane-page-content {
      .panel-pane {
        &.subjects {
          .subject-icons {
            @extend .subject-icon-mobile-color;
          }
        }
      }
    }
  }
  body.section-altalanos-szerzodesi-feltetelek-es-adatvedelmi-iranyelvek,
  body.page-node-25,
  body.page-node-15 {
    .node {
      .field-name-body {
        .ckeditor-accordion-container {
          & > dl {
            & > dt.#{$class} {
              background: none;
              border: 1px solid #{$col};
              color: $text;
              .ckeditor-accordion-toggle,
              .ckeditor-accordion-toggler {
                color: inherit;
                &:before {
                  color: inherit;
                }
              }
              & + dd {
                border-left: 1px solid #{$col};
              }
            }
          }
        }
      }
    }
  }

} /* end @each */


/* some special code */
body {
  &.page-taxonomy-term-99,
  &.parent-page-taxonomy-term-99 {
    #panel-page-mathsplain-video {
      .pane-menu-block-1 {
        .pane-title {
          position: relative;
          text-indent: -9999px;
          &:after {
            content: "Val\00f3 sz\00ed n\00fc s\00e9 g-sz\00e1 m\00ed t\00e1 s";
            position: absolute;
            left: 0;
            top: 0;
            text-indent: 0;
            padding-left: 70px;
          }
        }
      }
    }
  }
  &.page-taxonomy-term-549,
  &.parent-page-taxonomy-term-549 {
    #panel-page-mathsplain-video {
      .pane-menu-block-1 {
        .pane-title {
          position: relative;
          text-indent: -9999px;
          &:after {
            content: "Wahrschein-lichkeitstheorie";
            position: absolute;
            left: 0;
            top: 0;
            text-indent: 0;
            padding-left: 70px;
          }
        }
      }
    }
  }
  &.page-taxonomy-term-87,
  &.parent-page-taxonomy-term-87,
  &.page-taxonomy-term-94,
  &.parent-page-taxonomy-term-94,
  &.page-taxonomy-term-25,
  &.parent-page-taxonomy-term-25 {
    #panel-page-mathsplain-video {
      .pane-menu-block-1 {
        .pane-title {
          vertical-align: bottom;
        }
      }
    }
  }
}

/* menu item text overrides */
.pane-subject-list {
  .view-subject-list {
    ul {
      li {
        &.subject-term-99 {
          .views-field-name {
            .field-content {
              a {
                position: relative;
                &:after {
                  content: "Val\00f3 sz\00ed n\00fc s\00e9 g-sz\00e1 m\00ed t\00e1 s";
                }
              }
            }
          }
        }
        &.subject-term-549 {
          .views-field-name {
            .field-content {
              a {
                position: relative;
                &:after {
                  content: "Wahrschein-lichkeitstheorie";
                }
              }
            }
          }
        }
      }
    }
  }
}

/* bar charts */
@for $i from 1 through 100 {
  $num: $i * 0.01;
  div.bar-chart.in-viewport {
    .bar-#{$i} {
      &:after {
        width: percentage($num);
      }
    }
  }
}
