/*
Theme Name: Editor
Theme URI: https://arraythemes.com/themes/editor-wordpress-theme/
Author: Array
Author URI: https://arraythemes.com
Description: Editor puts bold and beautiful publishing right at your fingertips with comfortable, legible typography and large featured images. Using Featured Posts, you can display your favorite articles or editorials in the sidebar for even more exposure. Please open the readme.txt file to learn how to use Editor.
Version: 1.1.8
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: editor
Domain Path: /languages/
Tags: two-columns, left-sidebar, custom-colors, editor-style, featured-images, theme-options, threaded-comments, translation-ready, blog, news

Editor WordPress Theme, Copyright 2014 Array
*/
/* --------------------------------------------------------------
TABLE OF CONTENTS
----------------------------------------------------------------
1.0 - Reset
2.0 - Typography
3.0 - Elements
4.0 - Forms
5.0 - Navigation
5.1 - Links
5.2 - Menus
5.3 - Post Navigation
5.4 - Page Navigation
5.5 - Toggle Menus
6.0 - Accessibility
7.0 - Alignments
8.0 - Clearings
9.0 - Widgets
10.0 - Content
10.1 - Posts and pages
10.2 - Comments
11.0 - Infinite scroll
12.0 - Media
13.0 - Header
14.0 - Footer
15.0 - Content
16.0 - Posts
17.0 - Archives
18.0 - Attachments
19.0 - Animations
-------------------------------------------------------------- */
/* --------------------------------------------------------------
1.0 - Reset
-------------------------------------------------------------- */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
  border: 0;
  font-family: "Noto Serif TC", inherit;
  font-size: 1.02em;
  font-style: inherit;
  font-weight: inherit;
  margin: 0;
  outline: 0;
  padding: 0;
  vertical-align: baseline;
}

html {
  font-size: 62.5%;
  overflow-y: scroll;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

body {
  background: #fff;
  position: relative;
}

@media screen and (max-width: 782px) {
  body.admin-bar {
    padding-top: 46px;
  }
}
*, *:before, *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

article, aside, details, figcaption, figure, footer, header, main, nav, section {
  display: block;
}

table {
  /* tables still need 'cellspacing="0"' in the markup */
  border-collapse: separate;
  border-spacing: 0;
}

caption, th, td {
  font-weight: normal;
  text-align: left;
}

blockquote:before, blockquote:after, q:before, q:after {
  content: "";
}

blockquote, q {
  quotes: "" "";
}

a:focus {
  outline: thin dotted;
}

a:hover, a:active {
  outline: 0;
}

a img {
  border: 0;
}

/* --------------------------------------------------------------
2.0 Typography
-------------------------------------------------------------- */
/* Import Editor Sass Variables (inc/sass/variables.scss) */
/* Body font styles */
/* Title font styles */
/* Color variables */
/* Responsive media query mixins */
/* Styles for small text with uppercase font style. Used on dates and post meta */
/* Transition effect used througout Editor */
body, button, input, select, textarea {
  color: #404040;
  font-family: "Noto Serif TC", "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 20px;
  line-height: 1.5;
}

h1, h2, h3, h4, h5, h6 {
  clear: both;
  font-family: "Noto Serif TC", "Roboto Condensed", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  line-height: 1.2;
  margin-bottom: 3%;
}

h1 {
  font-size: 50px;
}

h2 {
  font-size: 40px;
}

h3 {
  font-size: 30px;
}

h4 {
  font-size: 20px;
}

h5 {
  font-size: 16px;
}

h6 {
  font-size: 14px;
}

p {
  margin-bottom: 1em;
}

b, strong {
  font-weight: bold;
}

dfn, cite, em, i {
  font-style: italic;
}

blockquote {
  font-family: "Noto Serif TC", "Roboto Condensed", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 32px;
  font-style: italic;
  font-weight: 300;
  margin: 1em 0 0 0;
  padding-right: 10%;
  position: relative;
}
@media (max-width: 768px) {
  blockquote {
    padding-right: 14%;
  }
}
blockquote:before {
  border: solid 2px #D4DAE0;
  border-radius: 100px;
  color: #D4DAE0;
  content: "\f10d";
  font-family: "FontAwesome";
  font-size: 18px;
  font-style: normal;
  line-height: 44px;
  text-align: center;
  position: absolute;
  right: 0;
  top: 2%;
  height: 46px;
  width: 46px;
}

address {
  margin: 0 0 1.5em;
}

pre {
  background: #F5F5F5;
  font-family: "Noto Serif TC", "Courier 10 Pitch", Courier, monospace;
  font-size: 15px;
  font-size: 1.5rem;
  line-height: 1.6;
  margin-bottom: 1.6em;
  max-width: 100%;
  overflow: auto;
  padding: 1.6em;
}

code, kbd, tt, var {
  font: 15px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}

abbr, acronym {
  border-bottom: 1px dotted #666;
  cursor: help;
}

mark, ins {
  background: #fff9c0;
  text-decoration: none;
}

sup, sub {
  font-size: 75%;
  height: 0;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  bottom: 1ex;
}

sub {
  top: .5ex;
}

small {
  font-size: 75%;
}

big {
  font-size: 125%;
}

.highlight {
  background: #fff198;
}

.sticky {
  display: block;
}

/* --------------------------------------------------------------
3.0 Elements
-------------------------------------------------------------- */
hr {
  background-color: #f6f6f6;
  border: 0;
  height: 2px;
  margin: 5% 0;
}

ul, ol {
  margin: 0 0 5% 25px;
}

ul {
  list-style: square;
}

ol {
  list-style: decimal;
}

ul ul, ol ol, ul ol, ol ul {
  margin: .6em 0 0 1.5em;
}

.entry-content li {
  margin-bottom: 2%;
}

dt {
  font-weight: bold;
}

dd {
  margin: 0 1.5em 1.5em;
}

img {
  height: auto;
  /* Make sure images are scaled correctly. */
  max-width: 100%;
  /* Adhere to container width. */
}

figure {
  margin: 0;
}

/* Tables */
table {
  font-size: 18px;
  margin-bottom: 5%;
  padding: 0;
  width: 100%;
}

table thead {
  background: #f7f7f7;
}
table thead th {
  font-weight: bold;
}

table td, #content table th {
  padding: 10px;
}

table td {
  border-bottom: solid 1px #f7f7f7;
}

table tr:last-child td {
  border-bottom: none;
}

table tr:nth-child(even) {
  background: #f7f7f7;
}

/* --------------------------------------------------------------
4.0 Forms
-------------------------------------------------------------- */
button, input, textarea {
  font-size: 100%;
  /* Corrects font size not being inherited in all browsers */
  margin: 0;
  /* Addresses margins set differently in IE6/7, F3/4, S5, Chrome */
  vertical-align: baseline;
  /* Improves appearance and consistency in all browsers */
  *vertical-align: middle;
  /* Improves appearance and consistency in IE6/IE7 */
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

button, input[type="button"], input[type="reset"], input[type="submit"], .button, #page #infinite-handle span {
  background: #404040;
  border: none;
  border-radius: 2px;
  color: #fff;
  font-family: "Noto Serif TC", "Roboto Condensed", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 16px;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 12px 15px;
}

button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover, .button:hover, #page #infinite-handle span:hover {
  background: #555;
  color: #fff;
  cursor: pointer;
}

button:focus, input[type="button"]:focus, input[type="reset"]:focus, input[type="submit"]:focus, button:active, input[type="button"]:active, input[type="reset"]:active, input[type="submit"]:active, .button:active, #page #infinite-handle span:active {
  border-color: #aaa #bbb #bbb #bbb;
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.5), inset 0 2px 5px rgba(0, 0, 0, 0.15);
}

input[type="checkbox"], input[type="radio"] {
  padding: 0;
  /* Addresses excess padding in IE8/9 */
}

input[type="search"] {
  -webkit-appearance: textfield;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}

input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

select {
  font-size: 100%;
  margin: 0;
  vertical-align: baseline;
  *vertical-align: middle;
  width: 100%;
  -webkit-appearance: normal;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

button::-moz-focus-inner, input::-moz-focus-inner {
  /* Corrects inner padding and border displayed oddly in FF3/4 www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/ */
  border: 0;
  padding: 0;
}

input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], textarea {
  color: #999;
  border: 2px solid #eee;
  border-radius: 2px;
}

input[type="text"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus, textarea:focus {
  border: 2px solid #ddd;
  color: #404040;
  outline: none;
}

input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"] {
  padding: 8px 10px;
}

@media (max-width: 768px) {
  input[name="post_password"] {
    display: inline-block;
    margin-bottom: 10px;
    width: 100%;
  }
}
textarea {
  overflow: auto;
  /* Removes default vertical scrollbar in IE6/7/8/9 */
  padding: 10px;
  vertical-align: top;
  /* Improves readability and alignment in all browsers */
  width: 100%;
}

::-webkit-input-placeholder {
  /* WebKit browsers */
  color: #999;
}

:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: #999;
}

::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: #999;
}

:-ms-input-placeholder {
  /* Internet Explorer 10+ */
  color: #999;
}

#main .contact-form {
  display: inline-block;
  margin: 4% 0;
  width: 100%;
}
#main .contact-form label {
  font-size: 16px;
  letter-spacing: 1px;
  margin-bottom: 10px;
  text-transform: uppercase;
}
#main .contact-form input[type='text'], #main .contact-form input[type='email'] {
  margin-bottom: 4%;
  width: 100%;
}
#main .contact-form textarea {
  margin-bottom: 4%;
  width: 98%;
}
#main .contact-form .contact-submit {
  margin-bottom: 0;
}

/* --------------------------------------------------------------
5.0 Navigation
-------------------------------------------------------------- */
/* --------------------------------------------------------------
5.1 Links
-------------------------------------------------------------- */
a {
  color: #999;
  text-decoration: none;
  -webkit-transition: .07s ease-in;
  -moz-transition: .07s ease-in;
  transition: .07s ease-in;
}

a:hover, a:focus, a:active {
  color: #404040;
  -webkit-transition: .07s ease-in;
  -moz-transition: .07s ease-in;
  transition: .07s ease-in;
}

/* --------------------------------------------------------------
5.2 Menus
-------------------------------------------------------------- */
.main-navigation {
  clear: both;
  display: block;
  float: left;
  padding-top: 30px;
  width: 100%;
}
@media (max-width: 768px) {
  .main-navigation {
    padding-top: 20px;
  }
}

.main-navigation ul {
  list-style: none;
  margin: 0 0 2% 0;
  padding-left: 0;
}

.main-navigation li {
  position: relative;
}

.main-navigation a {
  display: block;
  padding: 2% 0;
  color: #404040;
  font-family: "Noto Serif TC", "Roboto Condensed", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 18px;
  text-decoration: none;
}
@media (max-width: 768px) {
  .main-navigation a {
    padding: 1% 0;
    font-size: 16px;
  }
}

.dark .main-navigation a {
  color: #BABFC5;
}

.main-navigation a:hover, .main-navigation .current_page_item a, .main-navigation .current-menu-item a {
  color: #777;
}

.dark .main-navigation a:hover, .dark .main-navigation .current_page_item a, .dark .main-navigation .current-menu-item a {
  color: #fff;
}

.main-navigation .sub-menu {
  margin-left: 4%;
}
.main-navigation .sub-menu li a:before {
  content: "- ";
  color: #aaa;
}

.dark .main-navigation .sub-menu li a:before {
  color: #BABFC5;
}

/* --------------------------------------------------------------
5.3 Post Navigations
-------------------------------------------------------------- */
.post-navigation {
  border-top: solid 4px #eee;
  overflow: hidden;
}
@media (max-width: 768px) {
  .post-navigation {
    margin-bottom: 4%;
  }
}
.post-navigation a {
  color: #404040;
}
.post-navigation a:hover {
  color: #555;
}
.post-navigation .nav-next, .post-navigation .nav-previous {
  border-top: solid 4px transparent;
  display: inline-block;
  float: left;
  width: 50%;
  vertical-align: top;
  color: #404040;
  font-family: "Noto Serif TC", "Roboto Condensed", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 26px;
  line-height: 1.2;
  padding: 6% 0 7% 0;
  -webkit-transition: .07s ease-in;
  -moz-transition: .07s ease-in;
  transition: .07s ease-in;
}
.post-navigation .nav-next:hover, .post-navigation .nav-previous:hover {
  border-top: solid 4px #eee;
  -webkit-transition: .07s ease-in;
  -moz-transition: .07s ease-in;
  transition: .07s ease-in;
}
@media (max-width: 768px) {
  .post-navigation .nav-next, .post-navigation .nav-previous {
    width: 100%;
    border-top: none;
    font-size: 20px;
    margin-bottom: 0 !important;
  }
  .post-navigation .nav-next:hover, .post-navigation .nav-previous:hover {
    border-top: none;
  }
  .post-navigation .nav-next i, .post-navigation .nav-previous i {
    display: none;
  }
}
.post-navigation .meta-nav {
  clear: both;
  float: left;
  margin-bottom: 10px;
  width: 100%;
  color: #aaa;
  font-family: "Noto Serif TC", "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-style: normal;
  letter-spacing: 1px;
  text-transform: uppercase;
}
.post-navigation .nav-next {
  float: right;
  padding-left: 5%;
  text-align: right;
}
@media (max-width: 768px) {
  .post-navigation .nav-next {
    display: inline-block;
    float: none;
    padding-left: 0;
    text-align: left;
  }
}
.post-navigation .nav-next i {
  margin-left: 5px;
}
.post-navigation .nav-previous {
  padding-right: 5%;
}
@media (max-width: 768px) {
  .post-navigation .nav-previous {
    margin-bottom: 5%;
    padding-bottom: 5%;
    padding-right: 0;
    border-right: none;
    border-bottom: solid 2px #eee;
  }
}
.post-navigation .nav-previous i {
  margin-right: 5px;
}

/* --------------------------------------------------------------
5.4 Page Navigation
-------------------------------------------------------------- */
.paging-navigation {
  display: inline-block;
  margin-bottom: 2%;
  width: 100%;
}
.paging-navigation .nav-previous {
  float: left;
}
.paging-navigation .nav-next {
  float: right;
}

/* --------------------------------------------------------------
5.5 Toggle Menus
-------------------------------------------------------------- */
.toggle-tabs {
  position: relative;
}

.toggle-bar {
  background: #E7E7E7;
  display: inline-block;
  margin: 0;
  padding: 8px 30px 0;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 200;
}
@media (max-width: 768px) {
  .toggle-bar {
    padding: 8px 6% 0;
    position: absolute;
  }
}
.toggle-bar li {
  display: inline-block;
  list-style-type: none;
  margin-right: 15px;
  width: 18px;
}
.toggle-bar a {
  color: #babfc2;
  display: inline-block;
  padding: 2px 8px 2px 8px;
}
.toggle-bar a:hover {
  color: #80858A;
}
.toggle-bar a.current {
  color: #80858A;
  outline: none;
  background-color: #f5f5f5;
  border-radius: 6px 6px 0 0;
  color: #80858a;
}
.toggle-bar .fa-folder-open {
  display: none;
}

.dark .toggle-bar {
  background: #30353c;
}
.dark .toggle-bar a {
  color: #878D94;
}
.dark .toggle-bar a.current, .dark .toggle-bar a:hover {
  color: #fff;
}
.dark .toggle-bar a.current {
  background-color: #383f49;
}

.admin-bar .toggle-bar {
  top: 32px;
}
@media (max-width: 768px) {
  .admin-bar .toggle-bar {
    top: 0;
  }
}
@media (min-width: 769px) and (max-width: 782px) {
  .admin-bar .toggle-bar {
    top: 46px;
  }
}

.tab-content {
  display: none;
}

.tab-content.current {
  display: inherit;
}

@media (max-width: 768px) {
  #tab-1.current .main-navigation {
    display: inline-block !important;
  }
}
/* --------------------------------------------------------------
6.0 Accessibility
-------------------------------------------------------------- */
/* Text meant only for screen readers */
.screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute !important;
}

.screen-reader-text:hover, .screen-reader-text:active, .screen-reader-text:focus {
  background-color: #f1f1f1;
  border-radius: 3px;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  color: #21759b;
  display: block;
  font-size: 14px;
  font-weight: bold;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
  /* Above WP toolbar */
}

/* --------------------------------------------------------------
7.0 Alignments
-------------------------------------------------------------- */
.alignleft {
  display: inline;
  float: left;
  margin: .5em 2em 0 0;
}

.alignright {
  display: inline;
  float: right;
  margin: .5em 0 0 2em;
}

.aligncenter {
  clear: both;
  display: block;
  margin: 0 auto;
}

.pull-right {
  float: right;
  margin: 1% -5% 3% 5%;
  text-align: right;
}

.pull-left {
  float: left;
  margin: 0 5% 3% -5%;
  text-align: left;
}

.pull-right, .pull-left {
  width: 34%;
  font-weight: 400;
  line-height: 30px;
  font-size: 22px;
  text-transform: uppercase;
  font-style: italic;
}
@media (max-width: 768px) {
  .pull-right, .pull-left {
    width: 100%;
    margin: 0 0 5% 0;
  }
}

/* --------------------------------------------------------------
8.0 Clearings
-------------------------------------------------------------- */
.clear:before, .clear:after, .entry-content:before, .entry-content:after, .comment-content:before, .comment-content:after, .site-header:before, .site-header:after, .site-content:before, .site-content:after, .site-footer:before, .site-footer:after {
  content: '';
  display: table;
}

.clear:after, .entry-content:after, .comment-content:after, .site-header:after, .site-content:after, .site-footer:after {
  clear: both;
}

/* --------------------------------------------------------------
9.0 Widgets
-------------------------------------------------------------- */
.widget-area {
  font-size: 16px;
  width: 100%;
  vertical-align: top;
}
.widget-area .widget {
  width: 100%;
  margin-bottom: 30px;
  padding-bottom: 30px;
  display: inline-block;
  border-bottom: solid 2px #eee;
}
.widget-area .widget:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}
.widget-area .widget > ul, .widget-area .widget li:last-child, .widget-area .widget .menu {
  margin: 0;
}
.widget-area .widget-title, .widget-area .widgettitle {
  color: #404040;
  font-size: 18px;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 20px;
}
.widget-area li {
  list-style-type: none;
  margin-bottom: 2%;
  padding-bottom: 2%;
  padding-left: 0;
  position: relative;
}
.widget-area a {
  color: #999;
}
.widget-area a:hover {
  color: #333;
}
.widget-area .widget select {
  max-width: 100%;
}
.widget-area .widget_search {
  padding-bottom: 30px;
}
.widget-area .widget_search .search-field {
  width: 100%;
  border: none;
  border-bottom: solid 1px #e8e8e8;
  border-radius: 2px;
  text-transform: uppercase;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  color: #aaa;
  font-family: "Noto Serif TC", "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-style: normal;
  letter-spacing: 1px;
  text-transform: uppercase;
  -webkit-appearance: none;
}
.widget-area .widget_search .search-field:focus {
  outline: none;
  color: #404040;
}
.widget-area .widget_search .search-submit {
  display: none;
}
.widget-area .featured-posts-widget {
  border-bottom: none;
}
.widget-area .featured-posts-widget .widget-title {
  margin-bottom: 30px;
}
.widget-area .featured-post {
  width: 100%;
  margin-bottom: 30px;
  padding-bottom: 20px;
  display: inline-block;
  border-bottom: solid 2px #eee;
}
.widget-area .featured-post:last-child {
  border-bottom: none;
}
.widget-area .featured-post .featured-post-image {
  display: inline-block;
  margin-bottom: 10px;
}
.widget-area .featured-post .featured-post-image img {
  max-width: 100%;
  width: 100%;
}
.widget-area .featured-post h3 {
  font-size: 20px;
  margin-bottom: 5px;
}
.widget-area .featured-post h3 a {
  color: #404040;
}
.widget-area .featured-post a {
  color: #aaa;
}
.widget-area .featured-post a:hover {
  color: #404040;
}
.widget-area .featured-post .featured-post-meta {
  color: #aaa;
  line-height: 1.4;
}
.widget-area .featured-post .featured-post-meta i {
  font-size: 12px;
  margin-right: 2px;
  text-align: center;
  width: 12px;
}
.widget-area .featured-post .entry-date {
  font-size: 13px;
}
.widget-area .featured-post .entry-date:hover {
  color: #404040;
}
.widget-area .featured-post .byline, .widget-area .featured-post .vcard {
  display: none;
}

.dark .widget-area {
  color: #BABFC5;
}
.dark .widget-area .widget {
  border-bottom-color: #474E57;
}
.dark .widget-area .widget-title {
  color: #fff;
}
.dark .widget-area a {
  color: #fff;
}
.dark .widget-area a:hover {
  color: #E6E9EC;
}
.dark .widget-area .featured-post {
  border-bottom-color: #474E57;
}
.dark .widget-area .featured-post a:hover {
  color: #fff;
}
.dark .widget-area .featured-post h3 a {
  color: #fff;
}
.dark .widget-area .entry-date:hover {
  color: #fff;
}

.menu-profile {
  display: inline-block;
  height: 100%;
  padding: 5%;
  width: 64%;
  vertical-align: top;
}

#calendar_wrap {
  background: #fff;
  border-right: none;
  border-bottom: none;
  box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 2px -1px;
  color: #404040;
  -moz-box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 2px -1px;
  -webkit-box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 2px -1px;
}

#wp-calendar {
  font-size: 16px;
  margin: 0;
  max-width: 100%;
}

#wp-calendar caption {
  text-align: center;
  background: #EBEBEB;
  padding: 5px 10px;
  font-weight: bold;
}

#wp-calendar tr th, #wp-calendar tr td {
  text-align: center;
}

#wp-calendar tr th {
  background: #404040;
  color: #fff;
  margin: -10px -10px 10px -10px;
  font-size: 11px;
  font-weight: bold;
  padding: 10px 0;
}

#wp-calendar tbody tr td {
  padding: 2px 0;
  border-right: solid 1px #f3f3f3;
  border-top: solid 1px #f3f3f3;
}

#wp-calendar tfoot td {
  border-top: solid 1px #f3f3f3;
  border-right: solid 1px #eee;
  padding: 7px 0 5px 0;
  font-weight: bold;
  font-size: 10px;
  text-transform: uppercase;
}

#wp-calendar a {
  color: #404040;
}
#wp-calendar a:hover {
  color: #999;
}

.widget_rss li {
  border-bottom: solid 1px #eee;
  margin-bottom: 15px;
  padding-bottom: 15px;
}
.widget_rss li:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}
.widget_rss li .rsswidget {
  display: inline-block;
  width: 100%;
}
.widget_rss .rss-date, .widget_rss cite {
  font-size: 14px;
  text-transform: uppercase;
  display: inline-block;
  margin: 10px 0;
}

.dark .widget_rss li {
  border-bottom-color: #474E57;
}

/* --------------------------------------------------------------
10.0 Content
-------------------------------------------------------------- */
/* --------------------------------------------------------------
10.1 Posts and pages
-------------------------------------------------------------- */
.updated {
  display: none;
}

.byline {
  display: inline;
}

.page-content, .entry-content, .entry-summary {
  margin: 0;
}

.page-links {
  clear: both;
  font-weight: bold;
  margin: 0 0 1.5em;
  padding-top: 2%;
}

/* --------------------------------------------------------------
10.2 Comments
-------------------------------------------------------------- */
.comments-area {
  background: #f5f5f5;
  display: block;
  margin: 0 auto;
  padding: 6% 12% 5% 12%;
}
@media (max-width: 768px) {
  .comments-area {
    padding: 5%;
  }
}

.page .comments-area {
  background: #f9f9f9;
}

.comments-title {
  font-size: 52px;
  font-weight: 500;
  letter-spacing: -1px;
  margin-bottom: 7%;
  padding-bottom: 1%;
  width: 100%;
}
@media (max-width: 768px) {
  .comments-title {
    font-size: 38px;
  }
}

@media (max-width: 768px) {
  .comment-content {
    font-size: 18px;
  }
}
.comment-info {
  display: inline-block;
  margin-bottom: 3%;
}

.bypostauthor .comment-cite:after {
  color: #999;
  content: "\f007";
  font-family: "FontAwesome";
  font-size: 1.6rem;
  margin-left: 1rem;
  position: relative;
  top: -2px;
}

.comment-list, .comment-list li {
  margin: 0;
  counter-reset: li;
  list-style-type: none;
}

.comment-list > li {
  margin-bottom: 5%;
  padding-bottom: 5%;
  border-bottom: solid 3px #E6E6E6;
}

.comment-list .children {
  margin: 4% 0 0 13%;
}
.comment-list .children li {
  margin-bottom: 5%;
  padding-bottom: 2%;
  border-bottom: solid 3px #E6E6E6;
}
.comment-list .children li:first-child {
  border-top: solid 3px #E6E6E6;
  padding-top: 5%;
}
.comment-list .children li:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}

.comment-list .avatar {
  display: inline-block;
  margin-right: 5%;
  border-radius: 100px;
  vertical-align: top;
  width: 8%;
}
@media (max-width: 768px) {
  .comment-list .avatar {
    margin-top: 2%;
  }
}

.comment-wrap {
  display: inline-block;
  width: 82%;
  vertical-align: top;
}

.comment-cite {
  font-style: normal;
  display: inline-block;
  width: 100%;
  font-size: 24px;
  font-family: "Noto Serif TC", "Roboto Condensed", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.comment-cite a {
  color: #404040;
}

.comment-time, .comment-edit-link {
  color: #aaa;
  font-family: "Noto Serif TC", "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-style: normal;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.comment-reply-title {
  font-size: 52px;
  font-weight: 500;
  letter-spacing: -1px;
  margin-bottom: 3%;
}
@media (max-width: 768px) {
  .comment-reply-title {
    font-size: 34px;
  }
}
.comment-reply-title small a {
  background: #404040;
  border: none;
  border-radius: 2px;
  color: #fff;
  font-family: "Noto Serif TC", "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-align: right;
  margin-left: 8px;
  padding: 5px 8px;
}
.comment-reply-title small a:hover {
  background: #555;
  color: #fff;
  cursor: pointer;
}

.logged-in-as, .comment-notes {
  color: #aaa;
  font-family: "Noto Serif TC", "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-style: normal;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 3%;
}

.comment-notes {
  display: none;
}

.required {
  color: #F35959;
}

.logged-in-as a {
  color: #404040;
}

.comment-form-author, .comment-form-email, .comment-form-url {
  display: inline-block;
  width: 100%;
}
@media (max-width: 768px) {
  .comment-form-author, .comment-form-email, .comment-form-url {
    width: 100%;
    margin-right: 0;
  }
}

.comment-list #respond {
  border-top: solid 2px #eee;
  margin-top: 4%;
  padding-top: 4%;
}

@media (max-width: 768px) {
  .comment-form-url {
    margin-bottom: 1em;
  }
}

.comment-form label {
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 1px;
  margin-bottom: 10px;
  text-transform: uppercase;
}

.comment-form input {
  width: 100%;
}

.comment-form #submit {
  margin-top: 10px;
  width: auto;
}

.form-allowed-tags {
  display: none;
}

.comment-subscription-form {
  margin-bottom: 10px;
}
.comment-subscription-form label {
  font-weight: normal;
  font-size: 14px;
}

/* --------------------------------------------------------------
11.0 Infinite scroll
-------------------------------------------------------------- */
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .paging-navigation,
.infinite-scroll.neverending .site-footer {
  /* Theme Footer (when set to scrolling) */
  display: none;
}

/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before */
.infinity-end.neverending .site-footer {
  display: block;
}

#page #infinite-handle {
  margin-bottom: 2%;
}

/* --------------------------------------------------------------
12.0 Media
-------------------------------------------------------------- */
.page-content img.wp-smiley, .entry-content img.wp-smiley, .comment-content img.wp-smiley {
  border: none;
  margin-bottom: 0;
  margin-top: 0;
  padding: 0;
}

.wp-caption {
  margin: 1.5em 0;
  max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
  display: block;
  margin: 0;
  max-width: 100%;
}

.wp-caption-text, .gallery-caption {
  display: inline-block;
  margin: 1em 0 0 0;
  text-align: center;
  width: 100%;
  color: #aaa;
  font-family: "Noto Serif TC", "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-style: normal;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.site-main .gallery {
  margin-bottom: 1.5em;
}

.gallery a img {
  border: none;
  height: auto;
  width: 100%;
  max-width: 100%;
}

.gallery dd, .gallery figcaption {
  font-size: 15px;
  text-align: left;
  margin: 0 0 15px 0;
}

.gallery-item {
  display: inline-block;
  padding-right: 5%;
  width: 25%;
  vertical-align: top;
}
@media (max-width: 768px) {
  .gallery-item {
    width: 32%;
  }
}

embed, iframe, object {
  max-width: 100%;
}

/* --------------------------------------------------------------
13.0 Header
-------------------------------------------------------------- */
.site-header::-webkit-scrollbar {
  display: none;
}

.fullscreen {
  display: none;
}

.site-header {
  background: #f5f5f5;
  position: fixed;
  top: 0;
  height: 100%;
  width: 20%;
  padding: 90px 2% 2% 2%;
  overflow: scroll;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  z-index: 100;
  -webkit-transform: translate(0px, 0px);
  -moz-transform: translate(0px, 0px);
  -o-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  transform: translate(0px, 0px);
}
@media (max-width: 768px) {
  .site-header {
    margin-left: 0;
    padding: 70px 5% 25px 5%;
    position: relative;
    width: 100%;
  }
}

.dark.site-header {
  background: #383F49;
}

.admin-bar .site-header {
  padding-top: 122px;
}
@media (max-width: 768px) {
  .admin-bar .site-header {
    padding-top: 70px;
  }
}

.admin-bar .site-header-inside {
  top: 32px;
}
@media (max-width: 768px) {
  .admin-bar .site-header-inside {
    top: 0;
  }
}
@media (min-width: 769px) and (max-width: 782px) {
  .admin-bar .site-header-inside {
    top: 46px;
  }
}

.site-branding {
  width: 100%;
}

.site-logo {
  margin: 0;
}

.site-title {
  font-family: "Noto Serif TC", "Roboto Condensed", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 40px;
  font-weight: 700;
  letter-spacing: -1px;
  line-height: 1;
  text-transform: uppercase;
  word-wrap: break-word;
  margin: 0;
  position: relative;
}
.site-title a {
  position: relative;
  text-decoration: none;
  color: #404040;
}

.dark .site-title a {
  color: #fff;
}
.dark .site-title a:hover {
  color: #eee;
}

.site-description {
  color: #aaa;
  line-height: 1.4;
  font-family: "Noto Serif TC", "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 16px;
  font-weight: normal;
  display: inline-block;
  margin: 10px 0 0 0;
}

.dark .site-description {
  color: #BABFC5;
}

/* --------------------------------------------------------------
14.0 Footer
-------------------------------------------------------------- */
.site-footer {
  display: inline-block;
  padding: 0 6% 4% 26%;
  width: 100%;
  color: #aaa;
  font-family: "Noto Serif TC", "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-style: normal;
  letter-spacing: 1px;
  text-transform: uppercase;
}
.site-footer .site-info {
  background: #f5f5f5;
  padding: 2.5%;
}
@media (max-width: 768px) {
  .site-footer {
    padding: 5%;
  }
  .site-footer .site-info {
    padding: 3%;
  }
  .site-footer .powered-by {
    display: inline-block;
    width: 100%;
  }
  .site-footer .sep {
    display: none;
  }
}
.site-footer a {
  color: #404040;
}
.site-footer a:hover {
  color: #999;
}

/* --------------------------------------------------------------
15.0 Content
-------------------------------------------------------------- */
.featured-image {
  margin-bottom: 4%;
  display: inline-block;
  width: 100%;
}

.content-area {
  max-width: 1000px;
}

.site-content {
  display: inline-block;
  width: 100%;
  padding: 5% 6% 4% 26%;
}
@media (max-width: 768px) {
  .site-content {
    padding: 5%;
  }
}

.admin-bar .site-content {
  padding-top: 7%;
}

.entry-date {
  margin-bottom: 2%;
  color: #aaa;
  font-family: "Noto Serif TC", "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-style: normal;
  letter-spacing: 1px;
  text-transform: uppercase;
}
.entry-date a {
  color: #aaa;
  text-decoration: none;
}
.entry-date a:hover, .entry-date a time:hover {
  color: #404040;
}
.entry-date .byline {
  text-transform: lowercase;
  font-style: italic;
}

.entry-title {
  font-family: "Noto Serif TC", "Roboto Condensed", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 80px;
  font-weight: 400;
  letter-spacing: -1px;
  line-height: 1.1;
  margin-bottom: 4%;
}
@media (max-width: 768px) {
  .entry-title {
    font-size: 50px;
    margin-bottom: 20px;
  }
}
.entry-title a {
  color: #404040;
  text-decoration: none;
}
.entry-title a:hover {
  color: #555;
}

.format-quote .entry-title {
  font-size: 64px;
  font-style: italic;
  font-weight: 300;
  line-height: 1.3;
  padding-right: 18%;
  position: relative;
}
@media (max-width: 768px) {
  .format-quote .entry-title {
    font-size: 32px;
  }
}
.format-quote .entry-title:before {
  border: solid 2px #D4DAE0;
  border-radius: 100px;
  color: #D4DAE0;
  content: "\f10d";
  font-family: "FontAwesome";
  font-size: 30px;
  font-style: normal;
  line-height: 72px;
  text-align: center;
  position: absolute;
  right: 0;
  top: 2%;
  height: 70px;
  width: 70px;
}
@media (max-width: 768px) {
  .format-quote .entry-title:before {
    font-size: 22px;
    line-height: 50px;
    height: 50px;
    width: 50px;
  }
}
.format-quote .entry-title p {
  margin-bottom: .5em;
}
.format-quote .entry-title p:last-child {
  margin-bottom: 0;
}
.format-quote .entry-title cite {
  color: #B2B8BD;
  font-size: 32px;
  font-weight: 400;
}
@media (max-width: 768px) {
  .format-quote .entry-title cite {
    font-size: 26px;
  }
}

.search-results .entry-title {
  margin-bottom: 3%;
}

.page-header {
  background: #F5F5F5;
  margin-bottom: 8%;
  padding: 2%;
}
@media (max-width: 768px) {
  .page-header {
    padding: 3%;
  }
}

.page-title {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.1;
  text-transform: uppercase;
  margin-bottom: 0;
}
@media (max-width: 768px) {
  .page-title {
    font-size: 20px;
    letter-spacing: 0;
  }
}

.taxonomy-description {
  color: #aaa;
  font-family: "Noto Serif TC", "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-style: normal;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-top: 5px;
}
.taxonomy-description p {
  margin-bottom: 0;
}

.entry-meta {
  display: inline-block;
  width: 20%;
  margin-right: 6%;
  margin-top: 1%;
  vertical-align: top;
}
@media (max-width: 768px) {
  .entry-meta {
    margin-bottom: 3%;
    width: 100%;
  }
}

.entry-excerpt {
  color: #999;
  border-top: solid 4px #eee;
  font-size: 16px;
  padding: 10% 0 1% 0;
  margin-bottom: 5%;
}
@media (max-width: 768px) {
  .entry-excerpt {
    font-size: 18px;
    padding: 5% 0 0 0;
  }
}

.meta-list {
  margin: 0;
  list-style-type: none;
  color: #aaa;
  font-family: "Noto Serif TC", "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-style: normal;
  letter-spacing: 1px;
  text-transform: uppercase;
}
.meta-list li {
  margin-bottom: 12px;
  padding: 0 0 12px 25px;
  position: relative;
  border-bottom: solid 2px #eee;
}
.meta-list li:first-child {
  border-top: solid 2px #eee;
  padding-top: 12px;
}
.meta-list li:before {
  display: block;
  font-family: "FontAwesome";
  left: 0;
  position: absolute;
}
.meta-list i {
  color: #999;
  margin-right: 5px;
}
.meta-list .meta-cat:before {
  content: "\f0ca";
}
.meta-list .meta-tag:before {
  content: "\f02b";
}
.meta-list .meta-tag:before {
  content: "\f02b";
}
.meta-list .meta-comment:before {
  content: "\f0e5";
}
.meta-list .meta-edit:before {
  content: "\f044";
}
.meta-list a {
  color: #999;
}
.meta-list a:hover {
  color: #404040;
}

.entry-content {
  font-size: 20px;
  font-family: "Noto Serif TC", "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
  display: inline-block;
  width: 72%;
  vertical-align: top;
}
@media (max-width: 768px) {
  .entry-content {
    font-size: 18px;
    width: 100%;
  }
}

/* --------------------------------------------------------------
16.0 Posts
-------------------------------------------------------------- */
.post {
  margin-bottom: 10%;
  padding-bottom: 6%;
  border-bottom: solid 15px #f6f6f6;
}
.post:last-child, .post:last-of-type {
  margin-bottom: 8%;
}
@media (max-width: 768px) {
  .post {
    padding-bottom: 3%;
  }
}

.single .post, .page .post, .error404 .post, .archive .post:last-child {
  margin-bottom: 5%;
  padding-bottom: 0;
  border-bottom: none;
}

/* --------------------------------------------------------------
17.0 Archives
-------------------------------------------------------------- */
.page-header.profile {
  display: none;
}

.author-info {
  background: #f9f9f9;
  display: inline-block;
  margin-bottom: 8%;
  padding: 5% 8%;
  width: 100%;
}

.author-avatar {
  display: inline-block;
  margin-right: 2%;
  vertical-align: top;
  width: 15%;
}
.author-avatar img {
  border-radius: 250px;
}

.author-description {
  display: inline-block;
  color: #888;
  font-size: 22px;
  width: 75%;
}
@media (max-width: 768px) {
  .author-description {
    font-size: 18px;
  }
}
.author-description h2 {
  color: #404040;
  font-size: 34px;
}
@media (max-width: 768px) {
  .author-description h2 {
    font-size: 28px;
  }
}

/* --------------------------------------------------------------
18.0 Attachments
-------------------------------------------------------------- */
.attachment .comments-area, .attachment .entry-meta, .attachment .post-navigation, .attachment .entry-footer {
  display: none;
}

.mejs-container {
  margin-bottom: 1em;
}

/* --------------------------------------------------------------
19.0 Animations
-------------------------------------------------------------- */
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.fadeIn {
  -webkit-animation: fadeIn .5s;
  animation: fadeIn .5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.fadeInFast {
  -webkit-animation: fadeIn .2s;
  animation: fadeIn .2s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

/*--------------------------------------------------------------
20. Social Links
--------------------------------------------------------------*/
.social-links {
  clear: both;
  margin: 0 auto 1em;
  padding-top: 30px;
  width: 100%;
}
@media (max-width: 768px) {
  .social-links {
    margin: 0 auto 10px;
    padding-top: 20px;
  }
}

.social-links ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.social-links ul li {
  display: inline-block;
  margin: 0;
}

.social-links ul a {
  display: inline-block;
  min-height: 40px;
  min-width: 40px;
  text-decoration: none;
  background: #404040;
  border-radius: 50%;
  text-align: center;
  line-height: 40px;
}
@media (max-width: 768px) {
  .social-links ul a {
    min-height: 34px;
    min-width: 34px;
    line-height: 34px;
  }
  .social-links ul a .social-links ul a:before {
    font-size: 16px;
  }
}

.social-links ul a:before {
  color: #fff;
  display: block;
  font-family: FontAwesome;
  font-size: 18px;
  position: relative;
  -webkit-transition: all .3s ease-in-out;
  -moz-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
  text-align: center;
}

.social-links ul a:hover {
  text-decoration: none;
  background: #555555;
  -webkit-transition: all .3s ease-in-out;
  -moz-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

.social-links ul a[href*='wordpress.org']:before,
.social-links ul a[href*='wordpress.com']:before {
  content: '\f19a';
}

.social-links ul a[href*='facebook.com']:before {
  content: '\f09a';
}

.social-links ul a[href*='twitter.com']:before {
  content: '\f099';
}

.social-links ul a[href*='dribbble.com']:before {
  content: '\f17d';
}

.social-links ul a[href*='plus.google.com']:before {
  content: '\f0d5';
}

.social-links ul a[href*='pinterest.com']:before {
  content: '\f0d2';
}

.social-links ul a[href*='github.com']:before {
  content: '\f09b';
}

.social-links ul a[href*='tumblr.com']:before {
  content: '\f173';
}

.social-links ul a[href*='youtube.com']:before {
  content: '\f167';
}

.social-links ul a[href*='flickr.com']:before {
  content: '\f16e';
}

.social-links ul a[href*='vimeo.com']:before {
  content: '\f194';
}

.social-links ul a[href*='instagram.com']:before {
  content: '\f16d';
}

.social-links ul a[href*='codepen.io']:before {
  content: '\f1cb';
}

.social-links ul a[href*='linkedin.com']:before {
  content: '\f0e1';
}

.social-links ul a[href*='/feed']:before {
  content: '\f09e';
}

.social-links ul a[href*='mailto']:before {
  content: '\f0e0';
}

/*# sourceMappingURL=style.css.map */