.userdatanavigation {
  min-width: 1100px;
  overflow-x: auto;
}
.userdatanavigation .community-icon {
  display: inline-block;
  vertical-align: top;
  padding-top: 0;
  width: 50px;
  height: 50px;
  margin-right: 10px;
}

.userdatanavigation .fixed {
  position: fixed;
  top: 57px;
  padding: 10px 0;
  background-color: white;
  z-index: 3;
  min-width: 1000px;
  max-height: 95px;
}

.userdatanavigation .community-icon>div, .userdatanavigation .portal-title {
  display: inline-block;
  letter-spacing: 1.2px;
  vertical-align: top;
  cursor: pointer;
}

.userdatanavigation .portal-title {
  font-family: 'Metropolis Bold';
  font-size: 26px;
  line-height: 50px;
}

.userdatanavigation .community-icon>div {
  width: 50px;
  border-radius: 50%;
  height: 50px;
  background-size: 50px;
  text-align: center;
  color: white;
  font-size: 24px;
  line-height: 2.2;
  background-color: #19A4FD;
}

.userdatanavigation .dataNavigationContainer, .userdatanavigation .navigationMessage {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  margin-top: 80px;
}

.userdatanavigation .navigationMessage {
  padding-left: 250px;
  justify-content: center;
  padding-top: 20px;
  font-family: 'Metropolis Bold';
  font-size: 24px;
  line-height: 1.25;
  letter-spacing: 3.6px;
  color: #333333;
  width: 60%;
  text-align: center;
  margin: 0 auto;
  margin-top: 60px;
}

.userdatanavigation .sidebarNavigation {
  height: calc(100vh - 164px);
  width: 250px;
  position: fixed;
  display: flex;
  flex-direction: column;
  border-radius: 45px;
  border: solid 1px #707070;
  align-items: center;
  top: 155px;
}

.userdatanavigation .userDataContainer {
  width: 100%;
  height: 100%;
  padding-left: 250px;
}

.userdatanavigation .overallSection, .userdatanavigation .temporalSection, .userDataContainer .spatialSection, .userDataContainer .kinemiaticSection, .userDataContainer .balanceSection {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}

.userdatanavigation .sectionTitle {
  font-family: 'Metropolis Bold';
  font-size: 24px;
  line-height: 1.25;
  letter-spacing: 3.6px;
  color: #333333;
}

.userdatanavigation .hLine {
  width: 100%;
  height: 1px;
  margin: 5px 0;
  background-color: #707070;
}

.userdatanavigation select {
  border: solid 0.5px #bbbdbf;
  border-radius: 10.1px;
  padding: 0 20px;
  height: 30px;
  font-family: 'Metropolis Light';
  font-size: 16px;
  font-weight: 300;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.2;
  letter-spacing: 2.16px;
  text-align: left;
  color: #333333;
  margin: auto 15px;
}

.userdatanavigation .selectAttrContainer {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-end;
}

.userdatanavigation .selectAttrContainer .downloadDataContainer {
  display: flex;
  margin-top: 5px;
  cursor: pointer;
}

.userdatanavigation .selectAttrContainer .downloadDataContainer.hide {
  display: none;
}

.userdatanavigation .selectAttrContainer .downloadDataContainer .downloadText {
  font-family: 'Metropolis Bold';
  font-size: 18px;
  line-height: 1.21;
  letter-spacing: 3.32px;
  color: #0eb5fe;
  text-transform: uppercase;
}

.userdatanavigation .selectAttrContainer .downloadDataContainer .downloadIcon {
  background-size: 14px;
  width: 14px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("https://d1gq9jzbezk7fw.cloudfront.net/p/en_US/gv/i/v2/navigation/download-icon-desktop@3x.png");
  margin: 0 10px;
}

.userdatanavigation .selectAttrContainer .rangeContainer {
  display: flex;
  align-items: center;
}

.userdatanavigation .selectAttrContainer .rangeContainer .rangedatepicker {
  display: flex;
}

.userdatanavigation .rangeContainer .title {
  font-family: 'Metropolis Bold';
  font-size: 20px;
  line-height: 1.21;
  letter-spacing: 4.32px;
  color: #333333;
  margin-right: 25px;
}

.userdatanavigation .selectAttrContainer .sessionNameContainer {
  font-family: 'Metropolis Bold';
  font-size: 18px;
  line-height: 1.2;
  letter-spacing: 2.16px;
  text-align: left;
  color: #333333;
}

.userdatanavigation .selectAttrContainer .labelsContainer .labelsforsessions {
  margin-top: 2px;
}

.userdatanavigation .selectAttrContainer .labelsContainer .labelsforsessions > div {
  padding: 1px 20px;
}