Untitled

\documentclass[a4paper]{article}

%% Language and font encodings
\usepackage[english]{babel}
\usepackage[utf8x]{inputenc}
\usepackage[T1]{fontenc}

%% Sets page size and margins
\usepackage[a4paper,top=2cm,bottom=2cm,left=2cm,right=2cm,marginparwidth=1.75cm]{geometry}

%% Useful packages
\usepackage{amsmath}
\usepackage{graphicx}
\usepackage[colorinlistoftodos]{todonotes}
\usepackage[colorlinks=true, allcolors=blue]{hyperref}

\usepackage{listings}
\usepackage{color}

\definecolor{dkgreen}{rgb}{0,0.6,0}
\definecolor{gray}{rgb}{0.5,0.5,0.5}
\definecolor{mauve}{rgb}{0.58,0,0.82}

\lstset{frame=tb,
  language=Html,
  aboveskip=3mm,
  belowskip=3mm,
  showstringspaces=false,
  columns=flexible,
  basicstyle={\small\ttfamily},
  numbers=none,
  numberstyle=\tiny\color{gray},
  keywordstyle=\color{blue},
  commentstyle=\color{dkgreen},
  stringstyle=\color{mauve},
  breaklines=true,
  breakatwhitespace=true,
  tabsize=3
}

\title{Your Paper}
\author{You}

\begin{document}


%\begin{table}[]
%\centering
%\caption{Name and ID}
%\label{my-label}
%\begin{tabular}{ll}
%AXEL BUEE           & 17040128 \\
%HUGO MAXENCE VERJUS & 17040129 \\
%KYUNGBIN CHO        & 16011106
%\end{tabular}
%\end{table}
\section*{Overview}
\includegraphics[width=\textwidth]{cat.png}
\newpage
\section*{Code}
\begin{lstlisting}
<!DOCTYPE html>
<html>
<head>
<title>Kittens are life</title>
</head>
<style>
table {
    font-family: arial, sans-serif;
    border-collapse: collapse;
    width: 100%;
}
td, th {
    border: 1px solid #aaaaaa;
    text-align: left;
    padding: 8px;
}
tr:nth-child(even) {
    background-color: #dddddd;
}
tr:nth-child(odd) {
    background-color: #bbbbbb;
}
</style>
<h1 style="color:green;font-family:georgia;">Cat,Kitty,Kittens</h1>
<h3 style="color:orange;font-family:verdana;">Small description of a cat.</h3>
<p style="color:red;">A cat is a small animal  furry, <strong>carnivorous</strong>, <del>mean</del>  and mammal.</p>
<body bgcolor="#E6E6FA">
<table><tr><th>Name</th><th>ID</th><th>Country</th></tr>
<tr><td>AXEL BUEE</td><td>17040128</td><td>France</td></tr>
  <tr><td>HUGO MAXENCE VERJUS</td> <td>17040129</td><td>France</td></tr>
  <tr><td>KYUNGBIN CHO </td><td>16011106</td><td>South Korea</td></tr></table>

<h3 style="color:orange;font-family:verdana;">Quotations about cats.</h3>

<div style="background-color:grey;color:white;padding:10px;">
  <blockquote cite="http://www.worldwildlife.org/who/index.html">
"If animals could speak, the dog would be a blundering outspoken fellow; but the cat would have the rare grace of never saying a word too much."  - Mark Twain
</blockquote>
</div>
<h3 style="color:orange;font-family:verdana;">Team Goals</h3>
<div style="background-color:grey;color:white;padding:10px;">
    Our Goal is to create a website to share experiences about Cats; and spread images of them.
</div>
<h3 style="color:orange;font-family:verdana;">Cat Cafe map</h3>
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d393.9790083385113!2d
-122.26323259126062!3d37.81740231926654!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2
!1s0x808f8754e3519f3b%3A0x5d394fab3869a7ff!2sCat+Town+Cafe!5e0!3m2!1sko!2skr!4v14899759
24953" width="400" height="300" frameborder="0" style="border:0" allowfullscreen></iframe>
<a title="Click me to see a new cat !" href="new 1.html"><img src="http://thecatapi.com/api/images/get?format=src&type=gif" width="400" height="300"></a>
<form action="#">
Your favorite cat:<br>
<input type="text" name="firstname" value="">
<br>
<input type="submit" value="Send">
<input type="reset" value="Reset">
</form>
</body>
</html>
\end{lstlisting}

\end{document}