﻿#top {
	background: transparent;
	color: #f1f1f1;
	box-shadow: none;
	transition: all 0.2s ease;
}

#outer-wrap {
	background-color: var(--color-top-background);
}

.hero {
	position: relative;
	color: var(--color-top-text);
}

.hero h2 {
	margin-top: 0;
	color: #3f1642;
	color: var(--color-logo);
}

.hero h2 span {
	color: var(--color-logo-text);
}

.hero .container {
	padding-top: 11vh;
	padding-bottom: 11vh;
}

@media (min-width: 776px) {
	.hero .container {
		background: transparent url("../images/woman-on-books.svg") right bottom no-repeat;
		background-size: auto 100%;
	}
}

article {
	padding: 0;
}

#content {
	padding: 0;
}

#content>.container {
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 0;
}

section {
	padding: 4rem 0;
	background: #fff;
	position: relative;
}

article {
	background-color: #f1f1f1;
}

#first {
	background-color: var(--color-pullout-background);
}

#first .container {
	margin-top: -7em;
}

#first .row {
	margin-left: 5em;
	margin-right: 5em;
	background-color: #fff;
	box-shadow: 0 2px 30px rgba(0, 0, 0, 0.1);
	border-radius: 0.75rem;
}

#first .fa {
	color: #bdcada;
	font-size: 2em;
}

#second:before {
	content: '';
	display: block;
	position: absolute;
	left: 0;
	top: 15%;
	height: 60%;
	width: 45%;
	background-color: #f5f5f5;
}

#second>.container:before {
	content: '';
	display: block;
	position: absolute;
	bottom: 5%;
	left: 40%;
	background-image: radial-gradient(#777777 20%, transparent 20%);
	background-position: 0 0;
	background-size: 10px 10px;
	height: 100px;
	width: 100px;
}

#second .card {
	margin-top: 20%;
}

#second ol {
	list-style-type: none;
	counter-reset: li;
	padding-left: 0;
	margin-left: 0;
}

#second li {
	padding: 1em 0;
	margin: 0;
	border-bottom: 1px solid #eee;
}

#second li:before {
	counter-increment: li;
	content: counter(li, decimal-leading-zero);
	color: #aaa;
	margin-right: 1em;
}

#third:before {
	content: '';
	display: block;
	position: absolute;
	left: 0;
	top: 8rem;
	bottom: 10%;
	width: 90%;
	background-color: #f5f5f5;
}

#third>.container:before {
	content: '';
	display: block;
	position: absolute;
	top: 3rem;
	right: 15%;
	background-image: radial-gradient(#777777 20%, transparent 20%);
	background-position: 0 0;
	background-size: 10px 10px;
	height: 100px;
	width: 100px;
}

#third blockquote {
	margin: 4rem 0;
}
