html{
  display: flex;
  align-items: center;
  justify-content: center;
  }
  
  .card, .sheet {
  margin:80px 25px;
  position:relative;
  height:auto;
  width:350px;
  top:30px;
  color:black;
  font-size:18px;
  display:flex;
  line-height:1.5rem;
  background:#7f9cce;
  border-radius:20px;  
  align-items:center;
  font-family:serif;
  box-shadow: 2px 10px 14px #ccc;
  }
  
  .card{
  height:auto;
  width:350px;
  margin:80px 35px;
  }
  
  p{
  margin:10px 20px;
  font-size:18px;
  color:#333;
  }
  
  b{ color:black;}
  
  i{ left:130px;
  position:relative;
  }
  
  
  .dp img {
  width:100px;
  height:100px;
  border-radius:50%;
  z-index:80;
  top:-80px;
  margin:18px -20px;
  position:absolute;
  border:solid 3px #fff;
  -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.3);
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.3);
  }
  
  /* text */
  .T{
  top:5px;
  left:2px;
  position:relative;
  padding:20px 20px;
  font-family:serif;
  }
  
  /* drop down list */
  .DL{
  width:350px;
  background: #fff;
  margin:50px 20px;
  box-shadow: 2px 10px 14px #ccc;
  }
  
  /* list header */
  .LH {
  color:darkblue;
  font-size:17px;
  line-height: 1.25rem;
  font-weight:400;
  position: relative;
  align-items:center;
  text-align:center;  
  border:2px solid #7f9cce;
  }
  
  .LH:hover {
  font-weight:bold;
  }
  
  summary {
  padding:15px;
  display: flex;
  align-items:center;
  text-align:center;
  }
  
  /* list content*/
  .LC{
  color:#333;
  font-size:16px;
  padding: ;
  height:0 ;
  overflow: hidden;
  }
  
  details[open] + .LC{
  padding: 1rem;
  height:auto;
  }
  
  li{ list-style: none;}
  
  ul li a {
  width: auto;
  height: 29px;
  display: block;
  padding:1px;
  text-decoration:none;
  text-align: center;
  font-family: Georgia,'Times New Roman',serif;
  color:#333;
  background: repeating-linear-gradient(#fff,#4fe992d0 100px);
  border-bottom:2px solid #eee;
  }
  
  a:hover {
  font-weight: bold;
  left:15px;
  width:auto;
  color:#333;
  padding:2px;
  position:relative;
  background:#95a7c8;
  border-radius:40px;
  border:2px solid #ccc;
  }
  
  progress {
  width:250px;
  height:20px;
  background:light green;
  }
  
  /* coding experience */
  .CE {
  padding:1px 10px;
  height:auto;
  width:270px;
  position: relative;
  color:#333;
  }
  
  h2{ 
  font-size:30px;
  color:darkblue;
  margin:30px 130px;
  position:absolute;
  text-shadow:1px 3px 5px #a5a0a0;
  }