@charset "UTF-8";
/* # Color Variable Definitions 因为我们都爱颜色，对吧？
================================================== */
/* 
 * For sake of convention, the color variables 
 * are initially defined as color, but in-code
 * implementation uses function specific aliases.
 * This is done to avoid confusing naming conflicts.
 *
 * Building an Instasite? No problem. override.scss
 * is mostly layed out for you, simply tweek the 
 * selectors & the aliases below - easy huh?. 
 */
/* # Structural Variable Definitions
================================================== */
/* # Imports
================================================== */
/* # Functions
================================================== */
/* # Mixins
================================================== */
.items {
  overflow: hidden;
  padding-bottom: 25px;
  float: left;
  width: 100%;
}

.items article {
  overflow: hidden;
  padding: 1.5%;
  width: 54.9%;
  float: right;
  clear: right;
  border-top: #f1f1f1 solid 1px;
}

.items article.first {
  border-top: none;
}

.items article.detail {
  width: 97%;
  margin-left: 0;
}

.items article.odd {
  background: #f1f1f1;
  background: rgba(255, 255, 255, 0.5);
}

article img {
  float: left;
  margin-right: 15px;
}

article.detail img {
  float: none;
  max-width: 100%;
  margin-bottom: 25px;
}

.series_heading p span {
  font-size: 1em;
}

#text article .meta {
  font-size: 1.3em;
  line-height: 1.2em;
  margin-bottom: 5px;
  color: #666;
  padding: 0;
}

#text article .meta span {
  font-size: 1em;
}

article .meta span {
  color: #333;
}

article .meta a {
  text-decoration: none;
}

article h3 {
  margin-bottom: 10px;
  font-size: 1.5em;
}

article h3 a {
  text-decoration: none;
  color: #666;
  line-height: 1em;
  font-weight: bold !important;
}

article h3 a:active {
  color: #333;
}

article .time {
  font-size: 1.1em;
  margin-bottom: 10px;
  display: block;
}

article .media {
  min-width: 125px;
  min-height: 100px;
  float: right;
  margin-left: 10px;
  border-left: 1px solid #b7b7b7;
  padding: 0;
}

#text article .media li {
  line-height: 1em;
  font-size: 1.2em;
  display: block;
  padding: 0;
  margin-left: 0 !important;
}

article .media li a {
  text-decoration: none !important;
  color: #999999;
  text-transform: uppercase;
  padding: 5px 10px;
  display: block;
}

article .media li a:hover {
  background-color: #eee;
  color: #666666;
}

article .media li a:active {
  background-color: #666666;
  color: #dddddd;
}

article.detail {
  border: 0;
  line-height: 1.6em;
}

article.detail .summary {
  font-size: 1.3em;
  line-height: 1.6em;
  color: #666666;
  margin-top: 25px;
  margin-bottom: 5px;
}

.series_heading {
  display: block;
  float: left;
  clear: both;
  width: 39%;
  margin-right: 10px;
  padding: 1.5% 0;
  min-height: 100px;
  margin-bottom: 100px;
}

.series_heading:last-child {
  margin-bottom: 0;
  min-height: auto;
}

.series_heading img {
  width: 100%;
  margin-bottom: 10px;
}

.series_heading p {
  font-size: 1.3em;
  line-height: 1.5em;
}

.filters {
  margin-bottom: 25px;
  overflow: hidden;
  background: #f1f1f1;
  padding: 12px 20px 11px 20px;
  border-radius: 3px;
  -moz-border-radius: 3px;
  position: relative;
  z-index: 1000;
  border: none;
}

.filters h6 {
  float: left;
  margin-right: 20px;
  padding-top: 9px;
  color: #999999;
  font-size: 1.6em;
  font-weight: normal;
  margin-bottom: 0;
}

#pagination {
  padding: 10px;
}

#pagination a {
  padding: 5px 8px;
  text-decoration: none;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  color: #555555;
  margin-right: 3px;
}

#pagination a#off {
  color: #cccccc;
}

#pagination a#off:hover {
  background-color: transparent;
  color: #cccccc;
}

/* @group Select Menus */
.content select.sorter {
  float: left;
  margin-right: 12px;
}

.ui-selectmenu {
  display: block;
  float: left;
  position: relative;
  width: 150px !important;
  text-decoration: none;
  overflow: hidden;
  margin-right: 5px;
  background: url(/_img/article_selectmenu_icon.png) no-repeat 95% 50%;
  padding: 6px 0 6px;
  box-sizing: border-box;
  border: 1px solid;
}

#content a.ui-selectmenu:hover {
  text-decoration: none;
}

.ui-selectmenu-icon {
  position: absolute;
  right: 6px;
  margin-top: -8px;
  top: 50%;
}

.ui-selectmenu-menu {
  padding: 0;
  margin: 1px 0 0 0;
  list-style: none;
  position: absolute;
  z-index: 1001;
  top: 0;
  visibility: hidden;
  overflow: auto;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  height: 200px;
  width: 150px !important;
  padding-top: 1px;
}

.ui-selectmenu-open {
  visibility: visible;
}

.ui-selectmenu-menu-popup {
  margin-top: -1px;
}

.ui-selectmenu-menu-dropdown {
  margin: 0;
  padding: 0;
  overflow: auto;
  height: 200px !important;
  width: 150px !important;
  background-color: #f1f1f1;
}

.ui-selectmenu-menu li {
  padding: 0;
  margin: 0;
  display: block;
  border-top: 1px solid transparent;
  border-bottom: 1px solid transparent;
  border-right-width: 0 !important;
  border-left-width: 0 !important;
  font-weight: normal !important;
  font-family: "Open Sans", sans-serif;
}

.ui-selectmenu-status {
  line-height: 1.4em;
  display: block;
  padding: .3em 1.5em 0 1em;
  outline: none;
  text-decoration: none;
  color: #363636;
  font-size: 11px;
}

.ui-selectmenu-menu li a {
  line-height: 1.4em;
  display: block;
  padding: .3em 1.5em .3em 1em;
  outline: none;
  text-decoration: none;
  color: #363636;
  font-size: 12px;
  font-family: "Open Sans", sans-serif;
}

.ui-selectmenu-menu li.ui-selectmenu-hasIcon a, .ui-selectmenu-hasIcon .ui-selectmenu-status {
  padding-left: 20px;
  position: relative;
  margin-left: 5px;
}

.ui-selectmenu-menu li .ui-icon, .ui-selectmenu-status .ui-icon {
  position: absolute;
  top: 1em;
  margin-top: -8px;
  left: 0;
}

.ui-selectmenu-status {
  line-height: 16px;
  height: 16px;
  overflow: hidden;
  color: #999999;
  font-size: 14px;
  font-weight: 700;
  font-family: "Open Sans", sans-serif;
  display: block;
  padding: .3em 1.5em .3em 1em;
  outline: none;
  text-decoration: none;
}

.ui-selectmenu-open li.ui-selectmenu-item-focus a {
  background: #dbdbdb;
}

.ui-selectmenu-menu li span, .ui-selectmenu-status span {
  display: block;
  margin-bottom: .2em;
}

.ui-selectmenu-menu li .ui-selectmenu-item-header {
  font-weight: 700;
}

.ui-selectmenu-menu li .ui-selectmenu-item-footer {
  opacity: .8;
}

/*for optgroups*/
.ui-selectmenu-menu .ui-selectmenu-group {
  font-size: 1em;
}

.ui-selectmenu-menu .ui-selectmenu-group .ui-selectmenu-group-label {
  line-height: 1.4em;
  display: block;
  padding: .6em .5em 0;
  font-weight: 700;
}

.ui-selectmenu-menu .ui-selectmenu-group ul {
  margin: 0;
  padding: 0;
}
span.icon-volume,span.icon-unordered-list,span.icon-movie,span.icon-download-1 {
    padding-left: 10px;
    float: right;
    font-size:1em !important;
    padding-top: 4px !important;
}
/* =Override
---------------------------------------------------------------------
*/
#content article.detail h2 {
  font-size: 1.5em;
  margin-bottom: 0.5em;
}

@media only screen and (max-width: 50em) {
  .filters h6 {
    float: none;
    padding-top: 0;
    margin-top: 0;
    margin-right: 0;
  }

  .filters select {
    width: 39%;
    margin: 2% 5%;
  }

  .series_heading {
    float: none;
    margin: 0;
    width: 100%;
    border-bottom: 1px solid #eeeeee;
  }

  .items article {
    margin-left: 0;
    padding-right: 0;
    padding-left: 0;
    width: 97%;
    padding: 1.5%;
  }

  .items article.detail {
    width: 100%;
  }
}