--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/ztfy/myams/resources/less/superbox.less	Wed May 07 10:36:24 2014 +0200
@@ -0,0 +1,129 @@
+/*
+ * Superbox component
+ */
+
+.superbox *,
+.superbox :after,
+.superbox :before {
+	margin: 0;
+	padding: 0;
+	box-sizing: border-box;
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	-webkit-font-smoothing: antialiased;
+	-moz-font-smoothing: antialiased;
+	-o-font-smoothing: antialiased;
+	font-smoothing: antialiased;
+	text-rendering: optimizeLegibility;
+}
+
+.superbox {
+	&-list {
+		display: inline-block;
+		*display: inline;
+		zoom: 1;
+		width: 12.5%;
+		padding: 5px;
+		position: relative;
+
+		&.active:before {
+			content: "\f0d8";
+			font-family: FontAwesome;
+			display: block;
+			position: absolute;
+			left: 43%;
+			bottom: -34px;
+			z-index: 2;
+			text-align: center;
+			font-size: 45px;
+			color: #222;
+		}
+
+		@media only screen and (min-width:320px) {
+			width: 50%;
+		}
+		@media only screen and (min-width:486px) {
+			width: 25%;
+		}
+		@media only screen and (min-width:768px) {
+			width: 16.66666667%;
+		}
+		@media only screen and (min-width:1025px) {
+			width: 12.5%;
+		}
+		@media only screen and (min-width:1824px) {
+			width: 12.5%;
+		}
+	}
+
+	&-img {
+		max-width: 100%;
+		width: 100%;
+		cursor: pointer;
+	}
+
+	&-show {
+		text-align: left;
+		position: relative;
+		background-color: #222;
+		width: 100%;
+		float: left;
+		padding: 25px 0 12px 25px;
+		display: none;
+		margin: 5px 0;
+	}
+
+	&-current-img {
+		max-width: 100%;
+		float: left;
+		padding-right: 25px;
+		padding-bottom: 13px;
+	}
+
+	&-img:hover {
+		opacity: .8;
+	}
+
+	&-float {
+		float: left;
+	}
+
+	&-close {
+		opacity: .7;
+		cursor: pointer;
+		position: absolute;
+		top: 15px;
+		right: 15px;
+		-webkit-transition: all .1s linear 0s;
+		transition: all .1s linear 0s;
+
+		&:hover {
+			opacity: 1;
+		}
+	}
+
+	&-imageinfo {
+		display: inline-block;
+		max-width: 500px;
+		color: #fff;
+		padding: 0 25px 0 0;
+
+		span {
+			font-size: 13px;
+			color: #a19994;
+			margin-right: -2px;
+			padding-top: 10px;
+			display: inline-block;
+			padding-bottom: 13px;
+		}
+
+		>:first-child {
+			margin-bottom: 10px;
+			font-weight: 700;
+		}
+
+		span p:last-child {
+			margin-top: 30px;
+		}
+	}
+}