@import url("../../../assets/css/tya-theme-colors.css");

.page-template-page-loggboken #single-course-back-button {
  margin-top: 20px;
  display: block;
}

#load-spinner {
  display: none;
}

#create-user-error {
  margin: 16px 0 16px 0;
}

#create-user-error .wrong-input,
#create-user-error .no-change,
#create-user-error .error-phone,
#create-user-error .error-email,
#create-user-error .email-exists,
#create-user-error .success,
#create-user-error .avatar-success,
#create-user-error .avatar-error,
#create-user-error .avatar-removed,
#create-user-error .error,
#create-user-error .error-missing-fields {
  margin: 16px 16px 16px 16px;
  display: none;
}

.success i {
  color: #00a65c;
}

#save-week-evaluation-error .wrong-input,
#save-week-evaluation-error .error {
  margin: 16px 16px 16px 16px;
  display: none;
}

#sign-week-supervisor-error .wrong-input,
#sign-week-supervisor-error .error {
  margin: 16px 16px 16px 16px;
  display: none;
}

#sign-day-supervisor-error .wrong-input,
#sign-day-supervisor-error .error {
  margin: 16px 16px 16px 16px;
  display: none;
}

#create-week-error .wrong-input,
#create-week-error .error-startdate {
  margin: 16px 16px 16px 16px;
  display: none;
}

#create-day-error .wrong-input,
#create-day-error .error-startdate {
  margin: 16px 16px 16px 16px;
  display: none;
}

#sign-week-supervisor-error .wrong-input {
  margin: 16px 16px 16px 16px;
  display: none;
}

#sign-day-supervisor-error .wrong-input {
  margin: 16px 16px 16px 16px;
  display: none;
}

#send-logg-error .wrong-input,
#send-logg-error .error {
  margin: 16px 16px 16px 16px;
  display: none;
}

#log-pupil-error {
  display: none;
}

#create-user-error-dateorder .danger-message {
  margin-top: 20px;
}

.add-user-logg,
.set-user-info-logg-input,
.show-user-info-logg-input {
  padding: 25px;
  box-shadow: 0 7px 15px 0 rgba(0, 0, 0, 0.15);
}

.buttons-pupil-info-container {
  padding-bottom: 50px;
  display: flex;
  align-items: center;
  position: relative;
}

.buttons-pupil-info-right {
  position: absolute;
  right: 0;
}

.add-user-logg-input,
.show-user-info-logg-input {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.show-user-info-logg-input #teacher-edit-student {
  background: #f0f2f3 !important;
}

.show-user-info-logg-input .email-student-edit {
  top: -12px;
}

.show-user-info-logg-input .email-student-edit .input-label.input-has-value {
  top: -10px;
}

.add-user-logg-input .floatlabel-input {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 31%;
  -ms-flex: 0 0 31%;
  flex: 0 0 31%;
  max-width: 31%;
  margin-right: 2%;
}

.add-user-logg-input div {
  -webkit-flex-basis: 100%;
  -ms-flex-preferred-size: 100%;
  flex-basis: 100%;
}

.login .d-flex {
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
}

.set-user-info-logg {
  margin: 20px 0 50px 0;
}

.set-user-info-logg-head {
  display: flex;
  margin-bottom: 30px;
  align-items: center;
}

.set-user-info-logg-head h3,
.set-user-info-logg-head h6 {
  margin: 0;
}

.set-user-info-logg-input {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-flow: row;
  -ms-flex-flow: row;
  flex-flow: row;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.set-user-info-logg-input p {
  margin-bottom: 5px;
}

.set-user-info-logg-input input[type="text"],
.set-user-info-logg-input form input[type="text"],
.set-user-info-logg-input > div {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 31%;
  -ms-flex: 0 0 31%;
  flex: 0 0 31%;
  max-width: 31%;
  margin-right: 2%;
  padding: 17.5px;
}

.set-user-info-logg-input div {
  padding: 0;
}

.set-user-info-logg-input div label {
  color: #616161;
}

.set-user-info-logg-input div input[type="text"] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 100%;
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%;
  margin-right: 0;
}

.set-user-info-logg-input .information-message-info,
.set-user-info-logg-input > .create-user-error {
  flex: 0 0 100%;
  max-width: 100%;
}

.tya_btn.btn-rounded {
  border-radius: 50%;
  padding: 0;
  background-color: #dbe8d2;
  height: 100px;
  width: 100px;
  min-width: 100px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  margin-right: 25px;
  background-size: cover;
  background-position: center;
}

.tya_btn.btn-rounded:hover {
  background-color: #c1d7b1;
}

/* #profile-img-choosen{
   display: none;
} */

.profile-img--choosen.smal {
  height: 60px;
  width: 60px;
  min-width: 60px;
}

.profile-img--choosen {
  overflow: hidden;
}

.profile-img--choosen .overlay {
  opacity: 0;
  color: #404040;
  background-color: rgba(64, 64, 64, 0.5);
  overflow: hidden;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
}

#avatar-remove a {
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none !important;
}

#avatar-remove a:hover {
  background-color: transparent !important;
  text-decoration: none !important;
}

#avatar-remove .fa-times {
  margin-right: 0;
}

.profile-img--choosen:hover .overlay {
  opacity: 1;
  transition: all 0.2s ease;
  border-radius: 50%;
}

.background-knowledge-logg-inner th {
  font-weight: normal;
}

.background-knowledge-logg-inner th,
.background-knowledge-logg-inner td {
  text-align: left;
}

.background-knowledge-logg-inner th:first-child,
.background-knowledge-logg-inner td:first-child {
  text-align: left;
}

.background-knowledge-logg-inner table td,
.background-knowledge-logg-inner table th {
  padding: 5px;
}

.background-knowledge-logg-inner table tr:nth-child(even) {
  background-color: #f7f7f7;
}

.background-knowledge-logg-inner input[type="text"],
.background-knowledge-logg-inner input[type="number"],
.background-knowledge-logg-inner input[type="date"] {
  margin-bottom: 0;
  border: 2px solid #f0f2f3;
}

.information-message-info,
.error-message,
.success-message {
  background-color: #f7f7f7;
  display: none;
  flex-direction: row;
  margin-bottom: 30px;
}

.information-message-info i,
.error-message i,
.success-message i {
  background-color: #68a1d2;
  color: white;
  padding: 17px;
  display: flex;
  align-items: center;
}

.information-message-info.warning-message i {
  background-color: #dd9245;
}

.information-message-info.successful-action i {
  background-color: #314F38;
}

.information-message-info.danger-message i {
  background-color: #cb506a;
}

.information-message-info {
  background-color: none;
  margin-top: 15px;
}

.error-message i {
  background-color: #cb506a;
}

.success-message i {
  background-color: #90bd7f;
}

.information-message-info p,
.error-message p,
.success-message p {
  padding: 13px;
  margin: 0;
}

.background-knowledge-logg-inner input {
  margin: 0 !important;
}

.background-knowledge-logg-inner .input-text::placeholder {
  color: rgba(64, 64, 64, 0.7);
}

.background-knowledge-logg-inner .input-label.input-has-value + .input-text {
  padding: 15px 26px !important;
  color: #404040;
}

.menu-item.private > i {
  padding-right: 10px;
}

.menu-item.private {
  display: none;
}

#administrator .menu-item.private.administrator,
#pupil .menu-item.private.pupil,
#supervisor .menu-item.private.supervisor,
#teacher .menu-item.private.teacher {
  display: flex;
  align-items: center;
}

/* .teacher_save_changes {
  position: absolute;
} */

.teacher_print_btn {
  margin-left: 15px;
}

#print_background_info {
  padding: 13px;
}

.login-container {
  background-color: #fff;
  width: 80%;
  padding: 46px;
  -webkit-appearance: none;
  -moz-box-shadow: 5px 0 20px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 5px 0 20px rgb(0 0 0 / 20%);
  box-shadow: 5px 0 20px rgb(0 0 0 / 20%);
  text-align: center;
}

.login-container .tya-id-name {
  color: #314f38;
  font-size: 26px;
  font-family: "Lineto Circular Bold", sans-serif;
  display: flex;
  padding-bottom: 22px;
  justify-content: center;
}

.login-container .tya-id-icon i {
  color: #00a65c;
  padding-right: 10px;
  font-size: 26px;
}

.page-login-container {
  background-color: #fff;
  width: 48%;
  padding: 46px;
  -webkit-appearance: none;
  -moz-box-shadow: 5px 0 20px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 5px 0 20px rgb(0 0 0 / 20%);
  box-shadow: 5px 0 20px rgb(0 0 0 / 20%);
  text-align: center;
}

.page-login-container .tya-id-wrapper {
  color: #314f38;
  font-size: 26px;
  font-family: "Lineto Circular Bold", sans-serif;
  padding-bottom: 22px;
  justify-content: center;
}

.page-login-container .tya-id-header {
  font-size: 20px;
  margin-bottom: 10px;
}

.page-login-container .tya-id-ingress {
  font-size: 1rem;
}

@media screen and (max-width: 767px) {
  .page-login-container {
    width: 80%;
    margin: auto;
  }
}

@media screen and (max-width: 511px) {
  .page-login-container {
    width: 100%;
  }
}

/*--------------------------------------------------------------
# Log out
--------------------------------------------------------------*/

.user-info_container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding: 10px 0;
}

.user-info-body,
.page-links {
  flex: 0 0 50%;
  max-width: 50%;
}

.user-info-body {
  padding-right: 1%;
}

.user-info-profile {
  display: flex;
  align-items: center;
  margin-bottom: 30px;
}

.user-info-profile .name h3 {
  margin: 0;
}

.user-info-profile .class,
.user-info-profile .school {
  display: inline-block;
}

.user-info-profile .class {
  font-family: "Lineto Circular Bold", sans-serif;
  font-size: 18px;
}

.page-links ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.page-links ul li {
  border-bottom: 1px solid #dadfe2;
  margin-bottom: 20px;
}

.page-links ul li a {
  padding: 10px 0px;
  text-decoration: none;
  display: flex;
  line-height: 24px;
}

.page-links ul li a::before {
  font-size: 26px;
  content: "\f105";
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  padding-right: 5px;
  cursor: pointer;
}

.log-out-btn-container {
  padding-bottom: 50px;
}

.no-hover {
  pointer-events: none;
}

/*--------------------------------------------------------------
# Reset password
--------------------------------------------------------------*/

#reset-password {
  display: none;
  background-color: #ffffff;
  box-shadow: 0 7px 15px 0 rgba(0, 0, 0, 0.15);
  padding: 20px;
  margin-bottom: 10%;
}

#change-password {
  cursor: pointer;
  text-decoration: underline;
  margin-left: 30px;
  font-size: 16px;
  line-height: 24px;
}

#reset-password .information-message-info {
  margin: 1rem 0 0 0;
}

#reset-password input {
  height: 59px;
  width: 28%;
}

@media only screen and (max-width: 767px) {
  #reset-password input,
  #reset-password .tya_btn {
    width: 100%;
    margin-bottom: 20px;
  }
}

/*--------------------------------------------------------------
# Pupil log
--------------------------------------------------------------*/

.remove-day-btn {
  padding-left: 7px;
  color: #cb506a;
}

.pupil-log-section {
  display: flex;
}

.pupil-log-section-left {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 75%;
  flex: 0 0 75%;
  max-width: 75%;
  padding-right: 15px;
  margin-bottom: 40px;
}

.pupil-log-section-right {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 25%;
  flex: 0 0 25%;
  max-width: 25%;
  padding-left: 15px;
  margin-bottom: 40px;
}

.pupil-log-info-title {
  display: flex;
  align-items: center;
}

.pupil-log-info-title .far {
  margin-left: auto;
  padding: 10px;
  cursor: pointer;
  margin-bottom: 10px;
}

.pupil-log-info-title .fal:hover {
  background: #f0f2f3;
}

.pupil-log-info-title .fal::before {
  color: #00a65c;
}

.sign-teacher-container p.muted,
.pupil-log-section p {
  margin-bottom: 0;
}

.sign-teacher-container .supervisor-card,
.pupil-log-section-right .supervisor-card {
  padding: 25px;
  box-shadow: 0 7px 15px 0 rgba(0, 0, 0, 0.15);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  margin: 8px 0 25px 0;
}

.sign-teacher-container .supervisor-card-avatar,
.pupil-log-section-right .supervisor-card-avatar {
  display: block;
  width: 65px;
}

.avatar-tya-user-container {
  position: relative;
  height: 60px;
}

.avatar-tya-user-container .fa-badge-check {
  position: absolute;
  bottom: 0px;
  right: 22px;
}

.fa-badge-check {
  font-size: 20px;
  color: #00a65c;
}

.profile-img--choosen .fa-badge-check {
  right: -10px;
  position: absolute;
  bottom: 0;
}

#apply-approved-supervisor .fa-badge-check {
  margin-left: 10px;
}

.sign-teacher-container .profile-img--choosen.smal,
.pupil-log-section-right .profile-img--choosen.smal {
  height: 60px;
  width: 60px !important;
  min-width: 60px;
  position: absolute;
  top: 0;
  left: 0;
  overflow: initial;
  margin: 14px;
}

.sign-teacher-container .supervisor-card-inner h6,
.pupil-log-section-right .supervisor-card-inner h6 {
  margin: 0 0 0;
}

.sign-teacher-container .supervisor-card-inner p,
.pupil-log-section-right .supervisor-card-inner p {
  font-family: "Lineto Circular Bold", sans-serif;
  font-weight: normal !important;
  clear: both;
  font-size: 16px;
  color: #aeb4ba;
  margin-top: 0;
  margin-bottom: 10px;
}

.sign-teacher-container .supervisor-card-inner i,
.pupil-log-section-right .supervisor-card-inner i {
  font-size: 22px;
  color: #00a65c;
  padding-right: 12px;
}

.sign-teacher-container .supervisor-card-inner i:hover,
.pupil-log-section-right .supervisor-card-inner i:hover {
  color: #008f4f;
}

.sign-teacher-container h6,
.pupil-log-section-right h6 {
  margin: 0 0 24px;
}

.pupil-log-section-right .sign-supervisor-content .tooltip {
  width: 100%;
}

.pupil-log-section-right .tya_btn {
  white-space: normal;
  width: 100%;
}

.pupil-log-section-right .pupil-week-status,
.sign-supervisor-report .pupil-week-status {
  margin-top: 30px !important;
}

.filter-archive-form.filter-supervisor {
  margin-bottom: 1rem;
}

.filter-supervisor {
  margin-bottom: 20px;
}

.tya_btn_link {
  text-decoration: underline;
  cursor: pointer;
}

.show-week-dates {
  margin: -15px 0 15px 0;
  font-size: 14px;
}

@media screen and (max-width: 1024px) {
  .pupil-log-info-title .fal:hover {
    background: #fff;
  }
}

@media screen and (min-width: 1300px) {
  .pupil-log-section-right {
    -ms-flex: 0 0 30%;
    flex: 0 0 30%;
    max-width: 30%;
  }

  .pupil-log-section-left {
    -ms-flex: 0 0 70%;
    flex: 0 0 70%;
    max-width: 70%;
  }
}

/*--------------------------------------------------------------
# Pupil log - add week
--------------------------------------------------------------*/
.add-week-logg {
  margin: 40px 0;
  position: relative;
}

.add-week-logg-inner {
  display: flex;
  justify-content: space-between;
  border-top: 4px solid #dadfe2;
  border-bottom: 1px solid #f0f2f3;
}

.add-week-container {
  background: #fff;
  box-shadow: 4px 0 15px rgba(0, 0, 0, 0.15);
  width: 270px;
  padding: 15px;
  position: absolute;
  right: 0;
  top: 90%;
  display: none;
  z-index: 1;
}

.add-week-container input[type="text"],
.add-week-container input[type="date"],
.add-week-container input[type="week"] {
  margin-bottom: 12px;
}

.add-week-container input[type="date"],
#background-knowledge-table input[type="date"] {
  position: relative;
}

.add-week-container input[type="date"]::-webkit-calendar-picker-indicator,
#background-knowledge-table input::-webkit-calendar-picker-indicator {
  opacity: 0;
  width: 30px;
  text-align: right;
  padding: 0;
  margin: 0;
  z-index: 2;
}

.add-week-container input[type="date"]::after,
#background-knowledge-table input[type="date"]::after {
  font-family: "Font Awesome 6 Pro";
  content: "\f073";
  position: absolute;
  right: 26px;
}

input[type="date"]::-webkit-inner-spin-button,
input[type="date"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.add-week-container .input-text {
  color: rgba(64, 64, 64, 0.7);
  margin-bottom: 15px !important;
}

.add-week-container label.input-has-value + .input-text {
  color: #404040;
}

.add-week-container .tya_btn {
  width: 100%;
}

.add-week-container::before {
  content: " ";
  position: absolute;
  z-index: 9998;
  top: -11px;
  left: 66px;
  width: 22px;
  height: 0;
  border-left: 11px solid transparent;
  border-right: 11px solid transparent;
  border-bottom: 11px solid #ffffff;
}

.add-week-container .datepicker-wrapper {
  margin: 0;
}

.right-side-container {
  display: flex;
  align-items: center;
  box-shadow: -10px 0 10px -2px rgba(0, 0, 0, 0.15);
  position: relative;
  z-index: 1;
}

.add-week-logg-inner .week {
  padding: 6px 10px;
  white-space: nowrap;
}

.add-week-logg-inner #weeks-container {
  display: flex;
  overflow-x: auto;
  cursor: grab;
  margin: -4px 0 0;
  padding: 0;
  scrollbar-width: none;
  list-style: none;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}

.add-week-logg-inner #weeks-container:active {
  cursor: -webkit-grabbing;
  cursor: -moz-grabbing;
  cursor: -o-grabbing;
  cursor: grabbing;
  border-color: #aeb4ba;
}

.add-week-logg-inner #weeks-container.shadow-left.shadow-right {
  box-shadow: inset 30px 0px 25px -30px rgba(0, 0, 0, 0.15),
    inset -30px 0px 25px -30px rgba(0, 0, 0, 0.15);
}

.add-week-logg-inner #weeks-container.shadow-left {
  box-shadow: inset 30px 0px 25px -30px rgba(0, 0, 0, 0.15);
}

.add-week-logg-inner #weeks-container.shadow-right {
  box-shadow: inset -30px 0px 25px -30px rgba(0, 0, 0, 0.15);
}

.add-week-logg .bottom-container {
  display: none;
  justify-content: space-between;
  margin-top: 15px;
}

.add-week-logg .bottom-container .add-button {
  display: flex;
  font-weight: bold;
  cursor: pointer;
}

.add-week-logg .bottom-container .add-button p {
  text-decoration: underline;
}

.add-week-logg .bottom-container .add-button i {
  margin-top: 4px;
  margin-left: 4px;
}

@media screen and (max-width: 768px) {
  .add-week-logg-inner .right-side-container {
    display: none;
  }
  .add-week-logg .bottom-container {
    display: flex;
  }
  .add-week-container {
    left: 0;
    right: unset;
  }
}

#weeks-container li {
  padding: 12px 18px;
  border-top: 4px solid #dadfe2;
}

#weeks-container li.selected {
  border-top: 4px solid #008f4f;
}

#weeks-container .week:hover {
  text-decoration: none;
  background: #f0f2f3;
}

.add-week-logg-inner a {
  text-decoration: none;
}

.add-week-logg-inner .conclution {
  padding: 18px 20px;
  white-space: nowrap;
}

.add-week-logg-inner .conclution.selected {
  margin: -4px 0 0;
  border-top: 4px solid #008f4f;
}

.add-week-logg-inner .add-button {
  border-right: 1px solid #f0f2f3;
  border-left: 1px solid #f0f2f3;
  cursor: pointer;
  padding: 18px 20px;
  white-space: nowrap;
}

.add-week-logg-inner .add-button:hover {
  background: #f0f2f3;
}

.add-week-logg-inner .add-button.show {
  display: block;
}

.add-week-logg-inner .add-button.active i {
  transform: rotate(45deg);
}

/*--------------------------------------------------------------
# Pupil log - add days
--------------------------------------------------------------*/

#days-container > div {
  margin-bottom: 20px;
}

.day-header-field {
  background: #f0f2f3;
  padding: 22px 25px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
}

.day-header-field .far {
  margin-left: auto;
}

.day-header-field .day-title {
  font-family: "Lineto Circular Bold", sans-serif;
  margin-right: 30px;
}

.moments-header,
.added-moment {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
  padding-bottom: 11px;
  border-bottom: 1px solid #dadfe2;
}

.moments-header div {
  font-family: "Lineto Circular Bold", sans-serif;
}

.moments-header .header-moment,
.added-moment .moment-name {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 33.333333%;
  flex: 0 0 33.333333%;
  max-width: 33.333333%;
  padding-right: 15px;
}

.added-moment i {
  margin-left: auto;
  padding: 10px;
  cursor: pointer;
}

.added-moment i::before {
  color: #cb506a;
}

.added-moment i:hover {
  background: #f0f2f3;
}

.moments-header .header-time,
.added-moment .moment-time {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 16.666667%;
  flex: 0 0 16.666667%;
  max-width: 16.666667%;
  padding-right: 15px;
}

.added-moment p {
  margin: 0;
}

.moments-container {
  margin: 20px 24px;
}

.sigel-moment-container {
  display: flex;
  margin-bottom: 20px;
}

.sigel-moment-container .moment,
.sigel-moment-container .description {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 25%;
  flex: 0 0 25%;
  max-width: 25%;
}

.sigel-moment-container .time {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 16.666667%;
  flex: 0 0 16.666667%;
  max-width: 16.666667%;
}

.sigel-moment-container .fa-pen {
  margin-left: auto;
  margin-right: 18px;
}

.sigel-moment-container .fal::before {
  color: #00a65c;
}

.add-moment-container,
.add-moment-supervisor-container {
  display: flex;
  align-items: flex-start;
  flex-direction: row;
  padding: 20px;
  background: #f0f2f3;
  align-items: center;
}

.placeholder-color::placeholder {
  color: rgb(203, 80, 106) !important;
}

.filter-moment {
  margin-right: 20px;
}

.add-moment-container .add-moment-fields,
.add-moment-supervisor-container .add-moment-supervisor-fields {
  display: flex;
  width: 100%;
  align-items: center;
}

.add-moment-supervisor-fields {
  justify-content: space-between;
}

.add-moment-save-day-container {
  display: flex;
  align-items: center;
}

.add-moment-save-day-container p {
  margin-right: 5px;
}

.add-moment-save-day-container i {
  margin-right: 8px;
}

.add-moment-container .tya_btn {
  min-width: initial;
  width: 150px;
}

.add-moment-fields .floatlabel-input {
  margin-bottom: 0 !important;
  margin-right: 10px;
}

.add-moment-fields .add-moment-hours {
  -ms-flex: 0 0 25%;
  flex: 0 0 25%;
  max-width: 25%;
}

.add-moment-fields .floatlabel-input .input-text {
  padding: 18px 26px !important;
}

.add-moment-fields .filter-moment {
  margin-right: 10px;
  -ms-flex: 0 0 41.666667%;
  flex: 0 0 41.666667%;
  max-width: 41.666667%;
}

.add-moment-fields .filter-moment select {
  width: auto;
  float: none;
}

/*--------------------------------------------------------------
# Pupil log - add first day
--------------------------------------------------------------*/

.pupil-log-section-left h4 {
  margin-bottom: 25px;
}

.pupil-log-section-left.not-filled {
  border: 2px dashed #aeb4ba;
  background: #f0f2f3;
  text-align: center;
  padding: 40px;
  max-width: 100%;
}

.pupil-log-section-left.not-filled p {
  max-width: 500px;
  margin: 0 auto 30px;
}

/*--------------------------------------------------------------
# Pupil log - week evaluation
--------------------------------------------------------------*/
.week-evaluation-logg {
  margin: 40px 0;
}

.week-evaluation-container h4 {
  margin-bottom: 25px;
}

.week-evaluation-container.not-filled {
  border: 2px dashed #aeb4ba;
  background: #f0f2f3;
  text-align: center;
  padding: 40px;
}

.week-evaluation-container.not-filled p {
  max-width: 500px;
  margin: 0 auto 30px;
}

.week-evaluation-container-card {
  display: none;
  background: #fff;
  box-shadow: 0 7px 15px 0 rgba(0, 0, 0, 0.15);
  padding: 22px 24px;
}

.week-evaluation-container-card.filled {
  display: block;
}

.week-evaluation-fields {
  display: flex;
  margin-right: -15px;
  margin-left: -15px;
}

.week-evaluation-fields .floatlabel-input,
.week-evaluation-fields div {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
  max-width: 50%;
  padding-right: 15px;
  padding-left: 15px;
}

.week-evaluation-container-card p.muted {
  margin-bottom: 5px;
}

.week-evaluation-container-card .filter-archive-form .style-select {
  float: none;
  width: auto;
  max-width: 270px;
}

.supervisor-evaluation-container {
  border-top: 1px solid #aeb4ba;
  padding-top: 20px;
  margin-top: 30px;
}

.week-evaluation-form .tya_btn {
  margin-top: 30px;
}

.pupil-header-field,
.pupil-info,
.pupil-week {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 22px 25px;
}

.pupil-header-field {
  padding: 10px 25px;
}

.pupil-header-field .pupil-header-field-content {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.pupil-header-field .name-class {
  display: flex;
  width: 100%;
}

/*--------------------------------------------------------------
# Week container
--------------------------------------------------------------*/
.first-week-container {
  border: 2px dashed #aeb4ba;
  background: #f0f2f3;
  padding: 40px;
}

.week-creation-first-container {
  display: flex;
}

.week-creation-first-margin {
  margin-right: 20px !important;
}

input[type="firstweek"] {
  padding: 3px;
  width: 33%;
  border: 0;
  padding: 15px 26px;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}

.first-week-container .get-startdate,
.first-week-container .get-enddate {
  background: white !important;
  margin-bottom: 0 !important;
  padding: 18px 26px !important;
  cursor: pointer;
}

.wrapper-first-week {
  margin: 0 20px 0 0 !important;
}

@media only screen and (max-width: 768px) {
  .week-creation-first-container {
    flex-direction: column;
  }

  .week-creation-first-container input {
    margin-bottom: 12px;
    width: 100%;
  }

  .wrapper-first-week {
    margin: 0 0 12px 0 !important;
  }

  .first-week-container .datepicker-wrapper i {
    right: 4%;
  }

  .wrapper-first-week .clear-startdates i,
  .wrapper-first-week .clear-enddates i {
    right: 8%;
  }

  .wrapper-first-week .clear-startdates .clear-dates-button,
  .wrapper-first-week .clear-enddates .clear-dates-button {
    right: 7.5%;
  }
}

@media only screen and (max-width: 500px) {
  .first-week-container .datepicker-wrapper i {
    right: 8%;
  }

  .wrapper-first-week .clear-startdates i,
  .wrapper-first-week .clear-enddates i {
    right: 19%;
  }

  .wrapper-first-week .clear-startdates .clear-dates-button,
  .wrapper-first-week .clear-enddates .clear-dates-button {
    right: 16%;
  }
}

/*--------------------------------------------------------------
# Pupil-list-log
--------------------------------------------------------------*/
.pupil-list-logg {
  margin-bottom: 60px;
}

.pupil-list-container .pupil {
  margin-bottom: 15px;
}

.pupil-header-field,
.pupil-info,
.pupil-week {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 22px 25px;

  transition: all 0.2s ease-in;
  -webkit-transition: all 0.2s ease-in;
  -moz-transition: all 0.2s ease-in;
  -ms-transition: all 0.2s ease-in;
  -o-transition: all 0.2s ease-in;
}

.pupil-header-field {
  padding: 10px 25px;
}

.pupil-header-field {
  cursor: pointer;
}

.pupil-header-info {
  flex: 0 0 70%;
  max-width: 70%;
}

.pupil-header-sign {
  flex: 0 0 30%;
  max-width: 30%;
  margin-left: auto;
  margin-right: 20px;
}

.loggboken-collapser {
  background-color: #f0f2f3;
}

.pupil-info {
  background-color: transparent;
  padding: 35px 25px;
}

.pupil-weeks {
  margin-bottom: 45px;
}

.pupil-week:nth-child(odd) {
  background-color: #f0f2f3;
}

.pupil-week:last-child {
  border-bottom: #f0f2f3 1px solid;
}

.loggboken-collapser.expanded {
  background-color: #314f38;
  color: white !important;
  box-shadow: 0 7px 20px 0 rgba(0, 0, 0, 0.15);

  transition: all 0.2s ease-out;
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -ms-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
}

.pupil-name,
.pupil-class,
.pupil-week-name,
.pupil-week-dates,
.pupil-info-tel p,
.pupil-info-email p,
.pupil-sign p {
  padding: 0;
  margin: 0;
}

.pupil-class {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  max-width: 100%;
}

.pupil-expanded,
.loggboken-collapsed {
  display: none;
}

.pupil-info-links,
.pupil-header-info,
.pupil-week-info,
.pupil-week-status,
.pupil-sign {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.pupil-sign.d-none {
  display: none;
}

.pupil-week-info {
  -ms-flex: 0 0 41.666667%;
  flex: 0 0 41.666667%;
  max-width: 41.666667%;
}

.pupil-info-links {
  -ms-flex: 0 0 66.666666%;
  flex: 0 0 66.666666%;
  max-width: 66.666666%;
}

.pupil-info-tel {
  margin-right: 15px;
}

.pupil-week-status {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 41.666667%;
  flex: 0 0 41.666667%;
  max-width: 41.666667%;
}

.pupil-week-name {
  -ms-flex: 0 0 33.333333%;
  flex: 0 0 33.333333%;
  max-width: 33.333333%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-right: 3px;
}

.pupil-name {
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
  max-width: 50%;
  padding-right: 40px;
}

.pupil-week-status i {
  color: #dadfe2;
  font-size: 25px;
}

.pupil-week-status div i {
  padding-right: 11px;
  color: #aeb4ba;
  font-size: 23px;
}

.pupil-status,
.tutor-status,
.teacher-status {
  display: flex;
  align-items: center;
  padding: 0 15px;
}

.pupil-status {
  padding-left: 0;
}

.pupil-week-status small {
  line-height: 1.1;
}

.teacher-status {
  padding-right: 0;
}

.pupil-sign i {
  font-size: 25px;
  padding-right: 10px;
}

.pupil-sign.status-success i,
.pupil-status.status-success i,
.tutor-status.status-success i,
.teacher-status.status-success i {
  color: #00a65c;
}

.pupil-sign.status-info i {
  color: #68a1d2;
}

.pupil-sign.status-warning i {
  color: #dd9245;
}

.pupil-header-field.expanded .pupil-sign.status-success i,
.pupil-header-field.expanded .pupil-sign.status-info i,
.pupil-header-field.expanded .pupil-sign.status-warning i {
  color: white;
}

.pupil-week-link {
  margin-left: 10px;
}

/* Media queries Pupil list log */
@media only screen and (max-width: 1139px) {
  .pupil-info-tel {
    flex: auto;
    max-width: none;
    -ms-flex: auto;
  }
}

@media only screen and (max-width: 766px) {
  .pupil-info,
  .pupil-info-links,
  .pupil-week {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
  }

  .pupil-info-tel,
  .pupil-info-email {
    padding-bottom: 12px;
  }

  .pupil-week-status {
    margin: 12px 0;
  }

  .pupil-header-info {
    align-items: start;
    max-width: 100%;
    flex: 0 0 100%;
    align-items: center;
    padding: 10px 10px 10px 0;
  }

  .pupil-header-field .pupil-header-field-content {
    display: block;
  }

  .pupil-header-field .name-class {
    display: block;
  }

  .pupil-week-info {
    flex: auto;
    max-width: 100%;
    -ms-flex: auto;
  }

  .pupil-week-name {
    flex: auto;
    max-width: 30%;
    -ms-flex: auto;
  }

  .pupil-info-links,
  .pupil-info-tel {
    flex: auto;
    max-width: none;
    -ms-flex: auto;
  }

  .pupil-name {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    padding-right: 0;
  }

  .pupil-week-link {
    margin: 0;
  }

  .pupil-week-name {
    margin-right: 25px;
  }

  .pupil-info-links {
    margin-bottom: 20px;
  }
}

@media only screen and (max-width: 1200px) and (min-width: 767px) {
  .pupil-status,
  .tutor-status,
  .teacher-status {
    padding: 0;
  }

  .pupil-week-status i {
    padding: 0 8px;
  }

  .pupil-week-status div i {
    font-size: 17px;
    padding-right: 6px;
    padding-left: 0;
  }
}

@media only screen and (max-width: 415px) {
  .pupil-status,
  .tutor-status,
  .teacher-status {
    padding: 0 7px;
  }
}

@media only screen and (max-width: 375px) {
  .pupil-status,
  .tutor-status,
  .teacher-status {
    padding: 0;
  }

  .pupil-week-status i {
    padding: 0 8px;
  }

  .pupil-week-status div i {
    font-size: 17px;
    padding-right: 6px;
    padding-left: 0;
  }
}

@media only screen and (max-width: 353px) {
  .pupil-status,
  .tutor-status,
  .teacher-status {
    display: block;
  }

  .pupil-week-status div i {
    padding-right: 16px;
  }
}

.show-user-info-logg-head {
  display: flex;
  align-items: center;
  margin-bottom: 25px;
}

.show-user-info-logg-head div h6 {
  margin: 0;
}

.show-user-info-logg-input,
.information-message-info {
  margin-bottom: 25px;
}

.users-info,
.users-relation-info {
  display: flex;
  width: 100%;
}

.users-info {
  justify-content: flex-start;
  padding: 10px 0 25px 0;
  border-bottom: solid #f0f2f3 1px;
}

.users-relation-info {
  padding: 15px 0 20px 0;
}

.users-info > div {
  display: block;
  padding-right: 50px;
  flex-grow: 1;
}

.users-info .muted,
.users-info p {
  margin: 0;
}

.users-relation-info {
  justify-content: space-between;
  padding-right: 50px;
}

.users-relation-info p:not(.muted) {
  margin: 0;
}

.users-relation-info div .muted:not(small) {
  margin: 0;
}

.users-relation-info small {
  margin-bottom: 12px !important;
}

.users-relation-info div div {
  display: flex;
}

.users-relation-info div div div {
  display: flex;
  flex-direction: column;
  padding-right: 20px;
}

.supervisor-list-logg,
.pupil-list-logg {
  padding-top: 50px;
  margin-bottom: 40px;
}

.tya-user-header-info .popover .popover-box {
  margin-left: -130px;
  left: -300%;
  width: 350px;
}

.tya-user-header-info .popover .popover-box::after {
  left: 79%;
}

.tya-user-header-info .popover .popover-box.offset-top {
  bottom: unset;
}

.tya-user-header-info .popover .popover-box.offset-top::after {
  top: unset;
  transform: rotate(180deg);
  bottom: 99.8%;
}

.popoverisred {
  color: red;
}

.tya-user-header-info-content {
  display: flex;
  width: 100%;
}

.tya-user-header-info-content .name-class {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.tya-user-header-info {
  background: #f0f2f3;
  padding: 10px 25px;
  margin-bottom: 20px;
}

.tya-user-header-info .uneditable,
.tya-user-header-info .editable {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.tya-user-header-info .uneditable .tya-user-name,
.tya-user-header-info .uneditable .tya-user-class,
.tya-user-header-info .uneditable .edit {
  display: flex;
  flex-grow: 1;
  flex-basis: 0;
  margin-right: 20px;
}

.tya-user-header-info .uneditable .edit {
  margin-right: 0;
}

.tya-user-header-info .uneditable.disabled {
  opacity: 0.5;
  pointer-events: none;
  cursor: not-allowed;
}

.tya-user-header-info .uneditable.disabled i {
  color: #aeb4ba;
}

.tya-user-header-info .editable .edit button {
  border: 0;
  background: none;
  padding: 0;
  margin: 0;
}

.tya-user-header-info .editable .floatlabel-input {
  margin-right: 12px;
  margin-bottom: 0;
}

.tya-user-class,
.tya-user-name {
  margin: 0;
}

.tya-user-header-info .editable .edit {
  display: flex;
  flex-direction: row;
}

.tya-user-header-info .main-supervisor i {
  padding: 14px;
  width: 44px;
  cursor: pointer;
  color: #00a65c;
  margin-left: auto;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}

.tya-user-header-info .edit .fa-pencil {
  padding: 14px;
  width: 44px;
  cursor: pointer;
  color: #00a65c;
  margin-left: auto;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}

.tya-user-header-info .edit .fa-trash-alt {
  padding: 14px;
  cursor: pointer;
  color: #cb506a;
  margin-left: auto;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}

.tya-user-header-info .edit .popover:hover {
  background: #dadfe2;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}

#create-user-error-supervisor.editable {
  margin-top: 10px;
}

/*--------------------------------------------------------------
# search supervisor
--------------------------------------------------------------*/
.tya-user-search-header-info {
  padding: 0px;
  position: relative;
  display: flex;
}

.tya-user-search-header-info .add-supervisor-connection,
.tya-user-search-header-info .supervisor-add-supervisor-connection {
  position: absolute;
  right: 0;
  width: 70px;
  height: 100%;
  border-radius: 0;
  border: none;
  padding: 0;
  -webkit-appearance: none;
  font-size: 16px;
  color: #fff;
  background-color: #314F38;
  transition: background-color 0.3s;
}

.tya-user-search-header-info .search-info-container {
  padding: 0;
  display: flex;
  align-items: center;
  width: 90%;
  padding: 10px 0 10px 25px;
}

#show-searched-supervisors .name-class {
  display: flex;
  width: 100%;
}

.tya-user-search-header-info .search-info-container .tya-user-name,
.tya-user-search-header-info .search-info-container .tya-user-class {
  display: flex;
  flex-grow: 1;
  flex-basis: 0;
  margin-right: 20px;
}

.tya-user-search-header-info .add-supervisor-connection:hover,
.tya-user-search-header-info .supervisor-add-supervisor-connection:hover {
  text-decoration: none !important;
  background-color: #3D6145;
}

.search-existing-supervisor #search-field-supervisor,
.search-existing-supervisor #search-field-mainsupervisor {
  width: 100%;
  margin-bottom: 17px;
}

.search-existing-supervisor .search-user-logg-text,
.add-supervisor-container .add-user-logg-inner .add-user-logg-text {
  padding-right: 30%;
}

.search-existing-supervisor .text-link-container,
.add-supervisor-container .text-link-container {
  display: flex;
  position: relative;
}

.search-existing-supervisor #add-supervisor-link,
.add-supervisor-container #search-supervisor-link {
  position: absolute;
  right: 0;
  top: 0;
}

/*--------------------------------------------------------------
# Agree private modal
--------------------------------------------------------------*/

#agree-private-modal .private-text-container {
  border: solid 1px #aeb4ba;
  height: 300px;
  overflow-y: scroll;
  padding: 15px;
  margin-bottom: 30px;
}

#agree-private-modal .log-out-link {
  margin-left: 30px;
}

#agree-private-modal .agree-private {
  padding: 50px 50px 50px 50px;
}

/*--------------------------------------------------------------
# Approved supervisor modal
--------------------------------------------------------------*/

.approved-supervisor-inner {
  padding: 25px;
  box-shadow: 0 7px 15px 0 rgba(0, 0, 0, 0.15);
  display: flex;
  position: relative;
  margin: 20px 0 25px 0;
  width: 350px;
}

.approved-supervisor-container {
  padding: 0 0 30px 0;
}

.apply-approved-info {
  padding-bottom: 30px;
}

@media screen and (max-width: 764px) {
  .approved-supervisor-inner {
    padding: 25px;
    box-shadow: 0 7px 15px 0 rgba(0, 0, 0, 0.15);
    display: flex;
    position: relative;
    margin: 20px 0 25px 0;
    width: 100%;
  }
}

/*--------------------------------------------------------------
# Pupil delete modal and move modal
--------------------------------------------------------------*/
#remove-pupil-loggboken {
  padding-left: 20px;
}

.modal-container {
  transform: translateY(100%);
  transition: all 0.2s ease-in-out;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  visibility: visible;
  position: fixed;
  z-index: 100;
}

#close-modal-student-delete-link,
#close-modal-teacher-delete-link {
  padding-left: 20px;
}

.modal-container.active {
  transform: translateY(0%);
  transition: all 0.2s ease-in-out;
}

.tya-modal-large {
  max-height: 80%;
  background-color: #fff;
  position: relative;
  margin: 0 auto;
  z-index: 500;
  width: 764px;
  padding: 20px 50px 50px 50px;
  top: 50%;
  transform: translateY(-50%);
  overflow-y: auto;
}

.tya-modal-large .close-modal {
  position: absolute;
  top: 0;
  right: 0;
  padding: 20px;
}

.tya-modal-large .close-modal .fa-times {
  font-size: 35px;
  cursor: pointer;
}

.modal-background {
  visibility: hidden;
  transition: all 0.4s ease-in;
  overflow: hidden;
  display: block;
  position: fixed;
  z-index: 20;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0);
}

.modal-background.active {
  visibility: visible;
  transition: all 0.4s ease-out;
  background-color: rgba(0, 0, 0, 0.4);
}

.tya-modal-large .delete-ingress {
  width: 80%;
}

.modal-teacher-delete .extra-bottom-margin {
  margin-bottom: 80px;
}

.modal-students-delete .pupil-weeks-delete {
  margin-bottom: 45px;
}

.modal-students-delete .pupil-weeks-delete .pupil-week-delete {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 20px 0;
  transition: all 0.2s ease-in;
  -webkit-transition: all 0.2s ease-in;
  -moz-transition: all 0.2s ease-in;
  -ms-transition: all 0.2s ease-in;
  -o-transition: all 0.2s ease-in;
}

.modal-students-delete .pupil-weeks-delete .pupil-week-info-delete {
  -ms-flex: 0 0 40%;
  flex: 0 0 40%;
  max-width: 40%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-align: flex-start;
  -webkit-align-items: flex-start;
  -ms-flex-align: flex-start;
  align-items: flex-start;
  flex-direction: column;
  word-wrap: anywhere;
}

.modal-students-delete .pupil-weeks-delete .pupil-week-name-delete {
  margin: 0;
}

.modal-students-delete .pupil-weeks-delete .pupil-week-dates-delete {
  padding: 0;
  margin: 0;
}

.modal-students-delete .pupil-weeks-delete .pupil-week-status-delete {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 20%;
  flex: 0 0 20%;
  max-width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.modal-students-delete .pupil-weeks-delete .pupil-status-delete {
  padding-left: 0;
}

.modal-students-delete .pupil-weeks-delete .teacher-status-delete {
  padding-right: 0;
}

.modal-students-delete .pupil-weeks-delete .pupil-status-delete,
.modal-students-delete .pupil-weeks-delete .tutor-status-delete,
.modal-students-delete .pupil-weeks-delete .teacher-status-delete {
  display: flex;
  align-items: center;
  padding: 0 15px;
}

.modal-students-delete .pupil-week-status-delete i {
  color: #dadfe2;
  font-size: 25px;
}

.pupil-status-delete.status-success i,
.tutor-status-delete.status-success i,
.teacher-status-delete.status-success i {
  color: #00a65c;
}

.pupil-week-status-delete div i,
.tutor-week-status-delete div i,
.teacher-week-status-delete div i {
  padding-right: 11px;
}

body.modal-open {
  height: 100vh;
  overflow-y: hidden;
}

.load-teacher-container {
  padding: 25px;
  box-shadow: 0 7px 15px 0 rgba(0, 0, 0, 0.15);
}

.load-teacher-container input.search {
  width: 100%;
}

.move-current-student {
  padding: 25px;
  box-shadow: 0 7px 15px 0 rgba(0, 0, 0, 0.15);
}

.modal-students-move .fa-long-arrow-alt-down {
  color: #68a1d2;
  font-size: 40px;
  padding: 20px;
}

#show-searched-teachers .add-teacher-connection {
  min-width: 0;
  width: 66px;
}

#show-searched-teachers .tya-user-search-header-info .search-info-container {
  padding: 22px 25% 22px 25px;
}

.move-current-student {
  display: flex;
  align-items: center;
  width: fit-content;
  padding-right: 50px;
  max-width: 100%;
}

.move-current-student h5 {
  margin-top: 10px;
}

.change-teacher-connection {
  color: #68a1d2;
}

.change-teacher-connection i {
  padding-right: 10px;
}

.confirm-teacher-container .form-check {
  padding-top: 50px;
  padding-bottom: 30px;
}

span#confirm-move-student.disabled {
  pointer-events: none;
  opacity: 80%;
}

.close-modal-student-move {
  padding-left: 50px;
}

@media screen and (max-width: 764px) {
  .tya-modal-large,
  #agree-private-modal .agree-private {
    width: 95%;
    max-height: 95%;
    padding: 40px 20px 50px 20px;
  }

  .buttons-pupil-info-right {
    position: relative;
    margin-top: 20px;
  }

  .buttons-pupil-info-container {
    display: block;
  }

  .pupil-week-delete {
    overflow-x: scroll;
  }

  #show-searched-teachers .tya-user-search-header-info .search-info-container {
    padding: 22px 20px 22px 20px;
  }

  .move-current-student {
    width: 100%;
    overflow: hidden;
    padding: 20px;
  }

  .buttons-pupil-info-right #move-pupil-loggboken {
    margin-bottom: 20px;
  }

  #move-student-modal .tya_btn.btn-rounded {
    height: 70px;
    width: 70px;
    min-width: 70px;
    margin-right: 15px;
  }

  .tya-modal-large .delete-ingress {
    width: 100%;
  }
}

/*--------------------------------------------------------------
# Pupil - share week
--------------------------------------------------------------*/
.pupil-log-section-right .form-check {
  margin-bottom: 1rem;
}

.pupil-log-section-right .form-check p {
  line-height: 18px;
  margin: 5px 0 0;
}

/*--------------------------------------------------------------
# Teacher - view week log
--------------------------------------------------------------*/
#weeks-container i {
  margin: 0 5px 0 0;
  font-size: 18px;
  color: #aeb4ba;
}

/* #weeks-container i::before {
  content: "\f05a";
} */
#weeks-container i.status-success {
  color: #00a65c;
}

#weeks-container i.status-success::before {
  content: "\f058";
}

#weeks-container .week {
  /* display: -webkit-box;
  display: -ms-flexbox;
  display: flex; */
  display: block;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  max-width: 150px;
}

#weeks-container .week.selected {
  display: flex;
  max-width: 100%;
}

/*--------------------------------------------------------------
# Teacher - view diary / week-info-report
--------------------------------------------------------------*/
.week-info-report {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.week-info-container {
  -ms-flex: 0 0 75%;
  flex: 0 0 75%;
  max-width: 75%;
  padding-right: 15px;
}

.sign-supervisor-report,
.sign-teacher-report {
  -ms-flex: 0 0 25%;
  flex: 0 0 25%;
  max-width: 25%;
  padding-left: 15px;
}

.sign-teacher-report .pupil-week-status,
.pupil-log-section-right .pupil-week-status,
.sign-supervisor-report .pupil-week-status {
  -ms-flex: auto;
  flex: auto;
  max-width: none;
  margin: 0 0 40px;
}

.sign-teacher-report .pupil-status,
.sign-teacher-report .tutor-status,
.sign-teacher-report .teacher-status,
.pupil-log-section-right .pupil-status,
.pupil-log-section-right .tutor-status,
.pupil-log-section-right .teacher-status,
.sign-supervisor-report .pupil-status,
.sign-supervisor-report .tutor-status,
.sign-supervisor-report .teacher-status {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column !important;
  flex-direction: column !important;
  -ms-flex-align: start !important;
  align-items: flex-start !important;
}

.sign-teacher-report .pupil-week-status i,
.pupil-log-section-right .pupil-week-status i {
  margin-bottom: 5px;
}

.sign-teacher-report .tya_btn {
  width: 100%;
  margin-bottom: 30px;
}

.sign-teacher-report .hide {
  display: none;
}

.sign-teacher-report .sign-teacher-container #sign-week-teacher.disabled {
  pointer-events: none;
  cursor: not-allowed;
  opacity: 80%;
}

.week-info-report h4 {
  margin-bottom: 25px;
}

#print-week-teacher-supervisor.mobile {
  display: none;
}

#print-week-teacher-supervisor.desktop {
  margin-bottom: 30px;
}

.sign-teacher-container .edit-week-info {
  display: none;
}

/* Media queries Sign teacher report */
@media only screen and (max-width: 1139px) {
  #print-week-teacher-supervisor.desktop {
    display: none;
  }

  .print-conclutionm {
    display: none;
  }

  #print-week-teacher-supervisor.mobile {
    display: block;
    width: fit-content;
    margin: 30px 0;
  }

  .grid-container #print-to-be-a-supervisor.tya_secondary_btn {
    margin-bottom: 30px;
  }

  .week-info-container,
  .sign-teacher-report,
  .sign-supervisor-report {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    padding: 0;
  }

  .week-info-report {
    -ms-flex-direction: column !important;
    flex-direction: column !important;
  }
}

#diary-table {
  position: relative;
  margin: 0 0 3em;
}

#diary-table thead th {
  padding: 9px 10px;
  text-align: left;
  font-weight: normal;
  position: sticky;
  top: 0;
  background: #fff;
}

#diary-table tbody tr:nth-child(odd) {
  background-color: #f7f7f7;
}

#diary-table td {
  padding: 9px 10px;
}

#diary-table tbody th {
  text-align: left;
  font-weight: normal;
  font-family: "Lineto Circular Bold", sans-serif;
  white-space: nowrap;
  padding-right: 3px;
}

#diary-table tbody tr th:first-child {
  background-color: #fff;
}

#diary-table td.diary-hour {
  text-align: right;
}

.diary,
.supervisor-info,
.pupil-excperience {
  margin: 0 0 3em;
}

.supervisor-sign {
  margin: 0 0 3em;
}

.pupil-excperience-inner div,
.supervisor-info-inner div,
.supervisor-sign-inner div {
  width: 32%;
  float: left;
  margin-right: 2%;
}

.pupil-excperience-inner div:last-child,
.supervisor-info-inner div:last-child,
.supervisor-sign-inner div:last-child {
  margin-right: 0;
}

.pupil-excperience div p,
.supervisor-info div p,
.supervisor-sign div p {
  margin: 0;
}

.diary:after,
.pupil-excperience:after,
.supervisor-info:after,
.supervisor-sign:after {
  content: "";
  display: table;
  clear: both;
}

.sign-supervisor-report h6 {
  margin: 0 0 24px;
}

.sign-supervisor-report p {
  margin-bottom: 0;
}

.sign-supervisor-report .filter-archive-form .style-select {
  margin: 0;
  float: none;
  width: 100%;
}

.sign-supervisor-report .filter-archive-form {
  margin: 0 0 25px;
}

.sign-supervisor-report .tya_btn {
  /* width: 100%; */
  margin-top: 15px;
}

.sign-supervisor-container {
  position: sticky;
  position: -webkit-sticky;
  top: 0;
}

.sign-supervisor-report .hide {
  display: none;
}

/*--------------------------------------------------------------
# # Teacher - view diary / conclution page
--------------------------------------------------------------*/

.conclution-info-wrapper {
  display: flex;
}

.conclution-info-container {
  flex: 0 0 75%;
  max-width: 75%;
  padding-right: 15px;
}

.total-hours-recap {
  float: right;
}

.total-hours-recap.goal-not-reached {
  color: #cb506a;
  font-weight: bold;
}

.total-hours-recap.goal-reached {
  color: #00a65c;
  font-weight: bold;
}

#conclution-table {
  position: relative;
  margin: 0 0 3em;
}

#conclution-table thead th {
  padding: 9px 10px;
  text-align: left;
  font-weight: normal;
  position: sticky;
  top: 0;
  background: #fff;
}

#conclution-table tbody tr:nth-child(odd) {
  background-color: #f7f7f7;
}

#conclution-table td {
  padding: 9px 10px;
}

#conclution-table td.diary-hour {
  text-align: right;
}

.print-conclution {
  flex: 0 0 25%;
  max-width: 25%;
  padding-left: 15px;
}

.print-conclution button {
  float: right;
}

/*--------------------------------------------------------------
# Media Queries
--------------------------------------------------------------*/
@media only screen and (max-width: 1139px) {
  .conclution-info-container {
    flex: 0 0 100%;
    max-width: 100%;
  }

  #show-searched-supervisors .name-class {
    display: flex;
    width: 100%;
    flex-direction: column;
  }

  .tya-user-search-header-info .search-info-container {
    padding: 22px 20px 22px 20px;
    width: 80%;
    overflow-wrap: break-word;
    justify-content: flex-start;
    align-items: flex-start;
  }

  .tya-user-header-info .popover .popover-box::after {
    left: 93%;
  }

  .tya-user-header-info .popover .popover-box {
    margin-left: -174px;
    left: -300%;
    width: 350px;
  }

  .search-existing-supervisor #add-supervisor-link,
  .add-user-logg-inner #search-supervisor-link {
    left: 0;
    position: relative;
  }

  .search-existing-supervisor .text-link-container,
  .add-user-logg-inner .text-link-container {
    display: block;
    padding-bottom: 20px;
  }

  .tya-user-header-info .editable {
    flex-direction: column;
    margin-right: 25px;
  }

  .tya-user-header-info .editable .floatlabel-input {
    margin-right: 0;
  }

  .tya-user-header-info .uneditable {
    -webkit-box-orient: vertical;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  .tya-user-header-info .uneditable .tya-user-header-info-content {
    display: flex;
  }

  .tya-user-header-info-content .name-class {
    align-items: flex-start;
    flex-direction: column;
  }

  #show-searched-supervisors .tya-user-header-info {
    padding: 0;
  }

  .tya-user-header-info {
    padding: 20px 0 20px 25px;
  }

  .tya-user-header-info .edit .fa-pencil,
  .tya-user-header-info .edit .fa-trash-alt {
    padding: 12px;
  }

  .tya-user-header-info .uneditable .tya-user-name,
  .tya-user-header-info .uneditable .tya-user-class,
  .tya-user-header-info .uneditable .edit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -ms-flex-preferred-size: auto;
    flex-basis: auto;
  }

  .tya-user-header-info .editable .floatlabel-input {
    width: 100%;
    margin-bottom: 20px;
  }

  .add-moment-container,
  .add-moment-fields,
  .add-moment-supervisor-container,
  .add-moment-supervisor-fields {
    flex-direction: column;
  }

  .add-moment-fields .filter-moment,
  .add-moment-fields .floatlabel-input,
  .add-moment-supervisor-fields .select-form,
  .add-moment-supervisor-fields .add-moment-save-day-container {
    width: 100%;
    margin-right: 0;
    margin-bottom: 15px !important;
    -ms-flex: unset;
    flex: unset;
    max-width: none;
  }

  .add-moment-supervisor-fields .add-moment-save-day-container {
    justify-content: space-between;
  }

  .moments-header {
    display: none;
  }

  .added-moment {
    flex-direction: column;
    align-items: start;
    position: relative;
  }

  .moment-added {
    align-items: unset;
  }

  .added-moment .moment-name,
  .added-moment .moment-time,
  .added-moment .moment-comment {
    flex: none;
    -webkit-box-flex: unset;
    max-width: none;
    word-break: normal;
  }

  .added-moment i {
    position: absolute;
    right: 0;
    top: 0;
  }

  .add-moment-container .tya_btn {
    width: 100%;
  }

  .added-moment .moment-name::before {
    content: "Moment:";
    font-family: "Lineto Circular Bold", sans-serif;
    margin-right: 5px;
  }

  .added-moment .moment-time::before {
    content: "Tid:";
    font-family: "Lineto Circular Bold", sans-serif;
    margin-right: 5px;
  }

  .added-moment .moment-comment::before {
    content: "Beskrivning:";
    font-family: "Lineto Circular Bold", sans-serif;
    margin-right: 5px;
  }

  .pupil-log-section {
    display: initial;
  }

  .pupil-log-section-left,
  .pupil-log-section-right,
  .week-evaluation-logg {
    flex: auto;
    max-width: none;
    -ms-flex: auto;
    padding: 0;
    margin-bottom: 60px;
  }

  .pupil-log-section-right .tya_btn {
    width: 100%;
  }

  .sign-teacher-container .supervisor-card,
  .pupil-log-section-right .supervisor-card {
    display: inline-flex;
    min-width: 300px;
  }

  .pupil-log-info-title .far {
    margin-left: 10px;
  }

  .week-evaluation-fields {
    flex-direction: column;
  }

  .week-evaluation-fields .floatlabel-input,
  .week-evaluation-fields div {
    flex: unset;
    -webkit-box-flex: unset;
    max-width: none;
    -ms-flex: unset;
  }

  #week-grade-pupil {
    float: none;
    width: 100%;
  }

  .select-supervisor,
  .add-moment-container .add-moment-fields .moment-select,
  .sign-supervisor-content .supervisor-grade-preformance,
  .sign-supervisor-content .supervisor-grade-service,
  #week-grade-pupil {
    font-family: "Lineto Circular Medium", sans-serif;
    width: 100%;
    background-color: #314F38;
    border-radius: 0;
    padding: 16px 46px 16px 20px;
    font-size: 18px;
    border: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: background-color 0.3s;
    color: white;
  }
}

.information-message-info i {
  display: flex;
  align-self: stretch;
  min-height: 100%;
}

.information-message-info i::before {
  align-items: center;
}

@media only screen and (max-width: 768px) {
  .tya-user-header-info .uneditable .edit {
    margin-left: 75px;
  }

  .tya-user-header-info .uneditable,
  .tya-user-header-info .editable {
    flex-direction: column;
    align-items: flex-start;
  }

  .information-message-info {
    flex-direction: row !important;
    align-items: stretch;
    margin-top: 40px;
  }

  .information-message-info i {
    display: flex;
    align-self: stretch;
    min-height: 100%;
  }

  .information-message-info i::before {
    align-items: center;
  }

  .add-user-logg-input {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .add-user-logg-input .floatlabel-input {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    margin-bottom: 12px;
  }

  .set-user-info-logg-input input[type="text"],
  .set-user-info-logg-input form input[type="text"],
  .set-user-info-logg-input > div {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    margin-right: 0;
  }

  .startdate-row .input-label.input-has-value {
    display: none;
  }

  .enddate-row .input-label.input-has-value {
    display: none;
  }

  .background-knowledge-logg-inner table td {
    text-align: left;
    display: block;
    width: 100%;
    float: left;
  }

  #background-knowledge-table input::after {
    display: none;
  }

  #background-knowledge-table .enddate-row {
    margin-bottom: 14px;
  }

  .background-knowledge-logg-inner table td:first-child {
    width: 100%;
    margin-top: 14px;
  }

  .background-knowledge-logg-inner table td:first-child::before {
    content: "";
  }

  .background-knowledge-logg-inner table td:nth-child(even) {
    float: left;
  }

  .background-knowledge-logg-inner table tr {
    display: table;
    width: 100%;
  }

  .background-knowledge-logg-inner table td::before {
    position: relative;
    top: 0;
    display: block;
  }

  .background-knowledge-logg-inner table td:nth-child(2)::before {
    content: "Bocka av";
  }

  .background-knowledge-logg-inner table td:nth-child(3)::before {
    content: "Lärarens kommentar";
  }

  .background-knowledge-logg-inner th:not(:first-child) {
    display: none;
  }

  #background-knowledge-table input[type="date"] {
    z-index: 1;
  }

  .info-container,
  .login-container,
  .user-info-body,
  .page-links {
    flex: 0 0 auto;
    flex-basis: 100%;
    max-width: 100%;
    width: 100%;
  }

  /* iPad */
  @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
    .info-container,
    .login-container,
    .user-info-body,
    .page-links {
      max-width: 50%;
      padding-left: 25px;
    }
  }

  .login-container #wp-submit {
    width: 100%;
  }

  .custom-login-form .custom_error {
    margin-top: 50px;
  }

  .info-container,
  .user-info-body {
    padding-right: 0;
    margin-bottom: 20px;
  }

  .users-info,
  .users-relation-info {
    flex-direction: column;
  }

  .show-user-info-logg-input .email-student-edit {
    top: 0;
    margin-top: 20px;
  }

  .users-info div,
  .users-relation-info div {
    padding-bottom: 12px;
  }

  .tya-user-header-info .editable .floatlabel-input {
    width: 100%;
    margin-bottom: 20px;
  }

  .week-evaluation-container-card .filter-archive-form .style-select {
    max-width: none;
  }

  .pupil-excperience-inner div,
  .supervisor-info-inner div,
  .supervisor-sign-inner div {
    width: 100%;
    float: none;
    margin: 0 0 20px;
  }

  .supervisor-info,
  .pupil-excperience,
  .supervisor-sign {
    margin: 0 0 1em;
  }

  #diary-table {
    overflow: scroll;
    display: block;
  }

  #diary-table td::before {
    position: relative;
    top: inherit;
  }

  #diary-table td:nth-child(even) {
    float: none;
  }

  .pupil-header-sign {
    flex: initial;
    max-width: none;
    margin-left: auto;
    margin-right: 0px;
    padding: 8px 0 8px 0;
  }

  .week-evaluation-form .tya_btn {
    width: 100%;
  }

  .background-knowledge-table td:before {
    font-family: "Lineto Circular Book", sans-serif;
  }

  .sign-teacher-container .supervisor-card,
  .pupil-log-section-right .supervisor-card {
    display: flex;
    display: -webkit-box;
    display: -ms-flexbox;
  }
}

/*Klassen används på flera ställen*/
.hide {
  display: none !important;
}

/*--------------------------------------------------------------
# FAQ-sidan
--------------------------------------------------------------*/

.page-template-page-loggboken
  .layout-block.bg-color-white
  + .layout-block.bg-color-white
  .grid-container {
  border-top: none;
  padding-top: 0;
}

/*--------------------------------------------------------------
# Fix startsida
--------------------------------------------------------------*/

#loading {
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  position: fixed;
  display: none;
  z-index: 99;
}

.fa-circle-notch {
  margin-left: 10px;
  display: block;
  /* Fixes the icon wobbling */
}

.add_tya_btn .fa-circle-notch {
  margin-left: 0;
  display: block;
  /* Fixes the icon wobbling */
}

.error-color-text {
  color: red;
}

.custom_error {
  background-color: #68a1d2 !important;
  color: white !important;
  padding: 17px !important;
}

.background-knowledge-logg input[type="checkbox"] {
  position: initial;
}

@media only screen and (max-width: 768px) {
  .startdate-row {
    width: 25% !important;
    display: flex !important;
    flex-direction: column !important;
  }

  .enddate-row {
    width: 75% !important;
  }

  .enddate-row::before,
  .startdate-row::before {
    margin: 5px;
  }

  .background-knowledge-logg input[type="checkbox"] {
    margin-top: 0.75rem !important;
  }

  .get-data-definition {
    margin-bottom: 1rem;
  }
}

.saved-icon {
  margin-left: 10px;
}

.save-day-loggboken {
  display: flex;
  justify-content: center;
  align-items: center;
}

.no-margin {
  margin: 0 !important;
}

.sign-day {
  padding-right: 0 !important;
  text-align: right;
}

.supervisor-message {
  width: 100% !important;
  overflow: hidden;
}

.supervisor-message:disabled {
  pointer-events: none;
  cursor: not-allowed;
  opacity: 0.8;
}

.less_padding {
  padding: 16px 12px !important;
}
