API tools faq
paste
Advertisement
b0rn-to-be-wild

All in one VIII bright

b0rn-to-be-wild
May 2nd, 2015
357
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.00 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.  
  3.  
  4. <!----
  5.  
  6. © borntobewildthemes.tumblr.com | "All in One VIII bright"
  7.  
  8. + Please do not redistribute this page or remove credits.
  9. + You are allowed to make changes as long as you keep our credits.
  10. + If you have any questions or concerns, just contact us!
  11. + Thanks for using our page! We hope that you enjoy it!
  12.  
  13. ---->
  14.  
  15.  
  16. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  17.  
  18.  
  19. <head>
  20.  
  21. <!-- Google fonts -->
  22.  
  23. <link href="//fonts.googleapis.com/css?family=Exo:400" rel="stylesheet" type="text/css">
  24.  
  25. <link href='http://fonts.googleapis.com/css?family=Kaushan+Script' rel='stylesheet' type='text/css'>
  26.  
  27. <style type="text/css">
  28.  
  29. /*--body--*/
  30.  
  31. body {
  32. font-style:none;
  33. background-color:black;
  34. /* background image */
  35. background-image: url('http://www.bellazon.com/main/uploads/monthly_07_2010/post-37737-1279561181.jpg');
  36. background-size:cover;
  37. font-family:Kaushan Script;
  38. padding:0;
  39. margin:0;
  40. overflow:hidden;
  41. }
  42.  
  43. a {
  44. text-decoration:none;
  45. }
  46.  
  47. a img:hover {
  48. opacity:1;
  49. border-radius:0px;
  50. }
  51.  
  52. img {
  53. border:none;
  54. }
  55.  
  56. b, strong { color:#455038;}
  57. i, em { color:#777;}
  58.  
  59. blockquote {
  60. padding-left:5px;
  61. border-left:2px solid {color:border};
  62. }
  63.  
  64. h1 {
  65. font-size:20px;
  66. line-height:25px;
  67. color:#35241D;
  68. font-family:'Kaushan Script';
  69. border-bottom:1px solid #455038;
  70. }
  71.  
  72. /*--tooltips--*/
  73.  
  74. #s-m-t-tooltip {
  75. max-width:300px;
  76. z-index:10000000;
  77. margin:24px 14px 7px 12px;
  78. padding:8px;
  79. color:#35241D;
  80. background:#fff;
  81. border:1px solid #ddd;
  82. font-size:13px;
  83. line-height:16px;
  84. }
  85.  
  86. /*--scrollbar--*/
  87.  
  88. ::-webkit-scrollbar-thumb {
  89. background: #35241D;
  90. height: auto;
  91. border: 2px solid #fff;
  92. }
  93.  
  94. ::-webkit-scrollbar {
  95. height:10px;
  96. width:10px;
  97. background: #35241D;
  98. height: auto;
  99. border: 4px solid #fff;
  100. }
  101.  
  102. /*--footer-*/
  103.  
  104. #footer {
  105. position:fixed;
  106. font-family:'Exo';
  107. font-size:20px;
  108. text-align:center;
  109. bottom:0;
  110. left:0px;
  111. color:#455038;
  112. border-top:1px solid #ddd;
  113. width:100%;
  114. height:200px;
  115. background:#fff;
  116. }
  117.  
  118. #footer a{
  119. color:#ddd;
  120. padding-bottom:9px;
  121. padding-left:5px;
  122. padding-right:5px;
  123. text-decoration:none;
  124. }
  125.  
  126. #footer a:hover{
  127. color:#fff000;
  128. background:#ddd;
  129. }
  130.  
  131. /* Main links */
  132.  
  133. #links {
  134. position:absolute;
  135. margin-top:10px;
  136. left:10px;
  137. }
  138.  
  139. #links a{
  140. display:block;
  141. color:#ccc;
  142. font-family:'Exo';
  143. font-size:20px;
  144. }
  145.  
  146. #links a:hover{
  147. color:#fff;
  148. }
  149.  
  150. /* Main title */
  151.  
  152. .title{
  153. position:absolute;
  154. font-family:'Kaushan Script';
  155. font-size:25px;
  156. text-align:center;
  157. line-height:50px;
  158. margin-top:0px;
  159. margin-left:10px;
  160. color:#35241D;
  161. width:200px;
  162. height:50px;
  163. padding:5px;
  164. overflow:hidden;
  165. }
  166.  
  167. /* Description */
  168.  
  169. .desc{
  170. position:absolute;
  171. margin-top:60px;
  172. margin-left:10px;
  173. padding-top:10px;
  174. width:200px;
  175. max-height:120px;
  176. font-size:16px;
  177. font-family:Exo;
  178. color:#35241D;
  179. border-top:1px solid #455038;
  180. overflow-y:auto;
  181. text-align:center;
  182. }
  183.  
  184. /* Container */
  185.  
  186. #container{
  187. position:absolute;
  188. z-index: 300;
  189. bottom:5px;
  190. color:#fff;
  191. left:220px;
  192. height:190px;
  193. border-left:1px solid #ddd;
  194. text-align:center;
  195. width: -moz-calc(100% - 230px);
  196. width: -webkit-calc(100% - 230px);
  197. width: -o-calc(100% - 230px);
  198. width: calc(100% - 230px);
  199. }
  200.  
  201. #containerimg img{
  202. position:relative;
  203. margin-top:0px;
  204. margin-left:0px;
  205. border: 5px ridge #ddd;
  206. width: 100%;
  207. height:100px;
  208. }
  209.  
  210. /* First box */
  211.  
  212. .title1 {
  213. position:absolute;
  214. font-family:'Kaushan Script';
  215. font-size:25px;
  216. margin-top:0px;
  217. margin-left:10px;
  218. color:#35241D;
  219. padding:5px;
  220. }
  221.  
  222. .title1:hover{
  223. opacity:0.9;
  224. color:#35241D;
  225. -webkit-transition: all 0.7s ease-in-out;
  226. -moz-transition: all 0.7s ease-in-out;
  227. -o-transition: all 0.7s ease-in-out;
  228. }
  229.  
  230. .about{
  231. position:absolute;
  232. height:170px;
  233. width: -moz-calc(100% - 170px);
  234. width: -webkit-calc(100% - 170px);
  235. width: -o-calc(100% - 170px);
  236. width: calc(100% - 170px);
  237. padding-right:10px;
  238. font-family:'Exo';
  239. overflow-y:auto;
  240. margin-top:10px;
  241. margin-left:150px;
  242. font-size:14px;
  243. background:#fff;
  244. color:#35241D;
  245. line-height:20px;
  246. text-align:right;
  247. display:none;
  248. }
  249.  
  250. .about b, strong {color:#455038;}
  251.  
  252. .portrait {
  253. width:45px;
  254. height:45px;
  255. border:3px double #ddd;
  256. float:left;
  257. margin:5px;
  258. }
  259.  
  260. .close1{
  261. position:absolute;
  262. color:#455038;
  263. right:10px;
  264. top:10px;
  265. font-size:20px;
  266. }
  267.  
  268. /* Second box */
  269.  
  270. .title2 {
  271. position:absolute;
  272. font-family:'Kaushan Script';
  273. font-size:25px;
  274. margin-top:50px;
  275. margin-left:10px;
  276. color:#35241D;
  277. padding:5px;
  278. }
  279.  
  280. .title2:hover{
  281. opacity:0.9;
  282. color:#455038;
  283. -webkit-transition: all 0.7s ease-in-out;
  284. -moz-transition: all 0.7s ease-in-out;
  285. -o-transition: all 0.7s ease-in-out;
  286. }
  287.  
  288. .faq{
  289. position:absolute;
  290. height:170px;
  291. width: -moz-calc(100% - 170px);
  292. width: -webkit-calc(100% - 170px);
  293. width: -o-calc(100% - 170px);
  294. width: calc(100% - 170px);
  295. font-family:'Exo';
  296. overflow-y:auto;
  297. margin-top:10px;
  298. margin-left:150px;
  299. padding-left:5px;
  300. padding-right:5px;
  301. font-size:15px;
  302. background:#fff;
  303. color:#35241D;
  304. line-height:20px;
  305. text-align:center;
  306. display:none;
  307. }
  308.  
  309. .faq b, strong {
  310. color:#455038;
  311. font-size:17px;
  312. }
  313.  
  314. .close2{
  315. position:absolute;
  316. color:#455038;
  317. right:10px;
  318. top:10px;
  319. font-size:20px;
  320. }
  321.  
  322. /* Third box */
  323.  
  324. .title3 {
  325. position:absolute;
  326. font-family:'Kaushan Script';
  327. font-size:25px;
  328. margin-top:100px;
  329. margin-left:10px;
  330. color:#35241D;
  331. padding:5px;
  332. }
  333.  
  334. .title3:hover{
  335. opacity:0.9;
  336. color:#455038;
  337. -webkit-transition: all 0.7s ease-in-out;
  338. -moz-transition: all 0.7s ease-in-out;
  339. -o-transition: all 0.7s ease-in-out;
  340. }
  341.  
  342. .tags{
  343. position:absolute;
  344. height:170px;
  345. width: -moz-calc(100% - 170px);
  346. width: -webkit-calc(100% - 170px);
  347. width: -o-calc(100% - 170px);
  348. width: calc(100% - 170px);
  349. background:#ddd;
  350. padding-right:10px;
  351. font-family:'Exo';
  352. overflow-y:auto;
  353. margin-top:10px;
  354. margin-left:150px;
  355. font-size:14px;
  356. background:#fff;
  357. color:#35241D;
  358. line-height:20px;
  359. text-align:right;
  360. display:none;
  361. }
  362.  
  363. .tags a{
  364. display:inline-block;
  365. font-size:15px;
  366. max-width:200px;
  367. overflow:hidden;
  368. color:#35241D;
  369. background:#fff;
  370. border:1px solid #ddd;
  371. padding:5px 10px;
  372. margin-top:5px;
  373. margin-bottom:5px;
  374. }
  375.  
  376. .tags a:hover{
  377. box-shadow: inset 200px 0 0 0 #35241D;
  378. color: #777;
  379. }
  380.  
  381. .close3{
  382. position:absolute;
  383. color:#455038;
  384. right:10px;
  385. top:10px;
  386. font-size:20px;
  387. }
  388.  
  389. /* Fourth box */
  390.  
  391. .title4 {
  392. position:absolute;
  393. font-family:'Kaushan Script';
  394. font-size:25px;
  395. margin-top:150px;
  396. margin-left:10px;
  397. color:#35241D;
  398. padding:5px;
  399. }
  400.  
  401. .blogroll{
  402. position:absolute;
  403. height:170px;
  404. width: -moz-calc(100% - 170px);
  405. width: -webkit-calc(100% - 170px);
  406. width: -o-calc(100% - 170px);
  407. width: calc(100% - 170px);
  408. padding-right:10px;
  409. font-family:'Exo';
  410. overflow-y:auto;
  411. margin-top:10px;
  412. margin-left:150px;
  413. font-size:14px;
  414. background:#fff;
  415. color:#35241D;
  416. line-height:20px;
  417. text-align:center;
  418. display:none;
  419. }
  420.  
  421. .blogroll img {
  422. width:35px;
  423. height:35px;
  424. margin:4px;
  425. border:2px #ddd ridge;
  426. border-radius:0px;
  427. padding:4px;
  428. opacity:0.7;
  429. }
  430.  
  431. .blogroll img:hover{
  432. border:1px solid #455038;
  433. }
  434.  
  435. .close4{
  436. position:absolute;
  437. color:#455038;
  438. right:10px;
  439. top:10px;
  440. font-size:20px;
  441. }
  442.  
  443. /* Credits */
  444.  
  445. #credits {
  446. position:fixed;
  447. right:10px;
  448. top:30px;
  449. z-index:100000;
  450. border:3px solid #455038;
  451. }
  452.  
  453. #credts img{
  454. border:3px solid #455038;
  455. }
  456.  
  457. .title1:hover, .title2:hover, .title3:hover, .title4:hover{
  458. color:#35241D;
  459. }
  460.  
  461. {CustomCSS}
  462.  
  463. </style>
  464.  
  465. <!--Style my tooltips-->
  466.  
  467. <link href="style-my-tooltips.css" rel="stylesheet" type="text/css" />
  468. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  469. <script src="jquery.style-my-tooltips.js"></script>
  470.  
  471. <script type="text/javascript" src="http://static.tumblr.com/imovwvl/dJWl20ley/jqueryformasonry.js"></script>
  472.  
  473. <script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
  474. <script>
  475. (function($){
  476. $(document).ready(function(){
  477. $("[title]").style_my_tooltips({
  478. tip_follows_cursor:true,
  479. tip_delay_time:200,
  480. tip_fade_speed:300
  481. }
  482. );
  483. });
  484. })(jQuery);
  485. </script>
  486.  
  487. <!-- Scripts - DO NOT REMOVE -->
  488.  
  489. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  490. <script>
  491. $(document).ready(function(){
  492. $(".title1").click(function(){
  493. $(".about").toggle(0);
  494. });
  495. });
  496. </script>
  497.  
  498. <script>
  499. $(document).ready(function(){
  500. $(".close1").click(function(){
  501. $(".about").slideToggle(500);
  502. });
  503. });
  504. </script>
  505.  
  506. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  507. <script>
  508. $(document).ready(function(){
  509. $(".title2").click(function(){
  510. $(".faq").toggle(0);
  511. });
  512. });
  513. </script>
  514.  
  515. <script>
  516. $(document).ready(function(){
  517. $(".close2").click(function(){
  518. $(".faq").slideToggle(500);
  519. });
  520. });
  521. </script>
  522.  
  523. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  524. <script>
  525. $(document).ready(function(){
  526. $(".title3").click(function(){
  527. $(".tags").toggle(0);
  528. });
  529. });
  530. </script>
  531.  
  532. <script>
  533. $(document).ready(function(){
  534. $(".close3").click(function(){
  535. $(".tags").slideToggle(500);
  536. });
  537. });
  538. </script>
  539.  
  540. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  541. <script>
  542. $(document).ready(function(){
  543. $(".title4").click(function(){
  544. $(".blogroll").toggle(0);
  545. });
  546. });
  547. </script>
  548.  
  549. <script>
  550. $(document).ready(function(){
  551. $(".close4").click(function(){
  552. $(".blogroll").slideToggle(500);
  553. });
  554. });
  555. </script>
  556.  
  557. <script type="text/javascript"
  558. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  559.  
  560. <link rel="shortcut icon" href="{Favicon}" />
  561. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  562.  
  563. </head>
  564.  
  565.  
  566. <body>
  567.  
  568. <div id="everything">
  569.  
  570. <div id="links">
  571. <a href="/"><b>-</b> HOME</a>
  572. <a href="/ask"><b>-</b> ASK</a>
  573. <a href="http://tumblr.com"><b>-</b> DASH</a>
  574. </div>
  575.  
  576. <div id="footer">
  577. <div class="title">Your title goes here</div>
  578. <div class="desc"> You can put your description here </div>
  579. </div>
  580.  
  581. <div id="container">
  582.  
  583. <center>
  584.  
  585. <div class="title1"><b>About</b></div>
  586.  
  587. <div class="title2"><b>F.A.Q.</b></div>
  588.  
  589. <div class="title3"><b>Tags</b></div>
  590.  
  591. <div class="title4"><b>Blogroll</b></div>
  592.  
  593. <div class="about"><h1><center>About me</center></h1>
  594.  
  595. <div class="close1">X</div>
  596.  
  597. <!-- CHANGE ABOUT IMAGE -->
  598. <img src="http://www.oystermag.com/sites/default/files/wp-archive/2012/01/20110929_matthew_gubler-29.jpg"
  599. class="portrait" />
  600. <div align="justify">
  601.  
  602. <!-- CHANGE about -->
  603.  
  604. Lorem ipsum dolor sit amet, malis impetus fabellas ne sit, vel quaestio democritum te. Cu scaevola ocurreret per, sed at <u>possit</u> mollis. Iudicabit sadipscing appellantur at <b>vim</b>. Te mea nobis vidisse.
  605. Ne assum <b>ancillae</b> vel, cibo facete persequeris vix at. Ius te doming audire, quo error soluta efficiendi ei. Ex iudico aeterno laboramus sea, solet perfecto mediocrem at sed.<p>
  606.  
  607. Tantas <b>invidunt</b> ea nec, aliquip vocibus <u>principes</u> eos et. Tota propriae quaestio no sit, suavitate liberavisse id nec, ea atqui invenire euripidis eam. Viris decore intellegat duo ut, eu cum aliquip laboramus. Usu postea quaerendum ne, pri at scripta disputando accommodare. Ne rebum falli ornatus ius, omnes ullamcorper ut duo.
  608.  
  609. <!-- about ENDS-->
  610. </div>
  611.  
  612. </div>
  613.  
  614. <div class="faq"><h1>Frequently Asked Questions</h1><br>
  615.  
  616. <div class="close2">X</div>
  617.  
  618. <!-- CHANGE FAQ -->
  619.  
  620. <b>QUESTION</b> <br>
  621. Answer<br><br>
  622.  
  623. <b>QUESTION</b> <br>
  624. Answer<br><br>
  625.  
  626. <b>QUESTION</b> <br>
  627. Answer<br><br>
  628.  
  629. <b>QUESTION</b> <br>
  630. Answer<br><br>
  631.  
  632. <b>QUESTION</b> <br>
  633. Answer<br><br>
  634.  
  635. <b>QUESTION</b> <br>
  636. Answer<br><br>
  637.  
  638. <!-- FAQ ENDS -->
  639.  
  640. <br><br></div>
  641.  
  642. <div class="tags">
  643.  
  644. <div class="close3">X</div>
  645.  
  646. <center>
  647. <h1>Tags masterlist</h1>
  648.  
  649. <a href="/"><b> # </b> tag</a>
  650.  
  651. <a href="/"><b> # </b> tag</a>
  652.  
  653. <a href="/"><b> # </b> tag</a>
  654.  
  655. <a href="/"><b> # </b> tag</a>
  656.  
  657. <a href="/"><b> # </b> tag</a>
  658.  
  659. <a href="/"><b> # </b> tag</a>
  660.  
  661. <a href="/"><b> # </b> tag</a>
  662.  
  663. <a href="/"><b> # </b> tag</a>
  664.  
  665. <a href="/"><b> # </b> tag</a>
  666.  
  667. <a href="/"><b> # </b> tag</a>
  668.  
  669. <br>
  670.  
  671. <a href="/"><b> # </b> tag</a>
  672.  
  673. <a href="/"><b> # </b> tag</a>
  674.  
  675. <a href="/"><b> # </b> tag</a>
  676.  
  677. <a href="/"><b> # </b> tag</a>
  678.  
  679. <a href="/"><b> # </b> tag</a>
  680.  
  681. <a href="/"><b> # </b> tag</a>
  682.  
  683. <a href="/"><b> # </b> tag</a>
  684.  
  685. <a href="/"><b> # </b> tag</a>
  686.  
  687. <a href="/"><b> # </b> tag</a>
  688.  
  689. <a href="/"><b> # </b> tag</a>
  690.  
  691. </center>
  692. </div>
  693.  
  694. <div class="blogroll">
  695.  
  696. <div class="close4">X</div>
  697.  
  698. <h1>Following</h1>
  699.  
  700. {block:Following}{block:Followed}<a title='{FollowedName}' target='_blank' href='{FollowedURL}'><img border='0' src='{FollowedPortraitURL-96}' />{/block:Followed}{/block:Following}</div>
  701.  
  702. </div>
  703.  
  704. </div>
  705.  
  706. <!-- End container -->
  707.  
  708. <a href="http://borntobewildthemes.tumblr.com" title="All in one page VIII by borntobewildthemes"><div id="credits">
  709. <img src="http://i57.tinypic.com/301g6eg.jpg"></div></a>
  710.  
  711. </body>
  712.  
  713.  
  714. </html>
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!