.scrolling-column {
    flex: 1;
    background-color: rgb(17, 23, 41);
    overflow-y: auto; 
    padding: 90px 0px 100px 0px;
    overflow: auto; /* for scrolling bar */
    scrollbar-width: none; /* For Firefox */
    -ms-overflow-style: none; /* For IE/Edge */

}
.scrolling-column::-webkit-scrollbar {
    width: 0; /* For Chrome and Safari */
}
.scrolling-item {
    color: rgb(143, 143, 149);
    height: 500px;
    margin-bottom: 20px;
    background-color: rgb(17, 23, 41);
    padding: 20px;
}

/* About Section */
.about-content {
    margin-bottom: 90px;
    padding: 20px;
    line-height: 1.625;
}
.about-keyword {
    color: rgb(227, 232, 239);
    font-weight: 400;
}
.about-keyword:hover {
    color: rgb(0, 255, 213) !important;
}

/* Experiences Section */
#experiences {
    margin: 50px 0;
}
.experience-content {
    margin: 20px 0;
    padding: 20px;
    display: flex;
    border-radius: 10px;
}
.experience-content:hover {
    background-color:rgba(104, 104, 122, 0.1);

}
.experience-content:hover > .description-content > h2 {
    color: rgb(0, 255, 213) !important;
}
#experiences:hover .experience-content:not(:hover) {
    opacity: 0.7;
}
/* Resume Section */
.resume-container {
    color: rgb(227, 232, 239);
    letter-spacing: 1px;
    font-weight: 320;
}
.resume-container > a:hover {
    border-bottom: 1px solid rgb(0, 255, 213);
    transition: 0.05s;

}
.arrow-icon {
    font-size: 20px;
}
.resume-container:hover > .arrow-icon {
    transform: translateX(50%);
    transition: 0.15s;
}

/* Projects Section */
#projects {
    margin: 50px 0;
}
.project-content {
    margin: 20px 0;
    padding: 20px;
    display: flex;
    border-radius: 10px;
}
.project-content:hover {
    background-color:rgba(104, 104, 122, 0.1);
}
.project-content:hover > .description-content > h2 {
    color: rgb(0, 255, 213) !important;
}
.project-content:hover > .image-container > img {
    border-color: rgba(226, 232, 240, 0.3) !important;
}
#projects:hover .project-content:not(:hover) {
    opacity: 0.7;
}
.keyword-label {
    display: inline-block;
    margin: 5px 7px 5px 0px;
    padding: 5px 10px; 
    border: none;
    border-radius: 15px; 
    background-color: rgba(93, 188, 172, 0.2);
    text-align: center;
    text-decoration: none;
    font-size: 12px;
    font-weight: 250;
    color: rgb(0, 255, 213);
}
.description-content > h2 {
    margin-bottom: 0px !important;
}
.description-content > h4 {
    margin-top: 4px !important;
}
.description-content > p {
    margin: 10px 0 !important;
    line-height: 1.5;
}

.keywords {
    display: flex;
    flex-wrap: wrap;

    margin: auto;
}
.date-container {
    text-transform: uppercase;
    position: static;
    min-width: 140px;
}
.date-content {
    font-weight: 500;
    font-size: 12px;
    color: rgb(92, 104, 127);
}

.image-container {
    min-width: 140px;
    max-width: 300px;
    padding-right: 25px;
}
.image-container img {
    max-width: 120px;
    height: auto;
    display: block;
    border-radius: 5px;
    border: 2px solid;
    border-color: rgba(226, 232, 240, 0.1);
  }