body {
    display: grid;
    grid-template-rows: auto 1fr auto;
    min-height: 100vh;
    background-color: rgb(246, 245, 250);
}

.iconwidth {
    width: 30px;
}

.introDivPadding {
    padding: 5px;
}

.largeBoldFont {
    font-size: large;
    font-weight: bold;
}

.footer-span {
    color: rgb(247, 241, 241);
}

.centerDiv {
    display: flex;
    justify-content: center;
}

.tabTextColor {
    color: #220fec;
}

.center {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

footer {
    padding: 5px;
    padding: 15px;
    font-size: smaller;
}

.imageCenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 30%;
}

.aboutTitles {
    color: white;
    background-color: rgb(139, 65, 4);
    text-align: center;
}

.cardBackground {
    background-color: azure;
}

.headerStyle {
    text-align: center;
    background-color: gainsboro;
}

.imageLeft {
    float: left;
    width: 180px;
    margin-right: 10px;
}

.imageRight {
    float: right;
    width: 180px;
    margin-left: 10px;
}

hr {
    height: 2px;
    border-width: 0;
    color: gray;
    background-color: gray;
}

legend {
    display: block;
    padding-left: 5px;
    padding-right: 5px;
    border: none;
    width: auto;
    font-size: medium;
}

fieldset {
    border-style: solid;
    border-color: rgb(7, 79, 146);
    border-width: thin;
    background-color: cornsilk;
}


/* Style the tab */
.tab {
    margin-right: 30px;
    width: 100%;
    padding-right: 5px;
}

/* Style the buttons inside the tab */
.tab button {
    background-color: inherit;
    color: black;
    padding-top: 16px;
    border: none;
    outline: none;
    text-align: left;
    cursor: pointer;
    transition: 0.3s;
    font-size: 15px;
}

/* Change background color of buttons on hover */
.tab button:hover {
    background-color: #ddd;
}

/* Create an active/current "tab button" class */
.tab button.active {
    background-color: #ccc;
}

/* Style the tab content */
.tabcontent {
    /* float: inline-start; */
    padding: 5px 20px;
    /* border: 1px solid #ccc; */
    /* width: 80%; */
    border-left: 15em;
    min-height: 100vh;
}

.doc-href {
    font-weight: bold;
    color: darkblue;
    padding: 10px;
    font-size: large;
}

#title {
    padding: 5px;
    text-align: center;
    color: darkblue;
    font-family: "Lobster", "Dancing Script", "Pacifico", cursive;
}

.doclist {
    list-style-type: square;
    color: orange;
}

.centertext {
    text-align: center;
}

.boldfont {
    font-weight: bold;
}

.nodisplay {
    display: none;
}

.paddingright20 {
    padding-right: 20px;
}

.paddingleft20 {
    padding-left: 20px;
}

.paddingleft05 {
    padding-left: 5px;
}

.floatright {
    float: right;
}

.darkbluecolor {
    color: darkblue;
}

.popup {
    display: none;
    /* Hidden by default */
    position: fixed;
    /* Stay in place */
    z-index: 1;
    /* Sit on top */
    left: 0;
    top: 0;
    width: 100%;
    /* Full width */
    height: 100%;
    /* Full height */
    overflow: auto;
    /* Enable scroll if needed */
    background-color: white;
    opacity: 0.9;
    justify-content: center;
    /* Center popup content horizontally */
    align-items: center;
    /* Center popup content vertically */
}

.popup-content {
    max-width: 80%;
    max-height: 80%;
    transition: transform 0.25s ease;
}

.close {
    position: fixed;
    /* Fix position to the popup container */
    top: 20px;
    right: 35px;
    color: black;
    font-size: 40px;
    font-weight: bold;
    transition: 0.3s;
    z-index: 2;
    /* Ensure it stays on top of the image */
}

table {
    margin-left: auto;
    margin-right: auto;
}

table td {
    text-align: left;
    padding-left: 5px;
    font-weight: bold;
}

.right-button {
    float: right;
}

thead {
    font-family: Arial, sans-serif;
    /* Sets the font type */
    font-size: 18px;
    /* Sets the font size */
    font-weight: bold;
    /* Makes the font bold */
    color: #333;
    /* Sets the text color */
    background-color: #dbe2f4;
    /* Sets the background color */
    text-transform: uppercase;
    /* Converts text to uppercase */
    text-align: left;
    /* Aligns text to the left */
    padding: 10px;
    /* Adds padding for spacing */
}