Adjust card size on landing page

src/app/components/home/login-page/login-page.component.html

 <div fxLayout="column" fxLayoutAlign="center" fxLayoutGap="20px" fxFill>
-  <div fxLayout="row" fxLayoutAlign="center">
+  <div fxLayout="row" fxLayoutAlign="start start">
     <mat-card class="outer">
       <mat-card-header>
         <mat-card-title>

src/app/components/home/login-page/login-page.component.scss

@@ -5,7 +5,8 @@
 }
 
 .outer {
-  width: 500px;
+  width: 90%;
+  height: 90%;
   background-color: #bbdefb;
 }
 
@@ -15,7 +16,7 @@
 
 .main-heading-primary {
   display: block;
-  font-size: 150%;
+  font-size: 120%;
   font-weight: bold;
   text-align: center;
   letter-spacing: 10px;
@@ -26,7 +27,7 @@
 .main-heading-secondary {
   font-family: sans-serif;
   display: block;
-  font-size: 50%;
+  font-size: 40%;
   text-align: center;
   letter-spacing: 10px;
   color: mat-color($arsnova-accent,500);