<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style.css">
    <title>Document</title>
</head>
<body>
    <nav>
        <ul>
            <li>VELKOMMEN</li>
            <li class="currentPage">PROGRAM</li>
            <li>OM FESTIVALEN</li>
            <li>KONTAKT</li>
        </ul>
    </nav>
    <main>
        <section class="basicInfo">
            <div>
                <img src="img/logo-food-festival.svg" alt="plate and fork">
            </div>
            <h1>Food Festival</h1>
            <p>20-21. august 2016</p>
        </section>
        <section class="guests">
            <h2>Festivalens gæster</h2>
            <div class="guestContainer">
                <div class="guest">
                    <div>
                        <h5>LØRDAG</h5>
                    </div>
                    <div class="picture">
                        <img src="img/guest-mette-blomsterberg.jpg" alt="mette blomsterberg">
                    </div>
                    <div class="info">
                        <h6>
                            Mette Bomsterberg
                        </h6>
                        <p>
                            Lørdag kl. 12:00
                        </p>
                    </div>
                </div>
                <div class="guest">
                    <div>
                        <h5>LØRDAG</h5>
                    </div>
                    <div class="picture">
                        <img src="img/guest-camilla-plum.jpg" alt="">
                    </div>
                    <div class="info">
                        <h6>
                            Camilla Plum
                        </h6>
                        <p>
                            Lørdag kl. 14:00
                        </p>
                    </div>
                </div>
                <div class="guest">
                    <div>
                        <h5>LØRDAG</h5>
                    </div>
                    <div class="picture">
                        <img src="img/guest-rene-redzepi.jpg" alt="">
                    </div>
                    <div class="info">
                        <h6>
                            Rene Redzepi
                        </h6>
                        <p>
                            Lørdag kl. 16:00
                        </p>
                    </div>
                </div>
                <div class="guest">
                    <div>
                        <h5>LØRDAG</h5>
                    </div>
                    <div class="picture">
                        <img src="img/guest-henrik-boserup.jpg" alt="">
                    </div>
                    <div class="info">
                        <h6>
                            Henrik Boserup
                        </h6>
                        <p>
                            Lørdag kl. 20:00
                        </p>
                    </div>
                </div>
                
                <div class="guest">
                    <div>
                        <h5>SØNDAG</h5>
                    </div>
                    <div class="picture">
                        <img src="img/guest-mik-schack.jpg" alt="">
                    </div>
                    <div class="info">
                        <h6>
                            Mik Schack
                        </h6>
                        <p>
                            Søndag kl. 10:00
                        </p>
                    </div>
                </div>
                <div class="guest">
                    <div>
                        <h5>SØNDAG</h5>
                    </div>
                    <div class="picture">
                        <img src="img/guest-chili-klaus.jpg" alt="">
                    </div>
                    <div class="info">
                        <h6>
                            Chili Klaus
                        </h6>
                        <p>
                            Søndag kl. 12:00
                        </p>
                    </div>
                </div>
                <div class="guest">
                    <div>
                        <h5>SØNDAG</h5>
                    </div>
                    <div class="picture">
                        <img src="img/guest-soren-gericke.jpg" alt="">
                    </div>
                    <div class="info">
                        <h6>
                            Søren Gericke
                        </h6>
                        <p>
                            Søndag kl. 14:00
                        </p>
                    </div>
                </div>
                <div class="guest">
                    <div>
                        <h5>SØNDAG</h5>
                    </div>
                    <div class="picture">
                        <img src="img/guest-price.jpg" alt="">
                    </div>
                    <div class="info">
                        <h6>
                            Brødrene Price
                        </h6>
                        <p>
                            Søndag kl. 16:00
                        </p>
                    </div>
                </div>
            </div>
        </section>
        <section class="program">
            <h2>
                Festivalens program
            </h2>
            <div class="schedule">
                <div>
                    <h3>Lørdag</h3>
                    <div class="hourshedule">
                        <div class="circleTime">
                            10:00
                        </div>
                        <div class="info">
                            <h6>
                                Officiel åbning af Food Festival
                            </h6>
                            <p>
                                Borgmester Anders Andersen byder velkommen
                            </p>
                        </div>
                    </div>
                    <div class="hourshedule">
                        <div class="circleTime">
                            12:00
                        </div>
                        <div class="info">
                            <h6>
                                Undgå at dit bagværk går i kage
                            </h6>
                            <p>
                                Ved Mette Blomsterberg
                            </p>
                        </div>
                    </div>
                    <div class="hourshedule">
                        <div class="circleTime">
                            14:00
                        </div>
                        <div class="info">
                            <h6>
                                Tips fra den sorte gryde
                            </h6>
                            <p>
                                Ved Camilla Plum
                            </p>
                        </div>
                    </div>
                    <div class="hourshedule">
                        <div class="circleTime">
                            16:00
                        </div>
                        <div class="info">
                            <h6>
                                Det nordiske køkken
                            </h6>
                            <p>
                                Ved Rene Redzepi
                            </p>
                        </div>
                    </div>
                    <div class="hourshedule">
                        <div class="circleTime">
                            18:00
                        </div>
                        <div class="info">
                            <h6>
                                Danske ølentusiaster præsenterer
                            </h6>
                            <p>
                                Ved Anne Lise Knørr
                            </p>
                        </div>
                    </div>
                    <div class="hourshedule">
                        <div class="circleTime">
                            20:00
                        </div>
                        <div class="info">
                            <h6>
                                Sådan laver du en juicy burger
                            </h6>
                            <p>
                                Ved Henrik Boserup
                            </p>
                        </div>
                    </div>
                </div>  
                <div>
                    <h3>Søndag</h3>
                    <div class="hourshedule">
                        <div class="circleTime">
                            10:00
                        </div>
                        <div class="info">
                            <h6>
                                Tilbage til rødderne
                            </h6>
                            <p>
                                Ved Mik Schack
                            </p>
                        </div>
                    </div>
                    <div class="hourshedule">
                        <div class="circleTime">
                            12:00
                        </div>
                        <div class="info">
                            <h6>
                                Det er farven der gør forskellen
                            </h6>
                            <p>
                                Ved Chili-Klaus med gæst
                            </p>
                        </div>
                    </div>
                    <div class="hourshedule">
                        <div class="circleTime">
                            14:00
                        </div>
                        <div class="info">
                            <h6>
                                Meninger om mad
                            </h6>
                            <p>
                                Ved Søren Gericke
                            </p>
                        </div>
                    </div>
                    <div class="hourshedule">
                        <div class="circleTime">
                            16:00
                        </div>
                        <div class="info">
                            <h6>
                                Food Festival mod madspild
                            </h6>
                            <p>
                                Ved Selinda Juul
                            </p>
                        </div>
                    </div>
                    <div class="hourshedule">
                        <div class="circleTime">
                            18:00
                        </div>
                        <div class="info">
                            <h6>
                                Pøller på grillen
                            </h6>
                            <p>
                                Ved brødrene Price
                            </p>
                        </div>
                    </div>
                    <div class="hourshedule">
                        <div class="circleTime">
                            20:00
                        </div>
                        <div class="info">
                            <h6>
                                Officiel afslutning med overraskelse
                            </h6>
                            <p>
                                Borgmester Anders Andersen takker af
                            </p>
                        </div>
                    </div>
                </div>             
            </div>
        </section>
        <section class="contact">
            <h2>
                Kontakt eller bestil
            </h2>
            <div class="contactInfo">
                <div>
                    <h6>
                        Kontakt-info
                    </h6>
                    <p>Food Festival</p>
                    <p>Økologivej 1</p>
                    <p>1000 Ren By</p>
                    <p>kontakt@food-festival.dk</p>
                    <p>www.food-festival.dk</p>
                </div>
                <div>
                    <h6>
                        Bestil billet
                    </h6>
                    <p>Det er gratis at deltage i selve festivalen, men udvalgte arrangementer koster penge.</p>
                    <p>Du kan bestille billet på <span class="website">www.ticketmaster.dk</span> eller her på websitet ved at klikke på knappen "Bestil billet" herunder.</p>
                </div>
            </div>
            <div class="button">
                Bestil billet
            </div>
        </section>
        <section class="sponsors">
            <h2>
                Sponsorer
            </h2>

            <div>
                <div>
                    <img src="img/logo-sponsor-thise.png" alt="">
                </div>
                <div>
                    <img src="img/logo-sponsor-arla.png" alt="">
                </div>
                <div>
                    <img src="img/logo-sponsor-okologisk-landsforening.png" alt="">
                </div>
                <div>
                    <img src="img/logo-sponsor-urtekram.jpg" alt="">
                </div>
                <div>
                    <img src="img/logo-sponsor-dansk-kodkvaeg.png" alt="">
                </div>
            </div>
        </section>
    </main>
</body>
</html>