#billboard { position:absolute; top:0; right:0; bottom:292px; left:0; overflow:hidden; }
#billboard .gallery { position:absolute; top:0; right:0; bottom:0; left:0; }
#billboard .gallery-view { height:100%; }
#billboard .hero { position:absolute; top:0; right:0; bottom:0; left:0; background:#fff; }

#billboard.noscript .hero { display:none; }
#billboard.noscript .yosemite { display:block; }

#billboard .hero .small,
#billboard .hero .large { margin:0 auto; }

#billboard .hero .header { position:relative; overflow:hidden; margin:0 auto; width:1024px; text-align:center; }

#billboard .hero .hero-image { display:block; position:absolute; left:50%; background-repeat:no-repeat; background-position:center center; }

/* iOS 8 */
#billboard .hero.ios8 .hero-image { width:1042px; height:874px; margin-left:-293px; margin-top:-167px; top:20%; background-size:1042px 874px; }
#billboard .hero.ios8 .header { position:absolute; left:50%; margin-left:-512px; top:20%; text-align:left; padding-left:18px; }
#billboard .hero.ios8 .header img { margin-left:0; }
#billboard .hero.ios8 .title { margin:34px 0 8px; }
#billboard .hero.ios8 h2 { margin-bottom:8px; }

#billboard .hero.ios8 .large { display:none; }
#billboard .hero.ios8 .small { display:block; }

/* OS X Yosemite */
#billboard .hero.yosemite .hero-image { width:1308px; height:320px; margin-left:-654px; top:49%; background-size:1308px 320px; }
#billboard .hero.yosemite .header { position:absolute; left:50%; margin-left:-512px; top:11%; }
#billboard .hero.yosemite .title { margin:10px 0 3px; }

#billboard .hero.yosemite .large { display:none; }
#billboard .hero.yosemite .small { display:block; }

/* large desktop & ipad portrait */
@media only screen and (min-height:1250px), only screen and (min-device-width:481px) and (max-device-width:768px) and (orientation:portrait) {

	#billboard .hero.ios8 .hero-image { width:1198px; height:1004px; margin-left:-311px; margin-top:-213px; top:28%; background-size:1198px 1004px; }
	#billboard .hero.ios8 .header { top:28%; }
	#billboard .hero.ios8 .large { display:block; }
	#billboard .hero.ios8 .small { display:none; }

	#billboard .hero.yosemite .hero-image { width:2386px; height:580px; margin-left:-1193px; top:38%;  background-size:2386px 580px; }
	#billboard .hero.yosemite .header { top:8%; }
	#billboard .hero.yosemite .large { display:block; }
	#billboard .hero.yosemite .small { display:none; }
}

/* extra large desktop */
@media only screen and (min-height:1250px) and (min-width:1250px) {
	#billboard .hero.ios8 .hero-image { margin-left:-340px; }
	#billboard .hero.ios8 .header { width:1250px; margin-left:-625px; }
}

/* between large and medium desktop */
@media only screen and (max-height:1249px) and (min-height:1064px) {
	#billboard .hero.yosemite .hero-image { width:1892px; height:458px; margin-left:-946px; top:38%;  background-size:1892px 458px; }
	#billboard .hero.yosemite .header { top:8%; }
}

/* desktop 11 */
@media only screen and (max-height:692px) {
	body { min-height:810px; }

	#billboard .hero.ios8 .hero-image { top:23%; }
	#billboard .hero.ios8 .header { top:23%; }

	#billboard .hero.yosemite .icon { display:none; }
	#billboard .hero.yosemite .hero-image { top:36%; }
	#billboard .hero.yosemite .header { top:12%; }
}

/* ipad landscape */
@media only screen and (min-device-width:481px) and (max-device-width:768px) and (orientation:landscape) {
	#billboard .hero.ios8 .hero-image { top:23.4%; }
	body { min-height:858px; }
}

/* ipad portrait */
@media only screen and (min-device-width:481px) and (max-device-width:768px) and (orientation:portrait) {
	#billboard .hero.ios8 .hero-image { width:1042px; height:874px; margin-left:-310px; margin-top:-175px; top:25%; background-size:1042px 874px; }
	#billboard .hero.ios8 .header { top:25%; }
	#billboard .hero.ios8 .large { display:none; }
	#billboard .hero.ios8 .small { display:block; }

	#billboard .hero.yosemite .hero-image { width:1892px; height:458px; margin-left:-946px; top:43%;  background-size:1892px 458px; }
	#billboard .hero.yosemite .header { top:12%; }
	#billboard .hero.yosemite .large { display:none; }
	#billboard .hero.yosemite .small { display:block; }
}

/* iphone landscape */
@media only screen and (min-device-width:320px) and (max-device-width:480px) and (orientation:landscape) {
	#billboard .hero.ios8 .hero-image { top:18%; }
	#billboard .hero.ios8 .header { top:26%; }
	#billboard .hero.ios8 .title { margin-top: 17px; }
}

/* iphone portrait */
@media only screen and (min-device-width:320px) and (max-device-width:480px) and (orientation:portrait) {
	#billboard .hero.ios8 .hero-image,
	#billboard .hero.ios8 .header { top:25%; }

	#billboard .hero.yosemite .hero-image { top:42%; }
	#billboard .hero.yosemite .header { top:14%; }

	#billboard .hero .large { display:block; }
	#billboard .hero .small { display:none; }
}
