/* Must be at the top of your stylesheet*/ html { -webkit-font-smoothing: antialiased; /* Fix for webkit rendering */ -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } /* Basics */ /*========*/ /* forces the vertical scrollbar for a consistent page width */ html { overflow-y:scroll; } /* allows LT IE9 to style HTML5 elements */ article,aside,details,figcaption,figure, footer,header,hgroup,menu,nav,section { display:block; } /* use em for font sizing to cater for different mobile screen densities */ body { font-size:0.9em; font-family:"Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Arial, sans-serif; } nav { height:auto; } img { border:0; } /*=========================================================*/ /* Mobile-first: the default styles are for mobile devices */ /*=========================================================*/ section p { margin:1em 0; line-height:140%; } section h1, section h2, section h3 { background-image:url('../images/right-arrow-org.png'); background-position:left; background-repeat:no-repeat; padding-left:25px; margin:1em 0; } section ol { margin-left:25px; line-height:150%; } section ul { margin-left:10px; line-height:150%; } header h1 { margin-top:0.6em; margin-left:0px; } footer { font-size:0.8em; } nav a { display:inline-block; margin-bottom:8px; margin-right:5px; border:1px solid gray; padding:2px; font-size:100%; color:#000; background-color:silver; text-decoration:none; } nav a.active { background-color:#99CCFF; } nav a:hover { color:#cc6600; } h1 { font-size:1.5em; } header h1 { padding-top:10px; } /* Mobile (Landscape) */ @media only screen and (min-width: 480px) and (max-width: 767px) { } /* Tablet (Portrait) and upwards */ @media only screen and (min-width: 768px) { section ul, section ol { margin-left:30px; } header h1 { margin-left:20px; } nav a { color:#8E9090; text-decoration:none; padding-right:15px; font-size:90%; display:inline; border:0; background-color:transparent; line-height:2.2em; } nav a.active { color:#000000; font-weight:bold; } nav a:hover { color:#CC6600; } }