Advertisement
Guest User

Ember

a guest
Apr 18th, 2015
253
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 31.58 KB | None | 0 0
  1. <style type="text/css">
  2. @import url(http://fonts.googleapis.com/css?family=Roboto+Condensed:300italic,400italic,700italic,400,300,700|Oswald:300,400,700|Dynalight|Tangerine:400,700);
  3.  
  4. /* - -DO NOT PUT ANYTHING ABOVE THE @import LINE ABOVE - - */
  5. /* - -DO NOT REARRANGE MY CODING!! ORDER IS IMPORTANT! - - */
  6.  
  7. .vicarious { Structure }
  8. body {
  9. width:100%;
  10. height:100%;
  11. background-color:ffffff;
  12. background-image:url(http://i59.tinypic.com/34goxlz.jpg);
  13. background-repeat:repeat;
  14. background-attachment:fixed;
  15. background-position:center center;
  16. }
  17.  
  18. table, tr, td { background-color:transparent; border:0px; padding:0px; margin:0px; }
  19.  
  20. .vic-LEFT-SIDE_table, .vic-RIGHT-SIDE_table {
  21. visibility:visible;
  22. z-index:2;
  23. position:absolute;
  24. top:0%;
  25. left:50%;
  26. border:0px;
  27. margin-top:205px;
  28. height:auto;
  29. display:inline-block;
  30. padding:0px;
  31. }
  32.  
  33. .vic-LEFT-SIDE_table { width:502px; height:auto; margin-left:-500px;}
  34. .vic-LEFT-SIDE_table tr { margin:0px; }
  35. .vic-LEFT-SIDE_table td { margin:0px; max-width:500px;}
  36.  
  37. .vic-RIGHT-SIDE_table { width:502px; height:auto; margin-left:10px; }
  38. .vic-RIGHT-SIDE_table tr {margin:0px; }
  39. .vic-RIGHT-SIDE_table td { margin:0px; max-width:500px; }
  40.  
  41.  
  42. #back {
  43. visibility:visible;
  44. position:fixed;
  45. top:0%;
  46. z-index:-1;
  47. padding:0px;
  48. left:50%;
  49. margin-top:0px;
  50. margin-left:-515px;
  51. width:1040px;
  52. height:100%;
  53. background-color: e7ddd7;
  54. }
  55.  
  56. .vic_table {
  57. width:100%;
  58. margin-bottom:4px;
  59. border:1px solid #d9cfca;
  60. background-color:f3ece8;
  61. overflow:hidden;
  62. display:block;
  63. }
  64.  
  65. .vic_table tr { }
  66. .vic_table td { width:100%; }
  67.  
  68. .vic-LEFT-SIDE_table .vic_table td {width:500px;}
  69. .vic-RIGHT-SIDE_table .vic_table td {width:500px;}
  70.  
  71.  
  72.  
  73. .vicarious{ Google Chrome Scrollbar }
  74. ::-webkit-scrollbar {width: 10px;}
  75. ::-webkit-scrollbar-track {border: 1px solid #000000 ;background-color:transparent;}
  76. ::-webkit-scrollbar-thumb {border:1px solid #000000;background-color:ff1919; }
  77.  
  78. .vicarious { General Text }
  79.  
  80. table, tr, td, li, p, div, .text, .btext, a, b, i {
  81. font-family:tahoma;
  82. font-size:6.5pt;
  83. line-height:100%;
  84. padding:0px;
  85. margin:0px;
  86. text-decoration:none;
  87. text-transform:none;
  88. text-align:left;
  89. word-wrap: break-word;
  90. color:bdaca2;
  91. }
  92.  
  93. p {
  94. text-align:justify;
  95. margin-top: 5px;
  96. text-indent:10px;
  97. word-wrap: break-word;
  98. }
  99.  
  100. b {
  101. font-family: 'Roboto Condensed', sans-serif;
  102. font-weight:700;
  103. font-size:7pt;
  104. text-transform:uppercase;
  105. color:ff1919;
  106. }
  107.  
  108. i {
  109. font-family: 'Dynalight', cursive;
  110. font-size:10pt;
  111. color:c8bbb4;
  112. }
  113.  
  114. .u, u {
  115. text-decoration:underline;
  116. }
  117.  
  118. .strike, strike {
  119. text-decoration:line-through;
  120. letter-spacing:1pt;
  121. color:ff1919;
  122. }
  123.  
  124. .strong, strong {
  125. letter-spacing:3px;
  126. font-family: "Oswald", Helvetica, sans-serif;
  127. font-size: 11px;
  128. text-transform:uppercase;
  129. line-height:110%;
  130. color:ffffff;
  131. text-shadow: -1px -1px 0 #cec5bf, 1px -1px 0 #ff1919, -1px 1px 0 #cec5bf, 1px 1px 0 #000000;
  132. }
  133.  
  134. em {
  135. font-family: 'Tangerine', cursive;
  136. font-weight:700;
  137. font-size:19pt;
  138. color:ff1919;
  139. }
  140.  
  141. small {
  142. font-size:18px;
  143. color:f3ece8;
  144. text-shadow: -1px -1px 0 #ff1919, 1px -1px 0 #ff1919, -1px 1px 0 #ff1919, 1px 1px 0 #ff1919;
  145. text-transform:uppercase;
  146. }
  147.  
  148. big {
  149. color:ff1919;
  150. font-size:24px;
  151. text-transform:uppercase;
  152. font-family: 'Oswald', sans-serif;
  153. }
  154.  
  155. .vicarious { Headers }
  156.  
  157. .h1, h1, .h2, h2, .h3, h3, .h4, h4, .h5, h5, .h6, h6, .h7, h7, .h8, h8, .h9, h9, .h10, h10, .h11, h11, .h12, h12, .h13, h13, .h14, h14, .h15, h15, .one, one, .two, two, .three, three, .blockquote, blockquote {
  158. margin:0px;
  159. padding:0px;
  160. display:block;
  161. text-transform:none;
  162. line-height:100%;
  163. }
  164.  
  165.  
  166. .cite {font-size:0px; color:transparent;display:block; height:0px;}
  167.  
  168.  
  169. .vicarious { Divs }
  170.  
  171. /* Top Div */
  172.  
  173. #topper {
  174. top:0%;
  175. left:50%;
  176. z-index:1000;
  177. position:fixed;
  178. margin-top:0px;
  179. margin-left:-500px;
  180. height:200px;
  181. width:1010px;
  182. overflow:hidden;
  183. background-color:f3ece8;
  184. border:1px solid #d9cfca;
  185. }
  186.  
  187. #topper .namefield {
  188. position:absolute;
  189. height:150px;
  190. line-height:150px;
  191. font-size:50px;
  192. width:825px;
  193. margin-top:25px;
  194. margin-left:25px;
  195. background-color:ffffff;
  196. font-family: 'Dynalight', cursive;
  197. color:ff1919;
  198. }
  199.  
  200. #topper .circleX {
  201. position:absolute;
  202. height:184px;
  203. width:184px;
  204. margin-top:5px;
  205. margin-left:800px;
  206. -webkit-border-radius: 360px;
  207. -moz-border-radius: 360px;
  208. border-radius: 360px;
  209. border:3px solid #e7ddd7;
  210. background-color:ffffff;
  211. }
  212.  
  213. #topper .imageX {
  214. position:absolute;
  215. height:174px;
  216. width:174px;
  217. margin-top:10px;
  218. margin-left:805px;
  219. -webkit-border-radius: 360px;
  220. -moz-border-radius: 360px;
  221. border-radius: 360px;
  222. border:3px solid #e7ddd7;
  223. background-size: 174px 174px;
  224. background-repeat:no-repeat;
  225. }
  226.  
  227.  
  228. #topper .info {
  229. position:absolute;
  230. height:174px;
  231. width:174px;
  232. margin-top:10px;
  233. margin-left:805px;
  234. -webkit-border-radius: 360px;
  235. -moz-border-radius: 360px;
  236. border-radius: 360px;
  237. border:3px solid #e7ddd7;
  238. background-color:ffffff;
  239. opacity:0;
  240. -webkit-transition: all .5s ease 0.1s;
  241. -moz-transition:all .5s ease 0.1s;
  242. -ms-transition:all .5s ease 0.1s;
  243. -o-transition: all .5s ease 0.1s;
  244. transition: all .5s ease 0.1s;
  245. }
  246.  
  247. #topper:hover .info {
  248. opacity:1;
  249. }
  250.  
  251. #topper .info .textbox {
  252. width:110px;
  253. height:110px;
  254. margin:30px;
  255. padding:2px;
  256. overflow:auto;
  257. text-align:center;
  258. }
  259.  
  260. #topper .info .textbox .strong, #topper .info .textbox strong {
  261. display:block;
  262. text-align:center;
  263. margin:5px 0px;
  264. padding:0px 0px 2px 0px;
  265. border-bottom:1px solid #ff1919;
  266. font-size: 10px;
  267. }
  268.  
  269. #topper a {
  270. text-align:center;
  271. display:block;
  272. font-size:0px;
  273. color: transparent;
  274. position:absolute;
  275. margin-left:775px;
  276. width:10px;
  277. height:10px;
  278. line-height:10px;
  279. background-color:e8e1d8;
  280. text-decoration:none;
  281. text-transform:uppercase;
  282. padding:0px;
  283. letter-spacing:1px;
  284. -webkit-transition: all .5s ease 0.1s;
  285. -moz-transition:all .5s ease 0.1s;
  286. -ms-transition:all .5s ease 0.1s;
  287. -o-transition: all .5s ease 0.1s;
  288. transition: all .5s ease 0.1s;
  289. overflow:hidden;
  290. }
  291.  
  292. #topper a.lk1 {margin-top:35px; }
  293. #topper:hover a.lk1 {margin-left:50px; }
  294.  
  295. #topper a.lk2 {margin-top:59px; }
  296. #topper:hover a.lk2 {margin-left:175px;}
  297.  
  298. #topper a.lk3 {margin-top:83px; }
  299. #topper:hover a.lk3 {margin-left:300px;}
  300.  
  301. #topper a.lk4 {margin-top:107px; }
  302. #topper:hover a.lk4 { margin-left:425px;}
  303.  
  304. #topper a.lk5 {margin-top:131px;}
  305. #topper:hover a.lk5 { margin-left:550px;}
  306.  
  307. #topper a.lk6 {margin-top:155px;}
  308. #topper:hover a.lk6 { margin-left:675px;}
  309.  
  310.  
  311. #topper:hover a {
  312. color: ff1919;
  313. font-size:8px;
  314. margin-top:180px;
  315. width:100px;
  316. background-color:transparent;
  317. }
  318.  
  319. #topper a:hover {
  320. color: d9cfca;
  321. }
  322.  
  323.  
  324. /* Left Side Tables */
  325.  
  326.  
  327. .BriefBioTable{
  328. position:relative;
  329. width:500px;
  330. height:500px;
  331. overflow:hidden;
  332. background-position:left bottom;
  333. background-repeat:no-repeat;
  334. background-size:500px 65px;
  335. }
  336.  
  337. .BriefBioTable .briefBio {
  338. position:absolute;
  339. margin-top:10px;
  340. margin-left:10px;
  341. width:210px;
  342. height:405px;
  343. padding:5px;
  344. overflow:auto;
  345. background-color:e7ddd7;
  346. }
  347.  
  348. .BriefBioTable .pic {
  349. position:absolute;
  350. margin-top:10px;
  351. margin-left:238px;
  352. width:250px;
  353. height:250px;
  354. overflow:hidden;
  355. border:1px solid #ff1919;
  356. }
  357.  
  358. .BriefBioTable .pic img {
  359. width:250px;
  360. height:250px;
  361. overflow:hidden;
  362. }
  363.  
  364. .BriefBioTable .quoteBox {
  365. position:absolute;
  366. margin-top:260px;
  367. margin-left:238px;
  368. width:252px;
  369. height:165px;
  370. overflow:hidden;
  371. background-color:ff1919;
  372. }
  373.  
  374. .BriefBioTable .quotebox .quote1 {
  375. margin-top:15px;
  376. height:30px;
  377. overflow:hidden;
  378. padding:0px 5px;
  379. background-color:f7eee7;
  380. color:ff1919;
  381. display:block;
  382. text-transform:uppercase;
  383. font-family: 'Oswald', sans-serif;
  384. font-weight:700;
  385. font-size:25px;
  386. line-height:30px;
  387. text-align:center;
  388. }
  389.  
  390. .BriefBioTable .quotebox .quote2 {
  391. margin-top:10px;
  392. height:75px;
  393. overflow:hidden;
  394. padding:0px 5px;
  395. color:ffffff;
  396. display:block;
  397. text-transform:uppercase;
  398. font-family: 'Oswald', sans-serif;
  399. font-weight:700;
  400. font-size:25px;
  401. text-align:center;
  402. background-color:transparent;
  403. }
  404.  
  405. .BriefBioTable .music {
  406. position:absolute;
  407. margin-top:395px;
  408. margin-left:264px;
  409. width:200px;
  410. height:25px;
  411. overflow:hidden;
  412. background-color:transparent;
  413. }
  414.  
  415. .StatsTable {
  416. position:relative;
  417. width:500px;
  418. height:500px;
  419. overflow:hidden;
  420. }
  421.  
  422. .StatsTable .tabsBox {
  423. position:absolute;
  424. margin-left:5px;
  425. margin-top:5px;
  426. width:490px;
  427. height:490px;
  428. overflow:hidden;
  429. }
  430.  
  431. .StatsTable .tabsBox .tabA, .StatsTable .tabsBox .tabB {
  432. width:100%;
  433. height:94px;
  434. overflow:hidden;
  435. background-color:ff1919;
  436. }
  437.  
  438. .StatsTable .tabsBox .tabA {
  439. margin-bottom:5px;
  440. }
  441.  
  442. .StatsTable .tabsBox .title1 {
  443. position:absolute;
  444. margin-left:-210px;
  445. margin-top:5px;
  446. height:80px;
  447. width:200px;
  448. border:2px solid #f7eee7;
  449. color:ffffff;
  450. height:80px;
  451. line-height:80px;
  452. overflow:hidden;
  453. display:block;
  454. text-align:center;
  455. font-size:17px;
  456. text-transform:uppercase;
  457. font-family: 'Oswald', sans-serif;
  458. -webkit-transition: all 0.4s linear;
  459. -moz-transition: all 0.4s linear;
  460. -o-transition: all 0.4s linear;
  461. -ms-transition: all 0.4s linear;
  462. transition: all 0.4s linear;
  463. }
  464.  
  465. .StatsTable:hover .title1 {
  466. margin-left:5px;
  467. }
  468.  
  469. .StatsTable .textbox {
  470. margin-left:215px;
  471. margin-top:5px;
  472. padding:5px;
  473. width:260px;
  474. height:74px;
  475. background-color:f7eee7;
  476. overflow:auto;
  477. text-align:justify;
  478. }
  479.  
  480. .StatsTable .photo {
  481. position:absolute;
  482. margin-left:125px;
  483. margin-top:0px;
  484. background-size:375px 500px;
  485. background-repeat:no-repeat;
  486. width:375px;
  487. height:500px;
  488. overflow:hidden;
  489. -webkit-transition: all 0.4s linear;
  490. -moz-transition: all 0.4s linear;
  491. -o-transition: all 0.4s linear;
  492. -ms-transition: all 0.4s linear;
  493. transition: all 0.4s linear;
  494. }
  495.  
  496. .StatsTable:hover .photo {
  497. margin-left:500px;
  498. }
  499.  
  500. .LyricsTable {
  501. background-position:left bottom;
  502. background-repeat:no-repeat;
  503. background-size:500px 300px;
  504. position:relative;
  505. width:500px;
  506. height:500px;
  507. overflow:hidden;
  508. }
  509.  
  510. .LyricsTable .LyricsA {
  511. position:absolute;
  512. margin-top:0px;
  513. margin-left:0px;
  514. width:460px;
  515. height:160px;
  516. padding:15px;
  517. overflow:hidden;
  518. color:b61717;
  519. font-size:20px;
  520. background-color:e7ddd7;
  521. border:5px solid #ff1919;
  522. text-align:justify;
  523. line-height:102%;
  524. -webkit-box-shadow: inset 0px 0px 0px 10px rgba(255, 255, 255, 0.4);
  525. -moz-box-shadow: inset 0px 0px 0px 10px rgba(255, 255, 255, 0.4);
  526. box-shadow: inset 0px 0px 0px 10px rgba(255, 255, 255, 0.4);
  527. }
  528.  
  529. .LyricsTable .LyricsB {
  530. position:absolute;
  531. margin-top:275px;
  532. margin-left:325px;
  533. width:130px;
  534. height:130px;
  535. padding:10px;
  536. color:b61717;
  537. font-size:16px;
  538. text-align:justify;
  539. line-height:95%;
  540. overflow:hidden;
  541. background-color:e7ddd7;
  542. -webkit-border-radius: 20px;
  543. -moz-border-radius: 20px;
  544. border-radius: 20px;
  545. }
  546.  
  547. /* Right Side Tables */
  548.  
  549. .MainBioTable {
  550. position:relative;
  551. width:500px;
  552. height:500px;
  553. overflow:hidden;
  554. }
  555.  
  556. .MainBioTable .line1, .MainBioTable .line2, .MainBioTable .line3, .MainBioTable .line4 {
  557. position:absolute;
  558. overflow:hidden;
  559. background-color:ffffff;
  560. border:1px solid #e7ddd7;
  561. }
  562.  
  563. .MainBioTable .line1 {
  564. margin-top:10px;
  565. margin-left:10px;
  566. width:10px;
  567. height:478px;
  568. }
  569.  
  570. .MainBioTable .line2 {
  571. margin-top:50px;
  572. margin-left:27px;
  573. width:10px;
  574. height:438px;
  575. }
  576.  
  577. .MainBioTable .line3 {
  578. margin-top:478px;
  579. margin-left:10px;
  580. width:478px;
  581. height:10px;
  582. }
  583.  
  584. .MainBioTable .line4 {
  585. margin-top:460px;
  586. margin-left:10px;
  587. width:438px;
  588. height:10px;
  589. }
  590.  
  591. .MainBioTable .title1 {
  592. position:absolute;
  593. margin-top:10px;
  594. margin-left:50px;
  595. width:435px;
  596. height:30px;
  597. overflow:hidden;
  598. padding-left:5px;
  599. background-color:ff1919;
  600. color:ffffff;
  601. display:block;
  602. text-transform:uppercase;
  603. font-family: 'Oswald', sans-serif;
  604. font-weight:700;
  605. font-size:20px;
  606. line-height:30px;
  607. text-align:left;
  608. }
  609.  
  610.  
  611. .MainBioTable .about1 {
  612. position:absolute;
  613. margin-top:50px;
  614. margin-left:50px;
  615. width:410px;
  616. height:370px;
  617. padding:10px;
  618. overflow:auto;
  619. background-color:f3ece8;
  620. border:5px solid #e7ddd7;
  621. text-align:justify;
  622. }
  623.  
  624.  
  625. .MainBioTable .square {
  626. position:absolute;
  627. margin-top:461px;
  628. margin-left:10px;
  629. width:19px;
  630. height:19px;
  631. overflow:hidden;
  632. background-color:ff1919;
  633. border:5px solid #e7ddd7;
  634. }
  635.  
  636.  
  637. .connTable {
  638. position:relative;
  639. width:500px;
  640. height:500px;
  641. background-color:ff1919;
  642. overflow:hidden;
  643. background-repeat:no-repeat;
  644. background-size:400px 400px;
  645. background-position:center;
  646. }
  647.  
  648. .connTable .middlePic {
  649. background-repeat:no-repeat;
  650. background-size:200px 250px;
  651. position:absolute;
  652. width:200px;
  653. height:250px;
  654. margin-left:149px;
  655. margin-top:124px;
  656. border:1px solid #000000;
  657. z-index:1;
  658. }
  659.  
  660. .conns {
  661. position:absolute;
  662. width:400px;
  663. height:400px;
  664. margin-top:50px;
  665. margin-left:50px;
  666. background-color:ff1919;
  667. overflow:hidden;
  668. opacity:0;
  669. -webkit-transition: all .2s ease-in-out 0s;
  670. -moz-transition:all .2s ease-in-out 0s;
  671. -ms-transition:all .2s ease-in-out 0s;
  672. -o-transition: all .2s ease-in-out 0s;
  673. transition: all .2s ease-in-out 0s;
  674. z-index:2;
  675. }
  676.  
  677. .connTable:hover .conns {
  678. opacity:1;
  679. -webkit-transition: all .2s ease-in-out 0s;
  680. -moz-transition:all .2s ease-in-out 0s;
  681. -ms-transition:all .2s ease-in-out 0s;
  682. -o-transition: all .2s ease-in-out 0s;
  683. transition: all .2s ease-in-out 0s;
  684. }
  685.  
  686. .conn1, .conn2, .conn3, .conn4, .conn5, .conn6, .conn7, .conn8 {
  687. position:absolute;
  688. width:90px;
  689. height:190px;
  690. background-color:f7eee7;
  691. background-repeat:no-repeat;
  692. background-position:left top;
  693. background-size:90px 190px;
  694. z-index:3;
  695. -webkit-transition: all .4s linear 0s;
  696. -moz-transition:all .4s linear 0s;
  697. -ms-transition:all .4s linear 0s;
  698. -o-transition: all .4s linear 0s;
  699. transition: all .4s linear 0s;
  700. }
  701.  
  702. .conn1, .conn2, .conn3, .conn4 {
  703. margin-top:5px;
  704. }
  705.  
  706.  
  707. .conn5, .conn6, .conn7, .conn8 {
  708. margin-top:205px;
  709. }
  710.  
  711. .conn1, .conn5 {margin-left:5px;}
  712. .conn2, .conn6 {margin-left:105px;}
  713. .conn3, .conn7 {margin-left:205px;}
  714. .conn4, .conn8 {margin-left:305px;}
  715.  
  716.  
  717. .conn1:hover, .conn2:hover, .conn3:hover, .conn4:hover, .conn5:hover, .conn6:hover, .conn7:hover, .conn8:hover {
  718. width:390px;
  719. z-index:4;
  720. -webkit-transition: all .4s linear .6s;
  721. -moz-transition:all .4s linear .6s;
  722. -ms-transition:all .4s linear .6s;
  723. -o-transition: all .4s linear .6s;
  724. transition: all .4s linear .6s;
  725. }
  726.  
  727. .conn2:hover, .conn3:hover, .conn4:hover, .conn6:hover, .conn7:hover, .conn8:hover {
  728. margin-left:5px;
  729. }
  730.  
  731.  
  732. .connText {
  733. position:absolute;
  734. margin-top:0px;
  735. margin-left:100px;
  736. opacity:0;
  737. width:270px;
  738. height:170px;
  739. padding:5px;
  740. overflow:auto;
  741. background-color:e7ddd7;
  742. border:5px solid #f7eee7;
  743. -webkit-transition: all .4s ease-in-out 0s;
  744. -moz-transition:all .4s ease-in-out 0s;
  745. -ms-transition:all .4s ease-in-out 0s;
  746. -o-transition: all .4s ease-in-out 0s;
  747. transition: all .4s ease-in-out 0s;
  748. }
  749.  
  750. .conn1:hover .connText, .conn2:hover .connText, .conn3:hover .connText, .conn4:hover .connText, .conn5:hover .connText, .conn6:hover .connText, .conn7:hover .connText, .conn8:hover .connText {
  751. opacity:1;
  752. -webkit-transition: all .4s ease-in-out .6s;
  753. -moz-transition:all .4s ease-in-out .6s;
  754. -ms-transition:all .4s ease-in-out .6s;
  755. -o-transition: all .4s ease-in-out .6s;
  756. transition: all .4s ease-in-out .6s;
  757. }
  758.  
  759. .connText big {
  760. font-size:18px;
  761. line-height:100%;
  762. display:block;
  763. margin:5px 5px 0px 5px;
  764. text-align:left;
  765. border-bottom:5px solid #ff1919;
  766. }
  767.  
  768. .connText a {
  769. text-align:right;
  770. font-family: "Oswald", Helvetica, sans-serif;
  771. display:block;
  772. font-size:7px;
  773. color: ffffff;
  774. height:14px;
  775. line-height:14px;
  776. background-color:ff1919;
  777. text-decoration:none;
  778. text-transform:uppercase;
  779. padding-right:10px;
  780. margin:0px 5px;
  781. letter-spacing:2px;
  782. -webkit-transition: all .5s ease 0.1s;
  783. -moz-transition:all .5s ease 0.1s;
  784. -ms-transition:all .5s ease 0.1s;
  785. -o-transition: all .5s ease 0.1s;
  786. transition: all .5s ease 0.1s;
  787. border-width: 2px 0px 2px 0px;
  788. border-style:solid;
  789. border-color: #ffffff;
  790. overflow:hidden;
  791. }
  792.  
  793. .connText a:hover {
  794. letter-spacing:5px;
  795. }
  796.  
  797. .vicarious{ Hide Codes }
  798. .profileInfo, .userProfileURL, .friendsComments, .blurbs, .friendSpace, .contactTable, .extendedNetwork, .latestBlogEntry, .interestsAndDetails, .userProfiledetail, .userAlbums, .whitetext12, .orangetext15, .lightbluetext8, .blacktext12, .navigationBar, .btext, .redlink, .redtext, .blacktext10, tr#groups, .navigationBar, .profile, table tr td[id='footerWarpper'] { display:none !important;visibility:hidden!important; }
  799. table table table table td {width:0px;}
  800. .contactTable td, table table td.text table td,table table table table table td {width:auto;}
  801. div div select, div div form {display:none !important;}
  802. select { visibility:hidden!important; WIDTH:0px!important;}
  803. table div {display:none;}
  804. table table div {display:block;}
  805. .clearfix {display:none !important;position:absolute!important;}
  806. div[id="googlebar"],div div select{opacity:0;filter:alpha(opacity=0);display:none !important;position:absolute !important; bottom:2000px !important;}
  807. .profileInfo tr tr td { visibility:hidden; }.profileInfo td.text { visibility:visible; }
  808. .vicarious {Layouts available @ http://vicarious-hs.tumblr.com/}
  809. </style></td></tr></table><table style="display:none"><tr><td>
  810.  
  811.  
  812. -----------------------------LIKE TO MEET-------------------------
  813.  
  814. </td></tr></table></td></tr></table></td></tr></table><table cellspacing="0" cellpadding="0"><tr><td valign="top" padding="0"><table cellspacing="0" cellpadding="0"><tr><td>
  815.  
  816.  
  817. <DIV ID="back"></DIV><div id="topper"><div class="namefield">
  818.  
  819. <em><big>#717 Ember [Flames] Fiora</big></em>
  820.  
  821. </div><div class="circleX"></div>
  822.  
  823. <div class="imageX" style="background-image:url(http://i58.tinypic.com/2i0pzbo.png);">
  824.  
  825. </div><div class="info"><div class="textbox">
  826.  
  827. <font class="strong">Verses</font>
  828. Verse, Verse, Verse
  829.  
  830. <font class="strong">Writing Style</font>
  831. Multi-para to Novella
  832.  
  833. <font class="strong">[c]</font>
  834. Vicarious RP Layouts
  835.  
  836.  
  837. </div></div>
  838.  
  839.  
  840. <a class="lk1" href="/logincomplete.php">Home</a>
  841. <a class="lk2" href="/add_testimonial.php?member_id=xxxxxx">Comment</a>
  842. <a class="lk3" href="/send_message.php?member_id=xxxxxx">Message</a>
  843. <a class="lk4" href="/gallery.php?member_id=xxxxxx">Photos</a>
  844. <a class="lk5" href="/view_member_blog.php?member_id=xxxxxx">Blogs</a>
  845. <a class="lk6" href="/invite_friend.php?friend_id=xxxxxx">Add</a>
  846.  
  847. </div>
  848.  
  849.  
  850.  
  851.  
  852.  
  853. -----------------------------INTERESTS----------------------------
  854.  
  855. </td></tr></table></td></tr></table></td></tr></table><table class="vic-LEFT-SIDE_table" cellspacing="0" cellpadding="0"><tr><td valign="top" padding="0"><table cellspacing="0" cellpadding="0"><tr><td style="width:500px;">
  856.  
  857. <font class="cite">
  858. The above table code must remain at the top. FULL tables below can be rearranged.
  859. </font>
  860.  
  861.  
  862. </td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0"><tr><td>
  863.  
  864.  
  865. <div class="BriefBioTable" style="background-image:url(http://i60.tinypic.com/2j1oa5y.jpg);">
  866.  
  867. <font class="cite">
  868. The above 'background-image' is the red/beige strip at the bottom of the table. If you want to replace it, the dimensions are 500px width by 65px height.
  869. </font>
  870.  
  871. <div class="briefBio">
  872.  
  873. <p>Ember [Flames] Fiora is a young teenage girl in possession of rare fire powers, cursed upon her by the gods from her birth. With this punishment, she was to spend her long days tiredly wandering around, wearily fighting off the demons that haunted the lives of others. When she had but just a second to breathe in the smoky air, she would throw back her head and laugh aloud, seeing how her fights with demons represented the internal fight she faced each day within herself. It was almost as though the gods relished the pain she was forced to face each day, externally and internally ...
  874.  
  875. </div><div class="pic">
  876.  
  877. <img src="http://i58.tinypic.com/30u72q8.png">
  878.  
  879. </div>
  880. <div class="quoteBox"><div class="quote1">
  881.  
  882. “The world
  883.  
  884. </div><div class="quote2">
  885.  
  886. was on fire.”
  887.  
  888. </div></div><div class="music">
  889.  
  890. <object type="application/x-shockwave-flash" data="<embed src="http://www.sheepproductions.com/billy/billy.swf?autoplay=true&f0=http://k003.kiwi6.com/hotlink/6dp1rg6s1y/WILDFIRE.mp3&t0=Wildfire&total=1" quality="high" wmode="transparent" width="200" height="10" name="billy" align="middle" type="application/x-shockwave-flash" />" width="200" height="20">
  891. <param name="movie" value="<embed src="http://www.sheepproductions.com/billy/billy.swf?autoplay=true&f0=http://k003.kiwi6.com/hotlink/6dp1rg6s1y/WILDFIRE.mp3&t0=Wildfire&total=1" quality="high" wmode="transparent" width="200" height="10" name="billy" align="middle" type="application/x-shockwave-flash" />" />
  892. <param name="bgcolor" value="#ff1919" />
  893. <param name="wmode" value="opaque" />
  894. <param name="FlashVars" value="mp3=http%3A//k003.kiwi6.com/hotlink/6h933jbsva/L-YFB.mp3&autoplay=1&bgcolor=ff1919&loadingcolor=ffffff&buttoncolor=ffffff&slidercolor=ffffff" />
  895. </object>
  896. </div>
  897.  
  898.  
  899.  
  900. </td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0"><tr><td>
  901.  
  902. <div class="statsTable"><div class="tabsBox">
  903.  
  904. <div class="tabA"><div class="title1">
  905.  
  906. Legal & Physical
  907.  
  908. </div><div class="textbox">
  909.  
  910. <b>Full Name:</B> Ember [Flames] Fiora
  911. <BR><b>Nicknames:</B> N/A
  912. <BR><b>Aliases:</B> N/A
  913. <BR><b>Date Of Birth:</B> April 7th, 2015
  914. <BR><b>Place Of Birth:</B> N/A
  915. <BR><b>Current Residence:</B> AAM [All Anime Mansion]
  916. <BR><b>Ethnicity:</B> Japanese
  917. <BR><b>Hair Color:</B> Striking White
  918. <BR><b>Eye Color:</B> Fiery Red
  919. <BR><b>Height:</B> 5 ft. 5 in.
  920. <BR><b>Weight:</B> 103 lbs.
  921. <BR><b>Birthmarks/Scars:</B> N/A
  922.  
  923. </div></div><div class="tabA"><div class="title1">
  924.  
  925. Family & Relationships
  926.  
  927. </div><div class="textbox">
  928.  
  929. <b>Mother:</B> N/A
  930. <BR><b>Father:</B> N/A
  931. <BR><b>Sister(S):</B> N/A
  932. <BR><b>Brother(S):</B> N/A
  933. <BR><b>Other Family:</B> N/A
  934. <BR><b>Sexual Orientation:</B> Heterosexual [Straight]
  935. <BR><b>Relationship Status:</B> Single
  936. <BR><b>Current Relationship(S):</B> N/A
  937. <BR><b>Past Relationship(S):</B> N/A
  938.  
  939. </div></div><div class="tabA"><div class="title1">
  940.  
  941. Education & Employment
  942.  
  943. </div><div class="textbox">
  944.  
  945. <b>High School</B> N/A
  946. <BR><b>College</B> N/A
  947. <BR><b>Major</B> N/A
  948. <BR><b>Degree</B> N/A
  949. <BR><b>Occupation:</B> N/A
  950. <BR><b>Job Description:</B> N/A
  951. <BR><b>Employer:</B> N/A
  952. <BR><b>Skills:</B> N/A
  953.  
  954. </div></div><div class="tabA"><div class="title1">
  955.  
  956. Personality
  957.  
  958. </div><div class="textbox">
  959.  
  960. <b>Traits:</B> Input Info
  961. <BR><b>Quirks:</B> Input Info
  962. <BR><b>Habits:</B> Input Info
  963.  
  964. <p>Personality information goes here. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
  965.  
  966. </div></div><div class="tabB"><div class="title1">
  967.  
  968. Other Details
  969.  
  970. </div><div class="textbox">
  971.  
  972. <p>Additional box. You can use this to split up some of the info above even further, or you can add likes/dislikes or other details here. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
  973.  
  974. </div></div></div>
  975.  
  976. <div class="photo" style="background-image:url(http://i58.tinypic.com/2qcngyg.jpg);">
  977.  
  978. </div></div>
  979.  
  980.  
  981. </td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0"><tr><td>
  982.  
  983. <div class="LyricsTable" style="background-image:url(http://i61.tinypic.com/jszted.jpg);">
  984.  
  985. <font class="cite">The background image above represents the bottom character image which is 500px width by 300px height. If you replace this image, keep in mind that you have a second lyric box set on top of it. Therefore, it's best to replace it with a photo of a person who is aligned to the left of the image like the one I have included so as not to have the box on top of the person's body. Otherwise, you'll need to relocate the lyricsB box by going into About Me and changing the margin-left number.
  986. </font>
  987.  
  988.  
  989. <div class="lyricsA">
  990.  
  991. "Trapped for days, years, centuries even. Dead, <br> </br> but not allowed to die. Alive, but good as dead." <br> </br>
  992. "The sky is above me. The earth lies below me. <br> <br> The raging fire dwells within me."
  993.  
  994.  
  995. </div><div class="lyricsB">
  996.  
  997.  
  998.  
  999. </div></div>
  1000. -----------------------------MUSIC--------------------------------
  1001.  
  1002. </td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0"><tr><td>
  1003.  
  1004. <div style="width:430px; height:200px; overflow:auto; margin:25px; padding:5px; border:5px solid #ff1919; text-align:justify;">
  1005.  
  1006. Extra Table. Adjust height, etc. as needed. Duplicate as needed.
  1007.  
  1008. </div>
  1009. -----------------------------MOVIES-------------------------------
  1010.  
  1011. </td></tr></table></td></tr></table></td></tr></table><table class="vic-RIGHT-SIDE_table" cellspacing="0" cellpadding="0"><tr><td valign="top" padding="0"><table cellspacing="0" cellpadding="0"><tr><td style="width:500px;">
  1012.  
  1013. <font class="cite">
  1014. The above table code must remain at the top. FULL tables below can be rearranged.
  1015. </font>
  1016.  
  1017. </td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0"><tr><td>
  1018.  
  1019. <img src="http://i60.tinypic.com/2rz2il0.jpg">
  1020.  
  1021.  
  1022. </td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0"><tr><td>
  1023.  
  1024. <div class="MainBioTable"><div class="line1"></div><div class="line2"></div><div class="line3"></div><div class="line4"></div><div class="square"></div>
  1025.  
  1026.  
  1027. <div class="title1">
  1028. <small>Now, they whisper my name.</small>
  1029. </div>
  1030.  
  1031. <div class="about1">
  1032. <p>On one of her fights, she happened to stumble across a crimson red egg and decided to adopt it, despite it bursting into flames the moment her fingertips touched its fragile surface. Not long after adopting it, a baby phoenix hatched out of the egg. Sensing Ember's powerful aura, the baby phoenix chirped and nuzzled its owner's cheek, vowing to never leave Ember's side. She stroked its head and decided to bestow the name "Seraphina" [which means "burning fire"] upon it. Many years later after the hatching, she continues to fight off the demons that surrounds us [alongside with Seraphina,] hoping that one day, someone could free her from her own demons ...
  1033.  
  1034. <BR>
  1035.  
  1036. </div></div>
  1037.  
  1038.  
  1039. -----------------------------TV---------------------------
  1040.  
  1041. </td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0"><tr><td>
  1042.  
  1043.  
  1044. <div class="connTable" style="background-image:url(http://i60.tinypic.com/ok4wu8.jpg);">
  1045.  
  1046. <font class="cite">
  1047. The above background image is the floral print. If you want to swap it out, the image size is 400px by 400px.
  1048. </font>
  1049.  
  1050. <div class="middlePic" style="background-image:url(http://i62.tinypic.com/2vnq9o8.jpg);"></div>
  1051.  
  1052. <div class="conns">
  1053.  
  1054. <div class="conn1" style="background-image:url(http://i62.tinypic.com/6yl7rr.jpg);">
  1055.  
  1056. <div class="connText">
  1057.  
  1058. <big>Connection 1</big>
  1059. <a href="/#">View Profile</a>
  1060.  
  1061. <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?
  1062.  
  1063.  
  1064. </div></div>
  1065.  
  1066.  
  1067. <div class="conn2" style="background-image:url(http://i62.tinypic.com/6yl7rr.jpg);">
  1068.  
  1069. <div class="connText">
  1070.  
  1071. <big>Connection 2</big>
  1072. <a href="/#">View Profile</a>
  1073.  
  1074. <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.
  1075.  
  1076. </div></div>
  1077.  
  1078.  
  1079. <div class="conn3" style="background-image:url(http://i62.tinypic.com/6yl7rr.jpg);">
  1080.  
  1081. <div class="connText">
  1082.  
  1083. <big>Connection 3</big>
  1084. <a href="/#">View Profile</a>
  1085.  
  1086. <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.
  1087.  
  1088. </div></div>
  1089.  
  1090.  
  1091. <div class="conn4" style="background-image:url(http://i62.tinypic.com/6yl7rr.jpg);">
  1092.  
  1093. <div class="connText">
  1094.  
  1095. <big>Connection 4</big>
  1096. <a href="/#">View Profile</a>
  1097.  
  1098. <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.
  1099.  
  1100. </div></div>
  1101.  
  1102.  
  1103. <div class="conn5" style="background-image:url(http://i62.tinypic.com/6yl7rr.jpg);">
  1104.  
  1105. <div class="connText">
  1106.  
  1107. <big>Connection 5</big>
  1108. <a href="/#">View Profile</a>
  1109.  
  1110. <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.
  1111.  
  1112. </div></div>
  1113.  
  1114.  
  1115. <div class="conn6" style="background-image:url(http://i62.tinypic.com/6yl7rr.jpg);">
  1116.  
  1117. <div class="connText">
  1118.  
  1119. <big>Connection 6</big>
  1120. <a href="/#">View Profile</a>
  1121.  
  1122. <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.
  1123.  
  1124. </div></div>
  1125.  
  1126. <div class="conn7" style="background-image:url(http://i62.tinypic.com/6yl7rr.jpg);">
  1127.  
  1128. <div class="connText">
  1129.  
  1130. <big>Connection 7</big>
  1131. <a href="/#">View Profile</a>
  1132.  
  1133. <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.
  1134.  
  1135. </div></div>
  1136.  
  1137. <div class="conn8" style="background-image:url(http://i62.tinypic.com/6yl7rr.jpg);">
  1138.  
  1139. <div class="connText">
  1140.  
  1141. <big>Connection 8</big>
  1142. <a href="/#">View Profile</a>
  1143.  
  1144. <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.
  1145.  
  1146. </div></div></div></div>
  1147.  
  1148. -----------------------------BOOKS--------------------------------
  1149.  
  1150. </td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0"><tr><td>
  1151.  
  1152. <div style="width:430px; height:200px; overflow:auto; margin:25px; padding:5px; border:5px solid #ff1919; text-align:justify;">
  1153.  
  1154. Extra Table. Adjust height, etc. as needed. Duplicate as needed.
  1155.  
  1156. </div>
  1157.  
  1158. -----------------------------HEROES-------------------------------
  1159.  
  1160. <font class="cite">
  1161.  
  1162. Character Photo Dimensions
  1163.  
  1164. Topper Image Sizes:
  1165. Div class imageX (Photo in circle) = 174px by 174px ( You can put in a 200 by 200 pic, a 500 by 500 pic, etc. The photo will auto-resize to the appropriate dimensions. Just don't load a pic that is not AT LEAST 174 by 174.).
  1166.  
  1167. Left Side Tables
  1168.  
  1169. BriefBioTable/Div class pic = 250px width by 250px height.
  1170. StatsTable/Div class photo = 375px width by 500px height.
  1171. LyricsTable = 500px width by 300px height.
  1172.  
  1173.  
  1174. Right Side Tables
  1175. First Table = 500px width by 500px height.
  1176. ConnTable/Div class middlePic = 200px width by 250px height.
  1177. ConnTable/Div Class Conn1, etc (Earn It/Connection Images) = 90px width by 190px height.
  1178. </font>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement