API tools faq
paste
stardating

FIEND DER HYDRA: COULSON

stardating
Jun 8th, 2014
375
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 9.63 KB | None | 0 0
raw download clone embed print report
  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>
  4.  
  5. <!--- PUT YOUR TITLE HERE IN THE {} BELOW
  6. IF YOU WANT IT TO BE DIFFERENT THAN THE SIDEBAR TITLE --->
  7.  
  8. <title>{Title}</title>
  9.  
  10. <link rel="shortcut icon" href="{Favicon}">
  11.  
  12. <!---
  13.  
  14. LAYOUT: COULSON (FIEND DER HYDRA)
  15. MAKER: STARDATING @ TUMBLR.COM
  16. RESOURCES: http://fiendderhydra.tumblr.com/post/88189009400/resources
  17. THEME PACK: http://stardating.tumblr.com/post/88239253712
  18.  
  19. DO NOT TAKE OUT THESE CREDITS
  20. FEEL FREE TO TWEAK & MODIFY ALL YOU WANT
  21. BUT DO NOT REDISTRIBUTE OR CLAIM AS YOUR OWN
  22.  
  23. --->
  24.  
  25.  
  26.  
  27. <!--- CSS BEGINS --->
  28.  
  29. <style type="text/css">
  30.  
  31. /*--- CUSTOM FONTS ---*/
  32.  
  33. @import url(http://fonts.googleapis.com/css?family=Oswald&subset=latin,latin-ext);
  34.  
  35. /*--- SCROLLBAR ---*/
  36.  
  37. ::-webkit-scrollbar {width:5px;
  38. height:auto;
  39. background:#F8F8F8;}
  40.  
  41. ::-webkit-scrollbar-corner {background: #F8F8F8;}
  42.  
  43. ::-webkit-scrollbar-thumb:vertical {background: #2E4859;}
  44.  
  45. ::-webkit-scrollbar-thumb:horizontal {background: #2E4859;}
  46.  
  47. /*--- BODY ---*/
  48.  
  49. body {margin-bottom: 30px;
  50. background: #F8F8F8;
  51. color: #000000;
  52. font-family: Helvetica;
  53. font-size: 11px;
  54. line-height: 150%;
  55. text-align: justify;}
  56.  
  57. a {text-decoration: none;
  58. color: #000000;
  59. -webkit-transition: all .5s ease-in-out;
  60. -moz-transition: all .5s ease-in-out;
  61. transition: all .5s ease-in-out;}
  62.  
  63. a:hover {color: #2E4859;
  64. -webkit-transition: all .5s ease-in-out;
  65. -moz-transition: all .5s ease-in-out;
  66. transition: all .5s ease-in-out;}
  67.  
  68. small {font-size: 10px;}
  69.  
  70. /*--- MAIN CONTENT ---*/
  71.  
  72. #content {background: #F8F8F8;
  73. width: 600px;
  74. height: 500px;
  75. overflow-y: scroll;
  76. padding: 10px;
  77. margin: 45px 0px 0px 300px;
  78. position: relative;}
  79.  
  80. /*--- SIDEBAR GENERAL ---*/
  81.  
  82. #sidebar {width: 180px;
  83. height: 300px;
  84. margin-left: 70px;
  85. margin-top: 33px;
  86. position: fixed;
  87. background-color: #F8F8F8;}
  88.  
  89. #desc {width: 100%;
  90. height: 200px;
  91. margin-top: 15px;
  92. font-family: Helvetica;
  93. color: #444444;
  94. font-size: 11px;
  95. text-align: justify;
  96. line-height: 150%;
  97. background-color: #f8f8f8;
  98. overflow-y: scroll;
  99. padding: 5px 10px 5px 5px;}
  100.  
  101. #sidecont {position: fixed;
  102. width: 180px;
  103. margin-left: 70px;
  104. margin-top: 70px;}
  105.  
  106. /*--- SIDEBAR TITLE, LINKS ---*/
  107.  
  108. #title {width: 180px;
  109. margin-top: 10px;
  110. margin-bottom: 25px;
  111. font-family: Oswald;
  112. font-size: 18px;
  113. color: #000000;
  114. text-align: center;
  115. letter-spacing: 5px;
  116. text-transform:uppercase;
  117. line-height: 150%;
  118. -webkit-transition: all 0.5s ease-in-out;
  119. -moz-transition: all 0.5s ease-in-out;
  120. -o-transition: all 0.5s ease-in-out;
  121. -ms-transition-duration: .5s;}
  122.  
  123. #title a {color: #000000;}
  124.  
  125. #title a:hover {color: #2e4859;
  126. text-decoration: none;}
  127.  
  128. #sidebar_links a {width: 100%;
  129. font-family: Helvetica;
  130. text-align: center;
  131. font-size: 10px;
  132. margin-top: 10px;
  133. letter-spacing: 3px;
  134. text-transform: uppercase;
  135. color: #000000;
  136. text-decoration: none;
  137. background-color: #FFFFFF;
  138. display: block;
  139. padding: 3px;
  140. -webkit-transition: all 0.5s ease-in-out;
  141. -moz-transition: all 0.5s ease-in-out;
  142. -o-transition: all 0.5s ease-in-out;
  143. -ms-transition-duration: .5s;}
  144.  
  145. #sidebar_links a:hover {color: #FFFFFF;
  146. text-decoration: none;
  147. background-color: #2e4859;
  148. display: block;
  149. -webkit-transition: all 0.5s ease-in-out;
  150. -moz-transition: all 0.5s ease-in-out;
  151. -o-transition: all 0.5s ease-in-out;
  152. -ms-transition-duration: .5s;}
  153.  
  154. /*--- SIDEBAR IMAGES & IMAGE HOVER EFFECT ---*/
  155.  
  156. #sidebarimage {width: 180px;}
  157.  
  158. #sidebar .dropmenu {margin-top:-45px;
  159. filter: alpha(opacity = 0);
  160. opacity:0;
  161. -webkit-transition: all 0.5s ease-in-out;
  162. -moz-transition: all 0.5s ease-in-out;
  163. -o-transition: all 0.5s ease-in-out;
  164. -ms-transition-duration: .5s;}
  165.  
  166. #sidebar:hover .dropmenu {margin-top: 0px;
  167. -webkit-transition: all 0.5s ease-in-out;
  168. -moz-transition: all 0.5s ease-in-out;
  169. -o-transition: all 0.5s ease-in-out;
  170. -ms-transition-duration: .5s;
  171. filter: alpha(opacity = 100);
  172. filter: alpha(opacity = 100);
  173. opacity:100;}
  174.  
  175. #swapper img {width: 180px;
  176. height: 98px;
  177. -webkit-transition: all 0.5s ease-in-out;
  178. -moz-transition: all 0.5s ease-in-out;
  179. -o-transition: all 0.5s ease-in-out;
  180. -ms-transition-duration: .5s;}
  181.  
  182. #swapper img:hover {opacity: 3;
  183. -webkit-transition: all 0.5s ease-in-out;
  184. -moz-transition: all 0.5s ease-in-out;
  185. -o-transition: all 0.5s ease-in-out;
  186. -ms-transition-duration: .5s;}
  187.  
  188. .swappee img {width: 180px;
  189. height: 98px;
  190. opacity: 0;
  191. -webkit-transition: all 0.5s ease-in-out;
  192. -moz-transition: all 0.5s ease-in-out;
  193. -o-transition: all 0.5s ease-in-out;
  194. -ms-transition-duration: .5s;}
  195.  
  196. .swappee:hover {opacity: 3;
  197. -webkit-transition: all 0.5s ease-in-out;
  198. -moz-transition: all 0.5s ease-in-out;
  199. -o-transition: all 0.5s ease-in-out;
  200. -ms-transition-duration: .5s;}
  201.  
  202. .swappee {opacity: 0;
  203. position: fixed;
  204. -webkit-transition: all 0.5s ease-in-out;
  205. -moz-transition: all 0.5s ease-in-out;
  206. -o-transition: all 0.5s ease-in-out;
  207. -ms-transition-duration: .5s;}
  208.  
  209. </style>
  210.  
  211. </head>
  212.  
  213. <!--- CSS ENDS --->
  214.  
  215.  
  216.  
  217. </head>
  218.  
  219. <!--- BODY/POSTS BEGINS --->
  220.  
  221. <body>
  222.  
  223. <div id="sidebar">
  224. <div id="sidebarimage">
  225. <div id="swapper">
  226.  
  227. <!--- REPLACE THE IMAGES WITH YOUR OWN URLS
  228. THE FIRST IMAGE IS THE IMAGE THAT IS REVEALED WHEN YOU HOVER
  229. THE SECOND IMAGE IS THE ONE THAT SHOWS UP WHEN YOU DON'T --->
  230.  
  231. <div class="swappee"><img src="http://i1049.photobucket.com/albums/s393/chesswar/BANNERS/329.png"></div>
  232. <img src="http://i1049.photobucket.com/albums/s393/chesswar/BANNERS/350.png"></div>
  233. </div>
  234.  
  235. <!--- THE TITLE HERE IS ALSO LINK :D
  236. THOUGH IT DOESN'T HAVE TO BE --->
  237.  
  238. <div id="title"><a href="/">we were once young</a></div>
  239.  
  240. <div class="dropmenu">
  241.  
  242. <!--- FEEL FREE TO ADD MORE LINKS; IT WILL OVERFLOW --->
  243.  
  244. <div id="sidebar_links">
  245. <a href="/">Link 1</a>
  246. <a href="/">Link 2</a>
  247. <a href="/">Link 3</a>
  248. <a href="/">Link 4</a>
  249. </div>
  250.  
  251. <!--- PUT YOUR DESCRIPTION HERE --->
  252.  
  253. <div id="desc">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</div>
  254.  
  255. </div>
  256.  
  257. </div>
  258. </div>
  259.  
  260. <div id="content">
  261.  
  262. <!--- PUT YOUR CONTENT HERE --->
  263.  
  264. S.H.I.E.L.D.'s scientific branch had detected unusual electromagnetic disturbances in the vicinity of Puente Antiguo, New Mexico, which drew Coulson to the site of an impact crater. While traveling there, he stopped at a gas station and overpowered two robbers. At the crater site, he found a number of town locals trying unsuccessfully to pull a hammer from the earth in which it was embedded. He called in S.H.I.E.L.D. and had the area cleared and secured for further investigation of the object.<br /><br />
  265.  
  266. With the hammer secured, Coulson turned his attention to the surrounding area and soon discovered equipment which led him back to astrophysics researcher Jane Foster and her colleagues based in Puente Antiguo. He immediately confiscated the remainder of her equipment and research, and when she returned home to discover her possessions being hauled away, Coulson simply brushed her off and offered a check as compensation.<br /><br />
  267.  
  268. Coulson was later at the S.H.I.E.L.D. compound surrounding the hammer when alarms sounded, signalling an intrusion, and he became further concerned by a corresponding build-up of anomalous weather at the same time. An unarmed intruder battered his way into the compound, right to the hammer, leaving Coulson to make a choice on whether or not to use lethal force to prevent the man from reaching it. Intrigued, he allowed the intruder to reach it, only to witness the man struggle with it before crumpling in anguish. Ordering the man captured, Coulson confronted him, pressing for information on his background and apparent military training, although the stranger only offered limited answers in reply.<br /><br />
  269.  
  270. The following day, Coulson was approached by Erik Selvig who spoke on behalf of the stranger and claimed the man's name was "Donald Blake". Coulson quickly established that there were inconsistencies with Selvig's claim, but released his detainee before ordering him followed by S.H.I.E.L.D. agents to find out more.<br /><br />
  271.  
  272. Coulson was responding to another find in the New Mexico desert when he received a curious report from his agents in Puente Antiguo. An agent reported the presence of four strangely dressed newcomers, but before Coulson could give this much consideration he was faced with a more immediate problem when a wind vortex appeared at the site he was investigating. Something large thumped down into the dust nearby and when the dust cleared Coulson found himself face-to-visor with a ten foot tall humanoid metal construct. He challenged it on the basis that it appeared to be unregistered weapons technology, at which point it opened fire and scattered the assembled agents.<br /><br />
  273.  
  274. Coulson escaped serious injury from the encounter, but could do little more than watch as the Destroyer laid waste to Puente Antiguo. He witnessed a miracle when the hammer that he had been guarding in recent days flew from its resting place to the hand of the stranger he had been detaining and saw the destruction of the rampaging machine as the man, now possessing the full power of Thor, battered it with the hammer. Coulson approached the man in the aftermath, pointing out that 'Blake' had not been completely honest. Thor told him that their goals were the same and that Coulson could count on him as an ally, if he returned the items that were taken from Foster. Coulson accepted and pointed out that Foster would need the equipment to continue her research. He then watched as Thor and his four strange friends left town.<br /><br />
  275.  
  276. <a href="http://marvel.wikia.com/Phillip_Coulson_(Earth-199999)">PHIL COULSON, EARTH 199999</a>
  277.  
  278. </div>
  279. </body>
  280. </html>
Add Comment
Please, Sign In to add comment
Public Pastes
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!