* {
    font-family: josefin-sans, sans-serif;
    font-weight:400;
    font-size: 20px;
}

body {
    max-width: 100vw;
}

.fullBG {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 95vh;
	background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url('../images/indexBG.jpg');
    z-index: -1;
}

.contacBG {
    background-color: #fff;
}

.navbar {
    transition: background-color 0.3s ease-in-out;
}
  
.navbar-scroll {
    background-color: #fff; /* Change this to your desired background color */
}

.row {
    --bs-gutter-x: 0;  
}

/* Nav CSS */

nav {
    z-index: 50;
}
/* .navbar {
    background-color: transparent !important;
    z-index: 3;
} */

h1, h2 {
    color: #597ea6;
}

p {
    color: darkgrey;
}

.navbar-light .navbar-nav .nav-link:hover {
    color: #597ea6;
}
.navbar-light .navbar-nav .nav-link .active:hover {
    color:#212529;
}

/* header CSS */


#navbarNavAltMarkup {
    justify-content: flex-end;
}

/* Set full-height images */
.hero {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background-size: cover;
    background-image: url('../images/BG-01.jpg');
    z-index: -1;
}

/* .logoFullPage {
    background-image: url("../images/LogoFullPage.png");
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background-size: cover;
    background-position: center;
} */
.landing-image {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 95vh;
	background-size: cover;
    background-position: center;
    z-index: -1;
    animation: rotate-images 6s infinite;
    opacity: 0;
}
/* Add custom classes for each image */
.image-1 {
    background-image: url("../images/indexBG-1.png");
    animation-delay: 0s;
}

.image-2 {
    background-image: url("../images/indexBG-2.png");
    animation-delay: 2s;
}

.image-3 {
    background-image: url("../images/indexBG-3.png");
    animation-delay: 4s;
}
.image-4 {
    background-image: url("../images/about-1.png");
    animation-delay: 0s;
}

.image-5 {
    background-image: url("../images/about-2.png");
    animation-delay: 2s;
}

.image-6 {
    background-image: url("../images/about-3.png");
    animation-delay: 4s;
}

.image-7 {
    background-image: url("../images/Services-1.png");
    animation-delay: 0s;
}

.image-8 {
    background-image: url("../images/Services-2.png");
    animation-delay: 2s;
}

.image-9 {
    background-image: url("../images/Services-3.png");
    animation-delay: 4s;
}

/* Animation for rotating images */
@keyframes rotate-images {
    0% {
            opacity: 0;
    }
    20% {
            opacity: 1;
    }
    33.33% {
            opacity: 1;
    }
    53.33% {
            opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

.logoMiddle {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background-size: cover;
    background-position: center;
    z-index: 5;
    animation: rotate-images-2 1s infinite;
    opacity: 0;
}

.logoMiddle1 {
    background-image: url("../images/logo-landing-01.png");
    animation-delay: 0s;
}
.logoMiddle2 {
    background-image: url("../images/logo-landing-02.png");
    animation-delay: 0.5s;
}


@keyframes rotate-images-2 {
    0% {
            opacity: 0;
    }
    50% {
            opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

.imgClient {
    max-width: 200px;
}

/* Empty styles */

.aboutUs {
    background-image: url("../images/aboutBG.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.projects {
    background-image: url("../images/indexBG.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.services {
    background-image: url("../images/servicesBG.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;

}

.aboutUsMain {
    background-color: #fff;
}

/* About us */
.heroAboutUs {
	position:absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 70vh;
	background-size: cover;
    background-position: bottom;
    background-image: url('../images/aboutBG.jpg');
    z-index: -1;
}

.aboutUsImage {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background-size: cover;
    background-position: bottom;
    z-index: -1;
    animation: rotate-images 10s infinite;
    opacity: 0;
}
/* Add custom classes for each image */
.aboutUsImage1 {
    background-image: url("../images/aboutBG-1.png");
    animation-delay: 0s;
}

.aboutUsImage2 {
    background-image: url("../images/aboutBG-2.png");
    animation-delay: 5s;
}


/* Animation for rotating images */
@keyframes rotate-images {
    0% {
            opacity: 0;
    }
    20% {
            opacity: 1;
    }
    33.33% {
            opacity: 1;
    }
    53.33% {
            opacity: 0;
    }
    100% {
        opacity: 0;
    }
}
/* About us */
.heroServices {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background-size: cover;
    background-image: url('../images/aboutBG.jpg');
    z-index: -1;
}

.servicesImage {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background-size: cover;
    background-position: center;
    z-index: -1;
    animation: rotate-images 10s infinite;
    opacity: 0;
}
/* Add custom classes for each image */
.servicesImage1 {
    background-image: url("../images/aboutBG-1.png");
    animation-delay: 0s;
}

.servicesImage2 {
    background-image: url("../images/aboutBG-2.png");
    animation-delay: 5s;
}


/* Animation for rotating images */
@keyframes rotate-images {
    0% {
            opacity: 0;
    }
    20% {
            opacity: 1;
    }
    33.33% {
            opacity: 1;
    }
    53.33% {
            opacity: 0;
    }
    100% {
        opacity: 0;
    }
}


/* Projects */

.card {
    background-color: rgba(225, 225, 225, 0.5);
    border: none;
}

.card-body h5 {
    color: #597ea6;
    font-weight: 500;
}



/* Footer */
.footerMain {
    padding-top: 500px;
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 450px;
    /* margin-top: 50px */
    color: #597ea6;
}
.footerRow {
    background-color: lightgray;
}
.footerImage {
    padding: 20px;
    width: 150px;
}

.footerDefinition{
    padding-top: 20px;
    padding-bottom: 20px;
    padding-left: 20px;
}

.footerDescription{
    font-size: 0.8rem;
    padding-top: 20px;
}

.footerLinks {
    padding-top: 20px;
    padding-bottom: 20px;
}

.footerLinks a {
    font-size: 0.75rem;
    color: #597ea6;
    text-decoration: none;
}

.footerLinks ul{
    text-decoration: none;
    background-color: lightgray;
}
.footerLinks ul li{
    text-decoration: none;
    background-color: lightgray;
}
.footerCopyrights {
    padding-top: 20px;
    padding-bottom: 20px;
}

.footerCopyrights p {
    font-size: 0.75rem;
    padding-top: 20px;
}


/* Footer Other Pages */
.footerRow {
    background-color: lightgray;
    bottom: 0;
}
.footerOther {
    bottom: 0;
    margin-top: auto;
    color: #597ea6;
}
.footerOtherRow {
    background-color: lightgray;
}
.footerOtherImage {
    padding: 20px;
    width: 150px;
}

.footerOtherDefinition{
    padding-top: 20px;
    padding-bottom: 20px;
    padding-left: 20px;
}

.footerOtherDescription{
    font-size: 0.8rem;
    padding-top: 20px;
}

.footerOtherLinks {
    padding-top: 20px;
    padding-bottom: 20px;
}

.footerOtherLinks a {
    font-size: 0.75rem;
    color: #597ea6;
    text-decoration: none;
}

.footerOtherLinks ul{
    text-decoration: none;
    background-color: lightgray;
}
.footerOtherLinks ul li{
    text-decoration: none;
    background-color: lightgray;
}
.footerOtherCopyrights {
    padding-top: 20px;
    margin-left: 20px;
    padding-bottom: 20px;
}

.footerOtherCopyrights p {
    font-size: 0.75rem;
    padding-top: 20px;
    margin-left: 20px;
}

.footerBG {
    background-color: lightgray;
    margin-bottom: -75px;
}
.footerOtherBG {
    background-color: lightgray;
    margin-bottom: -75px;
}

.m0diRow {
    margin-bottom: -20px;
}

.m0diOtherRow {
    margin-bottom: -100px;
}

.m0di {
    background-color: white;
    font-size: 10px;
}
.m0di a{
    font-size: 10px;
}