body{
    background: #943ccf;
    background: linear-gradient(90deg,rgba(148, 60, 207, 1) 31%, rgba(253, 29, 29, 1) 56%, rgba(158, 123, 73, 1) 65%);
}
.container{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    height: 150vh;
}
.pfp{
    height: 200px;
    border-radius: 3rem;
}
.text{
    display: flex;
    justify-content: center;
}
p{
  width: 60%;
}
.skills{
    width: 70%;
    height: 30%;
    display: flex;
    justify-content: space-between;
}
.skill1, .skill2, .skill3{
    border: 2px solid black;
    background-color: rgb(41, 40, 41);
    width: 200px;
}
a{
    text-decoration: none;
    color: green;
}
.footer{
    font-size: 2.7rem;
    background: #22C1C3;
    background: linear-gradient(0deg, rgba(34, 193, 195, 1) 0%, rgba(253, 187, 45, 1) 100%);
    width: 100%;
    display: flex;
    justify-content: center;
}
a:hover{
    color: red;
}
a:active{
    color: orange;
}
a{
    color: blue;
    justify-content: flex-end;
    display: flex;
}
.text:hover{
    color: blue;
}
.text{
    color: pink;
}
h1:hover{
    color: darkmagenta;
}
h1{
    color: #FFFDB5;
    font-size: 18px;
}
h2:hover{
    color: yellow;
}
h2{
    color: #6FDCE3;
    font-size: 18px;
}
h3:hover{
    color: green;
}
h3{
    color: #5C88C4;
}
footer:hover{
    color: blanchedalmond;
}
footer{
    color: #5C2FC2;
}
@media only screen and (max-width: 500px) {
    .container{
        display: flex;
        flex-direction: column;
    }
    .skills{
        display: flex;
        flex-direction: column;
        height: 100%;
    }

    .skill{
        width: 100%;
    }
}
.header{
    background: #22C1C3;
    background: linear-gradient(0deg, rgba(34, 193, 195, 1) 0%, rgba(253, 187, 45, 1) 100%);
    display: flex;
    justify-content: space-around;
    width: 100%;
}