 .for-mobile-view {
            display: block !important;
        }

        .navbar {
            background-color: #f8f9fa;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
            height: auto;
        }

        .for-other-devices-view {
            display: none !important;
        }

        @media(min-width:768px) {
            .for-mobile-view {
                display: none !important;

            }

            .navbar {
                background-color: #f8f9fa;
                box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
                height: 60px;
            }

            .for-other-devices-view {
                display: block !important;
            }
        }

          body {
            font-family: 'Poppins', sans-serif;
            background: #f8f9fa;
        }



        .navbar .nav-link {
            font-size: large;
            font-weight: 500;
            transition: color 0.3s ease;
            margin-inline: 10px;
        }

        .navbar .nav-link:hover {
            color: #3c8e8c;
            border: 2px solid #3c8e8c;
            border-radius: 10px;
            background-color: #bfe8ce;
            padding: 5px 10px;
        }

        .navbar a.text-dark:hover {
            color: #3c8e8c;
            font-weight: 500;
        }

        .navbar i:hover {
            color: #3c8e8c;
            font-weight: 500;
        }

        .navbar .custom-a-text {
            text-decoration: none;

        }

        .navbar .custom-a-text:hover {
            text-decoration: none;
            color: #3c8e8c !important;
            border: 2px solid #3c8e8c;
            border-radius: 10px;
            background-color: #bfe8ce;
            padding: 5px 10px;
            /* padding-left: 5px;
             padding-right: 5px; */
        }

        h2 {
            font-size: 2.5rem;
            font-weight: 600;
        }

        p {
            font-size: 1rem;
        }

          .background-image-banner {
            position: relative;
            background-image: url(../public/img/banner/bg-03.jpg);
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            color: white;
            padding: 20px;
            height: auto;
            /* display: flex;
                        align-items: center; */
            overflow: hidden;
        }

        .background-image-banner::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.8);
            z-index: 1;
        }

        .background-image-banner * {
            position: relative;
            z-index: 2;
        }