/**
 * Retrieves a color value from the $material-colors Sass map
 * Inspired by https://github.com/nilskaspersson/Google-Material-UI-Color-Palette/
 *
 * @function
 * @param {string} color-name             - quoted, lower-case, dasherized color
 *                                          name (e.g. 'pink', 'amber')
 * @param {string} [color-variant='500']  - quoted, lowercase color variant (e.g.
 *                                          '200', 'a100')
 */
.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover,
.c-sidebar {
  background-color: #b0bec5;
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li.heading > h3,
.c-sidebar .sidebar-inner > ul > li.heading > h3 {
  color: #546e7a;
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li > a,
.c-sidebar .sidebar-inner > ul > li > a {
  color: #607d8b;
  background: #b0bec5;
}

@media (max-width: 767px) {
  .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li > a,
  .c-sidebar .sidebar-inner > ul > li > a {
    border-top: 1px solid #c8d1d6;
  }
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li > a > i,
.c-sidebar .sidebar-inner > ul > li > a > i {
  color: #56565f;
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li > a > .arrow:before, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li > a > .arrow.open:before,
.c-sidebar .sidebar-inner > ul > li > a > .arrow:before,
.c-sidebar .sidebar-inner > ul > li > a > .arrow.open:before {
  color: #5d5d67;
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li:hover > a, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li.open > a,
.c-sidebar .sidebar-inner > ul > li:hover > a,
.c-sidebar .sidebar-inner > ul > li.open > a {
  background: #90a4ae;
  color: #cfd8dc;
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li:hover > a > i, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li.open > a > i,
.c-sidebar .sidebar-inner > ul > li:hover > a > i,
.c-sidebar .sidebar-inner > ul > li.open > a > i {
  color: #eceff1;
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li:hover > a > .arrow:before, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li:hover > a > .arrow.open:before, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li.open > a > .arrow:before, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li.open > a > .arrow.open:before,
.c-sidebar .sidebar-inner > ul > li:hover > a > .arrow:before,
.c-sidebar .sidebar-inner > ul > li:hover > a > .arrow.open:before,
.c-sidebar .sidebar-inner > ul > li.open > a > .arrow:before,
.c-sidebar .sidebar-inner > ul > li.open > a > .arrow.open:before {
  color: #f5f6f7;
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li.active > a, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li.active.open > a,
.c-sidebar .sidebar-inner > ul > li.active > a,
.c-sidebar .sidebar-inner > ul > li.active.open > a {
  background: #cfd8dc;
  color: #ed6626;
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li.active > a:hover, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li.active.open > a:hover,
.c-sidebar .sidebar-inner > ul > li.active > a:hover,
.c-sidebar .sidebar-inner > ul > li.active.open > a:hover {
  background: #cfd8dc;
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li.active > a > i, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li.active.open > a > i,
.c-sidebar .sidebar-inner > ul > li.active > a > i,
.c-sidebar .sidebar-inner > ul > li.active.open > a > i {
  color: #3a3a3f;
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li.active > a > .arrow:before, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li.active > a > .arrow.open:before, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li.active.open > a > .arrow:before, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li.active.open > a > .arrow.open:before,
.c-sidebar .sidebar-inner > ul > li.active > a > .arrow:before,
.c-sidebar .sidebar-inner > ul > li.active > a > .arrow.open:before,
.c-sidebar .sidebar-inner > ul > li.active.open > a > .arrow:before,
.c-sidebar .sidebar-inner > ul > li.active.open > a > .arrow.open:before {
  color: #414147;
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner > ul > li.active > a,
.c-sidebar .sidebar-inner > ul > li.active > a {
  border-left: 3px solid #546e7a !important;
  margin-left: -3px;
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner li > a > .arrow:before, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner li > a > .arrow.open:before,
.c-sidebar .sidebar-inner li > a > .arrow:before,
.c-sidebar .sidebar-inner li > a > .arrow.open:before {
  color: #5d5d67;
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner li:hover > a > .arrow:before, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner li:hover > a > .arrow.open:before,
.c-sidebar .sidebar-inner li:hover > a > .arrow:before,
.c-sidebar .sidebar-inner li:hover > a > .arrow.open:before {
  color: #f5f6f7;
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner li.active > a > .arrow:before, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner li.active > a > .arrow.open:before,
.c-sidebar .sidebar-inner li.active > a > .arrow:before,
.c-sidebar .sidebar-inner li.active > a > .arrow.open:before {
  color: #414147;
}

.page-sidebar-closed .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner:hover .sub-menu, .page-sidebar-closed
.c-sidebar .sidebar-inner:hover .sub-menu {
  background: #FFFFFF;
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner .sub-menu > li > a,
.c-sidebar .sidebar-inner .sub-menu > li > a {
  color: #607d8b;
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner .sub-menu > li > a > i,
.c-sidebar .sidebar-inner .sub-menu > li > a > i {
  color: #56565f;
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner .sub-menu > li > a > .arrow:before, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner .sub-menu > li > a > .arrow.open:before,
.c-sidebar .sidebar-inner .sub-menu > li > a > .arrow:before,
.c-sidebar .sidebar-inner .sub-menu > li > a > .arrow.open:before {
  color: #5d5d67;
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner .sub-menu > li:hover > a, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner .sub-menu > li.open > a, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner .sub-menu > li.active > a,
.c-sidebar .sidebar-inner .sub-menu > li:hover > a,
.c-sidebar .sidebar-inner .sub-menu > li.open > a,
.c-sidebar .sidebar-inner .sub-menu > li.active > a {
  color: #cfd8dc;
  background: #90a4ae;
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner .sub-menu > li:hover > a > i, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner .sub-menu > li.open > a > i, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner .sub-menu > li.active > a > i,
.c-sidebar .sidebar-inner .sub-menu > li:hover > a > i,
.c-sidebar .sidebar-inner .sub-menu > li.open > a > i,
.c-sidebar .sidebar-inner .sub-menu > li.active > a > i {
  color: #eceff1;
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner .sub-menu > li:hover > a > .arrow:before, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner .sub-menu > li:hover > a > .arrow.open:before, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner .sub-menu > li.open > a > .arrow:before, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner .sub-menu > li.open > a > .arrow.open:before, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner .sub-menu > li.active > a > .arrow:before, .page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner .sub-menu > li.active > a > .arrow.open:before,
.c-sidebar .sidebar-inner .sub-menu > li:hover > a > .arrow:before,
.c-sidebar .sidebar-inner .sub-menu > li:hover > a > .arrow.open:before,
.c-sidebar .sidebar-inner .sub-menu > li.open > a > .arrow:before,
.c-sidebar .sidebar-inner .sub-menu > li.open > a > .arrow.open:before,
.c-sidebar .sidebar-inner .sub-menu > li.active > a > .arrow:before,
.c-sidebar .sidebar-inner .sub-menu > li.active > a > .arrow.open:before {
  color: #f5f6f7;
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner .sub-menu > li.active > a,
.c-sidebar .sidebar-inner .sub-menu > li.active > a {
  color: #ed6626;
  background: #cfd8dc;
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner .sub-menu > li.active > a:hover,
.c-sidebar .sidebar-inner .sub-menu > li.active > a:hover {
  background: #cfd8dc;
}

.page-sidebar-closed.page-sidebar-fixed .c-sidebar:hover .sidebar-inner .sub-menu > li.active > a > i,
.c-sidebar .sidebar-inner .sub-menu > li.active > a > i {
  color: #3a3a3f;
}

.c-page {
  background: #37474f;
}

.c-header {
  background: #263238;
}

.c-header .logo.logo-text > h1 {
  color: #ed6626;
}

.c-header .sidebar-toggle-desktop, .c-header .sidebar-toggle-mobile {
  background-image: url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTkuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDUwIDUwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MCA1MDsiIHhtbDpzcGFjZT0icHJlc2VydmUiIHdpZHRoPSIyNHB4IiBoZWlnaHQ9IjI0cHgiPgo8Zz4KCTxyZWN0IHk9IjMiIHdpZHRoPSI1MCIgaGVpZ2h0PSIyIiBmaWxsPSIjRkZGRkZGIi8+Cgk8cmVjdCB5PSIxNyIgd2lkdGg9IjUwIiBoZWlnaHQ9IjIiIGZpbGw9IiNGRkZGRkYiLz4KCTxyZWN0IHk9IjMxIiB3aWR0aD0iNTAiIGhlaWdodD0iMiIgZmlsbD0iI0ZGRkZGRiIvPgoJPHJlY3QgeT0iNDUiIHdpZHRoPSI1MCIgaGVpZ2h0PSIyIiBmaWxsPSIjRkZGRkZGIi8+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPC9zdmc+Cg==);
}

.c-header .nav-header .nav-item > .nav-link {
  color: #cfd8dc;
  background: #455a64;
}

.c-header .nav-header .nav-item > .nav-link.nav-link-split .nav-link-top {
  color: #cfd8dc;
  background: #37474f;
}

.c-content {
  background: #b0bec5;
}

.c-content .document {
  background: #fafafa;
}

.c-content .breadcrumb {
  border-bottom-color: #b0bec5;
}

.carousel.carousel-codex .carousel-item {
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center center;
}

.carousel.carousel-codex .carousel-control.bottom {
  color: rgba(255, 255, 255, 0.6);
}

.carousel.carousel-codex .carousel-control.bottom:hover {
  color: rgba(255, 255, 255, 0.9);
}

.page-document .document blockquote {
  background: #eeeeee;
}

body.page-loading .loader-page {
  width: 100px;
  height: 100px;
  background-color: #b0bec5;
  margin: 150px auto;
  animation: loader-page-animation 2s infinite ease-in-out;
}

@keyframes loader-page-animation {
  0% {
    transform: perspective(120px) rotateX(0deg) rotateY(0deg);
  }
  50% {
    transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
  }
  100% {
    transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
  }
}

.tabbable .tab-content {
  border-color: #D5D5D5;
  background: white;
}

.tabbable .nav-tabs {
  border-color: #c5d0dc;
}

.tabbable .nav-tabs .nav-link,
.tabbable .nav-tabs .nav-link:focus {
  border-color: #c5d0dc;
  background-color: #f9f9f9;
  color: #999999;
}

.tabbable .nav-tabs .nav-link:hover {
  background-color: #ffffff;
  color: #4c8fbd;
  border-color: #c5d0dc;
}

.tabbable .nav-tabs > .nav-item:first-child > a {
  margin-left: 0;
}

.tabbable .nav-tabs > .nav-item > a.active,
.tabbable .nav-tabs > .nav-item > .nav-link.active:hover,
.tabbable .nav-tabs > .nav-item > .nav-link.active:focus {
  color: #576373;
  border-color: #c5d0dc;
  border-top-color: #4c8fbd;
  border-bottom-color: transparent;
  background-color: #ffffff;
  box-shadow: 0 -2px 3px 0 rgba(0, 0, 0, 0.15);
}

.tabbable.tabs-below > .nav-tabs {
  border-color: #c5d0dc;
}

.tabbable.tabs-below > .nav-tabs .nav-link,
.tabbable.tabs-below > .nav-tabs .nav-link:hover,
.tabbable.tabs-below > .nav-tabs .nav-link:focus {
  border-color: #c5d0dc;
}

.tabbable.tabs-below > .nav-tabs > .nav-item > a.active,
.tabbable.tabs-below > .nav-tabs > .nav-item > .nav-link.active:hover,
.tabbable.tabs-below > .nav-tabs > .nav-item > .nav-link.active:focus {
  border-color: #c5d0dc;
  border-bottom-color: #4c8fbd;
  border-top-color: transparent;
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.15);
}

.tabbable.tabs-left > .slimScrollDiv > .nav-tabs,
.tabbable.tabs-left > .nav-tabs {
  border-color: #c5d0dc;
}

.tabbable.tabs-left > .slimScrollDiv > .nav-tabs .nav-link,
.tabbable.tabs-left > .slimScrollDiv > .nav-tabs .nav-link:focus,
.tabbable.tabs-left > .slimScrollDiv > .nav-tabs .nav-link:hover,
.tabbable.tabs-left > .nav-tabs .nav-link,
.tabbable.tabs-left > .nav-tabs .nav-link:focus,
.tabbable.tabs-left > .nav-tabs .nav-link:hover {
  border-color: #c5d0dc;
}

.tabbable.tabs-left > .slimScrollDiv > .nav-tabs > .nav-item > a.active,
.tabbable.tabs-left > .slimScrollDiv > .nav-tabs > .nav-item > .nav-link.active:focus,
.tabbable.tabs-left > .slimScrollDiv > .nav-tabs > .nav-item > .nav-link.active:hover,
.tabbable.tabs-left > .nav-tabs > .nav-item > a.active,
.tabbable.tabs-left > .nav-tabs > .nav-item > .nav-link.active:focus,
.tabbable.tabs-left > .nav-tabs > .nav-item > .nav-link.active:hover {
  border-color: #c5d0dc;
  border-left-color: #4c8fbd;
  border-right-color: transparent;
  -webkit-box-shadow: -2px 0 3px 0 rgba(0, 0, 0, 0.15) !important;
  box-shadow: -2px 0 3px 0 rgba(0, 0, 0, 0.15) !important;
}

.tabbable.tabs-right > .nav-tabs {
  border-color: #c5d0dc;
}

.tabbable.tabs-right > .nav-tabs .nav-link,
.tabbable.tabs-right > .nav-tabs .nav-link:focus,
.tabbable.tabs-right > .nav-tabs .nav-link:hover {
  border-color: #c5d0dc;
}

.tabbable.tabs-right > .nav-tabs > .nav-item > a.active,
.tabbable.tabs-right > .nav-tabs > .nav-item > .nav-link.active:focus,
.tabbable.tabs-right > .nav-tabs > .nav-item > .nav-link.active:hover {
  border-color: #c5d0dc;
  border-right-color: #4c8fbd;
  border-left-color: transparent;
  margin: 0 -2px 0 -1px;
  -webkit-box-shadow: 2px 0 3px 0 rgba(0, 0, 0, 0.15);
  box-shadow: 2px 0 3px 0 rgba(0, 0, 0, 0.15);
}

.tabbable .nav-tabs > .nav-item.open .dropdown-toggle {
  background-color: #4f99c6;
  border-color: #4f99c6;
  color: #ffffff;
}

.tabbable .nav-tabs > .nav-item.open .dropdown-toggle > .tab-icon {
  color: #ffffff !important;
}

.tabbable .nav-pills .open .dropdown-toggle,
.tabbable .nav > .nav-item.dropdown.open.active > .nav-link:hover,
.tabbable .nav > .nav-item.dropdown.open.active > .nav-link:focus {
  background-color: #4f99c6;
  border-color: #4f99c6;
  color: #ffffff;
}

.tabbable .nav-pills .open .dropdown-toggle > .tab-icon,
.tabbable .nav > .nav-item.dropdown.open.active > .nav-link:hover > .tab-icon,
.tabbable .nav > .nav-item.dropdown.open.active > .nav-link:focus > .tab-icon {
  color: #ffffff !important;
}

.tabbable .nav-tabs > .nav-item:not(.active):not(.open) > .nav-link:not(:hover) > .tab-icon:first-child.disabled {
  color: #909090 !important;
}

.scroll-to-top {
  color: #cfd8dc !important;
}

.side-nav a.active {
  background-color: #37474f;
}

.side-nav .fa {
  color: #ed6626;
}

.side-nav .fa.fa-github {
  color: black;
}

.side-nav .fa.fa-bitbucket {
  color: #205081;
}

.side-nav .fa.fa-google {
  color: #4285f4;
}

.side-nav a:not([href]):not([tabindex]).subheader {
  color: rgba(0, 0, 0, 0.54);
}
