$(function() {

  // vars for clients list carousel

  // http://stackoverflow.com/questions/6759494/jquery-function-definition-in-a-carousel-script

  var $clientcarousel = $('#clients-list');

  var clients = $clientcarousel.children().length;

  var clientwidth = (clients * 220); // 140px width for each client item 

  $clientcarousel.css('width', clientwidth);



  var rotating = true;

  var clientspeed = 0;

  var seeclients = setInterval(rotateClients, clientspeed);



  $(document).on({

    mouseenter: function() {

      rotating = false; // turn off rotation when hovering

    },

    mouseleave: function() {

      rotating = true;

    }

  }, '#clients');



  function rotateClients() {

    if (rotating != false) {

      var $first = $('#clients-list li:first');

      $first.animate({

        'margin-left': '-220px'

      }, 2000, function() {

        $first.remove().css({

          'margin-left': '0px'

        });

        $('#clients-list li:last').after($first);

      });

    }

  }

});

/*Logo carousel*/



#clients {

  display: block;

  margin-left: auto;

  margin-right: auto;

}

#clients .clients-wrap {

  display: block;

  width: 95%;

  margin: 0 auto;

  overflow: hidden;

}

#clients .clients-wrap ul {

  display: block;

  list-style: none;

  position: relative;

  margin-left: auto;

  margin-right: auto;

}

#clients .clients-wrap ul li {

  display: block;

  float: left;

  position: relative;

  width: 220px;

  height: 100px;

  line-height: 100px;

  text-align: center;

}

#clients .clients-wrap ul li img {

  vertical-align: middle;

  max-width: 100%;

  max-height: 100%;

  -webkit-transition: 0 linear left;

  -moz-transition: 0 linear left;

  transition: 0 linear left;

  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=65);

  filter: alpha(opacity=65);

  opacity: 0.65;

}

#clients .clients-wrap ul li img:hover {

  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);

  filter: alpha(opacity=100);

  opacity: 1.0;

}

<script src=https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js></script>

<div id=clients>

  <div class=clients-wrap>

    <ul id=clients-list class=clearfix>

      <li>

        <img src=images/logos/BlaceAce-grayscale.png alt=Black Ace>

      </li>

      <li>

        <img src=images/logos/WBPN-grayscale.png alt=First State Bank>

      </li>

      <li>

        <img src=images/logos/CA-grayscale.png alt=Custom Aire>

      </li>

      <li>

        <img src=images/logos/GVAH-grayscale.png alt=First State Bank>

      </li>

      <li>

        <img src=images/logos/DM-grayscale.png alt=Dakota Molding>

      </li>

      <li>

        <img src=images/logos/DP-grayscale.png alt=Dakota Peat>

      </li>

      <li>

        <img src=images/logos/IH-grayscale.png alt=First State Bank>

      </li>

      <li>

        <img src=images/logos/EBC-grayscale.png alt=Eastbay Campground>

      </li>

      <li>

        <img src=images/logos/NDTC-grayscale.png alt=First State Bank>

      </li>

      <li>

        <img src=images/logos/Nutrena-grayscale.png alt=First State Bank>

      </li>

      <li>

        <img src=images/logos/NWB-grayscale.png alt=First State Bank>

      </li>

      <li>

        <img src=images/logos/RHS-grayscale.png alt=First State Bank>

      </li>

      <li>

        <img src=images/logos/Sertoma-grayscale.png alt=First State Bank>

      </li>

      <li>

        <img src=images/logos/FSB-grayscale.png alt=First State Bank>

      </li>

      <li>

        <img src=images/logos/TM-grayscale.png alt=First State Bank>

      </li>

      <li>

        <img src=images/logos/TP-grayscale.png alt=First State Bank>

      </li>

      <li>

        <img src=images/logos/UC-TMC-grayscale.png alt=First State Bank>

      </li>

      <li>

        <img src=images/logos/Vilandre-grayscale.png alt=First State Bank>

      </li>

    </ul>

  </div>

  <!-- @end .clients-wrap -->

</div>

<!-- @end #clients -->