rounded : better folder names

config.php

@@ -19,8 +19,8 @@ Please enjoy this free script!
 $thumbs_pr_page 		= "39"; //Number of thumbnails on a single page
 $gallery_width 			= "80%"; //Gallery width. Eg: "500px" or "70%"
 $backgroundcolor 		= "white"; //This provides a quick way to change your gallerys background to suit your website. Use either main colors like "black", "white", "yellow" etc. Or HEX colors, eg. "#AAAAAA"
-$templatefile 			= "squares"; //Template filename (must be placed in 'templates' folder)
+$templatefile 			= "rounded"; //Template filename (must be placed in 'templates' folder)
-$title 					= "MiniGal Nano test gallery"; // Text to be displayed in browser titlebar
+$title 					= "MiniBoardNano gallery"; // Text to be displayed in browser titlebar
 $author					= "John Doe";
 $folder_color 			= "black"; // Color of folder icons: blue / black / vista / purple / green / grey
 $sorting_folders		= "name"; // Sort folders by: [name][date]
@@ -39,5 +39,5 @@ $label_loading 			= "Loading..."; //Thumbnail loading text
 //ADVANCED SETTINGS
 $thumb_size 			= 320; //Thumbnail height/width (square thumbs). Changing this will most likely require manual altering of the template file to make it look properly! 
 $label_max_length 		= 40; //Maximum chars of a folder name that will be displayed on the folder thumbnail  
-$display_exif			= 0;
+$display_exif			= 0; //Take care, even if not diplayed EXIF are still readable for visitors. May be a good idea to erase EXIF datas...
 ?>

templates/rounded.html

@@ -15,103 +15,149 @@
 html {
 	font-size:62.5%;
 }
-		.clear{clear:both;}
+
+.clear {
+	clear:both;
+}
+
 body {
+	width:100%;
 	margin:0;
 	padding:0;
-			width: 100%;
-			font-size: 1.5rem;
 	font-family:Helvetica,Arial,sans-serif;
-			background: #3B3A37;
+	font-size:1.5rem;
 	color:#FFF;
+	background:#3B3A37;
 }
 
 a {
-			color: #FFF;
-			font-weight: bold;
 	text-decoration:none;
+	font-weight:bold;
+	color:#FFF;
 }
+
 h1 {
+	margin:20px 0 0;
 	font-family:Georgia,Lucida,serif;
 	font-style:italic;
-			margin: 20px 0 0 0;
-			
 }
+
 h1 a {
 	color:#E63D24;
 }
 
 body > header {
-			text-align: center;
-			padding: 1px;
 	margin-bottom:15px;
+	padding:1px;
+	text-align:center;
 }
-		#container, #innerheader{
+
+#container,
+#innerheader {
+	margin:0 auto;
 	max-width:<% gallery_width %>;
-			margin: 0px auto;
 }
+
 img {
 	border:none;
 }
+
 nav {
+	padding:15px 0;
 	font-size:1.3em;
-			padding: 15px 0px;
 }
+
 body > nav {
 	text-align:center;
 }
-		#folder_comment
+
-		{
+#folder_comment {
 	margin-bottom:10px;
 }
+
 #folder_comment a {
-			color: #FFCC11;
 	text-decoration:none;
+	color:#FFCC11;
 }
 
 #gallery {
-			list-style: none;
 	margin:0;
 	padding:0;
+	list-style:none;
 }
-		#gallery li, #gallery li img {
+
+#gallery li,
+#gallery li img {
 	border-radius:4px;
 }
+
 #gallery li {
 	float:left;
 	position:relative;
 	margin:.5%;
 }
-		#gallery li img{
-			width: 86%;
-			margin: 0% 7%; 
-			border-radius:100%;
-			-webkit-box-shadow:  0px 0px 2px -1px #000;
-			box-shadow:  0px 0px 2px -1px #000;
-		}
-		#gallery li:hover img {
 
+#gallery li img {
+	width:100%;
+	border-radius:100%;
+	-webkit-box-shadow:0 0 2px -1px #000;
+	box-shadow:0 0 2px -1px #000;
+}
+
+#gallery li:hover img {
+	-webkit-box-shadow:0 0 5px 0 #000;
+	box-shadow:0 0 5px 0 #000;
 	-webkit-transition:all .3s ease;
 	-moz-transition:all .3s ease;
 	-ms-transition:all .3s ease;
 	-o-transition:all .3s ease;
 	transition:all .3s ease;
-			-webkit-box-shadow:  0px 0px 5px 0px #000;
-			box-shadow:  0px 0px 5px 0px #000;
 }
+
+#gallery em,
+#gallery li:hover em {
+	-webkit-transition:all .2s ease-in;
+	-moz-transition:all .2s ease-in;
+	-ms-transition:all .2s ease-in;
+	-o-transition:all .2s ease-in;
+	transition:all .2s ease-in;
+}
+
 #gallery em {
-			text-align: center;
-			font-style: normal;
-			padding: 8px 0px;
-			display: block;
 	position:absolute;
-			bottom:0px;
+	top:0;
+	bottom:0;
+	zoom:1;
 	width:100%;
+	padding:40% 0;
+	border-radius:100%;
+	text-align:center;
+	font-family:Georgia,Lucida,serif;
+	font-size:2.5rem;
+	font-style:italic;
+	color:#FFF;
+	opacity:0;
+	background:rgba(0,0,0,.9);
+	filter:alpha(opacity=0);
 }
+
+#gallery li:hover em {
+	zoom:1;
+	opacity:1;
+	filter:alpha(opacity=1);
+}
+
+#gallery li:hover img {
+	zoom:1;
+	opacity:0;
+	filter:alpha(opacity=0);
+}
+
 footer {
-			margin: 25px 0px;
+	margin:25px 0;
 	text-align:center;
 }
+
 footer a {
 	text-decoration:none;
 	color:#666;