@telerik/kendo-theme-default/dist/charts.css

SASS resources for the default Kendo UI theme

.k-widget,
.k-content,
.k-input,
.k-textbox {
  background-color: #fff;
  border-color: #e5e5e5;
  color: #656565;
  border-radius: 2px; }

.k-header {
  background-color: #f9f9f9;
  border-color: #e5e5e5; }

.k-link,
.k-icon {
  color: #656565; }

.k-centered {
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%); }

.k-state-default {
  border-color: #e5e5e5; }

.k-state-selected {
  background-color: #ff6358;
  border-color: #ff685d;
  color: #fff; }

.k-state-active {
  background-color: #fff; }

.k-textbox:focus,
.k-state-focused {
  box-shadow: inset 0 0 3px 1px #e0e0e0; }

.k-state-hover,
.k-state-hover:hover {
  background-color: #ededed;
  border-color: #c6c6c6;
  color: #656565; }

.k-state-disabled,
.k-state-disabled .k-link,
.k-state-disabled .k-button {
  border-color: #d5d5d5;
  color: #d5d5d5;
  cursor: default;
  outline: 0; }

.k-state-disabled {
  opacity: .7; }

.k-state-error {
  border-style: ridge; }

.k-state-empty {
  font-style: italic; }

.k-state-highlight {
  background-color: #f9f9f9;
  border-color: #ff6358; }

.k-var--accent {
  background-color: #ff6358; }

.k-var--base {
  background-color: #f9f9f9; }

.k-var--background {
  background-color: #fff; }

.k-var--border-radius {
  margin-top: 2px; }

.k-var--normal-background {
  background-color: #fff; }

.k-var--normal-text-color {
  background-color: #656565; }

.k-var--hover-background {
  background-color: #ededed; }

.k-var--hover-text-color {
  background-color: #656565; }

.k-var--selected-background {
  background-color: #ff6358; }

.k-var--selected-text-color {
  background-color: #fff; }

.k-var--error {
  background-color: #f31700; }

.k-var--warning {
  background-color: #ffc000; }

.k-var--success {
  background-color: #37b400; }

.k-var--info {
  background-color: #0058e9; }

.k-var--series-a {
  background-color: #ff6358; }

.k-var--series-b {
  background-color: #ffd246; }

.k-var--series-c {
  background-color: #78d237; }

.k-var--series-d {
  background-color: #28b4c8; }

.k-var--series-e {
  background-color: #2d73f5; }

.k-var--series-f {
  background-color: #aa46be; }

html {
  font-family: sans-serif; }

.k-reset {
  border: 0;
  font-size: 100%;
  list-style: none;
  margin: 0;
  outline: 0;
  padding: 0;
  text-decoration: none; }

.k-textbox > input,
.k-input,
.k-textbox,
.k-button {
  font-size: 100%;
  font-family: inherit;
  border-style: solid;
  border-width: 1px;
  -webkit-appearance: none; }

.k-textbox {
  outline: 0; }

.k-floatwrap::after {
  clear: both;
  content: '';
  display: block;
  height: 0;
  overflow: hidden;
  visibility: hidden; }

.k-link {
  cursor: pointer;
  outline: 0;
  text-decoration: none; }
  .k-link:hover {
    text-decoration: none; }

.k-widget,
.k-widget *,
.k-widget *::before {
  box-sizing: content-box; }

.k-autocomplete,
.k-block,
.k-edit-cell .k-widget,
.k-grid-edit-row .k-widget,
.k-grid-edit-row .k-text-box
.k-textbox,
.k-list-filter .k-textbox {
  box-sizing: border-box; }

.k-chart,
.k-sparkline,
.k-stockchart {
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: transparent; }

.k-chart,
.k-stockchart {
  height: 400px; }

.k-chart-tooltip table {
  border-spacing: 0;
  border-collapse: collapse; }

.k-chart-tooltip th {
  width: auto;
  text-align: center;
  padding: 1px; }

.k-chart-tooltip td {
  width: auto;
  text-align: left;
  padding: .1em .2em; }

/* Selection */
.k-selector {
  position: absolute;
  -webkit-transform: translateZ(0); }

.k-selection {
  position: absolute;
  height: 100%; }

.k-selection-bg {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.01); }

.k-handle {
  width: 7px;
  height: 26px;
  z-index: 1;
  border-radius: 6px;
  position: absolute; }

.k-handle div {
  width: 100%;
  height: 100%; }

.k-leftHandle {
  left: -4px; }

.k-rightHandle {
  right: -4px; }

.k-leftHandle div {
  margin: -20px 0 0 -15px;
  padding: 40px 30px 0 0; }

.k-leftHandle.k-handle-active div {
  margin-left: -40px;
  padding-right: 55px; }

.k-rightHandle div {
  margin: -20px 0 0 -15px;
  padding: 40px 0 0 30px; }

.k-rightHandle.k-handle-active div {
  padding-left: 55px; }

.k-mask {
  position: absolute;
  height: 100%; }

.k-border {
  width: 1px;
  height: 100%;
  position: absolute; }

/* Navigator hint */
.k-navigator-hint div {
  position: absolute; }

.k-navigator-hint .k-scroll {
  position: absolute;
  height: 4px; }

.k-navigator-hint .k-tooltip {
  margin-top: 20px;
  min-width: 160px;
  opacity: 1;
  text-align: center; }

/* Sparklines */
.k-sparkline,
.k-sparkline span {
  display: inline-block;
  vertical-align: top; }

.k-sparkline span {
  height: 100%;
  width: 100%; }

.k-var--chart-font-s {
  font-size: 11px; }

.k-var--chart-font-m {
  font-size: 12px; }

.k-var--chart-font-l {
  font-size: 16px; }

.k-var--chart-inactive {
  background-color: #d5d5d5; }

.k-var--chart-major-lines {
  background-color: #adadad; }

.k-var--chart-minor-lines {
  background-color: #c6c6c6; }

.k-var--chart-area-opacity {
  opacity: 0.8; }

.k-chart,
.k-sparkline,
.k-stockchart {
  background-color: transparent; }

.k-chart-tooltip {
  background-repeat: repeat-x;
  background-position: 0 0;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAWCAYAAADAQbwGAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADNJREFUeNpi/P//vwMDFQELEP8beQb+HTWQYgP/DHoD/466cAR4edRAyg38P6hLbIAAAwCnWhhVsxvdCAAAAABJRU5ErkJggg==");
  color: #fff; }

.k-chart-tooltip-inverse {
  color: black; }

.k-selection {
  border-bottom: 0;
  border-width: 1px;
  border-style: solid;
  border-color: #d5d5d5; }

.k-selection-bg {
  background-color: #fff; }

.k-handle {
  background: #d5d5d5;
  cursor: e-resize; }

.k-handle div {
  background-color: transparent; }

.k-mask {
  background-color: #fff;
  filter: alpha(opacity=80);
  opacity: .8; }

.k-border {
  background: #d5d5d5; }

.k-navigator-hint .k-scroll {
  border-radius: 2px;
  background: #d5d5d5; }

.k-navigator-hint .k-tooltip {
  border: 0;
  background: #fff; }