@charset "UTF-8";
/* larger canvas, spectrum + EQ visualization and other items */
.ui360-vis,
.ui360-vis .sm2-360ui,
.sm2-inline-list .ui360-vis {
  /* size of the container for the circle, etc. */
  width: 360px;
  height: 360px;
}

.ui360-vis {
  position: relative;
  /* a little extra spacing */
  padding-top: 1px;
  padding-bottom: 1px;
  padding-left: 340px;
  margin: 0 auto;
  background-position: 22.6% 50%;
}

.sm2-inline-list .ui360-vis {
  cursor: pointer;
}

.ui360-vis a {
  font: 14px "helvetica neue", helvetica, monaco, lucida, terminal, monospace;
  white-space: nowrap;
  text-indent: 0px;
  /* undo inline style */
  top: 46%;
  /* ehh. */
}

.sm2-inline-list .ui360-vis a {
  line-height: 360px;
  top: auto;
}

.ui360-vis .sm2-360ui {
  margin-left: -360px;
}

.ui360-vis .sm2-timing {
  font: bold 24px "helvetica neue", helvetica, monaco, lucida, terminal, monospace;
  color: inherit !important;
  text-align: center;
  line-height: 360px;
  text-indent: 0px;
}

.sm2-inline-list .ui360-vis,
.sm2-inline-list .ui360-vis .sm2-360ui {
  margin-left: 0px;
}

.sm2-inline-list .ui360-vis {
  margin: 8px 13px 7px 0px;
  padding-left: 0px;
  background-position: 50% 50%;
  /* initial play button position */
}

.sm2-inline-list .ui360-vis .sm2-360ui {
  border: 1px solid #eee;
  /* offset the border */
  margin-left: -1px;
  margin-top: -1px;
}

.sm2-inline-list .ui360-vis a {
  position: absolute;
  display: inline;
  left: 0px;
  bottom: 0px;
  top: 1px;
  width: 100%;
  /* 2px padding in box */
  height: 99%;
  /* dumb vertical hack */
  *height: 360px;
  /* IE is dumb. */
  overflow: hidden;
  font-size: small;
  font-weight: 300;
  color: #333;
  margin: 0px;
  padding: 0px;
  line-height: 488px;
  /* bottom vertical alignment for text */
  *line-height: 480px;
  /* IE again */
  text-align: center;
  border-radius: 0px;
}

.sm2-inline-list .ui360 a:hover {
  background-color: transparent;
  /* reset */
}

.sm2-inline-list .ui360-vis:hover .sm2-360ui,
.sm2-inline-list .ui360-vis a.sm2_link:hover,
.sm2-inline-list .ui360-vis a.sm2_link:active,
.sm2-inline-list .ui360-vis a.sm2_link:focus {
  background-color: transparent;
}

/* Use a bigger loading image for this layout */
.ui360-vis .sm2-360btn,
.ui360-vis .sm2-360ui.sm2_paused .sm2-360btn,
.ui360-vis .sm2-360ui.sm2_playing .sm2-360btn {
  width: 100px;
  height: 100px;
  margin-left: -50px;
  margin-top: -50px;
  border-radius: none;
  text-align: center;
}

.ui360-vis {
  cursor: pointer;
}

.ui360-vis .sm2-360ui.sm2_paused .sm2-360btn,
.ui360-vis .sm2-360btn-default,
.ui360-vis:hover .sm2-360btn,
.ui360-vis .sm2-360btn-default:hover,
.ui360-vis .sm2-360ui.sm2_paused .sm2-360btn:hover,
.ui360-vis .sm2-360ui.sm2_playing .sm2-360btn:hover,
.ui360-vis .sm2-360btn-playing:hover {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  cursor: pointer;
  font-size: 100px;
}

.ui360-vis .sm2-360ui.sm2_paused .sm2-360btn::after,
.ui360-vis .sm2-360btn-default::after {
  content: "";
}

.ui360-vis:hover .sm2-360btn::after,
.ui360-vis .sm2-360btn-default:hover::after,
.ui360-vis .sm2-360ui.sm2_paused .sm2-360btn:hover::after {
  content: "";
}

.ui360-vis .sm2-360ui.sm2_playing .sm2-360btn:hover::after,
.ui360-vis .sm2-360btn-playing:hover::after {
  content: "";
}

.ui360-vis {
  /* non-JS / before-loaded state */
  background-position: 21% 50%;
}

.ui360-vis .sm2-360btn-default {
  /* real button, post-loaded state */
}
.ui360-vis .sm2-360btn-default::after {
  content: "";
}

.ui360-vis .sm2-360ui.sm2_dragging .sm2-360btn {
  visibility: hidden;
}

.ui360 .sm2-360ui.sm2_playing .sm2-360btn,
.ui360 .sm2-360ui.sm2_dragging .sm2-360btn,
.ui360 .sm2-360ui.sm2_dragging .sm2-360btn:hover,
.ui360 .sm2-360ui.sm2_dragging .sm2-360btn-playing:hover {
  /* don't let pause button show on hover when dragging (or paused and dragging) */
  background: transparent;
  cursor: auto;
}
.ui360 .sm2-360ui.sm2_playing .sm2-360btn::after,
.ui360 .sm2-360ui.sm2_dragging .sm2-360btn::after,
.ui360 .sm2-360ui.sm2_dragging .sm2-360btn:hover::after,
.ui360 .sm2-360ui.sm2_dragging .sm2-360btn-playing:hover::after {
  content: " ";
}

.ui360 .sm2-360ui::after {
/*    background-color: rgba(255,255,255,0.15); */
    background-color: transparent;
    box-sizing: border-box;
    border-color: #8c9195;
    z-index: 0;
}
.ui360 .sm2-360ui.sm2_playing::after,.ui360 .sm2-360ui.sm2_paused::after {
    z-index: -1;
}