.cls_div {
    width: 100%;
    height: 333px;
    background: transparent;
    margin:10px;
    border-radius:8px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.cls_div iframe {
    border-radius:8px;
}

.clsRelevantVideos-block {
	position: relative;
}

.cls_div1, .cls_div2, .cls_div3 {
    background-repeat: no-repeat;
    background-size: cover;
	margin: 10px;
	position: absolute;
	width: calc(100% / 3 - 10px * 2);
}

.cls_div1 {
	opacity: 0;
	position: relative;
}
.cls_div2 {
	width: calc(100% - 10px * 2);
	right: 0;
	z-index: 3;
}
.cls_div3 {
	width: calc(100% / 2 - 10px * 2);
	z-index: 2;
	right: 0;
}

.wp-block-relevant-videos-relevant-videos.active .cls_div1 {
	animation: div1-animation 2s linear forwards;
}
.wp-block-relevant-videos-relevant-videos.active .cls_div2 {
	animation: div2-animation 2s linear forwards;
}
.wp-block-relevant-videos-relevant-videos.active .cls_div3 {
	animation: div3-animation 2s linear forwards;
}

.wp-block-relevant-videos-relevant-videos.active .cls_div1 iframe,
.wp-block-relevant-videos-relevant-videos.active .cls_div2 iframe,
.wp-block-relevant-videos-relevant-videos.active .cls_div3 iframe {
    display: none;
}

.wp-block-relevant-videos-relevant-videos.active .cls_div1 iframe,
.wp-block-relevant-videos-relevant-videos.active .cls_div2 iframe,
.wp-block-relevant-videos-relevant-videos.active .cls_div3 iframe {
    display: block;
    width: 100% !important;
    height: 100% !important;
}

@-webkit-keyframes div1-animation {
	0%, 25%, 50% {
		opacity: 0;
	}
	75%, 100% {
		opacity: 1;
	}
}

@-webkit-keyframes div2-animation {
	0% {
		width: calc(100% - 10px * 2);
		right: 0;
	}
	25%, 50% {
		width: calc(100% / 2 - 10px * 2);
		right: 50%;
	}
	75%, 100% {
		width: calc(100% / 3 - 10px * 2);
		right: calc(100% / 3);
	}
}

@-webkit-keyframes div3-animation {
	0%, 25%, 50% {
		width: calc(100% / 2 - 10px * 2);
	}
	75%, 100% {
		width: calc(100% / 3 - 10px * 2);
	}
}

@media (max-width: 992px) {
	.cls_div1, .cls_div2, .cls_div3 {
		opacity: 1;
		position: relative;
		width: 100%;
		animation: unset !important;
	}

    .cls_div {
        width: 100%;
        background: transparent;
        margin:10px;
        border-radius:8px;
    }

    @media (max-width: 500px) {
        .cls_div {
            height: 204px;
        }
    }

    @media (min-width: 601px) and (max-width:992px) {
        .cls_div {
            height: 404px;
        }
    }
}

.clsRelevantVideos {
    width:fit-content;
    text-align:center;
    padding:132px;
}
.clsRelevantVideos-title-h1 {
    font-family: var(--wp--preset--font-family--heading);
    color: #000000;
	font-size: clamp(2.25rem, 0.3793rem + 3.0172vw, 4rem);
    line-height: clamp(2.8125rem, 0.4741rem + 3.7716vw, 5rem);
    font-weight: 600;
    /* font-size: 64px; */
    /* line-height: 80px; */
}

.clsRelevantVideos-title-p {
    font-family: var(--wp--preset--font-family--paragraph);
    font-weight:400;
    /* font-size:20px; */
    /* font-size: clamp(1.0625rem, 0.8617rem + 0.3236vw, 1.25rem); */
    /* line-height:35px; */
    font-size: clamp(1rem, 0.7328rem + 0.431vw, 1.25rem);
    line-height: clamp(1.75rem, 1.2823rem + 0.7543vw, 2.1875rem);
    text-align:center;
    color: #000000;
}
.clsRelevantVideos-block-title-video {
    font-family: var(--wp--preset--font-family--heading);
    color: #182F43;
    /* position: relative; */
    position: absolute;
    top: 105%;
    font-weight:600;
    font-size:28px;
    line-height:35px;
    margin: 0px !important;
}

.clsRelevantVideos-block-title-video-play {
    font-family: var(--wp--preset--font-family--heading);
    color: #182F43;
    /* position: relative;
    margin-top:21px; */
    position: absolute;
    top: 105%;
    font-weight:600;
    font-size:28px;
    line-height:35px;
    margin: 0px !important;
}

.clsRelevantVideos-block-title-video-play-active {
    font-family: var(--wp--preset--font-family--heading);
    color: #182F43;
    /* position: relative;
    margin-top:10px; */
    position: absolute;
    top: 105%;
    font-weight:600;
    font-size:28px;
    line-height:35px;
}

.clsRelevantVideos-title {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.clsRelevantVideos-title p {
    width: 100%;
    white-space: pre-wrap;
}

@media only screen and (max-width: 992px) {
    .clsRelevantVideos-title p {
        white-space: unset;
    }

	.clsRelevantVideos-title-h1 {
		font-size: 36px;
		line-height: 45px;
	}
	.clsRelevantVideos-title p {
        width: 100%;
    }
    .clsRelevantVideos {
        padding:66px 23px;
    }
    .cls_div1 {
        background-size:contain;
        margin:0px;
    }
    .cls_div2 {
        background-size:contain;
        margin:0px;
    }
    .cls_div3 {
        background-size:contain;
        margin:0px;
    }
    .clsRelevantVideos-block {
        display:block !important;
    }
    .cls_div {
        margin-top: 60px !important;
        background-size: cover;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .clsRelevantVideos-block-title-video {
        position: absolute;
        top: 105%;
        margin: 0px !important;
    }
    .clsRelevantVideos-block-title-video-play-active {
        position: absolute;
        top: 105%;
        margin: 0px !important;
    }
}


@media only screen and (min-width: 993px) {
    .wp-block-relevant-videos-relevant-videos .clsRelevantVideos {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
}