/* Mobile Responsive Overrides Only */

/* tablets =============================================================================================================*/
@media (max-width: 1200px) {
    .foo {
        color: green; /* not used */
    }
}



/* phones ===============================================================================================================*/
@media (max-width: 768px) {

/* content that will not appear on mobile screens */
.nomobile {
    display: none;
}

/* advise user that the screen size they are on might not offer all content */
.suppressed {
    display: block;
    font-size:smaller;
    font-style:italic;
    font-weight:bold;
    color: indigo;
    text-align:center;
}

.principal_container {
    /*width: initial;*/
    flex-direction: column;    /* secondary column goes below primary column rather than aside it */
}


/* On mobile screens, there is essentially just one column, so both sections in it can be wider */
.main { width:90%}
.accessory {
        flex: 1;
        width: 90%;
        border-top: 2px dashed var(--palette-fgreen);
        margin-top: 2em;
}

#accy_column {
    display:none;
}

#torso, #mainbody {
    width: 840px; /* match the width of .hdrback class */
}
.hdrback {
    margin: auto;
    background-image: url('http://www.palmacsoccer.net/header5.gif');
    width:840px;
    height:182px;
}

table.gameresults td.dow {width:5%; overflow:hidden}
    table.gameresults td.date {width:10%; overflow:auto}
    table.gameresults td.time {width:7%; overflow:hidden; white-space: nowrap}
    table.gameresults td.locn {width:4%; text-align:center; overflow:hidden}
    table.gameresults td.opponent {width:21%; min-width:12em; padding-left:.2em; padding-right:0.2em; overflow:auto; white-space: normal}
    /* below, change to overflow:auto and remove white-space:nowrap, in order to wrap lines */
    table.gameresults td.notes {width:37%; overflow-wrap: break-word}
    table.gameresults td.decision {width:4%; overflow:hidden; font-size:small; }
    table.gameresults td.score {width:4%; overflow:hidden; white-space: nowrap; font-size:small; font-weight:bold;}
    table.gameresults td.record {width:8%; overflow:hidden; white-space: nowrap; text-align:center; font-size:small; }

}





/* Older, smaller phones ==============================================================================================*/
@media (max-width: 479px) {
.menuhv li {
    margin: 5px;
    padding:0;
}

#torso, #mainbody {
    width: 100vw;
}

.hdrback {
    margin: auto;
    width: 100vw;
    height:190px; /* PMSC logo fits inside */
}

table.gameresults td.dow_date_time {width:10%; overflow:hidden}
table.gameresults td.locn {width:4%; text-align:center; overflow:hidden; font-size:small;}
table.gameresults td.opponent {width:21%; /*min-width:Xem;*/ padding-left:.2em; padding-right:0.2em; overflow:auto; white-space: normal}
/* below, change to overflow:auto and remove white-space:nowrap, in order to wrap lines */
table.gameresults td.notes {width:37%; overflow-wrap: break-word}
table.gameresults td.decision_score {width:4%; overflow:hidden; font-size:small; }
table.gameresults td.record {width:8%; overflow:hidden; white-space: nowrap; text-align:center; font-size:small; }

}