123456789101112131415161718192021222324252627282930313233343536373839404142434445464748 |
- /* The grid: Four equal columns that floats next to each other */
- .singleImg {
- float: left;
- width: 25%;
- padding: 10px;
- }
-
- /* Style the images inside the grid */
- .singleImg img {
- opacity: 0.8;
- cursor: pointer;
- }
-
- .singleImg img:hover {
- opacity: 1;
- }
-
- /* Clear floats after the columns */
- .row#images:after {
- content: "";
- display: table;
- clear: both;
- }
-
- /* The expanding image container */
- .container_img {
- position: relative;
- display: none;
- }
-
- /* Expanding image text */
- #imgtext {
- position: absolute;
- bottom: 15px;
- left: 15px;
- color: white;
- font-size: 20px;
- }
-
- /* Closable button inside the expanded image */
- .closebtn {
- top: 10px;
- right: 15px;
- color: #000;
- font-size: 40px;
- cursor: pointer;
- float:right;
- }
|