.slider-cont > video{
	object-fit:cover;
	width:100%;
	height:400px;
}
.slider-cont > div{
	position:absolute;
	top:250px;
	left:calc(50% - 671px / 2);
	color:white;
	text-align:center;
}
.slider-cont > div > h2{
	font-size:65px;
	font-weight:900;
	text-shadow:0px 0px 10px black;
}
.slider-cont > div > .p1{
	font-size:28px;
	font-weight:900;
	text-shadow:0px 0px 10px black;
}
.slider-cont > div > .p2{
	font-size:22px;
	font-weight:900;
	text-shadow:0px 0px 10px black;
}
.slider-cont > div > a{
	text-decoration:none;
	display:flex;
	margin-top:10px;
	justify-content:center;
	align-items:center;
	color:black;
	font-size:20px;
	background:white;
	height:45px;
	width:180px;
	border-radius:25px;
}
.slider-cont > div > a:hover{
	background-color:black;
	color:white;
} 
.car-container{
	position:relative;
	display:flex;
	flex-wrap:wrap;
	gap:150px;
	justify-content:center;
	margin-top:50px;
	margin-bottom:50px;
}
 .car-container > .model{
	width:30%;
	text-align:center;
	position:relative;
	color:black;
	border-radius: 15px 0px 15px 0px;
	overflow: hidden;
	box-shadow:0px 0px 10px 8px #d9d1d1;
	padding:0px 10px 20px 10px;
}

.car-container > .model > .btn > a{
	text-decoration:none;
	background:black;
	padding:10px 20px;
	color:white;
	font-size:18px;
	border-radius:8px;
	cursor:pointer;
}
.car-container > .model > .images> img{
	width:90%;
	margin-bottom:20px;
}

.car-container > .model > .vv{
	width:100%;
	position:absolute;
	top: 20%;
	left: 0;
	z-index:10;
	overflow-x:hidden;
	padding:15px;
	width:100%;
	background:white;
	border-radius:20px;
	box-shadow:0px 0px 10px 8px #dddddd; 
	box-sizing:border-box;
	transform:scale(0);
	transition:all 0.5s;
}

.car-container > .model > .vv > .off{
	position:absolute;
	top:0px;
	font-size:30px;
	right:10px;
	font-weight:900;
	color: black;
	transform:rotate(223deg);
	cursor:pointer;
}
.car-container > .model > .vv > div{
	width:80%;
	margin:0 auto;
}
.car-container > .model > .vv > div  > video{ 
	object-fit:cover;
	width:100%;
}

.model:before, .model:after {
	  content: '';
	  transform: scale(0);
	  transform-origin: top left;
	  border-radius: 20%;
	  position: absolute;
	  left: -30%;
	  top: -30%;
	  z-index: -1;
	  transition: all, 0.6s;
	  transition-timing-function: ease-in-out;
}
.model:after {
	  box-shadow:inset 0px 0px 100px 70px black;
	  background:gray;
	  width: 180%;
	  height: 150%;
}
.model:hover {
	  color: white;
	  transition:all,0.8s;
}
.model:hover  .btn > a{
	background-color:white;
	color:black;
}
.model:hover:before, .model:hover:after {
  transform: scale(1);
} 

@media(min-width:240px) and (max-width:600px){
	.car-container{
		display: flex;
		flex-direction: column;
		justify-content: center;
		gap:50px;
		width: 80%;
		margin-left: 20%;
	}
	.car-container > .model{
		width:80%;
	}
}