/* TODO: MOVE TO SEMANTIC CSS OVERRIDES/VARIABLES */

#rm-menu-dropdown i.dropdown.icon {
  margin-top: -25px;
  margin-right: 15px;
  color: #fff;
}

#rm-menu-dropdown div.menu {
  z-index: 20000;
}

#page-wrapper {
  height: 100%;
  position: relative;
}


@media screen and (min-width: 990px) {
  #page-content {
    margin: 0px 0px 60px 213px;
    min-height: 100%;
  }

  .breadcrumb-padding {
    padding-left: 0px;
  }
}
@media screen and (max-width: 990px) {
  #page-content {
    margin: 0px -10px 60px 0px;
    min-height: 100%;
  }

  .breadcrumb-padding {
    padding-left: 60px !important;
  }

  .hide-mobile {
    display: none !important;
  }
}


#page-view {
  max-width: 1200px;
  margin: -10px auto 0px;
}

#desktop-sidebar {
  z-index: 99;
  position:fixed; 
  top:0;
  left:0;
  width:213px;
  height:100%;
  background-color: #191e29;
}
#mobile-sidebar {
  z-index: 99;
  position:fixed;
  bottom:top;
  left:0;
  width:40px;
}

#content-switch-roadmap {
  padding-bottom:6px;
  padding-right:0px;
}

#content-account-menu {
  padding-bottom:6px;
  padding-left:0px;
  padding-right:0px;
  margin-top:4px;
  margin-bottom:20px;
}

.sidebar-dropdown-trigger img {
  margin-right:-12px !important;
}

.desktop-sidebar-menu-container {
	position: absolute !important; 
	left: 63px !important;
	height: 100% !important;
  margin-top: 0px !important;
  width: 150px !important;
  background-color: #30333e !important;
}
.desktop-sidebar-menu {
  width: 150px !important;
  background-color: #30333e !important;
  margin: 0px !important;
	padding: 4px !important;
}
.mobile-sidebar-menu {
  background-color: #30333e !important;
}
.switch-roadmap-dropdown {
  white-space: nowrap !important;
}
.switch-roadmap-dropddown > span  {
  white-space: nowrap !important;
  overflow: hidden;
}
.switch-roadmap-dropdown > span > a {
  max-width:200px !important;
  margin-top:0px !important;
  margin-bottom:-8px !important;
  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mobile-sidebar-background-close {
	position: absolute;
	left: 210;
	top: 0;
	background-color: rgba(255, 255, 255, .5);
	width: 100%;
	height: 100%;
	z-index: 99;
}

.hamburger-menu-toggle {
	width: 53px;
	height: 53px;
	line-height: 53px;
	font-size: 53px;
	color: white;
}

.hamburger-menu-border {
	border-right: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}

.sidebar-menu-title {
	padding: 2px !important; 
	margin: 10px 4px !important;
}
.sidebar-menu-title h4 {
	font-weight: normal;
}

.sidebar-menu-item {
	padding: 8px !important;
	margin: 0px 4px !important;
}
.sidebar-menu-item span {
	font-size: 13px;
}
.sidebar-menu-item i {
	color: #565D6B;
}
.sidebar-menu-item.active i {
	color: #ffffff;
}
.ui.basic.button.public-roadmap-button {
	margin-left: 8px !important;
	padding: 10px 16px 12px 16px !important;
  white-space: nowrap !important;
	color: white !important;
	font-size: 12px !important;
	font-weight: bold !important;
}
.ui.basic.button.public-roadmap-button:hover {
	color: #96f !important;
	background-color: transparent !important;
}
.ui.basic.button.public-roadmap-button:active {
	color: white !important;
	background-color: transparent !important;
}
.ui.basic.button.public-roadmap-button:focus {
	color: white !important;
	background-color: transparent !important;
}

.roadmap-list {
	position: absolute;
	height: 100%;
	padding: 0px 5px !important;
}

.roadmap-icon {
	width: 53px;
	height: 53px;
	line-height: 49px !important;
	margin: 10px 0px !important;
	padding: 5px 5px !important;
	vertical-align: middle !important;
	text-align: center;
	border-radius: 5px;
	opacity: 0.5;
}
.roadmap-icon.active {
	opacity: 1;
	background-color: #30333e;
}
.roadmap-icon img {
	position: relative;
	top: -5px;
}

.add-roadmap-button-container {
	width: 53px;
	height: 53px;
	line-height: 53px !important;
	padding: 7px !important;
	vertical-align: center !important;
	text-align: center;
}

.ui.basic.inverted.button.add-roadmap-button {
  color: white !important;
	box-shadow: none !important;
	margin: 0px !important;
	position: relative;
	top: -12px;
}
.ui.basic.inverted.button.add-roadmap-button:hover {
  color: #96f !important;
}