.fixed_nav_bar{
    position: fixed; /* Keeps the navbar fixed at the top */
    top: 0;
    z-index: 1000;
    width: 100%;
    display: flex; /* Flexbox layout */
    align-items: center; /* Center items vertically */
    justify-content: center; /* Center items horizontally */
    transition: background-color 0.5s ease;
}


.navbar-nav .nav-item {
    align-items: center;
    margin-right: 20px;
}

.opsition_of_nav_bar{
    display: flex;
    align-items: center;
    margin-left: 20px;
    margin-right: 120px;
    
}

.select_language{
    background: none;
    border: none;
    color: black;
    outline: none;
    margin-left: 70px;

}
.opten_lang{
    color: rgb(255, 255, 255);
    background: rgba(0, 0, 0);
    font-weight: bold;
}

.logo_2 {
    height: 50px;
    width: 120px;
    position: relative;
    margin-right: 10px;
}
.opsition_of_nav_bar{
    display: flex; /* Use flexbox for alignment */
    align-items: center; /* Center items vertically */
    margin-left: 20px; 
    /* Space from the logo */
}
/* end 1 */

.breadcrumb-item + .breadcrumb-item::before {
    content: '>';
}

.breadcrumb {
    background-color: transparent;
    font-size: 14px;
}

.contact-section {
    margin-top: 20px;
}

.contact-section h4 {
    font-size: 18px;
    font-weight: bold;
}

.phone-number {
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 20px;
}

.contact-buttons a {
    margin-right: 10px;
    display: inline-flex;
    align-items: center;
    padding: 10px 20px;
    font-size: 16px;
}

.contact-buttons img {
    margin-right: 8px;
}

.contact-buttons .btn-outline-primary {
    border-color: #0088cc;
    color: #0088cc;
}

.contact-buttons .btn-outline-primary:hover {
    background-color: #0088cc;
    color: #fff;
}

.contact-buttons .btn-outline-secondary {
    border-color: #665cac;
    color: #665cac;
}

.contact-buttons .btn-outline-secondary:hover {
    background-color: #665cac;
    color: #fff;
}

.contact-buttons .btn-outline-success {
    border-color: #25d366;
    color: #25d366;
}

.contact-buttons .btn-outline-success:hover {
    background-color: #25d366;
    color: #fff;
}


/* end 2*/

.form-card {
    
    width: 500px;
    border-radius: 10px;
    background-color: #fff;
}

h2 {
    font-size: 24px;
    font-weight: bold;
}

input, textarea {
    font-size: 16px;
    padding: 10px;
    border-radius: 5px;
    border: 1px solid #d1d1d1;
}

textarea {
    resize: none;
}

.submit-btn {
    background-color: #f47723e4;
    border: none;
    padding: 10px;
    font-size: 16px;
    font-weight: bold;
}

.submit-btn:hover {
    background-color: #F47523;
}

/* end 3*/


.footer {
    
    background-color: #000; /* Black background */
    color: #fff; /* White text color */
    padding: 40px 0;
    width: 100%;
    bottom: unset;
}
.footer-logo {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 20px;
}
.footer-links {
    margin-bottom: 10px;
}
.footer-links a {
    color: #fff; /* White text for links */
    text-decoration: none;
    margin-bottom: 5px;
    display: block;
}
.footer-links a:hover {
    color: #ccc; /* Hover effect */
}
.footer-social {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-bottom: 20px;
}
.footer-social a {
    color: #fff;
    font-size: 20px;
}
.footer-social a:hover {
    color: #ccc;
}
.final_section{
    position: relative;
    top: 380px;
} 

@media (max-width: 1024px) {
    .card{
        height: 500px;
    }
}

@media (max-width: 768px) {
    .footer {
        text-align: center;
    }
}



@media (max-width: 990px) { /* Adjust breakpoint as needed */

    
    
    .fixed_nav_bar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 10px 20px; /* Add some padding for spacing */
        background-color: white; /* If you want the navbar to have a background */
        width: 100%;
    }
    
    .nav_bar_icon{
        position: relative; 
        left: 210px; 
        background: none; 
        color: rgba(255, 255, 255, 0.947); 
        border: none;
    }
    
    .navbar-nav .nav-link {
        display: block;
        padding: 10px;
    }

    .position_btn_nav{
        position: relative; 
        left: 10px;
    }

    .icons_of_nav_bar{
        position: relative;
        top: 50px;
        right:100px;
        color: white;
    }

    .btn_icon_position{
        position: relative;
        right: 100px;
        
    }

   
    .select_language{
        position: relative; 
        top: 1px; 
        left: 290px;
        background: none; 
        border: none; 
        color: white; 
        outline: none;
        width: 50px;
       
    }

    
    /* Full page overlay for the navbar when expanded */
    .navbar-collapse {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.9); /* Dark overlay with transparency */
        z-index: 9999;
        display: flex;
        justify-content: center;
        align-items: center;
        transition: all 0.3s ease;
        color: white;
    }

    .navbar-collapse.show {
        display: flex; /* Ensures the full page overlay appears */
    }

    /* Menu items styling inside the overlay */
    .navbar-nav .nav-item {
        margin: 15px 0;
        text-align: left;
    }
    
    .navbar-nav a {
        color: white;
        font-size: 24px;
        position: relative;
        left: 50px;
    }

    

    /* Hamburger icon */
    .navbar-toggler-icon {
        display: block;
        font-size: 30px;
        color: white;    
    }

    /* X icon for closing the menu */
    .close-icon {
        font-size: 30px;
        color: black;
        display: none;
        position: absolute; /* Make sure the icon is positioned */
        top: 20px; /* Position at the top-right corner of the screen */
        right: 20px;
        z-index: 10000; font-size: 30px;
        color: white;
        display: none;
    }

    /* Show hamburger when collapsed */
    .navbar-toggler.collapsed .navbar-toggler-icon {
        display: inline-block;
    }

    
    .navbar-toggler:not(.collapsed) .navbar-toggler-icon {
        display: none;
    }

    .navbar-toggler:not(.collapsed) .close-icon {
        display: inline-block; 
    }

    

    /* Adjust z-index to ensure the menu covers everything */
    body.no-scroll {
        overflow: hidden; /* Prevent scrolling when the menu is open */
    }
    /* --------------------------------------------------------------------- */
 
   
    
    
    .before_final{
        position: relative;
        top: 250px;
    }
    .final_section{
        position: relative;
        top: 300px;
    }
    .footer {
        text-align: center;
    }
    .icons_of_nav_bar,
    .ch_color_when_scroll,
    .select_language {
        color: white !important;
   
    }
}

@media (max-width:820px) { /* Adjust breakpoint as needed */

    
  
   
}




@media (max-width: 575px) { /* Adjust breakpoint as needed */
    

    
    .nav_bar_icon{
        position: relative; 
        left: 339px; 
        background: none; 
        color: rgb(250, 245, 240 , 0.1); 
        border: none;
    }


    .btn_icon_position{
        position: relative;
        left: -48px;
    }
    
    
    

    .opsition_of_nav_bar{
        position: relative; 
        left: 170px;
    }
   
    .navbar-nav .nav-link {
        display: block;
        padding: 10px;
    }

    .icons_of_nav_bar{
        position: relative;
        top: 50px;
        left:-120px;
    }
   
    .navbar-toggler {
        margin-top: 10px;
    }

    .select_language{
        position: relative; 
        top: 1px; 
        left: 80px;
        background: none; 
        border: none; 
        color: white; 
        outline: none;
        width: 50px;
       
    }

    
    /* Full page overlay for the navbar when expanded */
    .navbar-collapse {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.9); /* Dark overlay with transparency */
        z-index: 9999;
        display: flex;
        justify-content: left;
        align-items: left;
        transition: all 0.3s ease;
    }

    .navbar-collapse.show {
        display: flex; /* Ensures the full page overlay appears */
    }

    /* Menu items styling inside the overlay */
    .navbar-nav .nav-item {
        margin: 15px 0;
        text-align: center;
    }

    .navbar-nav a {
        color: white;
        font-size: 24px;
        position: relative;
        left: -20px;
    }

    /* Hamburger icon */
    .navbar-toggler-icon {
        font-size: 30px;
        color: white;
        
    }

    /* X icon for closing the menu */
    .close-icon {
        font-size: 30px;
        color: black;
        display: none;
        position: absolute; /* Make sure the icon is positioned */
        top: 20px; /* Position at the top-right corner of the screen */
        right: 20px;
        z-index: 10000; font-size: 30px;
        color: white;
        display: none;
    }

    /* Show hamburger when collapsed */
    .navbar-toggler.collapsed .navbar-toggler-icon {
        display: inline-block;
    }

    
    .navbar-toggler:not(.collapsed) .navbar-toggler-icon {
        display: none;
    }

    .navbar-toggler:not(.collapsed) .close-icon {
        display: inline-block; 
    }

    

    /* Adjust z-index to ensure the menu covers everything */
    body.no-scroll {
        overflow: hidden; /* Prevent scrolling when the menu is open */
    }
    /* --------------------------------------------------------------------- */
    

    
    .before_final{
        position: relative;
        top: 200px;
        width: auto;
    }.final_section{
        width: 480px;
   }
   
}


@media (max-width:440px) { /* Adjust breakpoint as needed */

    .size-button{
        width: 70px;
        height: 45px;
    }
    .form-card{
        margin-left: 20px;
        height: fit-content;
    }

    .phone-number{
        font-size: 15px;
    }
    .navbar-toggler{
        margin-left: 400px;
    }
    .fixed_nav_bar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 10px 20px; /* Add some padding for spacing */
        width: 100%;
    }

    .btn_icon_position{
        position: relative;
        left: -130px;
    }

    .opsition_of_nav_bar{
        position: relative;
        bottom: 100px;
    }


    .icons_of_nav_bar{
        position: relative;
        top: 50px;
        left:-50px;
    }
   
    .navbar-toggler {
        margin-top: 10px;
    }

    .select_language{
        position: relative; 
        top: 100px; 
        left: 110px;
        background: none; 
        border: none; 
        color: white; 
        outline: none;
        width: 50px;
       
    }

    
    /* Full page overlay for the navbar when expanded */
    .navbar-collapse {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.9); /* Dark overlay with transparency */
        z-index: 9999;
        display: flex;
        justify-content: left;
        align-items: left;
        transition: all 0.3s ease;
    }

    .navbar-collapse.show {
        display: flex; /* Ensures the full page overlay appears */
    }

    /* Menu items styling inside the overlay */
    .navbar-nav .nav-item {
        margin: 15px 0;
        text-align: left;
    }

    .navbar-nav a {
        color: white;
        font-size: 24px;
        position: relative;
        left: 50px;
    }

   

    /* Hamburger icon */
    .navbar-toggler-icon {
        font-size: 30px;
        color: white;
        
    }

    /* X icon for closing the menu */
    .close-icon {
        font-size: 30px;
        color: black;
        display: none;
        position: absolute; /* Make sure the icon is positioned */
        top: 20px; /* Position at the top-right corner of the screen */
        right: 20px;
        z-index: 10000; font-size: 30px;
        color: white;
        display: none;
    }

    /* Show hamburger when collapsed */
    .navbar-toggler.collapsed .navbar-toggler-icon {
        display: inline-block;
    }

    
    .navbar-toggler:not(.collapsed) .navbar-toggler-icon {
        display: none;
    }

    .navbar-toggler:not(.collapsed) .close-icon {
        display: inline-block; 
    }

    

    /* Adjust z-index to ensure the menu covers everything */
    body.no-scroll {
        overflow: hidden; /* Prevent scrolling when the menu is open */
    }
    /* --------------------------------------------------------------------- */
    

    .opten_lang{
        color: rgb(255, 255, 255); 
        background: rgba(0, 0, 0); 
        opacity: 0.5; 
        font-size: 9px;
        position: relative;
        text-align: center;
    }
    
  
   .final_section{
        width: 575px;
   }
 
}



@media (max-width:300px) { /* Adjust breakpoint as needed */

    
    .navbar-toggler{
        margin-left: 300px;
    }
    .header_bg_imge{
         
        background-size: cover; 
        width: 460px;
        background-repeat: no-repeat; 
        height: 600px;  
        position: relative;
        left: -1px;
          
    }

    .header_bg_imge::before {
        content: '';
        position: absolute;
        top: 0; /* Align to the top */
        left: 0; /* Align to the left */
        right: 0; /* Align to the right */
        bottom: 0; /* Align to the bottom */
        background-color: rgba(0, 0, 0, 0.5); /* Black with 50% opacity */
        border-radius: 10px; /* Match the container border-radius */
    }

    .fixed_nav_bar {
        display: flex;
        align-items: center;
        top: 0;
        justify-content: space-between;
        padding: 10px 20px; /* Add some padding for spacing */
        width: 100%;
        border: rgb(250, 245, 240);
        border-width: 20px;
    }

    .btn_icon_position{
        position: relative;
        left: -130px;
    }

    .opsition_of_nav_bar{
        position: relative;
        bottom: 100px;
    }


    .icons_of_nav_bar{
        position: relative;
        top: 50px;
        left:-50px;
    }
   
    .navbar-toggler {
        margin-top: 10px;
    }

    .select_language{
        position: relative; 
        top: 100px; 
        left: 110px;
        background: none; 
        border: none; 
        color: white; 
        outline: none;
        width: 50px;
       
    }

    
    /* Full page overlay for the navbar when expanded */
    .navbar-collapse {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.9); /* Dark overlay with transparency */
        z-index: 9999;
        display: flex;
        justify-content: left;
        align-items: left;
        transition: all 0.3s ease;
    }

    .navbar-collapse.show {
        display: flex; /* Ensures the full page overlay appears */
    }

    /* Menu items styling inside the overlay */
    .navbar-nav .nav-item {
        margin: 15px 0;
        text-align: left;
    }

    .navbar-nav a {
        color: white;
        font-size: 24px;
        position: relative;
        left: 50px;
    }

   

    /* Hamburger icon */
    .navbar-toggler-icon {
        font-size: 30px;
        color: white;
        
    }

    /* X icon for closing the menu */
    .close-icon {
        font-size: 30px;
        color: black;
        display: none;
        position: absolute; /* Make sure the icon is positioned */
        top: 20px; /* Position at the top-right corner of the screen */
        right: 20px;
        z-index: 10000; font-size: 30px;
        color: white;
        display: none;
    }

    /* Show hamburger when collapsed */
    .navbar-toggler.collapsed .navbar-toggler-icon {
        display: inline-block;
    }

    
    .navbar-toggler:not(.collapsed) .navbar-toggler-icon {
        display: none;
    }

    .navbar-toggler:not(.collapsed) .close-icon {
        display: inline-block; 
    }

    

    /* Adjust z-index to ensure the menu covers everything */
    body.no-scroll {
        overflow: hidden; /* Prevent scrolling when the menu is open */
    }
    /* --------------------------------------------------------------------- */
    

    .opten_lang{
        color: rgb(255, 255, 255); 
        background: rgba(0, 0, 0); 
        opacity: 0.5; 
        font-size: 9px;
        position: relative;
        text-align: center;
    }
   

   .final_section{
        width: 480px;
   }
     
}