/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 959px) {}

/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 959px) {}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
	
	body {
		font-size: 15px;
	}
	
		body.players {
			background-color: #FCEE70;
		}
	
	body > header {
		overflow: hidden;
		min-height: 410px;
		
		/* background-image: none; */
	}
	
	body > header:after {
		top: -130px;
	}
	
		body.players > header:after {
			top: -180px;
		}
	
		body.players > header {
			background-image: none;
		}
	
	body > header:before {
		background-image: none !important;
		background-color: #eee;
	}
	
		body.players > header:before {
			background-color: #FCEE70;
		}
	
		body > header ul {
			top: 2%;
			left: 1%;
			width: 400px;
		}
	
	/* header */
	
		h1 {
			top: -30px;
			left: 0;
			width: 100%;
			height: 300px;	
			background-size: cover;	
		}						
		
		nav {
			display: none;
		}
			
			nav ul {
				background-color: #b00; /* #900; */
				background-color: rgba(187,0,0,0.5); /* #900; */
			}
		
			nav li {
				float: left;
				min-width: 160px;
			}
			
				body > header li a {
					letter-spacing: -1px;
				}
				
				
				body > header li.on a:before {
					content: " ";
				}
		
		h2 {
			white-space: normal;
			
			font-size: 50px;
			box-shadow: 200px 0 1px #000;
			margin: -265px 0 50px -45px;
			padding: 20px 0 20px 5px;
			width: 100%;
		}
		
			h2:after {
				left: 30px;
			}
			
				#members-overlay h2:after {
					content: "Players Only Area";
				}
			
		h3 {
			font-size: 26px;
		}
			
	#menu {
		display: block;
		position: absolute;
		top: 3%;
		left: 2%;	
		color: #fff;
		font-size: 40px;
	}
	
		#menu:before {
			display: inline;
			content: "≣";
		}
		
	/* main */
	
		body.players main {
			display: none;
		}
	
		.back {
			margin: 0 0 20px 40px;
		}
		
		.input.text input,
		.input.textarea textarea {
			width: 85%;
		}
					
		main .subnav_2 {
			top: -130px;
			left: 50px;
		}
		
		body.players #members-overlay {
			position: relative;
			top: -310px;

			padding: 130px 0; 
			background-color: transparent;
			
			text-shadow: none;
		}
					
	/* gallery */
	
		.media-grid li {
			margin: 0 8px 10px 0;
			width: 100px;
		}
		
		.media-grid.gallery li {
			width: 100%;
		}
		
	/* map */
	
		.gimli-google-map iframe {
			height: 200px;
		}
		
		#alt-main article img {
			width: 100%;
			height: auto;
		}
		
	/* kindred */
	
		.kindred article {
			margin: 0 0 10px 0;
			width: auto;
			padding: 0;
		}
		
			.kindred article figure {
				float: none;
				margin: 0;
				padding: 10px 10px 0 10px;
				border-radius: 0;
				background-color: #fff;
			}
			
				.kindred article figure:before {
					display: none;
				}
				
				.kindred article figure img {
					float: left;
					background-color: #000;
					width: 100px;
					height: 100px;
					border-radius: 20px;
				}
				
			.kindred article figure ul {
				margin: 6px 0 0 0;
			}
					
				.kindred article figure ul:after {
					display: inline-block;
				}
				
			.kindred article header {
				margin: 10px;
			}
			
			.kindred article .gallery {
				position: relative;
				top: 0;
				right: 0;
				margin: 20px 0 0 0;
				text-align: center;
			}
			
				.kindred article .gallery a {
					font-size: 0;
				}
				
				.kindred article .gallery span {
					margin-right: 5px;
					margin-left: 5px;
					margin-bottom: 0;
					height: 40px;
					width: 80px;
					opacity: 0.5;
					border-radius: 15px;
				}
			
			.kindred article p {
				margin: 10px;	
			}
		
	/* newspaper */
	
		#gimlitimes {
			background-size: 90% auto;
			box-shadow: none;
			
			margin-left: -10px;
			margin-right: -10px;
			padding: 100px 10px 10px;
		}
		
			#gimlitimes .gimli-volume {	
				float: none;
				text-align: center;
			}
			
			#gimlitimes .gimli-select {
				float: none; 
				text-align: center;
			}
			
				#gimlitimes .gimli-select select {
					font-size: 14px;
				}
				
			#gimlitimes .featured article h4 {
				font-size: 50px;
				margin: 20px 0;
			}
			
			#gimlitimes .normal {
				width: 100%;
				float: none;
				margin: 36px 0;
			}
			
				#gimlitimes .normal article h4 {
					font-size: 32px;
					margin-bottom: 0.5em;
				}
				
				#gimlitimes .normal article:last-child {
					border-bottom: 1px solid rgba(0,0,0,0.1);
				}
			
			#gimlitimes .sidebar {
				width: 100%;
				float: none;
				margin: -8px 0 16px 0;
			}
			
				#gimlitimes .sidebar article h4 {
					margin-bottom: 0.5em;
				}
			
		
	/* footer */
		
		footer {
			min-height: 100px;
			margin-top: 0;
		}
		
		footer:before {
			background-image: none;
			background-color: #000;
		}
		
			.tilt {
				margin-top: 120px;
				 margin-left: 0;
				 
				 -webkit-transform: none;
				 -ms-transform: none;
				transform: none;
			}
			
				.tilt .intro {
					border: 0;
				}
			
				.tilt form,
				.tilt div {
					width: 100%;
					margin-right: none;
					float: none;
					
					padding: 2em 0;
					border-top: 1px solid #333;
				}
				
	/* home-page */
	
		body#home-page {
			padding-bottom: 0;
			background-image: none;
		}
		
				body#home-page h1:after {
					font-size: 60px;
					margin: 170px 0 0 -20px;
					width: 110%;
					padding: 10px;
				}
			
			body#home-page main {
				margin-top: -180px;
			}
			
				body#home-page main .intro {
					margin-bottom: 0;
				}
				
					body#home-page main .intro p {
						font-size: inherit;
						line-height: inherit;
					}
			
				body#home-page main .tilt {
					margin-top: 120px;
					margin-left: 0px;
					
					-webkit-transform: none;
					-ms-transform: none;
					transform: none;
				}
					
					body#home-page .tilt form input.text {
						width: 80%;
					}

}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {
	
	/* main */
		
		h2 {
			font-size: 40px;
			margin: -220px 0 50px -25px;
		}
	
		main,
		#alt-main {
			margin-left: 10px;
			margin-right: 10px;
			width: auto;
			padding: 0;
			color: #000;
		}
		
		table {
			border: none;	
		}
		
			#members-overlay table {
				border-bottom: 1px dotted #000;
			}
		
		tr {
			display: block;
			border-top: 1px solid #ddd;
			padding: 10px 0;
		}
		
			#members-overlay tr {
				border-top: 1px dotted #000;
			}
		
			tr:first-child {
				border-top: none;
				display: none;
			}
		
			tr th {
				display: none;
			}
			
			tr td {
				padding: 0;
				display:block;
				border: none;
			}
				
				#members-overlay tr td {
					border-top: 0;
					line-height: 20px;
				}
				
					#members-overlay table.edit-list td.image {
						display: inline-block;
						padding: 0.25em 0.5em 2em 0;
						float: left;
					}
					
					#members-overlay table.edit-list td.title {
						font-weight: bold;
					}
			
				tr td.right {
					text-align: left;
				}
					
					#members-overlay table.edit-list td.right {
						text-align: right;
						padding-top: 10px;
					}
					
						#members-overlay table.edit-list td.right .button {
							width: 30%;
							text-align: center;
							line-height: 1.8em;
						}
				
				tr td:first-child {
					/* padding: 0 0 5px 0; */
				}
					
					tr td:first-child a {
						font-weight: 600;
					}
					
		main .subnav_2 {
			top: 90px;
			left: -6px;
		}
					
	/* gallery */
	
		.media-grid li {
			margin: 0 5px 10px 0;
			width: 95px;
		}
		
		.media-grid.gallery li {
			width: 100%;
		}
		
	/* court */
	
		ul.court.large li {
			width: 100%;
			padding: 0;
			margin: 0;
			height: auto;
		}
		
			ul.court.medium li {
				padding: 0;
				margin: 0 auto;
				height: auto;
			}
		
			ul.court.small li {
				padding: 0;
				margin: 0 auto;
				width: 80px;
				height: 80px;
			}
		
			ul.court.large img {
				width: 100%;
				height: auto;
				box-shadow: none;
			}
			
			ul.court.small img {
				width: 100%;
				height: auto;
			}
		
			ul.court.large img,
			ul.court.large span,
			ul.court.medium img,
			ul.court.medium span,
			ul.court.small img,
			ul.court.small span {
				box-shadow: none;
			}
		
			ul.court.large figure:after,
			ul.court.medium figure:after,
			ul.court.small figure:after {
				display: none;
			}
		
		ul.court.large h3,
		ul.court.medium h4 {
			margin-top: 10px;
		}
		
		ul.court.large h4,
		ul.court.medium h5 {
			margin-top: 0;
			margin-bottom: 20px;
		}
		
		h4.council,
		h5.council {
			margin-top: -15px;
		}
	
}