style.css 35 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142
  1. /* Theme Name: Penscratch 2
  2. * Theme URI: https://wordpress.com/themes/penscratch-2/
  3. * Author: Automattic
  4. * Author URI: https://wordpress.com/themes/
  5. * Description: A clean, responsive writing theme with support for custom logos, featured images, fancy pull quotes, and more.
  6. * Version: 2.0.2-wpcom
  7. * License: GNU General Public License v2 or later
  8. * License URI: http://www.gnu.org/licenses/gpl-2.0.html
  9. * Text Domain: penscratch
  10. * Tags: blog, classic-menu, clean, custom-background, custom-colors, custom-header, custom-menu, editor-style, education, flexible-header, full-width-template, gray, infinite-scroll, journal, light, minimal, one-column, responsive-layout, right-sidebar, rtl-language-support, school, simple, site-logo, translation-ready, two-columns, white
  11. * This theme, like WordPress, is licensed under the GPL.
  12. * Use it to make something cool, have fun, and share what you've learned with others.
  13. *
  14. * Penscratch 2 is based on Underscores http://underscores.me/, (C) 2012-2017 Automattic, Inc.
  15. *
  16. * Resetting and rebuilding styles have been helped along thanks to the fine work of
  17. * Eric Meyer http://meyerweb.com/eric/tools/css/reset/index.html
  18. * along with Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
  19. * and Blueprint http://www.blueprintcss.org/ */
  20. /* =Reset
  21. -------------------------------------------------------------- */
  22. html,
  23. body,
  24. div,
  25. span,
  26. applet,
  27. object,
  28. iframe,
  29. h1,
  30. h2,
  31. h3,
  32. h4,
  33. h5,
  34. h6,
  35. p,
  36. blockquote,
  37. pre,
  38. a,
  39. abbr,
  40. acronym,
  41. address,
  42. big,
  43. cite,
  44. code,
  45. del,
  46. dfn,
  47. em,
  48. font,
  49. ins,
  50. kbd,
  51. q,
  52. s,
  53. samp,
  54. small,
  55. strike,
  56. strong,
  57. sub,
  58. sup,
  59. tt,
  60. var,
  61. dl,
  62. dt,
  63. dd,
  64. ol,
  65. ul,
  66. li,
  67. fieldset,
  68. form,
  69. label,
  70. legend,
  71. table,
  72. caption,
  73. tbody,
  74. tfoot,
  75. thead,
  76. tr,
  77. th,
  78. td,
  79. th {
  80. font-family: inherit;
  81. font-size: 100%;
  82. font-weight: inherit;
  83. font-style: inherit;
  84. margin: 0;
  85. padding: 0;
  86. vertical-align: baseline;
  87. border: 0;
  88. outline: 0;
  89. }
  90. html {
  91. font-size: 62.5%;
  92. /* Corrects text resizing oddly in IE6/7 when body font-size is set using em units http://clagnut.com/blog/4/#c790 */
  93. overflow-y: scroll;
  94. /* Keeps page centered in all browsers regardless of content height */
  95. -webkit-text-size-adjust: 100%;
  96. /* Prevents iOS text size adjust after orientation change, without disabling user zoom */
  97. -ms-text-size-adjust: 100%;
  98. /* www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/ */
  99. }
  100. *,
  101. *:before,
  102. *:after {
  103. /* apply a natural box layout model to all elements; see http://www.paulirish.com/2012/box-sizing-border-box-ftw/ */
  104. -webkit-box-sizing: border-box;
  105. /* Not needed for modern webkit but still used by Blackberry Browser 7.0; see http://caniuse.com/#search=box-sizing */
  106. -moz-box-sizing: border-box;
  107. /* Still needed for Firefox 28; see http://caniuse.com/#search=box-sizing */
  108. box-sizing: border-box;
  109. }
  110. body {
  111. background: #fff;
  112. }
  113. article,
  114. aside,
  115. details,
  116. figcaption,
  117. figure,
  118. footer,
  119. header,
  120. main,
  121. nav,
  122. section {
  123. display: block;
  124. }
  125. ol,
  126. ul {
  127. list-style: none;
  128. }
  129. table {
  130. border-spacing: 0;
  131. /* tables still need 'cellspacing="0"' in the markup */
  132. border-collapse: separate;
  133. }
  134. caption,
  135. th,
  136. td,
  137. th {
  138. font-weight: normal;
  139. text-align: left;
  140. }
  141. blockquote:before,
  142. blockquote:after,
  143. q:before,
  144. q:after {
  145. content: '';
  146. }
  147. blockquote,
  148. q {
  149. quotes: '' '';
  150. }
  151. a:focus {
  152. outline: thin dotted;
  153. }
  154. a:hover,
  155. a:active {
  156. outline: 0;
  157. }
  158. a img {
  159. border: 0;
  160. }
  161. /* =Rebuild
  162. ----------------------------------------------- */
  163. * html {
  164. font-size: 100%;
  165. }
  166. html {
  167. font-size: 16px;
  168. line-height: 1.5em;
  169. }
  170. body,
  171. button,
  172. input,
  173. select,
  174. textarea {
  175. font-family: Georgia, 'Bitstream Charter', serif;
  176. font-size: 16px;
  177. font-weight: 400;
  178. color: #404040;
  179. }
  180. /* Headings */
  181. h1,
  182. h2,
  183. h3,
  184. h4,
  185. h5,
  186. h6 {
  187. clear: both;
  188. }
  189. /* Text elements */
  190. p {
  191. margin-bottom: 24px;
  192. }
  193. ul,
  194. ol {
  195. margin: 0 0 24px 36px;
  196. }
  197. ul {
  198. list-style: disc;
  199. }
  200. ol {
  201. list-style: decimal;
  202. }
  203. li > ul,
  204. li > ol {
  205. margin-bottom: 0;
  206. margin-left: 24px;
  207. }
  208. dt {
  209. font-weight: 600;
  210. }
  211. dd {
  212. margin: 0 24px 24px;
  213. }
  214. b,
  215. strong {
  216. font-weight: 600;
  217. }
  218. dfn,
  219. cite,
  220. em,
  221. i {
  222. font-style: italic;
  223. }
  224. blockquote {
  225. margin: 0 24px;
  226. }
  227. address {
  228. margin: 0 0 24px;
  229. }
  230. pre {
  231. font-family: 'Courier 10 Pitch', Courier, monospace;
  232. font-size: .9375em;
  233. line-height: 1.6em;
  234. overflow: auto;
  235. max-width: 100%;
  236. margin-top: -2px;
  237. margin-bottom: 24px;
  238. padding: 24px;
  239. background: rgba(119, 119, 119, .5);
  240. }
  241. code,
  242. kbd,
  243. tt,
  244. var {
  245. font-family: Monaco, Consolas, 'Andale Mono', 'DejaVu Sans Mono', monospace;
  246. font-size: .875em;
  247. line-height: 1.71429em;
  248. }
  249. abbr,
  250. acronym {
  251. cursor: help;
  252. border-bottom: 1px dotted #666;
  253. }
  254. mark,
  255. ins {
  256. text-decoration: none;
  257. background: #fff9c0;
  258. }
  259. sup,
  260. sub {
  261. font-size: 75%;
  262. line-height: 0;
  263. position: relative;
  264. height: 0;
  265. vertical-align: baseline;
  266. }
  267. sup {
  268. bottom: 1ex;
  269. }
  270. sub {
  271. top: .5ex;
  272. }
  273. small {
  274. font-size: 75%;
  275. }
  276. big {
  277. font-size: 125%;
  278. }
  279. figure {
  280. margin: 0;
  281. }
  282. table {
  283. width: 100%;
  284. margin: 0 0 24px;
  285. }
  286. th {
  287. font-weight: bold;
  288. }
  289. img {
  290. /* Make sure images are scaled correctly. */
  291. max-width: 100%;
  292. height: auto;
  293. /* Adhere to container width. */
  294. }
  295. /* Alignment */
  296. .alignleft {
  297. display: inline;
  298. float: left;
  299. margin-right: 24px;
  300. }
  301. .alignright {
  302. display: inline;
  303. float: right;
  304. margin-left: 24px;
  305. }
  306. .aligncenter {
  307. display: block;
  308. clear: both;
  309. margin: 0 auto;
  310. }
  311. /* Text meant only for screen readers */
  312. .screen-reader-text {
  313. position: absolute !important;
  314. clip: rect(1px, 1px, 1px, 1px);
  315. }
  316. .screen-reader-text:focus {
  317. font-weight: 600;
  318. line-height: 24px;
  319. position: absolute !important;
  320. z-index: 100000; /* Above WP toolbar. */
  321. top: 24px;
  322. left: 24px;
  323. display: inline-block;
  324. clip: auto !important;
  325. padding: 24px;
  326. border: 1px solid #000;
  327. background-color: #fff;
  328. -webkit-box-shadow: rgba(0, 0, 0, .6) 2px 2px 10px;
  329. -moz-box-shadow: rgba(0, 0, 0, .6) 2px 2px 10px;
  330. box-shadow: rgba(0, 0, 0, .6) 2px 2px 10px;
  331. }
  332. /* Clearing */
  333. .clear:before,
  334. .clear:after {
  335. display: table;
  336. content: '';
  337. }
  338. .clear:after {
  339. clear: both;
  340. }
  341. .entry-content:before,
  342. .entry-content:after {
  343. display: table;
  344. content: '';
  345. }
  346. .entry-content:after {
  347. clear: both;
  348. }
  349. .comment-content:before,
  350. .comment-content:after {
  351. display: table;
  352. content: '';
  353. }
  354. .comment-content:after {
  355. clear: both;
  356. }
  357. .site-header:before,
  358. .site-header:after {
  359. display: table;
  360. content: '';
  361. }
  362. .site-header:after {
  363. clear: both;
  364. }
  365. .site-content:before,
  366. .site-content:after {
  367. display: table;
  368. content: '';
  369. }
  370. .site-content:after {
  371. clear: both;
  372. }
  373. .site-footer:before,
  374. .site-footer:after {
  375. display: table;
  376. content: '';
  377. }
  378. .site-footer:after {
  379. clear: both;
  380. }
  381. /* =Forms
  382. ----------------------------------------------- */
  383. button,
  384. input,
  385. select,
  386. textarea {
  387. margin: 0;
  388. /* Addresses margins set differently in IE6/7, F3, S5, Chrome */
  389. vertical-align: baseline;
  390. /* Improves appearance and consistency in all browsers */
  391. *vertical-align: middle;
  392. /* Improves appearance and consistency in all browsers */
  393. }
  394. button,
  395. input[type='button'],
  396. input[type='reset'],
  397. input[type='submit'] {
  398. cursor: pointer;
  399. color: rgba(0, 0, 0, .8);
  400. border: 1px solid #ccc;
  401. border-color: #ccc #ccc #bbb #ccc;
  402. border-radius: 3px;
  403. background: #e6e6e6;
  404. box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5), inset 0 15px 17px rgba(255, 255, 255, .5), inset 0 -5px 12px rgba(0, 0, 0, .05);
  405. /* Corrects inability to style clickable 'input' types in iOS */
  406. text-shadow: 0 1px 0 rgba(255, 255, 255, .8);
  407. /* Improves usability and consistency of cursor style between image-type 'input' and others */
  408. -webkit-appearance: button;
  409. }
  410. button:hover,
  411. input[type='button']:hover,
  412. input[type='reset']:hover,
  413. input[type='submit']:hover {
  414. border-color: #ccc #bbb #aaa #bbb;
  415. box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8), inset 0 15px 17px rgba(255, 255, 255, .8), inset 0 -5px 12px rgba(0, 0, 0, .02);
  416. }
  417. button:focus,
  418. input[type='button']:focus,
  419. input[type='reset']:focus,
  420. input[type='submit']:focus,
  421. button:active,
  422. input[type='button']:active,
  423. input[type='reset']:active,
  424. input[type='submit']:active {
  425. border-color: #aaa #bbb #bbb #bbb;
  426. box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .5), inset 0 2px 5px rgba(0, 0, 0, .15);
  427. }
  428. input[type='checkbox'],
  429. input[type='radio'] {
  430. padding: 0;
  431. /* Addresses excess padding in IE8/9 */
  432. }
  433. input[type='search'] {
  434. /* Addresses appearance set to searchfield in S5, Chrome */
  435. -webkit-box-sizing: content-box;
  436. /* Addresses box sizing set to border-box in S5, Chrome (include -moz to future-proof) */
  437. -moz-box-sizing: content-box;
  438. box-sizing: content-box;
  439. -webkit-appearance: textfield;
  440. }
  441. input[type='search']::-webkit-search-decoration {
  442. /* Corrects inner padding displayed oddly in S5, Chrome on OSX */
  443. -webkit-appearance: none;
  444. }
  445. button::-moz-focus-inner,
  446. input::-moz-focus-inner {
  447. padding: 0;
  448. /* Corrects inner padding and border displayed oddly in FF3 www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/ */
  449. border: 0;
  450. }
  451. input[type='text'],
  452. input[type='email'],
  453. input[type='url'],
  454. input[type='password'],
  455. input[type='search'],
  456. textarea {
  457. color: #666;
  458. border: 1px solid #ccc;
  459. border-radius: 3px;
  460. }
  461. input[type='text']:focus,
  462. input[type='email']:focus,
  463. input[type='url']:focus,
  464. input[type='password']:focus,
  465. input[type='search']:focus,
  466. textarea:focus {
  467. color: #111;
  468. }
  469. input[type='text'],
  470. input[type='email'],
  471. input[type='url'],
  472. input[type='password'],
  473. input[type='search'] {
  474. padding: 3px;
  475. }
  476. textarea {
  477. overflow: auto;
  478. /* Improves readability and alignment in all browsers */
  479. width: 98%;
  480. /* Removes default vertical scrollbar in IE6/7/8/9 */
  481. padding-left: 3px;
  482. vertical-align: top;
  483. }
  484. * html {
  485. font-size: 100%;
  486. }
  487. html {
  488. font-size: 16px;
  489. line-height: 1.7em;
  490. }
  491. /* =Global */
  492. body {
  493. background-color: #eee;
  494. font-family: "Roboto Slab", Georgia, Times, serif;
  495. font-size: 15px;
  496. font-weight: 300;
  497. line-height: 27px;
  498. color: #666;
  499. }
  500. /* Alignment */
  501. .alignleft {
  502. display: inline;
  503. float: left;
  504. margin: 14px 27px 14px 0;
  505. }
  506. .alignright {
  507. display: inline;
  508. float: right;
  509. margin: 14px 0 14px 27px;
  510. }
  511. .aligncenter {
  512. display: block;
  513. clear: both;
  514. margin: 14px auto;
  515. }
  516. .alignnone {
  517. margin-top: 14px;
  518. margin-bottom: 14px;
  519. }
  520. /* Headings */
  521. h1,
  522. h2,
  523. h3,
  524. h4,
  525. h5,
  526. h6 {
  527. color: #666;
  528. font-family: "Roboto Slab", Georgia, Times, serif;
  529. }
  530. h1 {
  531. font-size: 28px;
  532. font-weight: normal;
  533. margin: 27px 0;
  534. }
  535. h2 {
  536. font-size: 20px;
  537. font-weight: normal;
  538. margin: 27px 0;
  539. }
  540. h3,
  541. #respond h3 {
  542. font-size: 20px;
  543. font-weight: normal;
  544. margin: 27px 0;
  545. }
  546. h4 {
  547. font-size: 16px;
  548. font-weight: normal;
  549. margin: 27px 0;
  550. }
  551. h5 {
  552. font-size: 16px;
  553. font-weight: normal;
  554. margin: 27px 0;
  555. }
  556. h6 {
  557. font-size: 14px;
  558. font-weight: normal;
  559. margin: 27px 0;
  560. }
  561. hr {
  562. height: 0;
  563. margin-top: -1px;
  564. margin-bottom: 24px;
  565. padding-top: 24px;
  566. border: 1px solid #ccc;
  567. border-width: 0 0 1px 0;
  568. clear: both;
  569. }
  570. /* Text elements */
  571. p {
  572. margin-bottom: 27px;
  573. }
  574. ul {
  575. margin: 0 0 27px 27px;
  576. list-style: disc;
  577. }
  578. ul ul {
  579. list-style: square;
  580. }
  581. ul ul ul {
  582. list-style: circle;
  583. }
  584. ol {
  585. margin: 0 0 27px 27px;
  586. list-style: decimal;
  587. }
  588. ol ol {
  589. list-style: lower-alpha;
  590. }
  591. ol ol ol {
  592. list-style: lower-roman;
  593. }
  594. li > ul,
  595. li > ol {
  596. margin-bottom: 0;
  597. margin-left: 27px;
  598. }
  599. dt {
  600. font-weight: 400;
  601. }
  602. dd {
  603. margin: 14px 0 14px 27px;
  604. }
  605. b,
  606. strong {
  607. font-weight: bold;
  608. }
  609. dfn,
  610. cite,
  611. em,
  612. i {
  613. font-style: italic;
  614. }
  615. blockquote {
  616. margin: 0 0 27px;
  617. padding-left: 48px;
  618. position: relative;
  619. color: #999;
  620. }
  621. blockquote:before {
  622. font-family: Baskerville, Georgia, serif;
  623. font-size: 48px;
  624. font-weight: bold;
  625. color: #eee;
  626. content: "\201D";
  627. display: block;
  628. position: absolute;
  629. top: 16px;
  630. left: 0;
  631. transform: scaleX(-1);
  632. }
  633. blockquote blockquote {
  634. font-size: inherit;
  635. }
  636. blockquote cite {
  637. display: block;
  638. font-size: inherit;
  639. font-weight: inherit;
  640. font-style: inherit;
  641. margin-top: 7px;
  642. width: 100%;
  643. text-align: right;
  644. }
  645. button,
  646. input[type='button'],
  647. input[type='reset'],
  648. input[type='submit'],
  649. .button,
  650. .button:visited {
  651. font-family: "Roboto Slab", Georgia, Times, serif;
  652. box-sizing: border-box;
  653. padding: 10px 14px;
  654. -webkit-transition: all .3s ease-in-out;
  655. transition: all .3s ease-in-out;
  656. letter-spacing: 1px;
  657. text-transform: uppercase;
  658. color: #999;
  659. border: 3px solid #eee;
  660. background: white;
  661. box-shadow: none;
  662. text-shadow: none;
  663. }
  664. button:hover,
  665. button:focus,
  666. button:active,
  667. input[type='button']:hover,
  668. input[type='button']:focus,
  669. input[type='button']:active,
  670. input[type='reset']:hover,
  671. input[type='reset']:focus,
  672. input[type='reset']:active,
  673. input[type='submit']:hover,
  674. input[type='submit']:focus,
  675. input[type='submit']:active,
  676. .button:hover,
  677. .button:focus,
  678. .button:active {
  679. -webkit-transition: all .3s ease-in-out;
  680. transition: all .3s ease-in-out;
  681. color: #1c7c7c;
  682. border-color: #1c7c7c;
  683. box-shadow: none;
  684. }
  685. input[type='text'],
  686. input[type='email'],
  687. input[type='url'],
  688. input[type='password'],
  689. input[type='search'] {
  690. -webkit-box-sizing: border-box;
  691. -moz-box-sizing: border-box;
  692. box-sizing: border-box;
  693. max-width: 100%;
  694. padding: 12px;
  695. border: 1px solid #eee;
  696. }
  697. input[type='text']:active,
  698. input[type='text']:focus,
  699. input[type='email']:active,
  700. input[type='email']:focus,
  701. input[type='url']:active,
  702. input[type='url']:focus,
  703. input[type='password']:active,
  704. input[type='password']:focus,
  705. input[type='search']:active,
  706. input[type='search']:focus {
  707. border-color: #d4d4d4;
  708. outline: none;
  709. background: white;
  710. }
  711. textarea {
  712. -webkit-box-sizing: border-box;
  713. -moz-box-sizing: border-box;
  714. box-sizing: border-box;
  715. max-width: 100%;
  716. padding: 12px;
  717. border: 1px solid #eee;
  718. }
  719. textarea:active,
  720. textarea:focus {
  721. border-color: #d4d4d4;
  722. outline: none;
  723. }
  724. address {
  725. font-style: italic;
  726. margin-bottom: 27px;
  727. }
  728. pre {
  729. background: transparent;
  730. color: #666;
  731. font-family: "Roboto Slab", Georgia, Times, serif;
  732. font-size: 15px;
  733. font-weight: 300;
  734. line-height: 27px;
  735. overflow: auto;
  736. max-width: 100%;
  737. margin-bottom: 27px;
  738. padding: 0;
  739. }
  740. code,
  741. kbd,
  742. tt,
  743. var {
  744. font: 14px Monaco, Consolas, 'Andale Mono', 'DejaVu Sans Mono', monospace;
  745. font-size: 1em;
  746. line-height: 2.09231em;
  747. }
  748. abbr,
  749. acronym {
  750. margin-bottom: 26px;
  751. cursor: help;
  752. border-bottom: 1px dotted #eee;
  753. }
  754. mark,
  755. ins {
  756. text-decoration: none;
  757. background: fff9c0;
  758. }
  759. sup,
  760. sub {
  761. font-size: .8125em;
  762. line-height: 2.09231em;
  763. line-height: 0;
  764. position: relative;
  765. height: 0;
  766. vertical-align: baseline;
  767. }
  768. sup {
  769. bottom: 1ex;
  770. }
  771. sub {
  772. top: .5ex;
  773. }
  774. small {
  775. font-size: .8125em;
  776. line-height: 2.09231em;
  777. }
  778. big {
  779. font-size: 1.2em;
  780. line-height: 1.36em;
  781. }
  782. figure {
  783. margin: 0;
  784. }
  785. table {
  786. width: 100%;
  787. margin-bottom: 27px;
  788. }
  789. td,
  790. th {
  791. padding: 7px 3px 6px;
  792. border-collapse: collapse;
  793. border-bottom: 1px solid #eee;
  794. }
  795. th {
  796. font-weight: bold;
  797. padding-bottom: 4px;
  798. letter-spacing: 1px;
  799. text-transform: uppercase;
  800. border-bottom-width: 3px;
  801. }
  802. img {
  803. max-width: 100%;
  804. height: auto;
  805. }
  806. /* Links */
  807. a {
  808. -webkit-transition: all .2s ease-in-out;
  809. -moz-transition: all .2s ease-in-out;
  810. -o-transition: all .2s ease-in-out;
  811. transition: all .2s ease-in-out;
  812. text-decoration: none;
  813. color: #1c7c7c;
  814. }
  815. a:visited {
  816. color: #1c7c7c;
  817. }
  818. a:hover,
  819. a:focus,
  820. a:active {
  821. -webkit-transition: all .2s ease-in-out;
  822. -moz-transition: all .2s ease-in-out;
  823. -o-transition: all .2s ease-in-out;
  824. transition: all .2s ease-in-out;
  825. color: #999;
  826. }
  827. /* =Layout */
  828. .site {
  829. margin: 14px;
  830. padding: 27px;
  831. background: white;
  832. }
  833. .site-footer {
  834. width: 100%;
  835. }
  836. .site-info-wrapper {
  837. clear: both;
  838. border-top: 3px solid #eee;
  839. margin: 24px 0 0;
  840. padding: 14px 0 0;
  841. }
  842. .site-info {
  843. text-align: center;
  844. letter-spacing: 1px;
  845. text-transform: uppercase;
  846. color: #999;
  847. font-size: .8125em;
  848. line-height: 2.09231em;
  849. }
  850. .site-info a {
  851. text-decoration: none;
  852. color: #999;
  853. }
  854. .site-info a:hover {
  855. color: #1c7c7c;
  856. }
  857. .site-info .sep {
  858. display: block;
  859. visibility: hidden;
  860. clear: both;
  861. height: 0;
  862. margin: 0;
  863. }
  864. .site-content {
  865. word-wrap: break-word;
  866. }
  867. .site-content .widget-area {
  868. margin-top: 27px;
  869. padding-top: 24px;
  870. border-top: 3px solid #eee;
  871. }
  872. /* =Header */
  873. .site-header {
  874. margin: 0 0 27px;
  875. padding: 0 0 24px;
  876. border-bottom: 3px solid #eee;
  877. }
  878. .custom-logo {
  879. display: block;
  880. width: auto;
  881. max-height: 200px;
  882. margin: 0 auto 14px;
  883. }
  884. .custom-header {
  885. display: block;
  886. margin: 0 auto;
  887. margin-bottom: 27px;
  888. border-radius: 5px;
  889. }
  890. .site-branding {
  891. clear: both;
  892. margin-bottom: 14px;
  893. text-align: center;
  894. }
  895. .site-title {
  896. font-size: 27px;
  897. font-weight: normal;
  898. line-height: 1;
  899. position: relative;
  900. z-index: 2;
  901. display: inline-block;
  902. clear: none;
  903. margin: 0;
  904. }
  905. .site-title a {
  906. text-decoration: none;
  907. color: #666;
  908. }
  909. .site-description {
  910. color: #999;
  911. font-size: 16px;
  912. font-weight: 300;
  913. letter-spacing: 0;
  914. margin: 7px auto;
  915. text-align: center;
  916. }
  917. /* =Menu */
  918. .main-navigation {
  919. border-top: 3px solid #eee;
  920. font-weight: normal;
  921. position: relative;
  922. display: block;
  923. letter-spacing: 1px;
  924. margin-top: 27px;
  925. padding-top: 24px;
  926. text-transform: uppercase;
  927. z-index: 1;
  928. }
  929. .main-navigation ul {
  930. clear: both;
  931. margin: 0;
  932. padding-left: 0;
  933. list-style: none;
  934. }
  935. .main-navigation li {
  936. position: relative;
  937. display: block;
  938. }
  939. .main-navigation li:hover > a {
  940. color: #1c7c7c;
  941. }
  942. .main-navigation a,
  943. .main-navigation a:visited {
  944. display: block;
  945. padding: 14px 0 14px;
  946. text-decoration: none;
  947. color: #999;
  948. border-bottom: 1px solid #eee;
  949. }
  950. .main-navigation ul:first-child > li:last-of-type a {
  951. border-bottom: 0;
  952. }
  953. .current_page_item a,
  954. .current-menu-item a,
  955. .current_page_item a:visited,
  956. .current-menu-item a:visited {
  957. color: #1c7c7c;
  958. }
  959. /* Small menu */
  960. .menu-toggle,
  961. .main-navigation.toggled .nav-menu {
  962. display: block;
  963. }
  964. .menu-toggle {
  965. margin: 0 auto;
  966. position: relative;
  967. padding: 5px 7px;
  968. border: 1px solid #eee;
  969. }
  970. .menu-toggle svg {
  971. width: 16px;
  972. margin-right: 4px;
  973. height: auto;
  974. vertical-align: middle;
  975. position: relative;
  976. top: -2px;
  977. }
  978. #menu-icon {
  979. fill: #999;
  980. -webkit-transition: all .3s ease-in-out;
  981. transition: all .3s ease-in-out;
  982. }
  983. .menu-toggle:hover #menu-icon {
  984. fill: #1c7c7c;
  985. }
  986. .toggled .menu-toggle {
  987. color: #1c7c7c;
  988. border-color: #1c7c7c;
  989. }
  990. .toggled #menu-icon {
  991. fill: #1c7c7c;
  992. }
  993. .main-navigation ul:first-child {
  994. display: none;
  995. }
  996. .main-navigation ul ul li a {
  997. padding-left: 14px;
  998. }
  999. .main-navigation ul ul ul li a {
  1000. padding-left: 28px;
  1001. }
  1002. .main-navigation ul ul ul ul li a {
  1003. padding-left: 42px;
  1004. }
  1005. /* =Content */
  1006. .hentry {
  1007. position: relative;
  1008. margin: 0 0 53px;
  1009. padding: 0 0 27px;
  1010. border-bottom: 1px solid #eee;
  1011. }
  1012. .site-main .hentry:last-of-type {
  1013. border-bottom: 0;
  1014. margin-bottom: 0;
  1015. }
  1016. .byline,
  1017. .updated {
  1018. display: none;
  1019. }
  1020. .single .byline,
  1021. .group-blog .byline {
  1022. display: inline;
  1023. }
  1024. .attachment-penscratch-2-featured {
  1025. margin: 14px 0 0;
  1026. -webkit-transition: all .3s ease-in-out;
  1027. transition: all .3s ease-in-out;
  1028. opacity: 1;
  1029. border-radius: 3px;
  1030. }
  1031. .hentry:hover .attachment-penscratch-2-featured {
  1032. -webkit-transition: all .3s ease-in-out;
  1033. transition: all .3s ease-in-out;
  1034. opacity: .7;
  1035. }
  1036. .entry-footer,
  1037. .entry-meta {
  1038. font-size: .8125em;
  1039. font-weight: normal;
  1040. line-height: 2.09231em;
  1041. margin: 0 0 27px;
  1042. letter-spacing: 1px;
  1043. text-transform: uppercase;
  1044. color: #999;
  1045. }
  1046. .entry-footer a,
  1047. .entry-meta a,
  1048. .entry-footer a:visited,
  1049. .entry-meta a:visited {
  1050. color: #999;
  1051. }
  1052. .entry-footer a:hover,
  1053. .entry-meta a:hover {
  1054. color: #1c7c7c;
  1055. }
  1056. .entry-title {
  1057. font-size: 1.75em;
  1058. line-height: 1.10em;
  1059. line-height: 1.21429em;
  1060. margin: 0 0 7px;
  1061. }
  1062. .entry-title a,
  1063. .entry-title a:visited {
  1064. text-decoration: none;
  1065. color: #666;
  1066. }
  1067. .entry-title a:hover {
  1068. color: #1c7c7c;
  1069. }
  1070. .page .entry-title {
  1071. margin: 0 0 27px;
  1072. }
  1073. .sep {
  1074. margin: 0 3px;
  1075. }
  1076. .entry-author {
  1077. border: 1px solid #eee;
  1078. padding: 27px;
  1079. margin: 27px 0 0;
  1080. }
  1081. .entry-author p:last-of-type {
  1082. margin-bottom: 0;
  1083. }
  1084. .author-title {
  1085. font-size: 1.2em;
  1086. margin: 0 0 7px;
  1087. }
  1088. .author-link {
  1089. clear: both;
  1090. display: inline-block;
  1091. font-style: italic;
  1092. }
  1093. .author-avatar {
  1094. float: left;
  1095. margin-right: 1.75em;
  1096. width: 60px;
  1097. }
  1098. .author-title {
  1099. clear: none;
  1100. }
  1101. .author-heading,
  1102. .author-bio {
  1103. margin-left: 86px;
  1104. }
  1105. .page-links {
  1106. clear: both;
  1107. margin: 27px 0;
  1108. word-spacing: 7px;
  1109. }
  1110. .page-title {
  1111. font-size: 18px;
  1112. line-height: 1.36em;
  1113. margin: 0;
  1114. padding-bottom: 14px;
  1115. letter-spacing: 1px;
  1116. color: #999;
  1117. border-bottom: 1px solid #eee;
  1118. }
  1119. .page-header {
  1120. margin-bottom: 27px;
  1121. }
  1122. .taxonomy-description {
  1123. font-style: italic;
  1124. margin-top: 27px;
  1125. }
  1126. /* =Media */
  1127. .entry-content img.wp-smiley,
  1128. .comment-content img.wp-smiley {
  1129. margin-top: 0;
  1130. margin-bottom: 0;
  1131. padding: 0;
  1132. border: none;
  1133. }
  1134. .wp-caption {
  1135. max-width: 100%;
  1136. margin-bottom: 27px;
  1137. }
  1138. .wp-caption img[class*='wp-image-'] {
  1139. display: block;
  1140. max-width: 100%;
  1141. margin: 0 auto;
  1142. }
  1143. .wp-caption-text {
  1144. font-size: .8125em;
  1145. line-height: 1.5675em;
  1146. margin: 14px 0;
  1147. padding: 0 1%;
  1148. }
  1149. .site-content .gallery {
  1150. margin-bottom: 27px;
  1151. }
  1152. .site-content .gallery a img {
  1153. max-width: 90%;
  1154. height: auto;
  1155. }
  1156. .site-content .gallery dd {
  1157. margin: 0;
  1158. }
  1159. /* Gallery column widths */
  1160. .gallery-columns-1 .gallery-item {
  1161. width: 100%;
  1162. }
  1163. .gallery-columns-2 .gallery-item {
  1164. width: 50%;
  1165. }
  1166. .gallery-columns-3 .gallery-item {
  1167. width: 33.33%;
  1168. }
  1169. .gallery-columns-4 .gallery-item {
  1170. width: 25%;
  1171. }
  1172. .gallery-columns-5 .gallery-item {
  1173. width: 20%;
  1174. }
  1175. .gallery-columns-6 .gallery-item {
  1176. width: 16.667%;
  1177. }
  1178. .gallery-columns-7 .gallery-item {
  1179. width: 14%;
  1180. }
  1181. .gallery-columns-8 .gallery-item {
  1182. width: 12.5%;
  1183. }
  1184. .gallery-columns-9 .gallery-item {
  1185. width: 11.11%;
  1186. }
  1187. .site-content .gallery-columns-1.gallery a img {
  1188. max-width: 100%;
  1189. }
  1190. .gallery-item {
  1191. display: inline-block;
  1192. margin-bottom: 14px;
  1193. text-align: center;
  1194. vertical-align: top;
  1195. }
  1196. .gallery-item img {
  1197. padding: 3px;
  1198. border: 1px solid #eee;
  1199. border-radius: 3px;
  1200. }
  1201. .gallery-caption {
  1202. font-size: .8125em;
  1203. line-height: 2.09231em;
  1204. line-height: 2.09231em;
  1205. max-width: 90%;
  1206. margin: 0 auto;
  1207. }
  1208. /* Make sure embeds and iframes fit their containers */
  1209. embed,
  1210. iframe,
  1211. object {
  1212. max-width: 100%;
  1213. }
  1214. /* =Navigation */
  1215. .site-main .post-navigation,
  1216. .site-main .paging-navigation {
  1217. font-size: .8125em;
  1218. font-style: italic;
  1219. line-height: 2.09231em;
  1220. line-height: 1.5;
  1221. overflow: hidden;
  1222. width: 100%;
  1223. margin: 0;
  1224. padding: 12px 0;
  1225. border-top: 1px solid #eee;
  1226. border-bottom: 1px solid #eee;
  1227. }
  1228. .site-main .post-navigation .meta-nav,
  1229. .site-main .paging-navigation .meta-nav {
  1230. clear: both;
  1231. color: #1c7c7c;
  1232. display: block;
  1233. font-style: normal;
  1234. letter-spacing: 1px;
  1235. text-transform: uppercase;
  1236. }
  1237. .site-main .post-navigation .nav-previous a,
  1238. .site-main .paging-navigation .nav-previous a {
  1239. color: #aaa;
  1240. position: relative;
  1241. float: left;
  1242. width: 50%;
  1243. text-decoration: none;
  1244. }
  1245. .site-main .post-navigation .nav-next a,
  1246. .site-main .paging-navigation .nav-next a {
  1247. color: #aaa;
  1248. position: relative;
  1249. float: right;
  1250. width: 50%;
  1251. text-align: right;
  1252. text-decoration: none;
  1253. }
  1254. .site-main .post-navigation a,
  1255. .site-main .paging-navigation a {
  1256. color: #aaa;
  1257. }
  1258. .site-main .post-navigation a:hover,
  1259. .site-main .paging-navigation a:hover {
  1260. color: #666;
  1261. }
  1262. .comment-navigation:before,
  1263. .comment-navigation:after {
  1264. display: table;
  1265. content: '';
  1266. }
  1267. .comment-navigation:after {
  1268. clear: both;
  1269. }
  1270. .site-main .comment-navigation {
  1271. font-size: .8125em;
  1272. line-height: 2.09231em;
  1273. line-height: 1.5;
  1274. clear: both;
  1275. width: 100%;
  1276. margin: 27px 0;
  1277. padding: 12px 0;
  1278. letter-spacing: 1px;
  1279. text-transform: uppercase;
  1280. border-top: 1px solid #eee;
  1281. border-bottom: 1px solid #eee;
  1282. }
  1283. .site-main .comment-navigation .nav-previous {
  1284. position: relative;
  1285. float: left;
  1286. width: 50%;
  1287. text-align: left;
  1288. }
  1289. .site-main .comment-navigation .nav-next {
  1290. position: relative;
  1291. float: right;
  1292. width: 50%;
  1293. text-align: right;
  1294. }
  1295. /* =Comments */
  1296. .comments-area {
  1297. margin: 24px auto 0;
  1298. border-top: 3px solid #eee;
  1299. }
  1300. .comments-title,
  1301. #respond h3 {
  1302. font-size: 1.2em;
  1303. line-height: 1.36em;
  1304. color: #999;
  1305. }
  1306. .comments-title small,
  1307. .comment-reply-title small {
  1308. float: right;
  1309. }
  1310. .comment-list,
  1311. .comment-list .children {
  1312. list-style: none;
  1313. }
  1314. .comment-list {
  1315. margin: 0;
  1316. }
  1317. .comment-list > .comment:first-of-type {
  1318. padding-top: 0;
  1319. border-top: 0;
  1320. }
  1321. .comment {
  1322. margin-top: 26px;
  1323. padding-top: 27px;
  1324. border-top: 1px solid #eee;
  1325. }
  1326. .comment-meta {
  1327. text-transform: uppercase;
  1328. }
  1329. .comment-meta a {
  1330. color: #666;
  1331. }
  1332. .comment-meta .comment-author img {
  1333. float: left;
  1334. border-radius: 50%;
  1335. }
  1336. .comment-meta .comment-author .fn {
  1337. display: block;
  1338. font-weight: normal;
  1339. margin-left: 74px;
  1340. text-transform: none;
  1341. }
  1342. .bypostauthor {}
  1343. .comment-meta .comment-metadata {
  1344. font-size: .8125em;
  1345. font-weight: normal;
  1346. line-height: 2.09231em;
  1347. margin-bottom: 27px;
  1348. margin-left: 74px;
  1349. letter-spacing: 1px;
  1350. color: #999;
  1351. }
  1352. .comment-meta .comment-metadata a {
  1353. color: #999;
  1354. }
  1355. .comment-meta .comment-metadata a:hover {
  1356. color: #1c7c7c;
  1357. }
  1358. .comments-area .edit-link:before {
  1359. display: inline;
  1360. margin: 0 7px;
  1361. content: ' ~ ';
  1362. }
  1363. .comment-form label {
  1364. display: inline-block;
  1365. width: 109px;
  1366. }
  1367. .required {
  1368. color: #1c7c7c;
  1369. }
  1370. .comment-form-author,
  1371. .comment-form-email,
  1372. .comment-form-url,
  1373. .comment-form-comment {
  1374. position: relative;
  1375. margin: 0 0 27px;
  1376. }
  1377. .comment-form-author label,
  1378. .comment-form-email label,
  1379. .comment-form-url label,
  1380. .comment-form-comment label {
  1381. font-size: .8125em;
  1382. font-weight: normal;
  1383. line-height: 2.09231em;
  1384. position: absolute;
  1385. top: 7px;
  1386. left: 0;
  1387. padding: 7px 14px;
  1388. letter-spacing: 1px;
  1389. text-transform: uppercase;
  1390. }
  1391. .comment-form-author input,
  1392. .comment-form-email input,
  1393. .comment-form-url input,
  1394. .comment-form-comment input {
  1395. display: block;
  1396. width: 100%;
  1397. margin: 0 0 27px;
  1398. padding-left: 100px;
  1399. }
  1400. .comment-form-author textarea,
  1401. .comment-form-email textarea,
  1402. .comment-form-url textarea,
  1403. .comment-form-comment textarea {
  1404. clear: both;
  1405. width: 100%;
  1406. margin: 0 0 27px;
  1407. padding: 54px 14px 7px;
  1408. }
  1409. .says {
  1410. display: none;
  1411. }
  1412. .form-allowed-tags {
  1413. color: #999;
  1414. }
  1415. .no-comments {
  1416. font-style: italic;
  1417. margin: 27px 0;
  1418. text-align: center;
  1419. color: #999;
  1420. }
  1421. /* =Widgets */
  1422. .widget {
  1423. line-height: 2.09231em;
  1424. position: relative;
  1425. overflow: hidden;
  1426. width: 100%;
  1427. margin: 0 0 27px;
  1428. padding: 0 0 27px;
  1429. border-bottom: 1px solid #eee;
  1430. word-wrap: break-word;
  1431. }
  1432. .widget-area .widget:last-of-type {
  1433. border-bottom: 0;
  1434. margin-bottom: 0;
  1435. }
  1436. .widget select {
  1437. max-width: -webkit-calc(100% - 48px);
  1438. max-width: calc(100% - 48px);
  1439. margin-left: 1px;
  1440. }
  1441. .widget a {
  1442. text-decoration: none;
  1443. color: #1c7c7c;
  1444. }
  1445. .widget a:hover,
  1446. .widget a:active,
  1447. .widget a:focus {
  1448. color: #666;
  1449. }
  1450. .widget:not(.widget_text) ul,
  1451. .widget:not(.widget_text) ol {
  1452. margin: 0;
  1453. list-style: none;
  1454. }
  1455. .widget:not(.widget_text) li {
  1456. margin: 6px 0 0;
  1457. padding-top: 6px;
  1458. list-style: none;
  1459. border-top: 1px solid #eee;
  1460. }
  1461. .widget:not(.widget_text) li li a {
  1462. padding-left: 14px;
  1463. }
  1464. .widget:not(.widget_text) li li li a {
  1465. padding-left: 28px;
  1466. }
  1467. .widget:not(.widget_text) li li li li a {
  1468. padding-left: 32px;
  1469. }
  1470. .widget-title {
  1471. font-size: 18px;
  1472. font-weight: normal;
  1473. line-height: 1.36em;
  1474. margin: 14px 0;
  1475. }
  1476. .widget-title a {
  1477. color: #666;
  1478. }
  1479. /* Calendar widget */
  1480. #wp-calendar td,
  1481. #wp-calendar th,
  1482. #wp-calendar th {
  1483. text-align: center;
  1484. }
  1485. #wp-calendar caption {
  1486. font-weight: 700;
  1487. margin: 14px 0;
  1488. text-align: center;
  1489. }
  1490. #wp-calendar a {
  1491. text-decoration: none;
  1492. color: #1c7c7c;
  1493. }
  1494. /* Recent Comments */
  1495. .widget_recent_comments td,
  1496. .widget_recent_comments th {
  1497. border: 0;
  1498. }
  1499. /* Tags */
  1500. .tags-links {
  1501. display: block;
  1502. margin-top: 7px;
  1503. }
  1504. .tags-links:before,
  1505. .tags-links:after {
  1506. display: table;
  1507. content: '';
  1508. }
  1509. .tags-links:after {
  1510. clear: both;
  1511. }
  1512. .wp_widget_tag_cloud a,
  1513. .tags-links a {
  1514. font-size: .8125em !important;
  1515. display: inline-block;
  1516. margin: 0 7px 7px 0 !important;
  1517. padding: 7px;
  1518. line-height: 1.3;
  1519. letter-spacing: 1px;
  1520. text-transform: uppercase;
  1521. color: #999;
  1522. border: 1px solid #eee;
  1523. }
  1524. .wp_widget_tag_cloud a:hover,
  1525. .tags-links a:hover {
  1526. color: #1c7c7c;
  1527. border-color: #1c7c7c;
  1528. }
  1529. /* =Footer Widgets */
  1530. .footer-widgets {
  1531. border-top: 1px solid #eee;
  1532. padding: 27px 0 0;
  1533. margin: 27px 0 0;
  1534. }
  1535. .footer-widgets .widget-area {
  1536. width: 100%;
  1537. margin: 0 auto;
  1538. }
  1539. /* =Jetpack */
  1540. .jetpack_widget_social_icons ul .jetpack-social-widget-item {
  1541. border-top: none;
  1542. }
  1543. .jetpack-video-wrapper {
  1544. margin-bottom: 27px;
  1545. }
  1546. .jetpack-slideshow.slideshow-black {
  1547. background-color: #eee;
  1548. border-color: #eee;
  1549. }
  1550. /* Globally hidden elements when Infinite Scroll is supported and in use. */
  1551. .infinite-scroll .posts-navigation,
  1552. .infinite-scroll.neverending .site-footer {
  1553. display: none;
  1554. }
  1555. /* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before */
  1556. .infinity-end.neverending .site-footer {
  1557. display: block;
  1558. }
  1559. .infinite-wrap {
  1560. border-top: 1px solid #eee;
  1561. padding-top: 53px;
  1562. }
  1563. #infinite-footer {
  1564. z-index: 999;
  1565. }
  1566. #infinite-footer .container {
  1567. font-style: italic;
  1568. position: relative;
  1569. color: #999;
  1570. border-top: 0;
  1571. background: white;
  1572. }
  1573. #infinite-footer .container a {
  1574. color: #999;
  1575. }
  1576. #infinite-footer .container a:hover {
  1577. color: #1c7c7c;
  1578. }
  1579. #infinite-footer .blog-info a,
  1580. #infinite-footer .blog-credits {
  1581. font-size: .8125em;
  1582. font-weight: normal;
  1583. font-style: normal;
  1584. line-height: 2.09231em;
  1585. letter-spacing: 1px;
  1586. text-transform: uppercase;
  1587. }
  1588. .infinite-loader {
  1589. clear: both;
  1590. width: 28px;
  1591. height: 43px;
  1592. margin: 0 auto 14px;
  1593. padding-top: 27px;
  1594. }
  1595. #infinite-handle {
  1596. clear: both;
  1597. width: 100%;
  1598. margin: 0;
  1599. }
  1600. #infinite-handle span {
  1601. border-radius: 3px;
  1602. display: block;
  1603. font-size: 1em;
  1604. font-weight: normal;
  1605. padding: 10px 14px;
  1606. -webkit-transition: all .3s ease-in-out;
  1607. transition: all .3s ease-in-out;
  1608. letter-spacing: 1px;
  1609. margin-left: auto;
  1610. margin-right: auto;
  1611. text-transform: uppercase;
  1612. color: #999;
  1613. border: 3px solid #eee;
  1614. background: white;
  1615. text-align: center;
  1616. width: 160px;
  1617. }
  1618. #infinite-handle span:hover {
  1619. border-color: #1c7c7c;
  1620. color: #1c7c7c;
  1621. -webkit-transition: all .3s ease-in-out;
  1622. -moz-transition: all .3s ease-in-out;
  1623. -o-transition: all .3s ease-in-out;
  1624. transition: all .3s ease-in-out;
  1625. }
  1626. /* Contact Forms */
  1627. .site-content .contact-form input[type="radio"],
  1628. .site-content .contact-form input[type="checkbox"] {
  1629. margin-bottom: 6px;
  1630. margin-right: .3em;
  1631. vertical-align: middle;
  1632. }
  1633. .site-content .contact-form label.checkbox,
  1634. .site-content .contact-form label.checkbox-multiple,
  1635. .site-content .contact-form label.radio {
  1636. font-weight: normal;
  1637. font-style: normal;
  1638. margin-bottom: 4px;
  1639. float: none;
  1640. }
  1641. .site-content .contact-form label.checkbox,
  1642. .site-content .contact-form > div {
  1643. margin-bottom: 14px;
  1644. }
  1645. .site-content .contact-form textarea,
  1646. .site-content .contact-form input[type='text'],
  1647. .site-content .contact-form input[type='email'],
  1648. .site-content .contact-form input[type='url'],
  1649. .site-content .contact-form select {
  1650. margin-bottom: 7px;
  1651. max-width: 100%;
  1652. }
  1653. .site-content .contact-form .grunion-field-label {
  1654. margin-bottom: 4px;
  1655. width: 100%;
  1656. }
  1657. div.sharedaddy div.sd-block {
  1658. padding: 14px 0 14px !important;
  1659. }
  1660. /* =Social Links */
  1661. .jetpack-social-navigation {
  1662. clear: both;
  1663. margin: 14px auto;
  1664. text-align: center;
  1665. }
  1666. .jetpack-social-navigation ul {
  1667. margin: 0;
  1668. padding: 0;
  1669. list-style: none;
  1670. }
  1671. .jetpack-social-navigation li {
  1672. display: inline-block;
  1673. margin: 0;
  1674. list-style: none;
  1675. }
  1676. .jetpack-social-navigation a {
  1677. display: inline-block;
  1678. text-decoration: none;
  1679. font-size: 24px;
  1680. margin-left: 4px;
  1681. margin-top: 2px;
  1682. margin-bottom: 4px;
  1683. text-align: center;
  1684. color: white;
  1685. border-radius: 50%;
  1686. background: #ccc;
  1687. width: 1.5em !important;
  1688. height: 1.5em !important;
  1689. }
  1690. .jetpack-social-navigation .icon {
  1691. top: 3px;
  1692. position: relative;
  1693. }
  1694. .jetpack-social-navigation ul a:hover {
  1695. -webkit-transition: all .1s ease-in-out;
  1696. transition: all .1s ease-in-out;
  1697. text-decoration: none;
  1698. background: #1c7c7c;
  1699. color: white;
  1700. }
  1701. /* Media Queries */
  1702. @media screen and (min-width: 75em) {
  1703. .site {
  1704. max-width: 1153px;
  1705. margin: 54px auto;
  1706. padding: 54px 108px;
  1707. }
  1708. .no-sidebar.page-template-full-width-page .site {
  1709. max-width: 1153px;
  1710. }
  1711. }
  1712. @media screen and (min-width: 55em) {
  1713. .no-sidebar .site {
  1714. margin-right: auto;
  1715. margin-left: auto;
  1716. max-width: 872px;
  1717. padding: 54px 108px;
  1718. }
  1719. }
  1720. @media screen and (min-width: 50em) {
  1721. h1 {
  1722. font-size: 32px;
  1723. }
  1724. h2 {
  1725. font-size: 28px;
  1726. }
  1727. h3,
  1728. #respond h3,
  1729. .author-title {
  1730. font-size: 24px;
  1731. }
  1732. h4 {
  1733. font-size: 20px;
  1734. }
  1735. .entry-title {
  1736. font-size: 32px;
  1737. }
  1738. .content-area {
  1739. float: left;
  1740. width: 100%;
  1741. margin: 0 -30% 0 0;
  1742. }
  1743. .site-main {
  1744. margin: 0 30% 0 0;
  1745. }
  1746. .site-content .widget-area {
  1747. float: right;
  1748. overflow: hidden;
  1749. width: 25%;
  1750. margin-top: 0;
  1751. padding-top: 0;
  1752. border-top: 0;
  1753. }
  1754. .no-sidebar .content-area,
  1755. .no-sidebar .site-main,
  1756. .page-template-full-width-page .site-main {
  1757. float: none;
  1758. margin: 0;
  1759. }
  1760. .site-info {
  1761. line-height: 1.7;
  1762. float: left;
  1763. max-width: 60%;
  1764. text-align: left;
  1765. }
  1766. .jetpack-social-navigation {
  1767. float: right;
  1768. clear: none;
  1769. max-width: 40%;
  1770. margin: 0;
  1771. text-align: right;
  1772. }
  1773. .entry-content {
  1774. font-size: 1.2em;
  1775. line-height: 1.7em;
  1776. }
  1777. pre {
  1778. font-size: 1em;
  1779. }
  1780. /* Search */
  1781. .widget_search .search-submit {
  1782. display: none;
  1783. }
  1784. blockquote {
  1785. font-size: 1.2em;
  1786. line-height: 1.4em;
  1787. padding-left: 64px;
  1788. }
  1789. blockquote cite {
  1790. font-size: .8125em;
  1791. }
  1792. blockquote:before {
  1793. font-size: 72px;
  1794. }
  1795. blockquote.alignleft,
  1796. blockquote.alignright {
  1797. max-width: 280px;
  1798. padding-left: 48px;
  1799. }
  1800. blockquote.alignleft:before,
  1801. blockquote.alignright:before {
  1802. font-size: 64px;
  1803. top: 14px;
  1804. }
  1805. .menu-toggle {
  1806. display: none;
  1807. }
  1808. .main-navigation {
  1809. font-size: .8125em;
  1810. line-height: 2.09231em;
  1811. text-align: center;
  1812. }
  1813. .main-navigation ul:first-child {
  1814. display: block;
  1815. }
  1816. .main-navigation ul li {
  1817. display: inline-block;
  1818. }
  1819. .main-navigation ul li:hover > ul,
  1820. .main-navigation ul li.focus > ul {
  1821. display: block;
  1822. visibility: visible;
  1823. -webkit-transition: all .3s ease-in-out;
  1824. transition: all .3s ease-in-out;
  1825. opacity: 1;
  1826. }
  1827. .main-navigation ul a {
  1828. padding: 7px 9px;
  1829. border-bottom: 0;
  1830. }
  1831. .main-navigation ul ul {
  1832. position: absolute;
  1833. z-index: 99999;
  1834. top: 2.5em;
  1835. left: -11px;
  1836. display: none;
  1837. visibility: hidden;
  1838. float: left;
  1839. padding: 0 9px;
  1840. -webkit-transition: all .3s ease-in-out;
  1841. transition: all .3s ease-in-out;
  1842. text-align: left;
  1843. opacity: 0;
  1844. border: 1px solid #eee;
  1845. background: white;
  1846. }
  1847. .main-navigation li.menu-item-has-children > a,
  1848. .main-navigation li.page_item_has_children > a {
  1849. position: relative;
  1850. padding-right: 1.6em;
  1851. }
  1852. .main-navigation li.menu-item-has-children > a:after,
  1853. .main-navigation li.page_item_has_children > a:after {
  1854. content: "\203A";
  1855. font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  1856. font-size: 18px;
  1857. font-weight: 900;
  1858. line-height: 1;
  1859. display: inline-block;
  1860. margin-left: 7px;
  1861. position: relative;
  1862. top: 2px;
  1863. -webkit-transform: rotate(90deg);
  1864. transform: rotate(90deg);
  1865. vertical-align: baseline;
  1866. -webkit-font-smoothing: antialiased;
  1867. }
  1868. .main-navigation ul ul li.menu-item-has-children > a:after,
  1869. .main-navigation ul ul li.page_item_has_children > a:after {
  1870. -webkit-transform: rotate(0deg);
  1871. transform: rotate(0deg);
  1872. margin-left: 4px;
  1873. top: 0;
  1874. }
  1875. .main-navigation ul ul li {
  1876. padding: 5px 5px 4px;
  1877. border-bottom: 1px solid #eee;
  1878. }
  1879. .main-navigation ul ul li:last-of-type {
  1880. border-bottom: 0;
  1881. }
  1882. .main-navigation ul ul li a {
  1883. line-height: 1.5;
  1884. width: 180px;
  1885. padding: 5px;
  1886. }
  1887. .main-navigation ul ul ul {
  1888. top: 0;
  1889. left: 100%;
  1890. }
  1891. .main-navigation ul ul li a,
  1892. .main-navigation ul ul ul li a,
  1893. .main-navigation ul ul ul ul li a {
  1894. padding-left: 5px;
  1895. }
  1896. .footer-widgets .widget-area {
  1897. float: left;
  1898. }
  1899. .footer-widgets .widget-area:nth-child(1):nth-last-child(2),
  1900. .footer-widgets .widget-area:nth-child(2):nth-last-child(1) {
  1901. width: 48%;
  1902. margin-right: 4%;
  1903. }
  1904. .footer-widgets .widget-area:nth-child(1):nth-last-child(2):last-of-type,
  1905. .footer-widgets .widget-area:nth-child(2):nth-last-child(1):last-of-type {
  1906. margin-right: 0;
  1907. }
  1908. .footer-widgets .widget-area:nth-child(1):nth-last-child(3),
  1909. .footer-widgets .widget-area:nth-child(2):nth-last-child(2),
  1910. .footer-widgets .widget-area:nth-child(3):nth-last-child(1) {
  1911. width: 30%;
  1912. margin-right: 5%;
  1913. }
  1914. .footer-widgets .widget-area:nth-child(1):nth-last-child(3):last-of-type,
  1915. .footer-widgets .widget-area:nth-child(2):nth-last-child(2):last-of-type,
  1916. .footer-widgets .widget-area:nth-child(3):nth-last-child(1):last-of-type {
  1917. margin-right: 0;
  1918. }
  1919. }