.hero{
    background-color: #000000;
    background-image: url("/img/hero1.jpg");
    background-size: cover;
    background-position: center 30%;

    height: 50%;
    padding-left: 10vw;
    color: #ffffff;
}

.overlay {
    background: rgba(0, 0, 0, 0.5); /* Dark overlay */
    z-index: 1;
    max-width:fit-content;
}


.hero-project{
    background-color: #000000;
}

.posts-theme{
    background-color: #ff6161 !important;
    color: #ABF03C !important;
}

.custom-border{
    border-width: 5px !important;
    border-color: #abf03cad !important;
    border-style: solid !important;
}

.bw-text{
    background-color: #000000 !important;
    color: #ABF03C !important;
}

.green-text{
    color: #ABF03C;
}

.main-text{
    color: #ffffff !important;
}

.tilt-paralax{
    transform-style: preserve-3d;
    transform: perspective(1000px);
}

.tilt-paralax-item{
    transform: translateZ(50px);
}

.btn-green{
    background-color: #ABF03C !important;
    color: #D62439 !important;
}





@keyframes project-types-switch{
    33% { content: "Websites"; }
    66% { content: "Apps"; }
    100% { content: "Games"; }
}

.project-types-switch::after{
    content: "Websites";
    animation: project-types-switch 5s infinite;
}


.animate-scroll-left{
    transform: translateX(-100%);
    transition: transform 2s;
}

.animate-scroll-right{
    transform: translateX(100%);
    transition: transform 2s;
}



.scroll-effect-left{
    transform: translateX(0);
}

.scroll-effect-right{
    transform: translateX(0);
}