wp-content/themes/twentythirteen/style.css

   1 /*
   2 Theme Name: Twenty Thirteen
   3 Theme URI: http://wordpress.org/themes/twentythirteen
   4 Author: the WordPress team
   5 Author URI: http://wordpress.org/
   6 Description: The 2013 theme for WordPress takes us back to the blog, featuring a full range of post formats, each displayed beautifully in their own unique way. Design details abound, starting with a vibrant color scheme and matching header images, beautiful typography and icons, and a flexible layout that looks great on any device, big or small.
   7 Version: 1.1
   8 License: GNU General Public License v2 or later
   9 License URI: http://www.gnu.org/licenses/gpl-2.0.html
  10 Tags: black, brown, orange, tan, white, yellow, light, one-column, two-columns, right-sidebar, fluid-layout, responsive-layout, custom-header, custom-menu, editor-style, featured-images, microformats, post-formats, rtl-language-support, sticky-post, translation-ready
  11 Text Domain: twentythirteen
  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 /**
  19  * Table of Contents:
  20  *
  21  * 1.0 - Reset
  22  * 2.0 - Repeatable Patterns
  23  * 3.0 - Basic Structure
  24  * 4.0 - Header
  25  *   4.1 - Site Header
  26  *   4.2 - Navigation
  27  * 5.0 - Content
  28  *   5.1 - Entry Header
  29  *   5.2 - Entry Meta
  30  *   5.3 - Entry Content
  31  *   5.4 - Galleries
  32  *   5.5 - Post Formats
  33  *   5.6 - Attachments
  34  *   5.7 - Post/Paging Navigation
  35  *   5.8 - Author Bio
  36  *   5.9 - Archives
  37  *   5.10 - Search Results/No posts
  38  *   5.11 - 404
  39  *   5.12 - Comments
  40  *   5.13 - Multisite
  41  * 6.0 - Sidebar
  42  *   6.1 - Widgets
  43  * 7.0 - Footer
  44  * 8.0 - Media Queries
  45  * 9.0 - Print
  46  * ----------------------------------------------------------------------------
  47  */
  48
  49
  50 /**
  51  * 1.0 Reset
  52  *
  53  * Modified from Normalize.css to provide cross-browser consistency and a smart
  54  * default styling of HTML elements.
  55  *
  56  * @see http://git.io/normalize
  57  * ----------------------------------------------------------------------------
  58  */
  59
  60 * {
  61         -webkit-box-sizing: border-box;
  62         -moz-box-sizing:    border-box;
  63         box-sizing:         border-box;
  64 }
  65
  66 article,
  67 aside,
  68 details,
  69 figcaption,
  70 figure,
  71 footer,
  72 header,
  73 nav,
  74 section,
  75 summary {
  76         display: block;
  77 }
  78
  79 audio,
  80 canvas,
  81 video {
  82         display: inline-block;
  83 }
  84
  85 audio:not([controls]) {
  86         display: none;
  87         height: 0;
  88 }
  89
  90 [hidden] {
  91         display: none;
  92 }
  93
  94 html {
  95         font-size: 100%;
  96         overflow-y: scroll;
  97         -webkit-text-size-adjust: 100%;
  98         -ms-text-size-adjust: 100%;
  99 }
 100
 101 html,
 102 button,
 103 input,
 104 select,
 105 textarea {
 106         font-family: "Source Sans Pro", Helvetica, sans-serif;
 107 }
 108
 109 body {
 110         color: #141412;
 111         line-height: 1.5;
 112         margin: 0;
 113 }
 114
 115 a {
 116         color: #ca3c08;
 117         text-decoration: none;
 118 }
 119
 120 a:visited {
 121         color: #ac0404;
 122 }
 123
 124 a:focus {
 125         outline: thin dotted;
 126 }
 127
 128 a:active,
 129 a:hover {
 130         color: #ea9629;
 131         outline: 0;
 132 }
 133
 134 a:hover {
 135         text-decoration: underline;
 136 }
 137
 138 h1,
 139 h2,
 140 h3,
 141 h4,
 142 h5,
 143 h6 {
 144         clear: both;
 145         font-family: Bitter, Georgia, serif;
 146         line-height: 1.3;
 147 }
 148
 149 h1 {
 150         font-size: 48px;
 151         margin: 33px 0;
 152 }
 153
 154 h2 {
 155         font-size: 30px;
 156         margin: 25px 0;
 157 }
 158
 159 h3 {
 160         font-size: 22px;
 161         margin: 22px 0;
 162 }
 163
 164 h4 {
 165         font-size: 20px;
 166         margin: 25px 0;
 167 }
 168
 169 h5 {
 170         font-size: 18px;
 171         margin: 30px 0;
 172 }
 173
 174 h6 {
 175         font-size: 16px;
 176         margin: 36px 0;
 177 }
 178
 179 address {
 180         font-style: italic;
 181         margin: 0 0 24px;
 182 }
 183
 184 abbr[title] {
 185         border-bottom: 1px dotted;
 186 }
 187
 188 b,
 189 strong {
 190         font-weight: bold;
 191 }
 192
 193 dfn {
 194         font-style: italic;
 195 }
 196
 197 mark {
 198         background: #ff0;
 199         color: #000;
 200 }
 201
 202 p {
 203         margin: 0 0 24px;
 204 }
 205
 206 code,
 207 kbd,
 208 pre,
 209 samp {
 210         font-family: monospace, serif;
 211         font-size: 14px;
 212         -webkit-hyphens: none;
 213         -moz-hyphens:    none;
 214         -ms-hyphens:     none;
 215         hyphens:         none;
 216 }
 217
 218 pre {
 219         background: #f5f5f5;
 220         color: #666;
 221         font-family: monospace;
 222         font-size: 14px;
 223         margin: 20px 0;
 224         overflow: auto;
 225         padding: 20px;
 226         white-space: pre;
 227         white-space: pre-wrap;
 228         word-wrap: break-word;
 229 }
 230
 231 blockquote,
 232 q {
 233         -webkit-hyphens: none;
 234         -moz-hyphens:    none;
 235         -ms-hyphens:     none;
 236         hyphens:         none;
 237         quotes: none;
 238 }
 239
 240 blockquote:before,
 241 blockquote:after,
 242 q:before,
 243 q:after {
 244         content: "";
 245         content: none;
 246 }
 247
 248 blockquote {
 249         font-size: 18px;
 250         font-style: italic;
 251         font-weight: 300;
 252         margin: 24px 40px;
 253 }
 254
 255 blockquote blockquote {
 256         margin-right: 0;
 257 }
 258
 259 blockquote cite,
 260 blockquote small {
 261         font-size: 14px;
 262         font-weight: normal;
 263         text-transform: uppercase;
 264 }
 265
 266 blockquote em,
 267 blockquote i {
 268         font-style: normal;
 269         font-weight: 300;
 270 }
 271
 272 blockquote strong,
 273 blockquote b {
 274         font-weight: 400;
 275 }
 276
 277 small {
 278         font-size: smaller;
 279 }
 280
 281 sub,
 282 sup {
 283         font-size: 75%;
 284         line-height: 0;
 285         position: relative;
 286         vertical-align: baseline;
 287 }
 288
 289 sup {
 290         top: -0.5em;
 291 }
 292
 293 sub {
 294         bottom: -0.25em;
 295 }
 296
 297 dl {
 298         margin: 0 20px;
 299 }
 300
 301 dt {
 302         font-weight: bold;
 303 }
 304
 305 dd {
 306         margin: 0 0 20px;
 307 }
 308
 309 menu,
 310 ol,
 311 ul {
 312         margin: 16px 0;
 313         padding: 0 0 0 40px;
 314 }
 315
 316 ul {
 317         list-style-type: square;
 318 }
 319
 320 nav ul,
 321 nav ol {
 322         list-style: none;
 323         list-style-image: none;
 324 }
 325
 326 li > ul,
 327 li > ol {
 328         margin: 0;
 329 }
 330
 331 img {
 332         -ms-interpolation-mode: bicubic;
 333         border: 0;
 334         vertical-align: middle;
 335 }
 336
 337 svg:not(:root) {
 338         overflow: hidden;
 339 }
 340
 341 figure {
 342         margin: 0;
 343 }
 344
 345 form {
 346         margin: 0;
 347 }
 348
 349 fieldset {
 350         border: 1px solid #c0c0c0;
 351         margin: 0 2px;
 352         padding: 0.35em 0.625em 0.75em;
 353 }
 354
 355 legend {
 356         border: 0;
 357         padding: 0;
 358         white-space: normal;
 359 }
 360
 361 button,
 362 input,
 363 select,
 364 textarea {
 365         font-size: 100%;
 366         margin: 0;
 367         max-width: 100%;
 368         vertical-align: baseline;
 369 }
 370
 371 button,
 372 input {
 373         line-height: normal;
 374 }
 375
 376 button,
 377 html input[type="button"],
 378 input[type="reset"],
 379 input[type="submit"] {
 380         -webkit-appearance: button;
 381         cursor: pointer;
 382 }
 383
 384 button[disabled],
 385 input[disabled] {
 386         cursor: default;
 387 }
 388
 389 input[type="checkbox"],
 390 input[type="radio"] {
 391         padding: 0;
 392 }
 393
 394 input[type="search"] {
 395         -webkit-appearance: textfield;
 396         padding-right: 2px; /* Don't cut off the webkit search cancel button */
 397         width: 270px;
 398 }
 399
 400 input[type="search"]::-webkit-search-decoration {
 401         -webkit-appearance: none;
 402 }
 403
 404 button::-moz-focus-inner,
 405 input::-moz-focus-inner {
 406         border: 0;
 407         padding: 0;
 408 }
 409
 410 textarea {
 411         overflow: auto;
 412         vertical-align: top;
 413 }
 414
 415 table {
 416         border-bottom: 1px solid #ededed;
 417         border-collapse: collapse;
 418         border-spacing: 0;
 419         font-size: 14px;
 420         line-height: 2;
 421         margin: 0 0 20px;
 422         width: 100%;
 423 }
 424
 425 caption,
 426 th,
 427 td {
 428         font-weight: normal;
 429         text-align: left;
 430 }
 431
 432 caption {
 433         font-size: 16px;
 434         margin: 20px 0;
 435 }
 436
 437 th {
 438         font-weight: bold;
 439         text-transform: uppercase;
 440 }
 441
 442 td {
 443         border-top: 1px solid #ededed;
 444         padding: 6px 10px 6px 0;
 445 }
 446
 447 del {
 448         color: #333;
 449 }
 450
 451 ins {
 452         background: #fff9c0;
 453         text-decoration: none;
 454 }
 455
 456 hr {
 457         background: url(images/dotted-line.png) repeat center top;
 458         background-size: 4px 4px;
 459         border: 0;
 460         height: 1px;
 461         margin: 0 0 24px;
 462 }
 463
 464
 465 /**
 466  * 2.0 Repeatable Patterns
 467  * ----------------------------------------------------------------------------
 468  */
 469
 470 .genericon:before,
 471 .menu-toggle:after,
 472 .featured-post:before,
 473 .date a:before,
 474 .entry-meta .author a:before,
 475 .format-audio .entry-content:before,
 476 .comments-link a:before,
 477 .tags-links a:first-child:before,
 478 .categories-links a:first-child:before,
 479 .edit-link a:before,
 480 .attachment .entry-title:before,
 481 .attachment-meta:before,
 482 .attachment-meta a:before,
 483 .comment-awaiting-moderation:before,
 484 .comment-reply-link:before,
 485 .comment-reply-login:before,
 486 .comment-reply-title small a:before,
 487 .bypostauthor > .comment-body .fn:before,
 488 .error404 .page-title:before {
 489         -webkit-font-smoothing: antialiased;
 490         display: inline-block;
 491         font: normal 16px/1 Genericons;
 492         vertical-align: text-bottom;
 493 }
 494
 495 /* Clearing floats */
 496 .clear:after,
 497 .attachment .entry-header:after,
 498 .site-footer .widget-area:after,
 499 .entry-content:after,
 500 .page-content:after,
 501 .navigation:after,
 502 .nav-links:after,
 503 .gallery:after,
 504 .comment-form-author:after,
 505 .comment-form-email:after,
 506 .comment-form-url:after,
 507 .comment-body:after {
 508         clear: both;
 509 }
 510
 511 .clear:before,
 512 .clear:after,
 513 .attachment .entry-header:before,
 514 .attachment .entry-header:after,
 515 .site-footer .widget-area:before,
 516 .site-footer .widget-area:after,
 517 .entry-content:before,
 518 .entry-content:after,
 519 .page-content:before,
 520 .page-content:after,
 521 .navigation:before,
 522 .navigation:after,
 523 .nav-links:before,
 524 .nav-links:after,
 525 .gallery:before,
 526 .gallery:after,
 527 .comment-form-author:before,
 528 .comment-form-author:after,
 529 .comment-form-email:before,
 530 .comment-form-email:after,
 531 .comment-form-url:before,
 532 .comment-form-url:after,
 533 .comment-body:before,
 534 .comment-body:after {
 535         content: "";
 536         display: table;
 537 }
 538
 539 /* Assistive text */
 540 .screen-reader-text {
 541         clip: rect(1px, 1px, 1px, 1px);
 542         position: absolute !important;
 543 }
 544
 545 .screen-reader-text:focus {
 546         background-color: #f1f1f1;
 547         border-radius: 3px;
 548         box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
 549         clip: auto !important;
 550         color: #21759b;
 551         display: block;
 552         font-size: 14px;
 553         font-weight: bold;
 554         height: auto;
 555         line-height: normal;
 556         padding: 15px 23px 14px;
 557         position: absolute;
 558         left: 5px;
 559         top: 5px;
 560         text-decoration: none;
 561         width: auto;
 562         z-index: 100000; /* Above WP toolbar */
 563 }
 564
 565 /* Form fields, general styles first. */
 566 button,
 567 input,
 568 textarea {
 569         border: 2px solid #d4d0ba;
 570         font-family: inherit;
 571         padding: 5px;
 572 }
 573
 574 input,
 575 textarea {
 576         color: #141412;
 577 }
 578
 579 input:focus,
 580 textarea:focus {
 581         border: 2px solid #c3c0ab;
 582         outline: 0;
 583 }
 584
 585 /* Buttons */
 586 button,
 587 input[type="submit"],
 588 input[type="button"],
 589 input[type="reset"] {
 590         background: #e05d22; /* Old browsers */
 591         background: -webkit-linear-gradient(top, #e05d22 0%, #d94412 100%); /* Chrome 10+, Safari 5.1+ */
 592         background:   linear-gradient(to bottom, #e05d22 0%, #d94412 100%); /* W3C */
 593         border: none;
 594         border-bottom: 3px solid #b93207;
 595         border-radius: 2px;
 596         color: #fff;
 597         display: inline-block;
 598         padding: 11px 24px 10px;
 599         text-decoration: none;
 600 }
 601
 602 button:hover,
 603 button:focus,
 604 input[type="submit"]:hover,
 605 input[type="button"]:hover,
 606 input[type="reset"]:hover,
 607 input[type="submit"]:focus,
 608 input[type="button"]:focus,
 609 input[type="reset"]:focus {
 610         background: #ed6a31; /* Old browsers */
 611         background: -webkit-linear-gradient(top, #ed6a31 0%, #e55627 100%); /* Chrome 10+, Safari 5.1+ */
 612         background:   linear-gradient(to bottom, #ed6a31 0%, #e55627 100%); /* W3C */
 613         outline: none;
 614 }
 615
 616 button:active,
 617 input[type="submit"]:active,
 618 input[type="button"]:active,
 619 input[type="reset"]:active {
 620         background: #d94412; /* Old browsers */
 621         background: -webkit-linear-gradient(top, #d94412 0%, #e05d22 100%); /* Chrome 10+, Safari 5.1+ */
 622         background:   linear-gradient(to bottom, #d94412 0%, #e05d22 100%); /* W3C */
 623         border: none;
 624         border-top: 3px solid #b93207;
 625         padding: 10px 24px 11px;
 626 }
 627
 628 .post-password-required input[type="submit"] {
 629         padding: 7px 24px 4px;
 630         vertical-align: bottom;
 631 }
 632
 633 .post-password-required input[type="submit"]:active {
 634         padding: 5px 24px 6px;
 635 }
 636
 637 /* Placeholder text color -- selectors need to be separate to work. */
 638 ::-webkit-input-placeholder {
 639         color: #7d7b6d;
 640 }
 641
 642 :-moz-placeholder {
 643         color: #7d7b6d;
 644 }
 645
 646 ::-moz-placeholder {
 647         color: #7d7b6d;
 648 }
 649
 650 :-ms-input-placeholder {
 651         color: #7d7b6d;
 652 }
 653
 654 /*
 655  * Responsive images
 656  *
 657  * Fluid images for posts, comments, and widgets
 658  */
 659 .entry-content img,
 660 .entry-summary img,
 661 .comment-content img,
 662 .widget img,
 663 .wp-caption {
 664         max-width: 100%;
 665 }
 666
 667 /* Make sure images with WordPress-added height and width attributes are scaled correctly. */
 668 .entry-content img,
 669 .entry-summary img,
 670 .comment-content img[height],
 671 img[class*="align"],
 672 img[class*="wp-image-"],
 673 img[class*="attachment-"] {
 674         height: auto;
 675 }
 676
 677 img.size-full,
 678 img.size-large,
 679 img.wp-post-image {
 680         height: auto;
 681         max-width: 100%;
 682 }
 683
 684 /* Make sure videos and embeds fit their containers. */
 685 embed,
 686 iframe,
 687 object,
 688 video {
 689         max-width: 100%;
 690 }
 691
 692 /* Override the Twitter embed fixed width. */
 693 .entry-content .twitter-tweet-rendered {
 694         max-width: 100% !important;
 695 }
 696
 697 /* Images */
 698 .alignleft {
 699         float: left;
 700 }
 701
 702 .alignright {
 703         float: right;
 704 }
 705
 706 .aligncenter {
 707         display: block;
 708         margin-left: auto;
 709         margin-right: auto;
 710 }
 711
 712 img.alignleft {
 713         margin: 5px 20px 5px 0;
 714 }
 715
 716 .wp-caption.alignleft {
 717         margin: 5px 10px 5px 0;
 718 }
 719
 720 img.alignright {
 721         margin: 5px 0 5px 20px;
 722 }
 723
 724 .wp-caption.alignright {
 725         margin: 5px 0 5px 10px;
 726 }
 727
 728 img.aligncenter {
 729         margin: 5px auto;
 730 }
 731
 732 img.alignnone {
 733         margin: 5px 0;
 734 }
 735
 736 .wp-caption .wp-caption-text,
 737 .entry-caption,
 738 .gallery-caption {
 739         color: #220e10;
 740         font-size: 18px;
 741         font-style: italic;
 742         font-weight: 300;
 743 }
 744
 745 img.wp-smiley,
 746 .rsswidget img {
 747         border: 0;
 748         border-radius: 0;
 749         box-shadow: none;
 750         margin-bottom: 0;
 751         margin-top: 0;
 752         padding: 0;
 753 }
 754
 755 .wp-caption.alignleft + ul,
 756 .wp-caption.alignleft + ol  {
 757         list-style-position: inside;
 758 }
 759
 760
 761 /**
 762  * 3.0 Basic Structure
 763  * ----------------------------------------------------------------------------
 764  */
 765
 766 .site {
 767         background-color: #fff;
 768         border-left: 1px solid #f2f2f2;
 769         border-right: 1px solid #f2f2f2;
 770         margin: 0 auto;
 771         max-width: 1600px;
 772         width: 100%;
 773 }
 774
 775 .site-main {
 776         position: relative;
 777 }
 778
 779 .site-main .sidebar-container {
 780         height: 0;
 781         position: absolute;
 782         top: 40px;
 783         width: 100%;
 784         z-index: 1;
 785 }
 786
 787 .site-main .sidebar-inner {
 788         margin: 0 auto;
 789         max-width: 1040px;
 790 }
 791
 792
 793 /**
 794  * 4.0 Header
 795  * ----------------------------------------------------------------------------
 796  */
 797
 798 /**
 799  * 4.1 Site Header
 800  * ----------------------------------------------------------------------------
 801  */
 802
 803 .site-header {
 804         position: relative;
 805 }
 806
 807 .site-header .home-link {
 808         color: #141412;
 809         display: block;
 810         margin: 0 auto;
 811         max-width: 1080px;
 812         min-height: 230px;
 813         padding: 0 20px;
 814         text-decoration: none;
 815         width: 100%;
 816 }
 817
 818 .site-header .site-title:hover {
 819         text-decoration: underline;
 820 }
 821
 822 .site-title {
 823         font-size: 60px;
 824         font-weight: bold;
 825         line-height: 1;
 826         margin: 0;
 827         padding: 58px 0 10px;
 828 }
 829
 830 .site-description {
 831         font: 300 italic 24px "Source Sans Pro", Helvetica, sans-serif;
 832         margin: 0;
 833 }
 834
 835
 836 /**
 837  * 4.2 Navigation
 838  * ----------------------------------------------------------------------------
 839  */
 840
 841 .main-navigation {
 842         clear: both;
 843         margin: 0 auto;
 844         max-width: 1080px;
 845         min-height: 45px;
 846         position: relative;
 847 }
 848
 849 ul.nav-menu,
 850 div.nav-menu > ul {
 851         margin: 0;
 852         padding: 0 40px 0 0;
 853 }
 854
 855 .nav-menu li {
 856         display: inline-block;
 857         position: relative;
 858 }
 859
 860 .nav-menu li a {
 861         color: #141412;
 862         display: block;
 863         font-size: 15px;
 864         line-height: 1;
 865         padding: 15px 20px;
 866         text-decoration: none;
 867 }
 868
 869 .nav-menu li:hover > a,
 870 .nav-menu li a:hover {
 871         background-color: #220e10;
 872         color: #fff;
 873 }
 874
 875 .nav-menu .sub-menu,
 876 .nav-menu .children {
 877         background-color: #220e10;
 878         border: 2px solid #f7f5e7;
 879         border-top: 0;
 880         display: none;
 881         padding: 0;
 882         position: absolute;
 883         left: -2px;
 884         z-index: 99999;
 885 }
 886
 887 .nav-menu .sub-menu ul,
 888 .nav-menu .children ul {
 889         border-left: 0;
 890         left: 100%;
 891         top: 0;
 892 }
 893
 894 ul.nav-menu ul a,
 895 .nav-menu ul ul a {
 896         color: #fff;
 897         margin: 0;
 898         width: 200px;
 899 }
 900
 901 ul.nav-menu ul a:hover,
 902 .nav-menu ul ul a:hover {
 903         background-color: #db572f;
 904 }
 905
 906 ul.nav-menu li:hover > ul,
 907 .nav-menu ul li:hover > ul {
 908         display: block;
 909 }
 910
 911 .nav-menu .current_page_item > a,
 912 .nav-menu .current_page_ancestor > a,
 913 .nav-menu .current-menu-item > a,
 914 .nav-menu .current-menu-ancestor > a {
 915         color: #bc360a;
 916         font-style: italic;
 917 }
 918
 919 .menu-toggle {
 920         display: none;
 921 }
 922
 923 /* Navbar */
 924 .navbar {
 925         background-color: #f7f5e7;
 926         margin: 0 auto;
 927         max-width: 1600px;
 928         width: 100%;
 929 }
 930
 931 .site-header .search-form {
 932         position: absolute;
 933         right: 20px;
 934         top: 1px;
 935 }
 936
 937 .site-header .search-field {
 938         background-color: transparent;
 939         background-image: url(images/search-icon.png);
 940         background-position: 5px center;
 941         background-repeat: no-repeat;
 942         background-size: 24px 24px;
 943         border: none;
 944         cursor: pointer;
 945         height: 37px;
 946         margin: 3px 0;
 947         padding: 0 0 0 34px;
 948         position: relative;
 949         -webkit-transition: width 400ms ease, background 400ms ease;
 950         transition:         width 400ms ease, background 400ms ease;
 951         width: 0;
 952 }
 953
 954 .site-header .search-field:focus {
 955         background-color: #fff;
 956         border: 2px solid #c3c0ab;
 957         cursor: text;
 958         outline: 0;
 959         width: 230px;
 960 }
 961
 962
 963 /**
 964  * 5.0 Content
 965  * ----------------------------------------------------------------------------
 966  */
 967
 968 .hentry {
 969         padding: 40px 0;
 970 }
 971
 972 .entry-header,
 973 .entry-content,
 974 .entry-summary,
 975 .entry-meta {
 976         margin: 0 auto;
 977         max-width: 604px;
 978         width: 100%;
 979 }
 980
 981 .sidebar .entry-header,
 982 .sidebar .entry-content,
 983 .sidebar .entry-summary,
 984 .sidebar .entry-meta {
 985         max-width: 1040px;
 986         padding: 0 376px 0 60px;
 987 }
 988
 989
 990 /**
 991  * 5.1 Entry Header
 992  * ----------------------------------------------------------------------------
 993  */
 994
 995 .sidebar .entry-header .entry-meta {
 996         padding: 0;
 997 }
 998
 999 .entry-thumbnail img {
1000         display: block;
1001         margin: 0 auto 10px;
1002 }
1003
1004 .entry-header {
1005         margin-bottom: 30px;
1006 }
1007
1008 .entry-title {
1009         font-weight: normal;
1010         margin: 0 0 5px;
1011 }
1012
1013 .entry-title a {
1014         color: #141412;
1015 }
1016
1017 .entry-title a:hover {
1018         color: #ea9629;
1019 }
1020
1021
1022 /**
1023  * 5.2 Entry Meta
1024  * ----------------------------------------------------------------------------
1025  */
1026
1027 .entry-meta {
1028         clear: both;
1029         font-size: 14px;
1030 }
1031
1032 .entry-meta a {
1033         color: #bc360a;
1034 }
1035
1036 .entry-meta a:hover {
1037         color: #bc360a;
1038 }
1039
1040 .entry-meta > span {
1041         margin-right: 20px;
1042 }
1043
1044 .entry-meta > span:last-child {
1045         margin-right: 0;
1046 }
1047
1048 .featured-post:before {
1049         content: "\f308";
1050         margin-right: 2px;
1051 }
1052
1053 .entry-meta .date a:before {
1054         content: "\f303";
1055 }
1056
1057 .comments-link a:before {
1058         content: "\f300";
1059         margin-right: 2px;
1060         position: relative;
1061         top: -1px;
1062 }
1063
1064 .entry-meta .author a:before {
1065         content: "\f304";
1066         position: relative;
1067         top: -1px;
1068 }
1069
1070 .categories-links a:first-child:before {
1071         content: "\f301";
1072 }
1073
1074 .tags-links a:first-child:before {
1075         content: "\f302";
1076         position: relative;
1077         top: -1px;
1078 }
1079
1080 .edit-link a:before {
1081         content: "\f411";
1082         position: relative;
1083         top: -1px;
1084 }
1085
1086 .single-author .entry-meta .author,
1087 .sticky.format-standard .entry-meta .date,
1088 .sticky.format-audio .entry-meta .date,
1089 .sticky.format-chat .entry-meta .date,
1090 .sticky.format-image .entry-meta .date,
1091 .sticky.format-gallery .entry-meta .date {
1092         display: none;
1093 }
1094
1095
1096 /**
1097  * 5.3 Entry Content
1098  * ----------------------------------------------------------------------------
1099  */
1100
1101 .entry-content {
1102         -webkit-hyphens: auto;
1103         -moz-hyphens:    auto;
1104         -ms-hyphens:     auto;
1105         hyphens:         auto;
1106         word-wrap: break-word;
1107 }
1108
1109 .entry-content a,
1110 .comment-content a {
1111         color: #bc360a;
1112 }
1113
1114 .entry-content a:hover,
1115 .comment-content a:hover {
1116         color: #ea9629;
1117 }
1118
1119 .entry-content blockquote {
1120         font-size: 24px;
1121 }
1122
1123 .entry-content blockquote cite,
1124 .entry-content blockquote small {
1125         font-size: 16px;
1126 }
1127
1128 .entry-content img.alignleft,
1129 .entry-content .wp-caption.alignleft {
1130         margin-left: -60px;
1131 }
1132
1133 .entry-content img.alignright,
1134 .entry-content .wp-caption.alignright {
1135         margin-right: -60px;
1136 }
1137
1138 footer.entry-meta {
1139         margin-top: 24px;
1140 }
1141
1142 .format-standard footer.entry-meta {
1143         margin-top: 0;
1144 }
1145
1146 /* Page links */
1147 .page-links {
1148         clear: both;
1149         font-size: 16px;
1150         font-style: italic;
1151         font-weight: normal;
1152         line-height: 2.2;
1153         margin: 20px 0;
1154         text-transform: uppercase;
1155 }
1156
1157 .page-links a,
1158 .page-links > span {
1159         background: #fff;
1160         border: 1px solid #fff;
1161         padding: 5px 10px;
1162         text-decoration: none;
1163 }
1164
1165 .format-status .entry-content .page-links a,
1166 .format-gallery .entry-content .page-links a,
1167 .format-chat .entry-content .page-links a,
1168 .format-quote .entry-content .page-links a,
1169 .page-links a {
1170         background: #e63f2a;
1171         border: 1px solid #e63f2a;
1172         color: #fff;
1173 }
1174
1175 .format-gallery .entry-content .page-links a:hover,
1176 .format-audio .entry-content .page-links a:hover,
1177 .format-status .entry-content .page-links a:hover,
1178 .format-video .entry-content .page-links a:hover,
1179 .format-chat .entry-content .page-links a:hover,
1180 .format-quote .entry-content .page-links a:hover,
1181 .page-links a:hover {
1182         background: #fff;
1183         color: #e63f2a;
1184 }
1185
1186 .format-status .entry-content .page-links > span,
1187 .format-quote .entry-content .page-links > span {
1188         background: none;
1189 }
1190
1191 .page-links .page-links-title {
1192         background: transparent;
1193         border: none;
1194         margin-right: 20px;
1195         padding: 0;
1196 }
1197
1198 /* Mediaelements */
1199 .hentry .mejs-mediaelement,
1200 .hentry .mejs-container .mejs-controls {
1201         background: #220e10;
1202 }
1203
1204 .hentry .mejs-controls .mejs-time-rail .mejs-time-loaded,
1205 .hentry .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {
1206         background: #fff;
1207 }
1208
1209 .hentry .mejs-controls .mejs-time-rail .mejs-time-current {
1210         background: #ea9629;
1211 }
1212
1213 .hentry .mejs-controls .mejs-time-rail .mejs-time-total,
1214 .hentry .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total {
1215         background: #595959;
1216 }
1217
1218 .hentry .mejs-controls .mejs-time-rail span,
1219 .hentry .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total,
1220 .hentry .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {
1221         border-radius: 0;
1222 }
1223
1224
1225 /**
1226  * 5.4 Galleries
1227  * ----------------------------------------------------------------------------
1228  */
1229
1230 .gallery {
1231         margin-bottom: 20px;
1232         margin-left: -4px;
1233 }
1234
1235 .gallery-item {
1236         float: left;
1237         margin: 0 4px 4px 0;
1238         overflow: hidden;
1239         position: relative;
1240 }
1241
1242 .gallery-columns-1.gallery-size-medium,
1243 .gallery-columns-1.gallery-size-thumbnail,
1244 .gallery-columns-2.gallery-size-thumbnail,
1245 .gallery-columns-3.gallery-size-thumbnail {
1246         display: table;
1247         margin: 0 auto 20px;
1248 }
1249
1250 .gallery-columns-1 .gallery-item,
1251 .gallery-columns-2 .gallery-item,
1252 .gallery-columns-3 .gallery-item {
1253         text-align: center;
1254 }
1255
1256 .gallery-columns-4 .gallery-item {
1257         max-width: 23%;
1258         max-width: -webkit-calc(25% - 4px);
1259         max-width:         calc(25% - 4px);
1260 }
1261
1262 .gallery-columns-5 .gallery-item {
1263         max-width: 19%;
1264         max-width: -webkit-calc(20% - 4px);
1265         max-width:         calc(20% - 4px);
1266 }
1267
1268 .gallery-columns-6 .gallery-item {
1269         max-width: 15%;
1270         max-width: -webkit-calc(16.7% - 4px);
1271         max-width:         calc(16.7% - 4px);
1272 }
1273
1274 .gallery-columns-7 .gallery-item {
1275         max-width: 13%;
1276         max-width: -webkit-calc(14.28% - 4px);
1277         max-width:         calc(14.28% - 4px);
1278 }
1279
1280 .gallery-columns-8 .gallery-item {
1281         max-width: 11%;
1282         max-width: -webkit-calc(12.5% - 4px);
1283         max-width:         calc(12.5% - 4px);
1284 }
1285
1286 .gallery-columns-9 .gallery-item {
1287         max-width: 9%;
1288         max-width: -webkit-calc(11.1% - 4px);
1289         max-width:         calc(11.1% - 4px);
1290 }
1291
1292 .gallery-columns-1 .gallery-item:nth-of-type(1n),
1293 .gallery-columns-2 .gallery-item:nth-of-type(2n),
1294 .gallery-columns-3 .gallery-item:nth-of-type(3n),
1295 .gallery-columns-4 .gallery-item:nth-of-type(4n),
1296 .gallery-columns-5 .gallery-item:nth-of-type(5n),
1297 .gallery-columns-6 .gallery-item:nth-of-type(6n),
1298 .gallery-columns-7 .gallery-item:nth-of-type(7n),
1299 .gallery-columns-8 .gallery-item:nth-of-type(8n),
1300 .gallery-columns-9 .gallery-item:nth-of-type(9n) {
1301         margin-right: 0;
1302 }
1303
1304 .gallery-caption {
1305         background-color: rgba(0, 0, 0, 0.7);
1306         box-sizing: border-box;
1307         color: #fff;
1308         font-size: 14px;
1309         line-height: 1.3;
1310         margin: 0;
1311         max-height: 50%;
1312         opacity: 0;
1313         padding: 2px 8px;
1314         position: absolute;
1315         bottom: 0;
1316         left: 0;
1317         text-align: left;
1318         -webkit-transition: opacity 400ms ease;
1319         transition:         opacity 400ms ease;
1320         width: 100%;
1321 }
1322
1323 .gallery-caption:before {
1324         box-shadow: 0 -10px 15px #000 inset;
1325         content: "";
1326         height: 100%;
1327         min-height: 49px;
1328         position: absolute;
1329         left: 0;
1330         top: 0;
1331         width: 100%;
1332 }
1333
1334 .gallery-item:hover .gallery-caption {
1335         opacity: 1;
1336 }
1337
1338 .gallery-columns-7 .gallery-caption,
1339 .gallery-columns-8 .gallery-caption,
1340 .gallery-columns-9 .gallery-caption {
1341         display: none;
1342 }
1343
1344
1345 /**
1346  * 5.5 Post Formats
1347  * ----------------------------------------------------------------------------
1348  */
1349
1350 /* Aside */
1351 .format-aside {
1352         background-color: #f7f5e7;
1353 }
1354
1355 .blog .format-aside:first-of-type,
1356 .single .format-aside:first-of-type,
1357 .format-aside + .format-aside,
1358 .format-aside + .format-link,
1359 .format-link + .format-aside {
1360         box-shadow: inset 0 2px 2px rgba(173, 165, 105, 0.2);
1361 }
1362
1363 .format-aside .entry-meta {
1364         margin-top: 0;
1365 }
1366
1367 .format-aside blockquote {
1368         font-size: 100%;
1369         font-weight: normal;
1370 }
1371
1372 .format-aside cite {
1373         font-size: 100%;
1374         text-transform: none;
1375 }
1376
1377 .format-aside cite:before {
1378         content: "\2014";
1379         margin-right: 5px;
1380 }
1381
1382 /* Audio */
1383 .format-audio {
1384         background-color: #db572f;
1385 }
1386
1387 .format-audio .entry-title {
1388         font-size: 28px;
1389         font-weight: bold;
1390 }
1391
1392 .format-audio .entry-content:before {
1393         content: "\f109";
1394         float: left;
1395         font-size: 64px;
1396         position: relative;
1397         top: 4px;
1398 }
1399
1400 .format-audio .entry-content a,
1401 .format-audio .entry-meta a,
1402 .format-audio .entry-content a:hover,
1403 .format-audio .entry-meta a:hover {
1404         color: #fbfaf3;
1405 }
1406
1407 .format-audio .audio-content {
1408         background: url(images/dotted-line.png) repeat-y left top;
1409         background-size: 4px 4px;
1410         float: right;
1411         padding-left: 35px;
1412         width: 80%;
1413         width: -webkit-calc(100% - 85px);
1414         width:         calc(100% - 85px);
1415 }
1416
1417 .format-audio .wp-audio-shortcode {
1418         height: 30px !important; /* Override mediaelement.js style */
1419         margin: 20px 0;
1420         max-width: 400px !important; /* Override mediaelement.js style */
1421 }
1422
1423 .format-audio audio {
1424         max-width: 100% !important; /* Avoid player width overflow. */
1425 }
1426
1427 /* Chat */
1428 .format-chat {
1429         background-color: #eadaa6;
1430 }
1431
1432 .format-chat .entry-title {
1433         font-size: 28px;
1434         font-weight: bold;
1435 }
1436
1437 .format-chat .entry-meta a,
1438 .format-chat .entry-content a {
1439         color: #722d19;
1440 }
1441
1442 .format-chat .entry-meta .date a:before {
1443         content: "\f108";
1444         margin-right: 2px;
1445 }
1446
1447 .format-chat .entry-meta .author {
1448         display: none;
1449 }
1450
1451 .format-chat .chat {
1452         margin: 0;
1453 }
1454
1455 .format-chat .chat .chat-timestamp {
1456         color: #722d19;
1457         float: right;
1458         font-size: 12px;
1459         font-weight: normal;
1460         margin: 5px 10px 0;
1461 }
1462
1463 .format-chat .chat .fn {
1464         font-style: normal;
1465 }
1466
1467 /* Gallery */
1468 .format-gallery {
1469         background-color: #fbca3c;
1470 }
1471
1472 .format-gallery .entry-header {
1473         margin-bottom: 15px;
1474 }
1475
1476 .format-gallery .entry-title {
1477         font-size: 50px;
1478         font-weight: 400;
1479         margin: 0;
1480 }
1481
1482 .format-gallery .entry-meta a,
1483 .format-gallery .entry-content a {
1484         color: #722d19;
1485 }
1486
1487 /* Image */
1488 .format-image .entry-title {
1489         font-size: 28px;
1490         font-weight: bold;
1491 }
1492
1493 .format-image .categories-links,
1494 .format-image .tags-links {
1495         display: none;
1496 }
1497
1498 /* Link */
1499 .format-link {
1500         background-color: #f7f5e7;
1501 }
1502
1503 .blog .format-link:first-of-type,
1504 .single .format-link:first-of-type {
1505         box-shadow: inset 0 2px 2px rgba(173, 165, 105, 0.2);
1506 }
1507
1508 .format-link .entry-header,
1509 .format-link .entry-content p:last-child {
1510         margin-bottom: 0;
1511 }
1512
1513 .format-link .entry-title {
1514         color: #ca3c08;
1515         display: inline;
1516         font: 300 italic 20px "Source Sans Pro", Helvetica, sans-serif;
1517         margin-right: 20px;
1518 }
1519
1520 .format-link .entry-title a {
1521         color: #bc360a;
1522 }
1523
1524 .format-link div.entry-meta {
1525         display: inline;
1526 }
1527
1528 /* Quote */
1529 .format-quote {
1530         background-color: #210d10;
1531 }
1532
1533 .format-quote .entry-content,
1534 .format-quote .entry-meta {
1535         color: #f7f5e7;
1536 }
1537
1538 .format-quote .entry-content blockquote {
1539         font-size: 28px;
1540         margin: 0;
1541 }
1542
1543 .format-quote .entry-content a,
1544 .format-quote .entry-meta a,
1545 .format-quote .linked {
1546         color: #e63f2a;
1547 }
1548
1549 .format-quote .entry-content cite a {
1550         border-bottom: 1px dotted #fff;
1551         color: #fff;
1552 }
1553
1554 .format-quote .entry-content cite a:hover {
1555         text-decoration: none;
1556 }
1557
1558 .format-quote blockquote small,
1559 .format-quote blockquote cite {
1560         display: block;
1561         font-size: 16px;
1562 }
1563
1564 .format-quote blockquote {
1565         font-style: italic;
1566         font-weight: 300;
1567         padding-left: 75px;
1568         position: relative;
1569 }
1570
1571 .format-quote blockquote:before {
1572         content: '\201C';
1573         font-size: 140px;
1574         font-weight: 400;
1575         line-height: .8;
1576         padding-right: 25px;
1577         position: absolute;
1578         left: -15px;
1579         top: -3px;
1580 }
1581
1582 .format-quote .entry-meta .author {
1583         display: none;
1584 }
1585
1586 /* Status */
1587 .format-status {
1588         background-color: #722d19;
1589         padding: 0;
1590 }
1591
1592 .format-status .entry-content,
1593 .format-status .entry-meta {
1594         padding-left: 35px;
1595         position: relative;
1596 }
1597
1598 .format-status .entry-content a {
1599         color: #eadaa6;
1600 }
1601
1602 .format-status .entry-meta a {
1603         color: #f7f5e7;
1604 }
1605
1606 .sidebar .format-status .entry-content,
1607 .sidebar .format-status .entry-meta {
1608         padding-left: 95px;
1609 }
1610
1611 .format-status .entry-content:before,
1612 .format-status .entry-meta:before {
1613         background: url(images/dotted-line.png) repeat-y left bottom;
1614         background-size: 4px 4px;
1615         content: "";
1616         display: block;
1617         height: 100%;
1618         position: absolute;
1619         left: 10px;
1620         top: 0;
1621         width: 1px;
1622 }
1623
1624 .sidebar .format-status .entry-content:before,
1625 .sidebar .format-status .entry-meta:before {
1626         left: 70px;
1627 }
1628
1629 .format-status .categories-links,
1630 .format-status .tags-links {
1631         display: none;
1632 }
1633
1634 /* Ensures the dots in the dot background are in lockstep. */
1635 .format-status .entry-meta:before {
1636         background-position: left top;
1637 }
1638
1639 .format-status .entry-content {
1640         color: #f7f5e7;
1641         font-size: 24px;
1642         font-style: italic;
1643         font-weight: 300;
1644         padding-bottom: 30px;
1645         padding-top: 40px;
1646         position: relative;
1647 }
1648
1649 .format-status .entry-content p:first-child:before {
1650         background-color: rgba(0, 0, 0, 0.65);
1651         content: "";
1652         height: 3px;
1653         margin-top: 13px;
1654         position: absolute;
1655         left: 4px;
1656         width: 13px;
1657 }
1658
1659 .sidebar .format-status .entry-content > p:first-child:before {
1660         left: 64px;
1661 }
1662
1663 .format-status .entry-content p:last-child {
1664         margin-bottom: 0;
1665 }
1666
1667 .format-status .entry-meta {
1668         margin-top: 0;
1669         padding-bottom: 40px;
1670 }
1671
1672 .format-status .entry-meta .date a:before {
1673         content: "\f105";
1674 }
1675
1676 /* Video */
1677 .format-video {
1678         background-color: #db572f;
1679 }
1680
1681 .format-video .entry-content a,
1682 .format-video .entry-meta a,
1683 .format-video .entry-content a:hover,
1684 .format-video .entry-meta a:hover {
1685         color: #fbfaf3;
1686 }
1687
1688 .format-video .entry-title {
1689         font-size: 50px;
1690         font-weight: 400;
1691 }
1692
1693 .format-video .entry-meta {
1694         color: #220e10;
1695 }
1696
1697
1698 /**
1699  * 5.6 Attachments
1700  * ----------------------------------------------------------------------------
1701  */
1702
1703 .attachment .hentry {
1704         background-color: #e8e5ce;
1705         margin: 0;
1706         padding: 0;
1707 }
1708
1709 .attachment .entry-header {
1710         margin-bottom: 0;
1711         max-width: 1040px;
1712         padding: 30px 0;
1713 }
1714
1715 .attachment .entry-title {
1716         display: inline-block;
1717         float: left;
1718         font: 300 italic 30px "Source Sans Pro", Helvetica, sans-serif;
1719         margin: 0;
1720 }
1721
1722 .attachment .entry-title:before {
1723         content: "\f416";
1724         font-size: 32px;
1725         margin-right: 10px;
1726 }
1727
1728 .attachment .entry-meta {
1729         clear: none;
1730         color: inherit;
1731         float: right;
1732         max-width: 604px;
1733         padding: 9px 0 0;
1734         text-align: right;
1735 }
1736
1737 .hentry.attachment:not(.image-attachment) .entry-meta {
1738         max-width: 104px;
1739 }
1740
1741 .attachment footer.entry-meta {
1742         display: none;
1743 }
1744
1745 .attachment-meta:before {
1746         content: "\f307";
1747 }
1748
1749 .full-size-link a:before {
1750         content: "\f402";
1751 }
1752
1753 .full-size-link:before {
1754         content: none;
1755 }
1756
1757 .attachment .entry-meta a,
1758 .attachment .entry-meta .edit-link:before,
1759 .attachment .full-size-link:before {
1760         color: #ca3c08;
1761 }
1762
1763 .attachment .entry-content {
1764         background-color: #fff;
1765         max-width: 100%;
1766         padding: 40px 0;
1767 }
1768
1769 .image-navigation {
1770         margin: 0 auto;
1771         max-width: 1040px;
1772         position: relative;
1773 }
1774
1775 .image-navigation a:hover {
1776         text-decoration: none;
1777 }
1778
1779 .image-navigation .nav-previous,
1780 .image-navigation .nav-next {
1781         position: absolute;
1782         top: 50px;
1783 }
1784
1785 .image-navigation .nav-previous {
1786         left: 0;
1787 }
1788
1789 .image-navigation .nav-next {
1790         right: 0;
1791 }
1792
1793 .image-navigation .meta-nav {
1794         font-size: 32px;
1795         font-weight: 300;
1796         vertical-align: -4px;
1797 }
1798
1799 .attachment .entry-attachment,
1800 .attachment .type-attachment p {
1801         margin: 0 auto;
1802         max-width: 724px;
1803         text-align: center;
1804 }
1805
1806 .attachment .entry-attachment .attachment {
1807         display: inline-block;
1808 }
1809
1810 .attachment .entry-caption {
1811         text-align: left;
1812 }
1813
1814 .attachment .entry-description {
1815         margin: 20px auto 0;
1816         max-width: 604px;
1817 }
1818
1819 .attachment .entry-caption p:last-child,
1820 .attachment .entry-description p:last-child {
1821         margin: 0;
1822 }
1823
1824 .attachment .site-main .sidebar-container {
1825         display: none;
1826 }
1827
1828
1829 /**
1830  * 5.7 Post/Paging Navigation
1831  * ----------------------------------------------------------------------------
1832  */
1833
1834 .navigation .nav-previous {
1835         float: left;
1836 }
1837
1838 .navigation .nav-next {
1839         float: right;
1840 }
1841
1842 .navigation a {
1843         color: #bc360a;
1844 }
1845
1846 .navigation a:hover {
1847         color: #ea9629;
1848         text-decoration: none;
1849 }
1850
1851 .paging-navigation {
1852         background-color: #e8e5ce;
1853         padding: 40px 0;
1854 }
1855
1856 .paging-navigation .nav-links {
1857         margin: 0 auto;
1858         max-width: 604px;
1859         width: 100%;
1860 }
1861
1862 .sidebar .paging-navigation .nav-links {
1863         max-width: 1040px;
1864         padding: 0 376px 0 60px;
1865 }
1866
1867 .paging-navigation .nav-next {
1868         padding: 13px 0;
1869 }
1870
1871 .paging-navigation a {
1872         font-size: 22px;
1873         font-style: italic;
1874         font-weight: 300;
1875 }
1876
1877 .paging-navigation .meta-nav {
1878         background-color: #e63f2a;
1879         border-radius: 50%;
1880         color: #fff;
1881         display: inline-block;
1882         font-size: 26px;
1883         padding: 3px 0 8px;
1884         text-align: center;
1885         width: 50px;
1886 }
1887
1888 .paging-navigation .nav-previous .meta-nav {
1889         margin-right: 10px;
1890         padding: 17px 0 23px;
1891         width: 80px;
1892 }
1893
1894 .paging-navigation .nav-next .meta-nav {
1895         margin-left: 10px;
1896 }
1897
1898 .paging-navigation a:hover .meta-nav {
1899         background-color: #ea9629;
1900         text-decoration: none;
1901 }
1902
1903 .post-navigation {
1904         background-color: #fff;
1905         color: #ca3c08;
1906         font-size: 20px;
1907         font-style: italic;
1908         font-weight: 300;
1909         padding: 20px 0;
1910 }
1911
1912 .post-navigation .nav-links {
1913         margin: 0 auto;
1914         max-width: 1040px;
1915 }
1916
1917 .sidebar .post-navigation .nav-links {
1918         padding: 0 376px 0 60px;
1919 }
1920
1921 .post-navigation a[rel="next"] {
1922         float: right;
1923         text-align: right;
1924 }
1925
1926
1927 /**
1928  * 5.8 Author Bio
1929  * ----------------------------------------------------------------------------
1930  */
1931
1932 .author-info {
1933         margin: 0 auto;
1934         max-width: 604px;
1935         padding: 30px 0 10px;
1936         text-align: left; /* gallery & video post formats */
1937         width: 100%;
1938 }
1939
1940 .author.sidebar .author-info {
1941         max-width: 1040px;
1942         padding: 30px 376px 10px 60px;
1943 }
1944
1945 .single .author-info {
1946         padding: 50px 0 0;
1947 }
1948
1949 .author-avatar .avatar {
1950         float: left;
1951         margin: 0 30px 30px 0;
1952 }
1953
1954 .single-format-status .author-description {
1955         color: #f7f5e7;
1956 }
1957
1958 .author-description .author-title {
1959         clear: none;
1960         font: 300 italic 20px "Source Sans Pro", Helvetica, sans-serif;
1961         margin: 0 0 8px;
1962 }
1963
1964 .author-link {
1965         color: #ca3c08;
1966         margin-left: 2px;
1967 }
1968
1969 .author.archive .author-link {
1970         display: none;
1971 }
1972
1973
1974 /**
1975  * 5.9 Archives
1976  * ----------------------------------------------------------------------------
1977  */
1978
1979 .archive-header {
1980         background-color: #e8e5ce;
1981 }
1982
1983 .archive-title,
1984 .archive-meta {
1985         font: 300 italic 30px "Source Sans Pro", Helvetica, sans-serif;
1986         margin: 0 auto;
1987         max-width: 1040px;
1988         padding: 30px 0;
1989         width: 100%;
1990 }
1991
1992 .archive-meta {
1993         font-size: 16px;
1994         font-style: normal;
1995         font-weight: normal;
1996         margin-top: -15px;
1997         padding: 0 0 11px;
1998 }
1999
2000 .sidebar .archive-meta {
2001         padding-right: 316px;
2002 }
2003
2004
2005 /**
2006  * 5.10 Search Results/No posts
2007  * ----------------------------------------------------------------------------
2008  */
2009
2010 .page-header {
2011         background-color: #e8e5ce;
2012 }
2013
2014 .page-title {
2015         font: 300 italic 30px "Source Sans Pro", Helvetica, sans-serif;
2016         margin: 0 auto;
2017         max-width: 1040px;
2018         padding: 30px 0;
2019         width: 100%;
2020 }
2021
2022 .page-content {
2023         margin: 0 auto;
2024         max-width: 604px;
2025         padding: 40px 0;
2026         width: 100%;
2027 }
2028
2029 .sidebar .page-content {
2030         margin: 0 auto;
2031         max-width: 1040px;
2032         padding: 40px 376px 40px 60px;
2033 }
2034
2035
2036 /**
2037  * 5.11 404
2038  * ----------------------------------------------------------------------------
2039  */
2040
2041 .error404 .page-header {
2042         background-color: #fff;
2043 }
2044
2045 .error404 .page-title {
2046         line-height: 0.6;
2047         margin: 0;
2048         padding: 300px;
2049         position: relative;
2050         text-align: center;
2051         width: auto;
2052 }
2053
2054 .error404 .page-title:before {
2055         color: #e8e5ce;
2056         content: "\f423";
2057         font-size: 964px;
2058         line-height: 0.6;
2059         overflow: hidden;
2060         position: absolute;
2061         left: 7px;
2062         top: 28px;
2063 }
2064
2065 .error404 .page-wrapper {
2066         background-color: #e8e5ce;
2067 }
2068
2069 .error404 .page-header,
2070 .error404 .page-content {
2071         margin: 0 auto;
2072         max-width: 1040px;
2073         padding-bottom: 40px;
2074         width: 100%;
2075 }
2076
2077
2078 /**
2079  * 5.12 Comments
2080  * ----------------------------------------------------------------------------
2081  */
2082
2083 .comments-title,
2084 .comment-list,
2085 .comment-reply-title,
2086 .must-log-in,
2087 .comment-respond .comment-form,
2088 .comment-respond iframe {
2089         display: block;
2090         margin-left: auto;
2091         margin-right: auto;
2092         max-width: 604px;
2093         width: 100%;
2094 }
2095
2096 .sidebar .comments-title,
2097 .sidebar .comment-list,
2098 .sidebar .must-log-in,
2099 .sidebar .comment-reply-title,
2100 .sidebar .comment-navigation,
2101 .sidebar .comment-respond .comment-form {
2102         max-width: 1040px;
2103         padding-left: 60px;
2104         padding-right: 376px;
2105 }
2106
2107 .comments-title {
2108         font: 300 italic 28px "Source Sans Pro", Helvetica, sans-serif;
2109 }
2110
2111 .comment-list,
2112 .comment-list .children {
2113         list-style-type: none;
2114         padding: 0;
2115 }
2116
2117 .comment-list .children {
2118         margin-left: 20px;
2119 }
2120
2121 .comment-list > li:after,
2122 .comment-list .children > li:before {
2123         background: url(images/dotted-line.png) repeat left top;
2124         background-size: 4px 4px;
2125         content: "";
2126         display: block;
2127         height: 1px;
2128         width: 100%;
2129 }
2130
2131 .comment-list > li:last-child:after {
2132         display: none;
2133 }
2134
2135 .comment-body {
2136         padding: 24px 0;
2137         position: relative;
2138 }
2139
2140 .comment-author {
2141         float: left;
2142         max-width: 74px;
2143 }
2144
2145 .comment-author .avatar {
2146         display: block;
2147         margin-bottom: 10px;
2148 }
2149
2150 .comment-author .fn {
2151         word-wrap: break-word;
2152 }
2153
2154 .comment-author .fn,
2155 .comment-author .url,
2156 .comment-reply-link,
2157 .comment-reply-login {
2158         color: #bc360a;
2159         font-size: 14px;
2160         font-style: normal;
2161         font-weight: normal;
2162 }
2163
2164 .says {
2165         display: none;
2166 }
2167
2168 .no-avatars .comment-author {
2169         margin: 0 0 5px;
2170         max-width: 100%;
2171         position: relative;
2172 }
2173
2174 .no-avatars .comment-metadata,
2175 .no-avatars .comment-content,
2176 .no-avatars .comment-list .reply {
2177         width: 100%;
2178 }
2179
2180 .bypostauthor > .comment-body .fn:before {
2181         content: "\f408";
2182         vertical-align: text-top;
2183 }
2184
2185 .comment-list .edit-link {
2186         margin-left: 20px;
2187 }
2188
2189 .comment-metadata,
2190 .comment-awaiting-moderation,
2191 .comment-content,
2192 .comment-list .reply {
2193         float: right;
2194         width: 79%;
2195         width: -webkit-calc(100% - 124px);
2196         width:         calc(100% - 124px);
2197         word-wrap: break-word;
2198 }
2199
2200 .comment-meta,
2201 .comment-meta a {
2202         color: #a2a2a2;
2203         font-size: 13px;
2204 }
2205
2206 .comment-meta a:hover {
2207         color: #ea9629;
2208 }
2209
2210 .comment-metadata {
2211         margin-bottom: 20px;
2212 }
2213
2214 .ping-meta {
2215         color: #a2a2a2;
2216         font-size: 13px;
2217         line-height: 2;
2218 }
2219
2220 .comment-awaiting-moderation {
2221         color: #a2a2a2;
2222 }
2223
2224 .comment-awaiting-moderation:before {
2225         content: "\f414";
2226         margin-right: 5px;
2227         position: relative;
2228         top: -2px;
2229 }
2230
2231 .comment-reply-link:before,
2232 .comment-reply-login:before {
2233         content: "\f412";
2234         margin-right: 3px;
2235 }
2236
2237 /* Comment form */
2238 .comment-respond {
2239         background-color: #f7f5e7;
2240         padding: 30px 0;
2241 }
2242
2243 .comment .comment-respond {
2244         margin-bottom: 20px;
2245         padding: 20px;
2246 }
2247
2248 .comment-reply-title {
2249         font: 300 italic 28px "Source Sans Pro", Helvetica, sans-serif;
2250 }
2251
2252 .comment-reply-title small a {
2253         color: #131310;
2254         display: inline-block;
2255         float: right;
2256         height: 16px;
2257         overflow: hidden;
2258         width: 16px;
2259 }
2260
2261 .comment-reply-title small a:hover {
2262         color: #ed331c;
2263         text-decoration: none;
2264 }
2265
2266 .comment-reply-title small a:before {
2267         content: "\f406";
2268         vertical-align: top;
2269 }
2270
2271 .sidebar .comment-list .comment-reply-title,
2272 .sidebar .comment-list .comment-respond .comment-form {
2273         padding: 0;
2274 }
2275
2276 .comment-form .comment-notes {
2277         margin-bottom: 15px;
2278 }
2279
2280 .comment-form .comment-form-author,
2281 .comment-form .comment-form-email,
2282 .comment-form .comment-form-url {
2283         margin-bottom: 8px;
2284 }
2285
2286 .comment-form [for="author"],
2287 .comment-form [for="email"],
2288 .comment-form [for="url"],
2289 .comment-form [for="comment"] {
2290         float: left;
2291         padding: 5px 0;
2292         width: 120px;
2293 }
2294
2295 .comment-form .required {
2296         color: #ed331c;
2297 }
2298
2299 .comment-form input[type="text"],
2300 .comment-form input[type="email"],
2301 .comment-form input[type="url"] {
2302         max-width: 270px;
2303         width: 60%;
2304 }
2305
2306 .comment-form textarea {
2307         width: 100%;
2308 }
2309
2310 .form-allowed-tags,
2311 .form-allowed-tags code {
2312         color: #686758;
2313         font-size: 12px;
2314 }
2315
2316 .form-allowed-tags code {
2317         font-size: 10px;
2318         margin-left: 3px;
2319 }
2320
2321 .comment-list .pingback,
2322 .comment-list .trackback {
2323         padding-top: 24px;
2324 }
2325
2326 .comment-navigation {
2327         font-size: 20px;
2328         font-style: italic;
2329         font-weight: 300;
2330         margin: 0 auto;
2331         max-width: 604px;
2332         padding: 20px 0 30px;
2333         width: 100%;
2334 }
2335
2336 .no-comments {
2337         background-color: #f7f5e7;
2338         font-size: 20px;
2339         font-style: italic;
2340         font-weight: 300;
2341         margin: 0;
2342         padding: 40px 0;
2343         text-align: center;
2344 }
2345
2346 .sidebar .no-comments {
2347         padding-left: 60px;
2348         padding-right: 376px;
2349 }
2350
2351
2352 /**
2353  * 5.13 Multisite
2354  * ----------------------------------------------------------------------------
2355  */
2356
2357 .site-main .mu_register {
2358         margin: 0 auto;
2359         max-width: 604px;
2360         width: 100%;
2361 }
2362
2363 .mu_alert {
2364         margin-top: 25px;
2365 }
2366
2367 .site-main .mu_register input[type="submit"],
2368 .site-main .mu_register #blog_title,
2369 .site-main .mu_register #user_email,
2370 .site-main .mu_register #blogname,
2371 .site-main .mu_register #user_name {
2372         font-size: inherit;
2373         width: 270px;
2374 }
2375
2376 .site-main .mu_register input[type="submit"] {
2377         width: auto;
2378 }
2379
2380
2381 /**
2382  * 6.0 Sidebar
2383  * ----------------------------------------------------------------------------
2384  */
2385
2386 .site-main .widget-area {
2387         float: right;
2388         width: 300px;
2389 }
2390
2391
2392 /**
2393  * 6.1 Widgets
2394  * ----------------------------------------------------------------------------
2395  */
2396
2397 .widget {
2398         background-color: rgba(247, 245, 231, 0.7);
2399         font-size: 14px;
2400         -webkit-hyphens: auto;
2401         -moz-hyphens:    auto;
2402         -ms-hyphens:     auto;
2403         hyphens:         auto;
2404         margin: 0 0 24px;
2405         padding: 20px;
2406         word-wrap: break-word;
2407 }
2408
2409 .widget .widget-title {
2410         font: 300 italic 20px "Source Sans Pro", Helvetica, sans-serif;
2411         margin: 0 0 10px;
2412 }
2413
2414 .widget ul,
2415 .widget ol {
2416         list-style-type: none;
2417         margin: 0;
2418         padding: 0;
2419 }
2420
2421 .widget li {
2422         padding: 5px 0;
2423 }
2424
2425 .widget .children li:last-child {
2426         padding-bottom: 0;
2427 }
2428
2429 .widget li > ul,
2430 .widget li > ol {
2431         margin-left: 20px;
2432 }
2433
2434 .widget a {
2435         color: #bc360a;
2436 }
2437
2438 .widget a:hover {
2439         color: #ea9629;
2440 }
2441
2442 /* Search widget */
2443 .search-form .search-submit {
2444         display: none;
2445 }
2446
2447 /* RSS Widget */
2448 .widget_rss .rss-date {
2449         display: block;
2450 }
2451
2452 .widget_rss .rss-date,
2453 .widget_rss li > cite {
2454         color: #a2a2a2;
2455 }
2456
2457 /* Calendar Widget */
2458 .widget_calendar table,
2459 .widget_calendar td {
2460         border: 0;
2461         border-collapse: separate;
2462         border-spacing: 1px;
2463 }
2464
2465 .widget_calendar caption {
2466         font-size: 14px;
2467         margin: 0;
2468 }
2469
2470 .widget_calendar th,
2471 .widget_calendar td {
2472         padding: 0;
2473         text-align: center;
2474 }
2475
2476 .widget_calendar a {
2477         display: block;
2478 }
2479
2480 .widget_calendar a:hover {
2481         background-color: rgba(0, 0, 0, 0.15);
2482 }
2483
2484 .widget_calendar tbody td {
2485         background-color: rgba(255, 255, 255, 0.5);
2486 }
2487
2488 .site-footer .widget_calendar tbody td {
2489         background-color: rgba(255, 255, 255, 0.05);
2490 }
2491
2492 .widget_calendar tbody .pad, .site-footer .widget_calendar tbody .pad {
2493         background-color: transparent;
2494 }
2495
2496
2497 /**
2498  * 7.0 Footer
2499  * ----------------------------------------------------------------------------
2500  */
2501
2502 .site-footer {
2503         background-color: #e8e5ce;
2504         color: #686758;
2505         font-size: 14px;
2506         text-align: center;
2507 }
2508
2509 .site-footer .widget-area,
2510 .sidebar .site-footer {
2511         text-align: left;
2512 }
2513
2514 .site-footer a {
2515         color: #686758;
2516 }
2517
2518 .site-footer .sidebar-container {
2519         background-color: #220e10;
2520         padding: 20px 0;
2521 }
2522
2523 .site-footer .widget-area {
2524         margin: 0 auto;
2525         max-width: 1040px;
2526         width: 100%;
2527 }
2528
2529 .sidebar .site-footer .widget-area {
2530         max-width: 724px;
2531         position: relative;
2532         left: -158px;
2533 }
2534
2535 .site-footer .widget {
2536         background: transparent;
2537         color: #fff;
2538         float: left;
2539         margin-right: 20px;
2540         width: 245px;
2541 }
2542
2543 .sidebar .site-footer .widget {
2544         width: 228px;
2545 }
2546
2547 .sidebar .site-footer .widget:nth-of-type(4),
2548 .sidebar .site-footer .widget:nth-of-type(3) {
2549         margin-right: 0;
2550 }
2551
2552 .site-footer .widget a {
2553         color: #e6402a;
2554 }
2555
2556 .site-footer .widget-title,
2557 .site-footer .widget-title a,
2558 .site-footer .wp-caption-text {
2559         color: #fff;
2560 }
2561
2562 .site-info {
2563         margin: 0 auto;
2564         max-width: 1040px;
2565         padding: 30px 0;
2566         width: 100%;
2567 }
2568
2569 #wpstats {
2570         display: block;
2571         margin: -10px auto 0;
2572 }
2573
2574
2575 /**
2576  * 8.0 Media Queries
2577  * ----------------------------------------------------------------------------
2578  */
2579
2580 /* Does the same thing as <meta name="viewport" content="width=device-width">,
2581  * but in the future W3C standard way. -ms- prefix is required for IE10+ to
2582  * render responsive styling in Windows 8 "snapped" views; IE10+ does not honor
2583  * the meta tag. See http://core.trac.wordpress.org/ticket/25888.
2584  */
2585 @-ms-viewport {
2586         width: device-width;
2587 }
2588 @viewport {
2589         width: device-width;
2590 }
2591
2592 @media (max-width: 1599px) {
2593         .site {
2594                 border: 0;
2595         }
2596 }
2597
2598 @media (max-width: 1069px) {
2599         .sidebar img.alignleft,
2600         .sidebar .wp-caption.alignleft {
2601                 margin-left: 0;
2602         }
2603
2604         .sidebar img.alignright,
2605         .sidebar .wp-caption.alignright {
2606                 margin-right: 0;
2607         }
2608
2609         .error404 .page-header {
2610                 margin-left: auto;
2611                 max-width: 604px;
2612                 width: 100%;
2613         }
2614
2615         .archive-header,
2616         .search .page-header,
2617         .archive .page-header,
2618         .blog .page-header,
2619         .error404 .page-content,
2620         .search .page-content,
2621         .archive .page-content,
2622         .attachment .entry-header,
2623         .attachment .entry-content,
2624         .post-navigation .nav-links,
2625         .sidebar .site-info,
2626         .site-footer .widget-area {
2627                 padding-left: 20px;
2628                 padding-right: 20px;
2629         }
2630
2631         .error404 .page-title {
2632                 font-size: 24px;
2633                 padding: 180px;
2634         }
2635
2636         .error404 .page-title:before {
2637                 font-size: 554px;
2638         }
2639
2640         .attachment .image-navigation {
2641                 max-width: 724px;
2642         }
2643
2644         .image-navigation .nav-previous,
2645         .image-navigation .nav-next {
2646                 position: static;
2647         }
2648
2649         .site-main .widget-area {
2650                 margin-right: 60px;
2651         }
2652 }
2653
2654 @media (max-width: 999px) {
2655         .sidebar .entry-header,
2656         .sidebar .entry-content,
2657         .sidebar .entry-summary,
2658         .sidebar .entry-meta,
2659         .sidebar .comment-list,
2660         .sidebar .comment-reply-title,
2661         .sidebar .comment-navigation,
2662         .sidebar .comment-respond .comment-form,
2663         .sidebar .featured-gallery,
2664         .sidebar .post-navigation .nav-links,
2665         .author.sidebar .author-info {
2666                 max-width: 604px;
2667                 padding-left: 0;
2668                 padding-right: 0;
2669         }
2670
2671         .sidebar .site-info,
2672         .search.sidebar .page-content,
2673         .blog.sidebar .page-content,
2674         .attachment .entry-header,
2675         .sidebar .comments-title {
2676                 max-width: 604px;
2677         }
2678
2679         .sidebar .archive-meta,
2680         .attachment .entry-header,
2681         .search.sidebar .page-content,
2682         .blog.sidebar .page-content,
2683         .sidebar .site-info,
2684         .sidebar .comments-title,
2685         .sidebar .no-comments {
2686                 padding-left: 0;
2687                 padding-right: 0;
2688         }
2689
2690         .attachment .entry-meta {
2691                 float: left;
2692                 text-align: left;
2693                 width: 100%;
2694         }
2695
2696         .attachment .entry-content {
2697                 max-width: 100%;
2698                 padding: 40px 0;
2699         }
2700
2701         .format-status .entry-content {
2702                 padding-top: 40px;
2703         }
2704
2705         .format-status .entry-meta {
2706                 padding-bottom: 40px;
2707         }
2708
2709         .sidebar .format-status .entry-content,
2710         .sidebar .format-status .entry-meta {
2711                 padding-left: 35px;
2712         }
2713
2714         .sidebar .format-status .entry-content:before,
2715         .sidebar .format-status .entry-meta:before {
2716                 left: 10px;
2717         }
2718
2719         .sidebar .format-status .entry-content p:first-child:before {
2720                 left: 4px;
2721         }
2722
2723         .sidebar .paging-navigation .nav-links {
2724                 padding: 0 60px;
2725         }
2726
2727         .site-main .sidebar-container {
2728                 height: auto;
2729                 margin: 0 auto;
2730                 max-width: 604px;
2731                 position: relative;
2732                 top: 20px;
2733         }
2734
2735         .site-main .widget-area {
2736                 float: none;
2737                 margin: 0;
2738                 width: 100%;
2739         }
2740
2741         .sidebar .site-footer .widget-area {
2742                 max-width: 100%;
2743                 left: 0;
2744         }
2745 }
2746
2747 /* Collapse oversized image and pulled images after iPad breakpoint. */
2748 @media (max-width: 767px) {
2749         .entry-content img.alignleft,
2750         .entry-content .wp-caption.alignleft {
2751                 margin-left: 0;
2752         }
2753
2754         .entry-content img.alignright,
2755         .entry-content .wp-caption.alignright {
2756                 margin-right: 0;
2757         }
2758
2759         .attachment .image-navigation,
2760         .attachment .entry-attachment .attachment {
2761                 max-width: 604px;
2762                 padding: 0;
2763                 width: 100%;
2764         }
2765
2766         .gallery-caption {
2767                 display: none;
2768         }
2769 }
2770
2771 @media (max-width: 643px) {
2772         .site-title {
2773                 font-size: 30px;
2774         }
2775
2776         #content .entry-header,
2777         #content .entry-content,
2778         #content .entry-summary,
2779         #content footer.entry-meta,
2780         #content .featured-gallery,
2781         .search.sidebar .page-content,
2782         .blog.sidebar .page-content,
2783         .sidebar .post-navigation .nav-links,
2784         .paging-navigation .nav-links,
2785         #content .author-info,
2786         .comments-area .comments-title,
2787         .comments-area .comment-list,
2788         .comments-area .comment-navigation,
2789         .comment-respond,
2790         .sidebar .site-info,
2791         .sidebar .paging-navigation .nav-links {
2792                 padding-left: 20px;
2793                 padding-right: 20px;
2794         }
2795
2796         #content .format-status .entry-content,
2797         #content .format-status .entry-met {
2798                 padding-left: 35px;
2799         }
2800
2801         /* Small menu */
2802         .menu-toggle {
2803                 cursor: pointer;
2804                 display: inline-block;
2805                 font: bold 16px/1.3 "Source Sans Pro", Helvetica, sans-serif;
2806                 margin: 0;
2807                 padding: 12px 0 12px 20px;
2808         }
2809
2810         .menu-toggle:after {
2811                 content: "\f502";
2812                 font-size: 12px;
2813                 padding-left: 8px;
2814                 vertical-align: -4px;
2815         }
2816
2817         .toggled-on .menu-toggle:after {
2818                 content: "\f500";
2819                 vertical-align: 2px;
2820         }
2821
2822         .toggled-on .nav-menu,
2823         .toggled-on .nav-menu > ul {
2824                 display: block;
2825                 margin-left: 0;
2826                 padding: 0;
2827                 width: 100%;
2828         }
2829
2830         .toggled-on li,
2831         .toggled-on .children {
2832                 display: block;
2833         }
2834
2835         .toggled-on .nav-menu li > ul {
2836                 background-color: transparent;
2837                 display: block;
2838                 float: none;
2839                 margin-left: 20px;
2840                 position: relative;
2841                 left: auto;
2842                 top: auto;
2843         }
2844
2845         .toggled-on .nav-menu li > ul a {
2846                 color: #141412;
2847                 width: auto;
2848         }
2849
2850         .toggled-on .nav-menu li:hover > a,
2851         .toggled-on .nav-menu .children a {
2852                 background-color: transparent;
2853                 color: #141412;
2854         }
2855
2856         .toggled-on .nav-menu li a:hover,
2857         .toggled-on .nav-menu ul a:hover {
2858                 background-color: #db572f;
2859                 color: #fff;
2860         }
2861
2862         ul.nav-menu,
2863         div.nav-menu > ul {
2864                 display: none;
2865         }
2866
2867         #content .featured-gallery {
2868                 padding-left: 24px;
2869         }
2870
2871         .gallery-columns-1 .gallery-item {
2872                 margin-right: 0;
2873                 width: 100%;
2874         }
2875
2876         .entry-title,
2877         .format-chat .entry-title,
2878         .format-image .entry-title,
2879         .format-gallery .entry-title,
2880         .format-video .entry-title {
2881                 font-size: 22px;
2882                 font-weight: bold;
2883         }
2884
2885         .format-quote blockquote,
2886         .format-status .entry-content {
2887                 font-size: 18px;
2888         }
2889
2890         .format-quote blockquote small,
2891         .format-quote blockquote cite {
2892                 font-size: 13px;
2893         }
2894
2895         .error404 .page-title {
2896                 padding: 40px 0 0;
2897         }
2898
2899         .error404 .page-title:before {
2900                 content: normal;
2901         }
2902
2903         .comment-author {
2904                 margin-right: 30px;
2905         }
2906
2907         .comment-author .avatar {
2908                 height: auto;
2909                 max-width: 100%;
2910         }
2911
2912         .comment-metadata,
2913         .comment-content,
2914         .comment-list .reply {
2915                 width: 70%;
2916                 width: -webkit-calc(100% - 104px);
2917                 width:         calc(100% - 104px);
2918         }
2919
2920         .comment-form input[type="text"],
2921         .comment-form input[type="email"],
2922         .comment-form input[type="url"] {
2923                 width: -webkit-calc(100% - 120px);
2924                 width:         calc(100% - 120px);
2925         }
2926
2927         .comment-form textarea {
2928                 height: 80px; /* Smaller field for mobile. */
2929         }
2930
2931         /* Audio */
2932         .format-audio .entry-content:before {
2933                 display: none;
2934         }
2935
2936         .format-audio .audio-content {
2937                 background-image: none;
2938                 float: none;
2939                 padding-left: 0;
2940                 width: auto;
2941         }
2942 }
2943
2944 /* Mobile devices */
2945 @media (max-width: 359px) {
2946         .gallery {
2947                 margin-left: 0;
2948         }
2949
2950         .gallery .gallery-item,
2951         .gallery-columns-2.gallery-size-thumbnail .gallery-item {
2952                 max-width: none;
2953                 width: 49%;
2954                 width: -webkit-calc(50% - 4px);
2955                 width:         calc(50% - 4px);
2956         }
2957
2958         .gallery-columns-1.gallery-size-medium,
2959         .gallery-columns-1.gallery-size-thumbnail,
2960         .gallery-columns-2.gallery-size-thumbnail,
2961         .gallery-columns-3.gallery-size-thumbnail {
2962                 display: block;
2963         }
2964
2965         .gallery-columns-1 .gallery-item,
2966         .gallery-columns-1.gallery-size-medium .gallery-item,
2967         .gallery-columns-1.gallery-size-thumbnail .gallery-item {
2968                 text-align: center;
2969                 width: 98%;
2970                 width: -webkit-calc(100% - 4px);
2971                 width:         calc(100% - 4px);
2972         }
2973
2974         .gallery-columns-3 .gallery-item:nth-of-type(3n),
2975         .gallery-columns-5 .gallery-item:nth-of-type(5n),
2976         .gallery-columns-7 .gallery-item:nth-of-type(7n),
2977         .gallery-columns-9 .gallery-item:nth-of-type(9n) {
2978                 margin-right: 4px;
2979         }
2980
2981         .gallery br {
2982                 display: none;
2983         }
2984
2985         .gallery .gallery-item:nth-of-type(even) {
2986                 margin-right: 0;
2987         }
2988
2989         /* Comments */
2990         .comment-author {
2991                 margin: 0 0 5px;
2992                 max-width: 100%;
2993         }
2994
2995         .comment-author .avatar {
2996                 display: inline;
2997                 margin: 0 5px 0 0;
2998                 max-width: 20px;
2999         }
3000
3001         .comment-metadata,
3002         .comment-content,
3003         .comment-list .reply {
3004                 width: 100%;
3005         }
3006 }
3007
3008
3009 /**
3010  * 9.0 Print
3011  * ----------------------------------------------------------------------------
3012  */
3013
3014 /* Retina-specific styles. */
3015 @media print,
3016         (-o-min-device-pixel-ratio: 5/4),
3017         (-webkit-min-device-pixel-ratio: 1.25),
3018         (min-resolution: 120dpi) {
3019
3020         .site-header .search-field {
3021                 background-image: url(images/search-icon-2x.png);
3022         }
3023
3024         .format-audio .audio-content,
3025         .format-status .entry-content:before,
3026         .format-status .entry-meta:before,
3027         .comment-list > li:after,
3028         .comment-list .children > li:before {
3029                 background-image: url(images/dotted-line-2x.png);
3030         }
3031 }
3032
3033 @media print {
3034         body {
3035                 background: none !important;
3036                 color: #000;
3037                 font-size: 10pt;
3038         }
3039
3040         footer a[rel="bookmark"]:link:after,
3041         footer a[rel="bookmark"]:visited:after {
3042                 content: " [" attr(href) "] "; /* Show URLs */
3043         }
3044
3045         .site {
3046                 max-width: 98%;
3047         }
3048
3049         .site-header {
3050                 background-image: none !important;
3051         }
3052
3053         .site-header .home-link {
3054                 max-width: none;
3055                 min-height: 0;
3056         }
3057
3058         .site-title {
3059                 color: #000;
3060                 font-size: 21pt;
3061         }
3062
3063         .site-description {
3064                 font-size: 10pt;
3065         }
3066
3067         .author-avatar,
3068         .site-footer,
3069         .comment-respond,
3070         .comments-area .comment-edit-link,
3071         .comments-area .reply,
3072         .comments-link,
3073         .entry-meta .edit-link,
3074         .page-links,
3075         .site-content nav,
3076         .widget-area,
3077         .main-navigation,
3078         .navbar,
3079         .more-link {
3080                 display: none;
3081         }
3082
3083         .entry-header,
3084         .entry-content,
3085         .entry-summary,
3086         .entry-meta {
3087                 margin: 0;
3088                 width: 100%;
3089         }
3090
3091         .page-title,
3092         .entry-title {
3093                 font-size: 21pt;
3094         }
3095
3096         .entry-meta,
3097         .entry-meta a {
3098                 color: #444;
3099                 font-size: 10pt;
3100         }
3101
3102         .entry-content img.alignleft,
3103         .entry-content .wp-caption.alignleft {
3104                 margin-left: 0;
3105         }
3106
3107         .entry-content img.alignright,
3108         .entry-content .wp-caption.alignright {
3109                 margin-right: 0;
3110         }
3111
3112         .format-image .entry-content .size-full {
3113                 margin: 0;
3114         }
3115
3116         /* Remove colors from post formats */
3117         .hentry {
3118                 background-color: #fff;
3119         }
3120
3121         /* Comments */
3122         .comments-area > li.comment {
3123                 background: none;
3124                 position: relative;
3125                 width: auto;
3126         }
3127
3128         .comment-metadata {
3129                 float: none;
3130         }
3131
3132         .comment-author .fn,
3133         .comment-reply-link,
3134         .comment-reply-login {
3135                 color: #333;
3136         }
3137 }