<!DOCTYPE html>
<html lang="en">
<head>
  
  <!--  Meta  -->
  <meta charset="UTF-8" />
  <title>My New Pen!</title>
  
  <!--  Styles  -->
	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css">
	<link rel="stylesheet" href="http://kenwheeler.github.io/slick/slick/slick-theme.css">
  <link rel="stylesheet" href="styles/index.processed.css">
</head>
<body>
  
<div class="container">
	<div class="carousel__inner">
                    <div class="carousel__inner_wrapper">
                        <img src="https://cdn3.savepice.ru/uploads/2019/9/20/6d41ed8551980a15df0f341aff692a13-full.png" alt="reviews_1" class="carousel__inner_image">
                        <h3 class="carousel__inner_title">Анисимова Ольга</h3>
                        <!-- /.carousel__inner_title -->
                        <p class="carousel__inner_text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Omnis ducimus culpa animi! Aliquid, quae suscipit odio unde quaerat omnis dolorum aliquam laboriosam numquam magnam, sit ex facilis soluta reiciendis modi!</p>
                        <!-- /.carousel__inner_text -->
                    </div>
                    <div class="carousel__inner_wrapper">
                        <img src="https://cdn3.savepice.ru/uploads/2019/9/20/6d41ed8551980a15df0f341aff692a13-full.png" alt="reviews_2" class="carousel__inner_image">
                        <h3 class="carousel__inner_title">Анисимова Оксана</h3>
                        <!-- /.carousel__inner_title -->
                        <p class="carousel__inner_text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Illo officiis cum, corporis voluptatum pariatur ut incidunt debitis eveniet, est expedita consequuntur eos! Dolorem amet doloribus labore. Quam velit cumque sunt!</p>
                        <!-- /.carousel__inner_text -->
                    </div>
                    <div class="carousel__inner_wrapper">
                        <img src="https://cdn3.savepice.ru/uploads/2019/9/20/6d41ed8551980a15df0f341aff692a13-full.png" alt="reviews_3" class="carousel__inner_image">
                        <h3 class="carousel__inner_title">Анисимова Ольга</h3>
                        <!-- /.carousel__inner_title -->
                        <p class="carousel__inner_text">Хочу рассказать о компании Global Opt. Самое главное что меня радует, это быстрый поиск и анализ определенного товара. Доставляла через компанию уже много раз, от расходных материалов для отеля, ло дольших партий детской одежды. Буду продолжать пользтваьбся услугами даной компании</p>
                        <!-- /.carousel__inner_text -->
                    </div>
                </div>
                <!-- /.carousel__inner -->
	</div>
  
  <!-- Scripts -->
	 <script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script>
   <script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
   <script src="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>
  <script src="scripts/index.js"></script>
</body>
</html>
/**
 * index.scss
 * - Add any styles you want here!
 */

body {
  background: #f5f5f5;
}

.container {
	width: 1140px;
}

.carousel__inner {
    margin: 0 auto;
    text-align: center;
    &_wrapper {
      max-width: 580px;
    }
    &_image {
      margin: 0 auto;
      padding-bottom: 20px;
    }
  }
  .slick-slide {
    font-size: 9px;
    width: 361px;
    height: 145px;
    opacity: 0.3;
    margin: 50px 0;
    img {
      width: 80px;
      height: 80px;
    }
  }
  .slick-active {
    width:749px;
    height: 354px;
    font-size: 14px;
    margin: 0 40px;
    opacity: 1;
		transition: all 0.9s; 
    img {
      width: 114px;
      height: 114px;
      
    }
  

 
}
View Compiled
$(document).ready(function(){
  $('.carousel__inner').slick({
    centerMode: true,
    centerPadding: '60px',
    slidesToShow: 1,
    slidesToScroll: 1,
    variableWidth: true
  });
});

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.