body{
    min-height: 100vh;
}
a{
    color: inherit;
    text-decoration: none;
}
.nav-container{
    max-width: 800px;
}
header{
    background-color: inherit;
    position: sticky;
    top: 0;
}
.fa-github, .fa-envelope{
    color: #ffffff;
}
.social-links{
    background-color: rgb(24, 24, 24);
    border-radius: 50%;
    width: fit-content;
    height: fit-content;
    padding: 5px;
    text-decoration: none;
    color: inherit;
    transition: 0.3s;
}
.social-links:hover{
    background-color: rgb(71, 185, 185);
}
.social-links-container{
    display: flex;
    justify-content: center;
    height: 20px;
    margin-bottom: 11px;
}

.profile-photo{
    min-width: 300px;
    width: 20vw;
}
.interest-point{
    width: 180px;
    transition: 0.3s;
}
.about-container{
    width: calc(20vw + 400px);
}
.command{
    color: hsl(0, 100%, 59%);
}

.can-hover:hover{
    background-color: rgb(0, 143, 150);
}

.variable{
    color: hsl(222, 100%, 65%);
}
.project-item{
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    margin: 10px;
}
.project-img{
    max-width: 15vw;
    min-width: 150px;
}
.projects-container{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    box-sizing: border-box;
}
.contact-title{
    margin: 0;
}
.contact-option{
    word-break: break-all;
}