[Summary view] [Print] [Text view]

   1  /*
   2  Theme Name: Twenty Seventeen
   3  Theme URI: https://wordpress.org/themes/twentyseventeen/
   4  Author: the WordPress team
   5  Author URI: https://wordpress.org/
   6  Description: Twenty Seventeen brings your site to life with header video and immersive featured images. With a focus on business sites, it features multiple sections on the front page as well as widgets, navigation and social menus, a logo, and more. Personalize its asymmetrical grid with a custom color scheme and showcase your multimedia content with post formats. Our default theme for 2017 works great in many languages, for any abilities, and on any device.
   7  Version: 3.6
   8  Tested up to: 6.5
   9  Requires at least: 4.7
  10  Requires PHP: 5.2.4
  11  License: GNU General Public License v2 or later
  12  License URI: http://www.gnu.org/licenses/gpl-2.0.html
  13  Text Domain: twentyseventeen
  14  Tags: one-column, two-columns, right-sidebar, flexible-header, accessibility-ready, custom-colors, custom-header, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, block-patterns
  15  
  16  This theme, like WordPress, is licensed under the GPL.
  17  Use it to make something cool, have fun, and share what you've learned with others.
  18  */
  19  
  20  /*--------------------------------------------------------------
  21  >>> TABLE OF CONTENTS:
  22  ----------------------------------------------------------------
  23  1.0 Normalize
  24  2.0 Accessibility
  25  3.0 Alignments
  26  4.0 Clearings
  27  5.0 Typography
  28  6.0 Forms
  29  7.0 Formatting
  30  8.0 Lists
  31  9.0 Tables
  32  10.0 Links
  33  11.0 Featured Image Hover
  34  12.0 Navigation
  35  13.0 Layout
  36     13.1 Header
  37     13.2 Front Page
  38     13.3 Regular Content
  39     13.4 Posts
  40     13.5 Pages
  41     13.6 Footer
  42  14.0 Comments
  43  15.0 Widgets
  44  16.0 Media
  45     16.1 Galleries
  46  17.0 Customizer
  47  18.0 SVGs Fallbacks
  48  19.0 Media Queries
  49  20.0 Print
  50  --------------------------------------------------------------*/
  51  
  52  /*--------------------------------------------------------------
  53  1.0 Normalize
  54  Styles based on Normalize v5.0.0 @link https://github.com/necolas/normalize.css
  55  --------------------------------------------------------------*/
  56  
  57  html {
  58      font-family: sans-serif;
  59      line-height: 1.15;
  60      -ms-text-size-adjust: 100%;
  61      -webkit-text-size-adjust: 100%;
  62  }
  63  
  64  body {
  65      margin: 0;
  66  }
  67  
  68  article,
  69  aside,
  70  footer,
  71  header,
  72  nav,
  73  section {
  74      display: block;
  75  }
  76  
  77  h1 {
  78      font-size: 2em;
  79      margin: 0.67em 0;
  80  }
  81  
  82  figcaption,
  83  figure,
  84  main {
  85      display: block;
  86  }
  87  
  88  figure {
  89      margin: 1em 0;
  90  }
  91  
  92  hr {
  93      -webkit-box-sizing: content-box;
  94      -moz-box-sizing: content-box;
  95      box-sizing: content-box;
  96      height: 0;
  97      overflow: visible;
  98  }
  99  
 100  pre {
 101      font-family: monospace, monospace;
 102      font-size: 1em;
 103  }
 104  
 105  a {
 106      background-color: transparent;
 107      -webkit-text-decoration-skip: objects;
 108  }
 109  
 110  a:active,
 111  a:hover {
 112      outline-width: 0;
 113  }
 114  
 115  abbr[title] {
 116      border-bottom: 1px #767676 dotted;
 117      text-decoration: none;
 118  }
 119  
 120  b,
 121  strong {
 122      font-weight: inherit;
 123  }
 124  
 125  b,
 126  strong {
 127      font-weight: 700;
 128  }
 129  
 130  code,
 131  kbd,
 132  samp {
 133      font-family: monospace, monospace;
 134      font-size: 1em;
 135  }
 136  
 137  dfn {
 138      font-style: italic;
 139  }
 140  
 141  mark {
 142      background-color: #eee;
 143      color: #222;
 144  }
 145  
 146  small {
 147      font-size: 80%;
 148  }
 149  
 150  sub,
 151  sup {
 152      font-size: 75%;
 153      line-height: 0;
 154      position: relative;
 155      vertical-align: baseline;
 156  }
 157  
 158  sub {
 159      bottom: -0.25em;
 160  }
 161  
 162  sup {
 163      top: -0.5em;
 164  }
 165  
 166  audio,
 167  video {
 168      display: inline-block;
 169  }
 170  
 171  audio:not([controls]) {
 172      display: none;
 173      height: 0;
 174  }
 175  
 176  img {
 177      border-style: none;
 178  }
 179  
 180  svg:not(:root) {
 181      overflow: hidden;
 182  }
 183  
 184  button,
 185  input,
 186  optgroup,
 187  select,
 188  textarea {
 189      font-family: sans-serif;
 190      font-size: 100%;
 191      line-height: 1.15;
 192      margin: 0;
 193  }
 194  
 195  button,
 196  input {
 197      overflow: visible;
 198  }
 199  
 200  button,
 201  select {
 202      text-transform: none;
 203  }
 204  
 205  button,
 206  html [type="button"],
 207  [type="reset"],
 208  [type="submit"] {
 209      -webkit-appearance: button;
 210  }
 211  
 212  button::-moz-focus-inner,
 213  [type="button"]::-moz-focus-inner,
 214  [type="reset"]::-moz-focus-inner,
 215  [type="submit"]::-moz-focus-inner {
 216      border-style: none;
 217      padding: 0;
 218  }
 219  
 220  button:-moz-focusring,
 221  [type="button"]:-moz-focusring,
 222  [type="reset"]:-moz-focusring,
 223  [type="submit"]:-moz-focusring {
 224      outline: 1px dotted ButtonText;
 225  }
 226  
 227  fieldset {
 228      border: 1px solid #bbb;
 229      margin: 0 2px;
 230      padding: 0.35em 0.625em 0.75em;
 231  }
 232  
 233  legend {
 234      -webkit-box-sizing: border-box;
 235      -moz-box-sizing: border-box;
 236      box-sizing: border-box;
 237      color: inherit;
 238      display: table;
 239      max-width: 100%;
 240      padding: 0;
 241      white-space: normal;
 242  }
 243  
 244  progress {
 245      display: inline-block;
 246      vertical-align: baseline;
 247  }
 248  
 249  textarea {
 250      overflow: auto;
 251  }
 252  
 253  [type="checkbox"],
 254  [type="radio"] {
 255      -webkit-box-sizing: border-box;
 256      -moz-box-sizing: border-box;
 257      box-sizing: border-box;
 258      padding: 0;
 259  }
 260  
 261  [type="number"]::-webkit-inner-spin-button,
 262  [type="number"]::-webkit-outer-spin-button {
 263      height: auto;
 264  }
 265  
 266  [type="search"] {
 267      -webkit-appearance: textfield;
 268      outline-offset: -2px;
 269  }
 270  
 271  [type="search"]::-webkit-search-cancel-button,
 272  [type="search"]::-webkit-search-decoration {
 273      -webkit-appearance: none;
 274  }
 275  
 276  ::-webkit-file-upload-button {
 277      -webkit-appearance: button;
 278      font: inherit;
 279  }
 280  
 281  details,
 282  menu {
 283      display: block;
 284  }
 285  
 286  summary {
 287      display: list-item;
 288  }
 289  
 290  canvas {
 291      display: inline-block;
 292  }
 293  
 294  template {
 295      display: none;
 296  }
 297  
 298  [hidden] {
 299      display: none;
 300  }
 301  
 302  /*--------------------------------------------------------------
 303  2.0 Accessibility
 304  --------------------------------------------------------------*/
 305  
 306  /* Text meant only for screen readers. */
 307  
 308  .screen-reader-text {
 309      clip: rect(1px, 1px, 1px, 1px);
 310      height: 1px;
 311      overflow: hidden;
 312      position: absolute !important;
 313      width: 1px;
 314      word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */
 315  }
 316  
 317  .screen-reader-text:focus {
 318      background-color: #f1f1f1;
 319      -webkit-border-radius: 3px;
 320      border-radius: 3px;
 321      -webkit-box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
 322      box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
 323      clip: auto !important;
 324      color: #21759b;
 325      display: block;
 326      font-size: 14px;
 327      font-size: 0.875rem;
 328      font-weight: 700;
 329      height: auto;
 330      left: 5px;
 331      line-height: normal;
 332      padding: 15px 23px 14px;
 333      text-decoration: none;
 334      top: 5px;
 335      width: auto;
 336      z-index: 100000; /* Above WP toolbar. */
 337  }
 338  
 339  /*--------------------------------------------------------------
 340  3.0 Alignments
 341  --------------------------------------------------------------*/
 342  
 343  .alignleft {
 344      display: inline;
 345      float: left;
 346      margin-right: 1.5em;
 347  }
 348  
 349  .alignright {
 350      display: inline;
 351      float: right;
 352      margin-left: 1.5em;
 353  }
 354  
 355  .aligncenter {
 356      clear: both;
 357      display: block;
 358      margin-left: auto;
 359      margin-right: auto;
 360  }
 361  
 362  /*--------------------------------------------------------------
 363  4.0 Clearings
 364  --------------------------------------------------------------*/
 365  
 366  .clear:before,
 367  .clear:after,
 368  .entry-content:before,
 369  .entry-content:after,
 370  .entry-footer:before,
 371  .entry-footer:after,
 372  .comment-content:before,
 373  .comment-content:after,
 374  .site-header:before,
 375  .site-header:after,
 376  .site-content:before,
 377  .site-content:after,
 378  .site-footer:before,
 379  .site-footer:after,
 380  .nav-links:before,
 381  .nav-links:after,
 382  .pagination:before,
 383  .pagination:after,
 384  .comment-author:before,
 385  .comment-author:after,
 386  .widget-area:before,
 387  .widget-area:after,
 388  .widget:before,
 389  .widget:after,
 390  .comment-meta:before,
 391  .comment-meta:after {
 392      content: "";
 393      display: table;
 394      table-layout: fixed;
 395  }
 396  
 397  .clear:after,
 398  .entry-content:after,
 399  .entry-footer:after,
 400  .comment-content:after,
 401  .site-header:after,
 402  .site-content:after,
 403  .site-footer:after,
 404  .nav-links:after,
 405  .pagination:after,
 406  .comment-author:after,
 407  .widget-area:after,
 408  .widget:after,
 409  .comment-meta:after {
 410      clear: both;
 411  }
 412  
 413  /*--------------------------------------------------------------
 414  5.0 Typography
 415  --------------------------------------------------------------*/
 416  
 417  body,
 418  button,
 419  input,
 420  select,
 421  textarea {
 422      color: #333;
 423      font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif;
 424      font-size: 15px;
 425      font-size: 0.9375rem;
 426      font-weight: 400;
 427      line-height: 1.66;
 428  }
 429  
 430  h1,
 431  h2,
 432  h3,
 433  h4,
 434  h5,
 435  h6 {
 436      clear: both;
 437      line-height: 1.4;
 438      margin: 0 0 0.75em;
 439      padding: 1.5em 0 0;
 440  }
 441  
 442  h1:first-child,
 443  h2:first-child,
 444  h3:first-child,
 445  h4:first-child,
 446  h5:first-child,
 447  h6:first-child {
 448      padding-top: 0;
 449  }
 450  
 451  h1 {
 452      font-size: 24px;
 453      font-size: 1.5rem;
 454      font-weight: 300;
 455  }
 456  
 457  h2,
 458  .home.blog .entry-title {
 459      color: #666;
 460      font-size: 20px;
 461      font-size: 1.25rem;
 462      font-weight: 300;
 463  }
 464  
 465  h3 {
 466      color: #333;
 467      font-size: 18px;
 468      font-size: 1.125rem;
 469      font-weight: 300;
 470  }
 471  
 472  h4 {
 473      color: #333;
 474      font-size: 16px;
 475      font-size: 1rem;
 476      font-weight: 800;
 477  }
 478  
 479  h5 {
 480      color: #767676;
 481      font-size: 13px;
 482      font-size: 0.8125rem;
 483      font-weight: 800;
 484      letter-spacing: 0.15em;
 485      text-transform: uppercase;
 486  }
 487  
 488  h6 {
 489      color: #333;
 490      font-size: 15px;
 491      font-size: 0.9375rem;
 492      font-weight: 800;
 493  }
 494  
 495  p {
 496      margin: 0 0 1.5em;
 497      padding: 0;
 498  }
 499  
 500  dfn,
 501  cite,
 502  em,
 503  i {
 504      font-style: italic;
 505  }
 506  
 507  blockquote {
 508      color: #666;
 509      font-size: 18px;
 510      font-size: 1.125rem;
 511      font-style: italic;
 512      line-height: 1.7;
 513      margin: 0;
 514      overflow: hidden;
 515      padding: 0;
 516  }
 517  
 518  blockquote cite {
 519      display: block;
 520      font-style: normal;
 521      font-weight: 600;
 522      margin-top: 0.5em;
 523  }
 524  
 525  address {
 526      margin: 0 0 1.5em;
 527  }
 528  
 529  pre {
 530      background: #eee;
 531      font-family: "Courier 10 Pitch", Courier, monospace;
 532      font-size: 15px;
 533      font-size: 0.9375rem;
 534      line-height: 1.6;
 535      margin-bottom: 1.6em;
 536      max-width: 100%;
 537      overflow: auto;
 538      padding: 1.6em;
 539  }
 540  
 541  code,
 542  kbd,
 543  tt,
 544  var {
 545      font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
 546      font-size: 15px;
 547      font-size: 0.9375rem;
 548  }
 549  
 550  abbr,
 551  acronym {
 552      border-bottom: 1px dotted #666;
 553      cursor: help;
 554  }
 555  
 556  mark,
 557  ins {
 558      background: #eee;
 559      text-decoration: none;
 560  }
 561  
 562  big {
 563      font-size: 125%;
 564  }
 565  
 566  blockquote {
 567      quotes: "" "";
 568  }
 569  
 570  q {
 571      quotes: "“" "”" "‘" "’";
 572  }
 573  
 574  blockquote:before,
 575  blockquote:after {
 576      content: "";
 577  }
 578  
 579  :focus {
 580      outline: none;
 581  }
 582  
 583  /* Typography for Arabic Font */
 584  
 585  html[lang="ar"] body,
 586  html[lang="ar"] button,
 587  html[lang="ar"] input,
 588  html[lang="ar"] select,
 589  html[lang="ar"] textarea,
 590  html[lang="ary"] body,
 591  html[lang="ary"] button,
 592  html[lang="ary"] input,
 593  html[lang="ary"] select,
 594  html[lang="ary"] textarea,
 595  html[lang="azb"] body,
 596  html[lang="azb"] button,
 597  html[lang="azb"] input,
 598  html[lang="azb"] select,
 599  html[lang="azb"] textarea,
 600  html[lang^="fa-"] body,
 601  html[lang^="fa-"] button,
 602  html[lang^="fa-"] input,
 603  html[lang^="fa-"] select,
 604  html[lang^="fa-"] textarea,
 605  html[lang="haz"] body,
 606  html[lang="haz"] button,
 607  html[lang="haz"] input,
 608  html[lang="haz"] select,
 609  html[lang="haz"] textarea,
 610  html[lang="ps"] body,
 611  html[lang="ps"] button,
 612  html[lang="ps"] input,
 613  html[lang="ps"] select,
 614  html[lang="ps"] textarea,
 615  html[lang="ur"] body,
 616  html[lang="ur"] button,
 617  html[lang="ur"] input,
 618  html[lang="ur"] select,
 619  html[lang="ur"] textarea {
 620      font-family: Tahoma, Arial, sans-serif;
 621  }
 622  
 623  html[lang="ar"] h1,
 624  html[lang="ar"] h2,
 625  html[lang="ar"] h3,
 626  html[lang="ar"] h4,
 627  html[lang="ar"] h5,
 628  html[lang="ar"] h6,
 629  html[lang="ary"] h1,
 630  html[lang="ary"] h2,
 631  html[lang="ary"] h3,
 632  html[lang="ary"] h4,
 633  html[lang="ary"] h5,
 634  html[lang="ary"] h6,
 635  html[lang="azb"] h1,
 636  html[lang="azb"] h2,
 637  html[lang="azb"] h3,
 638  html[lang="azb"] h4,
 639  html[lang="azb"] h5,
 640  html[lang="azb"] h6,
 641  html[lang^="fa-"] h1,
 642  html[lang^="fa-"] h2,
 643  html[lang^="fa-"] h3,
 644  html[lang^="fa-"] h4,
 645  html[lang^="fa-"] h5,
 646  html[lang^="fa-"] h6,
 647  html[lang="haz"] h1,
 648  html[lang="haz"] h2,
 649  html[lang="haz"] h3,
 650  html[lang="haz"] h4,
 651  html[lang="haz"] h5,
 652  html[lang="haz"] h6,
 653  html[lang="ps"] h1,
 654  html[lang="ps"] h2,
 655  html[lang="ps"] h3,
 656  html[lang="ps"] h4,
 657  html[lang="ps"] h5,
 658  html[lang="ps"] h6,
 659  html[lang="ur"] h1,
 660  html[lang="ur"] h2,
 661  html[lang="ur"] h3,
 662  html[lang="ur"] h4,
 663  html[lang="ur"] h5,
 664  html[lang="ur"] h6 {
 665      font-weight: 700;
 666  }
 667  
 668  /* Typography for Chinese Font */
 669  
 670  html[lang^="zh-"] body,
 671  html[lang^="zh-"] button,
 672  html[lang^="zh-"] input,
 673  html[lang^="zh-"] select,
 674  html[lang^="zh-"] textarea {
 675      font-family: "PingFang TC", "Helvetica Neue", Helvetica, STHeitiTC-Light, Arial, sans-serif;
 676  }
 677  
 678  html[lang="zh-CN"] body,
 679  html[lang="zh-CN"] button,
 680  html[lang="zh-CN"] input,
 681  html[lang="zh-CN"] select,
 682  html[lang="zh-CN"] textarea {
 683      font-family: "PingFang SC", "Helvetica Neue", Helvetica, STHeitiSC-Light, Arial, sans-serif;
 684  }
 685  
 686  html[lang^="zh-"] h1,
 687  html[lang^="zh-"] h2,
 688  html[lang^="zh-"] h3,
 689  html[lang^="zh-"] h4,
 690  html[lang^="zh-"] h5,
 691  html[lang^="zh-"] h6 {
 692      font-weight: 700;
 693  }
 694  
 695  /* Typography for Cyrillic Font */
 696  
 697  html[lang="bg-BG"] body,
 698  html[lang="bg-BG"] button,
 699  html[lang="bg-BG"] input,
 700  html[lang="bg-BG"] select,
 701  html[lang="bg-BG"] textarea,
 702  html[lang="ru-RU"] body,
 703  html[lang="ru-RU"] button,
 704  html[lang="ru-RU"] input,
 705  html[lang="ru-RU"] select,
 706  html[lang="ru-RU"] textarea,
 707  html[lang="uk"] body,
 708  html[lang="uk"] button,
 709  html[lang="uk"] input,
 710  html[lang="uk"] select,
 711  html[lang="uk"] textarea {
 712      font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif;
 713  }
 714  
 715  html[lang="bg-BG"] h1,
 716  html[lang="bg-BG"] h2,
 717  html[lang="bg-BG"] h3,
 718  html[lang="bg-BG"] h4,
 719  html[lang="bg-BG"] h5,
 720  html[lang="bg-BG"] h6,
 721  html[lang="ru-RU"] h1,
 722  html[lang="ru-RU"] h2,
 723  html[lang="ru-RU"] h3,
 724  html[lang="ru-RU"] h4,
 725  html[lang="ru-RU"] h5,
 726  html[lang="ru-RU"] h6,
 727  html[lang="uk"] h1,
 728  html[lang="uk"] h2,
 729  html[lang="uk"] h3,
 730  html[lang="uk"] h4,
 731  html[lang="uk"] h5,
 732  html[lang="uk"] h6 {
 733      font-weight: 700;
 734      line-height: 1.2;
 735  }
 736  
 737  /* Typography for Devanagari Font */
 738  
 739  html[lang="bn-BD"] body,
 740  html[lang="bn-BD"] button,
 741  html[lang="bn-BD"] input,
 742  html[lang="bn-BD"] select,
 743  html[lang="bn-BD"] textarea,
 744  html[lang="hi-IN"] body,
 745  html[lang="hi-IN"] button,
 746  html[lang="hi-IN"] input,
 747  html[lang="hi-IN"] select,
 748  html[lang="hi-IN"] textarea,
 749  html[lang="mr-IN"] body,
 750  html[lang="mr-IN"] button,
 751  html[lang="mr-IN"] input,
 752  html[lang="mr-IN"] select,
 753  html[lang="mr-IN"] textarea {
 754      font-family: Arial, sans-serif;
 755  }
 756  
 757  html[lang="bn-BD"] h1,
 758  html[lang="bn-BD"] h2,
 759  html[lang="bn-BD"] h3,
 760  html[lang="bn-BD"] h4,
 761  html[lang="bn-BD"] h5,
 762  html[lang="bn-BD"] h6,
 763  html[lang="hi-IN"] h1,
 764  html[lang="hi-IN"] h2,
 765  html[lang="hi-IN"] h3,
 766  html[lang="hi-IN"] h4,
 767  html[lang="hi-IN"] h5,
 768  html[lang="hi-IN"] h6,
 769  html[lang="mr-IN"] h1,
 770  html[lang="mr-IN"] h2,
 771  html[lang="mr-IN"] h3,
 772  html[lang="mr-IN"] h4,
 773  html[lang="mr-IN"] h5,
 774  html[lang="mr-IN"] h6 {
 775      font-weight: 700;
 776  }
 777  
 778  /* Typography for Greek Font */
 779  
 780  html[lang="el"] body,
 781  html[lang="el"] button,
 782  html[lang="el"] input,
 783  html[lang="el"] select,
 784  html[lang="el"] textarea {
 785      font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
 786  }
 787  
 788  html[lang="el"] h1,
 789  html[lang="el"] h2,
 790  html[lang="el"] h3,
 791  html[lang="el"] h4,
 792  html[lang="el"] h5,
 793  html[lang="el"] h6 {
 794      font-weight: 700;
 795      line-height: 1.3;
 796  }
 797  
 798  /* Typography for Gujarati Font */
 799  
 800  html[lang="gu-IN"] body,
 801  html[lang="gu-IN"] button,
 802  html[lang="gu-IN"] input,
 803  html[lang="gu-IN"] select,
 804  html[lang="gu-IN"] textarea {
 805      font-family: Arial, sans-serif;
 806  }
 807  
 808  html[lang="gu-IN"] h1,
 809  html[lang="gu-IN"] h2,
 810  html[lang="gu-IN"] h3,
 811  html[lang="gu-IN"] h4,
 812  html[lang="gu-IN"] h5,
 813  html[lang="gu-IN"] h6 {
 814      font-weight: 700;
 815  }
 816  
 817  /* Typography for Hebrew Font */
 818  
 819  html[lang="he-IL"] body,
 820  html[lang="he-IL"] button,
 821  html[lang="he-IL"] input,
 822  html[lang="he-IL"] select,
 823  html[lang="he-IL"] textarea {
 824      font-family: "Arial Hebrew", Arial, sans-serif;
 825  }
 826  
 827  html[lang="he-IL"] h1,
 828  html[lang="he-IL"] h2,
 829  html[lang="he-IL"] h3,
 830  html[lang="he-IL"] h4,
 831  html[lang="he-IL"] h5,
 832  html[lang="he-IL"] h6 {
 833      font-weight: 700;
 834  }
 835  
 836  /* Typography for Japanese Font */
 837  
 838  html[lang="ja"] body,
 839  html[lang="ja"] button,
 840  html[lang="ja"] input,
 841  html[lang="ja"] select,
 842  html[lang="ja"] textarea {
 843      font-family: "Hiragino Kaku Gothic Pro", Meiryo, sans-serif;
 844  }
 845  
 846  html[lang="ja"] h1,
 847  html[lang="ja"] h2,
 848  html[lang="ja"] h3,
 849  html[lang="ja"] h4,
 850  html[lang="ja"] h5,
 851  html[lang="ja"] h6 {
 852      font-weight: 700;
 853  }
 854  
 855  /* Typography for Korean font */
 856  
 857  html[lang="ko-KR"] body,
 858  html[lang="ko-KR"] button,
 859  html[lang="ko-KR"] input,
 860  html[lang="ko-KR"] select,
 861  html[lang="ko-KR"] textarea {
 862      font-family: "Apple SD Gothic Neo", "Malgun Gothic", "Nanum Gothic", Dotum, sans-serif;
 863  }
 864  
 865  html[lang="ko-KR"] h1,
 866  html[lang="ko-KR"] h2,
 867  html[lang="ko-KR"] h3,
 868  html[lang="ko-KR"] h4,
 869  html[lang="ko-KR"] h5,
 870  html[lang="ko-KR"] h6 {
 871      font-weight: 600;
 872  }
 873  
 874  /* Typography for Thai Font */
 875  
 876  html[lang="th"] h1,
 877  html[lang="th"] h2,
 878  html[lang="th"] h3,
 879  html[lang="th"] h4,
 880  html[lang="th"] h5,
 881  html[lang="th"] h6 {
 882      line-height: 1.65;
 883      font-family: "Sukhumvit Set", "Helvetica Neue", Helvetica, Arial, sans-serif;
 884  }
 885  
 886  html[lang="th"] body,
 887  html[lang="th"] button,
 888  html[lang="th"] input,
 889  html[lang="th"] select,
 890  html[lang="th"] textarea {
 891      line-height: 1.8;
 892      font-family: "Sukhumvit Set", "Helvetica Neue", Helvetica, Arial, sans-serif;
 893  }
 894  
 895  /* Remove letter-spacing for all non-latin alphabets */
 896  
 897  html[lang="ar"] *,
 898  html[lang="ary"] *,
 899  html[lang="azb"] *,
 900  html[lang^="fa-"] *,
 901  html[lang="haz"] *,
 902  html[lang="ps"] *,
 903  html[lang="ur"] *,
 904  html[lang^="zh-"] *,
 905  html[lang="bg-BG"] *,
 906  html[lang="ru-RU"] *,
 907  html[lang="uk"] *,
 908  html[lang="bn-BD"] *,
 909  html[lang="hi-IN"] *,
 910  html[lang="mr-IN"] *,
 911  html[lang="el"] *,
 912  html[lang="gu-IN"] *,
 913  html[lang="he-IL"] *,
 914  html[lang="ja"] *,
 915  html[lang="ko-KR"] *,
 916  html[lang="th"] * {
 917      letter-spacing: 0 !important;
 918  }
 919  
 920  /*--------------------------------------------------------------
 921  6.0 Forms
 922  --------------------------------------------------------------*/
 923  
 924  label {
 925      color: #333;
 926      display: block;
 927      font-weight: 800;
 928      margin-bottom: 0.5em;
 929  }
 930  
 931  fieldset {
 932      margin-bottom: 1em;
 933  }
 934  
 935  input[type="text"],
 936  input[type="email"],
 937  input[type="url"],
 938  input[type="password"],
 939  input[type="search"],
 940  input[type="number"],
 941  input[type="tel"],
 942  input[type="range"],
 943  input[type="date"],
 944  input[type="month"],
 945  input[type="week"],
 946  input[type="time"],
 947  input[type="datetime"],
 948  input[type="datetime-local"],
 949  input[type="color"],
 950  textarea {
 951      color: #666;
 952      background: #fff;
 953      background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
 954      border: 1px solid #bbb;
 955      -webkit-border-radius: 3px;
 956      border-radius: 3px;
 957      display: block;
 958      padding: 0.7em;
 959      width: 100%;
 960  }
 961  
 962  input[type="text"]:focus,
 963  input[type="email"]:focus,
 964  input[type="url"]:focus,
 965  input[type="password"]:focus,
 966  input[type="search"]:focus,
 967  input[type="number"]:focus,
 968  input[type="tel"]:focus,
 969  input[type="range"]:focus,
 970  input[type="date"]:focus,
 971  input[type="month"]:focus,
 972  input[type="week"]:focus,
 973  input[type="time"]:focus,
 974  input[type="datetime"]:focus,
 975  input[type="datetime-local"]:focus,
 976  input[type="color"]:focus,
 977  textarea:focus {
 978      color: #222;
 979      border-color: #333;
 980  }
 981  
 982  select {
 983      border: 1px solid #bbb;
 984      -webkit-border-radius: 3px;
 985      border-radius: 3px;
 986      height: 3em;
 987      max-width: 100%;
 988  }
 989  
 990  input[type="radio"]:focus,
 991  input[type="checkbox"]:focus {
 992      outline: thin dotted #333;
 993  }
 994  
 995  input[type="radio"],
 996  input[type="checkbox"] {
 997      margin-right: 0.5em;
 998  }
 999  
1000  input[type="radio"] + label,
1001  input[type="checkbox"] + label {
1002      font-weight: 400;
1003  }
1004  
1005  button,
1006  input[type="button"],
1007  input[type="submit"] {
1008      background-color: #222;
1009      border: 0;
1010      -webkit-border-radius: 2px;
1011      border-radius: 2px;
1012      -webkit-box-shadow: none;
1013      box-shadow: none;
1014      color: #fff;
1015      cursor: pointer;
1016      display: inline-block;
1017      font-size: 14px;
1018      font-size: 0.875rem;
1019      font-weight: 800;
1020      line-height: 1;
1021      padding: 1em 2em;
1022      text-shadow: none;
1023      -webkit-transition: background 0.2s;
1024      transition: background 0.2s;
1025  }
1026  
1027  input + button,
1028  input + input[type="button"],
1029  input + input[type="submit"] {
1030      padding: 0.75em 2em;
1031  }
1032  
1033  button.secondary,
1034  input[type="reset"],
1035  input[type="button"].secondary,
1036  input[type="reset"].secondary,
1037  input[type="submit"].secondary {
1038      background-color: #ddd;
1039      color: #222;
1040  }
1041  
1042  :not( .mejs-button ) > button:hover,
1043  :not( .mejs-button ) > button:focus,
1044  input[type="button"]:hover,
1045  input[type="button"]:focus,
1046  input[type="submit"]:hover,
1047  input[type="submit"]:focus {
1048      background: #767676;
1049  }
1050  
1051  button.secondary:hover,
1052  button.secondary:focus,
1053  input[type="reset"]:hover,
1054  input[type="reset"]:focus,
1055  input[type="button"].secondary:hover,
1056  input[type="button"].secondary:focus,
1057  input[type="reset"].secondary:hover,
1058  input[type="reset"].secondary:focus,
1059  input[type="submit"].secondary:hover,
1060  input[type="submit"].secondary:focus {
1061      background: #bbb;
1062  }
1063  
1064  /* Placeholder text color -- selectors need to be separate to work. */
1065  ::-webkit-input-placeholder {
1066      color: #333;
1067      font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif;
1068  }
1069  
1070  :-moz-placeholder {
1071      color: #333;
1072      font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif;
1073  }
1074  
1075  ::-moz-placeholder {
1076      color: #333;
1077      font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif;
1078      opacity: 1;
1079      /* Since FF19 lowers the opacity of the placeholder by default */
1080  }
1081  
1082  :-ms-input-placeholder {
1083      color: #333;
1084      font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif;
1085  }
1086  
1087  /*--------------------------------------------------------------
1088  7.0 Formatting
1089  --------------------------------------------------------------*/
1090  
1091  hr {
1092      background-color: #bbb;
1093      border: 0;
1094      height: 1px;
1095      margin-bottom: 1.5em;
1096  }
1097  
1098  /*--------------------------------------------------------------
1099  8.0 Lists
1100  --------------------------------------------------------------*/
1101  
1102  ul,
1103  ol {
1104      margin: 0 0 1.5em;
1105      padding: 0;
1106  }
1107  
1108  ul {
1109      list-style: disc;
1110  }
1111  
1112  ol {
1113      list-style: decimal;
1114  }
1115  
1116  li > ul,
1117  li > ol {
1118      margin-bottom: 0;
1119      margin-left: 1.5em;
1120  }
1121  
1122  dt {
1123      font-weight: 700;
1124  }
1125  
1126  dd {
1127      margin: 0 1.5em 1.5em;
1128  }
1129  
1130  /*--------------------------------------------------------------
1131  9.0 Tables
1132  --------------------------------------------------------------*/
1133  
1134  table {
1135      border-collapse: collapse;
1136      margin: 0 0 1.5em;
1137      width: 100%;
1138  }
1139  
1140  thead th {
1141      border-bottom: 2px solid #bbb;
1142      padding-bottom: 0.5em;
1143  }
1144  
1145  th {
1146      padding: 0.4em;
1147      text-align: left;
1148  }
1149  
1150  tr {
1151      border-bottom: 1px solid #eee;
1152  }
1153  
1154  td {
1155      padding: 0.4em;
1156  }
1157  
1158  th,
1159  td,
1160  th:first-child,
1161  td:first-child {
1162      padding-left: 0;
1163  }
1164  
1165  th:last-child,
1166  td:last-child {
1167      padding-right: 0;
1168  }
1169  
1170  /*--------------------------------------------------------------
1171  10.0 Links
1172  --------------------------------------------------------------*/
1173  
1174  a {
1175      color: #222;
1176      text-decoration: none;
1177  }
1178  
1179  a:focus {
1180      outline: thin dotted;
1181  }
1182  
1183  a:hover,
1184  a:active {
1185      color: #000;
1186      outline: 0;
1187  }
1188  
1189  /* Hover effects */
1190  
1191  .entry-content a,
1192  .entry-summary a,
1193  .comment-content a,
1194  .widget a,
1195  .site-footer .widget-area a,
1196  .posts-navigation a,
1197  .widget_authors a strong {
1198      -webkit-box-shadow: inset 0 -1px 0 rgba(15, 15, 15, 1);
1199      box-shadow: inset 0 -1px 0 rgba(15, 15, 15, 1);
1200      -webkit-transition: color 80ms ease-in, -webkit-box-shadow 130ms ease-in-out;
1201      transition: color 80ms ease-in, -webkit-box-shadow 130ms ease-in-out;
1202      transition: color 80ms ease-in, box-shadow 130ms ease-in-out;
1203      transition: color 80ms ease-in, box-shadow 130ms ease-in-out, -webkit-box-shadow 130ms ease-in-out;
1204  }
1205  
1206  .entry-title a,
1207  .entry-meta a,
1208  .page-links a,
1209  .page-links a .page-number,
1210  .entry-footer a,
1211  .entry-footer .cat-links a,
1212  .entry-footer .tags-links a,
1213  .edit-link a,
1214  .post-navigation a,
1215  .logged-in-as a,
1216  .comment-navigation a,
1217  .comment-metadata a,
1218  .comment-metadata a.comment-edit-link,
1219  .comment-reply-link,
1220  a .nav-title,
1221  .pagination a,
1222  .comments-pagination a,
1223  .site-info a,
1224  .widget .widget-title a,
1225  .widget ul li a,
1226  .site-footer .widget-area ul li a,
1227  .site-footer .widget-area ul li a {
1228      -webkit-box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 1);
1229      box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 1);
1230      text-decoration: none;
1231      -webkit-transition: color 80ms ease-in, -webkit-box-shadow 130ms ease-in-out;
1232      transition: color 80ms ease-in, -webkit-box-shadow 130ms ease-in-out;
1233      transition: color 80ms ease-in, box-shadow 130ms ease-in-out;
1234      transition: color 80ms ease-in, box-shadow 130ms ease-in-out, -webkit-box-shadow 130ms ease-in-out;
1235  }
1236  
1237  .entry-content a:focus,
1238  .entry-content a:hover,
1239  .entry-summary a:focus,
1240  .entry-summary a:hover,
1241  .comment-content a:focus,
1242  .comment-content a:hover,
1243  .widget a:focus,
1244  .widget a:hover,
1245  .site-footer .widget-area a:focus,
1246  .site-footer .widget-area a:hover,
1247  .posts-navigation a:focus,
1248  .posts-navigation a:hover,
1249  .comment-metadata a:focus,
1250  .comment-metadata a:hover,
1251  .comment-metadata a.comment-edit-link:focus,
1252  .comment-metadata a.comment-edit-link:hover,
1253  .comment-reply-link:focus,
1254  .comment-reply-link:hover,
1255  .widget_authors a:focus strong,
1256  .widget_authors a:hover strong,
1257  .entry-title a:focus,
1258  .entry-title a:hover,
1259  .entry-meta a:focus,
1260  .entry-meta a:hover,
1261  .page-links a:focus .page-number,
1262  .page-links a:hover .page-number,
1263  .entry-footer a:focus,
1264  .entry-footer a:hover,
1265  .entry-footer .cat-links a:focus,
1266  .entry-footer .cat-links a:hover,
1267  .entry-footer .tags-links a:focus,
1268  .entry-footer .tags-links a:hover,
1269  .post-navigation a:focus,
1270  .post-navigation a:hover,
1271  .pagination a:not(.prev):not(.next):focus,
1272  .pagination a:not(.prev):not(.next):hover,
1273  .comments-pagination a:not(.prev):not(.next):focus,
1274  .comments-pagination a:not(.prev):not(.next):hover,
1275  .logged-in-as a:focus,
1276  .logged-in-as a:hover,
1277  a:focus .nav-title,
1278  a:hover .nav-title,
1279  .edit-link a:focus,
1280  .edit-link a:hover,
1281  .site-info a:focus,
1282  .site-info a:hover,
1283  .widget .widget-title a:focus,
1284  .widget .widget-title a:hover,
1285  .widget ul li a:focus,
1286  .widget ul li a:hover {
1287      color: #000;
1288      -webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 3px 0 rgba(0, 0, 0, 1);
1289      box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 3px 0 rgba(0, 0, 0, 1);
1290  }
1291  
1292  /* Fixes linked images */
1293  .entry-content a img,
1294  .comment-content a img,
1295  .widget a img {
1296      -webkit-box-shadow: 0 0 0 8px #fff;
1297      box-shadow: 0 0 0 8px #fff;
1298  }
1299  
1300  .post-navigation a:focus .icon,
1301  .post-navigation a:hover .icon {
1302      color: #222;
1303  }
1304  
1305  /*--------------------------------------------------------------
1306  11.0 Featured Image Hover
1307  --------------------------------------------------------------*/
1308  
1309  .post-thumbnail {
1310      margin-bottom: 1em;
1311  }
1312  
1313  .post-thumbnail a img {
1314      -webkit-backface-visibility: hidden;
1315      -webkit-transition: opacity 0.2s;
1316      transition: opacity 0.2s;
1317  }
1318  
1319  .post-thumbnail a:hover img,
1320  .post-thumbnail a:focus img {
1321      opacity: 0.7;
1322  }
1323  
1324  /*--------------------------------------------------------------
1325  12.0 Navigation
1326  --------------------------------------------------------------*/
1327  
1328  .navigation-top {
1329      background: #fff;
1330      border-bottom: 1px solid #eee;
1331      border-top: 1px solid #eee;
1332      font-size: 16px;
1333      font-size: 1rem;
1334      position: relative;
1335  }
1336  
1337  .navigation-top .wrap {
1338      max-width: 1000px;
1339      padding: 0;
1340  }
1341  
1342  .navigation-top a {
1343      color: #222;
1344      font-weight: 600;
1345      -webkit-transition: color 0.2s;
1346      transition: color 0.2s;
1347  }
1348  
1349  .navigation-top .current-menu-item > a,
1350  .navigation-top .current_page_item > a {
1351      color: #767676;
1352  }
1353  
1354  .main-navigation {
1355      clear: both;
1356      display: block;
1357  }
1358  
1359  .main-navigation ul {
1360      background: #fff;
1361      list-style: none;
1362      margin: 0;
1363      padding: 0 1.5em;
1364      text-align: left;
1365  }
1366  
1367  /* Hide the menu on small screens when JavaScript is available.
1368   * It only works with JavaScript.
1369   */
1370  
1371  .js .main-navigation ul,
1372  .main-navigation .menu-item-has-children > a > .icon,
1373  .main-navigation .page_item_has_children > a > .icon,
1374  .main-navigation ul a > .icon {
1375      display: none;
1376  }
1377  
1378  .main-navigation > div > ul {
1379      border-top: 1px solid #eee;
1380      padding: 0.75em 1.695em;
1381  }
1382  
1383  .js .main-navigation.toggled-on > div > ul {
1384      display: block;
1385  }
1386  
1387  .main-navigation ul ul {
1388      padding: 0 0 0 1.5em;
1389  }
1390  
1391  .main-navigation ul ul.toggled-on {
1392      display: block;
1393  }
1394  
1395  .main-navigation ul ul a {
1396      letter-spacing: 0;
1397      padding: 0.4em 0;
1398      position: relative;
1399      text-transform: none;
1400  }
1401  
1402  .main-navigation li {
1403      border-bottom: 1px solid #eee;
1404      position: relative;
1405  }
1406  
1407  .main-navigation li li,
1408  .main-navigation li:last-child {
1409      border: 0;
1410  }
1411  
1412  .main-navigation a {
1413      display: block;
1414      padding: 0.5em 0;
1415      text-decoration: none;
1416  }
1417  
1418  .main-navigation a:hover {
1419      color: #767676;
1420  }
1421  
1422  /* Menu toggle */
1423  
1424  .menu-toggle {
1425      background-color: transparent;
1426      border: 0;
1427      -webkit-box-shadow: none;
1428      box-shadow: none;
1429      color: #222;
1430      display: none;
1431      font-size: 14px;
1432      font-size: 0.875rem;
1433      font-weight: 800;
1434      line-height: 1.5;
1435      margin: 1px auto 2px;
1436      padding: 1em;
1437      text-shadow: none;
1438  }
1439  
1440  /* Display the menu toggle when JavaScript is available. */
1441  
1442  .js .menu-toggle {
1443      display: block;
1444  }
1445  
1446  .main-navigation.toggled-on ul.nav-menu {
1447      display: block;
1448  }
1449  
1450  .menu-toggle:hover,
1451  .menu-toggle:focus {
1452      background-color: transparent;
1453      -webkit-box-shadow: none;
1454      box-shadow: none;
1455  }
1456  
1457  .menu-toggle:focus {
1458      outline: thin solid;
1459  }
1460  
1461  .menu-toggle .icon {
1462      margin-right: 0.5em;
1463      top: -2px;
1464  }
1465  
1466  .toggled-on .menu-toggle .icon-bars,
1467  .menu-toggle .icon-close {
1468      display: none;
1469  }
1470  
1471  .toggled-on .menu-toggle .icon-close {
1472      display: inline-block;
1473  }
1474  
1475  /* Dropdown Toggle */
1476  
1477  .dropdown-toggle {
1478      background-color: transparent;
1479      border: 0;
1480      -webkit-box-shadow: none;
1481      box-shadow: none;
1482      color: #222;
1483      display: block;
1484      font-size: 16px;
1485      right: -0.5em;
1486      line-height: 1.5;
1487      margin: 0 auto;
1488      padding: 0.5em;
1489      position: absolute;
1490      text-shadow: none;
1491      top: 0;
1492  }
1493  
1494  .dropdown-toggle:hover,
1495  .dropdown-toggle:focus {
1496      background: transparent;
1497  }
1498  
1499  .dropdown-toggle:focus {
1500      outline: thin dotted;
1501  }
1502  
1503  .dropdown-toggle.toggled-on .icon {
1504      -ms-transform: rotate(-180deg); /* IE 9 */
1505      -webkit-transform: rotate(-180deg); /* Chrome, Safari, Opera */
1506      transform: rotate(-180deg);
1507  }
1508  
1509  /* Scroll down arrow */
1510  
1511  .site-header .menu-scroll-down {
1512      display: none;
1513  }
1514  
1515  /*--------------------------------------------------------------
1516  13.0 Layout
1517  --------------------------------------------------------------*/
1518  
1519  html {
1520      -webkit-box-sizing: border-box;
1521      -moz-box-sizing: border-box;
1522      box-sizing: border-box;
1523  }
1524  
1525  *,
1526  *:before,
1527  *:after {
1528      /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
1529      -webkit-box-sizing: inherit;
1530      -moz-box-sizing: inherit;
1531      box-sizing: inherit;
1532  }
1533  
1534  body {
1535      background: #fff;
1536      /* Fallback for when there is no custom background color defined. */
1537  }
1538  
1539  #page {
1540      position: relative;
1541      word-wrap: break-word;
1542  }
1543  
1544  .wrap {
1545      margin-left: auto;
1546      margin-right: auto;
1547      max-width: 700px;
1548      padding-left: 2em;
1549      padding-right: 2em;
1550  }
1551  
1552  .wrap:after {
1553      clear: both;
1554      content: "";
1555      display: block;
1556  }
1557  
1558  /*--------------------------------------------------------------
1559  13.1 Header
1560  --------------------------------------------------------------*/
1561  
1562  #masthead .wrap {
1563      position: relative;
1564  }
1565  
1566  .site-header {
1567      background-color: #fafafa;
1568      position: relative;
1569  }
1570  
1571  /* Site branding */
1572  
1573  .site-branding {
1574      padding: 1em 0;
1575      position: relative;
1576      -webkit-transition: margin-bottom 0.2s;
1577      transition: margin-bottom 0.2s;
1578      z-index: 3;
1579  }
1580  
1581  .site-branding a {
1582      text-decoration: none;
1583      -webkit-transition: opacity 0.2s;
1584      transition: opacity 0.2s;
1585  }
1586  
1587  .site-branding a:hover,
1588  .site-branding a:focus {
1589      opacity: 0.7;
1590  }
1591  
1592  .site-title {
1593      clear: none;
1594      font-size: 24px;
1595      font-size: 1.5rem;
1596      font-weight: 800;
1597      line-height: 1.25;
1598      letter-spacing: 0.08em;
1599      margin: 0;
1600      padding: 0;
1601      text-transform: uppercase;
1602  }
1603  
1604  .site-title,
1605  .site-title a {
1606      color: #222;
1607      opacity: 1; /* Prevent opacity from changing during selective refreshes in the customize preview */
1608  }
1609  
1610  body.has-header-image .site-title,
1611  body.has-header-video .site-title,
1612  body.has-header-image .site-title a,
1613  body.has-header-video .site-title a {
1614      color: #fff;
1615  }
1616  
1617  .site-description {
1618      color: #666;
1619      font-size: 13px;
1620      font-size: 0.8125rem;
1621      margin-bottom: 0;
1622  }
1623  
1624  body.has-header-image .site-description,
1625  body.has-header-video .site-description {
1626      color: #fff;
1627      opacity: 0.8;
1628  }
1629  
1630  .custom-logo-link {
1631      display: inline-block;
1632      padding-right: 1em;
1633      vertical-align: middle;
1634      width: auto;
1635  }
1636  
1637  .custom-logo-link img {
1638      display: inline-block;
1639      max-height: 80px;
1640      width: auto;
1641  }
1642  
1643  body.home.title-tagline-hidden.has-header-image .custom-logo-link img,
1644  body.home.title-tagline-hidden.has-header-video .custom-logo-link img {
1645      max-height: 200px;
1646      max-width: 100%;
1647  }
1648  
1649  .custom-logo-link a:hover,
1650  .custom-logo-link a:focus {
1651      opacity: 0.9;
1652  }
1653  
1654  body:not(.title-tagline-hidden) .site-branding-text {
1655      display: inline-block;
1656      max-width: 100%;
1657      vertical-align: middle;
1658  }
1659  
1660  .custom-header {
1661      position: relative;
1662  }
1663  
1664  .has-header-image.twentyseventeen-front-page .custom-header,
1665  .has-header-video.twentyseventeen-front-page .custom-header,
1666  .has-header-image.home.blog .custom-header,
1667  .has-header-video.home.blog .custom-header {
1668      display: table;
1669      height: 300px;
1670      height: 75vh;
1671      width: 100%;
1672  }
1673  
1674  .custom-header-media {
1675      bottom: 0;
1676      left: 0;
1677      overflow: hidden;
1678      position: absolute;
1679      right: 0;
1680      top: 0;
1681      width: 100%;
1682  }
1683  
1684  .custom-header-media:before {
1685      /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,0.3+75 */
1686      background: -moz-linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 75%, rgba(0, 0, 0, 0.3) 100%); /* FF3.6-15 */
1687      background: -webkit-linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 75%, rgba(0, 0, 0, 0.3) 100%); /* Chrome10-25,Safari5.1-6 */
1688      background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 75%, rgba(0, 0, 0, 0.3) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
1689      bottom: 0;
1690      content: "";
1691      display: block;
1692      height: 100%;
1693      left: 0;
1694      position: absolute;
1695      right: 0;
1696      z-index: 2;
1697  }
1698  
1699  .has-header-image .custom-header-media img,
1700  .has-header-video .custom-header-media video,
1701  .has-header-video .custom-header-media iframe {
1702      position: fixed;
1703      height: auto;
1704      left: 50%;
1705      max-width: 1000%;
1706      min-height: 100%;
1707      min-width: 100%;
1708      min-width: 100vw; /* vw prevents 1px gap on left that 100% has */
1709      width: auto;
1710      top: 50%;
1711      padding-bottom: 1px; /* Prevent header from extending beyond the footer */
1712      -ms-transform: translateX(-50%) translateY(-50%);
1713      -moz-transform: translateX(-50%) translateY(-50%);
1714      -webkit-transform: translateX(-50%) translateY(-50%);
1715      transform: translateX(-50%) translateY(-50%);
1716  }
1717  
1718  .wp-custom-header .wp-custom-header-video-button { /* Specificity prevents .color-dark button overrides */
1719      background-color: rgba(34, 34, 34, 0.5);
1720      border: 1px solid rgba(255, 255, 255, 0.6);
1721      color: rgba(255, 255, 255, 0.6);
1722      height: 45px;
1723      overflow: hidden;
1724      padding: 0;
1725      position: fixed;
1726      right: 30px;
1727      top: 30px;
1728      -webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
1729      transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
1730      width: 45px;
1731  }
1732  
1733  .wp-custom-header .wp-custom-header-video-button:hover,
1734  .wp-custom-header .wp-custom-header-video-button:focus { /* Specificity prevents .color-dark button overrides */
1735      border-color: rgba(255, 255, 255, 0.8);
1736      background-color: rgba(34, 34, 34, 0.8);
1737      color: #fff;
1738  }
1739  
1740  .admin-bar .wp-custom-header-video-button {
1741      top: 62px;
1742  }
1743  
1744  .has-header-image:not(.twentyseventeen-front-page):not(.home) .custom-header-media img {
1745      bottom: 0;
1746      position: absolute;
1747      top: auto;
1748      -ms-transform: translateX(-50%) translateY(0);
1749      -moz-transform: translateX(-50%) translateY(0);
1750      -webkit-transform: translateX(-50%) translateY(0);
1751      transform: translateX(-50%) translateY(0);
1752  }
1753  
1754  /* For browsers that support 'object-fit' */
1755  @supports ( object-fit: cover ) {
1756      .has-header-image .custom-header-media img,
1757      .has-header-video .custom-header-media video,
1758      .has-header-image:not(.twentyseventeen-front-page):not(.home) .custom-header-media img {
1759          height: 100%;
1760          left: 0;
1761          -o-object-fit: cover;
1762          object-fit: cover;
1763          top: 0;
1764          -ms-transform: none;
1765          -moz-transform: none;
1766          -webkit-transform: none;
1767          transform: none;
1768          width: 100%;
1769      }
1770  }
1771  
1772  /* Hides div in Customizer preview when header images or videos change. */
1773  
1774  body:not(.has-header-image):not(.has-header-video) .custom-header-media {
1775      display: none;
1776  }
1777  
1778  .has-header-image.twentyseventeen-front-page .site-branding,
1779  .has-header-video.twentyseventeen-front-page .site-branding,
1780  .has-header-image.home.blog .site-branding,
1781  .has-header-video.home.blog .site-branding {
1782      display: table-cell;
1783      height: 100%;
1784      vertical-align: bottom;
1785  }
1786  
1787  /*--------------------------------------------------------------
1788  13.2 Front Page
1789  --------------------------------------------------------------*/
1790  
1791  .twentyseventeen-front-page .site-content {
1792      padding: 0;
1793  }
1794  
1795  .twentyseventeen-panel {
1796      overflow: hidden;
1797      position: relative;
1798  }
1799  
1800  .panel-image {
1801      background-position: center center;
1802      background-repeat: no-repeat;
1803      -webkit-background-size: cover;
1804      background-size: cover;
1805      position: relative;
1806  }
1807  
1808  .panel-image:before {
1809      /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,0.3+100 */ /* FF3.6-15 */
1810      background: -webkit-linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 100%); /* Chrome10-25,Safari5.1-6 */
1811      background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.3)));
1812      background: -webkit-linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 100%);
1813      background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
1814      bottom: 0;
1815      content: "";
1816      left: 0;
1817      right: 0;
1818      position: absolute;
1819      top: 100px;
1820  }
1821  
1822  .twentyseventeen-front-page article:not(.has-post-thumbnail):not(:first-child) {
1823      border-top: 1px solid #ddd;
1824  }
1825  
1826  .panel-content {
1827      position: relative;
1828  }
1829  
1830  .panel-content .wrap {
1831      padding-bottom: 0.5em;
1832      padding-top: 1.75em;
1833  }
1834  
1835  /* Panel edit link */
1836  
1837  .twentyseventeen-panel .edit-link {
1838      display: block;
1839      margin: 0.3em 0 0;
1840  }
1841  
1842  .twentyseventeen-panel .entry-header .edit-link {
1843      font-size: 14px;
1844      font-size: 0.875rem;
1845  }
1846  
1847  /* Front Page - Recent Posts */
1848  
1849  .twentyseventeen-front-page .panel-content .recent-posts article {
1850      border: 0;
1851      color: #333;
1852      margin-bottom: 3em;
1853  }
1854  
1855  .recent-posts .entry-header {
1856      margin-bottom: 1.2em;
1857  }
1858  
1859  .page .panel-content .recent-posts .entry-title {
1860      font-size: 20px;
1861      font-size: 1.25rem;
1862      font-weight: 300;
1863      letter-spacing: 0;
1864      text-transform: none;
1865  }
1866  
1867  .twentyseventeen-panel .recent-posts .entry-header .edit-link {
1868      color: #222;
1869      display: inline-block;
1870      font-size: 11px;
1871      font-size: 0.6875rem;
1872      margin-left: 1em;
1873  }
1874  
1875  /*--------------------------------------------------------------
1876  13.3 Regular Content
1877  --------------------------------------------------------------*/
1878  
1879  .site-content-contain {
1880      background-color: #fff;
1881      position: relative;
1882  }
1883  
1884  .site-content {
1885      padding: 2.5em 0 0;
1886  }
1887  
1888  /*--------------------------------------------------------------
1889  13.4 Posts
1890  --------------------------------------------------------------*/
1891  
1892  /* Post Landing Page */
1893  
1894  .sticky {
1895      position: relative;
1896  }
1897  
1898  .post:not(.sticky) .icon-thumb-tack {
1899      display: none;
1900  }
1901  
1902  .sticky .icon-thumb-tack {
1903      display: block;
1904      height: 18px;
1905      left: -1.5em;
1906      position: absolute;
1907      top: 1.65em;
1908      width: 20px;
1909  }
1910  
1911  .page .panel-content .entry-title,
1912  .page-title,
1913  body.page:not(.twentyseventeen-front-page) .entry-title {
1914      color: #222;
1915      font-size: 14px;
1916      font-size: 0.875rem;
1917      font-weight: 800;
1918      letter-spacing: 0.14em;
1919      text-transform: uppercase;
1920  }
1921  
1922  .entry-header .entry-title {
1923      margin-bottom: 0.25em;
1924  }
1925  
1926  .entry-title a {
1927      color: #333;
1928      text-decoration: none;
1929      margin-left: -2px;
1930  }
1931  
1932  .entry-title:not(:first-child) {
1933      padding-top: 0;
1934  }
1935  
1936  .entry-meta {
1937      color: #767676;
1938      font-size: 11px;
1939      font-size: 0.6875rem;
1940      font-weight: 800;
1941      letter-spacing: 0.1818em;
1942      padding-bottom: 0.25em;
1943      text-transform: uppercase;
1944  }
1945  
1946  .entry-meta a {
1947      color: #767676;
1948  }
1949  
1950  .byline,
1951  .updated:not(.published) {
1952      display: none;
1953  }
1954  
1955  .single .byline,
1956  .group-blog .byline {
1957      display: inline;
1958  }
1959  
1960  .pagination,
1961  .comments-pagination {
1962      border-top: 1px solid #eee;
1963      font-size: 14px;
1964      font-size: 0.875rem;
1965      font-weight: 800;
1966      padding: 2em 0 3em;
1967      text-align: center;
1968  }
1969  
1970  .pagination .icon,
1971  .comments-pagination .icon {
1972      width: 0.666666666em;
1973      height: 0.666666666em;
1974  }
1975  
1976  .comments-pagination {
1977      border: 0;
1978  }
1979  
1980  .page-numbers {
1981      display: none;
1982      padding: 0.5em 0.75em;
1983  }
1984  
1985  .page-numbers.current {
1986      color: #767676;
1987      display: inline-block;
1988  }
1989  
1990  .page-numbers.current .screen-reader-text {
1991      clip: auto;
1992      height: auto;
1993      overflow: auto;
1994      position: relative !important;
1995      width: auto;
1996  }
1997  
1998  .prev.page-numbers,
1999  .next.page-numbers {
2000      background-color: #ddd;
2001      -webkit-border-radius: 2px;
2002      border-radius: 2px;
2003      display: inline-block;
2004      font-size: 24px;
2005      font-size: 1.5rem;
2006      line-height: 1;
2007      padding: 0.25em 0.5em 0.4em;
2008  }
2009  
2010  .prev.page-numbers,
2011  .next.page-numbers {
2012      -webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
2013      transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
2014  }
2015  
2016  .prev.page-numbers:focus,
2017  .prev.page-numbers:hover,
2018  .next.page-numbers:focus,
2019  .next.page-numbers:hover {
2020      background-color: #767676;
2021      color: #fff;
2022  }
2023  
2024  .prev.page-numbers {
2025      float: left;
2026  }
2027  
2028  .next.page-numbers {
2029      float: right;
2030  }
2031  
2032  /* Aligned blockquotes */
2033  
2034  .entry-content blockquote.alignleft,
2035  .entry-content blockquote.alignright {
2036      color: #666;
2037      font-size: 13px;
2038      font-size: 0.8125rem;
2039      width: 48%;
2040  }
2041  
2042  /* Blog landing, search, archives */
2043  
2044  .blog .site-main > article,
2045  .archive .site-main > article,
2046  .search .site-main > article {
2047      padding-bottom: 2em;
2048  }
2049  
2050  body:not(.twentyseventeen-front-page) .entry-header {
2051      padding: 1em 0;
2052  }
2053  
2054  body:not(.twentyseventeen-front-page) .entry-header,
2055  body:not(.twentyseventeen-front-page) .entry-content,
2056  body:not(.twentyseventeen-front-page) #comments {
2057      margin-left: auto;
2058      margin-right: auto;
2059  }
2060  
2061  body:not(.twentyseventeen-front-page) .entry-header {
2062      padding-top: 0;
2063  }
2064  
2065  .blog .entry-meta a.post-edit-link,
2066  .archive .entry-meta a.post-edit-link,
2067  .search .entry-meta a.post-edit-link {
2068      color: #222;
2069      display: inline-block;
2070      margin-left: 1em;
2071      white-space: nowrap;
2072  }
2073  
2074  .search .page .entry-meta a.post-edit-link {
2075      margin-left: 0;
2076      white-space: nowrap;
2077  }
2078  
2079  .taxonomy-description {
2080      color: #666;
2081      font-size: 13px;
2082      font-size: 0.8125rem;
2083  }
2084  
2085  /* More tag */
2086  
2087  .entry-content .more-link:before {
2088      content: "";
2089      display: block;
2090      margin-top: 1.5em;
2091  }
2092  
2093  /* Single Post */
2094  
2095  .single-post:not(.has-sidebar) #primary,
2096  .page.page-one-column:not(.twentyseventeen-front-page) #primary,
2097  .archive.page-one-column:not(.has-sidebar) .page-header,
2098  .archive.page-one-column:not(.has-sidebar) #primary {
2099      margin-left: auto;
2100      margin-right: auto;
2101      max-width: 740px;
2102  }
2103  
2104  .single-featured-image-header {
2105      background-color: #fafafa;
2106      border-bottom: 1px solid #eee;
2107  }
2108  
2109  .single-featured-image-header img {
2110      display: block;
2111      margin: auto;
2112  }
2113  
2114  .page-links {
2115      font-size: 14px;
2116      font-size: 0.875rem;
2117      font-weight: 800;
2118      padding: 2em 0 3em;
2119  }
2120  
2121  .page-links .page-number {
2122      color: #767676;
2123      display: inline-block;
2124      padding: 0.5em 1em;
2125  }
2126  
2127  .page-links a {
2128      display: inline-block;
2129  }
2130  
2131  .page-links a .page-number {
2132      color: #222;
2133  }
2134  
2135  /* Entry footer */
2136  
2137  .entry-footer {
2138      border-bottom: 1px solid #eee;
2139      border-top: 1px solid #eee;
2140      margin-top: 2em;
2141      padding: 2em 0;
2142  }
2143  
2144  .entry-footer .cat-links,
2145  .entry-footer .tags-links {
2146      display: block;
2147      font-size: 11px;
2148      font-size: 0.6875rem;
2149      font-weight: 800;
2150      letter-spacing: 0.1818em;
2151      padding-left: 2.5em;
2152      position: relative;
2153      text-transform: uppercase;
2154  }
2155  
2156  .entry-footer .cat-links + .tags-links {
2157      margin-top: 1em;
2158  }
2159  
2160  .entry-footer .cat-links a,
2161  .entry-footer .tags-links a {
2162      color: #333;
2163  }
2164  
2165  .entry-footer .cat-links .icon,
2166  .entry-footer .tags-links .icon {
2167      color: #767676;
2168      left: 0;
2169      margin-right: 0.5em;
2170      position: absolute;
2171      top: 2px;
2172  }
2173  
2174  .entry-footer .edit-link {
2175      display: inline-block;
2176  }
2177  
2178  .entry-footer .edit-link a.post-edit-link {
2179      background-color: #222;
2180      -webkit-border-radius: 2px;
2181      border-radius: 2px;
2182      -webkit-box-shadow: none;
2183      box-shadow: none;
2184      color: #fff;
2185      display: inline-block;
2186      font-size: 14px;
2187      font-size: 0.875rem;
2188      font-weight: 800;
2189      margin-top: 2em;
2190      padding: 0.7em 2em;
2191      -webkit-transition: background-color 0.2s ease-in-out;
2192      transition: background-color 0.2s ease-in-out;
2193      white-space: nowrap;
2194  }
2195  
2196  .entry-footer .edit-link a.post-edit-link:hover,
2197  .entry-footer .edit-link a.post-edit-link:focus {
2198      background-color: #767676;
2199  }
2200  
2201  /* Post Formats */
2202  
2203  .blog .format-status .entry-title,
2204  .archive .format-status .entry-title,
2205  .blog .format-aside .entry-title,
2206  .archive .format-aside .entry-title {
2207      display: none;
2208  }
2209  
2210  .format-quote blockquote {
2211      color: #333;
2212      font-size: 20px;
2213      font-size: 1.25rem;
2214      font-weight: 300;
2215      overflow: visible;
2216      position: relative;
2217  }
2218  
2219  .format-quote blockquote .icon {
2220      display: block;
2221      height: 20px;
2222      left: -1.25em;
2223      position: absolute;
2224      top: 0.4em;
2225      -webkit-transform: scale(-1, 1);
2226      -ms-transform: scale(-1, 1);
2227      transform: scale(-1, 1);
2228      width: 20px;
2229  }
2230  
2231  /* Post Navigation */
2232  
2233  .post-navigation {
2234      font-weight: 800;
2235      margin: 3em 0;
2236  }
2237  
2238  .post-navigation .nav-links {
2239      padding: 1em 0;
2240  }
2241  
2242  .nav-subtitle {
2243      background: transparent;
2244      color: #767676;
2245      display: block;
2246      font-size: 11px;
2247      font-size: 0.6875rem;
2248      letter-spacing: 0.1818em;
2249      margin-bottom: 1em;
2250      text-transform: uppercase;
2251  }
2252  
2253  .nav-title {
2254      color: #333;
2255      font-size: 15px;
2256      font-size: 0.9375rem;
2257  }
2258  
2259  .post-navigation .nav-next {
2260      margin-top: 1.5em;
2261  }
2262  
2263  .nav-links .nav-previous .nav-title .nav-title-icon-wrapper {
2264      margin-right: 0.5em;
2265  }
2266  
2267  .nav-links .nav-next .nav-title .nav-title-icon-wrapper {
2268      margin-left: 0.5em;
2269  }
2270  
2271  /*--------------------------------------------------------------
2272  13.5 Pages
2273  --------------------------------------------------------------*/
2274  
2275  .page-header {
2276      padding-bottom: 2em;
2277  }
2278  
2279  .page .entry-header .edit-link {
2280      font-size: 14px;
2281      font-size: 0.875rem;
2282  }
2283  
2284  .search .page .entry-header .edit-link {
2285      font-size: 11px;
2286      font-size: 0.6875rem;
2287  }
2288  
2289  .page-links {
2290      clear: both;
2291      margin: 0 0 1.5em;
2292  }
2293  
2294  .page:not(.home) #content {
2295      padding-bottom: 1.5em;
2296  }
2297  
2298  /* 404 page */
2299  
2300  .error404 .page-content {
2301      padding-bottom: 4em;
2302  }
2303  
2304  .error404 .page-content .search-form,
2305  .search .page-content .search-form {
2306      margin-bottom: 3em;
2307  }
2308  
2309  /*--------------------------------------------------------------
2310  13.6 Footer
2311  --------------------------------------------------------------*/
2312  
2313  .site-footer {
2314      border-top: 1px solid #eee;
2315  }
2316  
2317  .site-footer .wrap {
2318      padding-bottom: 1.5em;
2319      padding-top: 2em;
2320  }
2321  
2322  /* Footer widgets */
2323  
2324  .site-footer .widget-area {
2325      padding-bottom: 2em;
2326      padding-top: 2em;
2327  }
2328  
2329  /* Social nav */
2330  
2331  .social-navigation {
2332      font-size: 16px;
2333      font-size: 1rem;
2334      margin-bottom: 1em;
2335  }
2336  
2337  .social-navigation ul {
2338      list-style: none;
2339      margin-bottom: 0;
2340      margin-left: 0;
2341  }
2342  
2343  .social-navigation li {
2344      display: inline;
2345  }
2346  
2347  .social-navigation a {
2348      background-color: #767676;
2349      -webkit-border-radius: 40px;
2350      border-radius: 40px;
2351      color: #fff;
2352      display: inline-block;
2353      height: 40px;
2354      margin: 0 1em 0.5em 0;
2355      text-align: center;
2356      width: 40px;
2357  }
2358  
2359  .social-navigation a:hover,
2360  .social-navigation a:focus {
2361      background-color: #333;
2362  }
2363  
2364  .social-navigation .icon {
2365      height: 16px;
2366      top: 12px;
2367      width: 16px;
2368      vertical-align: top;
2369  }
2370  
2371  /* Site info */
2372  
2373  .site-info {
2374      font-size: 14px;
2375      font-size: 0.875rem;
2376      margin-bottom: 1em;
2377  }
2378  
2379  .site-info a {
2380      color: #666;
2381  }
2382  
2383  .site-info .sep {
2384      margin: 0;
2385      display: block;
2386      visibility: hidden;
2387      height: 0;
2388      width: 100%;
2389  }
2390  
2391  .site-info span[role=separator] {
2392      padding: 0 0.2em 0 0.4em;
2393  }
2394  
2395  .site-info span[role=separator]::before {
2396      content: '\002f';
2397  }
2398  
2399  /*--------------------------------------------------------------
2400  14.0 Comments
2401  --------------------------------------------------------------*/
2402  
2403  #comments {
2404      clear: both;
2405      padding: 2em 0 0.5em;
2406  }
2407  
2408  .comments-title {
2409      font-size: 20px;
2410      font-size: 1.25rem;
2411      margin-bottom: 1.5em;
2412  }
2413  
2414  .comment-list,
2415  .comment-list .children {
2416      list-style: none;
2417      margin: 0;
2418      padding: 0;
2419  }
2420  
2421  .comment-list li:before {
2422      display: none;
2423  }
2424  
2425  .comment-body {
2426      margin-left: 65px;
2427  }
2428  
2429  .comment-author {
2430      font-size: 16px;
2431      font-size: 1rem;
2432      margin-bottom: 0.4em;
2433      position: relative;
2434      z-index: 2;
2435  }
2436  
2437  .comment-author .avatar {
2438      height: 50px;
2439      left: -65px;
2440      position: absolute;
2441      width: 50px;
2442  }
2443  
2444  .comment-author .says {
2445      display: none;
2446  }
2447  
2448  .comment-meta {
2449      margin-bottom: 1.5em;
2450  }
2451  
2452  .comment-metadata {
2453      color: #767676;
2454      font-size: 10px;
2455      font-size: 0.625rem;
2456      font-weight: 800;
2457      letter-spacing: 0.1818em;
2458      text-transform: uppercase;
2459  }
2460  
2461  .comment-metadata a {
2462      color: #767676;
2463  }
2464  
2465  .comment-metadata a.comment-edit-link {
2466      color: #222;
2467      margin-left: 1em;
2468  }
2469  
2470  .comment-body {
2471      color: #333;
2472      font-size: 14px;
2473      font-size: 0.875rem;
2474      margin-bottom: 4em;
2475  }
2476  
2477  .comment-reply-link {
2478      font-weight: 800;
2479      position: relative;
2480  }
2481  
2482  .comment-reply-link .icon {
2483      color: #222;
2484      left: -2em;
2485      height: 1em;
2486      position: absolute;
2487      top: 0;
2488      width: 1em;
2489  }
2490  
2491  .children .comment-author .avatar {
2492      height: 30px;
2493      left: -45px;
2494      width: 30px;
2495  }
2496  
2497  .bypostauthor > .comment-body > .comment-meta > .comment-author .avatar {
2498      border: 1px solid #333;
2499      padding: 2px;
2500  }
2501  
2502  .no-comments,
2503  .comment-awaiting-moderation {
2504      color: #767676;
2505      font-size: 14px;
2506      font-size: 0.875rem;
2507      font-style: italic;
2508  }
2509  
2510  .comments-pagination {
2511      margin: 2em 0 3em;
2512  }
2513  
2514  .form-submit {
2515      text-align: right;
2516  }
2517  
2518  .comment-form #wp-comment-cookies-consent {
2519      margin: 0 10px 0 0;
2520  }
2521  
2522  .comment-form .comment-form-cookies-consent label {
2523      display: inline;
2524  }
2525  
2526  /*--------------------------------------------------------------
2527  15.0 Widgets
2528  --------------------------------------------------------------*/
2529  
2530  #secondary {
2531      padding: 1em 0 2em;
2532  }
2533  
2534  .widget {
2535      padding-bottom: 3em;
2536  }
2537  
2538  h2.widget-title {
2539      color: #222;
2540      font-size: 13px;
2541      font-size: 0.8125rem;
2542      font-weight: 800;
2543      letter-spacing: 0.1818em;
2544      margin-bottom: 1.5em;
2545      text-transform: uppercase;
2546  }
2547  
2548  .widget-title a {
2549      color: inherit;
2550  }
2551  
2552  /* widget forms */
2553  
2554  .widget select {
2555      width: 100%;
2556  }
2557  
2558  
2559  /* widget lists */
2560  
2561  .widget ul {
2562      list-style: none;
2563      margin: 0;
2564  }
2565  
2566  .widget ul li,
2567  .widget ol li {
2568      border-bottom: 1px solid #ddd;
2569      border-top: 1px solid #ddd;
2570      padding: 0.5em 0;
2571  }
2572  
2573  .widget:not(.widget_tag_cloud) ul li + li {
2574      margin-top: -1px;
2575  }
2576  
2577  .widget ul li ul {
2578      margin: 0 0 -1px;
2579      padding: 0;
2580      position: relative;
2581  }
2582  
2583  .widget ul li li {
2584      border: 0;
2585      padding-left: 24px;
2586      padding-left: 1.5rem;
2587  }
2588  
2589  /* Widget lists of links */
2590  
2591  .widget_top-posts ul li ul,
2592  .widget_rss_links ul li ul,
2593  .widget-grofile ul.grofile-links li ul,
2594  .widget_pages ul li ul,
2595  .widget_meta ul li ul {
2596      bottom: 0;
2597  }
2598  
2599  .widget_nav_menu ul li li,
2600  .widget_top-posts ul li,
2601  .widget_top-posts ul li li,
2602  .widget_rss_links ul li,
2603  .widget_rss_links ul li li,
2604  .widget-grofile ul.grofile-links li,
2605  .widget-grofile ul.grofile-links li li {
2606      padding-bottom: 0.25em;
2607      padding-top: 0.25em;
2608  }
2609  
2610  .widget_rss ul li {
2611      padding-bottom: 1em;
2612      padding-top: 1em;
2613  }
2614  
2615  /* Widget markup */
2616  
2617  .widget .post-date,
2618  .widget .rss-date {
2619      font-size: 0.81em;
2620  }
2621  
2622  /* Text widget */
2623  
2624  .widget_text {
2625      word-wrap: break-word;
2626  }
2627  
2628  .widget_text ul {
2629      list-style: disc;
2630      margin: 0 0 1.5em 1.5em;
2631  }
2632  
2633  .widget_text ol {
2634      list-style: decimal;
2635  }
2636  
2637  .widget_text ul li,
2638  .widget_text ol li {
2639      border: none;
2640  }
2641  
2642  .widget_text ul li:last-child,
2643  .widget_text ol li:last-child {
2644      padding-bottom: 0;
2645  }
2646  
2647  .widget_text ul li ul {
2648      margin: 0 0 0 1.5em;
2649  }
2650  
2651  .widget_text ul li li {
2652      padding-left: 0;
2653      padding-right: 0;
2654  }
2655  
2656  .widget_text ol li {
2657      list-style-position: inside;
2658  }
2659  
2660  .widget_text ol li + li {
2661      margin-top: -1px;
2662  }
2663  
2664  /* RSS Widget */
2665  
2666  .widget_rss .widget-title .rsswidget:first-child:not(.rss-widget-title) {
2667      float: right;
2668  }
2669  
2670  .widget_rss .widget-title .rsswidget:first-child:hover {
2671      background-color: transparent;
2672  }
2673  
2674  .widget_rss .widget-title .rsswidget:first-child img {
2675      display: block;
2676  }
2677  
2678  .widget_rss ul li {
2679      padding: 2.125em 0;
2680  }
2681  
2682  .widget_rss ul li:first-child {
2683      border-top: none;
2684      padding-top: 0;
2685  }
2686  
2687  .widget_rss li .rsswidget {
2688      font-size: 22px;
2689      font-size: 1.375rem;
2690      font-weight: 300;
2691      line-height: 1.4;
2692  }
2693  
2694  .widget_rss .rss-date,
2695  .widget_rss li cite {
2696      color: #767676;
2697      display: block;
2698      font-size: 10px;
2699      font-size: 0.625rem;
2700      font-style: normal;
2701      font-weight: 800;
2702      letter-spacing: 0.18em;
2703      line-height: 1.5;
2704      text-transform: uppercase;
2705  }
2706  
2707  .widget_rss .rss-date {
2708      margin: 0.5em 0 1.5em;
2709      padding: 0;
2710  }
2711  
2712  .widget_rss .rssSummary {
2713      margin-bottom: 0.5em;
2714  }
2715  
2716  /* Contact Info Widget */
2717  
2718  .widget_contact_info .contact-map {
2719      margin-bottom: 0.5em;
2720  }
2721  
2722  /* Gravatar */
2723  
2724  .widget-grofile h4 {
2725      font-size: 16px;
2726      font-size: 1rem;
2727      margin-bottom: 0;
2728  }
2729  
2730  /* Recent Comments */
2731  
2732  .widget_recent_comments table,
2733  .widget_recent_comments th,
2734  .widget_recent_comments td {
2735      border: 0;
2736  }
2737  
2738  /* Recent Posts widget */
2739  
2740  .widget_recent_entries .post-date {
2741      display: block;
2742  }
2743  
2744  /* Search */
2745  
2746  .search-form {
2747      position: relative;
2748  }
2749  
2750  .search-form .search-submit {
2751      bottom: 3px;
2752      padding: 0.5em 1em;
2753      position: absolute;
2754      right: 3px;
2755      top: 3px;
2756  }
2757  
2758  .search-form .search-submit .icon {
2759      height: 24px;
2760      top: -2px;
2761      width: 24px;
2762  }
2763  
2764  /* Tag cloud widget */
2765  
2766  .tagcloud ul li {
2767      float: left;
2768      border-top: 0;
2769      border-bottom: 0;
2770      padding: 0;
2771      margin: 4px 4px 0 0;
2772  }
2773  
2774  .tagcloud,
2775  .widget_tag_cloud,
2776  .wp_widget_tag_cloud {
2777      line-height: 1.5;
2778  }
2779  
2780  .widget .tagcloud a,
2781  .widget.widget_tag_cloud a,
2782  .wp_widget_tag_cloud a {
2783      border: 1px solid #ddd;
2784      -webkit-box-shadow: none;
2785      box-shadow: none;
2786      display: block;
2787      padding: 4px 10px 5px;
2788      position: relative;
2789      -webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
2790      transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
2791      width: auto;
2792      word-wrap: break-word;
2793      z-index: 0;
2794  }
2795  
2796  .widget .tagcloud a:hover,
2797  .widget .tagcloud a:focus,
2798  .widget.widget_tag_cloud a:hover,
2799  .widget.widget_tag_cloud a:focus,
2800  .wp_widget_tag_cloud a:hover,
2801  .wp_widget_tag_cloud a:focus {
2802      border-color: #bbb;
2803      -webkit-box-shadow: none;
2804      box-shadow: none;
2805      text-decoration: none;
2806  }
2807  
2808  /* Calendar widget */
2809  
2810  .widget_calendar .wp-calendar-table {
2811      margin-bottom: 0;
2812  }
2813  
2814  .widget_calendar .wp-calendar-nav {
2815      display: table;
2816      width: 100%;
2817      margin: 0 0 1.5em;
2818      padding: 0.4em 0;
2819  }
2820  
2821  .widget_calendar .wp-calendar-nav span {
2822      display: table-cell;
2823  }
2824  
2825  .widget_calendar .wp-calendar-nav-prev,
2826  .widget_calendar .wp-calendar-nav-next {
2827      width: 40%;
2828  }
2829  
2830  .widget_calendar th,
2831  .widget_calendar td,
2832  .widget_calendar .wp-calendar-nav span {
2833      text-align: center;
2834  }
2835  
2836  .widget_calendar tfoot td {
2837      border: 0;
2838  }
2839  
2840  /* Gallery widget */
2841  
2842  .gallery-columns-5 .gallery-caption,
2843  .gallery-columns-6 .gallery-caption,
2844  .gallery-columns-7 .gallery-caption,
2845  .gallery-columns-8 .gallery-caption,
2846  .gallery-columns-9 .gallery-caption {
2847      display: none;
2848  }
2849  
2850  /*--------------------------------------------------------------
2851  16.0 Media
2852  --------------------------------------------------------------*/
2853  
2854  img,
2855  video {
2856      height: auto; /* Make sure images are scaled correctly. */
2857      max-width: 100%; /* Adhere to container width. */
2858  }
2859  
2860  img.alignleft,
2861  img.alignright {
2862      float: none;
2863      margin: 0;
2864  }
2865  
2866  .page-content .wp-smiley,
2867  .entry-content .wp-smiley,
2868  .comment-content .wp-smiley {
2869      border: none;
2870      margin-bottom: 0;
2871      margin-top: 0;
2872      padding: 0;
2873  }
2874  
2875  audio:focus,
2876  video:focus {
2877      outline: thin dotted;
2878  }
2879  
2880  /* Make sure embeds and iframes fit their containers. */
2881  
2882  embed,
2883  iframe,
2884  object {
2885      margin-bottom: 1.5em;
2886      max-width: 100%;
2887  }
2888  
2889  /* Remove bottom on embeds that wrapped in paragraphs via wpautop. */
2890  
2891  p > embed:only-child,
2892  p > iframe:only-child,
2893  p > object:only-child {
2894      margin-bottom: 0;
2895  }
2896  
2897  .wp-caption,
2898  .gallery-caption {
2899      color: #666;
2900      font-size: 13px;
2901      font-size: 0.8125rem;
2902      font-style: italic;
2903      margin-bottom: 1.5em;
2904      max-width: 100%;
2905  }
2906  
2907  .wp-caption img[class*="wp-image-"] {
2908      display: block;
2909      margin-left: auto;
2910      margin-right: auto;
2911  }
2912  
2913  .wp-caption .wp-caption-text {
2914      margin: 0.8075em 0;
2915  }
2916  
2917  /* Media Elements */
2918  
2919  .mejs-container {
2920      margin-bottom: 1.5em;
2921  }
2922  
2923  /* Audio Player */
2924  
2925  .mejs-controls a.mejs-horizontal-volume-slider,
2926  .mejs-controls a.mejs-horizontal-volume-slider:focus,
2927  .mejs-controls a.mejs-horizontal-volume-slider:hover {
2928      background: transparent;
2929      border: 0;
2930  }
2931  
2932  /* Playlist Color Overrides: Light */
2933  
2934  .site-content .wp-playlist-light {
2935      border-color: #eee;
2936      color: #222;
2937  }
2938  
2939  .site-content .wp-playlist-light .wp-playlist-current-item .wp-playlist-item-album {
2940      color: #333;
2941  }
2942  
2943  .site-content .wp-playlist-light .wp-playlist-current-item .wp-playlist-item-artist {
2944      color: #767676;
2945  }
2946  
2947  .site-content .wp-playlist-light .wp-playlist-item {
2948      border-bottom: 1px dotted #eee;
2949      -webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
2950      transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
2951  }
2952  
2953  .site-content .wp-playlist-light .wp-playlist-item:hover,
2954  .site-content .wp-playlist-light .wp-playlist-item:focus {
2955      border-bottom-color: rgba(0, 0, 0, 0);
2956      background-color: #767676;
2957      color: #fff;
2958  }
2959  
2960  .site-content .wp-playlist-light a.wp-playlist-caption:hover,
2961  .site-content .wp-playlist-light .wp-playlist-item:hover a,
2962  .site-content .wp-playlist-light .wp-playlist-item:focus a {
2963      color: #fff;
2964  }
2965  
2966  /* Playlist Color Overrides: Dark */
2967  
2968  .site-content .wp-playlist-dark {
2969      background: #222;
2970      border-color: #333;
2971  }
2972  
2973  .site-content .wp-playlist-dark .mejs-container .mejs-controls {
2974      background-color: #333;
2975  }
2976  
2977  .site-content .wp-playlist-dark .wp-playlist-caption {
2978      color: #fff;
2979  }
2980  
2981  .site-content .wp-playlist-dark .wp-playlist-current-item .wp-playlist-item-album {
2982      color: #eee;
2983  }
2984  
2985  .site-content .wp-playlist-dark .wp-playlist-current-item .wp-playlist-item-artist {
2986      color: #aaa;
2987  }
2988  
2989  .site-content .wp-playlist-dark .wp-playlist-playing {
2990      background-color: #333;
2991  }
2992  
2993  .site-content .wp-playlist-dark .wp-playlist-item {
2994      border-bottom: 1px dotted #555;
2995      -webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
2996      transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
2997  }
2998  
2999  .site-content .wp-playlist-dark .wp-playlist-item:hover,
3000  .site-content .wp-playlist-dark .wp-playlist-item:focus {
3001      border-bottom-color: rgba(0, 0, 0, 0);
3002      background-color: #aaa;
3003      color: #222;
3004  }
3005  
3006  .site-content .wp-playlist-dark a.wp-playlist-caption:hover,
3007  .site-content .wp-playlist-dark .wp-playlist-item:hover a,
3008  .site-content .wp-playlist-dark .wp-playlist-item:focus a {
3009      color: #222;
3010  }
3011  
3012  /* Playlist Style Overrides */
3013  
3014  .site-content .wp-playlist {
3015      padding: 0.625em 0.625em 0.3125em;
3016  }
3017  
3018  .site-content .wp-playlist-current-item .wp-playlist-item-title {
3019      font-weight: 700;
3020  }
3021  
3022  .site-content .wp-playlist-current-item .wp-playlist-item-album {
3023      font-style: normal;
3024  }
3025  
3026  .site-content .wp-playlist-current-item .wp-playlist-item-artist {
3027      font-size: 10px;
3028      font-size: 0.625rem;
3029      font-weight: 800;
3030      letter-spacing: 0.1818em;
3031      text-transform: uppercase;
3032  }
3033  
3034  .site-content .wp-playlist-item {
3035      padding: 0 0.3125em;
3036      cursor: pointer;
3037  }
3038  
3039  .site-content .wp-playlist-item:last-of-type {
3040      border-bottom: none;
3041  }
3042  
3043  .site-content .wp-playlist-item a {
3044      padding: 0.3125em 0;
3045      border-bottom: none;
3046  }
3047  
3048  .site-content .wp-playlist-item a,
3049  .site-content .wp-playlist-item a:focus,
3050  .site-content .wp-playlist-item a:hover {
3051      -webkit-box-shadow: none;
3052      box-shadow: none;
3053      background: transparent;
3054  }
3055  
3056  .site-content .wp-playlist-item-length {
3057      top: 5px;
3058  }
3059  
3060  /* SVG Icons base styles */
3061  
3062  .icon {
3063      display: inline-block;
3064      fill: currentColor;
3065      height: 1em;
3066      position: relative; /* Align more nicely with capital letters */
3067      top: -0.0625em;
3068      vertical-align: middle;
3069      width: 1em;
3070  }
3071  
3072  /*--------------------------------------------------------------
3073  16.1 Galleries
3074  --------------------------------------------------------------*/
3075  
3076  .gallery-item {
3077      display: inline-block;
3078      text-align: left;
3079      vertical-align: top;
3080      margin: 0 0 1.5em;
3081      padding: 0 1em 0 0;
3082      width: 50%;
3083  }
3084  
3085  .gallery-columns-1 .gallery-item {
3086      width: 100%;
3087  }
3088  
3089  .gallery-columns-2 .gallery-item {
3090      max-width: 50%;
3091  }
3092  
3093  .gallery-item a,
3094  .gallery-item a:hover,
3095  .gallery-item a:focus,
3096  .widget-area .gallery-item a,
3097  .widget-area .gallery-item a:hover,
3098  .widget-area .gallery-item a:focus {
3099      -webkit-box-shadow: none;
3100      box-shadow: none;
3101      background: none;
3102      display: inline-block;
3103      max-width: 100%;
3104  }
3105  
3106  .gallery-item a img {
3107      display: block;
3108      -webkit-transition: -webkit-filter 0.2s ease-in;
3109      transition: -webkit-filter 0.2s ease-in;
3110      transition: filter 0.2s ease-in;
3111      transition: filter 0.2s ease-in, -webkit-filter 0.2s ease-in;
3112      -webkit-backface-visibility: hidden;
3113      backface-visibility: hidden;
3114  }
3115  
3116  .gallery-item a:hover img,
3117  .gallery-item a:focus img {
3118      -webkit-filter: opacity(60%);
3119      filter: opacity(60%);
3120  }
3121  
3122  .gallery-caption {
3123      display: block;
3124      text-align: left;
3125      padding: 0 10px 0 0;
3126      margin-bottom: 0;
3127  }
3128  
3129  /*--------------------------------------------------------------
3130  17.0 Customizer
3131  --------------------------------------------------------------*/
3132  
3133  .highlight-front-sections.twentyseventeen-customizer.twentyseventeen-front-page .twentyseventeen-panel:after {
3134      border: 2px dashed #0085ba; /* Matches visible edit shortcuts. */
3135      bottom: 1em;
3136      content: "";
3137      display: block;
3138      left: 1em;
3139      position: absolute;
3140      right: 1em;
3141      top: 1em;
3142      z-index: 1;
3143  }
3144  
3145  .highlight-front-sections.twentyseventeen-customizer.twentyseventeen-front-page .twentyseventeen-panel .panel-content {
3146      z-index: 2; /* Prevent :after from preventing interactions within the section */
3147  }
3148  
3149  /* Used for placeholder text */
3150  .twentyseventeen-customizer.twentyseventeen-front-page .twentyseventeen-panel .twentyseventeen-panel-title {
3151      display: block;
3152      font-size: 14px;
3153      font-size: 0.875rem;
3154      font-weight: 700;
3155      letter-spacing: 1px;
3156      padding: 3em;
3157      text-transform: uppercase;
3158      text-align: center;
3159  }
3160  
3161  /* Show borders on the custom page panels only when the front page sections are being edited */
3162  .highlight-front-sections.twentyseventeen-customizer.twentyseventeen-front-page .twentyseventeen-panel:nth-of-type(1):after {
3163      border: none;
3164  }
3165  
3166  .twentyseventeen-front-page.twentyseventeen-customizer #primary article.panel-placeholder {
3167      border: 0;
3168  }
3169  
3170  /* Add some space around the visual edit shortcut buttons. */
3171  .twentyseventeen-panel > .customize-partial-edit-shortcut > button {
3172      top: 30px;
3173      left: 30px;
3174  }
3175  
3176  /* Ensure that placeholder icons are visible. */
3177  .twentyseventeen-panel .customize-partial-edit-shortcut-hidden:before {
3178      visibility: visible;
3179  }
3180  
3181  /*--------------------------------------------------------------
3182  18.0 SVGs Fallbacks
3183  --------------------------------------------------------------*/
3184  
3185  .svg-fallback {
3186      display: none;
3187  }
3188  
3189  .no-svg .svg-fallback {
3190      display: inline-block;
3191  }
3192  
3193  .no-svg .dropdown-toggle {
3194      padding: 0.5em 0 0;
3195      right: 0;
3196      text-align: center;
3197      width: 2em;
3198  }
3199  
3200  .no-svg .dropdown-toggle .svg-fallback.icon-angle-down {
3201      font-size: 20px;
3202      font-size: 1.25rem;
3203      font-weight: 400;
3204      line-height: 1;
3205      -webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */
3206      -ms-transform: rotate(180deg); /* IE 9 */
3207      transform: rotate(180deg);
3208  }
3209  
3210  .no-svg .dropdown-toggle.toggled-on .svg-fallback.icon-angle-down {
3211      -webkit-transform: rotate(0); /* Chrome, Safari, Opera */
3212      -ms-transform: rotate(0); /* IE 9 */
3213      transform: rotate(0);
3214  }
3215  
3216  .no-svg .dropdown-toggle .svg-fallback.icon-angle-down:before {
3217      content: "\005E";
3218  }
3219  
3220  /* Social Menu fallbacks */
3221  
3222  .no-svg .social-navigation a {
3223      background: transparent;
3224      color: #222;
3225      height: auto;
3226      width: auto;
3227  }
3228  
3229  /* Show screen reader text in some cases */
3230  
3231  .no-svg .next.page-numbers .screen-reader-text,
3232  .no-svg .prev.page-numbers .screen-reader-text,
3233  .no-svg .social-navigation li a .screen-reader-text,
3234  .no-svg .search-submit .screen-reader-text {
3235      clip: auto;
3236      font-size: 16px;
3237      font-size: 1rem;
3238      font-weight: 400;
3239      height: auto;
3240      position: relative !important; /* overrides previous !important styles */
3241      width: auto;
3242  }
3243  
3244  /*--------------------------------------------------------------
3245  19.0 Media Queries
3246  --------------------------------------------------------------*/
3247  
3248  /* Adjust positioning of edit shortcuts, override style in customize-preview.css */
3249  @media screen and (min-width: 20em) {
3250  
3251      body.customize-partial-edit-shortcuts-shown .site-header .site-title {
3252          padding-left: 0;
3253      }
3254  }
3255  
3256  @media screen and (min-width: 30em) {
3257  
3258      /* Typography */
3259  
3260      body,
3261      button,
3262      input,
3263      select,
3264      textarea {
3265          font-size: 18px;
3266          font-size: 1.125rem;
3267      }
3268  
3269      h1 {
3270          font-size: 30px;
3271          font-size: 1.875rem;
3272      }
3273  
3274      h2,
3275      .home.blog .entry-title,
3276      .page .panel-content .recent-posts .entry-title {
3277          font-size: 26px;
3278          font-size: 1.625rem;
3279      }
3280  
3281      h3 {
3282          font-size: 22px;
3283          font-size: 1.375rem;
3284      }
3285  
3286      h4 {
3287          font-size: 18px;
3288          font-size: 1.125rem;
3289      }
3290  
3291      h5 {
3292          font-size: 13px;
3293          font-size: 0.8125rem;
3294      }
3295  
3296      h6 {
3297          font-size: 16px;
3298          font-size: 1rem;
3299      }
3300  
3301      .entry-content blockquote.alignleft,
3302      .entry-content blockquote.alignright {
3303          font-size: 14px;
3304          font-size: 0.875rem;
3305      }
3306  
3307      /* Fix image alignment */
3308      img.alignleft {
3309          float: left;
3310          margin-right: 1.5em;
3311      }
3312  
3313      img.alignright {
3314          float: right;
3315          margin-left: 1.5em;
3316      }
3317  
3318      /* Site Branding */
3319  
3320      .site-branding {
3321          padding: 3em 0;
3322      }
3323  
3324      /* Front Page */
3325  
3326      .panel-content .wrap {
3327          padding-bottom: 2em;
3328          padding-top: 3.5em;
3329      }
3330  
3331      .page-one-column .panel-content .wrap {
3332          max-width: 740px;
3333      }
3334  
3335      .panel-content .entry-header {
3336          margin-bottom: 4.5em;
3337      }
3338  
3339      .panel-content .recent-posts .entry-header {
3340          margin-bottom: 0;
3341      }
3342  
3343      /* Blog Index, Archive, Search */
3344  
3345      .taxonomy-description {
3346          font-size: 14px;
3347          font-size: 0.875rem;
3348      }
3349  
3350      .page-numbers.current {
3351          font-size: 16px;
3352          font-size: 1rem;
3353      }
3354  
3355      /* Site Footer */
3356  
3357      .site-footer {
3358          font-size: 16px;
3359          font-size: 1rem;
3360      }
3361  
3362      /* Gallery Columns */
3363  
3364      .gallery-item {
3365          max-width: 25%;
3366      }
3367  
3368      .gallery-columns-1 .gallery-item {
3369          max-width: 100%;
3370      }
3371  
3372      .gallery-columns-2 .gallery-item {
3373          max-width: 50%;
3374      }
3375  
3376      .gallery-columns-3 .gallery-item {
3377          max-width: 33.33%;
3378      }
3379  
3380      .gallery-columns-4 .gallery-item {
3381          max-width: 25%;
3382      }
3383  }
3384  
3385  @media screen and (min-width: 48em) {
3386      html {
3387          scroll-padding-top: calc( var(--wp-admin--admin-bar--height, 0px) + 72px );
3388      }
3389  
3390      /* Typography */
3391  
3392      body,
3393      button,
3394      input,
3395      select,
3396      textarea {
3397          font-size: 16px;
3398          font-size: 1rem;
3399          line-height: 1.5;
3400      }
3401  
3402      .entry-content blockquote.alignleft,
3403      .entry-content blockquote.alignright {
3404          font-size: 13px;
3405          font-size: 0.8125rem;
3406      }
3407  
3408      /* Layout */
3409  
3410      .wrap {
3411          max-width: 1000px;
3412          padding-left: 3em;
3413          padding-right: 3em;
3414      }
3415  
3416      .has-sidebar:not(.error404) #primary {
3417          float: left;
3418          width: 58%;
3419      }
3420  
3421      .has-sidebar #secondary {
3422          float: right;
3423          padding-top: 0;
3424          width: 36%;
3425      }
3426  
3427      .error404 #primary {
3428          float: none;
3429      }
3430  
3431      /* Site Branding */
3432  
3433      .site-branding {
3434          margin-bottom: 0;
3435      }
3436  
3437      .has-header-image.twentyseventeen-front-page .site-branding,
3438      .has-header-video.twentyseventeen-front-page .site-branding,
3439      .has-header-image.home.blog .site-branding,
3440      .has-header-video.home.blog .site-branding {
3441          bottom: 0;
3442          display: block;
3443          left: 0;
3444          height: auto;
3445          padding-top: 0;
3446          position: absolute;
3447          width: 100%;
3448      }
3449  
3450      .has-header-image.twentyseventeen-front-page .custom-header,
3451      .has-header-video.twentyseventeen-front-page .custom-header,
3452      .has-header-image.home.blog .custom-header,
3453      .has-header-video.home.blog .custom-header {
3454          display: block;
3455          height: auto;
3456      }
3457  
3458      .custom-header-media {
3459          height: 165px;
3460          position: relative;
3461      }
3462  
3463      .twentyseventeen-front-page.has-header-image .custom-header-media,
3464      .twentyseventeen-front-page.has-header-video .custom-header-media,
3465      .home.blog.has-header-image .custom-header-media,
3466      .home.blog.has-header-video .custom-header-media {
3467          height: 0;
3468          position: relative;
3469      }
3470  
3471      .has-header-image:not(.twentyseventeen-front-page):not(.home) .custom-header-media,
3472      .has-header-video:not(.twentyseventeen-front-page):not(.home) .custom-header-media {
3473          bottom: 0;
3474          height: auto;
3475          left: 0;
3476          position: absolute;
3477          right: 0;
3478          top: 0;
3479      }
3480  
3481      .custom-logo-link {
3482          padding-right: 2em;
3483      }
3484  
3485      .custom-logo-link img,
3486      body.home.title-tagline-hidden.has-header-image .custom-logo-link img,
3487      body.home.title-tagline-hidden.has-header-video .custom-logo-link img {
3488          max-width: 350px;
3489      }
3490  
3491      .title-tagline-hidden.home.has-header-image .custom-logo-link img,
3492      .title-tagline-hidden.home.has-header-video .custom-logo-link img {
3493          max-height: 200px;
3494      }
3495  
3496      .site-title {
3497          font-size: 36px;
3498          font-size: 2.25rem;
3499      }
3500  
3501      .site-description {
3502          font-size: 16px;
3503          font-size: 1rem;
3504      }
3505  
3506      /* Navigation */
3507  
3508      .navigation-top {
3509          bottom: 0;
3510          font-size: 14px;
3511          font-size: 0.875rem;
3512          left: 0;
3513          position: absolute;
3514          right: 0;
3515          width: 100%;
3516          z-index: 3;
3517      }
3518  
3519      .navigation-top .wrap {
3520          max-width: 1000px;
3521          /* The font size is 14px here and we need 50px padding in ems */
3522          padding: 0.75em 3.4166666666667em;
3523      }
3524  
3525      .navigation-top nav {
3526          margin-left: -1.25em;
3527      }
3528  
3529      .site-navigation-fixed.navigation-top {
3530          bottom: auto;
3531          position: fixed;
3532          left: 0;
3533          right: 0;
3534          top: 0;
3535          width: 100%;
3536          z-index: 1000;
3537      }
3538  
3539      .admin-bar .site-navigation-fixed.navigation-top {
3540          top: 32px;
3541      }
3542  
3543      /* Main Navigation */
3544  
3545      .js .menu-toggle,
3546      .js .dropdown-toggle {
3547          display: none;
3548      }
3549  
3550      .main-navigation {
3551          width: auto;
3552      }
3553  
3554      .js .main-navigation ul,
3555      .js .main-navigation ul ul,
3556      .js .main-navigation > div > ul {
3557          display: block;
3558      }
3559  
3560      .main-navigation ul {
3561          background: transparent;
3562          padding: 0;
3563      }
3564  
3565      .main-navigation > div > ul {
3566          border: 0;
3567          margin-bottom: 0;
3568          padding: 0;
3569      }
3570  
3571      .main-navigation li {
3572          border: 0;
3573          display: inline-block;
3574      }
3575  
3576      .main-navigation li li {
3577          display: block;
3578      }
3579  
3580      .main-navigation a {
3581          padding: 1em 1.25em;
3582      }
3583  
3584      .main-navigation ul ul {
3585          background: #fff;
3586          border: 1px solid #bbb;
3587          left: -999em;
3588          padding: 0;
3589          position: absolute;
3590          top: 100%;
3591          z-index: 99999;
3592      }
3593  
3594      .main-navigation ul li.menu-item-has-children:before,
3595      .main-navigation ul li.menu-item-has-children:after,
3596      .main-navigation ul li.page_item_has_children:before,
3597      .main-navigation ul li.page_item_has_children:after {
3598          border-style: solid;
3599          border-width: 0 6px 6px;
3600          content: "";
3601          display: none;
3602          height: 0;
3603          position: absolute;
3604          right: 1em;
3605          bottom: -1px;
3606          width: 0;
3607          z-index: 100000;
3608      }
3609  
3610      .main-navigation ul li.menu-item-has-children.focus:before,
3611      .main-navigation ul li.menu-item-has-children:hover:before,
3612      .main-navigation ul li.menu-item-has-children.focus:after,
3613      .main-navigation ul li.menu-item-has-children:hover:after,
3614      .main-navigation ul li.page_item_has_children.focus:before,
3615      .main-navigation ul li.page_item_has_children:hover:before,
3616      .main-navigation ul li.page_item_has_children.focus:after,
3617      .main-navigation ul li.page_item_has_children:hover:after {
3618          display: block;
3619      }
3620  
3621      .main-navigation ul li.menu-item-has-children:before,
3622      .main-navigation ul li.page_item_has_children:before {
3623          border-color: transparent transparent #bbb;
3624          bottom: 0;
3625      }
3626  
3627      .main-navigation ul li.menu-item-has-children:after,
3628      .main-navigation ul li.page_item_has_children:after {
3629          border-color: transparent transparent #fff;
3630      }
3631  
3632      .main-navigation ul ul li:hover > ul,
3633      .main-navigation ul ul li.focus > ul {
3634          left: 100%;
3635          right: auto;
3636      }
3637  
3638      .main-navigation ul ul a {
3639          padding: 0.75em 1.25em;
3640          width: 16em;
3641      }
3642  
3643      .main-navigation li li {
3644          -webkit-transition: background-color 0.2s ease-in-out;
3645          transition: background-color 0.2s ease-in-out;
3646      }
3647  
3648      .main-navigation li li:hover,
3649      .main-navigation li li.focus {
3650          background: #767676;
3651      }
3652  
3653      .main-navigation li li a {
3654          -webkit-transition: color 0.3s ease-in-out;
3655          transition: color 0.3s ease-in-out;
3656      }
3657  
3658      .main-navigation li li.focus > a,
3659      .main-navigation li li:focus > a,
3660      .main-navigation li li:hover > a,
3661      .main-navigation li li a:hover,
3662      .main-navigation li li a:focus,
3663      .main-navigation li li.current_page_item a:hover,
3664      .main-navigation li li.current-menu-item a:hover,
3665      .main-navigation li li.current_page_item a:focus,
3666      .main-navigation li li.current-menu-item a:focus {
3667          color: #fff;
3668      }
3669  
3670      .main-navigation ul li:hover > ul,
3671      .main-navigation ul li.focus > ul {
3672          left: 0.5em;
3673          right: auto;
3674      }
3675  
3676      .main-navigation .menu-item-has-children > a > .icon,
3677      .main-navigation .page_item_has_children > a > .icon {
3678          display: inline;
3679          left: 5px;
3680          position: relative;
3681          top: -1px;
3682      }
3683  
3684      .main-navigation ul ul .menu-item-has-children > a > .icon,
3685      .main-navigation ul ul .page_item_has_children > a > .icon {
3686          margin-top: -9px;
3687          left: auto;
3688          position: absolute;
3689          right: 1em;
3690          top: 50%;
3691          -webkit-transform: rotate(-90deg); /* Chrome, Safari, Opera */
3692          -ms-transform: rotate(-90deg); /* IE 9 */
3693          transform: rotate(-90deg);
3694      }
3695  
3696      .main-navigation ul ul ul {
3697          left: -999em;
3698          margin-top: -1px;
3699          top: 0;
3700      }
3701  
3702      .main-navigation ul ul li.menu-item-has-children.focus:before,
3703      .main-navigation ul ul li.menu-item-has-children:hover:before,
3704      .main-navigation ul ul li.menu-item-has-children.focus:after,
3705      .main-navigation ul ul li.menu-item-has-children:hover:after,
3706      .main-navigation ul ul li.page_item_has_children.focus:before,
3707      .main-navigation ul ul li.page_item_has_children:hover:before,
3708      .main-navigation ul ul li.page_item_has_children.focus:after,
3709      .main-navigation ul ul li.page_item_has_children:hover:after {
3710          display: none;
3711      }
3712  
3713      .site-header .site-navigation-fixed .menu-scroll-down {
3714          display: none;
3715      }
3716  
3717      /* Scroll down arrow */
3718  
3719      .site-header .menu-scroll-down {
3720          display: block;
3721          padding: 1em;
3722          position: absolute;
3723          right: 0;
3724      }
3725  
3726      .site-header .menu-scroll-down .icon {
3727          -webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
3728          -ms-transform: rotate(90deg); /* IE 9 */
3729          transform: rotate(90deg);
3730      }
3731  
3732      .site-header .menu-scroll-down {
3733          color: #fff;
3734          top: 2em;
3735      }
3736  
3737      .site-header .navigation-top .menu-scroll-down {
3738          color: #767676;
3739          top: 0.7em;
3740      }
3741  
3742      .menu-scroll-down:focus {
3743          outline: thin dotted;
3744      }
3745  
3746      .menu-scroll-down .icon {
3747          height: 18px;
3748          width: 18px;
3749      }
3750  
3751      /* Front Page */
3752  
3753      .twentyseventeen-front-page.has-header-image .site-branding,
3754      .twentyseventeen-front-page.has-header-video .site-branding,
3755      .home.blog.has-header-image .site-branding,
3756      .home.blog.has-header-video .site-branding {
3757          margin-bottom: 70px;
3758      }
3759  
3760      .twentyseventeen-front-page.has-header-image .custom-header-media,
3761      .twentyseventeen-front-page.has-header-video .custom-header-media,
3762      .home.blog.has-header-image .custom-header-media,
3763      .home.blog.has-header-video .custom-header-media {
3764          height: 1200px;
3765          height: 100vh;
3766          max-height: 100%;
3767          overflow: hidden;
3768      }
3769  
3770      .twentyseventeen-front-page.has-header-image .custom-header-media:before,
3771      .twentyseventeen-front-page.has-header-video .custom-header-media:before,
3772      .home.blog.has-header-image .custom-header-media:before,
3773      .home.blog.has-header-video .custom-header-media:before {
3774          height: 33%;
3775      }
3776  
3777      .admin-bar.twentyseventeen-front-page.has-header-image .custom-header-media,
3778      .admin-bar.twentyseventeen-front-page.has-header-video .custom-header-media,
3779      .admin-bar.home.blog.has-header-image .custom-header-media,
3780      .admin-bar.home.blog.has-header-video .custom-header-media {
3781          height: calc(100vh - 32px);
3782      }
3783  
3784      .panel-content .wrap {
3785          padding-bottom: 4.5em;
3786          padding-top: 6em;
3787      }
3788  
3789      .panel-image {
3790          height: 100vh;
3791          max-height: 1200px;
3792      }
3793  
3794      /* With panel images 100% of the screen height, we're going to fix the background image where supported to create a parallax-like effect. */
3795      .background-fixed .panel-image {
3796          background-attachment: fixed;
3797      }
3798  
3799      @supports ( -webkit-touch-callout: none ) {
3800          /* Image scrolls with the content in iOS Safari. */
3801          .background-fixed .panel-image {
3802              background-attachment: scroll;
3803          }
3804      }
3805  
3806      .page-two-column .panel-content .entry-header {
3807          float: left;
3808          width: 36%;
3809      }
3810  
3811      .page-two-column .panel-content .entry-content {
3812          float: right;
3813          width: 58%;
3814      }
3815  
3816      /* Front Page - Recent Posts */
3817  
3818      .page-two-column .panel-content .recent-posts {
3819          clear: right;
3820          float: right;
3821          width: 58%;
3822      }
3823  
3824      .panel-content .recent-posts article {
3825          margin-bottom: 4em;
3826      }
3827  
3828      .panel-content .recent-posts .entry-header,
3829      .page-two-column #primary .panel-content .recent-posts .entry-header,
3830      .panel-content .recent-posts .entry-content,
3831      .page-two-column #primary .panel-content .recent-posts .entry-content {
3832          float: none;
3833          width: 100%;
3834      }
3835  
3836      .twentyseventeen-front-page .panel-content .recent-posts .entry-header {
3837          margin-bottom: 1.5em;
3838      }
3839  
3840      .page .panel-content .recent-posts .entry-title {
3841          font-size: 26px;
3842          font-size: 1.625rem;
3843      }
3844  
3845      /* Posts */
3846  
3847      .site-content {
3848          padding: 5.5em 0 0;
3849      }
3850  
3851      .single-post .entry-title,
3852      .page .entry-title {
3853          font-size: 26px;
3854          font-size: 1.625rem;
3855      }
3856  
3857      .comments-pagination,
3858      .post-navigation {
3859          clear: both;
3860      }
3861  
3862      .post-navigation .nav-previous {
3863          float: left;
3864          width: 50%;
3865      }
3866  
3867      .post-navigation .nav-next {
3868          float: right;
3869          text-align: right;
3870          width: 50%;
3871      }
3872  
3873      .nav-next,
3874      .post-navigation .nav-next {
3875          margin-top: 0;
3876      }
3877  
3878      /* Blog, archive, search */
3879  
3880      .sticky .icon-thumb-tack {
3881          height: 23px;
3882          left: -2.5em;
3883          top: 1.5em;
3884          width: 32px;
3885      }
3886  
3887      body:not(.has-sidebar):not(.page-one-column) .page-header,
3888      body.has-sidebar.error404 #primary .page-header,
3889      body.page-two-column:not(.archive) #primary .entry-header,
3890      body.page-two-column.archive:not(.has-sidebar) #primary .page-header {
3891          float: left;
3892          width: 36%;
3893      }
3894  
3895      .blog:not(.has-sidebar) #primary article,
3896      .archive:not(.page-one-column):not(.has-sidebar) #primary article,
3897      .search:not(.has-sidebar) #primary article,
3898      .error404:not(.has-sidebar) #primary .page-content,
3899      .error404.has-sidebar #primary .page-content,
3900      body.page-two-column:not(.archive) #primary .entry-content,
3901      body.page-two-column #comments {
3902          float: right;
3903          width: 58%;
3904      }
3905  
3906      .blog .site-main > article,
3907      .archive .site-main > article,
3908      .search .site-main > article {
3909          padding-bottom: 4em;
3910      }
3911  
3912      .navigation.pagination {
3913          clear: both;
3914          float: right;
3915          width: 58%;
3916      }
3917  
3918      .has-sidebar .navigation.pagination,
3919      .archive.page-one-column:not(.has-sidebar) .navigation.pagination {
3920          float: none;
3921          width: 100%;
3922      }
3923  
3924      .entry-footer {
3925          display: table;
3926          width: 100%;
3927      }
3928  
3929      .entry-footer .cat-tags-links {
3930          display: table-cell;
3931          vertical-align: middle;
3932          width: 100%;
3933      }
3934  
3935      .entry-footer .edit-link {
3936          display: table-cell;
3937          text-align: right;
3938          vertical-align: middle;
3939      }
3940  
3941      .entry-footer .edit-link a.post-edit-link {
3942          margin-top: 0;
3943          margin-left: 1em;
3944      }
3945  
3946      /* Entry content */
3947  
3948      /* without sidebar */
3949  
3950      :not(.has-sidebar) .entry-content blockquote.alignleft {
3951          margin-left: -17.5%;
3952          width: 48%;
3953      }
3954  
3955      :not(.has-sidebar) .entry-content blockquote.alignright {
3956          margin-right: -17.5%;
3957          width: 48%;
3958      }
3959  
3960      /* with sidebar */
3961  
3962      .has-sidebar .entry-content blockquote.alignleft {
3963          margin-left: 0;
3964          width: 34%;
3965      }
3966  
3967      .has-sidebar .entry-content blockquote.alignright {
3968          margin-right: 0;
3969          width: 34%;
3970      }
3971  
3972      .has-sidebar #primary .entry-content blockquote.alignright.below-entry-meta {
3973          margin-right: -72.5%;
3974          width: 62%;
3975      }
3976  
3977      /* blog and archive */
3978  
3979      .blog:not(.has-sidebar) .entry-content blockquote.alignleft,
3980      .twentyseventeen-front-page.page-two-column .entry-content blockquote.alignleft,
3981      .archive:not(.has-sidebar) .entry-content blockquote.alignleft,
3982      .page-two-column .entry-content blockquote.alignleft {
3983          margin-left: -72.5%;
3984          width: 62%;
3985      }
3986  
3987      .blog:not(.has-sidebar) .entry-content blockquote.alignright,
3988      .twentyseventeen-front-page.page-two-column .entry-content blockquote.alignright,
3989      .archive:not(.has-sidebar) .entry-content blockquote.alignright,
3990      .page-two-column .entry-content blockquote.alignright {
3991          margin-right: 0;
3992          width: 36%;
3993      }
3994  
3995      /* Post formats */
3996  
3997      .format-quote blockquote .icon {
3998          left: -1.5em;
3999      }
4000  
4001      /* Pages */
4002  
4003      .page.page-one-column .entry-header,
4004      .twentyseventeen-front-page.page-one-column .entry-header,
4005      .archive.page-one-column:not(.has-sidebar) .page-header {
4006          margin-bottom: 4em;
4007      }
4008  
4009      .page:not(.home) #content {
4010          padding-bottom: 3.25em;
4011      }
4012  
4013      /* 404 page */
4014  
4015      .error404 .page-content {
4016          padding-bottom: 9em;
4017      }
4018  
4019      /* Comments */
4020  
4021      #comments {
4022          padding-top: 5em;
4023      }
4024  
4025      .comments-title {
4026          margin-bottom: 2.5em;
4027      }
4028  
4029      ol.children .children {
4030          padding-left: 2em;
4031      }
4032  
4033      /* Posts pagination */
4034  
4035      .nav-links .nav-title {
4036          position: relative;
4037      }
4038  
4039      .nav-title-icon-wrapper {
4040          position: absolute;
4041          text-align: center;
4042          width: 2em;
4043      }
4044  
4045      .nav-links .nav-previous .nav-title .nav-title-icon-wrapper {
4046          left: -2em;
4047      }
4048  
4049      .nav-links .nav-next .nav-title .nav-title-icon-wrapper {
4050          right: -2em;
4051      }
4052  
4053      /* Secondary */
4054  
4055      #secondary {
4056          font-size: 14px;
4057          font-size: 0.875rem;
4058          line-height: 1.6;
4059      }
4060  
4061      /* Widgets */
4062  
4063      h2.widget-title {
4064          font-size: 11px;
4065          font-size: 0.6875rem;
4066          margin-bottom: 2em;
4067      }
4068  
4069      /* Footer */
4070  
4071      .site-footer {
4072          font-size: 14px;
4073          font-size: 0.875rem;
4074          line-height: 1.6;
4075          margin-top: 3em;
4076      }
4077  
4078      .site-footer .widget-column.footer-widget-1 {
4079          float: left;
4080          width: 36%;
4081      }
4082  
4083      .site-footer .widget-column.footer-widget-2 {
4084          float: right;
4085          width: 58%;
4086      }
4087  
4088      .social-navigation {
4089          clear: left;
4090          float: left;
4091          margin-bottom: 0;
4092          width: 36%;
4093      }
4094  
4095      .site-info {
4096          float: left;
4097          padding: 0.7em 0 0;
4098          width: 58%;
4099      }
4100  
4101      .social-navigation + .site-info {
4102          margin-left: 6%;
4103      }
4104  
4105      .site-info .sep {
4106          margin: 0 0.5em;
4107          display: inline;
4108          visibility: visible;
4109          height: auto;
4110          width: auto;
4111      }
4112  
4113      /* Gallery Columns */
4114  
4115      .gallery-columns-5 .gallery-item {
4116          max-width: 20%;
4117      }
4118  
4119      .gallery-columns-6 .gallery-item {
4120          max-width: 16.66%;
4121      }
4122  
4123      .gallery-columns-7 .gallery-item {
4124          max-width: 14.28%;
4125      }
4126  
4127      .gallery-columns-8 .gallery-item {
4128          max-width: 12.5%;
4129      }
4130  
4131      .gallery-columns-9 .gallery-item {
4132          max-width: 11.11%;
4133      }
4134  }
4135  
4136  @media screen and ( min-width: 67em ) {
4137  
4138      /* Layout */
4139  
4140      /* Navigation */
4141      .navigation-top .wrap {
4142          padding: 0.75em 2em;
4143      }
4144  
4145      .navigation-top nav {
4146          margin-left: 0;
4147      }
4148  
4149      /* Sticky posts */
4150  
4151      .sticky .icon-thumb-tack {
4152          font-size: 32px;
4153          font-size: 2rem;
4154          height: 22px;
4155          left: -1.25em;
4156          top: 0.75em;
4157          width: 32px;
4158      }
4159  
4160      /* Pagination */
4161  
4162      .page-numbers {
4163          display: inline-block;
4164      }
4165  
4166      .page-numbers.current {
4167          font-size: 15px;
4168          font-size: 0.9375rem;
4169      }
4170  
4171      .page-numbers.current .screen-reader-text {
4172          clip: rect(1px, 1px, 1px, 1px);
4173          height: 1px;
4174          overflow: hidden;
4175          position: absolute !important;
4176          width: 1px;
4177      }
4178  
4179      /* Comments */
4180  
4181      .comment-body {
4182          margin-left: 0;
4183      }
4184  }
4185  
4186  @media screen and ( min-width: 79em ) {
4187  
4188      .has-sidebar .entry-content blockquote.alignleft {
4189          margin-left: -20%;
4190      }
4191  
4192      .blog:not(.has-sidebar) .entry-content blockquote.alignright,
4193      .archive:not(.has-sidebar) .entry-content blockquote.alignright,
4194      .page-two-column .entry-content blockquote.alignright,
4195      .twentyseventeen-front-page .entry-content blockquote.alignright {
4196          margin-right: -20%;
4197      }
4198  }
4199  
4200  @media screen and ( max-width: 48.875em ) and ( min-width: 48em ) {
4201  
4202      .admin-bar .site-navigation-fixed.navigation-top,
4203      .admin-bar .site-navigation-hidden.navigation-top {
4204          top: 46px;
4205      }
4206  }
4207  
4208  /*--------------------------------------------------------------
4209  20.0 Print
4210  --------------------------------------------------------------*/
4211  
4212  @media print {
4213  
4214      /* Hide elements */
4215  
4216      form,
4217      button,
4218      input,
4219      select,
4220      textarea,
4221      .navigation-top,
4222      .social-navigation,
4223      #secondary,
4224      .content-bottom-widgets,
4225      .header-image,
4226      .panel-image-prop,
4227      .icon-thumb-tack,
4228      .page-links,
4229      .edit-link,
4230      .post-navigation,
4231      .pagination.navigation,
4232      .comments-pagination,
4233      .comment-respond,
4234      .comment-edit-link,
4235      .comment-reply-link,
4236      .comment-metadata .edit-link,
4237      .pingback .edit-link,
4238      .site-footer aside.widget-area,
4239      .site-info {
4240          display: none !important;
4241      }
4242  
4243      .entry-footer,
4244      #comments,
4245      .site-footer,
4246      .single-featured-image-header {
4247          border: 0;
4248      }
4249  
4250      /* Font sizes */
4251  
4252      body {
4253          font-size: 12pt;
4254      }
4255  
4256      h1 {
4257          font-size: 24pt;
4258      }
4259  
4260      h2 {
4261          font-size: 22pt;
4262      }
4263  
4264      h3 {
4265          font-size: 17pt;
4266      }
4267  
4268      h4 {
4269          font-size: 12pt;
4270      }
4271  
4272      h5 {
4273          font-size: 11pt;
4274      }
4275  
4276      h6 {
4277          font-size: 12pt;
4278      }
4279  
4280      .page .panel-content .entry-title,
4281      .page-title,
4282      body.page:not(.twentyseventeen-front-page) .entry-title {
4283          font-size: 10pt;
4284      }
4285  
4286      /* Layout */
4287  
4288      .wrap {
4289          padding-left: 5% !important;
4290          padding-right: 5% !important;
4291          max-width: none;
4292      }
4293  
4294      /* Site Branding */
4295  
4296      .site-header {
4297          background: transparent;
4298          padding: 0;
4299      }
4300  
4301      .custom-header-media {
4302          padding: 0;
4303      }
4304  
4305      .twentyseventeen-front-page.has-header-image .site-branding,
4306      .twentyseventeen-front-page.has-header-video .site-branding,
4307      .home.blog.has-header-image .site-branding,
4308      .home.blog.has-header-video .site-branding {
4309          position: relative;
4310      }
4311  
4312      .site-branding {
4313          margin-top: 0;
4314          margin-bottom: 1.75em !important; /* override styles added by JavaScript */
4315      }
4316  
4317      .site-title {
4318          font-size: 25pt;
4319      }
4320  
4321      .site-description {
4322          font-size: 12pt;
4323          opacity: 1;
4324      }
4325  
4326      /* Posts */
4327  
4328      .single-featured-image-header {
4329          background: transparent;
4330      }
4331  
4332      .entry-meta {
4333          font-size: 9pt;
4334      }
4335  
4336      /* Colors */
4337  
4338      body,
4339      .site {
4340          background: none !important; /* Brute force since user agents all print differently. */
4341      }
4342  
4343      body,
4344      a,
4345      .site-title a,
4346      .twentyseventeen-front-page.has-header-image .site-title,
4347      .twentyseventeen-front-page.has-header-video .site-title,
4348      .twentyseventeen-front-page.has-header-image .site-title a,
4349      .twentyseventeen-front-page.has-header-video .site-title a {
4350          color: #222 !important; /* Make sure color schemes don't affect to print */
4351      }
4352  
4353      h2,
4354      h5,
4355      blockquote,
4356      .site-description,
4357      .twentyseventeen-front-page.has-header-image .site-description,
4358      .twentyseventeen-front-page.has-header-video .site-description,
4359      .entry-meta,
4360      .entry-meta a {
4361          color: #777 !important; /* Make sure color schemes don't affect to print */
4362      }
4363  
4364      .entry-content blockquote.alignleft,
4365      .entry-content blockquote.alignright {
4366          font-size: 11pt;
4367          width: 34%;
4368      }
4369  
4370      .site-footer {
4371          padding: 0;
4372      }
4373  }