/*** This file is generated automatically, do not edit it as changes will not be preserved ***/
/*** Module: language ***/
/*** This file is generated automatically, do not edit it as changes will not be preserved ***/
/*** Module: date-picker ***/
/*** This file is generated automatically, do not edit it as changes will not be preserved ***/
/*** Module: now-playing ***/
/*** Stylesheet template: src/now-playing/style.less ***/
.kartulita .now-playing {
  /* Stylesheet begins */
  background: #3b4257;
}
@media all {
  .kartulita .now-playing {
    padding: 16px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
  .kartulita .now-playing {
    padding: 12px;
  }
}
@media only screen and (max-width: 768px) {
  .kartulita .now-playing {
    padding: 8px;
  }
}
.kartulita .now-playing.empty {
  display: none;
}
.kartulita .now-playing .now-playing-text-container {
  color: white;
}
@media all {
  .kartulita .now-playing .now-playing-text-container {
    font-size: 16px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
  .kartulita .now-playing .now-playing-text-container {
    font-size: 14px;
  }
}
@media only screen and (max-width: 768px) {
  .kartulita .now-playing .now-playing-text-container {
    font-size: 12px;
  }
}
.kartulita .now-playing .now-playing-text-container .now-playing-play-icon {
  color: #ea297a;
}
@media all {
  .kartulita .now-playing .now-playing-text-container .now-playing-play-icon {
    margin-right: 8px;
    font-size: 24px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
  .kartulita .now-playing .now-playing-text-container .now-playing-play-icon {
    margin-right: 8px;
    font-size: 22px;
  }
}
@media only screen and (max-width: 768px) {
  .kartulita .now-playing .now-playing-text-container .now-playing-play-icon {
    margin-right: 6px;
    font-size: 18px;
  }
}
.kartulita .now-playing .now-playing-text-container .now-playing-play-icon:before {
  vertical-align: middle;
}
.kartulita .now-playing .now-playing-text-container .now-playing-text {
  line-height: 1;
  color: white;
}
/*** This file is generated automatically, do not edit it as changes will not be preserved ***/
/*** Module: timeline ***/
/*** Stylesheet template: src/timeline/style.less ***/
/*
 * timeline
 *   timeline-nav prev
 *   timeline-nav next
 *   timeline-goto
 *   timeline-stream-container
 *     timeline-groups
 *       timeline-group[]
 *         timeline-group-title
 *         timeline-items
 *           timeline-items-column[]
 *             timeline-item-container[]
 *               timeline-item
 *                 timeline-item-header
 *                   timeline-item-title
 */
/* Requires fontawesome */
/* CSS include: @import 'bower_components/fontawesome/css/font-awesome.css'; */
/* HTML include: <link rel="stylesheet" href="bower_components/fontawesome/css/font-awesome/css"> */
/* Background color of container */
/* Background gradient of container */
/* Base color for theme */
/* Darker version of base-color */
/* Recommend to use bootstrap full-width instead of this parameter if possible */
/* Colours for navigation buttons */
/* Group title size */
/* Size of tile */
/* Item spacing */
/* Items per row (must correspond to value in timelineItems directive) */
/* For now, must be same value for all three sizes */
/* Padding in main container */
/* Horizontal spacing between groups */
/* Nav button padding and font size */
/* Nav button: full height */
/* Background color fo timeline item time/title info */
/* Timeline item header text */
/* Calendar button */
.kartulita .timeline {
  /* Calculated stuff */
  /* Mixins used by .responsive to generate media-dependent variable values */
  /*
 * For each media query, sets values of media-dependent variables then calls
 * the given rules
 */
  /* Navigation buttons (vertically centered) */
  /* Navigation buttons (full height) */
  /* Style added to timeline element */
  /* Style added to navigation buttons */
  /* Style added to group-title */
  /* item-header-* mixins called from within .responsive */
  /* Style added to timeline item header */
  /* Style added to timeline item header on hover */
  /* Style added to timeline item header title */
  /* Style added to timeline item header time */
  /* Stylesheet commences */
  box-sizing: border-box;
  position: relative;
  display: block;
  overflow-x: hidden;
  overflow-y: hidden;
  background-color: #3b4257;
  background: linear-gradient(135deg, #505975 0%, #262b39 50%, #647094 100%);
  border: 0;
  font-weight: normal;
  line-height: 1;
  font-style: normal;
  text-decoration: none;
  color: white;
  border-top: 3px solid #ea297a;
  box-sizing: padding-box;
  /* Solely for the demo */
  transition: background 800ms ease;
}
.kartulita .timeline .nav-button-style {
  color: inherit;
  speak: none;
  transition: background 800ms ease;
  font-family: FontAwesome;
  font-weight: bold;
  background: #ea297a;
}
.kartulita .timeline .nav-button-style:hover {
  color: inherit;
  background: #c3135d;
  transition: none;
}
.kartulita .timeline .nav-button-style.prev {
  left: 0;
}
.kartulita .timeline .nav-button-style.prev:before {
  content: '\f104';
  text-align: right;
}
.kartulita .timeline .nav-button-style.next {
  right: 0;
}
.kartulita .timeline .nav-button-style.next:before {
  content: '\f105';
  text-align: left;
}
@media all {
  .kartulita .timeline {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    padding: 16px 0 16px;
    height: 383px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
  .kartulita .timeline {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    padding: 16px 0 12px;
    height: 277px;
  }
}
@media only screen and (max-width: 768px) {
  .kartulita .timeline {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    padding: 8px 0 8px;
    height: 189px;
  }
}
.kartulita .timeline,
.kartulita .timeline * {
  user-select: none;
  -moz-user-select: none;
}
.kartulita .timeline a {
  text-decoration: none;
  color: inherit;
}
.kartulita .timeline .timeline-stream-container {
  position: relative;
  overflow: hidden;
}
@media all {
  .kartulita .timeline .timeline-stream-container {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    height: 351px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
  .kartulita .timeline .timeline-stream-container {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    height: 249px;
  }
}
@media only screen and (max-width: 768px) {
  .kartulita .timeline .timeline-stream-container {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    height: 173px;
  }
}
.kartulita .timeline .timeline-nav {
  position: absolute;
  display: block;
  z-index: 1000;
  color: inherit;
  speak: none;
  transition: background 800ms ease;
  font-family: FontAwesome;
  font-weight: bold;
  background: #ea297a;
}
.kartulita .timeline .timeline-nav:hover {
  color: inherit;
  background: #c3135d;
  transition: none;
}
.kartulita .timeline .timeline-nav.prev {
  left: 0;
}
.kartulita .timeline .timeline-nav.prev:before {
  content: '\f104';
  text-align: right;
}
.kartulita .timeline .timeline-nav.next {
  right: 0;
}
.kartulita .timeline .timeline-nav.next:before {
  content: '\f105';
  text-align: left;
}
@media all {
  .kartulita .timeline .timeline-nav {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    /* Thanks, Maret for showing me this nice vertical-centering hack */
    padding: 24px 24px;
    top: 50%;
    font-size: 50px;
    margin-top: -49px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
  .kartulita .timeline .timeline-nav {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    /* Thanks, Maret for showing me this nice vertical-centering hack */
    padding: 24px 24px;
    top: 50%;
    font-size: 50px;
    margin-top: -49px;
  }
}
@media only screen and (max-width: 768px) {
  .kartulita .timeline .timeline-nav {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    /* Thanks, Maret for showing me this nice vertical-centering hack */
    padding: 24px 12px;
    top: 50%;
    font-size: 30px;
    margin-top: -39px;
  }
}
.kartulita .timeline .timeline-goto {
  margin: 0;
  position: absolute;
  box-sizing: content-box;
  background: #ea297a;
  speak: none;
  white-space: nowrap;
  overflow: hidden;
  z-index: 100;
}
@media all {
  .kartulita .timeline .timeline-goto {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    line-height: 23px;
    top: 12px;
    right: 12px;
    width: 39px;
    height: 39px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
  .kartulita .timeline .timeline-goto {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    line-height: 25px;
    top: 12px;
    right: 12px;
    width: 37px;
    height: 37px;
  }
}
@media only screen and (max-width: 768px) {
  .kartulita .timeline .timeline-goto {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    line-height: 21px;
    top: 8px;
    right: 8px;
    width: 29px;
    height: 29px;
  }
}
.kartulita .timeline .timeline-goto .open-button:before {
  font-family: FontAwesome;
  font-weight: normal;
  text-align: center;
  content: '\f073';
  display: block;
  position: absolute;
  left: 0px;
  top: 0px;
  box-sizing: content-box;
}
@media all {
  .kartulita .timeline .timeline-goto .open-button:before {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    font-size: 23px;
    line-height: 23px;
    height: 23px;
    width: 23px;
    padding: 8px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
  .kartulita .timeline .timeline-goto .open-button:before {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    font-size: 25px;
    line-height: 25px;
    height: 25px;
    width: 25px;
    padding: 6px;
  }
}
@media only screen and (max-width: 768px) {
  .kartulita .timeline .timeline-goto .open-button:before {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    font-size: 21px;
    line-height: 21px;
    height: 21px;
    width: 21px;
    padding: 4px;
  }
}
.kartulita .timeline .timeline-goto .textbox {
  display: none;
}
.kartulita .timeline .timeline-groups {
  display: inline-block;
  position: relative;
  white-space: nowrap;
  overflow: hidden;
  z-index: 1;
  /* Controller checks for non-zero width to ensure CSS is loaded */
  min-width: 1px;
}
.kartulita .timeline .timeline-group {
  display: inline-block;
}
@media all {
  .kartulita .timeline .timeline-group {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    margin: 0 10px 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
  .kartulita .timeline .timeline-group {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    margin: 0 10px 0;
  }
}
@media only screen and (max-width: 768px) {
  .kartulita .timeline .timeline-group {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    margin: 0 10px 0;
  }
}
.kartulita .timeline .timeline-group-title {
  display: block;
  position: relative;
  white-space: nowrap;
  font-weight: bold;
}
@media all {
  .kartulita .timeline .timeline-group-title {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    line-height: 35px;
    font-size: 27px;
    margin: 6px 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
  .kartulita .timeline .timeline-group-title {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    line-height: 33px;
    font-size: 25px;
    margin: 6px 0;
  }
}
@media only screen and (max-width: 768px) {
  .kartulita .timeline .timeline-group-title {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    line-height: 29px;
    font-size: 21px;
    margin: 4px 0;
  }
}
.kartulita .timeline .timeline-group-title .timeline-group-title-dims {
  display: inline-block;
}
.kartulita .timeline .timeline-items {
  /*
	 * Flexbox doesn't auto-grow-to-fit in cross-axis direction so we can't just
	 * use a simple [ display: flex; flex-flow: column wrap ] here
	 */
  overflow: hidden;
  /*
	 * Override CSS from old timeline (which is not namespaced)
	 */
  position: static;
  left: auto;
  top: auto;
  width: auto;
  height: auto;
  vertical-align: top;
}
@media all {
  .kartulita .timeline .timeline-items {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    height: 304px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
  .kartulita .timeline .timeline-items {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    height: 204px;
  }
}
@media only screen and (max-width: 768px) {
  .kartulita .timeline .timeline-items {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    height: 136px;
  }
}
.kartulita .timeline .timeline-items-column {
  display: inline-block;
  vertical-align: top;
}
@media all {
  .kartulita .timeline .timeline-items-column {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    margin-top: -16px;
    margin-bottom: -16px;
    margin-left: 0;
    margin-right: 16px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
  .kartulita .timeline .timeline-items-column {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    margin-top: -12px;
    margin-bottom: -12px;
    margin-left: 0;
    margin-right: 12px;
  }
}
@media only screen and (max-width: 768px) {
  .kartulita .timeline .timeline-items-column {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    margin-top: -8px;
    margin-bottom: -8px;
    margin-left: 0;
    margin-right: 8px;
  }
}
.kartulita .timeline .timeline-items-column:last-child {
  margin-right: 0;
}
.kartulita .timeline .timeline-item-container {
  box-sizing: border-box;
  display: block;
}
@media all {
  .kartulita .timeline .timeline-item-container {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    margin-top: 16px;
    margin-bottom: 16px;
    height: 144px;
    width: 144px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
  .kartulita .timeline .timeline-item-container {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    margin-top: 12px;
    margin-bottom: 12px;
    height: 96px;
    width: 96px;
  }
}
@media only screen and (max-width: 768px) {
  .kartulita .timeline .timeline-item-container {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    margin-top: 8px;
    margin-bottom: 8px;
    height: 64px;
    width: 64px;
  }
}
@media all {
  .kartulita .timeline .timeline-item-container .timeline-item-header {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    height: 144px;
    bottom: -110px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
  .kartulita .timeline .timeline-item-container .timeline-item-header {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    height: 96px;
    bottom: -63.36px;
  }
}
@media only screen and (max-width: 768px) {
  .kartulita .timeline .timeline-item-container .timeline-item-header {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    height: 64px;
    bottom: -34.08px;
  }
}
@media all {
  .kartulita .timeline .timeline-item-container.current {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    width: 304px;
    height: 304px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
  .kartulita .timeline .timeline-item-container.current {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    width: 204px;
    height: 204px;
  }
}
@media only screen and (max-width: 768px) {
  .kartulita .timeline .timeline-item-container.current {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    width: 136px;
    height: 136px;
  }
}
@media all {
  .kartulita .timeline .timeline-item-container.current .timeline-item-header {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    height: 304px;
    bottom: -270px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
  .kartulita .timeline .timeline-item-container.current .timeline-item-header {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    height: 204px;
    bottom: -171.36px;
  }
}
@media only screen and (max-width: 768px) {
  .kartulita .timeline .timeline-item-container.current .timeline-item-header {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    height: 136px;
    bottom: -106.08px;
  }
}
.kartulita .timeline .timeline-item-container.current .timeline-item:hover .timeline-item-state-icon {
  opacity: 0.6;
}
.kartulita .timeline .timeline-item-container .timeline-item-state-icon {
  opacity: 0;
  margin-top: 10%;
  transition: opacity 400ms linear;
  text-align: center;
  float: none;
}
@media all {
  .kartulita .timeline .timeline-item-container .timeline-item-state-icon {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    font-size: 146.4px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
  .kartulita .timeline .timeline-item-container .timeline-item-state-icon {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    font-size: 86.4px;
  }
}
@media only screen and (max-width: 768px) {
  .kartulita .timeline .timeline-item-container .timeline-item-state-icon {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    font-size: 45.6px;
  }
}
.kartulita .timeline .timeline-item {
  position: relative;
  display: block;
  overflow: hidden;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  /* Originally wrote this for wireframing, but it looks nice on final too */
  /* border: 1px solid rgba(255,255,255,0.3); */
}
.kartulita .timeline .timeline-item.phantom {
  visibility: hidden;
}
.kartulita .timeline .timeline-item:hover .timeline-item-header {
  background: rgba(234, 41, 122, 0.9);
}
@media all {
  .kartulita .timeline .timeline-item:hover .timeline-item-header {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    bottom: -5px;
    padding-top: 144px;
    background: rgba(234, 41, 122, 0.9);
  }
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
  .kartulita .timeline .timeline-item:hover .timeline-item-header {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    bottom: -4.8px;
    padding-top: 96px;
    background: rgba(234, 41, 122, 0.9);
  }
}
@media only screen and (max-width: 768px) {
  .kartulita .timeline .timeline-item:hover .timeline-item-header {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    bottom: -4.4px;
    padding-top: 64px;
    background: rgba(234, 41, 122, 0.9);
  }
}
.kartulita .timeline .timeline-item:hover .timeline-item-header .timeline-item-title {
  text-overflow: clip;
  white-space: normal;
}
.kartulita .timeline .timeline-item-header {
  background: rgba(0, 0, 0, 0.7);
  box-sizing: content-box;
  padding-top: 6px;
  position: absolute;
  transition: bottom 160ms ease-in-out, padding 160ms ease-in-out, background 160ms ease-in-out;
  width: 100%;
  z-index: 100;
}
.kartulita .timeline .timeline-item-header .timeline-item-title {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
@media all {
  .kartulita .timeline .timeline-item-header .timeline-item-title {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    font-size: 15px;
    font-weight: bold;
    line-height: 15px;
    padding: 0 4px 4px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
  .kartulita .timeline .timeline-item-header .timeline-item-title {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    font-size: 14.4px;
    font-weight: bold;
    line-height: 14.4px;
    padding: 0 3.84px 3.84px;
  }
}
@media only screen and (max-width: 768px) {
  .kartulita .timeline .timeline-item-header .timeline-item-title {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    font-size: 13.2px;
    font-weight: bold;
    line-height: 13.2px;
    padding: 0 3.52px 3.52px;
  }
}
.kartulita .timeline .timeline-item-header .timeline-item-time {
  white-space: nowrap;
  overflow: hidden;
}
@media all {
  .kartulita .timeline .timeline-item-header .timeline-item-time {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    font-size: 10px;
    font-weight: inherit;
    line-height: 10px;
    padding: 0 4px 4px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
  .kartulita .timeline .timeline-item-header .timeline-item-time {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    font-size: 9.6px;
    font-weight: inherit;
    line-height: 9.6px;
    padding: 0 3.84px 3.84px;
  }
}
@media only screen and (max-width: 768px) {
  .kartulita .timeline .timeline-item-header .timeline-item-time {
    /* Internal calculations */
    /* Variables to use within .responsive ruleset fragments */
    font-size: 8.8px;
    font-weight: inherit;
    line-height: 8.8px;
    padding: 0 3.52px 3.52px;
  }
}
.kartulita .timeline .timeline-item-thumbnail {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
  padding: 0;
  margin: 0;
  z-index: 10;
}
.kartulita .timeline .timeline-item-states {
  z-index: 50;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.kartulita .timeline .timeline-item-states .playable {
  position: absolute;
  top: 8px;
  left: 8px;
}
.kartulita .timeline .timeline-item-states .current {
  display: inline-block;
  float: left;
  clear: both;
  background-color: #ea297a;
  color: white;
  padding: 8px;
}
.kartulita .timeline .timeline-item-states .current .media-icon {
  vertical-align: middle;
  margin-top: -5px;
  margin-right: 6px;
  font-size: 22px;
  box-shadow: 0 0 0 rgba(0, 0, 0, 0.2);
  float: none;
}
/*** This file is generated automatically, do not edit it as changes will not be preserved ***/
/*** Module: show-viewer ***/
/*** Stylesheet template: src/show-viewer/style.less ***/
.kartulita .show-viewer.collapsed {
  display: none;
}
.kartulita .show-viewer .show-media-live-container {
  /* 56.25% = 9/16, i.e. 16:9 aspect ratio */
  padding-bottom: 56.25%;
  overflow: hidden;
  background: #bbb;
  box-sizing: border-box;
  position: relative;
}
.kartulita .show-viewer .show-media-live-container > * {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
}
.kartulita .show-viewer .show-media-live {
  border: 0;
  overflow: hidden;
}
.kartulita .show-viewer .show-media-image {
  width: 100%;
}
.kartulita .show-viewer .show-media-sources {
  display: block;
}
.kartulita .show-viewer .show-media-source {
  display: inline-block;
  width: 45px;
  transition: none;
}
.kartulita .show-viewer .show-media-source {
  margin: 4px 0 4px 4px;
  padding: 4px;
  display: inline-block;
  color: #999;
  background: #e4e4e4;
  /*transition: all 200ms ease;*/
  text-align: center;
}
.kartulita .show-viewer .show-media-source:hover {
  background: #ddd;
}
.kartulita .show-viewer .show-media-source.selected {
  background: #aaa;
  color: #555;
}
.kartulita .show-viewer .info-column > * {
  margin-top: 16px;
  margin-right: 16px;
  margin-bottom: 16px;
}
.kartulita .show-viewer .show-info > * {
  margin-bottom: 8px;
}
.kartulita .show-viewer .show-links-list .show-link {
  margin-bottom: 4px;
  white-space: nowrap;
}
.kartulita .show-viewer .show-links-list .link-heading {
  display: inline-block;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  max-width: 100%;
  padding: 0px 2px;
}
.kartulita .show-viewer .show-links-list .link-heading .active {
  background: #bbb;
}
.kartulita .show-viewer .show-links-menu-items .link-heading:hover {
  /* In ERR theme, link-heading:hover is set to background color with !important */
  color: white !important;
}
.kartulita .show-viewer .media-formats .format {
  margin-bottom: 4px;
  float: left;
  width: 96px;
}
.kartulita .show-viewer .media-formats .format:nth-child(2n) {
  clear: left;
  margin-left: 0;
}
.kartulita .show-viewer .media-formats .format:after {
  content: '\f130';
  font-family: FontAwesome;
  color: #999;
  float: none;
  font-size: 100%;
  line-height: 1;
  opacity: 0.8;
  padding: 3px;
}
.kartulita .show-viewer .media-formats .format:hover:after {
  opactiy: 1.0;
}
.kartulita .show-viewer .playlist-container {
  margin-bottom: 8px;
}
.kartulita .show-viewer .playlist-container .playlist-toggle {
  display: none;
}
.kartulita .show-viewer .playlist-container .playlist {
  padding-left: 8px;
}
.kartulita .show-viewer .playlist-container .playlist .playlist-item {
  clear: both;
}
.kartulita .show-viewer .playlist-container .playlist .playlist-item .time {
  font-weight: bold;
  float: left;
}
.kartulita .show-viewer .playlist-container .playlist .playlist-item .title {
  overflow-x: hidden;
}
/*** This file is generated automatically, do not edit it as changes will not be preserved ***/
/*** Module: eggs ***/
/*** Stylesheet template: src/eggs/style.less ***/
@keyframes alltheawesome {
  000% {
    opacity: 1;
    border-radius: 0;
    transform: rotate(0deg);
  }
  010% {
    opacity: 0.5;
  }
  020% {
    opacity: 1;
    border-radius: 20% 30%;
  }
  030% {
    opacity: 0.5;
  }
  040% {
    opacity: 1;
    border-radius: 0;
  }
  050% {
    opacity: 0.5;
  }
  060% {
    opacity: 1;
    border-radius: 40% 60%;
  }
  070% {
    opacity: 0.5;
  }
  080% {
    opacity: 1;
    border-radius: 0;
  }
  090% {
    opacity: 0.5;
  }
  100% {
    opacity: 1;
    border-radius: 0;
    transform: rotate(360deg);
  }
}
.hi-maret > * * {
  position: relative !important;
  top: 40px !important;
  left: 40px !important;
  right: 40px !important;
  bottom: 40px !important;
  transform-origin: top center !important;
  border-color: pink !important;
  animation: alltheawesome 4s infinite normal linear;
}
.hi-maret {
  transform-origin: center center !important;
  transform: scale(0.7);
}
/*** This file is generated automatically, do not edit it as changes will not be preserved ***/
/*** Module: schedule ***/
/*** Stylesheet template: src/schedule/style.less ***/
.kartulita .schedule {
  padding-left: 0;
  padding-right: 0;
}
.kartulita .schedule .toggle-arrow-container {
  height: 0;
  overflow: visible;
  position: relative;
  border: 0;
  box-shadow: none;
  box-sizing: border-box;
}
.kartulita .schedule .toggle-arrow-container .toggle-arrow {
  display: block;
  overflow: visible;
  position: absolute;
  left: 50%;
  width: 0;
  height: 0;
  top: -20px;
  border-left: 20px solid transparent;
  border-right: 20px solid transparent;
  border-bottom: 20px solid white;
}
/*** This file is generated automatically, do not edit it as changes will not be preserved ***/
/*** Module: err ***/