style-editor.css 39 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690
  1. @charset "UTF-8";
  2. /**
  3. * These styles should be loaded by the Block Editor only
  4. */
  5. /**
  6. * Abstracts
  7. * - Mixins, variables and functions
  8. */
  9. /* Sass Functions go here */
  10. /**
  11. * Map deep get
  12. * @author Hugo Giraudel
  13. * @access public
  14. * @param {Map} $map - Map
  15. * @param {Arglist} $keys - Key chain
  16. * @return {*} - Desired value
  17. *
  18. * Example:
  19. * $m-breakpoint: map-deep-get($__prefix-default-config, "layouts", "M");
  20. */
  21. /**
  22. * Deep set function to set a value in nested maps
  23. * @author Hugo Giraudel
  24. * @access public
  25. * @param {Map} $map - Map
  26. * @param {List} $keys - Key chaine
  27. * @param {*} $value - Value to assign
  28. * @return {Map}
  29. *
  30. * Example:
  31. * $__prefix-default-config: map-deep-set($__prefix-default-config, "layouts" "M", 650px);
  32. */
  33. /**
  34. * jQuery-style extend function
  35. * - Child themes can use this function to `reset` the values in
  36. * config maps without editing the `master` Sass files.
  37. * - src: https://www.sitepoint.com/extra-map-functions-sass/
  38. * - About `map-merge()`:
  39. * - - only takes 2 arguments
  40. * - - is not recursive
  41. * @param {Map} $map - first map
  42. * @param {ArgList} $maps - other maps
  43. * @param {Bool} $deep - recursive mode
  44. * @return {Map}
  45. *
  46. * Examples:
  47. $grid-configuration-default: (
  48. 'columns': 12,
  49. 'layouts': (
  50. 'small': 800px,
  51. 'medium': 1000px,
  52. 'large': 1200px,
  53. ),
  54. );
  55. $grid-configuration-custom: (
  56. 'layouts': (
  57. 'large': 1300px,
  58. 'huge': 1500px
  59. ),
  60. );
  61. $grid-configuration-user: (
  62. 'direction': 'ltr',
  63. 'columns': 16,
  64. 'layouts': (
  65. 'large': 1300px,
  66. 'huge': 1500px
  67. ),
  68. );
  69. // $deep: false
  70. $grid-configuration: map-extend($grid-configuration-default, $grid-configuration-custom, $grid-configuration-user);
  71. // --> ("columns": 16, "layouts": (("large": 1300px, "huge": 1500px)), "direction": "ltr")
  72. // $deep: true
  73. $grid-configuration: map-extend($grid-configuration-default, $grid-configuration-custom, $grid-configuration-user, true);
  74. // --> ("columns": 16, "layouts": (("small": 800px, "medium": 1000px, "large": 1300px, "huge": 1500px)), "direction": "ltr")
  75. */
  76. /**
  77. * Button
  78. */
  79. /**
  80. * Cover
  81. */
  82. /**
  83. * Heading
  84. */
  85. /**
  86. * List
  87. */
  88. /**
  89. * Pullquote
  90. */
  91. /**
  92. * Quote
  93. */
  94. /**
  95. * Separator
  96. */
  97. /**
  98. * Responsive breakpoints
  99. * - breakpoints values are defined in _config-global.scss
  100. */
  101. /**
  102. * Align wide widths
  103. * - Sets .alignwide widths
  104. */
  105. /**
  106. * Crop Text Boundry
  107. * - Sets a fixed-width on content within alignwide and alignfull blocks
  108. */
  109. /**
  110. * Add font-family using CSS variables.
  111. * It also adds the proper fallback for browsers without support.
  112. */
  113. /**
  114. * Extends
  115. */
  116. /**
  117. * Button Placeholder style
  118. * - Since buttons appear in various blocks,
  119. * let’s use a placeholder to keep them all
  120. * in-sync
  121. */
  122. .wp-block-a8c-blog-posts + .button, .fse-template-part .main-navigation .button {
  123. line-height: 1;
  124. color: white;
  125. cursor: pointer;
  126. font-weight: bold;
  127. font-family: sans-serif;
  128. font-family: var(--font-headings, sans-serif);
  129. font-size: 1.2rem;
  130. background-color: blue;
  131. border-radius: 9px;
  132. border-width: 0;
  133. text-decoration: none;
  134. padding: 16px 16px;
  135. }
  136. .wp-block-a8c-blog-posts + .button:before, .fse-template-part .main-navigation .button:before, .wp-block-a8c-blog-posts + .button:after, .fse-template-part .main-navigation .button:after {
  137. content: '';
  138. display: block;
  139. height: 0;
  140. width: 0;
  141. }
  142. .wp-block-a8c-blog-posts + .button:before, .fse-template-part .main-navigation .button:before {
  143. margin-bottom: -0.12em;
  144. }
  145. .wp-block-a8c-blog-posts + .button:after, .fse-template-part .main-navigation .button:after {
  146. margin-top: -0.11em;
  147. }
  148. .wp-block-a8c-blog-posts + .button:hover, .fse-template-part .main-navigation .button:hover, .wp-block-a8c-blog-posts + .button:focus, .fse-template-part .main-navigation .button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .fse-template-part .main-navigation .has-focus.button {
  149. color: white;
  150. background-color: indigo;
  151. }
  152. /**
  153. * Onsale Placeholder style
  154. * - Since buttons appear in various blocks,
  155. * let’s use a placeholder to keep them all
  156. * in-sync
  157. */
  158. /**
  159. * Base
  160. * - Reset the browser
  161. */
  162. body {
  163. color: #444444;
  164. background-color: white;
  165. font-family: serif;
  166. font-family: var(--font-base, serif);
  167. font-size: 18px;
  168. font-weight: normal;
  169. line-height: 1.78;
  170. -moz-osx-font-smoothing: grayscale;
  171. -webkit-font-smoothing: antialiased;
  172. }
  173. .editor-post-title__block {
  174. font-size: 18px;
  175. }
  176. p {
  177. font-size: 1em;
  178. line-height: 1.78;
  179. }
  180. a {
  181. color: blue;
  182. }
  183. a:hover {
  184. color: indigo;
  185. }
  186. button,
  187. a {
  188. cursor: pointer;
  189. }
  190. /**
  191. * Elements
  192. * - Styles for basic HTML elemants
  193. */
  194. /**
  195. * Elements
  196. * - Styles for basic HTML elemants
  197. */
  198. blockquote {
  199. padding-left: 16px;
  200. }
  201. blockquote p {
  202. font-size: 1.728rem;
  203. letter-spacing: normal;
  204. line-height: 1.125;
  205. }
  206. blockquote cite,
  207. blockquote footer {
  208. font-size: 0.83333rem;
  209. letter-spacing: normal;
  210. }
  211. blockquote > * {
  212. margin-top: 16px;
  213. margin-bottom: 16px;
  214. }
  215. blockquote > *:first-child {
  216. margin-top: 0;
  217. }
  218. blockquote > *:last-child {
  219. margin-bottom: 0;
  220. }
  221. blockquote.alignleft, blockquote.alignright {
  222. padding-left: inherit;
  223. }
  224. blockquote.alignleft p, blockquote.alignright p {
  225. font-size: 1.44rem;
  226. max-width: inherit;
  227. width: inherit;
  228. }
  229. blockquote.alignleft cite,
  230. blockquote.alignleft footer, blockquote.alignright cite,
  231. blockquote.alignright footer {
  232. font-size: 0.69444rem;
  233. letter-spacing: normal;
  234. }
  235. figcaption {
  236. color: #767676;
  237. font-size: 0.69444rem;
  238. margin-top: calc(0.5 * 16px);
  239. margin-bottom: 16px;
  240. text-align: center;
  241. }
  242. .alignleft figcaption,
  243. .alignright figcaption {
  244. margin-bottom: 0;
  245. }
  246. /* WP Smiley */
  247. .page-content .wp-smiley,
  248. .entry-content .wp-smiley,
  249. .comment-content .wp-smiley {
  250. border: none;
  251. margin-bottom: 0;
  252. margin-top: 0;
  253. padding: 0;
  254. }
  255. /* Make sure embeds and iframes fit their containers. */
  256. embed,
  257. iframe,
  258. object {
  259. max-width: 100%;
  260. }
  261. /**
  262. * Blocks
  263. * - These styles replace key Gutenberg Block styles for fonts, colors, and
  264. * spacing with CSS-variables overrides
  265. */
  266. /**
  267. * Block Styles for the Editor
  268. *
  269. * - These styles replace key Gutenberg Block styles for fonts, colors, and
  270. * spacing with CSS-variables overrides in the Block Editor
  271. * - In the future the Block styles may get compiled to individual .css
  272. * files and conditionally loaded
  273. */
  274. .wp-block-a8c-blog-posts.image-aligntop .post-thumbnail {
  275. margin-bottom: 16px;
  276. }
  277. .wp-block-a8c-blog-posts.image-alignleft .post-thumbnail {
  278. margin-right: 32px;
  279. }
  280. .wp-block-a8c-blog-posts.image-alignright .post-thumbnail {
  281. margin-left: 32px;
  282. }
  283. .wp-block-a8c-blog-posts.image-alignbehind .post-has-image .entry-wrapper {
  284. padding: 32px;
  285. }
  286. .wp-block-a8c-blog-posts.image-alignbehind .post-has-image .cat-links {
  287. color: #fff;
  288. }
  289. .wp-block-a8c-blog-posts.image-alignbehind .post-has-image a:hover {
  290. color: currentColor;
  291. }
  292. .wp-block-a8c-blog-posts .article-section-title {
  293. font-size: 1em;
  294. margin-top: 0;
  295. margin-bottom: 16px;
  296. }
  297. .wp-block-a8c-blog-posts article {
  298. margin-bottom: 64px;
  299. }
  300. @media only screen and (min-width: 560px) {
  301. .wp-block-a8c-blog-posts article {
  302. margin-bottom: 96px;
  303. }
  304. }
  305. .wp-block-a8c-blog-posts .post-thumbnail img {
  306. vertical-align: middle;
  307. width: auto;
  308. }
  309. .wp-block-a8c-blog-posts .entry-wrapper > * {
  310. /* Vertical margins logic between post details */
  311. margin-top: 16px;
  312. margin-bottom: 16px;
  313. }
  314. .wp-block-a8c-blog-posts .entry-wrapper > *:first-child {
  315. margin-top: 0;
  316. }
  317. .wp-block-a8c-blog-posts .entry-wrapper > *:last-child {
  318. margin-bottom: 0;
  319. }
  320. .wp-block-a8c-blog-posts .entry-title a {
  321. color: blue;
  322. }
  323. .has-background:not(.has-background-background-color) .wp-block-a8c-blog-posts .entry-title a,
  324. [class*="background-color"]:not(.has-background-background-color) .wp-block-a8c-blog-posts .entry-title a,
  325. [style*="background-color"] .wp-block-a8c-blog-posts .entry-title a {
  326. color: currentColor;
  327. }
  328. .wp-block-a8c-blog-posts .entry-title a:hover {
  329. color: indigo;
  330. text-decoration: underline;
  331. }
  332. .has-background:not(.has-background-background-color) .wp-block-a8c-blog-posts .entry-title a,
  333. [class*="background-color"]:not(.has-background-background-color) .wp-block-a8c-blog-posts .entry-title a,
  334. [style*="background-color"] .wp-block-a8c-blog-posts .entry-title a {
  335. color: currentColor;
  336. }
  337. .wp-block-a8c-blog-posts .more-link {
  338. display: block;
  339. color: inherit;
  340. margin-top: 16px;
  341. }
  342. .wp-block-a8c-blog-posts .more-link:after {
  343. content: "\02192";
  344. display: inline-block;
  345. margin-left: 0.5em;
  346. }
  347. .wp-block-a8c-blog-posts .more-link:hover, .wp-block-a8c-blog-posts .more-link:active {
  348. color: indigo;
  349. text-decoration: none;
  350. }
  351. .has-background:not(.has-background-background-color) .wp-block-a8c-blog-posts .more-link:hover,
  352. [class*="background-color"]:not(.has-background-background-color) .wp-block-a8c-blog-posts .more-link:hover,
  353. [style*="background-color"] .wp-block-a8c-blog-posts .more-link:hover, .has-background:not(.has-background-background-color) .wp-block-a8c-blog-posts .more-link:active,
  354. [class*="background-color"]:not(.has-background-background-color) .wp-block-a8c-blog-posts .more-link:active,
  355. [style*="background-color"] .wp-block-a8c-blog-posts .more-link:active {
  356. color: currentColor;
  357. }
  358. .wp-block-a8c-blog-posts .entry-meta,
  359. .wp-block-a8c-blog-posts .cat-links {
  360. color: #767676;
  361. font-size: 0.83333em;
  362. }
  363. .has-background:not(.has-background-background-color) .wp-block-a8c-blog-posts .entry-meta,
  364. [class*="background-color"]:not(.has-background-background-color) .wp-block-a8c-blog-posts .entry-meta,
  365. [style*="background-color"] .wp-block-a8c-blog-posts .entry-meta, .has-background:not(.has-background-background-color)
  366. .wp-block-a8c-blog-posts .cat-links,
  367. [class*="background-color"]:not(.has-background-background-color)
  368. .wp-block-a8c-blog-posts .cat-links,
  369. [style*="background-color"]
  370. .wp-block-a8c-blog-posts .cat-links {
  371. color: currentColor;
  372. }
  373. .wp-block-a8c-blog-posts .entry-meta .byline:not(:last-child),
  374. .wp-block-a8c-blog-posts .cat-links .byline:not(:last-child) {
  375. margin-right: 16px;
  376. }
  377. .wp-block-a8c-blog-posts .entry-meta .published + .updated,
  378. .wp-block-a8c-blog-posts .cat-links .published + .updated {
  379. display: none;
  380. }
  381. .wp-block-a8c-blog-posts .entry-meta a,
  382. .wp-block-a8c-blog-posts .cat-links a {
  383. color: currentColor;
  384. text-decoration: underline;
  385. }
  386. .wp-block-a8c-blog-posts .entry-meta a:hover, .wp-block-a8c-blog-posts .entry-meta a:active,
  387. .wp-block-a8c-blog-posts .cat-links a:hover,
  388. .wp-block-a8c-blog-posts .cat-links a:active {
  389. color: indigo;
  390. text-decoration: none;
  391. }
  392. .has-background:not(.has-background-background-color) .wp-block-a8c-blog-posts .entry-meta a:hover,
  393. [class*="background-color"]:not(.has-background-background-color) .wp-block-a8c-blog-posts .entry-meta a:hover,
  394. [style*="background-color"] .wp-block-a8c-blog-posts .entry-meta a:hover, .has-background:not(.has-background-background-color) .wp-block-a8c-blog-posts .entry-meta a:active,
  395. [class*="background-color"]:not(.has-background-background-color) .wp-block-a8c-blog-posts .entry-meta a:active,
  396. [style*="background-color"] .wp-block-a8c-blog-posts .entry-meta a:active, .has-background:not(.has-background-background-color)
  397. .wp-block-a8c-blog-posts .cat-links a:hover,
  398. [class*="background-color"]:not(.has-background-background-color)
  399. .wp-block-a8c-blog-posts .cat-links a:hover,
  400. [style*="background-color"]
  401. .wp-block-a8c-blog-posts .cat-links a:hover, .has-background:not(.has-background-background-color)
  402. .wp-block-a8c-blog-posts .cat-links a:active,
  403. [class*="background-color"]:not(.has-background-background-color)
  404. .wp-block-a8c-blog-posts .cat-links a:active,
  405. [style*="background-color"]
  406. .wp-block-a8c-blog-posts .cat-links a:active {
  407. color: currentColor;
  408. }
  409. /**
  410. * Button Placeholder style
  411. * - Since buttons appear in various blocks,
  412. * let’s use a placeholder to keep them all
  413. * in-sync
  414. */
  415. .wp-block-a8c-blog-posts + .button, .fse-template-part .main-navigation .button {
  416. line-height: 1;
  417. color: white;
  418. cursor: pointer;
  419. font-weight: bold;
  420. font-family: sans-serif;
  421. font-family: var(--font-headings, sans-serif);
  422. font-size: 1.2rem;
  423. background-color: blue;
  424. border-radius: 9px;
  425. border-width: 0;
  426. text-decoration: none;
  427. padding: 16px 16px;
  428. }
  429. .wp-block-a8c-blog-posts + .button:before, .fse-template-part .main-navigation .button:before, .wp-block-a8c-blog-posts + .button:after, .fse-template-part .main-navigation .button:after {
  430. content: '';
  431. display: block;
  432. height: 0;
  433. width: 0;
  434. }
  435. .wp-block-a8c-blog-posts + .button:before, .fse-template-part .main-navigation .button:before {
  436. margin-bottom: -0.12em;
  437. }
  438. .wp-block-a8c-blog-posts + .button:after, .fse-template-part .main-navigation .button:after {
  439. margin-top: -0.11em;
  440. }
  441. .wp-block-a8c-blog-posts + .button:hover, .fse-template-part .main-navigation .button:hover, .wp-block-a8c-blog-posts + .button:focus, .fse-template-part .main-navigation .button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .fse-template-part .main-navigation .has-focus.button {
  442. color: white;
  443. background-color: indigo;
  444. }
  445. /**
  446. * Onsale Placeholder style
  447. * - Since buttons appear in various blocks,
  448. * let’s use a placeholder to keep them all
  449. * in-sync
  450. */
  451. .wp-block-a8c-blog-posts + .button {
  452. display: inline-block;
  453. font-size: 1.2em;
  454. }
  455. .wp-block-a8c-blog-posts + .button:hover {
  456. cursor: default;
  457. }
  458. .has-background:not(.has-background-background-color) .wp-block-a8c-blog-posts + .button,
  459. [class*="background-color"]:not(.has-background-background-color) .wp-block-a8c-blog-posts + .button,
  460. [style*="background-color"] .wp-block-a8c-blog-posts + .button {
  461. background-color: transparent;
  462. border: 2px solid currentColor;
  463. color: currentColor;
  464. }
  465. /* Default Style */
  466. .wp-block-button__link {
  467. color: white;
  468. font-weight: bold;
  469. font-family: sans-serif;
  470. font-family: var(--font-headings, sans-serif);
  471. font-size: 1.2em;
  472. line-height: 1;
  473. background-color: blue;
  474. border-radius: 9px;
  475. padding: 16px 16px;
  476. /* Outline Style */
  477. /* Squared Style */
  478. }
  479. .wp-block-button__link:hover, .wp-block-button__link:focus, .wp-block-button__link.has-focus {
  480. color: white;
  481. background-color: indigo;
  482. }
  483. .wp-block-button__link.is-style-outline,
  484. .is-style-outline .wp-block-button__link {
  485. background: transparent;
  486. border: 2px solid currentcolor;
  487. }
  488. .wp-block-button__link.is-style-outline:hover, .wp-block-button__link.is-style-outline:focus, .wp-block-button__link.is-style-outline.has-focus,
  489. .is-style-outline .wp-block-button__link:hover,
  490. .is-style-outline .wp-block-button__link:focus,
  491. .is-style-outline .wp-block-button__link.has-focus {
  492. color: indigo;
  493. background: transparent;
  494. }
  495. .wp-block-button__link.is-style-squared,
  496. .is-style-squared .wp-block-button__link {
  497. border-radius: 0;
  498. }
  499. /* Default Style */
  500. .button {
  501. color: white;
  502. font-weight: bold;
  503. font-family: sans-serif;
  504. font-family: var(--font-headings, sans-serif);
  505. font-size: 1.2em;
  506. line-height: 1;
  507. background-color: blue;
  508. border-radius: 9px;
  509. padding: 16px 16px;
  510. }
  511. .button:hover, .button:focus, .button.has-focus {
  512. color: white;
  513. background-color: indigo;
  514. }
  515. .wp-block-columns .wp-block[data-align=full],
  516. .wp-block-columns .alignfull {
  517. margin-left: inherit;
  518. margin-right: inherit;
  519. }
  520. .wp-block-cover,
  521. .wp-block-cover-image {
  522. background-color: black;
  523. color: white;
  524. min-height: 480px;
  525. margin-top: inherit;
  526. margin-bottom: inherit;
  527. /* default & custom background-color */
  528. /* Treating H2 separately to account for legacy /core styles */
  529. }
  530. .wp-block-cover.has-background-dim,
  531. .wp-block-cover-image.has-background-dim {
  532. background-color: black;
  533. color: white;
  534. }
  535. .wp-block-cover .wp-block-cover__inner-container,
  536. .wp-block-cover .wp-block-cover-image-text,
  537. .wp-block-cover .wp-block-cover-text,
  538. .wp-block-cover .block-editor-block-list__block,
  539. .wp-block-cover-image .wp-block-cover__inner-container,
  540. .wp-block-cover-image .wp-block-cover-image-text,
  541. .wp-block-cover-image .wp-block-cover-text,
  542. .wp-block-cover-image .block-editor-block-list__block {
  543. color: currentColor;
  544. }
  545. .wp-block-cover .wp-block-cover__inner-container a,
  546. .wp-block-cover .wp-block-cover-image-text a,
  547. .wp-block-cover .wp-block-cover-text a,
  548. .wp-block-cover .block-editor-block-list__block a,
  549. .wp-block-cover-image .wp-block-cover__inner-container a,
  550. .wp-block-cover-image .wp-block-cover-image-text a,
  551. .wp-block-cover-image .wp-block-cover-text a,
  552. .wp-block-cover-image .block-editor-block-list__block a {
  553. color: currentColor;
  554. }
  555. .wp-block-cover:not([class*='background-color']) .wp-block-cover__inner-container,
  556. .wp-block-cover:not([class*='background-color']) .wp-block-cover-image-text,
  557. .wp-block-cover:not([class*='background-color']) .wp-block-cover-text,
  558. .wp-block-cover:not([class*='background-color']) .block-editor-block-list__block,
  559. .wp-block-cover-image:not([class*='background-color']) .wp-block-cover__inner-container,
  560. .wp-block-cover-image:not([class*='background-color']) .wp-block-cover-image-text,
  561. .wp-block-cover-image:not([class*='background-color']) .wp-block-cover-text,
  562. .wp-block-cover-image:not([class*='background-color']) .block-editor-block-list__block {
  563. color: white;
  564. }
  565. .wp-block-cover h2,
  566. .wp-block-cover-image h2 {
  567. font-size: 2.48832em;
  568. letter-spacing: normal;
  569. line-height: 1.125;
  570. padding: 0;
  571. max-width: inherit;
  572. text-align: inherit;
  573. }
  574. .wp-block-cover h2.has-text-align-left,
  575. .wp-block-cover-image h2.has-text-align-left {
  576. text-align: left;
  577. }
  578. .wp-block-cover h2.has-text-align-center,
  579. .wp-block-cover-image h2.has-text-align-center {
  580. text-align: center;
  581. }
  582. .wp-block-cover h2.has-text-align-right,
  583. .wp-block-cover-image h2.has-text-align-right {
  584. text-align: right;
  585. }
  586. .wp-block-heading h1, h1, .h1,
  587. .wp-block-heading h2, h2, .h2,
  588. .wp-block-heading h3, h3, .h3,
  589. .wp-block-heading h4, h4, .h4,
  590. .wp-block-heading h5, h5, .h5,
  591. .wp-block-heading h6, h6, .h6 {
  592. font-family: sans-serif;
  593. font-family: var(--font-headings, sans-serif);
  594. font-weight: bold;
  595. clear: both;
  596. }
  597. .wp-block-heading h1, h1, .h1 {
  598. font-size: 2.98598em;
  599. letter-spacing: normal;
  600. line-height: 1.125;
  601. }
  602. .wp-block-heading h2, h2, .h2 {
  603. font-size: 2.48832em;
  604. letter-spacing: normal;
  605. line-height: 1.125;
  606. }
  607. .wp-block-heading h3, h3, .h3 {
  608. font-size: 2.0736em;
  609. letter-spacing: normal;
  610. line-height: 1.125;
  611. }
  612. .wp-block-heading h4, h4, .h4 {
  613. font-size: 1.728em;
  614. letter-spacing: normal;
  615. line-height: 1.125;
  616. }
  617. .wp-block-heading h5, h5, .h5 {
  618. font-size: 1.44em;
  619. letter-spacing: normal;
  620. line-height: 1.125;
  621. }
  622. .wp-block-heading h6, h6, .h6 {
  623. font-size: 1.2em;
  624. letter-spacing: normal;
  625. line-height: 1.125;
  626. }
  627. /* Center image block by default in the editor */
  628. .wp-block-image > div {
  629. text-align: center;
  630. }
  631. [data-type="core/image"] .block-editor-block-list__block-edit figure.is-resized {
  632. margin: 0 auto;
  633. }
  634. .wp-block-gallery figcaption {
  635. margin-bottom: 0;
  636. }
  637. .wp-block-group.has-background {
  638. padding: 21.312px;
  639. }
  640. @media only screen and (min-width: 560px) {
  641. .wp-block-group.has-background {
  642. padding: 32px;
  643. }
  644. }
  645. .wp-block[data-type="core/group"] > .editor-block-list__block-edit > div > .wp-block-group.has-background > .wp-block-group__inner-container > .editor-inner-blocks > .editor-block-list__layout > .wp-block[data-align=full] {
  646. margin: 0;
  647. width: 100%;
  648. }
  649. .wp-block-latest-comments {
  650. margin-left: 0;
  651. }
  652. .wp-block-latest-posts {
  653. padding-left: 0;
  654. }
  655. .wp-block-latest-posts > li > a {
  656. font-family: sans-serif;
  657. font-family: var(--font-headings, sans-serif);
  658. font-size: 1.728rem;
  659. font-weight: bold;
  660. line-height: 1.125;
  661. }
  662. .wp-block-latest-posts:not(.is-grid) > li {
  663. /* Vertical margins logic */
  664. margin-top: 32px;
  665. margin-bottom: 32px;
  666. }
  667. .wp-block-latest-posts:not(.is-grid) > li:first-child {
  668. margin-top: 0;
  669. }
  670. .wp-block-latest-posts:not(.is-grid) > li:last-child {
  671. margin-bottom: 0;
  672. }
  673. .wp-block-latest-posts .wp-block-latest-posts__post-date {
  674. color: #767676;
  675. font-size: 0.83333rem;
  676. line-height: 1.78;
  677. }
  678. [class*="inner-container"] .wp-block-latest-posts .wp-block-latest-posts__post-date,
  679. .has-background .wp-block-latest-posts .wp-block-latest-posts__post-date {
  680. color: currentColor;
  681. }
  682. .wp-block-latest-posts .wp-block-latest-posts__post-excerpt,
  683. .wp-block-latest-posts .wp-block-latest-posts__post-full-content {
  684. font-size: 0.83333rem;
  685. line-height: 1.78;
  686. margin: 0;
  687. }
  688. ul,
  689. ol {
  690. margin: 32px 0;
  691. padding-left: 32px;
  692. }
  693. ul.aligncenter,
  694. ol.aligncenter {
  695. list-style-position: inside;
  696. padding: 0;
  697. }
  698. ul.alignright,
  699. ol.alignright {
  700. list-style-position: inside;
  701. text-align: right;
  702. padding: 0;
  703. }
  704. li > ul,
  705. li > ol {
  706. margin: 0;
  707. }
  708. .wp-block-media-text .block-editor-inner-blocks {
  709. padding-right: 16px;
  710. padding-left: 16px;
  711. }
  712. @media only screen and (min-width: 640px) {
  713. .wp-block-media-text .block-editor-inner-blocks {
  714. padding-right: 32px;
  715. padding-left: 32px;
  716. }
  717. }
  718. .wp-block-media-text[style*="background-color"]:not(.has-background-background-color) a {
  719. color: currentColor;
  720. }
  721. .a8c-posts-list {
  722. padding-left: 0;
  723. }
  724. p.has-background {
  725. padding: 16px 16px;
  726. }
  727. p.has-background:not(.has-background-background-color) a {
  728. color: currentColor;
  729. }
  730. .wp-block-pullquote {
  731. padding: calc( 3 * 16px) 0;
  732. margin-left: 0;
  733. margin-right: 0;
  734. text-align: center;
  735. border-top-color: #DDDDDD;
  736. border-top-width: 4px;
  737. border-bottom-color: #DDDDDD;
  738. border-bottom-width: 4px;
  739. color: #444444;
  740. /**
  741. * Block Options
  742. */
  743. }
  744. .wp-block-pullquote blockquote {
  745. padding-left: 0;
  746. }
  747. .wp-block-pullquote p {
  748. font-family: sans-serif;
  749. font-family: var(--font-headings, sans-serif);
  750. font-size: 1.728em;
  751. letter-spacing: normal;
  752. line-height: 1.125;
  753. }
  754. .wp-block-pullquote a {
  755. color: currentColor;
  756. }
  757. .wp-block-pullquote .wp-block-pullquote__citation,
  758. .wp-block-pullquote cite,
  759. .wp-block-pullquote footer {
  760. color: #767676;
  761. font-size: 0.83333em;
  762. letter-spacing: normal;
  763. }
  764. .wp-block-pullquote:not(.is-style-solid-color) {
  765. background: none;
  766. }
  767. .wp-block-pullquote.is-style-solid-color {
  768. background-color: blue;
  769. color: white;
  770. }
  771. .wp-block-pullquote.is-style-solid-color.alignleft blockquote,
  772. .wp-block-pullquote.is-style-solid-color.alignright blockquote {
  773. padding-left: 16px;
  774. padding-right: 16px;
  775. max-width: inherit;
  776. }
  777. .wp-block-pullquote.is-style-solid-color blockquote {
  778. padding-left: 0;
  779. }
  780. .wp-block-pullquote.is-style-solid-color .wp-block-pullquote__citation,
  781. .wp-block-pullquote.is-style-solid-color cite,
  782. .wp-block-pullquote.is-style-solid-color footer {
  783. color: currentColor;
  784. }
  785. .wp-block-pullquote.alignwide > p,
  786. .wp-block-pullquote.alignfull > p,
  787. .wp-block-pullquote.alignwide blockquote,
  788. .wp-block-pullquote.alignfull blockquote {
  789. margin-left: auto;
  790. margin-right: auto;
  791. }
  792. .wp-block-quote {
  793. border-left-color: blue;
  794. margin: 32px 0;
  795. padding-left: 16px;
  796. }
  797. .wp-block-quote p {
  798. font-family: sans-serif;
  799. font-family: var(--font-headings, sans-serif);
  800. font-size: 1.728em;
  801. letter-spacing: normal;
  802. }
  803. .wp-block-quote.is-large, .wp-block-quote.is-style-large {
  804. border: none;
  805. padding: 0;
  806. }
  807. .wp-block-quote.is-large p, .wp-block-quote.is-style-large p {
  808. font-family: sans-serif;
  809. font-family: var(--font-headings, sans-serif);
  810. font-size: 2.0736em;
  811. letter-spacing: normal;
  812. line-height: 1.125;
  813. }
  814. .has-background:not(.has-background-background-color) .wp-block-quote,
  815. [class*="background-color"]:not(.has-background-background-color) .wp-block-quote,
  816. [style*="background-color"]:not(.has-background-background-color) .wp-block-quote,
  817. .wp-block-cover[style*="background-image"] .wp-block-quote {
  818. border-color: currentColor;
  819. }
  820. .wp-block-quote .wp-block-quote__citation {
  821. color: #767676;
  822. font-size: 0.83333em;
  823. letter-spacing: normal;
  824. }
  825. .has-background:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation,
  826. [class*="background-color"]:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation,
  827. [style*="background-color"]:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation,
  828. .wp-block-cover[style*="background-image"] .wp-block-quote .wp-block-quote__citation {
  829. color: currentColor;
  830. }
  831. .wp-block-separator,
  832. hr {
  833. border-bottom: 2px solid #DDDDDD;
  834. clear: both;
  835. }
  836. .wp-block-separator[style*="text-align:right"], .wp-block-separator[style*="text-align: right"],
  837. hr[style*="text-align:right"],
  838. hr[style*="text-align: right"] {
  839. border-right-color: #DDDDDD;
  840. }
  841. .wp-block-separator.is-style-wide,
  842. hr.is-style-wide {
  843. border-bottom-width: 2px;
  844. }
  845. .wp-block-separator.is-style-dots,
  846. hr.is-style-dots {
  847. border-bottom: none;
  848. }
  849. .wp-block-separator.is-style-dots.has-background, .wp-block-separator.is-style-dots.has-text-color,
  850. hr.is-style-dots.has-background,
  851. hr.is-style-dots.has-text-color {
  852. background-color: transparent !important;
  853. }
  854. .wp-block-separator.is-style-dots.has-background:before, .wp-block-separator.is-style-dots.has-text-color:before,
  855. hr.is-style-dots.has-background:before,
  856. hr.is-style-dots.has-text-color:before {
  857. color: currentColor !important;
  858. }
  859. .wp-block-separator.is-style-dots:before,
  860. hr.is-style-dots:before {
  861. color: #DDDDDD;
  862. }
  863. .has-background:not(.has-background-background-color) .wp-block-separator,
  864. [class*="background-color"]:not(.has-background-background-color) .wp-block-separator,
  865. [style*="background-color"]:not(.has-background-background-color) .wp-block-separator,
  866. .wp-block-cover[style*="background-image"] .wp-block-separator, .has-background:not(.has-background-background-color)
  867. hr,
  868. [class*="background-color"]:not(.has-background-background-color)
  869. hr,
  870. [style*="background-color"]:not(.has-background-background-color)
  871. hr,
  872. .wp-block-cover[style*="background-image"]
  873. hr {
  874. border-color: currentColor;
  875. }
  876. table th,
  877. .wp-block-table th {
  878. font-family: sans-serif;
  879. font-family: var(--font-headings, sans-serif);
  880. }
  881. table td,
  882. table th,
  883. .wp-block-table td,
  884. .wp-block-table th {
  885. padding: calc( 0.5 * 16px);
  886. }
  887. table.is-style-stripes tbody tr:nth-child(odd),
  888. .wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
  889. background-color: #FAFAFA;
  890. color: #444444;
  891. }
  892. /**
  893. * Editor Post Title
  894. * - Needs a special styles
  895. */
  896. .editor-post-title__block .editor-post-title__input {
  897. color: #444444;
  898. font-family: sans-serif;
  899. font-family: var(--font-headings, sans-serif);
  900. font-weight: bold;
  901. font-size: 2.48832em;
  902. letter-spacing: normal;
  903. line-height: 1.125;
  904. }
  905. .wp-block .has-primary-color,
  906. .has-primary-color {
  907. color: blue;
  908. }
  909. .wp-block .has-secondary-color,
  910. .has-secondary-color {
  911. color: red;
  912. }
  913. .wp-block .has-foreground-color,
  914. .has-foreground-color {
  915. color: #444444;
  916. }
  917. .wp-block .has-foreground-light-color,
  918. .has-foreground-light-color {
  919. color: #767676;
  920. }
  921. .wp-block .has-foreground-dark-color,
  922. .has-foreground-dark-color {
  923. color: #111111;
  924. }
  925. .wp-block .has-background-light-color,
  926. .has-background-light-color {
  927. color: #FAFAFA;
  928. }
  929. .wp-block .has-background-dark-color,
  930. .has-background-dark-color {
  931. color: #DDDDDD;
  932. }
  933. .wp-block .has-background-color,
  934. .has-background-color {
  935. color: white;
  936. }
  937. .has-background:not(.has-background-background-color) a:not(.wp-block-button__link),
  938. .has-background p:not(.has-text-color),
  939. .has-background h1:not(.has-text-color),
  940. .has-background h2:not(.has-text-color),
  941. .has-background h3:not(.has-text-color),
  942. .has-background h4:not(.has-text-color),
  943. .has-background h5:not(.has-text-color),
  944. .has-background h6:not(.has-text-color) {
  945. color: currentColor;
  946. }
  947. .wp-block .has-primary-background-color,
  948. .has-primary-background-color {
  949. background-color: blue;
  950. color: white;
  951. }
  952. .wp-block .has-secondary-background-color,
  953. .has-secondary-background-color {
  954. background-color: red;
  955. color: white;
  956. }
  957. .wp-block .has-foreground-background-color,
  958. .has-foreground-background-color {
  959. background-color: #444444;
  960. color: white;
  961. }
  962. .wp-block .has-foreground-light-background-color,
  963. .has-foreground-light-background-color {
  964. background-color: #767676;
  965. color: white;
  966. }
  967. .wp-block .has-foreground-dark-background-color,
  968. .has-foreground-dark-background-color {
  969. background-color: #111111;
  970. color: white;
  971. }
  972. .wp-block .has-background-light-background-color,
  973. .has-background-light-background-color {
  974. background-color: #FAFAFA;
  975. color: #444444;
  976. }
  977. .wp-block .has-background-dark-background-color,
  978. .has-background-dark-background-color {
  979. background-color: #DDDDDD;
  980. color: #444444;
  981. }
  982. .wp-block .has-background-background-color,
  983. .has-background-background-color {
  984. background-color: white;
  985. color: #444444;
  986. }
  987. .is-small-text,
  988. .has-small-font-size {
  989. font-size: 0.83333em;
  990. }
  991. .is-regular-text,
  992. .has-regular-font-size,
  993. .has-normal-font-size,
  994. .has-medium-font-size {
  995. font-size: 1.2em;
  996. }
  997. .is-large-text,
  998. .has-large-font-size {
  999. font-size: 1.44em;
  1000. line-height: 1.125;
  1001. }
  1002. .is-larger-text,
  1003. .has-larger-font-size,
  1004. .has-huge-font-size {
  1005. font-size: 1.728em;
  1006. line-height: 1.125;
  1007. }
  1008. .has-drop-cap:not(:focus)::first-letter {
  1009. font-family: sans-serif;
  1010. font-family: var(--font-headings, sans-serif);
  1011. font-size: calc(2 * 2.98598em);
  1012. font-weight: bold;
  1013. }
  1014. /**
  1015. * Spacing Overrides
  1016. */
  1017. [data-block] {
  1018. margin-top: 21.312px;
  1019. margin-bottom: 21.312px;
  1020. }
  1021. @media only screen and (min-width: 560px) {
  1022. [data-block] {
  1023. margin-top: 32px;
  1024. margin-bottom: 32px;
  1025. }
  1026. }
  1027. /*
  1028. * Margins
  1029. */
  1030. .margin-top-none {
  1031. margin-top: 0 !important;
  1032. }
  1033. .margin-top-half {
  1034. margin-top: 16px !important;
  1035. }
  1036. .margin-top-default {
  1037. margin-top: 32px !important;
  1038. }
  1039. .margin-right-none {
  1040. /*rtl:ignore*/
  1041. margin-right: 0 !important;
  1042. }
  1043. .margin-right-half {
  1044. /*rtl:ignore*/
  1045. margin-right: 16px !important;
  1046. }
  1047. .margin-right-default {
  1048. /*rtl:ignore*/
  1049. margin-right: 32px !important;
  1050. }
  1051. .margin-bottom-none {
  1052. margin-bottom: 0 !important;
  1053. }
  1054. .margin-bottom-half {
  1055. margin-bottom: 16px !important;
  1056. }
  1057. .margin-bottom-default {
  1058. margin-bottom: 32px !important;
  1059. }
  1060. .margin-left-none {
  1061. /*rtl:ignore*/
  1062. margin-left: 0 !important;
  1063. }
  1064. .margin-left-half {
  1065. /*rtl:ignore*/
  1066. margin-left: 16px !important;
  1067. }
  1068. .margin-left-default {
  1069. /*rtl:ignore*/
  1070. margin-left: 32px !important;
  1071. }
  1072. /*
  1073. * Padding
  1074. */
  1075. .padding-top-none {
  1076. padding-top: 0 !important;
  1077. }
  1078. .padding-top-half {
  1079. padding-top: 16px !important;
  1080. }
  1081. .padding-top-default {
  1082. padding-top: 32px !important;
  1083. }
  1084. .padding-right-none {
  1085. /*rtl:ignore*/
  1086. padding-right: 0 !important;
  1087. }
  1088. .padding-right-half {
  1089. /*rtl:ignore*/
  1090. padding-right: 16px !important;
  1091. }
  1092. .padding-right-default {
  1093. /*rtl:ignore*/
  1094. padding-right: 32px !important;
  1095. }
  1096. .padding-bottom-none {
  1097. padding-bottom: 0 !important;
  1098. }
  1099. .padding-bottom-half {
  1100. padding-bottom: 16px !important;
  1101. }
  1102. .padding-bottom-default {
  1103. padding-bottom: 32px !important;
  1104. }
  1105. .padding-left-none {
  1106. /*rtl:ignore*/
  1107. padding-left: 0 !important;
  1108. }
  1109. .padding-left-half {
  1110. /*rtl:ignore*/
  1111. padding-left: 16px !important;
  1112. }
  1113. .padding-left-default {
  1114. /*rtl:ignore*/
  1115. padding-left: 32px !important;
  1116. }
  1117. /**
  1118. * Full Site Editing
  1119. * - Full Site Editing overrides
  1120. */
  1121. @media (min-width: 600px) {
  1122. .a8c-template-editor .block-editor-block-list__layout .block-editor-block-list__block[data-align="full"] .block-editor-block-list__layout .block-editor-block-list__block[data-align="full"] {
  1123. margin-left: 0;
  1124. margin-right: 0;
  1125. }
  1126. }
  1127. .a8c-template-editor .block-editor-block-list__block-edit [data-block] {
  1128. margin: 12px 0 0 0;
  1129. }
  1130. .template-block .fse-template-part {
  1131. padding: 16px;
  1132. }
  1133. @media only screen and (min-width: 560px) {
  1134. .template-block .fse-template-part {
  1135. padding: 32px 0;
  1136. }
  1137. }
  1138. .template-block .fse-template-part figure.fse-site-logo {
  1139. width: auto;
  1140. }
  1141. .template-block .fse-template-part .block-list-appender {
  1142. display: none;
  1143. }
  1144. .template-block .fse-template-part .wp-block-column .block-editor-block-list__layout [data-type='a8c/site-title']:first-child .site-title {
  1145. margin-top: 0;
  1146. }
  1147. .fse-template-part .wp-block-cover .site-title,
  1148. .fse-template-part .wp-block-cover .site-description,
  1149. .fse-template-part .wp-block-cover-image .site-title,
  1150. .fse-template-part .wp-block-cover-image .site-description {
  1151. background: transparent;
  1152. color: inherit;
  1153. }
  1154. .fse-template-part .block-editor-block-list__layout .block-editor-block-list__block[data-align='full'] > .block-editor-block-list__block-edit figure.fse-site-logo {
  1155. width: auto;
  1156. }
  1157. .fse-template-part .wp-block-column {
  1158. width: 100%;
  1159. }
  1160. .fse-template-part .wp-block-columns .wp-block-column > * {
  1161. margin: 0 0 5px 0;
  1162. }
  1163. .fse-template-part .main-navigation {
  1164. color: #444444;
  1165. }
  1166. .fse-template-part .main-navigation > div {
  1167. display: none;
  1168. }
  1169. .fse-template-part .main-navigation #toggle-menu {
  1170. display: inline-block;
  1171. margin: 0;
  1172. }
  1173. .fse-template-part .main-navigation #toggle:checked ~ div:not(.woocommerce-menu-container) {
  1174. display: block;
  1175. }
  1176. .fse-template-part .main-navigation #toggle:focus + #toggle-menu {
  1177. background-color: indigo;
  1178. outline: inherit;
  1179. text-decoration: underline;
  1180. }
  1181. .fse-template-part .main-navigation .dropdown-icon.close {
  1182. display: none;
  1183. }
  1184. .fse-template-part .main-navigation #toggle:checked + #toggle-menu .open {
  1185. display: none;
  1186. }
  1187. .fse-template-part .main-navigation #toggle:checked + #toggle-menu .close {
  1188. display: inline;
  1189. }
  1190. @media only screen and (min-width: 560px) {
  1191. .fse-template-part .main-navigation > div {
  1192. display: inline-block;
  1193. }
  1194. .fse-template-part .main-navigation #toggle-menu {
  1195. display: none;
  1196. }
  1197. .fse-template-part .main-navigation > div > ul > li > ul {
  1198. display: none;
  1199. }
  1200. }
  1201. .fse-template-part .main-navigation > div > ul {
  1202. display: flex;
  1203. flex-wrap: wrap;
  1204. list-style: none;
  1205. margin: 0;
  1206. max-width: none;
  1207. padding-left: 0;
  1208. position: relative;
  1209. /* Sub-menus Flyout */
  1210. }
  1211. .fse-template-part .main-navigation > div > ul ul {
  1212. padding-left: 0;
  1213. }
  1214. .fse-template-part .main-navigation > div > ul li {
  1215. display: block;
  1216. position: relative;
  1217. width: 100%;
  1218. z-index: 1;
  1219. }
  1220. .fse-template-part .main-navigation > div > ul li:hover, .fse-template-part .main-navigation > div > ul li[focus-within] {
  1221. cursor: pointer;
  1222. z-index: 99999;
  1223. }
  1224. .fse-template-part .main-navigation > div > ul li:hover, .fse-template-part .main-navigation > div > ul li:focus-within {
  1225. cursor: pointer;
  1226. z-index: 99999;
  1227. }
  1228. @media only screen and (min-width: 560px) {
  1229. .fse-template-part .main-navigation > div > ul li {
  1230. display: inherit;
  1231. width: inherit;
  1232. /* Submenu display */
  1233. }
  1234. .fse-template-part .main-navigation > div > ul li:hover > ul,
  1235. .fse-template-part .main-navigation > div > ul li[focus-within] > ul,
  1236. .fse-template-part .main-navigation > div > ul li ul:hover,
  1237. .fse-template-part .main-navigation > div > ul li ul:focus {
  1238. visibility: visible;
  1239. opacity: 1;
  1240. display: block;
  1241. }
  1242. .fse-template-part .main-navigation > div > ul li:hover > ul,
  1243. .fse-template-part .main-navigation > div > ul li:focus-within > ul,
  1244. .fse-template-part .main-navigation > div > ul li ul:hover,
  1245. .fse-template-part .main-navigation > div > ul li ul:focus {
  1246. visibility: visible;
  1247. opacity: 1;
  1248. display: block;
  1249. }
  1250. }
  1251. @media only screen and (min-width: 560px) {
  1252. .fse-template-part .main-navigation > div > ul > li > a {
  1253. line-height: 1;
  1254. }
  1255. .fse-template-part .main-navigation > div > ul > li > a:before, .fse-template-part .main-navigation > div > ul > li > a:after {
  1256. content: '';
  1257. display: block;
  1258. height: 0;
  1259. width: 0;
  1260. }
  1261. .fse-template-part .main-navigation > div > ul > li > a:before {
  1262. margin-bottom: -0.12em;
  1263. }
  1264. .fse-template-part .main-navigation > div > ul > li > a:after {
  1265. margin-top: -0.11em;
  1266. }
  1267. .fse-template-part .main-navigation > div > ul > li:first-of-type > a {
  1268. padding-left: 0;
  1269. }
  1270. .fse-template-part .main-navigation > div > ul > li:last-of-type > a {
  1271. padding-right: 0;
  1272. }
  1273. }
  1274. .fse-template-part .main-navigation > div > ul > li > .sub-menu {
  1275. margin: 0;
  1276. position: relative;
  1277. }
  1278. @media only screen and (min-width: 560px) {
  1279. .fse-template-part .main-navigation > div > ul > li > .sub-menu {
  1280. background: white;
  1281. box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.2);
  1282. left: 0;
  1283. top: 100%;
  1284. min-width: max-content;
  1285. opacity: 0;
  1286. position: absolute;
  1287. transition: all 0.5s ease;
  1288. visibility: hidden;
  1289. }
  1290. }
  1291. .fse-template-part .main-navigation > div > ul > li > .sub-menu .sub-menu {
  1292. width: 100%;
  1293. }
  1294. .fse-template-part .main-navigation a {
  1295. color: blue;
  1296. display: block;
  1297. font-family: sans-serif;
  1298. font-family: var(--font-headings, sans-serif);
  1299. font-weight: bold;
  1300. padding: 8px 0;
  1301. }
  1302. @media only screen and (min-width: 560px) {
  1303. .fse-template-part .main-navigation a {
  1304. padding: 16px;
  1305. }
  1306. }
  1307. .fse-template-part .main-navigation a:link, .fse-template-part .main-navigation a:visited {
  1308. color: blue;
  1309. }
  1310. .fse-template-part .main-navigation a:hover {
  1311. color: indigo;
  1312. }
  1313. .fse-template-part .main-navigation .sub-menu {
  1314. list-style: none;
  1315. margin-left: 0;
  1316. /* Reset the counter for each UL */
  1317. counter-reset: nested-list;
  1318. }
  1319. .fse-template-part .main-navigation .sub-menu .menu-item a {
  1320. padding-top: 8px;
  1321. padding-bottom: 8px;
  1322. }
  1323. .fse-template-part .main-navigation .sub-menu .menu-item a::before {
  1324. /* Increment the dashes */
  1325. counter-increment: nested-list;
  1326. /* Insert dashes with spaces in between */
  1327. content: "– " counters(nested-list, "– ", none);
  1328. }
  1329. @media only screen and (min-width: 560px) {
  1330. .fse-template-part .main-navigation > div > ul > .menu-item-has-children > a::after {
  1331. content: "\00a0\25BC";
  1332. display: inline-block;
  1333. font-size: 0.69444rem;
  1334. height: inherit;
  1335. width: inherit;
  1336. }
  1337. }
  1338. .fse-template-part .main-navigation .hide-visually {
  1339. position: absolute !important;
  1340. clip: rect(1px, 1px, 1px, 1px);
  1341. padding: 0 !important;
  1342. border: 0 !important;
  1343. height: 1px !important;
  1344. width: 1px !important;
  1345. overflow: hidden;
  1346. }
  1347. .fse-template-part body:not(.fse-enabled) .main-navigation a {
  1348. font-size: 1.2rem;
  1349. }
  1350. .fse-template-part .main-navigation {
  1351. text-align: center;
  1352. /**
  1353. * Button Placeholder style
  1354. * - Since buttons appear in various blocks,
  1355. * let’s use a placeholder to keep them all
  1356. * in-sync
  1357. */
  1358. /**
  1359. * Onsale Placeholder style
  1360. * - Since buttons appear in various blocks,
  1361. * let’s use a placeholder to keep them all
  1362. * in-sync
  1363. */
  1364. }
  1365. .fse-template-part .main-navigation .alignwide, .fse-template-part .main-navigation .alignfull {
  1366. width: 100%;
  1367. }
  1368. .fse-template-part .main-navigation .button {
  1369. line-height: 1;
  1370. color: white;
  1371. cursor: pointer;
  1372. font-weight: bold;
  1373. font-family: sans-serif;
  1374. font-family: var(--font-headings, sans-serif);
  1375. font-size: 1.2rem;
  1376. background-color: blue;
  1377. border-radius: 9px;
  1378. border-width: 0;
  1379. text-decoration: none;
  1380. padding: 16px 16px;
  1381. }
  1382. .fse-template-part .main-navigation .button:before, .fse-template-part .main-navigation .button:after {
  1383. content: '';
  1384. display: block;
  1385. height: 0;
  1386. width: 0;
  1387. }
  1388. .fse-template-part .main-navigation .button:before {
  1389. margin-bottom: -0.12em;
  1390. }
  1391. .fse-template-part .main-navigation .button:after {
  1392. margin-top: -0.11em;
  1393. }
  1394. .fse-template-part .main-navigation .button:hover, .fse-template-part .main-navigation .button:focus, .fse-template-part .main-navigation .has-focus.button {
  1395. color: white;
  1396. background-color: indigo;
  1397. }
  1398. .fse-template-part .main-navigation .main-menu.footer-menu li a {
  1399. font-size: inherit;
  1400. }
  1401. .fse-template-part .main-navigation .main-menu.footer-menu li.menu-item-has-children > a::after {
  1402. font-size: 0.6em;
  1403. vertical-align: middle;
  1404. }
  1405. .fse-template-part .main-navigation .has-text-color > .main-menu.footer-menu > li > a {
  1406. color: inherit;
  1407. }
  1408. .fse-template-part .main-navigation .has-text-align-left > .main-menu.footer-menu {
  1409. justify-content: flex-start;
  1410. }
  1411. .fse-template-part .main-navigation .has-text-align-center > .main-menu.footer-menu {
  1412. justify-content: center;
  1413. }
  1414. .fse-template-part .main-navigation .has-text-align-right > .main-menu.footer-menu {
  1415. justify-content: flex-end;
  1416. }
  1417. .fse-template-part .main-navigation .has-background > .main-menu.footer-menu {
  1418. padding: 16px;
  1419. }
  1420. @media only screen and (min-width: 560px) {
  1421. .a8c-template-editor.fse-header .block-editor-block-list__layout > .block-editor-block-list__block.is-selected:first-child[data-align='full'] > .block-editor-block-list__block-edit > [data-block] {
  1422. margin-top: 14px;
  1423. }
  1424. .a8c-template-editor.fse-header .block-editor-block-list__layout > .block-editor-block-list__block:not(.is-selected):first-child[data-align='full'] > .block-editor-block-list__block-edit > [data-block] {
  1425. margin-top: 0;
  1426. }
  1427. }
  1428. .template-block .fse-header .block-editor-block-list__layout > .block-editor-block-list__block:first-child[data-align='full'] {
  1429. margin-top: -16px;
  1430. }
  1431. @media only screen and (min-width: 560px) {
  1432. .template-block .fse-header .block-editor-block-list__layout > .block-editor-block-list__block:first-child[data-align='full'] {
  1433. margin-top: -32px;
  1434. }
  1435. }
  1436. .post-content__block {
  1437. margin-bottom: 160px;
  1438. margin-top: 36px;
  1439. z-index: 20;
  1440. }