div.messages {
	margin-bottom: 0px;
}

/* splash */

section.splash {
	text-align: left;
	box-sizing: border-box;
	height: 25rem;
	width: 100%;
	position: relative;
	background-color: #5e5e5e;
	background-image: url('images/splash_home.jpg');
	background-size: cover;
	background-position: 65% 38%;
}

div.splashcontent {
	height: 25rem;
	margin: -25rem auto 0px auto;
	position: relative;
	max-width: 51rem;
	padding-top: 6rem;
	z-index: 2;
	width: 95%;
	box-sizing: border-box;
	color: #ffffff;
}

div.splashcontent h2 {
	width: 60%;
	margin: 0px 0px 1em 0px;
	font-weight: 400;
}

div.splashcontent .btn	{
	color: #ffffff;
	border-color: #ffffff;
}

div.watermark {
	position: absolute;
	left: 50%;
	transform: translate(-50%, 0px);
	right: 0px;
	width: 100%;
	max-width: 51rem;
	top: 0.3rem;
	bottom: 1rem;
	opacity: 0.1;
	z-index: 1;
}

div.watermark img {
	position: absolute;
	left: 0px;
	top: 0px;
	bottom: 0px;
	height: 100%;
}

section.spbus {
	background-image: url('images/splash_bus.jpg');
	background-position: 90% 58%;
}

section.spper {
	background-image: url('images/splash_car.jpg');
	background-position: 58% 40%;
}

section.spfeat {
	background-color: #5c6b97;
	background-image: none;
	height: 16rem;
}

section.spbus div.content, section.spper div.content {
	padding-top: 3rem;
}

div.splashcontent2 {
	padding-top: 5rem;
	max-width: 66rem;
}

div.splashcontent4 {
	max-width: 66rem;
}

div.splashcontent3 {
	height: 16rem;
	margin: -16rem auto 0px auto;
	max-width: 66rem;
	padding-top: 1px;
}

div.splashcontent h1 {
	display: inline-block;
	border: 1px solid #ffffff;
	padding: 0.3rem 1rem;
	font-weight: 900;
	margin: 0px 0px 2rem 0px;
	text-transform: uppercase;
}

div.splashcontent3 h1 {
	border: none;
	margin: 5rem 0px 1rem 0px;
	padding: 0px;
}

div.splashcontent2 h2 {
	width: 100%;
	margin: 0px;
	max-width: 28rem;
}

div.splashcontent3 h2 {
	width: 100%;
	max-width: 45rem;
}

div.splashcontent4 h2 {
	width: 100%;
	max-width: 28rem;
}

div.splashcontent a.btn {
	margin: 1.5rem 0px;
	width: auto;
}

div.watermark2 {
	transform: none;
	left: auto;
	width: 100%;
	right: 5%;
}

div.watermark2 img, div.watermark3 img {
	right: 0px;
	left: auto;
}

img.splashphone {
	float: left;
	height: 100%;
	margin-right: 2rem;
	max-width: auto;
}

/* vid */

div.frontvid {
	background-color: #9ec1d0;
	padding: 0px 8em 0px 0px;
	position: relative;
	box-sizing: border-box;
	width: 90%;
	margin: -1rem 0px 2rem 0px;
}

div.frontvid .vidimg {
	width: 100%;
	display: block;
}

div.frontvid .playbutton {
	position: absolute;
	width: 4em;
	top: 50%;
	margin-top: -2em;
	right: 2em;
}


.bluebox {
	margin-top: 2rem;
	background-color: #9ec1d0;
	color: #ffffff;
	padding: 1.5rem;
}

.bluebox li {
	margin-bottom: 1rem;
	font-weight: 600;
}

.icon {
	display: block;
	width: 5rem;
	margin: 0px auto 0.5rem auto;
}


section.lavender {
	background-color: #f5f0fb;
}

section.turquoise {
	background-color: #ddeaef;
}

section.grey {
	background-color: #dbdfe8;
}

section.van {
	font-family: RobotoSlab, serif;
	font-weight: 500;
	font-size: 15px;
	line-height: 200%;
	color: #ffffff;
	background-color: #7b6344;
	background-image: url('images/splash_drive.jpg');
	background-size: cover;
	background-position: 33% 62%;
	text-shadow: 1px 1px 2px #7b6344;
}

section.van div.flexcontainer {
	min-height: 15vw;
}

section.last {
	margin-bottom: -4rem;
}

section.blue {
	background-color: #9ec1d0;
	font-family: RobotoSlab, serif;
	font-weight: 500;
	font-size: 15px;
	line-height: 150%;
	color: #ffffff;
	margin-top: 2rem;
	position: relative;
}

section.blue div.col {
	position: relative;
}

div.colcontent_wide {
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 2rem;
	width: calc(50vw - 2rem);
	overflow: hidden;
}

section.blue img {
	min-height: 100%;
	min-width: 100%;
	max-width: none;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	left: 50%;
}


@media screen and (max-width: 58em) {
	section.splash {
		height: 18rem;
	}
	
	div.splashcontent {
		height: 18rem;
		margin-top: -18rem;
		padding-top: 4rem
	}

	div.splashcontent2 {
		padding-top: 2rem
	}

	section.spfeat {
		height: 12rem;
	}

	div.splashcontent3 {
		height: 12rem;
		margin-top: -12rem;
		padding-top: 0px
	}

	div.splashcontent3 h1 {
		margin-top: 3rem;
	}

	div.colcontent_wide {
		left: 1rem;
		width: calc(50vw - 1rem);
	}
}

@media screen and (max-width: 48em) {
	section.last {
		margin-bottom: -2rem;
	}
}

@media screen and (max-width: 42em) {
	div.splashcontent3 h2 {
		font-size: 14pt;
	}

	div.colcontent_wide {
		position: static;
		width: 100vw;
		margin: 0px -1rem;
		box-sizing: content-box;
	}

	section.blue img {
		min-height: 0px;
		width: 100%;
		position: static;
		transform: translate(0px, 0px);
	}

}

@media screen and (max-width: 30em) {
	section.splash {
		height: 8rem;
		padding-top: 8rem;
	}
	
	div.splashcontent {
		height: auto;
		margin-top: 0px;
		margin-bottom: -2rem;
		padding-top: 1rem;
		color: #000000;
		text-align: center;
	}

	div.splashcontent .btn, div.splashcontent h1 {
		color: #000000;
		border-color: #000000;
		margin-left: auto;
		margin-right: auto;
	}

	section.splash div.content {
		padding-top: 1em;
	}

	div.watermark {
		bottom: 0.3rem;
	}

	div.splashcontent h2 {
		width: 100%;
	}

	div.splashcontent3 h1 {
		margin-top: 1rem;
	}

	img.splashphone {
		float: none;
		position: absolute;
		top: -8rem;
		height: 8rem;
		left: 0px;
	}

}

.sgp p {
	margin-bottom: 0.5em;
}

/* clients */

div.clients {
	margin: 0px;
	text-align: center;
	width: 100%;
}

div.clients img {
	width: 100%;
	margin: 1em;
	max-width: 9em;
}

div.clients img.tall {
	max-width: 6em;
}

div.clients img.wide {
	max-width: 12em;
}

@media screen and (max-width: 15em) {
	div.clients img {
		margin: 1em 0px;
	}
}

@media screen and (max-width: 10em) {
	div.clients img.tall {
		max-width: 5em;
	}
}

/* misc */

p.hiw {
	text-transform: uppercase;
	font-size: 110%;
	margin-bottom: 0px;
	letter-spacing: 0.1em;
}


@media screen and (max-width: 58em) {
	div.frontvid {
		font-size: 80%;
		width: 100%;
	}
}

@media screen and (max-width: 42em) {
	div.frontvid {
		font-size: 100%;
		margin-bottom: 0px;
	}

	p.hiw {
		text-align: center;
	}
}

@media screen and (max-width: 30em) {
	div.frontvid {
		font-size: 60%;
	}
}

/* forms */

div.radio {
	margin: 0.5em 0px;
}

div.radio label {
	width: auto;
	margin-bottom: 0.5em;
}

textarea {
	height: 6em;
	resize:vertical;
}

button.giftbtn {
	color: #000000;
	background-color: #ffffff;
	width: auto;
	font-size: 110%;
	border-color: #d100e1;
}

input:focus, textarea:focus, select:focus {
	outline: none;
	border-color: #070095;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(32, 166, 212, 0.8);
	-moz-box-shadow: 0px 0px 5px 0px rgba(32, 166, 212, 0.8);
	box-shadow: 0px 0px 5px 0px rgba(32, 166, 212, 0.8);
}

.has-error input, .has-error textarea, .has-error select {
	-webkit-box-shadow: 0px 0px 5px 0px rgba(255, 0, 0, 0.8);
	-moz-box-shadow: 0px 0px 5px 0px rgba(255, 0, 0, 0.8);
	box-shadow: 0px 0px 5px 0px rgba(255, 0, 0, 0.8);
}