:root{
	--color1: #251D3A;
	--color2: #1B2430;
	--destacado: #E7AB79;
	--destacado2: #EC994B;
}
body{
	font-family: 'Inter', sans-serif;
	background-color: var(--color1);
}
h1,h2,h3,h4,h5,h6{
	font-weight: 700;
}
p,li{
	font-weight: 300;
}
.text-sm{
	font-size: 12px;
}
.text-small{
	font-size: 14px;
}
.lista-videos{
	background-color: rgb(231 221 255 / 7%);
	border-radius: 25px;
	box-shadow: 0 0 20px rgb(0 0 0 / 29%);
}
.lista-videos .cont-video{
	background-color: rgba(255, 255, 255, .1);
	transition: all .3s ease-in-out;
}
.lista-videos .cont-video:hover{
	background-color: rgba(255, 255, 255, .2);
}
.lista-videos .cont-video.active{
	background-color: rgba(255, 255, 255, .3);
	/*border: 1px solid var(--destacado2);*/
}
.lista-videos .cont-video figure{
	border-radius: 10px; 
	overflow: hidden;
	height: 60px;
}
.lista-videos .cont-video figure video{
	border-radius: 10px; 
	object-fit: cover;
}
.lista-videos .cont-video figure .icono-play{
	position: absolute; 
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0, 0, 0, .3);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.lista-videos .cont-video figure .icono-play i{
	font-size:26px; 
	line-height: 26px;
}
.lista-videos .cont-video a{
	font-size: 12px;
	letter-spacing: 1px;
	color: var(--destacado2);
}
.lista-videos .cont-video a:hover{
	color: var(--destacado);
}

.scroll-videos::-webkit-scrollbar {
  width: 8px;
}
/* Track */
.scroll-videos::-webkit-scrollbar-track {
  background: rgb(231 221 255 / 8%);
  border-radius: 10px;
}
/* Handle */
.scroll-videos::-webkit-scrollbar-thumb {
  background: #251d3a; 
  border-radius: 10px;
}
/* Handle on hover */
.scroll-videos::-webkit-scrollbar-thumb:hover {
  background: #423466; 
}

#myVideo{
	border-radius: 15px;
	height: 500px;
	object-fit: contain;
	box-shadow: 0 0 12px rgb(0 0 0 / 60%);
	background-color: #000;
}
.form-control{
	border-radius: 20px;
}
.btn{
	border-radius: 20px;
}
.btn-color{
	background-color: var(--destacado2);
	color: #fff;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 500;
}
.btn-color:hover{
	background-color: var(--destacado)!important;
	color: #fff!important;
}

@media screen and (max-width: 992px){
	#myVideo{
		height: 465px;
	}
}
@media screen and (max-width: 576px){
	#myVideo{
		height: 400px;
	}
}
@media screen and (max-width: 425px){
	#myVideo{
		height: 300px;
	}
}