Advertisement
owlette

jaeger new;

Apr 16th, 2014
131
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.64 KB | None | 0 0
  1. <style type="text/css">
  2.  
  3. body {
  4. background: #1b1b1b url("http://i59.tinypic.com/1zh0h8w.jpg") bottom right fixed repeat;}
  5. font-family: "slkscr";
  6. src: url('http://static.tumblr.com/qbwrk8v/zmWlpdkl0/slkscr.ttf');}
  7.  
  8.  
  9. #content {
  10. background: white;
  11. background: rgba(255,255,255,0.5);}
  12.  
  13.  
  14. .bubble {
  15. color: #ffffff; /* text color */
  16. background: black; }
  17. .bubble:after {border-color: black transparent; /* ONLY change the red here; change both reds to the same color */}
  18. #hover_me {border-color: transparent #f54f27; /* color of the little triangle on the left; see .bubble:after */}
  19.  
  20. ::-webkit-scrollbar {
  21. width: 0px;
  22. height: 0px;
  23. padding-top: 0px; }
  24.  
  25. ::-webkit-scrollbar-track {
  26. background-color: transparent; }
  27.  
  28. ::-webkit-scrollbar-thumb {
  29. height: 0px;
  30. width: 0px;
  31. background-color: transparent; }
  32.  
  33. ::-webkit-scrollbar-track-piece {
  34. height: 0px;
  35. width: 0px; }
  36.  
  37. ::-moz-selection, ::selection
  38. {background: #470000; color: #ffffff; }
  39.  
  40. ::selection
  41. {background: #470000; color: #ffffff; }
  42.  
  43.  
  44. a{
  45. color: silver;
  46. font-family: Gadget;
  47. font-size: 10px;
  48. text-shadow: 1px 1px black;
  49. text-decoration: none;
  50. -webkit-transition:all .5s ease-in-out;
  51. -moz-transition:all .5s ease-in-out;
  52. -o-transition:all .5s ease-in-out;
  53. -ms-transition:all .5s ease-in-out;
  54. transition:all .5s ease-in-out;}
  55.  
  56. a:hover{
  57. color: gray;
  58. text-shadow: 1px 1px black;
  59. -webkit-transition:all .5s ease-in-out;
  60. -moz-transition:all .5s ease-in-out;
  61. -o-transition:all .5s ease-in-out;
  62. -ms-transition:all .5s ease-in-out;
  63. transition:all .5s ease-in-out;}
  64.  
  65. a:link.nav, a:visited.nav, a:active.nav {
  66. color: black;
  67. font-family: times;
  68. text-transform: none;
  69. text-decoration: none;
  70. font-style: normal;
  71. font-weight: none;
  72. letter-spacing: 0px;
  73. font-size:30px;
  74. -webkit-transition: all .7s ease-in-out;
  75. -moz-transition: all .7s ease-in-out;
  76. -o-transition: all .7s ease-in-out;
  77. -ms-transition: all .7s ease-in-out;
  78. transition: all .7s ease-in-out;}
  79.  
  80.  
  81. a:hover.nav {
  82. color: #224531;
  83. font-family: times;
  84. text-align: center;
  85. font-size:30px;
  86. font-style: normal;
  87. letter-spacing: 0px;
  88. -webkit-transition: all .7s ease-in-out;
  89. -moz-transition: all .7s ease-in-out;
  90. -o-transition: all .7s ease-in-out;
  91. -ms-transition: all .7s ease-in-out;
  92. transition: all .7s ease-in-out;}
  93.  
  94.  
  95. b {
  96. font-weight: normal;
  97. color: #608961;
  98. font-size: 10.5px;
  99. line-height: 11px;
  100. word-spacing: 1px;
  101. letter-spacing: 1;
  102. font-style: lighter;
  103. font-variant: small-caps;
  104. text-align: justify;
  105. text-shadow: 1px 0px 4px black;}
  106.  
  107. u {
  108. font-weight: normal;
  109. text-decoration: none;
  110. color: #b5b5b5;
  111. font-size: 10.5px;
  112. letter-spacing: 0px;
  113. word-spacing: 1px;}
  114.  
  115. i {
  116. font-weight: normal;
  117. text-decoration: none;
  118. color: #b5b5b5;
  119. font-size: 10.5px;
  120. letter-spacing: 0px;
  121. word-spacing: 1px;}
  122.  
  123.  
  124. h1 {
  125. color: teal;
  126. text-shadow: 2px 2px 1px black;
  127. font-family: arial;
  128. font-size: 11px;
  129. text-transform: uppercase;
  130. font-weight: lighter;
  131. line-height: 30px;
  132. letter-spacing: 3px;
  133. word-spacing: 7px;
  134. text-align: right;
  135. border-bottom: 1px inset #fff;}
  136.  
  137. h2 {
  138. color: teal;
  139. text-shadow: 1px 1px black;
  140. font-family: georgia;
  141. font-size: 15px;
  142. text-transform:none;
  143. font-style: italic;
  144. font-weight: lighter;
  145. line-height: 10px;
  146. margin-left: 20px;
  147. letter-spacing: 1px;
  148. text-align: left;}
  149.  
  150.  
  151. /* -------------------- */
  152.  
  153. #hov {
  154. color: teal;
  155. font-size: 10px;
  156. font-family: "Calibri";
  157. letter-spacing: 1px;
  158. width: 140px;
  159. top: 0px;
  160. left: 0px;
  161. bottom: 0px;
  162. position: fixed;}
  163.  
  164. #hover_me {
  165. content: "";
  166. font-family: "Calibri";
  167. position: absolute;
  168. top: 50%;
  169. margin-top: -5px;
  170. border-style: solid;
  171. left: 0px;
  172. border-width: 10px 0 10px 10px;
  173. display: block;
  174. width: 0;
  175. opacity: 1;
  176.  
  177. -webkit-transition: all 0.4s linear;
  178. -moz-transition: all 0.4s linear;
  179. -ms-transition: all 0.4s linear;
  180. -o-transition: all 0.4s linear;
  181. transition: all 0.4s linear;}
  182.  
  183. #description {
  184. max-height: 88px;
  185. overflow: hidden;
  186. margin-top: 20px;
  187. margin-bottom: 30px;}
  188.  
  189. #favs {
  190. position: absolute;
  191. margin: auto;
  192. margin-left: 10px;
  193. top: 50%;
  194. margin-top: -273px;
  195. height: 546px;
  196. width: 100px;}
  197.  
  198. .fav {
  199. float: left;
  200. width: 100px;
  201. height: 100px;
  202. text-align: center;}
  203.  
  204. .fav img {
  205. padding: 5px;
  206. width: 60px;
  207. height: 60px;
  208. background-color: #2b2b2b;
  209. background-image:url('http://i44.tinypic.com/aujrbk.jpg');
  210. -webkit-border-radius: 0px;
  211. border: 1px solid black;
  212. border-radius: 0px;
  213.  
  214. -webkit-transition: all 0.4s linear;
  215. -moz-transition: all 0.4s linear;
  216. -ms-transition: all 0.4s linear;
  217. -o-transition: all 0.4s linear;
  218. transition: all 0.4s linear;}
  219. .fav:hover img {border: 1px solid black; -webkit-border-radius: 40px; border-radius: 40px;}
  220. .fav:hover .bubble {margin-top: 10px; opacity: 1;}
  221.  
  222. .bubble {
  223. opacity: 0;
  224. margin-left: 5px;
  225. position: relative;
  226. width: 90px;
  227. height: 8px;
  228. padding: 3px 0px 2px 0px;
  229. font-family: "slkscr";
  230. font-size: 8px;
  231.  
  232. -webkit-transition: all 0.3s ease-out;
  233. -moz-transition: all 0.3s ease-out;
  234. -ms-transition: all 0.3s ease-out;
  235. -o-transition: all 0.3s ease-out;
  236. transition: all 0.3s ease-out;}
  237.  
  238. .text {width: 90px; height: 8px; overflow: hidden;}
  239.  
  240. .bubble:after {
  241. content: "";
  242. position: absolute;
  243. top: -7px;
  244. left: 38px;
  245. border-style: solid;
  246. border-width: 0 7px 7px;
  247. display: block;
  248. width: 0;
  249. z-index: 1;}
  250.  
  251. .txt {
  252. font-family: "arial";
  253. color: tan;
  254. font-size: 10.5px;
  255. line-height: 11px;
  256. word-spacing: 1px;
  257. letter-spacing: 1;
  258. font-style: lighter;
  259. font-variant: small-caps;
  260. text-align: justify;
  261. text-shadow: 1px 0px 4px black;}
  262.  
  263. .nizzle {
  264. position: fixed;
  265. overflow: hidden;
  266. opacity: 0.6;
  267. left: 70%;
  268. bottom: 0px;
  269. background-color: transparent;
  270. }
  271.  
  272. .shizzle {
  273. position: fixed;
  274. overflow: hidden;
  275. opacity: 0;
  276. left: 70%;
  277. bottom: 0px;
  278. -webkit-transition: all 0.6s ease-out; -moz-transition: all 0.6s ease-out;
  279. }
  280.  
  281. .shizzle:hover {
  282. opacity: 0.9;
  283. -webkit-transition: all 0.6s ease-out; -moz-transition: all 0.6s ease-out;
  284. -webkit-filter: grayscale(0)
  285. }
  286.  
  287. #sidebar {
  288. position:fixed;
  289. width:140px;
  290. height:100%;
  291. top:0px;
  292. left:5px;
  293. overflow: auto;
  294. margin-left:-135px;
  295. background-color:#5f7659;
  296. opacity: 0.9;
  297. -webkit-transition: all 1.5s ease-in-out;
  298. -moz-transition: all 1.5s ease-in-out;
  299. -o-transition: all 1.5s ease-in-out;
  300. -ms-transition: all 1.5s ease-in-out;
  301. transition: all 1.5s ease-in-out;}
  302.  
  303. #sidebar:hover {
  304. -webkit-transition: all 1.5s ease-in-out;
  305. -moz-transition: all 1.5s ease-in-out;
  306. -o-transition: all 1.5s ease-in-out;
  307. -ms-transition: all 1.5s ease-in-out;
  308. transition: all 1.5s ease-in-out;
  309. padding-left:150px;}
  310.  
  311. #son{
  312. background-color:none;
  313. position: fixed;
  314. width:500px;
  315. height:200px;
  316. overflow:auto;
  317. position:fixed;
  318. left:18.9%;
  319. line-height: 40px;
  320. top:250px;
  321. opacity:1;
  322. }
  323.  
  324. #son2{
  325. background-color:none;
  326. position: fixed;
  327. width:500px;
  328. height:200px;
  329. overflow:auto;
  330. position:fixed;
  331. left:39.3%;
  332. line-height: 40px;
  333. top:250px;
  334. opacity:1;
  335. }
  336.  
  337. .block {
  338. width: 348px;
  339. height: 340px;
  340. overflow: auto;
  341. overflow-y: hidden;
  342. border-top:0px;
  343. border:0px solid white;
  344. }
  345.  
  346. .contentbox2 {
  347. background-image:url('');
  348. background-color: #608961;
  349. opacity: 0.5;
  350. left:22.4%;
  351. top:193px;
  352. width:365px;
  353. height:365px;
  354. background-color:none;
  355. position:fixed;
  356. box-shadow:3px 5px 15px #000;
  357. border:0px;
  358. border-radius:10px;
  359. border-style: solid;
  360. border-color:black;
  361. font-style:normal;
  362. letter-spacing:1px;
  363. }
  364.  
  365. .contentbox {
  366. background-image:url('http://oi42.tinypic.com/2qk05ra.jpg');
  367. left:22.7%;
  368. top:200px;
  369. width:350px;
  370. height:350px;
  371. background-color:none;
  372. position:fixed;
  373. box-shadow:1px 1px 5px #000;
  374. border:0px;
  375. border-radius:0px;
  376. border-style: solid;
  377. border-color:black;
  378. font-style:normal;
  379. letter-spacing:1px;
  380. }
  381.  
  382. .section {
  383. height: 350px;
  384. overflow: auto;
  385. text-align: left;
  386. padding-right:15px;
  387. padding-left:10px;
  388. padding-top:15px;
  389. }
  390.  
  391. #ooc {
  392. position: fixed;
  393. background-color: transparent;
  394. width: 345px;
  395. height: 150px;
  396. left: 433px;
  397. top: 395px;
  398. OPACITY: 0.7;
  399. padding: 7.1px;
  400. border-bottom-style: solid;
  401. border-bottom-width: 10px;
  402. border-color: black;
  403. overflow: hidden;
  404. transition: all 0.7s ease-in-out;
  405. -webkit-transition: all 0.7s ease-in-out;
  406. -moz-transition: all 0.7s ease-in-out;
  407. -o-transition: all 0.7s ease-in-out;
  408. -ms-transition: all 0.7s ease-in-out;
  409. -webkit-border-radius: 20px 20px;
  410. -moz-border-radius: 20px 20px;
  411. border-radius: 17px 18px;
  412. }
  413.  
  414. #ooc:hover {
  415. position: fixed;
  416. top: 550px;
  417. border-bottom-width: 0px;
  418. border-color: black;
  419. transition: all 0.7s ease-in-out;
  420. -webkit-transition: all 0.7s ease-in-out;
  421. -moz-transition: all 0.7s ease-in-out;
  422. -o-transition: all 0.7s ease-in-out;
  423. -ms-transition: all 0.7s ease-in-out;
  424. -webkit-border-radius: 10px 10px;
  425. -moz-border-radius: 10px 10px;
  426. border-radius: 10px 10px;
  427. }
  428.  
  429. #oocbox {
  430. background-image:url('http://oi42.tinypic.com/2qk05ra.jpg');
  431. width: 333px;
  432. height: 144px;
  433. border: 1px solid #608961;
  434. float: center;
  435. background-color: #232323;
  436. overflow: auto;
  437. }
  438.  
  439. #ooctext {
  440. width: 323px;
  441. height: 134px;
  442. padding: 5px;
  443. font-family: consolas;
  444. font-size: 10px;
  445. word-spacing: 1px;
  446. letter-spacing: 0px;
  447. text-align: left;
  448. line-height: 12px;
  449. color: gray;
  450. overflow: auto;}
  451. </style>
  452.  
  453.  
  454. <div id="ooc">
  455. <div id="oocbox">
  456. <div id="ooctext">
  457.  
  458. <b>some</b> text and shiz.
  459. </div></div></div>
  460.  
  461.  
  462.  
  463.  
  464.  
  465.  
  466. <div class="contentbox2"></div>
  467.  
  468.  
  469. <div id="son">
  470. <ul id="nav">
  471. <a class="nav" href="#1">◄</a> <br>
  472. <a class="nav" href="#2">◄</a>
  473. </ul></div>
  474. <div id="son2"><ul id="nav">
  475. <a class="nav" href="#3">►</a> <br>
  476. <a class="nav" href="#4">►</a>
  477. </ul></div>
  478.  
  479. <div class="contentbox">
  480. <div class="txt">
  481. <div class="block">
  482.  
  483. <a name="1"></a>
  484. <div class="section">
  485.  
  486. <center><h1>#Jaegerbombastic</h1></center>
  487. <i>s t a t i s t i c s</i><br><br>
  488.  
  489. <b>Name</b> ▰ Jaeger Aurich<br>
  490. <b>Nicknames</b> ▰ Jae, Jae-Jae, Jaefaise, Jaegermeister, Officer NumNumz, Tenderbits, Yung Jae, 2 Jaez <br>
  491. <b>Age</b> ▰ 28 years old. <br>
  492. <b>Gender</b> ▰ Male <br>
  493. <b>Species</b> ▰ <a target="_blank" a title="German Shepherd + Siberian Husky"> Canine. </a> <br>
  494. <b>Body type</b> ▰ Athletic. <br>
  495. <b>Height</b> ▰ 6'2" <br>
  496. <b>Weight</b> ▰ 210 lbs. <br>
  497. <b>Fur color</b> ▰ Coal Black. <br>
  498. <b>Eye color</b> ▰ Light Blue. <br>
  499. <b>Ethnicity</b> ▰ German-American. <br>
  500. <b>Occupation</b> ▰ <a target="_blank" a title="Special Operations Group (SOG)">U.S. Marshal.</a> <br>
  501. <b>Rank</b> ▰ Deputy <br>
  502. <b>Orientation</b> ▰ Heterosexual <br>
  503. <b>Marital Status</b> ▰ Single, not actively looking.<br>
  504. <b>Voice</b> ▰ <a href="http://www.youtube.com/watch?v=QkVdMzs_Elo" target="_blank"> [x] </a>
  505. </div>
  506.  
  507. <a name="2"></a>
  508. <div class="section">
  509.  
  510. <center><h1>#Jaegerbombastic</h1></center>
  511. <i>b i o g r a p h y</i><br><br>
  512.  
  513. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text.
  514. </div>
  515.  
  516.  
  517. <a name="3"></a>
  518. <div class="section">
  519. <center><h1>#Jaegerbombastic</h1></center>
  520. <i>e x t r a </i><br><br>
  521.  
  522. put stuff here.
  523.  
  524. </div>
  525.  
  526.  
  527. <a name="4"></a>
  528. <div class="section">
  529. <center><h1>#Jaegerbombastic</h1></center>
  530. <i>o u t o f c h a r a c t e r</i><br><br>
  531.  
  532.  
  533. » The art and code do not belong to me. The code was created for me by this <a href="profile.php?user=Iona" target="_blank">chick</a> and the art was done by this <a href="http://www.furaffinity.net/user/faint" target="_blank">guy.</a> <br>
  534. » PM Friendly <br>
  535. » I role-play with strictly Anthros, but may be convinced otherwise. <br>
  536. » I am capable of mirroring the posts of my partner, but usually perform up to semi to multi-para posts. <br>
  537. » A modern setting is preferred. <br>
  538. » I would rather much discuss a plot first before jumping right into a post. <br>
  539. » Any other questions? Just go ahead and ask me. <br>
  540. </div></div></div></div></div></div>
  541.  
  542.  
  543. <div class="nizzle">
  544. <img src="http://i.imgur.com/sLiLpLu.png">
  545. </div>
  546.  
  547. <div class="shizzle">
  548. <img src="http://i.imgur.com/sLiLpLu.png">
  549. </div>
  550.  
  551.  
  552.  
  553. <div id="sidebar"><br><h2>friends</h2><br>
  554. <div class="fav">
  555. <a href="profile.php?user=Adalharte" target="_blank" title="The Deutsch bruder.">
  556. <img src="x"><div class="bubble">
  557. <div class="text">ADALHARTE</div></div></a>
  558. </div>
  559.  
  560. <div class="fav">
  561. <a href="profile.php?user=Ariena" target="_blank" title="A girl that always finds herself there for him when he's in a bind.">
  562. <img src="http://imagizer.imageshack.us/a/img600/9449/kpxk.png"><div class="bubble">
  563. <div class="text">ARIENA</div></div></a>
  564. </div>
  565.  
  566. <div class="fav">
  567. <a href="profile.php?user=Atasha Heat Eden" target="_blank" title="A very special person. Anyone who dares come at her sideways, consider yourself royally fucked.">
  568. <img src=""><div class="bubble">
  569. <div class="text">ATASHA</div></div></a>
  570. </div>
  571.  
  572. <div class="fav">
  573. <a href="profile.php?user=Blue" target="_blank" title="A peculiar Elf who fancies the company of animals.">
  574. <img src="http://i.picpar.com/0abee8dd4311e5ceb82e256761b8e42323b41f35.jpg"><div class="bubble">
  575. <div class="text">BLUE</div></div></a>
  576. </div>
  577. <div class="fav">
  578. <a href="profile.php?user=Echo" target="_blank" title="My brother from another mother.">
  579. <img src="http://i49.tinypic.com/ojmhxh.jpg"><div class="bubble">
  580. <div class="text">ECHO</div></div></a>
  581. </div>
  582.  
  583. <div class="fav">
  584. <a href="profile.php?user=Haydn" target="_blank" title="My husbando.">
  585. <img src="http://i61.tinypic.com/rm7er8.jpg"><div class="bubble">
  586. <div class="text">HAYDN</div></div></a>
  587. </div>
  588.  
  589. <div class="fav">
  590. <a href="profile.php?user=Miss Hyde" target="_blank" title="The sinister hyena who surprisingly is over-protective of this here mutt.">
  591. <img src="x"><div class="bubble">
  592. <div class="text">MISS HYDE</div></div></a>
  593. </div>
  594.  
  595. <div class="fav">
  596. <a href="profile.php?user=Jack LeStrange" target="_blank" title="The spectral hound who is like a brother to me.">
  597. <img src="http://i48.tinypic.com/2nkqj6e.png"><div class="bubble">
  598. <div class="text">JACK</div></div></a>
  599. </div>
  600.  
  601. <div class="fav">
  602. <a href="profile.php?user=Jake Stone" target="_blank" title="The Canadian.">
  603. <img src="http://oi44.tinypic.com/r6zazm.jpg"><div class="bubble">
  604. <div class="text">JAKE</div></div></a>
  605. </div>
  606.  
  607. <div class="fav">
  608. <a href="profile.php?user=Joan" target="_blank" title="Dis bitch.">
  609. <img src="http://i60.tinypic.com/290uaac.jpg"><div class="bubble">
  610. <div class="text">JOAN</div></div></a>
  611. </div>
  612.  
  613. <div class="fav">
  614. <a href="profile.php?user=Iona" target="_blank" title="A cool gal who comes to take on the role of a little sister sometimes.">
  615. <img src="http://img809.imageshack.us/img809/8960/popuppup.png"><div class="bubble">
  616. <div class="text">IONA</div></div></a> </div>
  617.  
  618. <div class="fav">
  619. <a href="profile.php?user=Kieta" target="_blank" title="The voodoo cat.">
  620. <img src="http://i41.tinypic.com/4purnc.jpg"><div class="bubble">
  621. <div class="text">KIETA</div></div></a>
  622. </div>
  623.  
  624. <div class="fav">
  625. <a href="profile.php?user=Levo Venia" target="_blank" title="The smoking buddy.">
  626. <img src="http://i.picpar.com/NT3.png"><div class="bubble">
  627. <div class="text">LEVO</div></div></a>
  628. </div>
  629.  
  630. <div class="fav">
  631. <a href="profile.php?user=Saki Lu" target="_blank" title="She's supposedly my sister so I guess I'm her brother?">
  632. <img src="x"><div class="bubble">
  633. <div class="text">SAKI</div></div></a>
  634. </div>
  635.  
  636. <div class="fav">
  637. <a href="profile.php?user=Voller" target="_blank" title="Been through some rough times with this guy but I guess that's why he's my bro.">
  638. <img src="x"><div class="bubble">
  639. <div class="text">VOLLER</div></div></a>
  640. </div>
  641. </div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement