/* LAYOUT */
@media only screen and (min-width: 1024px) {
	.cb-product-moodboard {
		margin-top: 2em;
		margin-bottom: 2em;
	}
	.cb-moodboard .swiper,
	.cb-product-moodboard.swiper {
		padding-bottom: 2em;
		max-width: 1440px;
	}
	.cb-moodboard-wrapper {
	/* 	max-width: 1440px; */
	/* 	grid-column-gap: 4em; */
		margin: auto;
		display: flex;
		flex-flow: column wrap;
	}
	.cb-moodboard-wrapper.swiper-wrapper {
		height: 80vh;
	}

	/* Linke Spalte */
	.cb-product-moodboard .swiper-slide:nth-child(1) {
		width: 40%;
		margin-right: 5%;
		flex-shrink: 0;
	}
	.cb-product-moodboard .swiper-slide:nth-child(2) {
		width: 55%;
		flex-shrink: 0;
		height: 40%;
	}
	.cb-product-moodboard .swiper-slide:nth-child(3) {
		width: 55%;
		flex-shrink: 0;
		height: 60%;
		padding-top: 5.5vh;
		padding-bottom: 8vh;
	}

	.swiper-slide .cb-moodboard-col-1 {
		height: 100%;
		background-size: cover;
		background-position: center;
	}
	.cb-moodboard-col-2 { /* Wird das überhaupt benutzt? */
		display: flex;
		flex-basis: 60%;
		flex-flow: column;
		align-items: flex-end;
	}
	.cb-moodboard-col-2-a {
		height: 100%;
		width: 60%;
		background-size: cover;
		background-position: center;
		margin-bottom: 4.5%;
		margin-right: 3%;
		float: right;
	}
	.cb-moodboard-col-2-b {
		height: 100%;
		width: 55%%;
		background-size: cover;
		background-position: center;
	}
}

/* BUTTON */
.cb-moodboard-button a {
	border: 1px solid var(--black);
	padding: 1em 4em;
    color: var(--black);
    text-transform: uppercase;
	font-weight: bold;
	display: block;
	width: 30%;
	margin-left: auto;
	margin-right: auto;
}
.cb-moodboard-button a:hover {
	color: var(--red);
	transition: all ease-in-out 0.3s;
}
.cb-moodboard-button {
	font-family: 'Tertre';
	text-align: center;
	margin-top: 3em;
	margin-bottom: 4em;
}

@media only screen and (max-width: 1440px) {
	.cb-moodboard .swiper, 
	.cb-product-moodboard.swiper {
		padding-left: 3em;
		padding-right: 3em;
	}
}

@media only screen and (max-width: 786px) {
	.cb-moodboard .swiper,
	.cb-product-moodboard.swiper {
		width: 100%;
		text-align: center;
		padding-left: 1em;
		padding-right: 1em;
	}
	.swiper-slide .cb-moodboard-col-1 {
		margin-left: 0;
		width: auto;
		height: 420px;
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center;
	}
	.swiper-slide .cb-moodboard-col-2-a {
		height: 420px;
		width: auto;
		position: static;
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center;
	}
	.swiper-slide .cb-moodboard-col-2-b {
		position: static;
		height: 420px;
		width: auto;
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center;
	}
	.cb-moodboard-wrapper {
		grid-column-gap: 0;
	}
	
	.cb-moodboard .swiper-container-horizontal>.swiper-pagination-bullets,
	.cb-product-moodboard.swiper-container-horizontal>.swiper-pagination-bullets{
		bottom:0;
		top: 24.5em;
	}
	.cb-moodboard .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,
	.cb-product-moodboard.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{
		border-radius: 0;
		padding: 1px 20px;
		margin: 0 6px;
		background: var(--white);
		opacity: unset;
	}
	.cb-moodboard .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active,
	.cb-product-moodboard.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active {
		background: var(--black);
	}
	.cb-pdp-thumbnail-gallery.swiper {
		width: 350px;
	}
	.cb-moodboard .swiper-slide:nth-child(1),
	.cb-product-moodboard .swiper-slide:nth-child(1){
		margin-right: 0;
	}
	.cb-moodboard-button a {
		width: 100%;
	}
}