body {
    background-color:black;
    font-family: arial;
    color:white;
}

nav, main, section, footer {
    border: 1px #08a2bf solid;
}

.box {
        max-width: 1000px;
        margin: 50px auto;
        display:grid;
        grid-gap: 10px;
        grid-template-columns: 200px 550px minmax(0, 1fr);
        padding: 20px;
    
        text-align: center;
}

header {
    grid-row: 1 / 2;
    grid-column: 1  / 4;
}
#price {
    color: yellow;
}

nav {
    grid-row: 2 / 3;
    grid-column: 1 / 2;
    padding: 5px;
    max-height: 475px;
}
button {
    width: 170px;
    color: white;
    background-color: black;
    border: 1px #08a2bf solid;
    
    padding: 2px;
    margin: 2px;
}

main {
    grid-row: 2 / 3;
    grid-column: 2 / 4;
    overflow-y: auto;
    max-height: 500px;
}
#maintop {
    display: flex;
    margin: 10px;
    
    text-align: left;
    text-indent: 20px;
    
    overflow-x:clip;
}
#squip {
    align-content: right;
    width: 500px; height: auto;
    rotate: -20deg;
}
.mtdew {
    width:20%;
    padding: 10px;
    transition: all ease-in-out .5s; 
}
.mtdew:hover {
    transform: scale(1.2);
    
}

section {
    grid-row: 3 / 4;
    grid-column: 1 / 4;
    
    overflow-x: auto;
    max-height: 300px;
    padding: 2px;
}
#box2 {
display: grid;
grid-column-gap: 15px;
padding: 2px;
align-content: center;
}

#review1 {
    grid-row: 1 / 2;
    grid-column: 1 / 2;
}
#review2 {
    grid-row: 1 / 2;
    grid-column: 2 / 3;
}
#review3 {
    grid-row: 1 / 2;
    grid-column: 3 / 4;
}
#review4 {
    grid-row: 1 / 2;
    grid-column: 4 / 5;
}

.reviewpic {
    height: 100px;
    width:100px;
    transition: all ease-in-out .5s;
}
.reviewpic:hover {
    transform:scale(1.2);
}


footer {
    grid-row: 4 / 5;
    grid-column: 1 / 4;
}