diff --git a/dmp-frontend/src/app/ui/auth/login/login.component.html b/dmp-frontend/src/app/ui/auth/login/login.component.html
index d59eb0c84..d5c5a2e45 100644
--- a/dmp-frontend/src/app/ui/auth/login/login.component.html
+++ b/dmp-frontend/src/app/ui/auth/login/login.component.html
@@ -1,73 +1,63 @@
 <div class="login-screen login-bg d-flex flex-column align-items-center justify-content-center">
-	<!-- <div class="login-logo"></div> -->
 	<div class="card login-card">
 		<div class="container card-body">
 			<h3 class="card-title title">{{'GENERAL.TITLES.SIGN-IN' | translate}}</h3>
 			<hr class="line">
-			<ul class="list-group list-group-flush">
-				<li class="list-group-item">
-					<div class="row pt-2 mb-4 accesss-methods">
-						<div *ngIf="hasOrcidOauth()" class="col-auto orcid-logo">
-							<button class="orcid-button" mat-icon-button (click)="orcidLogin()" class="login-social-button">
-								<span class="orcidIconMedium"></span>					
-							</button>
-						</div>
-						<div *ngIf="hasOpenAireOauth()" class="col-auto openaire-logo">
-							<button class="openaire-button" mat-icon-button (click)="openaireLogin()"
-								class="login-social-button">
-								<span class="openaireIcon"></span>
-							</button>
-						</div>
-						<div *ngIf="hasB2AccessOauth()" class="col-auto logo">
-							<button class="b2access-button" mat-icon-button (click)="b2AccessLogin()"
-								class="login-social-button">
-								<span class="iconmedium"></span>						
-							</button>
-						</div>
-					</div>
-				</li>
-				<li class="list-group-item">
-					<div *ngIf="hasGoogleOauth()" class="row social-btns">
-						<div class="col-auto">
-							<button mat-icon-button id="googleSignInButton" class="login-social-button">
-								<i class="fa fa-google"></i>
-							</button>
-						</div>
-						<!-- <div *ngIf="hasLinkedInOauth()" class="col-auto">
-							<button mat-icon-button class="login-social-button">
-								<i class="fa fa-linkedin" (click)="linkedInLogin()"></i>
-							</button>
-						</div> -->
-						<div *ngIf="hasFacebookOauth()" class="col-auto">
-							<button mat-icon-button (click)="facebookLogin()" class="login-social-button">
-								<i class="fa fa-facebook-square"></i>
-							</button>
-						</div>
-						<div *ngIf="hasTwitterOauth()" class="col-auto">
-							<button mat-icon-button (click)="twitterLogin()" class="login-social-button">
-								<i class="fa fa-twitter"></i>
-							</button>
-						</div>
-					</div>
-				</li>
-				<li class="list-group-item">
-					<div *ngIf="hasConfigurableProviders()" class="row pt-2 mb-4 accesss-methods">
-						<div *ngFor="let provider of this.configurableProviderService.providers"
-							class="col-auto configurable-logo">
-							<button mat-icon-button class="configurable-button" (click)="configurableLogin(provider)"
-								class="login-social-button">
-								<span class="configurableIcon">{{provider.name}}</span>
-							</button>
-						</div>
-					</div>
-					<div *ngIf="hasZenodoOauth()" class="col-auto zenodo-logo">
-						<button class="zenodo-button" mat-icon-button (click)="zenodoLogin()" class="login-social-button">
-							<span class="zenodoIcon"></span>
-							<!-- <span></span> -->
+
+			<div class="row justify-content-center">
+				<div class="d-flex flex-column">
+					<div *ngIf="hasOpenAireOauth()" class="col-auto pb-4 pr-4">
+						<button mat-icon-button (click)="openaireLogin()" class="d-flex justify-content-center">
+							<span class="openaireIcon"></span>
 						</button>
 					</div>
-				</li>
-			</ul>
+					<div *ngIf="hasGoogleOauth()" class="col-auto pr-4">
+						<button mat-icon-button id="googleSignInButton" class="d-flex justify-content-center">
+							<span class="googleIcon"></span>
+						</button>
+					</div>
+				</div>
+				<div class="d-flex flex-column">
+					<div *ngIf="hasOrcidOauth()" class="col-auto pl-4 pr-4 pb-4">
+						<button mat-icon-button (click)="orcidLogin()" class="d-flex justify-content-center">
+							<span class="orcidIconMedium"></span>
+						</button>
+					</div>
+					<div *ngIf="hasFacebookOauth()" class="col-auto pl-4 pr-4">
+						<button mat-icon-button (click)="facebookLogin()" class="d-flex justify-content-center">
+							<span class="facebookIcon"></span>
+						</button>
+					</div>
+				</div>
+				<div class="d-flex flex-column">
+					<div *ngIf="hasB2AccessOauth()" class="col-auto pl-4 pb-4">
+						<button mat-icon-button (click)="b2AccessLogin()" class="d-flex justify-content-center">
+							<span class="iconmedium"></span>
+						</button>
+					</div>
+					<div *ngIf="hasTwitterOauth()" class="col-auto pl-4">
+						<button mat-icon-button (click)="twitterLogin()" class="d-flex justify-content-center">
+							<span class="twitterIcon"></span>
+						</button>
+					</div>
+				</div>
+			</div>
+			<div class="row justify-content-center">
+				<div *ngIf="hasConfigurableProviders()" class="row pt-2 mb-4 accesss-methods">
+					<div *ngFor="let provider of this.configurableProviderService.providers"
+						class="col-auto configurable-logo">
+						<button mat-icon-button class="configurable-button" (click)="configurableLogin(provider)"
+							class="login-social-button">
+							<span class="configurableIcon">{{provider.name}}</span>
+						</button>
+					</div>
+				</div>
+				<div *ngIf="hasZenodoOauth()" class="col-auto mt-4">
+					<button mat-icon-button (click)="zenodoLogin()" class="d-flex justify-content-center">
+						<span class="zenodoIcon"></span>
+					</button>
+				</div>
+			</div>
 		</div>
 		<div class="card-footer laptop-img"></div>
 	</div>
diff --git a/dmp-frontend/src/app/ui/auth/login/login.component.scss b/dmp-frontend/src/app/ui/auth/login/login.component.scss
index 54769b1fc..4a3f44871 100644
--- a/dmp-frontend/src/app/ui/auth/login/login.component.scss
+++ b/dmp-frontend/src/app/ui/auth/login/login.component.scss
@@ -1,21 +1,18 @@
 .login-screen {
   margin-top: 70px;
-  // min-height: 517.44px;
   min-height: calc(100vh - 10px);
 }
 
 .login-card {
   // width: auto;
   width: 510.92px;
+  height: 517.44px;
   margin-top: 0;
 }
 
-.container {
-  padding: 15px 30px;
-}
-
 .card {
-  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.14);
+  // box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.14);
+  box-shadow: 0px 1px 3px #00000038;
   border-radius: 6px;
   color: rgba(0, 0, 0, 0.87);
   background: #fff;
@@ -36,18 +33,21 @@
   height: 60px;
   letter-spacing: -0.95px;
   color: #23BCBA;
+  margin-top: 11px;
   margin-bottom: 21px;
 }
 
 .line {
   border-top: 5px solid #23BCBA;
   width: 116px;
+  margin-bottom: 97px;
 }
 
 .container {
   height: 100%;
   position: relative;
   z-index: 1;
+  padding: 15px 30px;
 }
 
 @-webkit-keyframes card {
@@ -114,25 +114,25 @@
   margin-top: 5px;
 }
 
-.social-btns {
-  height: 6em;
-  justify-content: center;
-}
+// .social-btns {
+//   height: 6em;
+//   justify-content: center;
+// }
 
-.social-btns i {
-  font-size: 2.5em;
-  padding: 0.8em;
-  // color: #fff;
-}
+// .social-btns i {
+//   font-size: 2.5em;
+//   padding: 0.8em;
+//   color: #fff;
+// }
 
-.social-btns .col {
-  flex-grow: 0;
-}
+// .social-btns .col {
+//   flex-grow: 0;
+// }
 
-.social-btns i:hover {
-  background-color: #f5f5f51c;
-  border-radius: 60%;
-}
+// .social-btns i:hover {
+//   background-color: #f5f5f51c;
+//   border-radius: 60%;
+// }
 
 .accesss-methods {
   height: 5em;
@@ -224,27 +224,50 @@
   height: 25px;
 }
 
-span.iconmedium {
-  background: url(img/b2access_medium.png) no-repeat;
-  float: left;
-  width: 100px;
-  height: 56px;
+span.googleIcon {
+  background: url("../../../../assets/images/argos-login/NoPath\ -\ Copy\ \(2\).png") no-repeat;
 }
 
-span.orcidIconMedium {
-  background: url(img/ORCIDiD_medium.png) no-repeat;
-  background-position: center;
-  float: right;
-  width: 56px;
-  height: 56px;
+span.facebookIcon {
+  background: url("../../../../assets/images/argos-login/NoPath\ -\ Copy\ \(4\).png") no-repeat;
+}
+
+span.twitterIcon {
+  background: url("../../../../assets/images/argos-login/NoPath\ -\ Copy\ \(5\).png") no-repeat;
+  
+}
+
+span.googleIcon, span.facebookIcon, span.twitterIcon {
+  float: left;
+  transform: scale(0.8);
+  width: 45px;
+  height: 45px;
 }
 
 span.openaireIcon {
-  background: url(img/openaire_small.png) no-repeat;
+  background: url("../../../../assets/images/argos-login/NoPath\ -\ Copy\ \(6\).png") no-repeat;
   background-position: center;
   float: right;
-  width: 80px;
-  height: 56px;
+  transform: scale(0.8);
+  width: 50px;
+  height: 45px;
+}
+
+span.orcidIconMedium {
+  background: url("../../../../assets/images/argos-login/NoPath\ -\ Copy.png") no-repeat;
+  background-position: center;
+  float: left;
+  transform: scale(0.80);
+  width: 50px;
+  height: 45px;
+}
+
+span.iconmedium {
+  background: url("../../../../assets/images/argos-login/NoPath\ -\ Copy\ \(7\).png") no-repeat;
+  float: left;
+  transform: scale(0.85);
+  width: 67px;
+  height: 40px;
 }
 
 span.configurableIcon {
@@ -254,12 +277,13 @@ span.configurableIcon {
 }
 
 span.zenodoIcon {
-	background: url(img/zenodo-white-200.png) no-repeat 100px 56px;
-	background-position: center;
-	float: right;
-	width: 150px;
-	height: 56px;
-  }
+	background: url("../../../../assets/images/argos-login/zenodo-gradient-200.png") no-repeat;
+  background-position: center;
+  float: right;
+  transform: scale(0.70);
+	width: 200px;
+  height: 80px;
+}
 
 .b2access-button {
   margin-top: 10px;
@@ -296,10 +320,10 @@ span.zenodoIcon {
 .laptop-img {
   background: url("../../../../assets/splash/assets/img/laptop.png") no-repeat;
   width: 116px;
-  height: 139px;
+  height: 200px;
   position: relative;
-  top: 60px;
-  left: 245px;
+  top: 58px;
+  left: 243px;
 }
 
 .login-bg {
diff --git a/dmp-frontend/src/assets/images/argos-login/zenodo-gradient-200.png b/dmp-frontend/src/assets/images/argos-login/zenodo-gradient-200.png
new file mode 100644
index 000000000..113bb6542
Binary files /dev/null and b/dmp-frontend/src/assets/images/argos-login/zenodo-gradient-200.png differ