/* CSS Resource Document for: Army Sustainment Command -> Field Components 	*
!  Global classes should be defined in portal.css  							*
*  The proponent agency for this source is AMAS-PC							*/

/* Links on each page */
.useful-link {
	line-height: 2;
	padding: 4px;
}
	.useful-link a {
		font-family: GI7;
	}
		.useful-link a:hover {
			color: #3A423A;
		}
.afsbn-links {
	width: 100%;
}
	.afsbn-links td {
		width: 50%;
		padding: 2px;
	}

/* Bio Pages */
.biography {
	width: 99%;
	margin: auto;
}
	.biography td {
		vertical-align: top;
		padding: 4px;
		height: 1px;
		width: 50%;
	}
	.biography img {
		width: 100%;
		display: block;
	}
	.biography strong {
		font-family: GI7;
	}
	.biography a {
		color: #3A423A;
		font-family: GI5;
	}
		.biography a:hover {
			color: #6b8e23;
			font-family: GI7;
			text-decoration: underline;
		}

/* Sub Navigation */
.subnav-links {
	font-family: GI4;
	text-align: center;
	width: 99%;
	margin: auto;
}
	@media only screen and (max-width: 1280px) {
		.subnav-links {
			display: none;
		}
	
	}
	.subnav-links nav {
		margin: 0 auto;
		width: 100%;
		height: auto;
		display: inline-block;
		background: #FFF;
	}
		.subnav-links nav ul {
			margin: 0;
			padding: 0;
			list-style-type: none;
			float: left;
			display: inline-block;
		}
			.subnav-links nav ul li {
				position: relative;
				margin: 0px 0 0;
				float: left;
				display: inline-block;
				z-index: 1000;
			}
				.subnav-links li > a:after { 
					content: ''; 
				}
				.subnav-links li > a:only-child:after { 
					content: ''; 
				}
				.subnav-links nav ul li a {
					padding: 2px;
					width: 144px;
					display: inline-block;
					color: #3A423A;
					text-decoration: none;
				}
				.subnav-links nav ul li a:hover {
					background: #3A423A;
					color: #FFCE08;
				}
				.subnav-links nav ul li ul {
					display: none;
					position: absolute;
					left: 0;
					background: #FFF;
					float: left;
					opacity: 0.9;
				}
					.subnav-links nav ul li ul li {
						width: 100%;
						border-bottom: 1px solid rgba(206,206,206,.3);
					}
				.subnav-links nav ul li:hover ul {
					display: block;
				}

/* Leadership Links */
.lead-sub {
	color: #FFF;
}
.lead-links {
	font-family: GI7;
	text-align: center;
}
	.lead-links a {
		text-decoration: none;
		color: #FFCE08;
	}
	.lead-links figure.image {
		position: relative;
		overflow: hidden;
		margin: 10px;
		width: 190px;
		height: 238px;
		background: #000;
		color: #EEE;
		text-align: center;
		display: inline-block;
	}
		.lead-links figure.image * {
			transition: all 0.3s ease-in-out;
		}
		.lead-links figure.image img {
			max-width: 190px;
			position: relative;
			opacity: 1;
		}  
		.lead-links figure.image h1 {
			position: absolute;
			left: 0px;
			right: 0px;
			display: inline-block;
			background: #3A423A;
			padding: 2px;
			margin: 0;
			bottom: 0%;
			font-size:12px;
			line-height:18px;
			text-transform: uppercase;
		}
		.lead-links figure.image:before {
			height: 100%;
			width: 100%;
			top: 0;
			left: 0;
			content: '';
			background: #AAA;
			position: absolute;
			transition: all 0.3s ease-in-out;
		}  
		.lead-links figure.image:hover img {
			opacity: 1;
			transform: scale(1.1);
		}
		.lead-links figure.image:hover h1 {
			transform: skew(-10deg) rotate(-10deg) translate(-150%, -50%);
		}
		.lead-links figure.image:hover::before {
			transform: rotate(110deg) translateY(-150%);
		}
.mission {
	width: 100%;
}
	.mission td.leaders {
		width: 60%;
		text-align: center;
	}
	.mission td.about {
		width: 40%;
	}
		.mission td.about h2 {
			font: normal 24px GI7;
		}
		.mission td.about span {
			font-family: GI5; 
			text-align: center;
			padding: 12px;
			display: inline;
		}

.colcap {
	font: normal 24px GI5;
	text-align: center;
}

/* Unit Map */
#afsb-map,
#afsb-links { 
	width: 100%; 
	margin: auto; 
	text-align: center; 
	padding-top: 12px; 
}
#afsb-links { 
	display: none; 
	list-style: none; 
	padding: 0; 
}
#afsb-links li a { 
	display: block; 
	padding: 8px 0; 
	line-height: 2;
	text-decoration: none; 
	color: #0074D9; 
}
@media only screen and (max-width: 768px) {
	#afsb-map { 
		display: none; 
	}
    #afsb-links { 
		display: block; 
	}
}