API tools faq
paste
Advertisement
csloani

PAGE 03 | PRESCRIPTION

csloani
Feb 5th, 2015
3,738
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.60 KB | None | 0 0
raw download clone embed print report
  1. <html>
  2. <!------
  3.  
  4.  
  5. ---
  6. --
  7. ---- P R E S C R I P T I O N
  8. ---
  9. ---- iliyon
  10. --
  11. ---
  12.  
  13.  
  14. -------->
  15. <head><link rel="shortcut icon" href="{Favicon}"><link href='http://static.tumblr.com/wb7siqo/Omqnia97g/cssnormalize.css' rel='stylesheet' type='text/css'><link href='https://fonts.googleapis.com/css?family=Karla:400italic,400,700,700italic' rel='stylesheet' type='text/css'>
  16. <title>Prescription</title> <!-- CHANGE TITLE HERE -->
  17. <style type="text/css">
  18. body{
  19. font-family:Karla;
  20. color:#333; /* - Global text color - */
  21. background:#fff; /* - Background color - */
  22. font-size:1em;
  23. }
  24. ::-webkit-scrollbar{
  25. width:16px;
  26. height:16px;
  27. }
  28. ::-webkit-scrollbar-thumb {
  29. height:6px;
  30. border:4px solid rgba(0, 0, 0, 0);
  31. background-clip: padding-box;
  32. -webkit-border-radius: 14px;
  33. -webkit-box-shadow: inset 0px 0px 3px #aaa;
  34. background-color: rgba(255,255,255, 0.5);
  35. }
  36. ::-webkit-scrollbar-button {
  37. width: 0; height: 0; display: none;
  38. }
  39. ::-webkit-scrollbar-corner{
  40. background-color: transparent;
  41. }
  42. a{
  43. color:#aaa;
  44. text-decoration:none;
  45. }
  46. a:hover{
  47. color:#333;
  48. }
  49. b{
  50. font-weight:700;
  51. }
  52. i{
  53. font-style:italic;
  54. }
  55. small{
  56. font-size:80%;
  57. }
  58. big{
  59. font-size:120%;
  60. }
  61. p{
  62. margin:1em 0em;
  63. }
  64. .holder{
  65. width:500px; /* - Container width - */
  66. position:absolute;
  67. left:0px;
  68. right:0px;
  69. margin:auto;
  70. top:120px;
  71. }
  72. .bloghead{
  73. font-size:2em; /* - Title font size - */
  74. font-weight:700;
  75. border-bottom:3px #333 solid; /* - Adjust border properties - */
  76. padding-bottom:2px;
  77. max-width:150px; /* - Adjust width if necessary. Mind the .desc too - */
  78. display:inline-block;
  79. vertical-align:middle;
  80. }
  81. .desc{
  82. display:inline-block;
  83. vertical-align:middle;
  84. max-width:350px; /* - Adjust width if necessary. Mind the .bloghead too - */
  85. font-size:.7em;
  86. line-height:1.2em;
  87. box-sizing:border-box;
  88. padding-left:30px; /* - Adjust if necessary - */
  89. }
  90. /* - FILL-IN-THE-BLANKS - */
  91. .spacer{
  92. margin-top:40px;
  93. }
  94. .label{
  95. display:inline-block;
  96. font-size:.7em;
  97. text-transform:uppercase;
  98. vertical-align:top;
  99. letter-spacing:2px;
  100. max-width:120px;
  101. position:relative;
  102. top:.45em;
  103. font-weight:400; /* - Replace with '700' if you want bolded text - */
  104. }
  105. .fineliner{ /* - Content field - */
  106. display:inline-block;
  107. font-size:.8em;
  108. padding-left:7px;
  109. max-width:360px;
  110. line-height:1.6em;
  111. }
  112. .data{ /* - Container - */
  113. padding-bottom:7px;
  114. border-bottom:1px #ccc solid;
  115. margin-bottom:20px;
  116. }
  117. /* - Bot Links - */
  118. .not{
  119. margin:30px 0px;
  120. font-size:.7rem;
  121. }
  122. .not a{
  123. margin-right:10px;
  124. }
  125. </style>
  126. </head>
  127. <body>
  128. <section class="holder">
  129. <section class="bloghead">Untitled</section> <!-- YOUR TITLE HERE -->
  130. <!-- QUOTE HERE -->
  131. <section class="desc">Vague quote here. Obliterate if unnecessary. Gotta lotta Plasma TV you wanna be me.</section>
  132. <section class="spacer"></section>
  133.  
  134. <!-- BEGIN CONTENT -->
  135.  
  136. <!-- NOTE: PLEASE FOLLOW THE EXACT SAME PATTERN AS SHOWN BELOW -->
  137. <!-- NAME --><section class="data"> <!-- ALWAYS WRAP IN THIS CLASS. -->
  138. <section class="label">name:</section><!--
  139. --><section class="fineliner">John Smith</section>
  140. </section>
  141.  
  142. <!-- DOB --><section class="data">
  143. <section class="label">date of birth:</section><!--
  144. --><section class="fineliner">January 01, 1970</section>
  145. </section>
  146.  
  147. <!-- AGE --><section class="data">
  148. <section class="label">age:</section><!--
  149. --><section class="fineliner">45</section>
  150. </section>
  151.  
  152.  
  153. <!-- LOCATION --><section class="data">
  154. <section class="label">location:</section><!--
  155. --><section class="fineliner">90.0000° S, 0.0000° W</section>
  156. </section>
  157.  
  158. <!-- LIKES --><section class="data">
  159. <section class="label">likes:</section><!--
  160. --><section class="fineliner">John likes anything obscure, just like his name.</section>
  161. </section>
  162.  
  163. <!-- ABOUT --><section class="data">
  164. <section class="label">about:</section><!--
  165. --><section class="fineliner">Short and sweet, long and elaborate. Your choice. Type helvetica. Abstraction urbanized prototype design thinking. Card-sorting usability testing paper prototype. Adobe retina. User-centered focus group. Resolution CSS persona measure sans-serif.</section>
  166. </section>
  167.  
  168. <!-- LINK SECTION -->
  169. <section class="not">
  170. <a href="/">Return</a>
  171. <a href="/ask">Contact</a>
  172. <a href="http://tumblr.com/">Dashboard</a>
  173. <a href="/">Some</a>
  174. <a href="/">More</a>
  175. <a href="http://iliyon.tumblr.com" target="_blank" style="float:right;">Theme</a>
  176. </section>
  177. </section>
  178. </body>
  179. </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!