.homepage__img {
    width: 100px;
    height: 100px;
    border-radius:50px;
}
.homepage__link {
    background-color: white;
    font-size: 20px;
    border-radius: 10px;
    padding: 10px;
    display: block;
    text-align: center;
    margin-top: 30px;
    color: slateblue;
}

h2 {
    font-size: 18px;
}
.link-container {
    white-space: nowrap; /* Prevent line breaks */
}
.link-container a {
    display: inline-block; /* Display links as inline-block */
    margin-right: 10px; /* Add some space between links */
    color:blue;
    text-align: left;
    background-color: unset;
    font-size: unset;
    padding: unset;
}
.right-justified-login {
    position: absolute; /* Set image position to absolute */
    top: 40px; /* Position from top */
    right: 10px; /* Position from right */
    border-radius: 10px;
    margin: unset;
    background-color: goldenrod;
    padding: 10px;
    color: black;
    font-size: 15px;
}
.right-justified-profile {
    position: absolute; /* Set image position to absolute */
    top: 0px; /* Position from top */
    right: 10px; /* Position from right */
    border-radius: 10px;
    margin: unset;
    background-color: goldenrod;
    padding: 10px;
    color: black;
    font-size: 15px;
}

.homepage-top {
    position: relative; /* Ensure section is positioned relatively */
    white-space: nowrap;
}
.login-form {
    font-size: large;
}
.Container__login {
    display:flex;
    flex-direction: row;
    justify-content: center;
    margin: 0 0 20px 0;
    padding: 10px;
    background-color: rgba(255, 255, 255, 0.15);
    border: 1px solid black;
}
.Item1__login {
    background-color: rgb(249, 239, 227);
    color: black;
    padding: 0 0 20px 20px;
}
.error-message {
    color: bisque;
    font-weight: bold;
}
.linked-in a {
    display: flex; /* Use flexbox */
    align-items: center; /* Vertically center items */
    background-color: white;
    font-size: 14px;
    border-radius: 10px;
    width: 155px;
    border: solid 1px black;
    color: blue;
}

.linked-in a img {
    border-radius: unset;
    background-color: unset;
    height: 35px;
    width: 35px;
    padding-right: 10px;
}
.linked-in a span {
    text-align: left; /* Align text to the left */
}
.form-row {
    display: flex;
    justify-content: space-between; /* Ensure items are spaced evenly */
}

.form-group {
    margin-bottom: 10px;
    width: 48%; /* Adjust width to leave space for margins */
}

.form-group label {
    display: block;
}

.form-group input {
    width: calc(100% - 30px); /* Make input fields fill their container */
}
.form-button {
    font-size: 0.75em;
}
.form-data {
  color:#ffc107;
}
.password-input {
    position: relative;
}

.toggle-password {
    position: relative;
}

.toggle-password img {
    width: 20px; /* Adjust the width of the eye icon */
    height: auto; /* Maintain aspect ratio */
    position: absolute;
    top: 50%;
    left: -28px; /* Adjust the left position to move the eye icon within the input box */
    transform: translateY(-45%);
}
.item {
    font-size: 1em;
    flex: 0 0 100px;
}
.row-1 {
    width: 18%
}
.row-2 {
    display: unset;
    margin: 0 1% 0 20%;
}
.row-3 {
    margin: 10px 0 10px 20%;
    width: 18%;
}
.item-row {
    display: flex;
    justify-content: space-between;
    padding-bottom: 10px;
}
.register__button {
    font-size: 13.3333px;
    background-color: rgb(239,239,239);
    color: black;
    border-radius: 5px;
}
.Content__Box {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
    height: 400px;
    background-color: rgba(255, 255, 255, 0.15);
    border: 1px solid black;
  }
.Content__Box .item {
    flex: 0 1 300px;
    height: 150px;
    background-color:rgba(255,219,88,0.8);
    color: black;
    margin: 10px;
    text-align: center;
    padding: 10px;
    border: 1px solid black;
  }
.Content__Register__Box {
    background-color: rgba(255, 255, 255, 0.15);
    border: 1px solid black;
    padding-left: 30px;
    padding-bottom: 30px;
}
.container__edit_centered {
    display:flex;
    flex-direction: row;
    justify-content: center;
    margin: 0 0 20px 0;
    padding: 10px;
    background-color: rgba(255, 255, 255, 0.15);
    border: 1px solid black;
}
.item__editbox {
    display: flex;
    flex-direction: column;
    background-color: rgb(249, 239, 227);
    color: black;
    padding: 0 20px 20px 20px;
    form {
         display: inline-flex;
        flex-direction: column;
    }
    input {
        margin-bottom: 2px;
    }
}
.reset {
    width: 400px;
    .reset__button {
        background-color: slateblue;
        color: white;
        font-size: large;
    }
}

.beige_box {
    background-color: rgb(249, 239, 227);
    color: black;
    padding: 0 20px 20px 20px;
    /*
    form {
      display: block;
    }
    */
}
.profile__bi_container {  
    display: grid;
    min-width: 350px;
    grid-template-columns: 2fr 3fr;
    grid-template-rows: auto;
    gap: 5px 10px;
    grid-auto-flow: row;
    grid-template-areas:
        "bi_header bi_header"
        "bi_label1 bi_field1"
        "bi_label2 bi_field2"
        "bi_label3 bi_field3"
        "bi_label4 bi_field4"
        "bi_button1 .";
}
    
.bi_header { grid-area: bi_header; }

.bi_label1 { grid-area: bi_label1; }

.bi_field1 { grid-area: bi_field1; }

.bi_label2 { grid-area: bi_label2; }

.bi_field2 { grid-area: bi_field2; }

.bi_label3 { grid-area: bi_label3; }

.bi_field3 { grid-area: bi_field3; }

.bi_label4 { grid-area: bi_label4; }

.bi_field4 { grid-area: bi_field4; }

.bi_button1 { grid-area: bi_button1; }