<!DOCTYPE html>
<html lang="es">
    <head>
        <title>Portafolio.la</title>
        
        <meta charset="UTF-8"/>
		
        <link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,700,300' rel='stylesheet' type='text/css'>
        <link rel="stylesheet" href="../static/css/normalize.css">
        <link rel="stylesheet" href="../static/css/estilos.css">
    </head>
    <body>

         <header id="yo" class="Header">
                <nav class="MainMenu">
                <ul class="MainMenu-list">
                    <li class="MainMenu-item">
                        <a class="MainMenu-link" href="#yo">Yo</a>
                    </li>
                    <li class="MainMenu-item">
                        <a class="MainMenu-link" href="#perfil">Perfil</a>
                    </li>
                    <li class="MainMenu-item">
                        <a class="MainMenu-link" href="#trabajo">Trabajo</a>
                    </li>
                    <li class="MainMenu-item">
                        <a class="MainMenu-link" href="#contacto">Contacto</a>
                    </li>
                </ul>
            </nav>
            
            <figure class="Header-imageContainer">
                <img src="../static/images/rodrigo.jpg" alt="Imagen personal" class="Header-image"/>
                <figcaption class="Header-imageDescription">
                    <a class="Header-link" href="http://twitter.com/rodriffo/" target="_black">@rodriffo</a>
                </figcaption>
            </figure>
            
            <p class="Header-name" >Rodrigo Esteban</p>
        </header>
        
        <section id="perfil" class="Profile">
            <div class="u-containerDefault">
                <h2 class="Profile-title u-title">Mi perfil</h2>
                <p class="Profile-description">
                    <strong>Hola!</strong> si <span class="Profile-span">llegaste</span> hasta aqui puedes ver mi portafolio y <em>contactarme</em>
                </p>
                <a class="Profile-link" href="http://twitter.com/rodriffo/" target="_blank">@Rodriffo</a>
                <a class="Profile-link" href="https://www.facebook.com/rodrigo.curipan" target="_blank">Rodrigo Riffo</a>
                <a class="Profile-link" href="https://github.com/rodriffo" target="_blank">Rodriffo</a>
            </div>
        </section>
        

        <section id="trabajo" class="Work">
            <div class="u-containerDefault">
                <h2 class="Work-title u-title">Mi trabajo</h2>
            </div>
            
            <article class="Work-item">
                <figure class="Work-imageContainer">
                    <img class="Work-image" src="../static/images/proyecto.jpg" alt="Es la descripcion de mi imagen">
                    <figcaption class="Work-description">Website de mejorando.la</figcaption>
                </figure>                
            </article>

            <article class="Work-item">
                <figure class="Work-imageContainer">
                    <img class="Work-image" src="../static/images/proyecto.jpg" alt="Es la descripcion de mi imagen">
                    <figcaption class="Work-description">Website de mejorando.la</figcaption>
                </figure>
            </article>

            <article class="Work-item">
                <figure class="Work-imageContainer">
                    <img class="Work-image" src="../static/images/proyecto.jpg" alt="Es la descripcion de mi imagen">
                    <figcaption class="Work-description">Website de mejorando.la</figcaption>
                </figure>
            </article>

            <article class="Work-item">
                <figure class="Work-imageContainer">
                    <img class="Work-image" src="../static/images/proyecto.jpg" alt="Es la descripcion de mi imagen">
                    <figcaption class="Work-description">Website de mejorando.la</figcaption>
                </figure>
            </article>

            <article class="Work-item">
                <figure class="Work-imageContainer">
                    <img class="Work-image" src="../static/images/proyecto.jpg" alt="Es la descripcion de mi imagen">
                    <figcaption class="Work-description">Website de mejorando.la</figcaption>
                </figure>
            </article>

            <article class="Work-item">
                <figure class="Work-imageContainer">
                    <img class="Work-image" src="../static/images/proyecto.jpg" alt="Es la descripcion de mi imagen">
                    <figcaption class="Work-description">Website de mejorando.la</figcaption>
                </figure>
            </article>
        
        </section>


        <footer id="contacto" class="Footer">
            <div class="Footer-left">
                <h3 class="Footer-title">Contacto</h3>
                <p class="Footer-description">Si tienes una sugerencia o quieres trabajar conmigo ponte en contacto con este formulario</p>
            </div>
        
            <form class="Footer-form">
                <input class="Footer-formInput"  type="text" placeholder="Nombre"/>
                <input class="Footer-formInput" type="email" placeholder="Email"/>
                <textarea class="Footer-textarea" placeholder="Motivo"></textarea>
                <button type="submit" class="Footer-button"> Contactarme </button>
            </form>
        
        </footer>

    </body>
</html>
