@media screen,projection { html { background: #fffef0; color: #330000; } body { max-width: 35em; margin: 0 auto; } } @media print { .class { color: blue; } .class .sub { width: 42; } .top, header > h1 { color: #444444; } } @media screen { body { max-width: 480; } } @media all and (orientation:portrait) { aside { float: none; } } @media not screen and (color),print and (color) { body { margin: 0 auto; } } @media (min-width:768px)and (max-width:979px) { .hidden-desktop { display: none !important; } } @media (min-width:12px) { body { margin: 0 auto; } } @media (width:767px) { .visible-xs { display: block; } } @media only screen and (min--moz-device-pixel-ratio:2.5),only screen and (-o-min-device-pixel-ratio:2),only screen and (min-device-pixel-ratio:2),only screen and (min-resolution:192dpi),only screen and (min-resolution:2dppx) { background-size: 10px; } @media (width:768px) { .lead { font-size: 21px; } } @media (width:400px) { .one { font-size: 1.2em; } } @media (width:400px) and print and (color) { .one { color: blue; } } .two { width: 100px; } @media (width:400px) { .two { font-size: 1.2em; } } @media print and (color) { .two { color: blue; } } @media print { .visible { color: green; } } @media screen { .visible.visible-sm { color: green; } } @media (max-width:10px) { .navbar .form { margin-bottom: 5px; } }