.mrvll-hero {
	height: 640px;
	background-image: linear-gradient(to bottom, #fff, #fff 80%, #000 80%)
}

.mrvll-hero .carousel {
	margin-left: -15px;
	margin-right: -15px
}

.mrvll-hero .carousel-inner {
	height: 640px
}

.mrvll-hero .item {
	height: 640px;
	background-color: #000;
	background-size: auto 65%;
	background-repeat: no-repeat;
	background-position: top left;
	padding: 45px 24px 24px;
	transform: none !important;
	transition: opacity .25s ease-out;
	opacity: 0;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%
}

.mrvll-hero .item .mrvll-hero-text {
	height: 170px;
	transition: all .55s cubic-bezier(0.19, 1, 0.22, 1);
	transform: translateX(-30px);
	opacity: 0
}

.mrvll-hero .item .mrvll-hero-image {
	position: relative;
	transition: all .55s cubic-bezier(0.19, 1, 0.22, 1);
	clip-path: polygon(0 0, 45% 0, 45% 100%, 0 100%)
}

.mrvll-hero .item .mrvll-hero-image img {
	max-width: 100%;
	height: auto;
}

.mrvll-hero .item .item-wrapper {
	display: flex;
	flex-direction: column;
	min-height: 640px
}

.mrvll-hero .item.item.active {
	opacity: 1;
	z-index: 1
}

.mrvll-hero .item.item.active .mrvll-hero-image {
	clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%)
}

.mrvll-hero .item.item.active .mrvll-hero-text {
	transform: translateX(0);
	opacity: 1
}

.mrvll-hero .item.item.next.left,
.mrvll-hero .item.item.prev.right {
	opacity: 1;
	z-index: 2
}

.mrvll-hero .item.item.next.left .mrvll-hero-image,
.mrvll-hero .item.item.prev.right .mrvll-hero-image {
	clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%)
}

.mrvll-hero .item.item.next.left .mrvll-hero-text,
.mrvll-hero .item.item.prev.right .mrvll-hero-text {
	transform: translateX(0);
	opacity: 1
}

.mrvll-hero .item.item.prev,
.mrvll-hero .item.item.active.left,
.mrvll-hero .item.item.next,
.mrvll-hero .item.item.active.right {
	transition: all .25s ease-out
}

.mrvll-hero .mrvll-text-link {
	background-color: #fff;
	padding: 16px 45px 14px 24px;
	font-weight: bold;
	border-radius: 4px;
	background-size: 8px 13px;
	background-position: center right 22px
}

.mrvll-hero .mrvll-text-link:hover {
	background-position: center right 15px
}

.mrvll-hero .carousel-controls {
	z-index: 2;
	display: flex;
	flex-grow: 1;
	position: absolute;
	bottom: 110px;
	left: 40px
}

.mrvll-hero .carousel-control {
	background-image: url("https://www.marvell.com/etc.clientlibs/marvell-com/components/content/rebrandingcarousel/clientlibs-rebrandingcarousel/resources/carousel-arrow.svg");
	background-size: 100% 100%;
	background-repeat: no-repeat;
	width: 34px;
	height: 34px;
	opacity: 1;
	display: block;
	position: relative;
	margin-right: 10px;
	transition: background .1s ease-out
}

.mrvll-hero .carousel-control.right {
	transform: rotate(180deg)
}

.rebrandingcarousel .color-white h1 {
	color: #fff !important
}

.rebrandingcarousel .rebrandingteaser.teaser {
	margin-top: 80px
}

@media(min-width:768px) {
	.mrvll-page-content .mrvll-hero h1 {
		margin-top: 17px !important
	}

	.mrvll-hero {
		height: 440px;
		padding-right: 15px;
		padding-left: 15px
	}

	.mrvll-hero .carousel-inner,
	.mrvll-hero .item {
		height: 440px
	}

	.mrvll-hero .item {
		background-size: cover;
		background-position: center center;
		padding-left: 50px
	}

	.mrvll-hero .item .item-wrapper {
		flex-direction: row;
		align-items: center;
		min-height: auto;
		height: calc(380px - 80px)
	}

	.mrvll-hero .item .mrvll-hero-text {
		height: auto;
		transform: translateX(-60px);
		width: 100%
	}

	.mrvll-hero .item .mrvll-hero-image {
		top: 0;
		right: 0;
		padding: 40px;
		position: absolute;
		height: 440px;
		z-index: -1
	}

	.mrvll-hero .item .mrvll-hero-image img {
		max-height: none
	}

	.mrvll-hero .carousel-controls {
		left: 50px;
		bottom: 20px
	}

	.mrvll-hero .carousel-control {
		width: 43px;
		height: 43px;
		margin-right: 15px;
		background-position: center center;
		transition: transform .15s ease-out
	}

	.mrvll-hero .carousel-control:hover {
		transform: scale(1.1)
	}

	.mrvll-hero .carousel-control.right:hover {
		transform: scale(1.1) rotate(180deg)
	}
}

@media(min-width:992px) {
	.mrvll-hero {
		height: 550px
	}

	.mrvll-hero .carousel-inner,
	.mrvll-hero .item {
		height: 550px
	}

	.mrvll-hero .item {
		padding-left: 80px
	}

	.mrvll-hero .item .item-wrapper {
		height: calc(480px - 80px)
	}

	.mrvll-hero .item .mrvll-hero-image {
		height: 550px
	}

	.mrvll-hero .carousel-controls {
		left: 80px;
		bottom: 20px
	}

	.mrvll-hero .carousel-control {
		width: 48px;
		height: 48px
	}
}

@media(min-width:1200px) {
	.mrvll-hero {
		height: 620px
	}

	.mrvll-hero .carousel {
		margin-left: -15px;
		margin-right: -15px
	}

	.mrvll-hero .carousel-inner,
	.mrvll-hero .item {
		height: 620px
	}

	.mrvll-hero .carousel-controls {
		left: 270px;
		bottom: 20px;
	}

	.mrvll-hero .item {
		padding-left: 140px;
		padding-right: 100px
	}

	.mrvll-hero .item .item-wrapper {
		height: calc(620px - 80px);
		margin: auto;
		position: relative;
		max-width: 100%;
	}

	.mrvll-hero .item .mrvll-hero-image {
		height: 620px
	}
}

@media(min-width:1440px) {
	.rebrandingcarousel .container {
		width: calc(1440px - 30px)
	}
}

@media(max-width:1199.6px) {
	.rebrandingcarousel .container {
		width: 100%;
		padding-right: 24px;
		padding-left: 24px
	}
}

.mrvll-hero .item .mrvll-hero-image {
	max-width: 50%;
}

.mrvll-hero .item .mrvll-hero-text {
	max-width: 50%;
}

@media(max-width:767px) {
	.mrvll-hero .carousel {
		margin-left: 0;
		margin-right: 0;
	}

	.mrvll-hero .item .mrvll-hero-image,
	.mrvll-hero .item .mrvll-hero-text {
		max-width: 100%;
	}

	.mrvll-hero .item .item-wrapper {
		display: flex;
		flex-direction: column;
	}

	.mrvll-hero .item .mrvll-hero-text {
		height: 350px;
	}

	.mrvll-hero .item .mrvll-hero-image img {
		max-width: 100%;
	}

	.mrvll-hero .carousel-controls {
		bottom: 20px;
	}

	.mrvll-page-content h1 {
		font-size: 2.2rem;
	}

	.mrvll-hero .item {
		background-size: cover;
	}
}