.site-link:hover {
    outline: 2px solid aqua;
    margin-left: 0rem;
}

.site-link {
    margin-left: 1.5rem;
    color: hwb(0 95% 5%);
    border-radius: 1rem;
    padding: 0.75rem;
    display: flex;
    font-weight: bolder;
}

.project-grid {
    display: flex;
    padding: 0.5rem;
    flex-wrap: wrap;
    border-radius: 1rem;
    justify-content: space-evenly;
}

.project-card {
    margin: 1rem;
    padding: 0.5rem;
    border-radius: 0.5rem;
    width: 30rem;
}

.project-card:hover {
    margin: 0.5rem;
    padding: 1rem;
}

.project-image { /* should maintain a 16x9 ratio */
    border-radius: 0.5rem;
    margin: 0.5rem;
    width: 29rem;
    height: 16.3125rem;
}

.project-details {
    border-radius: 1.5rem;
    padding: 0.5rem;
    padding-left: 0.75rem;
    margin: 0.5rem;
}

.project-title {
    font-weight: bolder;
    color: hsl(0, 0%, 97%);
}

.project-description {
    font-weight: none;
    height: 2.5rem;
    /* overflow-x:hidden;
    overflow-y: auto; */
    width: 100%;
    color: hsl(0, 0%, 90%);
    flex-wrap: pretty;
}

.project-tech {
    display: flex;
}

.project-language {
    width: 25%;
    margin-top: 0;

}

.project-technologies {
    width: 75%;
    margin-top: 0;

}

.sidenav {
    display: flex;
    height: 100%;
    position: fixed !important;
    overflow-y: auto;
    z-index: 1;
    margin: 0.25rem;
    margin-top: 1rem;
}

.account-link {
    width: 2rem;
    height: 1vw;
    margin-left: auto;
}

.account-link-parent {
    display: flex;
    width: 100%;
    justify-content: space-evenly;
}

html * {
    font-family: sans-serif;
}

.test {
    background-color: aquamarine;
    margin-bottom: auto;
    padding-bottom: 100%;
    color: black;
}

html {
    height: 100%;
}

body {
    display: flex;
    flex-direction: row;
    height: 98%;
}

/* Page content */
.main {
    width: 100%;
    color: white;
    margin-left: 0.5rem;
    overflow-y: scroll;
}

.profile-picture {
    width: 10rem;
    height: 10rem;
    border-radius: 1rem;
}

.user-card {
    width: 10rem;
}

.personal-details {
    display: flex;
    width: 100%;
    justify-content: space-between;
}

.my-name {
    font-weight: bolder;
}

.hover-border:hover {
    outline: 1px solid aqua;
}

a {
    text-decoration: none;
}

.ul {
    text-decoration: underline;
    font-weight: bold;

}

textarea { 
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
}

.bg-blue-1 {
    background-color: hsl(230, 38%, 12%);
}
.bg-blue-2 {
    background-color: hsl(230, 38%, 20%);
}
.bg-blue-3 {
    background-color: hsl(231, 37%, 28%);
}
.bg-blue-4 {
    background-color: hsl(232, 37%, 36%);
}
.bg-blue-5 {
    background-color: hsl(232, 37%, 44%);
}
.bg-blue-6 {
    background-color: hsl(232, 37%, 52%);
}

.text-1 {
    color: hsl(0, 0%, 95%);
}
.text-2 {
    color: hsl(0, 0%, 80%);
}
.text-3 {
    color: hsl(0, 0%, 70%);
}

.spaced {
    border-width: 0.1rem;
    border-radius: 0.75rem;
    padding: 1rem;
}

.language-table {
    padding: 1rem;
    border-radius: 1rem;
}
tr, th, td {
    outline: 1px solid rgb(255, 255, 255);

    padding: 1rem;
}

.project-page-container {
    display: flex;
}

.project-link {
    font-weight: bold;
    text-align: left;
    width: 100%;
    margin-left: 1rem;
}

a {
    color: limegreen;
}