body {
	font-family:'Oswald', sans-serif;
}
#wrapper {
	overflow-x:hidden;
}

/* ----- Navbar Section ----- */

nav {
	background-color:#21293d;
	color:white;
	height:70px;
	text-align:center;
}
nav ul {
	padding:0;
	margin:0;
	height:70px;
}
nav li {
	font-family:'Lato', sans-serif;
	list-style-type:none;
	font-size:1.1em;
	padding:2px 10px;
	margin:23px 0px;
	display:inline-block;
	transition:0.5s;
}
nav li:hover {
	background-color:#646b83;
	transition:0.5s;
}
nav li a {
	color:white;
}
nav li a:hover,
nav li a:focus {
	text-decoration:none;
	color:white;
}
#brandLogo {
	position:relative;
	top:-3px;
	margin:0px 10px;
}
#brandLogo:hover {
	background-color:transparent;
}

/* ----- Hero Section ----- */

#hero {
	position:relative;
	margin-top:70px;
	background: #364160; /* Old browsers */
	background: -moz-linear-gradient(45deg, #364160 0%, #505870 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(45deg, #364160 0%,#505870 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(45deg, #364160 0%,#505870 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	height:600px;
	text-align:center;
	color:white;
}
#heroIntro {
	position:relative;
	z-index:2;
	display:inline-block;
	margin:30px auto;
	margin-bottom:0px;
}
#heroIntro p {
	font-family:'Lato', sans-serif;
	font-size:1.15em;
	text-align:justify;
	max-width:570px;
	margin-top:20px;
	padding-left:5px;
}
#hero #slogan {
	display:block;
	margin:0 auto;
	position:relative;
	z-index:2;
	margin-top:30px;
}
#hero #slogan p {
	font-family:'Oswald', sans-serif;
	font-size:1.8em;
	font-style:italic;
	text-align:center;
}
#backgroundImage {
	position:absolute;
	top:0px;
	width:100%;
	height:600px;
	background-image: url('../images/backgroundImage.jpg');
	opacity:0.15;
	z-index:1;
}
.flipInX {
	animation-delay:1s;
}
#caret {
	z-index:2;
	margin-top:40px;
	position:relative;
	display:block;
	left:-8px;
	transition:0.5s;
}
#caret img {
	width:60px;
	transition:0.5s;
}
#caret img:hover {
	margin-top:20px;
	transition:0.5s;
}
.caretHover {
	margin-top:20px !important;
	transition:0.5s !important;
}

/* ----- What We Do. -----*/

#whatWeDo {
	color:#3e4865;
}
#whatWeDo h1 {
	display:inline-block;
	font-style:italic;
	font-size:3.2em;
	border-bottom: 2px solid #3e4865;
	padding:5px 0px;
	margin-bottom:0;
}
#whatWeDo h2 {
	margin-top:5px;
	font-size:1.7em;
	margin-left:100px;
}

#whatWeDo p {
	margin-top:25px;
	font-size:1.1em;
}
#whatWeDo .button {
	display:inline-block;
	padding:6px 30px;
	float:right;
	margin:0px 75px;
	background-color:#474f74;
	color:white;
	font-style:italic;
	font-size:1.25em;
	transition:0.5s;
}
#whatWeDo .button:hover {
	color:#474f74;
	background-color:#eee;
	transition:0.5s;
}
#whatWeDo .infoBlock {
	margin:100px 0px 160px 0px;
}
#whatWeDo .row {
	display:flex;
}
#whatWeDo img {
	height:100%;
}

/* ----- Why Choose Us. ----- */

#whyChooseUs {
	background-color:#898c97;
	color:white;
	background-image: url('../images/whychooseus.jpg');
}
#whyChooseUs h1 {
	text-align:center;
	margin:100px 0px 10px 0px;
}
#whyChooseUs hr {
	max-width:100px;
	border-top:1px solid white;
	margin:0 auto;
	margin-bottom:40px;

}
#whyChooseUs p {
	font-size:1.1em;
	margin:0px;
}
#whyChooseUs .row {
	background-color: rgba(117,120,131,0.2);
	display:flex;
	padding:15px 0px;
	margin-bottom:100px;
}
#whyChooseUs .halfLeft {
	border-right: 2px solid white;
	text-align:right;
	padding-top:25px;
	padding-bottom:25px;
}
.halfLeft a {
	color:inherit;
}
.halfLeft a:hover {
	color:inherit;
	text-decoration:none;
}
.halfLeft h2 {
	transition:0.2s;
}
.halfLeft h2:hover {
	margin-right:20px;
	transition:0.4s;
}
.halfRight,
.halfLeft {
	display:flex;
	flex-direction: column;
	justify-content: center;
}
#whyChooseUs .halfRight {
	border-left: 2px solid white;
}
#whyChooseUs .button {
	width:120px;
	margin-right:85px;
	margin-top:15px;
	font-size:1.02em;
	padding:5px 15px;
}
.mottoHover {
	margin-right:20px !important;
	transition:0.4s !important;
}

/* ----- Get In Touch ----- */

#getInTouch {
	background-image: url('../images/contactBg.jpg');
	color:white;
	padding:25px 0px;
}
#getInTouch .row {
	display:flex;
	padding:0px 15px;
}
#getInTouch h1 {
	text-align:center;
	padding:30px 0px 0px 0px;
	margin:0;
}
#getInTouch hr {
	border-top:3px solid white;
}
#getInTouch .form-group {
	font-family:'Lato', sans-serif;
}
#getInTouch .button,
#whyChooseUs .button {
 	color:#364160;
 	background-color:white;
 	font-style:italic;
 	padding:7px 20px;
 	border:none;
 	font-size:1.15em;
 	float:right;
 	transition:0.5s;
}
#getInTouch .button:hover,
#whyChooseUs .button:hover {
	color:white;
	background-color:#364160;
	transition:0.5s;
}
#getInTouch textarea {
	resize:none;
	height:225px;
}
.form-control {
	border-radius:0;
	color:#364160;
}
#getInTouch .halfLeft {
	padding:15px 0px 15px 15px;
}
#getInTouch .halfRight {
	padding-left:30px;
	padding-right:30px;
}
#getInTouch .halfRight > p > span {
	font-size:1.5em;
	padding-right:5px;
}
#getInTouch .halfRight .row {
	margin-top:20px;
}
#getInTouch .halfRight .row span {
	color:#c7cfef;
}
#getInTouch .container {
	margin:65px auto;
	padding:0;
	background-color:rgba(97,100,111,0.8);
}
#getInTouch h4 {
	font-size:1.5em;
	text-align:center;
	padding:20px 0px 10px 0px;
	max-width:400px;
	margin:0 auto;
	border-bottom:1px solid white;
}
/* ----- Seperate pages ------ */

.numberBox {
	background-color:white;
	-webkit-box-shadow: 0px 1px 5px 0px rgba(82,82,82,1);
	-moz-box-shadow: 0px 1px 5px 0px rgba(82,82,82,1);
	box-shadow: 0px 1px 5px 0px rgba(82,82,82,1);
	width:100px;
	height:100px;
	font-size:3em;
	padding:20px 0px;
	text-align:center;
}
#servicesPage,
#aboutPage {
	padding:0;
}
#servicesPage img {
	padding:0px 0px 20px 0px;
	display:block;
	max-height:300px;
}
#aboutPage img {
	margin:0 auto;
}
#servicesPage p,
#aboutPage p {
	font-size:1.2em;
	font-family:'Lato', sans-serif;
}
#servicesPage h3,
#aboutPage h3 {
	font-size:1.4em;
	display:inline;
}
#servicesPage .row {
	margin:50px 0px;
}
.headerBg {
	padding-top: 135px;
	padding-bottom:50px;
	margin:0;
    text-align: center;
    background-color:#364160;
    color:white;
}
.headerBg h1 {
	font-size:3.2em;
}
.headerBg hr {
	width:50px;
	border-color:white;
}
.aboutInfo {
	display:block;
	margin:100px 0px;
	background-color:#364160;
}
.aboutInfo .row {
	display:flex;
	background-color:white;
	padding:10px;
	margin:0;
}
#aboutPage .container {
	background-color:#e7eaf2;
}
#aboutPage h2 {
	text-align:center;
	color:white;
	font-size:2.5em;
	padding-top:30px;
}
#aboutPage hr {
	max-width:300px;
}
#aboutPage ul  {
	font-family:'Lato', sans-serif;
}
#aboutPage .container {
	padding:0px 50px;
}
.anchor {
	position:absolute;
}

/* ----- Footer ----- */

footer {
	background-color:#2c2e35;
	color:white;
	font-style:italic;
	text-align:center;
	padding:40px 0px 20px 0px;
}
footer #linkContainer {
	width:250px;
	display:flex;
	margin:0 auto;
}
footer .fa-stack {
	margin:5px 2px;
	float:left;
}
footer .fa-stack-2x {
	color:#019959;
	transition:0.2s;
}
footer .fa-stack:hover .fa-stack-2x {
	color:#017745;
	transition:0.2s;
}
footer .fa-linkedin-square {
	float:right;
	color:#696f82;
	font-size:3.5em;
}
footer a {
	color:inherit;
}
footer a:hover,
footer a:focus {
	color:inherit;
}
footer hr {
	border-top:2px solid white;
	max-width:250px;
	margin:10px auto 5px auto;
}
#skydevstudios {
	color:#696f82;
	margin-top:50px;
}
#skydevstudios a {
	transition:0.3s;
	color:#2980B9;
}
#skydevstudios a:hover {
	color:#696f82;
	transition:0.3s;
	text-decoration:none;
}