style_002.css 43 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058
  1. /*======================================
  2. Theme Name: Momentous Lite
  3. Theme URI: https://themezee.com/themes/momentous/
  4. Description: Momentous is a modern Magazine theme featuring large post thumbnails, a clean typography and two column post layout. You can highlight your posts in the Featured Content area and display your social icons and search field in the header area with a few clicks. It goes without saying that Momentous is fully responsive and looks good on every device.
  5. Version: 1.4.5
  6. Requires at least: 5.2
  7. Tested up to: 5.8
  8. Requires PHP: 5.6
  9. Author: ThemeZee
  10. Author URI: https://themezee.com
  11. Tags: three-columns, custom-background, custom-colors, custom-header, grid-layout, blog, entertainment, news, custom-menu, editor-style, rtl-language-support, featured-image-header, featured-images, flexible-header, full-width-template, sticky-post, threaded-comments, translation-ready, theme-options, one-column, left-sidebar, right-sidebar, two-columns
  12. Text Domain: momentous-lite
  13. License: GNU General Public License v2.0
  14. License URI: http://www.gnu.org/licenses/gpl-2.0.html
  15. ======================================*/
  16. /* CSS Reset | http://meyerweb.com/eric/tools/css/reset/ | v2.0
  17. -------------------------------------------------------------- */
  18. html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  19. a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp,
  20. small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
  21. fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
  22. article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup,
  23. menu, nav, output, ruby, section, summary, time, mark, audio, video {
  24. margin: 0;
  25. padding: 0;
  26. border: 0;
  27. font-size: 100%;
  28. font: inherit;
  29. vertical-align: baseline;
  30. }
  31. /* HTML5 display-role reset for older browsers */
  32. article, aside, details, figcaption, figure,
  33. footer, header, hgroup, menu, nav, section {
  34. display: block;
  35. }
  36. body {
  37. line-height: 1;
  38. }
  39. ol, ul {
  40. list-style: none;
  41. }
  42. blockquote, q {
  43. quotes: none;
  44. }
  45. blockquote:before, blockquote:after,
  46. q:before, q:after {
  47. content: '';
  48. content: none;
  49. }
  50. table {
  51. border-collapse: collapse;
  52. border-spacing: 0;
  53. }
  54. /* General Styles
  55. -------------------------------------------------------------- */
  56. html {
  57. font-size: 100.01%;
  58. }
  59. body {
  60. font-family: 'Average Sans', Tahoma, Verdana, Arial;
  61. font-size: 1.0em;
  62. border: 0;
  63. color: #111;
  64. background-color: #cccccc;
  65. }
  66. /* Links */
  67. a, a:link, a:visited{
  68. color: #22a8d8;
  69. text-decoration: none;
  70. }
  71. a:hover, a:active {
  72. text-decoration: underline;
  73. }
  74. /* Form Elements */
  75. input, textarea {
  76. padding: 0.7em;
  77. background: #fff;
  78. border: 1px solid #ddd;
  79. font-size: 1.0em;
  80. color: #333;
  81. font-family: 'Average Sans', Tahoma, Verdana, Arial;
  82. }
  83. input[type="submit"] {
  84. border: none;
  85. color: #fff;
  86. background: #22a8d8;
  87. padding: 0.5em 1em;
  88. }
  89. input[type="submit"]:hover {
  90. background-color: #333;
  91. cursor: pointer;
  92. }
  93. /* Clearing Floats */
  94. .clearfix:before, .clearfix:after {
  95. content: " ";
  96. display: table;
  97. }
  98. .clearfix:after {
  99. clear: both;
  100. }
  101. .clearfix {
  102. *zoom: 1; /* For IE 6/7 only */
  103. }
  104. /* Make Form Elements responsive */
  105. input, textarea, select {
  106. max-width: 100%;
  107. }
  108. /* Text meant only for screen readers. */
  109. .screen-reader-text {
  110. clip: rect(1px, 1px, 1px, 1px);
  111. position: absolute !important;
  112. height: 1px;
  113. width: 1px;
  114. overflow: hidden;
  115. }
  116. .screen-reader-text:focus {
  117. background-color: #f1f1f1;
  118. border-radius: 3px;
  119. box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  120. clip: auto !important;
  121. color: #21759b;
  122. display: block;
  123. font-size: 14px;
  124. font-size: 0.875rem;
  125. font-weight: bold;
  126. height: auto;
  127. left: 5px;
  128. line-height: normal;
  129. padding: 15px 23px 14px;
  130. text-decoration: none;
  131. top: 5px;
  132. width: auto;
  133. z-index: 100000; /* Above WP toolbar. */
  134. }
  135. /* Basic Structure
  136. -------------------------------------------------------------- */
  137. #wrapper {
  138. width: 100%;
  139. }
  140. #header-wrap {
  141. background: #282828;
  142. }
  143. #header {
  144. padding: 3em 0.2em;
  145. color: #fff;
  146. }
  147. #wrap {
  148. clear: both;
  149. padding: 1.5em 0 0;
  150. -webkit-box-sizing: border-box;
  151. -moz-box-sizing: border-box;
  152. box-sizing: border-box;
  153. }
  154. #content {
  155. float: left;
  156. width: 70%;
  157. padding-right: 1.5em;
  158. -webkit-box-sizing: border-box;
  159. -moz-box-sizing: border-box;
  160. box-sizing: border-box;
  161. }
  162. #sidebar {
  163. float: right;
  164. width: 30%;
  165. -webkit-box-sizing: border-box;
  166. -moz-box-sizing: border-box;
  167. box-sizing: border-box;
  168. }
  169. .container {
  170. max-width: 1340px;
  171. width: 92%;
  172. margin: 0 auto;
  173. -webkit-box-sizing: border-box;
  174. -moz-box-sizing: border-box;
  175. box-sizing: border-box;
  176. }
  177. /* Header
  178. -------------------------------------------------------------- */
  179. #logo {
  180. float: left;
  181. }
  182. #logo .site-title {
  183. display: inline-block;
  184. font-size: 2.5em;
  185. color: #fff;
  186. font-family: 'Fjalla One', Tahoma, Verdana, Arial;
  187. }
  188. #logo .site-title a:link,
  189. #logo .site-title a:visited {
  190. color: #fff;
  191. }
  192. #logo .site-title a:hover,
  193. #logo .site-title a:active {
  194. text-decoration: underline;
  195. }
  196. #logo .site-description {
  197. margin-top: 0.4em;
  198. color: #ddd;
  199. }
  200. #logo .custom-logo {
  201. margin: 0 1.5em 0 0;
  202. padding: 0;
  203. border: none;
  204. vertical-align: top;
  205. max-width: 100%;
  206. height: auto;
  207. }
  208. /* Custom Header Image */
  209. .header-image {
  210. padding: 2em 0 0;
  211. }
  212. .header-image img {
  213. max-width: 1340px;
  214. vertical-align: top;
  215. width: 100%;
  216. height: auto;
  217. }
  218. /* Header Content
  219. -------------------------------------------------------------- */
  220. #header-content {
  221. float: right;
  222. }
  223. #header-content .header-search-icon {
  224. display: inline-block;
  225. float: right;
  226. margin: 0.4em 0 0 0.8em;
  227. color: #ccc;
  228. color: rgba(255,255,255,0.7);
  229. }
  230. #header-content .header-search-icon:hover {
  231. cursor: pointer;
  232. color: #fff;
  233. }
  234. #header-content .header-search-icon .genericon-search {
  235. display: inline-block;
  236. margin-right: 0.2em;
  237. -webkit-font-smoothing: antialiased;
  238. -moz-osx-font-smoothing: grayscale;
  239. font-size: 32px;
  240. font-family: 'Genericons';
  241. text-decoration: inherit;
  242. font-weight: normal;
  243. font-style: normal;
  244. vertical-align: text-bottom;
  245. color: #ccc;
  246. color: rgba(255,255,255,0.7);
  247. content: '\f410';
  248. }
  249. #header-content .header-search-icon:hover .genericon-search {
  250. color: #fff;
  251. }
  252. /* Top Navigation Menu
  253. -------------------------------------------------------------- */
  254. #topnav {
  255. float: right;
  256. }
  257. #topnav-icon, #topnav-toggle {
  258. display: none;
  259. }
  260. .top-navigation-menu {
  261. float: left;
  262. list-style-type: none;
  263. list-style-position: outside;
  264. position: relative;
  265. }
  266. .top-navigation-menu li{
  267. float: left;
  268. position: relative;
  269. }
  270. .top-navigation-menu a {
  271. display: block;
  272. padding: 0.7em 1em;
  273. text-decoration: none;
  274. font-size: 1.05em;
  275. }
  276. .top-navigation-menu a:link, .top-navigation-menu a:visited{
  277. color: #ccc;
  278. color: rgba(255,255,255,0.7);
  279. text-decoration: none;
  280. }
  281. .top-navigation-menu a:hover {
  282. text-decoration: underline;
  283. }
  284. .top-navigation-menu li.current_page_item a, .top-navigation-menu li.current-menu-item a {
  285. text-decoration: underline;
  286. }
  287. .top-navigation-menu li .sub-menu {
  288. display: none !important;
  289. }
  290. /* Navigation Menu
  291. -------------------------------------------------------------- */
  292. #navigation-wrap {
  293. border-top: 4px solid #ddd;
  294. background: #fff;
  295. }
  296. #navigation-wrap #navi-social-icons {
  297. float: right;
  298. }
  299. .mainnav-toggle, #social-menu-toggle, #mainnav-icon {
  300. display: none;
  301. }
  302. #navigation {
  303. position: relative;
  304. }
  305. .main-navigation-menu {
  306. display: inline;
  307. list-style-type: none;
  308. list-style-position: outside;
  309. }
  310. .main-navigation-menu li {
  311. float: left;
  312. }
  313. .main-navigation-menu a {
  314. display: block;
  315. padding: 1.6em 1.4em;
  316. text-decoration: none;
  317. font-size: 0.9em;
  318. font-weight: bold;
  319. font-family: 'Average Sans', Tahoma, Verdana, Arial;
  320. text-transform: uppercase;
  321. }
  322. .main-navigation-menu a:link, .main-navigation-menu a:visited {
  323. color: #333;
  324. text-decoration: none;
  325. }
  326. .main-navigation-menu a:hover {
  327. color: #22a8d8;
  328. }
  329. .main-navigation-menu ul {
  330. position: absolute;
  331. display: none;
  332. z-index: 99;
  333. color: #fff;
  334. background: #22a8d8;
  335. }
  336. .main-navigation-menu ul li{
  337. float: none;
  338. position: relative;
  339. }
  340. .main-navigation-menu ul a {
  341. min-width: 250px;
  342. min-width: 16rem;
  343. padding: 0.8em 1em;
  344. font-weight: normal;
  345. text-transform: none;
  346. border-bottom: 1px solid rgba(255,255,255,0.1);
  347. -webkit-box-sizing: border-box;
  348. -moz-box-sizing: border-box;
  349. box-sizing: border-box;
  350. }
  351. .main-navigation-menu ul a:link, .main-navigation-menu ul a:visited {
  352. color: #fff;
  353. text-decoration: none;
  354. }
  355. .main-navigation-menu ul a:hover {
  356. text-decoration: underline;
  357. }
  358. .main-navigation-menu li ul ul {
  359. top: 0;
  360. left: 100%;
  361. border-left: 1px solid rgba(255,255,255,0.1);
  362. }
  363. .main-navigation-menu li.menu-item-has-children:hover > ul,
  364. .main-navigation-menu li.page_item_has_children:hover > ul,
  365. .main-navigation-menu li.menu-item-has-children[aria-expanded="true"] > ul {
  366. display: block;
  367. }
  368. .main-navigation-menu li.current_page_item a, .main-navigation-menu li.current-menu-item a {
  369. color: #22a8d8;
  370. text-decoration: underline;
  371. }
  372. .main-navigation-menu li.current_page_item ul li a, .main-navigation-menu li.current-menu-item ul li a{
  373. color: #fff;
  374. text-decoration: none;
  375. }
  376. .main-navigation-menu li.current_page_item ul li a:hover, .main-navigation-menu li.current-menu-item ul li a:hover {
  377. text-decoration: underline;
  378. }
  379. .main-navigation-menu ul li.current_page_item a, .main-navigation-menu ul li.current-menu-item a {
  380. color: #fff;
  381. text-decoration: underline;
  382. }
  383. .main-navigation-menu ul li.current_page_item ul li a, .main-navigation-menu ul li.current-menu-item ul li a{
  384. text-decoration: none;
  385. }
  386. /* Mega Menu Styling */
  387. .mega-menu-content {
  388. line-height: 1.5;
  389. }
  390. .mega-menu-content .mega-menu-widget .mega-menu-widget-header-title {
  391. font-weight: bold;
  392. }
  393. .main-navigation-menu .mega-menu-content .mega-menu-widget ul li a:hover,
  394. .main-navigation-menu .mega-menu-content .mega-menu-widget ul li a:active {
  395. text-decoration: underline;
  396. }
  397. .main-navigation-menu .mega-menu-content .widget_meta ul li,
  398. .main-navigation-menu .mega-menu-content .widget_pages ul li,
  399. .main-navigation-menu .mega-menu-content .widget_categories ul li,
  400. .main-navigation-menu .mega-menu-content .widget_archive ul li {
  401. display: block;
  402. border-top: 1px solid rgba(255,255,255,0.1);
  403. }
  404. .main-navigation-menu .mega-menu-content .widget_meta ul li a,
  405. .main-navigation-menu .mega-menu-content .widget_pages ul li a,
  406. .main-navigation-menu .mega-menu-content .widget_categories ul li a,
  407. .main-navigation-menu .mega-menu-content .widget_archive ul li a {
  408. display: block;
  409. padding: 0.5em 0.75em;
  410. font-size: 14px;
  411. font-size: 0.875rem;
  412. }
  413. /* Widget Styling
  414. -------------------------------------------------------------- */
  415. .widget {
  416. margin-bottom: 1.5em;
  417. padding: 1em;
  418. background: #fff;
  419. }
  420. .widgettitle {
  421. padding: 1.1em;
  422. margin: -1em -1em 0.8em -1em;
  423. color: #333;
  424. border-bottom: 1px solid #ddd;
  425. }
  426. .widgettitle span {
  427. font-size: 0.9em;
  428. font-weight: bold;
  429. font-family: 'Average Sans', Tahoma, Verdana, Arial;
  430. text-transform: uppercase;
  431. }
  432. .widget .textwidget {
  433. line-height: 1.5em;
  434. }
  435. .widget .textwidget p {
  436. margin-bottom: 1em;
  437. }
  438. .widget ul {
  439. line-height: 1.5em;
  440. }
  441. .widget ul {
  442. list-style: circle inside;
  443. color: #555;
  444. }
  445. .widget ul .children {
  446. padding: 0;
  447. margin: 0.5em 0 0.5em 1em;
  448. }
  449. .widget a:link, .widget a:visited {
  450. text-decoration: none;
  451. color: #22a8d8;
  452. }
  453. .widget a:hover, .widget a:active {
  454. text-decoration: underline;
  455. }
  456. .widget img {
  457. max-width: 100%;
  458. height: auto;
  459. }
  460. /* Custom Widgets
  461. -------------------------------------------------------------- */
  462. /* Theme Calendar Widget */
  463. #wp-calendar {
  464. margin: 0;
  465. width: 100%;
  466. color: #444;
  467. line-height: 1.6em;
  468. }
  469. #wp-calendar th,
  470. #wp-calendar td,
  471. #wp-calendar caption {
  472. text-align: left;
  473. }
  474. #wp-calendar caption {
  475. font-style: italic;
  476. margin-bottom: 0.1em;
  477. }
  478. #wp-calendar th {
  479. font-weight: bold;
  480. font-size: 0.85em;
  481. }
  482. #wp-calendar tfoot tr td {
  483. padding-top: 0.5em;
  484. }
  485. #wp-calendar #next {
  486. padding-right: 0.8em;
  487. text-align: right;
  488. }
  489. /* Posts and Pages
  490. -------------------------------------------------------------- */
  491. .post-wrapper {
  492. margin-right: -1.5em;
  493. }
  494. .post-wrapper .post-wrap {
  495. float: left;
  496. margin-left: -0.001%;
  497. padding-right: 1.5em;
  498. width: 50.001%;
  499. -webkit-box-sizing: border-box;
  500. -moz-box-sizing: border-box;
  501. box-sizing: border-box;
  502. }
  503. .post-wrapper .post-wrap:nth-child(2n + 1) {
  504. clear: left;
  505. }
  506. .type-post, .type-page, .type-attachment {
  507. margin: 0 0 1.5em 0;
  508. padding: 1.2em;
  509. background: #fff;
  510. }
  511. .post-wrapper .one-column-post {
  512. margin-right: 1.5em;
  513. }
  514. .page-title, .entry-title {
  515. font-family: 'Fjalla One', Tahoma, Verdana, Arial;
  516. font-size: 2.0em;
  517. color: #282828;
  518. line-height: 1.4em;
  519. -ms-word-wrap: break-word;
  520. word-wrap: break-word;
  521. }
  522. .entry-title a:link, .entry-title a:visited,
  523. .entry-title a:link, .entry-title a:visited {
  524. color: #282828;
  525. text-decoration: none;
  526. }
  527. .entry-title a:hover, .entry-title a:active,
  528. .entry-title a:hover, .entry-title a:active {
  529. text-decoration: underline;
  530. }
  531. .sticky {
  532. border-left: 5px solid #22a8d8;
  533. }
  534. /* Page Links | wp_link_pages() */
  535. .page-links {
  536. margin: 0;
  537. word-spacing: 1em;
  538. }
  539. /* Postmeta */
  540. .entry-meta {
  541. color: #aaa;
  542. font-size: 0.95em;
  543. margin: 0.2em 0 0;
  544. line-height: 1.5em;
  545. }
  546. /* Postinfo */
  547. .postinfo {
  548. clear: both;
  549. margin: 1.2em -1.2em -1.2em;
  550. padding: 0.8em 1em;
  551. line-height: 1.4em;
  552. border-top: 1px solid #ddd;
  553. }
  554. .postinfo .meta-tags {
  555. margin-left: 1em;
  556. }
  557. .postinfo span:before, .postinfo .meta-comments a:before {
  558. display: inline-block;
  559. -webkit-font-smoothing: antialiased;
  560. font: normal 22px 'Genericons';
  561. vertical-align: middle;
  562. color: #333;
  563. }
  564. .postinfo .meta-category:before {
  565. content: '\f301';
  566. }
  567. .postinfo .meta-tags:before {
  568. content: '\f302';
  569. }
  570. .postinfo span a {
  571. font-size: 0.9em;
  572. font-weight: bold;
  573. }
  574. .postinfo span a:link, .postinfo span a:visited {
  575. color: #333;
  576. text-decoration: none;
  577. }
  578. .postinfo span a:hover, .postinfo span a:active {
  579. color: #22a8d8;
  580. }
  581. .postinfo .meta-comments {
  582. float: right;
  583. font-weight: bold;
  584. display: inline-block;
  585. padding-left: 1em;
  586. }
  587. .postinfo .meta-comments a:before {
  588. content: '\f108';
  589. margin-right: 0.15em;
  590. }
  591. .postinfo .meta-comments a:link, .postinfo .meta-comments a:visited {
  592. color: #333;
  593. text-decoration: none;
  594. }
  595. .postinfo .meta-comments a:hover, .postinfo .meta-comments a:active,
  596. .postinfo .meta-comments a:hover:before {
  597. color: #22a8d8;
  598. }
  599. /* Read more Link */
  600. .more-link {
  601. display: inline-block;
  602. margin: 0.1em 0 0;
  603. padding: 0.5em 1em;
  604. text-decoration: none;
  605. color: #fff;
  606. background: #22a8d8;
  607. }
  608. .more-link:link, .more-link:visited {
  609. color: #fff;
  610. text-decoration: none;
  611. }
  612. .more-link:hover, .more-link:active {
  613. background: #333;
  614. text-decoration: none;
  615. }
  616. /* Post Navigation */
  617. .post-navigation {
  618. margin-bottom: 1.5em;
  619. padding: 1em;
  620. background: #fff;
  621. }
  622. .post-navigation .nav-links:before,
  623. .post-navigation .nav-links:after {
  624. content: "";
  625. display: table;
  626. }
  627. .post-navigation .nav-links:after {
  628. clear: both;
  629. }
  630. .post-navigation .nav-links .nav-previous {
  631. float: left;
  632. }
  633. .post-navigation .nav-links .nav-next {
  634. float: right;
  635. }
  636. /* Archives and Search Heading */
  637. .archive-title {
  638. font-size: 0.9em;
  639. font-weight: bold;
  640. text-transform: uppercase;
  641. padding: 1.3em 1em;
  642. background: #fff;
  643. margin-bottom: 1em;
  644. }
  645. .archive-description {
  646. margin: -0.9em 0 0.9em;
  647. padding: 0.8em 1em;
  648. line-height: 1.6;
  649. background: #fff;
  650. border-top: 1px solid #ddd;
  651. }
  652. /* Content Pagination */
  653. .post-pagination {
  654. margin-bottom: 1.5em;
  655. font-weight: bold;
  656. padding: 1em;
  657. background: #fff;
  658. }
  659. .post-pagination a {
  660. margin-right: 0.8em;
  661. display: inline-block;
  662. text-align: center;
  663. text-decoration: none;
  664. color: #333;
  665. }
  666. .post-pagination a:link, .post-pagination a:visited {
  667. color: #333;
  668. }
  669. .post-pagination a:hover {
  670. color: #22a8d8;
  671. }
  672. .post-pagination .current {
  673. margin-right: 0.8em;
  674. color: #22a8d8;
  675. text-decoration :underline;
  676. }
  677. /* Infinite Scroll Pagination */
  678. .infinite-scroll .post-pagination {
  679. display: none;
  680. }
  681. .infinite-scroll #infinite-handle span {
  682. clear: left;
  683. display: block;
  684. margin-bottom: 1.5em;
  685. padding: 0.5em 1em;
  686. font-size: 1em;
  687. font-weight: bold;
  688. line-height: 1.5;
  689. text-align: center;
  690. text-decoration: none;
  691. color: #222;
  692. background-color: #fff;
  693. }
  694. .infinite-scroll #infinite-handle span:hover {
  695. color: #22a8d8;
  696. }
  697. /* Breadcrumbs */
  698. .breadcrumbs {
  699. font-size: 0.9em;
  700. font-weight: bold;
  701. text-transform: uppercase;
  702. padding: 1.3em 1em;
  703. background: #fff;
  704. margin-bottom: 1em;
  705. }
  706. .breadcrumbs .trail-browse,
  707. .breadcrumbs .trail-items,
  708. .breadcrumbs .trail-items li {
  709. display: inline;
  710. }
  711. .breadcrumbs .trail-browse {
  712. margin-right: 0.5em;
  713. }
  714. .breadcrumbs .trail-items {
  715. list-style: none;
  716. }
  717. .breadcrumbs .trail-items li::after {
  718. content: "\00bb"; /* Raquo */
  719. padding: 0 0.5em;
  720. }
  721. .trail-separator-slash .trail-items li::after { content: "\002F"; }
  722. .trail-separator-dash .trail-items li::after { content: "\2013"; }
  723. .trail-separator-bull .trail-items li::after { content: "\2022"; }
  724. .trail-separator-arrow-bracket .trail-items li::after { content: "\003e"; }
  725. .trail-separator-raquo .trail-items li::after { content: "\00bb"; }
  726. .trail-separator-single-arrow .trail-items li::after { content: "\2192"; }
  727. .trail-separator-double-arrow .trail-items li::after { content: "\21D2"; }
  728. .breadcrumbs .trail-items li:last-of-type::after {
  729. display: none;
  730. }
  731. /* Text Elements
  732. -------------------------------------------------------------- */
  733. .entry {
  734. line-height: 1.6em;
  735. margin: 0.2em 0 0;
  736. -ms-word-wrap: break-word;
  737. word-wrap: break-word;
  738. }
  739. .entry p, .comment p {
  740. margin: 0.75em 0;
  741. }
  742. .entry h1, .comment h1,
  743. .entry h2, .comment h2,
  744. .entry h3, .comment h3,
  745. .entry h4, .comment h4,
  746. .entry h5, .comment h5,
  747. .entry h6, .comment h6 {
  748. color: #222;
  749. font-weight: bold;
  750. line-height: 1.0em;
  751. margin: 1.2em 0 0.3em;
  752. }
  753. .entry h1, .comment h1 {
  754. font-size: 3.0em;
  755. }
  756. .entry h2, .comment h2 {
  757. font-size: 2.25em;
  758. }
  759. .entry h3, .comment h3 {
  760. font-size: 1.5em;
  761. }
  762. .entry h4, .comment h4 {
  763. font-size: 1.25em;
  764. }
  765. .entry h5, .comment h5 {
  766. font-size: 1.125em;
  767. margin: 1.3em 0 0;
  768. }
  769. .entry h6, .comment h6 {
  770. font-size: 1.0em;
  771. margin: 1.3em 0 0;
  772. }
  773. .entry ul, .comment ul{
  774. list-style: square inside;
  775. margin: 0 0 1.5em 2em;
  776. }
  777. .entry ol, .comment ol{
  778. list-style: decimal inside;
  779. margin: 0 0 1.5em 2em;
  780. }
  781. .entry ol ol, .comment ol ol{
  782. list-style: upper-alpha inside;
  783. }
  784. .entry ol ol ol, .comment ol ol ol{
  785. list-style: lower-roman inside;
  786. }
  787. .entry ol ol ol ol, .comment ol ol ol ol{
  788. list-style: lower-alpha inside;
  789. }
  790. .entry ul ul, .comment ul ul,
  791. .entry ol ol, .comment ol ol,
  792. .entry ul ol, .comment ul ol
  793. .entry ol ul, .comment ol ul {
  794. margin-bottom: 0.2em;
  795. }
  796. dl {
  797. margin: 1em 0;
  798. }
  799. dt {
  800. font-weight: bold;
  801. }
  802. dd {
  803. margin-bottom: 1.5em;
  804. }
  805. strong {
  806. font-weight: bold;
  807. }
  808. cite,
  809. em,
  810. i {
  811. font-style: italic;
  812. }
  813. big, .big_tag {
  814. font-size: 1.3em;
  815. }
  816. ins {
  817. text-decoration: none;
  818. }
  819. hr {
  820. margin-bottom: 1.5em;
  821. height: 1px;
  822. border: 0;
  823. background-color: #ccc;
  824. }
  825. code, pre {
  826. overflow: auto;
  827. margin-bottom: 1.5em;
  828. padding: 1.5em;
  829. max-width: 100%;
  830. border: 1px solid #e5e5e5;
  831. background: #f5f5f5;
  832. font-size: 15px;
  833. font-size: 0.9375rem;
  834. font-family: "Courier 10 Pitch", Courier, monospace;
  835. line-height: 1.6;
  836. }
  837. del, strike, s{
  838. text-decoration: line-through;
  839. }
  840. small {
  841. font-size: 0.7em;
  842. }
  843. abbr,
  844. acronym {
  845. border-bottom: 1px dotted #666;
  846. cursor: help;
  847. }
  848. sup,
  849. sub {
  850. height: 0;
  851. line-height: 1;
  852. position: relative;
  853. vertical-align: baseline;
  854. font-size: 0.8em;
  855. }
  856. sup {
  857. bottom: 1ex;
  858. }
  859. sub {
  860. top: .5ex;
  861. }
  862. .entry var, .entry kbd, .entry tt, .entry .tt_tag {
  863. font-size: 1.1em;
  864. font-family: "Courier 10 Pitch", Courier, monospace;
  865. }
  866. blockquote {
  867. margin: 0 0 1.5em;
  868. padding-left: 1.25em;
  869. border-left: 4px solid #303030;
  870. color: #777;
  871. font-style: italic;
  872. font-size: 18px;
  873. font-size: 1.125rem;
  874. }
  875. blockquote cite,
  876. blockquote small {
  877. display: block;
  878. margin-top: 1em;
  879. color: #303030;
  880. font-size: 16px;
  881. font-size: 1rem;
  882. line-height: 1.75;
  883. }
  884. blockquote cite:before,
  885. blockquote small:before {
  886. content: "\2014\00a0";
  887. }
  888. blockquote em,
  889. blockquote i,
  890. blockquote cite {
  891. font-style: normal;
  892. }
  893. blockquote > :last-child {
  894. margin-bottom: 0.5em;
  895. }
  896. .entry table {
  897. border-collapse: collapse;
  898. border-spacing: 0;
  899. border: 1px solid #ddd;
  900. margin: 1em 0;
  901. text-align: left;
  902. width: 100%;
  903. }
  904. .entry tr th,
  905. .entry thead th {
  906. background: #e5e5e5;
  907. font-weight: bold;
  908. padding: 0.2em 1em;
  909. }
  910. .entry tr td {
  911. border-top: 1px solid #ddd;
  912. padding: 0.2em 1em;
  913. }
  914. .entry tr.alternate td {
  915. background: #f5f5f5;
  916. }
  917. /* Images | Gallery | Videos
  918. -------------------------------------------------------------- */
  919. article .wp-post-image {
  920. max-width: 100%;
  921. margin: 0 0 1.2em 0;
  922. height: auto;
  923. vertical-align: top;
  924. }
  925. .entry img {
  926. max-width: 100%;
  927. height: auto;
  928. }
  929. .wp-caption {
  930. max-width: 100%;
  931. height: auto;
  932. text-align: center;
  933. margin: 1em 0;
  934. }
  935. .wp-caption-text {
  936. margin: 0 10px !important;
  937. padding: 0;
  938. font-size: 0.9em;
  939. text-align: center;
  940. }
  941. .alignleft {
  942. float: left;
  943. display: inline;
  944. margin: 1em 2em 1em 0;
  945. }
  946. .alignright {
  947. float: right;
  948. display: inline;
  949. margin: 1em 0 1em 2em;
  950. }
  951. .aligncenter {
  952. margin: 1em auto;
  953. display: block;
  954. }
  955. /* Gallery Styling */
  956. .gallery {
  957. margin: 1em auto !important;
  958. }
  959. .gallery-item {
  960. float: left;
  961. margin: 0.7em 0 0 0 !important;
  962. padding-right: 1em;
  963. -webkit-box-sizing: border-box;
  964. -moz-box-sizing: border-box;
  965. box-sizing: border-box;
  966. }
  967. .gallery img {
  968. margin: 0 !important;
  969. padding: 3px;
  970. border: 1px solid #e5e5e5 !important;
  971. -webkit-box-sizing: border-box;
  972. -moz-box-sizing: border-box;
  973. box-sizing: border-box;
  974. }
  975. .gallery-caption {
  976. margin-left: 0.3em !important;
  977. }
  978. /* Make Vidoes responsive */
  979. embed, iframe, object, video {
  980. max-width: 100%;
  981. }
  982. /* Image.php Navigation */
  983. #image-nav {
  984. margin: 1em 0 2em;
  985. color: #333;
  986. }
  987. #image-nav .nav-previous {
  988. float: left;
  989. }
  990. #image-nav .nav-next {
  991. float: right;
  992. }
  993. #image-nav .nav-previous a, #image-nav .nav-next a {
  994. font-size: 0.9em;
  995. font-weight: bold;
  996. text-decoration: none;
  997. padding: 0.6em 1em;
  998. text-decoration: none;
  999. color: #222;
  1000. background: #eee;
  1001. }
  1002. #image-nav .nav-previous a:hover, #image-nav .nav-next a:hover {
  1003. background: #ddd;
  1004. }
  1005. /* Search Form
  1006. -------------------------------------------------------------- */
  1007. .search-form {
  1008. display: block;
  1009. position: relative;
  1010. width: 100%;
  1011. margin: 0;
  1012. padding: 0;
  1013. overflow: hidden;
  1014. }
  1015. .search-form .screen-reader-text {
  1016. display: none;
  1017. }
  1018. .search-form .search-field {
  1019. display: inline-block;
  1020. margin: 0;
  1021. width: 100%;
  1022. padding: 0.7em 45px 0.7em 0.7em;
  1023. background: #fff;
  1024. border: 1px solid #ddd;
  1025. font-size: 1.0em;
  1026. color: #333;
  1027. -webkit-box-sizing: border-box;
  1028. -moz-box-sizing: border-box;
  1029. box-sizing: border-box;
  1030. -webkit-appearance: none;
  1031. }
  1032. .search-form .search-submit {
  1033. position: absolute;
  1034. top: 0;
  1035. right: 0;
  1036. border: none;
  1037. background: transparent;
  1038. padding: 0.8em 0.7em 0 0;
  1039. cursor: pointer;
  1040. }
  1041. .search-form .search-submit .genericon-search {
  1042. display: inline-block;
  1043. width: 24px;
  1044. height: 24px;
  1045. -webkit-font-smoothing: antialiased;
  1046. -moz-osx-font-smoothing: grayscale;
  1047. font-size: 24px;
  1048. font-family: 'Genericons';
  1049. text-decoration: inherit;
  1050. font-weight: normal;
  1051. font-style: normal;
  1052. vertical-align: text-bottom;
  1053. color: #777;
  1054. content: '\f410';
  1055. }
  1056. .search-form .search-submit:hover .genericon-search {
  1057. color: #333;
  1058. }
  1059. /* different style for searchform in header */
  1060. #header-search-wrap {
  1061. display: none;
  1062. border-bottom: 1px solid rgba(255, 255, 255, 0.15);
  1063. background: rgba(0, 0, 0, 0.1);
  1064. }
  1065. #header-search .search-form .search-field {
  1066. padding: 0.8em 45px 0.8em 1em;
  1067. background: none;
  1068. border: none;
  1069. font-size: 1.1em;
  1070. color: #ddd;
  1071. }
  1072. #header-search .search-form .search-submit {
  1073. padding: 0.6em 0.4em 0 0;
  1074. }
  1075. #header-search .search-form .search-submit .genericon-search {
  1076. width: 32px;
  1077. height: 32px;
  1078. font-size: 32px;
  1079. color: #888;
  1080. }
  1081. #header-search .search-form .search-submit:hover .genericon-search {
  1082. color: #ccc;
  1083. }
  1084. /* Social Icons | based upon http://kovshenin.com/2014/social-menus-in-wordpress-themes/
  1085. -------------------------------------------------------------- */
  1086. #social-icons-menu {
  1087. list-style-type: none;
  1088. list-style-position: outside;
  1089. line-height: 1em;
  1090. }
  1091. #social-icons-menu li {
  1092. float: left;
  1093. padding: 0;
  1094. margin: 0;
  1095. }
  1096. #social-icons-menu li a {
  1097. position: relative;
  1098. display: block;
  1099. padding: 1.21em 0.7em;
  1100. text-decoration: none;
  1101. color: #22a8d8;
  1102. }
  1103. #social-icons-menu li a:before {
  1104. display: inline-block;
  1105. -webkit-font-smoothing: antialiased;
  1106. -moz-osx-font-smoothing: grayscale;
  1107. font-size: 22px;
  1108. line-height: 1;
  1109. font-family: 'Genericons';
  1110. text-decoration: inherit;
  1111. vertical-align: bottom;
  1112. color: #22a8d8;
  1113. }
  1114. #social-icons-menu li a .screen-reader-text,
  1115. .social-icons-menu li a .icon {
  1116. display: none;
  1117. }
  1118. .social-icons-wrap .social-icons-hint {
  1119. font-size: 0.75em;
  1120. color: #888;
  1121. max-width: 300px;
  1122. line-height: 1.2em;
  1123. }
  1124. /* Add Genericons */
  1125. #social-icons-menu li a:before { content: '\f408'; } /* Default Icon */
  1126. #social-icons-menu li a[href*="codepen.io"]:before { content: '\f216'; }
  1127. #social-icons-menu li a[href*="digg.com"]:before { content: '\f221'; }
  1128. #social-icons-menu li a[href*="dribbble.com"]:before { content: '\f201'; }
  1129. #social-icons-menu li a[href*="facebook.com"]:before { content: '\f203'; }
  1130. #social-icons-menu li a[href*="flickr.com"]:before { content: '\f211'; }
  1131. #social-icons-menu li a[href*="plus.google.com"]:before { content: '\f206'; }
  1132. #social-icons-menu li a[href*="github.com"]:before { content: '\f200'; }
  1133. #social-icons-menu li a[href*="instagram.com"]:before { content: '\f215'; }
  1134. #social-icons-menu li a[href*="linkedin.com"]:before { content: '\f207'; }
  1135. #social-icons-menu li a[href*="pinterest.com"]:before { content: '\f209'; }
  1136. #social-icons-menu li a[href*="polldaddy.com"]:before { content: '\f217'; }
  1137. #social-icons-menu li a[href*="getpocket.com"]:before { content: '\f224'; }
  1138. #social-icons-menu li a[href*="reddit.com"]:before { content: '\f222'; }
  1139. #social-icons-menu li a[href*="spotify.com"]:before { content: '\f515'; }
  1140. #social-icons-menu li a[href*="skype.com"]:before,
  1141. #social-icons-menu li a[href*="skype:"]:before { content: '\f220'; }
  1142. #social-icons-menu li a[href*="stumbleupon.com"]:before { content: '\f223'; }
  1143. #social-icons-menu li a[href*="tumblr.com"]:before { content: '\f214'; }
  1144. #social-icons-menu li a[href*="twitter.com"]:before { content: '\f202'; }
  1145. #social-icons-menu li a[href*="twitch.tv"]:before { content: '\f516'; }
  1146. #social-icons-menu li a[href*="vimeo.com"]:before { content: '\f212'; }
  1147. #social-icons-menu li a[href*="wordpress.org"]:before,
  1148. #social-icons-menu li a[href*="wordpress.com"]:before { content: '\f205'; }
  1149. #social-icons-menu li a[href*="youtube.com"]:before { content: '\f213'; }
  1150. #social-icons-menu li a[href*="newsletter"]:before,
  1151. #social-icons-menu li a[href*="mailto"]:before { content: '\f410'; }
  1152. #social-icons-menu li a[href*="/feed"]:before,
  1153. #social-icons-menu li a[href*="/feed/"]:before,
  1154. #social-icons-menu li a[href*="?feed=rss2"]:before,
  1155. #social-icons-menu li a[href*="feedburner.google.com"]:before,
  1156. #social-icons-menu li a[href*="feedburner.com"]:before { content: '\f413'; }
  1157. #social-icons-menu li a:hover:before { color: #333; } /* Hover */
  1158. /* Gutenberg Blocks
  1159. --------------------------------------------------------------*/
  1160. /* Audio */
  1161. .wp-block-audio audio {
  1162. width: 100%;
  1163. }
  1164. /* Gallery */
  1165. .wp-block-gallery,
  1166. .entry .wp-block-gallery {
  1167. margin: 0 0 1.5em;
  1168. }
  1169. /* Separator */
  1170. .wp-block-separator {
  1171. height: 2px;
  1172. }
  1173. .wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
  1174. max-width: 100px;
  1175. }
  1176. /* Quote */
  1177. .wp-block-quote.is-style-large {
  1178. border: none;
  1179. margin: 0 0 1.5em;
  1180. padding: 0;
  1181. font-size: 28px;
  1182. font-size: 1.75rem;
  1183. }
  1184. .wp-block-quote.is-style-large p {
  1185. margin-bottom: 0.5em;
  1186. font-size: inherit;
  1187. font-style: inherit;
  1188. line-height: inherit;
  1189. }
  1190. .wp-block-quote.is-style-large cite {
  1191. text-align: inherit;
  1192. }
  1193. /* Pullquote */
  1194. .wp-block-pullquote {
  1195. margin-bottom: 1.5em;
  1196. padding: 1.5em 0;
  1197. border-bottom: 4px solid #ccc;
  1198. border-top: 4px solid #ccc;
  1199. }
  1200. .wp-block-pullquote blockquote {
  1201. border: none;
  1202. margin: 0;
  1203. padding: 0;
  1204. font-size: 28px;
  1205. font-size: 1.75rem;
  1206. }
  1207. .wp-block-pullquote blockquote p {
  1208. margin-bottom: 0.5em;
  1209. }
  1210. /* Cover */
  1211. .wp-block-cover {
  1212. display: flex;
  1213. }
  1214. .wp-block-cover-text {
  1215. margin-top: 0;
  1216. margin-bottom: 0;
  1217. }
  1218. /* Block Text Colors */
  1219. .has-primary-color {
  1220. color: #22a8d8;
  1221. }
  1222. .has-white-color {
  1223. color: #ffffff;
  1224. }
  1225. .has-light-gray-color {
  1226. color: #f0f0f0;
  1227. }
  1228. .has-dark-gray-color {
  1229. color: #777777;
  1230. }
  1231. .has-black-color {
  1232. color: #303030;
  1233. }
  1234. /* Block Background Colors */
  1235. .has-primary-background-color {
  1236. background-color: #22a8d8;
  1237. }
  1238. .has-white-background-color {
  1239. background-color: #ffffff;
  1240. }
  1241. .has-light-gray-background-color {
  1242. background-color: #f0f0f0;
  1243. }
  1244. .has-dark-gray-background-color {
  1245. background-color: #777777;
  1246. }
  1247. .has-black-background-color {
  1248. background-color: #303030;
  1249. }
  1250. /* Comments
  1251. -------------------------------------------------------------- */
  1252. #comments {
  1253. margin-bottom: 1.5em;
  1254. }
  1255. #comments .comments-title, #respond #reply-title {
  1256. padding: 1.3em 1em;
  1257. font-size: 0.9em;
  1258. font-weight: bold;
  1259. text-transform: uppercase;
  1260. background: #fff;
  1261. }
  1262. /* Comment List */
  1263. .commentlist {
  1264. display: block;
  1265. margin-top: 1em;
  1266. }
  1267. .commentlist .comment {
  1268. display: block;
  1269. margin-bottom: 1.5em;
  1270. background: #fff;
  1271. list-style: none;
  1272. line-height: 1.5em;
  1273. -ms-word-wrap: break-word;
  1274. word-wrap: break-word;
  1275. }
  1276. .commentlist .comment-meta {
  1277. border-bottom: 1px solid #ddd;
  1278. padding: 1.2em;
  1279. }
  1280. .commentlist .comment-content {
  1281. padding: 0.4em 1.2em 1.2em;
  1282. }
  1283. /* Threaded Comments */
  1284. .commentlist .children {
  1285. padding: 1.2em;
  1286. margin: 0;
  1287. }
  1288. .commentlist .children .comment {
  1289. background: #fbfbfb;
  1290. border: 1px solid #eee;
  1291. margin: 0;
  1292. }
  1293. .commentlist .children .comment .comment-meta {
  1294. border-bottom: 1px solid #eee;
  1295. }
  1296. .commentlist .children .children .comment {
  1297. background: #f8f8f8;
  1298. }
  1299. /* Comment Meta */
  1300. .comment-meta .comment-author img {
  1301. float: left;
  1302. margin-right: 1em;
  1303. margin-top: -0.1em;
  1304. }
  1305. .comment-meta .comment-author img:after {
  1306. clear: both;
  1307. }
  1308. .comment-meta .comment-author .fn {
  1309. font-size: 1.1em;
  1310. padding: 0.2em 0;
  1311. }
  1312. .comment-meta .comment-author .fn a:link, .comment-meta .comment-author .fn a:visited {
  1313. text-decoration: underline;
  1314. }
  1315. .comment-meta .comment-author .fn a:hover, .comment-meta .comment-author .fn a:active {
  1316. text-decoration: none;
  1317. }
  1318. .comment-meta .bypostauthor .fn, .comment-meta .comment-author-admin .fn{
  1319. font-style: italic;
  1320. background: #eee;
  1321. padding: 0.2em 0.6em;
  1322. }
  1323. .comment-meta .commentmetadata {
  1324. font-size: 0.9em;
  1325. }
  1326. .comment-meta .commentmetadata a:link, .comment-meta .commentmetadata a:visited,
  1327. .comment-meta .commentmetadata a:active, .comment-meta .commentmetadata a:hover {
  1328. color: #666 !important;
  1329. }
  1330. .commentlist .comment .comment-reply-title {
  1331. font-size: 1.0em;
  1332. }
  1333. .nocomments {
  1334. font-size: 0.9em;
  1335. border: 1px solid #e5e5e5;
  1336. background: #fff;
  1337. padding: 0.2em 1em;
  1338. }
  1339. .commentlist .pingback {
  1340. display: block;
  1341. margin: 0.6em 0 0;
  1342. padding: 0.8em 0 0;
  1343. list-style: none;
  1344. line-height: 1.3em;
  1345. }
  1346. /* Comment Pagination */
  1347. .comment-pagination {
  1348. font-size: 0.9em;
  1349. background: #fff;
  1350. padding: 0.2em 1em;
  1351. }
  1352. .comment-pagination .alignleft {
  1353. float: left;
  1354. }
  1355. .comment-pagination .alignright {
  1356. float: right;
  1357. }
  1358. /* Comment Form */
  1359. #respond {
  1360. margin: 1.5em 0 0;
  1361. background: #fff;
  1362. }
  1363. #commentform {
  1364. margin: 0;
  1365. padding: 1.2em 1.2em 0.1em;
  1366. border-top: 1px solid #ddd;
  1367. }
  1368. #commentform p {
  1369. margin: 0 0 1.5em;
  1370. }
  1371. #commentform input[type="text"], #commentform textarea {
  1372. display: inline-block;
  1373. width: 100%;
  1374. -webkit-box-sizing: border-box;
  1375. -moz-box-sizing: border-box;
  1376. box-sizing: border-box;
  1377. }
  1378. #commentform label {
  1379. display: block;
  1380. margin: 0.6em 0 0.2em;
  1381. }
  1382. #commentform #submit {
  1383. display: block;
  1384. margin-top: 1em;
  1385. padding: 0.8em 4em;
  1386. text-decoration: none;
  1387. padding: 0.5em 1em;
  1388. color: #fff;
  1389. background: #22a8d8;
  1390. }
  1391. #commentform #submit:hover {
  1392. background: #333;
  1393. cursor: pointer;
  1394. text-decoration: none;
  1395. }
  1396. /* Featured Content
  1397. -------------------------------------------------------------- */
  1398. #featured-content .featured-content-left {
  1399. float: left;
  1400. padding-right: 0.75em;
  1401. width: 59.2%;
  1402. -webkit-box-sizing: border-box;
  1403. -moz-box-sizing: border-box;
  1404. box-sizing: border-box;
  1405. }
  1406. #featured-content .featured-content-right {
  1407. float: right;
  1408. padding-left: 0.75em;
  1409. width: 40.8%;
  1410. -webkit-box-sizing: border-box;
  1411. -moz-box-sizing: border-box;
  1412. box-sizing: border-box;
  1413. }
  1414. #featured-content .featured-content-left .entry-title {
  1415. font-size: 2.0em;
  1416. }
  1417. #featured-content .featured-content-right .entry-title {
  1418. font-size: 1.3em;
  1419. }
  1420. #featured-content .featured-content-right .wp-post-image {
  1421. margin: 0 0 1.05em 0;
  1422. }
  1423. /* Footer
  1424. -------------------------------------------------------------- */
  1425. #footer-bg {
  1426. background: #282828;
  1427. }
  1428. #footer-wrap {
  1429. border-top: 1px solid rgba(255,255,255,0.1);
  1430. }
  1431. #footer {
  1432. padding: 1.2em 0;
  1433. color: #fff;
  1434. }
  1435. #footer a {
  1436. color: #ccc;
  1437. color: rgba(255,255,255,0.7);
  1438. }
  1439. #footer #credit-link {
  1440. float: right;
  1441. }
  1442. /*============================ MEDIA QUERIES ============================*/
  1443. /* Small screens | <1120px */
  1444. @media only screen and (max-width: 70em) {
  1445. .container {
  1446. width: 94%;
  1447. }
  1448. .post-wrapper .post-wrap {
  1449. float: none;
  1450. width: 100%;
  1451. }
  1452. #featured-content .featured-content-left .entry-title, .single .entry-title, .page-title {
  1453. font-size: 1.9em;
  1454. }
  1455. }
  1456. /* Smaller screens | <1120px */
  1457. @media only screen and (max-width: 65em) {
  1458. .container {
  1459. width: 96%;
  1460. }
  1461. }
  1462. /* Tablets (landscape) | <960px */
  1463. @media only screen and (max-width: 60em) {
  1464. .container {
  1465. width: 100%;
  1466. }
  1467. #wrap {
  1468. padding: 1.5em 1.5em 0;
  1469. }
  1470. #header {
  1471. padding: 2.5em 1.5em;
  1472. }
  1473. #logo .site-title {
  1474. font-size: 2.3em;
  1475. }
  1476. #content {
  1477. float: none;
  1478. padding-right: 0;
  1479. width: 100%;
  1480. }
  1481. #sidebar {
  1482. clear: both;
  1483. float: none;
  1484. margin: 2em 0 0;
  1485. width: 100%;
  1486. }
  1487. .post-wrapper .post-wrap {
  1488. float: left;
  1489. width: 50%;
  1490. }
  1491. #featured-content .featured-content-left .entry-title, .single .entry-title, .page-title {
  1492. font-size: 1.8em;
  1493. }
  1494. #footer {
  1495. padding: 1.2em;
  1496. }
  1497. /* Featured Content */
  1498. #featured-content {
  1499. margin-right: -1.5em;
  1500. }
  1501. #featured-content .featured-content-left {
  1502. float: none;
  1503. width: 100%;
  1504. padding-right: 1.5em;
  1505. }
  1506. #featured-content .featured-content-right {
  1507. float: none;
  1508. padding-left: 0;
  1509. width: 100%;
  1510. }
  1511. #featured-content .featured-content-right .featured-post-wrap {
  1512. float: left;
  1513. padding-right: 1.5em;
  1514. width: 50%;
  1515. -webkit-box-sizing: border-box;
  1516. -moz-box-sizing: border-box;
  1517. box-sizing: border-box;
  1518. }
  1519. /* Mobile Top Navigation */
  1520. /* Reset */
  1521. #topnav-wrap, #topnav, .top-navigation-menu, .top-navigation-menu li, .top-navigation-menu a, .top-navigation-menu ul {
  1522. margin: 0;
  1523. padding: 0;
  1524. position: static;
  1525. float: none;
  1526. display: inline;
  1527. font-size: 1.0em;
  1528. border: none;
  1529. box-shadow: none;
  1530. background: none;
  1531. top: 0;
  1532. left: 0;
  1533. }
  1534. #header-content {
  1535. float: none;
  1536. }
  1537. #header-content .header-search-icon {
  1538. margin: 0.15em 0 0 0.8em;
  1539. }
  1540. #topnav-toggle {
  1541. float: right;
  1542. display: inline-block;
  1543. margin: 0.35em 0.4em 0 0;
  1544. padding: 0;
  1545. text-decoration: none;
  1546. color: #ccc;
  1547. background: none;
  1548. border: none;
  1549. }
  1550. #topnav-toggle:hover {
  1551. cursor: pointer;
  1552. color: #fff;
  1553. }
  1554. #topnav-toggle:after {
  1555. margin: 0;
  1556. -webkit-font-smoothing: antialiased;
  1557. display: inline-block;
  1558. content: '\f419';
  1559. font: normal 24px Genericons;
  1560. text-decoration: inherit;
  1561. vertical-align: text-bottom;
  1562. }
  1563. .top-navigation-menu {
  1564. float: left;
  1565. display: none;
  1566. width: 100%;
  1567. margin: 2em -1.5em -2.5em;
  1568. padding: 0 1.5em;
  1569. border-top: 1px solid rgba(255,255,255,0.08);
  1570. text-align: center;
  1571. }
  1572. .top-navigation-menu a {
  1573. float: none;
  1574. display: inline-block;
  1575. padding: 1em 0.8em 1.2em;
  1576. text-decoration: none;
  1577. font-size: 1.05em;
  1578. color: #ccc;
  1579. }
  1580. .top-navigation-menu a:hover {
  1581. color: #fff;
  1582. text-decoration: underline;
  1583. }
  1584. .top-navigation-menu li.current_page_item a, .top-navigation-menu li.current-menu-item a {
  1585. text-decoration: underline;
  1586. }
  1587. /* Mobile Main Navigation */
  1588. /* Reset */
  1589. #mainnav, .main-navigation-menu, .main-navigation-menu li, .main-navigation-menu a, .main-navigation-menu ul,
  1590. .main-navigation-menu ul a, .main-navigation-menu ul ul, .main-navigation-menu li ul ul
  1591. {
  1592. margin: 0;
  1593. padding: 0;
  1594. position: static;
  1595. float: none;
  1596. display: inline;
  1597. font-size: 1.0em;
  1598. border: none;
  1599. box-shadow: none;
  1600. background: none;
  1601. top: auto;
  1602. left: auto;
  1603. }
  1604. .main-navigation-menu li,
  1605. .main-navigation-menu ul,
  1606. .main-navigation-menu li ul ul,
  1607. .mega-menu-item .mega-menu-content,
  1608. .mega-menu-item .mega-menu-content .mega-menu-widget {
  1609. position: static;
  1610. display: block;
  1611. left: auto;
  1612. top: auto;
  1613. clear: left;
  1614. }
  1615. #mainnav {
  1616. float: none;
  1617. }
  1618. #mainnav-toggle-tablet {
  1619. display: inline-block;
  1620. }
  1621. #mainnav-toggle-phone {
  1622. display: none;
  1623. }
  1624. .mainnav-toggle {
  1625. margin: 0;
  1626. padding: 1.1em;
  1627. text-decoration: none;
  1628. background: none;
  1629. border: none;
  1630. }
  1631. .mainnav-toggle:hover {
  1632. cursor: pointer;
  1633. }
  1634. .mainnav-toggle:after {
  1635. float: left;
  1636. margin: 0;
  1637. -webkit-font-smoothing: antialiased;
  1638. display: inline-block;
  1639. content: '\f419';
  1640. font: normal 24px/1 Genericons;
  1641. text-decoration: inherit;
  1642. vertical-align: text-bottom;
  1643. color: #333;
  1644. }
  1645. .mainnav-toggle:hover:after {
  1646. color: #22a8d8;
  1647. }
  1648. .main-navigation-menu {
  1649. float: left;
  1650. display: none;
  1651. width: 100%;
  1652. border-top: 1px solid #ddd;
  1653. }
  1654. .main-navigation-menu a {
  1655. display: block;
  1656. padding: 1.4em;
  1657. border-bottom: 1px solid #eee;
  1658. text-decoration: none;
  1659. font-size: 0.9em;
  1660. font-weight: bold;
  1661. text-transform: uppercase;
  1662. clear: left;
  1663. }
  1664. .main-navigation-menu a:link, .main-navigation-menu a:visited {
  1665. color: #222;
  1666. }
  1667. .main-navigation-menu a:hover {
  1668. color: #22a8d8;
  1669. }
  1670. .main-navigation-menu ul {
  1671. float: left;
  1672. background: #fbfbfb;
  1673. width: 100%;
  1674. -webkit-box-sizing: border-box;
  1675. -moz-box-sizing: border-box;
  1676. box-sizing: border-box;
  1677. }
  1678. .main-navigation-menu ul a {
  1679. display: block;
  1680. width: 100%;
  1681. padding: 1em 1em 1em 2em;
  1682. font-size: 0.9em;
  1683. font-weight: normal;
  1684. color: #22a8d8;
  1685. border-bottom: 1px solid #eee;
  1686. -webkit-box-sizing: border-box;
  1687. -moz-box-sizing: border-box;
  1688. box-sizing: border-box;
  1689. }
  1690. .main-navigation-menu ul ul a {
  1691. padding-left: 3em;
  1692. }
  1693. .main-navigation-menu ul ul ul a {
  1694. padding-left: 4em;
  1695. }
  1696. .main-navigation-menu ul a:link, .main-navigation-menu ul a:visited {
  1697. color: #22a8d8;
  1698. }
  1699. .main-navigation-menu ul a:hover {
  1700. text-decoration: underline;
  1701. }
  1702. .main-navigation-menu ul li ul {
  1703. float: left;
  1704. padding: 0 0 0 1em;
  1705. width: 100%;
  1706. -webkit-box-sizing: border-box;
  1707. -moz-box-sizing: border-box;
  1708. box-sizing: border-box;
  1709. }
  1710. .main-navigation-menu li.current_page_item a, .main-navigation-menu li.current-menu-item a {
  1711. color: #22a8d8;
  1712. text-decoration: underline;
  1713. }
  1714. .main-navigation-menu li.current_page_item ul li a, .main-navigation-menu li.current-menu-item ul li a{
  1715. color: #22a8d8;
  1716. text-decoration: none;
  1717. }
  1718. .main-navigation-menu li.current_page_item ul li a:hover, .main-navigation-menu li.current-menu-item ul li a:hover {
  1719. text-decoration: underline;
  1720. }
  1721. .main-navigation-menu ul li.current_page_item a, .main-navigation-menu ul li.current-menu-item a {
  1722. color: #22a8d8;
  1723. text-decoration: underline;
  1724. }
  1725. .main-navigation-menu ul li.current_page_item ul li a, .main-navigation-menu ul li.current-menu-item ul li a{
  1726. text-decoration: none;
  1727. }
  1728. .main-navigation-menu .submenu-dropdown-toggle {
  1729. float: right;
  1730. display: block;
  1731. margin: 0;
  1732. padding: 0.85em 1.5em;
  1733. }
  1734. .main-navigation-menu .submenu-dropdown-toggle:hover {
  1735. cursor: pointer;
  1736. }
  1737. .main-navigation-menu .submenu-dropdown-toggle:before {
  1738. font-size: 28px;
  1739. line-height: 1;
  1740. font-family: 'Genericons';
  1741. -webkit-font-smoothing: antialiased;
  1742. -moz-osx-font-smoothing: grayscale;
  1743. text-decoration: inherit;
  1744. vertical-align: middle;
  1745. content: '\f431';
  1746. color: #222;
  1747. }
  1748. .main-navigation-menu .submenu-dropdown-toggle.active:before {
  1749. content: '\f432';
  1750. }
  1751. .main-navigation-menu .submenu-dropdown-toggle:hover:before {
  1752. color: #22a8d8;
  1753. }
  1754. .main-navigation-menu ul .submenu-dropdown-toggle {
  1755. padding: 0.5em 1em;
  1756. }
  1757. /* Mega Menu Styling */
  1758. .mega-menu-item .mega-menu-content {
  1759. color: #333;
  1760. }
  1761. .mega-menu-item .mega-menu-two-columns > li,
  1762. .mega-menu-item .mega-menu-three-columns > li,
  1763. .mega-menu-item .mega-menu-five-columns > li {
  1764. width: 100%;
  1765. }
  1766. .mega-menu-item .mega-menu-four-columns > li,
  1767. .mega-menu-item .mega-menu-six-columns > li {
  1768. width: 50%;
  1769. }
  1770. }
  1771. /* Tablets (portrait) | <800px */
  1772. @media only screen and (max-width: 50em) {
  1773. #featured-content .featured-content-left .entry-title, .single .entry-title, .page-title {
  1774. font-size: 1.7em;
  1775. }
  1776. .entry h1, .commentlist h1 {
  1777. font-size: 2.2em;
  1778. }
  1779. .entry h2, .commentlist h2 {
  1780. font-size: 1.8em;
  1781. }
  1782. .entry h3, .commentlist h3 {
  1783. font-size: 1.4em;
  1784. }
  1785. .entry tr th,
  1786. .entry thead th {
  1787. padding: 0.2em 0.4em;
  1788. }
  1789. .entry tr td {
  1790. padding: 0.2em 0.4em;
  1791. }
  1792. #footer {
  1793. text-align: center;
  1794. }
  1795. #footer #credit-link {
  1796. float: none;
  1797. margin-top: 1em;
  1798. }
  1799. }
  1800. @media only screen and (max-width: 45em) {
  1801. .post-wrapper {
  1802. margin: 0;
  1803. }
  1804. .post-wrapper .post-wrap {
  1805. float: none;
  1806. width: 100%;
  1807. padding-right: 0;
  1808. }
  1809. .post-wrapper .one-column-post {
  1810. margin-right: 0;
  1811. }
  1812. }
  1813. /* Phablets (portrait) | <640px */
  1814. @media only screen and (max-width: 40em) {
  1815. /* Mega Menu Styling */
  1816. .mega-menu-item .mega-menu-four-columns > li,
  1817. .mega-menu-item .mega-menu-six-columns > li {
  1818. width: 100%;
  1819. }
  1820. #featured-content .featured-content-left .entry-title, .single .entry-title, .page-title {
  1821. font-size: 1.6em;
  1822. }
  1823. #featured-content {
  1824. margin: 0;
  1825. }
  1826. #featured-content .featured-content-left {
  1827. padding-right: 0;
  1828. }
  1829. #featured-content .featured-content-right .featured-post-wrap {
  1830. float: none;
  1831. padding-right: 0;
  1832. width: 100%;
  1833. }
  1834. }
  1835. /* Smartphones | <480px */
  1836. @media only screen and (max-width: 30em) {
  1837. #header {
  1838. padding: 2em 1em;
  1839. }
  1840. #logo .site-title {
  1841. font-size: 2.0em;
  1842. }
  1843. .top-navigation-menu {
  1844. margin: 2em -1em -2em;
  1845. padding: 0 1em;
  1846. }
  1847. .top-navigation-menu a {
  1848. padding: 1em 0.8em 1.2em;
  1849. font-size: 0.95em;
  1850. }
  1851. #wrap, .header-image {
  1852. padding: 1em 1em 0;
  1853. }
  1854. .type-post, .type-page, .type-attachment {
  1855. margin: 0 0 1em 0;
  1856. padding: 0.75em;
  1857. }
  1858. .widget {
  1859. margin: 0 0 1em 0;
  1860. }
  1861. #footer {
  1862. padding: 0.8em;
  1863. }
  1864. .alignright, .alignleft {
  1865. float: none;
  1866. margin: 1em 0;
  1867. }
  1868. #featured-content .featured-content-left .entry-title, .single .entry-title, .page-title {
  1869. font-size: 1.4em;
  1870. }
  1871. .postinfo {
  1872. margin: 0.75em -0.75em -0.75em;
  1873. padding: 0.5em 0.7em;
  1874. }
  1875. .postinfo span {
  1876. display: block;
  1877. }
  1878. .postinfo .meta-tags {
  1879. margin: 0.3em 0 0 0;
  1880. }
  1881. /* Mobile Main Navigation */
  1882. #mainnav-toggle-tablet {
  1883. display: none;
  1884. }
  1885. #mainnav-toggle-phone {
  1886. display: inline-block;
  1887. }
  1888. /* Social Menu Dropdown */
  1889. #social-menu-toggle {
  1890. float: right;
  1891. display: inline-block;
  1892. padding: 0.6em;
  1893. text-decoration: none;
  1894. color: #22a8d8;
  1895. background: none;
  1896. border: none;
  1897. }
  1898. #social-menu-toggle:hover {
  1899. cursor: pointer;
  1900. color: #333;
  1901. }
  1902. #social-menu-toggle:after {
  1903. margin: 0;
  1904. -webkit-font-smoothing: antialiased;
  1905. display: inline-block;
  1906. content: '\f408';
  1907. font: normal 32px Genericons;
  1908. text-decoration: inherit;
  1909. vertical-align: text-bottom;
  1910. }
  1911. #navi-social-icons #social-icons-menu {
  1912. display: none;
  1913. float: right;
  1914. border-top: 1px solid #ddd;
  1915. width: 100%;
  1916. text-align: center;
  1917. }
  1918. #navi-social-icons #social-icons-menu li a {
  1919. padding: 0.9em;
  1920. }
  1921. }
  1922. /* Smartphones | <320px */
  1923. @media only screen and (max-width: 20em) {
  1924. .top-navigation-menu {
  1925. padding: 0.5em 1em 0.7em;
  1926. }
  1927. .top-navigation-menu a {
  1928. display: block;
  1929. padding: 1em 0.8em;
  1930. font-size: 0.95em;
  1931. }
  1932. #featured-content .featured-content-left .entry-title, .single .entry-title, .page-title {
  1933. font-size: 1.3em;
  1934. }
  1935. }
  1936. /* Big Screens Navi Fix | >720px */
  1937. @media only screen and (min-width: 60.001em) {
  1938. /* ensure #nav is visible on desktop version */
  1939. .main-navigation-menu, .top-navigation-menu {
  1940. display: block !important;
  1941. }
  1942. }
  1943. @media only screen and (min-width: 30.001em) {
  1944. /* ensure social icons are visible on desktop version */
  1945. #navi-social-icons #social-icons-menu {
  1946. display: block !important;
  1947. }
  1948. }