octomoosey

hex

Jul 19th, 2015
8,964
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 18.13 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <!-- octomoosey @ tumblr -->
  4.  
  5. <html xmlns="https://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  6. <head><title>{Title}</title>
  7. <link rel="shortcut icon" href="{Favicon}">
  8. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  9. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  10.  
  11. <meta name="color:background" content="#000"/>
  12. <meta name="color:hex" content="#fff"/>
  13. <meta name="color:hextext" content="#fff"/>
  14. <meta name="color:text" content="#fff"/>
  15. <meta name="color:border" content="#fff"/>
  16. <meta name="color:description" content="#fff"/>
  17. <meta name="color:bold" content="#eee" />
  18. <meta name="color:italic" content="#f2992e" />
  19. <meta name="color:title" content="#f2992e" />
  20. <meta name="color:scrollbar" content="#f2992e" />
  21. <meta name="color:firstletter" content="#f2992e" />
  22. <meta name="color:link" content="#f2992e"/>
  23. <meta name="color:linkhover" content="#b8b8b8"/>
  24. <meta name="color:info" content="#f2992e"/>
  25. <meta name="color:infohover" content="#b8b8b8"/>
  26. <meta name="color:tags" content="#f2992e"/>
  27. <meta name="color:tagshover" content="#b8b8b8"/>
  28.  
  29. <meta name="image:background" content="https://static.tumblr.com/kllbcnj/tjcnrqgad/techtheme4.gif" />
  30. <meta name="image:border" content="https://static.tumblr.com/b20b8c758b27bb596bf3e3146bd6c672/uopakca/gmbnrmyz4/tumblr_static_3af8v46n9gao48ggco08kc00k.gif" />
  31.  
  32. <meta name="text:link 1" content="link 1"/>
  33. <meta name="text:link 1 url" content="/"/>
  34. <meta name="text:link 2" content="link 2"/>
  35. <meta name="text:link 2 url" content="/"/>
  36. <meta name="text:link 3" content="link 3"/>
  37. <meta name="text:link 3 url" content="/"/>
  38. <meta name="text:link 4" content="link 4"/>
  39. <meta name="text:link 4 url" content="/"/>
  40. <meta name="text:link 5" content="link 5"/>
  41. <meta name="text:link 5 url" content="/"/>
  42.  
  43. <meta name="if:greyscale" content="1"/>
  44. <meta name="if:crosshair" content="1"/>
  45. <meta name="if:title" content="1"/>
  46. <meta name="font:body font" content="Gibson">
  47. <meta name="text:text size" content="11px" />
  48.  
  49. <link href='https://fonts.googleapis.com/css?family=Ubuntu' rel='stylesheet' type='text/css'>
  50.  
  51. <link href='https://fonts.googleapis.com/css?family=Fjalla+One' rel='stylesheet' type='text/css'>
  52.  
  53. <meta name="image:background" content=""/>
  54.  
  55. <style type="text/css">
  56.  
  57. ::-webkit-scrollbar {
  58. width: 2px;
  59. height: 2px;
  60. }
  61. ::-webkit-scrollbar-button {
  62. width: 0px;
  63. height: 0px;
  64. }
  65. ::-webkit-scrollbar-thumb {
  66. background: {color:scrollbar};
  67. border: 0px none #ffffff;
  68. border-radius: 50px;
  69. }
  70.  
  71. iframe#tumblr_controls {
  72. right:3px !important;
  73. position: fixed !important;
  74. -webkit-transition: opacity 0.7s
  75. linear;opacity: 0.2;
  76. -webkit-transition: all 0.8s ease-out;
  77. -moz-transition: all 0.8s ease-out;
  78. transition: all 0.8s ease-out;}
  79.  
  80. iframe#tumblr_controls:hover{
  81. -webkit-transition: opacity 0.7s linear;
  82. opacity: 1;
  83. -webkit-transition: all 0.4s ease-out;
  84. -moz-transition: all 0.4s ease-out;
  85. transition: all 0.4s ease-out;}
  86.  
  87. {block:ifcrosshair}
  88. body, a, a:hover{
  89. cursor:crosshair;}
  90. {/block:ifcrosshair}
  91.  
  92. body {
  93. background-color:{color:background};
  94. background-image: url('{image:background}');
  95. background-position: top center;
  96. background-repeat: no-repeat;
  97. background-attachment: fixed;
  98. line-height:110%;
  99. color:{color:text};
  100. font-family:{font:body font};
  101. font-size: {text:text size};}
  102.  
  103. a {
  104. text-decoration:none;
  105. outline:none;
  106. -moz-outline-style:none;
  107. color:{color:link};
  108. -webkit-transition: all 0.7s ease;
  109. -moz-transition: all 0.7s ease;
  110. -o-transition: all 0.7s ease;}
  111.  
  112. a:hover {
  113. color:{color:linkhover};
  114. -webkit-transition: all 0.7s ease;
  115. -moz-transition: all 0.7s ease;
  116. -o-transition: all 0.7s ease;}
  117.  
  118. blockquote {
  119. padding:2px 7px;
  120. margin:3px 0 3px 8px;
  121. border-left:1px dashed {color:border};
  122. background-color:transparent;}
  123.  
  124. blockquote img {
  125. max-width:100%;
  126. height:auto;}
  127.  
  128. b, strong {
  129. text-transform:uppercase;
  130. color:{color:bold};
  131. font-size:14px;}
  132.  
  133. i, em {
  134. font-family: 'Fjalla One', sans-serif;
  135. color:{color:italic};
  136. letter-spacing:1.5px;
  137. font-size:14px;}
  138.  
  139. small,sup,sub {
  140. font-size:{text:Text Size}}
  141.  
  142. big {
  143. font-size:12px;}
  144.  
  145. pre {
  146. color:{color:pretext};
  147. background-color:{color:pre};
  148. font-size:10px;
  149. padding:20px;
  150. white-space: pre-wrap; /* css-3 */
  151. white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
  152. white-space: -pre-wrap; /* Opera 4-6 */
  153. white-space: -o-pre-wrap; /* Opera 7 */
  154. word-wrap: break-word; /* Internet Explorer 5.5+ */}
  155.  
  156. img {
  157. max-width:100%;
  158. height:auto;}
  159.  
  160. {block:IfGreyscale}
  161.  
  162. img {
  163. -webkit-filter:grayscale(100%);
  164. -webkit-transition: all 0.9s ease-in-out;
  165. -moz-transition: all 0.9s ease-in-out;
  166. -o-transition: all 0.9s ease-in-out;
  167. -ms-transition: all 0.9s ease-in-out;
  168. transition: all 0.9s ease-in-out;}
  169.  
  170. img:hover {
  171. -webkit-filter:none;}
  172.  
  173. .html_photoset {
  174. -webkit-filter: grayscale(100%);
  175. -webkit-transition: all 0.9s ease-in-out;
  176. -moz-transition: all 0.9s ease-in-out;
  177. -o-transition: all 0.9s ease-in-out;
  178. -ms-transition: all 0.9s ease-in-out;
  179. transition: all 0.9s ease-in-out;}
  180.  
  181. .html_photoset:hover {
  182. -webkit-filter: none;}
  183.  
  184. {/block:IfGreyscale}
  185.  
  186. {block:IfTitle}
  187. .title {
  188. font-family: 'Fjalla One', sans-serif;
  189. position:fixed;
  190. left: 50%;
  191. top:580px;
  192. margin-left: 140px;
  193. text-align:right;
  194. font-size:20px;
  195. letter-spacing:2px;
  196. color:{color:title};}
  197. {/block:IfTitle}
  198.  
  199. h1 {
  200. font-family: 'Fjalla One', sans-serif;
  201. font-size: 20px;
  202. line-height: 15px;
  203. letter-spacing:5px;
  204. font-weight:normal;
  205. color:{color:text};}
  206.  
  207. h1:first-letter {
  208. font-family: 'Fjalla One', sans-serif;
  209. font-size: 30px;
  210. line-height: 15px;
  211. margin-right:5px;
  212. color:{color:firstletter};
  213. text-transform:uppercase;}
  214.  
  215. h2 {
  216. font-family: 'Fjalla One', sans-serif;
  217. font-size: 20px;
  218. line-height: 15px;
  219. letter-spacing:6px;
  220. font-weight:normal;
  221. color:{color:text};}
  222.  
  223. h2:first-letter {
  224. font-family: 'Fjalla One', sans-serif;
  225. font-size: 30px;
  226. line-height: 15px;
  227. letter-spacing:0px;
  228. color:{color:firstletter};
  229. margin-right:5px;
  230. text-transform:uppercase;}
  231.  
  232. #entries {
  233. position:fixed;
  234. width:440px;
  235. background:transparent;
  236. height:400px;
  237. left: 50%;
  238. top:150px;
  239. margin-left: -135px;
  240. z-index:999;
  241. position:relative;
  242. overflow-y:scroll;}
  243.  
  244. .posts {
  245. width: 400px;
  246. padding: 10px;
  247. margin-left:10px;
  248. margin-bottom:30px;
  249. text-align:justify;}
  250.  
  251. #description {
  252. z-index:99999999999;
  253. font-family: 'Fjalla One', sans-serif;
  254. position:fixed;
  255. left: 50%;
  256. top:420px;
  257. width:150px;
  258. margin-left: -340px;
  259. text-align:right;
  260. font-size:11px;
  261. line-height:120%;
  262. color:{color:description};}
  263.  
  264. #pagination {
  265. font-family:{font:body font};}
  266.  
  267. .container {
  268. position:fixed;
  269. left: 50%;
  270. top:20px;
  271. width:450px;
  272. margin-left: -340px;
  273. -webkit-transition: all 0.3s ease-out;
  274. transition: all 0.3s ease-out;
  275. height: 500px;
  276. -webkit-perspective: 500px;
  277. perspective: 500px;
  278. z-index: 10;
  279. overflow: hidden;}
  280.  
  281. .container .honeycomb {
  282. display: block;
  283. position: absolute;
  284. margin-left: -200px;
  285. padding-left: 18px;
  286. left: 50%;
  287. text-align: center;
  288. height: 450px;
  289. width: 200px;
  290. -ms-transform: rotateX(45deg) rotateY(0deg);
  291. -webkit-transform: rotateX(45deg) rotateY(0deg);
  292. transform: rotateX(45deg) rotateY(0deg);
  293. -webkit-transform-style: preserve-3d;
  294. transform-style: preserve-3d;
  295. -ms-transform-origin: center 65%;
  296. -webkit-transform-origin: center 65%;
  297. transform-origin: center 65%;
  298. z-index: 5;}
  299.  
  300. .container .honeycomb .column {
  301. display: block;
  302. float: left;
  303. width: 62px;}
  304.  
  305. .container .honeycomb .column:nth-child(odd) { margin-top: 36px; }
  306.  
  307. .container .honeycomb .hex {
  308. display: block;
  309. position: relative;
  310. float: left;
  311. margin: 0;
  312. height: 72px;
  313. width: 62px;
  314. color: #fff;
  315. text-decoration: none;
  316. -webkit-transform-style: preserve-3d;
  317. transform-style: preserve-3d;
  318. -webkit-transition: all 0.3s ease-out;
  319. transition: all 0.3s ease-out;
  320. filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
  321. opacity: 0.5;}
  322.  
  323. .container .honeycomb .hex:hover {
  324. opacity: 1;
  325. -ms-transform: translateZ(20px);
  326. -webkit-transform: translateZ(20px);
  327. transform: translateZ(20px);
  328. -webkit-transition-duration: 200ms;
  329. transition-duration: 200ms;}
  330.  
  331. .container .honeycomb .hex:hover .content {
  332. filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  333. opacity: 1;
  334. -ms-transform: rotateX(-90deg) translateZ(-40px) translateY(-50px);
  335. -webkit-transform: rotateX(-90deg) translateZ(-40px) translateY(-50px);
  336. transform: rotateX(-90deg) translateZ(-40px) translateY(-50px);}
  337.  
  338. .container .honeycomb .hex .wrapper {
  339. display: block;
  340. position: absolute;
  341. top: 0;
  342. left: 0;
  343. height: 100%;
  344. width: 100%;}
  345.  
  346. .container .honeycomb .hex .wrapper .color-1 { background: {color:hex}; }
  347.  
  348. .container .honeycomb .hex .wrapper .color-1:before { border-right-color: {color:hex}; }
  349.  
  350. .container .honeycomb .hex .wrapper .color-1:after { border-left-color: {color:hex}; }
  351.  
  352. .container .honeycomb .hex .content {
  353. display: block;
  354. position: absolute;
  355. top: 40px;
  356. left: -80px;
  357. text-align: center;
  358. color:{color:hextext};
  359. width: 200px;
  360. filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  361. opacity: 0;
  362. -moz-transition: all 0.3s ease-out 0.1s;
  363. -o-transition: all 0.3s ease-out 0.1s;
  364. -webkit-transition: all 0.3s ease-out;
  365. -webkit-transition-delay: 0.1s;
  366. -webkit-transition: all 0.3s ease-out 0.1s;
  367. transition: all 0.3s ease-out 0.1s;
  368. -ms-transform: rotateX(-90deg) translateZ(-40px) translateY(-30px);
  369. -webkit-transform: rotateX(-90deg) translateZ(-40px) translateY(-30px);
  370. transform: rotateX(-90deg) translateZ(-40px) translateY(-30px);
  371. pointer-events: none;
  372. -webkit-font-smoothing: antialiased;
  373. text-shadow: -1px -1px 2px rgba(0, 0, 0, 0.8);
  374. font-size: 18px;}
  375.  
  376. .hexagon {
  377. display: block;
  378. position: absolute;
  379. width: 36px;
  380. height: 62px;
  381. background-color: {color:hex};}
  382.  
  383. .hexagon:before,
  384. .hexagon:after {
  385. content: "";
  386. position: relative;
  387. float: left;
  388. border-top: 31px solid transparent;
  389. border-bottom: 31px solid transparent;}
  390.  
  391. .hexagon:before {
  392. border-right: 18px solid {color:hex};
  393. left: -18px;}
  394.  
  395. .hexagon:after {
  396. border-left: 18px solid {color:hex};
  397. right: -18px;
  398. }
  399.  
  400. .hidden { display: none; }
  401.  
  402. #askurl {
  403. font-size:12px;
  404. letter-spacing:3px;
  405. margin-left:0px;
  406. margin-right:5px;}
  407.  
  408. #question {
  409. font-family: 'Fjalla One', sans-serif;
  410. border:1px solid {color:text};
  411. padding:5px;
  412. font-style: italic;
  413. margin-top:8px;
  414. font-size: 11px;
  415. margin-left:0px;
  416. text-align:center;}
  417.  
  418. #quote {
  419. font-size:16px;
  420. font-family: 'Fjalla One', sans-serif;
  421. text-align: center;
  422. font-weight: 300;
  423. letter-spacing: 1.5px;
  424. line-height: 130%;
  425. padding-bottom: 10px;}
  426.  
  427. #cover {
  428. position: relative;
  429. z-index: 1;
  430. height: 80px;
  431. float:left;
  432. margin:4px;
  433. box-shadow:0px 0px 5px #000;}
  434.  
  435. #button {
  436. width:20px;
  437. height:30px;
  438. overflow: hidden;
  439. position: relative;
  440. z-index: 99;
  441. margin: 15px 24px 13px 16px;}
  442.  
  443. #buttons {
  444. background-color: #fff;
  445. position: absolute;
  446. z-index: 99;
  447. margin-top: 15px;
  448. margin-left: 15px;
  449. opacity: 0;
  450. -webkit-transition: opacity 0.5s linear;
  451. -webkit-transition: all 0.5s linear;
  452. -moz-transition: all 0.5s linear;
  453. -o-transition: all 0.5s linear;}
  454.  
  455. #post:hover #buttons {
  456. opacity:1;}
  457.  
  458. #musicinfo {
  459. margin-left: 110px;
  460. font-size:10px;
  461. min-height:70px;
  462. text-align:left;
  463. position: relative;}
  464.  
  465. .note {
  466. color:#fff;
  467. text-transform:uppercase;
  468. width:498px;
  469. font-style:normal;
  470. letter-spacing:0px;
  471. font-size: 10px;
  472. text-align:left;
  473. line-height:100%;
  474. margin-left:-15px;}
  475.  
  476. .note li {
  477. list-style-type:none;
  478. padding:10px ;
  479. text-align:left;
  480. -moz-transition-duration:0.5s;
  481. -webkit-transition-duration:0.5s;
  482. -o-transition-duration:0.5s;}
  483.  
  484. .note img.avatar {
  485. margin-right: 10px;
  486. width: 16px;
  487. height: 16px;}
  488.  
  489. .tags {
  490. text-align:left;
  491. letter-spacing:1px;
  492. font-size:8px;
  493. margin-top:5px;
  494. -webkit-transition: all 0.8s ease;
  495. -moz-transition: all 0.8s ease;
  496. transition: all 0.8s ease;}
  497.  
  498. .tags a {
  499. color:{color:tags};}
  500.  
  501. .tags a:hover {
  502. color:{color:tagshover};}
  503.  
  504. #permalink {
  505. font-size:9px;
  506. line-height:11px;
  507. text-align:left;
  508. margin-top:5px;
  509. letter-spacing:1px;
  510. padding-top:8px;
  511. padding-bottom:5px;
  512. -webkit-transition: all 0.8s ease;
  513. -moz-transition: all 0.8s ease;
  514. transition: all 0.8s ease;}
  515.  
  516. #permalink a {
  517. color:{color:info};}
  518.  
  519. #permalink a:hover {
  520. color:{color:infohover};}
  521.  
  522.  
  523. </style></head>
  524. <body>
  525.  
  526. <div class="container">
  527. <div class="honeycomb">
  528.  
  529. <div class="hexes-1 column">
  530.  
  531. <a class="hex" href="/"><div class="wrapper">
  532. <div class="hexagon color-1"></div></div>
  533. <span class="content">home</span> </a>
  534.  
  535. <a class="hex" href="/ask"><div class="wrapper">
  536. <div class="hexagon color-1"></div></div>
  537. <span class="content">queries</span> </a>
  538.  
  539. <a class="hex" href="/submit"><div class="wrapper">
  540. <div class="hexagon color-1"></div></div>
  541. <span class="content">submit</span> </a>
  542.  
  543. <a class="hex" href="/archive"><div class="wrapper">
  544. <div class="hexagon color-1"></div></div>
  545. <span class="content">archive</span> </a>
  546.  
  547. <a class="hex" href="https://octomoosey.tumblr.com/"><div class="wrapper">
  548. <div class="hexagon color-1"></div></div>
  549. <span class="content">theme</span> </a>
  550.  
  551. </div>
  552.  
  553. <div class="hexes-2 column">
  554.  
  555. {block:iflink1}<a class="hex" href="{text:link 1 url}">
  556. <div class="wrapper">
  557. <div class="hexagon color-1"></div></div>
  558. <span class="content">{text:link 1}</span> </a> {/block:iflink1}
  559.  
  560. {block:iflink2}<a class="hex" href="{text:link 2 url}">
  561. <div class="wrapper">
  562. <div class="hexagon color-1"></div></div>
  563. <span class="content">{text:link 2}</span> </a> {/block:iflink2}
  564.  
  565. {block:iflink3}<a class="hex" href="{text:link 3 url}">
  566. <div class="wrapper">
  567. <div class="hexagon color-1"></div></div>
  568. <span class="content">{text:link 3}</span> </a> {/block:iflink3}
  569.  
  570. {block:iflink4}<a class="hex" href="{text:link 4 url}">
  571. <div class="wrapper">
  572. <div class="hexagon color-1"></div></div>
  573. <span class="content">{text:link 4}</span> </a> {/block:iflink4}
  574.  
  575. {block:iflink5}<a class="hex" href="{text:link 5 url}">
  576. <div class="wrapper">
  577. <div class="hexagon color-1"></div></div>
  578. <span class="content">{text:link 5}</span> </a> {/block:iflink5}
  579.  
  580. </div></div></div>
  581.  
  582. <div id="description">{description}<br><br>{block:Pagination}
  583. <div id="pagination">{block:PreviousPage}<a href="{PreviousPage}"><big>⇜</big></a>{/block:PreviousPage} {CurrentPage} of {TotalPages} {block:NextPage}<a href="{NextPage}"><big>⇝</big></a>
  584. {/block:NextPage}
  585. {/block:Pagination}</div></div>
  586.  
  587. <div class="title">{title}</div>
  588.  
  589. </div></div></div>
  590.  
  591. <div id="entries">
  592. {block:Posts}
  593. <div class="posts">
  594.  
  595. {block:Text}<h1>{block:Title}{Title}{/block:Title}</h1>{Body}{/block:Text}
  596.  
  597. {block:Photo}<center><img src="{PhotoURL-400}" alt="{PhotoAlt}"/>
  598. </center>{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  599.  
  600. {block:Photoset}{Photoset-400}{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  601.  
  602. {block:Link}<h1><a href="{URL}" {Target}>{Name}</a></h1>{block:Description}{Description}{/block:Description}{/block:Link}
  603.  
  604. {block:Quote}<div id="quote">{Quote}</div><br>{block:Source}<b><div style="font-family: courier new; font-size: 11px; text-align: center;">{Source}</div></b>{/block:Source}{/block:Quote}
  605.  
  606. {block:Audio}<left>{block:AlbumArt}<img src="{AlbumArtURL}" width="60px" height="60px" align="left" style="margin-right:10px" />{/block:AlbumArt}<span class="audio">{AudioPlayerWhite}</left></span>
  607. {block:TrackName}<b>Title:</b> {TrackName}<br />{/block:TrackName}
  608. {block:Artist}<b>Artist:</b> {Artist}<br />{/block:Artist}
  609. {/block:ExternalAudio}<br><br>
  610. {block:Caption}{Caption}{/block:Caption}{/block:Audio}<br>
  611.  
  612. {block:Video}{Video-400}
  613. {block:Caption}{Caption}{/block:Caption}
  614. {/block:Video}
  615.  
  616. {block:Chat}{block:Title}<h1>{Title}</h1>{/block:Title}<font size="2">{block:Lines}{block:Label}<b>{Label}</b>{/block:Label} {Line}<br><br>{/block:Lines}</font>{/block:Chat}
  617.  
  618. {block:Answer}<div id="askurl">incoming transmission - {Asker}:</div>
  619. <div id="question">❝ {Question} ❞</div>{Answer}{/block:Answer}
  620.  
  621. {block:Date}
  622. <div id="permalink"><img src="{image:border}"><br><br>
  623. <a href="{Permalink}">{DayOfMonthWithZero}.{MonthNumberWithZero}.{ShortYear}</a> <a href="{Permalink}">{12Hour}:{Minutes}</a> {block:NoteCount}<a href="{Permalink}">{NoteCount}n</a>{/block:NoteCount}
  624. <br>
  625.  
  626. {block:RebloggedFrom} <a href="{ReblogParentURL}">via</a>{/block:RebloggedFrom}{block:ContentSource} <a href="{ReblogRootURL}">source</a>{/block:ContentSource} <a href="{ReblogURL}">reblog</a>{/block:permalinkpage}
  627.  
  628. </div>
  629. {block:HasTags}<div class="tags">{block:Tags} #<a href="{TagUrl}"> {Tag}</a>{/block:Tags}</div>{/block:HasTags}
  630. </div>
  631. {/block:Date}
  632.  
  633. {block:PostNotes}
  634. <div class="note">
  635. {PostNotes}
  636. </div>
  637. {/block:PostNotes}
  638.  
  639. {/block:Posts}
  640.  
  641. </div>
  642.  
  643. {block:ContentSource}
  644. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  645. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  646. {/block:SourceLogo}
  647. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  648. {/block:ContentSource}
  649. </div>
  650.  
  651. </div>
  652.  
  653. </body>
  654. </html>
Advertisement
Add Comment
Please, Sign In to add comment