reValuate/home/static/home/css/gallery.css

@@ -1,18 +1,21 @@
-.popup{
+.popup {
 	width: 900px;
 	margin: auto;
 	text-align: center;
 }
-.popup img{
+
+.popup img {
 	width: 200px;
 	height: 200px;
 	cursor: pointer;
 }
-.show{
+
+.show {
 	z-index: 999;
 	display: none;
 }
-.show .overlay{
+
+.show .overlay {
 	width: 100%;
 	height: 100%;
 	background: rgba(0,0,0,.66);
@@ -20,7 +23,8 @@
 	top: 0;
 	left: 0;
 }
-.show .img-show{
+
+.show .img-show {
 	width: 600px;
 	height: 400px;
 	background: #FFF;
@@ -30,14 +34,16 @@
 	transform: translate(-50%,-50%);
 	overflow: hidden;
 }
-.img-show span{
+
+.img-show span {
 	position: absolute;
 	top: 10px;
 	right: 10px;
 	z-index: 99;
 	cursor: pointer;
 }
-.img-show img{
+
+.img-show img {
 	width: 100%;
 	height: 100%;
 	position: absolute;
@@ -49,36 +55,36 @@
 	box-sizing: border-box;
 	margin: 0;
 	padding: 0;
-  }
+}
 
-  body {
+body {
 	font-family: Raleway;
 	background-color: #202125;
-  }
+}
 
-  .heading {
+.heading {
 	text-align: center;
 	font-size: 2.0em;
 	letter-spacing: 1px;
 	padding: 40px;
 	color: white;
-  }
+}
 
-  .gallery-image {
+.gallery-image {
 	padding: 20px;
 	display: flex;
 	flex-wrap: wrap;
 	justify-content: center;
-  }
+}
 
-  .gallery-image img {
+.gallery-image img {
 	height: 250px;
 	width: 350px;
 	transform: scale(1.0);
 	transition: transform 0.4s ease;
-  }
+}
 
-  .img-box {
+.img-box {
 	box-sizing: content-box;
 	margin: 10px;
 	height: 250px;
@@ -88,47 +94,34 @@
 	color: white;
 	position: relative;
 	background-color: white;
-  }
+}
 
-  .caption {
+.caption {
 	position: absolute;
 	bottom: 5px;
 	left: 20px;
 	opacity: 0.0;
 	transition: transform 0.3s ease, opacity 0.3s ease;
-  }
+}
 
-  .transparent-box {
+.transparent-box {
 	height: 250px;
 	width: 350px;
-    background-color:rgba(0, 0, 0, 0);
+	background-color: rgba(0, 0, 0, 0);
 	position: absolute;
 	top: 0;
 	left: 0;
 	transition: background-color 0.3s ease;
-  }
+}
 
-  .img-box:hover img {
-    transform: scale(1.1);
-  }
+.img-box:hover img { transform: scale(1.1); }
+.img-box:hover .transparent-box { background-color: rgba(0, 0, 0, 0.5); }
 
-  .img-box:hover .transparent-box {
-    background-color:rgba(0, 0, 0, 0.5);
-  }
-
-  .img-box:hover .caption {
+.img-box:hover .caption {
 	transform: translateY(-20px);
 	opacity: 1.0;
-  }
+}
 
-  .img-box:hover {
-    cursor: pointer;
-  }
-
-  .caption > p:nth-child(2) {
-    font-size: 0.8em;
-  }
-
-  .opacity-low {
-    opacity: 0.5;
-  }
+.img-box:hover { cursor: pointer; }
+.caption > p:nth-child(2) { font-size: 0.8em; }
+.opacity-low { opacity: 0.5; }