@font-face {
  font-family: 'Strawford';
  src: url('/static/fonts/Strawford-Black.woff2') format('woff2'),
       url('/static/fonts/Strawford-Black.woff') format('woff'),
       url('/static/fonts/Strawford-Black.ttf') format('truetype');
  font-weight: 900;
  font-style: normal;
}

@font-face {
  font-family: 'Strawford';
  src: url('/static/fonts/Strawford-Bold.woff2') format('woff2'),
       url('/static/fonts/Strawford-Bold.woff') format('woff'),
       url('/static/fonts/Strawford-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: 'Strawford';
  src: url('/static/fonts/Strawford-Medium.woff2') format('woff2'),
       url('/static/fonts/Strawford-Medium.woff') format('woff'),
       url('/static/fonts/Strawford-Medium.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: 'Strawford';
  src: url('/static/fonts/Strawford-Regular.woff2') format('woff2'),
       url('/static/fonts/Strawford-Regular.woff') format('woff'),
       url('/static/fonts/Strawford-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Strawford';
  src: url('/static/fonts/Strawford-Light.woff2') format('woff2'),
       url('/static/fonts/Strawford-Light.woff') format('woff'),
       url('/static/fonts/Strawford-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
}

.login-child {
  position: absolute;
  top: 274px;
  left: 438px;
  border-radius: 20px;
  border: 3px solid #ccc;
  box-sizing: border-box;
  width: 1231px;
  height: 653px;
}
.login-item {
  position: absolute;
  top: 10px;
  left: 7px;
  box-shadow: 0px 4px 34px rgba(0, 0, 0, 0.05);
  border-radius: 39px;
  background-color: #fff;
  width: 320px;
  height: 1064px;
}
.kristy {
  position: absolute;
  top: 36px;
  left: 30px;
  font-weight: 500;
  color: #000;
}
.profile-page {
  align-self: stretch;
  position: relative;
  font-weight: 500;
}
.manage-profile {
  align-self: stretch;
  position: relative;
  font-weight: 500;
  color: #5b5b5b;
}
.profile-page-parent {
  width: 123px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 1px;
}
.frame-child {
  width: 23.4px;
  position: relative;
  height: 11.8px;
}
.frame-item {
  width: 23.4px;
  position: relative;
  height: 10.9px;
  margin-top: -1.5px;
}
.vector-parent {
  width: 23.5px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}
.lrnrx {
  position: relative;
}
.tm {
  position: relative;
  font-size: 1.91px;
  font-family: 'MCQ Global';
}
.lrnrx-parent {
  align-self: stretch;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: center;
}
.logo {
  width: 40px;
  height: 36.3px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 2.9px;
  font-size: 10.21px;
}
.frame-parent {
  width: 255px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
.login-inner {
  position: absolute;
  top: 985px;
  left: 28px;
  border-radius: 20px;
  background-color: #f7f7f7;
  width: 279px;
  height: 69px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 10px 11px;
  box-sizing: border-box;
  color: #000;
}
.basilcross-outline-icon {
  position: absolute;
  top: 33px;
  left: 262px;
  width: 27px;
  height: 27px;
  overflow: hidden;
}
.line-div {
  position: absolute;
  top: 483.5px;
  left: 26.5px;
  border-top: 1px solid #d5d5d5;
  box-sizing: border-box;
  width: 277px;
  height: 1px;
}
.settings {
  position: relative;
  font-weight: 500;
}
.magedots-icon {
  width: 24px;
  position: relative;
  height: 24px;
  overflow: hidden;
  flex-shrink: 0;
}
.settings-parent {
  position: absolute;
  top: 943px;
  left: 42px;
  width: 251px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  color: #b3b3b3;
}
.mdireport-box-outline-parent {
  position: absolute;
  top: 511px;
  left: 35px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
}
.mdireport-box-outline-group {
  position: absolute;
  top: 561px;
  left: 35px;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 9px;
}
.mdireport-box-outline-container {
  position: absolute;
  top: 605px;
  left: 35px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
}
.course-parent {
  width: 246px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
.home-parent {
  width: 246px;
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: space-between;
}
.frame-wrapper {
  align-self: stretch;
  border-radius: 70px;
  background-color: #eeefef;
  height: 41px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 7px 14px;
  box-sizing: border-box;
}
.templates-parent {
  width: 248px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
.history-parent {
  width: 248px;
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: space-between;
}
.integrations-parent {
  width: 245px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
.frame-group {
  position: absolute;
  top: 95px;
  left: 25px;
  width: 277px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 22px;
}
.vector-icon {
  width: 12px;
  position: relative;
  height: 12px;
}
.mdiuser-outline {
  border-radius: 52.5px;
  border: 0.8px solid #242424;
  overflow: hidden;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  padding: 7.5px;
}
.lsicondown-filled {
  width: 16px;
  position: relative;
  height: 16px;
  overflow: hidden;
  flex-shrink: 0;
}
.mdiuser-outline-parent {
  position: absolute;
  top: 33px;
  left: 919px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 14px;
  font-size: 16px;
}
.vector-icon1 {
  width: 16px;
  position: relative;
  height: 19px;
}
.vector-group {
  position: absolute;
  top: 25px;
  left: 1517px;
  border-radius: 40px;
  background-color: #fff;
  border: 1px solid #b7b7b7;
  box-sizing: border-box;
  width: 100px;
  height: 42px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-size: 16px;
}
.help-wrapper {
  position: absolute;
  top: 25px;
  left: 1631px;
  border-radius: 40px;
  background-color: #fff;
  border: 1px solid #b7b7b7;
  box-sizing: border-box;
  width: 76px;
  height: 42px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  font-size: 16px;
}
.hello-kristy {
  position: absolute;
  top: 115px;
  left: 442px;
  font-size: 41px;
  font-weight: 500;
  color: #000;
}
.overall-usage {
  position: absolute;
  top: 306px;
  left: 479px;
  font-size: 41px;
  font-weight: 500;
  color: #000;
}
.how-can-i {
  position: absolute;
  top: 158px;
  left: 442px;
  font-size: 41px;
  font-weight: 500;
  color: #b7b7b7;
}
.last-7-days {
  position: absolute;
  top: 355px;
  left: 484px;
  font-size: 14px;
  font-weight: 500;
  color: #b7b7b7;
}
.rectangle {
  position: absolute;
  top: 9px;
  left: 1.5px;
  width: 750px;
  height: 450px;
}
.x-axis-grid-icon {
  position: absolute;
  top: 9px;
  left: 92.25px;
  width: 0px;
  height: 354px;
}
.x-axis-grid-icon1 {
  position: absolute;
  top: 9px;
  left: 192.75px;
  width: 0px;
  height: 354px;
}
.x-axis-grid-icon2 {
  position: absolute;
  top: 9px;
  left: 294.75px;
  width: 0px;
  height: 354px;
}
.x-axis-grid-icon3 {
  position: absolute;
  top: 9px;
  left: 396.75px;
  width: 0px;
  height: 354px;
}
.x-axis-grid-icon4 {
  position: absolute;
  top: 9px;
  left: 497.25px;
  width: 0px;
  height: 354px;
}
.x-axis-grid-icon5 {
  position: absolute;
  top: 9px;
  left: 599.25px;
  width: 0px;
  height: 354px;
}
.x-axis-grid-icon6 {
  position: absolute;
  top: 9px;
  left: 699.75px;
  width: 0px;
  height: 354px;
}
.y-axis-grid-icon {
  position: absolute;
  top: 363.75px;
  left: 42px;
  width: 709.5px;
  height: 0px;
}
.y-axis-grid-icon1 {
  position: absolute;
  top: 293.25px;
  left: 42px;
  width: 709.5px;
  height: 0px;
}
.y-axis-grid-icon2 {
  position: absolute;
  top: 222.75px;
  left: 42px;
  width: 709.5px;
  height: 0px;
}
.y-axis-grid-icon3 {
  position: absolute;
  top: 150.75px;
  left: 42px;
  width: 709.5px;
  height: 0px;
}
.y-axis-grid-icon4 {
  position: absolute;
  top: 80.25px;
  left: 42px;
  width: 709.5px;
  height: 0px;
}
.y-axis-grid-icon5 {
  position: absolute;
  top: 9.75px;
  left: 42px;
  width: 709.5px;
  height: 0px;
}
.x-axis-icon {
  position: absolute;
  top: 363px;
  left: 42px;
  width: 709.5px;
  height: 0px;
}
.y-axis-icon {
  position: absolute;
  top: 9px;
  left: 42px;
  width: 0px;
  height: 354px;
}
.dec-24 {
  position: absolute;
  top: 375px;
  left: 61.18px;
}
.dec-241 {
  position: absolute;
  top: 375px;
  left: 161.04px;
}
.dec-242 {
  position: absolute;
  top: 375px;
  left: 263.89px;
}
.dec-243 {
  position: absolute;
  top: 375px;
  left: 365.25px;
}
.dec-244 {
  position: absolute;
  top: 375px;
  left: 466.61px;
}
.dec-245 {
  position: absolute;
  top: 375px;
  left: 566.46px;
}
.dec-246 {
  position: absolute;
  top: 375px;
  left: 669.32px;
}
.div {
  position: absolute;
  top: 354px;
  left: 18px;
  text-align: right;
}
.div1 {
  position: absolute;
  top: 283.5px;
  left: 3px;
  text-align: right;
}
.div2 {
  position: absolute;
  top: 213px;
  left: 0px;
  text-align: right;
}
.div3 {
  position: absolute;
  top: 141px;
  left: 1.5px;
  text-align: right;
}
.div4 {
  position: absolute;
  top: 70.5px;
  left: 0px;
  text-align: right;
}
.div5 {
  position: absolute;
  top: 0px;
  left: 1.5px;
  text-align: right;
}
.marker-icon {
  position: absolute;
  top: 430.5px;
  left: 345px;
  width: 18px;
  height: 18px;
}
.views {
  position: absolute;
  top: 429px;
  left: 369px;
  font-size: 18px;
  color: #343434;
  text-align: left;
}
.bar-icon {
  position: absolute;
  top: 66px;
  left: 57px;
  width: 69px;
  height: 297px;
}
.bar-icon1 {
  position: absolute;
  top: 118.5px;
  left: 157.5px;
  width: 69px;
  height: 244.5px;
}
.bar-icon2 {
  position: absolute;
  top: 48px;
  left: 259.5px;
  width: 69px;
  height: 315px;
}
.bar-icon3 {
  position: absolute;
  top: 130.5px;
  left: 361.5px;
  width: 67.5px;
  height: 232.5px;
}
.bar-icon4 {
  position: absolute;
  top: 121.5px;
  left: 462px;
  width: 69px;
  height: 241.5px;
}
.bar-icon5 {
  position: absolute;
  top: 192px;
  left: 564px;
  width: 69px;
  height: 171px;
}
.bar-icon6 {
  position: absolute;
  top: 160.5px;
  left: 664.5px;
  width: 69px;
  height: 202.5px;
}
.vertical-bar-chart {
  position: absolute;
  top: 424px;
  left: 495px;
  width: 751.5px;
  height: 459px;
  text-align: center;
  font-size: 15px;
  color: #3c3c3c;
}
.login {
  width: 100%;
  position: relative;
  background-color: #fff;
  height: 1117px;
  overflow: hidden;
  text-align: left;
  font-size: 18px;
  color: #242424;
  font-family: Strawford;
}