@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,900');

/* Basic Styles  */


html {
	color: #101820;
	font-size: 15px;

}

@media screen and (max-width:750px){
	html{
	font-size:10px;
	}
}

.oablue {
	color: #7d9bc1;
}

.oadblue {
	color: #415464;
}

.oabrown {
	color: #caab79;
}

h1, h2, h3, h4, h5, h6, p, a {
	font-family: 'Source Sans Pro', sans-serif;
	font-weight: 300;
}

a {
	color: #101820;
}

a:hover {
	text-decoration: none;
	color: grey;
}

a:active, a:visited {
	text-decoration: none;
	color: grey;

}

.bold {
	font-weight: 900;
}

p {
	font-size: 1em;
}

h1 { 
	font-size: 2.6rem;
}

h3 { 
	font-size: 1.6rem;
}


.preheader {
	margin: 1rem;
}

#deeplogo {
	z-index: 100;
}

#hero {
	text-align: center;
}

#heroimg {
	width: 100%;
	margin-top: -6em;
	z-index: -1;
	position: relative;
}

.navbar {
	display: flex;
	justify-content: center;
	text-align: center;
	background-color: #f5f5f6;
	-webkit-margin-before: 0;
    -webkit-margin-after: 0;
    -webkit-margin-start: 0;
    -webkit-margin-end: 0;
    -webkit-padding-start: 0;
	margin-top: 3em;

}

.navbar li {
	text-decoration: none;
	list-style-type: none;
	flex-grow: 1;
	margin: .5em 0;
	font-size: 1.6rem;
}

#features, #specs, #downloads {
	margin: 5em 0;
}

.heropic {
	width:100%;
	margin-top: 2em;
}

.heropic2 {
	
	width:150%;
	margin-top: 2em;
}

.spacey {
	margin-top:5rem;
}

.aboutus {
	background-color:#f5f5f6;
	padding: 5em 0;
}

.spec {
	padding: 1em;
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-ms-transition: all .5s ease-in-out;
	-o-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out;
}

.spec p {
	text-align: right;
}

.spec:hover {
	-webkit-box-shadow: 0px 13px 22px -9px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 13px 22px -9px rgba(0,0,0,0.75);
	box-shadow: 0px 13px 22px -9px rgba(0,0,0,0.75);
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-ms-transition: all .5s ease-in-out;
	-o-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out;

}

footer {
	color: white;
	background-color: #101820;
	padding: 2em 0 4em;
}

footer a {
	color:white;
}

.wider {
	margin:0 1em 0 0;
}


@media screen and (max-width: 700px){
.mobilespace {
	margin-top: 5em;
}
}