Advertisement
flaarda

Hero of Mind Shipping Page - 4 columns

Mar 1st, 2015
276
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 7.51 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3. <head><title>{Title}</title>
  4. <link rel="shortcut icon" href="{Favicon}">
  5. <link href='http://fonts.googleapis.com/css?family=Oxygen|Annie+Use+Your+Telescope|Economica' rel='stylesheet' type='text/css'>
  6.  
  7. <!---
  8. Shipping Wall
  9. Created by 2x2verse @ tumblr
  10. Please don't remove this comment.
  11. --->
  12.  
  13. <style type="text/css">
  14.  
  15. body {
  16. background-image: url('http://img.photobucket.com/albums/v337/cinnamoniffer6/2x2/MIND.png');
  17. font-family: 'Arial';
  18. font-size: 11px;
  19. }
  20.  
  21. ::-webkit-scrollbar { width: 7px; }
  22. ::-webkit-scrollbar-track-piece { background-color:#12a874; }
  23. ::-webkit-scrollbar-thumb:vertical {
  24. width: 10px;
  25. background-color: #62c9a5;
  26. border: 3px solid #12a874;
  27. }
  28.  
  29. hr {
  30. display: block;
  31. margin-left: auto;
  32. margin-right: auto;
  33. border-style: solid;
  34. size: 0.5px;
  35. border-color: #12a874;
  36. }
  37.  
  38. /*Begin Shipping Wall*/
  39.  
  40. /*PAIRINGS*/
  41. #pairings {
  42. font-family: 'Annie Use Your Telescope';
  43. font-size: 30px;
  44. width: 264px;
  45. color: #fff;
  46. position: fixed;
  47. left: 74px;
  48. top: 18px;
  49. text-align:center;
  50. z-index: 1;
  51. }
  52.  
  53.  
  54. #box1 {
  55. width: 250px;
  56. height: 550px;
  57. position: fixed;
  58. left: 74px;
  59. top: 20px;
  60. overflow-y: auto;
  61. padding: 7px;
  62. text-align: center;
  63. z-index: 1000;
  64. background-color: #62c9a5;
  65. border-top: 35px solid #0b6848;
  66. border-bottom: 20px solid #0b6848;
  67. z-index: -1;
  68. }
  69.  
  70.  
  71.  
  72. /*MULTISHIPPING*/
  73. #multi {
  74. font-family: 'Annie Use Your Telescope';
  75. width: 264px;
  76. font-size: 30px;
  77. color: #fff;
  78. position: fixed;
  79. left: 399px;
  80. top: 18px;
  81. text-align:center;
  82. z-index: 1;
  83. }
  84.  
  85. #box2 {
  86. width: 250px;
  87. height: 550px;
  88. position: fixed;
  89. left: 399px;
  90. top: 20px;
  91. overflow-y: auto;
  92. padding: 7px;
  93. text-align: center;
  94. z-index: 1000;
  95. background-color: #62c9a5;
  96. border-top: 35px solid #0b6848;
  97. border-bottom: 20px solid #0b6848;
  98. z-index: -1;
  99. }
  100.  
  101.  
  102.  
  103. /*FRIENDS AND FAMILY*/
  104. #friendandfam {
  105. font-family: 'Annie Use Your Telescope';
  106. width: 264px;
  107. font-size: 30px;
  108. color: #fff;
  109. position: fixed;
  110. left: 724px;
  111. top: 18px;
  112. text-align:center;
  113. z-index: 1;
  114. }
  115.  
  116. #box3 {
  117. width: 250px;
  118. height: 550px;
  119. position: fixed;
  120. left: 724px;
  121. top: 20px;
  122. overflow-y: auto;
  123. padding: 7px;
  124. text-align: center;
  125. z-index: 1000;
  126. background-color: #62c9a5;
  127. border-top: 35px solid #0b6848;
  128. border-bottom: 20px solid #0b6848;
  129. z-index: -1;
  130. }
  131.  
  132.  
  133.  
  134. /*NOTPS*/
  135. #notp {
  136. font-family: 'Annie Use Your Telescope';
  137. width: 264px;
  138. font-size: 30px;
  139. color: #fff;
  140. position: fixed;
  141. left: 1047px;
  142. top: 18px;
  143. text-align:center;
  144. z-index: 1;
  145. }
  146.  
  147. #box4 {
  148. width: 252px;
  149. height: 550px;
  150. position: fixed;
  151. left: 1047px;
  152. top: 20px;
  153. overflow-y: auto;
  154. padding: 7px;
  155. text-align: center;
  156. z-index: 1000;
  157. background-color: #62c9a5;
  158. border-top: 35px solid #0b6848;
  159. border-bottom: 20px solid #0b6848;
  160. z-index: -1;
  161. }
  162.  
  163.  
  164.  
  165. /*Back to Blog*/
  166.  
  167. #back a {
  168. position: absolute;
  169. height: 100%;
  170. top: 0px;
  171. left: 0px;
  172. width: 15px;
  173. z-index: 10;
  174. color: #111;
  175. filter: alpha(opacity=50);
  176. -moz-opacity:0.5;
  177. -khtml-opacity: 0.5;
  178. opacity: 0.5;
  179. background-color: #0b6848;
  180. text-decoration: none;
  181. -webkit-transition: all 0.75s ease-in-out;
  182. -moz-transition: all 0.75s ease-in-out;
  183. -o-transition: all 0.75s ease-in-out;
  184. transition: all 0.75s ease-in-out;
  185. }
  186.  
  187. #back a:hover {
  188. color: #62c9a5;
  189. background-color: #0b6848;
  190. filter: alpha (opacity=100);
  191. -moz-opacity:1.0;
  192. -hhtml-opacity: 1.0;
  193. opacity: 1.0;
  194. }
  195.  
  196. /*CREDITS*/
  197.  
  198. #credit1 a {
  199. font-family: 'Annie Use Your Telescope';
  200. font-size: 14px;
  201. width: 264px;
  202. position: fixed;
  203. left: 74px;
  204. top: 620px;
  205. text-align:center;
  206. text-decoration: none;
  207. z-index: 1;
  208. color: #12a874;
  209. -webkit-transition: all 0.75s ease-in-out;
  210. -moz-transition: all 0.75s ease-in-out;
  211. -o-transition: all 0.75s ease-in-out;
  212. transition: all 0.75s ease-in-out;
  213. }
  214.  
  215. #credit1 a:hover {
  216. color: #fff;
  217. }
  218.  
  219. #credit2 a {
  220. font-family: 'Annie Use Your Telescope';
  221. font-size: 14px;
  222. width: 264px;
  223. position: fixed;
  224. left: 399px;
  225. top: 620px;
  226. text-align:center;
  227. text-decoration: none;
  228. z-index: 1;color: #12a874;
  229. -webkit-transition: all 0.75s ease-in-out;
  230. -moz-transition: all 0.75s ease-in-out;
  231. -o-transition: all 0.75s ease-in-out;
  232. transition: all 0.75s ease-in-out;
  233. }
  234.  
  235. #credit2 a:hover {
  236. color: #fff;
  237. }
  238.  
  239. #credit3 a {
  240. font-family: 'Annie Use Your Telescope';
  241. font-size: 14px;
  242. width: 264px;
  243. position: fixed;
  244. left: 724px;
  245. top: 620px;
  246. text-align:center;
  247. text-decoration: none;
  248. z-index: 1;
  249. color: #12a874;
  250. -webkit-transition: all 0.75s ease-in-out;
  251. -moz-transition: all 0.75s ease-in-out;
  252. -o-transition: all 0.75s ease-in-out;
  253. transition: all 0.75s ease-in-out;
  254. }
  255.  
  256. #credit3 a:hover {
  257. color: #fff;
  258. }
  259.  
  260. #credit4 a {
  261. font-family: 'Annie Use Your Telescope';
  262. font-size: 14px;
  263. width: 264px;
  264. position: fixed;
  265. left: 1047px;
  266. top: 620px;
  267. text-align:center;
  268. text-decoration: none;
  269. z-index: 1;
  270. color: #12a874;
  271. -webkit-transition: all 0.75s ease-in-out;
  272. -moz-transition: all 0.75s ease-in-out;
  273. -o-transition: all 0.75s ease-in-out;
  274. transition: all 0.75s ease-in-out;
  275. }
  276.  
  277. #credit4 a:hover {
  278. color: #fff;
  279. }
  280.  
  281. #credit a {
  282. position: fixed;
  283. bottom: 0px;
  284. right: 0px;
  285. font-size: 20px;
  286. text-decoration: none;
  287. color: #0b6848;
  288. z-index: 1001;
  289. -webkit-transition: all 0.75s ease-in-out;
  290. -moz-transition: all 0.75s ease-in-out;
  291. -o-transition: all 0.75s ease-in-out;
  292. transition: all 0.75s ease-in-out;
  293. }
  294.  
  295. #credit a:hover {
  296. color: #fff;
  297. }
  298.  
  299. </style>
  300. </head><body>
  301.  
  302. <div id="back"><a href="/"><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>◄<br>
  303. ◄<br>
  304. ◄<br></a></div>
  305.  
  306. <div id="pairings">pairings</div>
  307.  
  308. <div id="box1"> <!--Edit below for pairings-->
  309. ship one<br>
  310. <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
  311. ship two<br>
  312. ship three<br>
  313. ship four<br>
  314. ship five<br>
  315. ship six<br>
  316. ship seven<br>
  317. ship eight<br>
  318. ship nine<br>
  319. ship ten<br>
  320. </div>
  321.  
  322. <div id="credit1"><a href="http://cairovercoat.tumblr.com/post/49741463009/you-can-browse-through-all-of-them-online">background credit</a></div>
  323.  
  324. <div id="multi">multi</div>
  325.  
  326. <div id="box2"> <!--Edit below for multishipping-->
  327. ship one<br>
  328. ship two<br>
  329. ship three<br>
  330. ship four<br>
  331. ship five<br>
  332. ship six<br>
  333. ship seven<br>
  334. ship eight<br>
  335. ship nine<br>
  336. ship ten<br>
  337. </div>
  338.  
  339. <div id="credit2"><a href="http://feastings.tumblr.com/tagged/pixelings">sprite credit</a></div>
  340.  
  341. <div id="friendandfam">friends & family</div>
  342.  
  343. <div id="box3"> <!--Edit below for friends and family-->
  344. ship one<br>
  345. ship two<br>
  346. ship three<br>
  347. ship four<br>
  348. ship five<br>
  349. ship six<br>
  350. ship seven<br>
  351. ship eight<br>
  352. ship nine<br>
  353. ship ten<br>
  354. </div>
  355.  
  356. <div id="credit3"><a href="http://homestuckresources.tumblr.com/post/14831712260/shipping-icons-v2-0">icon credit 1</a></div>
  357.  
  358. <div id="notp">noTPs</div>
  359.  
  360. <div id="box4"> <!--Edit below for noTPs-->
  361. ship one<br>
  362. ship two<br>
  363. ship three<br>
  364. ship four<br>
  365. ship five<br>
  366. ship six<br>
  367. ship seven<br>
  368. ship eight<br>
  369. ship nine<br>
  370. ship ten<br>
  371. </div>
  372.  
  373. <div id="credit4"><a href="http://homestuckresources.tumblr.com/post/78326829823/technicalbug-technicalbug-family">icon credit 2</a></div>
  374.  
  375. <div id="credit"><a href="http://2x2verse.tumblr.com/" target="_blank">♎</a></div>
  376.  
  377. </body>
  378. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement