﻿/*Navbar*/
.projects-section .navbar {
    position: static;
}

    .projects-section .navbar .navbar-right {
        background: rgba(0, 0, 0, 0.30);
    }


    .projects-section .navbar a svg path {
        fill: black !important;
        fill-opacity: 1 !important;
    }

    .projects-section .navbar .menu-toggle path {
        stroke: black !important;
    }



#recentProjects {
    padding: 40px 0;
}

    #recentProjects .projects-links {
        align-self: flex-start;
        display: flex;
        gap: 12px;
        padding-bottom: 24px;
    }

        #recentProjects .projects-links a {
            padding: 10px 20px !important;
            border-radius: 99px !important;
            font-size: 16px;
            line-height: 18px;
        }

        #recentProjects .projects-links .no-active {
            background: #E2EFFF;
            color: #426491;
            transition: 0.2s ease-in all;
        }

            #recentProjects .projects-links .no-active:hover {
                background: #C4DAFF;
            }

    #recentProjects .slider-title {
        font-size: 1.75em;
        line-height: 110%;
        padding: 12px 0;
        align-self: flex-start;
    }

    #recentProjects .container {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

        #recentProjects .container .loading-btn {
            display: inline-block;
            padding: 13px 25px;
            border-radius: 20px;
            font-weight: 300;
            background: #00639B;
            color: #fff;
            line-height: 18px;
        }

    #recentProjects .projects {
        display: flex;
        gap: 32px 20px;
        flex-wrap: wrap;
        padding: 24px 0;
    }



        #recentProjects .projects .card {
            max-width: calc(50%);
            flex: 1 1 calc(50% - 20px);
        }

            #recentProjects .projects .card img {
                width: 100%;
                height: 300px;
            }

            #recentProjects .projects .card .card-content {
                padding-left: 2px;
            }



@media (max-width: 480px) {
    #recentProjects .projects .card {
        flex: 1 1 100%;
        max-width: 100%;
    }
}
