View difference between Paste ID: <a href="/YHCkdiGG">YHCkdiGG</a> and <a href="/tFsah7qZ">tFsah7qZ</a>

=====
1		=====
2		HTML
3
4		<!doctype html>
5		<html class="no-js" lang="en">
6		<head>
7		<meta charset="utf-8" />
8		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
9		<link rel="stylesheet" href="css/foundation.css" />
10		<link rel="stylesheet" href="css/design.css" />
11		<script src="js/vendor/modernizr.js"></script>
12		</head>
13
14		<body style="background-color: #EEE;">
15		<!--<body style="background-image: url(img/bg.jpg);">-->
16
17		<div class="small-12 columns" style="background-color: #EEE; padding:0; margin:0;">
18		<div class="row">
19		<div class="small-12 columns padding-40">
20
21		<a class="box" href="https://twitch.tv/directory/following">
22		<div class="small-2 columns box">
23		<img src="img/twitch.jpg" width="100%" />
24		</div>
25		</a>
26
27		<a class="box" href="http://boards.4chan.org/a/catalog">
28		<div class="small-2 columns box">
29		<img src="img/a.jpg" width="100%" />
30		</div>
31		</a>
32
33		<a class="box" href="http://boards.4chan.org/vg/catalog">
34		<div class="small-2 columns box">
35		<img src="img/vg.jpg" width="100%" />
36		</div>
37		</a>
38
39		<a class="box" href="https://twitter.com">
40		<div class="small-2 columns box">
41		<img src="img/twitter.jpg" width="100%" />
42		</div>
43		</a>
44
45		<a class="box" href="https://facebook.com">
46		<div class="small-2 columns box">
47		<img src="img/facebook.jpg" width="100%" />
48		</div>
49		</a>
50
51		<a class="box" href="https://youtube.com">
52		<div class="small-2 columns box">
53		<img src="img/youtube.jpg" width="100%" />
54		</div>
55		</a>
56
57		</div>
58		</div>
59		</div>
60
61		<!--<div class="small-12 columns" style="background-color: #DDD; height: 1px;">
62		</div>-->
63
64		<div class="small-12 columns" style="background-color: #F5F5F5; padding:0; margin:0;">
65		<div class="row">
66		<div class="small-12 columns padding-40">
67
68		<a class="box" href="https://mail.google.com">
69		<div class="small-2 columns box">
70		<img src="img/gmail.jpg" width="100%" />
71		</div>
72		</a>
73
74		<a class="box" href="https://drive.google.com">
75		<div class="small-2 columns box">
76		<img src="img/drive.jpg" width="100%" />
77		</div>
78		</a>
79
80		<a class="box" href="https://mail.google.com/mail/u/1/">
81		<div class="small-2 columns box">
82		<img src="img/esl.jpg" width="100%" />
83		</div>
84		</a>
85
86		<a class="box" href="https://drive.google.com/drive/u/1/">
87		<div class="small-2 columns box">
88		<img src="img/esl-drive.jpg" width="100%" />
89		</div>
90		</a>
91
92		<a class="box" href="https://trello.com/">
93		<div class="small-2 columns box">
94		<img src="img/trello.jpg" width="100%" />
95		</div>
96		</a>
97
98		<a class="box" href="https://login.xero.com/">
99		<div class="small-2 columns box">
100		<img src="img/xero.jpg" width="100%" />
101		</div>
102		</a>
103
104		</div>
105		</div>
106		</div>
107
108	-	</body>
108	+
109		</div>
110
111		</body>
112
113		=====
114		CSS
115
116		.padding-40 {
117		padding-top: 40px;
118		padding-left: 40px;
119		padding-right: 40px;
120		padding-bottom: 40px;
121		}
122
123		.padding-20 {
124		padding-top: 20px;
125		padding-left: 20px;
126		padding-right: 20px;
127		padding-bottom: 20px;
128		}
129
130		.padding-80 {
131		padding-top: 80px;
132		padding-left: 80px;
133		padding-right: 80px;
134		padding-bottom: 80px;
135		}
136
137		.box:hover img {
138		opacity: 0.7;
139		}
140
141		.box {
142		text-align: center;
143		}