/*Hero*/

#my-name {
      display: inline-block;
      white-space: nowrap;
      overflow: hidden;
      border-right: 3px solid #ECEFCA;       /* the “cursor” */
      padding-right: .1em;                 /* a bit of breathing room */
      animation: blink-caret 0.75s step-end infinite;
    }

    @keyframes blink-caret {
      50% { border-color: transparent; }
    }

.profile-image{
    border-radius: 50%;
    width:300px;
    height: 300px;
}

.btn-orange{
    background-color: orangered;
    color: white;
}
.btn-orange:hover{
    background-color: coral;
    color: white;
}

.gradient-hero {
  background: linear-gradient(300deg, #213448, #547792, #94B4C1);
  background-size: 180% 180%;
  animation: gradient-animation 18s ease infinite;
}

@keyframes gradient-animation {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

/*Professional Expereience*/
.prof-experience small{
    font-size: 1rem;
}

/*Education*/

.education{
  background-color: #94B4C1 !important;
}

.education h2{
  color: white;
}

/*Skills*/
.skills{
    background-color: #547792;
}

.skills h2{
    color: #213448;
    border-color: #213448 !important;
    text-decoration: underline;
}

.skill-icon {
  transition: background-color 0.35s;
}

.skill-icon:hover{
    background-color: #ECEFCA !important;
    border-color: gold !important;
}

/*About me*/


/*Contact*/





/*Footer*/

footer span{
  font-size: 0.7em;
}


/*Bootstrap custome css for Personal Projects*/

.feature-icon {
  width: 4rem;
  height: 4rem;
  border-radius: .75rem;
}

.icon-square {
  width: 3rem;
  height: 3rem;
  border-radius: .75rem;
}

.text-shadow-1 { text-shadow: 0 .125rem .25rem rgba(0, 0, 0, .25); }
.text-shadow-2 { text-shadow: 0 .25rem .5rem rgba(0, 0, 0, .25); }
.text-shadow-3 { text-shadow: 0 .5rem 1.5rem rgba(0, 0, 0, .25); }

.card-cover {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

.feature-icon-small {
  width: 3rem;
  height: 3rem;
}
