html {
  scroll-behavior: smooth;
}

header nav ul li a {
	color: rgb(4, 166, 225)!important;
}

h1 {
	color: black!important;
}

h2 {
	color: rgb(253, 221, 0)!important;
}


a.follow-link, span.follow-link {
	color: rgb(253, 221, 0)!important;
}

a.follow-link:hover {
   text-decoration: none;
}

a.follow-link svg  {
	fill: rgb(253, 221, 0)!important;
	width: 30px!important;
	height: 30px!important;
}

li::marker {
	color:white!important;
}


.hero-header {
	background-image: url('../images/bg/banner-Hola-Austin--768x352.png');
	height: 230px;
	background-position: top center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: relative;
    margin-top: 100px;
}


.carousel {
	margin: 0 auto;
	padding: 20px 0;
	width: 100%;
	overflow: hidden;
	display: flex;
}

.carousel .card {
    width: 100%;
    color: white;
    padding: 20px;
    font-size: xx-large;
    justify-content: center;
    align-items: center;
    min-height: 200px;
    border: none!important;
}

.carousel {
/* ... */
	> * {
	  flex: 0 0 100%;
	}
}

  /* Agrupando las tarjetas para una mejor estructura. */
.group {
	display: flex;
	gap: 20px;
	/* Agrega padding a la derecha para crear un espacio entre la última y la primera tarjeta. */
	padding-right: 20px;
}

.group {
	/* ... */
	will-change: transform; /* Deberíamos ser amables con el navegador: hazle saber qué vamos a animar. */
	animation: scrolling 120s linear infinite;
}

@keyframes scrolling {
	0% {
	  transform: translateX(0);
	}
	100% {
	  transform: translateX(-100%);
	}
}

.carousel {
	/* ... */
	&:hover .group {
	  animation-play-state: paused;
	}
}

.player-rounded {
	border-radius: 25px;
	border: 20px solid rgb(244, 49, 65);
}

.image-rounded {
	border-radius: 25px;
}


/*
Gallery
*/
.festival-gallery{
	padding:0;
}

.festival-card{
  position: relative;
  overflow: hidden;
  border-radius: 18px;
  background: #ddd;
  height: 100%;
}

.festival-card img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Alturas */
.festival-card--hero{
  min-height: 760px;
}

.festival-card--sm{
  min-height: 360px;
}

/* Separación similar a la imagen */
.festival-gallery .row{
  margin-left: -12px;
  margin-right: -12px;
}

.festival-gallery .row > [class*="col-"]{
  padding-left: 12px;
  padding-right: 12px;
  margin-bottom: 24px;
}

/* Responsive */
@media (max-width: 991.98px){
  .festival-card--hero{
    min-height: 520px;
  }

  .festival-card--sm{
    min-height: 260px;
  }
}

@media (max-width: 767.98px){
  .festival-card--hero,
  .festival-card--sm{
    min-height: 280px;
  }
}
/*
Gallery
*/


/*
Overides
*/
.btn {
	border-radius: 25px!important;
}

.btn-primary {
	background: #04A6E1!important;
	border-color: #04A6E1!important;
}



@media (min-width: 768px) {
	
	.hero-header {
		background-image: url('../images/bg/banner-Hola-Austin.png')!important;
	    height: 440px!important;
	    background-position: top center;
	    background-repeat: no-repeat;
	    background-size: 100%;
	    position: relative;
	    margin-top: 110px;	
	}

}


@media (min-width: 991.98px) {
	
	.hero-header {
	    height: 560px!important;
	    background-size: 100%;

	}
}

@media (min-width: 1200px) {
	
	.hero-header {
	    height: 705px!important;
	    background-position: center center;
	    background-size: 100%;
	    margin-top: 80px;
	    border: 1px solid dark;
	}
}



/*
Event Banner
*/


.event-banner{
	background:#e53492;
	min-height:190px;
	overflow:hidden;
	position:relative;
}

.event-title-left,
.event-title-right{
	position:relative;
	z-index:4;
	font-size:2rem;
	line-height:1.35;
}

.event-title-left{
	text-align:center;
}

.event-title-right{
	font-size:1.15rem;
}

/* Figura izquierda */
.event-shape-left{
	position:absolute;
	left:-55px;
	top:-8px;
	width:150px;
	height:150px;
	z-index:1;
}

.event-shape-left .outer-circle{
	position:absolute;
	width:150px;
	height:150px;
	border-radius:50%;
	background:#f7dd00;
	display:block;
}

.event-shape-left .inner-circle{
	position:absolute;
	width:90px;
	height:90px;
	border-radius:50%;
	background:#e53492;
	left:22px;
	top:28px;
	display:block;
	box-shadow: -18px 0 0 0 #e53492;
}

/* Estrella detrás */
.event-star{
	position:absolute;
	left:50%;
	top:50%;
	width:320px;
	transform:translate(-50%, -50%);
	z-index:1;
	pointer-events:none;
}

.event-star img{
	width:100%;
	display:block;
}

/* Imagen central */
.event-artist{
	position:absolute;
	left:50%;
	bottom:0;
	transform:translateX(-50%);
	width:290px;
	z-index:3;
}

.event-artist img{
	width:100%;
	height:auto;
	display:block;
}

@media (max-width: 991.98px){
	.event-banner{
	  min-height:auto;
	  padding:40px 0 180px;
	}

	.event-star{
	  width:250px;
	  top:auto;
	  bottom:10px;
	  transform:translateX(-50%);
	}

	.event-artist{
	  width:180px;
	}

	.event-title-left,
	.event-title-right{
	  text-align:center;
	}

	.event-title-left{
	  font-size:1.7rem;
	  margin-bottom:1rem;
	}

	.event-title-right{
	  font-size:1rem;
	}
}

@media (max-width: 575.98px){
	.event-banner{
	  padding:30px 15px 160px;
	}

	.event-title-left{
	  font-size:1.4rem;
	}

	.event-title-right{
	  font-size:.95rem;
	  line-height:1.6;
	}

	.event-artist{
	  width:220px;
	}
}
/*
Event Banner
*/


form#contact label {
	color: white!important;
	font-weight: bold;
}