[Summary view] [Print] [Text view]

   1  /*
   2  Theme Name: Twenty Thirteen
   3  Description: Used to style the TinyMCE editor.
   4  */
   5  
   6  
   7  /**
   8   * Table of Contents:
   9   *
  10   * 1.0 - Body
  11   * 2.0 - Headings
  12   * 3.0 - Text Elements
  13   * 4.0 - Links
  14   * 5.0 - Alignment
  15   * 6.0 - Tables
  16   * 7.0 - Images
  17   * 8.0 - Galleries
  18   * 9.0 - Audio/Video
  19   * 10.0 - Post Formats
  20   * 11.0 - RTL
  21   * ----------------------------------------------------------------------------
  22   */
  23  
  24  
  25  /**
  26   * 1.0 Body
  27   * ----------------------------------------------------------------------------
  28   */
  29  
  30  html .mceContentBody {
  31      font-size: 100%;
  32      max-width: 604px;
  33  }
  34  
  35  body {
  36      color: #141412;
  37      font-family: "Source Sans Pro", Helvetica, sans-serif;
  38      line-height: 1.5;
  39      text-rendering: optimizeLegibility;
  40      vertical-align: baseline;
  41  }
  42  
  43  /* Custom gradient block backgrounds */
  44  .has-autumn-brown-gradient-background {
  45      background: linear-gradient(135deg, rgba(226,45,15,1) 0%, rgba(158,25,13,1) 100%);
  46  }
  47  .has-sunset-yellow-gradient-background {
  48      background: linear-gradient(135deg, rgba(233,139,41,1) 0%, rgba(238,179,95,1) 100%);
  49  }
  50  .has-light-sky-gradient-background {
  51      background: linear-gradient(135deg,rgba(228,228,228,1.0) 0%,rgba(208,225,252,1.0) 100%);
  52  }
  53  .has-dark-sky-gradient-background {
  54      background: linear-gradient(135deg,rgba(0,0,0,1.0) 0%,rgba(56,61,69,1.0) 100%);
  55  }
  56  
  57  /**
  58   * 2.0 Headings
  59   * ----------------------------------------------------------------------------
  60   */
  61  
  62  h1,
  63  h2,
  64  h3,
  65  h4,
  66  h5,
  67  h6 {
  68      clear: both;
  69      font-family: Bitter, Georgia, serif;
  70      line-height: 1.3;
  71  }
  72  
  73  h1 {
  74      font-size: 48px;
  75      margin: 33px 0;
  76  }
  77  
  78  h2 {
  79      font-size: 30px;
  80      margin: 25px 0;
  81  }
  82  
  83  h3 {
  84      font-size: 22px;
  85      margin: 22px 0;
  86  }
  87  
  88  h4 {
  89      font-size: 20px;
  90      margin: 25px 0;
  91  }
  92  
  93  h5 {
  94      font-size: 18px;
  95      margin: 30px 0;
  96  }
  97  
  98  h6 {
  99      font-size: 16px;
 100      margin: 36px 0;
 101  }
 102  
 103  hr {
 104      background: url(../images/dotted-line.png) repeat center top;
 105      background-size: 4px 4px;
 106      border: 0;
 107      height: 1px;
 108      margin: 0 0 24px;
 109  }
 110  
 111  
 112  /**
 113   * 3.0 Text Elements
 114   * ----------------------------------------------------------------------------
 115   */
 116  
 117  p {
 118      margin: 0 0 24px;
 119  }
 120  
 121  ol,
 122  ul {
 123      margin: 16px 0;
 124      padding: 0 0 0 40px;
 125  }
 126  
 127  ul {
 128      list-style-type: square;
 129  }
 130  
 131  ol {
 132      list-style: decimal outside;
 133  }
 134  
 135  li > ul,
 136  li > ol {
 137      margin: 0;
 138  }
 139  
 140  dl {
 141      margin: 0 20px;
 142  }
 143  
 144  dt {
 145      font-weight: bold;
 146  }
 147  
 148  dd {
 149      margin: 0 0 20px;
 150  }
 151  
 152  strong {
 153      font-weight: bold;
 154  }
 155  
 156  code,
 157  kbd,
 158  pre,
 159  samp {
 160      font-family: monospace, serif;
 161      font-size: 14px;
 162  }
 163  
 164  pre {
 165      background: #f5f5f5;
 166      color: #666;
 167      font-family: monospace;
 168      font-size: 14px;
 169      margin: 20px 0;
 170      overflow: auto;
 171      padding: 20px;
 172      white-space: pre;
 173      white-space: pre-wrap;
 174      word-wrap: break-word;
 175  }
 176  
 177  blockquote,
 178  q {
 179      quotes: none;
 180  }
 181  
 182  blockquote:before,
 183  blockquote:after,
 184  q:before,
 185  q:after {
 186      content: "";
 187      content: none;
 188  }
 189  
 190  blockquote {
 191      font-size: 24px;
 192      font-style: italic;
 193      font-weight: 300;
 194      margin: 24px 40px;
 195  }
 196  
 197  blockquote blockquote {
 198      margin-right: 0;
 199  }
 200  
 201  blockquote cite,
 202  blockquote small {
 203      font-size: 14px;
 204      font-weight: normal;
 205      text-transform: uppercase;
 206  }
 207  
 208  cite {
 209      border-bottom: 0;
 210  }
 211  
 212  abbr[title] {
 213      border-bottom: 1px dotted;
 214  }
 215  
 216  address {
 217      font-style: italic;
 218      margin: 0 0 24px;
 219  }
 220  
 221  del {
 222      color: #333;
 223  }
 224  
 225  ins {
 226      background: #fff9c0;
 227      border: none;
 228      color: #333;
 229      text-decoration: none;
 230  }
 231  
 232  sub,
 233  sup {
 234      font-size: 75%;
 235      line-height: 0;
 236      position: relative;
 237      vertical-align: baseline;
 238  }
 239  
 240  sup {
 241      top: -0.5em;
 242  }
 243  
 244  sub {
 245      bottom: -0.25em;
 246  }
 247  
 248  
 249  /**
 250   * 4.0 Links
 251   * ----------------------------------------------------------------------------
 252   */
 253  
 254  a {
 255      color: #ca3c08;
 256      text-decoration: none;
 257  }
 258  
 259  a:visited {
 260      color: #ac0404;
 261  }
 262  
 263  a:focus {
 264      outline: thin dotted;
 265  }
 266  
 267  a:active,
 268  a:hover {
 269      color: #ea9629;
 270      outline: 0;
 271  }
 272  
 273  a:hover {
 274      text-decoration: underline;
 275  }
 276  
 277  
 278  /**
 279   * 5.0 Alignment
 280   * ----------------------------------------------------------------------------
 281   */
 282  
 283  .alignleft {
 284      float: left;
 285      margin: 5px 20px 5px 0;
 286  }
 287  
 288  .alignright {
 289      float: right;
 290      margin: 5px 0 5px 20px;
 291  }
 292  
 293  .aligncenter {
 294      display: block;
 295      margin: 5px auto;
 296  }
 297  
 298  img.alignnone {
 299      margin: 5px 0;
 300  }
 301  
 302  
 303  /**
 304   * 6.0 Tables
 305   * ----------------------------------------------------------------------------
 306   */
 307  
 308  table {
 309      border-bottom: 1px solid #ededed;
 310      border-collapse: collapse;
 311      border-spacing: 0;
 312      font-size: 14px;
 313      line-height: 2;
 314      margin: 0 0 20px;
 315      width: 100%;
 316  }
 317  
 318  caption,
 319  th,
 320  td {
 321      font-weight: normal;
 322      text-align: left;
 323  }
 324  
 325  caption {
 326      font-size: 16px;
 327      margin: 20px 0;
 328  }
 329  
 330  th {
 331      font-weight: bold;
 332      text-transform: uppercase;
 333  }
 334  
 335  td {
 336      border-top: 1px solid #ededed;
 337      padding: 6px 10px 6px 0;
 338  }
 339  
 340  
 341  /**
 342   * 7.0 Images
 343   * ----------------------------------------------------------------------------
 344   */
 345  
 346  img {
 347      height: auto;
 348      max-width: 100%;
 349      vertical-align: middle;
 350  }
 351  
 352  .wp-caption {
 353      background: transparent;
 354      border: none;
 355      margin: 0;
 356      padding: 0;
 357      text-align: left;
 358  }
 359  
 360  .html5-captions .wp-caption {
 361      padding: 0;
 362  }
 363  
 364  .wp-caption.alignleft {
 365      margin: 5px 10px 5px 0;
 366  }
 367  
 368  .html5-captions .wp-caption.alignleft {
 369      margin-right: 20px;
 370  }
 371  
 372  .wp-caption.alignright {
 373      margin: 5px 0 5px 10px;
 374  }
 375  
 376  .wp-caption.alignright img,
 377  .wp-caption.alignright .wp-caption-dd {
 378      padding-left: 10px;
 379  }
 380  
 381  .html5-captions .wp-caption.alignright {
 382      margin-left: 20px;
 383  }
 384  
 385  .html5-captions .wp-caption.alignright img,
 386  .html5-captions .wp-caption.alignright .wp-caption-dd {
 387      padding: 0;
 388  }
 389  
 390  .wp-caption-dt {
 391      margin: 0;
 392  }
 393  
 394  .wp-caption .wp-caption-text,
 395  .wp-caption-dd {
 396      color: #220e10;
 397      font-size: 18px;
 398      font-style: italic;
 399      font-weight: 300;
 400      line-height: 1.5;
 401      margin-bottom: 24px;
 402      padding: 0;
 403  }
 404  
 405  .mceTemp + ul,
 406  .mceTemp + ol {
 407      list-style-position: inside;
 408  }
 409  
 410  
 411  /**
 412   * 8.0 Galleries
 413   * ----------------------------------------------------------------------------
 414   */
 415  
 416  .gallery .gallery-item {
 417      float: left;
 418      margin: 0 4px 4px 0;
 419      overflow: hidden;
 420      padding: 0;
 421      position: relative;
 422  }
 423  
 424  .gallery-columns-1 .gallery-item {
 425      max-width: 100%;
 426      width: auto;
 427  }
 428  
 429  .gallery-columns-2 .gallery-item {
 430      max-width: 48%;
 431      max-width: -webkit-calc(50% - 14px);
 432      max-width:         calc(50% - 14px);
 433      width: auto;
 434  }
 435  
 436  .gallery-columns-3 .gallery-item {
 437      max-width: 32%;
 438      max-width: -webkit-calc(33.3% - 11px);
 439      max-width:         calc(33.3% - 11px);
 440      width: auto;
 441  }
 442  
 443  .gallery-columns-4 .gallery-item {
 444      max-width: 23%;
 445      max-width: -webkit-calc(25% - 9px);
 446      max-width:         calc(25% - 9px);
 447      width: auto;
 448  }
 449  
 450  .gallery-columns-5 .gallery-item {
 451      max-width: 19%;
 452      max-width: -webkit-calc(20% - 8px);
 453      max-width:         calc(20% - 8px);
 454      width: auto;
 455  }
 456  
 457  .gallery-columns-6 .gallery-item {
 458      max-width: 15%;
 459      max-width: -webkit-calc(16.7% - 7px);
 460      max-width:         calc(16.7% - 7px);
 461      width: auto;
 462  }
 463  
 464  .gallery-columns-7 .gallery-item {
 465      max-width: 13%;
 466      max-width: -webkit-calc(14.28% - 7px);
 467      max-width:         calc(14.28% - 7px);
 468      width: auto;
 469  }
 470  
 471  .gallery-columns-8 .gallery-item {
 472      max-width: 11%;
 473      max-width: -webkit-calc(12.5% - 6px);
 474      max-width:         calc(12.5% - 6px);
 475      width: auto;
 476  }
 477  
 478  .gallery-columns-9 .gallery-item {
 479      max-width: 9%;
 480      max-width: -webkit-calc(11.1% - 6px);
 481      max-width:         calc(11.1% - 6px);
 482      width: auto;
 483  }
 484  
 485  .gallery-columns-1 .gallery-item:nth-of-type(1n),
 486  .gallery-columns-2 .gallery-item:nth-of-type(2n),
 487  .gallery-columns-3 .gallery-item:nth-of-type(3n),
 488  .gallery-columns-4 .gallery-item:nth-of-type(4n),
 489  .gallery-columns-5 .gallery-item:nth-of-type(5n),
 490  .gallery-columns-6 .gallery-item:nth-of-type(6n),
 491  .gallery-columns-7 .gallery-item:nth-of-type(7n),
 492  .gallery-columns-8 .gallery-item:nth-of-type(8n),
 493  .gallery-columns-9 .gallery-item:nth-of-type(9n) {
 494      margin-right: 0;
 495  }
 496  
 497  .gallery-columns-1 .gallery-item:nth-of-type(1n),
 498  .gallery-columns-2 .gallery-item:nth-of-type(2n - 1),
 499  .gallery-columns-3 .gallery-item:nth-of-type(3n - 2),
 500  .gallery-columns-4 .gallery-item:nth-of-type(4n - 3),
 501  .gallery-columns-5 .gallery-item:nth-of-type(5n - 4),
 502  .gallery-columns-6 .gallery-item:nth-of-type(6n - 5),
 503  .gallery-columns-7 .gallery-item:nth-of-type(7n - 6),
 504  .gallery-columns-8 .gallery-item:nth-of-type(8n - 7),
 505  .gallery-columns-9 .gallery-item:nth-of-type(9n - 8) {
 506      margin-left: 12px; /* Compensate for the default negative margin on .gallery, which can't be changed. */
 507  }
 508  
 509  .gallery .gallery-caption {
 510      background-color: rgba(0, 0, 0, 0.7);
 511      box-sizing: border-box;
 512      color: #fff;
 513      font-size: 14px;
 514      line-height: 1.3;
 515      margin: 0;
 516      max-height: 50%;
 517      opacity: 0;
 518      padding: 2px 8px;
 519      position: absolute;
 520      bottom: 0;
 521      left: 0;
 522      text-align: left;
 523      -webkit-transition: opacity 400ms ease;
 524      transition:         opacity 400ms ease;
 525      width: 100%;
 526  }
 527  
 528  .gallery .gallery-caption:before {
 529      box-shadow: 0 -10px 15px #000 inset;
 530      content: "";
 531      height: 100%;
 532      min-height: 49px;
 533      position: absolute;
 534      left: 0;
 535      top: 0;
 536      width: 100%;
 537  }
 538  
 539  .gallery-item:hover .gallery-caption {
 540      opacity: 1;
 541  }
 542  
 543  .gallery-columns-7 .gallery-caption,
 544  .gallery-columns-8 .gallery-caption,
 545  .gallery-columns-9 .gallery-caption {
 546      display: none;
 547  }
 548  
 549  
 550  /**
 551   * 9.0 Audio/Video
 552   * ----------------------------------------------------------------------------
 553   */
 554  .mejs-mediaelement,
 555  .mejs-container .mejs-controls {
 556      background: #220e10;
 557  }
 558  
 559  .mejs-controls .mejs-time-rail .mejs-time-loaded,
 560  .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {
 561      background: #fff;
 562  }
 563  
 564  .mejs-controls .mejs-time-rail .mejs-time-current {
 565      background: #ea9629;
 566  }
 567  
 568  .mejs-controls .mejs-time-rail .mejs-time-total,
 569  .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total {
 570      background: #595959;
 571  }
 572  
 573  .mejs-controls .mejs-time-rail span,
 574  .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total,
 575  .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {
 576      border-radius: 0;
 577  }
 578  
 579  
 580  /**
 581   * 10.0 Post Formats
 582   * ----------------------------------------------------------------------------
 583   */
 584  
 585  /* Aside */
 586  .post-format-aside {
 587      background-color: #f7f5e7;
 588  }
 589  
 590  .post-format-aside blockquote {
 591      font-size: 100%;
 592      font-weight: normal;
 593  }
 594  
 595  .post-format-aside cite {
 596      font-size: 100%;
 597      text-transform: none;
 598  }
 599  
 600  .post-format-aside cite:before {
 601      content: "\2014";
 602      margin-right: 5px;
 603  }
 604  
 605  /* Audio */
 606  .post-format-audio {
 607      background-color: #db572f;
 608  }
 609  
 610  .post-format-audio a {
 611      color: #fbfaf3;
 612  }
 613  
 614  .post-format-audio:before {
 615      background: url(../images/dotted-line.png) repeat-y 85px 0;
 616      background-size: 4px 4px;
 617      content: "\f109";
 618      display: block;
 619      float: left;
 620      font-family: Genericons;
 621      font-size: 64px;
 622      -webkit-font-smoothing: antialiased;
 623      height: 100%;
 624      line-height: 1;
 625      width: 120px;
 626  }
 627  
 628  /* Chat */
 629  .post-format-chat {
 630      background-color: #eadaa6;
 631  }
 632  
 633  .post-format-chat a {
 634      color: #722d19;
 635  }
 636  
 637  /* Gallery */
 638  .post-format-gallery {
 639      background-color: #fbca3c;
 640  }
 641  
 642  .post-format-gallery a {
 643      color: #722d19;
 644  }
 645  
 646  /* Image: same as Standard/Defaults */
 647  
 648  /* Link */
 649  .post-format-link {
 650      background-color: #f7f5e7;
 651  }
 652  
 653  /* Quote */
 654  .post-format-quote {
 655      background-color: #210d10;
 656      color: #f7f5e7;
 657  }
 658  
 659  .post-format-quote a {
 660      color: #e63f2a;
 661  }
 662  
 663  .post-format-quote blockquote {
 664      font-size: 28px;
 665      font-style: italic;
 666      font-weight: 300;
 667      margin: 0;
 668      padding-left: 75px;
 669      position: relative;
 670  }
 671  
 672  .post-format-quote blockquote:before {
 673      content: '\201C';
 674      font-size: 140px;
 675      font-weight: 400;
 676      line-height: .8;
 677      padding-right: 25px;
 678      position: absolute;
 679      left: -15px;
 680      top: -3px;
 681  }
 682  
 683  .post-format-quote blockquote small,
 684  .post-format-quote blockquote cite {
 685      display: block;
 686      font-size: 16px;
 687  }
 688  
 689  .format-quote .entry-content cite a {
 690      border-bottom: 1px dotted #fff;
 691      color: #fff;
 692  }
 693  
 694  .format-quote .entry-content cite a:hover {
 695      text-decoration: none;
 696  }
 697  
 698  
 699  /* Status */
 700  .post-format-status {
 701      background-color: #722d19;
 702      color: #f7f5e7;
 703      font-style: italic;
 704      font-weight: 300;
 705      padding: 0;
 706      padding-left: 35px;
 707  }
 708  
 709  .post-format-status.mceContentBody {
 710      font-size: 24px;
 711  }
 712  
 713  .post-format-status:before {
 714      background: url(../images/dotted-line.png) repeat-y left bottom;
 715      background-size: 4px 4px;
 716      content: "";
 717      display: block;
 718      float: left;
 719      height: 100%;
 720      position: relative;
 721      left: -30px;
 722      width: 1px;
 723  }
 724  
 725  .post-format-status > p:first-child:before {
 726      background-color: rgba(0, 0, 0, 0.65);
 727      content: "";
 728      height: 3px;
 729      width: 13px;
 730      margin-top: 13px;
 731      position: absolute;
 732      left: 9px;
 733  }
 734  
 735  .post-format-status a {
 736      color: #eadaa6;
 737  }
 738  
 739  /* Video */
 740  .post-format-video {
 741      background-color: #db572f;
 742  }
 743  
 744  .post-format-video a {
 745      color: #fbfaf3;
 746  }
 747  
 748  
 749  /**
 750   * 11.0 RTL
 751   * ----------------------------------------------------------------------------
 752   */
 753  
 754  html .mceContentBody.rtl {
 755      direction: rtl;
 756      unicode-bidi: embed;
 757  }
 758  
 759  .rtl ol,
 760  .rtl ul {
 761      padding: 0 40px 0 0;
 762  }
 763  
 764  .rtl .wp-caption,
 765  .rtl tr th {
 766      text-align: right;
 767  }
 768  
 769  .rtl td {
 770      padding: 6px 0 6px 10px;
 771      text-align: right;
 772  }
 773  
 774  .rtl blockquote blockquote {
 775      margin-left: 0;
 776      margin-right: 24px;
 777  }
 778  
 779  .rtl.post-format-audio:before,
 780  .rtl.post-format-status:before,
 781  .rtl.post-format-status > p:first-child:before {
 782      background: none;
 783      content: none;
 784  }