diff --git a/src/app/pages/homepage/homepage.component.html b/src/app/pages/homepage/homepage.component.html
index 0250982..15f1fe3 100644
--- a/src/app/pages/homepage/homepage.component.html
+++ b/src/app/pages/homepage/homepage.component.html
@@ -4,14 +4,29 @@
 			<img id="backdrop" [src]="this.show.backdrop" alt="backdrop" />
 		</div>
 		<div class="textBox">
-			<p class="show-title"><strong>{{this.show.title}}</strong></p>
-			<br>
+			<h1><p class="title">{{this.show.title}}</p></h1>
+
 			<p class="show-overview">{{this.show.overview}}</p>
-			<br>
+
+			<button mat-raised-button matTooltipPosition="above" matTooltip="Info" class="mr-5" color="accent" (click)="infoClicked()">
+				More infos <mat-icon>info</mat-icon>
+			</button>
+
 			<button mat-raised-button matTooltipPosition="above" matTooltip="Play" class="mr-5" color="accent" (click)="playClicked()">
 				Watch <mat-icon>play_arrow</mat-icon>
 			</button>
 		</div>
 	</div>
+	<br>
+	<div class="arrival">
+		<h3><p class="title">New Arrival</p></h3>
+		<app-episodes-list [episodes]="episodes[season]"></app-episodes-list>
+	</div>
+	<br>
+	<br>
+	<div class="resume">
+		<h3><p class="title">Resume</p> </h3>
+		<app-episodes-list [episodes]="episodes[season]"></app-episodes-list>
+	</div>
 </div>
 
diff --git a/src/app/pages/homepage/homepage.component.scss b/src/app/pages/homepage/homepage.component.scss
index d1f82ba..ea760a6 100644
--- a/src/app/pages/homepage/homepage.component.scss
+++ b/src/app/pages/homepage/homepage.component.scss
@@ -15,13 +15,13 @@
 		margin-left: auto;
 		margin-right: auto;
 		width: 100%;
-		max-height: 100vh;
+		max-height: 80vh;
 		object-fit: cover;
 		min-height: 50vh;
 
 		@include media-breakpoint-up(md)
 		{
-			min-height: 100vh;
+			min-height: 80vh;
 		}
 	}
 
@@ -35,37 +35,42 @@
 		right: 0;
 		background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.6) 100%),
 		   				  linear-gradient(to left,rgba(0, 0, 0, 0.7),rgba(0,0,0,0),rgba(0, 0, 0, 0.6),rgba(0, 0, 0, 1));
+		//@include media-breakpoint-down(md){
+		//	background-image:linear-gradient(to bottom, rgba(0, 0, 0, 0) 50%, rgb(11, 18, 41) 100%),
+		//					linear-gradient(to left,rgba(0, 0, 0, 0.7),rgba(0,0,0,0),rgba(0, 0, 0, 0.6),rgba(0, 0, 0, 1));
+		//}
 	}
 }
 
 .textBox
 {
-	position: static;
 	text-align: justify;
-	//top:90%;
-	margin-top: -10%;
-	padding-left: 3%;
-	padding-right: 3%;
+	padding-left: 2.5em;
 
+	@include media-breakpoint-down(md){
+		position: relative;
+		margin-top: -30%;
+		padding-right: 3%;
+	}
 	@include media-breakpoint-up(md)
 	{
-		top:55%;
 		position: absolute;
-		right: 50%;
+		top:30vh;
+		right: 60%;
 	}
 
 	@include media-breakpoint-up(lg)
 	{
-		top:55%;
 		position: absolute;
-		right: 60%;
+		top:30vh;
+		right: 70%;
 	}
 
 	@include media-breakpoint-up(xl)
 	{
 		position: absolute;
-		top:55%;
-		right: 60%;
+		top:30vh;
+		right: 70%;
 	}
 }
 
@@ -73,23 +78,34 @@
 	position: relative;
 }
 
-.show-title
+.title
 {
-	font-size: x-large;
 	color: white;
 	font-weight: bold;
 	opacity: 100%;
-	@include media-breakpoint-up(lg)
-	{
-		font-size: xx-large;
-	}
-
-	@include media-breakpoint-up(xl)
-	{
-		font-size: xxx-large;
-	}
 }
 .show-overview
 {
 	opacity: 100%;
+	@include media-breakpoint-down(md){
+		position: absolute;
+		visibility: hidden;
+	}
+	@include media-breakpoint-up(md){
+		visibility: visible;
+	}
+	@include media-breakpoint-up(lg){
+		visibility: visible;
+	}
+	@include media-breakpoint-up(xl){
+		visibility: visible;
+	}
+}
+.arrival
+{
+	padding-left: 2.5em;
+}
+.resume
+{
+	padding-left: 2.5em;
 }
diff --git a/src/app/pages/homepage/homepage.component.ts b/src/app/pages/homepage/homepage.component.ts
index 095809c..742aa93 100644
--- a/src/app/pages/homepage/homepage.component.ts
+++ b/src/app/pages/homepage/homepage.component.ts
@@ -47,11 +47,21 @@ export class HomepageComponent implements AfterViewInit, OnDestroy
 		this.route.data.subscribe(data =>
 		{
 			this.show = data.show;
-			//
-			// this.peopleService.getFromShow(this.show.slug).subscribe(x => this.people = x);
 
-			// if (this.show.isMovie)
-			// 	return;
+
+			this.peopleService.getFromShow(this.show.slug).subscribe(x => this.people = x);
+
+			if (this.show.isMovie)
+				return;
+
+			this.seasons = this.show.seasons;
+			if (!this.seasons.find(y => y.seasonNumber === this.season))
+			{
+				this.season = 1;
+				this.getEpisodes(1);
+			}
+			else
+				this.getEpisodes(this.season);
 		});
 	}
 
@@ -68,25 +78,47 @@ export class HomepageComponent implements AfterViewInit, OnDestroy
 			this.router.navigate(["/watch/" + this.show.slug + "-s1e1"]);
 		}
 	}
-  ngAfterViewInit(): void
-  {
-	  this.scrollZone = document.getElementById("main");
-	  this.toolbar = document.getElementById("toolbar");
-	  this.backdrop = document.getElementById("backdrop");
-	  this.toolbar.setAttribute("style", `background-color: rgba(0, 0, 0, 0) !important`);
-	  this.scrollZone.style.marginTop = "0";
-	  this.scrollZone.style.maxHeight = "100vh";
-	  // this.scrollZone.addEventListener("scroll", () => this.scroll());
-  }
 
-  ngOnDestroy(): void
-  {
-	  this.title.setTitle("Kyoo");
-	  this.toolbar.setAttribute("style", `background-color: #000000 !important`);
-	  this.scrollZone.style.marginTop = null;
-	  this.scrollZone.style.maxHeight = null;
-  }
-  scroll(): void {
-	  const opacity: number = 2 * this.scrollZone.scrollTop / this.backdrop.clientHeight;
-  }
+	infoClicked(): void
+	{
+		if (this.show.isMovie) {
+			this.router.navigate(["/show/" + this.show.slug]);
+		}
+		else {
+			this.router.navigate(["/show/" + this.show.slug + "?season=1"]);
+		}
+	}
+	ngAfterViewInit(): void
+	{
+		this.scrollZone = document.getElementById("main");
+		this.toolbar = document.getElementById("toolbar");
+		this.backdrop = document.getElementById("backdrop");
+		this.toolbar.setAttribute("style", `background-color: rgba(0, 0, 0, 0) !important`);
+		this.scrollZone.style.marginTop = "0";
+		this.scrollZone.style.maxHeight = "100vh";
+		this.scrollZone.addEventListener("scroll", () => this.scroll());
+	}
+
+	ngOnDestroy(): void
+	{
+		this.title.setTitle("Kyoo");
+		this.toolbar.setAttribute("style", `background-color: #000000 !important`);
+		this.scrollZone.style.marginTop = null;
+		this.scrollZone.style.maxHeight = null;
+		this.scrollZone.removeEventListener("scroll", () => this.scroll());
+	}
+	scroll(): void {
+		const opacity: number = 2 * this.scrollZone.scrollTop / this.backdrop.clientHeight;
+		this.toolbar.setAttribute("style", `background-color: rgba(0, 0, 0, ${opacity}) !important`);
+	}
+	getEpisodes(season: number): void
+	{
+		if (season < 0 || this.episodes[season])
+			return;
+
+		this.episodeService.getFromSeasonNumber(this.show.slug, this.season).subscribe(x =>
+		{
+			this.episodes[season] = x;
+		});
+	}
 }