/*
 * Globals
 */

/* Links */
a,
a:focus,
a:hover {
  color: #fff;
}

/* Custom default button */
.btn-default,
.btn-default:hover,
.btn-default:focus {
  color: #333;
  text-shadow: none; /* Prevent inheritence from `body` */
  background-color: #fff;
  border: 1px solid #fff;
}


/*
 * Base structure
 */

html,
body {
  height: 100%;
  background-color: #fff;
}

body {
  color: #4c4c4c;
  font-family: Arial, Helvetica, san-serif;
  background: transparent;
}


h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6 {
	font-family: 'Open Sans', sans-serif;
}

h1 {
	text-transform: uppercase;
	font-family: 'Open Sans 700', sans-serif;
	font-weight: 700;
	letter-spacing: 5px;
}

h2 {
	text-transform: uppercase;
	font-family: 'Open Sans 700', sans-serif;
	font-weight: 700;
	letter-spacing: 3px;
}

h3 {
	text-transform: uppercase;
	font-family: 'Open Sans 100', sans-serif;
	font-weight: 100;
	letter-spacing: 3px;
}


p.project {
	margin: 0 0 40px 30px;
}

/* Extra markup and styles for table-esque vertical and horizontal centering */
.site-wrapper {
  display: table;
  width: 100%;
  height: 100%; /* For at least Firefox */
  min-height: 100%;
}
.site-wrapper-inner {
  display: table-cell;
  vertical-align: top;

}
.cover-container {
  margin-right: auto;
  margin-left: auto;
	clear: both;

}

.center-vertical {
	position: relative;
	/* top: 8%; */
	/*transform: translateY(-50%);*/
}

@media only screen and (max-device-width: 480px) {
	.center-vertical {
		top: -5%;
	}
}

/* Padding for spacing */
.inner {
  padding: 10px 10px 10px 30px;
margin: 0 auto;
}


/*
 * Header
 */

.masthead {
	background: #2a2a2a;
	padding: 0 0 5px 0;
}

.masthead-brand {
  margin-top: 10px;
  margin-bottom: 20px;
}

.masthead-nav > li {
  display: inline-block;
}
.masthead-nav > li + li {
  margin-left: 20px;
}
.masthead-nav > li > a {
  padding-right: 0;
  padding-left: 0;
  font-size: 16px;
  font-weight: 200;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #fff; /* IE8 proofing */
  border-bottom: 2px solid transparent;
}
.masthead-nav > li > a:hover,
.masthead-nav > li > a:focus {
  background-color: transparent;
  border-bottom-color: rgba(255,255,255,.25);
}
.masthead-nav > .active > a,
.masthead-nav > .active > a:hover,
.masthead-nav > .active > a:focus {
  color: #fff;
  border-bottom-color: #fff;
}

@media (min-width: 768px) {
  .masthead-brand {
    float: left;
  }
  .masthead-nav {
    float: left;
	margin: 20px 0 0 4em;
  }
}


/*
 * Cover
 */

.cover {
  padding: 0 20px;
}
.cover .btn-lg {
  padding: 10px 20px;
  font-weight: bold;
}


/* JUMBOTRON */

		#intro .mask-bg {
			background: url('img/overlay.png') repeat rgba(0,0,0,0.6);;
			height: 100%;
		}

		#about .mask-bg {
			background: url('img/about_bg.png') repeat rgba(0,0,0,0.6);;
			height: 100%;
		}

		#home .mask-bg {
			background: url('img/overlay.png') repeat rgba(0,0,0,0.6);;
			height: 100%;
		}

		#intro { 
			background: url(img/home02.jpg) 100% 0 fixed no-repeat;
			background-size:cover;
			margin: 0 auto; 
		    width: 100%; 
			min-height: 600px;
			height: 100%;
		    position: relative; 
		    box-shadow: 50px 0 50px 0 rgba(0,0,0,0.8);
			color: #FFF;
			text-align: center;
		}

		#aboutClick a:link, #aboutClick a:visited {
			width: 100px;
			height: 61px;
			margin: 2em auto 0 auto;
			background: url(img/arrow_down.png) no-repeat;
			cursor: pointer;
			display: block;	
		}

		#aboutClick a:hover {
			background: url(img/arrow_down-hover.png) no-repeat;
			text-decoration: none;
		}

		.jumbotron img {
			margin: 0 auto;
		}

@media only screen and (max-device-width: 480px) {
	#intro {
		box-shadow: 0;
		background: url(img/home02_mobile.jpg) 100% 0 fixed no-repeat;
	}

	#intro h1 {
		max-width: 400px;
		padding: 0;
		margin: 0;
		letter-spacing: 1px;
	}

	#aboutClick a:link, #aboutClick a:visited {
		margin: 5px auto 0 auto;
	}
}

		#intro img {
			/* opacity:0.9;
			filter:alpha(opacity=90); /* For IE8 and earlier */ */
			margin: 0 auto;
		} 

		#intro h1 {
			margin: 15px auto;
			line-height: 1.3em;
			padding: 20px 0;
		
		}

		#intro h3 {
			margin: 15px auto;
			line-height: 1.3em;
			padding: 10px 0;
			width: 50%;
		
		}

		#intro hr {
			border-top: 1px dashed;
			width: 50%;
			margin: 15px auto 0px auto;
		}

		#home { 
			/* background: url(img/home01.jpg) 100% 0 fixed no-repeat;
			background-size:cover; */
			background: #2a2a2a;
			margin: 0 auto; 
			padding: 40px 0;
		    width: 100%; 
			min-height: 400px;
			/* height: 100%; */
		    position: relative; 
		    box-shadow: 70px 0 80px 0 rgba(0,0,0,0.8);
			color: #FFF;
			text-align: center;
			letter-spacing: 4px;
		}

@media only screen and (max-device-width: 480px) {
		#home { 
			/* background: url(img/home01.jpg) 100% 0 fixed no-repeat;
			background-size:cover; */
			background: #2a2a2a;
			margin: 0 auto; 
			padding: 40px 0;
		    width: 100%; 
			min-height: 200px;
			/* height: 100%; */
		    position: relative; 
		    box-shadow: 70px 0 80px 0 rgba(0,0,0,0.8);
			color: #FFF;
			text-align: center;
			letter-spacing: 4px;
		}
}

		#home img {
			margin: 0 auto;
		}

		#home h4 {
			text-transform: uppercase;
		}

		#home ul {
			padding: 20px 0 40px 0;
		}

@media only screen and (max-device-width: 480px) {
		#home li {
			margin-right: 0px;
		}

		#home li:last-of-type {
			margin-right: 0;
		}

}

		#home li {
			margin-right: 36px;
		}

		#home li:last-of-type {
			margin-right: 0;
		}

		#about { 
			background: #888888;
			background-size:cover;
			margin: 0 auto; 
		    width: 100%; 
			min-height: 400px;
			height: 100%;
		    position: relative; 
		    box-shadow: 50px 0 50px 0 rgba(0,0,0,0.8);
			color: #FFF;
			text-align: center;
		}

@media only screen and (max-device-width: 480px) {
		#about { 
			background: #888888;
			background-size:cover;
			margin: 0 auto; 
		    width: 100%; 
			min-height: 200px;
			height: 100%;
		    position: relative; 
		    box-shadow: 50px 0 50px 0 rgba(0,0,0,0.8);
			color: #FFF;
			text-align: center;
		}
}

		#about h1 {
			margin: 15px auto;
			line-height: 1.3em;
			padding: 20px 0 10px 0;
			text-shadow: 1px 3px rgba(0,0,0,0.4);
		}

		#about h2 {
			text-shadow: 1px 3px rgba(0,0,0,0.4);
			margin-bottom: 20px;
		}

		#about img {
			margin: 0 auto;
		}



/** CONTACT **/

		#contactMain { 
			/* background: url(img/home02.jpg) 100% 0 fixed no-repeat;
			background-size:cover; */
			background: #fff;
			margin: 0 auto; 
		    width: 100%; 
			min-height: 600px;
			height: 100%;
		    position: relative; 
		    /* box-shadow: 50px 0 50px 0 rgba(0,0,0,0.8); */
			color: #000;
			text-align: left;
		}

		h2.contact {
			padding: 20px 0 10px 0;
		}

		#contactMain img {
			float: left;
		}

		#contactMain h2 {
			float: left;
			margin: 0 0 0 30px;
			max-width: 700px;
		}

		#contactMain h4 {
			max-width: 600px;
			line-height: 1.4em;
			float: left;
			clear: both;
			margin: 0 0 20px 152px;
		}

		#contactMain h4 a:link, #contactMain h4 a:visited {
			color: #000;
			text-decoration: underline;
		}


		@media only screen and (max-device-width: 480px) {


			h2.contact {
				padding: 20px 0 10px 0;
			}

			#contactMain img {
				margin: 0 auto;
				float: none;
			}

			#contactMain h2 {
				padding: 0;
				margin: 20px 0 30px 0;
				width: 290px ;
			}

			#contactMain h4 {
				width: 290px;
				line-height: 1.4em;
				clear: both;
				margin: 0 0 20px 0;
				overflow: hidden;
				padding: 0;
			}
		}


		#contactForm { 
			/* background: url(img/home01.jpg) 100% 0 fixed no-repeat;
			background-size:cover; */
			background: #2a2a2a;
			margin: 0 auto; 
			padding: 40px 0;
		    width: 100%; 
			min-height: 400px;
			/* height: 100%; */
		    position: relative; 
			color: #FFF;
			text-align: left;
			letter-spacing: 4px;
		}


		#letsChat a:link, #letsChat a:visited {
			width: 100px;
			height: 61px;
			margin: 2em auto 0 auto;
			background: url(img/lets_chat.png) no-repeat;
			cursor: pointer;
			display: block;	
		}

		#letsChat a:hover {
			background: url(img/lets_chat-hover.png) no-repeat;
			text-decoration: none;
		}



.capabilitiesThumb {
	float: left;
}

.capabilitiesContent {
	float: left;
}

.height100 {
	height: 100%;
	width: 100%;
	position: relative;
	float: left;
}

/*
 * Footer
 */

.footer {
bottom: 0;
width: 100%;
background: #b2b2b2;
color: #5e5e5e;
padding: 20px 0 20px 0;
min-height: 100px;
text-transform: uppercase;
float: left;
margin: 0;
}

.footer img {
	float: left;
	margin: 0 5px 0 10px;
}

.footer div {
	float: left;
	margin: 0;
	font-size: .8em;
}

.footer p {
	float: left;
	margin: 0 0 0 20px;
}

.footer ul {
	float: left;
	clear: both;
	margin: 0 !important;
}

.footer ul li {
	list-style: none;
	margin: 0 10px 0 0;
	display: inline-block;
	letter-spacing: 2px;
	font-weight: 100;
}

/*
 * Affix and center
 */

@media (min-width: 768px) {
  /* Pull out the header and footer */
  .masthead {
	margin: 0 auto;
	text-align: center;
    top: 0;
  }
  .mastfoot {
    position: fixed;
    bottom: 0;
  }
  /* Start the vertical centering */
  .site-wrapper-inner {
    vertical-align: middle;
  }
  /* Handle the widths */
  .masthead,
  .mastfoot,
  .cover-container {
    width: 100%; /* Must be percentage or pixels for horizontal alignment */
  }
}

@media (min-width: 992px) {
  .masthead,
  .mastfoot,
  .cover-container {
    width: 100%; /* Must be percentage or pixels for horizontal alignment */
  }
}

.imgCenter {
	margin: 0 auto;
}

.hideme
{
    opacity:0;
}

/* SCROLL TO TOP */
		.scroll-to-top {
			position: fixed;
			bottom: 1em;
			right: 1em;
			background:url(img/scroll-to-top.png) no-repeat;
			width:55px;
			height: 55px;
			padding-right: 1em;
			display: none;
			z-index: 999;
			cursor: pointer;
		}


/* FONT STYLES */

h2.underline {
	border-bottom: 1px solid #b2b2b2;
	padding: 0 0 8px 0;
	margin: 0 0 15px 0;
}