API tools faq
paste
Advertisement
iamthemelocked

Iamthemelocked - FAQ Page 1 Black

iamthemelocked
Apr 26th, 2014
374
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 11.86 KB | None | 0 0
raw download clone embed print report
  1. <head>
  2.  
  3. <!--- Page by iamthemelocked
  4. DO NOT REMOVE THE CREDIT
  5. DO NOT COPY
  6. DO NOT CLAIM AS YOUR OWN
  7. IF YOU DO THEN I´LL MAKE YOU INTO SHOES
  8. BIT NOT GOOD, ISN´T IT?--->
  9.  
  10. <link rel="shortcut icon" href="{Favicon}"/>
  11. <title>FAQ Page</title>
  12.  
  13. <style type="text/css">
  14.  
  15. /* --- SCROLLBAR ---*/
  16.  
  17. ::-webkit-scrollbar {background-color:{color:Scrollbar}; height:8px; width:8px; border:3px solid {color:background}}
  18. ::-webkit-scrollbar-thumb:vertical {background-color:{color:Scrollbar}; border:1px solid {color:background}; height:50px}
  19. ::-webkit-scrollbar-thumb:horizontal {background-color:{color:Scrollbar}; border:1px solid {color:background}; height:8px!important}
  20.  
  21. /* --- BODY ---*/
  22.  
  23. a {
  24. text-decoration:none;
  25. outline:none;
  26. -moz-outline-style:none;
  27. color:{color:link};
  28. -webkit-transition: all 0.7s ease;
  29. -moz-transition: all 0.7s ease;
  30. -o-transition: all 0.7s ease
  31. }
  32.  
  33. body {
  34. background-color:#000000;
  35. }
  36.  
  37. #headlinks {
  38. width:500px;
  39. margin-left:425px;
  40. margin-right:auto;
  41. margin-top:30px;
  42. padding-bottom:5px;
  43. }
  44.  
  45. #headlinks a {
  46. display:inline-block;
  47. width:150px;
  48. padding:1px 0px 1px 0px;
  49. color:#ffffff;
  50. font-size:10px;
  51. font-family:calibri;
  52. text-align:center;
  53. letter-spacing:5px;
  54. border:1px solid #ffffff;
  55. margin-left:5px;
  56. margin-right:5px;
  57. text-transform:uppercase;
  58. text-decoration:none;
  59. transition: all 0.8s ease-out;
  60. -webkit-transition: all 0.8s ease-out;
  61. -moz-transition: all 0.8s ease-out;
  62. -o-transition: all 0.8s ease-out;
  63. }
  64.  
  65. #headlinks a:hover {
  66. transition: all 0.8s ease-out;
  67. -webkit-transition: all 0.8s ease-out;
  68. -moz-transition: all 0.8s ease-out;
  69. -o-transition: all 0.8s ease-out;
  70. }
  71.  
  72. #boxcontent {
  73. width:245px;
  74. height:245px;
  75. margin-top:15px;
  76. margin-bottom:15px;
  77. margin-left:420px;
  78. margin-right:auto;
  79. }
  80.  
  81. #image1 {
  82. transition: all 0.8s ease-out;
  83. -webkit-transition: all 0.8s ease-out;
  84. -moz-transition: all 0.8s ease-out;
  85. -o-transition: all 0.8s ease-out;
  86. opacity:1;
  87. }
  88.  
  89. #image1 img {
  90. width:250px;
  91. height:250px;
  92. border:1px solid #dddddd;
  93. padding:4px;
  94. margin-left:-180px;
  95. margin-top:50px;
  96. transition: all 0.8s ease-out;
  97. -webkit-transition: all 0.8s ease-out;
  98. -moz-transition: all 0.8s ease-out;
  99. -o-transition: all 0.8s ease-out;
  100. }
  101.  
  102. #boxcontent:hover #image1 img{
  103. transition: all 0.8s ease-out;
  104. -webkit-transition: all 0.8s ease-out;
  105. -moz-transition: all 0.8s ease-out;
  106. -o-transition: all 0.8s ease-out;
  107. opacity:1;
  108. }
  109.  
  110.  
  111. #image2 {
  112. transition: all 0.8s ease-out;
  113. -webkit-transition: all 0.8s ease-out;
  114. -moz-transition: all 0.8s ease-out;
  115. -o-transition: all 0.8s ease-out;
  116. opacity:1;
  117. }
  118.  
  119. #image2 img {
  120. width:250px;
  121. height:250px;
  122. border:1px solid #dddddd;
  123. padding:4px;
  124. margin-left:120px;
  125. margin-top:-210px;
  126. transition: all 0.8s ease-out;
  127. -webkit-transition: all 0.8s ease-out;
  128. -moz-transition: all 0.8s ease-out;
  129. -o-transition: all 0.8s ease-out;
  130. }
  131.  
  132. #boxcontent:hover #image2 img{
  133. transition: all 0.8s ease-out;
  134. -webkit-transition: all 0.8s ease-out;
  135. -moz-transition: all 0.8s ease-out;
  136. -o-transition: all 0.8s ease-out;
  137. opacity:1;
  138. }
  139.  
  140.  
  141. #image3 {
  142. transition: all 0.8s ease-out;
  143. -webkit-transition: all 0.8s ease-out;
  144. -moz-transition: all 0.8s ease-out;
  145. -o-transition: all 0.8s ease-out;
  146. opacity:1;
  147. }
  148.  
  149. #image3 img {
  150. width:250px;
  151. height:250px;
  152. border:1px solid #dddddd;
  153. padding:4px;
  154. margin-left:420px;
  155. margin-top:-470px;
  156. transition: all 0.8s ease-out;
  157. -webkit-transition: all 0.8s ease-out;
  158. -moz-transition: all 0.8s ease-out;
  159. -o-transition: all 0.8s ease-out;
  160. }
  161.  
  162. #boxcontent:hover #image3 img{
  163. transition: all 0.8s ease-out;
  164. -webkit-transition: all 0.8s ease-out;
  165. -moz-transition: all 0.8s ease-out;
  166. -o-transition: all 0.8s ease-out;
  167. opacity:1;
  168. }
  169.  
  170.  
  171. #title {
  172. margin-left:0px;
  173. margin-top:-5px;
  174. width:220px;
  175. height:10px;
  176. border-bottom:1px solid #dddddd;
  177. text-align:center;
  178. font-family:calibri;
  179. text-transform:uppercase;
  180. letter-spacing:5px;
  181. line-height:11px;
  182. font-size:11px;
  183. color:#b6b6b6;
  184. padding:5px 0px 5px 0px;
  185. transition: all 0.8s ease-out;
  186. -webkit-transition: all 0.8s ease-out;
  187. -moz-transition: all 0.8s ease-out;
  188. -o-transition: all 0.8s ease-out;
  189. }
  190.  
  191. #tagbox {
  192. margin-left:-175px;
  193. width:235px;
  194. margin-top:-255px;
  195. height:235px;
  196. overflow:scroll;
  197. opacity:0;
  198. background-color:#000000;
  199. position:fixed;
  200. padding:8px;
  201. transition: all 0.8s ease-out;
  202. -webkit-transition: all 0.8s ease-out;
  203. -moz-transition: all 0.8s ease-out;
  204. -o-transition: all 0.8s ease-out;
  205. }
  206.  
  207. #tagbox2 {
  208. margin-left:125px;
  209. width:234px;
  210. margin-top:-255px;
  211. height:235px;
  212. opacity:0;
  213. background-color:#ffffff;
  214. position:fixed;
  215. padding:8px;
  216. transition: all 0.8s ease-out;
  217. -webkit-transition: all 0.8s ease-out;
  218. -moz-transition: all 0.8s ease-out;
  219. -o-transition: all 0.8s ease-out;
  220. }
  221.  
  222. #tagbox3 {
  223. margin-left:425px;
  224. width:234px;
  225. margin-top:-465px;
  226. height:235px;
  227. opacity:0;
  228. background-color:#ffffff;
  229. position:fixed;
  230. padding:8px;
  231. transition: all 0.8s ease-out;
  232. -webkit-transition: all 0.8s ease-out;
  233. -moz-transition: all 0.8s ease-out;
  234. -o-transition: all 0.8s ease-out;
  235. }
  236.  
  237.  
  238. #boxcontent:hover #tagbox{
  239. transition: all 0.8s ease-out;
  240. -webkit-transition: all 0.8s ease-out;
  241. -moz-transition: all 0.8s ease-out;
  242. -o-transition: all 0.8s ease-out;
  243. opacity:1;
  244. }
  245.  
  246. #boxcontent:hover #tagbox2{
  247. transition: all 0.8s ease-out;
  248. -webkit-transition: all 0.8s ease-out;
  249. -moz-transition: all 0.8s ease-out;
  250. -o-transition: all 0.8s ease-out;
  251. opacity:1;
  252. }
  253.  
  254. #boxcontent:hover #tagbox3{
  255. transition: all 0.8s ease-out;
  256. -webkit-transition: all 0.8s ease-out;
  257. -moz-transition: all 0.8s ease-out;
  258. -o-transition: all 0.8s ease-out;
  259. opacity:1;
  260. }
  261.  
  262. #text {
  263. width:210px;
  264. height:235px;
  265. font-size:10px;
  266. font-family:calibri;
  267. color:#b6b6b6;
  268. margin-top:100px;
  269. margin-top:10px;
  270. margin-bottom:20px;
  271. text-align:center;
  272. }
  273.  
  274. #text a {
  275. display:block;
  276. width:150px;
  277. font-family:calibri;
  278. text-transform:uppercase;
  279. font-size:10px;
  280. padding:3px;
  281. text-decoration:none;
  282. text-align:center;
  283. color:#cccccc;
  284. letter-spacing:2px;
  285. transition: all 0.5s ease-out;
  286. -webkit-transition: all 0.5s ease-out;
  287. -moz-transition: all 0.5s ease-out;
  288. -o-transition: all 0.5s ease-out;
  289. }
  290.  
  291.  
  292. .important, .important a {
  293. width:15px;
  294. height:15px;
  295. bottom:15px;
  296. right:15px;
  297. padding:4px;
  298. font-size:8px;
  299. letter-spacing:2px;
  300. color:#610c17;
  301. line-height:15px;
  302. position:fixed;
  303. text-align:center;
  304. font-family:"trajan pro";
  305. text-transform:uppercase;
  306. background-color:transparent;
  307. border:1px solid #ffffff;}
  308.  
  309. .important a:hover {
  310. color:#000000;
  311. background-color:#ffffff;}
  312.  
  313.  
  314. ::selection {
  315. background-color:#ffffff;
  316. color:#000000;
  317. }
  318.  
  319. ::-moz-selection {
  320. background-color:#ffffff;
  321. color:#000000;
  322. }
  323.  
  324. </style>
  325.  
  326. <body>
  327.  
  328. <!------------------------------------
  329. HEADER
  330. ------------------------------------->
  331.  
  332. <div id="headlinks"><!--change the top links here-->
  333. <a href="/">HOME</a>
  334. <a href="/">LINK</a>
  335. <a href="/">LINK</a>
  336. </div>
  337.  
  338. <!------------------------------------
  339. TAG BOXES
  340. ------------------------------------->
  341.  
  342. <!------------ BOX 1 ------------>
  343.  
  344. <div id="boxcontent">
  345. <div id="image1"><img width="120px" src="http://www.dpaperwall.com/wp-content/uploads/2013/11/2014-Landscape-Wallpaper-250x250.jpg"/><!--change the image url here (big image)--> </div>
  346. <div id="tagbox">
  347. <div id="title">FAQ BOX</div><!--change the title here-->
  348. <div id="text"><!--change the text here-->
  349. <!--change the colour by putting any colour you like in for #610c17--> <b><big><font color="#610c17">SOME TITLE</font></big></b></br><!--change the little subtitle here-->
  350. Here you can write any information you like.
  351. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
  352.  
  353. <!--change the colour by putting any colour you like in for #610c17--> <b><big><font color="#610c17">SOME TITLE</font></big></b></br><!--change the little subtitle here-->
  354. Here you can write any information you like.
  355. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
  356.  
  357. <!--change the colour by putting any colour you like in for #610c17--> <b><big><font color="#610c17">SOME TITLE</font></big></b></br><!--change the little subtitle here-->
  358. Here you can write any information you like.
  359. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
  360.  
  361. <!--change the colour by putting any colour you like in for #610c17--> <b><big><font color="#610c17">SOME TITLE</font></big></b></br><!--change the little subtitle here-->
  362. Here you can write any information you like.
  363. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
  364.  
  365. <!--change the colour by putting any colour you like in for #610c17--> <b><big><font color="#610c17">SOME TITLE</font></big></b></br><!--change the little subtitle here-->
  366. Here you can write any information you like.
  367. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
  368. </div>
  369. </div>
  370. </div>
  371.  
  372. <!------------ BOX 2 ------------>
  373.  
  374. <div id="boxcontent">
  375. <div id="image2"><img width="120px" src="http://www.bongobytes.com/photography-classifieds/images/2013/04/10/29/thumb_kevin-young-fine-art-landscape-photography_10.jpg"/><!--change the image url here (big image)--> </div>
  376. <div id="tagbox2">
  377. <div id="title">ASK ME STUFF</div><!--change the title here-->
  378. <div id="text"><!--change the text here-->
  379. <!-- Replace the YOUR-URL-HERE bit with your own url, otherwise it WILL NOT WORK!!! -->
  380. <p><iframe frameborder="0" height="220" id="ask_form" scrolling="yes" src="http://www.tumblr.com/ask_form/PUT YOUR URL HERE.tumblr.com" width="235"></iframe> <!--[if IE]><script type="text/javascript">document.getElementById('ask_form').
  381. allowTransparency=true;</script>
  382. <![endif]--></p> </div>
  383. </div>
  384. </div>
  385. </div>
  386.  
  387. <!------------ BOX 3 ------------>
  388.  
  389. <div id="boxcontent">
  390. <div id="image3"><img width="120px" src="http://www.wallpaperklix.com/wp-content/uploads/2014/01/windows-7-wallpaper-250x250.jpg"/></div>
  391. <div id="tagbox3">
  392. <div id="title">SUBMIT ME STUFF</div><!--change the title here-->
  393. <div id="text"><!--change the text here-->
  394. <p><iframe id="submit_form" src="http://www.tumblr.com/submit_form/PUT YOUR URL HERE.tumblr.com" frameborder="0" height="220" scrolling="yes" width="235"></iframe><!--[if IE]><script type="text/javascript">document.getElementById('submit_form').allowTransparency=true;</script><![endif]--></p>
  395. </div>
  396. </div>
  397. </div>
  398. </div>
  399.  
  400. <span class="important">
  401. <a href="http://iamthemelocked.tumblr.com/" target="_blank" title="page by iamthemelocked">TL</a>
  402. </span>
  403. </body>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!