wp-content/themes/twentyseventeen/style.css

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