body {
  margin: 0;
  width: 100vw;
  height: 100svh;
  font-family: 'Open Sans', sans-serif; }

.row {
  margin-left: 0;
  margin-right: 0; }

.content {
  width: 100%;
  height: calc(100% - 60px);
  overflow: auto;
  padding-top: 86px; }

.navigation {
  width: 100%;
  height: 60px;
  background-color: #161616;
  border-top: 1px solid white; }

.floating-button {
  position: absolute;
  z-index: 10;
  bottom: calc(60px + 20px);
  right: 20px; }

header {
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%; }
  header .back {
    position: absolute;
    font-size: 15px;
    left: 25px;
    top: 22px;
    cursor: pointer; }

.exercises label.disabled {
  opacity: 0.5; }

.exercises .image {
  width: 50px;
  height: 50px;
  padding: 0; }
  .exercises .image img {
    width: 100%;
    height: 100%;
    object-fit: cover; }

.exercises p {
  margin: 0; }

.exercises span {
  font-size: 12px; }

.pointer {
  cursor: pointer; }

.trainings .image {
  width: 100%;
  height: 100px;
  padding: 0; }
  .trainings .image img {
    width: 100%;
    height: 100%;
    object-fit: cover; }

.trainings p {
  margin: 0; }

.trainings span {
  font-size: 12px; }

.trainings .training {
  position: relative;
  cursor: pointer; }
  .trainings .training .image::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #002024;
    background: linear-gradient(0deg, #002024 0%, rgba(0, 212, 255, 0) 60%);
    border-radius: var(--bs-border-radius-lg); }
  .trainings .training p {
    position: absolute;
    top: 85%;
    transform: translateY(-50%);
    text-transform: uppercase;
    width: 100%;
    text-align: center; }

.trainings.main .image {
  height: 150px; }

.navigation .link {
  position: relative; }
  .navigation .link::after {
    content: '';
    position: absolute;
    right: 0px;
    top: 15%;
    height: 70%;
    width: 1px;
    background-color: white; }
  .navigation .link.active {
    background-color: #00d4ff22; }

.set .main-image {
  position: relative;
  top: -25px;
  width: 100vw;
  height: 200px; }
  .set .main-image img {
    width: 100%;
    height: 100%;
    object-fit: cover; }

.set p {
  font-weight: lighter;
  font-style: italic; }

.set .weak {
  font-weight: lighter; }

.set .input-group {
  width: 33.33333333%; }

.set .reps-input:not(:first-of-type) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0; }

.set .reps-input:not(:last-of-type) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0; }

.set .menu-button {
  position: fixed;
  top: 22px;
  right: 25px;
  z-index: 2; }

.set .offcanvas {
  --bs-offcanvas-width: 300px; }
  .set .offcanvas .small-image {
    width: 100px;
    height: 100px; }
    .set .offcanvas .small-image img {
      width: 100%;
      height: 100%;
      object-fit: cover; }

.exercises-stats .image {
  width: 100%;
  height: 150px;
  padding: 0;
  position: relative; }
  .exercises-stats .image img {
    width: 100%;
    height: 100%;
    object-fit: cover; }

.exercises-stats p {
  margin: 0; }

.exercises-stats .exercise {
  position: relative;
  cursor: pointer; }
  .exercises-stats .exercise .image::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #002024;
    background: linear-gradient(0deg, #002024 0%, rgba(0, 212, 255, 0) 60%);
    border-radius: var(--bs-border-radius-lg); }
  .exercises-stats .exercise p {
    position: absolute;
    top: 85%;
    transform: translateY(-50%);
    width: 100%;
    text-align: center; }

.stats-main-image {
  position: relative;
  top: -25px;
  width: 100vw;
  height: 250px; }
  .stats-main-image img {
    width: 100%;
    height: 100%;
    object-fit: cover; }