body {
    /* height: 3500px; */
    overflow-x: hidden;
    padding-top: 88px;
}

/* Header background image */
.bg-imag {
    height: 100vh;
    width: 100vw;
    object-fit: cover;
    filter: brightness(0.6);
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}


/* Header background image for regular sites */
img.bg-site-imag {
    height: 30vh;
    width: 100vw;
    object-fit: cover;
    filter: brightness(0.6);
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}

/* Header background image for regular sites */
.bg-about-footer-imag {
    background: linear-gradient( rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6) ), url(https://images.unsplash.com/photo-1464219789935-c2d9d9aba644?q=80&w=2670&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D);
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: 0 0, 0 -20em; 
}

/* add bg color to navbar when scrolling */
.navbar {
    transition: all 0.5s;
    top: 0;
    z-index: 9999;
}

.navbar-scrolled {
    background-color: rgba(1, 1, 1, 0.8);
    border-bottom: 1px solid rgb(24, 24, 24);
    box-shadow: 0 3px 10px rgba(1, 1, 1, 0.15);
}

/* add underline efect when hovering over navbar links */
.nav-link {
    position: relative;
    color: aliceblue;
    margin-right: 15px;
    font-size: large;
}

.nav-link::after {
    content: '';
    opacity: 0;
    transition: all 0.2s;
    height: 2px;
    width: 100%;
    background-color: #EA2213;
    position: absolute;
    bottom: 0;
    left: 0;
}

.nav-link:hover::after {
    opacity: 1;
}

/* custome margines */
.margine-tb {
    margin-top: 25em;
    margin-bottom: 30em;
}

/* custome margines for regular sites */
.margine-tb-site {
    margin-top: 5em;
    margin-bottom: 10em;
}

.padding-all {
    padding: 5em 3em;
}

.padding-all2 {
    padding: 15em 8em 0em 8em;
}

/* medium screens */
@media (max-width: 1100px) {
    .padding-all2 {
        padding: 10em 6em 3em 6em;
    }

    .bg-about-footer-imag {
        background: linear-gradient( rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6) ), url(https://images.unsplash.com/photo-1464219789935-c2d9d9aba644?q=80&w=2670&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D);
        background-repeat: no-repeat;
        background-size: 100%;
        background-position: 0 0, 0 -6em; 
    }
}

/* small screens */
@media (max-width: 900px) {
    .margine-tb {
        margin-top: 5em;
        margin-bottom: 10em;
    }

    .padding-all {
        padding: 3em 1em;
    }

    .bg-about-footer-imag {
        background: linear-gradient( rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6) ), url(https://images.unsplash.com/photo-1464219789935-c2d9d9aba644?q=80&w=2670&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D);
        background-repeat: no-repeat;
        background-size: 100%;
        background-position: 0 0, 0 -1em; 
    }

    .padding-all2 {
        padding: 3em 0em 0em 0em;
    }
}

/* shadow on display heading */
.text-shadow {
    text-shadow: 0 0 20px #000000;
}

/* Symbol images on the home page */
img.home-symbol {
    width: 320px;
    height: 213px;
}

/* footer */
.footer {
    background-color: rgba(1, 1, 1, 0.9);
    border-bottom: 1px solid rgb(24, 24, 24);
    box-shadow: 0 3px 10px rgba(1, 1, 1, 0.15);
}