SHARE
TWEET

earl grey

luna-ria Aug 21st, 2019 (edited) 66 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. [nobr]
  2.  
  3. [class name=titleslide]
  4.     width: 100%;
  5.     height: 300px;
  6.     font-family: Avenir;
  7. [/class]
  8.  
  9.  
  10. [class=tag]
  11.   background: #6f3fa6;
  12.    text-transform: uppercase;
  13.    padding: 0px 3px 0px 3px;
  14.    font-size: 9px;
  15.    letter-spacing: 1px;
  16.    display: inline-block;
  17.    color: white;
  18.    margin-top: 10px;
  19.    line-height: 16px;
  20. [/class]
  21.  
  22.  
  23. [class=gifs]
  24.     display: flex;
  25.     flex-direction: row;
  26.     padding-bottom: 15px;
  27. [/class]
  28.  
  29.  
  30. [class name=tab]
  31.     box-sizing: border-box;
  32.     text-align: center;
  33.     font-family: Avenir;
  34.     font-size: 15px;
  35.     color: #333;
  36.     background: #f8f8f8;
  37.     width: 66px;
  38.     padding: 10px;
  39.     padding-top: 20px;
  40.     padding-bottom: 20px;
  41.     text-transform: uppercase;
  42.     transition: all .5s ease-in-out;
  43.     border-left: 3px solid #f8f8f8;
  44.     border-right: 3px solid #f8f8f8;
  45.     transition: all .4s ease-in-out;
  46.     cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important;
  47.     [/class]
  48.  
  49.  
  50. [class name=selectedtab]
  51.     box-sizing: border-box;
  52.     text-align: center;
  53.     font-family: Avenir;
  54.     font-size: 15px;
  55.     color: #6f3fa6;
  56.     background: #f3f3f3;
  57.     width: 66px;
  58.     border-left: 3px solid #6f3fa6;
  59.     border-right: 3px solid #f3f3f3;
  60.     padding: 10px;
  61.     padding-top: 20px;
  62.     padding-bottom: 20px;
  63.     text-transform: uppercase;
  64.     transition: all .4s ease-in-out;
  65.     cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important;
  66.  
  67. [/class]
  68.  
  69.  
  70. [class name=tab state=hover]
  71.     background: #f3f3f3;
  72.     border-left: 3px solid #f3f3f3;
  73.     border-right: 3px solid #f3f3f3;
  74.     transition: all .4s ease-in-out;
  75.     cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important;
  76. [/class]
  77.  
  78.  
  79. [class name=selectedtab state=hover]
  80.     border-left: 3px solid #6f3fa6;
  81.     border-right: 3px solid #f3f3f3;
  82.     transition: all .4s ease-in-out;
  83.     cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important;
  84. [/class]
  85.  
  86.  
  87. [script class=tab on=click]
  88.     hide tabcontents
  89.     hide titleslide
  90.     removeClass selectedtab tab
  91.     set currentTab (getText)
  92.  
  93.     if (eq ${currentTab} 01) (addClass selectedtab tabone)
  94.     if (eq ${currentTab} 02) (addClass selectedtab tabtwo)
  95.     if (eq ${currentTab} 03) (addClass selectedtab tabthree)
  96.     if (eq ${currentTab} 04) (addClass selectedtab tabfour)
  97.     if (eq ${currentTab} 05) (addClass selectedtab tabfive)
  98.  
  99.     if (eq ${currentTab} 01) (show tabcontentsone)
  100.     if (eq ${currentTab} 02) (show tabcontentstwo)
  101.     if (eq ${currentTab} 03) (show tabcontentsthree)
  102.     if (eq ${currentTab} 04) (show tabcontentsfour)
  103.     if (eq ${currentTab} 05) (show tabcontentsfive)
  104. [/script]
  105.  
  106.  
  107.  
  108. [div=width: 500px; margin: auto; box-sizing: border-box; cursor: url(https://66.media.tumblr.com/232c090ebdd37ae4bc17adb54e1e0344/tumblr_inline_ol4nwhvSwg1uxxza6_75sq.png), auto!important;]
  109.  
  110. [div=display: flex; flex-direction: row; box-sizing: border-box; background: #f3f3f3; border-bottom: 3px solid #e6e6e6;]
  111. [div=flex: .55; padding: 15px;][div=border: 4px solid #fff; height: 90px; background: url(https://66.media.tumblr.com/22018ab842c0f3bc25f51217c4c64105/tumblr_pt6idrtBlT1qhae9n_500.jpg); background-size: cover;][/div][/div]
  112. [div=flex: 2;]
  113. [div=padding-left: 10px; padding-top: 30px; font-size: 25px; font-family: Avenir; color: #000; text-transform: uppercase; letter-spacing: 1px;]character name[/div]
  114. [div=padding-left: 10px; font-size: 12px; font-family: Avenir; color: #000; font-style: italic;]"You could put a character quote here."[/div]
  115. [/div][/div]
  116.  
  117.  
  118. [div=display: flex; flex-direction: row;]
  119. [div=flex: .3; background: #f7f7f7;]
  120. [div class="tab tabone"]01[/div]
  121. [div class="tab tabtwo"]02[/div]
  122. [div class="tab tabthree"]03[/div]
  123. [div class="tab tabfour"]04[/div]
  124. [div class="tab tabfive"]05[/div]
  125. [/div]
  126.  
  127.  
  128. [div=flex: 2; background: #f3f3f3;][div class=titleslide]
  129. [div=display: flex; flex-direction: row; font-size: 20px; box-sizing: border-box; width: 250px; margin: auto; padding-top: 110px;]
  130. [div=flex: .3; text-align: center; color: #fff; background: #000; font-weight: bold; padding: 8px;]a[/div]
  131. [div=flex: 2; text-align: center; color: #fff; text-transform: uppercase; background: #6f3fa6; font-weight: bold; letter-spacing: 5px; padding: 8px]title?[/div]
  132. [/div]
  133. [div=font-size: 13px; letter-spacing: 2px; text-align: center; text-transform: uppercase; width: 250px; color: #000; margin: auto; margin-top: 10px;]a subtitle?[/div][/div]
  134.  
  135.  
  136. [div class="tabcontents tabcontentsone" style="display: none;"][div=margin: 20px; height: 285px; overflow-y: auto; font-size: 10px; line-height: 22px; text-align: justify; color: #333;]
  137. [div class=gifs]
  138. [div=flex: 1; margin-right: 35px; margin-left: 30px; background: url(https://66.media.tumblr.com/b4a75cc31286d20b9e7a400e2b1e13e4/tumblr_inline_pmhfyvdHtF1vp79yq_500.gif); background-size: cover; background-position: 20% 50%; height: 80px;][/div]
  139. [div=flex: 1; margin-right: 35px; background: url(https://66.media.tumblr.com/eb79bc14280149762b195a9da9e7b63c/tumblr_inline_pmhfz2q1CF1vp79yq_500.gif); background-size: cover; background-position: 50% 50%; height: 80px;][/div]
  140. [div=flex: 1; margin-right: 30px; background: url(https://66.media.tumblr.com/52f21ac10cdcba6c38dbcf8f1e1dcc9d/tumblr_inline_pmhfzkodkM1vp79yq_500.gif); background-size: cover; background-position: 50% 50%; height: 80px;][/div]
  141. [/div]
  142.  
  143. [div class=tag]tag[/div] info
  144. [br][/br]
  145. [div class=tag]tag[/div] info
  146. [br][/br]
  147. [div class=tag]tag[/div] info
  148. [br][/br]
  149. [div class=tag]tag[/div] info
  150. [br][/br]
  151. [div class=tag]tag[/div] info
  152. [br][/br]
  153. [div class=tag]tag[/div] info
  154. [/div][/div]
  155.  
  156.  
  157. [div class="tabcontents tabcontentstwo" style="display: none;"][div=margin: 20px; height: 285px; overflow-y: auto; font-size: 10px; line-height: 22px; text-align: justify; color: #333;]
  158. [div class=gifs]
  159. [div=flex: 1; margin-right: 35px; margin-left: 30px; background: url(https://66.media.tumblr.com/ac431bb7d2630d438b395b7f563e9857/tumblr_inline_pmhg3lZKFN1vp79yq_500.gif); background-size: cover; background-position: 20% 50%; height: 80px;][/div]
  160. [div=flex: 1; margin-right: 35px; background: url(https://66.media.tumblr.com/1b8f5705956b435991e63a6d8d806086/tumblr_inline_pmhg4bh0AA1vp79yq_500.gif); background-size: cover; background-position: 50% 50%; height: 80px;][/div]
  161. [div=flex: 1; margin-right: 30px; background: url(https://66.media.tumblr.com/f539b96045ee7dabc060f3db99a3fe3f/tumblr_inline_pmhg3wdeHS1vp79yq_500.gif); background-size: cover; background-position: 50% 50%; height: 80px;][/div]
  162. [/div]
  163.  
  164. [div class=tag]tag[/div] info
  165. [br][/br]
  166. [div class=tag]tag[/div] info
  167. [br][/br]
  168. [div class=tag]tag[/div] info
  169. [br][/br]
  170. [div class=tag]tag[/div] info
  171. [br][/br]
  172. [div class=tag]tag[/div] info
  173. [/div][/div]
  174.  
  175.  
  176. [div class="tabcontents tabcontentsthree" style="display: none;"][div=margin: 20px; height: 285px; overflow-y: auto; font-size: 10px; line-height: 22px; text-align: justify; color: #333;]
  177. [div class=gifs]
  178. [div=flex: 1; margin-right: 35px; margin-left: 30px; background: url(https://66.media.tumblr.com/c37b1b4bfb8081a6f7d5009f6ce52fee/tumblr_inline_pmlv8zYje11vp79yq_500.gif); background-size: cover; background-position: 20% 50%; height: 80px;][/div]
  179. [div=flex: 1; margin-right: 35px; background: url(https://66.media.tumblr.com/33da41bf804e77e1468533a6168c0599/tumblr_inline_pmlv8r8WFv1vp79yq_500.gif); background-size: cover; background-position: 50% 50%; height: 80px;][/div]
  180. [div=flex: 1; margin-right: 30px; background: url(https://66.media.tumblr.com/286ac9b4d50cec030659df73585a2d29/tumblr_inline_pmlv97Y4Zw1vp79yq_500.gif); background-size: cover; background-position: 50% 50%; height: 80px;][/div]
  181. [/div]
  182.  
  183. [div class=tag]tag[/div] info
  184. [br][/br]
  185. [div class=tag]tag[/div] info
  186. [br][/br]
  187. [div class=tag]tag[/div] info
  188. [br][/br]
  189. [div class=tag]tag[/div] info
  190. [br][/br]
  191. [div class=tag]tag[/div] info
  192. [/div][/div]
  193.  
  194.  
  195. [div class="tabcontents tabcontentsfour" style="display: none;"][div=margin: 20px; height: 285px; overflow-y: auto; font-size: 10px; line-height: 22px; text-align: justify; color: #333;]
  196. [div class=gifs]
  197. [div=flex: 1; margin-right: 35px; margin-left: 30px; background: url(https://66.media.tumblr.com/c226cc236076791f73805ff9db02c851/tumblr_inline_pmlv13WRsQ1vp79yq_500.gif); background-size: cover; background-position: 20% 50%; height: 80px;][/div]
  198. [div=flex: 1; margin-right: 35px; background: url(https://66.media.tumblr.com/df267adcc9ef8ee509f20933710f58bd/tumblr_inline_pmlv28OLbI1vp79yq_500.gif); background-size: cover; background-position: 50% 50%; height: 80px;][/div]
  199. [div=flex: 1; margin-right: 30px; background: url(https://66.media.tumblr.com/be0d3abbd41cafbe8882d7066d92b3db/tumblr_inline_pmlv1yXWv91vp79yq_500.gif); background-size: cover; background-position: 50% 50%; height: 80px;][/div]
  200. [/div]
  201.  
  202. [div class=tag]tag[/div] info
  203. [br][/br]
  204. [div class=tag]tag[/div] info
  205. [br][/br]
  206. [div class=tag]tag[/div] info
  207. [br][/br]
  208. [div class=tag]tag[/div] info
  209. [/div][/div]
  210.  
  211.  
  212. [div class="tabcontents tabcontentsfive" style="display: none;"][div=margin: 20px; height: 285px; overflow-y: auto; font-size: 10px; line-height: 22px; text-align: justify; color: #333;]
  213. [div class=gifs]
  214. [div=flex: 1; margin-right: 35px; margin-left: 30px; background: url(https://66.media.tumblr.com/89a0fd22cbfe65f6cb8e0fa2c78c925e/tumblr_inline_pmlvaoemtg1vp79yq_500.gif); background-size: cover; background-position: 20% 50%; height: 80px;][/div]
  215. [div=flex: 1; margin-right: 35px; background: url(https://66.media.tumblr.com/073678d98da71841e2a6c680689ca456/tumblr_inline_pmluyutEn11vp79yq_500.gif); background-size: cover; background-position: 50% 50%; height: 80px;][/div]
  216. [div=flex: 1; margin-right: 30px; background: url(https://66.media.tumblr.com/6162a624605fc7c87bbdaf1299c2f60a/tumblr_inline_pmlvbbNMhj1vp79yq_500.gif); background-size: cover; background-position: 50% 50%; height: 80px;][/div]
  217. [/div]
  218.  
  219. [div class=tag]tag[/div] info
  220. [br][/br]
  221. [div class=tag]tag[/div] info
  222. [br][/br]
  223. [div class=tag]tag[/div] info
  224. [br][/br]
  225. [div class=tag]tag[/div] info
  226. [/div][/div]
  227.  
  228.  
  229. [/div][/div]
  230. [/div]
  231. [div=font-size: 7px; text-align: center; margin-top: 5px;]coded by luna.[/div]
  232.  
  233. [/nobr]
RAW Paste Data
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
Top