/* 1. Use a more-intuitive box-sizing model */
*, *::before, *::after {
  box-sizing: border-box;
}
/* 2. Remove default margin */
* {
  margin: 0;
}
:root {
    font-family: 'Century Schoolbook', Century, serif;
    font-style: italic;
}
body, * {
    font-family: 'Century Schoolbook', Century, serif;
    font-style: italic;
}
.global-text {
    font-family: 'Century Schoolbook', Century, serif;
    font-style: italic;
}

#titlebar {
    padding: 1rem;
    background: rgb(51,51,51);
background: linear-gradient(0deg, rgba(51,51,51,1) 50%, rgba(255,255,255,1) 100%);
}

#titlebar > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#showcase {
    position: relative;
}

#showcase .background {
    background-image: url("/static/Images/Desk_View.jpg");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    position: absolute;
    z-index: -1;
    min-width: 100vw;
    filter: grayscale(100%) brightness(50%);
}

#showcase .content {
    padding: 3rem;
}

#imageCarousel img {
    object-fit: scale-down;
    max-height: 500px;
    border-radius: 1rem;
    margin-inLine: auto;
}


#galleryCarousel img {
    object-fit: scale-down;
    max-height: 500px;
    border-radius: 1rem;
    margin-inLine: auto;
}

#imageCarousel .carousel-control-next-icon,
#imageCarousel .carousel-control-prev-icon {
    /*filter: invert(100%);*/
}
.carousel-control-prev-icon,
.carousel-control-next-icon {
    width: 3rem;
    height: 3rem;
    background-size: 100% 100%;
}

/* Custom colored arrows (orange in this example) */
.carousel-control-next-icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23FF6F00' viewBox='0 0 8 8'%3E%3Cpath d='M2 0l4 4-4 4z'/%3E%3C/svg%3E");
}

.carousel-control-prev-icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23FF6F00' viewBox='0 0 8 8'%3E%3Cpath d='M6 0L2 4l4 4z'/%3E%3C/svg%3E");
}

#mainContent {
    display: grid;
    grid-template-rows: repeat(6, auto);
    grid-template-columns: 100vw;
    width: 100%;
    justify-content: center;
    min-height: 100vh;
}

#mainContent > section {
    width: 100%;
}


#mainContent > section > * {
    max-width: 75%;
    min-width: 75%;
    margin-inline: auto;
    height: 100%;
}

.carousel-grid {
    display: inline-grid;
    grid-template-columns: 1fr 1fr;
    /*grid-template-rows: auto;*/
    justify-content: center;
}

.carousel-text {
    padding: 1rem;
}

section:not(:first-child):not(:last-child) {
    margin-bottom: 3rem;
}

#about strong {
    font-size: 28px; /* Adjust this value as needed for the title */
    font-weight: bold; /* Ensures the title looks prominent */
    font-family: "Century Schoolbook", serif; /* Matches the website's font styling */
}

#about p {
    font-size: 20px; /* Adjust this value for the paragraph text */
    line-height: 1.6; /* Improves readability by managing the space between lines */
    font-family: "Century Schoolbook", serif; /* Ensures consistent font styling */
}

.footer-links {
    list-style: none;
}