Advertisement
Guest User

Style.css

a guest
Mar 7th, 2016
106
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 25.40 KB | None | 0 0
  1. /*
  2. Theme Name: Expositio
  3. Theme URI: http://wpshower.com/themes/expositio
  4. Author: WPShower
  5. Author URI: http://wpshower.com/
  6. Description: Expositio is a free portfolio-type WordPress theme for photographers and designers. The horizontal layout of the Expositio theme is perfect for displaying visual materials like photography or art works.
  7. Version: 2.0.1
  8. License: GNU General Public License v2 or later
  9. License URI: http://www.gnu.org/licenses/gpl-2.0.html
  10. Tags: white, light
  11. Text Domain: expositio
  12.  
  13. This theme, like WordPress, is licensed under the GPL.
  14. Use it to make something cool, have fun, and share what you've learned with others.
  15. */
  16.  
  17. /**
  18. * Table of Contents:
  19. *
  20. * 1.0 - Reset
  21. * 2.0 - Repeatable Patterns
  22. * 3.0 - Basic Structure
  23. * 4.0 - Header
  24. * 5.0 - Navigation
  25. * 6.0 - Content
  26. * 6.1 - Post Thumbnail
  27. * 6.2 - Entry Header
  28. * 6.3 - Entry Meta
  29. * 6.4 - Entry Content
  30. * 6.5 - Galleries
  31. * 6.6 - Post Formats
  32. * 6.7 - Post/Image/Paging Navigation
  33. * 6.8 - Attachments
  34. * 6.9 - Archives
  35. * 6.10 - Contributor Page
  36. * 6.11 - 404 Page
  37. * 6.12 - Full-width
  38. * 6.13 - Singular
  39. * 6.14 - Comments
  40. * 7.0 - Sidebar
  41. * 7.1 - Widgets
  42. * 7.2 - Content Sidebar Widgets
  43. * 8.0 - Footer
  44. * 9.0 - Featured Content
  45. * 10.0 - Multisite
  46. * 11.0 - Media Queries
  47. * 12.0 - Print
  48. * -----------------------------------------------------------------------------
  49. */
  50.  
  51. /**
  52. * 1.0 Reset
  53. *
  54. * Resetting and rebuilding styles have been helped along thanks to the fine
  55. * work of Eric Meyer http://meyerweb.com/eric/tools/css/reset/index.html
  56. * along with Nicolas Gallagher and Jonathan Neal
  57. * http://necolas.github.com/normalize.css/ and Blueprint
  58. * http://www.blueprintcss.org/
  59. *
  60. * -----------------------------------------------------------------------------
  61. */
  62. * {
  63. -webkit-box-sizing: border-box;
  64. -moz-box-sizing: border-box;
  65. box-sizing: border-box;
  66. }
  67.  
  68. html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
  69. border: 0;
  70. font-family: inherit;
  71. font-size: 100%;
  72. font-style: inherit;
  73. font-weight: inherit;
  74. margin: 0;
  75. outline: 0;
  76. padding: 0;
  77. vertical-align: baseline;
  78. }
  79.  
  80. article,
  81. aside,
  82. details,
  83. figcaption,
  84. figure,
  85. footer,
  86. header,
  87. hgroup,
  88. nav,
  89. section {
  90. display: block;
  91. }
  92.  
  93. audio,
  94. canvas,
  95. video {
  96. display: inline-block;
  97. max-width: 100%;
  98. }
  99.  
  100. html {
  101. height: 100%;
  102. font-size: 62.5%;
  103. -webkit-text-size-adjust: 100%;
  104. -ms-text-size-adjust: 100%;
  105. text-rendering: optimizeLegibility;
  106. -webkit-font-smoothing: antialiased;
  107. }
  108.  
  109. body,
  110. button,
  111. input,
  112. select,
  113. textarea {
  114. color: #222223;
  115. font-family: Lusitana, serif;
  116. font-size: 19px;
  117. font-size: 1.9rem;
  118. font-weight: 400;
  119. line-height: 29px;
  120. line-height: 2.9rem;
  121. }
  122.  
  123. body {
  124. height: 100%;
  125. background: #fff;
  126. }
  127.  
  128. a {
  129. color: #222223;
  130. text-decoration: none;
  131. }
  132.  
  133. a:hover {
  134. color: #963cbd;
  135. border-bottom: 1px solid #963cbd;
  136. }
  137.  
  138. a:focus,
  139. a:hover,
  140. a:active {
  141. outline: 0;
  142. }
  143.  
  144. h1,
  145. h2,
  146. h3,
  147. h4,
  148. h5,
  149. h6 {
  150. clear: both;
  151. font-weight: 400;
  152. margin: 28px 0 14px;
  153. margin: 2.8rem 0 1.4rem;
  154. }
  155.  
  156. h1 {
  157. font-size: 28px;
  158. font-size: 2.8rem;
  159. line-height: 38px;
  160. line-height: 3.8rem;
  161. }
  162.  
  163. h2 {
  164. font-size: 26px;
  165. font-size: 2.6rem;
  166. line-height: 36px;
  167. line-height: 3.6rem;
  168. }
  169.  
  170. h3 {
  171. font-size: 24px;
  172. font-size: 2.4rem;
  173. line-height: 34px;
  174. line-height: 3.4rem;
  175. }
  176.  
  177. h4 {
  178. font-size: 22px;
  179. font-size: 2.2rem;
  180. line-height: 32px;
  181. line-height: 3.2rem;
  182. }
  183.  
  184. h5 {
  185. font-size: 20px;
  186. font-size: 2rem;
  187. line-height: 30px;
  188. line-height: 3rem;
  189. }
  190.  
  191. h6 {
  192. font-size: 18px;
  193. font-size: 1.8rem;
  194. line-height: 28px;
  195. line-height: 2.8rem;
  196. }
  197.  
  198. address {
  199. font-style: italic;
  200. margin-bottom: 28px;
  201. margin-bottom: 2.8rem;
  202. }
  203.  
  204. abbr[title] {
  205. border-bottom: 1px dotted #222223;
  206. cursor: help;
  207. }
  208.  
  209. b,
  210. strong {
  211. font-weight: 400;
  212. }
  213.  
  214. cite,
  215. dfn,
  216. em,
  217. i {
  218. font-style: italic;
  219. }
  220.  
  221. mark,
  222. ins {
  223. text-decoration: none;
  224. }
  225.  
  226. p {
  227. margin-bottom: 28px;
  228. margin-bottom: 2.8rem;
  229. }
  230.  
  231. code,
  232. kbd,
  233. tt,
  234. var,
  235. samp,
  236. pre {
  237. font-family: monospace, serif;
  238. font-size: 16px;
  239. font-size: 1.6rem;
  240. -webkit-hyphens: none;
  241. -moz-hyphens: none;
  242. -ms-hyphens: none;
  243. hyphens: none;
  244. line-height: 26px;
  245. line-height: 2.6rem;
  246. }
  247.  
  248. pre {
  249. border: 1px solid rgba(0, 0, 0, 0.1);
  250. margin-bottom: 28px;
  251. margin-bottom: 2.8rem;
  252. max-width: 100%;
  253. overflow: auto;
  254. padding: 12px;
  255. padding: 1.2rem;
  256. white-space: pre;
  257. white-space: pre-wrap;
  258. word-wrap: break-word;
  259. }
  260.  
  261. blockquote,
  262. q {
  263. -webkit-hyphens: none;
  264. -moz-hyphens: none;
  265. -ms-hyphens: none;
  266. hyphens: none;
  267. quotes: none;
  268. }
  269.  
  270. blockquote:before,
  271. blockquote:after,
  272. q:before,
  273. q:after {
  274. content: "";
  275. content: none;
  276. }
  277.  
  278. blockquote {
  279. font-size: 20px;
  280. font-size: 2rem;
  281. font-style: italic;
  282. font-weight: 400;
  283. line-height: 30px;
  284. line-height: 3rem;
  285. margin-bottom: 28px;
  286. margin-bottom: 2.8rem;
  287. }
  288.  
  289. blockquote cite,
  290. blockquote small {
  291. font-size: 16px;
  292. font-size: 1.6rem;
  293. font-weight: 400;
  294. line-height: 26px;
  295. line-height: 2.6rem;
  296. }
  297.  
  298. blockquote em,
  299. blockquote i,
  300. blockquote cite {
  301. font-style: normal;
  302. }
  303.  
  304. blockquote strong,
  305. blockquote b {
  306. font-weight: 400;
  307. }
  308.  
  309. small {
  310. font-size: smaller;
  311. }
  312.  
  313. big {
  314. font-size: 125%;
  315. }
  316.  
  317. sup,
  318. sub {
  319. font-size: 75%;
  320. height: 0;
  321. line-height: 0;
  322. position: relative;
  323. vertical-align: baseline;
  324. }
  325.  
  326. sup {
  327. bottom: 1ex;
  328. }
  329.  
  330. sub {
  331. top: .5ex;
  332. }
  333.  
  334. dl {
  335. margin-bottom: 28px;
  336. margin-bottom: 2.8rem;
  337. }
  338.  
  339. dt {
  340. font-weight: bold;
  341. }
  342.  
  343. dd {
  344. margin-bottom: 28px;
  345. margin-bottom: 2.8rem;
  346. }
  347.  
  348. ul,
  349. ol {
  350. list-style: none;
  351. margin: 0 0 28px 20px;
  352. margin: 0 0 2.8rem 2rem;
  353. }
  354.  
  355. ul {
  356. list-style: disc;
  357. }
  358.  
  359. ol {
  360. list-style: decimal;
  361. }
  362.  
  363. li > ul,
  364. li > ol {
  365. margin: 0 0 0 20px;
  366. margin: 0 0 0 2rem;
  367. }
  368.  
  369. img {
  370. -ms-interpolation-mode: bicubic;
  371. border: 0;
  372. vertical-align: top;
  373. }
  374.  
  375. figure {
  376. margin: 0;
  377. }
  378.  
  379. fieldset {
  380. border: 1px solid rgba(0, 0, 0, 0.1);
  381. margin: 0 0 28px;
  382. margin: 0 0 2.8rem;
  383. padding: 12px 12px 0;
  384. padding: 1.2rem 1.2rem 0;
  385. }
  386.  
  387. legend {
  388. white-space: normal;
  389. }
  390.  
  391. button,
  392. input,
  393. select,
  394. textarea {
  395. font-size: 100%;
  396. margin: 0;
  397. max-width: 100%;
  398. vertical-align: baseline;
  399. }
  400.  
  401. button,
  402. input {
  403. line-height: normal;
  404. }
  405.  
  406. input,
  407. textarea {
  408. /* Removing the inner shadow, rounded corners on iOS inputs */
  409. background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
  410. }
  411.  
  412. button,
  413. html input[type="button"],
  414. input[type="reset"],
  415. input[type="submit"] {
  416. -webkit-appearance: button;
  417. cursor: pointer;
  418. }
  419.  
  420. button[disabled],
  421. input[disabled] {
  422. cursor: default;
  423. }
  424.  
  425. input[type="checkbox"],
  426. input[type="radio"] {
  427. padding: 0;
  428. }
  429.  
  430. input[type="search"] {
  431. -webkit-appearance: textfield;
  432. }
  433.  
  434. input[type="search"]::-webkit-search-decoration {
  435. -webkit-appearance: none;
  436. }
  437.  
  438. button::-moz-focus-inner,
  439. input::-moz-focus-inner {
  440. border: 0;
  441. padding: 0;
  442. }
  443.  
  444. textarea {
  445. overflow: auto;
  446. vertical-align: top;
  447. }
  448.  
  449. table,
  450. th,
  451. td {
  452. border: 1px solid rgba(0, 0, 0, 0.1);
  453. }
  454.  
  455. table {
  456. border-collapse: separate;
  457. border-spacing: 0;
  458. border-width: 1px 0 0 1px;
  459. margin-bottom: 28px;
  460. margin-bottom: 2.8rem;
  461. width: 100%;
  462. }
  463.  
  464. caption,
  465. th,
  466. td {
  467. font-weight: normal;
  468. text-align: left;
  469. }
  470.  
  471. th {
  472. border-width: 0 1px 1px 0;
  473. font-weight: bold;
  474. }
  475.  
  476. td {
  477. border-width: 0 1px 1px 0;
  478. }
  479.  
  480. del {
  481. color: #222223;
  482. }
  483.  
  484. hr {
  485. background-color: rgba(0, 0, 0, 0.1);
  486. border: 0;
  487. height: 1px;
  488. margin-bottom: 28px;
  489. margin-bottom: 2.8rem;
  490. }
  491.  
  492. /* Support a widely-adopted but non-standard selector for text selection styles
  493. * to achieve a better experience. See http://core.trac.wordpress.org/ticket/25898.
  494. */
  495. ::selection {
  496. background: #963cbd;
  497. color: #fff;
  498. text-shadow: none;
  499. }
  500.  
  501. ::-moz-selection {
  502. background: #963cbd;
  503. color: #fff;
  504. text-shadow: none;
  505. }
  506.  
  507. /**
  508. * 2.0 Repeatable Patterns
  509. * -----------------------------------------------------------------------------
  510. */
  511. @font-face {
  512. font-family: expositio;
  513. src: url("fonts/expositio.eot?") format("eot"), url("fonts/expositio.woff") format("woff"), url("fonts/expositio.ttf") format("truetype");
  514. font-weight: normal;
  515. font-style: normal;
  516. }
  517.  
  518. /* Input fields */
  519. input,
  520. textarea {
  521. border: 1px solid #222223;
  522. border-radius: 2px;
  523. color: #222223;
  524. padding: 4px 10px;
  525. padding: 0.4rem 1rem;
  526. margin-bottom: 3px;
  527. margin-bottom: 0.3rem;
  528. }
  529.  
  530. input:focus,
  531. textarea:focus {
  532. border: 1px solid #963cbd;
  533. outline: 0;
  534. }
  535.  
  536. /* Buttons */
  537. button,
  538. .contributor-posts-link,
  539. input[type="button"],
  540. input[type="reset"],
  541. input[type="submit"] {
  542. background-color: #222223;
  543. border: 0;
  544. border-radius: 2px;
  545. color: #963cbd;
  546. padding: 5px 20px;
  547. padding: 0.5rem 2rem;
  548. margin-bottom: 3px;
  549. margin-bottom: 0.3rem;
  550. vertical-align: bottom;
  551. }
  552.  
  553. button:hover,
  554. button:focus,
  555. input[type="button"]:hover,
  556. input[type="button"]:focus,
  557. input[type="reset"]:hover,
  558. input[type="reset"]:focus,
  559. input[type="submit"]:hover,
  560. input[type="submit"]:focus {
  561. background-color: #963cbd;
  562. color: #fff;
  563. }
  564.  
  565. button:active,
  566. .contributor-posts-link:active,
  567. input[type="button"]:active,
  568. input[type="reset"]:active,
  569. input[type="submit"]:active {
  570. background-color: #963cbd;
  571. color: #fff;
  572. }
  573.  
  574. /* Placeholder text color -- selectors need to be separate to work. */
  575. ::-webkit-input-placeholder {
  576. color: #222223;
  577. }
  578.  
  579. :-moz-placeholder {
  580. color: #222223;
  581. }
  582.  
  583. ::-moz-placeholder {
  584. color: #222223;
  585. /* Since FF19 lowers the opacity of the placeholder by default */
  586. opacity: 1;
  587. }
  588.  
  589. :-ms-input-placeholder {
  590. color: #222223;
  591. }
  592.  
  593. /* Responsive images. Fluid images for posts, comments, and widgets */
  594. .entry-content img,
  595. .entry-summary img,
  596. .wp-caption {
  597. max-width: 100%;
  598. }
  599.  
  600. /**
  601. * Make sure images with WordPress-added height and width attributes are
  602. * scaled correctly.
  603. */
  604. .entry-content img,
  605. .entry-summary img,
  606. img[class*="align"],
  607. img[class*="wp-image-"],
  608. img[class*="attachment-"] {
  609. height: auto;
  610. }
  611.  
  612. img.size-full,
  613. img.size-large,
  614. .wp-post-image,
  615. .post-thumbnail img {
  616. height: auto;
  617. max-width: 100%;
  618. }
  619.  
  620. body.home .wp-post-image {
  621. max-width: none;
  622. }
  623.  
  624. /* Make sure embeds and iframes fit their containers */
  625. embed,
  626. iframe,
  627. object,
  628. video {
  629. margin-bottom: 28px;
  630. margin-bottom: 2.8rem;
  631. max-width: 100%;
  632. }
  633.  
  634. p > embed,
  635. p > iframe,
  636. p > object,
  637. span > embed,
  638. span > iframe,
  639. span > object {
  640. margin-bottom: 0;
  641. }
  642.  
  643. /* Alignment */
  644. .alignleft {
  645. float: left;
  646. }
  647.  
  648. .alignright {
  649. float: right;
  650. }
  651.  
  652. .aligncenter {
  653. display: block;
  654. margin-left: auto;
  655. margin-right: auto;
  656. }
  657.  
  658. blockquote.alignleft,
  659. img.alignleft {
  660. margin: 7px 28px 7px 0;
  661. margin: 0.7rem 2.8rem 0.7rem 0;
  662. }
  663.  
  664. .wp-caption.alignleft {
  665. margin: 7px 14px 7px 0;
  666. margin: 0.7rem 1.4rem 0.7rem 0;
  667. }
  668.  
  669. blockquote.alignright,
  670. img.alignright {
  671. margin: 7px 0 7px 28px;
  672. margin: 0.7rem 0 0.7rem 2.8rem;
  673. }
  674.  
  675. .wp-caption.alignright {
  676. margin: 7px 0 7px 14px;
  677. margin: 0.7rem 0 0.7rem 1.4rem;
  678. }
  679.  
  680. blockquote.aligncenter,
  681. img.aligncenter,
  682. .wp-caption.aligncenter {
  683. margin-top: 7px;
  684. margin-top: 0.7rem;
  685. margin-bottom: 7px;
  686. margin-bottom: 0.7rem;
  687. }
  688.  
  689. .site-content blockquote.alignleft,
  690. .site-content blockquote.alignright {
  691. padding-top: 14px;
  692. padding-top: 1.4rem;
  693. }
  694.  
  695. .site-content blockquote.alignleft p,
  696. .site-content blockquote.alignright p {
  697. margin-bottom: 14px;
  698. margin-bottom: 1.4rem;
  699. }
  700.  
  701. .wp-caption {
  702. margin-bottom: 28px;
  703. margin-bottom: 2.8rem;
  704. }
  705.  
  706. .wp-caption img[class*="wp-image-"] {
  707. display: block;
  708. margin: 0;
  709. }
  710.  
  711. .wp-caption {
  712. color: #222223;
  713. }
  714.  
  715. .wp-caption a {
  716. color: #963cbd;
  717. }
  718.  
  719. .wp-caption-text {
  720. font-size: 13px;
  721. font-size: 1.3rem;
  722. line-height: 15px;
  723. line-height: 1.5rem;
  724. margin: 9px 0;
  725. margin: 0.9rem 0;
  726. }
  727.  
  728. .wp-smiley {
  729. border: 0;
  730. margin-bottom: 0;
  731. margin-top: 0;
  732. padding: 0;
  733. }
  734.  
  735. /* Assistive text */
  736. .screen-reader-text {
  737. clip: rect(1px, 1px, 1px, 1px);
  738. position: absolute;
  739. }
  740.  
  741. /* Clearing floats */
  742. .site-header:after,
  743. .site-footer:after {
  744. content: '';
  745. display: block;
  746. clear: both;
  747. }
  748.  
  749. /**
  750. * 3.0 Basic Structure
  751. * -----------------------------------------------------------------------------
  752. */
  753. #wrapper {
  754. width: 100%;
  755. height: 100%;
  756. }
  757.  
  758. .site {
  759. opacity: 0;
  760. position: relative;
  761. min-width: 320px;
  762. -webkit-transition: opacity 0.3s, left 0.3s ease-out;
  763. -moz-transition: opacity 0.3s, left 0.3s ease-out;
  764. -o-transition: opacity 0.3s, left 0.3s ease-out;
  765. transition: opacity 0.3s, left 0.3s ease-out;
  766. }
  767.  
  768. .main-content,
  769. .content-area {
  770. height: 100%;
  771. white-space: nowrap;
  772. }
  773.  
  774. /* Infinite load */
  775. @-webkit-keyframes buffer1 {
  776. 0% {
  777. -webkit-transform: scale(0);
  778. }
  779.  
  780. 50% {
  781. -webkit-transform: scale(1);
  782. }
  783. }
  784.  
  785. @-moz-keyframes buffer1 {
  786. 0% {
  787. -moz-transform: scale(0);
  788. }
  789.  
  790. 50% {
  791. -moz-transform: scale(1);
  792. }
  793. }
  794.  
  795. @-o-keyframes buffer1 {
  796. 0% {
  797. -o-transform: scale(0);
  798. }
  799.  
  800. 50% {
  801. -o-transform: scale(1);
  802. }
  803. }
  804.  
  805. @-ms-keyframes buffer1 {
  806. 0% {
  807. -ms-transform: scale(0);
  808. }
  809.  
  810. 50% {
  811. -ms-transform: scale(1);
  812. }
  813. }
  814.  
  815. @keyframes buffer1 {
  816. 0% {
  817. transform: scale(0);
  818. }
  819.  
  820. 50% {
  821. transform: scale(1);
  822. }
  823. }
  824.  
  825. @-webkit-keyframes buffer2 {
  826. 0% {
  827. -webkit-transform: scale(0);
  828. }
  829.  
  830. 50% {
  831. -webkit-transform: scale(0);
  832. }
  833.  
  834. 100% {
  835. -webkit-transform: scale(1);
  836. }
  837. }
  838.  
  839. @-moz-keyframes buffer2 {
  840. 0% {
  841. -moz-transform: scale(0);
  842. }
  843.  
  844. 50% {
  845. -moz-transform: scale(0);
  846. }
  847.  
  848. 100% {
  849. -moz-transform: scale(1);
  850. }
  851. }
  852.  
  853. @-o-keyframes buffer2 {
  854. 0% {
  855. -o-transform: scale(0);
  856. }
  857.  
  858. 50% {
  859. -o-transform: scale(0);
  860. }
  861.  
  862. 100% {
  863. -o-transform: scale(1);
  864. }
  865. }
  866.  
  867. @-ms-keyframes buffer2 {
  868. 0% {
  869. -ms-transform: scale(0);
  870. }
  871.  
  872. 50% {
  873. -ms-transform: scale(0);
  874. }
  875.  
  876. 100% {
  877. -ms-transform: scale(1);
  878. }
  879. }
  880.  
  881. @keyframes buffer2 {
  882. 0% {
  883. transform: scale(0);
  884. }
  885.  
  886. 50% {
  887. transform: scale(0);
  888. }
  889.  
  890. 100% {
  891. transform: scale(1);
  892. }
  893. }
  894.  
  895. #infinite-loader {
  896. display: none;
  897. position: fixed;
  898. top: 50%;
  899. left: 50%;
  900. width: 20px;
  901. height: 20px;
  902. }
  903.  
  904. #infinite-loader.active {
  905. display: block;
  906. }
  907.  
  908. #infinite-loader > * {
  909. display: block;
  910. position: absolute;
  911. top: -50%;
  912. left: -50%;
  913. width: 100%;
  914. height: 100%;
  915. background: #963cbd;
  916. border-radius: 50%;
  917. }
  918.  
  919. #infinite-loader > *:nth-child(1) {
  920. background: transparent;
  921. }
  922.  
  923. #infinite-loader > *:nth-child(2) {
  924. -webkit-animation: buffer1 0.5s infinite;
  925. -moz-animation: buffer1 0.5s infinite;
  926. -o-animation: buffer1 0.5s infinite;
  927. -ms-animation: buffer1 0.5s infinite;
  928. animation: buffer1 0.5s infinite;
  929. }
  930.  
  931. #infinite-loader > *:nth-child(3) {
  932. background: transparent;
  933. -webkit-animation: buffer2 0.2s infinite;
  934. -moz-animation: buffer2 0.2s infinite;
  935. -o-animation: buffer2 0.2s infinite;
  936. -ms-animation: buffer2 0.2s infinite;
  937. animation: buffer2 0.2s infinite;
  938. }
  939.  
  940. /**
  941. * 4.0 Header
  942. * -----------------------------------------------------------------------------
  943. */
  944.  
  945. /* Ensure that there is no gap between the header and the admin bar for WordPress versions before 3.8. */
  946. #wpadminbar {
  947. min-height: 32px;
  948. }
  949.  
  950. .site-header {
  951. background: #fff;
  952.  
  953. }
  954.  
  955. .site-title {
  956. margin: 0;
  957. font-size: 15px;
  958. font-size: 1.8rem;
  959. font-weight: 700;
  960. line-height: 28px;
  961. line-height: 2.8rem;
  962. }
  963.  
  964. #header-helper {
  965. position: absolute;
  966. top: 0;
  967. left: 0;
  968. width: 10px;
  969. height: 1px;
  970. }
  971.  
  972. /**
  973. * 5.0 Navigation
  974. * -----------------------------------------------------------------------------
  975. */
  976. .site-navigation ul {
  977. list-style: none;
  978. margin: 0;
  979. }
  980.  
  981. .site-navigation li {
  982. display: block;
  983. position: relative;
  984. font-size: 18px;
  985. font-size: 1.8rem;
  986. line-height: 28px;
  987. line-height: 2.8rem;
  988. word-wrap: break-word;
  989. }
  990.  
  991. .site-navigation ul ul ul {
  992. padding-left: 20px;
  993. padding-left: 2rem;
  994. }
  995.  
  996. .menu-toggle {
  997. display: none;
  998. position: absolute;
  999. top: 10px;
  1000. top: 1rem;
  1001. right: 20px;
  1002. right: 2rem;
  1003. margin: 0;
  1004. color: #222223;
  1005. font-family: expositio;
  1006. font-size: 30px;
  1007. font-size: 3rem;
  1008. line-height: 30px;
  1009. line-height: 3rem;
  1010. cursor: pointer;
  1011. }
  1012.  
  1013. .menu-toggle:hover {
  1014. color: #963cbd;
  1015. }
  1016.  
  1017. #navigation-close {
  1018. display: none;
  1019. position: absolute;
  1020. z-index: 10000;
  1021. top: 10px;
  1022. top: 1rem;
  1023. right: 20px;
  1024. right: 2rem;
  1025. font-size: 30px;
  1026. font-size: 3rem;
  1027. line-height: 30px;
  1028. line-height: 3rem;
  1029. color: #fff;
  1030. cursor: pointer;
  1031. }
  1032.  
  1033. /**
  1034. * 6.0 Content
  1035. * -----------------------------------------------------------------------------
  1036. */
  1037. .content-area {
  1038. white-space: nowrap;
  1039. }
  1040.  
  1041. .hentry,
  1042. .page-content {
  1043. display: inline-block;
  1044. vertical-align: top;
  1045. white-space: normal;
  1046. word-wrap: break-word;
  1047. }
  1048.  
  1049. body.single .hentry {
  1050. width: 67.391304348%;
  1051. padding-right: 20px;
  1052. padding-right: 2rem;
  1053. }
  1054.  
  1055. body.page .hentry,
  1056. .page-content {
  1057. width: 67.391304348%;
  1058. padding-right: 20px;
  1059. padding-right: 2rem;
  1060. }
  1061.  
  1062. .image_link:hover {
  1063. border-bottom: none;
  1064. }
  1065.  
  1066. /**
  1067. * 6.1 Post Thumbnail
  1068. * -----------------------------------------------------------------------------
  1069. */
  1070. .post-thumbnail {
  1071. display: inline-block;
  1072. vertical-align: top;
  1073. }
  1074.  
  1075. body.home .post-thumbnail {
  1076. height: 100%;
  1077. }
  1078.  
  1079. /**
  1080. * 6.2 Entry Header
  1081. * -----------------------------------------------------------------------------
  1082. */
  1083. body.single .entry-header,
  1084. body.page .entry-header,
  1085. .page-header {
  1086. margin-bottom: 20px;
  1087. margin-bottom: 2rem;
  1088. }
  1089.  
  1090. .entry-title,
  1091. .page-title {
  1092. margin: 0;
  1093. font-size: 18px;
  1094. font-size: 1.8rem;
  1095. font-weight: 700;
  1096. line-height: 28px;
  1097. line-height: 2.8rem;
  1098. word-wrap: break-word;
  1099. white-space: pre-wrap;
  1100. }
  1101.  
  1102. /**
  1103. * 6.3 Entry Meta
  1104. * -----------------------------------------------------------------------------
  1105. */
  1106.  
  1107. /**
  1108. * 6.4 Entry Content
  1109. * -----------------------------------------------------------------------------
  1110. */
  1111. .entry-content > p:last-child {
  1112. margin-bottom: 0;
  1113. }
  1114.  
  1115. .entry-content a,
  1116. .page-content a {
  1117. border-bottom: 1px solid;
  1118. }
  1119.  
  1120. /**
  1121. * 6.5 Gallery
  1122. * -----------------------------------------------------------------------------
  1123. */
  1124. .gallery {
  1125. display: inline-block;
  1126. width: auto;
  1127. height: 100%;
  1128. margin: 0;
  1129. list-style-type: none;
  1130. }
  1131.  
  1132. .gallery-item {
  1133. display: inline-block;
  1134. width: auto;
  1135. height: 100%;
  1136. padding-right: 20px;
  1137. padding-right: 2rem;
  1138. vertical-align: top;
  1139. white-space: normal;
  1140. }
  1141.  
  1142. .gallery-item img {
  1143. display: block;
  1144. width: auto;
  1145. height: 100%;
  1146. height: -moz-calc(100% - 28px);
  1147. height: -webkit-calc(100% - 28px);
  1148. height: calc(100% - 28px);
  1149. }
  1150.  
  1151. /**
  1152. * 6.6 Post Formats
  1153. * -----------------------------------------------------------------------------
  1154. */
  1155.  
  1156. /**
  1157. * 6.7 Post/Image/Paging Navigation
  1158. * -----------------------------------------------------------------------------
  1159. */
  1160. .paging-navigation {
  1161. display: none;
  1162. }
  1163.  
  1164. #image-navigation {
  1165. text-align: right;
  1166. }
  1167.  
  1168. #image-navigation a:first-of-type {
  1169. float: left;
  1170. }
  1171.  
  1172. /**
  1173. * 6.8 Attachments
  1174. * -----------------------------------------------------------------------------
  1175. */
  1176. .entry-attachment .attachment {
  1177. margin-bottom: 28px;
  1178. margin-bottom: 2.8rem;
  1179. }
  1180.  
  1181. /**
  1182. * 6.9 Archives
  1183. * -----------------------------------------------------------------------------
  1184. */
  1185.  
  1186. /**
  1187. * 6.10 Contributor Page
  1188. * -----------------------------------------------------------------------------
  1189. */
  1190.  
  1191. /**
  1192. * 6.11 404 Page
  1193. * -----------------------------------------------------------------------------
  1194. */
  1195. .error404 .page-content {
  1196. /*padding-top: 0;*/
  1197. }
  1198.  
  1199. .error404 .page-content .search-form {
  1200. /*margin-bottom: 24px;*/
  1201. }
  1202.  
  1203. /**
  1204. * 6.12 Full-width
  1205. * -----------------------------------------------------------------------------
  1206. */
  1207.  
  1208. /**
  1209. * 6.13 Singular
  1210. * -----------------------------------------------------------------------------
  1211. */
  1212.  
  1213. /**
  1214. * 6.14 Comments
  1215. * -----------------------------------------------------------------------------
  1216. */
  1217.  
  1218. /**
  1219. * 7.0 Sidebars
  1220. * -----------------------------------------------------------------------------
  1221. */
  1222.  
  1223. /**
  1224. * 7.1 Widgets
  1225. * -----------------------------------------------------------------------------
  1226. */
  1227.  
  1228. /**
  1229. * 7.2 Content Sidebar Widgets
  1230. * -----------------------------------------------------------------------------
  1231. */
  1232.  
  1233. /**
  1234. * 8.0 Footer
  1235. * -----------------------------------------------------------------------------
  1236. */
  1237. .site-footer {
  1238. position: absolute;
  1239. bottom: 0;
  1240. left: 0;
  1241. width: 100%;
  1242. padding: 0 20px 40px;
  1243. padding: 0 2rem 4rem;
  1244. color: #999;
  1245. }
  1246.  
  1247. /**
  1248. * 9.0 Featured Content
  1249. * -----------------------------------------------------------------------------
  1250. */
  1251.  
  1252. /**
  1253. * 10.0 Multisite
  1254. * -----------------------------------------------------------------------------
  1255. */
  1256.  
  1257. /**
  1258. * 11.0 Media Queries
  1259. * -----------------------------------------------------------------------------
  1260. */
  1261.  
  1262. /* Does the same thing as <meta name="viewport" content="width=device-width">,
  1263. * but in the future W3C standard way. -ms- prefix is required for IE10+ to
  1264. * render responsive styling in Windows 8 "snapped" views; IE10+ does not honor
  1265. * the meta tag. See http://core.trac.wordpress.org/ticket/25888.
  1266. */
  1267. @-ms-viewport {
  1268. width: device-width;
  1269. }
  1270.  
  1271. @viewport {
  1272. width: device-width;
  1273. }
  1274.  
  1275. @media (min-width: 951px) {
  1276. .site {
  1277. height: 100%;
  1278. padding: 40px 20px 40px 250px;
  1279. padding: 4rem 2rem 4rem 25rem;
  1280. }
  1281.  
  1282. .site-header {
  1283. position: fixed;
  1284. top: 0;
  1285. left: 0;
  1286. width: 250px;
  1287. height: 100%;
  1288. padding: 40px 30px 0;
  1289. padding: 4rem 3rem 0;
  1290. }
  1291.  
  1292. body.admin-bar .site-header {
  1293. top: 32px;
  1294. }
  1295.  
  1296. .primary-navigation {
  1297. padding: 20px 0 40px;
  1298. padding: 2rem 0 4rem;
  1299. }
  1300.  
  1301. #top-right-menu {
  1302. margin-top: 20px;
  1303. margin-top: 2rem;
  1304. }
  1305.  
  1306. .nav-menu li {
  1307. opacity: 0;
  1308. }
  1309.  
  1310. .site-navigation > div > ul > li.menu-item-has-children {
  1311. margin-top: 20px;
  1312. margin-top: 2rem;
  1313. }
  1314.  
  1315. .site-navigation > div > ul > li.menu-item-has-children > a {
  1316. font-weight: 700;
  1317. }
  1318.  
  1319. .site-navigation > div > ul ul ul {
  1320. padding-left: 20px;
  1321. padding-left: 2rem;
  1322. }
  1323.  
  1324. .current-menu-item > a {
  1325. font-weight: 700;
  1326. }
  1327.  
  1328. #main {
  1329. height: 100%;
  1330. }
  1331.  
  1332. body.home .hentry {
  1333. height: 100%;
  1334. padding-right: 20px;
  1335. padding-right: 2rem;
  1336. }
  1337.  
  1338. body.home .hentry > a {
  1339. display: inline-block;
  1340. height: 100%;
  1341. height: -moz-calc(100% - 28px);
  1342. height: -webkit-calc(100% - 28px);
  1343. height: calc(100% - 28px);
  1344. }
  1345.  
  1346. body.home .hentry img {
  1347. height: 100%;
  1348. width: auto;
  1349. }
  1350.  
  1351. body.single .hentry {
  1352. padding-bottom: 40px;
  1353. padding-bottom: 4rem;
  1354. max-width: 620px;
  1355. }
  1356.  
  1357. body.page .hentry,
  1358. .page-content {
  1359. padding-bottom: 40px;
  1360. padding-bottom: 4rem;
  1361. max-width: 620px;
  1362. }
  1363.  
  1364. .gallery-animated img {
  1365. cursor: pointer;
  1366. }
  1367. }
  1368.  
  1369. @media (max-width: 950px) {
  1370. .site-header {
  1371. height: auto !important;
  1372. padding: 10px 20px 30px;
  1373. padding: 1rem 2rem 3rem;
  1374. }
  1375.  
  1376. #header-helper {
  1377. display: none;
  1378. }
  1379.  
  1380. .site-title {
  1381. padding-right: 40px;
  1382. padding-right: 4rem;
  1383. }
  1384.  
  1385. .menu-toggle {
  1386. display: block;
  1387. }
  1388.  
  1389. .menu-toggle.hidden {
  1390. display: none;
  1391. }
  1392.  
  1393. .primary-navigation {
  1394. position: absolute;
  1395. z-index: 9999;
  1396. top: 0;
  1397. left: -84.375%;
  1398. width: 84.375%;
  1399. height: 100%;
  1400. background-color: #963cbd;
  1401. padding: 10px 20px;
  1402. padding: 1rem 2rem;
  1403. overflow-y: auto;
  1404. -webkit-transition: left 0.3s ease-out;
  1405. -moz-transition: left 0.3s ease-out;
  1406. -o-transition: left 0.3s ease-out;
  1407. transition: left 0.3s ease-out;
  1408. }
  1409.  
  1410. #top-right-menu {
  1411. margin-top: 20px;
  1412. margin-top: 2rem;
  1413. }
  1414.  
  1415. .site-navigation > div > ul > li.menu-item-has-children {
  1416. margin-top: 20px;
  1417. margin-top: 2rem;
  1418. }
  1419.  
  1420. .site-navigation > div > ul > li.menu-item-has-children > a {
  1421. font-weight: 700;
  1422. }
  1423.  
  1424. #wrapper {
  1425. position: relative;
  1426. }
  1427.  
  1428. #wrapper.overflow_fix {
  1429. overflow: hidden;
  1430. }
  1431.  
  1432. .site {
  1433. position: relative;
  1434. left: 0;
  1435. width: 100%;
  1436. min-height: 100%;
  1437. }
  1438.  
  1439. .toggled-on .site {
  1440. left: 84.375%;
  1441. height: 100%;
  1442. }
  1443.  
  1444. .toggled-on .site-footer {
  1445. display: none;
  1446. }
  1447.  
  1448. .primary-navigation a {
  1449. font-size: 22px;
  1450. font-size: 2.2rem;
  1451. line-height: 35px;
  1452. line-height: 3.5rem;
  1453. color: #fff;
  1454. }
  1455.  
  1456. .primary-navigation a:hover {
  1457. border-bottom: 1px solid #fff;
  1458. }
  1459.  
  1460. .toggled-on #navigation-close {
  1461. display: block;
  1462. }
  1463.  
  1464. #main {
  1465. width: 100%;
  1466. padding: 0 20px;
  1467. padding: 0 2rem;
  1468. }
  1469.  
  1470. body.single #primary,
  1471. body.page #main-content {
  1472. padding-left: 20.689655172%;
  1473. }
  1474.  
  1475. body.home .hentry,
  1476. body.home .post-thumbnail,
  1477. body.home .hentry img {
  1478. height: auto;
  1479. width: 100% !important;
  1480. }
  1481.  
  1482. body.home .hentry {
  1483. display: block;
  1484. padding-bottom: 20px;
  1485. padding-bottom: 2rem;
  1486. }
  1487.  
  1488. body.home .hentry:last-of-type {
  1489. padding-bottom: 0;
  1490. }
  1491.  
  1492. body.single #primary,
  1493. body.page #main-content {
  1494. padding-left: 0;
  1495. }
  1496.  
  1497. body.single .hentry,
  1498. body.page .hentry,
  1499. .page-content {
  1500. width: 100%;
  1501. padding-right: 0;
  1502. }
  1503.  
  1504. .post-thumbnail {
  1505. display: block;
  1506. }
  1507.  
  1508. .gallery {
  1509. display: block;
  1510. margin-top: 28px;
  1511. margin-top: 2.8rem;
  1512. }
  1513.  
  1514. .gallery-item {
  1515. display: block;
  1516. width: 100% !important;
  1517. height: auto;
  1518. padding: 0 0 20px;
  1519. padding: 0 0 2rem;
  1520. }
  1521.  
  1522. .gallery-item:last-child {
  1523. padding-bottom: 0;
  1524. }
  1525.  
  1526. .gallery-item img {
  1527. width: 100% !important;
  1528. height: auto;
  1529. }
  1530.  
  1531. .site-footer {
  1532. padding-top: 30px;
  1533. padding-top: 3rem;
  1534. }
  1535. }
  1536. /**
  1537. * 12.0 Print
  1538. * -----------------------------------------------------------------------------
  1539. */
  1540.  
  1541. @media print {
  1542. body {
  1543. /* Brute force since user agents all print differently. */
  1544. background: none !important;
  1545. }
  1546. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement