.pull-left {
  float: left; }

.pull-right {
  float: right; }

.text-left {
  text-align: left; }

.text-right {
  text-align: right; }

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

.clearfix {
  clear: both; }

.hidden {
  display: none; }

.table {
  display: table; }

.table-row {
  display: table-row; }

.table-cell {
  display: table-cell; }

.container > .content {
  margin-top: 204px; }

.mask {
  height: 228px; }

.reel-container {
  position: relative;
  width: 100%;
  max-width: 864px; }
  .reel-container .header {
    position: fixed;
    width: 100%;
    height: 48px;
    margin-top: -48px;
    z-index: 2; }
    .reel-container .header h3 {
      margin: 0;
      font-size: 14.5px;
      color: #CED0D0; }
      .reel-container .header h3 .arrow-container {
        position: absolute;
        top: 10px;
        left: 478px; }
        .reel-container .header h3 .arrow-container a:last-child {
          margin-left: 30px; }
    .reel-container .header .tags {
      display: inline-block; }
  .reel-container .content-container .left-container {
    position: fixed;
    margin-right: 24px; }
    .reel-container .content-container .left-container .video {
      position: relative; }
      .reel-container .content-container .left-container .video iframe {
        position: absolute;
        z-index: 0 !important;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%; }
      .reel-container .content-container .left-container .video img {
        width: 100%;
        height: auto; }
    .reel-container .content-container .left-container .video, .reel-container .content-container .left-container .slider {
      width: 552px;
      height: 310px;
      background: #CED0D0; }
  .reel-container .content-container .right-container {
    margin-left: 576px; }
    .reel-container .content-container .right-container .content > p:first-child {
      margin-top: 0; }
    .reel-container .content-container .right-container .content a {
      color: #CED0D0; }
    .reel-container .content-container .right-container .content a:hover {
      background: #CED0D0;
      color: #121518; }
    .reel-container .content-container .right-container .share {
      cursor: pointer;
      font-size: 14.5px;
      color: #CED0D0;
      margin-top: 24px; }

@media screen and (min-width: 1177px) {
  .mask {
    height: 252px; } }

@media screen and (max-width: 768px) {
  .mask {
    height: 93px; }
  .container > .content {
    margin-top: 156px; }
  .reel-container {
    width: 100%; }
    .reel-container .header {
      position: relative;
      margin-top: 0;
      z-index: 0; }
    .reel-container .content-container .left-container {
      width: 100%;
      float: none;
      position: relative; }
      .reel-container .content-container .left-container .video {
        width: 100%;
        height: auto; }
      .reel-container .content-container .left-container iframe {
        width: 100%;
        height: auto; }
    .reel-container .content-container .right-container {
      margin-left: 0;
      margin-top: 24px; } }

@media screen and (max-width: 480px) {
  .container > .content {
    margin-top: 84px; }
  .mask {
    height: 96px; } }