.nav-bar-holder {
  display: flex;
  margin: 10px 15px;
  align-items: flex-start;
}

@media only screen and (max-width: 750px) {
  .nav-bar-holder {
    margin-bottom: 5px;
    padding-bottom: 5px;
    border-bottom: solid #F56888 1px;
  }
}

.nav-bar-left {
  display: flex;
  flex: 1;
  align-items: center;
  visibility: hidden;
}

.logo {
  height: 30px;
}

.nav-bar-right {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: flex-end;
}

.dashboard-group {
  display: flex;
  align-items: center;
  gap: 5px;
}
.dashboard-group:hover {
  cursor: pointer;
}

.dashboard-icon {
  display: flex;
  flex-direction: column;
  gap: 2.5px;
}

.dashboard-row {
  display: flex;
  gap: 2.5px;
}

.dashboard-square {
  width: 7.5px;
  height: 7.5px;
  border: solid #F56888 1.5px;
  border-radius: 2.5px;
}

@media only screen and (max-width: 750px) {
  .dashboard-square {
    width: 5px;
    height: 5px;
    border-radius: 1.6px;
  }
}

.content-holder {
  display: flex;
  gap: 15px;
  margin: 10px 15px;
  height: calc(100vh - 115px);
  min-height: 600px;
}

.find-courses-holder {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 400px;
  height: 100%;
}

.find-courses-title2 {
  position: fixed;
  visibility: hidden;
  text-align: center;
}

.courses-holder {
  margin-top: 15px;
  padding: 0 10px;
  overflow-y: scroll;
}

.loading-courses {
  padding: 10px 25px;
  background: #2F3333;
  border-radius: 10px;
  color: white;
}

.course-card-view {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  margin-bottom: 10px;
  padding: 10px 25px;
  border: solid #F56888 1px;
  border-radius: 15px;
}

.course-title {
  margin-bottom: 5px;
}

.course-register-button {
  margin-top: 15px;
  padding: 7.5px 0;
}

.title-holder {
  display: flex;
  flex-direction: column;
  flex: 1;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.logo-large {
  width: 400px;
  margin-bottom: 25px;
}

.learn-more-button {
  padding: 10px 25px;
  margin-top: 15px;
}

.index-error-popup {
  position: fixed;
  padding: 10px;
  margin: 0 10px;
  max-width: 50vw;
  bottom: 10px;
  background: #2F3333;
  color: white;
  border-radius: 10px;
  opacity: 0;
}

.index-error-text {
  font-size: 17px;
}

@media only screen and (max-width: 750px) {
  .nav-bar-left {
    visibility: visible;
  }

  .content-holder {
    flex-direction: column-reverse;
    gap: 0;
  }

  .find-courses-holder {
    width: auto;
  }

  .find-courses-title1 {
    position: fixed;
    visibility: hidden;
  }

  .find-courses-title2 {
    position: relative;
    visibility: visible;
  }

  .title-holder {
    position: fixed;
    visibility: hidden;
  }

  .index-error-popup {
    max-width: none;
  }

  .index-error-text {
    font-size: 15px;
  }
}

.footer-holder {
  display: flex;
  align-items: center;
  gap: 25px;
  margin: 0 20px;
  margin-top: 15px;
  margin-bottom: 5px;
  height: 25px;
}