[Summary view] [Print] [Text view]

   1  /*
   2  Theme Name: Twenty Eleven
   3  Theme URI: https://wordpress.org/themes/twentyeleven/
   4  Author: the WordPress team
   5  Author URI: https://wordpress.org/
   6  Description: The 2011 theme for WordPress is sophisticated, lightweight, and adaptable. Make it yours with a custom menu, header image, and background -- then go further with available theme options for light or dark color scheme, custom link colors, and three layout choices. Twenty Eleven comes equipped with a Showcase page template that transforms your front page into a showcase to show off your best content, widget support galore (sidebar, three footer areas, and a Showcase page widget area), and a custom "Ephemera" widget to display your Aside, Link, Quote, or Status posts. Included are styles for print and for the admin editor, support for featured images (as custom header images on posts and pages and as large images on featured "sticky" posts), and special styles for six different post formats.
   7  Version: 4.8
   8  Requires at least: 3.2
   9  Tested up to: 6.7
  10  Requires PHP: 5.2.4
  11  License: GNU General Public License v2 or later
  12  License URI: http://www.gnu.org/licenses/gpl-2.0.html
  13  Tags: blog, one-column, two-columns, left-sidebar, right-sidebar, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-image-header, featured-images, flexible-header, footer-widgets, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready, block-patterns
  14  Text Domain: twentyeleven
  15  */
  16  
  17  /* =Reset default browser CSS. Based on work by Eric Meyer.
  18  -------------------------------------------------------------- */
  19  
  20  html, body, div, span, applet, object, iframe,
  21  h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  22  a, abbr, acronym, address, big, cite, code,
  23  del, dfn, em, font, ins, kbd, q, s, samp,
  24  small, strike, strong, sub, sup, tt, var,
  25  dl, dt, dd, ol, ul, li,
  26  fieldset, form, label, legend,
  27  table, caption, tbody, tfoot, thead, tr, th, td {
  28      border: 0;
  29      font-family: inherit;
  30      font-size: 100%;
  31      font-style: inherit;
  32      font-weight: inherit;
  33      margin: 0;
  34      outline: 0;
  35      padding: 0;
  36      vertical-align: baseline;
  37  }
  38  :focus {/* remember to define focus styles! */
  39      outline: 0;
  40  }
  41  body {
  42      background: #fff;
  43      line-height: 1;
  44  }
  45  ol, ul {
  46      list-style: none;
  47  }
  48  table {/* tables still need 'cellspacing="0"' in the markup */
  49      border-collapse: separate;
  50      border-spacing: 0;
  51  }
  52  caption, th, td {
  53      font-weight: normal;
  54      text-align: left;
  55  }
  56  blockquote:before, blockquote:after,
  57  q:before, q:after {
  58      content: "";
  59  }
  60  blockquote, q {
  61      quotes: "" "";
  62  }
  63  a img {
  64      border: 0;
  65  }
  66  article, aside, details, figcaption, figure,
  67  footer, header, hgroup, menu, nav, section {
  68      display: block;
  69  }
  70  
  71  
  72  /* =Structure
  73  ----------------------------------------------- */
  74  
  75  body {
  76      padding: 0 2em;
  77  }
  78  #page {
  79      margin: 2em auto;
  80      max-width: 1000px;
  81  }
  82  #branding hgroup {
  83      margin: 0 7.6%;
  84  }
  85  #access div {
  86      margin: 0 7.6%;
  87  }
  88  #primary {
  89      float: left;
  90      margin: 0 -26.4% 0 0;
  91      width: 100%;
  92  }
  93  #content {
  94      margin: 0 34% 0 7.6%;
  95      width: 58.4%;
  96  }
  97  #secondary {
  98      float: right;
  99      margin-right: 7.6%;
 100      width: 18.8%;
 101  }
 102  
 103  /* Singular */
 104  .singular #primary {
 105      margin: 0;
 106  }
 107  .singular #content,
 108  .left-sidebar.singular #content {
 109      margin: 0 7.6%;
 110      position: relative;
 111      width: auto;
 112  }
 113  .singular .entry-header,
 114  .singular .entry-content,
 115  .singular footer.entry-meta,
 116  .singular #comments-title {
 117      margin: 0 auto;
 118      width: 68.9%;
 119  }
 120  
 121  /* Attachments */
 122  .singular .image-attachment .entry-content {
 123      margin: 0 auto;
 124      width: auto;
 125  }
 126  .singular .image-attachment .entry-description {
 127      margin: 0 auto;
 128      width: 68.9%;
 129  }
 130  
 131  /* Showcase */
 132  .page-template-showcase-php #primary,
 133  .left-sidebar.page-template-showcase-php #primary {
 134      margin: 0;
 135  }
 136  .page-template-showcase-php #content,
 137  .left-sidebar.page-template-showcase-php #content {
 138      margin: 0 7.6%;
 139      width: auto;
 140  }
 141  .page-template-showcase-php section.recent-posts {
 142      float: right;
 143      margin: 0 0 0 31%;
 144      width: 69%;
 145  }
 146  .page-template-showcase-php #main .widget-area {
 147      float: left;
 148      margin: 0 -22.15% 0 0;
 149      width: 22.15%;
 150  }
 151  
 152  /* error404 */
 153  .error404 #primary {
 154      float: none;
 155      margin: 0;
 156  }
 157  .error404 #primary #content {
 158      margin: 0 7.6%;
 159      width: auto;
 160  }
 161  
 162  /* Alignment */
 163  .alignleft {
 164      display: inline;
 165      float: left;
 166      margin-right: 1.625em;
 167  }
 168  .alignright {
 169      display: inline;
 170      float: right;
 171      margin-left: 1.625em;
 172  }
 173  .aligncenter {
 174      clear: both;
 175      display: block;
 176      margin-left: auto;
 177      margin-right: auto;
 178  }
 179  
 180  /* Right Content */
 181  .left-sidebar #primary {
 182      float: right;
 183      margin: 0 0 0 -26.4%;
 184      width: 100%;
 185  }
 186  .left-sidebar #content {
 187      margin: 0 7.6% 0 34%;
 188      width: 58.4%;
 189  }
 190  .left-sidebar #secondary {
 191      float: left;
 192      margin-left: 7.6%;
 193      margin-right: 0;
 194      width: 18.8%;
 195  }
 196  
 197  /* One column */
 198  .one-column #page {
 199      max-width: 690px;
 200  }
 201  .one-column #content {
 202      margin: 0 7.6%;
 203      width: auto;
 204  }
 205  .one-column #nav-below {
 206      border-bottom: 1px solid #ddd;
 207      margin-bottom: 1.625em;
 208  }
 209  .one-column #secondary {
 210      float: none;
 211      margin: 0 7.6%;
 212      width: auto;
 213  }
 214  /* Simplify the showcase template */
 215  .one-column .page-template-showcase-php section.recent-posts {
 216      float: none;
 217      margin: 0;
 218      width: 100%;
 219  }
 220  .one-column .page-template-showcase-php #main .widget-area {
 221      float: none;
 222      margin: 0;
 223      width: auto;
 224  }
 225  .one-column .page-template-showcase-php .other-recent-posts {
 226      border-bottom: 1px solid #ddd;
 227  }
 228  /* Simplify the showcase template when small feature */
 229  .one-column section.featured-post .attachment-small-feature {
 230      border: none;
 231      display: block;
 232      height: auto;
 233      max-width: 60%;
 234      position: static;
 235  }
 236  .one-column article.feature-image.small {
 237      margin: 0 0 1.625em;
 238      padding: 0;
 239  }
 240  .one-column article.feature-image.small .entry-title {
 241      font-size: 20px;
 242      line-height: 1.3em;
 243  }
 244  .one-column article.feature-image.small .entry-summary {
 245      height: 150px;
 246      overflow: hidden;
 247      padding: 0;
 248      text-overflow: ellipsis;
 249  }
 250  .one-column article.feature-image.small .entry-summary a {
 251      left: -9%;
 252  }
 253  /* Remove the margin on singular articles */
 254  .one-column.singular .entry-header,
 255  .one-column.singular .entry-content,
 256  .one-column.singular footer.entry-meta,
 257  .one-column.singular #comments-title {
 258      width: 100%;
 259  }
 260  /* Simplify the pullquotes and pull styles */
 261  .one-column.singular blockquote.pull {
 262      margin: 0 0 1.625em;
 263  }
 264  .one-column.singular .pull.alignleft {
 265      margin: 0 1.625em 0 0;
 266  }
 267  .one-column.singular .pull.alignright {
 268      margin: 0 0 0 1.625em;
 269  }
 270  .one-column.singular .entry-meta .edit-link a {
 271      position: absolute;
 272      left: 0;
 273      top: 40px;
 274  }
 275  .one-column.singular #author-info {
 276      margin: 2.2em -8.8% 0;
 277      padding: 20px 8.8%;
 278  }
 279  /* Make sure we have room for our comment avatars */
 280  .one-column .commentlist > li.comment {
 281      margin-left: 102px;
 282      width: auto;
 283  }
 284  /* Make sure the logo and search form don't collide */
 285  .one-column #branding #searchform {
 286      right: 40px;
 287      top: 4em;
 288  }
 289  /* Talking avatars take up too much room at this size */
 290  .one-column .commentlist > li.comment {
 291      margin-left: 0;
 292  }
 293  .one-column .commentlist > li.comment .comment-meta,
 294  .one-column .commentlist > li.comment .comment-content {
 295      margin-right: 85px;
 296  }
 297  .one-column .commentlist .avatar {
 298      background: transparent;
 299      display: block;
 300      padding: 0;
 301      top: 1.625em;
 302      left: auto;
 303      right: 1.625em;
 304  }
 305  .one-column .commentlist .children .avatar {
 306      background: none;
 307      padding: 0;
 308      position: absolute;
 309      top: 2.2em;
 310      left: 2.2em;
 311  }
 312  .one-column #respond {
 313      width: auto;
 314  }
 315  
 316  
 317  /* =Global
 318  ----------------------------------------------- */
 319  
 320  body, input, textarea {
 321      color: #373737;
 322      font: 15px "Helvetica Neue", Helvetica, Arial, sans-serif;
 323      font-weight: 300;
 324      line-height: 1.625;
 325  }
 326  body {
 327      background: #e2e2e2;
 328  }
 329  #page {
 330      background: #fff;
 331  }
 332  
 333  /* Headings */
 334  h1,h2,h3,h4,h5,h6 {
 335      clear: both;
 336  }
 337  hr {
 338      background-color: #ccc;
 339      border: 0;
 340      height: 1px;
 341      margin-bottom: 1.625em;
 342  }
 343  
 344  /* Text elements */
 345  p {
 346      margin-bottom: 1.625em;
 347  }
 348  ul, ol {
 349      margin: 0 0 1.625em 2.5em;
 350  }
 351  ul {
 352      list-style: square;
 353  }
 354  ol {
 355      list-style-type: decimal;
 356  }
 357  ol ol {
 358      list-style: upper-alpha;
 359  }
 360  ol ol ol {
 361      list-style: lower-roman;
 362  }
 363  ol ol ol ol {
 364      list-style: lower-alpha;
 365  }
 366  ul ul, ol ol, ul ol, ol ul {
 367      margin-bottom: 0;
 368  }
 369  dl {
 370      margin: 0 1.625em;
 371  }
 372  dt {
 373      font-weight: bold;
 374  }
 375  dd {
 376      margin-bottom: 1.625em;
 377  }
 378  strong {
 379      font-weight: bold;
 380  }
 381  cite, em, i {
 382      font-style: italic;
 383  }
 384  blockquote {
 385      font-family: Georgia, "Bitstream Charter", serif;
 386      font-style: italic;
 387      font-weight: normal;
 388      margin: 0 3em;
 389  }
 390  blockquote em, blockquote i, blockquote cite {
 391      font-style: normal;
 392  }
 393  blockquote cite {
 394      color: #666;
 395      font: 12px "Helvetica Neue", Helvetica, Arial, sans-serif;
 396      font-weight: 300;
 397      letter-spacing: 0.05em;
 398      text-transform: uppercase;
 399  }
 400  pre {
 401      background: #f4f4f4;
 402      font: 13px "Courier 10 Pitch", Courier, monospace;
 403      line-height: 1.5;
 404      margin-bottom: 1.625em;
 405      overflow: auto;
 406      padding: 0.75em 1.625em;
 407  }
 408  code, kbd, samp, var {
 409      font: 13px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
 410  }
 411  pre code {
 412      font-size: inherit;
 413  }
 414  abbr, acronym, dfn {
 415      border-bottom: 1px dotted #666;
 416      cursor: help;
 417  }
 418  address {
 419      display: block;
 420      margin: 0 0 1.625em;
 421  }
 422  ins {
 423      background: #fff9c0;
 424      text-decoration: none;
 425  }
 426  sup,
 427  sub {
 428      font-size: 10px;
 429      height: 0;
 430      line-height: 1;
 431      position: relative;
 432      vertical-align: baseline;
 433  }
 434  sup {
 435      bottom: 1ex;
 436  }
 437  sub {
 438      top: .5ex;
 439  }
 440  small {
 441      font-size: smaller;
 442  }
 443  
 444  /* Forms */
 445  input[type=text],
 446  input[type=password],
 447  input[type=email],
 448  input[type=url],
 449  input[type=number],
 450  textarea {
 451      background: #fafafa;
 452      -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.1);
 453      -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.1);
 454      box-shadow: inset 0 1px 1px rgba(0,0,0,0.1);
 455      border: 1px solid #ddd;
 456      color: #888;
 457  }
 458  input[type=text]:focus,
 459  input[type=password]:focus,
 460  input[type=email]:focus,
 461  input[type=url]:focus,
 462  input[type=number]:focus,
 463  textarea:focus {
 464      color: #373737;
 465  }
 466  textarea {
 467      padding-left: 3px;
 468      width: 98%;
 469  }
 470  input[type=text],
 471  input[type=password],
 472  input[type=email],
 473  input[type=url],
 474  input[type=number] {
 475      padding: 3px;
 476  }
 477  input#s {
 478      background: url(images/search.png) no-repeat 5px 6px;
 479      -moz-border-radius: 2px;
 480      border-radius: 2px;
 481      font-size: 14px;
 482      height: 22px;
 483      line-height: 1.2em;
 484      padding: 4px 10px 4px 28px;
 485  }
 486  input#searchsubmit {
 487      display: none;
 488  }
 489  
 490  /* Links */
 491  a {
 492      color: #1982d1;
 493      text-decoration: none;
 494  }
 495  a:focus,
 496  a:active,
 497  a:hover {
 498      text-decoration: underline;
 499  }
 500  
 501  /* Assistive text */
 502  .assistive-text,
 503  .screen-reader-text {
 504      position: absolute !important;
 505      clip-path: inset(50%);
 506      overflow: hidden;
 507      height: 1px;
 508      width: 1px;
 509  }
 510  
 511  a.assistive-text:focus,
 512  .screen-reader-text:hover,
 513  .screen-reader-text:active,
 514  .screen-reader-text:focus {
 515      background-color: #f1f1f1;
 516      box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
 517      clip-path: none;
 518      color: #21759b;
 519      display: block;
 520      font-size: 14px;
 521      font-weight: bold;
 522      height: auto;
 523      left: 6px;
 524      line-height: normal;
 525      padding: 17px 22px 15px;
 526      text-decoration: none;
 527      top: 7px;
 528      width: auto;
 529      z-index: 100000;
 530      /* Above WP toolbar. */
 531  }
 532  
 533  /* =Header
 534  ----------------------------------------------- */
 535  
 536  #branding {
 537      border-top: 2px solid #bbb;
 538      padding-bottom: 10px;
 539      position: relative;
 540      z-index: 9999;
 541  }
 542  #site-title {
 543      margin-right: 270px;
 544      padding: 3.65625em 0 0;
 545  }
 546  #site-title a {
 547      color: #111;
 548      font-size: 30px;
 549      font-weight: bold;
 550      line-height: 36px;
 551      text-decoration: none;
 552  }
 553  #site-title a:hover,
 554  #site-title a:focus,
 555  #site-title a:active {
 556      color: #1982d1;
 557  }
 558  #site-description {
 559      color: #7a7a7a;
 560      font-size: 14px;
 561      margin: 0 270px 3.65625em 0;
 562  }
 563  #branding img {
 564      height: auto;
 565      display: block;
 566      width: 100%;
 567  }
 568  
 569  
 570  /* =Menu
 571  -------------------------------------------------------------- */
 572  
 573  #access {
 574      background: #222; /* Show a solid color for older browsers */
 575      background: -moz-linear-gradient(#252525, #0a0a0a);
 576      background: -o-linear-gradient(#252525, #0a0a0a);
 577      background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#252525), to(#0a0a0a)); /* older webkit syntax */
 578      background: -webkit-linear-gradient(#252525, #0a0a0a);
 579      -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
 580      -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
 581      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
 582      clear: both;
 583      display: block;
 584      float: left;
 585      margin: 0 auto 6px;
 586      width: 100%;
 587  }
 588  #access ul {
 589      font-size: 13px;
 590      list-style: none;
 591      margin: 0 0 0 -0.8125em;
 592      padding-left: 0;
 593  }
 594  #access li {
 595      float: left;
 596      position: relative;
 597  }
 598  #access a {
 599      color: #eee;
 600      display: block;
 601      line-height: 3.333em;
 602      padding: 0 1.2125em;
 603      text-decoration: none;
 604  }
 605  #access ul ul {
 606      -moz-box-shadow: 0 3px 3px rgba(0,0,0,0.2);
 607      -webkit-box-shadow: 0 3px 3px rgba(0,0,0,0.2);
 608      box-shadow: 0 3px 3px rgba(0,0,0,0.2);
 609      display: none;
 610      float: left;
 611      margin: 0;
 612      position: absolute;
 613      top: 3.333em;
 614      left: 0;
 615      width: 188px;
 616      z-index: 99999;
 617  }
 618  #access ul ul ul {
 619      left: 100%;
 620      top: 0;
 621  }
 622  #access ul ul a {
 623      background: #f9f9f9;
 624      border-bottom: 1px dotted #ddd;
 625      color: #444;
 626      font-size: 13px;
 627      font-weight: normal;
 628      height: auto;
 629      line-height: 1.4em;
 630      padding: 10px 10px;
 631      width: 168px;
 632  }
 633  #access li:hover > a,
 634  #access ul ul :hover > a,
 635  #access a:focus {
 636      background: #efefef;
 637  }
 638  #access li:hover > a,
 639  #access a:focus {
 640      background: #f9f9f9; /* Show a solid color for older browsers */
 641      background: -moz-linear-gradient(#f9f9f9, #e5e5e5);
 642      background: -o-linear-gradient(#f9f9f9, #e5e5e5);
 643      background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f9f9f9), to(#e5e5e5)); /* Older webkit syntax */
 644      background: -webkit-linear-gradient(#f9f9f9, #e5e5e5);
 645      color: #373737;
 646  }
 647  #access ul li:hover > ul {
 648      display: block;
 649  }
 650  #access .current-menu-item > a,
 651  #access .current-menu-ancestor > a,
 652  #access .current_page_item > a,
 653  #access .current_page_ancestor > a {
 654      font-weight: bold;
 655  }
 656  
 657  /* Search Form */
 658  #branding #searchform {
 659      position: absolute;
 660      top: 3.8em;
 661      right: 7.6%;
 662      text-align: right;
 663  }
 664  #branding #searchform div {
 665      margin: 0;
 666  }
 667  #branding #s {
 668      float: right;
 669      -webkit-transition-duration: 400ms;
 670      -webkit-transition-property: width, background;
 671      -webkit-transition-timing-function: ease;
 672      -moz-transition-duration: 400ms;
 673      -moz-transition-property: width, background;
 674      -moz-transition-timing-function: ease;
 675      -o-transition-duration: 400ms;
 676      -o-transition-property: width, background;
 677      -o-transition-timing-function: ease;
 678      width: 72px;
 679  }
 680  #branding #s:focus {
 681      background-color: #f9f9f9;
 682      width: 196px;
 683  }
 684  #branding #searchsubmit {
 685      display: none;
 686  }
 687  #branding .only-search #searchform {
 688      top: 5px;
 689      z-index: 1;
 690  }
 691  #branding .only-search #s {
 692      background-color: #666;
 693      border-color: #000;
 694      color: #222;
 695  }
 696  #branding .only-search #s,
 697  #branding .only-search #s:focus {
 698      width: 85%;
 699  }
 700  #branding .only-search #s:focus {
 701      background-color: #bbb;
 702  }
 703  #branding .with-image #searchform {
 704      top: auto;
 705      bottom: -27px;
 706      max-width: 195px;
 707      height: 32px;
 708  }
 709  #branding .only-search + #access div {
 710      padding-right: 205px;
 711  }
 712  
 713  
 714  /* =Content
 715  ----------------------------------------------- */
 716  
 717  #main {
 718      clear: both;
 719      padding: 1.625em 0 0;
 720  }
 721  .page-title {
 722      color: #666;
 723      font-size: 10px;
 724      font-weight: 500;
 725      letter-spacing: 0.1em;
 726      line-height: 2.6em;
 727      margin: 0 0 2.6em;
 728      text-transform: uppercase;
 729  }
 730  .page-title a {
 731      font-size: 12px;
 732      font-weight: bold;
 733      letter-spacing: 0;
 734      text-transform: none;
 735  }
 736  .hentry,
 737  .no-results {
 738      border-bottom: 1px solid #ddd;
 739      margin: 0 0 1.625em;
 740      padding: 0 0 1.625em;
 741      position: relative;
 742  }
 743  .hentry:last-child,
 744  .no-results {
 745      border-bottom: none;
 746  }
 747  .blog .sticky .entry-header .entry-meta {
 748      clip-path: inset(50%);
 749      position: absolute !important;
 750  }
 751  .entry-title,
 752  .entry-header .entry-meta {
 753      padding-right: 76px;
 754  }
 755  .entry-title {
 756      clear: both;
 757      color: #222;
 758      font-size: 26px;
 759      font-weight: bold;
 760      line-height: 1.5em;
 761      padding-bottom: .3em;
 762      padding-top: 15px;
 763  }
 764  .entry-title,
 765  .entry-title a {
 766      color: #222;
 767      text-decoration: none;
 768  }
 769  .entry-title a:hover,
 770  .entry-title a:focus,
 771  .entry-title a:active {
 772      color: #1982d1;
 773  }
 774  .entry-meta {
 775      color: #666;
 776      clear: both;
 777      font-size: 12px;
 778      line-height: 18px;
 779  }
 780  .entry-meta a {
 781      font-weight: bold;
 782  }
 783  .single-author .entry-meta .by-author {
 784      display: none;
 785  }
 786  .entry-content,
 787  .entry-summary {
 788      padding: 1.625em 0 0;
 789  }
 790  .entry-content .more-link {
 791      white-space: nowrap;
 792  }
 793  .entry-content h1,
 794  .entry-content h2,
 795  .comment-content h1,
 796  .comment-content h2 {
 797      color: #000;
 798      font-weight: bold;
 799      margin: 0 0 .8125em;
 800  }
 801  .entry-content h3,
 802  .comment-content h3 {
 803      font-size: 10px;
 804      letter-spacing: 0.1em;
 805      line-height: 2.6em;
 806      text-transform: uppercase;
 807  }
 808  .entry-content table,
 809  .comment-content table {
 810      border-bottom: 1px solid #ddd;
 811      margin: 0 0 1.625em;
 812      width: 100%;
 813  }
 814  .entry-content th,
 815  .comment-content th {
 816      color: #666;
 817      font-size: 10px;
 818      font-weight: 500;
 819      letter-spacing: 0.1em;
 820      line-height: 2.6em;
 821      text-transform: uppercase;
 822  }
 823  .entry-content td,
 824  .comment-content td {
 825      border-top: 1px solid #ddd;
 826      padding: 6px 10px 6px 0;
 827  }
 828  .entry-content #s {
 829      width: 75%;
 830  }
 831  .comment-content ul,
 832  .comment-content ol {
 833      margin-bottom: 1.625em;
 834  }
 835  .comment-content ul ul,
 836  .comment-content ol ol,
 837  .comment-content ul ol,
 838  .comment-content ol ul {
 839      margin-bottom: 0;
 840  }
 841  dl.gallery-item {
 842      margin: 0;
 843  }
 844  .page-link {
 845      clear: both;
 846      display: block;
 847      margin: 0 0 1.625em;
 848  }
 849  .page-link a {
 850      background: #eee;
 851      color: #373737;
 852      margin: 0;
 853      padding: 2px 3px;
 854      text-decoration: none;
 855  }
 856  .page-link a:hover {
 857      background: #888;
 858      color: #fff;
 859      font-weight: bold;
 860  }
 861  .page-link span {
 862      margin-right: 6px;
 863  }
 864  .entry-meta .edit-link a,
 865  .commentlist .edit-link a {
 866      background: #eee;
 867      -moz-border-radius: 3px;
 868      border-radius: 3px;
 869      color: #666;
 870      float: right;
 871      font-size: 12px;
 872      line-height: 1.5em;
 873      font-weight: 300;
 874      text-decoration: none;
 875      padding: 0 8px;
 876  }
 877  .entry-meta .edit-link a:hover,
 878  .commentlist .edit-link a:hover {
 879      background: #888;
 880      color: #fff;
 881  }
 882  .entry-content .edit-link {
 883      clear: both;
 884      display: block;
 885  }
 886  
 887  /* Images */
 888  .entry-content img,
 889  .comment-content img,
 890  .widget img {
 891      max-width: 100%; /* Fluid images for posts, comments, and widgets */
 892  }
 893  img[class*="align"],
 894  img[class*="wp-image-"],
 895  img[class*="attachment-"] {
 896      height: auto; /* Make sure images with WordPress-added height and width attributes are scaled correctly */
 897  }
 898  img.size-full,
 899  img.size-large {
 900      max-width: 97.5%;
 901      width: auto; /* Prevent stretching of full-size and large-size images with height and width attributes in IE8 */
 902      height: auto; /* Make sure images with WordPress-added height and width attributes are scaled correctly */
 903  }
 904  .entry-content img.wp-smiley {
 905      border: none;
 906      margin-bottom: 0;
 907      margin-top: 0;
 908      padding: 0;
 909  }
 910  img.alignleft,
 911  img.alignright,
 912  img.aligncenter {
 913      margin-bottom: 1.625em;
 914  }
 915  p img,
 916  .wp-caption {
 917      margin-top: 0.4em;
 918  }
 919  .wp-caption {
 920      background: #eee;
 921      margin-bottom: 1.625em;
 922      max-width: 96%;
 923      max-width: calc( 100% - 18px );
 924      padding: 9px;
 925  }
 926  .wp-caption img {
 927      display: block;
 928      max-width: 98%;
 929      max-width: calc( 100% - 14px );
 930  }
 931  .wp-caption .wp-caption-text,
 932  .gallery-caption {
 933      color: #666;
 934      font-family: Georgia, serif;
 935      font-size: 12px;
 936  }
 937  .wp-caption .wp-caption-text {
 938      margin-bottom: 0.6em;
 939      padding: 10px 0 5px 40px;
 940      position: relative;
 941  }
 942  .wp-caption .wp-caption-text:before {
 943      color: #666;
 944      content: '\2014';
 945      font-size: 14px;
 946      font-style: normal;
 947      font-weight: bold;
 948      margin-right: 5px;
 949      position: absolute;
 950      left: 10px;
 951      top: 7px;
 952  }
 953  #content .gallery {
 954      margin: 0 auto 1.625em;
 955  }
 956  #content .gallery a img {
 957      border: none;
 958  }
 959  img#wpstats {
 960      display: block;
 961      margin: 0 auto 1.625em;
 962  }
 963  #content .gallery-columns-4 .gallery-item {
 964      width: 23%;
 965      padding-right: 2%;
 966  }
 967  #content .gallery-columns-4 .gallery-item img {
 968      width: 100%;
 969      height: auto;
 970  }
 971  
 972  /* Image borders */
 973  img[class*="align"],
 974  img[class*="wp-image-"],
 975  #content .gallery .gallery-icon img {/* Add fancy borders to all WordPress-added images but not things like badges and icons and the like */
 976      border: 1px solid #ddd;
 977      padding: 6px;
 978      max-width: 97.5%;
 979      max-width: calc( 100% - 14px );
 980  }
 981  .wp-caption img {
 982      border-color: #eee;
 983  }
 984  a:focus img[class*="align"],
 985  a:hover img[class*="align"],
 986  a:active img[class*="align"],
 987  a:focus img[class*="wp-image-"],
 988  a:hover img[class*="wp-image-"],
 989  a:active img[class*="wp-image-"],
 990  #content .gallery .gallery-icon a:focus img,
 991  #content .gallery .gallery-icon a:hover img,
 992  #content .gallery .gallery-icon a:active img {/* Add some useful style to those fancy borders for linked images ... */
 993      background: #eee;
 994      border-color: #bbb;
 995  }
 996  .wp-caption a:focus img,
 997  .wp-caption a:active img,
 998  .wp-caption a:hover img {/* ... including captioned images! */
 999      background: #fff;
1000      border-color: #ddd;
1001  }
1002  
1003  /* Make sure videos and embeds fit their containers */
1004  embed,
1005  iframe,
1006  object {
1007      max-width: 100%;
1008  }
1009  .entry-content .twitter-tweet-rendered {
1010      max-width: 100% !important; /* Override the Twitter embed fixed width */
1011  }
1012  
1013  /* Password Protected Posts */
1014  .post-password-required .entry-header .comments-link {
1015      margin: 1.625em 0 0;
1016  }
1017  .post-password-required input[type=password] {
1018      margin: 0.8125em 0;
1019  }
1020  .post-password-required input[type=password]:focus {
1021      background: #f7f7f7;
1022  }
1023  
1024  /* Author Info */
1025  #author-info {
1026      font-size: 12px;
1027      overflow: hidden;
1028  }
1029  .singular #author-info {
1030      background: #f9f9f9;
1031      border-top: 1px solid #ddd;
1032      border-bottom: 1px solid #ddd;
1033      margin: 2.2em -35.6% 0 -35.4%;
1034      padding: 20px 35.4%;
1035  }
1036  .archive #author-info {
1037      border-bottom: 1px solid #ddd;
1038      margin: 0 0 2.2em;
1039      padding: 0 0 2.2em;
1040  }
1041  #author-avatar {
1042      float: left;
1043      margin-right: -78px;
1044  }
1045  #author-avatar img {
1046      background: #fff;
1047      -moz-border-radius: 3px;
1048      border-radius: 3px;
1049      -webkit-box-shadow: 0 1px 2px #bbb;
1050      -moz-box-shadow: 0 1px 2px #bbb;
1051      box-shadow: 0 1px 2px #bbb;
1052      padding: 3px;
1053  }
1054  #author-description {
1055      float: left;
1056      margin-left: 108px;
1057  }
1058  #author-description h2 {
1059      color: #000;
1060      font-size: 15px;
1061      font-weight: bold;
1062      margin: 5px 0 10px;
1063  }
1064  
1065  /* Comments link */
1066  .entry-header .comments-link a {
1067      background: #eee url(images/comment-bubble.png) no-repeat;
1068      color: #666;
1069      font-size: 13px;
1070      font-weight: normal;
1071      line-height: 35px;
1072      overflow: hidden;
1073      padding: 0 0 0;
1074      position: absolute;
1075      top: 1.5em;
1076      right: 0;
1077      text-align: center;
1078      text-decoration: none;
1079      width: 43px;
1080      height: 36px;
1081  }
1082  .entry-header .comments-link a:hover,
1083  .entry-header .comments-link a:focus,
1084  .entry-header .comments-link a:active {
1085      background-color: #1982d1;
1086      color: #fff;
1087      color: rgba(255,255,255,0.8);
1088  }
1089  .entry-header .comments-link .leave-reply {
1090      visibility: hidden;
1091  }
1092  
1093  /*
1094  Post Formats Headings
1095  To hide the headings, display: none the ".entry-header .entry-format" selector,
1096  and remove the padding rules below.
1097  */
1098  .entry-header .entry-format {
1099      color: #666;
1100      font-size: 10px;
1101      font-weight: 500;
1102      letter-spacing: 0.1em;
1103      line-height: 2.6em;
1104      position: absolute;
1105      text-transform: uppercase;
1106      top: -5px;
1107  }
1108  .entry-header hgroup .entry-title {
1109      padding-top: 15px;
1110  }
1111  article.format-aside .entry-content,
1112  article.format-link .entry-content,
1113  article.format-status .entry-content {
1114      padding: 20px 0 0;
1115  }
1116  article.format-status .entry-content {
1117      min-height: 65px;
1118  }
1119  .recent-posts .entry-header .entry-format {
1120      display: none;
1121  }
1122  .recent-posts .entry-header hgroup .entry-title {
1123      padding-top: 0;
1124  }
1125  
1126  /* Singular content styles for Posts and Pages */
1127  .singular .hentry {
1128      border-bottom: none;
1129      padding: 1.875em 0 0;
1130      position: relative;
1131  }
1132  .singular.page .hentry {
1133      padding: 3.5em 0 0;
1134  }
1135  .singular .entry-title {
1136      color: #000;
1137      font-size: 36px;
1138      font-weight: bold;
1139      line-height: 48px;
1140  }
1141  .singular .entry-title,
1142  .singular .entry-header .entry-meta {
1143      padding-right: 0;
1144  }
1145  blockquote.pull {
1146      font-size: 21px;
1147      font-weight: bold;
1148      line-height: 1.6125em;
1149      margin: 0 0 1.625em;
1150      text-align: center;
1151  }
1152  .singular blockquote.pull {
1153      margin: 0 -22.25% 1.625em;
1154  }
1155  .pull.alignleft {
1156      margin: 0 1.625em 0 0;
1157      text-align: right;
1158  }
1159  .singular .pull.alignleft {
1160      margin: 0 1.625em 0 -22.25%;
1161  }
1162  .pull.alignright {
1163      margin: 0 0 0 1.625em;
1164      text-align: left;
1165  }
1166  blockquote.pull.alignleft,
1167  blockquote.pull.alignright {
1168      width: 33%;
1169  }
1170  .singular .pull.alignright {
1171      margin: 0 -22.25% 0 1.625em;
1172  }
1173  .singular blockquote.pull.alignleft,
1174  .singular blockquote.pull.alignright {
1175      width: 33%;
1176  }
1177  .singular .entry-meta .edit-link a {
1178      bottom: auto;
1179      left: 50px;
1180      position: absolute;
1181      right: auto;
1182      top: 40px;
1183  }
1184  
1185  
1186  /* =Aside
1187  ----------------------------------------------- */
1188  
1189  .format-aside .entry-title,
1190  .format-aside .entry-header .comments-link {
1191      display: none;
1192  }
1193  .singular .format-aside .entry-title {
1194      display: block;
1195  }
1196  .format-aside .entry-content {
1197      padding: 0;
1198  }
1199  .singular .format-aside .entry-content {
1200      padding: 1.625em 0 0;
1201  }
1202  
1203  
1204  /* =Link
1205  ----------------------------------------------- */
1206  
1207  .format-link .entry-title,
1208  .format-link .entry-header .comments-link {
1209      display: none;
1210  }
1211  .singular .format-link .entry-title {
1212      display: block;
1213  }
1214  .format-link .entry-content {
1215      padding: 0;
1216  }
1217  .singular .format-link .entry-content {
1218      padding: 1.625em 0 0;
1219  }
1220  
1221  
1222  /* =Gallery
1223  ----------------------------------------------- */
1224  
1225  .format-gallery .gallery-thumb {
1226      float: left;
1227      display: block;
1228      margin: .375em 1.625em 0 0;
1229      max-width: 100%;
1230  }
1231  
1232  
1233  /* =Status
1234  ----------------------------------------------- */
1235  
1236  .format-status .entry-title,
1237  .format-status .entry-header .comments-link {
1238      display: none;
1239  }
1240  .singular .format-status .entry-title {
1241      display: block;
1242  }
1243  .format-status .entry-content {
1244      padding: 0;
1245  }
1246  .singular .format-status .entry-content {
1247      padding: 1.625em 0 0;
1248  }
1249  .format-status img.avatar {
1250      -moz-border-radius: 3px;
1251      border-radius: 3px;
1252      -webkit-box-shadow: 0 1px 2px #ccc;
1253      -moz-box-shadow: 0 1px 2px #ccc;
1254      box-shadow: 0 1px 2px #ccc;
1255      float: left;
1256      margin: 4px 10px 2px 0;
1257      padding: 0;
1258  }
1259  
1260  /* =Standard
1261  ----------------------------------------------- */
1262  
1263  .format-standard .wp-video,
1264  .format-standard .wp-audio-shortcode,
1265  .format-audio .wp-audio-shortcode,
1266  .format-standard .video-player {
1267      margin-bottom: 24px;
1268  }
1269  
1270  /* =Quote
1271  ----------------------------------------------- */
1272  
1273  .format-quote blockquote {
1274      color: #555;
1275      font-size: 17px;
1276      margin: 0;
1277  }
1278  
1279  
1280  /* =Image
1281  ----------------------------------------------- */
1282  
1283  .indexed.format-image .entry-header {
1284      min-height: 61px; /* Prevent the comment icon from colliding with the image when there is no title */
1285  }
1286  .indexed.format-image .entry-content {
1287      padding-top: 0.5em;
1288  }
1289  .indexed.format-image .entry-content p {
1290      margin: 1em 0;
1291  }
1292  .indexed.format-image .entry-content p:first-child,
1293  .indexed.format-image .entry-content p:first-child a,
1294  .indexed.format-image .entry-content p:first-child img {
1295      display: block;
1296      margin: 0;
1297  }
1298  .indexed.format-image .entry-content .wp-caption .wp-caption-text {
1299      margin: 0;
1300      padding-bottom: 1em;
1301  }
1302  .indexed.format-image footer.entry-meta {
1303      background: #ddd;
1304      overflow: hidden;
1305      padding: 4%;
1306      max-width: 96%;
1307  }
1308  .indexed.format-image div.entry-meta {
1309      display: inline-block;
1310      float: left;
1311      width: 35%;
1312  }
1313  .indexed.format-image div.entry-meta + div.entry-meta {
1314      float: none;
1315      width: 65%;
1316  }
1317  .indexed.format-image .entry-meta span.cat-links,
1318  .indexed.format-image .entry-meta span.tag-links,
1319  .indexed.format-image .entry-meta span.comments-link {
1320      display: block;
1321  }
1322  .indexed.format-image footer.entry-meta a {
1323      color: #444;
1324  }
1325  .indexed.format-image footer.entry-meta a:hover {
1326      color: #fff;
1327  }
1328  #content .indexed.format-image img {
1329      border: none;
1330      max-width: 100%;
1331      padding: 0;
1332  }
1333  .indexed.format-image .wp-caption {
1334      background: #111;
1335      margin-bottom: 0;
1336      max-width: 96%;
1337      padding: 2% 2% 0;
1338  }
1339  .indexed.format-image .wp-caption .wp-caption-text {
1340      color: #ddd;
1341  }
1342  .indexed.format-image .wp-caption .wp-caption-text:before {
1343      color: #444;
1344  }
1345  .indexed.format-image a:hover img {
1346      opacity: 0.8;
1347  }
1348  
1349  
1350  /* =error404
1351  ----------------------------------------------- */
1352  
1353  .error404 #main #searchform {
1354      background: #f9f9f9;
1355      border: 1px solid #ddd;
1356      border-width: 1px 0;
1357      margin: 0 -8.9% 1.625em;
1358      overflow: hidden;
1359      padding: 1.625em 8.9%;
1360  }
1361  .error404 #main #s {
1362      width: 95%;
1363  }
1364  .error404 #main .widget {
1365      clear: none;
1366      float: left;
1367      margin-right: 3.7%;
1368      width: 30.85%;
1369  }
1370  .error404 #main .widget_archive {
1371      margin-right: 0;
1372  }
1373  .error404 #main .widget_tag_cloud {
1374      float: none;
1375      margin-right: 0;
1376      width: 100%;
1377  }
1378  .error404 .widgettitle {
1379      font-size: 10px;
1380      letter-spacing: 0.1em;
1381      line-height: 2.6em;
1382      text-transform: uppercase;
1383  }
1384  
1385  
1386  /* =Showcase
1387  ----------------------------------------------- */
1388  
1389  h1.showcase-heading {
1390      color: #666;
1391      font-size: 10px;
1392      font-weight: 500;
1393      letter-spacing: 0.1em;
1394      line-height: 2.6em;
1395      text-transform: uppercase;
1396  }
1397  
1398  /* Intro */
1399  article.intro {
1400      background: #f9f9f9;
1401      border-bottom: none;
1402      margin: -1.855em -8.9% 1.625em;
1403      padding: 0 8.9%;
1404  }
1405  article.intro .entry-title {
1406      display: none;
1407  }
1408  article.intro .entry-content {
1409      color: #111;
1410      font-size: 16px;
1411      padding: 1.625em 0 0.625em;
1412  }
1413  article.intro .edit-link a {
1414      background: #aaa;
1415      -moz-border-radius: 3px;
1416      border-radius: 3px;
1417      color: #fff;
1418      font-size: 12px;
1419      padding: 0 8px;
1420      position: absolute;
1421      top: 30px;
1422      right: 20px;
1423      text-decoration: none;
1424  }
1425  article.intro .edit-link a:hover,
1426  article.intro .edit-link a:focus,
1427  article.intro .edit-link a:active {
1428      background: #777;
1429  }
1430  
1431  /* Featured post */
1432  section.featured-post {
1433      float: left;
1434      margin: -1.625em -8.9% 1.625em;
1435      padding: 1.625em 8.9% 0;
1436      position: relative;
1437      width: 100%;
1438  }
1439  section.featured-post .hentry {
1440      border: none;
1441      color: #666;
1442      margin: 0;
1443  }
1444  section.featured-post .entry-meta {
1445      clip-path: inset(50%);
1446      position: absolute !important;
1447  }
1448  
1449  /* Small featured post */
1450  section.featured-post .attachment-small-feature {
1451      float: right;
1452      height: auto;
1453      margin: 0 -8.9% 1.625em 0;
1454      max-width: 59%;
1455      position: relative;
1456      right: -15px;
1457  }
1458  section.featured-post.small {
1459      padding-top: 0;
1460  }
1461  section.featured-post .attachment-small-feature:hover,
1462  section.featured-post .attachment-small-feature:focus,
1463  section.featured-post .attachment-small-feature:active {
1464      opacity: .8;
1465  }
1466  article.feature-image.small {
1467      float: left;
1468      margin: 0 0 1.625em;
1469      width: 45%;
1470  }
1471  article.feature-image.small .entry-title {
1472      line-height: 1.2em;
1473  }
1474  article.feature-image.small .entry-summary {
1475      color: #555;
1476      font-size: 13px;
1477  }
1478  article.feature-image.small .entry-summary p a {
1479      background: #222;
1480      color: #eee;
1481      display: block;
1482      left: -23.8%;
1483      padding: 9px 26px 9px 85px;
1484      position: relative;
1485      text-decoration: none;
1486      top: 20px;
1487      width: 180px;
1488      z-index: 1;
1489  }
1490  article.feature-image.small .entry-summary p a:hover {
1491      background: #1982d1;
1492      color: #eee;
1493      color: rgba(255,255,255,0.8);
1494  }
1495  
1496  /* Large featured post */
1497  section.feature-image.large {
1498      border: none;
1499      max-height: 288px;
1500      padding: 0;
1501      width: 100%;
1502  }
1503  section.feature-image.large .showcase-heading {
1504      display: none;
1505  }
1506  section.feature-image.large .hentry {
1507      border-bottom: none;
1508      left: 9%;
1509      margin: 1.625em 9% 0 0;
1510      position: absolute;
1511      top: 0;
1512  }
1513  article.feature-image.large .entry-title a {
1514      background: #222;
1515      background: rgba(0,0,0,0.8);
1516      -moz-border-radius: 3px;
1517      border-radius: 3px;
1518      color: #fff;
1519      display: inline-block;
1520      font-weight: 300;
1521      padding: .2em 20px;
1522  }
1523  section.feature-image.large:hover .entry-title a,
1524  section.feature-image.large .entry-title:hover a {
1525      background: #eee;
1526      background: rgba(255,255,255,0.8);
1527      color: #222;
1528  }
1529  article.feature-image.large .entry-summary {
1530      display: none;
1531  }
1532  section.feature-image.large img {
1533      display: block;
1534      height: auto;
1535      max-width: 117.9%;
1536      padding: 0 0 6px;
1537  }
1538  
1539  /* Featured Slider */
1540  .featured-posts {
1541      border-bottom: 1px solid #ddd;
1542      display: block;
1543      height: 328px;
1544      margin: 1.625em -8.9% 20px;
1545      max-width: 1000px;
1546      padding: 0;
1547      position: relative;
1548      overflow: hidden;
1549  }
1550  .featured-posts .showcase-heading {
1551      padding-left: 8.9%;
1552  }
1553  .featured-posts section.featured-post {
1554      background: #fff;
1555      height: 288px;
1556      left: 0;
1557      margin: 0;
1558      position: absolute;
1559      top: 30px;
1560      width: auto;
1561  }
1562  .featured-posts section.featured-post.large {
1563      max-width: 100%;
1564      overflow: hidden;
1565  }
1566  .featured-posts section.featured-post {
1567      -webkit-transition-duration: 200ms;
1568      -webkit-transition-property: opacity, visibility;
1569      -webkit-transition-timing-function: ease;
1570      -moz-transition-duration: 200ms;
1571      -moz-transition-property: opacity, visibility;
1572      -moz-transition-timing-function: ease;
1573  }
1574  .featured-posts section.featured-post {
1575      opacity: 0;
1576      visibility: hidden;
1577  }
1578  .featured-posts #featured-post-1 {
1579      opacity: 1;
1580      visibility: visible;
1581  }
1582  .featured-post .feature-text:after,
1583  .featured-post .feature-image.small:after {
1584      content: ' ';
1585      background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); /* FF3.6+ */
1586      background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
1587      background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */
1588      background: -o-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Opera11.10+ */
1589      background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* IE10+ */
1590      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
1591      background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C */
1592      width: 100%;
1593      height: 45px;
1594      position: absolute;
1595      top: 230px;
1596  }
1597  .featured-post .feature-image.small:after {
1598      top: 253px;
1599  }
1600  #content .feature-slider {
1601      top: 5px;
1602      right: 8.9%;
1603      overflow: visible;
1604      position: absolute;
1605  }
1606  .feature-slider ul {
1607      list-style-type: none;
1608      margin: 0;
1609  }
1610  .feature-slider li {
1611      float: left;
1612      margin: 0 6px;
1613  }
1614  .feature-slider a {
1615      background: #3c3c3c;
1616      background: rgba(60,60,60,0.9);
1617      -moz-border-radius: 12px;
1618      border-radius: 12px;
1619      -webkit-box-shadow: inset 1px 1px 5px rgba(0,0,0,0.5), inset 0 0 2px rgba(255,255,255,0.5);
1620      -moz-box-shadow: inset 1px 1px 5px rgba(0,0,0,0.5), inset 0 0 2px rgba(255,255,255,0.5);
1621      box-shadow: inset 1px 1px 5px rgba(0,0,0,0.5), inset 0 0 2px rgba(255,255,255,0.5);
1622      display: block;
1623      width: 14px;
1624      height: 14px;
1625  }
1626  .feature-slider a .feature-slider-tooltip {
1627      display: block;
1628      width: 14px;
1629      height: 14px;
1630  }
1631  .feature-slider a.active {
1632      background: #1982d1;
1633      -webkit-box-shadow: inset 1px 1px 5px rgba(0,0,0,0.4), inset 0 0 2px rgba(255,255,255,0.8);
1634      -moz-box-shadow: inset 1px 1px 5px rgba(0,0,0,0.4), inset 0 0 2px rgba(255,255,255,0.8);
1635      box-shadow: inset 1px 1px 5px rgba(0,0,0,0.4), inset 0 0 2px rgba(255,255,255,0.8);
1636      cursor: default;
1637      opacity: 0.5;
1638  }
1639  
1640  /* Recent Posts */
1641  section.recent-posts {
1642      padding: 0 0 1.625em;
1643  }
1644  section.recent-posts .hentry {
1645      border: none;
1646      margin: 0;
1647  }
1648  section.recent-posts .other-recent-posts {
1649      border-bottom: 1px solid #ddd;
1650      list-style: none;
1651      margin: 0;
1652  }
1653  section.recent-posts .other-recent-posts li {
1654      padding: 0.3125em 0;
1655      position: relative;
1656  }
1657  section.recent-posts .other-recent-posts .entry-title {
1658      border-top: 1px solid #ddd;
1659      font-size: 17px;
1660  }
1661  section.recent-posts .other-recent-posts a[rel="bookmark"] {
1662      color: #373737;
1663      float: left;
1664      max-width: 84%;
1665  }
1666  section.recent-posts .other-recent-posts a[rel="bookmark"]:after {
1667      content: '-';
1668      color: transparent;
1669      font-size: 11px;
1670  }
1671  section.recent-posts .other-recent-posts .comments-link a,
1672  section.recent-posts .other-recent-posts .comments-link > span {
1673      border-bottom: 2px solid #999;
1674      bottom: -2px;
1675      color: #444;
1676      display: block;
1677      font-size: 10px;
1678      font-weight: 500;
1679      line-height: 2.76333em;
1680      padding: 0.3125em 0 0.3125em 1em;
1681      position: absolute;
1682      right: 0;
1683      text-align: right;
1684      text-transform: uppercase;
1685      z-index: 1;
1686  }
1687  section.recent-posts .other-recent-posts .comments-link > span {
1688      border-color: #bbb;
1689      color: #888;
1690  }
1691  section.recent-posts .other-recent-posts .comments-link a:hover {
1692      color: #1982d1;
1693      border-color: #1982d1;
1694  }
1695  section.recent-posts .other-recent-posts li:after {
1696      clear: both;
1697      content: '.';
1698      display: block;
1699      height: 0;
1700      visibility: hidden;
1701  }
1702  
1703  
1704  /* =Attachments
1705  ----------------------------------------------- */
1706  
1707  .image-attachment div.attachment {
1708      background: #f9f9f9;
1709      border: 1px solid #ddd;
1710      border-width: 1px 0;
1711      margin: 0 -8.9% 1.625em;
1712      overflow: hidden;
1713      padding: 1.625em 1.625em 0;
1714      text-align: center;
1715  }
1716  .image-attachment div.attachment img {
1717      display: block;
1718      height: auto;
1719      margin: 0 auto 1.625em;
1720      max-width: 100%;
1721  }
1722  .image-attachment div.attachment a img {
1723      border-color: #f9f9f9;
1724  }
1725  .image-attachment div.attachment a:focus img,
1726  .image-attachment div.attachment a:hover img,
1727  .image-attachment div.attachment a:active img {
1728      border-color: #ddd;
1729      background: #fff;
1730  }
1731  .image-attachment .entry-caption p {
1732      font-size: 10px;
1733      letter-spacing: 0.1em;
1734      line-height: 2.6em;
1735      margin: 0 0 2.6em;
1736      text-transform: uppercase;
1737  }
1738  
1739  /* =Media
1740  -------------------------------------------------------------- */
1741  
1742  audio,
1743  video {
1744      display: inline-block;
1745      max-width: 100%;
1746  }
1747  
1748  .attachment .entry-content .mejs-container {
1749      margin-bottom: 24px;
1750  }
1751  
1752  /* =Navigation
1753  -------------------------------------------------------------- */
1754  
1755  #content nav {
1756      clear: both;
1757      overflow: hidden;
1758      padding: 0 0 1.625em;
1759  }
1760  #content nav a {
1761      font-size: 12px;
1762      font-weight: bold;
1763      line-height: 2.2em;
1764  }
1765  #nav-above {
1766      padding: 0 0 1.625em;
1767  }
1768  #nav-above {
1769      display: none;
1770  }
1771  .paged #nav-above {
1772      display: block;
1773  }
1774  .nav-previous {
1775      float: left;
1776      width: 50%;
1777  }
1778  .nav-next {
1779      float: right;
1780      text-align: right;
1781      width: 50%;
1782  }
1783  #content nav .meta-nav {
1784      font-weight: normal;
1785  }
1786  
1787  /* Singular navigation */
1788  #nav-single {
1789      position: relative;
1790      z-index: 1;
1791  }
1792  #nav-single .nav-previous,
1793  #nav-single .nav-next {
1794      width: auto;
1795  }
1796  #nav-single .nav-next {
1797      padding-left: .5em;
1798  }
1799  #nav-single .nav-previous {
1800      padding-right: .5em;
1801  }
1802  
1803  
1804  /* =Widgets
1805  ----------------------------------------------- */
1806  
1807  .widget-area {
1808      font-size: 12px;
1809  }
1810  .widget {
1811      word-wrap: break-word;
1812      -webkit-hyphens: auto;
1813      -moz-hyphens: auto;
1814      hyphens: auto;
1815      clear: both;
1816      margin: 0 0 2.2em;
1817  }
1818  .widget-title {
1819      color: #666;
1820      font-size: 10px;
1821      font-weight: 500;
1822      letter-spacing: 0.1em;
1823      line-height: 2.6em;
1824      text-transform: uppercase;
1825  }
1826  .widget ul {
1827      font-size: 15px;
1828      margin: 0;
1829  }
1830  .widget ul ul {
1831      margin-left: 1.5em;
1832  }
1833  .widget ul li {
1834      color: #777;
1835      font-size: 13px;
1836  }
1837  .widget a {
1838      font-weight: bold;
1839      text-decoration: none;
1840  }
1841  .widget a:hover,
1842  .widget a:focus,
1843  .widget a:active {
1844      text-decoration: underline;
1845  }
1846  .widget select {
1847      max-width: 100%;
1848   }
1849  
1850  /* Search Widget */
1851  .widget_search form {
1852      margin: 0 0 1.625em;
1853  }
1854  .widget_search #s {
1855      width: 77%;
1856  }
1857  .widget_search #searchsubmit {
1858      background: #ddd;
1859      border: 1px solid #ccc;
1860      -webkit-box-shadow: inset 0 -1px 1px rgba(0, 0, 0, 0.09);
1861      -moz-box-shadow: inset 0 -1px 1px rgba(0, 0, 0, 0.09);
1862      box-shadow: inset 0 -1px 1px rgba(0, 0, 0, 0.09);
1863      color: #888;
1864      font-size: 13px;
1865      line-height: 25px;
1866      position: relative;
1867      top: -2px;
1868  }
1869  .widget_search #searchsubmit:active {
1870      background: #1982d1;
1871      border-color: #0861a5;
1872      -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
1873      -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
1874      box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
1875      color: #bfddf3;
1876  }
1877  
1878  /* Ephemera Widget */
1879  section.ephemera ol,
1880  .widget_twentyeleven_ephemera ol {
1881      list-style: square;
1882      margin: 5px 0 0;
1883  }
1884  .widget_twentyeleven_ephemera .widget-entry-title {
1885      font-size: 15px;
1886      font-weight: bold;
1887      padding: 0;
1888  }
1889  .widget_twentyeleven_ephemera .comments-link a,
1890  .widget_twentyeleven_ephemera .comments-link > span {
1891      color: #666;
1892      display: block;
1893      font-size: 10px;
1894      font-weight: 500;
1895      line-height: 2.76333em;
1896      text-transform: uppercase;
1897  }
1898  section.ephemera .entry-title a span {
1899      color: #29628d;
1900  }
1901  
1902  /* Twitter */
1903  .widget_twitter li {
1904      list-style-type: none;
1905      margin-bottom: 14px;
1906  }
1907  .widget_twitter .timesince {
1908      display: block;
1909      font-size: 11px;
1910      margin-right: -10px;
1911      text-align: right;
1912  }
1913  
1914  /* Widget Image */
1915  .widget_image img,
1916  .widget_media_image img {
1917      border: 0;
1918      padding: 0;
1919      height: auto;
1920      max-width: 100%;
1921  }
1922  @media (min-width: 1024px) {
1923      .widget_media_image .size-thumbnail {
1924          padding: 6px;
1925      }
1926  }
1927  
1928  /* Calendar Widget */
1929  .widget_calendar #wp-calendar {
1930      color: #555;
1931      width: 95%;
1932      text-align: center;
1933  }
1934  .widget_calendar #wp-calendar caption,
1935  .widget_calendar #wp-calendar td,
1936  .widget_calendar #wp-calendar th {
1937      text-align: center;
1938  }
1939  .widget_calendar #wp-calendar caption {
1940      font-size: 11px;
1941      font-weight: 500;
1942      padding: 5px 0 3px 0;
1943      text-transform: uppercase;
1944  }
1945  .widget_calendar #wp-calendar th {
1946      background: #f4f4f4;
1947      border-top: 1px solid #ccc;
1948      border-bottom: 1px solid #ccc;
1949      font-weight: bold;
1950  }
1951  .widget_calendar #wp-calendar tfoot td {
1952      background: #f4f4f4;
1953      border-top: 1px solid #ccc;
1954      border-bottom: 1px solid #ccc;
1955  }
1956  .widget_calendar .wp-calendar-nav {
1957      display: table;
1958      width: 95%;
1959  }
1960  .widget_calendar .wp-calendar-nav span {
1961      display: table-cell;
1962      text-align: center;
1963  }
1964  .widget_calendar .wp-calendar-nav-prev,
1965  .widget_calendar .wp-calendar-nav-next {
1966      width: 40%;
1967  }
1968  
1969  /* Text Widget */
1970  .widget_text ul,
1971  .widget_text ol {
1972      margin: 0 0 1.625em 2.5em;
1973  }
1974  .widget_text ul ul,
1975  .widget_text ol ol,
1976  .widget_text ul ol,
1977  .widget_text ol ul {
1978      margin-bottom: 0;
1979  }
1980  
1981  /* Tag Cloud Widget */
1982  .tagcloud ul {
1983      list-style-type: none;
1984  }
1985  
1986  .tagcloud ul li {
1987      display: inline-block;
1988  }
1989  
1990  /* Helps galleries in widget areas look presentable in most cases. */
1991  #page .widget-area .gallery-columns-2 img,
1992  #page .widget-area .gallery-columns-3 img,
1993  #page .widget-area .gallery-columns-4 img,
1994  #page .widget-area .gallery-columns-5 img,
1995  #page .widget-area .gallery-columns-6 img,
1996  #page .widget-area .gallery-columns-7 img,
1997  #page .widget-area .gallery-columns-8 img,
1998  #page .widget-area .gallery-columns-9 img {
1999      border: none;
2000      max-width: 90%;
2001      width: auto;
2002  }
2003  
2004  /* =Comments
2005  ----------------------------------------------- */
2006  
2007  #comments-title {
2008      color: #666;
2009      font-size: 10px;
2010      font-weight: 500;
2011      line-height: 2.6em;
2012      padding: 0 0 2.6em;
2013      text-transform: uppercase;
2014  }
2015  .nopassword,
2016  .nocomments {
2017      color: #aaa;
2018      font-size: 24px;
2019      font-weight: 100;
2020      margin: 26px 0;
2021      text-align: center;
2022  }
2023  .commentlist {
2024      list-style: none;
2025      margin: 0 auto;
2026      width: 68.9%;
2027  }
2028  .content .commentlist,
2029  .page-template-sidebar-page-php .commentlist {
2030      width: 100%; /* reset the width for the one-column and sidebar page layout */
2031  }
2032  .commentlist > li.comment {
2033      background: #f6f6f6;
2034      border: 1px solid #ddd;
2035      -moz-border-radius: 3px;
2036      border-radius: 3px;
2037      margin: 0 0 1.625em;
2038      padding: 1.625em;
2039      position: relative;
2040  }
2041  .commentlist .pingback {
2042      margin: 0 0 1.625em;
2043      padding: 0 1.625em;
2044  }
2045  .commentlist .children {
2046      list-style: none;
2047      margin: 0;
2048  }
2049  .commentlist .children li.comment {
2050      background: #fff;
2051      border-left: 1px solid #ddd;
2052      -moz-border-radius: 0 3px 3px 0;
2053      border-radius: 0 3px 3px 0;
2054      margin: 1.625em 0 0;
2055      padding: 1.625em;
2056      position: relative;
2057  }
2058  .commentlist .children li.comment .fn {
2059      display: block;
2060  }
2061  .comment-meta .fn {
2062      font-style: normal;
2063  }
2064  .comment-meta {
2065      color: #666;
2066      font-size: 12px;
2067      line-height: 2.2em;
2068  }
2069  .commentlist .children li.comment .comment-meta {
2070      line-height: 1.625em;
2071      margin-left: 50px;
2072  }
2073  .commentlist .children li.comment .comment-content {
2074      margin: 1.625em 0 0;
2075      word-wrap: break-word;
2076      -webkit-hyphens: auto;
2077      -moz-hyphens: auto;
2078      hyphens: auto;
2079  }
2080  .comment-meta a {
2081      font-weight: bold;
2082  }
2083  .commentlist .avatar {
2084      -moz-border-radius: 3px;
2085      border-radius: 3px;
2086      -webkit-box-shadow: 0 1px 2px #ccc;
2087      -moz-box-shadow: 0 1px 2px #ccc;
2088      box-shadow: 0 1px 2px #ccc;
2089      left: -102px;
2090      padding: 0;
2091      position: absolute;
2092      top: 0;
2093  }
2094  .commentlist > li:before {
2095      content: url(images/comment-arrow.png);
2096      left: -21px;
2097      position: absolute;
2098  }
2099  .commentlist > li.pingback:before {
2100      content: '';
2101  }
2102  .commentlist .children .avatar {
2103      background: none;
2104      -webkit-box-shadow: none;
2105      -moz-box-shadow: none;
2106      box-shadow: none;
2107      left: 2.2em;
2108      padding: 0;
2109      top: 2.2em;
2110  }
2111  a.comment-reply-link {
2112      background: #eee;
2113      -moz-border-radius: 3px;
2114      border-radius: 3px;
2115      color: #666;
2116      display: inline-block;
2117      font-size: 12px;
2118      padding: 0 8px;
2119      text-decoration: none;
2120  }
2121  a.comment-reply-link:hover,
2122  a.comment-reply-link:focus,
2123  a.comment-reply-link:active {
2124      background: #888;
2125      color: #fff;
2126  }
2127  a.comment-reply-link > span {
2128      display: inline-block;
2129      position: relative;
2130      top: -1px;
2131  }
2132  
2133  /* Post author highlighting */
2134  .commentlist > li.bypostauthor {
2135      background: #ddd;
2136      border-color: #d3d3d3;
2137  }
2138  .commentlist > li.bypostauthor .comment-meta {
2139      color: #575757;
2140  }
2141  .commentlist > li.bypostauthor:before {
2142      content: url(images/comment-arrow-bypostauthor.png);
2143  }
2144  
2145  /* Post Author threaded comments */
2146  .commentlist .children > li.bypostauthor {
2147      background: #ddd;
2148      border-color: #d3d3d3;
2149  }
2150  
2151  /* sidebar-page.php comments */
2152  /* Make sure we have room for our comment avatars */
2153  .page-template-sidebar-page-php .commentlist > li.comment,
2154  .page-template-sidebar-page-php.commentlist .pingback {
2155      margin-left: 102px;
2156      width: auto;
2157  }
2158  /* And a full-width comment form */
2159  .page-template-sidebar-page-php #respond {
2160      width: auto;
2161  }
2162  
2163  /* Comment Form */
2164  #respond {
2165      background: #ddd;
2166      border: 1px solid #d3d3d3;
2167      -moz-border-radius: 3px;
2168      border-radius: 3px;
2169      margin: 0 auto 1.625em;
2170      padding: 1.625em;
2171      position: relative;
2172      width: 68.9%;
2173  }
2174  #respond input[type="text"],
2175  #respond textarea {
2176      background: #fff;
2177      border: 4px solid #eee;
2178      -moz-border-radius: 5px;
2179      border-radius: 5px;
2180      -webkit-box-shadow: inset 0 1px 3px rgba(204,204,204,0.95);
2181      -moz-box-shadow: inset 0 1px 3px rgba(204,204,204,0.95);
2182      box-shadow: inset 0 1px 3px rgba(204,204,204,0.95);
2183      position: relative;
2184      padding: 10px;
2185      text-indent: 80px;
2186  }
2187  #respond .comment-form-author,
2188  #respond .comment-form-email,
2189  #respond .comment-form-url,
2190  #respond .comment-form-comment {
2191      position: relative;
2192  }
2193  #respond .comment-form-author label,
2194  #respond .comment-form-email label,
2195  #respond .comment-form-url label,
2196  #respond .comment-form-comment label {
2197      background: #eee;
2198      -webkit-box-shadow: 1px 2px 2px rgba(204,204,204,0.8);
2199      -moz-box-shadow: 1px 2px 2px rgba(204,204,204,0.8);
2200      box-shadow: 1px 2px 2px rgba(204,204,204,0.8);
2201      color: #555;
2202      display: inline-block;
2203      font-size: 13px;
2204      left: 4px;
2205      min-width: 60px;
2206      padding: 4px 10px;
2207      position: relative;
2208      top: 40px;
2209      z-index: 1;
2210  }
2211  #respond input[type="text"]:focus,
2212  #respond textarea:focus {
2213      text-indent: 0;
2214      z-index: 1;
2215  }
2216  #respond textarea {
2217      resize: vertical;
2218      width: 95%;
2219  }
2220  #respond .comment-form label .required,
2221  #respond .comment-form .comment-notes .required,
2222  #respond .comment-form .logged-in-as .required {
2223      color: #bd3500;
2224      font-size: 22px;
2225      font-weight: bold;
2226  }
2227  #respond .comment-form-author .required,
2228  #respond .comment-form-email .required,
2229  #respond .comment-form-url .required,
2230  #respond .comment-form-comment .required {
2231      float: right;
2232      margin-left: 4px;
2233  }
2234  #respond .comment-form .comment-notes .required,
2235  #respond .comment-form .logged-in-as .required {
2236      vertical-align: middle;
2237  }
2238  #respond .comment-notes,
2239  #respond .logged-in-as {
2240      font-size: 13px;
2241  }
2242  #respond p {
2243      margin: 10px 0;
2244  }
2245  #respond .form-submit {
2246      float: right;
2247      margin: -20px 0 10px;
2248  }
2249  #respond input#submit {
2250      background: #222;
2251      border: none;
2252      -moz-border-radius: 3px;
2253      border-radius: 3px;
2254      -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.3);
2255      -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.3);
2256      box-shadow: 0 1px 2px rgba(0,0,0,0.3);
2257      color: #eee;
2258      cursor: pointer;
2259      font-size: 15px;
2260      margin: 20px 0;
2261      padding: 5px 42px 5px 22px;
2262      position: relative;
2263      left: 30px;
2264      text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
2265  }
2266  #respond input#submit:active {
2267      background: #1982d1;
2268      color: #bfddf3;
2269  }
2270  #respond #cancel-comment-reply-link {
2271      color: #666;
2272      margin-left: 10px;
2273      text-decoration: none;
2274  }
2275  #respond .logged-in-as a:hover,
2276  #respond #cancel-comment-reply-link:hover {
2277      text-decoration: underline;
2278  }
2279  .commentlist #respond {
2280      margin: 1.625em 0 0;
2281      width: auto;
2282  }
2283  #reply-title {
2284      color: #373737;
2285      font-size: 24px;
2286      font-weight: bold;
2287      line-height: 30px;
2288  }
2289  #cancel-comment-reply-link {
2290      color: #888;
2291      display: block;
2292      font-size: 10px;
2293      font-weight: normal;
2294      line-height: 2.2em;
2295      letter-spacing: 0.05em;
2296      position: absolute;
2297      right: 1.625em;
2298      text-decoration: none;
2299      text-transform: uppercase;
2300      top: 1.1em;
2301  }
2302  #cancel-comment-reply-link:focus,
2303  #cancel-comment-reply-link:active,
2304  #cancel-comment-reply-link:hover {
2305      color: #ff4b33;
2306  }
2307  #respond label {
2308      line-height: 2.2em;
2309  }
2310  #respond input[type=text] {
2311      display: block;
2312      height: 24px;
2313      width: 75%;
2314  }
2315  #respond p {
2316      font-size: 12px;
2317  }
2318  #respond #wp-comment-cookies-consent {
2319      margin: 0 10px 0 0;
2320  }
2321  p.comment-form-comment {
2322      margin: 0;
2323  }
2324  .form-allowed-tags {
2325      display: none;
2326  }
2327  
2328  
2329  /* =Footer
2330  ----------------------------------------------- */
2331  
2332  #colophon {
2333      clear: both;
2334  }
2335  #supplementary {
2336      border-top: 1px solid #ddd;
2337      padding: 1.625em 7.6%;
2338      overflow: hidden;
2339  }
2340  
2341  /* Two Footer Widget Areas */
2342  #supplementary.two .widget-area {
2343      float: left;
2344      margin-right: 3.7%;
2345      width: 48.1%;
2346  }
2347  #supplementary.two .widget-area + .widget-area {
2348      margin-right: 0;
2349  }
2350  
2351  /* Three Footer Widget Areas */
2352  #supplementary.three .widget-area {
2353      float: left;
2354      margin-right: 3.7%;
2355      width: 30.85%;
2356  }
2357  #supplementary.three .widget-area + .widget-area + .widget-area {
2358      margin-right: 0;
2359  }
2360  
2361  /* Site Generator Line */
2362  #site-generator {
2363      background: #f9f9f9;
2364      border-top: 1px solid #ddd;
2365      color: #666;
2366      font-size: 12px;
2367      line-height: 2.2em;
2368      padding: 2.2em 0.5em;
2369      text-align: center;
2370  }
2371  #site-generator a {
2372      color: #555;
2373      font-weight: bold;
2374  }
2375  #site-generator span[role=separator] {
2376      padding: 0 0.25em 0 0.5em
2377  }
2378  #site-generator span[role=separator]::before {
2379      content: '\007c';
2380  }
2381  
2382  
2383  /* =Responsive Structure
2384  ----------------------------------------------- */
2385  
2386  /* Does the same thing as <meta name="viewport" content="width=device-width">,
2387   * but in the future W3C standard way. -ms- prefix is required for IE10+ to
2388   * render responsive styling in Windows 8 "snapped" views; IE10+ does not honor
2389   * the meta tag. See https://core.trac.wordpress.org/ticket/25888.
2390   */
2391  @-ms-viewport {
2392      width: device-width;
2393  }
2394  @viewport {
2395      width: device-width;
2396  }
2397  
2398  @media (max-width: 800px) {
2399      /* Simplify the basic layout */
2400      #main #content {
2401          margin: 0 7.6%;
2402          width: auto;
2403      }
2404      #nav-below {
2405          border-bottom: 1px solid #ddd;
2406          margin-bottom: 1.625em;
2407      }
2408      #main #secondary {
2409          float: none;
2410          margin: 0 7.6%;
2411          width: auto;
2412      }
2413      /* Simplify the showcase template */
2414      .page-template-showcase-php .featured-posts {
2415          min-height: 280px;
2416      }
2417      .featured-posts section.featured-post {
2418          height: auto;
2419      }
2420      .page-template-showcase-php section.recent-posts {
2421          float: none;
2422          margin: 0;
2423          width: 100%;
2424      }
2425      .page-template-showcase-php #main .widget-area {
2426          float: none;
2427          margin: 0;
2428          width: auto;
2429      }
2430      .page-template-showcase-php .other-recent-posts {
2431          border-bottom: 1px solid #ddd;
2432      }
2433      /* Simplify the showcase template when small feature */
2434      section.featured-post .attachment-small-feature,
2435      .one-column section.featured-post .attachment-small-feature {
2436          border: none;
2437          display: block;
2438          float: left;
2439          height: auto;
2440          margin: 0.625em auto 1.025em;
2441          max-width: 30%;
2442          position: static;
2443      }
2444      article.feature-image.small {
2445          float: right;
2446          margin: 0 0 1.625em;
2447          width: 64%;
2448      }
2449      .one-column article.feature-image.small .entry-summary {
2450          height: auto;
2451      }
2452      article.feature-image.small .entry-summary p a {
2453          left: 0;
2454          padding-left: 20px;
2455          padding-right: 20px;
2456          width: auto;
2457      }
2458      /* Remove the margin on singular articles */
2459      .singular .entry-header,
2460      .singular .entry-content,
2461      .singular footer.entry-meta,
2462      .singular #comments-title {
2463          width: 100%;
2464      }
2465      /* Simplify the pullquotes and pull styles */
2466      .singular blockquote.pull {
2467          margin: 0 0 1.625em;
2468      }
2469      .singular .pull.alignleft {
2470          margin: 0 1.625em 0 0;
2471      }
2472      .singular .pull.alignright {
2473          margin: 0 0 0 1.625em;
2474      }
2475      .singular .entry-meta .edit-link a {
2476          left: 0;
2477          position: absolute;
2478          top: 20px;
2479      }
2480      .singular #author-info {
2481          margin: 2.2em -8.8% 0;
2482          padding: 20px 8.8%;
2483      }
2484      /* Make sure we have room for our comment avatars */
2485      .commentlist {
2486          width: 100%;
2487      }
2488      .commentlist > li.comment,
2489      .commentlist .pingback {
2490          margin-left: 102px;
2491          width: auto;
2492      }
2493      /* And a full-width comment form */
2494      #respond {
2495          width: auto;
2496      }
2497      /* No need to float footer widgets at this size */
2498      #colophon #supplementary .widget-area {
2499          float: none;
2500          margin-right: 0;
2501          width: auto;
2502      }
2503      /* No need to float 404 widgets at this size */
2504      .error404 #main .widget {
2505          float: none;
2506          margin-right: 0;
2507          width: auto;
2508      }
2509  }
2510  @media (max-width: 650px) {
2511      /* @media (max-width: 650px) Reduce font-sizes for better readability on smaller devices */
2512      body, input, textarea {
2513          font-size: 13px;
2514      }
2515      #site-title a {
2516          font-size: 24px;
2517      }
2518      #site-description {
2519          font-size: 12px;
2520      }
2521      #access ul {
2522          font-size: 12px;
2523      }
2524      #branding .only-search + #access div {
2525          padding-right: 0;
2526      }
2527      article.intro .entry-content {
2528          font-size: 12px;
2529      }
2530      .entry-title {
2531          font-size: 21px;
2532      }
2533      .featured-post .entry-title {
2534          font-size: 14px;
2535      }
2536      .singular .entry-title {
2537          font-size: 28px;
2538      }
2539      .entry-meta {
2540          font-size: 12px;
2541      }
2542      blockquote {
2543          margin: 0;
2544      }
2545      blockquote.pull {
2546          font-size: 17px;
2547      }
2548      /* Reposition the site title and description slightly */
2549      #site-title {
2550          padding: 5.30625em 0 0;
2551      }
2552      #site-title,
2553      #site-description {
2554          margin-right: 0;
2555      }
2556      /* Make sure the logo and search form don't collide */
2557      #branding #searchform {
2558          top: 1.625em !important;
2559      }
2560      /* Floated content doesn't work well at this size */
2561      .alignleft,
2562      .alignright {
2563          display: block;
2564          float: none;
2565          margin-left: 0;
2566          margin-right: 0;
2567      }
2568      .singular.page .hentry {
2569          padding: 1.625em 0 0;
2570      }
2571      .singular .entry-header .entry-meta,
2572      .singular .entry-header .entry-format,
2573      .singular .entry-meta .edit-link a {
2574          position: static;
2575      }
2576      /* Talking avatars take up too much room at this size */
2577      .commentlist > li.comment,
2578      .commentlist > li.pingback {
2579          margin-left: 0 !important;
2580      }
2581      .commentlist .avatar {
2582          background: transparent;
2583          display: block;
2584          padding: 0;
2585          position: static;
2586      }
2587      .commentlist .children .avatar {
2588          background: none;
2589          left: 2.2em;
2590          padding: 0;
2591          position: absolute;
2592          top: 2.2em;
2593      }
2594      /* Use the available space in the smaller comment form */
2595      #respond input[type="text"] {
2596          width: 95%;
2597      }
2598      #content .gallery-columns-3 .gallery-item {
2599          width: 31%;
2600          padding-right: 2%;
2601      }
2602      #content .gallery-columns-3 .gallery-item img {
2603          width: 100%;
2604          height: auto;
2605      }
2606  }
2607  @media (max-width: 450px) {
2608      #content .gallery-columns-2 .gallery-item {
2609          width: 45%;
2610          padding-right: 4%;
2611      }
2612      #content .gallery-columns-2 .gallery-item img {
2613          width: 100%;
2614          height: auto;
2615      }
2616  }
2617  @media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
2618      body {
2619          padding: 0;
2620      }
2621      #page {
2622          margin-top: 0;
2623      }
2624      #branding {
2625          border-top: none;
2626      }
2627  }
2628  
2629  
2630  /* =Print
2631  ----------------------------------------------- */
2632  
2633  @media print {
2634      body {
2635          background: none !important;
2636          font-size: 10pt;
2637      }
2638      footer.entry-meta a[rel=bookmark]:link:after,
2639      footer.entry-meta a[rel=bookmark]:visited:after {
2640          content: " [" attr(href) "] "; /* Show URLs */
2641      }
2642      #page {
2643          clear: both !important;
2644          display: block !important;
2645          float: none !important;
2646          max-width: 100%;
2647          position: relative !important;
2648      }
2649      #branding {
2650          border-top: none !important;
2651          padding: 0;
2652      }
2653      #branding hgroup {
2654          margin: 0;
2655      }
2656      #site-title a {
2657          font-size: 21pt;
2658      }
2659      #site-description {
2660          font-size: 10pt;
2661      }
2662      #branding #searchform {
2663          display: none;
2664      }
2665      #branding img {
2666          display: none;
2667      }
2668      #access {
2669          display: none;
2670      }
2671      #main {
2672          border-top: none;
2673          box-shadow: none;
2674      }
2675      #primary {
2676          float: left;
2677          margin: 0;
2678          width: 100%;
2679      }
2680      #content {
2681          margin: 0;
2682          width: auto;
2683      }
2684      .singular #content {
2685          margin: 0;
2686          width: 100%;
2687      }
2688      .singular .entry-header .entry-meta {
2689          position: static;
2690      }
2691      .entry-meta .edit-link a {
2692          display: none;
2693      }
2694      #content nav {
2695          display: none;
2696      }
2697      .singular .entry-header,
2698      .singular .entry-content,
2699      .singular footer.entry-meta,
2700      .singular #comments-title {
2701          margin: 0;
2702          width: 100%;
2703      }
2704      .singular .hentry {
2705          padding: 0;
2706      }
2707      .entry-title,
2708      .singular .entry-title {
2709          font-size: 21pt;
2710      }
2711      .entry-meta {
2712          font-size: 10pt;
2713      }
2714      .entry-header .comments-link {
2715          display: none;
2716      }
2717      .page-link {
2718          display: none;
2719      }
2720      .singular #author-info {
2721          background: none;
2722          border-bottom: none;
2723          border-top: none;
2724          margin: 2.2em 0 0;
2725          padding: 0;
2726      }
2727      #respond {
2728          display: none;
2729      }
2730      .widget-area {
2731          display: none;
2732      }
2733      #colophon {
2734          display: none;
2735      }
2736  
2737      /* Comments */
2738      .commentlist > li.comment {
2739          background: none;
2740          border: 1px solid #ddd;
2741          -moz-border-radius: 3px 3px 3px 3px;
2742          border-radius: 3px 3px 3px 3px;
2743          margin: 0 auto 1.625em;
2744          padding: 1.625em;
2745          position: relative;
2746          width: auto;
2747      }
2748      .commentlist .avatar {
2749          height: 39px;
2750          left: 2.2em;
2751          top: 2.2em;
2752          width: 39px;
2753      }
2754      .commentlist li.comment .comment-meta {
2755          line-height: 1.625em;
2756          margin-left: 50px;
2757      }
2758      .commentlist li.comment .fn {
2759          display: block;
2760      }
2761      .commentlist li.comment .comment-content {
2762          margin: 1.625em 0 0;
2763      }
2764      .commentlist .comment-edit-link {
2765          display: none;
2766      }
2767      .commentlist > li::before,
2768      .commentlist > li.bypostauthor::before {
2769          content: '';
2770      }
2771      .commentlist .reply {
2772          display: none;
2773      }
2774  
2775      /* Post author highlighting */
2776      .commentlist > li.bypostauthor {
2777          color: #444;
2778      }
2779      .commentlist > li.bypostauthor .comment-meta {
2780          color: #666;
2781      }
2782      .commentlist > li.bypostauthor:before {
2783          content: none;
2784      }
2785  
2786      /* Post Author threaded comments */
2787      .commentlist .children > li.bypostauthor {
2788          background: #fff;
2789          border-color: #ddd;
2790      }
2791      .commentlist .children > li.bypostauthor > article,
2792      .commentlist .children > li.bypostauthor > article .comment-meta {
2793          color: #666;
2794      }
2795  }
2796  
2797  
2798  /* =IE7
2799  ----------------------------------------------- */
2800  
2801  #ie7 article.intro {
2802      margin-left: -7.6%;
2803      margin-right: -7.6%;
2804      max-width: 1000px;
2805  }
2806  #ie7 .featured-posts {
2807      margin: 0 -7.6%;
2808  }
2809  #ie7 .featured-post {
2810      margin-left: 0;
2811      margin-right: 0;
2812      max-width: 100%;
2813  }
2814  #ie7 section.recent-posts {
2815      margin-right: 7.6%;
2816  }
2817  
2818  
2819  /* =IE8
2820  ----------------------------------------------- */
2821  
2822  #ie8 section.feature-image.large img {
2823      width: auto;
2824  }
2825  #ie8 section.featured-post .attachment-small-feature {
2826      max-width: none;
2827  }