.tt-logo-list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(165px, 1fr));
	justify-content: space-between;
	grid-gap: 25px;
	justify-items: center;
	margin: 0;
	padding: 0;
	list-style: none;

	li {
		width: 100%;
	}

	&.style_one {
		.tt-logo-list__item {
			box-shadow: rgba(13, 21, 55, 0.06) 0 5px 50px;
			background-color: #fff;
		}
	}

	&.style_two {
		.tt-logo-list__item {
			img {
				max-width: 160px;
			}
		}
	}

	&__item {
		display: block;
		margin: auto;
		text-align: center;
		padding: 20px;
		border-radius: 6px;
		transition: all 0.3s ease;
	}

	&__brand-name {
		font-weight: 600;
		font-size: 15px;
		margin-bottom: 0;
		margin-top: 16px;
	}

	&.column__three {
		grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

		@media(max-width: 991px) {
			grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
		}

		@media(max-width: 768px) {
			grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
		}
	}

	&.column__four {
		grid-template-columns: repeat(auto-fit, minmax(215px, 1fr));

		@media(max-width: 1200px) {
			grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
		}

		@media(max-width: 991px) {
			grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
		}

		@media(max-width: 768px) {
			grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
		}
	}

	&.column__five {
		grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));

		@media(max-width: 1200px) {
			grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
		}

		@media(max-width: 991px) {
			grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
		}

		@media(max-width: 768px) {
			grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
		}
	}
}

.tt-logo-list-two {
	margin: 0;
	padding: 0;
	list-style: none;
	max-width: 305px;
	width: 100%;

	li {
		position: relative;
		height: 65px;
		width: 65px;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 50%;
		box-shadow: 5px 10px 20px 0 rgba(55, 65, 81, 0.12);

		&:nth-child(1) {
			margin-left: 73px;
		}

		&:nth-child(2) {
			margin-left: auto;
			right: 28px;
			margin-top: -20px;
		}

		&:nth-child(3) {
			left: 0;
			margin-top: 20px;
		}

		&:nth-child(4) {
			margin-left: auto;
			right: 45px;
		}

		&:nth-child(5) {
			left: 40px;
			margin-top: 30px;
		}

		&:nth-child(6) {
			margin-left: auto;
			margin-right: 0;
			margin-top: -30px;
		}
	}

	&.align-right {
		margin-left: auto;

		li {
			&:nth-child(1) {
				margin-left: auto;
				right: 70px;
			}

			&:nth-child(2) {
				margin-left: 65px;
			}

			&:nth-child(3) {
				margin-left: auto;
			}

			&:nth-child(4) {
				margin-left: 100px;
			}

			&:nth-child(5) {
				margin-left: auto;
				right: 40px;
				left: auto;
			}

			&:nth-child(6) {
				margin-left: 0;

			}
		}
	}

	&.align-center {
		margin: 0 auto;

		li {
			&:nth-child(1) {
				margin: 0 auto;
			}

			&:nth-child(2) {
				margin-left: auto;
				right: 0;
				margin-top: 20px;
			}

			&:nth-child(3) {
				left: 0;
				margin-top: 20px;
			}

			&:nth-child(4) {
				margin-left: auto;
				right: 0;
			}

			&:nth-child(5) {
				left: 0;
				margin-top: 0;
			}

			&:nth-child(6) {
				margin: 20px auto 0;
			}
		}
	}
}