/* default styles for extension "tx_mpcontent_pi1" */

    /* standard css for infinite carousel */
    .infiniteCarousel {
      width: 455px;
      position: relative;
    }

    .infiniteCarousel .wrapper {
      width: 375px; /* .infiniteCarousel width - (.wrapper margin-left + .wrapper margin-right) */
      overflow: auto;
      height: 125px; /* imageheight + li padding top + li padding bottom + img border top + img border bottom */
      margin: 0 40px;
      position: absolute;
      top: 0;
    }

    .infiniteCarousel ul a img {
      border: 5px solid #000;
      -moz-border-radius: 5px;
      -webkit-border-radius: 5px;
    }

    .infiniteCarousel .wrapper ul {
      width: 840px; /* single item * n */
      list-style-image:none;
      list-style-position:outside;
      list-style-type:none;
      margin:0;
      padding:0;
      position: absolute;
      top: 0;
    }

    .infiniteCarousel ul li {
      display:block;
      float:left;
      padding: 5px;
      height: 115px; /* imageheight + (padding top + padding bottom) */
      width: 115px; /* imagewidth + (padding left + padding right) */
    }

      .infiniteCarousel ul li img {
        -webkit-transition: border-color 400ms;
      }

      .infiniteCarousel ul:hover li img {
        border-color: #000;
      }

      .infiniteCarousel ul:hover li:hover img {
        border-color: #333;
      }

      .infiniteCarousel ul li a img {
        display: block;
      }

    .infiniteCarousel .arrow {
      display: block;
      height: 36px;
      width: 37px;
      background: url(../../../typo3conf/ext/mp_content/res/slide_carousel_arrows.png) no-repeat 0 0;
      text-indent: -999px;
      position: absolute;
      top: 37px;
      cursor: pointer;
      outline: 0;
    }

      .infiniteCarousel .forward {
        background-position: 0 0;
        right: 0;
      }

      .infiniteCarousel .back {
        background-position: 0 -72px;
        left: 0;
      }

      .infiniteCarousel .forward:hover {
        background-position: 0 -36px;
      }

      .infiniteCarousel .back:hover {
        background-position: 0 -108px;
      }
