:root {
        --pf: Swansea, sans-serif;
        --color-white: #ffffff;
        --color-primary: #1381FF;
        --color-yellow: #FFF020;
        --color-navyblue: #1C4471;
    }

    .color-white {
        color: var(--color-white) !important;
    }

    .color-primary {
        color: var(--color-primary) !important;
    }

    .color-yellow {
        color: var(--color-yellow) !important;
    }

    .color-dark-blue {
        color: var(--color-navyblue) !important;
    }

    .bg-white {
        background-color: var(--color-white) !important;
    }

    .bg-primary {
        background-color: var(--color-primary) !important;
    }

    .bg-yellow {
        background-color: var(--color-yellow) !important;
    }

    .bg-dark-blue {
        background-color: var(--color-navyblue) !important;
    }

    .color-hover-primary:hover {
        color: var(--color-primary) !important;
        transition: all 0.3s ease;
    }
    
    .color-hover-white:hover {
        color: var(--color-white) !important;
        transition: all 0.3s ease;
    }

    .font-size-16 {
        font-size: 16px !important;
    }

    .font-size-20 {
        font-size: 20px !important;
    }

    .font-weight-500 {
        font-weight: 500 !important;
    }

    .font-weight-600 {
        font-weight: 600 !important;
    }

    .form-label {
        color: var(--color-navyblue);
    }

    .project-detail-image {
        height: 1000px;
        overflow-y: auto;
        -webkit-box-shadow: 0px 0px 35px 0px rgba(198, 198, 198, 1);
        -moz-box-shadow: 0px 0px 35px 0px rgba(198, 198, 198, 1);
        box-shadow: 0px 0px 35px 0px rgba(198, 198, 198, 1);
    }

    .project-detail-image {
        img {
            width: 100%;
            object-fit: cover;
        }
    }

    .project-detail-image-logo {
        max-width: 500px;
        width: 100%;
        margin: 0 auto;

        img {
            width: 100%;
            object-fit: cover;
            display: block;
        }
    }

    @media screen and (max-width: 768px) {
        .project-detail-image {
            height: 300px;
        }
    }

    .response-message {
        padding: 10px;
        border-radius: 10px;
        text-align: center;
        font-size: 20px;
    }

    .response-message-success {
        color: var(--color-white);
        background-color: var(--color-primary);
    }

    .response-message-danger {
        color: var(--color-white);
        background-color: #972E2E;
    }