#page-header {

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-top: 6vh;
}

*:focus {
    outline: none;
}

input:focus {
    outline: none;
}

*:focus {
    outline: 0;
}

textarea:focus,
input:focus {
    outline: none;
}

.form-control:focus {
    border-color: inherit;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.container-fluid {
    --bs-gutter-x: 0;

}

.container-fluid .row {
    --bs-gutter-x: 0;

}

.page-title {
    font-family: "Josefin Sans", sans-serif;
    font-optical-sizing: auto;
    display: flex;
    text-transform: lowercase;
    justify-content: center;
    font-size: 58px;
    letter-spacing: 0.2em;
    font-style: normal;
    font-weight: 400;
    margin-bottom: 4vh;
}

.navbar-toggler:focus {
    /*Below line will remove the border from the icon
    I have used bootstrap icon here */
    /* This will only remove the shadow effect */
    /* Border is still there */
    /* if you don't want any border then set the property equals to zero */
    border: 0 !important;
    box-shadow: none !important;

    /* This will remove the rounded corner(radious-border)
    and give square border */
    /* border-radius: 0 !important; */
}

.navbar-toggler {
    /* This will completely remove border from the icon */
    /* If you need border for the icon then comment this code */
    border: 0 !important;

    /* if you want to check the border please uncomment below code */
    /* border-color: yellow !important; */
}

body {
    text-decoration: none;

    font-family: "Josefin Sans", sans-serif;
    font-optical-sizing: auto;
}

.navbar {
    width: 100%;
    padding-bottom: 10vh;
    text-transform: uppercase;
    justify-content: center;
    /* Centers the menu */
}

.nav-link {
    color: #000000;
    margin-left: calc(5px + 1vw);
    margin-right: calc(5px + 1vw);
}

.nav-item a:hover {
    color: #000000;
    text-decoration: underline;
    transition: all 0.2s;
}

.contact {

    font-family: "Roboto Mono", monospace;
    font-style: normal;
    font-weight: 400;
    font-optical-sizing: auto;
}

.page-title a {
    text-decoration: none;
    color: #000000;
}

.offcanvas-header {
    justify-content: center;
}

@media screen and (min-width: 768px) {

    .navbar-brand {
        display: none;
        width: 100%;
        text-align: center;
        padding: 0;
        margin: 0;
    }
}

/* For small screens */
@media (max-width: 768px) {

    #page-header {
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
    }

    .navbar-toggler {
        position: absolute;
        top: 10px;
        right: 10px;
    }

    .page-title {
        font-family: "Josefin Sans", sans-serif;
        font-optical-sizing: auto;
        text-transform: lowercase;
        margin-bottom: 2vh;
        font-size: 48px;
    }

    .page-title a {
        text-decoration: none;
    }

    .offcanvas-body ul {
        text-align: center;
    }
}

@media screen and (max-width: 768px) {
    .navbar {
        display: flex;
        flex-wrap: wrap;
    }

    .navbar-brand {
        display: block;
        width: 100%;
        text-align: center;
        padding: 0;
        margin: 0;
    }

    .btitle {
        display: none;
    }

    .navbar-toggler {
        display: block;
        margin: 0 auto;
    }
}

.about_blip {
    padding-block: 64px;
    max-width: 960px;
    margin: 0 auto;
    font-family: "Roboto Mono", monospace;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
}

.about_blip p {
    margin: 1em 0;
    padding: 0;
    line-height: 1.4;
}

.phil_about_bottom {
    max-width: 960px;
    margin: 0 auto;
    margin-bottom: 64px;

}

.artist_div {
    max-width: 960px;
    margin: 0 auto;
}

.blackbox p {
    font-size: 19px;
    line-height: 1.4;
}

.blackbox a {
    color: #858D99;
    text-decoration: none;
    font-size: 14px;
    line-height: 4;
}

.col_cardboxes a {

    color: #858D99;
    text-decoration: none;
    font-size: 14px;
    line-height: 4;
}

.collaboration_bottom a {
    color: #858D99;
    text-decoration: none;
    font-size: 14px;
    line-height: 4;
}

.artist_title {
    height: 45px;
    background-color: #f5f5f5;
    line-height: 1.5;
}

.artist_title h2 {

    font-family: "Roboto Mono", monospace;
    font-style: normal;
    font-weight: 400;
    letter-spacing: 0.5em;
    font-size: 14px;
    margin-top: 10px;
    margin-bottom: 10px;

}

.card-text {

    font-family: "Roboto Mono", monospace;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
}

.size-div {

    max-width: 960px;
    margin: 0 auto;
}

.col_cardboxes {
    font-family: "Roboto Mono", monospace;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    display: flex;
    justify-content: center;
}

.col_cardboxes .card {
    border: none;
}

.paypal {
    height: 90px;
    margin: 0 auto;
}