Advertisement
itskrystalized

Theme 05# - Airplane

Feb 27th, 2016
236
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.54 KB | None | 0 0
  1. <script>
  2. $(document).ready(function() {
  3. //
  4. $('a.poplight[href^=#]').click(function() {
  5. var popID = $(this).attr('rel'); //Get Popup Name
  6. var popURL = $(this).attr('href'); //Get Popup href to define size
  7. var query= popURL.split('?');
  8. var dim= query[1].split('&');
  9. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  10. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"></a>');
  11. var popMargTop = ($('#' + popID).height() + 80) / 2;
  12. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  13. //Apply Margin to Popup
  14. $('#' + popID).css({
  15. 'margin-top' : -popMargTop,
  16. 'margin-left' : -popMargLeft
  17. });
  18. $('body').append('<div id="fade"></div>');
  19. $('#fade').css({'filter' : 'alpha(opacity=70)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  20. return false;
  21. });
  22. $('a.close, #fade').live('click', function() {
  23. $('#fade , .popup_block').fadeOut(function() {
  24. $('#fade, a.close').remove(); //fade them both out
  25. });
  26. return false;
  27. });
  28. });
  29. </script>
  30. <div id="heading">
  31. <div class="headingszelesseg" id="headingJobb">
  32. <div id="headingTartalom">
  33. <div id="headingCim" style="text-align: center;">
  34. <img alt="" src="https://36.media.tumblr.com/a1d10dc4c66c61aff16a11863b8c1ffb/tumblr_o37kvliTvf1sgbpgao1_75sq.png" style="width: 70px; height: 70px;" /><br />
  35. <a href="/">Oldal neve</a></div>
  36. <div class="headingLeiras">
  37. Oldal rövid leírása.. Szlogenmondat, bemutatkozás stb. Cupcake ipsum dolor sit amet. Icing topping muffin donut marshmallow bear claw toffee jelly beans. Sugar plum apple pie chupa chups. Pastry tart toffee gummies.</div>
  38. </div>
  39. </div>
  40. <div id="headingBal">
  41. <div id="headingLinkek">
  42. <a href="/">Index</a> <a href="LINK 2 URL CÍME">Link 2</a> <a href="LINK 3 URL CÍME">Link 3</a> <a href="LINK 4 URL CÍME">Link 4</a> <a class="poplight" href="#?w=400" rel="doboz">Több..</a></div>
  43. </div>
  44. </div>
  45. <div class="popup_block" id="doboz">
  46. <p>
  47. Szöveg helye. Wafer pastry carrot cake cookie chupa chups. Jelly-o powder cookie. Muffin carrot cake jelly-o. Cheesecake icing dragée pastry. Sesame snaps wafer sugar plum pastry fruitcake soufflé dessert.</p>
  48. <table align="center" cellpadding="0" cellspacing="0" style="width: 100%">
  49. <tbody>
  50. <tr>
  51. <td style="width: 50%">
  52. <div id="popupLinkek">
  53. <a href="LINK URL CÍME">Újabb link 1</a><br />
  54. <a href="LINK URL CÍME">Újabb link 2</a><br />
  55. <a href="LINK URL CÍME">Újabb link 3</a><br />
  56. <a href="LINK URL CÍME">Újabb link 4</a></div>
  57. </td>
  58. <td style="width: 50%">
  59. <div id="popupLinkek">
  60. <a href="LINK URL CÍME">Újabb link 5</a><br />
  61. <a href="LINK URL CÍME">Újabb link 6</a><br />
  62. <a href="LINK URL CÍME">Újabb link 7</a><br />
  63. <a href="LINK URL CÍME">Újabb link 8</a></div>
  64. </td>
  65. </tr>
  66. </tbody>
  67. </table>
  68. </div>
  69. <style type="text/css">
  70. @import url(https://fonts.googleapis.com/css?family=Noticia+Text:400,400italic,700&subset=latin,latin-ext);
  71.  
  72. /* test és oldalszélesség */
  73. body {
  74. background-color: #ffffff;
  75. overflow: -moz-scrollbars-vertical;
  76. overflow-x: hidden;
  77. }
  78.  
  79. .site {
  80. width: 690px;
  81. margin: 0 auto;
  82. margin-top: 240px !important;
  83. }
  84.  
  85. /* fejléc */
  86. #heading {
  87. top: 200px!important;
  88. height: 270px;
  89. margin: 0 auto !important;
  90. margin-left: 80px !important;
  91. position: absolute;
  92. background-color: transparent;
  93. border: 0px solid #f2f2f2;
  94. padding: 25px;
  95. }
  96.  
  97. #headingJobb {
  98. float: right;
  99. position: relative;
  100. margint-left: 70px;
  101. bottom: 0;
  102. right: -15px;
  103. height: px;
  104. width: 300px;
  105. padding-bottom: 15px;
  106. margin-top: 230px;
  107. }
  108.  
  109. .headingszelesseg #headingJobb {
  110. width: 300px;
  111. }
  112.  
  113. #headingTartalom {
  114. position: absolute;
  115. bottom: 20px;
  116. }
  117.  
  118. #headingCim a {
  119. font-family: 'Abril Fatface', cursive;
  120. text-align: center;
  121. font-size: 15px;
  122. text-transform: lowercase;
  123. font-style: italic;
  124. border-bottom: 0px;
  125. color: #000000;
  126. padding-bottom: 15px;
  127. }
  128.  
  129. .headingLeiras {
  130. font-family: 'Noticia Text', serif;
  131. font-size: 12px;
  132. font-style: italic;
  133. color: #7f7f7f;
  134. text-indent: 50px;
  135. }
  136.  
  137. #headingBal {
  138. float: left;
  139. width: 100px;
  140. height: 150px;
  141. margin-top: 45px;
  142. padding-top: 100px;
  143. position: relative;
  144. border-right: 2px solid #f2f2f2;
  145. }
  146.  
  147. #headingLinkek {
  148. position: absolute;
  149. right: 50px;
  150. bottom: 40px;
  151. text-align: right;
  152. color: #909090;
  153. font-family: 'Abril Fatface', cursive;
  154. font-size: 8px;
  155. letter-spacing: 2px;
  156. text-transform: uppercase;
  157. }
  158.  
  159. #headingLinkek a {
  160. text-align: right;
  161. display: block;
  162. margin-top: 10px;
  163. margin-bottom: 15px;
  164. color: #7c7c7c;
  165. font-family: 'Abril Fatface', cursive;
  166. font-size: 8px;
  167. letter-spacing: 1px;
  168. text-transform: uppercase;
  169. -webkit-transition: all 0.6s ease-in-out;
  170. -moz-transition: all 0.6s ease-in-out;
  171. -o-transition: all 0.6s ease-in-out;
  172. -ms-transition: all 0.6s ease-in-out;
  173. transition: all 0.6s ease-in-out;
  174. }
  175.  
  176. #headingLinkek a:last-child {
  177. margin-bottom: 0px;
  178. }
  179.  
  180. #headingLinkek a:hover {
  181. color: #000000;
  182. -webkit-transition: all 0.6s ease-in-out;
  183. -moz-transition: all 0.6s ease-in-out;
  184. -o-transition: all 0.6s ease-in-out;
  185. -ms-transition: all 0.6s ease-in-out;
  186. transition: all 0.6s ease-in-out;
  187. }
  188.  
  189. #heading img {
  190. border-radius: 2em 0em 2em 0em;
  191. width: 70px;
  192. height: 70px;
  193. }
  194.  
  195. /* felugró ablak */
  196. .popup_block {
  197. color: #212121;
  198. font-family: 'Noticia Text', serif;
  199. font-size: 12px;
  200. display: none;
  201. background: transparent;
  202. padding: 20px;
  203. text-align: justify;
  204. position: fixed;
  205. top: 50%;
  206. left: 51.5%;
  207. z-index: 99999;
  208. line-height: 18px;
  209. background: #f7f7f7;
  210. border: 2px solid #f2f2f2;
  211. }
  212.  
  213. *html #fade {
  214. position: absolute;
  215. }
  216. *html .popup_block {
  217. position: absolute;
  218. }
  219.  
  220. #fade {
  221. display: none;
  222. position: fixed;
  223. left: 0px;
  224. top: 0px;
  225. width: 100%;
  226. height: 100%;
  227. z-index: 9999;
  228. background: #ffffff;
  229. opacity: 0.7;
  230. }
  231.  
  232. #popupLinkek a:link, #popupLinkek a:visited {
  233. font-family: 'Abril Fatface', cursive;
  234. font-size: 9px;
  235. font-style: italic;
  236. text-transform: uppercase;
  237. color: #8d8d8d;
  238. border-left: 4px solid #f2f2f2;
  239. margin-bottom: 14px;
  240. padding-left: 5px;
  241. }
  242.  
  243. #popupLinkek a:hover, #popupLinkek a:active {
  244. font-family: 'Abril Fatface', cursive;
  245. font-size: 9px;
  246. font-style: italic;
  247. text-transform: uppercase;
  248. color: #222222;
  249. border-left: 24px solid #f2f2f2;
  250. margin-bottom: 14px;
  251. padding-left: 5px;
  252. }
  253.  
  254. /* modulok */
  255. td.modtitle {
  256. font-family: 'Abril Fatface', cursive;
  257. font-style: normal;
  258. font-weight: normal !important;
  259. font-size: 14px;
  260. background-color: #f7f7f7 !important;
  261. color: #000000;
  262. text-align: center;
  263. text-transform: normal;
  264. letter-spacing: 1px;
  265. padding-top: 15px;
  266. border-left: 2px solid #f2f2f2;
  267. border-top: 2px solid #f2f2f2;
  268. border-right: 2px solid #f2f2f2;
  269. }
  270.  
  271. td.modbody {
  272. font-family: 'Noticia Text', serif;
  273. font-size: 12px;
  274. color: #212121;
  275. background-color: #f7f7f7;
  276. text-align: justify;
  277. line-height: 18px;
  278. border-left: 2px solid #f2f2f2;
  279. border-bottom: 2px solid #f2f2f2;
  280. border-right: 2px solid #f2f2f2;
  281. padding: 15px;
  282. }
  283.  
  284. /* blogmodul */
  285. h2 {
  286. color: #000000;
  287. font-family: 'Abril Fatface', cursive;
  288. text-transform: normal !important;
  289. letter-spacing: 0px;
  290. text-align: center;
  291. border: 0px;
  292. margin: 0px !important;
  293. font-size: 24px !important;
  294. font-style: normal !important;
  295. font-weight: normal;
  296. -webkit-transition: all 0.6s ease-in-out;
  297. -moz-transition: all 0.6s ease-in-out;
  298. -o-transition: all 0.6s ease-in-out;
  299. -ms-transition: all 0.6s ease-in-out;
  300. transition: all 0.6s ease-in-out;
  301. }
  302. a:hover h2 {
  303. color: #111111;
  304. font-family: 'Abril Fatface', cursive;
  305. text-transform: normal !important;
  306. letter-spacing: 0px;
  307. text-align: center;
  308. border: 0px;
  309. margin: 0px !important;
  310. font-size: 24px !important;
  311. font-style: normal !important;
  312. font-weight: normal;
  313. }
  314.  
  315. .txtmini {
  316. font-size: 11px !important;
  317. font-family: 'Noticia Text', serif;
  318. font-style: italic;
  319. background-color: #111111;
  320. color: #ffffff;
  321. padding: 4px;
  322. text-align: center;
  323. display: inline-block;
  324. }
  325.  
  326. .txtbold {
  327. background-color: transparent;
  328. font-size: 11px !important;
  329. font-family: 'Abril Fatface', cursive;
  330. color: #111111;
  331. text-align: left;
  332. }
  333.  
  334. .blogtags {
  335. font-size: 0px !important;
  336. }
  337.  
  338. .blogtags a:link, .blogtags a:visited {
  339. font-family: 'Noticia Text', serif;
  340. font-size: 11px !important;
  341. font-style: normal !important;
  342. text-transform: uppercase;
  343. padding: 2px;
  344. margin: 2px;
  345. background-color: #ececec;
  346. color: #111111;
  347. }
  348.  
  349. .blogtags a:hover, .blogtags a:active {
  350. font-family: 'Noticia Text', serif;
  351. font-size: 11px !important;
  352. font-style: normal !important;
  353. text-transform: uppercase;
  354. padding: 2px;
  355. margin: 2px;
  356. background-color: #111111;
  357. color: #ececec;
  358. }
  359.  
  360. td.listheader {
  361. font-family: 'Noticia Text', serif;
  362. font-style: italic;
  363. font-size: 16px;
  364. color: #000000;
  365. text-transform: uppercase;
  366. }
  367.  
  368. .blogmorelink {
  369. margin: 0 auto !important;
  370. text-align: center;
  371. }
  372.  
  373. .blogmorelink a:link, .blogmorelink a:visited {
  374. padding: 5px;
  375. color: #000000;
  376. font-family: 'Abril Fatface', cursive;
  377. font-style: italic;
  378. font-size: 10px;
  379. background-color: #f2f2f2;
  380. border: 2px solid #f0f0f0;
  381. -webkit-transition: all 0.5s linear;
  382. -moz-transition: all 0.5s linear;
  383. transition: all 0.5 linear;
  384. }
  385.  
  386. .blogmorelink a:hover, .blogmorelink a:active {
  387. padding: 5px;
  388. color: #ffffff;
  389. font-family: 'Abril Fatface', cursive;
  390. font-style: italic;
  391. font-size: 10px;
  392. background-color: #000000;
  393. border: 2px solid #0e0e0e;
  394. }
  395.  
  396. /* hozzászólások, szövegek, táblázatok */
  397. div[id*="commentContainer"] td.list1 {
  398. background: transparent;
  399. color: #212121;
  400. font-family: 'Noticia Text', serif;
  401. font-size: 12px;
  402. text-shadow: 0px;
  403. }
  404.  
  405. div[id*="commentContainer"] td.list2 {
  406. background: transparent;
  407. color: #212121;
  408. font-family: 'Noticia Text', serif;
  409. font-size: 12px;
  410. text-shadow: 0px;
  411. }
  412.  
  413. div[id*="commentContainer"] .txtbold {
  414. color: #000000;
  415. font-family: 'Noticia Text', serif;
  416. font-size: 12px;
  417. font-style: italic;
  418. font-weight: normal;
  419. }
  420.  
  421. .commenttext {
  422. color: #212121;
  423. font-family: 'Noticia Text', serif;
  424. font-size: 12px;
  425. font-style: normal;
  426. font-weight: normal;
  427. line-height: 18px;
  428. text-align: justify;
  429. }
  430.  
  431. .commenttext p {
  432. color: #212121;
  433. font-family: 'Noticia Text', serif;
  434. font-size: 12px;
  435. font-style: normal;
  436. font-weight: normal;
  437. line-height: 18px;
  438. text-align: justify;
  439. }
  440.  
  441. .txtnormal {
  442. color: #212121;
  443. font-family: 'Noticia Text', serif;
  444. font-size: 12px;
  445. line-height: 18px;
  446. text-align: justify;
  447. }
  448.  
  449. table, tr, td {
  450. background-color: transparent;
  451. }
  452.  
  453. table {
  454. color: #212121;
  455. font-family: 'Noticia Text', serif;
  456. font-size: 12px;
  457. line-height: 18px;
  458. text-align: justify;
  459. }
  460.  
  461. /* szöveges mezők */
  462. input {
  463. contour: 0px;
  464. border: 2px solid #e8e8e8;
  465. padding: 3px;
  466. font-size: 12px;
  467. font-style: italic;
  468. background-color: #dcdcdc !important;
  469. color: #111111;
  470. }
  471.  
  472. /* címsorok */
  473. h1 {
  474. font-family: 'Abril Fatface', cursive;
  475. display: inline-block;
  476. font-size: 20px;
  477. text-transform: normal;
  478. font-weight: normal!important;
  479. border-bottom: 2px solid #000000;
  480. color: #000000;
  481. float: left;
  482. margin-right: 6px !important;
  483. margin-bottom: -10px !important;
  484. padding-top: 0px;
  485. -webkit-margin-before: 0em !important;
  486. -webkit-margin-after: -em !important;
  487. -webkit-margin-start: 0em !important;
  488. -webkit-margin-end: 0px;
  489. }
  490.  
  491. h3 {
  492. font-family: 'Abril Fatface', cursive;
  493. display: inline-block;
  494. font-size: 17px;
  495. text-transform: uppercase;
  496. border-bottom: 0px;
  497. color: #1e1e1e;
  498. font-weight: normal!important;
  499. -webkit-margin-before: 0em !important;
  500. -webkit-margin-after: -em !important;
  501. -webkit-margin-start: 0em !important;
  502. -webkit-margin-end: 0px;
  503. margin-bottom: -10px !important;
  504. }
  505.  
  506. h4 {
  507. font-family: 'Abril Fatface', cursive;
  508. text-align: center;
  509. font-size: 15px;
  510. text-transform: lowercase;
  511. font-style: italic;
  512. border-bottom: 0px;
  513. color: #1e1e1e;
  514. font-weight: normal!important;
  515. -webkit-margin-before: 0em !important;
  516. -webkit-margin-after: -em !important;
  517. -webkit-margin-start: 0em !important;
  518. -webkit-margin-end: 0px;
  519. margin-bottom: -10px !important;
  520. }
  521.  
  522. /* kijelölés színének megváltoztatása */
  523. ::selection {
  524. background: #ececec;
  525. text-shadow: 0px 0px 0px;
  526. }
  527. ::-moz-selection {
  528. background: #ececec;
  529. text-shadow: 0px 0px 0px;
  530. }
  531.  
  532. /* görgetősáv kinézete */
  533. ::-webkit-scrollbar {
  534. width: 4px;
  535. height: 4px;
  536. }
  537. ::-webkit-scrollbar-track {
  538. background-color: #ffffff;
  539. }
  540. ::-webkit-scrollbar-thumb {
  541. background-color: #000000;
  542. }
  543. ::-webkit-scrollbar-thumb:hover {
  544. background-color: #333333;
  545. }
  546.  
  547. /* betű és szövegstílusok */
  548. p { /* bekezdések */
  549. font-family: 'Noticia Text', serif;
  550. font-size: 12px;
  551. color: #212121;
  552. text-align: justify;
  553. line-height: 18px;
  554. }
  555.  
  556. b, strong { /* félkövér */
  557. font-family: 'Noticia Text', serif;
  558. font-size: 12px;
  559. color: #ffffff;
  560. font-weight: bold;
  561. background-color: #000000;
  562. padding: 2px;
  563. -webkit-transition: all 0.5s ease;
  564. -moz-transition: all 0.5s ease;
  565. -o-transition: all 0.5s ease;
  566. transition: all 0.5s ease;
  567. }
  568. b, strong:hover {
  569. font-family: 'Noticia Text', serif;
  570. font-size: 12px;
  571. color: #ffffff;
  572. font-weight: bold;
  573. background-color: #848484;
  574. padding: 2px;
  575. }
  576.  
  577. em { /* dőlt */
  578. font-family: 'Noticia Text', serif;
  579. font-size: 12px;
  580. color: #000000;
  581. font-style: italic;
  582. }
  583.  
  584. u {
  585. font-family: 'Noticia Text', serif;
  586. font-size: 12px;
  587. color: #848484;
  588. text-decoration: none;
  589. border-bottom: 1px dashed #dbdbdb;
  590. -webkit-transition: all 0.5s ease;
  591. -moz-transition: all 0.5s ease;
  592. -o-transition: all 0.5s ease;
  593. transition: all 0.5s ease;
  594. }
  595. u:hover {
  596. font-family: 'Noticia Text', serif;
  597. font-size: 12px;
  598. color: #848484;
  599. text-decoration: none;
  600. border-bottom: 1px dashed #000000;
  601. }
  602.  
  603. /* hivatkozások */
  604. a:link, a:visited {
  605. font-family: 'Noticia Text', serif;
  606. font-size: 12px;
  607. color: #969696;
  608. font-style: italic;
  609. text-decoration: none;
  610. letter-spacing: 0px;
  611. -webkit-transition: all 0.5s ease;
  612. -moz-transition: all 0.5s ease;
  613. -o-transition: all 0.5s ease;
  614. transition: all 0.5s ease;
  615. }
  616. a:hover, a:active {
  617. font-family: 'Noticia Text', serif;
  618. font-size: 12px;
  619. color: #111111;
  620. font-style: italic;
  621. text-decoration: none;
  622. letter-spacing: 0.5px;
  623. }
  624.  
  625. a:link img { /* linkelt kép */
  626. padding: 0px;
  627. border: 0px;
  628. filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
  629. filter: grayscale(100%); /* mérték megadható */
  630. -moz-filter: grayscale(100%); /* mérték megadható */
  631. -ms-filter: grayscale(100%); /* mérték megadható */
  632. -o-filter: grayscale(100%); /* mérték megadható */
  633. filter: gray;
  634. -webkit-filter: grayscale(100%); /* mérték megadható */
  635. transition: all .5s ease-in-out;
  636. -o-transition: all .5s ease-in-out;
  637. -webkit-transition: all .5s ease-in-out;
  638. -moz-transition: all .5s ease-in-out;
  639. }
  640. a img:hover { /* linkelt kép ha ráviszed az egeret */
  641. padding: 0px;
  642. border: 0px;
  643. filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
  644. filter: grayscale(0%); /* mérték megadható */
  645. -moz-filter: grayscale(0%); /* mérték megadható */
  646. -ms-filter: grayscale(0%); /* mérték megadható */
  647. -o-filter: grayscale(0%); /* mérték megadható */
  648. filter: none;
  649. -webkit-filter: grayscale(0%); /* mérték megadható */
  650. }
  651.  
  652. /* idézetblokk */
  653. blockquote {
  654. outline: 2px solid #f2f2f2;
  655. background-color: #ededed;
  656. color: #454545;
  657. font-style: normal;
  658. margin: 20px 75px 10px 10px;
  659. padding-right: 10px;
  660. padding: 5px;
  661. quotes: "\201C" "\201D";
  662. }
  663.  
  664. blockquote:after {
  665. font-style: normal;
  666. margin-top: -40px;
  667. margin-right: -70px;
  668. padding: 0px;
  669. content: open-quote;
  670. font-weight: bold;
  671. color: #000000;
  672. font-size: 80px;
  673. font-family: 'Abril Fatface', cursive;
  674. float: right;
  675. }
  676.  
  677. /* betűtípusok */
  678. @font-face {
  679. font-family: 'Abril Fatface';
  680. font-style: normal;
  681. font-weight: 400;
  682. src: local('Abril Fatface'), local('AbrilFatface-Regular'), url(https://fonts.gstatic.com/s/abrilfatface/v8/X1g_KwGeBV3ajZIXQ9VnDn1PgMwFt2V-WJ2uOZ4WXLU.woff2) format('woff2');
  683. unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
  684. }
  685. @font-face {
  686. font-family: 'Abril Fatface';
  687. font-style: normal;
  688. font-weight: 400;
  689. src: local('Abril Fatface'), local('AbrilFatface-Regular'), url(https://fonts.gstatic.com/s/abrilfatface/v8/X1g_KwGeBV3ajZIXQ9VnDjxObtw73-qQgbr7Be51v5c.woff2) format('woff2');
  690. unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
  691. }</style>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement