<p>Grid (5 columns):</p>

<div class="o-partners1 row">
	<div class="o-partners1__column col-12 col-sm-8 col-md">
		<a href="#">
			<img src="https://placehold.it/300x190/" width="300" height="190" loading="lazy" alt="Company Logo">
		</a>
	</div>
	<div class="o-partners1__column col-12 col-sm-8 col-md">
		<a href="#" target="_blank">
			<img src="https://placehold.it/300x190/" width="300" height="190" loading="lazy" alt="Company Logo">
		</a>
	</div>
	<div class="o-partners1__column col-12 col-sm-8 col-md">
		<a href="#" target="_blank">
			<img src="https://placehold.it/300x190/" width="300" height="190" loading="lazy" alt="Company Logo">
		</a>
	</div>
	<div class="o-partners1__column col-12 col-sm-8 col-md">
		<a href="#" target="_blank">
			<img src="https://placehold.it/300x190/" width="300" height="190" loading="lazy" alt="Company Logo">
		</a>
	</div>
	<div class="o-partners1__column col-12 col-sm-8 col-md">
		<a href="#" target="_blank">
			<img src="https://placehold.it/300x190/" width="300" height="190" loading="lazy" alt="Company Logo">
		</a>
	</div>
</div>

<p>
	Carousel:<br>
	<small>(for 5 columns grid use custom class '.o-partners1__column' with 'flex-basis' and 'width' property)</small>
</p>

<div data-carousel-options='{"disable_arrows":true,"disable_dots":true}' class="o-carousel jq_partners1">
	<div class="row">
		<div data-carousel="wrap" class="o-carousel__wrap col-24 px-0">
			<div data-carousel="stage" class="o-carousel__stage row">
				<div class="o-carousel__item col-24 col-sm-8 col-md-4 o-partners1__column">
					<a href="#">
						<img src="https://placehold.it/300x190/" width="300" height="190" loading="lazy" alt="Company Logo">
					</a>
				</div>
				<div class="o-carousel__item col-24 col-sm-8 col-md-4 o-partners1__column">
					<a href="#" target="_blank">
						<img src="https://placehold.it/300x190/" width="300" height="190" loading="lazy" alt="Company Logo">
					</a>
				</div>
				<div class="o-carousel__item col-24 col-sm-8 col-md-4 o-partners1__column">
					<a href="#" target="_blank">
						<img src="https://placehold.it/300x190/" width="300" height="190" loading="lazy" alt="Company Logo">
					</a>
				</div>
				<div class="o-carousel__item col-24 col-sm-8 col-md-4 o-partners1__column">
					<a href="#" target="_blank">
						<img src="https://placehold.it/300x190/" width="300" height="190" loading="lazy" alt="Company Logo">
					</a>
				</div>
				<div class="o-carousel__item col-24 col-sm-8 col-md-4 o-partners1__column">
					<a href="#" target="_blank">
						<img src="https://placehold.it/300x190/" width="300" height="190" loading="lazy" alt="Company Logo">
					</a>
				</div>
				<div class="o-carousel__item col-24 col-sm-8 col-md-4 o-partners1__column">
					<a href="#" target="_blank">
						<img src="https://placehold.it/300x190/" width="300" height="190" loading="lazy" alt="Company Logo">
					</a>
				</div>
			</div>
		</div>
	</div>
</div>

@import "organisms/carousel/index";

import $ from 'jquery';

import 'js-src/common/carousel';

$(() => {
	$('.jq_partners1').defaultCarousel({
		disable_dots: true
	});
});