* {
    margin: 0px;
}

html, body {
    background-color: gainsboro;
    height: 100%;
}

.center-frame {
    padding: 10px;
    min-width: 300px; 
    max-width: 400px; 
    background-color: white;

}

#whatday {
 border-style: none;
 background-color: white;
}

.grid-container {
    display: grid;
    grid-template-rows: 1fr 1fr 10fr 3fr;
    row-gap: 10px;
}

.contents {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: 5px;
    row-gap: 5px;
}

.paymentMethod {
    display: grid;
    grid-template-rows: 1fr 1fr;
}

.total {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.left-total {
    display: grid;
    grid-template-rows: repeat(3, 1fr);
}

dialog {
    position: fixed;
    top: 100px;
    left:100px;
}