body {
    font-family: Arial, sans-serif;
    background-color: #3C147B;
    color: #f7f5f5;
}

h1 {
    font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    font-size: 2.5em;
}

h2 {
        font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
        font-size: 1.5em;
}

button {
    background-color: gray !important;
    border: 1px sold black !important;
    
}

hr {
    color: #EBDBF6;
    background-color: #EBDBF6;
}

.navbar {
    background-color: #1D0A3B;
}

.nav-link, .navbar-brand {
    color: #EBDBF6;
}

.container {
    background-color: #3C147B;
    padding: 20px;
    border-radius: 5px;
}

.author-card {
    background-color: #EBDBF6;
    color: #3C147B;
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 20px;
    flex-shrink:0;
}

.author-card img {
    flex-shrink: 0;
    border-radius: 50%; /* Makes the image circular */
    width: 250px;       /* Set a fixed width */
    height: 250px;      /* Set a fixed height */
    object-fit: cover;  /* Ensure the image covers the fixed size */
}

.banner {
    clip-path: polygon(0% 5%, 100% 0%, 100% 95%, 0% 100%);
    overflow: hidden;
}

.banner img {
    width: 100%;
    display: block;
}

.navbar-toggler-icon {
    background-color: #EBDBF6 !important; /* Or any color you'd like for the icon bars */
    background-image: none; /* Override Bootstrap's default image, if any */
    width: 24px;
    height: 3px;
    position: relative;
    transition: all 0.3s;
}

.navbar-toggler-icon::before,
.navbar-toggler-icon::after {
    content: '';
    background-color: #EBDBF6; /* Or any color you'd like for the icon bars */
    width: 24px;
    height: 3px;
    position: absolute;
    left: 0;
    transition: all 0.3s;
}

.navbar-toggler-icon::before {
    top: -8px;
}

.navbar-toggler-icon::after {
    bottom: -8px;
}