.shdwbyhero {
    @apply shadow-sm shadow-customTeal;
}

.borderonhoverbyhero{
    @apply border border-transparent hover:border-solid hover:border-[1px] hover:border-customTeal
}

.svghtml {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
  }

.skillname div p{
    /* border: 1px solid #2399C4; */
    padding: 5px 7px;
    border-radius: 20px;
    background-color: rgba(128, 128, 128, 0.397)
    ;
}

.skillname div{
    display: flex;
    flex-direction: column;
    gap: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.skillname div p{
    background-color: transparent;
    border: 2px solid #2399C4;
}
.skillname div p:hover{
    background-color: #2399C4;
}

    /* Customize the width of the scrollbar */
    ::-webkit-scrollbar {
        height: 5px;
    }
    
    /* Customize the track (background) of the scrollbar */
    ::-webkit-scrollbar-track {
        background-color: #f1f1f1; /* Track color */
        border-radius: 10px; /* Optional: Make it rounded */
    }
    
    /* Customize the thumb (draggable part of the scrollbar) */
    ::-webkit-scrollbar-thumb {
        background-color: #888; /* Thumb color */
        border-radius: 10px; /* Optional: Make it rounded */
    }
    
    /* Change thumb color on hover */
    ::-webkit-scrollbar-thumb:hover {
        background-color: #2399C4; /* Thumb color on hover */
    }
    