@import 'topcoder/tc-includes';

$pager-bg-color: #737380;

.Carousel {
  display: flex;
  flex-direction: row;

  .page-down {
    width: 20px;
    margin-right: 15px;
    background-color: $pager-bg-color;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;

    &.hidden {
      display: none;
    }
  }

  .page-up {
    width: 20px;
    background-color: $pager-bg-color;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;

    &.hidden {
      display: none;
    }
  }

  .visible-area {
    display: flex;
    flex-direction: row;
    overflow: hidden;

    .carousel-item:not(:first-child) {
      margin-left: 30px;
    }
  }
}