html,
body {
    background-color: #5BCEFA;
    padding: 0;
    margin: 0;
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    flex-basis: auto;
    font-size: 15pt;
    font-family: "Playfair Display", serif;
    font-optical-sizing: auto;
    overflow: scroll;
}

main {
    padding: 1%;
    background-color: #FFFFFF;
    display: flex;
    flex-grow: 1;
}

.embedded-header {
    background-color: #F5A9B8;
    margin: 0;
    padding: 0;
    border: none;
    min-width: 100%;
    img {
        display: inline;
        float: right;
    }
}

.embedded-footer {
    background-color: #F5A9B8;
    margin: 0;
    padding: 0;
    flex-shrink: 1;
}

.iframe-header {
    border: none;
    margin: 0;
    padding: 0;
    width: 100%;
    flex-shrink: 1;
   
}

.head-wrapper{
    border: none;
    height: auto;
    min-width: 100%;
    min-height: 85px;
    max-height: 20%;
    display: flex;
}

.foot-wrapper{
    border: none;
    height: auto;
    min-width: 100%;
    max-height:55px;
    display: flex;
}

.center {
    margin: auto;
    width: 95%;
}

.center-image {
    img {
        display: block;
        margin-left: auto;
        margin-right: auto;
        max-width: 50%;
    }
}

.lock-height {
    min-height: 100%;
    max-height: 100%;
    margin: 0;
}

.large-bullet {
    font-size: 22pt;
}

.nav-bar {
    font-size: clamp(15pt, 2.5vw, 22pt);
    color: black;
}

.nav-bar a:visited {
    background-color:#5BCEFA;
    color: black;
}

.nav-bar a:link {
    background-color:#5BCEFA;
    color: black;
}

.nav-bar a:hover {
    background-color:#FFFFFF;
    color: black;
}

.main-title {
    font-size: clamp(15pt, 3vw, 25pt);
    width: 100%;
}