/*^ colors----------------------------------------------------------------*/
:root {
    --whiteishBlue: #e9f6fb;
    --paleBlue: #bee4f3;
    --middleBlue: #4b6381;
    --darkestBlue: #10151b;
}

body {
    background-color: var(--middleBlue);
    color: var(--whiteishBlue);
}

header,
footer {
    background-color: var(--darkestBlue);
    color: var(--paleBlue);
}

/*^  end colors--------------------------------------------------------------*/

/** font ------------------------------------------------------------------*/
body {
    font-size: 14pt;
    font-family: 'Times New Roman', Times, serif;
    font-style: italic;
    text-align: center;
}

footer {
    font-size: smaller;
}

/** end font--------------------------------------------------------------*/

/*? margins and other stuff----------------------------------------------------*/
body {
    margin: 0px;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

main {
    margin: 1em;
    padding: 1em;
}

.examplePics {	
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2em;
	/* width: 80vw;
	margin: auto; */
    flex-wrap: wrap;
}

.examplePics>img {
    height: 500px;
    width: 500px;
    border-style: solid;
    border-width: 2pt;
    border-color: var(--paleBlue);
    margin: 2em;
}

.flowerBox {
    background-image: url("../pics/blue flower background.jpg");
    background-size: contain;
    width: 80vw;
    height: 80vw;
    min-width: 500px;
    min-height: 500px;
    margin: auto;
}

.flowerText {
    width: 100%;
    height: 100%;
    margin: 0%;
}

header,
footer {
    padding: 2em;
}

footer {
    margin-top: auto;
}


/*? end margins and other stuff-----------------------------------------------*/