@charset "UTF-8";
/*dkGreen4 #003e1a, dkGreen3 #005108, dkGreen2 #006838, dkGreen #009444, ltGreen #0cc000, ltrGreen #7af400, dkBlue #004a9a, medBlue #258eff, orange #f7941d, blue2 #004084, blue3 #00316*/
html, body {height: 100%;}
body {margin: 0; font-family: 'Ubuntu', sans-serif; text-align: center;}
#above {
	/*min-height: 100%;*/
	min-height: auto;
	background-image: url(../index_files/ThinkstockPhotos-200389470-001_1700x1100.jpg);
	background-position: left center;
	background-size: cover;
	background-repeat: no-repeat;
	position: relative;
	padding-bottom: 12px;
}
#above * {margin-top: 0; margin-bottom: 0;}

.groundWhite {background: #fff;}
.groundBlack {background: #000; color: #fff;}
.groundPalm {
	background-color: #003e1a;
	background-image: url(../index_files/bigFrond.svg);
	background-repeat: no-repeat;
	background-size: 1200px auto;
	background-attachment: fixed;
	background-position: center 20%;
}
header {
	max-width: 1000px;
	margin: 0 auto;
	position: relative;
	text-align: right;
	padding: 14px 12px 10px 12px;
}
#logo {
	width: 240px;
	float: left;
}
#phone {
	font-size: 28px;
	font-weight: 700;
	white-space: nowrap;
	color: #fff;
	padding-left: 12px;
}
#phone a {text-decoration: none; color: #fff;}

#navLink {
	width: 16px;
	position: relative;
	top: -4px;
	margin-left: 6px;
}

#topNav {
	max-width: 1000px;
	max-height: 0px;
	background: #000;
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-o-transition: all .5s ease-in-out;
	-ms-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out;
	position: relative;
	z-index: 108;
	overflow: hidden;
}
#topNav a {
	display: block;
	text-decoration: none;
	color: #ccc;
	padding: 10px;
	line-height: 1.0;
	border-top: 1px solid #ccc;
	white-space: nowrap;
}
#topNav a:hover {text-decoration: none; color: #fff;}

#formBox {
	width: 90%;
	max-width: 500px;
	position: static;
	margin: 30px auto 0 auto;
	padding: 30px;
	color: #000;
	border-radius: 0 0 20px 20px;
	background-color: rgba(255,255,255,.8);
}
#headline {font-size: 2.0rem; font-weight: normal; line-height: 1.0;}
button {
	border-radius: 8px;
	padding: 12px 20px 16px 20px;
	background: linear-gradient(#00aeef, #7ff8ff);
	color: #000;
	border: none;
	font-size: 2.0rem;
	font-weight: 700;
	cursor: pointer;
}
button:hover {background: #7ff8ff;}
#above p {padding: .56em 0;}
#above h1 {padding: .34em 0;}
#above h2 {padding: .38em 0;}

/*********** end of #above stuff *************/

#below {background: #f00;}
.dontBreak {white-space: nowrap;}
.clearing {clear: both;}
.smallPrint {font-size: .8rem;}
h1 {font-size: 2.0rem;}

section {
	padding: 10px;
	max-width: 1024px;
	margin: 0 auto;
}
#about img {width: 100%;}
#about p {max-width: 700px; text-align: left;}
#serious {color: #fff;}
#serious img {width: 140px;}
#secret {max-width: 700px;}
#secret img {max-width: 300px;}
#secret p {text-align: left; margin-top: 0;}
footer {
	max-width: 1024px;
	margin: 0 auto;
	padding: 20px 15px;
	color: #999;
}
#selectNav {
	max-width: 740px;
	width: 100%;
	box-sizing: border-box;
	background: #000;
	color: #999;
	font-size: 1.0rem;
	-webkit-appearance: none;
	padding: 6px 10px;
}
footer a {
    font-size: .8rem;
    text-decoration: none;
    color: #999;
    padding: 0 12px 0 10px;
    border-left: 1px solid #ccc;
}
footer a:hover {text-decoration: none; color: #ccc;}
footer a:first-child {border: none;}



/******* grid stuff ***********/
* {box-sizing: border-box;}
/* selects every element whose class attribute contains the substring "col-" */
[class*="col-"] {float: left; padding: 15px;}
/* Insert something after the content of each .row */
.row::after {content: ""; clear: both; display: block; text-align: left;}
/* for phones */
[class*="col-"] {width: 100%;}

@media screen and (min-width: 359px) {
	#headline {font-size: 3.0rem;}
	#serious img {width: 200px;}
}
@media screen and (min-height: 515px) {
	#above {min-height: 100%;}
}
@media screen and (min-width: 550px) {
	#phone {font-size: 32px;}
	#navLink {display: none;}
	#topNav {
		margin: 0 auto;
		text-align: right;
		overflow: visible;
		top: 6px;
		background: transparent;
	}
	#topNav a {
		display: inline;
		text-decoration: none;
		color: #000;
		border-top: none;
	}
	#topNav a:hover {text-decoration: none; color: #0cc000;}
}
@media screen and (min-width: 550px) and (min-height: 515px) {
	#formBox {
		position: absolute;
		top: 25%;
		left: 50%;
		transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		color: #000;
		padding: 30px;
		border-radius: 0 0 20px 20px;
		background-color: rgba(255,255,255,.5);
	}
	section {padding: 40px 10px;}
}
@media screen and (min-width: 740px) {
	#headline {font-size: 4.0rem;}
}
/* for tablets */
@media screen and (min-width: 600px) {
.col-m-1 {width: 8.33%;}
.col-m-2 {width: 16.66%;}
.col-m-3 {width: 25%;}
.col-m-4 {width: 33.33%;}
.col-m-5 {width: 41.67%;}
.col-m-6 {width: 50%;}
.col-m-7 {width: 58.33%;}
.col-m-8 {width: 66.67%;}
.col-m-9 {width: 75%;}
.col-m-10 {width: 83.33%;}
.col-m-11 {width: 91.67%;}
.col-m-12 {width: 100%;}
}
/* for desktop */
@media screen and (min-width: 768px) {
.col-1 {width: 8.33%;}
.col-2 {width: 16.67%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.67%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.67%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.67%;}
.col-12 {width: 100%;}
}