.user-profile {
    padding-top: 30px;
}

td.views-field.views-field-nid {
    width: 25%;
}

.tiket-sitebar table > tbody > tr > td {
    border-color: #dee2e6;
    border-width: 1px 0px 0 0;
    border-style: solid;
}

.tiket-sitebar .table > :not(caption) > * > * {
    padding: 0rem 0.3rem;
    background-color: var(--bs-table-bg);
    border-bottom-width: 1px;
    -webkit-box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg);
    box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg);
}

.user-display .user-picture {
    border: 3px solid #9f9c9d;
    border-radius: 50%;
    padding: 3px;
    width: 220px;
    height: 220px;
    display: block;
    margin: auto;
    z-index: 2;
    position: relative;
}

.user-profile .user-picture.male{
	border: 3px solid #00adff;
}

.user-profile .user-picture.female{
	border: 3px solid #ff70b2;
}

.user-display .field--name-field-user-nickname {
    position: relative;
    z-index: 2;
    font-size: larger;
    font-weight: 900;
    color: #313131;
    margin-bottom: -6px;
}

.user-display .field--name-field-user-birthdate {
    position: relative;
    z-index: 2;
    font-size: medium;
    font-weight: 300;
    color: #313131;
    margin-bottom: 10px;
}

.user-display .user-picture img {
    border-radius: 50%;
    width:100%;
}

.user-display .user-pic {
    text-align: center;
}

.user-display .user-pic:after {
    content: '1';
    position: relative;
    z-index: 1;
    bottom: 0;
    width: 100%;
    height: 150px;
    margin: 0px;
    text-align: center;
    display: block;
    margin-top: -150px;
    border-radius: 5px 5px 0 0;
    border-bottom: 1px solid #a1dbfdd4;
    box-shadow: rgba(99, 99, 99, 0.2) 0px -1px 8px 0px;
    background-color: aliceblue;
}

.content-main-inner.user-profile.male .user-display .user-pic:after {
    background-color: aliceblue;
}

.content-main-inner.user-profile.female .user-display .user-pic:after {
    background-color: #ffdeed;
}

.user-display .field--name-usermail:before {
  content: "\f0e0"; /* Unicode for a user icon */
	font-family: "Font Awesome 5 Free";
  font-weight: 900;
  margin-right: 8px;
  color: #007be5;
  border: 1px solid #1074c9;
  width: 30px;
  height: 30px;
  display: inline-flex;
  padding: 0px 0px 0px 7px;
  border-radius: 50%;
}

.user-display .field--name-field-user-phone-number:before{
  content: "\f10b"; /* Unicode for a user icon */
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  margin-right: 8px;
  color: #007be5;
  border: 1px solid #1074c9;
  width: 30px;
  height: 30px;
  display: inline-flex;
  padding: 0px 0px 0px 9.5px;
  border-radius: 50%;
}

.user-display .field--name-field-user-office-phone:before{
  content: "\f879"; /* Unicode for a user icon */
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  margin-right: 8px;
  color: #007be5;
  border: 1px solid #1074c9;
  width: 30px;
  height: 30px;
  display: inline-flex;
  padding: 0px 0px 0px 7px;
  border-radius: 50%;
}

.user-display .user-contact {
    background-color: aliceblue;
    padding: 20px;
    margin-bottom: 30px;
    border-radius: 0 0 5px 5px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.user-display .field--name-usermail, .user-display .field--name-field-user-phone-number {
	margin-bottom:20px;
}

.user-display .field--name-field-user-name {
    font-size: xx-large;
    font-weight: 800;
    margin-top: 110px;
    color: #0c0d43;
}

.user-display .field--name-field-user-position {
    font-size: x-large;
    margin-top: -15px;
    color:black;
}

.user-display .field--name-field-user-organization {
    font-size: larger;
    margin-top: -10px;
    color: black;
    margin-bottom: 30px;
}


.user-display .field--name-field-user-website {
    margin-bottom: 30px;
}

.user-profile tr.Closed {
    background-color: #c2f7cd;
}

.user-profile tr.Open {
    background-color: #ffe0e3;
}