Untitled

<!DOCTYPE html>
<html>
    <head>
        <title>Web Warung Tegal</title>
        <style type="text/css">
        </style>
        <!--[if lt IE 9]>
        <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->
    </head>
    <style>
        header, section, footer, aside, nav, article, figure, figcaption,img {
    display: block;}
body {
    color: #666666;
    background-color: #f9f8f6;
    background-image: url("bglagi.png");
    background-position: center;
    font-family: Georgia, Times, serif;
    line-height: 1.4em;
    margin: 0px;}
img {
    height: 190px;
    width: 290px;
    object-fit:fill;
}
.wrapper {
    width: 940px;
    margin: 20px auto 20px auto;
    border: 2px solid #000000;
    background-color: #ffffff;}
header {
    height: 160px;
    background-image: url(header.png);
    background-size: 100%;}
h1 {
    width: 940px;
    height: 130px;
    margin: 0px 30px 0px 30px;
    color:rgba(0, 0, 0, 0);}
nav, footer {
    clear: both;
    color: #ffffff;
    background-color: #aeaca8;
    height: 30px;}
nav ul {
    margin: 0px;
    padding: 5px 0px 5px 30px;}
nav li {
    display: inline;
    margin-right: 40px;}
nav li a {
    color: #ffffff;}
nav li a:hover, nav li a.current {
    color: #000000;}
section.courses {
    float: left;
    width: 659px;
    border-right: 1px solid #eeeeee;}
article {
    clear: both;
    overflow: auto;
    width: 100%;}
hgroup {
    margin-top: 40px;}
figure {
    float: left;
    width: 290px;
    height: 220px;
    padding: 5px;
    margin: 20px;
    border: 1px solid #eeeeee;}
figcaption {
    font-size: 90%;
    text-align: center;}
aside {
    width: 230px;
    float: left;
    padding: 0px 0px 0px 20px;}
aside section a {
    display: block;
    padding: 10px;
    border-bottom: 1px solid #eeeeee;}
aside section a:hover {
    color: #985d6a;
    background-color: #efefef;}
a {
    color: #de6581;
    text-decoration: none;}
h1, h2, h3 {
    font-weight: normal;}
h2 {
    margin: 10px 0px 5px 0px;
    padding: 0px;}
h3 {
    margin: 0px 0px 10px 0px;
    color: #de6581;}
aside h2 {
    padding: 30px 0px 10px 0px;
    color: #de6581;}
footer {
    font-size: 80%;
    padding: 7px 0px 0px 20px;}
    </style>
    <body>
        <div class="wrapper">
            <header>
                <h1>Warung Tegal</h1>
                 <nav>
                   <ul>
                   <li><a href="" class="current">beranda</a></li>
                   <li><a href="">daftar masakan</a></li>
                   <li><a href="">katering</a></li>
                   <li><a href="">tentang</a></li>
                   <li><a href="">kontak</a></li>
                  </ul>
                 </nav>
               </header>
               <section class="courses">
                <iframe width="600" height="345" src="https://www.youtube.com/embed/mTPhFUQnpAU"
                title="YouTube video player" frameborder="0"
                allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
                style="margin: 20px;" allowfullscreen></iframe>
                <article>
                  <figure>
                   <img src="soto.jpg" alt="soto" />
                   <figcaption>Soto Indonesia</figcaption>
                  </figure>
                  <hgroup>
                   <h2>Soto Ayam</h2>
                   <h3>Makanan Berkuah</h3>
                  </hgroup>
                  <p>Soto ayam adalah makanan khas Indonesia yang berupa
                  sejenis sup ayam dengan kuah yang berwarna kekuningan.</p>
                </article>
                <article>
                  <figure>
                   <img src="pecel.jpg" alt="pecel" />
                   <figcaption>Pecel Indonesia</figcaption>
                  </figure>
                  <hgroup>
                       <h2>Masakan Pecel</h2>
                   <h3>Makanan dengan Bumbu Kacang</h3>
                  </hgroup>
                  <p>Pecel adalah makanan yang menggunakan bumbu sambal
                  kacang sebagai bahan utamanya yang dicampur dengan aneka jenis sayuran.</p>
                </article>
                <article>
                    <figure>
                     <img src="rawon.jpg" alt="pecel" />
                     <figcaption>Rawon Indonesia</figcaption>
                    </figure>
                    <hgroup>
                         <h2>Rawon Daging</h2>
                     <h3>Makanan Berkuah</h3>
                    </hgroup>
                    <p>Rawon  merupakan  kuliner khas Jawa Timur, berupa sup daging dengan kuah berwarna hitam.
                        Warna hitam dari kuah Rawon berasal dari buah kepayang atau sering disebut dengan kluwak.
                    </p>
                  </article>
               </section>
               <aside>
                <section class="popular-recipes">
                 <h2>Masakan Populer</h2>
                   <a href="">Sayur Sop</a>
                   <a href="">Sayur Asem</a>
                   <a href="">Sayur Lodeh</a>
                   <a href="">Sayur Bayam</a>
                </section>
                <section class="contact-details">
                 <h2>Kontak</h2>
                  <p>Warung Tegal<br />
                  di seluruh indonesia
                </section>
              </aside>
              <footer>
                &copy; 2015 Warung Tegal
            </footer>
        </div><!-- .wrapper -->
    </body>
</html>