/*Phone and tablets?*/
/*Override some of the existing desktop styles, which I view as the default view; mobile is secondary*/
@media only screen  and (min-width:320px) and (max-device-width : 1223px) {
    body {
        --subtitle-offset: 0.3em;
    }

    #meta-info {
        writing-mode: lr;
        font-size: 1.8em;
    }

    #header-content {
        grid-row: 2;
        grid-column-start: 1;
        grid-column-end: 4;
        margin: 2em;
    }

    #header-name {
        font-size: 14em;

    }

    .header-subtext {
        font-size: 4em;
    }

    /*Navigator buttons*/
    .navigator {
        font-size: 2.5em;
        border: 0.22em solid var(--off-white);
        margin: 1.5em;
    }

    .navigator:hover {
        border: 0.22em solid var(--highlight-color);
    }

    #academic-nav {
        grid-row: 3;
        grid-column-start: 1;
        grid-column-end: 4;
    }

    /*ACADEMIA PAGE*/
    #academia-back-nav {
        font-size: 4rem;
        grid-row: 1 / span 4;
        grid-column: 1 / -1;
        align-self: start;
        justify-self: center;
        margin: 1rem;
    }

    .aca-header{
        grid-column: 2 / -1;
        -ms-grid-row-span: 6;
        font-size: 2em;
    }

    .twitter, .researchgate{
        font-size: 2em;
    }

    .aca-current{
        grid-row-start:8;
        grid-column: 2 / -1;
        font-size: 2em;
    }

    .aca-projects{
        grid-row-start: 10;
        font-size: 2em;
        grid-column: 2 / -1;
    }

    .aca-publications{
        font-size: 3em;
        grid-row-start: 11;
    }

    .mobile-newline{
        display: none !important;
    }


}