Hi, I am looking to build a website in custom CSS and without frameworks just to increase my command over CSS. I want my entire site to retain its layout and look no matter what the device. Foundation does it with it's "smallgrid" and bootstrap with ".col-xs-". How do I do that without a framework?
Just so I understand you correctly -- you want your site to retain its layout (presumably with as much consistency as possible) whether the device is landscape/portrait, regardless of width, height, or useragent?
While I've no clue what "Foundation", "smallgrid", bootstrap with ".col-xs-" etc mean.
If you want all (modern) devices and browsers to show the same, then that's the easy part in CSS ;-) Making a different layout for smaller devices (i.e. the smart thing to do nowadays!) is actually a bit (not that much) more work.
... but making it retain its layout (presuming you mean: look exactly the same) is not only a bad idea, it's impossible.
Sites should look like they are designed for the medium used to view them. That means vastly different layout, look, content, and functionality between viewing on a smartphone and using an Ultra-HD monitor.