@import '~@blueprintjs/core/lib/scss/variables';
$sidebar-bg: #34424e;
.container{
  height: 100%;
}
.tabContainer {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  height: 100%;
}

.icon {
  height: 50px;
  width: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.selectedIcon {
  @extend .icon;
  background-color: #252f36;
}

.innerIcon {
  color: #738592;
}

.logo{
  background-color: $sidebar-bg;
  grid-area: logo;
  color: $white;
  font-stretch: ultra-condensed;
  font-family: $pt-font-family;
  text-align: center;
  font-size: $pt-font-size-large * 2;
}

a {
  @extend .innerIcon;
  color: #738592 !important;
  text-decoration: none;
}

.tabsGroup {

}

.bottomGroup{

}
.profilePicture{
  background-image: url('./Sarah-User.png');
  background-size: contain;
  //background-color: rgba(255, 223, 202, 0.082);
  //border: 3px dashed rgb(23, 69, 221);
  border-radius: 20px;
  border: 2px solid #137cbd;
  height: 38px;
  width: 38px;
  box-shadow: 0px 0px 1px 1px #2a3339;
  &:hover{
    box-shadow: 0px 0px 3px 3px #2a3339;
  }
  //grid-area: picture;
}