body{background-color: rgb(240, 217, 184);}


.flex-container {
    display: flex;
    padding-bottom: 30px;
    font-weight: bold;
}

a{text-decoration: none;
    color: inherit;
}




.image1 {border-radius: 50%;
    padding: 10px;}

.flex-container > div:nth-child(1){
    height: 120px;
    width: 150px;
}

.flex-container > div:nth-child(2){
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    height: 120px;
    width: 120px;
    
    
}

.flex-container > div:nth-child(3){
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    height: 120px;
    width: 150px;
    
}

.flex-container > div:nth-child(4){
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    height: 120px;
    width: 110px;
    
}

.flex-container > div:nth-child(5){
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    opacity: 0;
    height: 120px;
    flex-grow: 1;
    width: auto;
}

.flex-container > div:nth-child(6){
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    height: 120px;
    width: 110px;
}









.wrapper {
    height: 10vh;
    /*This part is important for centering*/
    display: grid;
    place-items: center;
  }
  
.typing-demo {
    width: 28ch;
    animation: typing 2.5s steps(25), blink .9s step-end infinite alternate;
    white-space: nowrap;
    overflow: hidden;
    border-right: 3px solid;
    font-size: 2.0em;
    font-weight: 600;
  }
  
@keyframes typing {
    from {
      width: 0ch;
    }
    to {
      width: 25ch;
    }
  }
      
@keyframes blink {
    50% {
      border-color: transparent
    }
  }























.title{
    text-align: center;
    font-weight: bold;
    padding-top: 10px;
    padding-bottom: 5px;

}









.resume-container{
    display: flex;
    flex-direction: column;
    height: 50px;
    width: 700px;
    margin: 0 auto;
}

.resume-container > div:nth-child(1){
    display: flex;
    justify-items: center;
    flex-direction: column;
    height: 100px;
    width: 700px;
    padding-top: 10px;
    padding-bottom: 10px;
}
.resume-container > div:nth-child(2){
    display: flex;
    flex-direction: column;
    height: 100px;
    width: 700px;
    border-bottom: 1px solid blue;}

.resume-container > div:nth-child(3){
    display: flex;
    flex-direction: column;
    height: 100px;
    width: 700px;}    
.resume-container > div:nth-child(4){
    display: flex;
    flex-direction: column;
    height: 100px;
    width: 700px;
    border-bottom: 1px solid blue;}

.resume-container > div:nth-child(5){
    display: flex;
    flex-direction: column;
    height: 100px;
    width: 700px;}

.resume-container > div:nth-child(6){
    display: flex;
    flex-direction: column;
    height: 100px;
    width: 700px;
    border-bottom: 1px solid blue;}

.resume-container > div:nth-child(7){
    display: flex;
    flex-direction: column;
    height: 1000px;
    width: 700px;
    ;}

.resume-container > div:nth-child(8){
    display: flex;
    flex-direction: column;
    height: 1000px;
    width: 700px;
   }

.image-container img{
    width: 150px; /* Fixed width */
    height: 150px; /* Fixed height */
    padding: 10px;

}
.resume-container > div:nth-child(9){
    display: flex;
    flex-direction: row;
    height: 1000px;
    width: 700px;
    }

 .resume-container > div:nth-child(10)  {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100px; /* fixed invalid unit */
        width: 700px;
        border-bottom: 1px solid blue;
        text-align: center; /* optional, useful if you have inline content */
        font-weight: bold;
    }


.resume-container > div:nth-child(11){
    display: flex;
    flex-direction: row;
    height: 1000px;
    width: 700px;
    
    }
.resume-container > div:nth-child(11) table {
  width: 100%;
}

.resume-container > div:nth-child(11) tr {
  display: flex;
  flex-wrap: wrap; /* Allow wrapping */
  justify-content: space-between; /* Push items apart */
}

.resume-container > div:nth-child(11) td {
  padding: 8px;
  box-sizing: border-box;
}

.resume-container > div:nth-child(11) td.year {
  margin-left: auto; /* Push year to the far right */
}

.resume-container > div:nth-child(12){
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100px; /* fixed invalid unit */
    width: 700px;
    border-bottom: 1px solid blue;
    text-align: center; /* optional, useful if you have inline content */
    font-weight: bold;
}

.resume-container > div:nth-child(13){
    display: flex;
    flex-direction: row;
    height: 1000px;
    width: 700px;
   
    }

.resume-container > div:nth-child(14){
display: flex;
flex-direction: row;
height: 1000px;
width: 700px;

}

.resume-container > div:nth-child(15){
display: flex;
flex-direction: row;
height: 1000px;
width: 700px;

}

.resume-container > div:nth-child(16){
display: flex;
flex-direction: row;
height: 1000px;
width: 700px;

}

.resume-container > div:nth-child(17){
    display: flex;
    flex-direction: row;
    height: 1000px;
    width: 700px;
    
    }

.resume-container > div:nth-child(18){
    display: flex;
    flex-direction: row;
    height: 1000px;
    width: 700px;

    }

.resume-container > div:nth-child(19){
        display: flex;
        flex-direction: row;
        height: 1000px;
        width: 700px;
    
        }

.skill {
    font-weight: bold;
    padding: 2px
}