﻿/*Set the logo to be 100% on small portrait*/
/*
@media only screen and (min-width : 480px) and (orientation : landscape)
{
	#headerlogos img {
		max-width: 100% !important;
	}
}
*/
/* Smartphones (portrait and landscape) ----------- */
/*@media only screen 
and (min-width : 320px) and (orientation : portrait),
only screen and (min-width : 480px) and (orientation : landscape) {*/


@media only screen and (min-width : 240px) and (max-width : 768px) and (orientation : portrait),
only screen and (min-width : 320px) and (max-width : 768px) and (orientation : landscape)
{
	#sharepointtoolbar {display: none !important;}

	div {
		}
	
	#searchBox {
		top: 47px !important;
		text-align: left !important;
		position: relative !important;
		z-index: 100;
	}
	#headerlogos-wrapper {
		position: relative;
		top: 18px;
		z-index: 1;
	}
	.comStripWrapper {
		left: -50% !important;
	}
	
	#global-nav {
		margin-right: -20px !important;
	}
	
	ul.timetable-row li.span6 div.content-timetable {margin-right: 0;}
	ul.timetable-row li.span2 p {font-weight: bold;}
	#bottom-heading-wrapper div.left {}
	#bottom-heading-wrapper div.right {float: left !important;}
	#topNav {
		min-height: 30px !important;
		position: absolute !important;
		top: 31px !important;
		left: 0 !important;
		z-index: 1000;
	}
	
	.navbar-toggle {
		display: block !important;
	}
	
	#topNavigation {
		max-height: 0px;
		min-height: 0px;
		background: #e3f4f4;
	}
	#topNavigation a {
		border-right: 0 !important;
		padding: 16px 0;
		min-height: 30px !important;
		width: 100% !important;
		float: right;
	}
	#topNavigationMobile{
		display: block !important;
	}
	
	#topNavigationMobile a {
		font-family: areteregular;
		text-align: center;
		height: 30px;
		line-height: 30px;
		min-height: 30px;
		text-transform: uppercase;
		font-size: 30px;
		color: #999999;
		float: left;
		position: absolute;
		width: 100%;
	}
	#topNavigationMobile a:hover {text-decoration:none; color: #00b5cb;}

	.hidden-phone {
		display: none !important;
	}
	#topNavigation a span {
		font-size: 30px !important;
	}
	#topNavigation a:active, #topNavigation a:hover {
		text-decoration: underline !important;
	}
	.sr-only {
	}
	.countdown-wrapper {
		background-size: cover;
	}
	
	#contentpage-leftcol-wrapper {
		width: 100%;
	}
	#contentpage-bottom-wrapper #contentpage-bottom {
		clear: both;
	}
	
	#contentpage-bottom-wrapper #contentpage-bottom img {
		width: 100%;
	}
	
	/*fireworks timetable*/	
	.table-row-wrapper {
		margin-bottom: 20px !important;
	}
	div.tablecontent span {display: inline !important;}
	.table-row-wrapper .span2.tablecontent {background: #dddddd;}
	.mno-border-bottom {border-bottom: none !important;}
	.span8 div.row-fluid .span6:nth-child(2){border-bottom: 1px solid #ffffff;}
	div.table-block {
		border-left: 0 !important;
	}

	#footer-social-wrapper {
		height: auto !important;
		line-height: 20px !important;
	}
	#footer-afe-wrapper {
		height: auto !important;
	}
	
	.footer-links {
		text-align: center;
	}
	
	.footer-links li {
		margin: 8px 0 !important;
	}
	
	ul#footernav li {
		display: block !important;
		width: 100% !important;
	}
	
	ul#footernav li.last {
		text-align: center !important;
	}
	
	ul#footernav li.hidden-phone {
		display: none !important;
	}
	#com-social {
		float: none !important;
		width: 100% !important;
	}
	
	.com-social-inner-text {
		text-align: center;
		width: 100% !important;
	}
	
	#social-icons {
		float: none !important;
		width: 106px !important;
		margin: auto !important;
	}
	#social-icons ul {
		text-align: left !important;
	}
	/*elements on specific pages*/
	
	.nye-countdown-min {
		text-align: center !important;
	}
	.nye-countdown-textbox-wrapper {
		width: 90% !important;
		margin-left: 5% !important;
		left: auto !important;
	}
	
	#midnight-content-col1 {
		margin: 16px 0 !important;
	}
	#midnight-content-col2 {
		margin: 16px 0 !important;
	}
	
	div.tablecontent span {display: inline-block !important;}
	div.tablecontent span + p {display: inline-block !important;}
	.table-no-gaps {margin-bottom: 8px;}
	
	#footernav-wrapper {
		width: 110%;
		width: calc(40px + 100%);
		background: #000000 !important;
		margin: 0 !important;
		position: relative !important;
		left: -20px;
	}
	
	#footernav {

		width: 100% !important;
		display: block;
	}

	#footernav li a {
		color: #ffffff !important;
	}
	
	#partners-wrapper ul.row-fluid li {
		text-align: center;
		padding: 16px 0;
	}
	
	#partners-wrapper ul.row-fluid div {
		text-align: center !important;	
	}
	
	#partners-wrapper ul.minorpartner li {
		padding: 0;
	}
}



/*iPhone 4-5 retina display (exlcuded aspect ratio [4/3]=iPad)*/

/*
@media only screen and (-webkit-min-pixel-ratio: 1.5),
 only screen and (min-pixel-ratio: 1.5),
 only screen and (min--moz-pixel-ratio: 1.5)
*/

@media only screen and (-webkit-min-device-pixel-ratio: 1.5) and (device-aspect-ratio: 40/71),
 only screen and (min-device-pixel-ratio: 1.5) and (device-aspect-ratio: 40/71),
 only screen and (min--moz-device-pixel-ratio: 1.5) and (device-aspect-ratio: 40/71),
 only screen and (-webkit-min-device-pixel-ratio: 1.5) and (device-aspect-ratio: 2/3),
 only screen and (min-device-pixel-ratio: 1.5) and (device-aspect-ratio: 2/3),
 only screen and (min--moz-device-pixel-ratio: 1.5) and (device-aspect-ratio: 2/3),
 only screen and (device-width : 480px) and (device-height : 800px) and (orientation : portrait),
 only screen and (device-width : 800px) and (device-height : 480px) and (orientation : landscape)
{
	body {

	}
	#sharepointtoolbar {display: none !important;}

	.hidden-phone {
		display: none !important;
	}
	
	.hidden-desktop {
		display: block !important;
	}
	
	.hidden-tablet {
		display: none !important;
	}
	#searchBox {
		top: 47px !important;
		text-align: left !important;
		position: relative !important;
		z-index: 100;
		visibility: hidden;
	}
	#page-wrapper {
		position: relative;
		top: 100px !important;
		
	}
	
	#global-nav {
		height: 100px !important;
		width: calc(20px + 100%) !important;
		
	}
	
	#global-nav-utilities {display: none !important;}
	
	.comStripWrapper {
		width: 100% !important;
		margin-left: 15px !important;
		margin-top: 15px !important;
		left: 0 !important;
	}
	.comStrip img {
		max-width: none !important;
		width: 50% !important;

	}
	
	.fullheight {
		min-height: 400px !important;
	}
	ul.home-tiles li.span3 {
		margin-left: 0 !important;
		margin-right: 60px;
		width: 400px !important;
	}
	ul.home-tiles li {height: 100% !important;}
	ul.home-tiles li:nth-child(2n+2) {margin-right: 0 !important;}
	ul.home-tiles li.span3 img {min-width: 100% !important; height: 100%;}
	ul.home-tiles li.span3 div.tile-grid a {overflow: visible !important;}
	div.grid-textarea-wrapper {margin-bottom: 62px !important;}
	div.grid-textarea p {clear: both; position: relative; display: block !important}
	ul.timetable-row li.span6 div.content-timetable {margin-right: 0;}
	ul.timetable-row li.span2 p {font-weight: bold;}
	ul.home-tiles li.span3 div.tile-grid a {height: 400px;}
	ul.home-tiles li.span3 div.tile-grid-caption {}
	.tile-grid-caption {font-size: 200% !important;}
	
	#bottom-heading-wrapper div.left {}
	#bottom-heading-wrapper div.right {}
	#topNavigationMobile{
		display: block !important;
	}

	#topNavigationMobile {
		display: block !important;
	}

	#topNav {
		min-height: 80px !important;
		position: absolute !important;
		top: 0 !important;
		left: 0 !important;
		
	}
	#topNavigation {
		max-height: 0px;
		min-height: 0px;
		background: #e3f4f4;
		z-index: 2000 !important;
		position: relative !important;
	}
	#topNavigation a {
		border-right: 0 !important;
		padding: 16px 0;
		min-height: 30px !important;
		width: 100%;
		float: right;
	}
	#topNavigationMobile a {
		font-family: areteregular;
		text-align: center;
		height: 30px;
		line-height: 30px;
		min-height: 30px;
		text-transform: uppercase;
		font-size: 30px;
		color: #999999;
		float: left;
		position: absolute;
		width: 100%;
	}
	#topNavigationMobile a:hover {text-decoration:none; color: #00b5cb;}

	#topNavigation div.centre {width: 90%; margin: auto; text-align: center;}
	#topNavigation a {
		border-right: 0 none !important;
		height: 80px !important;
		line-height: 60px !important;
		margin-left: 0;
		text-align: center !important;
		width: 100% !important;
		margin-top: 10px !important;
		border-bottom: 1px solid #999999;
	}	
	#topNavigation a span {
		font-size: 425% !important;
	}
	#topNavigation a:active, #topNavigation a:hover, #topNavigation a.highlightnav {
		text-decoration: none !important;
		border-bottom: 2px solid #00b5cb;
	}
	
	.navbar-toggle {
		top: -115px !important;
		right: 20px !important;
		width: 80px !important;
		height: 80px !important;
		padding: 10px 12px !important;
		margin: 15px !important;
		border: 2px solid #dddddd !important;
		z-index: 1010 !important;
	}
	
	.sr-only {
		position: relative !important;
		font-size: 300% !important;
	}
	.icon-bar {
		width: 50px !important;
		height: 4px !important;
		border-radius: 2px !important;
		margin-top: 8px !important;
	}

	.countdown-wrapper {
		background-size: cover;
		height: 400px;
	}
	.nye-countdown-textbox-wrapper {
		height: 176px !important;
		width: 388px !important;
		line-height: 76px !important;
	}
	
	.nye-countdown-maj {
		font-size: 425% !important;
	}
	
	.nye-countdown-min {
		font-size: 180% !important;
		position: relative !important;
	}
	
	.nye-countdown-min span {
		margin-left: 11px !important;
	}
	#midnight-page-2cols {margin-bottom: 200px;}
	#midnight-page-2cols p {
		font-size: 425% !important;
		line-height: 150% !important;		
	}
	
	/*fireworks timetable*/	
	.table-row-wrapper {
		margin-bottom: 20px !important;
	}

	.table-row-wrapper .span2.tablecontent {background: #dddddd;}
	.table-row-wrapper .span2.tablecontent span {
	 margin-left: 16px !important;
}
	.mno-border-bottom {border-bottom: none !important;}
	.span8 div.row-fluid .span6:nth-child(2){border-bottom: 1px solid #ffffff;}
	div.tablecontent span {display: inline-block !important;}
	div.tablecontent span + p {display: inline-block !important;}
	div.table-block {
		border-left: 0 !important;
	}
	div.table-block .span4 {
		width: 100% !important;

	}
	div.table-block .span8 {
		width: 100% !important;

		margin-left: -2px !important;
	}
	div.table-block .span4 span {
		margin: 0 !important;
		padding: 0 !important;

	}
	div.table-block .span8 span{
		margin: 0 !important;
		padding: 0 !important;

	}
	.table-no-gaps {margin-bottom: 8px;}

	#footer-afe-wrapper {
		padding: 8px 0 !important;
	}
	
	#afe p
	{
		font-size: 250% !important;
		line-height: 100% !important;
	}
		
	#midnight-content-col1
	{
		width: 100% !important;
	}

	#midnight-content-col2	{
		width: 100% !important;
	}
	
	#contentpage-leftcol-wrapper {
		width: 100%;
	}
	
	#contentpage-rightcol-wrapper {
		display: none;
	}
	.heading {
		font-size: 500% !important;
	}
	.bottom-heading {
		font-size: 200% !important;
		line-height: 100% !important;
	}

	.timetable-row li p {
		font-size: 275% !important;
	}

	.grid-textarea {
		display: block;
	}
	.grid-textarea p {
		font-size: 375% !important;
		line-height: 200% !important;
	}
	.grid-textarea p span {
		font-size: 120% !important;
		line-height: 150% !important;
	}
	.midnight-grid-textarea {position: relative; top: 200px; display: block; clear: both; line-height: 120%; margin-bottom: 30px;}
	#footer-social-wrapper {
		height: auto !important;
		line-height: 20px !important;
	}
	#footer-afe-wrapper {
		height: auto !important;
	}
	
	.footer-links {
		text-align: center;
	}
	
	.footer-links li {
		margin: 8px 0 !important;
	}
	
	#com-social {
		float: none !important;
		width: 100% !important;
		padding: 8px 0;
		height: 80px;
	}
	
	.com-social-inner-text {
		text-align: center !important;
		font-size: 275% !important;
		line-height: 100% !important;
		width: 100% !important;
		
	}
	#social-icons {
		float: none !important;
		width: 100% !important;
		margin: auto !important;
		padding: 8px 0;
		border-top: 2px solid #999999;
	}
	#social-icons ul {
		text-align: left !important;
	}
	
	#social-icons ul li {
		float: none !important;
		display: inline-block;
		margin-left: 19% !important;
		height: 64px !important;
	}
	
	#social-icons img {
		width: 64px !important;
		height: 64px !important;
		vertical-align: bottom !important;
	}
	
	.com-social-inner-image {
		width: auto !important;
	}
	
	.com-social-inner-image img {
		width: 64px !important;
		vertical-align: middle !important;
		margin-right: 28px;
	}
	/*elements on specific pages*/
	.nye-countdown-textbox-wrapper {
		width: 90% !important;
		margin-left: 5% !important;
		left: auto !important;
	}
	
	.midnight-tiles .fullheight {
		min-height: 200px !important;
	}
	
	#midnight-page-2cols {position: relative; top: 200px;}
	
	#midnight-content-col1 {
		margin: 16px 0 !important;
	}
	#midnight-content-col2 {
		margin: 16px 0 !important;
	}
	
	/*gridded table styles*/
	div.tablecontent span {display: inline-block !important;}
	div.tablecontent span + p {display: inline-block !important;}
	.table-no-gaps {margin-bottom: 8px;}
	#planahead-table-roadclosures div.tablecontent {
		line-height: 200% !important;
	}
	
	#planahead-table-roadclosures ul.row-fluid li.span4 {width: 100% !important; margin-left: 0 !important;}
	#planahead-table-roadclosures div.tablecontent span {font-size: 275%;}
	#fireworks-table-events div.tablecontent {font-size: 300% !important; line-height: 180% !important; padding: 8px !important;}
	#fireworks-table-events div.row-fluid div.span2,
	#fireworks-table-events div.row-fluid div.span3,
	#fireworks-table-events div.row-fluid div.span7,
	#fireworks-table-events div.row-fluid div.span6
	{
		width: 100% !important;
		margin-left: 0 !important;
		margin-bottom: 8px !important;
	}
	
	#footer div.span6 {
		display: none;
	}
	
	#footer div.span3 {
		width: 45% !important;
	}
	
	.footer-links li a {
		font-size: 275% !important;
		line-height: 150% !important;
	}
	
	
	#footernav {
		background: #000000;
		width: 100% !important;
		display: block;

	}
	
	#footernav li {
		line-height: 3em !important;
		display: block !important;
		width: 100% !important;
		margin: auto !important;
	}
	
	#footernav li a {
		color: #ffffff !important;
		font-family: Arial;
		font-size: 250%;
	}
	
	#footernav-wrapper {
		width: 110%;
		width: calc(40px + 100%);
		background: #000000 !important;
		margin: 0 !important;
		position: relative !important;
		left: -40px;
	}
	ul#footernav li.last {
		text-align: center !important;
		margin: auto !important;
	}
}

/*Galaxy IIs*/
@media only screen and (device-width : 480px) and (device-height : 800px) and (orientation : portrait),
 only screen and (device-width : 800px) and (device-height : 480px) and (orientation : landscape),
 only screen and (min-device-width : 480px) and (max-device-width : 800px)
{
	#topNavigation {
		max-height: 600px;
	}
}


@media screen and (min-width:0\0) { 
/*ie 9 and 10 styles - now we need to use some method other than <!--html comments-->*/
/*to put ie specific styles sheets into a doc, so this media query does the trick*/
	#searchResultsGrid tr {
		border-bottom: 1px solid #ffffff !important;
	}

}