:root {
    /* --bg-color: #2D2D31; */
    --bg-color: #111;
}

/* Body */
body {
    background: var(--bg-color);
}

body > .page {
    margin-bottom: 8.2625rem; /* Footer height */
    background: var(--bg-color);
}

/* Header */
.page-head .rd-navbar-fixed .rd-navbar-brand {
    text-align: center;
    left: 3.5rem;
    right: 3.5rem;
}

.page-head .logo {
    height: 2rem;
    max-width: none;
}

/* Footer */
.page-foot {
    bottom: 0;
    position: fixed;
    width: 100%;
    z-index: 2;
}

.page-foot > section {
    padding: 1rem;
}

.page-foot .text-md-center address {
    display: flex;
    align-items: center;
    justify-content: center;
}

.page-foot address {
    white-space: nowrap;
}

.page-foot address .icon {
    margin-right: .5rem;
}

.page-foot .text-md-center address .icon {
    margin-right: .6rem;
}

/* Loader */
.preloader {
    background: var(--bg-color);
}

/* Home */
.slider-bottom {
    height: 5rem;
    background: linear-gradient(rgba(17, 17, 17, 0), rgba(17, 17, 17, 1));
    position: absolute;
    width: 100%;
    margin-top: -5rem;
    z-index: 1;
}

.categories {
    margin: 1rem 0;
}

.clients {
    display: flex;
    gap: 1rem;
    justify-content: space-evenly;
    margin: 1rem;
}

.clients img {
    max-height: 4rem;
}

.home .lg-thumb {
    display: flex;
    justify-content: center;
}

.home .lg-thumb-item {
    cursor: pointer !important;
}

.home .lg-thumb-item:first-child {
    display: none;
}

.home .lg-caption {
    transition: margin-top 700ms;
    color: #eee;
    background: rgba(0, 0, 0, 0.45);
    position: relative;
    font-size: .75rem;
    width: 100px;
    text-align: center;
    height: 1.25rem;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    padding: 0 0.5rem;
}

.home .lg-caption.show {
    margin-top: -1.25rem;
}

/* Project */
.project-description {
    margin: 1rem;
}

.breadcrumbs-custom-title {
    text-shadow: .125rem .125rem .125rem rgba(0, 0, 0, .5);
}

@media (min-width: 768px) {
    body > .page {
        margin-bottom: 5.825rem; /* Footer height */
    }

    .page-head .logo {
        height: 5rem;
    } 

    .page-foot > section {
        padding: 2rem;
    }
    
    .categories {
        margin: 2rem 0;
    }
    
    .clients {
        gap: 2rem;
        margin: 2rem;
    }

    .project-description {
        margin: 2rem;
    }
}

/* @media (min-width: 992px) {
    .page-head {
        height: 6.5rem;
    }
}

@media (min-width: 1200px) {
    .page-head {
        height: 7rem;
    }
} */