[Summary view] [Print] [Text view]

   1  /*
   2  Theme Name: Twenty Sixteen
   3  Description: Used to style blocks in the editor.
   4  */
   5  
   6  /*--------------------------------------------------------------
   7  >>> TABLE OF CONTENTS:
   8  ----------------------------------------------------------------
   9  1.0 General Typography
  10  2.0 General Block Styles
  11  3.0 Blocks - Common Blocks
  12  4.0 Blocks - Formatting
  13  5.0 Blocks - Layout Elements
  14  6.0 Blocks - Widgets
  15  7.0 Blocks - Colors
  16  --------------------------------------------------------------*/
  17  
  18  /*--------------------------------------------------------------
  19  1.0 General Typography
  20  --------------------------------------------------------------*/
  21  
  22  .edit-post-visual-editor .editor-block-list__block,
  23  .editor-default-block-appender textarea.editor-default-block-appender__content {
  24      font-family: Merriweather, Georgia, serif;
  25      font-size: 16px;
  26      font-size: 1rem;
  27      line-height: 1.75;
  28  }
  29  
  30  .rtl .editor-styles-wrapper {
  31      font-family: Arial, Tahoma, sans-serif;
  32  }
  33  
  34  .edit-post-visual-editor .editor-block-list__block {
  35      color: #1a1a1a;
  36  }
  37  
  38  .editor-post-title__block .editor-post-title__input {
  39      font-family: Montserrat, "Helvetica Neue", sans-serif;
  40      font-size: 28px;
  41      font-size: 1.75rem;
  42      font-weight: 700;
  43      line-height: 1.25;
  44      margin-bottom: 1em;
  45  }
  46  
  47  .edit-post-visual-editor h1 {
  48      font-size: 28px;
  49      font-size: 1.75rem;
  50      line-height: 1.25;
  51      margin-top: 2em;
  52      margin-bottom: 1em;
  53  }
  54  
  55  .edit-post-visual-editor h2 {
  56      font-size: 23px;
  57      font-size: 1.4375rem;
  58      line-height: 1.2173913043;
  59      margin-top: 2.4347826087em;
  60      margin-bottom: 1.2173913043em;
  61  }
  62  
  63  .edit-post-visual-editor h3 {
  64      font-size: 19px;
  65      font-size: 1.1875rem;
  66      line-height: 1.1052631579;
  67      margin-top: 2.9473684211em;
  68      margin-bottom: 1.4736842105em;
  69  }
  70  
  71  .edit-post-visual-editor h4,
  72  .edit-post-visual-editor h5,
  73  .edit-post-visual-editor h6 {
  74      font-size: 16px;
  75      font-size: 1rem;
  76      line-height: 1.3125;
  77      margin-top: 3.5em;
  78      margin-bottom: 1.75em;
  79  }
  80  
  81  .edit-post-visual-editor h4 {
  82      letter-spacing: 0.140625em;
  83      text-transform: uppercase;
  84  }
  85  
  86  .edit-post-visual-editor h6 {
  87      font-style: italic;
  88  }
  89  
  90  .edit-post-visual-editor h1,
  91  .edit-post-visual-editor h2,
  92  .edit-post-visual-editor h3,
  93  .edit-post-visual-editor h4,
  94  .edit-post-visual-editor h5,
  95  .edit-post-visual-editor h6 {
  96      font-weight: 900;
  97  }
  98  
  99  @media screen and (min-width: 61.5625em) {
 100      .edit-post-visual-editor h1 {
 101          font-size: 33px;
 102          font-size: 2.0625rem;
 103          line-height: 1.2727272727;
 104          margin-top: 1.696969697em;
 105          margin-bottom: 0.8484848485em;
 106      }
 107  
 108      .edit-post-visual-editor h2 {
 109          font-size: 28px;
 110          font-size: 1.75rem;
 111          line-height: 1.25;
 112          margin-top: 2em;
 113          margin-bottom: 1em;
 114      }
 115  
 116      .edit-post-visual-editor h3 {
 117          font-size: 23px;
 118          font-size: 1.4375rem;
 119          line-height: 1.2173913043;
 120          margin-top: 2.4347826087em;
 121          margin-bottom: 1.2173913043em;
 122      }
 123  
 124      .edit-post-visual-editor h4 {
 125          letter-spacing: 0.131578947em;
 126      }
 127  
 128      .edit-post-visual-editor h4,
 129      .edit-post-visual-editor h5,
 130      .edit-post-visual-editor h6 {
 131          font-size: 19px;
 132          font-size: 1.1875rem;
 133          line-height: 1.1052631579;
 134          margin-top: 2.9473684211em;
 135          margin-bottom: 1.473684211em;
 136      }
 137  }
 138  
 139  .edit-post-visual-editor h1:first-child,
 140  .edit-post-visual-editor h2:first-child,
 141  .edit-post-visual-editor h3:first-child,
 142  .edit-post-visual-editor h4:first-child,
 143  .edit-post-visual-editor h5:first-child,
 144  .edit-post-visual-editor h6:first-child {
 145      margin-top: 0;
 146  }
 147  
 148  .edit-post-visual-editor p {
 149      margin: 0 0 1.75em;
 150  }
 151  
 152  .edit-post-visual-editor blockquote p {
 153      margin-bottom: 1.4736842105em;
 154  }
 155  
 156  @media screen and (min-width: 44.375em) {
 157      .editor-post-title__block .editor-post-title__input {
 158          font-size: 33px;
 159          font-size: 2.0625rem;
 160          line-height: 1.2727272727;
 161          margin-bottom: 0.8484848485em;
 162      }
 163  }
 164  
 165  @media screen and (min-width: 61.5625em) {
 166      .editor-post-title__block .editor-post-title__input {
 167          font-size: 40px;
 168          font-size: 2.5rem;
 169          line-height: 1.225;
 170          margin-bottom: 1.05em;
 171      }
 172  }
 173  
 174  /*--------------------------------------------------------------
 175  2.0 General Block Styles
 176  --------------------------------------------------------------*/
 177  
 178  /* Main column width */
 179  
 180  .editor-styles-wrapper {
 181      max-width: 100% !important; /* Override where editor-style.css is affecting this */
 182  }
 183  
 184  .wp-block {
 185      max-width: 630px; /* 600px + 30px to account for padding. */
 186  }
 187  
 188  /* Link styles */
 189  
 190  .edit-post-visual-editor a,
 191  .editor-block-list__block a,
 192  .wp-block-freeform.block-library-rich-text__tinymce a {
 193      color: #007acc;
 194  }
 195  
 196  /* List styles */
 197  
 198  .edit-post-visual-editor ul:not(.wp-block-gallery),
 199  .editor-block-list__block ul:not(.wp-block-gallery),
 200  .block-library-list ul,
 201  .edit-post-visual-editor ol,
 202  .editor-block-list__block ol,
 203  .block-library-list ol {
 204      padding: 0;
 205  }
 206  
 207  .edit-post-visual-editor ul:not(.wp-block-gallery),
 208  .editor-block-list__block ul:not(.wp-block-gallery),
 209  .block-library-list ul {
 210      list-style: disc;
 211  }
 212  
 213  .edit-post-visual-editor ol,
 214  .editor-block-list__block ol,
 215  .block-library-list ol {
 216      list-style: decimal;
 217      margin-left: 1.5em;
 218  }
 219  
 220  .edit-post-visual-editor ul:not(.wp-block-gallery) li,
 221  .editor-block-list__block ul:not(.wp-block-gallery) li,
 222  .edit-post-visual-editor ol li,
 223  .editor-block-list__block ol li,
 224  .block-library-list li {
 225      margin-bottom: 0;
 226  }
 227  
 228  .edit-post-visual-editor ul:not(.wp-block-gallery) li > ul,
 229  .editor-block-list__block ul:not(.wp-block-gallery) li > ul,
 230  .block-library-list li > ul,
 231  .edit-post-visual-editor li > ol,
 232  .editor-block-list__block li > ol,
 233  .block-library-list li > ol {
 234      margin-bottom: 0;
 235  }
 236  
 237  .rtl .editor-styles-wrapper ul ul,
 238  .rtl .editor-styles-wrapper ol ol,
 239  .rtl .editor-styles-wrapper ul ol,
 240  .rtl .editor-styles-wrapper ol ul {
 241      margin-left: 0;
 242      margin-right: 1.5em;
 243  }
 244  
 245  .wp-block-freeform.block-library-rich-text__tinymce ul,
 246  .wp-block-freeform.block-library-rich-text__tinymce ol {
 247      padding-left: 1.5em;
 248  }
 249  
 250  .rtl .wp-block-freeform.block-library-rich-text__tinymce ul,
 251  .rtl .wp-block-freeform.block-library-rich-text__tinymce ol {
 252      padding: 0;
 253  }
 254  
 255  .editor-styles-wrapper ol.has-background,
 256  .editor-styles-wrapper ul.has-background {
 257      padding: 1.25em 2.375em;
 258  }
 259  
 260  /* Quotes */
 261  
 262  .rtl .editor-block-list__block blockquote {
 263      border-left: 0;
 264      padding-left: 0;
 265  }
 266  
 267  /* Captions */
 268  
 269  figure[class*="wp-block-"] > figcaption {
 270      color: #686868;
 271      font-style: italic;
 272      line-height: 1.6153846154;
 273      padding-top: 0.5384615385em;
 274      text-align: start;
 275  }
 276  
 277  /*--------------------------------------------------------------
 278  3.0 Blocks - Common Blocks
 279  --------------------------------------------------------------*/
 280  
 281  /* Paragraph */
 282  
 283  .wp-block-paragraph.has-drop-cap:not(:focus)::first-letter {
 284      font-size: 5em;
 285      line-height: 0.68;
 286      margin: 0.05em 0.1em 0 0;
 287      text-transform: uppercase;
 288      font-style: normal;
 289  }
 290  
 291  .rtl .wp-block-paragraph.has-drop-cap:not(:focus)::first-letter {
 292      margin: 0.05em 0 0 0.1em;
 293  }
 294  
 295  /* Quote */
 296  
 297  .wp-block-quote {
 298      border: 0 solid #1a1a1a;
 299      border-left-width: 4px;
 300      color: #686868;
 301      font-style: italic;
 302      line-height: 1.4736842105;
 303      margin: 0 0 1.4736842105em;
 304      overflow: hidden;
 305      padding: 0 0 0 1.263157895em;
 306  }
 307  
 308  .editor-styles-wrapper .wp-block-quote {
 309      border-color: currentColor;
 310  }
 311  
 312  .wp-block-quote:not(.is-large):not(.is-style-large).alignleft,
 313  .wp-block-quote:not(.is-large):not(.is-style-large).alignright {
 314      border-left: 0;
 315      padding-left: 0;
 316  }
 317  
 318  .editor-block-list__block .wp-block-quote p {
 319      font-size: 19px;
 320      font-size: 1.1875rem;
 321      margin-bottom: 1.4736842105em;
 322  }
 323  
 324  .wp-block-quote__citation {
 325      color: #1a1a1a;
 326      display: block;
 327      font-size: 16px;
 328      font-size: 1rem;
 329      line-height: 1.75;
 330  }
 331  
 332  .wp-block-quote.has-text-color .wp-block-quote__citation {
 333      color: inherit;
 334  }
 335  
 336  .wp-block-quote__citation:before {
 337      content: "\2014\00a0";
 338  }
 339  
 340  .wp-block-quote em,
 341  .wp-block-quote i,
 342  .wp-block-quote__citation:before {
 343      font-style: normal;
 344  }
 345  
 346  .wp-block-quote strong,
 347  .wp-block-quote b {
 348      font-weight: 400;
 349  }
 350  
 351  .wp-block-quote > :last-child {
 352      margin-bottom: 0;
 353  }
 354  
 355  .wp-block-quote.alignleft {
 356      margin: 0.3157894737em 1.4736842105em 1.473684211em 0;
 357  }
 358  
 359  .wp-block-quote.alignright {
 360      margin: 0.3157894737em 0 1.473684211em 1.4736842105em;
 361  }
 362  
 363  .wp-block-quote.aligncenter {
 364      margin-bottom: 1.473684211em;
 365  }
 366  
 367  .rtl .wp-block-quote:not(.is-large):not(.is-style-large).alignleft,
 368  .rtl .wp-block-quote:not(.is-large):not(.is-style-large).alignright  {
 369      border-right: 0;
 370      padding-right: 0;
 371  }
 372  
 373  .wp-block-quote.is-style-plain {
 374      border: none;
 375  }
 376  
 377  @media screen and (min-width: 44.375em) {
 378      .wp-block-quote.alignleft,
 379      .wp-block-quote.alignright {
 380          border-width: 4px 0 0 0;
 381          padding: 0.9473684211em 0 0;
 382          width: -webkit-calc(50% - 0.736842105em);
 383          width: calc(50% - 0.736842105em);
 384      }
 385  }
 386  
 387  @media screen and (min-width: 80em) {
 388      .editor-block-list__block .wp-block-quote.alignleft {
 389          margin-left: -40%;
 390          width: -webkit-calc(60% - 1.4736842105em);
 391          width: calc(60% - 1.4736842105em);
 392      }
 393  }
 394  
 395  /* File */
 396  
 397  .wp-block-file__textlink {
 398      box-shadow: 0 1px 0 0 currentColor;
 399      color: #007acc;
 400  }
 401  
 402  .wp-block-file .wp-block-file__button {
 403      background: #1a1a1a;
 404      border: 0;
 405      border-radius: 2px;
 406      color: #fff;
 407      font-family: Montserrat, "Helvetica Neue", sans-serif;
 408      font-weight: 700;
 409      letter-spacing: 0.046875em;
 410      line-height: 1;
 411      padding: 0.84375em 0.875em 0.78125em;
 412      text-transform: uppercase;
 413  }
 414  
 415  /*--------------------------------------------------------------
 416  4.0 Blocks - Formatting
 417  --------------------------------------------------------------*/
 418  
 419  /* Code */
 420  
 421  .editor-styles-wrapper .wp-block-code {
 422      border: 0;
 423      font-family: Inconsolata, monospace;
 424      line-height: 1.75;
 425      padding: 0;
 426      background-color: #d1d1d1;
 427  }
 428  
 429  /* Classic */
 430  
 431  .wp-block-freeform.block-library-rich-text__tinymce blockquote {
 432      border: 0 solid #1a1a1a;
 433      border-left-width: 4px;
 434      color: #686868;
 435      font-style: italic;
 436      line-height: 1.4736842105;
 437      margin: 0 0 1.4736842105em;
 438      overflow: hidden;
 439      padding: 0 0 0 1.263157895em;
 440  }
 441  
 442  .editor-block-list__block .wp-block-freeform.block-library-rich-text__tinymce blockquote:not(.alignleft):not(.alignright) {
 443      margin-left: 0;
 444  }
 445  
 446  .wp-block-freeform.block-library-rich-text__tinymce blockquote p {
 447      font-size: 19px;
 448      font-size: 1.1875rem;
 449  }
 450  
 451  .wp-block-freeform.block-library-rich-text__tinymce blockquote cite {
 452      color: #1a1a1a;
 453      display: block;
 454      font-size: 16px;
 455      font-size: 1rem;
 456      font-style: normal;
 457      line-height: 1.75;
 458  }
 459  
 460  .wp-block-freeform.block-library-rich-text__tinymce blockquote cite:before {
 461      content: "\2014\00a0";
 462  }
 463  
 464  .wp-block-freeform.block-library-rich-text__tinymce blockquote.alignleft {
 465      margin: 0.3157894737em 1.4736842105em 1.473684211em 0;
 466  }
 467  
 468  .wp-block-freeform.block-library-rich-text__tinymce blockquote.alignright {
 469      margin: 0.3157894737em 0 1.473684211em 1.4736842105em;
 470  }
 471  
 472  .wp-block-freeform.block-library-rich-text__tinymce blockquote.aligncenter {
 473      margin-bottom: 1.473684211em;
 474  }
 475  
 476  @media screen and (min-width: 44.375em) {
 477      .wp-block-freeform.block-library-rich-text__tinymce blockquote.alignleft,
 478      .wp-block-freeform.block-library-rich-text__tinymce blockquote.alignright {
 479          border-width: 4px 0 0 0;
 480          padding: 0.9473684211em 0 0;
 481          width: -webkit-calc(50% - 0.736842105em);
 482          width: calc(50% - 0.736842105em);
 483      }
 484  }
 485  
 486  .rtl .wp-block-freeform.block-library-rich-text__tinymce blockquote {
 487      border-left-width: 0;
 488      border-right-width: 4px;
 489      overflow: hidden;
 490      padding-left: 0;
 491      padding-right: 1.263157895em;
 492  }
 493  
 494  .rtl .wp-block-freeform.block-library-rich-text__tinymce .alignleft {
 495      float: left;
 496  }
 497  
 498  .rtl .wp-block-freeform.block-library-rich-text__tinymce .alignright {
 499      float: right;
 500  }
 501  
 502  .rtl .wp-block-freeform.block-library-rich-text__tinymce blockquote.alignleft {
 503      margin: 0.3157894737em 0 1.473684211em 1.4736842105em;
 504  }
 505  
 506  .rtl .wp-block-freeform.block-library-rich-text__tinymce blockquote.alignright {
 507      margin: 0.3157894737em 1.4736842105em 1.473684211em 0;
 508  }
 509  
 510  /* Pullquote */
 511  
 512  .editor-styles-wrapper .wp-block-pullquote blockquote {
 513      border: 0;
 514      margin: 0;
 515      padding: 0;
 516  }
 517  
 518  .editor-styles-wrapper .wp-block-pullquote:where([style*="border-width"]) blockquote {
 519      padding-left: 1rem;
 520      padding-right: 1rem;
 521  }
 522  
 523  .wp-block-pullquote blockquote > .editor-rich-text p {
 524      font-size: 19px;
 525      font-size: 1.1875rem;
 526  }
 527  
 528  .wp-block-pullquote .wp-block-pullquote__citation {
 529      color: #1a1a1a;
 530      display: block;
 531      font-size: 16px;
 532      font-size: 1rem;
 533      font-style: italic;
 534      line-height: 1.75;
 535      text-transform: none;
 536  }
 537  
 538  .wp-block-pullquote.has-text-color blockquote,
 539  .wp-block-pullquote.has-background blockquote,
 540  .has-background .wp-block-pullquote blockquote,
 541  .wp-block-pullquote.has-text-color cite {
 542      color: inherit;
 543  }
 544  
 545  .wp-block-pullquote[class*="-font-size"] blockquote,
 546  .wp-block-pullquote[class*="-font-size"] blockquote p,
 547  .wp-block-pullquote[class*="-font-size"] cite,
 548  .wp-block-pullquote[style*="font-size"] blockquote,
 549  .wp-block-pullquote[style*="font-size"] blockquote p,
 550  .wp-block-pullquote[style*="font-size"] cite {
 551      font-size: inherit;
 552  }
 553      
 554  .wp-block-pullquote[style*="line-height"] blockquote,
 555  .wp-block-pullquote[style*="line-height"] blockquote p,
 556  .wp-block-pullquote[style*="line-height"] cite {
 557      line-height: inherit;
 558  }
 559  
 560  .wp-block-pullquote .wp-block-pullquote__citation:before {
 561      content: "\2014\00a0";
 562  }
 563  
 564  /* Table */
 565  
 566  .editor-block-list__block table.wp-block-table th,
 567  .editor-block-list__block table.wp-block-table td {
 568      padding: 0;
 569  }
 570  
 571  .rtl .wp-block-table th,
 572  .rtl .wp-block-table td {
 573      text-align: right;
 574  }
 575  
 576  /*--------------------------------------------------------------
 577  5.0 Blocks - Layout Elements
 578  --------------------------------------------------------------*/
 579  
 580  /* Buttons */
 581  
 582  .wp-block-buttons {
 583      font-weight: 700;
 584      letter-spacing: 0.046875em;
 585      line-height: 1;
 586      text-transform: uppercase;
 587  }
 588  
 589  .wp-block-button .wp-block-button__link {
 590      box-shadow: none;
 591      font-family: Montserrat, "Helvetica Neue", sans-serif;
 592      padding: 0.84375em 1.3125em 0.78125em;
 593  }
 594  
 595  .wp-block-button__link {
 596      background: #1a1a1a;
 597      color: #fff;
 598  }
 599  
 600  .is-style-outline .wp-block-button__link {
 601      color: #1a1a1a;
 602  }
 603  
 604  /* Media & Text */
 605  
 606  .wp-block-media-text *:last-child {
 607      margin-bottom: 0;
 608  }
 609  
 610  /*--------------------------------------------------------------
 611  6.0 Blocks - Widgets
 612  --------------------------------------------------------------*/
 613  
 614  /* Archives, Categories & Latest Posts */
 615  
 616  [data-align="center"] .wp-block-archives ul,
 617  [data-align="center"] .wp-block-categories ul,
 618  [data-align="center"] .wp-block-latest-posts ul {
 619      list-style-position: inside;
 620  }
 621  
 622  /* Latest Comments */
 623  
 624  .editor-styles-wrapper .wp-block-latest-comments__comment-meta a {
 625      box-shadow: none;
 626      font-weight: 700;
 627      text-decoration: none;
 628  }
 629  
 630  .wp-block-latest-comments__comment-date {
 631      color: #686868;
 632      font-family: Montserrat, "Helvetica Neue", sans-serif;
 633      font-size: 13px;
 634      font-size: 0.8125rem;
 635      line-height: 1.6153846154;
 636  }
 637  
 638  .wp-block-latest-comments .wp-block-latest-comments__comment:not(:first-child) {
 639      border-top: 1px solid #d1d1d1;
 640      margin-bottom: 0;
 641      padding: 1.75em 0;
 642  }
 643  
 644  .wp-block-latest-comments__comment-excerpt p:last-child {
 645      margin-bottom: 0;
 646  }
 647  
 648  /* Latest Posts */
 649  
 650  .edit-post-visual-editor .wp-block-latest-posts.is-grid {
 651      list-style: none;
 652      margin-left: 0;
 653      margin-right: 0;
 654  }
 655  
 656  .edit-post-visual-editor .wp-block-latest-posts.is-grid li {
 657      margin-bottom: 16px;
 658  }
 659  
 660  /* Avatar & Post Author */
 661  
 662  .editor-styles-wrapper .avatar,
 663  .wp-block-post-author__avatar img {
 664      border-radius: 50%;
 665  }
 666  
 667  /*--------------------------------------------------------------
 668  7.0 Blocks - Colors
 669  --------------------------------------------------------------*/
 670  
 671  :root .editor-styles-wrapper .has-dark-gray-color {
 672      color: #1a1a1a;
 673  }
 674  
 675  :root .editor-styles-wrapper .has-dark-gray-background-color {
 676      background-color: #1a1a1a;
 677  }
 678  
 679  :root .editor-styles-wrapper .has-medium-gray-color {
 680      color: #686868;
 681  }
 682  
 683  :root .editor-styles-wrapper .has-medium-gray-background-color {
 684      background-color: #686868;
 685  }
 686  
 687  :root .editor-styles-wrapper .has-light-gray-color {
 688      color: #e5e5e5;
 689  }
 690  
 691  :root .editor-styles-wrapper .has-light-gray-background-color {
 692      background-color: #e5e5e5;
 693  }
 694  
 695  :root .editor-styles-wrapper .has-white-color {
 696      color: #fff;
 697  }
 698  
 699  :root .editor-styles-wrapper .has-white-background-color {
 700      background-color: #fff;
 701  }
 702  
 703  :root .editor-styles-wrapper .has-blue-gray-color {
 704      color: #4d545c;
 705  }
 706  
 707  :root .editor-styles-wrapper .has-blue-gray-background-color {
 708      background-color: #4d545c;
 709  }
 710  
 711  :root .editor-styles-wrapper .has-bright-blue-color {
 712      color: #007acc;
 713  }
 714  
 715  :root .editor-styles-wrapper .has-bright-blue-background-color {
 716      background-color: #007acc;
 717  }
 718  
 719  :root .editor-styles-wrapper .has-light-blue-color {
 720      color: #9adffd;
 721  }
 722  
 723  :root .editor-styles-wrapper .has-light-blue-background-color {
 724      background-color: #9adffd;
 725  }
 726  
 727  :root .editor-styles-wrapper .has-dark-brown-color {
 728      color: #402b30;
 729  }
 730  
 731  :root .editor-styles-wrapper .has-dark-brown-background-color {
 732      background-color: #402b30;
 733  }
 734  
 735  :root .editor-styles-wrapper .has-medium-brown-color {
 736      color: #774e24;
 737  }
 738  
 739  :root .editor-styles-wrapper .has-medium-brown-background-color {
 740      background-color: #774e24;
 741  }
 742  
 743  :root .editor-styles-wrapper .has-dark-red-color {
 744      color: #640c1f;
 745  }
 746  
 747  :root .editor-styles-wrapper .has-dark-red-background-color {
 748      background-color: #640c1f;
 749  }
 750  
 751  :root .editor-styles-wrapper .has-bright-red-color {
 752      color: #ff675f;
 753  }
 754  
 755  :root .editor-styles-wrapper .has-bright-red-background-color {
 756      background-color: #ff675f;
 757  }
 758  
 759  :root .editor-styles-wrapper .has-yellow-color {
 760      color: #ffef8e;
 761  }
 762  
 763  :root .editor-styles-wrapper .has-yellow-background-color {
 764      background-color: #ffef8e;
 765  }