#avatar_container {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  margin-top: 5vh;
}

#user_image_container {
  border-radius: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: min(12vw,200px);
  height: min(12vw,200px);
  border: calc(3*var(--border-width)) solid white;
  background-color: transparent;
  box-shadow:
  0 2.8px 2.2px rgba(0, 0, 0, 0.034),
  0 6.7px 5.3px rgba(0, 0, 0, 0.048),
  0 12.5px 10px rgba(0, 0, 0, 0.06),
  0 22.3px 17.9px rgba(0, 0, 0, 0.072),
  0 41.8px 33.4px rgba(0, 0, 0, 0.086),
  0 100px 80px rgba(0, 0, 0, 0.12)
  !important;
  overflow: hidden;
  margin-bottom: 4vh;
  padding: 0rem;

}

#user_image_container:hover {
  background-color: var(--purple-light);
  border: calc(5*var(--border-width)) solid var(--purple-light);
}

#user_image_container > Img {
  width: min(12vw,200px);
  height: min(8vh,200px);

  width: auto;
  /* height: auto; */
}


.info_container {
  display: flex;
  flex-direction: row;
  align-items: center !important;
  justify-content: center !important;
  width: max(600px, 30vw) !important;
  margin-bottom: 1vh;
  background-color: inherit;
  height: var(--button-height-large);
  background-color: inherit;
}


.info_container > Input {
  width: max(400px, 30vw);
  margin-bottom: 0vw;
  margin-right: 0.3vw;
}

#change_role {
  background-color: transparent !important;
}
#change_password_button_profile_popover {
  text-align: center;
}
.info_title {
  font-weight: bold;
  margin-right: 1vw;
  width: 8vw;
}

#fields_container {
  display: flex;
  flex-direction: column;
  width: 100%;

  align-items: center;
  height: 80vh; 
}


#delete_notice_container_container {
  width: clamp(150px, 10vw, 400px);
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  color: white;

  background-color: transparent;

  padding-top:0.5vh;
  padding-bottom:1vh;
  min-height: var(--button-height) !important;
  max-height: var(--button-height) !important;
  margin-bottom: 1vw;
  margin-top: 3vh;


  
}
#delete_notice_container {
  border: none;
  height: calc(1.3*var(--button-height)) !important;
  border: var(--border-width) solid var(--red);
  border-radius: var(--border-radius);
  width: 100%;
  color: white !important;
}

#delete_notice_container {
  background-color: var(--red) !important;
}

#delete_notice_container:hover {
  background-color: var(--red-hover) !important;
}

.row_modal {
  width: 100%;
}

#deletion_string_force {
  font-weight: bold !important;
}

#info_rows_profile {
  background-color: var(--auth-background) !important;
  border-radius: var(--border-radius);
  padding: 1vw;

}


.profile_page {
  height: 90vh !important;
  overflow: scroll !important;
}

#change_password_button_profile, #change_email, #change_mfa_button_profile {
  background-color: transparent !important;
}

#change_password_button_profile:hover, #change_mfa_button_profile:hover {
  border: calc(2*var(--border-width)) solid var(--purple-dark);
}


#mfa_qr_code_container_profile {
  padding-top: 1vh;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 100%;
}

#mfa_qr_code_container_profile Img {
  width: 15vw !important;
  height: 15vw !important;
}


#feedback_mfa_setup_row_profile, #feedback_profile_verify_totp {

  background-color: inherit;
  margin-top: 2vh;
  text-align: center;
}


#mfa_profile_verify_header {
  font-size: var(--font-size-header);
  font-weight: bold;
  text-align: center;
  display: flex;
  flex-direction: row;
}

#modalbody_verify_mfa_profile_contents {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  width: 100% !important;
}

#feedback_account_delete_mfa, #feedback_account_delete {
  text-align: center;
}