
/* page layout properties */
body {
	position:relative;
	background-color:#e0e0e0;
	color:#000;
	font-size:14px;
}
.page {
	font-size:16px;
}
.right {
	text-align:right;
}
.center {
	text-align:center;
}
.left {
	text-align:left;
}

.bg-image {
	background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-position: 50% 50%;
}
.alert {
	position:absolute;
	right:10px;
	top:100px;
	font-size:14px;
}
.w-80 {
	width:80%;
}
.p-bot {
	padding-bottom:10px;
}
.w-60 {
	width:60%!important;
}
.darkblack {
	background-color:#000;
	color:#ccc!important;
}
.relative {
	position:relative;
}
.absolute {
	position:absolute;
}
.pane {
	min-height:calc(100vh - 41px);
}
.section {
	min-height:calc(300px + 20vh);
}
.section-lg {
	height:calc(400px + 30vh);
}
.section-sm {
	min-height:calc(200px);
}
.padded {
	padding:10px;
}
.double-padded {
	padding:20px;
}
.top-space {
	margin-top:100px;
}
.top-jump {
	margin-top:200px;
}
.space {
	margin-bottom:10px;
}
.double-space {
	margin-bottom:20px;
}
.top-padded-xl {
	padding-top:125px;
}
.top-padded {
	padding-top:50px;
}
.bottom-padded {
	padding-bottom:50px;
}
.bottom-big-padded {
	padding-bottom:100px;
}
.double-top-space {
	margin-top:100px;
}
.right-space {
	padding-right:80px;
}
.margin-right {
	margin-right:10px;
}
.left-space {
	padding-left:80px;
}
.double-right-space {
	padding-right:160px;
}
.big-space {
	margin-bottom:100px;
}
.top-neg-space {
	margin-top:-100px;
}
.text-sm {
	font-size:12px;
}
.no-margin {
	margin:0;
}
.no-padding {
	padding:0;
}
.top {
	z-index:100;
}
.bottom {
	position:absolute;
	bottom:0;
	left:0;
}
.carousel-item {
	color:#000;
	z-index:1;
}
.trans {
	opacity:0;
}
.border-black {
	border:1px solid #000;
}
.margin {
	margin:5px;
}
.top-space-supernav {
	margin-top:41px;
}
.supernav a{
	color:#fff;
}
.supernav a:hover {
	color:#ccc!important;
}
.services-box {
	width:400px;
	max-width:100%;
	padding:7px 12px 10px 12px;
	margin-left:50px;
	height:300px;
	color:#000;
}
.services-box .icon {
	position:absolute;
	top:-100px;
	right:30px;
	font-size:200px;
	color:#ccc;
}
.product-logo:hover .product-grey {
	display:none;
	transition:0.2s;
}
.product-cropped {
	display:none;
	transition:0.2s;
}
.product-logo:hover .product-cropped {
	display:block;
	transition:0.2s;
}
.m-t-n-sm {
	margin-top:-0.5%;
}
.m-t-n-md {
	margin-top:-30px;
}
.padded-left {
	padding-left:10px;
}
.padded-right {
	padding-right:10px;
}
.social-link {
	font-size:32px;
	color:#777;
}
.social-link:hover {
	color:#ccc;
}
.padded-top {
	padding-top:50px;
}
.padded-bottom {
	padding-bottom:50px;
}
.row {
	margin:0;
}
.display {
	font-family: 'Oswald', sans-serif;
}
.display-1 {
	font-family: 'Oswald', sans-serif;
	font-size:calc(36px + 4vw);
}
.display-2 {
	font-family: 'Oswald', sans-serif;
	font-weight:300;
	font-size:calc(16px + 2vw);
}
.display-4 {
	font-family: 'Oswald', sans-serif;
	font-size:calc(24px + 1.2vw);
}
.display-5 {
	font-family: 'Oswald', sans-serif;
	font-size:calc(16px + 1.6vw);
	margin-top:-10px;
}
.nav-link {
	font-size:28px;
	font-family: 'Oswald', sans-serif;
	font-weight:300;
}
.navbar .nav-link {
	font-size:28px;
	font-family: 'Oswald', sans-serif;
	font-weight:300;
	border-top:5px solid #444;
}
.navbar .nav-link.active {
	border-top:5px solid white;
	padding-top:5px;
}
.navbar .nav-link:hover {
	border-top:5px solid white;
	padding-top:5px;
}
.carousel-indicators li {
	background-color:#000!important;
	
}
.carousel-indicators .active {
	background-color:#999!important;
}
.dark-fade {
	color:#ccc;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,111111+11,010101+16,000000+100 */
	background: rgb(0,0,0); /* Old browsers */
	background: -moz-linear-gradient(-45deg, rgba(0,0,0,1) 0%, rgba(17,17,17,1) 11%, rgba(1,1,1,1) 16%, rgba(0,0,0,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(-45deg, rgba(0,0,0,1) 0%,rgba(17,17,17,1) 11%,rgba(1,1,1,1) 16%,rgba(0,0,0,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(135deg, rgba(0,0,0,1) 0%,rgba(17,17,17,1) 11%,rgba(1,1,1,1) 16%,rgba(0,0,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
.transition-top {
	position:absolute;
	top:0;
	left:0;
}
.cover {
	position:absolute;
	left:0;
	top:0;
	height:100%;
	width:100%;
}
.black {
	background-color:#111;
	color:#fff;
}
.grey {
	background-color:#ccc;
	color:#000;
}
.grey a {
	color:#157ac5;
}
.grey a:hover {
	color:blue;
}
.text-v {
	text-orientation: sideways-right;
}
.header {
	min-height:125px;
	overflow:hidden;
}
.photo-bar-left {
	float:left!important;
}
.navbar {
	transition:0.4s;
}
a {
	color:red;
}
a:hover {
	text-decoration:none;
	color:darkred;
}
.navbar a {
	color:#e0e0e0;
}
.navbar a:hover {
	text-decoration:none;
	color:#fff!important;
}
.nav-item {
	margin:20px;
	list-style:none;
}
.nav-link {
	color:#ccc;
	padding:0!important;
}
.footer a {
	color:#ccc;
}
.footer a:hover {
	color:#fff;
}
.navbar.scrolled {
	color:#fff;
	transition:0.4s;
}
.padded-left {
	padding-left:10px;
}
.shadow {
	-webkit-box-shadow: 2px 2px 10px 0px rgba(0,0,0,0.25);
	-moz-box-shadow: 2px 2px 10px 0px rgba(0,0,0,0.25);
	box-shadow: 2px 2px 10px 0px rgba(0,0,0,0.25);
}
.navbar-logo {
	width:90px;
	margin-top:10px;
	margin-left:10px;
}
.flex-center {
    align-items: center;
    display: flex;
    justify-content: center;
}
.text-lg {
	font-size:28px;
	font-family:"Oswald";
}
.text-muted {
	color:#eaeaea;
}
.square {
	max-height:225px;
	max-width:300px;
	margin:5px;
}
.olson-logo {
	width:200px;
	margin-top:-15px;
}
.light {
	background-color:#eaeaea;
	color:#000;
}
.white {
	background:white;
	color:black;
}
.image-box {
	height:300px;
	position:relative;
	transition:0.2s;
}
.image-mask {
	position:absolute;
	left:0;
	z-index:100;
	transition:0.2s;
}
.image-reveal {
	opacity:0;
	position:absolute;
	left:0;
	z-index:100;
	transition:0.2s;
}
.image-box:hover .image-reveal {
	opacity:1;
	transition:0.2s;
}
.title {
	font-family:"Oswald",sans-serif;
	color:#444;
	font-size:calc(24px + 4vw);
	margin-top:-0.5em;
	margin-left: 30px;
}

/* SM and down */
@media(max-width:767px) {
	.dark-sm {
		background-color:#111;
		color:#fff;
	}
	.section-sm {
		height:calc(300px + 20vh);
	}
	.h-50-sm {
		height:50%;
	}
	.w-80 {
		width:100%;
		padding:10px;
	}
	.square {
		width:100%;
		height:100%;
		margin-right:10px;
	}
	.olson-logo {
		width:150px;
	}
	.services-box {
		margin-left:0px!important;
	}
	.top-space-sm {
		margin-top:100px;
	}
	.top-neg-space-sm {
		margin-top:-100px;
	}
	.transition {
		margin-top:-7px;
	}
	.container {
		max-width:100%;
	}
	.photo-bar-left {
		float:none;
		width:100%;
		display:flex;
		margin-bottom:30px;
	}
	.bottom-padded-sm {
		padding-bottom:30px;
	}
}

/* MD and down */
@media(max-width:991px) {
	.section-md {
		height:calc(300px + 20vh);
	}
	.center-md {
		text-align:center;
	}
	.carousel-header {
		padding-right:0px!important;
		padding-bottom:10px!important;
		right:0;
	}
	.w-80 {
		width:100%;
	}
}

/* LG and down */
@media(max-width:1091px) {
	.navbar-collapse {
		background-color:#111;
		width:50%;
	}
}

/* LG and up */
@media(min-width:992px) {
	.display-lg {
		opacity:1!important;
	}
	.text-grey {
		color:#999;
	}
	.display-md {
			opacity:0;
		}
	.w-80-lg {
		width:80%!important;
	}
	
	.top-space-lg {
		margin-top:100px;
	}
	.big-space-lg {
		margin-bottom:100px;
	}
	.top-padded-lg {
		padding-top:100px;
	}
	.top-neg-space-lg {
		margin-top:-100px;
	}
}

/* MD and up */
@media(min-width:768px) {
	.display-md {
		opacity:1;
	}
	.left-space-md {
		padding-left:80px;
	}
	.top-padded-md {
		padding-top:100px;
	}
	.top-space-md {
		margin-top:100px;
	}
}



/* stuff for keyframes */
@keyframes fade-in-right {
  from {
    opacity: 0;
    transform: translateX(-50px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes fade-in-left {
  from {
    opacity: 0;
    transform: translateX(50px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes fade-in-down {
  from {
    opacity: 0;
    transform: translateY(-100px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fade-in {
	from {
		opacity:0;
	}
	to {
		opacity:1;
	}
}
.animate-right {
  animation: fade-in-right ease 2s forwards;
  opacity: 1.0;
}
.animate-right-1 {
	animation: fade-in-right ease 2s forwards;
	animation-delay:0.5s;
  opacity: 1.0;
}
.animate-right02 {
	animation: fade-in-right ease 2s forwards;
	animation-delay:1s;
  opacity: 1.0;
}
.animate-right-3 {
	animation: fade-in-right ease 2s forwards;
	animation-delay:1.5s;
  opacity: 1.0;
}
.animate-right-4 {
	animation: fade-in-right ease 2s forwards;
	animation-delay:2s;
  opacity: 1.0;
}
.animate-right-5 {
	animation: fade-in-right ease 2s forwards;
	animation-delay:2.5s;
  opacity: 1.0;
}
.animate-left {
  animation: fade-in-left ease 2s forwards;
  opacity: 1.0;
}
.animate-down {
  animation: fade-in-down ease 1s forwards;
  opacity: 1.0;
}
.animate-down-1 {
	animation: fade-in-down ease 1s forwards;
	animation-delay:0.2s;
  opacity: 1.0;
}
.animate-down-2 {
	animation: fade-in-down ease 1s forwards;
	animation-delay:0.4s;
  opacity: 1.0;
}
.animate-right-fast {
  animation: fade-in-right ease 0.4s forwards;
  opacity: 1.0;
}
.animate-left-fast {
  animation: fade-in-left ease 0.4s forwards;
  opacity: 1.0;
}
.animate-fade {
	animation: fade-in ease 2s forwards;
	opacity:0;
}
.animate-fade-1 {
	animation: fade-in ease 2s forwards;
	animation-delay:0.5s;
	opacity:0;
}
.animate-fade-2 {
	animation: fade-in ease 2s forwards;
	animation-delay:1s;
	opacity:0;
}
.animate-fade-3 {
	animation: fade-in ease 2s forwards;
	animation-delay:1.5s;
	opacity:0;
}
.animate-fade-4 {
	animation: fade-in ease 2s forwards;
	animation-delay:2s;
	opacity:0;
}
.animate-fade-5 {
	animation: fade-in ease 2s forwards;
	animation-delay:2.5s;
	opacity:0;
}
.out {
	
}

.circle {
	position:relative;
}

/* fancy form label wrapper thingy */
.form-control {
	border-radius:0px;
}
.form-label-group {
	position: relative;
	margin-bottom: 1rem;
}

.form-label-group > input,
.form-label-group > label {
	height: 3.125rem;
	padding: .75rem;
}

.form-label-group > label {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	margin-bottom: 0; /* Override default `<label>` margin */
	line-height: 1.5;
	color: #495057;
	pointer-events: none;
	cursor: text; /* Match the input under the label */
	border: 1px solid transparent;
	border-radius: .25rem;
	transition: all .1s ease-in-out;
}

.form-label-group input::-webkit-input-placeholder {
	color: transparent;
}

.form-label-group input:-ms-input-placeholder {
	color: transparent;
}

.form-label-group input::-ms-input-placeholder {
	color: transparent;
}

.form-label-group input::-moz-placeholder {
	color: transparent;
}

.form-label-group input::placeholder {
	color: transparent;
}

.form-label-group input:not(:placeholder-shown) {
	padding-top: 1.25rem;
	padding-bottom: .25rem;
}

.form-label-group input:not(:placeholder-shown) ~ label {
	padding-top: .25rem;
	padding-bottom: .25rem;
	font-size: 12px;
	color: #777;
}

/* Fallback for Edge
-------------------------------------------------- */
@supports (-ms-ime-align: auto) {
	.form-label-group > label {
		display: none;
	}
	.form-label-group input::-ms-input-placeholder {
		color: #777;
	}
}

/* Fallback for IE
-------------------------------------------------- */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	.form-label-group > label {
		display: none;
	}
	.form-label-group input:-ms-input-placeholder {
		color: #777;
	}
}