diff --git a/etemplate/templates/default/egw_tutorial.xet b/etemplate/templates/default/egw_tutorial.xet
index eae0e917f7..0db815b911 100644
--- a/etemplate/templates/default/egw_tutorial.xet
+++ b/etemplate/templates/default/egw_tutorial.xet
@@ -3,18 +3,25 @@
 <!-- $Id$ -->
 <overlay>
 	<template id="etemplate.egw_tutorial" template="" lang="" group="0" version="15.1">
-		<grid id="list" class="egwGridView_grid" height="200" overflow="auto">
+		<grid id="list" width="97%" height="200" overflow="auto">
 			<columns>
 				<column/>
 			</columns>
 			<rows>
 				<row >
 					<vbox onclick="$row_cont[onclick]" align="center" statustext="$row_cont[title]">
-						<description value = "$row_cont[title]" class="et2_ellipsis"/>
-						<image src="$row_cont[thumbnail]" height="70px"/>
+						<hbox background="$row_cont[thumbnail]" height="176px" width="99%" class="egw_tutorial_thumb">
+							<description value = "$row_cont[title]" class="egw_tutorial_title"/>
+							<hbox id="play" class="egw_tutorial_playBtn">
+								<hbox></hbox>
+							</hbox>
+						</hbox>
 					</vbox>
 				</row>
 			</rows>
 		</grid>
+		<styles>
+			
+		</styles>
 	</template>
 </overlay>
diff --git a/etemplate/templates/default/etemplate2.css b/etemplate/templates/default/etemplate2.css
index 256b6391e0..09bf4560d1 100644
--- a/etemplate/templates/default/etemplate2.css
+++ b/etemplate/templates/default/etemplate2.css
@@ -1975,4 +1975,58 @@ div.flash-click-to-play-dialog {
 .et2_ellipsis {
 	text-overflow: ellipsis;
 	overflow: hidden;
-}
\ No newline at end of file
+}
+
+/*egw tutorial styles - start*/
+span.egw_tutorial_title {
+    color: #FFFFFF;
+    font-weight: bold;
+    text-align: left;
+    width: 99%;
+    background-color: #434343;
+    border: 1px solid #B3B3B3;
+    padding-top: 4px;
+    padding-left: 5px;
+    border-radius: 2px;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow-x: hidden;
+}
+.egw_tutorial_thumb:hover [id^="egw_tutorial_"][id$="_play"].egw_tutorial_playBtn,
+.egw_tutorial_thumb:hover #home-tutorial_play.egw_tutorial_playBtn{
+	background-color: #434343;
+}
+.egw_tutorial_thumb:hover [id^="egw_tutorial_"][id$="_play"].egw_tutorial_playBtn> div,
+.egw_tutorial_thumb:hover #home-tutorial_play.egw_tutorial_playBtn> div{
+	border-left-color: white;
+}
+.egw_tutorial_thumb {
+	background-repeat: no-repeat;
+	background-position: -2px;
+	border-radius: 5px;
+}
+[id^="egw_tutorial_"][id$="_play"].egw_tutorial_playBtn,
+#home-tutorial_play.egw_tutorial_playBtn{
+	display:block;
+	margin:20%;
+	border: 2px solid rgba(0,0,0,0.7);
+	-webkit-border-radius: 100%;
+	-moz-border-radius: 100%;
+	border-radius: 100%;
+	width: 40px;
+	height: 40px;
+	cursor: pointer;
+}
+[id^="egw_tutorial_"][id$="_play"].egw_tutorial_playBtn> div,
+#home-tutorial_play.egw_tutorial_playBtn>div{
+	display:block;
+	position:relative;
+	top: 10px;
+	left: 45%;
+	width: 0;
+	height: 0;
+	border-top: 10px solid transparent;
+	border-bottom: 10px solid transparent;
+	border-left: 10px solid rgba(0,0,0,0.8);
+}
+/*egw tutorial styles - end*/
\ No newline at end of file