html,
body {
  height: 100%;
}

.RadPanelBar {
  font-size: 14px;
  font-family: "Open Sans", sans-serif;
}

/* =========================
   GLOBAL LINK BEHAVIOR
   ========================= */

.RadPanelBar .rpLink,
.RadPanelBar .rpHeaderTemplate {
  white-space: nowrap;
  transition: background-color 0.2s ease, color 0.2s ease;
}

/* Improve keyboard focus visibility */

.RadPanelBar .rpLink:focus,
.RadPanelBar .rpHeaderTemplate:focus {
  outline: 2px solid #00cdc4;
  outline-offset: -2px;
}

/* =========================
   MAIN PANEL
   ========================= */

.RadPanelBar .rpRootGroup {
  color: #04b1cb;
  border-color: #00a4d3;
  background: #00a4d3;
}

/* Main navigation links */

.RadPanelBar .rpLink,
.RadPanelBar .rpHeaderTemplate {
  color: #ffffff;
  background: #00a4d3;
  border: 1px solid #00a4d3;
  font-family: "Open Sans", sans-serif;
  vertical-align: middle;
  line-height: 3.6em;
}

/* =========================
   TOP-LEVEL MENU STATES
   ========================= */

/* Focused top-level item */

.RadPanelBar .rpLink.rpFocused,
.RadPanelBar .rpHeaderTemplate.rpFocused {
  border-color: #00cdc4;
  box-shadow: inset 0 0 8px rgba(40, 94, 142, 0.4);
}

/* Hovered top-level item */

.RadPanelBar .rpRootGroup > .rpItem > .rpLink:hover,
.RadPanelBar .rpRootGroup > .rpItem > .rpHeaderTemplate:hover {
  color: #ffffff;
  background-color: #00cdc4;
}

/* Expanded top-level item
   Keeps Directory, Events, Inventory, etc.
   seafoam while one of its submenu pages is open */

.RadPanelBar .rpRootGroup > .rpItem > .rpLink.rpExpanded,
.RadPanelBar .rpRootGroup > .rpItem.rpExpanded > .rpLink,
.RadPanelBar .rpRootGroup > .rpItem > .rpHeaderTemplate.rpExpanded,
.RadPanelBar .rpRootGroup > .rpItem.rpExpanded > .rpHeaderTemplate {
  color: #ffffff;
  background-color: #00cdc4;
}

/* Selected top-level item
   Used for pages that do not have a submenu */

.RadPanelBar .rpRootGroup > .rpItem > .rpLink.rpSelected,
.RadPanelBar .rpRootGroup > .rpItem > .rpHeaderTemplate.rpSelected {
  color: #ffffff;
  background-color: #00cdc4;
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}

/* Disabled items */

.RadPanelBar .rpLink.rpDisabled,
.RadPanelBar .rpHeaderTemplate.rpDisabled {
  color: #c3c3c3;
  background-color: #00a4d3;
  border-color: #00a4d3;
  opacity: 0.5;
}

/* First root item */

.RadPanelBar .rpFirst .rpRootLink {
  border-width: 1px;
  padding-top: 0;
}

/* =========================
   MENU ICONS
   ========================= */

.RadPanelBar .rpImage {
  margin-top: 13px;
  margin-right: 10px;
  margin-left: 10px;
}

.RadPanelBar .rpOut {
  border-color: transparent;
}

/* =========================
   SUBMENU ITEMS
   ========================= */

.RadPanelBar .rpGroup .rpItem {
  padding: 0;
}

.RadPanelBar .rpGroup .rpItem .rpLink,
.RadPanelBar .rpGroup .rpItem .rpHeaderTemplate {
  border: 0;
  background: none;
  font-size: 12px;
  line-height: 2.7em;
  text-indent: 32px;
  box-shadow: none;
  color: #ffffff;
}

/* Submenu hover */

.RadPanelBar .rpGroup .rpItem .rpLink:hover,
.RadPanelBar .rpGroup .rpItem .rpHeaderTemplate:hover {
  color: #ffffff;
  background-color: #00cdc4;
}

/* Submenu focused state */

.RadPanelBar .rpGroup .rpItem .rpLink.rpFocused,
.RadPanelBar .rpGroup .rpItem .rpHeaderTemplate.rpFocused {
  color: #ffffff;
  background-color: #04b1cb;
}

/* Submenu selected/current page */

.RadPanelBar .rpGroup .rpItem .rpLink.rpSelected,
.RadPanelBar .rpGroup .rpItem .rpHeaderTemplate.rpSelected {
  color: #ffffff;
  background-color: #0082a7;
  font-weight: 600;
}

/* First submenu item */

.RadPanelBar .rpGroup .rpItem.rpFirst {
  padding: 0;
}

/* =========================
   EXPAND / COLLAPSE HANDLES
   ========================= */

.RadPanelBar .rpExpandable .rpExpandHandle {
  font-size: 1em;
}

.RadPanelBar .rpRootLink .rpExpandHandle {
  margin-top: 0.87719em;
}

.RadPanelBar .rpGroup .rpExpandHandle {
  margin: 0.57143em 0.07143em 0;
}

.RadPanelBar .rpDisabled .rpExpandHandle {
  opacity: 0.4;
  filter: alpha(opacity=40);
}