/* SCREEN.960.CSS This file loads after screen.core.css and extends the rules in that file. Styles in this file are intended to operate from 960px up to 1920px. -------------------------------------------------------------------------------------------------------------------------- FILE INFO Last updated: 2013/04/10 Last updated by: Stuart Brown ----------------------------------------------------------------------------------------------------------------------- */ .home { /* paper */ background-image: url(../images/960/html.jpg); background-position: 50% 0px; } /* fix a freaking annoying iPad behaviour, where the OS downscales large images used as background on and makes them the width of the iPad. If you use background-size to force it to the right size, the iPad then up-scales a down-sampled version of the image, and it's as blocky as hell. So, just send a custom 1024 width image for the device, which stops triggering the re-scale behaviour. Ugh. */ @media (max-device-width: 1024px) { body.home { background-image: url(../images/960/ipadbgnd.jpg); } } #site_context { height: 800px; } #site_context .container { position: relative; height: 800px; max-width: 960px; margin: 10px auto; } h1 { font-size: 2em; font-size: 2rem; line-height: 1.5; } h3 { margin-top: 40px; } /* wide nav! */ ul.nav { position: absolute; top : 30px; left: 300px; margin: 0; width: auto; height: auto; background: none; z-index: 2; list-style-type: none; font-size: 26px; line-height: 30px; } ul.nav a { position: absolute; top: 0; left: 0; display: block; width: 150px; height: 58px; } ul.nav a[href="http://acww.com.au/catalog/index.php?main_page=index&cPath=21"] { left: 155px; } ul.nav a[href="nnews.html"] { top: 0px; left: 312px; } ul.nav a[href="ncontact.html"] { top: 0px; left: 471px; } .summary-board { position: absolute; left: 20px; top: 150px; margin: 0; width: 300px; } /* main_image */ .main_image{ position: absolute; left: 280px; top: 120px; width: 650px; height: 500px; margin: 0 auto;} .introImage320 { height: 0px;} .introImage480 { height: 0px;} .introImage750 { height: 0px;} .introImage960 { height: 489px;} /* contact section */ .contact_area{ position: absolute; left: 280px; top: 70px; width: 650px; height: 500px; margin: 0 auto;} .contact_area p { margin-bottom : 20px; } /* About Us section */ #about_context { height: 890px; } #about_context .container { position: relative; height: 890px; max-width: 960px; margin: 0px auto; } .about_area { position: absolute; left: 290px; top: 50px; width: 635px; height: 800px; } /* gold wheel 750 size */ .gold_wheel{ position: relative; width: 730px; height: 380px; margin: 0 auto; padding-top: 0px; } /* add some spacing */ #news { margin-bottom : 9em; } /* bump the font size so it's more readable on larger screens (which are further away then handhelds) */ @media (min-width: 960px) { html { font-size: 110%; } .multi-content h2, .tweet { padding-top: 3em; } } /* footer*/ .footer { width: 940px;