/* Local font inclusion */
@font-face {
    font-family: 'Ziwzz';
    src: url('zwizz-cufonfonts-webfont/Zwizz-Regular.woff')format('woff'); 
}

@font-face {
    font-family: 'Queen';
    src: url('queen-cufonfonts-webfont/Queen.woff')format('woff'); 
}

body {
    font-family: 'Ziwzz', sans-serif;
    background-color: #f5f5f5;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Queen', sans-serif;
}

.logo-placeholder {
    width: 50px;
    height: 50px;
    background-color: gray;
    margin-right: 15px;
}

.navbar {
    padding: 0.5rem 1rem; /* You can adjust this to your liking. This reduces the top and bottom padding to 0.5rem and keeps left-right padding to 1rem. */
}

/* Adjust logo within the navbar if needed. */
.navbar-brand img.navbar-logo {
    height: 40px; /* This sets a height to the logo. Adjust based on your actual logo's aspect ratio and desired appearance. */
    width: auto; /* This ensures the logo maintains its aspect ratio. */
    margin-right: 0.5rem; /* Adds a little space to the right of the logo. Adjust if needed. */
}

.navbar-light .navbar-toggler-icon {
    background-color: #311f5d;
}

.nav-link {
    color: #311f5d !important;
}

.nav-link:hover {
    color: white !important;
    background-color: #311f5d;
    border-radius: 5px;
    transition: color 0.3s, background-color 0.3s;
}

.dark-purple-container {
    background-color: #311f5d;
    height: 100vh;
}

.centered-logo {
    max-width: 65%;
}
.white-container {
    background-color: white;
}

.roundish-square {
    width: 300px;
    height: 300px;
    border-radius: 25%;
    overflow: hidden;
}

.about-text {
    max-width: 50%;
}