/* Square-edged quote boxes for a pencil-drawn look */
.quote-box {
    background-color: #f4f4f4; /* Light grey background for a soft, sketched appearance */
    position: relative;
    text-align: left;
    border-left-width: 5px;
    border-left-style: solid;
    border-left-color: #9e9e9e; /* Darker grey for the left border, mimicking pencil shading */
    padding: 20px 10px 20px 16px;
    border-radius: 0; /* Keeps square edges */
    border-top-width: 2px;
    border-right-width: 2px;
    border-bottom-width: 2px;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-top-color: #9e9e9e; /* Matching grey for the top border */
    border-right-color: #9e9e9e; /* Matching grey for the right border */
    border-bottom-color: #9e9e9e; /* Matching grey for the bottom border */
}

.quote-content {
    color: #2e2e2e; /* Dark grey for text, resembling graphite */
    margin-top: 5px;
    margin-bottom: 5px;
    position: relative;
    z-index: 1;
    line-height: 2.0;
}

.quote-content, .bold {
    font-weight: bold;
}

main .quote-box p {
    line-height: 1.3; /* Adjust the value as needed */
}

.quote-cite {
    position: relative;
    z-index: 1;
    text-align: left;
    font-size: 16px;
    font-style: italic;
    color: #4f4f4f; /* Slightly lighter grey for citation, adding depth */
}

.quotation-mark {
    width: 40px;
    height: auto; /* Preserves the aspect ratio */
    filter: grayscale(100%); /* If using an image, convert it to greyscale */
}

.quote-cite span {
    color: #4f4f4f; /* Consistency in citation color */
}

/* Square or rounded boxes for general text with pencil-like aesthetics */
.text-box {
    background-color: #f4f4f4; /* Light grey background for a soft, sketched appearance */
    /* background-color: #ebebeb;  Light grey, similar to pencil shading on paper */
    border: 2px solid #8e8e8e; /* 2px solid border */
    /* border: 2px solid #9e9e9e; /* Solid grey border mimicking pencil lines */
    border-radius: 0px;
    /* border-radius: 10px;  Subtle rounded edges for a softer look */
    padding: 0 16px 0 16px;
    font-size: 16px;
    color: #000000;
    /* color: #2e2e2e; /* Text color in dark grey */
}

.large-text {
    font-size: 24px; /* Adjust as needed for larger text */
    color: #000000; /* Black color for larger text */
    margin-left: 20px; /* Space between the quote box and the large text */
}

.no-decoration {
    text-decoration: none !important;
    color: inherit; /* Keeps link colors consistent with the text */
}