/**
 * Add styling for 404 page here
 */

 .link-image img {
    height: 270px;
    object-fit: cover;
    object-position: center;
    width: 100%;
}

.link-image img.p-holder {
   background: var(--grey);
   object-fit: contain;
   padding: 20px;
}

.imgbtns-cont {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    padding: 0;
    justify-content: center;
}

 .imgbtns-404 a:hover {
    text-shadow:none!important;
 }

 .link_title {
    padding: 22px 25px;
    display: flex;
    width: fit-content;
 }

 .link_title h3 {
    margin: 0;
 }

 .ff-links {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    background: var(--grey);
    border-radius: 10px;
    overflow: hidden;  
 }

 .ff-links h3 {
    color: var(--white);
 }

 .link-container:nth-child(odd) .ff-links {
    background: var(--secondary-color);
 }

 .link-container:nth-child(even) .ff-links {
    background: var(--primary-color);
 }

 .link-container .ff-links:hover {
    background: var(--text-color);
 }

 .links-404 {
    padding-bottom: 0
 }

 .search-404 form{
    position: relative;
    max-width: 500px;
    width: 100%;
 }

 .search-404 p:has(button) {
    position: absolute;
    width: fit-content;
    bottom: 0;
    right: 0;
    margin-bottom: 0;
 }

 .search-404 button {
    font-weight: 500;
    line-height: 1em;
    font-family: var(--secondary-font);
    padding: 17px 25px;
    font-size: 18px;
    border-radius: var(--border-radius);
    background: var(--blue-gradient);
    color: var(--white);
    border: none;
 }

 .contact-404 {
    display: flex;
    flex-direction: column;
    align-items: center;
 }

 .links-404 .r-col {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
 }

 .r-col .btn:hover {
    background: var(--white);
    color: var(--primary-hover-color);
    border: 3px solid var(--red-gradient);
 }

 .link-404__column {
    padding-top: calc(var(--bs-gutter-x) * .5);
    padding-bottom: calc(var(--bs-gutter-x) * .5);
 }

 @media (min-width: 768px) {
    .link-container {
        width: 47%;
    }
 }

 @media (min-width: 1025px) {
    .links-404 {
        padding-top: 50px
    }

    .link-container {
        width: 31%;
    }
 }

 @media (max-width: 1024px) {
    .search-404 {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
     }

     .search-404 p:has(button) {
        bottom: 16px;
     }
}