@import "../../../../website/static/platform/css/old_styles/color";

.lp-content h3,
.lp-content h2,
.lp-content h1 {
  color: black;

  span {
    font-family: inherit;
    font-size: inherit;
  }
}

////////////////////////
// Text color mapping //
////////////////////////
.text-lime {
  color: $zim_lime !important;
}

.text-green {
  color: $ensa_green !important;
}

.text-orange {
  color: $zim_orange !important;
}

.text-yellow {
  color: $zim_yellow !important;
}

.text-green {
  color: $zim_green !important;
}

.text-navy {
  color: $ensa_navy !important;
}

.text-orange {
  color: $ensa_orange !important;
}

//////////////////////////////
// Background color mapping //
//////////////////////////////
.bg-lime {
  background-color: $zim_lime;
}

.bg-green {
  background-color: $ensa_green;
}

.bg-orange {
  background-color: $zim_orange;
}

.bg-yellow {
  background-color: $zim_yellow;
}

.bg-green {
  background-color: $zim_green;
}

.bg-navy {
  background-color: $ensa_navy;
}

.bg-orange {
  background-color: $ensa_orange;
}

///////////////////////////
// list map specific css //
//////////////////////////
.controls {
  .bg-lime,
  .bg-green,
  .bg-orange,
  .bg-yellow,
  .bg-green,
  .bg-navy,
  .bg-orange {
    background-color: white;
  }
}

#course-filter-controls .active {
  color: white;
}

.outlined-lime {
  border: 1px solid $zim_lime;
  color: $zim_lime;
}

.outlined-green {
  border: 1px solid $ensa_green;
  color: $ensa_green;
}

.outlined-orange {
  border: 1px solid $zim_orange;
  color: $zim_orange;
}

.outlined-yellow {
  border: 1px solid $zim_yellow;
  color: $zim_yellow;
}

.outlined-green {
  border: 1px solid $zim_green;
  color: $zim_green;
}

.outlined-navy {
  border: 1px solid $ensa_navy;
  color: $ensa_navy;
}

.outlined-orange {
  border: 1px solid $ensa_orange;
  color: $ensa_orange;
}

.controls .active {
  button {
    color: white;
  }

  .bg-lime {
    background-color: $zim_lime;
  }

  .bg-green {
    background-color: $ensa_green;
  }

  .bg-orange {
    background-color: $zim_orange;
  }

  .bg-yellow {
    background-color: $zim_yellow;
  }

  .bg-green {
    background-color: $zim_green;
  }

  .bg-navy {
    background-color: $ensa_navy;
  }

  .bg-orange {
    background-color: $ensa_orange;
  }
}

.gm-style-iw .gm-style-iw-d {
  .bg-lime {
    background-color: $zim_lime !important;
  }

  .bg-green {
    background-color: $ensa_green !important;
  }

  .bg-orange {
    background-color: $zim_orange !important;
  }

  .bg-yellow {
    background-color: $zim_yellow !important;
  }

  .bg-green {
    background-color: $zim_green !important;
  }

  .bg-navy {
    background-color: $ensa_navy !important;
  }

  .bg-orange {
    background-color: $ensa_orange !important;
  }
}

// .outlined {
//     border: 1px solid white;
// }

#course-container #course-list {
  a.text-lime {
    color: $zim_lime;
  }

  a.text-green {
    color: $ensa_green;
  }

  a.text-orange {
    color: $zim_orange;
  }

  a.text-yellow {
    color: $zim_yellow;
  }

  a.text-green {
    color: $zim_green;
  }

  a.text-navy {
    color: $ensa_navy;
  }

  a.text-orange {
    color: $ensa_orange;
  }

  .gm-style-iw {
    .gm-style-iw-d {
      .bg-lime {
        background-color: $zim_lime !important;
      }

      .bg-green {
        background-color: $ensa_green !important;
      }

      .bg-orange {
        background-color: $zim_orange !important;
      }

      .bg-yellow {
        background-color: $zim_yellow !important;
      }

      .bg-green {
        background-color: $zim_green !important;
      }

      .bg-navy {
        background-color: $ensa_navy !important;
      }

      .bg-orange {
        background-color: $ensa_orange !important;
      }
    }
  }
}

/////////////////////////////////////
// Custom course list specific css //
/////////////////////////////////////
#course-container #course-list,
#custom-course-container #course-list,
.lp-link-video {
  .border-lime {
    border-color: $zim_lime;
  }

  .border-green {
    border-color: $ensa_green;
  }

  .border-orange {
    border-color: $zim_orange;
  }

  .border-yellow {
    border-color: $zim_yellow;
  }

  .border-green {
    border-color: $zim_green;
  }

  .border-navy {
    border-color: $ensa_navy;
  }

  .border-orange {
    border-color: $ensa_orange;
  }
}

.lp-link-video {
  margin-top: 40px;
}

///////////////////////////////
// video plugin specific css //
///////////////////////////////
.lp-video-container {
  display: flex;
}

////////////////////////////////
// header plugin specific css //
////////////////////////////////
.header,
.header .header-background {
  height: auto;
}

.header-background {
  // padding-bottom: 20px;
}

.flex-row {
  display: flex;
  justify-content: space-between;
}

.align_items_flex_end {
  align-items: flex-end;
}

.align_items_center {
  align-items: center;
}

.header .header-background .header-text-container {
  margin-top: 0px;
  padding-top: 5%;
}

.header-text-container {
  width: 70%;

  ul {
    text-align: left;
    margin-left: 20px;
    li {
      list-style-type: disc;
    }
  }
}

.header-image-container {
  width: 30%;
  margin-left: 30px;
  margin-top: 20px;
  margin-bottom: 20px;
}

.header .header-background img {
  height: auto;
}

.lp-small-icon {
  max-width: 50%;
}