.navbar-brand{
    animation: movedown 1s linear 1;
    animation-delay: 1s;
    visibility: hidden;
    animation-fill-mode: forwards;
}
@keyframes movedown{
    0%{
        transform: translateY(-100px);
        visibility: visible;
    }
    100%{
        transform:translateY(0);
        visibility: visible;
    }
}
.collapse{
    animation: moveleft 1s linear 1;
    animation-delay: 2s;
    visibility: hidden;
    animation-fill-mode: forwards;
}
@keyframes moveleft{
    0%{
        transform: translateX(100px);
        visibility: visible;
    }
    100%{
        transform:translateX(0);
        visibility: visible;
    }
}
.body{
    height: auto;
    width: 100%;
    background-image: url(wallpaper.jpg);
    background-position: center;
    background-size: cover;
    padding-left: 5%;
    padding-right: 5%;
    box-sizing: border-box;
    position: relative;
    overflow: hidden;
}


.content{
    color: white;
    text-align: left;
    animation: moveright 1s linear 1;
    animation-delay: 3s;
    visibility: hidden;
    animation-fill-mode: forwards;
}
@keyframes moveright{
    0%{
        transform: translateX(-100px);
        visibility: visible;
    }
    100%{
        transform:translateX(0);
        visibility: visible;
    }
}
.logo{
    animation: movedown 1s linear 1;
    animation-delay: 4s;
    visibility: hidden;
    animation-fill-mode: forwards;
}
.profile{
    animation: zoomin 1s linear 1;
    animation-delay: 5s;
    visibility: hidden;
    animation-fill-mode: forwards;
}
@keyframes zoomin{
    0%{
        transform: scale(0.5);
        visibility: visible;
    }
    100%{
        transform: scale(1);
        visibility: visible;
    }

}
.project{
    text-decoration: none;
    border-radius: 30px;
}