body {
    font-family: sans-serif;
    height: auto;
}

/* head-section*/
header .container-fluid {
    background-color: #09347a;
    min-height: 50px;
}

header .top-section {
    min-height: 50px;
    flex-wrap: wrap;
}

.navbar-brand img {
    width: 44%;
}

.contact {
    flex-wrap: wrap;
}

header .contact span {
    color: white;
    padding: 0 15px;
    border-right: 1px solid #fff;
}

.fa-brands {
    padding: 0 7px;
}

.fa-brands:hover {
    color: #fff;
}

.navbar-nav .nav-item .nav-link {
    color: rgb(72, 72, 72);
    font-size: 17px;
    font-weight: bold;
}


@media(max-width:992px) {
    .nav {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
}

.nav li a {
    text-decoration: none;
    color: rgb(106, 106, 106);
    font-weight: bold;
    font-size: 17px;
}

.nav li a:hover {
    color: orange;
}

/* carousel */

.carousel-item {
    position: relative;

}

.carousel-caption {
    position: absolute;
    top: 200px;
}

.carousel-item h6 {
    background-color: orange;
    display: inline-block;
    color: #fff;
    font-weight: bold;
    padding: 8px 35px;
    border-radius: 8px;
    animation: btm-to-tp 1s ease-in forwards;
    opacity: 0;
}

.carousel-item h1 {
    font-size: 40px;
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif;
    animation: btm-to-tp-2 1s ease-in .3s forwards;
    opacity: 0;

}

.carousel-item h2 {
    animation: btm-to-tp-3 1s ease-in .7s forwards;
    opacity: 0;
}

.carousel-item h3 {
    animation: btm-to-tp-5 1s ease-in 1s forwards;
    opacity: 0;
}

.carousel-item button {
    padding: 18px 40px;
    outline: none;
    border: none;
    font-weight: bold;
    animation: btm-to-tp-4 1s ease-in 1.3s forwards;
    opacity: 0;

}

.carousel-item .btn-2 {
    background-color: #fff;
    color: black;
}


.carousel-item button:hover {
    background-color: rgb(74, 73, 73);
    color: #fff;

}

.carousel-item .img-2 {
    position: absolute;
    bottom: 0;
    right: 0;
    animation: btm-to-tp-6 1s ease-in 2s forwards;
    opacity: 0;
}


@keyframes btm-to-tp {
    0% {
        transform: translateY(100%);
    }

    100% {
        transform: translateY(0%);
        opacity: 1;
    }
}

@keyframes btm-to-tp-2 {
    0% {
        transform: translateY(100%);
    }

    100% {
        transform: translateY(0%);
        opacity: 1;
    }
}

@keyframes btm-to-tp-3 {
    0% {
        transform: translateY(100%);
    }

    100% {
        transform: translateY(0%);
        opacity: 1;
    }
}

@keyframes btm-to-tp-4 {
    0% {
        transform: translateY(100%);
    }

    100% {
        transform: translateY(0%);
        opacity: 1;
    }
}

@keyframes btm-to-tp-5 {
    0% {
        transform: translateY(100%);
    }

    100% {
        transform: translateY(0%);
        opacity: 1;
    }
}

@keyframes btm-to-tp-6 {

    100% {
        transform: translateY(0%);
        opacity: 1;
    }
}