body {
    background-color: #ffffff;
    font-family: "Red Hat Display", sans-serif;
    
}
/* Use a flex container to vertically center content */
.error-text h1 , .error-subtitle {
    color:#ff0000
}
.error-image{
    max-width: 130%;
    position: absolute;
    z-index:-1
}
.btn-danger{
    background: #ff0000;
}
.error-container {
    min-height: 100vh;
    display: flex;
    align-items: center;
}
.error-text h1 {
    font-size: 3rem !important;
    font-weight: 700;
    min-width: 103%;
    white-space: nowrap;
}
.error-subtitle {
    font-size: 2rem;
    font-weight: 600;
    white-space: nowrap;
}
.error-buttons .btn {
    padding-left: 2rem;
    padding-right: 2rem;
    font-size: 1rem;
}
.error-footnote {
    font-size: 0.8rem;
    color: #6c757d;
    margin-top: 2rem;
    max-width: 100%;
}

hr {
    height: 1px; 
    width: 90%; 
    background-color: black;
   
    margin-inline-start: 0;
}

.error-container .btn{
    min-width: 211px;
}

@media (max-width: 1199px ){
    .error-image{
        max-width: 100%;
        position: relative;
        z-index:0
    }
    .error-subtitle {
        font-size: 1.5rem;
        font-weight: 600;
    }
    .error-text h1 {
        margin-top: 40px;
        font-size: 2.5rem;
        font-weight: 700;
    }

    .error-footnote{
        max-width:100%
    }

}
/* Responsive adjustments */
@media (max-width: 767.98px ) {
    .error-container {
        flex-direction: column;
        text-align: center;
    }
    .error-text {
        margin-bottom: 2rem;
    }
    .error-text h1 {
        margin-top: 40px;
        font-size: 2.5rem;
        font-weight: 700;
    }
    .error-subtitle {
        font-size: 1.5rem;
        font-weight: 600;
    }
    .error-image{
        max-width: 100%;
        position: relative;
        z-index:0
    }
    hr {
        width: 100%;
    }
    
}