@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Lato:400,300,100,700,900);
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, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

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

table {
  border-collapse: collapse;
  border-spacing: 0;
}

.clearfix:before, .tile-interactions:before, .tile-belt:before, .tile-sharing-expanded:before,
.clearfix:after,
.tile-interactions:after,
.tile-belt:after,
.tile-sharing-expanded:after {
  content: ".";
  display: block;
  height: 0;
  overflow: hidden;
}

.clearfix:after, .tile-interactions:after, .tile-belt:after, .tile-sharing-expanded:after {
  clear: both;
}

.clearfix, .tile-interactions, .tile-belt, .tile-sharing-expanded {
  zoom: 1;
}

@font-face {
  font-family: "stackla-icons";
  src: url("/media/fonts/stackla-icons/stackla-icons20140417.eot");
  src: url("/media/fonts/stackla-icons/stackla-icons20140417.eot?#iefix") format("embedded-opentype"), url("/media/fonts/stackla-icons/stackla-icons20140417.woff") format("woff"), url("/media/fonts/stackla-icons/stackla-icons20140417.ttf") format("truetype"), url("/media/fonts/stackla-icons/stackla-icons20140417.svg#stackla-icons") format("svg");
  font-weight: normal;
  font-style: normal;
}
[class^=stackla-icon-], [class*=" stackla-icon-"] {
  font-family: "stackla-icons";
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.stackla-icon-tick:before {
  content: "";
}

.stackla-icon-pause:before {
  content: "";
}

.stackla-icon-tag:before {
  content: "";
}

.stackla-icon-product:before {
  content: "";
}

.stackla-icon-share:before {
  content: "";
}

.stackla-icon-close:before {
  content: "";
}

.stackla-icon-list:before {
  content: "";
}

.stackla-icon-vote:before {
  content: "";
}

.stackla-icon-time:before {
  content: "";
}

.stackla-icon-reply:before {
  content: "";
}

.stackla-icon-location:before {
  content: "";
}

.stackla-icon-like:before {
  content: "";
}

.stackla-icon-dislike:before {
  content: "";
}

.stackla-icon-comment:before {
  content: "";
}

body {
  color: #666;
  font-family: "Lato", sans-serif;
  font-size: 13px;
  font-weight: 300;
  line-height: 1.4;
  margin: 0;
  padding: 0;
  width: 100%;
}

a:link,
a:visited {
  color: #1999cc;
  text-decoration: none;
}

iframe {
  display: block;
  border: none;
}

.clearfix:after, .tile-interactions:after, .tile-belt:after, .tile-sharing-expanded:after {
  clear: both;
}

.clearfix, .tile-interactions, .tile-belt, .tile-sharing-expanded {
  zoom: 1;
}
.clearfix:after, .tile-interactions:after, .tile-belt:after, .tile-sharing-expanded:after {
  clear: both;
  content: "";
  display: block;
  overflow: hidden;
}

.hidden {
  display: none;
}

.track {
  overflow: scroll;
  position: relative;
  width: 1px;
  min-width: 100%;
}

.no-touch .track {
  overflow: hidden;
}

.widget-list {
  font-size: 0;
  margin: 0 auto;
  white-space: nowrap;
}

.tile,
.button {
  display: inline-block;
  background: white;
  overflow: hidden;
  font-size: 16px;
  line-height: 1.4;
  cursor: pointer;
  border: 1px solid #999999;
}

.button-wrapper {
  display: inline-block;
  height: 100%;
  width: 30px;
  height: 410px;
  margin-right: 10px;
}

.button {
  position: absolute;
  top: 50%;
  margin-top: -60px;
  height: 120px;
  width: 30px;
  opacity: 0.75;
}

.button:hover {
  opacity: 1;
}

.button:active {
  opacity: 0.5;
}

.button img {
  width: 100%;
}

.touch .button {
  opacity: 1;
}

/* Competition errors */
.competition-vote-message {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 95%;
  padding: 10px;
  margin-left: -48%;
  margin-top: -20%;
  color: red;
  background: #fff;
  border-radius: 10px;
  z-index: 999999;
  font-weight: 200;
  font-size: 66%;
}

.competition-vote-message-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 999998;
  background: #000;
  opacity: 0.7;
}

.competition-vote-message-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 999997;
}

/* Frameless tag */
.contains-tag-frameless .tile-user-info, .contains-tag-frameless .tile-timestamp, .contains-tag-frameless .tile-interactions {
  display: none;
}
.contains-tag-frameless .tile-content {
  height: 100%;
  margin: 0;
}
.contains-tag-frameless .tile-html {
  height: 100%;
  margin: 0;
  max-height: none;
  padding: 0;
}

/* Arrows Navigation */
.track-controller {
  background-color: #fff;
  border-radius: 50%;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
  box-sizing: border-box;
  color: #000000;
  cursor: pointer;
  font-size: 42px;
  font-weight: normal;
  line-height: 1;
  margin-top: -30px;
  opacity: 0.7;
  padding: 8px 10px;
  position: absolute;
  text-align: center;
  top: 37%;
  z-index: 9;
}
.track-controller.prev {
  left: 16px;
}
.track-controller.next {
  right: 16px;
}

.flip-vertical-right {
  animation: flip-vertical-right 1s cubic-bezier(0.455, 0.03, 0.515, 0.955) infinite alternate;
}

/* ----------------------------------------------
 * Generated by Animista on 2017-7-28 15:19:26
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */
/**
 * ----------------------------------------
 * animation flip-vertical-right
 * ----------------------------------------
 */
@keyframes flip-vertical-right {
  0% {
    transform: rotateY(0);
  }
  100% {
    transform: rotateY(180deg);
  }
}
.tile-interactions {
  position: relative;
}
.tile-interaction-like, .tile-interaction-dislike, .tile-interaction-vote, .tile-interaction-share, .tile-interaction-comment {
  float: left;
  margin-right: 4px;
}
.tile-interaction-link {
  border: solid 2px transparent;
  border-radius: 50%;
  display: inline-block;
  font-size: 18px;
  padding: 5px 9px;
}
.tile-interaction-link .fs {
  vertical-align: baseline;
  text-align: center;
}
.tile-interaction-link:first-child {
  margin-left: 0;
}
.tile-interaction-count {
  display: inline-block;
  font-weight: bold;
  vertical-align: baseline;
}
.tile-interaction-like {
  color: #a2c684;
}
.tile-interaction-like .tile-interaction-link:hover {
  border-color: #b6d899;
}
.tile-interaction-dislike {
  color: #ff7865;
}
.tile-interaction-dislike .tile-interaction-link:hover {
  border-color: #ffc1b9;
}
.tile-interaction-vote {
  color: #1d97d9;
}
.tile-interaction-vote .tile-interaction-link:hover {
  border-color: #97cbe2;
}
.tile-interaction-share .tile-interaction-link:hover {
  border-color: #b9b9b9;
}
.tile-interaction-comment {
  float: right;
}
.tile-interaction-comment .tile-interaction-link:hover {
  border-color: #aeaeae;
}
.tile-sharing-expanded {
  background: #fff;
  border: solid 1px #cfcfcf;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
  display: none;
  position: absolute;
  text-align: center;
  left: 0;
  right: 0;
  top: -5px;
}
.tile-sharing-expanded li {
  display: inline-block;
  float: left;
  margin: 3px 0 0 3px;
}
.tile-sharing-expanded li:last-child {
  float: right;
}
.tile-share-button {
  color: #fff;
  display: inline-block;
  font-size: 18px;
  padding: 9px 8px 8px;
}
.tile-share-button * {
  display: block;
}
.tile-share-close {
  display: inline-block;
  font-size: 18px;
  padding: 5px 10px 8px;
}
.tile-sharing-expanded {
  zoom: 1;
}
.tile-sharing-expanded:after {
  content: "";
  display: block;
  clear: both;
}
.tile-sharing-expanded .facebook {
  background: #3c5a96;
}
.tile-sharing-expanded .twitter {
  background: #5daee9;
}
.tile-sharing-expanded .pinterest {
  background: #bd081c;
}
.tile-sharing-expanded .gplus {
  background: #dd4b39;
}
.tile-sharing-expanded .linkedin {
  background: #0077b5;
}
.tile-sharing-expanded .email {
  background: #666666;
}

.tile-tags {
  color: #666;
  cursor: default;
  font-size: 13px;
  white-space: nowrap;
}

.tile-tag {
  border: solid 1px #e0e0e0;
  display: inline-block;
  margin-bottom: 3px;
  margin-right: 1px;
  padding: 4px 8px;
  text-decoration: none;
}
.tile-tag[href]:hover {
  text-decoration: underline;
}

.tile-source {
  font-size: 32px;
  line-height: 32px;
  margin-right: 8px;
  width: 32px;
}
.tile-source-twitter {
  color: #5dade7;
}
.tile-source-flickr {
  color: #29292c;
}
.tile-source-instagram {
  color: #262425;
}
.tile-source-sta_feed {
  color: #333;
}
.tile-source-gplus {
  color: #d94f3d;
}
.tile-source-rss {
  color: #fb7629;
}
.tile-source-youtube {
  color: #FF0000;
}
.tile-source-facebook {
  color: #395692;
}
.tile-source-livestream {
  color: #cf202e;
}
.tile-source-dailymotion {
  color: #0064dc;
}
.tile-source-wistia {
  color: #148ee1;
}

.tile-user-info {
  display: table;
}
.tile-user-info a {
  text-decoration: none;
}
.tile-user-info a:link, .tile-user-info a:visited {
  color: #666;
}
.tile-user-info a:hover {
  text-decoration: underline;
}
.tile-user-top, .tile-user-bottom {
  display: block;
  line-height: 1.2;
  width: 100%;
}
.tile-user-name, .tile-user-handle {
  font-weight: 400;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.clearfix, .tile-interactions, .tile-belt, .tile-sharing-expanded {
  zoom: 1;
}
.clearfix:after, .tile-interactions:after, .tile-belt:after, .tile-sharing-expanded:after {
  clear: both;
  content: "";
  display: block;
}

.icon {
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -16px;
  margin-top: -16px;
  width: 32px;
  height: 32px;
}

/* Tile */
.tile {
  cursor: pointer;
  font-weight: 300;
  position: relative;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.tile .hidden {
  display: none;
}
.tile.no-click-through, .tile.no-click-through > a {
  cursor: default;
}
.tile-content {
  position: relative;
  overflow: hidden;
  margin-bottom: 20px;
}
.tile-content > div:last-child {
  margin-bottom: 0;
}
.tile-image-wrapper, .tile-video-wrapper {
  overflow: hidden;
  position: relative;
}
.tile-video-wrapper, .tile-image-wrapper {
  margin-bottom: -36px;
  position: relative;
}
.sta_feed .tile-video-wrapper, .stackla .tile-video-wrapper, .sta_feed .tile-image-wrapper, .stackla .tile-image-wrapper {
  margin-bottom: 15px;
}
.tile-video-wrapper iframe, .tile-image {
  display: block;
  margin: 0 auto;
  z-index: 1;
}
.tile-image {
  height: auto;
  width: 100%;
}
.tile-image-loading, .tile-media-loading {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}
.tile-image-loading-icon, .tile-media-loading-icon {
  background: url(https://assetscdn.stackla.com/media/images/spinning-loading.gif) no-repeat;
  height: 16px;
  left: 50%;
  margin: -8px 0 0 -8px;
  position: absolute;
  top: 50%;
  width: 16px;
  background-size: contain;
}
.tile-video-icon {
  background: url(https://assetscdn.stackla.com/media/images/video-icon.png) no-repeat 0 0;
}
.tile-audio-icon {
  width: 32px;
  height: 32px;
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 50%;
  color: #fff;
  font-size: 18px;
  text-align: center;
  line-height: 28px;
}
.tile-avatar-wrapper {
  display: block;
  margin: 0 auto;
  position: relative;
  text-align: center;
  width: 100%;
}
.tile-avatar-link {
  display: inline-block;
  height: 56px;
  width: 56px;
}
.tile-avatar-placeholder, .tile-avatar-image {
  background-color: rgba(255, 255, 255, 0.5);
  border: solid 2px #fff;
  border-radius: 50%;
  display: inline-block;
  height: 52px;
  vertical-align: middle;
  width: 52px;
}
.tile-avatar-placeholder {
  display: inline-block;
  position: absolute;
}
.tile-avatar-placeholder img {
  border-radius: 50%;
  border: none;
  box-sizing: border-box;
  height: 100%;
  width: 100%;
}
.facebook .tile-avatar-placeholder {
  background: #39579a;
}
.twitter .tile-avatar-placeholder {
  background: #00abf0;
}
.gplus .tile-avatar-placeholder {
  background: #dd4b39;
}
.instagram .tile-avatar-placeholder {
  background: #80413c;
}
.stackla .tile-avatar-placeholder, .sta_feed .tile-avatar-placeholder {
  background: #75c237;
}
.rss .tile-avatar-placeholder {
  background: #ff6600;
}
.weibo .tile-avatar-placeholder {
  background: #e6162d;
}
.youtube .tile-avatar-placeholder {
  background: #d32325;
}
.pinterest .tile-avatar-placeholder {
  background: #c3090c;
}
.ecal .tile-avatar-placeholder {
  background: #1e8fcf;
}
.tumblr .tile-avatar-placeholder {
  background: #45556b;
}
.flickr .tile-avatar-placeholder {
  background: #ed1e83;
}
.wordpress .tile-avatar-placeholder {
  background: #21759B;
}
.tile-belt {
  margin-bottom: 15px;
}
.tile-title {
  margin-bottom: 15px;
}
.tile-caption, .tile-html {
  color: #333;
  font-weight: 400;
  margin-bottom: 15px;
  overflow: hidden;
  word-wrap: break-word;
}
.tile-caption .emoji, .tile-html .emoji {
  vertical-align: middle;
}
.tile-emoji {
  margin-right: 2px;
  vertical-align: middle;
  width: 13px;
}
.tile-claim {
  padding-bottom: 8px;
  text-align: center;
}
.tile-claim-link {
  font-size: 16px;
}
.tile-claim-link:link, .tile-claim-link:visited {
  color: #00abf0;
  font-weight: 400;
}
.tile-claim-link:hover {
  text-decoration: underline;
}
.claimed .tile-claim-link {
  color: #ccc;
  font-style: italic;
}
.tile-twitter-intent {
  text-align: center;
}
.tile-twitter-intent + div {
  border-top: dotted 1px #eee;
  padding-top: 10px;
  margin-top: 10px;
}
.tile-twitter-intent a {
  display: inline-block;
  font-size: 18px;
  margin-left: 24px;
}
.tile-twitter-intent a:first-child {
  margin-left: 0;
}
.tile-twitter-intent a:link, .tile-twitter-intent a:visited {
  color: #c4c4c4;
}
.tile-twitter-intent a:hover {
  color: #00abf0;
}
.tile-twitter-intent a .js-like-count,
.tile-twitter-intent a .js-dislike-count {
  position: absolute;
}

.tile.html {
  padding: 0;
}

.tile iframe {
  display: block;
}

.tile-custom-clickthru {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}

.tile-official-star {
  position: absolute;
  top: 0;
  right: 0;
  color: #ffcc00 !important;
  font-size: 18px;
}

.tile-title {
  font-weight: bold;
  font-size: 20px;
  color: #333;
  max-height: 80px;
  overflow: hidden;
}

.anonymous .tile-image-wrapper,
.anonymous .tile-video-wrapper,
.content-only .tile-image-wrapper,
.content-only .tile-video-wrapper {
  margin-top: 0;
}

.vine-overlay {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
}

.vine-embed {
  width: 100%;
}

.stackla .tile-html {
  max-height: none;
}

.tile-caption .stackla-icon-reply {
  color: #999;
}

.tile-html {
  background: #eee;
  padding: 8px;
}

.stackla .tile-html {
  margin: 0;
  padding: 0;
  background: none;
}

.tile-caption a,
.tile-html a,
.ecal-url a {
  color: #00abf0;
}

.tile-caption a:hover,
.tile-html a:hover {
  text-decoration: underline;
}

.tile-ecal {
  padding: 0 8px;
}

.tile-ecal li {
  position: relative;
  margin: 0 20px;
  padding: 2px 0;
  list-style: none;
  border-top: 1px dotted #ccc;
}

.tile-ecal li:first-child {
  border: none;
}

.ecal-url {
  text-align: center;
}

.tile-ecal i {
  position: absolute;
  top: 3px;
  left: -20px;
  width: 20px;
  text-align: center;
}

.competition-vote-message {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 80%;
  padding: 10px;
  margin-left: -40%;
  margin-top: -20%;
  color: red;
  background: #fff;
  border-radius: 10px;
  z-index: 999999;
  font-size: 11px;
}

.competition-vote-message-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 999998;
  background: #000;
  opacity: 0.7;
}

.competition-vote-message-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 999997;
}

.tile {
  border: solid 1px #e5e5e5;
  border-width: 0 0 0 1px;
  height: 410px;
  vertical-align: top;
  position: relative;
}
.tile:first-child {
  border-left: none;
}
.tile-content {
  margin: 0;
  width: 306px;
}
.text .tile-content > div:last-child {
  margin-bottom: 20px;
}
.tile-audio-wrapper, .tile-video-wrapper, .tile-image-wrapper {
  background: #000;
  height: 306px;
  overflow: hidden;
}
.tile-audio-wrapper iframe, .tile-video-wrapper iframe, .tile-image-wrapper iframe {
  width: 306px;
  height: 306px;
}
.tile-youtube-wrapper {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 10;
  background: #000;
}
.tile-youtube-wrapper iframe {
  width: 306px;
  height: 306px;
}
.tile-youtube-close {
  margin: 20px auto;
  text-align: center;
  color: #ccc;
  cursor: pointer;
  width: 6em;
  padding: 10px 0;
  font-size: 20px;
}
.tile-video-icon-wrapper, .tile-audio-icon-wrapper {
  align-items: center;
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 50%;
  color: #fff;
  display: flex;
  font-size: 18px;
  height: 32px;
  left: 50%;
  padding: 2px;
  position: absolute;
  top: 50%;
  transform: translate3d(-50%, -50%, 0);
  width: 32px;
}
.tile-video-icon, .tile-audio-icon {
  background-color: transparent;
  width: auto;
  height: auto;
  line-height: 0;
  border-radius: none;
  margin: 0 auto;
}
.tile-video-icon {
  font-size: 35px;
}
.tile-avatar-wrapper {
  z-index: 2;
  min-height: 42px;
}
.tile-avatar-wrapper:first-child {
  padding: 5px 0;
}
.audio .tile-belt, .image .tile-belt, .video .tile-belt {
  margin-bottom: 5px;
}
.tile-source {
  float: left;
}
.tile-timestamp {
  float: right;
  font-size: 13px;
}
.audio .tile-title, .image .tile-title, .video .tile-title {
  color: #fff;
}
.tile-caption .tile-message, .tile-html .tile-message {
  font-size: 17px;
  line-height: 1.5;
  white-space: normal;
}
.audio .tile-caption .tile-message, .image .tile-caption .tile-message, .video .tile-caption .tile-message, .audio .tile-html .tile-message, .image .tile-html .tile-message, .video .tile-html .tile-message {
  color: #fff;
}
.tile-html {
  background: transparent;
}
.tile-emoji {
  width: 17px;
}
.audio .tile-details, .image .tile-details, .video .tile-details {
  background: rgba(0, 0, 0, 0.8);
  box-sizing: border-box;
  height: 306px;
  left: 0;
  opacity: 0;
  padding: 20px;
  position: absolute;
  right: 0;
  top: 0;
  transition: opacity 0.5s;
  z-index: 1;
}
.tile.audio:hover .tile-details, .tile.image:hover .tile-details, .tile.video:hover .tile-details {
  opacity: 1;
}
.tile-tags a {
  border: solid 1px #ccc;
  color: #ccc;
  font-size: 13px;
  padding: 1px 6px;
  margin-bottom: 15px;
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
}
.tile-interactions {
  margin-bottom: 15px;
}
.tile.audio .tile-interaction-comment, .tile.image .tile-interaction-comment, .tile.video .tile-interaction-comment {
  color: #fff;
}

.tile-shopspot {
  background: rgba(255, 255, 255, 0.8);
  border-radius: 50%;
  line-height: 0;
  margin-left: -10px;
  margin-top: -10px;
  padding: 5px;
  position: absolute;
}
.tile-shopspot-icon {
  background: #0198cf;
  border-radius: 50%;
  height: 20px;
  width: 20px;
}
.tile-shopspot-icon:before {
  display: none;
}

.stackla-watermark-tile {
  background: #404040;
  box-sizing: border-box;
  font-size: 24px;
  height: 100%;
  padding: 41% 20%;
}
.stackla-watermark-tile:before {
  content: "";
  vertical-align: middle;
  display: inline-block;
  height: 100%;
}

.stackla-watermark-content {
  background-image: url(/media/svg/powered-by-stackla.svg?ts=1445906014);
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: center center;
  color: transparent;
  display: inline-block;
  margin: 0;
  margin-top: -4%;
  overflow: hidden;
  padding: 17% 0;
  position: relative;
  vertical-align: middle;
  width: 100%;
}
.stackla-watermark-content span {
  position: absolute;
  top: -9999em;
  left: -9999em;
  display: inline-block;
  height: 0;
  width: 0;
}