<!DOCTYPE html>
<html>

  <head>
    <link rel="stylesheet" href="style.css">
    <script src="script.js"></script>
  </head>

  <body>
    <h1>My Portfolio!</h1>
<br/>

<h4> “You've baked a really lovely cake, but then you've used dog shit for frosting.” 
― Steve Jobs</h4>
<br/>
		
			<div id="menu">
				<ul>
					<li class="current_page_item"><a href="http://plnkr.co/edit/0fBFNY6VwUFyjiI0Jjq7?p=preview">Why Humanities should go coding?</a></li>
						</ul>
			</div>
			<p> An essay discussing why humanitites should actually learn how to code, and its direct relevance for the field.  </p>
			<ul>
								<li><a href="http://plnkr.co/edit/wc1M4qGGH76iRtVrYhFR?p=info">How good are you on coding?</a></li>
			</ul>
	<br/>
		<div id="column1">
			<h2>Learning how to code</h2>
			<p><img src="http://i.kinja-img.com/gawker-media/image/upload/s--DgonU0qj--/17kxity6lna44jpg.jpg" class="medium"/></p>
			<p>Learning how to code can be really fun, however it can sometimes be frustating and disappointing. In order to avoid stress and anxiety, it is recommendable to read about the subject and practise as much as you can, this should help to develop your skills and knowledge.</p>
			<p class="button"> <a href="http://www.codecademy.com/"> Learn coding here </a></p>
		</div>
		
		<br />
    <br />	
    <br />
		
	<h2>Brazil, a brief overview</h2>
					<ul>
					<li><a href="http://kids.nationalgeographic.com/content/kids/en_US/explore/countries/brazil/_jcr_content/content/textimage_0/image.img.gif/1396531512298.gif">Where is Brazil?</a></li>
					<br/>
					<li><a href="https://vencentral.files.wordpress.com/2008/10/las-del-uni-343.jpg">Take a look from a different perspective</a></li>
					<br/>
					<li><a href="http://en.wikipedia.org/wiki/Brazil">The country</a></li>

					</ul> 
			



<hr />




	<img src="http://www.infohostels.com/immagini/news/2376.jpg" class="large"/>
	
	<p> <p style="color:red;font-family:Arial; font-size:25px"> Hello everyone! </p> 
	<p> I am a British Brazilian single man living in the Netherlands, doing new media studiesa, and trying to get my head around computer programming among other things as well as taking life easy.</p>
	<br/>
	<p>Below you can find some about my personal interests.</p>
	<ul>
	    <li> <strong>Interests</strong>
	    <br/>
	        <ol> 
	        <br/>
	            <li> <a>Music</a></li>
	            <br/>
	            <li> Theatre</li><br/>
	        </ol>     
	     </li>
	     
	     <li><strong>Travel</strong>
	     <br/>
	       <ol> 
	       <br/>
	        <li> America</li><br/>
	        <li> Europe</li><br/>
	        </ol>
	        </li>
	       
	     <li><strong> Food</strong> 
	       <ul> <br/>
	         <li> Italian</li><br/>
	         <li> Japanese </li><br/>
	         </ul> 
	     
	     <li><strong> Jobs</strong>
	        <ol> <br/>
	            <li> Communication officer</li><br/>
	            <li> Film maker </li><br/>
	        </ol>
	      </li>         
	     
	       <li><strong> Favourite quotes</strong>
	         <ol> <br/>
	            <li> ' Frankly my dear, I don't give a dam'</li>
	         </ol>
	        </li> 
	  </ul>    
	  
	  <hr />
	  
	  <h2> My favourite places in Brazil</h2>
	  
	  	<p> Click on the pictures and find out more about it.  </p>
	  	<table>
	    <thead>
	        <th>
	        </th>
	    </thead>
	    <tbody>
	    <tr>
	        <td>
	        <a href="http://en.wikipedia.org/wiki/Florian%C3%B3polis"><img src="http://socialgoodbrasil.org.br/wp-content/uploads/2014/09/phoca_thumb_l_florianopolis1.jpg"></a>
	        </td>
        	<td>
        	<a href="http://en.wikipedia.org/wiki/Florian%C3%B3polis"><img src="http://www.perfectweddingsabroad.co.uk/published/publicdata/PWANEW/attachments/SC/products_pictures/Ponta-Dos-Ganchos.jpg"></a>
	        </td>
	        <td>
	        <a href="http://en.wikipedia.org/wiki/Florian%C3%B3polis"><img src="http://www.brasil-turismo.com/mapas/mapa/mapa-florianopolis.gif"></a>
	        </td>
	    </tr>
	    <tr>
	        <td>
	        <a href="http://en.wikipedia.org/wiki/Florian%C3%B3polis"><img src="http://www.dolarturismoitajai.com.br/site/wp-content/uploads/2012/05/florianopolis.jpg"></a>
	        </td>
	        <td>
	        <a href="http://en.wikipedia.org/wiki/Florian%C3%B3polis"><img src="http://www.mapas-sc.com/fotos/florianopolis-sc.jpg"></a>
	        </td>
	        <td>
	        <a href="http://en.wikipedia.org/wiki/Florian%C3%B3polis"><img src="http://www.etraveltrips.com/blog/wp-content/uploads/2013/02/Florianopolis-Brazil.jpg"></a>
	        </td>
	     </tr>
	     <tr>
	        <td>
	        <a href="http://en.wikipedia.org/wiki/Florian%C3%B3polis"><img src="http://www.braziltrails.com/wp-content/gallery/home/kite.jpg"></a>
	        </td>
	        <td>
	        <a href="http://en.wikipedia.org/wiki/Florian%C3%B3polis"><img src="http://lumisaparthotel.com.br/site/termas/wp-content/uploads/sites/7/2013/03/turismo_florianopolis_scuna_sul.jpg"></a>
	        </td>
	        <td>
	        <a href="http://en.wikipedia.org/wiki/Florian%C3%B3polis"><img src="http://www.radarsul.com.br/wp-content/uploads/2014/07/cruzesousa-florianopolis-sc-1.jpg"></a>
	     </tr>
	</tbody>
	</table>
	
	<hr />
	 



<h1>Quiz: What do you know about Brazil.</h1>
  
 

<form name="quiz">
  
  <p>1. Which is the capital of the largest country in South America?</p>
  <ol style="margin-top: 1pt">
    <li>Brasilia</li>
    <li>Rio de Janeiro</li>
    <li>Sao Paulo</li>
  </ol>

  <p>2. What is the largest city in Brazil?</p>
  <ol style="margin-top: 1pt">
    <li>Sao Paulo</li>
    <li>Porto Alegre</li>
    <li>Salvador</li>
  </ol>

  <p>3. What Tropic runs through Brazil?</p>
  <ol style="margin-top: 1pt">
    <li>Tropic of Cancer</li>
    <li>tropic of Capricorn</li>
   
  </ol>

  <p>4. How many times did the Brazilian national team win the World Cup?</p>
  <ul style="margin-top: 1pt">
    <li>3</li>
    <li>5</li>
    <li>4</li>
  </ul>

  <p>5. What national team has scored the most against the Brazilian national team?</p>
  <ul style="margin-top: 1pt">
    <li>france</li>
    <li>The Netherlands</li>
    <li>Germany</li>
  </ul>

 
  
	   
	</body>
</html>
// Code goes here

body {
    background-color: #FFA07A;
} 

h1 {
    color: MidnightBlue; text-align: center
}

h2 {
    color: MidnightBlue; text-align: center
}

h4 {
    font: Courier; text-align: center; font-size: 12px;
}

img {
	width:100px;
	height:100px;
}

table, td {
	border: 1px #70b8ff dashed;
}

.button a {
	display: block;
	float: left;
	width: 88px;
	padding: 5px 5px;
	margin-right: 10px;
	background: #132434;
	border-radius: 5px;
	color: grey;
	text-align: center;
	text-decoration: none;
}

img.large {width: 800px; height: 450px}

img.medium {width: 450px; height: 250px}
/* Styles go here */