/* ---- FRONT-END ---- */
#hbn-videos-wrapper h2.hbn-videos-title {
	font-family: 'Averta Bold';
	font-size: clamp( 28px, 2.73504vw, 32px);
	color: #272049;
	margin-bottom: 30px;
}

#hbn-videos-wrapper #hbn-videos-single-items-wrapper {
	position: relative;
}

#hbn-videos-wrapper #hbn-videos-single-items-wrapper .hbn-videos-single-item-container {
	position: relative;
	height: 0;
	padding-bottom: 56.25%;
	margin-bottom: 30px;
}

#hbn-videos-wrapper #hbn-videos-single-items-wrapper .hbn-videos-single-item-container .video-overlay {
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-color: transparent;
}

#hbn-videos-wrapper #hbn-videos-single-items-wrapper .hbn-videos-single-item-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


#hbn-videos-wrapper.preview {
	width: 100%;
	height: auto;
	overflow: hidden;
	float: inherit;
}

#hbn-videos-wrapper.preview #hbn-videos-single-items-wrapper {
	position: relative;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	row-gap: 15px;
}

#hbn-videos-wrapper.preview #hbn-videos-single-items-wrapper .hbn-videos-single-item-container {
	position: relative;
	display: flex;
	flex: 0 0 calc( 33.33333% - 7.5px );
	height: inherit;
    padding-bottom: inherit;
}

#hbn-videos-wrapper.preview #hbn-videos-single-items-wrapper .hbn-videos-single-item {
	position: inherit;
	height: 0;
	padding-bottom: 56.25%;
	margin-bottom: 30px;
}

#hbn-videos-wrapper.preview #hbn-videos-single-items-wrapper .hbn-videos-single-item-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}




@media(max-width: 767px) {
	#hbn-fotos-en-videos-wrapper .hbn-foto-en-video-thumb-container {
		position: relative;
		height: 0;
		padding-bottom: 56.25%;
		margin-bottom: 30px;
	}
}





/* ---- PREVIEW BACK-END ---- */
#text-wrapper {
	padding: 35px 0;
}

#hbn-videos-wrapper.admin #hbn-videos-single-items-wrapper {
	display: flex;
	flex-direction: row;
	column-gap: 30px;
}

#hbn-videos-wrapper.admin #hbn-videos-single-items-wrapper .hbn-videos-single-item-container {
	position: relative;
	display: flex;
	flex: 0 0 33.333333%;
	max-width: 33.33333%;
	height: 0;
	padding-bottom:21.25%;
}