body {
    background: url('fishybits/fishbg.gif');
    padding-left:10%;
    padding-right:10%;
    padding-top:5%;
    cursor: url('fishybits/cursor.ico'), auto;
    
}

.press-start-2p-regular {
    font-family: "Press Start 2P", system-ui;
    font-weight: 400;
    font-style: normal;
    color:rgb(52, 50, 50);
}

.dotgothic16-regular {
    font-family: "DotGothic16", sans-serif;
    font-weight: 400;
    font-style: normal;
    color:rgb(52, 50, 50);
}


.parent {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-template-rows: repeat(9, 1fr);
    gap: 4px;
    margin: 2%;
}
    
.top {
    grid-column: span 8 / span 8;
    grid-row: span 6 / span 6;
    grid-column-start: 3;
    grid-row-start: 3;
    font-family: "Press Start 2P", system-ui;
    text-align: center;
    
}

.big {
    grid-column: span 8 / span 8;
    grid-column-start: 3;
    grid-row-start: 2;
    background: rgba(173, 216, 230, 0.427);
    background-image: url('fishybits/fishbox.png');
    background-repeat: repeat;
    background-position: center;
    padding: 2%;
    border-radius: 2%;
    font-family: "DotGothic16", monospace;
}

h1, h2, h3 {
    font-family:"Press Start 2P", monospace;
}


hr {
    width: 75%;
    margin-top: 1%;
    background-color: darkblue;
}

input {
    margin: 2%;
    width: 10%;
    background: rgb(192, 237, 237);
    border-width: 1px;
    border-color: aliceblue;
    font-family: "DotGothic16";
    border-radius: 10px;
    }

    .bubbles {
        align-items: center;
        align-content: center;
        justify-content: center;
        justify-items: center;
        padding-left: 2%;
    }

    button {

        background: rgb(204, 231, 254);
        border:rgb(130, 167, 227);
        font-family: "Press Start 2P"
        
    }