#mobile-navigation {
	margin: 10px 0 10px 0;	
}

/*
  Media Queries Taken From
  
  1. http://stephen.io/mediaqueries
  2. https://css-tricks.com/snippets/css/media-queries-for-standard-devices/
*/

/* iPhone 6 in portrait & landscape */
@media only screen 
	and (min-device-width : 375px) 
	and (max-device-width : 667px) {
		html {
			overflow-x: hidden;	
		}
		
		body {
			overflow-x: hidden;
			padding: 0;
		}
		
		#main {
			padding: 5px 10px 5px 10px;
		}
		
		#page {
			margin-top: 1px;	
		}
}

/* iPhone 6 Plus in portrait & landscape */
@media only screen 
	and (min-device-width : 414px) 
	and (max-device-width : 736px) {
		html {
			overflow-x: hidden;	
		}
		
		body {
			overflow-x: hidden;
			padding: 0;
		}
		
		#main {
			padding: 5px 10px 5px 10px;
		}
		
		#page {
			margin-top: 1px;	
		}
}

/* iPhone 5 & 5S in portrait & landscape */
@media only screen 
	and (min-device-width : 320px) 
	and (max-device-width : 568px) {
		html {
			overflow-x: hidden;	
		}
		
		body {
			overflow-x: hidden;
			padding: 0;
		}
		
		#main {
			padding: 5px 10px 5px 10px;
		}
		
		#page {
			margin-top: 1px;	
		}
}

/* 
  iPhone 2G, 3G, 4, 4S Media Queries
  It's noteworthy that these media queries are also the same for iPod Touch generations 1-4.
*/

/* iPhone 2G-4S in portrait & landscape */
@media only screen 
	and (min-device-width : 320px) 
	and (max-device-width : 480px) {
		html {
			overflow-x: hidden;	
		}
		
		body {
			overflow-x: hidden;
			padding: 0;
		}
		
		#main {
			padding: 5px 10px 5px 10px;
		}
		
		#page {
			margin-top: 1px;	
		}
}

/* iPad in portrait & landscape */
@media only screen 
	and (min-device-width : 768px) 
	and (max-device-width : 1024px)  {
		html {
			overflow-x: hidden;	
		}
		
		body {
			overflow-x: hidden;
			padding: 0;
		}
		
		#main {
			padding: 5px 10px 5px 10px;
		}
		
		#page {
			margin-top: 1px;	
		}
}

/* Galaxy S3 portrait and landscape */
@media screen 
	and (device-width: 320px) 
	and (device-height: 640px) 
	and (-webkit-device-pixel-ratio: 2) {
		html {
			overflow-x: hidden;	
		}
		
		body {
			overflow-x: hidden;
			padding: 0;
		}
		
		#main {
			padding: 5px 10px 5px 10px;
		}
		
		#page {
			margin-top: 1px;	
		}
}

/* Galaxy S4 portrait and landscape */
@media screen 
	and (device-width: 320px) 
	and (device-height: 640px) 
	and (-webkit-device-pixel-ratio: 3) {
		html {
			overflow-x: hidden;	
		}
		
		body {
			overflow-x: hidden;
			padding: 0;
		}
		
		#main {
			padding: 5px 10px 5px 10px;
		}
		
		#page {
			margin-top: 1px;	
		}
}

/* Galaxy S5 portrait and landscape */
@media screen 
	and (device-width: 360px) 
	and (device-height: 640px) 
	and (-webkit-device-pixel-ratio: 3) {
		html {
			overflow-x: hidden;	
		}
		
		body {
			overflow-x: hidden;
			padding: 0;
		}
		
		#main {
			padding: 5px 10px 5px 10px;
		}
		
		#page {
			margin-top: 1px;	
		}
}

/* HTC One portrait and landscape */
@media screen 
	and (device-width: 360px) 
	and (device-height: 640px) 
	and (-webkit-device-pixel-ratio: 3) {
		html {
			overflow-x: hidden;	
		}
		
		body {
			overflow-x: hidden;
			padding: 0;
		}
		
		#main {
			padding: 5px 10px 5px 10px;
		}
		
		#page {
			margin-top: 1px;	
		}
}

/*
  iPad 3 & 4 Media Queries
  If you're looking to target only 3rd and 4th generation Retina iPads 
  (or tablets with similar resolution) to add @2x graphics,
  or other features for the tablet's Retina display, use the following media queries.
*/

/* Retina iPad in portrait & landscape */
@media only screen 
	and (min-device-width : 768px) 
	and (max-device-width : 1024px)
	and (-webkit-min-device-pixel-ratio: 2) {
		html {
			overflow-x: hidden;	
		}
		
		body {
			overflow-x: hidden;
			padding: 0;
		}
		
		#main {
			padding: 5px 10px 5px 10px;
		}
		
		#page {
			margin-top: 1px;	
		}
}

/*
  iPad 1 & 2 Media Queries
  If you're looking to supply different graphics or choose different typography 
  for the lower resolution iPad display, the media queries below will work 
  like a charm in your responsive design!
*/

/* iPad 1 & 2 in portrait & landscape */
@media only screen 
	and (min-device-width : 768px) 
	and (max-device-width : 1024px) 
	and (-webkit-min-device-pixel-ratio: 1) {
		html {
			overflow-x: hidden;	
		}
		
		body {
			overflow-x: hidden;
			padding: 0;
		}
		
		#main {
			padding: 5px 10px 5px 10px;
		}
		
		#page {
			margin-top: 1px;	
		}
}

/* iPad mini in portrait & landscape */
@media only screen 
	and (min-device-width : 768px) 
	and (max-device-width : 1024px)
	and (-webkit-min-device-pixel-ratio: 1) {
		html {
			overflow-x: hidden;	
		}
		
		body {
			overflow-x: hidden;
			padding: 0;
		}
		
		#main {
			padding: 5px 10px 5px 10px;
		}
		
		#page {
			margin-top: 1px;	
		}
}

/* Galaxy Tab 10.1 portrait and landscape */
@media 
	(min-device-width: 800px) 
	and (max-device-width: 1280px) {
		html {
			overflow-x: hidden;	
		}
		
		body {
			overflow-x: hidden;
			padding: 0;
		}
		
		#main {
			padding: 5px 10px 5px 10px;
		}
		
		#page {
			margin-top: 1px;	
		}
}

/* Asus Nexus 7 portrait and landscape */
@media screen 
	and (device-width: 601px) 
	and (device-height: 906px) 
	and (-webkit-min-device-pixel-ratio: 1.331) 
	and (-webkit-max-device-pixel-ratio: 1.332) {
		html {
			overflow-x: hidden;	
		}
		
		body {
			overflow-x: hidden;
			padding: 0;
		}
		
		#main {
			padding: 5px 10px 5px 10px;
		}
		
		#page {
			margin-top: 1px;	
		}
}

/* Kindle Fire HD 7" portrait and landscape */
@media only screen 
	and (min-device-width: 800px) 
	and (max-device-width: 1280px) 
	and (-webkit-min-device-pixel-ratio: 1.5) {
		html {
			overflow-x: hidden;	
		}
		
		body {
			overflow-x: hidden;
			padding: 0;
		}
		
		#main {
			padding: 5px 10px 5px 10px;
		}
		
		#page {
			margin-top: 1px;	
		}
}

/* Kindle Fire HD 8.9" portrait and landscape */
@media only screen 
	and (min-device-width: 1200px) 
	and (max-device-width: 1600px) 
	and (-webkit-min-device-pixel-ratio: 1.5) {
		html {
			overflow-x: hidden;	
		}
		
		body {
			overflow-x: hidden;
			padding: 0;
		}
		
		#main {
			padding: 5px 10px 5px 10px;
		}
		
		#page {
			margin-top: 1px;	
		}
}

/* Apple Watch */
@media 
	(max-device-width: 42mm) 
	and (min-device-width: 38mm) {
		html {
			overflow-x: hidden;	
		}
		
		body {
			overflow-x: hidden;
			padding: 0;
		}
		
		#main {
			padding: 5px 10px 5px 10px;
		}
		
		#page {
			margin-top: 1px;	
		}
}

/* Moto 360 Watch */
@media 
	(max-device-width: 218px) 
	and (max-device-height: 281px) {
		html {
			overflow-x: hidden;	
		}
		
		body {
			overflow-x: hidden;
			padding: 0;
		}
		
		#main {
			padding: 5px 10px 5px 10px;
		}
		
		#page {
			margin-top: 1px;	
		}
}