import Footer from './footer';
import Header from './header';

function Layout({ children, title, name }) {
    return (
        <div>
            <main className="w-full min-h-screen">
                <header className="w-full fixed top-[12px] sm:top-[21px] md:top-[30px] lg:top-[40px] right-1/2 translate-x-1/2 padding-responsive z-[10]">
                    <Header name={name} />
                </header>
                <section>
                    {children}
                </section>
            </main>
            <footer className="bg-[#F5F5F5] pt-[44px] mt-[100px] bg-banner-footer !bg-center !bg-no-repeat !bg-cover">
                <div className='padding-responsive'>
                    <Footer />
                </div>
            </footer>
        </div>
    )
}

export default Layout