* {
    box-sizing: border-box;
    margin    : 0px;
    padding   : 0px;
}


body {
    font-family: 'Open Sans', Arial, sans-serif, helvetica;
}

a {
    color          : #600;
    text-decoration: none;
}

.p1 {
    padding: 1rem;
}

.pt1 {
    padding-top: 1rem;
}

.wrapper {
    font-family          : 'Open Sans', Arial, sans-serif, helvetica;
    height               : 100vh;
    text-align           : center;
    display              : grid;
    grid-template-columns: repeat(3, 1fr);
    /* gap               : 1vw; */
    grid-auto-rows       : 33vh;
    grid-template-areas  :
        "a b d"
        "a p d"
        "f c e";
}

@media only screen and (max-width: 768px) {

    /* For mobile phones: */
    .wrapper {
        grid-template-areas:
            "a b d"
            "p p p"
            "c c e";
    }

    h1 {
        font-size: 1.5rem;
    }
}

.content {
    grid-area   : c;
    align-self  : center;
    justify-self: center;
}


#pano360 {
    grid-area   : p;
    padding     : 0;
    align-self  : center;
    justify-self: center;
}

#pano360 a {
    color          : #600;
    text-decoration: none;
    font-weight    : 600;
    font-size      : 3rem;
}

#b_r {
    grid-area    : e;
    padding      : 0;
    align-self   : end;
    justify-self : end;
    padding-right: 1rem;
}

.center {
    text-align: center;
}