html {
    scroll-behavior: smooth;
}

#top {
    position: relative;
    top: 0vh;
}

body {
    margin: 0;
    overflow-x: hidden;
    overflow-y: scroll;
    height: 100vh;
    background-color: #f4f4f4;
}

#fixed-top-background{
    background-color: #181818;
    color: white;
    margin: 0;
    top: 0;
    right: 0;
    
    width: 100vw;
    height: 14vh;

    position: fixed;
    
    z-index: 3;
}

#title-background {
    width: 100%;
    height: 30vh;
    background-color: #181818;
    border-bottom: 1.220703125vw solid #B070F4;
}

#title {
    color: white;
    margin: 0;
    padding-top: 15vh;
    justify-content: center;
    align-self: flex-end;
    
    display: flex;
    
    font-family: trebuchet ms;
    font-size: 2.5vw;
    
    position: relative;
}

#date-range{
    color: white;
    margin: 0;
    padding-top: 2vh;
    justify-content: center;
    align-self: flex-end;
    
    display: flex;
    
    font-family: trebuchet ms;
    font-size: 1.5vw
}

/*      body stuff      */


#body-content{
    width: 60vw;
    margin: auto;
    padding-bottom: 5vh;
}

#contact-bar-background{
    padding-top: 1vh;
    background-color: #181818;
}

#first-row{
    height: 40vh;
    width: 60.vw;
    margin-top: 5vh;
    margin-bottom: 5vh;
    align-items: center;
    display: flex;
}

#p1{
    font-family: trebuchet ms;
    
    font-size: 1.171875vw;
    
    width: 50%;
    
    line-height: 180%;
    
    margin-top: 5vh;
    
    float: left;
}

#assembly-image{
    width: 48%;
    margin-left: 2vw;
    float: right;
    border: 5px solid black;
}

#p2{
    font-family: trebuchet ms;
    
    font-size: 1.171875vw;
    
    line-height:180%;
    
    margin-bottom: 5vh;
}

#p3{
    font-family: trebuchet ms;
    font-size: 1.171875vw;
    line-height: 180%;
}

#image-grid{
    width: 60vw;
    margin: auto;
    
    display: grid;

    margin-top: 5vh;
        
    grid-template-columns: 29vw 29vw;
    grid-column-gap: 2vw;
    
    grid-template-rows: auto;
    grid-row-gap: 5vh;
    
    margin-bottom: 5vh;
}

.image-cell {
    width: 29vw;
    height: 40vh;
    
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    
    opacity: 1;
    z-index: 2;
    
    border: 5px solid black;

}

#button-div{
    justify-content: center;
    display: flex;
    margin-bottom: 5vh;
    
    height: 5vh;
}

#back-button{
    width: 20vw;
    
    font-family: trebuchet ms;
    font-size: 0.9765625vw;
    border-radius: 0.48828125vw;
}

#back-button:hover{
    border: 5px solid #B070F4;
    transform: scale(1.1);
}