@charset "UTF-8";
/* CSS Document */

body {
	body: 100%;
	text-align: center;
	font-size: 100%;
	font-family: "Roboto", sans-serif;
	background-repeat: repeat-x;
	background-image: url(../images/bg2.gif);
}

/*Color
- Dark blue #08204b
- Med blue #152f5f
*/


/*limited reset*/
html, body, div, section, article, aside, header, hgroup, footer, nav, h1, h2, h3, h4, h5, h6, p, blockquote, address, time, span, em, strong, img, ol, ul, li, figure, canvas, video, th, td, tr {
	margin: 0;
	padding: 0;
	border: 0;
}
/*html5 display rule*/
address, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, nav, menu, nav, section, summary {
	display: block;
}
#wrapper {
	font-size: 0.9em;
	font-weight: 400;
	color: #555;
	max-width: 1080px;
	margin-top: 0px;
	margin-right: auto;
	margin-left: auto;
	text-align: left;
	position: relative;
	background-color: #FFF;
	}

/* Text */

h1 { font-family: "Russo One", sans-serif; margin: 1em 0 0.5em 0; font-size: 2.8em; line-height: 1.1em; color: #08204b }
h2 { margin: 0 0 .5em 0; font-size: 1.4em; line-height: 1.1em; }
h3 { font-size: 1.2em; font-weight: 700; color: #08204b; display: block; padding-bottom: 0.5em; }
h4 { font-size: 1.1em; font-weight: 700; color: #456F93; }
h5 { font-size: 0.8em; color: #09204b; }
p { margin: 0 0 1em 0; }

.press { font-size: 1.2em; font-weight: 700; color: #08204b; display: block; padding-top: 0.5em; padding-bottom: 0.5em;  clear: left; }
.clear { clear: both; padding: 0.3em; display:block; }
.address {
	font-style: normal;
	text-transform: none;
	display: block;
	text-align: left;
	float: left;
	width: 43%;
	margin-bottom: 28px;
	padding-left: 2%;
	padding-right: 5%;
	letter-spacing: 0.1em;
}
#backlink {
	width: 97%;
	font-size: 0.7em;
	letter-spacing: 0.1em;
	text-align: right;
	color: #999;
	display: block;
	margin-top: 2px;
}
#backlink a:link,
#backlink a:visited,
#backlink a:hover,
#backlink a:active {
	text-decoration: none;
	color: #999;
}
.byline {
	font-size: 0.8em; line-height: 1.9em;
}
.caption {
	font-size: 0.9em;
	clear: left;
	display: block;
}
.pageMarker {
	font-size: 0.9em;
	color: #09204b;
	padding-bottom: 5%;
	display: block;
	clear: both;
	font-weight: normal;
	font-variant: normal;
	text-transform: capitalize;
	}
/*ul {
    list-style-position: inside;
}*/

.list{
	padding-left: 15px;
}


/*Slider*/
.slider { max-width: 100%; margin: auto; /*background-color: #CCC;*/ }
.slider .ism-slider { margin-left: auto; margin-right: auto; }



/*Links*/
section a:link,
section a:visited {
	text-decoration: none;
	color: #999;
} 
section a:hover, 
section a:active {
	text-decoration: none;
	color: #999;
}
section a.btn { font-size: 0.8em; text-decoration: none; color: #333; border: 1px solid #333; padding: 3px 10px; display: inline-block; margin-top: 5px; }

main#afsc a:link,
main#afsc a:visited,
main#afsc a:hover,
main#afsc a:active { color: #08204b;
}


/* Header */
header {
	height: 97px;
	background: #08204b url(../images/headerBg.jpg) no-repeat top left;
	margin: 0; 	
	position: relative;
	background-position: right top;
	z-index: 11;/*Need to add z-index or the drop down will be hidden*/
}
header a.logo {
	position: absolute;
	display: block;
	width: 230px;
	height: 51px;
	background: url(../images/logo.svg) no-repeat 0 0;
	background-size: contain;
	z-index: 1;
	top: 25px;
	left: 20px;
}
header a.logo span { display: none; }

/* Navigation */
nav {
	background-color: rgba(0,0,0,0);
	font-size: 12px; /*Added to fit all menu into one line*/
	position: relative;
	padding: 50px 0px 0px 120px;/*Increased left margin for full screen*/
}
nav ul::after { content: ""; display: block; clear: both; }

/*Adding the mobile-menu button*/
nav a.mobile_menu {
	width: 32px;
	height: 32px;
	background: url(../images/icon_menu.svg);
	background-position: 0px 0px;
	background-size: contain;
	position: absolute;
	top: 22px;
	left: 50%;
	margin-left: -16px;
	display: none; /*To hide the menu only to show in 625*/
}


nav a,
nav a:visited { color: #fff; }
nav ul { list-style: none; margin: 0px; padding: 0px; }

nav ul li:hover { background-color: #152f5f; }
nav ul li:hover > ul { display: block; }

nav ul li a { display: inline-block; color: #fff; padding: 10px 20px; text-decoration: none; width: 125px; position: relative; }
nav ul li a:hover { background-color: #08204b; }



nav ul ul { display: none; position: absolute; top: 100%; background-color: #152f5f; }
nav ul ul li { position: relative; }
nav ul ul ul { left: 100%; top: 0; }


/* top level */
nav > ul { padding-left: 200px; }
nav > ul > li { float: left; }
nav > ul > li > a { padding: 10px 20px 15px 20px; width: auto; }

nav a[aria-haspopup="true"]::after {
	content:'';
	display: block;
	width: 0;
	height: 0;
	position: absolute;
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
	border-left: 4px solid #fff;
	right: 15px;
	top: 16px;
}
nav > ul > li > a[aria-haspopup="true"]::after {
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
	border-top: 4px solid #fff;
	left: 20px;
	bottom: 6px;
	right: auto;
	top: auto;
}
nav > ul > li > a[aria-haspopup="true"]::after {
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
	border-top: 4px solid #fff;
	left: 20px;
	bottom: 6px;
	right: auto;
	top: auto;
}

/*slideshow*/
#slideshow { 
    position: relative; 
    width: 100%;
    height: 250px;/*This sets the height for mobile*/
	display: block;
	margin-bottom: 0px;
}
#slideshow img {
	max-width: 100%;
	min-width: 200px; /*This sets the width for mobile*/
	height: auto;
}

#slideshow > div { 
    position: absolute; 
}
#container {
	width: 97%;
	margin-left: 2%;
	margin-right: 1.5%;
}

/*main*/
main#afsc,
main#corpBrief {
	text-align: left;
	line-height: 1.5em;
	float: left;
	width: 58%;
	margin-bottom: 2%;/*38px Edited for Christmas Banner*/
	padding-right: 1.5%;
	padding-left: 2%;
	display: block;
}
main#press {
	width: 80%;
	text-align: left;
	padding-left: 2%;
	line-height: 1.5em;
	float: left;
	display: block;
}
#afsc img {
	max-width: 38%;
	float: right;
	height: auto;
	padding-right: 3%;
	padding-left: 2%;
	padding-bottom: 60px;
	display: block;/*For padding-top to work*/
}

/*section*/
section#news {
	text-align: left;
	font-size: 0.9em;
	float: left;
	width: 33%;
	padding-top: 30px;
	margin-bottom: 2%;
	line-height: 1.3em;
	display: block;
	padding-left: 2.5%;
	border-left-width: thin;
	border-left-style: dashed;
	border-left-color: #999;
}
section#news img {
	max-width: 40%;
	float: left;
	height: auto;
	padding-right: 25px;
	padding-bottom: 60px;
	display: block;/*For padding-top to work*/
}


/*About Us*/
#nobelSW,
#clientele {
	background-color: #d3e8ed;
	width: 28%;
	margin-top: 3%;
	padding: 2% 2% 2% 2%;
	margin-left: 5%;
	float: left;
	font-size: 0.9em;
	display: block;
}
section#client {
	text-align: left;
	font-size: 0.9em;
	float: left;
	width: 33%;
	padding-top: 2.5%;
	margin-bottom: 2%;
	line-height: 1.3em;
	display: block;
}
#nobelSW img,
#clientele img{
	width: 100%;
	height: auto;
	display: block;
	float: left;
	padding-bottom: 3%;
}

/*Press*/
article {
	display: block;
	clear: both;
	padding-top: 10px;
	padding-bottom: 50px;
	border-bottom-width: thin;
	border-bottom-style: dotted;
	border-bottom-color: #CCC;
}
article img {
	width: 20%;
	height: auto;
	padding-bottom: 3%;
	padding-left: 3%;
	float: right;
	display: block;
}

/*testimonials*/
main#testimonials {
	width: 95%;
	text-align: left;
	line-height: 1.5em;
	float: left;
	margin-bottom: 2%;/*38px Edited for Christmas Banner*/
	padding-right: 1.5%;
	padding-left: 2%;
	display: block;
}

section#testimonials {
	-moz-column-count: 4;
	-moz-column-gap: 1.66em;
	-webkit-column-count: 4;
	-webkit-column-gap: 1.5em;
	column-count: 4;
	column-gap: 1.5em;
	padding-bottom: 0;
	display: block;
	border-bottom-width: thin;
	border-bottom-style: dotted;
	border-bottom-color: #CCC;
}
section#programs p,
section#programs ul,
section#testimonials p {
-webkit-column-break-inside: avoid;
   	page-break-inside: avoid;
   	break-inside: avoid;
	padding-bottom: 5px;
}
.testimonials {
	font-size: 1.2em;
	color: #152f5f;
	width: 100%;
	display: block;
}

/*programs*/
main#programs {
	width: 95%;
	text-align: left;
	line-height: 1.5em;
	float: left;
	margin-bottom: 2%;
	padding-right: 1.5%;
	padding-left: 1.5%;
	padding-bottom: 3%;
	display: block;
}
#programsL {
	width: 45%;
	text-align: left;
	line-height: 1.5em;
	float: left;
	margin-bottom: 2%;
	padding-right: 1.5%;
	padding-left: 2%;
	padding-bottom: 3%;
	display: block;
}
#programsR {
	width: 45%;
	text-align: left;
	line-height: 1.5em;
	float: right;
	margin-bottom: 2%;
	padding-top: 45px;
	padding-right: 2%;
	padding-left: 1.5%;
	padding-bottom: 3%;
	display: block;
}
#programsL img,
#programsR img {
	max-width: 80%;
	float: left;
	height: auto;
	padding-right: 20px;
	display: block;/*For padding-top to work*/
}
section#programs {
	-moz-column-count: 2;
	-moz-column-gap: 1.66em;
	-webkit-column-count: 2;
	-webkit-column-gap: 1.5em;
	column-count: 2;
	column-gap: 1.5em;
}

/*special projects*/
main#projects {
	text-align: left;
	line-height: 1.3em;
	float: left;
	width: 55%;
	margin-bottom: 2%;/*38px Edited for Christmas Banner*/
	padding-right: 4%;
	padding-left: 2%;
	display: block;
}
main#projects img {
	max-width: 93%;
	float: left;
	height: auto;
	padding-right: 5%;
	padding-bottom: 3%;
	display: block;/*For padding-top to work*/
}

/*team program*/
main#team {
	text-align: left;
	line-height: 1.5em;
	float: left;
	width: 80%;
	margin-bottom: 2%;/*38px Edited for Christmas Banner*/
	padding-right: 1.5%;
	padding-left: 2%;
	display: block;
}
main#team img {
	width: 100%;
	height: auto;
}
#imgRgt {
	width: 35%;
	float: right;
	display: block;
	padding-left: 1em;
}
#imgRgt img {
	width: 100%;
	height: auto;
}

/*uav program*/
main#uav {
	text-align: left;
	line-height: 1.5em;
	float: left;
	width: 80%;
	margin-bottom: 2%;/*38px Edited for Christmas Banner*/
	padding-right: 1.5%;
	padding-left: 2%;
	display: block;
}

main#uav img {
	width: 100%;
	height: auto;
}
/*footer*/
footer#pageFooter {
	width: 100%;
	height: auto;
	display: block;
	padding-top: 20px;
	background-color: #152f5f;
	background-image: url(../images/footerBg.jpg);
	background-repeat: no-repeat;
	background-position: right top;
	clear: both;
	text-align: left;
	line-height: 1.3em;
	font-size: 0.8em;
	color: #FFF;	
}

footer#pageFooter div.rightCol {
	text-align: left;
	line-height: 1.3em;
	float: left;
	width: 45%;
	margin-bottom: 18px;
	padding-left: 2%;
	padding-right: 3%;
	display: block;
}
footer#pageFooter div.rightCol img {
	max-width: 100%;
	min-width: 300px; /*This sets the width for mobile*/
	height: auto;
}

footer#pageFooter a:link,
footer#pageFooter a:visited {
	text-decoration: underline;
	color: #FFF;
} 
footer#pageFooter a:hover, 
footer#pageFooter a:active {
	text-decoration: none;
	color: #999;
}



/* Media Queries */

@media screen and (max-width: 1000px) { 
	h1 { font-size: 2.4em; }

	/*Header*/ 
	header a.logo { width: 180px; height: 40px; top: 10px;}
	
	/* Navigation */
	nav { padding-left: 0px; padding-top: 60px; }
	nav > ul { padding-left: 10px; }
	
	/*Slideshow*/
	#slideshow { 
	min-height: 200px; }/*This sets the height for mobile*/ 

}


@media screen and (max-width: 825px) { 

	h1 { font-size: 2.2em; }
	
	section#news { width: 28%; padding-left: 3%; }
	section#news img { max-width: 100%; padding-bottom: 10px; }
	#programsL, #programsR {
	width: 90%;
	float: left;
	padding-top: 0px;
	}
	#slideshow { 
	height: 120px; }/*This sets the height for mobile*/ 
	
}


@media screen and (max-width: 760px) {

	h1 { font-size: 1.8em; }
	h2 { font-size: 1.4em; }
	h3 { font-size: 1.1em; }
	a.btn { font-size: 1em; }
	
	/*main*/
	main#projects,
	main#afsc,
	main#corpBrief { width: 95%; }
	
	section#news { width: 90%; padding-top: 0px; }
	section#news img { padding-bottom: 20px; }
	#nobelSW, #clientele { width: 90%; margin-left: 1%; }
	#backlink {
	text-align: left;
	padding-left: 1em;
	}
	#slideshow { 
    width: 50%;
	float: right;
	margin-right: 5%;
	padding-left: 3%;
    height: 220px;/*This sets the height for mobile*/
	}

}


@media screen and (max-width: 625px) {
	
	/*
	h1 { font-size: 1em; }
	h3 { margin-bottom: 0; }
	a.btn { font-size: .9em; }
	Change header height from 160 to auto*/
	header { height: auto; min-height: 97px; }

	nav { padding: 50px 15px 30px 15px; background-color: rgba(0,0,0,0); height: 0px; overflow: hidden;
	}
	/*Add mobile_menu rule to display*/
	nav a.mobile_menu {
		display: block;
	}
	nav ul, nav ul ul, nav ul ul ul { display: block; position: static; }
	nav > ul { padding-top: 10px; }/*Edit to give space before drop-down menu*/
	nav > ul > li { float: none; margin-top: 25px; }
	nav ul li:hover { background: none; }
	
	nav ul li a {
		display: block;
		margin: 8px 10px 8px 10px;
		padding: 6px 15px 6px 2px; /*Change from 8px 15px*/
		border-bottom: 1px solid rgba(255,255,255,.25); /*Change from border*/
		border-radius: 6px; width: auto;
	}
	nav ul li a:hover { background-color: rgba(255,255,255,.2); }
	
	nav ul ul { background: none; }	
	nav ul ul li a { margin-left: 30px; }
	nav ul ul ul li a { margin-left: 60px; }
	nav a[aria-haspopup="true"]::after { display: none; }
	
	footer#pageFooter { background-color: #18356b; background-image: none; }
	
	.address { width: 90%; }
	article img { width: 50%; padding-left: 1%; }
	
	section#testimonials {
	-moz-column-count: 2;
	-webkit-column-count: 2;
	column-count: 2;
	}
	section#news img { padding-bottom: 50px; }
	
	
	
}



@media screen and (max-width: 425px) {

	header a.logo { top: 15px; }

	header div.hero {
		width: 100%;
		left: 0;
		top: 58px;
		text-align: center;
	}
	
	header div.hero h1 {
		font-size: 1em;
		margin-bottom: 10px;
	}
	
	/*Nav*/
	nav { padding-top: 30px; }

	nav a.mobile_menu { left:auto; right: 40px; top: 8px; margin-left: 0px; } 
	
	#slideshow { min-height: 180px; }
	article img { width: 90%; float: left; }
	
	section#programs,
	section#testimonials {
	-moz-column-count: 1;
	-webkit-column-count: 1;
	column-count: 1;
	}
	main#press {
	width: 90%;
	padding-left: 3%;
	}

}
