.text-white,h2.me-4{text-shadow:2px 2px #060000}.terms{background-color:#e5de1b;border:2px solid #000;margin:20px;padding:20px;text-align:center}h1.me-4{text-shadow:2px 2px #060000}.terms{background-color:#e5de1b;border:2px solid #000;margin:20px;padding:20px;text-align:center}h5{font-size:.9rem}.row{--bs-gutter-x:.4rem;--bs-gutter-y:0;display:flex;flex-wrap:wrap;margin-top:calc(var(--bs-gutter-y)*-1);margin-right:calc(var(--bs-gutter-x)/-2);margin-left:calc(var(--bs-gutter-x)/-2)}.display-1{font-size:calc(.25rem + 4.5vw);font-weight:800;line-height:1.2}h2.me-4{margin-top:0;margin-bottom:.5rem;font-family:Nunito,sans-serif;font-weight:700;line-height:1.2;color:#fdf001}h1.me-4{margin-top:0;margin-bottom:.5rem;font-family:Nunito,sans-serif;font-weight:700;line-height:1.2;color:#fdf001}#spinner{opacity:0;visibility:hidden;transition:opacity .8s ease-out,visibility 0s linear .5s;z-index:99999}#spinner.show{transition:opacity .8s ease-out,visibility linear;visibility:visible;opacity:1}.back-to-top{position:sticky;right:30px;bottom:30px;display:flex;width:58px;height:58px;align-items:center;justify-content:center;z-index:99}.carousel-item,.search-btn{position:relative}.btn{text-transform:uppercase;font-weight:500;transition:.5s}.btn.btn-primary{box-shadow:inset 0 0 0 0 var(--bs-dark)}.btn.btn-primary:hover{box-shadow:inset 200px 0 0 0 var(--bs-dark)!important;color:var(--bs-primary)!important}.btn.btn-dark{box-shadow:inset 0 0 0 0 var(--bs-primary)}.btn.btn-dark:hover{box-shadow:inset 200px 0 0 0 var(--bs-primary);color:var(--bs-dark)!important}.search-btn{width:100%;padding:0 0 0 25px}.search-btn .form-group{width:100%}.search-btn button{position:absolute;right:25px}@media (max-width:992px){.search-btn{display:none}}@media (max-width:576px){.topbar-top{display:none}}.navbar .navbar-nav{padding:15px 0}.navbar .navbar-nav .nav-link{padding:15px;color:var(--bs-white);font-weight:500;font-size:16px;outline:0;transition:.5s}.navbar .navbar-nav .nav-link.active,.navbar .navbar-nav .nav-link:hover{color:var(--bs-primary);transition:.5s}.navbar .dropdown-toggle::after{border:none;content:"\f107";font-family:"Font Awesome 5 Free";font-weight:800;vertical-align:middle;margin-left:8px}@media (min-width:992px){.navbar .nav-item .dropdown-menu{display:block;visibility:hidden;top:100%;transform:rotateX(-75deg);transform-origin:0% 0%;transition:.5s;opacity:0}}.dropdown .dropdown-menu a.active,.dropdown .dropdown-menu a:hover{background:var(--bs-dark);color:var(--bs-primary)}.navbar .nav-item:hover .dropdown-menu{transform:rotateX(0);visibility:visible;transition:.5s;opacity:1}.navbar-toggler{background:var(--bs-secondary);color:var(--bs-light)!important;padding:5px 12px;border:2px solid var(--bs-primary)!important}.carousel-item::after{content:"";position:absolute;width:100%;height:100%;top:0;right:0}.carousel-caption{height:100%;display:flex;align-items:center;text-align:start;z-index:1}.carousel-control-next,.carousel-control-prev{height:60px;position:absolute;top:50%;background:var(--bs-primary);opacity:1;width:80px;transition:.5s}.carousel-control-prev{left:0;border-radius:0 30px 30px 0}.carousel-control-next{right:0;border-radius:30px 0 0 30px}#carouselId .carousel-indicators li{width:24px;height:24px;background:var(--bs-dark);border:2px solid var(--bs-primary);border-radius:24px;margin:0 10px 30px}#carouselId .carousel-indicators li.active{background:var(--bs-primary)!important}@media (max-width:768px){.topbar,.topbar-info{flex-direction:column}.carousel-control-next,.carousel-control-prev,.search-btn{display:none}.topbar-icon,.topbar-info a{padding:0 0 10px}.carousel-item{width:100%;height:400px}.carousel-item img{height:400px}}.page-header{background:linear-gradient(rgba(0,0,0,.7),rgba(0,0,0,.7)) 0 0/cover,url(../img/carousel-2.jpg) center center/cover no-repeat;margin-bottom:6rem}.about-img,.project-item{width:100%;height:100%;position:relative;padding:30px;overflow:hidden}.rotate-left,.rotate-right{width:150px;height:100px;top:28%;z-index:2}.about-img::before,.project-item::before{content:"";width:100%;height:40%;background:var(--bs-dark);position:absolute;top:0;left:0;z-index:1;border-radius:10px}.about-img::after,.project-item::after{content:"";width:100%;height:60%;background:var(--bs-primary);position:absolute;bottom:0;left:0;z-index:1;border-radius:10px}.rotate-left{position:absolute;left:-10%;rotate:25deg}.rotate-right{position:absolute;right:-10%;rotate:-25deg}.about-img img{position:relative;z-index:2;border-radius:10px}.experiences{width:160px;height:200px;position:absolute;top:0;right:0;padding:35px;text-align:center;border-radius:10px;z-index:3;animation:5s ease-in-out infinite mymove}@keyframes mymove{from{top:-202px}to{top:102%}}.services-inner-icon{width:130px;height:130px;background:var(--bs-dark);display:flex;align-items:center;justify-content:center;transition:.5s;position:relative}.project-left,.project-right{width:180px;height:70px;top:22%;z-index:2}.services-inner-icon::after{content:"";position:absolute;width:0;height:0;border-radius:62px;top:50%;left:50%;transition:.5s}.services-item:hover .services-inner-icon::after{width:100%;height:100%;margin-top:-50%;margin-left:-50%;background:var(--bs-primary);color:var(--bs-dark)}.services-item i{text-align:center;transition:.5s}.services-item:hover i{color:var(--bs-dark)!important;z-index:1;rotate:360deg}.copyright .copyright-btn,.services-btn{display:flex;align-items:center;justify-content:center}.project-item a,.project-item img{border-radius:10px;align-items:center;display:flex}.project-left{position:absolute;left:-18%;rotate:30deg}.project-right{position:absolute;right:-18%;rotate:-30deg}.blog-carousel,.project-item img,.team-item,.testimonial-content{position:relative;width:100%;height:100%}.project-item img{z-index:2;justify-content:center}.project-item a{position:absolute;padding:25px;top:50%;left:50%;transform:translate(-50%,-50%) scale(0) rotate(-360deg);z-index:3;justify-content:center;transition:.5s;opacity:0}.project-item:hover a{top:50%;left:50%;transform:translate(-50%,-50%) scale(1) rotate(0);background:var(--bs-primary);color:var(--bs-dark)!important;opacity:1}.blog-carousel .owl-nav .owl-prev{position:absolute;width:80px;height:50px;background:var(--bs-primary);top:-51px;left:0;border:0;border-radius:10px 30px 30px 10px;box-shadow:inset 0 0 0 0 var(--bs-dark);transition:.5s}.blog-carousel .owl-nav .owl-prev:hover,.testimonial-carousel .owl-nav .owl-next:hover,.testimonial-carousel .owl-nav .owl-prev:hover{box-shadow:inset 200px 0 0 0 var(--bs-dark);color:var(--bs-primary)!important}.blog-carousel .owl-next,.blog-carousel .owl-prev{color:var(--bs-dark);display:flex;align-items:center;justify-content:center}.blog-carousel .owl-nav .owl-next{position:absolute;width:80px;height:50px;background:var(--bs-primary);top:-51px;right:0;border-radius:30px 10px 10px 30px;box-shadow:inset 0 0 0 0 #000;transition:.5s}.blog-carousel .owl-nav .owl-next:hover{box-shadow:inset 200px 0 0 0 #000;color:var(--bs-primary)!important}.contact-link a h5,.contact-link a i,.contact-link a.h5,.pricing-item{transition:.5s}.pricing-item:hover{box-shadow:0 0 30px rgba(0,0,0,.5);margin:-20px 0 20px}.pricing-label{border-bottom:20px solid var(--bs-light);border-radius:0 0 300px 300px;transition:.5s}.pricing-item:hover .pricing-label{border-color:rgba(0,0,0,.5)}.pricing-item:hover .pricing-label.pricing-featured{border-color:rgba(255,255,255,.5)}.call-to-action{background:linear-gradient(rgba(0,0,0,.7),rgba(0,0,0,.7)) 0 0/cover,url(../img/carousel-1.jpg) center center/cover no-repeat}.team-item{overflow:hidden}.team-item .team-icon{position:absolute;top:15px;right:-80px;rotate:-30deg;transition:.5s;visibility:hidden}.team-item:hover .team-icon{visibility:visible;margin-right:95px;rotate:0deg}.team-item .team-icon .btn{padding:0;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:35px}.team-item .team-content{box-shadow:inset 0 0 0 0 var(--bs-dark);transition:1s}.team-item:hover .team-content{box-shadow:inset 550px 0 0 0 var(--bs-dark);color:var(--bs-primary)!important}.testimonial-content{background:var(--bs-light);z-index:1}.testimonial-content::before{content:"";width:50px;height:50px;position:absolute;left:50px;bottom:-15px;rotate:45deg;z-index:-5;background:var(--bs-light)}.testimonial-carousel{position:relative;padding-left:60px;padding-right:60px}.testimonial-carousel .owl-nav .owl-next,.testimonial-carousel .owl-nav .owl-prev{display:flex;align-items:center;justify-content:center;position:absolute;width:60px;height:40px;background:var(--bs-primary);color:var(--bs-dark);font-size:22px;top:14%;left:0;border-radius:30px 0 0 30px;box-shadow:inset 0 0 0 0 var(--bs-dark);transition:.5s}.testimonial-carousel .owl-nav .owl-next{left:auto;right:0;border-radius:0 30px 30px 0}.testimonial-carousel .owl-dots{margin-top:30px;display:flex;align-items:center;justify-content:center}.testimonial-carousel .owl-dot{position:relative;display:inline-block;margin:0 5px;width:15px;height:15px;background:var(--bs-secondary);border-radius:15px;transition:.5s}.testimonial-carousel .owl-dot.active{width:30px;background:var(--bs-primary)}.contact-link a h5:hover,.contact-link a i:hover,.contact-link a.h5:hover{color:var(--bs-primary)!important}.footer{background:linear-gradient(rgba(0,0,0,.7),rgba(0,0,0,.7)) 0 0/cover,url(../img/carousel-2.jpg) center center/cover no-repeat;color:rgba(255,255,255,.7);margin-top:6rem}.footer-item,.footer-item a{color:rgba(255,255,255,.7);text-transform:capitalize}.copyright .copyright-icon{width:44px;height:44px;display:flex;align-items:center;justify-content:center}

.py-5 {
    padding-top: 6rem !important;
}

/* Define reusable variables for colors */
:root {
    --black: #000;
    --yellow: #FFD700;
    --bg-color: #f4f4f4;
    --text-color: #333;
    --border-radius: 8px;
}

/* Global reset and body styling */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: Arial, sans-serif;
    background-color: var(--bg-color);
    color: var(--text-color);
}

/* Section headers */
h2 {
    text-align: center;
    font-size: 2em;
    margin-bottom: 20px;
}

/* General Section Styling */
.service-section {
    padding: 20px;
    margin: 20px 0;
    background-color: #fff;
    border-radius: var(--border-radius);
}

/* Image row container using flexbox */
.image-row {
    display: flex;
    flex-wrap: wrap;
    gap: 1%; /* Adds space between images */
}

/* Individual image containers */
.image-container {
    flex: 1 1 23%; /* Flex shorthand: grow, shrink, and basis */
    margin-bottom: 15px;
    border: 5px solid var(--black);
    border-radius: var(--border-radius);
    overflow: hidden;
    display: flex;
    justify-content: center;   /* Align image horizontally */
}

/* Image styling */
.image-container img {
    width: 100%;
    height: auto;
    display: block;
    border: 5px solid var(--yellow);
    border-radius: var(--border-radius);
    transition: transform .3s ease;
}

/* Hover effect */
.image-container:hover img {
    transform: scale(1.05);
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .image-container {
        flex: 1 1 48%; /* 2 per row on tablets */
    }
}

@media (max-width: 480px) {
    .image-container {
        flex: 1 1 100%; /* 1 per row on mobile */
    }
}

/* Make navbar fixed and center the text */
.navbar {
    position: fixed;
    top: 40px; /* Place navbar below the topbar */
    left: 0;
    width: 100%;
    z-index: 999; /* Below the topbar */
    background-color: #000; /* Keep original background */
    padding: 5px 200px; /* Reduced padding */
    display: flex;
    align-items: center;
    justify-content: center; /* Center the navbar items */
    visibility: visible; /* Ensure it stays visible */
}

/* Fix the topbar to the top */
.topbar {
    position: fixed;
    top: 0; /* Makes it stick to the top */
    left: 0;
    width: 100%;
    z-index: 1000; /* Ensure it's above other content */
    background-color: #f7fa52; /* Optional: background color for topbar */
    padding: 5px 200px; /* Reduced padding */
    display: flex;
    align-items: center;
    justify-content: center; /* Center the content inside the topbar */
    visibility: visible; /* Ensure it stays visible */
}


/* Add padding to the top of the carousel to push it below the navbar */
.carousel {
    padding-top: 60px;  /* Adjust based on the height of your navbar */
}

/* For mobile screens, adjust the padding further if needed */
@media (max-width: 768px) {
    .carousel {
        padding-top: 70px;  /* Adjust more for mobile screens */
    }
}

/* For very small mobile screens (max-width: 480px) */
@media (max-width: 480px) {
    .carousel {
        padding-top: 90px;  /* Adjust further for smaller screens */
    }
}