/*
Responsive 996px grid system ~ Style CSS.
Copyright 2013, Josh Cope
*/

/* =============================================================================
   Site Styles
   ========================================================================== */
   
   #logo img {
		padding: 2.5em;
		background-color: #66a38b;
		z-index: 1;
		position: relative;
		margin-top: -43px;
   }
   
   #first-border {
		background-color: #202329;
		margin: 0 auto;
		padding: 0 auto;
		z-index: -1;
		position: relative;
   }
   
   #top-number {
		font-family: 'Titillium Web', sans-serif;
		font-weight: 600;
		font-size: 18px;
		color: #66a38b;
		padding: 0.5em 0;
		position: relative;
		text-align:right;
   }
   
   #first-border span {
		font-family: 'Titillium Web', sans-serif;
		font-size: 18px;
		font-weight: 500;
		color: #66a38b;
		margin-right: 2.5em;
   }
   
   #second-border {
		background-color: #2f323a;
		margin: 0 auto;
		position: relative;
   }
   
   .link {
		text-decoration: none;
   }
   
   .link-under {
		text-decoration: none;
   }
   
   .link-under:hover {
		text-decoration: underline;
		color: #292c33;
   }
   
   #navigation, #navigation ul {
		margin: 0;
		padding: 0;
		list-style-type: none;
		display: inline-flex;
   }
   
   #navigation li a {
		display: inline-block;
		text-decoration:none;
		color: #fff;
	}
	
	#navigation li {
		margin-top: 2.2em;
		font-family: 'Roboto', sans-serif;
		font-weight: 700;
	}

    #navigation li:nth-child(1),
    #navigation li:nth-child(2),
    #navigation li:nth-child(3),
    #navigation li:nth-child(4) {
		padding-right: 2em;
   }
   
    #navigation li a:hover {
		color: #676f82;
	}
	
	.slicknav_menu {
		display:none;
	}

	
	#aim-bg {
		background-image: url(../images/background-img.jpg);
		background-size: cover;
		height: 600px;
	}
	
	#aim-title {
		font-family: 'Titillium Web', sans-serif;
		font-size: 84px;
		font-weight: 700;
		color: #fff;
		margin-top: 2.5em;
	}
	
	#aim-title span {
		color: #66a38b;
	}
	
	#aim-subtitle {
		font-family: 'Roboto', sans-serif;
		font-size: 25px;
		font-weight: 300;
		color: #fff;
	}
	
	.med-banner {
		font-family: 'Roboto', sans-serif;
		font-size: 30px;
		font-weight: 900;
		color: #292c33;
	}
	
	#our-mission {
		margin: 4em 0;
	}
	
	#our-mission-underline {
		width: 140px;
		height: 5px;
		background-color: #d3d3d3;
		margin-top: 0.5em;
	}
	
	#mission-text {
		font-family: 'Titillium Web', sans-serif;
		font-size: 38px;
		font-weight: 200;
		color: #004154;
		margin-top: 0.5em;
	}
	
	#aim-quality {
		padding: 5em 0;
		background-color: #e1e1e1;
	}
	
	.quality-text {
		font-family: 'Roboto', sans-serif;
		font-size: 18px;
		font-weight: 300;
		color: #6f6b6f;
		line-height: 1.6em;
		margin-top: 10px;
	}
	
	#benefit-title {
		font-family: 'Titillium Web', sans-serif;
		font-size: 34px;
		font-weight: 700;
		color: #292c33;
		text-align: center;
		margin-top: 1.5em;
	}
	
	.benefit {
		text-align: center;
		margin-top: 4em;
	}
	
	.benefit-text {
		font-family: 'Roboto', sans-serif;
		font-size: 18px;
		font-weight: 800;
		color: #292c33;
		margin-top: 0.5em;
	}
	
	#learn {
		font-family: 'Titillium Web', sans-serif;
		font-size: 23px;
		font-weight: 200;
		color: #292c33;
		text-align: center;
		margin: 3em 0;
	}
	
	.blue-bg {
		background: #343740 url(../images/gray-fractal-pattern.jpg);
	}
	
	#request-img {
		background: url(../images/tube.png) no-repeat top right;
		height: 541px;
	}
	
	#request-title {
		font-family: 'Titillium Web', sans-serif;
		font-size: 33px;
		font-weight: 700;
		color: #fff;
		margin-top: 4em;
	}
	
	#request-title span {
		color: #66a38b;
	}
	
	#request-text {
		font-family: 'Roboto', sans-serif;
		font-size: 18px;
		font-weight: 200;
		color: #fff;
		line-height: 1.7em;
		margin-top: 1.2em;
	}
	
	#request-btn {
		font-family: 'Titillium Web', sans-serif;
		font-size: 17px;
		font-weight: 600;
		color: #fff;
		margin-top: 3em;
		background-color: #66a38b;
		border-radius: 5px;
		padding: 1em;
		text-align: center;
	}
	
	#request-btn:hover {
		background-color: #676f82;
	}
	
	#footer {
		background-color: #e1e1e1;
		padding: 2em 0 4em 0;
	}
	
	#footer hr {
		margin-bottom: 2em;
	}
	
	#company {
		font-family: 'Roboto', sans-serif;
		font-size: 18px;
		color: #202329;
		font-weight: 700;
	}
	
	#footer p {
		font-family: 'Roboto', sans-serif;
		font-size: 18px;
		color: #6f6b6f;
		font-weight: 300;
		margin: 0;
		padding: 0;
	}
	
	#contact span {
		font-family: 'Roboto', sans-serif;
		font-size: 18px;
		color: #202329;
		font-weight: 700;
	}
	

/* =============================================================================
   Page Styles
   ========================================================================== */
   
   .inner-hero-title {
		font-family: 'Titillium Web', sans-serif;
		font-size: 60px;
		font-weight: 700;
		color: #fff;
		text-align: center;
		padding-top: 2.25em;
   }
   
   .inner-main-copy {
		background-color: #fff;
		padding: 3em 0;
   }
   
   .inner-main-copy h3 {
		font-family: 'Roboto', sans-serif;
		font-size: 30px;
		color: #292c33;
		font-weight: 900;
   }
   
   .inner-main-copy p {
		font-family: 'Roboto', sans-serif;
		font-size: 18px;
		color: #6f6b6f;
		font-weight: 300;
		line-height: 1.6em;
   }
   
   .white-title {
		margin: 4em 0;
		text-align: center;
   }
   
   .white-title h2 {
		font-family: 'Titillium Web', sans-serif;
		font-size: 50px;
		font-weight: 700;
		color: #fff;
		margin: 0;
		padding: 0;
   }
   
   .white-title-underline {
		width: 140px;
		height: 10px;
		background-color: #4b525f;
		margin-left: 4em;
		padding: 0;
   }
   
   /* === THE PROCESS === */
   
   #process-header {
		background-image: url(../images/process_header.jpg);
		background-size: cover;
		height: 370px;
   }
   
   .step-odd {
		text-align: left;
		padding-bottom: 1em;
   }
   
   .step-even {
		text-align: right;
		padding-bottom: 1em;
   }
   
   .mobile-process-img {
		display: none;
   }
   
   .process-copy {
		margin-top: 7.5em;
   }
   
   .process-copy h4 {
		font-family: 'Titillium Web', sans-serif;
		font-size: 26px;
		font-weight: 700;
		color: #66a38b;
		margin: 0;
		padding: 0;
   }
   
   .process-copy p {
		font-family: 'Roboto', sans-serif;
		font-size: 18px;
		color: #fff;
		font-weight: 300;
		margin: 0;
		padding: 0;
   }
   
   .start-project {
		margin: 6em 0;
   }
   
   #project-title {
		font-family: 'Titillium Web', sans-serif;
		text-align: center;
		font-size: 50px;
		font-weight: 700;
		color: #202329;
   }
   
   #start-btn {
		background-color: #66a38b;
		font-family: 'Titillium Web', sans-serif;
		font-size: 18px;
		font-weight: 500;
		color: #fff;
		text-align: center;
		padding: 1em;
		border-radius: 5px;
		margin: 2em 0;
   }
   
   #start-btn:hover {
		background-color: #676f82;
   }
   
   /* === LEAN BENEFITS === */
   
   #lean-header {
		background-image: url(../images/process-bg.jpg);
		background-size: cover;
		height: 370px;
   }
   
   #lean-bg-img {
		background-image: url(../images/lean-img.jpg);
		background-size: cover;
		height: 427px;
   }
   
   /* === APPLICATIONS === */
   
   #applications-header {
		background-image: url(../images/applications-header.jpg);
		background-size: cover;
		height: 370px;
   }
   
   .circle-icons .lean-circles {
		margin: 3em 0 2em 0;
   }
   
   
   /* === INDUSTRIES SERVED === */
   
   #industries-header {
		background-image: url(../images/industries-header.jpg);
		background-size: cover;
		height: 370px;
   }
   
   .industries-underline {
		margin-left: 10em;
   }
   
   .circle-icons {
		text-align: center;
   }
   
   .circle-icons .right {
		text-align: right;
   }
   
   .circle-icons .left {
		text-align: left;
   }
   
   .circle-icons h4 {
		font-family: 'Roboto', sans-serif;
		color: #fff;
		font-weight: 300;
		font-size: 18px;
   }
   
   #second-row {
		padding: 1em 0 5em 0;
   }
   
   /* === CONTACT === */
   
   #contact-header {
		background-image: url(../images/contact-bg.jpg);
		background-size: cover;
		height: 370px;
   }
   
   #webform-title {
		font-family: 'Titillium Web', sans-serif;
		color: #6f6b6f;
		font-weight: 300;
		font-size: 38px;
		margin: 2em 0 0.5em 0;
   }
   
   #webform-title span {
		color: #66a38b;
		font-weight: 700;
		font-size: 38px;
   }
   
   #webform label span {
		font-family: 'Titillium Web', sans-serif;
		color: #292c33;
		font-weight: 300;
		font-size: 20px;
   }
   
   #webform .text-field {
		font-family: 'Titillium Web', sans-serif;
		background-color: #e8e8e8;
		padding: 1em;
		width: 450px;
		margin-bottom: 1em;
		border: none;
		border-radius: 5px;
		color: #292c33;
   }
   
   #webform textarea {
		font-family: 'Titillium Web', sans-serif;
		background-color: #e8e8e8;
		padding: 1em;
		width: 948px;
		height: 75px;
		margin-bottom: 1em;
		border: none;
		border-radius: 5px;
		color: #292c33;
   }
   
   #webform #submit {
		background-color: #66a38b;
		padding: 1em 5em;
		color: #fff;
		font-family: 'Titillium Web', sans-serif;
		font-weight: 500;
		font-size: 18px;
		margin: 2em 0 3em 0;
		border:none;
		border-radius: 5px;
   }
   
   #webform #submit:hover {
		background-color: #676f82;
	}
   
   #webform .success {
		background-color: #66a38b;
		color: #fff;
		font-weight: 700;
		margin-top: 1em;
		padding: 2em;
		text-align: center;
   }
   
   #webform .error {
		background-color: #da0000;
		color: #fff;
		font-weight: 700;
		margin-top: 1em;
		padding: 2em;
		text-align: center;
   }
   

/* =============================================================================
   Media Queries
   ========================================================================== */

/* Tablet Portrait size to Base 996px */
@media only screen and (min-width: 768px) and (max-width: 995px) {

	.js #menu {
		display:none;
	}
	
	.js .slicknav_menu {
		display:block;
	}
	
	#logo {
		display: none;
	}
	
	#top-number {
		display: none;
    }
	
	#second-border {
		display: none;
	}

	#process-steps h2 {
		font-size: 42px;
	}

	.process-copy {
		margin-top: 5em;
    }
   
	#aim-title {
		font-size: 64px;
	}
	
	#aim-subtitle {
		font-size: 18px;
	}
	
	#aim-bg {
		height: 500px;
	}
	
	#request-title span {
		color: #fff;
	}
	
	#request-btn {
		font-size: 16px;
	}
	
	#webform .text-field {
		width: 300px;
    }
   
    #webform textarea {
		width: 684px;
    }
   
    #webform #submit {
		margin: 2em 0 3em 0.5em;
		padding: 1em 2em;
    }
	
	#footer p {
		font-size: 16px;
	}
	
	/* === INDUSTRIES SERVED === */
	
	.industries-underline {
		margin-left: 7em;
    }

}

/* All Mobile Sizes */
@media only screen and (max-width: 767px) {

	.desktop-process-img {
		display: none;
	}
	
	.mobile-process-img {
		display: block;
		margin-bottom: 2em;
	}
	
	#logo {
		display: none;
	}
	
	#top-number {
		display: none;
    }
	
	#second-border {
		display: none;
	}
	
	#aim-title {
		font-size: 60px;
		margin-top: 1em;
	}
	
	#aim-subtitle {
		font-size: 18px;
		padding-right: 6em;
	}
	
	#aim-bg {
		height: 500px;
	}
	
	#mission-text {
		font-size: 28px;
	}
	
	.homepage-ctas {
		margin-bottom: 2em;
	}
	
	#request-title {
		margin-top: 2em;
    }
	
	.inner-hero-title {
		font-size: 44px;
		padding: 2.25em 0.2em 0 0.2em;
	}
	
	.inner-main-copy {
		padding: 0.5em 0;
	}
	
	#process-steps h2 {
		font-size: 46px;
		text-align: center;
	}
	
	.process-copy {
		margin-top: 0em;
    }
   
   .step-odd {
		text-align: center;
		margin-bottom: 3em;
    }
   
   .step-even {
		text-align: center;
		margin-bottom: 3em;
    }
	
	#project-title {
		font-size: 38px;
		text-align: center;
	}
	
	#webform-title {
		font-size: 24px;
	}
	
	#webform-title span {
		font-size: 24px;
	}
	
	#webform .text-field {
		width: 230px;
    }
   
    #webform textarea {
		width: 230px;
    }
   
    #webform #submit {
		margin: 2em 0 3em 0em;
    }
   
   .js #menu {
		display:none;
	}
	
   .js .slicknav_menu {
		display:block;
	}
	
	/* === INDUSTRIES SERVED === */
	
	.industries-underline {
		margin-left: 8.5em;
    }
	
	.one {
		margin-top: 2em;
    }

}

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

	.js #menu {
		display:none;
	}
	
	.js .slicknav_menu {
		display:block;
	}
	
	#top-number {
		display: none;
    }
	
	/* === LEAN PROCESSES === */
	
	.white-title {
		margin: 2em 0 0 0;
		text-align: center;
	}
	
	.one {
		margin-top: 2em;
    }


}

/* Mobile Portrait Size to Mobile Landscape Size */
@media only screen and (max-width: 479px) {

	.js #menu {
		display:none;
	}
	
	.js .slicknav_menu {
		display:block;
	}
	
	#top-number {
		display: none;
    }
	
	/* === LEAN PROCESSES === */
	
	.white-title {
		margin: 2em 0 0 0;
		text-align: center;
	}
	
	/* === INDUSTRIES SERVED === */
	
	.industries-underline {
		margin-left: 4em;
    }
	
	.one {
		margin-top: 2em;
    }

}


/* =============================================================================
   Font-Face
   ========================================================================== */
/* This is the proper syntax for an @font-face file

/* @font-face {
font-family: 'FontName';
src: url('../fonts/FontName.eot');
src: url('../fonts/FontName.eot?iefix') format('embedded-opentype'),
url('../fonts/FontName.woff') format('woff'),
url('../fonts/FontName.ttf') format('truetype'),
url('../fonts/FontName.svg#FontName') format('svg');
font-weight: normal;
font-style: normal; }
*/