diff --git a/openvidu-insecure-angular/src/styles.css b/openvidu-insecure-angular/src/styles.css
index 1e37d0e9..420014ff 100644
--- a/openvidu-insecure-angular/src/styles.css
+++ b/openvidu-insecure-angular/src/styles.css
@@ -36,7 +36,6 @@ nav a:hover {
 }
 
 nav i.fa:hover {
-	font-size: 40px;
 	color: #a9a9a9;
 }
 
@@ -70,9 +69,18 @@ input.btn {
 	font-weight: bold;
 }
 
+.btn {
+	font-weight: bold !important;
+}
+
 .btn-success {
-	background-color: #0088aa !important;
-	border-color: #0088aa;
+	background-color: #1dd36b !important;
+	border-color: #1dd36b;
+}
+
+.btn-success:hover {
+	background-color: #1abd61 !important;
+	border-color: #1abd61;
 }
 
 .footer {
diff --git a/openvidu-insecure-js/web/style.css b/openvidu-insecure-js/web/style.css
index ffc71af6..6c23d596 100644
--- a/openvidu-insecure-js/web/style.css
+++ b/openvidu-insecure-js/web/style.css
@@ -36,7 +36,6 @@ nav a:hover {
 }
 
 nav i.fa:hover {
-	font-size: 40px;
 	color: #a9a9a9;
 }
 
@@ -70,9 +69,18 @@ input.btn {
 	font-weight: bold;
 }
 
+.btn {
+	font-weight: bold !important;
+}
+
 .btn-success {
-	background-color: #0088aa !important;
-	border-color: #0088aa;
+	background-color: #1dd36b !important;
+	border-color: #1dd36b;
+}
+
+.btn-success:hover {
+	background-color: #1abd61 !important;
+	border-color: #1abd61;
 }
 
 .footer {
diff --git a/openvidu-js-java/src/main/resources/static/index.html b/openvidu-js-java/src/main/resources/static/index.html
index 9b31dda0..bc296ae5 100644
--- a/openvidu-js-java/src/main/resources/static/index.html
+++ b/openvidu-js-java/src/main/resources/static/index.html
@@ -100,7 +100,7 @@
 					</form>
 					<hr>
 					<div id="login-info">
-						<div>Logged as <span id="name-user">publisher1</span></div>
+						<div>Logged as <span id="name-user"></span></div>
 						<button id="logout-btn" class="btn btn-warning" onclick="logOut()">Log out</button>
 					</div>
 				</div>
diff --git a/openvidu-js-java/src/main/resources/static/style.css b/openvidu-js-java/src/main/resources/static/style.css
index 958447f3..b7c6e733 100644
--- a/openvidu-js-java/src/main/resources/static/style.css
+++ b/openvidu-js-java/src/main/resources/static/style.css
@@ -36,7 +36,6 @@ nav a:hover {
 }
 
 nav i.fa:hover {
-	font-size: 40px;
 	color: #a9a9a9;
 }
 
@@ -70,11 +69,54 @@ input.btn {
 	font-weight: bold;
 }
 
+.btn {
+	font-weight: bold !important;
+}
+
 .btn-success {
+	background-color: #1dd36b !important;
+	border-color: #1dd36b;
+}
+
+.btn-success:hover {
+	background-color: #1abd61 !important;
+	border-color: #1abd61;
+}
+
+.btn-info {
 	background-color: #0088aa !important;
 	border-color: #0088aa;
 }
 
+.btn-info:hover {
+	background-color: #00708c !important;
+	border-color: #00708c;
+}
+
+.btn-warning {
+	background-color: #ffcc3a !important;
+	border-color: #ffcc3a;
+	color: #4d4d4d;
+}
+
+.btn-warning:hover {
+	background-color: #eabb3a !important;
+	border-color: #eabb3a;
+	color: #4d4d4d;
+}
+
+.btn-warning:active {
+	color: #4d4d4d;
+}
+
+.btn-warning:focus {
+	color: #4d4d4d;
+}
+
+.btn-warning:active:focus {
+	color: #4d4d4d;
+}
+
 .footer {
 	position: absolute;
 	bottom: 0;
diff --git a/openvidu-js-node/public/index.html b/openvidu-js-node/public/index.html
index b7d64d54..9e194d8e 100644
--- a/openvidu-js-node/public/index.html
+++ b/openvidu-js-node/public/index.html
@@ -100,7 +100,7 @@
 					</form>
 					<hr>
 					<div id="login-info">
-						<div>Logged as <span id="name-user">publisher1</span></div>
+						<div>Logged as <span id="name-user"></span></div>
 						<button id="logout-btn" class="btn btn-warning" onclick="logOut()">Log out</button>
 					</div>
 				</div>
diff --git a/openvidu-js-node/public/style.css b/openvidu-js-node/public/style.css
index 958447f3..b7c6e733 100644
--- a/openvidu-js-node/public/style.css
+++ b/openvidu-js-node/public/style.css
@@ -36,7 +36,6 @@ nav a:hover {
 }
 
 nav i.fa:hover {
-	font-size: 40px;
 	color: #a9a9a9;
 }
 
@@ -70,11 +69,54 @@ input.btn {
 	font-weight: bold;
 }
 
+.btn {
+	font-weight: bold !important;
+}
+
 .btn-success {
+	background-color: #1dd36b !important;
+	border-color: #1dd36b;
+}
+
+.btn-success:hover {
+	background-color: #1abd61 !important;
+	border-color: #1abd61;
+}
+
+.btn-info {
 	background-color: #0088aa !important;
 	border-color: #0088aa;
 }
 
+.btn-info:hover {
+	background-color: #00708c !important;
+	border-color: #00708c;
+}
+
+.btn-warning {
+	background-color: #ffcc3a !important;
+	border-color: #ffcc3a;
+	color: #4d4d4d;
+}
+
+.btn-warning:hover {
+	background-color: #eabb3a !important;
+	border-color: #eabb3a;
+	color: #4d4d4d;
+}
+
+.btn-warning:active {
+	color: #4d4d4d;
+}
+
+.btn-warning:focus {
+	color: #4d4d4d;
+}
+
+.btn-warning:active:focus {
+	color: #4d4d4d;
+}
+
 .footer {
 	position: absolute;
 	bottom: 0;
diff --git a/openvidu-mvc-java/src/main/resources/static/images/favicon.ico b/openvidu-mvc-java/src/main/resources/static/images/favicon.ico
new file mode 100644
index 00000000..0e2249ad
Binary files /dev/null and b/openvidu-mvc-java/src/main/resources/static/images/favicon.ico differ
diff --git a/openvidu-mvc-java/src/main/resources/static/images/openvidu_globe_bg_transp_cropped.png b/openvidu-mvc-java/src/main/resources/static/images/openvidu_globe_bg_transp_cropped.png
new file mode 100644
index 00000000..e0309e62
Binary files /dev/null and b/openvidu-mvc-java/src/main/resources/static/images/openvidu_globe_bg_transp_cropped.png differ
diff --git a/openvidu-mvc-java/src/main/resources/static/images/openvidu_grey_bg_transp_cropped.png b/openvidu-mvc-java/src/main/resources/static/images/openvidu_grey_bg_transp_cropped.png
new file mode 100644
index 00000000..49f311a6
Binary files /dev/null and b/openvidu-mvc-java/src/main/resources/static/images/openvidu_grey_bg_transp_cropped.png differ
diff --git a/openvidu-mvc-java/src/main/resources/static/images/openvidu_vert_white_bg_trans_cropped.png b/openvidu-mvc-java/src/main/resources/static/images/openvidu_vert_white_bg_trans_cropped.png
new file mode 100644
index 00000000..a1c8b2d7
Binary files /dev/null and b/openvidu-mvc-java/src/main/resources/static/images/openvidu_vert_white_bg_trans_cropped.png differ
diff --git a/openvidu-mvc-java/src/main/resources/static/style.css b/openvidu-mvc-java/src/main/resources/static/style.css
index 21f36e01..e8f75a69 100644
--- a/openvidu-mvc-java/src/main/resources/static/style.css
+++ b/openvidu-mvc-java/src/main/resources/static/style.css
@@ -5,8 +5,12 @@ html {
 
 nav {
 	height: 50px;
-	position: absolute !important;
 	width: 100%;
+	z-index: 1;
+	background-color: #4d4d4d !important;
+	border-color: #4d4d4d !important;
+	border-top-right-radius: 0 !important;
+	border-top-left-radius: 0 !important;
 }
 
 .navbar-header {
@@ -18,38 +22,167 @@ nav {
 	float: right;
 }
 
+nav a {
+	color: #ccc !important;
+}
+
 nav i.fa {
 	font-size: 40px;
+	color: #ccc;
+}
+
+nav a:hover {
+	color: #a9a9a9 !important;
+}
+
+nav i.fa:hover {
+	color: #a9a9a9;
+}
+
+#main-container {
+	padding-bottom: 80px;
 }
 
 .vertical-center {
-	min-height: 100%;
-	min-height: 100vh;
-	display: flex;
-	align-items: center;
+	position: absolute;
+	top: 50%;
+	left: 50%;
+	transform: translate(-50%, -50%);
 }
 
 .horizontal-center {
 	margin: 0 auto;
 }
 
+.form-control {
+	color: #0088aa;
+	font-weight: bold;
+}
+
+.form-control:focus {
+	border-color: #0088aa;
+	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(0, 136, 170, 0.6);
+	box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(0, 136, 170, 0.6);
+}
+
+input.btn {
+	font-weight: bold;
+}
+
+.btn {
+	font-weight: bold !important;
+}
+
+.btn-success {
+	background-color: #1dd36b !important;
+	border-color: #1dd36b;
+}
+
+.btn-success:hover {
+	background-color: #1abd61 !important;
+	border-color: #1abd61;
+}
+
+.btn-info {
+	background-color: #0088aa !important;
+	border-color: #0088aa;
+}
+
+.btn-info:hover {
+	background-color: #00708c !important;
+	border-color: #00708c;
+}
+
+.btn-warning {
+	background-color: #ffcc3a !important;
+	border-color: #ffcc3a;
+	color: #4d4d4d;
+}
+
+.btn-warning:hover {
+	background-color: #eabb3a !important;
+	border-color: #eabb3a;
+	color: #4d4d4d;
+}
+
+.btn-warning:active {
+	color: #4d4d4d;
+}
+
+.btn-warning:focus {
+	color: #4d4d4d;
+}
+
+.btn-warning:active:focus {
+	color: #4d4d4d;
+}
+
 .footer {
 	position: absolute;
 	bottom: 0;
 	width: 100%;
 	height: 60px;
-	background-color: #f8f8f8;
+	background-color: #4d4d4d;
 }
 
 .footer .text-muted {
 	margin: 20px 0;
 	float: left;
+	color: #ccc;
 }
 
-.footer img {
-	height: 50px;
+.openvidu-logo {
+	height: 35px;
 	float: right;
-	margin: 5px 0;
+	margin: 12px 0;
+	-webkit-transition: all 0.1s ease-in-out;
+	-moz-transition: all 0.1s ease-in-out;
+	-o-transition: all 0.1s ease-in-out;
+	transition: all 0.1s ease-in-out;
+}
+
+.openvidu-logo:hover {
+	-webkit-filter: grayscale(0.5);
+	filter: grayscale(0.5);
+}
+
+.demo-logo {
+	margin: 0;
+	height: 22px;
+	float: left;
+	padding-right: 8px;
+}
+
+a:hover .demo-logo {
+	-webkit-filter: brightness(0.7);
+	filter: brightness(0.7);
+}
+
+#join-dialog h1 {
+	color: #4d4d4d;
+	font-weight: bold;
+	text-align: center;
+}
+
+#join-dialog label {
+	color: #0088aa;
+}
+
+#join-dialog input.btn {
+	margin-top: 15px;
+}
+
+#join-dialog hr {
+	background: #4d4d4d;
+}
+
+#img-div {
+	text-align: center;
+    padding-bottom: 3em;
+}
+
+#img-div img {
+	height: 15%;
 }
 
 #logged {
@@ -58,14 +191,7 @@ nav i.fa {
 
 #join {
 	max-width: 700px;
-	margin: auto;
-}
-
-#session {
-	padding-top: 70px;
-	height: 100vh;
-	height: 100%;
-	width: 100%;
+    margin: auto;
 }
 
 #session-header {
@@ -111,12 +237,12 @@ nav i.fa {
 
 #video-container p.userName {
 	float: right;
-	border-bottom-left-radius: 4px;
-	border-bottom-right-radius: 0px;
-	font-weight: lighter;
-	font-size: 12px;
-	background: #777777;
-	color: #f8f8f8;
+    border-bottom-left-radius: 4px;
+    border-bottom-right-radius: 0px;
+    font-weight: lighter;
+    font-size: 12px;
+    background: #777777;
+    color: #f8f8f8;
 }
 
 video {
@@ -140,15 +266,16 @@ video {
 	position: absolute;
 	right: 0;
 	font-size: 16px !important;
-	margin-right: 15px;
-	border-bottom-left-radius: 4px;
-	border-bottom-right-radius: 0px;
-	font-weight: lighter;
-	font-size: 12px;
-	background: #777777;
-	color: #f8f8f8;
+    margin-right: 15px;
+    border-bottom-left-radius: 4px;
+    border-bottom-right-radius: 0px;
+    font-weight: lighter;
+    font-size: 12px;
+    background: #777777;
+    color: #f8f8f8;
 }
 
+
 #session img {
 	width: 100%;
 	height: auto;
@@ -181,7 +308,6 @@ table i {
 
 #login-info {
 	text-align: right;
-	margin-bottom: 1em;
 }
 
 #login-info form {
@@ -195,4 +321,30 @@ table i {
 
 #name-user {
 	font-weight: bold;
+}
+
+
+/* xs ans md screen resolutions*/
+
+@media screen and (max-width: 991px) {
+	.container .navbar-header {
+		margin-right: 0 !important;
+		margin-left: 0 !important;
+	}
+	.nav-icon {
+		padding: 9px 8px 9px 8px;
+	}
+	nav i.fa {
+		font-size: 32px;
+	}
+	.vertical-center {
+		width: 85%;
+		padding-top: 10px;
+	}
+	#img-div {
+		padding-bottom: 1em;
+	}
+	#img-div img {
+		height: 10%;
+	}
 }
\ No newline at end of file
diff --git a/openvidu-mvc-java/src/main/resources/templates/dashboard.html b/openvidu-mvc-java/src/main/resources/templates/dashboard.html
index dbe9abc4..1919ba18 100644
--- a/openvidu-mvc-java/src/main/resources/templates/dashboard.html
+++ b/openvidu-mvc-java/src/main/resources/templates/dashboard.html
@@ -4,6 +4,7 @@
 	<title>openvidu-mvc-java</title>
 
 	<meta name="viewport" content="width=device-width, initial-scale=1" charset="utf-8"></meta>
+	<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon"></link>
 
 	<!-- Bootstrap -->
 	<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha256-k2WSCIexGzOj3Euiig+TlR8gA0EmPjuc79OEeY5L45g="
@@ -23,22 +24,19 @@
 	<nav class="navbar navbar-default">
 		<div class="container">
 			<div class="navbar-header">
-				<a class="navbar-brand" href="#">OpenVidu Tutorial</a>
-				<a class="navbar-brand nav-icon" href="https://github.com/OpenVidu/openvidu-tutorials/tree/master/openvidu-mvc-java" target="_blank"><i class="fa fa-github" aria-hidden="true"></i></a>
+				<a class="navbar-brand" href="/"><img class="demo-logo" src="images/openvidu_vert_white_bg_trans_cropped.png"/> MVC Java</a>
+				<a class="navbar-brand nav-icon" href="https://github.com/OpenVidu/openvidu-tutorials/tree/master/openvidu-mvc-java" title="GitHub Repository"
+				    target="_blank"><i class="fa fa-github" aria-hidden="true"></i></a>
+				<a class="navbar-brand nav-icon" href="http://www.openvidu.io/docs/tutorials/openvidu-mvc-java/" title="Documentation" target="_blank"><i class="fa fa-book" aria-hidden="true"></i></a>
 			</div>
 		</div>
 	</nav>
 
-	<div class="container vertical-center">
-		<div id="logged" class="horizontal-center">
-			<div id="join">
-				<div id="login-info">
-					<div>Logged as <span th:text="${username}" id="name-user"></span></div>
-					<form action="/logout" method="post">
-						<button id="logout-btn" class="btn btn-warning" type="submit">Log out</button>
-					</form>
-				</div>
-				<div class="jumbotron">
+	<div id="main-container" class="container">
+		<div id="logged">
+			<div id="join" class="vertical-center">
+				<div id="img-div"><img src="images/openvidu_grey_bg_transp_cropped.png" /></div>
+				<div id="join-dialog" class="jumbotron">
 					<h1>Join a video session</h1>
 					<form class="form-group" action="/session" method="post">
 						<p>
@@ -53,6 +51,13 @@
 							<button class="btn btn-lg btn-success" type="submit">Join!</button>
 						</p>
 					</form>
+					<hr></hr>
+					<div id="login-info">
+						<div>Logged as <span th:text="${username}" id="name-user"></span></div>
+						<form action="/logout" method="post">
+							<button id="logout-btn" class="btn btn-warning" type="submit">Log out</button>
+						</form>
+					</div>
 				</div>
 			</div>
 		</div>
@@ -61,7 +66,7 @@
 	<footer class="footer">
 		<div class="container">
 			<div class="text-muted">OpenVidu © 2017</div>
-			<a href="http://www.codeurjc.es/" target="_blank"><img src="https://codeurjc.files.wordpress.com/2016/01/logo_cetrado_negro.png?w=275&amp;h=165"/></a>
+			<a href="http://www.openvidu.io/" target="_blank"><img class="openvidu-logo" src="images/openvidu_globe_bg_transp_cropped.png"/></a>
 		</div>
 	</footer>
 
diff --git a/openvidu-mvc-java/src/main/resources/templates/index.html b/openvidu-mvc-java/src/main/resources/templates/index.html
index 045080d8..ba94b58e 100644
--- a/openvidu-mvc-java/src/main/resources/templates/index.html
+++ b/openvidu-mvc-java/src/main/resources/templates/index.html
@@ -4,6 +4,7 @@
 	<title>openvidu-mvc-java</title>
 
 	<meta name="viewport" content="width=device-width, initial-scale=1" charset="utf-8"></meta>
+	<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon"></link>
 
 	<!-- Bootstrap -->
 	<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha256-k2WSCIexGzOj3Euiig+TlR8gA0EmPjuc79OEeY5L45g="
@@ -30,22 +31,23 @@
 	<nav class="navbar navbar-default">
 		<div class="container">
 			<div class="navbar-header">
-				<a class="navbar-brand" href="#">OpenVidu Tutorial</a>
-				<a class="navbar-brand nav-icon" href="https://github.com/OpenVidu/openvidu-tutorials/tree/master/openvidu-mvc-java" target="_blank"><i class="fa fa-github" aria-hidden="true"></i></a>
+				<a class="navbar-brand" href="/"><img class="demo-logo" src="images/openvidu_vert_white_bg_trans_cropped.png"/> MVC Java</a>
+				<a class="navbar-brand nav-icon" href="https://github.com/OpenVidu/openvidu-tutorials/tree/master/openvidu-mvc-java" title="GitHub Repository"
+				    target="_blank"><i class="fa fa-github" aria-hidden="true"></i></a>
+				<a class="navbar-brand nav-icon" href="http://www.openvidu.io/docs/tutorials/openvidu-mvc-java/" title="Documentation" target="_blank"><i class="fa fa-book" aria-hidden="true"></i></a>
 			</div>
 		</div>
 	</nav>
 
-	<div class="container vertical-center">
-		<div id="not-logged" class="horizontal-center">
+	<div id="main-container" class="container">
+		<div id="not-logged" class="vertical-center">
+			<div id="img-div"><img src="images/openvidu_grey_bg_transp_cropped.png" /></div>
 			<form class="form-group jumbotron" action="/dashboard" method="post">
 				<p>
-					<label>User</label>
-					<input class="form-control" type="text" name="user" required="true"></input>
+					<label>User</label><input class="form-control" type="text" name="user" required="true"></input>
 				</p>
 				<p>
-					<label>Pass</label>
-					<input class="form-control" type="password" name="pass" required="true"></input>
+					<label>Pass</label><input class="form-control" type="password" name="pass" required="true"></input>
 				</p>
 				<p class="text-center">
 					<button class="btn btn-lg btn-info" type="submit">Log in</button>
@@ -80,7 +82,7 @@
 	<footer class="footer">
 		<div class="container">
 			<div class="text-muted">OpenVidu © 2017</div>
-			<a href="http://www.codeurjc.es/" target="_blank"><img src="https://codeurjc.files.wordpress.com/2016/01/logo_cetrado_negro.png?w=275&amp;h=165"/></a>
+			<a href="http://www.openvidu.io/" target="_blank"><img class="openvidu-logo" src="images/openvidu_globe_bg_transp_cropped.png"/></a>
 		</div>
 	</footer>
 
diff --git a/openvidu-mvc-java/src/main/resources/templates/session.html b/openvidu-mvc-java/src/main/resources/templates/session.html
index 807af9c1..bfdb2c25 100644
--- a/openvidu-mvc-java/src/main/resources/templates/session.html
+++ b/openvidu-mvc-java/src/main/resources/templates/session.html
@@ -4,6 +4,7 @@
 	<title>openvidu-mvc-java</title>
 
 	<meta name="viewport" content="width=device-width, initial-scale=1" charset="utf-8"></meta>
+	<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon"></link>
 
 	<!-- Bootstrap -->
 	<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha256-k2WSCIexGzOj3Euiig+TlR8gA0EmPjuc79OEeY5L45g="
@@ -24,14 +25,16 @@
 	<nav class="navbar navbar-default">
 		<div class="container">
 			<div class="navbar-header">
-				<a class="navbar-brand" href="#">OpenVidu Tutorial</a>
-				<a class="navbar-brand nav-icon" href="https://github.com/OpenVidu/openvidu-tutorials/tree/master/openvidu-mvc-java" target="_blank"><i class="fa fa-github" aria-hidden="true"></i></a>
+				<a class="navbar-brand" href="/"><img class="demo-logo" src="images/openvidu_vert_white_bg_trans_cropped.png"/> MVC Java</a>
+				<a class="navbar-brand nav-icon" href="https://github.com/OpenVidu/openvidu-tutorials/tree/master/openvidu-mvc-java" title="GitHub Repository"
+				    target="_blank"><i class="fa fa-github" aria-hidden="true"></i></a>
+				<a class="navbar-brand nav-icon" href="http://www.openvidu.io/docs/tutorials/openvidu-mvc-java/" title="Documentation" target="_blank"><i class="fa fa-book" aria-hidden="true"></i></a>
 			</div>
 		</div>
 	</nav>
 
-	<div class="container vertical-center">
-		<div id="logged" class="horizontal-center">
+	<div id="main-container" class="container">
+		<div id="logged">
 			<div id="session">
 				<div id="session-header">
 					<h1 th:text="${sessionName}" id="session-title"></h1>
@@ -55,7 +58,7 @@
 	<footer class="footer">
 		<div class="container">
 			<div class="text-muted">OpenVidu © 2017</div>
-			<a href="http://www.codeurjc.es/" target="_blank"><img src="https://codeurjc.files.wordpress.com/2016/01/logo_cetrado_negro.png?w=275&amp;h=165"/></a>
+			<a href="http://www.openvidu.io/" target="_blank"><img class="openvidu-logo" src="images/openvidu_globe_bg_transp_cropped.png"/></a>
 		</div>
 	</footer>
 
diff --git a/openvidu-mvc-node/public/images/favicon.ico b/openvidu-mvc-node/public/images/favicon.ico
new file mode 100644
index 00000000..0e2249ad
Binary files /dev/null and b/openvidu-mvc-node/public/images/favicon.ico differ
diff --git a/openvidu-mvc-node/public/images/openvidu_globe_bg_transp_cropped.png b/openvidu-mvc-node/public/images/openvidu_globe_bg_transp_cropped.png
new file mode 100644
index 00000000..e0309e62
Binary files /dev/null and b/openvidu-mvc-node/public/images/openvidu_globe_bg_transp_cropped.png differ
diff --git a/openvidu-mvc-node/public/images/openvidu_grey_bg_transp_cropped.png b/openvidu-mvc-node/public/images/openvidu_grey_bg_transp_cropped.png
new file mode 100644
index 00000000..49f311a6
Binary files /dev/null and b/openvidu-mvc-node/public/images/openvidu_grey_bg_transp_cropped.png differ
diff --git a/openvidu-mvc-node/public/images/openvidu_vert_white_bg_trans_cropped.png b/openvidu-mvc-node/public/images/openvidu_vert_white_bg_trans_cropped.png
new file mode 100644
index 00000000..a1c8b2d7
Binary files /dev/null and b/openvidu-mvc-node/public/images/openvidu_vert_white_bg_trans_cropped.png differ
diff --git a/openvidu-mvc-node/public/style.css b/openvidu-mvc-node/public/style.css
index 21f36e01..e8f75a69 100644
--- a/openvidu-mvc-node/public/style.css
+++ b/openvidu-mvc-node/public/style.css
@@ -5,8 +5,12 @@ html {
 
 nav {
 	height: 50px;
-	position: absolute !important;
 	width: 100%;
+	z-index: 1;
+	background-color: #4d4d4d !important;
+	border-color: #4d4d4d !important;
+	border-top-right-radius: 0 !important;
+	border-top-left-radius: 0 !important;
 }
 
 .navbar-header {
@@ -18,38 +22,167 @@ nav {
 	float: right;
 }
 
+nav a {
+	color: #ccc !important;
+}
+
 nav i.fa {
 	font-size: 40px;
+	color: #ccc;
+}
+
+nav a:hover {
+	color: #a9a9a9 !important;
+}
+
+nav i.fa:hover {
+	color: #a9a9a9;
+}
+
+#main-container {
+	padding-bottom: 80px;
 }
 
 .vertical-center {
-	min-height: 100%;
-	min-height: 100vh;
-	display: flex;
-	align-items: center;
+	position: absolute;
+	top: 50%;
+	left: 50%;
+	transform: translate(-50%, -50%);
 }
 
 .horizontal-center {
 	margin: 0 auto;
 }
 
+.form-control {
+	color: #0088aa;
+	font-weight: bold;
+}
+
+.form-control:focus {
+	border-color: #0088aa;
+	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(0, 136, 170, 0.6);
+	box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(0, 136, 170, 0.6);
+}
+
+input.btn {
+	font-weight: bold;
+}
+
+.btn {
+	font-weight: bold !important;
+}
+
+.btn-success {
+	background-color: #1dd36b !important;
+	border-color: #1dd36b;
+}
+
+.btn-success:hover {
+	background-color: #1abd61 !important;
+	border-color: #1abd61;
+}
+
+.btn-info {
+	background-color: #0088aa !important;
+	border-color: #0088aa;
+}
+
+.btn-info:hover {
+	background-color: #00708c !important;
+	border-color: #00708c;
+}
+
+.btn-warning {
+	background-color: #ffcc3a !important;
+	border-color: #ffcc3a;
+	color: #4d4d4d;
+}
+
+.btn-warning:hover {
+	background-color: #eabb3a !important;
+	border-color: #eabb3a;
+	color: #4d4d4d;
+}
+
+.btn-warning:active {
+	color: #4d4d4d;
+}
+
+.btn-warning:focus {
+	color: #4d4d4d;
+}
+
+.btn-warning:active:focus {
+	color: #4d4d4d;
+}
+
 .footer {
 	position: absolute;
 	bottom: 0;
 	width: 100%;
 	height: 60px;
-	background-color: #f8f8f8;
+	background-color: #4d4d4d;
 }
 
 .footer .text-muted {
 	margin: 20px 0;
 	float: left;
+	color: #ccc;
 }
 
-.footer img {
-	height: 50px;
+.openvidu-logo {
+	height: 35px;
 	float: right;
-	margin: 5px 0;
+	margin: 12px 0;
+	-webkit-transition: all 0.1s ease-in-out;
+	-moz-transition: all 0.1s ease-in-out;
+	-o-transition: all 0.1s ease-in-out;
+	transition: all 0.1s ease-in-out;
+}
+
+.openvidu-logo:hover {
+	-webkit-filter: grayscale(0.5);
+	filter: grayscale(0.5);
+}
+
+.demo-logo {
+	margin: 0;
+	height: 22px;
+	float: left;
+	padding-right: 8px;
+}
+
+a:hover .demo-logo {
+	-webkit-filter: brightness(0.7);
+	filter: brightness(0.7);
+}
+
+#join-dialog h1 {
+	color: #4d4d4d;
+	font-weight: bold;
+	text-align: center;
+}
+
+#join-dialog label {
+	color: #0088aa;
+}
+
+#join-dialog input.btn {
+	margin-top: 15px;
+}
+
+#join-dialog hr {
+	background: #4d4d4d;
+}
+
+#img-div {
+	text-align: center;
+    padding-bottom: 3em;
+}
+
+#img-div img {
+	height: 15%;
 }
 
 #logged {
@@ -58,14 +191,7 @@ nav i.fa {
 
 #join {
 	max-width: 700px;
-	margin: auto;
-}
-
-#session {
-	padding-top: 70px;
-	height: 100vh;
-	height: 100%;
-	width: 100%;
+    margin: auto;
 }
 
 #session-header {
@@ -111,12 +237,12 @@ nav i.fa {
 
 #video-container p.userName {
 	float: right;
-	border-bottom-left-radius: 4px;
-	border-bottom-right-radius: 0px;
-	font-weight: lighter;
-	font-size: 12px;
-	background: #777777;
-	color: #f8f8f8;
+    border-bottom-left-radius: 4px;
+    border-bottom-right-radius: 0px;
+    font-weight: lighter;
+    font-size: 12px;
+    background: #777777;
+    color: #f8f8f8;
 }
 
 video {
@@ -140,15 +266,16 @@ video {
 	position: absolute;
 	right: 0;
 	font-size: 16px !important;
-	margin-right: 15px;
-	border-bottom-left-radius: 4px;
-	border-bottom-right-radius: 0px;
-	font-weight: lighter;
-	font-size: 12px;
-	background: #777777;
-	color: #f8f8f8;
+    margin-right: 15px;
+    border-bottom-left-radius: 4px;
+    border-bottom-right-radius: 0px;
+    font-weight: lighter;
+    font-size: 12px;
+    background: #777777;
+    color: #f8f8f8;
 }
 
+
 #session img {
 	width: 100%;
 	height: auto;
@@ -181,7 +308,6 @@ table i {
 
 #login-info {
 	text-align: right;
-	margin-bottom: 1em;
 }
 
 #login-info form {
@@ -195,4 +321,30 @@ table i {
 
 #name-user {
 	font-weight: bold;
+}
+
+
+/* xs ans md screen resolutions*/
+
+@media screen and (max-width: 991px) {
+	.container .navbar-header {
+		margin-right: 0 !important;
+		margin-left: 0 !important;
+	}
+	.nav-icon {
+		padding: 9px 8px 9px 8px;
+	}
+	nav i.fa {
+		font-size: 32px;
+	}
+	.vertical-center {
+		width: 85%;
+		padding-top: 10px;
+	}
+	#img-div {
+		padding-bottom: 1em;
+	}
+	#img-div img {
+		height: 10%;
+	}
 }
\ No newline at end of file
diff --git a/openvidu-mvc-node/views/dashboard.ejs b/openvidu-mvc-node/views/dashboard.ejs
index 6c44aac9..10877ba3 100644
--- a/openvidu-mvc-node/views/dashboard.ejs
+++ b/openvidu-mvc-node/views/dashboard.ejs
@@ -1,9 +1,10 @@
 <html>
 
 <head>
-	<title>openvidu-mvc-java</title>
+	<title>openvidu-mvc-node</title>
 
 	<meta name="viewport" content="width=device-width, initial-scale=1" charset="utf-8"></meta>
+	<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon"></link>
 
 	<!-- Bootstrap -->
 	<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha256-k2WSCIexGzOj3Euiig+TlR8gA0EmPjuc79OEeY5L45g="
@@ -23,22 +24,19 @@
 	<nav class="navbar navbar-default">
 		<div class="container">
 			<div class="navbar-header">
-				<a class="navbar-brand" href="#">OpenVidu Tutorial</a>
-				<a class="navbar-brand nav-icon" href="https://github.com/OpenVidu/openvidu-tutorials/tree/master/openvidu-mvc-node" target="_blank"><i class="fa fa-github" aria-hidden="true"></i></a>
+				<a class="navbar-brand" href="/"><img class="demo-logo" src="images/openvidu_vert_white_bg_trans_cropped.png"/> MVC Node</a>
+				<a class="navbar-brand nav-icon" href="https://github.com/OpenVidu/openvidu-tutorials/tree/master/openvidu-mvc-node" title="GitHub Repository"
+				    target="_blank"><i class="fa fa-github" aria-hidden="true"></i></a>
+				<a class="navbar-brand nav-icon" href="http://www.openvidu.io/docs/tutorials/openvidu-mvc-node/" title="Documentation" target="_blank"><i class="fa fa-book" aria-hidden="true"></i></a>
 			</div>
 		</div>
 	</nav>
 
-	<div class="container vertical-center">
-		<div id="logged" class="horizontal-center">
-			<div id="join">
-				<div id="login-info">
-					<div>Logged as <span th:text="${username}" id="name-user"></span></div>
-					<form action="/logout" method="post">
-						<button id="logout-btn" class="btn btn-warning" type="submit">Log out</button>
-					</form>
-				</div>
-				<div class="jumbotron">
+	<div id="main-container" class="container">
+		<div id="logged">
+			<div id="join" class="vertical-center">
+				<div id="img-div"><img src="images/openvidu_grey_bg_transp_cropped.png" /></div>
+				<div id="join-dialog" class="jumbotron">
 					<h1>Join a video session</h1>
 					<form class="form-group" action="/session" method="post">
 						<p>
@@ -53,6 +51,13 @@
 							<button class="btn btn-lg btn-success" type="submit">Join!</button>
 						</p>
 					</form>
+					<hr></hr>
+					<div id="login-info">
+						<div>Logged as <span id="name-user"><%= user %></span></div>
+						<form action="/logout" method="post">
+							<button id="logout-btn" class="btn btn-warning" type="submit">Log out</button>
+						</form>
+					</div>
 				</div>
 			</div>
 		</div>
@@ -61,7 +66,7 @@
 	<footer class="footer">
 		<div class="container">
 			<div class="text-muted">OpenVidu © 2017</div>
-			<a href="http://www.codeurjc.es/" target="_blank"><img src="https://codeurjc.files.wordpress.com/2016/01/logo_cetrado_negro.png?w=275&amp;h=165"/></a>
+			<a href="http://www.openvidu.io/" target="_blank"><img class="openvidu-logo" src="images/openvidu_globe_bg_transp_cropped.png"/></a>
 		</div>
 	</footer>
 
diff --git a/openvidu-mvc-node/views/index.ejs b/openvidu-mvc-node/views/index.ejs
index 6986ce4a..7f3bccbd 100644
--- a/openvidu-mvc-node/views/index.ejs
+++ b/openvidu-mvc-node/views/index.ejs
@@ -4,6 +4,7 @@
 	<title>openvidu-mvc-node</title>
 
 	<meta name="viewport" content="width=device-width, initial-scale=1" charset="utf-8"></meta>
+	<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon"></link>
 
 	<!-- Bootstrap -->
 	<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha256-k2WSCIexGzOj3Euiig+TlR8gA0EmPjuc79OEeY5L45g="
@@ -30,22 +31,23 @@
 	<nav class="navbar navbar-default">
 		<div class="container">
 			<div class="navbar-header">
-				<a class="navbar-brand" href="#">OpenVidu Tutorial</a>
-				<a class="navbar-brand nav-icon" href="https://github.com/OpenVidu/openvidu-tutorials/tree/master/openvidu-mvc-node" target="_blank"><i class="fa fa-github" aria-hidden="true"></i></a>
+				<a class="navbar-brand" href="/"><img class="demo-logo" src="images/openvidu_vert_white_bg_trans_cropped.png"/> MVC Node</a>
+				<a class="navbar-brand nav-icon" href="https://github.com/OpenVidu/openvidu-tutorials/tree/master/openvidu-mvc-node" title="GitHub Repository"
+				    target="_blank"><i class="fa fa-github" aria-hidden="true"></i></a>
+				<a class="navbar-brand nav-icon" href="http://www.openvidu.io/docs/tutorials/openvidu-mvc-node/" title="Documentation" target="_blank"><i class="fa fa-book" aria-hidden="true"></i></a>
 			</div>
 		</div>
 	</nav>
 
-	<div class="container vertical-center">
-		<div id="not-logged" class="horizontal-center">
+	<div id="main-container" class="container">
+		<div id="not-logged" class="vertical-center">
+			<div id="img-div"><img src="images/openvidu_grey_bg_transp_cropped.png" /></div>
 			<form class="form-group jumbotron" action="/dashboard" method="post">
 				<p>
-					<label>User</label>
-					<input class="form-control" type="text" name="user" required="true"></input>
+					<label>User</label><input class="form-control" type="text" name="user" required="true"></input>
 				</p>
 				<p>
-					<label>Pass</label>
-					<input class="form-control" type="password" name="pass" required="true"></input>
+					<label>Pass</label><input class="form-control" type="password" name="pass" required="true"></input>
 				</p>
 				<p class="text-center">
 					<button class="btn btn-lg btn-info" type="submit">Log in</button>
@@ -80,7 +82,7 @@
 	<footer class="footer">
 		<div class="container">
 			<div class="text-muted">OpenVidu © 2017</div>
-			<a href="http://www.codeurjc.es/" target="_blank"><img src="https://codeurjc.files.wordpress.com/2016/01/logo_cetrado_negro.png?w=275&amp;h=165"/></a>
+			<a href="http://www.openvidu.io/" target="_blank"><img class="openvidu-logo" src="images/openvidu_globe_bg_transp_cropped.png"/></a>
 		</div>
 	</footer>
 
diff --git a/openvidu-mvc-node/views/session.ejs b/openvidu-mvc-node/views/session.ejs
index e105ece2..f86a6182 100644
--- a/openvidu-mvc-node/views/session.ejs
+++ b/openvidu-mvc-node/views/session.ejs
@@ -1,9 +1,10 @@
 <html>
 
 <head>
-	<title>openvidu-mvc-java</title>
+	<title>openvidu-mvc-node</title>
 
 	<meta name="viewport" content="width=device-width, initial-scale=1" charset="utf-8"></meta>
+	<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon"></link>
 
 	<!-- Bootstrap -->
 	<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha256-k2WSCIexGzOj3Euiig+TlR8gA0EmPjuc79OEeY5L45g="
@@ -24,20 +25,22 @@
 	<nav class="navbar navbar-default">
 		<div class="container">
 			<div class="navbar-header">
-				<a class="navbar-brand" href="#">OpenVidu Tutorial</a>
-				<a class="navbar-brand nav-icon" href="https://github.com/OpenVidu/openvidu-tutorials/tree/master/openvidu-mvc-node" target="_blank"><i class="fa fa-github" aria-hidden="true"></i></a>
+				<a class="navbar-brand" href="/"><img class="demo-logo" src="images/openvidu_vert_white_bg_trans_cropped.png"/> MVC Node</a>
+				<a class="navbar-brand nav-icon" href="https://github.com/OpenVidu/openvidu-tutorials/tree/master/openvidu-mvc-node" title="GitHub Repository"
+				    target="_blank"><i class="fa fa-github" aria-hidden="true"></i></a>
+				<a class="navbar-brand nav-icon" href="http://www.openvidu.io/docs/tutorials/openvidu-mvc-node/" title="Documentation" target="_blank"><i class="fa fa-book" aria-hidden="true"></i></a>
 			</div>
 		</div>
 	</nav>
 
-	<div class="container vertical-center">
-		<div id="logged" class="horizontal-center">
+	<div id="main-container" class="container">
+		<div id="logged">
 			<div id="session">
 				<div id="session-header">
 					<h1 id="session-title"><%= sessionName %></h1>
 					<form action="/leave-session" method="post">
-						<input style="display:none" name="sessionname" value="<%= sessionName %>"></input>
-						<input style="display:none" name="token" value="<%= token %>"></input>
+						<input type="hidden" name="session-name" value="<%= sessionName %>"></input>
+						<input type="hidden" name="token" value="<%= token %>"></input>
 						<button id="buttonLeaveSession" class="btn btn-large btn-danger" type="submit" onclick="leaveSession()">
 							Leave session</button>
 					</form>
@@ -55,7 +58,7 @@
 	<footer class="footer">
 		<div class="container">
 			<div class="text-muted">OpenVidu © 2017</div>
-			<a href="http://www.codeurjc.es/" target="_blank"><img src="https://codeurjc.files.wordpress.com/2016/01/logo_cetrado_negro.png?w=275&amp;h=165"/></a>
+			<a href="http://www.openvidu.io/" target="_blank"><img class="openvidu-logo" src="images/openvidu_globe_bg_transp_cropped.png"/></a>
 		</div>
 	</footer>