9 files changed, 21 insertions, 18 deletions
diff --git a/src/web/css/site.css b/src/web/css/site.css
deleted file mode 100644
index e69de29..0000000
--- a/src/web/css/site.css
+++ /dev/null
diff --git a/src/web/pages/index.html b/src/web/pages/index.html
deleted file mode 100644
index 0f77228..0000000
--- a/src/web/pages/index.html
+++ /dev/null
@@ -1,2 +0,0 @@
-<!DOCTYPE html>
-</html>
-\ No newline at end of file
diff --git a/src/web/src/app/film/film.component.html b/src/web/src/app/film/film.component.html
index 4331ebb..09f92ff 100644
--- a/src/web/src/app/film/film.component.html
+++ b/src/web/src/app/film/film.component.html
@@ -61,13 +61,15 @@
             </div>
         </div>
     </div>
-    <div class="wrapper-content" *ngIf="loading">
-        <div class="wrapper-wrapper container">
-            <div
-                class="container main-div d-flex justify-content-center align-items-center h-100"
-            >
-                <mat-spinner color="primary" mode="indeterminate"></mat-spinner>
-            </div>
-        </div>
+    <div
+        class="container"
+        *ngIf="loading"
+        style="position: fixed; top: 50%; left: 45%"
+    >
+        <mat-spinner
+            color="primary"
+            mode="indeterminate"
+            [diameter]="60"
+        ></mat-spinner>
     </div>
 </div>
diff --git a/src/web/src/app/film/film.component.ts b/src/web/src/app/film/film.component.ts
index 4e64a34..f3c002c 100644
--- a/src/web/src/app/film/film.component.ts
+++ b/src/web/src/app/film/film.component.ts
@@ -56,7 +56,7 @@ export class FilmComponent implements OnInit {
         private route: ActivatedRoute,
         private service: MovieTVService,
         private scraper: ScrapeService
-    ) {}
+    ) { }
     ngOnInit(): void {
         this.route.paramMap.subscribe((x) => {
             this.type = x.get('type');
@@ -89,9 +89,9 @@ export class FilmComponent implements OnInit {
 
     getProviderImage(i: number) {
         console.log(
-            (this.providers[i] as string).toLowerCase().replace(/ /g, '')
+            (this.providers[i] as string).toLowerCase().replace(/ /g, '').replace('+', 'plus')
         );
-        return (this.providers[i] as string).toLowerCase().replace(/ /g, '');
+        return (this.providers[i] as string).toLowerCase().replace(/ /g, '').replace('+', 'plus');
     }
 
     getLink(i: number) {
diff --git a/src/web/src/app/search-item/search-item.component.html b/src/web/src/app/search-item/search-item.component.html
index 9a3beba..b568d8e 100644
--- a/src/web/src/app/search-item/search-item.component.html
+++ b/src/web/src/app/search-item/search-item.component.html
@@ -1,6 +1,6 @@
 <div class="row p-0">
     <div class="col-md-2 col-sm-2 text-center p-1">
-        <img [src]="getImage()" alt="Not Found" class="example-option-img" />
+        <img [src]="getImage()" alt="" class="example-option-img" />
     </div>
     <div class="search-item-text col-sm-8 col-md-8">
         <div
diff --git a/src/web/src/assets/img/platforms/abc.png b/src/web/src/assets/img/platforms/abc.png
new file mode 100644
index 0000000..b49a0c2
--- /dev/null
+++ b/src/web/src/assets/img/platforms/abc.png
diff --git a/src/web/src/assets/img/platforms/disney+.png b/src/web/src/assets/img/platforms/disneyplus.png
index 2071539..2071539 100644
--- a/src/web/src/assets/img/platforms/disney+.png
+++ b/src/web/src/assets/img/platforms/disneyplus.png
diff --git a/src/web/src/assets/img/platforms/vudu.png b/src/web/src/assets/img/platforms/vudu.png
new file mode 100644
index 0000000..82152a0
--- /dev/null
+++ b/src/web/src/assets/img/platforms/vudu.png
diff --git a/src/web/src/styles.css b/src/web/src/styles.css
index 4ac6ab4..582bc24 100644
--- a/src/web/src/styles.css
+++ b/src/web/src/styles.css
@@ -85,11 +85,16 @@ body {
     margin-bottom: 10px !important;
 }
 
+.mat-active {
+    background-color: blue;
+}
+
 .cards-list {
     display: flex;
     justify-content: space-around;
     width: 100%;
     flex-wrap: wrap;
+    padding-bottom: 5%;
 }
 
 .card {
@@ -117,11 +122,9 @@ body {
 
 .card .card_title {
     text-align: center;
-    border-radius: 0px 0px 40px 40px;
-    font-family: sans-serif;
     font-weight: bold;
-    font-size: 18px;
-    height: 40px;
+    font-size: 15px !important;
+    margin-top: 15px;
 }
 
 .card:hover {