.grid-container {
  display: grid;
  grid-template-columns: repeat(2, minmax(10rem, 1fr)); /* Creates a responsive grid with a max of 4 items per row */
  grid-gap: 20px; /* Sets the gap between grid items */
  justify-content: center;
}

.grid-item {
    background-color: #000099;
    padding: 20px;
    /*border: 1px solid black; */
    word-wrap: break-word;
    overflow-wrap: break-word;
    overflow: hidden; /* or 'auto' depending on your preference */
    box-sizing: border-box;
    border-radius: 10px;
}
.grid-item-large {
    background-color: #000099;
    padding: 20px;
    /*border: 1px solid black; */
    word-wrap: break-word;
    overflow-wrap: break-word;
    overflow: hidden; /* or 'auto' depending on your preference */
    box-sizing: border-box;
    border-radius: 10px;
    /* Your styling for larger grid items */
    grid-column: span 2; /* Example to make it span two columns */
}

body {
    background: rgb(252, 252, 252);
    /*background: linear-gradient(336deg, rgba(255,251,62,1) 0%, rgba(21,114,255,1) 32%, rgba(255,251,62,1) 100%);
    height: 100%;
    /* background-image: url('/images/background.jpg');
    /* background-size: cover; /* Cover ensures the image covers the entire element */
    /* background-position: center; /* Center the image */
    /* background-repeat: no-repeat; /* Prevent the image from repeating */
}

.title_header { /* Replace 'header' with the correct selector for your header element */
    background-color: #000099; /* Choose your desired background color */
    border-radius: 15px; /* Adjust the border radius for rounded corners */
    text-align: center; /* Center the text inside the header */
    padding: 10px; /* Add some padding */
    margin: 10px; /* Add margin if needed */
    /* Other styling as needed */
    font-size:20em;
}
.item-info {
    font-size: 0.9em;
    color: #333;
    margin-top: 5px; /* Adjust spacing as needed */
    /* Additional styling as needed */
}

.custom-item-container {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: 1fr auto;
  height: 100%;
  font-size: 1.25rem;
}

.custom-item-left {
  grid-column: 1 / 2;
  grid-row: 1 / 3;
  align-self: center;
}

.custom-item-right-top {
  grid-row: 1 / 2;
  font-size: 0.9rem;
}

.custom-item-right-bottom {
  grid-row: 2 / 3;
  font-size: 0.9rem;
}

body {
  height: 100vh;
}

header {
  height: 80px;
}

footer {
  height: 80px;
}

.custom-content {
  height: 89vh;
  min-height: fit-content;
  padding-top: 0px;
}

.carousel-inner {
    width: 100%; /* Full width of the parent */
    max-width: 100%; /* Ensures it doesn't exceed the width of the parent */
    margin-left: auto; /* Centers the carousel if it's smaller than the parent width */
    margin-right: auto; /* Centers the carousel if it's smaller than the parent width */
}

.carousel-item {
    width: 100%; /* Makes the image responsive */
    height: auto; /* Maintains aspect ratio */
}


.carousel-control-prev-icon,
.carousel-control-next-icon {
  background-color: rgba(0, 0, 0, 0); /* Example: black background with 50% opacity */ /* Example: makes the icon white */
  width: 200px;
  height: 200px;
  font-size: 200px;
}

.btn-secondary {
  --bs-btn-color: #fffefe !important;
  --bs-btn-bg: #000000a8 !important;
}

.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 66%;
}