/* components/meteor-posts.css */

div.frame {
  position: relative;
  overflow: hidden;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
div.frame div.btns {
  -webkit-transition: background 0.4s ease-in-out;
  -moz-transition: background 0.4s ease-in-out;
  -o-transition: background 0.4s ease-in-out;
  transition: background 0.4s ease-in-out;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
  background: transparent;
}
div.frame div.btns a.overlay-link {
  display: block;
  width: 100%;
  height: 100%;
}
div.frame div.btns span.overlay {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
}
div.frame:hover .btns,
div.frame.hover-effect .btns {
  background-color: #2666a9;
  background-color: rgba(38, 102, 169, 0.18);
}
body.ios div.frame:hover .btns,
body.ios div.frame.hover-effect .btns {
  display: block;
}
.ie8 div.frame:hover .btns,
.ie8 div.frame.hover-effect .btns {
  filter: alpha(opacity=22);
}
div.frame a {
  display: block;
}
div.frame:before {
  position: absolute;
  content: "\020";
}
div.frame:before {
  bottom: -1px;
  left: 0;
  width: 100%;
  height: 6px;
  z-index: 2;
  background-color: #ffffff;
  background-color: rgba(255, 255, 255, 0.28);
}
div.frame + * {
  margin-top: 1.23em;
}
div.frame a.above {
  position: absolute;
  display: block;
  width: 36px;
  height: 36px;
  right: -36px;
  text-shadow: none !important;
  -webkit-transition: all 0.22s ease-in-out;
  -moz-transition: all 0.22s ease-in-out;
  -o-transition: all 0.22s ease-in-out;
  transition: all 0.22s ease-in-out;
  top: -36px;
  z-index: 3;
}
div.frame a.above:before,
div.frame a.above:after {
  position: absolute;
  display: block;
  font-weight: 300;
}
div.frame a.above:before {
  content: "\020";
  width: 0;
  right: -36px;
}
div.frame a.above:after {
  font-family: "FontAwesome", sans-serif;
  color: #2666a9;
  width: 18px;
  height: 18px;
  right: 0;
  text-align: center;
  line-height: 18px;
  -webkit-font-smoothing: antialiased;
}
div.frame a.above:before {
  border-left: 36px solid transparent;
  border-right: 36px solid transparent;
  border-top: 36px solid #ffffff;
  top: 0;
}
div.frame a.above:after {
  top: 3px;
}
div.frame a.below {
  position: absolute;
  display: block;
  width: 36px;
  height: 36px;
  right: -36px;
  text-shadow: none !important;
  -webkit-transition: all 0.22s ease-in-out;
  -moz-transition: all 0.22s ease-in-out;
  -o-transition: all 0.22s ease-in-out;
  transition: all 0.22s ease-in-out;
  bottom: -36px;
  z-index: 3;
}
div.frame a.below:before,
div.frame a.below:after {
  position: absolute;
  display: block;
  font-weight: 300;
}
div.frame a.below:before {
  content: "\020";
  width: 0;
  right: -36px;
}
div.frame a.below:after {
  font-family: "FontAwesome", sans-serif;
  color: #2666a9;
  width: 18px;
  height: 18px;
  right: 0;
  text-align: center;
  line-height: 18px;
  -webkit-font-smoothing: antialiased;
}
div.frame a.below:before {
  border-left: 36px solid transparent;
  border-right: 36px solid transparent;
  border-bottom: 36px solid #ffffff;
  bottom: 0;
}
div.frame a.below:after {
  bottom: 0;
}
div.frame a.zoom:after {
  content: "\f002";
  font-size: 12px;
}
div.frame a.permalink:after {
  content: "\f0c1";
  font-size: 15px;
}
div.frame:hover a.above,
div.frame.hover-effect a.above {
  cursor: pointer;
  top: 0;
  right: 0;
}
div.frame:hover a.below,
div.frame.hover-effect a.below {
  cursor: pointer;
  bottom: 0;
  right: 0;
}
.meteor-post .meteor-posts {
  margin: 2.2em 0 2em;
}
.meteor-posts .item {
  color: #4f4f4f;
}
.meteor-posts .item > div.frame img {
  width: 100%;
}
.meteor-posts .item div.meta {
  margin-bottom: 1em;
}
.meteor-posts .item div.meta h3 {
  font-size: 100%;
  margin: 0;
}
.meteor-posts .item div.meta h3,
.meteor-posts .item div.meta h3 > a {
  -webkit-transition: color 0.2s ease-in-out;
  -moz-transition: color 0.2s ease-in-out;
  -o-transition: color 0.2s ease-in-out;
  transition: color 0.2s ease-in-out;
  font-weight: 600;
  color: #292929;
}
.meteor-posts .item div.meta h3:hover,
.meteor-posts .item div.meta h3 > a:hover {
  text-decoration: none;
}
footer .meteor-posts .item div.meta h3,
footer .meteor-posts .item div.meta h3 > a {
  color: #bdbdbd;
}
footer .meteor-posts .item div.meta h3:hover,
footer .meteor-posts .item div.meta h3 > a:hover {
  color: #e88255;
}
.meteor-posts .item div.meta a:hover {
  color: #2666a9;
}
.meteor-posts .item div.meta small.desc {
  margin-top: 0.45em;
}
footer .meteor-posts .item div.meta small.desc {
  color: #818181;
}
footer .meteor-posts .item div.meta small.desc a {
  -webkit-transition: none;
  -moz-transition: none;
  -o-transition: none;
  transition: none;
}
.meteor-posts.scroller > .row {
  position: relative;
  overflow: hidden;
  margin-left: 0;
}
.meteor-posts.scroller > .row .wrapper {
  width: 9999px;
}
.meteor-posts.scroller > .row .wrapper > .item {
  float: left !important;
  margin: 0 20px 0 0;
}
.meteor-posts.scroller > .row > span.nav {
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  position: absolute;
  display: block;
  width: 30px;
  height: 30px;
  background: none;
  top: 43%;
  z-index: 9999;
  text-shadow: none !important;
}
.meteor-posts.scroller > .row > span.nav:hover {
  cursor: pointer;
}
.meteor-posts.scroller > .row > span.nav:hover:before {
  color: #2666a9;
}
.meteor-posts.scroller > .row > span.nav:before {
  -webkit-transition: color 200ms ease-in-out;
  -moz-transition: color 200ms ease-in-out;
  -o-transition: color 200ms ease-in-out;
  transition: color 200ms ease-in-out;
  font-family: "FontAwesome", sans-serif;
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  line-height: 30px;
  color: #292929;
  text-align: center;
  font-size: 20px;
  -webkit-font-smoothing: antialiased;
}
.meteor-posts.scroller > .row > span.nav.prev {
  left: 0;
}
.meteor-posts.scroller > .row > span.nav.prev:before {
  content: none;
}
.meteor-posts.scroller > .row > span.nav.next {
  right: 0;
}
.meteor-posts.scroller > .row > span.nav.next:before {
  content: none;
}
@media (min-width: 1200px) {
  body[data-widescreen=true] .meteor-posts.scroller .wrapper > .item {
    margin: 0 30px 0 0;
  }
}
@media (min-width: 480px) and (max-width: 767px) {
  .meteor-posts.scroller > .row {
    margin: 0;
  }
  .meteor-posts.scroller .wrapper > .item {
    width: 210px;
  }
}
@media (max-width: 479px) {
  .meteor-posts.scroller .wrapper > .item {
    width: 300px;
  }
}
@media (max-width: 767px) {
  .meteor-posts.scroller > .row {
    margin: 0;
  }
}