|
|
Line 1: |
Line 1: |
| /* All CSS here will be loaded for users of the mobile site */ | | /* All CSS here will be loaded for users of the mobile site */ |
|
| |
|
| @media only screen and (max-width: 768px) {
| |
| /* Hide desktop content, show mobile content */
| |
| .content-desktop {
| |
| display: none !important;
| |
| }
| |
|
| |
| .content-mobile {
| |
| display: block !important;
| |
| }
| |
|
| |
| /* Additional mobile-specific adjustments */
| |
| .content-mobile table {
| |
| width: 100%;
| |
| }
| |
|
| |
| .content-mobile th,
| |
| .content-mobile td {
| |
| padding: 0.5em;
| |
| }
| |
|
| |
| /* Make sure tables on mobile are properly sized */
| |
| .content-mobile th {
| |
| width: 100% !important;
| |
| }
| |
|
| |
| /* Adjust font sizes for better mobile readability */
| |
| .content-mobile {
| |
| font-size: 0.95em;
| |
| }
| |
|
| |
| /* Ensure proper spacing on mobile */
| |
| .content-mobile div {
| |
| margin: 1em auto;
| |
| }
| |
| }
| |
|
| |
|
| .infobox { | | .infobox { |
/* All CSS here will be loaded for users of the mobile site */
.infobox {
position: relative !important;
width: 100% !important;
float: none !important;
clear: both !important;
margin: 0 auto !important;
}