/* --------------------------------------------|
|                                              |
|  Quote                                       |
|                                              |
|-------------------------------------------- */

.block--quote {
	background-color: var(--color-local-quote);
	color: white;
	padding: 0;
}

blockquote,
.blockquote {
	padding: 60px;
	position: relative;
	text-wrap: balance;
	text-align: center;
}

@media screen and (max-width: 1200px) {

	blockquote,
	.blockquote {
        padding: 20px;
	}

}

.blockquote__quote {
	font-size: 24px;
}

@media screen and (max-width: 768px) {

.blockquote__quote {
	font-size: 18px;
}

}

blockquote:after,
blockquote:before,
.blockquote:after,
.blockquote:before {
	position: absolute;
}

/*
blockquote:before,
.blockquote:before {
    content: "";
    background-image: url(data:image/svg+xml,%3Csvg width='18.302' height='15.3' viewBox='0 0 18.302 15.3' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23828282'%3E%3Cpath d='M 11.7 15.3 L 11.1 14.4 A 14.869 14.869 0 0 0 12.941 12.947 Q 13.881 12.068 14.523 11.107 A 8.923 8.923 0 0 0 14.7 10.83 A 8.089 8.089 0 0 0 15.834 7.475 A 10.223 10.223 0 0 0 15.9 6.3 L 14.1 6.9 A 3.265 3.265 0 0 1 12.614 6.564 A 3.3 3.3 0 0 1 11.76 5.94 Q 10.8 4.98 10.8 3.6 A 3.907 3.907 0 0 1 11.009 2.3 A 3.367 3.367 0 0 1 11.82 1.02 A 3.445 3.445 0 0 1 14.157 0.007 A 4.584 4.584 0 0 1 14.4 0 A 4.707 4.707 0 0 1 15.633 0.153 A 3.405 3.405 0 0 1 17.25 1.11 A 3.655 3.655 0 0 1 18.113 2.684 Q 18.265 3.237 18.294 3.892 A 7.09 7.09 0 0 1 18.3 4.2 Q 18.3 10.777 13.058 14.447 A 16.441 16.441 0 0 1 11.7 15.3 Z M 0.9 15.3 L 0.3 14.4 A 14.869 14.869 0 0 0 2.141 12.947 Q 3.081 12.068 3.723 11.107 A 8.923 8.923 0 0 0 3.9 10.83 A 8.089 8.089 0 0 0 5.034 7.475 A 10.223 10.223 0 0 0 5.1 6.3 L 3.3 6.9 A 3.265 3.265 0 0 1 1.814 6.564 A 3.3 3.3 0 0 1 0.96 5.94 Q 0 4.98 0 3.6 A 3.907 3.907 0 0 1 0.209 2.3 A 3.367 3.367 0 0 1 1.02 1.02 A 3.445 3.445 0 0 1 3.357 0.007 A 4.584 4.584 0 0 1 3.6 0 A 4.707 4.707 0 0 1 4.833 0.153 A 3.405 3.405 0 0 1 6.45 1.11 A 3.655 3.655 0 0 1 7.313 2.684 Q 7.465 3.237 7.494 3.892 A 7.09 7.09 0 0 1 7.5 4.2 Q 7.5 10.777 2.258 14.447 A 16.441 16.441 0 0 1 0.9 15.3 Z'/%3E%3C/g%3E%3C/svg%3E);
    left: -20px;
    top: -20px;
    transform: translate(-100%, 0);
    font-size: 100px;
    width: 20px;
    height: 20px;
    background-position: center center;
    background-repeat: no-repeat;
}

blockquote:after,
.blockquote:after {
    content: "";
    background-image: url(data:image/svg+xml,%3Csvg width='18.301' height='15.3' viewBox='0 0 18.301 15.3' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23828282'%3E%3Cpath d='M 17.4 0 L 18 0.9 Q 16.5 1.92 15.42 3.12 Q 14.34 4.32 13.77 5.76 A 8.056 8.056 0 0 0 13.274 7.753 A 10.246 10.246 0 0 0 13.2 9 L 15 8.4 A 3.265 3.265 0 0 1 16.487 8.736 A 3.3 3.3 0 0 1 17.34 9.36 Q 18.3 10.32 18.3 11.7 A 3.907 3.907 0 0 1 18.092 13 A 3.367 3.367 0 0 1 17.28 14.28 A 3.445 3.445 0 0 1 14.944 15.294 A 4.584 4.584 0 0 1 14.7 15.3 A 4.841 4.841 0 0 1 13.48 15.154 A 3.427 3.427 0 0 1 11.85 14.22 A 3.468 3.468 0 0 1 11.031 12.802 Q 10.865 12.266 10.819 11.621 A 7.226 7.226 0 0 1 10.8 11.1 A 14.398 14.398 0 0 1 11.139 7.9 A 10.818 10.818 0 0 1 12.51 4.53 A 12.72 12.72 0 0 1 15.815 1.022 A 15.991 15.991 0 0 1 17.4 0 Z M 6.6 0 L 7.2 0.9 Q 5.7 1.92 4.62 3.12 Q 3.54 4.32 2.97 5.76 A 8.056 8.056 0 0 0 2.474 7.753 A 10.246 10.246 0 0 0 2.4 9 L 4.2 8.4 A 3.265 3.265 0 0 1 5.687 8.736 A 3.3 3.3 0 0 1 6.54 9.36 Q 7.5 10.32 7.5 11.7 A 3.907 3.907 0 0 1 7.292 13 A 3.367 3.367 0 0 1 6.48 14.28 A 3.445 3.445 0 0 1 4.144 15.294 A 4.584 4.584 0 0 1 3.9 15.3 A 5.963 5.963 0 0 1 3.872 15.3 Q 2.092 15.292 1.05 14.22 A 3.468 3.468 0 0 1 0.231 12.802 Q 0.065 12.266 0.019 11.621 A 7.226 7.226 0 0 1 0 11.1 A 14.398 14.398 0 0 1 0.339 7.9 A 10.818 10.818 0 0 1 1.71 4.53 A 12.72 12.72 0 0 1 5.015 1.022 A 15.991 15.991 0 0 1 6.6 0 Z'/%3E%3C/g%3E%3C/svg%3E);
    right: -20px;
    bottom: 5px;
    width: 19px;
    height: 16px;
    background-position: center center;
    background-repeat: no-repeat;
    transform: translate(100%, 0);
}
*/

/* --------------------------------------------|
|                                              |
|  Transitions                                 |
|                                              |
|-------------------------------------------- */

.block--quote[data-fade-quotes] {
	display: grid;
	position: relative;
	align-items: center;
}

@media screen and (max-width: 1200px) {
	.block.block--quote {
		margin-left: -20px;
		margin-right: -20px;
		margin-bottom: 0;
	}
}

.block--quote[data-fade-quotes] [data-fade-quote-item] {
	grid-area: 1 / 1 / 2 / 2;
	opacity: 0;
	pointer-events: none;
	transition: opacity 600ms;
	z-index: 0;
}

.block--quote[data-fade-quotes] [data-fade-quote-item].active {
	opacity: 1;
	pointer-events: auto;
	z-index: 1;
}