/*
 * Globals
 */

@font-face {
    font-family: 'Sailec-Light';
    src: url('fonts/Sailec-Light.woff2') format('woff2'),
        url('fonts/Sailec-Light.woff') format('woff');
}
@font-face {
    font-family: 'Sailec-Regular';
    src: url('fonts/Sailec-Regular.woff2') format('woff2'),
        url('fonts/Sailec-Regular.woff') format('woff');
}
@font-face {
	    font-family: 'Sailec-Medium';
		src: url('fonts/Sailec-Medium.woff2') format('woff2'),
        url('fonts/Sailec-Medium.woff') format('woff');
}
@font-face {
	    font-family: 'Sailec-Bold';
		src: url('fonts/Sailec-Bold.woff2') format('woff2'),
        url('fonts/Sailec-Bold.woff') format('woff');
}

/*firefox fonts*/
html {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  font-smoothing: antialiased;
	overflow-y: auto;
}
@-moz-document url-prefix() {
  body {
    font-weight: lighter !important;
  }
}
/**/
body {
	font-family: 'Sailec-Regular';
	font-stretch: normal;
	font-size: 16px;
	-webkit-font-smoothing: antialiased;
	color: #ffffff;
  background-color: #778e9b;
}

/* Links */
a,
a:focus,
a:hover {
  color: #fff;
  text-decoration: underline;
}

/* Custom default button */
.btn,
.btn:hover,
.btn:focus {
  color: #fff;
  text-shadow: none; /* Prevent inheritance from `body` */
  background-color: #f43600;
  border: .05rem solid #fff;
  font-family: 'Sailec-Medium';
  text-transform: uppercase;
  letter-spacing: 0.07rem;
  height: 2.5rem;
  padding-top: 0.5rem;
  text-decoration: none;
}

/* Typography */
h2 {
  font-family: 'Sailec-Light';
  font-size: 18px;
  text-transform: uppercase;
  line-height: 2rem;
  letter-spacing: 0.15rem;
  margin-bottom: 1rem;
}
h2.lead {
	font-family: 'Sailec-Regular';
	font-size: 24px;
	line-height: 1.7;
	text-align: center;
}
h3 {
  font-family: 'Sailec-Bold';
  font-size: 24px;
  text-transform: uppercase;
  line-height: 2rem;
  letter-spacing: 0.15rem;
  margin-top: 1rem;
  margin-bottom: 1rem;
}
p.lead {
  font-family: 'Sailec-Medium';
  font-size: 1rem;
  line-height: 1.5rem;
  margin-top: 2rem;
  letter-spacing: 0.05rem;
}

@media (min-width: 576px) {
	h2.lead {
		font-size: 38px;
	}
	h3 {
		font-size: 18px;
	}
}

@media (min-width: 992px) {
	h2 {
		text-align: center;
	}
	h2.lead {
		font-size: 44px;
	}
	h3 {
		font-size: 24px;
	}
	p.lead {
		font-size: 1.3rem;
		line-height: 1.8rem;
	}
}

/*
 * Header
 */

.hero {
	padding: 5rem 0 3rem;
	background: linear-gradient(to bottom, #4528a1, #3743ce);
	text-align: center
}

#nextlayerLogo {
	width: 11rem;
	margin-bottom: 3rem;
}

#vIcon {
	margin: 3rem 0 0;
	width: 1.5rem;
}
.field-help {
	color: #9aa1a7;
	margin-top: 0.5rem;
}

@media (min-width: 576px) {
	.hero {
		padding-left: 3rem;
		padding-right: 3rem;
	}
	#nextlayerLogo {
		width: 13rem;
	}
}

@media (min-width: 992px) {
	.hero {
		padding: 8rem 0rem 3rem;
	}
	#nextlayerLogo {
		width: 13rem;
		margin-bottom: 6rem;
	}

}

/*
 * Introduction
 */

.intro {
  background: linear-gradient(to bottom, #3743ce, #2961fe);
	text-align: center;
}


/*
 * Signup
 */

.signup {
	padding: 1rem 0 5rem;
	background: linear-gradient(to bottom, #2961fe, #148fe9);
  text-align: center;
}

.signup-form {
	text-align: left;
}

.form-microcopy {
	color: #cbd2d7;
}

@media (min-width: 992px) {
	.signup {
		padding: 3rem 0 5rem;
	}

}

/*
 * Details
 */

.details {
	padding: 3rem 0;
	height: 100%;
  background: #ffffff;
  color: #000000;
}

/*
 * Footer
 */

.footer {
	padding-top: 3rem;
  background-color: #778e9b;
  color: #cbd2d7;
  font-size: 14px;
}

.footer img {
	width: 10rem;
	margin-bottom: 1rem;
}
.footer a {
	text-decoration: underline;
  color: #cbd2d7;
}

@media (min-width: 576px) {
	.footer .contacts {
		text-align: right;
	}
}
