@media screen and (max-width: 1000px) {
    .container {
        width: auto;
    }

        .modulor_top_tab-bar__layout__1_49_0 {
    display: none;
}
    #top-container {
        display: block;
    }
    .target-menu-class {
    
        width: 100%;
        top: 50px; /* Adjust this value according to your header height */
        position: fixed; /* Fixes the menu at the top */
        padding: 20px 0;
    }

    /* Ensure the visible class applies correctly on mobile */
    .target-menu-class.visible {
        display: flex;
        flex-direction: column;
        align-items: center;
        z-index: 9999; /* Ensure it is above other content */
    }

    /* Additional styles to ensure the menu displays correctly */
    .target-menu-class ul {
        flex-direction: column;
        align-items: center;
    }

    .target-menu-class ul li {
        width: 100%;
        text-align: center;
        margin: 10px 0;
    }

    .target-menu-class ul li a {
        width: 100%;
        padding: 10px 0;
        display: block;
        text-align: center;
    }
}


    
    /* Adjust position and style of the burger icon */
    header .burger {
        display: block;
        width: 40px;
        height: 40px;
        transition: 0.5s all linear;
        margin-top: 10px;
        cursor: pointer;
        position: relative;
        float: right;
    }

    /*header.active .burger {
        background: url('../img/close.svg') center / cover no-repeat;
    }*/

    /* Adjust menu to be displayed below the header */
    header nav ul {
        position: absolute;
        display: none;
        flex-direction: column;
        padding: 35px 25px;
        left: 0;
        width: 100%;
        height: auto;
        background-color: #181818;
        transition: 0.5s all linear;
        z-index: 10;
    }

    .burger.active svg path {
    fill: #FF0000; /* Example: change color on active */
}

    /* Show the menu when header has 'active' class */
    header.active nav ul {
    display: flex;
    flex-direction: column;
    padding: 35px 25px;
    position: absolute;
    top: 60px;
    left: 0;
    width: 100%;
    background-color: #181818;
    transition: 0.5s all linear;
    z-index: 10;
}

    /* Adjust width of the buttons to fit screen width */
header aside:last-child {
    display: flex;
    align-items: center;
    padding: 17px 0px 15px 40px;
    width: auto; /* Ensure it stretches across the screen */
    max-width: none; /* Remove any max-width restrictions */
    box-sizing: border-box; /* Ensure padding is included in width */
}
    header nav .burger {
        display: block;
        width: 40px;
        height: 40px;
        transition: 0.5s all linear;
        margin-top: 10px;
    }

    header.active nav .burger {
        background: url('../img/close.svg') center / cover no-repeat;
    }
    /* Adjust width of the registration button */
   /* header aside:last-child .button.registration {
        margin-right: 10px;
        width: calc(100% - 30px); 
        transition: 0.5s all linear;
    } */



    /* Stop pulsating on hover */
    header aside:last-child .button.registration:hover {
        animation: none;
    }


    /* Hover effect for buttons */
    header aside:last-child .button:hover {
        background: linear-gradient(110.22deg, #b9ff2e -2.69%, #b9ff2e 13.07%, #b9ff2e 44.89%);
    }



    /* Adjust font sizes and spacing for smaller screens */
    .intro h1 {
        font-size: 33px;
        line-height: 1.2;
    }

    .intro h1 span {
        font-size: 33px;
    }


    .intro h2 {
        font-size: 33px;
    }

    .intro h3 {
        font-size: 20px;
    }

    .content h2,
    .content-title {
        font-size: 30px;
        line-height: 1.2;
    }

    .content h3 {
        font-size: 22px;
    }

    .container .row {
        margin: 0 auto;
        width: 90%;
    }

    footer {
        margin: 0 0 170px 0;
        display: block;
        height: 45px;
        width: auto;
        align-self: center;
    }
/*
.burger.active {
    background: url('../img/close.svg') center / cover no-repeat;
} */
    .content img {
        margin: 20px 0;
        width: 100%;
        height: 100% !important;
    }

    footer .logo,
    footer .logo p {
        height: 30px;
    }

 
.content-container {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin: 60px 0;
  }
  
  .content-container .image-container img {
	max-width: 400px;
	height: auto;
	border-radius: 10px;
  }
  
 
  @media screen and (min-width: 768px) {
	.content-container {
	  flex-direction: row;
	  justify-content: space-between;
	  align-items: center;
	  text-align: left;
      margin: 80px 0 0 0;
	}
  
	.content-container .image-container {
	  flex: 1;
	  margin-right: 20px; /* Space between image and text */
	}
  
	.content-container .text-container {
	  flex: 2;
	}
  
	.content-container .text-container h1 {
	  font-size: 36px;
	  margin-bottom: 20px;
	}
  
	.content-container .text-container p {
	  font-size: 14px;
	  margin-bottom: 20px;
	}
  
	.content-container .text-container .button {
	  font-size: 16px;
	}
  }
  
  /* Mobile layout */
  @media screen and (max-width: 768px) {
	.content-container {
	  flex-direction: column;
	  align-items: center;
	  text-align: center;
      margin: 20px 0 0 0;
	}

    .buttonmain {
        font-weight: bold;
        margin: -12px 0 50px 0;
        padding: 10px 65px; 
        background: #f2f740; 
        white-space: nowrap;
        border-radius: 32px;
        text-decoration: none;
        align-self: center;
        transition: 0.5s all linear;
        text-align: center;
        animation: pulsate 2s infinite alternate ease-in-out;
    }

    @keyframes pulsate {
        0% {
            transform: scale(1);
            background: #f2f740;
            
        }
        100% {
            transform: scale(1.15);
            background: #e1f732;
           
        }
    }
  
	.content-container .image-container {
	  width: 100%;
	  margin-bottom: 20px;
	}
  
	.content-container .image-container img {
	  width: 100%;
	  max-width: 300px; /* Fixed size for the image */
	  height: auto;
	}
  
	.content-container .text-container {
	  width: 100%;
	  padding: 0 20px;
	}
  
	.content-container .text-container h1 {
	  font-size: 24px;
	  margin-bottom: 15px;
	}
  
	.content-container .text-container p {
	  font-size: 14px;
	  margin-bottom: 20px;
	}
  
	
  }