* {
    padding: 0px;
    margin: 0px;
    box-sizing: border-box;
}
section {
    background-color: lightblue;
    padding: 60px;
    display: grid;
    grid-template-columns: repeat(4, 200px);
    grid-gap: 20px;
    place-content: center;
}
.box-1 {
    /* margin: 20px; */
    background-color: rgb(212, 75, 212);
    padding: 20px;
    border-radius: 15px;
    grid-column: 1/ 3;
}
.box-2 {
    /* margin: 20px; */
    background-color: rgb(83, 83, 105);
    padding: 20px;
    border-radius: 15px;
    
}
.box-3 {
    /* margin: 20px; */
    background-color: white;
    padding: 20px;
    border-radius: 15px;
    
}
.box-4 {
    /* margin: 20px; */
    background-color: rgba(75, 73, 64, 0.658);
    padding: 20px;
    border-radius: 15px;
    grid-column: 2 / 4 ;
}
.box-5 {
    /* margin: 20px auto; */
    background-color: white;
    padding: 20px;
    border-radius: 15px;
    grid-column: 4;
    grid-row: 1/ span 2;
}
.user-profile {
    /* width: 1000px; */
    display: flex;
    align-items: center;
    gap: 10px;
}
.dp {
    width: 40px;
    /* height: 60px; */
    border-radius: 35px;
    border: 2px solid rgb(136, 132, 132);
}
h3 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 15px;
}
.status {
    font-family: sans-serif;
    font-size: 13px;
}
.about-1 {
    font-family: sans-serif;
    font-size: 16px;
    margin: 10px auto;
    /* width: 85%; */
}
.experience-1 {
    
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    color: rgb(190, 188, 188);
}
.about-2 {
    font-family: sans-serif;
    font-size: 16px;
    margin: 10px auto;
    /* width: 85%; */
}
.experience-2 {
    
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    color: rgb(190, 188, 188);
}
.about-3 {
    font-family: sans-serif;
    font-size: 16px;
    margin: 10px auto;
    /* width: 85%; */
}
.experience-3 {
    
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    color: rgb(190, 188, 188);
}
.about-4 {
    font-family: sans-serif;
    font-size: 16px;
    margin: 10px auto;
    /* width: 85%; */
}
.experience-4 {
    
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    color: rgb(190, 188, 188);
}
.about-5 {
    font-family: sans-serif;
    font-size: 16px;
    margin-top: 10px;
    /* width: 85%; */
}
.experience-5 {
    
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    color: rgb(190, 188, 188);
    /* width: 95%; */
    margin-top: 30px;
}

@media screen and (max-width:480px) {
    section {
        background-color: lightblue;
        padding: 5px;
        display: block;
    }
    .box-1 {
        margin: 20px;
        background-color: rgb(212, 75, 212);
        padding: 20px;
        border-radius: 15px;
    }
    .box-2 {
        margin: 20px;
        background-color: rgb(83, 83, 105);
        padding: 20px;
        border-radius: 15px;
    }
    .box-3 {
        margin: 20px;
        background-color: white;
        padding: 20px;
        border-radius: 15px;
    }
    .box-4 {
        margin: 20px;
        background-color: rgba(75, 73, 64, 0.658);
        padding: 20px;
        border-radius: 15px;
    }
    .box-5 {
        margin: 20px;
        background-color: white;
        padding: 20px;
        border-radius: 15px;
    }
    .user-profile {
        /* width: 1000px; */
        display: flex;
        align-items: center;
        gap: 10px;
    }
    .dp {
        width: 40px;
        /* height: 60px; */
        border-radius: 35px;
        border: 2px solid rgb(136, 132, 132);
    }
    h3 {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 15px;
    }
    .status {
        font-family: sans-serif;
        font-size: 13px;
    }
    .about {
        font-family: sans-serif;
        font-size: 16px;
        margin: 10px auto;
    }
    .experience {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        color: rgb(190, 188, 188);
    }
}