API tools faq
paste
luhans

Untitled

luhans
Mar 21st, 2015
317
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 87.37 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. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  4. <!--
  5. THANK YOU TO (CREDITS):
  6. http://codepen.io/ngot3382/pen/lizso
  7. Megamenu:
  8. http://codepen.io/tmrDevelops/pen/myVwKE
  9.  
  10.  
  11.  
  12. -->
  13. <head> <!-- DEFAULT VARIABLES -->
  14. <title>{Title}</title>
  15. <meta name="color:background" content="#fafafa" />
  16. <meta name="color:postbg" content="#fafafa" />
  17. <meta name="color:pborder" content="#fafafa" />
  18. <meta name="color:text" content="#443b3b" />
  19. <meta name="color:link" content="#555252" />
  20. <meta name="color:desc" content="#ffffff" />
  21. <meta name="color:highlight" content="#555252" />
  22. <meta name="color:Top" content="#fafafa" />
  23. <meta name="color:top background" content="#1f1f1f" />
  24. <meta name="color:entry hover" content="#1f1f1f" />
  25. <meta name="color:entries" content="#FFFFFC"/>
  26.  
  27. <meta name="text:tag 1" content="Awards">
  28. <meta name="text:PhotoURL 1" content="http://40.media.tumblr.com/c1d24e5417fa3be38ae41f65712d5613/tumblr_njthlyftRj1tg80flo1_1280.jpg">
  29. <meta name="text:Type 1" content="awards">
  30. <meta name="text:Title 1" content="121314 jhope awards">
  31.  
  32.  
  33. <meta name="text:tag 2" content="Awards">
  34. <meta name="text:PhotoURL 2" content="http://40.media.tumblr.com/c1d24e5417fa3be38ae41f65712d5613/tumblr_njthlyftRj1tg80flo1_1280.jpg">
  35. <meta name="text:Type 2" content="awards">
  36. <meta name="text:Title 2" content="121314 jhope awards">
  37.  
  38.  
  39. <meta name="text:tag 3" content="Awards">
  40. <meta name="text:PhotoURL 3" content="http://40.media.tumblr.com/c1d24e5417fa3be38ae41f65712d5613/tumblr_njthlyftRj1tg80flo1_1280.jpg">
  41. <meta name="text:Type 3" content="awards">
  42. <meta name="text:Title 3" content="121314 jhope awards">
  43.  
  44.  
  45.  
  46. <meta name="text:tag 4" content="Awards">
  47. <meta name="text:PhotoURL 4" content="http://40.media.tumblr.com/c1d24e5417fa3be38ae41f65712d5613/tumblr_njthlyftRj1tg80flo1_1280.jpg">
  48. <meta name="text:Type 4" content="awards">
  49. <meta name="text:Title 4" content="121314 jhope awards">
  50.  
  51.  
  52.  
  53. <meta name="text:tag 5" content="Awards">
  54. <meta name="text:PhotoURL 5" content="http://40.media.tumblr.com/c1d24e5417fa3be38ae41f65712d5613/tumblr_njthlyftRj1tg80flo1_1280.jpg">
  55. <meta name="text:Type 5" content="awards">
  56. <meta name="text:Title 5" content="121314 jhope awards">
  57.  
  58.  
  59.  
  60. <meta name="text:tag 6" content="Awards">
  61. <meta name="text:PhotoURL 6" content="http://40.media.tumblr.com/c1d24e5417fa3be38ae41f65712d5613/tumblr_njthlyftRj1tg80flo1_1280.jpg">
  62. <meta name="text:Type 6" content="awards">
  63. <meta name="text:Title 6" content="121314 jhope awards">
  64.  
  65.  
  66. <meta name="text:tag 7" content="Awards">
  67. <meta name="text:PhotoURL 7" content="http://40.media.tumblr.com/c1d24e5417fa3be38ae41f65712d5613/tumblr_njthlyftRj1tg80flo1_1280.jpg">
  68. <meta name="text:Type 7" content="awards">
  69. <meta name="text:Title 7" content="121314 jhope awards">
  70.  
  71.  
  72. <meta name="text:tag 8" content="Awards">
  73. <meta name="text:PhotoURL 8" content="http://40.media.tumblr.com/c1d24e5417fa3be38ae41f65712d5613/tumblr_njthlyftRj1tg80flo1_1280.jpg">
  74. <meta name="text:Type 8" content="awards">
  75. <meta name="text:Title 8" content="121314 jhope awards">
  76.  
  77.  
  78. <meta name="if:About Title" content="1"/>
  79. <meta name="if:Extra Title" content="1"/>
  80. <meta name="if:Links Title" content="1"/>
  81. <meta name="if:Extra Table" content="1"/>
  82. <meta name="text:Extra Table Title" content="Extra">
  83. <meta name="text:Extra Table Content" content="Optional">
  84.  
  85. <link rel="shortcut icon" href="{Favicon}">
  86. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  87. <link rel="shortcut icon" href="{Favicon}">
  88. <title>{Title}</title>
  89. <link rel="shortcut icon" href="{Favicon}">
  90. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  91.  
  92. {block:Description}
  93. <meta name="description" content="{MetaDescription}" />
  94. {/block:Description}
  95.  
  96. <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
  97. <link href='http://fonts.googleapis.com/css?family=Poiret+One' rel='stylesheet' type='text/css'>
  98. <link href='http://fonts.googleapis.com/css?family=Open+Sans|Anonymous+Pro:400,700' rel='stylesheet' type='text/css'>
  99. <link href='http://fonts.googleapis.com/css?family=Pathway+Gothic+One' rel='stylesheet' type='text/css'>
  100. <link href='http://fonts.googleapis.com/css?family=Squada+One' rel='stylesheet' type='text/css'>
  101. <link href='http://fonts.googleapis.com/css?family=Inconsolata' rel='stylesheet' type='text/css'>
  102. <link href='http://fonts.googleapis.com/css?family=Pacifico' rel='stylesheet' type='text/css'>
  103. <link href='http://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>
  104. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
  105. <script type="text/javascript" src="jQuery.tumblr-random-posts.js"></script>
  106. <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
  107.  
  108. <script type="text/javascript">
  109. <!--
  110. function handleThis(formElm)
  111. {
  112. window.location="http://{name}.tumblr.com/tagged/"+formElm.number.value+"";
  113. return false;
  114. }
  115. // -->
  116. </script>
  117.  
  118.  
  119.  
  120. <script>
  121. $(document).ready(function(){
  122.  
  123. // Even when the window is resized, run this code.
  124. $(window).resize(function(){
  125.  
  126. // Variables
  127. var windowHeight = $(window).height();
  128.  
  129. // Find the value of 90% of the viewport height
  130. var ninetypercent = .9 * windowHeight;
  131.  
  132. // When the document is scrolled ninety percent, toggle the classes
  133. // Does not work in iOS 7 or below
  134. // Hasn't been tested in iOS 8
  135. $(document).scroll(function(){
  136.  
  137. // Store the document scroll function in a variable
  138. var y = $(this).scrollTop();
  139.  
  140. // If the document is scrolled 90%
  141. if( y > ninetypercent) {
  142.  
  143. // Add the "sticky" class
  144. $('nav').addClass('sticky');
  145. } else {
  146. // Else remove it.
  147. $('nav').removeClass('sticky');
  148. }
  149. });
  150.  
  151. // Call it on resize.
  152. }).resize();
  153.  
  154. }); // jQuery
  155. </script>
  156.  
  157. <script>
  158. $(window).load(function(){
  159. $('.megamenu').hover(function(){
  160. $('#overlay').fadeTo(200, 1);
  161. },function(){
  162. $('#overlay').fadeTo(200, 0, function(){
  163. $(this).hide();
  164. });
  165. });});
  166.  
  167.  
  168. </script>
  169.  
  170. <style type="text/css">
  171.  
  172. body{
  173. background:{color:background};
  174. font-family: "Open Sans", sans-serif;
  175. font-size: 11px;
  176. letter-spacing: px;
  177. color:{color:text};
  178. height: 100%;
  179. margin:0; padding:0;
  180. overflow-x: hidden;
  181. }
  182.  
  183.  
  184. a:link, a:visited, a:active{
  185. color:{color:link};
  186. outline: none;
  187. -moz-outline-style: none;
  188. text-decoration:none;
  189. }
  190.  
  191. a img{
  192. border:none;
  193. }
  194.  
  195. blockquote{
  196. padding:0px;
  197. padding-left:5px;
  198. margin:5px;
  199. border-left:1px dotted #288992;
  200. }
  201.  
  202. blockquote img{
  203. display:block;
  204. }
  205.  
  206. blockquote p{
  207. padding:0px;
  208. margin:0px;
  209. }
  210.  
  211. blockquote blockquote{
  212. position:relative;
  213. left:-5px;
  214. margin-top:0px;
  215. margin-right:0px;
  216. padding-right:0px;
  217. }
  218.  
  219. ul.chat, .chat ol, .chat li {
  220. list-style:none;
  221. margin:0px;
  222. padding:0px;
  223. }
  224.  
  225. ul.chat, .chat ol, .chat li {
  226. list-style:none;
  227. margin:0px;
  228. padding:0px;
  229. }
  230.  
  231. ol.notes {
  232. margin-left:-20px;
  233. list-style:upper-roman;
  234. }
  235.  
  236. ol.notes a {
  237. font-style:italic;
  238. }
  239.  
  240. ol.notes blockquote {
  241. border-color:{color:link};
  242.  
  243. }
  244.  
  245. ol.notes img {
  246. display:none;
  247.  
  248. }
  249.  
  250. .postnotes {
  251. min-height:650px;
  252. width:500px;
  253. margin-left:30px;
  254. }
  255.  
  256. #post {
  257. background-color:{color:postbg};
  258. width:1000px; height:100%!important;
  259. margin:auto;
  260. display:block;
  261. border:1px solid {color:pborder};
  262. }
  263. #entry {
  264. min-height:150px;
  265. width:500px;
  266. padding:30px 30px 20px 30px;
  267. margin:0;
  268. border-right:1px solid {color:pborder};
  269. border-bottom:1px solid {color:pborder};
  270. display: block;
  271. background:{color:desc};
  272. }
  273.  
  274.  
  275.  
  276. #entry:hover{
  277. background-color:{color:pborder};
  278. -webkit-transition: all 0.3s;
  279. -moz-transition: all 0.3s;
  280. transition: all 0.3s;
  281. }
  282.  
  283.  
  284. section {
  285. background-color: #1ea2eb;
  286. color: white;
  287. text-align: center;
  288. vertical-align: bottom;
  289. display: table;
  290. min-width: 100%;
  291. min-height: 401px;
  292. }
  293. section:nth-of-type(2n) {
  294. background-color: #983379;
  295. }
  296. section.hero {
  297. margin-left:;
  298. background: #eee url("http://i.imgur.com/UI7pQA6.png") no-repeat fixed 0px -100px / cover;
  299. -webkit-animation: move 21s ease-in-out;
  300. -moz-animation: move 21s ease-in-out;
  301. animation: move 21s ease-in-out;
  302. background-color: #bed600;
  303.  
  304. }
  305. section h1 {
  306. display: table-cell;
  307. vertical-align: middle;
  308. display: ;
  309. }
  310. .box {
  311. display: table-cell;
  312. vertical-align: ;
  313. }
  314.  
  315. .spantitle {
  316. padding:15px;
  317. letter-spacing:5px;
  318. font-size: 50px;
  319. font-weight:700;
  320. font-family: 'Montserrat';
  321. text-transform:uppercase;
  322. }
  323.  
  324. .toptitle {
  325. padding:10px;
  326. font-family: 'Montserrat', sans-serif;
  327. font-weight:700;
  328. text-transform:uppercase;
  329. font-size:20px;
  330. text-align:left;
  331. }
  332. .one {
  333. background-color:{color:top};
  334. color:#000;
  335. }
  336.  
  337. .two {
  338. color:#fff;
  339. background:;
  340. border: 2px solid #fff;
  341. }
  342. nav {
  343. padding:0;margin:;
  344.  
  345. width: 100%;
  346. z-index:9999;
  347. background-color: #000;
  348. color: white;
  349. text-transform: uppercase;
  350. letter-spacing: 1px;
  351. }
  352. nav.sticky {
  353.  
  354. position: fixed;
  355. top: 53px;
  356. }
  357. nav li {
  358. display: inline-block;
  359. line-height: vh;
  360. font-family:'Anonymous Pro';
  361. margin: 0;
  362. }
  363.  
  364. #top {
  365. width:100%;
  366. z-index:9999;
  367. padding:px;
  368. position:fixed;
  369. background:#fafafa;
  370. }
  371.  
  372.  
  373. .more{border:none; width:10em; background:hsla(12, 85%, 55%, 1); padding:1em; color:#FFF; font-family:'Anonymous Pro';}
  374. .more:before{content:'Read More'; font-size:120%; text-align:center;
  375. }
  376. .menu_description {
  377. color:#262626;
  378. text-shadow:1px 1px 1px #ffffff;
  379. padding-bottom: 36px;
  380. }
  381. .menu_description h1 {
  382. margin-top: 24px;
  383. font-size:24px;
  384. line-height:38px;
  385. }
  386. .menu_description h2 {
  387. font-size:18px;
  388. line-height:24px;
  389. }
  390. .menu_description ul.description {
  391. font-size:12px;
  392. line-height:21px;
  393. list-style: square;
  394. margin: 0 0 0 15px;
  395. padding: 0;
  396. }
  397. .menu_description a {
  398. color: #888888;
  399. text-decoration: none;
  400.  
  401. }
  402. .page_wrapper_vertical {
  403. width:960px;
  404. margin: 36px auto;
  405. }
  406. .page_wrapper_vertical .menu_description {
  407. float:left;
  408. width: 760px;
  409. margin-left: 40px;
  410. }
  411. .page_wrapper_vertical .menu_description h1 {
  412. margin-top: -6px;
  413. }
  414. .page_wrapper_fixed {
  415. margin: 70px auto;
  416. }
  417. @media only screen and (min-width: 768px) and (max-width: 984px) {
  418. .page_wrapper, .page_wrapper_vertical {width:768px;}
  419. .page_wrapper_vertical .menu_description {width: 500px;}
  420. }
  421. @media only screen and (max-width:767px) {
  422. .page_wrapper, .page_wrapper_vertical {width:420px;}
  423. .page_wrapper_vertical .menu_description {width: 100%;margin-left:0;}
  424. .page_wrapper_vertical .menu_description h1 {margin-top: 24px;}
  425. }
  426. @media only screen and (max-width:479px) {
  427. .page_wrapper, .page_wrapper_vertical {width:300px;}
  428. }
  429.  
  430. /*PAGE OVERLAY */
  431.  
  432. #overlay{
  433. background: rgba(0,0,0,0.8);
  434. display:none;
  435. height:200%;
  436. left:0;
  437. position:absolute;
  438. top:0;
  439. width:100%;
  440. z-index:5;
  441. }
  442. /*MENU BAR */
  443.  
  444. .megamenu_container {
  445. width:100%;
  446. height: 46px;
  447. *height: 44px;
  448. margin:0;
  449. position: relative;
  450. z-index:9999!important;
  451. -webkit-box-sizing: border-box;
  452. -moz-box-sizing: border-box;
  453. -ms-box-sizing: border-box;
  454. box-sizing: border-box;
  455.  
  456. }
  457. .megamenu {
  458. list-style:none;
  459. padding:0;
  460. position:relative; /* For IE7 */
  461. margin:0;
  462. z-index:10;
  463. font-size:14px;
  464. line-height:1;
  465.  
  466. }
  467. .megamenu > li {
  468. float:left;
  469. margin:0;
  470. -webkit-transition: background 0.5s ease;
  471. -moz-transition: background 0.5s ease;
  472. -o-transition: background 0.5s ease;
  473. -ms-transition: background 0.5s ease;
  474. transition: background 0.5s ease;
  475.  
  476. }
  477. .megamenu > li > a {
  478. color:{color:background};
  479. font-family: 'Montserrat';
  480. font-size:12px;
  481. text-decoration:none;
  482. display:inline-block;
  483. text-align:center;
  484. padding: 17px 15px 17px 17px;
  485. }
  486. .megamenu > li .megamenu_drop {
  487. padding-right:px;
  488. }
  489. .megamenu li.megamenu_button {
  490. display: none;
  491. -webkit-transition: none;
  492. -moz-transition: none;
  493. -o-transition: none;
  494. -ms-transition: none;
  495. transition: none;
  496. }
  497.  
  498. /* Right aligned menu item */
  499.  
  500. .megamenu li.megamenu_right {
  501. float:right;
  502. margin-right:-1px;
  503. }
  504. .megamenu li.megamenu_right a {
  505. margin-right:5px;
  506. }
  507.  
  508.  
  509. /* MENU CONTAINERS*/
  510.  
  511. .megamenu li .dropdown_container,
  512. .megamenu li .dropdown_fullwidth,
  513. .megamenu li .dropdown_multilevel {
  514. position: absolute;
  515. margin:0;
  516. margin-top:1px;
  517. padding-top:24px;
  518. padding-bottom:10px;
  519. left:-9999em;
  520. top:-9999em;
  521. display: block;
  522. zoom:1;
  523. z-index:9998;
  524. float: left;
  525.  
  526. }
  527. .megamenu li .dropdown_first {
  528. margin-left:-1px;
  529. }
  530. .megamenu li .droplast_right {
  531. margin-right:-1px;
  532. }
  533. .megamenu li{
  534. -webkit-transition: all 0.6s ease;
  535. -moz-transition: all 0.6s ease;
  536. -o-transition: all 0.6s ease;
  537. -ms-transition: all 0.6s ease;
  538. transition: all 0.6s ease;
  539. }
  540. /* Showing Drop Down on Mouse Hover */
  541.  
  542. .megamenu li:hover .dropdown_container {
  543. top:45px;
  544. left:auto;
  545. }
  546. .megamenu li:hover .dropdown_fullwidth {
  547. top:45px;
  548. left:-1px;
  549. }
  550. .megamenu li .dropdown_right {
  551. right:0;
  552. }
  553. .megamenu li:hover .dropdown_right {
  554. top:45px;
  555. left:auto;
  556. right:0;
  557. }
  558.  
  559.  
  560. /*
  561. Bigger containers need smaller padding values and
  562. on the opposite, smaller containers will have
  563. higher paddings.
  564. This makes the content within each kind of drop down
  565. equally distant from the left edge.
  566. */
  567.  
  568. .megamenu .dropdown_1column {
  569. width: 8.3334%;
  570. padding-left: 2%;
  571. padding-right: 2%;
  572. }
  573. .megamenu .dropdown_2columns {
  574. width: 16.6667%;
  575. padding-left: 1.8333%;
  576. padding-right: 1.8333%;
  577. }
  578. .megamenu .dropdown_3columns {
  579. width: 25%;
  580. padding-left: 1.5%;
  581. padding-right: 1.5%;
  582. }
  583. .megamenu .dropdown_4columns {
  584. width: 33.3334%;
  585. padding-left: 1.333%;
  586. padding-right: 1.333%;
  587. }
  588. .megamenu .dropdown_5columns {
  589. width: 41.6667%;
  590. padding-left: 1.166%;
  591. padding-right: 1.166%;
  592. }
  593. .megamenu .dropdown_6columns {
  594. width: 50%;
  595. padding-left: 1%;
  596. padding-right: 1%;
  597. }
  598. .megamenu .dropdown_7columns {
  599. width: 58.3334%;
  600. padding-left: 0.833%;
  601. padding-right: 0.833%;
  602. }
  603. .megamenu .dropdown_8columns {
  604. width: 66.6667%;
  605. padding-left: 0.666%;
  606. padding-right: 0.666%;
  607. }
  608. .megamenu .dropdown_9columns {
  609. width: 75%;
  610. padding-left: 0.5%;
  611. padding-right: 0.5%;
  612. }
  613. .megamenu .dropdown_10columns {
  614. width: 83.3334%;
  615. padding-left: 0.333%;
  616. padding-right: 0.333%;
  617. }
  618. .megamenu .dropdown_11columns {
  619. width: 91.6667%;
  620. padding-left: 0.1666%;
  621. padding-right: 0.1666%;
  622. }
  623. .megamenu .dropdown_12columns,
  624. .megamenu .dropdown_fullwidth {
  625. width: 100%;
  626. }
  627. /*DROP DOWN COLUMNS GRID*/
  628. .megamenu .col_1,
  629. .megamenu .col_2,
  630. .megamenu .col_3,
  631. .megamenu .col_4,
  632. .megamenu .col_5,
  633. .megamenu .col_6,
  634. .megamenu .col_7,
  635. .megamenu .col_8,
  636. .megamenu .col_9,
  637. .megamenu .col_10,
  638. .megamenu .col_11,
  639. .megamenu .col_12 {
  640. float: left;
  641. display:inline;
  642. position: relative;
  643. margin-left: 2%;
  644. margin-right: 2%;
  645. /*
  646. Rounding error with IE7.
  647. Lower margin values will absorb the difference.
  648. */
  649. *margin-left: 1.9%;
  650. *margin-right: 1.9%;
  651. }
  652.  
  653. .megamenu .col_1 {width:4.33%;}
  654. .megamenu .col_2 {width:12.66%;}
  655. .megamenu .col_3 {width:21%;}
  656. .megamenu .col_4 {width:29.33%;}
  657. .megamenu .col_5 {width:37.66%;}
  658. .megamenu .col_6 {width:46%;}
  659. .megamenu .col_7 {width:54.33%;}
  660. .megamenu .col_8 {width:62.66%;}
  661. .megamenu .col_9 {width:71%;}
  662. .megamenu .col_10 {width:79.33%;}
  663. .megamenu .col_11 {width:87.66%;}
  664. .megamenu .col_12 {width:96%;}
  665.  
  666. .megamenu .rowcontent {
  667. clear:left;
  668. /*
  669. IE7 clear issue.
  670. Display inline required.
  671. */
  672. *display:inline;
  673. }
  674. /* 04 FLY-OUT MENU*/
  675. .megamenu .dropdown_flyout,
  676. .megamenu .dropdown_flyout .dropdown_flyout_level {
  677. padding: 0;
  678. margin: 0;
  679. list-style: none;
  680. z-index: 9;
  681. -webkit-border-radius: 4px;
  682. -moz-border-radius: 4px;
  683. border-radius: 4px;
  684. }
  685. .megamenu .dropdown_flyout li {
  686. float: left;
  687. width: 92%;
  688. padding: 3px 4% 3px 4%;
  689. -webkit-border-radius:3px;
  690. -moz-border-radius:3px;
  691. border-radius:3px;
  692. }
  693. .megamenu .dropdown_flyout ul li {
  694. width: 140px;
  695. padding: 3px 10px 3px 10px;
  696. }
  697. .megamenu .dropdown_flyout a {
  698. display: block;
  699. width: 10em;
  700. }
  701. .megamenu .dropdown_flyout .dropdown_flyout_level {
  702. position: absolute;
  703. margin:15px 0 0 4px;
  704. padding:6px;
  705. left: -9999em;
  706. top:-9999em;
  707. display: block;
  708. zoom:1;
  709. float: left;
  710. }
  711. .megamenu .dropdown_flyout li:hover > .dropdown_flyout_level {
  712. left:95%;
  713. top:-21px;
  714. }
  715. .megamenu .dropdown_flyout li:hover > .dropdown_flyout_level_left {
  716. left:-108%;
  717. right:100%;
  718. }
  719. /* General Typography */
  720.  
  721.  
  722. .megamenu h1,
  723. .megamenu h2,
  724. .megamenu h3,
  725. .megamenu h4,
  726. .megamenu h5,
  727. .megamenu h6 {
  728. padding:0;
  729. margin:0 0 20px;
  730.  
  731. font-family:'Montserrat';
  732. }
  733. .megamenu > li > div a {
  734. text-decoration: none;
  735. outline: none;
  736. }
  737. .megamenu > li > div a:hover {
  738. -webkit-transition: color 0.3s;
  739. -moz-transition: color 0.3s;
  740. -o-transition: color 0.3s;
  741. -ms-transition: color 0.3s;
  742. transition: color 0.3s;
  743. }
  744. .megamenu p {
  745. font-size:12px;
  746. line-height:21px;
  747. }
  748. .megamenu h1,
  749. .megamenu h2,
  750. .megamenu h3,
  751. .megamenu h4,
  752. .megamenu h5,
  753. .megamenu h6 {
  754. padding:5px;
  755. display:inline-block;
  756. border:2px solid #000;
  757. font-weight: bold;
  758. margin:0 0 20px 0;
  759. }
  760. .megamenu h1 {
  761. font-size: 24px;
  762. line-height: 28px;
  763. }
  764. .megamenu h2 {
  765. font-size: 20px;
  766. line-height: 22px;
  767. }
  768. .megamenu h3 {
  769. font-size: 16px;
  770. line-height: 20px;
  771. }
  772. .megamenu h4 {
  773. font-size: 14px;
  774. line-height: 18px;
  775. margin-bottom:14px;
  776. }
  777. .megamenu h5 {
  778. font-size: 12px;
  779. line-height: 18px;
  780. margin-bottom:14px;
  781. }
  782. .megamenu h6 {
  783. font-size: 10px;
  784. line-height: 16px;
  785. margin-bottom:14px;
  786. text-transform:uppercase;
  787. }
  788. /*Lists */
  789.  
  790. .megamenu li ul,
  791. .megamenu li ol {
  792. padding:0;
  793. margin:0 0 18px 20px;
  794. }
  795. .megamenu li ul {
  796. list-style:disc;
  797. }
  798. .megamenu li ol {
  799. list-style:decimal;
  800. *margin-left: 22px;
  801. }
  802. .megamenu li ul li,
  803. .megamenu li ol li {
  804. font-size:12px;
  805. line-height:21px;
  806. position:relative;
  807. padding:0;
  808. margin:0;
  809. float:none;
  810. text-align:left;
  811. }
  812. .megamenu li .list_unstyled {
  813. list-style: none;
  814. margin-left:0;
  815. }
  816. /* Custom Paragraphs */
  817.  
  818. .megamenu .blue,
  819. .megamenu .grey,
  820. .megamenu .orange,
  821. .megamenu .dark,
  822. .megamenu .purple {
  823. padding:0 0 0 15px;
  824. margin-bottom:18px;
  825. border-left: solid 5px;
  826. display:table;
  827.  
  828. }
  829. .megamenu .blue a,
  830. .megamenu .grey a,
  831. .megamenu .orange a,
  832. .megamenu .dark a,
  833. .megamenu .purple a{
  834. padding:5px;
  835. background-color:#fff;
  836. display:inline-block;
  837. min-width:100px;
  838. margin:1px; }
  839.  
  840. .megamenu .blue a:hover,
  841. .megamenu .grey a:hover,
  842. .megamenu .orange a:hover,
  843. .megamenu .dark a:hover,
  844. .megamenu .purple a:hover{
  845. color:{color:background};
  846. background-color:{color:highlight};
  847. text-shadow:none;
  848. }
  849.  
  850. .megamenu .blue {border-left-color:#929292;}
  851. .megamenu .grey {border-left-color:#ECE7BA;}
  852. .megamenu .orange {border-left-color:#BD4F33;}
  853. .megamenu .dark {border-left-color:#3F3F3F;}
  854. .megamenu .purple {border-left-color:#382E34;}
  855.  
  856. .megamenu .black_box {
  857. text-shadow:none;
  858. padding:10px;
  859. margin-top:-10px;
  860. *margin-top:0;
  861. -webkit-border-radius:4px;
  862. -moz-border-radius:4px;
  863. border-radius:4px;
  864. }
  865.  
  866.  
  867. /*Video + Misc. */
  868.  
  869.  
  870. .megamenu .video_container {
  871. position: relative;
  872. padding-bottom: 56.25%;
  873. padding-top: 30px;
  874. height: 0;
  875. overflow: hidden;
  876. margin-bottom: 24px;
  877. text-align:center;
  878. }
  879.  
  880. .megamenu .dropcap {
  881. display:block;
  882. float:left;
  883. font-size:42px;
  884. line-height:36px;
  885. margin:4px 8px 0 0;
  886. }
  887. .megamenu hr {
  888. width: 100%;
  889. height: 0;
  890. *height:2px;
  891. border:none;
  892. margin-bottom: 24px;
  893. }
  894.  
  895.  
  896. /*Images */
  897.  
  898.  
  899. .megamenu img {
  900. max-width: 100%;
  901. height: auto;
  902. border:none;
  903. margin-bottom: 18px;
  904. }
  905. .megamenu img.img_left {
  906. float: left;
  907. margin-right: 18px;
  908. }
  909. .megamenu img.img_right {
  910. float: right;
  911. margin-left: 18px;
  912. }
  913. .megamenu img {
  914. -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
  915. filter: alpha(opacity=70);
  916. opacity:0.7;
  917. -webkit-transition: opacity 0.3s ease-in-out;
  918. -moz-transition: opacity 0.3s ease-in-out;
  919. -o-transition: opacity 0.3s ease-in-out;
  920. -ms-transition: opacity 0.3s ease-in-out;
  921. transition: opacity 0.3s ease-in-out;
  922. }
  923. .megamenu img:hover {
  924. -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  925. filter: alpha(opacity=100);
  926. opacity:1;
  927. -webkit-transition: opacity 0.3s ease-in-out;
  928. -moz-transition: opacity 0.3s ease-in-out;
  929. -o-transition: opacity 0.3s ease-in-out;
  930. -ms-transition: opacity 0.3s ease-in-out;
  931. transition: opacity 0.3s ease-in-out;
  932. }
  933.  
  934.  
  935. /* Paragraph Icons */
  936.  
  937.  
  938. .megamenu .paragraph_icon {
  939. padding-left: 36px;
  940. padding-right: 20px;
  941. margin-bottom: 18px;
  942. }
  943. .megamenu .mini_icon {
  944. background-repeat: no-repeat;
  945. margin-top: -1px;
  946. margin-left:-34px;
  947. float: left;
  948. width: 20px;
  949. height: 20px;
  950. }
  951.  
  952. /* Sample Icon Attachment positioning */
  953. .megamenu .ic_archive{background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAABgElEQVRIS8WWvyuGURTHvQaJlMUiQiEGIgyyWF78CQaDCaMMFrPBIqMsFsqf4MdikYXIQihEFosSyYDP0b16O+596zzP8+bWp/vec8893+c+59z7vLmyErecii/jURiBcqP2J/67sANffq0WWGWiB7bg3ShQif84nMJMSKAG4w20wrMxuHev5cc1tMCLGAt30Mx4GzoCwTux3cGbm6uib4LzgO8FtjG4tQhs4twFjy5gPf0ZTGQlIDvth2oX8JX+CH6TWSCUaAeBB42aigocs+zJEi3gW4etL5aDPSbyKQV8DFOSLZr/m4PYOZCTeQCXbivt9EMgJ1+3RDuYJsq8KtMlxmtZCWSWg0MiyW2YpsltPBgr030mZtNEZ+0KDMcEYkm2aCZKcskFpFquVJm2MZ6yVFEDzpLkxsCiAWyTqkzXGcuNqtu9S/KDTOhP5gm2ZdiA0FVc7FVJLPk+zEGvd9QCcjoXoRs+LC8e3wqQj9ACyKn/aVrA28U5yb+KPw/1DZTkXhkeo7UEAAAAAElFTkSuQmCC'); background-position: 0 0;}
  954. .megamenu .ic_attachment{ background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAACM0lEQVQ4T62Uy0uUURjG/YY2Lrq5bB0t2rgpRUIZdWYYskYdp0JUCnExZYtoJYg2IlgtokVthBAvII7NRIrgbahIUaJNl7Gm/gCvuWsTyIy/F94ZzgxzC0Z4OM9zvvf8znvO941WWYn/rBLzyooBnrXZbKPxeHyJzcdQObmf8RxzTxh/m00VAp6heNWyrEvoMYBh8jzeIZBEIvGHoRF9S0LzAQW2wuLLaBZYDzmMdwJao8soc37mDk1oLuBphVWxOITvRiFgLrIcvQX9Qw+Ye87cAb4OxbIBBbZMYTWFYfwd9JrsJq/gb9DdMN19lTvFv2S+V09xKxN4iqIlHtZQ9AZ/24BF8D40xfPrKAi0nTyL9yF5cX4TeFI7E9hbfBcKUniV/A7vRZNkD/kL3imd4v3oO7le7tMEzmnxHA860Qy5ieIP+FY0Tm4my1EdBixKbkByj6nv0E7xe93pCvPT5Gvkj/hmuStyq8KksyH8XbSlsH2BpYAUPOPhQ+TDVzIOoHUKPOgVMK9uJp0FFPZDYXtJmAkMUnQTXWRyFEAt/jz+Kb4NL8dqBPYIfw/91DtLg5nAFxTdRx4W2bXbI2AnFCadDSosprBds7O0IxPcLF5kwWe8i8UjfAJ2xk3GPj2mdPZLYTvZYOZLkbcdAdrAog38AJILv4ACOi8weZvbuWAmUHwFkt+qPXMBm3xiTj6dnJ1lHjmZbZgOJJ+K/AT/ogU0gY7ydZYLWMyavDWF/h/+9wbH188nJCK47b4AAAAASUVORK5CYII=');background-position: 0 -58px;}
  955. .megamenu .ic_bookmark{ background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAACm0lEQVQ4T6WUX0hTURzHz+/cbYrXHowgKageVj4MYunuhu7PNUhc23xcRNRDEIJBvkQhGST9JXzpz4PRHwiKoEZvd+ogyu1Osd1NfDEYKAlRhAQlNku99/w6VxBK5zbyPp7f93zu7/y+33OAVPDZ7fYqUzY9Pb1UTg7lBGZd8h3tMAjgRHpQKaevCOgOhJ8iIGrJwdNbBjY1dVoF8fMbE2QUdh/J5R6ulIKW7VDyhYJEADciAkM2PqEOJ7YGlCOPlvWVOyawymrr1pJK538Do9Go8HHu10g2qfhXzfGH0vvqRTkWixmbQcHZ0uYUqFBbTACUOijCnowa710FyqGblMKsvmJ8KKZnBBfA6Wnbb6u2vWAERIrk1XqhoRvPcmNDM+Z6Y3O73WK1ntwAQ3Ycgc4z3TixaorpJBW/XAVge+fmF8/OTo78KBcPs+7zheuWKAzwRM3wU1zhS/o/Lrt8wVYAep272ZNLD6dLQRu97X4+qluEYK+mDiXXtBti42hu3l5jrRsgAHktGe/jQrYOTCU53EcQDlQx7Eqn49//rm+WQ5ACkXEtpXiKdAmuQCSbTSkuXsP19aLAJl/Iw49+LKsq54sd2yWH7xGmP8+qiUxFQCkQ7jcM9npidGjc4YjW1uwo3Dc3Ln4Tz01NxX6a87NYrB2ZpHKxIqBbjqS4WPYcDjcyHe8iwxtEQACklxgxunNqYpL/VNVScW9Z4CFvyGUR6Ck+nk+ApLXwu3BmShv5am50SK31YrX4mFB8iwTslJIn79/FcyVNcftDtwmFKA/6A37l+osMHlxy5AIQ1sWdfsm77CkNDEQSy7p+eXJsWCuVQ2dLULIJlmsZVQluCjSfekHYacvnRxcquSkNDd5t+YO7lkgstrym/wPxxwHg7xXAWAAAAABJRU5ErkJggg==');background-position: 0 -100px; }
  956. .megamenu .ic_brush{ background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAFGklEQVRYR8WXf0wTZxjHnxba0pYWSrGAEwERNOB0GxjRjYwlusVlf0yTLXFhTI2bU0gWl81Ftxkzk00350STOdG4ODJdZM5RJ4HI/LURKA5hMEuxxfba41q4/oBS7q4tpbuXcORUmFTAXfJN37x37/v5Ps/z3nOpAP6HKxwOxzWe3fmUh+i2CB4nnwULGyuKcxmGrPB6hgpob2D1YzPAwkW6Hza/TJGG7wXyZJW5VU9EKyXZj8XAKPzUG6VBijgglKaIbXoD4CZ86wdaZ8WsG0Bpr/9i6W5ZnGqfOD4T8Nt6sNzGKndUO0pQ+WfVAAsX1O9fti/hiYUfixWpYGu/xcLNbYwNX/V+I9CzagDBrx7MO6BOXfShJC4NbG06sBow0udm8t+7SFi5wz8rGUBpv1G+slyzYFlZdMwcwP9pBpveMuByDhXt+LWnjf/mzYqBhqPPVSSmL3lbrJgLREczWPVm2u30vFhaRfx5/2s/owau7i1iAw6dUKdmb5Sqs8ChvwmWDmOAtA+s316FXZqo58yYgb+OvyMKhU2nNZnPbBArU6C3swUs7V0hknCWbP0JOzNZw5sRAzVH1ko08vDZ+LmZ62LiM4DsugVYhwHsVnL7tirbsf/qttM2cO7QPGm6PEsbPy9ntUyVCY5O9sDd7gICI3eVnsf3P6zVT8tA7d7chLikxEspOWsKBNFScBh0gOuNYLeQX5Wdx3c+DD6tPlD7TV6KSqmpn5//Zg7t7YHeLh0QBhPYMeeFsip8/VTgj2yg/vCKJKlUcW1BwZbFPtddIE03wX6nG3oxdwuD44Vcl5uKiYhLUHdsnUYWJK+nrdi4mBnsA4exEfruYkBi7h4XRa/45DdXz1TAEXdCtrtJ2EWxutMbf9YsXF4UoL1g77wBpBUHp62fHuyniz6qczVHAo+oBEajMcduaj40R0S+FA7R7FftCrhtOLiJgVD/ALV+d22/NlJ4RAbaWlsb5LHyVS6i2+u4+qVywI6B103BYD9Vsvuyt/JR4FM20NTUeFClin9XoVDKzWYzmLs6PMSFPTEM7d+yp947aZebiqmHHsKLF6s/T05K2ZWekQF2goAj5YdBpU4I92HGwtPntA1TgUTcCReX/rJSJRN/JhRCztang1EvPJufZLNaob39bzCa7nSZTOa3qqurddOFT1iCNZ/WPJ+bpr68Oi9NJBFLoK7FAkWJfX5dw3VJL0kGBSPhV4+fPFkzE/AHDORuPxe7dnl695MLUzQyuRQ89DC4h4bhRqsVJJ1V9oC7e98lrZb/cUElDPPMcCXl/05UZrRmVPfcLP76WmV2RnKxKFYOHoqF+4LQTdLQN+iHEWcvDFOeHOPJkjvsQiErtHYi0P0m+MniwCPsZAhp3MDSbWcL8xbNuyZUa4RuKgiklwHMxYCXCoA/EIL5URRQhivL8N/L7TwDE22OIAiAxI35cxx89BlkQJhcuEm9pOj1liiFKtXmC4HDw8AAxUDIHwBgaEiQCEGjCLcbvtvwGi9qbtPRSFgNswryxmiOM3K/mfGyIQMx+WU/fjsoSdx0l4046BsC8DMgDgdAxO4bK4uBBLXSSbZqNzubKlH6ORgHRlAE58QHcymf9MwKsjadeiU6RnlUGBWVfk8+QwHbyHCADPrcfziazpwaMut6xyJEIH5kHHD8YE1Km+AGykAUK/ShkbOSjY1FY6lG0flYeVmhPxJcKvknPxLeA8/y3wI0Fo+JM4Ci848JwWf8+heJgWXTqWLoQwAAAABJRU5ErkJggg==');background-position: 0 -168px;}
  957. .megamenu .ic_calc{ background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAo0lEQVQ4T2NkQAUOQO5+NDFCXEegggMwRYz0MrCRkLOg8vVAmigXorscl/n/B8xAIn0MVkaUl6luICxSQMlIAYgXQG1IANIPkJIJ0ZEC8gYIgAwwAOICKH8CkL6AZAEozQ6Ml2HJpgHoApC3QRgEDkAxSBwEiE42B6EaFIC0ANSbICGQ9z8A8QOovD2xXh6NFNpGCigtkhzL+CJlATkGDp6cAgCLTFMVL0A3FQAAAABJRU5ErkJggg==');background-position: 0 -222px; }
  958. .megamenu .ic_calendar{ background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAABwUlEQVQ4T81UMUgCURh+/3mKQ4NCg1sNDYJo570bIhxqa4qG9hqipaVAJGgIgkCroSVoaLC9IWhpq0Go4U5PRWhosM0h0MHh1Od7/U+7xUjERLrh3vv/e++77/3f/z0gAw+liyecE1EoFI/dT6Pm5HqQr2g0GvT7/UE5Z4ydyVFV1ZQLOErOcZx6uVyug67r5wAkOch0vBgyCBh3FIXstlrsQYL4fL4rObbb7T0XdJQcrlknRFwDpboAUFZN03yWAIahn8rRNPNHLuAoOcMwVoTgTz8AxzuqJDItQErpBoDQGOMN27YvNU2bV1Vlu98BPIu5Kub2MRcQAmzLsu77pfqFIaValhBlSwjxkc8X5t2FvR77rjUKWQWAOUL4rWXZvZ8NAaSJbre7oKrQNM3CXSQSCXm93jW5qdPpPFYqlZphxDcZEzMej+cdGeamDTj5I09aFBrGgofQKU6pVHpFRQPoa62vMkOR7UYsFltCZ/hRuBrW8G3qKu8Q0k2gLz8tq5jEvgxjfNh3kCctGeF1doFNNItxDuOboQz/n/Ww65vogIyi8Jdx2cl9nCvLWKYk4NV0wLlIo7K+vwCi4m0klvoCjRetqD0C1V4AAAAASUVORK5CYII=');background-position: 0 -280px; }
  959. .megamenu .ic_cancel{ background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAABu0lEQVQ4T62UTStGQRiGvb6ykyJsWEso+QlKkgX1+kjxC5SFhfwAZSHlD8gCIZTY2VjLBlmz9FHWvt3X2zxvzzvN6ViYujvzzMxznWfumXMKVf/cCjm8Os33SR3Sj/QgXUufWXlZwDYlLEuzUmOU/Kp4S1qRnmNwCjisRdtSU071L5qfls79uhgI7ESq/aO171o34qEeyDbvXGVfAVoTwfGPPBun0i6JZ2nC2oY68yEANhP6bN+SgU1JDRI+2via+oseyGlisB2AAfc0NikB/Q6wo/AyD6S6VtZYhQMKLqOtxVD8Ok7ALK1XnRsDjis4jICEHkqMDb4ynzKq4NSAYwrYStw+wpapjFaUdqTULagA9mvRVUTjAPDPPGPLB9KEhKcxtEdjt1Yhk0+SXWY7TWywbfLp0d8PUCq1Uya3XSofCsWtSwuhSrybC33vGS8CyrXZlKrDmlU9l+j7e9iimIvd7KB044vNy8gz2KP6XGy+8Qog8aB0JtUHaN7jTQuGpAtbmPo5AN11lWZBqYxDK8NSFVoy28YTfDQLbI4DwD98K23Tt7wfLD51S50h6V5PfOYzTLY8YFZe5vgvA0VbFTARUOUAAAAASUVORK5CYII=');background-position: 0 -338px; }
  960. .megamenu .ic_chat{ background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAACKklEQVQ4T2NkoDJgxGdeaGgo/9+/f9X+/fvHzczM/HTt2rV3gOr/49ODzUDGoKAgX6AheUCN9oyMjCxIBjwBii////9/76ZNm15iMxjFQDc3N24eHp4lQA0B+FwBlP8ENDgcaOgOdHVwA4HeY/7169dWJiYmdyKD9TfQYLcNGzYcQFYPN9Df378caFgHkYaBlQENfPnz50+17du3f4LpAxsICvw/f/48BDL5STEQpBYYxo3r1q1rQDHQz88vBhiLi0k1DOrKB0BvK6Ib2A80sAAq+BzolbNAm72AfCYgvgTE34DYAmrAXiCtAJRXhhnCwsIivHr16ndgF4MIYPgtBYZfFIgNTHexwNhbEhAQsAeoyRmIZUVERF6+evXqM1DNY6D3VL29vW3Z2NgOIflIa/369dfhBgLT3TSgqzKhLjgITBLrgZqbgIbxAdmzgWyQ7eVANX+AYrVAthkQB8K9ycgoBbToObKBuUDFk8gMw7cGBgZiDQ0N/+AGenl5ybOzs9+Dhhmp5q4AejcSJVJAnMDAwHlAKpFU04A+A8WyElAfOI/DEzYwHCWBEXICGF5ypBoKDFdLYBieQDEQ6kpNoI3bgAoUCBkKys+gSAOpA0bctI0bN2ZjGAgSABYQYpycnC1AxYloJQ3MjhtAwypZWVm3AXOXP5CdApRQAHpbHauBMF3A7Cj6+/dvb2AQKACDgh2o8QXQJce3bNlyGhZe2HyBt4Al5G26GAgAokXoFehuNB4AAAAASUVORK5CYII=');background-position: 0 -397px; }
  961. .megamenu .ic_chats{ background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAABfUlEQVQ4T5VTbYqCUBTtCWUEMQ5CYBA5Ef10ZgfjDsYdjO2gHdTsoFnBNDtoB2M7iH6HI/TPP5qBKGZ2rkwios7MA7/e9Z5z7zn3sUZuKYryynGczhhT8/tJkmwvl8tyt9t95vfpndFtNBrddTodA4lPxR+KQL7vq6ZpHm/7jJJ5njewUZucA9qGYZiBsPF4PAfzoo65GENLi/1+/5a2IMuyAwDhnwCuZVn3KcBgMEhqkl3EVrgMsNJ744dMOxwO0/RbkqQqgHUQBLrjOJlgZUSs1+t9IyAXgivbtqckcLfbXSKmwd60TdhJlaxPp9OM3GCCIMwRzEREqRZYHyaTyWOz2SR3qvRxoyhSWbvdHrZaLStXwczzvHe481UcqBI3DIYBeqGSbkGUqKL3DdypEzfDYijzA0x6HuB8Pm/6/f7fANA/2k4sPLe3mQfYURTFX+eD8tKzULagPh0smoHKFcexWglAWRD4Ge2RjaXnBHrNagEqqIfQTUP5OgDkK24cpH0MTrZBAAAAAElFTkSuQmCC');background-position: 0 -448px; }
  962. .megamenu .ic_cloud{ background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAABpElEQVQ4T72USytFURiGHYokpUSUKKUkRTEjjqnkUoQiJZGhmPgHBmRISim3geQaZk4uxchlppgQci0MRG7PW3vXtqyOI7Lqaa31Xd79rW+vvX1hfzx8f6wX9i+C8VTdBqWQDKewAkNw/d2JzAqLSZh2EkeZbyEDakGxVbAdTNQrmEbgLoxBB7x4EqNYD0A5tEA4HMK+Ke4VHMGZDn54s1QRgW0L8uAO4mAN6uDcjXcFFaygRpgJcqRcfGdwCSkwAbGQD6/KcwUVuAOZcGARjHRsz4Yvkf0JzEE3HEkwCzZA/agG25scxv4O6p85GjC0OjpFElxwIiqYbb3rxN7rxHQx91lEpbMET1rcQxPYeleGfRbUYw31qRIWLaI12AYleAOqYsQIkq8dcpwjya3LvQe6QmqBdzSz6VFSP+irKIILy5P92FYdewlzwBKThG0d5iUYA8uQDZvw6EmYYn1lCCaw1/HcEc2iEFR5qXttdPP1tgqMp6tXD4ag7p166x26JePwFsrfxm8IBgyxT9tQBFPJqHeyJpmPfysYLP+LL5QKfyT4AfMHUF0XAXTrAAAAAElFTkSuQmCC');background-position: 0 -500px; }
  963. .megamenu .ic_delete{ background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAYCAYAAAD3Va0xAAAAnklEQVQ4T2NkwASsQKHVQOyPRQ4ktAaII4D4L7I8I1QCWUwWyDHDYQhM+ASQ8RRJzV+QQf8JaCJGmroGEWMjQTUgr4FANRAbElSNXcEZoHAHzKAdQI47mQZtBerzGTUIb+iNhhHhxDUaRkM+jDaDigLCvsCqYj1QNAhWjOQDORPINCgLqG86zCBmIKcPiJOBmJtIA78A1c0C4lIg/gcA7yIyuu3IlOIAAAAASUVORK5CYII=');background-position: 0 -560px; }
  964. .megamenu .ic_documents{background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAAYCAYAAAAYl8YPAAAA7UlEQVQ4T2NkQAU3gFx1NDGiuYy0NEwVaDg70U6BKJQC4p0gBshlIAYziQbAlN8BMjqA+D7MsP9kGgTSdhWIfWhu2HSgDZ+IdKUSUF0oPpcVAyXfEWmYLlBdEd28eR1o0y8iXcYHVKeIz2XGQMlnRBrmBFS3lG7eJNJRKMpwpjN9ErzpDFS7Ap83bwElfxPpPF6gOjm6hVk+CYkWFCQl+Fw2Cyj5mUhvgtJYEN28uQZo01ccLjMAioO8hg5wJo04oMrXOAyLAYpH4zAMlEwWguRAJS2lhaMOzBKqG/YXaDITkbGIruwiUAAUnmAAALMzUr1Bf6+3AAAAAElFTkSuQmCC'); background-position: 0 -615px; }
  965. .megamenu .ic_down{ background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAABSElEQVQ4T2NkoDJgpLJ5DKMGUh6iKGHo7+8fx8jIOAWIT//69Stk69at73FZERwc7P7v379FQPkXLCwsvqtXr34EUgs30M3NTYybm/sxUIwNJPH///+zv3//dsVmKNSwDUBlHGBDGBnXrlu3LgTFQE9PTz4ODo77QEEhJFedBhrstmHDhg8wMR8fHzdWVtaNMMOg4jPXr1+fgWIgiBMQEGAApPYAbRRGMvQikO0M1PA2KCjID2jBapgvoK7bzMzMHAL08i8MA0ECQE0WwLDZCTSUD2YokH0SKNYNpBcDxTiRLNv3588f382bN3+Dq8UW6DhciqIUaDiKy/AaiMf7YH1Ab28BhmMwzJvINuHNethcis8wrGGIHgSBgYGWQLHtQMwPxBhhhq6eqMLB19dXBBhm6kZGRscbGhr+YQt3gmGIT9OogSghAAAC7noVn3eLiAAAAABJRU5ErkJggg==');background-position: 0 -678px; }
  966.  
  967. .megamenu .ic_list{ background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAABGklEQVQ4T2NkoDJgpLJ5DEPQQDU5OaW/DAyCv3/9+v7oxYtrpAYJhpcVZWWrGRlZTzIy/neUfShf/0zunhwuQz8+evTyJQPDV2R5DANVZGWr/vz+fZSRld35/uOH7UpySta4DPzy48vlV69eAc1EAAwD5eTkXFn/sRoys/x9dOvBgxUUe1lFTjHsD8NfRQYmpo8PHjyYQbGBSrKyWfceP54Gojn5+Ob8+PwtAZehf37/OPzw+fPreL2sLK9Yw/Cf4RUwhardfXi/hGIXkmoAunqMSFGWU0wDKfrP9F/o3oMHHaRagGEgchgCw3IG0IIUXIb+/Pd7/5MnT27jDUOQgf8YGXkZ/jFwPHjyqJFiF5JqAMEwHDWQ5BAAADLrZRWAfRMvAAAAAElFTkSuQmCC'); background-position: 0 -728px; }
  968. .megamenu .ic_favorite{ background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAACY0lEQVQ4T62US2hTQRSGnZsmWZhdFwEhYqAYW8w7RHdmV9CFK7VWKlI0rRW01CJatNKWahetL6TUaqtUqmKgSwWXbiKS98LHSrCiO6FkZ5rE74ReifE2ptWB4c6dOfPNf/55qC3/uaganuZ2u/eYzeZdpVKpifLO6XS+icViRYmLRCJN+Xx+b7FYbNU0bZXyPpfLvWWopHN+AYPB4IFyuXxLKbWDwc9UM9VB/VAoFM5YrVaNRe4Ss5OYZfpXqdv5/wS8P5FIvBBoBejz+U6ZTKZpmhMWi+VmPB7/Lv0ul2ubzWa7TDNaCVZqBsB4Mpn8Jv/hcLiZRQbou4Dqvkwmc195PJ7dpJiiI0rHI7vdvtXhcPhYMa6nEggEjjBezmazz40sR9AJBM1igV/5/f4FJNtZtZ12G+1rKFnCu0Xdu0b2DcteEfdVsfoXIFdRNEf7IbB+4CuNQKpjAJ7kf1jR+IEPB9Pp9EvancCebBQm8aFQaD+cpYpC/kdTqdTsZkD6HOzqJdMh8XAOQ1tIed+/ABH2Grs+ClA2IgNskHTvbAaKVWeZN0n1VM4h+feQ/zQr9AB9sBGobAbn8B5zTott1TdFdmmGOtCo0jVlN5jTqwv57S6Tfjfpy+acJ+B2PaXAzjE+RWZRTsi8Hlv7OEj6R0lhgYArQCeMoMAu0j+GRcfZzKfVMX8AZRClHSh9LAcV6PWaA3xJjhnKulD2rHZBQ6AEeb3ewzxfi9VQ7uwQR2yEO3tsvXu9LnBNaRdKxZ9hHgclMJR1o0zUG5a6QJmBX4f4yNMmpQ8LYvU266/AepONxn4C9lEEjkh9IiUAAAAASUVORK5CYII=');background-position: 0 -959px; }
  969. .megamenu .ic_folder{ background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAABF0lEQVQ4T2NkoDJgBJlnautp/5+BQRRhNuP//wx/7589vPMcqfYxmtl5l/9n+G8E1HgZWTMjI6PTv3//J545vG0jKYYymtr7bPvz6WP8+fOHXyNrNLb2dmRmYcz78/ffXKIM/P//zbmj208wmtn67Pj77UvM2bMH3iBr1DNzU2TjYE0myjCIIl1g+B3GaSAJBoGVahq7S/LwsM4FG8jAxCDN8I/hL6mGoKr/z8LAwPiEai7UNnWQ4ObgWTBqIPnRMhqGmFmP1NCEh6Gpvff2n79/x186tusVqYYgqze0dpViYWGfw2hi61XIxMDo/J+R4QolBjIwMuox/GfYCS5gzR29jf/9/o9UwJJu9D/Gv69ABTLYQGoCABhgrgc+m1b4AAAAAElFTkSuQmCC');background-position: 0 -999px; }
  970. .megamenu .ic_zoom{ background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAB8UlEQVQ4T62USyhEURjH3ctY2EgesWNjMRtlo7ybjLKYmoWaBRY2VighKZsRFh6TzdhSKBtNWXkkFpRY2MiUhSiTSMrCwqMZv+9277guZ8bIqX/3fOf8z+989zvnXi3rn5uWAa8Qb77pj/F8+Wntb4C1LBxHzZqmZQskkUg86bq+Go/Hg4T3dnA64CjmCUA6kDMgUSAuxuoZK2Lsjr4fHVnQVMBOFi2z6AFzB9pGAqtGUeBDwMfoy3wVuhWoCpjL3CUqQXXoxMygiU322eSc2Ae0h/4IY2HgvamArZi20BLGbkfxPcSL6BE1oGspKypF76oMh4FNs3sXphUHUMIW5neYl9cP0vfRr6B/pQKOYprC1I5p/QegDDWiQzltfAHkltqqgAGAa2jSLLyCaQxfoHJUgJ5VQLnEUptnVImeFEQ/m0bIbpP5NvGkuja7mD2Y9/DJq8sh2Juc/gaSr0cu/7ESSF1CgAas1eYFXpAaIRfzXkohB6ajPhS2vN8yxDwLYNAGkwxryDbPnh6eG+J+FLGPfwECm8E4lNxN0+bIROJi5EVl6A2doQP06ijDZw2ByTWRb9doZBQClszUuVAVWxnKzjEgRsxjHliyhr+FGWtNs3z0p8gtBwJsmL58Thk3ew1zWC33T35Jf27p/ocZgz8At92uFYW5Y+8AAAAASUVORK5CYII=');background-position: -58px -782px; }
  971.  
  972.  
  973. /* Optional Social Icon Styling */
  974. .megamenu .social_icon {
  975. width: 42px;
  976. height: 42px;
  977. margin-bottom: 12px;
  978. *padding-bottom:18px;
  979. float: left;
  980. background: url("") no-repeat top left;
  981. -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
  982. filter: alpha(opacity=60);
  983. opacity:0.6;
  984. -webkit-border-radius:3px;
  985. -moz-border-radius:3px;
  986. border-radius:3px;
  987. -webkit-transition: .3s all ease-in;
  988. -o-transition: .3s all ease-in;
  989. -moz-transition: .3s all ease-in;
  990. transition: .3s all ease-in;
  991. }
  992. .megamenu .social_icon:hover {
  993. -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  994. filter: alpha(opacity=100);
  995. opacity:1;
  996. }
  997.  
  998.  
  999.  
  1000. /* Form */
  1001.  
  1002.  
  1003. .megamenu #megamenu_form {
  1004. margin:0 0 20px 0;
  1005. display: block;
  1006. }
  1007. .megamenu #megamenu_form fieldset {
  1008. border:0;
  1009. margin:0;
  1010. padding:0;
  1011. position: relative;
  1012. }
  1013. .megamenu #megamenu_form label {
  1014. width: 94%;
  1015. float: left;
  1016. margin: 0 0 12px 0;
  1017. padding-top: 3px;
  1018. font-size: 12px;
  1019.  
  1020. }
  1021. .megamenu #megamenu_form input.form-input,
  1022. .megamenu #megamenu_form textarea {
  1023. width: 90%;
  1024. padding:6px;
  1025. border: 1px solid #dddddd;
  1026. box-shadow: none;
  1027. margin: 0 0 12px 0;
  1028. transition:border-color 0.2s;
  1029. font-size:12px;
  1030. }
  1031. .megamenu #megamenu_form input.form-captcha {
  1032. width: 40px;
  1033. }
  1034. .megamenu #megamenu_form textarea {
  1035. height: 120px;
  1036. }
  1037. .megamenu #megamenu_form input.form-input:hover,
  1038. .megamenu #megamenu_form textarea:hover {
  1039. border: 1px solid #bbbbbb;
  1040. }
  1041. .megamenu #megamenu_form input.form-input:focus,
  1042. .megamenu #megamenu_form textarea:focus {
  1043. border: 1px solid #aaaaaa;
  1044. box-shadow: none;
  1045. outline: none;
  1046. }
  1047. .megamenu #megamenu_form .form-buttons {
  1048. list-style: none;
  1049. width: 94%;
  1050. margin: 6px 0 0 0;
  1051. }
  1052. .megamenu #megamenu_form .form-buttons li {
  1053. float: left;
  1054. margin: 0 12px 0 0;
  1055. }
  1056. .megamenu #megamenu_form .form-buttons li input {
  1057. float: left;
  1058. margin: 0 12px 0 0;
  1059. padding: 9px 0;
  1060. width: 90px;
  1061. font-size:12px;
  1062. cursor: pointer;
  1063. color: #eeeeee;
  1064. border: none;
  1065. background: #000000;
  1066. }
  1067.  
  1068. /* Colored elements */
  1069.  
  1070. .megamenu #megamenu_form label.error,
  1071. .megamenu #megamenu_form #error,
  1072. .megamenu #megamenu_form #success {
  1073. color:#fff;
  1074. clear: both;
  1075. width: 90%;
  1076. padding:6px;
  1077. font-size:12px;
  1078. line-height: 18px;
  1079. }
  1080. .megamenu #megamenu_form label.error,
  1081. .megamenu #megamenu_form #error {
  1082. background:#E45635;
  1083. }
  1084. .megamenu #megamenu_form input.error,
  1085. .megamenu #megamenu_form input.error:hover,
  1086. .megamenu #megamenu_form input.error:focus,
  1087. .megamenu #megamenu_form textarea.error,
  1088. .megamenu #megamenu_form textarea.error:hover,
  1089. .megamenu #megamenu_form textarea.error:focus {
  1090. border-color:#f4baad;
  1091. }
  1092. .megamenu #megamenu_form #success {
  1093. background:#90AB76;
  1094. }
  1095. .megamenu #megamenu_form #success,
  1096. .megamenu #megamenu_form #error {
  1097. display: none;
  1098. position:absolute;
  1099. top:0;
  1100. margin-left: 0;
  1101. width: 90%;
  1102. }
  1103. .megamenu #megamenu_form .required {
  1104. color:#e9266d;
  1105. }
  1106.  
  1107.  
  1108. /* 9. Tables */
  1109.  
  1110.  
  1111. .megamenu .table_light,
  1112. .megamenu .table_dark {
  1113. width:100%;
  1114. padding:0;
  1115. margin:6px 0 18px 0;
  1116. font-size:12px;
  1117. border-spacing: 0px;
  1118. border-collapse: collapse;
  1119. }
  1120. .megamenu .table_light th,
  1121. .megamenu .table_dark th {
  1122. text-align:left;
  1123. padding:12px 9px 12px 9px;
  1124. font-weight:bold;
  1125. font-size:12px;
  1126. }
  1127. .megamenu .table_light td,
  1128. .megamenu .table_dark td {
  1129. padding:12px 9px 12px 9px;
  1130. }
  1131.  
  1132. /*
  1133. THEMES > DARK & LIGHT
  1134.  
  1135. /* 1. Dark Menu Bar */
  1136.  
  1137.  
  1138. .megamenu_dark_bar {
  1139. background: rgba(0,0,0,0.9);
  1140. transition: all 0.2s ease;
  1141.  
  1142. }
  1143.  
  1144. .megamenu_dark_bar .megamenu {
  1145. color:hsla(207, 45%, 15%, 1);
  1146. font-family: 'Montserrat', cursive;
  1147. }
  1148. .megamenu_dark_bar .megamenu > li:hover,
  1149. .megamenu_dark_bar .megamenu > li.active {
  1150. background: {color:highlight};
  1151. opacity:1.0;
  1152. }
  1153. .megamenu_dark_bar .megamenu li.noactive {
  1154. background:none;
  1155. -webkit-box-shadow:none;
  1156. -moz-box-shadow:none;
  1157. box-shadow:none;
  1158. }
  1159. .megamenu_dark_bar .megamenu > li > a {
  1160. color:rgb(228,247,223);
  1161. font-family: 'Montserrat', cursive;
  1162. }
  1163. .megamenu_dark_bar .megamenu > li:hover > a {
  1164. color:rgba(0,0,0,0.9);
  1165. }
  1166.  
  1167.  
  1168.  
  1169. .right{
  1170. box-shadow: rgb(228, 213, 163) 1px 1px,
  1171. rgb(228, 213, 163) 2px 2px,
  1172. rgb(228, 213, 163) 3px 3px,
  1173. rgb(228, 213, 163) 4px 4px,
  1174. rgb(228, 213, 163) 5px 5px,
  1175. rgb(228, 213, 163) 6px 6px,
  1176. rgb(228, 213, 163) 7px 7px,
  1177. rgb(228, 213, 163) 8px 8px,
  1178. rgb(228, 213, 163) 9px 9px,
  1179. rgb(228, 213, 163) 10px 10px,
  1180. rgb(228, 213, 163) 11px 11px,
  1181. rgb(228, 214, 164) 12px 12px,
  1182. rgb(228, 214, 164) 13px 13px,
  1183. rgb(228, 214, 164) 14px 14px,
  1184. rgb(228, 214, 164) 15px 15px,
  1185. rgb(228, 214, 164) 16px 16px,
  1186. rgb(228, 214, 164) 17px 17px,
  1187. rgb(228, 215, 165) 18px 18px,
  1188. rgb(228, 215, 165) 19px 19px,
  1189. rgb(229, 215, 165) 20px 20px;
  1190. }
  1191. /* Light Drop Down */
  1192.  
  1193.  
  1194. .megamenu_light .megamenu li .dropdown_container,
  1195. .megamenu_light .megamenu li .dropdown_fullwidth,
  1196. .megamenu_light .megamenu li .dropdown_flyout li ul {
  1197. border:1px solid hsla(215, 55%, 95%, 0.5);
  1198. border-top-width: 0;
  1199. background: #fafafa;
  1200. }
  1201. .megamenu_light .megamenu li .dropdown_flyout li ul {
  1202. border:1px solid #CCCCCC;
  1203. }
  1204.  
  1205. .megamenu_light .megamenu li .dropdown_flyout .dropdown_parent:hover,
  1206. .megamenu_light .megamenu li .dropdown_flyout .dropdown_parent.active {
  1207. background-color:#eeeeee;
  1208. }
  1209. .megamenu_light .megamenu li .dropdown_flyout .dropdown_parent.noactive {
  1210. background-color:transparent;
  1211. }
  1212. .megamenu_light .megamenu p,
  1213. .megamenu_light .megamenu h1,
  1214. .megamenu_light .megamenu h2,
  1215. .megamenu_light .megamenu h3,
  1216. .megamenu_light .megamenu h4,
  1217. .megamenu_light .megamenu h5,
  1218. .megamenu_light .megamenu h6 {
  1219. color: #212121;
  1220. text-shadow: 1px 1px 1px #FFFFFF;
  1221. }
  1222. .megamenu_light .megamenu > li > div a,
  1223. .megamenu_light .megamenu li ul li,
  1224. .megamenu_light .megamenu li ol li {
  1225. color:#888888;
  1226. }
  1227. .megamenu_light .megamenu > li > div a:hover {
  1228. color:#333333;
  1229. }
  1230. .megamenu_light .megamenu li ul li:hover,
  1231. .megamenu_light .megamenu li ol li:hover,
  1232. .megamenu_light .megamenu .blue,
  1233. .megamenu_light .megamenu .grey,
  1234. .megamenu_light .megamenu .orange,
  1235. .megamenu_light .megamenu .dark,
  1236. .megamenu_light .megamenu .purple {
  1237. color:#444444;
  1238. }
  1239. .megamenu_light .megamenu .black_box {
  1240. background: #212121;
  1241. color:#ffffff;
  1242. }
  1243. .megamenu_light .megamenu .grey_bg {
  1244. background: #eeeeee;
  1245. }
  1246. .megamenu_light .megamenu .form_element {
  1247. -webkit-box-shadow: 0 1px 1px #efefef;
  1248. -moz-box-shadow: 0 1px 1px #efefef;
  1249. box-shadow: 0 1px 1px #efefef;
  1250. }
  1251. .megamenu_light .megamenu > li.megamenu_searchform:hover {
  1252. background: none;
  1253. -webkit-box-shadow:none;
  1254. -moz-box-shadow:none;
  1255. box-shadow:none;
  1256. }
  1257. .megamenu_light .megamenu hr {
  1258. border:none;
  1259. border-bottom:1px solid #ffffff;
  1260. border-top:1px solid #e4e4e4;
  1261. }
  1262.  
  1263.  
  1264.  
  1265.  
  1266. /* Tables */
  1267.  
  1268. .megamenu .table_light {
  1269. border:1px solid #cbcbcb;
  1270. border-bottom:none;
  1271. }
  1272. .megamenu .table_light th {
  1273. color:#3A3A3A;
  1274. border-bottom:1px solid #cbcbcb;
  1275. background:#F5F5F5;
  1276. }
  1277. .megamenu .table_light td {
  1278. border-bottom:1px solid #cbcbcb;
  1279. background:#fff;
  1280. color:#888;
  1281. }
  1282.  
  1283. .megamenu .table_dark {
  1284. border:1px solid #000;
  1285. border-bottom:none;
  1286. }
  1287. .megamenu .table_dark th {
  1288. color:#FFF;
  1289. border-bottom:1px solid #000;
  1290. background:#0D0D0D;
  1291. }
  1292. .megamenu .table_dark td {
  1293. border-bottom:1px solid #000;
  1294. background:#0F0F0F;
  1295. color:#DDD;
  1296. }
  1297.  
  1298.  
  1299.  
  1300.  
  1301. /* Media Queries */
  1302.  
  1303.  
  1304. @media only screen and (max-width: 984px) {
  1305.  
  1306. .megamenu img {
  1307. max-width: 96%;
  1308. height: auto;
  1309. }
  1310. .megamenu textarea {
  1311. width:96%;
  1312. }
  1313.  
  1314. }
  1315.  
  1316.  
  1317. @media only screen and (min-width: 480px) and (max-width: 767px) {
  1318.  
  1319. .megamenu_container .megamenu > li > div > .responsive_sixths {
  1320. width: 8.66%;
  1321. }
  1322. .megamenu_container .megamenu > li > div > .responsive_fourths {
  1323. width: 17%;
  1324. }
  1325. .megamenu_container .megamenu > li > div > .responsive_thirds {
  1326. width: 25.33334%;
  1327. }
  1328. .megamenu_container .megamenu > li > div > .responsive_halfs {
  1329. width: 42%;
  1330. }
  1331. .main .col-1, .col-2{
  1332. float:none;
  1333. }
  1334.  
  1335. }
  1336.  
  1337.  
  1338. /* Media Queries */
  1339.  
  1340.  
  1341. @media only screen and (min-width: 768px) and (max-width: 984px) {
  1342.  
  1343. .megamenu_container .megamenu > li {
  1344. margin:0 8px 0 0;
  1345. }
  1346. .megamenu_container .megamenu > li.right {
  1347. margin-right:-1px;
  1348.  
  1349. }
  1350. .megamenu_container .megamenu > li > a {
  1351. padding: 16px 10px 17px 10px;
  1352. }
  1353. .megamenu_container .megamenu > li .megamenu_drop {
  1354. padding-right:30px;
  1355. }
  1356. .main .col-1,.col-2,.main .button_section {
  1357. float:none; width:100%;top:0;
  1358. }
  1359.  
  1360. }
  1361.  
  1362.  
  1363. @media only screen and (max-width:768px){
  1364.  
  1365. .megamenu_container {
  1366. height: auto;
  1367. }
  1368. .megamenu_container .megamenu > li,
  1369. .megamenu_container .megamenu > li:hover,
  1370. .megamenu_container .megamenu > li.right,
  1371. .megamenu_container .megamenu > li.right:hover {
  1372. float:none;
  1373. width:auto;
  1374. padding-right:0;
  1375. margin-right:0;
  1376. }
  1377. .megamenu_container .megamenu > li > a {
  1378. padding: 16px 10px 16px 10px;
  1379. border-bottom:2px solid #2c3e50;
  1380. }
  1381. .megamenu_container .megamenu > li > a:hover{
  1382. border-bottom:2px solid #d35400;
  1383. }
  1384. .megamenu_container .megamenu li.right a {
  1385. margin-right:0;
  1386. }
  1387.  
  1388. .megamenu_container .megamenu li:hover .dropdown_container,
  1389. .megamenu_container .megamenu li:hover .dropdown_fullwidth,
  1390. .megamenu_container .megamenu li:hover .dropdown_right {
  1391. top:auto;
  1392. left:-1px;
  1393. }
  1394. .megamenu_container .megamenu .dropdown_1column,
  1395. .megamenu_container .megamenu .dropdown_2columns,
  1396. .megamenu_container .megamenu .dropdown_3columns,
  1397. .megamenu_container .megamenu .dropdown_4columns,
  1398. .megamenu_container .megamenu .dropdown_5columns,
  1399. .megamenu_container .megamenu .dropdown_6columns,
  1400. .megamenu_container .megamenu .dropdown_7columns,
  1401. .megamenu_container .megamenu .dropdown_8columns,
  1402. .megamenu_container .megamenu .dropdown_9columns,
  1403. .megamenu_container .megamenu .dropdown_10columns,
  1404. .megamenu_container .megamenu .dropdown_11columns,
  1405. .megamenu_container .megamenu .dropdown_12columns {
  1406. width: 100%;
  1407. padding-left:0;
  1408. padding-right:0;
  1409. }
  1410. .megamenu_container .megamenu .col_1,
  1411. .megamenu_container .megamenu .col_2,
  1412. .megamenu_container .megamenu .col_3,
  1413. .megamenu_container .megamenu .col_4,
  1414. .megamenu_container .megamenu .col_5,
  1415. .megamenu_container .megamenu .col_6,
  1416. .megamenu_container .megamenu .col_7,
  1417. .megamenu_container .megamenu .col_8,
  1418. .megamenu_container .megamenu .col_9,
  1419. .megamenu_container .megamenu .col_10,
  1420. .megamenu_container .megamenu .col_11,
  1421. .megamenu_container .megamenu .col_12 {
  1422. width:92%;
  1423. margin-left: 4%;
  1424. margin-right: 4%;
  1425. }
  1426. .megamenu_container .megamenu > li.megamenu_searchform .megamenu_searchfield {
  1427. margin-left: 10px;
  1428. margin-bottom: 10px;
  1429. }
  1430. .megamenu .dropdown_flyout,
  1431. .megamenu .dropdown_flyout .dropdown_flyout_level {
  1432. position: relative;
  1433. left:auto;
  1434. top:auto;
  1435. padding: 0;
  1436. margin: 0 4% 0 4%;
  1437.  
  1438. }
  1439. .megamenu .dropdown_flyout li,
  1440. .megamenu .dropdown_flyout ul li {
  1441. width: 100%;
  1442. padding: 3px 0 3px 0;
  1443. }
  1444. .megamenu .dropdown_flyout li:hover > .dropdown_flyout_level {
  1445. left:auto;
  1446. top:auto;
  1447. }
  1448. .megamenu .dropdown_flyout li:hover > .dropdown_flyout_level_left {
  1449. left:auto;
  1450. right:auto;
  1451. }
  1452. .megamenu_dark .megamenu li .dropdown_flyout li ul,
  1453. .megamenu_light .megamenu li .dropdown_flyout li ul {
  1454. border:none;
  1455. background: none;
  1456. }
  1457.  
  1458. .megamenu_dark .megamenu li .dropdown_flyout .dropdown_parent:hover,
  1459. .megamenu_dark .megamenu li .dropdown_flyout .dropdown_parent.active,
  1460. .megamenu_light .megamenu li .dropdown_flyout .dropdown_parent:hover,
  1461. .megamenu_light .megamenu li .dropdown_flyout .dropdown_parent.active {
  1462. background-color:transparent;
  1463. }
  1464.  
  1465. }
  1466.  
  1467.  
  1468. @media only screen and (max-width: 479px) {
  1469.  
  1470. .megamenu_container .megamenu > li > div > .responsive_sixths,
  1471. .megamenu_container .megamenu > li > div > .responsive_fourths,
  1472. .megamenu_container .megamenu > li > div > .responsive_thirds,
  1473. .megamenu_container .megamenu > li > div > .responsive_halfs {
  1474. width: 42%;
  1475. }
  1476.  
  1477.  
  1478. }
  1479.  
  1480.  
  1481.  
  1482. .cf:before, .cf:after{
  1483. content:"";
  1484. display:table;
  1485. }
  1486.  
  1487. .cf:after{
  1488. clear:both;
  1489. }
  1490.  
  1491. .cf{
  1492. zoom:1;
  1493. }
  1494.  
  1495. /* Form wrapper styling */
  1496. .search-wrapper {
  1497. margin: auto auto;
  1498. background:;
  1499. }
  1500.  
  1501. /* Form text input */
  1502.  
  1503. .search-wrapper input {
  1504. width: 297px;
  1505. height: 25px;
  1506. float: left;
  1507. padding:5px;
  1508. text-transform:uppercase;
  1509. font-family:"Open Sans";
  1510. font-size: 12px;
  1511.  
  1512. }
  1513.  
  1514. .search-wrapper input:focus {
  1515. outline: 0;
  1516. background: ;
  1517. }
  1518.  
  1519. .search-wrapper input::-webkit-input-placeholder {
  1520. color: #999;
  1521. font-weight: normal;
  1522. }
  1523.  
  1524. .search-wrapper input:-moz-placeholder {
  1525. color: #999;
  1526. text-size: 8px;
  1527. font-weight: normal;
  1528. font-style: italic;
  1529. }
  1530.  
  1531. .search-wrapper input:-ms-input-placeholder {
  1532. color: #999;
  1533. font-weight: normal;
  1534. font-style: italic;
  1535. }
  1536.  
  1537. /* Form submit button */
  1538. .search-wrapper button {
  1539. overflow: visible;
  1540. position: relative;
  1541. float: right;
  1542. border: 0;
  1543. padding: 14.5px;
  1544. cursor: pointer;
  1545. height:;
  1546. font: 9px "Open Sans";
  1547. color: white;
  1548. text-transform: uppercase;
  1549. background: {color:highlight};
  1550. }
  1551.  
  1552. .search-wrapper button:hover{
  1553. background: {color:link};
  1554. }
  1555.  
  1556. .search-wrapper button:active,
  1557. .search-wrapper button:focus{
  1558. background: {color:highlight};
  1559. outline: 0;
  1560. }
  1561.  
  1562.  
  1563.  
  1564. .search-wrapper button:hover:before{
  1565. border-right-color: {color:link};
  1566. }
  1567.  
  1568. .search-wrapper button:focus:before,
  1569. .search-wrapper button:active:before{
  1570. border-right-color: {color:highlight};
  1571. }
  1572.  
  1573. .search-wrapper button::-moz-focus-inner { /* remove extra button spacing for Mozilla Firefox */
  1574. border: 0;
  1575. padding: 0;
  1576. }
  1577.  
  1578.  
  1579. #sidecont {
  1580. float:right;
  1581. margin-left:-100px;
  1582. width:350px;
  1583. padding:40px;
  1584. height:100%;
  1585. z-index:10;
  1586. }
  1587.  
  1588. #pagina {
  1589. position:fixed;
  1590. width:100%;
  1591. bottom:0;
  1592. z-index:9999!important;
  1593. font-family:'montserrat';
  1594. font-weight:bold;
  1595. padding:5px;
  1596. border-top:1px solid {color:pborder};
  1597. background-color:{color:background};
  1598. }
  1599. #pagina a:link{
  1600. color: #000;
  1601. padding:5px;}
  1602.  
  1603. #pagina a:visited {
  1604. padding:5px;
  1605. color: {color:highlight};
  1606. }
  1607.  
  1608. #pagina a:active {
  1609. color: #000;
  1610. }
  1611.  
  1612. #pagina:hover{
  1613. background:;}
  1614.  
  1615.  
  1616. #sidecont h1 {
  1617. text-transform:uppercase;
  1618. background:{color:postbg};
  1619. position:absolute;
  1620. text-align:;
  1621. padding:5px 7px 5px 7px;
  1622. font-family:'montserrat';
  1623. font-size:15px;
  1624. margin-top:0px;
  1625. color:{color:highlight};
  1626. display:inline-block;
  1627. border:1px solid {color:pborder};
  1628. }
  1629.  
  1630. .frametype {
  1631. font-size:12px;
  1632. font-weight:bold;
  1633. padding:5px;
  1634. text-align:center;
  1635. min-width:60px;
  1636. display:inline-block;
  1637. text-transform:uppercase;
  1638. color:#fff;
  1639. margin-bottom:10px;
  1640. font-family:montserrat;
  1641. letter-spacing:2px;
  1642. }
  1643.  
  1644.  
  1645. .typebox {
  1646. font-size:12px;
  1647. font-weight:bold;
  1648. padding:5px;
  1649. text-align:center;
  1650. min-width:60px;
  1651. display:inline-block;
  1652. text-transform:uppercase;
  1653. color:#fff;
  1654. position:absolute;
  1655. margin-bottom:10px;
  1656. font-family:montserrat;
  1657. letter-spacing:2px;
  1658. }
  1659.  
  1660. .photo {
  1661.  
  1662. margin-bottom:5px;
  1663. background:{color:highlight};
  1664. }
  1665.  
  1666. .info {
  1667. font-family:'Anonymous Pro';
  1668. font-size: 10px;
  1669. padding:1px 5px 1px 5px;
  1670. text-align:left;
  1671. display:inline-block;
  1672. border-right: 1px solid {color:background};
  1673. }
  1674.  
  1675. .spacer {
  1676. margin-left:70px;
  1677. display:inline block;
  1678.  
  1679. }
  1680. .frame{
  1681. width:310px;
  1682. background-color:{color:entry};
  1683. padding:15px;
  1684. border:1px solid {color:pborder};
  1685. }
  1686. .frame:hover{
  1687. background-color:{color:pborder};
  1688. }
  1689. .frame img {
  1690. max-width:200px;
  1691. text-align:left;
  1692. }
  1693. .cap {
  1694. float:right;
  1695. width:100px;
  1696. font-family:'anonymous pro';
  1697. text-transform:uppercase;
  1698. font-size:20px;
  1699. }
  1700. hr {
  1701. border: 0;
  1702. height: 0;
  1703. margin-top:15px;
  1704. border-top: 1px solid rgba(0, 0, 0, 0.1);
  1705. border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  1706. }
  1707. hr:hover {
  1708. border: 0;
  1709. height: 0;
  1710. margin-top:15px;
  1711. border-top: 1px solid rgba(0, 0, 0, 0.9);
  1712. border-bottom: 1px solid rgba(0, 0, 0, 0.9);
  1713. }
  1714.  
  1715. .asked {
  1716. text-transform:uppercase;
  1717. font-family:'anonymous pro';
  1718. font-size:15px;
  1719. font-weight:bold;
  1720. text-align:right;
  1721. }
  1722. .answerer {
  1723. text-transform:uppercase;
  1724. font-family:'anonymous pro';
  1725. font-size:15px;
  1726. font-weight:bold;
  1727. text-align:right;
  1728.  
  1729. }
  1730. .question {
  1731. text-align:justify;
  1732. }
  1733. .answer {
  1734.  
  1735. }
  1736. .tags {
  1737. width:551px;
  1738. padding:5px;
  1739. text-transform:uppercase;
  1740. font-family:'Montserrat';
  1741. background-color:{color:background};
  1742.  
  1743. }
  1744.  
  1745. .taglinks a{
  1746. display:inline-block;
  1747. background-color:#fff;
  1748. text-transform:uppercase;
  1749. font-family:'anonymous pro';
  1750. padding:5px;
  1751. margin:2px;
  1752. }
  1753. .tags a:hover{
  1754. background-color:{color:highlight};
  1755. color:#fff;
  1756. -webkit-transition: all 0.3s;
  1757. -moz-transition: all 0.3s;
  1758. transition: all 0.3s;
  1759. }
  1760.  
  1761. .contbod{
  1762. padding-top:20px;
  1763. padding-bottom:20px;
  1764. }
  1765. .botinfo {
  1766. font-family:'Montserrat';
  1767. font-weight:bold;
  1768. text-transform:uppercase;
  1769. }
  1770.  
  1771.  
  1772. #acont{
  1773. z-index:2;
  1774. display:block;
  1775. width: 100px;
  1776.  
  1777. margin: 155px 0px 0px 155px;
  1778. height:100px;
  1779. background-color:#ffffff;
  1780. opacity:0.2;
  1781. position:absolute;
  1782. }
  1783.  
  1784. #acont:hover{
  1785. -webkit-transition: all 0.2s ease-in-out;
  1786. -moz-transition: all 0.2s ease-in-out;
  1787. -o-transition: all 0.2s ease-in-out;
  1788. transition: all 0.2s ease-in-out;
  1789. opacity:0.6;}
  1790.  
  1791. #audioplayer{
  1792. width:20px;
  1793. height:20px;
  1794. margin:40px 0px 0px 35px;
  1795. overflow:hidden;
  1796. background-color:transparent;}
  1797.  
  1798. .atext {
  1799. z-index:9998;
  1800. line-height: 7px;
  1801. position:absolute;
  1802. letter-spacing: 2px;
  1803. color: {color:link}!important;
  1804. text-transform:;
  1805. margin-
  1806. height:18px;
  1807. text-decoration: none;
  1808. display: inline-block;
  1809. padding:20px;
  1810. width:470px;
  1811. text-align:center;}
  1812.  
  1813. .atext:hover {
  1814. color:{color:link};
  1815. -webkit-transition: opacity 0.7s linear;
  1816. opacity: 0.9s;
  1817. -webkit-transition: all 0.6s ease-out;
  1818. -moz-transition: all 0.6s ease-out;
  1819. transition: all 0.6s ease-out;
  1820. }
  1821.  
  1822. .audio{
  1823. margin: 45px 0px 0px 45px;
  1824. position:absolute;
  1825.  
  1826. z-index:2;
  1827. width:40px;
  1828. height:40px;}
  1829.  
  1830. .aimg{
  1831. margin: 155px 0px 0px 155px;
  1832. width:100px;
  1833. height:100px;
  1834. position:absolute;}
  1835.  
  1836. .aimg img{
  1837. float:left;
  1838. opacity:1;
  1839. width:100px;
  1840. }
  1841.  
  1842. .albumimg{
  1843. width:500px;
  1844. height:500px;
  1845. z-index:1;
  1846. overflow:hidden;
  1847. background-color:#ffffff;
  1848. opacity:0.7;
  1849. position:absolute;}
  1850.  
  1851. .albumimg img{
  1852. float:left;
  1853. opacity:0.6;
  1854. width:600px;
  1855. margin-top:-50px;
  1856. margin-left:-50px;
  1857. -webkit-filter: blur(10px);
  1858. }
  1859.  
  1860. .audiopost{
  1861. min-height:550px;
  1862. }
  1863. .audiocont{
  1864. float:center;
  1865. }
  1866. .audiocap{
  1867. margin-top:500px;
  1868. display:block;
  1869. }
  1870.  
  1871.  
  1872. .open {
  1873. background-color: #fff;
  1874. height:660px;
  1875. list-style: none;
  1876. margin: 0;
  1877. padding:0;
  1878. overflow:auto;
  1879. }
  1880. .open::-webkit-scrollbar{
  1881. width:0.8em;
  1882. height:0.8em;
  1883. background-color:#fff;
  1884. }
  1885. .open::-webkit-scrollbar-thumb{
  1886. min-height:0.8em;
  1887. min-width:0.8em;
  1888. -webkit-border-radius:4px;
  1889. background-color: #ddd;
  1890. }
  1891.  
  1892. </style>
  1893. </head>
  1894. <body>
  1895.  
  1896. <div id="top">
  1897. <center> <h1><span class="toptitle one"><a href="/">[ hope world ]</a></span><br>
  1898.  
  1899. </h1></center>
  1900.  
  1901. </div>
  1902.  
  1903.  
  1904.  
  1905. <section class="hero">
  1906. <h1> <span class="spantitle two">
  1907. FY/JHOPE</span>
  1908. </h1>
  1909.  
  1910. </section>
  1911.  
  1912.  
  1913. <nav>
  1914.  
  1915.  
  1916.  
  1917.  
  1918. <div class='wrapper'>
  1919. <div id="overlay"></div>
  1920. <div class="megamenu_container megamenu_dark_bar megamenu_light"><!-- Begin Menu Container -->
  1921. <ul class="megamenu"><!-- Begin Mega Menu -->
  1922. <li><a href="#_" class="megamenu_drop">INDEX</a><!-- Begin Item -->
  1923.  
  1924.  
  1925. <div class="dropdown_fullwidth"><!-- Begin Item Container -->
  1926.  
  1927. <div class="col_4">
  1928.  
  1929. <h3>WELCOME</h3>
  1930. <p>{Description}</p>
  1931.  
  1932. </div>
  1933.  
  1934. <div class="col_4">
  1935.  
  1936. <img src='http://puu.sh/fbkKl/c747286551.jpg'></img>
  1937. </div>
  1938.  
  1939. <div class="col_4">
  1940.  
  1941. <h3>Quick Tags</h3>
  1942.  
  1943. </div>
  1944.  
  1945. <div class="col_2 responsive_halfs">
  1946.  
  1947. <ul class="list_unstyled">
  1948. <li><a href="/tagged/v:fancam">Fancam</a></li><br>
  1949. <li><a href="/tagged/p:twitter">Twitter</a></li><br>
  1950. <li><a href="/tagged/p:selca">Selca</a></li>
  1951.  
  1952. </ul>
  1953. </div>
  1954.  
  1955. <div class="col_2 responsive_halfs">
  1956.  
  1957. <ul class="list_unstyled">
  1958. <li><a href="/tagged/p:airport">Airport</a></li><br>
  1959. <li><a href="/tagged/e:fansign">Fansign</a></li><br>
  1960. <li><a href="/tagged/e:concert">Concert</a></li>
  1961. </ul>
  1962. </div>
  1963.  
  1964. <div class="col_12">
  1965. <hr>
  1966. </div>
  1967.  
  1968. <div class="col_1 responsive_sixths">
  1969. <a href="#_"><span class="social_icon"></span></a>
  1970. </div>
  1971.  
  1972. <div class="col_1 responsive_sixths">
  1973. <a href="#_"><span class="social_icon"></span></a>
  1974. </div>
  1975.  
  1976. <div class="col_1 responsive_sixths">
  1977. <a href="#_"><span class="social_icon"></span></a>
  1978. </div>
  1979.  
  1980. <div class="col_1 responsive_sixths">
  1981. <a href="#_"><span class="social_icon"></span></a>
  1982. </div>
  1983.  
  1984. <div class="col_1 responsive_sixths">
  1985. <a href="#_"><span class="social_icon"></span></a>
  1986. </div>
  1987.  
  1988. <div class="col_1 responsive_sixths">
  1989. <a href="#_"><span class="social_icon"></span></a>
  1990. </div>
  1991.  
  1992. <div class="col_1 responsive_sixths">
  1993. <a href="#_"><span class="social_icon"></span></a>
  1994. </div>
  1995.  
  1996. <div class="col_1 responsive_sixths">
  1997. <a href="#_"><span class="social_icon"></span></a>
  1998. </div>
  1999.  
  2000. <div class="col_1 responsive_sixths">
  2001. <a href="#_"><span class="social_icon"></span></a>
  2002. </div>
  2003.  
  2004. <div class="col_1 responsive_sixths">
  2005. <a href="#_"><span class="social_icon"></span></a>
  2006. </div>
  2007.  
  2008. <div class="col_1 responsive_sixths">
  2009. <a href="#_"><span class="social_icon"></span></a>
  2010. </div>
  2011.  
  2012. <div class="col_1 responsive_sixths">
  2013. <a href="#_"><span class="social_icon"></span></a>
  2014. </div>
  2015.  
  2016.  
  2017. </div><!-- End Item Container -->
  2018.  
  2019.  
  2020. </li><!-- End Item -->
  2021.  
  2022.  
  2023.  
  2024. <li><a href="#_" class="megamenu_drop">About</a><!-- Begin Item -->
  2025.  
  2026.  
  2027. <div class="dropdown_8columns dropdown_container"><!-- Begin Item Container -->
  2028.  
  2029.  
  2030. <div class="col_7">
  2031.  
  2032. <h2>About JHOPE</h2>
  2033.  
  2034. </div>
  2035. <div class="col_3">
  2036.  
  2037. <h2>About JHOPE</h2>
  2038.  
  2039. </div>
  2040.  
  2041. <div class="col_7 clearfix">
  2042. <iframe width="520" height="315" src="https://www.youtube.com/embed/DuhNpxD2d0A" frameborder="0" allowfullscreen></iframe>
  2043. <p>
  2044. <img style="padding-right:10px;" src="http://media.tumblr.com/75e38eeb7d42fd7d05fa53ce6b294fd5/tumblr_inline_mx2csoNLPl1st5tgw.png"width="250px" align="left">
  2045.  
  2046. Stage Name: J-Hope (제이홉) <br>
  2047.  
  2048. Real Name: Jung Hoseok (정호석)<br>
  2049.  
  2050. Nicknames: Hope, Hobi, J-Horse<br>
  2051.  
  2052. Position: Rapper, Dancer<br>
  2053.  
  2054. Birthdate: February 18, 1994
  2055. <br>
  2056. Hometown: Gwangju<br>
  2057.  
  2058. Blood Type: A<br>
  2059.  
  2060. Height: 177 cm</p>
  2061.  
  2062. </div>
  2063.  
  2064. <div class="col_5">
  2065.  
  2066.  
  2067.  
  2068. <p class="paragraph_icon"><span class="mini_icon ic_archive"></span>"Since I like the sea, I want to hold her hand while walking on the beach. I’m a kinda romantic guy (laughs)." trans</p>
  2069. <p class="paragraph_icon"><span class="mini_icon ic_bookmark"></span>gets spooked easily</p>
  2070. <p class="paragraph_icon"><span class="mini_icon ic_brush"></span>influences: Beenzino, A$AP Rocky</p>
  2071. <p class="paragraph_icon"><span class="mini_icon ic_cloud"></span>"I'm your Hope!" corny ass catchphrase</p>
  2072. <p class="paragraph_icon"><span class="mini_icon ic_favorite"></span>
  2073. "My name has the deepest meaning out of all the others in this group. (laughs) You know how in Pandora’s Box after everything else left, the only thing remaining was hope, right? I put “hope” in my name to be a hopeful existence in the group. I got the “J” from my last name, Jung. That’s how I became J-Hope." trans</p>
  2074. <p class="paragraph_icon"><span class="mini_icon ic_chat"></span>predebut: auditioned for JYP before getting into Big Hit<br>
  2075. predebut: featured in Jo Kwon's Animal<br>
  2076. predebut: underground street dance team, NEURON</p>
  2077. <p class="paragraph_icon"><span class="mini_icon ic_cancel"></span>"I like a hopeful, optimistic girl. I want to quickly meet someone who can make my heart beat!" trans</p>
  2078.  
  2079.  
  2080.  
  2081.  
  2082.  
  2083.  
  2084.  
  2085. </div>
  2086.  
  2087.  
  2088. </div><!-- End Item Container -->
  2089.  
  2090.  
  2091. </li><!-- End Item -->
  2092.  
  2093.  
  2094.  
  2095. <li><a href="#_" class="megamenu_drop">Tags</a><!-- Begin Item -->
  2096.  
  2097.  
  2098. <div class="dropdown_8columns dropdown_container"><!-- Begin Item Container -->
  2099.  
  2100.  
  2101.  
  2102. <h2>Tags</h2>
  2103. <div class="col_12">
  2104. <div class="col_6"> <br>
  2105. <p class="blue"><b>Country:</b> <br>
  2106. <a href="/tagged/c:brazil">Brazil</a>
  2107. <a href="/tagged/c:china">China</a>
  2108. <a href="/tagged/c:germany">Germany</a>
  2109. <a href="/tagged/c:hong kong">Hong Kong</a>
  2110. <a href="/tagged/c:japan">Japan</a>
  2111. <a href="/tagged/c:mexico">Mexico</a>
  2112. <a href="/tagged/c:russia">Russia</a>
  2113. <a href="/tagged/c:singapore">Singapore</a>
  2114. <a href="/tagged/c:sweden">Sweden</a>
  2115. <a href="/tagged/c:thailand">Thailand</a>
  2116. <a href="/tagged/c:usa">USA</a>
  2117.  
  2118. </p>
  2119. <p class="grey"><b>Pictures:</b> <br>
  2120.  
  2121. <a href="/tagged/e:appearance">Appearance</a>
  2122. <a href="/tagged/p:airport">Airport</a>
  2123. <a href="/tagged/p:album">Album</a>
  2124. <a href="/tagged/p:bts">BTS</a>
  2125. <a href="/tagged/p:editable">Editable (with credit)</a>
  2126. <a href="/tagged/p:fancafe">Fancafe</a>
  2127. <a href="/tagged/p:fantaken">Fantaken</a>
  2128. <a href="/tagged/p:instagram">Instagram</a>
  2129. <a href="/tagged/p:magazine">Magazine</a>
  2130. <a href="/tagged/p:news">News</a>
  2131. <a href="/tagged/p:ps">Photohhoot</a>
  2132. <a href="/tagged/p:predebut">Pre-Debut</a>
  2133. <a href="/tagged/p:preview">Preview</a>
  2134. <a href="/tagged/p:scan">Scan</a>
  2135. <a href="/tagged/p:selca">Selca</a>
  2136. <a href="/tagged/p:twitter">Twitter</a>
  2137. <a href="/tagged/p:weibo">Weibo</a>
  2138.  
  2139.  
  2140.  
  2141. </p>
  2142.  
  2143. <p class="orange"><b>With Member:</b><br>
  2144. <a href="/tagged/w:rap%20monster">Rap Monster</a>
  2145. <a href="/tagged/w:jin">Jin</a>
  2146. <a href="/tagged/w:suga">Suga</a>
  2147. <a href="/tagged/w:jimin">Jimin</a>
  2148. <a href="/tagged/w:v">V</a>
  2149. <a href="/tagged/w:jungkook">Jungkook</a>
  2150. <a href="/tagged/w:ot7">OT7</a>
  2151. </p>
  2152.  
  2153. <p class="dark"><b>Events:</b><br>
  2154. <a href="/tagged/e:appearance">Appearance</a>
  2155. <a href="/tagged/e:awards%20show">Awards Show</a>
  2156. <a href="/tagged/e:concert">Concert</a>
  2157. <a href="/tagged/e:fanmeet">Fan Meet</a>
  2158. <a href="/tagged/e:fansign">Fan Sign</a>
  2159. <a href="/tagged/e:festival">Festival</a>
  2160. <a href="/tagged/e:music%20show">Music Show</a>
  2161. <a href="/tagged/e:performance">Performance</a>
  2162. <a href="/tagged/e:press%20con">Press Conference</a>
  2163. <a href="/tagged/e:radio%20show">Radio Show</a>
  2164. <a href="/tagged/e:showcase">Showcase</a>
  2165. <a href="/tagged/e:talk%20show">Talk Show</a>
  2166. <a href="tagged/e:other">Other</a>
  2167. </p>
  2168. </div>
  2169.  
  2170. <div class="col_6">
  2171. <p class="purple">
  2172. <b>MISC:</b><br>
  2173. <a href="/tagged/autograph">Autograph</a>
  2174. <a href="/tagged/chu~">Chu~</a>
  2175. <a href="/tagged/eye%20contact">Eye Contact</a>
  2176. <a href="/tagged/eye%20smile">Eye Smile</a>
  2177. <a href="/tagged/hands">Hands</a>
  2178. <a href="/tagged/handwriting">Handwriting</a>
  2179. <a href="/tagged/heart">Heart</a>
  2180. <a href="/tagged/Mickey">Mickey</a>
  2181. <a href="/tagged/p:photographer!suga">Photographer!Suga</a>
  2182. <a href="/tagged/profile">Profile</a>
  2183. <a href="/tagged/shoes">Shoes</a>
  2184. <a href="/tagged/천사">천사</a>
  2185. <a href="/tagged/ㅋㅋ">ㅋㅋ</a>
  2186. <a href="tagged/ㅠㅠ">ㅠㅠ</a>
  2187. </p>
  2188.  
  2189.  
  2190. <p class="blue">
  2191. <b>TEXT:</b><br>
  2192. <a href="/tagged/t:blog">Blog</a>
  2193. <a href="/tagged/t:eng%20trans">Eng Trans~</a>
  2194. <a href="/tagged/t:fancafe">Fancafe</a>
  2195. <a href="/tagged/t:info">Info</a>
  2196. <a href="/tagged/t:interview">Interview</a>
  2197. <a href="/tagged/t:twitter">Twitter</a>
  2198. </p>
  2199.  
  2200. <p class="grey">
  2201. <b>VIDEOS:</b><br>
  2202. <a href="/tagged/v:bangtan%20bomb">Bangtan Bomb</a>
  2203. <a href="/tagged/v:eng%20sub">Eng Subtitles</a>
  2204. <a href="/tagged/v:fancam">Fancam</a>
  2205. <a href="/tagged/v:interview">Interview</a>
  2206. <a href="/tagged/v:music%20show">Music Show</a>
  2207. <a href="/tagged/v:mv">MV</a>
  2208. <a href="/tagged/v:performance">Performance</a>
  2209. <a href="/tagged/v:preview">Preview</a>
  2210. <a href="/tagged/v:teaser">Teaser</a>
  2211. <a href="/tagged/v:vine">Vine</a>
  2212. <a href="/tagged/v:log">Vlog</a>
  2213. <a href="/tagged/v:other">Other</a>
  2214. </p>
  2215.  
  2216.  
  2217. <p class="orange">
  2218. <b>OTHER:</b><br> <a href="/tagged/130612">SHOWCASE: 2 Cool 4 Skool</a>
  2219. <a href="/tagged/rookie-king">TV: Rookie King</a>
  2220. <a href="/tagged/140211">SHOWCASE: Skool Luv Affair</a>
  2221. <a href="/tagged/Muster">1st Fanmeeting: Muster</a>
  2222. <a href="/tagged/BTS-Festa">1st Year Countdown: BTS Festa</a>
  2223. <a href="/tagged/american%20hustle%20life">TV: American Hustle Life</a>
  2224. <a href="/tagged/kcon-2014">KCON 2014</a>
  2225. <a href="/tagged/140819">SHOWCASE: Dark &amp; Wild</a>
  2226. <a href="/tagged/1st-china-fanmeet">1st Fanmeeting: in China</a>
  2227. <a href="/tagged/the-red-bullet">1st Solo Concert: The Red Bullet</a>
  2228.  
  2229. </p>
  2230.  
  2231. </div>
  2232. </div>
  2233.  
  2234.  
  2235. </div><!-- End Item container -->
  2236.  
  2237.  
  2238. </li><!-- End Item -->
  2239.  
  2240.  
  2241.  
  2242. <li><a href="#_" class="megamenu_drop">Fansites & MEDIA</a><!-- Begin Item -->
  2243.  
  2244.  
  2245. <div class="dropdown_fullwidth"><!-- Begin Item container -->
  2246.  
  2247.  
  2248. <div class="col_6">
  2249.  
  2250. <h2>FANSITES (JHOPE)</h2>
  2251.  
  2252. <table class="table_dark">
  2253.  
  2254. <tr>
  2255. <td><a href="https://twitter.com/Haebalagi_0218">해바라기</A>
  2256. <td>
  2257. <a href="http://weibo.com/u/3528982502">J-HOPE Baidu Bar</A></td>
  2258. <td>
  2259. <a href="https://twitter.com/beaniehope218">BEANIE HOPE</A>
  2260.  
  2261. </td>
  2262. <td><a href="https://twitter.com/_violet218">BRILLIANT VIOLET</A></td>
  2263. </tr>
  2264.  
  2265. <tr>
  2266. <td>
  2267. <a href="http://chubbypuppy.tistory.com/">CHUBBY PUPPY</A></td>
  2268. <td>
  2269. <a href="http://dearhope94.tistory.com/">DEAR HOPE</A></td>
  2270. <td>
  2271. <a href="http://firstcrush.tistory.com/">FIRST CRUSH</A></td>
  2272. <td>
  2273. <a href="https://twitter.com/freedomhopehope/">FREEDOM HOPE</A></td>
  2274.  
  2275. </tr>
  2276.  
  2277. <tr>
  2278. <td>
  2279. <a href="https://twitter.com/GeneofHOPE/">GENE OF HOPE</A></td>
  2280. <td>
  2281. <a href-"http://weibo.com/greenocean218/">GREEN OCEAN</A></td>
  2282. <td>
  2283. <a href="https://twitter.com/HO_B0218/">HO! B</A></td>
  2284. <td>
  2285. <a href="https://twitter.com/HOPEINS2/">HOPE IN LOVE</A>
  2286. </td>
  2287.  
  2288. </tr>
  2289.  
  2290. <tr>
  2291. <td><a href="http://hopesmiling0218.tistory.com/">HOPE SMILING</A></td>
  2292. <td>
  2293. <a href="http://hopestep218.tistory.com/">HOPESTEP218</A></td>
  2294. <td>
  2295. <a href="http://19940218.net/">HOPE TREE</A></td>
  2296. <td>
  2297. <a href="http://junghoseok.com/">HOPE'S MIRACULOUS</A></td>
  2298.  
  2299. </tr>
  2300.  
  2301.  
  2302. <tr>
  2303. <td>
  2304. <a href="https://twitter.com/19940218_com/">HOPE WORLD</A></td>
  2305. <td>
  2306. <a href="http://19940218in.weebly.com/">HOPIN'</A></td>
  2307. <td>
  2308. <a href="http://jhopestar.tistory.com/">J-HOPE STAR</A></td>
  2309. <td>
  2310. <a href="https://twitter.com/Lilas_hope/">LILAS HOPE</A></td>
  2311.  
  2312. </tr>
  2313.  
  2314.  
  2315. <tr>
  2316. <td>
  2317. <a href="https://twitter.com/x940218x/">PUNCHLINE</A></td>
  2318. <td></td>
  2319. <td></td>
  2320. <td></td>
  2321.  
  2322. </tr>
  2323. </table>
  2324.  
  2325. <h2>FANSITES (GROUP)</h2>
  2326.  
  2327. <table class="table_light">
  2328.  
  2329. <tr>
  2330. <td>
  2331. <a href="http://blog.daum.net/magicting">효정_Acha.m</A></td>
  2332. <td>
  2333. <a href="http://weibo.com/armystyle0612">ARMYSTYLE CHINA</A></td>
  2334. <td>
  2335. <a href="https://twitter.com/AB_V1230">AIR BRIDGE</A></td>
  2336. <td>
  2337. <a href="https://twitter.com/chocolateboxbts">CHOCOLATE BOX</A></td>
  2338. </tr>
  2339. <tr>
  2340. <td>
  2341. <a href="https://twitter.com/EternalSnow_613">ETERNAL SNOW</A></td>
  2342. <td>
  2343. <a href="http://okbts.tistory.com/">EVERYTHING IS OK</A></td>
  2344. <td>
  2345. <a href="https://twitter.com/HOPEfulMINutes">HOPEFUL MINUTES</A></td>
  2346. <td>
  2347. <a href="http://idollove.ivyro.net/">IDOLLOVE</A></td>
  2348. </tr>
  2349. <tr>
  2350. <td>
  2351. <a href="http://jhope_suga.blog.me">KEEP GOING</A></td>
  2352. <td>
  2353. <a href="http://marshmallow9293.tistory.com/">MARSHMALLOW</A></td>
  2354. <td>
  2355. <a href="https://twitter.com/mkt_bts">milktea♡</A></td>
  2356. <td>
  2357. <a href="https://twitter.com/mischief_bts">MISCHIEF MANAGED</A></td>
  2358. </tr>
  2359. <tr>
  2360. <td>
  2361. <a href="http://weibo.com/u/5291940016">SUN OASIS</A></td>
  2362. <td>
  2363. <a href="http://0218-0912.tistory.com/">SWAG BOYS</A></td>
  2364. <td>
  2365. <a href="http://bts69xxx.tumblr.com/">XXX</A>/td>
  2366. <td></td>
  2367.  
  2368. </tr>
  2369. </table>
  2370.  
  2371. </div>
  2372.  
  2373. <div class="col_6">
  2374.  
  2375. <h2>Bangtan Bomb</h2>
  2376. <p>Description of video here! Something about J-hope being fiooooooone as hell probably. Maybe his rapmon disstrack? let's find out.</p>
  2377. <div class="video_container">
  2378. <iframe width="400" height="250" src="https://www.youtube.com/embed/oH7ofZlN-44" frameborder="0" allowfullscreen></iframe>
  2379. </div>
  2380. <p>Phasellus molestie facilisis orci ut bibendum. Aliquam accumsan eros sit amet metus egestas porta. Aenean at sapien leo. Aliquam dapibus sem ac arcu bibendum dignissim. Ut ac sapien ligula, et convallis diam.</p>
  2381.  
  2382. </div>
  2383.  
  2384.  
  2385. </div><!-- End Item Container -->
  2386.  
  2387.  
  2388. </li><!-- End Item -->
  2389.  
  2390.  
  2391.  
  2392. <li><a href="#_" class="megamenu_drop">Contact</a><!-- Begin Item -->
  2393.  
  2394.  
  2395. <div class="dropdown_4columns dropdown_container"><!-- Begin Item Container -->
  2396.  
  2397.  
  2398. <div class="col_12">
  2399.  
  2400. <h3>Contact Us!</h3>
  2401.  
  2402.  
  2403. <p><iframe frameborder="0" scrolling="no" width="100%" height="190" src="http://www.tumblr.com/ask_form/{Name}.tumblr.com" style="background-color:transparent; overflow:hidden;" id="ask_form"></iframe><!--[if IE]><script type="text/javascript">document.getElementById('ask_form').allowTransparency=true;</script><![endif]--></p>
  2404.  
  2405.  
  2406. </div>
  2407.  
  2408.  
  2409. </div><!-- End Item Container -->
  2410.  
  2411.  
  2412. </li><!-- End Item -->
  2413.  
  2414.  
  2415.  
  2416. <li><a href="#_" class="megamenu_drop">Official</a><!-- Begin Item -->
  2417.  
  2418.  
  2419. <div class="dropdown_2columns dropdown_container"><!-- Begin Item Container -->
  2420.  
  2421.  
  2422. <ul class="dropdown_flyout">
  2423.  
  2424.  
  2425. <li><a href="http://bangtan.tistory.com/">BLOG</A></li>
  2426. <li><a href="https://www.facebook.com/bangtan.official">FACEBOOK</A></li>
  2427. <li><a href="http://cafe.daum.net/BANGTAN">FANCAFE</A></li>
  2428. <li><a href="https://soundcloud.com/bangtan">SOUNDCLOUD</A></li>
  2429. <li><a href="https://twitter.com/bts_twt">TWITTER (BTS)</A></li>
  2430. <li><a href="https://twitter.com/bts_bighit">TWITTER (OFFICIAL)</A></li>
  2431. <li><a href="http://bts.ibighit.com">WEBSITE (OFFICIAL)</A></li>
  2432. <li><a href="http://www.weibo.com/ibighit">WEIBO (BIG HIT ENT)</A></li>
  2433. <li><a href="http://www.youtube.com/BANGTANTV">YOUTUBE</A></li>
  2434.  
  2435. </ul>
  2436.  
  2437. </div><!-- End Item Container -->
  2438.  
  2439.  
  2440. </li><!-- End Item -->
  2441.  
  2442.  
  2443.  
  2444.  
  2445. <li class="megamenu_right">
  2446. </li><!-- End Right Item -->
  2447.  
  2448.  
  2449. </ul><!-- End Mega Menu -->
  2450. </div><!-- End Menu Container -->
  2451.  
  2452. </div><!-- End Wrapper -->
  2453. </nav>
  2454.  
  2455. <div id="post">
  2456.  
  2457. <div id="sidecont">
  2458.  
  2459.  
  2460. <h1><i class="fa fa-search"></i> Search</h1><hr><br>
  2461. <form onsubmit="return handleThis(this)" class="search-wrapper cf">
  2462. <input type="text" placeholder="ex) Jhope, Jimin" required="" name="number"/>
  2463. <button type="submit" value="Submit"><i class="fa fa-search"></i>
  2464. </button>
  2465. </form>
  2466. <br>
  2467. <h1><i class="fa fa-camera"></i> special events</h1> <hr><br>
  2468.  
  2469.  
  2470.  
  2471.  
  2472.  
  2473. <div class="contain">
  2474. <ul class="open">
  2475.  
  2476.  
  2477. <a href="/tagged/{text:tag 1}">
  2478. <div class="frame">
  2479. <img src="{text:PhotoURL 1}">
  2480. <span class="cap"><span class="frametype photo">{Text:Type 1}</span><br><hr>{Text:Title 1}</span>
  2481. </div></a>
  2482.  
  2483. <a href="/tagged/{text:tag 2}">
  2484. <div class="frame">
  2485. <img src="{text:PhotoURL 2}">
  2486. <span class="cap"><span class="frametype photo">{Text:Type 2}</span><br><hr>{Text:Title 2}</span>
  2487. </div></a>
  2488.  
  2489.  
  2490.  
  2491. <a href="/tagged/{text:tag 3}">
  2492. <div class="frame">
  2493. <img src="{text:PhotoURL 3}">
  2494. <span class="cap"><span class="frametype photo">{Text:Type 3}</span><br><hr>{Text:Title 3}</span>
  2495. </div></a>
  2496.  
  2497.  
  2498. <a href="/tagged/{text:tag 4}">
  2499. <div class="frame">
  2500. <img src="{text:PhotoURL 4}">
  2501. <span class="cap"><span class="frametype photo">{Text:Type 4}</span><br><hr>{Text:Title 4}</span>
  2502. </div></a>
  2503.  
  2504.  
  2505. <a href="/tagged/{text:tag 5}">
  2506. <div class="frame">
  2507. <img src="{text:PhotoURL 5}">
  2508. <span class="cap"><span class="frametype photo">{Text:Type 5}</span><br><hr>{Text:Title 5}</span>
  2509. </div></a>
  2510.  
  2511. <a href="/tagged/{text:tag 6}">
  2512. <div class="frame">
  2513. <img src="{text:PhotoURL 6}">
  2514. <span class="cap"><span class="frametype photo">{Text:Type 6}</span><br><hr>{Text:Title 6}</span>
  2515. </div></a>
  2516.  
  2517.  
  2518. <a href="/tagged/{text:tag 7}">
  2519. <div class="frame">
  2520. <img src="{text:PhotoURL 7}">
  2521. <span class="cap"><span class="frametype photo">{Text:Type 7}</span><br><hr>{Text:Title 7}</span>
  2522. </div></a>
  2523.  
  2524.  
  2525.  
  2526.  
  2527. <a href="/tagged/{text:tag 8}">
  2528. <div class="frame">
  2529. <img src="{text:PhotoURL 8}">
  2530. <span class="cap"><span class="frametype photo">{Text:Type 8}</span><br><hr>{Text:Title 8}</span>
  2531. </div></a>
  2532.  
  2533.  
  2534. </ul>
  2535. </div>
  2536.  
  2537.  
  2538.  
  2539.  
  2540.  
  2541.  
  2542.  
  2543.  
  2544.  
  2545.  
  2546.  
  2547.  
  2548. <br>
  2549. <h1><i class="fa fa-twitter"></i> BTS_TWT</h1> <hr><br>
  2550. <a class="twitter-timeline" href="https://twitter.com/BTS_twt" data-widget-id="563588927089438720"></a>
  2551. <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
  2552.  
  2553.  
  2554. </div>
  2555. <br><br>
  2556.  
  2557.  
  2558.  
  2559.  
  2560. {block:Posts}
  2561.  
  2562.  
  2563. <div id="entries">
  2564. <!-- Text -->
  2565. {block:Text}
  2566. <div id="entry">
  2567. <!--Start INFOBOX-->
  2568.  
  2569. <div id="infobox">
  2570. <span class="typebox photo">TEXT
  2571. </span>
  2572. <div class="spacer">
  2573. <span class="info"><a href="{Permalink}">POSTED ON<br></a>
  2574. {Block:Date}<b><a href="{Permalink}"><i class="fa fa-clock-o"></i> <a href="{Permalink}">{ShortYear}/{MonthNumberWithZero}/{DayOfMonthWithZero}</b></a>{/Block:Date}
  2575. </span>
  2576. <span class="info">
  2577. <b><i class="fa fa-heart-o"></i> {block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}</b><br>
  2578. {block:ContentSource}
  2579. <i class="fa fa-home"></i> <a href="{SourceURL}">{SourceTitle}</a>
  2580. {/block:ContentSource} {block:RebloggedFrom}(<i class="fa fa-refresh"></i> REBLOGGED FROM <a href="{ReblogParentURL}">{ReblogParentName}</a>){/block:RebloggedFrom}
  2581. </b></span></b>
  2582. </div>
  2583. </div>
  2584. <!--End INFOBOX-->
  2585. {block:Title}<font style="text-align:right; FONT-WEIGHT: normal; COLOR: {color:highlight}; font:bold 25px 'montserrat', serif; text-transform:uppercase; letter-spacing:5px;">{Title}</font>{/block:Title}
  2586.  
  2587. <div class="contbod">
  2588. {Body}
  2589. </div>
  2590. </div>
  2591. {/block:Text}
  2592.  
  2593.  
  2594.  
  2595.  
  2596.  
  2597.  
  2598.  
  2599.  
  2600.  
  2601.  
  2602. {block:Photo}
  2603.  
  2604. <!-- Photo -->
  2605. <div id="entry">
  2606. <!--Start INFOBOX-->
  2607.  
  2608. <div id="infobox">
  2609. <span class="typebox photo">photo
  2610. </span>
  2611. <div class="spacer">
  2612. <span class="info">POSTED ON<br>
  2613. {Block:Date}<b><a href="{Permalink}"><i class="fa fa-clock-o"></i> {ShortYear}/{MonthNumberWithZero}/{DayOfMonthWithZero}</a></b>{/Block:Date}
  2614. </span>
  2615. </div>
  2616. <br>
  2617. </div>
  2618. <!--End INFOBOX-->
  2619. {LinkOpenTag}
  2620. <img src="{PhotoURL-500}" alt="{PhotoAlt}" width="500px">
  2621. {LinkCloseTag}
  2622. {block:Caption}<p>{Caption}</p>{/block:Caption}
  2623. <div class="botinfo">
  2624. {block:NoteCount}<div style="float:left">
  2625. <i class="fa fa-heart-o"></i> {NoteCountWithLabel}{/block:NoteCount}</div>
  2626. <div style="float:right">{block:ContentSource}
  2627. <i class="fa fa-home"></i> <a href="{SourceURL}">{SourceTitle}</a>
  2628. {/block:ContentSource} {block:RebloggedFrom}(<i class="fa fa-refresh"></i> REBLOGGED BY <a href="{ReblogParentURL}">{ReblogParentName}</a>)</div>{/block:RebloggedFrom}
  2629. </div><br>
  2630.  
  2631. </div>
  2632.  
  2633.  
  2634. {/block:Photo}
  2635.  
  2636.  
  2637.  
  2638.  
  2639.  
  2640. <!-- Message -->
  2641.  
  2642.  
  2643. {block:Answer}
  2644. <div id="entry">
  2645. <!--Start INFOBOX-->
  2646.  
  2647. <div id="infobox">
  2648. <span class="typebox photo">ASK
  2649. </span>
  2650. <div class="spacer">
  2651. <span class="info">POSTED ON<br>
  2652. {Block:Date}<b><a href="{Permalink}"><i class="fa fa-clock-o"></i> {ShortYear}/{MonthNumberWithZero}/{DayOfMonthWithZero}</a></b>{/Block:Date}
  2653. </span>
  2654. </div>
  2655. <br>
  2656. </div>
  2657. <!--End INFOBOX-->
  2658.  
  2659. <img style="width:128px; margin-bottom:10px; margin-right:15px;" src="{AskerPortraitURL-128}" align="left">
  2660.  
  2661. <div class="asked">{Asker} asked</div>
  2662. <div class="question">{Question}</div>
  2663.  
  2664. <hr>
  2665. <div class="answerer">FY! JHOPE</div>
  2666. <div class="answer">{Answer}</div>
  2667. </div>
  2668. {/block:Answer}
  2669.  
  2670.  
  2671.  
  2672.  
  2673. <!-- Photoset -->
  2674.  
  2675. {block:Photoset}
  2676. <div id="entry">
  2677. <!--Start INFOBOX-->
  2678.  
  2679. <div id="infobox">
  2680. <span class="typebox photo">photo
  2681. </span>
  2682. <div class="spacer">
  2683. <span class="info">POSTED ON<br>
  2684. {Block:Date}<b><a href="{Permalink}"><i class="fa fa-clock-o"></i> {ShortYear}/{MonthNumberWithZero}/{DayOfMonthWithZero}</a></b>{/Block:Date}
  2685. </span>
  2686. </div>
  2687. <br>
  2688. </div>
  2689. <!--End INFOBOX-->
  2690. {Photoset}
  2691. {block:Caption}<p>{Caption}</p>{/block:Caption}
  2692. </div>
  2693. {/block:Photoset}
  2694.  
  2695.  
  2696. <!-- Quote -->
  2697. {block:Quote}
  2698.  
  2699. <div id="entry">
  2700. <!--Start INFOBOX-->
  2701.  
  2702. <div id="infobox">
  2703. <span class="typebox photo">QUOTE
  2704. </span>
  2705. <div class="spacer">
  2706. <span class="info">POSTED ON<br>
  2707. {Block:Date}<b><a href="{Permalink}"><i class="fa fa-clock-o"></i> {ShortYear}/{MonthNumberWithZero}/{DayOfMonthWithZero}</a></b>{/Block:Date}
  2708. </span>
  2709. </div>
  2710. <br>
  2711. </div>
  2712. <!--End INFOBOX-->
  2713. <div class="contbod">
  2714. <span style="color:{color:highlight};font-size:30px;font-family:Georgia;float:left">
  2715. <i class="fa fa-quote-left"></i></i></span>
  2716. <div style="border-left:1px solid #F1F1F1; margin-left:37px; padding:9px;"><span class="quote"><font style="text-align:right; FONT-WEIGHT: normal; COLOR: {color:links}; font:normal 15px 'Roboto', serif; text-transform:uppercase; letter-spacing:5px;">{quote}</font><br>
  2717. {block:Source}— <FONT style="FONT-WEIGHT: normal; FONT-SIZE: 5pt; TEXT-TRANSFORM: uppercase; COLOR: {color:link}; font-style:; LINE-HEIGHT: 8pt; LETTER-SPACING: 3pt; text-transform:;">{Source}</font>{/block:Source}
  2718. </div></div>
  2719. </div>
  2720. {/block:Quote}
  2721.  
  2722. <!-- Link -->
  2723. {block:Link}
  2724.  
  2725. <div id="entry">
  2726.  
  2727. <!--Start INFOBOX-->
  2728.  
  2729. <div id="infobox">
  2730. <span class="typebox photo">LINK
  2731. </span>
  2732. <div class="spacer">
  2733. <span class="info">POSTED ON<br>
  2734. {Block:Date}<b><a href="{Permalink}"><i class="fa fa-clock-o"></i> {ShortYear}/{MonthNumberWithZero}/{DayOfMonthWithZero}</a></b>{/Block:Date}
  2735. </span>
  2736. </div>
  2737. <br>
  2738. </div>
  2739. <!--End INFOBOX-->
  2740. <div class="contbod">
  2741. <a href="{URL}" target="_blank"><font style="text-align:right; FONT-WEIGHT: bold; COLOR:{color:highlight}; font:bold 25px 'montserrat', serif; text-transform:uppercase; letter-spacing:5px;">{Name}</font></a>
  2742. {block:Description}<p>{Description}</p>{/block:Description}
  2743. </div></div>
  2744. {/block:Link}
  2745.  
  2746. <!-- Chat -->
  2747. {block:Chat}
  2748. <div id="entry">
  2749. <!--Start INFOBOX-->
  2750.  
  2751. <div id="infobox">
  2752. <span class="typebox photo">CHAT
  2753. </span>
  2754. <div class="spacer">
  2755. <span class="info">POSTED ON<br>
  2756. {Block:Date}<b><a href="{Permalink}"><i class="fa fa-clock-o"></i> {ShortYear}/{MonthNumberWithZero}/{DayOfMonthWithZero}</a></b>{/Block:Date}
  2757. </span>
  2758. </div>
  2759. <br>
  2760. </div>
  2761. <!--End INFOBOX-->
  2762. <div class="contbod">
  2763. {block:Title}<font style="text-align:justify; FONT-WEIGHT: normal; COLOR: {color:highlight}; font:normal 15px 'Roboto', serif; text-transform:uppercase; letter-spacing:5px;">{title}</font>{/block:Title}
  2764. {block:Lines}
  2765. {block:Label}{Label}{/block:Label} {Line}</br>
  2766. {/block:Lines}
  2767. </div></div>
  2768. {/block:Chat}
  2769.  
  2770. {block:Audio}
  2771. <div id="entry">
  2772. <!--Start INFOBOX--><div class="audiopost">
  2773.  
  2774. <div id="infobox">
  2775. <span class="typebox photo">AUDIO
  2776. </span>
  2777. <div class="spacer">
  2778. <span class="info">POSTED ON<br>
  2779. {Block:Date}<b><a href="{Permalink}"><i class="fa fa-clock-o"></i> {ShortYear}/{MonthNumberWithZero}/{DayOfMonthWithZero}</a></b>{/Block:Date}
  2780. </span>
  2781. </div>
  2782. <br>
  2783. </div>
  2784. <!--End INFOBOX-->
  2785.  
  2786.  
  2787.  
  2788.  
  2789. {block:AudioEmbed}
  2790. {AudioEmbed-500}
  2791. {block:Caption}<br>{Caption}{/block:Caption}
  2792. {/block:AudioEmbed}
  2793.  
  2794. {block:AudioPlayer}
  2795.  
  2796. <div class="atext"><font style="padding:5px;text-shadow: 1px 1px 2px rgba(150, 150, 150, 1);FONT-WEIGHT: normal;text-transform:uppercase; margin-top:0px; COLOR: {color:title}; font:bold 40px montserrat;font-style:; letter-spacing:1px; padding:10px;">{block:TrackName}{TrackName}{/block:TrackName}</font><br><br><br>
  2797. </div>
  2798.  
  2799. <div class"audiobg"><div class="albumimg"><img src="http://static.tumblr.com/jn9hrij/20Ul2zzsr/albumart.jpg"></div>{block:AlbumArt}<div class="albumimg"><img src="{AlbumArtURL}"></div>{/block:AlbumArt}</div>
  2800.  
  2801. <div class"audiocont">
  2802. <div class="audio"><div id="acont"><div id="audioplayer">{AudioPlayerWhite}</div></div>
  2803. <div class="aimg"><img src="http://static.tumblr.com/jn9hrij/20Ul2zzsr/albumart.jpg"></div>{block:AlbumArt}<div class="aimg"><img src="{AlbumArtURL}"></div>{/block:AlbumArt}</div>
  2804.  
  2805. <div style="margin-top:350px;position:absolute;">
  2806. <div class="atext">
  2807. <FONT style="FONT-WEIGHT: bold;text-shadow: 1px 1px 2px rgba(150, 150, 150, 1); FONT-SIZE: 15px; TEXT-TRANSFORM: uppercase;font-family:'Montserrat'; COLOR: {color:background}; font-style:; LINE-HEIGHT: 8pt; LETTER-SPACING: 1pt; text-transform:;">{block:Artist}{Artist}{/block:Artist} {block:PlayCount}<br><br><br>{PlayCountWithLabel}{/block:PlayCount}</font></div>
  2808. </div>
  2809.  
  2810.  
  2811. </div>
  2812. <div class="audiocap">
  2813. {block:Caption}<br>{Caption}{/block:Caption}</div>
  2814. {/block:AudioPlayer}
  2815.  
  2816. </div></div>
  2817. {/block:Audio}
  2818.  
  2819.  
  2820. <!-- Video -->
  2821. {block:Video}
  2822.  
  2823. <div id="entry">
  2824. <!--Start INFOBOX-->
  2825.  
  2826. <div id="infobox">
  2827. <span class="typebox photo">VIDEO
  2828. </span>
  2829. <div class="spacer">
  2830. <span class="info">POSTED ON<br>
  2831. {Block:Date}<b><a href="{Permalink}"><i class="fa fa-clock-o"></i> {ShortYear}/{MonthNumberWithZero}/{DayOfMonthWithZero}</a></b>{/Block:Date}
  2832. </span>
  2833. </div>
  2834. <br>
  2835. </div>
  2836. <!--End INFOBOX-->
  2837. {Video-500}
  2838. {block:Caption}{Caption}{/block:Caption}
  2839. </div>
  2840. {/block:Video}
  2841.  
  2842. {block:HasTags}
  2843. <div class="tags">
  2844. <div class="taglinks">
  2845. {block:Tags}<a href="{TagURL}"><i class="fa fa-tag"></i> {Tag}</a>{/block:Tags}</div>
  2846. </div>{/block:HasTags}
  2847.  
  2848.  
  2849.  
  2850. <!-- Permalink page -->
  2851.  
  2852.  
  2853. {block:PostNotes}
  2854. <div class="postnotes">
  2855. {PostNotes}</div>
  2856. {/block:PostNotes}
  2857.  
  2858.  
  2859.  
  2860. <!-- Other -->
  2861. {block:ContentSource}
  2862. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  2863. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  2864. {/block:SourceLogo}
  2865. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  2866. {/block:ContentSource}
  2867.  
  2868. </div>
  2869.  
  2870. {/block:Posts}
  2871. </div>
  2872. <!-- END POSTS -->
  2873.  
  2874.  
  2875. <div id="pagina"><center>
  2876. {block:Pagination}
  2877. {block:PreviousPage}
  2878. <a href="{PreviousPage}">PREV</a>
  2879. {/block:PreviousPage}
  2880.  
  2881. {block:JumpPagination length="5"}
  2882. {block:CurrentPage}
  2883. <span class="current_page">{PageNumber}</span>
  2884. {/block:CurrentPage}
  2885.  
  2886. {block:JumpPage}
  2887. <a class="jump_page" href="{URL}">{PageNumber}</a>
  2888. {/block:JumpPage}
  2889. {/block:JumpPagination}
  2890.  
  2891. {block:NextPage}
  2892. <a href="{NextPage}">NEXT</a>
  2893. {/block:NextPage}
  2894. {block:Pagination}<br> </center>
  2895. </div>
  2896. </body>
  2897.  
  2898. </html>
Add Comment
Please, Sign In to add comment
Public Pastes
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!