.parallax{
    position:absolute;
    top:0;
    left:50%;
    transform:translateX(-50%);
    /*transition:0.2s all ease-in-out;*/
    max-height:130%;
    min-width:100%;
    width:auto;
}

.title-container{
    width:100%;
    height:100%;
    align-items:center;
    justify-content:center;
    text-shadow: 0 0 4px black;
}

.header-title{
    font-size:60px;
    font-weight:bold;
}

.header-portrait{
    width:180px;
    height:180px;
    border-radius:50%;
    object-fit: cover;
    box-shadow: 0 0 4px black;
}

.custom-shape-divider-bottom-1669187360 {
    z-index:2;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    overflow: hidden;
    line-height: 0;
    transform: rotate(180deg);
}

.custom-shape-divider-bottom-1669187360 svg {
    position: relative;
    display: block;
    width: calc(118% + 1.3px);
    height: 73px;
}

.custom-shape-divider-bottom-1669187360 .shape-fill {
    fill: #FFFFFF;
}

.skewed {
    position: absolute;
    top: -60px;
    bottom: 0;
    right: 0;
    left: 0;
    width: 100%;
    background: #2c3e50;
    z-index: 0;
    transform: skewY(-3deg);
    transform-origin: top right;
}

.triangle {
    position: relative;
    background: #2c3e50;
    height: 50px;
}

.triangle::before {
    content: '';
    position: absolute;
    bottom: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 100px 100px 0 100px;
    border-color: #2c3e50 transparent transparent transparent;
    left: 50%;
    transform: translateX(-50%) translateY(100%);
}

.sns-thumbnail{
    border-radius:10px;
    overflow:hidden;
    width:50px;
    height:50px;
    padding:5px;
    background-color:white;
}

.zoom{
    transition:0.3s all ease;
}

.zoom:hover{
    transform:scale(1.1);
}

#top-container canvas{
    position:absolute;
    top:0;
    left:50%;
    transform:translateX(-50%);
    min-width:100%;
    height:100%;
    height:auto;
}

.projects .card-img-top{
    height: 250px;
    object-fit: cover;
}

.projects .project{
    box-shadow: 0 0 8px #4b4b4b;
    transition:0.3s all ease;
}

.projects .project:hover{
    transform:scale(1.05);
}

/*
.header-title::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:white;
    z-index:-1;
    opacity:0.3;
    backdrop-filter:blur(10px);
}
*/
@media only screen and (max-width: 780px) {
    .header-title{
        font-size:30px;
        font-weight:bold;
    }
}