/***
 ********** HEADER NAV **********
***/
.whb-header-bottom > .container {
  padding: 0;
}

.whb-header-bottom-inner {
	background-color: var(--tva-primary-color);
}

.whb-header-bottom-inner .whb-col-left {
	margin: 0;
	width: 20%;
}

.whb-col-left .wd-header-text {
	padding: 0;	
	height: 100%;
	display: flex;
	align-items: center;
}

.wd-header-text .tva-header-menu-list {
	--tva-header-list-top: 40px;
}

.whb-header-bottom-inner .whb-col-center {
	border-left: 1px solid rgba(0, 0, 0, 0.2);
	padding-left: 16px;
}

.whb-header-bottom-inner .whb-col-center a {
	--tva-text-color: var(--tva-text__light);
	color: var(--tva-text-color);
}

.wd-nav[class*="wd-style-"]>li:is(.current-menu-item)>a {
	--tva-text-color: var(--tva-text__light);
	color: var(--tva-text-color) !important;
	border: 2px solid #fff;
	padding: 0 4px;
	cursor: default;
}

.wd-header-main-nav .wd-nav[class*="wd-style-"] > li > a {
	--tva-text-color: var(--tva-text__light);
	color: var(--tva-text-color);
}

.wd-header-main-nav .wd-nav[class*="wd-style-"] > li:not(.current-menu-item) > a:hover {
	--tva-text-color: var(--tva-text__light);
	color: var(--tva-text-color);
	animation: float ease 0.5s;
}

/***
 *********** POSTER **********
***/
.tva-poster-cover {
	padding: 10px;
	overflow: hidden !important;
}
.tva-poster {
	width: 100%;
	aspect-ratio: 21 / 9;
}

/***
 *********** BANNER **********
***/

.tva-banner-cover {
	
}

.tva-nested-banner {
	width: 100%;
}

.tva-nested-banner .banner__item {
	aspect-ratio: 21 / 9;
}

.banner__item-field {
	position: relative;
	display: flex;
	height: 100% !important;
	justify-content: center;
	align-items: center;
}

.banner__item-text {
	position: absolute !important;
	top: 0;
	left: 0;
}

.banner__item-img {
	position: relative;
	height: 100%;
	overflow: hidden;
}

.banner__item-img img {
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	width: auto;
	height: 100%;
	transition: all 1s ease;
}

.banner__item .banner__item-img.item--1 {
	animation: circle-move 20s linear infinite;
}

.banner__item:hover .banner__item-img.item--1 {
	animation: none;
	animation: bannerZoom 1s ease forwards;
}

.banner__item:hover .banner__item-img.item--2 {
	animation: bannerZoom 1s ease forwards;
}

@keyframes circle-move {
	0%   { transform: scale(1.2) translateX(10px) rotate(0deg); }
	25%  { transform: scale(1.2) rotate(90deg) translateX(10px) rotate(-90deg); }
	50%  { transform: scale(1.2) rotate(180deg) translateX(10px) rotate(-180deg); }
	75%  { transform: scale(1.2) rotate(270deg) translateX(10px) rotate(-270deg); }
	100% { transform: scale(1.2) rotate(360deg) translateX(10px) rotate(-360deg); }
}

@keyframes bannerZoom {
	0% {
		transform: scale(1) ;
	}
	100% {
		transform: scale(1.1) translatex(-20px);
	}
}