/*HEADER HEADER - 1ST BODY DIV BOX*/
.scrolledTop #header {
    transition: all 2s;
    height: 100vh;
    width: 100vw;

	display: grid;
	grid-template-areas:
		"hgroup"
		"details"; 
        grid-template-rows: 1fr 1fr;

    background-image: linear-gradient(180deg, #F2EDE7FF, #F2EDE7FF, #F2EDE7FF, #F2EDE7FF, #F2EDE700);
}
#header {
    transition: all 2s;
}

.scrolledTop #header hgroup img {
    transition: all 550ms;
    width: 100vw;
    height: auto;
}#header hgroup img {
    transition: all 700ms;
}

.scrolledTop #header hgroup p {
    display: block;

    text-align: center;
    font-size: 1.5em;
    margin: 0.5em;

    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-variation-settings: "wdth" 100;
}

.scrolledTop #header #detailsBtn {
    display: none; 
}