* {
    /*border: 1px solid gray;*/
    border-radius: 0 1rem 0;
    /*color:black;*/
}
body{
    background: whitesmoke;
    /*width:100%;*/
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.header{
    display: flex;
    align-items: center;
    gap:1rem;
    padding:1rem 1rem;
    width: 80%;
    background-color: #8AAAE5;
}
.header div {
    color: white;
}
.pic {
    width: 15rem;
    height: 15rem;
    background-image: url(https://avatars.githubusercontent.com/u/93034695?s=400&u=50fd17ab45d1d3a097575a55b254f64b82ac7698&v=4);
    background-size: cover;
    border-radius: 50%;
    background-size:150%;
    background-position:center;
    background-repeat: no-repeat;
    padding: .5rem;
}
h2 {
    background-color: #8AAAE5;
    color: floralwhite;
    padding: 0 .5rem;
}
.main{
    width:70%;
}
.main>table,th,td{
    border: 1px solid gray;
}

.skill span{
    padding: 0rem .5rem;
    margin: .5rem;
    
    border: 1px double gray;
}
.footer a{
    padding: .5rem;
}
.main>table{
    display: block;
    width:100%;
}
.education th
{
    text-align:center;
    width: 5%;
}
.education td
{
    text-align:center;
    width: 5%;
}
li>table td{
    /*background: red;*/
    padding: 0 .5rem;
}
.footer div{
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
@media screen and (width <= 768px){
    * {
        margin: 0;
        padding: 0;
        /*overflow-x:hidden;*/
        border: none;
    }
    body {
        margin: 0 1rem;
        /*border: 1px solid blue;*/
        background: #FCEDDA;
        padding: 1rem 0;
        display:flex;
        align-items:center;
        justify-content:center;
        flex-direction: column;
    }
    section{
        display:flex;
        flex-direction: column;
        align-items:center;
    }
    .header {
        flex-direction: row;
        height: 10rem;
        background-color: #EE4E34;
        margin-bottom:.5rem;
        border:none;
    }
    .pic {
        height: 10rem;
        background-image: url(https://avatars.githubusercontent.com/u/93034695?s=400&u=50fd17ab45d1d3a097575a55b254f64b82ac7698&v=4);
        border-radius: 1rem 0;
        background-size: cover;
        background-position:center;
    }
    h2 {
        background-color: #EE4E34;
        color: floralwhite;
        padding: 0 .5rem;
        margin: .5rem 0;
        width:110%;
    }

    .main{
        /*border: 1px solid red;*/
        width: 90%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .project{
        width:100%;
    }
    table{
        border: 0;
        padding: 0;
        width: 80%;
    }
    .skill{
        display:flex;
        align-items:center;
        justify-content:center;
        flex-wrap:wrap;
    }
    .skill span{
        margin:.2rem;
    }

    .footer{
        width:80%;
    }
}