profile.css

body{
    /* background-color: #20cd79; */
 


}


  


.cover{
 width: 100%;
    height: 500px;
    background:url('img/profilecover2.jpg')no-repeat;
    background-size: cover;
    display: grid;
    place-items:center;
    padding-top: 8rem; 
}
.profilebox{
    padding-top: 8rem;
   text-align: center;    
    width: 700px;
    height: 900px;
    margin: 20px auto ;
    
    background-color:white;
    /* box-shadow:0 .5rem 1rem rgba(0,0,0.1); */

    color:black;
    padding: 10px 20px 20px 20px;
    font-size: 20px;
    /* border-radius: 10px ; */
    

}
.info{
    /* font-family: 'Times New Roman', Times, serif; */
    
    text-align: left;
    padding: 10px;
}
.table-container{
    padding: 0 ;
    margin: 20px auto 10px;
    /* border: 1px solid ; */
    box-shadow: ;
    /* border-radius: 10px; */
}

.table{
    width: 100%;

    border-collapse:separate;
    border-spacing: 0px;
    


}
th{
    position:sticky;
    top:0px;
    background-color: #37db8c;


    
}
th,td{
    /* border: 1px solid #12121385; */

}
.table-wrapper{
    max-height: 130px;
    overflow-y: scroll;

}
.table thead tr th{
    font-size: 14px;
    font-weight: medium;
    letter-spacing: 0.35px;
    opacity: 1;
    padding: 12px;
    vertical-align: top;

} 


/* for phone */
@media (max-width: 767px) {
    .cover{
        width: auto;
        height:auto;
        background:url('profilecover1.jpg')no-repeat;
        background-size: cover;
        display: grid;
        place-items:center;
        padding-top: 8rem;
      }
      .cover img{
        width: 100%;
        height: auto;
      }
    .profilebox{
        width: 350px;
        font-size: 14px;
        height: 600px;

        
    }
    .table thead tr th{
        font-size: 14px;
        font-weight: medium;
        letter-spacing: 0.35px;
        opacity: 1;
        padding: 5px;
    }
}