body {background: white;
    color: white;
    font-family: "arial";
    background-attachment: fixed;
    margin: 0;}
    
#wrapper {display: grid;
    grid-auto-rows: minmax(0px, 200px);
    grid-template-columns: minmax(0px, 1fr) repeat(6, minmax(0, 175px)) minmax(0px, 1fr);
    }

    nav h1 a {line-height: 200%;
    background-repeat: no-repeat;
    padding-left: 0;
    height: 40px;
    margin: 0;
    text-align: left;
    grid-row: 1 / 2;
    grid-column: 1 / 2;
    }
    
    nav {font-weight: bold;
    position:relative;
    top: 0;
    grid-row: 1 / 2;
    grid-column: 2 / 8;
    }
    
    nav a {text-decoration: none;
    color: black;
    padding: 1rem 0rem;
    display: block;
    text-align: center;
    }
    
    nav a:hover {
        color: #8c8c8c;
    }
    
    nav ul {
    list-style-type: none;
    margin: 0;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
    display: flex;
    flex-flow: row nowrap;
    grid-row: 1 / 2;
    grid-column: 4 / 8;
    }
    
    nav ul li{width: 100%;
    }

    #first {color: black;
    position: relative;
    text-align: left;
    grid-row: 2 / 3;
    grid-column: 2 / 4;
    }

    #firstpar {color: black;
    position: relative;
    grid-row: 2 / 3;
    grid-column: 2 / 4;
    }

    #secondpar {color: black;
        position: relative;
        grid-row: 4 / 5;
        grid-column: 6 / 8;}
    
    #second {color: black;
        position: relative;
        grid-row: 4 / 5;
        grid-column: 6 / 8;}

    #dumbell {
        background-image: url("dumbell.jpg");
        height: 400px;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        grid-column: 5 / 8;
        grid-row: 2 / 5;}

    #guy {background-image: url("guy.jpg");
        height: 400px;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        grid-column: 2 / 5;
        grid-row: 4 / 9;}


    #button1{width: 10rem;
        position: relative;
        grid-row: 2 / 3;
        grid-column: 2 / 4;
        background-color: #5e8fff;
    }

    #button2{width: 10rem;
        position: relative;
        grid-row: 4 / 5;
        grid-column: 6 / 8;
        background-color: #5e8fff;}

    * {box-sizing: border-box;}

    @media only screen and (max-width: 992px){
        #wrapper {grid-template-columns: minmax(0px, 1fr) repeat(6, minmax(0, 150px)) minmax(0px, 1fr);}
    }

    @media only screen and (max-width: 768px){
        #wrapper {grid-template-columns:repeat(6, minmax(0, 100%))}
    }