.border-2 {
	border-width: 3px;
}

.border-white {
	border-color: white;
}
.text-white {

	color: white;
}

.text-jokers {
	color: #7B303F;
}

.bg-jokers {

	background-color: #7B303F;
}

.gr-form input[type="submit"] {

	background-color: white;
	margin-top:30px;
	color: #7b303f;
	padding: 5px 20px!important;
	font-size: 1.2rem;

}


.gr-form input[type="submit"]:hover {

	background-color: transparent;
	margin-top:30px;
	color: white;
	border: 1px solid #fff;
}

.relative {

    position: relative;
}

.absolute {
    position: absolute;
}

.flex {
	display:flex;
}

.flex-wrap {
	flex-wrap: wrap;
}

.flex-col {
    flex-direction: column;
}

.justify-center {
	justify-content: center;
}

.block {
	display: block;
}
.inline {
	display: inline;
}

.hidden {
    display: none;
}


.text-center {
	text-align: center;
}

.font-bold {

    font-weight: bold;
}

.mb-4 {
	margin-bottom: 12px;
}

.mb-6 {
	margin-bottom: 16px;
}

.mr-4 {
	margin-right: 12px;
}

.mr-1 {
	margin-right: 3px;
}


.border-b-white {

	border-bottom: 1px dotted #b77885;
	width: 100%;
	padding-bottom: 10px;
	margin-bottom: 20px;

}

.input-control-off {

	position: absolute;
    left: -999999999px;
}

.center-h {
    top: 50%; 
    left: 50%;
    transform: translate(-50%, -50%);
}

/* single posts */

.banner {
	width: 100%;
	height: 475px;
	overflow: hidden;
}

.banner-header{
	width: 90%;
}

.banner h1.entry-title {

	font-size: 2em;
	line-height: 100%;
}

.pill{

	padding:6px 18px;
	background-color: #7b303f;
	border-radius: 999px;


}

.pill-inverse{

	padding:6px 18px;
	background-color: white;
	border-radius: 999px;
	color: #7b303f;


}


@media screen and (min-width: 1024px){

    .banner {
        height: 575px; 
    }

	.banner h1.entry-title {
		
		font-size: 3em;
	
	}

	.banner-header{
		width: 60%;
	}
    
}

.banner img.fit {
	width: 100%;
	height: 100%;
	object-fit: cover;

}

.image-gradient {
    position:relative;
	height: 100%;
  }
  
  
.image-gradient::after {
    content: '';
    position: absolute;
    left: 0; top: 0;
    width: 100%; height: 100%;
    background: linear-gradient(rgba(0, 0, 0, 0.6),rgba(0, 0, 0, 0.4));
}

.single-post .page-content,
.single-evento .page-content  {

	width: 95%;
	margin: 0 auto;
	padding: 30px 15px;

}

.single-post .page-content p,
.single-evento .page-content p {

	font-size: 1em;
	margin-bottom: 1.5em;
}	

.single-post .page-content img,
.single-evento .page-content img {

	margin: 25px 0;
}


.single-post  .page-content ul > li,
.single-evento .page-content ul > li {

	margin-bottom: 20px;
}


.page-content blockquote {

	border-top: 1px solid #7B303F;
	border-bottom: 1px solid #7B303F;
	width: 95%;
	margin-top: 35px;
	margin-bottom: 35px;
	margin-left: auto;
	margin-right: auto;
	padding: 15px 0;
	font-size: 1.2em;
	color: #7B303F;

}

.page-content h2.wp-block-heading
{

	font-weight: bold;
	font-size: 26px;
	color: #7B303F;
	margin-bottom: 20px;

}

.page-content h3.wp-block-heading
{

	font-weight: bold;
	font-size: 20px;
	color: #7B303F;
	margin-bottom: 12px;
}


.page-content blockquote p{

	margin-bottom: 0!important;
	text-align: center;
	font-weight: bold;
}




@media screen and (min-width: 1024px){

	.single-post .page-content,
	.single-evento .page-content {

		width: 60%;
		padding: 45px 15px;

	
	}

	.page-content blockquote {
		width: 70%;
	}
}



.contenedor {

	width: 95%;
	margin: 0 auto;
	padding: 15px;
}

.contenedor-wide {

	width: 95%;
	margin: 0 auto;
	padding: 25px 15px;
}



.gallery {
	display: grid;
	grid-template-columns: repeat(3, 1fr); /* Dos columnas en pantallas pequeñas */
	gap: 10px; /* Espacio entre las imágenes */
  }
  
  @media (min-width: 468px) {
	/* Cambiar a cuatro columnas en pantallas más grandes */
	.gallery {
	  grid-template-columns: repeat(4, 1fr);
	}

	
  }

  @media (min-width: 768px) {

	.gallery {
			grid-template-columns: repeat(6, 1fr);
		} 

  }
  
  @media (min-width: 1024px) {
  .contenedor {
	width: 60%;
	margin: 0 auto;
	}

	.contenedor-wide {
		width: 80%;
		margin: 0 auto;
		}
  }

.posts-container {

	max-width: 90%;
	margin: 0 auto;

}

.post-container-header {
	max-width: 95%;
	margin: 0 auto;
	
}

@media (min-width: 768px) {
	.post-container-header {
		max-width: 65%;
		
	}
}
.post-container-header h2 {

	font-size: 28px;
	line-height: 1;

}

.post-container-header p {

	font-size: 16px;
	line-height: 1.2;
}

.posts {
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	gap: 20px; /* Espacio entre las imágenes */
	padding:30px 15px;
	justify-content: center;
	grid-auto-rows: 1fr;
}

.post-item {
	background-color: #f4f4f4;

}

.post-image {
	position: relative;
	height: 200px;
}

.post-tag {
	position: absolute;
	top: 10px;
	left:10px;
	background-color: #7B303F;
	padding:3px 9px;
	color:white;
	border-radius: 3px;
	z-index: 10;
	font-size: 12px;
}

.post-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: all;
	transition-duration: 500ms;
}

.post-image img:hover {
    filter: brightness(60%);
}

.post-content {
	padding: 20px;
}

.post-content p {
	font-size: 15px;
}
.post-content h2 {

	font-weight: bold;
	font-size: 24px;
}

.post-content h2 a {

	color: #7B303F;
	transition: all;
	transition-duration: 500ms;
}

.post-content h2 a:hover {

	color: #222;
}

.post-content p.post-time {
	margin-bottom: 0;
}

@media (min-width: 768px) {

	.posts {
		grid-template-columns: repeat(3, 1fr);
	
	}

}

@media (min-width: 1024px) {

	
	.posts-container {
	  max-width: 90%;
	  }
}

ul.page-numbers {

	padding-left: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	list-style: none;
	font-size: 16px;
	padding-top: 25px;
	padding-bottom: 25px;
}

ul.page-numbers li {
	margin: 0 10px;
}


.frontpage_menu nav {
	display: flex;
	justify-content: end;
}

.frontpage_menu nav ul {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	list-style-type: none;
}

.frontpage_menu nav ul li {

	margin-left:20px;
}

.frontpage_menu nav ul li a{

	border: 1px solid white;
	border-radius: 999px;
	padding: 5px 15px;
	text-decoration: none;

}

.frontpage_menu nav ul li a:hover{
	background-color: #7B303F;
	color: white;
	border: 1px solid #7B303F;
	text-decoration: none;
}
