I used Flex box and for Responsiveness i used Media queries.

Hello Deepu, congratulations on completing your project, it was very well done.

I would like to give a suggestion, you could also use the email pattern in JavaScript, storing it in a variable, which would help keep your HTML cleaner, but this is more a matter of taste, your project as it is, is good.

Now, a tip about CSS, when you are using font size, I strongly recommend using rem, because this unit of measurement is able to adjust to the user's font settings, thus providing more responsiveness and accessibility to your page.

Another tip, now related to HTML, would be to use more semantic tags, your HTML structure is correct, but it lacks semantics. Some examples:

• <div class="image-container"> instead of using a div, you could use a <figure>, because this is a main image of your page.
• <div class="container"> instead of using a div, here you could use an <article>, because the content here is self-explanatory.

And another thing I noticed in your HTML, is that you used a <div> to create the form, it is more recommended to use a <form>, as that is a form area, so it is the most correct. Just note that if you use the <form>, in your JavaScript, you have to do something like this:

const form = document.querrySelector('#form')

form.addEventListener('submit', (e)=>{
    e.preventDefault()
})

This way you prevent the form from reloading the page when the button is pressed.

And again, congratulations on your project, it was very well done, and your JavaScript is very good, keep practicing and improving, if you have any doubts, please comment below and I will try to help in the best way possible.