.custom-card {
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(0, 0, 0, 0.175);
    border-radius: 18px;
    background-color: #fff;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}

.custom-card:hover {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    transition: 0.3s;
}

.custom-card a{
  padding: 10px;
  font-size: large;
  font-weight: bold;
}

.styled-image {
		border: 5px solid #ddd;
		border-radius: 15px;
		box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
}

.card-link {
		text-decoration: none;
		color: inherit;
}

.card-link:hover {
		color: inherit;
}


.card-img-top {
		height: 200px;
		object-fit: cover;
}

.card:hover {
		box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
		transition: 0.3s;
}

.carousel-item img {
  height: 200px;
  object-fit: cover;
  border-top-left-radius: 18px;
  border-top-right-radius: 18px;
}

.congrid {
    display: grid;
    grid-template-columns: repeat(11, 1fr);
    padding: 10px; /* Espaciado interno general */
    gap: 10px; /* Espacio entre los elementos directos del main-content-grid (el primer info-card y el cards-grid) */
}

.element{
	background-color: #fff;
}

.element1{
	grid-column: 1/12;
	grid-row: 1/2;
}
.element2{
	grid-column: 1/8;
	grid-row: 2/3;
}
.element3{
	grid-column: 8/12;
	grid-row: 2/6;
}

.element3 a{
  text-decoration: none;
}

.min-title{
  background-image: linear-gradient(to bottom, #212529, #373c42, #212529);
  font-size: 2rem;
  text-align: center;
  padding: 10px;
  border-radius: 18px;
}

.min-title:hover{
  background-image: linear-gradient(to bottom, #373c42, #212529, #373c42);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  transition: 0.3s;
}
.min-title mititle{
  color: #ddd;
}

.min-title:hover mititle{
  color: #cccc;
}

.element4{
	grid-column: 1/5;
	grid-row: 3/4;
}

.content-wrapper {
  padding: 20px;
  width: 100%;
  height: 100%;
  box-sizing: border-box; /* Importante para que el padding no cause desbordamiento */
}

.content-wrapper p {
  margin-top: 0; /* Elimina el margen superior por defecto de los párrafos si no lo quieres */
  margin-bottom: 0; /* Elimina el margen inferior por defecto de los párrafos si no lo quieres */
  line-height: 1.6; /* Mejora la legibilidad del texto */
}

.element5{
	grid-column: 5/8;
	grid-row: 3/5;
	display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.element5 img{
	max-width: 100%;
}
.element6{
	grid-column: 1/5;
	grid-row: 4/5;
}
.element7{
	grid-column: 1/8;
	grid-row: 5/6;
}