Advertisement
b0rn-to-be-wild

Baroque

Mar 28th, 2015
641
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 29.90 KB | None | 0 0
  1.  
  2. <!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4.  
  5. <!----
  6.  
  7. © borntobewildthemes.tumblr.com | "Baroque"
  8.  
  9. + Please do not redistribute this theme or remove credits.
  10. + You are allowed to make changes as long as you keep our credits.
  11. + If you have any questions or concerns, just contact us.
  12. + Thanks for using our theme! We hope that you enjoy it!
  13.  
  14. ---->
  15.  
  16. <html>
  17.  
  18. <head>
  19.  
  20. <!--Custom cursor-->
  21.  
  22. {block:IfShowCustomCursor}
  23. <!--Cursor code-->
  24. <style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-3/cur237.ani), url(http://cur.cursors-4u.net/cursors/cur-3/cur237.png), progress !important;}</style>
  25. {/block:IfShowCustomCursor}
  26.  
  27. <!--Google fonts-->
  28.  
  29. <link href='http://fonts.googleapis.com/css?family=Great+Vibes' rel='stylesheet' type='text/css'>
  30.  
  31. <link href='http://fonts.googleapis.com/css?family=Rouge+Script' rel='stylesheet' type='text/css'>
  32.  
  33. <link href='http://fonts.googleapis.com/css?family=Clicker+Script' rel='stylesheet' type='text/css'>
  34.  
  35. <link href='http://fonts.googleapis.com/css?family=The+Girl+Next+Door' rel='stylesheet' type='text/css'>
  36.  
  37. <link href='http://fonts.googleapis.com/css?family=Alex+Brush' rel='stylesheet' type='text/css'>
  38.  
  39. <script type="text/javascript"
  40. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  41.  
  42. <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
  43.  
  44. <meta name="viewport" content="width=device-width, initial-scale=1">
  45.  
  46. <!--DEFAULT VARIABLES-->
  47. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  48.  
  49. <meta name="image:Background" content="1"/>
  50. <meta name="image:Sidebar image 1" content="1"/>
  51. <meta name="image:Sidebar image 2" content="1"/>
  52.  
  53. <meta name="color:Background" content="#fff"/>
  54. <meta name="color:Left sidebar background" content="#F0CBAE"/>
  55. <meta name="color:Right sidebar background" content="#FED5CFF"/>
  56. <meta name="color:Blog Title" content="#000000"/>
  57. <meta name="color:Post background" content="#CBB3CD"/>
  58. <meta name="color:Title" content="#000000"/>
  59. <meta name="color:Icon" content="#069d92"/>
  60. <meta name="color:Link" content="#FE3B80"/>
  61. <meta name="color:Text" content="#777"/>
  62. <meta name="color:Bold" content="#FE3B80"/>
  63. <meta name="color:Italic" content="#069d92"/>
  64. <meta name="color:Hover" content="#000000"/>
  65. <meta name="color:Borders" content="#D0CBB8"/>
  66. <meta name="color:Description" content="#eee"/>
  67. <meta name="color:First Letter" content="#000000"/>
  68. <meta name="color:Scrollbar" content="#fff"/>
  69.  
  70. <meta name="select:Title Font" content="Great Vibes" title="Great Vibes">
  71. <meta name="select:Title Font" content="Rouge Script" title="Rouge Script">
  72. <meta name="select:Title Font" content="Clicker Script" title="Clicker Script">
  73. <meta name="select:Title Font" content="The Girl Next Door" title="The Girl Next Door">
  74. <meta name="select:Title Font" content="Alex Brush" title="Alex Brush">
  75.  
  76. <meta name="select:Title font size" content="20px" title="20px">
  77. <meta name="select:Title font size" content="22px" title="22px">
  78. <meta name="select:Title font size" content="25px" title="25px">
  79. <meta name="select:Title font size" content="27px" title="27px">
  80. <meta name="select:Title font size" content="30px" title="30px">
  81.  
  82. <meta name="font:Body font" content="Helvetica"/>
  83. <meta name="select:Body font size" content="12px" title="12px">
  84. <meta name="select:Body font size" content="13px" title="13px">
  85. <meta name="select:Body font size" content="14px" title="14px">
  86. <meta name="select:Body font size" content="15px" title="15px">
  87. <meta name="select:Body font size" content="16px" title="16px">
  88.  
  89. <meta name="text:Link 1" content="link 1"/>
  90. <meta name="text:Link 2" content="link 2"/>
  91. <meta name="text:Link 3" content="link 3"/>
  92. <meta name="text:Link 4" content="link 4"/>
  93. <meta name="text:Link 5" content="link 5"/>
  94.  
  95. <meta name="text:Link 1 url" content="link 1 url"/>
  96. <meta name="text:Link 2 url" content="link 2 url"/>
  97. <meta name="text:Link 3 url" content="link 3 url"/>
  98. <meta name="text:Link 4 url" content="link 4 url"/>
  99. <meta name="text:Link 5 url" content="link 5 url"/>
  100.  
  101. <meta name="if:Faded Images" content="0" />
  102. <meta name="if:Monochrome Images" content="0" />
  103. <meta name="if:Show Captions" content="1" />
  104. <meta name="if:Show Tags" content="1" />
  105. <meta name="if:Show Custom Cursor" content="1" />
  106. <meta name="if:Show Search Box" content="1" />
  107. <meta name="if:Show Social Icons" content="1" />
  108.  
  109. <meta name="if:Facebook" content="1" />
  110. <meta name="if:Twitter" content="1" />
  111. <meta name="if:Flickr" content="1" />
  112. <meta name="if:Googleplus" content="1" />
  113. <meta name="if:Deviantart" content="1" />
  114.  
  115. <meta name="text:Facebook url" content="http://" />
  116. <meta name="text:Twitter url" content="http://" />
  117. <meta name="text:Flickr url" content="http://" />
  118. <meta name="text:Googleplus url" content="http://" />
  119. <meta name="text:Deviantart url" content="http://" />
  120.  
  121. <style type="text/css">
  122.  
  123. /* ---------------------------- GENERAL ----------------------------- */
  124.  
  125. /* -------- BASICS ------- */
  126.  
  127. body {
  128. padding: 0px;
  129. margin: 0px;
  130. color:{color:Text};
  131. font-family:{font:Body font};
  132. font-size:{select:Body font size};
  133. line-height: -moz-calc({select:Body font size} + 3px);
  134. line-height: -webkit-calc({select:Body font size} + 3px);
  135. line-height: -o-calc({select:Body font size} + 3px);
  136. line-height: calc({select:Body font size} + 3px);
  137. background-attachment: fixed;
  138. background-repeat: repeat;
  139. }
  140.  
  141. /* Paragraph */
  142.  
  143. p {margin-top:5px; margin-bottom:5px;}
  144.  
  145. <--ses-->
  146. small{font-size: 90%;}
  147.  
  148. big{font-size: 110%;}
  149.  
  150. /* Title */
  151.  
  152. h1{
  153. color:{color:Title};
  154. font-family:{select:Title Font};
  155. font-size:{select:Title font size};
  156. line-height: -moz-calc({select:Title font size} + 3px);
  157. line-height: -webkit-calc({select:Title font size} + 3px);
  158. line-height: -o-calc({select:Title font size} + 3px);
  159. line-height: calc({select:Title font size} + 3px);
  160. border-bottom:1px solid {color:Borders};
  161. letter-spacing:1px;
  162. text-transform:lowercase;
  163. font-weight:normal;
  164. }
  165.  
  166. /* Captions */
  167.  
  168. h2{
  169. font-family:{font:Body font};
  170. font-size:{select:Body font size};
  171. line-height: -moz-calc({select:Body font size} + 3px);
  172. line-height: -webkit-calc({select:Body font size} + 3px);
  173. line-height: -o-calc({select:Body font size} + 3px);
  174. line-height: calc({select:Body font size} + 3px);
  175. }
  176.  
  177. /* Previous/Next */
  178.  
  179. h3{
  180. font-family:{select:Title Font};
  181. font-size:23px;
  182. line-height:25px;
  183. font-weight:normal;
  184. }
  185.  
  186. /* Links */
  187.  
  188. a:link, a:active, a:visited{
  189. -webkit-transition: all .7s ease;
  190. -moz-transition: all .7s ease;
  191. -o-transition: all .7s ease;
  192. transition: all .7s ease;
  193. color:{color:Link};
  194. text-decoration:none;
  195. }
  196.  
  197. a:hover {
  198. color: {color:Hover};
  199. }
  200.  
  201. a img{border: 0px;}
  202.  
  203. ul, ol, li{ margin:5px 10px; padding:0px;}
  204.  
  205. {block:IfFadedImages}
  206. img{
  207. -webkit-transition: opacity 0.8s linear;
  208. -moz-transition: opacity 0.8s linear;
  209. -o-transition: opacity 0.8s linear;
  210. -ms-transition: opacity 0.8s linear;
  211. opacity: 0.60;
  212. }
  213. img:hover{
  214. -webkit-transition: opacity 0.8s linear;
  215. -moz-transition: opacity 0.8s linear;
  216. -o-transition: opacity 0.8s linear;
  217. -ms-transition: opacity 0.8s linear;
  218. opacity: 1;
  219. }
  220. {/block:IfFadedImages}
  221.  
  222. {block:IfMonochromeImages}
  223. img{
  224. -webkit-filter: grayscale(1);
  225. -webkit-transition: all 0.5s ease-in-out;
  226. -moz-transition: all 0.5s ease-in-out;
  227. -o-transition: all 0.5s ease-in-out;
  228. -ms-transition: all 0.5s ease-in-out;
  229. transition: all 0.5s ease-in-out;
  230. }
  231.  
  232. img:hover{
  233. filter: none;
  234. -webkit-filter: grayscale(0);
  235. -webkit-transition: all 0.2s ease-in-out;
  236. -moz-transition: all 0.2s ease-in-out;
  237. -o-transition: all 0.2s ease-in-out;
  238. }
  239. {/block:IfMonochromeImages}
  240.  
  241. /* Bold and italic */
  242.  
  243. b, strong {color:{color:Bold};}
  244. i, em {color:{color:Italic};}
  245.  
  246. /* Blockquote */
  247.  
  248. blockquote{
  249. padding:0px 0px 2px 5px;
  250. margin:0px 0px 2px 10px;
  251. border-left: 1px solid {color:Borders};
  252. }
  253.  
  254. /* Text selection */
  255.  
  256. ::-moz-selection {
  257. background: {color:Borders};
  258. color: {color:Scrollbar};
  259. }
  260.  
  261. ::selection {
  262. background: {color:Borders};
  263. color: {color:Scrollbar};
  264. }
  265.  
  266. /* Webkit scrollbar */
  267.  
  268. ::-webkit-scrollbar {
  269. width: 10px;
  270. height: 10px;
  271. }
  272. ::-webkit-scrollbar-button {
  273. width: 0px;
  274. height: 0px;
  275. }
  276. ::-webkit-scrollbar-thumb {
  277. background: {color:Scrollbar};
  278. border: 2px solid {color:Borders};
  279. border-radius: 0px;
  280. }
  281.  
  282. ::-webkit-scrollbar-track {
  283. background: {color:Scrollbar};
  284. border: 4px solid {color:Borders};
  285. border-radius: 0px;
  286. }
  287.  
  288. ::-webkit-scrollbar-corner {
  289. background: transparent;
  290. }
  291.  
  292. /* Tooltips */
  293.  
  294. #s-m-t-tooltip {
  295. max-width:300px;
  296. z-index:10000000;
  297. margin:24px 14px 7px 12px;
  298. padding:8px;
  299. color:{color:Link};
  300. background:{color:Post background};
  301. border:1px solid {color:Borders};
  302. font-size:13px;
  303. line-height:16px;
  304. }
  305.  
  306. /* -------- IMPORTANT! DO NOT TOUCH ------- */
  307.  
  308. * { box-sizing: border-box; }
  309.  
  310. html {
  311. min-height: 100%;
  312. height: 100%;
  313. }
  314.  
  315. body,
  316. .wrapper {
  317. height: 100%;
  318. overflow: hidden;
  319. }
  320.  
  321. .main,
  322. .sidebar {
  323. position: relative;
  324. padding: 2em;
  325. float: left;
  326. }
  327.  
  328. .main {
  329. position: relative;
  330. height: 100%;
  331. bottom: 0;
  332. top: 0;
  333. width: 50%;
  334. background: {color:Background};
  335. background-image:url({image:Background});
  336. margin-left: 25%;
  337. overflow-y:auto;
  338. }
  339.  
  340. .sidebar {
  341. position: relative;
  342. height: 100%;
  343. width: 25%;
  344. }
  345.  
  346. .sidebar.left {
  347. margin-left: -75%;
  348. background:{color:Left sidebar background};
  349. border-right:9px solid {color:Borders};
  350. overflow:hidden;
  351. }
  352.  
  353. .sidebar.right {
  354. float: right;
  355. background:{color:Right sidebar background};
  356. }
  357.  
  358. .btn {
  359. position: absolute;
  360. display: none;
  361. top: .5em;
  362. padding: 1em 1em 1em 1.2em;
  363. width: auto;
  364. line-height: 1;
  365. text-decoration: none;
  366. color: #004f97;
  367. }
  368.  
  369. .btn span {
  370. display: block;
  371. position: absolute;
  372. left: .1em;
  373. top: 5px;
  374. font-size: 2.5em;
  375. line-height: .5;
  376. }
  377.  
  378. .btn.right span {
  379. left: auto;
  380. right: 0;
  381. }
  382.  
  383. .btn.left { left: 1.5em; }
  384.  
  385. .btn.right {
  386. right: 1.5em;
  387. padding-right: 1.2em;
  388. padding-left: 1em;
  389. }
  390.  
  391. @media all and (max-width: 750px) {
  392.  
  393. .main,
  394. .sidebar { padding: 3.5em 2em; }
  395.  
  396. .btn { display: block; }
  397.  
  398. .main {
  399. position: relative;
  400. width: 100%;
  401. float: none;
  402. right: 0;
  403. margin: 0;
  404. transition: .5s left ease, .5s right ease;
  405. box-shadow: 0 0 10px rgba(0,0,0,.5);
  406. z-index: 5;
  407. }
  408.  
  409. .right .main,
  410. .right .sidebar.left {
  411. right: 16em;
  412. left: auto;
  413. }
  414.  
  415. .left .main,
  416. .left .sidebar.right {
  417. left: 16em;
  418. right: auto;
  419. }
  420.  
  421. .sidebar {
  422. position: absolute;
  423. float: none;
  424. width: 16em;
  425. height: 100%;
  426. margin: 0;
  427. right: 0;
  428. top: 0;
  429. z-index: 1;
  430. transition: .5s right ease .5s left ease;
  431. }
  432.  
  433. .sidebar.left {
  434. left: 0;
  435. right: auto;
  436. margin-left: 0;
  437. }
  438. }
  439.  
  440. /* -------- POSTS AND ENTRIES ------- */
  441.  
  442. #posts {
  443. width:95%;
  444. margin-top:0px;
  445. z-index:99;
  446. margin-left:auto;
  447. margin-right:auto;
  448. background:transparent;
  449. margin-right:auto;
  450. position:relative;
  451. overflow-y: hidden;
  452. }
  453.  
  454. .entry {
  455. float:left;
  456. display: block;
  457. margin-top:20px;
  458. margin-bottom:10px;
  459. overflow:hidden;
  460. width:100%;
  461. padding:10px;
  462. border:5px solid {color:Borders};
  463. background:{color:Post background};
  464. }
  465.  
  466. #entry * {max-width:100%;}
  467.  
  468. /* -------- LEFT SIDEBAR ------- */
  469.  
  470. /* Blog title */
  471.  
  472. #blogtitle{
  473. margin-top:15px;
  474. margin-left:auto;
  475. margin-right:auto;
  476. text-align:center;
  477. font-family:{select:Title Font};
  478. font-size:{select:Title font size};
  479. line-height: -moz-calc({select:Title font size} + 3px);
  480. line-height: -webkit-calc({select:Title font size} + 3px);
  481. line-height: -o-calc({select:Title font size} + 3px);
  482. line-height: calc({select:Title font size} + 3px);
  483. color:{color:Blog Title};
  484. letter-spacing:2px;
  485. height:30px;
  486. text-shadow: 1px 0px {color:Borders},
  487. }
  488.  
  489. #blogtitle:hover{
  490. font-size:23px;
  491. color: {color:Hover};
  492. }
  493.  
  494. #desc{
  495. position:relative;
  496. width:100%;
  497. max-height:200px;
  498. color:{color:Description};
  499. padding-top:10px;
  500. margin-top:0px;
  501. margin-left:-2px;
  502. text-align:center;
  503. overflow:hidden;
  504. overflow-y:auto;
  505. }
  506.  
  507. #desc:first-letter{
  508. font-family:{select:Title Font};
  509. font-size:200%;
  510. color:{color:First letter};
  511. }
  512.  
  513. /* Search box */
  514.  
  515. .search{
  516. margin-left:auto;
  517. margin-right:auto;
  518. width:100%;
  519. }
  520.  
  521. .search i{
  522. position:absolute;
  523. margin-left:-23px;
  524. margin-top:5px;
  525. font-size:15px;
  526. color:{color:Icon};
  527. }
  528.  
  529. /* Sidebar images */
  530.  
  531. #sidebarimage {
  532. position:relative;
  533. margin:auto;
  534. margin-top:20px;
  535. width:180px;
  536. height:228px;
  537. background:url('http://i59.tinypic.com/29eiyaf.jpg');
  538. }
  539.  
  540. #sidebarimage img {
  541. width:130px;
  542. height:130px;
  543. margin-top:50px;
  544. margin-left:25px;
  545. border:5px {color:Borders} double;
  546. border-radius:130px;
  547. }
  548.  
  549. /* Icons */
  550.  
  551. #icons{
  552. position:relative;
  553. width:100%;
  554. margin-top:25px;
  555. margin-left:auto;
  556. margin-right:auto;
  557. text-align:center;
  558. }
  559.  
  560. #icons i{
  561. color:{color:Icon};
  562. display:inline-block;
  563. padding:5px;
  564. margin-left:3px;
  565. margin-right:3px;
  566. font-size:15px;
  567. line-height:15px;
  568. border:1px solid {color:Borders};
  569. }
  570.  
  571. #icons i:hover, #social i:hover{
  572. background:{color:Borders};
  573. }
  574.  
  575. /* Links */
  576.  
  577. #links{
  578. position:relative;
  579. width:100%;
  580. margin-left:auto;
  581. margin-right:auto;
  582. margin-top:10px;
  583. text-align:center;
  584. }
  585.  
  586. #links a{
  587. display:inline-block;
  588. padding:5px;
  589. font-size:22px;
  590. line-height:22px;
  591. text-align:center;
  592. color:{color:Link};
  593. font-family:{select:Title Font};
  594. letter-spacing:1px;
  595. }
  596.  
  597. #links a:hover{
  598. background: {color:Borders};
  599. -webkit-transition: all .7s ease-in-out;
  600. -moz-transition: all .7s ease-in-out;
  601. -o-transition: all .7s ease-in-out;
  602. transition: all .7s ease-in-out;
  603. }
  604.  
  605. /* Social icons */
  606.  
  607. #social{
  608. position:relative;
  609. width:100%;
  610. height:auto;
  611. margin-top:10px;
  612. margin-left:0px;
  613. text-align:center;
  614. overflow:hidden;
  615. }
  616.  
  617. #social i{
  618. color:{color:Icon};
  619. display:inline-block;
  620. padding:5px;
  621. margin-left:3px;
  622. margin-right:3px;
  623. font-size:15px;
  624. line-height:15px;
  625. border:1px solid {color:Borders};
  626. }
  627.  
  628. /* Borders */
  629.  
  630. .leftborder{
  631. position:absolute;
  632. margin-top:-20px;
  633. margin-left:-25px;
  634. width:100px;
  635. height:100px;
  636. background:url('http://i62.tinypic.com/9rhrp0.jpg');
  637. background-repeat:no-repeat;
  638. }
  639.  
  640. .rightborder{
  641. position:absolute;
  642. margin-top:-20px;
  643. right:0px;
  644. width:120px;
  645. height:100px;
  646. background:url('http://i59.tinypic.com/zx39s6.jpg');
  647. background-repeat:no-repeat;
  648. }
  649.  
  650. /* DividerS */
  651.  
  652. .divider{
  653. height:46px;
  654. margin-top:10px;
  655. margin-left:auto;
  656. margin-right:auto;
  657. background:url('http://i62.tinypic.com/2e207it.jpg');
  658. background-repeat: no-repeat;
  659. background-position: center;
  660. }
  661.  
  662. .divider2{
  663. height:27px;
  664. margin-top:10px;
  665. margin-left:auto;
  666. margin-right:auto;
  667. background:url('http://i58.tinypic.com/2vvjsev.jpg');
  668. background-repeat: no-repeat;
  669. background-position: center;
  670. }
  671.  
  672. /* ----------------------- POST STYLES ----------------------------- */
  673.  
  674. /* Quote posts */
  675.  
  676. .quote {
  677. font-family:{select:Title Font};
  678. font-size:{select:Title font size};
  679. line-height: -moz-calc({select:Title font size} + 3px);
  680. line-height: -webkit-calc({select:Title font size} + 3px);
  681. line-height: -o-calc({select:Title font size} + 3px);
  682. line-height: calc({select:Title font size} + 3px);
  683. color:{color:Italic};
  684. height:auto;
  685. margin:10px;
  686. padding:5px;
  687. text-align:center;
  688. letter-spacing:1px;
  689. }
  690.  
  691. .source {
  692. font-family:{font:Body font};
  693. font-size:{select:Body font size};
  694. line-height: -moz-calc({select:Body font size} + 3px);
  695. line-height: -webkit-calc({select:Body font size} + 3px);
  696. line-height: -o-calc({select:Body font size} + 3px);
  697. line-height: calc({select:Body font size} + 3px);
  698. height:auto;
  699. margin-top:10px;
  700. margin-left:10px;
  701. margin-right:10px;
  702. margin-bottom:5px;
  703. padding:5px;
  704. text-align:right;
  705. letter-spacing:1px;
  706. }
  707.  
  708. /* Link posts */
  709.  
  710. #linktitle{
  711. font-family:{select:Title Font};
  712. font-size:{select:Title font size};
  713. line-height: -moz-calc({select:Title font size} + 3px);
  714. line-height: -webkit-calc({select:Title font size} + 3px);
  715. line-height: -o-calc({select:Title font size} + 3px);
  716. line-height: calc({select:Title font size} + 3px);
  717. width:96%;
  718. padding:2%;
  719. border:1px solid {color:Borders};
  720. }
  721.  
  722. #linktitle a{
  723. color:{color:Link};
  724. }
  725.  
  726. #linktitle i{
  727. color:{color:Icon};
  728. }
  729.  
  730. /* Chat posts */
  731.  
  732. .chat .line {
  733. color: {color:Text};
  734. padding:2px;
  735. }
  736.  
  737. .label {
  738. color:{color:Bold};
  739. font-size:20px;
  740. line-height:22px;
  741. font-family:{select:Title Font};
  742. padding-right:2px;
  743. }
  744.  
  745. /* Audio posts */
  746.  
  747. .album img{
  748. max-width:65px;
  749. margin-left:5px;
  750. float:left;
  751. margin-top:0px;
  752. z-index:10;
  753. border: 5px solid {color:Borders};
  754. }
  755.  
  756. .audio{
  757. position:absolute;
  758. width:185px;
  759. min-height:90px;
  760. margin-left:80px;
  761. float:left;
  762. padding:5px;
  763. margin-top:-5px;
  764. z-index:10;
  765. font-size:12px;
  766. overflow:hidden;
  767. }
  768.  
  769. .play{
  770. position:absolute;
  771. margin:25px;
  772. max-width:25px;
  773. max-height:25px;
  774. overflow:hidden;
  775. opacity:0.7;
  776. }
  777.  
  778. /* Ask Posts */
  779.  
  780. .bubble {
  781. position: relative;
  782. height:auto;
  783. margin:5px;
  784. padding:5px;
  785. border: 1px solid {color:Borders};
  786. z-index:1;
  787. min-height:50px;
  788. }
  789.  
  790. .asker img {
  791. float:left;
  792. border:1px solid {color:Borders};
  793. margin-right:5px;
  794. z-index:2000;
  795. border-radius:100%;
  796. }
  797.  
  798. /* ----------------------- POST INFO ----------------------------- */
  799.  
  800. .info {
  801. width:100%;
  802. margin-top:0px;
  803. margin-left:0px;
  804. font-size:12px;
  805. height:20px;
  806. letter-spacing:1px;
  807. line-height:20px;
  808. color:{color:Link};
  809. text-transform:uppercase;
  810. }
  811.  
  812. .info a{
  813. color:{color:Link};
  814. }
  815.  
  816. .info i{
  817. color:{color:Icon};
  818. }
  819.  
  820. .info a:hover {
  821. color:{color:Hover};
  822. }
  823.  
  824. /* Like and reblog buttons */
  825.  
  826. .like_and_reblog_buttons {
  827. position:absolute;
  828. float:right;
  829. right:10px;
  830. margin-top:-20px;
  831. margin-bottom:15px;
  832. z-index:200000;
  833. border: 0px solid #e8e8e8;
  834. border-radius: 3px;
  835. list-style: none;
  836. }
  837.  
  838. .like_and_reblog_buttons li {
  839. float:right;
  840. margin: 5px 5px;
  841. height: 15px;
  842. }
  843.  
  844. .like_and_reblog_buttons li:first-child {
  845. border-right: 0px solid #e8e8e8;
  846. }
  847.  
  848. /* Post notes style */
  849.  
  850. .notes img{
  851. width:15px;
  852. position:relative;
  853. top:3px;
  854. margin-right:5px;
  855. border:1px solid {color:Borders};
  856. border-radius:60px;
  857. }
  858.  
  859. .notes li{
  860. list-style:none;
  861. }
  862.  
  863. /* Pagination */
  864.  
  865. .jump_page {
  866. padding: 4px 8px;
  867. border: 2px solid {color:Borders};
  868. background:{color:Left sidebar background};
  869. font-size:11px;
  870. text-decoration:none;
  871. }
  872.  
  873. .current_page, .jump_page:hover {
  874. padding: 4px 8px;
  875. border: 2px solid {color:Borders};
  876. background:{color:Right sidebar background};
  877. font-size:11px;
  878. text-decoration:none;
  879. }
  880.  
  881. .pagination a{
  882. color:#000;
  883. }
  884.  
  885. /* ----------------------- CREDITS ----------------------------- */
  886.  
  887. #credits {
  888. position:fixed;
  889. right:10px;
  890. bottom:10px;
  891. z-index:100000;
  892. }
  893.  
  894. #credits img{
  895. border:3px solid {color:Borders};
  896. }
  897.  
  898. /* ------------------------ CUSTOM CSS ----------------------------- */
  899.  
  900.  
  901. {CustomCSS}
  902.  
  903.  
  904. </style>
  905.  
  906. <script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
  907.  
  908. <script>
  909. jQuery(function ($) {
  910. $('.btn.left').click(function (event) {
  911. event.preventDefault();
  912. $('body').toggleClass('left');
  913. });
  914. $('.btn.right').click(function (event) {
  915. event.preventDefault();
  916. $('body').toggleClass('right');
  917. });
  918. });
  919. </script>
  920.  
  921. {block:IndexPage}
  922. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  923. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  924.  
  925. <script type="text/javascript">
  926. $(window).load(function(){
  927. var $wall = $('#posts');
  928. $wall.imagesLoaded(function(){
  929. $wall.masonry({
  930. itemSelector: '.entry, .entry_photo',
  931. isAnimated : false
  932. });
  933. });
  934.  
  935. $wall.infinitescroll({
  936. navSelector : '#pagination',
  937. nextSelector : '#pagination a',
  938. itemSelector : '.entry, .entry_photo',
  939. bufferPx : 2000,
  940. debug : false,
  941. errorCallback: function() {
  942. $('#infscr-loading').fadeOut('normal');
  943. }},
  944. function( newElements ) {
  945. var $newElems = $( newElements );
  946. $newElems.hide();
  947. $newElems.imagesLoaded(function(){
  948. $wall.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
  949. });
  950. }); $('#posts').show(500);
  951. });
  952. </script>
  953. {/block:IndexPage}
  954.  
  955. <meta charset="utf-8">
  956. <title>{Title}{block:TagPage} - {Tag} {/block:TagPage} {block:SearchPage} - {lang:Search results for SearchQuery}{/block:SearchPage}{block:PostSummary}- {PostSummary} {/block:PostSummary}</title>
  957. {block:Description}
  958. <meta name="description" content="{MetaDescription}" />
  959. {/block:Description}
  960. <link rel="shortcut icon" href="{Favicon}">
  961. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  962. </head>
  963.  
  964. <body>
  965.  
  966. <div class="wrapper">
  967.  
  968. <!-- Main content section -->
  969.  
  970. <div class="main">
  971.  
  972. <!-- Toggle links -->
  973.  
  974. <a href="#" class="btn left"><span class="entypo-left-open"></span><i class="fa fa-bars"></i> </a>
  975.  
  976. <a href="#" class="btn right"><span class="entypo-right-open"></span><i class="fa fa-bars"></i> </a>
  977.  
  978. <!-- Main content -->
  979.  
  980. <div id="posts">
  981. {block:Posts}
  982.  
  983. <div class="entry">
  984.  
  985. {block:Text}
  986. {block:Title}
  987. <a href="{Permalink}">
  988. <h1>{Title}</h1></a>
  989. {/block:Title}
  990. {Body}
  991. {/block:Text}
  992.  
  993. {block:Photo}
  994. <img src="{PhotoURL-500}"
  995. width="100%"/>
  996. {/block:Photo}
  997.  
  998. {block:Photoset}
  999. <center>
  1000. {Photoset}
  1001. </center>
  1002. {/block:Photoset}
  1003.  
  1004. {block:Panorama}
  1005. {LinkOpenTag}
  1006. <img src="{PhotoURL-Panorama}"/>
  1007. {LinkCloseTag}
  1008. {/block:Panorama}
  1009.  
  1010. {block:Quote}
  1011. <div class="quote">
  1012. <i class="fa fa-quote-left"></i><br>
  1013. {Quote}
  1014. {block:Source}
  1015. <div class="source">-{Source}
  1016. </div>{/block:Source}</div>
  1017. {/block:Quote}
  1018.  
  1019. {block:Link}
  1020. <a href="{URL}"
  1021. class="linkpost"
  1022. target="_blank">
  1023. <h1><i class="fa fa-link"></i>
  1024. {Name} &raquo;</h1></a>
  1025. {block:Description}
  1026. {Description}
  1027. {/block:Description}
  1028. {/block:Link}
  1029.  
  1030. {block:Chat}
  1031. {block:Title}<h1>{Title}</h1>{/block:Title}
  1032. <div class="chat">
  1033. {block:Lines}<div class="chat"><div class="line {Alt}">
  1034. <div class="{Alt} user_{UserNumber}">
  1035. {block:Label}
  1036. <span class="label">
  1037. <span style="text-transform:capitalize;
  1038. letter-spacing:1px">
  1039. {Label}
  1040. </span></span>
  1041. {/block:Label}
  1042. {Line}</div>
  1043. </div></div>
  1044. {/block:Lines}
  1045. </div>
  1046. {/block:Chat}
  1047.  
  1048. {block:Audio}
  1049. <div class="album">{block:AlbumArt}<img src="{AlbumArtURL}">
  1050. {block:AlbumArt}
  1051. <div class="play">
  1052. {AudioPlayerWhite}
  1053. </div>
  1054. </div>
  1055. <div class="audio">
  1056. {block:TrackName}<i class="fa fa-microphone"></i> {TrackName}{/block:TrackName}
  1057. {block:Artist}<br><i class="fa fa-user"></i> {Artist}{/block:Artist}
  1058. {block:Album}<br><i class="fa fa-music"></i> {Album}{/block:Album}
  1059. {block:PlayCount}<br><i class="fa fa-heart"></i> {PlayCount}{/block:PlayCount}</div>
  1060. <br><br><br><br><br>
  1061. {/block:Audio}
  1062.  
  1063. {block:Video}
  1064. <center>
  1065. {VideoEmbed-500}
  1066. </center>
  1067. {/block:Video}
  1068.  
  1069. {block:Answer}
  1070. <div class="bubble">
  1071. <div class="asker">
  1072. <img src="{AskerPortraitURL-48}">
  1073. </div>
  1074. <span></span>{Asker}:
  1075. {Question}</div>
  1076. {Answer}
  1077. {/block:Answer}
  1078.  
  1079. {block:IndexPage}
  1080. {block:IfShowCaptions}
  1081. {block:Caption}
  1082. <h2>{Caption}</h2>
  1083. {/block:Caption}
  1084. {/block:IfShowCaptions}
  1085. {/block:IndexPage}
  1086.  
  1087. <div class="divider2"></div>
  1088.  
  1089. {block:Date}
  1090. <div class="info">
  1091.  
  1092. <a href="{Permalink}">
  1093. <i class="fa fa-clock-o"></i>
  1094. {TimeAgo}</a>
  1095. {block:NoteCount}
  1096. <i class="fa fa-heart-o"></i>
  1097. {NoteCountWithLabel}
  1098. {/block:NoteCount}
  1099.  
  1100. <ul class="like_and_reblog_buttons">
  1101. <li>{ReblogButton size="15"}</li>
  1102. <li>{LikeButton size="15"}</li>
  1103. </ul>
  1104.  
  1105. {block:IndexPage}
  1106. {block:IfShowTags}
  1107. {block:HasTags}
  1108. {block:Tags}
  1109. <a href="{TagURL}">
  1110. <i class="fa fa-tag"></i>
  1111. {Tag}</a> &nbsp;
  1112. {/block:Tags}
  1113. {/block:HasTags}
  1114. {/block:IfShowTags}
  1115. {/block:IndexPage}
  1116.  
  1117. </div>
  1118. <!--END INFO -->
  1119. </div>
  1120. {/block:Date}
  1121.  
  1122. {block:PermalinkPage}
  1123. {block:Caption}
  1124. <h2>{Caption}</h2>
  1125. {/block:Caption}
  1126.  
  1127. {block:HasTags}
  1128. {block:Tags}
  1129. <a href="{TagURL}">
  1130. <i class="fa fa-tag"></i>
  1131. {Tag}</a> &nbsp;
  1132. {/block:Tags}
  1133. {/block:HasTags}
  1134.  
  1135. <!-- Permalink page -->
  1136. {block:PermalinkPage}
  1137. <div class="notes">
  1138. {block:Caption}
  1139. <h2>{Caption}</h2>
  1140. {/block:Caption}
  1141.  
  1142. {block:HasTags}
  1143. <br>{block:Tags}
  1144. Tagged as:
  1145. <a href="{TagURL}">
  1146. <i class="fa fa-tag"></i>
  1147. {Tag}</a> &nbsp;
  1148. {/block:Tags}
  1149. {/block:HasTags}
  1150.  
  1151. {block:PermalinkPagination}
  1152. <center><br>
  1153. {block:PreviousPost}
  1154. <a href="{PreviousPost}">
  1155. <h3>&laquo; Previous Post – </a></h3>
  1156. {/block:PreviousPost}
  1157.  
  1158. {block:NextPost}
  1159. <a href="{NextPost}">
  1160. <h3>Next Post &raquo;</a></h3>
  1161. {/block:NextPost}
  1162. </center>
  1163. {/block:PermalinkPagination}
  1164.  
  1165. {block:PostNotes}
  1166. <h1>Post notes:</h1>
  1167. <div style="text-align:left; margin-left:0px; max-height: 200px; width:100%; overflow: auto; overflow-x: hidden;">
  1168. {PostNotes}</div>
  1169. {/block:PostNotes}
  1170.  
  1171. {/block:PermalinkPage}
  1172.  
  1173. </div>
  1174.  
  1175. <!--End entry-->
  1176.  
  1177. {/block:Posts}
  1178. </div>
  1179.  
  1180. <center><br>
  1181. {block:Pagination}
  1182. <div class="pagination">
  1183. {block:PreviousPage}
  1184. <a href="{PreviousPage}"
  1185. class="jump_page">&laquo;</a>
  1186. {/block:PreviousPage}
  1187. {block:JumpPagination length="5"}
  1188. {block:CurrentPage}
  1189. <span class="current_page">
  1190. {PageNumber}</span>
  1191. {/block:CurrentPage}
  1192. {block:JumpPage}
  1193. <a class="jump_page" href="{URL}">{PageNumber}</a>
  1194. {/block:JumpPage}
  1195. {/block:JumpPagination}
  1196. {block:NextPage}
  1197. <a href="{NextPage}"
  1198. class="jump_page">&raquo;</a>
  1199. {/block:NextPage}
  1200. </div>
  1201. {/block:Pagination}
  1202. </center><br>
  1203.  
  1204. </div>
  1205.  
  1206. <!-- Left sidebar -->
  1207.  
  1208. <div class="sidebar left">
  1209.  
  1210. <div class="leftborder"></div>
  1211.  
  1212. <div id="sidebarimage"><img src="{image:Sidebar image 1}"></div>
  1213.  
  1214. <div id="blogtitle">{Title}</div>
  1215.  
  1216. <div class="divider2"></div>
  1217.  
  1218. <div id="desc">{description}</div>
  1219.  
  1220. {block:IfShowSearchBox}
  1221. <div class="search">
  1222. <div class="divider2"></div><br>
  1223. <form action="/search" method="get">
  1224. <input type="text" name="q" value="Search..." style="width:100%; padding-left:10px; height:25px; border:1px solid {color:Borders}; background:transparent; color:{color:Description}; font-size: 13px; margin-left:0px;"/><span><i class="fa fa-search"></i></span></form>
  1225. </div>
  1226. {/block:IfShowSearchBox}
  1227.  
  1228. <div class="divider"></div>
  1229.  
  1230. </div>
  1231.  
  1232. <!-- Right sidebar -->
  1233.  
  1234. <div class="sidebar right">
  1235.  
  1236. <div class="rightborder"></div>
  1237.  
  1238. <div id="sidebarimage"><img src="{image:Sidebar image 2}"></div>
  1239.  
  1240. <div id="icons">
  1241. <a href="/"><i class="fa fa-home"></i></a>
  1242. <a href="/ask"><i class="fa fa-envelope"></i></a>
  1243. <a href="/submit"><i class="fa fa-pencil"></i></a>
  1244. <a href="/archive"><i class="fa fa-clock-o"></i></a>
  1245. </div>
  1246.  
  1247. <div class="divider2"></div>
  1248.  
  1249. <div id="links">
  1250. <a href="{text:Link 1 url}">{text:Link 1}</a>
  1251. <a href="{text:Link 2 url}">✦ {text:Link 2}</a>
  1252. <a href="{text:Link 3 url}">✦ {text:Link 3}</a>
  1253. <a href="{text:Link 4 url}">✦ {text:Link 4}</a>
  1254. <a href="{text:Link 5 url}">✦ {text:Link 5}</a>
  1255. </div>
  1256.  
  1257. {block:IfShowSocialIcons}
  1258. <div id="social">
  1259.  
  1260. <div class="divider2"></div><br>
  1261.  
  1262. {block:IfFacebook}<a href="{text:Facebook url}" target = "_blank" title="facebook"><i class="fa fa-facebook"></i></a>{/block:IfFacebook}
  1263. {block:IfTwitter}<a href="{text:Twitter url}" title="twitter"><i class="fa fa-twitter"></i></a>{/block:IfTwitter}
  1264. {block:IfFlickr}<a href="{text:Flickr url}" title="flickr"><i class="fa fa-flickr"></i></a>{/block:IfFlickr}
  1265. {block:IfGoogleplus}<a href="{text:Googleplus url}" title="google +"><i class="fa fa-deviantart"></i></a>{/block:IfGoogleplus}
  1266. {block:IfDeviantart}<a href="{text:Deviantart url}" title="google +"><i class="fa fa-google-plus"></i></a>{/block:IfDeviantart}
  1267.  
  1268. </div>
  1269. {/block:IfShowSocialIcons}
  1270.  
  1271. <div class="divider"></div>
  1272.  
  1273. </div>
  1274.  
  1275. <!--End right sidebar-->
  1276.  
  1277. </body>
  1278.  
  1279. <a href="http://www.borntobewildthemes.tumblr.com" title="Theme BAROQUE by borntobewildthemes"><div id="credits">
  1280. <img src="http://i57.tinypic.com/301g6eg.jpg"></div></a>
  1281.  
  1282.  
  1283. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement