body {
    width: 98vw;
    margin: auto;
    background-image: url('img/background.jpg');
    background-size: cover;
    background-attachment: fixed;
}

* {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.grid-container {
    display: grid;
    grid-template-columns: 35% 15% 15% 35%;
}


.grid-item {
    width: 100%;
    max-height: 200px;
    padding: 30px;
    overflow-y: scroll;
    background-color: rgb(189, 198, 206);
    /* stroke-width: 1px; */
    /* border-color: black;
    border-radius: 13px;
    border-style: outset; */
    border-radius: 30px;
    box-shadow: 10px 10px 25px #414040;
    -ms-overflow-style: none;
    /* IE and Edge */
    scrollbar-width: none;
    /* Firefox */

    font-size: 25px;
    color: rgb(16, 35, 30);
}

    h1 {
    color:slateblue;
    margin-left: 8%;
    margin-top: 3%;
    /* margin-bottom:3%; */

}

.documentation{
    font-size:2em;
    background: rgba(255, 255, 255, 0.4);

}

#instructions{
    margin-left:30%;
}
#copestone {
    width: 95%;
    margin-left: 2.5%;
    grid-column: 1 / span 4;
    background-color: rgb(203, 203, 203);

}

#twentytwo{
    background-color: rgb(159, 159, 159);

}

#twentyone{
    background-color: rgb(185, 181, 181);

}

#twenty{
    background-color: rgb(139, 139, 139);

}

#nineteen{
    background-color: rgb(196, 192, 192);

}

#eighteen {

    background-color: rgb(200, 200, 200);

}

#seventeen {
    background-color: rgb(157, 155, 155);

    grid-column: 2/span 2;
}

#sixteen {

    background-color: rgb(163, 163, 163);

}

#fifteen{

    background-color: rgb(181, 178, 178);

}

#fourteen{

    background-color: rgb(122, 121, 121);

}

#thirteen{

    background-color: rgb(185, 182, 182);

}

#twelve {

    background-color: rgb(187, 186, 186);

}




#eleven {

    background-color: rgb(187, 186, 186);

}

#ten {

    background-color: rgb(172, 169, 169);

}

#nine {

    background-color: rgb(187, 186, 186);

}

#eight {

    background-color: rgb(185, 185, 185);

}



#third-throughstone {
    background-color: rgb(200, 199, 199);

    grid-column: 1 / span 4;
}

#second-throughstone {
    grid-column: 1 / span 4;
    background-color: rgb(151, 151, 151);

}

#first-throughstone {
    grid-column: 1 / span 4;
    background-color: rgb(219, 218, 218);

}





#halfstone1 {
    grid-column: 1 / span 2;
    background-color: rgb(183, 183, 183);

}

#halfstone2 {
    grid-column: 3/span 2;
    background-color: rgb(167, 167, 167);

}

#sevenagain{
    background-color: rgb(162, 160, 160);

}
#seven{
    background-color: rgb(203, 203, 203);

}
#six{
    background-color: rgb(166, 164, 164);

}
#five{
    background-color: rgb(143, 143, 143);

}

#four{
    background-color: rgb(203, 203, 203);

}

#three {
    grid-column: 2 / span 2;
    background-color: rgb(184, 182, 182);


}

#one{
    background-color: rgb(198, 198, 198);

}

#foundation2 {
    grid-column: 1 / span 2;
    background-color: rgb(144, 142, 142);


}

#foundation1 {
    grid-column: 3 / span 2;
    background-color: rgb(167, 167, 167);

}

#foundation {
    grid-column: 1 / span 4;
    background-color: rgb(120, 119, 119);

}

#footerText {
    color: white;
    width: 200px;
    margin: auto;
    margin-top: 1%;

}







/* ////////////////////////////SCROLLBAR////////////////////////////// */
:-webkit-scrollbar {
    display: none;
    width: none;

}