.container {
    margin-left: auto;
    margin-right: auto;
    padding: 10px;
    max-width: 600px;
    justify-content: center;
    word-wrap: break-word;
}

body {
    background-color: white;
}

.content {
    font-family: 'Cabin'; 
}

.indent {
    text-indent: 30px; /* Indents the entire block by 30px */
}


/*
    Sets the font size and boldness
*/
.title {
    font-size: 17px;
    font-weight: 600;
    padding-bottom: 12px;
}

.underline {
    text-decoration: underline;
}

.paragraph {
    font-size: 16px;
}

/*
    Ensures the information is displayed in a grid-like manner
*/
.grid-container {
    display: grid;
    grid-template-columns: auto auto auto;
    justify-content: center;
}

/*
    Adds a case for when the screen size is small enough
    and adjusts the grid layout
*/
@media (max-width: 600px) {
    /*.grid-container { grid-template-columns: repeat(2, 1fr); } */
    .grid-container { grid-template-columns: repeat(2, 0fr);}
}

.grid-item {
    padding: 20px;
}

/* Styles for the REVIEWS section -- 2 columns instead of 3 */

.flex-container {
    display: grid;
    grid-template-columns: 80px 1fr; /* Fixed width for the date, remaining space for description */
    column-gap: 10px; /* Space between date and description */
    padding-bottom: 20px;
}

.review {
    font-size: 16px;
    flex-grow:1; 
    word-wrap: break-word; 
}

.h4{
    text-indent: 30px;
    padding-bottom: 10px;
}



.date {
    white-space: nowrap; 
    padding-right: 5px;
    text-align: left;
}

@media (max-width: 600px) {
    .flex-container {
        grid-template-columns: 1fr;
    }
}