@import url("theme.css");
.conten_video{
	width: 100%;
	height: calc(100vh - 109px);
	background-color: #000;
}

.ctn{
	position: relative;
	padding: 0px;
}

.conten_video video{
	/* max-width: 100%; */
	width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-size: cover;
  object-fit: cover;
}



.contn_b{
	position: absolute;
	width: 100%;
	bottom: 0px;
	display: flex;
	justify-content: center;
	padding: 10px;

}

.botonera{
	display: flex;
	gap:10px;
	margin-top: -100px;
	padding: 15px 30px 15px 30px;
	border-radius: 15px;
	background-color: rgba(255,255,255, .1);
	backdrop-filter: blur(3px);
}

.b_element{
	width:110px;
	border-radius: 15px;
	border: 4px solid #696969;
	overflow: hidden;
	transition: transform 0.3s ease; /* Transición suave */
	cursor: pointer;
}

.b_element:hover{
	transform: scale(1.1);
	border: 4px solid #000
}

.text-ct{
	position: absolute;
	width: 100%;
	height: calc(100vh - 109px);
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items:center;
	/* background-color:red; */
	/* background:linear-gradient(45deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, .6)); */
	background: linear-gradient(176deg, rgba(0, 0, 0, 0.1), rgb(37 37 37));
	z-index: 2;
}
.title_hero{
	font-weight: bolder;
  font-size: 3.9em;
	animation-delay: 800ms;
}
.blanco{
	color:#ffffff;
	-webkit-text-stroke: 1px rgba(0,0,0, .2);
}
.cbbb{
  animation-delay: 1100ms;
	margin-top: 20px;
}

.btn-hero{
	background-color: var(--marino);
	color:#fff;
  padding: 15px 50px 15px 50px;
  border-radius: 40px;
  font-weight: 600;
  border: 2px solid #ffffff96;
  font-size: 1.2em;
  letter-spacing: 1px;
	text-decoration: none;
	cursor: pointer;
}

.btn-hero:hover{
	color:#fff;
}


@media (max-width: 991.98px) {
	.conten_video video {
		width: 235%;
		transform: translate(-26%, 0px);
	}
}
@media (max-width: 767.98px) {
	.b_element{
		width: 70px;
	}
	.title_hero{
		font-size: 1.5em;
	}
	.conten_video{
		height: calc(100vh - 77px);
	}
	.text-ct{
		height: calc(100vh - 77px);
	}

	.botonera{
		padding: 15px 20px 15px 20px;
	}
	.contn_b{
		bottom:50px;
	}

	.btn-hero {
    padding: 10px 40px 10px 40px;
    font-size: 1em;
    letter-spacing: 0px;
	}
	.conten_video video {
	  width: 355%;
	  transform: translate(-34%, 0px);
	}
}