I am attempting to override some CSS in an Internet theme and have encountered syntax that I have never seen before and that I do not understand. I give an example from the theme:

@media screen and(max - width: 768 px) {
    .wy - tray - container {
        bottom: auto;top: 0;width: 100 %
    }.wy - tray - container li {
        width: 100 %
    }
}

I see this pattern several times in the theme, sometimes 200-300 lines long and I have been unable to find anything that explains what is going on. Can anyone suggest some documentation that may explain this syntax. It looks like it is trying to add detail to a selector, but that is my only guess. Specifically, everything following }.wy is new to me. I cannot figure out what this CSS is trying to specify.